@import url("https://fonts.googleapis.com/css2?family=Assistant:wght@400;500;600;700;800&display=swap");
/* Canonical values: eskai /opt/hamedina-bechirot/web/assets/brand.css.
   Snow is the user's surface choice; studio motion and CLASTOP geometry are retained. */
:root{--ink:#0b0b0d;--char:#1a1a1d;--paper:#fdfdfd;--snow:#fff;--soft:#f3f4f6;--hair:#e6e7ea;--grey:#5f6470;--mute:#9aa0aa;--red:#db0000;--red-deep:#a80000;--live:#f5161b;--yel:#f2b921;--f:"Assistant",system-ui,"Segoe UI",Arial,sans-serif;--r:14px;--r-l:22px;--shadow:0 10px 30px rgba(10,10,14,.12);--studio-ink:var(--ink);--studio-muted:var(--grey);--studio-edge:var(--hair);--studio-card-shadow:0 0 2px #0b0b0d12,0 12px 24px -4px #0b0b0d0a;color-scheme:light}
body{font:400 16px/1.5 var(--f);color:var(--ink);background:var(--snow);-webkit-font-smoothing:antialiased}
#app,#creatorApp,#sPlay,#drawer{background:var(--snow);color:var(--ink)}
h1,h2,.big-score b,.metrics b{color:var(--ink);font-weight:900;letter-spacing:-.02em}
.wordmark,.wm{color:var(--char);font-family:var(--f);font-weight:900;letter-spacing:-.02em}.wordmark span,.wm i{color:var(--red)}
.lead,.fine,.text-link,.cover span,.cover i,.creator-card p,.metrics span,header>span,header>a:not(.wordmark),.studio-masthead,.studio-index,.intro .kick,.intro .skip,.tile small,.pick p.sub,#sEnd .challenge-result,#sEnd #creatorResult p{color:var(--grey)}
.eyebrow{color:var(--red);font-weight:800;letter-spacing:.04em}.eyebrow:before,.studio-masthead span:first-child:before{background:var(--red)}.steps b{color:var(--red)}.steps{color:var(--grey)}
.primary,.btn,.btn.red,.intro .btn.cta,#drawer .btn.red,#sEnd #creatorResult .btn{background:var(--ink);color:var(--snow);border-radius:var(--r);box-shadow:0 6px 18px #0b0b0d0c;font-family:var(--f)}
.secondary,.btn.ghost{background:var(--snow);color:var(--ink);border-radius:var(--r);border-color:var(--hair);box-shadow:inset 0 0 0 1px var(--hair)}
.creator-card,.metrics>div,#sEnd .card2,#sEnd #creatorResult,.photo-pick{border-color:var(--hair);border-radius:var(--r-l);box-shadow:var(--studio-card-shadow)}
.cover{background:linear-gradient(125deg,var(--soft),var(--snow) 65%);border-color:var(--snow)}.cover b,.creator-card h2,.studio-index b,.pick h1 b{color:var(--ink)}
.avatar,.portrait{background:var(--soft);color:var(--grey)}input:not([type=file]),textarea,details{border-color:var(--hair);border-radius:var(--r);color:var(--ink);background:var(--snow)}input:focus,textarea:focus{border-color:var(--ink);box-shadow:0 0 0 3px #0b0b0d08}
.example,.local-note,.score-placeholder{background:var(--soft);color:var(--grey);border-color:var(--hair)}#creatorApp header,.pick .top,.studio-masthead,.studio-index{border-color:var(--hair)}
.tile{border-radius:var(--r);border-color:var(--hair)}.tile:before{border-radius:var(--r) var(--r) 0 0;background:linear-gradient(125deg,var(--soft),var(--snow))}.tile[aria-pressed=true]{box-shadow:0 0 0 1.5px var(--red),var(--studio-card-shadow)}.tile .ck{background:var(--red)}
.intro .lid{fill:var(--ink)!important}.intro .slogan .r{color:var(--red)}.intro .kick{color:var(--grey)}
#sPlay .combo-tag,#sPlay .hud .tm.urgent,#sPlay[data-phase=final] .arena-phase b{color:var(--red)}#sPlay .combo-tag i{background:linear-gradient(to right,var(--red) var(--combo-fill,0%),var(--hair) 0)}
#sPlay .hud .tm{background:radial-gradient(circle,var(--snow) 63%,transparent 65%),conic-gradient(var(--red) var(--remaining,100%),var(--hair) 0)}#sPlay .hud .lv i{background:var(--red)}#sPlay .hud .lv i.off{background:var(--hair)}#sPlay .challenge-strip{background:#ffffffd9;box-shadow:inset 0 0 0 1px var(--hair)}#sPlay .challenge-strip small,#sPlay .legend,.arena-phase,#sPlay .play-help{color:var(--grey)}.arena-phase b,#sPlay .count,#sPlay .count.red{color:var(--ink)}
#sPlay .vault-trigger{background:linear-gradient(120deg,var(--char),var(--ink));border-color:var(--hair);box-shadow:0 8px 20px #0b0b0d14}#sPlay .vault-trigger:disabled{color:#c4c6cb}#sPlay .vault-trigger.ready{background:var(--char);border-color:var(--yel);color:#fff1c7}
#drawer .s1d-h{border-color:var(--hair)}#drawer h2 b,#drawer .vault-code,#drawer .vault-pad button{color:var(--ink)}#drawer .safe-art{color:var(--grey);background:linear-gradient(145deg,var(--snow),var(--soft))}#drawer .vault-pad button:active{background:var(--soft);color:var(--ink)}#drawer .card .under{background:radial-gradient(ellipse at 80% 80%,#f2b9210a,transparent 65%),var(--snow)}
/* Neutral studio key and specular sweep; no blue or burgundy brand substitute. */
#app:before,#creatorApp:before,#sPlay:before,#sPlay[data-phase=final]:before,#drawer:before{background:radial-gradient(ellipse at 15% 30%,#e6e7ea40,transparent 56%),linear-gradient(120deg,transparent 30%,#ffffffdc 48%,transparent 68%)}
#app:after,#creatorApp:after,#sPlay:after,#drawer:after{background:linear-gradient(112deg,transparent 35%,#e6e7ea30 44%,#ffffffdd 49%,#ffffffee 51%,#e6e7ea20 57%,transparent 66%)}
.hero img{filter:drop-shadow(-4px 0 5px #e6e7ea70) drop-shadow(5px 8px 12px #0b0b0d18)}@keyframes box-rim{to{filter:drop-shadow(4px 0 6px #f6f1e880) drop-shadow(-5px 8px 12px #0b0b0d18)}}
:focus-visible{outline:3px solid var(--red);outline-offset:3px}

/* Assistant for the experience; the original Heebo wordmark is preserved. */
.wordmark,.wm{font-family:"Heebo",system-ui,Arial,sans-serif;font-weight:900}
body,button,input,textarea,select{font-family:var(--f)}
h1,h2,.big-score b,.metrics b,.intro .slogan{font-family:var(--f);font-weight:800;letter-spacing:-.025em}
#creatorApp h1{font-size:clamp(36px,10.7vw,44px);line-height:1.12;margin:12px 0 18px;text-wrap:balance}
#welcome{text-align:center}
#welcome .eyebrow,#welcome .lead{margin-inline:auto}
#welcome .lead{max-width:32ch;font-size:17px;line-height:1.55}
#welcome .steps{justify-content:space-around;text-align:center}
#creatorApp .eyebrow{letter-spacing:0;font-size:12px}
#creatorApp .primary,#creatorApp .secondary{font-size:17px;font-weight:700;line-height:1.3}
#creatorApp .fine{font-size:13px;line-height:1.55}
#creatorApp .text-link{font-size:14px}
#creatorApp .lead{font-weight:400}
#creatorApp label{text-align:right;font-size:15px;font-weight:600}
#creatorApp .metrics{text-align:center}
.hud .tm,.hud .sc,.big-score b,.metrics b,.vault-code,.treasure-total{font-variant-numeric:tabular-nums lining-nums;font-weight:800;letter-spacing:0}
#creatorApp input,#creatorApp textarea{font-size:17px;line-height:1.5}
@media(max-height:750px){#welcome .hero{height:195px}#welcome .hero img{width:265px}#welcome .steps{margin:22px 0 18px}}
/* Keep the result and its next action together on small phones. */
#sEnd{gap:7px;padding:calc(env(safe-area-inset-top) + 10px) 16px calc(env(safe-area-inset-bottom) + 10px)}
#sEnd .card2{height:min(32dvh,270px);width:auto;max-width:100%;object-fit:contain;flex-shrink:1;min-height:100px;margin:0 auto}
#sEnd #creatorResult{padding:8px!important}
#sEnd #creatorResult p{margin:0 0 7px;font-size:12px;line-height:1.4}
#sEnd .btn{min-height:42px;padding:10px 12px;font-size:14px}
#sEnd .row{gap:8px;flex-shrink:0}
#sEnd .challenge-result{font-size:14px;margin:0}
#sEnd .share-note,#sEnd .credits{font-size:10px;line-height:1.3;margin:2px 0}