/* Home Base — the pre-franchise hub. Replaces the mode-select layout.
   Ported from _documentation_master/projects/design_handoff_ch7/ch7.css, section A
   (Home Base only; the reward ladder lands with its own chapter). Scoped under .gob
   so no selector reaches the rest of the app. Tokens from gob-tokens.css only.

   Colour law here: exactly one green (.advance) per screen, on the program the
   green rule picks. Navy marks "yours". No orange, no reward gold on chrome. */

/* ── Page frame ─────────────────────────────────────────────
   Home Base fills the viewport exactly: nothing below the fold in any state.
   mode-select.css still owns the alpha banner and the Leaders By Team modal,
   so these override its page-level rules. */
html.hb-html, html.hb-html body { height: 100%; overflow: hidden; }
body.mode-select-page { margin: 0; padding: 0; min-height: 0; }
.gob.hb-root { width: 100vw; height: 100vh; }
.gob #hb-surface { height: 100%; }

/* The banner used to be sticky under a scrolling auth bar. Home Base does not
   scroll, so it floats over the bottom of the frame instead. */
body.mode-select-page .alpha-disclaimer {
  position: fixed;
  top: auto;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
  width: min(980px, calc(100vw - 96px));
  margin: 0;
  z-index: 25;
}

/* Local reset. gob-components.css only resets buttons and links inside shell
   chrome (.top / .rail / .pg-head), and Home Base mounts none of those. */
.gob .hb :where(h2, h3, p, b, i, em, small, div, span, article, header, section) { margin: 0; padding: 0; }
.gob .hb a, .gob .cfm a, .gob .pop a { color: inherit; text-decoration: none; cursor: pointer; }
.gob .hb button, .gob .cfm button, .gob .pop button {
  margin: 0; font: inherit; color: inherit; background: none; border: 0; cursor: pointer; text-align: left;
}
.gob .cfm :where(h3, p) { margin: 0; }

.gob .hb{position:relative;display:grid;grid-template-rows:var(--top-h) minmax(0,1fr);height:100%;background:radial-gradient(1100px 520px at 16% -10%,var(--white-4),transparent 70%),radial-gradient(900px 600px at 105% 115%,var(--white-2),transparent 70%),var(--bg)}
.gob .hb::after{content:'';position:absolute;inset:var(--top-h) 0 0;pointer-events:none;background:repeating-linear-gradient(132deg,transparent 0 102px,var(--white-1p2) 102px 103px,transparent 103px 208px)}
.gob .hb>*{position:relative;z-index:var(--z-raised)}
/* --door-art is trimmed from the handoff's 158/236 to buy the career strip its
   row without pushing the Tutorials row below the fold. See the PR report. */
.gob-1280 .hb{--hb-left:480px;--hb-gap:48px;--hb-px:32px;--hb-pt:28px;--hb-pb:24px;--door-art:112px;--door-info:66px;--med:46px;--med-lg:84px;--tsn-h:46px}
.gob-1920 .hb{--hb-left:700px;--hb-gap:72px;--hb-px:48px;--hb-pt:44px;--hb-pb:40px;--door-art:196px;--door-info:80px;--med:64px;--med-lg:112px;--tsn-h:84px}

/* ── Top bar (wordmark · connection · account) ──────────── */
.gob .hb-top{display:flex;align-items:center;gap:var(--space-16);padding:0 var(--hb-px);background:var(--bg-chrome);border-bottom:1px solid var(--line)}
.gob .hb-mark{display:flex;align-items:center;gap:var(--space-12);white-space:nowrap}
.gob .hb-mark b{font:var(--fw-bold) var(--fs-22)/var(--lh-1) var(--font-display);letter-spacing:var(--tracking-6);color:var(--text-100);padding-top:var(--space-2)}
.gob .hb-mark span{font:var(--fw-bold) var(--fs-14)/var(--lh-1) var(--font-display);letter-spacing:var(--tracking-12);color:var(--text-60);padding:var(--space-2) 0 0 var(--space-12);border-left:1px solid var(--line-strong)}
/* Edition tag (demo builds): a neutral outline tag, never green / orange / gold (Styleguide, badges). */
.gob .hb-edition{margin-left:var(--space-8);padding:var(--space-3) var(--space-8) var(--space-2);border:1px solid var(--line-strong);border-radius:var(--radius-5);font:var(--fw-bold) var(--fs-12)/var(--lh-1) var(--font-display);letter-spacing:var(--tracking-8);color:var(--text-87)}
.gob .hb-sp{flex:1}
.gob .hb-acct{display:flex;align-items:center;gap:var(--space-16);font-size:var(--fs-12);font-weight:var(--fw-semibold);color:var(--text-60);white-space:nowrap}
.gob .hb-acct b{color:var(--text-87);font-weight:var(--fw-semibold)}
.gob .hb-conn{display:inline-flex;align-items:center;gap:var(--space-6)}
.gob .hb-conn i{width:7px;height:7px;border-radius:var(--radius-round);background:var(--text-60)}
.gob .hb-conn.off i{background:transparent;box-shadow:inset 0 0 0 1.5px var(--white-40)}
.gob .hb-tl{font:var(--fw-bold) var(--fs-16)/var(--lh-1) var(--font-display)!important;letter-spacing:var(--tracking-5);color:var(--text-60)!important;padding-top:var(--space-2)!important;transition:color var(--dur-hover)}
.gob .hb-tl:hover{color:var(--text-100)!important}
.gob .hb-tl:focus-visible{outline:2px solid var(--white);outline-offset:2px}

/* ── Body: two zones ────────────────────────────────────── */
.gob .hb-body{display:grid;grid-template-columns:var(--hb-left) minmax(0,1fr);gap:var(--hb-gap);width:100%;max-width:2200px;margin:0 auto;padding:var(--hb-pt) var(--hb-px) var(--hb-pb);min-height:0}
.gob .hb-l,.gob .hb-r{display:flex;flex-direction:column;min-width:0;min-height:0}
.gob .hb-h{display:flex;align-items:baseline;gap:var(--space-12);min-height:var(--dsz-28);margin-bottom:var(--dsp-10)}
.gob .hb-h h2{font:var(--fw-bold) var(--fs-24)/var(--lh-1) var(--font-display);letter-spacing:var(--tracking-6);color:var(--text-100)}
.gob .hb-h span{margin-left:auto;font-size:var(--fs-10);font-weight:var(--fw-bold);letter-spacing:var(--tracking-10);text-transform:uppercase;color:var(--text-38)}

/* ── Program slots ──────────────────────────────────────── */
.gob .slots{display:flex;flex-direction:column;gap:var(--dsp-14)}
.gob .slot{position:relative;display:flex;flex-direction:column;gap:var(--space-6)}
.gob .slot-h{display:flex;align-items:center;gap:var(--space-10);height:20px}
.gob .slot-h b{font:var(--fw-bold) var(--fs-14)/var(--lh-1) var(--font-display);letter-spacing:var(--tracking-10);color:var(--text-38);padding-top:var(--space-2)}
.gob .slot-h i{flex:1;height:1px;background:var(--line)}
.gob .slot-more{width:28px;height:20px;border-radius:var(--radius-6);display:grid!important;place-items:center;text-align:center!important;color:var(--text-60)!important;font:var(--fw-bold) 15px/1 var(--font-body)!important;letter-spacing:1px;transition:background var(--dur-hover),color var(--dur-hover)}
.gob .slot-more:hover,.gob .slot-more.open{background:var(--white-10);color:var(--text-100)!important}
.gob .slot-more:focus-visible{outline:2px solid var(--white);outline-offset:1px}

/* .door — an occupied slot. The whole card is the Enter target; the button repeats it. */
.gob .door{position:relative;display:flex;flex-direction:column;border-radius:var(--radius-14);overflow:hidden;background:var(--surface-1);box-shadow:inset 0 0 0 1px var(--line),var(--shadow-card);cursor:pointer;transition:transform var(--dur-hover) var(--ease-out),box-shadow var(--dur-hover)}
.gob .door:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px var(--white-20),0 14px 32px var(--black-35)}
.gob .door:focus-visible{outline:2px solid var(--white);outline-offset:3px}
.gob .door-art{position:relative;height:var(--door-art);background:var(--tc,var(--surface-3));overflow:hidden}
.gob .door-art img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.gob .door-art::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 58%,color-mix(in srgb,var(--surface-1) 80%,transparent))}
.gob .door-tag{position:absolute;left:var(--space-10);top:var(--space-10);z-index:1;padding:var(--space-4) var(--space-7) var(--space-3);border-radius:var(--radius-5);background:var(--black-50);backdrop-filter:blur(6px);font:var(--fw-bold) var(--fs-12)/var(--lh-1) var(--font-display);letter-spacing:var(--tracking-12);color:var(--text-100)}
.gob .door-live{position:absolute;left:0;right:0;bottom:0;z-index:1;display:flex;align-items:center;gap:var(--space-8);padding:var(--space-6) var(--dsp-16);background:var(--black-50);backdrop-filter:blur(6px);font-size:var(--fs-12);font-weight:var(--fw-semibold);color:var(--text-100)}
.gob .door-live i{width:7px;height:7px;flex:none;border-radius:var(--radius-round);background:var(--white);animation:hbLive var(--dur-pulse) ease-out infinite}
.gob .door-live span{color:var(--text-60);font-weight:var(--fw-medium)}
@keyframes hbLive{0%{box-shadow:0 0 0 0 var(--white-50)}70%{box-shadow:0 0 0 6px transparent}100%{box-shadow:0 0 0 0 transparent}}
.gob .door-i{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:var(--dsp-16);min-height:var(--door-info);padding:var(--dsp-8) var(--dsp-14) var(--dsp-8) var(--dsp-16)}
.gob .door-id{min-width:0}
.gob .door-n{font:var(--fw-bold) var(--fs-22)/var(--lh-1) var(--font-display);letter-spacing:var(--tracking-3);color:var(--text-100);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-top:var(--space-2)}
.gob .door-m{margin-top:var(--space-4);line-height:1.3;font-size:var(--fs-12);color:var(--text-60);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gob .door-m.tight{margin-top:0}
.gob .door-m i{font-style:normal;color:var(--text-38);margin:0 var(--space-4)}
.gob .door-nums{display:flex;gap:var(--dsp-14)}
.gob .door-nums div{display:flex;flex-direction:column;align-items:flex-end;gap:var(--space-3)}
.gob .door-nums b{font:var(--fw-bold) var(--fs-22)/var(--lh-1) var(--font-display);color:var(--text-100)}
.gob .door-nums span{font-size:var(--fs-10);font-weight:var(--fw-bold);letter-spacing:var(--tracking-8);text-transform:uppercase;color:var(--text-38)}
.gob .door .advance{height:var(--dsz-40);min-width:112px}
.gob .door .btn-ghost.sm{min-width:88px;justify-content:center}

/* .vacant — an empty slot. Quiet by law: no orange, no green. */
.gob .vacant{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--dsp-6);height:calc(var(--door-art) + var(--door-info));padding:0 var(--dsp-24);border-radius:var(--radius-14);border:1px dashed var(--line-strong);background:linear-gradient(180deg,var(--white-2),transparent);text-align:center}
.gob .vacant b{font:var(--fw-bold) var(--fs-22)/var(--lh-1) var(--font-display);letter-spacing:var(--tracking-4);color:var(--text-87)}
.gob .vacant p{max-width:320px;font-size:var(--fs-12);color:var(--text-60);text-wrap:pretty}
.gob .vacant .btn-ghost{align-self:center;margin-top:var(--dsp-6)}
/* FTE v4 decision 60: a coach who has never had a franchise. Slot 01 glows in the Advance
   green (about a 2 s pulse) and its "Find Your Program" is the screen's one .advance.
   The keyframes move opacity only; the colour lives on the .advance-glow rule. */
.gob .slot.advance-glow .vacant{position:relative;border-style:solid;border-color:color-mix(in srgb,var(--green) 55%,transparent)}
.gob .slot.advance-glow .vacant::after{content:'';position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;box-shadow:0 0 0 1px color-mix(in srgb,var(--green) 45%,transparent),0 0 24px 2px color-mix(in srgb,var(--green) 35%,transparent);animation:hbStartGlow 2s ease-in-out infinite}
.gob .slot.advance-glow .vacant .advance{align-self:center;margin-top:var(--dsp-6)}
@keyframes hbStartGlow{0%,100%{opacity:.35}50%{opacity:1}}

/* Slot menu + delete confirm */
.gob .pop{position:absolute;right:0;top:24px;z-index:var(--z-popover);width:220px;padding:var(--space-6);border-radius:var(--radius-10);background:var(--surface-popover);box-shadow:var(--shadow-popover);display:flex;flex-direction:column}
.gob .pop-i{display:flex!important;align-items:center;gap:var(--space-8);height:34px;padding:0 var(--space-10)!important;border-radius:var(--radius-6);font-size:var(--fs-13)!important;font-weight:var(--fw-semibold)!important;color:var(--text-87)!important}
.gob .pop-i:hover{background:var(--white-7)}
.gob .pop-i.danger{color:var(--red)!important}
.gob .pop-i:focus-visible{outline:2px solid var(--white);outline-offset:-2px}
.gob #hb-confirm-host[hidden]{display:none}
.gob .hb-scrim{position:absolute;inset:0;z-index:20;display:grid;place-items:center;background:color-mix(in srgb,var(--bg) 74%,transparent);backdrop-filter:blur(3px)}
.gob .cfm{width:460px;max-width:calc(100vw - 48px);display:flex;flex-direction:column;gap:var(--space-12);padding:var(--space-22) var(--space-24) var(--space-20);border-radius:var(--radius-14);background:var(--surface-panel);box-shadow:0 30px 80px var(--black-50),inset 0 0 0 1px var(--line-strong)}
.gob .cfm h3{font:var(--fw-bold) var(--fs-28)/var(--lh-9) var(--font-display);letter-spacing:var(--tracking-2);color:var(--text-100)}
.gob .cfm p{font-size:var(--fs-13);line-height:1.45;color:var(--text-87);text-wrap:pretty}
.gob .cfm p em{font-style:normal;color:var(--text-60)}
.gob .cfm-f{display:flex;justify-content:flex-end;gap:var(--space-10);margin-top:var(--space-8)}
.gob .btn-del{display:inline-flex;align-items:center;justify-content:center;height:var(--dsz-34);padding:var(--space-1) var(--space-16) 0;border-radius:var(--radius-10);background:color-mix(in srgb,var(--red) 12%,transparent)!important;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--red) 55%,transparent);color:var(--red)!important;font:var(--fw-bold) var(--fs-16)/var(--lh-1) var(--font-display)!important;letter-spacing:var(--tracking-btn-sm);white-space:nowrap;text-align:center!important;transition:background var(--dur-hover)}
.gob .btn-del:hover{background:color-mix(in srgb,var(--red) 20%,transparent)!important}
.gob .btn-del:focus-visible{outline:2px solid var(--white);outline-offset:2px}

/* Career strip — the online echo of the offline "Your Career" numerals, sized
   for the left column. Hollow = nothing earned yet; solid = earned. */
.gob .hb-career{margin-top:auto;padding-top:var(--dsp-14)}
.gob .cr-n{flex:1;min-width:0;display:grid;grid-template-columns:1.35fr 1fr 1fr 1.25fr;border-top:1px solid var(--line-strong);border-bottom:1px solid var(--line)}
.gob .cr-n>div{display:flex;flex-direction:column;gap:var(--space-3);min-width:0;padding:var(--dsp-8) var(--dsp-12) var(--dsp-6);border-left:1px solid var(--line)}
.gob .cr-n>div:first-child{border-left:0;padding-left:var(--space-2)}
.gob .cr-v{display:flex;align-items:baseline;gap:var(--space-6);min-width:0}
.gob .cr-n b{font:var(--fw-bold) var(--fs-32)/var(--lh-85) var(--font-display);letter-spacing:var(--tracking-1);color:var(--text-100);white-space:nowrap}
.gob .cr-n em{font-style:normal;font-size:var(--fs-11);font-weight:var(--fw-semibold);color:var(--text-60);white-space:nowrap}
.gob-1920 .cr-n b{font-size:var(--fs-40)}
.gob-1920 .cr-n>div{padding-top:var(--dsp-10);padding-bottom:var(--dsp-8)}
.gob .cr-n span{font-size:var(--fs-10);font-weight:var(--fw-bold);letter-spacing:var(--tracking-8);text-transform:uppercase;color:var(--text-60);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gob .hollow{color:transparent!important;-webkit-text-stroke:1.2px var(--white-40)}
/* The left-column strip gives the four numerals the whole column: each cell is
   as wide as its own content and the slack is shared between them, so nothing
   butts up against a divider or a neighbour. (The offline zone keeps the grid.) */
.gob .hb-career .cr-n{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--dsp-24);padding:var(--dsp-12) var(--space-2) var(--dsp-10)}
.gob .hb-career .cr-n>div{flex:none;gap:var(--space-4);padding:0;border-left:0}
.gob .hb-career .cr-v{gap:var(--space-8)}
.gob .hb-career .cr-n em{font-size:var(--fs-12)}

/* Utility entries (Tutorials · Settings · FAQs · Trophy Case) */
.gob .hb-util{display:flex;align-items:center;gap:var(--dsp-24);margin-top:auto;padding-top:var(--dsp-12)}
/* With the career strip present its bottom rule already separates the row. */
.gob .hb-l>.hb-util:not(.hb-career+.hb-util){margin-top:auto;padding-top:var(--dsp-14);border-top:1px solid var(--line)}
.gob .hb-career+.hb-util{margin-top:0}
.gob .hb-link{display:inline-flex!important;align-items:center;gap:var(--space-6);font:var(--fw-bold) var(--fs-17)/var(--lh-1) var(--font-display)!important;letter-spacing:var(--tracking-5);color:var(--text-60)!important;padding-top:var(--space-2)!important;transition:color var(--dur-hover)}
.gob .hb-link:hover{color:var(--text-100)!important}
.gob .hb-link:focus-visible{outline:2px solid var(--white);outline-offset:2px}
.gob .hb-link.go::after{content:'→';font-family:var(--font-body);font-size:.8em;transition:transform var(--dur-hover)}
.gob .hb-link.go:hover::after{transform:translateX(2px)}
.gob .hb-link.ext::after{content:'\2197';font-family:var(--font-body);font-size:.8em}
.gob .hb-util .hb-ver{margin-left:auto;font-size:var(--fs-11);color:var(--text-38)}

/* ── Right zone · online ────────────────────────────────── */
.gob .fag{display:flex;align-items:center;gap:var(--dsp-20);padding:var(--dsp-14) var(--dsp-20);border-radius:var(--radius-14);background:linear-gradient(100deg,var(--white-4),var(--white-1p2) 70%);box-shadow:inset 0 0 0 1px var(--line);cursor:default}
.gob-1920 .fag{padding:20px 28px}
.gob .fag-t{flex:1;min-width:0}
.gob .fag h3{margin-top:var(--space-5);font:var(--fw-bold) var(--fs-32)/var(--lh-9) var(--font-display);letter-spacing:var(--tracking-3);color:var(--text-87)}
.gob .fag p{margin-top:var(--space-4);font-size:var(--fs-12);color:var(--text-60)}
.gob .soon{display:inline-flex;align-items:center;gap:var(--space-8);height:var(--dsz-30);padding:var(--space-2) var(--space-14) 0;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-strong);font:var(--fw-bold) var(--fs-15)/var(--lh-1) var(--font-display);letter-spacing:var(--tracking-8);color:var(--text-60);white-space:nowrap}
.gob .soon i{width:7px;height:7px;margin-top:-2px;border-radius:var(--radius-round);box-shadow:inset 0 0 0 1.5px var(--white-40)}
/* Alpha Updates (alpha builds only): takes Find A Game's spot and opens the release notes.
   Glows white (never green: green is the Advance colour) until this version is opened once. */
.gob .fag.au{width:100%;cursor:pointer;transition:box-shadow var(--dur-hover)}
.gob .fag.au:hover{box-shadow:inset 0 0 0 1px var(--line-strong)}
.gob .fag.au:focus-visible{outline:2px solid var(--white);outline-offset:2px}
.gob .fag.au .fag-t,.gob .fag.au .eyebrow{display:block}
/* The app-wide button rule forces the display face on a button's text (!important); the card's
   eyebrow and teaser are body text, as on Find A Game. */
.gob .fag.au .eyebrow{font-family:var(--font-body)!important;letter-spacing:var(--tracking-10)!important}
.gob .fag.au .au-p{font-family:var(--font-body)!important;font-weight:var(--fw-regular,400)!important;letter-spacing:normal!important}
.gob .au-h{display:block;margin-top:var(--space-5);font:var(--fw-bold) var(--fs-32)/var(--lh-9) var(--font-display);letter-spacing:var(--tracking-3);color:var(--text-87)}
.gob .au-p{display:block;margin-top:var(--space-4);font-size:var(--fs-12);color:var(--text-60)}
.gob .fag.au-glow{position:relative}
.gob .fag.au-glow::after{content:'';position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;box-shadow:0 0 0 1px color-mix(in srgb,var(--white) 55%,transparent),0 0 24px 2px color-mix(in srgb,var(--white) 22%,transparent);animation:hbStartGlow 2s ease-in-out infinite}
.gob .fag.au-glow .au-h{color:var(--text-100)}
.gob .fag.au-glow .au-read{color:var(--text-100);box-shadow:inset 0 0 0 1px var(--white-40)}
.gob .fag.au-glow .au-read i{background:var(--white);box-shadow:none}
.gob .cfm.au-notes{width:640px;max-height:calc(100vh - 96px)}
.gob .au-body{min-height:0;overflow:auto;font-size:var(--fs-13);line-height:1.45;color:var(--text-87)}
.gob .au-body .au-date{font-weight:var(--fw-bold);color:var(--text-100)}
.gob .au-body h4{margin:var(--space-12) 0 var(--space-4);font-size:var(--fs-13);font-weight:var(--fw-bold);color:var(--text-100)}
.gob .au-body ul{margin:0;padding-left:1.1em}
.gob .au-body li+li{margin-top:var(--space-4)}
.gob .au-body ul+p{margin-top:var(--space-12)}
.gob .sec-f{display:flex;gap:var(--dsp-16);padding-top:var(--dsp-8)}

/* .hbt — the one tabbed panel: Around GOB ⇄ Leaderboard. Fills the rest of the zone. */
.gob-1280 .hbt{--agc-cols:3;--agc-rows:2;--agc-gap:12px;--lb-top:3}
.gob-1920 .hbt{--agc-cols:4;--agc-rows:3;--agc-gap:16px;--lb-top:3}
.gob .hbt{flex:1;min-height:0;display:flex;flex-direction:column;margin-top:var(--dsp-20)}
.gob-1920 .hbt{margin-top:28px}
.gob .hbt-row{display:flex;align-items:center;gap:var(--space-24);height:var(--dsz-44);flex:none;box-shadow:inset 0 -1px 0 var(--line-strong)}
.gob .hbt-tabs{display:flex;height:100%;gap:28px}
.gob .hbt-tb{position:relative;display:inline-flex!important;align-items:center;gap:var(--space-8);height:100%;padding:var(--space-2) var(--space-2) 0!important;white-space:nowrap;font:var(--fw-bold) var(--fs-24)/var(--lh-1) var(--font-display)!important;letter-spacing:var(--tracking-5);color:var(--text-60)!important;transition:color var(--dur-hover)}
.gob .hbt-tb:hover{color:var(--text-87)!important}
.gob .hbt-tb[aria-selected="true"]{color:var(--text-100)!important}
.gob .hbt-tb[aria-selected="true"]::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:1px;background:var(--text-100)}
.gob .hbt-tb:focus-visible{outline:2px solid var(--white);outline-offset:2px}
.gob .hbt-n{display:inline-grid;place-items:center;min-width:var(--dsz-20);height:var(--dsz-18);margin-top:calc(var(--space-2) * -1);padding:0 var(--space-5);border-radius:999px;background:var(--white-90);color:var(--bg);font:var(--fw-bold) var(--fs-10)/1 var(--font-body);letter-spacing:0}
.gob .hbt-tools{margin-left:auto;display:flex;align-items:center;gap:var(--space-12);font-size:var(--fs-11);color:var(--text-60);white-space:nowrap}
.gob .hbt-p{flex:1;min-height:0;display:flex;flex-direction:column;padding-top:var(--dsp-14)}
.gob .hbt-p[hidden]{display:none}
.gob .hbt-tools .seg button{height:var(--dsz-24);padding:0 var(--space-10);font-size:var(--fs-11)}

/* .agc — Around GOB result card. Energy comes from each coach's own banner art;
   the body is washed with the same art, blurred, so no team hex is needed. */
.gob .agc-g{flex:1;min-height:0;display:grid;grid-template-columns:repeat(var(--agc-cols),minmax(0,1fr));grid-template-rows:repeat(var(--agc-rows),minmax(0,1fr));gap:var(--agc-gap)}
.gob-1280 .agc-g>.agc:nth-child(n+7){display:none}
.gob .agc{position:relative;display:flex;flex-direction:column;min-width:0;min-height:0;border-radius:var(--radius-12);overflow:hidden;isolation:isolate;background:var(--surface-1);box-shadow:inset 0 0 0 1px var(--white-10),var(--shadow-card)}
.gob .agc-bg{position:absolute;left:-30%;top:-30%;z-index:-2;width:160%;height:160%;object-fit:cover;filter:blur(22px) saturate(1.4);opacity:.75}
.gob .agc::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,color-mix(in srgb,var(--bg) 10%,transparent) 0%,color-mix(in srgb,var(--bg) 35%,transparent) 50%,color-mix(in srgb,var(--bg) 84%,transparent) 100%)}
.gob .agc-art{position:relative;flex:1 1 auto;min-height:0;display:grid;place-items:center;overflow:hidden}
.gob .agc-art img{display:block;width:100%;height:100%;object-fit:contain;-webkit-mask-image:linear-gradient(180deg,transparent,#000 16%,#000 84%,transparent);mask-image:linear-gradient(180deg,transparent,#000 16%,#000 84%,transparent)}
.gob .agc-coach{position:absolute;left:var(--space-8);top:var(--space-8);display:inline-flex;align-items:center;gap:var(--space-6);max-width:calc(100% - 16px);height:var(--dsz-22);padding:0 var(--space-8);border-radius:var(--radius-6);background:rgba(0,0,0,.6);backdrop-filter:blur(6px);font-size:var(--fs-11);font-weight:var(--fw-bold);color:var(--text-100);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gob .agc-coach i{flex:none;width:6px;height:6px;border-radius:var(--radius-round);background:var(--white)}
/* The name truncates; the archetype icon after it never does. */
.gob .agc-cn{min-width:0;overflow:hidden;text-overflow:ellipsis}
/* Tournament strip, between the banner art and the body: tier emblem + tier and round.
   It is flex:none, so its height comes out of the art above it and the card keeps
   its outer height. Neutral; only the emblem carries the tier metal. */
.gob .agc-t{flex:none;display:flex;align-items:center;gap:var(--space-6);height:var(--dsz-24);padding:0 var(--dsp-12);background:var(--white-6);border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:var(--fs-10);font-weight:var(--fw-bold);letter-spacing:var(--tracking-8);color:var(--text-87);white-space:nowrap;overflow:hidden}
.gob .agc-t svg{flex:none;display:block}
.gob .agc-t span{min-width:0;overflow:hidden;text-overflow:ellipsis}
/* colour-law: reward */
.gob .agc-t.is-champ{color:var(--reward-gold)}
.gob .agc-b{flex:none;display:flex;flex-direction:column;gap:var(--space-4);padding:var(--dsp-10) var(--dsp-12) var(--dsp-12)}
.gob .agc-s{display:flex;align-items:center;gap:var(--space-10)}
.gob .agc-s b{font:var(--fw-bold) var(--fs-36)/var(--lh-85) var(--font-display);letter-spacing:var(--tracking-1);color:var(--text-100);white-space:nowrap;padding-top:var(--space-2)}
.gob .agc-s small{margin-left:auto;display:inline-flex;align-items:center;gap:var(--space-4);font-size:var(--fs-10);font-weight:var(--fw-bold);letter-spacing:var(--tracking-8);color:var(--text-87);white-space:nowrap}
.gob .agc-s small i{font-style:normal;color:var(--text-38)}
/* Final/OT, Final/2OT: the score line's own meta type (as .agc-s small), stacked above
   SN / WK at the line's right end, so the week is never pushed out. */
.gob .agc-w{margin-left:auto;display:flex;flex-direction:column;align-items:flex-end;gap:var(--space-2)}
.gob .agc-w small{margin-left:0}
.gob .agc-ot{font-size:var(--fs-10);font-weight:var(--fw-bold);letter-spacing:var(--tracking-8);color:var(--text-87);white-space:nowrap}
.gob .wl{display:inline-grid;place-items:center;flex:none;width:var(--dsz-24);height:var(--dsz-24);border-radius:var(--radius-6);font:var(--fw-bold) var(--fs-16)/1 var(--font-display);padding-top:var(--space-2)}
.gob .wl.w{background:var(--white-90);color:var(--bg)}
.gob .wl.l{color:var(--text-87);box-shadow:inset 0 0 0 1.5px var(--white-40)}
.gob .agc-v{font-size:var(--fs-13);color:var(--text-87);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gob .agc-v em{font-style:normal;color:var(--text-60)}
.gob .agc-v b{font-weight:var(--fw-semibold);color:var(--text-100)}
.gob .agc-m{font-size:var(--fs-11);color:var(--text-60);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gob .agc-m i{font-style:normal;color:var(--text-38);margin:0 var(--space-4)}
.gob .agc.is-me{box-shadow:inset 0 0 0 1.5px var(--navy-hi),0 0 0 3px color-mix(in srgb,var(--navy) 45%,transparent),var(--shadow-card)}
.gob .agc.is-me .agc-coach{background:var(--navy)}
.gob .agc.is-wait{background:transparent;box-shadow:none;border:1px dashed var(--line-strong);align-items:center;justify-content:center;font-size:var(--fs-11);font-weight:var(--fw-bold);letter-spacing:var(--tracking-8);text-transform:uppercase;color:var(--text-38)}

/* Leaderboard: top three as tiles, then rows, your row pinned navy. */
.gob .lbp{display:grid;grid-template-columns:repeat(var(--lb-top),minmax(0,1fr));gap:var(--agc-gap);flex:none}
.gob .lbt{display:flex;align-items:flex-end;gap:var(--dsp-12);padding:var(--dsp-12) var(--dsp-14);border-radius:var(--radius-12);background:linear-gradient(160deg,var(--white-6),var(--white-2));box-shadow:inset 0 0 0 1px var(--line)}
.gob .lbt>i{font:normal var(--fw-bold) calc(var(--fs-48) * 1.1)/var(--lh-85) var(--font-display);color:var(--text-100);font-style:normal}
.gob .lbt div{display:flex;flex-direction:column;gap:var(--space-4);min-width:0;padding-bottom:var(--space-3)}
.gob .lbt b{font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--text-100);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gob .lbt span{font:var(--fw-bold) var(--fs-20)/var(--lh-1) var(--font-display);letter-spacing:var(--tracking-2);color:var(--text-87)}
.gob .lbt span small{font-size:.6em;color:var(--text-60);margin-left:var(--space-3)}
.gob .lbl{flex:1;min-height:0;display:flex;flex-direction:column;margin-top:var(--dsp-10)}
.gob .lbl .ldb-r{flex:none}
.gob-1280 .lbl .ldb-r.x{display:none}
.gob .lbl .ldb-r:not(.me){height:var(--dsz-34)}
.gob .lbl .ldb-r.me{margin-top:auto}
.gob .hbt .sec-f{flex:none;border-top:1px solid var(--line);margin-top:var(--dsp-8);padding-top:var(--dsp-10)}
.gob .hb-empty-r{display:flex;align-items:center;justify-content:center;flex:1;min-height:0;font-size:var(--fs-12);color:var(--text-38)}

/* ── Right zone · offline · "Your Career" ─────────────────────
   Ported from ch7.css "Right zone · OFFLINE". No remote calls feed this zone;
   the desktop guard must stay green. Reward gold appears ONLY on title
   medallions and title-finish text in Top Seasons — never on chrome. */
/* Open (unboxed) section head, shared by Trophy Case + Top Seasons. */
.gob .cr .sec{display:flex;flex-direction:column;min-width:0}
.gob .cr .sec-h{display:flex;align-items:baseline;gap:var(--space-10);padding-bottom:var(--dsp-8);border-bottom:1px solid var(--line-strong)}
.gob .cr .sec-h h3{font:var(--fw-bold) var(--fs-18)/var(--lh-1) var(--font-display);letter-spacing:var(--tracking-7);color:var(--text-87);white-space:nowrap}
.gob .cr .sec-h span{font-size:var(--fs-11);color:var(--text-38);white-space:nowrap}
.gob .cr .sec-h .r{margin-left:auto;display:flex;align-items:center;gap:var(--space-10);align-self:center}
.gob .cr .sec-h .r .lnk{font-size:var(--fs-12)}

/* .cr — Your Career zone. Hollow numerals = potential; solid = earned. The base
   .cr-n grid/borders/span/em are shared with the online strip above; only the
   numeral scale and cell padding differ, scoped under .cr. */
.gob .cr{display:flex;flex-direction:column;gap:var(--dsp-20);min-height:0}
.gob .cr .cr-n>div{gap:var(--space-6);padding:var(--dsp-14) var(--dsp-16) var(--dsp-12)}
.gob .cr .cr-n b{font:var(--fw-bold) var(--fs-48)/var(--lh-85) var(--font-display);letter-spacing:var(--tracking-1);color:var(--text-100);white-space:nowrap}
.gob .cr-cap{margin-top:calc(var(--dsp-12) * -1);font-size:var(--fs-12);color:var(--text-60)}
.gob-1920 .cr{gap:44px}
.gob-1920 .cr .cr-n b{font-size:80px}
.gob-1920 .cr .cr-n>div{padding-top:24px;padding-bottom:20px}

/* .tcase + .shelf + .med — trophy shelf. Titles gold, milestones neutral. */
.gob .tcase{display:flex;flex-direction:column;gap:var(--dsp-12);padding-top:var(--dsp-14);min-height:0}
/* Inside the career zone the section gap already separates the shelf. */
.gob .cr .tcase{padding-top:0}
.gob .tcase .sec-h{border-bottom:0;padding-bottom:0}
.gob .shelf{position:relative;display:flex;gap:var(--dsp-14);padding:0 var(--space-4) var(--dsp-12)}
.gob .shelf::after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,var(--line-strong) 10%,var(--line-strong) 90%,transparent);box-shadow:0 6px 14px var(--black-45)}
.gob .tro{display:flex;flex-direction:column;align-items:center;gap:var(--space-8);width:calc(var(--med) * 2.6);text-align:center;min-width:0}
.gob .tro div b{display:block;font-size:var(--fs-12);font-weight:var(--fw-semibold);color:var(--text-87);line-height:1.25;text-wrap:balance}
.gob .tro div span{display:block;margin-top:var(--space-2);font-size:var(--fs-11);color:var(--text-60)}
.gob .tro:hover div b{color:var(--text-100)}
.gob .med{--ms:var(--med);flex:none;display:grid;place-items:center;width:var(--ms);height:var(--ms);border-radius:var(--radius-round);font:var(--fw-bold) calc(var(--ms) * .46)/var(--lh-1) var(--font-display);padding-top:calc(var(--ms) * .05)}
.gob .med.gold{color:var(--reward-gold);background:radial-gradient(circle at 50% 32%,color-mix(in srgb,var(--reward-gold) 24%,transparent),color-mix(in srgb,var(--reward-gold) 5%,transparent) 72%);box-shadow:inset 0 0 0 1.5px var(--reward-gold),0 0 18px color-mix(in srgb,var(--reward-gold) 16%,transparent)}
.gob .med.ms{color:var(--text-87);background:var(--white-4);box-shadow:inset 0 0 0 1.5px var(--white-30)}
.gob .med.open{background:transparent;border:1.5px dashed var(--white-18)}
.gob .med.lg{--ms:var(--med-lg)}
/* empty, labelled medallion slot: what you can still win */
.gob .tro.slot-e .med{background:transparent;border:1.5px dashed var(--white-20);color:var(--text-38);box-shadow:none}
.gob .tro.slot-e div b{color:var(--text-60)}

/* .tsn — Top Seasons, in the server's season-GP order. */
.gob .tsn-l{display:flex;flex-direction:column}
/* The finish column is the wider of the two flexible ones: the longest finish
   ("Regular season conference champions") has to read in full at 1280. A long
   team name is what gives way. */
.gob .tsn{display:grid;grid-template-columns:var(--dsz-28) calc(var(--dsz-40) * 2.84) minmax(0,1fr) var(--dsz-60) minmax(0,2fr) var(--dsz-64);align-items:center;gap:var(--dsp-12);height:var(--tsn-h);border-bottom:1px solid var(--line)}
.gob-1920 .tsn{grid-template-columns:var(--dsz-28) 159px minmax(0,1fr) var(--dsz-60) minmax(0,1.1fr) var(--dsz-64)}
.gob .tsn>i{font:normal var(--fw-bold) var(--fs-28)/var(--lh-85) var(--font-display);color:var(--text-60);text-align:center;padding-top:var(--space-2);font-style:normal}
.gob .tsn:first-child>i{color:var(--text-100)}
.gob .tsn-a{height:var(--dsz-40);border-radius:var(--radius-6);overflow:hidden;background:var(--surface-3);box-shadow:inset 0 0 0 1px var(--white-10)}
.gob-1920 .tsn-a{height:56px}
.gob .tsn-a img{display:block;width:100%;height:100%;object-fit:cover}
.gob .tsn-n{display:flex;flex-direction:column;gap:var(--space-3);min-width:0}
.gob .tsn-n b{font-size:var(--fs-13);font-weight:var(--fw-semibold);color:var(--text-100);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gob .tsn-n span{font-size:var(--fs-11);color:var(--text-60);white-space:nowrap}
.gob .tsn-r{font:var(--fw-bold) var(--fs-20)/var(--lh-1) var(--font-display);color:var(--text-87);text-align:right;white-space:nowrap;padding-top:var(--space-1)}
.gob .tsn-f{font-size:var(--fs-12);color:var(--text-60);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gob .tsn-f.gold-t{color:var(--reward-gold);font-weight:var(--fw-semibold)}
.gob .tsn-f .ip{display:inline-flex;align-items:center;gap:var(--space-5);height:var(--dsz-20);padding:0 var(--space-7);border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-strong);font-size:var(--fs-10);font-weight:var(--fw-bold);letter-spacing:var(--tracking-6);text-transform:uppercase;color:var(--text-87)}
.gob .tsn-g{display:flex;align-items:baseline;justify-content:flex-end;gap:var(--space-3);font:var(--fw-bold) var(--fs-24)/var(--lh-1) var(--font-display);color:var(--text-100);white-space:nowrap;padding-top:var(--space-1)}
.gob .tsn-g small{font-size:var(--fs-10);font-family:var(--font-body);letter-spacing:var(--tracking-6);color:var(--text-60)}
.gob .tsn.is-e{grid-template-columns:var(--dsz-28) minmax(0,1fr);border-bottom-style:dashed;border-bottom-color:var(--line-strong)}
.gob .tsn.is-e>i{color:transparent;-webkit-text-stroke:1px var(--white-30)}
.gob .tsn.is-e span{font-size:var(--fs-12);color:var(--text-38)}
.gob .tsn.is-e:first-of-type span{color:var(--text-60)}

/* ── Base pieces Home Base needs that the shared sheets do not carry yet ── */
.gob .btn-ghost.sm{height:var(--dsz-34);min-width:112px;padding:0 var(--space-14);font-size:var(--fs-15)!important}
.gob .btn-ghost:focus-visible{outline:2px solid var(--white);outline-offset:2px}
.gob .seg{display:inline-flex;gap:var(--space-2);padding:var(--space-3);border-radius:var(--radius-9);background:var(--white-4);box-shadow:inset 0 0 0 1px var(--line)}
.gob .seg button{display:inline-flex;align-items:center;gap:var(--space-6);height:var(--dsz-28);padding:0 var(--space-12);border-radius:var(--radius-7);font-size:var(--fs-12);font-weight:var(--fw-semibold);color:var(--text-60);white-space:nowrap;transition:background var(--dur-hover),color var(--dur-hover)}
.gob .seg button:hover{color:var(--text-87);background:var(--white-4)}
.gob .seg button.on{background:var(--white-11);color:var(--text-100);box-shadow:inset 0 1px 0 var(--white-9)}
.gob .seg button:focus-visible{outline:2px solid var(--white);outline-offset:1px}
.gob .ldb-r{display:grid;grid-template-columns:var(--dsz-18) minmax(0,1fr) auto;align-items:center;gap:var(--dsp-8);height:var(--dsz-28);padding:0 var(--dsp-8);border-top:1px solid var(--line);font-size:var(--fs-12)}
.gob .ldb-r:first-child{border-top:0}
.gob .ldb-r>span:first-child{font-size:var(--fs-11);font-weight:var(--fw-bold);color:var(--text-38)}
.gob .ldb-n{display:flex;align-items:baseline;gap:var(--space-6);min-width:0;white-space:nowrap;overflow:hidden}
.gob .ldb-n .nm{font-weight:var(--fw-medium);color:var(--text-87);overflow:hidden;text-overflow:ellipsis}
.gob .ldb-n em{font-style:normal;font-size:var(--fs-10);font-weight:var(--fw-bold);letter-spacing:var(--tracking-6);color:var(--text-38)}
.gob .ldb-r b{font:var(--fw-bold) var(--fs-18)/var(--lh-1) var(--font-display);color:var(--text-87)}
.gob .ldb-r.me{background:color-mix(in srgb,var(--navy) 35%,transparent);border-radius:var(--radius-6);border-top-color:transparent;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--navy-hi) 35%,transparent)}

@media (prefers-reduced-motion:reduce){
  .gob .door-live i{animation:none}
  .gob .slot.advance-glow .vacant::after{animation:none;opacity:.8}
  .gob .fag.au-glow::after{animation:none;opacity:.8}
  .gob .door:hover{transform:none}
}