/* ============================================================
   Fighter Dynasty : shared styling.
   Fight-night identity: near-black ink, crimson accent, gold for belts.
   Layout bones follow the 38-0-0 / Basketball Dynasty career look.
   ============================================================ */
:root{
  --bg:#0a0709;
  --panel:#150f12;
  --panel2:#1d1418;
  --line:rgba(255,255,255,.09);
  --txt:#f4eee8;
  --muted:#a3969a;
  --gold:#ffce4f;
  --good:#2ee06a;
  --bad:#ff5470;
  --accent2:#7cc6ff;
  --shadow:0 14px 40px rgba(0,0,0,.5);
  --dyn:#ff4155;        /* fight-night crimson */
  --dyn-deep:#a8101f;
  --dyn-ink:#1a0407;
}
*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  background:
    radial-gradient(1100px 600px at 82% -12%, #34090f 0%, transparent 60%),
    radial-gradient(900px 520px at -5% 108%, #161020 0%, transparent 55%),
    var(--bg);
  min-height:100%;
  color:var(--txt);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  /* keep content clear of the notch/Dynamic Island + home bar inside the native app */
  padding-top:env(safe-area-inset-top);
  padding-bottom:env(safe-area-inset-bottom);
}
.dyn-screen{ min-height:100vh; }
.dyn-wrap{ max-width:640px; margin:0 auto; padding:22px 16px 60px; }
.hidden{ display:none !important; }

/* ---------- shared buttons ---------- */
.dyn-btn{
  appearance:none; border:1px solid var(--line); background:var(--panel2); color:var(--txt);
  font:800 15px/1 'Inter',sans-serif; padding:14px 18px; border-radius:12px; cursor:pointer;
  transition:transform .05s ease, border-color .15s ease, background .15s ease; width:100%;
}
.dyn-btn:hover{ border-color:var(--dyn); }
.dyn-btn:active{ transform:translateY(1px); }
.dyn-btn:disabled{ opacity:.45; cursor:default; }
.dyn-btn-primary{
  background:linear-gradient(180deg,var(--dyn),var(--dyn-deep)); border-color:transparent; color:#1c0306;
  box-shadow:0 8px 26px rgba(255,65,85,.28);
}
.dyn-btn-primary:hover{ border-color:transparent; filter:brightness(1.05); }

/* ---------- home / back bar ---------- */
.dyn-topbar{ max-width:640px; margin:0 auto; padding:12px 16px 0; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.dyn-home{
  appearance:none; background:var(--panel2); border:1px solid var(--line); color:var(--txt);
  font:800 13px/1 'Inter',sans-serif; padding:9px 14px; border-radius:10px; cursor:pointer;
  transition:border-color .15s ease, transform .05s ease;
}
.dyn-home:hover{ border-color:var(--dyn); }
.dyn-home:active{ transform:translateY(1px); }
/* achievements progress pill (mode headers) */
.ach-progress{
  display:inline-flex; align-items:center; gap:5px; text-decoration:none;
  background:var(--panel2); border:1px solid var(--line); color:var(--muted);
  font:800 13px/1 'Inter',sans-serif; padding:9px 13px; border-radius:999px; white-space:nowrap;
  transition:border-color .15s ease, transform .05s ease;
}
.ach-progress b{ color:var(--gold,#ffce4f); font-weight:900; }
.ach-progress:hover{ border-color:var(--dyn); }
.ach-progress:active{ transform:translateY(1px); }

/* ---------- remove-ads upsell card (end screens) ---------- */
.bd-noads-card{
  margin:16px 0 6px; padding:16px; border-radius:14px; text-align:center;
  background:var(--panel); border:1px solid var(--line);
}
.bd-noads-txt{ margin-bottom:12px; }
.bd-noads-txt b{ display:block; font-size:16px; font-weight:900; margin-bottom:3px; }
.bd-noads-txt small{ display:block; font-size:12px; color:var(--muted); line-height:1.4; }
.bd-noads-card .dyn-btn{ margin:0; }
.bd-noads-restore{
  appearance:none; background:none; border:0; color:var(--muted); cursor:pointer;
  font:700 12px/1 'Inter',sans-serif; margin-top:10px; padding:6px; text-decoration:underline;
}
.bd-noads-restore:hover{ color:var(--txt); }
/* home-screen remove-ads controls */
.bd-noads-home{ display:flex; flex-direction:column; align-items:center; gap:2px; margin:16px auto 0; max-width:340px; }
.bd-noads-home .dyn-btn{ margin:0; width:100%; }
.bd-noads-owned{ font-size:13px; font-weight:800; color:var(--gold,#ffce4f); text-align:center; }
/* native sign-in buttons (Google / Apple) */
.bd-signin-wrap{ display:flex; flex-direction:column; gap:8px; align-items:center; width:100%; max-width:290px; margin:0 auto; }
.bd-signin-btn{ appearance:none; cursor:pointer; width:100%; display:inline-flex; align-items:center; justify-content:center; gap:2px; border-radius:999px; min-height:44px; padding:12px 16px; font:800 15px/1 'Inter',sans-serif; border:1px solid var(--line); transition:transform .05s ease, filter .15s ease; }
.bd-signin-btn:active{ transform:translateY(1px); }
/* Sign in with Apple, HIG style: the WHITE button variant on dark backgrounds so it clearly reads as a button. */
.bd-signin-apple{ background:#fff; color:#000; border-color:#fff; }
.bd-signin-google{ background:#fff; color:#1f1f1f; border-color:#dadce0; }
.bd-signin-google b{ color:#4285f4; font-weight:900; }
/* destructive account-deletion action under the signed-in chip */
.bd-acct-del{
  appearance:none; background:none; border:0; color:#e05656; cursor:pointer;
  font:700 12px/1 'Inter',sans-serif; margin-top:8px; padding:6px; text-decoration:underline; display:block; width:100%;
}

/* ---------- setup ---------- */
.dyn-setup{ text-align:center; padding-top:36px; }
.bd-wordmark{
  display:inline-flex; align-items:center; gap:10px; margin:0 auto 22px;
  font-weight:900; font-size:17px; letter-spacing:.14em; color:var(--txt); white-space:nowrap;
}
.bd-wordmark .ball{display:none;
  width:26px; height:26px; border-radius:50%; flex:0 0 auto;
  background:radial-gradient(circle at 35% 30%, #ff9e55, #c96a1d 70%, #8f4a12);
  position:relative; overflow:hidden; border:1px solid rgba(0,0,0,.4);
}
.bd-wordmark .ball::before{ content:""; position:absolute; left:50%; top:-2px; bottom:-2px; width:1.5px; background:rgba(23,11,2,.75); transform:translateX(-50%); }
.bd-wordmark .ball::after{ content:""; position:absolute; top:50%; left:-2px; right:-2px; height:1.5px; background:rgba(23,11,2,.75); transform:translateY(-50%); }
.dyn-kicker{ color:var(--dyn); font-weight:800; letter-spacing:.18em; text-transform:uppercase; font-size:12px; }
.dyn-h1{ font-size:52px; font-weight:900; letter-spacing:-.02em; margin:6px 0 12px; line-height:1; }
.dyn-sub{ color:var(--muted); font-size:15px; line-height:1.6; max-width:460px; margin:0 auto 26px; }
.dyn-field{ display:block; text-align:left; max-width:340px; margin:0 auto 16px; }
.dyn-field span{ display:block; font-size:12px; color:var(--muted); font-weight:700; margin:0 0 6px; text-transform:uppercase; letter-spacing:.08em; }
.dyn-field input, .dyn-field select{
  width:100%; box-sizing:border-box; background:var(--panel); border:1px solid var(--line); color:var(--txt);
  border-radius:11px; padding:13px 14px; font:700 16px 'Inter',sans-serif; -webkit-appearance:none; appearance:none;
}
.dyn-field select{ cursor:pointer; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23a1958a' d='M1 1l5 5 5-5'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; padding-right:34px; }
.dyn-field input:focus, .dyn-field select:focus{ outline:none; border-color:var(--dyn); }
.dyn-setup .dyn-btn{ display:block; max-width:340px; margin:6px auto 0; }
.dyn-back{ display:inline-block; margin-top:22px; color:var(--muted); font-size:13px; font-weight:600; text-decoration:none; }
.dyn-back:hover{ color:var(--txt); }

/* ---------- section header ---------- */
.dyn-top{ text-align:center; margin:6px 0 18px; }
.dyn-top-title{ font-size:26px; font-weight:900; letter-spacing:-.01em; }
.dyn-top-sub{ color:var(--muted); font-size:13px; margin-top:4px; }

/* ---------- draft grid ---------- */
.dyn-draft-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:8px; }
@media(max-width:560px){ .dyn-draft-grid{ grid-template-columns:repeat(3,1fr); } }
.dcard{
  background:linear-gradient(180deg,var(--panel2),var(--panel)); border:1px solid var(--line);
  border-radius:12px; padding:9px 7px 8px; text-align:center; cursor:pointer; position:relative; overflow:hidden;
  transition:border-color .12s ease, transform .05s ease;
}
.dcard:hover{ border-color:var(--dyn); }
.dcard:active{ transform:scale(.98); }
.dcard-pos{ position:absolute; top:6px; left:7px; font-size:10px; font-weight:800; color:var(--muted); letter-spacing:.04em; }
.dcard-ovr{ position:absolute; top:5px; right:7px; font-size:15px; font-weight:900; color:var(--gold); }
.dcard-face{
  width:44px; height:44px; margin:16px auto 6px; border-radius:50%;
  background:radial-gradient(circle at 50% 35%,#4a3115,#241505); display:flex; align-items:center; justify-content:center;
  font-weight:900; font-size:15px; color:#f0dcc3; border:1.5px solid rgba(255,255,255,.1);
}
.dcard-name{ font-size:11.5px; font-weight:700; line-height:1.2; height:28px; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.dcard-reroll{ position:absolute; inset:0; background:rgba(26,4,7,.86); color:var(--dyn); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:12px; opacity:0; transition:opacity .12s; }
.dcard:hover .dcard-reroll{ opacity:1; }
.dcard.spinning .dcard-face{ animation:dynflip .5s ease; }
/* departed players (off-season attrition): red card, must be re-rolled */
.dcard.gone{ border-color:var(--bad); }
.dcard.gone .dcard-name{ color:var(--bad); }
.dcard.gone .dcard-ovr{ color:var(--bad); opacity:.7; }
.dcard-gone{ position:absolute; left:0; right:0; bottom:0; background:rgba(255,84,112,.18); color:var(--bad); font-size:8.5px; font-weight:900; text-transform:uppercase; letter-spacing:.05em; padding:3px 0; text-align:center; }
@keyframes dynflip{ 0%{transform:rotateY(0)} 50%{transform:rotateY(90deg)} 100%{transform:rotateY(0)} }
.dyn-draft-actions{ margin-top:16px; display:flex; flex-direction:column; gap:10px; }
.dyn-respin-note{ color:var(--muted); font-size:12px; text-align:center; line-height:1.5; }
.dyn-respin-note b{ color:var(--txt); }
.dyn-draft-split{ font-size:12px; color:var(--muted); font-weight:800; text-transform:uppercase; letter-spacing:.08em; margin:14px 0 8px; text-align:left; }

/* ---------- season ---------- */
.dyn-hud{ display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:10px; }
.dyn-hud-cell{ background:var(--panel); border:1px solid var(--line); border-radius:11px; padding:10px 6px; text-align:center; }
.dyn-hud-cell span{ display:block; font-size:10px; color:var(--muted); font-weight:700; text-transform:uppercase; letter-spacing:.06em; }
.dyn-hud-cell b{ font-size:17px; font-weight:900; }
.dyn-cups{ display:flex; gap:6px; flex-wrap:wrap; margin-bottom:12px; }
.cup-pill{ font-size:11px; font-weight:800; padding:5px 10px; border-radius:999px; border:1px solid var(--line); color:var(--muted); background:var(--panel); }
.cup-pill b{ color:var(--txt); }
.cup-pill.win{ border-color:var(--gold); color:var(--gold); }
.cup-pill.out{ opacity:.55; }
.dyn-manage-row{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:12px; }
.dyn-mini{ appearance:none; background:var(--panel2); border:1px solid var(--line); color:var(--txt); border-radius:10px; padding:10px; font:800 13px 'Inter',sans-serif; cursor:pointer; }
.dyn-mini:hover{ border-color:var(--dyn); }
.dyn-mini:active{ transform:translateY(1px); }
.dyn-log{ display:flex; flex-direction:column; gap:6px; min-height:120px; margin-bottom:14px; }
.mrow{ background:var(--panel); border:1px solid var(--line); border-radius:11px; padding:10px 12px; display:flex; align-items:center; gap:10px; animation:mrowIn .25s ease; }
@keyframes mrowIn{ from{ opacity:0; transform:translateY(6px);} to{opacity:1;transform:none;} }
.mrow-mw{ font-size:10px; font-weight:800; color:var(--muted); width:52px; flex:0 0 auto; text-transform:uppercase; }
.mrow-main{ flex:1; min-width:0; }
.mrow-fix{ font-size:13px; font-weight:700; }
.mrow-fix .ha{ color:var(--muted); font-weight:800; font-size:11px; }
.mrow-sc{ font-size:11px; color:var(--muted); margin-top:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mrow-res{ font-weight:900; font-size:14px; flex:0 0 auto; width:72px; text-align:center; border-radius:8px; padding:6px 0; }
.mrow-res.W{ color:var(--good); background:rgba(46,224,106,.12); }
.mrow-res.L{ color:var(--bad); background:rgba(255,84,112,.12); }
.mrow.cup{ border-color:rgba(255,206,79,.4); }
.mrow.cup .mrow-mw{ color:var(--gold); }
.mrow.po{ border-color:rgba(124,198,255,.4); }
.mrow.po .mrow-mw{ color:var(--accent2); }
.dyn-season-actions{ display:flex; flex-direction:column; gap:9px; position:sticky; bottom:10px; }

/* ---------- tables ---------- */
.dyn-table{ width:100%; border-collapse:collapse; font-size:13px; margin:10px 0; }
.dyn-table th{ text-align:left; color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.06em; padding:6px 8px; border-bottom:1px solid var(--line); }
.dyn-table td{ padding:8px; border-bottom:1px solid rgba(255,255,255,.05); }
.dyn-table td.num, .dyn-table th.num{ text-align:right; font-variant-numeric:tabular-nums; }
.dyn-table tr.me{ background:rgba(255,65,85,.12); }
.dyn-table tr.me td{ font-weight:800; }
.dyn-table tr.po td:first-child{ border-left:3px solid var(--dyn); }
.dyn-table tr.lotto td:first-child{ border-left:3px solid rgba(255,255,255,.14); }

/* ---------- season-end / summary panels ---------- */
.dyn-panel{ background:var(--panel); border:1px solid var(--line); border-radius:16px; padding:20px; margin-bottom:14px; text-align:center; }
.dyn-panel h2{ font-size:24px; font-weight:900; margin:0 0 4px; }
.dyn-pos-badge{ font-size:54px; font-weight:900; line-height:1; letter-spacing:-.03em; }
.dyn-pos-badge small{ font-size:20px; color:var(--muted); }
.dyn-trophies{ display:flex; gap:8px; flex-wrap:wrap; justify-content:center; margin:14px 0 4px; }
.trophy{ background:var(--panel2); border:1px solid var(--gold); border-radius:11px; padding:8px 12px; font-weight:800; font-size:13px; color:var(--gold); }
.trophy.none{ border-color:var(--line); color:var(--muted); }
.dyn-verdict{ font-size:14px; line-height:1.6; color:var(--txt); }
.dyn-verdict.good{ color:var(--good); }
.dyn-verdict.bad{ color:var(--bad); }
.dyn-stat-row{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:12px 0; }
.dyn-stat{ background:var(--panel2); border:1px solid var(--line); border-radius:11px; padding:12px; text-align:left; }
.dyn-stat span{ font-size:11px; color:var(--muted); font-weight:700; display:block; }
.dyn-stat b{ font-size:17px; font-weight:900; }

/* ---------- signings grid ---------- */
.signing-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:8px; margin:12px 0; }
@media(max-width:560px){ .signing-grid{ grid-template-columns:repeat(3,1fr); } }

/* ---------- wheel overlay ---------- */
.dyn-overlay{ position:fixed; inset:0; background:rgba(8,4,6,.88); z-index:200; display:flex; align-items:center; justify-content:center; padding:18px; overflow-y:auto; }
.dyn-modal{ background:var(--panel); border:1px solid var(--line); border-radius:18px; padding:24px 22px; max-width:420px; width:100%; text-align:center; box-shadow:var(--shadow); margin:auto; }
.dyn-modal h2{ font-size:22px; font-weight:900; margin:0 0 6px; }
.dyn-modal p{ color:var(--muted); font-size:14px; line-height:1.6; margin:0 0 16px; }
.wheel-wrap{ position:relative; width:230px; height:230px; margin:6px auto 18px; }
.wheel{ width:100%; height:100%; border-radius:50%; border:4px solid var(--line); transition:transform 3.4s cubic-bezier(.17,.67,.2,1); }
.wheel-ptr{ position:absolute; top:-6px; left:50%; transform:translateX(-50%); width:0;height:0; border-left:11px solid transparent; border-right:11px solid transparent; border-top:18px solid var(--gold); z-index:2; }
.evt-result{ border-radius:12px; padding:16px; margin:4px 0 16px; font-weight:800; }
.evt-result.power{ background:rgba(255,65,85,.12); border:1px solid var(--dyn); }
.evt-result.punish{ background:rgba(255,84,112,.12); border:1px solid var(--bad); }
.evt-result .evt-name{ font-size:17px; margin-bottom:5px; }
.evt-result .evt-desc{ font-size:13px; font-weight:600; color:var(--txt); line-height:1.5; }
.dyn-modal .dyn-btn{ margin-top:6px; }
.dyn-modal-actions{ display:flex; flex-direction:column; gap:9px; }

/* ---------- toast ---------- */
.dyn-toast{ position:fixed; left:50%; bottom:26px; transform:translateX(-50%); background:var(--dyn-ink); color:#fff; border:1px solid var(--dyn); padding:11px 18px; border-radius:999px; font-weight:700; font-size:13px; z-index:300; box-shadow:var(--shadow); max-width:86vw; text-align:center; }

/* ---------- mode chooser ---------- */
.dyn-choose{ display:flex; flex-direction:column; gap:12px; max-width:420px; margin:8px auto 0; }
.dyn-choice{
  display:flex; flex-direction:column; align-items:flex-start; gap:5px; text-align:left; cursor:pointer;
  background:linear-gradient(180deg,var(--panel2),var(--panel)); border:1px solid var(--line); border-radius:16px;
  padding:18px 18px 16px; color:var(--txt); font-family:'Inter',sans-serif;
  transition:border-color .12s ease, transform .05s ease, box-shadow .15s ease;
}
.dyn-choice:hover{ border-color:var(--dyn); box-shadow:0 8px 24px rgba(255,65,85,.16); }
.dyn-choice:active{ transform:translateY(1px); }
.dyn-choice-emoji{ font-size:30px; line-height:1; }
.dyn-choice-title{ font-size:20px; font-weight:900; }
.dyn-choice-sub{ font-size:12.5px; font-weight:600; color:var(--muted); line-height:1.5; }

/* ---------- account chip (sign-in) ---------- */
.bd-acct-slot{ display:flex; align-items:center; justify-content:center; gap:10px; min-height:36px; margin:14px auto 0; }
.bd-acct-chip{ font-size:12.5px; font-weight:800; color:var(--txt); background:var(--panel); border:1px solid var(--line); padding:8px 14px; border-radius:999px; }
.bd-acct-out{ appearance:none; background:none; border:none; color:var(--muted); font:700 12px 'Inter',sans-serif; cursor:pointer; text-decoration:underline; }
.bd-acct-out:hover{ color:var(--dyn); }

/* ---------- achievement unlock toasts ---------- */
#achToastHost{ position:fixed; top:14px; left:50%; transform:translateX(-50%); z-index:400; display:flex; flex-direction:column; gap:8px; width:min(340px, 92vw); pointer-events:none; }
.ach-toast{
  background:linear-gradient(180deg,var(--panel2),var(--panel)); border:1px solid var(--gold); border-radius:14px;
  padding:11px 16px; box-shadow:0 14px 40px rgba(0,0,0,.55); opacity:0; transform:translateY(-12px);
  transition:opacity .3s ease, transform .3s ease; text-align:left;
}
.ach-toast.on{ opacity:1; transform:none; }
.ach-toast .tr{ float:right; font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.08em; margin-top:3px; }
.ach-toast b{ display:block; font-size:14px; font-weight:900; color:var(--txt); }
.ach-toast small{ display:block; font-size:11.5px; color:var(--muted); font-weight:600; margin-top:2px; }

/* ---------- achievements page ---------- */
.ach-summary{ text-align:center; margin:4px 0 18px; }
.ach-summary .big{ font-size:44px; font-weight:900; letter-spacing:-.02em; }
.ach-summary .big span{ color:var(--muted); font-size:24px; }
.ach-grid{ display:flex; flex-direction:column; gap:8px; margin:10px 0 26px; }
.ach-row{
  display:flex; align-items:center; gap:12px; background:var(--panel); border:1px solid var(--line);
  border-radius:13px; padding:12px 14px; text-align:left;
}
.ach-row.locked{ opacity:.45; }
.ach-row .ico{ font-size:22px; flex:0 0 auto; }
.ach-row .txt{ flex:1; min-width:0; }
.ach-row .txt b{ display:block; font-size:14px; font-weight:900; }
.ach-row .txt small{ display:block; font-size:11.5px; color:var(--muted); font-weight:600; margin-top:1px; }
.ach-row .rar{ flex:0 0 auto; font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.07em; }

/* ---------- legal footer (every page) ---------- */
.bd-legal{
  max-width:640px; margin:30px auto 0; padding:18px 16px 34px; text-align:center;
  color:var(--muted); font-size:11px; line-height:1.6; border-top:1px solid var(--line);
}
.bd-links{ display:flex; gap:16px; justify-content:center; flex-wrap:wrap; margin:0 0 14px; }
.bd-links a{ color:var(--muted); font-size:12px; font-weight:700; text-decoration:none; }
.bd-links a:hover{ color:var(--dyn); }

/* ---------- articles / content pages ---------- */
.bd-nav{ max-width:760px; margin:0 auto; padding:18px 16px 6px; display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.bd-nav-home{ display:inline-flex; align-items:center; gap:9px; font-weight:900; font-size:14px; letter-spacing:.12em; color:var(--txt); text-decoration:none; white-space:nowrap; }
.bd-nav-home .ball{ width:20px; height:20px; border-radius:50%; background:radial-gradient(circle at 35% 30%, #ff9e55, #c96a1d 70%, #8f4a12); border:1px solid rgba(0,0,0,.4); }
.bd-nav nav{ display:flex; gap:16px; }
.bd-nav nav a{ color:var(--muted); font-size:13px; font-weight:700; text-decoration:none; }
.bd-nav nav a:hover{ color:var(--dyn); }
.bd-article{ max-width:720px; margin:0 auto; padding:26px 16px 40px; }
.bd-article h1{ font-size:34px; font-weight:900; letter-spacing:-.01em; line-height:1.15; margin:10px 0 8px; }
.bd-article .byline{ color:var(--muted); font-size:13px; font-weight:600; margin:0 0 22px; }
.bd-article h2{ font-size:22px; font-weight:900; margin:30px 0 10px; }
.bd-article h3{ font-size:17px; font-weight:800; margin:22px 0 8px; }
.bd-article p, .bd-article li{ font-size:15.5px; line-height:1.75; color:var(--txt); }
.bd-article p{ margin:0 0 16px; }
.bd-article ul, .bd-article ol{ margin:0 0 16px; padding-left:22px; }
.bd-article li{ margin-bottom:8px; }
.bd-article a{ color:var(--dyn); font-weight:700; text-decoration:none; }
.bd-article a:hover{ text-decoration:underline; }
.bd-article .lead{ font-size:17px; color:var(--txt); }
.bd-article table{ width:100%; border-collapse:collapse; font-size:13.5px; margin:14px 0 20px; }
.bd-article th{ text-align:left; color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.06em; padding:7px 8px; border-bottom:1px solid var(--line); }
.bd-article td{ padding:7px 8px; border-bottom:1px solid rgba(255,255,255,.05); }
.bd-article td.num, .bd-article th.num{ text-align:right; font-variant-numeric:tabular-nums; }
.bd-card-list{ display:flex; flex-direction:column; gap:12px; margin:18px 0; }
.bd-card-list a{
  display:block; background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:16px 18px;
  color:var(--txt); text-decoration:none; transition:border-color .12s ease;
}
.bd-card-list a:hover{ border-color:var(--dyn); }
.bd-card-list b{ display:block; font-size:17px; font-weight:900; margin-bottom:4px; }
.bd-card-list span{ color:var(--muted); font-size:13px; line-height:1.5; font-weight:600; }

/* account row: marketing email preferences */
.bd-acct-mail{ appearance:none; background:none; border:none; color:var(--dyn); font:700 12px 'Inter',sans-serif; cursor:pointer; text-decoration:underline; }
.bd-acct-mail:hover{ color:var(--txt); }

/* article author box (E-E-A-T) */
.bd-author{ margin:26px 0 8px; padding:14px 16px; border:1px solid var(--line); border-radius:14px; background:var(--panel); font-size:13.5px; color:var(--muted); }
.bd-author b{ display:block; color:var(--txt); font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; margin-bottom:6px; }
.bd-author p{ margin:0; line-height:1.5; }
.bd-author a{ color:var(--dyn); font-weight:700; text-decoration:none; }
/* ============================================================
   Fighter Dynasty : career extras (ported from the Basketball Dynasty player sheet).
   Adds the bits unique to living one player's career: the position
   select, the 16-attribute card, the season sub-HUD, awards, offers
   and the contract panel. Inherits the hardwood theme from styles.css.
   ============================================================ */

/* ---------- position select ---------- */
.pl-poswrap{ margin:4px 0 18px; }
.pl-posgrid{ display:grid; grid-template-columns:repeat(5,1fr); gap:8px; margin-top:8px; }
@media(max-width:560px){ .pl-posgrid{ grid-template-columns:repeat(2,1fr); } .pl-posgrid .pl-poscard:last-child{ grid-column:1 / -1; } }
.pl-poscard{
  background:var(--panel2); border:1px solid var(--line); border-radius:13px; padding:14px 8px 12px;
  cursor:pointer; color:var(--txt); text-align:center; display:flex; flex-direction:column; align-items:center; gap:5px;
  font-family:'Inter',sans-serif; transition:border-color .12s ease, background .12s ease, transform .05s ease;
}
.pl-poscard:hover{ border-color:var(--dyn); }
.pl-poscard:active{ transform:translateY(1px); }
.pl-poscard.on{ border-color:var(--dyn); background:rgba(255,65,85,.1); }
.pl-poscard b{ font-size:13px; font-weight:900; }
.pl-poscard small{ font-size:10px; font-weight:600; color:var(--muted); line-height:1.4; }
.pl-poscard.on small{ color:var(--txt); }
.pl-pos-tag{
  font-size:12px; font-weight:900; letter-spacing:.06em; color:var(--dyn);
  background:rgba(255,65,85,.14); border-radius:7px; padding:3px 9px;
}

/* ---------- the attribute card ---------- */
.pl-card{
  background:linear-gradient(180deg,var(--panel2),var(--panel)); border:1px solid var(--line);
  border-radius:18px; padding:18px; margin:0 0 14px; box-shadow:var(--shadow);
}
.pl-card-head{ display:flex; align-items:center; gap:14px; margin-bottom:14px; }
.pl-ovr-badge{
  width:62px; height:62px; flex:0 0 auto; border-radius:14px; display:flex; flex-direction:column;
  align-items:center; justify-content:center; background:radial-gradient(circle at 50% 30%,#3a1016,#1d060a);
  border:2px solid var(--dyn); box-shadow:0 6px 18px rgba(255,65,85,.28);
}
.pl-ovr-badge b{ font-size:26px; font-weight:900; line-height:1; color:#fff; }
.pl-ovr-badge span{ font-size:8.5px; font-weight:800; letter-spacing:.1em; color:var(--dyn); margin-top:2px; }
.pl-card-id{ min-width:0; flex:1; text-align:left; }
.pl-card-id .nm{ font-size:20px; font-weight:900; line-height:1.1; }
.pl-card-id .meta{ font-size:12px; font-weight:700; color:var(--muted); margin-top:3px; }
.pl-card-id .tier{ display:inline-block; margin-top:6px; font-size:11px; font-weight:900; padding:3px 9px; border-radius:999px; background:rgba(255,255,255,.06); }

.pl-attrs{ display:grid; grid-template-columns:1fr 1fr; gap:8px 16px; }
@media(max-width:460px){ .pl-attrs{ grid-template-columns:1fr; } }
.pl-attr{ display:flex; align-items:center; gap:9px; }
.pl-attr .lbl{ font-size:10px; font-weight:800; color:var(--muted); width:38px; flex:0 0 auto; letter-spacing:.02em; }
.pl-attr .bar{ flex:1; height:7px; border-radius:999px; background:rgba(255,255,255,.08); overflow:hidden; }
.pl-attr .fill{ display:block; height:100%; border-radius:999px; min-width:3px; transition:width .3s ease; }
.pl-attr .val{ font-size:13px; font-weight:900; width:22px; flex:0 0 auto; text-align:right; font-variant-numeric:tabular-nums; }

/* ---------- season sub-HUD ---------- */
.pl-subhud{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.pl-club-chip{
  font-size:12px; font-weight:900; padding:6px 12px; border-radius:999px;
  background:linear-gradient(180deg,var(--dyn),var(--dyn-deep)); color:#1c0306;
}
.pl-subhud-cell{ font-size:12px; color:var(--muted); font-weight:700; background:var(--panel); border:1px solid var(--line); padding:6px 11px; border-radius:999px; }
.pl-subhud-cell b{ color:var(--txt); font-weight:900; margin-left:3px; }

/* your line inside a match-log row */
.mrow-you{ font-size:11px; font-weight:800; color:var(--dyn); margin-top:2px; }
.mrow-you .did{ color:var(--muted); font-weight:700; }
.mrow-rating{ flex:0 0 auto; width:44px; text-align:center; font-weight:900; font-size:14px; border-radius:8px; padding:5px 0; margin-left:2px; }
.mrow-rating.hi{ color:var(--good); background:rgba(46,224,106,.12); }
.mrow-rating.mid{ color:var(--txt); background:rgba(255,255,255,.05); }
.mrow-rating.lo{ color:var(--bad); background:rgba(255,84,112,.12); }

/* ---------- awards ---------- */
.pl-awards{ display:flex; flex-direction:column; gap:8px; margin:12px 0; }
.pl-award{
  display:flex; align-items:center; gap:12px; text-align:left;
  background:var(--panel2); border:1px solid var(--line); border-radius:12px; padding:12px 14px;
}
.pl-award.gold{ border-color:var(--gold); background:rgba(255,206,79,.08); }
.pl-award .ico{ font-size:24px; flex:0 0 auto; }
.pl-award .txt{ min-width:0; }
.pl-award .txt b{ font-size:14px; font-weight:900; display:block; }
.pl-award .txt small{ font-size:11.5px; color:var(--muted); font-weight:600; }
.pl-award.gold .txt b{ color:var(--gold); }

/* generated season write-up */
.pl-blurb{ font-size:14px; line-height:1.55; color:var(--txt); font-style:italic; max-width:440px; margin:2px auto 14px; }

/* big MVP readout */
.pl-bdo{ text-align:center; margin:6px 0 4px; }
.pl-bdo .rank{ font-size:52px; font-weight:900; line-height:1; letter-spacing:-.02em; }
.pl-bdo .cap{ font-size:12px; font-weight:800; color:var(--muted); text-transform:uppercase; letter-spacing:.1em; margin-top:4px; }
.pl-bdo.win .rank{ color:var(--gold); }

/* ---------- contract + offers ---------- */
.pl-contract{
  margin:10px 0 2px; padding:12px 14px; border-radius:12px; font-size:13.5px; font-weight:700;
  background:var(--panel2); border:1px solid var(--line); color:var(--txt); line-height:1.5; text-align:left;
}
.pl-contract b{ font-weight:900; color:var(--dyn); }
.pl-offers{ display:flex; flex-direction:column; gap:8px; margin:12px 0; }
.pl-offer{
  display:flex; align-items:center; gap:12px; width:100%; text-align:left; cursor:pointer;
  background:var(--panel2); border:1px solid var(--line); border-radius:12px; padding:13px 14px; color:var(--txt);
  font-family:'Inter',sans-serif; transition:border-color .12s ease, transform .05s ease;
}
.pl-offer:hover{ border-color:var(--dyn); }
.pl-offer:active{ transform:translateY(1px); }
.pl-offer.stay{ border-style:dashed; }
.pl-offer.on{ border-color:var(--dyn); background:rgba(255,65,85,.14); box-shadow:0 0 0 1px var(--dyn) inset; }
.pl-offer.on .info b::after{ content:' \2713'; color:var(--dyn); }
.pl-offer.locked{ border-style:dashed; opacity:.92; }
.pl-offer .info{ flex:1; min-width:0; }
.pl-offer .info b{ font-size:15px; font-weight:900; display:block; }
.pl-offer .info small{ font-size:11.5px; color:var(--muted); font-weight:700; }
.pl-offer .str{ font-size:13px; font-weight:900; color:var(--dyn); flex:0 0 auto; text-align:right; }
.pl-offer .str small{ display:block; font-size:10px; color:var(--muted); font-weight:700; }

/* training focus chips */
.pl-train{ display:grid; grid-template-columns:repeat(auto-fill,minmax(66px,1fr)); gap:7px; margin:10px 0 4px; }
.pl-train-chip{
  background:var(--panel2); border:1px solid var(--line); border-radius:10px; padding:9px 4px; cursor:pointer;
  color:var(--txt); font-family:'Inter',sans-serif; text-align:center;
}
.pl-train-chip:hover{ border-color:var(--dyn); }
.pl-train-chip.on{ border-color:var(--dyn); background:rgba(255,65,85,.12); }
.pl-train-chip .k{ font-size:9.5px; font-weight:800; color:var(--muted); }
.pl-train-chip .v{ font-size:15px; font-weight:900; }
.pl-train-chip.on .k{ color:var(--txt); }

/* career-end hero number */
.pl-hero{ text-align:center; margin:2px 0 6px; }
.pl-hero .big{ font-size:64px; font-weight:900; line-height:1; letter-spacing:-.03em; color:var(--gold); }
.pl-hero .cap{ font-size:14px; font-weight:900; letter-spacing:.04em; color:var(--txt); margin-top:2px; }

/* ---- expected role + title odds chips (offers, contract card) ---- */
.pl-chips{ display:flex; gap:5px; flex-wrap:wrap; margin-top:6px; }
.pl-chip{ font-size:10.5px; font-weight:800; letter-spacing:.02em; padding:2px 8px; border-radius:999px; background:rgba(255,255,255,.07); color:var(--muted); }
.pl-chip.star{ background:var(--gold); color:#170b02; }
.pl-chip.starter{ background:rgba(255,65,85,.18); color:var(--dyn); }
.pl-chip.rotation{ background:rgba(124,198,255,.14); color:var(--accent2); }
.pl-chip.bench{ background:rgba(255,84,112,.14); color:var(--bad); }

/* ---- agent message (end of season) ---- */
.agent-msg{ text-align:left; }
.agent-head{ display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.agent-av{ width:38px; height:38px; border-radius:50%; background:linear-gradient(135deg,var(--dyn),#ffb43b); color:#170b02; font-weight:900; display:flex; align-items:center; justify-content:center; font-size:13px; flex-shrink:0; }
.agent-head b{ display:block; font-size:14px; }
.agent-head small{ color:var(--muted); font-size:11.5px; }
.agent-bubble{ background:rgba(255,255,255,.07); border:1px solid var(--line); border-radius:4px 16px 16px 16px; padding:12px 14px; font-size:14px; line-height:1.5; }
.agent-bubble p{ margin:0 0 8px; }
.agent-bubble p:last-child{ margin:0; }

/* ---- league news ---- */
.news-champ, .news-row{ display:flex; align-items:center; gap:12px; padding:14px 16px; text-align:left; }
.news-champ .ico, .news-row .ico{ font-size:26px; line-height:1; flex-shrink:0; }
.news-champ b, .news-row b{ display:block; font-size:15px; }
.news-champ small, .news-row small{ display:block; color:var(--muted); font-size:12.5px; margin-top:2px; line-height:1.4; }
.news-champ.me{ border-color:var(--gold); box-shadow:0 0 0 1px var(--gold) inset; }
.news-h{ font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); text-align:left; margin-bottom:6px; }
.news-power{ list-style:none; margin:0; padding:0; counter-reset:pw; }
.news-power li{ display:flex; align-items:center; gap:8px; padding:6px 0; border-bottom:1px solid var(--line); font-size:13.5px; font-weight:700; counter-increment:pw; }
.news-power li:last-child{ border-bottom:0; }
.news-power li::before{ content:counter(pw); width:18px; color:var(--muted); font-size:12px; }
.news-power li .nm{ flex:1; text-align:left; }
.news-power li .nm i{ font-style:normal; font-size:10px; color:var(--dyn); font-weight:900; letter-spacing:.08em; margin-left:6px; }
.news-power li .rt{ font-variant-numeric:tabular-nums; color:var(--txt); width:26px; text-align:right; }
.news-power li .mv{ width:44px; text-align:right; font-size:12px; font-weight:800; }
.up{ color:var(--good); font-style:normal; }
.down{ color:var(--bad); font-style:normal; }
.flat{ color:var(--muted); }
.news-movers{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:10px; text-align:left; font-size:12.5px; }
.news-movers b{ display:block; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin-bottom:4px; }
.news-movers span{ display:block; padding:2px 0; font-weight:700; }
.news-movers em{ font-size:11.5px; font-weight:800; margin-left:4px; }

/* ============================================================
   Fighter Dynasty additions
   ============================================================ */
.fd-mark{ display:inline-flex; align-items:center; gap:10px; margin:0 auto 22px; font-weight:900; font-size:16px; letter-spacing:.16em; color:var(--txt); white-space:nowrap; }
.fd-mark .glove{ width:34px; height:34px; flex:0 0 auto; }
.fd-belt{ color:var(--gold); }
.fd-pill{ display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:900; padding:4px 10px; border-radius:999px; background:rgba(255,255,255,.06); border:1px solid var(--line); color:var(--muted); letter-spacing:.02em; }
.fd-pill b{ color:var(--txt); }
.fd-pill.gold{ color:var(--gold); border-color:rgba(255,206,79,.45); background:rgba(255,206,79,.08); }
.fd-pill.red{ color:#ff7a88; border-color:rgba(255,65,85,.45); background:rgba(255,65,85,.08); }
.fd-pill.green{ color:var(--good); border-color:rgba(46,224,106,.4); background:rgba(46,224,106,.08); }
.fd-card{ background:linear-gradient(180deg,var(--panel2),var(--panel)); border:1px solid var(--line); border-radius:16px; padding:16px; margin:0 0 12px; }
.fd-card h3{ margin:0 0 10px; font-size:13px; font-weight:900; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
.fd-row{ display:flex; align-items:center; gap:10px; }
.fd-grow{ flex:1; min-width:0; }
.fd-offer{ display:block; width:100%; text-align:left; cursor:pointer; background:linear-gradient(180deg,var(--panel2),var(--panel)); border:1px solid var(--line); border-radius:14px; padding:14px; margin:0 0 10px; color:var(--txt); font-family:inherit; transition:border-color .12s, transform .05s; }
.fd-offer:hover{ border-color:var(--dyn); }
.fd-offer:active{ transform:translateY(1px); }
.fd-offer.sel{ border-color:var(--dyn); box-shadow:0 0 0 1px var(--dyn) inset; }
.fd-offer .nm{ font-size:16px; font-weight:900; line-height:1.15; }
.fd-offer .meta{ font-size:12px; color:var(--muted); font-weight:700; margin-top:3px; }
.fd-offer .nums{ display:grid; grid-template-columns:repeat(4,1fr); gap:6px; margin-top:10px; }
.fd-offer .nums div{ background:rgba(255,255,255,.04); border-radius:9px; padding:7px 6px; text-align:center; }
.fd-offer .nums span{ display:block; font-size:9.5px; color:var(--muted); font-weight:800; text-transform:uppercase; letter-spacing:.06em; }
.fd-offer .nums b{ font-size:14px; font-weight:900; }
.fd-odds{ height:6px; border-radius:999px; background:rgba(255,255,255,.08); overflow:hidden; margin-top:10px; }
.fd-odds i{ display:block; height:100%; background:linear-gradient(90deg,var(--dyn),var(--gold)); }
.fd-face{ width:46px; height:46px; border-radius:50%; flex:0 0 auto; display:flex; align-items:center; justify-content:center; font-weight:900; font-size:15px; color:#fff; border:2px solid rgba(255,255,255,.15); text-shadow:0 1px 2px rgba(0,0,0,.5); }
.fd-ovr{ font-weight:900; color:var(--gold); }
.fd-slider{ width:100%; accent-color:var(--dyn); }
.fd-tier{ display:grid; grid-template-columns:repeat(4,1fr); gap:6px; }
.fd-tier button{ appearance:none; background:var(--panel2); border:1px solid var(--line); border-radius:10px; padding:9px 4px; color:var(--txt); font:800 11.5px/1.25 'Inter',sans-serif; cursor:pointer; text-align:center; }
.fd-tier button small{ display:block; font-size:10px; color:var(--muted); font-weight:700; margin-top:3px; }
.fd-tier button.on{ border-color:var(--dyn); background:rgba(255,65,85,.1); }
.fd-tier button:disabled{ opacity:.4; cursor:default; }
.fd-money{ color:var(--good); font-weight:900; }
.fd-neg{ color:var(--bad); font-weight:900; }
.fd-bar{ height:8px; border-radius:999px; background:rgba(255,255,255,.08); overflow:hidden; }
.fd-bar i{ display:block; height:100%; border-radius:999px; }
.fd-split{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.fd-fightbtns{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:10px; }
.fd-log-item{ font-size:12.5px; color:var(--muted); padding:7px 0; border-bottom:1px solid rgba(255,255,255,.05); line-height:1.45; }
.fd-log-item b{ color:var(--txt); }
.fd-rank{ font-weight:900; color:var(--gold); }
.fd-tabs{ display:flex; gap:6px; overflow-x:auto; margin:0 0 12px; padding-bottom:2px; }
.fd-tabs button{ appearance:none; flex:0 0 auto; background:var(--panel); border:1px solid var(--line); color:var(--muted); border-radius:999px; padding:8px 13px; font:800 12px/1 'Inter',sans-serif; cursor:pointer; }
.fd-tabs button.on{ color:var(--txt); border-color:var(--dyn); background:rgba(255,65,85,.1); }

/* flags + headshots */
.fd-flag{ display:inline-block; vertical-align:-2px; border-radius:2px; box-shadow:0 0 0 1px rgba(0,0,0,.35); object-fit:cover; flex:0 0 auto; }
.fd-face{ overflow:hidden; position:relative; }
.fd-face img.hs{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.fd-homebtn{ display:block; text-align:center; text-decoration:none; margin-top:22px; color:var(--muted); }

/* iPhone zooms the page when a focused text box is under 16px: keep them at 16 */
input[type="text"], input:not([type]), input[type="search"], input[type="email"], select, textarea{ font-size:16px !important; }

/* ============================================================
   Accounts, Hall of Fame and player cards (account.js, hof.js, card.js)
   ============================================================ */
/* sign-in buttons (the sheet on every page and the Fight Online sign-in screen) */
.ol-signin{ display:flex; flex-direction:column; gap:10px; max-width:340px; margin:6px auto 0; }
.ol-prov{ appearance:none; display:flex; align-items:center; justify-content:center; gap:10px; width:100%; border-radius:12px; padding:14px; font:800 15px 'Inter',sans-serif; cursor:pointer; border:1px solid var(--line); }
.ol-prov.google{ background:#fff; color:#1f1f1f; border-color:#dadce0; }
.ol-prov.apple{ background:#000; color:#fff; border-color:#333; }
.ol-prov svg{ width:20px; height:20px; }
.ol-prov:disabled{ opacity:.5; cursor:default; }
.ol-dev{ margin-top:8px; padding:14px; border:1px dashed rgba(255,206,79,.4); border-radius:14px; text-align:left; }
.ol-dev small{ display:block; font-size:11px; font-weight:800; color:var(--gold); letter-spacing:.08em; text-transform:uppercase; margin-bottom:8px; }
.ol-dev .row{ display:flex; gap:8px; }
.ol-dev input{ flex:1; min-width:0; background:var(--panel); border:1px solid var(--line); color:var(--txt); border-radius:10px; padding:11px; font:700 14px 'Inter',sans-serif; }
.ol-fine{ font-size:11.5px; color:var(--muted); line-height:1.5; max-width:340px; margin:18px auto 0; }
.ol-fine a{ color:var(--muted); }
.ol-empty{ color:var(--muted); font-size:13px; text-align:center; padding:8px 0; line-height:1.5; }
.fd-gsi{ display:flex; justify-content:center; }
.fd-nm-t{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }
/* a toast never blocks the button under it (cards and sheets keep their buttons at the bottom) */
.dyn-toast{ pointer-events:none; }

/* bottom sheets (sign in, Hall of Fame, player cards). Same z-index as .dyn-overlay, so
   whatever opens last (a confirm over a card) sits on top. */
.fd-sheet-ov{ position:fixed; inset:0; z-index:200; background:rgba(8,4,6,.86); display:flex; align-items:flex-end; justify-content:center; }
@media (min-width:560px){ .fd-sheet-ov{ align-items:center; padding:18px; } }
.fd-sheet{ position:relative; width:100%; max-width:480px; max-height:90vh; max-height:90dvh; overflow-y:auto; overscroll-behavior:contain; background:var(--panel); border:1px solid var(--line); border-bottom:0; border-radius:18px 18px 0 0; padding:20px 16px calc(22px + env(safe-area-inset-bottom)); color:var(--txt); text-align:left; box-shadow:var(--shadow); }
@media (min-width:560px){ .fd-sheet{ border-radius:18px; border-bottom:1px solid var(--line); } }
.fd-sheet h2{ font-size:22px; font-weight:900; margin:2px 0 6px; line-height:1.2; }
.fd-sheet-x{ position:absolute; top:8px; right:8px; appearance:none; border:0; background:none; color:var(--muted); font-size:28px; line-height:1; cursor:pointer; padding:6px 10px; z-index:2; }
.fd-sheet-sub{ color:var(--muted); font-size:13.5px; line-height:1.5; margin:0 0 14px; }
.fd-sheet .dyn-btn{ display:block; width:100%; margin:8px 0 0; }
.fd-signin{ text-align:center; }
.fd-signin .ol-fine{ margin-top:16px; }
.fd-mark-sm{ font-size:11px; gap:7px; margin:0 0 10px; letter-spacing:.14em; }
.fd-mark-sm .glove{ width:22px; height:22px; }
.fd-kick{ font:800 11px/1 'Inter',sans-serif; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); }

/* home: account chip + Hall of Fame entry */
.fd-acctbar{ max-width:640px; margin:0 auto; padding:12px 16px 0; display:flex; justify-content:flex-end; min-height:46px; }
.fd-chip{ appearance:none; display:inline-flex; align-items:center; gap:8px; max-width:220px; background:var(--panel2); border:1px solid var(--line); color:var(--txt); border-radius:999px; padding:3px 13px 3px 3px; font:800 13px/1 'Inter',sans-serif; cursor:pointer; }
.fd-chip:hover{ border-color:var(--dyn); }
.fd-chip .fd-face{ border-width:1.5px; }
.fd-chip-nm{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }
.fd-chip-out{ padding:9px 14px 9px 11px; gap:7px; }
.fd-chip-out svg{ width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; }
.fd-hof-entry{ appearance:none; display:flex; align-items:center; gap:14px; width:100%; margin:0; padding:16px; border:1px solid rgba(255,206,79,.42); border-radius:16px; background:linear-gradient(180deg,rgba(255,206,79,.1),rgba(255,206,79,.02)); color:var(--txt); font-family:inherit; text-align:left; cursor:pointer; }
.fd-hof-entry:hover{ border-color:var(--gold); }
.fd-hof-entry .ic{ font-size:28px; line-height:1; flex:0 0 auto; }
.fd-hof-entry b{ display:block; font-size:17px; font-weight:900; color:#ffe6a3; }
.fd-hof-entry span{ display:block; font-size:12.5px; font-weight:600; color:var(--muted); line-height:1.45; margin-top:3px; }
.fd-hof-entry i{ margin-left:auto; font-style:normal; color:var(--gold); font-size:24px; font-weight:800; }

/* Hall of Fame boards */
.hof-seg{ display:grid; grid-template-columns:1fr 1fr; gap:6px; margin:10px 0 6px; }
.hof-seg.sm{ grid-template-columns:repeat(3,1fr); margin-top:0; }
.hof-seg button{ appearance:none; border:1px solid var(--line); background:var(--panel2); color:var(--muted); font:800 13px/1.1 'Inter',sans-serif; padding:11px 4px; border-radius:10px; cursor:pointer; }
.hof-seg.sm button{ padding:9px 4px; font-size:12px; }
.hof-seg button.on{ color:#ffe6a3; border-color:rgba(255,206,79,.6); background:rgba(255,206,79,.1); }
.hof-meta{ font-size:12px; color:var(--muted); line-height:1.5; margin:6px 2px 8px; }
.hof-list{ margin:0 -4px; }
.hof-row{ display:grid; grid-template-columns:30px 32px minmax(0,1fr) auto; align-items:center; gap:9px; padding:9px 6px; border-bottom:1px solid rgba(255,255,255,.06); }
.hof-row.tap{ cursor:pointer; border-radius:10px; }
.hof-row.tap:hover{ background:rgba(255,255,255,.04); }
.hof-row.tap:focus-visible{ outline:2px solid var(--gold); outline-offset:1px; }
.hof-row.me{ background:rgba(255,65,85,.11); border-radius:10px; border-bottom-color:transparent; }
.hof-rk{ text-align:center; font-weight:900; font-size:14px; color:var(--muted); font-variant-numeric:tabular-nums; }
.hof-row.r1 .hof-rk{ color:var(--gold); }
.hof-who{ min-width:0; }
.hof-who b{ display:flex; align-items:center; gap:6px; font-size:14px; font-weight:900; min-width:0; }
.hof-who small{ display:block; font-size:11.5px; font-weight:600; color:var(--muted); margin-top:3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hof-v{ text-align:right; font-weight:900; font-size:16px; color:var(--gold); font-variant-numeric:tabular-nums; }
.hof-v small{ display:block; font-size:10px; font-weight:800; color:var(--muted); letter-spacing:.06em; text-transform:uppercase; margin-top:2px; }
.hof-pin{ position:sticky; bottom:calc(-22px - env(safe-area-inset-bottom)); z-index:1; margin:8px -16px 0; padding:8px 16px calc(24px + env(safe-area-inset-bottom)); background:var(--panel); border-top:1px solid var(--line); box-shadow:0 -10px 20px rgba(0,0,0,.35); }
.hof-pin .hof-sub{ margin-top:0; }
.hof-sub{ font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin:12px 2px 6px; }
.hof-signbox{ margin:12px 0 0; padding:14px; border:1px dashed rgba(255,206,79,.4); border-radius:14px; text-align:center; }
.hof-signbox p{ margin:0 0 4px; font-size:13px; color:var(--muted); line-height:1.5; }
.hof-how{ margin-top:14px; font-size:12.5px; line-height:1.55; color:var(--muted); }
.hof-how summary{ cursor:pointer; font-weight:800; color:var(--txt); }
.hof-how p{ margin:8px 0 0; }

/* Hall of Fame card on the career end screen */
.hof-end{ margin:0 0 14px; padding:16px 14px 12px; border:1px solid rgba(255,206,79,.45); border-radius:16px; background:linear-gradient(180deg,rgba(255,206,79,.1),rgba(255,206,79,.02)); text-align:center; }
.hof-end-score{ font-size:34px; font-weight:900; margin:6px 0 2px; font-variant-numeric:tabular-nums; }
.hof-end-score small{ font-size:13px; color:var(--muted); font-weight:800; letter-spacing:.08em; margin-left:6px; }
.hof-end-ranks{ display:grid; grid-template-columns:repeat(3,1fr); gap:6px; margin:10px 0 8px; }
.hof-end-ranks div{ background:rgba(0,0,0,.18); border-radius:10px; padding:9px 4px; }
.hof-end-ranks b{ display:block; font-size:20px; font-weight:900; font-variant-numeric:tabular-nums; }
.hof-end-ranks span{ display:block; font-size:10.5px; font-weight:800; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; margin-top:3px; }
.hof-end-line{ font-size:13px; color:var(--muted); line-height:1.5; margin:6px 0 4px; }
.hof-end-line b{ color:var(--txt); }
.hof-end .dyn-btn{ margin-top:8px; }
.hof-link{ appearance:none; border:0; background:none; color:var(--gold); font:800 13px/1 'Inter',sans-serif; padding:10px; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.dyn-btn.fd-gold{ background:linear-gradient(180deg,#ffe08a,#f5b83a); border-color:transparent; color:#241a00; }

/* player cards */
.pc-head{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:6px; margin:4px 0 12px; }
.pc-head h2{ margin:4px 0 0; word-break:break-word; }
.pc-head .fd-face{ border-width:3px; }
.pc-sub{ display:flex; align-items:center; justify-content:center; gap:6px; font-size:13px; font-weight:700; color:var(--muted); }
.pc-rel{ font-size:11px; font-weight:900; letter-spacing:.06em; text-transform:uppercase; color:var(--good); border:1px solid rgba(46,224,106,.4); background:rgba(46,224,106,.08); border-radius:999px; padding:4px 10px; }
.pc-stats{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:0 0 10px; }
.pc-stats div{ background:var(--panel2); border:1px solid var(--line); border-radius:12px; padding:11px 12px; }
.pc-stats span{ display:block; font-size:10.5px; font-weight:800; color:var(--muted); text-transform:uppercase; letter-spacing:.08em; }
.pc-stats b{ display:block; font-size:22px; font-weight:900; margin-top:3px; font-variant-numeric:tabular-nums; }
.pc-stats b.gold{ color:var(--gold); }
.pc-stats b.none{ color:var(--muted); font-size:18px; line-height:26px; }
.pc-stats small{ display:block; font-size:11.5px; font-weight:600; color:var(--muted); margin-top:2px; }
.pc-best{ font-size:13px; color:var(--muted); line-height:1.5; margin:0 2px 12px; }
.pc-best b{ color:var(--txt); }
.pc-code{ text-align:center; margin:4px 0 4px; padding:12px; border:1px solid var(--line); border-radius:14px; background:var(--panel2); }
.pc-code span{ display:block; font-size:10.5px; font-weight:800; color:var(--muted); text-transform:uppercase; letter-spacing:.1em; }
.pc-code b{ display:block; font-size:30px; font-weight:900; letter-spacing:.18em; color:var(--gold); margin:4px 0 0; }
.pc-split{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:8px; }
.pc-split .dyn-btn{ margin:0; }
.pc-danger{ color:#ff7a88; }