/* An untimed, label-accessible palette puzzle and optional sound. */
.palette-studio{scroll-margin-top:30px}.palette-heading{display:flex;justify-content:space-between;align-items:center;gap:35px;margin-bottom:28px}.palette-heading p{font-size:13px;line-height:1.9;color:var(--muted);max-width:650px;margin:17px 0 0}.palette-shell{position:relative;isolation:isolate;overflow:hidden;min-height:280px;border:1px solid #b8946760;border-radius:28px;background:radial-gradient(ellipse at 75% 0,#19433240,transparent 60%),#141515}.palette-play{padding:34px}.palette-round{display:flex;justify-content:space-between;align-items:center;gap:20px}.palette-round>span{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--mutedgold)}.palette-round h3{font-size:25px;color:var(--gold)}.palette-instructions{font-size:12px;line-height:1.9;color:var(--muted);max-width:780px;margin:22px 0}.palette-boards{display:grid;grid-template-columns:1fr 1fr;gap:26px}.palette-boards h4,.palette-choices legend{font-size:11px;font-weight:500;letter-spacing:.08em;color:#d8d2c8;margin-bottom:13px}.palette-reference,.palette-selection{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;list-style:none;padding:0;margin:0}.palette-chip{position:relative;padding:10px;border:1px solid #b8946740;border-radius:15px;background:#090b0b70;font-size:10px;line-height:1.5;text-align:center;overflow-wrap:anywhere}.palette-chip b{position:absolute;top:16px;left:16px;display:grid;place-content:center;width:20px;height:20px;border-radius:50%;background:#0a0b0cce;color:#f5ecdb;font-size:10px;font-weight:400}.palette-sample{display:block;height:65px;border-radius:8px;margin-bottom:9px;background:repeating-linear-gradient(135deg,#242424 0,#242424 5px,#1d1d1d 5px,#1d1d1d 10px)}.palette-choices{border:0;margin:26px 0 0;padding:0}.palette-choices>div{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}.palette-swatch{position:relative;background:#1b1c1b;border:1px solid #b894673b;border-radius:15px;padding:9px;color:var(--ivory);cursor:pointer;font:inherit;min-height:108px;text-align:center;transition:border-color .2s,transform .2s}.palette-swatch:hover{border-color:var(--gold);transform:translateY(-2px)}.palette-swatch[aria-pressed=true]{border-color:var(--gold);box-shadow:0 0 0 2px #b8946745}.palette-swatch-color{display:block;height:52px;border-radius:8px;margin-bottom:9px}.palette-swatch-name{font-size:10px;line-height:1.4;display:block;overflow-wrap:anywhere}.palette-chosen{position:absolute;right:14px;top:14px;width:22px;height:22px;color:white;background:#111a;border-radius:50%;font-size:14px}.palette-chosen:empty{display:none}.palette-status{min-height:42px;color:#d5c7b1;line-height:1.8;font-size:12px;margin:24px 0 16px}.palette-status.is-success{color:#abdbc3}.palette-actions{display:flex;align-items:center;flex-wrap:wrap;gap:20px}.palette-actions .button{font-size:11px;min-width:0;padding:15px 20px;gap:18px}.palette-actions .text-link{font-size:11px;background:none;border:0;color:var(--gold);padding:12px 0}.palette-actions>[data-palette-next]{margin-left:auto}.palette-note{font-size:10px;line-height:1.8;color:var(--muted);max-width:800px;margin:17px 0 0}.sound-toggle{position:fixed;right:20px;bottom:20px;z-index:25;display:flex;align-items:center;gap:8px;max-width:220px;min-height:42px;padding:10px 14px;border-radius:24px;border:1px solid #b8946766;background:#151716ed;color:#d4c3a8;box-shadow:0 6px 25px #0006;font:inherit;font-size:10px;line-height:1.4;text-align:left}.sound-toggle svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;flex-shrink:0}.sound-toggle .sound-waves{display:none}.sound-toggle.is-on .sound-waves{display:block}.sound-toggle.is-on .sound-muted{display:none}.sound-toggle.is-on{border-color:var(--gold);color:var(--gold)}
@media(max-width:760px){.palette-heading{display:block}.palette-heading p{font-size:12px}.palette-shell{border-radius:20px;min-height:270px}.palette-play{padding:21px 16px}.palette-round{display:block}.palette-round h3{font-size:22px;margin-top:8px}.palette-instructions{font-size:11px}.palette-boards{grid-template-columns:1fr;gap:20px}.palette-choices>div{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.palette-chip{font-size:10px}.palette-sample{height:58px}.palette-swatch-name{font-size:10px}.palette-actions{gap:16px}.palette-actions .button{width:100%;justify-content:center}.palette-actions .text-link{margin:auto}.palette-actions>[data-palette-next]{margin-left:0}.sound-toggle{right:18px;bottom:94px;padding:9px 11px;min-height:38px;max-width:170px;font-size:9px}.palette-note{font-size:9px}}
@media(prefers-reduced-motion:reduce){.palette-swatch:hover{transform:none}}
/* On compact screens, sound lives beside the existing contact bar instead of covering game content. */
@media(max-width:760px){.sticky-book{right:66px}.sound-toggle{right:14px;bottom:12px;width:44px;min-height:59px;max-width:44px;padding:9px;justify-content:center;border-radius:16px;z-index:31}.sound-toggle svg{width:20px;height:20px}.sound-toggle [data-sound-label]{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}}
@media print{.sound-toggle,.palette-studio{display:none}}
/* Two separately generated, explicitly illustrative portraits, aligned under a direct-manipulation slider. */
.style-comparison{display:grid;grid-template-columns:.8fr 1.2fr;gap:55px;align-items:center;scroll-margin-top:32px}.comparison-copy h2{font-size:clamp(30px,3.6vw,48px);line-height:1.2;color:var(--gold)}.comparison-intro{font-size:14px;line-height:1.9;color:var(--ivory);margin:24px 0}.comparison-help{font-size:12px;line-height:1.9;color:var(--muted);margin:20px 0}.comparison-disclaimer{font-size:11px;line-height:1.9;color:#c4b9a7;padding-top:20px;border-top:1px solid var(--line)}.comparison-figure{margin:0;min-width:0}.comparison-figure>figcaption{font-size:12px;line-height:1.8;padding:16px 19px;border:1px solid #b8946770;border-radius:16px;background:#252117;color:#f0d9b3;margin-bottom:18px}.comparison-labels{display:flex;justify-content:space-between;gap:16px;font-size:10px;line-height:1.5;color:var(--mutedgold);margin:0 4px 12px}.comparison-labels span{max-width:48%}.comparison-labels span:last-child{text-align:right}.comparison-frame{position:relative;isolation:isolate;width:100%;aspect-ratio:1;overflow:hidden;border:1px solid #b8946766;border-radius:24px;background:#111;touch-action:pan-y;user-select:none}.comparison-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;pointer-events:none;user-select:none}.comparison-tattoo{clip-path:inset(0 calc(100% - var(--comparison-position)) 0 0);z-index:1}.comparison-divider{position:absolute;top:0;bottom:0;left:var(--comparison-position);width:2px;transform:translateX(-1px);background:#eed4a2;z-index:2;pointer-events:none;box-shadow:0 0 12px #0009}.comparison-divider>span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:48px;height:48px;display:grid;place-items:center;border:1px solid #f4deb5;border-radius:50%;background:#211b13e8;box-shadow:0 5px 20px #0007}.comparison-divider svg{width:31px;height:20px;fill:none;stroke:#f4deb5;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.comparison-range{position:absolute;inset:0;z-index:3;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;touch-action:pan-y}.comparison-frame:focus-within{outline:3px solid #dfba79;outline-offset:5px}.comparison-controls{display:flex;justify-content:space-between;gap:18px;margin-top:16px}.comparison-controls button{background:none;border:1px solid var(--line);border-radius:12px;padding:12px 14px;color:var(--gold);font:inherit;font-size:10px;line-height:1.5;text-align:left;min-height:44px}.comparison-controls button:last-child{text-align:right}.comparison-controls button[aria-pressed=true]{background:#b8946728;border-color:var(--gold)}
@media(max-width:760px){.style-comparison{grid-template-columns:1fr;gap:27px}.comparison-copy h2{font-size:30px}.comparison-intro{font-size:13px;margin:20px 0}.comparison-help,.comparison-disclaimer{font-size:11px}.comparison-figure>figcaption{font-size:11px;padding:14px 16px}.comparison-frame{border-radius:20px}.comparison-labels{font-size:10px}.comparison-controls{gap:12px}.comparison-controls button{font-size:10px;flex:1}.comparison-divider>span{width:44px;height:44px}}
@media print{.style-comparison{display:none}}