:root{--ink:#d9d5be;--muted:#84877b;--acid:#f0d566;--ember:#d77342;--panel:#101715;--line:#324039;--bg:#070b0a;--good:#d9e879;--danger:#d15c48}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--ink);font-family:"Courier New",ui-monospace,monospace}
body{min-height:100dvh;background:radial-gradient(circle at 50% 15%,#1a2822 0,#09100f 46%,#050706 100%)}
button{font:inherit;color:inherit}
.game-shell{height:100dvh;max-width:1280px;margin:auto;padding:max(10px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:10px}
.topbar{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #3b4941;padding:0 0 9px;min-height:58px}
.identity{display:flex;align-items:center;gap:12px}.identity .sigil{width:38px;height:38px;border:1px solid #667269;display:grid;place-items:center;color:var(--acid);font-size:21px;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
.eyebrow{font-size:9px;letter-spacing:.22em;color:#8f9a90;margin:0 0 3px;text-transform:uppercase}.identity h1{margin:0;font:700 clamp(20px,3vw,32px)/.9 Georgia,serif;letter-spacing:.1em;color:#ebe5c8}
.statusline{display:flex;align-items:center;gap:10px}.energy{width:clamp(135px,22vw,250px)}.energy-copy{display:flex;align-items:flex-end;justify-content:space-between;text-transform:uppercase;font-size:9px;letter-spacing:.12em}.energy-copy strong{font-size:12px;color:#f3e6a2}.energy-copy b{font-size:20px}.energy-track{height:6px;background:#28312d;margin-top:4px;overflow:hidden}.energy-track i{display:block;width:36%;height:100%;background:linear-gradient(90deg,#b75b39,#f4d963);box-shadow:0 0 12px #f0d56680;transition:width .35s ease}
.day-chip{min-width:94px;border-left:1px solid var(--line);padding-left:10px;display:grid;grid-template-columns:25px 1fr;grid-template-rows:auto auto}.day-chip>span{grid-row:1/3;font-size:22px;color:#d3dcce}.day-chip b{font-size:11px;text-transform:uppercase;letter-spacing:.12em}.day-chip small{font-size:9px;color:var(--muted)}
.sound-button{height:34px;padding:0 12px;border:1px solid #4b5b52;background:#131c18;font-size:9px;letter-spacing:.1em;cursor:pointer}.sound-button:hover,.sound-button:focus-visible{border-color:var(--acid);color:var(--acid);outline:none}
.play-grid{min-width:0;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 265px;gap:12px}.stage-card{position:relative;min-width:0;min-height:0;width:100%;aspect-ratio:8/5;align-self:center;border:1px solid #46544c;background:#050807;display:grid;place-items:center;overflow:hidden}.stage-card:before{content:"";position:absolute;inset:0;border:6px solid #0b100e;pointer-events:none;z-index:4}
#gameCanvas{display:block;width:100%;height:100%;object-fit:contain;background:#091311;image-rendering:pixelated;outline:none;cursor:crosshair}
#gameCanvas:focus-visible{outline:1px dashed #829087;outline-offset:-7px}
.scene-label{position:absolute;z-index:6;left:15px;right:15px;top:11px;display:flex;justify-content:space-between;color:#c1c7b7;font-size:9px;letter-spacing:.17em;text-shadow:0 2px 2px #000}.scene-label span:first-child:before{content:"";display:inline-block;width:18px;height:1px;background:var(--acid);vertical-align:middle;margin-right:7px}
.grain{position:absolute;inset:0;pointer-events:none;z-index:3;opacity:.16;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.36'/%3E%3C/svg%3E");mix-blend-mode:screen}
.cinema-bars:before,.cinema-bars:after{content:"";position:absolute;z-index:5;left:0;right:0;height:8%;background:#020303;transition:height .6s}.cinema-bars:before{top:0}.cinema-bars:after{bottom:0}.cinema-bars.off:before,.cinema-bars.off:after{height:0}
.skip-button,.grab-button{position:absolute;z-index:8;border:1px solid #d6c874;background:#111814d9;color:#f6e99d;min-height:44px;cursor:pointer;letter-spacing:.09em}.skip-button{right:16px;bottom:14px;padding:0 14px;font-size:10px}.grab-button{left:50%;bottom:18px;transform:translateX(-50%);padding:0 32px;font-weight:800;box-shadow:0 0 0 4px #11181499,0 0 24px #e1ce5e35}.grab-button:hover,.grab-button:focus-visible{background:var(--acid);color:#141512;outline:none}
.toast{position:absolute;z-index:9;left:50%;top:18%;transform:translate(-50%,-12px);background:#0b100edb;border:1px solid #d5c568;color:#f2e79c;padding:8px 12px;font-size:10px;letter-spacing:.07em;opacity:0;pointer-events:none;transition:.22s}.toast.show{opacity:1;transform:translate(-50%,0)}
.side-panel{border:1px solid #3e4d45;background:linear-gradient(160deg,#121a17,#0b100e);padding:16px;min-height:0;display:flex;flex-direction:column;gap:12px}.panel-heading{display:flex;align-items:center;gap:10px;text-transform:uppercase;letter-spacing:.16em;font-size:9px;color:#929d93}.panel-heading i{height:1px;background:#35443b;flex:1}.instruction-card{display:grid;grid-template-columns:42px 1fr;gap:9px;padding:12px 0;border-top:1px solid #2c3832;border-bottom:1px solid #2c3832}.instruction-card .number{font:italic 30px/1 Georgia,serif;color:#e5d46d}.instruction-card small,.event-log span,.attempts>span{font-size:8px;text-transform:uppercase;letter-spacing:.14em;color:#768279}.instruction-card p{margin:5px 0 0;font:italic 14px/1.32 Georgia,serif;color:#d9dac9}
.legend{display:grid;gap:8px}.legend>div{display:flex;align-items:center;gap:5px}.legend p{margin:0 0 0 5px;font-size:9px;color:#9ca39d}.key,.mouse-icon{min-width:25px;height:25px;border:1px solid #58655d;display:grid;place-items:center;font-size:9px;background:#19211e}.mouse-icon{border-radius:13px;color:#dacc72}
.rewards{display:grid;gap:1px}.rewards p{margin:0;padding:7px 5px;display:grid;grid-template-columns:20px 1fr auto;border-bottom:1px dotted #344139;font-size:10px;text-transform:uppercase;letter-spacing:.08em}.rewards b{color:var(--good)}.animal-mark.moth{color:#d7d4a4}.animal-mark.rat{color:#a4a99c}.animal-mark.rabbit{color:#d9c18d}
.event-log{margin-top:auto;background:#080c0b;border-left:2px solid #68746d;padding:10px}.event-log p{margin:5px 0 0;font-size:9px;line-height:1.4;color:#afb5aa}.attempts{display:flex;justify-content:space-between;align-items:center}.attempts div{display:flex;gap:5px}.attempts i{width:22px;height:7px;background:var(--acid);transform:skew(-20deg)}.attempts i.empty{background:#303a35}
.touch-controls{display:none;min-height:92px;border:1px solid #3b4941;background:#0c1210;padding:8px 10px;align-items:center;justify-content:space-between;gap:8px}.joystick{display:flex;align-items:center;gap:7px;touch-action:none;user-select:none}.joystick-ring{width:70px;height:70px;border:1px solid #4f5d55;border-radius:50%;position:relative;background:radial-gradient(circle,#17201c 0 42%,transparent 43%)}.joystick-ring:after{content:"◀        ▶";position:absolute;inset:0;display:grid;place-items:center;font-size:10px;color:#7f8b83;white-space:pre}.joystick-knob{position:absolute;width:32px;height:32px;left:18px;top:18px;border:1px solid #d2c56d;border-radius:50%;background:#313c32;z-index:2;box-shadow:0 2px 7px #000}.joystick>span{font-size:8px;text-transform:uppercase;letter-spacing:.1em;color:#7f8983}.touch-hint{flex:1;text-align:center;display:grid;gap:3px}.touch-hint b{font:italic 12px Georgia,serif;color:#e2d46f}.touch-hint span{font-size:8px;line-height:1.3;color:#8b958e}.action-button{min-width:94px;min-height:50px;border:1px solid #65736a;background:#17201c;font-size:9px;letter-spacing:.08em}.action-button:active{background:var(--acid);color:#111}
footer{height:17px;display:flex;justify-content:space-between;align-items:center;color:#536057;text-transform:uppercase;letter-spacing:.14em;font-size:7px}
.end-screen{position:fixed;z-index:30;inset:0;background:#020504d9;backdrop-filter:blur(7px);display:grid;place-items:center;padding:18px}.end-screen[hidden]{display:none}.end-card{width:min(500px,100%);border:1px solid #6d7669;background:linear-gradient(155deg,#141c18,#080c0a);padding:clamp(24px,5vw,48px);box-shadow:0 24px 80px #000;text-align:center}.end-kicker{font-size:9px;letter-spacing:.22em;color:var(--acid)}.end-card h2{font:italic clamp(30px,7vw,54px)/1 Georgia,serif;margin:12px 0;color:#eee6c6}.end-card>p:not(.end-kicker){font:14px/1.5 Georgia,serif;color:#aeb5aa}.end-stats{display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid #334039;margin:24px 0}.end-stats div{padding:12px 4px;border-right:1px solid #334039}.end-stats div:last-child{border:0}.end-stats span{display:block;font-size:7px;text-transform:uppercase;color:#768179}.end-stats b{display:block;margin-top:4px;font-size:21px;color:#e4d573}.end-card button{width:100%;min-height:52px;border:1px solid var(--acid);background:var(--acid);color:#141611;font-weight:800;cursor:pointer;letter-spacing:.1em}.end-card button span{float:right}
@media (hover:none),(pointer:coarse){.touch-controls{display:flex}.game-shell{grid-template-rows:auto minmax(0,1fr) auto auto}.sound-button{min-height:44px}.skip-button,.grab-button{min-width:44px}}
@media (max-width:700px){.game-shell{padding:env(safe-area-inset-top) max(7px,env(safe-area-inset-right)) max(4px,env(safe-area-inset-bottom)) max(7px,env(safe-area-inset-left));gap:6px}.topbar{min-width:0;min-height:50px;padding-bottom:5px}.identity{min-width:0;gap:0}.identity .sigil{display:none}.eyebrow{font-size:6px;letter-spacing:.12em;white-space:nowrap}.identity h1{font-size:14px;letter-spacing:.04em;white-space:nowrap}.statusline{min-width:0;gap:4px}.energy{width:82px}.energy-copy>span{display:none}.energy-copy b{font-size:14px}.day-chip{min-width:52px;padding-left:4px;grid-template-columns:18px 1fr}.day-chip>span{font-size:16px}.day-chip b{font-size:8px}.day-chip small{font-size:7px}.sound-button{width:40px;min-height:44px;padding:0;font-size:0}.sound-button:after{content:"♪";font-size:17px}.sound-button[aria-pressed=true]:after{color:var(--acid)}.play-grid{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto;align-content:center;gap:6px}.stage-card{min-height:0}.side-panel{min-width:0;padding:7px 9px;gap:5px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center}.panel-heading,.rewards,.legend{display:none}.instruction-card{min-width:0;border:0;padding:0;grid-template-columns:27px 1fr}.instruction-card .number{font-size:21px}.instruction-card p{font-size:11px;margin-top:2px}.event-log{margin:0;max-width:145px;padding:5px 8px}.event-log p{font-size:7px;max-height:29px;overflow:hidden}.attempts{grid-column:1/-1}.scene-label{top:9px;left:11px;right:11px}.touch-controls{display:flex;min-width:0;min-height:82px;padding:5px 7px}.joystick-ring{width:62px;height:62px}.joystick-knob{left:15px;top:15px}.joystick>span{display:none}.action-button{min-width:82px;min-height:48px;font-size:8px}.touch-hint span{display:none}footer{display:none}.skip-button{bottom:9px;right:10px}.grab-button{bottom:10px}}
@media (max-height:450px) and (min-width:520px){.game-shell{grid-template-rows:auto minmax(0,1fr) auto;padding:5px 8px;gap:5px}.topbar{min-height:38px;padding-bottom:3px}.identity .sigil,.eyebrow{display:none}.identity h1{font-size:17px}.play-grid{grid-template-columns:minmax(0,1fr) 200px;grid-template-rows:1fr;gap:5px}.stage-card{min-height:0}.side-panel{display:flex;padding:8px;gap:5px}.panel-heading,.rewards{display:none}.instruction-card{display:block;padding:4px 0}.instruction-card .number{display:none}.instruction-card p{font-size:11px}.legend{display:none}.event-log{max-width:none;margin-top:auto}.touch-controls{position:static;z-index:auto;width:auto;min-height:58px;padding:3px 8px;background:#0c1210;border:1px solid #3b4941}.joystick-ring{width:54px;height:54px}.joystick-knob{left:11px;top:11px}.touch-hint{display:grid}.action-button{min-width:100px}.statusline{gap:5px}.energy{width:120px}.day-chip{min-width:70px}.sound-button{height:32px;min-height:32px}footer{display:none}}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}.grain{display:none}}