/* Playable racing hub. Artwork is optional; labels and actions are HTML. */
#menu .hub-nav { display:flex; gap:4px; }
#menu .hub-nav button { border:0; background:transparent; color:#c4cbbb; font-size:12px; padding:12px; min-height:44px; }
#menu .hub-nav button:hover { color:var(--launch-lime); background:#edf1df0a; }
#menu[data-screen="onboarding"] .hub-nav { visibility:hidden; }
.hub-mobile-wallet { display:none; }
.hub-heading { display:flex; align-items:center; justify-content:space-between; padding:30px 0 22px; gap:20px; }
#menu .hub-heading h1 { font-size:32px; letter-spacing:-.045em; line-height:1.15; }
.hub-heading .home-welcome { margin:0; text-align:right; }
.hub-board { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:18px; min-height:405px; }
.hub-recommend, #menu .hub-discipline, #menu .menu-subviews .hub-series-card { position:relative; overflow:hidden; isolation:isolate; background:#243330; border:1px solid #edf1df35; border-radius:5px; }
.hub-recommend>img, .hub-discipline>img, .hub-series-card>img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; }
.hub-image-shade { position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,#101b1810 10%,#0b161b40 36%,#0c171af2 100%); }
.hub-recommend .hub-image-shade { background:linear-gradient(180deg,#0b141517,#0b14156e 35%,#0b1415fa 90%); }
.hub-recommend { display:flex; align-items:flex-end; }
.hub-recommend-copy { padding:32px; width:100%; }
.hub-eyebrow { font:10px/1.6 ui-monospace,Menlo,monospace; letter-spacing:.11em; color:#d1dbb8; margin:0 0 12px; }
#menu .hub-recommend h2 { font-size:clamp(30px,3.5vw,48px); line-height:1.05; letter-spacing:-.045em; margin:0 0 14px; }
.hub-recommend-copy>p:not(.hub-eyebrow) { color:#d0d8d1; font-size:14px; line-height:1.6; max-width:350px; margin:0 0 22px; }
#menu .hub-recommend #btn-single { min-width:0; width:auto; font-size:16px; padding:16px 20px; }
.hub-disciplines { display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; gap:16px; }
#menu .hub-discipline, #menu .menu-subviews .hub-series-card { display:flex; align-items:flex-end; text-align:left; min-width:0; margin:0; padding:24px 20px; min-height:190px; color:var(--launch-paper); }
#menu .hub-discipline:hover, #menu .menu-subviews .hub-series-card:hover { border-color:var(--discipline,var(--launch-lime)); background:#273d34; }
.hub-discipline .hub-tile-copy>strong { font-size:32px; }
.hub-tile-copy { display:block; z-index:1; }
#menu .hub-tile-copy small { font:9px/1.6 ui-monospace,Menlo,monospace; color:#eef4e9; opacity:1; margin:0 0 8px; letter-spacing:.09em; }
.hub-tile-copy>strong { display:block; font-size:26px; letter-spacing:-.035em; line-height:1.1; }
.hub-tile-copy>span { display:block; margin-top:9px; font-size:12px; color:#c8d1c3; }
.hub-arrow { margin-left:auto; width:20px; height:20px; align-self:flex-end; color:var(--discipline,#d3dec4); }
.hub-lower { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:18px; margin-top:20px; }
.hub-showcase-stack { display:flex; flex-direction:column; gap:14px; min-width:0; }
.hub-showcase-stack .home-showcase { flex:1; }
.hub-showcase-stack>.hub-link { flex-shrink:0; }
.hub-lower .home-showcase { min-height:290px; }
.hub-links { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:minmax(156px,1fr); gap:14px; min-width:0; }
#menu .hub-link { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:20px; text-align:left; background:transparent; border:1px solid #edf1df30; color:var(--launch-paper); min-width:0; }
#menu .hub-link:hover { background:#edf1df08; border-color:#edf1df80; }
#menu .hub-link small { font:8px/1.6 ui-monospace,Menlo,monospace; margin:0 0 10px; color:#b4bfa7; opacity:1; }
.hub-link strong { display:block; font-size:21px; line-height:1.15; letter-spacing:-.035em; }
.hub-link span>span { display:block; font-size:11px; color:#aab5a3; line-height:1.6; margin-top:8px; }
.hub-link>span { min-width:0; }
.hub-link>.ui-arrow { flex:none; width:18px; height:18px; color:#c8d4b8; }
#menu .hub-link-art { position:relative; overflow:hidden; isolation:isolate; min-height:176px; background:#14343c; align-items:flex-end; }
.hub-link-art>img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 53%; z-index:-2; transition:transform .3s ease; }
.hub-link-art::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,#071c2420,#08181dbb 45%,#08181df5); }
#menu .hub-link-art:hover { border-color:var(--launch-lime); }
.hub-link-art:hover>img { transform:scale(1.035); }
#menu .hub-link-art small, .hub-link-art span>span { color:#e0e9d8; }
#menu .hub-link-feature { grid-column:1 / -1; grid-row:span 2; flex-direction:row; align-items:flex-end; justify-content:space-between; padding:32px; }
#menu .hub-link-feature small { font-size:10px; letter-spacing:.11em; margin-bottom:12px; }
.hub-link-feature strong { font-size:clamp(36px,4vw,52px); line-height:1.05; }
.hub-link-feature span>span { font-size:14px; max-width:340px; margin-top:14px; }
.hub-link-feature>.ui-arrow { width:28px; height:28px; color:var(--launch-lime); }
.hub-link-feature::before { background:linear-gradient(180deg,#071c2410 15%,#08181d55 45%,#08181df5); }
#menu .menu-subviews { width:100%; }
#menu .menu-subviews h2 { margin:0 0 18px; font-size:clamp(30px,4vw,44px); line-height:1.1; }
#menu .menu-subviews .hub-back, #menu .menu-subviews .hub-secondary-action { width:auto; display:inline-block; background:transparent; border:0; color:#c7d7b5; padding:12px 0; margin:0 0 20px; min-height:44px; font-size:13px; }
#menu .menu-subviews .hub-secondary-action { text-decoration:underline; text-underline-offset:5px; margin:10px 0; }
#menu .menu-subviews .hub-back:hover, #menu .menu-subviews .hub-secondary-action:hover { color:var(--launch-lime); background:transparent; }
.hub-lede { color:#b6c1af; font-size:15px; line-height:1.6; margin:0 0 26px; max-width:720px; }
.hub-filters { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 24px; }
#menu .menu-subviews .hub-filter { width:auto; margin:0; padding:10px 18px; border:1px solid #526149; background:transparent; font-size:13px; }
#menu .menu-subviews .hub-filter[aria-pressed="true"] { background:var(--launch-lime); color:#172117; border-color:var(--launch-lime); }
.hub-venues { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
#menu .menu-subviews .hub-venue { display:flex; gap:20px; align-items:center; text-align:left; min-width:0; margin:0; padding:22px; background:#1c2823; border:1px solid #edf1df30; }
.hub-venue .hub-route { width:115px; flex:none; color:#c6d6b3; }
.hub-route svg { display:block; width:100%; height:auto; max-width:none; }
.hub-venue-copy { display:block; min-width:0; }
.hub-venue-copy strong { display:block; font-size:21px; line-height:1.2; letter-spacing:-.03em; margin:5px 0 10px; }
.hub-venue-copy>span { display:block; font-size:12px; color:#c0cbbb; line-height:1.5; margin:0 0 9px; }
#menu .menu-subviews .hub-venue-copy small { font-size:10px; line-height:1.5; color:#a4b49a; opacity:1; }
.hub-brief { display:grid; grid-template-columns:1.1fr 1fr; gap:40px; margin-top:28px; }
.hub-route-panel { background:#1b2823; border:1px solid #eaf5d526; border-radius:4px; padding:30px; align-self:start; }
.hub-route-panel .hub-route { margin:auto; color:#d3e3bb; max-width:360px; }
.hub-route-panel h3 { font-size:20px; line-height:1.5; letter-spacing:-.025em; }
.hub-route-panel p, .hub-prize p { line-height:1.6; font-size:13px; }
.hub-muted { font-size:12px; line-height:1.6; color:#aebba5; }
.hub-field { display:flex; align-items:center; gap:18px; justify-content:space-between; margin:0 0 14px; color:#d5dfcb; font-size:13px; }
.hub-field>span { min-width:88px; }
.hub-field select { font:inherit; color:#eef2e7; background:#243126; border:1px solid #657459; padding:12px; border-radius:3px; min-height:44px; width:65%; min-width:0; }
.hub-field select:disabled { opacity:.65; }
.hub-brief-controls .difficulty-picker { padding:14px 0; background:transparent; border:0; }
.hub-prize { padding:20px 24px; border-left:3px solid var(--launch-lime); background:#eafa9c09; color:#d0dec0; margin:26px 0 20px; font-size:14px; line-height:1.65; }
.hub-prize strong { color:#f0f5df; }
#menu .menu-subviews .launch-primary { width:auto; background:var(--launch-lime); color:var(--launch-ink); border-color:var(--launch-lime); padding:17px 25px; font-size:16px; }
.hub-status { color:#ffbc93; font-size:13px; line-height:1.6; }
.hub-status:empty { display:none; }
.hub-series-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
#menu .menu-subviews .hub-series-card { min-height:245px; padding:28px; }
.hub-rounds { list-style:none; padding:0; margin:26px 0; display:grid; gap:10px; }
.hub-rounds li { display:flex; align-items:center; gap:24px; padding:14px 20px; background:#1b2823; border:1px solid #edf1df22; }
.hub-rounds li.complete { border-left:3px solid var(--launch-lime); }
.hub-round-number { font:18px ui-monospace,Menlo,monospace; color:#cfddbc; }
.hub-rounds .hub-route { width:85px; color:#bcd39c; }
.hub-rounds strong { font-size:18px; letter-spacing:-.025em; }
.hub-rounds .hub-muted { margin-left:auto; }
.hub-standings { max-width:600px; padding:0; list-style:none; }
.hub-standings li { display:flex; justify-content:space-between; gap:20px; border-bottom:1px solid #edf1df22; padding:12px 0; font-size:14px; }
.hub-confirm { width:min(460px,calc(100vw - 36px)); background:#17241d; color:#edf4e5; border:1px solid #a9bd8d; border-radius:6px; padding:26px; }
.hub-confirm::backdrop { background:#050b08c9; }
#menu .hub-confirm h2 { font-size:26px; letter-spacing:-.03em; }
.hub-confirm p { line-height:1.65; font-size:14px; color:#bdcbb3; }
#menu .hub-confirm button { width:100%; min-height:48px; margin-top:12px; border-color:#a7bc86; }
.hub-atlas { position:relative; aspect-ratio:3/2; border:1px solid #71998a75; border-radius:8px; margin-bottom:24px; overflow:hidden; isolation:isolate; background:#12383e; }
.hub-atlas-art { display:block; width:100%; height:100%; object-fit:contain; }
.hub-atlas::after { content:""; position:absolute; inset:0; z-index:1; box-shadow:inset 0 0 70px #06212d66; pointer-events:none; }
#menu .menu-subviews .hub-map-pin { position:absolute; z-index:2; left:var(--x); top:var(--y); transform:translate(-50%,-50%); display:flex; align-items:center; gap:10px; width:auto; min-height:44px; margin:0; padding:6px 14px 6px 6px; font-size:13px; font-weight:700; border:1px solid #d4e6ce85; border-radius:5px; background:#102822f2; box-shadow:0 4px 18px #04151980; white-space:nowrap; }
.hub-pin-number { display:grid; place-items:center; min-width:30px; height:30px; border:1px solid #bcd8ab3b; border-radius:2px; color:#e6f87b; font:11px ui-monospace,Menlo,monospace; }
#menu .menu-subviews .hub-map-pin:hover { z-index:3; background:#244537; border-color:var(--launch-lime); }
#menu .menu-subviews .hub-map-pin[aria-pressed="true"] { z-index:3; border-color:var(--launch-lime); background:var(--launch-lime); color:#14251c; box-shadow:0 0 0 4px #e6f87b35,0 6px 25px #04151999; }
.hub-map-pin[aria-pressed="true"] .hub-pin-number { color:#14251c; border-color:#14251c40; }
.hub-atlas-summary { color:#becbb3; font:12px/1.6 ui-monospace,Menlo,monospace; padding:10px 0 18px; border-bottom:1px solid #edf1df24; margin:0 0 20px; }
@media(max-width:600px) {
  #menu .menu-subviews .hub-map-pin { width:44px; height:44px; padding:0; border-radius:50%; justify-content:center; }
  .hub-map-pin .hub-pin-name { display:none; }
  .hub-pin-number { border:0; font-size:13px; }
}
@media(prefers-reduced-motion:reduce) { .hub-link-art>img { transition:none; } }
#menu button:focus-visible, #menu select:focus-visible { outline:3px solid #d6ed99; outline-offset:4px; }
@media (min-width:801px) and (max-width:1100px), (max-width:600px) {
  #menu .hub-link:not(.hub-link-feature) { flex-direction:column; align-items:stretch; }
  #menu .hub-link-art:not(.hub-link-feature) { justify-content:flex-end; }
  .hub-link>.ui-arrow { align-self:flex-end; }
  .hub-link:not(.hub-link-feature) strong { font-size:18px; }
}
@media(max-width:1100px) {
  #menu .home-header { gap:12px; }.hub-nav { order:3; }.home-tools { margin-left:auto; }
  #menu .hub-nav button { padding:10px 8px; font-size:11px; }
  .hub-board,.hub-lower { grid-template-columns:repeat(2,minmax(0,1fr)); }.hub-recommend-copy { padding:24px; }
  .hub-venues { grid-template-columns:1fr; }.hub-brief { gap:24px; }
}
@media(max-width:800px) {
  .hub-mobile-wallet { display:flex; justify-content:flex-end; gap:6px; color:#ddecbb; font:11px/1.5 ui-monospace,Menlo,monospace; padding-top:14px; }
  #menu[data-screen="onboarding"] .hub-mobile-wallet { display:none; }
  #menu .home-header { flex-wrap:wrap; padding:20px 0 8px; }#menu .hub-nav { width:100%; justify-content:space-between; }
  #menu .hub-nav button { flex:1; font-size:13px; }.hub-heading { padding-top:24px; }
  .hub-heading .home-welcome { display:none; }.hub-board,.hub-lower,.hub-brief { grid-template-columns:1fr; }
  .hub-board { gap:14px; }.hub-recommend { min-height:320px; }.hub-recommend-copy { padding:26px; }
  .hub-disciplines { gap:12px; }.hub-lower { margin-top:16px; }.hub-lower .home-showcase { min-height:320px; }
  #menu .hub-discipline { min-height:175px; padding:20px 18px; }.hub-discipline .hub-tile-copy>strong { font-size:28px; }
  .hub-brief-controls { margin-top:0; }.hub-series-grid { gap:12px; }
  #menu .menu-subviews .hub-series-card { min-height:210px; padding:20px; }.hub-series-card .hub-tile-copy>strong { font-size:23px; }
  #menu .menu-subviews>div:not([hidden]) { padding-top:24px; }
}
@media(max-width:480px) {
  #menu .hub-heading h1 { font-size:28px; }#menu .hub-recommend h2 { font-size:36px; }
  .hub-recommend-copy { padding:24px; }#menu .hub-discipline { min-height:150px; padding:18px 14px; }
  .hub-discipline .hub-tile-copy>strong { font-size:26px; }.hub-arrow { width:18px; height:18px; }
  #menu .hub-link { padding:17px 14px; }.hub-link span>span { font-size:11px; }
  #menu .hub-link-feature { padding:24px; }.hub-link-feature span>span { font-size:13px; }
  .hub-links { gap:10px; }.hub-lower .home-showcase { min-height:280px; }
  #menu .menu-subviews .hub-venue { padding:18px 14px; gap:12px; }.hub-venue .hub-route { width:82px; }.hub-venue-copy strong { font-size:20px; }
  .hub-venue .hub-arrow { display:none; }.hub-route-panel { padding:20px; }.hub-prize { padding:18px; }
  .hub-series-grid { grid-template-columns:1fr; }#menu .menu-subviews .hub-series-card { min-height:225px; }
  .hub-rounds li { gap:12px; padding:12px; flex-wrap:wrap; }.hub-rounds .hub-route { width:60px; }.hub-rounds strong { font-size:16px; }
  .hub-rounds .hub-muted { flex:1; text-align:right; }.hub-field select { width:66%; }
  #menu[data-screen="onboarding"] .hub-nav { display:none; }
}
@media(max-width:359px) { .hub-links { grid-template-columns:minmax(0,1fr); } }

#menu h1:focus, #menu h2:focus { outline:none; }
#hub-pending-rewards[hidden] { display:none; }
#menu .hub-featured{width:100%;margin-top:18px;position:relative;display:flex;flex-direction:column;gap:7px;padding:20px 48px 20px 20px;text-align:left;background:#263128;color:#f0f2e8;border:1px solid #69764a;border-radius:8px;min-height:140px}
#menu .hub-featured small{color:#c3d18e;letter-spacing:.1em}#menu .hub-featured strong{font-size:26px}#menu .hub-featured span{font-size:14px;line-height:1.4}
#menu .hub-featured:focus-visible{outline:3px solid #ddf882;outline-offset:4px}