@font-face{font-family:Studio;src:url('assets/studio-pixel.ttf') format('truetype');font-display:swap}
:root{--ink:#f1dfb9;--night:#101e2f;--mint:#a5d8c1;--gold:#eeb478;--cyan:#8fe1df;--line:#49716e;--st:env(safe-area-inset-top,0px);--sb:env(safe-area-inset-bottom,0px);--sl:env(safe-area-inset-left,0px);--sr:env(safe-area-inset-right,0px);color-scheme:dark}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#102631;color:var(--ink);font-family:system-ui,sans-serif}body{background:repeating-linear-gradient(0deg,#102631 0 4px,#112834 4px 5px)}[hidden]{display:none!important}button{min-width:44px;min-height:44px;border:1px solid #698780;border-radius:0;padding:7px 10px;color:var(--ink);background:#203c45;font:600 12px system-ui,sans-serif;box-shadow:inset 0 -3px #081b284d;touch-action:manipulation;cursor:pointer;-webkit-tap-highlight-color:transparent}button:active,button.pressed{background:#4c756e}button:disabled{opacity:.5;cursor:default}button.primary{background:var(--gold);color:#152a37;border-color:#f3d29f}button:focus-visible,input:focus-visible{outline:3px solid var(--cyan);outline-offset:-4px}p{line-height:1.65}h1,h2,h3,.eyebrow,.deck,.site-header,.hud-title>strong,.controls>div>button{font-family:Studio,monospace;font-weight:400}.site-frame{max-width:1140px;margin:auto;padding:calc(var(--st) + 8px) calc(var(--sr) + 10px) calc(var(--sb) + 6px) calc(var(--sl) + 10px)}.site-header{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:34px;padding-bottom:9px}.site-header strong{font-weight:400;font-size:12px}.site-header span{font-size:7px;color:#9fb9b1}.site-header small{font-size:7px;white-space:nowrap}.cabinet{position:relative;height:calc(100dvh - var(--st) - var(--sb) - 78px);max-height:850px;min-height:0;display:grid;grid-template-rows:48px 86px minmax(0,1fr) 72px;border:2px solid var(--line);box-shadow:0 0 0 2px #091d2c,4px 4px #071d2a;background:var(--night);overflow:hidden}.topbar{display:flex;align-items:center;justify-content:space-between;gap:5px;padding:1px 5px;border-bottom:1px solid var(--line);background:#17323b}.deck{display:flex;flex-direction:column;gap:6px;min-width:0}.deck strong{font-size:10px;font-weight:400;white-space:nowrap}.deck span{font-size:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:130px;color:var(--mint)}.topbar nav{display:flex;gap:4px;flex-shrink:0}.topbar button{font-size:10px;padding:3px;min-width:46px}.hud{background:#172d37;border-bottom:1px solid var(--line);padding:7px 8px;min-height:0;position:relative;overflow:hidden}.hud-title{display:flex;align-items:center;justify-content:space-between;gap:5px}.hud-title>strong{font-size:9px;font-weight:400;max-width:calc(100% - 47px);line-height:1.5}.hud-title #map{position:absolute;right:5px;top:5px;min-width:44px;min-height:44px;font-size:10px;padding:4px}.hud p{margin:3px 0 0;line-height:1.3;font-size:10px}.hud #vitals{font-size:8px;letter-spacing:.1px;color:var(--mint);margin-right:46px}.hud #objective{color:var(--gold);margin-right:45px;font-size:10px}.hud #feedback{font-size:9px;color:#b5c9bf;max-height:24px;overflow:hidden}.arena{position:relative;min-height:0;overflow:hidden;background:var(--night)}canvas{image-rendering:pixelated}#world,#menu-scene{position:absolute;inset:0;width:100%;height:100%;display:block}#title-view{position:absolute;inset:0}.controls{display:flex;justify-content:space-between;align-items:stretch;gap:7px;border-top:1px solid var(--line);padding:6px;background:#17323b;min-height:0}.controls>div{display:flex;gap:5px;min-width:0}.controls button{min-width:48px;padding:4px;font-size:8px;line-height:1.4;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.controls .actions{flex:1;justify-content:flex-end}.controls .actions button{min-width:52px;flex:1;max-width:108px}.controls small{display:block;font:7px system-ui,sans-serif;margin-top:5px;color:#a3c3b6;white-space:nowrap}.controls #power{border-color:#8dcecc}.controls #interact{border-color:var(--gold)}.controls #jump{background:#31534f}
.cabinet[data-phase=title]{grid-template-rows:48px minmax(0,1fr)}.cabinet[data-phase=title] .hud,.cabinet[data-phase=title] .controls,.cabinet[data-phase=title] #world{display:none}.menu{position:absolute;inset:0;display:flex;align-items:flex-end}.menu-panel{width:100%;padding:13px 12px 10px;border-top:2px solid #9d8e75;background:#142e37f7}.eyebrow{font-size:6px;color:var(--mint);display:block;margin-bottom:9px}h1{font-size:28px;line-height:1.25;margin:2px 0 7px;color:#f5d6a1;white-space:nowrap;letter-spacing:-1px}.tagline{font-size:13px;color:#d6d8c0;margin:5px 0 13px}.menu-description{display:none;font-size:14px;line-height:1.9;color:#adc2b8}.menu-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px}.menu-actions button{font-size:12px}.wide{grid-column:1/-1}.micro{font-size:8px;color:#9bb8ae;line-height:1.5;margin:8px 0 0}.menu-brand{font-size:8px;line-height:1.6;color:#7e9e96;margin:10px 0 0}.menu-brand span{color:#b4c4b3}.site-footer{display:flex;justify-content:space-between;padding:10px 1px 0;gap:8px;font-size:8px;color:#9fb2a5}
#sheet-layer{position:absolute;inset:0 0 var(--save-reserve,0px);z-index:20;padding:8px;background:#071522b8;display:flex;align-items:center;justify-content:center}#sheet{display:flex;flex-direction:column;min-height:0;max-height:100%;width:100%;max-width:690px;background:#152f39;border:2px solid #89a095;box-shadow:0 0 0 3px #10222d}.sheet-header{display:flex;align-items:center;justify-content:space-between;gap:5px;padding:4px 5px;border-bottom:1px solid #708d82;flex-shrink:0;background:#203f46}.sheet-header h2{font-size:9px;line-height:1.6;margin:0;min-width:0;overflow-wrap:anywhere}.sheet-header nav{display:flex;gap:3px;flex-shrink:0}.sheet-header button{min-width:44px;font-size:9px;padding:3px}#sheet-body{padding:15px;min-height:0;overflow:auto;overscroll-behavior:contain;touch-action:pan-y;scrollbar-width:thin;font-size:13px}#sheet-body>p:first-child{margin-top:0}#sheet-body>button{display:block;width:100%;margin:10px 0 0}#sheet-body h3{font-size:10px;line-height:1.8;color:var(--gold);margin:20px 0 8px}.keyline{display:flex;flex-direction:column;gap:8px;padding:12px;margin:12px 0;border:1px solid #4c7773;background:#1a3941}.keyline strong{color:var(--gold);font-size:13px}.keyline span,.keyline small{line-height:1.7}.keyline small{font-size:11px;color:#a5beb2}.keyline button{width:100%}.button-row{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:10px 0}.button-row button{width:100%}.notice{padding:11px;border:1px solid #b79c75;color:#f6d8a8;background:#3c4140;font-size:12px;line-height:1.6}.portrait-line{display:flex;align-items:center;gap:13px}.portrait-line canvas{width:65px;height:88px;flex-shrink:0}.portrait-line .eyebrow{line-height:1.8}.setting{display:block;line-height:1.8;margin:4px 0 15px}.setting input{display:block;width:100%;height:44px;margin:0;accent-color:var(--mint)}.map-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:14px 0}.map-room{padding:5px;font-size:9px;min-height:58px;white-space:normal}.map-room.current{background:#45675d;border-color:var(--gold)}.map-room small{display:block;font-size:8px;color:#c9d8bd;margin-top:4px}.map-room.unknown{opacity:.25;pointer-events:none}.tuple{border-left:3px solid var(--gold);padding:4px 11px;margin:15px 0}.tuple h4{margin:0 0 7px;color:var(--gold);font-size:12px}.tuple p{margin:4px 0;font-size:12px}.tuple small{font-size:11px;line-height:1.8;color:#b0c4b4}.expanded{position:fixed;inset:0;z-index:100;height:100dvh!important;max-height:none!important;min-height:0!important;padding:var(--st) var(--sr) var(--sb) var(--sl);border:0;box-shadow:none}.is-expanded{overflow:hidden}.expanded:fullscreen{width:100%;height:100%;background:var(--night)}#save-status{grid-column:1/-1;margin:0;padding:5px 7px;border-top:1px solid #b7966f;background:#45433c;color:#f4dfb9;font-size:11px;line-height:1.4}.has-save-error{grid-template-rows:48px 86px minmax(0,1fr) 72px auto}.has-save-error[data-phase=title]{grid-template-rows:48px minmax(0,1fr) auto}
@media(min-width:740px) and (min-height:521px){.topbar{padding:1px 12px}.deck strong{font-size:14px}.deck span{font-size:7px;max-width:230px}.topbar button{font-size:12px;min-width:62px}.hud{padding:8px 14px}.hud-title>strong{font-size:12px}.hud p{font-size:12px}.hud #vitals{font-size:10px}.hud #feedback{font-size:11px}.menu{justify-content:flex-end;align-items:stretch}.menu-panel{width:48%;padding:24px;display:flex;flex-direction:column;justify-content:center;border-left:2px solid #9d8e75;border-top:0}h1{font-size:36px}.tagline{font-size:16px}.menu-description{display:block}.controls{padding:6px 14px}.controls button{min-width:70px;font-size:10px}.controls small{font-size:9px}.controls .actions{max-width:420px}.menu-brand{font-size:10px}}
@media(max-width:580px){.site-header span{display:none}.site-header strong{font-size:11px}.site-header small{font-size:6px}.deck span{max-width:110px}}
@media(max-height:650px) and (max-width:499px){.menu-panel{padding:9px 10px}.eyebrow{margin-bottom:5px}h1{font-size:25px}.tagline{font-size:12px;margin:4px 0 9px}.menu-brand{font-size:7px;margin-top:7px}.micro{font-size:7px}}
@media(max-height:520px){.site-header,.site-footer{display:none}.site-frame{padding:calc(var(--st) + 4px) calc(var(--sr) + 6px) calc(var(--sb) + 4px) calc(var(--sl) + 6px)}.cabinet{height:calc(100dvh - var(--st) - var(--sb) - 8px);max-height:none;grid-template-rows:46px 60px minmax(0,1fr) 56px}.cabinet[data-phase=title]{grid-template-rows:46px minmax(0,1fr)}.hud{padding:3px 6px}.hud-title>strong{font-size:8px}.hud #vitals{font-size:7px;margin-top:1px}.hud #objective{font-size:9px;line-height:1.25;margin-top:2px}.hud #feedback{display:none}.controls{padding:5px;gap:5px}.controls button{font-size:8px;min-width:44px}.controls .actions button{min-width:48px}.controls small{font-size:6px;margin-top:2px}#sheet-layer{padding:6px}#sheet-body{padding:11px}.has-save-error{grid-template-rows:46px 60px minmax(0,1fr) 56px auto}.has-save-error[data-phase=title]{grid-template-rows:46px minmax(0,1fr) auto}}
@media(max-height:520px) and (min-width:500px){.cabinet{grid-template-columns:minmax(0,1fr) 148px;grid-template-rows:46px minmax(0,1fr) 56px}.topbar{grid-column:1/-1}.deck{flex-direction:row;align-items:center;gap:14px}.deck span{max-width:210px}.hud{grid-column:2;grid-row:2;border-bottom:0;border-left:1px solid var(--line);padding:8px}.hud-title>strong{font-size:9px;max-width:100%;padding-bottom:6px}.hud-title #map{position:static;margin-top:8px}.hud-title{display:flex;flex-direction:column;align-items:stretch}.hud #vitals{font-size:8px;line-height:1.8;margin:6px 0}.hud #objective{font-size:10px;margin:6px 0 0}.hud #feedback{display:none}.arena{grid-column:1;grid-row:2}.controls{grid-column:1/-1;grid-row:3}.controls .actions{flex:none}.controls .actions button{min-width:82px}.controls .movement button{min-width:64px}.cabinet[data-phase=title]{grid-template-columns:1fr;grid-template-rows:46px minmax(0,1fr)}.menu{align-items:stretch;justify-content:flex-end}.menu-panel{width:52%;display:flex;flex-direction:column;justify-content:center;border-left:1px solid var(--gold);border-top:0;padding:5px 10px}.eyebrow{font-size:5px;margin-bottom:4px}h1{font-size:24px;margin:1px 0}.tagline{font-size:11px;margin:5px 0 7px;line-height:1.45}.menu-actions{gap:4px}.menu-actions button{font-size:10px;padding:3px}.menu-brand{font-size:7px;margin-top:6px}.menu-description,.micro{display:none}.has-save-error{grid-template-rows:46px minmax(0,1fr) 56px auto}.has-save-error[data-phase=title]{grid-template-rows:46px minmax(0,1fr) auto}}
@media(max-height:440px) and (max-width:499px){.menu{align-items:stretch;justify-content:flex-end}.menu-panel{width:66%;padding:6px 8px;border-left:1px solid var(--gold);border-top:0;display:flex;flex-direction:column;justify-content:center}.menu-panel .eyebrow,.menu-panel .micro{display:none}.menu-panel h1{font-size:22px;margin:0}.menu-panel .tagline{font-size:10px;line-height:1.4;margin:5px 0 7px}.menu-actions{gap:4px}.menu-actions button{font-size:10px;padding:3px}.menu-brand{font-size:7px;margin:6px 0 0}.has-save-error{grid-template-rows:46px 50px minmax(0,1fr) 54px auto}.has-save-error #objective{font-size:8px}.has-save-error #save-status{font-size:10px;line-height:1.2;padding:3px 5px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}

@media(max-height:520px) and (min-width:500px){.hud-title{display:block;min-height:46px;padding-right:45px;position:relative}.hud-title>strong{font-size:8px;line-height:1.5;padding-bottom:0}.hud-title #map{position:absolute;top:0;right:0;margin:0}.hud #vitals{font-size:7px;line-height:1.4;margin:5px 0}.hud #objective{font-size:9px;line-height:1.4;margin-top:5px}}
.expanded #sheet-layer{inset:var(--st) var(--sr) calc(var(--sb) + var(--save-reserve,0px)) var(--sl)}
