@font-face{font-family:LocalSans;src:local("Segoe UI");font-display:swap}
.screen{width:100%}
.intro-stamp #play-mode{font-size:9px;font-weight:400;letter-spacing:1.5px;color:var(--muted)}
.room-panel{border-color:#53664d!important}.room-main-button{width:100%;padding:12px}.room-ident{display:flex;flex-wrap:wrap;gap:6px;justify-content:space-between;font-size:10px;color:var(--mint)}.room-ident code{font-size:9px;color:var(--muted)}.room-peer{font-size:12px;color:var(--mint);margin:13px 0}.room-panel label{font-size:10px;color:var(--muted)}.invite-row{display:flex;gap:6px;margin-top:6px}.invite-row input{min-width:0;width:100%;border:1px solid var(--line);border-radius:6px;padding:8px;background:#0f1915;color:#b8c6bc;font-size:10px}.invite-row button{padding:8px 11px}.room-game{font-size:11px;line-height:1.5;margin:14px 0 6px}.room-file-hint{font-size:10px;line-height:1.6;color:var(--orange);padding:10px;background:#ffb06d0c;border-radius:6px}.room-state{font-size:11px;line-height:1.6;color:#c0cfc1;min-height:32px}.room-actions{display:flex;gap:7px}.room-actions button{flex:1;font-size:11px;padding:10px 8px}.room-leave{width:100%;background:transparent;border:0;color:var(--muted);font-size:10px;margin-top:8px;padding:8px}.room-leave:hover{color:#ffb0a0}.room-panel .fine-print{font-size:9px}
.exit-fullscreen{display:none;position:absolute;top:14px;right:14px;background:#101516df;z-index:3}.screen:fullscreen .exit-fullscreen{display:block}
:root{color-scheme:dark;--bg:#101516;--panel:#192022;--line:#303a3c;--text:#e9ece4;--muted:#92a09d;--orange:#ffb06d;--mint:#a7d1b9;--radius:14px;font-family:LocalSans,system-ui,sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}button,select,input{font:inherit}button,a,label{ -webkit-tap-highlight-color:transparent}button{cursor:pointer;border:1px solid var(--line);border-radius:8px;color:var(--text);background:#222b2d;padding:10px 13px;font-size:13px;transition:background .15s,border-color .15s}button:hover:not(:disabled){background:#344043;border-color:#64736e}button:disabled{opacity:.38;cursor:not-allowed}button:focus-visible,a:focus-visible,label:focus-within,select:focus-visible{outline:2px solid var(--orange);outline-offset:4px}a{color:inherit;text-decoration:none}[hidden]{display:none!important}
.topbar{height:88px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 4.5%;gap:24px}.brand{display:flex;align-items:center;gap:12px;font-weight:800;font-size:23px;letter-spacing:-1px}.brand-light{font-weight:350;margin-left:5px}.brand-icon{width:37px;height:33px;display:flex;align-items:center;background:var(--orange);color:#192022;border-radius:5px;font-size:24px;padding-left:4px;font-weight:900}.brand-icon span{font-size:17px;margin-top:-7px}.header-note{font-size:10px;letter-spacing:2px;color:var(--muted)}.pill{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:30px;padding:8px 12px;color:#b9c6bf;font-size:11px;white-space:nowrap}.pill i,.status-dot{background:var(--mint);width:6px;height:6px;border-radius:100%;display:inline-block}.status-dot{margin-right:8px}.status-dot.running{box-shadow:0 0 9px #a7d1b988}.status-dot.paused{background:var(--orange)}
main{max-width:1530px;margin:auto;padding:0 4.5%}.intro{display:flex;justify-content:space-between;align-items:center;padding:39px 0 30px}.eyebrow{font-size:10px;letter-spacing:2.3px;color:var(--orange);font-weight:650}h1{font-size:clamp(30px,3vw,43px);font-weight:600;letter-spacing:-1.7px;margin:8px 0 9px}.intro p{color:var(--muted);font-size:14px;margin:0}.intro-stamp{font-size:9px;letter-spacing:1.5px;color:var(--muted);display:flex;gap:14px;align-items:center}.intro-stamp span{font-size:40px;font-weight:300;letter-spacing:-3px;color:#b8c6bd}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 302px;gap:24px;align-items:start}.play-column{min-width:0}.screen-top{display:flex;justify-content:space-between;align-items:center;background:#1c2527;border:1px solid var(--line);border-bottom:none;padding:13px 17px;border-radius:12px 12px 0 0;font-size:11px;color:#c0cdc6;gap:12px}.screen-top>span:last-child{font-size:9px;letter-spacing:1.4px;color:var(--muted);white-space:nowrap}.screen{position:relative;background:#080c0d;border:1px solid var(--line);aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;overflow:hidden;max-height:64vh;min-height:300px}.screen canvas{display:block;width:100%;height:100%;object-fit:contain;image-rendering:pixelated;outline:none}.screen canvas:focus-visible{outline:2px solid var(--orange);outline-offset:-3px}.screen:fullscreen{max-height:none;width:100vw;height:100vh;border:0}.screen-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(ellipse at 50% 40%,#1c2b29 0,transparent 65%),repeating-linear-gradient(0deg,#ffffff03 0,#ffffff03 1px,transparent 1px,transparent 4px)}.screen-empty h2{font-size:20px;font-weight:500;margin:25px 0 8px}.screen-empty p{text-align:center;color:var(--muted);font-size:12px;line-height:1.7;margin:0}.cartridge-art{width:130px;height:148px;transform:rotate(-8deg);background:#333f3d;border:3px solid #52605a;border-radius:10px 10px 4px 4px;box-shadow:9px 14px 0 #0004;position:relative;padding:13px 13px 22px}.cart-label{height:100%;background:#bdc9ac;color:#26332f;border-radius:3px;padding:7px;overflow:hidden}.cart-label>span{font-size:7px;letter-spacing:1px;font-weight:800}.cart-label strong{display:flex;gap:3px;font-size:48px;line-height:1.1;align-items:center;letter-spacing:-5px}.cart-label strong span{font-size:10px;writing-mode:vertical-rl;letter-spacing:1px}.cart-lines{height:25px;margin-top:5px;background:repeating-linear-gradient(-45deg,#4c6957 0,#4c6957 5px,transparent 5px,transparent 9px)}.cart-bottom{position:absolute;bottom:5px;left:26px;right:26px;height:8px;background:repeating-linear-gradient(90deg,#a5aa7c 0,#a5aa7c 4px,#37403b 4px,#37403b 7px)}.pause-overlay{position:absolute;inset:0;background:#081011dc;backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:18px}.pause-overlay>span{font-size:40px;color:var(--orange)}.pause-overlay strong{font-size:25px;font-weight:500}.primary{background:var(--orange);color:#202927;border-color:var(--orange);font-weight:650}.primary:hover:not(:disabled){background:#ffc69a;color:#202927;border-color:#ffc69a}.console-controls{display:flex;justify-content:space-between;gap:8px;padding:13px;background:#1c2527;border:1px solid var(--line);border-top:0;border-radius:0 0 12px 12px}.transport,.display-controls{display:flex;align-items:center;gap:6px}.console-controls button{font-size:11px;background:transparent;border-color:transparent;padding:9px}.console-controls .icon-button{font-size:20px;line-height:20px;min-width:35px}.divider{height:20px;border-left:1px solid var(--line);margin:0 6px}.notice{font-size:11px;line-height:1.6;color:var(--muted);padding:12px 3px;min-height:42px}.notice.error{color:#ffb0a0}.players{display:grid;grid-template-columns:1fr 1fr;gap:14px}.player-card{border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:16px}.player-title{display:flex;align-items:center;gap:10px}.player-number{width:32px;height:32px;display:grid;place-items:center;background:#ffb06d16;color:var(--orange);border-radius:7px;font-size:12px}.player-number.second{background:#a7d1b917;color:var(--mint)}h3{font-weight:600;font-size:12px;margin:0 0 3px}.device-state{font-size:10px;color:var(--muted)}.text-button{margin-left:auto;border:none;background:transparent;padding:5px 0;color:#c4cec6;font-size:10px}.keys-row{display:flex;flex-wrap:wrap;gap:8px;margin:17px 0 13px;color:var(--muted);font-size:9px;line-height:23px}.keys-row>span{white-space:nowrap}kbd{display:inline-flex;justify-content:center;align-items:center;border:1px solid #46504d;min-width:19px;height:19px;border-radius:4px;color:#d3d9d0;font-family:inherit;font-size:9px;padding:0 4px;margin:0 1px}.input-lights{display:flex;gap:5px}.input-lights span{font-size:8px;min-width:17px;height:17px;display:grid;place-items:center;color:#75857f;background:#26302d;border-radius:3px}.input-lights span.on{background:var(--orange);color:#121817}.player-card:nth-child(2) .input-lights span.on{background:var(--mint)}
aside>section{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:19px;margin-bottom:17px}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:8px}.section-heading h2{font-size:14px;font-weight:600;margin:0}.section-heading>span{color:var(--muted);font-size:10px}.section-description{font-size:11px;color:var(--muted);margin:7px 0 20px}.game-list{display:flex;flex-direction:column;gap:9px}.game-card{text-align:left;display:flex;align-items:center;gap:11px;padding:10px;width:100%;border:1px solid #36413c;border-radius:8px;background:#202a28}.game-card.selected{border-color:var(--orange);background:#ffb06d0b}.game-cover{width:44px;height:58px;flex-shrink:0;display:flex;flex-direction:column;align-items:center;justify-content:center;border:2px solid #496454;border-radius:3px;color:#deead3;background:repeating-linear-gradient(135deg,#253d2c 0,#253d2c 7px,#2f4937 7px,#2f4937 14px);font-size:10px;line-height:1.1;text-align:center;font-weight:800;letter-spacing:-.5px}.game-cover.mk{background:radial-gradient(circle,#ba8c42,#5e3120);border-color:#8a6744;color:#ffe5b2}.game-cover small{font-size:6px;letter-spacing:1px;margin-top:7px}.game-details{min-width:0}.game-details strong{display:block;font-size:12px;line-height:1.4;font-weight:550}.game-details small{font-size:9px;color:var(--muted);display:block;margin-top:4px}.game-play{margin-left:auto;color:var(--orange);font-size:12px}.file-button{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:7px;padding:13px 7px;border:1px dashed #4b5951;border-radius:8px;margin-top:14px;font-size:11px;cursor:pointer;color:#c1cec3}.file-button:hover{background:#29342e}.file-button>span{font-size:17px}.file-button small{width:100%;text-align:center;font-size:9px;color:var(--muted)}.section-heading .small-tag{font-size:8px;border:1px solid #3f5044;border-radius:4px;padding:4px;color:var(--mint);letter-spacing:.8px}dl{margin:20px 0}dl>div{display:flex;justify-content:space-between;margin-bottom:12px;font-size:11px}dt{color:var(--muted)}dd{margin:0;color:#d0d8ce;font-variant-numeric:tabular-nums}.diagnose-button{width:100%;display:flex;align-items:center;justify-content:space-between;background:#24322a;border-color:#3b5141;font-size:11px;color:var(--mint)}.fine-print{font-size:10px;line-height:1.65;color:var(--muted);margin:11px 0 0}.fine-print.passed{color:var(--mint)}.fine-print.failed{color:#ffb0a0}.roadmap{padding:6px 14px}.roadmap-marker{font-size:8px;letter-spacing:1.6px;color:var(--orange)}.roadmap p{font-size:14px;margin:8px 0}.roadmap>span:last-child{font-size:11px;line-height:1.7;color:var(--muted)}footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:14px;margin-top:35px;padding:21px 0 25px;color:var(--muted);font-size:8px;letter-spacing:.6px}.footer-dot{margin:0 8px;color:#5b7262}footer a:hover{color:var(--orange)}
dialog{width:min(560px,92vw);border:1px solid #506052;border-radius:16px;background:#192220;color:var(--text);padding:27px;max-height:88vh}dialog::backdrop{background:#000a;backdrop-filter:blur(4px)}.dialog-heading{display:flex;justify-content:space-between;align-items:center}.dialog-heading h2{font-weight:500;margin:5px 0;font-size:25px}.close-button{font-size:22px;border:0;background:transparent;padding:5px 10px}dialog>p{font-size:12px;color:var(--muted)}.device-label{display:block;font-size:11px;color:var(--muted);margin-top:20px}select{display:block;background:#28352c;color:var(--text);border:1px solid #4b6050;border-radius:7px;padding:10px;width:100%;margin-top:6px;font-size:12px}.mapping-header,.mapping-row{display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:10px;align-items:center}.mapping-header{color:var(--muted);font-size:10px;margin-top:22px;margin-bottom:8px}.mapping-row{border-top:1px solid #2d3c32;padding:6px 0;font-size:12px}.mapping-row button{padding:6px 8px;min-height:30px;font-size:11px}.mapping-row button.listening{border-color:var(--orange);color:var(--orange)}.dialog-footer{display:flex;justify-content:space-between;margin-top:22px;gap:14px}.about-page{max-width:800px;line-height:1.7;padding-top:40px}.about-page p,.about-page li{color:#bbc8bd;font-size:14px}.about-page a{color:var(--orange);text-decoration:underline}
@media(min-width:1600px){.screen{max-height:650px}}@media(max-width:1100px){.workspace{grid-template-columns:minmax(0,1fr) 270px;gap:17px}.player-card{padding:12px}.text-button{font-size:9px}.header-note{display:none}.screen{min-height:260px}}@media(max-width:820px){.workspace{grid-template-columns:1fr}.screen{max-height:none;min-height:0}aside{display:grid;grid-template-columns:1fr 1fr;gap:15px}aside>section{margin:0}.roadmap{grid-column:1/-1}.intro-stamp{display:none}.topbar{height:72px}.intro{padding-top:27px}footer{flex-direction:column;line-height:1.7}}@media(max-width:520px){main{padding:0 4%}.pill{font-size:9px;padding:7px 9px}.brand{font-size:19px}.players,aside{grid-template-columns:1fr}.console-controls{padding:8px}.console-controls button{font-size:9px;padding:8px 5px}.divider{margin:0 3px}.screen-empty h2{font-size:16px;margin-top:13px}.screen-empty p{font-size:10px}.cartridge-art{width:93px;height:109px;padding:8px 8px 18px}.cart-label strong{font-size:33px}.cart-label>span{font-size:5px}.cart-label strong span{font-size:8px}.cart-lines{height:19px}.screen-top{padding:11px}.intro p{font-size:12px}.screen-empty .cartridge-art{margin-top:10px}}
