:root { color-scheme:light dark; --surface:#faf9f7; --surface-2:#f0efed; --text:#1c2025; --muted:#5f6772; --line:#d9dde2; --accent:#155ac1; --accent-container:#dce8fc; --error:#a83131; font:16px/1.55 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.report-figures figure { margin:24px 0; min-width:0; }
.report-figures img { display:block; width:100%; height:auto; background:var(--surface-2); border-radius:12px; }
.report-figures table { width:100%; table-layout:fixed; border-collapse:collapse; }
.report-figures td,.report-figures th { padding:8px; text-align:left; vertical-align:top; overflow-wrap:anywhere; border-bottom:1px solid var(--line); }
.report-figures figcaption { font-weight:600; margin:12px 0; }
@media(prefers-color-scheme:dark) { :root:not([data-theme="light"]) { --surface:#121519; --surface-2:#1c2026; --text:#e6e9ee; --muted:#a0a9b7; --line:#343c48; --accent:#a9c7ff; --accent-container:#233954; --error:#ffb0ab; } }
:root[data-theme="dark"] { color-scheme:dark; --surface:#121519; --surface-2:#1c2026; --text:#e6e9ee; --muted:#a0a9b7; --line:#343c48; --accent:#a9c7ff; --accent-container:#233954; --error:#ffb0ab; }
* { box-sizing:border-box; } body { margin:0; background:var(--surface); color:var(--text); } button,input,textarea,select { font:inherit; } button,a,input,textarea,select { -webkit-tap-highlight-color:transparent; }
button { min-height:44px; padding:.55rem 1rem; border:1px solid var(--line); border-radius:24px; background:transparent; color:var(--text); cursor:pointer; text-align:left; }
button:hover { background:var(--surface-2); } button:disabled { opacity:.5; cursor:wait; } button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
a { color:var(--accent); text-underline-offset:4px; } h1,h2 { line-height:1.3; font-weight:550; letter-spacing:-.025em; } h1 { font-size:clamp(1.6rem,2.7vw,2.45rem); } h2 { font-size:1.2rem; } p { max-width:72ch; } small,.muted,.empty { color:var(--muted); } [hidden] { display:none!important; }
header { height:76px; border-bottom:1px solid var(--line); display:flex; align-items:center; gap:16px; padding:12px 24px; } .brand { font-size:1.6rem; color:var(--text); text-decoration:none; font-weight:650; letter-spacing:-.06em; } .build-label { font-size:.75rem; color:var(--muted); margin-right:auto; } header button { white-space:nowrap; } header kbd { margin-left:12px; color:var(--muted); }
nav { position:fixed; inset:76px auto 0 0; width:104px; padding:20px 8px; border-right:1px solid var(--line); display:flex; flex-direction:column; gap:12px; } nav button { border:0; text-align:center; border-radius:18px; padding:14px 4px; font-size:.8rem; } nav button[aria-current] { background:var(--accent-container); color:var(--accent); }
#workspace { margin-left:104px; height:calc(100dvh - 108px); display:grid; grid-template-columns:minmax(240px,29%) minmax(0,1fr); } #question-list,#detail,#inspector { padding:28px; overflow:auto; min-width:0; } #question-list { border-right:1px solid var(--line); } #detail { padding:36px clamp(24px,4vw,64px); } #inspector { border-left:1px solid var(--line); }
.inspector-open #workspace { grid-template-columns:240px minmax(0,1fr) 290px; } .section-head { display:flex; align-items:center; gap:12px; flex-wrap:wrap; } .section-head h1 { flex:1; font-size:1.15rem; } .question-row { display:flex; flex-direction:column; gap:8px; width:100%; padding:20px 8px; border:0; border-bottom:1px solid var(--line); border-radius:0; overflow-wrap:anywhere; } .question-row small { font-size:.8rem; }
.foyer { max-width:640px; margin:12vh auto; } .foyer h2 { font-size:2rem; } .actions { display:flex; gap:8px; flex-wrap:wrap; margin:24px 0; } .actions button { font-size:.85rem; } .assessment { padding:20px 0; border-top:1px solid var(--line); } .band { font-size:1.35rem; color:var(--accent); } .notice { padding:16px; background:var(--surface-2); border-left:3px solid var(--accent); } .eyebrow { text-transform:uppercase; letter-spacing:.09em; font-size:.75rem; color:var(--muted); }
.report-section { padding:20px 0; border-top:1px solid var(--line); } blockquote { margin:20px 0 8px; padding-left:16px; border-left:2px solid var(--accent); overflow-wrap:anywhere; } #status { position:fixed; bottom:0; left:104px; right:0; margin:0; min-height:32px; background:var(--surface); padding:4px 24px; font-size:.8rem; } #status.error { color:var(--error); }
dialog { color:var(--text); background:var(--surface); border:1px solid var(--line); border-radius:24px; width:min(560px,92vw); padding:28px; max-height:85dvh; } dialog::backdrop { background:#0008; } dialog form { display:flex; flex-direction:column; gap:16px; } label { display:block; margin-bottom:6px; color:var(--muted); } input,textarea,select { border:1px solid var(--line); color:var(--text); background:var(--surface); border-radius:10px; padding:12px; max-width:100%; } textarea { width:100%; resize:vertical; } #command-search { width:100%; } #command-results { display:flex; flex-direction:column; margin:16px 0; gap:8px; } #commands p { font-size:.85rem; color:var(--muted); }
.login { max-width:560px; padding:24px; margin:10vh auto; } .login form { display:flex; flex-direction:column; gap:12px; } .login p { color:var(--muted); font-size:.85rem; } .share-row { display:flex; justify-content:space-between; gap:12px; align-items:center; padding-top:20px; overflow-wrap:anywhere; } .mobile-back { display:none; } .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; } .list-collapsed #question-list { display:none; } .list-collapsed #workspace { grid-template-columns:1fr; }
@media(max-width:1100px) { .build-label { max-width:130px; line-height:1.3; } header { gap:8px; padding:12px 16px; } header kbd { display:none; } .inspector-open #workspace { grid-template-columns:220px minmax(0,1fr); } #inspector { position:fixed; inset:auto 0 32px auto; width:min(440px,85vw); max-height:70dvh; background:var(--surface-2); border:1px solid var(--line); border-radius:24px 0 0 0; z-index:3; } }
@media(max-width:760px) { header { height:68px; padding:10px 16px; } .build-label { max-width:90px; font-size:.65rem; } header .language { display:none; } header #logout { font-size:.75rem; padding:8px; } header #open-commands { font-size:.8rem; padding:8px; } header #theme { min-width:40px; padding:8px; } nav { position:fixed; inset:auto 0 0; width:auto; height:72px; z-index:5; flex-direction:row; padding:8px; border:0; border-top:1px solid var(--line); background:var(--surface); justify-content:space-around; gap:0; } nav button { min-width:23%; padding:8px 4px; } #workspace,.inspector-open #workspace { margin:0; height:calc(100dvh - 172px); display:block; } #question-list { border:0; padding:20px; height:100%; } #detail { display:none; padding:24px 20px; height:100%; } .show-detail #question-list { display:none; } .show-detail #detail { display:block; } .mobile-back { display:inline-flex; margin-bottom:16px; } #status { left:0; bottom:72px; font-size:.7rem; padding:6px 16px; } #inspector { bottom:104px; width:100%; max-height:65dvh; border-radius:24px 24px 0 0; } .foyer { margin:5vh auto; } h1 { font-size:1.65rem; } .actions { gap:8px; } .actions button { padding:8px 12px; font-size:.8rem; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; animation:none!important; transition:none!important; } }
body:has(#workspace) { display:grid; height:100dvh; grid-template-columns:104px minmax(0,1fr); grid-template-rows:auto minmax(0,1fr) auto; }
body:has(#workspace)>header { grid-column:1/-1; height:auto; min-height:76px; flex-wrap:wrap; }
body:has(#workspace)>nav { position:static; grid-row:2/4; grid-column:1; width:104px; }
body:has(#workspace)>#workspace { grid-row:2; grid-column:2; margin:0; height:100%; min-height:0; }
body:has(#workspace)>#status { position:static; grid-row:3; grid-column:2; }
table { width:100%; border-collapse:collapse; overflow-wrap:anywhere; font-size:.9rem; } th,td { text-align:left; padding:12px 8px; border-bottom:1px solid var(--line); vertical-align:top; }
@media(max-width:760px) { body:has(#workspace) { grid-template-columns:minmax(0,1fr); grid-template-rows:auto minmax(0,1fr) auto 72px; } body:has(#workspace)>header { grid-row:1; min-height:68px; } body:has(#workspace)>nav { grid-row:4; grid-column:1; width:100%; } body:has(#workspace)>#workspace { grid-row:2; grid-column:1; } body:has(#workspace)>#status { grid-row:3; grid-column:1; } header .language { display:block; width:70px; margin-left:auto; margin-bottom:0; } header .language select { width:70px; min-height:44px; padding:6px; } .build-label { display:none; } }

.workspace-shell { display:grid; height:100dvh; grid-template-columns:104px minmax(0,1fr); grid-template-rows:auto minmax(0,1fr) 32px; }
.workspace-shell>header { grid-column:1 / -1; height:auto; min-height:76px; flex-wrap:wrap; }
.workspace-shell>nav { position:static; grid-column:1; grid-row:2 / 4; width:auto; }
.workspace-shell #workspace { grid-column:2; grid-row:2; margin:0; height:auto; min-height:0; }
.workspace-shell>#status { position:static; grid-column:2; grid-row:3; }
#settings-dialog form { padding:20px 0; border-bottom:1px solid var(--line); }
.standing-card { display:flex; flex-direction:column; gap:8px; width:100%; margin:12px 0; border-radius:16px; overflow-wrap:anywhere; }
#foyer-question-form { display:flex; flex-direction:column; gap:12px; }
#settings-dialog label { min-height:44px; display:flex; align-items:center; }
#settings-dialog code { display:block; overflow-wrap:anywhere; }
@media(max-width:760px) {
  .workspace-shell header .language,.workspace-shell header .language select { width:92px; }
  .workspace-shell { grid-template-columns:minmax(0,1fr); grid-template-rows:auto minmax(0,1fr) 64px 32px; }
  .workspace-shell #workspace { grid-column:1; grid-row:2; }
  .workspace-shell>nav { position:static; grid-column:1; grid-row:3; height:64px; }
  .workspace-shell>#status { grid-column:1; grid-row:4; }
}
