:root {
  --ink: #071625;
  --ink-2: #0d2438;
  --ink-3: #16364e;
  --paper: #f2f6f4;
  --white: #ffffff;
  --line: #dbe4df;
  --line-dark: #cbd8d1;
  --muted: #647582;
  --green: #20cf98;
  --green-deep: #0f7758;
  --green-soft: #def5ec;
  --orange: #ffaf67;
  --shadow: 0 24px 70px rgba(7,22,37,.12);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
.skip-link { position: fixed; z-index: 100; left: -999px; top: 10px; padding: 11px 15px; border-radius: 8px; background: var(--green); color: var(--ink); }
.skip-link:focus { left: 10px; }

.site-header {
  position: relative;
  z-index: 10;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 34px;
  min-height: 94px;
  padding: 0 clamp(20px,5vw,72px);
  color: var(--ink);
  background: #ffffff;
  border-bottom: 1px solid var(--line);
  box-shadow: 0 2px 12px rgba(15,119,88,.035);
}
.brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; }
.brand img { display: block; width: 72px; height: 72px; }
.brand-name { display: grid; grid-template-columns: auto auto; align-items: baseline; font-size: 34px; line-height: 1; letter-spacing: -1px; }
.header-market-link { display: none; }
.header-pro { gap: 7px; text-decoration: none; }
.brand-name strong { font-weight: 780; }
.brand-name > span { color: var(--green-deep); font-weight: 600; }
.brand-name small { grid-column: 1 / -1; margin-top: 7px; color: #647582; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px; }
.main-nav { justify-self: center; display: flex; gap: clamp(20px,3vw,42px); }
.main-nav a { color: #526774; font-size: 12px; font-weight: 700; text-decoration: none; transition: color .2s ease; }
.main-nav a:hover, .main-nav a:focus-visible { color: var(--green-deep); }
.site-header .button-light { background: var(--green-deep); color: #ffffff; border-radius: 11px; }
.site-header .button-light:hover { background: #096247; }
.button { display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 999px; cursor: pointer; font-weight: 780; }
.button-small { min-height: 39px; padding: 0 17px; font-size: 12px; }
.button-light { color: var(--ink); background: var(--green); transition: transform .2s ease, background .2s ease; }
.button-light:hover { transform: translateY(-1px); background: #72f0c8; }

.market-first {
  position: relative;
  overflow: hidden;
  padding: 32px clamp(18px,5vw,72px) 64px;
  background:
    radial-gradient(circle at 90% -20%, rgba(39,227,164,.14), transparent 30%),
    linear-gradient(180deg, #f8fcfa 0%, var(--paper) 68%);
}
.market-first::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 280px;
  opacity: .35;
  pointer-events: none;
  background-image: linear-gradient(rgba(7,22,37,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(7,22,37,.035) 1px, transparent 1px);
  background-size: 54px 54px;
  mask-image: linear-gradient(to bottom, #000, transparent);
}
.market-intro {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 34px;
  width: min(1380px,100%);
  margin: 0 auto 26px;
}
.eyebrow, .section-number, .board-kicker { color: var(--green-deep); font-size: 9px; font-weight: 850; text-transform: uppercase; letter-spacing: 1.8px; }
.eyebrow { display: flex; align-items: center; gap: 8px; }
.eyebrow i { width: 22px; height: 2px; background: var(--green-deep); }
.market-intro h1 { margin: 13px 0 7px; font-size: clamp(36px,4.6vw,62px); line-height: 1; letter-spacing: -3.6px; }
.market-intro h1 em { color: var(--green-deep); font-style: normal; font-weight: 530; }
.market-intro p { margin: 0; color: var(--muted); font-size: 15px; }
.market-status { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; padding: 12px 16px; border: 1px solid var(--line-dark); border-radius: 13px; background: rgba(255,255,255,.72); box-shadow: 0 8px 24px rgba(7,22,37,.05); }
.live-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 0 5px rgba(255,175,103,.14); }
.market-status strong, .market-status small { display: block; }
.market-status strong { font-size: 11px; }
.market-status small { margin-top: 2px; color: var(--muted); font-size: 9px; }

.shared-quote-banner { position: relative; z-index: 2; display: grid; grid-template-columns: 34px 1fr 30px; align-items: center; gap: 11px; width: min(1380px,100%); margin: -8px auto 14px; padding: 10px 12px; border: 1px solid #9edbc5; border-radius: 13px; background: #ecfaf4; box-shadow: 0 8px 24px rgba(7,22,37,.06); }
.shared-quote-banner[hidden] { display: none; }
.shared-quote-icon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 9px; background: var(--green); color: var(--ink); font-size: 15px; font-weight: 900; }
.shared-quote-banner strong, .shared-quote-banner div > span { display: block; }
.shared-quote-banner strong { font-size: 10px; }
.shared-quote-banner div > span { margin-top: 2px; color: var(--muted); font-size: 9px; }
.shared-quote-banner button { width: 30px; height: 30px; border: 0; border-radius: 50%; background: rgba(7,22,37,.06); color: var(--muted); cursor: pointer; font-size: 17px; }

.rate-board { position: relative; z-index: 1; width: min(1380px,100%); margin: 0 auto; overflow: hidden; border: 1px solid var(--line-dark); border-radius: 22px; background: var(--white); box-shadow: var(--shadow); }
.board-head { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 19px 22px 16px; border-bottom: 1px solid var(--line); }
.board-head h2 { display: flex; align-items: center; gap: 10px; margin: 5px 0 0; font-size: 22px; letter-spacing: -.8px; }
.source-total { display: inline-flex; align-items: center; min-height: 22px; padding: 0 8px; border-radius: 999px; background: var(--green-soft); color: var(--green-deep); font-size: 8px; font-weight: 850; letter-spacing: .3px; text-transform: uppercase; }
.update-stamp { display: grid; justify-items: end; gap: 2px; }
.update-stamp span { color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .6px; }
.update-stamp strong { font-size: 12px; }
.market-pulse { display: grid; grid-template-columns: 1.25fr repeat(3,1fr); align-items: center; border-bottom: 1px solid var(--line); background: #f8fbf9; }
.market-pulse > div { min-height: 62px; padding: 11px 18px; border-right: 1px solid var(--line); }
.market-pulse > div:last-child { border-right: 0; }
.pulse-state { display: flex; align-items: center; gap: 12px; }
.pulse-orbit { position: relative; display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid #9fd9c4; border-radius: 50%; }
.pulse-orbit::before, .pulse-orbit::after { content: ""; position: absolute; border: 1px solid rgba(15,119,88,.22); border-radius: 50%; }
.pulse-orbit::before { inset: 5px; }
.pulse-orbit::after { inset: 10px; }
.pulse-orbit i { position: relative; z-index: 1; width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px rgba(32,207,152,.14); }
.pulse-state span, .pulse-state strong, .pulse-metric span, .pulse-metric strong { display: block; }
.pulse-state div > span, .pulse-metric span { color: var(--muted); font-size: 7px; font-weight: 800; text-transform: uppercase; letter-spacing: .65px; }
.pulse-state strong { margin-top: 3px; color: var(--green-deep); font-size: 12px; }
.market-pulse.high .pulse-orbit i { background: #e66856; box-shadow: 0 0 0 4px rgba(230,104,86,.14); }
.market-pulse.high .pulse-state strong { color: #b54838; }
.market-pulse.calm .pulse-orbit i { background: #42a779; }
.pulse-metric strong { margin-top: 5px; font-size: 13px; font-variant-numeric: tabular-nums; }
.board-toolbar { display: flex; justify-content: space-between; align-items: flex-end; gap: 22px; padding: 14px 22px 16px; border-bottom: 1px solid var(--line); }
.entity-filters, .mode-switch { display: flex; align-items: center; }
.currency-picker { position: relative; width: 304px; }
.control-label { display: block; margin: 0 0 6px 2px; color: var(--muted); font-size: 8px; font-weight: 850; text-transform: uppercase; letter-spacing: .9px; }
.currency-trigger {
  width: 100%;
  min-height: 56px;
  display: grid;
  grid-template-columns: 42px minmax(0,1fr) 14px;
  align-items: center;
  gap: 11px;
  padding: 6px 13px 6px 7px;
  border: 1px solid var(--line-dark);
  border-radius: 13px;
  background: var(--white);
  color: var(--ink);
  box-shadow: 0 4px 16px rgba(7,22,37,.055);
  cursor: pointer;
  text-align: left;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.currency-trigger:hover { border-color: #9fb7aa; box-shadow: 0 6px 20px rgba(7,22,37,.08); }
.currency-trigger:focus-visible { outline: 3px solid rgba(32,207,152,.2); outline-offset: 2px; border-color: var(--green-deep); }
.currency-picker.open .currency-trigger { border-color: var(--green-deep); box-shadow: 0 0 0 3px rgba(32,207,152,.13), 0 8px 24px rgba(7,22,37,.1); }
.selected-symbol { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid #a7ddca; border-radius: 10px; background: var(--green-soft); color: var(--green-deep); font-size: 12px; font-weight: 900; letter-spacing: -.25px; }
.selected-currency { min-width: 0; }
.selected-currency strong, .selected-currency small { display: block; }
.selected-currency strong { font-size: 13px; line-height: 1.15; letter-spacing: .25px; }
.selected-currency small { margin-top: 3px; overflow: hidden; color: var(--muted); font-size: 9px; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.selector-chevron { width: 8px; height: 8px; margin-top: -4px; border-right: 1.5px solid #647582; border-bottom: 1.5px solid #647582; transform: rotate(45deg); transition: transform .18s ease, margin .18s ease; }
.currency-picker.open .selector-chevron { margin-top: 4px; transform: rotate(225deg); }
.currency-menu {
  position: absolute;
  z-index: 25;
  top: calc(100% + 8px);
  left: 0;
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 6px;
  width: 344px;
  padding: 8px;
  border: 1px solid var(--line-dark);
  border-radius: 15px;
  background: var(--white);
  box-shadow: 0 22px 55px rgba(7,22,37,.18);
}
.currency-menu[hidden] { display: none; }
.currency-option {
  display: grid;
  grid-template-columns: 34px minmax(0,1fr) 15px;
  align-items: center;
  gap: 9px;
  min-height: 58px;
  padding: 7px;
  border: 1px solid transparent;
  border-radius: 11px;
  background: #f5f8f6;
  color: var(--ink);
  cursor: pointer;
  text-align: left;
  transition: border-color .16s ease, background .16s ease, transform .16s ease;
}
.currency-option:hover { border-color: #bed1c7; background: #f0f6f3; transform: translateY(-1px); }
.currency-option:focus-visible { outline: 2px solid rgba(32,207,152,.35); outline-offset: 1px; }
.currency-option > span:first-child { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 9px; background: #e5ece8; color: var(--ink-2); font-size: 10px; font-weight: 900; }
.currency-option strong, .currency-option small { display: block; }
.currency-option strong { font-size: 11px; line-height: 1.15; letter-spacing: .2px; }
.currency-option small { margin-top: 3px; overflow: hidden; color: var(--muted); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.currency-option i { color: var(--green-deep); font-size: 11px; font-style: normal; font-weight: 900; opacity: 0; }
.currency-option.active { border-color: #9edfc8; background: var(--green-soft); }
.currency-option.active > span:first-child { border: 1px solid #9bd8c1; background: #c8eddf; color: var(--green-deep); }
.currency-option.active i { opacity: 1; }
.entity-filter, .mode-button { border: 0; cursor: pointer; }
.entity-filters { padding: 3px; border-radius: 10px; background: #edf2ef; }
.entity-filter { min-height: 31px; padding: 0 12px; border-radius: 8px; background: transparent; color: var(--muted); font-size: 10px; font-weight: 760; }
.entity-filter.active { background: var(--white); color: var(--ink); box-shadow: 0 2px 9px rgba(7,22,37,.08); }

.calculator-bar { display: grid; grid-template-columns: auto minmax(190px,.7fr) minmax(280px,1fr); gap: 18px; align-items: center; padding: 16px 22px; background: #f7faf8; border-bottom: 1px solid var(--line); }
.mode-switch { padding: 4px; border-radius: 11px; background: #e5ece8; }
.mode-button { min-height: 38px; padding: 0 14px; border-radius: 8px; background: transparent; color: var(--muted); font-size: 11px; font-weight: 760; }
.mode-button.active { background: var(--white); color: var(--ink); box-shadow: 0 2px 10px rgba(7,22,37,.08); }
.amount-field { display: grid; gap: 5px; }
.amount-field > span { color: var(--muted); font-size: 8px; font-weight: 850; text-transform: uppercase; letter-spacing: .8px; }
.amount-field > div { display: flex; align-items: center; min-height: 44px; border: 1px solid #c9d5cf; border-radius: 10px; background: var(--white); }
.amount-field b { padding-left: 12px; color: var(--green-deep); font-size: 12px; }
.amount-field input { width: 100%; min-width: 0; padding: 9px; border: 0; outline: 0; background: transparent; color: var(--ink); font-size: 16px; font-weight: 800; font-variant-numeric: tabular-nums; }
.best-result { justify-self: end; padding: 13px 16px; border: 1px solid #b9e2cf; border-radius: 13px; background: #edf9f2; text-align: right; }
.quick-amounts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px 22px; border-bottom: 1px solid var(--line); background: #fbfdfc; }
.quick-amounts > span { margin-right: 5px; color: var(--muted); font-size: 10px; font-weight: 700; }
.quick-amounts button { min-height: 33px; padding: 0 13px; border: 1px solid var(--line-dark); border-radius: 8px; background: #fff; color: var(--ink); cursor: pointer; font-size: 11px; font-weight: 800; }
.quick-amounts button.active { background: var(--green-soft); border-color: #8ccbb0; color: var(--green-deep); }
.quick-amounts small { margin-left: auto; color: var(--muted); font-size: 9px; }
.best-result span, .best-result small { display: block; }
.best-result span { color: var(--muted); font-size: 10px; }
.best-result strong { display: block; margin: 1px 0; font-size: 25px; line-height: 1.1; letter-spacing: -1px; font-variant-numeric: tabular-nums; }
.best-result small { color: var(--green-deep); font-size: 9px; font-weight: 800; }

.summary-row { display: grid; grid-template-columns: repeat(3,1fr); border-bottom: 1px solid var(--line); background: #fbfcfb; }
.summary-row > div { padding: 13px 22px; border-right: 1px solid var(--line); }
.summary-row > div:last-child { border-right: 0; }
.summary-row span, .summary-row small { display: block; }
.summary-row span { color: var(--muted); font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: .65px; }
.summary-row strong { display: inline-block; margin: 3px 8px 0 0; font-size: 17px; font-variant-numeric: tabular-nums; }
.summary-row small { display: inline; color: var(--muted); font-size: 9px; }
.summary-row .official-summary { background: #f0f5f2; }

.list-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 10px 16px 10px 22px; border-bottom: 1px solid var(--line); background: var(--white); }
.list-status strong, .list-status span { display: block; }
.list-status strong { font-size: 10px; }
.list-status span { margin-top: 2px; color: var(--muted); font-size: 8px; }
.list-actions { display: flex; align-items: center; gap: 7px; }
.list-action { min-height: 32px; padding: 0 10px; border: 1px solid var(--line-dark); border-radius: 9px; background: var(--white); color: var(--ink-2); cursor: pointer; font-size: 9px; font-weight: 800; }
.list-action span { margin-right: 3px; color: var(--green-deep); font-size: 14px; line-height: 0; }
.list-action b { display: inline-grid; place-items: center; min-width: 18px; height: 18px; margin-left: 4px; padding: 0 4px; border-radius: 999px; background: #edf3f0; font-size: 8px; }
.list-action:hover, .list-action[aria-pressed="true"] { border-color: #9ed7c2; background: var(--green-soft); color: var(--green-deep); }
.list-action:disabled { cursor: default; opacity: .45; }

.rate-table-wrap { overflow-x: auto; }
.rate-table { width: 100%; min-width: 1040px; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.rate-table th, .rate-table td { padding: 13px 16px; border-bottom: 1px solid #e8eeeb; text-align: right; white-space: nowrap; }
.rate-table th { color: #76868f; background: #fafcfb; font-size: 8px; font-weight: 850; text-transform: uppercase; letter-spacing: .75px; }
.rate-table th:first-child, .rate-table td:first-child, .rate-table th:nth-child(2), .rate-table td:nth-child(2) { text-align: left; }
.rate-table th:first-child { min-width: 330px; }
.rate-table td { font-size: 12px; }
.rate-table tbody tr { transition: background .18s ease; }
.rate-table tbody tr:hover { background: #f8fbf9; }
.rate-table tbody tr.best-row { background: var(--green-soft); }
.rate-table tbody tr.benchmark-row { background: #f5f7f6; }
.source-name { display: grid; grid-template-columns: 112px minmax(130px,1fr); align-items: center; gap: 14px; }
.source-name > div { min-width: 0; }
.entity-logo { position: relative; display: grid; place-items: center; width: 112px; height: 46px; overflow: hidden; border: 0; background: transparent; }
.entity-logo img { position: relative; z-index: 2; display: block; width: 100%; height: 100%; padding: 4px 7px; object-fit: contain; }
.entity-logo img.logo-error { display: none; }
.logo-fallback { position: absolute; inset: 3px; display: none; place-items: center; border-radius: 9px; color: var(--ink); background: #eef3f0; font-size: 9px; font-weight: 900; letter-spacing: .4px; }
.entity-logo.logo-missing .logo-fallback { display: grid; }
.entity-logo.official-logo { border-radius: 9px; background: var(--ink-2); }
.entity-logo.official-logo .logo-fallback { color: #e8d59c; background: var(--ink-2); }
.entity-class-mark { display: inline-flex; align-items: center; justify-content: center; width: 88px; min-height: 28px; padding: 0 9px; border: 1px solid #d5dfda; border-radius: 999px; background: #f2f5f3; color: #60717a; font-size: 7px; font-weight: 900; letter-spacing: .8px; }
.entity-class-mark.agent { border-color: #afe0ce; background: #e8f7f1; color: var(--green-deep); }
.entity-class-mark.official { border-color: #cfd9d4; background: #e4ebe7; color: #52646f; }
.source-name strong, .source-name small { display: block; }
.source-name strong { font-size: 12px; }
.source-name small { margin-top: 4px; color: var(--muted); font-size: 8px; }
.verified-dot { display: inline-grid; place-items: center; width: 13px; height: 13px; margin-right: 3px; border-radius: 50%; color: var(--green-deep); background: var(--green-soft); font-size: 8px; font-weight: 900; }
.freshness-dot { display: inline-block; flex: 0 0 auto; width: 6px; height: 6px; margin-right: 5px; border-radius: 50%; background: #31b982; box-shadow: 0 0 0 3px rgba(49,185,130,.1); }
.freshness-dot.aging { background: #e6a23c; box-shadow: 0 0 0 3px rgba(230,162,60,.11); }
.type-pill, .best-pill, .reference-pill, .shared-pill { display: inline-flex; align-items: center; min-height: 23px; padding: 0 8px; border-radius: 999px; font-size: 8px; font-weight: 850; text-transform: uppercase; letter-spacing: .45px; }
.type-pill { background: #edf2ef; color: #5e6f79; }
.type-pill.agent { background: #e8f7f1; color: var(--green-deep); }
.best-pill { border: 1px solid #9edfc8; background: #d9f5ea; color: var(--green-deep); }
.reference-pill { background: #e4ebe7; color: #52646f; }
.shared-pill { border: 1px solid #91cdb8; background: var(--white); color: var(--green-deep); }
.rate-table tbody tr.shared-row, .mobile-rate-card.shared-row { box-shadow: inset 3px 0 0 var(--green-deep); background: #eff9f5; }
.updated { color: var(--muted); font-size: 9px; }
.row-actions { display: inline-flex; justify-content: flex-end; gap: 5px; }
.table-actions { display: flex; align-items: center; justify-content: flex-end; gap: 6px; }
.rate-action { min-height: 29px; padding: 0 8px; border: 1px solid #d2ddd7; border-radius: 8px; background: var(--white); color: #435660; cursor: pointer; font-size: 8px; font-weight: 800; transition: border-color .16s ease, background .16s ease, color .16s ease; }
.rate-action:hover { border-color: #9ed7c2; color: var(--green-deep); }
.rate-action.active { border-color: #99d9c1; background: var(--green-soft); color: var(--green-deep); }
.rate-action .action-icon { margin-right: 3px; font-size: 12px; line-height: 0; }
.empty-rates { display: grid; justify-items: center; gap: 6px; padding: 42px 20px; text-align: center; }
.empty-rates strong { font-size: 13px; }
.empty-rates span { color: var(--muted); font-size: 10px; }
.mobile-rate-list { display: none; }
.board-footer { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 13px 20px; background: #fbfcfb; }
.board-footer p { display: flex; align-items: center; gap: 8px; margin: 0; color: var(--muted); font-size: 9px; line-height: 1.4; }
.info-mark { display: grid; place-items: center; flex: 0 0 auto; width: 18px; height: 18px; border-radius: 50%; background: #e5ebe8; color: var(--ink); font-size: 9px; font-weight: 850; }
.ghost-button { flex: 0 0 auto; min-height: 36px; padding: 0 13px; border: 1px solid #c8d5ce; border-radius: 999px; cursor: pointer; background: var(--white); color: var(--ink); font-size: 9px; font-weight: 800; }
.ghost-button:hover { border-color: var(--green-deep); color: var(--green-deep); }

.compare-dock { position: fixed; z-index: 45; left: 50%; bottom: 18px; display: flex; align-items: center; gap: 10px; min-height: 50px; padding: 7px 8px 7px 16px; border: 1px solid #acdcca; border-radius: 16px; background: rgba(255,255,255,.96); box-shadow: 0 16px 45px rgba(7,22,37,.2); transform: translateX(-50%); backdrop-filter: blur(16px); }
.compare-dock[hidden] { display: none; }
.compare-dock span { white-space: nowrap; color: var(--muted); font-size: 9px; }
.compare-dock span b { color: var(--ink); font-size: 11px; }
.compare-dock > button:not(.compare-clear) { min-height: 36px; padding: 0 13px; border: 0; border-radius: 10px; background: var(--green); color: var(--ink); cursor: pointer; font-size: 9px; font-weight: 850; }
.compare-clear { display: grid; place-items: center; width: 28px; height: 28px; border: 0; border-radius: 50%; background: #edf2ef; color: var(--muted); cursor: pointer; font-size: 17px; }

.modal-shell { position: fixed; z-index: 70; inset: 0; display: grid; place-items: center; padding: 20px; }
.modal-shell[hidden] { display: none; }
.modal-backdrop { position: absolute; inset: 0; background: rgba(4,16,28,.64); backdrop-filter: blur(6px); }
.compare-panel { position: relative; width: min(760px,100%); max-height: min(720px,calc(100vh - 40px)); overflow: auto; border: 1px solid rgba(255,255,255,.4); border-radius: 22px; background: var(--white); box-shadow: 0 30px 90px rgba(0,0,0,.28); }
.compare-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 20px 22px 16px; border-bottom: 1px solid var(--line); }
.compare-panel > header span { color: var(--green-deep); font-size: 8px; font-weight: 850; text-transform: uppercase; letter-spacing: 1.2px; }
.compare-panel h2 { margin: 5px 0 0; font-size: 22px; letter-spacing: -.8px; }
.modal-close { display: grid; place-items: center; flex: 0 0 auto; width: 36px; height: 36px; border: 1px solid var(--line); border-radius: 50%; background: #f5f8f6; color: var(--ink); cursor: pointer; font-size: 21px; }
.compare-content { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; padding: 16px 22px 20px; }
.compare-card { min-width: 0; padding: 14px; border: 1px solid var(--line); border-radius: 15px; background: #f8faf9; }
.compare-card.best-choice { border-color: #9bdac3; background: var(--green-soft); }
.compare-card .entity-logo { width: 100%; height: 44px; justify-items: start; }
.compare-card .entity-logo img { width: 118px; padding-left: 0; }
.compare-card h3 { margin: 11px 0 3px; overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.compare-card > span { color: var(--muted); font-size: 8px; }
.compare-rates { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 13px; padding-top: 12px; border-top: 1px solid rgba(7,22,37,.1); }
.compare-rates span, .compare-rates strong { display: block; }
.compare-rates span { color: var(--muted); font-size: 7px; font-weight: 850; text-transform: uppercase; letter-spacing: .5px; }
.compare-rates strong { margin-top: 4px; font-size: 13px; }
.compare-result { margin-top: 10px; padding: 10px; border-radius: 10px; background: var(--white); }
.compare-result span, .compare-result strong { display: block; }
.compare-result span { color: var(--muted); font-size: 8px; }
.compare-result strong { margin-top: 3px; font-size: 17px; }
.compare-panel > footer { display: flex; justify-content: flex-end; padding: 14px 22px 20px; border-top: 1px solid var(--line); }
body.modal-open { overflow: hidden; }

.alert-panel { position: relative; width: min(560px,100%); max-height: min(720px,calc(100vh - 40px)); overflow: auto; border-radius: 22px; background: var(--white); box-shadow: 0 30px 90px rgba(0,0,0,.28); }
.alert-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px 22px 16px; border-bottom: 1px solid var(--line); }
.alert-panel > header span { color: var(--green-deep); font-size: 8px; font-weight: 850; text-transform: uppercase; letter-spacing: 1.2px; }
.alert-panel h2 { margin: 5px 0 0; font-size: 22px; letter-spacing: -.8px; }
.alert-panel form { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 18px 22px; }
.alert-panel form label { display: grid; gap: 6px; }
.alert-panel form label:nth-child(3), .alert-panel form button, .alert-panel form p { grid-column: 1 / -1; }
.alert-panel form label > span, .saved-alerts > span { color: var(--muted); font-size: 8px; font-weight: 850; text-transform: uppercase; letter-spacing: .7px; }
.alert-panel select, .alert-rate-input { min-height: 44px; border: 1px solid var(--line-dark); border-radius: 10px; background: var(--white); color: var(--ink); }
.alert-panel select { width: 100%; padding: 0 11px; }
.alert-rate-input { display: flex; align-items: center; }
.alert-rate-input b { padding-left: 12px; color: var(--green-deep); font-size: 11px; }
.alert-rate-input input { width: 100%; min-width: 0; padding: 10px; border: 0; outline: 0; background: transparent; font-size: 15px; font-weight: 800; }
.alert-panel form .button { min-height: 43px; }
.alert-panel form p { margin: 0; color: var(--muted); font-size: 8px; line-height: 1.5; }
.saved-alerts { padding: 0 22px 22px; }
.saved-alerts > span { display: block; margin-bottom: 8px; }
#alerts-list { display: grid; gap: 7px; }
.saved-alert { display: grid; grid-template-columns: 38px 1fr 28px; align-items: center; gap: 9px; padding: 8px; border: 1px solid var(--line); border-radius: 11px; background: #f7faf8; }
.saved-alert > b { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 9px; background: var(--green-soft); color: var(--green-deep); font-size: 10px; }
.saved-alert strong, .saved-alert span { display: block; }
.saved-alert strong { font-size: 10px; }
.saved-alert span { margin-top: 2px; color: var(--muted); font-size: 8px; }
.saved-alert button { width: 28px; height: 28px; border: 0; border-radius: 50%; background: #e9efec; color: var(--muted); cursor: pointer; }
.saved-alerts-empty { padding: 13px; border: 1px dashed var(--line-dark); border-radius: 10px; color: var(--muted); font-size: 9px; text-align: center; }

.value-strip { display: grid; grid-template-columns: repeat(3,1fr) 1.35fr; align-items: center; gap: 0; padding: 0 clamp(18px,5vw,72px); color: #f4faf7; background: var(--ink-2); }
.value-strip > div { display: flex; align-items: center; gap: 10px; min-height: 76px; border-right: 1px solid rgba(255,255,255,.12); }
.value-strip > div + div { padding-left: 26px; }
.value-strip div > span { color: var(--green); font-size: 9px; font-weight: 900; }
.value-strip p { margin: 0; font-size: 11px; }
.value-strip p strong { display: block; font-size: 14px; }
.strip-slogan { padding-left: 28px; color: var(--green); font-size: 15px; text-align: right; }

.agent-engine { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(40px,7vw,110px); align-items: center; padding: 82px clamp(18px,7vw,110px); background: #edf3f0; }
.agent-engine-copy h2 { margin: 20px 0 15px; font-size: clamp(38px,4.5vw,62px); line-height: 1; letter-spacing: -3px; }
.agent-engine-copy h2 em { color: var(--green-deep); font-style: normal; font-weight: 530; }
.agent-engine-copy p { max-width: 560px; margin: 0 0 28px; color: var(--muted); font-size: 13px; line-height: 1.65; }
.agent-engine-button { min-height: 46px; padding: 0 18px; background: var(--ink); color: var(--white); text-decoration: none; font-size: 11px; }
.agent-engine-button span { margin-left: 10px; color: var(--green); font-size: 17px; }
.agent-engine-visual { display: grid; grid-template-columns: .85fr auto 1.15fr; align-items: center; gap: 18px; padding: clamp(18px,3vw,34px); border: 1px solid var(--line-dark); border-radius: 22px; background: var(--white); box-shadow: 0 24px 60px rgba(7,22,37,.1); }
.engine-source { display: grid; gap: 9px; padding: 17px; border-radius: 15px; background: var(--ink); color: var(--white); }
.engine-source > span { color: var(--green); font-size: 8px; font-weight: 850; text-transform: uppercase; letter-spacing: .8px; }
.engine-source strong { display: flex; justify-content: space-between; gap: 10px; font-size: 9px; font-weight: 650; }
.engine-source b { color: var(--green); font-size: 12px; }
.engine-arrow { color: var(--green-deep); font-size: 22px; }
.engine-outputs { display: grid; gap: 7px; }
.engine-outputs > div { display: grid; grid-template-columns: 26px 1fr; column-gap: 9px; align-items: center; padding: 9px 10px; border: 1px solid var(--line); border-radius: 11px; background: #f7faf8; }
.engine-outputs span { grid-row: 1 / 3; color: var(--green-deep); font-size: 8px; font-weight: 900; }
.engine-outputs strong { font-size: 10px; }
.engine-outputs small { color: var(--muted); font-size: 8px; }

.audience-section { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; padding: 82px clamp(18px,5vw,72px); }
.audience-card { min-height: 430px; padding: clamp(30px,4.5vw,58px); border-radius: 24px; }
.audience-card h2 { max-width: 600px; margin: 24px 0 16px; font-size: clamp(34px,4.1vw,57px); line-height: 1.02; letter-spacing: -2.8px; }
.audience-card > p { max-width: 540px; margin: 0; font-size: 14px; line-height: 1.65; }
.audience-card ul { display: grid; gap: 11px; margin: 28px 0 34px; padding: 0; list-style: none; font-size: 12px; }
.audience-card li { display: flex; align-items: center; gap: 9px; }
.audience-card li span { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: var(--green-soft); color: var(--green-deep); font-size: 9px; font-weight: 900; }
.audience-card > a { display: inline-flex; gap: 10px; align-items: center; font-size: 12px; font-weight: 850; text-decoration: none; }
.audience-card > a span { color: var(--green-deep); font-size: 17px; }
.people-card { border: 1px solid var(--line); background: var(--white); }
.people-card > p, .people-card ul { color: var(--muted); }
.business-card { color: #f4faf7; background: radial-gradient(circle at 90% 10%, rgba(39,227,164,.17), transparent 28%), var(--ink); }
.business-card .section-number { color: var(--green); }
.business-card > p { color: #a1b4be; }
.business-card > a span { color: var(--green); }
.business-metric { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 30px 0 42px; padding: 18px; border: 1px solid rgba(255,255,255,.12); border-radius: 15px; background: rgba(255,255,255,.04); }
.business-metric span, .business-metric strong { display: block; }
.business-metric span { color: #8096a2; font-size: 8px; text-transform: uppercase; letter-spacing: .8px; }
.business-metric strong { margin-top: 5px; font-size: 19px; }
.business-metric div:last-child strong { color: var(--green); }

.method-section { display: grid; grid-template-columns: .75fr 1.25fr; gap: 80px; padding: 88px clamp(18px,7vw,110px); background: #e4ece8; }
.method-section h2 { margin: 20px 0 0; font-size: clamp(40px,4.8vw,66px); line-height: 1; letter-spacing: -3.4px; }
.method-section ol { margin: 0; padding: 0; list-style: none; border-top: 1px solid #c3d1ca; }
.method-section li { display: grid; grid-template-columns: 46px 1fr; gap: 20px; padding: 22px 0; border-bottom: 1px solid #c3d1ca; }
.method-section li > span { padding-top: 3px; color: var(--green-deep); font-size: 9px; font-weight: 900; }
.method-section li strong { font-size: 17px; }
.method-section li p { margin: 6px 0 0; color: var(--muted); font-size: 12px; line-height: 1.55; }

.site-footer { display: grid; grid-template-columns: auto 1fr auto; gap: 46px; align-items: center; padding: 30px clamp(18px,5vw,72px); color: #8fa4af; background: #04101c; }
.footer-brand { display: flex; align-items: center; gap: 10px; }
.footer-brand > div { display: grid; }
.footer-brand strong { color: #f1f7f4; font-size: 14px; }
.footer-brand span { margin-top: 3px; color: var(--green); font-size: 7px; font-weight: 750; text-transform: uppercase; letter-spacing: 1.3px; }
.site-footer p { max-width: 720px; margin: 0; font-size: 8px; line-height: 1.6; }
.site-footer > span { color: #d9e6e1; font-size: 10px; font-weight: 700; text-align: right; }

.toast { position: fixed; z-index: 50; right: 20px; bottom: 20px; display: grid; gap: 3px; width: min(340px,calc(100% - 40px)); padding: 15px 17px; border: 1px solid rgba(255,255,255,.13); border-radius: 14px; background: var(--ink); color: #f4faf7; box-shadow: 0 20px 55px rgba(0,0,0,.25); opacity: 0; transform: translateY(15px); pointer-events: none; transition: opacity .22s ease, transform .22s ease; }
.toast.show { opacity: 1; transform: translateY(0); }
.toast strong { font-size: 12px; }
.toast span { color: #a2b5bf; font-size: 10px; }

@media (max-width: 1080px) {
  .main-nav { display: none; }
  .site-header { grid-template-columns: 1fr auto; }
  .calculator-bar { grid-template-columns: 1fr 1fr; }
  .best-result { grid-column: 1 / -1; justify-self: stretch; padding-top: 12px; border-top: 1px solid var(--line); text-align: left; }
  .value-strip { grid-template-columns: repeat(3,1fr); }
  .strip-slogan { grid-column: 1 / -1; padding: 13px 0; border-top: 1px solid rgba(255,255,255,.12); text-align: center; }
  .site-footer { grid-template-columns: 1fr; gap: 18px; }
  .site-footer > span { text-align: left; }
}

@media (max-width: 760px) {
  .site-header { grid-template-columns: 1fr auto; gap: 8px; padding: 12px 16px; }
  .site-header .brand { grid-column: 1 / -1; justify-self: center; margin-bottom: 5px; }
  .header-market-link { display: inline-flex; align-items: center; min-height: 36px; color: var(--green-deep); font-size: 12px; font-weight: 800; text-decoration: none; }
  .site-header .button-small { min-height: 36px; padding-inline: 13px; }
  .brand img { width: 64px; height: 64px; }
  .brand-name { font-size: 32px; }
  .market-first { padding: 22px 12px 44px; }
  .market-intro { display: block; margin-bottom: 18px; padding-inline: 5px; }
  .market-intro h1 { max-width: 520px; margin-top: 10px; font-size: 34px; letter-spacing: -1.9px; }
  .market-intro p { max-width: 520px; font-size: 13px; line-height: 1.5; }
  .market-status { display: none; }
  .shared-quote-banner { margin: -5px auto 11px; }
  .rate-board { border-radius: 17px; }
  .board-head { padding: 16px; }
  .board-head h2 { font-size: 19px; }
  .update-stamp span { display: none; }
  .market-pulse { grid-template-columns: 1fr 1fr 1fr; }
  .market-pulse > div { min-height: 56px; padding: 9px 11px; }
  .market-pulse .pulse-state { grid-column: 1 / -1; min-height: 50px; border-right: 0; border-bottom: 1px solid var(--line); }
  .pulse-orbit { width: 30px; height: 30px; }
  .pulse-metric strong { font-size: 11px; }
  .board-toolbar { align-items: stretch; flex-direction: column; gap: 13px; padding: 13px 14px 14px; }
  .currency-picker { width: 100%; }
  .currency-trigger { min-height: 58px; }
  .currency-menu { width: 100%; grid-template-columns: 1fr; }
  .entity-filters { align-self: flex-start; }
  .calculator-bar { grid-template-columns: 1fr; padding: 14px; }
  .mode-switch { width: 100%; }
  .mode-button { flex: 1; }
  .best-result { grid-column: auto; }
  .best-result strong { font-size: 24px; }
  .quick-amounts { padding: 11px 14px; gap: 6px; }
  .quick-amounts > span { width: 100%; margin: 0 0 2px; }
  .quick-amounts small { margin-left: 4px; font-size: 8px; }
  .summary-row { grid-template-columns: 1fr 1fr; }
  .summary-row > div { padding: 11px 14px; }
  .summary-row > div:nth-child(2) { border-right: 0; }
  .summary-row .official-summary { grid-column: 1 / -1; border-top: 1px solid var(--line); }
  .list-toolbar { align-items: flex-start; padding: 10px 12px; }
  .list-status span { max-width: 175px; line-height: 1.35; }
  .list-actions { gap: 5px; }
  .list-action { min-height: 31px; padding: 0 8px; }
  .rate-table-wrap { display: none; }
  .mobile-rate-list { display: grid; }
  .mobile-rate-card { padding: 11px 12px 10px; border-bottom: 1px solid var(--line); background: var(--white); }
  .mobile-rate-card.best-row { background: #f0fbf6; box-shadow: inset 3px 0 0 var(--green); }
  .mobile-rate-card.benchmark-row { background: #f4f7f5; }
  .mobile-card-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
  .mobile-card-head .source-name { grid-template-columns: 72px minmax(0,1fr); min-width: 0; gap: 9px; }
  .mobile-card-head .source-name strong { max-width: 180px; overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
  .mobile-card-head .source-name small { display: flex; align-items: center; margin-top: 3px; font-size: 7px; }
  .mobile-card-head .entity-logo { width: 72px; height: 32px; }
  .mobile-card-head .entity-logo img { padding: 2px 3px; }
  .mobile-card-head .best-pill, .mobile-card-head .reference-pill, .mobile-card-head .shared-pill { min-height: 20px; padding-inline: 7px; font-size: 7px; white-space: nowrap; }
  .mobile-card-rates { display: grid; grid-template-columns: .85fr .85fr 1.3fr; gap: 8px; margin-top: 9px; padding-top: 9px; border-top: 1px solid rgba(7,22,37,.08); }
  .mobile-card-rates span, .mobile-card-rates strong { display: block; }
  .mobile-card-rates span { color: var(--muted); font-size: 7px; font-weight: 800; text-transform: uppercase; letter-spacing: .55px; }
  .mobile-card-rates strong { margin-top: 3px; font-size: 12px; font-variant-numeric: tabular-nums; }
  .mobile-card-rates .mobile-result { text-align: right; }
  .mobile-card-actions { display: flex; justify-content: flex-end; gap: 5px; margin-top: 8px; }
  .mobile-card-actions .rate-action { min-height: 28px; padding-inline: 9px; }
  .mobile-rate-card.benchmark-row .mobile-card-actions { display: none; }
  .board-footer { align-items: flex-start; flex-direction: column; padding: 13px 14px; }
  .ghost-button { width: 100%; }
  .compare-dock { bottom: 78px; width: calc(100% - 28px); justify-content: space-between; }
  .modal-shell { align-items: end; padding: 0; }
  .compare-panel { width: 100%; max-height: 84vh; border-radius: 22px 22px 0 0; }
  .compare-panel > header { padding: 17px 16px 14px; }
  .compare-panel h2 { font-size: 19px; }
  .compare-content { grid-template-columns: 1fr; padding: 12px 14px 16px; }
  .compare-card { display: grid; grid-template-columns: 92px 1fr; column-gap: 12px; align-items: center; padding: 11px; }
  .compare-card .entity-logo { grid-row: 1 / 5; height: 44px; }
  .compare-card .entity-logo img { width: 88px; }
  .compare-card h3 { margin: 0 0 2px; }
  .compare-rates { margin-top: 8px; padding-top: 8px; }
  .compare-result { grid-column: 1 / -1; }
  .compare-panel > footer { padding: 12px 14px 20px; }
  .compare-panel > footer .button { width: 100%; min-height: 42px; }
  .alert-panel { width: 100%; max-height: 88vh; border-radius: 22px 22px 0 0; }
  .alert-panel > header { padding: 17px 16px 14px; }
  .alert-panel h2 { font-size: 19px; }
  .alert-panel form { padding: 15px 16px; }
  .saved-alerts { padding: 0 16px 20px; }
  .value-strip { grid-template-columns: 1fr; padding-inline: 20px; }
  .value-strip > div { min-height: 62px; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.12); }
  .value-strip > div + div { padding-left: 0; }
  .strip-slogan { grid-column: auto; padding: 16px 0; text-align: left; }
  .agent-engine { grid-template-columns: 1fr; gap: 32px; padding: 58px 18px; }
  .agent-engine-copy h2 { font-size: 39px; letter-spacing: -2.4px; }
  .agent-engine-button { width: 100%; }
  .agent-engine-visual { grid-template-columns: 1fr; gap: 10px; padding: 15px; }
  .engine-arrow { transform: rotate(90deg); justify-self: center; }
  .audience-section { grid-template-columns: 1fr; padding: 56px 14px; }
  .audience-card { min-height: auto; padding: 31px 24px; border-radius: 20px; }
  .audience-card h2 { letter-spacing: -2.1px; }
  .business-metric { grid-template-columns: 1fr; }
  .method-section { grid-template-columns: 1fr; gap: 38px; padding: 66px 22px; }
  .method-section h2 { letter-spacing: -2.7px; }
  .site-footer { padding: 28px 20px; }
}

@media (max-width: 390px) {
  .site-header .button-small { min-height: 34px; padding-inline: 10px; font-size: 10px; }
  .site-header { gap: 8px; }
  .summary-row strong { display: block; }
  .summary-row small { display: block; margin-top: 2px; }
  .list-status span { display: none; }
  .list-action { font-size: 8px; }
  .mobile-card-head .source-name strong { max-width: 140px; }
  .compare-dock > span { display: none; }
  .compare-dock > button:not(.compare-clear) { flex: 1; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* Personal Radar: a decision workspace before the entity directory. */
.market-first { background: #f4f7f5; }
.market-first::before { display: none; }
.personal-head { display: flex; align-items: center; justify-content: space-between; gap: 30px; width: min(1380px,100%); margin: 0 auto 28px; }
.personal-head h1 { margin: 14px 0 0; color: #123a2e; font-size: clamp(52px,6vw,88px); line-height: .9; letter-spacing: -5px; }
.personal-head h1 br { display: none; }
.personal-head h1 em { color: #138963; font-weight: 550; font-style: normal; }
.personal-head > p { margin: 0; color: #65766d; font-size: 16px; line-height: 1.6; }
.personal-radar { display: grid; grid-template-columns: .9fr 1.1fr; width: min(1380px,100%); margin: 0 auto; border: 1px solid #d1ddd5; border-radius: 26px; background: #fff; box-shadow: 0 18px 48px rgba(20,63,46,.07); }
.personal-controls { min-width: 0; padding: 30px; }
.personal-step { display: grid; grid-template-columns: 34px 1fr; column-gap: 10px; align-items: center; margin-bottom: 24px; }
.personal-step > span { grid-row: 1 / 3; display: grid; place-items: center; width: 34px; height: 34px; background: #e5f3eb; border-radius: 50%; color: #138963; font-size: 11px; font-weight: 900; }
.personal-step strong { font-size: 17px; letter-spacing: -.4px; }
.personal-step small { margin-top: 3px; color: #7b8b82; font-size: 10px; }
.personal-controls .currency-picker { width: 100%; }
.personal-controls .currency-trigger { min-height: 60px; border-radius: 12px; box-shadow: none; }
.personal-controls .currency-menu { width: 100%; z-index: 20; }
.personal-controls .calculator-bar { display: grid; grid-template-columns: 1fr; gap: 17px; padding: 18px 0 0; border: 0; background: #fff; }
.personal-controls .mode-switch { width: 100%; }
.personal-controls .mode-button { flex: 1; min-height: 42px; font-size: 12px; }
.personal-controls .amount-field { width: 100%; }
.personal-controls .amount-field > div { min-height: 69px; border-radius: 12px; }
.personal-controls .amount-field input { font-size: 32px; }
.personal-controls .quick-amounts { gap: 8px; padding: 12px 0; border: 0; background: #fff; }
.personal-controls .quick-amounts > span, .personal-controls .quick-amounts small { display: none; }
.personal-controls .quick-amounts button { flex: 1; }
.personal-save { display: grid; gap: 9px; margin-top: 13px; }
.personal-save button { display: flex; align-items: center; justify-content: space-between; min-height: 48px; padding: 0 15px; border: 0; border-radius: 12px; background: #138963; color: #fff; cursor: pointer; font-size: 13px; font-weight: 800; }
.personal-save > span { color: #75857c; font-size: 10px; }
.personal-outcome { min-width: 0; padding: 30px; border-radius: 0 25px 25px 0; background: radial-gradient(circle at 100% 0%,#d6f6bc,transparent 50%),#e7f4e8; }
.outcome-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; color: #285340; font-size: 9px; font-weight: 850; letter-spacing: 1px; }
.outcome-top b { padding: 6px 8px; border: 1px solid #b7d6b5; border-radius: 6px; font-size: 8px; letter-spacing: .5px; }
.personal-outcome .best-result { margin: 27px 0 24px; padding: 0; border: 0; background: transparent; text-align: left; }
.personal-outcome .best-result span { color: #39654e; font-size: 13px; }
.personal-outcome .best-result strong { margin: 8px 0 7px; color: #123a2e; font-size: clamp(36px,4.5vw,64px); letter-spacing: -2.5px; }
.personal-outcome .best-result small { color: #477057; font-size: 11px; line-height: 1.5; }
.route-comparison { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; padding: 17px; border: 1px solid #c2d9bd; border-radius: 14px; background: rgba(255,255,255,.68); }
.route-comparison div { min-width: 0; }
.route-comparison div > span { display: block; color: #6b8271; font-size: 10px; }
.route-comparison strong { display: block; margin-top: 6px; color: #244b37; font-size: clamp(17px,2vw,25px); letter-spacing: -.7px; }
.route-comparison small { display: block; margin-top: 5px; color: #6b8271; font-size: 9px; line-height: 1.5; }
.route-vs { color: #7b917e; font-size: 11px; }
.advantage { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 5px 12px; margin-top: 15px; }
.advantage > span { color: #315640; font-size: 11px; font-weight: 750; }
.advantage strong { grid-row: 1 / 3; grid-column: 2; color: #138963; font-size: 27px; letter-spacing: -1px; }
.advantage small { color: #65806d; font-size: 9px; line-height: 1.5; }
.outcome-link { display: flex; justify-content: space-between; margin-top: 23px; padding-top: 15px; border-top: 1px solid #bdd6b8; color: #24513c; font-size: 12px; font-weight: 800; text-decoration: none; }
.personal-target { display: grid; grid-template-columns: 1.1fr .65fr 1fr; align-items: center; gap: 25px; width: min(1380px,100%); margin: 18px auto 0; padding: 23px 28px; border: 1px solid #d1ddd5; border-radius: 18px; background: #fff; }
.personal-target > div > span, .market-section-title span { color: #138963; font-size: 9px; font-weight: 850; letter-spacing: 1px; }
.personal-target h2 { max-width: 300px; margin: 8px 0 0; font-size: 22px; letter-spacing: -.7px; }
.personal-target label > span { display: block; margin-bottom: 5px; color: #738278; font-size: 10px; }
.personal-target label > div { display: flex; align-items: center; min-height: 46px; border: 1px solid #cbd8cf; border-radius: 9px; }
.personal-target b { padding-left: 12px; color: #138963; font-size: 12px; }
.personal-target input { width: 100%; min-width: 0; padding: 9px; border: 0; border-radius: 9px; background: transparent; color: #123a2e; font-size: 20px; font-weight: 750; }
.personal-target p { margin: 0; color: #718078; font-size: 11px; line-height: 1.65; }
.personal-target p.target-reached { color: #138963; font-weight: 700; }
.market-section-title { display: flex; align-items: end; justify-content: space-between; gap: 20px; width: min(1380px,100%); margin: 45px auto 18px; scroll-margin-top: 20px; }
.market-section-title h2 { margin: 8px 0 0; font-size: 32px; letter-spacing: -1px; }
.market-section-title p { margin: 0; color: #718078; font-size: 12px; }
.daily-radar { width: min(1380px,100%); margin: 18px auto 0; overflow: hidden; border: 1px solid #d1ddd5; border-radius: 18px; background: #123a2e; color: #fff; }
.daily-radar > header { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px 24px; border-bottom: 1px solid rgba(255,255,255,.12); }
.daily-radar > header span { color: #8de5bd; font-size: 9px; font-weight: 850; letter-spacing: 1px; }
.daily-radar > header h2 { margin: 7px 0 0; font-size: 25px; letter-spacing: -.8px; }
.daily-radar > header > b { padding: 6px 8px; border: 1px solid rgba(255,255,255,.18); border-radius: 6px; color: #b8cbc2; font-size: 8px; letter-spacing: .6px; }
.daily-grid { display: grid; grid-template-columns: 1.15fr 1fr 1fr; }
.daily-grid article { min-width: 0; padding: 23px 24px; border-right: 1px solid rgba(255,255,255,.12); }
.daily-grid article:last-child { border-right: 0; }
.daily-grid article > span { color: #8fa99c; font-size: 8px; font-weight: 850; letter-spacing: .8px; }
.daily-grid article > strong { display: block; margin-top: 11px; color: #fff; font-size: 24px; letter-spacing: -.7px; }
.daily-grid article > strong.positive { color: #75e0ad; }
.daily-grid article > strong.negative { color: #ffae95; }
.daily-grid article > p { min-height: 32px; margin: 7px 0 0; color: #a9bdb3; font-size: 10px; line-height: 1.55; }
.daily-main > div { display: flex; align-items: end; justify-content: space-between; gap: 15px; margin-top: 17px; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.12); }
.daily-main > div span { color: #a9bdb3; font-size: 9px; }
.daily-main > div b { color: #8de5bd; font-size: 19px; }
.board-toolbar { justify-content: flex-end; }
@media (max-width: 760px) {
  .personal-head { align-items: end; gap: 15px; margin-bottom: 20px; padding: 0 4px; }
  .personal-head .eyebrow { font-size: 8px; letter-spacing: .8px; }
  .personal-head h1 { font-size: 57px; line-height: .93; letter-spacing: -3px; }
  .personal-head h1 br { display: block; }
  .personal-head > p { max-width: 112px; font-size: 11px; line-height: 1.6; }
  .personal-radar { grid-template-columns: 1fr; border-radius: 20px; }
  .personal-controls { padding: 19px; }
  .personal-step { margin-bottom: 17px; }
  .personal-step strong { font-size: 15px; }
  .personal-controls .currency-trigger { min-height: 52px; }
  .personal-controls .calculator-bar { grid-template-columns: 1fr; gap: 12px; padding-top: 12px; }
  .personal-controls .amount-field > div { min-height: 58px; }
  .personal-save { margin-top: 5px; }
  .personal-outcome { padding: 22px 19px; border-radius: 0 0 19px 19px; }
  .personal-outcome .best-result { margin: 20px 0; }
  .personal-outcome .best-result strong { font-size: 45px; }
  .route-comparison { gap: 9px; padding: 13px; }
  .advantage strong { font-size: 25px; }
  .personal-target { grid-template-columns: 1fr; gap: 16px; padding: 21px; }
  .personal-target h2 { max-width: 100%; font-size: 23px; }
  .market-section-title { margin-top: 31px; padding: 0 4px; }
  .market-section-title h2 { font-size: 27px; }
  .market-section-title p { display: none; }
  .daily-radar > header { align-items: flex-start; padding: 18px; }
  .daily-radar > header h2 { font-size: 22px; }
  .daily-radar > header > b { max-width: 120px; text-align: right; }
  .daily-grid { grid-template-columns: 1fr 1fr; }
  .daily-grid article { padding: 18px; border-bottom: 1px solid rgba(255,255,255,.12); }
  .daily-grid .daily-main { grid-column: 1 / -1; border-right: 0; }
  .daily-grid article:nth-child(2) { border-bottom: 0; }
  .daily-grid article:last-child { border-bottom: 0; }
  .daily-grid article > strong { font-size: 20px; }
  .mobile-rate-card { padding: 15px 14px 13px; }
  .mobile-card-head { display: grid; grid-template-columns: 88px minmax(0,1fr); align-items: center; gap: 12px; }
  .mobile-card-head .entity-logo { width: 88px; height: 46px; }
  .mobile-card-head .entity-logo img { padding: 3px; }
  .mobile-source-copy { min-width: 0; }
  .mobile-source-line { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
  .mobile-source-line > strong { min-width: 0; color: var(--ink); font-size: 14px; line-height: 1.25; white-space: normal; }
  .mobile-source-line .best-pill, .mobile-source-line .reference-pill, .mobile-source-line .shared-pill { flex: 0 0 auto; min-height: 20px; padding-inline: 6px; font-size: 6.5px; }
  .mobile-source-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 5px 8px; margin-top: 6px; }
  .mobile-source-meta > span { color: var(--green-deep); font-size: 8px; font-weight: 800; }
  .mobile-source-meta > small { display: flex; align-items: center; color: var(--muted); font-size: 8px; }
  .mobile-card-rates { margin-top: 13px; padding-top: 12px; }
  .mobile-card-rates strong { font-size: 14px; }
  .mobile-card-rates span { font-size: 7.5px; }
}