@font-face { font-family: 'Inter Tight'; src: url(./fonts/inter-tight.woff2) format('woff2'); font-weight: 100 900; font-display: block; }
@font-face { font-family: 'Geist Mono'; src: url(./fonts/geist-mono-latin.woff2) format('woff2'); font-weight: 100 900; font-display: block; }
@font-face { font-family: 'Geist Mono'; src: url(./fonts/geist-mono-latin-ext.woff2) format('woff2'); font-weight: 100 900; font-display: swap; unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20CF; }

:root {

  --font-sans: 'Inter Tight', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-data: 'Geist Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --fs-label: 11px;
  --fs-xs: 12px;
  --fs-s: 12.5px;
  --fs-m: 13.5px;
  --fs-base: 15px;
  --fs-l: 17px;
  --fs-value: 22px;
  --fs-h2: 26px;
  --fs-h1: 30px;
  --fs-count: 56px;
  --fs-micro: 10px;
  --fs-nav: 14px;
  --fs-brand: 18px;
  --fs-strip: 20px;
  --fit-value: 22 19 16 14;
  --fit-line: 20 18 16 14.5;
  --fit-strip: 20 17 15 13.5;
  --fit-note: 15 14 13 12;
  --lh-tight: 1.15; --lh-snug: 1.3; --lh-note: 1.4; --lh-body: 1.5; --lh-code: 1.6;
  --fw-regular: 400; --fw-medium: 500; --fw-strong: 600; --fw-heavy: 650;
  --tracking-label: .08em; --tracking-axis: .06em; --tracking-chip: .04em; --tracking-tight: -.01em; --tracking-value: -.015em; --tracking-head: -.02em; --tracking-count: -.03em;

  --s0: 2px; --s1: 4px; --s1h: 6px; --s2: 8px; --s2h: 10px; --s3: 12px; --s3h: 14px; --s4: 16px; --s5: 24px; --s6: 32px; --s7: 48px; --s8: 64px; --s9: 96px;
  --gutter: 48px; --maxw: 1536px;
  --sec-pad: var(--s9);
  --head-gap: var(--s6);
  --nav-h: 56px;
  --ctl-h: 36px; --ctl-h-s: 32px; --ctl-h-l: 40px;

  --r-floor: 4px; --r-ctl: 8px; --r-pop: 12px; --r-card: 20px; --r-dot: 50%;
  --r-in: var(--r-ctl);
  --r-mark: 2px;

  --bw: 1px; --bw-strong: 1.5px; --bw-focus: 2px; --ring: 3px; --ul-offset: 3px;

  --ico: 16px; --ico-s: 14px; --ico-xs: 13px; --ico-l: 17px; --fav: 16px; --flag-w: 18px; --flag-h: 13.5px; --brand-mark: 22px;
  --w-h1: 1120px; --w-copy: 640px; --w-strip-form: 440px; --w-strip-stream: 460px; --w-search: 280px; --w-search-s: 220px; --w-panel: 320px; --w-results: 380px; --w-menu: 320px; --h-menu: 380px;
  --h-pi: 40px; --h-hit: 44px; --h-mi: 36px; --dot-live: 8px; --dot-key: 6px; --radio: 16px; --radio-dot: 8px;
  --count-note-h: 42px; --ed-line-h: 28px; --ed-msg-h: 18px; --w-bar: 140px; --h-bar: 4px; --w-progress: 27ch;

  --stage-h: 542px; --stage-h-phone: 820px; --h-days: 24px; --h-chip: 22px; --h-pins: 28px; --pin: 22px; --pin-fav: 14px;
  --uc-pitch: 4px; --uc-pitch-s: 7px; --uc-pitch-l: 10px; --w-pr-cell: 10.5rem;
  --pitch: 4; --pitch-narrow: 3; --pitch-phone: 2; --dot-ratio: .77; --half: 200; --half-narrow: 120; --half-cap: 230; --half-cap-narrow: 170; --axis-h: 28; --card-gap: 64; --pin-gap: 30;

  --w-card: 480px; --w-tab: 330px; --card-tabs: 34px; --card-tab: 28px; --card-bar: 38px; --card-url: 28px; --card-view: 146px; --card-region: 104px; --card-foot: 52px; --card-ic: 34px; --skel-h: 18px; --skel-bar: 6px; --caret-h: 14px;

  --b-name-min: 200px; --b-name: 280px; --b-tot: 60px; --b-row: 60px; --b-row-min: 48px; --b-head: 76px; --b-foot: 56px; --b-cell-pad: 6px; --b-cell-head: 26px;
  --ring-from: 5; --ring-to: 28; --fall: 26; --link-w: 1.25;

  --band-bg: var(--k-1); --band-tile: var(--k-2); --band-off: var(--k-3); --band-rule: var(--k-3); --band-rule2: var(--k-4); --band-hair: var(--k-4);
  --band-ink: var(--k-8); --band-ink2: var(--k-7); --band-ink3: var(--k-6);
  --band-hot: var(--a-d); --band-hot-ink: var(--a-d-ink); --band-hot-soft: var(--a-d-soft);
  --band-light: var(--last);
  --b-text-h: 64px;
  --b-line-h: 16px; --b-val-lh: 14px;
  --fit-dom: 12.5 11.5 10.5 9.5;
  --fit-cell: 12 11 10 9.5;
  --b-pitches: 4 3.5 3 2.5;
  --b-strip-cap: 16; --b-dot-ratio: .76;
  --b-ring-to: 14;
  --b-dim: .32;
  --b-row-s: 68px; --b-row-min-s: 56px; --b-tot-s: 44px;
  --mc-h: 112px; --mc-h-narrow: 250px; --mc-site: 340px; --mc-seen: 340px;

  --t-no: 44px; --t-title: 280px; --t-tot: 120px; --t-go: 28px; --t-row: 72px; --t-wave: 48px; --t-badge: 32px;
  --w-stream: 420px; --h-tabs: 34px; --h-seg: 28px; --code-head: 40px; --code-h: 420px; --fd-code-h: 272px; --w-visits: 600px; --visits-h: 120px;

  --trk-lab: 196; --trk-axis: 24; --trk-lx-phone: 13;
  --trk-unit: 6; --trk-gap: 1.5; --trk-up-min: 28;
  --trk-clip: 14; --trk-clip-gap: 3; --trk-lane-pad: 8; --trk-lane-min: 30;
  --ring-sel: 7;
  --dur-step: 1800ms;
  --fit-value-long: 22 19 16 14 13 12 11;
  --fav-h1: 24px; --w-aside: 400px; --w-ang: 360px; --w-mini: 220px; --h-mini: 28px; --h-row: 52px; --h-rel: 48px;
  --pane-h: 318px; --pane-region: 132px; --proof-value: var(--fs-value);
  --h-liverow: 36px;
  --h-crumbs: 20px;

  --mt-lab: 248px;
  --mt-lead: 380px;
  --mt-axis: 28px; --mt-master: 132px; --mt-row: 54px; --mt-pad: 7px;
  --ruler-h: 40px;
  --w-nb: 220px;
  --w-ecard: 480px; --ec-wave: 72px;
  --co-last: 300px;

  --w-find: 720px;
  --w-letter: 48px; --h-letter: 44px;
  --ar-lane: 60px;
  --w-fx: 150px;
  --dm-rk: 32px; --dm-name: 320px; --dm-c: 76px; --dm-tot: 84px; --dm-h: 56px; --dm-wave: 28px;
  --w-fd-side: 440px; --h-fd-list: 560px;

  --w-task-side: 440px;
  --w-mail: 680px;
  --mail-body-h: 448px;
  --mail-frame-h: 259px;
  --w-task-side-wide: 560px; --w-mail-wide: 820px;
  --picks-h: 162px;
  --mh-k: 64px;
  --w-sb-act: 220px;

  --h-tp: 50px; --w-tp-t: 44px;
  --h-sc-code: 440px;
  --w-sc-co: 180px;
  --w-vw-name: 200px; --w-vw-go: 170px;

  --w-toc: 220px;
  --w-prose: 680px;
  --w-vs-f: 200px;
  --w-talk: 440px;

  --type-display: 30px;
  --type-title: 22px;
  --type-body: 15px;
  --type-small: 13px;
  --d-count: 56px;
  --d-l: 22px;
  --d-m: 15px;
  --d: 12px;
  --d-s: 11px;

  --g-0: #ffffff; --g-1: #f3f4f6; --g-2: #e9ebef; --g-3: #e1e4e8; --g-4: #ced2d8; --g-5: #a3a9b3; --g-6: #7c828d; --g-7: #464c57; --g-9: #0f1115;
  --k-0: #0b0c0f; --k-1: #14161a; --k-2: #1c1f24; --k-3: #23262c; --k-4: #2f333a; --k-5: #6b717c; --k-6: #7f8590; --k-7: #b4b9c2; --k-8: #eef0f3;
  --a-l: #ff4b1f; --a-l-ink: #d93a12; --a-l-soft: rgba(255, 75, 31, .12);
  --a-d: #ff6a3d; --a-d-ink: #ff8a65; --a-d-soft: rgba(255, 106, 61, .16);
  --last: #bd8b5e; --code-str: #b5e08a;

  --bg: var(--g-1);
  --surface: var(--g-0);
  --chrome: var(--g-2);
  --fade: var(--g-2);
  --ink: var(--g-9);
  --ink2: var(--g-7);
  --ink3: var(--g-6);
  --rule: var(--g-3);
  --rule2: var(--g-4);
  --wave: var(--ink);
  --ghost: var(--g-4);
  --accent: var(--a-l);
  --accent-ink: var(--a-l-ink);
  --accent-soft: var(--a-l-soft);
  --on-accent: var(--g-0);
  --code-bg: var(--k-0); --code-ink: var(--k-8); --code-dim: var(--k-6); --code-key: var(--a-d-ink); --code-rule: var(--k-3);

  --shadow-ink: rgb(16 18 24 / .06); --shadow-ink-deep: rgb(16 18 24 / .10);
  --shadow-1: 0 1px 2px var(--shadow-ink);
  --shadow-2: 0 1px 2px var(--shadow-ink), 0 6px 16px var(--shadow-ink-deep);
  --shadow-3: 0 2px 4px var(--shadow-ink), 0 16px 40px var(--shadow-ink-deep);

  --dur-1: 120ms;
  --dur-2: 200ms;
  --dur-3: 320ms;
  --dur-4: 520ms;
  --dur-pop: 280ms;
  --dur-type: 420ms;
  --dur-land: 420ms;
  --dur-ring: 900ms;
  --dur-sweep: 850ms;
  --delay-sweep: 150ms;
  --dwell: 5000ms;
  --warm: 30;
  --ease-std: cubic-bezier(.4, 0, .2, 1);
  --ease-out: cubic-bezier(.2, .7, .3, 1);
  --ease-pop: cubic-bezier(.2, .9, .3, 1.3);
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: var(--k-0); --surface: var(--k-1); --chrome: var(--k-2); --fade: var(--k-2); --ink: var(--k-8); --ink2: var(--k-7); --ink3: var(--k-6); --rule: var(--k-3); --rule2: var(--k-4);
    --wave: var(--ink); --ghost: var(--k-4);
    --accent: var(--a-d); --accent-ink: var(--a-d-ink); --accent-soft: var(--a-d-soft); --on-accent: var(--k-0);
    --band-bg: var(--k-1);
    --shadow-ink: rgb(0 0 0 / .32); --shadow-ink-deep: rgb(0 0 0 / .44);
    color-scheme: dark;
  }
}

:root[data-theme="dark"], .theme-dark {
  --bg: var(--k-0); --surface: var(--k-1); --chrome: var(--k-2); --fade: var(--k-2); --ink: var(--k-8); --ink2: var(--k-7); --ink3: var(--k-6); --rule: var(--k-3); --rule2: var(--k-4);
  --wave: var(--ink); --ghost: var(--k-4);
  --accent: var(--a-d); --accent-ink: var(--a-d-ink); --accent-soft: var(--a-d-soft); --on-accent: var(--k-0);
  --band-bg: var(--k-1);
  --shadow-ink: rgb(0 0 0 / .32); --shadow-ink-deep: rgb(0 0 0 / .44);
  color-scheme: dark;
}

.theme-light {
  --bg: var(--g-1); --surface: var(--g-0); --chrome: var(--g-2); --fade: var(--g-2); --ink: var(--g-9); --ink2: var(--g-7); --ink3: var(--g-6); --rule: var(--g-3); --rule2: var(--g-4);
  --wave: var(--g-9); --ghost: var(--g-4);
  --accent: var(--a-l); --accent-ink: var(--a-l-ink); --accent-soft: var(--a-l-soft); --on-accent: var(--g-0);
  --shadow-ink: rgb(16 18 24 / .06); --shadow-ink-deep: rgb(16 18 24 / .10);
  color-scheme: light;
}

@media (max-width: 1100px) { :root { --gutter: 24px; --sec-pad: var(--s8); } }
@media (max-width: 720px) { :root { --gutter: 16px; --fs-h1: 24px; --fs-h2: 22px; --fs-count: 44px; --type-display: 24px; --type-title: 20px; --d-count: 44px; --sec-pad: var(--s7); --head-gap: var(--s5); } }
@media (prefers-reduced-motion: reduce) {
  :root { --dur-1: 0ms; --dur-2: 0ms; --dur-3: 0ms; --dur-4: 0ms; --dur-pop: 0ms; --dur-type: 0ms; --dur-land: 0ms; --dur-ring: 0ms; --dur-sweep: 0ms; --delay-sweep: 0ms; }
}

:root { --mask-solid: #000; }
:root { --wire-bg: var(--surface); --wire-ink: var(--ink); --wire-mute: var(--ink2); --wire-line: var(--rule2); --wire-box: var(--bg); --wire-box2: var(--chrome); }

:root {
  --stage-a: 500px;
  --stage-a-phone: 400px;
  --gut-w: 132px;
  --gut-w-narrow: 104px;
  --axis-a: 22px;
  --key-h: 30px;
  --w-readout: 340px;
  --w-panel: 540px;
  --tile-h: 300px;
  --tile-chart: 64px; --tile-chart-lead: 120px;
  --pl-h: 332px;
  --pl-wave: 196px; --w-caps: 360px;
  --mark: 18px;
  --dt-h: 232px; --dt-rail: 132px; --dt-note: 164px; --dt-win-h: 40px; --dt-post: 12px;
  --w-dt-lab: 260px; --w-dt-lab-phone: 150px;
  --dur-gap: 600ms; --dur-win: 520ms;
}
@media (max-width: 1100px) { :root { --gut-w: var(--gut-w-narrow); --w-caps: 300px; } }
:root {
  --stage-a: 520px;
  --lane-h: 30px;
  --lane-h-phone: 28px;
  --hrs-h: 20px;
  --mark: 18px;
}
@media (max-width: 720px) { :root { --pl-h: 600px; } }

:root, .theme-dark, .theme-light {
  --map-land: light-dark(var(--g-4), var(--k-4));
  --map-mark: light-dark(var(--g-6), var(--k-6));
  --map-on: light-dark(var(--g-6), var(--k-6));
  --map-dot: var(--wave);
  --map-dot-off: light-dark(var(--g-5), var(--k-5));
  --map-new: var(--accent);
  --map-land-scale: 1.8;
}

@font-face { font-family: 'Schibsted Grotesk'; src: url(./fonts/schibsted-grotesk.woff2) format('woff2'); font-weight: 400 900; font-display: swap; }

:root, .theme-dark, .theme-light {

  --c-page: light-dark(#f3f4f6, #0d0f12);
  --c-raised: light-dark(#ffffff, #15181c);
  --c-sunk: light-dark(#e9ebee, #1a1e23);
  --c-line: light-dark(#dfe2e6, #252a30);
  --c-line-2: light-dark(#cdd2d8, #343a42);
  --c-text: light-dark(#0e1116, #eef0f3);
  --c-text-2: light-dark(#555d68, #a3abb6);
  --c-text-3: light-dark(#677079, #8a929d);
  --c-accent: light-dark(#e5482d, #ff6a45);
  --c-accent-text: light-dark(#c4361b, #ff8a65);
  --c-on-accent: light-dark(#ffffff, #0d0f12);
  --c-focus: var(--c-accent-text);

  --c-link: light-dark(#c4361b, #d0664e);

  --viz-this: var(--c-text);
  --viz-usual: light-dark(#9aa3ae, #6b7480);
  --viz-now: var(--c-accent);
  --viz-pick: var(--c-text);
  --viz-rest: light-dark(#c9ced5, #3a4049);
  --viz-future: light-dark(#eceef1, #121519);
  --viz-grid: var(--c-line);
  --viz-axis: var(--c-line-2);

  --viz-k1: light-dark(#2a78d6, #3987e5);
  --viz-k2: light-dark(#653161, #7d5986);
  --viz-k3: light-dark(#6250d6, #9085e9);
  --viz-k4: light-dark(#e87ba4, #d55181);
  --viz-k5: light-dark(#124a7b, #93d5f5);
  --viz-k6: light-dark(#9975b3, #b586b0);
  --viz-k7: light-dark(#a9b0b9, #596170);
  --viz-k8: light-dark(#0e9ab8, #1aa3c2);

  --viz-s1: light-dark(#e7effb, #1b2737); --viz-s2: light-dark(#c2daf9, #1f3959); --viz-s3: light-dark(#99c1f4, #264e80);
  --viz-s4: light-dark(#6fa4e8, #3167a9); --viz-s5: light-dark(#4c88d3, #4985cf); --viz-s6: light-dark(#2e69b2, #74a7e8);
  --viz-s7: light-dark(#194d8a, #aacdfb);

  --st-pos: light-dark(#14743a, #5cc98a); --st-pos-mark: light-dark(#1d8b3d, #59be6c); --st-pos-bg: light-dark(#eaf6ee, #11261a); --st-pos-line: light-dark(#9fd6b2, #245c3a);
  --st-neg: light-dark(#c22a34, #ff7d84); --st-neg-mark: light-dark(#c22a34, #ff7d84); --st-neg-bg: light-dark(#fcecec, #2d1518); --st-neg-line: light-dark(#f0b0b4, #6e2c31);
  --st-warn: light-dark(#8a5300, #f2b84f); --st-warn-mark: light-dark(#b37903, #ebaa2d); --st-warn-bg: light-dark(#fdf3e1, #2a2011); --st-warn-line: light-dark(#eccb8a, #6b4f1d);
  --st-info: light-dark(#1d5fc2, #78a9ff); --st-info-mark: light-dark(#1d5fc2, #78a9ff); --st-info-bg: light-dark(#eaf1fc, #121e34); --st-info-line: light-dark(#a9c6f0, #2a4a80);
  --st-neutral: var(--c-text-2); --st-neutral-mark: var(--c-text-3); --st-neutral-bg: var(--c-sunk); --st-neutral-line: var(--c-line-2);
}

:root {

  --font-schibsted: 'Schibsted Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-ui: var(--font-sans);
  --font-code: var(--font-data);

  --t-display: 500 40px/44px var(--font-ui);       --t-display-tr: -.024em;
  --t-page: 550 32px/38px var(--font-ui);          --t-page-tr: -.02em;
  --t-section: 550 24px/30px var(--font-ui);       --t-section-tr: -.016em;
  --t-card: 600 16px/22px var(--font-ui);          --t-card-tr: -.006em;
  --t-lead: 400 18px/28px var(--font-ui);          --t-lead-tr: -.006em;
  --t-body: 400 15px/24px var(--font-ui);          --t-body-tr: 0;
  --t-row: 550 15px/20px var(--font-ui);           --t-row-tr: 0;
  --t-row-2: 400 13px/18px var(--font-ui);         --t-row-2-tr: .002em;
  --t-label: 500 13px/16px var(--font-ui);         --t-label-tr: .004em;
  --t-num: 500 15px/20px var(--font-ui);           --t-num-tr: 0;
  --t-num-l: 500 24px/30px var(--font-ui);         --t-num-l-tr: -.016em;
  --t-num-xl: 500 40px/44px var(--font-ui);        --t-num-xl-tr: -.024em;
  --t-mono: 400 13px/18px var(--font-code);        --t-mono-tr: 0;
  --t-mono-s: 400 11px/14px var(--font-code);      --t-mono-s-tr: .02em;

  --sp-section: 48px;
  --sp-head: 20px;
  --sp-gap: 24px;
  --sp-row-y: 12px; --sp-row-x: 16px;
  --lh-row: 20px;
  --sp-margin: 48px;
  --w-page: 1280px;
  --w-read: 700px;
  --grid-cols: 12;

  --r-outer: 12px; --nest-gap: 4px; --r-inner: calc(var(--r-outer) - var(--nest-gap)); --r-tight: 4px;
  --nest-x: calc(var(--sp-row-x) + var(--bw));

  --ico-stroke: 1.75; --ico-m: 16px; --ico-sm: 14px; --tile: 40px; --glyph: 20px;

  --mo-hover: var(--dur-1); --mo-open: var(--dur-2); --mo-write: var(--dur-4); --mo-land: var(--dur-land);
}
@media (max-width: 760px) {
  :root {
    --t-display: 500 30px/34px var(--font-ui); --t-page: 550 26px/30px var(--font-ui); --t-section: 550 20px/26px var(--font-ui);
    --t-num-xl: 500 30px/34px var(--font-ui); --t-num-l: 500 20px/26px var(--font-ui); --t-lead: 400 16px/24px var(--font-ui);
    --sp-section: 32px; --sp-margin: 16px; --sp-row-x: 12px;
  }
}
