:root{color-scheme:dark;--bg:#101923;--panel:#17232f;--line:#2e4050;--text:#eff4f8;--muted:#a6b8c8;--green:#8be4b0;font-family:Inter,"Segoe UI",sans-serif;font-size:14px}
body.classroom-setup #entry{max-width:680px;grid-template-columns:1fr;margin:16px auto;flex:1;align-content:start}body.classroom-setup #entry>section:first-child{display:none}body.classroom-setup #entry>.panel{padding:24px;gap:18px}body.classroom-setup #entry h2{font-size:26px}body.classroom-setup #entry p{line-height:1.6}body.classroom-setup #hostForm{gap:12px}body.classroom-setup #message{max-width:680px;width:100%;margin:4px auto}
*{box-sizing:border-box}body{margin:0;height:100dvh;padding:12px;display:flex;flex-direction:column;gap:10px;background:var(--bg);color:var(--text);overflow:hidden}h1,h2,p{margin:0}h1{font-size:20px}h1 small{font-size:12px;color:var(--muted);display:block}h2{font-size:17px}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button,a{cursor:pointer}button,input,select{border:1px solid var(--line);border-radius:6px;background:#1c2a38;color:var(--text);padding:8px 12px;min-height:36px}button:disabled{opacity:.45;cursor:not-allowed}input,select{width:100%;min-width:0}.primary{background:var(--green);color:#10251a;font-weight:700}a{color:var(--green)}:focus-visible{outline:2px solid #f5ca81;outline-offset:2px}[hidden]{display:none!important}.topbar,.brand,.actions,.room-bar,.room-bar>div{display:flex;align-items:center;gap:12px}.topbar,.room-bar{justify-content:space-between}.brand{min-width:0}.panel{padding:16px;background:var(--panel);border:1px solid var(--line);border-radius:10px;min-width:0;min-height:0}.muted{color:var(--muted);font-size:12px}#message{font-size:13px;min-height:18px;color:#f5ca81;flex-shrink:0}#entry{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:880px;width:100%;margin:auto;overflow:auto}#entry section{display:flex;flex-direction:column;gap:12px}form{display:grid;gap:8px}#room{flex:1;min-height:0;display:flex;flex-direction:column;gap:8px}.room-bar{padding:10px 16px}.room-bar>div{flex-wrap:wrap;gap:4px 12px}#code{letter-spacing:.12em;font-size:23px;color:var(--green)}#phase{font-size:12px}#clock{font-size:26px;font-variant-numeric:tabular-nums}#hostControls{display:flex;flex-wrap:wrap;gap:8px}.news{display:flex;align-items:center;gap:10px;min-height:40px}.news p{font-size:12px}.room-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;flex:1;min-height:0}.room-grid>.panel{display:flex;flex-direction:column;gap:10px}.scroll{overflow:auto;min-height:0;flex:1;overscroll-behavior:contain}.stock-row,.leader-row,.position-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 8px;border-bottom:1px solid var(--line);width:100%;text-align:left}.stock-row{border-radius:0;background:none}.stock-row[aria-pressed=true]{background:#294458}.stock-row small{display:block;color:var(--muted)}.leader-row.mine{background:#294458}.leader-row small{display:block;color:var(--muted)}.leader-row button{font-size:11px;padding:4px 6px;min-height:28px}#chart{width:100%;height:100px;flex-shrink:1;min-height:40px}#price{font-size:24px}#balance,#position,#tradeStatus{font-size:12px}#tradeForm .actions button{flex:1}#positions{font-size:12px}.tabs{display:none}dialog{padding:0;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--text);width:min(520px,calc(100% - 24px));max-height:90dvh}dialog::backdrop{background:#060e19dd}.dialog-content{padding:24px;display:grid;gap:16px}.dialog-content p{line-height:1.5}.actions{flex-wrap:wrap}
@media(max-width:850px){body{padding:8px;gap:8px}.tabs{display:flex;gap:6px}.tabs button{flex:1;padding:6px}.tabs button[aria-pressed=true]{background:#294458}.room-grid{display:block}.room-grid>[data-panel]{display:none;height:100%}.room-grid[data-view=market]>[data-panel=market],.room-grid[data-view=trade]>[data-panel=trade],.room-grid[data-view=leaderboard]>[data-panel=leaderboard]{display:flex}.room-bar{gap:8px;padding:8px}.room-bar>div{gap:2px 8px}#code{font-size:19px}#roomMenu{font-size:11px;padding:6px}#clock{font-size:23px}#roomNote{font-size:11px}#hostControls button{font-size:11px;min-height:30px;padding:5px 8px}#entry{grid-template-columns:1fr}input,select{font-size:16px}#chart{height:64px}.room-grid>.panel{padding:12px;gap:8px}}
@media(max-height:600px){body{gap:5px}.topbar h1{font-size:16px}.topbar h1 small{display:none}#room{gap:5px}#roomNote{display:none}.news{min-height:28px}.news p{font-size:11px}.room-bar{padding:5px 8px}.panel{padding:10px}#chart{height:40px;min-height:20px}.ticket{overflow:auto}.room-grid>.panel{gap:5px}}
#roomTour { inset:0; margin:0; width:100vw; max-width:none; height:100dvh; max-height:none; border:0; background:transparent; overflow:hidden; }
#roomTour::backdrop { background:#060e19b8; }
#roomTourHighlight { position:fixed; border:2px solid #8be4b0; border-radius:8px; pointer-events:none; }
#roomTourCard { position:fixed; width:min(420px,calc(100vw - 24px)); max-height:calc(100dvh - 24px); overflow:auto; border:1px solid var(--line); border-radius:12px; padding:20px; background:var(--panel); display:grid; gap:14px; }
#roomTourCard p { line-height:1.5; margin-top:8px; }
#roomTourCard .actions { justify-content:space-between; }
@media(max-width:450px) { .topbar .actions { gap:6px; } .topbar button,.topbar a { font-size:11px; } .topbar h1 { font-size:16px; } }
.topbar { flex-wrap:wrap; }
.topbar .actions { flex-wrap:wrap; }
@media(max-width:600px) { .topbar .actions { gap:8px; } .room-bar { flex-wrap:wrap; } #copyInvite { font-size:11px; padding:6px; } }
/* Keep consent checkboxes compact beside their explanatory label. */
input[type="checkbox"] { width: 1.1rem; height: 1.1rem; min-height: 0; margin: 0 0.5rem 0 0; vertical-align: middle; }