:root{color-scheme:dark;--bg:#071221;--panel:#14283d;--panel2:#0e1d2e;--text:#f5f8fd;--muted:#aec2d2;--line:#36516a;--primary:#48e0ad;--warn:#ffdc97;--blue:#39b4ff}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text);font:15px/1.5 system-ui,-apple-system,Segoe UI,Arial,sans-serif}main{max-width:1020px;margin:auto;padding:15px}header{padding:8px 4px 17px;border-bottom:1px solid var(--line)}h1{margin:0;font-size:clamp(24px,4.5vw,37px);line-height:1.2;letter-spacing:-.7px}h1 span{color:var(--primary)}header .sub{font-size:13px;color:#a9c1d3;margin:7px 0 0}header .top{display:flex;align-items:center;gap:12px;justify-content:space-between}.version{border-radius:50px;border:1px solid var(--line);padding:5px 10px;font-size:12px;color:var(--muted)}.panel{background:var(--panel);border:1px solid #2b4a63;border-radius:16px;padding:20px;margin:16px 0}.panel>h2{font-size:21px;margin:0 0 12px}.notice{background:var(--panel2);padding:13px 15px;border-radius:11px;border:1px solid #3d5e78}.notice.good{border-color:#357764}.notice.warn{border-color:#866b35}.kicker{font-size:12px;font-weight:750;letter-spacing:.06em;color:var(--primary);text-transform:uppercase}.hint{color:var(--muted);font-size:13px;line-height:1.55}.hint a,a{color:#70d4ff}.warning{color:var(--warn)}strong{font-weight:750}.muted{color:var(--muted)}label.title{display:block;font-weight:700;margin:16px 0 6px}input[type=file],select{width:100%;padding:12px;border-radius:10px;border:1px solid #527089;background:#091927;color:white;font:inherit}select{cursor:pointer}input[type=checkbox]{width:17px;height:17px;accent-color:var(--primary)}.check{display:flex;align-items:flex-start;gap:10px;padding:6px 1px;cursor:pointer}.check input{margin:3px 0 0}.checks{margin-top:9px}.buttons{display:flex;flex-wrap:wrap;gap:9px;margin:17px 0 8px}button,.button{appearance:none;background:var(--primary);color:#071e1b;padding:12px 15px;border:1px solid transparent;border-radius:10px;font:700 14px system-ui,Arial;cursor:pointer;text-decoration:none;display:inline-flex;gap:8px;align-items:center;justify-content:center}button:hover,.button:hover{filter:brightness(1.08)}button.secondary,.button.secondary{background:#263f59;color:#f1f6ff;border-color:#5c7a92}button:disabled{opacity:.48;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--blue);outline-offset:3px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.rows{display:grid;grid-template-columns:minmax(150px,1fr) minmax(100px,1fr);gap:2px;margin:12px 0}.rows>div{padding:7px 5px;border-bottom:1px solid #37536a;font-size:13px}.rows>div:nth-child(even){text-align:right;font-weight:700}.pill{display:inline-block;border:1px solid #508875;border-radius:50px;padding:3px 9px;color:#83f4cd;background:#13392e;font-size:12px}.pill.warn{border-color:#806a39;color:#ffdf9a;background:#352d1b}.hidden{display:none!important}#status{min-height:24px}#stage{width:100%;aspect-ratio:4/3;background:#000;border:1px solid #2a455f;border-radius:10px;overflow:hidden;position:relative}#game{height:100%;width:100%;image-rendering:pixelated}#stage:fullscreen{height:100dvh;max-height:none;border:0;border-radius:0;aspect-ratio:auto}#stage:fullscreen #game{height:100%;width:100%}#exitFull{display:none;position:absolute;z-index:99999;top:8px;right:8px}#stage:fullscreen #exitFull{display:block}.footer{color:#99aec1;font-size:12px;margin:25px 0 12px}code{background:#0a1b2a;border-radius:4px;padding:2px 5px;color:#a9f5df}small{font-size:12px}@media(max-width:700px){main{padding:9px}.panel{padding:13px}.grid{grid-template-columns:1fr}.rows{grid-template-columns:minmax(130px,1fr) minmax(85px,1fr)}#stage{aspect-ratio:4/3}button,.button{min-height:43px}}@media(orientation:landscape) and (max-height:500px){main{max-width:100%}#stage{max-height:78dvh;aspect-ratio:auto;height:78dvh}}

.twoplayer{margin:19px 0 7px;padding:18px;border:1px solid #51718b;background:#102538;border-radius:13px}.twoplayer h3{margin:6px 0;font-size:18px}.diagnostic{background:#0a1b2a;border-radius:10px;padding:12px;margin:12px 0}.diag-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.diag-head button{padding:7px 12px;font-size:12px}.pad-row{padding:9px 0;border-bottom:1px solid #30465e;font-size:12px}.pad-row small{display:block;margin-top:2px}.key-legend{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:13px;background:#091a2a;border-radius:9px;font-size:13px}.key-legend strong{text-align:right;color:#65ecc2}.roadmap{border-color:#617287}.roadmap p{margin:8px 0}

/* v0.6 — responsive live community sidebar. Game never resized inside fullscreen. */
main{max-width:1580px}.site-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:17px;align-items:start}.site-main{min-width:0}.social-panel{position:sticky;top:12px;margin:16px 0;max-height:calc(100dvh - 24px);overflow:auto;padding:17px;background:#102033}.social-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.social-head h2{margin:4px 0 0;font-size:20px}.online-pill{border:1px solid #5b6a80;color:#bed0df;font-size:11px;padding:4px 8px;border-radius:16px;white-space:nowrap}.online-pill.connected{background:#103d2e;color:#73eab7;border-color:#317759}.social-controls{padding:12px 0;border-bottom:1px solid #334c62}.social-controls>label{font-size:13px;font-weight:650}.social-name-row,.chat-form{display:flex;gap:7px;margin-top:7px}.social-name-row input,.chat-form input{flex:1;min-width:0;border:1px solid #436177;background:#091927;color:white;border-radius:9px;padding:11px;font:inherit}.social-name-row button,.chat-form button{padding:10px 13px}.social-title{display:flex;align-items:center;justify-content:space-between}.social-title h3{font-size:15px;margin:0}.social-title>span{font-size:12px;color:#90d9bb}.users-box,.chat-box{padding:14px 0 0}.user-list{min-height:46px;max-height:150px;overflow:auto;padding:8px 0 3px}.user-item{display:flex;align-items:center;gap:9px;padding:6px 3px;font-size:13px;overflow-wrap:anywhere}.user-item:before{content:'';width:8px;height:8px;background:#4de4a2;border-radius:50%;flex:none}.user-item.me{color:#83f4cc}.chat-box{border-top:1px solid #334c62}.chat-messages{height:280px;max-height:35dvh;overflow-y:auto;background:#081827;border:1px solid #2c4b63;border-radius:12px;padding:9px;display:flex;flex-direction:column;gap:10px}.chat-entry{overflow-wrap:anywhere;font-size:13px;line-height:1.45}.chat-entry .who{display:flex;gap:5px;align-items:center;font-weight:700;color:#86d7ee}.chat-entry.self .who{color:#5ce6b1}.chat-entry .time{color:#8195a6;font-size:10px;font-weight:400;margin-left:auto}.chat-entry .body{margin-top:2px;white-space:pre-wrap}.chat-empty{margin:auto;text-align:center;color:#93a8bd;font-size:13px}.chat-note{font-size:11px;margin:7px 0}.social-disclaimer{padding-top:13px;border-top:1px solid #334c62}.chat-icon{font-size:10px!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}#lobbyStatus.error{color:#ffbca7}#lobbyStatus.ok{color:#8af1c4}#sendMessage:disabled,#joinLobby:disabled{opacity:.5}
@media(max-width:1070px){.site-grid{grid-template-columns:minmax(0,1fr)}.social-panel{position:static;max-height:none;margin:0 0 16px}.chat-messages{height:260px;max-height:none}.panel{margin:12px 0}}

/* v0.7 online match lobby / host stream & guest controls */
.room-box{padding:15px 0;border-top:1px solid #334c62}.room-actions{margin:10px 0;gap:6px}.room-actions button{padding:10px 11px;font-size:13px}.join-room{padding:8px 0 15px}.join-room label{font-size:13px}.room-active{margin:12px 0}.room-code-row{display:flex;align-items:center;gap:9px;margin:8px 0;flex-wrap:wrap}.room-code-row code{letter-spacing:.18em;font-size:20px}.room-code-row button{padding:8px 9px;font-size:11px}.open-rooms{max-height:185px;overflow:auto;display:grid;gap:7px;padding:7px 0}.room-item{border:1px solid #385d71;border-radius:10px;background:#0d2135;padding:9px;display:flex;align-items:center;justify-content:space-between;gap:8px}.room-item span{display:block;color:#a9bfce;font-size:11px}.room-item button{padding:7px 10px;font-size:12px}.room-item button:disabled{opacity:.45}.remote-video{position:relative;background:#000;border-radius:12px;overflow:hidden;aspect-ratio:4 / 3;display:grid;place-items:center}.remote-video video{width:100%;height:100%;object-fit:contain}.remoteOverlay{position:absolute;inset:0;display:grid;place-items:center;background:rgba(3,8,15,.75);text-align:center;padding:16px;pointer-events:none}.touchpad{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin:18px 0;user-select:none;touch-action:none}.touchpad button{background:#24445d;color:white;border:1px solid #6293aa;min-height:55px;min-width:55px;border-radius:15px;touch-action:none}.touchpad button:active,.touchpad button.pressed{background:#39b4ff;color:#051320}.touch-dpad{text-align:center}.touch-dpad>div{display:flex;gap:5px}.touch-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.touch-actions>div{grid-column:span 4;display:flex;justify-content:center;gap:7px}.touch-actions>div button{font-size:12px;min-height:42px}.remote-player{border-color:#3b9279}.remote-video:fullscreen{aspect-ratio:auto}.remote-video:fullscreen video{height:100%;width:100%}@media(max-width:520px){.touchpad{gap:10px}.touchpad button{min-height:46px;min-width:46px}.touch-actions{grid-template-columns:repeat(2,1fr)}.touch-actions>div{grid-column:span 2}.touch-actions button{min-width:48px}}

/* v0.8 — Google Drive access */
.drive-panel{padding:16px;margin:19px 0 8px;border-radius:14px;background:#0d2434;border:1px solid #347962}
.drive-panel h3{margin:4px 0;font-size:19px}
.drive-box{margin-top:14px}
.drive-panel input[type=url],.drive-panel input[type=text]{width:100%;padding:12px;border-radius:10px;border:1px solid #527089;background:#091927;color:white;font:inherit}
.drive-panel input:focus-visible{outline:2px solid #62dcbc}
.drive-advanced{margin:12px 0;padding:9px 12px;border:1px solid #3d5369;border-radius:10px;background:#102033}
.drive-advanced summary{cursor:pointer;font-weight:700}
.drive-progress{width:100%;height:15px;accent-color:#48e0ad;margin:10px 0}
.drive-status{min-height:25px;overflow-wrap:anywhere}
.drive-status[data-kind=good]{color:#8afac6}.drive-status[data-kind=error]{color:#ffb7ae}.drive-status[data-kind=warn]{color:#ffdc97}

/* v0.10 internationalization and persistent chat history */
.locale-panel{display:flex;justify-content:flex-end;align-items:center;gap:10px;margin-top:10px;color:#a9c1d3;font-size:12px}.locale-panel select{width:auto;min-width:135px;padding:8px 9px;font-size:12px}
.load-history{width:100%;font-size:12px;padding:8px 10px;margin:8px 0 9px}.load-history[hidden]{display:none}
@media(max-width:560px){.locale-panel{justify-content:flex-start}.locale-panel select{max-width:80vw}}

/* v0.11.2: remembered lobby identity / opt-out */
.social-controls .lobby-autojoin-check{display:flex;align-items:flex-start;gap:9px;margin:10px 0 0;font-size:12px;font-weight:500;color:#bfdae6;cursor:pointer}.lobby-autojoin-check input{flex:none;margin-top:2px}
