/* Last layer: preserve original geometry, expose the ambient lighting controls. */
#app::before,#creatorApp::before,#sPlay::before,#drawer::before{background:radial-gradient(ellipse at 15% 30%,color-mix(in srgb,var(--experience-cool,#d8e5f0) 18%,transparent),transparent 56%),linear-gradient(120deg,transparent 30%,#ffffffc9 48%,transparent 68%);animation-duration:var(--experience-key-time,18s);opacity:var(--experience-light-opacity,.18)}
#app::after,#creatorApp::after,#sPlay::after,#drawer::after{animation-duration:var(--experience-sweep-time,11s);background:linear-gradient(112deg,transparent 35%,color-mix(in srgb,var(--experience-warm,#efe5d5) 20%,transparent) 44%,#ffffffdd 49%,#ffffffee 51%,transparent 66%);opacity:var(--experience-light-opacity,.18)}
#portraitAdjust{padding:12px;border:1px solid #e6e7ea;border-radius:14px}#portraitAdjust label{margin:8px 0}#portraitAdjust input{width:100%;min-height:32px}
body,#creatorApp,#sPick,#sPlay,#sEnd,#drawer{background-color:var(--experience-paper,#fff);color:var(--experience-ink,#0b0b0d)}.wordmark span,.eyebrow{color:var(--experience-accent,#db0000)}.hero img{animation-duration:var(--experience-fill-time,23s)}#welcomeLead{white-space:pre-line}
#app::before,#creatorApp::before,#sPlay::before,#drawer::before,#app::after,#creatorApp::after,#sPlay::after,#drawer::after{filter:opacity(var(--experience-light-opacity,.18))}
@media(prefers-reduced-motion:reduce){#app::before,#creatorApp::before,#sPlay::before,#drawer::before,#app::after,#creatorApp::after,#sPlay::after,#drawer::after{animation:none!important}}

/* Snow-white arena: ambient color stays in the moving light layer. */
#sPlay{background-image:radial-gradient(ellipse at 48% 60%,#fff 0%,#fdfdfd 70%,#f7f8f9 100%)}

#vaultTrigger{display:flex;align-items:center;justify-content:center;gap:8px}#vaultTrigger::before{content:'';display:block;flex:0 0 20px;width:20px;height:20px;background:currentColor;-webkit-mask:url('/assets/icon-vault.svg') center/contain no-repeat;mask:url('/assets/icon-vault.svg') center/contain no-repeat;filter:none;animation:none;position:static;opacity:1;transform:none}

/* Canonical HaMedina arena: one persistent HUD, contextual guidance. */
#sPlay{--red:var(--arena-accent,#C8102E);color:var(--arena-ink,#0D0D0C);background:var(--arena-paper,#fff)}
#sPlay .challenge-strip,#sPlay .legend,#sPlay .arena-phase,#sPlay .tbar{display:none}
#sPlay .hud{top:calc(16px + var(--sat));padding-inline:20px;gap:8px}
#sPlay .hud .sc{font-size:36px;letter-spacing:-1px;color:var(--arena-ink,#0D0D0C)}
#sPlay .hud .sc small{font-size:11px;margin-top:4px;color:#73777d}
#sPlay .hud .lv{padding-top:16px;margin-inline-start:6px;gap:4px}#sPlay .hud .lv i{width:6px;height:6px;background:var(--arena-accent,#C8102E);box-shadow:none}#sPlay .hud .lv i.off{background:#e8e8e8}
#sPlay .ic{width:var(--arena-controlSize,44px);height:var(--arena-controlSize,44px);min-width:44px;border-radius:12px;border:1px solid #eee;box-shadow:none;background:#fff;color:var(--arena-ink,#0D0D0C);display:grid;place-items:center;padding:0}
#sPlay .ic svg{width:var(--arena-iconSize,20px);height:var(--arena-iconSize,20px);stroke-width:var(--arena-iconStroke,1.7)}#sPlay .ic:focus-visible{outline:2px solid var(--arena-accent);outline-offset:3px}
#sPlay .hud .tm{top:105px;left:20px;width:48px;height:48px;font-size:21px;box-shadow:none;outline:0;background:radial-gradient(circle,#fff 65%,transparent 67%),conic-gradient(var(--arena-accent,#C8102E) var(--remaining,100%),#eee 0)}
#sPlay .hud .tm:after{font-size:10px;top:53px;color:#73777d}
#sPlay .combo-tag{display:none;top:210px;left:20px;transform:none;width:48px;color:var(--arena-accent,#C8102E)}#sPlay[data-combo="true"] .combo-tag{display:block}#sPlay .combo-tag b{font-size:23px}#sPlay .combo-tag i,#sPlay .combo-tag small{display:none}
#sPlay .play-help{display:none;inset-inline:24px;bottom:calc(92px + var(--sab));font-size:12px;color:#686d75;line-height:1.5}#sPlay[data-instructions="true"] .play-help{display:block}
#sPlay .vault-trigger{background:#fff;color:var(--arena-ink,#0D0D0C);box-shadow:none;border:1px solid #e7e7e7;border-radius:12px;min-height:46px;font-size:12px;bottom:calc(16px + var(--sab));left:20px;right:20px}#sPlay .vault-trigger:disabled{color:#777;background:#fff}#sPlay .vault-trigger.ready{background:#fff;color:var(--arena-accent,#C8102E);border-color:var(--arena-accent,#C8102E)}
#sPlay .count{font-size:40px;color:var(--arena-ink,#0D0D0C);text-shadow:none}