/* SHARED by both front ends (Wave A split, 2026-09-30; ARCHITECTURE.md): the company dashboard (sentinel/public)
   and the training school (school/public) load this one stylesheet from /assets/. The name is historical, like the
   backend folder. Tokens, the SCCS Sentinel page kit, both shells and the course pages live here. */
@font-face{font-family:Inter;src:url('/assets/fonts/Inter-latin.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
/* =============================================================================================
   DSP Sentinel design tokens (2026-09-29). The ONLY place in this file with literal colours
   (school/tests/theme.test.mjs enforces it). Four designs share these names:
     sentinel = assets/themes/sentinel.css (SCCS Sentinel, Bill Prata's look; the default since 2026-09-30)
     light  = the values below (the DSP design; also used for print)
     dark   = assets/themes/dark.css    } redefine tokens under :root[data-theme="<name>"]
     lcars  = assets/themes/lcars.css   } (0,2,0 specificity: wins whatever the load order)
   html[data-theme] is set before first paint by assets/theme-boot.js (localStorage
   "dsp-sentinel-theme", or ?theme=light|dark|lcars). Theme stylesheets load media="screen".
   --accent / --accent-ink are the TENANT brand colour, set inline on <html> by applyBrand()
   from School settings (DSP yellow, Northstar purple). Inline wins over every theme: use them
   for the current navigation item and primary actions; never redefine them in a theme.
   ============================================================================================= */
:root{
  /* Core tokens: every theme defines these. */
  /* page and surfaces */
  --bg:#f5f5ef;               /* page background */
  --surface:#fff;             /* panels, cards, tiles, dialogs, lesson pages */
  --surface-2:#e9ecdf;        /* tinted panel: review note, course card header */
  --surface-sunken:#eef0e6;   /* recessed strip: review bar, empty-state icon */
  --surface-hover:#f0f2e9;    /* hover on a light control */
  --surface-selected:#ebefdf; /* selected item on a surface (current lesson step) */
  --logo-bg:#f5f5ef;          /* plate behind the DSP logo (the logo artwork is dark ink) */
  /* text */
  --text:#1d1d1b;
  --text-soft:#4b5543;        /* long reading text */
  --text-muted:#666b61;       /* secondary text, labels, captions */
  --text-subtle:#7b8b63;      /* decorative icons and markers; not for text */
  --link:currentColor;        /* links take their text colour and are underlined */
  /* lines */
  --line:#dce0d4;
  --line-strong:#818977;      /* input borders: >= 3:1 on white, the page and the sunken strip (WCAG 1.4.11; was #b9c0af, 1.87:1) */
  /* focus and controls */
  --focus:#68791b;
  --focus-inverse:var(--accent); /* focus ring inside the navigation sidebar */
  --control-accent:#3f622f;   /* native radio / checkbox accent-color */
  --input-bg:#fff;
  /* default button (ink); .button.primary uses --accent / --accent-ink */
  --button-bg:#1d1d1b;
  --button-text:#fff;
  --button-hover:#383d30;
  /* navigation shell */
  --sidebar-bg:#1d1d1b;
  --sidebar-text:#e9ece3;
  --sidebar-muted:#9fa894;
  --sidebar-hover:#2c3327;
  --sidebar-line:#42483c;
  --topbar-bg:rgba(255,255,255,.93);
  /* inverse panels: sign-in story, welcome card, toast */
  --inverse-bg:#1d1d1b;
  --inverse-text:#f5f5ef;
  --inverse-muted:#bcc3b2;
  --inverse-line:#4c5245;
  /* tones: .badge.tone-*, tiles, notes, results (bg + fg + border) */
  --tone-ok-bg:#e7f0e4;    --tone-ok-fg:#3b6532;    --tone-ok-border:#d8e3cb;
  --tone-warn-bg:#fff3d5;  --tone-warn-fg:#866217;  --tone-warn-border:#ead9b6;
  --tone-bad-bg:#fbe4e0;   --tone-bad-fg:#8a2b20;   --tone-bad-border:#e5bcb5;
  --tone-info-bg:#edf1f7;  --tone-info-fg:#3b5e82;  --tone-info-border:#c9d6e6;
  --tone-muted-bg:#f0f1ec; --tone-muted-fg:#656c5d; --tone-muted-border:#dce0d4;
  /* depth and overlays */
  --shadow:0 20px 80px #0003;        /* dialogs */
  --shadow-toast:0 4px 25px #0002;
  --shadow-drawer:10px 0 70px #0004; /* phone navigation drawer */
  --backdrop:#17210bb3;              /* dialog backdrop */
  --shade:#17210b66;                 /* behind the phone navigation drawer */
  /* shape and type */
  --radius:5px;
  --radius-sm:3px;
  --sidebar:245px;
  /* 中文 (2026-10-13): none of the designs' fonts has Chinese characters, so every stack names good Chinese system fonts
     before the generic family (macOS/iOS, Windows, Android/Linux): Latin text keeps its font, Chinese finds one. */
  --font-body:Inter,Arial,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC","Noto Sans CJK SC","Source Han Sans SC",sans-serif;
  --font-display:Inter,Arial,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC","Noto Sans CJK SC","Source Han Sans SC",sans-serif; /* headings and big numbers */
  --font-mono:monospace,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC","Noto Sans CJK SC","Source Han Sans SC"; /* small uppercase labels */
  /* tenant brand defaults (replaced inline by applyBrand) */
  --accent:#ffed00;
  --accent-ink:#1d1d1b;
  /* legacy names used by module CSS; they follow the semantic tokens in every theme */
  --ink:var(--text);
  --paper:var(--bg);
  --white:var(--surface);
  --muted:var(--text-muted);

  /* Detail tokens: the exact light-design tints. In dark and LCARS they fall back to the core
     tokens (next block), so a theme only has to define the core set; it may still set any. */
  --green:#38613b; --red:#a02e26;
  --button-border:#1d1d1b; --button-secondary-bg:#fff; --button-secondary-border:#bdc4b4;
  --sidebar-brand-word:#c0c7b6; --sidebar-link:#c5ccbb; --sidebar-strong:#fff;
  --sidebar-school-text:#c1c8b6; --sidebar-school-label:#969f8a; --sidebar-school-link:#bfc8b4;
  --sidebar-footnote:#89937e; --sidebar-close-border:#646c59;
  --inverse-soft:#c7cdbe; --inverse-subtle:#99a48a; --welcome-eyebrow:#ccd5be; --welcome-text:#c0c9b1; --toast-text:#fff;
  --avatar-bg:#e7eada; --review-bar-text:#5c6550; --review-bar-line:#e0e4d6; --review-dot:#778754; --review-note-border:#6f7f55;
  --badge-bg:#eaede2; --badge-fg:#59644c; --badge-assigned-bg:#edf0e7; --badge-assigned-fg:#57654d;
  --badge-needs-bg:#fff0e4; --badge-needs-fg:#895324;
  --badge-pilot-bg:#f2f1e9; --badge-pilot-fg:#706a4b; --badge-pilot-border:#e5e1cc;
  --badge-draft-bg:#fff6c7; --badge-draft-fg:#6b5a0c; --badge-draft-border:#eadb8b;
  --stat-icon:#7e8b6d; --progress-track:#e8ecdf; --progress-fill:#758857; --progress-done:#5c7c43; --activity-dot:#84976a;
  --error-bg:#fff0ed; --error-fg:#812c24;
  --note-bg:#eef2e7; --note-border:#809268; --note-fg:#546248;
  --note-warn-bg:#fff7e5; --note-warn-border:#b18b31; --note-warn-fg:#7b6127;
  --card-top-text:#59654d; --line-soft:#e8ebdf; --nav-hover:#f1f4e9; --step-border:#bac5ab; --step-text:#617052;
  --option-checked-bg:#f0f4e9; --option-checked-border:#758f57;
  --completion-bg:#e6efdc; --completion-fg:#55723c;
  --result-ok-bg:#edf3e6; --result-warn-bg:#fff5e7; --result-text:#59644e;
  --history-bg:#f2f4ed; --history-text:#4d5940;
  --narration-bg:#f4f6ee; --narration-border:#e1e6d6; --narration-note-border:#d6dcc8; --marker:#8a9a6c;
  --practical-bg:#fbfbf7; --tile-hover-border:#b9c2a9; --drop-border:#b8c0a8; --drop-bg:#fafbf6;

  /* SCCS Sentinel shell + page kit (2026-09-30; SENTINEL-LAYOUT.md). themes/sentinel.css sets Bill Prata's
     exact values; dark and LCARS follow the fallbacks in the next block unless they set their own. */
  --accent-strong:#1d1d1b;     /* tenant colour darkened to >= 5.2:1 on white: eyebrows, AI button (applyBrand) */
  --accent-bright:#ffed00;     /* tenant colour lifted to >= 5.2:1 on the dark navigation (applyBrand) */
  --kit-accent-text:var(--accent-strong);
  --kit-card-bg:var(--surface);
  --kit-card-border:var(--line);
  --kit-radius:var(--radius);
  --kit-radius-lg:var(--radius);
  --kit-shadow:none;
  --kit-navy:#1d1d1b;          /* selected tabs, Near Miss pill, current month */
  --kit-navy-ink:#fff;
  --kit-tint-bg:color-mix(in srgb,var(--accent) 11%,var(--surface));
  --kit-tint-border:color-mix(in srgb,var(--accent) 40%,var(--surface));
  --kit-bar-track:var(--progress-track);
  --kit-bar-fill:var(--accent);
  --kit-head-bg:var(--surface-sunken);
  --kit-topbar-bg:var(--sidebar-bg);
  --kit-topbar-text:var(--sidebar-text);
  --kit-topbar-muted:var(--sidebar-muted);
  --kit-focus-ring:0 0 0 3px color-mix(in srgb,var(--accent) 26%,transparent);
  --kit-max:1100px;
  --chart-1:var(--accent); --chart-2:#1d1d1b; --chart-3:#58728e; --chart-4:#9aa8b6; --chart-5:#d1d8df;
  /* First paint of the dark designs (2026-10-01): their page and text colours, used only until the design's own sheet
     has loaded (see the :where() block after this one). */
  --boot-dark-bg:#121310; --boot-dark-text:#ecede6; --boot-lcars-bg:#080a0d; --boot-lcars-text:#e4e8eb;
;--media-letterbox:#000}
/* No light flash before a dark design's stylesheet arrives: theme-boot.js loads it render-blocking, but a browser that
   ignores blocking="render" could paint the light page first. The page and text colours of Dark and LCARS are known
   here; :where() keeps these at :root specificity, so the theme sheet's own :root[data-theme] values win once loaded. */
@media screen{:root:where([data-theme="dark"]){--bg:var(--boot-dark-bg);--text:var(--boot-dark-text)}
:root:where([data-theme="lcars"]){--bg:var(--boot-lcars-bg);--text:var(--boot-lcars-text)}}
/* Non-light themes on screen: detail tokens follow the core tokens unless the theme sets them.
   :root:where(...) has the specificity of :root, so it overrides the light tints by order, while
   a theme's :root[data-theme="<name>"] still wins. Print keeps the light design (media="screen"). */
@media screen{:root:where([data-theme]:not([data-theme="light"])){
  --green:var(--tone-ok-fg); --red:var(--tone-bad-fg);
  --button-border:var(--button-bg); --button-secondary-bg:var(--surface); --button-secondary-border:var(--line-strong);
  --sidebar-brand-word:var(--sidebar-muted); --sidebar-link:var(--sidebar-text); --sidebar-strong:var(--sidebar-text);
  --sidebar-school-text:var(--sidebar-text); --sidebar-school-label:var(--sidebar-muted); --sidebar-school-link:var(--sidebar-text);
  --sidebar-footnote:var(--sidebar-muted); --sidebar-close-border:var(--sidebar-line);
  --inverse-soft:var(--inverse-muted); --inverse-subtle:var(--inverse-muted); --welcome-eyebrow:var(--inverse-muted); --welcome-text:var(--inverse-muted); --toast-text:var(--inverse-text);
  --avatar-bg:var(--surface-2); --review-bar-text:var(--text-muted); --review-bar-line:var(--line); --review-dot:var(--text-subtle); --review-note-border:var(--text-subtle);
  --badge-bg:var(--tone-muted-bg); --badge-fg:var(--tone-muted-fg); --badge-assigned-bg:var(--tone-muted-bg); --badge-assigned-fg:var(--tone-muted-fg);
  --badge-needs-bg:var(--tone-warn-bg); --badge-needs-fg:var(--tone-warn-fg);
  --badge-pilot-bg:var(--tone-muted-bg); --badge-pilot-fg:var(--tone-muted-fg); --badge-pilot-border:var(--tone-muted-border);
  --badge-draft-bg:var(--tone-warn-bg); --badge-draft-fg:var(--tone-warn-fg); --badge-draft-border:var(--tone-warn-border);
  --stat-icon:var(--text-subtle); --progress-track:var(--surface-sunken); --progress-fill:var(--tone-ok-fg); --progress-done:var(--tone-ok-fg); --activity-dot:var(--text-subtle);
  --error-bg:var(--tone-bad-bg); --error-fg:var(--tone-bad-fg);
  --note-bg:var(--surface-2); --note-border:var(--text-subtle); --note-fg:var(--text-soft);
  --note-warn-bg:var(--tone-warn-bg); --note-warn-border:var(--tone-warn-fg); --note-warn-fg:var(--tone-warn-fg);
  --card-top-text:var(--text-muted); --line-soft:var(--line); --nav-hover:var(--surface-hover); --step-border:var(--line-strong); --step-text:var(--text-muted);
  --option-checked-bg:var(--surface-selected); --option-checked-border:var(--tone-ok-fg);
  --completion-bg:var(--tone-ok-bg); --completion-fg:var(--tone-ok-fg);
  --result-ok-bg:var(--tone-ok-bg); --result-warn-bg:var(--tone-warn-bg); --result-text:var(--text-soft);
  --history-bg:var(--surface-sunken); --history-text:var(--text-soft);
  --narration-bg:var(--surface-sunken); --narration-border:var(--line); --narration-note-border:var(--line-strong); --marker:var(--text-subtle);
  --practical-bg:var(--surface); --tile-hover-border:var(--line-strong); --drop-border:var(--line-strong); --drop-bg:var(--surface-sunken);
  --kit-accent-text:var(--accent-bright); --kit-navy:var(--button-bg); --kit-navy-ink:var(--button-text); --chart-2:var(--tone-info-fg);
}}
*{box-sizing:border-box}body{margin:0;font:14px/1.6 var(--font-body);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}h1,h2,h3,p{margin:0}h1,h2,h3{line-height:1.15;letter-spacing:-.04em;font-weight:620;font-family:var(--font-display)}h1{font-size:clamp(31px,3.3vw,46px)}h2{font-size:25px}h3{font-size:19px}a{color:var(--link);text-underline-offset:4px}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}input,select,textarea{min-width:0;width:100%;padding:11px 12px;background:var(--input-bg);border:1px solid var(--line-strong);border-radius:var(--radius-sm);color:var(--text);min-height:44px}textarea{min-height:100px;resize:vertical}label{display:block;font-weight:600;font-size:12px;margin-bottom:7px}input[type=radio]{width:18px;min-height:18px;height:18px;accent-color:var(--control-accent);flex:none;margin:0}input[type=color]{height:46px;padding:4px;max-width:110px}fieldset{padding:0;margin:0;border:0;min-width:0}legend{padding:0;font-weight:600;margin-bottom:12px}img,svg{max-width:100%}[hidden]{display:none!important}:focus-visible{outline:3px solid var(--focus);outline-offset:4px}.sidebar :focus-visible{outline-color:var(--focus-inverse)}::selection{background:var(--accent);color:var(--accent-ink)}.skip-link{position:fixed;left:20px;top:-80px;z-index:100;background:var(--accent);color:var(--accent-ink);padding:13px 18px}.skip-link:focus{top:10px}.button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:11px 17px;border:1px solid var(--button-border);border-radius:var(--radius-sm);font-size:12px;font-weight:650;line-height:1.4;text-decoration:none;background:var(--button-bg);color:var(--button-text)}.button:hover{background:var(--button-hover)}.button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.button.primary:hover{filter:brightness(.95)}.button.secondary{background:var(--button-secondary-bg);color:var(--text);border-color:var(--button-secondary-border)}.button.secondary:hover{background:var(--surface-hover)}.button.small{min-height:36px;padding:7px 12px;font-size:11px}.button.quiet{background:none;color:var(--text);border-color:transparent}.button svg,.icon-button svg{width:17px;height:17px}.icon-button{display:inline-grid;place-items:center;min-width:40px;min-height:40px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface);color:var(--text)}.text-button{background:none;border:0;padding:7px 0;color:var(--text);font-size:12px;font-weight:650;text-decoration:underline;text-underline-offset:4px}.eyebrow{font-size:10px;line-height:1.5;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--text-muted);margin-bottom:12px}.muted{color:var(--text-muted)}.small{font-size:12px}.fine{font-size:11px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.initial-loading{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:25px;text-align:center}.initial-loading h1{font-size:30px}.loader{display:inline-block;width:28px;height:28px;border:2px solid var(--line);border-top-color:var(--text);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-panel{padding:65px 25px;display:flex;align-items:center;justify-content:center;gap:15px}.no-script{position:fixed;inset:auto 20px 20px;background:var(--surface);border:1px solid var(--line);padding:25px;z-index:100}.no-script p{margin-top:10px}
.login-shell{min-height:100vh;display:grid;grid-template-columns:57fr 43fr;background:var(--bg)}.login-story{background:var(--inverse-bg);color:var(--inverse-text);padding:clamp(30px,3.6vw,52px) clamp(30px,4.4vw,68px) clamp(26px,3vw,40px);display:flex;flex-direction:column;position:relative;overflow:hidden}.login-wordmark{display:flex;align-items:center;gap:12px;font:700 18px/1.2 var(--font-display);letter-spacing:-.01em;color:var(--inverse-text)}.login-pitch{margin:auto 0;padding:56px 0 48px}.login-kicker{margin:0 0 18px;font:600 12px/1.5 var(--font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--accent-bright)}.login-headline{font-size:clamp(34px,3.1vw,46px);line-height:1.08;max-width:8.2em;margin:0 0 22px;color:var(--inverse-text)}.login-lede{color:var(--inverse-muted);max-width:32em;font-size:15px;line-height:1.65}.login-points{list-style:none;margin:0;padding:22px 0 0;border-top:1px solid var(--inverse-line);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.login-points strong{display:block;font-size:13px;font-weight:600;color:var(--inverse-text)}.login-points span{display:block;margin-top:3px;font-size:12px;line-height:1.5;color:var(--inverse-muted)}.login-content{padding:48px clamp(24px,4vw,64px);display:flex;flex-direction:column;align-items:center;justify-content:center}.login-card{width:100%;max-width:420px;padding:34px 32px 28px;background:var(--kit-card-bg);border:1px solid var(--kit-card-border);border-radius:var(--kit-radius-lg);box-shadow:var(--kit-shadow)}.login-card-brand{display:none}.login-card h1{font-size:30px;margin:0 0 10px}.login-note{color:var(--text-muted);font-size:13px;line-height:1.6;margin:0 0 22px}.login-card>.error-box{margin-bottom:18px}.login-more{margin-top:24px;padding-top:18px;border-top:1px solid var(--line);font-size:13px}.login-more .fine{margin-top:12px;color:var(--text-muted)}.login-footer{max-width:420px;margin-top:20px;text-align:center;font-size:12px;line-height:1.5;color:var(--text-muted)}.login-edition{max-width:420px;margin-top:6px;text-align:center;font-size:11px;color:var(--text-muted)}.review-note{background:var(--surface-2);padding:14px 16px;font-size:11px;line-height:1.65;border-left:3px solid var(--review-note-border);margin-bottom:25px}.login-card .button{width:100%;margin-top:18px}.school-links{display:flex;gap:18px;flex-wrap:wrap;margin-top:8px}.school-links a{font-size:11px;color:var(--text-muted)}.tenant-monogram{width:49px;height:49px;display:grid;place-items:center;background:var(--accent);color:var(--accent-ink);font-weight:700;letter-spacing:-.05em;font-size:19px}
.app-shell{padding-left:var(--sidebar);min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar);background:var(--sidebar-bg);color:var(--sidebar-text);display:flex;flex-direction:column;z-index:30;padding:27px 20px}.sidebar-brand{display:flex;align-items:center;gap:11px;text-decoration:none;min-height:63px;margin-bottom:33px}.sidebar-brand .logo-box{background:var(--logo-bg);padding:5px 9px;width:125px;flex:none}.sidebar-brand img{display:block;width:108px;height:auto}.sidebar-brand .school-word{display:block;font:10px/1.4 var(--font-mono);color:var(--sidebar-brand-word);letter-spacing:.12em;text-transform:uppercase;margin-top:10px}.sidebar-brand strong{font-weight:600;font-size:15px;line-height:1.25;display:block}.sidebar-brand .tenant-monogram{width:40px;height:40px;flex:none;font-size:15px}.sidebar-label{font:9px/1.5 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--sidebar-muted);margin-bottom:12px;padding-left:12px}.side-nav{display:grid;gap:5px}.side-nav a{display:flex;align-items:center;gap:12px;padding:12px 13px;color:var(--sidebar-link);font-weight:550;font-size:12px;text-decoration:none;border-radius:var(--radius-sm)}.side-nav a svg{width:18px;height:18px;flex:none}.side-nav a:hover{background:var(--sidebar-hover);color:var(--sidebar-strong)}.side-nav a[aria-current=page]{background:var(--accent);color:var(--accent-ink)}.side-nav .nav-count{margin-left:auto;font-size:10px;min-width:20px;text-align:center;border:1px solid currentColor;border-radius:10px;line-height:18px}.sidebar-bottom{margin-top:auto;padding-top:30px}.sidebar-school{padding:17px 12px;border-top:1px solid var(--sidebar-line)}.sidebar-school p{font-size:11px;color:var(--sidebar-school-text);overflow-wrap:anywhere}.sidebar-school .eyebrow{color:var(--sidebar-school-label);font-size:9px;margin-bottom:7px}.sidebar-school .school-links{gap:9px}.sidebar-school .school-links a{color:var(--sidebar-school-link);font-size:10px}.sidebar-footnote{font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--sidebar-footnote);padding:10px 12px 0}.topbar{min-height:88px;background:var(--topbar-bg);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 38px}.topbar-trail{font-size:12px;color:var(--text-muted);display:flex;align-items:center;gap:9px}.topbar-trail strong{color:var(--text);font-weight:550}.session-person{display:flex;align-items:center;gap:11px}.avatar{height:36px;width:36px;flex:none;background:var(--avatar-bg);display:grid;place-items:center;border-radius:50%;font-size:11px;font-weight:650}.session-person p{font-size:11px;line-height:1.35;font-weight:600}.session-person span{display:block;color:var(--text-muted);font-size:10px;margin-top:4px}.session-person .text-button{font-size:10px;margin-left:12px}.mobile-toggle{display:none}.review-bar{padding:9px 38px;background:var(--surface-sunken);display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:10px;color:var(--review-bar-text);border-bottom:1px solid var(--review-bar-line)}.review-bar strong{font-weight:650}.review-dot{width:5px;height:5px;display:inline-block;background:var(--review-dot);border-radius:50%;margin-right:7px}.workspace{padding:40px 38px 70px;max-width:1560px;margin:auto}.page-heading{display:flex;align-items:end;justify-content:space-between;gap:28px;margin-bottom:32px}.page-heading p{color:var(--text-muted);font-size:13px;max-width:650px;margin-top:15px}.page-heading .eyebrow{margin:0 0 11px;font-size:10px}.heading-actions{display:flex;gap:10px;flex-wrap:wrap}.badge{display:inline-flex;align-items:center;gap:5px;font-size:10px;line-height:1.4;padding:5px 8px;border-radius:var(--radius-sm);background:var(--badge-bg);color:var(--badge-fg);font-weight:600;white-space:normal}.badge.assigned{background:var(--badge-assigned-bg);color:var(--badge-assigned-fg)}.badge.in_progress{background:var(--tone-info-bg);color:var(--tone-info-fg)}.badge.awaiting_practical{background:var(--tone-warn-bg);color:var(--tone-warn-fg)}.badge.completed{background:var(--tone-ok-bg);color:var(--tone-ok-fg)}.badge.needs_practice{background:var(--badge-needs-bg);color:var(--badge-needs-fg)}.badge.pilot{background:var(--badge-pilot-bg);color:var(--badge-pilot-fg);border:1px solid var(--badge-pilot-border)}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:17px;margin-bottom:30px}.stat{background:var(--surface);padding:23px;border:1px solid var(--line);border-radius:var(--radius)}.stat-label{font-size:11px;color:var(--text-muted);display:flex;align-items:center;justify-content:space-between;gap:8px}.stat-label svg{width:16px;height:16px;color:var(--stat-icon)}.stat-value{font-size:37px;letter-spacing:-.065em;line-height:1.15;margin:16px 0 10px;font-weight:550;font-family:var(--font-display)}.stat-note{font-size:10px;color:var(--text-muted)}.dashboard-grid{display:grid;grid-template-columns:1.65fr 1fr;gap:23px}.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:25px;min-width:0}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:23px}.panel-head h2{font-size:19px}.panel-head a{font-size:11px}.panel-intro{font-size:12px;color:var(--text-muted);margin:-10px 0 22px}.stack{display:grid;gap:20px}.assignment-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;padding:18px 0;border-top:1px solid var(--line)}.assignment-row:first-child{border-top:0;padding-top:0}.assignment-row h3{font-size:15px;letter-spacing:-.025em;line-height:1.4;margin-bottom:7px}.assignment-row p{font-size:11px;color:var(--text-muted)}.assignment-row .button{align-self:center}.progress{height:5px;background:var(--progress-track);border-radius:5px;overflow:hidden;margin-top:13px}.progress>span{display:block;height:100%;background:var(--progress-fill)}.progress-label{display:flex;justify-content:space-between;gap:12px;font-size:10px;color:var(--text-muted);margin-top:7px}.progress[data-complete=true]>span{background:var(--progress-done)}.welcome-card{background:var(--inverse-bg);color:var(--inverse-text);padding:30px;border-radius:var(--radius);position:relative;overflow:hidden}.welcome-card .eyebrow{color:var(--welcome-eyebrow)}.welcome-card h2{font-size:29px;max-width:510px}.welcome-card p{color:var(--welcome-text);font-size:12px;max-width:500px;margin:17px 0 24px}.welcome-card .button{margin-top:0}.activity-list{list-style:none;padding:0;margin:0}.activity-list li{display:grid;grid-template-columns:7px 1fr;gap:13px;padding:11px 0}.activity-list li:before{content:'';width:6px;height:6px;border-radius:50%;background:var(--activity-dot);margin-top:6px}.activity-list p{font-size:11px;line-height:1.5}.activity-list small{font-size:10px;color:var(--text-muted)}.scope-note{font-size:11px;color:var(--text-muted);padding:18px 0 0}.empty{padding:28px 5px;text-align:center;color:var(--text-muted)}.empty h2,.empty h3{color:var(--text);font-size:20px;margin-bottom:10px}.empty p{font-size:12px;max-width:470px;margin:0 auto}.empty .button{margin-top:20px}.empty-icon{display:inline-grid;place-items:center;width:48px;height:48px;background:var(--surface-sunken);color:var(--text-subtle);border-radius:50%;margin-bottom:17px}.empty-icon svg{width:21px;height:21px}.error-box{background:var(--error-bg);border:1px solid var(--tone-bad-border);color:var(--error-fg);padding:13px 16px;border-radius:var(--radius-sm);font-size:12px;line-height:1.6}.error-box .button{margin-top:12px}.error-box:empty{display:none}.inline-info{padding:14px 17px;background:var(--note-bg);border-left:3px solid var(--note-border);font-size:11px;color:var(--note-fg);margin:22px 0}.inline-info.warning{background:var(--note-warn-bg);border-color:var(--note-warn-border);color:var(--note-warn-fg)}.section-title{margin:35px 0 19px;font-size:23px}.card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:23px}.course-card{display:flex;flex-direction:column;min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.course-card-top{padding:22px 25px;background:var(--surface-2);display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:10px;color:var(--card-top-text)}.course-card-top svg{width:24px;height:24px}.course-card-body{padding:25px;display:flex;flex-direction:column;flex:1}.course-card h2{font-size:23px;margin-bottom:15px}.course-card p{font-size:12px;color:var(--text-muted);margin-bottom:22px}.course-meta{display:flex;gap:9px 20px;flex-wrap:wrap;font-size:10px;color:var(--text-muted);padding-top:18px;border-top:1px solid var(--line);margin-top:auto}.course-card-actions{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-top:24px}.course-card-actions .badge{font-size:9px}.table-wrap{position:relative;overflow-x:auto;width:100%}table{border-collapse:collapse;width:100%;font-size:12px;text-align:left}th{font-size:9px;color:var(--text-muted);letter-spacing:.08em;text-transform:uppercase;padding:12px 14px;border-bottom:1px solid var(--line);font-weight:650;white-space:nowrap}td{padding:17px 14px;border-bottom:1px solid var(--line-soft);vertical-align:middle}tbody tr:last-child td{border-bottom:0}td:first-child,th:first-child{padding-left:0}td:last-child,th:last-child{padding-right:0}td strong{font-weight:600;font-size:12px;display:block;line-height:1.4}td small{font-size:10px;color:var(--text-muted);display:block;line-height:1.5;margin-top:4px}.table-person{display:flex;align-items:center;gap:12px}.table-person .avatar{width:31px;height:31px;font-size:9px}.table-action{white-space:nowrap}.toolbar{display:flex;gap:15px;align-items:end;justify-content:space-between;margin-bottom:23px;flex-wrap:wrap}.toolbar .field{min-width:160px;max-width:270px}.toolbar .field input,.toolbar .field select{font-size:12px;min-height:40px;padding:9px 11px}.toolbar p{font-size:11px;color:var(--text-muted);margin-bottom:10px}.organization-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.organization-card{border:1px solid var(--line);padding:22px;background:var(--surface)}.organization-card h3{font-size:17px;margin-bottom:12px}.organization-card ul{margin:0;padding-left:17px;color:var(--text-muted);font-size:11px}.settings-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:23px;align-items:start}.form-fields{display:grid;gap:21px}.field .hint{font-size:10px;color:var(--text-muted);margin-top:7px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}.form-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:26px}.form-actions .button{min-width:110px}.details-list{margin:0}.details-list>div{display:flex;align-items:start;justify-content:space-between;gap:20px;padding:13px 0;border-bottom:1px solid var(--line);font-size:11px}.details-list dt{color:var(--text-muted)}.details-list dd{margin:0;font-weight:550;text-align:right;overflow-wrap:anywhere}.details-list>div:last-child{border:0}.licensing-note{font-size:12px;color:var(--text-muted);line-height:1.75;margin-top:16px}
.back-link{font-size:11px;text-decoration:none;color:var(--text-muted);display:inline-flex;align-items:center;gap:7px;margin-bottom:24px}.back-link svg{width:15px;height:15px}.assignment-heading{margin-bottom:26px}.assignment-heading h1{font-size:clamp(29px,3vw,42px);max-width:820px;margin:12px 0 17px}.assignment-meta{display:flex;gap:10px 20px;flex-wrap:wrap;color:var(--text-muted);font-size:11px}.learning-layout{display:grid;grid-template-columns:240px minmax(0,1fr);gap:25px;align-items:start}.lesson-nav{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:22px 15px}.lesson-nav h2{font-size:13px;letter-spacing:-.015em;margin:0 8px 16px}.lesson-nav button{width:100%;display:flex;text-align:left;gap:11px;align-items:start;background:none;border:0;padding:12px 10px;font-size:11px;line-height:1.5;color:var(--text-muted);border-radius:var(--radius-sm)}.lesson-nav button:hover{background:var(--nav-hover)}.lesson-nav button[aria-current=step]{background:var(--surface-selected);color:var(--text);font-weight:650}.lesson-nav button svg{width:15px;height:15px;flex:none;margin-top:1px}.lesson-nav .divider{height:1px;background:var(--line);margin:14px 8px}.step-number{display:grid;place-items:center;width:18px;height:18px;border:1px solid var(--step-border);border-radius:50%;font-size:9px;flex:none;color:var(--step-text)}.lesson-content{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:35px;min-width:0}.lesson-content .eyebrow{font-size:9px}.lesson-content h2{font-size:28px;line-height:1.25;margin-bottom:20px}.lesson-text{font-size:14px;line-height:1.9;color:var(--text-soft);max-width:730px}.lesson-text p+p{margin-top:19px}.lesson-footer{border-top:1px solid var(--line);margin-top:30px;padding-top:24px;display:flex;gap:20px;justify-content:space-between;align-items:center;flex-wrap:wrap}.lesson-footer p{font-size:11px;color:var(--text-muted);max-width:390px}.course-boundary{font-size:10px;color:var(--text-muted);margin:20px 0 0;line-height:1.75}.quiz-question{padding:5px 0 25px;margin-bottom:25px;border-top:0;border-bottom:1px solid var(--line)}.quiz-question:last-of-type{border-bottom:0;margin-bottom:0}.quiz-question:first-child{border-top:0;padding-top:5px}.quiz-question legend{font-size:14px;letter-spacing:-.02em}.quiz-option{display:flex;gap:12px;align-items:start;padding:13px;border:1px solid var(--line);margin:8px 0;border-radius:var(--radius-sm);font-size:12px;line-height:1.55;font-weight:450;cursor:pointer}.quiz-option:has(input:checked){border-color:var(--option-checked-border);background:var(--option-checked-bg)}.quiz-option input{margin-top:1px}.quiz-note{font-size:12px;color:var(--text-muted);margin-bottom:24px}.completion-mark{width:51px;height:51px;display:grid;place-items:center;background:var(--completion-bg);color:var(--completion-fg);border-radius:50%;margin-bottom:23px}.completion-mark svg{width:24px;height:24px}.result-summary{padding:22px 25px;background:var(--result-ok-bg);border:1px solid var(--tone-ok-border);border-radius:var(--radius-sm);margin-bottom:25px}.result-summary.needs-work{background:var(--result-warn-bg);border-color:var(--tone-warn-border)}.result-summary h3{font-size:18px;margin-bottom:9px}.result-summary p{font-size:12px;color:var(--result-text)}.record-history{list-style:none;padding:0;margin:23px 0 0}.record-history li{padding:17px 0;border-top:1px solid var(--line);font-size:12px}.record-history strong{display:block;font-size:12px;margin-bottom:5px}.record-history p{font-size:11px;color:var(--text-muted);line-height:1.7}.record-history .history-note{color:var(--history-text);background:var(--history-bg);padding:12px 15px;margin-top:12px;white-space:pre-wrap;overflow-wrap:anywhere}.dialog{padding:0;border:1px solid var(--line);border-radius:6px;width:550px;max-width:calc(100vw - 30px);max-height:calc(100dvh - 35px);overflow:auto;box-shadow:var(--shadow);background:var(--surface);color:var(--text)}.dialog::backdrop{background:var(--backdrop);backdrop-filter:blur(2px)}.dialog-inner{padding:30px}.dialog-head{display:flex;align-items:start;justify-content:space-between;gap:20px;margin-bottom:20px}.dialog-head h2{font-size:25px;margin-bottom:9px}.dialog-head p{color:var(--text-muted);font-size:12px;max-width:390px}.dialog .error-box{margin-top:18px}.toast{position:fixed;right:25px;bottom:25px;max-width:440px;background:var(--inverse-bg);color:var(--toast-text);border-left:4px solid var(--accent);padding:17px 22px;font-size:12px;line-height:1.6;z-index:90;box-shadow:var(--shadow-toast)}.screen-error{padding:50px;max-width:700px;margin:15vh auto}.screen-error h1{margin-bottom:20px}.screen-error p{margin-bottom:25px;color:var(--text-muted)}
@media(min-width:1650px){.workspace{padding-top:50px}.dashboard-grid{grid-template-columns:1.8fr 1fr}}@media(max-width:1180px){:root{--sidebar:218px}.sidebar{padding-inline:15px}.workspace{padding:32px 27px 60px}.topbar{padding-inline:27px}.review-bar{padding-inline:27px}.stat{padding:19px}.stat-grid{gap:12px}.stat-value{font-size:32px}.dashboard-grid{grid-template-columns:1fr}.dashboard-grid>.stack{grid-template-columns:1fr 1fr;align-items:start}.learning-layout{grid-template-columns:200px minmax(0,1fr);gap:20px}.lesson-content{padding:27px}.settings-grid{grid-template-columns:1fr}.login-content{padding:45px 32px}}
@media(max-width:850px){:root{--sidebar:0px}.sidebar{width:245px;transform:translateX(-100%);visibility:hidden;transition:transform .2s}.sidebar.is-open{transform:translateX(0);visibility:visible;box-shadow:var(--shadow-drawer)}.sidebar-close{display:inline-flex!important;position:absolute;right:15px;top:13px;border-color:var(--sidebar-close-border);color:var(--sidebar-strong);background:var(--sidebar-bg)}.sidebar-brand{margin-top:20px}.topbar{min-height:76px;padding:13px 24px}.topbar-trail{display:none}.mobile-toggle{display:inline-grid}.session-person .text-button{margin-left:5px}.workspace{padding:30px 24px 55px}.review-bar{padding-inline:24px;font-size:9px}.review-bar>span:last-child{display:none}.stat-grid{grid-template-columns:repeat(2,1fr);gap:15px}.stat-value{font-size:36px}.login-shell{display:flex;flex-direction:column}.login-content{order:-1;padding:32px 28px 36px}.login-card{max-width:540px}.login-card-brand{display:flex;align-items:center;gap:11px;margin:0 0 22px;font:700 17px/1.2 var(--font-display);color:var(--text)}.login-story .login-wordmark{display:none}.login-story{padding:36px 28px 32px}.login-pitch{margin:0;padding:0 0 28px}.login-headline{font-size:36px;max-width:12em}.login-footer,.login-edition{max-width:540px}.learning-layout{grid-template-columns:1fr}.lesson-nav{display:flex;flex-wrap:wrap;gap:5px;padding:15px}.lesson-nav h2{width:100%;margin:0 5px 8px}.lesson-nav button{width:auto;max-width:100%;flex:1 1 150px}.lesson-nav .divider{display:none}.page-heading{align-items:start}.organization-grid{grid-template-columns:1fr 1fr}.screen-error{padding:30px}.sidebar-shade{position:fixed;inset:0;background:var(--shade);z-index:25}}
@media(min-width:851px){.sidebar-close{display:none}.sidebar-shade{display:none!important}}
@media(max-width:580px){.workspace{padding:27px 18px 45px}.topbar{padding:12px 18px}.review-bar{padding-inline:18px;font-size:8px;line-height:1.6}.session-person .avatar{display:none}.session-person p{font-size:10px;max-width:130px;overflow-wrap:anywhere}.session-person span{font-size:9px}.session-person .text-button{font-size:9px;max-width:70px;line-height:1.4}.page-heading{display:block;margin-bottom:25px}.page-heading h1{font-size:33px}.page-heading p{font-size:12px;margin-top:12px}.heading-actions{margin-top:20px}.stat-grid{gap:10px;margin-bottom:23px}.stat{padding:16px}.stat-label{font-size:10px;line-height:1.4}.stat-label svg{display:none}.stat-value{font-size:31px;margin:13px 0 7px}.stat-note{font-size:9px;line-height:1.5}.panel{padding:20px}.dashboard-grid>.stack{grid-template-columns:1fr}.welcome-card{padding:25px}.welcome-card h2{font-size:26px}.panel-head{gap:15px}.panel-head h2{font-size:18px}.card-grid{grid-template-columns:1fr}.assignment-row{grid-template-columns:1fr;gap:12px}.assignment-row .button{justify-self:start}.course-card-body{padding:23px}.course-card h2{font-size:24px}.organization-grid{grid-template-columns:1fr}.form-row{grid-template-columns:1fr}.form-actions{flex-wrap:wrap}.form-actions .button{min-width:95px}.lesson-content{padding:23px 20px}.lesson-content h2{font-size:25px}.lesson-nav button{flex-basis:130px;font-size:10px}.lesson-text{font-size:13px}.assignment-heading h1{font-size:31px}.lesson-footer{display:block}.lesson-footer .button{margin-top:18px}.assignment-meta{font-size:10px;gap:8px 13px}.dialog-inner{padding:23px}.dialog-head h2{font-size:23px}.toast{left:18px;right:18px;bottom:18px;max-width:none;font-size:11px}.login-story{padding:30px 18px 28px}.login-headline{font-size:32px}.login-lede{font-size:14px}.login-points{grid-template-columns:1fr;gap:14px}.login-content{padding:22px 16px 30px}.login-card{padding:26px 20px 22px}.login-card h1{font-size:27px}.table-wrap{margin-inline:-2px;padding-inline:2px}table{min-width:520px}.table-wrap.compact table{min-width:420px}.details-list>div{gap:13px}.details-list dd{max-width:60%}.panel-head .button{font-size:10px;padding:8px 10px}.course-card-actions{flex-wrap:wrap}.school-links{gap:12px}.scope-note{font-size:10px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}
/* Draft course content: narration, structured lesson text and the practical task (2026-09-28). */
.badge.draft{background:var(--badge-draft-bg);color:var(--badge-draft-fg);border:1px solid var(--badge-draft-border)}
.narration{margin:0 0 28px;padding:18px 20px 20px;background:var(--narration-bg);border:1px solid var(--narration-border);border-radius:var(--radius);max-width:730px}
.narration-head{display:flex;align-items:center;gap:13px;margin-bottom:14px}.narration-head svg{width:38px;height:38px;padding:9px;flex:none;background:var(--accent);color:var(--accent-ink);border-radius:50%}
.narration-head strong{display:block;font-size:13px;font-weight:650;letter-spacing:-.01em}.narration-head span{display:block;font-size:11px;color:var(--text-muted);margin-top:2px}
.narration audio{display:block;width:100%;height:40px}
.narration-note{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--text-muted);background:var(--narration-bg);border:1px dashed var(--narration-note-border);padding:11px 14px;border-radius:var(--radius-sm);margin:0 0 24px;max-width:730px}.narration-note svg{width:17px;height:17px;flex:none;color:var(--text-subtle)}
.lesson-text h3{font-size:18px;letter-spacing:-.02em;color:var(--text);margin:30px 0 8px}.lesson-text h3:first-child{margin-top:0}
.lesson-text ul{margin:10px 0 0;padding-left:20px}.lesson-text li{padding-left:4px}.lesson-text li+li{margin-top:4px}.lesson-text li::marker{color:var(--marker)}
.lesson-text p+ul,.lesson-text ul+p,.lesson-text ul+ul{margin-top:12px}.lesson-text ul+p{margin-top:19px}
.practical-task{margin:0 0 26px;padding:20px 22px;border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:var(--radius-sm);background:var(--practical-bg)}
.practical-task .eyebrow{margin-bottom:8px}.practical-task h3{font-size:17px;margin-bottom:6px}.practical-task p{font-size:12px;color:var(--text-muted);margin-bottom:12px}
.practical-task ol{margin:0;padding-left:20px;font-size:12px;line-height:1.7;color:var(--text-soft)}.practical-task li+li{margin-top:4px}
@media(max-width:580px){.narration{padding:15px}.narration-head svg{width:34px;height:34px;padding:8px}.practical-task{padding:16px}}
/* DSP Sentinel module kit (2026-09-29): shared tones and building blocks for module screens. */
.badge.tone-ok{background:var(--tone-ok-bg);color:var(--tone-ok-fg)}.badge.tone-warn{background:var(--tone-warn-bg);color:var(--tone-warn-fg)}.badge.tone-bad{background:var(--tone-bad-bg);color:var(--tone-bad-fg)}.badge.tone-info{background:var(--tone-info-bg);color:var(--tone-info-fg)}.badge.tone-muted{background:var(--tone-muted-bg);color:var(--tone-muted-fg)}
.m-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:17px}.m-tile{display:block;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:20px;text-decoration:none;color:inherit}.m-tile:hover{border-color:var(--tile-hover-border)}.m-tile .m-tile-value{font-size:34px;letter-spacing:-.06em;font-weight:550;line-height:1.1;margin:10px 0 6px;font-family:var(--font-display)}.m-tile .m-tile-label{font-size:11px;color:var(--text-muted)}.m-tile.warn .m-tile-value{color:var(--tone-warn-fg)}.m-tile.bad .m-tile-value{color:var(--tone-bad-fg)}
.m-toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:end;margin-bottom:20px}.m-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:22px;border-bottom:1px solid var(--line)}.m-tabs a{padding:10px 13px;font-size:12px;text-decoration:none;color:var(--text-muted);border-bottom:2px solid transparent;margin-bottom:-1px}.m-tabs a[aria-current=page]{color:var(--text);border-color:var(--accent);font-weight:600}
.m-checklist{display:grid;gap:10px}.m-check{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;padding:14px 16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}.m-check .m-answers{display:flex;gap:6px}.m-check .m-answers label{min-width:54px;min-height:44px;display:grid;place-items:center;border:1px solid var(--line);border-radius:var(--radius-sm);font-size:12px;cursor:pointer}.m-check .m-answers input{position:absolute;opacity:0;pointer-events:none}.m-check .m-answers input:checked+span{font-weight:700}.m-check .m-answers label:has(input:checked){background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.m-photo{max-width:100%;height:auto;border:1px solid var(--line);border-radius:var(--radius-sm)}.m-file-drop{border:1px dashed var(--drop-border);padding:22px;text-align:center;border-radius:var(--radius);background:var(--drop-bg)}
@media (max-width:850px){.m-check{grid-template-columns:1fr}}
@media print{.sidebar,.topbar,.review-bar,.no-print{display:none!important}.app-shell{padding:0}.workspace{padding:0}}
/* DSP Sentinel designs (2026-09-29): the design switcher (assets/theme.js) and the LCARS hooks.
   The hooks are aria-hidden decoration placed by school.js; only themes/lcars.css shows them. */
.lcars-elbow,.lcars-bands,.lcars-code,.lcars-clock{display:none}
.theme-switch{display:inline-block;flex:none;max-width:100%}
.theme-switch-legend{font-size:12px;font-weight:600;margin-bottom:9px}
.theme-switch-options{display:inline-flex;flex-wrap:wrap;max-width:100%;gap:2px;padding:2px;background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--radius-sm)}
.theme-switch-option{position:relative;display:grid;place-items:center;min-width:44px;min-height:30px;margin:0;padding:4px 9px;border-radius:2px;font-size:10px;font-weight:650;line-height:1.2;letter-spacing:.02em;color:var(--text-muted);cursor:pointer;white-space:nowrap}
.theme-switch-option input{position:absolute;inset:0;width:100%;height:100%;min-height:0;margin:0;padding:0;border:0;opacity:0;cursor:pointer}
.theme-switch .theme-switch-option>span{display:inline;margin:0;color:inherit;font-size:inherit;line-height:inherit}
.theme-switch-option:hover{background:var(--surface-hover);color:var(--text)}
.theme-switch-option:has(input:checked){background:var(--text);color:var(--surface)}
.theme-switch-option:has(input:focus-visible){outline:3px solid var(--focus);outline-offset:2px;z-index:1}
.theme-switch--large .theme-switch-option{min-width:78px;min-height:44px;padding:8px 16px;font-size:12px}
.session-person .theme-switch{margin-right:8px}
.sidebar{overflow-y:auto;overscroll-behavior:contain} /* 13 navigation entries overflow a 768px-high iPad landscape screen */
.sidebar-theme{display:none;padding:0 12px 20px}
.sidebar .theme-switch{display:block;width:100%}.sidebar .theme-switch-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%}
.sidebar .theme-switch-option{flex:1 1 0;min-width:0;padding-inline:4px}
.sidebar .theme-switch-legend{font:9px/1.5 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--sidebar-school-label);margin-bottom:9px}
.sidebar .theme-switch-options{background:transparent;border-color:var(--sidebar-line)}
.sidebar .theme-switch-option{min-height:36px;color:var(--sidebar-text)}
.sidebar .theme-switch-option:hover{background:var(--sidebar-hover);color:var(--sidebar-strong)}
.sidebar .theme-switch-option:has(input:checked){background:var(--accent);color:var(--accent-ink)}
.sidebar .theme-switch-option:has(input:focus-visible){outline-color:var(--focus-inverse)}
.login-design{margin-top:22px;text-align:center}.login-design .theme-switch-legend{font-size:11px;font-weight:600;color:var(--text-muted);margin-bottom:7px}
.design-list{margin:14px 0 24px}
.design-list>div{display:block}
.design-list dt{color:var(--text);font-weight:650}
.design-list dd{text-align:left;font-weight:450;color:var(--text-muted);margin-top:3px;line-height:1.6}
/* Wide screens: the switch sits in the top bar beside the signed-in person. Tablets and phones: at the top of
   the navigation panel's footer (the top bar has no room there without wrapping the page trail). */
@media(max-width:1180px){.session-person .theme-switch{display:none}.sidebar-theme{display:block}}
@media print{html{color-scheme:light!important}.theme-switch,.login-design,.sidebar-theme{display:none!important}}
/* =============================================================================================
   SCCS Sentinel shell + page kit (2026-09-30). Contract: school/modules/SENTINEL-LAYOUT.md.
   The layout is the same in every design; designs only change the tokens (sentinel.css sets Bill
   Prata's exact values). Page agents build with these class names only.
   ============================================================================================= */
/* ---- shell: the sidebar on every view; the Dashboard (home) has no top bar, every other view has the dark top
   bar across the content column (Mike, 2026-09-30: "when I click one of the elements, it should not make it so
   that the dashboard menu items disappear. Everything should load within that right side."). The content column
   is the same box on every view (the Dashboard's), so nothing moves between pages. ---- */
.sn-shell .sidebar{padding:18px 12px 16px}
.sn-shell .sidebar>*{flex-shrink:0} /* the rail scrolls; its blocks never squash into each other */
@media(min-width:851px){.sn-shell[data-layout=home] .topbar{display:none}
}
.sn-brand{display:flex;align-items:center;gap:11px;min-height:0;margin:2px 6px 22px;text-decoration:none;color:var(--sidebar-strong)}
.sn-mark{display:inline-grid;place-items:center;width:34px;height:34px;flex:none;border-radius:9px;background:var(--accent);color:var(--accent-ink)}
.sn-mark svg{width:20px;height:20px}
img.sn-mark{object-fit:contain;background:var(--logo-bg)}
.sn-brand-text{min-width:0}
.sn-brand-text strong{display:block;font:700 16px/1.2 var(--font-display);letter-spacing:-.01em;color:var(--sidebar-strong)}
.sn-shell .sn-brand .school-word{margin-top:3px;letter-spacing:.1em}
/* User guide link (2026-09-30; Mike to Bill: "I'll put it at the top somewhere easy to get to."): under the brand in both
   apps' sidebars (the phone menu too) and under the card on both sign-in pages; opens /user-guide.html in a new tab. */
.sidebar-guide{display:flex;align-items:center;gap:10px;min-height:36px;margin:-10px 0 18px;padding:7px 12px;border:1px solid var(--sidebar-line);border-radius:var(--kit-radius);color:var(--sidebar-strong);font-size:13px;font-weight:600;line-height:1.3;text-decoration:none}
.sidebar-guide svg{width:17px;height:17px;flex:none}
.sidebar-guide>svg:last-of-type{width:14px;height:14px;margin-left:auto;color:var(--sidebar-muted)}
.sidebar-guide:hover{background:var(--sidebar-hover)}
.login-guide{display:inline-flex;align-items:center;gap:7px;margin-top:18px;padding:4px 2px;font-size:13px;font-weight:600;line-height:1.3;color:var(--kit-accent-text);text-decoration:none}
.login-guide svg{width:16px;height:16px;flex:none}
.login-guide>svg:last-of-type{width:13px;height:13px;color:var(--text-muted)}
.login-guide:hover span{text-decoration:underline;text-underline-offset:3px}
.sn-workspace{position:relative;margin:0 0 6px}
.sn-shell .sn-nav-label{margin:18px 0 7px;padding-left:12px}
.sn-shell .sn-workspace .sn-nav-label{margin-top:0}
.sn-client{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;min-height:40px;padding:8px 12px;border:1px solid var(--sidebar-line);border-radius:var(--kit-radius);background:var(--sidebar-hover);color:var(--sidebar-strong);font-size:13px;font-weight:600;line-height:1.3;text-align:left}
.sn-client>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sn-client svg{width:16px;height:16px;flex:none;color:var(--sidebar-muted)}
.sn-client.is-fixed{cursor:default}
.sn-client[aria-expanded=true] svg{transform:rotate(90deg)}
.sn-client-menu{position:absolute;left:0;right:0;top:100%;margin-top:4px;z-index:6;display:grid;gap:2px;padding:4px;background:var(--surface);border:1px solid var(--line);border-radius:var(--kit-radius);box-shadow:var(--shadow-toast)}
.sn-client-menu button{background:none;border:0;border-radius:var(--radius-sm);padding:9px 10px;text-align:left;color:var(--text);font-size:13px;line-height:1.35}
.sn-client-menu button:hover{background:var(--surface-hover)}
.sn-client-menu button[aria-pressed=true]{background:var(--surface-selected);font-weight:700}
.sn-client-menu button[aria-pressed=true]::after{content:" \2713"}
.sn-shell .side-nav{gap:2px}
.sn-shell .side-nav a{min-height:36px;padding:7px 12px;gap:11px;font-size:13px;line-height:1.3}
.sn-shell .side-nav a svg{width:17px;height:17px}
.sn-shell .sidebar-bottom{padding-top:22px}
.sn-user{display:flex;align-items:center;gap:10px;padding:14px 6px 4px;border-top:1px solid var(--sidebar-line)}
.sn-user .avatar{width:36px;height:36px;background:var(--accent);color:var(--accent-ink);font-size:12px}
.sn-user p{font-size:13px;font-weight:600;line-height:1.3;color:var(--sidebar-strong);overflow-wrap:anywhere}
.sn-user span{display:block;font-size:11px;color:var(--sidebar-muted);margin-top:2px}
.sn-shell .sn-switch{display:block;margin:4px 6px 14px;color:var(--sidebar-text);font-size:11px}
.sn-shell .sidebar-theme{display:block;padding:0 6px 16px}
/* Sidebar Design switcher: 2x2 grid in every design (LCARS is excluded: lcars.css already draws its own 2x2 pill grid). */
html:not([data-theme="lcars"]) .sn-sidebar .sidebar-theme .theme-switch-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:4px}
html:not([data-theme="lcars"]) .sn-sidebar .sidebar-theme .theme-switch-option{min-width:0;min-height:34px;padding:6px 8px;font-size:12.5px;letter-spacing:.01em}
.sn-topbar{position:sticky;top:0;z-index:20;min-height:56px;padding:8px 24px;gap:16px;background:var(--kit-topbar-bg);color:var(--kit-topbar-text);border-bottom:0}
.sn-shell .sn-trail{display:flex;align-items:center;gap:10px;min-width:0;font-size:14px;color:var(--kit-topbar-text)}
.sn-trail .sn-mark{width:30px;height:30px;border-radius:8px}
.sn-trail .sn-mark svg{width:18px;height:18px}
.sn-trail .sn-product{font:700 15px/1.2 var(--font-display);white-space:nowrap}
.sn-trail .sn-sep{color:var(--kit-topbar-muted)}
.sn-shell[data-layout=home] .sn-trail strong{display:none}
.sn-shell .sn-trail strong{font-weight:500;color:var(--kit-topbar-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sn-shell[data-layout=inner] .sn-topbar{justify-content:flex-start} /* the trail stays by the menu button (phones) with or without a back link */
.sn-back{margin-left:auto;display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:6px 12px;border:1px solid transparent;border-radius:var(--kit-radius);color:var(--kit-topbar-text);font-size:13px;font-weight:600;text-decoration:none;white-space:nowrap}
.sn-back:hover{background:var(--sidebar-hover);border-color:var(--sidebar-line)}
.sn-topbar :focus-visible{outline-color:var(--focus-inverse)}
.sn-topbar .mobile-toggle{background:transparent;border-color:var(--sidebar-line);color:var(--kit-topbar-text)}
.sn-shell .workspace{max-width:1320px;padding:32px 38px 36px}
.sn-footer{margin-top:48px;padding-top:16px;border-top:1px solid var(--line);display:grid;gap:6px;text-align:center}
.sn-footer-brand{font-size:11px;color:var(--text-muted)}
.sn-shell .sn-footer .review-bar{padding:0;background:none;border:0;justify-content:center;flex-wrap:wrap;gap:2px 16px;font-size:10px}
@media(max-width:850px){.sn-shell .sidebar{width:272px}
.sn-topbar{min-height:56px;padding:8px 16px}
.sn-shell .workspace{padding:24px 18px 32px}
.sn-trail .sn-product{font-size:14px}
}
@media(max-width:580px){.sn-shell .sn-trail .sn-sep,.sn-shell .sn-trail .sn-product{display:none}
.sn-back{padding-inline:8px}
.sn-shell[data-layout=home] .sn-trail .sn-product{display:inline}
}
@media print{.sn-footer{margin-top:20px}
}

/* ---- page header: ORANGE MONO EYEBROW / H1 / subtitle, actions right on the H1 row ---- */
.sn-page{display:flex;flex-direction:column;gap:20px}
.sn-page>*{min-width:0}
.sn-page>.sn-head{margin-bottom:4px}
.sn-head{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:12px 24px;margin-bottom:26px}
.sn-head-text{flex:1 1 420px;min-width:0}
.sn-eyebrow,.sn-head .sn-eyebrow{margin:0 0 8px;font:600 11.5px/1.5 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--kit-accent-text)}
.sn-title,.sn-head .sn-title{margin:0;font-family:var(--font-display);font-size:clamp(28px,2.6vw,34px);font-weight:700;letter-spacing:-.025em;line-height:1.12}
.sn-sub,.sn-head .sn-sub{margin-top:8px;max-width:760px;font-size:14px;line-height:1.55;color:var(--text-muted)}
.sn-actions,.sn-head .sn-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:23px}
.sn-head>.sn-eyebrow{flex-basis:100%;order:0;margin-bottom:-4px}
.sn-head>.sn-title{flex:1 1 auto;order:1}
.sn-head>.sn-eyebrow~.sn-actions{order:2;margin-top:0}
.sn-head>.sn-sub{flex:0 0 100%;max-width:none;order:3;margin-top:-4px}
/* Phone: the title block and the actions share the H1 row (actions top-right, compact); eyebrow above,
   subtitle below, whichever markup the page uses (flat, .sn-head-text, or a plain wrapper div). */
@media(max-width:700px){.sn-head{flex-wrap:wrap;align-items:flex-start;gap:8px 12px}
.sn-head>div:not(.sn-actions){display:contents}
.sn-head>div:not(.sn-actions)>*{order:4;flex:0 0 100%;max-width:none}
.sn-head>div:not(.sn-actions)>.sn-eyebrow,.sn-head>.sn-eyebrow{order:0;flex:0 0 100%;margin:0}
.sn-head>div:not(.sn-actions)>.sn-title,.sn-head>.sn-title{order:1;flex:1 1 0;min-width:0;margin:0}
.sn-head>.sn-actions,.sn-head>.sn-eyebrow~.sn-actions{order:2;flex:0 1 auto;margin:2px 0 0;max-width:62%;justify-content:flex-end;align-self:flex-start}
.sn-head>div:not(.sn-actions)>.sn-sub,.sn-head>.sn-sub{order:3;flex:0 0 100%;max-width:none;margin:0}
.sn-head>.sn-actions .sn-btn{min-height:40px;padding:6px 11px;font-size:12.5px}
/* Two or more heading actions (2026-09-30 responsive pass): they take their own row under the subtitle, so the
   H1 keeps the full width instead of wrapping word by word beside a stack of buttons. One action stays beside it. */
.sn-head:has(>.sn-actions>:nth-child(2))>.sn-actions{order:5;flex:0 0 100%;max-width:none;justify-content:flex-start}
}

/* ---- buttons ---- */
.sn-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:8px 16px;border:1px solid var(--line-strong);border-radius:var(--kit-radius);background:var(--kit-card-bg);color:var(--text);font-size:13px;font-weight:600;line-height:1.3;text-decoration:none;white-space:nowrap}
.sn-btn svg{width:16px;height:16px;flex:none}
.sn-btn:hover{background:var(--surface-hover)}
.sn-btn.sn-primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.sn-btn.sn-primary:hover{filter:brightness(.94)}
.sn-btn.sn-secondary{background:var(--kit-card-bg);border-color:var(--line-strong);color:var(--text)}
.sn-btn.sn-ghost{background:transparent;border-color:transparent;color:var(--text)}
.sn-btn.sn-ghost:hover{background:var(--surface-hover)}
.sn-btn.small{min-height:32px;padding:5px 11px;font-size:12px}

/* ---- KPI cards ---- */
.sn-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.sn-kpi{position:relative;min-width:0;padding:18px 20px 16px;background:var(--kit-card-bg);border:1px solid var(--kit-card-border);border-radius:var(--kit-radius-lg);box-shadow:var(--kit-shadow)}
.sn-kpi-label{padding-right:40px;font-size:11px;font-weight:600;line-height:1.4;letter-spacing:.07em;text-transform:uppercase;color:var(--text-muted)}
.sn-kpi-icon{position:absolute;top:14px;right:14px;display:grid;place-items:center;width:32px;height:32px;border-radius:8px;background:var(--kit-tint-bg);color:var(--kit-accent-text)}
.sn-kpi-icon svg{width:17px;height:17px}
.sn-kpi-value{margin:12px 0 4px;font-family:var(--font-display);font-size:34px;font-weight:700;letter-spacing:-.03em;line-height:1.1}
.sn-kpi-note{font-size:12px;line-height:1.45;color:var(--text-muted)}
.sn-kpi-note.is-good{color:var(--tone-ok-fg)}
.sn-kpi-note.is-bad{color:var(--tone-bad-fg)}

/* ---- cards and grids ---- */
.sn-card{min-width:0;padding:20px 22px;background:var(--kit-card-bg);border:1px solid var(--kit-card-border);border-radius:var(--kit-radius-lg);box-shadow:var(--kit-shadow)}
.sn-card-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;column-gap:16px;margin-bottom:16px}
.sn-card-head>*{grid-column:1}
.sn-card-head>.sn-card-tools{grid-column:2;grid-row:1/span 2;display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:flex-end}
.sn-card-head h2{font-family:var(--font-display);font-size:17px;font-weight:700;letter-spacing:-.01em;line-height:1.3}
.sn-card-sub{margin-top:3px;font-size:12.5px;line-height:1.5;color:var(--text-muted)}
.sn-card-tools svg{width:16px;height:16px}
.sn-grid-2{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:20px;align-items:start}
.sn-grid-halves{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start}

/* ---- tables ---- */
table.sn-table,.sn-table table{width:100%;min-width:0;border-collapse:collapse;font-size:13px}
.sn-table:not(table){overflow-x:auto;position:relative}
.sn-table th{padding:10px 14px;background:var(--kit-head-bg);border-bottom:1px solid var(--kit-card-border);font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);white-space:nowrap}
.sn-table td{padding:12px 14px;border-bottom:1px solid var(--line-soft);vertical-align:middle}
.sn-table th:first-child,.sn-table td:first-child{padding-left:14px}
.sn-table th:last-child,.sn-table td:last-child{padding-right:14px}
.sn-table .sn-code{font-family:var(--font-mono);font-size:12.5px;font-weight:600;white-space:nowrap}
.sn-table td:first-child strong{font-weight:600}
.sn-table td small{font-size:11.5px}
.sn-table tbody tr:hover td{background:var(--surface-hover)}
.sn-empty{padding:34px 16px;text-align:center;font-size:13px;line-height:1.6;color:var(--text-muted)}
td.sn-empty{padding:34px 16px}
@media(max-width:700px){table.sn-table{display:block;overflow-x:auto;max-width:100%;position:relative}
.sn-table table{min-width:640px}
}

/* ---- pills and status dots ---- */
.sn-pill{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border:1px solid transparent;border-radius:999px;background:var(--tone-muted-bg);color:var(--tone-muted-fg);font-size:11.5px;font-weight:600;line-height:1.45;white-space:nowrap}
.sn-pill.recordable,.sn-pill.bad{background:var(--tone-bad-bg);color:var(--tone-bad-fg);border-color:var(--tone-bad-border)}
.sn-pill.near-miss{background:var(--kit-navy);color:var(--kit-navy-ink);border-color:var(--kit-navy)}
.sn-pill.first-aid{background:transparent;color:var(--text);border-color:var(--line-strong)}
.sn-pill.ok{background:var(--tone-ok-bg);color:var(--tone-ok-fg);border-color:var(--tone-ok-border)}
.sn-pill.warn{background:var(--tone-warn-bg);color:var(--tone-warn-fg);border-color:var(--tone-warn-border)}
.sn-pill.info{background:var(--tone-info-bg);color:var(--tone-info-fg);border-color:var(--tone-info-border)}
.sn-pill.muted{background:var(--tone-muted-bg);color:var(--tone-muted-fg);border-color:var(--tone-muted-border)}
.sn-dot{display:inline-flex;align-items:center;gap:7px;font-size:13px;white-space:nowrap}
.sn-dot::before{content:"";width:8px;height:8px;flex:none;border-radius:50%;background:var(--tone-muted-fg)}
.sn-dot.ok::before{background:var(--tone-ok-fg)}
.sn-dot.warn::before{background:var(--kit-bar-fill)}
.sn-dot.bad::before{background:var(--tone-bad-fg)}
.sn-dot.info::before{background:var(--tone-info-fg)}
.sn-dot.navy::before{background:var(--kit-navy)}

/* ---- bars: <progress class="sn-bar"> or .sn-bar.pct-N (5% steps; CSP forbids inline widths) ---- */
.sn-bar{position:relative;display:block;width:100%;height:8px;overflow:hidden;border:0;border-radius:999px;background:var(--kit-bar-track);appearance:none;-webkit-appearance:none}
progress.sn-bar::-webkit-progress-bar{background:var(--kit-bar-track);border-radius:999px}
progress.sn-bar::-webkit-progress-value{background:var(--kit-bar-fill);border-radius:999px}
progress.sn-bar::-moz-progress-bar{background:var(--kit-bar-fill);border-radius:999px}
div.sn-bar::before,span.sn-bar::before{content:"";position:absolute;inset:0 auto 0 0;width:var(--pct,0%);border-radius:inherit;background:var(--kit-bar-fill)}
.sn-bar.ok{--kit-bar-fill:var(--tone-ok-fg)}.sn-bar.bad{--kit-bar-fill:var(--tone-bad-fg)}.sn-bar.info{--kit-bar-fill:var(--tone-info-fg)}.sn-bar.navy{--kit-bar-fill:var(--kit-navy)}
.sn-seg{display:flex;width:100%;height:10px;overflow:hidden;border-radius:999px;background:var(--kit-bar-track)}
.sn-seg>span{width:var(--pct,0%);background:var(--kit-bar-fill)}
.sn-seg>.ok{background:var(--tone-ok-fg)}.sn-seg>.warn{background:var(--kit-bar-fill)}.sn-seg>.bad{background:var(--tone-bad-fg)}.sn-seg>.navy{background:var(--kit-navy)}
.sn-w{width:var(--pct,0%)}
.sn-h{height:var(--pct,0%)}
.pct-0{--pct:0%}.pct-5{--pct:5%}.pct-10{--pct:10%}.pct-15{--pct:15%}.pct-20{--pct:20%}.pct-25{--pct:25%}.pct-30{--pct:30%}.pct-35{--pct:35%}.pct-40{--pct:40%}.pct-45{--pct:45%}.pct-50{--pct:50%}
.pct-55{--pct:55%}.pct-60{--pct:60%}.pct-65{--pct:65%}.pct-70{--pct:70%}.pct-75{--pct:75%}.pct-80{--pct:80%}.pct-85{--pct:85%}.pct-90{--pct:90%}.pct-95{--pct:95%}.pct-100{--pct:100%}

/* ---- banners and notices ---- */
.sn-banner{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--kit-tint-border);border-radius:var(--kit-radius);background:var(--kit-tint-bg);color:var(--text);text-decoration:none}
.sn-banner>svg{width:20px;height:20px;flex:none;color:var(--kit-accent-text)}
.sn-banner>svg:last-child{width:16px;height:16px;margin-left:auto;color:var(--text-muted)}
.sn-banner strong{display:block;font-size:13px;font-weight:700;color:var(--kit-accent-text)}
.sn-banner small,.sn-banner p{display:block;font-size:12px;color:var(--text-soft)}
a.sn-banner:hover{border-color:var(--kit-accent-text)}
.sn-banner.info{background:var(--tone-info-bg);border-color:var(--tone-info-border)}
.sn-banner.info strong,.sn-banner.info>svg{color:var(--tone-info-fg)}
.sn-banner.ok{background:var(--tone-ok-bg);border-color:var(--tone-ok-border)}
.sn-banner.ok strong,.sn-banner.ok>svg{color:var(--tone-ok-fg)}
.sn-notice{padding:12px 16px;border:1px solid var(--kit-tint-border);border-left:4px solid var(--accent);border-radius:var(--kit-radius);background:var(--kit-tint-bg);font-size:13px;line-height:1.55;color:var(--text)}
.sn-notice strong{color:var(--kit-accent-text);font-weight:700}

/* ---- forms ---- */
.sn-section{padding:20px 0;border-top:1px solid var(--line)}
.sn-section:first-child{padding-top:0;border-top:0}
.sn-section-title{margin:0 0 14px;font-family:var(--font-display);font-size:16px;font-weight:700;letter-spacing:-.01em}
.sn-fields{display:grid;grid-template-columns:minmax(0,1fr);gap:14px 16px}
.sn-fields.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.sn-fields.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.sn-fields.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.sn-fields>.span-2{grid-column:span 2}
.sn-fields>.span-3{grid-column:span 3}
.sn-fields>.span-all,.sn-fields>.span-full{grid-column:1/-1}
.sn-fields label,.sn-form label{font-size:12px;font-weight:600;margin-bottom:6px;color:var(--text)}
.sn-form input,.sn-form select,.sn-form textarea,.sn-inline-panel input,.sn-inline-panel select,.sn-inline-panel textarea{min-height:40px;padding:8px 11px;border-radius:var(--kit-radius);font-size:13.5px}
.sn-form textarea,.sn-inline-panel textarea{min-height:96px}
.sn-form input:focus,.sn-form select:focus,.sn-form textarea:focus,.sn-inline-panel input:focus,.sn-inline-panel select:focus,.sn-inline-panel textarea:focus{border-color:var(--accent);box-shadow:var(--kit-focus-ring);outline:none}
.sn-fields .hint,.sn-hint{font-size:11.5px;color:var(--text-muted);margin-top:5px}
.sn-req{color:var(--tone-bad-fg)}
/* Consecutive field grids keep the same row gap as inside a grid; disabled controls look disabled. */
.sn-fields+.sn-fields,.sn-fields+.field,.field+.sn-fields{margin-top:14px}
.sn-form input:disabled,.sn-form select:disabled,.sn-form textarea:disabled{background:var(--surface-sunken);color:var(--text-muted);border-style:dashed;cursor:not-allowed}
.sn-form-actions .sn-hint{margin:0 auto 0 0}
.sn-inline-panel{padding:20px 22px;background:var(--kit-card-bg);border:1px solid var(--kit-card-border);border-top:3px solid var(--accent);border-radius:var(--kit-radius-lg);box-shadow:var(--kit-shadow)}
.sn-inline-panel>h2,.sn-inline-panel>.sn-card-head h2{font-family:var(--font-display);font-size:17px;font-weight:700;margin-bottom:14px}
.sn-form-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:10px;margin-top:18px}
.sn-ai{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:38px;margin-top:8px;padding:7px 12px;border:1px solid var(--accent);border-radius:var(--kit-radius);background:transparent;color:var(--kit-accent-text);font-size:13px;font-weight:600}
.sn-ai svg{width:16px;height:16px;flex:none}
.sn-ai:hover{background:var(--kit-tint-bg)}
.sn-ai[aria-busy=true]{cursor:progress}
.sn-ai-note{margin-top:6px;font-size:12px;line-height:1.5;color:var(--text-muted)}
.sn-ai-note[data-tone=ok]{color:var(--tone-ok-fg)}
.sn-ai-note[data-tone=bad]{color:var(--tone-bad-fg)}
.sn-ai-note[data-tone=warn]{color:var(--tone-warn-fg)}
.sn-ai-note .text-button{padding:0 0 0 4px;font-size:12px}

/* ---- numbered section cards (JSA) ---- */
.sn-num-card{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:14px;align-items:start}
.sn-num-card>*{grid-column:1/-1}
.sn-num-card>.sn-num{grid-column:1;grid-row:1/span 2}
.sn-num-card>h2,.sn-num-card>p,.sn-num-card>.sn-card-head{grid-column:2}
.sn-num-card>h2{font-family:var(--font-display);font-size:17px;font-weight:700;line-height:1.3}
.sn-num-card>p{margin-bottom:16px;font-size:12.5px;color:var(--text-muted)}
.sn-num{display:inline-grid;place-items:center;min-width:40px;height:32px;padding:0 9px;border-radius:8px;background:var(--accent);color:var(--accent-ink);font:600 13px/1 var(--font-mono);letter-spacing:.02em;white-space:nowrap}

/* ---- month strip and tabs ---- */
.sn-months{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:6px}
.sn-months>button,.sn-months>a{display:grid;place-items:center;min-height:38px;padding:4px 2px;border:1px solid var(--kit-card-border);border-radius:var(--kit-radius);background:var(--kit-card-bg);color:var(--text);font-size:13px;font-weight:600;text-decoration:none}
.sn-months>button:hover,.sn-months>a:hover{background:var(--surface-hover)}
.sn-months>[aria-pressed=true],.sn-months>[aria-current],.sn-months>.is-active{background:var(--kit-navy);border-color:var(--kit-navy);color:var(--kit-navy-ink)}
.sn-tabs{display:flex;flex-wrap:wrap;gap:8px}
.sn-tabs>a,.sn-tabs>button{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:7px 14px;border:1px solid var(--kit-card-border);border-radius:var(--kit-radius);background:var(--kit-card-bg);color:var(--text);font-size:13px;font-weight:600;text-decoration:none}
.sn-tabs>a svg,.sn-tabs>button svg{width:16px;height:16px}
.sn-tabs>a:hover,.sn-tabs>button:hover{background:var(--surface-hover)}
.sn-tabs>[aria-selected=true],.sn-tabs>[aria-current=page],.sn-tabs>[aria-pressed=true],.sn-tabs>.is-active{background:var(--kit-navy);border-color:var(--kit-navy);color:var(--kit-navy-ink)}

/* ---- responsive ---- */
@media(max-width:1180px){.sn-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
.sn-fields.cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){.sn-grid-2,.sn-grid-halves{grid-template-columns:minmax(0,1fr)}
.sn-fields.cols-3{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:580px){.sn-kpis{gap:10px}
.sn-kpi{padding:14px 14px 12px}
.sn-kpi-icon{width:28px;height:28px;top:10px;right:10px}
.sn-kpi-value{font-size:28px}
.sn-card,.sn-inline-panel{padding:16px}
.sn-fields.cols-2,.sn-fields.cols-3,.sn-fields.cols-4{grid-template-columns:minmax(0,1fr)}
.sn-fields>.span-2,.sn-fields>.span-3{grid-column:1/-1}
.sn-months{grid-template-columns:repeat(6,minmax(0,1fr))}
.sn-head .sn-actions{margin-top:4px}
.sn-card-head{grid-template-columns:minmax(0,1fr)}
.sn-card-head>.sn-card-tools{grid-column:1;grid-row:auto;justify-content:flex-start;margin-top:10px}
}
@media print{.sn-ai,.sn-ai-note,.sn-actions,.sn-tabs{display:none!important}
.sn-card,.sn-kpi{box-shadow:none}
}
.sn-tabs-gap{margin:0 0 22px}

/* Company logo (DSP's real artwork) on a light plate: sidebar top, sign-in panel, small in the inner top bar only
   while the sidebar is a drawer (tablet portrait); where the sidebar shows, its logo is the one on screen. */
.sn-company-logo{display:inline-flex;align-items:center;justify-content:center;background:var(--logo-bg);border-radius:var(--radius-sm);line-height:0}
.sn-company-logo img{display:block;height:auto;width:100%}
.sn-company-logo--full{width:150px;padding:8px 12px;margin:0 0 14px}
.sn-company-logo--small{width:74px;padding:4px 7px;margin-right:10px;flex:none}
.sn-company-logo--login{width:168px;padding:9px 13px;margin-bottom:18px}
[data-layout="home"] .sn-trail .sn-company-logo--small{display:none}
.sidebar-brand img.sn-brand-logo,.sn-trail .sn-tagline{display:none} /* LCARS hooks: the logo in the elbow, the header band's tagline */
@media (min-width:851px){.sn-trail .sn-company-logo--small{display:none}}
@media (max-width:520px){.sn-company-logo--small{display:none}}
@media print{.sn-company-logo{background:none;padding:0}}
/* LCARS: the orange corner is drawn by the sidebar brand overlapping .lcars-elbow, so the brand must follow the
   elbow directly. The company logo therefore sits in its own light pill right under the corner (Mike's screenshot
   2026-09-30: the logo between them split the corner and hid the artwork). */
@media screen{
html[data-theme="lcars"] .sidebar > *{order:5}
html[data-theme="lcars"] .sidebar > .lcars-elbow{order:0}
html[data-theme="lcars"] .sidebar > .sidebar-close{order:1}
html[data-theme="lcars"] .sidebar > .sidebar-brand{order:2}
html[data-theme="lcars"] .sidebar > .sn-company-logo{order:3;direction:ltr;align-self:stretch;width:auto;margin:12px 0 12px;padding:8px 16px;border-radius:20px 4px 4px 20px;background:var(--logo-bg)}
html[data-theme="lcars"] .sidebar > .sn-company-logo img{width:150px;margin:0 auto}
}

/* Wave A split (2026-09-30). Training school: "Manage in the dashboard" in the navigation panel (administrators,
   managers), the course list heading on My training. Dashboard School module: the past-due note in its tables. */
.training-manage{padding:0 6px 14px;margin-bottom:14px;border-bottom:1px solid var(--sidebar-line)}
.training-manage .text-button{display:inline-flex;align-items:center;gap:8px;padding:4px 0;color:var(--sidebar-text);font-size:12px}
.training-manage svg{width:15px;height:15px;flex:none}
.training-courses-title{margin:40px 0 18px}
.school-page .course-boundary{margin-top:4px}
.school-overdue{color:var(--tone-bad-fg);font-weight:600}
.school-page .sn-table td.school-date{white-space:nowrap}
.your-training .sn-btn{margin-top:16px}
/* Dashboard top bar: the notifications bell (notify module; badge = unread). The AI assist note under every AI button
   (WAVE-A.md: "Development AI key · limited to $5 a day · expires Oct 30, 2026") and Settings -> AI assist. */
.sn-bell{margin-left:auto;position:relative;display:inline-grid;place-items:center;flex:none;width:38px;height:38px;border:1px solid transparent;border-radius:var(--kit-radius);color:var(--kit-topbar-text);text-decoration:none}
.sn-bell:hover,.sn-bell[aria-current=page]{background:var(--sidebar-hover);border-color:var(--sidebar-line)}
.sn-bell svg{width:19px;height:19px}
.sn-bell-count{position:absolute;top:1px;right:-2px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--accent);color:var(--accent-ink);font-size:10px;font-weight:700;line-height:17px;text-align:center}
.sn-bell-count[hidden]{display:none}
.sn-bell ~ .sn-back{margin-left:0}
.sn-ai-status{margin-top:6px;font-size:11px;line-height:1.5;color:var(--text-muted)}
.sn-ai-status[data-tone=warn]{color:var(--tone-warn-fg)}
.sn-ai-settings .sn-ai-status{margin:14px 0 10px;font-size:12px}
@media print{.sn-bell,.sn-ai-status{display:none!important}}

/* Phone touch targets (2026-09-30 responsive pass): kit buttons, small buttons, tabs and the AI assist reach
   40px. Kept last so it follows the base .sn-btn/.sn-btn.small/.sn-tabs/.sn-ai rules of equal specificity. */
@media(max-width:700px){.sn-btn,.sn-btn.small,.sn-tabs>a,.sn-tabs>button,.sn-ai,.sn-months>button,.sn-months>a{min-height:40px}
/* A long KPI label (ACKNOWLEDGMENTS PENDING) in a half-width phone tile: wrap between words, clear of the
   corner icon (28-32px at right 10-14px), never mid-word unless a single word cannot fit a line at all. */
.sn-kpi-label{padding-right:30px;letter-spacing:.02em;hyphens:manual;overflow-wrap:break-word}}
/* Narrow phones (390px, 375px): a half-width tile leaves ~110px beside the icon, less than ACKNOWLEDGMENTS needs
   at 11px (~120px), so it still broke mid-word. At 10px, tracked -.01em (~107px), beside a 26px icon it fits whole. */
@media(max-width:420px){.sn-kpi-icon{width:26px;height:26px}
.sn-kpi-label{padding-right:26px;font-size:10px;letter-spacing:-.01em}}

/* UX review 2026-10-01 (themes). "Improve with AI" (design review F12; Pedro wants AI help on every narrative field AND
   "don't clutter"): a compact button at the right under its field instead of a full-width bar, with a lighter edge. It
   stays the element right after its textarea (school/tests/modules/ai-purposes.test.mjs). Its "AI assist is not
   connected" / development-key line shows once per group of fields (the first field that carries one), not under
   every field. Phone keeps the 40px target. */
.sn-ai{width:fit-content;max-width:100%;min-height:32px;margin:6px 0 0 auto;padding:5px 12px;gap:6px;border-color:var(--kit-tint-border);font-size:12.5px}
.sn-ai:hover{border-color:var(--accent)}
.sn-ai svg{width:15px;height:15px}
.field>.sn-ai~.sn-ai-status,.field>.sn-ai~.sn-ai-note{text-align:right}
.field:has([data-sn-ai-status])~.field [data-sn-ai-status]{display:none}
@media(max-width:700px){.sn-ai{min-height:40px}}
/* A read-only field (Report incident: Client, set by the facility; the derived JSA company; a corrective action's type)
   is a value, not a box to type in (design review F26): no box, aligned with its label. The phone link of Send to my
   phone keeps its box (it is copied). */
input[readonly]:not([type=checkbox]):not([type=radio]):not(.pw-phone-link){background:transparent;border:0;padding-inline:0;cursor:default}
/* Phone tap targets of at least 24px (WCAG 2.5.8; design review F20): links inside tables (case codes, action titles,
   the department accountability names, managers and counts), the compliance obligation titles, the KPI note link
   ("3 past due"), the status board's "How the lights work" and the compliance year switch. */
@media(max-width:700px){.sn-table td a:not(.sn-btn):not(.button),table td a:not(.sn-btn):not(.button),tbody th a{display:inline-flex;align-items:center;min-height:24px}
.cmp-sentinel a.cmp-strong,.cmp-list .cmp-item a{display:inline-flex;align-items:center;min-height:24px}
.sn-kpi-note a{display:inline-flex;align-items:center;min-height:24px}
.sb-legend>summary{padding-block:4px;min-height:24px}
.cmp-year a{min-height:32px}}
/* The same for the Training pages (proofing pass 2026-10-03): the back link above a course or a record, the small links
   in a panel heading ("My records", "View all") and "Forgot password?" on the sign-in card were 17 to 20px tall on a phone. */
@media(max-width:700px){.back-link{min-height:24px}
.panel-head a:not(.button){display:inline-flex;align-items:center;min-height:24px}
.auth-more a{display:inline-flex;align-items:center;min-height:24px}
/* and on the dashboard: the link under a certification card, text links in a card heading, the back links above an
   action, a task and a JSA, and "Edit site details" (17 to 23px tall at 390px) */
.cert-card-foot a,.sn-card-tools a:not(.sn-btn):not(.button),.cmp-back a,.jsa-crumb a{display:inline-flex;align-items:center;min-height:24px}
.cl-site-edit>summary{padding-block:3px}}
/* Keyboard focus is never parked under the sticky 56px top bar or the fixed "Suggest a change" button at the bottom
   right (WCAG 2.4.11 Focus Not Obscured): moving focus scrolls the element clear of both. LCARS sets its own top value
   for its taller frame (lcars.css, :root[data-theme="lcars"], which wins). */
html{scroll-padding-top:72px;scroll-padding-bottom:88px}
/* Light design (and print, which always uses it): module text colours below 4.5:1 re-pointed at the muted text token
   (#666b61, 5.4:1 on white): Policies' meta line "Version 1 · …" (4.1:1), the Employees dash for a value not recorded
   (2.0:1), the module name beside a due item (3.8:1), an empty certification bucket's "0" (2.3:1), and the chart year
   labels and heat-cell notes drawn at 80% opacity. The 26px example sheet code in Capture ("DSP-7K3R", a placeholder,
   1.7:1) takes the field-border grey, 3.6:1: readable as large text, still lighter than a typed code. The modules keep
   their own values in the other designs. */
:root[data-theme="light"]{--documents-meta:var(--text-muted);--employees-none:var(--text-muted);--dashboard-due-mod:var(--text-muted);--certifications-zero:var(--text-muted);--paperwork-placeholder:var(--line-strong)}
html[data-theme="light"] .dash-chart-month small{opacity:1}
html[data-theme="light"] .dash-table td.dash-cell small{opacity:1}
html[data-theme="light"] .pw-camera small{opacity:1}
@media print{:root[data-theme]{--documents-meta:var(--text-muted);--employees-none:var(--text-muted);--dashboard-due-mod:var(--text-muted);--certifications-zero:var(--text-muted)}
.dash-chart-month small,.dash-table td.dash-cell small{opacity:1}}
/* Incident stepper, light design: the connector started 3px before each label and showed as a dash ("-Reported"); dark,
   Sentinel and LCARS carry the same fix in their own files. */
@media(min-width:761px){html[data-theme="light"] .inc-step::after{left:37px}}
/* Spanish on a phone (fix-followups 2026-10-01): Spanish titles and button labels are longer, and a lone heading action
   kept on the title row cut the title: "Notificaciones" ran 30-38 px under "Marcar estas como leídas", and an employee's
   "Auditorías e inspecciones" 38-40 px under "Iniciar una lista de verificación" (390 px; Sentinel, Light and Dark; English
   clears). In Spanish the action takes its own row under the subtitle, as two or more actions already do (LCARS does so in
   every language, lcars.css). */
@media(max-width:580px){html[lang="es"] .sn-head>.sn-actions,html[lang="es"] .sn-head>.sn-eyebrow~.sn-actions{order:5;flex:0 0 100%;max-width:none;justify-content:flex-start}}

/* ---- Course Builder (2026-10-14): a course written in this workspace, a course card's several actions (Assign, Print
   Quiz, Edit, Add Spanish Version), the Print Quiz dialog (assets/quiz-print.js) and its button inside a course. Both
   apps load this file; the builder's own screens are styled in modules/courses.css. */
.badge.custom{background:var(--tone-info-bg);color:var(--tone-info-fg);border:1px solid var(--tone-info-border)}
.course-card-actions{flex-wrap:wrap}
.sn-course-actions,.tr-course-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;justify-content:flex-end;margin-left:auto}
.qp-open svg{width:15px;height:15px}
.assignment-heading .qp-open{margin-top:14px}
.qp-key{display:flex;align-items:center;gap:9px;font-weight:600;font-size:14px;cursor:pointer;margin-top:4px}
.qp-key input{width:18px;height:18px;flex:0 0 auto}
.qp-fields .hint{margin-top:4px}
.qp-dialog .form-actions a.button{display:inline-flex;align-items:center;gap:7px;text-decoration:none}
.qp-dialog .form-actions a.button svg{width:16px;height:16px}
@media print{.qp-open{display:none}}
/* Course media (2026-10-20): a lesson's video and slides in the course player of both apps and in the Course Builder preview
   (platform.js lessonMedia, assets/course-media.js <dsp-slides>). Tokens only: every design colours it. On paper the players
   give way to the two .cm-print lines ("Video: …", "Slides: …"). */
.lesson-media{display:flex;flex-direction:column;gap:22px;margin:0 0 26px;max-width:960px}
.cm-media{margin:0;min-width:0}
.cm-video video{display:block;width:100%;max-height:72vh;background:var(--media-letterbox);border-radius:var(--radius-sm)}
.cm-media figcaption{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin-top:10px;font-size:13px;color:var(--text-muted)}
.cm-kind{display:inline-flex;align-items:center;gap:7px;font-weight:650;color:var(--text)}
.cm-kind svg{width:18px;height:18px;flex:none}
.cm-title{color:var(--text);font-weight:600}
.cm-download{display:inline-flex;align-items:center;gap:6px;min-height:44px;margin-left:auto;font-weight:600}
.cm-download svg{width:16px;height:16px}
dsp-slides{display:block;min-width:0;container-type:inline-size}
.cm-stage{position:relative;display:flex;align-items:center;justify-content:center;min-height:200px;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden}
.cm-stage canvas{display:block;max-width:100%}
.cm-status{position:absolute;inset:auto 0 0;margin:0;padding:12px 14px;font-size:13px;font-weight:600;color:var(--text);text-align:center}
.cm-status.is-error{position:static;color:var(--tone-bad-fg)}
.cm-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 12px;margin-top:10px}
.cm-count{flex:1 1 auto;min-width:0;font-weight:650;color:var(--text);text-align:center}
/* A narrow viewer (a phone, a long word in Spanish, LCARS capitals): the step buttons keep only their arrows; their names stay
   "Previous slide" and "Next slide" for a screen reader, and each is still a 44 px target. */
@container (max-width:480px){.cm-step>span:not([aria-hidden]){display:none}.cm-step{min-width:48px;padding-inline:14px}}
.cm-step span[aria-hidden]{font-size:18px;line-height:1}
.cm-video-error{margin:8px 0 0;font-size:13px;font-weight:600;color:var(--tone-bad-fg)}
.cm-print{display:none}
@media(max-width:580px){.cm-download{margin-left:0}}
@media print{.lesson-media{gap:4px}.cm-media{display:none!important}.cm-print{display:block;margin:0 0 4px;font-size:11pt}}