:root:root {
  --bg: #f3f7fb; --bg-tint: #e9f1f9; --surface: #ffffff; --surface-2: #f5f9fc;
  --ink: #0a1c2e; --ink-2: #33506b; --muted: #687f96; --line: #dbe5ef; --line-2: #c8d7e6;
  --cyan-ink: #0b7fb3;
  --primary: #0d3a64;
  --r-sm: 10px; --r: 16px; --r-lg: 24px; --r-pill: 999px;
  --t: .25s cubic-bezier(.22,.61,.36,1);
  --sh-1: 0 1px 2px rgba(6,24,43,.06), 0 2px 10px rgba(6,24,43,.05);
  --sh-2: 0 6px 18px rgba(6,24,43,.07), 0 18px 44px rgba(6,24,43,.08);
}
@media (prefers-color-scheme: dark) {
  :root:root:not([data-theme="light"]) {
    --bg: #061321; --bg-tint: #081a2c; --surface: #0c2034; --surface-2: #0f263d;
    --ink: #e6eef6; --ink-2: #aac0d4; --muted: #7d94aa; --line: #18324b; --line-2: #22405d;
    --cyan-ink: #5cd0fa;
    --primary: #4cb6ec;
    --sh-1: 0 1px 2px rgba(0,0,0,.35); --sh-2: 0 10px 30px rgba(0,0,0,.4);
  }
}
:root:root[data-theme="dark"] {
  --bg: #061321; --bg-tint: #081a2c; --surface: #0c2034; --surface-2: #0f263d;
  --ink: #e6eef6; --ink-2: #aac0d4; --muted: #7d94aa; --line: #18324b; --line-2: #22405d;
  --cyan-ink: #5cd0fa;
  --primary: #4cb6ec;
  --sh-1: 0 1px 2px rgba(0,0,0,.35); --sh-2: 0 10px 30px rgba(0,0,0,.4);
}

:root:root {
  --c-bg: var(--bg);
  --c-bg-2: var(--bg-tint);
  --c-surface: var(--surface);
  --c-surface-2: var(--surface-2);
  --c-ink: var(--ink);
  --c-ink-2: var(--ink-2);
  --c-muted: var(--muted);
  --c-primary: var(--primary);
  --c-primary-d: var(--navy-2);
  --c-deep: var(--navy);
  --c-accent: var(--cyan-ink);
  --c-accent-2: var(--cyan);
  --c-safe: var(--safe);
  --c-warn: var(--warning);
  --c-danger: var(--danger);
  --c-border: var(--line);
  --c-border-2: var(--line-2);
  --grad-deep:
    radial-gradient(120% 80% at 85% 0%, #0f3a66 0%, transparent 60%),
    linear-gradient(170deg, #06182b 0%, #082440 55%, #0b3157 100%);
  --grad-accent: linear-gradient(135deg, var(--cyan) 0%, var(--blue) 100%);
  --sh-3: 0 18px 48px rgba(6,24,43,.18);
  --sh-glow: 0 10px 30px rgba(34,184,242,.35);
  --font-head: var(--f-display);
  --font-body: var(--f-body);
  --max-w: var(--wrap);
  --nav-h: var(--bar-h);

  --nwi-bg: var(--bg);
  --nwi-surface: var(--surface);
  --nwi-surface-2: var(--surface-2);
  --nwi-border: var(--line);
  --nwi-border-h: color-mix(in srgb, var(--cyan) 50%, var(--line));
  --nwi-text: var(--ink);
  --nwi-muted: var(--muted);
  --nwi-accent: var(--cyan-ink);
  --nwi-accent-dim: color-mix(in srgb, var(--cyan) 12%, transparent);
  --nwi-radius: var(--r-lg);
  --nwi-radius-sm: var(--r-sm);
  --nwi-shadow: var(--sh-2);
  --nwi-font: var(--f-body);
  --nwi-mono: var(--f-mono);

  --nws-bg: var(--bg);
  --nws-surface: var(--surface);
  --nws-surface-2: var(--surface-2);
  --nws-border: var(--line);
  --nws-border-h: color-mix(in srgb, var(--cyan) 50%, var(--line));
  --nws-text: var(--ink);
  --nws-muted: var(--muted);
  --nws-accent: var(--cyan-ink);
  --nws-accent-dim: color-mix(in srgb, var(--cyan) 12%, transparent);
  --nws-success: var(--safe);
  --nws-error: var(--danger);
  --nws-radius: var(--r-lg);
  --nws-radius-sm: var(--r-sm);
  --nws-shadow: var(--sh-2);
  --nws-font: var(--f-body);
  --nws-mono: var(--f-mono);

  --bg-2: var(--bg-tint);
  --card: var(--surface);
  --card-h: var(--surface-2);
  --border: var(--line);
  --border-h: var(--line-2);
  --text: var(--ink);
  --text-2: var(--ink-2);
  --text-3: var(--muted);
  --accent: var(--blue);
  --accent-2: var(--cyan-ink);
  --green: var(--safe);
  --yellow: var(--warning);
  --red: var(--danger);
  --mono: var(--f-mono);
  --head: var(--f-display);
  --body: var(--f-body);
}

body.tni-inner {
  font-family: var(--f-body);
  background: var(--bg);
  color: var(--ink);
}
body.tni-inner .site-main { min-height: 50vh; }
body.tni-inner h1, body.tni-inner h2, body.tni-inner h3 { letter-spacing: -.02em; }
body.tni-inner ::selection { background: rgba(34,184,242,.3); }

.tcrumbs { background: var(--bg); border-bottom: 1px solid var(--line); }
.tcrumbs .nav-trail {
  border: 0; background: none; max-height: none; overflow: visible;
}
.tcrumbs .nav-trail__inner { height: auto; min-height: 48px; padding-block: 6px; }
.tcrumbs .crumbs__list { font-family: var(--f-body); font-size: .84rem; }
.tcrumbs .crumbs__item:not(:last-child)::after { border-color: var(--line-2); }
.tcrumbs .crumbs__link { color: var(--ink-2); font-weight: 500; }
.tcrumbs .crumbs__link:hover { color: var(--ink); background: var(--surface-2); }
.tcrumbs .crumbs__home-ico { color: var(--cyan-ink); }
.tcrumbs .crumbs__current {
  color: var(--ink); font-weight: 600;
  background: color-mix(in srgb, var(--cyan) 12%, transparent);
  border-color: color-mix(in srgb, var(--cyan) 30%, transparent);
}
.tcrumbs .nav-trail__hint { color: var(--muted); font-family: var(--f-mono); letter-spacing: .12em; }
.tcrumbs .trail-chip {
  color: var(--ink-2); background: var(--surface); border-color: var(--line);
  font-family: var(--f-body); font-weight: 500;
}
.tcrumbs .trail-chip:hover { color: var(--ink); border-color: var(--cyan); background: var(--surface); }
.tcrumbs .trail-chip__ico { color: var(--cyan-ink); }
@media (max-width: 720px) {
  .tcrumbs .nav-trail__side { display: none; }
}

body.tni-inner .eyebrow {
  font-family: var(--f-mono); font-size: .72rem; letter-spacing: .14em; color: var(--cyan-ink);
}
body.tni-inner .btn { border-radius: var(--r-pill); font-family: var(--f-body); font-weight: 600; }
body.tni-inner .btn-primary { background: var(--cyan); color: var(--navy); box-shadow: none; }
body.tni-inner .btn-primary:hover { background: #46c6f6; box-shadow: var(--sh-glow); }
body.tni-inner .section-head h2,
body.tni-inner .section-head h1 { font-family: var(--f-display); letter-spacing: -.025em; }
body.tni-inner .fade-in { transition-timing-function: cubic-bezier(.22,.61,.36,1); }

body.tni-inner .content-ad-wrap::before { font-family: var(--f-mono); letter-spacing: .18em; }

body.tni-p-posts .site-main {
  color-scheme: dark;
  --bg: #061321; --bg-tint: #081a2c; --surface: #0c2034; --surface-2: #0f263d;
  --ink: #e6eef6; --ink-2: #aac0d4; --muted: #7d94aa; --line: #18324b; --line-2: #22405d;
  --cyan-ink: #5cd0fa; --primary: #4cb6ec;
  --c-bg: #061321; --c-bg-2: #081a2c; --c-surface: #0c2034; --c-surface-2: #0f263d;
  --c-ink: #e6eef6; --c-ink-2: #aac0d4; --c-muted: #7d94aa; --c-primary: #4cb6ec;
  --c-accent: #5cd0fa; --c-border: #18324b; --c-border-2: #22405d;
  --bg-2: #081a2c;
  --card: rgba(255,255,255,.05); --card-h: rgba(255,255,255,.08);
  --border: rgba(255,255,255,.10); --border-h: rgba(255,255,255,.20);
  --text: #e6eef6; --text-2: rgba(230,238,246,.68); --text-3: rgba(230,238,246,.42);
  --accent: #22b8f2; --accent-2: #5cd0fa;
  background: #061321;
  color: #e6eef6;
}
body.tni-p-posts .tcrumbs { background: #06182b; border-color: rgba(255,255,255,.08); }
body.tni-p-posts .tcrumbs .crumbs__link { color: #aac0d4; }
body.tni-p-posts .tcrumbs .crumbs__link:hover { color: #fff; background: rgba(255,255,255,.08); }
body.tni-p-posts .tcrumbs .crumbs__current { color: #fff; }
body.tni-p-posts .tcrumbs .trail-chip { background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.12); color: #cfe0ef; }
body.tni-p-posts .ftr { margin-top: 0; }

body.tni-inner .nws-title {
  color: var(--ink) !important;
  font-family: var(--f-display) !important;
  letter-spacing: -.025em;
}
body.tni-inner .nws-content,
body.tni-inner .nws-content p,
body.tni-inner .nws-content li,
body.tni-inner .nws-content td,
body.tni-inner .nws-content th,
body.tni-inner .nws-content span,
body.tni-inner .nws-content div,
body.tni-inner .nws-content em,
body.tni-inner .nws-content i { color: var(--ink-2) !important; }
body.tni-inner .nws-content h1,
body.tni-inner .nws-content h2,
body.tni-inner .nws-content h3,
body.tni-inner .nws-content h4,
body.tni-inner .nws-content strong,
body.tni-inner .nws-content b { color: var(--ink) !important; }
body.tni-inner .nws-content h2,
body.tni-inner .nws-content h3 { font-family: var(--f-display) !important; letter-spacing: -.02em; }
body.tni-inner .nws-content a:hover,
body.tni-inner .nws-breadcrumb__link:hover,
body.tni-inner .nws-social-btn:hover { color: var(--ink) !important; border-color: var(--line-2); }
body.tni-inner .nwi-hero { background: var(--grad-deep); }

body.tni-p-posts .site-main input[type="text"] {
  background: rgba(255,255,255,.06); color: #fff;
  border: 1px solid rgba(255,255,255,.22); border-radius: 12px;
}
body.tni-p-posts .site-main input[type="text"]:focus { border-color: var(--cyan); outline: none; box-shadow: 0 0 0 3px rgba(34,184,242,.25); }
