/* One parking-style header for every product route. */
:root { --header-height:74px; --bcar-font:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif; }
#product-header {
  --header-bg:#f7f5ef; --header-text:#28332f; --header-muted:#626c66;
  --header-line:rgba(165,139,101,.24); --header-accent:#a38552;
  --header-control:rgba(248,247,240,.91); --header-control-line:rgba(165,139,101,.37);
  position:fixed; inset:0 0 auto; z-index:35; width:100%; height:var(--header-height); min-height:0;
  display:grid; grid-template-columns:240px minmax(0,1fr) 300px; grid-template-rows:1fr;
  align-items:center; gap:0; margin:0; padding:0; box-sizing:border-box;
  border:0; border-bottom:1px solid var(--header-line); background:var(--header-bg);
  color:var(--header-text); font:400 14px/1.2 var(--bcar-font); text-shadow:none;
  pointer-events:auto; overflow:visible;
}
#product-header[data-header-theme=dark], body[data-tone=dark] #product-header {
  --header-bg:#111214; --header-text:#fff; --header-muted:#aaaead;
  --header-line:#292b2d; --header-control:#191c1d; --header-control-line:#48463d;
}
#product-header *, #product-header *::before, #product-header *::after { box-sizing:border-box; }
#product-header a, #product-header button { color:inherit; text-decoration:none; text-transform:none; letter-spacing:0; opacity:1; cursor:pointer; }
#product-header a:focus-visible, #product-header button:focus-visible { outline:2px solid var(--header-accent); outline-offset:3px; }
#product-header .brand {
  position:static; display:flex; align-items:center; justify-self:start; gap:8px;
  height:44px; margin:0 0 0 30px; padding:0; border:0; background:none;
  font:italic 900 26px/1.2 var(--bcar-font); letter-spacing:1px; white-space:nowrap;
}
#product-header .brand img { display:block; width:44px; height:44px; object-fit:contain; flex:none; }
#product-header .brand b { font:italic 850 26px/1.2 var(--bcar-font); letter-spacing:-.4px; }
#product-header nav {
  position:static; inset:auto; transform:none; display:grid;
  grid-template-columns:3.2em 4.2em 5.1em 4.2em 4.2em; justify-content:center; align-items:stretch;
  width:auto; min-width:0; height:100%; margin:0; padding:0; gap:clamp(14px,2.4vw,32px);
  grid-column:2; grid-row:1; background:none; font:400 14px/1.2 var(--bcar-font); letter-spacing:1px;
}
#product-header nav a {
  position:relative; display:flex; align-items:center; justify-content:center;
  height:100%; width:100%; margin:0; padding:0; border:0; background:none;
  font:inherit; letter-spacing:1px; color:var(--header-muted); white-space:nowrap;
}
#product-header nav a:hover, #product-header nav a[aria-current=page] { color:var(--header-text); }
#product-header nav a[aria-current=page] { font-weight:600; }
#product-header nav a::after { content:none; }
#product-header nav a[aria-current=page]::after { content:""; position:absolute; left:-7px; right:-7px; bottom:0; height:3px; background:var(--header-accent); }
#product-header .account-tools { display:flex; justify-content:flex-end; align-items:center; gap:8px; height:44px; min-width:0; margin:0 22px 0 0; padding:0; grid-column:3; grid-row:1; }
#product-header .coin-balance { display:flex; align-items:center; justify-content:center; gap:7px; flex:none; min-height:44px; height:44px; width:auto; margin:0; padding:0 6px; border:0; border-radius:0; background:none; box-shadow:none; font:400 12px/1.2 var(--bcar-font); white-space:nowrap; font-variant-numeric:tabular-nums; }
#product-header svg { fill:none; stroke:currentColor; stroke-width:1.65; stroke-linecap:round; stroke-linejoin:round; flex:none; }
#product-header .coin-icon { width:20px; height:20px; border:0; background:none; }
#product-header .icon-button { position:relative; display:grid; place-items:center; width:38px; min-width:38px; height:44px; min-height:44px; margin:0; padding:8px; border:0; border-radius:3px; background:none; }
#product-header .social-link svg { width:17px; height:17px; }
#product-header .social-tooltip { display:none; position:absolute; top:calc(100% + 6px); right:0; white-space:nowrap; font:400 11px/1.3 var(--bcar-font); color:var(--header-text); background:var(--header-bg); border:1px solid var(--header-line); padding:7px 10px; border-radius:3px; }
#product-header .social-link[aria-disabled=true][data-tooltip-open=true] .social-tooltip { display:block; }
#product-header .social-link:not([data-tooltip-open=true]) .social-tooltip { display:none; }
#product-header .wallet-button { display:flex; align-items:center; justify-content:center; gap:8px; flex:none; height:38px; min-height:38px; width:auto; margin:0; padding:8px 12px; border:1px solid var(--header-control-line); border-radius:3px; box-shadow:none; color:var(--header-text); background:var(--header-control); font:400 12px/1.2 var(--bcar-font); white-space:nowrap; }
#product-header .wallet-button svg { width:18px; height:18px; }
#product-header .wallet-button i { display:none; width:5px; height:5px; border-radius:50%; background:#64976c; }
#product-header .wallet-button[data-connected=true] i { display:block; }
#product-header button:disabled { cursor:default; opacity:.6; }
body:has(#product-header[data-product-page=collection]), body:has(#product-header[data-product-page=capsule]) { padding-top:var(--header-height); }
body:has(#product-header[data-product-page=collection])>.workspace { height:calc(100dvh - var(--header-height)); }
body.capture #product-header { display:none; }
body.capture:has(#product-header) { padding-top:0; }
body.capture:has(#product-header)>.workspace { height:100dvh; }
.page-account-control { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:16px 0; color:#aaaead; font:400 11px/1.4 var(--bcar-font); }
.page-account-control select { max-width:180px; min-width:0; padding:8px 10px; border:1px solid #ffffff25; border-radius:3px; background:#191c1d; color:#fff; font:inherit; }
.library>.page-account-control { margin-inline:20px; }
.capsule-page .page-account-control { justify-content:flex-start; padding-top:14px; border-top:1px solid #ffffff18; }
.race-page-tools { display:flex; align-items:center; gap:18px; margin-top:16px; font:400 11px/1.4 var(--bcar-font); }
.race-page-tools .account { display:block; margin:0; }
.race-page-tools button { padding:6px 0; border:0; background:none; color:inherit; font:inherit; text-decoration:underline; text-underline-offset:5px; }
#social-status { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media(max-height:740px) and (min-width:761px) { :root { --header-height:64px; } }
@media(max-width:1100px) and (min-width:761px) {
  #product-header { grid-template-columns:140px minmax(0,1fr) 282px; }
  #product-header .brand { margin-left:20px; gap:6px; font-size:24px; }
  #product-header .brand b { font-size:24px; }
  #product-header nav { gap:12px; font-size:13px; }
  #product-header .account-tools { gap:4px; margin-right:16px; }
  #product-header .coin-balance { font-size:11px; }
}
@media(max-width:760px) {
  :root { --header-height:112px; }
  #product-header { grid-template-columns:auto minmax(0,1fr); grid-template-rows:68px 43px; padding:0 14px; column-gap:12px; }
  #product-header .brand { grid-column:1; grid-row:1; margin:0; gap:3px; font-size:20px; letter-spacing:.5px; }
  #product-header .brand img { width:36px; height:36px; }
  #product-header .brand b { font-size:20px; }
  #product-header nav { grid-column:1/-1; grid-row:2; grid-template-columns:repeat(5,minmax(0,1fr)); height:43px; gap:0; font-size:12px; border-top:1px solid var(--header-line); }
  #product-header nav a { letter-spacing:0; }
  #product-header nav a[aria-current=page]::after { left:0; right:0; }
  #product-header .account-tools { grid-column:2; grid-row:1; height:43px; gap:5px; margin:0; }
  #product-header .coin-balance { min-width:0; padding:0 3px; gap:4px; }
  #product-header #balance-value { max-width:74px; overflow:hidden; text-overflow:ellipsis; }
  #product-header .wallet-button svg { display:none; }
  #product-header .wallet-button { height:34px; min-height:34px; padding:6px 10px; font-size:11px; }
  body:has(#product-header[data-product-page=collection])>.workspace { height:auto; }
  body:has(#product-header[data-product-page=race]) :is(.venue,.event-info) { top:calc(var(--header-height) + 22px); }
}
@media(max-width:380px) {
  #product-header nav { gap:0; font-size:12px; }
  #product-header .brand b { display:none; }
  #product-header .brand, #product-header .brand b { font-size:18px; }
}

/* Shared dialogs use the same parking controls on every route. */
#wallet-dialog, #header-balance-dialog {
 --text:#28332f; --muted:#626c66; --line:#d7d2c6; --ui-border:#d7d2c6; --ui-overlay:#f7f5ef; --ui-control:#f0ede4; --ui-selected:#e6dfcf; --accent-text:#8b6e3c; --ui-shadow:#0003; --ui-scrim:#0007; --ui-good:#477659; --ui-warning:#936b2d;
 box-sizing:border-box; position:fixed; inset:0; margin:auto; width:min(410px,calc(100vw - 32px)); height:fit-content; max-height:calc(100dvh - 40px); overflow-y:auto; padding:28px; border:1px solid var(--ui-border); border-radius:6px; color:var(--text); background:var(--ui-overlay); font:400 13px/1.6 var(--bcar-font); box-shadow:0 24px 80px var(--ui-shadow); text-shadow:none;
}
body:has(#product-header[data-header-theme=dark]) :is(#wallet-dialog,#header-balance-dialog), body[data-tone=dark] :is(#wallet-dialog,#header-balance-dialog) {
 --text:#fff; --muted:#aaaead; --line:#353938; --ui-border:#353938; --ui-overlay:#17191a; --ui-control:#222526; --ui-selected:#39352d; --accent-text:#d7ba80; --ui-good:#8fb79b; --ui-warning:#d7ba80;
}
#header-balance-dialog::backdrop { background:#0007; }
:is(#wallet-dialog,#header-balance-dialog) * { box-sizing:border-box; }
:is(#wallet-dialog,#header-balance-dialog) button, #header-balance-dialog a { color:var(--text); font:inherit; cursor:pointer; border:1px solid var(--ui-border); background:var(--ui-control); border-radius:3px; }
:is(#wallet-dialog,#header-balance-dialog) button { min-height:42px; }
:is(#wallet-dialog,#header-balance-dialog) .wallet-close { display:grid; place-items:center; width:44px; height:44px; min-width:44px; padding:0; border:0; background:none; font-size:23px; }
#header-balance-dialog .wallet-dialog-header { display:flex; justify-content:space-between; gap:16px; margin-bottom:24px; }
#header-balance-dialog .eyebrow { margin:0 0 8px; font-size:11px; color:var(--muted); }
#header-balance-dialog h2 { margin:0; font-size:25px; font-weight:650; }
#header-balance-dialog .header-balance-number { font-size:36px; font-weight:600; font-variant-numeric:tabular-nums; }
#header-balance-dialog .balance-home-link { display:block; padding:12px; text-align:center; text-decoration:none; margin-top:24px; }
#header-balance-dialog [role=status] { color:var(--ui-warning); }