


:root {
  
  --mos-font-ui: 'Inter', 'Noto Sans', 'DejaVu Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --mos-font-data: var(--mos-font-ui);
  --mos-font-display: var(--mos-font-ui);
  --mos-font-body: var(--mos-font-ui);
  --mos-font-figure: var(--mos-font-data);

  
  --mos-type-screen-title-size: 22px;   --mos-type-screen-title-lh: 28px;
  --mos-type-section-head-size: 15px;   --mos-type-section-head-lh: 20px;
  --mos-type-wordmark-size: 13px;       --mos-type-wordmark-lh: 16px;
  --mos-type-wordmark-ls: 0em;
  --mos-type-body-size: 14px;           --mos-type-body-lh: 20px;
  --mos-type-lead-size: 13px;           --mos-type-lead-lh: 18px;
  --mos-type-money-size: 14px;          --mos-type-money-lh: 20px;
  --mos-type-subfigure-size: 12px;      --mos-type-subfigure-lh: 17px;
  --mos-type-label-size: 11px;          --mos-type-label-lh: 15px;
  --mos-type-label-ls: 0.06em;
  --mos-type-memo-size: 12px;           --mos-type-memo-lh: 16px;
  --mos-type-total-size: 30px;          --mos-type-total-lh: 34px;
  --mos-type-total-weight: 650;
  --mos-type-stamp-size: 11px;          --mos-type-stamp-lh: 15px;
  --mos-type-stamp-ls: 0.06em;
  --mos-type-stamp-weight: 700;

  
  --mos-type-figure-variant: tabular-nums;

  
  --r-sm: 6px; --r-md: 8px; --r-lg: 12px; --r-xl: 16px;
  --dur-fast: 120ms; --dur: 200ms; --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
}


:root,
:root[data-theme='light'] {
  
  
  --mos-sheet: #ffffff;
  --mos-desk: #f6f7f9;
  --mos-band: #f6f7f9;
  --mos-band-field: #ffffff;
  
  --mos-card-field: #ffffff;

  
  --mos-ink: #0b0d12;         
  --mos-ink-run: #0b0d12;     
  --mos-ink-quiet: #4b5563;   

  
  --mos-gold-rule: #1f37b5;
  
  --mos-gold-fill: #1f37b5;
  --mos-gold-fill-ink: #ffffff;
  --mos-gold-fill-line: #1f37b5;
  --mos-gold-fill-hover: #192d96;
  --mos-gold-text: #1f37b5;   
  
  --mos-gold-text-on-band: #1f37b5;

  
  --mos-rule-hairline: #e4e7ec;
  --mos-rule-strong: #878f9c;
  --mos-band-rule: #e4e7ec;

  
  --mos-tick: #14532d;

  
  
  
  --mos-status-live: #1F4B3A;
  --mos-status-wait: #7c3306;
  
  --mos-status-work: #1f37b5;
  --mos-status-complete: #475569;
  --mos-status-stop: #b91c1c;
  --mos-status-idle: #4b5563;
  
  --mos-status-live-tint: #ecfdf3;
  --mos-status-wait-tint: #fef3c7;
  --mos-status-work-tint: #eef1fc;
  --mos-status-complete-tint: #eef1fc;
  --mos-status-stop-tint: #fef2f2;
  --mos-text-on-action: #ffffff;

  
  --mos-status-live-word: var(--mos-ink);
  --mos-status-wait-word: var(--mos-ink);
  --mos-status-work-word: var(--mos-ink);
  --mos-status-complete-word: var(--mos-ink);
  --mos-status-stop-word: var(--mos-ink);
  
  --mos-tile-shadow: inset 0 0 0 1px var(--mos-sheet);
  --mos-halo-figure: none;
  --mos-halo-state: none;
  --mos-halo-title: none;
  --mos-halo-tab: none;
  
  --mos-inset-shadow: 0 0 0 0 transparent;
  
  --mos-skeleton-sheen: rgba(255, 255, 255, 0.6);
  
  --mos-rule-inert: var(--mos-rule-strong);

  
  --mos-status-green: #14532d;
  --mos-status-greenbg: #dcfce7;
  --mos-status-yellow: #5c2604;
  --mos-status-yellowbg: #fef3c7;
  --mos-status-red: #991b1b;
  --mos-status-redbg: #fee2e2;
  --mos-status-blue: #1e3a8a;
  --mos-status-bluebg: #dbeafe;

  
  --mos-switcher-pill: var(--mos-status-blue);
  --mos-switcher-pill-ink: var(--mos-text-on-status);

  
  --mos-color-scheme: light;
  --mos-surface-page: #ffffff;
  --mos-surface-card: #ffffff;
  --mos-surface-sunk: #f6f7f9;
  --mos-surface-raised: #ffffff;
  --mos-text-strong: #0b0d12;
  --mos-text-body: #0b0d12;
  --mos-text-dim: #4b5563;
  --mos-text-on-accent: #ffffff;
  --mos-text-on-status: #ffffff;
  --mos-accent: #1f37b5;
  --mos-accent-hover: #192d96;
  --mos-accent-deep: #142476;
  --mos-accent-tint: #eef1fc;
  --mos-accent-line: #c3ccf3;
  --mos-accent-solid: #1f37b5;
  --mos-text-on-solid: #ffffff;
  --mos-text-on-solid-dim: #dbe1fa;
  --mos-focus-ring: #1f37b5;
  --mos-gold: #1f37b5;
  --mos-gold-ink: #1f37b5;
  --mos-gold-wash: #eef1fc;
  --mos-line: #e4e7ec;
  --mos-line-strong: #878f9c;
  --mos-ok: #1F4B3A;
  --mos-ok-tint: #ecfdf3;
  --mos-ok-line: #b7e4c7;
  --mos-warn: #5c2604;
  --mos-warn-tint: #fef3c7;
  --mos-warn-line: #f3d98a;
  --mos-danger: #b91c1c;
  --mos-danger-tint: #fef2f2;
  --mos-danger-line: #f3c0c0;
  --mos-info: #475569;
  --mos-info-tint: #f1f5f9;
  --mos-info-line: #cbd5e1;

  
  --bg: #ffffff; --surface: #ffffff; --surface-2: #f6f7f9; --surface-3: #eef0f3;
  --text: #0b0d12; --muted: #4b5563; --subtle: #6b7280;
  --border: #e4e7ec; --border-ctl: #d0d5dd; --border-strong: #878f9c;
  --primary: #1f37b5; --primary-hover: #192d96; --primary-press: #142476; --on-primary: #ffffff; --primary-text: #1f37b5; --primary-edge: transparent;
  --sel: #eef1fc; --sel-border: #c3ccf3; --focus: #1f37b5;
  --success: #14532d; --success-bg: #ecfdf3; --error: #b91c1c; --error-bg: #fef2f2;
  --warning: #f59e0b; --on-warning: #0b0d12; --info: #475569; --info-bg: #f1f5f9;
  --toast-bg: #0b0d12; --toast-text: #ffffff; --toast-link: #9aaaff; --scrim: rgba(11, 13, 18, 0.36);
  --sh-xs: 0 1px 2px rgba(16, 24, 40, 0.05); --sh-sm: 0 1px 3px rgba(16, 24, 40, 0.08), 0 1px 2px rgba(16, 24, 40, 0.04);
  --sh-lg: 0 12px 32px -12px rgba(16, 24, 40, 0.22), 0 4px 8px -4px rgba(16, 24, 40, 0.06);
  --sh-btn: 0 1px 2px rgba(16, 24, 40, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.16);
}


@media (prefers-color-scheme: dark) {
:root:not([data-theme]) {
  
  --mos-sheet: #0b0d12;       
  --mos-desk: #14171f;        
  --mos-band: #1b1f29;        
  --mos-band-field: #232835;  
  --mos-card-field: #1b1f29;  

  --mos-ink: #f3f4f6;         
  --mos-ink-run: #f3f4f6;     
  --mos-ink-quiet: #a1a8b5;   

  
  --mos-gold-rule: #9aaaff;
  
  --mos-gold-fill: #4660e0;
  --mos-gold-fill-ink: #ffffff;
  --mos-gold-fill-line: #4660e0;
  --mos-gold-fill-hover: #3b54d4;
  
  --mos-gold-text: #9aaaff;
  
  --mos-gold-text-on-band: #9aaaff;

  
  --mos-rule-hairline: #262b36;
  --mos-rule-strong: #6b7280;
  --mos-band-rule: #6b7280;

  --mos-tick: #4ade80;        

  
  --mos-status-live: #4ade80;
  --mos-status-wait: #f59e0b;
  --mos-status-work: #9aaaff;      
  --mos-status-complete: #94a3b8;
  --mos-status-stop: #f87171;
  --mos-status-idle: #a1a8b5;      
  --mos-text-on-action: #ffffff;   

  
  --mos-status-live-word: var(--mos-status-live);
  --mos-status-wait-word: var(--mos-status-wait);
  --mos-status-work-word: var(--mos-status-work);
  --mos-status-complete-word: var(--mos-status-complete);
  --mos-status-stop-word: var(--mos-status-stop);
  --mos-tile-shadow: inset 0 0 0 1px var(--mos-rule-hairline);
  --mos-halo-figure: none;
  --mos-halo-state: none;
  --mos-halo-title: none;
  --mos-halo-tab: none;
  --mos-inset-shadow: inset 0 0 0 1px var(--mos-rule-hairline);   
  --mos-skeleton-sheen: color-mix(in srgb, var(--mos-ink) 10%, transparent);
  
  --mos-rule-inert: var(--mos-rule-hairline);

  
  --mos-status-green: var(--mos-status-live);
  --mos-status-greenbg: var(--mos-status-live-tint);
  --mos-status-yellow: var(--mos-status-wait);
  --mos-status-yellowbg: var(--mos-status-wait-tint);
  --mos-status-red: var(--mos-status-stop);
  --mos-status-redbg: var(--mos-status-stop-tint);
  --mos-status-blue: var(--mos-status-complete);
  --mos-status-bluebg: var(--mos-status-complete-tint);
  
  --mos-switcher-pill: var(--mos-status-blue);
  --mos-switcher-pill-ink: var(--mos-text-on-status);
  --mos-color-scheme: dark;         

  
  --mos-status-live-tint: #0f2a1a;
  --mos-status-wait-tint: #2a2008;
  --mos-status-work-tint: #1c2347;
  --mos-status-complete-tint: #1c2347;
  --mos-status-stop-tint: #2f1215;

  
  --mos-surface-page: #0b0d12;
  --mos-surface-card: #14171f;
  --mos-surface-sunk: #1b1f29;
  --mos-surface-raised: #14171f;
  --mos-line: #262b36;
  --mos-line-strong: #6b7280;
  --mos-text-strong: #f3f4f6;
  --mos-text-body: #f3f4f6;
  --mos-text-dim: #a1a8b5;
  --mos-text-on-accent: #ffffff;
  --mos-text-on-status: #0b0d12;
  --mos-accent: #9aaaff;
  
  --mos-accent-solid: #4660e0;
  --mos-text-on-solid: #ffffff;
  --mos-focus-ring: #9aaaff;
  --mos-ok: #4ade80;
  --mos-warn: #f59e0b;
  --mos-danger: #f87171;
  --mos-info: #94a3b8;
  --mos-accent-hover: #b8c3ff;
  --mos-accent-deep: #b8c3ff;
  --mos-accent-tint: #1c2347;
  --mos-accent-line: #33408a;
  --mos-text-on-solid-dim: #dbe1fa;
  --mos-gold: #9aaaff;
  --mos-gold-ink: #9aaaff;
  --mos-gold-wash: #1c2347;
  --mos-ok-tint: #0f2a1a;
  --mos-ok-line: #1e4a35;
  --mos-warn-tint: #2a2008;
  --mos-warn-line: #584722;
  --mos-danger-tint: #2f1215;
  --mos-danger-line: #6e2a24;
  --mos-info-tint: #1a202b;
  --mos-info-line: #343a47;

  
  --bg: #0b0d12; --surface: #14171f; --surface-2: #1b1f29; --surface-3: #232835;
  --text: #f3f4f6; --muted: #a1a8b5; --subtle: #8b93a1;
  --border: #262b36; --border-ctl: #343a47; --border-strong: #6b7280;
  --primary: #4660e0; --primary-hover: #3b54d4; --primary-press: #3249bd; --on-primary: #ffffff; --primary-text: #9aaaff; --primary-edge: transparent;
  --sel: #1c2347; --sel-border: #33408a; --focus: #9aaaff;
  --success: #4ade80; --success-bg: #0f2a1a; --error: #f87171; --error-bg: #2f1215;
  --warning: #f59e0b; --on-warning: #0b0d12; --info: #94a3b8; --info-bg: #1a202b;
  --toast-bg: #f3f4f6; --toast-text: #0b0d12; --toast-link: #1f37b5; --scrim: rgba(0, 0, 0, 0.55);
  --sh-xs: 0 1px 2px rgba(0, 0, 0, 0.4); --sh-sm: 0 1px 3px rgba(0, 0, 0, 0.5);
  --sh-lg: 0 16px 40px -12px rgba(0, 0, 0, 0.7); --sh-btn: 0 1px 2px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}
}

:root[data-theme='dark'] {
  
  --mos-sheet: #0b0d12;
  --mos-desk: #14171f;
  --mos-band: #1b1f29;
  --mos-band-field: #232835;
  --mos-card-field: #1b1f29;
  --mos-ink: #f3f4f6;
  --mos-ink-run: #f3f4f6;
  --mos-ink-quiet: #a1a8b5;
  --mos-gold-rule: #9aaaff;
  
  --mos-gold-fill: #4660e0;
  --mos-gold-fill-ink: #ffffff;
  --mos-gold-fill-line: #4660e0;
  --mos-gold-fill-hover: #3b54d4;
  --mos-gold-text: #9aaaff;
  --mos-gold-text-on-band: #9aaaff;
  --mos-rule-hairline: #262b36;
  --mos-rule-strong: #6b7280;
  --mos-band-rule: #6b7280;
  --mos-tick: #4ade80;
  --mos-status-live: #4ade80;
  --mos-status-wait: #f59e0b;
  --mos-status-work: #9aaaff;
  --mos-status-complete: #94a3b8;
  --mos-status-stop: #f87171;
  --mos-status-idle: #a1a8b5;
  --mos-status-live-tint: #0f2a1a;
  --mos-status-wait-tint: #2a2008;
  --mos-status-work-tint: #1c2347;
  --mos-status-complete-tint: #1c2347;
  --mos-status-stop-tint: #2f1215;
  --mos-text-on-action: #ffffff;
  --mos-status-live-word: var(--mos-status-live);
  --mos-status-wait-word: var(--mos-status-wait);
  --mos-status-work-word: var(--mos-status-work);
  --mos-status-complete-word: var(--mos-status-complete);
  --mos-status-stop-word: var(--mos-status-stop);
  --mos-tile-shadow: inset 0 0 0 1px var(--mos-rule-hairline);
  --mos-halo-figure: none;
  --mos-halo-state: none;
  --mos-halo-title: none;
  --mos-halo-tab: none;
  --mos-inset-shadow: inset 0 0 0 1px var(--mos-rule-hairline);   
  --mos-skeleton-sheen: color-mix(in srgb, var(--mos-ink) 10%, transparent);
  --mos-rule-inert: var(--mos-rule-hairline);
  --mos-status-green: var(--mos-status-live);
  --mos-status-greenbg: var(--mos-status-live-tint);
  --mos-status-yellow: var(--mos-status-wait);
  --mos-status-yellowbg: var(--mos-status-wait-tint);
  --mos-status-red: var(--mos-status-stop);
  --mos-status-redbg: var(--mos-status-stop-tint);
  --mos-status-blue: var(--mos-status-complete);
  --mos-status-bluebg: var(--mos-status-complete-tint);
  
  --mos-switcher-pill: var(--mos-status-blue);
  --mos-switcher-pill-ink: var(--mos-text-on-status);
  --mos-color-scheme: dark;
  --mos-surface-page: #0b0d12;
  --mos-surface-card: #14171f;
  --mos-surface-sunk: #1b1f29;
  --mos-surface-raised: #14171f;
  --mos-line: #262b36;
  --mos-line-strong: #6b7280;
  --mos-text-strong: #f3f4f6;
  --mos-text-body: #f3f4f6;
  --mos-text-dim: #a1a8b5;
  --mos-text-on-accent: #ffffff;
  --mos-text-on-status: #0b0d12;
  --mos-accent: #9aaaff;
  --mos-accent-solid: #4660e0;
  --mos-text-on-solid: #ffffff;
  --mos-focus-ring: #9aaaff;
  --mos-ok: #4ade80;
  --mos-warn: #f59e0b;
  --mos-danger: #f87171;
  --mos-info: #94a3b8;
  --mos-accent-hover: #b8c3ff;
  --mos-accent-deep: #b8c3ff;
  --mos-accent-tint: #1c2347;
  --mos-accent-line: #33408a;
  --mos-text-on-solid-dim: #dbe1fa;
  --mos-gold: #9aaaff;
  --mos-gold-ink: #9aaaff;
  --mos-gold-wash: #1c2347;
  --mos-ok-tint: #0f2a1a;
  --mos-ok-line: #1e4a35;
  --mos-warn-tint: #2a2008;
  --mos-warn-line: #584722;
  --mos-danger-tint: #2f1215;
  --mos-danger-line: #6e2a24;
  --mos-info-tint: #1a202b;
  --mos-info-line: #343a47;

  
  --bg: #0b0d12; --surface: #14171f; --surface-2: #1b1f29; --surface-3: #232835;
  --text: #f3f4f6; --muted: #a1a8b5; --subtle: #8b93a1;
  --border: #262b36; --border-ctl: #343a47; --border-strong: #6b7280;
  --primary: #4660e0; --primary-hover: #3b54d4; --primary-press: #3249bd; --on-primary: #ffffff; --primary-text: #9aaaff; --primary-edge: transparent;
  --sel: #1c2347; --sel-border: #33408a; --focus: #9aaaff;
  --success: #4ade80; --success-bg: #0f2a1a; --error: #f87171; --error-bg: #2f1215;
  --warning: #f59e0b; --on-warning: #0b0d12; --info: #94a3b8; --info-bg: #1a202b;
  --toast-bg: #f3f4f6; --toast-text: #0b0d12; --toast-link: #1f37b5; --scrim: rgba(0, 0, 0, 0.55);
  --sh-xs: 0 1px 2px rgba(0, 0, 0, 0.4); --sh-sm: 0 1px 3px rgba(0, 0, 0, 0.5);
  --sh-lg: 0 16px 40px -12px rgba(0, 0, 0, 0.7); --sh-btn: 0 1px 2px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

:root[data-theme='light'] {
  
  --mos-surface-page: #ffffff;
  --mos-surface-card: #ffffff;
  --mos-surface-sunk: #f6f7f9;
  --mos-surface-raised: #ffffff;
  --mos-line: #e4e7ec;
  --mos-line-strong: #878f9c;
  --mos-text-strong: #0b0d12;
  --mos-text-body: #0b0d12;
  --mos-text-dim: #4b5563;
  --mos-text-on-accent: #ffffff;
  --mos-text-on-status: #ffffff;
  --mos-accent: #1f37b5;
  --mos-accent-solid: #1f37b5;
  --mos-text-on-solid: #ffffff;
  --mos-focus-ring: #1f37b5;
  
  --mos-ok: #1F4B3A;
  --mos-warn: #7c3306;
  --mos-danger: #b91c1c;
  --mos-info: #475569;
}


@media (min-width: 820px) {
  :root {
    --mos-type-screen-title-size: 22px;   --mos-type-screen-title-lh: 28px;
    --mos-type-section-head-size: 15px;   --mos-type-section-head-lh: 20px;
    --mos-type-wordmark-size: 14px;       --mos-type-wordmark-lh: 18px;
    --mos-type-wordmark-ls: 0em;
    --mos-type-body-size: 14px;           --mos-type-body-lh: 20px;
    --mos-type-lead-size: 13px;           --mos-type-lead-lh: 18px;
    --mos-type-money-size: 14px;          --mos-type-money-lh: 20px;
    --mos-type-subfigure-size: 12px;      --mos-type-subfigure-lh: 17px;
    --mos-type-label-size: 11px;          --mos-type-label-lh: 16px;
    --mos-type-label-ls: 0.06em;
    --mos-type-memo-size: 12px;           --mos-type-memo-lh: 17px;
    --mos-type-total-size: 30px;          --mos-type-total-lh: 36px;
    --mos-type-stamp-size: 11px;          --mos-type-stamp-lh: 16px;
    --mos-type-stamp-ls: 0.06em;
  }
}
