@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

/* ============================================================
   TRADESPLAIN · Dark data-terminal theme
   Single brand hue: terminal amber. All colors are tokens.
   ============================================================ */

:root {
  /* core semantic tokens (dark) */
  --ts-background: #0B0D11;
  --ts-foreground: #E9ECF1;
  --ts-card: #10141B;
  --ts-card-foreground: #E9ECF1;
  --ts-popover: #151A24;
  --ts-popover-foreground: #E9ECF1;
  --ts-primary: #F0A63F;
  --ts-primary-foreground: #17110A;
  --ts-muted: #1A202B;
  --ts-muted-foreground: #9AA3B2;
  --ts-border: #232B39;
  --ts-input: #1A202B;
  --ts-ring: #F0A63F;

  /* extended neutrals */
  --ts-surface-2: #202836;
  --ts-ink-2: #A9B2C1;
  --ts-ink-3: #7E8798;
  --ts-line-strong: #2D3648;

  /* single-hue data steps derived from primary */
  --ts-primary-dim: #C9882F;
  --ts-primary-faint: rgba(240, 166, 63, 0.10);
  --ts-primary-line: rgba(240, 166, 63, 0.38);

  /* status colors — real status only */
  --ts-state-success: #3FB98C;
  --ts-state-error: #E0604D;

  /* radius scale */
  --ts-radius-sm: 4px;
  --ts-radius-md: 8px;
  --ts-radius-lg: 14px;

  /* typography */
  --ts-font-sans: 'Space Grotesk', 'Inter', 'Segoe UI', system-ui, sans-serif;
  --ts-font-mono: 'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;

  /* motion */
  --ts-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ts-ease-inout: cubic-bezier(0.3, 0, 0, 1);
}

/* base typography wiring (plain CSS, Tailwind-independent) */
body {
  font-family: var(--ts-font-sans);
  background-color: var(--ts-background);
  color: var(--ts-foreground);
  -webkit-font-smoothing: antialiased;
}

.ts-mono { font-family: var(--ts-font-mono); }
.ts-tabular { font-variant-numeric: tabular-nums; }
.ts-eyebrow {
  font-family: var(--ts-font-mono);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ts-primary);
}
.ts-focus:focus-visible {
  outline: 2px solid var(--ts-ring);
  outline-offset: 2px;
}

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

    

  body { background-color: var(--ts-background); color: var(--ts-foreground); }
  .min-h-screen { min-height: 100vh; }
  .font-sans { font-family: var(--ts-font-sans); }
  .antialiased { -webkit-font-smoothing: antialiased; }
  td { overflow-wrap: break-word; word-break: break-all; word-break: auto-phrase; }
  th { white-space: nowrap; overflow-wrap: break-word; }


      .no-scrollbar::-webkit-scrollbar { display: none; }
      .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
      [data-icon] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        -webkit-mask-size: contain;
        mask-size: contain;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-position: center;
        mask-position: center;
        background-color: currentColor;
      }
    

      /* ========= TRADESPLAIN · static layout core (Tailwind-independent) ========= */
      *, *::before, *::after { box-sizing: border-box; }
      html { -webkit-text-size-adjust: 100%; }
      body { margin: 0; }
      .ts-container { width: 100%; max-width: 1200px; margin-inline: auto; padding-inline: 24px; }

      /* ---- A. market ticker ---- */
      .ts-ticker { border-bottom: 1px solid var(--ts-border); }
      .ts-source-strip { border-bottom: 1px solid var(--ts-border); background: var(--ts-card); }
      .ts-ticker-row { display: flex; align-items: center; gap: 24px; height: 36px; }
      .ts-source-strip-copy { margin: 0; min-width: 0; font-family: var(--ts-font-mono); font-size: 11px; line-height: 1.45; color: var(--ts-ink-2); }
      .ts-ticker-label { flex: 0 0 auto; font-family: var(--ts-font-mono); font-size: 11px; letter-spacing: 0.06em; color: var(--ts-ink-3); white-space: nowrap; }
      .ts-ticker-view { flex: 1 1 auto; min-width: 0; overflow: hidden; }
      .ts-ticker-track { display: inline-flex; white-space: nowrap; }
      .ts-ticker-group { display: inline-flex; align-items: center; gap: 48px; padding-right: 48px; }
      .ts-tk { display: inline-flex; align-items: baseline; gap: 8px; font-family: var(--ts-font-mono); font-size: 12px; white-space: nowrap; }
      .ts-tk-label { color: var(--ts-ink-3); letter-spacing: 0.04em; }
      .ts-tk-val { color: var(--ts-foreground); }
      .ts-tk-up { color: var(--ts-state-success); }
      .ts-tk-down { color: var(--ts-state-error); }

      /* ---- B. header nav ---- */
      .ts-head { position: sticky; top: 0; z-index: 40; background: var(--ts-background); border-bottom: 1px solid var(--ts-border); }
      .ts-nav { display: flex; align-items: center; gap: 36px; min-height: 64px; }
      .ts-brand { display: inline-flex; align-items: center; gap: 10px; font-family: var(--ts-font-mono); font-weight: 600; font-size: 15px; letter-spacing: 0.08em; color: var(--ts-foreground); text-decoration: none; }
      .ts-brand-mark { width: 10px; height: 10px; background: var(--ts-primary); flex: 0 0 auto; }
      .ts-nav-links { display: flex; align-items: center; gap: 26px; flex-wrap: wrap; }
      .ts-nav-link { font-size: 14px; color: var(--ts-ink-2); text-decoration: none; padding: 2px 1px; transition: color 140ms var(--ts-ease); }
      .ts-nav-cta { margin-left: auto; }

      /* buttons */
      .ts-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 20px; border-radius: var(--ts-radius-md); font-size: 14px; font-weight: 500; line-height: 1.2; text-decoration: none; cursor: pointer; transition: background-color 140ms var(--ts-ease), color 140ms var(--ts-ease), border-color 140ms var(--ts-ease), transform 140ms var(--ts-ease); }
      .ts-btn-primary { background: var(--ts-primary); color: var(--ts-primary-foreground); font-weight: 600; border: 1px solid var(--ts-primary); }
      .ts-btn-primary:hover { background: color-mix(in srgb, var(--ts-primary) 86%, var(--ts-foreground)); border-color: color-mix(in srgb, var(--ts-primary) 86%, var(--ts-foreground)); transform: translateY(-1px); }
      .ts-btn-ghost { background: transparent; color: var(--ts-foreground); border: 1px solid var(--ts-border); }
      .ts-btn-ghost:hover { border-color: var(--ts-line-strong); background: var(--ts-card); transform: translateY(-1px); }

      /* focus policy */
      a[href]:focus-visible, button:focus-visible, input:focus-visible, [tabindex]:focus-visible { outline: 2px solid var(--ts-ring); outline-offset: 2px; }
      .ts-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; }
      .ts-skip-link:focus { position: fixed; z-index: 100; top: 10px; left: 10px; width: auto; height: auto; margin: 0; padding: 10px 14px; overflow: visible; clip: auto; background: var(--ts-primary); color: var(--ts-primary-foreground); font-family: var(--ts-font-mono); }

      .ts-hero-copy .ts-eyebrow, .ts-ledger-band .ts-eyebrow { margin: 0; }

      /* ---- C. hero ---- */
      .ts-hero { padding: 120px 0 112px; scroll-margin-top: 72px; }
      .ts-hero-grid { display: grid; grid-template-columns: minmax(0,7fr) minmax(0,5fr); gap: 64px; align-items: center; }
      .ts-h1 { margin: 22px 0 0; font-size: clamp(44px, 6vw, 84px); font-weight: 600; letter-spacing: -0.03em; line-height: 1.02; text-wrap: balance; color: var(--ts-foreground); }
      .ts-hero-body { margin: 26px 0 0; font-size: 18px; line-height: 1.6; color: var(--ts-ink-2); max-width: 54ch; }
      .ts-hero-cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
      .ts-hero-meta { margin: 22px 0 0; font-family: var(--ts-font-mono); font-size: 11px; letter-spacing: 0.1em; color: var(--ts-ink-3); }

      /* landed-cost terminal panel */
      .ts-panel { background: var(--ts-card); border: 1px solid var(--ts-border); border-radius: var(--ts-radius-lg); padding: 26px 26px 24px; min-width: 0; }
      .ts-panel-head { display: flex; justify-content: space-between; gap: 16px; font-family: var(--ts-font-mono); font-size: 11px; letter-spacing: 0.08em; color: var(--ts-ink-3); padding-bottom: 14px; border-bottom: 1px solid var(--ts-border); }
      .ts-lc-row { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--ts-border); }
      .ts-lc-row:last-of-type { border-bottom: none; }
      .ts-lc-label { font-size: 13px; color: var(--ts-ink-2); min-width: 0; }
      .ts-lc-val { font-family: var(--ts-font-mono); font-size: 14px; color: var(--ts-foreground); white-space: nowrap; }
      .ts-lc-total { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; padding: 18px 0 18px; border-top: 1px solid var(--ts-line-strong); }
      .ts-lc-total-label { font-family: var(--ts-font-mono); font-size: 11px; letter-spacing: 0.12em; color: var(--ts-ink-3); padding-bottom: 4px; }
      .ts-lc-total-val { font-family: var(--ts-font-mono); font-size: clamp(34px, 3.6vw, 42px); font-weight: 600; color: var(--ts-primary); line-height: 1; }
      .ts-bar { display: flex; height: 8px; overflow: hidden; border-radius: var(--ts-radius-sm); }
      .ts-bar-seg-base { background: var(--ts-surface-2); flex: 0 0 64%; }
      .ts-bar-seg-add { background: var(--ts-primary); flex: 1 1 auto; }
      .ts-bar-labels { display: flex; justify-content: space-between; gap: 12px; margin-top: 10px; font-family: var(--ts-font-mono); font-size: 11px; }
      .ts-bar-l { color: var(--ts-ink-3); letter-spacing: 0.04em; }
      .ts-bar-r { color: var(--ts-primary); letter-spacing: 0.04em; white-space: nowrap; }

      /* ---- section shell ---- */
      .ts-section { border-top: 1px solid var(--ts-border); padding: 104px 0; scroll-margin-top: 80px; }
      .ts-sec-head { display: flex; justify-content: space-between; align-items: baseline; gap: 20px; flex-wrap: wrap; }
      .ts-sec-head p { margin: 0; }
      .ts-sec-note { font-family: var(--ts-font-mono); font-size: 11px; letter-spacing: 0.08em; color: var(--ts-ink-3); text-align: right; }
      .ts-h2 { margin: 16px 0 0; font-size: clamp(28px, 3vw, 40px); font-weight: 600; letter-spacing: -0.02em; line-height: 1.12; color: var(--ts-foreground); }
      .ts-sub { margin: 14px 0 0; font-size: 15.5px; line-height: 1.6; color: var(--ts-ink-2); max-width: 60ch; }
      .ts-sec-body { margin-top: 44px; }

      /* ---- D. toolbox ledger ---- */
      .ts-ledger { border-top: 1px solid var(--ts-border); }
      .ts-ledger-row { display: grid; grid-template-columns: 88px minmax(0,1fr) auto auto; grid-template-areas: "code body status act"; gap: 8px 24px; align-items: center; padding: 20px 12px; border-bottom: 1px solid var(--ts-border); text-decoration: none; transition: background-color 140ms var(--ts-ease); }
      .ts-ledger-row:hover { background: var(--ts-surface-2); }
      .ts-lr-code { grid-area: code; font-family: var(--ts-font-mono); font-size: 12px; color: var(--ts-ink-3); letter-spacing: 0.03em; white-space: nowrap; }
      .ts-lr-body { grid-area: body; min-width: 0; display: block; }
      .ts-lr-title { display: block; font-size: 16px; font-weight: 600; color: var(--ts-foreground); margin: 0 0 4px; transition: color 140ms var(--ts-ease); }
      .ts-ledger-row:hover .ts-lr-title { color: var(--ts-primary); }
      .ts-lr-desc { display: block; font-size: 13.5px; line-height: 1.55; color: var(--ts-ink-2); }
      .ts-lr-status { grid-area: status; justify-self: end; white-space: nowrap; }
      .ts-lr-act { grid-area: act; display: inline-flex; align-items: center; gap: 6px; font-family: var(--ts-font-mono); font-size: 11px; letter-spacing: 0.1em; color: var(--ts-ink-3); white-space: nowrap; justify-self: end; transition: color 140ms var(--ts-ease); }
      .ts-ledger-row:hover .ts-lr-act { color: var(--ts-primary); }
      .ts-arrow { display: inline-block; transition: transform 140ms var(--ts-ease), color 140ms var(--ts-ease); }
      .ts-ledger-row:hover .ts-arrow, .ts-country:hover .ts-arrow { transform: translateX(4px); color: var(--ts-primary); }
      .ts-pill-live { display: inline-flex; align-items: center; gap: 6px; font-family: var(--ts-font-mono); font-size: 10px; font-weight: 500; letter-spacing: 0.12em; color: var(--ts-state-success); background: color-mix(in srgb, var(--ts-state-success) 12%, transparent); border: 1px solid color-mix(in srgb, var(--ts-state-success) 32%, transparent); border-radius: var(--ts-radius-sm); padding: 4px 8px; }
      .ts-pill-live::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--ts-state-success); }
      .ts-queued { font-family: var(--ts-font-mono); font-size: 10px; letter-spacing: 0.12em; color: var(--ts-ink-3); }
      .ts-ledger-note { margin: 16px 0 0; font-family: var(--ts-font-mono); font-size: 11px; letter-spacing: 0.06em; color: var(--ts-ink-3); }

      /* ---- E. promises ---- */
      .ts-promises { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); }
      .ts-promise { padding: 0 30px; min-width: 0; }
      .ts-promise:first-child { padding-left: 0; }
      .ts-promise + .ts-promise { border-left: 1px solid var(--ts-border); }
      .ts-promise-code { margin: 0; font-family: var(--ts-font-mono); font-size: 12px; letter-spacing: 0.1em; color: var(--ts-primary); }
      .ts-promise-title { margin: 12px 0 0; font-size: 19px; font-weight: 600; color: var(--ts-foreground); }
      .ts-promise-body { margin: 12px 0 0; font-size: 14px; line-height: 1.65; color: var(--ts-ink-2); }
      .ts-rubric { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 24px; margin-top: 64px; padding-top: 36px; border-top: 1px solid var(--ts-border); }
      .ts-rubric-label { display: flex; justify-content: space-between; gap: 12px; font-family: var(--ts-font-mono); font-size: 11px; letter-spacing: 0.05em; color: var(--ts-ink-3); }
      .ts-rubric-w { color: var(--ts-foreground); font-weight: 500; }
      .ts-rubric-track { height: 4px; background: var(--ts-surface-2); border-radius: var(--ts-radius-sm); margin-top: 10px; overflow: hidden; }
      .ts-rubric-fill { height: 100%; background: var(--ts-primary); border-radius: var(--ts-radius-sm); }

      /* ---- F. guides ---- */
      .ts-guides { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); column-gap: 64px; }
      .ts-guide { border-top: 1px solid var(--ts-border); padding: 20px 0 26px; min-width: 0; }
      .ts-guide-meta { display: flex; justify-content: space-between; gap: 16px; font-family: var(--ts-font-mono); font-size: 11px; letter-spacing: 0.08em; color: var(--ts-ink-3); }
      .ts-guide-title { display: block; margin: 12px 0 0; font-size: 18px; font-weight: 600; line-height: 1.3; color: var(--ts-foreground); text-decoration: none; transition: color 140ms var(--ts-ease); }
      .ts-guide-title:hover { color: var(--ts-primary); }
      .ts-guide-desc { margin: 8px 0 0; font-size: 14px; line-height: 1.6; color: var(--ts-ink-2); }

      /* ---- F2. related guides mesh block (bottom of country guides) ---- */
      .ts-related { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; margin: 56px 0 24px; padding: 28px 24px; border-top: 1px solid var(--ts-border); border-bottom: 1px solid var(--ts-border); background: var(--ts-surface-2); border-radius: var(--ts-radius); }
      .ts-related-col h2 { font-family: var(--ts-font-mono); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ts-primary); margin: 0 0 14px; font-weight: 600; }
      .ts-related-col ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
      .ts-related-col a { display: inline-block; font-size: 14px; line-height: 1.4; color: var(--ts-foreground); text-decoration: none; padding: 4px 0; border-bottom: 1px dashed transparent; transition: color 140ms var(--ts-ease), border-color 140ms var(--ts-ease); }
      .ts-related-col a:hover { color: var(--ts-primary); border-bottom-color: var(--ts-primary); }
      @media (max-width: 720px) { .ts-related { grid-template-columns: 1fr; gap: 24px; } }

      /* ---- G. countries terminal table ---- */
      .ts-ctable { border-top: 1px solid var(--ts-border); }
      .ts-country { display: grid; grid-template-columns: 64px minmax(0,1fr) minmax(0,1.2fr) 32px; grid-template-areas: "code name req act"; gap: 8px 24px; align-items: center; padding: 18px 12px; border-bottom: 1px solid var(--ts-border); text-decoration: none; transition: background-color 140ms var(--ts-ease); }
      .ts-country:hover { background: var(--ts-surface-2); }
      .ts-ct-code { grid-area: code; font-family: var(--ts-font-mono); font-size: 20px; font-weight: 600; letter-spacing: 0.02em; color: var(--ts-primary); }
      .ts-ct-name { grid-area: name; font-size: 16px; font-weight: 600; color: var(--ts-foreground); }
      .ts-ct-req { grid-area: req; font-size: 14px; color: var(--ts-ink-2); min-width: 0; }
      .ts-ct-act { grid-area: act; justify-self: end; color: var(--ts-ink-3); }

      /* ---- H. about ---- */
      .ts-about-grid { display: grid; grid-template-columns: minmax(0,6fr) minmax(0,5fr); gap: 72px; align-items: start; }
      .ts-about-body { margin: 0; font-size: 16.5px; line-height: 1.7; color: var(--ts-ink-2); }
      .ts-about-list { list-style: none; margin: 36px 0 0; padding: 0; border-top: 1px solid var(--ts-border); }
      .ts-about-li { display: flex; align-items: flex-start; gap: 12px; padding: 16px 0; border-bottom: 1px solid var(--ts-border); font-size: 14px; line-height: 1.55; color: var(--ts-ink-2); }
      .ts-about-li svg { flex: 0 0 auto; width: 16px; height: 16px; margin-top: 2px; color: var(--ts-primary); }
      .ts-flog-head { display: flex; justify-content: space-between; gap: 16px; font-family: var(--ts-font-mono); font-size: 11px; letter-spacing: 0.08em; color: var(--ts-ink-3); padding-bottom: 14px; border-bottom: 1px solid var(--ts-border); }
      .ts-flog-live { color: var(--ts-state-success); }
      .ts-flog-item { padding: 14px 0; border-bottom: 1px solid var(--ts-border); }
      .ts-flog-item:last-child { border-bottom: none; }
      .ts-flog-meta { display: flex; justify-content: space-between; gap: 12px; font-family: var(--ts-font-mono); font-size: 12px; }
      .ts-flog-date { color: var(--ts-ink-3); }
      .ts-flog-city { color: var(--ts-primary); letter-spacing: 0.05em; }
      .ts-flog-note { margin: 6px 0 0; font-size: 13px; line-height: 1.55; color: var(--ts-ink-2); }

      /* ---- I. newsletter band ---- */
      .ts-ledger-band { background: var(--ts-card); border-top: 1px solid var(--ts-border); border-bottom: 1px solid var(--ts-border); padding: 80px 0; scroll-margin-top: 80px; }
      .ts-nl-form { display: flex; gap: 12px; max-width: 520px; margin-top: 34px; }
      .ts-nl-input { flex: 1 1 auto; min-width: 0; width: 100%; height: 48px; padding: 0 16px; background: var(--ts-input); border: 1px solid var(--ts-border); border-radius: var(--ts-radius-md); color: var(--ts-foreground); font-family: var(--ts-font-mono); font-size: 14px; transition: border-color 140ms var(--ts-ease); }
      .ts-nl-input::placeholder { color: var(--ts-ink-3); }
      .ts-nl-input:hover { border-color: var(--ts-line-strong); }
      .ts-nl-input:focus { outline: 2px solid var(--ts-ring); outline-offset: 1px; border-color: var(--ts-line-strong); }
      .ts-nl-small { margin: 18px 0 0; font-family: var(--ts-font-mono); font-size: 11px; letter-spacing: 0.08em; color: var(--ts-ink-3); }
      .ts-form-success { margin: 34px 0 0; font-family: var(--ts-font-mono); font-size: 13px; letter-spacing: 0.06em; color: var(--ts-state-success); }

      /* ---- J. footer ---- */
      .ts-footer { padding: 72px 0 0; }
      .ts-foot-grid { display: grid; grid-template-columns: 2.2fr 1fr 1fr 1.2fr; gap: 40px; }
      .ts-foot-brand .ts-brand { font-size: 14px; }
      .ts-foot-tag { margin: 14px 0 0; font-size: 13px; line-height: 1.6; color: var(--ts-ink-3); max-width: 30ch; }
      .ts-foot-h { margin: 4px 0 16px; font-family: var(--ts-font-mono); font-size: 11px; letter-spacing: 0.14em; color: var(--ts-ink-3); }
      .ts-foot-links { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
      .ts-foot-link { font-size: 13px; color: var(--ts-ink-2); text-decoration: none; transition: color 140ms var(--ts-ease); }
      .ts-foot-link:hover { color: var(--ts-foreground); }
      .ts-foot-loc { margin: 0; display: grid; gap: 8px; font-family: var(--ts-font-mono); font-size: 13px; color: var(--ts-ink-2); }
      .ts-foot-bar { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 64px; padding: 20px 0 28px; border-top: 1px solid var(--ts-border); font-family: var(--ts-font-mono); font-size: 11px; letter-spacing: 0.06em; color: var(--ts-ink-3); }

      /* ---- responsive ---- */
      @media (max-width: 960px) {
        .ts-hero { padding: 88px 0; }
        .ts-hero-grid { grid-template-columns: minmax(0,1fr); gap: 56px; }
        .ts-section { padding: 84px 0; }
        .ts-about-grid { grid-template-columns: minmax(0,1fr); gap: 56px; }
      }
      @media (max-width: 900px) {
        .ts-guides { grid-template-columns: minmax(0,1fr); }
        .ts-promises { grid-template-columns: minmax(0,1fr); }
        .ts-promise { padding: 28px 0; }
        .ts-promise:first-child { padding-top: 0; }
        .ts-promise + .ts-promise { border-left: none; border-top: 1px solid var(--ts-border); }
        .ts-rubric { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 28px 24px; margin-top: 48px; }
        .ts-foot-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
      }
      @media (max-width: 880px) {
        .ts-nav { flex-wrap: wrap; padding: 12px 0; gap: 14px; }
        .ts-nav-links { order: 3; width: 100%; gap: 20px; padding: 8px 0 2px; }
        .ts-nav-cta { margin-left: auto; }
      }
      @media (max-width: 719px) {
        .ts-ticker-row { gap: 0; }
        .ts-source-strip .ts-ticker-row { height: auto; min-height: 44px; padding-block: 8px; }
        .ts-source-strip .ts-ticker-label { display: none; }
        .ts-ledger-row { grid-template-columns: minmax(0,1fr) auto; grid-template-areas: "code status" "body body" "act act"; row-gap: 10px; padding: 18px 4px; }
        .ts-lr-act { justify-self: start; }
        .ts-country { grid-template-columns: 48px minmax(0,1fr) 24px; grid-template-areas: "code name act" "code req act"; padding: 16px 4px; }
        .ts-ct-req { font-size: 13px; }
        .ts-nl-form { flex-direction: column; }
        .ts-ts-nl-input { width: 100%; }
        .ts-nl-input { width: 100%; }
        .ts-foot-bar { flex-direction: column; gap: 6px; margin-top: 48px; }
        .ts-ledger-band { padding: 64px 0; }
      }
      @media (max-width: 600px) {
        .ts-container { padding-inline: 20px; }
        .ts-rubric { grid-template-columns: minmax(0,1fr); }
        .ts-foot-grid { grid-template-columns: minmax(0,1fr); gap: 32px; }
        .ts-hero-cta .ts-btn { flex: 1 1 auto; }
      }
    

      /* ---- motion: marquee, cursor blink, scroll reveal ---- */
      .ts-ticker-track { animation: ts-marquee 42s linear infinite; will-change: transform; }
      .ts-ticker-view:hover .ts-ticker-track, .ts-ticker-view:focus-within .ts-ticker-track { animation-play-state: paused; }
      @keyframes ts-marquee { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(-50%, 0, 0); } }

      .ts-cursor { color: var(--ts-primary); animation: ts-blink 1.1s steps(1, end) infinite; }
      @keyframes ts-blink { 0%, 55% { opacity: 1; } 56%, 100% { opacity: 0; } }

      .ts-rv-pre { opacity: 0; }
      .ts-rv-pre.ts-rv-in { animation: ts-rise 480ms var(--ts-ease-inout) var(--rvd, 0ms) both; }
      @keyframes ts-rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }

      @media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
      ::selection { background: var(--ts-primary); color: var(--ts-primary-foreground); }
    

/* ---- shared: neutralize generatepress chrome on WP pages ---- */
#masthead,#colophon,.site-header,.site-footer,.inside-header,.inside-footer,.main-navigation{display:none!important}
body.wp-singular,.site,#page,.site-content,#content,article,.inside-article{background:var(--ts-background)!important;color:var(--ts-foreground)!important}
.entry-header,.entry-title,.entry-meta{display:none!important}
.entry-content,.site-main,.content-area,.inside-article{margin:0!important;padding:0!important;max-width:none!important}
.grid-container{max-width:none!important;padding-left:0!important;padding-right:0!important}
body.wp-singular main{display:block}

/* ---- WordPress layout reset: one full-width TradeSplain shell ---- */
body.wp-singular .site-content,
body.page .site-content,
body.error404 .site-content{display:block!important;width:100%!important}
#primary,.content-area{float:none!important;width:100%!important;max-width:none!important}
#right-sidebar,.widget-area,.sidebar{display:none!important;width:0!important}
.site.grid-container,.site-content.grid-container{max-width:none!important;width:100%!important}
.entry-content{width:100%!important;overflow:clip}

/* ---- shared trust strip and page shell ---- */
.ts-page-main{min-height:55vh}
.ts-breadcrumbs{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 28px;font-family:var(--ts-font-mono);font-size:11px;letter-spacing:.06em;color:var(--ts-ink-3)}
.ts-breadcrumbs a{color:var(--ts-ink-2);text-decoration:none}
.ts-breadcrumbs a:hover{color:var(--ts-primary)}
.ts-policy{max-width:760px;margin:0 auto;padding:72px 24px 96px}
.ts-policy h1{margin:14px 0 22px;font-size:clamp(34px,5vw,58px);line-height:1.05;letter-spacing:-.03em;color:var(--ts-foreground)}
.ts-policy h2{margin:42px 0 12px;font-size:24px;color:var(--ts-foreground)}
.ts-policy p,.ts-policy li{font-size:16px;line-height:1.75;color:var(--ts-ink-2)}
.ts-policy a{color:var(--ts-primary)}
.ts-policy-card{margin-top:28px;padding:22px;border:1px solid var(--ts-border);background:var(--ts-card)}

/* ---- landed cost calculator ---- */
#calculator{padding:64px 0 32px}
#calculator .ts-container{max-width:1200px}
.panel-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;margin-top:36px;align-items:start}
.panel{min-width:0;background:var(--ts-card);border:1px solid var(--ts-line-strong);padding:26px}
.panel h2{display:flex;justify-content:space-between;gap:16px;margin:0 0 22px;font-family:var(--ts-font-mono);font-size:12px;line-height:1.5;letter-spacing:.1em;color:var(--ts-foreground)}
.fset-title{margin:24px 0 14px;padding-bottom:7px;border-bottom:1px solid var(--ts-border);font-family:var(--ts-font-mono);font-size:11px;letter-spacing:.1em;color:var(--ts-primary)}
.row{display:grid;grid-template-columns:minmax(0,1fr) 170px;gap:16px;align-items:center;margin:0 0 13px}
.row label{font-size:14px;line-height:1.35;color:var(--ts-foreground)}
.row label small{display:block;margin-top:3px;font-family:var(--ts-font-mono);font-size:10px;line-height:1.35;color:var(--ts-ink-3)}
#calculator input[type=number],#calculator select{width:100%;min-height:44px;padding:9px 11px;border:1px solid var(--ts-line-strong);border-radius:var(--ts-radius-sm);background:var(--ts-input);color:var(--ts-foreground);font-family:var(--ts-font-mono);font-size:14px}
#calculator input:focus-visible,#calculator select:focus-visible{outline:2px solid var(--ts-ring);outline-offset:2px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 18px}
.chip{min-height:40px;padding:8px 11px;border:1px solid var(--ts-line-strong);border-radius:var(--ts-radius-sm);background:var(--ts-card);color:var(--ts-ink-2);font-family:var(--ts-font-mono);font-size:10px;line-height:1.3;cursor:pointer}
.chip:hover,.chip:focus-visible{border-color:var(--ts-primary);color:var(--ts-primary)}
.chip.on{background:var(--ts-primary);border-color:var(--ts-primary);color:var(--ts-primary-foreground)}
.toggle{display:flex;align-items:center;gap:10px;color:var(--ts-ink-2);font-size:13px}
.toggle input{width:18px;height:18px;accent-color:var(--ts-primary)}
.result{position:sticky;top:88px}
.total-block{padding:24px;border:1px solid var(--ts-primary-line);background:var(--ts-primary-faint)}
.total-block .big{display:block;font-family:var(--ts-font-mono);font-size:clamp(38px,6vw,62px);font-weight:600;line-height:1;color:var(--ts-primary)}
.total-block .per{margin-top:10px;font-family:var(--ts-font-mono);font-size:11px;line-height:1.6;color:var(--ts-ink-2)}
.breakdown{margin-top:22px;border-top:1px solid var(--ts-border)}
.sum-line{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;padding:13px 0;border-bottom:1px solid var(--ts-border);font-size:13px;color:var(--ts-ink-2)}
.sum-line b{font-family:var(--ts-font-mono);color:var(--ts-foreground)}
.bar{grid-column:1/-1;height:4px;background:var(--ts-surface-2);overflow:hidden}
.bar span{display:block;height:100%;background:var(--ts-primary)}
.btn-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.btn-row .btn{min-height:44px;padding:10px 14px;border:1px solid var(--ts-line-strong);border-radius:var(--ts-radius-sm);background:var(--ts-card);color:var(--ts-foreground);font-family:var(--ts-font-mono);font-size:11px;cursor:pointer}
.btn-row .btn:hover{border-color:var(--ts-primary);color:var(--ts-primary)}
.copied{min-height:20px;margin-top:10px;font-family:var(--ts-font-mono);font-size:11px;color:var(--ts-state-success)}
.method{max-width:820px;margin:60px auto 0;color:var(--ts-ink-2)}
.method h2,.method h3{color:var(--ts-foreground)}
.method p,.method li{font-size:15px;line-height:1.75}
.method table{width:100%;border-collapse:collapse;margin:18px 0;font-size:13px}
.method th,.method td{padding:10px;border:1px solid var(--ts-border);text-align:left}
.method code{padding:2px 5px;background:var(--ts-card);color:var(--ts-primary)}
.disc,.hintbox{margin-top:22px;padding:18px;border:1px solid var(--ts-primary-line);background:var(--ts-primary-faint);font-size:13px;line-height:1.65;color:var(--ts-ink-2)}
.ts-form-error{margin:12px 0 0;font-family:var(--ts-font-mono);font-size:12px;color:var(--ts-state-error)}

@media(max-width:800px){
  .panel-wrap{grid-template-columns:minmax(0,1fr)}
  .result{position:static}
}
@media(max-width:600px){
  #calculator{padding-top:42px}
  .panel{padding:20px}
  .row{grid-template-columns:minmax(0,1fr)}
  .row input,.row select{width:100%}
  .ts-policy{padding:52px 20px 72px}
}

/* ---- subpage lead spacing ---- */
.ts-page{padding:56px 0 24px}
.ts-page .ts-sec-head{margin-bottom:10px}

/* ---- about page extras (tables, disclosure) ---- */
.ts-table{width:100%;border-collapse:collapse;font-size:14px;margin:14px 0}
.ts-table th{background:var(--ts-surface-2);text-align:left;padding:10px 12px;border:1px solid var(--ts-border);font-family:var(--ts-font-mono);font-size:11px;letter-spacing:.08em;color:var(--ts-foreground)}
.ts-table td{padding:10px 12px;border:1px solid var(--ts-border);color:var(--ts-muted-foreground);line-height:1.6;vertical-align:top}
.ts-table td b,.ts-table td strong{color:var(--ts-foreground)}
.ts-disclosure{border:1px dashed var(--ts-primary-dim);background:var(--ts-primary-faint);border-radius:var(--ts-radius-md);padding:20px 22px;font-size:14.5px;color:var(--ts-muted-foreground);line-height:1.75}
.ts-disclosure b{color:var(--ts-primary);font-family:var(--ts-font-mono);font-size:12.5px;letter-spacing:.1em}
.ts-disclosure i{font-style:normal;color:var(--ts-foreground)}
.ts-callout{background:var(--ts-surface-2);border:1px solid var(--ts-line-strong);border-radius:var(--ts-radius-md);padding:22px 24px;margin-top:24px}
.ts-callout .h{font-family:var(--ts-font-mono);font-size:11.5px;letter-spacing:.16em;color:var(--ts-primary);margin-bottom:8px;text-transform:uppercase}
.ts-checks{list-style:none}
.ts-checks li{display:flex;gap:10px;align-items:flex-start;color:var(--ts-muted-foreground);font-size:15px;line-height:1.65;margin:10px 0}
.ts-checks svg{flex:0 0 auto;width:16px;height:16px;margin-top:3px;color:var(--ts-primary)}
.ts-note{font-family:var(--ts-font-mono);font-size:11px;color:var(--ts-ink-3);margin-top:12px}