
:root{color-scheme:dark;--bg:#171423;--panel:#211d30;--line:#393247;--muted:#aaa1b7;--gold:#f5ca73;--ink:#f5eee1;--mint:#a8d5ac;font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;color:var(--ink);background:var(--bg);font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.55;cursor:wait}button:focus-visible,a:focus-visible,input:focus-visible,canvas:focus-visible{outline:2px solid var(--gold);outline-offset:4px}a{color:inherit;text-decoration:none}[hidden]{display:none!important}.topbar{height:90px;margin:0 auto;max-width:1400px;padding:0 44px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:12px;font:700 14px ui-monospace,monospace;letter-spacing:1px}.mark{display:grid;place-items:center;background:var(--gold);color:var(--bg);width:30px;height:34px;font-size:24px;box-shadow:4px 4px 0 #6c4e35}.edition{font-size:9px;letter-spacing:1.4px;color:var(--gold);border:1px solid #67513e;padding:5px 7px;margin-left:8px}.text-button{background:transparent;color:var(--muted);border:0;padding:9px 7px;font-size:13px}.text-button:hover{color:var(--ink)}.text-button span{display:inline-grid;place-items:center;width:20px;height:20px;border:1px solid var(--line);margin-left:8px}main{max-width:1312px;margin:auto;padding:0 44px}.lobby{display:grid;grid-template-columns:1.25fr 1fr;gap:9%;padding:64px 0 52px}.eyebrow{font:11px ui-monospace,monospace;letter-spacing:1.3px;color:var(--gold);display:inline-flex;align-items:center;gap:9px}.eyebrow i{width:7px;height:7px;background:var(--mint);box-shadow:0 0 12px #a8d5ac33}h1{font-size:clamp(36px,4.3vw,62px);line-height:1.13;letter-spacing:-2px;margin:25px 0 20px;font-weight:750}h1 em{font-style:normal;color:var(--gold)}.lead{font-size:16px;line-height:1.75;color:var(--muted);max-width:470px;margin:0 0 22px}.tags{display:flex;gap:10px;flex-wrap:wrap}.tags span{font:10px ui-monospace,monospace;color:#c8c0d1;padding:8px 10px;border:1px solid var(--line);background:#211d3066}.lobby-panel{align-self:start;margin-top:25px;padding:35px;background:var(--panel);border:1px solid #484052;box-shadow:7px 7px 0 #100e1b;position:relative}.lobby-panel:before{content:'';position:absolute;top:-1px;left:-1px;width:60px;height:3px;background:var(--gold)}.panel-kicker{font:10px ui-monospace,monospace;letter-spacing:2px;color:var(--gold)}h2{font-size:29px;letter-spacing:-.8px;margin:16px 0 10px}.lobby-panel p{color:var(--muted);font-size:14px;line-height:1.7;margin:0 0 28px}label{display:block;font:10px ui-monospace,monospace;color:#d6ccde;letter-spacing:1.3px;margin-bottom:10px}input{width:100%;border:1px solid #4a4059;background:#171423;color:var(--ink);border-radius:2px;height:49px;padding:0 14px;min-width:0}input::placeholder{color:#81768f;font-size:13px}.primary,.secondary{border:1px solid var(--gold);color:#221b24;background:var(--gold);padding:14px 17px;font-weight:700;font-size:14px;min-height:48px;border-radius:2px}.primary{display:flex;justify-content:space-between;align-items:center;width:100%;margin-top:17px;box-shadow:0 3px 0 #947046}.primary:hover{background:#ffe0a3}.secondary{background:#30283a;color:var(--gold);border-color:#6f5c4b;white-space:nowrap}.secondary:hover{background:#453346}.divider{display:flex;align-items:center;gap:12px;color:#8d809c;font-size:11px;margin:27px 0}.divider:before,.divider:after{content:'';flex:1;height:1px;background:var(--line)}.join-row{display:flex;gap:10px}.join-row input{text-transform:uppercase;letter-spacing:4px;font-family:ui-monospace,monospace}.lobby-panel .fine{font-size:11px;line-height:1.7;text-align:center;margin:23px 0 0;color:#8e819c}.lobby-panel .error{color:#ffb1a3;margin:14px 0 0;min-height:20px;font-size:12px}.building-scene{margin-top:26px;position:relative;height:184px;overflow:hidden;max-width:485px;background:linear-gradient(180deg,#32274100,#bd797e24);border-bottom:2px solid #667650}.building{position:absolute;bottom:7px;left:30%;width:208px;height:126px;background:#946b56;box-shadow:8px 0 #5b3e44;border-top:8px solid #bd9574}.roof{background:#d5bc8c;color:#423238;font:9px ui-monospace,monospace;letter-spacing:1px;position:absolute;top:-22px;left:27px;width:156px;height:15px;text-align:center;padding:2px}.windows{display:grid;grid-template-columns:repeat(6,1fr);gap:8px 9px;padding:12px}.windows i{width:21px;height:17px;background:#a6b7c1;box-shadow:inset 3px -3px #7d8fa2}.windows i:nth-child(8),.windows i:nth-child(19){background:#f5ca73;box-shadow:inset 3px -3px #bf944f}.door{position:absolute;bottom:0;left:92px;width:27px;height:22px;background:#322537;border-top:4px solid #c09b70}.sun{position:absolute;width:44px;height:44px;background:#e9a46a;right:9%;top:12px;box-shadow:0 0 45px #e9a46a22}.cloud{position:absolute;width:63px;height:10px;background:#aa8d9d44;box-shadow:14px -8px #aa8d9d44}.cloud-one{top:30px;left:7%}.cloud-two{top:51px;right:18%}.ground{position:absolute;bottom:0;width:100%;height:7px;background:#667650}.scene-label{position:absolute;bottom:15px;left:0;font:9px ui-monospace,monospace;color:#c2afa3;max-width:130px;line-height:1.7}.pixel-student{position:absolute;bottom:7px;right:15%;width:10px;height:14px;background:#81a3da;box-shadow:0 -9px #e6ba91,0 -13px #5f423c,-4px 1px #b3835b,0 7px #32304a}footer{max-width:1312px;margin:auto;padding:23px 44px 30px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;color:#8b8098;font-size:10px}footer b{padding:0 10px;color:var(--gold)}#play{padding:25px 0 36px}.session-bar,.session-bar>div{display:flex;align-items:center;justify-content:space-between;gap:18px}.session-bar{margin-bottom:18px}.small-button{color:var(--gold);border:1px solid #514354;background:var(--panel);padding:8px 10px;font-size:11px}.session-actions{font-size:10px;color:var(--mint)}.game-layout{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:24px}.game-column{min-width:0}.viewport{position:relative;border:1px solid #68543d;box-shadow:0 8px 28px #0004;background:#171423;line-height:0}canvas{width:100%;height:auto;image-rendering:pixelated;outline:0;display:block;touch-action:none}.viewport:fullscreen{display:flex;align-items:center;justify-content:center;background:#171423}.viewport:fullscreen canvas{width:min(100vw,calc(100vh * 640/432));max-height:100vh;object-fit:contain}.below-game{display:flex;justify-content:space-between;gap:12px;padding:14px 0;color:#c4b7c8;font:10px ui-monospace,monospace;line-height:1.6}#progress{color:var(--gold);white-space:nowrap}.roster{background:var(--panel);border:1px solid var(--line);padding:21px;align-self:start}.roster-heading{display:flex;align-items:center;justify-content:space-between}.roster h2{font-size:19px;margin:0}.roster-heading>span{font:11px ui-monospace,monospace;color:var(--gold)}.roster-subtitle{font-size:11px;color:var(--muted);line-height:1.6;margin:10px 0 20px}#players{list-style:none;margin:0;padding:0}#players li{display:grid;grid-template-columns:12px minmax(0,1fr) auto;align-items:center;gap:10px;padding:14px 0;border-top:1px solid var(--line);font-size:12px}#players .avatar{width:9px;height:12px;background:var(--player-color);box-shadow:0 -3px #e7bc96}#players .name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#players .score{color:var(--gold);font:11px ui-monospace,monospace}#players small{display:block;color:#8e819c;font-size:9px;padding-top:4px}.quest-tip{border-top:1px solid var(--line);margin-top:18px;padding-top:20px}.quest-tip>span{font:9px ui-monospace,monospace;color:var(--gold);letter-spacing:1px}.quest-tip p,.reconnect-note{font-size:11px;color:var(--muted);line-height:1.8}.reconnect-note{font-size:10px;color:#8e819c;margin:22px 0 0}.keyboard-hint{display:flex;justify-content:center;flex-wrap:wrap;gap:18px;color:#9f91ac;font-size:10px;padding:14px 0}kbd{font:10px ui-monospace,monospace;color:#cbbdd3}.touch-controls{display:flex;align-items:center;justify-content:space-between;border:1px solid var(--line);padding:12px 16px;background:var(--panel);gap:14px}.dpad{display:grid;grid-template-columns:repeat(3,42px);grid-template-rows:repeat(2,38px);gap:5px}.dpad button,.action-pad button{border:1px solid #5d4e67;background:#342b43;color:var(--ink);touch-action:none;user-select:none;-webkit-user-select:none;border-radius:3px}.dpad button:active,.dpad button.held,.action-pad button:active{background:#5a4260}.up{grid-column:2}.left{grid-row:2;grid-column:1}.down{grid-row:2;grid-column:2}.right{grid-row:2;grid-column:3}.action-pad{display:grid;grid-template-columns:1fr 1fr;gap:7px}.action-pad button{min-height:34px;font:9px ui-monospace,monospace;padding:6px 10px}.action-pad kbd{color:#ac9ab9;font-size:9px;margin-left:6px}.action-pad .interact{grid-column:span 2;background:var(--gold);color:#322331;border-color:var(--gold);min-height:42px;font-weight:bold}.action-pad .interact kbd{color:#69503a}.connection-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;background:#171423e8;line-height:1.6;text-align:center;padding:20px}.connection-overlay strong{font-size:20px}.connection-overlay>span:last-child{font-size:12px;color:var(--muted)}.spinner{width:25px;height:25px;border:3px solid var(--line);border-top-color:var(--gold);animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.dialog-controls{display:flex;gap:7px;flex-wrap:wrap;background:var(--panel);border:1px solid var(--line);padding:10px;margin-top:10px}.dialog-controls button{font-size:12px;padding:10px 12px}.password-form{display:flex;align-items:center;gap:10px;padding:14px;background:var(--panel);flex-wrap:wrap}.password-form label{margin:0}.password-form input{width:115px;font-family:monospace;letter-spacing:4px}.password-form button{font-size:12px;padding:9px}.site-toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);padding:14px 20px;background:var(--gold);color:#322331;font-size:13px;box-shadow:0 5px 22px #0005;z-index:10;max-width:90vw;text-align:center}dialog{color:var(--ink);background:var(--panel);border:1px solid #68536d;max-width:540px;max-height:85dvh;overflow:auto;padding:32px;box-shadow:0 15px 90px #0008}dialog::backdrop{background:#100c1cdb}dialog h2{font-size:25px}dialog ol{padding-left:20px}dialog li,dialog p{color:var(--muted);font-size:13px;line-height:1.8;margin:14px 0}dialog li strong{color:var(--ink)}.close{float:right;background:none;border:0;font-size:26px;color:var(--muted);margin:-15px -15px 0 0}body.in-game .topbar{height:65px}body.in-game footer{padding-top:18px}.game-column .touch-controls{display:none}@media(pointer:coarse){.game-column .touch-controls{display:flex}.keyboard-hint{display:none}}@media(min-width:1600px){.lobby{padding-top:85px}}@media(max-width:1000px){.lobby{gap:5%}.lobby-panel{padding:26px}.game-layout{grid-template-columns:minmax(0,1fr) 205px;gap:16px}.roster{padding:16px}.game-column .touch-controls{display:flex}}@media(max-width:760px){main{padding:0 20px}.topbar{padding:0 20px;height:72px}.edition{display:none}.brand{font-size:12px}.lobby{grid-template-columns:1fr;padding:35px 0;gap:10px}h1{font-size:44px;letter-spacing:-1.5px}.lead{font-size:14px;max-width:100%}.building-scene{height:151px;margin-top:25px;max-width:100%}.lobby-panel{margin-top:24px}.game-layout{grid-template-columns:1fr}.roster{padding:18px}.roster-subtitle{margin-bottom:10px}#players{display:flex;flex-wrap:wrap;gap:0 22px}#players li{min-width:145px;flex:1}.quest-tip,.reconnect-note{display:none}.session-bar,.session-bar>div{gap:8px}.session-bar{flex-wrap:wrap}.session-actions{margin-left:auto}#network{font-size:9px}.small-button{font-size:10px}#play{padding-top:17px}.below-game{font-size:9px}.touch-controls{padding:10px 14px}.game-column .touch-controls{display:flex}footer{padding:18px 20px;line-height:1.7}footer>span:last-child{display:none}.keyboard-hint{gap:10px;font-size:9px}.session-bar .eyebrow{font-size:10px}.session-bar .text-button{font-size:11px}dialog{padding:25px;max-width:calc(100vw - 30px)}}@media(prefers-reduced-motion:reduce){.spinner{animation:none}}

.dialog-transcript{flex:1 0 100%;font-size:13px;color:#e7d6ba;line-height:1.6;margin:0 0 5px}.dialog-controls .primary{margin-top:0;width:auto}
