/* Ultimate Teams 4.13.0 — Sandbox identity + permanent one-time players */

:root{
  --ut-radius:24px;
  --ut-bg:#000000;
  --bg:#000000;
  --card:rgba(16,16,16,.82);
  --card2:rgba(26,26,26,.70);
  --text:#f5f5f5;
  --muted:#aaa;
  --ut-surface:rgba(22,22,22,.58);
  --ut-surface-strong:rgba(30,30,30,.76);
  --ut-surface-soft:rgba(255,255,255,.055);
  --ut-line:rgba(255,255,255,.105);
  --ut-line-bright:rgba(255,255,255,.17);
  --ut-text:#f5f5f5;
  --ut-muted:#aaa;
  --ut-blue:#75a0ff;
  --ut-blue2:#526cff;
  --ut-green:#63e69a;
  --ut-purple:#ba8cff;
  --ut-amber:#ffc36a;
  --ut-red:#ff747e;
  --ut-shadow:0 8px 24px rgba(0,0,0,.20);
  --ut-inner:inset 0 1px 0 rgba(255,255,255,.09);
  --ut-radius-xl:var(--ut-radius);
  --ut-radius-lg:var(--ut-radius);
  --ut-radius-md:var(--ut-radius);
}

html{
  min-height:100%;
  background:#000000!important;
}

body{
  min-height:100vh!important;
  margin:0!important;
  color:var(--ut-text)!important;
  background:#000000!important;
  background-attachment:fixed!important;
  overflow-x:hidden;
}

body::before{
  content:none;
  display:none;
}

body::after{
  content:none;
  display:none;
}

.app{
  width:min(1080px,100%)!important;
  max-width:1080px!important;
  margin:0 auto!important;
  padding:
    calc(92px + env(safe-area-inset-top))
    16px
    calc(126px + env(safe-area-inset-bottom))
    !important;
}

/* ===== Fixed glass header ===== */
.topbar{
  position:fixed!important;
  top:calc(8px + env(safe-area-inset-top))!important;
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  z-index:7000!important;
  width:min(calc(100% - 20px),1048px)!important;
  min-height:64px;
  margin:0!important;
  padding:8px 9px 8px 14px!important;
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  border-radius:var(--ut-radius)!important;
  border:1px solid rgba(255,255,255,.135)!important;
  background:rgba(18,18,18,.42)!important;
  -webkit-backdrop-filter:blur(20px) saturate(100%)!important;
  backdrop-filter:blur(20px) saturate(100%)!important;
  box-shadow:var(--ut-shadow)!important;
}

.topbar::before{
  content:none;
}

.topbar h1{
  min-width:0;
  margin:0!important;
  padding:0 8px 0 0!important;
  font-size:1.25rem!important;
  font-weight:750!important;
  letter-spacing:-.045em!important;
  white-space:nowrap;
  position:relative;
}

.topbar h1::before{
  content:none;
  display:none;
}

.topbar button{
  width:auto!important;
  min-width:64px;
  min-height:44px!important;
  padding:9px 13px!important;
  border-radius:var(--ut-radius)!important;
  border:1px solid rgba(255,255,255,.085)!important;
  background:rgba(255,255,255,.055)!important;
  color:#e5e5e5!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045)!important;
}

.topbar button.tab-active{
  color:#fff!important;
  background:rgba(255,255,255,.12)!important;
  border-color:rgba(255,255,255,.18)!important;
  box-shadow:var(--ut-shadow)!important;
}

/* ===== Universal glass sections ===== */
#mainPage>.card,
#dataPage>.card,
#sandboxPage>.card,
#authPage.card{
  position:relative;
  overflow:hidden;
  margin:14px 0!important;
  padding:17px!important;
  border-radius:var(--ut-radius-xl)!important;
  border:1px solid var(--ut-line)!important;
  background:rgba(18,18,18,.78)!important;
  -webkit-backdrop-filter:blur(20px) saturate(100%)!important;
  backdrop-filter:blur(20px) saturate(100%)!important;
  box-shadow:var(--ut-shadow)!important;
}

#mainPage>.card::before,
#dataPage>.card::before,
#sandboxPage>.card::before,
#authPage.card::before{
  content:none;
}

/* Section identity accents */
#gameNightDashboardCard{
  background:rgba(18,18,18,.78)!important;
}
#teamsDetails{
  --section-accent:var(--ut-blue);
}
#attendanceCard{
  --section-accent:var(--ut-green);
}
#dataCaptainTools{
  --section-accent:var(--ut-purple);
}
#dataSandboxLauncher{
  --section-accent:var(--ut-amber);
  background:rgba(18,18,18,.78)!important;
}
#dataAdminLoadEdit{
  --section-accent:#6ca8ff;
}

/* ===== Details section headers ===== */
.card>details>summary{
  min-height:58px!important;
  margin:-3px -3px 12px!important;
  padding:10px 12px 10px 14px!important;
  gap:10px;
  border-radius:var(--ut-radius)!important;
  border:1px solid rgba(255,255,255,.075)!important;
  background:rgba(255,255,255,.025)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045)!important;
}

.card>details>summary::before{
  content:"";
  width:3px;
  align-self:stretch;
  min-height:24px;
  flex:0 0 3px;
  border-radius:999px;
  background:var(--section-accent,var(--ut-blue));
  box-shadow:none;
  opacity:.65;
}

.card>details:not([open])>summary{
  margin-bottom:-3px!important;
}

.summary-title{
  flex:1;
  font-size:1.08rem!important;
  font-weight:700!important;
  letter-spacing:-.025em!important;
}

/* ===== Dashboard ===== */
.dashboard-heading{
  margin-bottom:14px!important;
}
.eyebrow{
  color:#aaa!important;
  letter-spacing:.18em!important;
}
.dashboard-heading h2{
  font-size:1.42rem!important;
  letter-spacing:-.04em!important;
}
.dashboard-grid{
  gap:10px!important;
}
.dashboard-tile{
  position:relative;
  overflow:hidden;
  min-height:92px;
  padding:14px!important;
  border-radius:var(--ut-radius)!important;
  border:1px solid rgba(255,255,255,.085)!important;
  background:rgba(255,255,255,.035)!important;
  box-shadow:var(--ut-shadow)!important;
}
.dashboard-tile::after{
  content:none;
  display:none;
}
.dashboard-label{
  font-size:.70rem!important;
  letter-spacing:.11em!important;
}
.dashboard-value{
  margin-top:6px!important;
  font-size:1.28rem!important;
  letter-spacing:-.035em!important;
}

/* ===== Inner surfaces ===== */
.subbox,
.history-card,
.player,
.present-row,
.teambox,
.notice,
.balance-panel{
  border:1px solid rgba(255,255,255,.085)!important;
  background:rgba(255,255,255,.03)!important;
  box-shadow:var(--ut-shadow)!important;
}

.subbox{
  padding:13px!important;
  border-radius:var(--ut-radius)!important;
  margin-top:11px!important;
}

.player,
.present-row,
.history-card{
  border-radius:var(--ut-radius)!important;
}

.player{
  min-height:58px;
  padding:10px 12px!important;
  transition:transform .14s ease,border-color .14s ease,background .14s ease;
}

.player.clickable:active{
  transform:none;
}

.attend-on{
  outline:none!important;
  border-color:rgba(99,230,154,.34)!important;
  background:rgba(49,112,70,.20)!important;
  box-shadow:var(--ut-shadow)!important;
}

.teambox{
  border-radius:var(--ut-radius)!important;
  padding:14px!important;
  min-height:150px;
}
.grid.grid-3>.teambox:nth-child(1){
  background:rgba(255,255,255,.03)!important;
}
.grid.grid-3>.teambox:nth-child(2){
  background:rgba(255,255,255,.03)!important;
}
.grid.grid-3>.teambox:nth-child(3){
  background:rgba(255,255,255,.03)!important;
}

.team-win{
  outline:none!important;
  border-color:rgba(99,230,154,.50)!important;
  box-shadow:0 0 0 1px rgba(99,230,154,.14),0 12px 34px rgba(24,129,66,.15)!important;
}
.team-loss{
  outline:none!important;
  opacity:.72;
  border-color:rgba(255,116,126,.28)!important;
}

/* ===== Controls ===== */
input,
select,
textarea{
  min-height:48px;
  border-radius:var(--ut-radius)!important;
  border:1px solid rgba(255,255,255,.10)!important;
  background:rgba(30,30,30,.70)!important;
  color:var(--ut-text)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.042),
    0 5px 16px rgba(0,0,0,.10)!important;
}

input:focus,
select:focus,
textarea:focus{
  outline:none!important;
  border-color:rgba(117,160,255,.48)!important;
  box-shadow:
    0 0 0 3px rgba(117,160,255,.11),
    inset 0 1px 0 rgba(255,255,255,.055)!important;
}

button{
  min-height:47px!important;
  border-radius:var(--ut-radius)!important;
  font-weight:700!important;
  letter-spacing:-.01em;
  transition:transform .12s ease,filter .12s ease,border-color .12s ease!important;
}
button:active{
  transform:scale(.982)!important;
}
.btn-secondary{
  background:rgba(255,255,255,.065)!important;
  border:1px solid rgba(255,255,255,.095)!important;
  color:#ededed!important;
}
.btn{
  background:rgba(67,99,173,.85)!important;
  border:1px solid rgba(160,180,255,.23)!important;
  color:white!important;
  box-shadow:var(--ut-shadow)!important;
}
.btn-success{
  background:rgba(63,164,101,.85)!important;
  color:#07180e!important;
  border:1px solid rgba(179,255,207,.20)!important;
}
.btn-warn{
  background:rgba(215,158,65,.9)!important;
  color:#241606!important;
}
.btn-danger{
  background:rgba(191,66,76,.9)!important;
  color:#fff!important;
}

.chip,
.status-pill{
  border-radius:999px!important;
  background:rgba(255,255,255,.06)!important;
  border:1px solid rgba(255,255,255,.095)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045)!important;
}

/* Data page identity strip */
#dataPage>.card:first-child{
  padding:11px 13px!important;
  background:rgba(18,18,18,.78)!important;
}

/* Tool buttons become dashboard launch tiles */
.player-tools-grid{
  gap:10px!important;
}
.player-tools-grid button,
#dataSandboxLauncher button{
  position:relative;
  min-height:68px!important;
  text-align:left;
  padding:13px 15px!important;
  border-radius:var(--ut-radius)!important;
}
.player-tools-grid button::after{
  content:"›";
  position:absolute;
  right:15px;
  top:50%;
  transform:translateY(-52%);
  font-size:1.5rem;
  font-weight:400;
  opacity:.48;
}

/* ===== Floating Generate Teams dock ===== */
.stickybar{
  position:fixed!important;
  left:50%!important;
  right:auto!important;
  bottom:calc(9px + env(safe-area-inset-bottom))!important;
  --generate-scroll-offset:0px;
  transform:translate3d(-50%,var(--generate-scroll-offset),0)!important;
  z-index:6500!important;
  width:min(calc(100% - 20px),760px)!important;
  padding:9px!important;
  border-radius:var(--ut-radius)!important;
  border:1px solid rgba(255,255,255,.14)!important;
  background:rgba(18,18,18,.34)!important;
  -webkit-backdrop-filter:blur(20px) saturate(100%)!important;
  backdrop-filter:blur(20px) saturate(100%)!important;
  box-shadow:var(--ut-shadow)!important;
  transition:transform .62s cubic-bezier(.22,1,.36,1), opacity .20s ease!important;
  will-change:transform;
}

/* 4.15.4: while Search Players moves behind the header, the dock follows
   that scroll distance instead of switching between visible/hidden states. */
.stickybar.generate-scroll-tracking{
  transition:transform .07s linear, opacity .20s ease!important;
}

@media (prefers-reduced-motion:reduce){
  .stickybar{transition:none!important}
}

.stickybar::before{
  content:none;
}

.stickybar .inner{
  max-width:none!important;
  width:100%!important;
}

.stickybar .btn-success{
  min-height:58px!important;
  border-radius:var(--ut-radius)!important;
  background:rgba(52,130,78,.30)!important;
  color:#e8fff0!important;
  border:1px solid rgba(105,235,155,.28)!important;
  -webkit-backdrop-filter:blur(18px)!important;
  backdrop-filter:blur(18px)!important;
  box-shadow:var(--ut-shadow)!important;
}

/* ===== Sandbox ===== */
body.sandbox-open{
  background:#000000!important;
}

.sandbox-banner{
  position:sticky!important;
  top:calc(82px + env(safe-area-inset-top))!important;
  z-index:5000!important;
  margin:2px 0 14px!important;
  padding:11px 13px!important;
  border-radius:var(--ut-radius)!important;
  border:1px solid rgba(255,195,106,.28)!important;
  background:rgba(24,24,24,.90)!important;
  -webkit-backdrop-filter:blur(20px) saturate(100%)!important;
  backdrop-filter:blur(20px) saturate(100%)!important;
  box-shadow:var(--ut-shadow)!important;
}

/* ===== Modal makeover ===== */
.modal-backdrop{
  background:rgba(0,0,0,.66)!important;
  -webkit-backdrop-filter:blur(17px) saturate(125%)!important;
  backdrop-filter:blur(17px) saturate(125%)!important;
}
.modal-card{
  border-radius:var(--ut-radius)!important;
  border:1px solid rgba(255,255,255,.13)!important;
  background:rgba(20,20,20,.96)!important;
  -webkit-backdrop-filter:blur(20px) saturate(100%)!important;
  backdrop-filter:blur(20px) saturate(100%)!important;
  box-shadow:var(--ut-shadow)!important;
}
.modal-header-sticky{
  border-radius:var(--ut-radius)!important;
  border:1px solid rgba(255,255,255,.075)!important;
  background:rgba(26,26,26,.94)!important;
}

/* Divider refinement */
.hr{
  height:1px!important;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.10),transparent)!important;
  margin:13px 0!important;
}

.small,
.notice,
.muted,
.muted-inline,
label{
  color:var(--ut-muted)!important;
}

/* ===== Mobile ===== */
@media(max-width:760px){
  .app{
    padding:
      calc(85px + env(safe-area-inset-top))
      9px
      calc(124px + env(safe-area-inset-bottom))
      !important;
  }

  .topbar{
    top:calc(5px + env(safe-area-inset-top))!important;
    width:calc(100% - 10px)!important;
    min-height:60px;
    padding:7px 7px 7px 10px!important;
    border-radius:var(--ut-radius)!important;
    gap:5px!important;
  }

  .topbar h1{
    font-size:1.02rem!important;
    padding-left:0!important;
    padding-right:3px!important;
  }


  .topbar button{
    min-width:0;
    min-height:42px!important;
    padding:8px 10px!important;
    font-size:.83rem!important;
  }

  #mainPage>.card,
  #dataPage>.card,
  #sandboxPage>.card,
  #authPage.card{
    padding:13px!important;
    border-radius:var(--ut-radius)!important;
    margin:10px 0!important;
  }

  .dashboard-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }

  .dashboard-tile{
    min-height:83px;
    padding:11px!important;
    border-radius:var(--ut-radius)!important;
  }

  .stickybar{
    bottom:calc(6px + env(safe-area-inset-bottom))!important;
    width:calc(100% - 12px)!important;
    padding:7px!important;
    border-radius:var(--ut-radius)!important;
  }

  .stickybar .btn-success{
    min-height:55px!important;
    border-radius:var(--ut-radius)!important;
  }

  .sandbox-banner{
    top:calc(73px + env(safe-area-inset-top))!important;
  }

  .teambox{
    min-height:0;
  }
}

@media(max-width:430px){
  .topbar h1{
    max-width:150px;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .topbar button{
    padding:8px 8px!important;
  }

  .card>details>summary{
    min-height:54px!important;
    padding:8px 9px!important;
    border-radius:var(--ut-radius)!important;
  }

  .summary-title{
    font-size:1.0rem!important;
  }
}

@media(prefers-reduced-motion:reduce){
  *{
    scroll-behavior:auto!important;
    transition:none!important;
  }
}

/* Shared radius for rectangular panels and controls, including legacy dialogs.
   Status pills and circular switch knobs keep their natural shapes. */
.card, .modal-card, .loading-card, .push-prompt-card,
.subbox, .history-card, .teambox, .player, .present-row,
.notice, .balance-panel, .dashboard-tile, .sandbox-banner,
.present-count-card, .profile-stat, .edit-player-details,
.late-add-player-list, .compact-info-box,
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
select, textarea, button, .modal-header-sticky,
.card > details > summary{
  border-radius:var(--ut-radius)!important;
}

/* Six official dashboard tiles make two complete rows on desktop. */
#gameNightDashboard{grid-template-columns:repeat(3,minmax(0,1fr))!important}

/* Compact Add Player and Pair Rules, including their expanded forms. */
#tempPlayerBox, #pairRulesBox{
  padding:6px 12px!important;
  margin-top:6px!important;
}
#tempPlayerBox > details > summary, #pairRulesBox > details > summary{
  min-height:32px;
  padding:3px 0;
}
#tempPlayerBox .grid, #pairRulesBox .grid,
#tempPlayerBox .toolbar, #pairRulesBox .section-actions{gap:6px!important}
#tempPlayerBox label, #pairRulesBox label{margin-bottom:4px;font-size:.82rem}
#tempPlayerBox input, #tempPlayerBox select,
#pairRulesBox input, #pairRulesBox select{
  min-height:44px;
  padding:8px 12px;
}
#tempPlayerBox button, #pairRulesBox button{
  min-height:44px!important;
  padding:8px 12px;
  font-size:.9rem;
}
#pairRuleList:empty{display:none}

/* Tighter attendance rows, including the signed-in player's own row. */
#playerList, #sandboxPlayerList{gap:4px!important}
#playerList .player, #sandboxPlayerList .player{
  min-height:48px;
  padding:4px 12px!important;
  gap:6px;
}
#playerList .player > div:first-child,
#sandboxPlayerList .player > div:first-child{min-width:0}
#playerList .player-name, #sandboxPlayerList .player-name{
  font-size:1rem!important;
  line-height:1.25;
  overflow-wrap:anywhere;
}
#playerList .toggle-wrap{gap:4px}
#playerList .toggle-wrap button{
  min-height:40px!important;
  padding:6px 10px!important;
  font-size:.82rem;
}
#playerList .player-name .chip{padding:2px 7px;font-size:.72rem}
#playerList .self-attendance-hint{margin-top:2px;font-size:.75rem;line-height:1.3}

@media(max-width:760px){
  #gameNightDashboard{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #tempPlayerBox .grid-2, #pairRulesBox .grid-4{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  #tempPlayerBox .grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* Compact Game Night dashboard. */
#mainPage > #gameNightDashboardCard{padding:11px 13px!important}
#gameNightDashboardCard .dashboard-heading{margin-bottom:7px!important;align-items:center}
#gameNightDashboardCard .dashboard-heading h2{font-size:1.1rem!important;margin:0}
#gameNightDashboardCard .eyebrow{font-size:.6rem;letter-spacing:.12em!important}
#gameNightDashboard{gap:6px!important}
#gameNightDashboard .dashboard-tile{min-height:60px;padding:8px 11px!important}
#gameNightDashboard .dashboard-label{font-size:.62rem!important;letter-spacing:.06em!important}
#gameNightDashboard .dashboard-value{font-size:1.05rem!important;margin-top:3px!important}
#gameNightDashboard .small{font-size:.68rem}
/* Clear top edge, without a frosted band or cast shadow. */
.topbar{background:rgba(12,12,12,.22)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;box-shadow:none!important}
.topbar::before,.topbar::after{content:none!important;display:none!important}
#dataPage > #dataSandboxLauncher{padding:10px 13px!important}
#dataSandboxLauncher h2{font-size:1.08rem}
#dataSandboxLauncher button{min-height:42px!important;padding:8px 14px!important;text-align:center}
/* Sandbox chrome stays outside the unchanged app viewport. */
body.sandbox-open{overscroll-behavior:none}
body.sandbox-open > .app{pointer-events:none!important}
#sandboxPage{position:fixed;inset:0;z-index:11000;background:#000!important}
.sandbox-controls{position:absolute;top:0;left:0;right:0;display:flex;gap:7px;align-items:center;padding:8px 10px;padding-top:calc(8px + env(safe-area-inset-top));background:#000;border-bottom:1px solid var(--ut-line);flex-wrap:wrap}
.sandbox-controls label{margin:0;font-size:.78rem}
.sandbox-controls select,.sandbox-controls button{width:auto;min-height:40px!important;padding:7px 11px;font-size:.85rem}
#sandboxIdentity{flex:1;min-width:100px;max-width:230px}
#sandboxRole{max-width:115px}
#sandboxFrame{position:absolute;top:var(--sandbox-controls-height,64px);left:0;width:100%;height:calc(100% - var(--sandbox-controls-height,64px));border:0;background:#000}
#sandboxLoadStatus{position:absolute;top:calc(var(--sandbox-controls-height,64px) + 16px);left:16px;right:16px;color:var(--ut-muted)}
@media(max-width:520px){
 .sandbox-controls{gap:5px}
 .sandbox-controls strong{font-size:.85rem}
 .sandbox-controls label{font-size:.7rem}
 #sandboxIdentity{max-width:150px}
}


/* ===== v4.12.7 targeted cleanup ===== */

/* Header: still translucent, but substantially darker than v4.12.5.
   No backdrop blur, haze, cast shadow, or pseudo-layer at the top edge. */
html::before,
html::after,
body::before,
body::after,
.app::before,
.app::after{
  content:none!important;
  display:none!important;
  filter:none!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}

.topbar{
  background:rgba(12,12,12,.84)!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  filter:none!important;
  box-shadow:none!important;
}
.topbar::before,
.topbar::after{
  content:none!important;
  display:none!important;
  filter:none!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}

/* Current Game: the empty result notice was rendering as a rounded bubble. */
#resultNotice:empty{
  display:none!important;
  margin:0!important;
  padding:0!important;
  min-height:0!important;
  border:0!important;
}

/* Account: Team Notifications is a normal row, not a second black modal header. */
#pushNotificationsBox > .modal-header-sticky{
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}

/* Roster & App Settings: compact controls with less explanatory chrome. */
#dataAdminLoadEdit .grid{
  gap:8px!important;
}
#dataAdminLoadEdit .hr{
  margin:10px 0!important;
}
#dataAdminLoadEdit textarea{
  min-height:92px!important;
}
#dataAdminLoadEdit .toolbar{
  gap:7px!important;
}
#dataAdminLoadEdit label{
  margin-bottom:4px!important;
}
#dataAdminLoadEdit .compact-info-box{
  display:none!important;
}


/* ===== v4.12.7 account notification header fix =====
   Team Notifications is not a modal header. Prevent the sticky-header cap/pseudo layer
   from creating the translucent black strip above it. */
#pushNotificationsBox > .modal-header-sticky,
#pushNotificationsBox > .row{
  position:relative!important;
  top:auto!important;
  z-index:auto!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
#pushNotificationsBox > .modal-header-sticky::before,
#pushNotificationsBox > .modal-header-sticky::after,
#pushNotificationsBox > .row::before,
#pushNotificationsBox > .row::after{
  content:none!important;
  display:none!important;
  background:transparent!important;
  box-shadow:none!important;
}


/* ===== v4.12.9 dashboard actions + bottom click protection ===== */
.dashboard-tile.dashboard-action{
  width:100%!important;
  min-width:0!important;
  text-align:left!important;
  color:var(--ut-text)!important;
  font:inherit!important;
  cursor:pointer!important;
  appearance:none!important;
  -webkit-appearance:none!important;
}
.dashboard-tile.dashboard-action::before{
  content:"›";
  position:absolute;
  top:9px;
  right:12px;
  font-size:1.35rem;
  line-height:1;
  opacity:.42;
}
.dashboard-tile.dashboard-action:active{
  transform:scale(.985)!important;
}
.dashboard-balance.balance-excellent{
  background:rgba(52,164,95,.16)!important;
  border-color:rgba(99,230,154,.38)!important;
  box-shadow:0 8px 24px rgba(0,0,0,.20),inset 0 1px 0 rgba(142,255,183,.08)!important;
}
.dashboard-balance.balance-good{
  background:rgba(75,112,220,.17)!important;
  border-color:rgba(117,160,255,.38)!important;
  box-shadow:0 8px 24px rgba(0,0,0,.20),inset 0 1px 0 rgba(162,183,255,.08)!important;
}
.dashboard-balance.balance-fair{
  background:rgba(205,137,39,.17)!important;
  border-color:rgba(255,195,106,.40)!important;
  box-shadow:0 8px 24px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,219,159,.08)!important;
}
.dashboard-balance.balance-poor{
  background:rgba(182,55,66,.18)!important;
  border-color:rgba(255,116,126,.40)!important;
  box-shadow:0 8px 24px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,169,176,.08)!important;
}
.dashboard-balance.balance-empty{
  background:rgba(255,255,255,.035)!important;
}
.dashboard-balance .dashboard-label,
.dashboard-balance .dashboard-value{color:inherit!important}
.balance-detail-hero{
  border:1px solid currentColor;
  border-radius:var(--ut-radius)!important;
  padding:15px!important;
  text-align:center;
  margin-bottom:10px;
}
.balance-detail-hero .dashboard-label{color:inherit!important;opacity:.78}
.balance-detail-score{font-size:2.2rem;font-weight:850;line-height:1;margin:7px 0 4px;letter-spacing:-.055em}
.balance-detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}
.balance-detail-grid .history-card{margin:0!important}
.balance-explainer{margin-top:10px;line-height:1.45}
.winner-detail-heading{display:flex;justify-content:space-between;gap:12px;align-items:flex-end}

.stickybar > .generate-click-shield{
  position:absolute;
  left:50%;
  bottom:calc(-14px - env(safe-area-inset-bottom));
  width:100vw;
  height:calc(108px + env(safe-area-inset-bottom));
  transform:translateX(-50%);
  z-index:0;
  pointer-events:auto;
  background:transparent;
}
.stickybar .inner{position:relative!important;z-index:1!important}

#numTeamsSection{margin-top:0!important;margin-bottom:5px!important}
#numTeamsSection .grid{margin-top:0!important}

@media(max-width:560px){
  .balance-detail-grid{grid-template-columns:1fr!important}
  .winner-detail-heading{align-items:flex-start;flex-direction:column}
}


/* ===== 4.13.0 sandbox identity =====
   Keep only the outer sandbox control bar blue; the app header inside stays normal. */
.sandbox-controls{
  background:rgba(18,72,178,.96)!important;
  border-bottom-color:rgba(135,178,255,.55)!important;
  box-shadow:0 6px 22px rgba(0,42,120,.30)!important;
}

/* ===== 4.14.0 attendance press-and-hold + one-time player marker ===== */
.one-time-badge4132{
  display:inline-flex;
  align-items:center;
  vertical-align:middle;
  margin-left:5px;
  padding:2px 6px;
  border-radius:999px!important;
  border:1px solid rgba(112,164,255,.48)!important;
  background:rgba(52,104,210,.20)!important;
  color:#aecdff!important;
  font-size:.62rem!important;
  font-weight:850!important;
  line-height:1.15!important;
  letter-spacing:.045em!important;
  white-space:nowrap!important;
}

.player-hold-enabled4132{
  -webkit-touch-callout:none;
  -webkit-user-select:none;
  user-select:none;
  touch-action:pan-y;
  transition:transform .12s ease,box-shadow .16s ease,background-color .16s ease!important;
}
.player-hold-enabled4132.player-hold-arming4132{
  transform:none;
  box-shadow:inset 0 0 0 1px rgba(120,167,255,.38)!important;
}
.player-hold-enabled4132.player-hold-fired4132{
  box-shadow:inset 0 0 0 2px rgba(120,167,255,.72)!important;
}

.player-actions-card4132{
  width:min(430px,100%)!important;
  max-height:none!important;
}
.player-actions-header4132{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:12px;
}
.player-actions-title4132{
  min-width:0;
  display:flex;
  align-items:center;
  gap:5px;
  flex-wrap:wrap;
  font-size:1.05rem;
}
.player-actions-title4132 strong{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.player-actions-close4132{width:auto!important;flex:0 0 auto!important}
.player-actions-grid4132{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
}
.player-actions-grid4132 button{
  width:100%!important;
  min-height:44px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  text-align:left;
}
.player-actions-grid4132 button span{opacity:.75;font-weight:800}

.edit-player-actions4132{
  margin-top:10px!important;
  gap:7px!important;
}
.edit-player-details summary .one-time-badge4132{
  flex:0 0 auto;
}

@media(max-width:560px){
  .edit-player-actions4132{display:grid!important;grid-template-columns:1fr!important}
  .edit-player-actions4132 button{width:100%!important}
}


/* ===== 4.14.2 compact Attendance controls ===== */
.injury-indicator4141{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:34px!important;
  padding:6px 10px!important;
  border-radius:999px!important;
  pointer-events:none!important;
  cursor:default!important;
  user-select:none!important;
}

/* ===== 4.14.5 installed iOS viewport =====
   The document does not scroll behind the system status area. The app owns
   scrolling below the safe inset, without a fixed cap or blur/compositing layer. */
html.ios-home-screen,
html.ios-home-screen body{
  height:100%;
  min-height:0!important;
  overflow:hidden!important;
  overscroll-behavior:none;
  background:#000!important;
  background-attachment:scroll!important;
}
html.ios-home-screen .app{
  position:fixed;
  top:env(safe-area-inset-top, 0px);
  bottom:0;
  left:0;
  right:0;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior-y:none;
  padding-top:92px!important;
  scroll-padding-top:92px;
}

html.ios-home-screen .topbar{
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  filter:none!important;
  background:rgba(12,12,12,.84)!important;
  box-shadow:none!important;
}
@media(max-width:760px){
  html.ios-home-screen .app{padding-top:85px!important;scroll-padding-top:85px}
}

/* 4.14.5: one compact team-count control; stable attendance hit targets. */
#numTeamsSection .team-count-control4145{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin:0;padding:8px 12px;min-height:48px;
  border:1px solid var(--ut-line);border-radius:var(--ut-radius);
  background:rgba(255,255,255,.04);color:var(--text);font-weight:700;
}
#numTeamsSection #numTeams{
  flex:0 0 76px;width:76px;min-height:34px!important;padding:4px 8px!important;
  margin:0;text-align:center;font-size:16px;border:0!important;
  border-radius:var(--ut-radius)!important;background:rgba(255,255,255,.06)!important;
}
#numTeamsSection #numTeams:focus-visible{outline:2px solid var(--ut-green);outline-offset:2px}
#playerList .player.clickable{
  touch-action:manipulation;-webkit-user-select:none;user-select:none;
  -webkit-touch-callout:none;transform:none!important;
  transition:box-shadow .12s ease!important;
}
/* Do not switch the main scroller's overflow or remove its fixed header
   during Sandbox. iOS can otherwise restore a different root scroll effect. */
html.ios-home-screen #sandboxPage{
  top:env(safe-area-inset-top,0px)!important;
  bottom:0!important;height:auto!important;
}
html.ios-home-screen #sandboxControls{padding-top:8px!important}
html.ios-home-screen .app{overflow-y:auto!important;overflow-x:hidden!important}

/* Block only the Generate bar and the area below it, not visible rows above. */
.stickybar > .generate-click-shield{top:0;height:auto}

/* ===== 4.14.7 shared typography and translucent dialogs ===== */
:root{
  --ut-font-title:1.0625rem;
  --ut-font-body:.9375rem;
  --ut-font-label:.875rem;
  --ut-font-meta:.8125rem;
  --ut-font-caption:.75rem;
  --ut-text:#f5f5f5;
  --text:var(--ut-text);
  --ut-muted:#b3b3b3;
  --muted:var(--ut-muted);
  --ut-dialog-surface:rgba(20,20,20,.88);
  --ut-dialog-header:rgba(26,26,26,.90);
}
body{font-size:var(--ut-font-body);line-height:1.4}
button,input,select,textarea{font-family:inherit;line-height:1.35}
button{font-size:var(--ut-font-body);font-weight:650}
/* Inputs retain 16px text to avoid focus zoom in iPhone Safari. */
input,select,textarea,.sandbox-controls select{font-size:16px!important;color:var(--ut-text)}
input::placeholder,textarea::placeholder{color:var(--ut-muted);opacity:.8}
h2,.summary-title,.modal-card h2,.modal-header-sticky h2,
#dataSandboxLauncher h2,.push-prompt-card h2,#pushPromptModal h2,
.player-actions-title4132 strong{
  font-size:var(--ut-font-title)!important;line-height:1.3!important;
  font-weight:700!important;letter-spacing:-.015em!important;color:var(--ut-text);
}
h3,.teamhead strong{font-size:1rem!important;line-height:1.35;font-weight:650;color:var(--ut-text)}
.topbar h1{font-size:1.125rem!important;line-height:1.2!important;color:var(--ut-text)}
.topbar button,.sandbox-controls button{font-size:var(--ut-font-label)!important}
label,#tempPlayerBox label,#pairRulesBox label{
  font-size:var(--ut-font-label)!important;line-height:1.35;color:var(--ut-muted)!important;
}
.small,.notice,.muted,.muted-inline,.present-meta,.self-attendance-hint,
.smart-rebalance-note,.balance-details,.app-version-line{
  font-size:var(--ut-font-meta)!important;line-height:1.4!important;color:var(--ut-muted)!important;
}
.player-name,#playerList .player-name,#sandboxPlayerList .player-name,.present-name{
  font-size:var(--ut-font-body)!important;line-height:1.35!important;font-weight:650;color:var(--ut-text);
}
.chip,.status-pill,.one-time-badge4132,#playerList .player-name .chip{
  font-size:var(--ut-font-caption)!important;line-height:1.3!important;
}
.player-actions-grid4132 button,.edit-player-actions4132 button,.toggle-wrap button{
  font-size:var(--ut-font-label)!important;
}
.card>details>summary .summary-title{min-width:0}
#tempPlayerBox summary .muted-inline,#pairRulesBox summary .muted-inline{
  font-size:var(--ut-font-body)!important;font-weight:650;color:var(--ut-text)!important;
}
#numTeamsSection .team-count-control4145{font-size:var(--ut-font-body)!important;color:var(--ut-text)!important}
.roster-count4147{font-size:var(--ut-font-meta);color:var(--ut-muted);white-space:nowrap}
.roster-count4147 strong{color:var(--ut-text);font-weight:650}
.section-content4147{margin-top:10px}
#dataSandboxLauncher button{width:100%!important;min-height:42px!important;font-size:var(--ut-font-body)!important}

/* App-controlled pop-ups use one surface, overlay, and header treatment. */
.modal-backdrop,.loading-backdrop,.push-prompt-modal,.push-prompt-hard-center{
  background:rgba(0,0,0,.44)!important;
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
}
.modal-card,.loading-card,.push-prompt-card,.push-prompt-hard-center>div{
  background:var(--ut-dialog-surface)!important;color:var(--ut-text)!important;
  border:1px solid var(--ut-line-bright)!important;border-radius:var(--ut-radius)!important;
  -webkit-backdrop-filter:blur(8px)!important;backdrop-filter:blur(8px)!important;
}
.modal-card>.modal-header-sticky,.modal-card>.row.modal-header-sticky{
  background:var(--ut-dialog-header)!important;
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
}
.modal-card>.modal-header-sticky::before{background:var(--ut-dialog-header)!important}
.modal-card .player-actions-header4132{background:transparent!important}

/* Six readable tiles in fewer rows, without shrinking their text below 12px. */
#mainPage>#gameNightDashboardCard{padding:10px!important}
#gameNightDashboardCard .dashboard-heading{margin-bottom:6px!important;gap:8px;align-items:center}
#gameNightDashboardCard .dashboard-heading h2{font-size:var(--ut-font-title)!important}
#dashboardConnectionBadge{padding:4px 8px!important}
#gameNightDashboard{grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:6px!important}
#gameNightDashboard .dashboard-tile{min-height:60px!important;padding:7px 8px!important;border-radius:var(--ut-radius)!important}
#gameNightDashboard .dashboard-label{
  font-size:var(--ut-font-caption)!important;color:var(--ut-muted)!important;
  line-height:1.25!important;letter-spacing:.02em!important;text-transform:none!important;
}
#gameNightDashboard .dashboard-value{
  font-size:1rem!important;line-height:1.3!important;font-weight:700!important;
  margin-top:3px!important;letter-spacing:0!important;
  display:flex;gap:4px;align-items:baseline;flex-wrap:wrap;
}
#gameNightDashboard .dashboard-context4147,#gameNightDashboard .dashboard-balance-name4147{
  font-size:var(--ut-font-caption)!important;line-height:1.25;font-weight:500;
}
#gameNightDashboard .dashboard-context4147{color:var(--ut-muted)}
#gameNightDashboard .dashboard-balance-name4147{color:inherit}
.dashboard-label{font-size:var(--ut-font-caption)!important;letter-spacing:.03em!important;color:var(--ut-muted)}
.balance-detail-score{font-size:2rem!important;line-height:1.15!important}
@media(max-width:760px){
  #gameNightDashboard{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-width:359px){
  #gameNightDashboard{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .topbar h1{font-size:1rem!important}
  .topbar button{font-size:var(--ut-font-meta)!important}
}

/* 4.14.9: one attendance surface and consistent 48px touch targets. */
#attendanceCard{--attendance-surface:#181818;--attendance-height:48px}
#attendanceCard .team-count-control4145,
#attendanceCard #tempPlayerBox,#attendanceCard #pairRulesBox,
#attendanceFilters4148>button,
#attendanceCard #playerSearch,
#attendanceCard #playerList .player{
  box-sizing:border-box;min-height:var(--attendance-height)!important;
  background:var(--attendance-surface)!important;
  border:1px solid var(--ut-line)!important;
  border-radius:var(--ut-radius)!important;
  color:var(--ut-text)!important;
  box-shadow:none!important;
}
#attendanceCard .team-count-control4145{padding:6px 12px!important}
#attendanceCard #tempPlayerBox,#attendanceCard #pairRulesBox{padding:0 12px!important;margin-top:8px!important}
#attendanceCard #tempPlayerBox>details>summary,
#attendanceCard #pairRulesBox>details>summary{min-height:46px!important;padding:0!important}
#attendanceCard #tempPlayerBox>details[open],
#attendanceCard #pairRulesBox>details[open]{padding-bottom:12px}
#attendanceFilters4148{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;margin-top:8px}
#attendanceFilters4148>button{padding:6px 10px!important;gap:6px;min-width:0;font-size:var(--ut-font-label)!important;line-height:1.2}
#attendanceFilters4148 .toggle-knob{width:34px;height:20px}
#attendanceFilters4148 .toggle-knob::after{width:14px;height:14px}
#attendanceFilters4148 .toggle-on .toggle-knob::after{left:17px}
#attendanceCard #playerList{gap:8px!important}
#attendanceCard #playerList .player{padding:6px 12px!important;opacity:1}
#attendanceCard #playerList .player.attend-on{outline:2px solid var(--ut-green)!important;outline-offset:-2px}
#attendanceCard #playerList .player.inactive .player-name{color:var(--ut-muted)}
#dataSandboxLauncher{padding:0!important;border:0!important;background:transparent!important}
#dataSandboxLauncher button{min-height:48px!important}


/* 4.15.6: clear loading/retry feedback and keyboard focus without extra panels. */
#startupStatus4156{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 12px;color:var(--ut-muted);font-size:var(--ut-font-meta)}
#startupStatus4156 button{width:auto;min-height:36px;padding:6px 12px}
[hidden]{display:none!important}
button:focus-visible,summary:focus-visible,[role="button"]:focus-visible{
  outline:2px solid #86efac!important;outline-offset:3px;
}
#stickybar button:disabled{opacity:.65;cursor:wait}
@media(prefers-reduced-motion:reduce){
  html,.app{scroll-behavior:auto!important}
  #stickybar,.toggle-knob,.toggle-knob::after{transition:none!important}
}

/* Prevent admin controls flashing before the first role-aware render. */
html:not(.app-ready4156) .admin-only,
html:not(.app-ready4156) .captain-admin-only,
html:not(.app-ready4156) .signed-in-only,
html:not(.app-ready4156) #dataTabBtn,
html:not(.app-ready4156) #stickybar{display:none!important}


/* Injury percentage uses the same label-and-number shape as Number of Teams. */
.compact-number4157{
  display:flex!important;align-items:center;justify-content:space-between;gap:12px;
  margin:0!important;padding:6px 12px!important;min-height:48px;
  background:#181818!important;border:1px solid var(--ut-line);border-radius:var(--ut-radius);
  color:var(--ut-text)!important;font-size:var(--ut-font-body)!important;font-weight:650;
}
.compact-number-value4157{display:flex;align-items:center;gap:5px;flex-shrink:0}
.compact-number4157 input{
  width:68px!important;min-height:34px!important;margin:0!important;padding:4px 8px!important;
  text-align:center;font-size:16px!important;border:0!important;
  border-radius:var(--ut-radius)!important;background:rgba(255,255,255,.06)!important;
}
.injury-save-status4157:not(:empty){padding:4px 12px 0}
#retryInjury4157{margin-top:6px}
#portraitGuard4157{
  position:fixed;inset:0;z-index:2147483647;display:flex;align-items:center;justify-content:center;
  padding:24px;text-align:center;background:#000;color:var(--ut-text);touch-action:none;
}
#portraitGuard4157 strong{font-size:1.125rem}
#portraitGuard4157 p{font-size:var(--ut-font-body);color:var(--ut-muted);margin:8px 0 0}
html.phone-landscape4157 body>:not(#portraitGuard4157),
html.phone-landscape4157 body>:not(#portraitGuard4157) *{visibility:hidden!important;pointer-events:none!important}

.compact-number4157>span:first-child{min-width:0;overflow-wrap:anywhere}