:root{color-scheme:light dark;--fg: #d8dee9;--muted: #7b8291;--line: #2e3440;--soft: #242933;--bg: #1a1e27;--accent: #88c0d0}*{box-sizing:border-box}html,body{margin:0;height:100%}body{font-family:system-ui,sans-serif;background:var(--bg);color:var(--fg);display:flex;flex-direction:column}header#top{display:flex;align-items:center;gap:16px;padding:10px 18px;background:var(--soft);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5;flex-wrap:nowrap}.brand{font-weight:700;color:var(--fg);text-decoration:none;margin-right:4px}nav#tabs{display:flex;gap:6px;flex:1;min-width:0;overflow-x:auto}.tab{font-size:13px;padding:6px 10px;border:none;border-radius:6px;cursor:pointer;background:transparent;color:var(--muted)}.tab:hover{color:var(--fg)}.tab.active{background:var(--line);color:var(--accent)}.acct{margin-left:auto;flex-shrink:0;display:flex;align-items:center;gap:8px}.detach{flex-shrink:0;font-size:14px;line-height:1;padding:5px 7px;border:1px solid var(--line);border-radius:6px;background:transparent;color:var(--accent);cursor:pointer}.detach:hover{background:var(--line)}.detach[hidden]{display:none}.acct-name{font-size:13px;font-weight:500}.acct-btn{font-size:13px;cursor:pointer;color:var(--muted);background:none;border:none;padding:0}.acct-btn:hover{color:var(--fg)}.acct-link{text-decoration:none}main#main{flex:1;display:flex;min-height:0}.panel{flex:1;display:flex;flex-direction:column;min-height:0;padding:16px 20px}.panel[hidden]{display:none}.panel h1{font-size:1.2rem;margin:0 0 8px}.muted{color:var(--muted);font-size:14px}.muted a{color:var(--accent)}.panel iframe.embed{flex:1;width:100%;min-height:0;border:none;border-radius:8px;background:#fff}@media(max-width:720px){header#top{flex-wrap:wrap;gap:6px;padding:8px 12px}.brand-group{order:1}.detach{order:2}.acct{order:3}nav#tabs{order:3;flex-basis:100%;gap:4px;padding-top:2px}.tab{padding:10px 12px;font-size:13px;white-space:nowrap;flex-shrink:0}.panel{padding:10px}.panel iframe.embed{border-radius:6px;min-height:55vh}.panel[data-panel=console] iframe.embed{flex:0 0 auto;height:min(62vh,480px);max-height:70vh}}@media(max-width:420px){header#top{padding:6px 10px;gap:4px}.tab{padding:9px 10px;font-size:12px}.acct-name{font-size:12px}}