:root{color-scheme:dark;--ink:#e8e9df;--muted:#a5a99a;--line:#444a3e;--surface:#1b1f1a;--red:#d0453d;--red-dark:#792823;--green:#a3aa88;--black:#111310;font-family:"Trebuchet MS",Verdana,sans-serif}
[hidden]{display:none!important}
.media-wait{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center;background:#070908bc;color:#f5c4b7;font:18px Impact,"Arial Narrow",sans-serif;letter-spacing:.12em;text-align:center;touch-action:none}
*{box-sizing:border-box}html{background:var(--black)}body{margin:0;min-width:320px;color:var(--ink);background:radial-gradient(circle at 14% -20%,#33382c 0,transparent 31%),linear-gradient(90deg,#151813,#1c201b 62%,#171a16);-webkit-font-smoothing:antialiased}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}a{color:inherit;text-decoration:none}:focus-visible{outline:2px solid #f4c577;outline-offset:3px}
.app-shell{max-width:1640px;min-height:100dvh;margin:0 auto;display:flex;flex-direction:column}.masthead{height:68px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(18px,2.8vw,48px);border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;font-family:Impact,"Arial Narrow",sans-serif;font-size:22px;letter-spacing:.085em}.brand-mark{display:grid;place-items:center;width:29px;height:29px;background:var(--red);color:#151411;clip-path:polygon(50% 0,100% 90%,77% 90%,66% 70%,34% 70%,23% 90%,0 90%);font-size:19px}.brand-slash{color:var(--red);padding:0 3px}.masthead-right{display:flex;align-items:center;gap:20px}.edition,.pill,.screen-label,.screen-footer,.section-head,.detail-row,.touch-controls>div>span,.page-footer,.eyebrow,.progress-caption,.launcher-index,.launcher-action,.launcher-foot{font-family:Consolas,"Courier New",monospace;font-size:11px;letter-spacing:.1em}.edition{color:var(--muted)}.pill{border:1px solid #61705b;color:#b7c7a8;padding:7px 10px;border-radius:2px}.pill.connected{border-color:#75936b}.pill.offline{border-color:#89524a;color:#e29b92}
.masthead .brand{min-height:44px}
.ea-notice{margin:0;padding:7px clamp(18px,2.8vw,48px);border-bottom:1px solid var(--line);background:#20221d;color:#ddd6ca;font-size:12px;line-height:1.35;text-align:center}
.music-option{width:min(420px,100%);margin-top:12px;color:#d9c7bc;font-size:12px}.music-label{display:block;margin-bottom:5px;font-family:Consolas,"Courier New",monospace;font-size:10px;letter-spacing:.08em}.music-actions{display:flex;gap:8px;justify-content:center}.music-pick{position:relative;min-width:0}.music-button,.music-actions button{display:flex;align-items:center;justify-content:center;min-height:44px;border:1px solid #c88173;background:#522c28;color:#fff;padding:7px 12px;font-family:Consolas,"Courier New",monospace;font-size:11px;letter-spacing:.04em;white-space:nowrap}.music-pick input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.music-pick input:disabled{cursor:not-allowed}.music-pick:has(input:disabled) .music-button{opacity:.5}.music-pick:focus-within .music-button{outline:2px solid #f4c577;outline-offset:3px}.music-actions button{min-width:55px;background:#30392e}.music-option p{margin:7px 0 0;color:#d6c3b8;line-height:1.35;overflow-wrap:anywhere}
.layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(252px,290px);gap:clamp(18px,2.5vw,36px);padding:clamp(18px,2.8vw,42px);flex:1;align-content:start}.game-column{min-width:0}.screen-frame{max-width:840px;border:1px solid #4c5347;background:#080908;box-shadow:0 28px 65px #0008,0 0 0 7px #111510}.screen-label,.screen-footer{height:31px;display:flex;justify-content:space-between;align-items:center;padding:0 12px;color:#b0b9a2;background:#242b23}.screen-label{border-bottom:1px solid #4c5347}.screen-footer{border-top:1px solid #4c5347;color:#8d9b88}.viewport{position:relative;aspect-ratio:8/5;overflow:hidden;background:#000;display:grid;place-items:center;touch-action:none;-webkit-touch-callout:none;user-select:none}.viewport canvas{display:block;width:100%;height:100%;image-rendering:pixelated;image-rendering:crisp-edges;outline:none;touch-action:none}.boot-panel{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:25px;text-align:center;background:radial-gradient(circle at 50% 32%,#3f1713 0,#221411 36%,#0c0b0a 77%);z-index:2}.boot-panel::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,#fff1 0 1px,transparent 1px 4px);pointer-events:none;opacity:.19}.boot-panel>*{position:relative}.boot-glyph{font-family:Impact,"Arial Narrow",sans-serif;font-size:clamp(28px,5vw,60px);line-height:1;color:#ec5d4a;letter-spacing:-.06em;filter:drop-shadow(0 0 20px #7c211b)}.eyebrow{color:#f2a99b;margin:12px 0 5px}.boot-panel h1{font-family:Impact,"Arial Narrow",sans-serif;font-size:clamp(40px,8vw,100px);line-height:1;letter-spacing:.075em;margin:0 0 13px;text-shadow:0 4px 0 #451a17}.boot-message{font-size:14px;color:#ded5c8;max-width:500px;margin:0 0 15px}.progress-track{width:min(360px,76%);height:6px;border:1px solid #815b50;background:#2a1b18}.progress-track span{display:block;height:100%;width:0;background:#ed6b53;transition:width .2s linear}.progress-caption{color:#ac897e;margin:8px 0 17px}.play-button,.file-button{border:1px solid #eb806d;background:var(--red);color:#fff;padding:14px 22px;font-family:Impact,"Arial Narrow",sans-serif;font-size:18px;letter-spacing:.08em;min-height:48px;box-shadow:5px 5px 0 #321513}.play-button span{padding-left:16px}.play-button:hover:not(:disabled),.file-button:hover{background:#e9574e}.local-files{max-width:420px;margin-top:16px;color:#d9c7bc;font-size:13px}.local-files p{margin:0 0 14px}.file-button{display:inline-flex;align-items:center;justify-content:center;font-size:14px;min-height:44px}.local-files input{position:absolute;opacity:0;width:1px;height:1px}.local-files small{display:block;margin:12px 0 0;color:#c7a99d}
.boot-panel{overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;justify-content:flex-start;justify-content:safe center}.boot-panel>*{flex-shrink:0}
.under-screen{display:flex;justify-content:space-between;align-items:center;gap:14px;color:var(--muted);padding:16px 2px;font-size:13px}.under-screen p{margin:0}.under-screen button{white-space:nowrap;min-height:44px;border:0;border-bottom:1px solid var(--red);background:transparent;color:var(--ink);font-family:Consolas,"Courier New",monospace;font-size:11px;letter-spacing:.07em;padding:7px 0}.help-panel{border:1px solid var(--line);background:#232821;padding:18px 22px;max-width:850px}.help-panel h2{font-family:Impact,"Arial Narrow",sans-serif;font-weight:400;letter-spacing:.07em;margin:0 0 10px}.help-panel p{font-size:13px;line-height:1.5;color:#c8cdbf;margin:8px 0}
.command-column{padding:2px 0 0}.section-head{display:flex;gap:12px;align-items:center;color:#ef806c;white-space:nowrap}.section-rule{height:1px;background:#765149;flex:1}.command-column h2{font-family:Impact,"Arial Narrow",sans-serif;letter-spacing:.07em;font-weight:400;font-size:clamp(38px,4vw,57px);line-height:.96;margin:18px 0 14px}.aside-copy{font-size:14px;color:#b5baac;line-height:1.5;margin:0 0 20px}.detail-row{display:flex;justify-content:space-between;gap:14px;border-top:1px solid var(--line);padding:10px 0;color:#949d8d}.detail-row strong{font-weight:400;text-align:right;color:#e5e8df;letter-spacing:0;text-transform:none}.pair-head{margin-top:32px}.pair-note{font-size:13px;line-height:1.4;color:#b8bcaf;margin:12px 0}.command-column form label{display:block;margin:13px 0 6px;font-family:Consolas,"Courier New",monospace;font-size:11px;letter-spacing:.1em;color:#cbd0c2}.command-column label small{font-size:10px;color:#889082}.command-column input{width:100%;height:44px;background:#111510;border:1px solid #555e50;border-radius:0;padding:0 11px;color:var(--ink);font-size:14px}.command-column input::placeholder{color:#7a8375}.room-actions{display:flex;gap:8px;margin-top:10px}.room-actions button,.room-line button{min-height:44px;flex:1;border:1px solid #737e6b;background:#30392e;color:#e7eadf;font-family:Consolas,"Courier New",monospace;font-size:11px;letter-spacing:.06em}.room-actions button:hover:not(:disabled),.room-line button:hover{background:#42513c}.room-panel{margin-top:15px;border:1px solid #62705b;padding:12px;background:#212a20}.room-line{display:flex;gap:6px;align-items:center;font-family:Consolas,"Courier New",monospace;font-size:11px}.room-line strong{margin-left:auto;color:#f1d5a3}.room-line button{min-height:44px;flex:0;padding:0 8px}.room-panel p{font-size:13px;color:#c8d1c2}.room-status{min-height:2em;font-size:12px;color:#d3a692;line-height:1.45}
.voice-panel{border-top:1px solid var(--line);padding-top:14px;margin-top:16px}.voice-status{min-height:2.7em;margin:10px 0;color:#c8d1c2;font-size:12px;line-height:1.4}.voice-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.voice-actions button{min-height:44px;border:1px solid #737e6b;background:#30392e;color:#e7eadf;font-family:Consolas,"Courier New",monospace;font-size:11px;letter-spacing:.04em;padding:5px 7px}.voice-actions button:hover:not(:disabled){background:#42513c}.voice-actions button[aria-pressed="true"]{background:#91433a;border-color:#da766a}
.room-reload{width:100%;min-height:44px;border:1px solid #d97567;background:#642d28;color:#fff;font-family:Consolas,"Courier New",monospace;font-size:12px;letter-spacing:.06em}
.touch-controls{display:grid;grid-template-columns:1.1fr 1.5fr 1fr;gap:16px;border-top:1px solid var(--line);padding:14px clamp(18px,2.8vw,42px);background:#20251f}.touch-controls>div>span{display:block;color:#a8b3a1;margin-bottom:8px}.key-group{display:flex;flex-wrap:wrap;gap:5px}.key-group button{min-width:44px;min-height:44px;border:1px solid #62705a;background:#303a2e;color:#e6eadf;font-family:Consolas,"Courier New",monospace;font-size:12px;touch-action:manipulation}.key-group button[aria-pressed="true"]{background:#b9493e;border-color:#ec806f}.teams button{min-width:36px;flex:1}.arrows button{font-size:20px}.page-footer{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding:13px clamp(18px,2.8vw,42px);color:#778173}
.teams button{min-width:44px}.room-line button{min-width:44px}
.touch-right #text-helper-toggle{width:100%;min-height:44px;margin-top:8px;border:1px solid #ad675d;background:#60302b;color:#f7e7df;font-family:Consolas,"Courier New",monospace;font-size:12px;letter-spacing:.08em}
.text-helper{position:fixed;left:0;right:0;bottom:0;z-index:10;max-width:1640px;margin:0 auto;display:grid;grid-template-columns:minmax(130px,1fr) minmax(180px,2fr) auto;align-items:center;gap:8px 12px;padding:12px clamp(18px,2.8vw,42px) max(12px,env(safe-area-inset-bottom));border-top:1px solid #a85f55;background:#1e261d;box-shadow:0 -12px 28px #0008}.text-helper label,.text-helper small,.text-helper #game-text-status{font-family:Consolas,"Courier New",monospace;font-size:11px;letter-spacing:.06em}.text-helper label{color:#f0a898}.text-helper small{display:block;color:#a9b39f;font-size:9px;margin-top:4px}.text-helper input{height:44px;min-width:0;background:#0b100c;border:1px solid #a9b79c;color:#fff;padding:0 12px;font-size:16px}.text-actions{display:flex;gap:5px}.text-actions button{min-height:44px;min-width:44px;padding:0 9px;border:1px solid #77896e;background:#354131;color:#edf1e6;font-family:Consolas,"Courier New",monospace;font-size:11px}.text-helper #game-text-status{grid-column:2/-1;color:#bac8b0}
.page-footer a{display:inline-flex;align-items:center;min-height:44px;margin-left:8px;border-bottom:1px solid #88665d;color:#c0c8b5}
/* Playing uses the visible viewport as a black stage. The canvas element itself
   has the image's 8:5 size, so SDL and touch coordinates share one rectangle. */
html:has(body.playing),body.playing{overflow:hidden;width:100%;height:100%;background:#000;overscroll-behavior:none}
body.playing .app-shell{position:fixed;inset:0;width:var(--visible-width,100vw);height:var(--visible-height,100dvh);max-width:none;min-height:0;margin:0;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);display:block;overflow:hidden;background:#000}
body.playing .masthead,body.playing .ea-notice,body.playing .screen-label,body.playing .screen-footer,body.playing .under-screen p,body.playing #help-toggle,body.playing .help-panel,body.playing .page-footer{display:none!important}
body.playing .layout{position:relative;display:block;width:100%;height:100%;padding:0;flex:none}
body.playing .screen-frame,body.theater.playing .screen-frame{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:var(--game-width);height:var(--game-height);max-width:none;margin:0;border:0;box-shadow:none;background:#000}
body.playing .viewport{width:100%;height:100%;aspect-ratio:auto;overflow:hidden}
body.playing .viewport canvas{width:100%;height:100%;object-fit:fill}
body.playing .under-screen{position:fixed;z-index:12;top:max(0px,env(safe-area-inset-top));right:max(0px,env(safe-area-inset-right));display:flex;gap:4px;width:auto;max-width:none;min-height:0;margin:0;padding:0;background:#101710bd}
body.playing .under-screen button{display:block;min-width:44px;min-height:44px;margin:0;padding:4px 8px;border:1px solid #7b9479;background:#1a241de6;color:#f0f5ea;font-family:Consolas,"Courier New",monospace;font-size:10px;letter-spacing:0;white-space:normal}
body.playing .command-column{display:none}
body.playing.session-open .command-column{position:fixed;display:block;top:0;right:0;bottom:0;z-index:20;width:min(360px,100vw);overflow-y:auto;padding:max(20px,env(safe-area-inset-top)) 24px max(40px,env(safe-area-inset-bottom));border-left:1px solid #9c6259;background:#1c241b;box-shadow:-24px 0 45px #000a}
.session-close{display:none}body.playing.session-open .session-close{display:block;width:100%;min-height:44px;margin-bottom:18px;border:1px solid #9c6259;background:#60302b;color:#fff;font-family:Consolas,"Courier New",monospace;font-size:11px;letter-spacing:.08em}
body.playing .touch-controls{position:absolute;z-index:8;border:0;background:none;box-shadow:none}
body.playing .touch-controls button,body.playing .touch-tray-toggle,body.playing .rotate-hint button{min-width:44px;min-height:44px}
body.playing[data-controls="none"] .touch-controls{display:none}
body.playing[data-controls="rail"] .touch-controls{position:static;display:contents;padding:0;pointer-events:none}
body.playing[data-controls="rail"] .touch-controls>div{position:absolute;width:var(--side-band);padding:0 4px;pointer-events:auto}
body.playing[data-controls="rail"] .touch-controls>div>span{display:none}
body.playing[data-controls="rail"] .touch-left,body.playing[data-controls="rail"] .touch-mid{left:env(safe-area-inset-left)}
body.playing[data-controls="rail"] .touch-left{top:calc(50% - 170px)}
body.playing[data-controls="rail"] .touch-mid{top:calc(50% - 71px)}
body.playing[data-controls="rail"] .touch-right{right:env(safe-area-inset-right);top:110px}
body.playing[data-controls="rail"] .key-group{display:grid;grid-template-columns:repeat(2,minmax(44px,1fr));gap:5px}
body.playing[data-controls="rail"] .teams button{flex:none}
body.playing[data-controls="rail"] .touch-right #text-helper-toggle{padding:2px;font-size:10px}
body.playing[data-controls="rail"] .under-screen{width:var(--side-band);flex-direction:column;gap:0}
body.playing[data-controls="rail"] .under-screen button{width:100%}
body.playing[data-controls="bottom"] .touch-controls{left:env(safe-area-inset-left);right:env(safe-area-inset-right);top:var(--game-bottom);bottom:0;display:block;overflow-y:auto;padding:8px 12px max(8px,env(safe-area-inset-bottom));background:#000;overscroll-behavior:contain}
body.playing[data-controls="bottom"] .touch-controls>div{margin:0 0 5px}
body.playing[data-controls="bottom"] .touch-controls>div>span{margin:0 0 3px}
body.playing[data-controls="bottom"] .key-group{gap:4px}
body.playing[data-controls="bottom"] .teams button{flex:0 0 44px}
body.playing[data-controls="bottom"] .touch-right{display:flex;align-items:center;gap:8px}
body.playing[data-controls="bottom"] .touch-right>span{display:none}
body.playing[data-controls="bottom"] .touch-right .arrows{flex:none}
body.playing[data-controls="bottom"] .touch-right #text-helper-toggle{width:auto;flex:1;margin:0;padding:2px 5px}
body.playing[data-controls="collapsed"] .touch-controls{display:none}
body.playing[data-controls="collapsed"].tray-open .touch-controls{display:block;position:fixed;left:0;right:0;bottom:0;top:auto;z-index:11;max-height:min(70dvh,430px);overflow-y:auto;padding:12px max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));border-top:1px solid #9c6259;background:#182018f5;box-shadow:0 -18px 40px #000b}
body.playing[data-controls="collapsed"].tray-open .touch-controls>div{margin:0 0 10px}
body.playing[data-controls="collapsed"].tray-open .teams button{flex:0 0 44px}
body.playing .touch-tray-toggle{position:fixed;z-index:13;top:max(0px,env(safe-area-inset-top));left:max(0px,env(safe-area-inset-left));width:44px;height:44px;border:1px solid #7b9479;background:#1a241de6;color:#f0f5ea;font-size:22px}
body.playing.tray-open .touch-tray-toggle{background:#a44439}
body.playing .rotate-hint{position:fixed;z-index:9;top:max(8px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:6px;max-width:calc(100% - 16px);padding:0 0 0 12px;border:1px solid #7b9479;background:#1a241df2;color:#e8e9df;font:11px Consolas,"Courier New",monospace;white-space:nowrap}
body.playing .rotate-hint button{border:0;background:#303a2e;color:#fff;font-size:20px}
body.playing .text-helper{max-width:none}
@media(max-width:900px){.layout{grid-template-columns:1fr}.command-column{display:grid;grid-template-columns:1fr 1fr;gap:0 28px}.command-column>.section-head:first-child,.command-column>h2,.command-column>.aside-copy,.command-column>.detail-row{grid-column:1}.pair-head,.pair-note,#room-form,#room-panel,#room-status{grid-column:2}.pair-head{grid-row:1;margin:0}.pair-note{grid-row:2}.command-column h2{font-size:43px}.touch-controls{grid-template-columns:1fr 1fr}.touch-right{grid-column:1/-1}}@media(max-width:620px){.masthead{height:58px}.brand{font-size:18px}.edition{display:none}.layout{padding:14px;gap:18px}.command-column{display:block}.pair-head{margin-top:20px}.touch-controls{display:block;padding:12px 14px}.touch-controls>div{margin-bottom:10px}.page-footer{display:block;font-size:9px}.page-footer span{display:block;margin:3px 0}.under-screen{display:block}.under-screen button{margin-top:8px}.boot-panel{padding:12px}.boot-glyph,.eyebrow,.progress-caption{display:none}.boot-panel h1{font-size:36px;margin-bottom:6px}.boot-message{font-size:11px;margin-bottom:7px}.play-button{font-size:14px;min-height:44px;padding:8px 12px}.local-files{font-size:11px}.local-files small{display:none}}
@media(hover:hover) and (pointer:fine){body:not(.touch-capable) .touch-controls{display:none}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}
@media(max-width:900px){.boot-panel{justify-content:flex-start;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y}.boot-panel>*{flex-shrink:0}.boot-message{overflow-wrap:anywhere}}
@media(max-width:900px){.text-helper{grid-template-columns:1fr}.text-helper #game-text-status{grid-column:1}.text-actions{display:grid;grid-template-columns:repeat(4,minmax(44px,1fr))}.text-actions button{padding:0 4px}}
/* Shared welcome screen; staged separately until the Rust gateway owns ages.live. */
.launcher-page{min-height:100dvh;overflow:hidden}.launcher{min-height:calc(100dvh - 42px);display:grid;grid-template-columns:1fr 1fr}.launcher-half{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(25px,5vw,80px);overflow:hidden}.launcher-half::before{content:"";position:absolute;inset:0;opacity:.18;pointer-events:none;background:repeating-linear-gradient(90deg,#fff2 0 1px,transparent 1px 42px)}.launcher-half>*{position:relative}.launcher-ages{background:linear-gradient(160deg,#283b30,#122119 65%,#0c1711)}.launcher-red{background:radial-gradient(circle at 70% 20%,#aa3025,#521b19 48%,#1a1010 87%)}.launcher-index{color:#e0e8d8}.launcher-name{font-family:Impact,"Arial Narrow",sans-serif;font-size:clamp(85px,16vw,250px);letter-spacing:-.04em;line-height:.84;text-shadow:7px 11px 0 #0003}.launcher-action{display:flex;justify-content:space-between;align-items:center;max-width:420px;padding:19px 0;border-top:1px solid #fff7;color:#fff}.launcher-action span{font-size:22px}.launcher-half:hover .launcher-action{border-color:#fff}.launcher-foot{margin:0;padding:14px 20px;color:#9ba598;text-align:center;background:#0e110e}@media(max-width:700px){.launcher{grid-template-columns:1fr;min-height:calc(100dvh - 42px)}.launcher-half{min-height:calc((100dvh - 42px)/2)}.launcher-name{font-size:clamp(70px,18vw,130px)}}
