/* C20: one shared control material, original scene stays below this layer. */
@font-face{font-family:LotusPraise;src:url('../../assets/fonts/Outfit-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
:root{--glass-fill:linear-gradient(145deg,#74918d45,#193c3bbd 62%,#102d30c7);--glass-edge:#dceee568;--glass-shadow:0 9px 28px #00181554,inset 0 1px 0 #ffffff45,inset 0 -1px 0 #031c2029;--glass-blur:blur(16px) saturate(1.22);--ui-ink:#f0f4e8;--ui-sub:#d1ded4;--ease-liquid:cubic-bezier(.2,.82,.25,1)}
.glass{background:var(--glass-fill);border:1px solid var(--glass-edge);box-shadow:var(--glass-shadow);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);color:var(--ui-ink)}
body[data-transparency=reduced] .glass{background:#163d36f7;backdrop-filter:none;-webkit-backdrop-filter:none}
@supports not (backdrop-filter:blur(1px)){.glass{background:#153b34f5}}
button:not(.cell){transition:background .18s var(--ease-liquid),scale .22s var(--ease-liquid),box-shadow .22s var(--ease-liquid)}
button:not(.cell):active:not(:disabled){scale:.97;box-shadow:inset 0 2px 10px #e4f8ea24}
.c20-icon{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
#masthead{width:min(166px,calc(var(--bs)*.49))!important;height:46px!important;left:calc(var(--bx) + var(--bs)/2)!important;translate:-50% 0;top:calc(var(--by) + var(--bs) + 38px)!important;border-radius:25px;overflow:hidden;transform-origin:50% 50%;will-change:transform}
#masthead::after{content:"";position:absolute;inset:-10px 0;background:linear-gradient(100deg,transparent 30%,#efffff7a 49%,transparent 68%);transform:translateX(calc(var(--sweep,-1)*240% - 120%)) skewX(-18deg);opacity:clamp(0,calc(var(--sweep,-1)*100),1);pointer-events:none}
#score{font-size:min(31px,calc(148px / var(--score-columns,3)));letter-spacing:.01em}.compact #score{font-size:min(28px,calc(120px / var(--score-columns,3)))}
#score-tick{position:absolute;left:calc(var(--bx) + var(--bs)/2 - 86px);top:calc(var(--by) + var(--bs) + 29px);right:auto;transform:none;font-size:12px;pointer-events:none;z-index:9}
#floating-score{top:calc(var(--by) + var(--bs) - 35px)!important;left:var(--bx)!important;width:var(--bs)!important;height:auto!important;min-height:60px;z-index:8;display:grid;gap:1px;justify-items:center;pointer-events:none}
#score-praise{font-family:LotusPraise,system-ui,sans-serif;font-size:28px;line-height:1.1;font-weight:700;font-style:italic;letter-spacing:.03em;color:#f6edcb;-webkit-text-stroke:.5px #fffce3;text-shadow:0 2px #264d43,0 4px 10px #071c1daa,0 0 14px #d5e4c138}
#reward-delta{font-family:LotusPraise,system-ui,sans-serif;font-size:32px;line-height:1.1;color:#f4f3d8;text-shadow:0 2px 0 #23433d,0 3px 8px #001f22;font-variant-numeric:tabular-nums}
.reward-tags{flex-wrap:wrap;gap:4px;margin-top:2px}.reward-tags>span{font-size:10px;padding:2px 6px;background:#173e35bf;border-color:#e8e6b447;font-variant-numeric:tabular-nums}
body:has(#board.selected) #floating-score{top:calc(var(--by) + var(--bs) + 4px)!important;gap:0}body:has(#board.selected) #score-praise{font-size:17px}body:has(#board.selected) #reward-delta{font-size:23px}body:has(#board.selected) .reward-tags{display:none}

#leisure-panel .bus-controls{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.bus-controls label{font-size:11px}.drawer-heading{height:46px}.volume-label{font-size:11px;gap:15px;margin:4px 4px 6px}.music-row{height:46px}.drawer-note{font-size:10px;color:#d1ded1}
#audio-enable{position:fixed;bottom:84px;left:50%;translate:-50% 0;padding:6px 13px;border-radius:20px;z-index:29;font-size:12px;pointer-events:auto}
#notice{bottom:84px;left:var(--bx);right:auto;width:var(--bs);z-index:9}.sound-bars{display:none}#hint{top:calc(var(--ty) + var(--th) + 9px)}
@media(max-width:350px){#score-praise{font-size:24px}#reward-delta{font-size:28px}.reward-tags>span{font-size:9px;padding:2px 4px}}
body[data-reduced=true] button:active{scale:1}body[data-reduced=true] #masthead{transform:none!important}body[data-reduced=true] #masthead::after{display:none}



/* C20 R1 — fixed reserved sky band; the actual board starts below it. */
#masthead{top:calc(var(--by) + var(--bs) + 12px)!important}
#score-tick{top:calc(var(--by) + var(--bs) + 12px)}
#chain-band{position:absolute;top:var(--chain-top,68px);left:var(--bx);width:var(--bs);height:var(--chain-height,58px);z-index:8;pointer-events:none;display:grid;place-items:center}
#chain-effects{position:fixed;inset:0;z-index:12;pointer-events:none;overflow:hidden}
.chain-hanging{position:relative;display:grid;grid-template-columns:auto auto;column-gap:12px;align-items:center;justify-content:center;min-width:180px;max-width:95%;height:100%;border-radius:20px;background:radial-gradient(ellipse,#133a327a,transparent 75%);text-align:center;color:#f1f2da;text-shadow:0 2px 3px #062c2e,0 0 8px #103b2a}
.chain-caption{grid-column:1/3;font-size:10px;line-height:13px;align-self:end;letter-spacing:.08em;color:#e9edda}.chain-recent{display:flex;gap:5px;font-family:LotusPraise,system-ui;font-size:13px;align-self:start;line-height:31px}.chain-recent span{display:inline-block}
.chain-sum{font-family:LotusPraise,system-ui;font-size:30px;line-height:32px;align-self:start;letter-spacing:.025em;color:#f5eed0;-webkit-text-stroke:.35px #fff8df;text-shadow:0 2px #285343,0 4px #102f2c,0 5px 12px #001d26;transform:scale(var(--chain-scale,1));font-variant-numeric:tabular-nums}
.emotion-type{position:absolute;text-align:center;display:grid;justify-items:center;gap:0;white-space:nowrap;line-height:1.05;color:#eff8e6;font-family:LotusPraise,system-ui,sans-serif;text-shadow:0 2px #2b6052,0 4px #123b35,0 6px 10px #00242bba;will-change:transform,opacity}
.emotion-type strong{font-size:var(--emotion-size,32px);font-weight:700;letter-spacing:-.025em;transform:scaleX(.95);-webkit-text-stroke:.65px #fffde6}
.emotion-type b{font-size:calc(var(--emotion-size,34px) + 4px);font-variant-numeric:tabular-nums;letter-spacing:.01em;-webkit-text-stroke:.4px #fffbd7}
.emotion-type small{font-family:system-ui;font-size:10px;line-height:16px;letter-spacing:.04em;color:#f7f8e5;text-shadow:0 1px 3px #032a2e,0 1px 7px #02202e}
.emotion-type[data-tier="1"]{color:#dcffed;text-shadow:0 2px #397b68,0 4px #174e45,0 6px 12px #062a38}
.emotion-type[data-tier="2"]{color:#f8edbf;text-shadow:0 2px #77734a,0 4px #214c3e,0 6px 13px #001b28}
.emotion-type[data-tier="3"]{color:#ffe6a2;text-shadow:0 2px #a88b4e,0 4px #4c5d3a,0 6px 14px #001a25,0 0 16px #f4e1a244}
.emotion-type[data-tier="4"]{color:#fff1af;text-shadow:0 2px #c49c52,0 4px #7d7650,0 6px #294b42,0 8px 16px #001d2d,0 0 22px #f4e1a266}
.chain-delivery b{font-size:39px}.chain-delivery small{letter-spacing:.1em;font-size:11px}
@media(max-width:350px){.chain-caption{font-size:9px}.chain-sum{font-size:26px}.chain-recent{font-size:11px;gap:3px}.chain-hanging{column-gap:8px}.emotion-type strong{font-size:calc(var(--emotion-size,32px)*.88)}.emotion-type b{font-size:calc(var(--emotion-size,34px)*.95)}}
body[data-reduced=true] .emotion-type{will-change:opacity}body[data-reduced=true] .chain-sum{transform:none}
.emotion-type strong{transform:scaleX(.95) skewX(-5deg)}.bank-tail{position:absolute;left:50%;bottom:100%;width:1px;height:1px}.bank-tail i{position:absolute;left:calc((var(--bead) - 2)*7px);bottom:calc(var(--bead)*7px);width:calc(5px - var(--bead)*.5px);height:calc(7px - var(--bead)*.5px);border-radius:65% 45% 55% 55%;background:linear-gradient(145deg,#fdffe9d9,#c3e5d265);box-shadow:0 1px 4px #aee8df66;opacity:calc(1 - var(--bead)*.15)}body[data-reduced=true] .bank-tail{display:none}
