/* ============================================================
   LineTack — brand stylesheet for linetack.com
   Source of truth: design/2026-09-10-landing/design-system/
   (tokens/{colors,typography,spacing,base}.css concatenated; the faces are
   self-hosted via /site-fonts.css, so there is no fonts @import here,
   plus the interaction classes the authored design expressed as
   hover / active / focus states).
   Do not hand-edit token values here — change them in the handoff
   and re-derive, so the design system stays the origin.
   ============================================================ */

:root {
  --lt-hdr-h: 56px; /* header row: 44px target + 2 x 6px padding */
  /* ---- Chalk ramp (canvas & surfaces) --------------------- */
  --chalk-0:   #ffffff;
  --chalk-50:  #f7f8f9;
  --chalk-100: #eef1f4;
  --chalk-200: #e7ebef;
  --chalk-300: #dfe4ea;
  --chalk-400: #c9d1da;
  --chalk-500: #adb8c4;
  --chalk-600: #93a0b0;

  /* ---- Navy ramp (ink, grounds, text) --------------------- */
  --navy-900: #0e1b2e;
  --navy-800: #14263f;
  --navy-700: #223451;
  --navy-600: #2f3f56;
  --navy-500: #4b5a6f;
  --navy-400: #5e6b7d;
  --navy-300: #8794a5;
  --navy-tint-07: rgba(20, 38, 63, 0.07);
  --navy-tint-22: rgba(20, 38, 63, 0.22);

  /* ---- Amber (the signal) --------------------------------- */
  --amber-300: #f8cd6b;
  --amber-400: #f5b93c;
  --amber-500: #f0a71a;
  --amber-600: #d18d0c;
  --amber-700: #a06a00;
  --amber-ink: #8a5c00;
  --amber-tint-12: rgba(240, 167, 26, 0.14);
  --amber-tint-20: rgba(240, 167, 26, 0.22);
  --amber-tint-46: rgba(240, 167, 26, 0.46);

  /* ---- Status (queue semantics) --------------------------- */
  --approved-500: #0f6b4f;
  --approved-ink:  #0c5740;
  --approved-tint: rgba(15, 107, 79, 0.10);
  --approved-border: rgba(15, 107, 79, 0.30);
  --rejected-500: #c0392b;
  --rejected-ink: #9d2b20;
  --rejected-tint: rgba(192, 57, 43, 0.12);
  --flagged-500: #a06a00;
  --flagged-ink: #8a5c00;
  --flagged-tint: rgba(240, 167, 26, 0.16);
  --info-500: #2f6fa8;
  --info-tint: rgba(47, 111, 168, 0.12);

  /* ---- Semantic aliases ----------------------------------- */
  --bg:             var(--chalk-50);
  --bg-band:        var(--chalk-100);
  --bg-sunken:      var(--chalk-200);
  --bg-inverse:     var(--navy-800);
  --surface:        var(--chalk-0);
  --surface-raised: var(--chalk-0);
  --surface-hover:  var(--chalk-100);

  --border-subtle:  var(--chalk-300);
  --border:         var(--chalk-400);
  --border-strong:  var(--chalk-500);
  --border-accent:  var(--amber-500);

  --text-strong:    var(--navy-800);
  --text-heading:   var(--navy-700);
  --text:           var(--navy-600);
  --text-secondary: var(--navy-500);
  --text-meta:      var(--navy-400);
  --text-muted:     var(--navy-400);
  --text-disabled:  var(--navy-300);
  --text-on-accent: #17181a;   /* ink on amber — 8.4:1. Never white. */
  --text-on-inverse:#f7f8f9;

  --accent:         var(--amber-500);
  --accent-hover:   var(--amber-600);
  --accent-active:  var(--amber-700);
  --accent-ink:     var(--amber-ink);
  --accent-tint:    var(--amber-tint-12);
  --accent-2:       var(--navy-800);
  --accent-2-ink:   var(--navy-800);
  --accent-2-tint:  var(--navy-tint-07);
  --accent-2-border:var(--navy-tint-22);

  --link:           var(--amber-ink);
  --link-hover:     var(--navy-800);
  --focus-ring:     0 0 0 2px var(--chalk-50), 0 0 0 4px var(--amber-500);

  /* ---- Type ----------------------------------------------- */
  --font-sans: "Barlow", "Helvetica Neue", Arial, sans-serif;
  --font-display: "Barlow Semi Condensed", var(--font-sans);
  --font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  --fs-hero:    clamp(38px, 5.4vw, 66px);
  --fs-h2:      clamp(27px, 3.2vw, 38px);
  --fs-h3:      21px;
  --fs-h4:      16px;
  --fs-lead:    19px;
  --fs-body-lg: 17px;
  --fs-body:    15px;
  --fs-body-sm: 14px;
  --fs-mono:    13px;
  --fs-mono-sm: 12px;
  --fs-mono-xs: 11px;

  --lh-display: 1.04;
  --lh-heading: 1.06;
  --lh-body:    1.6;
  --lh-mono:    1.75;

  --tr-hero:    -0.024em;
  --tr-heading: -0.022em;
  --tr-h3:      -0.018em;
  --tr-body:     0;
  --tr-label:    0.12em;
  --tr-mono:     0.08em;

  /* ---- Pilot bar (site v3 r5) ------------------------------ */
  --newsbar-bg:     #fcebc4;
  --newsbar-border: var(--amber-tint-46);
  --newsbar-text:   var(--navy-800);

  /* ---- Spacing, radii, shadows, motion -------------------- */
  --s-1:  4px;  --s-2:  8px;  --s-3: 12px; --s-4: 16px; --s-5: 22px;
  --s-6: 28px;  --s-7: 34px;  --s-8: 48px; --s-9: 64px; --s-10: 84px;

  --section-y: clamp(56px, 7vw, 84px);
  --section-x: clamp(16px, 3vw, 28px);
  --measure:   1180px;
  --measure-narrow: 840px;

  --r-sm:   4px;
  --r-md:   6px;
  --r-lg:   8px;
  --r-xl:  12px;
  --r-2xl: 22px;
  --r-full: 999px;

  --bw: 1px;
  --bw-rule: 3px;

  --shadow-sm: 0 1px 2px rgba(20, 38, 63, 0.06);
  --shadow-md: 0 4px 18px rgba(20, 38, 63, 0.08);
  --shadow-signal: 0 0 0 1px rgba(240, 167, 26, 0.46), 0 10px 26px rgba(20, 38, 63, 0.10);

  --dur-fast: 110ms;
  --dur: 170ms;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
}

/* ---- Element resets -------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

button { font: inherit; }

h1, h2, h3, h4 {
  margin: 0;
  color: var(--text-strong);
  font-weight: var(--fw-semibold);
  letter-spacing: var(--tr-heading);
  line-height: var(--lh-heading);
  text-wrap: balance;
}
h1 { font-size: var(--fs-hero); letter-spacing: var(--tr-hero); line-height: var(--lh-display); }
h2 { font-size: var(--fs-h2); }
h3 { font-size: var(--fs-h3); letter-spacing: var(--tr-h3); }
h4 { font-size: var(--fs-h4); }

p { margin: 0; text-wrap: pretty; }

a { color: var(--link); text-decoration: none; }
a:hover { color: var(--link-hover); }

::selection { background: var(--amber-tint-46); }

:focus-visible { outline: none; box-shadow: var(--focus-ring); }

/* ---- Brand primitives ------------------------------------ */
.lt-eyebrow {
  font-family: var(--font-mono);
  font-size: var(--fs-mono-sm);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--accent-2-ink);
}

.lt-signature {
  border-left: var(--bw-rule) solid var(--accent);
  padding-left: 14px;
  font-family: var(--font-mono);
  font-size: var(--fs-mono);
  line-height: var(--lh-mono);
  color: var(--text-meta);
}

.lt-mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }

.lt-step {
  font-family: var(--font-mono);
  font-size: var(--fs-mono-sm);
  letter-spacing: var(--tr-label);
  color: var(--accent-ink);
}

/* ---- Layout ---------------------------------------------- */
.lt-measure {
  max-width: var(--measure);
  margin: 0 auto;
  padding: var(--section-y) var(--section-x);
}
.lt-measure--narrow { max-width: var(--measure-narrow); }
.lt-band { border-top: 1px solid var(--border-subtle); background: var(--bg-band); }
.lt-rule { border-top: 1px solid var(--border-subtle); }
.lt-grid { display: grid; gap: 22px; }
.lt-lead { font-size: var(--fs-body-lg); line-height: var(--lh-body); color: var(--text-secondary); }

/* ---- Buttons (hover and active states) ---- */
.lt-btn {
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--r-md);
  font-family: var(--font-sans); font-weight: var(--fw-semibold);
  line-height: 1; letter-spacing: -.005em; white-space: nowrap;
  cursor: pointer; text-decoration: none;
  transition: background var(--dur) var(--ease-out),
              color var(--dur) var(--ease-out),
              border-color var(--dur) var(--ease-out),
              transform var(--dur-fast) var(--ease-out);
}
.lt-btn--lg { height: 48px; padding: 0 24px; font-size: 15px; }
.lt-btn--sm { height: 32px; padding: 0 12px; font-size: 13px; }
.lt-btn--primary { background: var(--accent); color: var(--text-on-accent); border: 1px solid transparent; }
.lt-btn--primary:hover  { background: var(--accent-hover); color: var(--text-on-accent); }
.lt-btn--primary:active  { background: var(--accent-active); transform: translateY(1px); }
.lt-btn--secondary { background: var(--surface-raised); color: var(--text-strong); border: 1px solid var(--border-strong); }
.lt-btn--secondary:hover { background: var(--surface-hover); color: var(--text-strong); }
.lt-btn--secondary:active { transform: translateY(1px); }

/* ---- Header nav on the navy plate ------------------------ */
.lt-nav a { color: var(--chalk-400); transition: color var(--dur) var(--ease-out); }
.lt-nav a:hover { color: var(--text-on-inverse); }

/* ---- Queue ----------------------------------------------- */
.lt-amount {
  width: 66px; padding: 2px 4px; text-align: right;
  font-family: var(--font-mono); font-size: 16px; font-variant-numeric: tabular-nums;
  color: var(--text-strong); background: transparent;
  border: 1px solid transparent; border-bottom: 1px dashed var(--border);
  border-radius: var(--r-sm); outline: none;
  transition: background var(--dur) var(--ease-out), border-color var(--dur) var(--ease-out);
}
.lt-amount:hover { background: var(--surface-hover); border-color: var(--border); }
.lt-amount:focus {
  background: var(--amber-tint-12);
  border: 1px solid var(--accent); border-bottom: 1px solid var(--accent);
}
.lt-reset {
  flex: none; height: 34px; padding: 0 14px; border-radius: var(--r-md);
  border: 1px solid var(--border-strong); background: var(--surface-raised);
  color: var(--text-secondary); font-family: var(--font-mono); font-size: 12px;
  cursor: pointer; transition: background var(--dur) var(--ease-out), color var(--dur) var(--ease-out);
}
.lt-reset:hover { background: var(--surface-hover); color: var(--text-strong); }
.lt-approve {
  width: 82px; height: 32px; border-radius: var(--r-md); border: 1px solid transparent;
  background: var(--accent); color: var(--text-on-accent);
  font-family: var(--font-sans); font-size: 12px; font-weight: var(--fw-semibold);
  cursor: pointer; transition: background var(--dur) var(--ease-out), transform var(--dur-fast) var(--ease-out);
}
.lt-approve:hover { background: var(--accent-hover); }
.lt-approve:active { transform: translateY(1px); }
.lt-reject {
  width: 78px; height: 32px; border-radius: var(--r-md); border: 1px solid var(--border-strong);
  background: var(--surface-raised); color: var(--text-secondary);
  font-family: var(--font-sans); font-size: 12px;
  cursor: pointer; transition: background var(--dur) var(--ease-out), color var(--dur) var(--ease-out), transform var(--dur-fast) var(--ease-out);
}
.lt-reject:hover { background: var(--surface-hover); color: var(--text-strong); }
.lt-reject:active { transform: translateY(1px); }

/* ---- Cards ----------------------------------------------- */
.lt-card {
  border: 1px solid var(--border-subtle); border-radius: var(--r-lg);
  background: var(--surface); padding: 22px;
}
.lt-tile { border: 1px solid var(--border-subtle); border-radius: var(--r-lg); background: var(--surface); padding: 18px; }
.lt-chip {
  display: inline-flex; align-items: center; padding: 5px 10px;
  font-size: 13px; font-weight: var(--fw-medium);
  color: var(--approved-ink); background: var(--approved-tint);
  border: 1px solid var(--approved-border); border-radius: var(--r-sm);
}

/* ---- The LIVE pulse -------------------------------------- */
@keyframes lt-live-pulse {
  0%   { transform: scale(1);   opacity: 1; }
  70%  { transform: scale(2.6); opacity: 0; }
  100% { transform: scale(2.6); opacity: 0; }
}
.lt-live { display: flex; align-items: center; gap: 7px; font-family: var(--font-mono); font-size: 11px; letter-spacing: var(--tr-mono); font-weight: var(--fw-bold); color: var(--approved-ink); }
.lt-live-dot { position: relative; display: inline-flex; width: 7px; height: 7px; flex: none; }
.lt-live-ring { position: absolute; inset: 0; border-radius: 50%; background: var(--approved-500); animation: lt-live-pulse 1.9s var(--ease-out) infinite; }
.lt-live-core { position: relative; width: 7px; height: 7px; border-radius: 50%; background: var(--approved-500); }
.lt-wip { font-family: var(--font-mono); font-size: 11px; letter-spacing: var(--tr-mono); color: var(--flagged-ink); }

@media (prefers-reduced-motion: reduce) {
  .lt-live-ring { animation: none !important; }
  * { transition-duration: 1ms !important; }
}

/* ============================================================
   Site v3 chrome (r5, Plans style): header + native <details>
   menu, pilot bar, unified footer. Shared by every page.
   ============================================================ */
a { text-decoration: none; }

.lt-page { background: var(--bg); color: var(--text); font-family: var(--font-sans); min-height: 100vh; display: flex; flex-direction: column; overflow-x: clip; }
.lt-page > main { flex: 1; width: 100%; box-sizing: border-box; }
.lt-vh { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }

.lt-hdr { position: sticky; top: 0; z-index: 20; background: var(--navy-800); }
.lt-hdr--static { position: relative; }
.lt-hdr-row { max-width: var(--measure); margin: 0 auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 24px; padding: 6px var(--section-x); }
.lt-logo { position: relative; display: flex; align-items: center; min-height: 44px; color: var(--chalk-50); text-decoration: none; }
.lt-logo:hover { color: var(--chalk-50); }

.lt-menu { display: flex; }
.lt-menu > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 10px; box-sizing: border-box; border-radius: var(--r-md); color: var(--chalk-50); font-size: 15px; font-weight: 600; }
.lt-menu > summary::-webkit-details-marker { display: none; }
.lt-menu > summary:hover { color: var(--amber-400); }
.lt-menu > summary:focus-visible { outline: 2px solid var(--amber-400); outline-offset: 2px; box-shadow: none; }
.lt-menu-icon { display: flex; flex-direction: column; gap: 3px; width: 16px; }
.lt-menu-icon i { height: 2px; background: currentColor; border-radius: 1px; }
.lt-menu > nav { position: absolute; z-index: 1; right: max(0px, calc((100% - var(--measure)) / 2)); top: calc(100% + var(--lt-pilot-h, 0px)); width: min(100%, 320px); box-sizing: border-box; display: flex; flex-direction: column; padding: 8px 0 12px; background: var(--navy-800); border: 1px solid var(--navy-700); border-top: none; border-radius: 0 0 var(--r-md) var(--r-md); max-height: calc(100dvh - var(--lt-hdr-h) - var(--lt-pilot-h, 0px)); overflow-y: auto; overscroll-behavior: contain; }
.lt-menu > nav a { display: flex; align-items: center; min-height: 44px; padding: 0 20px; color: var(--chalk-50); font-size: 15px; text-decoration: none; }
.lt-menu > nav a:hover { color: var(--amber-400); background: var(--navy-700); }
.lt-menu > nav a:focus-visible { outline: 2px solid var(--amber-400); outline-offset: -2px; box-shadow: none; }
.lt-menu > nav a[aria-current="page"] { color: var(--amber-400); }
.lt-menu > nav a[aria-current="page"] span { border-bottom: 2px solid var(--amber-400); }
.lt-menu > nav a.lt-menu-cta { justify-content: center; margin: 8px 20px 0; background: var(--amber-500); color: var(--text-on-accent); border-radius: var(--r-md); font-weight: 600; }
.lt-menu > nav a.lt-menu-cta:hover { background: var(--amber-600); color: var(--text-on-accent); }

/* Pilot bar: static and in-flow without JS. /pilot.js lifts it out of the flow
   and shows it after the hero; the menu then opens below it (--lt-pilot-h). */
.lt-pilotbar { display: flex; align-items: center; justify-content: center; min-height: 40px; padding: 6px var(--section-x); box-sizing: border-box; background: var(--newsbar-bg); color: var(--newsbar-text); box-shadow: 0 1px 0 var(--newsbar-border); font-family: var(--font-sans); font-weight: 500; font-size: 15px; line-height: 1.4; text-align: center; text-wrap: pretty; }
.lt-pilot-js .lt-pilotbar { justify-content: space-between; }
.lt-pilot-js .lt-pilotbar > span { flex: 1; }
.lt-pilot-x:hover { background: var(--amber-tint-20); }
.lt-pilot-x { border-radius: var(--r-sm); color: var(--newsbar-text); }

.lt-pilot-js #stage[data-pending] { visibility: hidden; }
.lt-wide-only { display: inline; }
@media (max-width: 639px) { .lt-wide-only { display: none; } }

.lt-foot { background: var(--navy-800); color: var(--chalk-50); }
.lt-foot-in { max-width: var(--measure); margin: 0 auto; padding: 16px var(--section-x) 24px; box-sizing: border-box; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 28px; }
.lt-foot nav { display: flex; flex-wrap: wrap; gap: 0 16px; font-size: var(--fs-body-sm); }
.lt-foot nav a { display: inline-flex; align-items: center; min-height: 32px; color: var(--chalk-50); text-decoration: none; }
.lt-foot nav a:hover { color: var(--amber-400); }
@media (pointer: coarse) { .lt-foot nav a { min-height: 44px; } }
.lt-foot-fine { flex-basis: 100%; display: flex; flex-direction: column; gap: 2px; font-family: var(--font-sans); font-size: var(--fs-mono); line-height: 1.6; color: var(--chalk-400); }
.lt-foot-band { width: min(calc(100% - 2 * var(--section-x)), calc(var(--measure) - 56px)); margin: 0 auto; padding: 64px 0 48px; box-sizing: border-box; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid rgba(247, 248, 249, .10); }
.lt-foot-band h2 { margin: 0; font-family: var(--font-display); font-size: 34px; font-weight: 600; letter-spacing: -.02em; line-height: 1.08; color: var(--chalk-50); }
.lt-foot-cta { display: inline-flex; align-items: center; height: 48px; padding: 0 24px; background: var(--amber-500); color: var(--text-on-accent); border-radius: var(--r-md); font-size: 17px; font-weight: 600; text-decoration: none; }
.lt-foot-cta:hover { background: var(--amber-600); color: var(--text-on-accent); }

@media print { .lt-hdr, .lt-foot, [data-pilot] { display: none !important; } }

/* ---- hover / focus states carried over from the design (its hover and focus attributes) */
.lt-fv-7ea429:focus-visible{outline:2px solid var(--amber-400) !important;outline-offset:2px !important}
.lt-hv-b0461e:hover{background:var(--navy-800) !important;color:var(--chalk-50) !important}
.lt-hv-c48bb8:hover{background:var(--amber-600) !important;color:var(--text-on-accent) !important}

/* Demo chapter tabs + Pause: below 400px Pause drops to its own row under the tabs. */
@media (max-width: 399px) {
  .lt-tabrow { flex-wrap: wrap; }
  .lt-tabrow > [role="tablist"] { flex: 1 1 100% !important; }
}

/* ---- Home demo: readable AND fits, below 640px only (layout only; DESIGN_DEMOFIT_REWORK_SPEC_2026-10-02)
   Phone = 9:14 with the keyboard rows hidden (text field stays). Type is 4.2cqw, so a 9px bubble needs a
   phone >= 215px wide; the phone is capped at 260px (11px type) so the stage keeps its composition.
   The figure's non-phone parts are budgeted at 255px: caption bar 104 + controls 146 (14+16 padding, tabs 44,
   16 gap, Pause 44, 12 gap) + 5 slack. The 3-line step text is OUTSIDE the fit budget (may sit at or just below
   the fold). Pause stays on its own row: at 360 a tab row with Pause leaves ~60px per tab, and the "Customer"
   label (dot + 8 gap + 14px text, ~80px) would not stay on one line.
   Stable pilot allowance (--lt-pilot-allow), not the live bar, so nothing reflows when the bar appears:
   bar = 12 padding + lines x 21; <= 429px wide 3 lines = 75, 430-639 2 lines = 54.
   Phone box B = min(cap 452, max(floor 382, 100svh - header - allowance - 255)); box = 1 border + 34 label
   strip + phone area + 12 bottom pad, so phone area = B - 47 and phone width = area x 9/14:
     cap   452 = 260 x 14/9 + 47 (phone 260px)     floor 382 = 215 x 14/9 + 47 (phone 215px)
     390x844: 458 -> 452 (260px) | 360x780: 394 (223px) | 375x667: 281 -> floor 382 (215px, runs past the fold)
   Still / reduced motion: the three phones stack, each --lt-still-w wide (<= 240px), exempt from the fit rule. */
@media (max-width: 639px) {
  .lt-ph { aspect-ratio: 9 / 14 !important; }
  .lt-kb { display: none !important; }
  /* customer phone: the invoice page is anchored to the BOTTOM of the viewer so Total due never clips;
     the letterhead is what crops if the page is taller than the viewer */
  .lt-inv { align-self: flex-end !important; margin-top: 0 !important; }
  :root { --lt-pilot-allow: 54px; --lt-box-floor: 382px; --lt-box-cap: 452px; --lt-budget: 255px;
    --lt-still-w: min(240px, calc(100vw - 2 * var(--section-x) - 2 * clamp(12px, 3vw, 32px)));
    --lt-still-h: calc(var(--lt-still-w) * 14 / 9); }
  #lt-stagebox { max-height: min(var(--lt-box-cap), max(var(--lt-box-floor), calc(100vh - var(--lt-hdr-h) - var(--lt-pilot-allow) - var(--lt-budget)))); }
  @supports (height: 100svh) {
    #lt-stagebox { max-height: min(var(--lt-box-cap), max(var(--lt-box-floor), calc(100svh - var(--lt-hdr-h) - var(--lt-pilot-allow) - var(--lt-budget)))); }
  }
  /* step text always reserves 3 lines so the figure height does not change between steps */
  #lt-r3 figcaption { min-height: 4.35em !important; }
  /* still / reduced motion: three phones stacked (box = 1 border + 34 strip + 3 phones + 2 gaps + bottom pad) */
  #lt-stagebox[data-still] { aspect-ratio: auto !important; max-height: none;
    height: calc(35px + 3 * var(--lt-still-h) + 2 * clamp(12px, 2.4vw, 28px) + clamp(12px, 2.5vw, 28px)); }
  #lt-stagebox[data-still] [data-stills] { grid-template-columns: minmax(0, 1fr) !important; grid-template-rows: repeat(3, minmax(0, 1fr)) !important; }
}
@media (max-width: 429px) { :root { --lt-pilot-allow: 75px; } }