@font-face{font-family:Roboto;src:url('/fonts/roboto-latin.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:Roboto;src:url('/fonts/roboto-latin-ext.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}

html:root{
  
  --bg:#fff;--surface:#f9f9f9;--chip:#f2f2f2;--chip-hover:#e5e5e5;
  --ink:#0f0f0f;--ink-soft:#272727;--muted:#606060;--muted-soft:#717171;
  --line:#e5e5e5;--line-strong:#ccc;--link:#065fd4;--brand:#1a7a47;
  --focus:#0f0f0f;--radius:12px;--radius-sm:8px;--header-h:56px;
  --wrap-pad:16px;
  
  --text:#0f0f0f;--text-sec:#606060;
  --hover:#f2f2f2;--hover-strong:#e5e5e5;--soft:#f2f2f2;
  --accent:#1a7a47;--money:#0f0f0f;
  --pill-active-bg:#0f0f0f;--pill-active-fg:#fff;
  --shadow:none;
  --shadow-card:0 0 0 1px #e5e5e5;
  --shadow-float:0 0 0 1px #e5e5e5,0 1px 2px rgba(15,15,15,.04);
  --radius-lg:12px;
  color-scheme:light;
}

html:root:has(body .topbar nav){--surface:#fff}

html ::selection{background:rgba(15,15,15,.12)}
:where(html) :focus-visible{outline:2px solid var(--focus);outline-offset:2px}
html body:has(.toolnav) :is(a,button,summary):focus-visible{outline:2px solid var(--focus);outline-offset:2px}

html .topbar:has(nav),
html .topbar.scrolled:has(nav){background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none;border-bottom:1px solid var(--line);box-shadow:none}
html .topbar:has(nav) .wrap{min-height:var(--header-h)}
html .topbar:has(nav) .brand{color:var(--ink);font-size:1.125rem;font-weight:700;letter-spacing:-.02em}
html .topbar:has(nav) .brand span,
html body:has(.toolnav) .fbrand span{color:var(--brand)}

html body:has(.toolnav) .topbar .brand svg rect{fill:var(--ink)}
html body:has(.toolnav) .topbar .brand svg circle{fill:var(--brand)}
html .topbar .toolnav a,
html body:has(.board) .topbar nav a,
html body:has(.list-card) .topbar nav a{min-height:44px;display:inline-flex;align-items:center;padding:0 12px;border-radius:var(--radius-sm);color:var(--muted);font-size:.875rem;font-weight:500}
html .topbar .toolnav a:hover,
html .topbar .toolnav a[aria-current=page],
html body:has(.board) .topbar nav a:hover,
html body:has(.board) .topbar nav a[aria-current=page],
html body:has(.list-card) .topbar nav a:hover,
html body:has(.list-card) .topbar nav a[aria-current=page]{background:var(--chip);color:var(--ink)}

html body:has(nav) .wrap{width:100%;max-width:calc(1140px + 2 * var(--wrap-pad));padding-inline:var(--wrap-pad);margin-inline:auto}

html body:has(.toolnav){background:var(--bg);color:var(--ink)}
html body:has(.toolnav) .hero{padding-top:clamp(20px,3vw,32px)}
html body:has(.toolnav) .hero h1{font-size:clamp(1.75rem,4vw,2.5rem);font-weight:700;line-height:1.15;letter-spacing:-.02em;max-width:24ch}
html body:has(.toolnav) .eyebrow::before,
html body:has(.toolnav) .section-kicker::before,
html body:has(.toolnav) .hero-eyebrow::before,
html body:has(.toolnav) .sec-eyebrow::before{display:none}
html body:has(.toolnav) .eyebrow,
html body:has(.toolnav) .section-kicker,
html body:has(.toolnav) .hero-eyebrow,
html body:has(.toolnav) .sec-eyebrow{gap:0;color:var(--muted);font-weight:500;letter-spacing:.06em}

html .calculator{border-radius:var(--radius);box-shadow:none;border-color:var(--line);background:#fff}
html .calculator::before{display:none}
html .calculator .result-pane{background:#f9f9f9;border-color:var(--line)}
html .calculator .result-amount{color:var(--ink);font-weight:700;letter-spacing:-.03em}
html .calculator .input-wrap input{border-radius:var(--radius-sm)}
html .calculator .input-wrap input:focus-visible,
html .calculator .segmented input:focus-visible+span{outline:2px solid var(--link);outline-offset:1px;border-color:var(--link)}
html .calculator .segmented span{border-radius:var(--radius-sm)}
html body:has(.toolnav) .tool-card{border-radius:var(--radius)}
html body:has(.toolnav) .tool-card:hover{border-color:var(--line-strong);background:var(--surface)}
html body:has(.toolnav) .content h2{font-weight:700;letter-spacing:-.02em;font-size:clamp(1.375rem,3vw,1.875rem)}
html body:has(.toolnav) > footer{background:#fff}
html body:has(.toolnav) .views-input{color:var(--ink)}

html body:has(.toolnav) .calc-card,
html body:has(.toolnav) .calc-shell{box-shadow:0 0 0 1px var(--line);border-radius:var(--radius)}
html body:has(.toolnav) .limit{border-left-color:var(--line-strong)}
html body:has(.toolnav) input[type=range]:active::-webkit-slider-thumb{box-shadow:0 0 0 6px rgba(15,15,15,.08),0 2px 6px rgba(15,15,15,.2)}

html body:has(.board),
html body:has(.list-card){background:var(--bg);color:var(--ink);font-size:15px}
html body:has(.board) .hero,
html body:has(.list-card) .hero{padding-top:clamp(16px,2.5vw,24px);padding-bottom:8px}
html body:has(.board) .hero h1,
html body:has(.list-card) .hero h1{font-size:clamp(1.375rem,3vw,1.75rem);font-weight:700;line-height:1.15;letter-spacing:-.02em;max-width:none}
html body:has(.board) .hero .lead,
html body:has(.list-card) .hero .lead{max-width:66ch;margin-top:6px;font-size:.875rem}
html body:has(.board) .hero .meta,
html body:has(.list-card) .hero .meta{margin-top:6px;font-size:.8125rem}
html body:has(.board) .hero .accent,
html body:has(.list-card) .hero .accent{display:none}
html body:has(.board) main{padding-bottom:40px}
html body:has(.board) .card{margin-top:12px;border:0;border-radius:0;box-shadow:none;background:transparent;overflow:visible}
html body:has(.board) .tabs{padding:0 0 12px;border-bottom:0;gap:8px}
html body:has(.board) .tabs button{border-radius:var(--radius-sm);background:var(--chip);font-size:.875rem}
html body:has(.board) .tabs button:hover{background:var(--chip-hover)}
html body:has(.board) .tabs button[aria-selected=true]{background:var(--ink);color:#fff}
html body:has(.board) .board{border-bottom:1px solid var(--line)}
html body:has(.board) .board th,
html body:has(.board) .board td{padding:8px 12px;border-top:1px solid var(--line)}
html body:has(.board) .board th{padding-block:6px;font-size:.75rem}
html body:has(.board) .board tbody tr:hover{background:var(--surface)}
html body:has(.board) .board .avatar{width:40px;height:40px;flex-basis:40px}
html body:has(.board) .channel-link{font-weight:500}
html body:has(.board) .metric-main{font-weight:500}
html body:has(.board) .spark polyline{stroke:var(--brand)}
html body:has(.board) .spark circle{fill:var(--brand)}
html body:has(.board) .panel-note{margin:10px 0 0}
html body:has(.board) .source-note{padding:12px 0 0;border-top:0}
html body:has(.board) .chips a,
html body:has(.list-card) .chips a{border:0;border-radius:var(--radius-sm);background:var(--chip);font-weight:500}
html body:has(.board) .chips a:hover,
html body:has(.list-card) .chips a:hover{background:var(--chip-hover)}
html body:has(.board) .chips a[aria-current=page],
html body:has(.list-card) .chips a[aria-current=page]{background:var(--ink);color:#fff}
html body:has(.board) .cta,
html body:has(.list-card) .cta{border:1px solid var(--line);border-radius:var(--radius);background:#fff}
html body:has(.board) .cta h2,
html body:has(.list-card) .cta h2{font-weight:700;font-size:1.0625rem}
html body:has(.board) .btn,
html body:has(.list-card) .btn{background:var(--ink);color:#fff}
html body:has(.list-card) .list-card{border-radius:var(--radius);background:#fff}
html body:has(.list-card) .list-card:hover{border-color:var(--line-strong);background:var(--surface);box-shadow:none}
html body:has(.list-card) .list-card strong{font-weight:500}
html body:has(.board) footer,
html body:has(.list-card) footer{font-size:.8125rem}

@media(max-width:760px){
  html:root{--wrap-pad:12px}
  html body:has(.board) .board th,
  html body:has(.board) .board td{padding:8px 6px}
  html body:has(.board) .board .avatar{width:36px;height:36px;flex-basis:36px}
  html body:has(.board) .card{margin-inline:0}
}

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

.page-leaderboard .brand{font-size:1.125rem}
.page-leaderboard .brand span{color:var(--brand)}
.page-leaderboard .nav-shell nav{gap:2px}