/* SPDX-License-Identifier: MIT
 * hidebox tokens: shadcn/ui "new-york-v4", base colour "neutral", ported to plain CSS.
 *
 * Sources (fetched 2026-10-13 as data):
 *   - Colour scale, radius and radius steps: shadcn/ui docs "Theming"
 *     (apps/v4/content/docs/(root)/theming.mdx, via Context7 /shadcn-ui/ui), values copied exactly.
 *   - Added state colours: shadcn/ui apps/v4/registry/themes.ts, the official "violet", "emerald" and "amber"
 *     themes (their primary and chart-1 values), used only where the colour carries meaning (see DESIGN.md).
 *   - Spacing, type steps, shadows and easing: the Tailwind CSS v4 defaults the shadcn classes resolve to.
 *
 * Theme switching: light by default; dark when the system asks for it and the page has no
 * data-theme="light", or always with data-theme="dark" (the shadcn ".dark" class, as an attribute).
 *
 * Drive v3 (docs/review/drive-v3.md): the drive in the home's v3 look. Light is the site's light (white, the
 * #FAFAFA rail, #666666 secondary text, as web/shared/tokens.css); dark is v3's black void (#0A0A0A) with gunmetal
 * panels (one cool ramp, OKLCH hue 258, from v3's stage #17191C to #2B2F35), frosted glass on the raised surfaces
 * (--glass*: a soft light from above inside a white hairline, after v2.css's recipe).
 * Violet stays Tari's; in dark it takes the site's pay-text (#A684FF) so a Tari badge reads as on the home.
 */

@font-face {
  font-family: "Geist";
  src: url("/shared/fonts/geist/Geist-Variable.2ffebe993e.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: light;

  /* shadcn neutral, light (exact) */
  --radius: 0.625rem;
  --background: oklch(1 0 0);
  --foreground: oklch(0.145 0 0);
  --card: oklch(1 0 0);
  --card-foreground: oklch(0.145 0 0);
  --popover: oklch(1 0 0);
  --popover-foreground: oklch(0.145 0 0);
  --primary: oklch(0.205 0 0);
  --primary-foreground: oklch(0.985 0 0);
  --secondary: oklch(0.97 0 0);
  --secondary-foreground: oklch(0.205 0 0);
  --muted: oklch(0.97 0 0);
  --muted-foreground: oklch(0.51 0 0);         /* v3: the site's --fg-2 #666666 (shadcn's #737373 is 4.35:1 on --muted) */
  --accent: oklch(0.97 0 0);
  --accent-foreground: oklch(0.205 0 0);
  --destructive: oklch(0.577 0.245 27.325);
  --border: oklch(0.922 0 0);
  --input: oklch(0.922 0 0);
  --ring: oklch(0.708 0 0);
  --chart-1: oklch(0.646 0.222 41.116);
  --chart-2: oklch(0.6 0.118 184.704);
  --chart-3: oklch(0.398 0.07 227.392);
  --chart-4: oklch(0.828 0.189 84.429);
  --chart-5: oklch(0.769 0.188 70.08);
  --sidebar: oklch(0.985 0 0);
  --sidebar-foreground: oklch(0.145 0 0);
  --sidebar-primary: oklch(0.205 0 0);
  --sidebar-primary-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.97 0 0);
  --sidebar-accent-foreground: oklch(0.205 0 0);
  --sidebar-border: oklch(0.922 0 0);
  --sidebar-ring: oklch(0.708 0 0);

  /* Additions, from shadcn's own themes (light): meaning only, never decoration */
  --tari: oklch(0.491 0.27 292.581);            /* violet theme primary: Tari-only things */
  --tari-soft: oklch(0.491 0.27 292.581 / 0.09);
  --success: oklch(0.508 0.118 165.612);        /* emerald theme primary: paid, delivered, done */
  --success-soft: oklch(0.508 0.118 165.612 / 0.1);
  --warning: oklch(0.53 0.163 48.998);          /* amber theme primary, a step darker (v3: 4.8:1 on its own wash; 4.37 before) */
  --warning-soft: oklch(0.555 0.163 48.998 / 0.1);
  --scrim: oklch(0 0 0 / 0.5);                  /* shadcn overlay: bg-black/50 */
  --qr-ink: oklch(0.145 0 0);                   /* the QR stays dark on white in both themes */
  --qr-paper: oklch(1 0 0);
  /* Site v4 (17-brand.md v3): Tari's lime fills the one primary of each view, under the ink label (16.32:1);
     a 1px lime-700 edge on light (lime on white is 1.21:1); picked rows sit on the lime tint. Hex, as the site's. */
  --brand-solid: #BCFE00; --brand-solid-hover: #B1EC20; --on-brand: #0A0A0A; --brand-edge: #59800B; --brand-subtle: #F4FFE6;
  /* Drive v3: light keeps v3's plain cards (no glass); dark fills these in below. The stage is v3's
     gunmetal card under a picture in light mode (the start screen's open box, drawn on it with lighten). */
  --glass: none; --glass-edge: var(--border); --glass-top: var(--border); --tile-edge: 0 0 #0000;
  --chip: var(--secondary); --tile-fill: var(--muted);   /* a badge's fill; an icon tile's fill (dark: frosted) */
  --on-destructive: oklch(1 0 0); --destructive-text: oklch(0.52 0.22 27.3);   /* red text on a red wash (5.06:1); a red fill's label */
  --stage: radial-gradient(130% 95% at 50% 28%, #2B2F35 0%, #17191C 55%, #0A0A0A 100%); --stage-blend: lighten;
  --stage-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.06), inset 0 1px 0 rgb(255 255 255 / 0.1), 0 1px 2px rgb(10 10 10 / 0.06), 0 32px 64px -36px rgb(10 10 10 / 0.5);

  /* Radius steps (shadcn @theme inline) */
  --radius-xs: 0.125rem;
  --radius-sm: calc(var(--radius) * 0.6);
  --radius-md: calc(var(--radius) * 0.8);
  --radius-lg: var(--radius);
  --radius-xl: calc(var(--radius) * 1.4);
  --radius-full: 9999px;

  /* Tailwind v4 defaults that the shadcn classes resolve to */
  --spacing: 0.25rem;
  --font-sans: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
  --text-xs: 0.75rem;   --text-xs--lh: calc(1 / 0.75);
  --text-sm: 0.875rem;  --text-sm--lh: calc(1.25 / 0.875);
  --text-base: 1rem;    --text-base--lh: calc(1.5 / 1);
  --text-lg: 1.125rem;  --text-lg--lh: calc(1.75 / 1.125);
  --text-xl: 1.25rem;   --text-xl--lh: calc(1.75 / 1.25);
  --text-2xl: 1.5rem;   --text-2xl--lh: calc(2 / 1.5);
  --text-3xl: 1.875rem; --text-3xl--lh: calc(2.25 / 1.875);
  --text-4xl: 2.25rem;  --text-4xl--lh: calc(2.5 / 2.25);
  --text-5xl: 3rem;     --text-5xl--lh: 1;
  --tracking-tight: -0.025em;
  --tracking-tighter: -0.05em;
  --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --ease: cubic-bezier(0.4, 0, 0.2, 1);         /* Tailwind default "transition" timing */
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
  --duration: 150ms;                            /* Tailwind default; tw-animate-css default */
  --sidebar-width: 16rem;                       /* shadcn SIDEBAR_WIDTH */
  --sidebar-width-mobile: 18rem;                /* shadcn SIDEBAR_WIDTH_MOBILE */
  --header-height: 3.5rem;
  --target: 2.25rem;                            /* shadcn h-9; 2.75rem on coarse pointers, see below */

  /* z scale (one place) */
  --z-sticky: 10;
  --z-overlay: 50;                              /* shadcn z-50 for every overlay */
  --z-toast: 60;
}

@media (pointer: coarse) {
  :root { --target: 2.75rem; }                  /* project rule: 44px touch targets */
}

/* shadcn neutral, dark (exact) */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --background: oklch(0.145 0 0);
    --foreground: oklch(0.985 0 0);
    --card: oklch(0.192 0.0055 258.4);          /* gunmetal 850 #131417 (v3) */
    --card-foreground: oklch(0.985 0 0);
    --popover: oklch(0.212 0.0067 258.4);       /* gunmetal 800 #17191C, v3's stage */
    --popover-foreground: oklch(0.985 0 0);
    --primary: oklch(0.922 0 0);
    --primary-foreground: oklch(0.205 0 0);
    --secondary: oklch(0.25 0.0088 258.4);      /* gunmetal 700 #1F2226 */
    --secondary-foreground: oklch(0.985 0 0);
    --muted: oklch(0.25 0.0088 258.4);
    --muted-foreground: oklch(0.708 0 0);
    --accent: oklch(0.25 0.0088 258.4);
    --accent-foreground: oklch(0.985 0 0);
    --destructive: oklch(0.704 0.191 22.216);
    --border: oklch(1 0 0 / 10%);
    --input: oklch(1 0 0 / 15%);
    --ring: oklch(0.556 0 0);
    --chart-1: oklch(0.488 0.243 264.376);
    --chart-2: oklch(0.696 0.17 162.48);
    --chart-3: oklch(0.769 0.188 70.08);
    --chart-4: oklch(0.627 0.265 303.9);
    --chart-5: oklch(0.645 0.246 16.439);
    --sidebar: oklch(0.178 0.0045 258.4);       /* gunmetal 900 #101113: the panel beside the void */
    --sidebar-foreground: oklch(0.985 0 0);
    --sidebar-primary: oklch(0.488 0.243 264.376);
    --sidebar-primary-foreground: oklch(0.985 0 0);
    --sidebar-accent: oklch(0.25 0.0088 258.4);
    --sidebar-accent-foreground: oklch(0.985 0 0);
    --sidebar-border: oklch(1 0 0 / 8%);
    --sidebar-ring: oklch(0.556 0 0);
    --tari: oklch(0.699 0.176 294.1);           /* v3: the site's pay-text #A684FF, 5.4:1 or more on --tari-soft here */
    --tari-soft: oklch(0.491 0.27 292.581 / 0.12);
    --success: oklch(0.845 0.143 164.978);      /* emerald chart-1 */
    --success-soft: oklch(0.696 0.17 162.48 / 0.16);
    --warning: oklch(0.879 0.169 91.605);       /* amber chart-1 */
    --warning-soft: oklch(0.769 0.188 70.08 / 0.16);
    --brand-edge: transparent; --brand-subtle: #161D0B;
    --glass: linear-gradient(180deg, rgb(255 255 255 / 0.05), rgb(255 255 255 / 0.015));
    --glass-edge: rgb(255 255 255 / 0.085); --glass-top: rgb(255 255 255 / 0.16);
    --tile-edge: inset 0 0 0 1px rgb(255 255 255 / 0.09), inset 0 1px 0 rgb(255 255 255 / 0.18);
    --stage: none; --stage-blend: normal; --stage-shadow: 0 0 #0000;
    --chip: rgb(255 255 255 / 0.07); --tile-fill: rgb(255 255 255 / 0.06);
    --on-destructive: oklch(0.145 0 0); --destructive-text: var(--destructive);
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --background: oklch(0.145 0 0);
  --foreground: oklch(0.985 0 0);
  --card: oklch(0.192 0.0055 258.4);          /* gunmetal 850 #131417 (v3) */
  --card-foreground: oklch(0.985 0 0);
  --popover: oklch(0.212 0.0067 258.4);       /* gunmetal 800 #17191C, v3's stage */
  --popover-foreground: oklch(0.985 0 0);
  --primary: oklch(0.922 0 0);
  --primary-foreground: oklch(0.205 0 0);
  --secondary: oklch(0.25 0.0088 258.4);      /* gunmetal 700 #1F2226 */
  --secondary-foreground: oklch(0.985 0 0);
  --muted: oklch(0.25 0.0088 258.4);
  --muted-foreground: oklch(0.708 0 0);
  --accent: oklch(0.25 0.0088 258.4);
  --accent-foreground: oklch(0.985 0 0);
  --destructive: oklch(0.704 0.191 22.216);
  --border: oklch(1 0 0 / 10%);
  --input: oklch(1 0 0 / 15%);
  --ring: oklch(0.556 0 0);
  --chart-1: oklch(0.488 0.243 264.376);
  --chart-2: oklch(0.696 0.17 162.48);
  --chart-3: oklch(0.769 0.188 70.08);
  --chart-4: oklch(0.627 0.265 303.9);
  --chart-5: oklch(0.645 0.246 16.439);
  --sidebar: oklch(0.178 0.0045 258.4);       /* gunmetal 900 #101113: the panel beside the void */
  --sidebar-foreground: oklch(0.985 0 0);
  --sidebar-primary: oklch(0.488 0.243 264.376);
  --sidebar-primary-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.25 0.0088 258.4);
  --sidebar-accent-foreground: oklch(0.985 0 0);
  --sidebar-border: oklch(1 0 0 / 8%);
  --sidebar-ring: oklch(0.556 0 0);
  --tari: oklch(0.699 0.176 294.1);           /* v3: the site's pay-text #A684FF, 5.4:1 or more on --tari-soft here */
  --tari-soft: oklch(0.491 0.27 292.581 / 0.12);
  --success: oklch(0.845 0.143 164.978);
  --success-soft: oklch(0.696 0.17 162.48 / 0.16);
  --warning: oklch(0.879 0.169 91.605);
  --warning-soft: oklch(0.769 0.188 70.08 / 0.16);
  --brand-edge: transparent; --brand-subtle: #161D0B;
  --glass: linear-gradient(180deg, rgb(255 255 255 / 0.05), rgb(255 255 255 / 0.015));
  --glass-edge: rgb(255 255 255 / 0.085); --glass-top: rgb(255 255 255 / 0.16);
  --tile-edge: inset 0 0 0 1px rgb(255 255 255 / 0.09), inset 0 1px 0 rgb(255 255 255 / 0.18);
  --stage: none; --stage-blend: normal; --stage-shadow: 0 0 #0000;
  --chip: rgb(255 255 255 / 0.07); --tile-fill: rgb(255 255 255 / 0.06);
  --on-destructive: oklch(0.145 0 0); --destructive-text: var(--destructive);
}
/* increased contrast: an ink edge round the lime on light pages (the dark blocks outrank this) */
@media (prefers-contrast: more) { :root { --brand-edge: var(--foreground); } }

/* shadcn @layer base: border colour and ring outline everywhere, page colours on body */
*, *::before, *::after { box-sizing: border-box; border: 0 solid var(--border); outline-color: color-mix(in oklab, var(--ring) 50%, transparent); }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--background);
  color: var(--foreground);
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  line-height: var(--text-sm--lh);
  font-feature-settings: "rlig" 1, "calt" 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
::selection { background: var(--primary); color: var(--primary-foreground); }
select option, select optgroup { background-color: var(--popover); color: var(--popover-foreground); }   /* an open native list: never the OS's colours */
select option:disabled { color: var(--muted-foreground); }
:focus-visible { outline: 2px solid var(--ring); outline-offset: 2px; }
h1, h2, h3, h4, p, ul, ol, figure, dl, dd { margin: 0; }
ul[role="list"], ol[role="list"] { list-style: none; padding: 0; }
button, input, select, textarea { font: inherit; color: inherit; letter-spacing: inherit; }
img, svg, video, canvas { display: block; max-width: 100%; }
a { color: inherit; text-underline-offset: 4px; }
[hidden] { display: none !important; }
* { scrollbar-width: thin; scrollbar-color: var(--border) transparent; }
.tabular, td, .num { font-variant-numeric: tabular-nums; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; transition-duration: 1ms !important; scroll-behavior: auto !important; }
}