:root {
  color-scheme: dark only;
  --bg: #06101c;
  --bg-2: #0a1726;
  --panel: rgba(14, 29, 47, .82);
  --panel-solid: #0f2034;
  --line: rgba(154, 183, 214, .18);
  --line-bright: rgba(133, 207, 255, .42);
  --text: #f4f8fc;
  --muted: #a6bbcf;
  --blue: #37a8ff;
  --blue-deep: #1065bc;
  --gold: #ffbd3c;
  --gold-deep: #a75d00;
  --green: #52e09e;
  --red: #ff6177;
  --shadow: 0 24px 70px rgba(0, 0, 0, .34);
  --radius: 22px;
}

html, body { color-scheme: dark only; }
input:not([type="checkbox"]):not([type="radio"]):not([type="color"]), textarea, select {
  color: #f4f8fc;
  background-color: #071725;
  caret-color: #72d8ff;
}
input::placeholder, textarea::placeholder { color: #8199ad; opacity: 1; }
select option { color: #f4f8fc; background: #0a1a29; }
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
  -webkit-text-fill-color: #f4f8fc;
  box-shadow: 0 0 0 1000px #0a1a29 inset;
  transition: background-color 9999s ease-out;
}

/* Account, membership, and site administration */
.home-membership-panel{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(260px,.6fr);gap:26px;align-items:center;margin-bottom:18px;padding:24px 28px;border-radius:22px;background:linear-gradient(120deg,rgba(9,39,63,.94),rgba(58,39,8,.78))}.home-membership-panel h2,.home-membership-panel p{margin:5px 0}.home-membership-panel p{color:#b4c8d9;line-height:1.55}.home-membership-panel>div:last-child{padding-left:24px;border-left:1px solid rgba(255,205,105,.25)}.home-membership-panel>div:last-child>strong{color:#ffd16d;font-size:1.45rem}.home-membership-panel .button{margin-top:10px}
.account-nav{display:flex;align-items:center;justify-content:flex-end;gap:10px}.account-nav-floating{position:fixed;z-index:160;top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));padding:8px 10px;border:1px solid rgba(142,190,232,.24);border-radius:16px;background:rgba(5,17,31,.92);box-shadow:0 12px 32px rgba(0,0,0,.3);backdrop-filter:blur(18px)}.account-nav-link{color:#c8def2;font-size:.82rem;font-weight:750;text-decoration:none}.account-user-link{display:flex;align-items:center;gap:7px;color:#f3f9ff;text-decoration:none}.account-user-link img,.account-user-link>span{width:32px;height:32px;border-radius:50%;object-fit:cover;display:grid;place-items:center;background:linear-gradient(145deg,#178ee0,#56c2ff);color:#06131f;font-weight:900}.account-user-link em{max-width:125px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-style:normal;font-size:.82rem;font-weight:800}.account-user-link strong{padding:3px 6px;border-radius:999px;background:#ffc956;color:#312000;font-size:.57rem;letter-spacing:.08em}.account-identity-prompt{position:fixed;z-index:155;left:max(12px,env(safe-area-inset-left));bottom:max(18px,calc(env(safe-area-inset-bottom) + 12px));display:grid;gap:6px;min-width:190px;max-width:min(340px,calc(100vw - 24px));padding:12px 14px;border-radius:16px}.account-identity-prompt>span{color:#8eb1cf;font-size:.68rem;font-weight:850;letter-spacing:.08em;text-transform:uppercase}.account-identity-prompt>strong{color:#fff}.account-identity-choices{display:flex;flex-wrap:wrap;gap:7px;margin-top:3px}
.account-page-shell{min-height:100vh}.account-page{width:min(1180px,calc(100% - 28px));margin:28px auto 80px}.account-auth-card{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(330px,.95fr);overflow:hidden;border-radius:28px}.account-auth-copy{padding:clamp(30px,6vw,72px);background:radial-gradient(circle at 10% 10%,rgba(37,163,238,.22),transparent 44%)}.account-auth-copy h1{max-width:650px;margin:10px 0 16px;font-size:clamp(2.1rem,5vw,4.7rem);line-height:.98}.account-auth-copy p{max-width:620px;color:#b7cbdd;font-size:1.08rem;line-height:1.65}.account-auth-copy ul,.premium-account-card ul{display:grid;gap:11px;padding-left:20px;color:#d5e6f4}.account-auth-form-wrap{padding:clamp(24px,5vw,55px);background:rgba(5,15,27,.72)}.account-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:26px}.account-tabs button{border:0;border-radius:999px;padding:9px 13px;background:rgba(117,160,196,.12);color:#9eb9d0;font:inherit;font-size:.78rem;font-weight:800;cursor:pointer}.account-tabs button.active{background:#1c93df;color:#fff}.account-form{display:grid;gap:15px}.account-form h2,.account-card h2{margin:0 0 4px}.account-form>.button{justify-self:start}.form-message{min-height:1.4em;margin:16px 0 0;color:#72e0b2;font-weight:700}.form-message.is-error{color:#ff8d8d}.account-dashboard{display:grid;gap:18px}.account-heading{display:flex;align-items:center;gap:18px;padding:20px 24px;border-radius:22px}.account-heading h1{margin:2px 0 4px}.account-heading p{margin:0;color:#a8bfd3}.account-heading-actions{display:flex;gap:8px;margin-left:auto}.account-profile-avatar{width:72px;height:72px;flex:0 0 72px;border-radius:50%;display:grid;place-items:center;overflow:hidden;background:linear-gradient(145deg,#188edc,#75d2ff);color:#03111e;font-size:1.4rem;font-weight:950}.account-profile-avatar img{width:100%;height:100%;object-fit:cover}.account-dashboard-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.account-card{padding:24px;border-radius:22px}.account-photo-actions,.admin-config-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:17px}.premium-account-card{background:linear-gradient(145deg,rgba(12,44,68,.94),rgba(53,37,9,.82));border-color:rgba(255,202,91,.38)}.premium-price{display:block;margin:12px 0;font-size:1.9rem;color:#ffd372}.premium-account-card .button{width:100%;margin-top:8px}.premium-account-card p{color:#cbbf9e;font-size:.8rem}.stats-page,.admin-page{display:grid;gap:18px}.stats-summary-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.stat-metric{padding:17px 13px;border-radius:16px}.stat-metric strong{display:block;color:#fff;font-size:1.45rem}.stat-metric span{color:#8faec6;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em}.stats-content-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(270px,.7fr);gap:18px}.premium-callout{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 25px;border-radius:20px;background:linear-gradient(105deg,rgba(133,87,8,.36),rgba(7,22,37,.94))}.premium-callout h2,.premium-callout p{margin:4px 0}.stats-game-list,.stats-opponents{display:grid;gap:8px}.stats-game-row{display:grid;grid-template-columns:95px minmax(120px,.6fr) minmax(180px,1fr);align-items:center;gap:10px;padding:12px 13px;border-radius:13px;background:rgba(105,146,180,.1);border-left:4px solid #d66}.stats-game-row.won{border-left-color:#50d89b}.stats-game-row em{color:#8faec6;font-size:.75rem;font-style:normal;text-align:right}.stats-opponent-row{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid rgba(145,183,214,.13)}.stats-opponent-row span,.account-help{color:#8faec6;font-size:.78rem}.account-help{margin-top:24px;line-height:1.5}.admin-workspace{display:grid;gap:18px}.admin-config-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:13px}.admin-form-section{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin-top:8px;padding-top:18px;border-top:1px solid rgba(139,180,212,.16)}.admin-form-section h3{grid-column:1/-1;margin:0}.admin-config-actions{grid-column:1/-1}.admin-user-list{display:grid;gap:10px}.admin-user-row{display:grid;grid-template-columns:minmax(180px,.8fr) minmax(380px,1.3fr) auto;align-items:center;gap:16px;padding:15px;border:1px solid rgba(142,183,215,.16);border-radius:15px;background:rgba(82,124,160,.07)}.admin-user-identity{display:grid;gap:3px}.admin-user-identity span,.admin-user-identity em{color:#8faec6;font-size:.75rem;font-style:normal}.admin-user-controls,.admin-user-actions{display:flex;flex-wrap:wrap;gap:8px}.admin-user-control{display:grid;gap:4px;color:#8faec6;font-size:.66rem;font-weight:800;text-transform:uppercase}.admin-user-control select{min-width:105px}.admin-user-actions{justify-content:flex-end}
@media(max-width:900px){.account-auth-card{grid-template-columns:1fr}.account-dashboard-grid{grid-template-columns:1fr 1fr}.premium-account-card{grid-column:1/-1}.stats-summary-grid{grid-template-columns:repeat(3,1fr)}.stats-content-grid{grid-template-columns:1fr}.admin-config-grid{grid-template-columns:1fr 1fr}.admin-form-section{grid-template-columns:1fr 1fr}.admin-user-row{grid-template-columns:1fr}.admin-user-actions{justify-content:flex-start}}
@media(max-width:600px){.account-page{width:min(100% - 18px,1180px);margin-top:14px}.account-page-shell>.topbar{padding-right:10px}.account-page-shell>.topbar #accountNav .account-nav-link{display:none}.account-user-link em{display:none}.account-auth-copy,.account-auth-form-wrap{padding:25px 20px}.account-auth-copy h1{font-size:2.25rem}.account-heading{align-items:flex-start;flex-wrap:wrap}.account-heading-actions{width:100%;margin-left:0}.account-dashboard-grid,.admin-config-grid,.admin-form-section{grid-template-columns:1fr}.stats-summary-grid{grid-template-columns:repeat(2,1fr)}.stats-game-row{grid-template-columns:75px 1fr}.stats-game-row em{grid-column:1/-1;text-align:left}.premium-callout{align-items:flex-start;flex-direction:column}.account-nav-floating{top:auto;right:max(10px,env(safe-area-inset-right));bottom:max(10px,calc(env(safe-area-inset-bottom) + 8px))}.account-identity-prompt{bottom:max(74px,calc(env(safe-area-inset-bottom) + 72px))}}

* { box-sizing: border-box; }
html, body { min-height: 100%; }
body {
  margin: 0;
  color: var(--text);
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:
    radial-gradient(circle at 9% 5%, rgba(40, 144, 229, .17), transparent 28rem),
    radial-gradient(circle at 88% 18%, rgba(255, 178, 41, .12), transparent 25rem),
    linear-gradient(155deg, var(--bg), #071322 45%, #050c16);
  background-attachment: fixed;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .08;
  background-image: linear-gradient(rgba(255,255,255,.13) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.13) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(to bottom, black, transparent 88%);
}
button, input, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
.hidden { display: none !important; }
.glass {
  background: linear-gradient(145deg, rgba(18, 39, 62, .91), rgba(8, 21, 35, .82));
  border: 1px solid var(--line);
  box-shadow: var(--shadow), inset 0 1px rgba(255,255,255,.04);
  backdrop-filter: blur(18px);
}

.topbar {
  position: sticky;
  z-index: 40;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 76px;
  padding: 12px clamp(18px, 4vw, 56px);
  border-width: 0 0 1px;
}
.brand { display: flex; align-items: center; gap: 13px; }
.brand-mark {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border-radius: 14px;
  color: #04111c;
  font-family: "Space Grotesk", sans-serif;
  font-weight: 800;
  background: linear-gradient(135deg, #63c8ff, #36e3a2);
  box-shadow: 0 10px 28px rgba(55,168,255,.28);
}
.brand strong, .brand small { display: block; }
.brand strong { font-family: "Space Grotesk", sans-serif; font-size: 17px; }
.brand small { margin-top: 2px; color: var(--muted); font-size: 11px; }

.button, .icon-button, .back-button {
  border: 0;
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, opacity .16s ease;
}
.button:hover, .icon-button:hover, .back-button:hover { transform: translateY(-1px); }
.button:active, .icon-button:active, .back-button:active { transform: translateY(1px) scale(.99); }
.button:disabled { opacity: .45; cursor: not-allowed; transform: none; }
.button {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 18px;
  border-radius: 13px;
  font-weight: 750;
}
.button-primary {
  color: #04111c;
  background: linear-gradient(135deg, #65c9ff, #35dea1);
  box-shadow: 0 10px 28px rgba(55, 168, 255, .2);
}
.button-secondary {
  border: 1px solid var(--line);
  color: var(--text);
  background: rgba(255,255,255,.045);
}
.button-danger { border: 1px solid rgba(255,97,119,.3); background: rgba(255,97,119,.12); color: #ff9aaa; }
.button-large { min-height: 54px; padding-inline: 24px; border-radius: 16px; }
.button-small { min-height: 36px; padding-inline: 12px; font-size: 13px; }
.icon-button {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: rgba(255,255,255,.04);
  font-size: 21px;
}
.back-button { padding: 7px 0; color: #b6c7d8; background: transparent; font-weight: 700; }

.welcome-view {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(350px, .88fr);
  gap: 26px;
  width: min(1380px, calc(100% - 36px));
  margin: 32px auto 60px;
}
.hero-panel, .tournament-library { min-height: 620px; border-radius: 28px; }
.hero-panel {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  overflow: hidden;
  padding: clamp(38px, 7vw, 88px);
}
.hero-panel::after {
  pointer-events: none;
  content: "";
  position: absolute;
  right: -110px;
  bottom: -140px;
  width: 520px;
  height: 520px;
  border: 68px solid rgba(55,168,255,.09);
  border-radius: 48%;
  transform: rotate(24deg);
  box-shadow: 0 0 0 70px rgba(255,189,60,.035), 0 0 0 140px rgba(55,224,158,.02);
}
.eyebrow {
  color: #66cfff;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.hero-panel h1 {
  max-width: 740px;
  margin: 16px 0 18px;
  font-family: "Space Grotesk", sans-serif;
  font-size: clamp(44px, 6vw, 78px);
  line-height: .98;
  letter-spacing: -.045em;
}
.hero-panel p { max-width: 650px; margin: 0 0 30px; color: #a7bbce; font-size: clamp(16px, 1.6vw, 20px); line-height: 1.65; }
.hero-panel > * { position: relative; z-index: 1; }
.tournament-library { padding: 28px; }
.section-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.section-heading h2 { margin: 5px 0 0; font-family: "Space Grotesk", sans-serif; font-size: 28px; }
.tournament-list { display: grid; gap: 12px; }
.tournament-item {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 15px;
  padding: 17px;
  border: 1px solid var(--line);
  border-radius: 17px;
  background: rgba(255,255,255,.035);
  cursor: pointer;
  transition: .18s ease;
}
.tournament-item:hover { border-color: var(--line-bright); background: rgba(78,171,233,.075); transform: translateY(-2px); }
.tournament-item h3 { margin: 0 0 7px; font-size: 16px; }
.tournament-item p { margin: 0; color: var(--muted); font-size: 12px; }
.tournament-stats { display: flex; align-items: flex-end; flex-direction: column; justify-content: center; gap: 5px; color: var(--muted); font-size: 11px; }
.live-pill { display: inline-flex; gap: 6px; align-items: center; color: var(--green); font-weight: 800; }
.live-pill::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 10px currentColor; }
.empty-state { padding: 44px 18px; border: 1px dashed var(--line); border-radius: 17px; text-align: center; color: var(--muted); }

.bracket-view { padding: 24px clamp(12px, 3vw, 36px) 36px; }
.event-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 24px 28px;
  border-radius: 24px;
}
.event-copy h1 { margin: 6px 0 5px; font-family: "Space Grotesk", sans-serif; font-size: clamp(28px, 4vw, 48px); letter-spacing: -.03em; }
.event-copy p { margin: 0; color: var(--muted); }
.event-actions { display: flex; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.bracket-toolbar {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 18px;
  margin: 14px 0;
  padding: 10px 14px;
  border-radius: 17px;
}
.live-indicator { display: flex; align-items: center; gap: 8px; font-size: 12px; }
.live-indicator span { width: 9px; height: 9px; border-radius: 50%; background: var(--green); box-shadow: 0 0 12px var(--green); }
.live-indicator em { color: var(--muted); font-style: normal; }
.toolbar-center { display: flex; align-items: center; gap: 8px; }
.toolbar-center .icon-button { width: 36px; height: 36px; }
.zoom-label { min-width: 54px; text-align: center; color: #b9cada; font-size: 12px; font-weight: 800; }
.toolbar-hint { justify-self: end; color: var(--muted); font-size: 11px; }
.bracket-viewport {
  position: relative;
  height: calc(100vh - 286px);
  min-height: 520px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 24px;
  background:
    radial-gradient(circle at 10% 20%, rgba(55,168,255,.07), transparent 30rem),
    linear-gradient(rgba(8,20,34,.94), rgba(5,14,24,.98));
  box-shadow: inset 0 1px rgba(255,255,255,.035), var(--shadow);
  cursor: grab;
  touch-action: none;
}
.bracket-viewport.dragging { cursor: grabbing; }
.bracket-canvas {
  position: absolute;
  left: 0;
  top: 0;
  transform-origin: 0 0;
  will-change: transform;
}
.rounds-layer { position: absolute; inset: 0; }
.connector-layer { position: absolute; inset: 0; overflow: visible; pointer-events: none; }
.connector-path { fill: none; stroke: rgba(91,158,205,.38); stroke-width: 2; vector-effect: non-scaling-stroke; }
.round-column { position: absolute; top: 0; width: 260px; }
.round-header { position: absolute; top: 0; width: 100%; padding: 10px 6px; }
.round-header span { display: block; color: #65cfff; font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.round-header strong { display: block; margin-top: 4px; font-family: "Space Grotesk", sans-serif; font-size: 18px; }
.game-card {
  position: absolute;
  width: 260px;
  height: 124px;
  overflow: hidden;
  border: 1px solid rgba(133,171,205,.18);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(20,43,68,.97), rgba(10,26,43,.98));
  box-shadow: 0 13px 30px rgba(0,0,0,.22), inset 0 1px rgba(255,255,255,.04);
  cursor: pointer;
  transition: transform .17s ease, border-color .17s ease, box-shadow .17s ease;
}
.game-card:hover { transform: translateY(-2px); border-color: rgba(96,199,255,.45); box-shadow: 0 16px 40px rgba(0,0,0,.31), 0 0 0 1px rgba(55,168,255,.08); }
.game-card.live { border-color: rgba(82,224,158,.48); box-shadow: 0 0 0 1px rgba(82,224,158,.08), 0 14px 36px rgba(0,0,0,.28); }
.game-card.final { opacity: 1; border-color: rgba(82,224,158,.38); }
.game-card.bye { opacity: .62; }
.game-card.seeding { border-color: rgba(255,189,60,.42); box-shadow: 0 12px 34px rgba(255,154,31,.09); }
.game-card-top { display: flex; justify-content: space-between; align-items: center; height: 28px; padding: 0 11px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.game-card-stage { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.game-card-status { flex: 0 0 auto; margin-left: 8px; }
.game-card-status { display: flex; align-items: center; gap: 5px; }
.game-card.live .game-card-status { color: var(--green); }
.game-card.live .game-card-status::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; box-shadow: 0 0 8px currentColor; }
.bracket-team { display: grid; grid-template-columns: 1fr auto; align-items: center; height: 47px; padding: 0 12px; border-bottom: 1px solid rgba(138,170,199,.1); }
.bracket-team:last-child { border-bottom: 0; }
.bracket-team.winner {
  position: relative;
  color: #effff7;
  background: linear-gradient(90deg, rgba(26,196,112,.88), rgba(20,139,84,.58));
  box-shadow: inset 5px 0 0 #8dffc2, inset 0 0 22px rgba(116,255,179,.2), 0 0 18px rgba(44,232,139,.18);
}
.bracket-team.winner .bracket-team-name { color: #fff; font-weight: 900; text-shadow: 0 1px 2px rgba(0,0,0,.45); }
.bracket-team.winner .bracket-score { color: #fff; font-weight: 900; text-shadow: 0 1px 2px rgba(0,0,0,.45); }
.bracket-team.winner .bracket-rank { color: #dcffea; }
.bracket-team-name { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 13px; font-weight: 750; }
.bracket-team.tbd .bracket-team-name { color: #6d8195; font-style: italic; font-weight: 600; }
.bracket-score { min-width: 32px; text-align: right; font-family: "Space Grotesk", sans-serif; font-size: 22px; }

.dialog {
  width: min(680px, calc(100% - 28px));
  max-height: calc(100vh - 30px);
  overflow: auto;
  padding: 25px;
  border: 1px solid var(--line-bright);
  border-radius: 24px;
  color: var(--text);
}
.dialog::backdrop { background: rgba(2,8,14,.78); backdrop-filter: blur(8px); }
.dialog-small { width: min(480px, calc(100% - 28px)); }
.dialog-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.dialog-header h2 { margin: 5px 0 0; font-family: "Space Grotesk", sans-serif; font-size: 28px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.field { display: grid; gap: 8px; color: #b8cadb; font-size: 12px; font-weight: 750; }
.field small { color: var(--muted); font-weight: 500; }
.field-wide { grid-column: 1 / -1; }
.field input, .field textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 13px;
  outline: 0;
  color: var(--text);
  background: rgba(4,13,23,.68);
  padding: 13px 14px;
  resize: vertical;
}
.field input:focus, .field textarea:focus { border-color: #4fbaff; box-shadow: 0 0 0 3px rgba(55,168,255,.1); }
.dialog-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 22px; }
.form-error { min-height: 18px; margin: 12px 0 0; color: #ff8698; font-size: 12px; }
.menu-stack { display: grid; gap: 12px; }
.exact-score-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }

.share-app-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.share-app-button { min-height: 50px; display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
@media (max-width: 480px) { .share-app-grid { grid-template-columns: 1fr; } }

.toast {
  position: fixed;
  z-index: 100;
  left: 50%;
  bottom: 26px;
  max-width: calc(100% - 28px);
  padding: 12px 17px;
  border: 1px solid var(--line-bright);
  border-radius: 12px;
  background: #122a42;
  color: var(--text);
  box-shadow: var(--shadow);
  opacity: 0;
  transform: translate(-50%, 16px);
  pointer-events: none;
  transition: .2s ease;
  font-size: 13px;
}
.toast.show { opacity: 1; transform: translate(-50%, 0); }

.scoreboard-shell { overflow: hidden; min-height: 100dvh; }
.scoreboard-shell::before { opacity: .05; }
.scoreboard-header {
  position: relative;
  z-index: 10;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  min-height: 86px;
  padding: 12px clamp(14px, 3vw, 36px);
  border-width: 0 0 1px;
}
.scoreboard-event { text-align: center; }
.portrait-scoreboard-title { display: none; }
.scoreboard-event h1 { margin: 2px 0; font-family: "Space Grotesk", sans-serif; font-size: clamp(18px, 3vw, 27px); }
.scoreboard-event p { margin: 0; color: var(--muted); font-size: 11px; }
.scoreboard-header-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.connection-badge { display: inline-flex; align-items: center; gap: 7px; color: var(--muted); font-size: 11px; font-weight: 700; }
.connection-badge i { width: 8px; height: 8px; border-radius: 50%; background: #6c7b89; }
.connection-badge.online { color: var(--green); }
.connection-badge.online i { background: currentColor; box-shadow: 0 0 10px currentColor; }
.scoreboard-main { height: calc(100dvh - 86px); display: grid; grid-template-rows: auto 1fr auto; gap: 10px; padding: 10px clamp(10px, 2vw, 24px) max(10px, env(safe-area-inset-bottom)); }
.game-state-banner { min-height: 30px; display: grid; place-items: center; color: #9fb4c6; font-size: 12px; font-weight: 700; text-align: center; }
.game-state-banner.final { color: var(--green); }
.score-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(9px, 1.5vw, 18px); min-height: 0; }
.score-card {
  position: relative;
  display: grid;
  grid-template-rows: auto 1fr auto;
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: clamp(18px, 3vw, 32px);
  box-shadow: 0 26px 64px rgba(0,0,0,.32), inset 0 1px rgba(255,255,255,.13);
}
.score-card::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(145deg, rgba(255,255,255,.13), transparent 28%, transparent 68%, rgba(0,0,0,.18)); }
.score-card-blue { background: radial-gradient(circle at 50% 18%, rgba(90,200,255,.55), transparent 40%), linear-gradient(155deg, #178be0, #0a5ba9 68%, #073d75); }
.score-card-gold { background: radial-gradient(circle at 50% 18%, rgba(255,226,128,.55), transparent 40%), linear-gradient(155deg, #e99c16, #b76309 68%, #733503); }
.score-card.disabled { filter: grayscale(.7); opacity: .52; }
.score-card.view-only { box-shadow: 0 26px 64px rgba(0,0,0,.32), inset 0 0 0 2px rgba(255,255,255,.10); }
.score-card.view-only .score-add-zone, .score-card.view-only .score-step { cursor: default; }
.score-card.view-only .score-add-zone small { opacity: .95; }
.score-card.view-only .score-controls { opacity: .58; }
.score-card.winner { box-shadow: 0 0 0 3px rgba(82,224,158,.62), 0 24px 65px rgba(0,0,0,.38); }
.score-team { position: relative; z-index: 2; min-height: 77px; display: grid; place-items: center; align-content: center; padding: 9px 14px; border-bottom: 1px solid rgba(255,255,255,.16); text-align: center; }
.team-label { font-size: 9px; font-weight: 900; letter-spacing: .16em; opacity: .72; }
.score-team h2 { max-width: 100%; margin: 5px 0 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-family: "Space Grotesk", sans-serif; font-size: clamp(18px, 3.4vw, 36px); line-height: 1; }
.score-add-zone {
  position: relative;
  z-index: 2;
  display: grid;
  min-height: 0;
  place-items: center;
  align-content: center;
  border: 0;
  color: white;
  background: transparent;
  cursor: pointer;
  user-select: none;
  touch-action: manipulation;
}
.score-add-zone:active { background: rgba(255,255,255,.1); }
.score-number { font-family: "Space Grotesk", sans-serif; font-size: clamp(110px, 25vw, 330px); line-height: .76; letter-spacing: -.08em; text-shadow: 0 8px 24px rgba(0,0,0,.24); }
.score-add-zone small { margin-top: clamp(14px, 3vh, 28px); font-weight: 850; font-size: clamp(12px, 2vw, 18px); letter-spacing: .08em; text-transform: uppercase; opacity: .75; }
.score-controls { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid rgba(255,255,255,.16); }
.score-step { min-height: clamp(58px, 9vh, 90px); border: 0; border-right: 1px solid rgba(255,255,255,.16); color: white; background: rgba(0,0,0,.1); font-family: "Space Grotesk", sans-serif; font-size: clamp(20px, 3vw, 32px); font-weight: 800; cursor: pointer; touch-action: manipulation; }
.score-step:last-child { border-right: 0; }
.score-step:active { background: rgba(255,255,255,.13); }
.scoreboard-footer { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 10px; padding: 10px 13px; border-radius: 17px; }
.scoreboard-rule { display: flex; align-items: baseline; gap: 8px; color: var(--muted); font-size: 11px; text-transform: uppercase; font-weight: 800; letter-spacing: .08em; }
.scoreboard-rule strong { color: var(--text); font-family: "Space Grotesk", sans-serif; font-size: 24px; }

@media (max-width: 900px) {
  .welcome-view { grid-template-columns: 1fr; }
  .hero-panel, .tournament-library { min-height: auto; }
  .hero-panel { padding: 56px 30px; }
  .event-banner { align-items: flex-start; flex-direction: column; }
  .event-actions { width: 100%; justify-content: flex-start; }
  .bracket-toolbar { grid-template-columns: 1fr auto; }
  .toolbar-hint { display: none; }
  .scoreboard-header { grid-template-columns: auto 1fr auto; }
  .connection-badge { display: none; }
}

@media (max-width: 620px) {
  .topbar { min-height: 67px; padding-inline: 13px; }
  .brand small { display: none; }
  .topbar .button { min-height: 39px; padding-inline: 13px; font-size: 12px; }
  .welcome-view { width: min(100% - 20px, 1380px); margin-top: 12px; gap: 12px; }
  .hero-panel, .tournament-library { border-radius: 20px; }
  .hero-panel { padding: 42px 22px; }
  .hero-panel h1 { font-size: 42px; }
  .tournament-library { padding: 19px; }
  .bracket-view { padding: 10px; }
  .event-banner { padding: 19px; border-radius: 19px; }
  .event-actions .button { flex: 1; font-size: 11px; padding-inline: 9px; }
  .bracket-toolbar { margin: 9px 0; padding: 8px; }
  .live-indicator em, .toolbar-center .button { display: none; }
  .bracket-viewport { height: calc(100dvh - 269px); min-height: 440px; border-radius: 18px; }
  .form-grid { grid-template-columns: 1fr; }
  .field-wide { grid-column: auto; }
  .dialog { padding: 19px; border-radius: 20px; }
  .scoreboard-header { min-height: 69px; padding: 8px 10px; }
  .scoreboard-main { height: calc(100dvh - 69px); padding: 6px max(6px, env(safe-area-inset-left)) max(6px, env(safe-area-inset-bottom)); gap: 5px; }
  .scoreboard-header .back-button { font-size: 11px; }
  .scoreboard-header .button { display: none; }
  .scoreboard-event h1 { font-size: 15px; }
  .scoreboard-event p { font-size: 9px; }
  .game-state-banner { min-height: 24px; font-size: 10px; }
  .score-grid { gap: 6px; }
  .score-card { border-radius: 17px; }
  .score-team { min-height: 62px; padding-inline: 8px; }
  .score-team h2 { font-size: clamp(15px, 5vw, 24px); }
  .score-number { font-size: clamp(92px, 37vw, 180px); }
  .score-add-zone small { margin-top: 10px; font-size: 10px; }
  .score-step { min-height: 58px; font-size: 20px; }
  .scoreboard-footer { grid-template-columns: 1fr 1fr; padding: 7px; }
  .scoreboard-rule { display: none; }
  .scoreboard-footer .button { min-height: 41px; padding: 0 9px; font-size: 11px; }
}

@media (max-height: 620px) and (orientation: landscape) {
  .scoreboard-header { min-height: 58px; }
  .scoreboard-main { height: calc(100dvh - 58px); padding: 5px 8px; }
  .game-state-banner { display: none; }
  .score-team { min-height: 48px; }
  .score-team h2 { font-size: 20px; }
  .score-number { font-size: clamp(92px, 24vh, 160px); }
  .score-add-zone small { margin-top: 5px; font-size: 9px; }
  .score-step { min-height: 42px; }
  .scoreboard-footer { padding: 5px 8px; }
  .scoreboard-footer .button { min-height: 35px; }
}

/* Tournament administration, registration, team imagery, and live rankings */
button, input, textarea, select { font: inherit; }
.field select {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 13px;
  outline: 0;
  color: var(--text);
  background: rgba(4,13,23,.9);
  padding: 13px 14px;
}
.field select:focus { border-color: #4fbaff; box-shadow: 0 0 0 3px rgba(55,168,255,.1); }
.check-field {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  padding: 13px 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(255,255,255,.025);
  cursor: pointer;
}
.check-field input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--green); }
.check-field span, .check-field strong, .check-field small { display: block; }
.check-field strong { font-size: 12px; }
.check-field small { margin-top: 4px; color: var(--muted); font-size: 10px; line-height: 1.45; }
.form-section { padding-top: 5px; }
.passcode-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.security-note, .dialog-copy, .muted-note { color: var(--muted); font-size: 11px; line-height: 1.55; }
.spread-actions { display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; }
.section-heading.compact { margin-bottom: 12px; }
.section-heading.compact h3 { margin: 3px 0 0; }
.button-tiny { min-height: 32px; padding: 0 10px; border-radius: 10px; font-size: 10px; }
.team-add-row { display: grid; grid-template-columns: 1fr auto auto; gap: 9px; }
.team-add-row > input {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 12px;
  color: var(--text);
  background: rgba(4,13,23,.68);
  padding: 10px 12px;
}
.admin-team-list { display: grid; gap: 8px; max-height: 310px; margin-top: 12px; overflow: auto; }
.admin-team-row { display: grid; grid-template-columns: auto auto minmax(0,1fr) auto auto; align-items: center; gap: 8px; padding: 8px; border: 1px solid var(--line); border-radius: 13px; background: rgba(255,255,255,.025); }
.admin-team-row input { min-width: 0; border: 1px solid var(--line); border-radius: 10px; color: var(--text); background: rgba(3,11,20,.65); padding: 8px 10px; }
.seed-chip { color: #67cfff; font-size: 10px; font-weight: 900; }

.team-avatar {
  position: relative;
  display: inline-grid;
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 50%;
  background: linear-gradient(145deg, rgba(95,199,255,.28), rgba(56,224,161,.18));
  color: #eaf8ff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .03em;
}
.team-avatar img { width: 100%; height: 100%; object-fit: cover; }
.team-avatar.avatar-rotating img { position: absolute; inset: 0; opacity: 0; }
.team-avatar.avatar-rotating img:first-child { animation: team-avatar-first 8s ease-in-out infinite; }
.team-avatar.avatar-rotating img:nth-child(2) { animation: team-avatar-second 8s ease-in-out infinite; }
@keyframes team-avatar-first {
  0%, 42% { opacity: 1; }
  50%, 92% { opacity: 0; }
  100% { opacity: 1; }
}
@keyframes team-avatar-second {
  0%, 42% { opacity: 0; }
  50%, 92% { opacity: 1; }
  100% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .team-avatar.avatar-rotating img { animation: none; }
  .team-avatar.avatar-rotating img:first-child { opacity: 1; }
  .team-avatar.avatar-rotating img:nth-child(2) { display: none; }
}
.team-avatar-bracket { width: 27px; height: 27px; font-size: 8px; }
.team-avatar-score { width: clamp(42px,5.5vw,62px); height: clamp(42px,5.5vw,62px); font-size: 14px; }
.team-avatar-xl { width: 76px; height: 76px; font-size: 20px; }
.photo-picker { display: flex; align-items: center; gap: 12px; cursor: pointer; }
.photo-picker input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.compact-photo-picker span { display: grid; min-height: 42px; place-items: center; padding: 0 13px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.035); font-size: 11px; font-weight: 750; }
.photo-preview { display: grid; width: 76px; height: 76px; flex: 0 0 auto; place-items: center; overflow: hidden; border: 1px dashed var(--line-bright); border-radius: 50%; background: rgba(255,255,255,.04); font-size: 26px; }
.photo-preview img { width: 100%; height: 100%; object-fit: cover; }

.event-side { display: flex; align-items: flex-end; flex-direction: column; gap: 12px; }
.countdown-card, .signup-countdown { display: grid; gap: 4px; padding: 10px 14px; border: 1px solid rgba(255,189,60,.28); border-radius: 14px; background: rgba(255,189,60,.075); text-align: right; }
.countdown-card span, .signup-countdown span { color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.countdown-card strong, .signup-countdown strong { font-family: "Space Grotesk", sans-serif; font-size: 20px; color: #ffd47b; }
.signup-pill { color: #7ce4b2; font-weight: 800; }
.button-accent { border: 1px solid rgba(255,189,60,.34); background: rgba(255,189,60,.12); color: #ffd683; }
.empty-bracket { display: grid; min-height: 420px; place-items: center; align-content: center; gap: 10px; border-radius: 23px; text-align: center; }
.empty-bracket h2, .empty-bracket p { margin: 0; }
.empty-bracket p { color: var(--muted); }
.empty-bracket-icon { display: grid; width: 70px; height: 70px; place-items: center; border-radius: 22px; background: rgba(55,168,255,.12); color: #65cfff; font-size: 35px; }

.rankings-panel { margin: 0 0 14px; padding: 14px; border-radius: 18px; }
.rankings-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 10px; }
.rankings-heading h2 { margin: 2px 0 0; font-family: "Space Grotesk",sans-serif; font-size: 18px; }
.ranking-rule { color: var(--muted); font-size: 10px; font-weight: 750; }
.ranking-list { display: flex; gap: 8px; overflow-x: auto; padding: 2px 1px 5px; scrollbar-width: thin; }
.ranking-item { display: grid; grid-template-columns: auto auto minmax(100px,1fr); align-items: center; gap: 8px; min-width: 205px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 13px; color: var(--text); background: rgba(255,255,255,.03); text-align: left; cursor: pointer; }
.ranking-item.active { border-color: rgba(82,224,158,.22); }
.ranking-item.eliminated { opacity: .58; }
.ranking-item.champion { border-color: rgba(255,189,60,.5); background: linear-gradient(145deg,rgba(255,189,60,.16),rgba(255,255,255,.025)); opacity: 1; }
.ranking-number { color: #68cfff; font-family: "Space Grotesk",sans-serif; font-size: 14px; }
.ranking-avatar { width: 30px; height: 30px; }
.ranking-copy { min-width: 0; }
.ranking-copy b, .ranking-copy small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.ranking-copy b { font-size: 11px; }
.ranking-copy small { margin-top: 3px; color: var(--muted); font-size: 9px; }

.loser-path { stroke: rgba(255,189,60,.45); stroke-dasharray: 6 5; }
.game-card.placement { border-color: rgba(255,189,60,.35); }
.bracket-team { grid-template-columns: auto minmax(0,1fr) auto auto; gap: 8px; padding-inline: 10px; border-inline: 0; border-top: 0; color: inherit; background: transparent; text-align: left; cursor: pointer; }
.bracket-team:hover:not(:disabled) { background: rgba(92,190,255,.07); }
.bracket-team:disabled { cursor: default; }
.bracket-rank { color: #65cfff; font-size: 9px; font-weight: 900; }

.team-profile-head { display: flex; align-items: center; gap: 16px; margin-bottom: 17px; }
.team-profile-head strong, .team-profile-head span { display: block; }
.team-profile-head span { margin-top: 4px; color: var(--muted); font-size: 11px; }
.team-stats-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; }
.team-stats-grid > div { padding: 13px 8px; border: 1px solid var(--line); border-radius: 13px; background: rgba(255,255,255,.025); text-align: center; }
.team-stats-grid strong, .team-stats-grid span { display: block; }
.team-stats-grid strong { font-family: "Space Grotesk",sans-serif; font-size: 20px; }
.team-stats-grid span { margin-top: 3px; color: var(--muted); font-size: 9px; text-transform: uppercase; }
.recent-games h3 { margin: 18px 0 8px; font-size: 13px; }
.recent-game-row { display: flex; justify-content: space-between; gap: 12px; padding: 10px; border-top: 1px solid var(--line); font-size: 11px; }
.recent-game-row.won span { color: var(--green); }
.recent-game-row.lost span { color: #ff9aaa; }
.small-empty { padding: 18px 12px; }
.confetti-canvas { position: fixed; z-index: 90; inset: 0; width: 100%; height: 100%; pointer-events: none; }

/* Team signup */
.signup-shell { min-height: 100dvh; }
.signup-main { width: min(1100px,calc(100% - 28px)); margin: 24px auto 50px; }
.signup-hero { display: grid; gap: 9px; padding: 30px; border-radius: 24px; }
.signup-hero h1 { margin: 0; font-family: "Space Grotesk",sans-serif; font-size: clamp(34px,6vw,58px); }
.signup-hero p { margin: 0; color: var(--muted); }
.signup-countdown { justify-self: start; margin-top: 8px; text-align: left; }
.signup-grid { display: grid; grid-template-columns: minmax(0,.85fr) minmax(340px,1.15fr); gap: 18px; margin-top: 18px; }
.signup-form, .registered-panel { padding: 24px; border-radius: 22px; }
.signup-form { display: grid; gap: 18px; align-content: start; }
.signup-form h2 { margin: 4px 0 0; }
.signup-tip { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.5; }
.signup-success { padding: 12px; border: 1px solid rgba(82,224,158,.3); border-radius: 12px; color: var(--green); background: rgba(82,224,158,.08); font-size: 12px; }
.signup-team-list { display: grid; gap: 8px; }
.signup-team-row { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; padding: 10px; border: 1px solid var(--line); border-radius: 13px; background: rgba(255,255,255,.025); }
.signup-team-row strong { font-size: 12px; }
.signup-team-row > span:last-child { color: var(--muted); font-size: 10px; }

/* Scoreboard team badge layout */
.team-profile-button { grid-template-columns: auto minmax(0,1fr); justify-content: center; column-gap: 12px; color: white; background: transparent; border: 0; cursor: pointer; }
.score-team-copy { min-width: 0; text-align: left; }
.score-team-copy strong { display: block; max-width: 100%; margin-top: 4px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-family: "Space Grotesk",sans-serif; font-size: clamp(20px,3.7vw,40px); line-height: 1; }

@media (max-width: 760px) {
  .rankings-panel { padding: 11px; }
  .ranking-item { min-width: 185px; }
  .signup-grid { grid-template-columns: 1fr; }
  .passcode-grid { grid-template-columns: 1fr; }
  .team-add-row { grid-template-columns: 1fr auto; }
  .team-add-row .button { grid-column: 1 / -1; }
  .admin-team-row { grid-template-columns: auto auto minmax(0,1fr) auto; }
  .admin-team-row .button-danger { grid-column: 3 / -1; }
  .team-stats-grid { grid-template-columns: 1fr 1fr; }
  .spread-actions { grid-template-columns: 1fr 1fr; }
  .spread-actions > span { display: none; }
}

/* 8.0.4: compact player menu, explicit Premium choices, and on-demand bag logging. */
.account-menu-trigger {
  position: relative;
  min-width: 42px;
  min-height: 42px;
  justify-content: center;
  padding: 4px;
  border: 1px solid rgba(126,194,235,.35);
  border-radius: 50%;
  background: rgba(24,73,108,.42);
  box-shadow: 0 7px 20px rgba(0,0,0,.25);
  cursor: pointer;
}
.account-menu-trigger:hover,.account-menu-trigger:focus-visible { border-color: #8fddff; transform: translateY(-1px); }
.account-menu-trigger > strong { position: absolute; right: -7px; bottom: -3px; }
.account-menu-dialog { width: min(480px,calc(100vw - 22px)); padding: 18px; color-scheme: dark; background: linear-gradient(155deg,#0c2032,#071521) !important; }
.account-menu-header { align-items: center; }
.account-menu-profile { display: flex; min-width: 0; align-items: center; gap: 12px; color: inherit; text-decoration: none; }
.account-menu-profile > img,.account-menu-profile > span:first-child { width: 52px; height: 52px; flex: 0 0 52px; display: grid; place-items: center; overflow: hidden; border-radius: 50%; object-fit: cover; color: #05131f; background: linear-gradient(145deg,#65d3ff,#54dfa4); font-weight: 950; }
.account-menu-profile > span:last-child { display: grid; min-width: 0; gap: 2px; }
.account-menu-profile small { color: #81a8c4; font-size: .62rem; font-weight: 900; letter-spacing: .1em; }
.account-menu-profile strong { overflow: hidden; color: #fff; text-overflow: ellipsis; white-space: nowrap; }
.account-menu-profile em { color: #91adbf; font-size: .72rem; font-style: normal; }
.account-menu-options { display: grid; gap: 8px; }
.account-menu-option { display: grid; grid-template-columns: 42px minmax(0,1fr); align-items: center; gap: 2px 11px; width: 100%; min-height: 66px; padding: 10px 12px; border: 1px solid rgba(128,181,219,.17); border-radius: 15px; color: #eaf7ff; background: rgba(69,119,157,.09); font: inherit; text-align: left; text-decoration: none; cursor: pointer; }
.account-menu-option:hover,.account-menu-option:focus-visible { border-color: rgba(102,210,255,.65); background: rgba(51,145,204,.16); }
.account-menu-option > span { grid-row: 1 / span 2; display: grid; width: 38px; height: 38px; place-items: center; border-radius: 12px; color: #06151f; background: linear-gradient(145deg,#70d6ff,#57e3a6); font-weight: 950; }
.account-menu-option > strong { align-self: end; }
.account-menu-option > small { align-self: start; color: #8eabc0; font-size: .68rem; line-height: 1.35; }
.account-menu-option.is-primary { border-color: rgba(87,220,159,.4); background: rgba(43,169,117,.14); }
.account-menu-premium > span { background: linear-gradient(145deg,#ffe18a,#ffb942); }
.account-menu-logout { color: #ffc2c2; }
.account-menu-logout > span { color: #fff; background: rgba(213,73,82,.7); }
.account-menu-status { min-height: 1.3em; margin: 10px 2px 0; color: #75e2b1; font-size: .75rem; }
.account-menu-status.is-error { color: #ff9b9b; }

.account-invite-card { display: grid; grid-template-columns: 52px minmax(0,1fr) auto; align-items: center; gap: 14px; margin-bottom: 18px; padding: 14px 16px; border: 1px solid rgba(87,220,159,.3); border-radius: 18px; background: linear-gradient(135deg,rgba(38,164,116,.14),rgba(34,115,176,.11)); }
.account-invite-card > div { display: grid; gap: 3px; min-width: 0; }
.account-invite-card p { margin: 0; color: #9eb8cb; }
.premium-account-card { scroll-margin-top: 20px; }
.premium-account-card .section-heading p { max-width: 760px; color: #cabf9f; line-height: 1.5; }
.premium-purchase-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.premium-purchase-actions .button { width: auto; margin: 0; }
.premium-billing-note { margin: 15px 0 0 !important; padding: 11px 13px; border-radius: 12px; color: #ffd2a0 !important; background: rgba(166,100,24,.15); }
.stats-bottom-tools { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 18px; }
.stats-bottom-tools h2,.stats-bottom-tools p { margin: 3px 0; }
.stats-bottom-tools p { color: #91abc0; }
.stats-bottom-tools .stats-export-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }

.feedback-dialog { color: var(--text); color-scheme: dark; background: linear-gradient(155deg,#0c2133,#071521) !important; }
.feedback-dialog .feedback-form,.feedback-dialog .field { background: transparent !important; }
.feedback-dialog input,.feedback-dialog textarea { color: var(--text) !important; background: rgba(3,14,25,.78) !important; }

.player-tracking-trigger { min-height: 47px; padding: 8px 12px; }
.player-tracking-trigger > span { font-size: 21px; }
.player-tracking-trigger > strong { font-size: 11px; }
.bag-tracking-setting { min-height: 45px; font-weight: 850; }
.bag-tracking-setting.premium-tracking-setting {
  display: grid;
  gap: 2px;
  min-height: 58px;
  padding: 8px 12px;
  border-color: rgba(255,204,87,.5);
  color: #201400;
  background: linear-gradient(145deg,#ffe28c,#f2b746);
  white-space: normal;
  line-height: 1.15;
}
.bag-tracking-setting.premium-tracking-setting > strong { font-size: .82rem; }
.bag-tracking-setting.premium-tracking-setting > small { font-size: .66rem; font-weight: 800; }

@media (max-width: 700px) {
  .account-invite-card,.stats-bottom-tools { grid-template-columns: 1fr; }
  .account-invite-card > .friend-avatar { width: 52px; }
  .account-invite-card .button,.stats-bottom-tools .stats-export-actions,.stats-bottom-tools .button { width: 100%; }
  .stats-bottom-tools .stats-export-actions { display: grid; grid-template-columns: 1fr; }
  .premium-purchase-actions { display: grid; grid-template-columns: 1fr; }
  .premium-purchase-actions .button { width: 100%; }
  .player-tracking-trigger { min-height: 42px; padding: 7px 9px; }
  .player-tracking-trigger > strong { font-size: 10px; }
}

@media (max-width: 760px), (hover: none) and (pointer: coarse) {
  .scoreboard-footer .finish-unavailable { display: none !important; }
}

/* 8.0.5: dedicated Premium Friends & Rankings, plan choices, and stable dark surfaces. */
.home-premium-options { min-width: 0; }
.home-plan-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin-top: 14px; }
.home-plan-option { display: grid; gap: 3px; min-width: 0; padding: 13px 14px; border: 1px solid rgba(122,190,231,.26); border-radius: 15px; background: rgba(5,19,32,.48); transition: transform .16s ease,border-color .16s ease,background .16s ease; }
.home-plan-option:hover,.home-plan-option:focus-visible { transform: translateY(-2px); border-color: #72d8ff; background: rgba(30,103,151,.2); }
.home-plan-option.featured { border-color: rgba(255,204,99,.45); background: linear-gradient(145deg,rgba(139,91,12,.27),rgba(5,20,33,.6)); }
.home-plan-option > span { color: #7fcff5; font-size: .61rem; font-weight: 950; letter-spacing: .12em; }
.home-plan-option.featured > span { color: #ffd36e; }
.home-plan-option > strong { overflow-wrap: anywhere; color: #fff !important; font-size: 1.02rem !important; }
.home-plan-option > small { color: #a8bdce; font-size: .68rem; }
.home-free-account-link { display: inline-flex; margin-top: 13px; color: #cfe8f9; font-size: .78rem; font-weight: 850; text-decoration: underline; text-underline-offset: 3px; }
.premium-purchase-actions .is-selected-plan { outline: 3px solid rgba(255,211,105,.34); border-color: #ffd269; }
.account-menu-friends > span { color: #07141e; background: linear-gradient(145deg,#7edcff,#72e4b1); }
.login-tracking-setting { border-color: rgba(99,204,255,.46); color: #dff5ff; background: rgba(34,111,163,.18); }

.friends-page,.friends-workspace { display: grid; gap: 18px; }
.friends-page-heading { justify-content: space-between; }
.friends-page-heading h1 { margin: 2px 0 5px; }
.friends-premium-lock { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(320px,.85fr); gap: 24px; align-items: center; padding: clamp(25px,5vw,48px); border-radius: 26px; background: radial-gradient(circle at 92% 5%,rgba(255,193,67,.16),transparent 30rem),linear-gradient(145deg,rgba(15,43,64,.97),rgba(40,30,11,.92)); }
.friends-premium-lock h2 { margin: 6px 0 8px; font-size: clamp(1.65rem,4vw,2.7rem); }
.friends-premium-lock p { max-width: 710px; margin: 0; color: #c5d6e4; line-height: 1.6; }
.friends-lock-plans { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.friends-lock-plan { display: grid; gap: 5px; min-height: 132px; align-content: center; padding: 17px; border: 1px solid rgba(133,192,229,.27); border-radius: 18px; background: rgba(4,18,30,.6); }
.friends-lock-plan:hover,.friends-lock-plan:focus-visible { border-color: #7bdcff; transform: translateY(-2px); }
.friends-lock-plan.featured { border-color: rgba(255,202,83,.48); background: rgba(119,78,9,.24); }
.friends-lock-plan span { color: #74d1fa; font-size: .64rem; font-weight: 950; letter-spacing: .12em; }
.friends-lock-plan.featured span { color: #ffd16a; }
.friends-lock-plan strong { font-size: 1.08rem; }
.friends-lock-plan small { color: #9fb6c8; }
.friend-rank-summary { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; }
.friend-rank-summary-card { display: grid; gap: 3px; min-width: 0; padding: 18px; border-radius: 18px; }
.friend-rank-summary-card > span { color: #8db1c9; font-size: .68rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.friend-rank-summary-card > strong { color: #fff; font-size: clamp(1.75rem,4vw,2.6rem); line-height: 1; }
.friend-rank-summary-card > small { overflow-wrap: anywhere; color: #88a4b9; }
.friend-leaderboard-card { overflow: hidden; padding: 0; background: radial-gradient(circle at 90% 0,rgba(75,218,158,.11),transparent 34rem),linear-gradient(145deg,rgba(13,36,55,.97),rgba(6,18,30,.93)); }
.friend-leaderboard-heading { display: grid; grid-template-columns: minmax(0,1fr) minmax(230px,.4fr); gap: 20px; align-items: end; padding: 23px 24px 16px; }
.friend-leaderboard-heading h2 { margin: 5px 0; }
.friend-leaderboard-heading p { margin: 0; color: #a8bfd1; line-height: 1.45; }
.friend-name-filter { display: grid; gap: 6px; color: #89a9c0; font-size: .65rem; font-weight: 900; letter-spacing: .08em; }
.friend-name-filter input { width: 100%; min-height: 43px; padding: 10px 12px; border: 1px solid rgba(128,184,221,.24); border-radius: 12px; outline: none; }
.friend-name-filter input:focus { border-color: #5dcbff; box-shadow: 0 0 0 3px rgba(55,168,255,.1); }
.friend-rank-modes { display: flex; gap: 7px; padding: 0 24px 15px; overflow-x: auto; scrollbar-width: thin; }
.friend-rank-modes button { flex: 0 0 auto; min-height: 38px; padding: 0 14px; border: 1px solid rgba(125,180,216,.2); border-radius: 999px; color: #a9c2d5; background: rgba(68,116,151,.1); font: inherit; font-size: .74rem; font-weight: 850; cursor: pointer; }
.friend-rank-modes button.active { border-color: rgba(77,223,160,.53); color: #eafff5; background: rgba(42,175,118,.2); }
.friend-table-tools { display: flex; justify-content: space-between; align-items: center; gap: 15px; min-height: 49px; padding: 9px 24px; border-top: 1px solid rgba(136,183,216,.12); border-bottom: 1px solid rgba(136,183,216,.12); background: rgba(3,13,23,.32); }
.friend-table-tools > p { margin: 0; color: #95afc2; font-size: .72rem; line-height: 1.4; }
.friend-column-picker { position: relative; flex: 0 0 auto; }
.friend-column-picker summary { list-style: none; padding: 8px 11px; border: 1px solid rgba(121,184,222,.24); border-radius: 11px; color: #d7ecf9; font-size: .72rem; font-weight: 850; cursor: pointer; }
.friend-column-picker summary::-webkit-details-marker { display: none; }
.friend-column-options { position: absolute; z-index: 20; top: calc(100% + 8px); right: 0; display: grid; grid-template-columns: repeat(2,minmax(130px,1fr)); gap: 7px; width: min(350px,calc(100vw - 28px)); padding: 13px; border: 1px solid rgba(108,196,242,.35); border-radius: 15px; background: #0b2031; box-shadow: 0 20px 50px rgba(0,0,0,.45); }
.friend-column-options label { display: flex; align-items: center; gap: 8px; min-height: 36px; padding: 6px 8px; border-radius: 9px; color: #c7dcea; background: rgba(94,148,183,.08); font-size: .72rem; cursor: pointer; }
.friend-column-options input { width: 18px; height: 18px; accent-color: #52dda0; }
.friend-rank-table-wrap { max-width: 100%; overflow: auto; overscroll-behavior-x: contain; scrollbar-color: #42789c #071522; }
.friend-rank-table { width: 100%; min-width: 820px; border-collapse: separate; border-spacing: 0; font-variant-numeric: tabular-nums; }
.friend-rank-table th,.friend-rank-table td { height: 62px; padding: 9px 13px; border-bottom: 1px solid rgba(129,178,211,.11); text-align: right; white-space: nowrap; }
.friend-rank-table th { position: sticky; z-index: 4; top: 0; height: 43px; color: #7699b1; background: #091a29; font-size: .65rem; text-transform: uppercase; letter-spacing: .05em; }
.friend-rank-table th button { border: 0; padding: 5px; color: inherit; background: transparent; font: inherit; font-weight: 900; letter-spacing: inherit; text-transform: inherit; cursor: pointer; }
.friend-rank-table th button.active { color: #7cdbff; }
.friend-rank-table th button[data-direction="asc"]::after { content: "↑"; margin-left: 4px; color: #70e3ab; }
.friend-rank-table th button[data-direction="desc"]::after { content: "↓"; margin-left: 4px; color: #70e3ab; }
.friend-rank-table td { color: #d5e6f2; font-size: .79rem; font-weight: 760; background: rgba(7,23,37,.82); }
.friend-rank-table tbody tr:hover td { background: rgba(21,54,77,.94); }
.friend-rank-table tbody tr.is-me td { background: rgba(18,65,54,.92); box-shadow: inset 0 1px rgba(79,225,163,.12); }
.friend-rank-table th:first-child,.friend-rank-table td:first-child { position: sticky; z-index: 6; left: 0; width: 62px; min-width: 62px; text-align: center; }
.friend-rank-table th:nth-child(2),.friend-rank-table td:nth-child(2) { position: sticky; z-index: 5; left: 62px; min-width: 210px; text-align: left; box-shadow: 8px 0 14px rgba(0,0,0,.14); }
.friend-rank-table th:first-child,.friend-rank-table th:nth-child(2) { z-index: 8; background: #0b2030; }
.friend-rank-position { color: #7fdcff !important; font-size: 1.05rem !important; font-weight: 950 !important; }
.friend-rank-player { display: flex; align-items: center; gap: 10px; }
.friend-rank-avatar { display: grid; width: 42px; height: 42px; flex: 0 0 42px; place-items: center; overflow: hidden; border-radius: 50%; color: #06131d; background: linear-gradient(145deg,#6fd8ff,#59e1a5); font-weight: 950; }
.friend-rank-avatar img { width: 100%; height: 100%; object-fit: cover; }
.friend-rank-player > span { display: grid; min-width: 0; gap: 2px; }
.friend-rank-player strong { max-width: 180px; overflow: hidden; color: #fff; text-overflow: ellipsis; }
.friend-rank-player small { color: #88a7bb; font-size: .63rem; font-weight: 700; }
.friend-table-compare { border: 1px solid rgba(91,206,255,.35); border-radius: 9px; padding: 7px 10px; color: #aee4ff; background: rgba(39,133,190,.15); font: inherit; font-size: .69rem; font-weight: 900; cursor: pointer; }
.friends-connect-actions { display: grid; gap: 8px; }
.friends-connect-actions > .button { justify-self: end; }
.friends-page .friend-comparison { margin-top: 0; scroll-margin-top: 84px; }
.friends-page .friend-comparison h2 { margin: 4px 0 0; }

@media (max-width: 900px) {
  .friend-rank-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .friends-premium-lock,.friend-leaderboard-heading { grid-template-columns: 1fr; }
  .friend-name-filter { max-width: none; }
}
@media (max-width: 620px) {
  .home-membership-panel { gap: 19px; }
  .home-plan-grid,.friends-lock-plans { grid-template-columns: 1fr; }
  .home-membership-panel > div:last-child { padding-left: 0; border-left: 0; border-top: 1px solid rgba(255,205,105,.25); padding-top: 18px; }
  .friends-page-heading { display: grid; grid-template-columns: 1fr; }
  .friends-page-heading > .button { width: 100%; }
  .friends-premium-lock { padding: 23px 18px; }
  .friend-rank-summary { gap: 8px; }
  .friend-rank-summary-card { padding: 14px; }
  .friend-leaderboard-heading { padding: 19px 15px 13px; }
  .friend-rank-modes { padding: 0 15px 13px; }
  .friend-table-tools { align-items: stretch; flex-direction: column; padding: 11px 15px; }
  .friend-column-picker summary { text-align: center; }
  .friend-column-options { position: fixed; top: auto; right: 9px; bottom: max(9px,env(safe-area-inset-bottom)); left: 9px; grid-template-columns: repeat(2,minmax(0,1fr)); width: auto; max-height: 58dvh; overflow-y: auto; }
  .friend-rank-table { min-width: 760px; }
  .friend-rank-table th,.friend-rank-table td { padding-inline: 9px; }
  .friend-rank-table th:first-child,.friend-rank-table td:first-child { width: 49px; min-width: 49px; }
  .friend-rank-table th:nth-child(2),.friend-rank-table td:nth-child(2) { left: 49px; min-width: 175px; }
  .friend-rank-player strong { max-width: 125px; }
  .friends-connect-actions > .button { width: 100%; justify-self: stretch; }
}

/* On a phone in landscape, the scores use the entire screen instead of being compressed by the header. */
@media (orientation: landscape) and (max-height: 620px) {
  .scoreboard-shell { overflow: hidden; }
  .scoreboard-header {
    position: fixed;
    z-index: 40;
    inset: 0;
    min-height: 0;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
    pointer-events: none;
  }
  .scoreboard-header > .back-button, .scoreboard-event, .connection-badge, #shareGameBtn, #fullscreenBtn { display: none !important; }
  .scoreboard-header-actions { position: fixed; top: max(6px,env(safe-area-inset-top)); right: max(7px,env(safe-area-inset-right)); pointer-events: auto; }
  .scoreboard-header-actions #menuBtn { display: grid; width: 36px; height: 36px; background: rgba(5,14,24,.5); backdrop-filter: blur(8px); }
  .scoreboard-main { height: 100dvh; grid-template-rows: 1fr; padding: max(5px,env(safe-area-inset-top)) max(5px,env(safe-area-inset-right)) max(5px,env(safe-area-inset-bottom)) max(5px,env(safe-area-inset-left)); gap: 0; }
  .game-state-banner { display: none; }
  .score-grid { height: 100%; gap: 6px; }
  .score-card { border-radius: 15px; }
  .score-team { min-height: 42px; padding: 4px 8px; }
  .team-avatar-score { width: 35px; height: 35px; }
  .score-team-copy strong { font-size: clamp(15px,4.3vh,23px); }
  .score-number { font-size: clamp(100px,42vh,230px); }
  .score-add-zone small { display: none; }
  .score-step { min-height: 37px; font-size: 17px; }
  .scoreboard-footer { position: fixed; z-index: 35; top: max(6px,env(safe-area-inset-top)); left: 50%; width: auto; padding: 0; border: 0; background: transparent; box-shadow: none; transform: translateX(-50%); backdrop-filter: none; }
  .scoreboard-footer .scoreboard-rule, .scoreboard-footer #editScoreBtn { display: none; }
  .scoreboard-footer #finalizeBtn.finish-unavailable { display: none !important; }
  .scoreboard-footer #finalizeBtn { min-height: 36px; padding: 0 13px; border: 1px solid rgba(255,255,255,.25); box-shadow: 0 5px 20px rgba(0,0,0,.25); font-size: 10px; }
}

/* Home: tournament brackets and reusable casual scoreboards */
.topbar-actions, .hero-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.welcome-view { grid-template-rows: auto auto; }
.hero-panel { grid-row: 1 / span 2; }
.tournament-library { min-height: 292px; }
.quick-library { min-height: 292px; }
.quick-list-record { color: #ffd47b; font-family: "Space Grotesk", sans-serif; font-size: 18px; }
.one-column-grid { grid-template-columns: 1fr; }
.dialog-copy { color: var(--muted); line-height: 1.55; }

/* Just Play shared scoreboard */
.quick-play-shell .scoreboard-main { grid-template-rows: auto auto 1fr auto; }
.quick-record {
  display: grid;
  grid-template-columns: minmax(120px,1fr) minmax(190px,1.3fr) minmax(120px,1fr);
  align-items: stretch;
  min-height: 68px;
  overflow: hidden;
  border-radius: 17px;
}
.quick-record-side, .quick-record-center { display: grid; align-content: center; justify-items: center; padding: 8px 14px; }
.quick-record-side { grid-template-columns: auto auto; column-gap: 8px; }
.quick-record-side strong { grid-row: 1 / span 2; font-family: "Space Grotesk",sans-serif; font-size: 32px; line-height: 1; }
.quick-record-side span { align-self: end; color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.quick-record-side small { align-self: start; color: #c7d5e3; font-size: 10px; }
.quick-record-blue { background: linear-gradient(90deg,rgba(55,168,255,.15),transparent); }
.quick-record-gold { background: linear-gradient(270deg,rgba(255,189,60,.15),transparent); }
.quick-record-blue strong { color: #65cfff; }
.quick-record-gold strong { color: #ffd47b; }
.quick-record-center { border: 0; border-inline: 1px solid var(--line); color: var(--text); background: rgba(255,255,255,.018); }
.quick-record-center span, .quick-record-center small { color: var(--muted); font-size: 9px; font-weight: 750; letter-spacing: .09em; text-transform: uppercase; }
.quick-record-center strong { margin: 1px 0; font-family: "Space Grotesk",sans-serif; font-size: 24px; }
.quick-history-button { cursor: pointer; transition: background .18s ease, box-shadow .18s ease; touch-action: manipulation; }
.quick-history-button:hover, .quick-history-button:focus-visible { outline: 0; background: rgba(85,190,255,.11); box-shadow: inset 0 0 0 1px rgba(101,207,255,.22); }
.quick-history-button:active { background: rgba(85,190,255,.17); }
.quick-history-fallback { display: none; }
.player-photo-picker { margin-bottom: 18px; }
.player-photo-picker > span:last-of-type { display: grid; gap: 4px; }
.player-photo-picker small { color: var(--muted); font-size: 10px; }
.quick-settings-actions { display: grid; gap: 8px; margin-top: 16px; }
.quick-history { display: grid; gap: 8px; max-height: min(62vh,520px); overflow-y: auto; }
.quick-history-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 13px; border: 1px solid var(--line); border-radius: 13px; background: rgba(255,255,255,.025); }
.quick-history-row span { display: grid; gap: 3px; }
.quick-history-row small { color: var(--muted); }
.quick-history-row b { font-family: "Space Grotesk",sans-serif; font-size: 22px; }

@media (max-width: 900px) {
  .welcome-view { grid-template-columns: 1fr; grid-template-rows: auto; }
  .hero-panel { grid-row: auto; min-height: 490px; }
  .tournament-library, .quick-library { min-height: 0; }
}

@media (max-width: 620px) {
  .topbar-actions .button-secondary { display: none; }
  .hero-actions { width: 100%; }
  .hero-actions .button { width: 100%; }
  .quick-record { min-height: 56px; grid-template-columns: 1fr 1.15fr 1fr; }
  .quick-record-side { padding: 5px 6px; column-gap: 5px; }
  .quick-record-side strong { font-size: 24px; }
  .quick-record-side span, .quick-record-side small, .quick-record-center span, .quick-record-center small { font-size: 7px; }
  .quick-record-center { padding: 5px; }
  .quick-record-center strong { font-size: 18px; }
}

@media (orientation: landscape) and (max-height: 620px) {
  .quick-play-shell .quick-record { display: none; }
  .quick-play-shell .scoreboard-header > .back-button,
  .quick-play-shell .scoreboard-event,
  .quick-play-shell .connection-badge,
  .quick-play-shell #shareBtn,
  .quick-play-shell #fullscreenBtn { display: none !important; }
  .quick-play-shell .scoreboard-header-actions #settingsBtn { display: grid; width: 36px; height: 36px; background: rgba(5,14,24,.5); backdrop-filter: blur(8px); }
  .quick-play-shell .scoreboard-footer .scoreboard-rule { display: none; }
  .quick-play-shell .scoreboard-footer .quick-history-fallback { display: inline-flex; }
  .quick-play-shell .scoreboard-footer #finishBtn.finish-unavailable { display: none !important; }
  .quick-play-shell .scoreboard-footer #finishBtn { min-height: 36px; padding: 0 13px; border: 1px solid rgba(255,255,255,.25); box-shadow: 0 5px 20px rgba(0,0,0,.25); font-size: 10px; }
}

/* Archive and room lifecycle controls */
.archive-library {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,.09);
}
.archive-toggle {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 10px;
  align-items: center;
  padding: 12px 14px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 14px;
  background: rgba(255,255,255,.045);
  color: inherit;
  cursor: pointer;
  text-align: left;
}
.archive-toggle strong {
  min-width: 28px;
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.09);
  text-align: center;
}
.archive-toggle em { color: var(--muted, #9aa9bb); font-style: normal; font-size: .82rem; }
.archived-tournament-list { margin-top: 10px; }
.archived-item { opacity: .82; border-style: dashed; }
.archive-pill, .complete-pill {
  border-radius: 999px;
  padding: 4px 9px;
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .02em;
}
.archive-pill { background: rgba(154,169,187,.14); color: #c6d0dc; }
.complete-pill { background: rgba(47,220,150,.13); color: #7ff0bd; }
.destructive-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.end-play-button { margin-top: 4px; }
.end-play-note { margin: 10px 0 0; color: var(--muted, #9aa9bb); font-size: .82rem; line-height: 1.45; }
@media (max-width: 620px) {
  .destructive-actions { width: 100%; }
  .destructive-actions .button { flex: 1 1 150px; }
}
.archive-auto-note { margin: 14px 2px 0; color: var(--muted, #9aa9bb); font-size: .79rem; }


/* Scoreboard reliability fixes: dynamic fullscreen height, always-accessible sharing, and immediate finish-button repaint. */
:root { --scoreboard-height: 100dvh; }
.scoreboard-shell .scoreboard-main { height: calc(var(--scoreboard-height) - 86px); }
.scoreboard-footer .finish-ready { animation: finish-ready-pop .22s ease-out; }
@keyframes finish-ready-pop { from { transform: scale(.92); opacity: .45; } to { transform: scale(1); opacity: 1; } }

@media (max-width: 760px), (hover: none) and (pointer: coarse) {
  .scoreboard-shell .scoreboard-main { height: calc(var(--scoreboard-height) - 69px); }
  .scoreboard-header .scoreboard-share-button {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 39px;
    min-width: 39px;
    height: 39px;
    min-height: 39px;
    padding: 0;
    border-radius: 12px;
    font-size: 0;
  }
  .scoreboard-header .scoreboard-share-button::before {
    content: "↗";
    font-size: 21px;
    line-height: 1;
    font-weight: 900;
  }
}

@media (orientation: landscape) and (max-height: 620px) {
  .scoreboard-shell .scoreboard-main { height: var(--scoreboard-height); }
  .scoreboard-header-actions { gap: 5px; }
  .scoreboard-header .scoreboard-share-button { display: inline-flex !important; background: rgba(5,14,24,.5); backdrop-filter: blur(8px); }
  .scoreboard-header > .back-button, .scoreboard-event, .connection-badge, #fullscreenBtn { display: none !important; }
  .quick-play-shell .scoreboard-header > .back-button,
  .quick-play-shell .scoreboard-event,
  .quick-play-shell .connection-badge,
  .quick-play-shell #fullscreenBtn { display: none !important; }
}

@media (orientation: landscape) and (max-height: 620px) {
  #shareGameBtn,
  #shareBtn { display: inline-flex !important; }
}


/* Mobile scoreboard polish: guaranteed sharing, centered finish action, and in-app result confirmation. */
.mobile-scoreboard-share { display: none; }

.confirm-dialog {
  width: min(430px, calc(100% - 28px));
  overflow: hidden;
  padding: 28px;
  text-align: center;
  background:
    radial-gradient(circle at 50% 0%, rgba(82,224,158,.18), transparent 42%),
    linear-gradient(160deg, rgba(17,39,61,.98), rgba(5,17,30,.98));
}
.confirm-dialog h2 { margin: 7px 0 9px; font-family: "Space Grotesk", sans-serif; font-size: clamp(27px, 7vw, 36px); }
.confirm-symbol {
  display: grid;
  width: 68px;
  height: 68px;
  margin: 0 auto 15px;
  place-items: center;
  border: 1px solid rgba(82,224,158,.42);
  border-radius: 22px;
  color: #baffda;
  background: linear-gradient(145deg, rgba(82,224,158,.24), rgba(82,224,158,.08));
  box-shadow: 0 14px 34px rgba(25,189,111,.17), inset 0 1px rgba(255,255,255,.16);
  font-family: "Space Grotesk", sans-serif;
  font-size: 34px;
  font-weight: 900;
}
.confirm-message { max-width: 340px; margin: 0 auto; color: var(--muted); font-size: 12px; line-height: 1.55; }
.confirm-matchup {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 20px;
  padding: 14px 16px;
  border: 1px solid rgba(82,224,158,.22);
  border-radius: 16px;
  background: rgba(82,224,158,.07);
  text-align: left;
}
.confirm-matchup strong { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 14px; }
.confirm-matchup span { flex: 0 0 auto; color: #baffda; font-family: "Space Grotesk", sans-serif; font-size: 25px; font-weight: 900; }
.confirm-actions { display: grid; grid-template-columns: 1fr 1fr; }
.confirm-actions .button { min-height: 50px; }

@media (max-width: 760px), (hover: none) and (pointer: coarse) {
  /* The separate floating control avoids mobile browsers hiding header buttons. */
  .scoreboard-header .scoreboard-share-button { display: none !important; }
  .mobile-scoreboard-share {
    position: fixed;
    z-index: 65;
    top: max(8px, env(safe-area-inset-top));
    right: max(54px, calc(env(safe-area-inset-right) + 54px));
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 39px;
    padding: 0 13px;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 12px;
    color: #fff;
    background: rgba(5,14,24,.76);
    box-shadow: 0 8px 28px rgba(0,0,0,.28);
    backdrop-filter: blur(10px);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: .02em;
    cursor: pointer;
    touch-action: manipulation;
  }
  .mobile-share-icon { font-size: 20px; line-height: 1; }

  /* Finish is a centered overlay in both portrait and landscape. */
  .scoreboard-shell .scoreboard-footer {
    position: fixed !important;
    z-index: 60 !important;
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;
    display: block !important;
    width: auto !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: translate(-50%, -50%) !important;
    backdrop-filter: none !important;
    pointer-events: none;
  }
  .scoreboard-shell .scoreboard-footer > :not(#finalizeBtn):not(#finishBtn) { display: none !important; }
  .scoreboard-shell .scoreboard-footer #finalizeBtn,
  .scoreboard-shell .scoreboard-footer #finishBtn {
    min-width: min(72vw, 290px);
    min-height: 58px;
    padding: 0 24px;
    border: 1px solid rgba(198,255,224,.48);
    border-radius: 18px;
    background: linear-gradient(145deg, #36d68c, #168757);
    color: #03160d;
    box-shadow: 0 18px 55px rgba(0,0,0,.5), 0 0 0 5px rgba(82,224,158,.12);
    font-family: "Space Grotesk", sans-serif;
    font-size: 16px;
    font-weight: 900;
    letter-spacing: .02em;
    pointer-events: auto;
  }
  .scoreboard-shell .scoreboard-footer #finalizeBtn:disabled,
  .scoreboard-shell .scoreboard-footer #finishBtn:disabled { opacity: .7; }
  .scoreboard-shell .scoreboard-footer #finalizeBtn.finish-unavailable,
  .scoreboard-shell .scoreboard-footer #finishBtn.finish-unavailable { display: none !important; }

  .confirm-dialog { padding: 24px 19px 19px; }
  .confirm-actions { grid-template-columns: 1fr; }
  .confirm-actions #confirmAcceptBtn { grid-row: 1; }
  .confirm-actions #confirmCancelBtn { grid-row: 2; }
}

@media (orientation: landscape) and (max-height: 620px) {
  .mobile-scoreboard-share {
    top: max(7px, env(safe-area-inset-top));
    right: max(52px, calc(env(safe-area-inset-right) + 52px));
  }
  .scoreboard-shell .scoreboard-footer #finalizeBtn,
  .scoreboard-shell .scoreboard-footer #finishBtn {
    min-width: 220px;
    min-height: 49px;
    font-size: 14px;
  }
  .confirm-dialog { max-height: calc(100dvh - 18px); padding: 18px; }
  .confirm-symbol { width: 48px; height: 48px; margin-bottom: 8px; border-radius: 16px; font-size: 24px; }
  .confirm-dialog h2 { margin: 4px 0 6px; font-size: 25px; }
  .confirm-matchup { margin-top: 11px; padding: 10px 13px; }
  .confirm-actions { grid-template-columns: 1fr 1fr; margin-top: 12px; }
  .confirm-actions #confirmAcceptBtn, .confirm-actions #confirmCancelBtn { grid-row: auto; }
  .confirm-actions .button { min-height: 42px; }
}

/* Explicit short-landscape fallback for browsers that do not report coarse pointer media features. */
@media (orientation: landscape) and (max-height: 620px) {
  .mobile-scoreboard-share { display: inline-flex !important; }
  .scoreboard-shell .scoreboard-footer {
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;
    display: block !important;
    width: auto !important;
    transform: translate(-50%, -50%) !important;
    pointer-events: none;
  }
  .scoreboard-shell .scoreboard-footer > :not(#finalizeBtn):not(#finishBtn) { display: none !important; }
  .scoreboard-shell .scoreboard-footer #finalizeBtn,
  .scoreboard-shell .scoreboard-footer #finishBtn { pointer-events: auto; }
}

@media (orientation: landscape) and (max-height: 620px) {
  .mobile-scoreboard-share {
    position: fixed;
    z-index: 65;
    top: max(7px, env(safe-area-inset-top));
    right: max(52px, calc(env(safe-area-inset-right) + 52px));
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 39px;
    padding: 0 13px;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 12px;
    color: #fff;
    background: rgba(5,14,24,.76);
    box-shadow: 0 8px 28px rgba(0,0,0,.28);
    backdrop-filter: blur(10px);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: .02em;
    cursor: pointer;
    touch-action: manipulation;
  }
}


/* Mobile sharing refinement: keep Share in the reserved header action area so it never covers game text. */
@media (max-width: 760px), (hover: none) and (pointer: coarse) {
  .mobile-scoreboard-share { display: none !important; }
  .scoreboard-header .scoreboard-share-button {
    display: inline-grid !important;
    width: 36px;
    min-width: 36px;
    height: 36px;
    min-height: 36px;
    padding: 0;
    place-items: center;
    border-radius: 11px;
    font-size: 0;
    background: rgba(5,14,24,.48);
    backdrop-filter: blur(8px);
  }
  .scoreboard-header .scoreboard-share-button::before {
    content: "↗";
    font-size: 20px;
    line-height: 1;
    font-weight: 900;
  }
  .scoreboard-header-actions { flex: 0 0 auto; gap: 6px; }
}

/* Short landscape keeps Share beside the existing menu button instead of floating over a team name. */
@media (orientation: landscape) and (max-height: 620px) {
  .mobile-scoreboard-share { display: none !important; }
  .scoreboard-header-actions #shareGameBtn,
  .quick-play-shell .scoreboard-header-actions #shareBtn {
    display: inline-grid !important;
    width: 36px;
    min-width: 36px;
    height: 36px;
    min-height: 36px;
    padding: 0;
    place-items: center;
    border-radius: 11px;
    font-size: 0;
    background: rgba(5,14,24,.52);
    backdrop-filter: blur(8px);
  }
  .scoreboard-header-actions #shareGameBtn::before,
  .quick-play-shell .scoreboard-header-actions #shareBtn::before {
    content: "↗";
    font-size: 20px;
    line-height: 1;
    font-weight: 900;
  }
}

@media (orientation: landscape) and (max-height: 620px) {
  /* Reserve room inside the right team header for Share + Settings. */
  .score-grid > .score-card:nth-child(2) .score-team { padding-right: 88px; }
}


/* 4.3 roster and signup controls */
.roster-tools { display:flex; gap:10px; flex-wrap:wrap; margin:12px 0; }
.solo-player-pool { margin:10px 0 14px; padding:12px; border:1px solid rgba(77,220,154,.25); border-radius:14px; background:rgba(77,220,154,.06); }
.solo-player-pool:empty { display:none; }
.solo-player-chips { display:flex; flex-wrap:wrap; gap:8px; margin-top:9px; }
.solo-player-chip { display:inline-flex; align-items:center; gap:7px; padding:6px 9px 6px 6px; border:1px solid var(--line); border-radius:999px; background:rgba(255,255,255,.04); }
.team-avatar-small { width:28px; height:28px; font-size:10px; }
.team-member-names { color:var(--muted); }
.signup-type-toggle { display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:5px; border:1px solid var(--line); border-radius:14px; background:rgba(3,11,20,.45); }
.signup-type-button { border:0; border-radius:10px; padding:11px 12px; color:var(--muted); background:transparent; font:inherit; font-weight:800; cursor:pointer; }
.signup-type-button.active { color:#06140e; background:linear-gradient(135deg,#61e6a6,#b7ffda); box-shadow:0 8px 24px rgba(70,224,158,.2); }
.signup-type-button:disabled { opacity:.45; cursor:not-allowed; }
.solo-pool-section { margin-top:20px; padding-top:18px; border-top:1px solid var(--line); }
.signup-team-row > span:nth-child(2) { display:flex; flex-direction:column; min-width:0; }
.signup-team-row small { color:var(--muted); margin-top:2px; }
@media (max-width: 700px) {
  .roster-tools .button { flex:1 1 100%; }
  #addTeamEventBtn { order:-1; }
}

.solo-chip-remove { width:24px; height:24px; border:0; border-radius:50%; color:var(--muted); background:rgba(255,255,255,.07); cursor:pointer; font-size:17px; line-height:1; }
.solo-chip-remove:hover { color:#fff; background:rgba(255,91,112,.22); }
.solo-chip-remove:disabled { opacity:.35; cursor:not-allowed; }

/* 4.4 signup permissions and creator-only player names */
.team-add-row { grid-template-columns: minmax(160px,1.15fr) minmax(145px,1fr) minmax(145px,1fr) auto auto; }
.admin-team-private-row { align-items: start; }
.admin-team-private-fields { display:grid; grid-template-columns:minmax(150px,1.2fr) minmax(135px,1fr) minmax(135px,1fr); gap:8px; min-width:0; }
.admin-team-private-fields input { width:100%; }
.admin-team-private-row { grid-template-columns:auto auto minmax(0,1fr) minmax(160px,auto); }
.admin-row-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:7px; max-width:310px; }
.admin-photo-button { position:relative; cursor:pointer; }
.admin-photo-button input { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.admin-roster-note { margin:5px 0 10px; color:var(--muted); font-size:10px; line-height:1.5; }
.admin-solo-list { display:grid; gap:8px; margin-top:8px; }
.admin-solo-row { display:grid; grid-template-columns:auto minmax(150px,1fr) minmax(190px,auto); align-items:center; gap:9px; padding:8px; border:1px solid var(--line); border-radius:12px; background:rgba(255,255,255,.025); }
.admin-solo-copy { display:grid; gap:4px; min-width:0; }
.admin-solo-copy input { min-width:0; width:100%; border:1px solid var(--line); border-radius:10px; color:var(--text); background:rgba(3,11,20,.65); padding:8px 10px; }
.admin-solo-copy small { color:var(--muted); font-size:9px; line-height:1.35; }
.team-real-name-fields { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.team-real-name-fields .private-name-note { grid-column:1 / -1; margin:-3px 0 0; padding:10px 12px; border:1px solid rgba(79,186,255,.2); border-radius:12px; color:var(--muted); background:rgba(79,186,255,.055); font-size:10px; line-height:1.45; }

@media (max-width: 900px) {
  .team-add-row { grid-template-columns:1fr 1fr; }
  .team-add-row > input:first-child { grid-column:1 / -1; }
  .team-add-row .button { grid-column:auto; }
  .admin-team-private-row { grid-template-columns:auto auto minmax(0,1fr); }
  .admin-team-private-fields { grid-column:3; grid-template-columns:1fr; }
  .admin-team-private-row .admin-row-actions { grid-column:2 / -1; justify-content:flex-start; max-width:none; }
  .admin-solo-row { grid-template-columns:auto minmax(0,1fr); }
  .admin-solo-row .admin-row-actions { grid-column:2; justify-content:flex-start; max-width:none; }
}

@media (max-width: 620px) {
  .team-add-row { grid-template-columns:1fr; }
  .team-add-row > input:first-child,
  .team-add-row .button { grid-column:1; }
  .team-real-name-fields { grid-template-columns:1fr; }
  .team-real-name-fields .private-name-note { grid-column:1; }
  .admin-team-private-row { grid-template-columns:auto minmax(0,1fr); }
  .admin-team-private-row .seed-chip { align-self:center; }
  .admin-team-private-fields { grid-column:1 / -1; }
  .admin-team-private-row .admin-row-actions { grid-column:1 / -1; }
  .admin-solo-row { grid-template-columns:auto minmax(0,1fr); align-items:start; }
  .admin-solo-row .admin-row-actions { grid-column:1 / -1; }
  .admin-row-actions .button { flex:1 1 120px; }
}

/* 4.5 synchronized bag colors, local side swapping, and next-throw marker */
.score-card {
  --bag-color: #168be0;
  --bag-light: rgb(101, 180, 235);
  --bag-dark: rgb(12, 75, 121);
  --score-ink: #fff;
  color: var(--score-ink);
  background:
    radial-gradient(circle at 50% 16%, var(--bag-light), transparent 42%),
    linear-gradient(155deg, var(--bag-color), var(--bag-dark) 72%);
}
.score-card-blue { --bag-color: #168be0; }
.score-card-gold { --bag-color: #d9820d; }
.score-card .score-team,
.score-card .team-profile-button,
.score-card .score-add-zone,
.score-card .score-step { color: inherit; }
.score-card .score-step { border-color: color-mix(in srgb, currentColor 20%, transparent); }
.score-card::after { mix-blend-mode: soft-light; }

.bag-color-picker {
  position: absolute;
  z-index: 8;
  top: 10px;
  right: 10px;
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  overflow: hidden;
  border: 2px solid color-mix(in srgb, currentColor 72%, transparent);
  border-radius: 50%;
  background: rgba(4, 12, 20, .35);
  box-shadow: 0 5px 18px rgba(0,0,0,.28), inset 0 1px rgba(255,255,255,.25);
  cursor: pointer;
  backdrop-filter: blur(7px);
}
.bag-color-picker::after {
  content: "";
  position: absolute;
  inset: 6px;
  border: 2px solid rgba(255,255,255,.72);
  border-radius: 50%;
  pointer-events: none;
}
.bag-color-swatch { width: 100%; height: 100%; background: var(--bag-color); }
.bag-color-picker input[type="color"] {
  position: absolute;
  inset: -10px;
  width: calc(100% + 20px);
  height: calc(100% + 20px);
  margin: 0;
  padding: 0;
  border: 0;
  opacity: 0;
  cursor: pointer;
}

.throw-first-badge {
  position: absolute;
  z-index: 8;
  top: 10px;
  left: 10px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 0 10px 0 7px;
  border: 1px solid rgba(216,255,233,.74);
  border-radius: 999px;
  color: #062015;
  background: linear-gradient(145deg, #baffda, #55e6a0);
  box-shadow: 0 8px 24px rgba(0,0,0,.28), 0 0 0 4px rgba(82,224,158,.14);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .035em;
  text-transform: uppercase;
  pointer-events: none;
}
.throw-first-badge[hidden] { display: none !important; }
.throw-first-badge span {
  display: grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border-radius: 50%;
  color: #dffff0;
  background: #087246;
  font-size: 14px;
}
.score-card.throws-first:not(.winner) {
  box-shadow: 0 0 0 3px rgba(186,255,218,.86), 0 26px 64px rgba(0,0,0,.36), inset 0 1px rgba(255,255,255,.2);
}
.score-card .score-team { padding-left: 58px; padding-right: 58px; }

.score-grid.swapped > [data-slot="1"] { order: 2; }
.score-grid.swapped > [data-slot="2"] { order: 1; }
.quick-record.swapped .quick-record-blue { order: 3; }
.quick-record.swapped .quick-record-center { order: 2; }
.quick-record.swapped .quick-record-gold { order: 1; }
.swap-sides-button.active {
  color: #07150e;
  background: linear-gradient(145deg, #baffda, #55e6a0);
  border-color: rgba(216,255,233,.7);
}

@media (max-width: 620px) {
  .bag-color-picker { top: 7px; right: 7px; width: 33px; height: 33px; }
  .bag-color-picker::after { inset: 5px; }
  .throw-first-badge { top: 7px; left: 7px; min-height: 30px; padding-right: 8px; font-size: 8px; }
  .throw-first-badge span { width: 19px; height: 19px; font-size: 12px; }
  .score-card .score-team { padding-left: 46px; padding-right: 46px; }
}

@media (orientation: landscape) and (max-height: 620px) {
  .bag-color-picker { top: 5px; right: 5px; width: 30px; height: 30px; }
  .throw-first-badge { top: 5px; left: 5px; width: 29px; min-height: 29px; padding: 0; justify-content: center; }
  .throw-first-badge b { display: none; }
  .throw-first-badge span { width: 21px; height: 21px; }
  .score-card .score-team { padding-left: 39px; padding-right: 39px; }
  .score-grid > .score-card:nth-child(2) .score-team,
  .score-grid.swapped > .score-card:nth-child(1) .score-team { padding-right: 132px; }
}

/* Keep the next-throw marker below the team-name header in portrait layouts. */
.throw-first-badge { top: 84px; }
@media (max-width: 620px) {
  .throw-first-badge { top: 68px; }
}
@media (orientation: landscape) and (max-height: 620px) {
  .throw-first-badge { top: 5px; }
}
@media (max-width: 620px) {
  .quick-play-shell .score-team .team-label { display: none; }
}

/* 4.6 installed-app landscape sizing and compact team-header alignment */
html:has(body.scoreboard-shell),
body.scoreboard-shell {
  width: 100%;
  height: 100%;
  min-height: 100%;
  overflow: hidden;
}
body.scoreboard-shell {
  position: fixed;
  inset: 0;
  display: flex;
  flex-direction: column;
}
.scoreboard-shell .scoreboard-header { flex: 0 0 auto; }
.scoreboard-shell .scoreboard-main {
  flex: 1 1 auto;
  width: 100%;
  height: auto !important;
  min-height: 0;
  box-sizing: border-box;
}
.scoreboard-shell .score-grid,
.scoreboard-shell .score-card,
.scoreboard-shell .score-add-zone { min-height: 0; }

/* Keep the avatar and name as one centered unit instead of letting grid alignment pull them apart. */
.score-card .score-team.team-profile-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
.score-card .score-team-copy {
  flex: 0 1 auto;
  max-width: calc(100% - 72px);
}
.score-card .team-avatar-score { flex: 0 0 auto; }

@media (orientation: landscape) and (max-height: 620px) {
  /* Chrome installed shortcuts can report a shortened visual viewport. Inset positioning
     uses the actual app window and makes both score cards reach the bottom edge. */
  body.scoreboard-shell { height: auto; min-height: 0; }
  .scoreboard-shell .scoreboard-main {
    position: fixed;
    inset: 0;
    width: auto;
    height: auto !important;
    min-height: 0;
    padding:
      max(5px, env(safe-area-inset-top))
      max(5px, env(safe-area-inset-right))
      max(5px, env(safe-area-inset-bottom))
      max(5px, env(safe-area-inset-left));
  }
  .scoreboard-shell .score-grid {
    width: 100%;
    height: 100%;
    min-height: 0;
    align-self: stretch;
  }
  .scoreboard-shell .score-card {
    height: 100%;
    min-height: 0;
  }

  /* Give the photo and name a clean dedicated header row. */
  .score-card .score-team.team-profile-button {
    min-height: 58px;
    padding: 5px 46px !important;
    gap: 8px;
  }
  .score-card .team-avatar-score {
    width: 38px;
    height: 38px;
  }
  .score-card .score-team-copy {
    max-width: calc(100% - 50px);
    text-align: left;
  }
  .score-card .score-team-copy strong {
    margin-top: 2px;
    font-size: clamp(16px, 4.5vh, 24px);
    line-height: 1.05;
  }
  .score-card .team-label { font-size: 8px; }

  /* Move utility controls out of the team-name row. */
  .scoreboard-header-actions {
    top: max(66px, calc(env(safe-area-inset-top) + 66px));
    right: max(8px, env(safe-area-inset-right));
    flex-direction: column;
  }
  .score-grid > .score-card:nth-child(2) .score-team,
  .score-grid.swapped > .score-card:nth-child(1) .score-team {
    padding-right: 46px !important;
  }

  /* The color selector sits just above the score controls, away from names and photos. */
  .bag-color-picker {
    top: auto;
    right: 8px;
    bottom: 45px;
    width: 32px;
    height: 32px;
  }
  .bag-color-picker::after { inset: 5px; }

  /* Keep the next-throw marker compact in the opposite corner of the card. */
  .throw-first-badge {
    top: 8px;
    left: 8px;
    width: 30px;
    min-height: 30px;
  }
}

@media (orientation: landscape) and (max-height: 620px) {
  /* Use flex rather than inherited multi-row grid definitions. This prevents the hidden
     Just Play record/footer rows from reserving space in Chrome's installed-app mode. */
  .scoreboard-shell .scoreboard-main,
  .quick-play-shell .scoreboard-main {
    display: flex !important;
    flex-direction: column;
  }
  .scoreboard-shell .score-grid {
    flex: 1 1 auto;
    height: auto !important;
    min-height: 0;
  }
}

/* 4.7 portrait scoreboard repair
   Keep narrow half-screen cards from expanding to the width of long team names.
   Portrait gets its own stacked identity header and utility-control placement. */
@media (orientation: portrait) and (max-width: 620px) {
  .score-card > .score-team,
  .score-card > .score-add-zone,
  .score-card > .score-controls {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
  }

  .score-card .score-team.team-profile-button {
    min-height: 96px;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    padding: 8px 6px !important;
    overflow: hidden;
  }

  .score-card .team-avatar-score {
    width: 40px;
    height: 40px;
    font-size: 12px;
  }

  .score-card .score-team-copy {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    text-align: center;
  }

  .score-card .score-team-copy strong {
    width: 100%;
    max-width: 100%;
    margin-top: 2px;
    padding: 0 2px;
    box-sizing: border-box;
    font-size: clamp(14px, 4.2vw, 18px);
    line-height: 1.08;
  }

  .score-card .team-label {
    font-size: 7px;
    letter-spacing: .12em;
  }

  /* The bag color belongs with the scoring controls, not over the team identity. */
  .score-card .bag-color-picker {
    top: auto;
    right: 8px;
    bottom: 68px;
    width: 31px;
    height: 31px;
  }

  .score-card .bag-color-picker::after { inset: 5px; }

  /* Keep the throw-order symbol visible without covering the name. */
  .score-card .throw-first-badge {
    top: 104px;
    left: 8px;
    width: 30px;
    min-height: 30px;
    padding: 0;
    justify-content: center;
  }

  .score-card .throw-first-badge b { display: none; }
  .score-card .throw-first-badge span {
    width: 21px;
    height: 21px;
  }

  /* Prevent oversized numerals from clipping inside a half-width portrait card. */
  .score-card .score-number {
    max-width: 100%;
    font-size: clamp(82px, 29vw, 132px);
    letter-spacing: -.055em;
  }

  .score-card .score-add-zone small {
    margin-top: 8px;
  }
}

/* Version 5.0: clear bracket routes, live score poofs, and TV display */
.connector-layer { z-index: 1; }
.rounds-layer { z-index: 2; }
.connector-path {
  stroke: rgba(91, 204, 255, .82);
  stroke-width: 2.4;
  stroke-dasharray: 8 7;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 4px rgba(64, 190, 255, .42));
  animation: connectorFlow 1.8s linear infinite;
}
.connector-path.loser-path {
  stroke: rgba(255, 189, 60, .86);
  stroke-dasharray: 4 7;
  filter: drop-shadow(0 0 4px rgba(255, 174, 41, .34));
}
.connector-dot { fill: #71d6ff; filter: drop-shadow(0 0 5px rgba(71, 196, 255, .72)); }
.connector-dot.loser-dot { fill: #ffc85b; filter: drop-shadow(0 0 5px rgba(255, 181, 48, .7)); }
@keyframes connectorFlow { to { stroke-dashoffset: -30; } }

.bracket-team, .score-card { position: relative; }
.score-delta-pop {
  position: absolute;
  z-index: 40;
  display: grid;
  min-width: 58px;
  min-height: 58px;
  place-items: center;
  padding: 8px 12px;
  border: 2px solid rgba(255,255,255,.76);
  border-radius: 999px;
  color: #fff;
  background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.36), rgba(31,214,124,.96) 45%, rgba(5,112,62,.96));
  box-shadow: 0 0 0 8px rgba(69,242,148,.14), 0 16px 36px rgba(0,0,0,.38), 0 0 28px rgba(72,255,160,.52);
  font-family: "Space Grotesk", sans-serif;
  font-size: 28px;
  font-weight: 950;
  line-height: 1;
  letter-spacing: -.04em;
  pointer-events: none;
  transform: translate(-50%, 18px) scale(.55);
  opacity: 0;
  animation: scorePoof 1.95s cubic-bezier(.18,.76,.28,1) forwards;
}
.score-delta-pop.negative {
  background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.34), rgba(255,92,118,.96) 46%, rgba(133,19,48,.97));
  box-shadow: 0 0 0 8px rgba(255,92,118,.14), 0 16px 36px rgba(0,0,0,.38), 0 0 28px rgba(255,92,118,.48);
}
.score-delta-pop.busted {
  min-width: 106px;
  border-radius: 18px;
  background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.32), rgba(255,180,56,.98) 48%, rgba(134,67,0,.98));
  box-shadow: 0 0 0 8px rgba(255,181,63,.16), 0 16px 36px rgba(0,0,0,.38), 0 0 30px rgba(255,185,66,.5);
  font-size: 18px;
  letter-spacing: .02em;
}
.bracket-score-pop {
  left: 76%;
  top: 46%;
  min-width: 42px;
  min-height: 42px;
  padding: 6px 9px;
  font-size: 20px;
}
.scoreboard-score-pop {
  left: 50%;
  top: 48%;
  min-width: clamp(76px, 12vw, 130px);
  min-height: clamp(76px, 12vw, 130px);
  font-size: clamp(38px, 7vw, 76px);
}
@keyframes scorePoof {
  0% { opacity: 0; transform: translate(-50%, 24px) scale(.42) rotate(-7deg); filter: blur(6px); }
  12% { opacity: 1; transform: translate(-50%, 0) scale(1.16) rotate(3deg); filter: blur(0); }
  34% { opacity: 1; transform: translate(-50%, -18px) scale(1) rotate(0); }
  72% { opacity: .94; transform: translate(-50%, -62px) scale(.9); }
  100% { opacity: 0; transform: translate(-50%, -108px) scale(.68); filter: blur(2px); }
}

/* Full-screen television tournament view */
.tv-display-shell {
  width: 100%;
  height: 100dvh;
  min-height: 100vh;
  margin: 0;
  overflow: hidden;
  color: var(--text);
  background:
    radial-gradient(circle at 8% 12%, rgba(32,151,236,.18), transparent 34rem),
    radial-gradient(circle at 92% 88%, rgba(36,214,132,.12), transparent 32rem),
    #040b13;
}
.tv-display { position: relative; width: 100%; height: 100%; overflow: hidden; }
.tv-display-header {
  position: absolute;
  z-index: 30;
  top: max(14px, env(safe-area-inset-top));
  left: max(18px, env(safe-area-inset-left));
  right: max(18px, env(safe-area-inset-right));
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  pointer-events: none;
}
.tv-title-block {
  max-width: min(64vw, 920px);
  padding: 14px 18px;
  border: 1px solid rgba(132,188,231,.18);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(8,22,36,.9), rgba(6,15,26,.78));
  box-shadow: 0 14px 34px rgba(0,0,0,.28), inset 0 1px rgba(255,255,255,.04);
  backdrop-filter: blur(18px);
}
.tv-title-block h1 { margin: 2px 0 3px; font-family: "Space Grotesk", sans-serif; font-size: clamp(24px, 3.3vw, 56px); line-height: 1; letter-spacing: -.035em; }
.tv-title-block p { margin: 0; color: #aac0d2; font-size: clamp(10px, 1.15vw, 17px); }
.tv-header-actions { display: flex; align-items: center; gap: 8px; pointer-events: auto; }
.tv-live-badge, .tv-action-button {
  min-height: 42px;
  border: 1px solid rgba(132,188,231,.2);
  border-radius: 14px;
  color: #dbeeff;
  background: rgba(7,20,33,.84);
  box-shadow: 0 10px 24px rgba(0,0,0,.24);
  backdrop-filter: blur(16px);
}
.tv-live-badge { display: flex; align-items: center; gap: 8px; padding: 0 13px; font-size: 11px; font-weight: 800; text-transform: uppercase; }
.tv-live-badge i { width: 8px; height: 8px; border-radius: 50%; background: #8193a3; }
.tv-live-badge.online i { background: #53ed9d; box-shadow: 0 0 10px #53ed9d; }
.tv-action-button { padding: 0 14px; cursor: pointer; font: inherit; font-size: 11px; font-weight: 850; }
.tv-action-primary { border-color: rgba(65,192,255,.42); background: linear-gradient(145deg, rgba(26,145,224,.92), rgba(19,98,173,.92)); }
.tv-stats {
  position: absolute;
  z-index: 25;
  left: 50%;
  bottom: max(14px, env(safe-area-inset-bottom));
  display: flex;
  width: min(920px, calc(100vw - 36px));
  min-height: 64px;
  transform: translateX(-50%);
  overflow: hidden;
  border: 1px solid rgba(132,188,231,.18);
  border-radius: 18px;
  background: rgba(6,17,29,.88);
  box-shadow: 0 16px 34px rgba(0,0,0,.34), inset 0 1px rgba(255,255,255,.04);
  backdrop-filter: blur(18px);
}
.tv-stats > div { display: grid; flex: 1; min-width: 110px; place-content: center; padding: 8px 14px; border-right: 1px solid rgba(132,188,231,.12); text-align: center; }
.tv-stats > div:last-child { border-right: 0; }
.tv-stats strong { overflow: hidden; color: #fff; font-family: "Space Grotesk", sans-serif; font-size: clamp(20px, 2.4vw, 38px); line-height: 1; white-space: nowrap; text-overflow: ellipsis; }
.tv-stats span { margin-top: 5px; color: #8fa8bc; font-size: 9px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.tv-stats .tv-leader-stat { flex: 2.2; }
.tv-leader-stat strong { color: #7effb5; font-size: clamp(17px, 2vw, 31px); }
.tv-bracket-viewport {
  position: absolute;
  inset: 0;
  overflow: hidden;
  cursor: grab;
  touch-action: none;
}
.tv-bracket-canvas { position: absolute; left: 0; top: 0; transform-origin: 0 0; will-change: transform; }
.tv-game-card { box-shadow: 0 18px 42px rgba(0,0,0,.38), inset 0 1px rgba(255,255,255,.05); }
.tv-game-card.live { animation: tvLivePulse 2.4s ease-in-out infinite; }
.tv-bracket-team { cursor: default; }
@keyframes tvLivePulse { 50% { box-shadow: 0 0 0 2px rgba(77,240,158,.2), 0 18px 46px rgba(0,0,0,.4), 0 0 28px rgba(61,231,145,.18); } }
.tv-empty { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; color: #9cb1c3; text-align: center; }
.tv-empty div { display: grid; width: 78px; height: 78px; place-items: center; border-radius: 24px; color: #75d8ff; background: rgba(66,183,245,.12); font-size: 42px; }
.tv-empty h2 { margin: 14px 0 3px; color: #fff; font-size: 28px; }
.tv-empty p { margin: 0; }
.tv-score-ticker {
  position: absolute;
  z-index: 45;
  top: 50%;
  left: 50%;
  max-width: calc(100vw - 40px);
  padding: 16px 24px;
  transform: translate(-50%, -50%) scale(.72);
  opacity: 0;
  border: 1px solid rgba(255,255,255,.44);
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(145deg, rgba(27,193,108,.96), rgba(7,102,62,.96));
  box-shadow: 0 0 0 12px rgba(44,232,139,.12), 0 22px 54px rgba(0,0,0,.42), 0 0 42px rgba(44,232,139,.38);
  font-family: "Space Grotesk", sans-serif;
  font-size: clamp(28px, 5vw, 72px);
  font-weight: 950;
  text-align: center;
  pointer-events: none;
}
.tv-score-ticker.show { animation: tvTicker 2.15s cubic-bezier(.18,.76,.28,1) forwards; }

.tv-winner-spotlight {
  position: fixed;
  z-index: 130;
  inset: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
  color: #fff;
  background: radial-gradient(circle at 50% 42%, rgba(27,137,208,.68), rgba(3,10,18,.94) 58%, rgba(2,7,12,.98));
  backdrop-filter: blur(9px);
  opacity: 0;
}
.tv-winner-spotlight[hidden] { display: none !important; }
.tv-winner-spotlight.is-visible { animation: tv-winner-in .62s cubic-bezier(.18,.78,.24,1) forwards; }
.tv-winner-spotlight.is-leaving { animation: tv-winner-out .52s ease forwards; }
.tv-winner-glow { position: absolute; width: min(76vw, 860px); aspect-ratio: 1; border-radius: 50%; border: 2px solid rgba(106,220,255,.3); box-shadow: 0 0 130px rgba(53,178,246,.42), inset 0 0 110px rgba(78,197,255,.16); animation: tv-winner-glow 2.4s ease-in-out infinite; }
.tv-winner-content { position: relative; display: grid; justify-items: center; gap: clamp(8px, 1.5vh, 18px); width: min(940px, 92vw); text-align: center; }
.tv-winner-content .eyebrow { color: #86e1ff; font-size: clamp(.8rem, 1.6vw, 1.15rem); letter-spacing: .24em; }
.tv-winner-photos { display: flex; justify-content: center; margin: 4px 0; }
.tv-winner-photo { position: relative; width: clamp(132px, 19vw, 240px); aspect-ratio: 1; overflow: hidden; display: grid; place-items: center; margin: 0 clamp(-15px, -1vw, -6px); border: clamp(4px,.65vw,8px) solid rgba(222,247,255,.9); border-radius: 50%; color: #fff; background: linear-gradient(145deg,#1e96d9,#123855); box-shadow: 0 22px 70px rgba(0,0,0,.48), 0 0 0 9px rgba(77,197,255,.12); font: 900 clamp(2.4rem,7vw,5rem)/1 "Space Grotesk",sans-serif; }
.tv-winner-photo:nth-child(2) { animation-delay: .1s; }
.tv-winner-photo img { width: 100%; height: 100%; object-fit: cover; }
.tv-winner-content h2 { max-width: 100%; margin: 0; overflow-wrap: anywhere; font: 900 clamp(2.5rem,7vw,6.8rem)/.94 "Space Grotesk",sans-serif; text-shadow: 0 6px 30px rgba(0,0,0,.54); }
.tv-winner-content p { margin: 0; color: #d6edf9; font-size: clamp(1rem,2.1vw,1.7rem); font-weight: 800; }
.tv-winner-content > strong { color: #fff; font: 900 clamp(2rem,4.2vw,4.2rem)/1 "Space Grotesk",sans-serif; }
.tv-winner-move { padding: 11px 22px; border: 1px solid rgba(141,231,255,.48); border-radius: 999px; color: #b8f0ff; background: rgba(12,80,119,.42); font-size: clamp(.85rem,1.7vw,1.25rem); font-weight: 950; letter-spacing: .13em; }
.tv-advance-runner { position: fixed; z-index: 125; display: flex; align-items: center; gap: 10px; max-width: 300px; padding: 10px 14px 10px 10px; border: 1px solid rgba(127,228,255,.62); border-radius: 999px; color: #fff; background: linear-gradient(135deg,rgba(22,145,207,.98),rgba(8,50,79,.98)); box-shadow: 0 14px 55px rgba(17,157,221,.58); pointer-events: none; }
.tv-advance-runner .team-avatar { width: 44px; height: 44px; flex: 0 0 44px; }
.tv-advance-runner strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tv-game-card.tv-advance-source { z-index: 7; box-shadow: 0 0 0 5px rgba(75,213,255,.35),0 0 46px rgba(75,213,255,.75); }
.tv-game-card.tv-advance-target { z-index: 7; animation: tv-target-pulse .72s ease-in-out infinite alternate; }
@keyframes tv-winner-in { from { opacity:0; transform:scale(1.08); } to { opacity:1; transform:scale(1); } }
@keyframes tv-winner-out { to { opacity:0; transform:scale(.97); } }
@keyframes tv-winner-glow { 50% { transform:scale(1.06); opacity:.72; } }
@keyframes tv-target-pulse { to { box-shadow:0 0 0 5px rgba(100,235,167,.38),0 0 52px rgba(78,230,158,.7); } }
@keyframes tvTicker {
  0% { opacity: 0; transform: translate(-50%, -35%) scale(.58); filter: blur(8px); }
  13% { opacity: 1; transform: translate(-50%, -50%) scale(1.08); filter: blur(0); }
  65% { opacity: 1; transform: translate(-50%, -58%) scale(1); }
  100% { opacity: 0; transform: translate(-50%, -88%) scale(.78); filter: blur(2px); }
}

@media (max-width: 760px) {
  .tv-display-header { top: 8px; left: 8px; right: 8px; }
  .tv-title-block { max-width: calc(100vw - 138px); padding: 9px 11px; border-radius: 13px; }
  .tv-title-block h1 { font-size: 20px; }
  .tv-title-block p, .tv-live-badge { display: none; }
  .tv-header-actions { gap: 5px; }
  .tv-action-button { min-height: 38px; padding: 0 10px; border-radius: 11px; }
  .tv-stats { bottom: 7px; width: calc(100vw - 14px); min-height: 50px; border-radius: 13px; }
  .tv-stats > div { min-width: 0; padding: 5px; }
  .tv-stats strong { font-size: 17px; }
  .tv-stats span { font-size: 6px; letter-spacing: .06em; }
  .tv-stats .tv-leader-stat { display: none; }
}

/* Version 5.1: clean tournament routes, reliable score effects, and non-overlapping TV layout */
.game-card { cursor: pointer; }
.team-stats-button {
  display: grid;
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  place-items: center;
  margin-left: 3px;
  border: 1px solid rgba(140, 197, 238, .32);
  border-radius: 999px;
  color: #b9d9ef;
  background: rgba(7, 21, 34, .72);
  font: 900 11px/1 "Space Grotesk", sans-serif;
  cursor: pointer;
}
.team-stats-button:hover,
.team-stats-button:focus-visible {
  color: #fff;
  border-color: rgba(90, 207, 255, .72);
  background: rgba(24, 126, 189, .72);
  outline: none;
}


/* getBoundingClientRect() returns viewport coordinates, so remote score bubbles must be fixed */
.score-screen-pop { position: fixed; }
.bracket-score-pop { margin: 0; }

/* The television header and stats occupy their own rows instead of covering the bracket. */
.tv-display {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 10px;
  padding: max(12px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));
}
.tv-display-header {
  position: relative;
  inset: auto;
  grid-row: 1;
  min-width: 0;
  pointer-events: auto;
}
.tv-title-block {
  max-width: min(62vw, 760px);
  padding: 10px 14px;
}
.tv-title-block h1 { font-size: clamp(22px, 2.7vw, 44px); }
.tv-stats {
  position: relative;
  inset: auto;
  left: auto;
  bottom: auto;
  grid-row: 3;
  width: min(920px, 100%);
  min-height: 58px;
  margin: 0 auto;
  transform: none;
}
.tv-bracket-viewport {
  position: relative;
  inset: auto;
  grid-row: 2;
  min-width: 0;
  min-height: 0;
  border: 1px solid rgba(132, 188, 231, .11);
  border-radius: 18px;
  background: rgba(3, 12, 21, .24);
}

@media (max-width: 760px) {
  .tv-display { gap: 6px; padding: 7px; }
  .tv-display-header { inset: auto; top: auto; left: auto; right: auto; }
  .tv-title-block { max-width: calc(100vw - 136px); padding: 7px 10px; }
  .tv-title-block h1 { font-size: 18px; }
  .tv-stats { inset: auto; bottom: auto; width: 100%; min-height: 46px; }
  .tv-bracket-viewport { border-radius: 12px; }
}
.bracket-team { grid-template-columns: auto minmax(0, 1fr) auto auto auto; }
.tv-bracket-team { grid-template-columns: auto minmax(0, 1fr) auto auto; }


/* Version 5.2: origin-tracing routes, pinch gestures, focused TV view, and grouped score poofs. */
.connector-path.origin-path {
  stroke-dasharray: 9 7;
  opacity: .92;
}
.connector-path.origin-path.loser-path {
  stroke-dasharray: 4 7;
}
.tv-game-card.tv-focus-card {
  border-color: rgba(95, 224, 255, .62);
  box-shadow: 0 0 0 2px rgba(76, 205, 255, .12), 0 18px 46px rgba(0,0,0,.42), 0 0 28px rgba(67,199,255,.16);
}
.tv-game-card.tv-context-card {
  opacity: .8;
  border-color: rgba(132,188,231,.25);
  box-shadow: 0 14px 34px rgba(0,0,0,.3), inset 0 1px rgba(255,255,255,.04);
}
.game-card.my-bracket-location {
  border-color: rgba(95, 224, 255, .78);
  box-shadow: 0 0 0 3px rgba(76, 205, 255, .13), 0 18px 46px rgba(0,0,0,.42), 0 0 32px rgba(67,199,255,.2);
}
.bracket-viewport, .tv-bracket-viewport {
  overscroll-behavior: contain;
  -webkit-user-select: none;
  user-select: none;
}


/* Version 5.3: stable text editing, paired-team rename, and separated route lanes. */
.my-paired-team-section {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid rgba(132, 188, 231, .14);
}
.paired-team-rename-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
}
.paired-team-rename-form .field { margin: 0; }
.connector-path:nth-of-type(3n + 1) { stroke-dashoffset: 0; }
.connector-path:nth-of-type(3n + 2) { stroke-dashoffset: -5; opacity: .88; }
.connector-path:nth-of-type(3n) { stroke-dashoffset: -10; opacity: .76; }
@media (max-width: 620px) {
  .paired-team-rename-form { grid-template-columns: 1fr; }
}

/* Device follow waiting room and post-game routing */
.follow-choice-dialog {
  width: min(760px, calc(100vw - 28px));
}
.follow-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 20px 0;
}
.follow-choice-card {
  min-width: 0;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 20px;
  background: linear-gradient(145deg, rgba(255,255,255,.11), rgba(255,255,255,.045));
  color: inherit;
  padding: 18px;
  display: flex;
  align-items: center;
  gap: 14px;
  text-align: left;
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.follow-choice-card:hover,
.follow-choice-card:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(67, 219, 155, .75);
  background: linear-gradient(145deg, rgba(50,202,132,.2), rgba(255,255,255,.06));
}
.follow-choice-card > span:last-child {
  min-width: 0;
  display: grid;
  gap: 4px;
}
.follow-choice-card small { color: #61e6aa; font-weight: 900; letter-spacing: .08em; }
.follow-choice-card strong { font-size: 1.15rem; overflow-wrap: anywhere; }
.follow-choice-card em { color: var(--muted); font-style: normal; font-size: .88rem; line-height: 1.35; }
.follow-board-card { grid-column: 1 / -1; }
.follow-board-icon {
  width: 58px;
  height: 58px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  font-size: 2rem;
  background: rgba(255,190,70,.16);
  color: #ffd074;
  border: 1px solid rgba(255,190,70,.35);
}

.follow-shell {
  min-height: 100vh;
  min-height: 100dvh;
  background:
    radial-gradient(circle at 15% 8%, rgba(29, 152, 255, .17), transparent 32%),
    radial-gradient(circle at 84% 84%, rgba(37, 218, 139, .13), transparent 34%),
    #06101d;
  color: var(--text);
}
.follow-page {
  width: min(980px, calc(100% - 28px));
  margin: 0 auto;
  padding: max(18px, env(safe-area-inset-top)) 0 max(28px, env(safe-area-inset-bottom));
  display: grid;
  gap: 18px;
}
.follow-hero,
.follow-status-card,
.follow-next-game,
.follow-possible,
.follow-help {
  border-radius: 26px;
  padding: clamp(18px, 3vw, 30px);
}
.follow-topline {
  display: flex;
  align-items: center;
  gap: 12px;
  justify-content: space-between;
}
.follow-subject-wrap {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-top: 22px;
}
.follow-subject-wrap h1 { margin: 4px 0; font-size: clamp(2rem, 6vw, 4rem); line-height: .98; }
.follow-subject-wrap p { margin: 0; color: var(--muted); }
.follow-subject-avatar {
  width: clamp(74px, 14vw, 118px);
  height: clamp(74px, 14vw, 118px);
  font-size: clamp(1.8rem, 5vw, 3rem);
  border: 3px solid rgba(255,255,255,.2);
  box-shadow: 0 18px 45px rgba(0,0,0,.28);
}
.follow-subject-avatar.board-avatar { color: #ffd074; background: rgba(255,190,70,.15); }
.follow-status-card { text-align: center; position: relative; overflow: hidden; }
.follow-status-card h2 { font-size: clamp(1.6rem, 4vw, 2.8rem); margin: 8px 0; }
.follow-status-card p { color: var(--muted); font-size: 1.05rem; margin: 0 auto; max-width: 720px; }
.follow-status-pulse { width: 64px; height: 64px; border-radius: 50%; margin: 0 auto 12px; display: grid; place-items: center; background: rgba(72,155,255,.12); }
.follow-status-pulse span { width: 20px; height: 20px; border-radius: 50%; background: #55a9ff; box-shadow: 0 0 0 0 rgba(85,169,255,.45); animation: followPulse 1.7s infinite; }
.follow-status-pulse.status-ready { background: rgba(47,218,137,.14); }
.follow-status-pulse.status-ready span { background: #41e095; box-shadow: 0 0 0 0 rgba(65,224,149,.48); }
.follow-status-pulse.status-eliminated span,
.follow-status-pulse.status-completed span { background: #8d9bad; animation: none; box-shadow: none; }
.follow-countdown { margin-top: 18px; font-size: 1.35rem; font-weight: 900; color: #ffd074; }
@keyframes followPulse { 0% { box-shadow: 0 0 0 0 currentColor; } 70% { box-shadow: 0 0 0 20px transparent; } 100% { box-shadow: 0 0 0 0 transparent; } }
.follow-section-title { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; margin-bottom: 18px; }
.follow-section-title strong { color: var(--muted); }
.follow-matchup { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: center; gap: 18px; }
.follow-team { display: grid; justify-items: center; text-align: center; gap: 10px; min-width: 0; }
.follow-team strong { font-size: clamp(1.1rem, 3vw, 1.65rem); overflow-wrap: anywhere; }
.follow-versus { display: grid; justify-items: center; gap: 8px; color: var(--muted); }
.follow-versus span { font-weight: 1000; font-size: 1.35rem; color: #fff; }
.follow-versus strong { color: #ffd074; text-align: center; max-width: 160px; }
.follow-open-button { display: flex; width: min(360px,100%); margin: 24px auto 0; justify-content: center; }
.follow-opponent-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(150px,1fr)); gap: 12px; }
.follow-opponent-card { display: flex; align-items: center; gap: 10px; padding: 12px; border: 1px solid rgba(255,255,255,.1); border-radius: 16px; background: rgba(255,255,255,.045); min-width: 0; }
.follow-opponent-card strong { overflow-wrap: anywhere; }
.follow-help { text-align: center; }
.follow-help p { color: var(--muted); max-width: 680px; margin: 8px auto 18px; }

@media (max-width: 640px) {
  .follow-choice-grid { grid-template-columns: 1fr; }
  .follow-board-card { grid-column: auto; }
  .follow-choice-card { padding: 14px; }
  .follow-topline { flex-wrap: wrap; }
  .follow-subject-wrap { align-items: flex-start; }
  .follow-matchup { gap: 8px; }
  .follow-versus strong { max-width: 90px; font-size: .82rem; }
  .follow-team .team-avatar-xl { width: 62px; height: 62px; }
}

.team-avatar-large { width: 58px; height: 58px; font-size: 17px; flex: 0 0 auto; }


/* Follow-link and live opponent enhancements v5.5 */
.team-follow-button { display:flex; justify-content:center; width:100%; margin:16px 0 4px; }
.signup-success strong { display:block; font-size:1rem; }
.signup-success p { margin:7px 0 12px; color:#b9d2c6; line-height:1.45; }
.signup-follow-actions { display:flex; flex-wrap:wrap; gap:8px; }
.signup-follow-actions .button { flex:1 1 190px; justify-content:center; }
.follow-opponent-card { position:relative; text-decoration:none; color:inherit; }
.follow-opponent-card.is-live { border-color:rgba(65,224,149,.55); background:linear-gradient(135deg,rgba(65,224,149,.13),rgba(255,255,255,.04)); box-shadow:inset 0 0 0 1px rgba(65,224,149,.08); }
.follow-opponent-card.is-ready { border-color:rgba(255,208,116,.42); }
.follow-opponent-copy { display:grid; gap:4px; min-width:0; flex:1; }
.follow-opponent-copy strong { overflow-wrap:anywhere; }
.follow-opponent-copy small { color:var(--muted); line-height:1.3; }
.follow-opponent-card.is-live .follow-opponent-copy small { color:#8bf2bd; font-weight:800; }
.follow-live-badge { align-self:flex-start; border-radius:999px; padding:4px 7px; background:#2be08a; color:#04120c; font-style:normal; font-size:.64rem; font-weight:1000; letter-spacing:.08em; }
.follow-status-pulse.status-waiting_team,
.follow-status-pulse.status-unpaired_closed { background:rgba(255,190,70,.14); }
.follow-status-pulse.status-waiting_team span,
.follow-status-pulse.status-unpaired_closed span { background:#ffd074; box-shadow:0 0 0 0 rgba(255,208,116,.45); }
.follow-status-pulse.status-paired { background:rgba(47,218,137,.14); }
.follow-status-pulse.status-paired span { background:#41e095; box-shadow:0 0 0 0 rgba(65,224,149,.48); }
@media (max-width:620px) { .signup-follow-actions { display:grid; grid-template-columns:1fr; } .follow-opponent-grid { grid-template-columns:1fr; } }

/* Follow completion, final standings, and unattended routing v5.6 */
.team-follow-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(320px, 100%);
  margin: 16px auto 4px;
  text-align: center;
}
.follow-auto-route {
  margin: 14px 0 4px;
  padding: 12px 14px;
  border: 1px solid rgba(88, 193, 255, .28);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(40, 153, 232, .14), rgba(255,255,255,.035));
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
}
.follow-auto-route span { color: var(--muted); font-size: .78rem; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
.follow-auto-route strong { min-width: 0; overflow-wrap: anywhere; }
.follow-auto-route em { min-width: 48px; color: #ffd074; font-style: normal; font: 900 1.05rem/1 "Space Grotesk", sans-serif; text-align: right; }
.follow-choice-card.is-auto-choice {
  border-color: rgba(91, 203, 255, .82);
  box-shadow: inset 0 0 0 1px rgba(91, 203, 255, .25), 0 0 24px rgba(45, 155, 235, .14);
}
.follow-choice-card.is-auto-choice::after {
  content: "AUTO";
  align-self: flex-start;
  margin-left: auto;
  border-radius: 999px;
  padding: 4px 7px;
  color: #06111f;
  background: #73d7ff;
  font-size: .62rem;
  font-weight: 1000;
  letter-spacing: .08em;
}
.follow-result,
.follow-final-results,
.follow-available-games { border-radius: 26px; padding: clamp(18px, 3vw, 30px); }
.follow-result-layout { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: clamp(18px, 4vw, 34px); align-items: center; }
.follow-placement-badge {
  width: clamp(118px, 20vw, 168px);
  aspect-ratio: 1;
  border-radius: 50%;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 4px;
  border: 3px solid rgba(255,255,255,.18);
  box-shadow: 0 20px 55px rgba(0,0,0,.32), inset 0 0 35px rgba(255,255,255,.08);
}
.follow-placement-badge span { font-size: clamp(2.7rem, 8vw, 4.8rem); line-height: 1; }
.follow-placement-badge strong { font: 1000 clamp(.9rem, 2vw, 1.2rem)/1 "Space Grotesk", sans-serif; letter-spacing: .12em; }
.follow-placement-badge.gold { color: #fff2a6; background: radial-gradient(circle at 35% 25%, #ffe67a, #c6870c 72%); }
.follow-placement-badge.silver { color: #fff; background: radial-gradient(circle at 35% 25%, #f1f6fb, #7e91a7 72%); }
.follow-placement-badge.bronze { color: #ffe0c1; background: radial-gradient(circle at 35% 25%, #e5a16f, #82401f 72%); }
.follow-placement-badge.place { color: #d5ecff; background: radial-gradient(circle at 35% 25%, #4389bd, #163d61 72%); }
.follow-result-copy h2 { margin: 6px 0 8px; font-size: clamp(1.7rem, 4vw, 3rem); }
.follow-result-copy p { color: var(--muted); margin: 0 0 18px; font-size: 1.02rem; }
.follow-results-grid { display: grid; gap: 9px; }
.follow-result-row {
  display: grid;
  grid-template-columns: 54px 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 11px;
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 16px;
  color: inherit;
  text-decoration: none;
  background: rgba(255,255,255,.04);
}
.follow-result-row:hover { border-color: rgba(92, 199, 255, .48); background: rgba(92,199,255,.075); }
.follow-result-row.gold { border-color: rgba(255, 209, 77, .38); background: linear-gradient(90deg, rgba(218,161,21,.15), rgba(255,255,255,.035)); }
.follow-result-row.silver { border-color: rgba(210, 225, 239, .25); }
.follow-result-row.bronze { border-color: rgba(210, 124, 72, .32); }
.follow-result-rank { display: grid; place-items: center; font-size: 1.45rem; font-weight: 1000; }
.follow-result-team { min-width: 0; display: grid; gap: 3px; }
.follow-result-team strong { overflow-wrap: anywhere; }
.follow-result-team small { color: var(--muted); }
.follow-result-row em { color: #ffd074; font-style: normal; font-weight: 1000; letter-spacing: .06em; }
.follow-game-choice-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 11px; }
.follow-game-choice {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 15px;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 17px;
  color: inherit;
  text-decoration: none;
  background: rgba(255,255,255,.045);
  transition: transform .16s ease, border-color .16s ease, background .16s ease;
}
.follow-game-choice:hover { transform: translateY(-2px); border-color: rgba(85, 194, 255, .55); }
.follow-game-choice.is-live { border-color: rgba(59, 225, 144, .54); background: linear-gradient(135deg, rgba(42, 210, 128, .13), rgba(255,255,255,.035)); }
.follow-game-choice.is-ready { border-color: rgba(255, 205, 104, .48); }
.follow-game-choice-top { color: #68dca9; font-size: .7rem; font-weight: 1000; letter-spacing: .1em; }
.follow-game-choice strong { overflow-wrap: anywhere; font-size: 1.05rem; }
.follow-game-choice small { color: var(--muted); }
.follow-status-pulse.status-champion { background: rgba(255, 203, 71, .16); }
.follow-status-pulse.status-champion span { background: #ffd05c; animation: none; box-shadow: 0 0 26px rgba(255,208,92,.45); }
@media (max-width: 640px) {
  .follow-auto-route { grid-template-columns: 1fr auto; }
  .follow-auto-route span { grid-column: 1 / -1; }
  .follow-result-layout { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  .follow-result-row { grid-template-columns: 44px 38px minmax(0, 1fr); }
  .follow-result-row em { grid-column: 3; justify-self: start; font-size: .72rem; }
  .follow-game-choice-grid { grid-template-columns: 1fr; }
}

/* 5.8.0 simplified first-time registration */
.simple-registration-shell {
  min-height: 100dvh;
  background:
    radial-gradient(circle at 12% 8%, rgba(44,157,255,.16), transparent 32rem),
    radial-gradient(circle at 88% 92%, rgba(46,221,145,.12), transparent 30rem),
    #07111f;
}
.simple-registration-page {
  width: min(760px, calc(100% - 28px));
  margin: 0 auto;
  padding: max(18px, env(safe-area-inset-top)) 0 max(28px, env(safe-area-inset-bottom));
}
.simple-registration-card { padding: clamp(20px, 5vw, 42px); border-radius: 30px; }
.simple-registration-brand { display:flex; align-items:center; gap:11px; margin-bottom:clamp(26px,5vw,46px); }
.simple-registration-brand > span:last-child { display:grid; line-height:1.05; }
.simple-registration-brand small { margin-top:4px; color:var(--muted); font-size:.76rem; }
.simple-event-header { text-align:center; }
.simple-event-header h1 { margin:8px 0 10px; font-size:clamp(2.15rem,8vw,4.5rem); line-height:.98; overflow-wrap:anywhere; }
.simple-event-header p { max-width:520px; margin:0 auto; color:var(--muted); font-size:1.05rem; }
.simple-event-facts { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:26px 0 18px; }
.simple-event-fact { min-width:0; padding:16px; border:1px solid rgba(255,255,255,.1); border-radius:18px; background:rgba(255,255,255,.045); }
.simple-event-fact span { display:block; margin-bottom:6px; color:#68dca9; font-size:.68rem; font-weight:1000; letter-spacing:.12em; }
.simple-event-fact strong { display:block; line-height:1.35; overflow-wrap:anywhere; }
.simple-countdown { margin:0 0 20px; text-align:center; }
.simple-signup-form { display:grid; gap:16px; margin-top:24px; }
.simple-signup-choice { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.simple-signup-choice-button { display:grid; gap:4px; min-width:0; padding:15px; border:1px solid rgba(255,255,255,.12); border-radius:17px; color:#fff; background:rgba(255,255,255,.04); text-align:left; cursor:pointer; }
.simple-signup-choice-button strong { font-size:1rem; }
.simple-signup-choice-button small { color:var(--muted); line-height:1.25; }
.simple-signup-choice-button.active { border-color:rgba(76,225,157,.65); background:linear-gradient(135deg,rgba(57,214,144,.19),rgba(255,255,255,.05)); box-shadow:inset 0 0 0 1px rgba(75,225,157,.1); }
.simple-primary-field input { min-height:58px; font-size:1.08rem; }
.simple-team-fields { display:grid; gap:14px; }
.simple-player-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.simple-photo-details { border:1px solid rgba(255,255,255,.1); border-radius:16px; background:rgba(255,255,255,.035); }
.simple-photo-details summary { padding:14px 16px; cursor:pointer; font-weight:900; }
.simple-photo-details summary span { color:var(--muted); font-weight:600; }
.simple-photo-picker { margin:0 12px 12px; }
.simple-signup-help { margin:0; color:var(--muted); line-height:1.45; }
.simple-signup-submit { width:100%; justify-content:center; min-height:58px; font-size:1.05rem; }
.simple-registration-closed { display:grid; gap:7px; margin-top:24px; padding:22px; border:1px solid rgba(255,190,80,.3); border-radius:18px; text-align:center; background:rgba(255,190,80,.08); }
.simple-registration-closed span { color:#ffd074; font-weight:1000; letter-spacing:.1em; }
.simple-signup-confirmation { margin-top:26px; text-align:center; }
.simple-success-icon { display:grid; place-items:center; width:72px; height:72px; margin:0 auto 16px; border-radius:50%; color:#052115; background:linear-gradient(135deg,#65e9aa,#c5ffe1); font-size:2.1rem; font-weight:1000; box-shadow:0 18px 45px rgba(51,220,145,.22); }
.simple-signup-confirmation h2 { margin:7px 0 10px; font-size:clamp(1.8rem,5vw,2.8rem); }
.simple-signup-confirmation > p { max-width:590px; margin:0 auto 18px; color:var(--muted); line-height:1.5; }
.simple-follow-link-field { display:grid; gap:7px; margin:18px 0 12px; text-align:left; }
.simple-follow-link-field span { color:var(--muted); font-size:.8rem; font-weight:900; }
.simple-follow-link-field input { width:100%; padding:13px 14px; border:1px solid rgba(94,196,255,.28); border-radius:13px; color:#dff5ff; background:rgba(3,12,22,.6); font:600 .87rem/1.3 ui-monospace,SFMono-Regular,Consolas,monospace; }
.simple-follow-actions { display:grid; grid-template-columns:1.15fr .8fr 1fr; gap:9px; }
.simple-follow-actions .button { justify-content:center; min-width:0; }
.simple-private-note { margin-top:13px !important; font-size:.82rem; }
.simple-register-another { margin-top:24px; border:0; color:var(--muted); background:transparent; text-decoration:underline; cursor:pointer; }
.simple-paired-team { margin-top:24px; padding:18px; border:1px solid rgba(76,225,157,.24); border-radius:18px; background:rgba(76,225,157,.06); text-align:left; }
.simple-paired-team h3 { margin:5px 0; }

.follow-cancel-signup { display:flex; align-items:center; justify-content:space-between; gap:18px; border-color:rgba(255,130,145,.2); }
.follow-cancel-signup > div { display:grid; gap:5px; }
.follow-cancel-signup .button { flex:0 0 auto; }
.follow-canceled { text-align:center; padding:clamp(24px,5vw,48px); }
.follow-canceled h2 { margin:8px 0; font-size:clamp(1.8rem,5vw,3rem); }
.follow-canceled p { color:var(--muted); margin:0 auto 20px; max-width:560px; }
.cancel-icon { color:#301116; background:linear-gradient(135deg,#ff9aaa,#ffd0d6); box-shadow:0 18px 45px rgba(255,100,120,.18); }
.follow-cancel-dialog { width:min(520px,calc(100% - 28px)); border:1px solid rgba(255,255,255,.14); border-radius:24px; padding:0; color:#fff; background:#0b1725; box-shadow:0 30px 90px rgba(0,0,0,.55); }
.follow-cancel-dialog::backdrop { background:rgba(0,0,0,.72); backdrop-filter:blur(8px); }
.follow-cancel-dialog .modal-card { display:grid; gap:14px; padding:26px; }
.follow-cancel-dialog h2 { margin:0; }
.follow-cancel-dialog p { margin:0; color:var(--muted); line-height:1.5; }
.follow-cancel-dialog .modal-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:8px; }

@media (max-width:680px) {
  .simple-registration-page { width:min(100% - 18px,760px); }
  .simple-registration-card { padding:20px 16px 24px; border-radius:23px; }
  .simple-event-facts, .simple-player-grid, .simple-signup-choice { grid-template-columns:1fr; }
  .simple-follow-actions { grid-template-columns:1fr; }
  .follow-cancel-signup { align-items:stretch; flex-direction:column; text-align:center; }
  .follow-cancel-signup .button { width:100%; justify-content:center; }
  .follow-cancel-dialog .modal-actions { display:grid; grid-template-columns:1fr; }
}

/* Persistent personal game-day navigation v5.9 */
.my-status-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 41px;
  padding: 0 14px;
  border: 1px solid rgba(96, 217, 255, .48);
  border-radius: 13px;
  color: #eaffff;
  background: linear-gradient(145deg, rgba(22, 147, 211, .28), rgba(38, 214, 151, .16));
  box-shadow: inset 0 1px rgba(255,255,255,.12), 0 9px 24px rgba(0, 132, 196, .12);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .02em;
  text-decoration: none;
  white-space: nowrap;
}
.my-status-link::before {
  content: "◎";
  color: #7fe7ff;
  font-size: 17px;
  line-height: 1;
}
.my-status-link:hover,
.my-status-link:focus-visible {
  border-color: rgba(126, 232, 255, .9);
  background: linear-gradient(145deg, rgba(26, 171, 238, .38), rgba(45, 224, 160, .23));
  transform: translateY(-1px);
}
.my-status-link.is-ready {
  border-color: rgba(89, 238, 163, .75);
  background: linear-gradient(145deg, rgba(34, 205, 132, .34), rgba(35, 149, 222, .22));
  box-shadow: 0 0 0 1px rgba(82,224,158,.12), 0 0 22px rgba(49, 220, 150, .2);
}
.my-status-link.needs-identity {
  border-color: rgba(112, 222, 255, .68);
  background: linear-gradient(145deg, rgba(24, 158, 226, .34), rgba(37, 197, 203, .2));
  box-shadow: inset 0 1px rgba(255,255,255,.14), 0 9px 26px rgba(0, 154, 219, .17);
}
.my-status-link.needs-identity::before { content: "+"; }
.event-actions .my-status-link { order: -2; }
.follow-topline .my-status-link { flex: 0 1 auto; }
.scoreboard-header-actions .scoreboard-my-status { flex: 0 1 auto; max-width: 190px; overflow: hidden; }
.scoreboard-header-actions .scoreboard-my-status [data-my-status-text] { overflow: hidden; text-overflow: ellipsis; }

@media (max-width: 760px), (hover: none) and (pointer: coarse) {
  .scoreboard-header .scoreboard-my-status {
    display: inline-flex !important;
    width: 43px;
    min-width: 43px;
    height: 39px;
    min-height: 39px;
    padding: 0;
    border-radius: 12px;
  }
  .scoreboard-header .scoreboard-my-status::before { content: "◎"; font-size: 21px; }
  .scoreboard-header .scoreboard-my-status [data-my-status-text] { display: none; }
}

@media (max-width: 620px) {
  .event-actions .my-status-link { flex: 1 1 100%; }
  .follow-topline .my-status-link { order: 3; flex: 1 1 100%; }
}

@media (orientation: landscape) and (max-height: 620px) {
  .scoreboard-header .scoreboard-my-status { display: inline-flex !important; }
}
.my-status-link[hidden] { display: none !important; }

/* 6.1: stable personal identity, cleaner event layout, and recovery controls */
.hero-panel.hero-actions-only {
  min-height: 250px;
  grid-row: auto;
  align-items: center;
  justify-content: center;
  padding: clamp(28px,5vw,54px);
}
.hero-panel.hero-actions-only::after { width: 360px; height: 360px; right: -90px; bottom: -170px; }
.hero-panel.hero-actions-only .hero-actions { width: min(720px,100%); justify-content: center; }
.hero-panel.hero-actions-only .button { flex: 1 1 280px; min-height: 68px; font-size: 17px; }

.bracket-board-card { margin-top: 16px; padding: 12px; border-radius: 25px; }
.bracket-toolbar.bracket-toolbar-inline {
  margin: 0 0 10px;
  padding: 4px 4px 10px;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.bracket-viewport.bracket-viewport-inline { height: calc(100vh - 332px); border-radius: 18px; box-shadow: inset 0 1px rgba(255,255,255,.035); }
.creator-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  margin-top: 18px;
  padding: 20px 22px;
  border-radius: 20px;
}
.creator-footer > div:first-child { display: grid; gap: 4px; }
.creator-footer strong { font-family: "Space Grotesk",sans-serif; font-size: 20px; }
.creator-footer p { margin: 0; color: var(--muted); font-size: 12px; }
.creator-footer-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 9px; }

.menu-help { margin: -2px 0 4px; color: var(--muted); font-size: 11px; line-height: 1.45; }
.creator-game-controls { padding-top: 12px; border-top: 1px solid var(--line); }

.identity-dialog { width: min(540px,calc(100% - 24px)); }
.identity-current { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin: 14px 0; padding: 13px 14px; border: 1px solid var(--line); border-radius: 14px; }
.identity-current span { color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.identity-current strong { text-align: right; }
.identity-team-list { display: grid; gap: 8px; max-height: min(48vh,430px); overflow-y: auto; padding-right: 3px; }
.identity-team-option {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 12px 13px;
  border: 1px solid var(--line);
  border-radius: 14px;
  color: var(--text);
  background: rgba(255,255,255,.035);
  text-align: left;
}
.identity-team-option:hover,.identity-team-option.selected { border-color: rgba(82,224,158,.55); background: rgba(82,224,158,.09); }
.identity-team-option > span:last-child { display: grid; gap: 3px; }
.identity-team-option small,.identity-loading { color: var(--muted); }
.identity-loading { padding: 22px; border: 1px dashed var(--line); border-radius: 14px; text-align: center; }
.identity-dialog-actions { justify-content: space-between; }

@media (max-width: 900px) {
  .hero-panel.hero-actions-only { min-height: 220px; }
  .creator-footer { align-items: stretch; flex-direction: column; }
  .creator-footer-actions { justify-content: stretch; }
  .creator-footer-actions .button { flex: 1 1 180px; }
  .bracket-viewport.bracket-viewport-inline { height: calc(100dvh - 360px); }
}

@media (max-width: 620px) {
  .hero-panel.hero-actions-only { min-height: 0; padding: 22px; }
  .hero-panel.hero-actions-only .button { min-height: 58px; font-size: 14px; }
  .bracket-board-card { padding: 8px; border-radius: 19px; }
  .bracket-toolbar.bracket-toolbar-inline { grid-template-columns: 1fr auto; gap: 8px; }
  .bracket-toolbar.bracket-toolbar-inline .toolbar-hint { grid-column: 1 / -1; justify-self: start; padding: 0 4px; }
  .bracket-viewport.bracket-viewport-inline { height: calc(100dvh - 330px); min-height: 430px; border-radius: 14px; }
  .creator-footer { padding: 17px; }
  .creator-footer-actions { display: grid; grid-template-columns: 1fr; }
  .identity-dialog-actions { display: grid; grid-template-columns: 1fr; }
  .identity-dialog-actions .button { width: 100%; }
}
.hero-panel.hero-actions-only { grid-column: 1 / -1; }
@media (max-width:900px) { .hero-panel.hero-actions-only { grid-column: auto; } }


/* 6.2.0: simplified post-game routing */
.follow-choice-grid-simple { grid-template-columns: 1fr; }
.follow-choice-grid-simple .follow-board-card { grid-column: auto; }
.follow-my-team-card { border-color: rgba(71, 221, 157, .42); }
.follow-my-team-card.needs-identity { border-color: rgba(255, 190, 70, .5); }
.follow-my-team-card.needs-identity small { color: #ffd074; }
.follow-choice-footer { flex-wrap: wrap; }
.follow-choice-footer .button { justify-content: center; }
@media (max-width: 640px) {
  .follow-choice-dialog { max-height: calc(100dvh - 20px); overflow: auto; }
  .follow-choice-grid-simple { margin: 14px 0; gap: 10px; }
  .follow-choice-grid-simple .follow-choice-card { padding: 14px; }
  .follow-choice-footer { display: grid; grid-template-columns: 1fr; }
  .follow-choice-footer .button { width: 100%; }
}

/* 6.4.0: identity recovery, duplicate-name guidance, and follow-page polish. */
.follow-topline-nav,
.follow-topline-actions {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}
.follow-topline-nav { flex: 1 1 auto; }
.follow-topline-actions { flex: 0 0 auto; }
.follow-topline > .connection-badge { flex: 0 0 auto; margin-left: auto; }
.follow-topline-actions .button { white-space: nowrap; }

.follow-cancel-signup {
  min-height: 92px;
  padding: clamp(18px, 3vw, 26px);
  border: 1px solid rgba(255,130,145,.24);
  border-radius: 22px;
  background: linear-gradient(135deg, rgba(255,91,112,.09), rgba(255,255,255,.035));
  box-shadow: inset 0 1px rgba(255,255,255,.04);
}
.follow-cancel-signup strong { line-height: 1.4; }
.follow-cancel-signup .eyebrow { color: #ff9bab; }

.already-signed-up-card {
  display: grid;
  justify-items: center;
  gap: 8px;
  margin-top: 28px;
  padding: 22px;
  border: 1px solid rgba(104, 202, 255, .22);
  border-radius: 20px;
  background: linear-gradient(145deg, rgba(49,151,219,.09), rgba(255,255,255,.025));
  text-align: center;
}
.already-signed-up-card strong { font: 800 1.18rem/1.2 "Space Grotesk", sans-serif; }
.already-signed-up-card p { max-width: 540px; margin: 0 0 4px; color: var(--muted); line-height: 1.45; }
.already-signed-up-card .button { min-width: min(100%, 250px); justify-content: center; }

.identity-section-title {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 9px 4px 5px;
  color: #8fc9e8;
  background: #0b1725;
  font-size: 10px;
  font-weight: 1000;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.identity-player-option { border-color: rgba(104,202,255,.2); }
.identity-player-option:hover,
.identity-player-option.selected { border-color: rgba(104,202,255,.62); background: rgba(51,162,226,.11); }

@media (max-width: 760px) {
  .follow-topline {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
  }
  .follow-topline-nav { min-width: 0; }
  .follow-topline-nav .my-status-link { flex: 1 1 auto; min-width: 0; }
  .follow-topline > .connection-badge { grid-column: 1; grid-row: 2; justify-self: start; margin-left: 0; }
  .follow-topline-actions { grid-column: 2; grid-row: 1 / span 2; align-self: center; flex-direction: column; align-items: stretch; }
  .follow-topline-actions .button { justify-content: center; }
}

@media (max-width: 520px) {
  .follow-topline { grid-template-columns: 1fr; }
  .follow-topline-nav { flex-wrap: wrap; }
  .follow-topline-nav .my-status-link { order: 0; flex: 1 1 100%; }
  .follow-topline > .connection-badge { grid-column: 1; grid-row: auto; }
  .follow-topline-actions {
    grid-column: 1;
    grid-row: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
  }
  .follow-cancel-signup { padding: 20px 16px; }
  .already-signed-up-card { padding: 19px 15px; }
}

/* 6.5.0: finalized-roster visibility, picture editing, and cleaner game-day actions. */
.follow-page > [hidden],
.simple-registration-page [hidden] {
  display: none !important;
}

.follow-photo-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .85fr);
  align-items: center;
  gap: 20px;
  padding: clamp(18px, 3vw, 26px);
  border: 1px solid rgba(104, 202, 255, .22);
  border-radius: 22px;
  background: linear-gradient(145deg, rgba(49,151,219,.09), rgba(255,255,255,.025));
}
.follow-photo-card > div { display: grid; gap: 6px; }
.follow-photo-card p { margin: 0; color: var(--muted); line-height: 1.45; }
.follow-photo-form { display: grid; gap: 10px; }
.follow-photo-picker { min-width: 0; padding: 11px; border: 1px solid var(--line); border-radius: 15px; background: rgba(255,255,255,.025); }
.follow-photo-picker .photo-preview { width: 54px; height: 54px; }
.follow-photo-form .button { width: 100%; justify-content: center; }
.follow-view-tournament {
  justify-self: center;
  min-width: min(100%, 260px);
  margin: 2px auto 0;
  justify-content: center;
}

@media (max-width: 720px) {
  .follow-photo-card { grid-template-columns: 1fr; }
}


/* 6.6.0: publish gating and clear self-service profile editing. */
#rankingsPanel[hidden],
#bracketBoardCard[hidden],
#emptyBracket[hidden],
.follow-page > [hidden],
.follow-profile-card [hidden] { display: none !important; }
.follow-profile-card {
  display: grid;
  grid-template-columns: minmax(180px,.85fr) minmax(240px,1fr) minmax(260px,1.2fr);
  align-items: start;
  gap: 18px;
  padding: clamp(18px,3vw,28px);
}
.follow-profile-heading { display:grid; gap:6px; }
.follow-profile-heading p { margin:0; color:var(--muted); line-height:1.5; }
.follow-name-form { display:grid; gap:10px; }
.follow-name-form label { display:grid; gap:7px; }
.follow-name-form label > span { color:var(--muted); font-size:.82rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.follow-name-form input { width:100%; min-width:0; }
.follow-name-form .button { width:100%; justify-content:center; }
@media (max-width: 820px) {
  .follow-profile-card { grid-template-columns:1fr; }
}

/* Event visitors always retain the brand/Home and account header. Creator-only
   event shortcuts appear only after this device's passcode is verified. */
.event-navigation-locked #globalTopbar .topbar-actions > #justPlayBtn,
.event-navigation-locked #globalTopbar .topbar-actions > #newTournamentBtn { display: none !important; }

/* 6.8.0: calm ready-game handoff and inline identity editing. */
.follow-profile-trigger {
  width: 100%;
  appearance: none;
  color: inherit;
  text-align: left;
  border: 1px solid transparent;
  border-radius: 22px;
  padding: 10px;
  margin: 12px -10px -10px;
  background: transparent;
  font: inherit;
  cursor: default;
  transition: background .18s ease, border-color .18s ease, transform .18s ease;
}
.follow-profile-trigger.is-editable {
  cursor: pointer;
}
.follow-profile-trigger.is-editable:hover,
.follow-profile-trigger.is-editable:focus-visible {
  background: rgba(255,255,255,.045);
  border-color: rgba(106,205,255,.24);
  outline: none;
}
.follow-profile-trigger.is-editable:active { transform: scale(.995); }
.follow-profile-trigger:disabled { opacity: 1; }
.follow-subject-copy { min-width: 0; }
.follow-profile-hint {
  display: inline-flex;
  margin-top: 8px;
  color: #78d8ff;
  font-weight: 800;
  font-size: .78rem;
  letter-spacing: .02em;
}
.follow-profile-dialog {
  width: min(620px, calc(100% - 24px));
  max-width: 620px;
}
.follow-profile-modal-card {
  position: relative;
  display: grid;
  gap: 18px;
  padding: clamp(22px, 5vw, 34px);
}
.follow-profile-modal-card .modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
}
.follow-profile-modal-card .follow-profile-heading { padding-right: 38px; }
.follow-profile-modal-card .follow-photo-form,
.follow-profile-modal-card .follow-name-form { width: 100%; }
.follow-profile-modal-card .follow-photo-picker { width: 100%; }
.follow-countdown { min-height: 1.25em; }
@media (max-width: 620px) {
  .follow-profile-trigger { margin-top: 8px; }
  .follow-profile-hint { font-size: .74rem; }
}


/* 6.9.0: polished ready-card interaction and profile editor. */
.follow-status-card.is-ready-link,
.follow-next-game.is-ready-link {
  cursor: pointer;
  touch-action: pan-y pinch-zoom;
  border-color: rgba(65,224,149,.42);
  box-shadow: 0 18px 50px rgba(0,0,0,.25), inset 0 0 0 1px rgba(65,224,149,.08);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.follow-status-card.is-ready-link:hover,
.follow-status-card.is-ready-link:focus-visible,
.follow-next-game.is-ready-link:hover,
.follow-next-game.is-ready-link:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(90,238,170,.72);
  box-shadow: 0 22px 58px rgba(0,0,0,.31), 0 0 0 4px rgba(65,224,149,.08);
  outline: none;
}
.follow-status-card.is-ready-link:active,
.follow-next-game.is-ready-link:active { transform: scale(.997); }
.follow-board-readiness {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px 14px;
  margin-top: 14px;
  padding: 13px;
  border: 1px solid rgba(255,194,82,.24);
  border-radius: 15px;
  background: rgba(77,50,8,.2);
}
.follow-board-readiness[hidden] { display: none !important; }
.follow-board-readiness p { margin: 0; color: #c7d5df; font-size: 11px; line-height: 1.45; }
.follow-board-readiness .button { min-width: 154px; justify-content: center; }
@media (max-width: 620px) {
  .follow-board-readiness { grid-template-columns: 1fr; }
  .follow-board-readiness .button { width: 100%; }
}
.follow-status-card.is-ready-link #followDetail {
  color: #b9f6d6;
  font-weight: 800;
}

/* 7.8.18: spacious full-page creator controls and intentional solo pairing. */
.creator-page-shell {
  min-height: 100dvh;
  padding: clamp(12px, 2.4vw, 28px);
  color: var(--text);
  background: radial-gradient(circle at 15% 0%, rgba(43,160,232,.17), transparent 38%), var(--bg);
}
.creator-page-header {
  position: sticky;
  z-index: 20;
  top: 10px;
  width: min(1480px, 100%);
  margin: 0 auto 18px;
  padding: clamp(18px, 2.4vw, 28px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border-radius: 24px;
}
.creator-page-header h1 { margin: 4px 0; font-size: clamp(1.75rem, 3vw, 2.8rem); }
.creator-page-header p { margin: 0; color: var(--muted); }
.creator-page-header-actions, .creator-form-actions, .creator-pairing-actions,
.creator-danger-zone > div:last-child { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.creator-page-main { width: min(1480px, 100%); margin: 0 auto; }
.creator-unlock { max-width: 560px; margin: 9vh auto 0; padding: clamp(24px, 5vw, 44px); border-radius: 26px; }
.creator-unlock h2 { margin: 8px 0; }
.creator-unlock p { color: var(--muted); }
.creator-unlock form { display: grid; gap: 14px; margin-top: 22px; }
.creator-workspace { display: grid; gap: 18px; }
.creator-workspace[hidden] { display: none !important; }
.creator-page-section { padding: clamp(18px, 3vw, 32px); border-radius: 26px; }
.creator-settings-form { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.creator-settings-form .field-wide { grid-column: 1 / -1; }
.creator-signup-toggle { border-color: rgba(72,221,149,.28); background: rgba(35,126,82,.1); }
.creator-state-pill { padding: 8px 12px; border: 1px solid var(--line); border-radius: 999px; color: #b9c9d6; font-size: .78rem; font-weight: 900; }
.creator-state-pill.is-open { color: #9bf4c6; border-color: rgba(75,225,153,.38); background: rgba(38,139,88,.13); }
.creator-form-actions { justify-content: flex-end; }
.creator-form-actions .form-error { margin-right: auto; }
.creator-add-team-form { display: grid; grid-template-columns: 1.15fr 1fr 1fr auto auto; gap: 10px; align-items: stretch; margin: 18px 0; }
.creator-add-team-form > * { min-width: 0; }
.creator-pairing-panel { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px; margin: 20px 0; border: 1px solid rgba(92,198,255,.22); border-radius: 19px; background: rgba(33,130,192,.08); }
.creator-pairing-panel p { margin: 5px 0 0; color: var(--muted); }
.creator-finalize-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin: -6px 0 20px;
  padding: 19px;
  border: 1px solid rgba(91,205,255,.34);
  border-radius: 19px;
  background: linear-gradient(135deg, rgba(27,126,190,.16), rgba(24,73,114,.09));
  box-shadow: inset 0 1px rgba(255,255,255,.04);
}
.creator-finalize-panel > div { display: grid; gap: 5px; min-width: 0; }
.creator-finalize-panel strong { color: #effaff; font-size: 1.02rem; }
.creator-finalize-panel p { margin: 0; color: var(--muted); }
.creator-finalize-panel.is-finalized { border-color: rgba(78,230,151,.4); background: linear-gradient(135deg, rgba(31,145,91,.17), rgba(23,74,59,.1)); }
.creator-finalize-panel.is-finalized .eyebrow { color: #79efb2; }
.creator-solo-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 12px; }
.creator-solo-card { display: grid; grid-template-columns: auto auto minmax(0,1fr); align-items: center; gap: 12px; padding: 15px; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,.025); }
.creator-solo-card.is-paired { opacity: .78; }
.creator-solo-card > div:not(.creator-card-actions) { display: grid; gap: 5px; min-width: 0; }
.creator-solo-card input[type="text"], .creator-solo-card div > input { width: 100%; min-width: 0; }
.creator-solo-card small { color: var(--muted); }
.creator-solo-select { width: 22px; height: 22px; accent-color: #55c8ff; }
.creator-team-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(420px, 1fr)); gap: 15px; margin-top: 20px; }
.creator-team-card { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 16px; padding: 18px; border: 1px solid rgba(145,188,219,.17); border-radius: 20px; background: linear-gradient(145deg, rgba(255,255,255,.035), rgba(255,255,255,.015)); }
.creator-team-head { display: grid; align-content: start; justify-items: center; gap: 9px; }
.creator-team-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; min-width: 0; }
.creator-team-fields input:first-child { grid-column: 1 / -1; }
.creator-card-actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 9px; min-width: 0; }
.creator-photo-action { position: relative; overflow: hidden; }
.creator-photo-action input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.creator-danger-zone { display: flex; justify-content: space-between; align-items: center; gap: 24px; border-color: rgba(255,103,103,.18); }
.creator-danger-zone h2 { margin: 5px 0; }
.creator-danger-zone p { margin: 0; color: var(--muted); }
@media (max-width: 980px) {
  .creator-settings-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .creator-add-team-form { grid-template-columns: 1fr 1fr; }
  .creator-add-team-form > :first-child { grid-column: 1 / -1; }
  .creator-pairing-panel, .creator-finalize-panel, .creator-danger-zone { align-items: stretch; flex-direction: column; }
}
@media (max-width: 640px) {
  .creator-page-shell { padding: 8px 8px max(18px, env(safe-area-inset-bottom)); }
  .creator-page-header { position: relative; top: auto; align-items: stretch; flex-direction: column; border-radius: 19px; }
  .creator-page-header-actions .button { flex: 1; }
  .creator-settings-form, .creator-add-team-form { grid-template-columns: 1fr; }
  .creator-settings-form > *, .creator-add-team-form > :first-child { grid-column: 1; }
  .creator-solo-grid, .creator-team-grid { grid-template-columns: 1fr; }
  .creator-solo-card { grid-template-columns: auto auto minmax(0, 1fr); }
  .creator-team-card { grid-template-columns: 1fr; }
  .creator-team-head { grid-template-columns: auto 1fr; align-items: center; justify-items: start; }
  .creator-team-fields { grid-template-columns: 1fr; }
  .creator-team-fields input:first-child { grid-column: 1; }
  .creator-card-actions .button, .creator-card-actions .creator-photo-action { flex: 1 1 145px; justify-content: center; }
}

.follow-profile-dialog {
  width: min(620px, calc(100% - 24px));
  max-width: 620px;
  max-height: calc(100dvh - 24px);
  overflow: auto;
  padding: 0;
  border: 1px solid rgba(111,206,255,.28);
  border-radius: 28px;
  color: var(--text);
  background:
    radial-gradient(circle at 20% 0%, rgba(58,176,255,.19), transparent 42%),
    linear-gradient(155deg, rgba(18,40,62,.99), rgba(6,18,31,.99));
  box-shadow: 0 34px 100px rgba(0,0,0,.62), inset 0 1px rgba(255,255,255,.08);
}
.follow-profile-dialog::backdrop {
  background: rgba(2,8,14,.78);
  backdrop-filter: blur(10px);
}
.follow-profile-modal-card {
  position: relative;
  display: grid;
  gap: 18px;
  padding: clamp(22px, 5vw, 34px);
  border-radius: inherit;
  color: var(--text);
  background: transparent;
}
.follow-profile-modal-card h2 {
  margin: 4px 0 0;
  color: #fff;
  font-family: "Space Grotesk", sans-serif;
  font-size: clamp(1.65rem, 5vw, 2.35rem);
}
.follow-profile-modal-card .follow-profile-heading p {
  margin: 0;
  color: #9fb6c9;
  line-height: 1.55;
}
.follow-profile-modal-card .modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 50%;
  color: #fff;
  background: rgba(255,255,255,.065);
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
}
.follow-profile-modal-card .modal-close:hover,
.follow-profile-modal-card .modal-close:focus-visible {
  background: rgba(255,255,255,.12);
  border-color: rgba(121,214,255,.45);
  outline: none;
}
.follow-profile-modal-card .follow-name-form,
.follow-profile-modal-card .follow-photo-form {
  display: grid;
  gap: 11px;
  width: 100%;
  padding: 16px;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 19px;
  background: rgba(255,255,255,.035);
}
.follow-profile-modal-card .follow-name-form[hidden],
.follow-profile-modal-card .follow-photo-form[hidden] { display: none !important; }
.follow-profile-modal-card .follow-name-form label {
  display: grid;
  gap: 8px;
}
.follow-profile-modal-card .follow-name-form label > span {
  color: #b9d2e6;
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.follow-profile-modal-card .follow-name-form input {
  width: 100%;
  min-width: 0;
  padding: 13px 14px;
  border: 1px solid rgba(151,190,220,.24);
  border-radius: 14px;
  color: #fff;
  background: rgba(2,12,22,.68);
  outline: none;
  font: inherit;
}
.follow-profile-modal-card .follow-name-form input:focus {
  border-color: #5bc7ff;
  box-shadow: 0 0 0 3px rgba(91,199,255,.12);
}
.follow-profile-modal-card .follow-photo-picker {
  width: 100%;
  min-width: 0;
  padding: 13px;
  border: 1px solid rgba(151,190,220,.22);
  border-radius: 16px;
  color: #fff;
  background: rgba(2,12,22,.48);
}
.follow-profile-modal-card .follow-photo-picker strong { color: #fff; }
.follow-profile-modal-card .follow-photo-picker small { color: #91a9bc; }
.follow-profile-modal-card .photo-preview {
  border-color: rgba(108,207,255,.3);
  color: #8ee0ff;
  background: rgba(57,165,229,.12);
}
.follow-profile-modal-card .button {
  width: 100%;
  justify-content: center;
}
@media (max-width: 620px) {
  .follow-profile-dialog { width: calc(100% - 18px); max-height: calc(100dvh - 18px); border-radius: 23px; }
  .follow-profile-modal-card { padding: 22px 16px 18px; }
}

/* 6.8.0 — link-only private event creation */
.private-link-dialog .private-link-value {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .82rem;
  color: #f8fbff;
  background: rgba(2, 10, 20, .72);
  border: 1px solid rgba(125, 211, 252, .28);
}

.private-link-dialog .dialog-copy {
  color: rgba(235, 245, 255, .82);
  line-height: 1.55;
}

.private-link-actions {
  flex-wrap: wrap;
}

.private-link-actions .button {
  flex: 1 1 9rem;
}

@media (max-width: 620px) {
  .private-link-actions .button {
    flex-basis: 100%;
  }
}


/* 7.1.0: the ready card is the scoreboard link; no auto-open status line is rendered. */
#followCountdown { display: none !important; }
.follow-status-card.is-ready-link { user-select: none; -webkit-tap-highlight-color: transparent; }
.follow-status-card.is-ready-link::after {
  content: "Tap to open scoreboard";
  display: inline-flex;
  justify-self: center;
  margin-top: 14px;
  padding: 8px 13px;
  border: 1px solid rgba(65,224,149,.32);
  border-radius: 999px;
  color: #d8ffea;
  background: rgba(65,224,149,.10);
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .035em;
  text-transform: uppercase;
}


/* 7.2 profile-save reliability and center-seam side swap */
.follow-profile-form {
  display: grid;
  gap: 16px;
  margin-top: 16px;
}
.follow-profile-name-field,
.follow-profile-photo-field { min-width: 0; }
.follow-profile-actions {
  margin-top: 2px;
  justify-content: flex-end;
}
.follow-profile-actions .button { min-width: 132px; }

.score-grid { position: relative; }
.score-grid > .score-grid-swap {
  position: absolute;
  z-index: 35;
  left: 50%;
  top: 50%;
  width: 56px;
  height: 56px;
  transform: translate(-50%, -50%);
  border: 2px solid rgba(255,255,255,.38);
  color: #fff;
  background: rgba(5,14,24,.82);
  box-shadow: 0 12px 34px rgba(0,0,0,.42), 0 0 0 5px rgba(5,14,24,.22);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.score-grid > .score-grid-swap:hover { transform: translate(-50%, -50%) scale(1.06); }
.score-grid > .score-grid-swap:active { transform: translate(-50%, -50%) scale(.94); }
.score-grid > .score-grid-swap.active {
  color: #07150e;
  background: linear-gradient(145deg, #baffda, #55e6a0);
  border-color: rgba(216,255,233,.8);
}
@media (max-width: 620px) {
  .score-grid > .score-grid-swap {
    width: 49px;
    height: 49px;
    font-size: 20px;
    box-shadow: 0 9px 26px rgba(0,0,0,.42), 0 0 0 3px rgba(5,14,24,.22);
  }
}
@media (orientation: landscape) and (max-height: 620px) {
  .score-grid > .score-grid-swap {
    width: 48px;
    height: 48px;
  }
}


/* Version 7.3: waiting-room team stats and scrolling TV placements. */
.follow-team-stats {
  display: grid;
  gap: 14px;
  padding: 18px;
  border-radius: 22px;
}
.follow-team-stats[hidden] { display: none !important; }
.follow-team-stats-heading { align-items: end; }
.follow-team-stats-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 9px;
}
.follow-team-stats-grid > div {
  min-width: 0;
  padding: 13px 8px;
  border: 1px solid rgba(137, 195, 235, .16);
  border-radius: 15px;
  background: linear-gradient(145deg, rgba(16, 41, 62, .58), rgba(7, 22, 37, .5));
  text-align: center;
}
.follow-team-stats-grid strong,
.follow-team-stats-grid span { display: block; }
.follow-team-stats-grid strong {
  overflow: hidden;
  color: #fff;
  font-family: "Space Grotesk", sans-serif;
  font-size: clamp(18px, 4.8vw, 25px);
  line-height: 1.05;
  text-overflow: ellipsis;
}
.follow-team-stats-grid span {
  margin-top: 5px;
  color: #8fa9bd;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.follow-team-members {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid rgba(132, 188, 231, .14);
  border-radius: 15px;
  background: rgba(255,255,255,.025);
}
.follow-team-members[hidden] { display: none !important; }
.follow-team-members span { color: #8fa9bd; font-size: 10px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.follow-team-members strong { color: #eef8ff; font-size: 15px; }

.tv-display { grid-template-rows: auto minmax(0, 1fr) auto auto; }
.tv-placement-rail {
  position: relative;
  z-index: 26;
  grid-row: 3;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  width: min(1400px, 100%);
  min-width: 0;
  min-height: 58px;
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid rgba(132,188,231,.18);
  border-radius: 17px;
  background: linear-gradient(145deg, rgba(7,22,36,.94), rgba(4,14,24,.92));
  box-shadow: 0 12px 28px rgba(0,0,0,.3), inset 0 1px rgba(255,255,255,.04);
}
.tv-placement-rail[hidden] { display: none !important; }
.tv-placement-label {
  z-index: 2;
  display: grid;
  place-items: center;
  min-width: 142px;
  padding: 0 16px;
  border-right: 1px solid rgba(132,188,231,.16);
  background: linear-gradient(135deg, rgba(24,112,174,.42), rgba(8,43,72,.6));
}
.tv-placement-label span { color: #aee5ff; font-size: 10px; font-weight: 950; letter-spacing: .14em; white-space: nowrap; }
.tv-placement-window { min-width: 0; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 3%, #000 97%, transparent); mask-image: linear-gradient(90deg, transparent, #000 3%, #000 97%, transparent); }
.tv-placement-track {
  display: flex;
  width: max-content;
  height: 100%;
  align-items: center;
  gap: 12px;
  padding: 7px 12px;
  animation: tvPlacementScroll var(--placement-duration, 36s) linear infinite;
  will-change: transform;
}
.tv-placement-track.is-static { animation: none; }
.tv-placement-item {
  display: grid;
  grid-template-columns: auto auto minmax(118px, auto);
  align-items: center;
  gap: 9px;
  min-width: 238px;
  padding: 6px 12px 6px 8px;
  border: 1px solid rgba(132,188,231,.14);
  border-radius: 14px;
  background: rgba(255,255,255,.035);
}
.tv-placement-item.gold { border-color: rgba(255,208,74,.6); background: linear-gradient(135deg, rgba(137,96,8,.56), rgba(49,34,4,.58)); box-shadow: 0 0 22px rgba(255,199,51,.14); }
.tv-placement-item.silver { border-color: rgba(217,230,240,.5); background: linear-gradient(135deg, rgba(105,125,143,.48), rgba(32,44,55,.58)); }
.tv-placement-item.bronze { border-color: rgba(222,143,80,.55); background: linear-gradient(135deg, rgba(126,68,24,.52), rgba(48,27,12,.58)); }
.tv-placement-badge { min-width: 38px; color: #d9efff; font-family: "Space Grotesk", sans-serif; font-size: 20px; font-weight: 950; text-align: center; }
.tv-placement-item.gold .tv-placement-badge, .tv-placement-item.silver .tv-placement-badge, .tv-placement-item.bronze .tv-placement-badge { font-size: 25px; }
.tv-placement-avatar { width: 34px; height: 34px; font-size: 11px; }
.tv-placement-copy { min-width: 0; }
.tv-placement-copy strong, .tv-placement-copy small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.tv-placement-copy strong { color: #fff; font-size: 14px; }
.tv-placement-copy small { margin-top: 2px; color: #91aabd; font-size: 9px; font-weight: 750; letter-spacing: .03em; }
.tv-stats { grid-row: 4; }
@keyframes tvPlacementScroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

@media (max-width: 760px) {
  .follow-team-stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .follow-team-stats-grid > div:last-child { grid-column: 1 / -1; }
  .follow-team-members { align-items: flex-start; flex-direction: column; gap: 4px; }
  .tv-display { grid-template-rows: auto minmax(0, 1fr) auto auto; }
  .tv-placement-rail { min-height: 48px; border-radius: 12px; }
  .tv-placement-label { min-width: 88px; padding: 0 8px; }
  .tv-placement-label span { font-size: 7px; letter-spacing: .08em; }
  .tv-placement-track { gap: 7px; padding: 5px 8px; }
  .tv-placement-item { min-width: 196px; grid-template-columns: auto auto minmax(96px, auto); gap: 6px; padding: 4px 8px 4px 5px; border-radius: 10px; }
  .tv-placement-badge { min-width: 31px; font-size: 15px; }
  .tv-placement-item.gold .tv-placement-badge, .tv-placement-item.silver .tv-placement-badge, .tv-placement-item.bronze .tv-placement-badge { font-size: 19px; }
  .tv-placement-avatar { width: 28px; height: 28px; }
  .tv-placement-copy strong { font-size: 11px; }
  .tv-placement-copy small { font-size: 7px; }
}


/* Version 7.4: modal action spacing and lower waiting-room stats placement. */
.follow-profile-actions {
  display: flex;
  gap: 12px;
  margin: 10px 4px 4px;
  padding: 16px 2px 2px;
  border-top: 1px solid rgba(151,190,220,.16);
}
.follow-profile-actions .button {
  min-height: 46px;
}
.follow-team-stats {
  margin-top: clamp(10px, 3vh, 30px);
}
@media (max-width: 620px) {
  .follow-profile-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin: 8px 2px 2px;
    padding-top: 14px;
  }
  .follow-profile-actions .button {
    width: 100%;
    min-width: 0;
  }
  .follow-team-stats {
    margin-top: 18px;
  }
}


/* Version 7.5: separate winners/consolation trees for multi-elimination brackets */
.bracket-group-label {
  position: absolute;
  z-index: 4;
  display: flex;
  align-items: baseline;
  gap: 12px;
  min-width: 260px;
  padding: 8px 13px;
  border: 1px solid rgba(86, 196, 255, .24);
  border-radius: 13px;
  color: #fff;
  background: linear-gradient(135deg, rgba(19, 68, 103, .94), rgba(10, 32, 52, .94));
  box-shadow: 0 8px 24px rgba(0,0,0,.22), inset 0 1px rgba(255,255,255,.05);
  pointer-events: none;
}
.bracket-group-label strong { font-family: "Space Grotesk", sans-serif; font-size: 15px; letter-spacing: -.01em; }
.bracket-group-label span { color: #9ec7df; font-size: 9px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.bracket-group-label.consolation-1 { border-color: rgba(255, 187, 70, .34); background: linear-gradient(135deg, rgba(105, 65, 14, .92), rgba(45, 31, 12, .94)); }
.bracket-group-label.consolation-2 { border-color: rgba(255, 111, 126, .34); background: linear-gradient(135deg, rgba(100, 36, 51, .92), rgba(45, 20, 29, .94)); }
.bracket-group-divider { position: absolute; z-index: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(111, 181, 225, .2) 7%, rgba(111, 181, 225, .2) 93%, transparent); pointer-events: none; }
.multi-tree-column .round-header { opacity: .78; }
.multi-tree-column .game-card { z-index: 3; }
.connector-path.origin-path { stroke-width: 2.5; }
.connector-path.origin-path.loser-path { stroke-width: 2.35; }
.tv-display .bracket-group-label { padding: 7px 11px; border-radius: 11px; }
.tv-display .bracket-group-label strong { font-size: 13px; }
.tv-display .bracket-group-label span { font-size: 8px; }


/* Version 7.6: mirrored winners/consolation trees and stable live updates */
.bracket-group-label.right-facing { text-align: right; justify-content: flex-end; }
.bracket-group-label.center-facing {
  justify-content: center;
  min-width: 230px;
  border-color: rgba(82,224,158,.34);
  background: linear-gradient(135deg, rgba(18,91,66,.94), rgba(8,42,34,.95));
  text-align: center;
}
.right-tree-column .game-card { border-color: rgba(255,187,70,.25); }
.right-tree-column .game-card.live { border-color: rgba(82,224,158,.55); }
.multi-tree-column { pointer-events: none; }
.multi-tree-column .game-card { pointer-events: auto; }
.connector-path.origin-path { stroke: rgba(86,190,255,.58); stroke-dasharray: 7 7; }
.tv-display .connector-path.origin-path { stroke: rgba(102,205,255,.72); }

/* Version 7.8.5: compact TV context and untangled mirrored routes */
.connector-path.origin-path.right-tree-path {
  stroke: rgba(255, 190, 73, .72);
  filter: drop-shadow(0 0 4px rgba(255, 167, 35, .28));
}
.connector-dot.right-tree-dot {
  fill: #ffc45c;
  filter: drop-shadow(0 0 5px rgba(255, 174, 45, .62));
}
.tv-display .connector-path.origin-path {
  stroke-width: 2.3;
  stroke-dasharray: none;
  animation: none;
  opacity: .88;
}
.tv-display .tv-connector-backdrop {
  fill: none;
  stroke: rgba(3, 12, 21, .96);
  stroke-width: 7;
  stroke-linecap: round;
  stroke-linejoin: round;
  pointer-events: none;
}
.tv-display .connector-path.origin-path.right-tree-path { stroke: rgba(255, 195, 82, .82); }
.tv-display .right-tree-column .tv-game-card.tv-focus-card {
  border-color: rgba(255, 202, 101, .78);
  box-shadow: 0 0 0 2px rgba(255, 188, 63, .12), 0 18px 46px rgba(0,0,0,.42), 0 0 28px rgba(255, 174, 45, .16);
}
.tv-display .right-tree-column .tv-game-card.tv-context-card {
  border-color: rgba(255, 190, 73, .32);
}

/* Version 7.8.12: per-card Last Score readouts and a roomier coin-flip panel */
.last-stable-score {
  position: absolute;
  z-index: 33;
  left: 13px;
  bottom: calc(clamp(58px, 9vh, 90px) + 13px);
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  padding: 7px 10px;
  border: 1px solid rgba(255,255,255,.25);
  border-radius: 10px;
  color: rgba(240,249,255,.84);
  background: rgba(3,12,21,.64);
  box-shadow: 0 7px 22px rgba(0,0,0,.25);
  font-size: 10px;
  font-weight: 750;
  line-height: 1;
  pointer-events: none;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.last-stable-score strong {
  color: #fff;
  font-family: "Space Grotesk", sans-serif;
  font-size: 14px;
  font-weight: 950;
}

.coin-launcher {
  --coin-1: #168be0;
  --coin-2: #d9820d;
  position: absolute;
  z-index: 34;
  left: 50%;
  top: 50%;
  display: grid;
  width: 62px;
  height: 62px;
  place-items: center;
  padding: 0;
  border: 2px solid rgba(183,229,255,.46);
  border-radius: 50%;
  background: rgba(5,18,31,.88);
  box-shadow: 0 11px 30px rgba(0,0,0,.42), 0 0 0 4px rgba(5,14,24,.2), inset 0 1px rgba(255,255,255,.12);
  transform: translate(-50%, -50%);
  cursor: pointer;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.coin-launcher[hidden] { display: none !important; }
.coin-launcher:hover,
.coin-launcher:focus-visible { border-color: #8cddff; box-shadow: 0 12px 34px rgba(0,0,0,.46), 0 0 0 4px rgba(70,181,240,.18); outline: none; transform: translate(-50%, -50%) scale(1.07); }
.coin-launcher:active { transform: translate(-50%, -50%) scale(.94); }
.coin-launcher-disc {
  position: relative;
  display: block;
  width: 40px;
  height: 40px;
  border: 3px solid rgba(255,255,255,.68);
  border-radius: 50%;
  background: linear-gradient(90deg, var(--coin-1) 0 50%, var(--coin-2) 50% 100%);
  box-shadow: inset 0 0 0 3px rgba(0,0,0,.16), inset 0 7px 10px rgba(255,255,255,.24);
}
.coin-launcher-disc::after {
  content: "";
  position: absolute;
  inset: 7px;
  border: 1px solid rgba(255,255,255,.5);
  border-radius: 50%;
}
.coin-flip-panel {
  --coin-1: #168be0;
  --coin-1-light: #79dcff;
  --coin-1-dark: #07549a;
  --coin-1-ink: #fff;
  --coin-2: #d9820d;
  --coin-2-light: #ffe58a;
  --coin-2-dark: #8b4505;
  --coin-2-ink: #fff;
  position: absolute;
  z-index: 34;
  left: 50%;
  top: auto;
  bottom: calc(50% - 64px);
  width: min(280px, 44vw);
  padding: 14px 16px 13px;
  border: 1px solid rgba(167, 222, 255, .42);
  border-radius: 22px;
  color: #f4fbff;
  background:
    radial-gradient(circle at 50% 0, rgba(67, 187, 255, .23), transparent 62%),
    rgba(4, 15, 27, .9);
  box-shadow: 0 18px 52px rgba(0,0,0,.48), inset 0 1px rgba(255,255,255,.13), 0 0 0 5px rgba(3,13,24,.18);
  text-align: center;
  transform: translateX(-50%);
  pointer-events: none;
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
}
.coin-flip-panel[hidden] { display: none !important; }
.coin-panel-close {
  position: absolute;
  z-index: 2;
  top: 5px;
  right: 6px;
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 50%;
  color: #b9d3e4;
  background: rgba(255,255,255,.07);
  font: 800 18px/1 sans-serif;
  cursor: pointer;
  pointer-events: auto;
}
.coin-panel-close:hover,
.coin-panel-close:focus-visible { color: #fff; background: rgba(255,255,255,.14); outline: 2px solid rgba(126,215,255,.6); }
.coin-panel-close:disabled { opacity: .3; cursor: default; }
.coin-flip-kicker {
  display: block;
  margin-bottom: 4px;
  color: #a8dfff;
  font-size: 9px;
  font-weight: 1000;
  letter-spacing: .14em;
}
.coin-flip-button {
  display: grid;
  width: 100%;
  justify-items: center;
  gap: 3px;
  padding: 0;
  border: 0;
  color: inherit;
  background: transparent;
  cursor: pointer;
  pointer-events: auto;
}
.coin-flip-button:disabled { cursor: default; opacity: 1; }
.coin-flip-button:focus-visible { outline: 2px solid #86d8ff; outline-offset: 4px; border-radius: 13px; }
.coin-flip-button strong { max-width: 100%; font: 950 14px/1.15 "Space Grotesk", sans-serif; overflow-wrap: anywhere; }
.coin-stage {
  display: grid;
  width: 61px;
  height: 66px;
  place-items: center;
  perspective: 500px;
  filter: drop-shadow(0 10px 9px rgba(0,0,0,.42));
}
.game-coin {
  position: relative;
  display: block;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  transform-style: preserve-3d;
  transition: transform .35s ease-out;
}
.coin-face {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  border: 4px solid rgba(255,255,255,.66);
  border-radius: 50%;
  box-shadow: inset 0 0 0 3px rgba(0,0,0,.16), inset 0 7px 13px rgba(255,255,255,.28);
  color: #fff;
  font: 1000 22px/1 "Space Grotesk", sans-serif;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.coin-face-one { color: var(--coin-1-ink); background: radial-gradient(circle at 35% 27%, var(--coin-1-light), var(--coin-1) 55%, var(--coin-1-dark)); }
.coin-face-two { color: var(--coin-2-ink); background: radial-gradient(circle at 35% 27%, var(--coin-2-light), var(--coin-2) 55%, var(--coin-2-dark)); transform: rotateY(180deg); }
.game-coin.landed-one { transform: rotateY(0deg); }
.game-coin.landed-two { transform: rotateY(180deg); }
.game-coin.flipping { animation: gameCoinToss 1.3s cubic-bezier(.2,.75,.22,1) both; }
@keyframes gameCoinToss {
  0% { transform: translateY(5px) rotateY(0) rotateX(8deg) scale(.94); }
  34% { transform: translateY(-20px) rotateY(720deg) rotateX(-15deg) scale(1.12); }
  75% { transform: translateY(-5px) rotateY(1440deg) rotateX(9deg) scale(1.03); }
  100% { transform: translateY(0) rotateY(1800deg) rotateX(0) scale(1); }
}
.coin-flip-panel p {
  margin: 4px auto 0;
  max-width: 245px;
  color: #b8cddd;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.3;
}
.score-grid.coin-visible > .score-grid-swap { top: calc(50% + 105px); }

@media (max-width: 620px) {
  .last-stable-score { left: 9px; bottom: 67px; padding: 6px 8px; font-size: 9px; }
  .last-stable-score strong { font-size: 13px; }
  .coin-launcher { width: 56px; height: 56px; }
  .coin-launcher-disc { width: 36px; height: 36px; }
  .coin-flip-panel { bottom: calc(50% - 54px); width: min(230px, 72vw); padding: 12px 13px 13px; border-radius: 19px; }
  .coin-stage { width: 52px; height: 56px; }
  .game-coin { width: 48px; height: 48px; }
  .coin-face { border-width: 3px; font-size: 18px; }
  .coin-flip-button strong { font-size: 12px; }
  .coin-flip-panel p { font-size: 9px; }
  .score-grid.coin-visible > .score-grid-swap { top: calc(50% + 88px); }
}
@media (orientation: landscape) and (max-height: 620px) {
  .last-stable-score { left: 9px; bottom: 49px; padding: 6px 8px; font-size: 9px; }
  .last-stable-score strong { font-size: 13px; }
  .coin-launcher { width: 52px; height: 52px; }
  .coin-launcher-disc { width: 33px; height: 33px; border-width: 2px; }
  .coin-flip-panel { bottom: calc(50% - 39px); width: 210px; padding: 9px 11px 10px; }
  .coin-flip-kicker { margin-bottom: 2px; font-size: 8px; }
  .coin-stage { width: 44px; height: 45px; }
  .game-coin { width: 42px; height: 42px; }
  .coin-face { font-size: 16px; }
  .coin-flip-button strong { font-size: 11px; }
  .coin-flip-panel p { margin-top: 3px; font-size: 8px; }
  .score-grid.coin-visible > .score-grid-swap { top: calc(50% + 73px); }
}
@media (prefers-reduced-motion: reduce) {
  .game-coin.flipping { animation-duration: .35s; }
}

/* Version 7.8.8: team waiting-room results */
.follow-previous-games {
  display: grid;
  gap: 2px;
  margin-top: clamp(10px, 2vh, 22px);
  padding: 18px;
  border-radius: 22px;
}
.follow-previous-games[hidden] { display: none !important; }
.follow-previous-games-list { display: grid; gap: 9px; }
.follow-previous-game {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-width: 0;
  padding: 11px 13px;
  border: 1px solid rgba(137,195,235,.16);
  border-radius: 15px;
  color: inherit;
  background: linear-gradient(145deg, rgba(16,41,62,.52), rgba(7,22,37,.46));
  text-decoration: none;
}
.follow-previous-game:hover,
.follow-previous-game:focus-visible { border-color: rgba(103,204,255,.48); background: rgba(65,169,226,.12); outline: none; }
.follow-previous-outcome {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border-radius: 9px;
  color: #06150e;
  background: #56e7a0;
  font: 1000 13px/1 "Space Grotesk", sans-serif;
}
.follow-previous-game.lost .follow-previous-outcome { color: #fff; background: #8f5c69; }
.follow-previous-copy { display: grid; min-width: 0; gap: 3px; }
.follow-previous-copy strong,
.follow-previous-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.follow-previous-copy strong { color: #f4faff; font-size: 14px; }
.follow-previous-copy small { color: #8fa9bd; font-size: 10px; font-weight: 750; }
.follow-previous-game b { color: #fff; font: 950 18px/1 "Space Grotesk", sans-serif; }
@media (max-width: 620px) {
  .follow-previous-games { padding: 15px; }
  .follow-previous-game { gap: 9px; padding: 10px; }
  .follow-previous-copy strong { font-size: 13px; }
}

/* Version 7.8.14: live desk notifications and controllable board queue. */
.event-activity-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  margin: 0 0 14px;
  padding: 12px 14px;
  border-radius: 18px;
}
.event-activity-panel[hidden] { display: none !important; }
.event-activity-group { display: grid; min-width: 0; gap: 7px; }
.event-activity-list { display: flex; min-width: 0; gap: 7px; overflow-x: auto; scrollbar-width: thin; }
.event-activity-item {
  display: grid;
  grid-template-columns: auto minmax(88px, auto) auto;
  align-items: center;
  gap: 7px;
  flex: 0 0 auto;
  min-height: 36px;
  padding: 5px 9px;
  border: 1px solid rgba(126,190,231,.17);
  border-radius: 11px;
  color: inherit;
  background: rgba(255,255,255,.03);
  text-decoration: none;
}
.event-activity-item:hover, .event-activity-item:focus-visible { border-color: rgba(101,207,255,.5); outline: none; }
.event-activity-item > span { color: #5ce7a2; font-weight: 950; }
.event-activity-item.board-call > span { color: #72d6ff; }
.event-activity-item strong { overflow: hidden; max-width: 220px; white-space: nowrap; text-overflow: ellipsis; font-size: 11px; }
.event-activity-item em { color: #a9bed0; font-size: 10px; font-style: normal; font-weight: 850; white-space: nowrap; }
.event-activity-empty { min-height: 36px; display: flex; align-items: center; color: var(--muted); font-size: 10px; }

.board-queue-manager { display: grid; gap: 10px; margin-top: 16px; }
.board-queue-row {
  display: grid;
  grid-template-columns: minmax(150px, .85fr) minmax(220px, 1.4fr) auto;
  align-items: center;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: rgba(255,255,255,.025);
}
.board-queue-row.is-live { border-color: rgba(82,224,158,.3); }
.board-queue-copy { display: grid; min-width: 0; gap: 3px; }
.board-queue-copy strong, .board-queue-copy small { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.board-queue-copy small { color: var(--muted); font-size: 10px; }
.board-queue-row select { min-width: 0; width: 100%; padding: 10px; border: 1px solid var(--line); border-radius: 11px; color: var(--text); background: #071523; }

.tv-display { grid-template-rows: auto auto minmax(0, 1fr) auto auto; }
.tv-activity-rail {
  position: relative;
  z-index: 27;
  grid-row: 2;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) minmax(0, 1fr);
  align-items: stretch;
  width: min(1500px, 100%);
  min-width: 0;
  min-height: 54px;
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid rgba(132,188,231,.2);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(7,22,36,.95), rgba(4,14,24,.93));
  box-shadow: 0 12px 28px rgba(0,0,0,.28), inset 0 1px rgba(255,255,255,.04);
}
.tv-activity-rail[hidden] { display: none !important; }
.tv-activity-title { display: grid; min-width: 118px; place-items: center; padding: 0 14px; color: #aee5ff; background: rgba(24,112,174,.34); font-size: 10px; font-weight: 950; letter-spacing: .13em; }
.tv-activity-items { display: flex; min-width: 0; align-items: center; gap: 8px; padding: 7px 9px; overflow: hidden; border-left: 1px solid rgba(132,188,231,.13); }
.tv-activity-items[hidden] { display: none !important; }
.tv-activity-item { display: grid; grid-template-columns: auto minmax(95px, auto); align-items: center; gap: 8px; min-width: 0; padding: 4px 9px; border-radius: 11px; background: rgba(255,255,255,.035); }
.tv-activity-item > span { color: #5ce7a2; font: 950 12px/1 "Space Grotesk",sans-serif; }
.tv-activity-item.board > span { color: #79d9ff; }
.tv-activity-item > div { min-width: 0; }
.tv-activity-item strong, .tv-activity-item small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.tv-activity-item strong { color: #fff; font-size: 12px; }
.tv-activity-item small { margin-top: 2px; color: #92aabd; font-size: 8px; font-weight: 750; }
.tv-activity-rail.final-results { min-height: 72px; grid-template-columns: auto minmax(0, 1fr); border-color: rgba(255,205,75,.34); background: linear-gradient(135deg, rgba(57,39,5,.95), rgba(7,22,36,.95)); }
.tv-activity-rail.final-results .tv-activity-title { min-width: 168px; color: #ffe29a; background: rgba(167,112,8,.3); font-size: 13px; }
.tv-activity-rail.final-results .tv-activity-items { justify-content: space-around; }
.tv-activity-rail.final-results .tv-activity-item { flex: 1 1 0; max-width: 330px; background: rgba(255,224,146,.06); }
.tv-activity-rail.final-results .tv-activity-item.champion > span { font-size: 22px; }
.tv-activity-rail.final-results .tv-activity-item strong { font-size: 15px; }
.tv-bracket-viewport { grid-row: 3; }
.tv-pregame-stage {
  position: relative;
  z-index: 20;
  grid-row: 3;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-width: 0;
  min-height: 0;
  padding: clamp(18px, 2.8vw, 42px);
  overflow: hidden;
  border: 1px solid rgba(111,205,255,.18);
  border-radius: 22px;
  background:
    radial-gradient(circle at 50% 44%, rgba(35,151,219,.16), transparent 48%),
    linear-gradient(145deg, rgba(5,18,31,.88), rgba(3,12,21,.7));
  box-shadow: inset 0 1px rgba(255,255,255,.04);
}
.tv-pregame-stage[hidden] { display: none !important; }
.tv-pregame-heading { position: relative; z-index: 4; text-align: center; }
.tv-pregame-heading h2 { margin: 5px 0; color: #fff; font: 900 clamp(1.7rem, 3.4vw, 3.7rem)/1 "Space Grotesk",sans-serif; }
.tv-pregame-heading p { margin: 0; color: #a8c0d2; font-size: clamp(.72rem, 1.2vw, 1.05rem); }
.tv-pregame-player-grid,
.tv-reveal-team-grid {
  grid-row: 2;
  grid-column: 1;
  align-self: stretch;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  align-content: center;
  justify-content: center;
  gap: clamp(8px, 1.2vw, 18px);
  min-width: 0;
  min-height: 0;
  padding-top: clamp(16px, 2.4vh, 32px);
  overflow: hidden;
}
.tv-pregame-player-grid[hidden], .tv-reveal-team-grid[hidden] { display: none !important; }
.tv-pregame-player-card {
  position: relative;
  z-index: 6;
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 11px;
  padding: clamp(9px, 1.2vw, 15px);
  border: 1px solid rgba(116,208,255,.27);
  border-radius: 17px;
  color: #fff;
  background: linear-gradient(145deg, rgba(20,75,111,.9), rgba(7,29,47,.94));
  box-shadow: 0 12px 30px rgba(0,0,0,.26), inset 0 1px rgba(255,255,255,.06);
  will-change: transform, opacity;
}
.tv-pregame-player-avatar { width: clamp(42px, 4.4vw, 68px); height: clamp(42px, 4.4vw, 68px); flex: 0 0 auto; font-size: clamp(.9rem, 1.4vw, 1.35rem); }
.tv-pregame-player-card strong { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: clamp(.78rem, 1.25vw, 1.15rem); }
.tv-pregame-stage.is-revealing .tv-pregame-player-card { animation: tv-player-ready 1s ease-in-out infinite alternate; }
.tv-reveal-team-grid { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); z-index: 3; }
.tv-reveal-team-card {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  min-width: 0;
  padding: 14px;
  opacity: .28;
  border: 1px solid rgba(90,228,160,.42);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(21,104,76,.82), rgba(7,40,34,.94));
  box-shadow: 0 14px 36px rgba(0,0,0,.28);
  transform: scale(.92);
  transition: opacity .55s ease, transform .55s cubic-bezier(.2,.8,.22,1), box-shadow .55s ease;
}
.tv-pregame-stage.is-complete .tv-reveal-team-card { opacity: 1; transform: scale(1); box-shadow: 0 0 0 2px rgba(82,232,157,.1), 0 18px 44px rgba(0,0,0,.34), 0 0 28px rgba(61,222,145,.13); }
.tv-reveal-seed { position: absolute; top: 7px; right: 9px; color: #84efba; font-size: 7px; font-weight: 950; letter-spacing: .12em; }
.tv-reveal-team-avatar { width: clamp(50px, 5vw, 76px); height: clamp(50px, 5vw, 76px); }
.tv-reveal-team-card > div { min-width: 0; }
.tv-reveal-team-card > div > strong { display: block; overflow: hidden; color: #fff; white-space: nowrap; text-overflow: ellipsis; font: 900 clamp(.9rem, 1.45vw, 1.35rem)/1.1 "Space Grotesk",sans-serif; }
.tv-reveal-members { display: flex; min-width: 0; gap: 7px; margin-top: 8px; }
.tv-reveal-member-slot { display: flex; min-width: 0; align-items: center; gap: 5px; color: #c6e5d8; font-size: clamp(.62rem, .85vw, .78rem); }
.tv-reveal-member-slot i { display: grid; width: 24px; height: 24px; flex: 0 0 24px; place-items: center; overflow: hidden; border: 1px solid rgba(255,255,255,.28); border-radius: 50%; background: #153a31; font-style: normal; }
.tv-reveal-member-slot i img { width: 100%; height: 100%; object-fit: cover; }
.tv-reveal-member-slot em { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-style: normal; }
.tv-pregame-stage.is-leaving { animation: tv-team-stage-out .62s ease forwards; }
@keyframes tv-player-ready { to { border-color: rgba(114,222,255,.56); box-shadow: 0 15px 38px rgba(0,0,0,.3), 0 0 20px rgba(68,190,244,.14); } }
@keyframes tv-team-stage-out { to { opacity: 0; transform: scale(1.035); filter: blur(5px); } }
.tv-placement-rail { grid-row: 4; }
.tv-stats { grid-row: 5; }

@media (max-width: 760px) {
  .event-activity-panel { grid-template-columns: 1fr; }
  .event-activity-panel > .button { width: 100%; }
  .board-queue-row { grid-template-columns: 1fr; }
  .tv-display { grid-template-rows: auto auto minmax(0, 1fr) auto auto; }
  .tv-activity-rail { min-height: 44px; grid-template-columns: auto minmax(0, 1fr); border-radius: 11px; }
  .tv-activity-title { min-width: 74px; padding: 0 7px; font-size: 7px; }
  .tv-activity-items { gap: 4px; padding: 4px 5px; }
  .tv-activity-item { gap: 5px; padding: 3px 6px; }
  .tv-activity-item strong { font-size: 9px; }
  .tv-activity-item small { font-size: 6px; }
  .tv-activity-rail.final-results { min-height: 54px; }
  .tv-activity-rail.final-results .tv-activity-title { min-width: 94px; font-size: 8px; }
  .tv-activity-rail.final-results .tv-activity-item:nth-child(n+4) { display: none; }
  .tv-activity-rail.final-results .tv-activity-item strong { font-size: 10px; }
  .tv-pregame-stage { padding: 12px; border-radius: 14px; }
  .tv-pregame-player-grid { grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)); gap: 7px; padding-top: 10px; }
  .tv-pregame-player-card { gap: 7px; padding: 7px; border-radius: 11px; }
  .tv-pregame-player-avatar { width: 36px; height: 36px; }
  .tv-reveal-team-grid { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 7px; padding-top: 10px; }
  .tv-reveal-team-card { gap: 8px; padding: 9px; border-radius: 12px; }
  .tv-reveal-team-avatar { width: 44px; height: 44px; }
}

@media (prefers-reduced-motion: reduce) {
  .tv-pregame-stage.is-revealing .tv-pregame-player-card { animation: none; }
}

/* Version 7.8.22: resilient profile claims, event details, and pairing spotlights. */
.event-details {
  width: min(680px, 100%);
  margin-top: 12px;
  border: 1px solid rgba(104,199,247,.2);
  border-radius: 13px;
  background: rgba(24,91,132,.08);
}
.event-details[hidden] { display: none !important; }
.event-details summary { padding: 10px 12px; color: #bdeaff; font-size: 11px; font-weight: 900; cursor: pointer; }
.event-details p { padding: 0 12px 12px; white-space: pre-wrap; line-height: 1.55; }
.signup-event-details { margin: 16px 0 2px; padding: 14px 16px; border: 1px solid rgba(106,202,249,.2); border-radius: 16px; background: rgba(35,120,167,.075); }
.signup-event-details[hidden] { display: none !important; }
.signup-event-details p { margin: 7px 0 0; color: #c2d5e3; white-space: pre-wrap; line-height: 1.55; }
.signup-success:empty, .form-error:empty { display: none; }

.event-activity-panel {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: 14px;
  padding: 0;
  background: transparent;
}
.event-activity-card { display: grid; min-width: 0; gap: 8px; padding: 14px 16px; border-radius: 18px; }
.event-activity-card[hidden] { display: none !important; }
.event-recent-card { border-color: rgba(82,226,151,.2); background: linear-gradient(145deg, rgba(20,85,65,.22), rgba(6,22,35,.86)); }
.event-board-card { grid-template-columns: minmax(0, 1fr) auto; border-color: rgba(91,194,249,.23); background: linear-gradient(145deg, rgba(18,76,116,.25), rgba(6,22,35,.86)); }
.event-board-card > .eyebrow, .event-board-card > .event-activity-list { grid-column: 1; }
.event-board-card > .button { grid-column: 2; grid-row: 1 / span 2; align-self: center; }

.follow-paired-team-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 16px 18px; border-radius: 21px; }
.follow-paired-team-card[hidden] { display: none !important; }
.follow-paired-team-card > div { display: grid; min-width: 0; gap: 3px; }
.follow-paired-team-card strong { overflow: hidden; color: #fff; white-space: nowrap; text-overflow: ellipsis; font: 900 1.15rem/1.15 "Space Grotesk",sans-serif; }
.follow-paired-team-card small { color: var(--muted); }

.tv-pair-spotlight {
  position: fixed;
  z-index: 132;
  inset: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
  color: #fff;
  background: radial-gradient(circle at 50% 45%, rgba(42,211,143,.3), transparent 48%), rgba(2,10,18,.9);
  opacity: 0;
  transform: scale(.96);
  transition: opacity .25s ease, transform .35s cubic-bezier(.2,.8,.22,1);
}
.tv-pair-spotlight[hidden] { display: none !important; }
.tv-pair-spotlight.is-showing { opacity: 1; transform: scale(1); }
.tv-pair-spotlight.is-leaving { opacity: 0; transform: scale(1.035); }
.tv-pair-glow { position: absolute; width: min(74vw,780px); aspect-ratio: 1; border: 2px solid rgba(107,245,184,.25); border-radius: 50%; box-shadow: 0 0 120px rgba(49,220,150,.32), inset 0 0 100px rgba(75,224,163,.12); }
.tv-pair-content { position: relative; z-index: 2; display: grid; max-width: min(92vw,1100px); justify-items: center; gap: clamp(8px,1.6vh,18px); text-align: center; }
.tv-pair-photos { display: flex; justify-content: center; }
.tv-pair-photo { width: clamp(100px,14vw,190px); height: clamp(100px,14vw,190px); margin: 0 clamp(-10px,-.6vw,-4px); border: 5px solid rgba(255,255,255,.82); box-shadow: 0 24px 70px rgba(0,0,0,.45), 0 0 35px rgba(76,229,161,.25); font-size: clamp(1.5rem,3vw,3rem); }
.tv-pair-content h2 { margin: 0; font: 950 clamp(2.6rem,7vw,7rem)/.9 "Space Grotesk",sans-serif; text-shadow: 0 9px 32px rgba(0,0,0,.55); }
.tv-pair-content p { margin: 0; color: #d8f7e8; font-size: clamp(1.15rem,2.5vw,2.5rem); font-weight: 850; }
.tv-pair-content > strong { padding: 9px 16px; border: 1px solid rgba(100,239,176,.45); border-radius: 999px; color: #8ff0bd; background: rgba(31,137,90,.18); letter-spacing: .14em; }

@media (max-width: 760px) {
  .event-activity-panel { grid-template-columns: 1fr; }
  .event-board-card { grid-template-columns: 1fr; }
  .event-board-card > .eyebrow, .event-board-card > .event-activity-list, .event-board-card > .button { grid-column: 1; grid-row: auto; }
  .follow-paired-team-card { grid-template-columns: auto minmax(0, 1fr); }
  .follow-paired-team-card > .button { grid-column: 1 / -1; }
}

/* Version 7.8.23: team-first status, event-card spacing, and placement-first finals. */
.event-activity-panel { margin: 14px 0; }

/* Version 7.8.31: one readable, board-by-board event status panel. */
.event-activity-panel { grid-template-columns: minmax(0, 1fr); }
.event-board-card { grid-template-columns: minmax(0, 1fr) auto; }
.event-board-status-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap: 10px;
  min-width: 0;
}
.event-board-state {
  display: grid;
  min-width: 0;
  gap: 7px;
  padding: 12px 14px;
  border: 1px solid rgba(104, 196, 244, .2);
  border-radius: 14px;
  color: inherit;
  background: rgba(255, 255, 255, .035);
  text-decoration: none;
}
.event-board-state:hover, .event-board-state:focus-visible { border-color: rgba(102, 215, 255, .55); outline: none; }
.event-board-state.is-report {
  border-color: rgba(87, 190, 255, .46);
  animation: event-board-report-pulse 3.4s ease-in-out infinite;
}
.event-board-state.is-live {
  border-color: rgba(82, 235, 155, .58);
  background: linear-gradient(145deg, rgba(35, 156, 101, .38), rgba(15, 91, 64, .28));
  box-shadow: inset 0 1px rgba(188, 255, 220, .12), 0 10px 30px rgba(24, 143, 91, .14);
}
@keyframes event-board-report-pulse {
  0%, 100% { background: rgba(21, 84, 132, .18); box-shadow: inset 0 1px rgba(194, 231, 255, .04), 0 7px 22px rgba(17, 101, 167, .08); }
  50% { background: rgba(47, 143, 211, .34); box-shadow: inset 0 1px rgba(218, 243, 255, .14), 0 9px 30px rgba(28, 139, 216, .18); }
}
.event-board-state-heading { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 7px; }
.event-board-state-heading > b { color: #72d6ff; }
.event-board-state-heading > strong { overflow-wrap: anywhere; color: #fff; font-size: 13px; }
.event-board-state-heading > em { color: #96ddff; font-size: 9px; font-style: normal; font-weight: 950; letter-spacing: .08em; text-align: right; }
.event-board-state.is-live .event-board-state-heading > em { color: #70ecac; }
.event-board-matchup { overflow-wrap: anywhere; color: #f3f9fd; font-size: 12px; font-weight: 900; line-height: 1.25; }
.event-board-state > small { color: #a9bed0; font-size: 10px; font-weight: 800; line-height: 1.3; }
@media (max-width: 760px) {
  .event-board-card { grid-template-columns: 1fr; }
  .event-board-card > .eyebrow, .event-board-card > .event-board-status-grid, .event-board-card > .button { grid-column: 1; grid-row: auto; }
}
@media (prefers-reduced-motion: reduce) {
  .event-board-state.is-report { animation: none; background: rgba(37, 120, 180, .26); }
}

/* Version 7.8.24: separate, information-dense 4K tournament display. */
.tv2-shell {
  width: 100vw;
  height: 100svh;
  min-height: 0;
  overflow: hidden;
  color: #f6fbff;
  background:
    radial-gradient(circle at 18% 14%, rgba(22,142,211,.16), transparent 31%),
    radial-gradient(circle at 82% 72%, rgba(17,151,107,.1), transparent 33%),
    linear-gradient(145deg, #020810, #06101a 52%, #02070d);
}
.tv2-shell::before { opacity: .035; background-size: 64px 64px; }
.tv2-display {
  position: relative;
  z-index: 1;
  display: grid;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  grid-template-rows: minmax(70px, 5.2vh) minmax(0, 1fr) minmax(50px, 4.1vh);
  gap: clamp(5px, .28vw, 12px);
  padding: clamp(5px, .32vw, 14px);
}
.tv2-live-strip {
  display: grid;
  min-width: 0;
  min-height: 0;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.35fr);
  gap: clamp(5px, .28vw, 12px);
}
.tv2-strip-block {
  display: grid;
  min-width: 0;
  min-height: 0;
  grid-template-columns: max-content minmax(0, 1fr);
  align-items: stretch;
  border: 1px solid rgba(119,180,222,.2);
  border-radius: clamp(6px, .38vw, 15px);
  background: linear-gradient(100deg, rgba(8,26,42,.96), rgba(5,15,25,.9));
  box-shadow: inset 0 1px rgba(255,255,255,.035);
}
.tv2-recent-block { border-color: rgba(73,225,151,.22); }
.tv2-board-block { border-color: rgba(63,174,245,.26); }
.tv2-strip-label {
  display: grid;
  min-width: clamp(100px, 7.1vw, 270px);
  place-items: center;
  padding: 0 clamp(7px, .45vw, 17px);
  border-right: 1px solid rgba(140,190,224,.16);
  color: #80d5ff;
  letter-spacing: .13em;
  font: 950 clamp(10px, .54vw, 21px)/1 "Space Grotesk",sans-serif;
  text-align: center;
}
.tv2-recent-block .tv2-strip-label { color: #7aeab3; }
.tv2-strip-items {
  display: grid;
  min-width: 0;
  min-height: 0;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  align-items: stretch;
}
.tv2-strip-item {
  display: grid;
  min-width: 0;
  grid-template-columns: max-content minmax(0, 1fr);
  align-items: center;
  gap: clamp(4px, .28vw, 11px);
  padding: clamp(3px, .18vw, 8px) clamp(5px, .36vw, 14px);
  border-right: 1px solid rgba(143,187,219,.12);
}
.tv2-strip-item:last-child { border-right: 0; }
.tv2-strip-item > b {
  display: grid;
  min-width: clamp(25px, 1.55vw, 60px);
  min-height: clamp(25px, 1.55vw, 60px);
  place-items: center;
  border: 1px solid rgba(100,207,255,.32);
  border-radius: 50%;
  color: #8bdcff;
  background: rgba(34,128,181,.15);
  font: 950 clamp(9px, .48vw, 19px)/1 "Space Grotesk",sans-serif;
}
.tv2-strip-item.is-winner > b, .tv2-strip-item.is-champion > b { border-color: rgba(84,234,161,.37); color: #83edb8; background: rgba(35,140,91,.17); }
.tv2-strip-item.is-live > b { border-color: rgba(255,91,117,.46); color: #ff9aaa; background: rgba(170,34,59,.2); }
.tv2-strip-item.is-board > b { border-color: rgba(255,187,64,.36); color: #ffd27d; background: rgba(161,103,15,.18); }
.tv2-strip-item.is-quiet { opacity: .68; }
.tv2-strip-item > span { display: grid; min-width: 0; align-content: center; gap: 2px; }
.tv2-strip-item strong {
  min-width: 0;
  color: #f6fbff;
  overflow-wrap: anywhere;
  font: 900 clamp(11px, .64vw, 25px)/1.02 "Space Grotesk",sans-serif;
}
.tv2-strip-item em { color: #8fa8bd; font: 750 clamp(8px, .45vw, 17px)/1.05 Inter,sans-serif; }

.tv2-main-grid {
  display: grid;
  min-width: 0;
  min-height: 0;
  grid-template-columns: minmax(0, 1fr) clamp(300px, 18vw, 720px);
  gap: clamp(5px, .28vw, 12px);
}
.tv2-bracket-stage, .tv2-bracket-viewport, .tv2-path-stack { min-width: 0; min-height: 0; }
.tv2-pregame[hidden], .tv2-bracket-viewport[hidden], .tv2-rank-rail[hidden],
.tv2-error-note[hidden], .tv2-final-podium[hidden] { display: none !important; }
.tv2-bracket-stage {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(102,181,231,.2);
  border-radius: clamp(7px, .42vw, 17px);
  background:
    linear-gradient(rgba(40,104,146,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(40,104,146,.045) 1px, transparent 1px),
    linear-gradient(145deg, rgba(7,24,39,.95), rgba(3,12,21,.97));
  background-size: clamp(36px, 2.5vw, 96px) clamp(36px, 2.5vw, 96px), clamp(36px, 2.5vw, 96px) clamp(36px, 2.5vw, 96px), auto;
  box-shadow: inset 0 1px rgba(255,255,255,.035);
}
.tv2-bracket-viewport { position: absolute; inset: 0; overflow: hidden; }
.tv2-path-stack {
  position: absolute;
  z-index: 2;
  inset: 0;
  display: grid;
  gap: clamp(5px, .28vw, 12px);
  padding: clamp(5px, .28vw, 12px);
}
.tv2-path {
  display: grid;
  min-width: 0;
  min-height: 0;
  grid-template-rows: clamp(22px, 1.35vw, 52px) minmax(0, 1fr);
  overflow: hidden;
  border: 1px solid rgba(112,170,207,.15);
  border-radius: clamp(5px, .3vw, 12px);
  background: linear-gradient(90deg, rgba(12,36,55,.58), rgba(5,17,29,.45));
}
.tv2-path-consolation-1, .tv2-path-consolation-2 { border-color: rgba(235,170,68,.19); background: linear-gradient(90deg, rgba(48,32,12,.33), rgba(13,21,28,.48)); }
.tv2-path-finals { border-color: rgba(87,222,158,.22); background: linear-gradient(90deg, rgba(10,49,41,.38), rgba(6,22,32,.55)); }
.tv2-path-heading {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0 clamp(6px, .4vw, 16px);
  border-bottom: 1px solid rgba(121,177,213,.13);
  color: #70cfff;
}
.tv2-path-consolation-1 .tv2-path-heading, .tv2-path-consolation-2 .tv2-path-heading { color: #ffc968; }
.tv2-path-finals .tv2-path-heading { color: #74e8ad; }
.tv2-path-heading strong { letter-spacing: .1em; font: 950 clamp(9px, .5vw, 20px)/1 "Space Grotesk",sans-serif; }
.tv2-path-heading span { color: #69859c; letter-spacing: .08em; font: 850 clamp(7px, .37vw, 14px)/1 Inter,sans-serif; }
.tv2-stage-track {
  display: grid;
  min-width: 0;
  min-height: 0;
  gap: clamp(5px, .3vw, 12px);
  padding: clamp(4px, .24vw, 10px);
}
.tv2-stage-column {
  display: grid;
  min-width: 0;
  min-height: 0;
  grid-template-rows: clamp(17px, .95vw, 36px) minmax(0, 1fr);
  gap: clamp(2px, .12vw, 5px);
}
.tv2-stage-flow {
  display: grid;
  min-width: 0;
  min-height: 0;
  place-content: center;
  gap: clamp(2px, .12vw, 5px);
  color: #65cfff;
  text-align: center;
  filter: drop-shadow(0 0 9px rgba(62,188,246,.28));
}
.tv2-stage-flow b { font: 1000 clamp(20px, 1.45vw, 56px)/.8 "Space Grotesk",sans-serif; }
.tv2-stage-flow small { color: #6c8ba0; letter-spacing: .06em; font: 950 clamp(6px, .31vw, 12px)/1 Inter,sans-serif; }
.tv2-path-consolation-1 .tv2-stage-flow, .tv2-path-consolation-2 .tv2-stage-flow { color: #ffc75f; filter: drop-shadow(0 0 9px rgba(245,179,60,.24)); }
.tv2-stage-label {
  min-width: 0;
  overflow: hidden;
  color: #728da2;
  letter-spacing: .07em;
  white-space: nowrap;
  text-align: center;
  font: 850 clamp(7px, .38vw, 15px)/1.05 Inter,sans-serif;
}
.tv2-stage-cards { display: grid; min-width: 0; min-height: 0; align-items: stretch; gap: clamp(4px, .22vw, 9px); }
.tv2-game-card {
  position: relative;
  display: grid;
  min-width: 0;
  min-height: 0;
  grid-template-rows: minmax(20px, .7fr) minmax(0, 1fr) minmax(0, 1fr);
  overflow: hidden;
  border: 1px solid rgba(114,178,219,.27);
  border-radius: clamp(5px, .28vw, 11px);
  background: linear-gradient(145deg, rgba(13,40,61,.98), rgba(5,18,31,.98));
  box-shadow: 0 5px 18px rgba(0,0,0,.25), inset 0 1px rgba(255,255,255,.045);
  transition: border-color .25s ease, box-shadow .25s ease, opacity .25s ease, transform .25s ease;
}
.tv2-game-card.is-context { opacity: .79; }
.tv2-game-card.is-focus { border-width: 2px; border-color: rgba(64,191,255,.75); box-shadow: 0 0 0 1px rgba(54,166,226,.16), 0 0 26px rgba(37,145,209,.21), inset 0 1px rgba(255,255,255,.06); }
.tv2-game-card.is-live { border-color: rgba(255,83,112,.82); box-shadow: 0 0 0 1px rgba(255,80,111,.14), 0 0 30px rgba(220,43,76,.22); }
.tv2-game-card.is-championship { border-color: rgba(85,232,161,.65); }
.tv2-game-card.is-placement { border-color: rgba(255,192,72,.58); }
.tv2-game-top {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
  padding: clamp(2px, .12vw, 5px) clamp(5px, .34vw, 13px);
  border-bottom: 1px solid rgba(125,178,213,.15);
  background: rgba(1,9,16,.36);
}
.tv2-game-top span {
  min-width: 0;
  color: #a9c4d8;
  overflow-wrap: anywhere;
  font: 850 clamp(7px, .39vw, 15px)/1.05 Inter,sans-serif;
}
.tv2-game-top b {
  flex: none;
  color: #7dd8ff;
  letter-spacing: .08em;
  font: 950 clamp(7px, .4vw, 16px)/1 "Space Grotesk",sans-serif;
}
.tv2-game-card.is-live .tv2-game-top b { color: #ff8ca0; }
.tv2-team-row {
  display: grid;
  min-width: 0;
  min-height: 0;
  grid-template-columns: clamp(34px, 2.1vw, 82px) minmax(0, 1fr) max-content max-content;
  align-items: center;
  gap: clamp(3px, .23vw, 9px);
  padding: clamp(2px, .12vw, 5px) clamp(5px, .32vw, 12px);
  border-bottom: 1px solid rgba(130,179,210,.11);
}
.tv2-team-copy { display: grid; min-width: 0; align-content: center; gap: clamp(1px, .06vw, 3px); }
.tv2-team-row:last-child { border-bottom: 0; }
.tv2-team-row.is-winner { background: linear-gradient(90deg, rgba(39,182,111,.16), transparent 70%); }
.tv2-team-row.is-tbd { opacity: .48; }
.tv2-team-name {
  min-width: 0;
  color: #f5faff;
  overflow-wrap: anywhere;
  font: 900 clamp(10px, .67vw, 27px)/1.02 "Space Grotesk",sans-serif;
}
.tv2-team-origin { color: #7398b1; overflow: hidden; letter-spacing: .025em; white-space: nowrap; text-overflow: ellipsis; font: 800 clamp(6px, .34vw, 13px)/1 Inter,sans-serif; }
.tv2-team-origin.is-loser { color: #c59a55; }
.tv2-team-rank { color: #6f8ca3; font: 850 clamp(8px, .45vw, 18px)/1 Inter,sans-serif; }
.tv2-team-score { min-width: 1.35em; color: #fff; text-align: right; font: 950 clamp(17px, 1.12vw, 44px)/.9 "Space Grotesk",sans-serif; }
.tv2-avatar {
  position: relative;
  display: grid;
  overflow: hidden;
  place-items: center;
  flex: none;
  aspect-ratio: 1;
  border: 1px solid rgba(150,211,245,.35);
  border-radius: 50%;
  color: #bce9ff;
  background: linear-gradient(145deg, rgba(51,151,206,.3), rgba(10,43,67,.82));
  font: 900 clamp(9px, .5vw, 19px)/1 "Space Grotesk",sans-serif;
}
.tv2-avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.tv2-avatar.is-rotating img:first-child { animation: tv2-avatar-a 7s infinite; }
.tv2-avatar.is-rotating img:nth-child(2) { animation: tv2-avatar-b 7s infinite; }
@keyframes tv2-avatar-a { 0%,43%{opacity:1} 50%,93%{opacity:0} 100%{opacity:1} }
@keyframes tv2-avatar-b { 0%,43%{opacity:0} 50%,93%{opacity:1} 100%{opacity:0} }
.tv2-card-avatar { width: clamp(34px, 2.1vw, 82px); }
.tv2-path[data-density="5"] .tv2-team-name, .tv2-path[data-density="6"] .tv2-team-name,
.tv2-path[data-density="7"] .tv2-team-name, .tv2-path[data-density="8"] .tv2-team-name { font-size: clamp(8px, .54vw, 21px); }
.tv2-path[data-density="7"] .tv2-card-avatar, .tv2-path[data-density="8"] .tv2-card-avatar { width: clamp(28px, 1.62vw, 62px); }
.tv2-path[data-density="7"] .tv2-team-row, .tv2-path[data-density="8"] .tv2-team-row { padding-block: 1px; }
.tv2-team-row.score-changed { animation: tv2-score-pulse 1.35s ease; }
@keyframes tv2-score-pulse { 0%{background:rgba(72,210,148,.04)} 22%{background:rgba(72,210,148,.46);box-shadow:inset 0 0 26px rgba(70,225,151,.22)} 100%{background:transparent} }
.tv2-game-card.winner-flash { animation: tv2-winner-flash 1.4s ease infinite alternate; }
@keyframes tv2-winner-flash { from{box-shadow:0 0 12px rgba(71,220,149,.18)} to{box-shadow:0 0 42px rgba(71,220,149,.48)} }
.tv2-rank-rail {
  display: grid;
  min-width: 0;
  min-height: 0;
  grid-template-rows: minmax(38px, 2.4vw) minmax(0, 1fr) max-content;
  overflow: hidden;
  border: 1px solid rgba(91,182,233,.21);
  border-radius: clamp(7px, .42vw, 17px);
  background: linear-gradient(155deg, rgba(8,28,44,.98), rgba(3,13,22,.98));
  box-shadow: inset 0 1px rgba(255,255,255,.04);
}
.tv2-rank-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0 clamp(8px, .55vw, 21px);
  border-bottom: 1px solid rgba(123,184,221,.16);
  color: #76d3ff;
  letter-spacing: .11em;
  font: 950 clamp(10px, .55vw, 22px)/1 "Space Grotesk",sans-serif;
}
.tv2-rank-heading strong { color: #fff; font-size: 1.3em; }
.tv2-rank-list { display: grid; min-height: 0; padding: clamp(3px, .18vw, 7px); }
.tv2-rank-item {
  display: grid;
  min-width: 0;
  min-height: 0;
  grid-template-columns: clamp(29px, 1.75vw, 68px) clamp(39px, 2.5vw, 96px) minmax(0, 1fr);
  align-items: center;
  gap: clamp(4px, .28vw, 11px);
  padding: clamp(2px, .12vw, 5px) clamp(5px, .34vw, 13px);
  border-bottom: 1px solid rgba(121,173,207,.12);
}
.tv2-rank-item:last-child { border-bottom: 0; }
.tv2-rank-item > b { color: #78d1fa; text-align: center; font: 950 clamp(12px, .75vw, 29px)/1 "Space Grotesk",sans-serif; }
.tv2-rank-avatar { width: clamp(39px, 2.5vw, 96px); }
.tv2-rank-item > div { display: grid; min-width: 0; align-content: center; gap: 2px; }
.tv2-rank-item strong { color: #f7fbff; overflow-wrap: anywhere; font: 900 clamp(11px, .68vw, 27px)/1.03 "Space Grotesk",sans-serif; }
.tv2-rank-item span { color: #809bb0; font: 750 clamp(8px, .46vw, 18px)/1.05 Inter,sans-serif; }
.tv2-rank-item.is-champion { background: linear-gradient(90deg, rgba(43,181,109,.2), transparent); }
.tv2-rank-item.is-champion > b { color: #64e6a4; }
.tv2-rank-item.is-eliminated { opacity: .62; background: linear-gradient(90deg, rgba(113,129,142,.07), transparent); }
.tv2-rank-item.is-eliminated .tv2-rank-avatar { filter: saturate(.55); }
.tv2-rank-overflow {
  padding: clamp(6px, .35vw, 14px);
  border-top: 1px solid rgba(111,176,217,.14);
  color: #91a9bb;
  background: rgba(255,255,255,.025);
  letter-spacing: .08em;
  text-align: center;
  font: 850 clamp(8px, .46vw, 18px)/1 Inter,sans-serif;
}

.tv2-status-bar {
  display: grid;
  min-width: 0;
  min-height: 0;
  grid-template-columns: repeat(4, minmax(82px, .5fr)) minmax(230px, 2fr) minmax(100px, .65fr);
  overflow: hidden;
  border: 1px solid rgba(102,181,229,.2);
  border-radius: clamp(6px, .34vw, 13px);
  background: linear-gradient(90deg, rgba(7,25,40,.98), rgba(4,15,25,.98));
}
.tv2-status-bar > div {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: center;
  gap: clamp(4px, .25vw, 10px);
  padding: 0 clamp(5px, .38vw, 15px);
  border-right: 1px solid rgba(121,179,215,.14);
}
.tv2-status-bar > div:last-child { border-right: 0; }
.tv2-status-bar span { color: #7893a8; letter-spacing: .08em; font: 850 clamp(7px, .4vw, 16px)/1 Inter,sans-serif; }
.tv2-status-bar strong { color: #edf9ff; overflow-wrap: anywhere; font: 950 clamp(13px, .82vw, 32px)/1 "Space Grotesk",sans-serif; }
.tv2-leader { justify-content: flex-start !important; }
.tv2-leader strong { color: #77e6ae; }
.tv2-sync i { width: clamp(7px, .42vw, 16px); aspect-ratio: 1; border-radius: 50%; background: #657786; box-shadow: 0 0 10px rgba(101,119,134,.3); }
.tv2-sync.is-online i { background: #55e39e; box-shadow: 0 0 13px rgba(85,227,158,.6); }

.tv2-pregame {
  position: absolute;
  inset: 0;
  display: grid;
  min-width: 0;
  min-height: 0;
  grid-template-rows: clamp(40px, 2.5vw, 96px) minmax(0, 1fr);
  gap: clamp(6px, .38vw, 15px);
  padding: clamp(8px, .55vw, 22px);
}
.tv2-pregame-line { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(97,188,239,.2); color: #79d3ff; }
.tv2-pregame-line strong { letter-spacing: .08em; font: 950 clamp(17px, 1.25vw, 48px)/1 "Space Grotesk",sans-serif; }
.tv2-pregame-line span { color: #708ca3; letter-spacing: .13em; font: 850 clamp(9px, .5vw, 19px)/1 Inter,sans-serif; }
.tv2-pregame-grid {
  display: grid;
  min-width: 0;
  min-height: 0;
  grid-template-columns: repeat(auto-fit, minmax(clamp(150px, 10vw, 390px), 1fr));
  grid-auto-rows: minmax(0, 1fr);
  gap: clamp(5px, .3vw, 12px);
}
.tv2-pregame-player {
  display: grid;
  min-width: 0;
  min-height: 0;
  grid-template-columns: clamp(42px, 3vw, 116px) minmax(0, 1fr);
  align-items: center;
  gap: clamp(5px, .36vw, 14px);
  padding: clamp(4px, .26vw, 10px);
  border: 1px solid rgba(107,181,226,.18);
  border-radius: clamp(5px, .3vw, 12px);
  background: rgba(11,35,53,.67);
}
.tv2-pregame-avatar { width: clamp(42px, 3vw, 116px); }
.tv2-pregame-player strong { min-width: 0; overflow-wrap: anywhere; font: 900 clamp(11px, .76vw, 30px)/1.04 "Space Grotesk",sans-serif; }
.tv2-error-note {
  position: absolute;
  z-index: 4;
  top: clamp(8px, .48vw, 19px);
  left: 50%;
  max-width: 70%;
  padding: clamp(7px, .38vw, 15px) clamp(11px, .68vw, 26px);
  border: 1px solid rgba(255,117,132,.45);
  border-radius: 999px;
  color: #ffd3d9;
  background: rgba(76,18,30,.94);
  text-align: center;
  transform: translateX(-50%);
  font: 900 clamp(9px, .5vw, 19px)/1.15 "Space Grotesk",sans-serif;
}
.tv2-winner-ribbon {
  position: fixed;
  z-index: 130;
  top: clamp(84px, 6.2vh, 140px);
  left: 50%;
  display: grid;
  width: min(48vw, 1420px);
  min-height: clamp(78px, 6.2vw, 220px);
  grid-template-columns: clamp(58px, 4.4vw, 168px) minmax(0, 1fr) max-content;
  align-items: center;
  gap: clamp(8px, .6vw, 23px);
  padding: clamp(8px, .55vw, 21px);
  border: 1px solid rgba(94,239,169,.48);
  border-radius: clamp(8px, .5vw, 20px);
  background: linear-gradient(120deg, rgba(10,61,47,.96), rgba(4,19,28,.97));
  box-shadow: 0 18px 70px rgba(0,0,0,.52), 0 0 42px rgba(55,213,143,.16);
  opacity: 0;
  transform: translate(-50%, -18px) scale(.98);
  transition: opacity .24s ease, transform .3s ease;
}
.tv2-winner-ribbon[hidden] { display: none !important; }
.tv2-winner-ribbon.is-visible { opacity: 1; transform: translate(-50%, 0) scale(1); }
.tv2-winner-avatar { width: clamp(58px, 4.4vw, 168px); }
.tv2-winner-ribbon > div { display: grid; min-width: 0; gap: 3px; }
.tv2-winner-ribbon small { color: #6de9ab; letter-spacing: .14em; font: 900 clamp(8px, .45vw, 17px)/1 Inter,sans-serif; }
.tv2-winner-ribbon strong { overflow-wrap: anywhere; font: 950 clamp(18px, 1.55vw, 60px)/1 "Space Grotesk",sans-serif; }
.tv2-winner-ribbon em { color: #9ab3c5; font: 750 clamp(10px, .58vw, 22px)/1.1 Inter,sans-serif; }
.tv2-winner-ribbon > b { color: #fff; font: 950 clamp(28px, 2.3vw, 88px)/.9 "Space Grotesk",sans-serif; }
.tv2-score-notice {
  position: fixed;
  z-index: 128;
  right: clamp(9px, .55vw, 22px);
  bottom: clamp(62px, 5.1vh, 115px);
  max-width: 38vw;
  padding: clamp(7px, .4vw, 16px) clamp(11px, .7vw, 27px);
  border: 1px solid rgba(89,222,158,.38);
  border-radius: 999px;
  color: #d9ffec;
  background: rgba(5,39,31,.94);
  box-shadow: 0 10px 35px rgba(0,0,0,.38);
  opacity: 0;
  transform: translateY(12px);
  pointer-events: none;
  font: 900 clamp(11px, .72vw, 28px)/1 "Space Grotesk",sans-serif;
  transition: opacity .2s ease, transform .25s ease;
}
.tv2-score-notice.is-visible { opacity: 1; transform: translateY(0); }
.tv2-winner-runner {
  position: fixed;
  z-index: 140;
  width: clamp(52px, 4vw, 154px);
  box-shadow: 0 0 0 4px rgba(91,235,168,.26), 0 0 38px rgba(61,224,151,.48);
  pointer-events: none;
}

@media (max-aspect-ratio: 4/3) {
  .tv2-main-grid { grid-template-columns: minmax(0, 1fr) clamp(240px, 24vw, 440px); }
  .tv2-live-strip { grid-template-columns: 1fr; grid-template-rows: repeat(2, minmax(0, 1fr)); }
  .tv2-display { grid-template-rows: minmax(112px, 10vh) minmax(0, 1fr) minmax(50px, 5vh); }
  .tv2-winner-ribbon { width: 72vw; }
}

@media (max-width: 600px) {
  .home-membership-panel { grid-template-columns: 1fr; padding: 20px; }
  .home-membership-panel > div:last-child { padding: 16px 0 0; border-left: 0; border-top: 1px solid rgba(255,205,105,.25); }
}

@media (prefers-reduced-motion: reduce) {
  .tv2-avatar.is-rotating img { animation: none !important; }
  .tv2-avatar.is-rotating img:nth-child(2) { display: none; }
  .tv2-team-row.score-changed, .tv2-game-card.winner-flash { animation-duration: .01ms; }
}

/* Version 7.8.26: original TV bracket engine inside the Display 2 dashboard. */
.tv2-bracket-frame {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: inherit;
  background: #040b13;
  opacity: 0;
  transition: opacity .18s ease;
}
.tv2-bracket-frame.is-ready { opacity: 1; }
.tv2-bracket-frame.is-spotlighting {
  position: fixed;
  z-index: 220;
  inset: 0;
  width: 100vw;
  height: 100svh;
  border-radius: 0;
}
.tv2-spotlight-active .tv2-bracket-stage,
.tv2-spotlight-active .tv2-bracket-viewport { overflow: visible; }

/* Version 7.8.27: Display 2 scoring, bracket readability, and final podium polish. */
.tv2-final-podium {
  position: fixed;
  z-index: 245;
  inset: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
  color: #fff;
  background:
    radial-gradient(circle at 50% 44%, rgba(255,196,69,.23), transparent 36%),
    radial-gradient(circle at 21% 61%, rgba(183,210,231,.12), transparent 27%),
    radial-gradient(circle at 79% 61%, rgba(220,137,68,.12), transparent 27%),
    rgba(2,8,14,.94);
  opacity: 0;
  transform: scale(.97);
  transition: opacity .45s ease, transform .6s cubic-bezier(.2,.8,.22,1);
}
.tv2-final-podium.is-visible { opacity: 1; transform: scale(1); }
.tv2-final-podium.is-leaving { opacity: 0; transform: scale(1.035); }
.tv2-final-podium-glow {
  position: absolute;
  width: min(74vw, 1500px);
  aspect-ratio: 1;
  border: 2px solid rgba(255,210,103,.16);
  border-radius: 50%;
  box-shadow: 0 0 150px rgba(255,190,58,.18), inset 0 0 110px rgba(255,209,105,.08);
  animation: tv2-podium-glow 2.4s ease-in-out infinite alternate;
}
.tv2-final-podium-content {
  position: relative;
  z-index: 2;
  display: grid;
  width: min(90vw, 2650px);
  justify-items: center;
  gap: clamp(10px, .8vw, 30px);
  text-align: center;
}
.tv2-final-podium-content > .eyebrow { color: #ffda83; font-size: clamp(12px, .65vw, 25px); }
.tv2-final-podium-content > h2 { margin: 0 0 clamp(18px, 1.5vw, 56px); font: 950 clamp(2.2rem, 4.3vw, 8rem)/.92 "Space Grotesk",sans-serif; letter-spacing: .025em; }
.tv2-podium-cards {
  display: grid;
  width: 100%;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: end;
  gap: clamp(12px, 1.2vw, 45px);
}
.tv2-podium-card {
  display: grid;
  min-width: 0;
  justify-items: center;
  gap: clamp(5px, .45vw, 17px);
  padding: clamp(16px, 1.35vw, 52px);
  border: 2px solid rgba(205,224,238,.38);
  border-radius: clamp(16px, 1.15vw, 44px);
  background: linear-gradient(155deg, rgba(75,96,112,.88), rgba(11,25,37,.96));
  box-shadow: 0 30px 90px rgba(0,0,0,.46), inset 0 1px rgba(255,255,255,.14);
  animation: tv2-podium-card-in .85s cubic-bezier(.2,.82,.22,1) both;
}
.tv2-podium-card.is-place-1 { order: 2; transform: translateY(clamp(-75px, -2vw, -25px)); border-color: rgba(255,210,91,.72); background: linear-gradient(155deg, rgba(128,85,18,.92), rgba(31,24,11,.98)); box-shadow: 0 32px 110px rgba(0,0,0,.5), 0 0 55px rgba(255,190,52,.16), inset 0 1px rgba(255,255,255,.2); animation-delay: .14s; }
.tv2-podium-card.is-place-2 { order: 1; animation-delay: .28s; }
.tv2-podium-card.is-place-3 { order: 3; border-color: rgba(224,154,95,.55); background: linear-gradient(155deg, rgba(103,58,27,.88), rgba(29,20,15,.97)); animation-delay: .4s; }
.tv2-podium-medal { font-size: clamp(2rem, 3vw, 6rem); filter: drop-shadow(0 12px 24px rgba(0,0,0,.34)); }
.tv2-podium-avatar { width: clamp(110px, 9vw, 345px); border-width: 4px; box-shadow: 0 18px 55px rgba(0,0,0,.38), 0 0 0 6px rgba(255,255,255,.08); }
.tv2-podium-card small { color: #c9dce9; letter-spacing: .15em; font: 950 clamp(9px, .55vw, 21px)/1 Inter,sans-serif; }
.tv2-podium-card.is-place-1 small { color: #ffe19a; }
.tv2-podium-card > strong { max-width: 100%; color: #fff; overflow-wrap: anywhere; font: 900 clamp(1.3rem, 1.9vw, 3.8rem)/1 "Space Grotesk",sans-serif; }
.tv2-podium-card > em { color: #9eb4c5; font: 750 clamp(10px, .65vw, 25px)/1 Inter,sans-serif; }
@keyframes tv2-podium-card-in { from { opacity: 0; translate: 0 70px; } to { opacity: 1; translate: 0 0; } }
@keyframes tv2-podium-glow { to { transform: scale(1.06); opacity: .72; } }

@media (prefers-reduced-motion: reduce) {
  .tv2-final-podium-glow, .tv2-podium-card { animation-duration: .01ms; }
}

/* Version 7.8.30: larger, overflow-safe outer dashboard typography for Display 2. */
.tv2-display {
  grid-template-rows: clamp(112px, 7.2vh, 156px) minmax(0, 1fr) clamp(76px, 5.6vh, 120px);
}
.tv2-strip-label {
  min-width: clamp(140px, 9vw, 340px);
  padding-inline: clamp(9px, .6vw, 24px);
  overflow-wrap: anywhere;
  font-size: clamp(16px, .92vw, 36px);
  line-height: .96;
}
.tv2-strip-item { gap: clamp(7px, .42vw, 16px); padding: clamp(5px, .28vw, 11px) clamp(7px, .46vw, 18px); }
.tv2-strip-item > b {
  min-width: clamp(42px, 2.35vw, 90px);
  min-height: clamp(42px, 2.35vw, 90px);
  padding-inline: 3px;
  font-size: clamp(14px, .78vw, 30px);
}
.tv2-strip-item > span { gap: clamp(3px, .15vw, 6px); }
.tv2-strip-item strong {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  font-size: clamp(17px, 1vw, 40px);
  line-height: 1;
}
.tv2-strip-item em {
  display: -webkit-box;
  overflow: hidden;
  overflow-wrap: anywhere;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  font-size: clamp(12px, .72vw, 28px);
  line-height: 1.02;
}
.tv2-strip-item.is-long-title strong { font-size: clamp(16px, .84vw, 33px); }
.tv2-strip-item.is-very-long-title strong { font-size: clamp(14px, .7vw, 27px); }
.tv2-strip-item.is-long-detail em { font-size: clamp(11px, .62vw, 24px); }

.tv2-rank-rail {
  --tv2-rank-number-width: clamp(48px, 2.9vw, 112px);
  --tv2-rank-photo-size: clamp(62px, 3.25vw, 126px);
  grid-template-rows: clamp(56px, 3vw, 112px) minmax(0, 1fr) max-content;
}
.tv2-rank-heading {
  padding-inline: clamp(10px, .68vw, 27px);
  font-size: clamp(16px, .92vw, 36px);
  line-height: .96;
}
.tv2-rank-item {
  grid-template-columns: var(--tv2-rank-number-width) var(--tv2-rank-photo-size) minmax(0, 1fr);
  gap: clamp(7px, .4vw, 16px);
  padding: clamp(3px, .16vw, 7px) clamp(6px, .38vw, 15px);
}
.tv2-rank-item > b { font-size: clamp(20px, 1.25vw, 48px); }
.tv2-rank-avatar { width: var(--tv2-rank-photo-size); }
.tv2-rank-item strong {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  font-size: clamp(16px, 1.05vw, 42px);
  line-height: 1;
}
.tv2-rank-item span {
  overflow-wrap: anywhere;
  font-size: clamp(12px, .72vw, 28px);
  line-height: 1;
}
.tv2-rank-item.is-long-name strong { font-size: clamp(15px, .88vw, 34px); }
.tv2-rank-item.is-very-long-name strong { font-size: clamp(13px, .74vw, 29px); }
.tv2-rank-overflow { font-size: clamp(12px, .7vw, 27px); }
.tv2-rank-rail[data-density="compact"] {
  --tv2-rank-number-width: clamp(43px, 2.5vw, 88px);
  --tv2-rank-photo-size: clamp(58px, 4vw, 100px);
}
.tv2-rank-rail[data-density="dense"] {
  --tv2-rank-number-width: clamp(38px, 2.2vw, 72px);
  --tv2-rank-photo-size: clamp(50px, 3.2vw, 82px);
}
.tv2-rank-rail[data-density="dense"] .tv2-rank-item strong { font-size: clamp(14px, .82vw, 30px); }
.tv2-rank-rail[data-density="dense"] .tv2-rank-item span { font-size: clamp(10px, .57vw, 21px); }

.tv2-status-bar { grid-template-columns: repeat(4, minmax(115px, .56fr)) minmax(380px, 2fr) minmax(150px, .72fr); }
.tv2-status-bar > div {
  flex-wrap: wrap;
  gap: clamp(6px, .36vw, 14px);
  padding-inline: clamp(7px, .48vw, 19px);
}
.tv2-status-bar span {
  max-width: 100%;
  overflow-wrap: anywhere;
  text-align: center;
  font-size: clamp(11px, .7vw, 27px);
  line-height: .96;
}
.tv2-status-bar strong {
  display: -webkit-box;
  max-width: 100%;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  font-size: clamp(24px, 1.35vw, 52px);
  line-height: .96;
}
.tv2-leader { flex-wrap: nowrap !important; }
.tv2-sync i { width: clamp(12px, .72vw, 28px); }

@media (max-aspect-ratio: 4/3) {
  .tv2-display { grid-template-rows: clamp(210px, 15vh, 320px) minmax(0, 1fr) clamp(90px, 7vh, 132px); }
  .tv2-strip-label { min-width: clamp(125px, 14vw, 260px); }
  .tv2-status-bar { grid-template-columns: repeat(4, minmax(82px, .65fr)) minmax(220px, 1.7fr) minmax(115px, .8fr); }
}

/* Version 7.8.31: unclipped live desk, rotating rankings, and useful TV clock. */
.tv2-display { grid-template-rows: clamp(132px, 8.5vh, 184px) minmax(0, 1fr) clamp(76px, 5.6vh, 120px); }
.tv2-live-strip { grid-template-columns: minmax(0, .72fr) minmax(0, 1.55fr); }
.tv2-strip-label {
  min-width: clamp(120px, 6.4vw, 246px);
  font-size: clamp(15px, .78vw, 30px);
}
.tv2-strip-items { grid-auto-flow: row; }
.tv2-strip-item strong { font-size: clamp(17px, .9vw, 35px); }
.tv2-strip-item em { font-size: clamp(12px, .64vw, 25px); }
.tv2-strip-item.is-matchup strong {
  display: grid;
  gap: clamp(2px, .12vw, 5px);
  overflow: visible;
  font-size: clamp(16px, .82vw, 32px);
}
.tv2-desk-team-line {
  display: -webkit-box;
  min-width: 0;
  overflow: hidden;
  overflow-wrap: anywhere;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-height: .98;
}
.tv2-rank-rail {
  --tv2-rank-number-width: clamp(54px, 3vw, 116px);
  --tv2-rank-photo-size: clamp(78px, 3.8vw, 148px);
}
.tv2-rank-overflow { letter-spacing: .06em; }
.tv2-status-bar { grid-template-columns: repeat(4, minmax(115px, .52fr)) minmax(350px, 1.75fr) minmax(270px, 1fr); }
.tv2-sync {
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr);
  grid-template-rows: repeat(2, minmax(0, 1fr));
  align-content: center;
  column-gap: clamp(7px, .4vw, 16px) !important;
  row-gap: 0 !important;
}
.tv2-sync i { grid-row: 1 / span 2; align-self: center; }
.tv2-sync span, .tv2-sync strong { justify-self: start; text-align: left; }
.tv2-sync strong { font-size: clamp(19px, 1.15vw, 44px); }

@media (max-aspect-ratio: 4/3) {
  .tv2-display { grid-template-rows: clamp(250px, 17vh, 350px) minmax(0, 1fr) clamp(96px, 7vh, 140px); }
  .tv2-live-strip { grid-template-columns: 1fr; }
  .tv2-status-bar { grid-template-columns: repeat(4, minmax(78px, .6fr)) minmax(200px, 1.5fr) minmax(170px, 1fr); }
}

/* Version 8.0.1: account polish, site branding, trends, and friends. */
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
}
.brand-mark { overflow: hidden; flex: 0 0 auto; }
.brand-mark img { width: 100%; height: 100%; object-fit: cover; }
.account-nav-section { display: flex; align-items: center; gap: 10px; }
.account-nav-section + .account-nav-section { padding-left: 12px; border-left: 1px solid rgba(146,188,221,.2); }
.account-nav-profile { padding: 4px 5px 4px 7px; border-radius: 999px; background: rgba(113,157,193,.1); }
.account-nav-logout { border: 0; padding: 5px 8px; border-radius: 999px; color: #9eb8ce; background: transparent; font: inherit; font-size: .7rem; font-weight: 800; cursor: pointer; }
.account-nav-logout:hover { color: #fff; background: rgba(255,255,255,.07); }
.account-scoreboard-link { padding: 7px 10px; border: 1px solid rgba(138,188,225,.25); border-radius: 11px; color: #d8ebf9; background: rgba(5,18,31,.58); font-size: .72rem; font-weight: 850; }
.account-nav-scoreboard { flex: 0 0 auto; gap: 5px; }
.account-scoreboard-user { width: 36px; height: 36px; justify-content: center; }
.account-scoreboard-user img,
.account-scoreboard-user > span { width: 32px; height: 32px; }
.account-identity-trigger { min-height: 36px; padding-inline: 10px; background: rgba(5,18,31,.62); backdrop-filter: blur(10px); }
.account-identity-dialog {
  position: fixed;
  inset: 50% auto auto 50%;
  margin: 0;
  transform: translate(-50%, -50%);
  min-width: min(390px, calc(100vw - 28px));
  border: 1px solid rgba(112,199,255,.38);
  color: var(--text);
  background: linear-gradient(145deg, rgba(15,39,62,.98), rgba(5,16,29,.98));
  box-shadow: 0 28px 90px rgba(0,0,0,.62);
}
.account-identity-dialog::backdrop { background: rgba(2,8,14,.68); backdrop-filter: blur(6px); }
.account-identity-close { position: absolute; top: 7px; right: 8px; width: 32px; height: 32px; border: 0; border-radius: 50%; color: #bdd3e6; background: rgba(255,255,255,.07); font-size: 1.35rem; cursor: pointer; }
.registration-limit-note { display: block; margin-top: 7px; color: #ffd06e !important; line-height: 1.4; }
.account-premium-teaser { display: grid; gap: 5px; margin-top: 24px; padding: 16px 18px; border: 1px solid rgba(255,205,105,.25); border-radius: 16px; background: rgba(104,70,9,.18); }
.account-premium-teaser strong { color: #ffd477; }
.account-premium-teaser span { color: #c8d7e4; font-size: .83rem; line-height: 1.5; }
.account-dashboard-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }

.stats-trends { overflow: hidden; background: radial-gradient(circle at 86% 10%, rgba(47,201,156,.12), transparent 32rem), linear-gradient(145deg, rgba(15,39,61,.95), rgba(8,21,35,.86)); }
.trend-signal { padding: 8px 12px; border-radius: 999px; color: #b6ccdd; background: rgba(255,255,255,.06); font-size: .78rem; }
.trend-signal.positive { color: #66e3ad; background: rgba(60,205,148,.12); }
.trend-signal.negative { color: #ff9da8; background: rgba(255,97,119,.12); }
.trend-form { display: flex; gap: 7px; min-height: 34px; align-items: center; color: #91abc1; }
.trend-form span { display: grid; width: 31px; height: 31px; place-items: center; border-radius: 10px; font-weight: 950; }
.trend-form .won { color: #071a12; background: #56dfa2; }
.trend-form .lost { color: #281014; background: #ff7c8d; }
.trend-months { display: grid; grid-template-columns: repeat(12, minmax(58px,1fr)); gap: 8px; min-height: 205px; margin-top: 21px; overflow-x: auto; }
.trend-month { display: grid; grid-template-rows: 22px 1fr auto auto; gap: 6px; min-width: 58px; text-align: center; }
.trend-month > strong { font-size: .72rem; }
.trend-month > span { color: #c7d8e6; font-size: .69rem; font-weight: 800; }
.trend-month > em { color: #7897b0; font-size: .59rem; font-style: normal; }
.trend-month-bar { display: flex; min-height: 105px; align-items: flex-end; overflow: hidden; border-radius: 9px; background: rgba(104,147,181,.1); }
.trend-month-bar i { display: block; width: 100%; min-height: 5px; border-radius: 9px 9px 0 0; background: linear-gradient(#4ee2a1, #218bda); }

/* 8.0.11: Premium members can compare several result and throwing trends. */
.stats-trends .section-heading p { max-width: 720px; margin: 5px 0 0; color: #96b2c5; line-height: 1.45; }
.trend-picker-shell { display: grid; grid-template-columns: minmax(180px,.34fr) minmax(0,1fr); gap: 16px; align-items: center; margin-top: 18px; padding: 14px; border: 1px solid rgba(124,183,220,.16); border-radius: 17px; background: rgba(3,15,27,.32); }
.trend-picker-shell > div:first-child { display: grid; gap: 3px; }
.trend-picker-shell > div:first-child small { color: #88a5bb; line-height: 1.35; }
.trend-metric-picker { display: flex; flex-wrap: wrap; gap: 8px; }
.trend-metric-toggle { min-height: 38px; padding: 7px 12px; border: 1px solid rgba(135,179,211,.2); border-radius: 999px; color: #9bb5c9; background: rgba(90,134,168,.08); font: inherit; font-size: .73rem; font-weight: 850; cursor: pointer; transition: .16s ease; }
.trend-metric-toggle:hover,.trend-metric-toggle:focus-visible { border-color: rgba(124,214,255,.72); color: #fff; transform: translateY(-1px); }
.trend-metric-toggle.selected { border-color: rgba(102,214,255,.7); color: #fff; background: rgba(63,172,225,.16); box-shadow: inset 0 0 0 1px rgba(106,213,255,.12),0 7px 18px rgba(42,154,211,.1); border-color: color-mix(in srgb,var(--trend-color,#5bc7ff) 68%,white 10%); background: color-mix(in srgb,var(--trend-color,#5bc7ff) 17%,transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb,var(--trend-color,#5bc7ff) 18%,transparent),0 7px 18px color-mix(in srgb,var(--trend-color,#5bc7ff) 10%,transparent); }
.trend-green { --trend-color:#52e09e; }.trend-blue { --trend-color:#4fb9ff; }.trend-gold { --trend-color:#ffc45b; }.trend-teal { --trend-color:#52dfd2; }.trend-violet { --trend-color:#ac91ff; }.trend-red { --trend-color:#ff7889; }
.trend-metric-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin-top: 14px; }
.trend-metric-card { display: grid; min-width: 0; gap: 15px; padding: 16px; border: 1px solid rgba(103,190,224,.2); border-radius: 17px; background: linear-gradient(145deg,rgba(42,129,164,.08),rgba(4,16,28,.52)); border-color: color-mix(in srgb,var(--trend-color) 25%,transparent); background: linear-gradient(145deg,color-mix(in srgb,var(--trend-color) 8%,transparent),rgba(4,16,28,.52)); }
.trend-metric-heading { display: flex; align-items: start; justify-content: space-between; gap: 15px; }
.trend-metric-heading > div:first-child { display: grid; min-width: 0; gap: 3px; }
.trend-metric-heading > div:first-child > strong { color: #f4f9fd; font-size: 1rem; }
.trend-metric-heading small { color: #819eb4; font-size: .66rem; line-height: 1.3; }
.trend-latest { display: grid; flex: 0 0 auto; justify-items: end; gap: 2px; text-align: right; }
.trend-latest > strong { color: var(--trend-color); font-size: 1.35rem; line-height: 1; }
.trend-latest > small.positive { color: #65dda7; }.trend-latest > small.negative { color: #ff929f; }
.trend-metric-empty { min-height: 82px; margin: 0; display: grid; place-items: center; padding: 14px; border: 1px dashed rgba(128,177,211,.18); border-radius: 13px; color: #819eb3; font-size: .75rem; text-align: center; }
.trend-series { display: grid; grid-template-columns: repeat(var(--trend-points),minmax(43px,1fr)); gap: 6px; min-height: 142px; overflow-x: auto; padding: 2px 1px 4px; }
.trend-series-point { display: grid; grid-template-rows: 18px 92px auto; gap: 5px; min-width: 43px; text-align: center; }
.trend-series-point > strong { overflow: hidden; color: #dcebf5; font-size: .65rem; text-overflow: ellipsis; white-space: nowrap; }
.trend-series-point > small { color: #7795ac; font-size: .59rem; font-weight: 800; }
.trend-series-bar { display: flex; align-items: flex-end; overflow: hidden; border-radius: 9px; background: rgba(104,147,181,.09); }
.trend-series-bar i { display: block; width: 100%; min-height: 0; border-radius: 8px 8px 0 0; background: linear-gradient(to top,#237aa9,var(--trend-color)); box-shadow: 0 -5px 15px rgba(73,189,228,.18); background: linear-gradient(to top,color-mix(in srgb,var(--trend-color) 68%,#1267b0),var(--trend-color)); box-shadow: 0 -5px 15px color-mix(in srgb,var(--trend-color) 20%,transparent); }
.trend-form-block { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 18px; padding: 12px 14px; border: 1px solid rgba(124,183,220,.13); border-radius: 15px; background: rgba(4,15,26,.27); }
.trend-form-block > div:first-child { display: grid; flex: 0 0 auto; gap: 2px; }
.trend-form-block > div:first-child small { color: #7896ad; font-size: .66rem; }

@media (max-width: 760px) {
  .trend-picker-shell { grid-template-columns: 1fr; }
  .trend-metric-grid { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .stats-trends { padding-inline: 15px; }
  .trend-metric-picker { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .trend-metric-toggle { min-width: 0; padding-inline: 8px; }
  .trend-metric-heading { gap: 8px; }
  .trend-form-block { align-items: flex-start; flex-direction: column; }
  .trend-form { max-width: 100%; overflow-x: auto; padding-bottom: 2px; }
}

.friends-hub { background: radial-gradient(circle at 92% 0, rgba(68,176,255,.15), transparent 35rem), linear-gradient(145deg, rgba(15,38,60,.95), rgba(7,19,32,.88)); }
.friends-heading { display: grid; grid-template-columns: minmax(0,1fr) minmax(290px,.7fr); gap: 24px; align-items: end; }
.friends-heading h2 { margin: 5px 0; }
.friends-heading p { margin: 0; color: #9db5c9; }
.friend-search { display: flex; gap: 8px; }
.friend-search input { width: 100%; min-width: 0; }
.friend-search-results { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin: 16px 0; padding: 13px; border: 1px solid rgba(128,181,219,.18); border-radius: 16px; background: rgba(3,13,23,.35); }
.friend-search-row,.friend-row { display: grid; grid-template-columns: 44px minmax(0,1fr) auto; gap: 11px; align-items: center; min-width: 0; padding: 11px; border: 1px solid rgba(135,182,216,.14); border-radius: 14px; background: rgba(112,157,192,.07); }
.friend-search-row > strong,.friend-row > div > strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.friend-row > div:not(.friend-actions) { display: grid; gap: 3px; min-width: 0; }
.friend-row > div > span { color: #819eb6; font-size: .7rem; }
.friend-avatar,.friend-comparison-avatar { display: grid; place-items: center; overflow: hidden; border-radius: 50%; color: #07121d; background: linear-gradient(145deg,#6dd0ff,#4be0a3); font-weight: 950; }
.friend-avatar { width: 44px; height: 44px; }
.friend-avatar img,.friend-comparison-avatar img { width: 100%; height: 100%; object-fit: cover; }
.friend-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.friend-request-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; margin: 18px 0; }
.friend-request-grid > div { padding: 15px; border: 1px solid rgba(129,181,219,.16); border-radius: 16px; background: rgba(6,18,31,.4); }
.friend-request-grid h3,.friend-roster-heading h3 { margin: 0 0 10px; }
.friend-list,.friend-roster { display: grid; gap: 8px; }
.friend-roster { grid-template-columns: repeat(2,minmax(0,1fr)); }
.friend-roster-heading { display: flex; justify-content: space-between; align-items: baseline; margin-top: 19px; }
.friend-roster-heading span { color: #87a6bf; font-size: .75rem; }
.friend-comparison { margin-top: 20px; padding: 18px; border: 1px solid rgba(87,201,255,.28); border-radius: 20px; background: rgba(3,14,25,.55); }
.friend-comparison-heading { display: flex; justify-content: space-between; align-items: center; }
.friend-comparison-heading h3 { margin: 4px 0 0; }
.friend-versus-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin-top: 15px; }
.friend-versus-card { display: grid; grid-template-columns: 72px minmax(0,1fr) auto; gap: 5px 14px; align-items: center; padding: 17px; border: 1px solid rgba(139,183,218,.18); border-radius: 17px; background: rgba(87,130,166,.08); }
.friend-versus-card.is-me { box-shadow: inset 4px 0 #49dca0; }
.friend-comparison-avatar { grid-row: 1 / span 3; width: 72px; height: 72px; font-size: 1.15rem; }
.friend-versus-card h4 { margin: 0; }
.friend-versus-card > strong { grid-column: 3; grid-row: 1 / span 2; color: #fff; font-size: 1.9rem; }
.friend-versus-card dl { grid-column: 2 / -1; display: grid; grid-template-columns: repeat(4,auto); gap: 5px 12px; margin: 5px 0 0; }
.friend-versus-card dt { color: #7694ad; font-size: .65rem; }
.friend-versus-card dd { margin: 0; color: #dcebf6; font-weight: 800; }
.friend-recent-panel { margin-top: 18px; }
.friend-recent-panel h4 { margin: 0 0 10px; }
.admin-brand-grid { display: grid; grid-template-columns: minmax(240px,1fr) minmax(260px,1fr) auto; gap: 18px; align-items: end; }
.admin-brand-preview { display: flex; align-items: center; gap: 13px; }
.admin-brand-preview > div { display: grid; gap: 3px; }
.admin-brand-preview small { color: #87a6bf; }
.brand-logo-preview { display: grid; width: 68px; height: 68px; flex: 0 0 68px; place-items: center; overflow: hidden; border-radius: 20px; color: #06131e; background: linear-gradient(145deg,#67ceff,#46dda1); font-size: 1.25rem; font-weight: 950; }
.brand-logo-preview img { width: 100%; height: 100%; object-fit: cover; }
.admin-brand-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.admin-form-section > .account-help { grid-column: 1 / -1; margin: -6px 0 0; }

@media (max-width: 900px) {
  .friends-heading,.admin-brand-grid { grid-template-columns: 1fr; }
  .friend-versus-card { grid-template-columns: 58px minmax(0,1fr) auto; }
  .friend-comparison-avatar { width: 58px; height: 58px; }
}
@media (max-width: 680px) {
  .account-nav-section:first-child { display: none; }
  .account-nav-section + .account-nav-section { padding-left: 0; border-left: 0; }
  .account-nav-profile { background: transparent; }
  .account-nav-floating { top: max(10px,env(safe-area-inset-top)); right: max(10px,env(safe-area-inset-right)); bottom: auto; }
  .account-nav-scoreboard .account-scoreboard-link { width: 36px; padding-inline: 0; overflow: hidden; font-size: 0; text-align: center; }
  .account-nav-scoreboard .account-scoreboard-link::before { content: "Me"; color: #d8ebf8; font-size: .68rem; font-weight: 900; }
  .account-identity-trigger { width: 36px; padding: 0; overflow: hidden; color: transparent; }
  .account-identity-trigger::before { content: "◎"; color: #d8ebf8; font-size: 1.1rem; }
  .friend-search { display: grid; }
  .friend-search-results,.friend-request-grid,.friend-roster,.friend-versus-grid { grid-template-columns: 1fr; }
  .friend-search-row,.friend-row { grid-template-columns: 40px minmax(0,1fr); }
  .friend-avatar { width: 40px; height: 40px; }
  .friend-actions { grid-column: 1 / -1; justify-content: flex-start; }
  .friend-versus-card dl { grid-template-columns: repeat(2,auto); }
  .account-dashboard-grid { grid-template-columns: 1fr; }
}

/* 8.0.2: optional per-player bag tracking stays attached to that player's side. */
.player-tracking-trigger {
  position: absolute;
  z-index: 8;
  top: 88px;
  right: 11px;
  display: inline-grid;
  grid-template-columns: auto auto;
  align-items: center;
  gap: 2px 7px;
  min-height: 39px;
  padding: 7px 10px;
  border: 1px solid rgba(255,255,255,.38);
  border-radius: 13px;
  color: #fff;
  background: rgba(3,15,28,.52);
  box-shadow: 0 8px 24px rgba(0,0,0,.2), inset 0 1px rgba(255,255,255,.13);
  backdrop-filter: blur(10px);
  font: inherit;
  cursor: pointer;
}
.player-tracking-trigger[hidden] { display: none !important; }
.player-tracking-trigger > span { grid-row: 1 / span 2; font-size: 18px; color: #78e8b5; }
.player-tracking-trigger > strong { font-size: 10px; line-height: 1; letter-spacing: .02em; }
.player-tracking-trigger > small { color: rgba(255,255,255,.72); font-size: 8px; line-height: 1; }
.player-tracking-trigger.is-enabled { border-color: rgba(93,239,169,.65); background: rgba(2,38,31,.65); }
.player-tracking-trigger:hover,.player-tracking-trigger:focus-visible { transform: translateY(-1px); border-color: #fff; }

.player-stats-choice-dialog,.throw-tracker-dialog { width: min(540px,calc(100vw - 22px)); overflow: visible; }
.player-stats-choice-dialog h2,.throw-tracker-dialog h2 { margin: 5px 35px 6px 0; font-size: clamp(1.45rem,4vw,2rem); }
.player-stats-choice-dialog > p { margin: 0 0 16px; color: #a9bfd1; line-height: 1.55; }
.player-stats-choice-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.player-stats-choice-card {
  display: grid;
  min-width: 0;
  min-height: 145px;
  align-content: center;
  justify-items: start;
  gap: 7px;
  padding: 17px;
  border: 1px solid rgba(127,183,222,.25);
  border-radius: 18px;
  color: #eaf7ff;
  background: linear-gradient(145deg,rgba(54,135,192,.16),rgba(11,31,49,.76));
  text-align: left;
  cursor: pointer;
}
.player-stats-choice-card.featured { border-color: rgba(77,224,157,.52); background: linear-gradient(145deg,rgba(32,174,117,.22),rgba(10,39,43,.8)); }
.player-stats-choice-card:hover,.player-stats-choice-card:focus-visible { border-color: #72d8ff; transform: translateY(-2px); }
.player-stats-choice-card > span { display: grid; min-width: 37px; height: 37px; padding: 0 8px; place-items: center; border-radius: 12px; color: #061722; background: linear-gradient(145deg,#76d8ff,#55e1a2); font-size: 12px; font-weight: 950; }
.player-stats-choice-card > strong { font-size: 1rem; }
.player-stats-choice-card > small { color: #94aec2; line-height: 1.4; }
.player-stats-start-actions { margin-top: 18px; }

.throw-tracker-head { display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.throw-tracker-hint { margin: 3px 0 14px; color: #a6bed0; line-height: 1.45; }
.throw-counter-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 11px; }
.throw-counter {
  display: grid;
  min-height: 154px;
  place-items: center;
  align-content: center;
  gap: 4px;
  border: 1px solid rgba(119,183,226,.28);
  border-radius: 22px;
  color: #edf9ff;
  background: radial-gradient(circle at 50% 35%,rgba(67,161,222,.22),transparent 55%),rgba(7,24,39,.7);
  cursor: pointer;
}
.throw-counter-in { background: radial-gradient(circle at 50% 35%,rgba(60,222,148,.25),transparent 55%),rgba(7,31,34,.72); }
.throw-counter.has-bags { border-color: rgba(100,229,173,.7); box-shadow: inset 0 0 34px rgba(58,218,147,.12); }
.throw-counter > span { color: #9fb8cb; font-size: 10px; font-weight: 900; letter-spacing: .13em; }
.throw-counter > strong { font-size: 3.7rem; line-height: .95; }
.throw-counter > small { color: #7696ae; font-size: 10px; }
.throw-round-summary { display: flex; justify-content: space-between; gap: 12px; margin: 11px 1px; padding: 9px 13px; border-radius: 12px; color: #a8bfd1; background: rgba(105,151,186,.09); font-size: 12px; }
.throw-round-summary strong { color: #fff; }
.throw-tracker-actions { display: grid; grid-template-columns: .75fr 1.25fr; gap: 9px; }
.throw-tracker-totals { min-height: 18px; margin: 11px 0 0; color: #7fdcb2; font-size: 11px; text-align: center; }

@media (max-width: 620px) {
  .player-tracking-trigger { top: 62px; right: 7px; min-height: 34px; padding: 5px 7px; border-radius: 11px; }
  .player-tracking-trigger > span { font-size: 15px; }
  .player-tracking-trigger > strong { font-size: 9px; }
  .player-stats-choice-grid { grid-template-columns: 1fr; }
  .player-stats-choice-card { min-height: 105px; }
  .throw-counter { min-height: 125px; }
}

@media (orientation: landscape) and (max-height: 620px) {
  .player-tracking-trigger { top: 48px; }
  .player-stats-choice-dialog,.throw-tracker-dialog { max-height: calc(100dvh - 12px); overflow-y: auto; }
  .throw-counter { min-height: 92px; }
  .throw-counter > strong { font-size: 2.5rem; }
}

.bag-performance-card { background: radial-gradient(circle at 92% 0,rgba(68,224,158,.15),transparent 32rem),linear-gradient(145deg,rgba(12,42,48,.94),rgba(7,20,34,.9)); }
.bag-performance-card .section-heading p { max-width: 720px; margin: 5px 0 0; color: #96b2c5; }
.bag-performance-signal { align-self: start; padding: 8px 11px; border: 1px solid rgba(80,225,161,.3); border-radius: 999px; color: #77e4ae; background: rgba(39,190,128,.1); font-size: .72rem; }
.bag-performance-grid { margin-top: 17px; }
.premium-performance-preview { display: grid; grid-template-columns: minmax(240px,.9fr) minmax(320px,1.1fr); gap: 18px; margin-top: 18px; }
.premium-performance-preview[hidden] { display: none !important; }
.premium-preview-copy { display: grid; align-content: center; justify-items: start; gap: 8px; padding: 18px; border: 1px solid rgba(255,205,91,.25); border-radius: 18px; background: linear-gradient(145deg,rgba(120,80,12,.2),rgba(8,25,39,.46)); }
.premium-preview-copy > span { color: #ffd66f; font-size: .64rem; font-weight: 950; letter-spacing: .12em; }
.premium-preview-copy h3,.premium-preview-copy p { margin: 0; }
.premium-preview-copy p { color: #a6bccb; line-height: 1.5; }
.premium-preview-copy .button { margin-top: 5px; }
.premium-preview-copy small { color: #8ca8ba; }
.premium-preview-dashboard { display: grid; grid-template-rows: auto auto minmax(105px,1fr) auto; gap: 10px; min-width: 0; padding: 17px; border: 1px solid rgba(95,201,248,.25); border-radius: 18px; background: radial-gradient(circle at 80% 0,rgba(72,218,161,.13),transparent 20rem),rgba(4,17,29,.72); box-shadow: inset 0 0 30px rgba(58,155,214,.07); }
.premium-preview-label { display: flex; justify-content: space-between; gap: 10px; color: #fff; }
.premium-preview-label span { color: #88a9bf; font-size: .7rem; }
.premium-preview-metrics { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; }
.premium-preview-metrics article { display: grid; gap: 2px; padding: 9px; border-radius: 11px; background: rgba(65,119,154,.12); }
.premium-preview-metrics span { color: #83a4b9; font-size: .61rem; font-weight: 850; text-transform: uppercase; }
.premium-preview-metrics strong { color: #fff; font-size: 1.05rem; }
.premium-preview-metrics em { color: #68dda5; font-size: .65rem; font-style: normal; font-weight: 850; }
.premium-preview-chart { display: flex; align-items: end; gap: 7px; min-height: 105px; padding: 7px 5px 0; border-bottom: 1px solid rgba(126,185,221,.2); background: repeating-linear-gradient(to top,transparent 0,transparent 32px,rgba(121,179,214,.07) 33px); }
.premium-preview-chart i { flex: 1; height: var(--h); min-height: 5px; border-radius: 7px 7px 2px 2px; background: linear-gradient(to top,#258bd0,#5fe1a5); box-shadow: 0 0 14px rgba(72,207,167,.12); }
.premium-preview-axis { display: grid; grid-template-columns: repeat(6,1fr); color: #6f90a7; font-size: .59rem; text-align: center; }
.stats-premium-opponents { display: flex; flex-wrap: wrap; gap: 5px 8px; margin-top: 5px; }
.stats-premium-opponent { display: inline-flex; align-items: center; gap: 5px; padding: 4px 7px; border: 1px solid rgba(255,207,94,.24); border-radius: 999px; background: rgba(124,86,14,.13); }
.stats-premium-opponent-name { appearance: none; padding: 0; border: 0; color: #ffd778; background: none; font: inherit; font-size: .7rem; font-weight: 900; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.stats-premium-opponent-name:disabled { color: #b9a36b; text-decoration: none; cursor: default; }
.stats-premium-opponent small { color: #87a5b9; font-size: .6rem; }
.bag-mode-breakdown { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin-top: 11px; }
.bag-mode-breakdown article { display: grid; grid-template-columns: 1fr auto; gap: 3px 13px; padding: 13px 15px; border: 1px solid rgba(116,180,215,.15); border-radius: 14px; background: rgba(88,137,169,.07); }
.bag-mode-breakdown span { color: #91adc0; font-size: .72rem; font-weight: 850; }
.bag-mode-breakdown strong { color: #fff; }
.bag-mode-breakdown small { grid-column: 1 / -1; color: #7594aa; }
.throwing-trend-heading { margin-top: 25px; }
.throwing-trend-heading h3 { margin: 5px 0 10px; }
.throw-trend-months { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 9px; color: #819eb3; }
.throw-trend-month { display: grid; gap: 4px; padding: 13px; border: 1px solid rgba(116,181,217,.16); border-radius: 14px; background: rgba(70,126,162,.07); }
.throw-trend-month span { color: #8ca9bc; font-size: .68rem; font-weight: 800; }
.throw-trend-month strong { color: #7ee5b2; font-size: 1.05rem; }
.throw-trend-month em,.throw-trend-month small { color: #9ab2c3; font-size: .68rem; font-style: normal; }
@media (max-width: 680px) {
  .bag-mode-breakdown,.throw-trend-months,.premium-performance-preview { grid-template-columns: 1fr; }
  .bag-performance-signal { justify-self: start; }
  .premium-preview-copy,.premium-preview-dashboard { padding: 14px; }
}

/* 8.0.3: stable mobile surfaces, unclipped dialogs, and clearer account tools. */
html { background: #06101c; overscroll-behavior-y: none; }
body { min-height: 100dvh; background-color: #06101c; background-attachment: scroll; }

/* Keep permission-aware controls from visibly assembling after navigation. */
html.app-booting { min-height: 100%; background: #06101c; }
html.app-booting body { opacity: 0; pointer-events: none; }
html.app-booting::before,
html.app-booting::after { content: ""; position: fixed; z-index: 99999; pointer-events: none; }
html.app-booting::before {
  inset: 0;
  background: radial-gradient(circle at 50% 42%,rgba(44,139,197,.17),transparent 20rem),#06101c;
}
html.app-booting::after {
  top: calc(50% - 22px);
  left: calc(50% - 22px);
  width: 44px;
  height: 44px;
  border: 3px solid rgba(115,188,231,.18);
  border-top-color: #67d7ff;
  border-right-color: #54dfa4;
  border-radius: 50%;
  animation: app-boot-spin .75s linear infinite;
}
html.app-ready body { transition: opacity .16s ease; }
@keyframes app-boot-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { html.app-booting::after { animation-duration: 1.5s; } }

.account-auth-card[data-mode="login"],
.account-auth-card[data-mode="forgot"],
.account-auth-card[data-mode="reset"] {
  width: min(620px, 100%);
  grid-template-columns: 1fr;
  margin-inline: auto;
}
.account-auth-card[data-mode="login"] .account-auth-copy,
.account-auth-card[data-mode="forgot"] .account-auth-copy,
.account-auth-card[data-mode="reset"] .account-auth-copy { display: none; }
.stats-export-actions { flex-wrap: wrap; }

.friend-search {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  align-items: stretch;
  width: 100%;
  min-width: 0;
}
.friend-search input {
  min-height: 44px;
  padding: 11px 13px;
  border: 1px solid rgba(133,183,220,.24);
  border-radius: 12px;
  outline: none;
  color: var(--text);
  background: rgba(3,14,25,.72);
}
.friend-search input:focus { border-color: #4fbaff; box-shadow: 0 0 0 3px rgba(55,168,255,.1); }
.friend-search .button { min-height: 44px; }
.friend-search-row > strong { min-width: 0; overflow-wrap: anywhere; }

@media (max-width: 760px) {
  body::before { position: absolute; min-height: 100dvh; }
  #globalTopbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    min-height: 0;
    padding: max(9px, env(safe-area-inset-top)) 10px 10px;
  }
  #globalTopbar .brand { min-width: 0; }
  #globalTopbar .brand > span:last-child { min-width: 0; }
  #globalTopbar .brand strong,
  #globalTopbar .brand small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  #globalTopbar .topbar-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    gap: 7px;
  }
  #globalTopbar #accountNav {
    grid-column: 1 / -1;
    display: flex;
    width: 100%;
    min-width: 0;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 7px;
  }
  #globalTopbar .account-nav-section:first-child { display: flex; }
  #globalTopbar .account-nav-section { min-width: 0; flex-wrap: wrap; }
  #globalTopbar .account-nav-profile { margin-left: auto; }
  #globalTopbar .account-user-link em { display: inline; max-width: min(34vw, 135px); }
  #globalTopbar .topbar-actions > .button {
    display: inline-flex !important;
    width: 100%;
    min-height: 43px;
    justify-content: center;
    padding-inline: 10px;
  }

  dialog.dialog {
    width: calc(100vw - 16px);
    max-width: calc(100vw - 16px);
    max-height: calc(100dvh - max(16px, env(safe-area-inset-top)) - max(16px, env(safe-area-inset-bottom)));
    margin: auto;
    padding: 17px;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  dialog.dialog .dialog-header {
    position: sticky;
    z-index: 6;
    top: -17px;
    margin: -17px -17px 18px;
    padding: 17px 17px 12px;
    border-bottom: 1px solid rgba(138,185,220,.12);
    background: linear-gradient(180deg, rgba(12,31,49,.995), rgba(10,27,44,.97));
  }
  dialog.dialog .dialog-header .icon-button { flex: 0 0 auto; }
  .account-identity-dialog { width: min(390px, calc(100vw - 18px)) !important; }

  .account-page-shell > .topbar {
    min-height: 64px;
    padding: max(8px, env(safe-area-inset-top)) 10px 8px;
    gap: 8px;
  }
  .account-page-shell > .topbar .brand small { display: none; }
  .account-page-shell > .topbar .account-nav { flex-wrap: wrap; gap: 6px; }
  .account-page-shell > .topbar .account-nav-section:first-child { display: flex; }
  .account-page-shell > .topbar .account-user-link em { display: none; }
  .account-heading-actions,
  .stats-export-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }
  .account-heading-actions .button { width: 100%; min-width: 0; justify-content: center; }
  .account-auth-card[data-mode="signup"] .account-auth-form-wrap { order: -1; }
  .friend-search { grid-template-columns: 1fr; }
  .friend-search .button { width: 100%; }
  .friend-search-results { padding: 8px; }
  .friend-search-row,
  .friend-row { grid-template-columns: 40px minmax(0, 1fr); align-items: center; }
  .friend-search-row > .button,
  .friend-actions { grid-column: 1 / -1; width: 100%; }
  .friend-search-row > .button { justify-content: center; }
}

@media (max-width: 420px) {
  #globalTopbar .account-nav { justify-content: stretch; }
  #globalTopbar .account-nav > a,
  #globalTopbar .account-nav > .button { flex: 1 1 42%; text-align: center; }
  #globalTopbar .account-nav-section { flex: 1 1 100%; justify-content: flex-end; }
  #globalTopbar .account-user-link em { max-width: 26vw; }
  .account-heading-actions,
  .stats-export-actions { grid-template-columns: 1fr; }
}

.admin-user-directory .section-heading p { max-width: 760px; margin: 5px 0 0; color: #91abc0; line-height: 1.45; }
.admin-user-search { display: grid; grid-template-columns: minmax(220px,1.5fr) repeat(4,minmax(125px,.65fr)) max-content; gap: 10px; align-items: end; margin: 18px 0 12px; }
.admin-user-search .button { min-height: 44px; }
.admin-user-directory-bar { display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 14px; align-items: center; margin-bottom: 14px; padding: 11px 13px; border: 1px solid rgba(132,180,216,.15); border-radius: 14px; background: rgba(74,125,164,.07); }
.admin-user-directory-bar > span { min-width: 0; color: #8faac0; font-size: .75rem; }
.admin-user-directory-bar > div { display: flex; flex-wrap: wrap; gap: 7px; }
.admin-user-controls { display: grid; grid-template-columns: repeat(4,minmax(110px,1fr)); align-items: end; }
.admin-user-control input:not([type="checkbox"]),.admin-user-control select { width: 100%; min-height: 39px; padding: 8px 10px; border: 1px solid rgba(136,184,220,.2); border-radius: 10px; color: #eef8ff; background: rgba(3,14,25,.65); }
.admin-user-control input[type="checkbox"] { width: 21px; height: 21px; }
.admin-user-pagination { display: flex; justify-content: center; align-items: center; gap: 12px; margin-top: 15px; color: #91aabd; }
.stats-game-opponent { display: flex; min-width: 0; flex-wrap: wrap; align-items: center; gap: 5px; }
.stats-game-opponent > span { min-width: 0; overflow-wrap: anywhere; }
.stats-opponent-account { max-width: 100%; padding: 4px 7px; border: 1px solid rgba(92,196,255,.28); border-radius: 999px; overflow: hidden; color: #a9ddff; background: rgba(47,144,205,.12); text-overflow: ellipsis; white-space: nowrap; font: inherit; font-size: .62rem; font-weight: 850; cursor: pointer; }
.stats-opponent-account.relationship-friends { color: #76e5ad; border-color: rgba(83,224,160,.32); background: rgba(52,188,129,.11); }
.stats-opponent-account:disabled { cursor: default; opacity: .65; }
.signup-friend-invite { display: grid; grid-template-columns: 48px minmax(0,1fr) auto; align-items: center; gap: 12px; margin: 0 0 17px; padding: 13px; border: 1px solid rgba(82,213,154,.28); border-radius: 16px; background: linear-gradient(135deg,rgba(39,174,119,.14),rgba(42,125,190,.1)); }
.signup-friend-invite .friend-avatar { width: 48px; height: 48px; }
.signup-friend-invite > div { display: grid; gap: 3px; min-width: 0; }
.signup-friend-invite strong { overflow-wrap: anywhere; }
.signup-friend-invite p { margin: 0; color: #91aec3; font-size: .72rem; line-height: 1.4; }
@media (max-width: 560px) {
  .signup-friend-invite { grid-template-columns: 44px minmax(0,1fr); }
  .signup-friend-invite .button { grid-column: 1 / -1; width: 100%; justify-content: center; }
}

@media (max-width: 900px) {
  .admin-user-search { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .admin-user-search-query { grid-column: 1 / -1; }
  .admin-user-directory-bar { grid-template-columns: 1fr; }
  .admin-user-controls { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 560px) {
  .admin-user-search,.admin-user-controls { grid-template-columns: 1fr; }
  .admin-user-search-query { grid-column: auto; }
  .admin-user-directory-bar > div { display: grid; grid-template-columns: 1fr; }
  .admin-user-directory-bar .button { width: 100%; justify-content: center; }
}

/* 8.0.3: user feedback inbox and reply-ready comments. */
.feedback-launcher {
  position: fixed;
  z-index: 70;
  left: max(16px, env(safe-area-inset-left));
  bottom: max(16px, env(safe-area-inset-bottom));
  min-height: 42px;
  padding: 9px 14px;
  border: 1px solid rgba(117,213,255,.46);
  border-radius: 999px;
  color: #eafbff;
  background: linear-gradient(135deg,rgba(21,129,195,.96),rgba(28,177,137,.94));
  box-shadow: 0 12px 30px rgba(0,0,0,.32), inset 0 1px rgba(255,255,255,.18);
  font: inherit;
  font-size: .72rem;
  font-weight: 900;
  cursor: pointer;
}
.feedback-launcher:hover,.feedback-launcher:focus-visible { transform: translateY(-2px); border-color: #d9f5ff; }
.feedback-dialog { width: min(600px,calc(100vw - 22px)); }
.feedback-dialog .dialog-copy { margin: -8px 0 17px; }
.feedback-guest-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 11px; }
.feedback-dialog textarea {
  width: 100%;
  min-height: 150px;
  resize: vertical;
  padding: 12px 13px;
  border: 1px solid rgba(133,183,220,.24);
  border-radius: 13px;
  outline: none;
  color: var(--text);
  background: rgba(3,14,25,.72);
  font: inherit;
  line-height: 1.45;
}
.feedback-dialog textarea:focus { border-color: #4fbaff; box-shadow: 0 0 0 3px rgba(55,168,255,.1); }
.admin-comment-inbox .section-heading p { max-width: 760px; margin: 5px 0 0; color: #91abc0; line-height: 1.45; }
.admin-comment-search { display: grid; grid-template-columns: minmax(250px,1.5fr) repeat(2,minmax(145px,.65fr)) max-content; gap: 10px; align-items: end; margin: 18px 0 12px; }
.admin-comment-search .button { min-height: 44px; }
.admin-comment-bar { display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 14px; align-items: center; margin-bottom: 14px; padding: 11px 13px; border: 1px solid rgba(132,180,216,.15); border-radius: 14px; background: rgba(74,125,164,.07); }
.admin-comment-bar > span { color: #8faac0; font-size: .75rem; }
.admin-comment-list { display: grid; gap: 10px; }
.admin-comment-row { display: grid; gap: 10px; padding: 15px; border: 1px solid rgba(122,183,220,.18); border-radius: 16px; background: rgba(48,108,151,.08); }
.admin-comment-row.status-archived { opacity: .76; border-color: rgba(133,157,176,.13); background: rgba(77,92,108,.07); }
.admin-comment-head,.admin-comment-foot { display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.admin-comment-head > div { display: grid; gap: 3px; min-width: 0; }
.admin-comment-head a { color: #7dd5ff; overflow-wrap: anywhere; }
.admin-comment-head > span,.admin-comment-foot > span { color: #829db1; font-size: .68rem; overflow-wrap: anywhere; }
.admin-comment-row > p { margin: 0; color: #d6e6f1; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }
.admin-comment-foot { align-items: center; }
.admin-comment-empty { margin: 4px 0; padding: 20px; color: #91aabd; text-align: center; }

@media (max-width: 760px) {
  .feedback-launcher { left: max(10px,env(safe-area-inset-left)); bottom: max(10px,env(safe-area-inset-bottom)); min-height: 38px; padding: 7px 11px; }
  .feedback-guest-fields { grid-template-columns: 1fr; }
  .feedback-dialog .dialog-actions { display: grid; grid-template-columns: 1fr; }
  .feedback-dialog .dialog-actions .button { width: 100%; justify-content: center; }
  .admin-comment-search { grid-template-columns: 1fr; }
  .admin-comment-search-query { grid-column: auto; }
  .admin-comment-bar { grid-template-columns: 1fr; }
  .admin-comment-bar .button { width: 100%; justify-content: center; }
  .admin-comment-head,.admin-comment-foot { display: grid; }
  .admin-comment-foot .button { width: 100%; justify-content: center; }
}

/* Keep the voluntary bag control comfortably tappable after legacy scoreboard rules. */
.player-tracking-trigger { min-height: 47px; padding: 8px 12px; }
.player-tracking-trigger > span { font-size: 21px; }
.player-tracking-trigger > strong { font-size: 11px; }
@media (max-width: 620px) {
  .player-tracking-trigger { min-height: 42px; padding: 7px 9px; }
  .player-tracking-trigger > strong { font-size: 10px; }
}

.signup-account-option { display: grid; gap: 10px; }
.signup-account-profile { display: grid; grid-template-columns: 24px 52px minmax(0,1fr); align-items: center; gap: 11px; padding: 13px; border: 1px solid rgba(78,221,157,.4); border-radius: 17px; color: #e9f8ff; background: linear-gradient(135deg,rgba(37,170,116,.17),rgba(36,123,184,.11)); cursor: pointer; }
.signup-account-profile > input { width: 21px; height: 21px; accent-color: #46d895; }
.signup-account-profile .friend-avatar { width: 52px; height: 52px; }
.signup-account-profile > span:last-child { display: grid; gap: 3px; min-width: 0; }
.signup-account-profile small,.signup-account-profile em { color: #9ab6c9; font-size: .72rem; font-style: normal; line-height: 1.4; }
.signup-account-profile em { color: #76dbaa; }
.signup-account-guest { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 12px; padding: 13px 14px; border: 1px solid rgba(113,183,228,.28); border-radius: 16px; background: rgba(51,129,183,.1); }
.signup-account-guest > div { display: grid; gap: 3px; }
.signup-account-guest small { color: #94afc3; line-height: 1.4; }
@media (max-width: 560px) {
  .signup-account-profile { grid-template-columns: 24px 46px minmax(0,1fr); }
  .signup-account-profile .friend-avatar { width: 46px; height: 46px; }
  .signup-account-guest { grid-template-columns: 1fr; }
  .signup-account-guest .button { width: 100%; justify-content: center; }
}

.premium-player-section,.follow-premium-players { display: grid; gap: 12px; margin-top: 17px; padding-top: 16px; border-top: 1px solid rgba(117,181,220,.16); }
.premium-player-section[hidden],.follow-premium-players[hidden] { display: none !important; }
.follow-premium-players { margin-top: 0; padding: 20px; border: 1px solid rgba(255,205,92,.24); border-radius: 20px; background: linear-gradient(140deg,rgba(116,79,12,.16),rgba(8,27,43,.9)); }
.premium-player-section h3,.premium-player-section p,.follow-premium-players p { margin: 3px 0; }
.premium-player-section p,.follow-premium-players p { color: #92adbf; font-size: .76rem; line-height: 1.45; }
.premium-player-grid { display: grid; gap: 9px; }
.premium-player-card { display: grid; grid-template-columns: 54px minmax(125px,.7fr) minmax(230px,1.3fr); align-items: center; gap: 12px; padding: 12px; border: 1px solid rgba(255,205,91,.24); border-radius: 16px; background: linear-gradient(135deg,rgba(112,78,15,.18),rgba(42,111,159,.11)); }
.premium-player-avatar { width: 54px; height: 54px; display: grid; place-items: center; overflow: hidden; border: 2px solid rgba(255,207,95,.55); border-radius: 50%; color: #211600; background: linear-gradient(145deg,#ffe38f,#e9a936); font-weight: 950; }
.premium-player-avatar img { width: 100%; height: 100%; object-fit: cover; }
.premium-player-card > div { display: grid; min-width: 0; gap: 2px; }
.premium-player-card > div > span { overflow-wrap: anywhere; color: #dcebf5; font-size: .78rem; }
.premium-player-card > div > strong { overflow-wrap: anywhere; color: #fff; }
.premium-player-name-action { appearance: none; justify-self: start; max-width: 100%; overflow-wrap: anywhere; padding: 0; border: 0; color: #fff; background: none; font: inherit; font-weight: 900; text-align: left; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.premium-player-name-action:disabled { color: #d5c799; text-decoration: none; cursor: default; }
.premium-player-card > div > em { color: #8baabd; font-size: .62rem; font-style: normal; }
.premium-player-card > div > small { color: #ffd56e; font-size: .58rem; font-weight: 900; letter-spacing: .09em; }
.premium-player-card dl { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 6px; margin: 0; }
.premium-player-card dl > div { display: grid; gap: 2px; padding: 7px; border-radius: 10px; background: rgba(3,14,24,.42); text-align: center; }
.premium-player-card dt { color: #86a4b9; font-size: .58rem; font-weight: 800; text-transform: uppercase; }
.premium-player-card dd { margin: 0; color: #fff; font-size: .82rem; font-weight: 900; }
@media (max-width: 620px) {
  .premium-player-card { grid-template-columns: 48px minmax(0,1fr); }
  .premium-player-avatar { width: 48px; height: 48px; }
  .premium-player-card dl { grid-column: 1 / -1; grid-template-columns: repeat(2,minmax(0,1fr)); }
}

/* Version 8.0.6: a focused event hub and waiting-room-owned live tournament tools. */
.dedicated-bracket-page [data-event-page-only],
html:not(.dedicated-bracket-page) [data-bracket-page-only] { display: none !important; }
.dedicated-bracket-page .event-banner { margin-bottom: 12px; padding: 18px 20px; }
.dedicated-bracket-page .event-details { display: none; }
.dedicated-bracket-page .bracket-viewport.bracket-viewport-inline { height: calc(100dvh - 245px); min-height: 520px; }

/* This is the primary event decision button, so it stays obvious even to a
   first-time player while the compact scoreboard variation remains unchanged. */
.event-actions .my-status-link {
  min-height: 56px;
  padding: 10px 20px;
  border-width: 2px;
  border-radius: 17px;
  font-size: 14px;
  line-height: 1.25;
  white-space: normal;
  text-align: center;
  box-shadow: inset 0 1px rgba(255,255,255,.18), 0 13px 32px rgba(0,145,211,.2);
}
.event-actions .my-status-link::before { font-size: 21px; }
.follow-topline .my-status-link { min-height: 48px; padding: 8px 15px; font-size: 12px; }

.follow-waiting-room-links {
  display: grid;
  grid-template-columns: minmax(0,1.35fr) minmax(0,1fr);
  gap: 11px;
  padding: 12px;
  border-radius: 20px;
}
.follow-waiting-room-links .button { min-height: 51px; justify-content: center; font-size: 13px; }
.follow-board-activity,
.follow-rankings {
  display: grid;
  gap: 14px;
  padding: clamp(17px,3vw,25px);
  border-radius: 24px;
}
.follow-board-activity { border-color: rgba(91,194,249,.28); background: linear-gradient(145deg,rgba(18,76,116,.22),rgba(6,22,35,.9)); }
.follow-board-activity-heading { margin: 0; }
.follow-board-activity > .button { min-height: 47px; justify-self: start; }
#followManageBoardQueueBtn[hidden],
#manageBoardQueueBtn[hidden] { display: none !important; }
.follow-rankings .rankings-heading { margin-bottom: 0; }
.follow-rankings .ranking-item { text-decoration: none; }
.follow-rankings .ranking-copy b,
.follow-rankings .ranking-copy small { white-space: normal; overflow-wrap: anywhere; }
#followBoardQueueDialog { width: min(820px,calc(100% - 24px)); }

@media (max-width: 620px) {
  .event-actions .my-status-link { flex-basis: 100%; min-height: 61px; font-size: 15px; }
  .follow-waiting-room-links { grid-template-columns: 1fr; padding: 10px; }
  .follow-waiting-room-links .button { min-height: 54px; }
  .follow-board-activity,
  .follow-rankings { padding: 17px 14px; border-radius: 20px; }
  .follow-board-activity > .button { width: 100%; justify-content: center; }
  .follow-rankings .rankings-heading { display: grid; }
  .follow-rankings .ranking-list { margin-inline: -2px; }
  .dedicated-bracket-page .event-banner { padding: 15px; }
  .dedicated-bracket-page .bracket-viewport.bracket-viewport-inline { height: calc(100dvh - 285px); min-height: 470px; }
}

.follow-account-stats {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(260px,auto);
  align-items: center;
  gap: 14px;
  padding: 17px 19px;
  border-radius: 22px;
}
.follow-account-stats > div { display: grid; gap: 4px; }
.follow-account-stats strong { font-size: 15px; }
.follow-account-stats small { color: var(--muted); line-height: 1.4; }
.account-stats-toggle { min-height: 50px; white-space: normal; text-align: center; line-height: 1.25; }
.account-stats-toggle[hidden] { display: none !important; }
.account-stats-toggle.is-linked {
  border-color: rgba(89,239,167,.68);
  background: linear-gradient(135deg,rgba(16,112,78,.62),rgba(6,58,48,.78));
  color: #eafff4;
}
.account-stats-player-choices { display: grid; gap: 10px; }
.account-stats-link-dialog { width: min(470px,calc(100% - 24px)); }
@media (max-width: 620px) {
  .follow-account-stats { grid-template-columns: 1fr; padding: 16px 14px; }
  .follow-account-stats .button { width: 100%; }
}

/* Version 8.0.7: one identity-aware waiting room and deliberately simple event choices. */
html:not(.dedicated-bracket-page) .event-actions {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  width: 100%;
  gap: 12px;
}
html:not(.dedicated-bracket-page) .event-banner {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(420px,min(48vw,650px));
  align-items: center;
}
html:not(.dedicated-bracket-page) .event-copy,
html:not(.dedicated-bracket-page) .event-side { min-width: 0; }
html:not(.dedicated-bracket-page) .event-side { width: 100%; align-items: stretch; }
html:not(.dedicated-bracket-page) .countdown-card { justify-self: end; }
html:not(.dedicated-bracket-page) .event-actions #myStatusBracketBtn,
html:not(.dedicated-bracket-page) .event-actions #signupLinkBtn {
  width: 100%;
  min-height: 62px;
  padding: 11px 18px;
  justify-content: center;
  white-space: normal;
  text-align: center;
  font-size: 14px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
html:not(.dedicated-bracket-page) .event-actions #shareSignupBtn { grid-column: 1 / -1; width: 100%; min-height: 45px; justify-content: center; }
.dedicated-bracket-page #myStatusBracketBtn { display: none !important; }
.dedicated-bracket-page #bracketBackToGameBtn { display: inline-flex; width: max-content; }

.follow-waiting-room-links-bottom { grid-template-columns: 1fr; margin-top: 2px; }
.follow-member-profile {
  display: grid;
  gap: 13px;
  padding: clamp(17px,3vw,24px);
  border-radius: 22px;
  border-color: rgba(91,194,249,.24);
}
.follow-member-profile-button {
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center;
  gap: 13px;
  width: 100%;
  padding: 13px;
  border: 1px solid rgba(110,203,248,.28);
  border-radius: 18px;
  color: var(--text);
  background: linear-gradient(135deg,rgba(30,132,192,.16),rgba(36,183,135,.09));
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.follow-member-profile-button:hover,.follow-member-profile-button:focus-visible { border-color: rgba(126,224,255,.72); transform: translateY(-1px); }
.follow-member-profile-button > span:nth-child(2) { display: grid; min-width: 0; gap: 4px; }
.follow-member-profile-button strong { overflow-wrap: anywhere; font-size: 1rem; }
.follow-member-profile-button small { color: var(--muted); }
.follow-member-profile-button em { color: #7de2ff; font-size: .78rem; font-style: normal; font-weight: 900; }
.follow-result-row.live-standing.active { border-color: rgba(82,218,154,.26); background: linear-gradient(90deg,rgba(40,177,114,.12),rgba(255,255,255,.03)); }
.follow-result-row.live-standing.eliminated { opacity: .72; }
.account-following-only { color: #b8d0e2; }

@media (max-width: 1020px) {
  html:not(.dedicated-bracket-page) .event-banner { grid-template-columns: 1fr; }
  html:not(.dedicated-bracket-page) .event-side { margin-top: 4px; }
  html:not(.dedicated-bracket-page) .countdown-card { justify-self: start; text-align: left; }
}
@media (max-width: 620px) {
  html:not(.dedicated-bracket-page) .event-actions { grid-template-columns: 1fr; width: 100%; }
  html:not(.dedicated-bracket-page) .event-actions #shareSignupBtn { grid-column: auto; }
  html:not(.dedicated-bracket-page) .event-actions #myStatusBracketBtn,
  html:not(.dedicated-bracket-page) .event-actions #signupLinkBtn { min-height: 64px; padding: 12px 14px; font-size: 15px; }
  html:not(.dedicated-bracket-page) .event-actions #shareSignupBtn { min-height: 49px; font-size: 13px; }
  .follow-member-profile-button { grid-template-columns: 58px minmax(0,1fr) auto; }
}

/* Version 8.0.8: reliable event identity action and compact home header. */
.event-actions .my-status-link.needs-identity {
  animation: event-identity-invite 2.8s ease-in-out infinite;
}
@keyframes event-identity-invite {
  0%,100% { box-shadow: inset 0 1px rgba(255,255,255,.14), 0 8px 22px rgba(0,154,219,.16), 0 0 0 0 rgba(71,190,255,.08); }
  50% { border-color: rgba(139,232,255,.92); box-shadow: inset 0 1px rgba(255,255,255,.2), 0 11px 32px rgba(0,166,235,.28), 0 0 0 5px rgba(71,190,255,.1); }
}
html:not(.dedicated-bracket-page) .event-actions.signup-closed #myStatusBracketBtn { grid-column: 1 / -1; }
.home-view-active #globalTopbar .topbar-actions > #justPlayBtn,
.home-view-active #globalTopbar .topbar-actions > #newTournamentBtn { display: none !important; }
.home-view-active #globalTopbar .topbar-actions { width: auto; }
@media (max-width:760px) {
  .home-view-active #globalTopbar {
    display: flex;
    min-height: 64px;
    padding: max(8px,env(safe-area-inset-top)) 10px 8px;
    gap: 10px;
  }
  .home-view-active #globalTopbar .topbar-actions { display: flex; width: auto; margin-left: auto; }
  .home-view-active #globalTopbar #accountNav { display: flex; width: auto; min-width: auto; flex-wrap: nowrap; }
  .home-view-active #globalTopbar .account-user-link em { display: none; }
}
@media (prefers-reduced-motion:reduce) {
  .event-actions .my-status-link.needs-identity { animation: none; }
}

.friend-column-done { grid-column: 1 / -1; width: 100%; min-height: 42px; justify-content: center; margin-top: 3px; }
.friend-table-swipe-hint { display: none; margin: 0; padding: 7px 15px; color: #83a8bf; background: rgba(5,18,30,.7); font-size: .66rem; font-weight: 750; }
@media (max-width:620px) {
  .friend-table-swipe-hint { display: block; }
  .friend-rank-table { min-width: 560px; }
  .friend-rank-table th,.friend-rank-table td { height: 56px; padding-inline: 6px; font-size: .71rem; }
  .friend-rank-table th { height: 40px; font-size: .56rem; letter-spacing: .025em; }
  .friend-rank-table th button { padding: 4px 2px; }
  .friend-rank-table th:first-child,.friend-rank-table td:first-child { width: 42px; min-width: 42px; }
  .friend-rank-table th:nth-child(2),.friend-rank-table td:nth-child(2) { left: 42px; width: 136px; min-width: 136px; }
  .friend-rank-avatar { width: 32px; height: 32px; flex-basis: 32px; }
  .friend-rank-player { gap: 6px; }
  .friend-rank-player strong { max-width: 90px; overflow: visible; white-space: normal; overflow-wrap: anywhere; text-overflow: clip; font-size: .72rem; line-height: 1.08; }
  .friend-rank-player small { font-size: .55rem; line-height: 1.05; white-space: normal; }
  .friend-rank-position { font-size: .84rem !important; }
}

/* Version 8.0.17: compact event navigation and collision-free scoreboard tools. */
.event-view-active #globalTopbar .topbar-actions > #justPlayBtn,
.event-view-active #globalTopbar .topbar-actions > #newTournamentBtn { display: none !important; }
.event-view-active #globalTopbar {
  min-height: 64px;
  padding-block: 8px;
}
.event-view-active #globalTopbar .topbar-actions { width: auto; }

/* Bag logging lives immediately below the identity row instead of floating over a name. */
@media (orientation: portrait) and (max-width:620px) {
  .player-tracking-trigger { top: 104px; right: 7px; }
}

@media (max-width:760px), (hover:none) and (pointer:coarse) {
  .account-nav-scoreboard .account-scoreboard-link {
    width: 58px;
    min-width: 58px;
    min-height: 36px;
    padding: 0;
    overflow: hidden;
    font-size: 0;
    white-space: nowrap;
  }
  .account-nav-scoreboard .account-scoreboard-link::before {
    content: "Log in";
    color: #d8ebf8;
    font-size: .64rem;
    font-weight: 900;
  }
}

@media (orientation:landscape) and (max-height:620px) {
  /* The account control stays in the upper-right corner; Share and Options remain below it. */
  .account-nav-scoreboard {
    position: fixed;
    z-index: 75;
    top: max(7px,env(safe-area-inset-top));
    right: max(8px,env(safe-area-inset-right));
  }
  .player-tracking-trigger { top: 64px; }

  /* Whichever card is visually on the right gets its bag control on the inner edge,
     away from the upper-right scoreboard controls. */
  .score-grid:not(.swapped) > .score-card:nth-child(2) > .player-tracking-trigger,
  .score-grid.swapped > .score-card:nth-child(1) > .player-tracking-trigger {
    right: auto;
    left: 8px;
  }
}

@media (max-width:760px) {
  .event-view-active #globalTopbar {
    display: flex;
    min-height: 64px;
    padding: max(8px,env(safe-area-inset-top)) 10px 8px;
    gap: 10px;
  }
  .event-view-active #globalTopbar .topbar-actions { display: flex; width: auto; margin-left: auto; }
  .event-view-active #globalTopbar #accountNav { display: flex; width: auto; min-width: auto; flex-wrap: nowrap; }
  .event-view-active #globalTopbar .account-user-link em { display: none; }
}

/* Version 8.0.18: slim claimed-player friend connections. */
.player-premium-account {
  display: grid;
  gap: 8px;
  margin-top: 12px;
  padding: 10px;
  border: 1px solid rgba(255,205,91,.25);
  border-radius: 14px;
  background: linear-gradient(135deg,rgba(112,78,15,.12),rgba(38,116,167,.09));
}
.player-premium-account[hidden] { display: none !important; }
.player-premium-account > div:first-child { display: grid; gap: 2px; }
.player-premium-account > div:first-child small { color: #8facbf; font-size: .65rem; line-height: 1.35; }
.premium-player-grid-compact { gap: 6px; }
.premium-player-card-compact {
  grid-template-columns: 38px minmax(0,1fr);
  gap: 9px;
  padding: 8px 10px;
  border-radius: 12px;
}
.premium-player-card-compact .premium-player-avatar { width: 38px; height: 38px; border-width: 1px; font-size: .72rem; }
.premium-player-card-compact > div { grid-template-columns: minmax(0,1fr) auto; column-gap: 8px; }
.premium-player-card-compact > div > span { grid-column: 1 / -1; color: #9ab4c7; font-size: .63rem; }
.premium-player-card-compact .premium-player-name-action { align-self: center; font-size: .82rem; }
.premium-player-card-compact > div > small { align-self: center; font-size: .5rem; white-space: nowrap; }
.premium-player-card-compact > div > em { grid-column: 1 / -1; font-size: .59rem; }

.friend-connect-dialog {
  width: min(390px,calc(100vw - 22px));
  padding: 22px;
  text-align: center;
  background: radial-gradient(circle at 50% 0,rgba(76,202,255,.17),transparent 46%),linear-gradient(155deg,#0c2032,#071521) !important;
}
.friend-connect-dialog h2 { margin: 5px 0 8px; font-family: "Space Grotesk",sans-serif; font-size: 1.65rem; }
.friend-connect-dialog p { margin: 0 auto; max-width: 320px; color: #a5bdcf; font-size: .78rem; line-height: 1.5; }
.friend-connect-symbol {
  display: grid;
  width: 46px;
  height: 46px;
  margin: 0 auto 10px;
  place-items: center;
  border-radius: 15px;
  color: #061720;
  background: linear-gradient(145deg,#6fd7ff,#52e2a5);
  font-size: 1.45rem;
  font-weight: 950;
}
.friend-connect-actions { grid-template-columns: 1fr 1fr; margin-top: 16px; }
@media (max-width:420px) {
  .premium-player-card-compact > div { grid-template-columns: 1fr; }
  .premium-player-card-compact > div > span,
  .premium-player-card-compact > div > em { grid-column: auto; }
  .premium-player-card-compact > div > small { justify-self: start; }
  .friend-connect-actions { grid-template-columns: 1fr; }
}

/* Version 8.0.19: recoverable activity administration, Just Play archives, and Premium home feed. */
.home-friend-feed {
  display: grid;
  gap: 13px;
  padding: 18px 20px;
  border-radius: 20px;
  background: radial-gradient(circle at 2% 0,rgba(44,173,238,.17),transparent 42%),rgba(7,20,33,.86);
}
.home-feed-heading { margin: 0; }
.home-feed-heading h2 { margin: 2px 0 0; }
.home-feed-group { display: grid; gap: 8px; }
.home-feed-group h3 { margin: 0; color: #9eb9cd; font-size: .68rem; letter-spacing: .09em; text-transform: uppercase; }
.home-feed-strip { display: flex; gap: 8px; overflow-x: auto; padding: 1px 1px 4px; scrollbar-width: thin; }
.home-feed-person {
  display: grid;
  grid-template-columns: 38px minmax(105px,1fr) auto;
  align-items: center;
  gap: 8px;
  min-width: min(290px,82vw);
  padding: 8px 9px;
  border: 1px solid rgba(124,183,220,.16);
  border-radius: 13px;
  background: rgba(80,134,172,.09);
}
.home-feed-avatar { display: grid; width: 38px; height: 38px; place-items: center; overflow: hidden; border-radius: 50%; background: linear-gradient(145deg,#1896e5,#6bd7ff); color: #04131f; font-size: .72rem; font-weight: 950; }
.home-feed-avatar img { width: 100%; height: 100%; object-fit: cover; }
.home-feed-person > div:not(.home-feed-person-actions) { display: grid; min-width: 0; }
.home-feed-person strong { overflow: hidden; color: #edf7ff; font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }
.home-feed-person span { overflow: hidden; color: #86a7bd; font-size: .61rem; text-overflow: ellipsis; white-space: nowrap; }
.home-feed-person-actions { display: flex; align-items: center; gap: 4px; }
.home-feed-action,.home-feed-dismiss { min-height: 31px; border: 0; border-radius: 9px; cursor: pointer; font: inherit; font-size: .61rem; font-weight: 900; }
.home-feed-action { padding: 0 10px; color: #041824; background: linear-gradient(145deg,#68d9ff,#58dfa1); }
.home-feed-dismiss { width: 30px; padding: 0; color: #8ca9bb; background: rgba(117,156,183,.12); }
.home-feed-action:disabled,.home-feed-dismiss:disabled { opacity: .5; cursor: wait; }
.home-feed-activity { display: grid; grid-template-columns: repeat(auto-fit,minmax(230px,1fr)); gap: 7px; }
.home-feed-game { display: grid; grid-template-columns: 36px minmax(0,1fr); align-items: center; gap: 9px; padding: 8px 10px; border-left: 3px solid #db6e6e; border-radius: 11px; background: rgba(69,107,138,.1); }
.home-feed-game.is-win { border-left-color: #50d99c; }
.home-feed-game .home-feed-avatar { width: 36px; height: 36px; }
.home-feed-game > div { display: grid; min-width: 0; }
.home-feed-game strong,.home-feed-game span,.home-feed-game small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.home-feed-game strong { font-size: .72rem; }.home-feed-game span { color: #bed2df; font-size: .66rem; }.home-feed-game small { color: #7191a8; font-size: .56rem; }
.archive-remove-button { border: 0; padding: 3px 0; color: #d79999; background: transparent; cursor: pointer; font: inherit; font-size: .61rem; font-weight: 800; }

.admin-game-page { display: grid; gap: 18px; width: min(1450px,calc(100% - 28px)); }
.admin-game-workspace { display: grid; gap: 18px; }
.admin-game-search-card { display: grid; gap: 15px; padding-bottom: 16px; }
.admin-game-search { display: grid; grid-template-columns: minmax(260px,1.8fr) repeat(4,minmax(135px,.65fr)) auto; align-items: end; gap: 10px; }
.admin-game-tabs { display: flex; gap: 6px; overflow-x: auto; padding-top: 13px; border-top: 1px solid rgba(139,180,212,.14); }
.admin-game-tabs button { flex: 0 0 auto; border: 0; border-radius: 999px; padding: 8px 13px; color: #8facc0; background: rgba(104,150,183,.1); cursor: pointer; font: inherit; font-size: .68rem; font-weight: 900; }
.admin-game-tabs button.is-active { color: #05131d; background: linear-gradient(145deg,#6bd9ff,#54dfa4); }
.admin-game-panel { display: grid; gap: 14px; }
.admin-resource-list,.admin-result-list,.admin-audit-list { display: grid; gap: 9px; }
.admin-resource-card { display: grid; gap: 11px; padding: 14px; border: 1px solid rgba(130,179,211,.16); border-radius: 16px; background: rgba(69,112,145,.07); }
.admin-resource-card.status-deleted { border-color: rgba(220,105,105,.28); background: rgba(126,49,49,.08); }
.admin-resource-card.status-archived { opacity: .88; }
.admin-resource-head { display: flex; justify-content: space-between; gap: 16px; }
.admin-resource-head h3 { margin: 2px 0; font-size: 1rem; }.admin-resource-head p { margin: 0; color: #85a3b8; font-size: .68rem; }
.admin-resource-status { align-self: start; padding: 5px 8px; border-radius: 999px; color: #9fb9ca; background: rgba(118,156,181,.12); font-size: .58rem; text-transform: uppercase; }
.admin-resource-status.status-active { color: #65e1a5; }.admin-resource-status.status-completed { color: #ffd06c; }.admin-resource-status.status-deleted { color: #ff9a9a; }
.admin-resource-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.admin-resource-members { display: grid; gap: 5px; }
.admin-resource-member { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 7px 9px; border-radius: 10px; background: rgba(126,166,194,.07); }
.admin-resource-member > div:first-child { display: grid; min-width: 0; }.admin-resource-member strong { font-size: .73rem; }.admin-resource-member span { overflow: hidden; color: #7f9db2; font-size: .6rem; text-overflow: ellipsis; white-space: nowrap; }
.admin-resource-member-controls { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.admin-inline-toggle { display: inline-flex; align-items: center; gap: 5px; min-height: 30px; padding: 4px 8px; border-radius: 9px; color: #9eb7c8; background: rgba(105,150,181,.1); cursor: pointer; font-size: .59rem; font-weight: 850; }
.admin-inline-toggle input { width: 15px; height: 15px; accent-color: #48d397; }.admin-inline-toggle.is-explicit { box-shadow: inset 0 0 0 1px rgba(84,221,164,.22); }
.admin-result-card { display: grid; gap: 9px; padding: 12px 14px; border: 1px solid rgba(130,179,211,.14); border-radius: 14px; background: rgba(68,111,144,.07); }
.admin-result-head { display: grid; grid-template-columns: minmax(0,1fr) minmax(260px,.75fr); align-items: center; gap: 14px; }
.admin-result-head > div:first-child { display: grid; }.admin-result-head > div:first-child strong { font-size: .78rem; }.admin-result-head > div:first-child span { color: #7e9db3; font-size: .61rem; }
.admin-result-score { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: center; gap: 9px; text-align: center; }
.admin-result-score span { overflow: hidden; color: #b6cbd9; font-size: .68rem; text-overflow: ellipsis; white-space: nowrap; }.admin-result-score strong { color: #fff; font-size: 1.15rem; }
.admin-result-participants { display: flex; flex-wrap: wrap; gap: 5px; padding-top: 8px; border-top: 1px solid rgba(132,175,204,.1); }
.admin-result-participant { display: flex; align-items: center; gap: 7px; padding-left: 8px; border-radius: 10px; color: #a9c0cf; background: rgba(107,151,181,.07); font-size: .62rem; }
.admin-audit-row { display: flex; justify-content: space-between; gap: 14px; padding: 10px 12px; border-radius: 11px; background: rgba(99,143,174,.08); }
.admin-audit-row > div { display: grid; }.admin-audit-row strong { color: #dcecf6; font-size: .7rem; text-transform: capitalize; }.admin-audit-row span,.admin-audit-row small { color: #7897ad; font-size: .6rem; }
.admin-compact-empty { margin: 0; padding: 18px; border-radius: 12px; color: #7898ae; background: rgba(95,138,168,.06); font-size: .72rem; text-align: center; }

@media (max-width:980px) {
  .admin-game-search { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .admin-game-query { grid-column: 1 / -1; }
  .admin-result-head { grid-template-columns: 1fr; }
}
@media (max-width:600px) {
  .home-friend-feed { padding: 15px 13px; }
  .home-feed-heading { align-items: center; }.home-feed-heading .button { width: auto; }
  .admin-game-page { width: min(100% - 18px,1450px); }
  .admin-game-search { grid-template-columns: 1fr 1fr; }
  .admin-game-query,.admin-game-search .button { grid-column: 1 / -1; }
  .admin-resource-head,.admin-resource-member,.admin-audit-row { align-items: flex-start; flex-direction: column; }
  .admin-resource-member-controls { width: 100%; justify-content: flex-start; }
  .admin-result-score { grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); }
  .admin-result-participant { width: 100%; justify-content: space-between; }
}

/* Version 8.0.20: reusable archives, score correction, branding assets, and staged home marketing. */
.home-free-feature-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px 14px; margin-top: 15px; color: #d8e9f4; font-size: .76rem; font-weight: 780; }
.home-free-feature-list span { min-width: 0; }
.home-free-signup { display: grid; gap: 7px; }
.home-free-signup .button { justify-self: start; }
.member-premium-panel { background: radial-gradient(circle at 88% 8%,rgba(255,196,62,.13),transparent 24rem),linear-gradient(120deg,rgba(8,36,58,.96),rgba(44,31,8,.84)); }

.brand.brand-uses-header-logo > .brand-mark,
.simple-registration-brand.brand-uses-header-logo > .brand-mark { display: none; }
.brand-header-logo { display: flex !important; width: min(var(--header-logo-desktop-width,230px),42vw); height: var(--header-logo-desktop-height,30px); align-items: center; overflow: visible; background: transparent !important; box-shadow: none !important; }
.simple-registration-brand .brand-header-logo { width: min(var(--header-logo-desktop-width,230px),58vw); height: var(--header-logo-desktop-height,30px); }
.brand-header-logo img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: left center; background: transparent !important; border: 0; box-shadow: none; }

.admin-brand-grid { grid-template-columns: minmax(220px,.7fr) repeat(3,minmax(250px,1fr)); align-items: stretch; }
.admin-brand-asset { display: grid; align-content: space-between; gap: 14px; min-width: 0; padding: 15px; border: 1px solid rgba(129,180,216,.16); border-radius: 17px; background: rgba(75,122,156,.07); }
.brand-logo-preview-wide { width: 128px; flex-basis: 128px; border-radius: 13px; background: rgba(109,156,188,.12); color: #cbe1ef; font-size: .72rem; }
.brand-logo-preview-wide img { object-fit: contain; padding: 7px; }
.brand-favicon-preview { width: 54px; height: 54px; flex-basis: 54px; border-radius: 13px; }
.admin-brand-mode { margin-top: 2px; }
.admin-logo-size-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; }
.admin-logo-size-grid .field { gap: 4px; font-size: .6rem; }
.admin-logo-size-grid input { min-height: 36px; padding: 6px 8px; }
.admin-header-logo-asset > .button { justify-self: start; }

.game-state-banner.archived { color: #c8e9ff; background: linear-gradient(90deg,rgba(38,120,176,.16),rgba(76,158,204,.24),rgba(38,120,176,.16)); border-radius: 10px; }
.archived-quick-room .game-state-banner { display: grid !important; min-height: 34px; padding: 5px 10px; }
.archived-quick-room .end-play-button:disabled { opacity: .65; cursor: default; }

.admin-control-guide { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; padding: 11px; border: 1px solid rgba(124,182,218,.15); border-radius: 14px; background: rgba(58,104,137,.07); }
.admin-control-guide div { display: grid; gap: 3px; min-width: 0; padding: 8px; }
.admin-control-guide strong { color: #dcecf7; font-size: .67rem; }
.admin-control-guide span { color: #7f9db2; font-size: .59rem; line-height: 1.4; }
.admin-score-correction { display: flex; flex-wrap: wrap; align-items: end; gap: 6px; width: fit-content; max-width: 100%; padding-top: 7px; border-top: 1px solid rgba(132,175,204,.1); }
.admin-score-correction label { display: grid; width: min(116px,32vw); min-width: 76px; gap: 3px; overflow: hidden; color: #91acbf; font-size: .56rem; font-weight: 850; text-overflow: ellipsis; white-space: nowrap; }
.admin-score-correction input { width: 76px; min-width: 0; min-height: 30px; padding: 4px 6px; text-align: center; }
.admin-score-correction > span { align-self: center; color: #6f8fa5; font-weight: 900; }
.admin-score-correction .button { min-height: 30px; padding-inline: 9px; border-radius: 9px; font-size: .61rem; }
.admin-score-note { flex: 1 0 100%; margin: 0; color: #718fa4; font-size: .57rem; line-height: 1.4; }

@media (max-width:1100px) {
  .admin-brand-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .admin-control-guide { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width:620px) {
  .home-free-feature-list,.admin-brand-grid,.admin-control-guide { grid-template-columns: 1fr; }
  .home-free-signup .button { width: 100%; }
  .brand-header-logo,.simple-registration-brand .brand-header-logo { width: min(var(--header-logo-mobile-width,175px),calc(100vw - 104px)); height: var(--header-logo-mobile-height,27px); }
  .admin-score-correction { width: 100%; }
  .admin-score-correction label { width: min(96px,31vw); }
  .admin-score-correction .button { flex: 0 0 auto; width: auto; }
}

/* Version 8.0.22: full-width desktop home cards and roomier event actions. */
.home-view-active .welcome-view { grid-template-columns: minmax(0,1fr); }
.home-view-active .welcome-view > .hero-panel,
.home-view-active .welcome-view > .home-membership-panel,
.home-view-active .welcome-view > .home-friend-feed,
.home-view-active .welcome-view > .tournament-library { grid-column: 1 / -1; width: 100%; }
.home-view-active .tournament-library { min-height: auto; }
html:not(.dedicated-bracket-page) .event-actions #myStatusBracketBtn[hidden] + #signupLinkBtn { grid-column: 1 / -1; }

@media (min-width:1021px) {
  html:not(.dedicated-bracket-page) .event-banner {
    grid-template-columns: minmax(0,1fr) minmax(520px,min(56vw,760px));
  }
  html:not(.dedicated-bracket-page) .event-actions { gap: 14px; }
  html:not(.dedicated-bracket-page) .event-actions #myStatusBracketBtn,
  html:not(.dedicated-bracket-page) .event-actions #signupLinkBtn { min-height: 66px; padding-inline: 22px; }
}

/* Version 8.0.23: optional cancellation-scored Advanced Bag Counting. */
.quick-team-members { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.quick-team-members[hidden] { display: none !important; }

.score-card.advanced-bag-mode .score-add-zone { pointer-events: none; }
.score-card.advanced-bag-mode .score-add-zone .score-number { opacity: .26; filter: saturate(.75); }
.score-card.advanced-bag-mode .score-add-zone small { visibility: hidden; }
.advanced-bag-pad {
  position: relative;
  z-index: 4;
  grid-row: 2;
  grid-column: 1;
  min-width: 0;
  min-height: 0;
  padding: clamp(8px,1.4vw,16px);
}
.advanced-bag-pad[hidden],.advanced-thrower-controls[hidden],.advanced-inning-bar[hidden] { display: none !important; }
.advanced-bag-outer {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 155px;
  border: 1px dashed rgba(255,255,255,.42);
  border-radius: clamp(18px,3vw,30px);
  outline: 0;
  color: rgba(255,255,255,.8);
  background: rgba(3,12,22,.07);
  cursor: pointer;
  user-select: none;
  touch-action: manipulation;
}
.advanced-bag-outer:active { background: rgba(255,255,255,.09); }
.advanced-bag-outer:focus-visible { box-shadow: inset 0 0 0 3px rgba(255,255,255,.5); }
.advanced-on-label { position: absolute; top: 12px; left: 14px; font-size: clamp(9px,1.2vw,13px); font-weight: 950; letter-spacing: .13em; }
.advanced-bag-outer > strong { position: absolute; top: 29px; left: 14px; color: rgba(255,255,255,.68); font-family: "Space Grotesk",sans-serif; font-size: clamp(34px,5vw,64px); line-height: 1; }
.advanced-bag-outer > small { position: absolute; right: 13px; bottom: 10px; color: rgba(255,255,255,.68); font-size: clamp(9px,1.1vw,12px); font-weight: 850; }
.advanced-hole-circle {
  position: absolute;
  left: 50%;
  top: 50%;
  display: grid;
  width: clamp(112px,14vw,188px);
  height: clamp(112px,14vw,188px);
  place-items: center;
  align-content: center;
  border: clamp(3px,.4vw,6px) solid rgba(255,255,255,.7);
  border-radius: 50%;
  color: rgba(255,255,255,.9);
  background: rgba(4,13,23,.22);
  box-shadow: 0 0 0 8px rgba(255,255,255,.055), inset 0 0 34px rgba(255,255,255,.08);
  transform: translate(-50%,-50%);
  cursor: pointer;
  touch-action: manipulation;
}
.advanced-hole-circle:active { background: rgba(255,255,255,.18); transform: translate(-50%,-50%) scale(.96); }
.advanced-hole-circle span { font-size: clamp(9px,1.1vw,12px); font-weight: 950; letter-spacing: .13em; }
.advanced-hole-circle strong { font-family: "Space Grotesk",sans-serif; font-size: clamp(48px,7vw,92px); line-height: .82; opacity: .82; }
.advanced-thrower-controls { position: relative; z-index: 5; grid-row: 3; display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid rgba(255,255,255,.18); }
.advanced-thrower-button { min-width: 0; min-height: clamp(58px,9vh,90px); padding: 8px 10px; overflow: hidden; border: 0; border-right: 1px solid rgba(255,255,255,.18); color: rgba(255,255,255,.75); background: rgba(0,0,0,.13); font-family: "Space Grotesk",sans-serif; font-size: clamp(13px,2vw,22px); font-weight: 850; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }
.advanced-thrower-button:last-child { border-right: 0; }
.advanced-thrower-button.selected { color: #05150d; background: linear-gradient(145deg,#84f1be,#3bd58e); box-shadow: inset 0 0 0 3px rgba(255,255,255,.28); }
.advanced-inning-bar {
  position: absolute;
  z-index: 38;
  left: 50%;
  bottom: 12px;
  display: flex;
  width: min(460px,calc(100% - 34px));
  min-height: 54px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 7px 8px 7px 14px;
  border-radius: 17px;
  background: rgba(4,15,26,.88);
  box-shadow: 0 15px 45px rgba(0,0,0,.42);
  transform: translateX(-50%);
  backdrop-filter: blur(13px);
}
.score-grid.advanced-has-throwers .advanced-inning-bar { bottom: calc(clamp(58px,9vh,90px) + 9px); }
.advanced-inning-bar > span { display: grid; min-width: 0; gap: 2px; }
.advanced-inning-bar small { color: #7fa1b9; font-size: 8px; font-weight: 900; letter-spacing: .14em; }
.advanced-inning-bar strong { overflow: hidden; color: #eff8ff; font-size: clamp(10px,1.25vw,13px); text-overflow: ellipsis; white-space: nowrap; }
.advanced-inning-bar .button { flex: 0 0 auto; min-height: 40px; padding-inline: 18px; }
.score-card.advanced-bag-mode .last-stable-score { bottom: auto; top: calc(50% + 62px); }

@media (max-width:620px) {
  .quick-team-members { grid-template-columns: 1fr; }
  .advanced-bag-pad { padding: 5px; }
  .advanced-bag-outer { min-height: 126px; border-radius: 14px; }
  .advanced-on-label { top: 7px; left: 8px; font-size: 7px; }
  .advanced-bag-outer > strong { top: 19px; left: 8px; font-size: 29px; }
  .advanced-bag-outer > small { right: 7px; bottom: 6px; font-size: 7px; }
  .advanced-hole-circle { width: clamp(82px,29vw,116px); height: clamp(82px,29vw,116px); border-width: 3px; box-shadow: 0 0 0 5px rgba(255,255,255,.055),inset 0 0 22px rgba(255,255,255,.08); }
  .advanced-hole-circle span { font-size: 7px; }
  .advanced-hole-circle strong { font-size: clamp(38px,14vw,58px); }
  .advanced-thrower-button { min-height: 58px; padding: 6px 4px; font-size: clamp(10px,3.2vw,14px); }
  .advanced-inning-bar { width: min(350px,calc(100% - 20px)); min-height: 48px; gap: 7px; padding: 5px 6px 5px 10px; }
  .advanced-inning-bar .button { min-height: 37px; padding-inline: 11px; font-size: 10px; }
  .advanced-inning-bar strong { max-width: 185px; font-size: 9px; }
  .score-card.advanced-bag-mode .last-stable-score { top: auto; bottom: 67px; }
}

@media (orientation:landscape) and (max-height:620px) {
  .advanced-bag-pad { padding: 4px; }
  .advanced-bag-outer { min-height: 92px; }
  .advanced-hole-circle { width: clamp(74px,22vh,116px); height: clamp(74px,22vh,116px); }
  .advanced-hole-circle strong { font-size: clamp(34px,12vh,62px); }
  .advanced-thrower-button { min-height: 40px; font-size: clamp(10px,3.2vh,15px); }
  .score-grid.advanced-has-throwers .advanced-inning-bar { bottom: 47px; }
  .advanced-inning-bar { bottom: 7px; min-height: 42px; width: min(390px,52vw); padding-block: 4px; }
  .advanced-inning-bar .button { min-height: 34px; }
  .score-card.advanced-bag-mode .last-stable-score { display: none; }
}

/* Version 8.0.24: score-first Advanced layout and expandable Just Play performance. */
.score-card.advanced-bag-mode .score-add-zone .score-number {
  opacity: 1;
  filter: none;
  color: #fff;
  font-size: clamp(150px,27vw,380px);
  text-shadow: 0 9px 30px rgba(0,0,0,.4),0 0 4px rgba(255,255,255,.18);
}
.score-card.advanced-bag-mode .score-add-zone small { visibility: hidden; }
.score-card.advanced-bag-mode .simple-score-controls { display: none !important; }
.score-card.advanced-bag-mode .advanced-bag-pad {
  z-index: 4;
  width: 100%;
  height: 100%;
  padding: 2px;
}
.score-card.advanced-bag-mode .advanced-bag-outer {
  min-height: 0;
  border-width: 2px;
  border-color: rgba(255,255,255,.35);
  border-radius: clamp(14px,2vw,24px);
  background: rgba(3,12,22,.025);
}
.score-card.advanced-bag-mode[data-slot="1"] .advanced-hole-circle { left: 25%; }
.score-card.advanced-bag-mode[data-slot="2"] .advanced-hole-circle { left: 75%; }
.score-card.advanced-bag-mode[data-slot="1"] .advanced-on-label,
.score-card.advanced-bag-mode[data-slot="1"] .advanced-bag-outer > strong {
  right: 14px;
  left: auto;
  text-align: right;
}
.score-card.advanced-bag-mode[data-slot="2"] .advanced-on-label,
.score-card.advanced-bag-mode[data-slot="2"] .advanced-bag-outer > strong {
  right: auto;
  left: 14px;
  text-align: left;
}
.score-card.advanced-bag-mode .advanced-hole-circle {
  width: clamp(104px,12vw,168px);
  height: clamp(104px,12vw,168px);
  color: rgba(255,255,255,.78);
  background: rgba(4,13,23,.12);
}
.score-card.advanced-bag-mode .advanced-hole-circle strong { opacity: .7; }
.score-card.advanced-bag-mode .advanced-thrower-controls {
  position: relative;
  z-index: 7;
  grid-row: 3 !important;
  grid-column: 1;
  width: 100%;
  align-self: end;
  border-top: 1px solid rgba(255,255,255,.22);
}
.score-card.advanced-bag-mode .advanced-thrower-button {
  min-height: clamp(58px,9vh,90px);
  background: rgba(0,0,0,.16);
}
.score-card.advanced-bag-mode .advanced-thrower-button.selected {
  background: linear-gradient(145deg,#9af5c8,#45d996);
}

.quick-history-dialog { width: min(920px,calc(100vw - 24px)); max-height: min(88dvh,900px); }
.quick-history-overall { display: grid; gap: 10px; margin-bottom: 13px; padding: 13px; border: 1px solid rgba(82,224,158,.28); border-radius: 16px; background: linear-gradient(145deg,rgba(42,166,116,.13),rgba(31,104,155,.09)); }
.quick-history-overall[hidden] { display: none !important; }
.quick-history-section-heading > span,.quick-history-section-heading strong,.quick-history-section-heading small { display: block; }
.quick-history-section-heading strong { font-size: 14px; }
.quick-history-section-heading small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.quick-history-explainer { margin: 0 0 10px; color: #839fb3; font-size: 9px; line-height: 1.45; }
.quick-history-game { overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.025); }
.quick-history-row {
  width: 100%;
  border: 0;
  border-radius: 0;
  color: var(--text);
  background: transparent;
  font: inherit;
  text-align: left;
}
.quick-history-row > i { color: #78cfff; font-size: 20px; font-style: normal; transition: transform .16s ease; }
.quick-history-row[aria-expanded="true"] > i { transform: rotate(180deg); }
.quick-history-detail { display: grid; gap: 10px; padding: 0 12px 12px; border-top: 1px solid rgba(255,255,255,.09); }
.quick-history-detail[hidden] { display: none !important; }
.quick-history-detail > p { margin: 10px 1px 0; color: #8ea9bb; font-size: 10px; }
.quick-advanced-stats-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.quick-advanced-player { display: grid; min-width: 0; gap: 9px; padding: 11px; border: 1px solid rgba(255,255,255,.12); border-radius: 13px; background: rgba(3,13,23,.32); }
.quick-advanced-player.side-1 { border-left: 3px solid #55bfff; }
.quick-advanced-player.side-2 { border-left: 3px solid #ffc55a; }
.quick-advanced-player > div:first-child strong,.quick-advanced-player > div:first-child small { display: block; }
.quick-advanced-player > div:first-child strong { overflow: hidden; color: #fff; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.quick-advanced-player > div:first-child small { margin-top: 2px; color: #8eaabd; font-size: 8px; font-weight: 850; text-transform: uppercase; }
.quick-advanced-metrics { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 5px; }
.quick-advanced-metrics > span { display: grid; min-width: 0; gap: 2px; padding: 7px 5px; border-radius: 9px; background: rgba(91,151,191,.08); text-align: center; }
.quick-advanced-metrics b { color: #f4fbff; font-family: "Space Grotesk",sans-serif; font-size: 15px; }
.quick-advanced-metrics small { overflow: hidden; color: #7897ac; font-size: 7px; font-weight: 850; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }

@media (orientation:portrait) and (max-width:620px) {
  .score-card.advanced-bag-mode .score-number {
    font-size: clamp(100px,34vw,156px);
    letter-spacing: -.065em;
  }
  .score-card.advanced-bag-mode .advanced-bag-pad { padding: 1px; }
  .score-card.advanced-bag-mode .advanced-bag-outer { min-height: 0; border-radius: 12px; }
  .score-card.advanced-bag-mode .advanced-hole-circle {
    width: clamp(74px,23vw,94px);
    height: clamp(74px,23vw,94px);
  }
  .score-card.advanced-bag-mode[data-slot="1"] .advanced-hole-circle { left: 27%; }
  .score-card.advanced-bag-mode[data-slot="2"] .advanced-hole-circle { left: 73%; }
  .score-card.advanced-bag-mode .advanced-hole-circle strong { font-size: clamp(34px,11vw,50px); }
  .score-card.advanced-bag-mode .advanced-on-label { top: 7px; font-size: 7px; }
  .score-card.advanced-bag-mode .advanced-bag-outer > strong { top: 19px; font-size: 31px; }
  .score-card.advanced-bag-mode[data-slot="1"] .advanced-on-label,
  .score-card.advanced-bag-mode[data-slot="1"] .advanced-bag-outer > strong { right: 7px; }
  .score-card.advanced-bag-mode[data-slot="2"] .advanced-on-label,
  .score-card.advanced-bag-mode[data-slot="2"] .advanced-bag-outer > strong { left: 7px; }
  .score-card.advanced-bag-mode .throw-first-badge {
    top: 7px;
    left: 7px;
  }
  .score-card.advanced-bag-mode .advanced-thrower-button { min-height: 58px; }
  .quick-history-dialog { width: calc(100vw - 14px); max-height: calc(100dvh - 14px); padding: 15px; }
  .quick-advanced-stats-grid { grid-template-columns: 1fr; }
  .quick-history-row { gap: 9px; padding-inline: 10px; }
  .quick-history-row b { font-size: 18px; }
}

@media (orientation:landscape) and (max-height:620px) {
  .score-card.advanced-bag-mode .score-add-zone .score-number { font-size: clamp(112px,39vh,220px); }
  .score-card.advanced-bag-mode .advanced-hole-circle { width: clamp(72px,20vh,102px); height: clamp(72px,20vh,102px); }
  .score-card.advanced-bag-mode .advanced-thrower-button { min-height: 40px; }
}

/* Version 8.0.25: board-shaped Advanced scoring stack and editable latest inning. */
.score-card.advanced-bag-mode {
  --advanced-thrower-space: 0px;
  --advanced-utility-reserve: 112px;
}
.score-grid.advanced-has-throwers .score-card.advanced-bag-mode {
  --advanced-thrower-space: clamp(58px,9vh,90px);
}
.score-card.advanced-bag-mode .score-add-zone {
  z-index: 3;
  grid-row: 2;
  grid-column: 1;
  box-sizing: border-box;
  min-width: 0;
  min-height: 0;
  padding: 0 3px var(--advanced-utility-reserve);
}
.score-card.advanced-bag-mode .score-add-zone .score-number,
.score-card.advanced-bag-mode .score-number {
  color: #fff;
  font-size: clamp(110px,25vw,330px);
  opacity: 1;
  filter: none;
  text-shadow: 0 9px 30px rgba(0,0,0,.4),0 0 4px rgba(255,255,255,.18);
}
.score-card.advanced-bag-mode .advanced-bag-pad {
  z-index: 4;
  box-sizing: border-box;
  padding: 3px 3px var(--advanced-utility-reserve);
  pointer-events: none;
}
.score-card.advanced-bag-mode .advanced-bag-outer {
  min-height: 94px;
  border: 2px dashed rgba(255,255,255,.42);
  border-radius: clamp(14px,2vw,24px);
  background: rgba(3,12,22,.025);
  pointer-events: auto;
}
.score-card.advanced-bag-mode .advanced-hole-circle,
.score-card.advanced-bag-mode[data-slot="1"] .advanced-hole-circle,
.score-card.advanced-bag-mode[data-slot="2"] .advanced-hole-circle {
  z-index: 9;
  top: 22%;
  left: 50%;
  width: clamp(104px,12vw,168px);
  height: clamp(104px,12vw,168px);
  color: rgba(255,255,255,.88);
  background: rgba(4,13,23,.28);
  box-shadow: 0 0 0 7px rgba(255,255,255,.05),inset 0 0 30px rgba(255,255,255,.09),0 8px 24px rgba(0,0,0,.18);
}
.score-card.advanced-bag-mode .advanced-hole-circle strong { opacity: .9; }
.score-card.advanced-bag-mode .advanced-on-label,
.score-card.advanced-bag-mode .advanced-bag-outer > strong { z-index: 7; }
.score-card.advanced-bag-mode .advanced-bag-outer > small { z-index: 7; }

/* Last Score and the bag color sit between the board outline and inning controls. */
.score-card.advanced-bag-mode .last-stable-score {
  top: auto;
  bottom: calc(var(--advanced-thrower-space) + 70px);
  display: inline-flex;
  min-height: 34px;
  box-sizing: border-box;
}
.score-card.advanced-bag-mode .bag-color-picker {
  top: auto;
  right: 13px;
  bottom: calc(var(--advanced-thrower-space) + 68px);
  width: 38px;
  height: 38px;
}
.score-card.advanced-bag-mode .advanced-thrower-controls {
  z-index: 12;
  grid-row: 3 !important;
  grid-column: 1;
  width: 100%;
  align-self: stretch;
}

.advanced-inning-bar {
  bottom: 10px;
  width: min(600px,calc(100% - 34px));
  min-height: 56px;
}
.score-grid.advanced-has-throwers .advanced-inning-bar {
  bottom: calc(clamp(58px,9vh,90px) + 8px);
}
.advanced-inning-actions { display: flex; flex: 0 0 auto; align-items: center; gap: 6px; }
.advanced-inning-actions .button { min-height: 40px; padding-inline: 14px; }
.advanced-inning-actions .button[hidden] { display: none !important; }

.edit-inning-dialog { width: min(650px,calc(100vw - 24px)); }
.edit-inning-help { margin: -2px 0 14px; color: var(--muted); font-size: 12px; line-height: 1.45; }
.edit-inning-sides { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.edit-inning-side {
  display: grid;
  min-width: 0;
  gap: 9px;
  margin: 0;
  padding: 13px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 15px;
  background: rgba(4,15,26,.42);
}
.edit-inning-side-one { border-top: 3px solid #55bfff; }
.edit-inning-side-two { border-top: 3px solid #ffc55a; }
.edit-inning-side legend {
  max-width: 100%;
  padding: 0 5px;
  overflow: hidden;
  color: #f2f9ff;
  font-family: "Space Grotesk",sans-serif;
  font-size: 14px;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.edit-inning-side label { display: grid; grid-template-columns: minmax(0,1fr) 64px; align-items: center; gap: 8px; color: #a8bfd0; font-size: 11px; font-weight: 800; }
.edit-inning-side input { width: 100%; min-height: 44px; padding: 6px; text-align: center; }

@media (orientation:portrait) and (max-width:620px) {
  .score-card.advanced-bag-mode {
    --advanced-utility-reserve: 103px;
  }
  .score-card.advanced-bag-mode .score-add-zone .score-number,
  .score-card.advanced-bag-mode .score-number {
    font-size: clamp(82px,29vw,132px);
    letter-spacing: -.08em;
  }
  .score-card.advanced-bag-mode .advanced-bag-pad { padding: 2px 2px var(--advanced-utility-reserve); }
  .score-card.advanced-bag-mode .advanced-bag-outer { min-height: 82px; border-radius: 12px; }
  .score-card.advanced-bag-mode .advanced-hole-circle,
  .score-card.advanced-bag-mode[data-slot="1"] .advanced-hole-circle,
  .score-card.advanced-bag-mode[data-slot="2"] .advanced-hole-circle {
    top: 21%;
    left: 50%;
    width: clamp(72px,22vw,92px);
    height: clamp(72px,22vw,92px);
  }
  .score-card.advanced-bag-mode .advanced-on-label { top: 7px; font-size: 7px; }
  .score-card.advanced-bag-mode .advanced-bag-outer > strong { top: 19px; font-size: 30px; }
  .score-card.advanced-bag-mode .advanced-bag-outer > small { right: 7px; bottom: 6px; font-size: 7px; }
  .score-card.advanced-bag-mode .last-stable-score {
    left: 6px;
    bottom: calc(var(--advanced-thrower-space) + 61px);
    min-height: 31px;
    padding: 5px 7px;
    font-size: 8px;
  }
  .score-card.advanced-bag-mode .last-stable-score strong { font-size: 12px; }
  .score-card.advanced-bag-mode .bag-color-picker {
    right: 6px;
    bottom: calc(var(--advanced-thrower-space) + 59px);
    width: 34px;
    height: 34px;
  }
  .advanced-inning-bar { width: min(430px,calc(100% - 14px)); min-height: 51px; padding: 5px 5px 5px 9px; }
  .advanced-inning-bar > span { max-width: min(31vw,155px); }
  .advanced-inning-bar strong { max-width: none; font-size: 8px; }
  .advanced-inning-actions { gap: 4px; }
  .advanced-inning-actions .button { min-height: 39px; padding-inline: 8px; font-size: 9px; }
  .edit-inning-dialog { width: calc(100vw - 14px); max-height: calc(100dvh - 14px); padding: 15px; }
  .edit-inning-sides { grid-template-columns: 1fr; gap: 8px; }
  .edit-inning-side { padding: 10px; }
}

@media (orientation:landscape) and (max-height:620px) {
  .score-card.advanced-bag-mode {
    --advanced-utility-reserve: 80px;
  }
  .score-grid.advanced-has-throwers .score-card.advanced-bag-mode { --advanced-thrower-space: 40px; }
  .score-card.advanced-bag-mode .score-add-zone .score-number,
  .score-card.advanced-bag-mode .score-number { font-size: clamp(100px,42vh,230px); }
  .score-card.advanced-bag-mode .advanced-bag-pad { padding: 2px 2px var(--advanced-utility-reserve); }
  .score-card.advanced-bag-mode .advanced-bag-outer { min-height: 70px; }
  .score-card.advanced-bag-mode .advanced-hole-circle,
  .score-card.advanced-bag-mode[data-slot="1"] .advanced-hole-circle,
  .score-card.advanced-bag-mode[data-slot="2"] .advanced-hole-circle {
    top: 20%;
    left: 50%;
    width: clamp(62px,17vh,86px);
    height: clamp(62px,17vh,86px);
  }
  .score-card.advanced-bag-mode .advanced-hole-circle strong { font-size: clamp(30px,9vh,48px); }
  .score-card.advanced-bag-mode .last-stable-score {
    bottom: calc(var(--advanced-thrower-space) + 48px);
    display: inline-flex;
    min-height: 28px;
    padding: 4px 7px;
    font-size: 8px;
  }
  .score-card.advanced-bag-mode .bag-color-picker {
    bottom: calc(var(--advanced-thrower-space) + 46px);
    width: 32px;
    height: 32px;
  }
  .score-grid.advanced-has-throwers .advanced-inning-bar { bottom: 45px; }
  .advanced-inning-bar { bottom: 5px; width: min(540px,64vw); min-height: 39px; padding: 3px 4px 3px 9px; }
  .advanced-inning-bar .button,.advanced-inning-actions .button { min-height: 32px; padding-inline: 8px; font-size: 9px; }
}

/* Version 8.0.26: keep the score/board in row two and throwers alone at the bottom. */
.score-card.advanced-bag-mode {
  grid-template-rows: auto minmax(0,1fr) auto;
}
.score-card.advanced-bag-mode .score-team { grid-row: 1; grid-column: 1; }
.score-card.advanced-bag-mode .score-add-zone,
.score-card.advanced-bag-mode .advanced-bag-pad { grid-row: 2; grid-column: 1; }
.score-card.advanced-bag-mode .advanced-thrower-controls { grid-row: 3 !important; grid-column: 1; }

/* Version 8.0.27: keep the scoreboard clean and enter Advanced bags in a focused two-board panel. */
.score-card.advanced-bag-mode .advanced-bag-pad { display: none !important; }
.score-card.advanced-bag-mode .score-add-zone {
  pointer-events: auto;
  cursor: pointer;
  touch-action: manipulation;
}
.score-card.advanced-bag-mode .score-add-zone small {
  visibility: visible;
  opacity: .78;
}

.advanced-entry-dialog {
  width: calc(100vw - 18px);
  max-width: none;
  height: calc(100dvh - 18px);
  max-height: none;
  margin: auto;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(139,205,247,.3);
  border-radius: 24px;
  color: var(--text);
  background: radial-gradient(circle at 50% -10%,rgba(51,168,235,.16),transparent 40%),linear-gradient(155deg,#061522,#020a11 72%);
  box-shadow: 0 28px 90px rgba(0,0,0,.72),inset 0 1px 0 rgba(255,255,255,.08);
}
.advanced-entry-dialog::backdrop {
  background: rgba(1,6,11,.82);
  backdrop-filter: blur(8px);
}
.advanced-entry-shell {
  box-sizing: border-box;
  display: grid;
  grid-template-rows: auto minmax(0,1fr) auto;
  width: 100%;
  height: 100%;
  gap: 12px;
  padding: 15px;
}
.advanced-entry-header,
.advanced-entry-footer {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}
.advanced-entry-header h2 { margin: 3px 0 0; font-family: "Space Grotesk",sans-serif; font-size: clamp(21px,2.5vw,34px); line-height: 1; }
.advanced-entry-header .icon-button { flex: 0 0 auto; width: 44px; height: 44px; font-size: 25px; }
.advanced-entry-boards {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  min-width: 0;
  min-height: 0;
  gap: 12px;
}
.advanced-entry-boards.swapped > [data-slot="1"] { order: 2; }
.advanced-entry-boards.swapped > [data-slot="2"] { order: 1; }
.advanced-entry-board {
  position: relative;
  display: grid;
  grid-template-rows: auto minmax(0,1fr) auto;
  min-width: 0;
  min-height: 0;
  gap: 9px;
  padding: 12px;
  overflow: hidden;
  border: 1px solid rgba(164,216,247,.28);
  border: 1px solid color-mix(in srgb,var(--bag-light) 56%,rgba(255,255,255,.18));
  border-radius: 20px;
  background: linear-gradient(155deg,rgba(14,55,83,.96),#030b12 78%);
  background: radial-gradient(circle at 50% 20%,color-mix(in srgb,var(--bag-color) 28%,transparent),transparent 55%),linear-gradient(155deg,color-mix(in srgb,var(--bag-dark) 68%,#071521),#030b12 78%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08),0 12px 35px rgba(0,0,0,.22);
}
.advanced-entry-team { min-width: 0; text-align: center; }
.advanced-entry-team strong,
.advanced-entry-team small { display: block; }
.advanced-entry-team strong { overflow: hidden; color: #fff; font-family: "Space Grotesk",sans-serif; font-size: clamp(18px,2.3vw,32px); line-height: 1.08; text-overflow: ellipsis; white-space: nowrap; }
.advanced-entry-team small { margin-top: 3px; color: rgba(228,242,252,.7); font-size: clamp(8px,.85vw,11px); }
.advanced-entry-target {
  position: relative;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  border: 3px dashed rgba(255,255,255,.48);
  border-radius: clamp(17px,2.4vw,30px);
  outline: 0;
  background: linear-gradient(180deg,rgba(255,255,255,.025),rgba(1,7,12,.12));
  cursor: pointer;
  user-select: none;
  touch-action: manipulation;
}
.advanced-entry-target:active { background: rgba(255,255,255,.08); }
.advanced-entry-target:focus-visible { box-shadow: inset 0 0 0 4px rgba(255,255,255,.55); }
.advanced-entry-on-label { position: absolute; top: 14px; left: 15px; color: rgba(236,247,255,.82); font-size: clamp(9px,1vw,13px); font-weight: 950; letter-spacing: .13em; }
.advanced-entry-target > strong { position: absolute; top: 31px; left: 15px; color: #fff; font-family: "Space Grotesk",sans-serif; font-size: clamp(52px,7vw,106px); line-height: 1; text-shadow: 0 6px 22px rgba(0,0,0,.42); }
.advanced-entry-target > small { position: absolute; right: 14px; bottom: 12px; color: rgba(234,247,255,.82); font-size: clamp(9px,1vw,13px); font-weight: 850; }
.advanced-entry-hole {
  position: absolute;
  z-index: 4;
  top: 44%;
  left: 50%;
  display: grid;
  width: clamp(112px,15vw,205px);
  aspect-ratio: 1;
  place-items: center;
  align-content: center;
  padding: 0;
  border: clamp(4px,.45vw,7px) solid rgba(255,255,255,.76);
  border-radius: 50%;
  color: #fff;
  background: rgba(1,8,14,.44);
  box-shadow: 0 0 0 9px rgba(255,255,255,.05),inset 0 0 38px rgba(81,177,235,.16),0 10px 30px rgba(0,0,0,.3);
  box-shadow: 0 0 0 9px rgba(255,255,255,.05),inset 0 0 38px color-mix(in srgb,var(--bag-color) 25%,transparent),0 10px 30px rgba(0,0,0,.3);
  transform: translate(-50%,-50%);
  cursor: pointer;
  touch-action: manipulation;
}
.advanced-entry-hole:active { background: color-mix(in srgb,var(--bag-color) 34%,rgba(1,8,14,.7)); transform: translate(-50%,-50%) scale(.96); }
.advanced-entry-hole span { font-size: clamp(9px,1vw,13px); font-weight: 950; letter-spacing: .12em; }
.advanced-entry-hole strong { font-family: "Space Grotesk",sans-serif; font-size: clamp(54px,7.8vw,118px); line-height: .82; }
.advanced-modal-throwers {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 7px;
}
.advanced-modal-throwers[hidden] { display: none !important; }
.advanced-modal-thrower {
  min-width: 0;
  min-height: 48px;
  padding: 7px 9px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 12px;
  color: rgba(239,248,255,.8);
  background: rgba(1,9,15,.42);
  font-family: "Space Grotesk",sans-serif;
  font-size: clamp(11px,1.4vw,18px);
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}
.advanced-modal-thrower.selected { border-color: rgba(123,244,187,.7); color: #04150d; background: linear-gradient(145deg,#9af5c8,#45d996); box-shadow: inset 0 0 0 2px rgba(255,255,255,.28); }
.advanced-entry-footer { min-height: 52px; padding: 0 2px; }
.advanced-entry-footer > span { display: grid; min-width: 0; gap: 2px; }
.advanced-entry-footer > span small { color: #79a4c0; font-size: 9px; font-weight: 950; letter-spacing: .14em; }
.advanced-entry-footer > span strong { overflow: hidden; color: #f3faff; font-size: clamp(11px,1.3vw,15px); text-overflow: ellipsis; white-space: nowrap; }
.advanced-entry-actions { display: flex; flex: 0 0 auto; align-items: center; gap: 8px; }
.advanced-entry-actions .button { min-height: 46px; padding-inline: 19px; }
.advanced-entry-actions .button[hidden] { display: none !important; }

@media (max-width:620px) {
  .advanced-entry-dialog { width: calc(100vw - 8px); height: calc(100dvh - 8px); border-radius: 18px; }
  .advanced-entry-shell { gap: 7px; padding: 9px; }
  .advanced-entry-header .eyebrow { font-size: 7px; }
  .advanced-entry-header h2 { font-size: 19px; }
  .advanced-entry-header .icon-button { width: 38px; height: 38px; }
  .advanced-entry-boards { gap: 7px; }
  .advanced-entry-board { gap: 6px; padding: 7px; border-radius: 14px; }
  .advanced-entry-team strong { font-size: clamp(13px,4.4vw,19px); white-space: normal; }
  .advanced-entry-team small { display: none; }
  .advanced-entry-target { border-width: 2px; border-radius: 13px; }
  .advanced-entry-on-label { top: 8px; left: 8px; font-size: 7px; }
  .advanced-entry-target > strong { top: 20px; left: 8px; font-size: clamp(38px,12vw,56px); }
  .advanced-entry-target > small { right: 7px; bottom: 7px; max-width: calc(100% - 14px); font-size: 7px; text-align: right; }
  .advanced-entry-hole { top: 47%; width: clamp(76px,27vw,112px); border-width: 3px; box-shadow: 0 0 0 5px rgba(255,255,255,.05),inset 0 0 24px color-mix(in srgb,var(--bag-color) 25%,transparent); }
  .advanced-entry-hole span { font-size: 7px; }
  .advanced-entry-hole strong { font-size: clamp(39px,13vw,58px); }
  .advanced-modal-throwers { gap: 4px; }
  .advanced-modal-thrower { min-height: 42px; padding: 5px 3px; border-radius: 9px; font-size: clamp(9px,3vw,12px); white-space: normal; }
  .advanced-entry-footer { min-height: 48px; gap: 7px; }
  .advanced-entry-footer > span { max-width: 30vw; }
  .advanced-entry-footer > span strong { font-size: 8px; white-space: normal; }
  .advanced-entry-actions { gap: 4px; }
  .advanced-entry-actions .button { min-height: 42px; padding-inline: 9px; font-size: 9px; }
}

@media (orientation:landscape) and (max-height:620px) {
  .advanced-entry-dialog { width: calc(100vw - 8px); height: calc(100dvh - 8px); border-radius: 16px; }
  .advanced-entry-shell { gap: 6px; padding: 7px 9px; }
  .advanced-entry-header h2 { margin-top: 1px; font-size: clamp(17px,4vh,23px); }
  .advanced-entry-header .eyebrow { font-size: 7px; }
  .advanced-entry-header .icon-button { width: 35px; height: 35px; }
  .advanced-entry-boards { gap: 8px; }
  .advanced-entry-board { grid-template-rows: auto minmax(0,1fr) auto; gap: 4px; padding: 6px 8px; border-radius: 13px; }
  .advanced-entry-team strong { font-size: clamp(13px,3.8vh,20px); }
  .advanced-entry-team small { display: none; }
  .advanced-entry-target { border-width: 2px; border-radius: 12px; }
  .advanced-entry-on-label { top: 6px; left: 8px; font-size: 7px; }
  .advanced-entry-target > strong { top: 17px; left: 8px; font-size: clamp(34px,12vh,58px); }
  .advanced-entry-target > small { right: 7px; bottom: 5px; font-size: 7px; }
  .advanced-entry-hole { top: 48%; width: clamp(72px,24vh,112px); border-width: 3px; box-shadow: 0 0 0 5px rgba(255,255,255,.05),inset 0 0 23px color-mix(in srgb,var(--bag-color) 25%,transparent); }
  .advanced-entry-hole span { font-size: 7px; }
  .advanced-entry-hole strong { font-size: clamp(35px,12vh,58px); }
  .advanced-modal-thrower { min-height: 32px; padding: 3px 5px; font-size: clamp(8px,2.8vh,12px); }
  .advanced-entry-footer { min-height: 38px; }
  .advanced-entry-footer > span small { font-size: 7px; }
  .advanced-entry-footer > span strong { font-size: 8px; }
  .advanced-entry-actions .button { min-height: 34px; padding-inline: 9px; font-size: 8px; }
}

@media (orientation:portrait) and (max-width:760px) {
  .scoreboard-shell .scoreboard-header {
    min-height: 50px;
    padding: 5px 7px;
  }
  .scoreboard-shell .game-state-banner { display: none !important; }
  .scoreboard-shell .scoreboard-event {
    display: grid !important;
    min-width: 0;
    place-items: center;
    padding: 0 4px;
  }
  .scoreboard-shell .scoreboard-event > .eyebrow,
  .scoreboard-shell .scoreboard-event > h1,
  .scoreboard-shell .scoreboard-event > p { display: none !important; }
  .scoreboard-shell .portrait-scoreboard-title {
    display: block;
    max-width: 100%;
    overflow: hidden;
    color: #edf8ff;
    font-family: "Space Grotesk",sans-serif;
    font-size: clamp(13px,3.8vw,18px);
    line-height: 1.05;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  /* A hidden status banner no longer participates in auto-placement. Flex keeps the
     score grid on the expanding row instead of giving that space to the footer. */
  .scoreboard-shell .scoreboard-main,
  .quick-play-shell .scoreboard-main {
    display: flex !important;
    flex-direction: column;
  }
  .scoreboard-shell .score-grid {
    flex: 1 1 auto;
    width: 100%;
    height: auto !important;
    min-height: 0;
  }
  .scoreboard-shell .quick-record,
  .scoreboard-shell .scoreboard-footer { flex: 0 0 auto; }
}

/* Version 8.0.29: inline Advanced entry, clear Bag Stats state, and sortable history. */
.score-card.advanced-bag-mode .advanced-bag-pad[hidden] { display: none !important; }
.score-card.advanced-bag-mode.advanced-entry-open .advanced-bag-pad {
  z-index: 18;
  display: block !important;
  padding: 5px 5px var(--advanced-utility-reserve);
  pointer-events: none;
}
.score-card.advanced-bag-mode.advanced-entry-open .score-add-zone {
  visibility: hidden;
  pointer-events: none;
}
.score-card.advanced-bag-mode.advanced-entry-open .advanced-bag-outer {
  width: 100%;
  height: 100%;
  min-height: 92px;
  box-sizing: border-box;
  border: 3px dashed rgba(255,255,255,.62);
  background: linear-gradient(180deg,color-mix(in srgb,var(--bag-dark) 76%,#06121d),color-mix(in srgb,var(--bag-dark) 88%,#02070c));
  box-shadow: inset 0 0 45px rgba(255,255,255,.055),0 10px 28px rgba(0,0,0,.2);
  pointer-events: auto;
}
.score-card.advanced-bag-mode.advanced-entry-open .advanced-hole-circle {
  border-color: rgba(255,255,255,.88);
  background: color-mix(in srgb,var(--bag-dark) 76%,#01060a);
}
.advanced-inning-actions #endInningBtn {
  min-width: 150px;
  min-height: 54px;
  padding-inline: 25px;
  font-size: 14px;
}

.portrait-scoreboard-rules {
  display: block;
  margin-bottom: 2px;
  color: #8fb0c5;
  font-size: 9px;
  font-weight: 800;
  line-height: 1.1;
}

.bag-stats-player-badge {
  position: absolute;
  z-index: 34;
  top: 88px;
  right: 11px;
  max-width: calc(100% - 22px);
  padding: 6px 9px;
  overflow: hidden;
  border: 1px solid rgba(105,240,174,.6);
  border-radius: 999px;
  color: #dffff0;
  background: rgba(2,38,31,.78);
  box-shadow: 0 7px 20px rgba(0,0,0,.22),inset 0 1px rgba(255,255,255,.12);
  font-size: 9px;
  font-weight: 900;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
  pointer-events: none;
  backdrop-filter: blur(9px);
}
.bag-stats-player-badge[hidden] { display: none !important; }

.quick-history-rank-controls {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding: 1px 0 3px;
  scrollbar-width: thin;
}
.quick-history-rank-controls button {
  flex: 0 0 auto;
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid rgba(132,181,214,.2);
  border-radius: 999px;
  color: #a9c0d1;
  background: rgba(5,20,33,.58);
  font: 850 9px/1.1 inherit;
  cursor: pointer;
}
.quick-history-rank-controls button.selected {
  border-color: rgba(99,234,168,.62);
  color: #061a11;
  background: linear-gradient(145deg,#9af5c8,#45d996);
}
.quick-advanced-player-heading {
  display: grid;
  grid-template-columns: auto minmax(0,1fr);
  align-items: center;
  column-gap: 8px;
}
.quick-advanced-player-heading > strong,
.quick-advanced-player-heading > small { grid-column: 2; }
.quick-advanced-player-heading:not(.is-ranked) > strong,
.quick-advanced-player-heading:not(.is-ranked) > small { grid-column: 1 / -1; }
.quick-advanced-rank {
  grid-column: 1;
  grid-row: 1 / span 2;
  color: #81edb6;
  font: 950 18px/1 "Space Grotesk",sans-serif;
}

@media (orientation:portrait) and (max-width:760px) {
  .scoreboard-shell .portrait-scoreboard-title {
    order: 1;
    max-width: 100%;
    overflow: visible;
    font-size: clamp(9px,2.8vw,14px);
    line-height: 1;
    text-overflow: clip;
    white-space: nowrap;
  }
  .scoreboard-shell .portrait-scoreboard-rules {
    order: 2;
    display: block;
    max-width: 100%;
    margin-top: 2px;
    overflow: hidden;
    color: #8fb0c5;
    font-size: clamp(7px,2vw,9px);
    font-weight: 800;
    line-height: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .score-card.advanced-bag-mode.advanced-entry-open .advanced-bag-pad { padding: 4px 4px var(--advanced-utility-reserve); }
  .score-card.advanced-bag-mode.advanced-entry-open .advanced-bag-outer { min-height: 80px; border-width: 2px; }
  .advanced-inning-actions #endInningBtn { min-width: 116px; min-height: 49px; padding-inline: 13px; font-size: 12px; }
  .bag-stats-player-badge { top: 104px; right: 7px; max-width: calc(100% - 14px); padding: 5px 7px; font-size: 7px; }
}

@media (orientation:landscape) and (max-height:620px) {
  .score-card.advanced-bag-mode.advanced-entry-open .advanced-bag-pad { padding: 3px 3px var(--advanced-utility-reserve); }
  .score-card.advanced-bag-mode.advanced-entry-open .advanced-bag-outer { min-height: 68px; border-width: 2px; }
  .advanced-inning-actions #endInningBtn { min-width: 124px; min-height: 43px; padding-inline: 15px; font-size: 11px; }
  .bag-stats-player-badge { top: 64px; right: 7px; max-width: calc(100% - 14px); padding: 5px 7px; font-size: 8px; }
}

/* Version 8.0.30: cancellable inline entry with clear utility spacing. */
.score-card.advanced-bag-mode {
  --advanced-utility-reserve: 136px;
}
.score-card.advanced-bag-mode.advanced-entry-open .score-add-zone {
  visibility: visible;
  pointer-events: none;
}
.score-card.advanced-bag-mode.advanced-entry-open .score-add-zone .score-number {
  visibility: visible;
  opacity: .17;
  filter: saturate(.7);
}
.score-card.advanced-bag-mode.advanced-entry-open .advanced-bag-outer {
  background: linear-gradient(180deg,color-mix(in srgb,var(--bag-dark) 72%,transparent),rgba(2,7,12,.68));
}
.score-card.advanced-bag-mode .last-stable-score {
  bottom: calc(var(--advanced-thrower-space) + 90px);
}
.score-card.advanced-bag-mode .bag-color-picker {
  bottom: calc(var(--advanced-thrower-space) + 88px);
}
.advanced-inning-actions #cancelBagEntryBtn {
  min-height: 46px;
  padding-inline: 15px;
}

@media (orientation:portrait) and (max-width:760px) {
  .score-card.advanced-bag-mode { --advanced-utility-reserve: 124px; }
  .score-card.advanced-bag-mode .last-stable-score { bottom: calc(var(--advanced-thrower-space) + 82px); }
  .score-card.advanced-bag-mode .bag-color-picker { bottom: calc(var(--advanced-thrower-space) + 80px); }
  .advanced-inning-actions #cancelBagEntryBtn { min-height: 43px; padding-inline: 10px; font-size: 10px; }
}

@media (orientation:landscape) and (max-height:620px) {
  .score-card.advanced-bag-mode { --advanced-utility-reserve: 102px; }
  .score-card.advanced-bag-mode .last-stable-score { bottom: calc(var(--advanced-thrower-space) + 68px); }
  .score-card.advanced-bag-mode .bag-color-picker { bottom: calc(var(--advanced-thrower-space) + 66px); }
  .advanced-inning-actions #cancelBagEntryBtn { min-height: 37px; padding-inline: 10px; font-size: 9px; }
}

/* Version 8.0.31: visual-side scoreboard utilities and account-assisted room setup. */
.quick-player-entry {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: end;
  gap: 8px;
  min-width: 0;
}
.quick-player-entry[hidden] { display: none !important; }
.quick-player-entry .field { min-width: 0; }
.quick-add-me {
  display: inline-flex;
  min-height: 43px;
  align-items: center;
  gap: 7px;
  padding: 5px 10px 5px 6px;
  border: 1px solid rgba(91,197,255,.4);
  border-radius: 12px;
  color: #dff6ff;
  background: rgba(9,49,74,.74);
  font: 850 10px/1.1 inherit;
  cursor: pointer;
}
.quick-add-me[hidden] { display: none !important; }
.quick-add-me.selected { border-color: rgba(103,240,173,.72); color: #071a11; background: linear-gradient(145deg,#a8f8d2,#51df9d); }
.quick-add-me > span {
  display: grid;
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  place-items: center;
  overflow: hidden;
  border-radius: 50%;
  color: #082238;
  background: #c9efff;
  font-size: 8px;
  font-weight: 950;
}
.quick-add-me img { width: 100%; height: 100%; object-fit: cover; }
/* Version 8.0.32: account defaults and compact per-member Just Play pictures. */
.field small.is-error { color: #ff9a9a; }
.compact-help { margin: 0 0 14px; }
.quick-create-photo { align-self: end; min-height: 40px; padding-inline: 12px; }
#quickMatchDialog .quick-team-members .quick-player-entry { grid-template-columns: minmax(0,1fr) auto auto; }
.quick-member-profile { display: grid; grid-template-columns: 48px minmax(0,1fr); align-items: center; gap: 9px; padding: 10px; border: 1px solid rgba(142,183,215,.16); border-radius: 14px; background: rgba(73,119,156,.08); }
.quick-member-photo { width: 48px; height: 48px; border-radius: 50%; overflow: hidden; display: grid; place-items: center; background: rgba(41,151,220,.18); font-weight: 900; }
.quick-member-photo img { width: 100%; height: 100%; object-fit: cover; }
/* Version 8.0.33: claimed-position-safe team editing and portrait-first photo controls. */
.quick-member-photo-picker { position: relative; display: block; width: 48px; height: 48px; border-radius: 50%; cursor: pointer; }
.quick-member-photo-picker::after { content: "+"; position: absolute; right: -2px; bottom: -2px; display: grid; width: 18px; height: 18px; place-items: center; border: 2px solid #07111f; border-radius: 50%; color: #06111d; background: #79d6ff; font-size: 13px; font-weight: 950; line-height: 1; }
.quick-member-photo-picker:hover .quick-member-photo,
.quick-member-photo-picker:focus-within .quick-member-photo { box-shadow: 0 0 0 3px rgba(91,197,255,.35); }
.quick-member-profile .field { margin: 0; }
.quick-member-profile-actions { grid-column: 1/-1; display: flex; flex-wrap: wrap; gap: 7px; }
.quick-member-profile-actions .button { min-height: 36px; padding: 7px 10px; font-size: .72rem; }
.quick-member-profile-actions .button[hidden], .quick-edit-add-me[hidden] { display: none !important; }
.quick-edit-add-me { width: 100%; min-height: 42px; margin: 4px 0 14px; white-space: normal; }
.friend-search-row > div { display: grid; gap: 2px; min-width: 0; }
.friend-search-row > div > strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.friend-search-row > div > small { color: var(--muted); font-size: .72rem; }

/* Side-dependent utilities follow the card's visual position, not its original slot. */
.score-card[data-visual-side="left"] .bag-color-picker { right: auto; left: 10px; }
.score-card[data-visual-side="right"] .bag-color-picker { right: 10px; left: auto; }
.score-card[data-visual-side="left"] .last-stable-score { right: 13px; left: auto; }
.score-card[data-visual-side="right"] .last-stable-score { right: auto; left: 13px; }

/* Simple scoring keeps the color control just above the point-control strip. */
.score-card:not(.advanced-bag-mode) .bag-color-picker {
  top: auto;
  bottom: calc(clamp(58px,9vh,90px) + 13px);
}

/* In Advanced mode the outer color button shares the lower utility row on wide
   screens, while Last Score stays on the protected inner row above it. */
.score-card.advanced-bag-mode .bag-color-picker {
  bottom: calc(var(--advanced-thrower-space) + 16px);
}
.score-card.advanced-bag-mode[data-visual-side="left"] .advanced-on-label,
.score-card.advanced-bag-mode[data-visual-side="left"] .advanced-bag-outer > strong {
  right: 14px;
  left: auto;
  text-align: right;
}
.score-card.advanced-bag-mode[data-visual-side="right"] .advanced-on-label,
.score-card.advanced-bag-mode[data-visual-side="right"] .advanced-bag-outer > strong {
  right: auto;
  left: 14px;
  text-align: left;
}

/* Bag Stats is part of the identity header so it cannot float over scoring UI. */
.score-team-copy .bag-stats-player-badge {
  position: static;
  display: inline-flex;
  width: auto;
  max-width: 100%;
  margin: 4px auto 0;
  padding: 4px 7px;
  vertical-align: top;
}

@media (orientation:portrait) and (max-width:760px) {
  .score-card[data-visual-side="left"] .bag-color-picker { right: auto; left: 6px; }
  .score-card[data-visual-side="right"] .bag-color-picker { right: 6px; left: auto; }
  .score-card[data-visual-side="left"] .last-stable-score { right: 6px; left: auto; }
  .score-card[data-visual-side="right"] .last-stable-score { right: auto; left: 6px; }
  .score-card.advanced-bag-mode .bag-color-picker {
    bottom: calc(var(--advanced-thrower-space) + 80px);
  }
  .score-team-copy .bag-stats-player-badge { margin-top: 2px; padding: 3px 5px; font-size: 6px; }
}

@media (orientation:landscape) and (max-height:620px) {
  .score-card[data-visual-side="left"] .bag-color-picker { right: auto; left: 8px; }
  .score-card[data-visual-side="right"] .bag-color-picker { right: 8px; left: auto; }
  .score-card[data-visual-side="left"] .last-stable-score { right: 9px; left: auto; }
  .score-card[data-visual-side="right"] .last-stable-score { right: auto; left: 9px; }
  .score-card.advanced-bag-mode .bag-color-picker {
    bottom: calc(var(--advanced-thrower-space) + 8px);
  }
  .score-grid > .score-grid-swap,
  .score-grid.coin-visible > .score-grid-swap { top: calc(50% - 70px); }
  .score-team-copy .bag-stats-player-badge { margin-top: 2px; padding: 3px 5px; font-size: 6px; }
}

@media (max-width:520px) {
  .quick-player-entry { grid-template-columns: 1fr; }
  #quickMatchDialog .quick-team-members .quick-player-entry { grid-template-columns: 1fr auto; }
  #quickMatchDialog .quick-team-members .quick-player-entry .field { grid-column: 1/-1; }
  .quick-add-me { justify-self: start; min-height: 38px; }
}

/* v8.1.1: durable per-game performance details in My Stats. */
.stats-game-row.has-performance {
  grid-template-columns: 95px minmax(120px,.6fr) minmax(180px,1fr) auto;
  cursor: pointer;
  outline: none;
  transition: transform .16s ease, border-color .16s ease, background .16s ease;
}
.stats-game-row.has-performance:hover,
.stats-game-row.has-performance:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(103,207,255,.48);
  background: rgba(105,146,180,.16);
  box-shadow: 0 0 0 3px rgba(70,174,239,.1);
}
.stats-game-open {
  color: #78cfff;
  font-size: .72rem;
  font-weight: 900;
  white-space: nowrap;
}
.stats-game-dialog {
  width: min(850px,calc(100% - 28px));
  max-height: min(88dvh,820px);
  overflow: auto;
}
.stats-game-dialog-meta,
.stats-game-performance-summary {
  margin: -8px 0 16px;
  color: #8faec6;
  font-size: .82rem;
  line-height: 1.55;
}
.stats-game-performance { display: grid; gap: 12px; }
.stats-game-performance-summary { margin: 0; }
.stats-game-performance .quick-advanced-player.is-viewer {
  border-color: rgba(91,230,165,.7);
  box-shadow: 0 0 0 2px rgba(75,218,154,.13);
}
.stats-game-you-badge {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  justify-self: end;
  padding: 4px 7px;
  border-radius: 999px;
  color: #07151f;
  background: #75e4b1;
  font-size: 8px;
  font-weight: 950;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.stats-game-performance .quick-advanced-player-heading.has-viewer-badge {
  grid-template-columns: minmax(0,1fr) auto;
}
.stats-game-performance .quick-advanced-player-heading.has-viewer-badge > strong,
.stats-game-performance .quick-advanced-player-heading.has-viewer-badge > small {
  grid-column: 1;
}
.stats-game-performance-empty {
  margin: 0;
  padding: 18px;
  border: 1px dashed rgba(143,174,198,.28);
  border-radius: 14px;
  color: #8faec6;
  text-align: center;
}
@media(max-width:600px) {
  .stats-game-row.has-performance { grid-template-columns: 75px 1fr auto; }
  .stats-game-row.has-performance em { grid-column: 1 / -1; }
  .stats-game-open { grid-column: 3; grid-row: 1; }
  .stats-game-dialog { width: calc(100% - 14px); padding: 18px; }
}

/* Version 8.2.0: clean desktop forms, complete game search, scoped comparisons, and safer admin cleanup. */
@media (min-width: 861px) {
  #quickMatchDialog.dialog-small {
    width: min(940px, calc(100vw - 56px));
    max-height: min(900px, calc(100vh - 42px));
  }
  #quickMatchDialog .one-column-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 18px;
  }
  #quickMatchDialog .one-column-grid > .check-field:first-child,
  #quickMatchDialog .quick-team-members,
  #quickMatchDialog [data-quick-simple-entry] {
    grid-column: 1 / -1;
  }
  #quickMatchDialog .quick-team-members {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    padding: 14px;
    border: 1px solid rgba(121, 181, 219, .18);
    border-radius: 18px;
    background: rgba(62, 110, 147, .08);
  }
  #quickMatchDialog .quick-team-members .quick-player-entry {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: 9px;
    min-width: 0;
    padding: 13px;
    border: 1px solid rgba(133, 185, 218, .16);
    border-radius: 15px;
    background: rgba(5, 22, 37, .5);
  }
  #quickMatchDialog .quick-team-members .quick-player-entry .field {
    grid-column: 1 / -1;
  }
  #quickMatchDialog .quick-team-members .quick-create-photo,
  #quickMatchDialog .quick-team-members .quick-add-me {
    width: 100%;
    min-width: 0;
    min-height: 44px;
    justify-content: center;
  }
  #quickMatchDialog [data-quick-simple-entry] {
    grid-template-columns: minmax(0, 1fr) minmax(170px, auto);
    padding: 12px 14px;
    border: 1px solid rgba(133, 185, 218, .13);
    border-radius: 15px;
    background: rgba(65, 111, 146, .06);
  }
}

.admin-page,
.admin-game-page {
  width: min(1520px, calc(100% - 32px));
}
.admin-workspace,
.admin-game-workspace {
  min-width: 0;
}
.admin-page .account-card,
.admin-game-page .account-card {
  min-width: 0;
}
.admin-config-grid {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  align-items: start;
}
.admin-form-section {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.admin-brand-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}
.admin-user-row {
  grid-template-columns: minmax(220px, .8fr) minmax(360px, 1.4fr) minmax(180px, auto);
}
.admin-resource-card,
.admin-result-card {
  padding: 18px;
  gap: 14px;
}
.admin-resource-actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  align-items: stretch;
  gap: 8px;
}
.admin-resource-actions .button {
  min-width: 0;
  justify-content: center;
  white-space: normal;
  line-height: 1.25;
}
.admin-resource-actions .admin-permanent-delete {
  border-color: rgba(255, 111, 111, .55);
  background: rgba(151, 48, 48, .3);
}
.admin-resource-member {
  display: grid;
  grid-template-columns: minmax(230px, 1fr) minmax(320px, auto);
  align-items: center;
}
.admin-resource-member-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(190px, 1fr));
}
.admin-inline-toggle {
  justify-content: flex-start;
  white-space: normal;
  line-height: 1.25;
}
.admin-result-participants {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}
.admin-result-participant {
  min-width: 0;
  justify-content: space-between;
}

.stats-game-log-card {
  min-width: 0;
}
.stats-game-search {
  display: grid;
  grid-template-columns: minmax(260px, 1.7fr) repeat(2, minmax(145px, .6fr)) auto;
  align-items: end;
  gap: 10px;
  margin: 16px 0;
  padding: 13px;
  border: 1px solid rgba(126, 181, 217, .14);
  border-radius: 15px;
  background: rgba(67, 112, 146, .07);
}
.stats-game-load-more {
  width: 100%;
  margin-top: 12px;
}
.stats-game-rank-controls,
.friend-comparison-scopes {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}
.stats-game-rank-controls {
  margin: 8px 0 15px;
}
.quick-history-rank-button,
.friend-comparison-scopes button {
  border: 1px solid rgba(122, 177, 213, .18);
  border-radius: 999px;
  padding: 8px 12px;
  color: #9db8ca;
  background: rgba(94, 142, 177, .1);
  cursor: pointer;
  font: inherit;
  font-size: .68rem;
  font-weight: 900;
}
.quick-history-rank-button.is-active,
.friend-comparison-scopes button.active {
  color: #04131e;
  border-color: transparent;
  background: linear-gradient(145deg, #6bd9ff, #54dfa4);
}
.stats-game-rank-badge {
  margin-left: auto;
  padding: 4px 7px;
  border-radius: 999px;
  color: #ffd879;
  background: rgba(229, 169, 50, .13);
  font-size: .58rem;
  font-weight: 950;
  white-space: nowrap;
}
.friend-comparison-scopes {
  margin: 16px 0 4px;
}
.friend-comparison-game-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.friend-comparison-game-column {
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(130, 181, 214, .13);
  border-radius: 15px;
  background: rgba(74, 118, 151, .06);
}
.friend-comparison-game-column h4 {
  margin: 0 0 9px;
}

@media (max-width: 1050px) {
  .admin-user-row {
    grid-template-columns: 1fr;
  }
  .admin-user-actions,
  .admin-user-controls {
    justify-content: flex-start;
  }
  .admin-resource-member {
    grid-template-columns: 1fr;
  }
  .admin-resource-member-controls {
    justify-content: stretch;
  }
  .stats-game-search {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .stats-game-search-query {
    grid-column: 1 / -1;
  }
}

@media (max-width: 700px) {
  .admin-page,
  .admin-game-page {
    width: min(100% - 18px, 1520px);
  }
  .admin-config-grid,
  .admin-form-section,
  .admin-brand-grid,
  .admin-resource-member-controls,
  .admin-result-participants,
  .stats-game-search,
  .friend-comparison-game-columns {
    grid-template-columns: 1fr;
  }
  .stats-game-search-query,
  .stats-game-search .button {
    grid-column: 1;
  }
  .admin-resource-actions {
    grid-template-columns: 1fr;
  }
  .admin-resource-actions .button {
    width: 100%;
  }
  .stats-game-rank-controls,
  .friend-comparison-scopes {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .stats-game-rank-controls button,
  .friend-comparison-scopes button {
    width: 100%;
  }
}