:root { color-scheme: light; font-family:Poppins,Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--text-sm:.875rem;--text-base:1rem;--text-lg:1.125rem;--text-xl:1.375rem;--text-2xl:1.75rem;--line:1.55;--radius-sm:6px;--radius:10px;--radius-lg:14px;--border:#dce2e8;--surface:#fff;--background:#f5f7f9;--text:#17212b;--muted:#65727f;--accent:#1f5f8b;--success:#18794e;--danger:#b42318;--shadow:0 8px 24px rgb(23 33 43 / 7%);--content:1120px;--control:42px;--table-row:44px; }
* { box-sizing:border-box; } body { margin:0; min-height:100vh; background:var(--background); color:var(--text); font-size:var(--text-base); line-height:var(--line); } a { color:#155f91; text-decoration:none; } a:hover { text-decoration:underline; } a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid #7db7e0; outline-offset:2px; } h1,h2,h3 { color:#17212b; line-height:1.25; margin:0 0 var(--space-3); } h1 { font-family:"Roboto Condensed",Arial Narrow,Arial,sans-serif; font-size:clamp(1.75rem,3vw,var(--text-2xl)); } h2 { font-size:var(--text-xl); margin-top:var(--space-6); } h3 { font-size:var(--text-lg); } p,ul,ol,dl { margin:0 0 var(--space-4); } small,.eyebrow { color:var(--muted); font-size:var(--text-sm); } .eyebrow { font-weight:600; letter-spacing:.07em; text-transform:uppercase; } .principle,.advisory-notice { color:#7b4a00; font-weight:600; } .shell { width:min(var(--content),calc(100% - 32px)); margin:var(--space-8) auto; } section,.result,.card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); margin:var(--space-5) 0; padding:var(--space-5); white-space:pre-wrap; } .result { border-left:4px solid var(--accent); } .status,.success { color:var(--success); font-weight:600; } .error,.ai-error-message { color:var(--danger); font-weight:600; } form { display:grid; gap:var(--space-3); margin:var(--space-5) 0; max-width:720px; } label { display:grid; gap:var(--space-1); color:#34414e; font-weight:500; } input,textarea,select,button { border-radius:var(--radius-sm); font:inherit; } input,textarea,select { min-height:var(--control); width:100%; border:1px solid #bfc9d2; background:#fff; color:var(--text); padding:9px 10px; } textarea { min-height:130px; resize:vertical; } button,.button { align-items:center; background:var(--accent); border:1px solid var(--accent); color:#fff; cursor:pointer; display:inline-flex; font-weight:600; justify-content:center; min-height:var(--control); padding:8px 14px; text-decoration:none; width:fit-content; } button:hover,.button:hover { filter:brightness(.94); text-decoration:none; } button:disabled { cursor:wait; opacity:.7; } .button-ghost { background:transparent; border-color:#9ca8b3; color:#34414e; } fieldset { border:1px solid var(--border); border-radius:var(--radius); display:grid; gap:var(--space-3); padding:var(--space-4); } legend { padding:0 var(--space-2); font-weight:600; } table { border-collapse:collapse; display:block; max-width:100%; overflow-x:auto; } th,td { border-bottom:1px solid var(--border); min-height:var(--table-row); padding:var(--space-3); text-align:left; vertical-align:top; } th { color:var(--muted); font-size:var(--text-sm); font-weight:600; } .badge,.ai-run-status { display:inline-flex; align-items:center; border-radius:999px; background:#e9f2f8; color:#155f91; font-size:var(--text-sm); font-weight:600; padding:3px 9px; } .ai-panel { border-left:4px solid #a15c00; } .ai-proposal { background:#fffaf0; border:1px solid #efd9b3; border-radius:var(--radius-sm); margin-top:var(--space-4); padding:var(--space-4); } .ai-metadata { display:flex; flex-wrap:wrap; gap:var(--space-2) var(--space-6); } .ai-metadata div { display:flex; gap:var(--space-1); } .ai-metadata dt { font-weight:600; } .ai-metadata dd { margin:0; } .ai-loading-message[hidden],.help-text[hidden],.ai-error-message[hidden] { display:none; } .ai-loading-message { align-items:center; display:flex; gap:var(--space-2); } .loading-spinner { animation:ai-spin .8s linear infinite; border:3px solid #a6b3bf; border-right-color:transparent; border-radius:50%; height:18px; width:18px; } @keyframes ai-spin { to { transform:rotate(360deg); } }
.auth-page { display:grid; place-items:center; padding:var(--space-4); } .auth-card { width:min(100%,440px); background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); box-shadow:var(--shadow); padding:var(--space-8); } .app-frame { min-height:100vh; } .app-content { width:min(var(--content),calc(100% - 32px)); margin:0 auto; padding:var(--space-8) 0 var(--space-12); } .app-sidebar { background:#fff; border-right:1px solid var(--border); box-shadow:var(--shadow); display:flex; flex-direction:column; gap:var(--space-4); height:100vh; left:0; padding:var(--space-5); position:fixed; top:0; width:280px; z-index:20; } .app-sidebar nav { display:grid; gap:var(--space-1); } .app-brand { font-family:"Roboto Condensed",Arial Narrow,sans-serif; font-size:var(--text-xl); font-weight:700; margin-bottom:var(--space-3); } .app-nav-link { border-radius:var(--radius-sm); color:#34414e; padding:10px; } .app-nav-link:hover,.app-nav-link.is-current { background:#eaf2f8; color:#124d75; text-decoration:none; } .app-sidebar form { margin-top:auto; } .app-topbar { align-items:center; background:rgb(255 255 255 / 94%); border-bottom:1px solid var(--border); display:flex; gap:var(--space-3); min-height:64px; padding:var(--space-2) max(16px,calc((100vw - var(--content))/2)); position:sticky; top:0; z-index:10; } .sidebar-toggle { background:#fff; border-color:#bfc9d2; color:#34414e; min-width:var(--control); padding:6px; } .app-context { display:grid; line-height:1.25; } .app-context span { color:var(--muted); font-size:var(--text-sm); } .help-link { margin-left:auto; font-weight:600; white-space:nowrap; } .skip-link { left:var(--space-3); position:absolute; top:-100px; z-index:30; } .skip-link:focus { background:#fff; border:1px solid var(--border); padding:var(--space-2); top:var(--space-2); } @media (max-width:720px) { .app-content,.shell { width:calc(100% - 24px); } .app-content { padding-top:var(--space-5); } .app-sidebar { width:min(86vw,320px); } .auth-card { padding:var(--space-5); } section,.result,.card { padding:var(--space-4); } }
.readiness-ready { background:#e8f5ee; color:#12663e; } .readiness-warning { background:#fff4df; color:#8a5000; } .readiness-blocked { background:#ffebe9; color:#a62f25; } .readiness-list { display:grid; gap:var(--space-3); list-style:none; padding:0; } .readiness-list li { border-bottom:1px solid var(--border); padding-bottom:var(--space-3); } .flow { align-items:center; display:flex; flex-wrap:wrap; gap:var(--space-2); } .flow span { background:#eef4f8; border:1px solid #d5e1e9; border-radius:999px; color:#28465a; font-size:var(--text-sm); padding:5px 9px; } .flow b { color:var(--muted); }
.app-brand { align-items:center; display:flex; gap:10px; text-decoration:none; }.app-brand img { height:38px; width:38px; }.app-brand span { color:#123b58; }.app-brand:hover { text-decoration:none; }.app-page .app-content > :first-child:not(.exercise-banner) { margin-top:0; }.exercise-banner { align-items:end; background-image:linear-gradient(90deg,rgb(9 45 69 / 85%),rgb(9 45 69 / 25%)),var(--exercise-banner); background-position:center; background-size:cover; color:#fff; display:flex; min-height:142px; overflow:hidden; padding:var(--space-6); }.exercise-banner .eyebrow { color:#d9ebf4; margin-bottom:var(--space-1); }.exercise-banner strong { display:block; font-size:var(--text-xl); }.badge-active { background:#dff4e7; color:#14633e; margin-top:var(--space-2); }.table-container { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); margin:var(--space-5) 0; overflow-x:auto; }.table-container table { display:table; margin:0; min-width:480px; width:100%; }.table-container th,.table-container td { padding:var(--space-4); }.alert { border:1px solid transparent; border-radius:var(--radius-sm); padding:var(--space-3); }.alert-error { background:#fff0ef; border-color:#f4c7c2; color:#8e251c; }.error-card { border-left:5px solid var(--danger); max-width:680px; white-space:normal; }.error-code { align-items:center; display:flex; gap:var(--space-2); }.error-code code { background:#f1f4f6; border-radius:4px; color:#34414e; padding:3px 7px; }.empty-state { border-style:dashed; color:var(--muted); padding:var(--space-10) var(--space-5); text-align:center; white-space:normal; }.modal-foundation { background:rgb(23 33 43 / 48%); display:grid; inset:0; padding:var(--space-4); place-items:center; position:fixed; z-index:50; }.modal-dialog { background:var(--surface); border-radius:var(--radius-lg); box-shadow:0 24px 64px rgb(0 0 0 / 24%); max-width:560px; padding:var(--space-6); width:min(100%,560px); }.modal-dialog-header { align-items:start; display:flex; gap:var(--space-3); justify-content:space-between; }
.auth-page { background:#e9eef2; min-height:100vh; padding:clamp(16px,4vw,56px); }.auth-layout { background:var(--surface); box-shadow:0 24px 70px rgb(8 34 51 / 18%); display:grid; grid-template-columns:minmax(320px,1.05fr) minmax(360px,.95fr); margin:auto; max-width:1120px; min-height:min(720px,calc(100vh - 32px)); overflow:hidden; }.auth-visual { color:#fff; display:grid; min-height:540px; position:relative; }.auth-visual img { height:100%; object-fit:cover; position:absolute; width:100%; }.auth-visual div { align-self:end; background:linear-gradient(transparent,rgb(5 28 43 / 92%)); padding:88px var(--space-8) var(--space-8); position:relative; }.auth-visual .eyebrow { color:#e6b34d; }.auth-card { align-self:center; border:0; box-shadow:none; margin:auto; padding:var(--space-10); width:min(100%,480px); }.auth-logo { height:64px; margin-bottom:var(--space-4); width:64px; }
@media (max-width:720px) { .auth-page { padding:0; }.auth-layout { grid-template-columns:1fr; min-height:100vh; }.auth-visual { min-height:260px; }.auth-visual div { padding:64px var(--space-5) var(--space-5); }.auth-card { padding:var(--space-6) var(--space-5); }.exercise-banner { margin-left:-12px; margin-right:-12px; }.app-topbar { padding-left:12px; padding-right:12px; } }
.v2-app-frame { margin-left:280px; transition:margin-left .15s ease; }.v2-app-frame.v2-sidebar-hidden { margin-left:0; }.v2-sidebar { display:flex; pointer-events:auto; z-index:20; }.v2-sidebar[hidden] { display:none; pointer-events:none; }.v2-app-frame .app-topbar { position:sticky; z-index:30; }.sidebar-toggle { position:relative; z-index:31; }.sidebar-toggle span { font-size:var(--text-sm); margin-left:4px; } @media (max-width:720px) { .v2-app-frame,.v2-app-frame.v2-sidebar-hidden { margin-left:0; }.v2-sidebar { box-shadow:0 8px 30px rgb(0 0 0 / 24%); }.sidebar-toggle { min-width:auto; }.v2-sidebar[hidden] { display:none; } }
.v2-page { display:grid; gap:var(--space-5); }.v2-page section { margin:0; white-space:normal; }.v2-context-grid,.v2-metrics { display:grid; gap:var(--space-4); grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); }.v2-exercise-card h2,.v2-metrics strong { font-size:var(--text-xl); }.v2-dashboard-heading,.v2-control-room,.v2-latest { align-items:center; display:flex; flex-wrap:wrap; gap:var(--space-4); justify-content:space-between; }.v2-dashboard-heading h1 { margin-bottom:var(--space-2); }.v2-notification { background:#fff1d6; border:1px solid #e7bb69; border-radius:999px; color:#855000; font-weight:700; padding:6px 11px; }.v2-notification span { color:#b42318; }.v2-participant-banner { background:linear-gradient(120deg,#0c405f,#1f6e92); color:#fff; }.v2-participant-banner h2 { color:#fff; }.v2-control-room { border-left:5px solid #a15c00; }.v2-control-room h2 { margin:0; }.v2-mode { border:1px solid #e7bb69; border-radius:var(--radius-sm); padding:var(--space-3); }.v2-mode p { margin:var(--space-2) 0; }.v2-metrics section { display:grid; gap:var(--space-2); }.v2-metrics p { color:var(--muted); margin:0; }.badge-status,.badge-activity { width:fit-content; }.badge-status { background:#dff4e7; color:#14633e; }.badge-activity { background:#e9f2f8; color:#155f91; }.v2-summary { border-left:5px solid #b48a28; }.v2-summary .error-code { margin-bottom:0; } @media (max-width:560px) { .v2-dashboard-heading,.v2-control-room,.v2-latest { align-items:stretch; flex-direction:column; }.v2-dashboard-heading .v2-notification { align-self:flex-start; } }

/* Login presentation: mirrors the dark command-centre reference while keeping
   the existing server-rendered route, branding paths, and form behaviour. */
.auth-page { background:#080b11; color:#f4f7fb; display:block; font-family:Inter,Poppins,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; padding:0; }
.auth-layout { background:#080b11; display:grid; grid-template-columns:1.1fr .9fr; margin:0; max-width:none; min-height:100vh; overflow:hidden; }
.auth-visual { border:0; border-radius:0; box-shadow:none; color:#fff; display:block; margin:0; min-height:100vh; overflow:hidden; padding:0; position:relative; }
.auth-visual-image { border:0; border-radius:0; box-shadow:none; display:block; height:100%; inset:0; max-width:none; object-fit:cover; position:absolute; width:100%; }
.auth-brand { align-items:center; display:flex; font-weight:800; gap:12px; letter-spacing:4px; text-transform:uppercase; }
.auth-brand img { border-radius:8px; height:42px; object-fit:cover; width:42px; }
.auth-card { align-self:center; background:transparent; border:0; box-shadow:none; margin:0 auto; padding:48px; width:min(390px,100%); }
.auth-card .eyebrow { color:#8d9aad; font-size:11px; letter-spacing:2px; margin-bottom:16px; }
.auth-card h1 { color:#f4f7fb; font-family:Inter,Poppins,ui-sans-serif,system-ui,sans-serif; font-size:42px; font-weight:800; letter-spacing:-1.8px; line-height:1.08; margin:0 0 8px; }
.auth-lead { color:#8d9aad; margin:0 0 35px; }
.auth-card .auth-brand { margin-bottom:56px; }
.auth-card .auth-brand span { color:#f4f7fb; }
.auth-form { display:grid; gap:0; margin:0; max-width:none; }
.auth-form label { color:#b9c4d4; display:grid; font-size:13px; font-weight:500; gap:9px; margin:18px 0; }
.auth-form input { background:#0b111b; border:1px solid #263242; border-radius:5px; color:#f4f7fb; min-height:48px; padding:13px 14px; }
.auth-form input:hover { border-color:#3a4b61; }
.auth-form input:focus { border-color:#70b4ff; box-shadow:0 0 0 3px rgba(112,180,255,.12); outline:none; }
.auth-submit { align-items:center; background:#247bd1; border:0; border-radius:5px; color:#fff; display:flex; font-weight:700; gap:10px; justify-content:center; margin-top:22px; min-height:48px; padding:12px 17px; transition:background-color .2s,transform .2s; width:100%; }
.auth-submit:hover { background:#3b9aff; filter:none; transform:translateY(-2px); }
.auth-submit:disabled { background:#247bd1; opacity:.65; transform:none; }
.auth-card .alert { background:#3b1719; border:1px solid #7b292b; border-radius:5px; color:#ffaaa5; font-size:13px; margin:0 0 16px; padding:11px; }
.auth-note { color:#667388; font-size:11px; line-height:1.6; margin:28px 0 0; }
@media (max-width:800px) {
  .auth-layout { grid-template-columns:1fr; }
  .auth-visual { display:none; }
  .auth-card { padding:28px; width:min(100%,390px); }
}
:root { font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }.v2-app-frame.v2-sidebar-collapsed { margin-left:72px; }.v2-sidebar:has(+ .v2-app-frame.v2-sidebar-collapsed) { width:72px; padding-left:12px; padding-right:12px; }.v2-sidebar:has(+ .v2-app-frame.v2-sidebar-collapsed) .nav-label,.v2-sidebar:has(+ .v2-app-frame.v2-sidebar-collapsed) .app-brand span,.v2-sidebar:has(+ .v2-app-frame.v2-sidebar-collapsed) form { display:none; }.v2-sidebar .app-nav-link { align-items:center; display:flex; gap:10px; }.nav-icon { flex:0 0 22px; height:22px; width:22px; }.v2-sidebar:has(+ .v2-app-frame.v2-sidebar-collapsed) .app-nav-link { justify-content:center; padding:10px 4px; }@media (max-width:720px) { .v2-app-frame.v2-sidebar-collapsed { margin-left:0; }.v2-sidebar:has(+ .v2-app-frame.v2-sidebar-collapsed) { width:min(86vw,320px); padding:var(--space-5); }.v2-sidebar:has(+ .v2-app-frame.v2-sidebar-collapsed) .nav-label,.v2-sidebar:has(+ .v2-app-frame.v2-sidebar-collapsed) .app-brand span,.v2-sidebar:has(+ .v2-app-frame.v2-sidebar-collapsed) form { display:initial; } }

/* Authenticated command-centre theme: shared visual language for every role. */
:root {
  color-scheme: dark;
  --background:#080b11;
  --surface:#101620;
  --surface-raised:#0e151f;
  --surface-subtle:#0b1018;
  --border:#202c3d;
  --border-strong:#2d3d52;
  --text:#f4f7fb;
  --muted:#8d9aad;
  --accent:#1683ff;
  --success:#2dd49b;
  --danger:#ff5348;
  --warning:#f2b84b;
  --shadow:0 16px 48px rgb(0 0 0 / 20%);
  --content:1280px;
  --control:44px;
  --table-row:46px;
}

body {
  background:var(--background);
  color:var(--text);
  font-family:Inter,Poppins,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
}
.app-page,.app-page * { font-family:Inter,Poppins,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; }

a { color:#70b4ff; }
a:hover { color:#a5d0ff; }
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible {
  outline:3px solid rgb(112 180 255 / 62%);
  outline-offset:2px;
}

h1,h2,h3 { color:var(--text); font-family:Inter,Poppins,ui-sans-serif,system-ui,sans-serif; }
h1 { font-size:clamp(1.8rem,3vw,2.6rem); font-weight:800; letter-spacing:-.04em; }
h2 { font-size:clamp(1.2rem,2vw,1.5rem); font-weight:750; }
h3 { font-size:1.08rem; font-weight:700; }
small,.eyebrow { color:var(--muted); }
.eyebrow { letter-spacing:.12em; }
.principle,.advisory-notice { color:var(--warning); }

section,.result,.card {
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:6px;
  box-shadow:none;
}
.result { border-left:3px solid var(--accent); }
.status,.success { color:var(--success); }
.error,.ai-error-message { color:var(--danger); }

input,textarea,select {
  background:#0b111b;
  border-color:var(--border-strong);
  color:var(--text);
}
input::placeholder,textarea::placeholder { color:#667388; }
input:hover,textarea:hover,select:hover { border-color:#3a4b61; }
input:focus,textarea:focus,select:focus {
  border-color:#70b4ff;
  box-shadow:0 0 0 3px rgb(112 180 255 / 12%);
  outline:none;
}
button,.button {
  background:var(--accent);
  border-color:var(--accent);
  border-radius:5px;
  font-weight:700;
}
button:hover,.button:hover { filter:none; background:#3b9aff; }
.button-ghost { background:transparent; border-color:var(--border-strong); color:#b9c4d4; }
.button-ghost:hover { background:#14243b; border-color:#4b6584; color:#fff; }

table { color:var(--text); }
th,td { border-bottom-color:var(--border); }
th { color:#667388; letter-spacing:.06em; text-transform:uppercase; }
.badge,.ai-run-status { background:#162b45; color:#9dccff; }
.badge-active,.badge-status,.readiness-ready { background:#103c34; color:#6ee7bf; }
.badge-activity { background:#162b45; color:#9dccff; }
.readiness-warning { background:#3a2b12; color:#f4c86c; }
.readiness-blocked { background:#421b20; color:#ffaaa5; }
.ai-panel { border-left-color:var(--warning); }
.ai-proposal { background:#1d1a13; border-color:#59451e; }
.ai-metadata dt,.ai-metadata dd { color:var(--text); }
.loading-spinner { border-color:#465a73; border-right-color:transparent; }

.app-frame {
  background:linear-gradient(120deg,#0b1018,#090c12 55%,#0c1624);
  min-height:100vh;
}
.app-content {
  max-width:var(--content);
  padding:38px clamp(24px,5vw,76px) 60px;
  width:100%;
}
.app-sidebar {
  background:#0d1b2d;
  border-right-color:#203b57;
  box-shadow:none;
  gap:var(--space-6);
  padding:28px 18px 20px;
  width:240px;
}
.app-brand { color:var(--text); letter-spacing:.02em; }
.app-brand span { color:var(--text); }
.app-brand img { border-radius:8px; }
.app-nav-link {
  border-radius:5px;
  color:#8d9aad;
  padding:10px 12px;
}
.app-nav-link:hover,.app-nav-link.is-current {
  background:#153454;
  color:#f4f7fb;
}
.app-sidebar form { max-width:none; }
.app-sidebar form .button-ghost { width:100%; }
.app-topbar {
  background:#101620;
  border-bottom-color:var(--border);
  padding-left:clamp(16px,5vw,76px);
  padding-right:clamp(16px,5vw,76px);
}
.sidebar-toggle { background:#0b111b; border-color:var(--border-strong); color:#b9c4d4; }
.sidebar-toggle:hover { background:#14243b; }
.app-context strong { color:var(--text); }
.app-context span { color:var(--muted); }
.help-link { color:#b9c4d4; }
.help-link:hover { color:#fff; }
.skip-link:focus { background:#101620; border-color:var(--border-strong); color:#fff; }
.v2-app-frame { margin-left:240px; }
.v2-app-frame.v2-sidebar-hidden { margin-left:0; }
.v2-sidebar:has(+ .v2-app-frame.v2-sidebar-collapsed) { width:72px; }
.v2-sidebar:has(+ .v2-app-frame.v2-sidebar-collapsed) form { display:block; }
.v2-sidebar:has(+ .v2-app-frame.v2-sidebar-collapsed) .logout-button { justify-content:center; padding:10px 4px; }
.v2-sidebar:has(+ .v2-app-frame.v2-sidebar-collapsed) .logout-label { display:none; }
.logout-button .nav-icon { flex:0 0 20px; height:20px; width:20px; }

.exercise-banner {
  border-color:var(--border);
  border-radius:6px;
  box-shadow:none;
  min-height:160px;
}
.exercise-banner .eyebrow { color:#a5d0ff; }
.badge-active { margin-top:var(--space-2); }
.table-container {
  background:var(--surface);
  border-color:var(--border);
  border-radius:6px;
  box-shadow:none;
}
.table-container th,.table-container td { padding:14px 18px; }
.alert-error { background:#3b1719; border-color:#7b292b; color:#ffaaa5; }
.error-card { border-left-color:var(--danger); }
.error-code code { background:#0b111b; color:#b9c4d4; }
.empty-state { background:transparent; border-color:#34445a; }
.modal-foundation { background:rgb(0 0 0 / 70%); }
.modal-dialog { background:var(--surface); border:1px solid var(--border); box-shadow:0 24px 64px rgb(0 0 0 / 55%); }
.flow span { background:#162b45; border-color:#2b4766; color:#b9d9ff; }
.readiness-list li { border-bottom-color:var(--border); }

.v2-page {
  gap:22px;
  max-width:var(--content);
  width:100%;
}
.v2-page > nav {
  align-items:center;
  border-bottom:1px solid var(--border);
  color:#667388;
  display:flex;
  flex-wrap:wrap;
  gap:8px 14px;
  padding-bottom:16px;
}
.v2-page > nav a { color:#8d9aad; }
.v2-page > nav a:hover { color:#fff; }
.v2-dashboard-heading {
  align-items:flex-end;
  border-bottom:1px solid var(--border);
  padding-bottom:26px;
}
.v2-dashboard-heading h1 { margin-bottom:8px; }
.v2-actions { align-items:center; display:flex; flex-wrap:wrap; gap:10px; }
.v2-context-grid { gap:1px; background:var(--border); border:1px solid var(--border); }
.v2-exercise-card { border:0; border-radius:0; margin:0; }
.v2-exercise-card h2 { color:var(--text); }
.v2-metrics {
  background:var(--border);
  border:1px solid var(--border);
  gap:1px;
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.v2-metrics section {
  background:var(--surface-raised);
  border:0;
  border-radius:0;
  box-shadow:none;
  margin:0;
  min-height:108px;
}
.v2-metrics strong { color:var(--text); font-size:1.45rem; }
.v2-metrics p { color:var(--muted); }
.v2-summary { border-left:3px solid var(--warning); }
.v2-control-room { border-left:3px solid var(--accent); }
.v2-control-room h2 { color:var(--text); }
.v2-notification { background:#3a2b12; border-color:#725a27; color:#f4c86c; }
.v2-notification span { color:#ffaaa5; }
.v2-participant-banner { background:linear-gradient(120deg,#102b48,#123d5e); border-color:#28547b; }
.v2-participant-banner h2 { color:#fff; }
.v2-mode { background:#1d1a13; border-color:#59451e; }
.v2-tree { background:#0b111b; border:1px solid var(--border); border-radius:6px; color:#b9c4d4; padding:18px; white-space:pre-wrap; }
.v2-page article,.v2-page details {
  background:var(--surface-raised);
  border:1px solid var(--border);
  border-radius:6px;
  padding:20px;
}
.v2-page article { white-space:pre-wrap; }
.v2-page details summary { color:#b9d9ff; cursor:pointer; font-weight:700; }
.v2-page dl { display:grid; gap:12px; grid-template-columns:minmax(160px,1fr) auto; }
.v2-page dt,.v2-page dd { border-bottom:1px solid var(--border); margin:0; padding-bottom:10px; }
.v2-page dd { color:#b9c4d4; }
.v2-page td form,.v2-page p form { display:inline-flex; margin:0; max-width:none; vertical-align:middle; }
.v2-page td form button,.v2-page p form button { min-height:36px; padding:6px 11px; }

.v2-empty-dashboard { padding:32px; }
.v2-empty-dashboard h2 { margin:0 0 8px; }
.v2-empty-subheading { color:#b9c4d4; font-size:1.05rem; margin-bottom:20px; }
.v2-exercise-management-grid { align-items:start; display:grid; gap:22px; grid-template-columns:minmax(300px,.75fr) minmax(0,1.65fr); }
.v2-exercise-management-grid > section { margin:0; }
.v2-exercise-create-card form { margin-bottom:0; max-width:none; }
.v2-exercise-list-card { min-width:0; overflow:hidden; }
.v2-table-scroll { max-width:100%; overflow-x:auto; }
.v2-table-scroll table { display:table; min-width:920px; }
.v2-exercise-list-heading { align-items:end; display:flex; flex-wrap:wrap; gap:18px; justify-content:space-between; margin-bottom:18px; }
.v2-exercise-list-heading h2 { margin:0; }
.v2-filter-nav { color:#667388; display:flex; flex-wrap:wrap; gap:6px 12px; }
.v2-filter-nav a { color:#8d9aad; }
.v2-filter-nav a:hover { color:#fff; }

/* Tables stay readable in both themes, including direct V2 tables without a wrapper. */
.app-page table {
  background:var(--surface);
  border:1px solid var(--border);
  border-collapse:separate;
  border-radius:6px;
  border-spacing:0;
  overflow:hidden;
  width:100%;
}
.app-page table th { background:var(--surface-raised); border-bottom:1px solid var(--border-strong); color:#8d9aad; padding:13px 16px; white-space:nowrap; }
.app-page table td { color:#d7e0eb; padding:14px 16px; }
.app-page table tr:last-child td { border-bottom:0; }
.app-page table tbody tr:nth-child(even) td { background:rgb(255 255 255 / 2%); }
.app-page table tbody tr:hover td { background:#14243b; }
.app-page .table-container table { border:0; border-radius:0; }

:root[data-theme="light"] .v2-empty-subheading { color:#34414e; }
:root[data-theme="light"] .v2-filter-nav a { color:#65727f; }
:root[data-theme="light"] .v2-filter-nav a:hover { color:#124d75; }
:root[data-theme="light"] .app-page table th { background:#eef2f6; border-bottom-color:#c5d0d9; color:#65727f; }
:root[data-theme="light"] .app-page table td { color:#34414e; }
:root[data-theme="light"] .app-page table tbody tr:nth-child(even) td { background:#fafbfd; }
:root[data-theme="light"] .app-page table tbody tr:hover td { background:#eef6fb; }
:root[data-theme="light"] .app-page button:not(.button-ghost):not(.sidebar-toggle):not(.theme-toggle),
:root[data-theme="light"] .app-page .button:not(.button-ghost) { color:#fff; }

/* The command-centre header uses the Emergent panel/line pairing. Keep the
   control icon-only while retaining its state in aria-label for assistive tech. */
.v2-app-frame .sidebar-toggle span { display:none; }
.v2-app-frame .sidebar-toggle { margin-left:-4px; min-width:44px; padding:8px; }
.v2-app-frame .app-topbar { background:#101620; border-bottom-color:#202c3d; padding-left:12px; }
.v2-app-frame .app-context strong { letter-spacing:.01em; }
.app-topbar-actions { align-items:center; display:flex; gap:12px; margin-left:auto; }
.app-topbar-actions .help-link { margin-left:0; }
.theme-toggle {
  align-items:center;
  background:transparent;
  border:1px solid var(--border-strong);
  color:#b9c4d4;
  display:inline-flex;
  height:40px;
  justify-content:center;
  min-height:40px;
  padding:8px;
  width:40px;
}
.theme-toggle:hover { background:#153454; border-color:#4b6584; color:#fff; }
.theme-toggle-icon { font-size:1.1rem; line-height:1; }
.app-page label { color:#c6d1df; }

:root[data-theme="light"] {
  color-scheme:light;
  --background:#f5f7f9;
  --surface:#fff;
  --surface-raised:#fff;
  --surface-subtle:#eef2f6;
  --border:#dce2e8;
  --border-strong:#bfc9d2;
  --text:#17212b;
  --muted:#65727f;
  --accent:#1f5f8b;
  --success:#18794e;
  --danger:#b42318;
  --warning:#8a5b00;
  --shadow:0 8px 24px rgb(23 33 43 / 7%);
}
:root[data-theme="light"] body { background:var(--background); color:var(--text); }
:root[data-theme="light"] a { color:#155f91; }
:root[data-theme="light"] a:hover { color:#124d75; }
:root[data-theme="light"] section,
:root[data-theme="light"] .result,
:root[data-theme="light"] .card { box-shadow:var(--shadow); }
:root[data-theme="light"] input,
:root[data-theme="light"] textarea,
:root[data-theme="light"] select { background:#fff; color:var(--text); }
:root[data-theme="light"] input::placeholder,
:root[data-theme="light"] textarea::placeholder { color:#87939e; }
:root[data-theme="light"] button:hover,
:root[data-theme="light"] .button:hover { background:#286f9e; }
:root[data-theme="light"] .button-ghost { background:transparent; border-color:#9ca8b3; color:#34414e; }
:root[data-theme="light"] .button-ghost:hover { background:#eaf2f8; border-color:#7d9bb4; color:#124d75; }
:root[data-theme="light"] .badge,
:root[data-theme="light"] .ai-run-status,
:root[data-theme="light"] .badge-activity { background:#e9f2f8; color:#155f91; }
:root[data-theme="light"] .badge-active,
:root[data-theme="light"] .badge-status,
:root[data-theme="light"] .readiness-ready { background:#dff4e7; color:#14633e; }
:root[data-theme="light"] .readiness-warning { background:#fff4df; color:#8a5000; }
:root[data-theme="light"] .readiness-blocked { background:#ffebe9; color:#a62f25; }
:root[data-theme="light"] .ai-proposal { background:#fffaf0; border-color:#efd9b3; }
:root[data-theme="light"] .app-frame { background:var(--background); }
:root[data-theme="light"] .app-sidebar { background:#eaf2f8; border-right-color:#c5d6e3; }
:root[data-theme="light"] .app-brand,
:root[data-theme="light"] .app-brand span { color:#123b58; }
:root[data-theme="light"] .app-nav-link { color:#34414e; }
:root[data-theme="light"] .app-nav-link:hover,
:root[data-theme="light"] .app-nav-link.is-current { background:#d6e7f2; color:#124d75; }
:root[data-theme="light"] .app-topbar,
:root[data-theme="light"] .v2-app-frame .app-topbar { background:rgb(255 255 255 / 96%); border-bottom-color:var(--border); }
:root[data-theme="light"] .sidebar-toggle,
:root[data-theme="light"] .theme-toggle { background:#fff; border-color:#bfc9d2; color:#34414e; }
:root[data-theme="light"] .sidebar-toggle:hover,
:root[data-theme="light"] .theme-toggle:hover { background:#eaf2f8; border-color:#7d9bb4; color:#124d75; }
:root[data-theme="light"] .app-context strong { color:#17212b; }
:root[data-theme="light"] .app-context span,
:root[data-theme="light"] .help-link { color:#65727f; }
:root[data-theme="light"] .help-link:hover { color:#124d75; }
:root[data-theme="light"] .v2-metrics { background:var(--border); }
:root[data-theme="light"] .v2-metrics section { background:#fff; }
:root[data-theme="light"] .v2-notification { background:#fff1d6; border-color:#e7bb69; color:#855000; }
:root[data-theme="light"] .v2-notification span { color:#b42318; }
:root[data-theme="light"] .v2-participant-banner { background:linear-gradient(120deg,#0c405f,#1f6e92); border-color:#2b6587; }
:root[data-theme="light"] .v2-mode { background:#fffaf0; border-color:#efd9b3; }
:root[data-theme="light"] .v2-tree,
:root[data-theme="light"] .v2-page article,
:root[data-theme="light"] .v2-page details { background:#fff; color:var(--text); }
:root[data-theme="light"] .v2-page details summary { color:#155f91; }
:root[data-theme="light"] .error-code code { background:#f1f4f6; color:#34414e; }
:root[data-theme="light"] .empty-state { background:transparent; border-color:var(--border); }
:root[data-theme="light"] .app-page label { color:#34414e; }

/* Legacy authenticated views use the same shell and component language. */
.app-page > .shell:not(.v2-page) { max-width:var(--content); }
.app-page .shell > section:first-child,
.app-page .shell > .result:first-child,
.app-page .shell > .card:first-child { margin-top:0; }
.app-page .shell > form,
.app-page .shell > fieldset { background:var(--surface); border:1px solid var(--border); border-radius:6px; padding:20px; }
.app-page .shell > nav { color:#667388; }
.app-page .shell > nav a { color:#8d9aad; }
.fact-choice { background:#162b45; border-color:#2b4766; color:#d7e9ff; }
.correction-form { border-left:3px solid var(--warning); }

@media (max-width:900px) {
  .v2-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .v2-exercise-management-grid { grid-template-columns:1fr; }
}
@media (max-width:720px) {
  .v2-app-frame,.v2-app-frame.v2-sidebar-hidden { margin-left:0; }
  .v2-sidebar { width:min(86vw,320px); }
  .app-content { padding:24px 16px 40px; width:100%; }
  .v2-metrics { grid-template-columns:1fr; }
  .v2-dashboard-heading { align-items:stretch; flex-direction:column; }
  .app-topbar { padding-left:16px; padding-right:16px; }
  .v2-sidebar:has(+ .v2-app-frame.v2-sidebar-collapsed) form { display:initial; }
}

/* Keep content inside its card and let short tables use the full card width. */
.app-page section,
.app-page article,
.app-page .card,
.app-page .result,
.app-page .v2-page { min-width:0; max-width:100%; overflow-wrap:anywhere; }
.app-page img { display:block; height:auto; max-width:100%; }
.app-page pre { max-width:100%; overflow:auto; white-space:pre-wrap; }
.app-page table { display:table; min-width:100%; table-layout:auto; }
.app-page table td { overflow-wrap:anywhere; }
.app-page .v2-table-scroll { max-width:100%; overflow-x:auto; }
.app-page .v2-table-scroll table { min-width:920px; }

/* A collapsed sidebar remains a useful icon rail: the logo and every icon
   share the same visual centre. */
.v2-sidebar:has(+ .v2-app-frame.v2-sidebar-collapsed) { align-items:stretch; }
.v2-sidebar:has(+ .v2-app-frame.v2-sidebar-collapsed) .app-brand { justify-content:center; margin-inline:0; }
.v2-sidebar:has(+ .v2-app-frame.v2-sidebar-collapsed) .app-brand img { margin-inline:auto; }
.v2-sidebar:has(+ .v2-app-frame.v2-sidebar-collapsed) nav { width:100%; }
.v2-sidebar:has(+ .v2-app-frame.v2-sidebar-collapsed) .app-nav-link { justify-content:center; width:100%; }

/* Branding previews use fixed presentation frames so oversized uploads never
   expand a card or distort the surrounding layout. */
.branding-page { max-width:var(--content); }
.branding-intro { color:var(--muted); max-width:760px; }
.branding-upload-card,
.branding-assets-card { margin-top:22px; }
.branding-upload-card form { margin-bottom:0; max-width:720px; }
.branding-section-heading,
.branding-asset-heading { align-items:start; display:flex; gap:16px; justify-content:space-between; }
.branding-section-heading h2,
.branding-asset-heading h3 { margin-top:0; }
.branding-section-heading > .help-text { margin:0; max-width:360px; text-align:right; }
.branding-assets-grid { display:grid; gap:18px; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
.branding-asset-item { background:var(--surface-raised); border:1px solid var(--border); border-radius:6px; margin:0; min-width:0; padding:18px; }
.branding-asset-heading h3 { font-size:1rem; margin-bottom:4px; }
.branding-asset-heading .badge { flex:0 0 auto; }
.help-text { color:var(--muted); font-size:.9rem; }
.branding-preview { align-items:center; background:var(--surface-subtle); border:1px solid var(--border); border-radius:5px; display:flex; justify-content:center; margin:14px 0; max-width:100%; overflow:hidden; padding:10px; }
.branding-preview img { max-height:100%; max-width:100%; object-fit:contain; }
.branding-preview-logo { aspect-ratio:1; max-width:180px; width:100%; }
.branding-preview-logo img { height:100%; width:100%; }
.branding-preview-hero,
.branding-preview-banner { aspect-ratio:16 / 5; width:100%; }
.branding-preview-hero img,
.branding-preview-banner img { height:100%; object-fit:cover; width:100%; }
.branding-preview-login { aspect-ratio:16 / 10; width:100%; }
.branding-preview-login img { height:100%; width:100%; }
.branding-preview-empty { color:var(--muted); min-height:100px; text-align:center; }
.branding-asset-meta { display:grid; gap:6px 12px; grid-template-columns:auto 1fr; margin:0 0 12px; }
.branding-asset-meta dt { color:var(--muted); font-weight:600; }
.branding-asset-meta dd { margin:0; }

@media (max-width:720px) {
  .branding-section-heading { display:block; }
  .branding-section-heading > .help-text { margin-top:8px; text-align:left; }
}
