/* Nostromo UI - strict bundle, vendored from S:/ai_projects/nostromo-ui
   Generated by inlining the @imports of styles.strict.css so the whole system
   is one file: the GUI vendor route serves flat files only, and one request
   beats 15. Do not hand-edit: re-run the bundling step to update.
   Source order is preserved exactly as in styles.strict.css.
*/

/* ===== tokens/primitive.css ===== */
/* GENERATED FILE — do not edit. Source of truth: tokens/tokens.json. Regenerate with: npm run build. */

/* Primitive tier — Raw values. Nothing outside the semantic tier should reference these directly — they carry no meaning, only a measurement or a hue. */

:root{
color-scheme:dark;
--ns-palette-void:#030504;
--ns-palette-panel:#070a08;
--ns-palette-raised:#0b100d;
--ns-palette-interactive:#101712;
--ns-palette-black:#000;
--ns-palette-bone:#d7e2d8;
--ns-palette-bone-dim:#aebbb3;
--ns-palette-bone-muted:#8b9a91;
--ns-palette-slate:#26342c;
--ns-palette-slate-bright:#52655a;
--ns-palette-green:#63f59a;
--ns-palette-green-bright:#8affb5;
--ns-palette-cyan:#58cfff;
--ns-palette-cyan-bright:#8bddff;
--ns-palette-amber:#ffc857;
--ns-palette-amber-bright:#ffdb86;
--ns-palette-red:#ff594d;
--ns-palette-violet:#bd91ff;
--ns-palette-cream:#f1dfa2;
--ns-palette-cream-bright:#fff1bb;
--ns-palette-teal:#71f0d0;
--ns-palette-teal-bright:#a0ffe7;
--ns-palette-ice:#eaf2ff;
--ns-palette-white:#fff;
--ns-palette-blue:#6b9fff;
--ns-palette-blue-bright:#9bbcff;
--ns-palette-signal:#ff735c;
--ns-palette-signal-bright:#ff9b89;
--ns-palette-lime:#f6ff6b;
--ns-palette-ink:#00150a;
--ns-palette-ink-danger:#180000;
--ns-space-1:.25rem;
--ns-space-2:.5rem;
--ns-space-3:.75rem;
--ns-space-4:1rem;
--ns-space-5:1.25rem;
--ns-space-6:1.5rem;
--ns-space-8:2rem;
--ns-space-12:3rem;
--ns-radius:4px;
--ns-font-stack-ui:Inter,Aptos,"Segoe UI",system-ui,sans-serif;
--ns-font-stack-tech:"Roboto Condensed","Arial Narrow",var(--ns-font-stack-ui);
--ns-font-stack-mono:"IBM Plex Mono","Cascadia Mono",Consolas,ui-monospace,monospace;
--ns-font-stack-display:"Oswald","Arial Narrow",Impact,sans-serif;
--ns-easing-standard:cubic-bezier(.2,.8,.2,1);
--ns-easing-exit:cubic-bezier(.4,0,1,1);
--ns-easing-emphasis:cubic-bezier(.2,.7,.3,1);
}

/* ===== tokens/semantic.css ===== */
/* GENERATED FILE — do not edit. Source of truth: tokens/tokens.json. Regenerate with: npm run build. */

/* Semantic tier — What a value means, not what it is. This is the tier application CSS should reach for. */

:root{
--ns-surface-canvas:var(--ns-palette-void);
--ns-surface-panel:var(--ns-palette-panel);
--ns-surface-raised:var(--ns-palette-raised);
--ns-surface-interactive:var(--ns-palette-interactive);
--ns-surface-void:var(--ns-palette-black);
--ns-text-primary:var(--ns-palette-bone);
--ns-text-secondary:var(--ns-palette-bone-dim);
--ns-text-muted:var(--ns-palette-bone-muted);
--ns-text-on-channel:var(--ns-palette-ink);
--ns-text-on-danger:var(--ns-palette-ink-danger);
--ns-border-subtle:var(--ns-palette-slate);
--ns-border-strong:var(--ns-palette-slate-bright);
--ns-focus-ring:var(--ns-palette-lime);
--ns-accent-green:var(--ns-palette-green);
--ns-accent-cyan:var(--ns-palette-cyan);
--ns-accent-amber:var(--ns-palette-amber);
--ns-accent-red:var(--ns-palette-red);
--ns-accent-violet:var(--ns-palette-violet);
--ns-accent-cream:var(--ns-palette-cream);
--ns-state-success:var(--ns-accent-green);
--ns-state-info:var(--ns-accent-cyan);
--ns-state-warning:var(--ns-accent-amber);
--ns-state-danger:var(--ns-accent-red);
--ns-state-offline:var(--ns-text-muted);
--ns-font-ui:var(--ns-font-stack-ui);
--ns-font-tech:var(--ns-font-stack-tech);
--ns-font-mono:var(--ns-font-stack-mono);
--ns-font-display:var(--ns-font-stack-display);
--ns-text-size-body:clamp(.95rem,.91rem + .15vw,1.04rem);
--ns-text-size-h1:clamp(3rem,7vw,7rem);
--ns-text-size-h2:clamp(2rem,4vw,3.7rem);
--ns-text-size-h3:clamp(1.15rem,1rem + .8vw,1.75rem);
--ns-text-size-label:.82rem;
--ns-text-size-data:.9rem;
--ns-leading-body:1.55;
--ns-leading-heading:1.08;
--ns-gutter:clamp(1rem,2vw,2rem);
--ns-layout-max:96rem;
--ns-target-size:2.75rem;
--ns-header-height:4rem;
--ns-nav-width:17rem;
--ns-duration-tick:80ms;
--ns-duration-fast:120ms;
--ns-duration-local:180ms;
--ns-duration-panel:240ms;
--ns-duration-scene:360ms;
--ns-effect-bloom:.18;
--ns-effect-raster:.03;
--ns-effect-noise:.025;
--ns-effect-glitch-shift:2px;
--ns-data-1:#63f59a;
--ns-data-2:#58cfff;
--ns-data-3:#ffc857;
--ns-data-4:#bd91ff;
--ns-data-5:#71f0d0;
--ns-data-6:#ff9b89;
--ns-data-grid:rgb(82 101 90/.34);
--ns-data-reference:#8b9a91;
--ns-data-positive:#63f59a;
--ns-data-negative:#ff594d;
--ns-data-forecast:rgb(88 207 255/.45);
--ns-data-stroke:1.25px;
}

/* ===== tokens/channel.css ===== */
/* GENERATED FILE — do not edit. Source of truth: tokens/tokens.json. Regenerate with: npm run build. */

/* Channel tier — The ambient domain accent. One channel is active per region; every component reads it rather than hardcoding a hue. Set with data-channel on any ancestor. */

:root{
--ns-channel:var(--ns-accent-green);
--ns-channel-bright:#8affb5;
--ns-channel-a06:rgb(99 245 154/.06);
--ns-channel-a12:rgb(99 245 154/.12);
--ns-channel-a25:rgb(99 245 154/.25);
}

[data-channel=operations]{
--ns-channel:var(--ns-accent-green);
--ns-channel-bright:#8affb5;
--ns-channel-a06:rgb(99 245 154/.06);
--ns-channel-a12:rgb(99 245 154/.12);
--ns-channel-a25:rgb(99 245 154/.25);
}

[data-channel=analysis]{
--ns-channel:var(--ns-accent-cyan);
--ns-channel-bright:#8bddff;
--ns-channel-a06:rgb(88 207 255/.06);
--ns-channel-a12:rgb(88 207 255/.12);
--ns-channel-a25:rgb(88 207 255/.25);
}

[data-channel=navigation]{
--ns-channel:var(--ns-accent-amber);
--ns-channel-bright:#ffdb86;
--ns-channel-a06:rgb(255 200 87/.06);
--ns-channel-a12:rgb(255 200 87/.12);
--ns-channel-a25:rgb(255 200 87/.25);
}

[data-channel=identity]{
--ns-channel:var(--ns-palette-teal);
--ns-channel-bright:#a0ffe7;
--ns-channel-a06:rgb(113 240 208/.06);
--ns-channel-a12:rgb(113 240 208/.12);
--ns-channel-a25:rgb(113 240 208/.25);
}

[data-channel=documents]{
--ns-channel:var(--ns-accent-cream);
--ns-channel-bright:#fff1bb;
--ns-channel-a06:rgb(241 223 162/.06);
--ns-channel-a12:rgb(241 223 162/.12);
--ns-channel-a25:rgb(241 223 162/.25);
}

[data-channel=configuration]{
--ns-channel:var(--ns-palette-ice);
--ns-channel-bright:#fff;
--ns-channel-a06:rgb(234 242 255/.06);
--ns-channel-a12:rgb(234 242 255/.12);
--ns-channel-a25:rgb(234 242 255/.25);
}

[data-channel=communications]{
--ns-channel:var(--ns-palette-blue);
--ns-channel-bright:#9bbcff;
--ns-channel-a06:rgb(107 159 255/.06);
--ns-channel-a12:rgb(107 159 255/.12);
--ns-channel-a25:rgb(107 159 255/.25);
}

[data-channel=security]{
--ns-channel:var(--ns-palette-signal);
--ns-channel-bright:#ff9b89;
--ns-channel-a06:rgb(255 115 92/.06);
--ns-channel-a12:rgb(255 115 92/.12);
--ns-channel-a25:rgb(255 115 92/.25);
}

/* ===== tokens/component.css ===== */
/* GENERATED FILE — do not edit. Source of truth: tokens/tokens.json. Regenerate with: npm run build. */

/* Component tier — Contracts shared by whole component families: stacking order, overlay and popup surfaces, and form-control state. Override these to retheme a family without touching component CSS. */

:root{
--ns-z-raised:1;
--ns-z-nav-scrim:24;
--ns-z-drawer:25;
--ns-z-topbar:30;
--ns-z-popup:40;
--ns-z-tooltip:60;
--ns-z-toast:100;
--ns-z-atmosphere:200;
--ns-z-skip-link:500;
--ns-overlay-scrim:rgb(0 0 0/.6);
--ns-overlay-backdrop:rgb(0 0 0/.7);
--ns-overlay-veil:rgb(0 0 0/.72);
--ns-overlay-surface:rgb(2 5 4/.97);
--ns-overlay-shadow:0 0 2rem var(--ns-channel-a25);
--ns-popup-surface:rgb(2 5 4/.98);
--ns-popup-border:var(--ns-channel);
--ns-popup-shadow:0 .6rem 1.4rem rgb(0 0 0/.6);
--ns-popup-offset:2px;
--ns-popup-max-block-size:14rem;
--ns-field-background:var(--ns-surface-interactive);
--ns-field-border:var(--ns-border-strong);
--ns-field-border-hover:var(--ns-channel);
--ns-field-border-focus:var(--ns-channel);
--ns-field-border-invalid:var(--ns-state-danger);
--ns-field-invalid-marker:inset 3px 0 0 var(--ns-state-danger);
--ns-field-disabled-opacity:.55;
--ns-field-readonly-background:var(--ns-surface-panel);
--ns-field-readonly-border:var(--ns-border-subtle);
--ns-field-gap:.42rem;
--ns-fieldset-gap:var(--ns-space-4);
--ns-form-measure:72rem;
--ns-tooltip-surface:rgb(2 5 4/.97);
--ns-tooltip-shadow:0 .4rem 1rem rgb(0 0 0/.4);
}

/* ===== tokens/mode.css ===== */
/* GENERATED FILE — do not edit. Source of truth: tokens/tokens.json. Regenerate with: npm run build. */

/* Mode tier — User- and host-controlled preference overrides: density, contrast and reduced motion. Every token here already exists in a lower tier — modes only re-point them. */

[data-ns-density=compact]{
--ns-target-size:2.3rem;
--ns-gutter:clamp(.75rem,1.4vw,1.25rem);
--ns-field-padding-block:.5rem;
--ns-field-padding-inline:.65rem;
}

[data-ns-density=comfortable]{
--ns-field-padding-block:.72rem;
--ns-field-padding-inline:.8rem;
}

[data-ns-contrast=high]{
--ns-border-subtle:#789083;
--ns-border-strong:#b5c7bd;
--ns-text-muted:#b7c4bc;
--ns-text-secondary:#d4ddd7;
--ns-effect-raster:0;
--ns-effect-noise:0;
--ns-effect-bloom:.08;
}

@media (prefers-reduced-motion:reduce){
:root{
--ns-duration-tick:0ms;
--ns-duration-fast:80ms;
--ns-duration-local:0ms;
--ns-duration-panel:0ms;
--ns-duration-scene:0ms;
}
}

/* ===== tokens/fonts.css ===== */
/*
  No font binaries or remote font services are required by the core package.
  The typography tokens prefer locally installed Inter, Roboto Condensed,
  IBM Plex Mono and Oswald, then fall back to platform fonts.
  Deployments may supply approved self-hosted web fonts in an application-owned
  stylesheet without changing component contracts.
*/

/* ===== foundations/base.css ===== */
@layer ns-reset,ns-base,ns-components,ns-patterns,ns-utilities,ns-legacy;
@layer ns-reset{
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;min-inline-size:0;overflow-wrap:anywhere}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
img,svg,canvas{display:block;max-inline-size:100%}
}
@layer ns-base{
html{background:var(--ns-surface-canvas)}
body{
min-block-size:100svh;
font-family:var(--ns-font-ui);font-size:var(--ns-text-size-body);line-height:var(--ns-leading-body);
}
::selection{color:#000;background:var(--ns-channel)}
:focus-visible{outline:3px solid var(--ns-focus-ring);outline-offset:3px}
h1,h2,h3,h4{font-family:var(--ns-font-tech);line-height:var(--ns-leading-heading);text-wrap:balance;color:var(--ns-text-primary);margin:0 0 .5em}
h1{font-size:var(--ns-text-size-h1);letter-spacing:-.04em}
h2{font-size:var(--ns-text-size-h2);letter-spacing:-.03em}
h3{font-size:var(--ns-text-size-h3)}
p,li,td,dd{color:var(--ns-text-secondary)}
strong{color:var(--ns-text-primary)}
code,pre,.ns-data{font-family:var(--ns-font-mono)}
code:not(pre code){color:var(--ns-channel-bright);background:var(--ns-channel-a12);border:1px solid var(--ns-channel-a25);padding:.08em .28em;border-radius:2px}
a{color:var(--ns-channel-bright);text-underline-offset:.18em}
a:hover{color:var(--ns-text-primary)}
/* The deprecated `.btn`/`.nav-link` names are excluded here by hand: an exclusion cannot be
   expressed as a generated alias rule, because re-emitting it would only add, never subtract. */
a:not(.ns-btn):not(.ns-nav-link):not(.btn):not(.nav-link){text-decoration-thickness:1px}
.ns-sr-only{position:absolute!important;inline-size:1px!important;block-size:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.ns-skip-link{position:fixed;z-index:var(--ns-z-skip-link);inset-block-start:.5rem;inset-inline-start:.5rem;transform:translateY(-200%);padding:.75rem 1rem;background:var(--ns-focus-ring);color:#000;font-weight:900}
.ns-skip-link:focus{transform:none}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media (pointer:coarse){button,input,select,textarea,[role=button],[role=option],[role=menuitem]{min-block-size:var(--ns-target-size)}}
@media (forced-colors:active){
  :root{color-scheme:light dark}
  .ns-atmosphere,.ns-visual-field{display:none!important}
  .ns-btn,.ns-control,.ns-card,.ns-alert,.ns-metric,.ns-table-region,.ns-frame,.ns-vbox,.ns-rail,.ns-hazard,.ns-lock,.ns-toast,dialog.ns-dialog{forced-color-adjust:auto;box-shadow:none!important;text-shadow:none!important}
  .ns-status::before,.ns-segments span,.ns-metric::after,.ns-card::before{box-shadow:none!important}
  .ns-btn-primary,.ns-btn-danger,.ns-btn[aria-pressed=true]{color:ButtonText;background:ButtonFace;border-color:ButtonText}
  .ns-tab[aria-selected=true],.ns-nav-link[aria-current=page]{border-color:Highlight;color:Highlight}
  :focus-visible{outline-color:Highlight!important}
}
}
/* Page canvas — deliberately UNLAYERED and specificity-boosted (html:root / html body).
   An unlayered declaration in a host page or a consuming project's reset (Tailwind preflight,
   normalize.css, an inline <style>) outranks every @layer, so a layered background here would be
   silently defeated and the whole dark-console premise would invert to white. Keep these three
   rules out of @layer, and keep them last in the file. */
html:root{background:var(--ns-surface-canvas)}
html body{color:var(--ns-text-primary);background:radial-gradient(circle at 80% 8%,var(--ns-channel-a06),transparent 30rem),var(--ns-surface-canvas)}

/* ===== foundations/effects.css ===== */
@layer ns-base{
/* Atmospheric overlay — screen-space CRT raster + noise. Body-level, very low intensity, decorative only. */
.ns-atmosphere{position:fixed;inset:0;pointer-events:none;z-index:var(--ns-z-atmosphere)}
.ns-atmosphere::before,.ns-atmosphere::after{content:"";position:absolute;inset:0}
.ns-atmosphere::before{opacity:var(--ns-effect-raster);background:repeating-linear-gradient(to bottom,transparent 0 3px,var(--ns-channel) 3px 4px);mix-blend-mode:screen}
.ns-atmosphere::after{opacity:var(--ns-effect-noise);mix-blend-mode:soft-light;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
[data-ns-effects="operational"] .ns-atmosphere{opacity:.62}
[data-ns-effects="reduced"] .ns-atmosphere{opacity:.4}
[data-ns-effects="off"] .ns-atmosphere{display:none}
.ns-ambient-layer{position:absolute;inset:0;overflow:hidden;pointer-events:none;isolation:isolate;z-index:var(--ns-z-atmosphere);container:ns-ambient/inline-size}
[data-ns-effects="off"] .ns-ambient-layer{display:none}
.ns-ambient-visual{position:absolute;inset:var(--ns-ambient-safe-area,0);inline-size:auto;max-inline-size:var(--ns-ambient-max-size,100%);block-size:auto;color:var(--ns-channel);fill:none;stroke:currentColor;stroke-width:1;pointer-events:none;opacity:.05}
.ns-ambient-visual[data-intensity=low]{opacity:.09}.ns-ambient-visual[data-intensity=medium]{opacity:.14}
.ns-ambient-layer[data-intensity=low] .ns-ambient-visual{opacity:.09}.ns-ambient-layer[data-intensity=medium] .ns-ambient-visual{opacity:.14}
.ns-ambient-visual[data-density=sparse] .ns-ambient-node:nth-of-type(even){display:none}
.ns-ambient-visual[data-placement=start]{inset-inline-end:auto}.ns-ambient-visual[data-placement=end]{inset-inline-start:auto}.ns-ambient-visual[data-placement=center]{inset-inline:50%;transform:translateX(-50%)}
.ns-ambient-visual[data-mask=fade]{mask-image:radial-gradient(ellipse,black 30%,transparent 78%)}
.ns-ambient-visual[data-mask=edge]{mask-image:linear-gradient(to right,black,transparent 82%)}
.ns-ambient-visual[data-motion=enter][data-running=true] .ns-ambient-geometry{animation:ns-ambient-enter var(--ns-duration-scene) var(--ns-easing-standard) both}
.ns-ambient-visual[data-motion=ambient][data-running=true] .ns-ambient-geometry{animation:ns-ambient-drift 12s var(--ns-easing-standard) 1 both}
.ns-ambient-visual[data-running=false] .ns-ambient-geometry{animation-play-state:paused}
@keyframes ns-ambient-enter{from{opacity:0;transform:translateX(var(--ns-ambient-seed-offset,0))}to{opacity:1;transform:none}}
@keyframes ns-ambient-drift{from{transform:translateX(0)}to{transform:translateX(var(--ns-ambient-seed-offset,0))}}
@container ns-ambient (max-width:40rem){.ns-ambient-visual[data-collapse=hide]{display:none}.ns-ambient-visual[data-collapse=simplify]{opacity:.035}.ns-ambient-visual[data-collapse=simplify] .ns-ambient-node:nth-of-type(even){display:none}}
}
@layer ns-utilities{
/* Phosphor bloom — text stays crisp, a blurred ::after echoes it. Use data-glow="same text as content". */
.ns-phosphor{position:relative;isolation:isolate}
.ns-phosphor::after{content:attr(data-glow);position:absolute;inset:0;z-index:-1;color:currentColor;opacity:var(--ns-effect-bloom);filter:blur(.8px);pointer-events:none}
/* Signal Tear — causal glitch, fires once via data-active, never on a timer/hover. */
.ns-glitch{position:relative;display:inline-block}
.ns-glitch[data-active=true]{animation:signal-tear 430ms steps(2,end)}
.ns-glitch[data-active=true]::before,.ns-glitch[data-active=true]::after{content:attr(data-text);position:absolute;inset:0;pointer-events:none;clip-path:inset(30% 0 40% 0)}
.ns-glitch[data-active=true]::before{color:var(--ns-accent-cyan);transform:translateX(-2px)}
.ns-glitch[data-active=true]::after{color:var(--ns-accent-red);transform:translateX(2px);clip-path:inset(58% 0 18% 0)}
/* Data Echo — highlight a value that just updated, instead of counting from zero. */
.ns-echo[data-echo=true]{animation:data-echo 650ms var(--ns-easing-standard)}
@keyframes signal-tear{0%,100%{transform:none;clip-path:none;text-shadow:none}18%{transform:translateX(-2px);clip-path:inset(18% 0 54% 0);text-shadow:3px 0 var(--ns-accent-cyan),-3px 0 var(--ns-accent-red)}34%{transform:translateX(2px);clip-path:inset(60% 0 8% 0);text-shadow:-3px 0 var(--ns-accent-cyan),3px 0 var(--ns-accent-red)}}
@keyframes data-echo{0%{text-shadow:0 0 0 transparent}25%{text-shadow:0 0 1.4rem var(--ns-channel),2px 0 0 var(--ns-channel-a25)}100%{text-shadow:0 0 0 transparent}}
@keyframes toast-in{from{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:none}}
@keyframes orbit{to{transform:rotate(360deg)}}
@keyframes globe-spin{to{transform:rotate(360deg)}}
@keyframes trace{to{stroke-dashoffset:-80}}
.ns-u-channel{color:var(--ns-channel-bright)!important}
.ns-u-muted{color:var(--ns-text-muted)!important}
.ns-globe-spin{transform-origin:100px 100px;animation:globe-spin 26s linear infinite}
.ns-orbit-marker{transform-origin:100px 100px;animation:orbit 18s linear infinite}
[data-spin=false] .ns-globe-spin,[data-spin=false] .ns-orbit-marker{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){
.ns-phosphor::after{display:none}
.ns-glitch[data-active=true]{animation:none}
.ns-echo[data-echo=true]{animation:none}
.ns-atmosphere{display:none}
.ns-ambient-visual[data-motion] .ns-ambient-geometry{animation:none!important}
[class*="orbit"],[class*="scan"],.ns-globe-spin,.ns-orbit-marker{animation:none!important}
}
}

/* ===== foundations/components.css ===== */
@layer ns-components{
.ns-icon{inline-size:1.25em;block-size:1.25em;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:square;stroke-linejoin:miter}
.ns-btn{min-block-size:var(--ns-target-size);display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.65rem 1rem;border:1px solid var(--ns-border-strong);border-radius:var(--ns-radius);color:var(--ns-text-primary);background:var(--ns-surface-interactive);font-family:var(--ns-font-tech);font-size:.86rem;font-weight:800;letter-spacing:.055em;text-transform:uppercase;text-decoration:none;transition:transform var(--ns-duration-tick),color var(--ns-duration-fast),background var(--ns-duration-fast),border-color var(--ns-duration-fast),box-shadow var(--ns-duration-fast)}
.ns-btn:hover{color:var(--ns-channel-bright);border-color:var(--ns-channel);background:var(--ns-channel-a12)}
.ns-btn:active{transform:translateY(1px) scale(.985)}
.ns-btn-primary,.ns-btn[aria-pressed=true]{color:#00150a;background:var(--ns-channel);border-color:var(--ns-channel);box-shadow:0 0 1rem var(--ns-channel-a25)}
.ns-btn-danger{color:#180000;background:var(--ns-accent-red);border-color:var(--ns-accent-red)}
.ns-btn-quiet{background:transparent;border-color:transparent}
.ns-btn-icon{inline-size:var(--ns-target-size);padding:0}
.ns-btn:disabled{opacity:var(--ns-field-disabled-opacity);cursor:not-allowed}
.ns-tag,.ns-status{display:inline-flex;align-items:center;gap:.4rem;min-block-size:1.6rem;padding:.18rem .52rem;border:1px solid var(--ns-border-subtle);background:var(--ns-surface-raised);font-family:var(--ns-font-mono);font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.ns-status::before{content:"";inline-size:.45rem;block-size:.45rem;background:currentColor;box-shadow:0 0 .5rem currentColor}
.ns-success{color:var(--ns-accent-green)}.ns-warning{color:var(--ns-accent-amber)}.ns-danger{color:var(--ns-accent-red)}.ns-info{color:var(--ns-accent-cyan)}.ns-offline{color:var(--ns-text-muted)}
.ns-card{position:relative;min-inline-size:0;border:1px solid var(--ns-border-subtle);background:linear-gradient(135deg,var(--ns-channel-a06),transparent 45%),var(--ns-surface-panel);overflow:hidden;container:ns-card/inline-size}
.ns-card::before{content:"";position:absolute;inset-block-start:-1px;inset-inline-start:-1px;inline-size:3rem;block-size:1px;background:var(--ns-channel);box-shadow:0 0 .8rem var(--ns-channel-a25)}
.ns-card>header{display:flex;align-items:start;justify-content:space-between;gap:1rem;padding:1rem 1.2rem;border-block-end:1px solid color-mix(in srgb,var(--ns-border-subtle) 65%,transparent)}
.ns-card>header h3{margin:0}
.ns-card-body{padding:1.2rem}
.ns-alert{--state:var(--ns-accent-cyan);display:grid;grid-template-columns:auto minmax(0,1fr);gap:.8rem;padding:1rem;border:1px solid color-mix(in srgb,var(--state) 65%,var(--ns-border-subtle));border-inline-start-width:4px;background:color-mix(in srgb,var(--state) 8%,var(--ns-surface-panel));container:ns-alert/inline-size}
.ns-alert-warning{--state:var(--ns-accent-amber)}.ns-alert-danger{--state:var(--ns-accent-red)}.ns-alert-success{--state:var(--ns-accent-green)}
.ns-alert .ns-icon{color:var(--state);margin-block-start:.2rem}
.ns-alert-title{font-weight:900;color:var(--ns-text-primary)}
.ns-field{display:grid;gap:.42rem;min-inline-size:0}
.ns-label{font-family:var(--ns-font-tech);font-size:var(--ns-text-size-label);font-weight:800;letter-spacing:.05em;text-transform:uppercase}
.ns-help,.ns-error{font-size:.82rem;color:var(--ns-text-muted)}
.ns-error{color:var(--ns-accent-red)}
.ns-control{inline-size:100%;min-block-size:var(--ns-target-size);padding:var(--ns-field-padding-block,.68rem) var(--ns-field-padding-inline,.78rem);border:1px solid var(--ns-field-border);border-radius:var(--ns-radius);color:var(--ns-text-primary);background:var(--ns-field-background)}
.ns-control:hover{border-color:var(--ns-field-border-hover)}
.ns-control:focus-visible{border-color:var(--ns-field-border-focus)}
.ns-control[aria-invalid=true]{border-color:var(--ns-field-border-invalid);box-shadow:var(--ns-field-invalid-marker)}
.ns-control:disabled{opacity:var(--ns-field-disabled-opacity);cursor:not-allowed}
textarea.ns-control{min-block-size:8rem;resize:vertical}
select.ns-control{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ns-text-muted) 50%),linear-gradient(135deg,var(--ns-text-muted) 50%,transparent 50%);background-position:calc(100% - 1.3rem) center,calc(100% - 1rem) center;background-size:6px 6px;background-repeat:no-repeat;padding-inline-end:2.4rem}
.ns-check{display:grid;grid-template-columns:1.25rem minmax(0,1fr);gap:.6rem;align-items:start}
.ns-check input{inline-size:1.15rem;block-size:1.15rem;accent-color:var(--ns-channel)}
.ns-switch{position:relative;display:inline-flex;align-items:center;gap:.6rem;cursor:pointer}
.ns-switch input{position:absolute;opacity:0;inline-size:2.6rem;block-size:1.5rem;margin:0;cursor:pointer}
.ns-switch-track{inline-size:2.6rem;block-size:1.5rem;border:1px solid var(--ns-border-strong);background:var(--ns-surface-interactive);border-radius:1rem;position:relative;transition:background var(--ns-duration-fast),border-color var(--ns-duration-fast)}
.ns-switch-track::after{content:"";position:absolute;inset-block:2px;inset-inline-start:2px;inline-size:1.1rem;background:var(--ns-text-muted);border-radius:50%;transition:transform var(--ns-duration-fast),background var(--ns-duration-fast)}
.ns-switch input:checked+.ns-switch-track{background:var(--ns-channel-a25);border-color:var(--ns-channel)}
.ns-switch input:checked+.ns-switch-track::after{transform:translateX(1.1rem);background:var(--ns-channel)}
.ns-switch input:focus-visible+.ns-switch-track{outline:3px solid var(--ns-focus-ring);outline-offset:3px}
.ns-metric{position:relative;display:grid;gap:.35rem;min-block-size:9rem;padding:1.2rem;border:1px solid var(--ns-border-subtle);background:linear-gradient(145deg,var(--ns-channel-a12),transparent 55%),var(--ns-surface-panel);overflow:hidden}
.ns-metric::after{content:"";position:absolute;inset-inline-end:-1rem;inset-block-end:-2.5rem;inline-size:8rem;block-size:8rem;border:1px solid var(--ns-channel-a25);border-radius:50%}
.ns-metric-label{font-family:var(--ns-font-tech);font-size:.75rem;font-weight:900;letter-spacing:.07em;text-transform:uppercase;color:var(--ns-text-muted)}
.ns-metric-value{position:relative;z-index:1;font-family:var(--ns-font-mono);font-size:clamp(2rem,4vw,3.2rem);line-height:1;color:var(--ns-channel-bright);text-shadow:0 0 .8rem var(--ns-channel-a25)}
.ns-metric-meta{position:relative;z-index:1;font-size:.8rem;color:var(--ns-text-secondary)}
.ns-progress{inline-size:100%;block-size:.55rem;border:1px solid var(--ns-border-subtle);background:#000;overflow:hidden}
.ns-progress>span{display:block;block-size:100%;inline-size:var(--value,50%);background:repeating-linear-gradient(135deg,var(--ns-channel) 0 8px,var(--ns-channel-bright) 8px 12px);box-shadow:0 0 .7rem var(--ns-channel-a25)}
.ns-table-region{inline-size:100%;min-inline-size:0;max-inline-size:100%;overflow:auto;overscroll-behavior-inline:contain;border:1px solid var(--ns-border-subtle);background:var(--ns-surface-panel);scrollbar-gutter:stable;contain:inline-size layout paint;container:ns-table/inline-size}
.ns-table{inline-size:100%;min-inline-size:min(var(--table-min,42rem),640px);font-size:.9rem;border-collapse:collapse}
.ns-table th,.ns-table td{padding:var(--ns-field-padding-block,.72rem) var(--ns-field-padding-inline,.8rem);text-align:start;border-block-end:1px solid color-mix(in srgb,var(--ns-border-subtle) 65%,transparent)}
.ns-table th{position:sticky;inset-block-start:0;z-index:var(--ns-z-raised);color:var(--ns-channel-bright);background:var(--ns-surface-raised);font-family:var(--ns-font-tech);font-size:.75rem;letter-spacing:.055em;text-transform:uppercase}
.ns-table tbody tr:hover{background:var(--ns-channel-a06)}
.ns-table-region:focus-visible{outline:3px solid var(--ns-focus-ring);outline-offset:3px}
.ns-table-empty{padding:1rem;color:var(--ns-text-muted);font-family:var(--ns-font-mono)}
.ns-tabs{display:grid;grid-template-columns:minmax(0,1fr);gap:1rem;min-inline-size:0}
.ns-tab-list{display:flex;min-inline-size:0;max-inline-size:100%;overflow-x:auto;contain:inline-size layout paint;overscroll-behavior-inline:contain;border-block-end:1px solid var(--ns-border-subtle);scrollbar-width:thin}
.ns-tab{min-block-size:var(--ns-target-size);flex:0 0 auto;border:0;border-block-end:2px solid transparent;padding:.65rem .9rem;color:var(--ns-text-muted);background:transparent;font-family:var(--ns-font-tech);font-weight:800;letter-spacing:.05em;text-transform:uppercase}
.ns-tab[aria-selected=true]{color:var(--ns-channel-bright);border-block-end-color:var(--ns-channel);background:var(--ns-channel-a06)}
.ns-tab-panel{min-inline-size:0}
dialog.ns-dialog{inline-size:min(42rem,calc(100% - 2rem));max-block-size:calc(100dvh - 2rem);padding:0;border:1px solid var(--ns-channel);color:var(--ns-text-primary);background:var(--ns-overlay-surface);box-shadow:0 0 0 100vmax var(--ns-overlay-veil),var(--ns-overlay-shadow)}
dialog.ns-dialog::backdrop{background:var(--ns-overlay-backdrop)}
.ns-dialog-panel{display:grid;max-block-size:calc(100dvh - 2rem);overflow:auto;container:ns-dialog/inline-size}
.ns-dialog-head,.ns-dialog-actions{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:1rem 1.2rem;border-block-end:1px solid var(--ns-border-subtle)}
.ns-dialog-actions{border-block-end:0;border-block-start:1px solid var(--ns-border-subtle);flex-wrap:wrap}
.ns-dialog-body{padding:1.2rem}
.ns-command-dialog{inline-size:min(44rem,calc(100% - 2rem));overflow:hidden}
.ns-command-panel{display:grid}
.ns-command-search{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:.75rem;align-items:center;padding:1rem;border-block-end:1px solid var(--ns-border-subtle)}
.ns-command-search input{min-inline-size:0;border:0;outline:0;color:var(--ns-text-primary);background:transparent;font-size:1.05rem}
.ns-command-search:focus-within{outline:3px solid var(--ns-focus-ring);outline-offset:-3px;background:var(--ns-channel-a06)}
.ns-command-search kbd{padding:.2rem .45rem;border:1px solid var(--ns-border-strong);font-family:var(--ns-font-mono);font-size:.68rem;color:var(--ns-text-muted)}
.ns-command-results{display:grid;gap:.2rem;max-block-size:55vh;overflow:auto;padding:.5rem}
.ns-command-result{display:grid;grid-template-columns:2.8rem minmax(0,1fr) auto;gap:.75rem;align-items:center;min-block-size:3rem;padding:.65rem .8rem;border:1px solid transparent;text-align:start;color:var(--ns-text-primary);background:transparent;width:100%}
.ns-command-result:hover,.ns-command-result:focus-visible,.ns-command-result[data-active=true]{border-color:var(--ns-channel);background:var(--ns-channel-a12);color:var(--ns-channel-bright)}
.ns-command-empty{padding:1rem;color:var(--ns-text-muted);font-family:var(--ns-font-mono)}
.ns-toast-stack{position:fixed;z-index:var(--ns-z-toast);inset-inline-end:max(1rem,env(safe-area-inset-right));inset-block-end:max(1rem,env(safe-area-inset-bottom));inline-size:min(24rem,calc(100% - 2rem));display:grid;gap:.6rem;pointer-events:none}
.ns-toast{pointer-events:auto;display:grid;grid-template-columns:auto 1fr auto;gap:.7rem;align-items:start;padding:.9rem;border:1px solid var(--ns-accent-green);background:var(--ns-overlay-surface);animation:toast-in var(--ns-duration-panel) var(--ns-easing-standard) both}
.ns-toast-danger{border-color:var(--ns-accent-red)}
.ns-toast-warning{border-color:var(--ns-accent-amber)}
.ns-tooltip{position:absolute;z-index:var(--ns-z-tooltip);max-inline-size:min(22rem,calc(100vw - 2rem));padding:.4rem .6rem;border:1px solid var(--ns-channel-a25);background:var(--ns-tooltip-surface);color:var(--ns-text-secondary);font-family:var(--ns-font-mono);font-size:.72rem;white-space:normal;box-shadow:var(--ns-tooltip-shadow);pointer-events:auto}
@container ns-card (inline-size < 20rem){.ns-card>header{display:grid;padding:var(--ns-space-3)}.ns-card-body{padding:var(--ns-space-3)}}
@container ns-alert (inline-size < 16rem){.ns-alert{grid-template-columns:minmax(0,1fr)}.ns-alert .ns-icon{margin-block-start:0}}
@container ns-dialog (inline-size < 34rem){.ns-dialog-actions>.ns-btn:not(.ns-btn-icon){flex:1 1 10rem}}
@media (forced-colors:active){.ns-command-search:focus-within{outline-color:Highlight}.ns-tooltip{border-color:CanvasText}}
}
@container ns-table (inline-size < 36rem){
  .ns-table{min-inline-size:100%;table-layout:fixed}
  .ns-table th,.ns-table td{padding-inline:.4rem;overflow-wrap:anywhere}
  .ns-table .ns-status{white-space:normal}
  .ns-table .ns-btn{inline-size:100%;min-inline-size:0;padding-inline:.35rem}
}

@layer ns-components{
.ns-table-sort{inline-size:100%;padding:0;border:0;color:inherit;background:transparent;text-align:inherit;font:inherit;text-transform:inherit;letter-spacing:inherit}.ns-table-sort::after{content:" ↕";color:var(--ns-text-muted)}th[aria-sort=ascending] .ns-table-sort::after{content:" ↑"}th[aria-sort=descending] .ns-table-sort::after{content:" ↓"}.ns-table-select{inline-size:3rem;text-align:center!important}.ns-table tr[data-selected=true]{background:var(--ns-channel-a12)}
.ns-description-list,.ns-key-value-list{display:grid;grid-template-columns:repeat(var(--ns-description-columns,1),minmax(0,1fr));gap:var(--ns-space-3);margin:0}.ns-description-list[data-columns="2"]{--ns-description-columns:2}.ns-description-list[data-columns="3"]{--ns-description-columns:3}.ns-description-list>div,.ns-key-value-list>div{min-inline-size:0;padding-block-end:var(--ns-space-2);border-block-end:1px solid var(--ns-border-subtle)}.ns-description-list dt,.ns-key-value-list dt{color:var(--ns-text-muted);font:800 var(--ns-text-size-label)/1.3 var(--ns-font-tech);text-transform:uppercase}.ns-description-list dd,.ns-key-value-list dd{margin:.25rem 0 0}.ns-key-value-list dd{font-family:var(--ns-font-mono)}
.ns-filter-bar{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--ns-space-3);padding:var(--ns-space-3);border:1px solid var(--ns-border-subtle);background:var(--ns-surface-panel);container:ns-filters/inline-size}.ns-filter-fields,.ns-filter-actions{display:flex;align-items:flex-end;gap:var(--ns-space-2);flex-wrap:wrap}.ns-filter-chip{display:inline-flex;align-items:center;gap:.35rem;padding:.25rem .5rem;border:1px solid var(--ns-channel-a25);background:var(--ns-channel-a06);font:700 .72rem/1.2 var(--ns-font-mono);overflow-wrap:anywhere}.ns-filter-chip button{min-inline-size:1.5rem;min-block-size:1.5rem;padding:0;border:0;color:inherit;background:transparent}.ns-bulk-action-bar{position:sticky;z-index:var(--ns-z-raised);inset-block-end:var(--ns-space-2);display:flex;align-items:center;gap:var(--ns-space-3);padding:var(--ns-space-3);border:1px solid var(--ns-channel);background:var(--ns-overlay-surface);box-shadow:var(--ns-overlay-shadow);container:ns-bulk/inline-size}
.ns-column-manager{display:grid;gap:var(--ns-space-2);padding:var(--ns-space-3);border:1px solid var(--ns-border-subtle)}.ns-column-manager label{display:flex;align-items:center;gap:var(--ns-space-2);min-block-size:var(--ns-target-size)}.ns-saved-view{display:grid;gap:.35rem}.ns-saved-view>span{font:800 var(--ns-text-size-label)/1 var(--ns-font-tech);text-transform:uppercase}
.ns-timeline{list-style:none;margin:0;padding:0 0 0 var(--ns-space-5);border-inline-start:1px solid var(--ns-border-strong)}.ns-timeline li{position:relative;padding:0 0 var(--ns-space-4) var(--ns-space-3)}.ns-timeline li::before{content:"";position:absolute;inset-inline-start:calc(var(--ns-space-5) * -1 - 4px);inset-block-start:.35rem;inline-size:7px;block-size:7px;background:var(--ns-data-reference)}.ns-timeline li[data-tone=success]::before{background:var(--ns-accent-green)}.ns-timeline li[data-tone=warning]::before{background:var(--ns-accent-amber)}.ns-timeline li[data-tone=danger]::before{background:var(--ns-accent-red)}.ns-timeline-head{display:flex;justify-content:space-between;gap:var(--ns-space-3)}.ns-timeline time{color:var(--ns-text-muted);font-family:var(--ns-font-mono)}
.ns-log-viewer{max-block-size:24rem;overflow:auto;border:1px solid var(--ns-border-subtle);background:#000;font:.78rem/1.5 var(--ns-font-mono)}.ns-log-entry{display:grid;grid-template-columns:auto auto minmax(0,1fr);gap:var(--ns-space-3);padding:.35rem .6rem;border-block-end:1px solid color-mix(in srgb,var(--ns-border-subtle) 55%,transparent)}.ns-log-entry time,.ns-log-entry>span:nth-child(2){color:var(--ns-text-muted)}.ns-log-entry[data-level=warning]{color:var(--ns-accent-amber)}.ns-log-entry[data-level=danger]{color:var(--ns-accent-red)}
.ns-chart-frame{display:grid;gap:var(--ns-space-3);min-inline-size:0;padding:var(--ns-space-4);border:1px solid var(--ns-border-subtle);background:var(--ns-surface-panel);container:ns-chart/inline-size}.ns-chart-head{display:flex;justify-content:space-between;gap:var(--ns-space-3);flex-wrap:wrap}.ns-chart-head h2{margin:0}.ns-chart-context,.ns-chart-actions{display:flex;gap:var(--ns-space-2);align-items:center;flex-wrap:wrap}.ns-chart-plot{min-inline-size:0;overflow:auto}.ns-viz-legend{list-style:none;display:flex;gap:var(--ns-space-3);flex-wrap:wrap;margin:0;padding:0}.ns-viz-legend li{display:flex;align-items:center;gap:.4rem}.ns-viz-swatch{inline-size:.9rem;block-size:.5rem;border:1px solid currentColor;background:var(--ns-data-reference)}.ns-viz-swatch[data-tone=data-1]{background:var(--ns-data-1)}.ns-viz-swatch[data-tone=data-2]{background:var(--ns-data-2)}.ns-viz-swatch[data-tone=data-3]{background:var(--ns-data-3)}.ns-viz-swatch[data-tone=negative],.ns-viz-swatch[data-tone=danger]{background:var(--ns-data-negative)}.ns-viz-summary{padding:var(--ns-space-3);border-inline-start:3px solid var(--ns-channel);background:var(--ns-channel-a06)}.ns-viz-data-fallback>summary{min-block-size:var(--ns-target-size);padding:var(--ns-space-2);cursor:pointer;color:var(--ns-channel-bright);font-weight:800}.ns-viz-threshold,.ns-viz-reference{font-family:var(--ns-font-mono)}
@container ns-filters (inline-size < 38rem){.ns-filter-bar{align-items:stretch;flex-direction:column}.ns-filter-fields>*{flex:1 1 12rem}}@container ns-chart (inline-size < 32rem){.ns-chart-head{display:grid}.ns-viz-legend{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.ns-chart-actions>.ns-btn{flex:1}}
@container ns-bulk (inline-size < 24rem){.ns-bulk-action-bar{align-items:stretch;flex-direction:column}.ns-bulk-action-bar>.ns-btn{inline-size:100%}}
@media (forced-colors:active){.ns-viz-swatch,.ns-viz-summary,.ns-log-viewer,.ns-filter-bar{border-color:CanvasText}.ns-timeline li::before{background:CanvasText}}
}

/* ===== foundations/forms.css ===== */
@layer ns-components{
/* ── Form foundations (Milestone 4) ───────────────────────────────────
   Structure for building a complete accessible form with no bespoke layout CSS:
   the labelled field, grouped choices, fieldsets, titled sections, affixed
   input groups and the post-submit validation summary. */

/* ── Form ───────────────────────────────────────────────────────────── */
/* The form itself is a layout primitive, so a complete form needs no bespoke structural CSS. */
.ns-form{display:grid;gap:var(--ns-space-6);min-inline-size:0;max-inline-size:var(--ns-form-measure);container:ns-form/inline-size}

/* ── Field ──────────────────────────────────────────────────────────── */
.ns-field{display:grid;gap:var(--ns-field-gap);min-inline-size:0}
.ns-field__required-mark{color:var(--ns-state-danger)}
.ns-error__list{margin:.2rem 0 0;padding-inline-start:1.1rem;display:grid;gap:.15rem}

/* A read-only control is still legible and focusable; only a disabled one dims. */
.ns-control[readonly]{background:var(--ns-field-readonly-background);border-color:var(--ns-field-readonly-border);color:var(--ns-text-secondary);cursor:default}
.ns-control[readonly]:hover{border-color:var(--ns-field-readonly-border)}

/* ── Input group — a control with leading/trailing affixes or actions ── */
.ns-input-group{position:relative;display:flex;align-items:stretch;min-inline-size:0;border:1px solid var(--ns-field-border);border-radius:var(--ns-radius);background:var(--ns-field-background)}
.ns-input-group:hover{border-color:var(--ns-field-border-hover)}
.ns-input-group:focus-within{border-color:var(--ns-field-border-focus)}
.ns-input-group:has(.ns-control[aria-invalid=true]){border-color:var(--ns-field-border-invalid);box-shadow:var(--ns-field-invalid-marker)}
.ns-input-group:has(.ns-control:disabled){opacity:var(--ns-field-disabled-opacity)}
/* The group owns the frame, so the control inside it must not draw a second one. */
.ns-input-group>.ns-control{flex:1 1 auto;min-inline-size:0;border:0;border-radius:0;background:transparent;box-shadow:none}
.ns-input-group>.ns-control:focus-visible{outline:0}
.ns-input-group__affix{display:grid;place-items:center;flex:0 0 auto;padding-inline:.7rem;color:var(--ns-text-muted);font-family:var(--ns-font-mono);font-size:.76rem;white-space:nowrap}
.ns-input-group__action{display:grid;place-items:center;flex:0 0 auto;inline-size:var(--ns-target-size);min-block-size:var(--ns-target-size);border:0;padding:0;color:var(--ns-text-muted);background:transparent;cursor:pointer}
.ns-input-group__action:hover{color:var(--ns-channel-bright);background:var(--ns-channel-a12)}
.ns-input-group__action[aria-pressed=true]{color:var(--ns-channel-bright)}
.ns-input-group__action:disabled{opacity:var(--ns-field-disabled-opacity);cursor:not-allowed}

/* ── Choice groups ──────────────────────────────────────────────────── */
.ns-control-group{display:grid;gap:var(--ns-field-gap);min-inline-size:0;margin:0;padding:0;border:0}
.ns-control-group>.ns-label{padding:0}
.ns-control-group[data-orientation=horizontal] .ns-control-group__items{display:flex;flex-wrap:wrap;gap:var(--ns-space-4)}
.ns-control-group__items{display:grid;gap:.45rem;min-inline-size:0}
.ns-control-group[aria-invalid=true] .ns-check input,.ns-control-group[aria-invalid=true] .ns-switch input{accent-color:var(--ns-state-danger)}

/* ── Fieldset ───────────────────────────────────────────────────────── */
.ns-fieldset{min-inline-size:0;margin:0;padding:var(--ns-space-4);border:1px solid var(--ns-border-subtle);background:var(--ns-surface-panel)}
.ns-fieldset__legend{padding-inline:.45rem;margin-inline-start:-.45rem;color:var(--ns-channel-bright);font-family:var(--ns-font-tech);font-size:var(--ns-text-size-label);font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.ns-fieldset__description{margin:0 0 var(--ns-space-3);color:var(--ns-text-secondary);font-size:.85rem;max-inline-size:68ch}
.ns-fieldset__body{display:grid;gap:var(--ns-fieldset-gap);min-inline-size:0}
.ns-fieldset[disabled]{opacity:var(--ns-field-disabled-opacity)}

/* ── Form section ───────────────────────────────────────────────────── */
.ns-form-section{display:grid;gap:var(--ns-space-4);min-inline-size:0;container:ns-form/inline-size}
.ns-form-section__head{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:var(--ns-space-3);padding-block-end:.6rem;border-block-end:1px solid var(--ns-border-subtle)}
.ns-form-section__title{margin:0;font-family:var(--ns-font-tech);font-size:var(--ns-text-size-h3);letter-spacing:-.01em;color:var(--ns-text-primary)}
.ns-form-section__description{margin:.25rem 0 0;color:var(--ns-text-secondary);font-size:.88rem;max-inline-size:68ch;flex-basis:100%}
.ns-form-section__actions{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.ns-form-section__body{display:grid;gap:var(--ns-fieldset-gap);min-inline-size:0}

/* Two-column form layouts collapse on available space, never on a device guess. */
.ns-fieldset[data-columns="2"] .ns-fieldset__body,
.ns-form-section[data-columns="2"] .ns-form-section__body{grid-template-columns:repeat(2,minmax(0,1fr))}
@container ns-form (inline-size < 34rem){
  .ns-form-section[data-columns="2"] .ns-form-section__body{grid-template-columns:minmax(0,1fr)}
  .ns-fieldset[data-columns="2"] .ns-fieldset__body{grid-template-columns:minmax(0,1fr)}
  .ns-form-section__head{flex-direction:column}
}

/* ── Validation summary ─────────────────────────────────────────────── */
.ns-validation-summary{display:grid;gap:.6rem;padding:var(--ns-space-4);border:1px solid var(--ns-state-danger);border-inline-start-width:4px;background:color-mix(in srgb,var(--ns-state-danger) 8%,var(--ns-surface-panel))}
.ns-validation-summary:focus-visible{outline:3px solid var(--ns-focus-ring);outline-offset:3px}
.ns-validation-summary__title{margin:0;font-family:var(--ns-font-tech);font-size:1rem;font-weight:900;letter-spacing:.03em;color:var(--ns-text-primary)}
.ns-validation-summary__list{margin:0;padding-inline-start:1.1rem;display:grid;gap:.3rem;color:var(--ns-text-secondary);font-size:.88rem}
.ns-validation-summary__list a{color:var(--ns-state-danger);text-underline-offset:.18em}
.ns-validation-summary__list a:hover{color:var(--ns-text-primary)}

@media (forced-colors:active){
  .ns-input-group,.ns-fieldset,.ns-validation-summary{forced-color-adjust:auto;box-shadow:none!important}
  .ns-input-group__action[aria-pressed=true]{color:Highlight}
}
}

/* ===== foundations/instruments.css ===== */
@layer ns-components{
/* ── Instrument frame ──────────────────────────────────────────────
   The signature element: a 1px outer border, a 3px void gutter, a dimmer
   inner border, corner crosshair reticles, and a boxed title chip that
   breaks the top edge. Straight off the reference deorbital-descent screens. */
.ns-frame{position:relative;padding:3px;border:1px solid var(--ns-channel);background:#000}
.ns-frame__inner{position:relative;block-size:100%;border:1px solid var(--ns-channel-a25);padding:var(--ns-space-4);overflow:hidden}
.ns-frame__head{position:relative;z-index:2;display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin-block-end:var(--ns-space-4)}
.ns-frame__title{border:1px solid var(--ns-channel);padding:.14rem .55rem;color:var(--ns-channel-bright);background:color-mix(in srgb,var(--ns-channel) 8%,#000);font-family:var(--ns-font-tech);font-size:.82rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.ns-frame__chip{border:1px solid var(--ns-channel-a25);padding:.14rem .5rem;color:var(--ns-channel);font-family:var(--ns-font-mono);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase}
.ns-frame__body{position:relative;z-index:1}
/* corner crosshair reticles */
.ns-reticle{position:absolute;z-index:0;inline-size:26px;block-size:26px;color:var(--ns-channel);opacity:.75;pointer-events:none}
.ns-reticle::before,.ns-reticle::after{content:"";position:absolute;background:currentColor}
.ns-reticle::before{inset-block-start:50%;inset-inline:0;block-size:1px}
.ns-reticle::after{inset-inline-start:50%;inset-block:0;inline-size:1px}
.ns-reticle[data-pos=tl]{inset-block-start:16px;inset-inline-start:16px}
.ns-reticle[data-pos=tr]{inset-block-start:16px;inset-inline-end:16px}
.ns-reticle[data-pos=bl]{inset-block-end:16px;inset-inline-start:16px}
.ns-reticle[data-pos=br]{inset-block-end:16px;inset-inline-end:16px}

/* ── Boxed telemetry values ─────────────────────────────────────── */
.ns-vbox{display:grid;gap:2px;min-inline-size:0}
.ns-vbox__label{font-family:var(--ns-font-tech);font-size:.7rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ns-channel);line-height:1.15}
.ns-vbox__value{border:1px solid var(--ns-channel);padding:.16rem .45rem;color:var(--ns-channel-bright);background:color-mix(in srgb,var(--ns-channel) 6%,#000);font-family:var(--ns-font-mono);font-size:.86rem;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ns-vbox[data-tone=danger] .ns-vbox__label{color:var(--ns-accent-red)}
.ns-vbox[data-tone=danger] .ns-vbox__value{border-color:var(--ns-accent-red);color:#ffb3aa;background:rgb(255 89 77/.08)}
.ns-rail{display:grid;gap:.75rem;align-content:start;padding:.7rem;border:1px solid var(--ns-channel-a25);background:rgb(0 0 0/.5)}
.ns-rail__group{margin-block-start:.35rem;font-family:var(--ns-font-mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ns-text-muted)}

/* ── Segment / LED strips ───────────────────────────────────────── */
.ns-segments{display:flex;gap:2px;align-items:flex-end}
.ns-segments span{inline-size:7px;block-size:13px;background:color-mix(in srgb,var(--ns-channel) 18%,#000);border:1px solid var(--ns-channel-a25)}
.ns-segments span[data-on=true]{background:var(--ns-channel);border-color:var(--ns-channel);box-shadow:0 0 .45rem var(--ns-channel-a25)}
.ns-segments[data-tone=danger] span[data-on=true]{background:var(--ns-accent-red);border-color:var(--ns-accent-red)}
.ns-segments[data-tone=warning] span[data-on=true]{background:var(--ns-accent-amber);border-color:var(--ns-accent-amber)}

/* ── Hazard bar (Isolation-style capsule alert) ─────────────────── */
.ns-hazard{--hz:var(--ns-accent-amber);display:flex;align-items:center;gap:.7rem;min-block-size:2.6rem;padding:.55rem 2rem .55rem 1rem;color:var(--hz);border:2px solid var(--hz);border-radius:1.4rem;background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--hz) 22%,transparent) 0 9px,transparent 9px 20px),#000;font-family:var(--ns-font-tech);font-size:1.05rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase;clip-path:polygon(0 0,calc(100% - 20px) 0,100% 50%,calc(100% - 20px) 100%,0 100%)}
.ns-hazard[data-tone=danger]{--hz:var(--ns-accent-red)}
.ns-hazard[data-tone=info]{--hz:var(--ns-accent-cyan)}
.ns-hazard .ns-icon{stroke-width:2.2}

/* ── Target lock brackets ───────────────────────────────────────── */
.ns-lock{position:relative;display:inline-grid;place-items:center;padding:12px}
.ns-lock i{position:absolute;inline-size:12px;block-size:12px;border:2px solid var(--ns-channel);box-shadow:0 0 .5rem var(--ns-channel-a25)}
.ns-lock i:nth-child(1){inset-block-start:0;inset-inline-start:0;border-inline-end:0;border-block-end:0}
.ns-lock i:nth-child(2){inset-block-start:0;inset-inline-end:0;border-inline-start:0;border-block-end:0}
.ns-lock i:nth-child(3){inset-block-end:0;inset-inline-start:0;border-inline-end:0;border-block-start:0}
.ns-lock i:nth-child(4){inset-block-end:0;inset-inline-end:0;border-inline-start:0;border-block-start:0}
.ns-lock[data-locking=true] i{animation:lock-converge 420ms var(--ns-easing-emphasis) 1}

/* ── Scan sweep overlay ─────────────────────────────────────────── */
.ns-scan{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:3}
.ns-scan::after{content:"";position:absolute;inset-inline:0;block-size:2px;background:linear-gradient(90deg,transparent,var(--ns-channel),transparent);box-shadow:0 0 1.2rem var(--ns-channel);animation:scan-sweep 1500ms var(--ns-easing-standard) infinite}

/* ── Terminal / boot log ────────────────────────────────────────── */
.ns-term{padding:var(--ns-space-4);border:1px solid var(--ns-border-subtle);background:#010302;color:#c7fbd8;font-family:var(--ns-font-mono);font-size:.82rem;line-height:1.6;overflow:auto}
.ns-term b{color:var(--ns-channel-bright);font-weight:400}
.ns-term__line{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:.9rem;white-space:pre-wrap}
.ns-term__t{color:var(--ns-text-muted)}
.ns-term__ok{color:var(--ns-accent-green)}
.ns-term__warn{color:var(--ns-accent-amber)}
.ns-term__err{color:var(--ns-accent-red)}
.ns-term__cursor{display:inline-block;inline-size:.55em;block-size:1em;translate:0 .12em;background:var(--ns-channel);animation:caret 1s steps(2,end) infinite}

@keyframes scan-sweep{from{inset-block-start:-2px}to{inset-block-start:100%}}
/* Raster Refresh — station/view change reveal, 240ms, once */
.ns-refresh{animation:raster-refresh var(--ns-duration-panel) var(--ns-easing-standard) both}
@keyframes raster-refresh{from{opacity:.25;clip-path:inset(0 0 100% 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}
@keyframes lock-converge{from{opacity:0;scale:1.7}to{opacity:1;scale:1}}
@keyframes caret{50%{opacity:0}}
@keyframes trace-draw{from{stroke-dashoffset:var(--len,1000)}to{stroke-dashoffset:0}}
@keyframes spin-slow{to{rotate:360deg}}
@media (prefers-reduced-motion:reduce){
.ns-scan::after,.ns-lock[data-locking=true] i,.ns-term__cursor,.ns-refresh{animation:none}
.ns-scan{display:none}
}
}

@layer ns-instruments{
.ns-terminal-session{border:1px solid var(--ns-channel-a25);background:#000;font-family:var(--ns-font-mono)}.ns-terminal-header,.ns-terminal-actions{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--ns-space-4);padding:var(--ns-space-3);border-block-end:1px solid var(--ns-border-subtle)}.ns-terminal-header h2{margin:0;color:var(--ns-channel-bright)}.ns-terminal-header dl{display:flex;gap:var(--ns-space-3);margin:0}.ns-terminal-header dl>div{display:grid}.ns-terminal-header dt{color:var(--ns-text-muted);font-size:.65rem;text-transform:uppercase}.ns-terminal-header dd{margin:0}.ns-terminal-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(14rem,24rem);min-inline-size:0}.ns-terminal-transcript{list-style:none;margin:0;padding:var(--ns-space-3);display:grid;gap:var(--ns-space-2)}.ns-terminal-transcript li{padding:var(--ns-space-2);border-inline-start:2px solid var(--ns-data-reference)}.ns-terminal-transcript li[data-kind=inference],.ns-terminal-transcript li[data-kind=consequence]{border-color:var(--ns-accent-amber)}.ns-terminal-transcript li[data-kind=recommendation],.ns-terminal-transcript li[data-kind=result]{border-color:var(--ns-accent-green)}.ns-terminal-entry-head{display:flex;justify-content:space-between;gap:var(--ns-space-3);color:var(--ns-text-muted);font-size:.72rem;text-transform:uppercase}.ns-terminal-confidence{color:var(--ns-accent-amber)}.ns-terminal-evidence{padding:var(--ns-space-3);border-inline-start:1px solid var(--ns-border-subtle);background:var(--ns-surface-panel)}.ns-terminal-prompt{padding:var(--ns-space-3);border-block-start:1px solid var(--ns-border-subtle)}.ns-terminal-actions{border-block-start:1px solid var(--ns-border-subtle);border-block-end:0}
.ns-procedure{padding:var(--ns-space-3);border:1px solid var(--ns-border-subtle)}.ns-procedure>ol{list-style:decimal-leading-zero;display:grid;gap:var(--ns-space-2);margin:var(--ns-space-3) 0 0;padding-inline-start:2.5rem}.ns-procedure li{padding:var(--ns-space-2);border:1px solid var(--ns-border-subtle)}.ns-procedure li[data-status=complete]{border-color:var(--ns-accent-green)}.ns-procedure li[data-status=blocked],.ns-procedure li[data-status=failed]{border-color:var(--ns-accent-red)}.ns-procedure label{display:flex;gap:var(--ns-space-2);align-items:flex-start}.ns-procedure-description,.ns-procedure-blocked{margin-block-start:.25rem;color:var(--ns-text-muted)}.ns-procedure-blocked{color:var(--ns-accent-red)}
.ns-instrument-toolbar{display:flex;align-items:center;gap:var(--ns-space-3);min-block-size:var(--ns-target-size);padding:var(--ns-space-2);border-block:1px solid var(--ns-border-subtle);background:var(--ns-surface-panel)}.ns-instrument-toolbar[data-sticky=true]{position:sticky;z-index:var(--ns-z-raised);inset-block-start:0}.ns-instrument-controls{display:flex;gap:var(--ns-space-2);flex:1;flex-wrap:wrap}.ns-instrument-status{font-family:var(--ns-font-mono);color:var(--ns-channel-bright)}
.ns-readout-group>dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));gap:var(--ns-space-2);margin:0}.ns-readout-group[data-columns="1"]>dl{grid-template-columns:1fr}.ns-readout-group[data-columns="2"]>dl{grid-template-columns:repeat(2,minmax(0,1fr))}.ns-readout-group[data-columns="3"]>dl{grid-template-columns:repeat(3,minmax(0,1fr))}.ns-readout-group dl>div{padding:var(--ns-space-3);border:1px solid var(--ns-border-subtle);background:var(--ns-surface-panel)}.ns-readout-group dt{font:800 var(--ns-text-size-label)/1 var(--ns-font-tech);color:var(--ns-text-muted);text-transform:uppercase}.ns-readout-group dd{margin:.35rem 0 0}.ns-readout-value{font:800 clamp(1.35rem,3cqi,2.5rem)/1 var(--ns-font-mono);color:var(--ns-channel-bright)}.ns-readout-unit,.ns-readout-trend,.ns-readout-description{color:var(--ns-text-muted);font-size:.75rem}.ns-readout-group [data-status=warning]{border-color:var(--ns-accent-amber)}.ns-readout-group [data-status=danger]{border-color:var(--ns-accent-red)}
.ns-wallboard{display:grid;grid-template-columns:minmax(0,1fr) minmax(16rem,24rem);grid-template-areas:"head head" "primary secondary" "events events";gap:var(--ns-space-4);min-block-size:100svh;padding:clamp(var(--ns-space-4),3vw,var(--ns-space-8));background:var(--ns-surface-canvas);container:ns-wallboard/inline-size}.ns-wallboard>header{grid-area:head;display:flex;align-items:flex-start;justify-content:space-between;gap:var(--ns-space-4)}.ns-wallboard h1{margin:0}.ns-wallboard-primary{grid-area:primary;min-inline-size:0}.ns-wallboard-secondary{grid-area:secondary}.ns-wallboard-events{grid-area:events}.ns-wallboard-updated{color:var(--ns-text-muted);font-family:var(--ns-font-mono)}
@container ns-wallboard (inline-size < 52rem){.ns-wallboard{grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "primary" "secondary" "events"}.ns-wallboard>header{display:grid}.ns-readout-group[data-columns]>dl{grid-template-columns:repeat(auto-fit,minmax(9rem,1fr))}}@container ns-wallboard (inline-size < 32rem){.ns-instrument-toolbar{align-items:stretch;flex-direction:column}.ns-terminal-layout{grid-template-columns:minmax(0,1fr)}.ns-terminal-evidence{border-inline-start:0;border-block-start:1px solid var(--ns-border-subtle)}.ns-terminal-header{display:grid}.ns-terminal-header dl{flex-wrap:wrap}}
@media (forced-colors:active){.ns-terminal-session,.ns-procedure,.ns-readout-group dl>div,.ns-instrument-toolbar{border-color:CanvasText}}
}

/* ===== foundations/forms-plus.css ===== */
@layer ns-components{
/* ── Range slider ───────────────────────────────────────────────── */
.ns-range{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.8rem;align-items:center}
.ns-range input[type=range]{inline-size:100%;block-size:1.4rem;appearance:none;background:transparent;margin:0}
.ns-range input[type=range]::-webkit-slider-runnable-track{block-size:6px;background:linear-gradient(90deg,var(--ns-channel) var(--pct,50%),var(--ns-surface-interactive) var(--pct,50%));border:1px solid var(--ns-border-strong)}
.ns-range input[type=range]::-webkit-slider-thumb{appearance:none;margin-block-start:-7px;inline-size:10px;block-size:20px;background:var(--ns-channel-bright);border:1px solid var(--ns-channel);box-shadow:0 0 .6rem var(--ns-channel-a25)}
.ns-range input[type=range]::-moz-range-track{block-size:6px;background:var(--ns-surface-interactive);border:1px solid var(--ns-border-strong)}
.ns-range input[type=range]::-moz-range-progress{block-size:6px;background:var(--ns-channel)}
.ns-range input[type=range]::-moz-range-thumb{border-radius:0;inline-size:10px;block-size:20px;background:var(--ns-channel-bright);border:1px solid var(--ns-channel)}
/* ── Number stepper ─────────────────────────────────────────────── */
.ns-stepper{display:grid;grid-template-columns:var(--ns-target-size) minmax(0,1fr) var(--ns-target-size);border:1px solid var(--ns-border-strong);background:var(--ns-surface-interactive)}
.ns-stepper button{border:0;background:transparent;color:var(--ns-text-muted);font-family:var(--ns-font-mono);min-block-size:var(--ns-target-size)}
.ns-stepper button:hover{color:var(--ns-channel-bright);background:var(--ns-channel-a12)}
.ns-stepper input{min-inline-size:0;border:0;border-inline:1px solid var(--ns-border-strong);background:transparent;color:var(--ns-text-primary);font-family:var(--ns-font-mono);font-variant-numeric:tabular-nums;text-align:center;min-block-size:var(--ns-target-size)}
/* ── Swatch color field ─────────────────────────────────────────── */
.ns-swatches{display:flex;gap:.4rem;flex-wrap:wrap}
.ns-swatches button{inline-size:2rem;block-size:2rem;border:1px solid var(--ns-border-strong);background:var(--sw);padding:0}
.ns-swatches button[aria-checked=true]{border-color:var(--ns-focus-ring);box-shadow:0 0 0 2px #000,0 0 0 3px var(--ns-focus-ring)}
/* ── Combobox ───────────────────────────────────────────────────── */
.ns-combo{position:relative}
.ns-combo__list{position:absolute;z-index:var(--ns-z-popup);inset-inline:0;inset-block-start:calc(100% + var(--ns-popup-offset));max-block-size:var(--ns-popup-max-block-size);overflow:auto;padding:.25rem;border:1px solid var(--ns-popup-border);background:var(--ns-popup-surface);box-shadow:var(--ns-popup-shadow)}
.ns-combo__opt{display:grid;cursor:pointer;grid-template-columns:minmax(0,1fr) auto;gap:.6rem;align-items:center;inline-size:100%;min-block-size:2.4rem;padding:.4rem .55rem;border:1px solid transparent;background:transparent;color:var(--ns-text-primary);text-align:start;font-size:.9rem}
.ns-combo__opt:hover,.ns-combo__opt[data-active=true],.ns-combo__opt[aria-selected=true]{border-color:var(--ns-channel-a25);background:var(--ns-channel-a06);color:var(--ns-channel-bright)}
.ns-combo__opt[data-active=true]{outline:1px solid var(--ns-focus-ring);outline-offset:-2px}
.ns-combo__hint{font-family:var(--ns-font-mono);font-size:.68rem;color:var(--ns-text-muted)}
.ns-combo__empty{padding:.7rem .55rem;color:var(--ns-text-muted);font-size:.85rem}
/* ── Date field + calendar ──────────────────────────────────────── */
.ns-cal{position:absolute;z-index:var(--ns-z-popup);inset-block-start:calc(100% + var(--ns-popup-offset));inset-inline-start:0;inline-size:min(20rem,90vw);padding:.7rem;border:1px solid var(--ns-popup-border);background:var(--ns-popup-surface);box-shadow:var(--ns-popup-shadow)}
.ns-cal__head{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:.5rem;align-items:center;margin-block-end:.6rem}
.ns-cal__month{text-align:center;font-family:var(--ns-font-tech);font-size:.82rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ns-channel-bright)}
.ns-cal__grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.ns-cal__dow{padding:.2rem 0;text-align:center;font-family:var(--ns-font-mono);font-size:.6rem;letter-spacing:.06em;color:var(--ns-text-muted)}
.ns-cal__day{min-block-size:2.1rem;border:1px solid transparent;background:transparent;color:var(--ns-text-secondary);font-family:var(--ns-font-mono);font-size:.78rem;font-variant-numeric:tabular-nums}
.ns-cal__day:hover{border-color:var(--ns-channel-a25);background:var(--ns-channel-a06);color:var(--ns-channel-bright)}
.ns-cal__day[aria-selected=true]{border-color:var(--ns-channel);background:var(--ns-channel-a25);color:#00150a;font-weight:600}
.ns-cal__day[aria-current=date]{outline:1px solid var(--ns-focus-ring);outline-offset:-3px}
.ns-cal__day[data-muted=true]{color:color-mix(in srgb,var(--ns-text-muted) 55%,transparent)}
.ns-cal__foot{display:flex;justify-content:space-between;align-items:center;margin-block-start:.6rem;font-family:var(--ns-font-mono);font-size:.66rem;color:var(--ns-text-muted)}
/* ── File upload ────────────────────────────────────────────────── */
.ns-drop{display:grid;gap:.5rem;place-items:center;padding:1.4rem;border:1px dashed var(--ns-border-strong);background:repeating-linear-gradient(135deg,var(--ns-channel-a06) 0 8px,transparent 8px 18px),var(--ns-surface-interactive);color:var(--ns-text-muted);text-align:center}
.ns-drop[data-over=true]{border-color:var(--ns-channel);color:var(--ns-channel-bright)}
.ns-drop__hint{font-family:var(--ns-font-mono);font-size:.7rem;letter-spacing:.06em;text-transform:uppercase}
.ns-files{display:grid;gap:.3rem;margin-block-start:.6rem}
.ns-file{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:.6rem;align-items:center;padding:.4rem .55rem;border:1px solid var(--ns-border-subtle);background:var(--ns-surface-raised);font-family:var(--ns-font-mono);font-size:.74rem}
/* ── Stepper / wizard ───────────────────────────────────────────── */
.ns-steps{display:flex;flex-wrap:wrap;gap:0;list-style:none;padding:0;margin:0}
.ns-step{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);gap:.6rem;align-items:center;padding:.55rem 1.2rem .55rem .7rem;border:1px solid var(--ns-border-subtle);border-inline-end:0;background:var(--ns-surface-panel);min-inline-size:0}
.ns-step:last-child{border-inline-end:1px solid var(--ns-border-subtle)}
.ns-step__n{display:grid;place-items:center;inline-size:1.6rem;block-size:1.6rem;border:1px solid var(--ns-border-strong);color:var(--ns-text-muted);font-family:var(--ns-font-mono);font-size:.72rem}
.ns-step__label{font-family:var(--ns-font-tech);font-size:.78rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ns-text-muted);white-space:nowrap}
.ns-step[data-state=done] .ns-step__n{border-color:var(--ns-channel);color:var(--ns-channel);background:var(--ns-channel-a12)}
.ns-step[data-state=done] .ns-step__label{color:var(--ns-text-secondary)}
.ns-step[data-state=current]{background:var(--ns-channel-a06);border-color:var(--ns-channel-a25)}
.ns-step[data-state=current] .ns-step__n{border-color:var(--ns-channel);background:var(--ns-channel);color:#00150a}
.ns-step[data-state=current] .ns-step__label{color:var(--ns-channel-bright)}
@media (width < 30rem){.ns-cal{position:fixed;inset-inline:max(1rem,env(safe-area-inset-left)) max(1rem,env(safe-area-inset-right));inset-block:auto max(1rem,env(safe-area-inset-bottom));inline-size:auto;max-block-size:calc(100dvh - max(2rem,env(safe-area-inset-top) + env(safe-area-inset-bottom)));overflow:auto}.ns-combo__list{position:fixed;inset-inline:max(1rem,env(safe-area-inset-left)) max(1rem,env(safe-area-inset-right));inset-block:auto max(1rem,env(safe-area-inset-bottom));max-block-size:min(50dvh,20rem)}}
}

/* ===== foundations/inputs.css ===== */
@layer ns-components{
/* ── Advanced inputs (Milestone 5) ────────────────────────────────────
   The shared popup surface, and the controls that did not exist in v0.2:
   multi-select, tag input, masked field and one-time-code entry. The
   combobox, calendar and file-drop rules stay in forms-plus.css. */

/* ── Shared popup surface ───────────────────────────────────────────── */
/* Anchored is the default presentation; `sheet` is its non-modal, full-width mobile rendering.
   Focus remains on the owning control so aria-activedescendant operation stays intact. */
.ns-popup{z-index:var(--ns-z-popup);border:1px solid var(--ns-popup-border);background:var(--ns-popup-surface);box-shadow:var(--ns-popup-shadow)}
.ns-popup[data-presentation=anchored]{position:absolute;inset-block-start:calc(100% + var(--ns-popup-offset));inset-inline:0;max-block-size:var(--ns-popup-max-block-size);overflow:auto}
.ns-popup[data-presentation=sheet]{
  position:fixed;z-index:var(--ns-z-drawer);
  inset-inline:0;inset-block-end:0;
  max-block-size:min(70dvh,32rem);overflow:auto;
  /* Clear of the home indicator, and of the virtual keyboard when one is open. */
  padding-block-end:max(var(--ns-space-2),env(safe-area-inset-bottom));
  border-inline:0;border-block-end:0;
  animation:ns-sheet-in var(--ns-duration-panel) var(--ns-easing-standard) both;
}
.ns-popup__scrim{position:fixed;inset:0;z-index:var(--ns-z-nav-scrim);background:var(--ns-overlay-scrim);border:0}
.ns-popup__head{position:sticky;inset-block-start:0;z-index:var(--ns-z-raised);display:flex;align-items:center;justify-content:space-between;gap:var(--ns-space-3);padding:.7rem .8rem;border-block-end:1px solid var(--ns-border-subtle);background:var(--ns-popup-surface)}
.ns-popup__title{font-family:var(--ns-font-tech);font-size:var(--ns-text-size-label);font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ns-channel-bright)}
.ns-popup__close{display:grid;place-items:center;inline-size:var(--ns-target-size);min-block-size:var(--ns-target-size);border:0;padding:0;color:var(--ns-text-muted);background:transparent;cursor:pointer}
.ns-popup__close:hover{color:var(--ns-channel-bright);background:var(--ns-channel-a12)}
@keyframes ns-sheet-in{from{transform:translateY(1.5rem);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.ns-popup[data-presentation=sheet]{animation:none}}

/* ── Multi-select ───────────────────────────────────────────────────── */
.ns-multiselect{position:relative;min-inline-size:0}
.ns-multiselect__tags{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem;min-block-size:var(--ns-target-size);padding:.25rem .4rem;border:1px solid var(--ns-field-border);border-radius:var(--ns-radius);background:var(--ns-field-background)}
.ns-multiselect__tags:hover{border-color:var(--ns-field-border-hover)}
.ns-multiselect__tags:focus-within{border-color:var(--ns-field-border-focus)}
.ns-multiselect__tags:has(.ns-control[aria-invalid=true]){border-color:var(--ns-field-border-invalid);box-shadow:var(--ns-field-invalid-marker)}
.ns-multiselect__tag,.ns-taginput__tag{display:inline-flex;align-items:center;gap:.35rem;padding:.14rem .2rem .14rem .45rem;border:1px solid var(--ns-channel-a25);background:var(--ns-channel-a12);color:var(--ns-channel-bright);font-family:var(--ns-font-mono);font-size:.74rem;white-space:nowrap}
/* 1.5rem = 24px, the WCAG 2.2 AA floor for a target. These sit inside a tag, so they cannot take
   the full --ns-target-size without the tag itself becoming a button-sized block. */
.ns-multiselect__tag-remove,.ns-taginput__tag-remove{display:grid;place-items:center;inline-size:1.5rem;block-size:1.5rem;border:0;padding:0;color:inherit;background:transparent;cursor:pointer}
.ns-multiselect__tag-remove:hover,.ns-taginput__tag-remove:hover{color:var(--ns-state-danger)}
.ns-multiselect__tag-remove .ns-icon,.ns-taginput__tag-remove .ns-icon{inline-size:.85em;block-size:.85em}
.ns-multiselect__overflow{padding:.14rem .45rem;color:var(--ns-text-muted);font-family:var(--ns-font-mono);font-size:.7rem}
.ns-multiselect__input,.ns-taginput__input{flex:1 1 6rem;min-inline-size:4rem;border:0;padding:.2rem;background:transparent;color:var(--ns-text-primary)}
.ns-multiselect__input:focus-visible,.ns-taginput__input:focus-visible{outline:0}

/* ── Tag input ──────────────────────────────────────────────────────── */
.ns-taginput{position:relative;min-inline-size:0}
.ns-taginput__tags{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem;min-block-size:var(--ns-target-size);padding:.25rem .4rem;border:1px solid var(--ns-field-border);border-radius:var(--ns-radius);background:var(--ns-field-background)}
.ns-taginput__tags:hover{border-color:var(--ns-field-border-hover)}
.ns-taginput__tags:focus-within{border-color:var(--ns-field-border-focus)}
.ns-taginput__error{display:block;margin-block-start:.3rem;color:var(--ns-state-danger);font-size:.82rem}

/* ── Masked field ───────────────────────────────────────────────────── */
.ns-masked{position:relative;min-inline-size:0}
.ns-masked .ns-control{font-family:var(--ns-font-mono);font-variant-numeric:tabular-nums;letter-spacing:.04em}

/* ── One-time code ──────────────────────────────────────────────────── */
.ns-otp{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem;min-inline-size:0}
.ns-otp__group{display:flex;gap:.3rem}
.ns-otp__box{
  inline-size:2.6rem;min-block-size:var(--ns-target-size);
  padding:0;text-align:center;
  border:1px solid var(--ns-field-border);border-radius:var(--ns-radius);
  background:var(--ns-field-background);color:var(--ns-text-primary);
  font-family:var(--ns-font-mono);font-size:1.15rem;font-variant-numeric:tabular-nums;
}
.ns-otp__box:hover{border-color:var(--ns-field-border-hover)}
.ns-otp__box[aria-invalid=true]{border-color:var(--ns-field-border-invalid)}
.ns-otp__box:disabled{opacity:var(--ns-field-disabled-opacity);cursor:not-allowed}

/* ── Adapter wrapper ────────────────────────────────────────────────── */
/* Third-party controls are scoped by this wrapper so their stylesheets can be overridden
   without leaking Nostromo rules into the rest of the host application. */
.ns-adapter{position:relative;min-inline-size:0}

@media (forced-colors:active){
  .ns-popup,.ns-multiselect__tags,.ns-taginput__tags,.ns-otp__box{forced-color-adjust:auto;box-shadow:none!important}
  .ns-multiselect__tag,.ns-taginput__tag{border-color:CanvasText}
}
}

/* ===== foundations/patterns.css ===== */
@layer ns-patterns{
.ns-topbar{position:fixed;z-index:var(--ns-z-topbar);inset-block-start:0;inset-inline:0;min-block-size:var(--ns-header-height);display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.75rem;padding-inline:max(.75rem,env(safe-area-inset-left)) max(.75rem,env(safe-area-inset-right));border-block-end:1px solid var(--ns-border-subtle);background:rgb(3 5 4/.92);backdrop-filter:blur(8px)}
.ns-brand{display:flex;align-items:center;gap:.7rem;min-inline-size:0}
.ns-brand-mark{inline-size:2.15rem;block-size:2.15rem;display:grid;place-items:center;border:1px solid var(--ns-channel);color:var(--ns-channel);background:var(--ns-channel-a12)}
.ns-brand-name{font-family:var(--ns-font-tech);font-size:.84rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ns-brand-sub{display:block;font-family:var(--ns-font-mono);font-size:.6rem;color:var(--ns-text-muted)}
.ns-system-strip{display:flex;align-items:center;justify-content:center;gap:1rem;min-inline-size:0;overflow:hidden;white-space:nowrap;font-family:var(--ns-font-mono);font-size:.66rem;color:var(--ns-text-muted)}
.ns-toolbar{display:flex;gap:.3rem}
.ns-toolbar .ns-btn{font-size:.7rem}
.ns-shell{min-block-size:100svh;padding-block-start:var(--ns-header-height);display:grid;grid-template-columns:var(--ns-nav-width) minmax(0,1fr)}
.ns-sidebar{position:sticky;inset-block-start:var(--ns-header-height);block-size:calc(100svh - var(--ns-header-height));overflow:auto;padding:1rem .75rem max(2rem,env(safe-area-inset-bottom));border-inline-end:1px solid var(--ns-border-subtle);background:var(--ns-surface-panel);scrollbar-width:thin}
.ns-sidebar-close{display:none;inline-size:100%;margin-block-end:.5rem}
.ns-nav-group{margin:.8rem .65rem .35rem;font-family:var(--ns-font-mono);font-size:.64rem;letter-spacing:.09em;text-transform:uppercase;color:var(--ns-text-muted)}
.ns-nav-list{list-style:none;padding:0;margin:0;display:grid;gap:.1rem}
.ns-nav-link{position:relative;display:grid;grid-template-columns:1.2rem minmax(0,1fr) auto;gap:.65rem;align-items:center;inline-size:100%;min-block-size:2.65rem;padding:.5rem .65rem;border:1px solid transparent;color:var(--ns-text-muted);background:transparent;text-decoration:none;text-align:start;font-family:var(--ns-font-tech);font-size:.77rem;font-weight:800}
.ns-nav-link:hover{color:var(--ns-text-primary);border-color:var(--ns-border-subtle)}
.ns-nav-link[aria-current=page]{color:var(--ns-channel-bright);border-color:var(--ns-channel-a25);background:var(--ns-channel-a06)}
.ns-nav-link[aria-current=page]::before{content:"";position:absolute;inset-block:.3rem;inset-inline-start:-1px;inline-size:2px;background:var(--ns-channel);box-shadow:0 0 .6rem var(--ns-channel)}
.ns-nav-index{font-family:var(--ns-font-mono);font-size:.62rem}
.ns-main{inline-size:100%;max-inline-size:100%;min-inline-size:0;contain:inline-size layout;container:ns-main/inline-size}
.ns-nav-toggle{display:none}
.ns-nav-scrim{position:fixed;inset:0;z-index:var(--ns-z-nav-scrim);background:var(--ns-overlay-scrim);border:0}

/* Governed station layout patterns. The station is the query container; content adapts to
   available space rather than a named device. */
.ns-station{display:grid;grid-template-columns:minmax(0,1fr);inline-size:100%;max-inline-size:100%;gap:var(--ns-space-4);contain:inline-size layout;container:ns-station/inline-size;min-inline-size:0}
.ns-screen-header{display:flex;align-items:center;gap:var(--ns-space-4);flex-wrap:wrap;min-inline-size:0}
.ns-screen-header h1{font-size:clamp(1.45rem,1.1rem + 1.2vw,1.9rem)!important;margin:0!important;overflow-wrap:anywhere}
.ns-overview-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(13rem,1fr);gap:var(--ns-space-4);align-items:start;min-inline-size:0}
.ns-main-rail{display:grid;grid-template-columns:minmax(0,1fr) minmax(12rem,15rem);gap:var(--ns-space-4);align-items:start;min-inline-size:0}
.ns-instrument-grid{display:grid;grid-template-columns:minmax(17rem,1fr) minmax(17rem,1fr) minmax(11rem,13rem);gap:var(--ns-space-3);align-items:stretch;min-inline-size:0}
.ns-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--ns-space-4);min-inline-size:0}
.ns-value-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,9rem),1fr));gap:var(--ns-space-3);min-inline-size:0}
.ns-lock-row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--ns-space-4);align-items:center;min-inline-size:0}
.ns-actions{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center}
.ns-prose{color:var(--ns-text-secondary);max-inline-size:68ch;margin:0}
.ns-dialog-value-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;margin-block-end:.8rem}

@container ns-station (inline-size < 72rem){
  .ns-instrument-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ns-instrument-grid>.ns-rail{grid-column:1/-1;grid-template-columns:repeat(auto-fit,minmax(10rem,1fr))}
}
@container ns-station (inline-size < 52rem){
  .ns-overview-grid,.ns-main-rail,.ns-instrument-grid{grid-template-columns:minmax(0,1fr)}
  .ns-instrument-grid>.ns-rail{grid-column:auto}
}
@container ns-station (inline-size < 44rem){
  .ns-form-grid,.ns-dialog-value-grid{grid-template-columns:minmax(0,1fr)}
  .ns-lock-row{grid-template-columns:minmax(0,1fr);align-items:stretch}
  .ns-actions>.ns-btn:not(.ns-btn-icon){flex:1 1 12rem}
}

@media (width < 64rem){
  .ns-shell{grid-template-columns:minmax(0,1fr)}
  .ns-sidebar{position:fixed;inset-block:var(--ns-header-height) 0;inset-inline-start:0;z-index:var(--ns-z-drawer);inline-size:min(88vw,20rem);transform:translateX(-105%);transition:transform var(--ns-duration-panel) var(--ns-easing-standard)}
  .ns-sidebar[data-open=true]{transform:none}
  .ns-sidebar-close{display:inline-flex}
  .ns-nav-toggle{display:inline-flex}
}
@media (width < 48rem){
  .ns-system-strip{display:none}
  .ns-brand-sub{display:none}
  .ns-topbar{grid-template-columns:minmax(0,1fr) auto}
  .ns-toolbar{grid-column:2}
}
@media (orientation:landscape) and (height < 32rem){
  .ns-topbar{position:absolute}
  .ns-sidebar{inset-block-start:var(--ns-header-height)}
  .ns-dialog-head,.ns-dialog-actions{padding-block:.7rem}
}
@media (width >= 64rem){.ns-nav-scrim{display:none}.ns-sidebar-close{display:none}}

/* Milestone 6 application composition primitives. */
.ns-container{inline-size:100%;margin-inline:auto;padding-inline:var(--ns-layout-gutter);container:ns-container/inline-size}.ns-container--content{max-inline-size:72rem}.ns-container--wide{max-inline-size:var(--ns-layout-max)}.ns-container--full{max-inline-size:none}
.ns-stack{display:flex;flex-direction:column;gap:var(--ns-layout-gap,var(--ns-space-4));min-inline-size:0}.ns-inline,.ns-cluster{display:flex;gap:var(--ns-layout-gap,var(--ns-space-3));min-inline-size:0}.ns-inline{flex-wrap:nowrap}.ns-cluster{flex-wrap:wrap;align-items:center}.ns-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,var(--ns-grid-min,16rem)),1fr));gap:var(--ns-layout-gap,var(--ns-space-4));min-inline-size:0}
.ns-surface{min-inline-size:0;padding:var(--ns-space-4);border:1px solid var(--ns-border-subtle);background:var(--ns-surface-panel)}.ns-surface--none{padding:0}.ns-surface--compact{padding:var(--ns-space-2)}.ns-surface--elevated{background:var(--ns-surface-raised);box-shadow:var(--ns-overlay-shadow)}
.ns-divider{display:flex;align-items:center;gap:var(--ns-space-2);color:var(--ns-text-muted);font:700 var(--ns-text-size-label)/1 var(--ns-font-tech);text-transform:uppercase}.ns-divider::before,.ns-divider::after{content:"";flex:1;border-block-start:1px solid var(--ns-border-subtle)}
.ns-scroll-area{max-inline-size:100%;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable}.ns-split-pane{display:grid;grid-template-columns:minmax(0,1fr) minmax(14rem,var(--ns-split-secondary));gap:var(--ns-space-4);min-inline-size:0}.ns-app-shell{min-block-size:100svh;display:grid;grid-template-columns:var(--ns-nav-width) minmax(0,1fr)}.ns-app-shell-nav{border-inline-end:1px solid var(--ns-border-subtle);background:var(--ns-surface-panel)}.ns-app-shell-main{min-inline-size:0;padding:var(--ns-layout-gutter);container:ns-page/inline-size}.ns-app-shell-scrim{display:none}.ns-page-header{display:grid;gap:var(--ns-space-3);margin-block-end:var(--ns-space-6)}.ns-page-header-row{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--ns-space-4);flex-wrap:wrap}.ns-page-header h1{margin:0;font-size:clamp(1.6rem,1.2rem + 1.5vw,2.5rem)}.ns-page-eyebrow{font:800 var(--ns-text-size-label)/1 var(--ns-font-mono);color:var(--ns-channel);letter-spacing:.08em;text-transform:uppercase}.ns-page-description{max-inline-size:68ch;color:var(--ns-text-secondary)}.ns-page-actions{display:flex;gap:var(--ns-space-2);flex-wrap:wrap}
.ns-side-nav-list,.ns-breadcrumb ol{list-style:none;margin:0;padding:0}.ns-side-nav-list{display:grid;gap:2px}.ns-side-nav-link{display:block;inline-size:100%;min-block-size:var(--ns-target-size);padding:var(--ns-space-2) var(--ns-space-3);border:1px solid transparent;color:var(--ns-text-secondary);background:transparent;text-align:start;text-decoration:none}.ns-side-nav-link[aria-current=page]{color:var(--ns-channel-bright);border-color:var(--ns-channel-a25);background:var(--ns-channel-a06)}.ns-nav-section-toggle{inline-size:100%;padding:var(--ns-space-2);border:0;color:var(--ns-text-muted);background:transparent;text-align:start;font:800 var(--ns-text-size-label)/1 var(--ns-font-tech);text-transform:uppercase}.ns-breadcrumb ol{display:flex;gap:var(--ns-space-2);flex-wrap:wrap;font-size:.82rem}.ns-breadcrumb li+li::before{content:"/";margin-inline-end:var(--ns-space-2);color:var(--ns-border-strong)}
.ns-pagination,.ns-action-toolbar{display:flex;gap:var(--ns-space-1);align-items:center;flex-wrap:wrap}.ns-pagination button{min-block-size:var(--ns-target-size);min-inline-size:var(--ns-target-size);border:1px solid var(--ns-border-subtle);color:var(--ns-text-primary);background:var(--ns-surface-interactive)}.ns-pagination button[aria-current=page]{border-color:var(--ns-channel);color:var(--ns-channel-bright);background:var(--ns-channel-a12)}
.ns-menu,.ns-popover-anchor{position:relative;display:inline-block}.ns-menu-panel,.ns-popover{position:absolute;z-index:var(--ns-z-popover);inset-block-start:calc(100% + .25rem);inset-inline-start:0;min-inline-size:12rem;padding:var(--ns-space-1);border:1px solid var(--ns-popup-border);background:var(--ns-popup-background);box-shadow:var(--ns-popup-shadow)}.ns-popover[data-align=end]{inset-inline-start:auto;inset-inline-end:0}.ns-menu-panel button{display:block;inline-size:100%;min-block-size:var(--ns-target-size);padding:var(--ns-space-2);border:0;color:var(--ns-text-primary);background:transparent;text-align:start}.ns-menu-panel button:focus-visible,.ns-menu-panel button:hover{background:var(--ns-channel-a12);color:var(--ns-channel-bright)}
.ns-accordion{border-block-start:1px solid var(--ns-border-subtle)}.ns-accordion section{border-block-end:1px solid var(--ns-border-subtle)}.ns-accordion h3{margin:0}.ns-accordion h3 button{inline-size:100%;min-block-size:var(--ns-target-size);padding:var(--ns-space-3);border:0;color:var(--ns-text-primary);background:transparent;text-align:start}.ns-accordion section>div{padding:0 var(--ns-space-3) var(--ns-space-3)}.ns-tree ul{list-style:none;margin:0;padding-inline-start:var(--ns-space-4)}.ns-tree>ul{padding-inline-start:0}.ns-tree button{min-block-size:var(--ns-target-size);border:0;color:var(--ns-text-primary);background:transparent}
.ns-drawer,.ns-sheet{position:fixed;z-index:var(--ns-z-drawer);border:1px solid var(--ns-border-subtle);background:var(--ns-overlay-surface);box-shadow:var(--ns-overlay-shadow);transition:transform var(--ns-duration-panel) var(--ns-easing-standard)}.ns-drawer{inset-block:0;inset-inline-start:0;inline-size:min(24rem,90vw);transform:translateX(-105%)}.ns-drawer[data-position=end]{inset-inline-start:auto;inset-inline-end:0;transform:translateX(105%)}.ns-drawer[data-open=true]{transform:none}.ns-drawer>header,.ns-sheet>header,.ns-sheet>footer{display:flex;align-items:center;justify-content:space-between;gap:var(--ns-space-3);padding:var(--ns-space-4);border-block-end:1px solid var(--ns-border-subtle)}.ns-drawer h2,.ns-sheet h2{margin:0}.ns-drawer-body,.ns-sheet-body{padding:var(--ns-space-4);overflow:auto}.ns-drawer-scrim,.ns-sheet-scrim{position:fixed;z-index:var(--ns-z-nav-scrim);inset:0;border:0;background:var(--ns-overlay-scrim)}.ns-sheet{inset-inline:0;inset-block-end:0;max-block-size:min(80dvh,48rem);transform:translateY(105%)}.ns-sheet[data-open=true]{transform:none}.ns-context-menu{position:fixed;z-index:var(--ns-z-popover);min-inline-size:12rem;padding:var(--ns-space-1);border:1px solid var(--ns-popup-border);background:var(--ns-popup-background);box-shadow:var(--ns-popup-shadow)}
.ns-banner{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:var(--ns-space-3);padding:var(--ns-space-3) var(--ns-space-4);border:1px solid currentColor;background:var(--ns-surface-panel)}.ns-banner strong,.ns-status-message strong{display:block;color:inherit}.ns-banner-actions{display:flex;gap:var(--ns-space-2);flex-wrap:wrap}.ns-spinner{display:inline-block;inline-size:1.5rem;block-size:1.5rem;border:2px solid var(--ns-border-strong);border-block-start-color:var(--ns-channel);border-radius:50%;animation:ns-spin .8s linear infinite}.ns-spinner--small{inline-size:1rem;block-size:1rem}.ns-spinner--large{inline-size:2.25rem;block-size:2.25rem}@keyframes ns-spin{to{transform:rotate(1turn)}}.ns-skeleton{display:grid;gap:var(--ns-space-2)}.ns-skeleton span{display:block;block-size:1rem;background:linear-gradient(90deg,var(--ns-surface-interactive),var(--ns-channel-a12),var(--ns-surface-interactive));background-size:200% 100%;animation:ns-skeleton 1.2s linear infinite}@keyframes ns-skeleton{to{background-position:-200% 0}}.ns-loading-region{position:relative;min-block-size:4rem}.ns-loading-overlay{position:absolute;z-index:var(--ns-z-raised);inset:0;display:grid;place-content:center;gap:var(--ns-space-2);text-align:center;background:color-mix(in srgb,var(--ns-overlay-surface) 88%,transparent)}.ns-empty-state{display:grid;place-items:center;gap:var(--ns-space-3);min-block-size:16rem;padding:var(--ns-space-8);border:1px dashed var(--ns-border-strong);text-align:center}.ns-empty-state h2{margin:0}.ns-status-message{padding:var(--ns-space-2) var(--ns-space-3);border-inline-start:3px solid currentColor;background:var(--ns-surface-panel)}
@container ns-page (inline-size < 48rem){.ns-split-pane{grid-template-columns:minmax(0,1fr)}.ns-page-actions{inline-size:100%}.ns-page-actions>.ns-btn{flex:1}.ns-banner{grid-template-columns:minmax(0,1fr) auto}.ns-banner-actions{grid-column:1/-1}}
@media (width < 64rem){.ns-app-shell{grid-template-columns:minmax(0,1fr)}.ns-app-shell-nav{position:fixed;z-index:var(--ns-z-drawer);inset-block:0;inset-inline-start:0;inline-size:min(20rem,88vw);transform:translateX(-105%);transition:transform var(--ns-duration-panel) var(--ns-easing-standard)}.ns-app-shell-nav[data-open=true]{transform:none}.ns-app-shell-scrim{display:block;position:fixed;z-index:var(--ns-z-nav-scrim);inset:0;border:0;background:var(--ns-overlay-scrim)}}
@media (prefers-reduced-motion:reduce){.ns-spinner,.ns-skeleton span{animation:none}.ns-drawer,.ns-sheet,.ns-app-shell-nav{transition:none}}
@media (forced-colors:active){.ns-surface,.ns-banner,.ns-empty-state,.ns-drawer,.ns-sheet,.ns-menu-panel,.ns-popover{border-color:CanvasText}.ns-spinner{border-color:CanvasText;border-block-start-color:Highlight}}
}
