:root {
  color-scheme: light;
  --ink: #17130f;
  --paper: #fff6e0;
  --white: #fff;
  --grass: #6fdc5a;
  --diamond: #4be3d6;
  --gold: #ffd23f;
  --redstone: #ff6452;
  --amethyst: #c88ae6;
  --lava: #ff9a2e;
  --ender: #2d1c36;
  --ender-2: #4f1a6d;
  --sky: #8ccdff;
  --px: 4px;
  --outline: 0 calc(var(--px) * -1) 0 var(--ink), 0 var(--px) 0 var(--ink),
    calc(var(--px) * -1) 0 0 var(--ink), var(--px) 0 0 var(--ink);
  --drop: var(--px) calc(var(--px) * 2) 0 var(--ink),
    calc(var(--px) * 2) var(--px) 0 var(--ink),
    calc(var(--px) * 2) calc(var(--px) * 2) 0 var(--ink);
  --display: "Courier New", Consolas, monospace;
  --body: "Segoe UI", Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 85px; }
body {
  background: var(--paper);
  color: var(--ink);
  display: flex;
  flex-direction: column;
  font: 16px/1.55 var(--body);
  margin: 0;
  min-height: 100vh;
}
body > main { flex: 1; }
a { color: inherit; text-underline-offset: 3px; }
img { display: block; height: auto; max-width: 100%; }
h1, h2, h3 { font-family: var(--display); font-weight: 900; line-height: .98; margin: 0; text-wrap: balance; }
p { margin: 0; }
button, input, select { font: inherit; }
:focus-visible { outline: 3px solid var(--ender-2); outline-offset: 4px; }
.sr-only {
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}
.hub-wrap { margin-inline: auto; max-width: 1260px; padding-inline: clamp(18px, 4vw, 48px); width: 100%; }
.hub-header {
  align-items: center;
  background: var(--paper);
  border-bottom: 3px solid var(--ink);
  display: flex;
  gap: 30px;
  justify-content: space-between;
  min-height: 76px;
  padding: 12px clamp(18px, 4vw, 56px);
  position: relative;
  z-index: 1;
}
.hub-brand { align-items: center; display: inline-flex; font: 700 13px var(--display); gap: 10px; letter-spacing: .025em; text-decoration: none; white-space: nowrap; }
.hub-brand i { color: #793b99; font-style: normal; }
.brand-cube { align-items: center; background: var(--gold); box-shadow: var(--outline); display: inline-flex; height: 29px; justify-content: center; width: 29px; }
.hub-nav { align-items: center; display: flex; gap: clamp(15px, 2.4vw, 34px); }
.hub-nav a { font-size: 13px; font-weight: 650; text-decoration-thickness: 2px; }
.hub-nav a:hover { text-decoration-color: #aa55c9; }
.hub-stamp, .update-stamp { align-items: center; display: inline-flex; font: 10px var(--display); font-weight: 700; gap: 9px; letter-spacing: .055em; }
.hub-stamp { background: var(--white); box-shadow: var(--outline); padding: 7px 10px; white-space: nowrap; }
.hub-stamp > span, .stamp-dot { background: #64c957; border: 1px solid var(--ink); height: 9px; width: 9px; }

.hub-hero {
  background: var(--ender);
  color: var(--paper);
  min-height: 430px;
  overflow: hidden;
  position: relative;
}
.hero-grid-pattern {
  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: 34px 34px;
  inset: 0;
  mask-image: linear-gradient(90deg, #000, transparent 80%);
  position: absolute;
}
.hero-inner { align-items: center; display: grid; grid-template-columns: 1.15fr .85fr; min-height: 430px; position: relative; }
.hero-copy { max-width: 760px; padding-block: 55px; position: relative; z-index: 1; }
.pixel-eyebrow, .section-kicker, .hero-note, .tile-caption, .hero-side-label, .data-note {
  font-family: var(--display);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
}
.pixel-eyebrow { align-items: center; color: var(--gold); display: flex; gap: 11px; margin: 0 0 21px; }
.eyebrow-block { background: var(--grass); box-shadow: 2px 2px 0 var(--ink); display: inline-block; height: 11px; width: 11px; }
.hero-copy h1 { font-size: clamp(39px, 5.7vw, 72px); letter-spacing: -.055em; text-transform: uppercase; }
.hero-copy h1 span { color: var(--gold); }
.hero-lead { color: #f4e8d4; font-size: clamp(16px, 2vw, 20px); margin: 22px 0 25px; max-width: 53ch; }
.pixel-button {
  align-items: center;
  background: var(--gold);
  border: 0;
  box-shadow: var(--outline), var(--drop);
  color: var(--ink);
  cursor: pointer;
  display: inline-flex;
  font: 700 12px var(--display);
  gap: 18px;
  justify-content: center;
  min-height: 45px;
  padding: 10px 15px;
  text-decoration: none;
  transition: transform .12s, box-shadow .12s;
}
.pixel-button:hover { transform: translate(-2px, -2px); }
.pixel-button:active { box-shadow: var(--outline); transform: translate(4px, 4px); }
.pixel-button span { font-size: 17px; line-height: .7; }
.button-lava { background: var(--lava); }
.button-paper { background: var(--white); }
.button-gold { background: var(--gold); }
.hero-note { color: #d3bfdc; font-size: 8px; margin-top: 19px; }
.hero-side { align-items: center; display: flex; height: 100%; justify-content: center; min-height: 300px; position: relative; }
.hero-monogram {
  color: rgba(255, 246, 224, .95);
  font: 900 clamp(95px, 16vw, 205px)/.8 var(--display);
  letter-spacing: -.12em;
  position: relative;
  text-shadow: 7px 7px 0 #16120f, 11px 11px 0 rgba(255, 210, 63, .85);
  transform: rotate(-7deg);
}
.hero-monogram span { color: var(--lava); }
.floating-block { border: 3px solid var(--ink); height: 43px; position: absolute; transform: rotate(12deg); width: 43px; }
.block-one { background: var(--grass); right: 12%; top: 21%; }
.block-two { background: var(--diamond); bottom: 19%; left: 17%; transform: rotate(-12deg); }
.block-three { background: var(--gold); height: 25px; right: 20%; bottom: 20%; width: 25px; }
.hero-side-label { bottom: 30px; color: #e2d4e5; font-size: 8px; position: absolute; right: 12px; }
.countdown-wrap { background: var(--gold); border-block: 3px solid var(--ink); color: var(--ink); position: relative; z-index: 1; }
.countdown-inner { align-items: center; display: flex; flex-wrap: wrap; gap: 20px 36px; justify-content: space-between; margin-inline: auto; max-width: 1260px; padding: 18px clamp(18px, 4vw, 48px); }
.countdown-copy { align-items: center; display: flex; gap: 13px; }
.countdown-spark { font-size: 26px; }
.countdown-copy strong, .countdown-copy small { display: block; font-family: var(--display); }
.countdown-copy strong { font-size: 12px; letter-spacing: .055em; }
.countdown-copy small { font-size: 9px; font-weight: 700; letter-spacing: .05em; margin-top: 3px; opacity: .73; }
.countdown-clock { align-items: center; display: flex; gap: clamp(8px, 2vw, 19px); }
.countdown-unit { align-items: center; display: flex; flex-direction: column; min-width: 44px; }
.countdown-unit strong { font: 900 clamp(21px, 3vw, 29px)/1 var(--display); font-variant-numeric: tabular-nums; }
.countdown-unit small { font: 700 8px var(--display); letter-spacing: .08em; margin-top: 5px; }
.countdown-separator { font: 700 22px var(--display); margin-top: -9px; opacity: .48; }
.countdown-clock[data-finished] .countdown-unit strong { color: #347b2c; }
.hero-side-label span { color: var(--gold); margin-right: 8px; }
.grass-edge { background: linear-gradient(var(--grass) 0 45%, #68b74a 45%); height: 13px; position: relative; }
.grass-edge::after { background: linear-gradient(90deg, var(--ink) 50%, transparent 50%) 0 0/14px 5px; content: ""; height: 5px; inset: auto 0 0; position: absolute; }

.overview-section { padding-block: clamp(52px, 7vw, 82px) 66px; }
.section-title-row { align-items: end; display: flex; gap: 20px; justify-content: space-between; margin-bottom: 27px; }
.section-kicker { color: #71398d; font-size: 9px; margin: 0 0 9px; }
.section-title-row h2 { font-size: clamp(24px, 4vw, 38px); letter-spacing: -.035em; text-transform: uppercase; }
.update-stamp { color: #50463e; font-size: 9px; margin-bottom: 4px; }
.stamp-dot { box-shadow: 2px 2px 0 var(--ink); }
.overview-grid { display: grid; gap: 16px; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; }
.stat-tile {
  background: var(--tile-bg, var(--white));
  box-shadow: var(--outline), var(--drop);
  min-height: 158px;
  overflow: hidden;
  padding: 18px 20px;
  position: relative;
}
.stat-tile dt { font: 700 10px var(--display); letter-spacing: .08em; position: relative; z-index: 1; }
.stat-tile dd { font: 900 clamp(32px, 4vw, 48px)/1.1 var(--display); letter-spacing: -.065em; margin: 15px 0 5px; position: relative; z-index: 1; }
.stat-tile dd small { font-size: .54em; letter-spacing: 0; }
.tile-caption { display: block; font-size: 8px; opacity: .7; position: relative; z-index: 1; }
.tile-symbol { bottom: -19px; color: rgba(23, 19, 15, .12); font: 700 95px/1 var(--display); position: absolute; right: 8px; transform: rotate(-12deg); }
.tone-grass { --tile-bg: var(--grass); }
.tone-amethyst { --tile-bg: var(--amethyst); }
.tone-lava { --tile-bg: var(--lava); }
.tone-diamond { --tile-bg: var(--diamond); }
.tone-gold { --tile-bg: var(--gold); }

.archive-section { background: #e9ddc4; border-block: 3px solid var(--ink); padding-block: clamp(48px, 7vw, 78px); }
.archive-intro { color: #554b40; font-size: 15px; line-height: 1.8; margin: -7px 0 29px; max-width: 72ch; }
.edition-grid { display: grid; gap: 18px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.edition-card { background: var(--paper); box-shadow: var(--outline), var(--drop); min-width: 0; padding: 20px; }
.edition-card-head { align-items: baseline; border-bottom: 2px solid var(--ink); display: flex; gap: 12px; justify-content: space-between; padding-bottom: 13px; }
.edition-year { font: 900 clamp(32px, 4vw, 45px)/1 var(--display); letter-spacing: -.06em; }
.edition-number { background: var(--gold); box-shadow: 2px 2px 0 var(--ink); font: 700 9px var(--display); padding: 5px 7px; }
.map-status { align-items: center; display: inline-flex; font: 700 9px/1.5 var(--display); gap: 8px; letter-spacing: .035em; margin: 18px 0 4px; }
.map-status > span { background: var(--grass); border: 1px solid var(--ink); flex: 0 0 9px; height: 9px; }
.status-lost > span { background: var(--redstone); }
.status-pending > span { background: var(--gold); }
.edition-lost { background: #f0e9db; }
.edition-lost .edition-year { color: #766b5d; }
.edition-lost .map-status { color: #7e332c; }
.map-download { display: flex; justify-content: space-between; margin: 14px 4px 3px; }
.edition-note { color: #665c51; font-size: 12px; line-height: 1.7; margin: 5px 0 17px; min-height: 40px; }
.participants { border-top: 1px solid #d5c9b3; margin-top: 17px; padding-top: 14px; }
.participants h3 { font: 700 9px var(--display); letter-spacing: .06em; margin: 0 0 9px; }
.participants p { color: #766b5e; font-size: 11px; }
.participants ul { display: flex; flex-wrap: wrap; gap: 7px; list-style: none; margin: 0; padding: 0; }
.participants li { background: var(--white); border: 1px solid #cfc3ae; font-size: 11px; padding: 4px 8px; }
.archive-edit-note { color: #5e5347; font: 11px/1.8 var(--body); margin: 25px 0 0; }
.archive-edit-note code { background: var(--paper); border: 1px solid #cfc3ae; font: 10px var(--display); padding: 3px 5px; }

.account-section { background: #e9ddc4; border-block: 3px solid var(--ink); padding-block: clamp(48px, 7vw, 78px); }
.account-layout { align-items: start; display: grid; gap: clamp(30px, 6vw, 78px); grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
.account-intro { padding-top: 9px; }
.account-intro h2 { font-size: clamp(30px, 4.5vw, 51px); letter-spacing: -.05em; }
.account-intro h2 span { color: #71398d; }
.account-intro > p:not(.section-kicker) { color: #554b40; font-size: 15px; line-height: 1.8; margin-top: 18px; max-width: 46ch; }
.development-badge { align-items: center; background: var(--gold); box-shadow: var(--outline); display: inline-flex; font: 700 10px var(--display); gap: 8px; letter-spacing: .06em; margin: 21px 0 0 3px; padding: 9px 12px; }
.development-badge > span { font-size: 15px; }
.account-flow { display: grid; gap: 14px; }
.account-step { align-items: center; background: var(--paper); box-shadow: var(--outline); display: grid; gap: 14px; grid-template-columns: 35px 40px minmax(0, 1fr); min-height: 95px; padding: 14px 17px; }
.step-number { color: #71398d; font: 700 11px var(--display); }
.step-icon { align-items: center; background: var(--tile-bg, var(--diamond)); border: 2px solid var(--ink); box-shadow: 2px 2px 0 var(--ink); display: inline-flex; font: 700 18px var(--display); height: 36px; justify-content: center; width: 36px; }
.account-step:nth-child(2) .step-icon { --tile-bg: var(--amethyst); }
.account-step:nth-child(3) .step-icon { --tile-bg: var(--lava); }
.account-step h3 { font: 700 14px var(--display); line-height: 1.3; }
.account-step p { color: #62574a; font-size: 12px; line-height: 1.65; margin-top: 4px; }
.account-coming-soon { align-items: flex-start; background: var(--ender); color: var(--paper); display: flex; gap: 11px; margin: 3px 4px 0; padding: 14px 16px; }
.coming-soon-dot { background: var(--lava); box-shadow: 0 0 0 3px rgba(255,154,46,.18); flex: 0 0 9px; height: 9px; margin-top: 4px; }
.account-coming-soon strong, .account-coming-soon small { display: block; }
.account-coming-soon strong { color: var(--gold); font: 700 9px var(--display); letter-spacing: .055em; }
.account-coming-soon small { color: #eadfed; font-size: 11px; line-height: 1.6; margin-top: 5px; }

.leaderboard-section { background: var(--ender); color: var(--paper); padding-block: clamp(52px, 7vw, 82px); }
.leaderboard-section .section-kicker { color: var(--gold); }
.leaderboard-section .section-title-row h2 { color: var(--paper); }
.leaderboard { list-style: none; margin: 0; padding: 4px 4px 6px; }
.leader-row {
  align-items: center;
  background: var(--paper);
  box-shadow: var(--outline);
  color: var(--ink);
  display: grid;
  gap: 15px;
  grid-template-columns: 42px 42px minmax(120px, 1fr) minmax(92px, auto) minmax(78px, auto) 24px;
  margin: 0 0 11px;
  min-height: 68px;
  padding: 9px 16px;
  transition: transform .12s;
}
.leader-row:hover { transform: translate(-2px, -2px); }
.rank-number { color: #6e5379; font: 700 13px var(--display); }
.player-avatar, .mini-avatar, .profile-avatar {
  align-items: center;
  background: var(--avatar-bg, var(--gold));
  border: 2px solid var(--ink);
  box-shadow: 3px 3px 0 var(--ink);
  display: inline-flex;
  font: 700 15px var(--display);
  height: 38px;
  justify-content: center;
  width: 38px;
}
.leader-name { font: 700 16px var(--display); overflow-wrap: anywhere; text-decoration: none; }
.leader-name:hover { text-decoration: underline; text-decoration-color: #9c54b0; }
.leader-stat { display: flex; flex-direction: column; gap: 2px; text-align: right; }
.leader-stat strong { font: 700 15px var(--display); }
.leader-stat small { color: #766b5e; font: 700 8px var(--display); letter-spacing: .06em; }
.leader-arrow { color: #733b8f; font: 700 22px var(--display); text-align: center; text-decoration: none; }
.empty-board { align-items: center; background: #fff6e0; box-shadow: var(--outline), var(--drop); color: var(--ink); display: flex; flex-direction: column; margin: 4px; padding: 45px 24px; text-align: center; }
.empty-board-icon { align-items: center; background: var(--gold); box-shadow: var(--outline); display: inline-flex; font: 700 25px var(--display); height: 43px; justify-content: center; width: 43px; }
.empty-board h3 { font-size: 20px; margin: 19px 0 7px; }
.empty-board p { color: #665c51; font-size: 14px; max-width: 540px; }
.data-note { color: #d0c0d8; font: 10px/1.7 var(--body); margin: 22px 0 0; }

.subpage-hero { background: var(--ender); color: var(--paper); overflow: hidden; padding-top: clamp(40px, 6vw, 72px); position: relative; }
.subpage-hero .hub-wrap { padding-bottom: clamp(43px, 6vw, 70px); }
.subpage-hero h1 { font-size: clamp(44px, 8vw, 86px); letter-spacing: -.055em; margin: 0 0 14px; text-transform: uppercase; }
.subpage-hero h1 span { color: var(--gold); }
.subpage-hero .hub-wrap > p:last-child { color: #e3d6e8; font-size: 16px; max-width: 58ch; }
.directory-section { padding-block: 48px 80px; }
.directory-title { margin-bottom: 22px; }
.directory-filters { align-items: center; display: flex; gap: 15px; margin: 0 0 25px; }
.search-field, .sort-field { align-items: center; background: var(--white); box-shadow: var(--outline); display: flex; min-height: 45px; }
.search-field { flex: 1; gap: 9px; padding: 0 13px; }
.search-field > span:first-child { color: #76508a; font: 700 22px var(--display); }
.search-field input { background: transparent; border: 0; color: var(--ink); min-width: 0; outline: 0; width: 100%; }
.search-field input::placeholder { color: #756c62; }
.sort-field select { appearance: none; background: var(--white); border: 0; cursor: pointer; min-height: 45px; padding: 0 34px 0 13px; }
.sort-field { position: relative; }
.sort-field::after { content: "⌄"; font: 700 17px var(--display); pointer-events: none; position: absolute; right: 10px; top: 9px; }
.table-frame { background: var(--white); box-shadow: var(--outline), var(--drop); margin: 3px 4px 6px; overflow-x: auto; }
.player-table { border-collapse: collapse; min-width: 830px; text-align: left; width: 100%; }
.player-table th { background: #f1e4c9; border-bottom: 2px solid var(--ink); font: 700 9px var(--display); letter-spacing: .045em; padding: 13px 15px; white-space: nowrap; }
.player-table td { border-bottom: 1px solid #e6dece; font-size: 12px; padding: 13px 15px; white-space: nowrap; }
.player-table tbody tr:last-child td { border-bottom: 0; }
.player-table tbody tr:hover { background: #fff9ec; }
.table-rank { color: #755087; font: 700 11px var(--display); }
.table-player { align-items: center; display: inline-flex; font-weight: 700; gap: 10px; text-decoration: none; }
.table-player:hover { text-decoration: underline; text-decoration-color: #8a45a1; }
.mini-avatar { font-size: 11px; height: 27px; width: 27px; }
.table-muted { color: #82786c; }
.directory-empty { margin: 6px 4px; }
.directory-empty .pixel-button { margin-top: 22px; }
.profile-hero-inner .pixel-eyebrow { margin-bottom: 23px; }
.profile-hero-inner > .pixel-button { margin-top: 26px; }
.profile-heading { align-items: center; display: flex; gap: 22px; }
.profile-heading h1 { margin: 0; text-transform: none; overflow-wrap: anywhere; }
.profile-heading p { color: #e2d5e7; font-size: 13px; margin-top: 8px; overflow-wrap: anywhere; }
.profile-avatar { background: var(--gold); box-shadow: 5px 5px 0 var(--ink), 8px 8px 0 var(--grass); flex: 0 0 70px; font-size: 29px; height: 70px; width: 70px; }
.profile-stats { display: grid; gap: 16px; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; }
.profile-stats .stat-tile { min-height: 145px; }
.profile-stats .stat-tile dd { font-size: clamp(28px, 4vw, 42px); }
.directory-section > .data-note { color: #665c51; margin-top: 25px; }
.hub-footer { align-items: center; background: var(--ink); color: var(--paper); display: flex; flex-wrap: wrap; font: 9px var(--display); gap: 13px 24px; justify-content: space-between; letter-spacing: .06em; padding: 20px clamp(18px, 4vw, 56px); }
.hub-footer a { color: var(--gold); text-decoration: none; }
.hub-footer a:hover { text-decoration: underline; }

@media (max-width: 850px) {
  .hub-header { gap: 17px; }
  .hub-stamp { font-size: 8px; }
  .overview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hero-inner { grid-template-columns: 1fr .65fr; }
  .hero-monogram { font-size: clamp(90px, 17vw, 150px); }
  .leader-row { gap: 11px; grid-template-columns: 33px 38px minmax(100px, 1fr) minmax(75px, auto) 24px; }
  .leader-kills { display: none; }
}
@media (max-width: 620px) {
  .hub-header { flex-wrap: wrap; gap: 12px; padding: 13px 18px; }
  .hub-brand { font-size: 11px; }
  .hub-stamp { margin-left: auto; }
  .hub-nav { gap: 19px; justify-content: space-between; order: 3; overflow-x: auto; width: 100%; }
  .hub-nav a { font-size: 12px; white-space: nowrap; }
  .hero-inner { display: block; min-height: unset; }
  .hero-copy { padding: 49px 0 35px; }
  .hero-copy h1 { font-size: clamp(32px, 8.8vw, 48px); }
  .hero-lead { font-size: 16px; max-width: 42ch; }
  .hero-side { min-height: 145px; }
  .hero-monogram { font-size: 112px; }
  .hero-side-label { bottom: 10px; right: 2px; }
  .countdown-inner { gap: 15px; justify-content: center; padding-block: 15px; }
  .countdown-copy { flex-basis: 100%; justify-content: center; }
  .countdown-clock { gap: 10px; }
  .countdown-unit { min-width: 39px; }
  .countdown-unit strong { font-size: 23px; }
  .block-one { right: 17%; top: 12%; }
  .block-two { bottom: 13%; left: 15%; }
  .overview-section { padding-block: 48px 58px; }
  .edition-grid { grid-template-columns: 1fr; }
  .archive-intro { font-size: 14px; }
  .account-layout { grid-template-columns: 1fr; }
  .account-intro > p:not(.section-kicker) { font-size: 14px; }
  .account-step { gap: 10px; grid-template-columns: 27px 35px minmax(0, 1fr); padding: 12px 10px; }
  .step-icon { height: 32px; width: 32px; }
  .account-step h3 { font-size: 12px; }
  .section-title-row { align-items: flex-start; flex-direction: column; gap: 12px; }
  .overview-grid { gap: 13px; }
  .stat-tile { min-height: 136px; padding: 15px; }
  .stat-tile dd { font-size: clamp(29px, 9vw, 42px); }
  .leader-row { gap: 8px; grid-template-columns: 26px 34px minmax(70px, 1fr) minmax(65px, auto) 18px; padding: 9px 8px; }
  .rank-number { font-size: 10px; }
  .player-avatar { font-size: 12px; height: 31px; width: 31px; }
  .leader-name { font-size: 12px; }
  .leader-stat strong { font-size: 11px; }
  .leader-stat small { font-size: 7px; }
  .leader-arrow { font-size: 17px; }
  .directory-filters { align-items: stretch; flex-wrap: wrap; }
  .search-field { flex-basis: 100%; }
  .sort-field { flex: 1; }
  .sort-field select { width: 100%; }
  .directory-filters .pixel-button { flex: 1; }
  .profile-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .profile-heading { align-items: flex-start; gap: 17px; }
  .profile-avatar { flex-basis: 56px; font-size: 23px; height: 56px; width: 56px; }
  .profile-heading h1 { font-size: clamp(33px, 9vw, 53px); }
  .hub-footer { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 360px) {
  .overview-grid { gap: 11px; }
  .stat-tile { padding: 13px; }
  .leader-stat { display: none; }
  .leader-row { grid-template-columns: 24px 32px minmax(80px, 1fr) 18px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}
