:root{color-scheme:light dark;--bg: light-dark(#f4f5f7, #15171a);--surface: light-dark(#ffffff, #1e2126);--text: light-dark(#1b1f24, #e6e8eb);--muted: light-dark(#5b6470, #9aa3ad);--border: light-dark(#d9dde2, #33383f);--accent: light-dark(#1f5fbf, #6ea5f7);--danger: light-dark(#b3261e, #f2857d);--ok: light-dark(#1a7f43, #5fcf8a);--warn: light-dark(#8a5a00, #e6b450);--topbar-height: 3rem;--banner-height: 2.25rem;--role-student: #15803d;--role-teacher: #1d4ed8;--role-admin: #b91c1c}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.5 system-ui,sans-serif}.topbar{display:flex;align-items:center;gap:1rem;height:var(--topbar-height);padding:0 1rem;background:var(--surface);border-bottom:1px solid var(--border)}.brand{font-weight:600;margin-right:auto}.who{color:var(--muted)}main{padding:1.5rem 1rem}.card{max-width:64rem;margin:0 auto 1.5rem;padding:1.5rem;background:var(--surface);border:1px solid var(--border);border-radius:.5rem;overflow-x:auto}.card.narrow{max-width:26rem}h1{margin:0 0 1rem;font-size:1.25rem}form{display:grid;gap:1rem}form.inline{grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));align-items:end}label{display:grid;gap:.25rem;font-size:.9rem;color:var(--muted)}input:not([type=file]){padding:.5rem .625rem;font:inherit;color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:.375rem}button,.button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.5rem 1rem;font:inherit;font-weight:600;text-decoration:none;white-space:nowrap;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:.375rem;cursor:pointer}button:hover:not(:disabled),.button:hover{border-color:var(--muted)}app-icon{display:inline-flex}app-icon svg{width:1.25em;height:1.25em;fill:none;stroke:currentColor;stroke-width:2.25;stroke-linecap:round;stroke-linejoin:round}app-icon svg[data-tone=go]{color:var(--ok)}app-icon svg[data-tone=stop]{color:var(--danger)}app-icon svg[data-tone=info]{color:var(--accent)}app-icon svg[data-tone=warn]{color:var(--warn)}.role-banner{display:flex;align-items:center;gap:.5rem;height:var(--banner-height);padding:0 1rem;font-weight:600;color:#fff}.role-banner[data-role=STUDENT]{background:var(--role-student)}.role-banner[data-role=TEACHER]{background:var(--role-teacher)}.role-banner[data-role=ADMIN]{background:var(--role-admin)}button:disabled{opacity:.5;cursor:default}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.actions{display:flex;flex-wrap:wrap;gap:.5rem}.error{margin:0;color:var(--danger)}.warning{color:var(--warn)}.separator{margin:1.5rem 0 .5rem;color:var(--muted);font-size:.9rem}.state{font-weight:600;color:var(--muted)}.state[data-state=RUNNING]{color:var(--ok)}.state[data-state=ERROR]{color:var(--danger)}.state[data-state=STARTING],.state[data-state=STOPPING],.state[data-state=QUEUED],.state[data-state=RESETTING],.state[data-state=PROVISIONING]{color:var(--warn)}p.state{font-size:1.5rem;margin:0 0 1rem}table{width:100%;border-collapse:collapse;margin-top:1rem}th,td{padding:.5rem;text-align:left;vertical-align:top;border-bottom:1px solid var(--border)}th{font-size:.85rem;color:var(--muted)}.toast{display:flex;align-items:center;gap:1rem;position:fixed;right:1rem;bottom:1rem;max-width:30rem;margin:0;padding:.75rem 1rem;background:var(--surface);border:1px solid var(--border);border-radius:.5rem;box-shadow:0 4px 16px #0003}.desktop-shell{position:fixed;inset:calc(var(--topbar-height) + var(--banner-height)) 0 0 0;display:flex;flex-direction:column;background:#000}.desktop-bar{display:flex;align-items:center;justify-content:space-between;padding:.25rem 1rem;background:var(--surface);border-bottom:1px solid var(--border)}app-desktop{flex:1;min-height:0;display:block}.hint{color:var(--muted);font-size:.9rem}.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));gap:1rem;margin:0 0 1rem}.stats div{padding:.75rem;border:1px solid var(--border);border-radius:.5rem}.stats dt{color:var(--muted);font-size:.85rem}.stats dd{margin:.25rem 0 0;font-size:1.4rem;font-weight:600}.mosaic{display:grid;grid-template-columns:repeat(auto-fill,minmax(17rem,1fr));gap:1rem;margin-top:1rem}.tile{display:grid;gap:.5rem;padding:.75rem;border:1px solid var(--border);border-radius:.5rem}.tile header{display:flex;justify-content:space-between;gap:.5rem}.tile-screen{display:grid;place-items:center;aspect-ratio:16 / 10;overflow:hidden;color:#9aa3ad;background:#000;border-radius:.25rem}.tile-screen app-desktop{width:100%;height:100%}.tile-screen .desktop-screen{cursor:default}.watch-notice{display:inline-flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin:0 0 1rem;padding:.25rem .75rem;font-weight:600;color:#1b1f24;background:#ffd866;border-radius:.375rem}.desktop-bar .watch-notice{margin:0}.watch-notice app-icon svg{color:#1b1f24}.role-banner nav{display:flex;gap:1rem;margin-left:auto}.role-banner a{display:inline-flex;align-items:center;gap:.375rem;color:#fff}.role-banner a app-icon svg{color:#fff}label.check{display:inline-flex;align-items:center;gap:.375rem;color:var(--text)}.desktop-screen{width:100%;height:100%;overflow:hidden;outline:none;cursor:none}