/* Original has no color overrides: its saved visual settings remain intact. */
.palette-picker{position:sticky;top:10px;z-index:6;display:flex;gap:4px;width:max-content;max-width:calc(100% - 24px);margin:20px auto 0;padding:6px;background:#180e29dc;border:1px solid #c9a9ee33;border-radius:30px;backdrop-filter:blur(18px);box-shadow:0 10px 35px #0004}
.palette-picker button{display:flex;gap:8px;align-items:center;border:1px solid transparent;background:transparent;color:#e1d6ed;border-radius:25px;padding:11px 16px;min-height:44px;font-size:13px}
.palette-picker i{width:12px;height:12px;border-radius:50%;box-shadow:0 0 0 1px #ffffff40;flex:none}
.palette-picker button[aria-pressed=true]{background:#bd91ea25;border-color:#cfb3ef66;color:#fff}
/* A restrained warm adjustment; the original nebula image is not recolored. */
:root[data-palette=warm]{--accent:#ccb1f2}
:root[data-palette=warm] .cosmos-shade:after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 80% 35%,rgba(202,112,145,.055),transparent 75%)}
:root[data-palette=warm] :is(.practice,.practice-main,.approach,.question-form,.result-sidebar,.journal-entry,.journal-empty,.result-body,.art-caption){background:linear-gradient(120deg,#a06ac726,#3d244735);border-color:#dec3fb30}
:root[data-palette=warm] .primary-button{background:linear-gradient(135deg,#aa84e4,#8962cd)}
:root[data-palette=warm] .primary-button:hover:not(:disabled){background:linear-gradient(135deg,#bd98ee,#9b73db)}
:root[data-palette=warm] .hero h1 em{background-image:linear-gradient(105deg,#eee0fc 5%,#b585e8 90%)}
:root[data-palette=warm] .question-intro h1 em{color:#ccaaf3}
@media(max-width:700px){.palette-picker{margin-top:16px;gap:2px;padding:5px}.palette-picker button{padding:9px 10px;font-size:12px;gap:6px}.palette-picker i{width:10px;height:10px}}

/* Gold is a reversible accent treatment over the original purple environment. */
:root[data-palette=gold]{--accent:#e2bf7d;--line:rgba(224,185,108,.22)}
:root[data-palette=gold] .hero h1 em{background-image:linear-gradient(110deg,#fff0cb 5%,#e3bd72 55%,#bc8b40 100%)}
:root[data-palette=gold] :is(.eyebrow,.practice h3,.practice-number,.practice-tag,.practice-arrow,.question-intro h1 em,.approach h2 em,.interpretation h2,.art-caption:before,.intro-strip i){color:#e8c88f}
:root[data-palette=gold] .brand-name{color:#f0d9ac}
:root[data-palette=gold] .brand-mark{filter:sepia(.8) saturate(1.3) hue-rotate(350deg)}
:root[data-palette=gold] .primary-button{background:linear-gradient(120deg,#f1d8a2,#d9af60 62%,#c39443);border-color:#ffe2a780;color:#23172d;box-shadow:0 8px 30px #c9923535,inset 0 1px 0 #fff1ce80}
:root[data-palette=gold] .primary-button:hover:not(:disabled){background:linear-gradient(120deg,#ffe7b8,#e8c277);box-shadow:0 10px 35px #d2a34b45}
:root[data-palette=gold] :is(.intro-strip,.practice,.approach,.question-form,.result-sidebar,.result-body,.journal-entry,.journal-empty,.art-caption,.mobile-nav){border-color:#dcba793d;box-shadow:0 20px 55px #0004,inset 0 1px 0 #f4dba21a}
:root[data-palette=gold] .practice:before{content:'';position:absolute;right:0;top:35px;width:215px;height:195px;pointer-events:none;background:radial-gradient(ellipse,#dca74b30,transparent 66%)}
:root[data-palette=gold] .practice-art{filter:drop-shadow(0 0 1px #ffe3a4) drop-shadow(0 0 7px #dfad5380) drop-shadow(0 10px 15px #08041099)}
:root[data-palette=gold] .mini-card{border-color:#e9c481aa;box-shadow:0 0 3px #f3d29a80,0 0 18px #dba34145,0 14px 26px #0007}
:root[data-palette=gold] :is(.practice-arrow,.practice-tag,.back-emblem,.card-back,.flip-front,.flip-back){border-color:#e6be754d}
:root[data-palette=gold] .card-back.selected{border-color:#f3d091;box-shadow:0 0 0 1px #dca74b80,0 0 24px #d8a34845}
:root[data-palette=gold] .step-tracker i.current{background:#e2bc77;box-shadow:0 0 8px #e2bc7740}
:root[data-palette=gold] .topic-button[aria-pressed=true]{background:#d3a65625;border-color:#dfb57080;color:#f5e2ba}
:root[data-palette=gold] .palette-picker button[aria-pressed=true]{background:#bc8b3622;border-color:#dfba7066;color:#f6e5c6}
:root[data-palette=gold] .mobile-nav a.active{color:#f3d7a2}
@media(max-width:700px){:root[data-palette=gold] .practice:before{top:34px;right:0;width:180px;height:180px}}