/* ============================================================
   Aethel design system - the single source of truth.
   Every legacy token name below is an alias onto this palette, so
   existing rules keep resolving while the product renders one system.
   Do not add another ":root" layer; edit these values instead.
   ============================================================ */
:root {
  color-scheme: dark;
  --tr-bg: #191c21;
  --tr-deep: #0e0f12;
  --tr-surface: #18181b;
  --tr-raised: #202329;
  --tr-line: #2a2a2e;
  --tr-ink: #ffffff;
  --tr-muted: #a1a1aa;
  --tr-accent: #a3e635;
  --tr-win: #a3e635;
  --tr-loss: #f4525f;
  --tr-warn: #facc15;
  --tr-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --tr-font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* Aliases for every token name still referenced in this file. */
  --ae-bg: #191c21;
  --ae-border: #2a2a2e;
  --ae-card: #18181b;
  --ae-control: 8px;
  --ae-lime: #a3e635;
  --ae-muted: #a1a1aa;
  --ae-radius: 16px;
  --ae-radius-card: 16px;
  --ae-radius-control: 8px;
  --ae-surface: #18181b;
  --ae-text: #ffffff;
  --bg: #191c21;
  --canvas: #191c21;
  --green: #a3e635;
  --hairline: #2a2a2e;
  --ink: #ffffff;
  --lift: #202329;
  --line: #2a2a2e;
  --lock-bg: #191c21;
  --lock-border: #2a2a2e;
  --lock-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --lock-green: #a3e635;
  --lock-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --lock-muted: #a1a1aa;
  --lock-radius-card: 16px;
  --lock-radius-control: 8px;
  --lock-text: #ffffff;
  --md-border: #2a2a2e;
  --md-card: #18181b;
  --md-control: 8px;
  --md-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --md-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --md-muted: #a1a1aa;
  --md-primary: #a3e635;
  --md-text: #ffffff;
  --muted: #a1a1aa;
  --pine: #a3e635;
  --red: #f4525f;
  --soft-shadow: 0 24px 60px rgba(0, 0, 0, .45);
  --text: #ffffff;
  --tr-ink: #ffffff;
}


* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body {
  margin: 0;
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:
    radial-gradient(circle at 12% -8%, rgba(163, 230, 53, 0.11), transparent 34rem),
    radial-gradient(circle at 84% 8%, rgba(163, 230, 53, 0.1), transparent 36rem),
    radial-gradient(circle at 55% 48%, rgba(163, 230, 53, .08), transparent 28rem),
    linear-gradient(135deg, rgba(14, 15, 18, .94), rgba(24, 24, 27, .88)),
    var(--bg);
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .22;
  background:
    linear-gradient(90deg, rgba(163, 230, 53, 0.06) 1px, transparent 1px),
    linear-gradient(0deg, rgba(163, 230, 53, .09) 1px, transparent 1px);
  background-size: 68px 68px;
  mask-image: linear-gradient(180deg, rgba(0,0,0,.9), transparent 80%);
}

a { color: inherit; text-decoration: none; }
.shell { width: min(1120px, calc(100% - 40px)); margin: 0 auto; }
.nav {
  position: sticky;
  top: 18px;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-top: 18px;
  padding: 14px 16px;
  border: 1px solid rgba(163, 230, 53, 0.07);
  border-radius: 24px;
  background: rgba(14, 15, 18, .78);
  box-shadow: 0 24px 80px rgba(0,0,0,.28);
  backdrop-filter: blur(18px);
}
.brand { display: flex; align-items: center; gap: 12px; font-weight: 900; letter-spacing: -.025em; }
.brand-logo-wide { width: min(260px, 42vw); height: 58px; object-fit: contain; object-position: left center; border-radius: 13px; box-shadow: 0 10px 28px rgba(0,0,0,.28); }
.nav-links { display: flex; align-items: center; gap: 10px; }
.nav-link { min-height: 42px; display: inline-flex; align-items: center; padding: 0 16px; border: 1px solid var(--line); border-radius: 13px; color: #d4d4d8; background: rgba(255,255,255,.025); font-size: 12px; font-weight: 900; }
.nav-link.primary { border: 0; color: #0e0f12; background: linear-gradient(135deg,#a3e635,#a1a1aa,#a1a1aa); }

.blog-hero { position: relative; max-width: 920px; padding: 110px 0 72px; }
.blog-hero::after { content: ""; position: absolute; right: -220px; top: 100px; width: 420px; height: 220px; border: 1px solid rgba(163, 230, 53, 0.07); border-radius: 40px; background: linear-gradient(135deg, rgba(163, 230, 53, .09), rgba(163, 230, 53, .08)); transform: rotate(-8deg); filter: blur(.2px); }
.eyebrow { color: #a3e635; font-size: 10px; font-weight: 1000; letter-spacing: .12em; text-transform: uppercase; }
h1 { margin: 20px 0 0; font-size: clamp(48px, 8vw, 82px); line-height: .98; letter-spacing: -.064em; }
.lead { max-width: 760px; margin: 24px 0 0; color: var(--muted); font-size: 18px; line-height: 1.7; }
.free-note { display: inline-flex; gap: 8px; align-items: center; margin-top: 24px; padding: 10px 13px; border: 1px solid rgba(163, 230, 53, 0.11); border-radius: 999px; color: #d4d4d8; background: rgba(163, 230, 53, .07); font-size: 11px; font-weight: 900; }
.free-note i { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 13px rgba(163, 230, 53, 0.33); }

.post-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; padding-bottom: 110px; }
.post-card { min-height: 360px; display: flex; flex-direction: column; overflow: hidden; padding: 24px; border: 1px solid var(--line); border-radius: 22px; background: linear-gradient(155deg,rgba(25, 28, 33, .96),rgba(14, 15, 18, .98)); box-shadow: 0 18px 60px rgba(0,0,0,.22); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.post-card:hover { transform: translateY(-5px); border-color: rgba(163, 230, 53, 0.17); box-shadow: 0 24px 80px rgba(163, 230, 53, 0.08); }
.post-chart { height: 112px; display: flex; align-items: end; gap: 6px; margin: -24px -24px 23px; padding: 20px 24px; background: linear-gradient(145deg,rgba(163, 230, 53, .1),rgba(163, 230, 53, .08)); }
.post-chart i { flex: 1; min-height: 8px; border-radius: 3px 3px 0 0; background: var(--green); opacity: .75; }
.post-chart i:nth-child(3n) { background: var(--red); }
.post-chart i:nth-child(1) { height: 22%; } .post-chart i:nth-child(2) { height: 56%; } .post-chart i:nth-child(3) { height: 38%; } .post-chart i:nth-child(4) { height: 82%; } .post-chart i:nth-child(5) { height: 61%; } .post-chart i:nth-child(6) { height: 95%; } .post-chart i:nth-child(7) { height: 72%; }
.meta { color: #a3e635; font-size: 9px; font-weight: 1000; letter-spacing: .09em; text-transform: uppercase; }
.post-card h2 { margin: 13px 0 10px; font-size: 23px; line-height: 1.17; letter-spacing: -.035em; }
.post-card p { margin: 0; color: #71717a; font-size: 13px; line-height: 1.65; }
.read { display: flex; justify-content: space-between; margin-top: auto; padding-top: 22px; color: #d4d4d8; font-size: 11px; font-weight: 850; }

.article-head { max-width: 880px; padding: 88px 0 55px; }
.article-head h1 { font-size: clamp(44px,7vw,76px); }
.article-meta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; color: #71717a; font-size: 11px; }
.article-meta span { padding: 7px 9px; border: 1px solid var(--line); border-radius: 999px; }
.article-layout { display: grid; grid-template-columns: minmax(0,740px) minmax(220px,1fr); gap: 70px; align-items: start; padding-bottom: 110px; }
.article { color: #d4d4d8; font-size: 17px; line-height: 1.82; }
.article > p:first-child { color: #d4d4d8; font-size: 20px; }
.article h2 { margin: 48px 0 14px; color: #ffffff; font-size: 30px; line-height: 1.15; letter-spacing: -.04em; }
.article h3 { margin: 32px 0 10px; color: #d4d4d8; font-size: 20px; }
.article p { margin: 0 0 20px; }
.article ul, .article ol { margin: 0 0 24px; padding-left: 24px; }
.article li { margin-bottom: 10px; }
.article strong { color: #ffffff; }
.article blockquote { margin: 34px 0; padding: 20px 22px; border-left: 3px solid var(--green); border-radius: 0 12px 12px 0; color: #d4d4d8; background: rgba(163, 230, 53, .05); font-size: 19px; line-height: 1.55; }
.callout { margin: 32px 0; padding: 20px; border: 1px solid rgba(244, 82, 95, .16); border-radius: 14px; background: rgba(244, 82, 95, .04); }
.callout strong { display: block; margin-bottom: 6px; color: #f4525f; }
.side-card { position: sticky; top: 22px; padding: 20px; border: 1px solid var(--line); border-radius: 18px; background: linear-gradient(155deg, rgba(25, 28, 33, .96), rgba(14, 15, 18, .98)); }
.side-card span { color: var(--green); font-size: 9px; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; }
.side-card h3 { margin: 12px 0 9px; font-size: 20px; letter-spacing: -.03em; }
.side-card p { margin: 0; color: #71717a; font-size: 12px; line-height: 1.6; }
.side-card a { width: 100%; min-height: 43px; display: flex; align-items: center; justify-content: center; margin-top: 18px; border-radius: 10px; color: #0e0f12; background: var(--green); font-size: 11px; font-weight: 900; }

footer { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 32px 0 40px; border-top: 1px solid var(--line); color: #a1a1aa; font-size: 11px; }
footer .brand-logo-wide { width: 210px; height: 48px; }

@media (max-width: 850px) {
  .post-grid { grid-template-columns: 1fr; }
  .article-layout { grid-template-columns: 1fr; gap: 34px; }
  .side-card { position: static; }
}

@media (max-width: 560px) {
  .shell { width: min(100% - 28px,1120px); }
  .nav-link:first-child { display: none; }
  .brand-logo-wide { width: 180px; height: 44px; }
  .blog-hero { padding-top: 70px; }
  h1 { font-size: 49px; }
  .article { font-size: 16px; }
  footer { flex-direction: column; text-align: center; }
}

/* TradeReview Executive Canvas - shared public-page polish */

html,
body {
  background:
    linear-gradient(90deg, rgba(14, 15, 18, .035) 1px, transparent 1px),
    linear-gradient(0deg, rgba(14, 15, 18, .028) 1px, transparent 1px),
    radial-gradient(circle at 16% 8%, rgba(32, 35, 41, .12), transparent 32rem),
    var(--canvas) !important;
  background-size: 42px 42px, 42px 42px, auto, auto !important;
  color: var(--ink) !important;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

body::before {
  display: none !important;
}

.shell {
  width: min(1180px, calc(100% - 48px)) !important;
}

.nav {
  top: 18px !important;
  border-radius: 6px !important;
  background: rgba(212, 212, 216, .84) !important;
  border: 1px solid var(--hairline) !important;
  box-shadow: var(--soft-shadow) !important;
  backdrop-filter: blur(18px) saturate(1.04) !important;
}

.brand-logo-wide {
  width: min(360px, 38vw) !important;
  height: 76px !important;
  object-fit: contain !important;
  object-position: left center !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  filter: drop-shadow(0 12px 24px rgba(14, 15, 18, .12)) !important;
}

.nav-link {
  color: var(--muted) !important;
  border: 1px solid transparent !important;
  border-radius: 4px !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  font-size: .82rem !important;
  font-weight: 800 !important;
}

.nav-link:hover {
  color: var(--ink) !important;
  background: rgba(32, 35, 41, .08) !important;
}

.nav-link.primary {
  background: var(--pine) !important;
  color: var(--canvas) !important;
  border: 0 !important;
}

.blog-hero {
  max-width: none !important;
  min-height: 440px !important;
  margin: 86px 0 28px !important;
  padding: clamp(34px, 6vw, 78px) !important;
  border-radius: 6px !important;
  background:
    linear-gradient(90deg, rgba(212, 212, 216, .92), rgba(212, 212, 216, .72)),
    radial-gradient(circle at 86% 18%, rgba(32, 35, 41, .14), transparent 28rem) !important;
  border: 1px solid var(--hairline) !important;
  box-shadow: var(--soft-shadow) !important;
}

.blog-hero::after {
  opacity: .18 !important;
  border-radius: 6px !important;
  border-color: var(--hairline) !important;
  background: rgba(32, 35, 41, .08) !important;
}

.eyebrow,
.meta,
.free-note,
footer {
  color: var(--muted) !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  font-weight: 800 !important;
}

.blog-hero h1,
h1 {
  max-width: 960px !important;
  color: var(--ink) !important;
  font-size: clamp(3.6rem, 7vw, 6.6rem) !important;
  line-height: .94 !important;
  letter-spacing: -.055em !important;
}

.lead {
  max-width: 760px !important;
  color: var(--muted) !important;
  font-size: 1.0625rem !important;
  line-height: 1.65 !important;
}

.post-card,
.article,
.side-card {
  background: rgba(212, 212, 216, .78) !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 6px !important;
  box-shadow: var(--soft-shadow) !important;
  color: var(--ink) !important;
}

.post-card:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(32, 35, 41, .28) !important;
  box-shadow: 0 6px 18px rgba(14, 15, 18, .07) !important;
}

.post-chart {
  background:
    linear-gradient(90deg, rgba(14, 15, 18, .04) 1px, transparent 1px),
    linear-gradient(0deg, rgba(14, 15, 18, .035) 1px, transparent 1px),
    var(--lift) !important;
  background-size: 28px 28px, 28px 28px, auto !important;
}

.post-card h2,
.article h1,
.article h2,
.article h3,
.side-card h3 {
  color: var(--ink) !important;
  letter-spacing: -.025em !important;
}

.post-card p,
.article p,
.article li,
.side-card p {
  color: var(--muted) !important;
  line-height: 1.65 !important;
}

.article > p:first-child,
.article strong {
  color: var(--ink) !important;
}

.read,
.side-card span {
  color: var(--pine) !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  font-weight: 800 !important;
}

.side-card a {
  background: var(--pine) !important;
  color: var(--canvas) !important;
  border-radius: 4px !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
}

footer {
  background: transparent !important;
  border-color: var(--hairline) !important;
}

@media (max-width: 760px) {
  .shell { width: min(100% - 28px, 100%) !important; }
  .brand-logo-wide { width: 100% !important; max-width: 320px !important; }
  .blog-hero h1, h1 { font-size: clamp(3rem, 14vw, 4.6rem) !important; }
}

/* TradeReview Aethel blog/support - final design layer */

html, body {
  background:var(--ae-bg) !important;
  color:var(--ae-text) !important;
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

body::before {
  content:"";
  position:fixed;
  inset:0;
  z-index:-3;
  pointer-events:none;
  background:
    radial-gradient(circle at 70% 12%, rgba(163,230,53,.12), transparent 24rem),
    radial-gradient(circle at 16% 36%, rgba(163, 230, 53, .08), transparent 28rem),
    linear-gradient(180deg,#18181b,#0e0f12 70%,#18181b) !important;
}

body::after {
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  opacity:.32;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:44px 44px;
  mask-image:linear-gradient(180deg,#000000,transparent 86%);
}

.shell, main, section, article { background:transparent !important; color:var(--ae-text) !important; }

.nav, .post-card, .article, .side-card, .blog-hero, .article-head, footer {
  background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.018)), var(--ae-surface) !important;
  border:1px solid var(--ae-border) !important;
  border-radius:var(--ae-radius) !important;
  box-shadow:0 24px 80px rgba(0,0,0,.32) !important;
}

.nav {
  width:min(1440px, calc(100vw - 64px)) !important;
  margin:32px auto !important;
  padding:14px 22px !important;
  backdrop-filter:blur(18px) saturate(120%) !important;
}

.brand-logo-wide {
  width:min(300px, 42vw) !important;
  height:auto !important;
  max-height:76px !important;
  object-fit:contain !important;
  border-radius:14px !important;
  box-shadow:none !important;
}

h1, h2, h3 {
  color:var(--ae-text) !important;
  -webkit-text-fill-color:var(--ae-text) !important;
  background:none !important;
  font-weight:500 !important;
  letter-spacing:-.055em !important;
  text-shadow:none !important;
}

h1 *, h2 *, h3 *, .gradient, .blog-hero h1 span, .article-head h1 span {
  color:var(--ae-text) !important;
  -webkit-text-fill-color:var(--ae-text) !important;
  background:none !important;
}

.blog-hero h1, .article-head h1, h1 {
  font-size:clamp(52px, 7vw, 104px) !important;
  line-height:1.04 !important;
}

p, li, .lead, .post-card p, .article p, .article li, .side-card p {
  color:var(--ae-muted) !important;
  line-height:1.65 !important;
}

.eyebrow, .read, .article-meta, .side-card span {
  font-family:"JetBrains Mono", ui-monospace, Consolas, monospace !important;
  color:#a3e635 !important;
  letter-spacing:.09em !important;
  text-transform:uppercase !important;
  font-weight:700 !important;
}

a, .nav-link { color:#ffffff !important; }
.nav-link.primary, .side-card a {
  background:var(--ae-lime) !important;
  color:#0e0f12 !important;
  border-radius:var(--ae-control) !important;
  border:1px solid rgba(163,230,53,.35) !important;
}

.post-card:hover, .side-card:hover, .nav-link:hover {
  transform:translateY(-3px) !important;
  filter:brightness(1.03) !important;
}

.post-card img,
.post-card .chart,
.post-visual,
.article-visual,
.mini-chart {
  background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.018)), var(--ae-card) !important;
  border-color:var(--ae-border) !important;
  filter:saturate(.84) brightness(.82) !important;
}

@media (max-width:760px) {
  .nav { width:calc(100vw - 28px) !important; margin:14px auto !important; }
  .brand-logo-wide { width:190px !important; }
  .blog-hero h1, .article-head h1, h1 { font-size:clamp(42px, 14vw, 68px) !important; }
}

/* Aethel reference lock: final blog/support authority */

html, body {
  background:
    radial-gradient(circle at 82% 12%, rgba(163,230,53,.06), transparent 26rem),
    radial-gradient(circle at 18% 20%, rgba(255,255,255,.035), transparent 24rem),
    linear-gradient(180deg, #18181b 0%, #0e0f12 100%) !important;
  color:var(--ae-text) !important;
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

body::before {
  opacity:.22 !important;
  background:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px) !important;
  background-size:48px 48px !important;
}

.nav, .post-card, .article, .side-card, .blog-hero, .article-head, footer,
.support-card, .contact-card, .help-card {
  background:
    linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.015)),
    var(--ae-surface) !important;
  border:1px solid var(--ae-border) !important;
  border-radius:var(--ae-radius-card) !important;
  box-shadow:0 30px 90px rgba(0,0,0,.26) !important;
  color:var(--ae-text) !important;
}

.nav {
  width:min(1180px, calc(100vw - 48px)) !important;
  padding:12px 14px !important;
  border-radius:26px !important;
}

.brand-logo-wide, .nav img, .logo img, .brand img {
  width:clamp(180px, 18vw, 280px) !important;
  height:64px !important;
  object-fit:contain !important;
  object-position:left center !important;
  border-radius:12px !important;
  background:#0e0f12 !important;
  box-shadow:none !important;
}

.blog-hero {
  padding:clamp(56px, 8vw, 96px) 24px !important;
}

.blog-hero::after, .article-head::after {
  opacity:.14 !important;
  border-color:rgba(163,230,53,.18) !important;
  background:radial-gradient(circle, rgba(163,230,53,.12), transparent 68%) !important;
}

.blog-hero h1, .article-head h1, h1 {
  color:var(--ae-text) !important;
  -webkit-text-fill-color:var(--ae-text) !important;
  background:none !important;
  font-size:clamp(48px, 7vw, 92px) !important;
  font-weight:500 !important;
  line-height:1.04 !important;
  letter-spacing:0 !important;
}

h2, h3, strong { color:var(--ae-text) !important; }
p, li, .muted, .excerpt, .article-meta { color:var(--ae-muted) !important; }

.button.primary, .primary, button[type="submit"], .nav-link.primary, .side-card a {
  background:var(--ae-lime) !important;
  border-color:var(--ae-lime) !important;
  color:#0e0f12 !important;
  border-radius:var(--ae-radius-control) !important;
  box-shadow:0 14px 34px rgba(163,230,53,.16) !important;
}

.button:not(.primary), input, textarea, select {
  background:#0e0f12 !important;
  border:1px solid var(--ae-border) !important;
  color:var(--ae-text) !important;
  border-radius:var(--ae-radius-control) !important;
}

.tag, .pill, .eyebrow, .category {
  background:rgba(163,230,53,.08) !important;
  border:1px solid rgba(163,230,53,.22) !important;
  color:var(--ae-lime) !important;
  border-radius:9999px !important;
  font-family:"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
}

@media (max-width:700px) {
  .nav { width:calc(100vw - 24px) !important; }
  .blog-hero h1, .article-head h1, h1 { font-size:clamp(42px, 13vw, 68px) !important; }
  .brand-logo-wide, .nav img, .logo img, .brand img { width:190px !important; height:54px !important; }
}

/* Aethel MD-only authority: charcoal, lime, Inter, mono labels. */

html,
body {
  background:
    radial-gradient(circle at 74% 14%, rgba(163,230,53,.07), transparent 30%),
    linear-gradient(135deg,#18181b 0%,#18181b 52%,#0e0f12 100%) !important;
  color:var(--md-text) !important;
  font-family:var(--md-font) !important;
}

body::before,
body::after,
.blog-hero::before,
.article-hero::before {
  background:
    linear-gradient(rgba(255,255,255,.032) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.032) 1px, transparent 1px) !important;
  background-size:72px 72px !important;
  opacity:.30 !important;
  animation:mdGridDrift 24s linear infinite !important;
  filter:none !important;
}

@keyframes mdGridDrift {
  from { background-position:0 0,0 0; }
  to { background-position:72px 72px,72px 72px; }
}

@keyframes mdReveal {
  from { opacity:0; transform:translateY(18px); }
  to { opacity:1; transform:translateY(0); }
}

.blog-nav,
.blog-shell,
.blog-hero,
.article-hero,
.post-card,
.article-card,
.resource-card,
.callout,
.toc,
.newsletter,
.footer-card,
main section {
  background:rgba(24,24,27,.92) !important;
  border:1px solid var(--md-border) !important;
  border-radius:var(--md-card) !important;
  box-shadow:0 28px 80px rgba(0,0,0,.32) !important;
  color:var(--md-text) !important;
  backdrop-filter:blur(18px) !important;
}

.blog-nav {
  max-width:1180px !important;
  min-height:76px !important;
  padding:12px 16px !important;
  margin:28px auto 0 !important;
}

img[src*="tradereview-aethel-logo"],
.blog-logo img,
.brand img {
  width:248px !important;
  height:54px !important;
  object-fit:contain !important;
  object-position:left center !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  border-radius:0 !important;
  padding:0 !important;
}

.blog-hero,
.article-hero {
  animation:mdReveal .7s cubic-bezier(.22,1,.36,1) both !important;
}

h1,
.blog-hero h1,
.article-hero h1 {
  color:var(--md-text) !important;
  font-family:var(--md-font) !important;
  font-size:clamp(48px,7vw,96px) !important;
  font-weight:500 !important;
  letter-spacing:-.055em !important;
  line-height:1.04 !important;
  text-shadow:none !important;
}

h2,
h3,
h4 {
  color:var(--md-text) !important;
  letter-spacing:-.035em !important;
}

p,
li,
.subtitle,
.muted,
.post-card p,
.article-card p {
  color:var(--md-muted) !important;
  font-size:16px !important;
  line-height:1.6 !important;
}

.eyebrow,
.pill,
.badge,
.category,
.meta,
.tag {
  color:var(--md-primary) !important;
  font-family:var(--md-mono) !important;
  font-size:12px !important;
  font-weight:600 !important;
  letter-spacing:.04em !important;
  text-transform:uppercase !important;
}

a,
.blog-nav a {
  color:var(--md-muted) !important;
  text-decoration:none !important;
}

a:hover,
.blog-nav a:hover {
  color:var(--md-text) !important;
}

button,
.button,
.primary,
.start-free {
  background:var(--md-primary) !important;
  color:#0e0f12 !important;
  border:1px solid rgba(163,230,53,.38) !important;
  border-radius:var(--md-control) !important;
  box-shadow:0 18px 44px rgba(163,230,53,.16) !important;
  font-family:var(--md-mono) !important;
  font-weight:700 !important;
}

.secondary,
.button.secondary {
  background:rgba(24,24,27,.88) !important;
  color:var(--md-text) !important;
  border:1px solid var(--md-border) !important;
  box-shadow:none !important;
}

.post-card,
.article-card,
.resource-card {
  transition:transform .24s ease,border-color .24s ease,background .24s ease !important;
}

.post-card:hover,
.article-card:hover,
.resource-card:hover {
  transform:translateY(-4px) !important;
  border-color:rgba(163,230,53,.35) !important;
  background:rgba(25, 28, 33, .96) !important;
}

/* Final MD token lock: keep blog/support visually aligned with the app. */

html,
body {
  background:
    radial-gradient(circle at 78% 10%, rgba(163,230,53,.055), transparent 28rem),
    linear-gradient(180deg, var(--lock-bg), #18181b 62%, var(--lock-bg)) !important;
  color:var(--lock-text) !important;
  font-family:var(--lock-font) !important;
}

body::before,
body::after,
.blog-hero::before,
.blog-hero::after,
.article-hero::before,
.article-hero::after,
.post-chart,
.blog-visual {
  display:none !important;
}

.blog-shell,
.article-shell,
main {
  background:
    linear-gradient(rgba(255,255,255,.026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.026) 1px, transparent 1px) !important;
  background-size:64px 64px !important;
}

.blog-nav,
.nav,
.post-card,
.article,
.article-card,
.side-card,
.blog-hero,
.article-head,
.resource-card,
footer,
.help-card {
  background:rgba(24,24,27,.94) !important;
  border:1px solid var(--lock-border) !important;
  border-radius:var(--lock-radius-card) !important;
  box-shadow:0 24px 70px rgba(0,0,0,.26) !important;
  color:var(--lock-text) !important;
}

.cta {
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

img[src*="tradereview-aethel-logo"],
.blog-logo img,
.brand img {
  width:auto !important;
  max-width:260px !important;
  height:auto !important;
  max-height:64px !important;
  object-fit:contain !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  filter:none !important;
}

h1,
.blog-hero h1,
.article-hero h1,
.article-head h1 {
  color:var(--lock-text) !important;
  font-family:var(--lock-font) !important;
  font-weight:500 !important;
  letter-spacing:-.055em !important;
  line-height:1.04 !important;
  text-shadow:none !important;
}

p,
li,
.subtitle,
.muted,
.post-card p,
.article-card p {
  color:var(--lock-muted) !important;
}

.eyebrow,
.pill,
.badge,
.category,
.meta,
.tag {
  color:var(--lock-green) !important;
  font-family:var(--lock-mono) !important;
  font-weight:600 !important;
}

.button,
.button.primary,
button.primary,
.start-free {
  background:var(--lock-green) !important;
  color:#0e0f12 !important;
  border:1px solid rgba(163,230,53,.42) !important;
  border-radius:var(--lock-radius-control) !important;
  box-shadow:0 18px 44px rgba(163,230,53,.16) !important;
}

.button.secondary,
.secondary,
.nav-signin {
  background:rgba(24,24,27,.9) !important;
  color:var(--lock-text) !important;
  border:1px solid var(--lock-border) !important;
  box-shadow:none !important;
}

/* Absolute Aethel MD palette authority: no legacy blue/red/cyan/mint theme leaks. */

html,
body {
  background:
    linear-gradient(rgba(255,255,255,.024) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.024) 1px, transparent 1px),
    #18181b !important;
  background-size:64px 64px,64px 64px,auto !important;
  color:#ffffff !important;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif !important;
}

body::before,
body::after,
.blog-hero::before,
.blog-hero::after,
.article-hero::before,
.article-hero::after,
.post-chart,
.blog-visual {
  display:none !important;
  opacity:0 !important;
  visibility:hidden !important;
}

.blog-shell,
.article-shell,
main,
section {
  background:transparent !important;
  color:#ffffff !important;
}

.blog-nav,
.nav,
.post-card,
.article,
.article-card,
.side-card,
.blog-hero,
.article-head,
.resource-card,
footer,
.help-card,
.message,
.cta-inner,
.panel,
.card {
  background:#18181b !important;
  background-image:
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px) !important;
  background-size:56px 56px !important;
  border:1px solid #191c21 !important;
  border-radius:16px !important;
  box-shadow:none !important;
  color:#ffffff !important;
}

h1,
h2,
h3,
h4,
strong,
label {
  color:#ffffff !important;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif !important;
  text-shadow:none !important;
}

p,
li,
span,
small,
.subtitle,
.muted,
.post-card p,
.article-card p {
  color:#a1a1aa !important;
  text-shadow:none !important;
}

.eyebrow,
.pill,
.badge,
.category,
.meta,
.tag {
  background:#18181b !important;
  border:1px solid #191c21 !important;
  border-radius:9999px !important;
  color:#a3e635 !important;
  box-shadow:none !important;
  font-family:"JetBrains Mono","SFMono-Regular",Consolas,monospace !important;
}

.button,
.button.primary,
button,
button.primary,
.start-free {
  background:#a3e635 !important;
  border:1px solid #a3e635 !important;
  border-radius:8px !important;
  color: var(--tr-ink) !important;
  box-shadow:none !important;
  font-family:"JetBrains Mono","SFMono-Regular",Consolas,monospace !important;
  font-weight:700 !important;
}

.button.secondary,
.secondary,
.nav-signin,
.help-button {
  background:#18181b !important;
  border:1px solid #191c21 !important;
  color:#ffffff !important;
  box-shadow:none !important;
}

.negative,
.loss,
.danger,
.warning,
[class*="negative"],
[class*="loss"],
[class*="danger"],
[class*="warning"],
[style*="--red"],
[style*="#ff"],
[style*="#ef"],
[style*="red"] {
  color:#a1a1aa !important;
  border-color:#191c21 !important;
  background-color: var(--tr-ink) !important;
  box-shadow:none !important;
}

.positive,
[class*="positive"],
[class*="profit"],
[class*="gain"],
[class*="win"],
.dot,
.help-icon {
  color:#a3e635 !important;
  border-color:#a3e635 !important;
}

/*
  FINAL AETHEL BLOG/SUPPORT LOCK
  Keep blog/support on the same MD palette as the landing page and app.
*/

html,
body,
main,
section,
.blog-shell,
.support-shell {
  color:#ffffff !important;
  background-color: var(--tr-ink) !important;
  background-image:
    linear-gradient(rgba(255,255,255,.026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.026) 1px, transparent 1px) !important;
  background-size:56px 56px !important;
}

.nav,
.site-nav,
header,
.blog-hero,
.post-card,
.side-card,
.support-card,
.help-panel,
.faq-card,
.contact-card,
.resource-card,
footer {
  color:#ffffff !important;
  background:
    linear-gradient(145deg, rgba(255,255,255,.04), rgba(255,255,255,.012)),
    #18181b !important;
  border:1px solid #191c21 !important;
  border-radius:16px !important;
  box-shadow:0 24px 70px rgba(0,0,0,.26) !important;
}

h1,h2,h3,h4,
.post-card h2,
.post-card h3,
.side-card h3 {
  color:#ffffff !important;
}

p,small,label,
.muted,
.post-card p,
.side-card p,
.support-copy {
  color:#a1a1aa !important;
}

.nav-link.primary,
.button.primary,
button.primary,
.cta,
.help-form button {
  color: var(--tr-ink) !important;
  background:#a3e635 !important;
  border:1px solid #a3e635 !important;
  box-shadow:0 18px 46px rgba(163,230,53,.16) !important;
}

.nav-link:not(.primary),
.button:not(.primary),
button:not(.primary),
.tag,
.badge,
.chip,
.pill {
  color:#ffffff !important;
  background:#18181b !important;
  border:1px solid #191c21 !important;
  box-shadow:none !important;
}

/* Final Aethel-only blog/support authority. */
html,
body,
main,
section,
.blog-shell,
.support-shell {
  background:
    linear-gradient(rgba(255,255,255,.022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.022) 1px, transparent 1px),
    #18181b !important;
  background-size:64px 64px,64px 64px,auto !important;
  color:#ffffff !important;
}

.nav,
.site-nav,
header,
footer,
.blog-hero,
.post-card,
.side-card,
.support-card,
.help-panel,
.faq-card,
.contact-card,
.resource-card,
[class*="card"],
[class*="panel"] {
  background:#18181b !important;
  background-image:
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px) !important;
  background-size:56px 56px !important;
  border:1px solid #191c21 !important;
  border-radius:16px !important;
  box-shadow:none !important;
  color:#ffffff !important;
}

h1,h2,h3,h4,h5,h6,strong {
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  background:none !important;
  text-shadow:none !important;
}

p,li,small,span,label,.muted,.support-copy {
  color:#a1a1aa !important;
}

.tag,.badge,.chip,.pill,.eyebrow,.kicker {
  background:#18181b !important;
  border:1px solid #191c21 !important;
  border-radius:9999px !important;
  color:#a3e635 !important;
  box-shadow:none !important;
}

.nav-link.primary,
.button.primary,
button.primary,
.cta,
.help-form button {
  background:#a3e635 !important;
  border:1px solid #a3e635 !important;
  border-radius:8px !important;
  color: var(--tr-ink) !important;
  box-shadow:none !important;
}