*{box-sizing:border-box}html,body{color:#fff;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;background:#a9d6f5;height:100%;margin:0;font-family:-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;overflow:hidden}#c{touch-action:none;width:100%;height:100%;display:block;position:fixed;inset:0}.hidden{display:none!important}button{font:inherit;cursor:pointer}#hud-top{padding:calc(10px + env(safe-area-inset-top)) 12px 0;pointer-events:none;justify-content:space-between;align-items:flex-start;display:flex;position:fixed;top:0;left:0;right:0}#title{text-shadow:0 1px 3px #00000080;font-size:18px;font-weight:700;line-height:1.15}#title span{opacity:.9;font-size:12px;font-weight:500;display:block}#buttons{pointer-events:auto;gap:8px;display:flex}#buttons button{color:#fff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#141e2873;border:0;border-radius:12px;width:40px;height:40px;font-size:18px}#buttons button.off{opacity:.5}#chips{top:calc(58px + env(safe-area-inset-top));flex-wrap:wrap;gap:6px;max-width:calc(100% - 24px);display:flex;position:fixed;left:12px}.chip{color:#fff;background:#141e2873;border:0;border-radius:999px;padding:5px 11px;font-size:13px}#where{pointer-events:none}#where:empty{display:none}#room-chip .dot{background:#5ad17a;border-radius:50%;width:8px;height:8px;margin-right:6px;display:inline-block}#room-chip.off .dot{background:#e0a030}#toast{top:calc(96px + env(safe-area-inset-top));text-align:center;background:#141e28d9;border-radius:12px;max-width:calc(100% - 32px);padding:8px 16px;font-size:14px;position:fixed;left:50%;transform:translate(-50%)}#chat-log{left:12px;bottom:calc(76px + env(safe-area-inset-bottom));pointer-events:none;flex-direction:column;gap:4px;width:min(380px,100% - 90px);display:flex;position:fixed}body.touch #chat-log{bottom:calc(176px + env(safe-area-inset-bottom))}#chat-log .msg{pointer-events:auto;cursor:pointer;text-shadow:0 1px 2px #0006;word-wrap:break-word;background:#0f161e8c;border-radius:10px;padding:5px 10px;font-size:14px;line-height:1.35;transition:opacity 1s}#chat-log .msg b{color:#ffe39a;font-weight:700}#chat-log .msg small{opacity:.7}#chat-log .msg.sys{background:#b0342699}#chat-log .msg.fade{opacity:0}#chat-log.open .msg.fade{opacity:1}#chat-form{left:12px;right:12px;bottom:calc(14px + env(safe-area-inset-bottom));gap:8px;max-width:560px;display:flex;position:fixed}#chat-form input{color:#1d2530;background:#fffffff2;border:0;border-radius:12px;flex:1;padding:11px 14px;font-size:16px}#chat-form button{color:#fff;background:#b03426;border:0;border-radius:12px;padding:0 18px;font-weight:700}#btn-chat{right:calc(16px + env(safe-area-inset-right));bottom:calc(30px + env(safe-area-inset-bottom));background:#141e2880;border:0;border-radius:50%;width:54px;height:54px;font-size:24px;position:fixed}.panel{z-index:5;background:#182028f2;border-radius:16px;width:min(400px,100% - 32px);max-height:calc(100% - 32px);padding:18px 20px;font-size:14px;line-height:1.5;position:fixed;top:50%;left:50%;overflow:auto;transform:translate(-50%,-50%)}.panel h3{margin:0 0 6px;font-size:19px}.panel .muted{opacity:.75;margin:0 0 12px;font-size:13px}.panel .small{margin-top:12px;font-size:12px}.panel a{color:#ffcf8a}.panel button,.panel .btn{color:#fff;text-align:center;background:#ffffff1f;border:0;border-radius:10px;width:100%;margin-top:8px;padding:11px 14px;font-size:15px;font-weight:600;text-decoration:none;display:block}.panel .primary{background:#b03426}.panel .ghost{opacity:.8;background:0 0}.panel .google{color:#222;background:#fff}.panel .apple{color:#fff;background:#000;border:1px solid #555}.panel label{opacity:.9;margin-bottom:10px;font-size:13px;display:block}.panel input,.panel select{color:#1d2530;background:#fffffff2;border:0;border-radius:10px;width:100%;margin-top:4px;padding:10px 12px;font-size:16px;display:block}.panel .row{gap:10px;display:flex}.panel .row label{flex:1}.panel .seg{flex-wrap:wrap;gap:6px;margin:4px 0 10px;display:flex}.panel .seg button{flex:1;min-width:70px;margin:0;padding:9px 6px;font-size:14px}.panel .seg button.on{background:#b03426}.panel .err{color:#ff9b8f;min-height:1em;margin:4px 0;font-size:13px}#dev-login{gap:6px;margin-top:8px;display:flex}#dev-login.hidden{display:none}#dev-login button{width:auto;margin:0}#room-list .room{cursor:pointer;background:#ffffff14;border-radius:10px;justify-content:space-between;align-items:center;margin-bottom:6px;padding:9px 12px;display:flex}#room-list .room.here{outline:2px solid #b03426}.board-note{opacity:.7;text-align:center;margin:0;font-size:12px}#intro .link{color:#fff;box-shadow:none;opacity:.9;background:0 0;border:0;padding:6px;font-size:15px;text-decoration:underline}#prompt{left:50%;bottom:calc(110px + env(safe-area-inset-bottom));color:#fff;white-space:nowrap;background:#b03426e0;border:2px solid #ffffffd9;border-radius:999px;padding:12px 22px;font-size:16px;font-weight:700;position:fixed;transform:translate(-50%);box-shadow:0 4px 14px #0000004d}#prompt kbd{background:#ffffff40;border-radius:4px;margin-right:8px;padding:0 6px;font-family:inherit;font-size:13px;display:inline-block}#joy{left:calc(24px + env(safe-area-inset-left));bottom:calc(28px + env(safe-area-inset-bottom));touch-action:none;background:#ffffff2e;border:2px solid #fff6;border-radius:50%;width:130px;height:130px;position:fixed}#knob{background:#ffffffbf;border-radius:50%;width:56px;height:56px;margin:-28px 0 0 -28px;position:absolute;top:50%;left:50%}#board-modal{z-index:6;background:#0a0e0cd1;flex-direction:column;justify-content:center;align-items:center;gap:14px;padding:16px;display:flex;position:fixed;inset:0}#board-wrap{border:12px solid #6b4423;border-radius:6px;line-height:0;box-shadow:0 10px 40px #0009}#board-wrap canvas{touch-action:none;cursor:crosshair;width:min(100vw - 56px,257.3vh - 437.41px);height:auto;display:block}#board-tools{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}#board-tools button{color:#fff;background:#ffffff26;border:0;border-radius:10px;padding:9px 14px;font-weight:600}#board-tools .chalk:before{content:"";background:var(--c);vertical-align:-1px;border-radius:50%;width:12px;height:12px;margin-right:6px;display:inline-block}#board-tools .chalk.active{outline:2px solid #fff}#board-tools .primary{background:#b03426}#intro{z-index:4;background:linear-gradient(#14283c59,#141e28bf);justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}#intro .card{text-align:center;max-width:440px}#intro h1{letter-spacing:.5px;text-shadow:0 2px 12px #0006;margin:0;font-size:44px}#intro .school{margin:6px 0 2px;font-size:18px;font-weight:600}#intro .sub{opacity:.75;margin:0 0 22px;font-size:13px}#intro button{color:#fff;background:#b03426;border:0;border-radius:999px;padding:14px 36px;font-size:18px;font-weight:700;box-shadow:0 6px 20px #00000059}#intro .hint{opacity:.85;margin-top:22px;font-size:13px;line-height:1.6}