/* kit/tokens.css: the v3 global kit's design tokens (Final Tech Lead 4992760). Every kit component reads ONLY these.
 * Reference: Apple Human Interface Guidelines, "Color" (system colors, semantic label/fill/separator/grouped
 * backgrounds), "Typography" (Dynamic Type sizes, Large default) and "Materials", as shipped in iOS 26. Values are
 * the iOS system values; brand = lime (#CEFF56) + greys only (design standard; no glows).
 * Namespaced --k-* so nothing existing moves until a component adopts them. Designer's per-component spec may retune a
 * value here; that is the one place it changes. */
/* DS v1.1 tokens (spec 5178229, FTL 5179655): kit/ds-tokens.css (generated from tokens.json) is the source of truth.
   Where a --k-* value equals the spec it is now an alias, var(--ds-<name>) — no visual change. The SURFACES go the other
   way (surface-tokens: every surface is --k-bg / --k-bg-2 / --k-fill): --k-bg / --k-bg-2 / --k-bg-3 stay literals and
   --ds-ground / --ds-surface alias them (Second Code Reviewer 5186159, fix a). One value changes on
   purpose (spec §9 step 2): light --k-label-2 #6C6C70 -> --ds-textSecondary #474B54. The --k-* values that DIFFER from
   the spec (dark/light label-2/-3, light bg-3, sep, scrim, on-tint, light seg-well/red/orange, r-sheet 32 vs 28) keep
   their current value here and move per screen re-skin, so nothing else shifts in this commit. */
:root {
  /* brand */
  --k-tint: var(--ds-accent);            /* filled button, selected segment, progress */
  --k-on-tint: #000;            /* text/glyph on the tint (13.9:1) */
  /* Lime as DATA (progress, rings, dots) is --k-tint; thin lime marks in light carry --k-tint-edge so they read on white.
     ANYTHING WITH TEXT OR A GLYPH ON IT (the main action, a selected chip, an earned badge) is the main-action tint below: owner 10-11 Oct
     "no black text on lime" supersedes the earlier "lime is a fill with #000 on it" (KIT-SPEC §0). The same values as the academy kit. */
  --k-tint-edge: 0 0 0 0 transparent;
  /* iOS 26 button system (P1 purge, owner 22 Oct picked option B "System blue"; supersedes D1 option C white): ONE system
     SUPERSEDED 26 Oct by the owner's "No blue anywhere, not even the main button": --k-tint is lime = brand + data.
     Filled = --k-main-fill (graphite) + white label + --k-main-glyph (lime arrow); Tinted = --k-tinted-*; Gray = --k-gray-btn + white; Plain = --k-plain
     label; Destructive = --k-red-btn in the same three. No shadow, glow, border, gradient or web glass on any of them. */
  /* DS-08c (owner 27 Oct "stop these dark and lime buttons"): no lime on any button or chip. The main action = elevated graphite + white label + a white arrow */
  --k-main-fill: #2E2E35;  --k-main-fill-hover: #36363E;  --k-main-press: #26262C;  --k-main-glyph: #FFFFFF;
  --k-plain: #F2F2F5;  --k-tinted-fill: rgba(235, 235, 245, .08);  --k-tinted-ink: #F2F2F5;   /* Plain = white label; Tinted = a white 8 % step */
  --k-sel-ind: #FFFFFF;  --k-sel-edge: rgba(255, 255, 255, .1);  --k-seg-on: #3A3A41;   /* a picked option: raised slate + a small white indicator (DS-08c: no lime on controls); a segment thumb: lifted slate */
  --k-good-fill: rgba(206, 255, 86, .14);  --k-good-ink: #CEFF56;   /* data: earned / landed / better = the lime chip (as Home's gain chip) */
  --k-arrow: url("/static/img/glyph/arrow.svg");
  --k-check-mask: url("/static/img/glyph/check.svg");
  --k-check-lime: url("/static/img/glyph/check-white.svg");   /* name kept for its readers; DS-08c: the picked check is white */
  --k-chip-on-bg: var(--k-check-lime) 11px 50% / 14px no-repeat, var(--k-sel-fill);   /* a picked chip: slate + a leading white check (iOS filter chip) */
  --k-day-on-bg: radial-gradient(circle, var(--k-sel-ind) 0 2.5px, transparent 3px) 50% calc(100% - 4px) / 8px 8px no-repeat, var(--k-sel-fill);   /* a picked day: slate + a lime dot */
  --k-gray-btn: #2C2C2E;  --k-on-main: #FFFFFF;  --k-red-btn: #FF453A;  --k-red-fill: rgba(255, 69, 58, .16);  --k-switch-on: #30D158;
  --k-btn-off-fill: rgba(120, 120, 128, .24);  --k-btn-off-label: rgba(235, 235, 245, .3);
  --k-main-edge:transparent; --k-main-label:#FFFFFF;   /* the main action = graphite Filled (no blue, owner 26 Oct) */
  --k-main-ring: inset 0 0 0 1px var(--k-main-edge);   /* the main-action edge as one shadow token (segmented controls take a single kit token) */
  /* grouped backgrounds (dark) */
  --k-bg: #101013;              /* web page background = main live value (Uozot 5003777 via FTL 5003853); #000 is native iOS only */
  --k-si-bg: #101013;  --k-si-label: #F5F5F7;  --k-si-label-2: rgba(245, 245, 247, .72);  --k-si-label-3: rgba(245, 245, 247, .56);   /* sign-in ground + labels, follow the theme (FTL 5305148 P0; light values below) */
  --k-si-edge: rgba(245, 245, 247, .28);  --k-si-press: rgba(245, 245, 247, .08);
  /* one log in page (Hannah 5305628 §1): tile/Google surface, hairline, Apple white, email lime */
  --k-si-surface: #1C1C1E;  --k-si-hair: rgba(255, 255, 255, .14);  --k-si-apple-bg: #FFFFFF;  --k-si-apple-fg: #000000;  --k-si-apple-edge: transparent;
  --k-si-email-bg: var(--k-main-fill);  --k-si-email-fg: var(--k-main-label);  --k-si-email-edge: var(--k-main-edge);   /* the main action: no black on lime (14 Oct) */
  --k-bg-2: #1C1C1E;            /* secondarySystemGroupedBackground: cells, cards */
  --k-bg-3: #2C2C2E;            /* tertiary */
  /* labels (dark) */
  --k-label: #fff;
  --k-label-2: rgba(235, 235, 245, .6);
  --k-label-3: rgba(235, 235, 245, .3);
  --k-mark: rgba(235, 235, 245, .62);   /* rhythm marks (days trained, streak strip): neutral grey, never lime (rules: rhythm/inactive marks are grey) */
  /* fills + separators (dark) */
  --k-fill: rgba(120, 120, 128, .36);
  --k-fill-2: rgba(120, 120, 128, .32);
  --k-fill-3: rgba(118, 118, 128, .24);
  --k-sep: rgba(84, 84, 88, .65);
  --k-sep-opaque: #38383A;
  /* status (system red / orange, used only for destructive + errors) */
  --k-red: var(--ds-bad);
  --k-orange: var(--ds-attention);
  --k-on-red: #fff;             /* badge count on system red (list.css, Third Engineer); same in both themes */
  --k-badge-red: #D70015;       /* the badge fill: white count on it is 5.4:1 (on system red #FF3B30 it is 3.55:1, #FF453A 3.41:1); same in both themes */
  /* V4 belt bar (visuals.css, Third Engineer): the belt's own colours, flat; same in both themes. The junior GREEN
     belt is data, not UI, so it is not a kit token (the brand-lime-only guard stays strict): visuals.js paints it. */
  --k-belt-white: #F2F2F2; --k-belt-blue: #1F5FD1; --k-belt-purple: #6E3BBF; --k-belt-brown: #7A4A24; --k-belt-black: #111;
  --k-belt-jr-grey: #8E8E93; --k-belt-jr-yellow: #F2C200; --k-belt-jr-orange: #F07C00;
  --k-belt-rank: #111; --k-belt-rank-black: #C8102E; --k-belt-stripe: #fff; --k-belt-stripe-todo: rgba(255, 255, 255, .18);
  --k-tint-edge-stroke: transparent;   /* SVG lime marks: the stroke form of --k-tint-edge */
  /* materials: one glass recipe (plan §6.5: 24px saturate(180%)) */
  --k-glass: rgba(30, 30, 32, .72);   /* r3 tint */
  --k-glass-blur: blur(24px) saturate(180%);
  --k-glass-edge: rgba(255, 255, 255, .18);   /* KIT-SPEC r3 specular edge */
  --k-glass-hi: inset 0 1px 0 rgba(255, 255, 255, .18);
  --k-shadow-float: 0 8px 24px rgba(0, 0, 0, .18);
  /* button heights (kit/button.css): shape values follow kit v2 (FTL 4996567), retuned here only */
  /* kit v2 r3 shape values (Designer ab456ae, FTL 5001417): main is the base, rounder not squarer */
  --k-btn-lg: 52px;  --k-btn-reg: 44px;  --k-btn-sm: 36px;                   /* one capsule, 3 sizes; dense rows 44/36 */
  --k-tab: 68px;  --k-tab-pill: 60px;  --k-tab-inset: 4px;  --k-fab: 68px;  /* tab bar 68 / 60 / 68 (HIG) */
  --k-r-hero: 28px;  --k-r-group: var(--ds-radius-group);  --k-r-inner: 10px;  --k-r-tile: 10px;  --k-tile: 32px;  --k-row: 56px;
  --k-cell-sep: block;                                                      /* separators on, inset to the text */
  /* focus: visible, never lime (Final Tech Lead 4989217) */
  --k-focus: rgba(235, 235, 245, .55);   /* = --ds-focus; kept literal: test-no-lime-state pins the shipped value */
  /* shape */
  --k-r-cell: 26px;  --k-r-card: var(--ds-radius-group);  --k-r-sheet: 32px;  --k-r-field: 999px;  --k-r-pill: 999px;   /* kit v2 r3: cards 26, sheet 32, fields capsule */
  /* sheets (Fourth Engineer, kit/sheet.css; spec b93c5ba §2/§3): device corner for inset partial sheets, the dimming scrim,
     and the stronger glass fill for sheets/menus/alerts */
  --k-r-device: 44px;
  /* kit v2 r3 overlays (Designer ab456ae/bb73c45, FTL 5001417): partial sheet inset 8, r32 top / 44 bottom;
     alert 300 × r28, backdrop .2; toast 8 pt above the 68 pt tab bar */
  --k-sheet-inset: 8px;  --k-r-sheet-bottom: 44px;  --k-r-alert: var(--ds-radius-alert);  --k-alert-w: var(--ds-size-alertWidth);
  --k-scrim: rgba(0, 0, 0, .4);
  --k-scrim-alert: rgba(0, 0, 0, .2);
  /* NO GLASS ON THE WEB (Uozot 5004419, FTL 5004488): every former glass surface is opaque. --k-bar = the elevated
     surface on the #101013 page, a 0.5 px hairline, the soft float shadow. Only the belt segmented control keeps glass. */
  --k-bar: var(--ds-chrome);  --k-bar-line: var(--ds-chromeEdge);
  /* grouped form inside a sheet (Log a roll): sheet surface + its rows (dark: elevated sheet, lifted rows) */
  --k-sheet-grouped: var(--ds-sheetGround);  --k-sheet-cell: var(--ds-sheetGroup);  --k-knob: #FFFFFF;  --k-knob-shadow: 0 2px 6px rgba(0, 0, 0, .2);
  --k-seg-well: #2C2C2E;  --k-seg-thumb: #636366;   /* = --ds-segmentedWell / -Thumb; literal: test-seg-kit reads the hex */
  /* "your row" (consistency audit, FTL 5081496): the fill-2 row fill, bold name, never a border or lime ring */
  --k-row-selected: var(--k-fill-2);
  /* a picked option / plan card (ag-b2c 15 Oct): dark = the label ring on the surface; light overrides below, never black */
  --k-sel-fill: #2A2A31;   /* a picked option = raised slate + --k-sel-ind (no blue, owner 26 Oct) */
  --k-btn-disabled: var(--k-btn-off-fill);   /* iOS disabled fill, never faded lime (UI Polish 5174716) */
  /* toggle knob (Fourth Engineer, kit/toggle.css): the system white knob and its lift */
  --k-knob: #fff;
  --k-knob-shadow: rgba(0, 0, 0, .15);
  --k-knob-edge: rgba(0, 0, 0, .04);
  /* segmented glass capsule (Fourth Engineer, kit/segmented.css; belt-glass r2 d56ffa1 .cap values) */
  --k-seg-glass: rgba(255, 255, 255, .14);
  --k-seg-lens: rgba(255, 255, 255, .04);
  --k-seg-blur: saturate(180%) blur(12px);
  --k-seg-rim: rgba(255, 255, 255, .34);
  --k-seg-hi: rgba(255, 255, 255, .45);
  --k-seg-shadow: rgba(0, 0, 0, .28);
  /* spacing (8 pt grid; 20 pt side margin, 16 under 360 pt: plan §6.3) */
  --k-s1: var(--ds-space-xs); --k-s2: var(--ds-space-s); --k-s3: var(--ds-space-m); --k-s4: var(--ds-space-l); --k-s5: var(--ds-space-margin); --k-s6: var(--ds-space-xl); --k-s8: var(--ds-space-xxl);
  --k-margin: var(--ds-space-margin);
  --k-hit: var(--ds-size-tap);
  /* icon floors (Uozot 5175250, FTL 5175316): row/list icon 20, feature + tab icon 24, icon-only tap target 44 (kit/icons.css) */
  --k-icon-row: var(--ds-icon-row); --k-icon-feature: var(--ds-icon-feature); --k-tap: var(--ds-size-tap);
  /* type: iOS Dynamic Type, Large (default) sizes in rem so user text size scales them */
  --k-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", system-ui, sans-serif;
  --k-large-title: 700 2.125rem/1.21 var(--k-font);   /* 34/41 */
  --k-title-2: 700 1.375rem/1.27 var(--k-font);       /* 22/28 */
  --k-title-3: 600 1.25rem/1.25 var(--k-font);        /* 20/25 */
  --k-headline: 600 1.0625rem/1.29 var(--k-font);     /* 17/22 */
  --k-body: 400 1.0625rem/1.29 var(--k-font);         /* 17/22 */
  --k-callout: 400 1rem/1.31 var(--k-font);           /* 16/21 */
  --k-subhead: 400 .9375rem/1.33 var(--k-font);       /* 15/20 */
  --k-footnote: 400 .8125rem/1.38 var(--k-font);      /* 13/18 */
  --k-caption: 400 .75rem/1.33 var(--k-font);         /* 12/16 */
  --k-min-type: .6875rem;                             /* 11 pt floor (plan G5) */
}
/* Dark document ground = the page (UI Polish 5019156, FTL 5019391): `html` read --ground #0b0b0d under a #101013 body,
   seen only in iOS rubber-band overscroll and the Safari toolbar tint. Beats ds.src `html { var(--ground) }` on
   specificity; the landing's own html:has(.land-simple) ground is !important and keeps winning. Bare html[data-theme]
   so the critical-css subsets carry it on the first frame. */
html[data-theme="dark"] { background-color: var(--k-bg); }
@media (width < 360px) { :root { --k-margin: 16px; } }
html[data-theme="light"] {
  --k-si-bg: #F2F2F7; --k-si-label: #000000; --k-si-label-2: rgba(60, 60, 67, .85); --k-si-label-3: rgba(60, 60, 67, .6);
  --k-si-edge: rgba(60, 60, 67, .29); --k-si-press: rgba(0, 0, 0, .05);
  --k-si-surface: #FFFFFF; --k-si-hair: rgba(0, 0, 0, .10); --k-si-apple-edge: #000000; --k-si-email-edge: var(--k-main-edge);
  --k-tint-edge: 0 0 0 .5px rgba(0, 0, 0, .18);
  /* light (paused, kept working): the iOS light system values of the same button system */
  --k-main-fill: #1C1C1E;  --k-main-fill-hover: #2C2C2E;  --k-main-press: #3A3A3C;  --k-main-glyph: #CEFF56;
  --k-plain: #1C1C1E;  --k-tinted-fill: rgba(60, 60, 67, .08);  --k-tinted-ink: #1C1C1E;
  --k-sel-ind: #5E8A00;  --k-sel-edge: rgba(0, 0, 0, .1);  --k-seg-on: #FFFFFF;
  --k-good-fill: #F4FFDA;  --k-good-ink: #3F5C00;
  --k-check-lime: url("/static/img/glyph/check-lime-light.svg");
  --k-gray-btn: rgba(120, 120, 128, .16);  --k-red-btn: #FF3B30;  --k-red-fill: rgba(255, 59, 48, .12);  --k-switch-on: #34C759;
  --k-btn-off-fill: rgba(120, 120, 128, .16);  --k-btn-off-label: rgba(60, 60, 67, .3);
  --k-main-edge:transparent; --k-main-label:#FFFFFF;
  --k-tint-edge-stroke: rgba(0, 0, 0, .18);
  --k-bg: #F2F2F7;
  --k-bg-2: #fff;
  --k-bg-3: #F2F2F7;
  --k-label: #000;
  --k-label-2: var(--ds-textSecondary);   /* DS v1.1: #474B54 (was #6C6C70 per plan §4.3); 8.3:1 on #F2F2F7 */
  --k-label-3: rgba(60, 60, 67, .3);
  --k-mark: rgba(60, 60, 67, .58);   /* rhythm marks, light: grey, not label ink (no black data marks in light) */
  --k-fill: rgba(120, 120, 128, .2);
  --k-fill-2: rgba(120, 120, 128, .16);
  --k-fill-3: rgba(118, 118, 128, .12);
  --k-sep: rgba(60, 60, 67, .29);
  --k-sep-opaque: #C6C6C8;
  --k-red: #FF3B30;
  --k-orange: #FF9500;
  --k-glass: rgba(249, 249, 249, .78);
  --k-glass-edge: rgba(255, 255, 255, .8);
  --k-glass-hi: inset 0 1px 0 #fff;
  --k-seg-glass: rgba(255, 255, 255, .62);
  --k-bar: var(--ds-chrome);  --k-bar-line: var(--ds-chromeEdge);
  --k-sheet-grouped: var(--ds-sheetGround);  --k-sheet-cell: var(--ds-sheetGroup);   /* light: the native grouped sheet, white rows on #F2F2F7 (B. Tech Lead 5008237) */
  --k-seg-well: #E5E5EA;  --k-seg-thumb: #FFFFFF;
  /* light: no black selected states (owner 10 Oct) — iOS system grey ring + check on the neutral selected fill */
  --k-sel-fill: var(--k-row-selected);
  --k-btn-disabled: var(--k-btn-off-fill);
  --k-seg-lens: rgba(255, 255, 255, .16);
  --k-seg-rim: rgba(255, 255, 255, .95);
  --k-seg-hi: #fff;
  --k-seg-shadow: rgba(0, 0, 0, .14);
  --k-scrim: rgba(0, 0, 0, .2);
  --k-focus: rgba(60, 60, 67, .6);
}