/* Get Less Chaos: A Place for Everything. Design tokens. GENERATED by build-tokens.js from the same data as
   tokens.json: edit that script, not this file. The page is a foam board: pieces sit on it, pockets are cut into
   it, and the only color is the slot floor. */
:root {
  color-scheme: light dark;
  /* color (light) */
  --board: #EFEEE9;
  --board-2: #E6E4DD;
  --piece: #F8F7F3;
  --piece-edge: rgba(22,24,27,.10);
  --line: rgba(22,24,27,.12);
  --tile: #16181B;
  --paper: #EFEEE9;
  --tray: #121417;
  --tray-top: #1A1D21;
  --tray-bot: #0C0D0F;
  --ink: #16181B;
  --ink-2: #45484C;
  --ink-3: #62655F;
  --foam: #1FA46A;
  --foam-ink: #0C7547;
  --on-foam: #0A1D13;
  --floor-top: #0F7A4E;
  --floor-bot: #1A955F;
  --pocket-edge: #08422A;
  --pocket-edge-op: 1;
  --pocket-ao: #06311D;
  --pocket-ao-op: .52;
  --lip: #FFFFFF;
  --lip-op: .7;
  --rim-dark: #16181B;
  --rim-dark-op: .16;
  --cut-floor: #E6E4DD;
  --cut-edge: #16181B;
  --cut-edge-op: .22;
  --cut-floor-top: #D6D4CC;
  --cut-floor-bot: #E1DFD8;
  --rim: #BFBCB2;
  --shadow: #16181B;
  --slot-shadow: #0B3320;
  --slot-shadow-op: .30;
  --ring: #0C7547;
  --selection: rgba(31,164,106,.26);
  --pocket-edge-a: rgba(8,66,42,.8);
  --pocket-ao-a: rgba(6,49,29,.42);
  --lip-a: rgba(255,255,255,.85);
  --cut-edge-a: rgba(22,24,27,.17);
  --cut-ao-a: rgba(22,24,27,.10);
  --lift-a: rgba(22,24,27,.20);
  --lift-a-2: rgba(22,24,27,.12);
  /* app slots (samples) */
  --slot-green: #2FB67A;
  --slot-green-top: #2AAA70;
  --slot-green-bot: #38C285;
  --slot-marigold: #E3A52C;
  --slot-marigold-top: #D3951F;
  --slot-marigold-bot: #EDB542;
  --slot-cobalt: #4F7FE3;
  --slot-cobalt-top: #4372D6;
  --slot-cobalt-bot: #6390EE;
  --slot-clay: #DC6A43;
  --slot-clay-top: #CC5C37;
  --slot-clay-bot: #E57C55;
  /* type */
  --font-display: "Epilogue", ui-sans-serif, system-ui, sans-serif;
  --font-text: "Epilogue", ui-sans-serif, system-ui, sans-serif;
  --font-label: "Recursive", ui-monospace, "Cascadia Mono", Menlo, monospace;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 620;
  --weight-bold: 720;
  --weight-black: 800;
  --text-xs: 0.8125rem;
  --text-sm: 0.9375rem;
  --text-md: 1.0625rem;
  --text-lg: clamp(1.1875rem, 1.08rem + 0.45vw, 1.4375rem);
  --text-xl: clamp(1.5rem, 1.25rem + 1vw, 2.125rem);
  --text-2xl: clamp(2rem, 1.5rem + 2.1vw, 3.25rem);
  --text-3xl: clamp(2.625rem, 1.7rem + 3.9vw, 4.875rem);
  --text-4xl: clamp(3.25rem, 1.6rem + 7vw, 8.25rem);
  --leading-tight: 1.02;
  --leading-snug: 1.14;
  --leading-body: 1.55;
  --leading-loose: 1.7;
  --tracking-display: -0.022em;
  --tracking-heading: -0.012em;
  --tracking-body: 0;
  --tracking-label: 0.08em;
  --measure: 62ch;
  /* space (4px layers, plus the kerf) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;
  --space-11: 192px;
  --space-kerf: 2px;
  --space-gutter: clamp(16px, 4.4vw, 56px);
  --space-section: clamp(88px, 11vw, 176px);
  --space-wrap: 1240px;
  /* radius (milled; pocket = piece + kerf) */
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-xl: 34px;
  --radius-pill: 999px;
  /* elevation: into the foam (sunk) and out of it (lift) */
  --z-sunk-2: inset 1px 6px 0 -1px var(--pocket-edge-a), inset 3px 14px 18px -6px var(--pocket-ao-a), 0 1px 0 0 var(--lip-a);
  --z-sunk-1: inset .5px 3px 0 -1px var(--pocket-edge-a), inset 1.5px 7px 9px -4px var(--pocket-ao-a), 0 1px 0 0 var(--lip-a);
  --z-cut-2: inset 1px 6px 0 -1px var(--cut-edge-a), inset 3px 14px 18px -6px var(--cut-ao-a), 0 1px 0 0 var(--lip-a);
  --z-cut-1: inset .5px 3px 0 -1px var(--cut-edge-a), inset 1.5px 7px 9px -4px var(--cut-ao-a), 0 1px 0 0 var(--lip-a);
  --z-flush: 0 0 0 1px var(--piece-edge);
  --z-lift-1: 0 0 0 1px var(--piece-edge), 0 12px 18px -12px var(--lift-a), 0 2px 5px -2px var(--lift-a-2);
  --z-lift-2: 0 0 0 1px var(--piece-edge), 0 26px 38px -18px var(--lift-a), 0 6px 12px -6px var(--lift-a-2);
  --lift-1-y: -5px;
  --lift-1-r: -1.4deg;
  --lift-2-y: -12px;
  --lift-card-y: -8px;
  --lift-card-r: -0.6deg;
  --press-y: 1.5px;
  /* focus: the cut line */
  --ring-width: 2px;
  --ring-offset: 3px;
  /* motion: eases */
  --ease-thunk: linear(0, 0.191 1.7%, 0.372 3.3%, 0.54 5%, 0.692 6.7%, 0.826 8.3%, 0.942 10%, 1.039 11.7%, 1.119 13.3%, 1.181 15%, 1.227 16.7%, 1.258 18.3%, 1.275 20%, 1.28 21.7%, 1.265 25%, 1.229 28.3%, 1.016 41.7%, 0.967 46.7%, 0.954 50%, 1.011 80%, 1);
  --ease-approach: linear(0, 0.026 5%, 0.073 10%, 0.14 15%, 0.271 22.5%, 0.673 42.5%, 0.799 50%, 0.868 55%, 0.929 62.5%, 0.986 75%, 1);
  --ease-pop: linear(0, 0.125 2.5%, 0.242 5%, 0.35 7.5%, 0.449 10%, 0.624 15%, 0.77 20%, 0.887 25%, 0.98 30%, 1.051 35%, 1.101 40%, 1.143 47.5%, 1.154 55%, 1.112 70%, 1.011 92.5%, 1);
  --ease-spring: linear(0, 0.219 5%, 0.409 10%, 0.57 15%, 0.706 20%, 0.817 25%, 0.907 30%, 0.977 35%, 1.029 40%, 1.078 47.5%, 1.1 57.5%, 1.001 97.5%, 1);
  --ease-lift: cubic-bezier(.33,1,.68,1);
  --ease-drop: cubic-bezier(.5,0,.75,0);
  --ease-arc: cubic-bezier(.65,0,.35,1);
  --ease-settle: cubic-bezier(.25,1,.5,1);
  --ease-peer: cubic-bezier(.37,0,.63,1);
  --ease-toss: cubic-bezier(.32,0,.67,0);
  --ease-seat: linear(0, 0.005 8%, 0.027 12%, 0.05 14%, 0.086 16%, 0.137 18%, 0.209 20%, 0.307 22%, 0.434 24%, 0.598 26%, 0.804 28%, 1.06 30%, 1.009 36%, 0.986 42%, 1);
  /* motion: durations */
  --dur-lift: 90ms;
  --dur-drop: 90ms;
  --dur-sink: 50ms;
  --dur-thunk: 310ms;
  --dur-arc: 260ms;
  --dur-hold: 160ms;
  --dur-peer: 140ms;
  --dur-pop: 260ms;
  --dur-hover: 280ms;
  --dur-press: 60ms;
  --dur-crossfade: 350ms;
  --dur-fade: 140ms;
  --dur-tidy-stagger: 35ms;
  --dur-header-reveal: 940ms;
  --dur-hero-reveal: 3710ms;
  --dur-hero-brief: 1500ms;
  --dur-flight: 340ms;
  --dur-splash: 1000ms;
  --dur-scroll-still: 450ms;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --board: #141619;
    --board-2: #0F1113;
    --piece: #1D1F23;
    --piece-edge: rgba(239,238,233,.09);
    --line: rgba(239,238,233,.12);
    --tile: #16181B;
    --paper: #EFEEE9;
    --tray: #121417;
    --tray-top: #1A1D21;
    --tray-bot: #0C0D0F;
    --ink: #EFEEE9;
    --ink-2: #C3C5C1;
    --ink-3: #8E918D;
    --foam: #2FB67A;
    --foam-ink: #4CCB91;
    --on-foam: #07140E;
    --floor-top: #13704A;
    --floor-bot: #22A26B;
    --pocket-edge: #000000;
    --pocket-edge-op: 1;
    --pocket-ao: #000000;
    --pocket-ao-op: .58;
    --lip: #3A3E44;
    --lip-op: 1;
    --rim-dark: #000000;
    --rim-dark-op: .5;
    --cut-floor: #0F1113;
    --cut-edge: #000000;
    --cut-edge-op: .6;
    --cut-floor-top: #0A0B0D;
    --cut-floor-bot: #17191C;
    --rim: #050607;
    --shadow: #000000;
    --slot-shadow: #000000;
    --slot-shadow-op: .30;
    --ring: #4CCB91;
    --selection: rgba(47,182,122,.32);
    --pocket-edge-a: rgba(0,0,0,.85);
    --pocket-ao-a: rgba(0,0,0,.55);
    --lip-a: rgba(255,255,255,.08);
    --cut-edge-a: rgba(0,0,0,.62);
    --cut-ao-a: rgba(0,0,0,.4);
    --lift-a: rgba(0,0,0,.55);
    --lift-a-2: rgba(0,0,0,.35);
  }
}
[data-theme="light"] {
  color-scheme: light;
  --board: #EFEEE9;
  --board-2: #E6E4DD;
  --piece: #F8F7F3;
  --piece-edge: rgba(22,24,27,.10);
  --line: rgba(22,24,27,.12);
  --tile: #16181B;
  --paper: #EFEEE9;
  --tray: #121417;
  --tray-top: #1A1D21;
  --tray-bot: #0C0D0F;
  --ink: #16181B;
  --ink-2: #45484C;
  --ink-3: #62655F;
  --foam: #1FA46A;
  --foam-ink: #0C7547;
  --on-foam: #0A1D13;
  --floor-top: #0F7A4E;
  --floor-bot: #1A955F;
  --pocket-edge: #08422A;
  --pocket-edge-op: 1;
  --pocket-ao: #06311D;
  --pocket-ao-op: .52;
  --lip: #FFFFFF;
  --lip-op: .7;
  --rim-dark: #16181B;
  --rim-dark-op: .16;
  --cut-floor: #E6E4DD;
  --cut-edge: #16181B;
  --cut-edge-op: .22;
  --cut-floor-top: #D6D4CC;
  --cut-floor-bot: #E1DFD8;
  --rim: #BFBCB2;
  --shadow: #16181B;
  --slot-shadow: #0B3320;
  --slot-shadow-op: .30;
  --ring: #0C7547;
  --selection: rgba(31,164,106,.26);
  --pocket-edge-a: rgba(8,66,42,.8);
  --pocket-ao-a: rgba(6,49,29,.42);
  --lip-a: rgba(255,255,255,.85);
  --cut-edge-a: rgba(22,24,27,.17);
  --cut-ao-a: rgba(22,24,27,.10);
  --lift-a: rgba(22,24,27,.20);
  --lift-a-2: rgba(22,24,27,.12);
}
[data-theme="dark"] {
  color-scheme: dark;
  --board: #141619;
  --board-2: #0F1113;
  --piece: #1D1F23;
  --piece-edge: rgba(239,238,233,.09);
  --line: rgba(239,238,233,.12);
  --tile: #16181B;
  --paper: #EFEEE9;
  --tray: #121417;
  --tray-top: #1A1D21;
  --tray-bot: #0C0D0F;
  --ink: #EFEEE9;
  --ink-2: #C3C5C1;
  --ink-3: #8E918D;
  --foam: #2FB67A;
  --foam-ink: #4CCB91;
  --on-foam: #07140E;
  --floor-top: #13704A;
  --floor-bot: #22A26B;
  --pocket-edge: #000000;
  --pocket-edge-op: 1;
  --pocket-ao: #000000;
  --pocket-ao-op: .58;
  --lip: #3A3E44;
  --lip-op: 1;
  --rim-dark: #000000;
  --rim-dark-op: .5;
  --cut-floor: #0F1113;
  --cut-edge: #000000;
  --cut-edge-op: .6;
  --cut-floor-top: #0A0B0D;
  --cut-floor-bot: #17191C;
  --rim: #050607;
  --shadow: #000000;
  --slot-shadow: #000000;
  --slot-shadow-op: .30;
  --ring: #4CCB91;
  --selection: rgba(47,182,122,.32);
  --pocket-edge-a: rgba(0,0,0,.85);
  --pocket-ao-a: rgba(0,0,0,.55);
  --lip-a: rgba(255,255,255,.08);
  --cut-edge-a: rgba(0,0,0,.62);
  --cut-ao-a: rgba(0,0,0,.4);
  --lift-a: rgba(0,0,0,.55);
  --lift-a-2: rgba(0,0,0,.35);
}
[data-theme] { color: var(--ink); }
/* reduced motion: durations collapse to a crossfade; components read --motion (1 or 0) */
:root { --motion: 1; }
@media (prefers-reduced-motion: reduce) { :root { --motion: 0; } }
