/* Phoenix logo palette and a single alignment grid for every publication route.
   Keep market direction colours semantic; the brand colours establish hierarchy. */
@media screen {
  :root, html[data-theme], html[data-theme="light"], html[data-theme="dark"] {
    color-scheme: light;
    --phoenix-navy: #23265d;
    --phoenix-blue: #176c99;
    --phoenix-sky: #67bed8;
    --phoenix-gold: #f2b650;
    --phoenix-flame: #e97635;
    --phoenix-content-width: 1440px;
    --phoenix-gutter: 32px;
    --bg: #f3f6fb;
    --paper: #f3f6fb;
    --panel: #ffffff;
    --card: #ffffff;
    --surface: #ffffff;
    --surface-strong: #eaf0f8;
    --text: #232b4b;
    --ink: #232b4b;
    --muted: #53627b;
    --border: #ccd6e5;
    --line: #ccd6e5;
    --line-strong: #a4b4ca;
    --soft-line: #dfe6f0;
    --soft: #edf2f9;
    --cyan: #176c99;
    --teal: #176c99;
    --blue: #176c99;
    --navy: #23265d;
    --dashboard-navy: #23265d;
    --dashboard-rule: #ccd6e5;
    --gold: #88510e;
    --amber: #88510e;
    --up: #126b51;
    --green: #126b51;
    --down: #b02f44;
    --red: #b02f44;
    --radius: 12px;
    --shadow: 0 8px 28px #23265d0b;
    --shadow-soft: 0 5px 18px #23265d08;
  }

  /* Main children share the same outer edges, including the KPI row and footer. */
  body > main, body > main.site-shell {
    width: 100% !important;
    max-width: calc(var(--phoenix-content-width) + 2 * var(--phoenix-gutter));
    margin: 0 auto !important;
    padding: 28px var(--phoenix-gutter) 36px !important;
  }
  body > main > * {
    width: 100%;
    max-width: none;
    margin-inline: 0;
    min-width: 0;
  }
  .phoenix-masthead {
    padding-inline: max(var(--phoenix-gutter), calc((100vw - var(--phoenix-content-width)) / 2));
    background: #fff;
    border-top: 0;
    border-bottom-color: var(--border);
    padding-top: 15px;
    box-shadow: 0 4px 20px #23265d08;
  }
  .phoenix-masthead::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 3px;
    background: linear-gradient(90deg, #23265d 0% 44%, #176c99 60%, #67bed8 76%, #f2b650 90%, #e97635 100%);
  }
  .phoenix-masthead .phoenix-brand,
  .phoenix-masthead .phoenix-edition-lockup strong { color: var(--phoenix-navy); }
  .phoenix-edition-lockup { border-color: var(--border); }
  .phoenix-edition-lockup small,
  .phoenix-masthead .phoenix-utility-nav a { color: var(--muted); }
  .phoenix-masthead .phoenix-primary-nav,
  .phoenix-masthead .phoenix-utility-nav { border-color: var(--border); }
  .phoenix-masthead nav a { color: var(--phoenix-navy); }
  .phoenix-masthead nav a:hover { color: var(--phoenix-blue); background: #edf4fa; }
  .phoenix-masthead nav a[aria-current="page"] {
    color: var(--phoenix-navy);
    background: #eaf0fb;
    border-color: #c3cfe6;
    box-shadow: inset 0 -2px var(--phoenix-navy);
  }
  .phoenix-masthead .phoenix-utility-nav a:first-child,
  .phoenix-masthead .phoenix-menu {
    color: var(--phoenix-navy);
    border-color: #b8c7dd;
    background: #fff;
  }
  .phoenix-masthead .phoenix-menu[aria-expanded="true"] { background: #eaf0fb; border-color: var(--phoenix-blue); }
  .phoenix-cadence { color: #235575; border-color: #caddeb; background: #eff6fb; }
  .phoenix-cadence i { background: var(--phoenix-blue); box-shadow: 0 0 0 3px #d8eaf5; }
  .phoenix-masthead a:focus-visible,
  .phoenix-masthead button:focus-visible,
  a:focus-visible, button:focus-visible, input:focus-visible,
  summary:focus-visible, [tabindex]:focus-visible { outline-color: var(--phoenix-blue) !important; }
  ::selection { background: #cfdfef; color: var(--phoenix-navy); }

  h1, h2, h3, h4 { color: var(--phoenix-navy); }
  .eyebrow, .policy-hero__eyebrow { color: var(--phoenix-blue); }
  .phoenix-hold { background: #fff8eb; border-color: #e6cc9c; border-left-color: #d89426; color: #65471d; padding: 16px 24px; }
  .phoenix-hold strong { color: #83500c; }
  .phoenix-source { background: #edf5fb; border-color: #caddeb; border-left-color: var(--phoenix-blue); }
  .phoenix-contents { background: #fff; box-shadow: var(--shadow-soft); }

  /* The navy hero uses the original artwork; all other surfaces stay light. */
  .signature-dashboard .hero {
    padding: 30px 24px;
    margin-block: 0 20px;
    min-height: 300px;
    border: 1px solid #303c73;
    border-radius: var(--radius);
    overflow: hidden;
    background: var(--phoenix-navy);
    color: #fff;
  }
  html[data-theme] .signature-dashboard .hero::before,
  .signature-dashboard .hero::before {
    inset: 0 !important;
    background: linear-gradient(90deg, #23265dfa 0%, #23265de8 38%, #1b4a76a6 75%, #176c9970 100%), url('images/dashboard-mountains.png') center 60% / cover;
    background-color: #23265d;
    background-blend-mode: normal, luminosity;
    opacity: 1;
  }
  .signature-dashboard .hero h1 { color: #fff; font-size: clamp(2rem, 3.6vw, 3.25rem); line-height: 1.12; margin: 28px 0 16px; }
  .signature-dashboard .hero h1 span { color: #83d2e8; }
  .signature-dashboard .hero p { color: #e1e8f5; max-width: 58ch; margin: 0 0 20px; line-height: 1.65; }
  .signature-dashboard .hero .eyebrow { color: #b8e5f3; }
  .signature-dashboard .edition-line { color: #e1e8f5; }
  .signature-dashboard .edition-line strong { color: #fff; }
  .signature-dashboard .delay-badge { border-color: #96acc6; }
  .subscribe-button, html[data-theme="light"] .subscribe-button {
    color: #23265d;
    background: var(--phoenix-gold);
    border-color: var(--phoenix-gold);
    box-shadow: none;
    border-radius: 7px;
    font-weight: 700;
  }
  .subscribe-button:hover { background: #ffca6b; color: #23265d; }

  .signature-dashboard .quote-strip { margin: 0 0 20px; gap: 16px; grid-auto-rows: 1fr; }
  .signature-dashboard .quote-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-height: 150px;
    margin: 0;
    padding: 22px 24px;
    background: #fff;
    color: var(--phoenix-navy);
    border: 1px solid var(--border);
    border-top: 3px solid var(--phoenix-blue);
    border-radius: var(--radius);
    box-shadow: var(--shadow-soft);
    transform: none;
  }
  .signature-dashboard .quote-card:hover { transform: none; border-color: var(--phoenix-blue); background: #f8fbfe; }
  .signature-dashboard .quote-card > strong { color: var(--phoenix-navy); font-size: clamp(1.35rem, 2vw, 1.7rem); font-weight: 700; margin: 10px 0; }
  .signature-dashboard .quote-card > span:last-child { margin-top: auto; }
  .signature-dashboard .quote-name { color: var(--muted); font-size: .8rem; font-weight: 650; letter-spacing: .02em; }
  .signature-dashboard .quote-card small { color: var(--muted); }
  .signature-dashboard .dashboard-grid { gap: 20px; }
  .signature-dashboard .panel { padding: 24px 24px 0; }
  .signature-dashboard .panel-heading { min-height: 44px; margin-bottom: 18px; }
  .signature-dashboard .panel-heading h2 { color: var(--phoenix-navy); font-size: 1.1rem; line-height: 1.4; }
  .signature-dashboard .tabs { gap: 6px; }
  .signature-dashboard .tabs button { background: #f3f6fb; border-color: #c7d4e5; color: var(--phoenix-navy); }
  html[data-theme] .signature-dashboard .tabs button[aria-selected="true"] {
    background: var(--phoenix-navy); color: #fff; border-color: var(--phoenix-navy); box-shadow: inset 0 -3px var(--phoenix-sky);
  }
  .signature-dashboard .panel-heading > a { color: var(--phoenix-blue); background: #f3f7fc; border-color: var(--border); min-height: 44px; }
  .signature-dashboard .sector.is-up { background: #126b63; }
  .signature-dashboard .sector.is-down { background: #97354d; }
  .signature-dashboard .sector { color: #fff; border-radius: 6px; }
  .signature-dashboard .sector small { opacity: 1; color: #fff; }
  .positive { background: #126b63; } .negative { background: #97354d; }
  .signature-dashboard .story-num { color: #66779b; }
  .signature-dashboard .story h3 { color: var(--phoenix-navy); }
  html[data-theme] .signature-dashboard .insight-panel { background: #eaf1fa; border-color: #bccce3; border-top: 3px solid var(--phoenix-gold); box-shadow: var(--shadow-soft); padding: 24px; }
  .signature-dashboard .insight-panel h2 { color: var(--phoenix-navy); }
  .gold-link, .subscription > a { color: var(--phoenix-blue); border-color: #b6cbe0; background: #fff; }
  .signature-dashboard .subscription { margin: 28px 0 0; padding: 24px; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); }

  .compact-edition-hero, .policy-hero {
    --muted: #e1e8f5;
    --cyan: #b8e5f3;
    --teal: #b8e5f3;
    background: linear-gradient(115deg, #23265d, #205a81) !important;
    color: #fff;
    border-color: #354775 !important;
    border-top-color: var(--phoenix-gold) !important;
    padding: 32px 24px !important;
  }
  .compact-edition-hero h1, .policy-hero h1 { color: #fff; }
  .compact-edition-hero .eyebrow, .policy-hero .eyebrow,
  .policy-hero__eyebrow { color: #b8e5f3; }
  .compact-edition-hero .meta-row span,
  .policy-hero .meta-row span { background: #ffffff14 !important; border-color: #728db6 !important; color: #eaf1fa !important; }
  .primary-action { background: var(--phoenix-navy) !important; border-color: var(--phoenix-navy) !important; color: #fff !important; }
  .primary-action:hover { background: #343980 !important; border-color: #343980 !important; }
  .secondary-action { background: #edf2f9 !important; color: var(--phoenix-navy) !important; }
  .secondary-action:hover { background: #e0eafa !important; border-color: var(--phoenix-blue) !important; }
  .compact-edition-hero .primary-action, .policy-hero .primary-action { background: var(--phoenix-gold) !important; border-color: var(--phoenix-gold) !important; color: #23265d !important; }
  .compact-edition-hero .secondary-action { background: #ffffff14 !important; border-color: #93aac7 !important; color: #fff !important; }
  .compact-edition-hero a:focus-visible, .signature-dashboard .hero a:focus-visible { outline-color: var(--phoenix-gold) !important; }
  .compact-edition-hero .share-tools { border-color: #728db6; }
  .compact-edition-hero .share-tools a, .compact-edition-hero .share-tools button { color: #fff; border-color: #93aac7; }
  .compact-edition-hero .share-tools a:hover, .compact-edition-hero .share-tools button:hover { background: #344f79; color: #fff; }
  body > main > .policy-content { width: 100%; max-width: none; }
  .policy-content { padding: 24px; border: 1px solid var(--border); }
  .policy-content section:last-child { border-bottom: 0; }
  .phoenix-table tbody tr:hover, .phoenix-table tbody tr:hover td:first-child { background: var(--soft); }
  .phoenix-table tbody tr:nth-child(even), .phoenix-table tbody tr:nth-child(even) td:first-child { background: var(--soft); }
  .search-result-card > span { color: var(--phoenix-blue) !important; }
  .search-result-card, .market-chart-card, .macro-event-card, .fx-rate-card { box-shadow: var(--shadow-soft); }
  .utility-search input { background: #fff; border-color: #9cacc5; }
  .phoenix-footer { color: var(--muted); border-top-color: var(--border); }
  main > .phoenix-footer { padding: 24px 0 0; margin: 28px 0 0; }
  body > .phoenix-footer {
    width: 100%; max-width: calc(var(--phoenix-content-width) + 2 * var(--phoenix-gutter));
    margin: 0 auto; padding: 24px var(--phoenix-gutter);
  }
}

@media screen and (max-width: 1100px) {
  :root, html[data-theme] { --phoenix-gutter: 24px; }
  .phoenix-masthead { padding-top: 13px; }
  .signature-dashboard .quote-card { min-height: 145px; }
}
@media screen and (max-width: 760px) {
  :root, html[data-theme] { --phoenix-gutter: 16px; }
  .phoenix-masthead { padding-top: 12px; }
  body > main, body > main.site-shell { padding-top: 20px !important; }
  .signature-dashboard .hero { min-height: 0; padding: 22px 18px; }
  .signature-dashboard .hero h1 { margin-top: 24px; }
  .signature-dashboard .hero p { font-size: .9rem; }
  .signature-dashboard .panel, .signature-dashboard .insight-panel { padding: 18px 18px 0; }
  html[data-theme] .signature-dashboard .insight-panel { padding: 18px; }
  .signature-dashboard .quote-strip { gap: 12px; }
  .signature-dashboard .quote-card { padding: 16px 14px; min-height: 140px; }
  .signature-dashboard .quote-card > strong { font-size: 1.3rem; }
  .signature-dashboard .quote-card small { display: block; margin: 4px 0 0; }
  .phoenix-hold, .phoenix-source { padding: 14px 18px; }
  .compact-edition-hero, .policy-hero { padding: 24px 18px !important; }
  .policy-content, .signature-dashboard .subscription { padding: 18px; }
  .signature-dashboard .topbar { gap: 12px; }
  .signature-dashboard .header-actions { width: auto; margin-left: auto; }
}
@media screen and (max-width: 360px) {
  .phoenix-masthead .phoenix-brand { gap: 9px; }
  .phoenix-masthead .phoenix-brand img { width: 80px; }
  .phoenix-edition-lockup { padding-left: 9px; }
  .signature-dashboard .quote-card { padding-inline: 11px; }
  .signature-dashboard .quote-card > strong { font-size: 1.2rem; }
}