:root{color-scheme:dark;--ink:#dcece2;--muted:#91adb0;--page:#091721;--panel:#142b36;--line:#3e6268;--mint:#7af0cd;--cyan:#8cdfff;--pink:#f69dcd;font-family:ui-rounded,'Arial Rounded MT Bold',system-ui,-apple-system,sans-serif;font-synthesis:none;-webkit-tap-highlight-color:transparent}*{box-sizing:border-box}body{margin:0;min-height:100svh;background:radial-gradient(ellipse at 45% 0,#1d3544 0,#0b1b27 45%,#08151e 100%);color:var(--ink);overscroll-behavior:none}button,input,select{font:inherit}button{cursor:pointer;touch-action:manipulation;border:1px solid #5c827c;border-radius:5px;min-height:44px;background:#203c47;color:#d8ece2;padding:10px 12px;font-size:11px;font-weight:700;box-shadow:0 2px 0 #05141c;transition:background .12s,transform .1s}button:hover{background:#2b5056}button:active{transform:translateY(1px)}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #91f4d6;outline-offset:3px}button:disabled{cursor:default;background:#21343e;color:#718d94;border-color:#365059;box-shadow:none}.primary{background:#8ee6c6;border-color:#b3f9d9;color:#153c3d}.primary:hover{background:#b6f4d8}.secondary{background:#203a46;color:#c3ded6;border-color:#41636c}.app{width:min(100%,450px);padding:12px 14px 10px;margin:0 auto}.masthead{display:flex;justify-content:space-between;align-items:center;gap:10px;max-width:390px;margin:0 auto 9px}.eyebrow,.kicker{font:600 8px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.13em;text-transform:uppercase;color:#9cc8c4;margin:0 0 4px}h1{font-size:25px;line-height:1.04;font-weight:750;letter-spacing:-1.1px;margin:0}h1 span{color:#83f2d2}.stamp{font:600 6.7px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.05em;color:#c1c6aa;background:#263b40;border:1px solid #6c7c71;padding:5px 6px;text-align:center;transform:rotate(2deg)}.hud{max-width:390px;display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 auto 7px;font:600 10px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace}.hud #floor-label{color:#9bf6cf;font-size:13px}.hud #timer{font-variant-numeric:tabular-nums;font-size:12px}.hud #crumb-count{white-space:nowrap;color:#e0c185;font-size:9px}.hud button{height:44px;width:44px;min-width:44px;padding:0;color:#b8ddd3;background:#213c49;border-color:#4d7277}.hud #sound{font-size:17px}.hud #sound[aria-pressed='true']{color:#96e6c7;background:#25484b}.hud #pause{font:650 13px ui-monospace,monospace}.board-wrap{position:relative;width:min(100%,calc((100svh - 207px)*.6));max-width:390px;min-width:266px;aspect-ratio:3/5;overflow:hidden;isolation:isolate;border:1px solid #587c7d;border-radius:6px;background:#132e38;margin:0 auto;box-shadow:0 3px 0 #183a43,0 0 24px #4ccebd09}canvas#game{display:block;width:100%;height:100%;touch-action:none;user-select:none;-webkit-user-select:none;outline:none}#context-action{position:absolute;z-index:4;transform:translate(-50%,-50%);min-width:106px;min-height:44px;padding:10px 9px;background:#9cffe0;color:#113e38;border:1px solid #e2ffed;font:800 10px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.04em;box-shadow:0 0 0 3px #62e7b925,0 0 18px #67f2c44d,0 3px 0 #295d4c}#context-action:active{transform:translate(-50%,-48%)}#context-action[data-kind='secret']{background:#c4b4ff;color:#34335c;border-color:#e8dcff;box-shadow:0 0 16px #ba94ff55}.overlay{position:absolute;inset:0;z-index:5;display:flex;align-items:center;justify-content:center;padding:14px;background:#07121cb5;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.panel{width:100%;max-width:318px;max-height:100%;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#466b70 #142b36;background:linear-gradient(150deg,#1b3440,#142832);border:1px solid #527b7b;border-radius:7px;padding:18px;box-shadow:0 4px 0 #07182080,0 14px 35px #020b1555}.panel .kicker{font-size:7px;letter-spacing:.1em;margin-bottom:8px}.panel h2{font-size:30px;letter-spacing:-1px;line-height:1.08;margin:0 0 10px;font-weight:750;color:#e2f1e5}.panel p{font-size:10px;line-height:1.5;color:#a9c7c3;margin:0 0 10px}.panel .small{font:500 7.5px/1.55 ui-monospace,SFMono-Regular,Menlo,monospace;color:#90b2b2;margin:10px 0 0}.panel>.primary,.panel>.secondary{width:100%;margin-top:9px;display:flex;align-items:center;justify-content:space-between}.section-label{display:flex;align-items:center;justify-content:space-between;font:650 7px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.09em;color:#9cbcb9;margin:13px 0 6px}.section-label span{font-size:6.5px;letter-spacing:.02em;color:#cbbd88}.floor-grid{display:grid;gap:5px}.floor-option{display:grid;grid-template-columns:32px 1fr 92px;align-items:center;gap:7px;width:100%;min-height:44px;padding:6px 9px;background:#203d47;border-color:#385d65;text-align:left}.floor-option strong{font-size:15px;color:#d5eade}.floor-option>span{font:600 12px/1 ui-monospace,monospace;letter-spacing:.08em;color:#dac58f}.floor-option small{font:500 6.8px/1.4 ui-monospace,monospace;text-align:right;color:#96b7b3}.floor-option.selected{border-color:#8be2c9;background:#2d4d50;box-shadow:inset 3px 0 #8be2c9}.floor-option:disabled strong,.floor-option:disabled span,.floor-option:disabled small{color:#607e85}.mask-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}.mask-option{display:flex;min-width:0;flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:4px 2px 5px;min-height:65px;background:#152b38;border-color:#3d5e6c}.mask-option canvas{display:block;width:40px;height:40px;max-width:100%;image-rendering:pixelated}.mask-option span{font:500 6px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:nowrap}.mask-option.selected{border-color:#92ecd0;background:#274a4d;box-shadow:inset 0 -2px #9bffd8}.menu-panel #floor-description{font-size:7px;line-height:1.4;margin-top:9px}.menu-panel>p:first-of-type{font-size:9px;margin-bottom:8px}.menu-panel #open-collection{font-size:9px}.menu-panel>p.small:last-child{font-size:6.8px;line-height:1.45;margin-bottom:0}.collection-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:15px 0}.sticker-item{min-width:0;text-align:center}.sticker-item canvas{display:block;width:100%;height:auto;aspect-ratio:1;background:#213944;border:1px solid #42636a;border-radius:8px}.sticker-item.locked canvas{opacity:.45;background:repeating-linear-gradient(45deg,#20333e,#20333e 5px,#263d47 5px,#263d47 6px)}.sticker-item strong{display:block;font-size:7px;line-height:1.4;margin:7px 0 2px;color:#cee5d7}.sticker-item p{font:500 6px/1.5 ui-monospace,monospace;color:#8ba8aa}.collection-panel h2{font-size:28px}.suspect-panel{text-align:center;border-color:#ca8baf;background:linear-gradient(150deg,#312f46,#1a2939)}.suspect-panel .kicker{color:#dfa6c4}.suspect-panel h2{font:750 24px/1.04 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:-.8px;color:#ffc2df}.suspect-panel canvas{width:150px;height:150px;display:block;margin:16px auto;background:#14232f;border:1px solid #705674;border-radius:7px;image-rendering:pixelated}.suspect-panel p{font-size:9px}.result-panel h2{font-size:29px}.stars{font:650 27px/1.3 ui-monospace,monospace;letter-spacing:.14em;color:#efcf85;margin:7px 0 12px}.result-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin:15px 0 9px;background:#42626a;border:1px solid #42626a;border-radius:4px;overflow:hidden}.result-grid>div{padding:10px 4px;background:#203b46;text-align:center}.result-grid span{display:block;font:600 6.5px/1.3 ui-monospace,monospace;color:#95b4b3}.result-grid strong{display:block;font-size:16px;margin-top:4px;font-variant-numeric:tabular-nums;color:#dcecdf}.button-row{display:flex;gap:7px;margin-top:14px}.button-row button{flex:1;min-width:0;padding:10px 7px}.stats{border-top:1px solid #3b5961;padding-top:10px;margin-top:13px!important;font:500 7px/1.5 ui-monospace,monospace!important;color:#83a5a7!important}.result-panel #share-note:empty{display:none}.actions{display:flex;align-items:center;gap:10px;width:min(100%,390px);margin:10px auto 0;min-height:44px}.actions #hint{flex:1;min-width:0;margin:0;font:500 8px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace;color:#9dbeb9}.actions #menu-button{width:98px;min-width:98px;min-height:44px;font-size:8px;padding:8px 7px;color:#b9d9d0}.footer{display:flex;justify-content:space-between;gap:8px;width:min(100%,390px);margin:9px auto 0;font:500 6.8px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;color:#63838d}#joystick{position:absolute;z-index:3;left:16px;bottom:20px;width:96px;height:96px;border:1px solid #88d8cc80;border-radius:50%;background:#21454c8a;touch-action:none}#joystick-knob{position:absolute;left:25px;top:25px;width:44px;height:44px;border-radius:50%;border:1px solid #c7ffeeaa;background:#5cae9e80;pointer-events:none}details#tuning{width:min(100%,390px);margin:15px auto 0;border:1px solid #48666d;background:#152e39;border-radius:4px;padding:11px;font-size:9px}#tuning summary{font:650 10px/1.5 ui-monospace,monospace;cursor:pointer}#tuning p{font-size:8px;line-height:1.5;color:#91b2b4}#tune-form{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin:14px 0}#tune-form label{display:grid;gap:6px;font-size:8px;color:#9dbdb8}#tune-form output{font:650 8px ui-monospace,monospace;color:#9de7cd}#tune-form input[type=range]{width:100%;margin:3px 0;accent-color:#92e8ce}#tune-form select{width:100%;padding:6px;border:1px solid #48666d;border-radius:3px;background:#213e48;color:#d0e3d5;font-size:9px}.joystick-option{display:flex;align-items:center;gap:9px;min-height:44px;font-size:9px}#tuning>button{font-size:9px;min-height:36px}#local-stats{white-space:pre-wrap;overflow-wrap:anywhere;font:7px/1.5 ui-monospace,monospace;color:#8ea9ad}[hidden]{display:none!important}
@media(max-width:375px){.app{padding:10px 11px 8px}.masthead{margin-bottom:8px}h1{font-size:23px}.eyebrow{font-size:7px}.stamp{font-size:6px}.hud{gap:6px}.hud #crumb-count{font-size:8px}.hud #timer{font-size:11px}.board-wrap{width:min(100%,calc((100svh - 200px)*.6))}.overlay{padding:11px}.panel{padding:15px}.panel h2{font-size:28px}.floor-option{grid-template-columns:28px 1fr 86px;padding:6px 7px}.floor-option small{font-size:6.5px}.mask-grid{gap:4px}.mask-option canvas{width:37px;height:37px}.mask-option{min-height:62px}.mask-option span{font-size:5.7px}.section-label{font-size:6.5px;margin-top:11px}.panel .small{font-size:7px}.footer{font-size:6.1px}.actions #hint{font-size:7.5px}}
@media(max-height:690px) and (orientation:portrait){.app{padding-top:7px}.masthead{margin-bottom:6px}.eyebrow{font-size:6px}h1{font-size:21px}.board-wrap{width:min(100%,calc((100svh - 185px)*.6));min-width:230px}.hud{margin-bottom:6px}.panel{padding:13px}.panel h2{font-size:25px}.panel .kicker{font-size:6px}.menu-panel .floor-option{min-height:44px}.mask-option canvas{width:32px;height:32px}.mask-option{min-height:56px}.actions{margin-top:8px}.footer{margin-top:6px}.suspect-panel canvas{width:130px;height:130px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* R6: the map and arcade deck occupy separate grid rows. */
.app{width:min(100%,450px);height:100svh;display:flex;flex-direction:column;padding:8px;overflow:hidden}
.masthead{width:100%;max-width:none;flex:0 0 auto;margin:0 0 7px}.eyebrow{font-size:6px}h1{font-size:23px}.stamp{font-size:5.5px}
.hud{width:100%;max-width:none;flex:0 0 44px;min-height:44px;margin:0;gap:8px;padding:0 8px;background:#080f1a;border-bottom:1px solid #24434b;font-size:10px}
.hud #floor-label{font-size:12px;color:var(--accent,#68ffd0)}.hud #timer{font-size:12px}.hud #crumb-count{font-size:9px}.hud button{border:0;border-left:1px solid #24434b;min-width:44px;width:44px;height:44px;box-shadow:none;background:transparent;border-radius:0}
.board-wrap{width:100%;min-width:0;max-width:none;aspect-ratio:auto;flex:1;min-height:0;border:1px solid #36545e;border-radius:4px;margin:0;box-shadow:none;background:#060e17}
canvas#game{width:100%;height:100%;display:block;touch-action:none}
.overlay{padding:12px;z-index:5;background:#07121cc9}.panel{max-width:370px;padding:17px}.panel .small{font-size:9px}.panel p{font-size:11px}.panel h2{font-size:29px}.section-label{font-size:8px}.floor-option{grid-template-columns:32px 1fr 110px}.floor-option small{font-size:8px}.mask-option span{font-size:7px}.mask-option canvas{width:46px;height:46px}.mask-option{min-height:74px}.menu-panel #floor-description{font-size:9px}.menu-panel>p.small:last-child{font-size:9px}.menu-panel #open-collection{font-size:11px}
.actions{width:100%;min-height:0;margin:5px 0 0;flex:0 0 auto}.actions #hint{font-size:8px}.actions #menu-button{min-height:36px}.footer{width:100%;font-size:6px;margin:4px 0 0;flex:0 0 auto}
.control-settings{margin:10px 0;padding:9px;border:1px solid #45676d;border-radius:5px;font-size:11px}.control-settings summary{min-height:36px;display:flex;align-items:center;cursor:pointer;color:#aceed6}.control-settings label{display:block;margin:7px 0;font-size:11px;line-height:1.5;color:#c1dcd4}.control-settings select{display:block;width:100%;min-height:44px;padding:7px;background:#16333f;color:#dbf2e5;border:1px solid #628583;border-radius:4px;font-size:11px}.control-settings input[type=range]{display:block;width:100%;min-height:36px;accent-color:#91edcd}.control-settings output{float:right;color:#adf5d5}
#mask-focus{display:flex;gap:12px;align-items:center;padding:9px;margin:10px 0;border:1px solid #456d70;background:#172f3b;border-radius:5px;text-align:left}#mask-focus>canvas{display:block;flex:0 0 66px;width:66px;height:66px;object-fit:contain;border-radius:4px;background:#10232b}#mask-focus strong{font-size:12px;color:#d8ffeb}#mask-focus p.small{font-size:8px;margin:4px 0 0}.mask-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.mask-collection-item{margin:0;text-align:center}.mask-collection-item canvas{width:100%;height:auto;border:1px solid #4d7074;border-radius:5px;background:#10232b}.mask-collection-item figcaption{font-size:9px;margin-top:4px}
body.is-playing{touch-action:none;user-select:none;-webkit-user-select:none;background:#050b13}
body.is-playing .app{padding:0;height:100svh;max-height:100svh;display:grid;grid-template-rows:44px minmax(0,1fr) 26svh;grid-template-columns:minmax(0,1fr)}
body.is-playing .masthead,body.is-playing .actions,body.is-playing .footer,body.is-playing #tuning{display:none!important}
body.is-playing .hud{grid-row:1;padding-top:env(safe-area-inset-top,0px)}
body.is-playing .board-wrap{grid-row:2;border:0;border-radius:0;min-height:0}
#control-deck{--accent:#68ffd0;position:relative;grid-row:3;display:grid;grid-template-columns:1fr 1fr;isolation:isolate;min-height:0;width:100%;height:100%;padding:6px 8px max(6px,env(safe-area-inset-bottom));background:repeating-linear-gradient(0deg,#ffffff03 0,#ffffff03 1px,transparent 1px,transparent 4px),linear-gradient(115deg,#252b37,#111824 40%,#252e3a 75%,#101722);border-top:2px solid var(--accent);box-shadow:inset 0 4px 12px #01070b,0 -1px 13px color-mix(in srgb,var(--accent) 30%,transparent);touch-action:none;overflow:hidden}
#control-deck::after{content:'';position:absolute;top:12px;bottom:12px;left:50%;width:1px;background:linear-gradient(transparent,#8ba9b63b,transparent);pointer-events:none}
#button-zone{grid-column:1;grid-row:1;display:grid;grid-template-rows:1fr 1fr;min-height:0;touch-action:none}
#stick-zone{grid-column:2;grid-row:1;position:relative;min-width:0;min-height:0;touch-action:none;overflow:hidden}
body[data-hand=left] #button-zone{grid-column:2}body[data-hand=left] #stick-zone{grid-column:1}
#button-zone button{position:relative;display:flex;align-items:center;justify-content:center;padding:0;min-height:0;min-width:0;width:100%;height:100%;border:0;border-radius:0;background:transparent;box-shadow:none;transform:none;touch-action:none;color:#4c5a65;transition:none}
#button-zone .button-face{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:78px;height:78px;flex:0 0 78px;border-radius:50%;border:2px solid #4a5c63;background:radial-gradient(circle at 36% 24%,#344752,#1b2933 65%);box-shadow:0 5px 0 #040b12,0 0 0 5px #060d16,inset 0 2px 3px #a2beca26;transition:transform .05s,box-shadow .05s}
#button-zone .button-face b{font:900 23px/1 ui-monospace,monospace;color:#687e87}.button-face>span{white-space:pre-line;text-align:center;font:800 8px/1.1 ui-monospace,monospace;letter-spacing:.015em;max-width:70px}
#button-zone button[aria-disabled=false] .button-face{border-color:var(--accent);color:#d9fff3;background:radial-gradient(circle at 34% 24%,#3c7a72,#183c46 70%);box-shadow:0 5px 0 #050e15,0 0 0 5px #08111b,0 0 18px color-mix(in srgb,var(--accent) 25%,transparent),inset 0 2px 3px #d9fff34d}
#button-zone button[aria-disabled=false] .button-face b{color:#d6fff0}#button-zone #throw-action[aria-disabled=false] .button-face{border-color:#d9a4ff;background:radial-gradient(circle at 34% 24%,#805b99,#402959 70%);color:#f5e0ff;box-shadow:0 5px 0 #0c0814,0 0 0 5px #08111b,0 0 18px #bb79fc40}
#button-zone button[data-pressed=true] .button-face{transform:translateY(4px);box-shadow:0 1px 0 #050b10,0 0 0 5px #08111b,inset 0 3px 8px #07101780}
#button-zone button:focus-visible{outline-offset:-5px;border-radius:12px}
.stick-idle{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;pointer-events:none}.stick-idle::before{content:'';position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);width:92px;height:92px;border:1px solid #7fa3a526;border-radius:50%;box-shadow:inset 0 2px 10px #0008}.stick-idle i{position:relative;width:40px;height:40px;display:block;margin-top:12px;border-radius:50%;border:1px solid #465f69;background:radial-gradient(circle at 32% 25%,#668994,#263c4c 65%);box-shadow:0 5px 0 #070f19,0 8px 7px #0008}.stick-idle span{font:600 7px/1.3 ui-monospace,monospace;letter-spacing:.08em;color:#7d919d;position:absolute;bottom:14px}.stick-idle::after{content:'360°';font:600 6px ui-monospace,monospace;color:#6e838e;position:absolute;top:15px}
#stick-zone.held .stick-idle i{visibility:hidden}
#thumbstick{position:absolute;width:104px;height:104px;border-radius:50%;border:1px solid #b3ffe65c;background:#88f2cd08;box-shadow:inset 0 0 16px #c3fff00d;pointer-events:none;z-index:2}
#thumbstick::after{content:'';position:absolute;inset:15px;border:1px dashed #b9efdf33;border-radius:50%}
#thumbstick-knob{position:absolute;left:31px;top:31px;width:40px;height:40px;border-radius:50%;border:1px solid #cefff2;background:radial-gradient(circle at 32% 25%,#d6fff3,var(--accent) 28%,#214b58 80%);box-shadow:0 5px 0 #07121b,0 8px 10px #000a;z-index:1}
#thumbstick[data-sprinting=true]{border-color:#ffcc8f99}#thumbstick[data-sprinting=true] #thumbstick-knob{background:radial-gradient(circle at 32% 25%,#fff3d7,#f6b858 35%,#70432f 85%);border-color:#ffedc4}
.deck-screw{position:absolute;width:6px;height:6px;border-radius:50%;background:linear-gradient(135deg,#52606c,#182333);border:1px solid #0c121b;z-index:3;pointer-events:none}.deck-screw::after{content:'';position:absolute;width:3px;height:1px;background:#09121b;transform:rotate(-35deg);left:0;top:2px}.screw-tl{top:5px;left:5px}.screw-tr{top:5px;right:5px}.screw-bl{bottom:5px;left:5px}.screw-br{bottom:5px;right:5px}
#control-deck[data-inactive=true]{filter:saturate(.5);opacity:.7}
.overlay,.panel{touch-action:pan-y;user-select:text;-webkit-user-select:text}
@media(max-height:700px){.panel{padding:12px}.panel h2{font-size:25px}#button-zone .button-face{width:72px;height:72px;flex-basis:72px}.button-face>span{font-size:7px}.stick-idle span{bottom:8px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.hud #timer{display:flex;flex-direction:column;align-items:center;gap:1px;line-height:1.1}.hud #safe-countdown{font:600 6px/1 ui-monospace,monospace;letter-spacing:.03em;color:#a5b8b5;white-space:nowrap}
/* Keep the slim strip below a phone notch, with all deck controls above its home indicator. */
:root{--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}
body.is-playing .app{grid-template-rows:calc(44px + var(--safe-top)) minmax(0,1fr) 26svh}
body.is-playing .hud{height:calc(44px + var(--safe-top));padding-top:var(--safe-top)}
#control-deck{padding-bottom:max(6px,var(--safe-bottom));--button-size:clamp(72px,calc((26svh - 6px - max(6px,var(--safe-bottom)))/2 - 4px),78px)}
#button-zone .button-face{width:var(--button-size);height:var(--button-size);flex-basis:var(--button-size)}

/* R7: compact cabinet deck. Distinct64px hit cells never overlap. */
body.is-playing .app{grid-template-rows:calc(44px + var(--safe-top)) minmax(0,1fr) 19.5svh}
#control-deck{--button-tilt:-15deg;grid-template-columns:minmax(192px,3fr) minmax(96px,2fr)}
body[data-hand=left] #control-deck{--button-tilt:15deg;grid-template-columns:minmax(96px,2fr) minmax(192px,3fr)}
#button-zone{display:grid;grid-template-columns:repeat(3,minmax(64px,1fr));grid-template-rows:minmax(0,1fr);gap:0}
#button-zone button{height:64px;min-height:64px;min-width:64px;grid-row:1;align-self:center}
#run-action{grid-column:3;align-self:end!important}#context-action{grid-column:2}#throw-action{grid-column:1;align-self:start!important}
body[data-hand=left] #run-action{grid-column:1}body[data-hand=left] #context-action{grid-column:2}body[data-hand=left] #throw-action{grid-column:3}
#button-zone .button-face{width:52px;height:52px;flex-basis:52px;gap:1px;border-width:2px;transform:rotate(var(--button-tilt));box-shadow:0 4px 0 #040b12,0 0 0 3px #060d16,inset 0 2px 3px #a2beca26}
#button-zone .button-face b{font-size:18px}.button-face>span{font-size:6px;line-height:1.05;max-width:48px}#button-zone #run-action .button-face b{font-size:12px;letter-spacing:-.02em}#run-action .button-face>span{font-size:6px}
#button-zone #run-action[aria-disabled=false] .button-face{border-color:#ffd395;color:#ffefcd;background:radial-gradient(circle at 34% 24%,#826846,#3b343a 70%);box-shadow:0 4px 0 #100c0c,0 0 0 3px #08111b,0 0 12px #edbe7c2b}
#button-zone #run-action[aria-disabled=false] .button-face b{color:#ffe3b5}
#button-zone button[data-pressed=true] .button-face{transform:translateY(3px) rotate(var(--button-tilt));box-shadow:0 1px 0 #050b10,0 0 0 3px #08111b,inset 0 3px 8px #07101780}
#stick-zone .stick-idle{gap:7px}#stick-zone .stick-idle::before{width:80px;height:80px;top:43%}#stick-zone .stick-idle i{width:34px;height:34px;margin-top:0}#stick-zone .stick-idle span{bottom:5px;font-size:6px;letter-spacing:.02em}#stick-zone .stick-idle::after{top:7px;font-size:5px}
#thumbstick{width:104px;height:104px}#thumbstick[data-sprinting=true]{border-color:#ffd39599}#thumbstick[data-sprinting=false] #thumbstick-knob{border-color:#cefff2}
#control-deck[data-run-mode=edge] #run-action .button-face{opacity:.55}

#control-deck::after{display:none}#stick-zone::before{content:'';position:absolute;top:6px;bottom:6px;left:0;width:1px;background:linear-gradient(transparent,#8ba9b63b,transparent);pointer-events:none}body[data-hand=left] #stick-zone::before{left:auto;right:0}

/* R8: preserve the19.5% r7 cabinet; LIGHT sits above the stick, away from RUN/A/B. */
.run-heading{display:flex;flex-direction:column;gap:2px;min-width:51px}.run-heading #seed-code{font:600 6px/1 ui-monospace,monospace;color:#a6bcbd;white-space:nowrap}.hud{gap:5px}.hud #crumb-count{font-size:8px}
/* R9: four separate arcade cells; the opposite zone contains only the stick. */
#control-deck{grid-template-columns:256px minmax(96px,1fr);padding-left:4px;padding-right:4px;--button-tilt:-15deg}
body[data-hand=left] #control-deck{grid-template-columns:minmax(96px,1fr) 256px;--button-tilt:15deg}
#button-zone{position:relative;display:block;grid-column:1;grid-row:1;width:256px;min-width:256px;min-height:64px}
#stick-zone{grid-column:2;grid-row:1;min-width:96px}
body[data-hand=left] #button-zone{grid-column:2}
body[data-hand=left] #stick-zone{grid-column:1}
#button-zone button{position:absolute;display:flex;width:64px;min-width:64px;height:64px;min-height:64px;padding:0;right:auto;bottom:auto;align-self:auto!important;touch-action:none;transform:none}
#button-zone #light-action{left:0;top:calc(100% - 64px);right:auto;bottom:auto;width:64px;min-width:64px;height:64px;min-height:64px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;z-index:auto;color:#4c5a65}
#button-zone #throw-action{left:64px;top:calc(66.666667% - 42.666667px)}
#button-zone #context-action{left:128px;top:calc(33.333333% - 21.333333px)}
#button-zone #run-action{left:192px;top:0}
body[data-hand=left] #button-zone #light-action{left:192px;right:auto}
body[data-hand=left] #button-zone #throw-action{left:128px}
body[data-hand=left] #button-zone #context-action{left:64px}
body[data-hand=left] #button-zone #run-action{left:0}
#button-zone #light-action .button-face{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;border-color:#8ba8ac;color:#c8dde0;background:radial-gradient(circle at 34% 24%,#486776,#203841 70%);box-shadow:0 4px 0 #040b12,0 0 0 3px #060d16,inset 0 2px 3px #a2beca26}
#button-zone #light-action .button-face b{font-size:10px;color:#d0e4df}
#button-zone #light-state{font-size:8px;color:#afcbd2}
#button-zone #light-action[aria-pressed=true] .button-face{border-color:#ffe0a2;background:radial-gradient(circle at 34% 24%,#8c7850,#3d3b38 70%);color:#fff0c8;box-shadow:0 4px 0 #100c0c,0 0 0 3px #08111b,0 0 12px #ffe4a02b}
#button-zone #light-action[aria-pressed=true] .button-face b,#button-zone #light-action[aria-pressed=true] #light-state{color:#fff0c6}
#button-zone #light-action[aria-disabled=true] .button-face{filter:saturate(.5);opacity:.6}
#button-zone #light-action[data-pressed=true] .button-face{transform:translateY(3px) rotate(var(--button-tilt));box-shadow:0 1px 0 #050b10,0 0 0 3px #08111b,inset 0 3px 8px #07101780}
#stick-zone .stick-idle::after{display:none}

.daily-tile{display:flex;flex-direction:column;gap:9px;width:100%;text-align:left;padding:14px;margin:12px 0 15px;border:1px solid #82d9cf;background:linear-gradient(130deg,#24424c,#152a3e);color:#b6d8d6;border-radius:7px;font:600 10px/1.4 ui-monospace,monospace;box-shadow:inset 3px 0 #99f5db}
.daily-heading{display:flex;align-items:center;justify-content:space-between;width:100%;color:#adffdf;font-size:16px}.daily-heading>span{font-size:10px;color:#b9d1da}.daily-meta{display:flex;justify-content:space-between;gap:8px;width:100%;font-size:8px;color:#a2bfc2}.menu-panel #remix-start{margin:9px 0;width:100%;min-height:44px;color:#dac6ff;border-color:#8c77aa}
.mask-color-list{display:flex;align-items:center;flex-wrap:wrap;gap:5px;margin:9px 0}.mask-color-list span{font-size:8px;color:#96b8b7;width:100%}.mask-color-list button{min-width:44px;min-height:36px;padding:6px;font-size:8px}.mask-color-list button[aria-pressed=true]{border-color:#a4f5da;background:#2c5356}.mask-color-list i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:4px;vertical-align:middle}
.vent-picker{position:absolute;z-index:6;bottom:10px;left:10px;right:10px;padding:12px;background:#112b39f5;border:1px solid #9adbd5;border-radius:6px;box-shadow:0 5px 20px #000b;text-align:center}.vent-picker>strong{font:800 12px ui-monospace,monospace;color:#c9fce5}#vent-options{display:flex;gap:8px;justify-content:center;margin-top:10px}#vent-options button{min-width:70px;min-height:50px;font-size:12px}#vent-options button[aria-pressed=true]{background:#8cebd1;color:#103c3b;border-color:#c5ffdf}.vent-picker p{font:600 8px/1.4 ui-monospace,monospace;color:#a2c4c3;margin:8px 0 0}
.loot-reveal{z-index:8;background:#061420e8}.reveal-panel{text-align:center;border-color:#99e8de;background:linear-gradient(145deg,#193d48,#182b42);max-width:340px}.reveal-panel h2{font-size:24px}.reveal-panel>canvas{display:block;width:150px;height:150px;margin:12px auto;border-radius:12px;box-shadow:0 0 30px #99dfce26;background:#0b1e2d}.reveal-panel .primary{min-height:50px}.loot-reveal:not([hidden]) .reveal-panel{animation:reveal-in .25s ease-out}@keyframes reveal-in{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
.loot-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:12px 0}.loot-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:116px;padding:8px;background:#132d3b;border:1px solid #41666d;border-radius:5px;text-align:center}.loot-card canvas{width:68px;height:68px}.loot-card strong{font-size:8px;color:#c1e3d6}.loot-card.locked{opacity:.45;min-height:80px}.loot-card button{font-size:8px;padding:5px;min-height:36px;width:100%}.jukebox-list{display:grid;gap:6px}.jukebox-row{padding:10px;background:#112b36;border:1px solid #3c6065;border-radius:4px;font:600 9px/1.4 ui-monospace,monospace;color:#8dacad}.jukebox-row.unlocked{color:#b1f1d8;border-color:#77bbad}.collection-panel #dupe-count{color:#b6e6d0}#result-seed{color:#bfc8e5;font-size:10px}
@media(max-width:375px){.daily-meta{font-size:7px}#light-action{right:7px}body[data-hand=left] #light-action{left:7px}.run-heading{min-width:48px}.hud #crumb-count{font-size:7px}}

/* R9 caught state keeps recovery actions visible and separated. */
.caught-overlay{z-index:9;background:#081621e6}.caught-panel{text-align:center;border-color:#dc9a9e;background:linear-gradient(145deg,#343747,#192c3c)}.caught-panel .kicker{color:#ffc4af}.caught-panel h2{font-size:29px}.caught-panel #caught-retry,.caught-panel #caught-menu{min-height:50px;justify-content:center}.caught-panel p{max-width:260px;margin:0 auto 14px}

/* R10: a 138×140px two-row cluster. The usable deck is 19.5svh;
   an additional inert safe-bottom strip preserves 64px targets on safe-area phones. */
body.is-playing .app{grid-template-rows:calc(44px + var(--safe-top)) minmax(0,1fr) calc(19.5svh + var(--safe-bottom))}
#control-deck{grid-template-columns:minmax(146px,1fr) minmax(96px,1fr);padding:1px 4px calc(1px + var(--safe-bottom));--button-tilt:-10deg}
body[data-hand=left] #control-deck{grid-template-columns:minmax(96px,1fr) minmax(146px,1fr);--button-tilt:10deg}
#button-zone{width:100%;min-width:146px;min-height:140px}
#stick-zone{min-width:96px}
#button-zone #throw-action{left:calc(50% - 69px);top:calc(50% - 70px)}
#button-zone #context-action{left:calc(50% + 3px);top:calc(50% - 66px)}
#button-zone #light-action{left:calc(50% - 67px);top:calc(50% + 2px)}
#button-zone #run-action{left:calc(50% + 5px);top:calc(50% + 6px)}
body[data-hand=left] #button-zone #throw-action{left:calc(50% + 5px)}
body[data-hand=left] #button-zone #context-action{left:calc(50% - 67px)}
body[data-hand=left] #button-zone #light-action{left:calc(50% + 3px)}
body[data-hand=left] #button-zone #run-action{left:calc(50% - 69px)}
#control-deck .screw-bl,#control-deck .screw-br{bottom:calc(4px + var(--safe-bottom))}
#stick-zone .stick-idle::before{width:88px;height:88px;top:45%}
#stick-zone .stick-idle span{bottom:4px}

/* R10 keeps the first screen focused on Play and Daily. */
#menu .menu-panel{max-width:340px;padding:22px;background:linear-gradient(150deg,#213b45,#112733)}
#menu .menu-panel h2{font-size:34px;margin-bottom:8px}
#menu .menu-panel>p:first-of-type{font-size:12px;line-height:1.5;margin-bottom:17px}
#menu #start{min-height:62px;justify-content:center;font-size:21px;letter-spacing:.03em;margin-top:0;border-radius:7px}
#menu #play-next{text-align:center;font-size:9px;color:#b4d1c9;margin:8px 0 18px}
#menu .daily-tile{padding:15px;margin:0 0 17px;gap:10px}
#menu .daily-heading{font-size:15px}
#menu .daily-meta{font-size:8px}
#menu .menu-links{display:flex;gap:7px;justify-content:center;align-items:stretch}
#menu .menu-links>button{flex:1;min-width:0;min-height:48px;margin:0;padding:9px 5px;background:#19333f;border-color:#416570;font-size:10px}
#menu #open-collection{font-size:10px}
#menu #collection-count{display:block;font:600 7px/1.5 ui-monospace,monospace;color:#9abeb8}
#floors-screen .floor-panel{max-width:350px;padding:18px}
#floors-screen #total-stars{margin:0 0 15px;color:#f1d393;font:700 13px ui-monospace,monospace}
#floors-screen .floor-grid{gap:9px}
#floors-screen .floor-row{display:flex;gap:8px;align-items:stretch}
#floors-screen .floor-option{flex:1;min-width:0;min-height:66px;grid-template-columns:28px minmax(40px,1fr) minmax(62px,.9fr);gap:5px;padding:9px 7px}
#floors-screen .floor-option strong{font-size:15px}
#floors-screen .floor-option>span{font-size:11px;letter-spacing:.03em}
#floors-screen .floor-option small{font-size:7px;line-height:1.45}
#floors-screen .floor-remix{flex:0 0 77px;width:77px;min-height:66px;padding:7px 4px;background:#302d48;border-color:#8d79ad;color:#dfcdf5;font-size:12px}
#floors-screen .floor-remix small{display:block;margin-top:4px;font:500 7px ui-monospace,monospace;color:#b8a6cd}
#floors-screen #floors-back,#settings-screen #settings-back,#collection #collection-back{min-height:48px;justify-content:center;margin-top:16px}
#settings-screen .settings-panel{max-width:350px}
#settings-screen .mask-option{min-height:68px}
#settings-screen .mask-option canvas{width:40px;height:40px}
#settings-screen .control-settings{padding:10px;margin-top:14px}
#settings-screen #controls-help{font-size:8px;line-height:1.6}
#collection .collection-panel{max-width:350px}
#collection .collection-grid:empty,#collection .loot-grid:empty{display:none}
@media(max-width:375px){#menu .menu-panel{padding:19px}#menu .menu-panel h2{font-size:31px}#menu .daily-heading{font-size:14px}#menu .daily-meta{font-size:7px}#floors-screen .floor-panel{padding:15px}#floors-screen .floor-remix{flex-basis:72px;width:72px}#floors-screen .floor-option small{font-size:6.8px}}
#collection .loot-item{display:flex;min-width:0;min-height:116px;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:8px;background:#132d3b;border:1px solid #41666d;border-radius:5px;text-align:center}
#collection .loot-item canvas{display:block;width:68px;height:68px;max-width:100%}
#collection .loot-item strong{font-size:8px;color:#c1e3d6;overflow-wrap:anywhere}
#collection .loot-item p{font-size:8px;margin:0}
#collection .loot-item button{min-height:36px;width:100%;font-size:8px;padding:5px}
/* Outside a run, the menu owns navigation; the masthead and small footer remain. */
body:not(.is-playing) .hud,body:not(.is-playing) .actions{display:none}

/* R11 start goals and records share the existing night-shift visual language. */
#floor-start{z-index:8;background:#07141be8}
#floor-start .floor-start-panel{max-width:338px;padding:23px;background:linear-gradient(145deg,#243d47,#142b38);border-color:#78b2ae}
#floor-start #start-floor-name{font-size:31px;margin-bottom:16px}
#floor-start #start-floor-goals{list-style:none;padding:0;margin:0 0 16px;display:grid;gap:11px}
#floor-start #start-floor-goals li{position:relative;padding:10px 10px 10px 29px;border:1px solid #416570;border-radius:5px;background:#112e3a;font:600 11px/1.5 ui-monospace,monospace;color:#cbe6d8}
#floor-start #start-floor-goals li::before{content:'◇';position:absolute;left:10px;top:11px;color:#9df4d1}
#floor-start #start-floor-copy{font-size:10px;line-height:1.6;color:#a8c9c3}
#floor-start #floor-start-go{min-height:54px;justify-content:center;margin-top:18px;font-size:13px}
#result-record{display:inline-block;padding:6px 10px;margin:0 0 10px;border:1px solid #a8edc9;border-radius:4px;background:#244f47;color:#c9ffda;font:800 10px/1.2 ui-monospace,monospace;letter-spacing:.05em}
#floors-screen .floor-option .floor-best{display:block;font:600 7px/1.4 ui-monospace,monospace;color:#d0e7ce;margin-top:4px}
#floors-screen .floor-row .floor-option{min-height:74px}
@media(max-width:375px){#floor-start .floor-start-panel{padding:19px}#floor-start #start-floor-name{font-size:28px}#floor-start #start-floor-goals li{font-size:10px}}
#floor-start #start-floor-goals li{padding-left:14px}
#floor-start #start-floor-goals li::before{content:none}
#result-record.record-flash{animation:record-reveal .7s ease-out 1}
@keyframes record-reveal{0%{box-shadow:0 0 0 #b6f8c900}40%{box-shadow:0 0 15px #b6f8c966}100%{box-shadow:0 0 0 #b6f8c900}}
@media(prefers-reduced-motion:reduce){#result-record.record-flash{animation:none}}


.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
body:not(.is-playing) .app{padding-top:max(8px,var(--safe-top));padding-bottom:max(8px,var(--safe-bottom))}
#menu .menu-panel{max-width:338px;padding:15px 19px;overflow:hidden}
#menu .menu-panel>.kicker{font-size:7px;text-align:center;margin-bottom:2px}
#menu #start{min-height:53px;font-size:20px}
#menu #play-next{margin:6px 0 12px;font-size:8px}
#menu .daily-tile{padding:12px;margin-bottom:12px;gap:8px}
#menu .daily-heading{font-size:14px}
#menu .menu-links>button{min-height:44px;font-size:9px;padding:8px 4px}
.mask-picker{text-align:center;margin:0 0 10px}
.picker-stage{position:relative;display:flex;align-items:center;justify-content:center;height:98px;gap:8px;touch-action:pan-y}
#menu-feeder{display:block;width:144px;height:101px;flex:0 0 144px;outline-offset:-3px;touch-action:pan-y}
#menu .picker-arrow{flex:0 0 44px;width:44px;min-height:44px;padding:0;border:1px solid #466775;border-radius:50%;background:#193542;color:#c0e4d8;font:500 32px/1 system-ui;box-shadow:none}
#picker-mask-name{display:block;margin:1px 0 3px;font:750 11px/1.3 ui-monospace,monospace;color:#d6f1e1}
#picker-status{min-height:27px;margin:3px 0 0!important;font:500 8px/1.45 ui-monospace,monospace!important;color:#8eafb0!important}
#mask-picker[data-locked=true] #picker-status{color:#c7bdd7!important}
.picker-colors{display:flex;justify-content:center;gap:3px;height:29px}
#menu .picker-color{display:flex;align-items:center;justify-content:center;width:29px;min-width:29px;min-height:29px;height:29px;padding:4px;border:1px solid transparent;border-radius:50%;background:transparent;box-shadow:none}
.picker-color i{display:block;width:14px;height:14px;border-radius:50%;border:1px solid #d5ead477}
#menu .picker-color[aria-pressed=true]{border-color:#a5e6d1;background:#38606455}
.picker-color[data-locked=true] i{border-style:dashed;border-color:#7d8a9d;position:relative}
.picker-color[data-locked=true] i::after{content:'';position:absolute;width:3px;height:4px;background:#7e92a0;left:4px;top:4px;border-radius:1px}
#picker-hint{position:absolute;left:0;right:0;bottom:-2px;pointer-events:none;font:500 7px/1.3 ui-monospace,monospace;color:#a2c8bf}
#mask-picker[data-hint=true] .picker-arrow{animation:picker-nudge 1.2s ease-in-out 3}
@keyframes picker-nudge{0%,100%{border-color:#466775;box-shadow:0 0 0 #a1f3d500}50%{border-color:#c3ffe5;box-shadow:0 0 9px #91e9c62b}}
.initials-field{display:block;margin-top:15px;color:#c5e5d5;font-size:12px}
#menu-initials{display:block;margin-top:7px;width:126px;min-height:44px;padding:7px 12px;border:1px solid #70938e;border-radius:5px;background:#102d3b;color:#d5f5e5;font:750 19px ui-monospace,monospace;letter-spacing:.24em;text-transform:uppercase}
#settings-mask-back{justify-content:center;min-height:44px;font-size:10px}
.race-ghost-control{display:flex;gap:10px;align-items:center;padding:10px 0;margin:0;font:650 11px/1.4 ui-monospace,monospace;color:#b5e5e0}
#race-ghost{width:20px;height:20px;margin:0;accent-color:#89e5cf}
#race-ghost-note{margin:0 0 14px!important;font-size:8px}
.hud #ghost-gap{font:750 7px/1 ui-monospace,monospace;color:#a8deff;white-space:nowrap;letter-spacing:0}
.challenge-screen{z-index:10;background:#071a24ed}
.challenge-panel{max-width:340px;border-color:#8cbbd3;background:linear-gradient(145deg,#23434f,#152b3e)}
.challenge-panel h2{font-size:31px}
.challenge-target{padding:11px 12px;margin:11px 0!important;border:1px solid #6893a2;border-radius:5px;background:#102d3c;color:#c5ecf3!important;font:750 12px/1.5 ui-monospace,monospace!important;overflow-wrap:anywhere}
#challenge-play,#challenge-today,#challenge-campaign{min-height:48px;justify-content:center}
#challenge-result{padding:10px 12px;margin:12px 0;color:#d3f7dd;background:#234a47;border:1px solid #87cbb1;border-radius:5px;font:750 12px/1.5 ui-monospace,monospace}
#challenge-result[data-outcome=lost]{background:#3d3346;border-color:#b09fc2;color:#e2d6ec}
#challenge-result[data-outcome=tied]{background:#293e4b;border-color:#91bac9;color:#cee8ee}
#challenge-friend{justify-content:center;min-height:48px}
.challenge-copy-box{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;margin-top:11px;padding:10px;border:1px solid #527c88;border-radius:5px;background:#102a37}
.challenge-copy-box label{grid-column:1/-1;font:650 9px ui-monospace,monospace;color:#a7cbd0}
#challenge-copy-url{min-width:0;width:100%;min-height:42px;padding:7px;border:1px solid #426773;border-radius:3px;background:#091e2c;color:#c1dce4;font:500 9px ui-monospace,monospace}
#challenge-copy{min-height:42px;min-width:63px;padding:7px;font-size:9px}
#challenge-share-note{overflow-wrap:anywhere}
@media(max-width:375px){#menu .menu-panel{padding:13px 15px}.picker-stage{height:91px}#menu-feeder{width:136px;height:95px;flex-basis:136px}#menu .daily-heading{font-size:13px}#menu .daily-meta{font-size:6.8px}#picker-status{font-size:7.6px!important}#menu .daily-tile{padding:11px}}
@media(max-height:700px){#menu .menu-panel{padding-top:10px;padding-bottom:10px}.picker-stage{height:79px}#menu-feeder{width:116px;height:81px;flex-basis:116px}#menu #play-next{margin-bottom:9px}#menu .daily-tile{gap:6px;margin-bottom:9px}}
@media(prefers-reduced-motion:reduce){#mask-picker[data-hint=true] .picker-arrow{animation:none}}

.picker-label{display:block;margin:0;font:650 6px/1 ui-monospace,monospace;letter-spacing:.16em;color:#8aafad}

/* R13 uses the unchanged approved portrait WebPs; pixel finishes stay in the game sprite. */
.mask-picker .picker-stage{position:relative;display:flex;justify-content:center;align-items:center;height:198px;gap:0;touch-action:pan-y}
.mask-picker .picker-portrait,#menu-feeder{position:relative;display:block;flex:0 0 190px;width:190px;height:190px;overflow:hidden;border-radius:9px;background:#08131f;touch-action:pan-y;outline-offset:3px}
.picker-portrait-layer{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;filter:none;opacity:0;pointer-events:none;user-select:none;-webkit-user-drag:none;transition:opacity 150ms linear}
.picker-fallback{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}
.mask-picker .picker-arrow,#menu .mask-picker .picker-arrow{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;min-height:44px;flex:none;padding:0;border:1px solid #527c80;border-radius:50%;background:#193542;color:#c0e4d8;font:500 32px/1 system-ui;box-shadow:none}
.mask-picker [data-picker-prev]{left:0}.mask-picker [data-picker-next]{right:0}
.mask-picker .picker-arrow:active{transform:translateY(calc(-50% + 1px))}
.mask-picker [data-picker-hint],#picker-hint{position:static;display:block;min-height:10px;margin:1px 0 4px;font:500 7px/1.3 ui-monospace,monospace;color:#a2c8bf;pointer-events:none}
.mask-picker .picker-label{margin-top:3px}
.mask-picker [data-picker-name],#picker-mask-name{display:block;margin:3px 0 7px;font:750 12px/1.3 ui-monospace,monospace;color:#d6f1e1}
.picker-thumbs{display:flex;justify-content:center;gap:6px;margin:5px 0}
.mask-picker .picker-thumb,#menu .mask-picker .picker-thumb{display:flex;align-items:center;justify-content:center;width:44px;height:44px;min-width:44px;min-height:44px;padding:2px;overflow:hidden;border:2px solid #415d6b;border-radius:50%;background:#0a1724;box-shadow:none}
.picker-thumb img,.picker-thumb canvas{display:block;width:36px;height:36px;object-fit:contain;filter:none;border-radius:50%;pointer-events:none}
.mask-picker .picker-thumb[aria-pressed=true],#menu .mask-picker .picker-thumb[aria-pressed=true]{border-color:#95f2d3;box-shadow:0 0 0 2px #7cf0ce25;background:#193b40}
.mask-picker [data-picker-status],#picker-status{min-height:12px;margin:6px 0 0!important;font:500 8px/1.4 ui-monospace,monospace!important;color:#8eafb0!important}
.picker-finishes{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px;margin:0 0 7px}
.picker-finish-label{flex:0 0 100%;font:650 6px/1.2 ui-monospace,monospace;letter-spacing:.08em;color:#9abbb7;margin-bottom:1px}
.mask-picker .picker-finish,#menu .mask-picker .picker-finish{display:flex;align-items:center;justify-content:center;gap:4px;min-height:32px;padding:5px 6px;border:1px solid #46666e;border-radius:5px;background:#17313d;color:#b4d5cd;box-shadow:none;font:600 7px/1 ui-monospace,monospace}
.picker-finish i{display:block;width:8px;height:8px;flex:none;border-radius:50%;border:1px solid #d0e9d277}
.mask-picker .picker-finish[aria-pressed=true],#menu .mask-picker .picker-finish[aria-pressed=true]{border-color:#92e3c9;background:#2b4d50;color:#ddf8e9}
.settings-mask-picker{margin:10px 0 13px;padding:8px 0 12px;border-bottom:1px solid #3e6268}
.settings-mask-picker [data-picker-status]{font-size:8px!important}
#menu .menu-panel{overflow-y:auto;scrollbar-width:none}
@media(max-width:375px){#menu .menu-panel{padding:12px 14px}#menu .mask-picker .picker-stage{height:194px}#menu .mask-picker .picker-portrait,#menu-feeder{width:190px;height:190px;flex-basis:190px}.picker-thumbs{gap:5px}#menu #play-next{margin-bottom:9px}#menu .daily-tile{margin-bottom:9px}}
@media(max-height:700px){.mask-picker .picker-stage{height:184px}.mask-picker .picker-portrait,#menu-feeder{width:178px;height:178px;flex-basis:178px}#menu .mask-picker [data-picker-name]{margin-bottom:5px}.picker-thumbs{margin:3px 0}#menu .daily-tile{padding:9px}}
@media(prefers-reduced-motion:reduce){.picker-portrait-layer{transition:none!important}.mask-picker[data-hint=true] .picker-arrow{animation:none}}

/* R15 pace-only HUD and compact reports. Gameplay/deck and approved mask picker stay unchanged. */
.hud #ghost-gap{font-size:6.5px;line-height:1.2;letter-spacing:-.1px}
#menu .menu-links{display:flex;gap:6px;flex-wrap:wrap}
#menu .menu-links>button{flex:1 1 65px;min-width:0;font-size:8px}
#menu #open-collection{flex:1 1 100%;min-height:28px;margin-top:0;padding:4px;font-size:8px;background:transparent;border-color:transparent;box-shadow:none}
#menu #collection-count{display:inline;font-size:7px}
.result-overlay{padding:10px;background:#07121ce8}
#result .result-panel{max-width:350px;padding:17px 19px;overflow-y:auto}
#result .result-panel .kicker{font-size:7px;margin-bottom:7px}
#result #result-title{font-size:31px;line-height:1.12;letter-spacing:-.8px;margin:0 0 8px;overflow-wrap:break-word}
#result-record{padding:4px 7px;margin:0 0 7px;font-size:8px}
#result .result-star-labels{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:4px 0 10px;letter-spacing:0;text-align:center}
.result-star-labels>span{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:2px 3px;border:1px solid #3c5f68;border-radius:4px;background:#142f3b;font:650 8px/1.1 ui-monospace,monospace;color:#8dabae}
.result-star-labels>span[data-earned=true]{color:#f0d18a;border-color:#8b8059}.result-star-labels b{font-size:15px;line-height:1}
#result .result-grid{margin:8px 0 7px}
#result .result-grid>div{padding:9px 3px;min-width:0}
#result .result-grid strong{font-size:18px}
#result-rank{display:block;min-height:10px;margin-top:4px;color:#a1dbc8;font:650 6.5px/1.2 ui-monospace,monospace;overflow-wrap:anywhere}
#result #result-copy{font-size:9px;margin:5px 0 10px;line-height:1.5}
.result-primary-actions{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:8px;margin-top:10px}
#result .result-primary-actions>button,#caught .result-primary-actions>button{min-height:64px;min-width:0;width:100%;margin:0;justify-content:center;font-size:13px;line-height:1.3;white-space:normal;padding:10px}
#result .compact-challenge{display:block;width:100%;min-height:34px;margin:10px 0 0;padding:7px;border:1px solid #547c81;background:#1b3744;border-radius:5px;box-shadow:none;color:#b6ded3;font-size:10px}
#result .result-links{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:3px 14px;margin:9px 0 0}
#result .result-links>button{min-height:27px;min-width:0;padding:3px 0;border:0;border-radius:0;background:transparent;box-shadow:none;color:#8eb8b5;font:600 8px ui-monospace,monospace;text-decoration:underline;text-underline-offset:3px}
#result #result-seed{font-size:6.5px;text-align:center;margin:5px 0 0;line-height:1.4}
#result #challenge-result{margin:6px 0 9px;padding:7px 10px;font-size:10px;line-height:1.35}
#result .challenge-copy-box{margin-top:7px;padding:7px;gap:5px}
#result #challenge-share-note,#result #challenge-fixed-note{font-size:7px;margin-top:5px;line-height:1.4}
#result #share-note:empty,#result #challenge-share-note:empty{display:none}
.leaderboard-panel{max-width:350px;padding:18px}
.leaderboard-panel h2{font-size:29px;margin-bottom:13px}
.leaderboard-tabs{display:grid;grid-template-columns:repeat(3,1fr) 1.7fr;gap:5px}
.leaderboard-tabs>button{min-width:0;min-height:38px;padding:6px 2px;font:700 9px ui-monospace,monospace;box-shadow:none;border-color:#426a74}
.leaderboard-tabs>button[aria-selected=true]{background:#38615e;border-color:#9ae7cc;color:#d8ffec}
#leaderboard-heading{margin:10px 0 12px;font-size:8px}
.leaderboard-columns,.leaderboard-list>li,.leaderboard-you{display:grid;grid-template-columns:44px minmax(0,1fr) 75px;gap:7px;align-items:center}
.leaderboard-columns{padding:0 8px 5px;color:#7fa6ab;font:600 6.5px ui-monospace,monospace}
.leaderboard-columns>span:last-child,.leaderboard-list .board-time{text-align:right}
.leaderboard-list{list-style:none;padding:0;margin:0;display:grid;gap:3px}
.leaderboard-list>li{min-height:31px;padding:6px 8px;background:#142e3b;border:1px solid #365761;border-radius:4px;font:650 10px/1.3 ui-monospace,monospace;color:#c4dfd7}
.leaderboard-list>li[data-you=true]{border-color:#87cdb3;background:#254941}
.leaderboard-list .board-rank{color:#e4c783}.leaderboard-list .board-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.leaderboard-you{display:block;min-height:35px;padding:9px 8px;margin-top:9px;border:1px solid #72ac9b;border-radius:4px;background:#1e403d;color:#b8ebd3;font:650 9px/1.4 ui-monospace,monospace}
#leaderboard-status{font-size:7.5px;min-height:12px;margin:8px 0 0;line-height:1.4}
#leaderboard-back{min-height:44px;justify-content:center;margin-top:11px}
@media(max-width:375px){#result .result-panel{padding:13px 15px}#result #result-title{font-size:28px}#result .result-primary-actions>button{min-height:64px}#result .result-grid strong{font-size:16px}#result #result-copy{font-size:8px}.leaderboard-panel{padding:14px}.leaderboard-list>li{min-height:29px}.leaderboard-tabs>button{font-size:8px}}

body.is-playing.is-report .app{grid-template-rows:44px minmax(0,1fr)}
body.is-report #control-deck{display:none!important}

/* Brief35d R20: one stick and two controls. Same 19.5svh deck and safe-bottom strip. */
#control-deck{grid-template-columns:1.1fr 1fr;padding-inline:4px;--button-tilt:-10deg}
body[data-hand=left] #control-deck{grid-template-columns:1fr 1.1fr;--button-tilt:10deg}
#button-zone{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:8px;width:100%;min-width:0;min-height:0;position:relative}
body[data-hand=left] #button-zone{flex-direction:row-reverse}
#button-zone button,#button-zone #light-action,#button-zone #context-action,body[data-hand=left] #button-zone #light-action,body[data-hand=left] #button-zone #context-action{position:relative;inset:auto;top:auto;left:auto;right:auto;grid-column:auto;align-self:auto!important;min-height:64px;min-width:64px;border-radius:50%;flex-shrink:0;transform:none;padding:0}
#button-zone #context-action{width:94px;height:94px;flex-basis:94px;margin-top:-16px}
#button-zone #light-action{width:72px;height:72px;flex-basis:72px;margin-top:34px}
#button-zone #context-action .button-face{width:90px;height:90px;flex:0 0 90px;transform:rotate(var(--button-tilt))}
#button-zone #light-action .button-face{width:69px;height:69px;flex:0 0 69px;transform:rotate(var(--button-tilt))}
#button-zone #context-action .button-face b{font-size:24px;line-height:1}
#button-zone #context-action .button-face>span{font-size:10px;line-height:1.1;max-width:82px;letter-spacing:.02em}
#button-zone #context-action .button-face small{font:650 6px/1 ui-monospace,monospace;letter-spacing:.12em;color:#8bafa9}
#button-zone #light-action .button-face b{font-size:12px}
#button-zone #light-action .button-face>span{font-size:8px}
#button-zone button[data-pressed=true] .button-face{transform:translateY(3px) rotate(var(--button-tilt))}
#button-zone #context-action[data-kind=laser] .button-face{border-color:#ff7a8c}
#stick-zone .stick-idle::before{box-sizing:border-box;width:104px;height:104px;border:12px solid #7fa3a51b;box-shadow:inset 0 0 0 1px #9bd2cd44,0 0 0 1px #9bd2cd30}
#thumbstick::after{box-sizing:border-box;inset:0;border:12px solid #98dbc520;box-shadow:inset 0 0 0 1px #b9efdf44}
#thumbstick[data-sprinting=true]::after{border-color:#ffbf655c;box-shadow:inset 0 0 0 1px #ffdba3,0 0 15px #ffae6344}
#stick-zone[data-running=true] .stick-idle::before{border-color:#ffbf655c;box-shadow:inset 0 0 0 1px #ffdba3,0 0 15px #ffae6344}
#gift-status{display:flex;align-items:center;justify-content:center;gap:3px;flex:0 0 30px;min-width:30px;color:#d7e6ca;pointer-events:none;font:700 13px/1 ui-monospace,monospace}
#gift-status #gift-name{color:#e4d6ae}#gift-status #gift-use-count{font-size:9px;margin:0}
#control-tip{position:fixed;z-index:8;left:12px;right:12px;bottom:calc(19.5svh + var(--safe-bottom) + 10px);margin:0 auto;max-width:366px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:4px 5px 4px 12px;border:1px solid #8fdcc3;border-radius:9px;background:#132c36f5;box-shadow:0 5px 20px #0008;color:#dcf9e9;font:650 11px/1.35 ui-monospace,monospace;pointer-events:none}
#control-tip button{pointer-events:auto;min-height:44px;min-width:56px;padding:6px;border-color:#5d9b8e;background:#284c4c;font-size:10px}
@media(max-width:375px){#button-zone{gap:6px}#button-zone #context-action{width:92px;height:92px;flex-basis:92px}#button-zone #context-action .button-face{width:88px;height:88px;flex-basis:88px}#control-tip{left:8px;right:8px;font-size:10px}}

#context-action[data-kind=none] small{display:none}
/* Telegram safe areas supplement the browser's own safe areas. */
.app{padding-top:max(12px,env(safe-area-inset-top),var(--tg-safe-top,0px));padding-right:max(12px,env(safe-area-inset-right),var(--tg-safe-right,0px));padding-bottom:max(10px,env(safe-area-inset-bottom),var(--tg-safe-bottom,0px));padding-left:max(12px,env(safe-area-inset-left),var(--tg-safe-left,0px))}
.menu-purpose{margin:4px 0 0;color:#b5cec5;font-size:10px;line-height:1.25;font-weight:500}
.menu-crumb{display:block;width:56px;height:56px;object-fit:contain;margin:0 auto 3px}
.menu-links a,.footer a,.caught-feeders{color:#c2dfd3;text-decoration:none}
.menu-links a{font:inherit;font-size:10px;padding:8px 4px;display:inline-flex;align-items:center;justify-content:center}
#menu .menu-links{flex-wrap:wrap;gap:4px 9px}
.feeder-door{margin:12px 0 9px}.feeder-door p{font-size:10px;line-height:1.4;margin:0 0 7px}
.feeder-actions{display:flex;gap:8px;align-items:stretch}.feeder-actions>*{flex:1;min-width:0;min-height:44px;font-size:11px}
.feeder-actions a{display:flex;align-items:center;justify-content:center;text-decoration:none;box-sizing:border-box;color:#d7eadd}
.caught-feeders{display:block;margin-top:20px;font-size:11px;line-height:1.5}
.footer{align-items:center;gap:10px;flex-wrap:wrap}.footer nav{display:flex;gap:14px}.footer a{font-size:10px}
#result .result-panel{overflow-y:auto;max-height:100%}
@media(max-height:780px){.menu-crumb{width:42px;height:42px;margin:0 auto}.menu-purpose{font-size:9px}#menu .menu-panel{padding-top:9px;padding-bottom:9px}#menu .mask-picker .picker-stage{height:158px}#menu .mask-picker .picker-portrait,#menu-feeder{width:158px;height:158px;flex-basis:158px}}
.menu-crumb-box{width:72px;height:54px;margin:0 auto 4px;border:2px solid #779e9b;box-shadow:inset 0 0 0 3px #24484c;background:#718c8155;border-radius:3px;display:flex;align-items:flex-end;justify-content:center}.menu-crumb-box .menu-crumb{width:44px;height:48px;object-fit:contain;margin:0}
@media(max-height:780px){.menu-crumb-box{height:38px;width:59px;margin-bottom:1px}.menu-crumb-box .menu-crumb{height:35px;width:34px}}
:root{--safe-top:max(env(safe-area-inset-top,0px),var(--tg-safe-top,0px));--safe-bottom:max(env(safe-area-inset-bottom,0px),var(--tg-safe-bottom,0px))}
body.is-playing.is-report .app{grid-template-rows:calc(44px + var(--safe-top)) minmax(0,1fr)}
body.is-playing .app{padding-left:max(env(safe-area-inset-left,0px),var(--tg-safe-left,0px));padding-right:max(env(safe-area-inset-right,0px),var(--tg-safe-right,0px))}
#menu .menu-panel{overflow-y:auto;max-height:100%}
/* Graham cameo (ported from Update 1 Brief 36 START). Menu only; gameplay grid and controls unchanged. */
.masthead{position:relative}
#graham-start{position:relative;display:block;flex:none;width:58px;height:58px;min-width:44px;min-height:44px;padding:0;margin:0;border:0;background:transparent;box-shadow:none;overflow:visible;cursor:pointer;-webkit-tap-highlight-color:transparent}
#graham-start img{display:block;width:100%;height:100%;object-fit:contain;animation:graham-breathe 4.8s ease-in-out infinite;filter:drop-shadow(0 3px 8px #0006)}
#graham-start:active{transform:scale(.96)}
#graham-start:focus-visible{outline:2px solid #9ce8cc;outline-offset:2px;border-radius:8px}
#graham-bubble{position:absolute;right:66px;top:2px;width:min(260px,calc(100vw - 112px));z-index:40;margin:0;padding:8px 11px;border:1px solid #9ce8cc;border-radius:12px;background:#18363dfc;box-shadow:0 5px 25px #020d16a8;color:#e0f9ea;font:500 11.5px/1.4 ui-rounded,system-ui,sans-serif;text-transform:none;letter-spacing:0;text-align:left;cursor:pointer}
#graham-bubble::after{content:'';position:absolute;right:-6px;top:22px;width:10px;height:10px;transform:rotate(45deg);border-top:1px solid #9ce8cc;border-right:1px solid #9ce8cc;background:#18363d}
body.is-playing #graham-start,body.is-playing #graham-bubble{display:none}
@keyframes graham-breathe{0%,100%{transform:translateY(1px)}50%{transform:translateY(-2px)}}
@media(max-width:375px){#graham-start{width:50px;height:50px}#graham-bubble{right:58px;font-size:11px;width:calc(100vw - 100px)}}
@media(prefers-reduced-motion:reduce){#graham-start img{animation:none}}

/* In-app webviews: no page bounce, pull-to-refresh, text selection or long-press callouts during play. */
html,body{overscroll-behavior:none}
body.is-playing{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
#stick-zone,#context-action,#light-action,#game{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
