*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.visible{visibility:visible}.static{position:static}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.left-0{left:0}.top-0{top:0}.top-16{top:4rem}.top-full{top:100%}.z-40{z-index:40}.z-50{z-index:50}.mx-1{margin-left:.25rem;margin-right:.25rem}.mx-auto{margin-left:auto;margin-right:auto}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.ml-auto{margin-left:auto}.mr-3{margin-right:.75rem}.mt-0\.5{margin-top:.125rem}.mt-1{margin-top:.25rem}.mt-1\.5{margin-top:.375rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-5{margin-top:1.25rem}.mt-6{margin-top:1.5rem}.mt-7{margin-top:1.75rem}.mt-8{margin-top:2rem}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.\!grid{display:grid!important}.grid{display:grid}.hidden{display:none}.h-14{height:3.5rem}.h-16{height:4rem}.h-2{height:.5rem}.h-7{height:1.75rem}.h-9{height:2.25rem}.min-h-\[120px\]{min-height:120px}.min-h-\[170px\]{min-height:170px}.min-h-\[88px\]{min-height:88px}.w-14{width:3.5rem}.w-16{width:4rem}.w-2{width:.5rem}.w-7{width:1.75rem}.w-72{width:18rem}.w-9{width:2.25rem}.w-full{width:100%}.min-w-0{min-width:0}.max-w-2xl{max-width:42rem}.max-w-5xl{max-width:64rem}.max-w-7xl{max-width:80rem}.max-w-md{max-width:28rem}.max-w-sm{max-width:24rem}.flex-1{flex:1 1 0%}@keyframes pulse{50%{opacity:.5}}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.cursor-pointer{cursor:pointer}.list-disc{list-style-type:disc}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.place-items-center{place-items:center}.items-start{align-items:flex-start}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-0{gap:0}.gap-1{gap:.25rem}.gap-1\.5{gap:.375rem}.gap-10{gap:2.5rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-5{gap:1.25rem}.gap-6{gap:1.5rem}.gap-x-6{-moz-column-gap:1.5rem;column-gap:1.5rem}.space-y-0\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.125rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.125rem*var(--tw-space-y-reverse))}.space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.25rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem*var(--tw-space-y-reverse))}.space-y-1\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.375rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.375rem*var(--tw-space-y-reverse))}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.5rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem*var(--tw-space-y-reverse))}.space-y-2\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.625rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.625rem*var(--tw-space-y-reverse))}.space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.75rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem*var(--tw-space-y-reverse))}.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem*var(--tw-space-y-reverse))}.space-y-6>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1.5rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem*var(--tw-space-y-reverse))}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:1rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.rounded-t-2xl{border-top-left-radius:1rem;border-top-right-radius:1rem}.border{border-width:1px}.border-2{border-width:2px}.border-b{border-bottom-width:1px}.border-t{border-top-width:1px}.border-dashed{border-style:dashed}.border-\[\#1a3a8f\]\/20{border-color:rgba(26,58,143,.2)}.border-\[var\(--gold-soft\)\]{border-color:var(--gold-soft)}.border-\[var\(--line\)\]{border-color:var(--line)}.border-\[var\(--line-2\)\]{border-color:var(--line-2)}.border-white\/40{border-color:hsla(0,0%,100%,.4)}.bg-\[\#33333a\]{--tw-bg-opacity:1;background-color:rgb(51 51 58/var(--tw-bg-opacity,1))}.bg-\[\#FCFAF4\]{--tw-bg-opacity:1;background-color:rgb(252 250 244/var(--tw-bg-opacity,1))}.bg-\[\#f4f7fd\]{--tw-bg-opacity:1;background-color:rgb(244 247 253/var(--tw-bg-opacity,1))}.bg-\[rgba\(255\2c 255\2c 255\2c \.45\)\]{background-color:hsla(0,0%,100%,.45)}.bg-charcoal{--tw-bg-opacity:1;background-color:rgb(27 27 29/var(--tw-bg-opacity,1))}.bg-cream{--tw-bg-opacity:1;background-color:rgb(251 248 241/var(--tw-bg-opacity,1))}.bg-gold{--tw-bg-opacity:1;background-color:rgb(226 163 41/var(--tw-bg-opacity,1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.bg-white\/95{background-color:hsla(0,0%,100%,.95)}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-2\.5{padding:.625rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-6{padding:1.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-14{padding-top:3.5rem;padding-bottom:3.5rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.py-8{padding-top:2rem;padding-bottom:2rem}.pb-2{padding-bottom:.5rem}.pb-3{padding-bottom:.75rem}.pl-5{padding-left:1.25rem}.pr-1{padding-right:.25rem}.pt-2{padding-top:.5rem}.pt-4{padding-top:1rem}.text-left{text-align:left}.text-center{text-align:center}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-\[\.58rem\]{font-size:.58rem}.text-\[\.62rem\]{font-size:.62rem}.text-\[\.66rem\]{font-size:.66rem}.text-\[\.6rem\]{font-size:.6rem}.text-\[\.72rem\]{font-size:.72rem}.text-\[\.74rem\]{font-size:.74rem}.text-\[\.7rem\]{font-size:.7rem}.text-\[\.98rem\]{font-size:.98rem}.text-\[1\.05rem\]{font-size:1.05rem}.text-\[2\.1rem\]{font-size:2.1rem}.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-normal{font-weight:400}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.italic{font-style:italic}.leading-\[1\.05\]{line-height:1.05}.leading-relaxed{line-height:1.625}.leading-snug{line-height:1.375}.leading-tight{line-height:1.25}.tracking-\[\.22em\]{letter-spacing:.22em}.tracking-\[\.2em\]{letter-spacing:.2em}.tracking-tight{letter-spacing:-.025em}.tracking-wide{letter-spacing:.025em}.text-\[\#1a3a8f\]{--tw-text-opacity:1;color:rgb(26 58 143/var(--tw-text-opacity,1))}.text-\[\#241500\]{--tw-text-opacity:1;color:rgb(36 21 0/var(--tw-text-opacity,1))}.text-\[\#2f6b36\]{--tw-text-opacity:1;color:rgb(47 107 54/var(--tw-text-opacity,1))}.text-\[\#3a2400\]{--tw-text-opacity:1;color:rgb(58 36 0/var(--tw-text-opacity,1))}.text-\[\#3a2a08\]{--tw-text-opacity:1;color:rgb(58 42 8/var(--tw-text-opacity,1))}.text-\[\#4a3a18\]{--tw-text-opacity:1;color:rgb(74 58 24/var(--tw-text-opacity,1))}.text-\[\#5a4413\]{--tw-text-opacity:1;color:rgb(90 68 19/var(--tw-text-opacity,1))}.text-\[\#EDEAE2\]{--tw-text-opacity:1;color:rgb(237 234 226/var(--tw-text-opacity,1))}.text-\[\#aaa49a\]{--tw-text-opacity:1;color:rgb(170 164 154/var(--tw-text-opacity,1))}.text-\[\#cfcabd\]{--tw-text-opacity:1;color:rgb(207 202 189/var(--tw-text-opacity,1))}.text-\[var\(--ink\)\]{color:var(--ink)}.text-\[var\(--ink-soft\)\]{color:var(--ink-soft)}.text-charcoal{--tw-text-opacity:1;color:rgb(27 27 29/var(--tw-text-opacity,1))}.text-gold{--tw-text-opacity:1;color:rgb(226 163 41/var(--tw-text-opacity,1))}.text-gold-deep{--tw-text-opacity:1;color:rgb(188 126 22/var(--tw-text-opacity,1))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.underline{text-decoration-line:underline}.line-through{text-decoration-line:line-through}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.accent-\[var\(--gold-deep\)\]{accent-color:var(--gold-deep)}.shadow-2xl{--tw-shadow:0 25px 50px -12px rgba(0,0,0,.25);--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color)}.shadow-2xl,.shadow-xl{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);--tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color),0 8px 10px -6px var(--tw-shadow-color)}.ring{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.last\:border-0:last-child{border-width:0}.hover\:border-\[var\(--gold-soft\)\]:hover{border-color:var(--gold-soft)}.hover\:bg-cream:hover{--tw-bg-opacity:1;background-color:rgb(251 248 241/var(--tw-bg-opacity,1))}.hover\:text-\[var\(--ink\)\]:hover{color:var(--ink)}.hover\:text-white:hover{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}@media (min-width:640px){.sm\:col-span-2{grid-column:span 2/span 2}.sm\:ml-auto{margin-left:auto}.sm\:w-auto{width:auto}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.sm\:flex-row{flex-direction:row}.sm\:items-center{align-items:center}.sm\:gap-4{gap:1rem}.sm\:gap-7{gap:1.75rem}.sm\:p-6{padding:1.5rem}.sm\:p-8{padding:2rem}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:py-20{padding-top:5rem;padding-bottom:5rem}.sm\:text-left{text-align:left}.sm\:text-3xl{font-size:1.875rem;line-height:2.25rem}.sm\:text-4xl{font-size:2.25rem;line-height:2.5rem}.sm\:text-\[13px\]{font-size:13px}.sm\:text-\[2\.9rem\]{font-size:2.9rem}.sm\:text-lg{font-size:1.125rem;line-height:1.75rem}}@media (min-width:768px){.md\:inline{display:inline}}@media (min-width:1024px){.lg\:sticky{position:sticky}.lg\:top-6{top:1.5rem}.lg\:top-\[72px\]{top:72px}.lg\:col-span-2{grid-column:span 2/span 2}.lg\:col-span-3{grid-column:span 3/span 3}.lg\:col-span-4{grid-column:span 4/span 4}.lg\:col-span-5{grid-column:span 5/span 5}.lg\:col-span-7{grid-column:span 7/span 7}.lg\:col-span-8{grid-column:span 8/span 8}.lg\:ml-2{margin-left:.5rem}.lg\:mt-0{margin-top:0}.lg\:flex{display:flex}.lg\:hidden{display:none}.lg\:h-\[72px\]{height:72px}.lg\:grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.lg\:flex-row{flex-direction:row}.lg\:items-end{align-items:flex-end}.lg\:border-b-0{border-bottom-width:0}.lg\:border-r{border-right-width:1px}.lg\:text-\[3\.2rem\]{font-size:3.2rem}}@media (min-width:1280px){.xl\:grid-cols-8{grid-template-columns:repeat(8,minmax(0,1fr))}.xl\:gap-7{gap:1.75rem}}

/* ===== IS4NCDs brand layer ===== */
:root{
    --charcoal:#1b1b1d;
    --charcoal-2:#27272b;
    --gold:#E2A329;
    --gold-deep:#BC7E16;
    --gold-soft:#F2D49A;
    --gold-wash:#FBEFD3;
    --blue:#2C6E8F;
    --teal:#2F9C8B;
    --lightblue:#7FB6CC;
    --rust:#B8542C;
    --ink:#242427;
    --ink-soft:#55555d;
    --cream:#FBF8F1;
    --paper:#ffffff;
    --line:#E8E2D6;
    --line-2:#D9D2C4;
    /* CPC-01 hero-field tokens — defaults are the EXACT values the hero
       previously hard-coded, so tenants without an override render
       identically. Tenant palette config may substitute these (server
       allowlist in functions/_lib/composition.js). */
    --hero-grad-from:#E7AE36;
    --hero-grad-mid:#DC9A22;
    --hero-grad-to:#C9871A;
    --hero-glow-a:#F2C25A;
    --hero-glow-b:#C98B17;
    --hero-ink-strong:#241500;
    --hero-ink:#3a2a08;
    --hero-ink-soft:#4a3a18;
    --hero-eyebrow-ink:#3a2400;

    /* ===== PX-1B design-system tokens (authoritative) =====================
       Consolidation, NOT a rebrand: every value below equals a colour/size
       ALREADY in use, so pages render identically while the vocabulary is
       unified. Governing reference: docs/PX-1A_AUDIT_AND_DESIGN_BASELINE.md §3.
       Adds the semantic roles the audit found missing (success/warning/danger/
       info/muted/surface/border) so duplicated inline hex can reference a token. */
    /* Semantic surfaces & borders (aliases of existing brand values) */
    --surface:#ffffff;            /* = --paper */
    --surface-sunk:#F3EFE4;       /* = existing .tagchip / sunk fills */
    --border:#E8E2D6;             /* = --line */
    --border-strong:#D9D2C4;      /* = --line-2 */
    --muted:#55555d;              /* = --ink-soft */
    --muted-fill:#EFEFEF;         /* = existing 'mut' chip fill */
    /* Semantic status roles (text + tint fill + border) — values preserve the
       exact colours the chip()/badge() tone maps + inline styles already used. */
    --success:#2f6b36;  --success-fill:#E7F3E8;  --success-border:#BFE0C4;
    --warning:#BC7E16;  --warning-fill:#FBEFD3;  --warning-border:#F2D49A;
    --danger:#B8542C;   --danger-fill:#F7E6E1;   --danger-border:#E8C4B4;  /* = --rust */
    --info:#2C6E8F;     --info-fill:#EAF2F5;     --info-border:#C3D8E2;    /* = --blue */
    --link:#1a3a8f;                                                        /* text links only */
    /* Radii — reduced to 3 institutional steps (+ pill). Card/modal keep their
       current 14/16px; small controls settle on 8px (was 8–10). */
    --r-sm:8px; --r-md:14px; --r-lg:16px; --r-pill:999px;
    /* Spacing — the single 0.25rem grid (matches the compiled Tailwind scale) */
    --sp-1:.25rem; --sp-2:.5rem; --sp-3:.75rem; --sp-4:1rem; --sp-5:1.25rem; --sp-6:1.5rem;
    /* Named spacing roles (for hand-written component CSS) */
    --pad-card:1.25rem;           /* p-5 */
    --pad-card-sm:1rem;           /* p-4 */
    --gap-inline:.5rem;           /* chip/action gaps */
    --gap-grid:.75rem;            /* card grids */
    --section-gap:1.5rem;         /* between page sections */
  }

  *{ -webkit-font-smoothing:antialiased; }

  body{
    font-family:var(--font-body,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif);
    color:var(--ink);
    background:var(--cream);
  }

  /* The variable hook permits later tenant activation; the current serif
     default remains unchanged until a scoped visual implementation phase. */
  .font-display{
    font-family:var(--font-display,Georgia,"Times New Roman","Iowan Old Style",Cambria,serif);
    letter-spacing:-0.01em;
  }
  .font-mono-stack{
    font-family:ui-monospace,"SF Mono","Cascadia Mono","Roboto Mono",Menlo,Consolas,monospace;
  }
  .eyebrow{
    font-size:.72rem;
    letter-spacing:.18em;
    text-transform:uppercase;
    font-weight:700;
  }

  /* ---- Signature: segmented-roundel monogram (echoes live IS4NCDs mark) ---- */
  .roundel{
    border-radius:50%;
    background:conic-gradient(
      var(--gold) 0 42%,
      var(--blue) 42% 60%,
      var(--teal) 60% 76%,
      var(--lightblue) 76% 88%,
      var(--rust) 88% 100%
    );
    position:relative;
    flex:none;
  }
  .roundel::after{
    content:"";
    position:absolute;
    inset:22%;
    border-radius:50%;
    background:var(--hub-bg,var(--charcoal));
  }
  .roundel.on-dark::after{ background:var(--charcoal); }
  .roundel.on-light::after{ background:var(--cream); }
  .roundel.on-paper::after{ background:var(--paper); }

  /* ---- Signature: spectrum accent bar (echoes live footer) ---- */
  .spectrum{
    height:6px;
    width:100%;
    background:linear-gradient(90deg,
      var(--gold) 0 52%,
      var(--blue) 52% 66%,
      var(--teal) 66% 80%,
      var(--lightblue) 80% 90%,
      var(--rust) 90% 100%);
    border:none;
  }
  .spectrum-thin{ height:3px; }

  a{ text-decoration:none; }

  /* Visible focus states everywhere */
  a:focus-visible, button:focus-visible, input:focus-visible,
  select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible{
    outline:3px solid var(--gold);
    outline-offset:2px;
    border-radius:4px;
  }

  /* ------------------------------- Header ------------------------------- */
  .topnav{ background:var(--charcoal); }
  .navlink{
    color:#EDEAE2; font-size:.9rem; font-weight:500; padding:.45rem .2rem;
    position:relative; white-space:nowrap;
  }
  .navlink:hover{ color:#fff; }
  .navlink.active{ color:#fff; }
  .navlink.active::after{
    content:""; position:absolute; left:0; right:0; bottom:-.55rem; height:3px;
    background:var(--gold); border-radius:2px;
  }
  .dropdown-panel{ display:none; }
  .dropdown.open .dropdown-panel{ display:block; }

  /* Sub-navigation (in-page) */
  .subnav-link{
    color:var(--ink-soft); font-size:.83rem; font-weight:600; padding:.85rem .15rem;
    border-bottom:3px solid transparent; white-space:nowrap;
  }
  .subnav-link:hover{ color:var(--ink); }
  .subnav-link.active{ color:var(--gold-deep); border-bottom-color:var(--gold); }

  /* ------------------------------- Hero -------------------------------- */
  .hero{
    /* CPC-01: field colors are tenant tokens (defaults = the previous
       hard-coded golds). The zero-alpha out-stops use `transparent` —
       identical rendering under CSS premultiplied gradient
       interpolation, and hue-correct under any tenant override. */
    background:
      radial-gradient(120% 120% at 88% -10%, var(--hero-glow-a) 0%, transparent 55%),
      radial-gradient(120% 130% at 5% 120%, var(--hero-glow-b) 0%, transparent 50%),
      linear-gradient(135deg,var(--hero-grad-from) 0%, var(--hero-grad-mid) 55%, var(--hero-grad-to) 100%);
    position:relative; overflow:hidden;
  }
  /* CPC-01 hero ink classes — replace the four literal color utilities
     inside the hero only; defaults equal the previous literals. */
  .hero-ink-strong{ color:var(--hero-ink-strong); }
  .hero-ink{ color:var(--hero-ink); }
  .hero-ink-soft{ color:var(--hero-ink-soft); }
  .hero-eyebrow-ink{ color:var(--hero-eyebrow-ink); }
  .hero-shape{ position:absolute; border-radius:50%; pointer-events:none; }
  .hero-ring{
    position:absolute; border-radius:50%; border:2px solid rgba(255,255,255,.18);
    pointer-events:none;
  }

  /* ------------------------------- Cards ------------------------------- */
  .card{
    background:var(--surface); border:1px solid var(--border); border-radius:var(--r-md);
  }
  .card-hover{ transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
  .card-hover:hover{
    transform:translateY(-3px);
    box-shadow:0 14px 34px -18px rgba(40,30,10,.35);
    border-color:var(--gold-soft);
  }

  .chip{
    display:inline-flex; align-items:center; gap:.4rem;
    font-size:.72rem; font-weight:700; letter-spacing:.02em;
    padding:.28rem .6rem; border-radius:var(--r-pill); border:1px solid transparent;
  }
  .chip-dot{ width:7px; height:7px; border-radius:50%; }

  .badge{
    font-size:.68rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
    padding:.2rem .5rem; border-radius:6px;
  }

  /* Form controls */
  .field{
    width:100%; border:1px solid var(--border-strong); border-radius:var(--r-sm);
    padding:.62rem .75rem; font-size:.92rem; background:var(--surface); color:var(--ink);
  }
  .field::placeholder{ color:#9a958c; }
  .field:focus{ border-color:var(--gold); }
  .field-label{ font-size:.8rem; font-weight:700; color:var(--ink); margin-bottom:.3rem; display:block; }
  .req{ color:var(--danger); }
  .field.invalid{ border-color:var(--danger); background:var(--danger-fill); }
  .err-msg{ color:var(--danger); font-size:.74rem; margin-top:.25rem; display:none; }
  .err-msg.show{ display:block; }

  .btn{
    display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
    font-weight:700; font-size:.92rem; border-radius:var(--r-sm); padding:.7rem 1.15rem;
    cursor:pointer; border:1px solid transparent; transition:background .15s ease, transform .12s ease, box-shadow .15s ease;
  }
  .btn:active{ transform:translateY(1px); }
  .btn-gold{ background:var(--gold); color:#2a1d00; }
  .btn-gold:hover{ background:var(--gold-deep); color:#fff; }
  .btn-dark{ background:var(--charcoal); color:#fff; }
  .btn-dark:hover{ background:#000; }
  .btn-ghost{ background:transparent; color:var(--ink); border-color:var(--border-strong); }
  .btn-ghost:hover{ border-color:var(--gold); background:#fff; }
  .btn-light{ background:#fff; color:var(--ink); border-color:rgba(255,255,255,.0); }
  /* PX-1B — destructive variant + size modifiers (replace copy-pasted inline
     text-/py-/px- on buttons; sizes match the values the console already used). */
  .btn-danger{ background:var(--danger); color:#fff; }
  .btn-danger:hover{ background:#9a4523; }
  .btn-sm{ font-size:.875rem; padding:.375rem .75rem; }
  .btn-xs{ font-size:.75rem; padding:.25rem .625rem; gap:.35rem; }

  /* ===== PX-1B shared component vocabulary =============================
     Canonical classes so audited surfaces stop hand-rolling equivalents.
     Reference: docs/PX-1A_AUDIT_AND_DESIGN_BASELINE.md §3.5. */
  /* Typography roles — one scale, applied by role not by arbitrary size. */
  .ds-page-title{ font-size:1.5rem; line-height:1.2; font-weight:700; color:var(--charcoal); }
  .ds-section-title{ font-size:1.05rem; line-height:1.3; font-weight:700; color:var(--charcoal); }
  .ds-card-title{ font-size:.95rem; line-height:1.35; font-weight:700; color:var(--charcoal); }
  .ds-body{ font-size:.875rem; line-height:1.55; color:var(--ink); }
  .ds-label{ font-size:.8rem; font-weight:700; color:var(--ink); }
  .ds-help{ font-size:.75rem; line-height:1.5; color:var(--muted); }
  .ds-caption{ font-size:.625rem; letter-spacing:.04em; color:var(--muted); }
  .ds-status{ font-size:.75rem; font-weight:700; }
  /* Semantic badge tints (route chip()/badge() tones through tokens) */
  .badge-success{ background:var(--success-fill); color:var(--success); }
  .badge-warning{ background:var(--warning-fill); color:var(--warning); }
  .badge-danger{ background:var(--danger-fill); color:var(--danger); }
  .badge-info{ background:var(--info-fill); color:var(--info); }
  .badge-muted{ background:var(--muted-fill); color:var(--muted); }
  .badge-accent{ background:var(--gold-wash); color:var(--charcoal); }
  /* Category chip semantic variants (pill form) */
  .chip-success{ background:var(--success-fill); color:var(--success); border-color:var(--success-border); }
  .chip-warning{ background:var(--warning-fill); color:var(--warning); border-color:var(--warning-border); }
  .chip-danger{ background:var(--danger-fill); color:var(--danger); border-color:var(--danger-border); }
  .chip-info{ background:var(--info-fill); color:var(--info); border-color:var(--info-border); }
  .chip-muted{ background:var(--muted-fill); color:var(--muted); border-color:var(--border); }
  /* Alert / feedback block (persistent, unlike the transient toast) */
  .alert{ display:flex; gap:.5rem; align-items:flex-start; border:1px solid var(--border);
    border-radius:var(--r-sm); padding:.7rem .9rem; font-size:.85rem; line-height:1.5; }
  /* An alert with nothing to say renders NOTHING: the Tailwind reset's [hidden]
     rule is :where()-wrapped (zero specificity) and loses to .alert's display,
     which painted empty pink bars. */
  .alert[hidden]{ display:none !important; }
  .alert-danger{ background:var(--danger-fill); border-color:var(--danger-border); color:var(--danger); }
  .alert-success{ background:var(--success-fill); border-color:var(--success-border); color:var(--success); }
  .alert-warning{ background:var(--warning-fill); border-color:var(--warning-border); color:#6d4a09; }
  .alert-info{ background:var(--info-fill); border-color:var(--info-border); color:var(--info); }
  /* Empty state (dashed, muted — distinct from a real card) */
  .empty-state{ border:1px dashed var(--border-strong); border-radius:var(--r-md);
    padding:1.25rem; text-align:center; color:var(--muted); font-size:.9rem; background:var(--surface); }
  /* Review panel — the canonical "reviewable item" card (drafts + questions):
     a card with a gold status rail; variants recolour the rail. */
  .review-panel{ background:var(--surface); border:1px solid var(--border);
    border-left:3px solid var(--gold); border-radius:var(--r-md); }
  .review-panel.is-approved{ border-left-color:var(--success); }
  .review-panel.is-danger{ border-left-color:var(--danger); }
  .review-panel.is-review{ border-left-color:var(--info); }
  /* Summary / KPI tile */
  .summary-card{ background:var(--surface); border:1px solid var(--border);
    border-radius:var(--r-md); padding:var(--pad-card-sm); }
  /* Table alias — promote table.adm to a semantic .table (identical rules) */
  table.table{ width:100%; border-collapse:collapse; font-size:.82rem; }
  table.table thead th{ position:sticky; top:0; background:var(--charcoal); color:#fff;
    text-align:left; font-weight:700; padding:.55rem .7rem; white-space:nowrap; }
  table.table td{ border-bottom:1px solid var(--border); padding:.5rem .7rem; vertical-align:top; }

  /* ===== PX-1E canonical state components (uses PX-1B tokens; no new system) =
     Loading is TEXT + aria-busy (+ optional reserved-layout skeleton) — no
     spinner or decorative animation, so nothing induces motion discomfort. */
  .state-inline{ color:var(--muted); font-size:.85rem; }        /* inline loading / status line */
  .state-loading{ color:var(--muted); font-size:.85rem; padding:.25rem 0; }
  .state-unavailable{ color:var(--muted); font-size:.9rem; background:var(--surface);
    border:1px dashed var(--border-strong); border-radius:var(--r-md); padding:1rem; }
  /* Reserved-layout placeholder — a STATIC tint block (prevents layout jump);
     intentionally un-animated. */
  .skeleton{ background:var(--surface-sunk); border-radius:var(--r-sm); }
  .skeleton-line{ height:.7rem; background:var(--surface-sunk); border-radius:var(--r-pill); margin:.4rem 0; }
  .skeleton-line.w-60{ width:60%; } .skeleton-line.w-40{ width:40%; } .skeleton-line.w-80{ width:80%; }

  /* ===== PX-1F responsive & accessibility hardening ======================= */
  /* Screen-reader-only text (Tailwind tree-shook its .sr-only; restore it so
     meaningful glyph-only controls can carry an accessible name). */
  .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; }
  /* Accessible, locally-scoped table scroller — used ONLY where collapsing a
     wide table would lose essential meaning. Focusable + announced so keyboard
     and AT users can reach the horizontal overflow; a subtle edge hints at it. */
  .table-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch;
    background:linear-gradient(90deg,var(--surface) 30%, rgba(255,255,255,0)),
      linear-gradient(90deg, rgba(0,0,0,.04), transparent 8px) 100% 0/12px 100% no-repeat local;
    scrollbar-width:thin; }
  .table-scroll:focus-visible{ outline:3px solid var(--gold); outline-offset:2px; }

  /* PX-1H-A: authenticated-entry transition overlay. Masks the public-shell
     flash while identity + destination resolve; hidden for signed-out visitors. */
  .auth-transition{ position:fixed; inset:0; z-index:1000; display:flex;
    align-items:center; justify-content:center;
    background:var(--cream, #FBF7EE); }
  .auth-transition.hidden{ display:none; }
  .auth-transition-card{ display:flex; flex-direction:column; align-items:center;
    gap:14px; color:var(--ink, #3a3327); font-weight:600; }
  .auth-spinner{ width:34px; height:34px; border-radius:50%;
    border:3px solid var(--gold-soft, #E7D9AE); border-top-color:var(--gold-deep, #8a6d1f);
    animation:auth-spin .8s linear infinite; }
  @keyframes auth-spin{ to{ transform:rotate(360deg); } }
  @media (prefers-reduced-motion: reduce){ .auth-spinner{ animation-duration:2s; } }

  /* ---------- PX-1H-B: Sample Completion Acknowledgement (demo artifact) ---- */
  .ack-overlay{ position:fixed; inset:0; z-index:1100; display:none; flex-direction:column;
    background:rgba(28,24,18,.55); }
  .ack-overlay.open{ display:flex; }
  .ack-toolbar{ display:flex; align-items:center; justify-content:space-between; gap:12px;
    flex-wrap:wrap; padding:10px 16px; background:var(--charcoal, #1b1b1d); color:#EDEAE2; }
  .ack-toolbar-label{ font-weight:700; font-size:.9rem; }
  .ack-toolbar-actions{ display:flex; gap:8px; }
  .ack-scroll{ flex:1; overflow:auto; -webkit-overflow-scrolling:touch; padding:24px 16px; }
  .ack-sheet{ position:relative; max-width:820px; margin:0 auto; background:#fff; color:#241f17;
    border:1px solid var(--line, #E4DCC9); border-radius:var(--r-md, 14px);
    box-shadow:0 18px 50px rgba(0,0,0,.25); padding:clamp(28px,5vw,56px); overflow:hidden; }
  .ack-ribbon{ position:absolute; top:22px; right:-52px; transform:rotate(45deg);
    background:var(--rust, #B8542C); color:#fff; font-weight:800; letter-spacing:.18em;
    font-size:.8rem; padding:6px 64px; }
  .ack-watermark{ position:absolute; inset:0; display:grid; place-items:center; pointer-events:none;
    font-weight:800; font-size:clamp(4rem,18vw,9rem); color:rgba(184,84,44,.06);
    letter-spacing:.1em; transform:rotate(-24deg); }
  .ack-head{ display:flex; align-items:center; gap:14px; position:relative; }
  .ack-logo{ height:52px; width:auto; max-width:200px; object-fit:contain; }
  /* PX-1H-C: accessible Close control — high contrast on the dark toolbar,
     visible hover + keyboard focus, ~44px touch target. */
  .ack-close{ display:inline-flex; align-items:center; gap:6px; min-height:44px; min-width:44px;
    padding:8px 16px; border-radius:var(--r-sm, 8px); font-weight:700; font-size:.9rem;
    color:#fff; background:rgba(255,255,255,.12); border:1.5px solid rgba(255,255,255,.85);
    cursor:pointer; transition:background .15s ease, border-color .15s ease; }
  .ack-close:hover{ background:rgba(255,255,255,.26); border-color:#fff; }
  .ack-close:focus-visible{ outline:3px solid var(--gold, #E2A329); outline-offset:2px; }
  .ack-close span{ font-size:1.2rem; line-height:1; }
  .ack-eyebrow{ margin-top:18px; text-transform:uppercase; letter-spacing:.16em; font-size:.72rem;
    font-weight:800; color:var(--rust, #B8542C); position:relative; }
  .ack-title{ font-family:var(--font-display, inherit); font-size:clamp(1.5rem,4vw,2.1rem);
    font-weight:800; margin-top:4px; position:relative; }
  .ack-lead{ margin-top:14px; color:#4a4235; position:relative; }
  .ack-name{ font-family:var(--font-display, inherit); font-size:clamp(1.4rem,3.5vw,1.8rem);
    font-weight:800; margin-top:2px; position:relative; }
  .ack-course{ font-size:1.1rem; font-weight:700; margin-top:2px; position:relative; }
  .ack-meta{ display:flex; flex-wrap:wrap; gap:24px; margin-top:22px; position:relative; }
  .ack-meta dt{ text-transform:uppercase; letter-spacing:.1em; font-size:.66rem; font-weight:800; color:#7a7060; }
  .ack-meta dd{ font-size:.95rem; font-weight:700; margin-top:2px; }
  .ack-statement{ margin-top:22px; font-size:.86rem; line-height:1.5; color:#4a4235;
    border-top:1px solid var(--line, #E4DCC9); padding-top:16px; position:relative; }
  .ack-sign{ margin-top:34px; position:relative; }
  .ack-sign-line{ display:block; width:min(280px,70%); height:1px; background:#241f17; }
  .ack-sign-label{ margin-top:6px; font-size:.78rem; color:#7a7060; font-weight:700; }
  .ack-footnote{ margin-top:22px; font-size:.72rem; color:#7a7060; position:relative; }

  /* Print: only the sheet, on ONE clean A4 LANDSCAPE page, when our Print action
     ran. Vertical rhythm is tightened so the certificate composition fits a
     single landscape page with readable margins and no clipping (PX-1H-C). */
  @media print{
    body.ack-print > *:not(#sampleAckOverlay){ display:none !important; }
    body.ack-print{ background:#fff !important; }
    body.ack-print #sampleAckOverlay{ position:static !important; display:block !important; background:#fff !important; }
    body.ack-print #sampleAckOverlay .ack-toolbar{ display:none !important; }
    body.ack-print #sampleAckOverlay .ack-scroll{ overflow:visible !important; padding:0 !important; }
    body.ack-print .ack-sheet{ box-shadow:none !important; border:none !important; border-radius:0 !important;
      max-width:100% !important; margin:0 auto !important; padding:18px 44px !important; overflow:hidden !important; }
    body.ack-print .ack-watermark{ font-size:7rem !important; }
    body.ack-print .ack-eyebrow{ margin-top:10px !important; }
    body.ack-print .ack-title{ font-size:1.8rem !important; }
    body.ack-print .ack-lead{ margin-top:8px !important; }
    body.ack-print .ack-name{ font-size:1.6rem !important; }
    body.ack-print .ack-meta{ margin-top:14px !important; }
    body.ack-print .ack-statement{ margin-top:14px !important; padding-top:10px !important; }
    body.ack-print .ack-sign{ margin-top:22px !important; }
    body.ack-print .ack-footnote{ margin-top:14px !important; }
    @page{ size:A4 landscape; margin:12mm; }
  }

  /* Tabs (capabilities + modal) */
  .tabbtn{
    font-weight:700; font-size:.86rem; padding:.6rem .95rem; border-radius:9px;
    color:var(--ink-soft); cursor:pointer; border:1px solid transparent; background:transparent;
  }
  .tabbtn:hover{ color:var(--ink); }
  .tabbtn.active{ background:var(--charcoal); color:#fff; }
  .modal-tab{
    font-size:.8rem; font-weight:700; padding:.5rem .7rem; border-radius:8px;
    color:var(--ink-soft); cursor:pointer; background:transparent; border:1px solid transparent;
    white-space:nowrap;
  }
  .modal-tab.active{ background:var(--gold-wash); color:var(--gold-deep); border-color:var(--gold-soft); }

  .tabpane, .modal-pane{ display:none; }
  .tabpane.active, .modal-pane.active{ display:block; animation:fade .25s ease; }
  @keyframes fade{ from{opacity:0; transform:translateY(4px);} to{opacity:1; transform:none;} }

  /* Readiness / progress bars */
  .bar{ height:7px; background:#EEE7D8; border-radius:999px; overflow:hidden; }
  .bar > span{ display:block; height:100%; border-radius:999px; background:linear-gradient(90deg,var(--gold),var(--gold-deep)); }

  /* Roadmap timeline */
  .phase-line{ position:relative; }
  .phase-line::before{
    content:""; position:absolute; left:13px; top:6px; bottom:6px; width:2px; background:var(--line-2);
  }
  .phase-dot{
    width:28px; height:28px; border-radius:50%; flex:none; display:grid; place-items:center;
    font-size:.72rem; font-weight:800; color:#fff; position:relative; z-index:1;
  }

  /* Modal */
  .modal-backdrop{
    position:fixed; inset:0; background:rgba(20,16,8,.55); backdrop-filter:blur(2px);
    display:none; align-items:flex-start; justify-content:center; padding:1rem; z-index:80; overflow-y:auto;
  }
  .modal-backdrop.open{ display:flex; }
  .modal-card{
    background:#fff; border-radius:16px; max-width:760px; width:100%; margin:3.5rem auto;
    box-shadow:0 30px 80px -20px rgba(0,0,0,.5); animation:pop .22s ease;
  }
  @keyframes pop{ from{opacity:0; transform:scale(.97) translateY(8px);} to{opacity:1; transform:none;} }

  /* Status banner */
  .statusbar{ background:#241F14; color:#F3ECDB; }

  /* Back to top */
  #toTop{
    position:fixed; right:18px; bottom:18px; z-index:70; width:46px; height:46px; border-radius:12px;
    background:var(--charcoal); color:#fff; display:none; align-items:center; justify-content:center;
    box-shadow:0 10px 24px -10px rgba(0,0,0,.5); cursor:pointer;
  }
  #toTop:hover{ background:#000; }
  #toTop.show{ display:flex; }

  .section-pad{ padding-top:4.5rem; padding-bottom:4.5rem; }
  .rule-label{
    display:inline-flex; align-items:center; gap:.55rem; color:var(--gold-deep);
  }
  .rule-label::before{ content:""; width:26px; height:2px; background:var(--gold); display:inline-block; }

  @media (prefers-reduced-motion: reduce){
    *{ scroll-behavior:auto !important; animation:none !important; transition:none !important; }
  }

  /* Mobile menu */
  @media (max-width:1023px){
    #mainMenu{ display:none; }
    #mainMenu.open{
      display:flex; flex-direction:column; position:absolute; top:100%; left:0; right:0;
      background:var(--charcoal-2); padding:1rem 1.25rem 1.4rem; gap:.35rem; z-index:60;
      border-top:1px solid rgba(255,255,255,.08);
    }
    #mainMenu.open .navlink.active::after{ display:none; }
    #mainMenu.open .navlink{ padding:.6rem 0; border-bottom:1px solid rgba(255,255,255,.06); }
    #mainMenu.open .dropdown-panel{ position:static; box-shadow:none; background:transparent; border:none; padding-left:.5rem; }
  }

  /* ----------------------------- App / logged-in preview ----------------------------- */
  #appView{ min-height:100vh; background:var(--cream); }
  .app-topbar{ background:var(--charcoal); color:#fff; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.7rem 1rem; position:sticky; top:0; z-index:50; flex-wrap:wrap; }
  .role-switch{ display:inline-flex; background:#33333a; border-radius:9px; padding:3px; }
  .role-btn{ font-size:.8rem; font-weight:700; color:#cfcabd; padding:.35rem .8rem; border-radius:7px; cursor:pointer; border:none; background:transparent; }
  .role-btn.active{ background:var(--gold); color:#2a1d00; }
  .app-shell{ display:flex; align-items:flex-start; }
  .app-side{ width:240px; flex:none; background:#fff; border-right:1px solid var(--line); min-height:calc(100vh - 56px); position:sticky; top:56px; align-self:flex-start; }
  .side-inner{ padding:1rem .85rem; }
  .side-link{ display:flex; align-items:center; gap:.7rem; padding:.6rem .75rem; border-radius:9px; font-size:.88rem; font-weight:600; color:var(--ink-soft); cursor:pointer; }
  .side-link:hover{ background:var(--cream); color:var(--ink); }
  .side-link.active{ background:var(--gold-wash); color:var(--gold-deep); }
  .side-link .ic{ width:8px; height:8px; border-radius:3px; background:var(--line-2); flex:none; }
  .side-link.active .ic{ background:var(--gold); }
  .side-group{ font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; font-weight:800; color:#a89f8c; padding:.9rem .75rem .3rem; }
  .app-main{ flex:1; min-width:0; }
  .app-wrap{ max-width:1040px; margin:0 auto; padding:1.5rem 1rem 3rem; }
  .avatar{ width:54px; height:54px; flex:none; border-radius:50%; background:var(--gold-deep); color:#fff; display:grid; place-items:center; font-weight:800; font-family:Georgia,serif; font-size:1.15rem; }
  .ring{ width:104px; height:104px; border-radius:50%; display:grid; place-items:center; position:relative; margin:0 auto; }
  .ring::before{ content:""; position:absolute; inset:11px; border-radius:50%; background:#fff; }
  .ring span{ position:relative; font-weight:800; color:var(--ink); font-family:Georgia,serif; font-size:1.15rem; }
  .acc-body{ display:none; }
  .acc.open .acc-body{ display:block; }
  .acc.open .acc-chev{ transform:rotate(180deg); }
  .acc-chev{ transition:transform .2s ease; flex:none; }
  .unit-dot{ width:26px; height:26px; flex:none; border-radius:50%; display:grid; place-items:center; font-size:.72rem; font-weight:800; background:#EEE7D8; color:var(--ink-soft); }
  .unit-dot.current{ background:var(--gold); color:#2a1d00; }
  .unit-dot.done{ background:#3f7a45; color:#fff; }
  .videoframe{ aspect-ratio:16/9; background:linear-gradient(135deg,#2b2b30,#1b1b1d); border-radius:14px; position:relative; overflow:hidden; display:grid; place-items:center; }
  .vf-poster{ display:grid; place-items:center; gap:.6rem; text-align:center; }
  .vf-play{ width:64px; height:64px; border-radius:50%; background:var(--gold); display:grid; place-items:center; cursor:pointer; border:none; box-shadow:0 8px 24px -8px rgba(0,0,0,.5); }
  .vf-play:hover{ background:#fff; }
  .vf-label{ color:#cfcabd; font-size:.78rem; }
  .vf-msg{ text-align:center; padding:1.5rem; max-width:420px; }
  .fx-active{ background:var(--charcoal)!important; color:#fff!important; border-color:var(--charcoal)!important; }

  @media (max-width:860px){
    .app-shell{ display:block; }
    .app-side{ width:100%; min-height:auto; position:static; border-right:none; border-bottom:1px solid var(--line); }
    .side-inner{ display:flex; gap:.4rem; overflow-x:auto; padding:.6rem .75rem; }
    .side-group{ display:none; }
    .side-link{ white-space:nowrap; }
  }

/* ===== Sandbox component additions (toast, demo, admin table) ===== */
#toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%) translateY(20px);background:var(--charcoal);color:#fff;padding:.7rem 1.1rem;border-radius:10px;font-size:.86rem;font-weight:600;box-shadow:0 12px 30px -10px rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease;z-index:120;max-width:90vw;text-align:center}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
#demoOverlay{position:fixed;inset:0;z-index:110;display:none;pointer-events:none}
#demoOverlay.open{display:block}
.demo-card{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);width:min(560px,92vw);background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 24px 60px -16px rgba(0,0,0,.45);padding:1.05rem 1.2rem;pointer-events:auto}
table.adm{width:100%;border-collapse:collapse;font-size:.8rem}
table.adm th,table.adm td{text-align:left;padding:.55rem .6rem;border-bottom:1px solid var(--line);white-space:nowrap;vertical-align:top}
table.adm th{background:var(--charcoal);color:#fff;font-weight:700;position:sticky;top:0;z-index:1}
table.adm tbody tr:hover{background:var(--cream)}
table.adm td.mono,table.adm .mono{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.74rem}
.status-sel{border:1px solid var(--line-2);border-radius:7px;padding:.2rem .4rem;font-size:.76rem;background:#fff}
.tagchip{display:inline-block;font-size:.66rem;font-weight:700;color:var(--ink-soft);background:#F3EFE4;border-radius:6px;padding:.1rem .42rem}
.btn.justify-start{justify-content:flex-start}

/* ===== v2: course builder + materials-driven delivery ===== */
.step-tabs{display:flex;flex-wrap:wrap;gap:.4rem;border-bottom:1px solid var(--line);padding-bottom:.6rem}
.step-tab{font-size:.8rem;font-weight:700;color:var(--ink-soft);background:#F3EFE4;border:1px solid var(--line);border-radius:8px;padding:.4rem .7rem;cursor:pointer}
.step-tab.active{background:var(--charcoal);color:#fff;border-color:var(--charcoal)}
.step-tab:hover{color:var(--ink)}
.step-tab.active:hover{color:#fff}
.mat-icon{flex:none;width:42px;height:42px;border-radius:9px;display:grid;place-items:center;font-size:.62rem;font-weight:800;letter-spacing:.02em;color:var(--gold-deep);background:var(--gold-wash);border:1px solid var(--gold-soft)}
.delivery-sec{font-size:.66rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:.5rem}
.mat-done{border-color:#bfe0c4;background:#FAFDF9}
.btn.w-full.justify-start{justify-content:flex-start}

/* ===== v3: LMS course page, spotlight, reports, settings ===== */
.spotlight{border-left:4px solid var(--gold)}
.snapshot{display:grid;grid-template-columns:repeat(auto-fit,minmax(78px,1fr));gap:0;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.snap-cell{padding:.55rem .4rem;text-align:center;border-right:1px solid var(--line);background:#fff}
.snap-cell:last-child{border-right:0}
.snap-n{display:block;font-family:var(--font-display,inherit);font-weight:800;font-size:1.15rem;color:var(--charcoal);line-height:1.1}
.snap-l{display:block;font-size:.6rem;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-soft);font-weight:700;margin-top:.15rem}

.lms-header{background:linear-gradient(120deg,var(--gold-wash),#fff);border:1px solid var(--line);border-radius:16px;padding:1.25rem 1.4rem}
.lms-meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.5rem;margin-top:1rem}
.lms-meta-cell{background:#fff;border:1px solid var(--line);border-radius:10px;padding:.5rem .6rem;text-align:center}
.lms-meta-k{display:block;font-size:.6rem;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft);font-weight:800}
.lms-meta-v{display:block;font-weight:700;color:var(--charcoal);font-size:.85rem;margin-top:.1rem}

.video-ph{position:relative;border-radius:14px;overflow:hidden;background:radial-gradient(120% 120% at 30% 0%,#2a2a30,var(--charcoal));aspect-ratio:16/9;display:grid;place-items:center;text-align:center;padding:1.2rem}
.video-ph-inner{max-width:30rem}
.vp-play{width:60px;height:60px;border-radius:999px;background:var(--gold);color:var(--charcoal);display:grid;place-items:center;margin:0 auto .5rem;border:0;cursor:pointer;box-shadow:0 6px 20px rgba(0,0,0,.3)}
.vp-play:hover{background:#f0b53f}
.vp-title{color:#fff;font-weight:700;font-size:1.02rem}
.vp-desc{color:#D9D5CC;font-size:.82rem;margin-top:.2rem}
.vp-meta{color:#A8A399;font-size:.7rem;margin-top:.5rem}
.vp-badge{display:inline-block;background:rgba(255,255,255,.12);color:#EDEAE2;font-size:.66rem;font-weight:700;padding:.2rem .55rem;border-radius:999px;letter-spacing:.04em}

.keypoints{background:var(--gold-wash);border:1px solid var(--gold-soft);border-radius:12px;padding:.9rem 1rem}

.uacc{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
.uacc-head{width:100%;display:flex;align-items:center;gap:.6rem;padding:.7rem .85rem;background:#fff;border:0;cursor:pointer;font-size:.9rem;color:var(--charcoal);text-align:left}
.uacc-head:hover{background:var(--cream)}
.uacc-body{display:none;padding:.2rem .95rem 1rem;border-top:1px solid var(--line)}
.uacc.open .uacc-body{display:block}
.uacc-chev{transition:transform .2s;color:var(--ink-soft)}
.uacc.open .uacc-chev{transform:rotate(180deg)}

.ustate{flex:none;width:11px;height:11px;border-radius:999px;display:inline-block;border:2px solid #fff;box-shadow:0 0 0 1px var(--line)}
.ustate-done{background:#3f9a4d}
.ustate-current{background:var(--gold-deep)}
.ustate-pending{background:#D7D2C6}

.unit-nav{width:100%;display:flex;align-items:center;gap:.55rem;padding:.5rem .6rem;border-radius:9px;border:1px solid transparent;background:transparent;cursor:pointer;color:var(--ink);text-align:left}
.unit-nav:hover{background:var(--cream)}
.unit-nav-current{background:var(--gold-wash);border-color:var(--gold-soft)}

.avatar-img{border-radius:999px;object-fit:cover;border:2px solid var(--gold-soft);display:inline-block}
.avatar-edit{position:absolute;right:-2px;bottom:-2px;width:26px;height:26px;border-radius:999px;background:var(--gold-deep);display:grid;place-items:center;border:2px solid #fff}

/* ===== WP4-4B focused PDF viewer ===================================== */
.pdfv{display:flex;flex-direction:column;height:100%;min-height:0;background:#f3f4f6;border-radius:12px;overflow:hidden}
.pdfv-toolbar{display:flex;align-items:center;gap:.25rem;padding:.4rem .5rem;background:#fff;border-bottom:1px solid var(--line,#e5e7eb);flex-wrap:wrap}
.pdfv-btn{min-width:40px;min-height:40px;display:inline-grid;place-items:center;border:1px solid var(--line,#e5e7eb);background:#fff;border-radius:8px;font-size:1.1rem;line-height:1;cursor:pointer;color:var(--ink,#1f2937);text-decoration:none;padding:0 .5rem}
.pdfv-btn:hover{background:#f3f4f6}
.pdfv-btn:focus-visible{outline:2px solid var(--gold-deep,#b8860b);outline-offset:2px}
.pdfv-btn[disabled]{opacity:.4;cursor:default}
.pdfv-page{width:3.2rem;min-height:40px;text-align:center;border:1px solid var(--line,#e5e7eb);border-radius:8px;font-size:.95rem}
.pdfv-total{font-size:.9rem;color:var(--ink-soft,#6b7280);padding:0 .25rem;white-space:nowrap}
.pdfv-sp{flex:0 0 .5rem}
.pdfv-scroller{flex:1 1 auto;min-height:0;overflow:auto;-webkit-overflow-scrolling:touch;display:flex;justify-content:center;padding:1rem;background:#e5e7eb}
.pdfv-scroller:focus-visible{outline:2px solid var(--gold-deep,#b8860b);outline-offset:-2px}
.pdfv-canvas{max-width:100%;height:auto;background:#fff;box-shadow:0 1px 6px rgba(0,0,0,.18);border-radius:2px}
.pdfv-status{padding:.75rem 1rem;font-size:.9rem;color:var(--ink-soft,#6b7280);text-align:center}
.pdfv-status[data-kind="error"]{color:#b91c1c;background:#fef2f2}
@media (max-width:640px){
  .pdfv-toolbar{gap:.2rem;padding:.35rem}
  .pdfv-btn{min-width:44px;min-height:44px}
  .pdfv-scroller{padding:.5rem}
}

/* A2-M6A operational session shell. The APCC host marker is installed by the
   existing synchronous host boot script and removed after canonical tenant +
   session resolution. All colours are existing APCC design tokens. */
html[data-bootstrap-tenant="apcc"] #authTransition.auth-transition.hidden{display:flex;background:var(--cream)}
.auth-transition [data-apcc-bootstrap-label]{display:none}
html[data-bootstrap-tenant="apcc"] #authTransition [data-auth-transition-label]{display:none}
html[data-bootstrap-tenant="apcc"] #authTransition [data-apcc-bootstrap-label]{display:inline}
.app-account-controls{display:flex;align-items:center;justify-content:flex-end;gap:.75rem;min-width:0}
.app-identity-summary{display:flex;flex-direction:column;align-items:flex-end;min-width:0;max-width:28rem}
.app-identity-summary>span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.app-context-label{font-size:.7rem;line-height:1.15;color:var(--gold-soft)}
.operational-context-grid,.operational-record-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));gap:1rem;min-width:0}
.operational-session-state{border-left:4px solid var(--gold);overflow-wrap:anywhere}
.operational-context-grid button,.operational-session-state button{min-height:44px}
@media (max-width:767px){
  .app-topbar{align-items:flex-start}
  .app-account-controls{width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:.5rem}
  .app-identity-summary{align-items:flex-start;max-width:none}
  .app-account-controls .btn{min-height:44px}
}
@media (max-width:420px){
  .app-account-controls{grid-template-columns:1fr 1fr}
  .app-identity-summary{grid-column:1/-1}
  .app-account-controls .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){ .pdfv-scroller{scroll-behavior:auto} }

/* ===== WP4-4B document viewer overlay (the document area) ============ */
.docv-overlay{position:fixed;inset:0;z-index:1000;background:rgba(15,23,42,.55);display:flex;align-items:center;justify-content:center;padding:2vh 2vw}
.docv-shell{background:#fff;border-radius:14px;width:min(1100px,96vw);height:min(94vh,100%);display:flex;flex-direction:column;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.35)}
.docv-head{display:flex;align-items:center;gap:.75rem;padding:.6rem .85rem;border-bottom:1px solid var(--line,#e5e7eb)}
.docv-title{font-weight:600;color:var(--ink,#1f2937);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.docv-close{min-width:44px;min-height:44px;border:1px solid var(--line,#e5e7eb);background:#fff;border-radius:8px;font-size:1rem;cursor:pointer;color:var(--ink,#1f2937)}
.docv-close:hover{background:#f3f4f6}
.docv-close:focus-visible{outline:2px solid var(--gold-deep,#b8860b);outline-offset:2px}
.docv-body{flex:1 1 auto;min-height:0;display:flex}
.docv-body>.pdfv{flex:1;border-radius:0}
@media (max-width:640px){ .docv-overlay{padding:0} .docv-shell{width:100vw;height:100vh;border-radius:0} }

/* ===== WP4-4C integrated lesson workspace ============================ */
.lw{display:flex;flex-direction:column;min-height:0}
.lw-tabs{display:flex;gap:.25rem;flex-wrap:wrap;border-bottom:1px solid var(--line,#e5e7eb);padding-bottom:.4rem;margin-bottom:.75rem}
.lw-tab{min-height:40px;padding:.4rem .8rem;border:1px solid transparent;border-radius:8px 8px 0 0;background:transparent;font-size:.9rem;font-weight:600;color:var(--ink-soft,#6b7280);cursor:pointer}
.lw-tab:hover{color:var(--ink,#1f2937);background:#f3f4f6}
.lw-tab[aria-selected="true"]{color:var(--gold-deep,#b8860b);border-color:var(--line,#e5e7eb);border-bottom-color:#fff;background:#fff}
.lw-tab:focus-visible{outline:2px solid var(--gold-deep,#b8860b);outline-offset:2px}
.lw-panel{min-height:0}
.lw-panel:focus-visible{outline:2px solid var(--gold-deep,#b8860b);outline-offset:2px;border-radius:8px}
.lw-empty,.lw-status{padding:1rem;color:var(--ink-soft,#6b7280);font-size:.9rem;text-align:center}
.lw-status.lw-error,.lw-error{color:#b91c1c}
.lw-viewer-host{height:min(70vh,640px);min-height:320px;border:1px solid var(--line,#e5e7eb);border-radius:12px;overflow:hidden}
.lw-viewer-host>.pdfv{height:100%}
.lw-subnav{display:flex;gap:.35rem;flex-wrap:wrap;margin-bottom:.6rem}
.lw-subtab{min-height:40px;padding:.35rem .7rem;border:1px solid var(--line,#e5e7eb);border-radius:8px;background:#fff;font-size:.85rem;cursor:pointer}
.lw-subtab[aria-pressed="true"]{background:var(--gold-wash,#faf6ec);border-color:var(--gold-soft,#e7d9a8);color:var(--gold-deep,#b8860b);font-weight:600}
.lw-transcript{max-height:min(70vh,640px);overflow:auto;white-space:pre-wrap;font-size:.95rem;line-height:1.6;color:var(--ink,#1f2937);background:#fff;border:1px solid var(--line,#e5e7eb);border-radius:12px;padding:1rem}
.lw-notes{font-size:.95rem;line-height:1.7;color:var(--ink,#1f2937)}
.lw-notes h1,.lw-notes h2,.lw-notes h3{font-weight:700;margin:.75rem 0 .35rem}
.lw-notes a{color:var(--gold-deep,#b8860b);text-decoration:underline}
.lw-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.5rem}
.lw-links a,.lw-dl-off{display:inline-flex;align-items:center;gap:.5rem;min-height:44px;padding:.5rem .75rem;border:1px solid var(--line,#e5e7eb);border-radius:10px;text-decoration:none;color:var(--ink,#1f2937);font-size:.92rem}
.lw-links a:hover{background:#f3f4f6}
.lw-ext-badge{font-size:.7rem;color:var(--blue,#2563eb);font-weight:600}
.lw-muted{color:var(--ink-soft,#6b7280);font-size:.8rem}
.lw-video+.lw-video{margin-top:1rem}
.lw-video-title{font-weight:600;color:var(--ink,#1f2937);margin-bottom:.4rem}
.lw-video-host{position:relative;background:#0b1220;border-radius:12px;overflow:hidden;aspect-ratio:16/9;display:grid;place-items:center}
.lw-video-host .lw-status{color:#e5e7eb}
.lw-stream{position:absolute;inset:0;width:100%;height:100%;border:0}
@media (max-width:640px){
  .lw-tab{padding:.4rem .6rem;font-size:.85rem}
  .lw-viewer-host{height:min(72vh,560px)}
  .lw-links a,.lw-dl-off,.lw-tab{min-height:44px}
}

/* ===== WP5B — learner assessment experience (.as-*) ===== */
.as{display:block}
.as-title{font-weight:800;color:var(--charcoal,#222);margin:.9rem 0 .35rem;font-size:1rem}
.as-title:first-child{margin-top:0}
.as-line{font-size:.9rem;color:var(--ink,#333);margin:.25rem 0}
.as-muted{color:var(--ink-soft,#666);font-size:.82rem}
.as-status{font-size:.86rem;color:var(--ink-soft,#666);margin:.4rem 0}
.as-error{color:var(--rust,#a33)}
.as-pass{color:#2f6b36;font-weight:700}
.as-retry{color:var(--rust,#a33);font-weight:700}
.as-badge{background:var(--gold,#e2a329);color:#fff;border-radius:.5rem;padding:.05rem .45rem;font-size:.7rem;font-weight:700;margin-left:.35rem}
.as-bar{height:8px;background:var(--line,#e5e0d5);border-radius:99px;overflow:hidden;margin:.3rem 0 .6rem}
.as-bar span{display:block;height:100%;background:var(--gold-deep,#b07d18);border-radius:99px}
.as-mods{list-style:none;margin:.3rem 0 .6rem;padding:0}
.as-mod{display:flex;align-items:center;gap:.5rem;font-size:.88rem;padding:.3rem 0;color:var(--ink,#333)}
.as-mod-done{color:#2f6b36}
.as-mod-cur{font-weight:700}
.as-attempts{list-style:none;margin:.2rem 0 .5rem;padding:0;font-size:.84rem;color:var(--ink-soft,#666)}
.as-missing{list-style:none;margin:.2rem 0;padding:0;font-size:.86rem;color:var(--ink,#333)}
.as-btn{min-height:44px;padding:.5rem 1rem;border:1px solid var(--line,#d8d2c4);border-radius:.6rem;background:#fff;font-weight:700;font-size:.9rem;cursor:pointer;color:var(--ink,#333)}
.as-btn:focus-visible{outline:3px solid var(--gold,#e2a329);outline-offset:2px}
.as-primary{background:var(--gold,#e2a329);border-color:var(--gold,#e2a329);color:#fff}
.as-mini{min-height:44px;min-width:44px;padding:.2rem .5rem}
.as-actions{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:.8rem}
.as-q{border:1px solid var(--line,#e5e0d5);border-radius:.7rem;padding:.8rem .9rem;margin:.7rem 0}
.as-q legend{font-weight:700;font-size:.92rem;color:var(--charcoal,#222);padding:0 .25rem}
.as-qnum{font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft,#888);margin:0 0 .15rem}
.as-opt{display:flex;align-items:center;gap:.55rem;padding:.45rem .3rem;min-height:44px;font-size:.9rem;cursor:pointer}
.as-opt input{width:1.1rem;height:1.1rem;accent-color:var(--gold-deep,#b07d18)}
.as-match{display:flex;align-items:center;justify-content:space-between;gap:.7rem;padding:.35rem 0;font-size:.9rem;flex-wrap:wrap}
.as-match select{min-height:44px;border:1px solid var(--line,#d8d2c4);border-radius:.5rem;padding:.3rem .5rem;font-size:.88rem;max-width:100%}
.as-order{list-style:none;margin:.3rem 0;padding:0}
.as-order li{display:flex;align-items:center;justify-content:space-between;gap:.6rem;border:1px solid var(--line,#e5e0d5);border-radius:.5rem;padding:.45rem .6rem;margin:.3rem 0;font-size:.9rem}
.as-ordbtns{display:flex;gap:.3rem}
.as-q textarea{width:100%;border:1px solid var(--line,#d8d2c4);border-radius:.5rem;padding:.5rem;font-size:.9rem;margin-top:.3rem}
.as-form{margin:0}
.as-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.as-fb{list-style:none;margin:.6rem 0;padding:0;counter-reset:fb}
.as-fbitem{border:1px solid var(--line,#e5e0d5);border-radius:.7rem;padding:.7rem .9rem;margin:.55rem 0}
.as-why{font-size:.88rem;color:var(--ink,#333);margin:.3rem 0}
.as-refs{list-style:none;margin:.25rem 0;padding:0;font-size:.82rem;color:var(--ink-soft,#666)}
.as-reco{font-size:.88rem;font-weight:700;color:var(--gold-deep,#8a6414);margin:.35rem 0 0}
.as-ack .as-ackdl{display:grid;grid-template-columns:auto 1fr;gap:.25rem .9rem;font-size:.9rem;margin:.6rem 0}
.as-ackdl dt{font-weight:700;color:var(--ink-soft,#666)}
.as-ackdl dd{margin:0;word-break:break-word}
@media (max-width:640px){
  .as-match{flex-direction:column;align-items:stretch}
  .as-actions .as-btn{flex:1}
  .as-ack .as-ackdl{grid-template-columns:1fr}
}

/* ===== WP5C — learning intelligence (.li-*) ===== */
.li{display:block}
.li-status{font-size:.86rem;color:var(--ink-soft,#666);margin:.35rem 0}
.li-error{color:var(--rust,#a33)}
.li-muted{color:var(--ink-soft,#888);font-weight:400;font-size:.78rem}
.li-cohort{font-size:.82rem;background:#fdf6e3;border:1px solid var(--gold,#e2a329);border-radius:.5rem;padding:.45rem .6rem;color:#6b5312;margin:.3rem 0 .6rem}
.li-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.5rem;margin:.4rem 0 .8rem}
.li-tile{border:1px solid var(--line,#e5e0d5);border-radius:.6rem;padding:.5rem .6rem;display:flex;flex-direction:column;gap:.15rem}
.li-k{font-size:.68rem;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-soft,#888)}
.li-v{font-weight:800;font-size:.95rem;color:var(--charcoal,#222)}
.li-sub{font-weight:800;font-size:.95rem;color:var(--charcoal,#222);margin:.8rem 0 .3rem}
.li-recs{list-style:none;margin:.3rem 0;padding:0}
.li-rec{border-left:4px solid var(--line,#ccc);padding:.4rem .6rem;margin:.3rem 0;font-size:.88rem;background:var(--paper,#faf8f3);border-radius:0 .4rem .4rem 0}
.li-high{border-left-color:var(--rust,#a33)}
.li-warn{border-left-color:var(--gold,#e2a329)}
.li-info{border-left-color:#7a9bb8}
.li-badge{font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;margin-right:.35rem;color:var(--ink-soft,#666)}
.li-details{border:1px solid var(--line,#e5e0d5);border-radius:.6rem;margin:.4rem 0;padding:.35rem .6rem}
.li-details summary{cursor:pointer;font-weight:700;font-size:.88rem;min-height:44px;display:flex;align-items:center}
.li-details summary:focus-visible{outline:3px solid var(--gold,#e2a329);outline-offset:2px}
.li-list{font-size:.84rem;color:var(--ink,#333);margin:.3rem 0 .4rem;padding-left:1.1rem}
.li-list li{margin:.25rem 0}
.li-actions{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:.7rem}
.li-btn{min-height:44px;padding:.5rem 1rem;border:1px solid var(--line,#d8d2c4);border-radius:.6rem;background:#fff;font-weight:700;font-size:.88rem;cursor:pointer}
.li-btn:focus-visible{outline:3px solid var(--gold,#e2a329);outline-offset:2px}
.li-privacy{font-size:.76rem;color:var(--ink-soft,#888);border-top:1px dashed var(--line,#e5e0d5);margin-top:.8rem;padding-top:.5rem}
@media (max-width:640px){ .li-tiles{grid-template-columns:repeat(2,1fr)} .li-actions .li-btn{flex:1} }

/* ===== PV-17A: shared dashboard design system (presentation only) =====
   Scoped to the authenticated dashboards (.dash-*, .stat*, app shell). No
   business logic; consistent hierarchy across Learner / Educator / Admin. */
.dash-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:.8rem 1.2rem;margin-bottom:1.25rem}
.dash-head h1{font-family:Georgia,'Times New Roman',serif;font-size:1.45rem;font-weight:800;color:var(--charcoal);line-height:1.2}
.dash-head .dash-sub{font-size:.85rem;color:var(--ink-soft);margin-top:.2rem;max-width:46rem}
.dash-actions{display:flex;flex-wrap:wrap;gap:.5rem}
.dash-sec{display:flex;align-items:baseline;justify-content:space-between;gap:.75rem;margin:0 0 .75rem}
.dash-sec h2{font-weight:700;color:var(--charcoal);font-size:1rem}
.dash-sec .sec-link{font-size:.82rem;font-weight:700;color:var(--gold-deep);white-space:nowrap}
.dash-sec .sec-link:hover{text-decoration:underline}
/* Stat tiles: one consistent metric card for all three dashboards. */
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.75rem;margin-bottom:1.5rem}
.stat{display:block;text-align:left;background:var(--surface,#fff);border:1px solid var(--line);border-radius:12px;padding:.85rem .95rem;min-height:74px}
button.stat{cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease}
button.stat:hover{border-color:var(--gold-soft);box-shadow:0 4px 14px -8px rgba(0,0,0,.18)}
button.stat:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.stat-n{display:block;font-family:Georgia,serif;font-weight:800;font-size:1.45rem;line-height:1.15;color:var(--charcoal);overflow-wrap:anywhere}
.stat-l{display:block;font-size:.68rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-soft);margin-top:.2rem}
.stat--attn{border-left:4px solid var(--gold)}
/* Hero continue-learning panel (learner): the ONE dominant action. */
.dash-hero{background:linear-gradient(120deg,var(--gold-wash),#fff 62%);border:1px solid var(--gold-soft);border-left:4px solid var(--gold);border-radius:14px;padding:1.1rem 1.25rem;margin-bottom:1.25rem}
.dash-hero .hero-kicker{font-size:.66rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep)}
.dash-hero h2{font-family:Georgia,serif;font-weight:800;font-size:1.2rem;color:var(--charcoal);margin:.25rem 0 .1rem;overflow-wrap:anywhere}
/* Identity strip (slim profile row — progressive disclosure of the old spotlight). */
.id-strip{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap}
.id-strip .avatar{width:46px;height:46px;font-size:1rem}
/* Empty + loading states. */
.empty{border:1px dashed var(--line-2);border-radius:12px;padding:1.4rem 1.2rem;text-align:center;color:var(--ink-soft);font-size:.9rem;background:#fff}
.skel{position:relative;overflow:hidden;background:#f1ede3;border-radius:8px;min-height:14px}
.skel::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.7),transparent);animation:skel 1.4s infinite}
@keyframes skel{100%{transform:translateX(100%)}}
@media (prefers-reduced-motion:reduce){.skel::after{animation:none}button.stat{transition:none}}
/* Desktop: use wide screens without letting lines sprawl. */
@media (min-width:1280px){.app-wrap{max-width:1120px}}
/* App topbar on narrow screens: keep controls reachable, never clipped. */
@media (max-width:640px){
  .app-topbar{padding:.55rem .75rem;gap:.5rem}
  .app-topbar .btn{padding:.35rem .6rem;font-size:.78rem}
  #appUserName{display:none}
  #appRoleLabel{max-width:46vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
/* Mobile side-nav chip strip: sticky, snappable, obvious active state. */
@media (max-width:860px){
  .app-side{position:sticky;top:52px;z-index:40;box-shadow:0 6px 14px -12px rgba(0,0,0,.25)}
  .side-inner{scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
  .side-link{scroll-snap-align:start;min-height:44px;align-items:center}
  .side-link.active{box-shadow:inset 0 0 0 1px var(--gold-soft)}
}
.side-link:focus-visible{outline:3px solid var(--gold);outline-offset:-3px}

/* ===== APCC A2-M5B: reconciliation preview responsiveness =====
   Scoped to this workspace so shared application layouts are unchanged. */
.a2m5b-verification-root,.a2m5b-workspace,#importWorkspaceBody{width:100%;min-width:0;max-width:100%}
.a2m5b-workspace .banner,.import-workspace-banner{display:flex;align-items:flex-start;gap:.65rem;padding:.8rem .9rem;border:1px solid var(--line);border-radius:.7rem;overflow-wrap:anywhere}
.a2m5b-workspace .banner>span:last-child,.a2m5b-preview-copy{min-width:0;flex:1 1 auto}
.a2m5b-workspace .a2m5b-preview-banner{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:start}
.a2m5b-preview-controls{display:flex;align-items:end;gap:.5rem;min-width:0}
.a2m5b-preview-controls label{display:grid;gap:.25rem;min-width:0}
.a2m5b-preview-controls .field{width:auto;max-width:100%;min-height:44px}
.a2m5b-view-tabs{max-width:100%}
.a2m5b-table-scroll{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.a2m5b-table-scroll:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.a2m5b-action-group .btn{min-height:44px;white-space:normal}

/* APCC-A2-M5C operational conference workspace. Tables scroll inside their
   own labelled regions; the page itself never needs horizontal scrolling. */
.a2m5c-workspace{width:100%;max-width:100%;min-width:0;overflow-wrap:anywhere}
.a2m5c-tabs{max-width:100%}
.a2m5c-table-scroll{width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.a2m5c-table-scroll:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.a2m5c-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem 1rem}
.a2m5c-detail-grid dt{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft)}
.a2m5c-detail-grid dd{margin-top:.15rem;overflow-wrap:anywhere}
.a2m5c-workspace button,.a2m5c-workspace select{min-height:44px}
.a2m5c-review-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(22rem,.85fr);gap:1rem;align-items:start}
.a2m5c-abstract-pane{max-height:calc(100vh - 12rem);overflow-y:auto}
.a2m5c-review-pane{position:sticky;top:1rem;max-height:calc(100vh - 2rem);overflow-y:auto}
.a2m6b0-breadcrumbs{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;color:var(--ink-soft);font-weight:700}
.a2m6b0-breadcrumbs span+span:before{content:'›';margin-right:.5rem;color:var(--gold)}
.a2m6b0-form{display:grid;gap:.75rem;align-content:start}
.a2m6b0-form input,.a2m6b0-form select{min-height:44px;width:100%}
.a2m6b0-tree{min-width:0;overflow-wrap:anywhere}
@media (max-width:640px){
  .a2m5b-workspace .a2m5b-preview-banner{grid-template-columns:auto minmax(0,1fr)}
  .a2m5b-preview-controls{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr);width:100%}
  .a2m5b-preview-controls .field,.a2m5b-preview-controls .btn{width:100%;min-height:44px}
  .a2m5b-view-tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;padding-bottom:.25rem}
  .a2m5b-view-tabs .step-tab{flex:0 0 auto;min-height:44px;scroll-snap-align:start}
  .a2m5b-action-group{width:100%}
  .a2m5b-action-group .btn{flex:1 1 9rem}
  .a2m5b-workspace .card{min-width:0;overflow-wrap:anywhere}
  .a2m5c-tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:.25rem}
  .a2m5c-tabs .step-tab{flex:0 0 auto;min-height:44px;scroll-snap-align:start}
  .a2m5c-detail-grid{grid-template-columns:minmax(0,1fr)}
  .a2m5c-review-grid{grid-template-columns:minmax(0,1fr)}
  .a2m5c-abstract-pane,.a2m5c-review-pane{position:static;max-height:none;overflow:visible}
  .a2m5c-workspace .card{min-width:0}
}

/* ===== IS4NCDs official brand foundation ==================================
   R2A establishes the authoritative tenant-scoped palette and safe font
   stacks without migrating shared components or the accepted page layouts.
   Acumin Variable Concept and Aptos are not bundled: the heading stack below
   is INTERIM and neither stack is wired into the wider UI in this increment. */
html[data-tenant="is4ncds"]{
  --is4ncds-golden-yellow:#E89E27;
  --is4ncds-deep-blue:#1F5690;
  --is4ncds-burnt-sienna:#9F3E22;
  --is4ncds-slate-teal:#416B6E;
  --is4ncds-cyan:#6CACB2;
  --is4ncds-charcoal-black:#222222;
  --is4ncds-light-grey:#E6E7E8;
  --is4ncds-font-body:"Aptos","Segoe UI",Arial,sans-serif;
  --is4ncds-font-heading-official:"Acumin Variable Concept","Arial Nova",Arial,"Helvetica Neue",sans-serif;
  --is4ncds-font-heading-interim:"Arial Nova",Arial,"Helvetica Neue",sans-serif;
}

/* The supplied reverse artwork is approved for the official Deep Blue
   surface. Header geometry and shared primitives remain unchanged. */
html[data-tenant="is4ncds"] .topnav,
html[data-tenant="is4ncds"] .app-topbar{
  background:var(--is4ncds-deep-blue);
}
html[data-tenant="is4ncds"] .public-brand-product,
html[data-tenant="is4ncds"] .app-topbar #appRoleLabel{
  color:var(--is4ncds-light-grey);
}

/* Official artwork is supplied as immutable SVG. These rules control only
   the surrounding lock-up dimensions and keep product/environment text as
   separate interface copy. */
.tenant-brand-picture{ display:block; flex:none; line-height:0; }
.tenant-brand-picture[hidden]{ display:none; }
.tenant-brand-picture img{ display:block; object-fit:contain; }
html[data-tenant="is4ncds"] .tenant-brand-picture--public img{
  width:auto !important; height:36px !important; max-width:180px;
}
html[data-tenant="is4ncds"] .tenant-brand-picture--workspace img{
  width:30px !important; height:30px !important;
}
html[data-tenant="is4ncds"] .tenant-brand-picture--footer img{
  width:auto !important; height:40px !important; max-width:200px;
}
html[data-tenant="is4ncds"] .public-brand-name{ display:none; }
html[data-tenant="is4ncds"] .public-brand-product{
  font-family:var(--is4ncds-font-body);
}
@media (max-width:639px){
  html[data-tenant="is4ncds"] .tenant-brand-picture--public img{
    width:38px !important; height:38px !important;
  }
}

/* R2E1 — IS4NCDs Programme Administrator EOI queue presentation.
   The shared queue data, controls and bulk workflow remain in the DOM; only
   the official tenant receives this denser presentation and privacy layer. */
html[data-tenant="is4ncds"] .eoi-queue-summary{
  font-family:var(--is4ncds-font-body);
}
html[data-tenant="is4ncds"] .eoi-queue-toolbar{
  display:flex; align-items:center; gap:.75rem; width:100%;
}
html[data-tenant="is4ncds"] .eoi-queue-toolbar-filters{
  display:grid; grid-template-columns:minmax(13rem,1.25fr) minmax(13rem,1.05fr)
    minmax(8.25rem,.68fr) minmax(9.5rem,.78fr);
  align-items:center; gap:.5rem; flex:1 1 auto; min-width:0;
}
html[data-tenant="is4ncds"] .eoi-queue-search-group{
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.4rem; min-width:0;
}
html[data-tenant="is4ncds"] .eoi-queue-toolbar .field{
  width:100%; min-width:0; max-width:none;
}
html[data-tenant="is4ncds"] .eoi-queue-toolbar [data-eoi-sort]{
  display:none;
}
html[data-tenant="is4ncds"] .eoi-queue-pagination{
  display:flex; align-items:center; justify-content:flex-end; gap:.45rem;
  flex:0 0 auto; white-space:nowrap;
}

html[data-tenant="is4ncds"] .eoi-queue-table{
  width:100%; min-width:56rem; table-layout:auto;
  font-family:var(--is4ncds-font-body); font-size:.8rem;
}
html[data-tenant="is4ncds"] .eoi-queue-table th,
html[data-tenant="is4ncds"] .eoi-queue-table td{
  padding:.52rem .5rem;
}
html[data-tenant="is4ncds"] .eoi-queue-table th{
  background:#EDF3F8; color:#173F69;
  border-bottom:2px solid rgba(31,86,144,.24);
  font-size:.7rem; letter-spacing:.045em; text-transform:uppercase;
}
html[data-tenant="is4ncds"] .eoi-queue-table .eoi-queue-select{
  width:2.5rem; text-align:center;
}
html[data-tenant="is4ncds"] .eoi-queue-table .eoi-queue-applicant{
  min-width:8.5rem; white-space:normal;
}
html[data-tenant="is4ncds"] .eoi-queue-table .eoi-queue-course{
  width:32%; max-width:21rem; min-width:14rem;
  white-space:normal; overflow-wrap:anywhere; line-height:1.35;
}
html[data-tenant="is4ncds"] .eoi-queue-table .eoi-queue-submitted{
  width:7.5rem;
}
html[data-tenant="is4ncds"] .eoi-queue-table .eoi-queue-status,
html[data-tenant="is4ncds"] .eoi-queue-table .eoi-queue-screening{
  width:8.25rem;
}
html[data-tenant="is4ncds"] .eoi-queue-table .eoi-queue-outcome{
  width:9rem;
}
html[data-tenant="is4ncds"] .eoi-queue-table .eoi-queue-review{
  width:5rem; text-align:right;
}
html[data-tenant="is4ncds"] .eoi-queue-applicant-email,
html[data-tenant="is4ncds"] .eoi-queue-score{
  display:none;
}
html[data-tenant="is4ncds"] .eoi-queue-outcome-empty{
  color:var(--ink-soft); opacity:.38; font-size:.75rem;
}
html[data-tenant="is4ncds"] .eoi-queue-outcome-value{
  display:inline-flex; align-items:center; min-height:1.6rem;
  padding:.18rem .52rem; border:1px solid rgba(31,86,144,.2);
  border-radius:999px; background:rgba(31,86,144,.08);
  color:#173F69; font-size:.72rem; font-weight:700; line-height:1.2;
  white-space:normal;
}
html[data-tenant="is4ncds"] #alEoiBulkBar[hidden]{
  display:none;
}
html[data-tenant="is4ncds"] .eoi-queue-bulk-context{
  line-height:1.45; overflow-wrap:anywhere;
}
html[data-tenant="is4ncds"] .eoi-bulk-ineligible{ color:var(--ink-soft); opacity:.48; }
html[data-tenant="is4ncds"] .eoi-bulk-panel{ border-top:3px solid var(--is4ncds-golden-yellow); }
html[data-tenant="is4ncds"] .eoi-bulk-preview{
  margin-top:1rem; padding:1rem; border:1px solid rgba(31,86,144,.22);
  border-radius:var(--r-md); background:#F7FAFD;
}
html[data-tenant="is4ncds"] .eoi-bulk-preview > ul,
html[data-tenant="is4ncds"] .eoi-bulk-result-list{
  display:grid; gap:.5rem; margin-top:.8rem;
}
html[data-tenant="is4ncds"] .eoi-bulk-preview > ul > li{
  display:grid; grid-template-columns:minmax(9rem,.8fr) minmax(14rem,1.4fr) auto;
  gap:.75rem; align-items:start; padding:.55rem .65rem;
  border:1px solid var(--line); border-radius:.45rem; background:#fff;
  font-size:.78rem; line-height:1.4;
}
html[data-tenant="is4ncds"] .eoi-bulk-preview > ul > li span{ overflow-wrap:anywhere; }
html[data-tenant="is4ncds"] .eoi-bulk-result:focus{ outline:3px solid rgba(31,86,144,.28); outline-offset:3px; }
html[data-tenant="is4ncds"] .eoi-bulk-result-list > li{
  display:grid; grid-template-columns:minmax(14rem,1.25fr) minmax(12rem,.75fr);
  gap:.75rem; padding:.65rem .75rem; border-left:4px solid #4F7D58;
  background:#F3F8F4; font-size:.8rem; line-height:1.4;
}
html[data-tenant="is4ncds"] .eoi-bulk-result-list > li.is-failure{
  border-left-color:var(--rust); background:#FFF7F3;
}
html[data-tenant="is4ncds"] .eoi-bulk-result-list > li > div:first-child{ display:grid; }
html[data-tenant="is4ncds"] .eoi-bulk-result-list > li span{ overflow-wrap:anywhere; }

@media (max-width:768px){
  html[data-tenant="is4ncds"] .eoi-bulk-preview > ul > li,
  html[data-tenant="is4ncds"] .eoi-bulk-result-list > li{ grid-template-columns:minmax(0,1fr); gap:.3rem; }
}

/* R2E2 — IS4NCDs Programme Administrator EOI applicant review detail.
   The queue, shared workspace shell and review behaviours are unchanged;
   these selectors organise only the expanded, individual EOI record. */
html[data-tenant="is4ncds"] .eoi-review-detail{
  max-width:72rem; margin:0 auto; font-family:var(--is4ncds-font-body);
}
html[data-tenant="is4ncds"] .eoi-review-header{
  padding:1.35rem 1.5rem; border-top:4px solid var(--is4ncds-golden-yellow);
}
html[data-tenant="is4ncds"] .eoi-review-header .eyebrow{
  color:var(--is4ncds-deep-blue);
}
html[data-tenant="is4ncds"] .eoi-review-title-row{
  display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; margin-top:.35rem;
}
html[data-tenant="is4ncds"] .eoi-review-title-row h2{
  color:var(--is4ncds-deep-blue); font-family:var(--is4ncds-font-heading-interim);
  font-size:clamp(1.45rem,2.25vw,2rem); font-weight:750; line-height:1.18; overflow-wrap:anywhere;
}
html[data-tenant="is4ncds"] .eoi-review-course{
  max-width:50rem; margin-top:.35rem; color:var(--ink); font-size:1rem; font-weight:650; line-height:1.45;
}
html[data-tenant="is4ncds"] .eoi-review-meta{
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.75rem 1rem;
  margin-top:1.2rem; padding-top:1rem; border-top:1px solid var(--line);
}
html[data-tenant="is4ncds"] .eoi-review-meta dt,
html[data-tenant="is4ncds"] .eoi-review-fact dt,
html[data-tenant="is4ncds"] .eoi-review-audit dt{
  color:var(--ink-soft); font-size:.7rem; font-weight:750; letter-spacing:.055em; line-height:1.3; text-transform:uppercase;
}
html[data-tenant="is4ncds"] .eoi-review-meta dd{
  margin-top:.2rem; color:var(--ink); font-size:.86rem; font-weight:650; line-height:1.4; overflow-wrap:anywhere;
}
html[data-tenant="is4ncds"] .eoi-review-layout{
  display:grid; grid-template-columns:minmax(0,1fr); gap:1rem; margin-top:1rem; align-items:start;
}
html[data-tenant="is4ncds"] .eoi-review-main{ padding:1.35rem 1.5rem; min-width:0; }
html[data-tenant="is4ncds"] .eoi-review-content-heading > p:last-child{
  max-width:42rem; margin-top:.25rem; color:var(--ink-soft); font-size:.84rem; line-height:1.5;
}
html[data-tenant="is4ncds"] .eoi-review-section{
  margin-top:1.5rem; padding-top:1.15rem; border-top:1px solid var(--line);
}
html[data-tenant="is4ncds"] .eoi-review-section h3,
html[data-tenant="is4ncds"] .eoi-review-rail-section > h3{
  color:var(--is4ncds-deep-blue); font-family:var(--is4ncds-font-heading-interim);
  font-size:1rem; font-weight:750; line-height:1.35;
}
html[data-tenant="is4ncds"] .eoi-review-facts{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem 1.5rem; margin-top:1rem;
}
html[data-tenant="is4ncds"] .eoi-review-fact{ min-width:0; }
html[data-tenant="is4ncds"] .eoi-review-fact--long{ grid-column:1 / -1; }
html[data-tenant="is4ncds"] .eoi-review-fact dd{
  margin-top:.28rem; color:var(--ink); font-size:.92rem; line-height:1.55;
  overflow-wrap:anywhere; white-space:pre-line;
}
html[data-tenant="is4ncds"] .eoi-review-fact--long dd{ max-width:44rem; }
html[data-tenant="is4ncds"] .eoi-review-external,
html[data-tenant="is4ncds"] .eoi-review-document a{
  color:#765114; font-weight:750; text-decoration:underline; text-underline-offset:.16em;
}
html[data-tenant="is4ncds"] .eoi-review-external:focus-visible,
html[data-tenant="is4ncds"] .eoi-review-document a:focus-visible{
  outline:3px solid var(--is4ncds-golden-yellow); outline-offset:3px;
}
html[data-tenant="is4ncds"] .eoi-review-document{ display:grid; gap:.2rem; }
html[data-tenant="is4ncds"] .eoi-review-document + .eoi-review-document{ margin-top:.65rem; }
html[data-tenant="is4ncds"] .eoi-review-document small{ color:var(--ink-soft); font-size:.76rem; }
html[data-tenant="is4ncds"] .eoi-review-notes{ display:grid; gap:.85rem; }
html[data-tenant="is4ncds"] .eoi-review-notes h3{ margin-bottom:.1rem; }
html[data-tenant="is4ncds"] .eoi-review-notes > div{
  max-width:44rem; padding:.85rem 1rem; border-left:3px solid var(--is4ncds-cyan);
  border-radius:0 8px 8px 0; background:color-mix(in srgb,var(--is4ncds-cyan) 5%,#fff);
}
html[data-tenant="is4ncds"] .eoi-review-note-label{ font-size:.78rem; font-weight:750; }
html[data-tenant="is4ncds"] .eoi-review-notes > div p:last-child{ margin-top:.25rem; font-size:.88rem; line-height:1.5; }
html[data-tenant="is4ncds"] .eoi-review-rail{ display:grid; gap:1rem; min-width:0; }
html[data-tenant="is4ncds"] .eoi-review-rail-section{ padding:1.1rem 1.15rem; min-width:0; }
html[data-tenant="is4ncds"] .eoi-review-screening summary{
  margin-top:.8rem; font-size:.84rem; font-weight:700; cursor:pointer;
}
html[data-tenant="is4ncds"] .eoi-review-screening ul{
  margin:.65rem 0 0 1.1rem; color:var(--ink-soft); font-size:.75rem; line-height:1.5;
}
html[data-tenant="is4ncds"] .eoi-review-no-screen,
html[data-tenant="is4ncds"] .eoi-review-score-hold{
  margin-top:.8rem; padding:.8rem; border-radius:8px; background:#F5F8FA;
}
html[data-tenant="is4ncds"] .eoi-review-decision details{
  padding-top:.75rem; border-top:1px solid var(--line);
}
html[data-tenant="is4ncds"] .eoi-review-decision .field{ max-width:100%; }
html[data-tenant="is4ncds"] .eoi-review-audit{ margin-top:1rem; padding:1rem 1.25rem; }
html[data-tenant="is4ncds"] .eoi-review-audit summary{
  color:var(--ink-soft); font-size:.8rem; font-weight:700; cursor:pointer;
}
html[data-tenant="is4ncds"] .eoi-review-audit dl{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.8rem 1rem; margin-top:.9rem;
}
html[data-tenant="is4ncds"] .eoi-review-audit dd{
  margin-top:.2rem; color:var(--ink-soft); font-size:.76rem; line-height:1.45; overflow-wrap:anywhere;
}

@media (min-width:1180px){
  html[data-tenant="is4ncds"] .eoi-review-layout{
    grid-template-columns:minmax(0,1fr) minmax(18rem,19rem); gap:1.25rem;
  }
}
@media (max-width:900px){
  html[data-tenant="is4ncds"] .eoi-review-meta{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  html[data-tenant="is4ncds"] .eoi-review-audit dl{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:560px){
  html[data-tenant="is4ncds"] .eoi-review-header,
  html[data-tenant="is4ncds"] .eoi-review-main{ padding:1.1rem; }
  html[data-tenant="is4ncds"] .eoi-review-title-row{ display:block; }
  html[data-tenant="is4ncds"] .eoi-review-title-row > .badge{ margin-top:.75rem; }
  html[data-tenant="is4ncds"] .eoi-review-meta,
  html[data-tenant="is4ncds"] .eoi-review-facts,
  html[data-tenant="is4ncds"] .eoi-review-audit dl{ grid-template-columns:minmax(0,1fr); }
}

@media (max-width:1199px){
  html[data-tenant="is4ncds"] .eoi-queue-toolbar{
    align-items:stretch; flex-direction:column; gap:.55rem;
  }
  html[data-tenant="is4ncds"] .eoi-queue-pagination{
    justify-content:flex-start;
  }
}
@media (max-width:900px){
  html[data-tenant="is4ncds"] .eoi-queue-toolbar-filters{
    grid-template-columns:minmax(13rem,1fr) minmax(13rem,1fr);
  }
}
@media (max-width:520px){
  html[data-tenant="is4ncds"] .eoi-queue-toolbar-filters{
    grid-template-columns:minmax(0,1fr);
  }
  html[data-tenant="is4ncds"] .eoi-queue-pagination{
    flex-wrap:wrap;
  }
}

/* ===== APCC tenant theme ==================================================
   Scoped strictly to html[data-tenant="apcc"] (set once from the resolved
   tenant config in platform.js). Mirrors the public apcc.africa design
   language — deep green #034C43, active green #148A3B, brand gold #FFC107,
   mint #EEF7F2/#E9F8EF, soft grey page #F4F7F8, sans headings, 14px radius,
   green-tinted elevation. Variable overrides only where possible so every
   component keeps its structure; IS4NCDs and the neutral shell are untouched. */
html[data-tenant="apcc"]{
  --cream:#F4F7F8; --paper:#FFFFFF; --surface:#FFFFFF;
  --line:#E2E8E5; --line-2:#D3DDD7; --border:#E2E8E5; --border-strong:#C9D6CE;
  --ink:#2B3138; --ink-soft:#55606A; --muted:#6B7280;
  --charcoal:#034C43;
  --gold:#FFC107; --gold-deep:#8A6D00; --gold-soft:#FFE59A; --gold-wash:#FFF6DA;
  --surface-sunk:#EEF7F2;
  --apcc-deep:#034C43; --apcc-active:#148A3B; --apcc-mint:#E9F8EF; --apcc-mint-bd:#BCE7CC;
  --r-md:14px;
}
html[data-tenant="apcc"] body{ background:var(--cream); }
html[data-tenant="apcc"] .font-display{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Inter",Roboto,Arial,sans-serif;
  font-weight:800; letter-spacing:-.01em;
}
html[data-tenant="apcc"] .text-charcoal{ color:var(--apcc-deep); }
html[data-tenant="apcc"] .bg-charcoal{ background-color:var(--apcc-deep); }
html[data-tenant="apcc"] .text-gold{ color:#B78600; }
html[data-tenant="apcc"] .text-gold-deep{ color:#8A6D00; }
html[data-tenant="apcc"] .bg-cream{ background-color:var(--cream); }
html[data-tenant="apcc"] .eyebrow,
html[data-tenant="apcc"] .rule-label{ color:var(--apcc-active); }
html[data-tenant="apcc"] .rule-label::before{ background:var(--apcc-active); }
html[data-tenant="apcc"] .card{
  border-radius:14px; border-color:var(--line);
  box-shadow:0 6px 20px rgba(6,75,42,.06);
}
html[data-tenant="apcc"] .badge{
  border-radius:999px; font-size:.66rem; letter-spacing:.06em; padding:.24rem .62rem;
}
html[data-tenant="apcc"] .btn{ border-radius:10px; font-weight:700; }
html[data-tenant="apcc"] .btn-gold{
  background:var(--gold); color:#3A2E00; box-shadow:0 4px 14px rgba(255,193,7,.30);
}
html[data-tenant="apcc"] .btn-gold:hover{ background:#E9B206; color:#3A2E00; }
html[data-tenant="apcc"] .btn-ghost{ color:var(--apcc-deep); border-color:#C9D6CE; }
html[data-tenant="apcc"] .btn-ghost:hover{ border-color:var(--apcc-active); background:#fff; }
html[data-tenant="apcc"] .side-link.active{ background:var(--apcc-mint); color:var(--apcc-deep); }
html[data-tenant="apcc"] .side-link.active .ic{ background:var(--apcc-active); }
html[data-tenant="apcc"] .side-link:hover{ background:#EFF5F1; color:var(--apcc-deep); }
html[data-tenant="apcc"] .side-group{ color:#6E8B7C; }
html[data-tenant="apcc"] .step-tabs{ border-bottom:0; gap:.45rem; padding-bottom:.35rem; }
html[data-tenant="apcc"] .step-tab{
  background:#fff; border:1px solid var(--line); border-radius:999px;
  padding:.45rem .95rem; color:var(--ink-soft); font-weight:600;
}
html[data-tenant="apcc"] .step-tab:hover{ border-color:var(--apcc-active); color:var(--apcc-deep); }
html[data-tenant="apcc"] .step-tab.active{
  background:var(--apcc-deep); border-color:var(--apcc-deep); color:#fff; font-weight:700;
}
html[data-tenant="apcc"] table.adm th{
  text-transform:uppercase; font-size:.68rem; letter-spacing:.08em;
  color:var(--muted); background:#F8FAF9; border-bottom:2px solid var(--line);
}
html[data-tenant="apcc"] table.adm td{ padding:.6rem .7rem; }
html[data-tenant="apcc"] table.adm tbody tr:hover td{ background:#F6FBF7; }
html[data-tenant="apcc"] .banner{ border-radius:12px; }
html[data-tenant="apcc"] .banner.warn{ background:#FFF8E1; border:1px solid var(--gold-soft); color:#5B4A12; }
html[data-tenant="apcc"] .banner.info{ background:var(--apcc-mint); border:1px solid var(--apcc-mint-bd); color:#0D4D33; }
html[data-tenant="apcc"] .field:focus{ border-color:var(--apcc-active); outline:2px solid rgba(20,138,59,.18); }
/* Workspace rhythm: calmer headings, more air, softer detail grids. */
html[data-tenant="apcc"] .a2m5c-workspace h1{ font-size:clamp(1.65rem,3vw,2.15rem); }
html[data-tenant="apcc"] .a2m5c-workspace .card{ transition:box-shadow .18s ease; }
html[data-tenant="apcc"] .a2m5c-workspace .card:hover{ box-shadow:0 10px 26px rgba(6,75,42,.10); }
html[data-tenant="apcc"] .apcc-hero{
  background:linear-gradient(135deg,#034C43 0%,#0A5E48 60%,#148A3B 130%);
  color:#fff; border-radius:16px; padding:1.6rem 1.8rem;
  box-shadow:0 14px 34px rgba(6,75,42,.22);
}
html[data-tenant="apcc"] .apcc-hero .eyebrow{ color:#BFEACD; }
html[data-tenant="apcc"] .apcc-hero h1{ color:#fff; }
html[data-tenant="apcc"] .apcc-hero .apcc-hero-meta{ color:#DCEFE2; font-size:.92rem; }
html[data-tenant="apcc"] .apcc-chip{
  display:inline-flex; align-items:center; gap:.4rem; border-radius:999px;
  background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.35);
  color:#fff; font-size:.72rem; font-weight:700; letter-spacing:.05em;
  padding:.3rem .7rem; text-transform:uppercase;
}
html[data-tenant="apcc"] .apcc-stat{
  background:#fff; border:1px solid var(--line); border-radius:14px;
  padding:1.1rem 1.2rem; box-shadow:0 6px 20px rgba(6,75,42,.06);
}
html[data-tenant="apcc"] .apcc-stat .apcc-stat-n{
  font-size:1.9rem; font-weight:800; color:var(--apcc-deep); line-height:1.1;
}
html[data-tenant="apcc"] .apcc-stat .apcc-stat-l{
  text-transform:uppercase; letter-spacing:.08em; font-size:.7rem;
  color:var(--muted); font-weight:700; margin-top:.15rem;
}
html[data-tenant="apcc"] .apcc-stat .apcc-stat-s{ font-size:.8rem; color:var(--ink-soft); margin-top:.35rem; }
html[data-tenant="apcc"] .apcc-person{
  display:flex; gap:.85rem; align-items:flex-start;
  background:#fff; border:1px solid var(--line); border-radius:14px; padding:1rem 1.1rem;
}
html[data-tenant="apcc"] .apcc-person .apcc-avatar{
  width:44px; height:44px; flex:none; border-radius:50%;
  background:var(--apcc-deep); color:#fff; display:grid; place-items:center;
  font-weight:800; letter-spacing:.02em;
}
html[data-tenant="apcc"] .apcc-lead-chip{
  display:inline-block; border-radius:999px; background:var(--gold);
  color:#3A2E00; font-size:.64rem; font-weight:800; letter-spacing:.06em;
  text-transform:uppercase; padding:.2rem .55rem;
}

/* ============================================================================
   PUBLIC EOI SURFACES — responsive typography & content width
   ----------------------------------------------------------------------------
   Scope: the three surfaces an external applicant actually reads —
   the Training Opportunities listing, an opportunity detail page, and the
   expression-of-interest form. ONE shared block, not per-module or per-title
   patches, and deliberately NOT a change to the global .field/.btn tokens:
   those are shared with the admin console and APCC, whose dense layouts are
   out of scope for this increment.

   Measured defects this fixes (real-browser, all nine real opportunities):
     * .max-w-3xl was absent from the compiled CSS, so the EOI form page had
       NO maximum width and ran the full 1440px viewport;
     * detail prose reached ~139 characters per line on desktop;
     * form labels 12.8px, inputs 14.7px (below the 16px mobile minimum, which
       makes iOS Safari zoom on focus), help text 11.5px;
     * substantive card/detail body copy sat at 14px — metadata treatment for
       applicant-facing information;
     * section headings 16–18px, flat against 30px titles.

   Everything below uses the existing tokens and scale; titles use clamp() so
   the system is fluid between breakpoints rather than correct only at four.
   ========================================================================== */

/* The design system's own 48rem step, restored (Tailwind's max-w-3xl was
   purged because nothing used it until the EOI page did). */
.max-w-3xl{ max-width:48rem; }

/* R2D2: the EOI is the only public surface that needs a wider completion
   frame. Long answers retain their own reading measure inside it. */
.eoi-page-frame{ width:100%; max-width:66rem; }
html[data-tenant="is4ncds"] #eoiFormView{ font-family:var(--is4ncds-font-body); }
html[data-tenant="is4ncds"] #eoiFormView h1,
html[data-tenant="is4ncds"] #eoiFormView h2,
html[data-tenant="is4ncds"] #eoiFormView .eoi-opportunity-title{
  font-family:var(--is4ncds-font-heading-interim);
}

/* --- shared reading measure ------------------------------------------------
   Long-form prose stays left-aligned (the existing design language) but stops
   growing past a comfortable measure on wide screens.

   The opportunity DETAIL page no longer takes its measure per element — it
   takes ONE column measure on its shell (see the restoration block below), so
   its paragraphs, lists and title cannot end up three different widths. */
#eoiFormView p:not(.eyebrow){ max-width:68ch; }

/* --- titles: fluid, never a single excessive desktop line ------------------ */
#opportunityDetailView h1,
#eoiFormView h1{
  font-size:clamp(1.65rem, 1.15rem + 1.9vw, 2.4rem);   /* 26.4px → 38.4px */
  line-height:1.2;
  overflow-wrap:break-word;
}
/* The 22ch cap belongs to the EOI form, whose title sits above a form rather
   than at the head of an article; on the detail page it was crushing an
   85-character title into five lines inside a much wider page. */
#eoiFormView h1{ max-width:22ch; }
#eoiFormView .eoi-page-heading{ max-width:48rem; }
#eoiFormView .eoi-opportunity-title{
  max-width:42rem; margin-top:.5rem; color:var(--is4ncds-deep-blue);
  font-size:clamp(1.15rem,1.02rem + .45vw,1.35rem); font-weight:700; line-height:1.35;
  overflow-wrap:break-word;
}
#opportunities h2{ font-size:clamp(1.65rem, 1.2rem + 1.9vw, 2.25rem); line-height:1.2; }

/* --- R2C1: Training Opportunity detail composition -------------------------
   The page uses a wide frame for hierarchy, then returns long-form content to
   a comfortable reading measure. Every selector is detail-scoped: the frozen
   homepage announcement, hero, opportunity grid and cards are untouched. */
#opportunityDetailView > div{ max-width:70rem; }
html[data-tenant="is4ncds"] #opportunityDetailView{
  font-family:var(--is4ncds-font-body);
}
html[data-tenant="is4ncds"] #opportunityDetailBody h1,
html[data-tenant="is4ncds"] #opportunityDetailBody h2,
html[data-tenant="is4ncds"] #opportunityDetailBody h3{
  font-family:var(--is4ncds-font-heading-interim);
}
#opportunityDetailBody .opp-detail-upper{ min-width:0; }
#opportunityDetailBody .opp-detail-primary{ min-width:0; }
#opportunityDetailBody .opp-detail-reading{ max-width:44rem; }
#opportunityDetailBody .opp-detail-intro{ max-width:42rem; }

/* The accepted Phase 1 badge language, restated for the detail page:
   the level badge carries the small identifying dot; "Accepting interest"
   is the outlined gold status (5.80:1 on white). */
#opportunityDetailBody .badge-level{ display:inline-flex; align-items:center; gap:.32rem; }
#opportunityDetailBody .badge-level::before{
  content:""; width:6px; height:6px; border-radius:50%; background:currentColor; flex:none;
}
#opportunityDetailBody .badge-open{ background:#fff; border:1px solid var(--gold-soft); color:#8a5c0f; }

/* KEY FACTS — one restrained supporting rail, using existing source values.
   Missing values render no row. The gold rule is the sole high-chroma accent. */
#opportunityDetailBody .opp-facts-rail{
  margin-top:2rem; padding:1.15rem 1.25rem 1.25rem;
  border:1px solid color-mix(in srgb,var(--is4ncds-deep-blue) 18%,#fff);
  border-top:3px solid var(--is4ncds-golden-yellow);
  border-radius:var(--radius); background:color-mix(in srgb,var(--is4ncds-deep-blue) 4%,#fff);
}
#opportunityDetailBody .opp-facts-heading{
  color:var(--is4ncds-deep-blue); font-size:1rem; font-weight:700;
  line-height:1.3; margin:0 0 .85rem;
}
#opportunityDetailBody .opp-facts{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0 1.5rem; margin:0;
}
#opportunityDetailBody .opp-fact{
  padding:.72rem 0; border-top:1px solid color-mix(in srgb,var(--is4ncds-deep-blue) 12%,#fff);
}
#opportunityDetailBody .opp-fact:nth-of-type(-n+2){ border-top:0; padding-top:0; }
@media (max-width:639px){
  #opportunityDetailBody .opp-facts{ grid-template-columns:1fr; }
  #opportunityDetailBody .opp-fact:nth-of-type(2){ border-top:1px solid color-mix(in srgb,var(--is4ncds-deep-blue) 12%,#fff); padding-top:.72rem; }
}
#opportunityDetailBody .opp-fact dt{
  font-size:.72rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--ink-soft); margin-bottom:.25rem;
}
#opportunityDetailBody .opp-fact dd{ font-size:.9375rem; line-height:1.45; color:var(--ink); margin:0; overflow-wrap:anywhere; }

/* SECTION RHYTHM — each content section opens with a hairline rule and a
   consistent breathing space, so the page reads as structured chapters
   rather than one flat run of text. */
#opportunityDetailBody .opp-section{ margin-top:2rem; padding-top:1.25rem; border-top:1px solid var(--line); }
#opportunityDetailBody .opp-section h2{ margin-bottom:.25rem; }
#opportunityDetailBody .opp-practical-grid{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem 1.5rem; margin-top:1rem;
}
#opportunityDetailBody .opp-practical-item{
  padding:1rem; border:1px solid var(--line); border-radius:var(--radius); background:#fff;
}
#opportunityDetailBody .opp-practical-item h3{
  color:var(--is4ncds-deep-blue); font-size:.95rem; font-weight:700; line-height:1.35;
}
#opportunityDetailBody .opp-practical-item p{ margin-top:.4rem; }
#opportunityDetailBody .opp-closing-action{ padding-bottom:.25rem; }

/* EOI reassurance — supporting guidance, not cramped microcopy. */
#opportunityDetailBody .opp-note{
  font-size:.875rem; line-height:1.55; max-width:26rem; display:inline-block;
}

@media (min-width:1024px){
  #opportunityDetailBody .opp-detail-upper{
    display:grid; grid-template-columns:minmax(0,2.2fr) minmax(18rem,1fr);
    gap:3rem; align-items:start;
  }
  #opportunityDetailBody .opp-facts-rail{ margin-top:0; }
  #opportunityDetailBody .opp-facts{ grid-template-columns:1fr; }
  #opportunityDetailBody .opp-fact:nth-of-type(2){
    border-top:1px solid color-mix(in srgb,var(--is4ncds-deep-blue) 12%,#fff); padding-top:.72rem;
  }
  html[data-tenant="is4ncds"] #opportunityDetailView p,
  html[data-tenant="is4ncds"] #opportunityDetailView li{ font-size:1.0625rem; }
}
@media (min-width:1120px){
  #opportunityDetailBody .opp-detail-upper{
    grid-template-columns:minmax(0,44rem) minmax(19rem,20rem);
    justify-content:center;
  }
}
@media (max-width:639px){
  #opportunityDetailBody .opp-detail-action{ display:block; }
  #opportunityDetailBody .opp-detail-action .btn{ width:100%; }
  #opportunityDetailBody .opp-note{ display:block; margin-top:.75rem; max-width:none; }
  #opportunityDetailBody .opp-practical-grid{ grid-template-columns:1fr; }
}

/* --- PHASE 1: opportunity-card rhythm (owner-directed UI refinement) --------
   The grid already equalises card HEIGHTS, but the content inside was ragged:
   summaries ran 3–7 lines, institutions 1–3 lines, and the action row sat
   wherever the content ended — up to 129px of dead space below it. All nine
   cards now share one rhythm:
     * the card is a flex column and its action row pins to the bottom;
     * the summary clamps at 3 lines (the detail page remains the complete
       source — no underlying data is truncated);
     * the full institutional attribution clamps at 2 lines on the CARD only
       (the detail page keeps the complete source-supported attribution);
     * the LEVEL badge (always first) carries a small dot so the academic
       tier reads as its own badge family, distinct from the neutral
       delivery-mode badge;
     * "Accepting interest" becomes an OUTLINED badge (.badge-open) so status
       is distinguishable from level at a glance — previously its blue tint
       was nearly identical to Intermediate's.
   Scoped to #opportunityGrid — the announcement above it (frozen, PR #122),
   the catalogue grid and every other surface are untouched. */
#opportunityGrid > .card{ display:flex; flex-direction:column; }
#opportunityGrid > .card > div:last-child{ margin-top:auto; padding-top:1.1rem; }
#opportunityGrid .card-summary{
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden;
}
#opportunityGrid .card-institution{
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden;
}
#opportunityGrid > .card > div:first-child .badge:first-child{
  display:inline-flex; align-items:center; gap:.32rem;
}
#opportunityGrid > .card > div:first-child .badge:first-child::before{
  content:""; width:6px; height:6px; border-radius:50%; background:currentColor; flex:none;
}
#opportunityGrid .badge-open{ background:#fff; border:1px solid var(--gold-soft); color:#8a5c0f; }

/* --- homepage Training Opportunities announcement --------------------------
   PHASE 1 AMENDMENT (owner-directed). One flat cap on the whole block
   (max-width:64rem) fixed the earlier heading/prose mismatch but produced a
   uniformly narrow announcement above a wider three-column grid — at 1440px
   both the headline and the prose stopped 208px short of the grid's right
   edge, reading as an accidentally truncated column.

   The announcement is now part of the SAME horizontal composition as the
   grid, with an editorial cascade instead of one flat cap:
     * the OUTER wrapper spans the section container, so the eyebrow rule and
       the block's left edge align with the grid exactly;
     * the HEADLINE takes its own deliberate measure and wraps as two
       balanced lines at wide desktop (text-wrap:balance; safe no-op where
       unsupported — the max-width alone still forces the deliberate wrap);
     * the PROSE (including the closing EOI reassurance) sits under the same
       41rem/~85ch reading measure the opportunity DETAIL pages use, so the
       two public reading surfaces share one measure.
   Left alignment is preserved; nothing is centred; no filler content.
   Everything is scoped ≥1024px so the accepted tablet/mobile behaviour is
   untouched by construction, and the card grid is a sibling this never
   reaches. */
@media (min-width:1024px){
  /* The 58-character headline cannot span a 77rem grid without one overlong
     line, so it wraps at its natural break (the em-dash, via balance) and
     steps up to the design system's top page-title size (44px at 1440) —
     the two balanced lines then sit at ~the same width as the prose, so
     headline and body share ONE column edge instead of three ragged ones. */
  #opportunities .opp-announce h2{
    max-width:64rem;
    font-size:clamp(2.25rem, 1.2rem + 1.9vw, 2.75rem);
    text-wrap:balance;
  }
  #opportunities .opp-announce-body{ max-width:41rem; }
}

/* --- section headings: a real step above body ------------------------------ */
#opportunityDetailView h2,
#eoiFormView section h2{ font-size:clamp(1.2rem, 1.1rem + .4vw, 1.4rem); line-height:1.3; }

/* --- substantive body copy ------------------------------------------------- */
#opportunities .opp-intro,
#opportunityDetailView p,
#eoiFormView .eoi-intro{ font-size:1rem; line-height:1.6; }
#opportunityDetailView li{ font-size:1rem; line-height:1.6; }

/* --- opportunity cards: clear hierarchy, readable at every width ----------- */
#opportunityGrid h3{ font-size:1.05rem; line-height:1.3; overflow-wrap:break-word; }
#opportunityGrid .card-institution{ font-size:.875rem; line-height:1.4; }
#opportunityGrid .card-dates{ font-size:.9375rem; }
#opportunityGrid .card-summary{ font-size:.9375rem; line-height:1.55; }

/* --- forms: the 16px control minimum (no iOS zoom-on-focus) ---------------- */
#eoiFormView .field{ font-size:1rem; line-height:1.5; }
#eoiFormView .field-label{ font-size:.9375rem; margin-bottom:.35rem; }
#eoiFormView .eoi-help{ font-size:.875rem; line-height:1.45; }
#eoiFormView textarea.field{ min-height:7rem; }
/* Consent and acknowledgement are substantive statements, not fine print. */
#eoiFormView label.eoi-consent,
#eoiFormView section label[for]{ font-size:.9375rem; line-height:1.5; }

/* R2D2 form composition. Only the dedicated public EOI page uses these
   hooks; shared field, card and button primitives remain unchanged. */
#eoiFormView .eoi-form-section{ border-color:color-mix(in srgb,var(--is4ncds-deep-blue) 13%,var(--line)); }
#eoiFormView .eoi-form-section > h2{
  color:var(--is4ncds-deep-blue); padding-bottom:.8rem;
  border-bottom:1px solid color-mix(in srgb,var(--is4ncds-deep-blue) 12%,var(--line));
}
#eoiFormView .eoi-field-grid{
  display:grid; grid-template-columns:minmax(0,1fr); gap:1.15rem 1.5rem; margin-top:1.25rem;
}
#eoiFormView .eoi-field-group{ min-width:0; }
#eoiFormView .eoi-field-group > .field-label{ display:block; margin-top:0; margin-bottom:.35rem; }
#eoiFormView .eoi-field-group > .eoi-help{ margin-top:.2rem; margin-bottom:.45rem; }
#eoiFormView .eoi-field--reading{ width:100%; max-width:none; }
/* Reading measure belongs to supporting copy, not to the interactive row.
   Full-row controls now share the same right edge as the two-column grid. */
#eoiFormView .eoi-field--reading > :is(.field-label,.eoi-help){ max-width:46rem; }
#eoiFormView .eoi-field--long textarea.field{ min-height:9rem; resize:vertical; }
#eoiFormView .eoi-word-counter{
  margin:.35rem 0 0 auto; color:var(--ink-soft); font-size:.8125rem;
  font-variant-numeric:tabular-nums; line-height:1.35; text-align:right;
}
#eoiFormView .eoi-upload-field{
  padding:1rem; border:1px solid color-mix(in srgb,var(--is4ncds-deep-blue) 16%,var(--line));
  border-radius:10px; background:color-mix(in srgb,var(--is4ncds-cyan) 4%,#fff);
}
#eoiFormView .eoi-upload-field input[type="file"]{ padding:.55rem; background:#fff; }
#eoiFormView .eoi-submit-section > .eoi-consent{ margin-top:1.15rem; max-width:46rem; }
#eoiFormView #eoiTurnstile:not(:empty){ margin-top:1rem; }
#eoiFormView #eoiTurnstile iframe{ max-width:100%; }
#eoiFormView .eoi-field-error{
  margin:.4rem 0 0; color:#8b2f21; font-size:.875rem; font-weight:650; line-height:1.4;
}
#eoiFormView .eoi-field-error::before{ content:"Error: "; }
#eoiFormView .field.invalid,
#eoiFormView input.invalid{ border-color:#a53a28; box-shadow:0 0 0 3px rgba(165,58,40,.16); }
#eoiFormView #eoiPageErr{ max-width:46rem; border-left:4px solid #a53a28; }

/* R2D3 EOI state vocabulary. It is shared only by the public EOI completion
   and verification surfaces; the frozen form controls and grids are untouched. */
#eoiFormView .eoi-status,
#guestEoiOverlay .eoi-status{
  width:min(100%,56rem); margin:2.5rem auto; padding:clamp(1.5rem,3vw,2.5rem);
  border-top:4px solid var(--is4ncds-golden-yellow); background:var(--paper,#FBF9F4);
}
html[data-tenant="is4ncds"] .eoi-status{ font-family:var(--is4ncds-font-body); }
html[data-tenant="is4ncds"] .eoi-status-title,
html[data-tenant="is4ncds"] .eoi-status-course{ font-family:var(--is4ncds-font-heading-interim); }
.eoi-status-eyebrow{ color:var(--is4ncds-deep-blue); }
.eoi-status-title{
  max-width:22ch; margin-top:.45rem; color:var(--charcoal); font-size:clamp(1.75rem,2.6vw,2.25rem);
  font-weight:750; line-height:1.15; text-wrap:balance;
}
.eoi-status-course{
  max-width:46rem; margin-top:.75rem; color:var(--is4ncds-deep-blue);
  font-size:clamp(1.05rem,1.5vw,1.2rem); font-weight:700; line-height:1.4;
}
.eoi-status-copy{ max-width:46rem; margin-top:1.4rem; color:var(--ink-soft); font-size:1rem; line-height:1.65; }
.eoi-status-copy p + p{ margin-top:.75rem; }
.eoi-status-copy strong{ color:var(--ink); }
.eoi-status-reference{ max-width:46rem; margin-top:1.4rem; padding:1rem 1.1rem; border-radius:10px; background:color-mix(in srgb,var(--is4ncds-cyan) 7%,#fff); }
.eoi-status-reference dt{ color:var(--ink-soft); font-size:.78rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.eoi-status-reference dd{ margin-top:.2rem; color:var(--ink); font-size:1rem; font-weight:750; overflow-wrap:anywhere; }
.eoi-status-actions{ display:flex; flex-wrap:wrap; gap:.75rem; margin-top:1.5rem; }
.eoi-status-text-action{ color:var(--gold-deep); font-weight:750; text-decoration:underline; text-underline-offset:.18em; }
.eoi-status-text-action:hover{ text-decoration-thickness:2px; }
.eoi-status-text-action:focus-visible{ outline:3px solid var(--is4ncds-golden-yellow); outline-offset:3px; border-radius:2px; }

@media (max-width:640px){
  #eoiFormView .eoi-status,
  #guestEoiOverlay .eoi-status{ margin:1rem auto; padding:1.35rem 1.15rem 1.5rem; }
  .eoi-status-actions{ display:grid; grid-template-columns:1fr; }
  .eoi-status-actions .btn{ justify-content:center; width:100%; }
}

@media (min-width:900px){
  #eoiFormView .eoi-field-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  #eoiFormView .eoi-field--full{ grid-column:1 / -1; }
}

/* --- controls: comfortable targets on touch -------------------------------- */
#opportunities .btn,
#opportunityDetailView .btn,
#eoiFormView .btn{ font-size:.9688rem; min-height:44px; }

/* --- badges stay compact labels, just legible ------------------------------ */
#opportunities .badge,
#opportunityDetailView .badge{ font-size:.72rem; }

@media (max-width:640px){
  /* Mobile: full-width controls and a comfortable, tappable submit. */
  #eoiFormView .btn[type="submit"]{ width:100%; }
  #eoiFormView .eoi-submit-actions{ display:grid; grid-template-columns:1fr; }
  #eoiFormView .eoi-submit-actions .btn{ justify-content:center; }
  #eoiFormView .eoi-upload-field{ padding:.85rem; }
  #opportunityGrid .btn{ flex:1 1 auto; }
}

/* ===========================================================================
   Conference Planning → Abstracts operational workspace
   ========================================================================== */
.planning-section-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin:.25rem 0 1rem}
.planning-section-heading h3{font-size:1.25rem;font-weight:750;line-height:1.25;color:var(--charcoal,#25313c)}
.planning-section-heading p{max-width:72ch;margin-top:.25rem;color:var(--ink-soft);font-size:.9rem;line-height:1.5}
.planning-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem;margin-bottom:1rem}
.planning-summary-card{min-height:7.25rem;padding:1rem;text-align:left;background:var(--surface,#fff);border:1px solid var(--line);border-radius:var(--radius,12px);box-shadow:0 1px 2px rgba(15,23,42,.04);transition:border-color .15s,box-shadow .15s,transform .15s}
.planning-summary-card:hover{border-color:var(--brand);box-shadow:0 5px 16px rgba(15,23,42,.08);transform:translateY(-1px)}
.planning-summary-card:focus-visible{outline:3px solid color-mix(in srgb,var(--brand) 32%,transparent);outline-offset:2px}
.planning-summary-card.is-active{border-color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand),0 5px 16px rgba(15,23,42,.08)}
.planning-summary-card.is-informational{cursor:default}.planning-summary-card.is-informational:hover{border-color:var(--line);box-shadow:0 1px 2px rgba(15,23,42,.04);transform:none}
.planning-summary-card strong{display:block;margin:.3rem 0;font-size:1.65rem;line-height:1;color:var(--charcoal,#25313c)}
.planning-summary-card>span:last-child{display:block;font-size:.78rem;line-height:1.35;color:var(--ink-soft)}
.planning-summary-label{display:block;font-size:.75rem;font-weight:750;letter-spacing:.035em;text-transform:uppercase;color:var(--ink-soft)}
.planning-filter-panel{display:grid;grid-template-columns:minmax(14rem,2fr) repeat(5,minmax(8.5rem,1fr));gap:.75rem;align-items:end;padding:1rem;margin-bottom:1rem;background:color-mix(in srgb,var(--brand) 4%,#fff);border:1px solid var(--line);border-radius:var(--radius,12px)}
.planning-filter-panel label{display:grid;gap:.35rem;min-width:0}
.planning-filter-panel label>span{font-size:.75rem;font-weight:750;color:var(--ink-soft)}
.planning-filter-panel input,.planning-filter-panel select{width:100%;min-width:0;min-height:42px;padding:.58rem .7rem;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--charcoal,#25313c);font-size:.9rem}
.planning-filter-panel input:focus,.planning-filter-panel select:focus{outline:2px solid color-mix(in srgb,var(--brand) 35%,transparent);border-color:var(--brand)}
.planning-reset-button,.planning-pagination button,.planning-detail-button{min-height:40px;padding:.5rem .75rem;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--charcoal,#25313c);font-weight:700;font-size:.82rem}
.planning-reset-button:hover,.planning-pagination button:not(:disabled):hover,.planning-detail-button:hover{border-color:var(--brand);color:var(--brand)}
.planning-results-heading{display:flex;justify-content:space-between;gap:1rem;margin:.25rem 0 .65rem;color:var(--ink-soft);font-size:.82rem}
.planning-results-heading strong{color:var(--charcoal,#25313c)}
.planning-table-shell{max-width:100%;overflow:auto;border:1px solid var(--line);border-radius:var(--radius,12px);background:#fff;box-shadow:0 1px 3px rgba(15,23,42,.04)}
.planning-abstract-table{width:100%;table-layout:fixed;border-collapse:separate;border-spacing:0;font-size:.88rem}
.planning-abstract-table th{position:sticky;top:0;z-index:1;padding:.78rem .75rem;text-align:left;background:#f7f8f8;border-bottom:1px solid var(--line);color:var(--ink-soft);font-size:.72rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.planning-abstract-table td{padding:1rem .75rem;vertical-align:top;border-bottom:1px solid var(--line);line-height:1.45;overflow-wrap:anywhere;word-break:normal;white-space:normal}
.planning-abstract-table tbody tr:last-child td{border-bottom:0}
.planning-abstract-row:hover td{background:color-mix(in srgb,var(--brand) 2.5%,#fff)}
.planning-col-reference{width:10rem}.planning-col-track{width:16%}.planning-col-coverage{width:10.5rem}.planning-col-flags{width:12.5rem}.planning-col-action{width:5.5rem}
.planning-reference-cell strong{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.78rem;color:var(--charcoal,#25313c)}
.planning-title-cell strong{display:block;font-size:.94rem;line-height:1.4;color:var(--charcoal,#25313c)}
.planning-title-cell>span,.planning-coverage-cell>span{display:block;margin-top:.3rem;color:var(--ink-soft);font-size:.79rem;line-height:1.4}
.planning-track-cell{color:var(--charcoal,#25313c)}
.planning-track-cell>strong,.planning-track-cell>span{display:block}.planning-track-cell>span{margin-top:.3rem;color:var(--ink-soft);font-size:.79rem}
.planning-coverage-cell strong{display:block;color:var(--charcoal,#25313c)}
.planning-badge{display:inline-flex;align-items:center;max-width:100%;margin:.1rem .25rem .1rem 0;padding:.24rem .48rem;border-radius:999px;background:#edf1f4;color:#425466;font-size:.7rem;font-weight:750;line-height:1.25;white-space:normal}
.planning-badge--ready{background:#e3f5ec;color:#17633e}.planning-badge--progress{background:#e7f0fb;color:#24598a}.planning-badge--attention{background:#fff2d6;color:#765114}.planning-badge--danger{background:#fde8e7;color:#8b2c28}.planning-badge--muted{background:#edf0f2;color:#5e6872}
.planning-detail-row td{padding:0;background:#f8fafb}
.planning-detail-grid{display:grid;grid-template-columns:1.3fr 1.3fr 1fr;gap:1.25rem;padding:1rem 1.25rem 1.25rem;border-bottom:1px solid var(--line)}
.planning-detail-grid h4{margin-bottom:.5rem;color:var(--charcoal,#25313c);font-size:.78rem;font-weight:800;letter-spacing:.035em;text-transform:uppercase}
.planning-detail-grid p,.planning-detail-grid li{font-size:.82rem;line-height:1.45;color:var(--ink-soft);overflow-wrap:anywhere}
.planning-detail-list{display:grid;gap:.65rem}.planning-detail-list li{display:grid;gap:.16rem}.planning-detail-list strong{color:var(--charcoal,#25313c)}
.planning-detail-list a{color:var(--brand);text-decoration:underline;text-underline-offset:2px}.planning-detail-note{margin-top:.35rem}
.planning-source-note{margin-top:.35rem;font-size:.78rem;color:var(--ink-soft)}
.planning-registration-table .planning-col-organization{width:18%}.planning-registration-table .planning-col-participation{width:15%}.planning-registration-table .planning-col-verification{width:8.5rem}
.planning-registration-filters{grid-template-columns:minmax(14rem,2fr) repeat(4,minmax(8.5rem,1fr))}.planning-registration-filters .planning-reset-button{grid-column:auto}
.planning-reviewers-workspace,.planning-reviewer-filters,.planning-reviewers-workspace .planning-table-shell{min-width:0;max-width:100%}.planning-reviewers-workspace .planning-table-shell{width:100%}.planning-reviewer-table{max-width:100%}
.planning-reviewer-table .planning-col-reviewer-identity{width:22%}.planning-reviewer-table .planning-col-reviewer-tracks{width:24%}.planning-reviewer-table .planning-col-reviewer-readiness{width:19%}.planning-reviewer-table .planning-col-reviewer-workload{width:12%}.planning-reviewer-table .planning-col-reviewer-progress{width:16%}.planning-reviewer-table .planning-col-action{width:7%}
.planning-reviewer-cell strong,.planning-reviewer-cell span,.planning-reviewer-cell a,.planning-reviewer-readiness-cell>span,.planning-reviewer-progress-cell strong,.planning-reviewer-progress-cell span{display:block;white-space:normal}.planning-reviewer-cell strong{overflow-wrap:normal;word-break:normal}.planning-reviewer-cell a{overflow-wrap:break-word;word-break:normal}.planning-reviewer-cell span,.planning-reviewer-readiness-cell>span,.planning-reviewer-progress-cell strong,.planning-reviewer-progress-cell span{overflow-wrap:anywhere}.planning-reviewer-cell strong,.planning-reviewer-progress-cell strong{color:var(--charcoal,#25313c)}.planning-reviewer-cell span,.planning-reviewer-cell a,.planning-reviewer-readiness-cell>span,.planning-reviewer-progress-cell span{margin-top:.25rem;color:var(--ink-soft);font-size:.78rem;line-height:1.4}.planning-reviewer-cell a{color:var(--brand);text-decoration:underline;text-underline-offset:2px}.planning-reviewer-table .planning-action-cell{padding-left:.25rem;padding-right:.25rem}.planning-reviewer-table .planning-detail-button{padding-left:.35rem;padding-right:.35rem;font-size:.78rem;white-space:nowrap}
.planning-reviewer-attention{margin-bottom:.65rem}.planning-reviewer-attention .planning-badge--attention,.planning-reviewer-attention .planning-badge--danger{font-weight:800}
.planning-reviewer-filters{grid-template-columns:minmax(14rem,2fr) repeat(4,minmax(8.5rem,1fr))}
.planning-track-table .planning-col-track-name{width:25%}.planning-track-table .planning-col-track-pool{width:15%}.planning-track-table .planning-col-track-target{width:17%}.planning-track-table .planning-col-track-capacity{width:19%}.planning-track-table .planning-col-track-progress{width:17%}.planning-track-table .planning-col-action{width:7%}
.planning-track-name-cell strong,.planning-track-name-cell span,.planning-track-pool-cell strong,.planning-track-pool-cell span,.planning-track-target-cell strong,.planning-track-target-cell span,.planning-track-capacity-cell strong,.planning-track-capacity-cell span,.planning-track-progress-cell strong,.planning-track-progress-cell span{display:block;white-space:normal;word-break:normal;overflow-wrap:break-word}.planning-track-name-cell strong,.planning-track-pool-cell strong,.planning-track-target-cell strong,.planning-track-capacity-cell strong,.planning-track-progress-cell strong{color:var(--charcoal,#25313c)}.planning-track-name-cell span,.planning-track-pool-cell span,.planning-track-target-cell span,.planning-track-capacity-cell span,.planning-track-progress-cell span{margin-top:.25rem;color:var(--ink-soft);font-size:.78rem;line-height:1.4}.planning-track-table .planning-action-cell{padding-left:.25rem;padding-right:.25rem}.planning-track-table .planning-detail-button{padding-left:.35rem;padding-right:.35rem;font-size:.78rem;white-space:nowrap}.planning-track-filters{grid-template-columns:minmax(14rem,2fr) repeat(5,minmax(8.5rem,1fr))}
.planning-empty{padding:2.5rem 1rem;text-align:center;border:1px dashed var(--line);border-radius:var(--radius,12px);background:#fff;color:var(--ink-soft)}
.planning-pagination{display:flex;justify-content:flex-end;gap:.5rem;margin-top:.75rem}.planning-pagination button:disabled{opacity:.45;cursor:not-allowed}

@media (min-width:1101px){
  .planning-reviewer-table,.planning-reviewer-table thead,.planning-reviewer-table tbody{display:block}
  .planning-reviewer-table thead tr,.planning-reviewer-table .planning-reviewer-row{display:grid;grid-template-columns:minmax(0,22fr) minmax(0,24fr) minmax(0,19fr) minmax(0,12fr) minmax(0,16fr) minmax(0,7fr)}
  .planning-reviewer-table thead th,.planning-reviewer-table .planning-reviewer-row td{width:auto}
  .planning-reviewer-table .planning-detail-row{display:block}.planning-reviewer-table .planning-detail-row[hidden]{display:none}.planning-reviewer-table .planning-detail-row td{display:block;width:auto}
}
@media (max-width:1100px){
  .planning-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .planning-filter-panel{grid-template-columns:repeat(3,minmax(0,1fr))}.planning-search{grid-column:span 2}
  .planning-col-reference{width:9rem}.planning-col-track{width:13rem}.planning-col-flags{width:10rem}
  .planning-reviewer-table,.planning-reviewer-table tbody{display:block}.planning-reviewer-table thead{display:none}
  .planning-reviewer-table .planning-reviewer-row{display:grid;grid-template-columns:1fr auto;margin-bottom:.75rem;border:1px solid var(--line);border-radius:10px;background:#fff;overflow:hidden}
  .planning-reviewer-table .planning-reviewer-row td{display:block;padding:.65rem .8rem;border:0}.planning-reviewer-table .planning-reviewer-cell,.planning-reviewer-table .planning-track-cell,.planning-reviewer-table .planning-reviewer-readiness-cell,.planning-reviewer-table .planning-coverage-cell,.planning-reviewer-table .planning-reviewer-progress-cell,.planning-reviewer-table .planning-flags-cell{grid-column:1}
  .planning-reviewer-table .planning-action-cell{grid-column:2;grid-row:1/3}.planning-reviewer-table .planning-detail-row{display:block;margin:-.75rem 0 .75rem}.planning-reviewer-table .planning-detail-row[hidden]{display:none}.planning-reviewer-table .planning-detail-row td{display:block!important;border:1px solid var(--line);border-top:0;border-radius:0 0 10px 10px}
}
@media (max-width:860px){
  .planning-section-heading{display:block}.planning-section-heading>.planning-badge{margin-top:.65rem}
  .planning-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem}.planning-summary-card{min-height:6.5rem;padding:.8rem}
  .planning-filter-panel{grid-template-columns:1fr 1fr}.planning-search{grid-column:1/-1}
  .planning-table-shell{overflow:visible;border:0;background:transparent;box-shadow:none}
  .planning-abstract-table,.planning-abstract-table tbody{display:block}.planning-abstract-table thead{display:none}
  .planning-abstract-row{display:grid;grid-template-columns:1fr auto;margin-bottom:.75rem;border:1px solid var(--line);border-radius:10px;background:#fff;overflow:hidden}
  .planning-abstract-table .planning-abstract-row td{display:block;padding:.65rem .8rem;border:0}
  .planning-reference-cell,.planning-title-cell,.planning-track-cell,.planning-coverage-cell,.planning-verification-cell,.planning-flags-cell,.planning-reviewer-cell,.planning-reviewer-readiness-cell,.planning-reviewer-progress-cell,.planning-track-name-cell,.planning-track-pool-cell,.planning-track-target-cell,.planning-track-capacity-cell,.planning-track-progress-cell{grid-column:1}
  .planning-action-cell{grid-column:2;grid-row:1/3}.planning-title-cell{padding-top:.15rem!important}.planning-track-cell{font-size:.82rem}
  .planning-detail-row{display:block;margin:-.75rem 0 .75rem}.planning-detail-row[hidden]{display:none}.planning-detail-row td{display:block!important;border:1px solid var(--line);border-top:0;border-radius:0 0 10px 10px}
  .planning-detail-grid{grid-template-columns:1fr;gap:1rem}.planning-results-heading{display:block}.planning-results-heading p+p{margin-top:.2rem}
}
@media (max-width:480px){
  .planning-summary-grid,.planning-filter-panel{grid-template-columns:1fr}.planning-search{grid-column:auto}
  .planning-filter-panel select,.planning-filter-panel input{font-size:1rem}
}
.eoi-request-history { border-top: 1px solid var(--border); padding-top: 1.25rem; }
.eoi-request-round { border: 1px solid var(--border); border-radius: .65rem; padding: 1rem; margin-top: .75rem; background: var(--surface-soft, #f8fafb); }
.eoi-request-round header { display: flex; justify-content: space-between; gap: .75rem; flex-wrap: wrap; font-size: .8rem; color: var(--ink-soft); }
.eoi-request-round blockquote { margin: .75rem 0; padding-left: .75rem; border-left: 3px solid var(--tenant-accent, #1f5690); white-space: pre-wrap; }
.eoi-request-round ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.eoi-request-round li { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .5rem; font-size: .85rem; }
.eoi-request-round li small { flex-basis: 100%; color: var(--ink-soft); }
