:root {
  color-scheme: dark;
  --background: #090a0e;
  --surface: #111218;
  --line: #373a45;
  --text: #f5f6fa;
  --muted: #b5bdcc;
  --accent: #ff3b56;
  --focus: #ff9eab;
  font-family: Inter, system-ui, sans-serif;
  background: var(--background);
  color: var(--text);
}

*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; }
a { color: inherit; }
button { font: inherit; cursor: pointer; }
button:focus-visible, a:focus-visible, .table-region:focus-visible, .ladder:focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: 3px;
}

.container { width: min(100% - 72px, 1460px); margin-inline: auto; }
.site-header { border-bottom: 1px solid #272932; background: #0c0d12; }
.header-content { display: flex; align-items: center; min-height: 60px; gap: 28px; }
.brand-group { display: flex; min-width: 0; align-items: center; gap: clamp(9px, 2vw, 20px); }
.site-logo { display: block; flex: none; line-height: 0; }
.site-logo img { display: block; width: clamp(105px, 23vw, 162px); height: auto; }
.brand { border-left: 1px solid var(--line); padding-left: clamp(9px, 2vw, 20px); font-size: clamp(.85rem, 1.6vw, 1.2rem); font-weight: 800; letter-spacing: -.025em; line-height: 1.2; text-decoration: none; white-space: nowrap; }
.brand:hover { color: var(--accent); }
.header-content nav { display: flex; align-self: stretch; gap: 15px; }
.header-content nav a { display: grid; place-items: center; padding-inline: 6px; border-bottom: 2px solid var(--accent); font-size: .875rem; font-weight: 650; text-decoration: none; }
.header-content nav a + a { border-color: transparent; color: var(--muted); }
.header-content nav a:hover { color: var(--accent); }
.access-label { margin-left: auto; border: 1px solid var(--line); border-radius: 6px; padding: 5px 10px; background: #14151d; color: var(--muted); font-size: .72rem; white-space: nowrap; }

main { padding-bottom: 32px; }
.hero { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: clamp(24px, 5vw, 80px); isolation: isolate; position: relative; padding: 40px clamp(10px, 2.6vw, 42px); margin-bottom: 22px; }
.hero::before, .hero::after { content: ''; position: absolute; inset: 0; pointer-events: none; z-index: -1; }
.hero::before { background: radial-gradient(ellipse at 55% 61%, #6913245e, transparent 59%); }
.hero::after { background: linear-gradient(137deg, transparent 39%, #e7244229 39%, #e7244210 47%, transparent 47%, transparent 52%, #f534583e 52%, #bd173106 57%, transparent 57%); mask-image: linear-gradient(90deg, transparent 21%, #000 42%, #000 64%, transparent 83%); }
h1, .page-heading h2 { margin: 0; font-weight: 850; letter-spacing: -.045em; }
h1 { font-size: clamp(2.6rem, 5.1vw, 5.15rem); line-height: .97; color: #e9dbe2; text-shadow: 0 0 12px #ffc2df28; }
h1 span { color: #ec657e; text-shadow: 0 0 2px #ffabb8, 0 0 11px #ff2e5b80, 0 0 30px #ca174e66; }
.hero-copy p { margin: 13px 0 19px; color: var(--muted); max-width: 43ch; font-size: clamp(.96rem, 1.38vw, 1.15rem); line-height: 1.45; }
.primary-action { display: inline-flex; gap: 14px; align-items: center; min-height: 42px; padding: 7px 16px; border: 1px solid #fb4e67; border-radius: 7px; background: linear-gradient(#d71c3b, #bd112e); box-shadow: 0 3px 20px #fb18372b, inset 0 1px #ff9eab49; color: #fff; font-size: .95rem; font-weight: 720; text-decoration: none; }
.primary-action:hover { background: #df2443; }
.platform-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.platform-links a { display: inline-flex; align-items: center; min-height: 40px; padding: 7px 11px; border: 1px solid #dcdde5; border-radius: 7px; background: #f5f6fa; }
.platform-links a:hover { background: #fff; border-color: var(--accent); }
.platform-links img { display: block; width: auto; height: 20px; }

.leader-card { align-self: stretch; display: flex; flex-direction: column; justify-content: center; min-width: 0; min-height: 190px; border: 1px solid #fa3552; border-radius: 13px; padding: clamp(17px, 2.4vw, 32px); background: radial-gradient(ellipse at 100% 100%, #3b101c, transparent 74%), #121117; box-shadow: 0 0 24px #ff254438, inset 0 0 22px #c0203525; }
.leader-card h2 { margin: 0; color: var(--muted); font-size: .75rem; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.leader-name { margin: 8px 0 18px; font-size: clamp(1.45rem, 2.5vw, 2.3rem); font-weight: 800; letter-spacing: -.035em; line-height: 1.1; overflow-wrap: anywhere; }
.leader-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; padding-top: 12px; border-top: 1px solid #fff2; }
.leader-metrics div { min-width: 0; }
.leader-metrics div + div { padding-left: clamp(8px, 2vw, 22px); border-left: 1px solid #fff2; }
.leader-metrics dt { color: var(--muted); font-size: .78rem; line-height: 1.2; }
.leader-metrics dd { margin: 2px 0 0; font-size: clamp(1.1rem, 2.4vw, 2.15rem); font-weight: 790; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }

.ladder { scroll-margin-top: 16px; }
.page-heading { display: flex; justify-content: space-between; align-items: end; gap: 12px; margin-bottom: 15px; }
.page-heading h2 { font-size: clamp(1.65rem, 3.4vw, 2.85rem); line-height: 1.03; }
.subtitle, .summary { color: var(--muted); font-size: .875rem; line-height: 1.5; }
.subtitle { margin: 4px 0 0; }
.summary { margin: 10px 0 0; }
.summary:empty { display: none; }
.table-scroll-hint { display: none; margin: 0 0 8px; color: var(--muted); font-size: .75rem; }
.periods { display: flex; flex: none; gap: 3px; padding: 3px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); }
.periods button { min-height: 34px; border: 1px solid transparent; border-radius: 6px; padding: 5px 14px; color: var(--muted); background: transparent; font-size: .875rem; font-weight: 650; white-space: nowrap; }
.periods button:hover { color: var(--text); }
.periods button[aria-pressed="true"] { border-color: #fa4b62; background: linear-gradient(#d71c3b, #bd112e); box-shadow: 0 0 14px #ff254435; color: #fff; }

.table-region { overflow-x: auto; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); }
table { width: 100%; min-width: 940px; border-collapse: collapse; }
th, td { padding: 10px clamp(9px, 1.2vw, 18px); text-align: left; }
thead { background: #171920; color: #c3ccdb; }
thead th { font-size: .75rem; font-weight: 720; letter-spacing: .045em; text-transform: uppercase; }
thead button { display: inline-flex; gap: .38em; align-items: center; border: 0; padding: 0; color: inherit; background: transparent; text-align: right; font: inherit; text-transform: inherit; }
thead button:hover, thead th[aria-sort] { color: var(--text); }
.sort-arrow { color: var(--accent); }
thead th:not([aria-sort]) .sort-arrow { color: var(--muted); }
tbody tr { border-top: 1px solid #30323a; }
tbody tr:nth-child(even) { background-color: #ffffff03; }
tbody tr:hover { background: #21151d; }
tbody tr.top-rank { background: linear-gradient(90deg, #3a1522, #17131b 85%); }
tbody tr.top-rank .rank { box-shadow: inset 3px 0 var(--accent); }
tbody th, tbody td { font-size: .9rem; line-height: 1.25; }
.ea-name { min-width: 180px; font-weight: 740; }
.ea-identity { display: flex; align-items: center; gap: 11px; }
.ea-mark { flex: none; display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid #a24456; border-radius: 7px; background: linear-gradient(145deg, #632138, #19151e 70%); color: #fff; font-size: .67rem; font-weight: 850; letter-spacing: -.045em; }
.ea-market { display: block; margin-top: 2px; color: var(--muted); font-size: .73rem; font-weight: 450; }
.advisor-details { border: 0; padding: 0; background: none; color: var(--text); font: inherit; text-align: left; }
.advisor-details:hover { color: #ff9eab; text-decoration: underline; }
.advisor-store { display: inline-block; margin-left: 5px; color: var(--muted); text-decoration: none; font-size: .85em; }
.advisor-store:hover { color: #ff9eab; }
.rank { width: 1%; text-align: center; color: var(--muted); font-variant-numeric: tabular-nums; }
.metric { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.return { font-weight: 800; }
.positive-return { color: #57ff4f; }
.positive { color: #9ce7bc; }
.rating { text-align: center; white-space: nowrap; }
.rating-controls { display: inline-flex; align-items: center; justify-content: center; gap: 7px; font-variant-numeric: tabular-nums; }
.rating-controls button { min-width: 25px; min-height: 26px; border: 1px solid var(--line); border-radius: 5px; padding: 0 4px; color: var(--muted); background: #181921; font-size: .66rem; }
.rating-controls button:hover, .rating-controls button[aria-pressed="true"] { border-color: #e56179; color: var(--text); background: #3a1a26; }
.rating-controls button[aria-disabled="true"] { cursor: wait; }
.feed { color: var(--muted); }
.feed-ranked { color: #9ce7bc; }
.negative { color: #ff8595; }
.unranked .metric, .empty { color: var(--muted); }

.featured { margin-top: 48px; scroll-margin-top: 16px; }
.featured h2 { margin: 0 0 16px; font-size: clamp(1.55rem, 3vw, 2.35rem); letter-spacing: -.04em; }
.featured h2 span { color: #ec657e; }
.featured-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 245px), 1fr)); gap: 14px; }
.featured-card, .featured-empty { margin: 0; border: 1px solid #653041; border-radius: 12px; padding: 15px; background: linear-gradient(145deg, #24151e, var(--surface) 64%); }
.featured-card { display: grid; gap: 14px; align-content: start; }
.featured-empty { grid-column: 1 / -1; color: var(--muted); font-size: .875rem; }
.featured-card-header, .featured-card-identity, .featured-card-actions, .monitor-status, .monitor-header, .monitor-actions { display: flex; align-items: center; gap: 10px; }
.featured-card-header, .monitor-header { justify-content: space-between; }
.featured-card-rank, .featured-card-badge, .monitor-badge { color: #ff9eab; font-size: .72rem; font-weight: 700; }
.featured-card-badge, .monitor-badge { border: 1px solid #673444; border-radius: 99px; padding: 4px 8px; background: #271820; }
.featured-card-mark { display: grid; place-items: center; width: 42px; height: 42px; flex: none; border: 1px solid #a24456; border-radius: 9px; background: linear-gradient(145deg, #632138, #19151e 75%); font-weight: 800; }
.featured-card-title h3, .featured-card-title p { margin: 0; }
.featured-card-title p { margin-top: 3px; color: var(--muted); font-size: .78rem; }
.featured-card-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0; }
.featured-card-stat, .monitor-tile { border: 1px solid var(--line); border-radius: 8px; padding: 9px; background: #181921; }
.featured-card-stat dt, .monitor-tile dt { color: var(--muted); font-size: .7rem; }
.featured-card-stat dd, .monitor-tile dd { margin: 5px 0 0; font-weight: 750; overflow-wrap: anywhere; }
.featured-card-actions, .monitor-actions, .monitor-status { flex-wrap: wrap; }
.featured-button, .monitor-close { display: inline-flex; align-items: center; justify-content: center; min-height: 35px; border: 1px solid var(--line); border-radius: 7px; padding: 4px 9px; background: #1a1b23; color: var(--text); font-size: .79rem; font-weight: 650; text-decoration: none; }
.featured-button:hover, .monitor-close:hover { border-color: #e56179; }
.featured-button-primary { background: #3a1a26; border-color: #784052; }

.monitor-dialog { width: min(860px, calc(100% - 28px)); max-height: 88dvh; padding: 0; border: 1px solid #844457; border-radius: 13px; background: #121319; color: var(--text); box-shadow: 0 0 35px #ff27502f; }
.monitor-dialog::backdrop { background: #050508bf; }
.monitor-shell { padding: clamp(13px, 2.6vw, 23px); }
.monitor-header { margin-bottom: 13px; }
.monitor-header h2 { margin: 0; font-size: clamp(1.3rem, 3vw, 1.8rem); }
.monitor-close { min-width: 35px; flex: none; font-size: 1.3rem; line-height: 1; }
.monitor-status { margin-bottom: 13px; }
.monitor-status-copy, .monitor-note { color: var(--muted); font-size: .78rem; }
.monitor-columns { display: grid; grid-template-columns: .9fr 1.1fr; gap: 12px; align-items: start; }
.monitor-panel { border: 1px solid var(--line); border-radius: 9px; padding: 12px; background: #17181f; }
.monitor-panel-title { margin: 0; font-size: .95rem; }
.monitor-note { margin: 6px 0 11px; }
.monitor-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 12px 0 0; }
.monitor-summary { margin: 0; }
.monitor-row { display: flex; align-items: baseline; justify-content: space-between; gap: 9px; border-top: 1px solid #30323a; padding: 7px 0; font-size: .84rem; }
.monitor-row dt { color: var(--muted); }
.monitor-row dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; }
.monitor-actions { margin-top: 13px; }

.arena-method { max-width: 68ch; margin-top: 32px; }
.arena-method h2, .partner-section h2 { margin: 0; font-size: clamp(1.25rem, 2.5vw, 1.7rem); font-weight: 780; letter-spacing: -.027em; }
.arena-method p { margin: 8px 0 10px; color: var(--muted); line-height: 1.55; }
.arena-method a { color: var(--text); text-decoration-color: var(--accent); text-underline-offset: 4px; }
.arena-method a:hover { color: var(--focus); }

.site-footer { border-top: 1px solid #252730; }
.partner-section { padding-block: clamp(20px, 3vw, 37px); }
.affiliate-disclosure { margin: 6px 0 15px; color: var(--muted); font-size: .88rem; line-height: 1.5; }
.partner-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; max-width: 770px; }
.partner-banner { display: flex; flex-direction: column; overflow: hidden; min-width: 0; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); text-decoration: none; }
.partner-banner:hover { border-color: var(--focus); background: #181920; }
.partner-art { display: grid; min-height: 90px; padding: 10px 14px; place-items: center; }
.partner-art img { display: block; width: min(100%, 244px); height: auto; }
.partner-art.ic-trading { background: #fff; }
.partner-art.funded-trading { background: #102f21; }
.partner-action { display: flex; justify-content: space-between; gap: 8px; padding: 11px 14px; color: var(--text); font-size: .86rem; font-weight: 675; }
.partner-action span { color: var(--accent); }
.footer-content { display: flex; justify-content: end; padding-block: 14px; }
.publisher { color: var(--muted); font-size: .76rem; text-decoration: none; }
.publisher strong { color: var(--text); }
.publisher:hover { color: var(--text); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

@media (max-width: 780px) {
  .container { width: calc(100% - 32px); }
  .header-content { gap: 17px; min-height: 54px; }
  .hero { padding: 30px 0 18px; gap: 20px; }
  th, td { padding-inline: 10px; }
}

@media (max-width: 1012px) {
  .table-scroll-hint { display: block; }
}

@media (max-width: 610px) {
  .container { width: calc(100% - 24px); }
  .header-content nav { display: none; }
  .hero { grid-template-columns: 1fr; padding-top: 26px; margin-bottom: 14px; }
  .hero::after { mask-image: linear-gradient(90deg, transparent 25%, #000 85%); }
  .leader-card { min-height: 0; }
  .leader-name { margin-bottom: 12px; }
  .page-heading { align-items: end; flex-wrap: wrap; }
  .periods button { min-height: 32px; padding-inline: 9px; font-size: .77rem; }
  th, td { padding: 10px 6px; }
  thead th { font-size: .62rem; letter-spacing: .02em; }
  thead button { gap: .22em; }
  tbody th, tbody td { font-size: .77rem; }
  .ea-identity { gap: 5px; }
  .ea-market { display: none; }
  .ea-mark { width: 24px; height: 24px; font-size: .57rem; }
  .monitor-columns { grid-template-columns: 1fr; }
}

@media (max-width: 420px) {
  th, td { padding-inline: 4px; }
  .ea-mark { display: none; }
  .access-label { display: none; }
  .partner-grid { grid-template-columns: 1fr; }
}