/* Design tokens. Generated by dotnet/tools/extract-css.py - do not hand-edit.
 * Both themes; the OS default is pure CSS via prefers-color-scheme.
 * Emitted in cascade phases: @font-face, light/base, [data-theme="dark"], media - an
 * appended light :root block after the dark block once beat it on order (module 4.3). */

@font-face {
  font-family: "IBM Plex Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/ibm-plex-sans-400.woff2") format("woff2");
}

@font-face {
  font-family: "IBM Plex Sans"; font-style: normal; font-weight: 500; font-display: swap; src: url("/fonts/ibm-plex-sans-500.woff2") format("woff2");
}

@font-face {
  font-family: "IBM Plex Sans"; font-style: normal; font-weight: 600; font-display: swap; src: url("/fonts/ibm-plex-sans-600.woff2") format("woff2");
}

@font-face {
  font-family: "IBM Plex Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url("/fonts/ibm-plex-sans-700.woff2") format("woff2");
}

@font-face {
  font-family: "IBM Plex Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/ibm-plex-mono-400.woff2") format("woff2");
}

@font-face {
  font-family: "IBM Plex Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("/fonts/ibm-plex-mono-500.woff2") format("woff2");
}

@font-face {
  font-family: "IBM Plex Mono"; font-style: normal; font-weight: 600; font-display: swap; src: url("/fonts/ibm-plex-mono-600.woff2") format("woff2");
}

:root, .accent-scope {
  --accent-base: #0ca678;              

  --accent-0: color-mix(in srgb, var(--accent-base)  8%, #ffffff);
  --accent-1: color-mix(in srgb, var(--accent-base) 16%, #ffffff);
  --accent-2: color-mix(in srgb, var(--accent-base) 30%, #ffffff);
  --accent-3: color-mix(in srgb, var(--accent-base) 50%, #ffffff);
  --accent-4: color-mix(in srgb, var(--accent-base) 72%, #ffffff);
  --accent-5: color-mix(in srgb, var(--accent-base) 88%, #ffffff);
  --accent-6: var(--accent-base);
  --accent-7: color-mix(in srgb, var(--accent-base) 88%, #000000);
  --accent-8: color-mix(in srgb, var(--accent-base) 74%, #000000);
  --accent-9: color-mix(in srgb, var(--accent-base) 60%, #000000);

  
  --accent-wash:   var(--accent-0);
  --accent-tint:   var(--accent-1);
  --accent-border: var(--accent-2);
  --accent-hairline: var(--accent-3);
  --accent-fill:   var(--accent-6);
  --accent-hover:  var(--accent-7);
  --accent-active: var(--accent-8);
  
  --accent-action:        var(--accent-8);
  --accent-action-hover:  var(--accent-9);
  --accent-action-active: var(--accent-9);
  --accent-on-fill: #ffffff;
  
  --accent-text:   var(--accent-8);
  
  --accent-text-on-tint: var(--accent-9);
}

:root {
  --font-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  --fs-micro: 10px;   --lh-micro: 1;    --tr-micro: .05em;
  --fs-xs:    11px;   --lh-xs:    1;    --tr-xs:    .04em;
  --fs-sm:    12px;   --lh-sm:    1.5;  --tr-sm:    0;
  --fs-md:    13px;   --lh-md:    1.55; --tr-md:    0;
  --fs-lg:    15px;   --lh-lg:    1.4;  --tr-lg:    -.008em;
  --fs-xl:    20px;   --lh-xl:    1.2;  --tr-xl:    -.012em;
  --fs-2xl:   24px;   --lh-2xl:   1.15; --tr-2xl:   -.018em;

  --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700;
  --lh-flat: 1;
}

:root {
  --sp-1: 4px; --sp-2: 6px; --sp-3: 8px; --sp-4: 12px; --sp-5: 16px; --sp-6: 24px;

  --pad-card: var(--sp-5);
  --pad-card-tight: 12px 16px;
  --pad-row: 12px 16px;
  --pad-screen: 20px 24px 40px;

  --r-xs: 3px;  
  --r-sm: 5px;  
  --r-md: 6px;  
  --r-lg: 8px;  
  --r-xl: 12px; 
  --r-full: 999px;

  
  --shell-h: 100dvh;
  --shell-preview-h: 820px;
  --h-header: 52px;
  --w-rail: 56px;
  --w-pane: 204px;
  --w-content-max: 1280px;
  --w-min-supported: 1024px;

  --drawer-md: 480px; --drawer-lg: 640px; --drawer-xl: 820px;
  --modal-sm: 460px; --modal-md: 520px; --modal-lg: 620px; --modal-xl: 640px;

  --dur-fast: 120ms; --dur-base: 180ms;
  --pad-panel: 36px 24px; --measure-lede: 88ch;
  --col-status: 114px; --col-actions: 132px; --col-channel: 118px; --col-cap: 72px;
  --col-count: 96px; --col-flag: 104px; --col-mini: 64px; --col-when: 132px;
  --ease: cubic-bezier(.2, 0, .2, 1);
}

:root, [data-theme="light"] {
  --canvas:          #F6F8FA;
  --surface:         #FFFFFF;
  --surface-sunken:  #F8FAFC;
  --surface-raised:  #FFFFFF;
  --surface-inverse: #0A2540;

  --hairline:        #E3E8EE;
  --hairline-soft:   #EDF0F4;
  --hairline-strong: #CBD3DE;

  --ink:        #0A2540;
  --ink-body:   #425466;
  --ink-quiet:  #646E81;   
  --ink-faint:  #8792A2;   
  --ink-on-inverse: #C8D3E2;

  --disabled-fill:   #F1F4F8;
  --disabled-ink:    #98A2B3;
  --disabled-border: #E3E8EE;

  --focus:      #0A2540;   
  --focus-halo: #FFFFFF;

  --success-ink: #1B6B41; --success-bg: #E3F2EA; --success-border: #BFE3CF; --success-solid: #2BA36F;
  --warning-ink: #8A5510; --warning-bg: #FCF0E1; --warning-border: #F0DFB8; --warning-solid: #D9A227;
  --danger-ink:  #B02631; --danger-bg:  #FDECEE; --danger-border:  #F6C9CE; --danger-solid:  #C6303B;
  --info-ink:    #1B58B8; --info-bg:    #EAF1FD; --info-border:    #CFE0FB; --info-solid:    #1D62C9;
  --neutral-ink: #425466; --neutral-bg: #EFF2F6; --neutral-border: #E3E8EE; --neutral-solid: #8792A2;

  --chart-1: var(--accent-6);
  --chart-2: #0E8CA8;
  --chart-3: #64748B;
  --chart-grid: #EDF0F4;
  --chart-area-opacity: .13;

  --shadow-card:    0 1px 2px rgba(10,37,64,.05);
  --shadow-raised:  0 4px 14px rgba(10,37,64,.12);
  --shadow-overlay: 0 8px 24px rgba(10,37,64,.24);
  --shadow-modal:   0 24px 60px rgba(10,37,64,.28);
  --scrim: rgba(10,37,64,.38);
}

:root,[data-theme="light"] {
  --canvas:#F6F8FA;--surface:#FFF;--surface-sunken:#F8FAFC;--surface-raised:#FFF;--surface-inverse:#0A2540;
  --hairline:#E3E8EE;--hairline-soft:#EDF0F4;--hairline-strong:#CBD3DE;
  --ink:#0A2540;--ink-body:#425466;--ink-quiet:#646E81;--ink-faint:#8792A2;--ink-on-inverse:#C8D3E2;
  --disabled-fill:#F1F4F8;--disabled-ink:#98A2B3;--disabled-border:#E3E8EE;
  --focus:#0A2540;--focus-halo:#FFF;
  --success-ink:#1B6B41;--success-bg:#E3F2EA;--success-border:#BFE3CF;--success-solid:#2BA36F;
  --warning-ink:#8A5510;--warning-bg:#FCF0E1;--warning-border:#F0DFB8;--warning-solid:#D9A227;
  --danger-ink:#B02631;--danger-bg:#FDECEE;--danger-border:#F6C9CE;--danger-solid:#C6303B;
  --info-ink:#1B58B8;--info-bg:#EAF1FD;--info-border:#CFE0FB;--info-solid:#1D62C9;
  --neutral-ink:#425466;--neutral-bg:#EFF2F6;--neutral-border:#E3E8EE;--neutral-solid:#8792A2;
  --chart-1:var(--accent-6);--chart-2:#0E8CA8;--chart-3:#64748B;--chart-grid:#EDF0F4;--chart-area-opacity:.13;
  --shadow-card:0 1px 2px rgba(10,37,64,.05);--shadow-raised:0 4px 14px rgba(10,37,64,.12);
  --shadow-overlay:0 8px 24px rgba(10,37,64,.24);--shadow-modal:0 24px 60px rgba(10,37,64,.28);
  --scrim:rgba(10,37,64,.38);
}

[data-theme="dark"] .accent-scope {
  --accent-wash:   color-mix(in srgb, var(--accent-base) 18%, #0C1421);
  --accent-tint:   color-mix(in srgb, var(--accent-base) 26%, #0C1421);
  --accent-border: color-mix(in srgb, var(--accent-base) 42%, #0C1421);
  --accent-hairline: color-mix(in srgb, var(--accent-base) 55%, #0C1421);
  --accent-fill:   var(--accent-5);
  --accent-hover:  var(--accent-4);
  --accent-active: var(--accent-3);
  --accent-action:        var(--accent-4);
  --accent-action-hover:  var(--accent-3);
  --accent-action-active: var(--accent-2);
  --accent-on-fill: #08131F;
  --accent-text:   var(--accent-3);
  --accent-text-on-tint: var(--accent-3);
}

[data-theme="dark"] {
  --canvas:          #0C1421;
  --surface:         #141E2E;
  --surface-sunken:  #101A28;
  --surface-raised:  #1B2739;
  --surface-inverse: #050A12;

  --hairline:        #253449;
  --hairline-soft:   #1D2A3B;
  --hairline-strong: #38495F;

  --ink:        #EAF0F7;
  --ink-body:   #B9C6D6;
  --ink-quiet:  #93A3B7;   
  --ink-faint:  #5E7089;   
  --ink-on-inverse: #AFC0D4;

  --disabled-fill:   #1A2536;
  --disabled-ink:    #5E7089;
  --disabled-border: #253449;

  --focus:      #FFFFFF;
  --focus-halo: #0C1421;

  
  --success-ink: #6EDBA4; --success-bg: #10301F; --success-border: #1D4A32; --success-solid: #2BA36F;
  --warning-ink: #F0C078; --warning-bg: #33240D; --warning-border: #4D3915; --warning-solid: #D9A227;
  --danger-ink:  #F58B95; --danger-bg:  #3A1519; --danger-border:  #5A2228; --danger-solid:  #E04B57;
  --info-ink:    #8FB8F5; --info-bg:    #10233F; --info-border:    #1C3760; --info-solid:    #4A8AE8;
  --neutral-ink: #B9C6D6; --neutral-bg: #1D2A3B; --neutral-border: #253449; --neutral-solid: #5E7089;

  
  --accent-wash:   color-mix(in srgb, var(--accent-base) 18%, #0C1421);
  --accent-tint:   color-mix(in srgb, var(--accent-base) 26%, #0C1421);
  --accent-border: color-mix(in srgb, var(--accent-base) 42%, #0C1421);
  --accent-hairline: color-mix(in srgb, var(--accent-base) 55%, #0C1421);
  --accent-fill:   var(--accent-5);
  --accent-hover:  var(--accent-4);
  --accent-active: var(--accent-3);
  --accent-action:        var(--accent-4);
  --accent-action-hover:  var(--accent-3);
  --accent-action-active: var(--accent-2);
  --accent-on-fill: #08131F;
  --accent-text:   var(--accent-3);
  --accent-text-on-tint: var(--accent-3);

  --chart-1: var(--accent-4);
  --chart-2: #35B4CF;
  --chart-3: #64748B;
  --chart-grid: #1D2A3B;
  --chart-area-opacity: .18;

  --shadow-card:    0 1px 2px rgba(0,0,0,.4);
  --shadow-raised:  0 4px 14px rgba(0,0,0,.45);
  --shadow-overlay: 0 8px 24px rgba(0,0,0,.55);
  --shadow-modal:   0 24px 60px rgba(0,0,0,.62);
  --scrim: rgba(3,8,15,.66);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .accent-scope {
    --accent-wash:   color-mix(in srgb, var(--accent-base) 18%, #0C1421);
    --accent-tint:   color-mix(in srgb, var(--accent-base) 26%, #0C1421);
    --accent-border: color-mix(in srgb, var(--accent-base) 42%, #0C1421);
    --accent-hairline: color-mix(in srgb, var(--accent-base) 55%, #0C1421);
    --accent-fill:   var(--accent-5);
    --accent-hover:  var(--accent-4);
    --accent-active: var(--accent-3);
    --accent-action: var(--accent-4);
    --accent-action-hover: var(--accent-3);
    --accent-action-active: var(--accent-2);
    --accent-on-fill: #08131F;
    --accent-text:   var(--accent-3);
    --accent-text-on-tint: var(--accent-3);
  }
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --canvas: #0C1421; --surface: #141E2E; --surface-sunken: #101A28;
    --surface-raised: #1B2739; --surface-inverse: #050A12;
    --hairline: #253449; --hairline-soft: #1D2A3B; --hairline-strong: #38495F;
    --ink: #EAF0F7; --ink-body: #B9C6D6; --ink-quiet: #93A3B7; --ink-faint: #5E7089;
    --ink-on-inverse: #AFC0D4;
    --disabled-fill: #1A2536; --disabled-ink: #5E7089; --disabled-border: #253449;
    --focus: #FFFFFF; --focus-halo: #0C1421;
    --success-ink: #6EDBA4; --success-bg: #10301F; --success-border: #1D4A32;
    --warning-ink: #F0C078; --warning-bg: #33240D; --warning-border: #4D3915;
    --danger-ink: #F58B95; --danger-bg: #3A1519; --danger-border: #5A2228; --danger-solid: #E04B57;
    --info-ink: #8FB8F5; --info-bg: #10233F; --info-border: #1C3760; --info-solid: #4A8AE8;
    --neutral-ink: #B9C6D6; --neutral-bg: #1D2A3B; --neutral-border: #253449;
    --success-solid: #2BA36F; --warning-solid: #D9A227; --neutral-solid: #5E7089;
    --accent-wash: color-mix(in srgb, var(--accent-base) 18%, #0C1421);
    --accent-tint: color-mix(in srgb, var(--accent-base) 26%, #0C1421);
    --accent-border: color-mix(in srgb, var(--accent-base) 42%, #0C1421);
    --accent-hairline: color-mix(in srgb, var(--accent-base) 55%, #0C1421);
    --accent-fill: var(--accent-5); --accent-hover: var(--accent-4); --accent-active: var(--accent-3);
    --accent-action: var(--accent-4); --accent-action-hover: var(--accent-3); --accent-action-active: var(--accent-2);
    --accent-on-fill: #08131F; --accent-text: var(--accent-3); --accent-text-on-tint: var(--accent-3);
    --chart-1: var(--accent-4); --chart-2: #35B4CF; --chart-3: #64748B; --chart-grid: #1D2A3B;
    --chart-area-opacity: .18;
    --shadow-card: 0 1px 2px rgba(0,0,0,.4); --shadow-raised: 0 4px 14px rgba(0,0,0,.45);
    --shadow-overlay: 0 8px 24px rgba(0,0,0,.55); --shadow-modal: 0 24px 60px rgba(0,0,0,.62);
    --scrim: rgba(3,8,15,.66);
  }
}

@media (prefers-color-scheme:dark) {
  :root:not([data-theme="light"]){
  --canvas:#0C1421;--surface:#141E2E;--surface-sunken:#101A28;--surface-raised:#1B2739;--surface-inverse:#050A12;
  --hairline:#253449;--hairline-soft:#1D2A3B;--hairline-strong:#38495F;
  --ink:#EAF0F7;--ink-body:#B9C6D6;--ink-quiet:#93A3B7;--ink-faint:#5E7089;--ink-on-inverse:#AFC0D4;
  --disabled-fill:#1A2536;--disabled-ink:#5E7089;--disabled-border:#253449;--focus:#FFF;--focus-halo:#0C1421;
  --success-ink:#6EDBA4;--success-bg:#10301F;--success-border:#1D4A32;
  --warning-ink:#F0C078;--warning-bg:#33240D;--warning-border:#4D3915;
  --danger-ink:#F58B95;--danger-bg:#3A1519;--danger-border:#5A2228;--danger-solid:#E04B57;
  --info-ink:#8FB8F5;--info-bg:#10233F;--info-border:#1C3760;--info-solid:#4A8AE8;
  --neutral-ink:#B9C6D6;--neutral-bg:#1D2A3B;--neutral-border:#253449;
  --accent-wash:color-mix(in srgb,var(--accent-base) 18%,#0C1421);
  --accent-tint:color-mix(in srgb,var(--accent-base) 26%,#0C1421);
  --accent-border:color-mix(in srgb,var(--accent-base) 42%,#0C1421);
  --accent-fill:var(--accent-5);--accent-hover:var(--accent-4);
  --accent-action:var(--accent-4);--accent-action-hover:var(--accent-3);
  --accent-on-fill:#08131F;--accent-text:var(--accent-3);--accent-text-on-tint:var(--accent-3);
  --shadow-card:0 1px 2px rgba(0,0,0,.4);--shadow-modal:0 24px 60px rgba(0,0,0,.62);--scrim:rgba(3,8,15,.66);
  --success-solid:#2BA36F;--warning-solid:#D9A227;--neutral-solid:#5E7089;--accent-hairline:color-mix(in srgb,var(--accent-base) 55%,#0C1421);--accent-active:var(--accent-3);--accent-action-active:var(--accent-2);--shadow-raised:0 4px 14px rgba(0,0,0,.45);--shadow-overlay:0 8px 24px rgba(0,0,0,.55);--chart-area-opacity:.18;
  --chart-1:var(--accent-4);--chart-2:#35B4CF;--chart-3:#64748B;--chart-grid:#1D2A3B;
}
}
