:root{color-scheme:dark;--ivory:#eee3c9;--gold:#bca16b;--muted:#b6ac95;--ink:#172d33;--line:#aa946447;--serif:Georgia,'Times New Roman',serif;font-family:var(--serif);background:#07151e;color:var(--ivory)}
*{box-sizing:border-box}body{margin:0;overflow:hidden}button,input,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer;color:inherit;border:0;background:none}button:disabled{cursor:wait;opacity:.5}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #b58b44;outline-offset:5px}a{color:inherit;text-decoration:none}button,a{transition:color .2s,background .2s,opacity .2s}button[hidden],[hidden]{display:none!important}#world{position:fixed;inset:0;width:100%;height:100%;display:block;outline:none;touch-action:none;user-select:none}
.film-grain{position:fixed;inset:0;pointer-events:none;opacity:.025;z-index:2;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.5' filter='url(%23n)'/%3E%3C/svg%3E")}
#vignette{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 65% 42%,transparent 20%,#01090f94 100%);z-index:1}#cold-frame{position:fixed;inset:0;pointer-events:none;z-index:3;opacity:0;box-shadow:inset 0 0 130px 45px #9ad7eb85;background:linear-gradient(120deg,#c7efff33,transparent 15%,transparent 85%,#c7efff33)}#damage-flash{position:fixed;inset:0;pointer-events:none;z-index:4;opacity:0;box-shadow:inset 0 0 100px 30px #9c2832;transition:opacity .2s}
.eyebrow{font-size:10px;letter-spacing:2.5px;color:#79613c;text-transform:uppercase}.text-button{font-size:12px;padding:8px;color:#665d4c;text-decoration:underline;text-underline-offset:4px}.primary{display:flex;justify-content:space-between;align-items:center;gap:25px;width:100%;background:var(--ink);color:var(--ivory);font-size:13px;font-weight:400;padding:16px 23px;letter-spacing:2px;border:1px solid var(--ink);outline:1px solid #baa67d;outline-offset:-5px;text-transform:uppercase}.primary:hover{background:#29464a;color:#fff3d6}.status{font-size:11px;color:#766447;min-height:13px;line-height:1.4;margin:7px 0 0;text-align:center}
/* Lot 12 — a quiet, cinematic character selection over the live ship. */
.game-lobby{position:fixed;inset:0;z-index:5;color:#eee8db;font-family:Arial,Helvetica,sans-serif;background:linear-gradient(180deg,#040d15f5 0%,#06131dd9 16%,#06131d33 32%,transparent 44%,transparent 62%,#050e17b8 78%,#040c14fa 100%)}
.game-title{position:absolute;top:clamp(22px,4.5vh,48px);left:24px;right:24px;text-align:center;pointer-events:none}
.game-title h1{margin:0;font:400 clamp(34px,3.5vw,52px)/.98 var(--serif);letter-spacing:3px;color:#f0e8d9;text-shadow:0 2px 20px #0009}
.game-title h1 span{display:inline-block;font-size:.5em;letter-spacing:5px;margin-top:9px}
.game-title p{font-size:12px;font-weight:400;font-style:normal;line-height:1.6;letter-spacing:.15px;color:#aeb5b8;margin:18px auto 0;max-width:550px}
.character-lineup{position:absolute;top:25%;bottom:194px;left:50%;transform:translateX(-50%);width:min(1060px,88vw);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.character-choice{position:relative;border:0;padding:0;background:transparent;min-width:0;border-radius:0;isolation:isolate}
.character-choice:before{content:'';position:absolute;inset:38% -8px 30px;pointer-events:none;background:radial-gradient(ellipse at 50% 90%,#d4c7a518,transparent 65%);opacity:0;transition:opacity .22s}
.character-choice:hover:before,.character-choice.selected:before{opacity:1}
.character-choice:after{content:'';position:absolute;bottom:8px;left:34%;right:34%;height:2px;background:#d9c39b;transform:scaleX(0);transition:transform .22s}
.character-choice.selected:after{transform:scaleX(1)}
.character-choice:focus-visible{outline:1px solid #ddd1b9;outline-offset:5px}
.choice-name{position:absolute;bottom:0;left:0;right:0;height:54px;display:flex;align-items:center;justify-content:center;padding-bottom:9px;font:400 17px var(--serif);color:#a9b0b3;text-shadow:0 2px 8px #000;transition:color .2s}
.character-choice:hover .choice-name,.selected .choice-name{color:#f3ead7}
.lobby-controls{position:absolute;bottom:51px;left:50%;transform:translateX(-50%);width:min(480px,88vw)}
.lobby-mode{display:flex;justify-content:center;gap:26px;margin-bottom:13px}
.lobby-mode button{padding:6px 1px;font-size:11px;color:#8e999f;letter-spacing:.5px;border-bottom:1px solid transparent}
.lobby-mode button:hover{color:#eee7da}.lobby-mode .active{color:#e8ddc7;border-color:#c5af85}
.embark-row{display:flex;gap:18px;align-items:stretch}
.embark-row input{width:37%;min-width:0;border:0;border-bottom:1px solid #a2afb13d;background:transparent;padding:10px 3px;color:#e2e4e3;font-size:13px;border-radius:0}
.embark-row input::placeholder{color:#929b9e}
.game-lobby .primary{width:63%;min-height:49px;padding:14px 22px;font-family:Arial,Helvetica,sans-serif;font-size:12px;font-weight:600;letter-spacing:1px;outline:0;border:1px solid #cfc2a6;border-radius:2px;color:#182028;background:linear-gradient(#e7dfcf,#cfc1a5);box-shadow:inset 0 1px #fff5,0 5px 17px #0003;text-transform:uppercase}
.game-lobby .primary:hover:not(:disabled){background:linear-gradient(#f4eddf,#e1d2b3);box-shadow:inset 0 1px #fff7,0 5px 24px #0006}
.game-lobby .primary:active:not(:disabled){transform:translateY(1px);background:#c9b997;box-shadow:inset 0 1px 4px #0002}
.game-lobby .primary span{font-size:18px;font-weight:400;line-height:1}
.game-lobby .primary:focus-visible{outline:2px solid #f0e6d3;outline-offset:4px}
.game-lobby .status{font-size:11px;color:#bcc2c5;min-height:15px;margin-top:8px}
#online-fields{margin-top:9px}#server-url{width:100%;padding:10px 3px;background:#07131a;color:#e2e4e3;border:0;border-bottom:1px solid #a2afb155;font-size:12px;border-radius:0}
.game-lobby.online .character-lineup{bottom:239px}
.lobby-footer{position:absolute;left:32px;right:32px;bottom:20px;display:flex;justify-content:space-between;color:#89969d;font-size:10px;line-height:1.4}
.lobby-footer>div{display:flex;gap:19px;align-items:center}.lobby-footer button{padding:3px 0;font:inherit;color:inherit}
.lobby-footer a:hover,.lobby-footer button:hover{color:#e8ddc7}.lobby-footer a:focus-visible,.lobby-footer button:focus-visible{outline-offset:4px}
kbd{font:inherit;display:inline-block;padding:3px 5px;border:1px solid #a7bdca40;color:inherit;border-radius:0}
.modal{position:fixed;inset:0;z-index:12;display:grid;place-items:center;background:#031017aa;backdrop-filter:blur(6px)}.dialog,dialog{position:relative;width:min(470px,90vw);padding:36px;text-align:center;background:#eee3cb;color:#23363b;border:1px solid #b49a65;outline:1px solid #c5ad7a;outline-offset:-8px;box-shadow:0 20px 80px #0005}.dialog:before{content:'';display:block;width:100px;height:8px;border-top:3px double #9d8353;margin:0 auto 17px}.dialog h2,dialog h2{font:400 38px/1.15 var(--serif);letter-spacing:-.5px;margin:12px 0 18px}.dialog>p:not(.eyebrow){color:#625b4c;font-size:14px;line-height:1.65}.dialog .eyebrow{font-size:10px;margin-bottom:15px}.dialog .primary{margin:24px 0 12px}.secondary{width:100%;padding:13px;border:1px solid #b09a70;font-size:13px;color:#263b40;margin-bottom:12px;background:transparent}.secondary:hover{background:#ded0af}.result-dialog{width:min(550px,92vw);padding:40px}.door-emblem{position:relative;width:30px;height:48px;border:2px double #8d7147;margin:0 auto 20px;padding:3px}.door-emblem span{display:block;height:17px;border:1px solid #ac9363;margin-bottom:4px}.result-stats{display:flex;justify-content:space-around;border-block:3px double #b19c754d;padding:18px 0;margin:24px 0}.result-stats strong{display:block;font:400 28px var(--serif);font-variant-numeric:tabular-nums}.result-stats span{display:block;font-size:9px;letter-spacing:1px;color:#776a54;margin-top:8px}
dialog{position:fixed;width:min(740px,90vw);max-height:85vh;overflow:auto;padding:42px;z-index:30;text-align:left}dialog::backdrop{background:#020d17ba;backdrop-filter:blur(6px)}dialog h2{font-size:38px}.close{position:absolute;right:20px;top:15px;font-size:28px;color:#73603e}dialog p{font-size:14px;line-height:1.7;color:#625a4b}.help-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:25px}.help-grid b{font-size:11px;font-weight:400;letter-spacing:1.5px;color:#75603a}.help-grid p{font-size:13px}.help-note{border-top:3px double #b29c71;padding-top:20px;font-size:12px!important}.toast{position:fixed;bottom:27%;left:50%;transform:translateX(-50%);z-index:40;background:#eee2c9f5;color:#26393d;border-block:3px double #a89060;padding:12px 25px;font-size:14px;max-width:85vw;text-align:center;box-shadow:0 8px 30px #0005}
@media(max-height:760px){.game-title{top:23px}.game-title h1{font-size:34px}.game-title p{margin-top:12px;font-size:11px}.character-lineup{top:24%;bottom:165px;gap:18px}.game-lobby.online .character-lineup{bottom:211px}.lobby-controls{bottom:37px}.lobby-mode{margin-bottom:8px}.game-lobby .primary{min-height:44px;padding:11px 19px}.lobby-footer{bottom:13px;font-size:10px}.choice-name{font-size:15px}}
@media(max-width:680px){.game-title{left:20px;right:20px}.game-title h1{font-size:34px}.game-title p{font-size:11px;max-width:320px}.character-lineup{width:94vw;gap:7px;top:27%;bottom:185px}.game-lobby.online .character-lineup{bottom:230px}.choice-name{font-size:12px}.lobby-controls{width:86vw;bottom:58px}.lobby-footer{left:20px;right:20px;bottom:17px;font-size:9px}.lobby-footer>div{gap:12px}.lobby-footer a{display:none}.help-grid{grid-template-columns:1fr}dialog{padding:27px}}
@media(max-height:550px) and (min-width:681px){.game-title{top:12px}.game-title h1{font-size:25px}.game-title h1 span{margin-top:4px}.game-title p{margin-top:8px;font-size:10px}.character-lineup{top:24%;bottom:135px}.game-lobby.online .character-lineup{bottom:180px}.lobby-controls{bottom:28px}.lobby-mode{margin-bottom:4px}.lobby-footer{bottom:8px}.choice-name{font-size:13px}.game-lobby .status{margin-top:4px}.game-lobby .primary{min-height:39px;padding:9px 17px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
body{background:#040d15}
/* Restrained paper panels retain the period type without repeated double frames. */
.dialog,dialog{outline:0;border-color:#ac9877;box-shadow:0 24px 90px #0008}.dialog:before{display:none}
.primary{outline:0;border-radius:2px;letter-spacing:1px}.secondary{border-radius:2px;border-color:#b7a687}
.result-stats{border-block:1px solid #b19c754d}.help-note{border-top:1px solid #b29c71}.toast{border-block:1px solid #a89060}

/* F3 is a tool overlay: fixed width, no per-frame layout or pointer capture. */
#performance-panel{position:fixed;z-index:900;top:max(12px,env(safe-area-inset-top));right:12px;width:min(370px,calc(100vw - 24px));padding:14px 16px;background:rgba(5,12,19,.94);border:1px solid #6c8e9b;color:#e4f1f4;box-shadow:0 4px 24px #0008;font:12px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;pointer-events:none;contain:layout paint}
#performance-panel[hidden]{display:none}#performance-panel>strong{display:block;color:#9dd6e8;letter-spacing:.08em;margin-bottom:8px}#performance-panel>div{display:grid;grid-template-columns:146px minmax(0,1fr);gap:8px;padding:2px 0}#performance-panel b{font-weight:500;text-align:right;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}#performance-panel small{display:block;color:#94a9b3;font-size:10px;line-height:1.5;margin-top:9px}