
:root{--bg:#0f1524;--panel:#172033;--panel2:#202b42;--card:#f7f8fb;--ink:#111827;--muted:#6b7280;--light:#eef2ff;--accent:#f97316;--accent2:#fb923c;--line:#d7dce5;--success:#18794e;--danger:#b42318;--shadow:0 12px 34px rgba(0,0,0,.19);--nav-h:72px}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html{background:var(--bg)}body{margin:0;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;background:radial-gradient(circle at 10% 0%,rgba(249,115,22,.12),transparent 24rem),linear-gradient(180deg,#101625,#0b1020 70%);color:var(--light);overscroll-behavior-y:none}button,input,textarea,select{font:inherit}button{cursor:pointer} .app-shell{max-width:920px;margin:0 auto;padding:calc(env(safe-area-inset-top) + 10px) max(12px,env(safe-area-inset-right)) calc(var(--nav-h) + 38px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}
.app-header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:10px 2px 8px}.brand-block{min-width:0}.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:9px;font-weight:850;color:#fdba74;margin-bottom:4px}h1{font-size:clamp(24px,5vw,34px);line-height:1;letter-spacing:-.04em;margin:0 0 6px;max-width:620px}h2,h3,p{margin-top:0}h2{font-size:21px;margin-bottom:4px}h3{font-size:17px;margin-bottom:6px}.lead{color:#aebbd3;max-width:600px;font-size:13px;line-height:1.35;margin-bottom:0}.header-tools{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex:0 0 auto}.cog-button{width:38px;height:38px;border-radius:12px;border:1px solid #34415a;background:#172033;color:#d9e1ef;display:grid;place-items:center;padding:0}.cog-button:active{transform:scale(.95)}.cog-button svg{width:20px;height:20px}.access-statuses{display:flex;flex-direction:column;gap:4px;align-items:flex-end}.admin-status{font-size:10px;font-weight:850;color:#9aa8c4;background:#202b42;border:1px solid #33415c;padding:5px 8px;border-radius:999px;white-space:nowrap;line-height:1.1}.admin-status.unlocked{color:#d1fae5;border-color:#235c49;background:#153a2f}
.tab-page{display:none}.tab-page.active{display:block}.panel{background:var(--card);color:var(--ink);border-radius:18px;padding:15px;box-shadow:var(--shadow);margin-top:10px}.inset{background:#eef2f7;box-shadow:none;border:1px solid var(--line)}.randomiser-entry-panel{max-width:680px;margin-left:auto;margin-right:auto}.randomiser-entry-panel #makeTeamsBtn{margin-top:16px}.section-heading{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;margin-bottom:12px}.section-heading p,.small{color:var(--muted);font-size:12px;line-height:1.35;margin-bottom:0}.badge,.score{display:inline-flex;white-space:nowrap;border-radius:999px;padding:6px 9px;background:#eef2ff;color:#374151;font-weight:850;font-size:10px}textarea,input,select{width:100%;border:1px solid var(--line);background:white;color:var(--ink);border-radius:11px;padding:10px 11px;outline:none;font-size:16px}textarea:focus,input:focus,select:focus{border-color:#fb923c;box-shadow:0 0 0 3px rgba(249,115,22,.11)}textarea{resize:vertical;min-height:170px;line-height:1.35}.grid{display:grid;gap:9px;margin-top:9px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}label>span{display:block;font-size:11px;font-weight:850;margin-bottom:4px}.primary,.secondary,.danger{border:0;border-radius:11px;padding:10px 13px;font-weight:850;min-height:42px}.primary{background:linear-gradient(180deg,var(--accent2),var(--accent));color:white;box-shadow:0 5px 14px rgba(249,115,22,.18)}.secondary{background:#e8ecf3;color:#263247}.danger{background:#fee4e2;color:#9b1c1c}.compact{min-height:34px;padding:7px 10px;font-size:12px}.message{margin:8px 0 0;color:var(--danger);font-weight:750;min-height:1.15em;font-size:12px}.results{margin-top:10px}.team-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.team-card{background:var(--card);color:var(--ink);border-radius:17px;padding:14px;box-shadow:var(--shadow)}.team-top{display:flex;justify-content:space-between;gap:8px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:8px;margin-bottom:8px}.team-top h3{font-size:20px;margin:0;letter-spacing:-.03em}.team-card ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:5px}.team-card li{padding:8px 9px;background:#f0f3f8;border-radius:9px;font-weight:700;font-size:14px}.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.actions>*{flex:1 1 150px}.hidden{display:none!important}
.history-list{display:flex;flex-direction:column;gap:9px}.history-item{border:1px solid var(--line);border-radius:13px;padding:11px}.history-meta{display:flex;justify-content:space-between;gap:7px;flex-wrap:wrap;color:var(--muted);font-size:10px;margin-bottom:7px}.history-teams{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.history-team{background:#f3f5f8;border-radius:9px;padding:9px;font-size:13px}.history-team strong{display:block;margin-bottom:3px}.history-scoreline{display:flex;align-items:center;justify-content:center;gap:10px;font-weight:900;font-size:19px;margin:7px 0 1px}.history-scoreline.unscored{font-size:11px;color:var(--muted);font-weight:700}.history-actions{display:flex;gap:6px;margin-top:8px}.history-actions button{flex:0 0 auto;min-height:32px;padding:6px 9px;border-radius:9px;font-size:11px}.result-pill{display:inline-flex;border-radius:999px;padding:3px 6px;font-size:9px;font-weight:850;background:#e8ecf3;color:#374151}
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px;-webkit-overflow-scrolling:touch}.data-table{width:100%;border-collapse:collapse;background:white;min-width:560px}.data-table th,.data-table td{padding:9px 10px;border-bottom:1px solid #e7eaf0;text-align:right;font-size:12px}.data-table th:first-child,.data-table td:first-child{text-align:left}.data-table thead th{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);background:#f3f5f8}.data-table tbody tr:last-child td{border-bottom:0}.data-table tfoot th{background:#f3f5f8;border-top:2px solid var(--line);text-align:right}.data-table tfoot th:first-child{text-align:left}.footnote{margin-top:8px}.locked-panel{text-align:center;padding:34px 16px}.lock-icon{font-size:30px;margin-bottom:7px}.financial-heading{align-items:flex-end}.fee-control{display:flex;align-items:flex-end;gap:6px}.fee-control label{width:125px}.money-input{position:relative}.money-input>span{position:absolute;left:11px;top:50%;transform:translateY(-50%);font-weight:800;color:var(--muted)}.money-input input{padding-left:25px}.month-toolbar{display:flex;align-items:flex-end;justify-content:space-between;gap:9px;margin-bottom:10px}.month-toolbar label{min-width:190px}
.modal{border:0;border-radius:18px;padding:0;max-width:500px;width:calc(100% - 22px);box-shadow:0 24px 70px rgba(0,0,0,.45)}.modal::backdrop{background:rgba(4,8,18,.72);backdrop-filter:blur(3px)}.modal form{padding:18px;color:var(--ink);position:relative}.modal-close{position:absolute;right:10px;top:8px;border:0;background:transparent;font-size:27px;color:#5d6676;line-height:1}.wide-modal{max-width:780px}.wide-modal textarea{min-height:145px}.score-editor{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:end;max-width:380px;margin:12px auto 6px}.score-dash{font-size:26px;font-weight:900;padding-bottom:5px}.modal[open]{animation:pop .14s ease-out}@keyframes pop{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}
.dev-player-table{min-width:480px}.dev-player-table th:nth-child(1),.dev-player-table td:nth-child(1){text-align:left}.dev-player-table th:nth-child(2),.dev-player-table td:nth-child(2){text-align:left;width:150px}.dev-player-table th:last-child,.dev-player-table td:last-child{text-align:right;width:95px}.dev-player-table input{min-width:0;padding:8px 9px;border-radius:9px}.dev-player-table .remove-player{min-height:32px;padding:6px 8px;border-radius:8px}.dev-actions{justify-content:flex-end}.dev-actions>*{flex:0 0 auto;min-width:160px}.unknown-warning{margin-top:8px;padding:9px 10px;border-radius:9px;background:#fff4e5;border:1px solid #fdba74;color:#9a3412;font-weight:750;line-height:1.35;font-size:12px}
.bottom-nav{position:fixed;left:50%;bottom:0;transform:translateX(-50%);z-index:50;width:min(920px,100%);height:calc(var(--nav-h) + env(safe-area-inset-bottom));padding:6px max(8px,env(safe-area-inset-left)) env(safe-area-inset-bottom) max(8px,env(safe-area-inset-right));display:grid;grid-template-columns:repeat(4,1fr);gap:3px;background:rgba(15,21,36,.96);border-top:1px solid rgba(255,255,255,.09);backdrop-filter:blur(16px);box-shadow:0 -10px 30px rgba(0,0,0,.24)}.bottom-nav .tab{border:0;background:transparent;color:#8f9bb2;border-radius:12px;padding:5px 3px 4px;min-width:0;font-weight:750;font-size:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}.bottom-nav .tab svg{width:21px;height:21px}.bottom-nav .tab.active{color:#fff;background:rgba(249,115,22,.14)}.bottom-nav .tab.active svg{color:#fb923c}.bottom-nav .tab:active{transform:scale(.96)}
footer{display:flex;justify-content:space-between;gap:8px;color:#8190ad;font-size:10px;padding:16px 3px 0}
@media(max-width:700px){.app-shell{padding-top:calc(env(safe-area-inset-top) + 8px);padding-left:max(8px,env(safe-area-inset-left));padding-right:max(8px,env(safe-area-inset-right))}.app-header{padding-top:4px;padding-bottom:6px}.lead{display:none}h1{font-size:22px;line-height:1.02;max-width:280px}.eyebrow{font-size:8px}.cog-button{width:36px;height:36px}.admin-status{font-size:9px;padding:4px 7px}.randomiser-entry-panel{width:calc(100% - 10px);max-width:560px;margin-top:8px;padding:12px}.randomiser-entry-panel textarea{min-height:112px;height:112px}.randomiser-entry-panel .section-heading{margin-bottom:9px}.randomiser-entry-panel .grid{margin-top:10px}.randomiser-entry-panel #makeTeamsBtn{margin-top:18px;width:100%}.grid.two,.team-grid,.history-teams{grid-template-columns:1fr}.section-heading,.financial-heading{align-items:flex-start}.financial-heading{display:block}.fee-control{margin-top:10px}.month-toolbar{align-items:flex-start;flex-direction:column}.month-toolbar label{width:100%}.panel{padding:13px;border-radius:16px}.team-card{padding:12px}.history-actions{flex-wrap:wrap}.data-table{min-width:520px}.actions>*{flex-basis:125px}footer{display:none}}
@media(max-width:390px){.app-shell{padding-left:max(7px,env(safe-area-inset-left));padding-right:max(7px,env(safe-area-inset-right))}.app-header{gap:8px}h1{font-size:21px;max-width:245px}.randomiser-entry-panel{width:calc(100% - 6px)}.randomiser-entry-panel textarea{min-height:100px;height:100px}.panel{padding:11px}.section-heading{margin-bottom:9px}.bottom-nav .tab{font-size:9px}.bottom-nav .tab svg{width:20px;height:20px}.team-card li{font-size:13px}.fee-control{display:grid;grid-template-columns:1fr auto}.fee-control label{width:auto}}

/* v3.7.1 — Randomiser player list: show up to 14 pasted players */
@media (max-width:700px){
  #textarea{
    min-height: 340px;
    height: 340px;
    resize: none;
  }
}


/* v3.7.1 — mobile table tightening */
@media (max-width:700px){
  /* Keep tabular data inside the viewport */
  .table-wrap,
  .rankings-table-wrap,
  .financials-table-wrap,
  .players-table-wrap{
    overflow-x: visible !important;
    width:100%;
    max-width:100%;
  }

  table{
    width:100%;
    max-width:100%;
    table-layout:fixed;
    border-collapse:collapse;
  }

  th, td{
    padding:8px 6px !important;
    font-size:12px !important;
    line-height:1.25;
    vertical-align:middle;
    overflow-wrap:anywhere;
    word-break:break-word;
  }

  /* Player/name columns no longer hog the width */
  th:first-child,
  td:first-child{
    width:38%;
  }

  /* Financials: compact numeric columns */
  #financialsTable th:nth-child(2),
  #financialsTable td:nth-child(2){
    width:18%;
    text-align:center;
  }
  #financialsTable th:nth-child(3),
  #financialsTable td:nth-child(3){
    width:22%;
    text-align:right;
  }
  #financialsTable th:nth-child(4),
  #financialsTable td:nth-child(4){
    width:22%;
    text-align:right;
  }

  /* Dev player editor: compact rating + action columns */
  #playersTable th:first-child,
  #playersTable td:first-child,
  #devPlayersTable th:first-child,
  #devPlayersTable td:first-child{
    width:58%;
  }
  #playersTable th:nth-child(2),
  #playersTable td:nth-child(2),
  #devPlayersTable th:nth-child(2),
  #devPlayersTable td:nth-child(2){
    width:20%;
  }
  #playersTable th:nth-child(3),
  #playersTable td:nth-child(3),
  #devPlayersTable th:nth-child(3),
  #devPlayersTable td:nth-child(3){
    width:22%;
    text-align:right;
  }

  /* Inputs/buttons inside Dev Settings stay compact */
  #playersTable input,
  #devPlayersTable input{
    min-width:0 !important;
    width:100% !important;
    padding:9px 8px !important;
    font-size:13px !important;
  }

  #playersTable button,
  #devPlayersTable button{
    min-width:0 !important;
    width:auto !important;
    padding:8px 9px !important;
    font-size:11px !important;
    white-space:nowrap;
  }
}


/* v3.7.1 — audited mobile tables + bottom navigation */
html, body {
  max-width: 100%;
  overflow-x: hidden;
}

@media (max-width:700px){

  /* Fixed navigation must always follow the viewport, never an over-wide child. */
  .bottom-nav{
    left:0;
    right:0;
    bottom:0;
    transform:none;
    width:100%;
    max-width:none;
    grid-template-columns:repeat(4,minmax(0,1fr));
    padding-left:max(6px,env(safe-area-inset-left));
    padding-right:max(6px,env(safe-area-inset-right));
  }
  .bottom-nav .tab{
    width:100%;
    min-width:0;
    overflow:hidden;
    padding:5px 1px 4px;
    white-space:nowrap;
  }
  .bottom-nav .tab span{
    display:block;
    width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    text-align:center;
  }

  /* Table wrappers stay inside their cards. No page-level horizontal overflow. */
  .table-wrap{
    width:100%;
    max-width:100%;
    overflow:hidden;
  }

  /* ---------- Rankings ----------
     Eight genuinely small columns, with Player taking the useful space.
     The rank-number column is deliberately tiny. */
  .rankings-table{
    min-width:0 !important;
    width:100%;
    table-layout:fixed;
  }
  .rankings-table th,
  .rankings-table td{
    padding:7px 2px;
    font-size:10px;
    line-height:1.15;
    text-align:center;
    white-space:nowrap;
  }
  .rankings-table thead th{
    font-size:8.5px;
    letter-spacing:0;
  }
  .rankings-table th:nth-child(1),
  .rankings-table td:nth-child(1){width:6%; text-align:center;}
  .rankings-table th:nth-child(2),
  .rankings-table td:nth-child(2){
    width:30%;
    text-align:left;
    white-space:normal;
    overflow-wrap:anywhere;
  }
  .rankings-table th:nth-child(3),
  .rankings-table td:nth-child(3){width:11%;}
  .rankings-table th:nth-child(4),
  .rankings-table td:nth-child(4),
  .rankings-table th:nth-child(5),
  .rankings-table td:nth-child(5),
  .rankings-table th:nth-child(6),
  .rankings-table td:nth-child(6){width:8%;}
  .rankings-table th:nth-child(7),
  .rankings-table td:nth-child(7){width:16%;}
  .rankings-table th:nth-child(8),
  .rankings-table td:nth-child(8){width:13%;}

  /* ---------- Financials ----------
     Three columns fit comfortably without scrolling. */
  .financials-table{
    min-width:0 !important;
    width:100%;
    table-layout:fixed;
  }
  .financials-table th,
  .financials-table td{
    padding:8px 6px;
    font-size:11px;
    line-height:1.2;
  }
  .financials-table th:nth-child(1),
  .financials-table td:nth-child(1){
    width:48%;
    text-align:left;
    white-space:normal;
    overflow-wrap:anywhere;
  }
  .financials-table th:nth-child(2),
  .financials-table td:nth-child(2){
    width:20%;
    text-align:center;
  }
  .financials-table th:nth-child(3),
  .financials-table td:nth-child(3){
    width:32%;
    text-align:right;
    white-space:nowrap;
  }
  .financials-table tfoot th:nth-child(2){text-align:center;}
  .financials-table tfoot th:nth-child(3){text-align:right;}

  /* Keep the Financials controls compact and aligned above the table. */
  .fee-control{
    width:100%;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:end;
    gap:7px;
  }
  .fee-control label{width:auto; min-width:0;}
  .fee-control .compact{white-space:nowrap;}
  .month-toolbar{gap:7px;}

  /* ---------- Dev Settings ----------
     Override the old 480px minimum and use an exact three-column grid.
     This is intentionally NOT a generic table rule. */
  .dev-player-table{
    min-width:0 !important;
    width:100%;
    display:block;
    background:white;
  }
  .dev-player-table thead,
  .dev-player-table tbody{
    display:block;
    width:100%;
  }
  .dev-player-table tr{
    display:grid;
    grid-template-columns:minmax(0,1fr) 64px 62px;
    width:100%;
    align-items:center;
  }
  .dev-player-table th,
  .dev-player-table td{
    display:block;
    width:auto !important;
    min-width:0;
    padding:6px 4px;
    font-size:10px;
    text-align:left !important;
  }
  .dev-player-table th:nth-child(2),
  .dev-player-table td:nth-child(2){
    text-align:center !important;
  }
  .dev-player-table th:last-child,
  .dev-player-table td:last-child{
    text-align:right !important;
  }
  .dev-player-table input{
    width:100%;
    min-width:0;
    padding:8px 7px;
    border-radius:8px;
    font-size:13px;
  }
  .dev-player-table .dev-player-rating{
    text-align:center;
  }
  .dev-player-table .remove-player{
    width:58px;
    min-width:0;
    min-height:32px;
    padding:5px 4px;
    border-radius:8px;
    font-size:9px;
    white-space:nowrap;
  }
  .dev-actions{
    width:100%;
  }
  .dev-actions>*{
    width:100%;
    min-width:0;
  }
}

@media (max-width:390px){
  .rankings-table th,
  .rankings-table td{
    padding-left:1px;
    padding-right:1px;
    font-size:9.5px;
  }
  .rankings-table thead th{font-size:8px;}

  .dev-player-table tr{
    grid-template-columns:minmax(0,1fr) 58px 56px;
  }
  .dev-player-table .remove-player{
    width:52px;
    font-size:8.5px;
  }
}


/* v3.7.1 — copy teams action */
.title-with-action{
  display:flex;
  align-items:center;
  gap:8px;
}
.title-with-action h2{
  margin-bottom:0;
}
.icon-button{
  border:0;
  background:#e8ecf3;
  color:#263247;
  width:38px;
  height:38px;
  border-radius:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  line-height:1;
  font-weight:800;
  cursor:pointer;
  flex:0 0 auto;
}
.icon-button:active{
  transform:translateY(1px) scale(.98);
}
.copy-teams-btn.copied{
  background:#dff4e8;
  color:#18794e;
}
@media(max-width:700px){
  .icon-button{
    width:34px;
    height:34px;
    border-radius:10px;
    font-size:18px;
  }
}


/* v3.7.1 — app-like touch behaviour: disable tap/double-tap zoom */
html, body {
  touch-action: manipulation;
  -webkit-text-size-adjust: 100%;
}

button,
a,
input,
select,
textarea,
.tab,
.icon-button {
  touch-action: manipulation;
}


/* =========================================================
   v3.7.1 — polished Selection + splash + five-tab motion
   ========================================================= */
:root{--ph-orange:#ff7a1a;--ph-black:#0b0d10}
.app-header{min-height:104px;align-items:flex-start}
.brand-block{min-width:0;padding-top:5px}
.brand-title{display:flex;align-items:center;gap:9px;margin:0;white-space:nowrap;font-size:clamp(19px,5.2vw,27px)!important;letter-spacing:-.65px}
.brand-bib{width:28px;height:33px;display:inline-flex;flex:0 0 auto}
.brand-bib svg{width:100%;height:100%}
.header-tools{padding-top:0}
@media(max-width:520px){
  .app-header{min-height:118px}
  .brand-title{font-size:19px!important}
  .header-tools{display:flex;flex-direction:column;align-items:flex-end}
  .access-statuses{margin-top:7px}
}

/* Splash */
.app-splash{position:fixed;inset:0;z-index:999999;background:#050505;color:#fff;display:grid;place-items:center;padding:max(28px,env(safe-area-inset-top)) 24px max(28px,env(safe-area-inset-bottom));overscroll-behavior:none;touch-action:none;transition:opacity .38s ease,visibility .38s ease}
.app-splash.splash-out{opacity:0;visibility:hidden;pointer-events:none}
.splash-inner{display:flex;flex-direction:column;align-items:center;transform:translateY(-2vh)}
.splash-bib{width:110px;height:128px;margin-bottom:28px;filter:drop-shadow(0 13px 24px rgba(255,122,26,.18))}
.splash-bib svg{width:100%;height:100%}
.splash-title{display:flex;flex-direction:column;align-items:center;font-weight:850;line-height:1.02;letter-spacing:-1.4px}
.splash-title span{font-size:29px}.splash-title strong{font-style:normal;font-size:48px}.splash-title strong em{font-style:normal;color:var(--ph-orange)}.splash-title span:last-child{font-size:31px;margin-top:5px}
.splash-rule{width:72px;height:4px;border-radius:99px;background:var(--ph-orange);margin:38px 0 31px}
.splash-spinner{width:38px;height:38px;border-radius:50%;border:5px solid rgba(255,122,26,.22);border-top-color:var(--ph-orange);animation:ph-spin .78s linear infinite}
.splash-copy{margin-top:26px;font-size:16px;font-weight:750}
@keyframes ph-spin{to{transform:rotate(360deg)}}

/* Selection */
.selection-panel{padding-bottom:16px;overflow:hidden}
.selection-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px}
.selection-heading-copy{display:flex;align-items:center;gap:12px;min-width:0}
.selection-heading h2{font-size:26px;margin:0}.selection-heading p{margin:2px 0 0;font-size:13px;color:var(--muted)}
.selection-icon{width:36px;height:36px;position:relative;flex:0 0 36px}
.selection-icon:before{content:"";position:absolute;width:14px;height:14px;border-radius:50%;background:currentColor;left:11px;top:1px}
.selection-icon:after{content:"";position:absolute;width:31px;height:18px;border-radius:18px 18px 5px 5px;background:currentColor;left:2.5px;bottom:0}
.accepted-total{width:70px;height:66px;border-radius:14px;background:var(--card,#fff);box-shadow:0 5px 18px rgba(19,27,44,.08);display:flex;flex-direction:column;align-items:center;justify-content:center;flex:0 0 auto}
.accepted-total strong{font-size:31px;line-height:1;color:var(--ph-orange)}.accepted-total span{font-size:10px;font-weight:800;margin-top:4px}

.selection-board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;min-height:420px}
.selection-lane{border-radius:12px;min-width:0;overflow:hidden;border:1px solid transparent;transition:transform .15s ease,box-shadow .15s ease}
.selection-lane.drag-target{transform:translateY(-3px);box-shadow:0 8px 20px rgba(0,0,0,.10)}
.lane-head{height:67px;padding:12px 3px 8px;display:flex;flex-direction:column;align-items:center;text-align:center;justify-content:center;font-size:10px;font-weight:850;line-height:1.05}
.lane-head strong{white-space:nowrap}.lane-head span{margin-top:5px;font-weight:800}
.lane-drop{min-height:353px;padding:9px 6px;display:flex;flex-direction:column;gap:10px}
.lane-declined{background:#fff0f0}.lane-declined .lane-head{background:#ffdcdc;color:#df2b2b}
.lane-not-asked{background:#f4f4f5}.lane-not-asked .lane-head{background:#e8e8ea;color:#3c4048}
.lane-asked{background:#fff8e7}.lane-asked .lane-head{background:#ffedbd;color:#bb6b00}
.lane-accepted{background:#eef9ef}.lane-accepted .lane-head{background:#d8f1d9;color:#16803c}
.selection-player-card{position:relative;z-index:1;min-height:54px;padding:9px 4px;border-radius:9px;background:#fff;display:flex;align-items:center;justify-content:center;text-align:center;font-size:10.5px;font-weight:750;line-height:1.15;box-shadow:0 3px 9px rgba(24,31,45,.10);cursor:grab;user-select:none;-webkit-user-select:none;touch-action:pan-y;transition:transform .18s ease,box-shadow .18s ease}
.selection-player-card.is-dragging{z-index:20;box-shadow:0 12px 24px rgba(24,31,45,.2);transition:none;cursor:grabbing}
.selection-add{width:100%;height:55px;margin-top:14px;border:1.5px dashed rgba(255,122,26,.75);border-radius:12px;background:transparent;color:var(--ph-orange);display:flex;align-items:center;justify-content:center;gap:9px;font-weight:800}
.plus-circle{width:25px;height:25px;border:2px solid currentColor;border-radius:50%;display:grid;place-items:center;font-size:20px;line-height:18px}
.selection-copy{width:100%;height:58px;margin-top:12px;display:flex;align-items:center;justify-content:center;gap:9px;font-size:15px}
.selection-copy svg{width:20px;height:20px}
.selection-footnote{text-align:center!important;margin:9px 20px 0!important;font-size:10px!important;line-height:1.35!important;color:var(--muted)!important}

/* True overlapping page transition */
.app-shell{overflow-x:hidden}
.tab-page{display:none}
.tab-page.active{display:block}
.tab-page.page-enter-right{animation:ph-enter-right .28s cubic-bezier(.22,.72,.24,1)}
.tab-page.page-enter-left{animation:ph-enter-left .28s cubic-bezier(.22,.72,.24,1)}
.tab-page.page-exit-left,.tab-page.page-exit-right{display:block;position:absolute;left:0;right:0;top:var(--page-top,118px);pointer-events:none}
.tab-page.page-exit-left{animation:ph-exit-left .28s cubic-bezier(.22,.72,.24,1)}
.tab-page.page-exit-right{animation:ph-exit-right .28s cubic-bezier(.22,.72,.24,1)}
@keyframes ph-enter-right{from{opacity:.5;transform:translateX(42px)}to{opacity:1;transform:translateX(0)}}
@keyframes ph-enter-left{from{opacity:.5;transform:translateX(-42px)}to{opacity:1;transform:translateX(0)}}
@keyframes ph-exit-left{from{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-42px)}}
@keyframes ph-exit-right{from{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(42px)}}

/* Five-tab navigation */
.bottom-nav{grid-template-columns:repeat(5,minmax(0,1fr))!important;overflow:hidden;position:fixed}
.bottom-nav .tab{position:relative;z-index:2;min-width:0;padding-left:2px!important;padding-right:2px!important;font-size:9px!important;background:transparent!important;transition:color .24s ease,transform .18s ease}
.bottom-nav .tab svg{width:20px!important;height:20px!important}
.bottom-nav .tab .person-nav-icon{width:20px;height:20px;position:relative;display:block}
.person-nav-icon:before{content:"";position:absolute;width:8px;height:8px;left:6px;top:0;border-radius:50%;background:currentColor}
.person-nav-icon:after{content:"";position:absolute;width:17px;height:10px;left:1.5px;bottom:0;border-radius:10px 10px 3px 3px;background:currentColor}
.nav-highlighter{position:absolute;z-index:1;left:0;top:0;height:3px;background:var(--ph-orange);border-radius:0 0 4px 4px;transition:transform .30s cubic-bezier(.22,.72,.24,1),width .30s ease}
.bottom-nav .tab.active{color:var(--ph-orange)!important}

@media(max-width:390px){
  .selection-board{gap:4px}
  .lane-drop{padding:8px 4px;gap:8px}
  .selection-player-card{font-size:9.5px;min-height:50px;padding:7px 2px}
  .lane-head{font-size:9px}
  .bottom-nav .tab{font-size:8.5px!important}
}


/* =========================================================
   v3.7.1 — Tonight's Teams: compact side-by-side mobile view
   ========================================================= */
@media (max-width: 700px) {
  #resultsSection .team-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 8px !important;
    align-items: start;
  }

  #resultsSection .team-card {
    min-width: 0;
    padding: 12px 9px 11px !important;
    border-radius: 18px;
  }

  #resultsSection .team-top {
    gap: 4px;
    align-items: center;
  }

  #resultsSection .team-top h3 {
    min-width: 0;
    font-size: 21px !important;
    line-height: 1.05;
    letter-spacing: -0.45px;
  }

  #resultsSection .team-top .score {
    flex: 0 0 auto;
    padding: 7px 8px !important;
    font-size: 10px !important;
    white-space: nowrap;
  }

  #resultsSection .team-card ul {
    margin-top: 10px !important;
    gap: 6px !important;
  }

  #resultsSection .team-card li {
    min-width: 0;
    min-height: 42px;
    padding: 9px 8px !important;
    border-radius: 10px !important;
    font-size: 13px !important;
    line-height: 1.1;
    overflow-wrap: anywhere;
    display: flex;
    align-items: center;
  }

  #resultsSection > .actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 8px !important;
    margin-top: 12px;
  }

  #resultsSection > .actions > button {
    width: 100%;
    min-width: 0;
    min-height: 52px;
    margin: 0 !important;
  }
}

@media (max-width: 380px) {
  #resultsSection .team-grid { gap: 6px !important; }
  #resultsSection .team-card { padding: 10px 7px !important; }
  #resultsSection .team-top h3 { font-size: 19px !important; }
  #resultsSection .team-top .score { font-size: 9px !important; padding: 6px !important; }
  #resultsSection .team-card li { font-size: 12px !important; padding: 8px 6px !important; }
}


/* =========================================================
   v3.7.1 — History / historical edit side-by-side
   ========================================================= */
.history-teams{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:8px !important;
}
.history-team{
  min-width:0;
  overflow-wrap:anywhere;
}
.history-scoreline{
  flex-wrap:nowrap;
  white-space:nowrap;
}

/* Historical match editor: preserve the two-team comparison on mobile. */
#historyEditDialog .grid.two{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:8px !important;
}
#historyEditDialog .grid.two > label{
  min-width:0;
}
#historyEditDialog .grid.two input,
#historyEditDialog .grid.two textarea{
  width:100%;
  min-width:0;
}
#historyEditDialog .score-editor{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:end;
  gap:8px;
}
@media(max-width:700px){
  .history-item{padding:9px !important}
  .history-teams{gap:6px !important}
  .history-team{padding:8px 7px !important;font-size:11px !important;line-height:1.3}
  .history-team strong{font-size:11px}
  .history-scoreline{font-size:17px !important;gap:7px !important}
  #historyEditDialog{width:calc(100% - 18px);max-width:none}
  #historyEditDialog form{padding-left:10px;padding-right:10px}
  #historyEditDialog .grid.two{gap:6px !important}
  #historyEditDialog .grid.two label > span{font-size:10px}
  #historyEditDialog .grid.two input{font-size:13px;padding:9px 7px}
  #historyEditDialog .grid.two textarea{font-size:12px;padding:8px 7px;line-height:1.3}
  #historyEditDialog .score-editor label > span{font-size:10px}
  #historyEditDialog .score-editor input{font-size:18px;text-align:center}
}


/* =========================================================
   v3.7.1 — Scorers + GS ranking
   ========================================================= */
.history-scorer-list{display:flex;flex-direction:column;gap:4px;margin-top:6px}
.history-scorer-row{display:flex;align-items:center;justify-content:space-between;gap:5px;background:rgba(255,255,255,.55);border-radius:7px;padding:5px 6px;font-size:10px;font-weight:700}
.history-scorer-row strong{margin:0!important;width:19px;min-width:19px;height:19px;border-radius:50%;display:grid!important;place-items:center;font-size:10px}
.history-scorer-row.positive-goal strong{background:#d9f7e2;color:#177a3e}
.history-scorer-row.negative-goal strong{background:#ffdede;color:#b4232a}
.history-scorer-row.no-goal strong{background:rgba(120,130,150,.10);color:var(--muted)}
.scorer-team-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;margin-top:12px}
.scorer-team{min-width:0;border:1px solid var(--line);border-radius:12px;padding:8px;background:var(--card,#fff)}
.scorer-team-head{display:flex;align-items:center;justify-content:space-between;gap:5px;padding-bottom:7px;margin-bottom:7px;border-bottom:1px solid var(--line)}
.scorer-team-head strong{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.scorer-team-head span{font-size:9px;font-weight:850;color:var(--muted)}
.scorer-list{display:flex;flex-direction:column;gap:6px}
.scorer-edit-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:5px;min-width:0}
.scorer-edit-row>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:700}
.scorer-stepper{display:grid;grid-template-columns:27px 31px 27px;gap:3px;align-items:center}
.scorer-stepper button{width:27px;height:30px;min-height:30px;padding:0;border-radius:7px;font-size:16px}
.scorer-stepper input{width:31px!important;height:30px!important;min-height:30px;padding:2px!important;text-align:center;font-size:12px!important}
.edit-roster-details{margin-top:10px;border-top:1px solid var(--line);padding-top:9px}
.edit-roster-details summary{cursor:pointer;font-size:11px;font-weight:800;color:var(--muted);margin-bottom:8px}
.rankings-table{table-layout:fixed!important;min-width:0!important}
.rankings-table th:nth-child(1),.rankings-table td:nth-child(1){width:6%}
.rankings-table th:nth-child(2),.rankings-table td:nth-child(2){width:29%}
.rankings-table th:nth-child(3),.rankings-table td:nth-child(3){width:11%}
.rankings-table th:nth-child(4),.rankings-table td:nth-child(4),
.rankings-table th:nth-child(5),.rankings-table td:nth-child(5),
.rankings-table th:nth-child(6),.rankings-table td:nth-child(6),
.rankings-table th:nth-child(7),.rankings-table td:nth-child(7){width:7%}
.rankings-table th:nth-child(8),.rankings-table td:nth-child(8){width:13%}
.rankings-table th:nth-child(9),.rankings-table td:nth-child(9){width:10%}
@media(max-width:700px){
  .history-scorer-row{padding:4px 5px;font-size:9.5px}
  .scorer-team-grid{gap:6px}
  .scorer-team{padding:7px 5px}
  .scorer-edit-row>span{font-size:10px}
  .scorer-stepper{grid-template-columns:24px 28px 24px;gap:2px}
  .scorer-stepper button{width:24px;height:28px;min-height:28px}
  .scorer-stepper input{width:28px!important;height:28px!important;min-height:28px}
  .rankings-table th,.rankings-table td{padding-left:3px!important;padding-right:3px!important;font-size:10px!important}
  .rankings-table th{font-size:8px!important}
  .rankings-table th:nth-child(2),.rankings-table td:nth-child(2){font-size:11px!important}
}


/* =========================================================
   v3.7.1 — Dev Settings polish + Selection membership/reset
   ========================================================= */
.selection-heading-actions{display:flex;align-items:center;gap:9px;flex:0 0 auto}
.selection-reset-btn{width:46px;height:46px;min-height:46px;padding:0;border-radius:13px;border:1px solid var(--line);background:var(--card,#fff);color:var(--text);display:grid;place-items:center;box-shadow:0 5px 18px rgba(19,27,44,.07)}
.selection-reset-btn svg{width:23px;height:23px}
.selection-reset-btn:active{transform:scale(.94)}
.dev-settings-heading{align-items:flex-start!important;margin-bottom:13px}
.dev-settings-heading h2{font-size:27px;letter-spacing:-.5px}
.dev-settings-heading p{max-width:440px}
.dev-add-player{display:flex!important;align-items:center;gap:5px;white-space:nowrap}
.dev-add-player span{font-size:18px;line-height:1}
#devSettingsContent .table-wrap{border:1px solid var(--line);border-radius:14px;overflow:hidden}
.dev-player-table{table-layout:fixed!important;width:100%!important;min-width:0!important}
.dev-player-table th{font-size:10px!important;text-transform:uppercase;letter-spacing:.35px}
.dev-player-table th:nth-child(1){width:46%}
.dev-player-table th:nth-child(2){width:17%}
.dev-player-table th:nth-child(3){width:21%}
.dev-player-table th:nth-child(4){width:16%}
.dev-player-table td{padding:7px 6px!important;vertical-align:middle}
.dev-player-table input.dev-player-name,
.dev-player-table input.dev-player-rating{height:43px!important;min-height:43px!important;padding:7px 9px!important;border-radius:10px!important;background:var(--card,#fff)}
.dev-player-table input.dev-player-rating{text-align:center;padding-left:3px!important;padding-right:3px!important}
.selection-screen-col{text-align:center!important;line-height:1.05}
.selection-screen-cell{text-align:center}
.selection-toggle{display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.selection-toggle input{position:absolute;opacity:0;pointer-events:none}
.selection-toggle span{width:29px;height:29px;border-radius:9px;border:2px solid #cbd2de;background:#fff;display:grid;place-items:center;transition:.16s ease}
.selection-toggle input:checked+span{background:var(--ph-orange);border-color:var(--ph-orange)}
.selection-toggle input:checked+span:after{content:"✓";color:#fff;font-size:18px;font-weight:900;line-height:1}
.dev-player-table .remove-player{min-height:39px!important;height:39px;padding:0 7px!important;border-radius:10px!important;font-size:10px!important}
.dev-player-table .remove-player>span:first-child{display:none}
.dev-actions{margin-top:12px}
@media(max-width:520px){
  .selection-heading-actions{gap:6px}
  .selection-reset-btn{width:42px;height:42px;min-height:42px;border-radius:12px}
  .accepted-total{width:64px;height:62px}
  .dev-settings-heading h2{font-size:25px}
  .dev-settings-heading p{font-size:12px}
  .dev-add-player{padding:9px 10px!important;font-size:11px!important}
  .dev-player-table th:nth-child(1){width:43%}
  .dev-player-table th:nth-child(2){width:16%}
  .dev-player-table th:nth-child(3){width:23%}
  .dev-player-table th:nth-child(4){width:18%}
  .dev-player-table td{padding:6px 4px!important}
  .dev-player-table input.dev-player-name{font-size:13px!important;padding:6px 7px!important}
  .dev-player-table input.dev-player-rating{font-size:13px!important}
  .dev-player-table .remove-player{padding:0!important;width:34px!important;min-width:34px!important}
  .dev-player-table .remove-player>span:first-child{display:inline;font-size:20px;line-height:1}
  .dev-player-table .remove-player .remove-label{display:none}
  .selection-toggle span{width:27px;height:27px}
}


/* =========================================================
   v3.7.1 — Dev Settings mobile repair
   Component-specific: do not generalise these rules.
   ========================================================= */
#devSettingsContent .table-wrap{overflow:hidden!important}
#devSettingsContent .dev-player-table{width:100%!important;min-width:0!important;table-layout:fixed!important;border-collapse:collapse!important}
#devSettingsContent .dev-player-table th,#devSettingsContent .dev-player-table td{box-sizing:border-box;min-width:0!important;overflow:hidden}
#devSettingsContent .dev-player-table th:nth-child(1),#devSettingsContent .dev-player-table td:nth-child(1){width:52%!important}
#devSettingsContent .dev-player-table th:nth-child(2),#devSettingsContent .dev-player-table td:nth-child(2){width:16%!important}
#devSettingsContent .dev-player-table th:nth-child(3),#devSettingsContent .dev-player-table td:nth-child(3){width:18%!important;text-align:center!important}
#devSettingsContent .dev-player-table th:nth-child(4),#devSettingsContent .dev-player-table td:nth-child(4){width:14%!important;text-align:center!important}
#devSettingsContent .selection-screen-col{white-space:normal!important;word-break:normal!important;overflow-wrap:normal!important;line-height:1.05!important}
#devSettingsContent .dev-player-table td:nth-child(4) .remove-player{margin:0 auto!important}

@media(max-width:430px){
  #devSettingsContent{padding-left:14px!important;padding-right:14px!important}
  #devSettingsContent .dev-settings-heading{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:10px!important;align-items:start!important}
  #devSettingsContent .dev-settings-heading>div{min-width:0}
  #devSettingsContent .dev-settings-heading h2{font-size:25px!important;line-height:1.05!important}
  #devSettingsContent .dev-settings-heading p{font-size:12px!important;line-height:1.35!important;margin-top:6px!important}
  #devSettingsContent .dev-add-player{min-width:0!important;width:auto!important;padding:9px 10px!important;font-size:10px!important;white-space:nowrap!important}
  #devSettingsContent .dev-player-table th{padding:8px 3px!important;font-size:8px!important;letter-spacing:.02em!important;text-align:left!important;line-height:1.05!important}
  #devSettingsContent .dev-player-table th:nth-child(2),#devSettingsContent .dev-player-table th:nth-child(3),#devSettingsContent .dev-player-table th:nth-child(4){text-align:center!important}
  #devSettingsContent .dev-player-table th:nth-child(1),#devSettingsContent .dev-player-table td:nth-child(1){width:59%!important}
  #devSettingsContent .dev-player-table th:nth-child(2),#devSettingsContent .dev-player-table td:nth-child(2){width:14%!important}
  #devSettingsContent .dev-player-table th:nth-child(3),#devSettingsContent .dev-player-table td:nth-child(3){width:17%!important}
  #devSettingsContent .dev-player-table th:nth-child(4),#devSettingsContent .dev-player-table td:nth-child(4){width:10%!important}
  #devSettingsContent .dev-player-table td{padding:7px 3px!important;height:58px!important;vertical-align:middle!important}
  #devSettingsContent .dev-player-table input.dev-player-name{width:100%!important;min-width:0!important;height:42px!important;min-height:42px!important;padding:6px 8px!important;font-size:14px!important;border-radius:10px!important}
  #devSettingsContent .dev-player-table input.dev-player-rating{width:100%!important;min-width:0!important;height:42px!important;min-height:42px!important;padding:4px 2px!important;font-size:14px!important;text-align:center!important;border-radius:10px!important}
  #devSettingsContent .selection-screen-col{font-size:7px!important;line-height:1.05!important}
  #devSettingsContent .selection-screen-cell{padding-left:1px!important;padding-right:1px!important}
  #devSettingsContent .selection-toggle{width:100%!important;display:flex!important;justify-content:center!important}
  #devSettingsContent .selection-toggle span{width:28px!important;height:28px!important;border-radius:8px!important}
  #devSettingsContent .dev-player-table .remove-player{width:28px!important;min-width:28px!important;max-width:28px!important;height:28px!important;min-height:28px!important;margin:0 auto!important;padding:0!important;border-radius:8px!important;display:grid!important;place-items:center!important}
  #devSettingsContent .dev-player-table .remove-player>span:first-child{display:inline!important;font-size:18px!important;line-height:1!important}
  #devSettingsContent .dev-player-table .remove-player .remove-label{display:none!important}
}

@media(max-width:380px){
  #devSettingsContent{padding-left:12px!important;padding-right:12px!important}
  #devSettingsContent .dev-player-table th:nth-child(1),#devSettingsContent .dev-player-table td:nth-child(1){width:58%!important}
  #devSettingsContent .dev-player-table th:nth-child(2),#devSettingsContent .dev-player-table td:nth-child(2){width:15%!important}
  #devSettingsContent .dev-player-table th:nth-child(3),#devSettingsContent .dev-player-table td:nth-child(3){width:17%!important}
  #devSettingsContent .dev-player-table th:nth-child(4),#devSettingsContent .dev-player-table td:nth-child(4){width:10%!important}
  #devSettingsContent .dev-player-table input.dev-player-name{font-size:13px!important;padding-left:7px!important;padding-right:7px!important}
  #devSettingsContent .dev-player-table input.dev-player-rating{font-size:13px!important}
  #devSettingsContent .selection-toggle span{width:27px!important;height:27px!important}
  #devSettingsContent .dev-player-table .remove-player{width:27px!important;min-width:27px!important;max-width:27px!important;height:27px!important;min-height:27px!important}
}


/* =========================================================
   v3.7.1 — Dev Settings rebuilt as an independent grid.
   It intentionally does not use .data-table / .table-wrap.
   ========================================================= */
html,body{max-width:100%;overflow-x:hidden!important}
#tab-devsettings,#devSettingsContent{max-width:100%;overflow-x:hidden!important}
#devSettingsContent{box-sizing:border-box}
.dev-player-editor{width:100%;max-width:100%;overflow:hidden;border:1px solid var(--line);border-radius:13px;background:#fff}
.dev-player-editor-head,.dev-player-row{display:grid;grid-template-columns:minmax(0,1fr) 64px 72px 40px;gap:8px;align-items:center;min-width:0;width:100%;box-sizing:border-box}
.dev-player-editor-head{padding:9px 10px;background:#f3f5f8;border-bottom:1px solid var(--line);color:var(--muted);font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.04em}
.dev-player-editor-head span:nth-child(n+2){text-align:center}
.dev-player-list{width:100%;min-width:0}
.dev-player-row{padding:8px 10px;border-bottom:1px solid #e7eaf0}
.dev-player-row:last-child{border-bottom:0}
.dev-player-row>*{min-width:0;box-sizing:border-box}
.dev-player-row .dev-player-name,.dev-player-row .dev-player-rating{width:100%;height:42px;min-height:42px;margin:0;padding:7px 9px;border-radius:10px;font-size:14px}
.dev-player-row .dev-player-rating{text-align:center;padding-left:3px;padding-right:3px}
.dev-player-row .selection-toggle{display:flex;justify-content:center;align-items:center;width:100%;height:42px}
.dev-player-row .selection-toggle input{position:absolute;opacity:0;pointer-events:none}
.dev-player-row .selection-toggle span{width:30px;height:30px;border:2px solid #cbd2de;border-radius:9px;background:#fff;display:grid;place-items:center}
.dev-player-row .selection-toggle input:checked+span{background:var(--ph-orange);border-color:var(--ph-orange)}
.dev-player-row .selection-toggle input:checked+span:after{content:"✓";color:#fff;font-size:18px;font-weight:900}
.dev-player-row .remove-player{width:34px!important;min-width:34px!important;max-width:34px!important;height:34px!important;min-height:34px!important;padding:0!important;margin:0 auto!important;border-radius:9px!important;display:grid!important;place-items:center!important;font-size:20px!important;line-height:1!important}
.dev-empty{padding:18px 12px;margin:0;text-align:center;color:var(--muted);font-size:12px}
@media(max-width:430px){
  #devSettingsContent{padding:12px!important}
  #devSettingsContent .dev-settings-heading{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:8px!important;align-items:start!important}
  #devSettingsContent .dev-settings-heading h2{font-size:25px!important;line-height:1.05!important}
  #devSettingsContent .dev-settings-heading p{font-size:12px!important;line-height:1.35!important;margin-top:6px!important}
  #devSettingsContent .dev-add-player{padding:9px 10px!important;font-size:10px!important;white-space:nowrap!important}
  .dev-player-editor-head,.dev-player-row{grid-template-columns:minmax(0,1fr) 52px 58px 34px;gap:6px}
  .dev-player-editor-head{padding:8px 7px;font-size:8px;letter-spacing:.02em}
  .dev-player-row{padding:7px}
  .dev-player-row .dev-player-name,.dev-player-row .dev-player-rating{height:40px;min-height:40px;font-size:13px}
  .dev-player-row .dev-player-name{padding:6px 7px}
  .dev-player-row .selection-toggle{height:40px}
  .dev-player-row .selection-toggle span{width:28px;height:28px}
  .dev-player-row .remove-player{width:30px!important;min-width:30px!important;max-width:30px!important;height:30px!important;min-height:30px!important;font-size:18px!important}
}
@media(max-width:360px){
  .dev-player-editor-head,.dev-player-row{grid-template-columns:minmax(0,1fr) 48px 54px 30px;gap:5px}
  .dev-player-editor-head{font-size:7px;padding-left:6px;padding-right:6px}
  .dev-player-row{padding-left:6px;padding-right:6px}
}


/* v3.7.1 — Dev Settings viewport containment + bottom actions */
html, body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden !important;
}

body,
.app-shell,
.tab-page,
#tab-devsettings,
#devSettingsContent {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.app-shell,
.tab-page,
#tab-devsettings,
#devSettingsContent {
  overflow-x: hidden !important;
}

#devSettingsContent .dev-player-editor,
#devSettingsContent .dev-player-list,
#devSettingsContent .dev-player-header,
#devSettingsContent .dev-player-row {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

#devSettingsContent .dev-player-editor {
  overflow: hidden !important;
}

#devSettingsContent .dev-player-row > *,
#devSettingsContent .dev-player-header > * {
  min-width: 0 !important;
  max-width: 100%;
  box-sizing: border-box;
}

#devSettingsContent .dev-bottom-actions {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  width: 100%;
  max-width: 100%;
  margin-top: 14px;
}

#devSettingsContent .dev-bottom-add {
  grid-column: 1;
  justify-self: start;
  width: auto !important;
  min-width: 0 !important;
  padding: 10px 14px !important;
  white-space: nowrap;
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
}

#devSettingsContent .dev-bottom-add span {
  font-size: 18px;
  line-height: 1;
}

#devSettingsContent .dev-bottom-save {
  grid-column: 3;
  justify-self: end;
  width: auto !important;
  min-width: 0 !important;
  padding-left: 18px !important;
  padding-right: 18px !important;
  white-space: normal;
}

@media (max-width: 430px) {
  #devSettingsContent {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  #devSettingsContent .dev-settings-heading {
    display: block !important;
  }

  #devSettingsContent .dev-player-header,
  #devSettingsContent .dev-player-row {
    grid-template-columns: minmax(0, 1fr) 52px 58px 34px !important;
    column-gap: 6px !important;
  }

  #devSettingsContent .dev-player-header,
  #devSettingsContent .dev-player-row {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  #devSettingsContent .dev-bottom-actions {
    grid-template-columns: auto minmax(8px, 1fr) auto;
    gap: 8px;
  }

  #devSettingsContent .dev-bottom-add {
    font-size: 13px !important;
    padding: 10px 12px !important;
  }

  #devSettingsContent .dev-bottom-save {
    font-size: 13px !important;
    padding: 10px 14px !important;
  }
}

@media (max-width: 380px) {
  #devSettingsContent {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  #devSettingsContent .dev-player-header,
  #devSettingsContent .dev-player-row {
    grid-template-columns: minmax(0, 1fr) 50px 54px 32px !important;
    column-gap: 5px !important;
  }

  #devSettingsContent .dev-bottom-add,
  #devSettingsContent .dev-bottom-save {
    font-size: 12px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
}

/* =========================================================
   v3.7.1 — eliminate root horizontal overflow on small iPhones
   Root cause: nowrap brand + fixed-width header tools exceeded viewport.
   ========================================================= */
html {
  width:100%;
  max-width:100%;
  overflow-x:hidden !important;
  overscroll-behavior-x:none;
}
body {
  width:100%;
  max-width:100%;
  overflow-x:hidden !important;
  overscroll-behavior-x:none;
  touch-action:pan-y;
}
.app-shell {
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:hidden !important;
  touch-action:pan-y;
}
.bottom-nav {
  max-width:100vw !important;
  overflow:hidden !important;
}
@media (max-width:430px) {
  .app-header {
    display:block !important;
    position:relative;
    width:100%;
    max-width:100%;
    min-width:0;
    min-height:142px;
    padding:8px 2px 8px !important;
    overflow:hidden;
  }
  .brand-block {
    display:block;
    width:100%;
    max-width:100%;
    min-width:0;
    padding-right:52px;
  }
  .brand-title {
    width:100%;
    max-width:100%;
    min-width:0;
    margin:0 !important;
    font-size:18px !important;
    line-height:1.05 !important;
    letter-spacing:-.45px !important;
    white-space:nowrap !important;
    overflow:hidden;
    text-overflow:clip;
  }
  .brand-bib {
    width:23px !important;
    height:27px !important;
    flex:0 0 23px !important;
  }
  .header-tools {
    position:absolute !important;
    top:4px;
    right:0;
    width:auto !important;
    max-width:118px;
    min-width:0;
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-end !important;
    gap:7px !important;
    padding:0 !important;
    margin:0 !important;
  }
  .header-tools .cog-button {
    width:38px !important;
    height:38px !important;
    flex:0 0 38px;
  }
  .access-statuses {
    max-width:118px;
    min-width:0;
  }
  .admin-status {
    max-width:118px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .tab-page,
  .panel,
  #tab-devsettings,
  #devSettingsContent,
  .dev-player-editor,
  .dev-player-list,
  .dev-player-header,
  .dev-player-row {
    max-width:100% !important;
    min-width:0 !important;
  }
}
@media (max-width:380px) {
  .brand-title { font-size:17px !important; }
  .brand-block { padding-right:48px; }
}


/* =========================================================
   v3.7.1 — true horizontal-pan lock + tighter app chrome
   ========================================================= */

/* iOS should only be able to pan the document vertically. */
html,
body,
.app-shell,
.app-header,
.tab-page,
.panel,
.bottom-nav,
button,
a,
input,
textarea,
select {
  overscroll-behavior-x: none !important;
  touch-action: pan-y !important;
}

/* Selection cards still receive horizontal pointer movement for the
   custom status swipe while the browser itself only pans vertically. */
.selection-player-card {
  touch-action: pan-y !important;
}

/* Keep the root viewport pinned to its own width. */
html,
body {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

body {
  position: relative;
}

.app-shell {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 920px !important;
  overflow-x: hidden !important;
}

/* Remove padding that had accumulated above and below every screen. */
@media (max-width: 700px) {
  :root {
    --nav-h: 60px;
  }

  .app-shell {
    padding-top: calc(env(safe-area-inset-top) + 2px) !important;
    padding-bottom: calc(var(--nav-h) + env(safe-area-inset-bottom) + 8px) !important;
  }

  .app-header {
    padding-top: 2px !important;
    padding-bottom: 4px !important;
  }

  .bottom-nav {
    height: calc(var(--nav-h) + env(safe-area-inset-bottom)) !important;
    padding-top: 3px !important;
    padding-bottom: env(safe-area-inset-bottom) !important;
  }

  .bottom-nav .tab {
    min-height: 50px;
    padding-top: 3px !important;
    padding-bottom: 3px !important;
    gap: 1px !important;
  }

  .bottom-nav .tab svg,
  .bottom-nav .tab .person-nav-icon {
    width: 19px !important;
    height: 19px !important;
  }
}

/* Compact header on iPhone-sized screens without sacrificing the title. */
@media (max-width: 430px) {
  .app-header {
    min-height: 103px !important;
    padding: 2px 2px 3px !important;
  }

  .brand-block {
    padding-top: 1px !important;
  }

  .brand-title {
    font-size: 18px !important;
  }

  .header-tools {
    top: 0 !important;
    gap: 4px !important;
  }

  .access-statuses {
    margin-top: 2px !important;
    gap: 3px !important;
  }

  .admin-status {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
  }

  .cog-button {
    width: 36px !important;
    height: 36px !important;
  }
}

@media (max-width: 380px) {
  .app-header {
    min-height: 101px !important;
  }

  .brand-title {
    font-size: 17px !important;
  }

  .bottom-nav .tab {
    font-size: 8.5px !important;
  }
}


/* =========================================================
   v3.7.1 — PHooty branding + tighter bottom navigation
   ========================================================= */

/* Header branding */
.brand-title{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0;
  white-space:nowrap;
  letter-spacing:-.7px;
}
.brand-name{
  display:inline-flex;
  align-items:baseline;
  min-width:0;
  color:#fff;
  font-weight:850;
}
.brand-ph{
  color:var(--ph-orange,#ff7a1a);
}
.brand-bib{
  width:31px;
  height:36px;
}

/* Splash branding */
.splash-title{
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.splash-title strong{
  font-style:normal;
  font-size:48px;
  line-height:1;
  font-weight:850;
  letter-spacing:-1.5px;
  color:#fff;
}
.splash-title strong em{
  font-style:normal;
  color:var(--ph-orange,#ff7a1a);
}

/* Mobile title: larger again, now that the shorter name gives us room */
@media(max-width:700px){
  .brand-title{
    font-size:22px !important;
  }
}

@media(max-width:430px){
  .brand-title{
    font-size:21px !important;
  }
  .brand-bib{
    width:30px;
    height:35px;
  }
}

@media(max-width:380px){
  .brand-title{
    font-size:20px !important;
  }
}

/* Bottom nav: remove excess dead space while respecting Home indicator */
@media(max-width:700px){
  :root{
    --nav-h:54px;
  }

  .app-shell{
    padding-bottom:calc(var(--nav-h) + env(safe-area-inset-bottom) + 3px) !important;
  }

  .bottom-nav{
    height:calc(var(--nav-h) + env(safe-area-inset-bottom)) !important;
    min-height:0 !important;
    padding-top:2px !important;
    padding-bottom:max(2px,env(safe-area-inset-bottom)) !important;
    align-items:start !important;
  }

  .bottom-nav .tab{
    min-height:46px !important;
    height:46px !important;
    padding-top:2px !important;
    padding-bottom:1px !important;
    gap:0 !important;
  }

  .bottom-nav .tab svg,
  .bottom-nav .tab .person-nav-icon{
    width:18px !important;
    height:18px !important;
  }

  .bottom-nav .tab span:last-child{
    line-height:1.05 !important;
  }
}


/* =========================================================
   v3.7.1 — The PHooty App branding + real chrome compaction
   ========================================================= */

/* Bigger, correctly named header */
.brand-title{
  gap:10px !important;
}
.brand-name{
  display:inline-flex !important;
  align-items:baseline;
  color:#fff;
  font-weight:850;
}
.brand-ph{
  color:var(--ph-orange,#ff7a1a) !important;
}

/* Correct splash wording: The PHooty App, only PH orange */
.splash-title strong{
  display:inline-flex;
  align-items:baseline;
  color:#fff;
}
.splash-title strong em{
  color:var(--ph-orange,#ff7a1a);
  font-style:normal;
}

/* The old header minimum height was leaving a visible gap after the
   access pills. Size it to the actual controls instead. */
@media(max-width:700px){
  .app-header{
    min-height:92px !important;
    padding-top:2px !important;
    padding-bottom:0 !important;
  }

  .brand-title{
    font-size:25px !important;
    line-height:1 !important;
    letter-spacing:-.75px !important;
  }

  .brand-bib{
    width:34px !important;
    height:39px !important;
    flex:0 0 34px !important;
  }

  .header-tools{
    top:0 !important;
    gap:3px !important;
  }

  .header-tools .cog-button,
  .cog-button{
    width:38px !important;
    height:38px !important;
  }

  .access-statuses{
    margin-top:1px !important;
    gap:3px !important;
  }

  .admin-status{
    padding:4px 8px !important;
  }

  /* The page panel should follow the compact header immediately. */
  .tab-page > .panel:first-child{
    margin-top:5px !important;
  }
}

@media(max-width:430px){
  .app-header{
    min-height:90px !important;
  }

  .brand-block{
    padding-right:126px !important;
  }

  .brand-title{
    font-size:24px !important;
  }

  .brand-bib{
    width:32px !important;
    height:37px !important;
    flex-basis:32px !important;
  }
}

@media(max-width:380px){
  .app-header{
    min-height:88px !important;
  }

  .brand-title{
    font-size:23px !important;
  }
}

/* Bottom nav:
   keep normal-sized icons/labels, but stop dedicating the entire iOS
   safe area to blank space beneath them. We still retain clearance
   above the Home indicator. */
@media(max-width:700px){
  :root{
    --nav-content-h:58px;
  }

  .app-shell{
    padding-bottom:calc(
      var(--nav-content-h) +
      max(10px, calc(env(safe-area-inset-bottom) - 18px)) +
      3px
    ) !important;
  }

  .bottom-nav{
    height:calc(
      var(--nav-content-h) +
      max(10px, calc(env(safe-area-inset-bottom) - 18px))
    ) !important;
    min-height:0 !important;
    padding:3px max(8px,env(safe-area-inset-left))
      max(7px,calc(env(safe-area-inset-bottom) - 18px))
      max(8px,env(safe-area-inset-right)) !important;
    align-items:center !important;
  }

  .bottom-nav .tab{
    height:52px !important;
    min-height:52px !important;
    padding:3px 2px 2px !important;
    gap:2px !important;
    font-size:9.5px !important;
    justify-content:center !important;
  }

  .bottom-nav .tab svg,
  .bottom-nav .tab .person-nav-icon{
    width:22px !important;
    height:22px !important;
  }

  .bottom-nav .tab span:last-child{
    line-height:1.1 !important;
  }
}

@media(max-width:380px){
  .bottom-nav .tab{
    font-size:9px !important;
  }

  .bottom-nav .tab svg,
  .bottom-nav .tab .person-nav-icon{
    width:21px !important;
    height:21px !important;
  }
}


/* =========================================================
   v3.7.1 — Player/Admin/Super role shell
   ========================================================= */

/* Long-press admin entry: visually still just the orange bib. */
.brand-login-trigger{
  appearance:none;
  -webkit-appearance:none;
  border:0 !important;
  padding:0 !important;
  margin:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  cursor:default;
  position:relative;
  overflow:visible;
  -webkit-touch-callout:none;
  user-select:none;
  -webkit-user-select:none;
}
.brand-login-trigger::after{
  content:"";
  position:absolute;
  inset:-6px;
  border:2px solid transparent;
  border-radius:12px;
  pointer-events:none;
  transition:border-color .15s ease,transform 3s linear;
}
.brand-login-trigger.admin-hold-active::after{
  border-color:rgba(255,122,26,.72);
  transform:scale(1.08);
}

/* With no status lozenges, the header can be genuinely compact. */
.app-header{
  min-height:68px !important;
}
.header-tools{
  align-self:flex-start;
}
.header-tools:has(.cog-button.hidden){
  display:none !important;
}

/* Public player navigation is deliberately only two equal tabs. */
.bottom-nav.player-nav{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
}
.bottom-nav .tab[hidden]{
  display:none !important;
}

/* Admin Login modal */
#adminLoginDialog h2{
  margin-right:34px;
}

/* Player mode never exposes private operational sections by accidental CSS. */
body[data-role="player"] #tab-selection,
body[data-role="player"] #tab-randomiser,
body[data-role="player"] #tab-financials,
body[data-role="player"] #tab-devsettings{
  display:none !important;
}

/* Admin can operate everything except Dev Settings. */
body[data-role="admin"] #devSettingsCog,
body[data-role="admin"] #tab-devsettings{
  display:none !important;
}

/* Super user gets the settings cog. */
body[data-role="super"] #devSettingsCog{
  display:grid !important;
}

@media(max-width:700px){
  .app-header{
    min-height:64px !important;
    padding-bottom:3px !important;
  }

  body[data-role="player"] .brand-block,
  body[data-role="admin"] .brand-block{
    padding-right:0 !important;
  }

  body[data-role="super"] .brand-block{
    padding-right:54px !important;
  }

  .bottom-nav.player-nav .tab{
    font-size:11px !important;
  }

  .bottom-nav.player-nav .tab svg{
    width:24px !important;
    height:24px !important;
  }
}

@media(max-width:430px){
  .app-header{
    min-height:62px !important;
  }
}


/* =========================================================
   v3.7.1 — salutation, logout, history copy, native text behaviour
   ========================================================= */

/* App chrome/labels are not selectable. Text entry fields remain normal. */
body,
button,a,label,span,div,section,article,nav,header,footer,
h1,h2,h3,h4,h5,h6,p,li,th,td,summary,svg{
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
}

input,
textarea,
[contenteditable="true"]{
  -webkit-user-select:text !important;
  user-select:text !important;
  -webkit-touch-callout:default !important;
}

.admin-salutation{
  margin-top:5px;
  margin-left:44px;
  color:var(--ph-orange,#ff7a1a);
  font-size:15px;
  font-weight:700;
  line-height:1.1;
}

.header-tools{
  display:flex !important;
  flex-direction:column;
  align-items:center;
  gap:5px !important;
}

.admin-logout-btn{
  width:34px;
  height:34px;
  min-height:34px;
  border:0;
  padding:0;
  border-radius:50%;
  background:var(--ph-orange,#ff7a1a);
  color:#fff;
  display:grid;
  place-items:center;
  box-shadow:0 4px 12px rgba(255,122,26,.25);
}
.admin-logout-btn svg{width:21px;height:21px}
.admin-logout-btn:active{transform:scale(.93)}

body[data-role="player"] .header-tools{display:none !important}

.history-item{position:relative}
.history-copy-btn{
  position:absolute;
  top:10px;
  right:10px;
  width:34px;
  height:34px;
  min-height:34px;
  padding:0;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--card,#fff);
  color:var(--text);
  display:grid;
  place-items:center;
  font-size:17px;
  font-weight:800;
  z-index:2;
}
.history-copy-btn:active{transform:scale(.94)}
.history-item .history-meta{padding-right:42px}

@media(max-width:430px){
  .admin-salutation{
    margin-left:42px;
    margin-top:3px;
    font-size:14px;
  }

  body[data-role="admin"] .app-header,
  body[data-role="super"] .app-header{
    min-height:82px !important;
  }

  .admin-logout-btn{
    width:32px;
    height:32px;
    min-height:32px;
  }
  .admin-logout-btn svg{width:20px;height:20px}

  .history-copy-btn{
    width:32px;
    height:32px;
    min-height:32px;
    font-size:16px;
  }
}


/* =========================================================
   v3.7.1 — admin logout visibility + History copy polish
   ========================================================= */

/* The old role-shell rule hid the whole tools stack when the cog was hidden.
   Admin still needs Logout even though Dev Settings is unavailable. */
.header-tools:has(.cog-button.hidden){
  display:flex !important;
}
body[data-role="player"] .header-tools{
  display:none !important;
}

/* Logout is an icon with a readable label underneath. */
.admin-logout-btn{
  width:auto !important;
  height:auto !important;
  min-height:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  padding:0 !important;
  display:flex !important;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:2px;
  color:#fff;
}
.admin-logout-btn.hidden{
  display:none !important;
}
.admin-logout-icon{
  width:34px;
  height:34px;
  border-radius:50%;
  background:var(--ph-orange,#ff7a1a);
  display:grid;
  place-items:center;
  box-shadow:0 4px 12px rgba(255,122,26,.25);
}
.admin-logout-icon svg{
  width:21px;
  height:21px;
}
.admin-logout-label{
  font-size:9px;
  line-height:1;
  font-weight:800;
  color:#dbe3f1;
}

/* Winner/result pill stays in the original top metadata row. */
.history-item .history-meta{
  padding-right:0 !important;
}

/* Copy now lives at the bottom-right of each record. */
.history-copy-row{
  display:flex;
  justify-content:flex-end;
  margin-top:8px;
}
.history-copy-btn{
  position:static !important;
  width:auto !important;
  height:34px !important;
  min-height:34px !important;
  padding:0 10px !important;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--card,#fff);
  color:var(--text);
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  gap:6px;
  font-size:11px !important;
  font-weight:800;
  transition:transform .14s ease,background .18s ease,color .18s ease,border-color .18s ease;
}
.history-copy-symbol{
  font-size:16px;
  line-height:1;
}
.history-copy-label{
  font-size:10px;
  white-space:nowrap;
}
.history-copy-btn.copied{
  min-width:76px;
  background:#159447 !important;
  border-color:#159447 !important;
  color:#fff !important;
}
.history-copy-btn.copied .history-copy-symbol{
  font-size:19px;
}
.history-copy-btn:active{
  transform:scale(.95);
}

@media(max-width:430px){
  .admin-logout-icon{
    width:32px;
    height:32px;
  }
  .admin-logout-icon svg{
    width:20px;
    height:20px;
  }
  .admin-logout-label{
    font-size:8.5px;
  }

  .history-copy-btn{
    height:32px !important;
    min-height:32px !important;
    padding:0 9px !important;
  }
}


/* =========================================================
   v3.7.1 — door logout, inline History copy, stable bottom nav
   ========================================================= */
.admin-logout-btn{overflow:visible !important}
.admin-logout-icon{width:34px !important;height:34px !important}
.admin-logout-label{
  display:block !important;
  width:max-content;
  max-width:none !important;
  overflow:visible !important;
  white-space:nowrap !important;
  line-height:1.1 !important;
  margin-top:1px;
}

.history-actions{
  display:flex !important;
  align-items:center;
  gap:6px !important;
  margin-top:8px;
}
.history-actions .secondary,
.history-actions .danger{flex:0 1 auto !important}
.history-actions-player{justify-content:flex-end}
.history-copy-row{display:none !important}
.history-copy-btn{
  position:static !important;
  width:36px !important;
  min-width:36px !important;
  max-width:36px !important;
  height:34px !important;
  min-height:34px !important;
  padding:0 !important;
  flex:0 0 36px !important;
  border:1px solid var(--line);
  border-radius:10px;
  display:grid !important;
  place-items:center;
  background:var(--card,#fff);
}
.history-copy-symbol{font-size:17px !important;line-height:1}
.history-copy-label{display:none !important}
.history-copy-btn.copied{
  width:36px !important;
  min-width:36px !important;
  max-width:36px !important;
  background:#159447 !important;
  border-color:#159447 !important;
  color:#fff !important;
}

/* Stable viewport anchoring for bottom nav */
html,body,.app-shell{
  transform:none !important;
  perspective:none !important;
  filter:none !important;
}
.bottom-nav{
  position:fixed !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  top:auto !important;
  width:100vw !important;
  max-width:100vw !important;
  margin:0 !important;
  transform:none !important;
  z-index:9999 !important;
  box-sizing:border-box !important;
  contain:layout paint style;
}
@media(max-width:700px){
  .app-shell{
    padding-bottom:calc(
      var(--nav-content-h,58px) +
      max(10px, calc(env(safe-area-inset-bottom) - 18px)) +
      8px
    ) !important;
  }
}
@media(max-width:430px){
  .history-actions{gap:5px !important}
  .history-actions .secondary,
  .history-actions .danger{
    font-size:10px !important;
    padding:6px 8px !important;
  }
  .history-copy-btn{
    width:34px !important;
    min-width:34px !important;
    max-width:34px !important;
    flex-basis:34px !important;
    height:32px !important;
    min-height:32px !important;
  }
  .admin-logout-label{font-size:8.5px !important}
}


/* =========================================================
   v3.7.1 — final History copy placement + icon-only logout
   ========================================================= */

/* Logout: icon only. */
.admin-logout-btn{
  width:34px !important;
  height:34px !important;
  min-height:34px !important;
  border-radius:50% !important;
  background:var(--ph-orange,#ff7a1a) !important;
  display:grid !important;
  place-items:center !important;
  padding:0 !important;
  box-shadow:0 4px 12px rgba(255,122,26,.25) !important;
  overflow:hidden !important;
}
.admin-logout-btn.hidden{
  display:none !important;
}
.admin-logout-icon{
  width:34px !important;
  height:34px !important;
  border-radius:50% !important;
  background:transparent !important;
  display:grid !important;
  place-items:center !important;
  box-shadow:none !important;
}
.admin-logout-icon svg{
  width:21px !important;
  height:21px !important;
}
.admin-logout-label{
  display:none !important;
}

/* History footer: edit/delete left, copy pinned right. */
.history-footer-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-top:8px;
  width:100%;
}
.history-footer-row .history-actions{
  display:flex !important;
  gap:6px !important;
  margin-top:0 !important;
  flex:0 1 auto;
}
.history-footer-row .history-copy-btn{
  margin-left:auto !important;
  flex:0 0 36px !important;
  width:36px !important;
  min-width:36px !important;
  max-width:36px !important;
}
.history-actions-player{
  display:none !important;
}

/* In public Player View, the copy icon still sits bottom-right. */
body[data-role="player"] .history-footer-row{
  justify-content:flex-end;
}

@media(max-width:430px){
  .history-footer-row{
    gap:6px;
  }
  .history-footer-row .history-actions{
    gap:5px !important;
  }
  .history-footer-row .history-copy-btn{
    flex-basis:34px !important;
    width:34px !important;
    min-width:34px !important;
    max-width:34px !important;
  }
  .admin-logout-btn,
  .admin-logout-icon{
    width:32px !important;
    height:32px !important;
    min-height:32px !important;
  }
}


/* =========================================================
   v3.7.1 — Variable PHees
   ========================================================= */
.phees-open-btn{white-space:nowrap}
.financials-table{table-layout:fixed!important;min-width:0!important}
.financials-table th:nth-child(1),.financials-table td:nth-child(1){width:34%;text-align:left}
.financials-table th:nth-child(2),.financials-table td:nth-child(2){width:12%}
.financials-table th:nth-child(3),.financials-table td:nth-child(3){width:30%;text-align:left}
.financials-table th:nth-child(4),.financials-table td:nth-child(4){width:24%}
.dates-played{font-variant-numeric:tabular-nums;white-space:nowrap}

.phees-sheet{
  width:min(560px,calc(100% - 18px));
  max-width:none;
  border-radius:22px 22px 0 0!important;
  margin:auto auto 0!important;
  padding:0!important;
}
.phees-sheet::backdrop{background:rgba(4,9,20,.62)}
.phees-sheet form{padding:18px}
.sheet-handle{width:42px;height:5px;border-radius:99px;background:#c5cad4;margin:0 auto 14px}
.phees-list{display:flex;flex-direction:column;gap:8px;margin:14px 0}
.phee-rate-row{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:12px;border:1px solid var(--line);border-radius:12px;background:#f7f8fb
}
.phee-rate-row>div:first-child{display:flex;flex-direction:column;gap:2px}
.phee-rate-row strong{font-size:17px}
.phee-rate-row span{font-size:11px;color:var(--muted)}
.phee-rate-actions{display:flex;align-items:center;gap:6px}
.phee-rate-actions .icon-button{width:34px;height:34px;min-height:34px}
.phee-lock{font-size:18px!important;color:var(--muted)!important}
.phees-sheet-actions{display:grid;gap:8px;margin-top:16px}
.info-note{padding:10px;border-radius:10px;background:#eef4ff;color:#3f5f95!important}
.phee-delete-summary{display:flex;flex-direction:column;gap:3px;padding:13px;border-radius:12px;background:#fff0f1;color:#b4232f;margin:12px 0}
.phee-delete-summary strong{font-size:19px}
.phee-delete-summary span{font-size:11px}

@media(max-width:430px){
  .financials-table th,.financials-table td{padding:7px 5px!important;font-size:10px!important}
  .financials-table th{font-size:8px!important}
  .financials-table th:nth-child(1),.financials-table td:nth-child(1){width:33%}
  .financials-table th:nth-child(2),.financials-table td:nth-child(2){width:11%}
  .financials-table th:nth-child(3),.financials-table td:nth-child(3){width:32%}
  .financials-table th:nth-child(4),.financials-table td:nth-child(4){width:24%}
  .dates-played{font-size:9.5px!important}
  .phees-sheet{width:100%;border-radius:20px 20px 0 0!important}
  .phees-sheet form{padding:16px}
}


/* =========================================================
   v3.7.1 — Financials responsive polish
   ========================================================= */

/* PHees CTA — orange, compact, top-right */
.financial-heading{
  align-items:flex-start !important;
  gap:12px !important;
}
.financial-heading > div:first-child{
  min-width:0;
}
.phees-open-btn{
  flex:0 0 auto;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:0 !important;
  border-radius:14px !important;
  background:var(--ph-orange,#ff7a1a) !important;
  color:#fff !important;
  min-height:42px !important;
  padding:9px 13px !important;
  font-weight:850 !important;
  font-size:13px !important;
  box-shadow:0 6px 16px rgba(255,122,26,.20);
}
.phees-open-btn svg{
  width:20px;
  height:20px;
  flex:0 0 20px;
}
.phees-open-btn:active{
  transform:scale(.96);
}

/* Let content decide the column sizes. */
.financials-wrap{
  overflow-x:hidden !important;
}
.financials-table{
  width:100% !important;
  min-width:0 !important;
  table-layout:auto !important;
  border-collapse:collapse;
}

/* Reset old rigid percentages. */
.financials-table th,
.financials-table td{
  width:auto !important;
  max-width:none !important;
  box-sizing:border-box;
}

/* Player gets remaining room; compact numeric columns stay compact. */
.financials-table th:nth-child(1),
.financials-table td:nth-child(1){
  text-align:left !important;
  white-space:nowrap;
}
.financials-table th:nth-child(2),
.financials-table td:nth-child(2){
  text-align:center !important;
  white-space:nowrap;
  width:1% !important;
}
.financials-table th:nth-child(3),
.financials-table td:nth-child(3){
  text-align:left !important;
  white-space:nowrap;
  width:1% !important;
}
.financials-table th:nth-child(4),
.financials-table td:nth-child(4){
  text-align:right !important;
  white-space:nowrap;
  width:1% !important;
}

.financials-table td{
  font-size:clamp(12px,2.8vw,16px) !important;
  line-height:1.2 !important;
  padding:9px 10px !important;
}
.financials-table th{
  font-size:clamp(9px,2.1vw,12px) !important;
  line-height:1.1 !important;
  padding:9px 10px !important;
}
.financials-table tfoot th{
  font-size:clamp(11px,2.5vw,14px) !important;
}

.financials-table .dates-played{
  font-size:clamp(11px,2.45vw,14px) !important;
  letter-spacing:-.1px;
  font-variant-numeric:tabular-nums;
}

/* On the narrowest phones, reduce padding before reducing type size. */
@media(max-width:430px){
  .financial-heading{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    align-items:start !important;
  }

  .phees-open-btn{
    min-height:40px !important;
    padding:8px 11px !important;
    font-size:12px !important;
    border-radius:13px !important;
  }
  .phees-open-btn svg{
    width:18px;
    height:18px;
  }

  .financials-table th,
  .financials-table td{
    padding-left:6px !important;
    padding-right:6px !important;
  }

  .financials-table td{
    font-size:13px !important;
  }
  .financials-table th{
    font-size:9px !important;
  }
  .financials-table .dates-played{
    font-size:12px !important;
  }
}

@media(min-width:600px){
  .financials-table td{
    font-size:15px !important;
  }
  .financials-table th{
    font-size:11px !important;
  }
  .financials-table .dates-played{
    font-size:14px !important;
  }
}


/* =========================================================
   v3.7.2 — Rankings: last-five Form
   ========================================================= */
.rankings-table .form-head,
.rankings-table .form-cell{
  text-align:center !important;
  white-space:nowrap;
  width:1% !important;
}
.form-dots{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:3px;
  min-width:10px;
  vertical-align:middle;
}
.form-dot{
  display:block;
  width:8px;
  height:8px;
  flex:0 0 8px;
  border-radius:50%;
  box-shadow:inset 0 0 0 1px rgba(15,23,42,.08);
}
.form-w{ background:#34a853; }
.form-d{ background:#aab2bf; }
.form-l{ background:#e5484d; }

/* Preserve player-name space on small phones. */
@media(max-width:430px){
  .rankings-table th,
  .rankings-table td{
    padding-left:4px !important;
    padding-right:4px !important;
  }
  .rankings-table .form-head{
    font-size:8px !important;
  }
  .form-dots{ gap:2px; }
  .form-dot{
    width:6px;
    height:6px;
    flex-basis:6px;
  }
}
@media(min-width:600px){
  .form-dot{
    width:9px;
    height:9px;
    flex-basis:9px;
  }
}


/* =========================================================
   v3.7.3 — Rankings mobile layout: remove Win %, preserve Form
   ========================================================= */
.rankings-table{
  table-layout:fixed !important;
  width:100% !important;
  min-width:0 !important;
}
.rankings-table th,
.rankings-table td{
  box-sizing:border-box;
}

/* # | Player | Apps | W | D | L | GS | Form | Pts */
.rankings-table th:nth-child(1),
.rankings-table td:nth-child(1){width:6% !important}
.rankings-table th:nth-child(2),
.rankings-table td:nth-child(2){width:31% !important;text-align:left !important}
.rankings-table th:nth-child(3),
.rankings-table td:nth-child(3){width:10% !important}
.rankings-table th:nth-child(4),
.rankings-table td:nth-child(4),
.rankings-table th:nth-child(5),
.rankings-table td:nth-child(5),
.rankings-table th:nth-child(6),
.rankings-table td:nth-child(6),
.rankings-table th:nth-child(7),
.rankings-table td:nth-child(7){width:7% !important}
.rankings-table th:nth-child(8),
.rankings-table td:nth-child(8){width:20% !important}
.rankings-table th:nth-child(9),
.rankings-table td:nth-child(9){width:5% !important}

.rankings-table .form-head,
.rankings-table .form-cell{
  text-align:center !important;
  white-space:nowrap;
}
.form-dots{
  width:100%;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:4px;
}
.form-dot{
  width:8px !important;
  height:8px !important;
  flex:0 0 8px !important;
}

@media(max-width:430px){
  .rankings-table th{
    font-size:8.5px !important;
    padding-left:2px !important;
    padding-right:2px !important;
  }
  .rankings-table td{
    font-size:11px !important;
    padding-left:3px !important;
    padding-right:3px !important;
  }
  .rankings-table th:nth-child(2),
  .rankings-table td:nth-child(2){
    font-size:12px !important;
  }
  .form-dots{gap:3px}
  .form-dot{
    width:7px !important;
    height:7px !important;
    flex-basis:7px !important;
  }
}

@media(min-width:600px){
  .rankings-table td{font-size:14px !important}
  .rankings-table th{font-size:10px !important}
  .rankings-table th:nth-child(2),
  .rankings-table td:nth-child(2){font-size:15px !important}
  .form-dot{
    width:9px !important;
    height:9px !important;
    flex-basis:9px !important;
  }
}


/* =========================================================
   v3.7.4 — Rankings PTS visibility fix
   ========================================================= */

/* Rebalance the 9-column table so PTS has guaranteed room.
   # | Player | Apps | W | D | L | GS | Form | Pts */
.rankings-table th:nth-child(1),
.rankings-table td:nth-child(1){width:6% !important}

.rankings-table th:nth-child(2),
.rankings-table td:nth-child(2){width:29% !important}

.rankings-table th:nth-child(3),
.rankings-table td:nth-child(3){width:9% !important}

.rankings-table th:nth-child(4),
.rankings-table td:nth-child(4),
.rankings-table th:nth-child(5),
.rankings-table td:nth-child(5),
.rankings-table th:nth-child(6),
.rankings-table td:nth-child(6),
.rankings-table th:nth-child(7),
.rankings-table td:nth-child(7){width:6.5% !important}

.rankings-table th:nth-child(8),
.rankings-table td:nth-child(8){width:19% !important}

.rankings-table th:nth-child(9),
.rankings-table td:nth-child(9){
  width:11% !important;
  min-width:0 !important;
  text-align:center !important;
  white-space:nowrap !important;
}

/* Make sure cell padding never steals the PTS column. */
.rankings-table th,
.rankings-table td{
  overflow:hidden;
  text-overflow:ellipsis;
}
.rankings-table th:nth-child(9),
.rankings-table td:nth-child(9){
  overflow:visible !important;
  text-overflow:clip !important;
}

@media(max-width:430px){
  .rankings-table th,
  .rankings-table td{
    padding-left:2px !important;
    padding-right:2px !important;
  }

  .rankings-table th:nth-child(2),
  .rankings-table td:nth-child(2){
    font-size:11.5px !important;
  }

  .rankings-table th:nth-child(9){
    font-size:8px !important;
  }

  .rankings-table td:nth-child(9){
    font-size:12px !important;
    font-weight:800 !important;
  }

  .form-dots{gap:2px !important}
  .form-dot{
    width:6.5px !important;
    height:6.5px !important;
    flex-basis:6.5px !important;
  }
}


/* =========================================================
   v3.10.5 — Matches, editable dates, independent scorers,
             resilient Financials table
   ========================================================= */
.bottom-nav .tab .pitch-nav-icon{
  width:21px !important;
  height:21px !important;
  overflow:visible;
}

.edit-match-date-field{
  display:block;
  margin:4px 34px 12px 0;
}
.edit-match-date-field > span{
  display:block;
  font-size:11px;
  font-weight:800;
  margin-bottom:5px;
}
.edit-match-date-field input{
  width:100%;
  min-height:42px;
}

.financials-wrap{
  width:100%;
  overflow:hidden !important;
}
.financials-table{
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  table-layout:fixed !important;
}
.financials-table th,
.financials-table td{
  min-width:0 !important;
  box-sizing:border-box !important;
}
.financials-table th:nth-child(1),
.financials-table td:nth-child(1){width:25% !important}
.financials-table th:nth-child(2),
.financials-table td:nth-child(2){width:10% !important;text-align:center !important}
.financials-table th:nth-child(3),
.financials-table td:nth-child(3){width:47% !important}
.financials-table th:nth-child(4),
.financials-table td:nth-child(4){
  width:18% !important;
  text-align:right !important;
  overflow:visible !important;
  white-space:nowrap !important;
}
.financial-player{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.phee-value,
.phee-value strong{white-space:nowrap !important}
.dates-played{
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:clip !important;
  font-variant-numeric:tabular-nums;
  letter-spacing:-.15px;
}
.dates-density-1{font-size:13px !important}
.dates-density-2{font-size:11.5px !important}
.dates-density-3{font-size:10px !important;letter-spacing:-.35px}
.dates-density-4{font-size:8.5px !important;letter-spacing:-.55px}

@media(max-width:430px){
  .financials-table th,
  .financials-table td{
    padding-left:4px !important;
    padding-right:4px !important;
  }
  .financials-table th:nth-child(1),
  .financials-table td:nth-child(1){width:24% !important}
  .financials-table th:nth-child(2),
  .financials-table td:nth-child(2){width:10% !important}
  .financials-table th:nth-child(3),
  .financials-table td:nth-child(3){width:48% !important}
  .financials-table th:nth-child(4),
  .financials-table td:nth-child(4){width:18% !important}

  .financial-player{font-size:11px !important}
  .phee-value{font-size:12.5px !important}
  .dates-density-1{font-size:12px !important}
  .dates-density-2{font-size:10.5px !important}
  .dates-density-3{font-size:9px !important}
  .dates-density-4{font-size:7.8px !important}
}


/* =========================================================
   v3.10.5 — Oranges vs Blues identity + match editor polish
   ========================================================= */
:root{
  --team-orange:#f97316;--team-orange-deep:#c2410c;--team-blue:#55c8f5;
}
#resultsSection .team-card{border:1px solid transparent;box-shadow:none!important}
#resultsSection .team-card-orange{background:linear-gradient(180deg,#fff0e7,#fff8f4)!important;border-color:#ffd6bd!important}
#resultsSection .team-card-blue{background:linear-gradient(180deg,#eaf4ff,#f5faff)!important;border-color:#c9e1ff!important}
#resultsSection .team-card-orange .team-top h3{color:var(--team-orange-deep)!important}
#resultsSection .team-card-blue .team-top h3{color:var(--team-blue)!important}
#resultsSection .team-top{border-bottom:0!important;padding-bottom:6px!important}
#resultsSection .team-top .score{background:#e5e9ef!important;color:#455164!important;padding:5px 7px!important}
#resultsSection .team-card li{background:rgba(255,255,255,.86)!important}

.history-item{background:#fbfcff}
.history-meta{align-items:center}
.history-meta>span:first-child{font-size:11px}
.result-pill{padding:4px 8px!important;font-size:9.5px!important}
.result-pill.result-orange{background:var(--team-orange)!important;color:#fff!important}
.result-pill.result-blue{background:var(--team-blue)!important;color:#fff!important}
.result-pill.result-neutral{background:#e8ecf3!important;color:#374151!important}
.history-scoreline{gap:8px!important}
.orange-name{color:var(--team-orange-deep)}
.blue-name{color:var(--team-blue)}
.history-team{border:1px solid transparent;padding:9px!important}
.history-team-orange{background:linear-gradient(180deg,#ffede2,#fff6f1)!important;border-color:#ffd8c0!important}
.history-team-blue{background:linear-gradient(180deg,#e7f2ff,#f2f8ff)!important;border-color:#c9e1ff!important}
.history-team-head{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:6px}
.history-team-head strong{margin:0!important;font-size:13px!important}
.history-team-orange .history-team-head strong{color:var(--team-orange-deep)}
.history-team-blue .history-team-head strong{color:var(--team-blue)}
.mcbrs-pill{flex:0 0 auto;border-radius:999px;background:rgba(120,130,150,.13);color:#586273;padding:3px 6px;font-size:8.5px;font-weight:850;white-space:nowrap}
.history-scorer-row{background:rgba(255,255,255,.78)!important}

.edit-match-date-field{margin:4px 34px 10px 0!important}
.edit-match-date-control{position:relative;display:grid;grid-template-columns:18px minmax(0,1fr) auto;align-items:center;gap:8px;min-height:40px;border:1px solid var(--line);border-radius:11px;background:#fff;padding:7px 10px;overflow:hidden;font-size:13px}
.edit-match-date-control svg{width:17px;height:17px;color:#526071}
.edit-match-date-control #editMatchDateDisplay{display:block;margin:0;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.edit-match-date-control .date-chevron{font-size:16px;line-height:1;color:#536072}
.edit-match-date-control input{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;opacity:0!important;cursor:pointer;padding:0!important;border:0!important}

#editTeam1Name,#editTeam2Name{text-align:center!important;font-weight:650}

#historyEditDialog .score-editor{max-width:430px!important;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)!important;gap:8px!important;margin:10px auto 4px!important;align-items:end!important}
.team-score-control{min-width:0}
.team-score-label{display:block;font-size:10px;font-weight:850;margin-bottom:5px}
.team-score-stepper{display:grid;grid-template-columns:30px 38px 30px;gap:5px;justify-content:center;align-items:center}
.team-score-stepper button{width:30px!important;height:32px!important;min-height:32px!important;padding:0!important;border-radius:9px!important;font-size:18px!important;color:#1684eb!important}
.team-score-ball{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;border:1px solid #d6dde8;background:#fff;color:#111827;font-size:18px;font-weight:650}
#historyEditDialog .score-dash{padding-bottom:7px!important}
.score-note-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:2px 0 0}
.score-note-row p{margin:0}
.score-clear-btn{border:0;background:transparent;color:#687386;padding:3px 1px;font-size:9px;font-weight:750;white-space:nowrap}

@media(max-width:430px){
  .history-team{padding:7px 6px!important}
  .history-team-head strong{font-size:11.5px!important}
  .mcbrs-pill{font-size:7.5px;padding:3px 5px}
  .edit-match-date-control{min-height:37px;padding:6px 8px;font-size:11.5px}
  .team-score-stepper{grid-template-columns:27px 34px 27px;gap:4px}
  .team-score-stepper button{width:27px!important;height:29px!important;min-height:29px!important}
  .team-score-ball{width:34px;height:34px;font-size:16px}
}


/* =========================================================
   v3.10.5 — Historical editor + orange + Financials corrections
   ========================================================= */

/* Use the exact app accent orange everywhere for Oranges. */
:root{
  --team-orange:var(--accent);
  --team-orange-deep:var(--accent);
}
.orange-name,
.history-team-orange .history-team-head strong,
#resultsSection .team-card-orange .team-top h3{
  color:var(--accent) !important;
}
.result-pill.result-orange{
  background:var(--accent) !important;
}
.history-team-orange{
  background:linear-gradient(180deg,rgba(249,115,22,.12),rgba(249,115,22,.055)) !important;
  border-color:rgba(249,115,22,.27) !important;
}
#resultsSection .team-card-orange{
  background:linear-gradient(180deg,rgba(249,115,22,.13),rgba(249,115,22,.055)) !important;
  border-color:rgba(249,115,22,.24) !important;
}

/* Much more compact date control: still full-date and calendar backed. */
.edit-match-date-field{
  margin:3px 34px 7px 0 !important;
}
.edit-match-date-field > span:first-child{
  margin-bottom:3px !important;
}
.edit-match-date-control{
  min-height:31px !important;
  height:31px !important;
  padding:3px 8px !important;
  border-radius:9px !important;
  grid-template-columns:15px minmax(0,1fr) auto !important;
  gap:6px !important;
  font-size:11.5px !important;
}
.edit-match-date-control svg{
  width:14px !important;
  height:14px !important;
}
.edit-match-date-control .date-chevron{
  font-size:13px !important;
}

/* Historical score controls: fixed Oranges/Blues labels and visible mini nets. */
#historyEditDialog .score-editor{
  margin-top:7px !important;
}
.team-score-label{
  text-align:center;
  font-size:11px !important;
  margin-bottom:5px !important;
}
.team-score-label-orange{color:var(--accent) !important}
.team-score-label-blue{color:var(--team-blue) !important}

.team-score-stepper{
  grid-template-columns:30px 54px 30px !important;
  gap:5px !important;
}
.team-score-goal-frame{
  position:relative;
  width:54px;
  height:42px;
  display:grid;
  place-items:center;
  color:#9aa4b3;
}
.team-score-goal-frame svg{
  position:absolute;
  inset:0;
  width:54px;
  height:42px;
  opacity:.48;
  pointer-events:none;
}
.team-score-goal-orange svg{color:rgba(249,115,22,.72)}
.team-score-goal-blue svg{color:rgba(22,119,242,.68)}
.team-score-ball{
  position:relative;
  z-index:1;
  width:34px !important;
  height:34px !important;
  background:rgba(255,255,255,.94) !important;
  font-size:16px !important;
}
.score-note-row{
  margin-top:3px !important;
}

/* Financials: names get enough room; Dates Played is what compresses. */
.financials-table th:nth-child(1),
.financials-table td:nth-child(1){
  width:36% !important;
}
.financials-table th:nth-child(2),
.financials-table td:nth-child(2){
  width:10% !important;
}
.financials-table th:nth-child(3),
.financials-table td:nth-child(3){
  width:36% !important;
}
.financials-table th:nth-child(4),
.financials-table td:nth-child(4){
  width:18% !important;
}
.financial-player{
  font-size:13px !important;
  overflow:visible !important;
  text-overflow:clip !important;
  white-space:nowrap !important;
}
.dates-played{
  min-width:0 !important;
}
.dates-density-1{font-size:12px !important}
.dates-density-2{font-size:10.5px !important}
.dates-density-3{font-size:9px !important}
.dates-density-4{font-size:7.4px !important;letter-spacing:-.65px !important}

@media(max-width:430px){
  .edit-match-date-control{
    min-height:29px !important;
    height:29px !important;
    padding:2px 7px !important;
    font-size:10.8px !important;
  }
  .team-score-stepper{
    grid-template-columns:27px 50px 27px !important;
  }
  .team-score-goal-frame{
    width:50px;height:39px;
  }
  .team-score-goal-frame svg{
    width:50px;height:39px;
  }
  .team-score-ball{
    width:32px !important;height:32px !important;font-size:15px !important;
  }

  .financials-table th:nth-child(1),
  .financials-table td:nth-child(1){width:38% !important}
  .financials-table th:nth-child(2),
  .financials-table td:nth-child(2){width:9% !important}
  .financials-table th:nth-child(3),
  .financials-table td:nth-child(3){width:35% !important}
  .financials-table th:nth-child(4),
  .financials-table td:nth-child(4){width:18% !important}
  .financial-player{
    font-size:12px !important;
  }
  .dates-density-1{font-size:11px !important}
  .dates-density-2{font-size:9.5px !important}
  .dates-density-3{font-size:8.2px !important}
  .dates-density-4{font-size:6.9px !important;letter-spacing:-.7px !important}
}


/* =========================================================
   v3.10.5 — date clipping + scorer heading colours
   ========================================================= */

/* Compact date selector without clipping the full-date text. */
.edit-match-date-control{
  height:auto !important;
  min-height:34px !important;
  padding:5px 8px !important;
  line-height:1.15 !important;
  overflow:visible !important;
}
.edit-match-date-control #editMatchDateDisplay{
  line-height:1.15 !important;
  padding:1px 0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.edit-match-date-control svg{
  align-self:center !important;
}
.edit-match-date-control .date-chevron{
  align-self:center !important;
}

/* Scorer headers should carry the same team identity as the rest of the app. */
#editScorerTeam1Name{
  color:var(--accent) !important;
}
#editScorerTeam2Name{
  color:var(--team-blue) !important;
}

/* Keep the surrounding scorer panels subtly team-coded too, matching the mock-up. */
#editTeam1Scorers{
  background:linear-gradient(180deg,rgba(249,115,22,.07),rgba(249,115,22,.025)) !important;
  border-color:rgba(249,115,22,.22) !important;
}
#editTeam2Scorers{
  background:linear-gradient(180deg,rgba(22,119,242,.07),rgba(22,119,242,.025)) !important;
  border-color:rgba(22,119,242,.20) !important;
}

@media(max-width:430px){
  .edit-match-date-control{
    min-height:33px !important;
    padding:5px 7px !important;
    font-size:10.8px !important;
  }
}


/* =========================================================
   v3.10.5 — Financials column balance fix
   ========================================================= */

/* Give Dates Played materially more room.
   Player remains readable; Apps stays compact; PHees is protected. */
.financials-table th:nth-child(1),
.financials-table td:nth-child(1){
  width:33% !important;
}
.financials-table th:nth-child(2),
.financials-table td:nth-child(2){
  width:9% !important;
  text-align:center !important;
}
.financials-table th:nth-child(3),
.financials-table td:nth-child(3){
  width:42% !important;
}
.financials-table th:nth-child(4),
.financials-table td:nth-child(4){
  width:16% !important;
  text-align:right !important;
  white-space:nowrap !important;
}

/* Nudge Apps visually closer to Player by trimming inter-column padding. */
.financials-table th:nth-child(1),
.financials-table td:nth-child(1){
  padding-right:3px !important;
}
.financials-table th:nth-child(2),
.financials-table td:nth-child(2){
  padding-left:2px !important;
  padding-right:3px !important;
}
.financials-table th:nth-child(3),
.financials-table td:nth-child(3){
  padding-left:3px !important;
  padding-right:3px !important;
}
.financials-table th:nth-child(4),
.financials-table td:nth-child(4){
  padding-left:3px !important;
}

/* Player names can still contract if necessary, but keep normal size. */
.financial-player{
  font-size:12.5px !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

/* Dates are the only column that progressively shrinks under pressure. */
.dates-played{
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:clip !important;
}
.dates-density-1{font-size:11.5px !important}
.dates-density-2{font-size:10px !important}
.dates-density-3{font-size:8.6px !important;letter-spacing:-.4px !important}
.dates-density-4{font-size:7.1px !important;letter-spacing:-.7px !important}

/* Protect the currency column from ever collapsing. */
.phee-value,
.phee-value strong{
  font-size:12.5px !important;
  white-space:nowrap !important;
}

@media(max-width:430px){
  .financials-table th:nth-child(1),
  .financials-table td:nth-child(1){width:32% !important}
  .financials-table th:nth-child(2),
  .financials-table td:nth-child(2){width:9% !important}
  .financials-table th:nth-child(3),
  .financials-table td:nth-child(3){width:43% !important}
  .financials-table th:nth-child(4),
  .financials-table td:nth-child(4){width:16% !important}

  .financials-table th,
  .financials-table td{
    padding-left:3px !important;
    padding-right:3px !important;
  }

  .financial-player{font-size:11.5px !important}
  .dates-density-1{font-size:10.8px !important}
  .dates-density-2{font-size:9.3px !important}
  .dates-density-3{font-size:8px !important}
  .dates-density-4{font-size:6.6px !important;letter-spacing:-.75px !important}
  .phee-value,
  .phee-value strong{font-size:12px !important}
}


/* =========================================================
   v3.10.5 — sticky header, compact date editor, PHee cross,
             cleaner Randomiser lock-in flow
   ========================================================= */
.app-header{
  position:-webkit-sticky !important;
  position:sticky !important;
  top:env(safe-area-inset-top, 0px) !important;
  z-index:80 !important;
  background:linear-gradient(90deg,#1b171d 0%,#0b1220 100%) !important;
  box-shadow:0 8px 18px rgba(4,8,18,.16);
}
.phee-delete-btn{
  color:#b4232f !important;
  background:#ffe8e8 !important;
  border-color:#ffd1d1 !important;
  font-size:22px !important;
  font-weight:800 !important;
  line-height:1 !important;
}
.phee-delete-btn:active{background:#ffdcdc !important}

.edit-match-date-field{
  display:block !important;
  margin:3px 0 7px !important;
}
.edit-match-date-label{
  display:block;
  font-size:11px;
  font-weight:850;
  margin-bottom:4px;
}
.edit-match-date-row{
  display:grid;
  grid-template-columns:17px minmax(0,1fr) auto;
  align-items:center;
  gap:7px;
  min-height:34px;
  padding:4px 6px 4px 8px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#fff;
}
.edit-match-date-icon{
  width:16px;
  height:16px;
  color:#5e697a;
}
#editMatchDateDisplay{
  min-width:0;
  font-size:12px;
  line-height:1.15;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.edit-match-date-btn{
  min-height:27px !important;
  height:27px !important;
  padding:0 9px !important;
  border-radius:8px !important;
  font-size:10px !important;
  font-weight:800 !important;
}
.visually-hidden-date-input{
  position:fixed !important;
  left:-9999px !important;
  top:-9999px !important;
  width:1px !important;
  height:1px !important;
  opacity:.01 !important;
  pointer-events:none !important;
}
#tab-randomiser .section-heading h2{letter-spacing:-.025em}

@media(max-width:430px){
  .edit-match-date-row{
    min-height:32px;
    grid-template-columns:15px minmax(0,1fr) auto;
    gap:6px;
    padding:3px 5px 3px 7px;
  }
  .edit-match-date-icon{width:14px;height:14px}
  #editMatchDateDisplay{font-size:10.8px}
  .edit-match-date-btn{
    min-height:25px !important;
    height:25px !important;
    padding:0 7px !important;
    font-size:9.5px !important;
  }
}


/* =========================================================
   v3.10.5 — robust fixed header + native iOS date picker fix
   ========================================================= */

:root{
  --fixed-header-height:112px;
}

/* The header is true app chrome now: always at the viewport top. */
.app-header{
  position:fixed !important;
  top:0 !important;
  left:50% !important;
  right:auto !important;
  transform:translateX(-50%) !important;
  width:min(920px,100%) !important;
  max-width:920px !important;
  z-index:90 !important;
  margin:0 !important;
  padding-top:calc(env(safe-area-inset-top) + 4px) !important;
  padding-left:max(10px,env(safe-area-inset-left)) !important;
  padding-right:max(10px,env(safe-area-inset-right)) !important;
  box-sizing:border-box !important;
  background:
    radial-gradient(circle at 10% 0%,rgba(249,115,22,.10),transparent 17rem),
    linear-gradient(90deg,#1b171d 0%,#0b1220 100%) !important;
  box-shadow:0 6px 16px rgba(4,8,18,.18) !important;
}

/* Since the fixed header leaves normal document flow, reserve exactly the
   measured header height above the page content. */
.app-shell{
  padding-top:calc(var(--fixed-header-height) + 6px) !important;
}

/* The whole compact row is the native date control's tap target.
   iOS Safari therefore opens the picker directly from a user gesture. */
.edit-match-date-row{
  position:relative !important;
  overflow:hidden !important;
  cursor:pointer;
}
.native-date-overlay{
  position:absolute !important;
  inset:0 !important;
  z-index:5 !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-width:100% !important;
  min-height:100% !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:inherit !important;
  opacity:.001 !important;
  appearance:auto !important;
  -webkit-appearance:auto !important;
  pointer-events:auto !important;
  cursor:pointer !important;
}
.edit-match-date-icon,
#editMatchDateDisplay,
.edit-match-date-btn{
  position:relative;
  z-index:1;
  pointer-events:none !important;
}
.edit-match-date-btn{
  display:grid !important;
  place-items:center;
  min-width:42px !important;
  min-height:27px !important;
  height:27px !important;
  padding:0 8px !important;
  border-radius:8px !important;
  background:#e9edf4 !important;
  color:#26334a !important;
  font-size:10px !important;
  font-weight:800 !important;
}

/* Neutralise v3.9.5's off-screen date-input rule. */
.visually-hidden-date-input{
  position:static !important;
}

@media(max-width:430px){
  :root{--fixed-header-height:120px}
  .app-header{
    padding-top:calc(env(safe-area-inset-top) + 3px) !important;
    padding-left:max(8px,env(safe-area-inset-left)) !important;
    padding-right:max(8px,env(safe-area-inset-right)) !important;
  }
  .app-shell{
    padding-top:calc(var(--fixed-header-height) + 5px) !important;
  }
}


/* =========================================================
   v3.10.5 — fixed-header tool alignment + compact roster editor
   ========================================================= */

/* Older responsive rules position the tool stack absolutely at top:4px.
   With the header now fixed to the viewport, that placed the cog in the
   iPhone status area. Anchor it explicitly below the safe area instead. */
.app-header{
  position:fixed !important;
}
.header-tools{
  position:absolute !important;
  top:calc(env(safe-area-inset-top) + 10px) !important;
  right:max(10px, env(safe-area-inset-right)) !important;
  left:auto !important;
  margin:0 !important;
  padding:0 !important;
  transform:none !important;
  align-items:center !important;
  gap:7px !important;
  z-index:2 !important;
}

/* Reserve predictable space for the right-hand controls so the brand and
   salutation cannot collide with them. */
body[data-role="super"] .brand-block{
  padding-right:58px !important;
}
body[data-role="admin"] .brand-block{
  padding-right:48px !important;
}

/* Seven players is the design maximum here. Don't leave a nine/ten-line
   textarea underneath the actual roster. */
#editTeam1Players,
#editTeam2Players{
  box-sizing:border-box !important;
  min-height:0 !important;
  height:172px !important;
  max-height:172px !important;
  resize:none !important;
  overflow-y:auto !important;
}

@media(max-width:430px){
  .header-tools{
    top:calc(env(safe-area-inset-top) + 8px) !important;
    right:max(8px, env(safe-area-inset-right)) !important;
    gap:6px !important;
  }
  body[data-role="super"] .brand-block{
    padding-right:54px !important;
  }
  body[data-role="admin"] .brand-block{
    padding-right:44px !important;
  }
  #editTeam1Players,
  #editTeam2Players{
    height:164px !important;
    max-height:164px !important;
  }
}


/* =========================================================
   v3.10.5 — definitive header-tools + roster-height fix
   ========================================================= */

/* IMPORTANT:
   v3.9.7 still left .header-tools absolutely positioned.
   Put the controls back into the header's actual layout so:
   - the header height includes cog + logout
   - ResizeObserver measures the correct height
   - nothing can be clipped below the fixed header
*/
.app-header{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 46px !important;
  align-items:start !important;
  column-gap:8px !important;
  height:auto !important;
  min-height:0 !important;
}

.brand-block{
  grid-column:1 !important;
  grid-row:1 !important;
  min-width:0 !important;
  width:auto !important;
  padding-right:0 !important;
  margin:0 !important;
}

.header-tools{
  grid-column:2 !important;
  grid-row:1 !important;
  position:static !important;
  top:auto !important;
  right:auto !important;
  bottom:auto !important;
  left:auto !important;
  width:46px !important;
  max-width:46px !important;
  min-width:46px !important;
  margin:0 !important;
  padding:0 !important;
  transform:none !important;
  align-self:start !important;
  justify-self:end !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  gap:6px !important;
  overflow:visible !important;
}

/* Player mode still has no header tools. */
body[data-role="player"] .header-tools{
  display:none !important;
}

/* Keep individual controls fully inside their grid column. */
.header-tools .cog-button{
  flex:0 0 38px !important;
  width:38px !important;
  height:38px !important;
  min-height:38px !important;
  margin:0 !important;
}

.header-tools .admin-logout-btn{
  flex:0 0 34px !important;
  width:34px !important;
  height:34px !important;
  min-height:34px !important;
  margin:0 !important;
  border-radius:50% !important;
  overflow:visible !important;
}

/* Remove legacy brand reservations that were compensating for absolute tools. */
body[data-role="super"] .brand-block,
body[data-role="admin"] .brand-block{
  padding-right:0 !important;
}

/* Roster editor: exactly enough space for seven names.
   Older global textarea min-heights are explicitly defeated here. */
#historyEditDialog #editTeam1Players,
#historyEditDialog #editTeam2Players{
  box-sizing:border-box !important;
  min-height:124px !important;
  height:124px !important;
  max-height:124px !important;
  padding:7px 8px !important;
  font-size:12px !important;
  line-height:1.28 !important;
  resize:none !important;
  overflow-y:auto !important;
}

@media(max-width:430px){
  .app-header{
    grid-template-columns:minmax(0,1fr) 42px !important;
    column-gap:6px !important;
  }
  .header-tools{
    width:42px !important;
    max-width:42px !important;
    min-width:42px !important;
    gap:5px !important;
  }
  .header-tools .cog-button{
    width:38px !important;
    height:38px !important;
    min-height:38px !important;
  }
  .header-tools .admin-logout-btn{
    width:34px !important;
    height:34px !important;
    min-height:34px !important;
  }

  #historyEditDialog #editTeam1Players,
  #historyEditDialog #editTeam2Players{
    min-height:120px !important;
    height:120px !important;
    max-height:120px !important;
    padding:6px 7px !important;
    font-size:12px !important;
    line-height:1.25 !important;
  }
}


/* =========================================================
   v3.10.5 — 4-digit PIN admin auth + lock confirmation
   ========================================================= */
.pin-login-modal form{max-width:330px !important}
.pin-login-modal h2,.pin-login-modal .small{text-align:center}
.pin-dots{display:flex;justify-content:center;gap:14px;margin:14px 0 16px}
.pin-dots span{width:15px;height:15px;border-radius:50%;border:2px solid #c8d0dd;background:#fff;transition:transform .12s ease,background .12s ease,border-color .12s ease}
.pin-dots span.filled{background:var(--accent);border-color:var(--accent);transform:scale(1.08)}
.pin-pad{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;width:min(260px,100%);margin:0 auto 14px}
.pin-pad button{min-height:52px;border:1px solid #d8dee8;border-radius:14px;background:#f4f6fa;color:#111827;font-size:22px;font-weight:750;padding:0;box-shadow:0 1px 0 rgba(17,24,39,.03)}
.pin-pad button:active{transform:scale(.96);background:#e9edf4}
.pin-pad .pin-pad-secondary{color:#526071;font-size:17px}
#adminPinLoginBtn:disabled{opacity:.42;box-shadow:none}
.confirm-lock-modal form{max-width:360px !important}
.confirm-lock-modal h2{margin-bottom:6px}
.confirm-lock-modal .small{margin-bottom:14px}
@media(max-width:430px){
  .pin-pad{width:min(245px,100%);gap:8px}
  .pin-pad button{min-height:49px;font-size:21px}
}


/* =========================================================
   v3.10.5 — native OS numeric PIN input + auto-login
   ========================================================= */

.pin-login-modal form{
  max-width:300px !important;
}

.native-pin-label{
  display:block;
  width:100%;
  margin:14px auto 8px;
}

.native-pin-input{
  display:block;
  width:min(190px,100%);
  margin:0 auto;
  height:56px;
  box-sizing:border-box;
  border:1px solid #cfd6e2;
  border-radius:14px;
  background:#fff;
  color:#111827;
  text-align:center;
  font-size:30px;
  font-weight:800;
  letter-spacing:.42em;
  padding:0 0 0 .42em;
  caret-color:var(--accent);
  -webkit-text-security:disc;
  box-shadow:inset 0 1px 2px rgba(17,24,39,.03);
}

.native-pin-input:focus{
  outline:none;
  border-color:rgba(249,115,22,.65);
  box-shadow:0 0 0 3px rgba(249,115,22,.12);
}

.pin-login-modal .actions.single{
  grid-template-columns:1fr !important;
  margin-top:12px;
}

.pin-login-modal .actions.single .secondary{
  width:100%;
}

/* Legacy custom keypad elements are no longer used. */
.pin-dots,
.pin-pad{
  display:none !important;
}

@media(max-width:430px){
  .pin-login-modal form{max-width:280px !important}
  .native-pin-input{
    width:176px;
    height:54px;
    font-size:28px;
  }
}


/* =========================================================
   v3.10.5 — Vodafone-style four-cell PIN + reliable iOS focus
   ========================================================= */

.pin-login-modal form{
  max-width:330px !important;
  padding-bottom:22px !important;
}
.pin-login-modal h2{
  margin-bottom:5px !important;
}
.pin-login-modal .small{
  margin-bottom:18px !important;
}

.pin-entry-wrap{
  width:100%;
  margin:0 auto 8px;
}
.pin-entry-label{
  display:block;
  font-size:12px;
  font-weight:800;
  margin:0 0 8px 1px;
  color:#111827;
}
.pin-cell-input{
  position:relative;
  display:block;
  width:100%;
  max-width:280px;
  margin:0 auto;
}
.pin-cells{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:9px;
  width:100%;
}
.pin-cells span{
  height:62px;
  border:1.5px solid #bfc7d3;
  border-radius:9px;
  background:#fff;
  display:grid;
  place-items:center;
  color:#111827;
  font-size:30px;
  font-weight:900;
  line-height:1;
  box-sizing:border-box;
  transition:border-color .12s ease,box-shadow .12s ease,background .12s ease;
}
.pin-cells span.filled{
  border-color:rgba(249,115,22,.72);
  background:#fffaf6;
}
.pin-cell-input:focus-within .pin-cells span:not(.filled):first-child,
.pin-cell-input:focus-within .pin-cells span.filled + span:not(.filled){
  border-color:var(--accent);
  box-shadow:0 0 0 2px rgba(249,115,22,.12);
}

/* Single real input captures all digits but the user sees the 4 cells. */
.pin-native-capture{
  position:absolute !important;
  inset:0 !important;
  z-index:3 !important;
  width:100% !important;
  height:100% !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  outline:0 !important;
  background:transparent !important;
  color:transparent !important;
  caret-color:transparent !important;
  opacity:.01 !important;
  font-size:16px !important; /* prevents iOS zoom */
  letter-spacing:0 !important;
}

.pin-login-modal #adminLoginError{
  min-height:19px;
  text-align:center;
  margin:7px 0 0;
}

.admin-hold-ready{
  filter:drop-shadow(0 0 8px rgba(249,115,22,.65));
}

@media(max-width:430px){
  .pin-login-modal form{
    max-width:310px !important;
  }
  .pin-cell-input{
    max-width:270px;
  }
  .pin-cells{
    gap:8px;
  }
  .pin-cells span{
    height:58px;
    font-size:28px;
  }
}


/* =========================================================
   v3.10.5 — Vodafone-inspired PIN UX / restore timed hold
   ========================================================= */

/* Keep the login card above the iOS keypad rather than vertically centring it
   in the reduced visual viewport. */
#adminLoginDialog{
  margin:0 !important;
  width:auto !important;
  max-width:none !important;
  max-height:none !important;
  border:0 !important;
  padding:0 !important;
  background:transparent !important;
  overflow:visible !important;
  position:fixed !important;
  inset:0 !important;
}

#adminLoginDialog[open]{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:center !important;
  padding:
    max(calc(env(safe-area-inset-top) + 128px), 145px)
    16px
    16px !important;
  box-sizing:border-box !important;
}

#adminLoginDialog::backdrop{
  background:rgba(4,8,18,.72) !important;
  -webkit-backdrop-filter:blur(7px) !important;
  backdrop-filter:blur(7px) !important;
}

#adminLoginDialog form{
  position:relative !important;
  width:min(370px,100%) !important;
  max-width:370px !important;
  margin:0 !important;
  padding:26px 20px 24px !important;
  border-radius:20px !important;
  background:#fff !important;
  box-shadow:0 18px 55px rgba(0,0,0,.28) !important;
}

#adminLoginDialog h2{
  text-align:left !important;
  font-size:27px !important;
  line-height:1.08 !important;
  margin:0 38px 9px 0 !important;
  letter-spacing:-.025em !important;
}

#adminLoginDialog .pin-login-intro{
  text-align:left !important;
  margin:0 0 19px !important;
  font-size:14px !important;
  line-height:1.35 !important;
  color:#5f6978 !important;
}

#adminLoginDialog .modal-close{
  top:15px !important;
  right:15px !important;
  width:34px !important;
  height:34px !important;
  border-radius:50% !important;
}

.pin-entry-wrap{
  margin:0 !important;
}

.pin-entry-label{
  font-size:14px !important;
  font-weight:850 !important;
  margin:0 0 10px !important;
}

.pin-cell-input{
  max-width:none !important;
  width:100% !important;
}

.pin-cells{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:10px !important;
  width:100% !important;
}

.pin-cells span{
  height:62px !important;
  min-width:0 !important;
  border:1.5px solid #aeb7c3 !important;
  border-radius:8px !important;
  background:#fff !important;
  font-size:30px !important;
  box-shadow:none !important;
}

.pin-cell-input:focus-within .pin-cells span:not(.filled):first-child,
.pin-cell-input:focus-within .pin-cells span.filled + span:not(.filled){
  border-color:var(--accent) !important;
  box-shadow:0 0 0 2px rgba(249,115,22,.12) !important;
}

.pin-cells span.filled{
  border-color:#aeb7c3 !important;
  background:#fff !important;
}

#adminLoginDialog #adminLoginError{
  text-align:left !important;
  min-height:18px !important;
  margin:9px 0 0 !important;
  font-size:12px !important;
}

/* iOS keyboard can shrink the visual viewport dramatically; keep the card
   pinned near the top in that state. */
@media(max-height:700px){
  #adminLoginDialog[open]{
    padding-top:max(calc(env(safe-area-inset-top) + 72px),84px) !important;
  }
}

@media(max-width:430px){
  #adminLoginDialog[open]{
    padding-left:18px !important;
    padding-right:18px !important;
  }
  #adminLoginDialog form{
    width:100% !important;
    max-width:360px !important;
    padding:24px 19px 22px !important;
    border-radius:20px !important;
  }
  #adminLoginDialog h2{
    font-size:26px !important;
  }
  .pin-cells{
    gap:8px !important;
  }
  .pin-cells span{
    height:58px !important;
    font-size:28px !important;
  }
}


/* =========================================================
   v3.10.5 — hidden four-tap admin gesture
   ========================================================= */
#adminLoginTrigger{
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}


/* =========================================================
   v3.10.5 — robust four-tap gesture
   ========================================================= */
#adminLoginTrigger{
  touch-action:manipulation !important;
  -webkit-user-select:none !important;
  user-select:none !important;
  -webkit-touch-callout:none !important;
  -webkit-tap-highlight-color:transparent !important;
}

/* =========================================================
   v3.10.7 — two-team PHooty identity
   ========================================================= */
:root{--ph-blue:#55c8f5}
.brand-ph{position:relative;display:inline-block;color:transparent!important;line-height:1}
.brand-ph .ph-top,.brand-ph .ph-bottom{display:block;color:inherit}
.brand-ph .ph-top{position:relative;color:var(--ph-orange);clip-path:inset(0 0 50% 0)}
.brand-ph .ph-bottom{position:absolute;inset:0;color:var(--ph-blue);clip-path:inset(50% 0 0 0)}
.splash-title .split-ph{background:linear-gradient(to bottom,var(--ph-orange) 0 50%,var(--ph-blue) 50% 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent!important}
.splash-bib{filter:drop-shadow(-8px 10px 22px rgba(255,122,26,.16)) drop-shadow(8px 10px 22px rgba(85,200,245,.13))}
.splash-inner{position:relative;min-height:min(72vh,700px);justify-content:center}
.splash-version{position:absolute;left:50%;bottom:-8vh;transform:translateX(-50%);white-space:nowrap;color:rgba(255,255,255,.58);font-size:13px;font-weight:500;letter-spacing:.1px}


/* =========================================================
   v3.10.7 — final unified PHooty identity
   Exact shared bib + diagonal PH split
   ========================================================= */
:root{
  --ph-orange:#ff7a1a;
  --ph-blue:#55c8f5;
}

/* The header and splash now use the same vector bib geometry. */
.splash-bib{
  width:124px !important;
  height:139px !important;
  margin-bottom:27px !important;
  filter:
    drop-shadow(-7px 10px 21px rgba(255,122,26,.18))
    drop-shadow(7px 10px 21px rgba(85,200,245,.15)) !important;
}
.splash-bib svg,
.brand-bib svg{
  display:block !important;
  width:100% !important;
  height:100% !important;
  overflow:visible !important;
}

/* Header icon is literally the same proportions as splash, just scaled. */
.brand-bib{
  width:31px !important;
  height:35px !important;
  flex:0 0 31px !important;
}

/* Crisp diagonal orange/blue split on PH.
   Orange is upper-left, blue lower-right, matching the approved mock-up. */
.brand-ph,
.splash-title .split-ph{
  display:inline-block !important;
  background:
    linear-gradient(
      168deg,
      var(--ph-orange) 0%,
      var(--ph-orange) 49.4%,
      var(--ph-blue) 49.4%,
      var(--ph-blue) 100%
    ) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
  color:transparent !important;
}

/* Neutralise the old two-layer horizontal PH implementation. */
.brand-ph .ph-top,
.brand-ph .ph-bottom{
  display:none !important;
}

/* Keep approved splash version treatment. */
.splash-version{
  color:rgba(255,255,255,.58) !important;
}

/* Slight warm/cool header ambience to match icon palette. */
.app-header{
  background:
    radial-gradient(circle at 8% 25%,rgba(255,122,26,.10),transparent 23rem),
    radial-gradient(circle at 92% 25%,rgba(85,200,245,.07),transparent 22rem),
    linear-gradient(90deg,#1b171d 0%,#0b1220 100%) !important;
}

/* v3.10.8: approved canonical bib geometry */
.splash-bib{width:132px!important;height:auto!important;aspect-ratio:100/104!important}
.brand-bib{width:34px!important;height:auto!important;aspect-ratio:100/104!important;flex:0 0 34px!important}
.splash-bib svg,.brand-bib svg{display:block!important;width:100%!important;height:auto!important;aspect-ratio:100/104!important}

/* v3.10.9 — one canonical hard-edged bib vector everywhere */
.splash-bib{width:132px!important;height:auto!important;aspect-ratio:100/104!important;margin-bottom:27px!important}
.brand-bib{width:34px!important;height:auto!important;aspect-ratio:100/104!important;flex:0 0 34px!important}
.splash-bib svg,.brand-bib svg{display:block!important;width:100%!important;height:100%!important;aspect-ratio:100/104!important;object-fit:contain!important;overflow:visible!important}


/* =========================================================
   v3.10.10 — literal approved mock-up assets
   DO NOT redraw/reconstruct the bib: this PNG is extracted
   directly from the approved artwork.
   ========================================================= */
.splash-bib{
  width:132px !important;
  height:132px !important;
  aspect-ratio:1 / 1 !important;
}
.brand-bib{
  width:36px !important;
  height:36px !important;
  aspect-ratio:1 / 1 !important;
  flex:0 0 36px !important;
}
.splash-bib .approved-bib-image,
.brand-bib .approved-bib-image{
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  object-position:center !important;
  max-width:none !important;
  max-height:none !important;
}


/* =========================================================
   v3.10.18 — compact super-user header
   ONLY layout changes:
   - cog moves left of logout on the same row
   - super-user header height matches Treasurer admin header
   No brand/icon/PH/assets changed.
   ========================================================= */

/* Both admin roles use the same compact header height. */
body[data-role="admin"] .app-header,
body[data-role="super"] .app-header{
  min-height:68px !important;
}

/* Tools occupy one horizontal row. */
body[data-role="admin"] .header-tools,
body[data-role="super"] .header-tools{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:7px !important;
  align-self:flex-start !important;
}

/* Super user: cog immediately to the LEFT of logout. */
body[data-role="super"] #devSettingsCog{
  display:grid !important;
  order:1 !important;
}
body[data-role="super"] #adminLogoutBtn{
  order:2 !important;
}

/* Treasurer: cog remains absent; logout remains unchanged. */
body[data-role="admin"] #devSettingsCog{
  display:none !important;
}

/* Remove the old extra right-side reservation that existed because
   the super-user controls were stacked vertically. */
body[data-role="super"] .brand-block{
  padding-right:0 !important;
}

@media(max-width:700px){
  body[data-role="admin"] .app-header,
  body[data-role="super"] .app-header{
    min-height:64px !important;
    padding-bottom:3px !important;
  }

  body[data-role="super"] .brand-block{
    padding-right:0 !important;
  }

  body[data-role="admin"] .header-tools,
  body[data-role="super"] .header-tools{
    gap:6px !important;
  }
}

@media(max-width:430px){
  body[data-role="admin"] .app-header,
  body[data-role="super"] .app-header{
    min-height:64px !important;
  }
}

/* v3.10.18 — Financials payment ledger */
.financials-table{table-layout:fixed!important;min-width:0!important}
.financials-table th:nth-child(1),.financials-table td:nth-child(1){width:27%!important;text-align:left!important}
.financials-table th:nth-child(2),.financials-table td:nth-child(2){width:51%!important;text-align:left!important}
.financials-table th:nth-child(3),.financials-table td:nth-child(3){width:22%!important;text-align:right!important}
.financials-table tfoot th[colspan="2"]{text-align:left!important}
.date-lozenge-list{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.payment-date-lozenge{appearance:none;border:0;border-radius:999px;min-width:34px;padding:5px 8px;font:inherit;font-size:11px;line-height:1;cursor:pointer}
.payment-date-lozenge:active{transform:scale(.94)}
.payment-date-lozenge.unpaid{background:#e9edf3;color:#344054}
.payment-date-lozenge.paid{background:#c9f4d7;color:#15803d;font-weight:800}
.phee-unpaid-lozenge{display:inline-flex;align-items:center;justify-content:center;min-width:68px;border-radius:999px;padding:6px 9px;font-weight:900;white-space:nowrap}
.phee-unpaid-lozenge.unpaid{background:#ffd8d8;color:#c62828}
.phee-unpaid-lozenge.paid{background:#c9f4d7;color:#15803d}
.financial-total-unpaid{color:#c62828!important}.financial-total-paid{color:#15803d!important}

.payment-dialog{width:min(620px,calc(100vw - 18px));max-width:none;padding:0;border:0;background:transparent;overflow:visible}
.payment-dialog::backdrop{background:rgba(5,10,20,.58);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
.payment-sheet{background:#f8faff;color:#111827;border-radius:26px 26px 18px 18px;padding:12px 18px 18px;box-shadow:0 24px 80px rgba(0,0,0,.38)}
.payment-sheet-grabber{width:58px;height:5px;border-radius:999px;background:#aab2c1;margin:0 auto 10px}
.payment-sheet-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.payment-sheet-heading h2{margin:0 0 2px}.payment-sheet-heading p{margin:0;color:var(--muted)}
.payment-sheet-heading .dialog-x{position:static;flex:0 0 auto}
.payment-summary{display:grid;grid-template-columns:repeat(4,1fr);margin:16px 0;background:#eef2f8;border-radius:14px;overflow:hidden}
.payment-summary>div{padding:11px 8px;text-align:center;border-right:1px solid #d7deea}.payment-summary>div:last-child{border-right:0}
.payment-summary span{display:block;color:#667085;font-size:10px;margin-bottom:4px}.payment-summary strong{font-size:16px;white-space:nowrap}
.paid-amount{color:#16a34a!important}.unpaid-amount{color:#dc2626!important}
.payment-match-list{border:1px solid #d9e0ea;border-radius:14px;overflow:hidden;background:white}
.payment-match-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto auto;align-items:center;gap:10px;min-height:50px;padding:8px 12px;border-bottom:1px solid #e5e9f0;cursor:pointer}
.payment-match-row:last-child{border-bottom:0}.payment-match-date{min-width:0;font-size:13px}.payment-match-row strong{font-size:13px;white-space:nowrap}
.payment-match-toggle,.payment-mark-all input{position:absolute;opacity:0;pointer-events:none}
.payment-switch{width:43px;height:25px;border-radius:999px;background:#cbd3df;position:relative;display:inline-block;transition:background .15s ease}
.payment-switch::after{content:"";position:absolute;width:21px;height:21px;top:2px;left:2px;background:white;border-radius:50%;box-shadow:0 1px 4px rgba(0,0,0,.25);transition:transform .15s ease}
.payment-match-toggle:checked + .payment-switch,.payment-mark-all input:checked + .payment-switch{background:#19ad59}
.payment-match-toggle:checked + .payment-switch::after,.payment-mark-all input:checked + .payment-switch::after{transform:translateX(18px)}
.payment-state-label{min-width:42px;font-size:11px;color:#667085}.payment-match-toggle:checked ~ .payment-state-label{color:#159447;font-weight:800}
.payment-mark-all{margin-top:14px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#eef2f8;border-radius:14px;padding:12px 14px;cursor:pointer}.payment-mark-all>span:first-child{font-weight:800}
.payment-message{min-height:18px;margin:8px 0 0}.payment-done{width:100%;margin-top:4px}
@media(max-width:700px){
 .financials-table th,.financials-table td{padding:8px 5px!important}
 .financials-table th:nth-child(1),.financials-table td:nth-child(1){width:27%!important}
 .financials-table th:nth-child(2),.financials-table td:nth-child(2){width:50%!important}
 .financials-table th:nth-child(3),.financials-table td:nth-child(3){width:23%!important}
 .payment-date-lozenge{min-width:31px;padding:5px 7px;font-size:10px}.phee-unpaid-lozenge{min-width:58px;padding:6px 7px;font-size:11px}
 .payment-dialog{width:100vw;max-height:88dvh;margin:auto 0 0}.payment-sheet{border-radius:24px 24px 0 0;padding:10px 14px max(16px,env(safe-area-inset-bottom));max-height:88dvh;overflow:auto}
 .payment-summary strong{font-size:14px}.payment-summary span{font-size:9px}
 .payment-match-row{grid-template-columns:minmax(0,1fr) auto auto auto auto;gap:7px;padding:9px 10px}.payment-match-date{font-size:12px}
}
@media(max-width:430px){
 .financials-table th:nth-child(1),.financials-table td:nth-child(1){width:25%!important}
 .financials-table th:nth-child(2),.financials-table td:nth-child(2){width:52%!important}
 .financials-table th:nth-child(3),.financials-table td:nth-child(3){width:23%!important}
 .financial-player{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .payment-summary{grid-template-columns:repeat(2,1fr)}.payment-summary>div:nth-child(2){border-right:0}.payment-summary>div:nth-child(-n+2){border-bottom:1px solid #d7deea}
}


/* =========================================================
   v3.10.18 — Selection SMS workflow + Financial chase history
   ========================================================= */

/* Selection: Not asked → SMS → Asked → Declined → Accepted */
.selection-board{
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  gap:4px !important;
}
.lane-sms{background:#eef5ff}
.lane-sms .lane-head{
  background:#dbeaff;
  color:#1672d6;
}
.sms-lane-head{
  width:100%;
  border:0;
  cursor:pointer;
  font:inherit;
}
.sms-lane-head:active{filter:brightness(.97)}
.selection-player-card{
  padding-left:3px !important;
  padding-right:3px !important;
}
.selection-player-name{
  min-width:0;
  overflow-wrap:anywhere;
}
.asked-card{
  flex-direction:column;
  gap:5px;
  padding-top:7px !important;
  padding-bottom:7px !important;
}
.selection-card-actions{
  display:flex;
  gap:4px;
  justify-content:center;
  align-items:center;
}
.selection-card-action{
  width:18px;
  height:18px;
  padding:0;
  border:0;
  border-radius:50%;
  display:grid;
  place-items:center;
  font-size:12px;
  line-height:1;
  font-weight:950;
  cursor:pointer;
}
.selection-card-action.decline{
  background:#ffe0e0;
  color:#df2b2b;
}
.selection-card-action.accept{
  background:#d9f5df;
  color:#16803c;
}
.selection-card-action:active{transform:scale(.9)}

/* Financials chase colour language:
   grey = unpaid / not chased
   red  = unpaid / chased
   green = paid */
.payment-date-lozenge.unpaid{
  background:#e9edf3 !important;
  color:#344054 !important;
}
.payment-date-lozenge.chased{
  background:#ffd8d8 !important;
  color:#c62828 !important;
  font-weight:850;
}
.phee-unpaid-lozenge.unpaid{
  background:#e9edf3 !important;
  color:#344054 !important;
}
.phee-unpaid-lozenge.chased{
  background:#ffd8d8 !important;
  color:#c62828 !important;
}
.phee-unpaid-lozenge.paid{
  background:#c9f4d7 !important;
  color:#15803d !important;
}

/* Chase area lives only inside the payment tray. */
.payment-chase-panel{
  margin-top:14px;
  padding:12px;
  border-radius:14px;
  background:#eef2f8;
}
.payment-chase-main{
  display:flex;
  gap:10px;
  align-items:flex-start;
}
.payment-sms-btn{
  flex:0 0 auto;
  min-width:112px;
  min-height:48px;
  border:0;
  border-radius:13px;
  background:#fff;
  color:#172033;
  font-weight:900;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  cursor:pointer;
  box-shadow:0 2px 8px rgba(18,31,52,.06);
}
.payment-sms-btn.chased{
  background:#ffdada;
  color:#c62828;
}
.payment-sms-btn:disabled{
  opacity:.45;
  cursor:default;
}
.sms-bubble-icon{
  font-size:20px;
  line-height:1;
}
.payment-chase-meta{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
  padding-top:3px;
}
.payment-chase-meta strong{
  font-size:12px;
}
.payment-chase-meta span{
  color:#667085;
  font-size:11px;
  line-height:1.35;
}
.payment-chase-history-btn{
  margin-top:9px;
  padding:0;
  border:0;
  background:transparent;
  color:#1769d2;
  font-size:11px;
  font-weight:800;
  cursor:pointer;
}
.payment-chase-history{
  margin-top:9px;
  display:flex;
  flex-direction:column;
  gap:7px;
}
.chase-history-row{
  display:flex;
  gap:9px;
  align-items:flex-start;
  background:#fff;
  border-radius:10px;
  padding:8px 9px;
}
.chase-number{
  width:25px;
  height:25px;
  flex:0 0 25px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#edf1f7;
  font-size:11px;
  font-weight:900;
}
.chase-history-row>div{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.chase-history-row strong{
  font-size:11px;
}
.chase-history-row span:last-child{
  font-size:10px;
  color:#667085;
}

@media(max-width:700px){
  .selection-board{gap:3px !important}
  .lane-drop{padding-left:3px !important;padding-right:3px !important;gap:7px !important}
  .lane-head{font-size:8.5px !important;padding-left:1px !important;padding-right:1px !important}
  .selection-player-card{font-size:8.8px !important;min-height:48px !important;padding-left:2px !important;padding-right:2px !important}
  .selection-card-action{width:17px;height:17px;font-size:11px}
}
@media(max-width:390px){
  .selection-board{gap:2px !important}
  .selection-player-card{font-size:8px !important}
  .lane-head{font-size:8px !important}
  .payment-chase-main{align-items:stretch}
  .payment-sms-btn{min-width:100px}
}


/* =========================================================
   v3.10.18 — Selection usability + Financials tidy-up
   SMS/chase UI intentionally backed out.
   ========================================================= */

/* Selection returns to four clear states. */
.selection-board{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:5px !important;
}
.lane-head{
  font-size:12px !important;
  line-height:1.12 !important;
}
.selection-player-card{
  font-size:13px !important;
  line-height:1.12 !important;
  font-weight:800 !important;
}
.asked-card{
  padding:8px 6px 6px !important;
  gap:8px !important;
}
.selection-card-actions{
  width:100% !important;
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:5px !important;
}
.selection-card-action{
  width:100% !important;
  height:34px !important;
  min-width:0 !important;
  border-radius:10px !important;
  font-size:22px !important;
  touch-action:manipulation;
}
.selection-card-action span{
  display:block;
  transform:translateY(-1px);
}

/* Financials: enough room for full player names, dates may wrap instead. */
.financials-table th:nth-child(1),
.financials-table td:nth-child(1){
  width:38% !important;
}
.financials-table th:nth-child(2),
.financials-table td:nth-child(2){
  width:39% !important;
}
.financials-table th:nth-child(3),
.financials-table td:nth-child(3){
  width:23% !important;
}
.financial-player{
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
  overflow-wrap:anywhere !important;
  line-height:1.15 !important;
}
.date-lozenge-list{
  flex-wrap:wrap !important;
}

/* Unpaid is simply grey again; paid remains green. */
.payment-date-lozenge.unpaid,
.phee-unpaid-lozenge.unpaid{
  background:#e9edf3 !important;
  color:#344054 !important;
}

/* Payment tray: all four metrics remain on one horizontal row. */
.payment-summary{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
}
.payment-summary>div{
  border-bottom:0 !important;
}
.payment-match-date{
  white-space:nowrap !important;
}

/* Hide any obsolete chase selectors should old cached markup briefly survive. */
.payment-chase-panel,
.payment-sms-btn,
.payment-chase-history{
  display:none !important;
}

@media(max-width:700px){
  .selection-board{gap:4px !important}
  .lane-head{font-size:11px !important}
  .selection-player-card{font-size:12px !important;min-height:54px !important}
  .asked-card{min-height:92px !important}
  .selection-card-action{height:36px !important;font-size:22px !important}

  .financials-table th:nth-child(1),
  .financials-table td:nth-child(1){width:38% !important}
  .financials-table th:nth-child(2),
  .financials-table td:nth-child(2){width:39% !important}
  .financials-table th:nth-child(3),
  .financials-table td:nth-child(3){width:23% !important}

  .payment-summary{grid-template-columns:repeat(4,minmax(0,1fr)) !important}
  .payment-summary span{font-size:9px !important}
  .payment-summary strong{font-size:13px !important}
}
@media(max-width:430px){
  .lane-head{font-size:10.5px !important}
  .selection-player-card{font-size:11.5px !important}
  .payment-summary{grid-template-columns:repeat(4,minmax(0,1fr)) !important}
  .payment-summary>div{padding:10px 4px !important}
  .payment-summary span{font-size:8px !important}
  .payment-summary strong{font-size:12px !important}
}

/* v3.10.18 — restore Selection SMS lane only */
.selection-board{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:4px!important}
.lane-sms{background:#eef5ff!important}
.lane-sms .lane-head{background:#dbeaff!important;color:#1672d6!important}
.sms-lane-head{width:100%!important;border:0!important;cursor:pointer!important;font:inherit!important}
.sms-lane-head:active{filter:brightness(.97)}
@media(max-width:700px){
  .selection-board{gap:3px!important}
}
@media(max-width:390px){
  .selection-board{gap:2px!important}
}


/* =========================================================
   v3.10.18 — Selection layout tuning
   Approved changes only:
   - slimmer SMS lane
   - more width for name-bearing lanes
   - true 50/50 full-width Asked controls
   - keep larger readable text without wrapping where possible
   ========================================================= */

/* Give SMS less horizontal space; redistribute it to the four
   name-bearing lanes. */
.selection-board{
  grid-template-columns:
    minmax(0,1.08fr)
    minmax(0,.72fr)
    minmax(0,1.08fr)
    minmax(0,1.08fr)
    minmax(0,1.08fr) !important;
  gap:4px !important;
}

/* SMS doesn't need full-width player cards because the lane header
   moves the whole queue onwards. Keep SMS cards compact. */
.lane-sms .lane-drop{
  padding-left:3px !important;
  padding-right:3px !important;
}
.lane-sms .selection-player-card{
  width:calc(100% - 2px) !important;
  min-height:46px !important;
  padding-left:2px !important;
  padding-right:2px !important;
  font-size:11px !important;
}

/* Preserve the larger text from v3.10.14/16, but keep normal player
   names on one line now that those lanes have more width. */
.selection-player-name{
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:clip !important;
  max-width:100% !important;
}
.selection-player-card{
  font-size:12.5px !important;
  line-height:1.08 !important;
}

/* Asked cards: name occupies the top area, then the controls become
   a true full-bleed 50/50 split across the complete card width. */
.asked-card{
  padding:0 !important;
  gap:0 !important;
  overflow:hidden !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  justify-content:flex-start !important;
  min-height:96px !important;
}
.asked-card > .selection-player-name{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:1 1 auto !important;
  width:100% !important;
  min-height:50px !important;
  padding:9px 3px 7px !important;
  box-sizing:border-box !important;
  font-size:12.5px !important;
  font-weight:850 !important;
}
.asked-card .selection-card-actions{
  width:100% !important;
  display:grid !important;
  grid-template-columns:50% 50% !important;
  gap:0 !important;
  margin:0 !important;
  padding:0 !important;
  flex:0 0 40px !important;
}
.asked-card .selection-card-action{
  width:100% !important;
  height:40px !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  font-size:25px !important;
  display:grid !important;
  place-items:center !important;
  box-shadow:none !important;
}
.asked-card .selection-card-action.decline{
  border-bottom-left-radius:12px !important;
}
.asked-card .selection-card-action.accept{
  border-bottom-right-radius:12px !important;
}
.asked-card .selection-card-action span{
  transform:none !important;
}

/* Keep lane headings readable even with the narrower SMS lane. */
.lane-head{
  font-size:11.5px !important;
  line-height:1.08 !important;
}
.lane-sms .lane-head{
  font-size:11px !important;
}

/* iPhone-sized tuning. */
@media(max-width:700px){
  .selection-board{
    grid-template-columns:
      minmax(0,1.09fr)
      minmax(0,.68fr)
      minmax(0,1.09fr)
      minmax(0,1.09fr)
      minmax(0,1.09fr) !important;
    gap:3px !important;
  }
  .selection-player-card{
    font-size:12px !important;
  }
  .asked-card > .selection-player-name{
    font-size:12px !important;
  }
  .asked-card .selection-card-action{
    height:40px !important;
    font-size:24px !important;
  }
  .lane-head{
    font-size:11px !important;
  }
  .lane-sms .lane-head{
    font-size:10.5px !important;
  }
}
@media(max-width:390px){
  .selection-board{
    grid-template-columns:
      minmax(0,1.10fr)
      minmax(0,.64fr)
      minmax(0,1.10fr)
      minmax(0,1.10fr)
      minmax(0,1.10fr) !important;
    gap:2px !important;
  }
  .selection-player-card{
    font-size:11.5px !important;
  }
  .asked-card > .selection-player-name{
    font-size:11.5px !important;
  }
  .lane-head{
    font-size:10.5px !important;
  }
  .lane-sms .lane-head{
    font-size:10px !important;
  }
}


/* =========================================================
   v3.10.18 — approved compact Selection + small UX fixes
   ========================================================= */

/* Four equal columns: Not asked / SMS / Asked / Accepted. */
.selection-board{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:5px !important;
}

/* Restore equal SMS width and normal card sizing. */
.lane-sms .lane-drop{
  padding-left:6px !important;
  padding-right:6px !important;
}
.lane-sms .selection-player-card{
  width:100% !important;
  min-height:54px !important;
  padding-left:5px !important;
  padding-right:5px !important;
  font-size:12.5px !important;
}

/* Names now have the room from a 4-column layout. */
.selection-player-name{
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:clip !important;
  max-width:100% !important;
}

/* Compact Asked card: remove the large dead zone. */
.asked-card{
  min-height:74px !important;
  padding:0 !important;
  gap:0 !important;
  overflow:hidden !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
}
.asked-card > .selection-player-name{
  min-height:38px !important;
  flex:0 0 38px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  padding:5px 4px 3px !important;
  box-sizing:border-box !important;
  font-size:12.5px !important;
  font-weight:850 !important;
}
.asked-card .selection-card-actions{
  width:100% !important;
  height:36px !important;
  flex:0 0 36px !important;
  display:grid !important;
  grid-template-columns:50% 50% !important;
  gap:0 !important;
  padding:0 !important;
  margin:0 !important;
}
.asked-card .selection-card-action{
  width:100% !important;
  height:36px !important;
  min-width:0 !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  border-radius:0 !important;
  font-size:22px !important;
  display:grid !important;
  place-items:center !important;
}
.asked-card .selection-card-action.decline{border-bottom-left-radius:12px !important}
.asked-card .selection-card-action.accept{border-bottom-right-radius:12px !important}

/* Declined is now an in-place Asked state. Tap the red card to reset. */
.asked-card.declined-in-place{
  min-height:62px !important;
  background:#ffd8d8 !important;
  border:1px solid #ffabab !important;
  color:#c62828 !important;
  cursor:pointer !important;
  justify-content:center !important;
}
.asked-card.declined-in-place > .selection-player-name{
  min-height:auto !important;
  flex:0 0 auto !important;
  padding:8px 4px 2px !important;
  color:#172033 !important;
}
.declined-card-label{
  display:block !important;
  padding:0 4px 8px !important;
  text-align:center !important;
  font-size:10px !important;
  font-weight:900 !important;
  color:#d52828 !important;
}

/* Financial Player + Dates Played cells are intentionally tappable. */
.financial-open-cell{
  cursor:pointer !important;
}
.financial-open-cell:active{
  background:#f1f4f8 !important;
}

/* Read-only history cards have no footer, so collapse any residual bottom gap. */
body[data-role="player"] .history-item{
  padding-bottom:12px !important;
}
body[data-role="player"] .history-teams{
  margin-bottom:0 !important;
}

@media(max-width:700px){
  .selection-board{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:4px !important;
  }
  .lane-head{
    font-size:11.5px !important;
  }
  .selection-player-card,
  .lane-sms .selection-player-card{
    font-size:12px !important;
  }
  .asked-card{
    min-height:72px !important;
  }
  .asked-card > .selection-player-name{
    min-height:37px !important;
    flex-basis:37px !important;
    font-size:12px !important;
  }
  .asked-card .selection-card-actions,
  .asked-card .selection-card-action{
    height:35px !important;
  }
}


/* =========================================================
   v3.10.19 — equal lanes + definitive player-name behaviour
   ========================================================= */
.selection-board{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
}

/* Normal cards: long names may wrap to two lines. */
.selection-player-card:not(.asked-card) > .selection-player-name{
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:2 !important;
  white-space:normal !important;
  overflow:hidden !important;
  text-overflow:clip !important;
  overflow-wrap:anywhere !important;
  word-break:normal !important;
  width:100% !important;
  max-width:100% !important;
  line-height:1.12 !important;
}

/* Active Asked: preserve start, hard-clip end, NO ellipsis. */
.asked-card:not(.declined-in-place) > .selection-player-name{
  display:block !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:clip !important;
  direction:ltr !important;
  text-align:left !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  padding-left:7px !important;
  padding-right:5px !important;
  line-height:37px !important;
}

/* Declined-in-place has no controls, so names can wrap. */
.asked-card.declined-in-place > .selection-player-name{
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:2 !important;
  white-space:normal !important;
  overflow:hidden !important;
  text-overflow:clip !important;
  overflow-wrap:anywhere !important;
  width:100% !important;
  max-width:100% !important;
  line-height:1.12 !important;
  text-align:center !important;
}

/* =========================================================
   v3.10.22 — definitive Selection name wrapping / clipping
   ========================================================= */
/* Every non-Asked card may use its full card height and wrap to two
   lines. Do not waste width on an ellipsis. */
.selection-player-card:not(.asked-card){
  min-width:0 !important;
}
.selection-player-card:not(.asked-card) > .selection-player-name{
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  box-sizing:border-box !important;
  white-space:normal !important;
  overflow:hidden !important;
  text-overflow:clip !important;
  overflow-wrap:normal !important;
  word-break:normal !important;
  line-height:1.14 !important;
  max-height:2.28em !important;
  text-align:center !important;
}
/* Active Asked is the sole single-line exception. Anchor at the left
   edge and hard-clip ONLY the tail so 'Iranian Bobby' begins 'Iranian…'
   visually, but with no ellipsis glyph. */
.asked-card:not(.declined-in-place) > .selection-player-name{
  display:block !important;
  flex:0 0 37px !important;
  height:37px !important;
  min-height:37px !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  box-sizing:border-box !important;
  padding:0 6px !important;
  margin:0 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:clip !important;
  overflow-wrap:normal !important;
  word-break:normal !important;
  direction:ltr !important;
  text-align:left !important;
  text-indent:0 !important;
  line-height:37px !important;
  transform:none !important;
}


/* =========================================================
   v3.10.22 — consistent screen headings, Add Player selector,
              refined Financials payment tray
   ========================================================= */

/* Page headings: retain the app's existing h2/subtitle sizing and add only
   a small black nav-style icon exactly the title's visual height. */
.screen-heading-copy{display:flex;align-items:flex-start;gap:7px;min-width:0}
.screen-heading-copy>div{min-width:0}
.screen-title-icon{width:21px;height:21px;flex:0 0 21px;color:var(--ink);margin-top:0}
.screen-title-icon.pitch-title-icon{stroke:currentColor}
.selection-heading-copy{gap:7px!important;align-items:flex-start!important}
.selection-heading h2{font-size:21px!important;line-height:1.15!important;margin:0 0 4px!important}
.selection-heading p{font-size:12px!important;line-height:1.35!important;margin:0!important}
#tab-selection .selection-heading{align-items:flex-start!important}
#tab-randomiser .section-heading h2,#tab-history .section-heading h2,#tab-rankings .section-heading h2,#tab-financials .section-heading h2{font-size:21px!important;line-height:1.15!important;margin-bottom:4px!important}
#tab-randomiser .section-heading p,#tab-history .section-heading p,#tab-rankings .section-heading p,#tab-financials .section-heading p{font-size:12px!important;line-height:1.35!important}

/* Add Player now comes from the configured DB only — no free text. */
.selection-add-dialog{max-width:440px}
.selection-add-dialog form{padding-top:20px}
.selection-add-select-label{display:block;margin-top:15px}
.selection-add-select-label select{margin-top:4px}
.selection-add-dialog .actions{margin-top:14px}
.selection-add-dialog .primary:disabled{opacity:.45;box-shadow:none}

/* Standard red close X used in sheets/modals. */
.standard-red-x{width:42px;height:42px;border:0!important;border-radius:50%!important;background:#f1f1f1!important;color:#e32929!important;font-size:30px!important;font-weight:500!important;line-height:1!important;display:grid!important;place-items:center!important;padding:0!important}
.payment-sheet-heading .standard-red-x{position:static!important;flex:0 0 42px!important}
.selection-add-dialog .standard-red-x{position:absolute!important;right:10px!important;top:8px!important}

/* Payment summary: four cells always remain in one row with complete vertical dividers. */
.payment-summary{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.payment-summary>div{border-right:1px solid #d7deea!important;border-bottom:0!important;padding:11px 5px!important}
.payment-summary>div:last-child{border-right:0!important}
.payment-summary span{font-size:11px!important;line-height:1.08!important;margin-bottom:5px!important;white-space:normal!important}
.payment-summary strong{font-size:16px!important}

/* Mark-all sits directly above and right-aligns with all match toggles. */
.payment-mark-all{margin:0 0 10px auto!important;width:min(190px,48%)!important;min-height:42px!important;background:#eef2f8!important;border-radius:12px!important;padding:8px 10px!important;display:grid!important;grid-template-columns:minmax(0,1fr) 43px!important;gap:9px!important;align-items:center!important;cursor:pointer!important}
.payment-mark-all>span:first-child{font-size:13px!important;font-weight:850!important;margin:0!important;white-space:nowrap!important;text-align:left!important}

/* Match rows: date | fee | status text | hard-right toggle. */
.payment-match-row{grid-template-columns:minmax(0,1fr) auto auto 43px!important;gap:10px!important}
.payment-state-label{min-width:48px!important;text-align:right!important;font-size:12px!important;font-weight:750!important;color:#667085!important;white-space:nowrap!important}
.payment-match-toggle:checked ~ .payment-state-label{color:#159447!important}
/* Because the label now precedes the hidden input, use :has for state colour. */
.payment-match-row:has(.payment-match-toggle:checked) .payment-state-label{color:#159447!important;font-weight:850!important}
.payment-match-row .payment-switch{justify-self:end!important}
.payment-match-toggle:checked + .payment-switch{background:#19ad59!important}
.payment-match-toggle:checked + .payment-switch::after{transform:translateX(18px)!important}
.payment-mark-all input:checked + .payment-switch{background:#19ad59!important}
.payment-mark-all input:checked + .payment-switch::after{transform:translateX(18px)!important}

@media(max-width:430px){
  .screen-title-icon{width:21px!important;height:21px!important;flex-basis:21px!important}
  .payment-summary{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .payment-summary>div{padding:10px 3px!important;border-right:1px solid #d7deea!important;border-bottom:0!important}
  .payment-summary>div:last-child{border-right:0!important}
  .payment-summary span{font-size:10px!important}
  .payment-summary strong{font-size:14px!important}
  .payment-mark-all{width:185px!important;max-width:58%!important}
  .payment-match-row{grid-template-columns:minmax(0,1fr) auto auto 43px!important;gap:7px!important;padding:9px 10px!important}
  .payment-state-label{font-size:11px!important;min-width:43px!important}
}


/* =========================================================
   v3.10.23 — final tweaks
   ========================================================= */

/* Declined cards in Asked are intentionally locked until tapped back
   into the normal cross/tick Asked state. */
.selection-player-card.declined-in-place{
  touch-action:manipulation !important;
  cursor:pointer !important;
}
.selection-player-card.declined-in-place.is-dragging{
  transform:none !important;
}

/* Financials: reclaim wasted space between Player and Dates Played so
   five date lozenges can fit on one row on typical iPhone widths. */
.financials-table{
  table-layout:fixed !important;
}
.financials-table th:nth-child(1),
.financials-table td:nth-child(1){
  width:34% !important;
  padding-right:3px !important;
}
.financials-table th:nth-child(2),
.financials-table td:nth-child(2){
  width:43% !important;
  padding-left:2px !important;
  padding-right:2px !important;
}
.financials-table th:nth-child(3),
.financials-table td:nth-child(3){
  width:23% !important;
  padding-left:3px !important;
}
.financial-player{
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
  overflow-wrap:anywhere !important;
}
.date-lozenge-list{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:3px !important;
  justify-content:flex-start !important;
}
.payment-date-lozenge{
  min-width:0 !important;
  padding-left:6px !important;
  padding-right:6px !important;
}

/* Slight extra squeeze on narrower iPhones while protecting player names. */
@media(max-width:430px){
  .financials-table th:nth-child(1),
  .financials-table td:nth-child(1){width:33% !important}
  .financials-table th:nth-child(2),
  .financials-table td:nth-child(2){width:44% !important}
  .financials-table th:nth-child(3),
  .financials-table td:nth-child(3){width:23% !important}
  .date-lozenge-list{gap:2px !important}
  .payment-date-lozenge{
    padding-left:5px !important;
    padding-right:5px !important;
  }
}


/* =========================================================
   v3.10.26 — Financials 5-date row + exact PHooty team blue
   ========================================================= */
:root{--team-blue:#55c8f5}

/* Financials has three visible columns in the current UI.
   Give Dates Played the reclaimed player-column space. */
.financials-table th:first-child,
.financials-table td:first-child{
  width:31% !important;
  padding-right:4px !important;
}
.financials-table th:nth-child(2),
.financials-table td:nth-child(2){
  width:47% !important;
  padding-left:2px !important;
  padding-right:2px !important;
}
.financials-table th:last-child,
.financials-table td:last-child{
  width:22% !important;
  padding-left:3px !important;
}

/* Keep five normal date lozenges on one row on phone widths. */
.financials-table .dates-played{
  display:flex !important;
  align-items:center;
  flex-wrap:wrap;
  gap:3px !important;
  white-space:normal !important;
}
.financials-table .date-chip,
.financials-table .date-lozenge,
.financials-table .played-date{
  flex:0 0 auto;
  padding-left:7px !important;
  padding-right:7px !important;
}

/* Match-history Blues identity: same cyan as bib half and PH diagonal. */
.history-item .team-blue,
.history-item .team-blue h3,
.history-item .team-card-blue h3,
.history-item .history-blue,
.history-item .blue-label,
.history-item .score-blue,
.history-item .blues-label{
  color:var(--team-blue) !important;
}
.history-item .winner-badge.blue,
.history-item .winner-badge.blues,
.history-item .blue-winner,
.history-item [data-winner="blue"]{
  background:var(--team-blue) !important;
  border-color:var(--team-blue) !important;
  color:#fff !important;
}


/* =========================================================
   v3.10.27 — repair Financials table + five-date density
   ========================================================= */

/* Undo the v3.10.26 regression: the Dates Played TD must remain a
   real table-cell. Only the inner lozenge list is flex. */
.financials-table .dates-played{
  display:table-cell !important;
  vertical-align:middle !important;
  white-space:normal !important;
}

/* Push Dates Played closer to Player and give it more usable width
   without touching the PHees column. */
.financials-table th:first-child,
.financials-table td:first-child{
  width:29.5% !important;
  padding-right:1px !important;
}
.financials-table th:nth-child(2),
.financials-table td:nth-child(2){
  width:48.5% !important;
  padding-left:0 !important;
  padding-right:1px !important;
}
.financials-table th:last-child,
.financials-table td:last-child{
  width:22% !important;
  padding-left:3px !important;
}

/* The inner list can wrap, but five ordinary dates should fit on one line. */
.financials-table .date-lozenge-list{
  display:flex !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:2px !important;
  justify-content:flex-start !important;
  min-width:0 !important;
}
.financials-table .payment-date-lozenge{
  flex:0 0 auto !important;
  min-width:30px !important;
  padding:5px 5px !important;
  font-size:10.5px !important;
  line-height:1 !important;
}

/* Keep player names intact; only reclaim spacing, not text width by clipping. */
.financials-table .financial-player{
  white-space:nowrap !important;
  overflow:visible !important;
  text-overflow:clip !important;
  padding-left:6px !important;
}

@media(max-width:430px){
  .financials-table th:first-child,
  .financials-table td:first-child{width:29% !important}
  .financials-table th:nth-child(2),
  .financials-table td:nth-child(2){width:49% !important}
  .financials-table th:last-child,
  .financials-table td:last-child{width:22% !important}

  .financials-table .payment-date-lozenge{
    min-width:29px !important;
    padding-left:4px !important;
    padding-right:4px !important;
    font-size:10px !important;
  }
}


/* =========================================================
   v3.10.28 — date-chip stability + startup update smoothing
   ========================================================= */

/* Paid date lozenges should change colour only.  Do not change font
   weight because the wider glyphs can force a fifth date onto line 2. */
.financials-table .payment-date-lozenge.paid{
  font-weight:inherit !important;
}

/* Keep identical dimensions/typography for paid and unpaid date chips. */
.financials-table .payment-date-lozenge{
  box-sizing:border-box !important;
}


/* =========================================================
   v3.10.29 — startup/cache reset
   ========================================================= */

/* Paid date lozenges change colour only; no font-weight change. */
.financials-table .payment-date-lozenge.paid{
  font-weight:inherit !important;
}


/* v3.10.31: compact admin-only build label in bottom-right of admin header */
.admin-header-version{
  color:var(--ph-orange,#ff7a1a);
  font-size:12px;
  font-weight:600;
  line-height:1;
  white-space:nowrap;
  align-self:flex-end;
  margin-top:1px;
}
body[data-role="player"] .admin-header-version{display:none !important}


/* =========================================================
   v3.10.32 — admin version label placement
   ========================================================= */

/* Header becomes a 2-row grid for admin/super only:
   row 1 = brand + controls, row 2 = compact version label under controls. */
body[data-role="admin"] .app-header,
body[data-role="super"] .app-header{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  grid-template-rows:auto auto !important;
  column-gap:12px !important;
  row-gap:2px !important;
  align-items:start !important;
}

body[data-role="admin"] .app-header .brand-block,
body[data-role="super"] .app-header .brand-block{
  grid-column:1 !important;
  grid-row:1 / span 2 !important;
}

body[data-role="admin"] .app-header .header-tools,
body[data-role="super"] .app-header .header-tools{
  grid-column:2 !important;
  grid-row:1 !important;
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:6px !important;
}

body[data-role="admin"] .admin-header-version,
body[data-role="super"] .admin-header-version{
  grid-column:2 !important;
  grid-row:2 !important;
  justify-self:end !important;
  align-self:start !important;
  margin:0 2px 0 0 !important;
  color:var(--ph-orange,#ff7a1a) !important;
  font-size:11px !important;
  font-weight:600 !important;
  line-height:1 !important;
  white-space:nowrap !important;
}

body[data-role="player"] .admin-header-version{
  display:none !important;
}


/* =========================================================
   v3.10.35 — Financials header/footer alignment
   ========================================================= */

/* The footer now uses the same three physical columns as the body,
   so the total amount aligns with the Unpaid figures above. */
.financials-table tfoot th:first-child{
  text-align:left !important;
}
.financials-table tfoot th:nth-child(2){
  text-align:center !important;
}
.financials-table tfoot th:last-child,
#financialGrandTotal{
  text-align:right !important;
  padding-right:6px !important;
  white-space:nowrap !important;
}


/* =========================================================
   v3.10.35 — anonymous Welcome tab
   ========================================================= */

/* Anonymous navigation now has three equal read-only destinations. */
.bottom-nav.player-nav{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}

/* Welcome exists only for anonymous/read-only users. */
body[data-role="admin"] #tab-welcome,
body[data-role="super"] #tab-welcome,
body[data-role="admin"] .bottom-nav .tab[data-tab="welcome"],
body[data-role="super"] .bottom-nav .tab[data-tab="welcome"]{
  display:none !important;
}

.welcome-panel{
  padding:15px !important;
}
.welcome-heading{
  margin-bottom:14px !important;
}
.welcome-heading .screen-heading-copy{
  align-items:flex-start !important;
}
.welcome-title-icon{
  flex:0 0 auto !important;
  width:21px !important;
  height:21px !important;
  margin-top:1px !important;
}
.welcome-heading h2{
  font-size:21px !important;
  line-height:1.08 !important;
  margin:0 0 4px !important;
}
.welcome-tagline{
  color:var(--muted) !important;
  font-size:12px !important;
  font-weight:700 !important;
  line-height:1.3 !important;
  margin:0 !important;
}
.welcome-copy h3{
  font-size:17px !important;
  margin:0 0 8px !important;
}
.welcome-intro p{
  color:var(--muted);
  font-size:13px;
  line-height:1.5;
  margin:0;
}
.welcome-divider{
  height:1px;
  background:var(--line);
  margin:16px 0 14px;
}
.welcome-rule-list{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:7px;
}
.welcome-rule-list li{
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  gap:8px;
  align-items:center;
}
.welcome-rule-number{
  width:30px;
  height:30px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:var(--ph-orange,#ff7a1a);
  color:#fff;
  font-size:13px;
  font-weight:850;
  line-height:1;
}
.welcome-rule-text{
  display:block;
  background:#f3f5f8;
  border-radius:10px;
  padding:8px 10px;
  color:var(--muted);
  font-size:12px;
  line-height:1.35;
}
.welcome-nav-icon{
  width:22px !important;
  height:22px !important;
}

@media(max-width:430px){
  .welcome-panel{padding:14px !important}
  .welcome-title-icon{
    width:20px !important;
    height:20px !important;
  }
  .welcome-heading h2{
    font-size:20px !important;
  }
  .welcome-intro p{
    font-size:12.5px;
    line-height:1.47;
  }
  .welcome-rule-list{
    gap:6px;
  }
  .welcome-rule-list li{
    grid-template-columns:32px minmax(0,1fr);
    gap:7px;
  }
  .welcome-rule-number{
    width:28px;
    height:28px;
    font-size:12px;
  }
  .welcome-rule-text{
    padding:7px 9px;
    font-size:11.5px;
  }
}


/* =========================================================
   v3.10.48 — approved handshake + stronger Rules treatment
   ========================================================= */

/* Use the approved handshake artwork from the mock-up as a mask so
   it stays crisp and follows currentColor in title/nav contexts. */
.handshake-mask{
  display:inline-block !important;
  background-color:currentColor !important;
  -webkit-mask-image:url("handshake-icon.png?v=3.10.66");
  mask-image:url("handshake-icon.png?v=3.10.66");
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-position:center;
  mask-position:center;
  -webkit-mask-size:contain;
  mask-size:contain;
}

.welcome-title-icon{
  width:21px !important;
  height:21px !important;
  color:var(--ink) !important;
  margin-top:1px !important;
  flex:0 0 21px !important;
}
.welcome-nav-icon{
  width:22px !important;
  height:22px !important;
}

/* Stronger, more definite Rules cards. */
.welcome-rule-text{
  background:#e3eaf3 !important;
  color:#344054 !important;
  border:1px solid #d4dde9 !important;
  font-size:13px !important;
  line-height:1.38 !important;
  padding:9px 11px !important;
}

/* Keep the orange numbered discs prominent and aligned. */
.welcome-rule-number{
  box-shadow:0 1px 0 rgba(0,0,0,.04);
}

@media(max-width:430px){
  .welcome-title-icon{
    width:20px !important;
    height:20px !important;
    flex-basis:20px !important;
  }
  .welcome-rule-text{
    font-size:12.5px !important;
    line-height:1.38 !important;
    padding:8px 10px !important;
  }
}


/* =========================================================
   v3.10.48 — handshake sizing correction
   ========================================================= */

/* The asset is now tightly cropped. Give it the same visual weight
   as the other screen-title and bottom-nav icons. */
.welcome-title-icon{
  width:26px !important;
  height:26px !important;
  flex:0 0 26px !important;
  margin-top:0 !important;
}

.welcome-nav-icon{
  width:25px !important;
  height:25px !important;
}

@media(max-width:430px){
  .welcome-title-icon{
    width:25px !important;
    height:25px !important;
    flex-basis:25px !important;
  }
  .welcome-nav-icon{
    width:24px !important;
    height:24px !important;
  }
}


/* =========================================================
   v3.10.48 — Welcome scroll-position stability
   ========================================================= */

/* Do not let WebKit choose elements inside Welcome as scroll anchors
   while the anonymous landing view is settling. */
#tab-welcome,
#tab-welcome .welcome-panel,
#tab-welcome .welcome-heading{
  overflow-anchor:none !important;
}

/* Keep the panel in normal document flow beneath the sticky app header. */
#tab-welcome{
  position:relative !important;
  top:auto !important;
}

/* v3.10.48 — tabbed Dev Settings + Welcome editor */
.dev-settings-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:10px 0 14px}
.dev-settings-tab{border:0;border-radius:10px;background:#e9edf3;color:#42526b;min-height:40px;padding:8px 10px;font:inherit;font-size:12px;font-weight:750}
.dev-settings-tab.active{background:var(--ph-orange,#ff7a1a);color:#fff;box-shadow:0 5px 14px rgba(255,122,26,.18)}
.dev-settings-pane{display:none}.dev-settings-pane.active{display:block}
.dev-welcome-intro{color:var(--muted);font-size:12px;line-height:1.4;margin:0 0 12px}
.dev-welcome-section{margin-top:5px}.dev-welcome-section-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:7px}.dev-welcome-section-head h3{margin:0}
.dev-reset-copy{min-height:34px;padding:6px 9px;border-radius:9px;font-size:10.5px;white-space:nowrap}
.dev-welcome-field{display:block}#devWelcomeIntro,.dev-rule-input{width:100%;border:1px solid #d2d9e5;border-radius:11px;background:#fff;color:var(--ink);font:inherit;font-size:12.5px;line-height:1.4;padding:10px 11px;resize:vertical}
#devWelcomeIntro{min-height:150px}.dev-char-count{text-align:right;color:var(--muted);font-size:10px;margin-top:4px}
.dev-welcome-divider{height:1px;background:var(--line);margin:14px 0 12px}.dev-welcome-rules{display:flex;flex-direction:column;gap:7px}
.dev-rule-row{display:grid;grid-template-columns:34px minmax(0,1fr);gap:8px;align-items:center}.dev-rule-number{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--ph-orange,#ff7a1a);color:#fff;font-size:12px;font-weight:850}.dev-rule-input{min-height:46px;resize:vertical}
.dev-welcome-tips{margin-top:14px;padding:11px 12px;border-radius:11px;background:#e5f2ff;color:#42526b;font-size:10.5px;line-height:1.4}.dev-welcome-tips strong{color:#1769aa}.dev-welcome-tips ul{margin:5px 0 0 18px;padding:0}
.dev-welcome-save{width:100%;margin-top:12px;min-height:44px}.success-message{color:#15803d!important}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media(max-width:430px){.dev-settings-tab{font-size:11px;min-height:38px}.dev-welcome-section-head{align-items:flex-start}.dev-reset-copy{font-size:10px}#devWelcomeIntro,.dev-rule-input{font-size:12px}}


/* =========================================================
   v3.10.48 — anonymous browser install affordance
   ========================================================= */
.install-app-btn{
  border:0;
  border-radius:14px;
  background:var(--ph-orange,#ff7a1a);
  color:#fff;
  min-width:108px;
  min-height:44px;
  padding:7px 11px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  font:inherit;
  font-size:10px;
  font-weight:800;
  line-height:1.08;
  text-align:left;
  box-shadow:0 8px 18px rgba(255,122,26,.22);
}
.install-app-btn:active{transform:scale(.97)}
.install-app-icon{
  font-size:18px;
  line-height:1;
  font-weight:800;
}
body[data-role="admin"] .install-app-btn,
body[data-role="super"] .install-app-btn{
  display:none !important;
}

/* Installed PWA: never show the browser-install affordance. */
@media(display-mode:standalone){
  .install-app-btn{display:none !important}
}

.install-help-dialog{
  border:0;
  background:transparent;
  padding:0;
  width:min(92vw,520px);
  max-width:none;
}
.install-help-dialog::backdrop{
  background:rgba(5,10,20,.55);
  backdrop-filter:blur(7px);
}
.install-help-card{
  border:0;
  border-radius:22px 22px 0 0;
  padding:10px 16px calc(18px + env(safe-area-inset-bottom));
  background:#f7f8fb;
  color:var(--ink);
}
.install-help-dialog[open]{
  position:fixed;
  inset:auto 0 0 0;
  margin:0 auto;
}
.install-help-steps{
  list-style:none;
  padding:0;
  margin:16px 0 14px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.install-help-steps li{
  display:grid;
  grid-template-columns:32px minmax(0,1fr);
  gap:10px;
  align-items:center;
  color:#475467;
  font-size:13px;
  line-height:1.38;
}
.install-step-number{
  width:30px;height:30px;border-radius:50%;
  display:grid;place-items:center;
  background:var(--ph-orange,#ff7a1a);
  color:#fff;font-weight:850;
}
.install-help-done{width:100%;min-height:44px;margin-top:4px}

@media(max-width:520px){
  .install-app-btn{
    min-width:98px;
    min-height:42px;
    padding:6px 9px;
    font-size:9.5px;
    border-radius:13px;
  }
  .install-app-icon{font-size:17px}
}


/* =========================================================
   v3.10.48 — install button placement + polished iOS tray
   ========================================================= */

/* Same lozenge size, simply shifted inward on compact iPhones. */
@media(max-width:430px){
  .install-app-btn{
    margin-right:14px !important;
  }
}

/* Dark, richer install guide matching the approved mock-up. */
.install-help-dialog{
  width:min(88vw,520px) !important;
}
.install-help-card{
  position:relative;
  border-radius:22px 22px 0 0 !important;
  background:linear-gradient(180deg,#17212f 0%,#111a26 100%) !important;
  color:#fff !important;
  padding:12px 16px calc(18px + env(safe-area-inset-bottom)) !important;
  box-shadow:0 -18px 40px rgba(0,0,0,.34);
}
.install-help-close{
  position:absolute;
  top:18px;
  right:16px;
  width:40px;
  height:40px;
  border:0;
  border-radius:50%;
  background:#334155;
  color:#fff;
  font-size:24px;
  line-height:1;
  display:grid;
  place-items:center;
}
.install-help-titleblock{
  text-align:center;
  padding:22px 42px 2px;
}
.install-help-titleblock h2{
  color:#fff;
  font-size:22px;
  line-height:1.08;
  margin:0 0 8px;
}
.install-help-titleblock p{
  color:#cbd5e1;
  font-size:12.5px;
  line-height:1.4;
  margin:0 auto;
  max-width:300px;
}
.install-help-steps{
  margin:18px 0 14px !important;
  gap:14px !important;
}
.install-help-steps li{
  grid-template-columns:34px minmax(0,1fr) !important;
  gap:10px !important;
  align-items:flex-start !important;
  color:#e2e8f0 !important;
}
.install-step-copy p{
  margin:0 0 8px;
  color:#e2e8f0;
  font-size:12.5px;
  line-height:1.4;
}
.safari-demo{
  border-radius:12px;
  background:#2a3a4f;
  border:1px solid rgba(255,255,255,.08);
  color:#cbd5e1;
}
.safari-toolbar-demo{
  min-height:50px;
  display:grid;
  grid-template-columns:repeat(5,1fr);
  align-items:center;
  text-align:center;
  font-size:20px;
  padding:0 8px;
}
.demo-share{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  margin:0 auto;
  border:2px solid var(--ph-orange,#ff7a1a);
  border-radius:50%;
  color:#60a5fa;
  font-size:24px;
}
.safari-row-demo{
  min-height:48px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 14px;
  font-size:12px;
  color:#fff;
}
.demo-plus{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border:2px solid #dbeafe;
  border-radius:7px;
  font-size:18px;
}
.safari-add-demo{
  min-height:48px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:8px;
  padding:0 10px;
  font-size:10.5px;
}
.safari-add-demo strong{
  color:#fff;
  font-size:10.5px;
  text-align:center;
}
.demo-add{
  color:#60a5fa;
  border:1px solid #3b82f6;
  border-radius:9px;
  padding:5px 8px;
}
.install-help-done{
  min-height:46px !important;
  font-size:15px !important;
  font-weight:850 !important;
}


/* =========================================================
   v3.10.48 — compact anonymous-browser header containment
   ========================================================= */

/* Only normal-browser anonymous mode gets this narrow-screen layout.
   Admin/super and installed-PWA headers keep their existing layout. */
@media(max-width:430px){
  body[data-role="player"]:not(.standalone-pwa) .app-header:has(.install-app-btn:not(.hidden)){
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    align-items:start !important;
    column-gap:8px !important;
    overflow:visible !important;
  }

  body[data-role="player"]:not(.standalone-pwa) .app-header:has(.install-app-btn:not(.hidden)) .brand-block{
    min-width:0 !important;
    max-width:100% !important;
  }

  body[data-role="player"]:not(.standalone-pwa) .app-header:has(.install-app-btn:not(.hidden)) .brand-title{
    max-width:none !important;
    min-width:0 !important;
  }

  body[data-role="player"]:not(.standalone-pwa) .app-header:has(.install-app-btn:not(.hidden)) .header-tools{
    min-width:0 !important;
    width:auto !important;
    max-width:118px !important;
    padding-top:0 !important;
    margin-right:8px !important;
    justify-self:end !important;
    align-self:start !important;
  }

  body[data-role="player"]:not(.standalone-pwa) .app-header:has(.install-app-btn:not(.hidden)) .install-app-btn{
    margin-right:0 !important;
    max-width:110px !important;
    box-sizing:border-box !important;
  }
}

/* =========================================================
   v3.10.48 — Randomiser MVP orbit, shuffle and team cards
   ========================================================= */
.randomiser-hidden-source{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important}
.randomiser-mvp-panel,.randomiser-results{
  background:linear-gradient(180deg,#101c2b 0%,#0b1522 100%)!important;
  color:#fff!important;
  border:1px solid #25364a!important;
}
.randomiser-mvp-panel .section-heading h2,.randomiser-results h2{color:#fff!important}
.randomiser-mvp-panel .section-heading p,.randomiser-results .section-heading p{color:#9fb0c5!important}
.randomiser-mvp-panel .badge{background:#183654!important;color:#fff!important}
.randomiser-stage{min-height:420px;display:grid;place-items:center;position:relative}
.player-orbit,.shuffle-stage{position:relative;width:min(88vw,440px);aspect-ratio:1;margin:8px auto}
.orbit-guide{position:absolute;inset:8%;border:2px dashed #34506d;border-radius:50%}
.orbit-centre,.shuffle-centre{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:34%;aspect-ratio:1;border-radius:50%;display:grid;place-content:center;text-align:center;
  background:radial-gradient(circle at 40% 35%,#1c2b3e,#09111b 72%);
  border:2px solid #ff7a1a;box-shadow:0 0 24px rgba(255,122,26,.25)
}
.orbit-centre strong{font-size:42px;line-height:.95}.orbit-centre span{font-size:13px;color:#c7d3e2}.orbit-centre small{font-size:8.5px;color:#89a0ba;text-transform:uppercase;letter-spacing:1.1px;margin-top:5px}
.orbit-player,.shuffle-player{
  position:absolute;transform:translate(-50%,-50%);border-radius:50%;display:grid;place-content:center;text-align:center;
  background:linear-gradient(180deg,#25374d,#152233);border:1px solid #7896b9;color:#fff;box-shadow:0 5px 16px rgba(0,0,0,.28)
}
.orbit-player span,.shuffle-player span{font-size:10px;font-weight:800;line-height:1.05;max-width:90%;overflow:hidden;text-overflow:clip;white-space:nowrap}
.orbit-player strong,.shuffle-player strong{font-size:12px;margin-top:2px;color:#dce8f5}
.randomiser-generate-btn{width:100%;min-height:50px;font-size:15px}
.randomiser-generate-btn:disabled{opacity:.45}
.shuffle-stage{display:grid;place-items:center}
.shuffle-stage.hidden{display:none!important}.player-orbit.hidden{display:none!important}
.shuffle-rings{position:absolute;inset:5%;border-radius:50%;background:repeating-radial-gradient(circle,transparent 0 13px,rgba(255,122,26,.06) 14px 16px,transparent 17px 29px);animation:spinRings .8s linear infinite}
.shuffle-orbit{position:absolute;inset:0;animation:spinOrbit .8s linear infinite}
.shuffle-player{filter:blur(.2px);box-shadow:0 0 18px rgba(50,140,255,.18)}
.shuffle-centre strong{font-size:25px}.shuffle-centre span{font-size:12px;font-weight:800;color:#dce8f5}
.shuffle-stage>p{position:absolute;bottom:0;color:#9fb0c5;font-size:11px}
@keyframes spinOrbit{to{transform:rotate(360deg)}}@keyframes spinRings{to{transform:rotate(-360deg)}}

.randomiser-results{padding:14px!important;border-radius:18px!important}
.mvp-team-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mvp-team-card{border-radius:14px;padding:10px;background:#0d1825}
.mvp-team-orange{border:1.5px solid #ff7a1a;box-shadow:0 0 16px rgba(255,122,26,.10)}
.mvp-team-blue{border:1.5px solid #2fa7ff;box-shadow:0 0 16px rgba(47,167,255,.10)}
.mvp-team-head{display:flex;gap:9px;align-items:center;padding-bottom:8px;border-bottom:1px solid #223247}
.mvp-team-head h3{margin:0;font-size:14px}.mvp-team-orange h3{color:#ff8a29}.mvp-team-blue h3{color:#36b0ff}
.mvp-team-head p{margin:2px 0 0;font-size:10px;color:#9fb0c5}.mvp-team-head p strong{font-size:20px;margin-left:3px}.mvp-team-orange .mvp-team-head p strong{color:#ff8a29}.mvp-team-blue .mvp-team-head p strong{color:#36b0ff}
.mvp-shirt{display:inline-block;width:24px;height:21px;clip-path:polygon(23% 0,39% 0,43% 10%,57% 10%,61% 0,77% 0,100% 17%,86% 43%,76% 35%,76% 100%,24% 100%,24% 35%,14% 43%,0 17%);flex:0 0 auto}
.mvp-shirt-orange{background:#ff7a1a}.mvp-shirt-blue{background:#239df2}
.mvp-team-list{list-style:none;padding:0;margin:0}
.mvp-team-list li{display:grid;grid-template-columns:26px minmax(0,1fr) auto;gap:7px;align-items:center;min-height:40px;border-bottom:1px solid #1e2d40;padding:4px 0;color:#fff}
.mvp-team-list li:last-child{border-bottom:0}.mvp-player-name{font-size:12px;font-weight:750;white-space:nowrap;overflow:hidden;text-overflow:clip}
.mvp-rating-pill{min-width:34px;text-align:center;padding:5px 7px;border-radius:12px;font-size:11px;border:1px solid}
.rating-high{background:#0f4e3a;border-color:#1ba16e;color:#dcfff1}.rating-mid{background:#4f3b16;border-color:#a4771d;color:#fff3c4}.rating-low{background:#53242b;border-color:#bd4050;color:#ffe0e5}
.mvp-team-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:12px}
.mvp-team-actions button{min-height:54px;padding:7px 5px;font-size:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}
.mvp-team-actions button:first-child{background:#ff7a1a!important;color:#fff!important;border-color:#ff7a1a!important}
.randomiser-message{color:#ffb4b4!important}
@media(max-width:430px){
  .randomiser-stage{min-height:375px}.player-orbit,.shuffle-stage{width:min(86vw,390px)}
  .orbit-centre strong{font-size:36px}.mvp-team-grid{gap:7px}.mvp-team-card{padding:8px}
  .mvp-team-head{gap:6px}.mvp-team-head h3{font-size:12px}.mvp-shirt{width:21px;height:18px}.mvp-player-name{font-size:11px}.mvp-rating-pill{font-size:10px;min-width:31px;padding:4px 6px}
}

/* v3.10.48 — richer live Randomiser orbit + simplified actions */
.player-orbit{isolation:isolate;overflow:visible}
.player-orbit::before,.player-orbit::after{content:"";position:absolute;border-radius:50%;pointer-events:none;z-index:-2}
.player-orbit::before{inset:5%;background:
  repeating-conic-gradient(from 15deg,rgba(255,122,26,.00) 0 7deg,rgba(255,122,26,.24) 8deg 11deg,rgba(42,151,255,.00) 12deg 20deg,rgba(42,151,255,.24) 21deg 24deg),
  radial-gradient(circle,rgba(8,20,34,.08) 25%,rgba(255,122,26,.16) 48%,rgba(32,139,255,.18) 61%,rgba(5,16,28,.02) 75%);
  filter:blur(1px);animation:waitingGlowSpin 8.18s linear infinite;box-shadow:0 0 35px rgba(255,122,26,.12),0 0 42px rgba(32,139,255,.12)}
.player-orbit::after{inset:15%;border:1px solid rgba(75,166,255,.32);box-shadow:0 0 24px rgba(43,145,255,.18),inset 0 0 25px rgba(255,122,26,.08);z-index:-1}
.orbit-guide{border:1px solid rgba(89,153,216,.42)!important;box-shadow:0 0 20px rgba(42,151,255,.15)}
.orbit-player{overflow:visible!important;background:radial-gradient(circle at 38% 30%,#263b54,#111d2c 72%)!important;border-color:#7899bb!important;box-shadow:0 0 15px rgba(45,150,255,.16),0 5px 16px rgba(0,0,0,.3)!important}
.orbit-player span,.shuffle-player span{display:block!important;width:100%!important;max-width:none!important;padding:0 2px;box-sizing:border-box;overflow:visible!important;text-overflow:clip!important;white-space:nowrap!important;line-height:1.05!important}
.orbit-player strong{font-size:12px!important;margin-top:3px!important}
.orbit-centre{border-color:#ff7a1a!important;box-shadow:0 0 30px rgba(255,122,26,.22),0 0 42px rgba(42,151,255,.12)!important}
.randomiser-generate-btn{background:linear-gradient(180deg,#ff9137,#ff7215)!important;box-shadow:0 7px 20px rgba(255,122,26,.22)!important}
.shuffle-stage::before{content:"";position:absolute;inset:4%;border-radius:50%;background:repeating-conic-gradient(rgba(255,122,26,.22) 0 7deg,transparent 8deg 16deg,rgba(36,153,255,.22) 17deg 24deg,transparent 25deg 34deg);filter:blur(3px);animation:spinOrbit .55s linear infinite;z-index:-1}
@keyframes waitingGlowSpin{to{transform:rotate(360deg)}}
.mvp-team-actions{grid-template-columns:repeat(3,1fr)!important}
.mvp-team-actions button{min-height:58px!important;font-size:11px!important;border-radius:12px!important}
.mvp-team-actions .action-icon{font-size:24px;line-height:1;font-weight:800}
.mvp-action-reroll{background:#ff7a1a!important;border-color:#ff7a1a!important;color:#fff!important}
.mvp-action-switch{background:#14263a!important;border-color:#31506f!important;color:#e9f3ff!important}
.mvp-action-save{background:linear-gradient(180deg,#13a966,#07814c)!important;border-color:#1bc47a!important;color:#fff!important;box-shadow:0 5px 16px rgba(15,164,98,.2)!important}

/* v3.10.48 — Randomiser motion/reliability and team hierarchy refinements */
.mvp-team-head h3{font-size:19px!important;line-height:1.05!important;font-weight:850!important}
.mvp-team-head p{font-size:9px!important;margin-top:4px!important}
.mvp-team-head p strong{font-size:16px!important;line-height:1!important}
.shuffle-stage:not(.hidden) .shuffle-orbit{animation:spinOrbit .8s linear infinite!important}
.shuffle-stage:not(.hidden) .shuffle-rings{animation:spinRings .8s linear infinite!important}
@media(max-width:430px){.mvp-team-head h3{font-size:17px!important}.mvp-team-head p strong{font-size:15px!important}}


/* =========================================================
   v3.10.48 — ethereal Randomiser energy + simplified team actions
   ========================================================= */

/* Replace the spoke/wheel treatment with broad, flowing orange/blue energy.
   Player chips continue their independent JS orbit; this energy layer rotates
   at roughly twice the player angular speed. */
.player-orbit::before{
  inset:2% !important;
  background:
    radial-gradient(ellipse at 27% 26%,rgba(37,146,255,.52) 0 4%,rgba(37,146,255,.17) 11%,transparent 28%),
    radial-gradient(ellipse at 74% 34%,rgba(255,121,28,.50) 0 4%,rgba(255,121,28,.16) 12%,transparent 29%),
    radial-gradient(ellipse at 34% 74%,rgba(255,121,28,.48) 0 3%,rgba(255,121,28,.14) 11%,transparent 27%),
    radial-gradient(ellipse at 72% 73%,rgba(39,151,255,.52) 0 4%,rgba(39,151,255,.16) 12%,transparent 29%),
    conic-gradient(from 10deg,
      rgba(36,151,255,.05) 0deg,
      rgba(36,151,255,.58) 42deg,
      rgba(255,122,26,.08) 92deg,
      rgba(255,122,26,.62) 142deg,
      rgba(36,151,255,.07) 196deg,
      rgba(36,151,255,.58) 242deg,
      rgba(255,122,26,.08) 292deg,
      rgba(255,122,26,.60) 338deg,
      rgba(36,151,255,.05) 360deg) !important;
  -webkit-mask:radial-gradient(circle,transparent 0 27%,#000 35% 80%,transparent 91%) !important;
  mask:radial-gradient(circle,transparent 0 27%,#000 35% 80%,transparent 91%) !important;
  filter:blur(7px) saturate(1.65) brightness(1.08) !important;
  animation:etherealEnergySpin 40.9s linear infinite !important;
  box-shadow:
    0 0 30px rgba(255,122,26,.18),
    0 0 42px rgba(36,151,255,.18) !important;
  opacity:.96 !important;
}

.player-orbit::after{
  inset:8% !important;
  border:0 !important;
  background:
    conic-gradient(from 170deg,
      transparent 0 12%,
      rgba(255,134,45,.32) 16% 21%,
      transparent 27% 45%,
      rgba(48,164,255,.34) 49% 55%,
      transparent 61% 78%,
      rgba(255,122,26,.28) 82% 87%,
      transparent 92% 100%) !important;
  -webkit-mask:radial-gradient(circle,transparent 0 37%,#000 46% 67%,transparent 74%) !important;
  mask:radial-gradient(circle,transparent 0 37%,#000 46% 67%,transparent 74%) !important;
  filter:blur(9px) saturate(1.5) !important;
  animation:etherealEnergySpinReverse 31s linear infinite !important;
  box-shadow:none !important;
  opacity:.80 !important;
}

/* No visible wheel/spokes: only a very subtle orbital guide remains. */
.orbit-guide{
  border:1px solid rgba(102,169,232,.18) !important;
  box-shadow:0 0 22px rgba(41,149,255,.10) !important;
}

/* Give the central hub a cooler glass edge so it sits inside the energy field. */
.orbit-centre{
  border-color:#78b9ef !important;
  box-shadow:
    0 0 28px rgba(48,159,255,.18),
    0 0 34px rgba(255,122,26,.13),
    inset 0 0 24px rgba(44,132,217,.08) !important;
}

@keyframes etherealEnergySpin{to{transform:rotate(360deg)}}
@keyframes etherealEnergySpinReverse{to{transform:rotate(-360deg)}}

/* Standard red close control aligned to Tonight's teams heading. */
.randomiser-results-heading{
  align-items:flex-start !important;
}
.randomiser-results-close{
  flex:0 0 42px !important;
  position:static !important;
  margin-left:8px !important;
}

/* Switch on the left, exact one-column gap, Save on the right. */
.mvp-team-actions-two{
  grid-template-columns:1fr 1fr 1fr !important;
  gap:10px !important;
}
.mvp-team-actions-two .mvp-action-switch{grid-column:1}
.mvp-team-actions-two .mvp-action-gap{
  grid-column:2;
  min-width:0;
}
.mvp-team-actions-two .mvp-action-save{grid-column:3}
.mvp-team-actions-two button{
  min-height:62px !important;
}
.mvp-action-svg{
  width:25px;
  height:25px;
  display:block;
  margin-bottom:2px;
}
.mvp-action-save .floppy-icon{
  width:26px;
  height:26px;
}

@media(max-width:430px){
  .mvp-team-actions-two{gap:9px !important}
  .mvp-team-actions-two button{min-height:60px !important;padding:7px 4px !important}
  .mvp-action-svg{width:23px;height:23px}
  .randomiser-results-close{flex-basis:40px !important;width:40px !important;height:40px !important}
}


/* =========================================================
   v3.10.48 — Android Chrome browser compatibility
   ========================================================= */
html.android-browser,body.android-browser{
  height:auto !important;
  min-height:100% !important;
  overflow-y:auto !important;
  overscroll-behavior-y:auto !important;
  touch-action:pan-y pinch-zoom !important;
  -webkit-overflow-scrolling:touch;
}
body.android-browser .app-shell,
body.android-browser .tab-page,
body.android-browser main{
  height:auto !important;
  max-height:none !important;
  overflow-y:visible !important;
  touch-action:pan-y !important;
}


/* =========================================================
   v3.10.48 — Android PWA native vertical scrolling
   ========================================================= */

/* Apply to Android regardless of browser vs installed standalone mode.
   This deliberately leaves fixed header/bottom-nav chrome intact while
   restoring the page/document as the vertical scroll container. */
html.android-scrollable,
body.android-scrollable{
  height:auto !important;
  min-height:100% !important;
  max-height:none !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  overscroll-behavior-y:auto !important;
  touch-action:pan-y pinch-zoom !important;
  -webkit-overflow-scrolling:touch !important;
}

body.android-scrollable .app-shell,
body.android-scrollable main,
body.android-scrollable .tab-page,
body.android-scrollable .tab-page.active{
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  overflow-y:visible !important;
  overscroll-behavior-y:auto !important;
  touch-action:pan-y !important;
}

/* Keep horizontally animated page transitions from becoming accidental
   vertical scroll containers in Android standalone mode. */
body.android-scrollable .tab-page.page-enter-left,
body.android-scrollable .tab-page.page-enter-right{
  overflow-y:visible !important;
}

/* Do not let any inherited app-shell viewport lock capture vertical touch
   gestures on Android. */
body.android-scrollable .app-shell{
  position:relative !important;
}


/* v3.10.60 — splash version placement only */
.splash-version{
  position:static !important;
  left:auto !important;
  bottom:auto !important;
  transform:none !important;
  margin-top:14px !important;
  margin-bottom:0 !important;
  white-space:nowrap !important;
  color:rgba(255,255,255,.62) !important;
  font-size:13px !important;
  font-weight:500 !important;
  letter-spacing:.1px !important;
}
.splash-version + .splash-rule{margin-top:30px !important}


/* =========================================================
   v3.10.60 — player phone + attribute-based McBRS
   ========================================================= */
.dev-player-editor-head,.dev-player-row{
  grid-template-columns:minmax(0,1fr) 62px 42px 66px 36px !important;
  gap:7px !important;
}
.dev-phone-head{display:grid;place-items:center}
.dev-phone-head svg{width:17px;height:17px}
.dev-player-rating-label{
  width:100%;height:40px;border:1px solid #d6dce6;border-radius:10px;background:#f7f9fc;color:#101828;
  font-size:13px;font-weight:750;display:grid;place-items:center;padding:0;cursor:pointer
}
.dev-player-phone{
  width:32px!important;height:32px!important;min-width:32px!important;border-radius:9px!important;border:0!important;
  display:grid!important;place-items:center!important;margin:auto!important;padding:0!important
}
.dev-player-phone svg{width:17px;height:17px}
.dev-player-phone.has-phone{background:#d8f7e5!important;color:#079447!important}
.dev-player-phone.no-phone{background:transparent!important;color:#98a2b3!important;font-size:23px!important;font-weight:500!important}
.dev-player-phone.no-phone span{transform:translateY(-1px)}
@media(max-width:430px){
  .dev-player-editor-head,.dev-player-row{grid-template-columns:minmax(0,1fr) 48px 34px 52px 30px!important;gap:5px!important}
  .dev-player-editor-head{font-size:7px!important}
  .dev-player-rating-label{height:38px;font-size:12px}
  .dev-player-phone{width:29px!important;height:29px!important;min-width:29px!important}
  .dev-player-phone svg{width:15px;height:15px}
}

/* Bottom-sheet editors */
.dev-editor-tray{
  width:min(92vw,520px)!important;max-width:520px!important;padding:0!important;border:0!important;border-radius:22px 22px 0 0!important;
  position:fixed!important;left:50%!important;right:auto!important;top:auto!important;bottom:0!important;transform:translateX(-50%)!important;
  margin:0!important;background:#f7f9fc!important;color:#101828!important
}
.dev-editor-tray::backdrop{background:rgba(2,8,23,.62);backdrop-filter:blur(4px)}
.dev-editor-tray form{padding:18px 18px calc(18px + env(safe-area-inset-bottom));position:relative}
.dev-tray-grabber{width:46px;height:5px;border-radius:99px;background:#c8d0dc;margin:-7px auto 14px}
.dev-editor-tray h2{margin:0;font-size:22px}.dev-tray-player{margin:2px 0 14px;color:#667085;font-size:18px;font-weight:750}
.dev-tray-actions{display:grid;gap:9px;margin-top:14px}.dev-tray-actions button{width:100%}
.dev-phone-field{display:grid;grid-template-columns:52px minmax(0,1fr);gap:12px;align-items:center}
.dev-phone-big-icon{width:48px;height:48px;border-radius:50%;background:#0aa84f;color:#fff;display:grid;place-items:center;font-size:22px}
.dev-phone-input-wrap{display:grid;gap:6px}.dev-phone-input-wrap strong{font-size:12px;color:#475467}.dev-phone-input-wrap input{width:100%;box-sizing:border-box}
.mcbrs-editor{background:linear-gradient(180deg,#142131,#0d1826);border-radius:16px;padding:10px;color:#eaf2ff}
.ability-row{display:grid;grid-template-columns:38px 82px minmax(0,1fr) 42px;gap:8px;align-items:center;min-height:50px;border-bottom:1px solid rgba(255,255,255,.08)}
.ability-row:last-of-type{border-bottom:0}.ability-icon{font-size:26px;text-align:center}.ability-name{font-size:12px}
.ability-row input[type=range]{width:100%;accent-color:#ff7a1a}.ability-row output{border:1px solid #43536a;border-radius:9px;padding:7px 3px;text-align:center;font-weight:800;background:#152337}
.mcbrs-total{display:flex;justify-content:space-between;align-items:center;margin-top:10px;padding:12px;border:1px solid #3c4b60;border-radius:11px;background:#162437}
.mcbrs-total span{display:grid}.mcbrs-total small{color:#91a3ba;margin-top:3px}.mcbrs-total>strong{font-size:25px}
@media(max-width:430px){
  .dev-editor-tray{width:100%!important;max-width:none!important}
  .ability-row{grid-template-columns:34px 72px minmax(0,1fr) 38px;gap:6px}
  .ability-icon{font-size:23px}.ability-name{font-size:11px}
}


/* =========================================================
   v3.10.60 — compact Player Table + touch-first McBRS editor
   ========================================================= */
#devSettingsContent .dev-player-editor-head,
#devSettingsContent .dev-player-row{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 50px 32px 50px 30px!important;
  gap:5px!important;
  align-items:center!important;
  width:100%!important;
  min-width:0!important;
}
#devSettingsContent .dev-player-row{
  padding:7px!important;
  min-height:52px!important;
}
#devSettingsContent .dev-player-row>*{
  grid-row:1!important;
  min-width:0!important;
  max-width:100%!important;
  margin-top:0!important;
  margin-bottom:0!important;
}
#devSettingsContent .dev-player-name{height:38px!important;min-height:38px!important}
#devSettingsContent .dev-player-rating-label{height:32px!important;min-height:32px!important;padding:0!important;font-size:12px!important;font-weight:850!important}
#devSettingsContent .dev-player-phone{width:29px!important;height:29px!important;min-width:29px!important}
#devSettingsContent .selection-toggle{height:38px!important}
#devSettingsContent .selection-toggle span{width:27px!important;height:27px!important}
#devSettingsContent .remove-player{width:27px!important;min-width:27px!important;max-width:27px!important;height:27px!important;min-height:27px!important;font-size:18px!important}
@media(min-width:431px){
  #devSettingsContent .dev-player-editor-head,
  #devSettingsContent .dev-player-row{grid-template-columns:minmax(0,1fr) 60px 38px 62px 34px!important;gap:7px!important}
}
.mcbrs-red{color:#d92d20!important;background:#fff2f0!important;border-color:#f6b8b2!important}
.mcbrs-amber{color:#b54708!important;background:#fff7e8!important;border-color:#f4c77c!important}
.mcbrs-green{color:#067647!important;background:#ecfdf3!important;border-color:#86d5ac!important}

#devMcbrsDialog .ability-row{
  display:grid!important;
  grid-template-columns:36px 78px minmax(0,1fr)!important;
  gap:8px!important;
  align-items:center!important;
  min-height:54px!important;
  padding:7px 0!important;
}
#devMcbrsDialog .ability-icon{font-size:24px!important;line-height:1!important;text-align:center}
#devMcbrsDialog .ability-name{font-size:12px!important}
#devMcbrsDialog .ability-stepper{
  display:grid;grid-template-columns:42px minmax(42px,1fr) 42px;align-items:center;
  min-height:42px;border:1px solid #43536a;border-radius:10px;overflow:hidden;background:#0d1724;
}
#devMcbrsDialog .ability-step{
  width:42px!important;height:42px!important;min-height:42px!important;margin:0!important;padding:0!important;
  border:0!important;border-radius:0!important;background:#223149!important;color:#fff!important;
  font-size:23px!important;font-weight:700!important;line-height:1!important;touch-action:manipulation!important;
  -webkit-tap-highlight-color:transparent;
}
#devMcbrsDialog .ability-step:active{transform:scale(.92)}
#devMcbrsDialog .ability-stepper output{
  min-width:0;text-align:center;font-size:16px;font-weight:900;color:#fff;background:transparent;border:0;padding:0
}
#devMcbrsTotal.mcbrs-red,#devMcbrsTotal.mcbrs-amber,#devMcbrsTotal.mcbrs-green{
  background:transparent!important;border:0!important;
}


/* v3.10.60 — auto-save player table + polished native McBRS sliders */
#devSettingsContent .dev-bottom-actions{grid-template-columns:auto 1fr!important}
#devSettingsContent .dev-autosave-status{justify-self:end;font-size:11px;font-weight:750;color:#667085;white-space:nowrap}
#devSettingsContent .dev-autosave-status[data-state="saving"],#devSettingsContent .dev-autosave-status[data-state="pending"]{color:#b54708}
#devSettingsContent .dev-autosave-status[data-state="saved"]{color:#067647}
#devSettingsContent .dev-autosave-status[data-state="error"]{color:#d92d20}
#devMcbrsDialog .mcbrs-editor{padding:10px 12px;background:linear-gradient(180deg,#142235,#0b1725);border:1px solid #2c415b}
#devMcbrsDialog .ability-row{grid-template-columns:42px 76px minmax(0,1fr) 42px!important;gap:8px!important;min-height:62px!important;padding:5px 0!important}
#devMcbrsDialog .ability-icon{width:34px;height:34px;display:grid;place-items:center;filter:drop-shadow(0 0 6px currentColor)}
#devMcbrsDialog .ability-icon svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
#devMcbrsDialog .ability-name{font-size:12px!important;font-weight:700}
#devMcbrsDialog .ability-slider-wrap{min-width:0;display:grid;gap:1px}
#devMcbrsDialog .ability-range-labels{display:flex;justify-content:space-between;color:#8fa4c1;font-size:8px;padding:0 1px}
#devMcbrsDialog .ability-range-labels i{font-style:normal}
#devMcbrsDialog .ability-row output{height:34px;display:grid;place-items:center;padding:0!important;border:1px solid #40536d;border-radius:8px;background:#0d1a2a;font-size:14px;font-weight:900;color:currentColor}
#devMcbrsDialog .ability-row{color:#ffbd2e}
#devMcbrsDialog .ability-row.ability-red{color:#ff5158}
#devMcbrsDialog .ability-row.ability-amber{color:#ffbd2e}
#devMcbrsDialog .ability-row.ability-green{color:#38e783}
#devMcbrsDialog input[type="range"]{-webkit-appearance:none;appearance:none;width:100%;height:28px;margin:0;background:transparent;touch-action:pan-x!important;overscroll-behavior:contain}
#devMcbrsDialog input[type="range"]::-webkit-slider-runnable-track{height:7px;border-radius:99px;background:linear-gradient(to right,currentColor 0 var(--ability-progress,66.67%),#42536a var(--ability-progress,66.67%) 100%)}
#devMcbrsDialog input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;border-radius:50%;background:#fff;border:1px solid #d8dee8;margin-top:-7.5px;box-shadow:0 2px 7px #0005}
#devMcbrsDialog input[type="range"]::-moz-range-track{height:7px;border-radius:99px;background:#42536a}
#devMcbrsDialog input[type="range"]::-moz-range-progress{height:7px;border-radius:99px;background:currentColor}
#devMcbrsDialog input[type="range"]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#fff;border:1px solid #d8dee8}
#devMcbrsDialog .tray-autosave-note{display:block;text-align:center;color:#38d977;font-size:11px;font-weight:700;margin-top:2px}
#devMcbrsDialog .dev-tray-actions{grid-template-columns:1fr!important}
#devMcbrsDialog .dev-tray-actions .primary{margin-bottom:2px}
@media(max-width:430px){#devMcbrsDialog .ability-row{grid-template-columns:38px 66px minmax(0,1fr) 38px!important;gap:6px!important}}


/* =========================================================
   v3.10.60 — exact UX icons + iOS PWA range repair
   ========================================================= */

/* These silhouettes are extracted directly from the approved UX mock-up.
   The same alpha mask is recoloured by each row's red/amber/green currentColor. */
#devMcbrsDialog .ux-ability-icon{
  width:40px!important;
  height:40px!important;
  display:block!important;
  background:currentColor!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center!important;
  mask-position:center!important;
  -webkit-mask-size:contain!important;
  mask-size:contain!important;
  filter:drop-shadow(0 0 7px currentColor)!important;
}
#devMcbrsDialog .ux-attacking{-webkit-mask-image:url("mcbrs-attacking.png?v=3.10.66")!important;mask-image:url("mcbrs-attacking.png?v=3.10.66")!important}
#devMcbrsDialog .ux-defending{-webkit-mask-image:url("mcbrs-defending.png?v=3.10.66")!important;mask-image:url("mcbrs-defending.png?v=3.10.66")!important}
#devMcbrsDialog .ux-pace{-webkit-mask-image:url("mcbrs-pace.png?v=3.10.66")!important;mask-image:url("mcbrs-pace.png?v=3.10.66")!important}
#devMcbrsDialog .ux-skill{-webkit-mask-image:url("mcbrs-skill.png?v=3.10.66")!important;mask-image:url("mcbrs-skill.png?v=3.10.66")!important}
#devMcbrsDialog .ux-strength{-webkit-mask-image:url("mcbrs-strength.png?v=3.10.66")!important;mask-image:url("mcbrs-strength.png?v=3.10.66")!important}

/* Use the native WebKit range control for the interaction itself.
   Crucially, do not impose pan-x/touch capture here; the global iOS PWA
   gesture blocker now explicitly leaves these inputs alone. */
#devMcbrsDialog .ability-slider-wrap{
  min-width:0!important;
  overflow:visible!important;
  padding:0!important;
}
#devMcbrsDialog input[type="range"]{
  -webkit-appearance:none!important;
  appearance:none!important;
  display:block!important;
  width:100%!important;
  height:34px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  touch-action:auto!important;
  -webkit-user-select:none!important;
  user-select:none!important;
  overscroll-behavior:auto!important;
}
#devMcbrsDialog input[type="range"]::-webkit-slider-runnable-track{
  width:100%!important;
  height:8px!important;
  border-radius:99px!important;
  background:linear-gradient(to right,currentColor 0 var(--ability-progress,66.67%),#42536a var(--ability-progress,66.67%) 100%)!important;
  box-shadow:none!important;
}
#devMcbrsDialog input[type="range"]::-webkit-slider-thumb{
  -webkit-appearance:none!important;
  appearance:none!important;
  width:28px!important;
  height:28px!important;
  border-radius:50%!important;
  background:#fff!important;
  border:1px solid #d8dee8!important;
  margin-top:-10px!important;
  box-shadow:0 2px 8px #0006!important;
}

/* Extend the native range's interaction geometry by half a thumb on either
   side so the white thumb visually reaches the full ends of the slider bar. */
@supports (-webkit-touch-callout:none){
  #devMcbrsDialog .ability-slider-wrap{
    padding-left:14px!important;
    padding-right:14px!important;
  }
  #devMcbrsDialog input[type="range"]{
    width:calc(100% + 28px)!important;
    margin-left:-14px!important;
  }
  #devMcbrsDialog .ability-range-labels{
    margin-left:-2px!important;
    margin-right:-2px!important;
  }
}


/* =========================================================
   v3.10.60 — SMS Defaults + rich Welcome formatting
   ========================================================= */

/* SMS lane heading must use exactly the same weight/size treatment as peers. */
.sms-lane-head{
  font-family:inherit!important;
  font-size:10px!important;
  font-weight:850!important;
  line-height:1.05!important;
}
.sms-lane-head strong{
  font-size:inherit!important;
  font-weight:850!important;
  line-height:inherit!important;
}
.sms-lane-head .lane-count{font-weight:800!important}

/* Three compact Dev Settings tabs. */
.dev-settings-tabs{grid-template-columns:repeat(3,minmax(0,1fr))!important}
@media(max-width:430px){
  .dev-settings-tabs{gap:5px!important}
  .dev-settings-tab{font-size:9.5px!important;padding-left:5px!important;padding-right:5px!important}
}

/* Safe markdown-style formatting controls for Introduction and Rules. */
.rich-edit-toolbar{
  display:flex;align-items:center;gap:6px;margin:0 0 6px;color:var(--muted);font-size:10px
}
.rich-edit-toolbar>span:last-child{margin-left:3px}
.rich-format-btn{
  width:30px!important;height:28px!important;min-height:28px!important;padding:0!important;border:1px solid #cfd7e3!important;
  border-radius:8px!important;background:#f4f6f9!important;color:#25324a!important;display:grid!important;place-items:center!important
}
.rich-format-btn:active{transform:scale(.94)}
.dev-rule-editor-wrap{display:block;min-width:0;width:100%}
.rich-rule-toolbar{margin-bottom:4px}
.dev-rule-row{align-items:start!important}
.dev-rule-number{margin-top:31px}
.welcome-rich-text>p{margin:0 0 .85em}
.welcome-rich-text>p:last-child{margin-bottom:0}
.welcome-rich-text strong{font-weight:850;color:inherit}
.welcome-rich-text em{font-style:italic}
.welcome-rule-text{display:block!important;min-width:0}

/* SMS Defaults pane */
#devSelectionSms{width:100%;min-height:120px;border:1px solid #d2d9e5;border-radius:11px;background:#fff;color:var(--ink);font:inherit;font-size:12.5px;line-height:1.45;padding:10px 11px;resize:vertical}
.dev-sms-default-footer{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:5px}
.dev-sms-default-footer .dev-char-count{margin-top:0;text-align:left}


/* =========================================================
   v3.10.60 — Team Ability strips + percentage balance
   ========================================================= */
.team-ability-strip{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:0;
  margin:10px 0 9px;
  padding:8px 5px 7px;
  border:1px solid #31445d;
  border-radius:12px;
  background:linear-gradient(180deg,#111d2b,#0c1724);
  overflow:hidden;
}
.team-ability-stat{
  min-width:0;
  display:grid;
  justify-items:center;
  align-content:start;
  gap:2px;
  padding:0 3px;
  border-right:1px solid #33475e;
  color:#fff;
}
.team-ability-stat:last-child{border-right:0}
.team-ability-stat .team-ability-icon{
  width:27px!important;
  height:27px!important;
  display:block!important;
  background:currentColor!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center!important;
  mask-position:center!important;
  -webkit-mask-size:contain!important;
  mask-size:contain!important;
  filter:drop-shadow(0 0 5px currentColor)!important;
}
.team-ability-stat.ability-red{color:#ff525a}
.team-ability-stat.ability-amber{color:#ffbd36}
.team-ability-stat.ability-green{color:#31e879}
.team-ability-label{
  width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  text-align:center;
  color:#d5dfec;
  font-size:7.5px;
  line-height:1.1;
}
.team-ability-stat strong{
  margin-top:2px;
  font-size:11px;
  line-height:1;
  color:currentColor;
}
.mvp-team-head{margin-bottom:0!important}
.mvp-team-head p{margin-bottom:0!important}
.randomiser-results-heading #balanceMessage{
  font-variant-numeric:tabular-nums;
}

@media(max-width:430px){
  .team-ability-strip{padding-left:3px;padding-right:3px}
  .team-ability-stat{padding-left:1px;padding-right:1px}
  .team-ability-stat .team-ability-icon{width:24px!important;height:24px!important}
  .team-ability-label{font-size:6.8px}
  .team-ability-stat strong{font-size:10.5px}
}

/* Reuse the exact approved UX icon masks from McBRS. */
.team-ability-stat .ux-attacking{-webkit-mask-image:url("mcbrs-attacking.png?v=3.10.66")!important;mask-image:url("mcbrs-attacking.png?v=3.10.66")!important}
.team-ability-stat .ux-defending{-webkit-mask-image:url("mcbrs-defending.png?v=3.10.66")!important;mask-image:url("mcbrs-defending.png?v=3.10.66")!important}
.team-ability-stat .ux-pace{-webkit-mask-image:url("mcbrs-pace.png?v=3.10.66")!important;mask-image:url("mcbrs-pace.png?v=3.10.66")!important}
.team-ability-stat .ux-skill{-webkit-mask-image:url("mcbrs-skill.png?v=3.10.66")!important;mask-image:url("mcbrs-skill.png?v=3.10.66")!important}
.team-ability-stat .ux-strength{-webkit-mask-image:url("mcbrs-strength.png?v=3.10.66")!important;mask-image:url("mcbrs-strength.png?v=3.10.66")!important}

/* =========================================================
   v3.10.60 — wider teams, 1–20 abilities, compact Pending, reports
   ========================================================= */

/* Tonight's Teams: reclaim width from the outer card and nested ability box. */
.randomiser-results{padding-left:8px!important;padding-right:8px!important}
.randomiser-results-heading{padding-left:5px;padding-right:5px}
.mvp-team-grid{gap:7px!important}
.mvp-team-card{padding-left:8px!important;padding-right:8px!important}
.team-ability-strip{
  width:calc(100% + 16px)!important;
  margin-left:-8px!important;
  margin-right:-8px!important;
  padding:8px 7px 7px!important;
  border:0!important;
  border-top:1px solid #26384c!important;
  border-bottom:1px solid #26384c!important;
  border-radius:0!important;
  background:transparent!important;
}
.team-ability-label{font-size:7.6px!important}
@media(max-width:430px){
  .randomiser-results{padding-left:7px!important;padding-right:7px!important}
  .mvp-team-grid{gap:6px!important}
  .mvp-team-card{padding-left:7px!important;padding-right:7px!important}
  .team-ability-strip{width:calc(100% + 14px)!important;margin-left:-7px!important;margin-right:-7px!important;padding-left:5px!important;padding-right:5px!important}
  .team-ability-label{font-size:7px!important}
}

/* Pending heading is tappable but visually identical to the neighbouring lane heads. */
.pending-lane-head{width:100%;border:0;cursor:pointer;font:inherit}
.pending-lane-head:active{filter:brightness(.97)}

/* Pending cards: Accepted-card height while preserving the existing 35px action strip. */
.asked-card:not(.declined-in-place){min-height:54px!important;height:54px!important}
.asked-card:not(.declined-in-place) > .selection-player-name{
  min-height:19px!important;height:19px!important;flex:0 0 19px!important;line-height:19px!important;
  padding:0 5px!important;font-size:10.5px!important;text-align:center!important
}
.asked-card .selection-card-actions,.asked-card .selection-card-action{height:35px!important;flex-basis:35px!important}
@media(max-width:700px){
  .asked-card:not(.declined-in-place){min-height:54px!important;height:54px!important}
  .asked-card:not(.declined-in-place) > .selection-player-name{min-height:19px!important;height:19px!important;flex-basis:19px!important;line-height:19px!important;font-size:10px!important}
}

/* Match Report lower CTA used in both admin edit and view-only match cards. */
.match-report-cta{
  width:100%;min-height:46px;margin-top:10px;padding:7px 10px;border:1px solid #cfd8e5;border-radius:11px;
  background:#f7f9fc;color:#172033;display:grid;grid-template-columns:28px auto 1fr auto;gap:8px;align-items:center;
  text-align:left;font-weight:850;font-size:12px;box-shadow:none
}
.match-report-cta:active{transform:scale(.99);background:#f0f4f9}
.match-report-icon{width:26px;height:24px;display:block;color:#172033}
.match-report-cta-detail{justify-self:end;color:#68758a;font-size:10px;font-weight:700}
.match-report-chevron{font-size:23px;line-height:1;color:#68758a;font-weight:500}
.history-match-report-cta{margin-top:10px}

/* Match report tray — edit and read-only viewing share the same tray. */
.match-report-dialog form{padding-top:22px!important}
.match-report-title-row{display:flex;gap:10px;align-items:flex-start;padding-right:38px;margin-bottom:12px}
.match-report-title-icon{width:34px;height:30px;flex:0 0 auto;color:#172033}
.match-report-title-row h2{margin:0 0 2px;font-size:24px}
.match-report-title-row p{margin:0!important}
#matchReportText{min-height:260px;max-height:52vh;font-size:15px;line-height:1.5}
.match-report-view{min-height:180px;max-height:56vh;overflow:auto;border:1px solid #d5dce7;border-radius:12px;padding:14px;background:#fff;color:#172033;font-size:15px;line-height:1.55}
.match-report-view p{margin:0 0 1em}.match-report-view p:last-child{margin-bottom:0}
.match-report-actions{margin-top:12px!important}.match-report-actions .danger{border:1px solid #ef5350;background:#fff1f1;color:#d52626}
@media(max-width:430px){
  .match-report-cta{grid-template-columns:25px auto 1fr auto;padding-left:8px;padding-right:8px;gap:6px}
  .match-report-icon{width:23px;height:22px}
  .match-report-title-row h2{font-size:22px}
}


/* =========================================================
   v3.10.60 — iPhone-mini ability width, compact Declined, report placement
   ========================================================= */
/* Reclaim every useful pixel around the generated teams. */
.randomiser-results{padding-left:4px!important;padding-right:4px!important}
.randomiser-results-heading{padding-left:3px!important;padding-right:3px!important}
.mvp-team-grid{gap:4px!important}
.mvp-team-card{padding-left:5px!important;padding-right:5px!important}
.team-ability-strip{
  width:calc(100% + 10px)!important;
  margin-left:-5px!important;margin-right:-5px!important;
  padding-left:0!important;padding-right:0!important;
}
.team-ability-stat{padding-left:0!important;padding-right:0!important}
.team-ability-label{
  width:auto!important;max-width:none!important;
  overflow:visible!important;text-overflow:clip!important;white-space:nowrap!important;
  font-size:7px!important;letter-spacing:-.12px!important;
}
@media(max-width:390px){
  .randomiser-results{padding-left:3px!important;padding-right:3px!important}
  .mvp-team-grid{gap:3px!important}
  .mvp-team-card{padding-left:4px!important;padding-right:4px!important}
  .team-ability-strip{width:calc(100% + 8px)!important;margin-left:-4px!important;margin-right:-4px!important}
  .team-ability-label{font-size:6.6px!important;letter-spacing:-.18px!important}
  .team-ability-stat .team-ability-icon{width:23px!important;height:23px!important}
}

/* Declined Pending cards use the same compact card height as Accepted. */
.asked-card.declined-in-place{
  min-height:54px!important;height:54px!important;
  padding:0!important;gap:0!important;justify-content:center!important;
}
.asked-card.declined-in-place > .selection-player-name{
  min-height:24px!important;height:24px!important;flex:0 0 24px!important;
  padding:4px 3px 0!important;line-height:20px!important;font-size:11px!important;
  display:block!important;white-space:nowrap!important;text-overflow:clip!important;
}
.asked-card.declined-in-place .declined-card-label{
  height:20px!important;line-height:18px!important;padding:0 3px 4px!important;font-size:10px!important;
}
@media(max-width:700px){.asked-card.declined-in-place{min-height:54px!important;height:54px!important}}

/* Match Report belongs to the result: compact centred pill between score and teams. */
.history-match-report-cta{
  width:max-content!important;max-width:calc(100% - 20px)!important;
  min-height:0!important;height:38px!important;
  margin:5px auto 9px!important;padding:4px 12px!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  gap:8px!important;border-radius:13px!important;text-align:center!important;font-size:12px!important;
}
.match-report-icon{width:28px!important;height:26px!important;object-fit:contain!important;display:block!important}
.match-report-chevron{font-size:21px!important;line-height:1!important;margin-left:1px!important}
.match-report-cta-detail{display:none!important}
.match-report-title-icon{width:38px!important;height:35px!important;object-fit:contain!important;display:block!important}
@media(max-width:430px){
  .history-match-report-cta{height:36px!important;padding:3px 10px!important;gap:7px!important;margin-top:4px!important;margin-bottom:8px!important}
  .match-report-icon{width:26px!important;height:24px!important}
}


/* v3.10.60 — Match Report access semantics and alignment */
.history-match-report-cta{display:flex!important;margin-left:auto!important;margin-right:auto!important;}
#editMatchReportBtn{width:100%!important;display:flex!important;align-items:center!important;justify-content:center!important;grid-template-columns:none!important;gap:10px!important;text-align:center!important;}
#editMatchReportBtn .match-report-chevron{position:absolute!important;right:18px!important;}
#editMatchReportBtn{position:relative!important;}
#editMatchReportBtn .match-report-icon{flex:0 0 auto!important;}
\n\n/* =========================================================\n   v3.10.60 — Published Lineups\n   ========================================================= */\n/* The ability strip supplies the single separator; remove the old header rule. */\n#resultsSection .mvp-team-head{border-bottom:0!important}\n\n.lineups-panel{overflow:hidden}\n.lineups-heading{margin-bottom:14px}\n.lineups-content{min-height:260px}\n.lineups-team-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}\n.lineups-team{border:2px solid;border-radius:16px;padding:10px 8px;background:#0d1825;color:#fff;overflow:hidden}\n.lineups-team-orange{border-color:#ff7a1a}.lineups-team-blue{border-color:#2da9ff}\n.lineups-team-head{display:flex;align-items:center;gap:9px;padding:1px 2px 10px}\n.lineups-team-head h3{margin:0;font-size:19px;line-height:1;color:#fff}\n.lineups-team-orange h3{color:#ff8a29}.lineups-team-blue h3{color:#36b0ff}\n.lineups-team ul{list-style:none;margin:0;padding:0;border-top:1px solid #26384c}\n.lineups-team li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:9px;align-items:center;min-height:51px;padding:8px 3px;border-bottom:1px solid #26384c}\n.lineups-team li:last-child{border-bottom:0}.lineups-team li strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n.lineups-team .mvp-shirt{width:27px;height:24px}\n.lineups-empty{text-align:center;padding:48px 12px 42px;color:#68758a}\n.lineups-empty-icon{font-size:38px;color:#8494aa;margin-bottom:12px}.lineups-empty h3{margin:0 0 10px;color:#172033;font-size:20px}.lineups-empty p{margin:5px auto;max-width:330px;line-height:1.45}\n\n.history-item-published{border:2px solid #8b5cf6!important;box-shadow:0 0 0 2px rgba(139,92,246,.13),0 0 16px rgba(139,92,246,.25)!important}\n.history-publish-btn{border:0;border-radius:9px;min-height:32px;padding:6px 9px;background:#7c3aed;color:#fff;font-size:11px;font-weight:850;box-shadow:0 3px 10px rgba(124,58,237,.22);white-space:nowrap}\n.history-publish-btn.is-published{background:#6d28d9}\n.history-publish-btn:active{transform:scale(.96)}\n.history-footer-row .history-publish-btn{flex:0 0 auto}\n\n@media(max-width:430px){\n  .lineups-team-grid{gap:5px}.lineups-team{padding:8px 5px;border-radius:14px}.lineups-team-head{gap:6px}.lineups-team-head h3{font-size:17px}\n  .lineups-team li{grid-template-columns:24px minmax(0,1fr);gap:6px;min-height:47px;padding:7px 2px}.lineups-team li strong{font-size:12px}.lineups-team .mvp-shirt{width:23px;height:21px}\n  .history-footer-row{gap:4px}.history-footer-row .history-actions{gap:4px!important}.history-footer-row .history-actions button,.history-publish-btn{font-size:9.5px!important;padding-left:6px!important;padding-right:6px!important}\n}\n
/* =========================================================
   v3.10.60 — published Lineups UX correction
   Reference: approved three-screen mock-up, 9 Sep 2026.
   ========================================================= */
/* Randomiser: exactly one rule between team summary and ability strip. */
#resultsSection .mvp-team-head{border-bottom:0!important;padding-bottom:8px!important}
#resultsSection .team-ability-strip{border-top:1px solid #26384c!important;margin-top:0!important}

/* Published match state and single-row admin actions. */
.history-item.history-item-published{
  border:2px solid #9b4dff!important;
  box-shadow:0 0 0 2px rgba(155,77,255,.16),0 0 15px rgba(155,77,255,.34)!important;
}
.history-footer-row{
  display:grid!important;
  grid-template-columns:minmax(0,1.55fr) minmax(0,1.12fr) minmax(0,.95fr) 36px!important;
  align-items:stretch!important;
  gap:5px!important;
  margin-top:8px!important;
}
.history-footer-row>button{min-width:0!important;width:100%!important;margin:0!important;min-height:34px!important;padding:6px 5px!important;border-radius:9px!important;font-size:10px!important;font-weight:850!important;white-space:nowrap!important}
.history-footer-row .history-copy-btn{width:36px!important;min-width:36px!important;max-width:36px!important;margin:0!important}
.history-publish-btn{background:#16b867!important;color:#fff!important;box-shadow:0 3px 10px rgba(22,184,103,.22)!important}
.history-publish-btn.is-published{background:#e63b3b!important;color:#fff!important;box-shadow:0 3px 10px rgba(230,59,59,.20)!important}
@media(max-width:390px){
  .history-footer-row{grid-template-columns:minmax(0,1.52fr) minmax(0,1.08fr) minmax(0,.92fr) 32px!important;gap:4px!important}
  .history-footer-row>button{font-size:8.8px!important;padding-left:3px!important;padding-right:3px!important;min-height:32px!important}
  .history-footer-row .history-copy-btn{width:32px!important;min-width:32px!important;max-width:32px!important}
}

/* User Lineups: approved two-column dark team cards; names only. */
.lineups-panel{overflow:hidden}
.lineups-heading .screen-heading-copy{align-items:flex-start}
.lineups-heading .lineups-group-icon{flex:0 0 24px;width:24px;height:24px}
.lineups-content{min-height:260px}
.lineups-team-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
.lineups-team{border:2px solid;border-radius:14px;padding:9px 7px;background:#0d1825!important;color:#fff;overflow:hidden;box-shadow:none!important}
.lineups-team-orange{border-color:#ff7a1a}.lineups-team-blue{border-color:#2da9ff}
.lineups-team-head{display:flex;align-items:center;gap:8px;padding:2px 2px 10px}
.lineups-team-head h3{margin:0;font-size:18px;line-height:1;font-weight:850}.lineups-team-orange h3{color:#ff8a29}.lineups-team-blue h3{color:#36b0ff}
.lineups-team ul{list-style:none!important;margin:0!important;padding:0!important;border-top:0!important}
.lineups-team li{display:grid!important;grid-template-columns:27px minmax(0,1fr)!important;gap:8px!important;align-items:center!important;min-height:45px!important;padding:7px 2px!important;border-bottom:1px solid #26384c!important;background:transparent!important}
.lineups-team li:last-child{border-bottom:0!important}.lineups-team li strong{font-size:13px!important;color:#fff!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lineups-team .mvp-shirt{width:26px;height:23px}
.lineups-kickoff{margin-top:12px;border:1px solid #304157;border-radius:12px;background:#101d2b;color:#d9e4f2;display:flex;gap:12px;align-items:flex-start;padding:12px 14px}
.lineups-kickoff-clock{width:24px;height:24px;border:2px solid #b9c9dc;border-radius:50%;position:relative;flex:0 0 24px;margin-top:1px}
.lineups-kickoff-clock:before{content:"";position:absolute;width:2px;height:7px;background:#b9c9dc;left:10px;top:4px;border-radius:2px;transform-origin:bottom center}
.lineups-kickoff-clock:after{content:"";position:absolute;width:6px;height:2px;background:#b9c9dc;left:10px;top:10px;border-radius:2px;transform:rotate(28deg);transform-origin:left center}
.lineups-kickoff strong,.lineups-kickoff span{display:block}.lineups-kickoff strong{font-size:14px;color:#fff;margin-bottom:3px}.lineups-kickoff span{font-size:12px;line-height:1.45}
@media(max-width:390px){
  .lineups-team-grid{gap:5px!important}.lineups-team{padding:8px 5px}.lineups-team-head{gap:5px}.lineups-team-head h3{font-size:16px}
  .lineups-team li{grid-template-columns:23px minmax(0,1fr)!important;gap:5px!important;min-height:43px!important;padding:6px 1px!important}.lineups-team li strong{font-size:11.5px!important}.lineups-team .mvp-shirt{width:22px;height:20px}
}

/* Player mode is exactly Welcome / Lineups / Matches / Rankings. */
.bottom-nav.player-nav{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.bottom-nav.player-nav .tab{font-size:9px!important}
.bottom-nav .lineups-group-icon{width:20px!important;height:20px!important}

/* =========================================================
   v3.10.63 — Lineups empty state + player history cleanup
   ========================================================= */
.lineups-empty{
  text-align:center;
  padding:26px 14px 18px;
  color:#68758a;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.lineups-empty-visual{
  position:relative;
  width:210px;
  height:145px;
  margin:4px auto 18px;
  border-radius:48% 52% 46% 54%;
  background:linear-gradient(135deg,#eef3fb 0%,#e4ebf6 100%);
}
.lineups-calendar-icon{
  position:absolute;
  left:60px;
  top:34px;
  width:92px;
  height:78px;
  border:8px solid #6f7e93;
  border-radius:10px;
  box-sizing:border-box;
  background:#f7f9fc;
}
.lineups-calendar-icon::before{
  content:"";
  position:absolute;
  left:-8px;
  right:-8px;
  top:17px;
  height:8px;
  background:#6f7e93;
}
.lineups-calendar-icon::after{
  content:"";
  position:absolute;
  left:18px;
  top:-16px;
  width:10px;
  height:24px;
  border-radius:5px;
  background:#6f7e93;
  box-shadow:38px 0 0 #6f7e93;
}
.lineups-calendar-icon i{
  position:absolute;
  width:11px;
  height:11px;
  border-radius:3px;
  background:#8493a8;
}
.lineups-calendar-icon i:nth-child(1){left:14px;top:34px}.lineups-calendar-icon i:nth-child(2){left:37px;top:34px}.lineups-calendar-icon i:nth-child(3){left:60px;top:34px}.lineups-calendar-icon i:nth-child(4){left:14px;top:54px}.lineups-calendar-icon i:nth-child(5){left:37px;top:54px}.lineups-calendar-icon i:nth-child(6){left:60px;top:54px}
.lineups-clock-icon{
  position:absolute;
  left:126px;
  top:78px;
  width:58px;
  height:58px;
  border:7px solid #6f7e93;
  border-radius:50%;
  background:#f7f9fc;
  box-shadow:0 5px 10px rgba(28,39,55,.15);
}
.lineups-clock-icon::before{
  content:"";
  position:absolute;
  left:25px;
  top:12px;
  width:6px;
  height:20px;
  border-radius:3px;
  background:#6f7e93;
  transform-origin:bottom center;
}
.lineups-clock-icon::after{
  content:"";
  position:absolute;
  left:27px;
  top:27px;
  width:17px;
  height:6px;
  border-radius:3px;
  background:#6f7e93;
  transform:rotate(38deg);
  transform-origin:left center;
}
.lineups-empty h3{margin:0 0 14px;color:#172033;font-size:25px;line-height:1.12;font-weight:900}
.lineups-empty-copy{margin:0 auto 26px!important;max-width:360px!important;font-size:18px;line-height:1.5!important;color:#68758a}
.lineups-empty-info{
  width:100%;
  display:grid;
  grid-template-columns:48px minmax(0,1fr);
  gap:14px;
  align-items:start;
  box-sizing:border-box;
  text-align:left;
  padding:18px 18px;
  border-radius:18px;
  background:#edf3fb;
  color:#637187;
}
.lineups-empty-info p{margin:0!important;max-width:none!important;font-size:15px;line-height:1.42!important}
.lineups-info-icon{
  width:42px;height:42px;border:3px solid #617da4;border-radius:50%;
  display:grid;place-items:center;box-sizing:border-box;color:#617da4;font-weight:900;font-size:24px;font-family:Georgia,serif;
}
@media(max-width:430px){
  .lineups-empty{padding:22px 8px 14px}
  .lineups-empty-visual{width:185px;height:128px;margin-bottom:16px;transform:scale(.92)}
  .lineups-empty h3{font-size:22px}
  .lineups-empty-copy{font-size:16px}
  .lineups-empty-info{grid-template-columns:40px minmax(0,1fr);gap:10px;padding:15px 14px}
  .lineups-info-icon{width:36px;height:36px;font-size:20px}
  .lineups-empty-info p{font-size:14px}
}


/* =========================================================
   v3.10.66 — McBRS display hotfix
   ========================================================= */
.history-team-head{min-width:0}
.history-team-head strong{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.history-team-head .mcbrs-pill{flex:0 0 auto;max-width:58%;overflow:hidden;text-overflow:ellipsis}


/* v3.10.66 — Match Report metadata is deliberately two lines. */
#matchReportMeta{white-space:pre-line;}


/* v3.10.66 — Financials payment chase contact tray */
.payment-contact-trigger{appearance:none;border:0;font:inherit;cursor:pointer}
.payment-contact-trigger:active{transform:scale(.95)}
.contact-payment-sheet{max-height:88dvh;overflow:auto}
.contact-payment-heading h2{display:flex;align-items:center;gap:8px}
.contact-payment-summary{display:grid;grid-template-columns:1fr .72fr 1.25fr;margin:16px 0;background:#fff;border:1px solid #d8e0ec;border-radius:14px;overflow:hidden}
.contact-payment-summary>div{padding:11px 14px;border-right:1px solid #d8e0ec;min-width:0}
.contact-payment-summary>div:last-child{border-right:0}
.contact-payment-summary span{display:block;color:#667085;font-size:11px;margin-bottom:4px}
.contact-payment-summary strong{font-size:20px;line-height:1.12}
.contact-date-list{display:flex!important;flex-direction:column;gap:2px;font-size:13px!important}
.ask-payment-btn{width:100%;min-height:52px;margin:0;background:#ff7417!important;font-size:16px;font-weight:900}
.ask-payment-btn::before{content:"💬";margin-right:8px}
.ask-payment-btn:disabled{opacity:.5;cursor:default}
.contact-history-section{margin-top:16px;padding-top:14px;border-top:1px solid #cdd5e2}
.contact-history-section h3{margin:0 0 10px;font-size:14px}
.contact-message-history{display:flex;flex-direction:column;gap:9px}
.contact-history-card{background:#fff;border:1px solid #d8e0ec;border-radius:12px;padding:10px 12px;box-shadow:0 2px 7px rgba(18,31,52,.04)}
.contact-history-card time{display:block;color:#667085;font-size:11px;margin-bottom:6px}
.contact-history-card div{font-size:12px;line-height:1.42;color:#172033}
.contact-history-empty{margin:0;background:#fff;border:1px solid #d8e0ec;border-radius:12px;padding:12px;color:#667085;font-size:12px}
@media(max-width:520px){
 .contact-payment-summary{grid-template-columns:1.1fr .65fr 1.15fr}
 .contact-payment-summary>div{padding:10px 8px}
 .contact-payment-summary strong{font-size:17px}
 .contact-payment-summary span{font-size:10px}
 .contact-date-list{font-size:12px!important}
}

/* v3.10.67 — editable payment chase copy + deletable chase history */
.dev-sms-placeholder-help{margin:0 0 8px;color:#667085;line-height:1.45}
.dev-sms-placeholder-help code{background:#eef2f8;border-radius:6px;padding:1px 4px;font-size:.9em}
.contact-history-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}
.contact-history-head time{margin:0!important;min-width:0}
.contact-history-delete{appearance:none;border:0;background:#fff0f0;color:#c62828;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;flex:0 0 30px;font-size:14px;cursor:pointer}
.contact-history-delete:active{transform:scale(.94)}


/* =========================================================
   v3.10.68 — PWA Man of the Match voting
   ========================================================= */
.history-player-name{display:inline-flex;align-items:center;gap:5px;min-width:0}.motm-winner-medal{border:0;background:transparent;padding:0 1px;margin:0;line-height:1;font-size:17px;cursor:pointer;filter:drop-shadow(0 1px 1px rgba(0,0,0,.16))}.motm-winner-medal:active{transform:scale(.92)}
.motm-sheet{position:relative;text-align:center}.motm-close{position:absolute!important;right:15px!important;top:14px!important}.motm-medal{font-size:42px;line-height:1;margin:3px auto 8px}.motm-sheet h2{margin:0 35px 6px}.motm-sheet p{color:#667085}.motm-deadline{font-size:12px;margin:4px 0 14px}.motm-primary,.motm-secondary{width:100%;margin-top:8px}.motm-picker-sheet{max-height:88dvh;overflow:auto}.motm-picker-date{margin:0!important;font-size:13px}.motm-picker-score{font-weight:900;font-size:20px;margin:5px 0 13px}.motm-team-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;text-align:left}.motm-team{border-radius:16px;padding:10px 8px 8px}.motm-team-orange{background:#fff4eb;border:1px solid #ffd2b4}.motm-team-blue{background:#edf7ff;border:1px solid #c8e7ff}.motm-team h3{display:flex;align-items:center;gap:7px;margin:0 4px 8px;font-size:15px}.motm-team-orange h3{color:#ff6b00}.motm-team-blue h3{color:#1599ee}.motm-player-option{position:relative;display:grid;grid-template-columns:18px minmax(0,1fr) auto;align-items:center;gap:6px;min-height:39px;padding:7px 7px;border-radius:10px;margin:4px 0;background:#fff;cursor:pointer}.motm-player-option input{position:absolute;opacity:0}.motm-radio{width:15px;height:15px;border-radius:50%;border:1.5px solid #8da0b8;background:#fff}.motm-player-option input:checked+.motm-radio{border:5px solid #1b93e8}.motm-player-option:has(input:checked){outline:2px solid rgba(27,147,232,.24);background:#f7fbff}.motm-player-option strong{font-size:12px;overflow:hidden;text-overflow:ellipsis}.motm-goals{font-size:11px;white-space:nowrap}.motm-confirm-check{width:68px;height:68px;border-radius:50%;display:grid;place-items:center;margin:6px auto 13px;background:#16b85b;color:white;font-size:42px;font-weight:900}.motm-thanks-sheet p{white-space:pre-line;max-width:360px;margin:8px auto 14px}.motm-results-bars{margin-top:16px}.motm-result-row{display:grid;grid-template-columns:minmax(90px,1fr) 2fr 26px;gap:8px;align-items:center;text-align:left;margin:8px 0}.motm-result-name{font-size:12px;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.motm-result-track{height:10px;border-radius:999px;background:#e4e9f1;overflow:hidden}.motm-result-track i{display:block;height:100%;border-radius:inherit;background:#228fe4;min-width:0}.motm-result-row.is-winner .motm-result-track i{background:#ff7a1a}.motm-result-row>strong{text-align:right;font-size:12px}.motm-results-total{text-align:center;font-weight:800;font-size:12px}.dev-settings-tabs{overflow-x:auto;scrollbar-width:none}.dev-settings-tabs::-webkit-scrollbar{display:none}
@media(max-width:430px){.motm-team-grid{gap:7px}.motm-team{padding:8px 6px}.motm-player-option{grid-template-columns:16px minmax(0,1fr) auto;gap:4px;padding:6px 5px}.motm-player-option strong{font-size:11px}.motm-picker-score{font-size:18px}}


/* v3.10.70 — MOTM launch/close semantics + slide-up voting journey */
@keyframes motmTraySlideUp{
  from{transform:translateY(34px);opacity:.45}
  to{transform:translateY(0);opacity:1}
}
.motm-dialog[open] .motm-sheet{
  animation:motmTraySlideUp .28s cubic-bezier(.22,.8,.28,1) both;
  transform-origin:bottom center;
}
@media (prefers-reduced-motion:reduce){
  .motm-dialog[open] .motm-sheet{animation:none}
}

/* v3.10.70 — MOTM vote CTA is unmistakably disabled until a player is selected */
#submitMotmVoteBtn:disabled{opacity:.42;cursor:not-allowed;filter:saturate(.45);box-shadow:none;transform:none;pointer-events:none}
#submitMotmVoteBtn:not(:disabled){opacity:1}


/* v3.10.71 — Match History team score + admin team SMS */
.history-team-title{display:flex;align-items:center;gap:6px;min-width:0}
.history-team-title strong{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.history-team-score-pill{flex:0 0 auto;min-width:29px;height:29px;padding:0 8px;border-radius:999px;background:rgba(120,130,150,.13);color:#586273;display:grid;place-items:center;font-size:13px;font-weight:900;line-height:1}
.history-team-sms-btn{appearance:none;border:0;background:rgba(255,255,255,.72);color:#536072;width:28px;height:25px;border-radius:8px;display:flex;align-items:center;justify-content:center;gap:0;padding:0 3px;cursor:pointer;box-shadow:0 1px 4px rgba(18,31,52,.08);flex:0 0 auto}
.history-team-sms-btn .sms-bubble-icon{font-size:13px;line-height:1}
.history-team-sms-btn:active{transform:scale(.94)}
@media(max-width:390px){.history-team-title{gap:4px}.history-team-sms-btn{width:26px}.history-team-score-pill{min-width:27px;height:27px;padding:0 7px}}


/* v3.10.72 — one-row Dev Settings tabs + configurable MOTM cutoff */
.dev-settings-tabs{display:flex!important;grid-template-columns:none!important;flex-wrap:nowrap!important;gap:5px!important;overflow-x:auto!important;scrollbar-width:none;margin:10px 0 14px}
.dev-settings-tabs::-webkit-scrollbar{display:none}
.dev-settings-tab{flex:1 1 0!important;min-width:72px!important;min-height:44px!important;padding:6px 5px!important;font-size:10px!important;line-height:1.08!important;white-space:normal!important;text-align:center}
.dev-motm-deadline-card{border:1px solid #d8dee8;border-radius:14px;padding:13px;margin:0 0 18px;background:#fbfcfe}
.dev-motm-deadline-copy{display:flex;flex-direction:column;gap:3px}.dev-motm-deadline-copy strong{font-size:15px;color:#172033}.dev-motm-deadline-copy span{font-size:11px;line-height:1.35;color:#6c778a}
.dev-motm-deadline-controls{display:grid;grid-template-columns:minmax(0,1fr) 112px;gap:8px;margin-top:11px}.dev-motm-deadline-controls label{display:block}.dev-motm-deadline-controls select,.dev-motm-deadline-controls input{width:100%;min-height:42px;border:1px solid #ccd5e2;border-radius:11px;background:#fff;color:#172033;font:inherit;font-size:13px;font-weight:800;padding:8px 10px;box-sizing:border-box}.dev-motm-deadline-controls input{padding-right:5px}
.dev-motm-deadline-summary{display:flex;align-items:flex-start;gap:8px;margin-top:10px;padding:9px 10px;border-radius:10px;background:#eef5ff;color:#4e6281;font-size:11px;line-height:1.35}.dev-motm-deadline-summary>span:first-child{font-size:15px;color:#4e79bd;line-height:1}
@media(max-width:390px){.dev-settings-tab{min-width:68px!important;font-size:9.4px!important}.dev-motm-deadline-controls{grid-template-columns:minmax(0,1fr) 102px}}

/* v3.10.74 — MOTM live/final UX + small copy/layout fixes */
.dev-motm-deadline-controls{grid-template-columns:minmax(0,1fr) minmax(96px,112px)!important;min-width:0}.dev-motm-deadline-controls>*{min-width:0}.dev-motm-deadline-controls input[type="time"]{max-width:100%;min-width:0;padding-left:8px!important;padding-right:2px!important}
.motm-picker-report{display:flex!important;width:max-content;max-width:78%;margin:0 auto 13px!important}.motm-picker-report[hidden]{display:none!important}
.motm-my-vote{border:0;background:transparent;padding:0 1px;margin-left:3px;line-height:1;font-size:15px;cursor:pointer}.motm-winner-medal{margin-left:3px!important;font-size:15px!important}.history-player-name{gap:2px!important}
.history-motm-live-btn{margin-left:auto!important;min-width:44px!important;font-size:17px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:1px!important;background:#fff!important;border:1px solid #cdd6e3!important;color:#1679df!important}.history-motm-live-btn span{font-size:14px;color:#55657a}
.motm-waiting-box{margin:18px auto 12px;padding:12px 14px;border-radius:12px;background:#eef5ff;color:#315f9d;display:flex;align-items:center;justify-content:center;gap:9px;font-size:12px;line-height:1.35}.motm-waiting-box[hidden]{display:none!important}.motm-waiting-box>span{font-size:22px}.motm-vote-note{margin:14px 0 0!important;padding:10px 12px;border-radius:11px;background:#f1f6fc;color:#58708f!important;font-size:11px!important;text-align:left}.motm-results-bars[hidden],.motm-results-total[hidden]{display:none!important}
@media(max-width:390px){.dev-motm-deadline-controls{grid-template-columns:minmax(0,1fr) minmax(90px,100px)!important}}

/* v3.10.74 — compact MOTM admin controls */
.history-motm-live-btn{font-size:20px!important;gap:0!important}.history-motm-live-btn span{display:none!important}
.motm-result-row.has-controls{grid-template-columns:minmax(90px,1fr) 2fr 26px auto}.motm-adjust-controls{display:inline-flex;gap:5px;margin-left:3px}.motm-adjust-controls button{width:30px;height:30px;border:1px solid #cdd6e3;border-radius:9px;background:#fff;color:#172033;font-size:18px;font-weight:800;line-height:1;display:grid;place-items:center;padding:0;cursor:pointer}.motm-adjust-controls button:active{transform:scale(.94)}.motm-no-votes{text-align:center;margin:18px 0!important}
@media(max-width:390px){.motm-result-row.has-controls{grid-template-columns:minmax(72px,1fr) minmax(70px,1.7fr) 22px auto;gap:5px}.motm-adjust-controls{gap:3px}.motm-adjust-controls button{width:27px;height:27px}}


/* v3.10.75 — larger live MOTM medal + Player Table drag ordering (Selection view only) */
#devSettingsContent .dev-player-editor-head,
#devSettingsContent .dev-player-row{grid-template-columns:26px minmax(0,1fr) 46px 30px 46px 28px!important;gap:4px!important}
#devSettingsContent .dev-player-editor-head{padding-left:6px!important;padding-right:6px!important}
#devSettingsContent .dev-player-row{padding-left:6px!important;padding-right:6px!important}
#devSettingsContent .dev-player-editor-head .dev-drag-head{width:26px}
#devSettingsContent .dev-player-drag{appearance:none;width:26px!important;min-width:26px!important;max-width:26px!important;height:38px!important;min-height:38px!important;padding:0!important;border:0!important;background:transparent!important;color:#7b8799!important;border-radius:8px!important;display:grid!important;place-items:center!important;cursor:grab!important;touch-action:none!important;-webkit-user-select:none!important;user-select:none!important;font-size:20px!important;line-height:1!important}
#devSettingsContent .dev-player-drag:active,#devSettingsContent .dev-player-row.is-reordering .dev-player-drag{cursor:grabbing!important;background:#eef2f7!important;color:#344054!important}
#devSettingsContent .dev-player-row.is-reordering{background:#f5f8fc!important;box-shadow:inset 3px 0 0 var(--ph-orange);position:relative;z-index:2}
#devSettingsContent .dev-player-name{padding-left:7px!important;padding-right:7px!important}
#devSettingsContent .dev-player-rating-label{font-size:11.5px!important}
@media(max-width:390px){
  #devSettingsContent .dev-player-editor-head,#devSettingsContent .dev-player-row{grid-template-columns:24px minmax(0,1fr) 43px 29px 43px 27px!important;gap:3px!important}
  #devSettingsContent .dev-player-drag{width:24px!important;min-width:24px!important;max-width:24px!important;font-size:18px!important}
  #devSettingsContent .dev-player-name{font-size:12.5px!important;padding-left:6px!important;padding-right:6px!important}
  #devSettingsContent .dev-player-rating-label{font-size:11px!important}
}


/* v3.10.77 — restore v3.10.74 history action geometry; enlarge medal artwork only */
.history-motm-live-btn{padding:0!important;overflow:hidden!important}
.history-motm-live-medal{display:block;width:28px;height:28px;object-fit:contain;pointer-events:none}
@media(max-width:390px){.history-motm-live-medal{width:26px;height:26px}}

/* v3.10.77 — preserve existing history action geometry; add square medal beside square copy */
.history-footer-row{align-items:center!important}
.history-footer-row .history-copy-btn{
  width:36px!important;min-width:36px!important;max-width:36px!important;
  height:36px!important;min-height:36px!important;max-height:36px!important;
  aspect-ratio:1/1!important;justify-self:end!important;align-self:center!important;
  padding:0!important;flex:0 0 36px!important;
}
.history-footer-row .history-motm-live-btn{
  width:36px!important;min-width:36px!important;max-width:36px!important;
  height:36px!important;min-height:36px!important;max-height:36px!important;
  aspect-ratio:1/1!important;justify-self:start!important;align-self:center!important;
  padding:0!important;margin:0!important;flex:0 0 36px!important;
  border-radius:9px!important;overflow:hidden!important;
}
.history-motm-live-medal{
  display:block!important;width:32px!important;height:32px!important;max-width:none!important;max-height:none!important;
  object-fit:contain!important;pointer-events:none!important;
}
@media(max-width:390px){
  .history-footer-row .history-copy-btn,
  .history-footer-row .history-motm-live-btn{
    width:32px!important;min-width:32px!important;max-width:32px!important;
    height:32px!important;min-height:32px!important;max-height:32px!important;
    flex-basis:32px!important;
  }
  .history-motm-live-medal{width:29px!important;height:29px!important}
}


/* v3.10.78 — goal sequence + compact football scorer display */
.history-team-score-pill{border-radius:50%!important;min-width:29px!important;width:29px!important;height:29px!important;padding:0!important;color:#fff!important;box-shadow:0 2px 7px rgba(18,31,52,.12)}
.history-team-score-orange{background:var(--team-orange-deep)!important}
.history-team-score-blue{background:var(--team-blue)!important}
.history-scorer-row strong{width:auto!important;min-width:0!important;height:auto!important;border-radius:0!important;background:none!important;color:inherit!important}
.history-scorer-row.no-goal .history-goal-static,.history-scorer-row.no-goal .history-goal-sequence-btn{display:none}
.history-goal-static,.history-goal-sequence-btn{margin-left:auto;flex:0 0 auto}
.history-goal-sequence-btn{appearance:none;border:0;background:transparent;padding:2px 1px;cursor:pointer;border-radius:7px}
.history-goal-sequence-btn:active{transform:scale(.94)}
.history-goal-mark{display:inline-flex;align-items:center;gap:3px;color:#16864a;font-size:10.5px;font-weight:900;line-height:1;white-space:nowrap}
.history-goal-mark.own-goal{color:#c52b34}
.history-football{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI Symbol","Arial Unicode MS",sans-serif;font-size:15px;font-weight:400;line-height:1;color:#16864a;font-variant-emoji:text}
.history-goal-mark.own-goal .history-football,.history-football.own-goal{color:#c52b34}
.history-football.orange{color:var(--team-orange-deep)}
.history-football.blue{color:var(--team-blue)}
.goal-sequence-dialog{width:100vw;max-height:88dvh;margin:auto 0 0}
.goal-sequence-sheet{position:relative;border-radius:24px 24px 0 0;padding:10px 16px max(20px,env(safe-area-inset-bottom));max-height:88dvh;overflow:auto}
.goal-sequence-sheet h2{margin:2px 44px 2px 0;font-size:21px}
.goal-sequence-close{position:absolute!important;right:14px!important;top:18px!important}
.goal-sequence-date{margin:0 0 14px;color:var(--muted);font-size:11px;font-weight:700}
.goal-sequence-head,.goal-sequence-row{display:grid;grid-template-columns:54px minmax(0,1fr) 72px;align-items:center;gap:8px}
.goal-sequence-head{padding:0 10px 6px;color:var(--muted);font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.06em}
.goal-sequence-head span:last-child{text-align:right}
.goal-sequence-rows{display:flex;flex-direction:column;gap:6px}
.goal-sequence-row{padding:9px 10px;border:1px solid #e1e6ee;border-radius:11px;background:#fff;font-size:12px}
.goal-sequence-number{display:inline-flex;align-items:center;gap:5px;font-weight:900;color:#5f6878}
.goal-sequence-number .history-football{font-size:14px}
.goal-sequence-scorer{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
.goal-sequence-scorer.orange{color:var(--team-orange-deep)}
.goal-sequence-scorer.blue{color:var(--team-blue)}
.goal-sequence-scorer.own-goal{color:#c52b34}
.goal-sequence-score{display:flex;align-items:center;justify-content:flex-end;gap:5px;font-size:13px;font-weight:900}
.goal-sequence-score b.orange{color:var(--team-orange-deep)}
.goal-sequence-score b.blue{color:var(--team-blue)}
@media(max-width:390px){.history-team-score-pill{min-width:27px!important;width:27px!important;height:27px!important}.goal-sequence-head,.goal-sequence-row{grid-template-columns:48px minmax(0,1fr) 66px}.goal-sequence-sheet{padding-left:13px;padding-right:13px}}


/* =========================================================
   v3.10.79 — admin-first Player Cards
   ========================================================= */
.ranking-player-link{appearance:none;border:0;background:transparent;padding:0;color:inherit;font:inherit;font-weight:800;text-decoration:underline;text-decoration-color:rgba(255,122,26,.45);text-underline-offset:3px;cursor:pointer}
.player-card-dialog{max-width:520px;background:#081523;color:#eef6ff;border:1px solid #27415b;border-radius:24px;overflow:hidden}.player-card-dialog::backdrop{background:rgba(3,8,15,.76);backdrop-filter:blur(5px)}
.player-card-sheet{position:relative;padding:20px 16px 18px;max-height:88dvh;overflow:auto;background:linear-gradient(180deg,#081523,#0a1928)}.player-card-sheet .modal-close{color:#c4d2e2;top:11px;right:10px}.player-card-edit{position:absolute;right:48px;top:13px;width:32px;height:32px;border-radius:10px;border:1px solid #34506c;background:#102337;color:#dbeaff;font-weight:900}
.player-card-profile{display:grid;grid-template-columns:96px minmax(0,1fr);gap:16px;align-items:center;padding:10px 38px 14px 2px}.player-card-avatar,.player-profile-preview{width:94px;height:94px;border-radius:50%;overflow:hidden;display:grid;place-items:center}.player-avatar-default,.player-avatar-photo{width:100%;height:100%;object-fit:cover;display:block}.player-card-profile h2{font-size:31px;line-height:1;margin:0 0 7px;color:#fff}.player-card-position{margin:0;color:#b7cbe1;font-size:14px}.player-card-tagline{margin:10px 0 0;color:#a9bed5;font-style:italic;font-size:13px;line-height:1.35}
.player-card-achievements{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:8px 0 12px}.player-achievement-feature{min-height:126px;border:1px solid #765f17;border-radius:14px;background:linear-gradient(180deg,rgba(85,65,12,.32),rgba(11,25,40,.86));padding:11px 7px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center}.player-achievement-feature:nth-child(2){border-color:#8d3946;background:linear-gradient(180deg,rgba(94,24,35,.28),rgba(11,25,40,.86))}.player-achievement-feature:nth-child(3){border-color:#9a4d22;background:linear-gradient(180deg,rgba(104,48,15,.3),rgba(11,25,40,.86))}.player-achievement-feature>span{font-size:27px}.player-achievement-feature strong{font-size:12px;margin-top:5px;color:#fff}.player-achievement-feature b{font-size:20px;color:#fff;margin-top:3px}.player-achievement-feature small{font-size:10px;color:#bdcad7;margin-top:4px}.player-no-achievements{grid-column:1/-1;color:#9fb1c4;text-align:center}
.player-card-stats{display:grid;grid-template-columns:repeat(6,1fr);border:1px solid #29435e;border-radius:13px;padding:12px 4px;background:#0b1b2b}.player-card-stats div,.player-card-secondary div{text-align:center;border-right:1px solid #24405a}.player-card-stats div:last-child,.player-card-secondary div:last-child{border-right:0}.player-card-stats strong,.player-card-secondary strong{display:block;color:#fff;font-size:20px}.player-card-stats span,.player-card-secondary span{display:block;color:#a9bed2;font-size:10px;margin-top:3px}.player-card-secondary{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #29435e;border-radius:13px;padding:12px 4px;background:#0b1b2b;margin-top:9px}
.player-team-card,.player-form-card{border:1px solid #29435e;border-radius:13px;background:#0b1b2b;padding:11px;margin-top:9px}.player-team-head{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#f4f8fc;font-size:12px}.player-metric-toggle{display:flex;border:1px solid #31516f;border-radius:9px;overflow:hidden}.player-metric-toggle button{border:0;background:transparent;color:#afc1d4;padding:5px 12px;font-size:10px;font-weight:800}.player-metric-toggle button.active{background:#ff7218;color:#111}.player-team-row{display:grid;grid-template-columns:70px 1fr 24px;gap:8px;align-items:center;margin-top:9px;font-size:11px}.player-team-row strong.orange{color:#ff7b22}.player-team-row strong.blue{color:#25aaf4}.player-team-row>span{height:10px;border-radius:999px;background:#1b2c3e;overflow:hidden}.player-team-row i{display:block;height:100%;border-radius:999px}.player-team-row i.orange{background:#ff7218}.player-team-row i.blue{background:#26aaf3}.player-team-row b{text-align:right;color:#dce8f5}.player-form-card{display:flex;align-items:center;justify-content:space-between;gap:12px}.player-form-card>strong{font-size:12px;color:#fff}.player-form-card>strong small{font-weight:500;color:#9fb2c5}.player-form-card .form-dots{display:flex;gap:7px}.player-form-card .form-dot{width:21px;height:21px}
.player-achievements-toggle{width:100%;margin-top:10px;border:1px solid #3a5877;border-radius:12px;background:#10263b;color:#fff;padding:12px;font-weight:800}.player-all-achievements{margin-top:8px;border:1px solid #29435e;border-radius:13px;overflow:hidden}.player-achievement-list-row{display:grid;grid-template-columns:34px 1fr;gap:7px;align-items:center;padding:10px;border-bottom:1px solid #20384e;background:#0b1b2b}.player-achievement-list-row:last-child{border-bottom:0}.player-achievement-list-row>span{font-size:22px;text-align:center}.player-achievement-list-row strong{display:block;color:#fff;font-size:12px}.player-achievement-list-row strong em{color:#ff7a1a;font-style:normal}.player-achievement-list-row small{display:block;color:#9fb2c4;font-size:10px;margin-top:2px}
.player-profile-dialog form{padding:0}.player-profile-editor{position:relative;padding:18px}.player-profile-preview{margin:10px auto 13px;width:112px;height:112px}.player-photo-picker{display:block;text-align:center;margin:0 auto 9px;background:#ff7218;color:#111;font-weight:900;border-radius:12px;padding:11px;cursor:pointer}.player-photo-picker input{display:none}.player-remove-photo{display:flex;align-items:center;justify-content:center;gap:7px;font-size:12px;color:#68788c;margin-bottom:14px}.player-profile-editor select{width:100%;min-height:42px;border-radius:10px;border:1px solid #cad3df;padding:8px;background:#fff}.player-profile-editor .primary{width:100%;margin-top:8px}.dev-playercards-setting{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;border:1px solid #dce3eb;border-radius:14px;padding:14px;background:#fff}.dev-playercards-setting h3{margin:0 0 5px}.dev-playercards-setting p{margin:0;color:#657386;font-size:12px;line-height:1.35}.dev-playercards-toggle{align-self:center}.dev-playercards-info{display:flex;gap:8px;align-items:flex-start;margin-top:10px;padding:11px;border-radius:11px;background:#edf6ff;color:#456075;font-size:11px}.dev-playercards-info p{margin:0}
@media(max-width:390px){.player-card-profile{grid-template-columns:82px minmax(0,1fr)}.player-card-avatar{width:82px;height:82px}.player-card-achievements{gap:6px}.player-achievement-feature{min-height:116px;padding:8px 5px}.player-card-stats strong,.player-card-secondary strong{font-size:18px}.player-card-stats span,.player-card-secondary span{font-size:9px}}


/* v3.10.82 — Player Card polish + configurable achievement hierarchy */
.player-profile-dialog .standard-red-x{position:absolute!important;right:10px!important;top:8px!important}
.player-remove-photo{width:100%;min-height:42px;display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;margin:0 0 14px!important;border:1px solid #d5dce5!important;border-radius:11px!important;background:#fff!important;color:#d92727!important;font:inherit!important;font-size:12px!important;font-weight:750!important;padding:9px 12px!important;position:static!important}
.player-remove-photo span{font-size:18px;line-height:1}
.player-card-secondary{grid-template-columns:repeat(4,1fr)!important}
.dev-achievements-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}.dev-achievements-head h3{margin:0 0 4px}.dev-achievements-head p{margin:0;color:#657386;font-size:12px;line-height:1.35}.dev-achievements-info{display:flex;gap:9px;align-items:flex-start;padding:10px 11px;border-radius:11px;background:#edf6ff;color:#456075;font-size:11px;margin-bottom:10px}.dev-achievements-info p{margin:0}.dev-achievements-list{display:flex;flex-direction:column;gap:7px}.dev-achievement-row{display:grid;grid-template-columns:34px 34px minmax(0,1fr) auto 28px;gap:8px;align-items:center;padding:9px 8px;border:1px solid #dce3eb;border-radius:12px;background:#fff;box-shadow:0 2px 7px rgba(24,31,45,.05)}.dev-achievement-row.is-reordering{opacity:.92;box-shadow:0 10px 24px rgba(24,31,45,.18);z-index:20}.dev-achievement-drag{width:32px;height:36px;border:0;background:transparent;color:#8795a8;font-size:18px;touch-action:none;cursor:grab}.dev-achievement-icon{font-size:22px;text-align:center}.dev-achievement-copy{min-width:0}.dev-achievement-copy strong{display:block;font-size:12px;color:#172033;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dev-achievement-copy small{display:block;color:#758397;font-size:10px;line-height:1.25;margin-top:2px}.dev-achievement-type{font-size:9px;font-weight:800;color:#5d6e82;background:#eef2f6;border-radius:999px;padding:4px 7px;white-space:nowrap}.dev-achievement-edit{width:28px;height:32px;border:0;background:transparent;color:#546a82;font-size:20px}.dev-achievement-row.is-inactive{opacity:.55}.achievement-editor-dialog .standard-red-x{position:absolute!important;right:10px!important;top:8px!important}.achievement-editor-grid{display:grid;grid-template-columns:minmax(0,1fr) 86px;gap:9px}.achievement-rule-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:10px}.achievement-rule-fields .dev-welcome-field{margin:0}.achievement-active-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;border:1px solid #dce3eb;border-radius:12px;padding:11px;margin-top:12px;background:#fff}.achievement-active-row strong,.achievement-active-row small{display:block}.achievement-active-row small{color:#768497;font-size:10px;margin-top:2px}.achievement-editor-dialog input[type=text],.achievement-editor-dialog input[type=number]{width:100%;min-height:42px;border:1px solid #cad3df;border-radius:10px;padding:8px 10px;background:#fff;font:inherit}.achievement-rule-hint{grid-column:1/-1;margin:0;color:#718094;font-size:10px;line-height:1.3}
@media(max-width:390px){.dev-achievement-row{grid-template-columns:30px 28px minmax(0,1fr) 24px}.dev-achievement-type{display:none}.achievement-rule-fields{grid-template-columns:1fr 1fr}.player-card-secondary strong{font-size:17px!important}.player-card-secondary span{font-size:8.5px!important}}

/* v3.10.82 — Dev Settings tab strip: reliable horizontal swipe scrolling on iOS/PWA. */
#devSettingsContent .dev-settings-tabs{
  display:flex!important;
  flex-wrap:nowrap!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  touch-action:pan-x!important;
  scrollbar-width:none;
  width:100%!important;
  max-width:100%!important;
  justify-content:flex-start!important;
  scroll-snap-type:x proximity;
}
#devSettingsContent .dev-settings-tabs::-webkit-scrollbar{display:none}
#devSettingsContent .dev-settings-tab{
  flex:0 0 92px!important;
  min-width:92px!important;
  max-width:92px!important;
  scroll-snap-align:start;
}
@media(max-width:390px){
  #devSettingsContent .dev-settings-tab{flex-basis:86px!important;min-width:86px!important;max-width:86px!important}
}


/* v3.10.82 — nested horizontal scrolling must win over the page swipe guard. */
#devSettingsContent .dev-settings-tabs{
  -webkit-overflow-scrolling:touch!important;
  touch-action:pan-x!important;
  pointer-events:auto!important;
  position:relative;
  z-index:2;
}
#devSettingsContent .dev-settings-tab{touch-action:pan-x!important}

/* v3.10.94 — polished empty achievements state */
.player-achievements-empty{grid-column:1/-1;min-height:112px;border:1px dashed #35516c;border-radius:16px;background:linear-gradient(180deg,rgba(20,45,66,.52),rgba(10,27,43,.8));display:flex;align-items:center;justify-content:center;gap:13px;padding:18px 20px;text-align:left}.player-achievements-empty>span{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font-size:25px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.1);filter:grayscale(.2)}.player-achievements-empty div{display:flex;flex-direction:column;gap:3px}.player-achievements-empty strong{font-size:15px;color:#eef6ff}.player-achievements-empty small{font-size:11px;line-height:1.35;color:#91a8bc}.player-achievements-toggle[hidden]{display:none!important}

/* v3.10.95 — user Dashboard */
.dashboard-shell{margin-top:10px}.dashboard-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin:4px 2px 12px}.dashboard-heading h2{font-size:30px;letter-spacing:-.035em;margin:0 0 3px}.dashboard-heading p{color:#aebbd3;margin:0;font-size:14px}.dashboard-blocks{display:flex;flex-direction:column;gap:10px}.dashboard-card{background:linear-gradient(180deg,rgba(24,36,55,.98),rgba(15,28,45,.98));border:1px solid #31516f;border-radius:18px;padding:14px;color:#e9f1ff;box-shadow:0 10px 25px rgba(0,0,0,.15)}.dashboard-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.dashboard-card-title{display:flex;align-items:center;gap:9px;min-width:0}.dashboard-card-title h3{font-size:18px;margin:0;color:#fff}.dashboard-card-icon{font-size:22px;line-height:1}.dashboard-card-date{font-size:11px;color:#9eb0c8;white-space:nowrap}.dashboard-announcements{border-color:#7b431c;background:linear-gradient(180deg,rgba(52,36,29,.97),rgba(29,29,31,.98));padding-bottom:6px}.dashboard-announcements-list{max-height:222px;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;scrollbar-width:thin}.dashboard-announcement-row{width:100%;display:grid;grid-template-columns:12px minmax(0,1fr) auto;align-items:center;gap:10px;text-align:left;border:0;border-top:1px solid rgba(255,255,255,.10);background:transparent;color:#eef4ff;padding:11px 2px}.dashboard-announcement-row:first-child{border-top:0}.dashboard-announcement-row:active{background:rgba(255,255,255,.04)}.dashboard-announcement-dot{width:9px;height:9px;border-radius:50%;display:block;background:#24a7f2}.dashboard-announcement-dot.orange{background:#f97316}.dashboard-announcement-copy{min-width:0;display:block}.dashboard-announcement-copy strong{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dashboard-announcement-copy small{display:block;color:#afbdd0;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px}.dashboard-announcement-meta{display:flex;align-items:center;gap:7px;color:#9eacc1;font-size:10px;white-space:nowrap}.dashboard-announcement-meta b{font-size:24px;color:#f97316;line-height:1}.dashboard-pair{display:grid;grid-template-columns:1fr 1fr;gap:10px}.dashboard-pair>.dashboard-card:only-child{grid-column:1/-1}.dashboard-motm-card.is-open{border-color:#ad2d53;background:radial-gradient(circle at 20% 0%,rgba(198,33,82,.25),transparent 55%),linear-gradient(180deg,#2c1727,#171827)}.dashboard-motm-card.is-quiet{border-color:#3a4a61;background:linear-gradient(180deg,#1a2638,#111b2a)}.dashboard-state-pill{font-size:9px;font-weight:900;border-radius:7px;padding:4px 7px;background:#475569;color:#dbe5f4}.dashboard-state-pill.open{background:#e43f5f;color:#fff}.dashboard-motm-body{color:#bac6d8;font-size:13px;line-height:1.45;min-height:38px;margin:7px 0 8px}.dashboard-deadline{font-size:10px;color:#9ba9bf;margin:-2px 0 8px}.dashboard-tile-cta{width:100%;border:1px solid #3d6d94;background:#152b40;color:#d8e9fb;border-radius:11px;min-height:42px;font-weight:850;padding:9px 12px;display:flex;align-items:center;justify-content:center;gap:8px}.dashboard-tile-cta.motm-open{background:linear-gradient(180deg,#fb923c,#f97316);border-color:#f97316;color:#101522}.dashboard-tile-cta.subtle{background:#233044;border-color:#46546a;color:#dce6f4}.dashboard-fixture-card{border-color:#086895;background:radial-gradient(circle at 20% 0%,rgba(0,160,230,.14),transparent 60%),linear-gradient(180deg,#102d43,#0f2030)}.dashboard-fixture-date{font-weight:850;font-size:14px;margin:3px 0 9px}.dashboard-fixture-details{display:flex;flex-direction:column;gap:6px;margin-bottom:11px}.dashboard-fixture-details>div{display:flex;gap:8px;align-items:center;color:#b9c9dd;font-size:12px}.dashboard-fixture-details>div span{width:18px;text-align:center}.dashboard-fixture-details strong{font-weight:650}.dashboard-score-hero{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px;padding:5px 12px 12px;text-align:center}.dashboard-score-hero>div{display:flex;flex-direction:column;gap:4px;align-items:center}.dashboard-score-hero strong{font-size:14px}.dashboard-score-hero b{display:grid;place-items:center;min-width:65px;height:54px;border-radius:11px;background:#183049;border:1px solid #274762;font-size:29px;color:#fff}.dashboard-score-hero>span{color:#9badc3}.dashboard-last-links{display:flex;gap:7px;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08);padding:8px 0;margin-bottom:11px;flex-wrap:wrap}.dashboard-mini-link,.dashboard-text-link{border:0;background:transparent;color:#c9d8ea;font-weight:750;font-size:11px;padding:5px 6px}.dashboard-mini-link{flex:1 1 140px;border:1px solid #2d4e68;border-radius:8px}.dashboard-mini-link span,.dashboard-text-link span{font-size:18px;margin-left:4px}.dashboard-text-link{color:#fb923c}.dashboard-last-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:14px}.dashboard-last-grid h4{font-size:12px;margin:0 0 8px;color:#f6f8fb}.dashboard-top-performers{border-right:1px solid rgba(255,255,255,.12);padding-right:14px}.dashboard-top-performers>div{display:grid;grid-template-columns:20px 76px 1fr;align-items:center;gap:5px;margin:7px 0;font-size:11px}.dashboard-top-performers small{color:#9fb0c7}.dashboard-top-performers strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dashboard-last-stats>div{display:flex;justify-content:space-between;gap:8px;font-size:11px;margin:7px 0;color:#b6c3d5}.dashboard-last-stats strong{color:#eef5ff}.dashboard-ranking-list{display:flex;flex-direction:column}.dashboard-ranking-row{display:grid;grid-template-columns:28px minmax(0,1fr) auto auto;gap:8px;align-items:center;min-height:38px;border-top:1px solid rgba(255,255,255,.08);font-size:12px}.dashboard-ranking-row:first-child{border-top:0}.dashboard-rank{width:24px;height:24px;border-radius:50%;background:#28435c;display:grid;place-items:center;font-size:10px;font-weight:900}.dashboard-rank.first{background:#f5b21a;color:#1c2532}.dashboard-ranking-form{display:flex;gap:3px;align-items:center}.dashboard-form-dot{width:7px;height:7px;border-radius:50%;background:#67758a}.dashboard-form-dot.win{background:#26a65b}.dashboard-form-dot.loss{background:#e64653}.dashboard-form-dot.draw{background:#788699}.dashboard-ranking-row>b{color:#dfe9f7;font-size:11px}.dashboard-empty-inline{padding:10px 2px;color:#aab9cd;display:flex;flex-direction:column;gap:4px;font-size:12px}.dashboard-empty-inline strong{color:#dce6f2}.dashboard-announcement-dialog{max-width:520px}.dashboard-announcement-sheet{position:relative}.dashboard-announcement-hero{font-size:28px}.dashboard-announcement-date{font-size:11px;color:#8b98aa;margin:5px 0}.dashboard-announcement-body{white-space:normal;color:#283548;line-height:1.5;font-size:14px}.dashboard-announcement-body p:last-child{margin-bottom:0}.dashboard-announcement-cta{width:100%;margin-top:14px}

/* v3.10.95 — Dashboard controls in Dev Settings */
.dev-dashboard-head,.dev-dashboard-setting-row{display:flex;justify-content:space-between;align-items:center;gap:14px}.dev-dashboard-head p,.dev-dashboard-setting-row p{font-size:12px;color:#6b7280;margin:2px 0 0}.dev-dashboard-preview-row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:12px}.dev-dashboard-layout,.dev-announcements-list{display:flex;flex-direction:column;gap:7px;margin-top:10px}.dev-dashboard-layout-row,.dev-announcement-row{border:1px solid #d8dfe8;background:#f7f9fc;border-radius:11px;min-height:48px;display:flex;align-items:center;gap:9px;padding:7px 8px}.dev-dashboard-layout-row.is-reordering,.dev-announcement-row.is-reordering{opacity:.75;box-shadow:0 8px 18px rgba(0,0,0,.12);transform:scale(1.01)}.dev-dashboard-drag,.dev-announcement-drag{border:0;background:transparent;color:#8290a4;font-size:18px;touch-action:none;padding:8px}.dev-dashboard-layout-row strong{flex:1;font-size:13px}.dev-dashboard-layout-row>span{color:#9aa6b8}.dev-announcement-row>div{min-width:0;flex:1}.dev-announcement-row strong,.dev-announcement-row small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dev-announcement-row strong{font-size:12px}.dev-announcement-row small{color:#7b8798;font-size:10px;margin-top:2px}.dev-announcement-state{width:9px;height:9px;border-radius:50%;background:#b5beca}.dev-announcement-state.active{background:#27a65e}.dev-announcement-edit,.dev-announcement-delete{border:0;border-radius:8px;padding:7px 8px;font-size:11px;font-weight:800}.dev-announcement-edit{background:#e9eef5;color:#334155}.dev-announcement-delete{background:#fee2e2;color:#991b1b;font-size:16px;line-height:1}.dev-announcement-add{margin-top:9px;width:100%}.dev-dashboard-options-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.dev-dashboard-options-grid label,.dev-dashboard-rankings-options>label{display:flex;align-items:center;gap:7px;border:1px solid #dde3eb;border-radius:9px;background:#f8fafc;padding:9px;font-size:11px;font-weight:750}.dev-dashboard-options-grid input,.dev-dashboard-rankings-options input{width:auto;margin:0}.dev-dashboard-rankings-options{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:8px;margin-top:10px}.dev-dashboard-rankings-options select{padding:7px;font-size:13px;margin-left:auto}.dev-dashboard-rankings-options>label:first-child{display:grid;grid-template-columns:auto 1fr}.dev-dashboard-rankings-options>label:first-child select{width:100%}.dev-settings-pane[data-dev-pane-content="dashboard"] .selection-toggle{flex:0 0 auto}

@media(max-width:700px){.dashboard-heading h2{font-size:27px}.dashboard-pair{grid-template-columns:1fr 1fr}.dashboard-card{padding:12px;border-radius:16px}.dashboard-card-title h3{font-size:16px}.dashboard-motm-body{font-size:12px}.dashboard-fixture-details>div{font-size:11px}.dashboard-last-grid{grid-template-columns:1fr 1fr}.dashboard-top-performers>div{grid-template-columns:18px 65px 1fr}.dev-dashboard-rankings-options{grid-template-columns:1fr 1fr}.dev-dashboard-rankings-options>label:first-child{grid-column:1/-1}}
@media(max-width:430px){.dashboard-pair{grid-template-columns:1fr 1fr;gap:8px}.dashboard-pair .dashboard-card{padding:11px}.dashboard-card-title{gap:6px}.dashboard-card-title h3{font-size:15px}.dashboard-card-icon{font-size:18px}.dashboard-fixture-date{font-size:12px}.dashboard-fixture-details>div{font-size:10px;gap:4px}.dashboard-tile-cta{font-size:11px;padding:8px}.dashboard-last-grid{grid-template-columns:1fr}.dashboard-top-performers{border-right:0;border-bottom:1px solid rgba(255,255,255,.12);padding:0 0 9px}.dashboard-ranking-row{grid-template-columns:26px minmax(0,1fr) auto auto}.dashboard-announcement-meta{font-size:9px}.dashboard-announcement-copy small{font-size:10px}}


/* v3.10.96 — Last Game refinement */
.dashboard-score-side{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:center;gap:14px;min-width:0}
.dashboard-score-side>div{display:flex;flex-direction:column;gap:4px;align-items:center}
.dashboard-score-shirt{width:48px!important;height:42px!important;filter:drop-shadow(0 5px 8px rgba(0,0,0,.24));flex:0 0 auto}
.dashboard-last-grid{grid-template-columns:minmax(0,1.15fr) minmax(190px,.85fr);align-items:stretch;border-top:1px solid rgba(255,255,255,.08);padding-top:12px}
.dashboard-top-performers{border-right:1px solid rgba(255,255,255,.12);padding-right:14px}
.dashboard-match-actions{display:flex;flex-direction:column;justify-content:center;gap:9px;min-width:0}
.dashboard-match-action{width:100%;min-height:44px;border:1px solid #39719b;background:#132a3e;color:#dceafb;border-radius:10px;padding:8px 10px;display:grid;grid-template-columns:25px minmax(0,1fr) 18px;align-items:center;gap:7px;text-align:left;font-size:11px;font-weight:850}
.dashboard-match-action:active{transform:scale(.985);background:#19364f}
.dashboard-match-action-icon{font-size:17px;text-align:center;line-height:1}
.dashboard-match-action>span:nth-child(2){white-space:normal;line-height:1.2}
.dashboard-match-action>b{font-size:22px;font-weight:500;text-align:right;line-height:1}
.dashboard-last-links,.dashboard-last-stats{display:none!important}
@media(max-width:430px){
  .dashboard-score-hero{gap:7px;padding-left:0;padding-right:0}
  .dashboard-score-side{gap:7px}
  .dashboard-score-shirt{width:38px!important;height:34px!important}
  .dashboard-last-grid{grid-template-columns:minmax(0,1fr) minmax(142px,.9fr);gap:9px}
  .dashboard-top-performers{border-right:1px solid rgba(255,255,255,.12);border-bottom:0;padding:0 9px 0 0}
  .dashboard-top-performers>div{grid-template-columns:17px 62px minmax(0,1fr);gap:4px;font-size:10px}
  .dashboard-match-actions{gap:7px}
  .dashboard-match-action{min-height:40px;padding:7px 7px;grid-template-columns:21px minmax(0,1fr) 14px;gap:4px;font-size:9.5px}
  .dashboard-match-action-icon{font-size:15px}
  .dashboard-match-action>b{font-size:19px}
}

/* v3.10.97 — manually managed Next Fixture */
.dev-fixture-fields{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.dev-fixture-fields label{display:flex;flex-direction:column;gap:5px;font-size:11px;font-weight:800;color:#334155}.dev-fixture-fields input{width:100%;min-height:42px;border:1px solid #d8dfe8;border-radius:10px;background:#fff;color:#172033;font:inherit;padding:8px 10px}.dev-fixture-fields .dev-fixture-place{grid-column:1/-1}.dev-fixture-note{margin:8px 2px 0;color:#718094}.dashboard-lineups-open{background:linear-gradient(180deg,#fb923c,#f97316);border-color:#f97316;color:#101522}.dashboard-lineups-disabled,.dashboard-lineups-disabled:disabled{background:#263445;border-color:#425066;color:#8794a7;opacity:.72;cursor:default}.dashboard-fixture-card .dashboard-empty-inline{min-height:72px;justify-content:center}

/* v3.10.98 dashboard navigation refinement */
.dashboard-heading-main{display:flex;align-items:center;gap:10px;min-width:0}.dashboard-heading-home{width:34px;height:34px;display:grid;place-items:center;color:#f97316;flex:0 0 auto}.dashboard-heading-home svg{width:30px;height:30px;display:block}.bottom-nav.player-nav .tab:not([hidden]){min-width:0}


/* v3.11.0 — five-tab player nav + announcement tray refinement */
body[data-role="player"] .bottom-nav.player-nav{
  width:100vw!important;
  max-width:920px!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:0!important;
  padding-left:max(2px,env(safe-area-inset-left))!important;
  padding-right:max(2px,env(safe-area-inset-right))!important;
  overflow:hidden!important;
}
body[data-role="player"] .bottom-nav.player-nav .tab:not([hidden]){
  min-width:0!important;
  width:auto!important;
  padding:5px 1px 4px!important;
  font-size:8px!important;
  gap:3px!important;
  overflow:hidden!important;
}
body[data-role="player"] .bottom-nav.player-nav .tab:not([hidden]) svg,
body[data-role="player"] .bottom-nav.player-nav .tab:not([hidden]) .welcome-nav-icon,
body[data-role="player"] .bottom-nav.player-nav .tab:not([hidden]) .lineups-group-icon{
  width:19px!important;
  height:19px!important;
  flex:0 0 19px!important;
}
body[data-role="player"] .bottom-nav.player-nav .tab:not([hidden])>span:last-child{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:clip!important;
  text-align:center!important;
  letter-spacing:-.015em!important;
}
@media(max-width:370px){body[data-role="player"] .bottom-nav.player-nav .tab:not([hidden]){font-size:7.5px!important}}

.dashboard-announcement-dialog{
  width:min(620px,100vw)!important;
  max-width:none!important;
  margin:auto 0 0!important;
  max-height:82dvh!important;
}
.dashboard-announcement-dialog::backdrop{
  background:rgba(3,8,18,.72)!important;
  backdrop-filter:blur(8px)!important;
  -webkit-backdrop-filter:blur(8px)!important;
}
.dashboard-announcement-sheet{
  position:relative!important;
  max-height:82dvh!important;
  overflow:auto!important;
  border-radius:28px 28px 0 0!important;
  padding:10px 18px max(20px,env(safe-area-inset-bottom))!important;
  background:linear-gradient(180deg,#10263a 0%,#0d1d2c 100%)!important;
  color:#edf5ff!important;
  border:1px solid #31546f!important;
  border-bottom:0!important;
  box-shadow:0 -18px 60px rgba(0,0,0,.45)!important;
}
.dashboard-announcement-grabber{
  width:48px;height:5px;border-radius:999px;background:#607892;margin:0 auto 14px;opacity:.8
}
.dashboard-announcement-head{
  display:grid;grid-template-columns:58px minmax(0,1fr) 44px;gap:12px;align-items:center;margin-bottom:18px
}
.dashboard-announcement-hero{
  width:54px;height:54px;border-radius:16px;display:grid;place-items:center;font-size:30px!important;
  background:rgba(249,115,22,.13);border:1px solid rgba(249,115,22,.32);margin:0!important
}
.dashboard-announcement-heading-copy{min-width:0}
.dashboard-announcement-heading-copy h2{
  color:#fff!important;font-size:22px!important;line-height:1.08!important;margin:0 0 6px!important;letter-spacing:-.02em
}
.dashboard-announcement-date{
  color:#9db0c7!important;font-size:11px!important;margin:0!important
}
.dashboard-announcement-close{
  position:static!important;width:42px!important;height:42px!important;border-radius:50%!important;
  border:1px solid #47637d!important;background:#152a3d!important;color:#fff!important;font-size:30px!important;
  line-height:1!important;display:grid!important;place-items:center!important;padding:0!important
}
.dashboard-announcement-body{
  color:#dce7f4!important;font-size:15px!important;line-height:1.52!important;white-space:normal!important;
  padding:0 2px!important;margin:0!important
}
.dashboard-announcement-body p{margin:0 0 14px!important}.dashboard-announcement-body p:last-child{margin-bottom:0!important}
.dashboard-announcement-cta{
  width:100%!important;margin-top:20px!important;min-height:52px!important;border-radius:14px!important;
  color:#111827!important;font-size:16px!important;font-weight:900!important;
  background:linear-gradient(180deg,#ff9a3d,#f97316)!important;box-shadow:0 8px 20px rgba(249,115,22,.2)!important
}
@media(min-width:701px){.dashboard-announcement-dialog{width:min(620px,calc(100vw - 24px))!important;margin:auto!important}.dashboard-announcement-sheet{border-radius:26px!important;border-bottom:1px solid #31546f!important}}
@media(max-width:430px){
  .dashboard-announcement-sheet{padding-left:15px!important;padding-right:15px!important}
  .dashboard-announcement-head{grid-template-columns:50px minmax(0,1fr) 42px;gap:10px}
  .dashboard-announcement-hero{width:48px;height:48px;font-size:27px!important}
  .dashboard-announcement-heading-copy h2{font-size:20px!important}
  .dashboard-announcement-body{font-size:14px!important}
}

/* v3.11.0 dashboard section icons */
.dashboard-card-icon .dashboard-section-svg{width:26px;height:26px;display:block}

/* v3.11.0 match-details scorecard icon refinement */
.dashboard-scorecard-icon{display:inline-grid;place-items:center;width:28px;height:24px;flex:0 0 28px;color:currentColor}
.dashboard-scorecard-icon svg{display:block;width:28px;height:24px;overflow:visible}


/* v3.11.0 — tappable goal/MOTM indicators */
.history-goal-sequence-btn{display:inline-flex!important;align-items:center!important;gap:2px!important;color:#16864a!important}
.history-goal-chevron{display:inline-block;font-size:15px;font-weight:950;line-height:.8;color:#16864a;transform:translateY(-.2px)}
.motm-winner-medal{display:inline-flex!important;align-items:center!important;gap:1px!important;color:#111827!important;vertical-align:middle}
.motm-winner-medal-icon{display:inline-block;line-height:1}
.motm-winner-chevron{display:inline-block;font-size:14px;font-weight:950;line-height:.8;color:#111827;transform:translateY(-.2px)}

/* =========================================================
   v3.11.1 — selective dark refresh
   Approved screens only: Welcome, Lineups and Rankings.
   All other screens intentionally retain v3.11.0 styling.
   ========================================================= */
:root{
  --ph-dark-panel:#0d1c2c;
  --ph-dark-panel-2:#11263a;
  --ph-dark-border:#2e4b67;
  --ph-dark-border-soft:#20384f;
  --ph-dark-text:#f4f7fb;
  --ph-dark-muted:#a9b9cd;
}

/* Only the three approved top-level panels. */
#tab-welcome > .panel,
#tab-lineups > .panel,
#tab-rankings > .panel{
  background:linear-gradient(180deg,var(--ph-dark-panel-2),var(--ph-dark-panel))!important;
  color:var(--ph-dark-text)!important;
  border:1px solid var(--ph-dark-border)!important;
  box-shadow:0 10px 28px rgba(0,0,0,.18)!important;
}

#tab-welcome h2,#tab-welcome h3,
#tab-lineups h2,#tab-lineups h3,
#tab-rankings h2,#tab-rankings h3{color:var(--ph-dark-text)!important}

#tab-welcome p,#tab-welcome .small,
#tab-lineups p,#tab-lineups .small,
#tab-rankings p,#tab-rankings .small{color:var(--ph-dark-muted)!important}

/* Screen-title icons: explicit orange for contrast against the navy panel. */
#tab-welcome .screen-title-icon,
#tab-lineups .screen-title-icon,
#tab-rankings .screen-title-icon{
  color:var(--ph-orange,#ff7a1a)!important;
}

/* Welcome — same content/layout, dark cards and separators. */
.welcome-tagline,.welcome-intro p{color:var(--ph-dark-muted)!important}
.welcome-divider{background:var(--ph-dark-border-soft)!important}
.welcome-rule-text{
  background:#14283c!important;
  border:1px solid #29445f!important;
  color:#c3d0df!important;
  box-shadow:none!important;
}

/* Lineups — empty state harmonised; published team layout stays untouched. */
.lineups-empty{color:var(--ph-dark-muted)!important}
.lineups-empty h3{color:var(--ph-dark-text)!important}
.lineups-empty-copy{color:var(--ph-dark-muted)!important}
.lineups-empty-visual{background:rgba(126,154,191,.08)!important}
.lineups-calendar-icon,.lineups-clock-icon{color:#8195ad!important}
.lineups-empty-info{
  background:#14283c!important;
  border:1px solid #29445f!important;
  color:#aec0d4!important;
}
.lineups-empty-info p{color:#aec0d4!important}

/* Rankings — preserve all sizing/columns, only repaint the surfaces. */
#tab-rankings .badge{
  background:#172d43!important;
  color:#dce8f5!important;
  border:1px solid #2e4b67!important;
}
#tab-rankings .table-wrap{
  border-color:#2a455f!important;
  background:#0b1928!important;
}
#tab-rankings .data-table{
  background:#0b1928!important;
  color:#edf4fc!important;
}
#tab-rankings .data-table thead th,
#tab-rankings .data-table tfoot th{
  background:#14283b!important;
  color:#9fb1c6!important;
  border-color:#29445f!important;
}
#tab-rankings .data-table td,
#tab-rankings .data-table th{border-color:#20384f!important}
#tab-rankings .data-table tbody tr:nth-child(even){background:rgba(255,255,255,.018)!important}
#tab-rankings .rankings-table td{color:#edf4fc}


/* =========================================================
   v3.11.1 — Match History shell + small refinements
   ========================================================= */
/* Match History: repaint only the outer screen frame/header.
   Individual match cards and everything inside them stay on the v3.11.0 light styling. */
#tab-history > .panel{
  background:linear-gradient(180deg,var(--ph-dark-panel-2),var(--ph-dark-panel))!important;
  border:1px solid var(--ph-dark-border)!important;
  box-shadow:0 10px 28px rgba(0,0,0,.18)!important;
}
#tab-history > .panel > .section-heading h2{color:var(--ph-dark-text)!important}
#tab-history > .panel > .section-heading p{color:var(--ph-dark-muted)!important}
#tab-history > .panel > .section-heading .screen-title-icon{color:var(--ph-orange,#ff7a1a)!important}
#tab-history > .panel > .history-list > .small{color:var(--ph-dark-muted)!important}
#tab-history .history-item{color:var(--ink)!important;background:#fbfcff!important}

/* Randomiser title icon: match the orange screen-title treatment used elsewhere. */
#tab-randomiser .randomiser-mvp-heading .screen-title-icon{color:var(--ph-orange,#ff7a1a)!important}

/* =========================================================
   v3.11.1 — approved Match History option C + MOTM dark trays
   ========================================================= */
/* Option C: darker outer match card only. Team tables/content remain unchanged. */
#tab-history .history-item{background:#dfe4eb!important;border-color:#aeb9c7!important;box-shadow:0 7px 18px rgba(0,0,0,.18)!important}

/* MOTM trays: bring the existing flow into the app's navy palette without changing layout. */
.motm-dialog .payment-sheet{background:linear-gradient(180deg,#13273b,#0b1928)!important;color:#edf4fc!important;border:1px solid #2a4965!important;box-shadow:0 24px 80px rgba(0,0,0,.55)!important}
.motm-dialog .payment-sheet-grabber{background:#8093aa!important}
.motm-dialog .motm-sheet h2{color:#f5f8fc!important}
.motm-dialog .motm-sheet p,.motm-dialog .motm-picker-date,.motm-dialog .motm-deadline{color:#aebed2!important}
.motm-dialog .motm-team-orange{background:#182433!important;border-color:#ff7a1a!important}
.motm-dialog .motm-team-blue{background:#142638!important;border-color:#2da9ff!important}
.motm-dialog .motm-player-option{background:#203247!important;color:#edf4fc!important}
.motm-dialog .motm-radio{background:#13273b!important;border-color:#91a5bc!important}
.motm-dialog .motm-player-option:has(input:checked){background:#253b52!important;outline-color:rgba(45,169,255,.45)!important}
.motm-dialog .motm-waiting-box,.motm-dialog .motm-vote-note{background:#172d43!important;color:#aec0d4!important;border:1px solid #29445f!important}
.motm-dialog .motm-result-track{background:#263c52!important}
.dashboard-state-pill.closed{white-space:nowrap}


/* =========================================================
   v3.11.2 development iteration 1 — Selection three-column workflow + darker Match History cards
   ========================================================= */
/* Selection: dark-blue outer shell only; keep existing lane/card colours and geometry. */
#tab-selection > .selection-panel{
  background:linear-gradient(180deg,var(--ph-dark-panel-2),var(--ph-dark-panel))!important;
  border:1px solid var(--ph-dark-border)!important;
  box-shadow:0 10px 28px rgba(0,0,0,.18)!important;
  color:var(--ph-dark-text)!important;
}
#tab-selection .selection-heading h2{color:var(--ph-dark-text)!important}
#tab-selection .selection-heading p{color:var(--ph-dark-muted)!important}
#tab-selection .selection-heading .screen-title-icon{color:var(--ph-orange,#ff7a1a)!important}

/* Exactly three lanes. SMS selection now lives visually inside Not asked. */
#tab-selection .selection-board{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:7px!important;
}
#tab-selection .lane-head{
  height:78px!important;
  font-size:12px!important;
  line-height:1.08!important;
  padding:8px 4px 7px!important;
}
#tab-selection .lane-head-icon{
  display:block;
  font-size:20px;
  line-height:1;
  margin-bottom:5px;
}
#tab-selection .sms-lane-head,
#tab-selection .pending-lane-head{
  width:100%!important;
  border:0!important;
  font:inherit!important;
  cursor:pointer!important;
}
#tab-selection .lane-not-asked .sms-lane-head{background:#e8e8ea!important;color:#3c4048!important}
#tab-selection .lane-not-asked .sms-lane-head.has-sms-selection{box-shadow:inset 0 -3px 0 #24aee9!important}
#tab-selection .lane-asked .pending-lane-head{background:#ffedbd!important;color:#bb6b00!important}

/* Requested blue tap-selection state. Base card dimensions/styles remain untouched. */
#tab-selection .selection-player-card.sms-selected-card{
  background:#41c2ea!important;
  color:#08233a!important;
  box-shadow:0 3px 9px rgba(24,31,45,.10)!important;
  padding-right:25px!important;
}
#tab-selection .sms-selected-number{
  position:absolute;
  right:8px;
  top:50%;
  transform:translateY(-50%);
  color:#fff;
  font-size:13px;
  line-height:1;
  font-weight:950;
  pointer-events:none;
}

/* Match History option B: dark medium shell around each match only.
   Team tables and all of their internal colours remain unchanged. */
#tab-history .history-item{
  background:#364b60!important;
  border-color:#57718a!important;
  box-shadow:0 7px 18px rgba(0,0,0,.24)!important;
}
#tab-history .history-item .history-meta>span:first-child{color:#d7e2ed!important}
#tab-history .history-item .history-scoreline{color:#f4f7fb!important}
#tab-history .history-item .history-scoreline.unscored{color:#c1cfdd!important}

@media(max-width:700px){
  #tab-selection .selection-board{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important}
  #tab-selection .lane-head{font-size:11.5px!important}
}
@media(max-width:390px){
  #tab-selection .selection-board{gap:5px!important}
  #tab-selection .lane-head{font-size:11px!important}
  #tab-selection .lane-head-icon{font-size:18px}
}

/* =========================================================
   v3.11.2 development iteration 2 — scoped visual correction
   Target: approved three-column Selection + Option B Match History.
   Deliberately restores mature card/team components after iteration-1 leakage.
   ========================================================= */
/* Selection shell only. */
#tab-selection > .selection-panel{
  background:linear-gradient(180deg,var(--ph-dark-panel-2),var(--ph-dark-panel))!important;
  border:1px solid var(--ph-dark-border)!important;
  box-shadow:0 10px 28px rgba(0,0,0,.18)!important;
  color:var(--ph-dark-text)!important;
}
#tab-selection .selection-heading h2{color:#f4f7fb!important}
#tab-selection .selection-heading p{color:#aec0d4!important}
#tab-selection .selection-heading .screen-title-icon{color:var(--ph-orange,#ff7a1a)!important}
#tab-selection .selection-reset-btn{background:#fff!important;color:#172033!important;border-color:#d7deea!important}
#tab-selection .accepted-total{background:#fff!important;color:#172033!important}
#tab-selection .accepted-total span{color:#172033!important}
#tab-selection .selection-add{color:var(--ph-orange,#ff7a1a)!important}

/* Three equal lanes; preserve the established lane colours. */
#tab-selection .selection-board{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important}
#tab-selection .lane-head{height:78px!important;padding:8px 4px 7px!important;font-size:12px!important;line-height:1.08!important}
#tab-selection .lane-head-icon{display:block;font-size:20px;line-height:1;margin:0 0 5px!important}
#tab-selection .lane-not-asked{background:#f4f4f5!important}
#tab-selection .lane-not-asked .sms-lane-head{background:#e8e8ea!important;color:#3c4048!important}
#tab-selection .lane-asked{background:#fff8e7!important}
#tab-selection .lane-asked .pending-lane-head{background:#ffedbd!important;color:#bb6b00!important}
#tab-selection .lane-accepted{background:#eef9ef!important}
#tab-selection .lane-accepted .lane-head{background:#d8f1d9!important;color:#16803c!important}
#tab-selection .sms-lane-head,#tab-selection .pending-lane-head{width:100%!important;border:0!important;font:inherit!important;cursor:pointer!important}

/* Explicitly restore v3.11.1 player-card surfaces/text. */
#tab-selection .selection-player-card{background:#fff!important;color:#172033!important;box-shadow:0 3px 9px rgba(24,31,45,.10)!important}
#tab-selection .selection-player-name{color:#172033!important}
#tab-selection .asked-card:not(.declined-in-place){background:#fff!important;color:#172033!important}
#tab-selection .asked-card:not(.declined-in-place) > .selection-player-name{background:#fff!important;color:#172033!important}
#tab-selection .asked-card.declined-in-place{background:#ffdada!important;color:#172033!important}
#tab-selection .asked-card.declined-in-place > .selection-player-name{color:#172033!important}
#tab-selection .declined-card-label{color:#d92525!important}
#tab-selection .selection-card-action.decline{background:#ffdada!important;color:#df2b2b!important}
#tab-selection .selection-card-action.accept{background:#d9f5df!important;color:#16803c!important}

/* Only the additional selected state changes a Not Asked card. */
#tab-selection .selection-player-card.sms-selected-card{background:#41c2ea!important;color:#08233a!important;padding-right:25px!important}
#tab-selection .selection-player-card.sms-selected-card .selection-player-name{color:#08233a!important}
#tab-selection .sms-selected-number{color:#fff!important}

/* Match History Option B shell. Team tables are explicitly restored/protected. */
#tab-history .history-item{background:#364b60!important;border-color:#57718a!important;box-shadow:0 7px 18px rgba(0,0,0,.24)!important}
#tab-history .history-item .history-meta>span:first-child{color:#d7e2ed!important}
#tab-history .history-item .history-scoreline{color:#f4f7fb!important}
#tab-history .history-item .history-scoreline.unscored{color:#c1cfdd!important}
#tab-history .history-team-orange{background:linear-gradient(180deg,#ffede2,#fff6f1)!important;border-color:#ffd8c0!important;color:#172033!important}
#tab-history .history-team-blue{background:linear-gradient(180deg,#e7f2ff,#f2f8ff)!important;border-color:#c9e1ff!important;color:#172033!important}
#tab-history .history-team-orange .history-team-head strong{color:var(--team-orange-deep)!important}
#tab-history .history-team-blue .history-team-head strong{color:var(--team-blue)!important}
#tab-history .history-team .history-scorer-row{background:rgba(255,255,255,.78)!important;color:#172033!important}

@media(max-width:700px){
 #tab-selection .selection-board{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important}
 #tab-selection .lane-head{font-size:11.5px!important}
}
@media(max-width:390px){
 #tab-selection .selection-board{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:5px!important}
 #tab-selection .lane-head{font-size:11px!important}
 #tab-selection .lane-head-icon{font-size:18px!important}
}

/* =========================================================
   v3.11.2 development iteration 3 — Financials shell + Selection drag arrival
   ========================================================= */
/* Financials: repaint the outer screen shell only. Controls and table retain
   their established light component colours. */
#tab-financials > #financialContent{
  background:linear-gradient(180deg,var(--ph-dark-panel-2),var(--ph-dark-panel))!important;
  border:1px solid var(--ph-dark-border)!important;
  box-shadow:0 10px 28px rgba(0,0,0,.18)!important;
  color:var(--ph-dark-text)!important;
}
#tab-financials #financialContent .financial-heading h2{color:#f4f7fb!important}
#tab-financials #financialContent .financial-heading p{color:#aec0d4!important}
#tab-financials #financialContent .financial-heading .screen-title-icon{color:var(--ph-orange,#ff7a1a)!important}
#tab-financials #financialContent .month-toolbar label>span{color:#f4f7fb!important}
/* Protect the existing light components from shell inheritance. */
#tab-financials #financialContent #financialMonth{background:#fff!important;color:#172033!important}
#tab-financials #financialContent .financials-wrap{background:#fff!important}
#tab-financials #financialContent .financials-table{background:#fff!important;color:#172033!important}

/* A successful Selection drop visibly arrives in its destination lane. */
#tab-selection .selection-player-card.selection-card-arriving{
  animation:selectionCardArrive .40s cubic-bezier(.2,.9,.25,1);
  transform-origin:center;
}
@keyframes selectionCardArrive{
  0%{opacity:.35;transform:translateX(-24px) scale(.94);box-shadow:0 0 0 3px rgba(65,194,234,.35),0 12px 24px rgba(24,31,45,.20)}
  65%{opacity:1;transform:translateX(3px) scale(1.025)}
  100%{opacity:1;transform:none}
}


/* v3.11.3 — Randomiser move-between-teams drag interaction */
.randomiser-drag-hint{margin:10px 0 2px;text-align:center;color:#9fb0c5;font-size:11px;font-weight:700;line-height:1.3}
.randomiser-draggable-player{cursor:grab;touch-action:pan-y;-webkit-user-select:none;user-select:none;transition:opacity .14s ease,transform .14s ease,box-shadow .14s ease}
.randomiser-draggable-player.is-drag-source{opacity:.28}
.randomiser-drag-ghost{position:fixed!important;left:0!important;top:0!important;z-index:10000!important;width:min(43vw,250px)!important;pointer-events:none!important;margin:0!important;padding:8px 9px!important;background:#17283b!important;border:1px solid #6b87a5!important;border-radius:9px!important;box-shadow:0 14px 34px rgba(0,0,0,.38)!important;opacity:.96!important;transform:translate3d(-999px,-999px,0);display:grid!important;grid-template-columns:26px minmax(0,1fr) auto!important;gap:7px!important;align-items:center!important;color:#fff!important}
.mvp-team-card.is-drop-target{box-shadow:0 0 0 3px rgba(255,255,255,.2),0 0 24px rgba(47,167,255,.34)!important;transform:scale(1.012);transition:transform .12s ease,box-shadow .12s ease}
.mvp-team-orange.is-drop-target{box-shadow:0 0 0 3px rgba(255,122,26,.48),0 0 24px rgba(255,122,26,.30)!important}
.mvp-team-blue.is-drop-target{box-shadow:0 0 0 3px rgba(47,167,255,.52),0 0 24px rgba(47,167,255,.34)!important}
.randomiser-draggable-player.just-arrived{animation:randomiserPlayerArrive .5s ease-out}
@keyframes randomiserPlayerArrive{0%{opacity:.15;transform:translateY(-12px) scale(.97)}55%{opacity:1;transform:translateY(2px) scale(1.015)}100%{transform:none}}


/* v3.11.3 — drag-only team editing; centred compact Save teams CTA */
.mvp-team-actions-save-only{
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  margin-top:12px!important;
}
.mvp-team-actions-save-only .mvp-action-save{
  width:min(76%,360px)!important;
  min-height:46px!important;
  padding:9px 24px!important;
  border-radius:12px!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:center!important;
  gap:12px!important;
  font-size:13px!important;
  font-weight:800!important;
}
.mvp-team-actions-save-only .mvp-action-svg{margin:0!important;flex:0 0 auto!important}
.mvp-team-actions-save-only .mvp-action-save .floppy-icon{width:24px!important;height:24px!important}
@media(max-width:430px){
  .mvp-team-actions-save-only .mvp-action-save{width:78%!important;min-height:44px!important;padding:8px 20px!important}
}

/* v3.11.3 — approved green Save teams CTA */
.mvp-team-actions-save-only .mvp-action-save,
.mvp-team-actions-save-only button:first-child{
  background:linear-gradient(180deg,#13a966,#07814c)!important;
  border-color:#1bc47a!important;
  color:#fff!important;
  box-shadow:0 5px 16px rgba(15,164,98,.2)!important;
}


/* =========================================================
   v3.11.3 — published unscored match soft-glow highlight
   Applies only while an unscored match is published. Scored matches are never highlighted.
   ========================================================= */
.history-item.history-item-published{
  border:2px solid rgba(157,92,255,.92)!important;
  box-shadow:
    0 0 0 2px rgba(157,92,255,.16),
    0 0 10px rgba(157,92,255,.42),
    0 0 24px rgba(126,78,255,.28)!important;
}

/* =========================================================
   v3.11.3 — published/unscored glow specificity fix
   Match History's scoped shell uses !important, so this selector must be equally/more specific.
   ========================================================= */
#tab-history .history-item.history-item-published{
  border:2px solid rgba(157,92,255,.92)!important;
  box-shadow:
    0 0 0 2px rgba(157,92,255,.16),
    0 0 10px rgba(157,92,255,.42),
    0 0 24px rgba(126,78,255,.28)!important;
}

/* v3.11.3 — production asset revision/cache-bust */

/* v3.11.4 STAGING4 — Lineups Match Trivia */
.lineups-match-facts{margin-top:12px;border:1px solid #304157;border-radius:12px;background:#101d2b;color:#d9e4f2;padding:11px 14px}
.lineups-match-facts h3{display:flex;align-items:center;gap:8px;margin:0 0 4px;padding-bottom:8px;border-bottom:1px solid #26384c;color:#fff;font-size:15px}
.lineups-match-facts h3>span{color:#b9c9dc;font-size:20px}.match-fact-row{display:grid;grid-template-columns:30px minmax(0,1fr);gap:9px;align-items:start;padding:9px 0;border-bottom:1px solid #26384c}.match-fact-row:last-child{border-bottom:0;padding-bottom:2px}.match-fact-icon{font-size:21px;line-height:1.2;text-align:center}.match-fact-row strong,.match-fact-row span:not(.match-fact-icon){display:block}.match-fact-row strong{color:#fff;font-size:13px;margin-bottom:2px}.match-fact-row div>span{font-size:11.5px;line-height:1.35;color:#b9c9dc}
.dev-match-facts-top{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}.dev-match-facts-top label,.dev-check-line{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700}.dev-match-facts-top select{margin-left:auto;min-width:70px}.dev-fact-type-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px 10px}.dev-fact-type-grid label{display:flex;align-items:center;gap:7px;min-height:38px;font-size:12px}.dev-fact-threshold-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.dev-fact-threshold-grid label{display:grid;grid-template-columns:minmax(0,1fr) 62px 42px;align-items:center;gap:6px;font-size:12px}.dev-fact-threshold-grid input{min-width:0}.dev-fact-threshold-grid span{color:#718096;font-size:11px}.dev-match-facts-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:16px}.match-facts-preview-sheet{position:relative;padding:20px}.match-facts-preview-body>p{color:#667085}.dev-fact-preview-row{display:grid;grid-template-columns:18px 25px minmax(0,1fr);gap:7px;padding:9px 0;border-bottom:1px solid #e4e9f1}.dev-fact-preview-row strong,.dev-fact-preview-row small{display:block}.dev-fact-preview-row small{color:#667085;line-height:1.35;margin-top:2px}
@media(max-width:430px){.dev-fact-type-grid,.dev-fact-threshold-grid,.dev-match-facts-top{grid-template-columns:1fr}.dev-match-facts-actions{align-items:flex-start;flex-direction:column}.lineups-match-facts{padding:10px 11px}}

/* v3.11.4 STAGING4 — Match Trivia Dev Settings compact checkbox repair */
.dev-settings-pane[data-dev-pane-content="matchfacts"]{color:#111827}
.dev-settings-pane[data-dev-pane-content="matchfacts"] h3,.dev-settings-pane[data-dev-pane-content="matchfacts"] label{color:#111827}
.dev-settings-pane[data-dev-pane-content="matchfacts"] .dev-fact-type-grid label{border:1px solid #dde3eb;background:#f8fafc;border-radius:9px;padding:8px 10px;min-height:40px}
.dev-settings-pane[data-dev-pane-content="matchfacts"] .dev-fact-type-grid input[type="checkbox"],
.dev-settings-pane[data-dev-pane-content="matchfacts"] .dev-check-line input[type="checkbox"]{width:18px!important;height:18px!important;min-width:18px!important;max-width:18px!important;margin:0!important;padding:0!important;flex:0 0 18px}
.dev-settings-pane[data-dev-pane-content="matchfacts"] .dev-fact-type-grid{margin-top:9px}
.dev-settings-pane[data-dev-pane-content="matchfacts"] .dev-fact-threshold-grid label{color:#111827;background:#f8fafc;border:1px solid #dde3eb;border-radius:9px;padding:8px}

/* Match Trivia per-match editorial overrides — v3.11.4 STAGING5 */
.trivia-preview-summary{padding:0 0 10px;border-bottom:1px solid #e4e9f1;color:#667085}.trivia-preview-summary strong,.trivia-preview-summary small{display:block}.trivia-preview-summary strong{font-size:16px;color:#667085}.trivia-preview-summary strong span{color:#1677e8}.trivia-preview-summary small{font-size:12px;line-height:1.45;margin-top:4px}.dev-fact-preview-wrap{border-bottom:1px solid #e4e9f1}.dev-fact-preview-row{width:100%!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;display:grid!important;grid-template-columns:28px 28px minmax(0,1fr) auto 18px!important;gap:7px!important;align-items:start!important;text-align:left!important;padding:12px 0!important;color:#101828!important}.dev-fact-preview-row>span:nth-child(2){font-size:20px}.dev-fact-preview-row strong{font-size:15px}.dev-fact-preview-row small{font-size:12px;color:#667085;line-height:1.35;margin-top:3px}.trivia-state{width:24px;height:24px;border-radius:50%;display:grid!important;place-items:center;font-weight:900;font-size:15px;color:white}.trivia-state.shown{background:#20ad5a}.trivia-state.suppressed{background:#aab2bd}.dev-fact-preview-row.is-manual .trivia-state.shown{background:#1677e8}.dev-fact-preview-row.is-manual .trivia-state.suppressed{background:#d82035}.trivia-mode{font-size:10px!important;font-weight:900;padding:4px 8px;border-radius:999px;line-height:1!important;margin-top:1px}.trivia-mode.auto{background:#e5e9ef;color:#536174}.trivia-mode.manual{background:#cce7ff;color:#0868cf}.trivia-chevron{font-size:20px!important;color:#536174;line-height:1}.trivia-override-actions{display:grid;grid-template-columns:1fr 1fr 1fr;gap:7px;padding:8px 0 12px 63px}.trivia-override-actions button{width:auto!important;min-height:62px;border:1px solid #d7dee8;border-radius:8px;background:#f7f9fc;color:#1b2940;padding:7px 4px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:17px}.trivia-override-actions button strong{font-size:11px;margin-top:2px}.trivia-override-actions button small{font-size:9px;color:#667085}.trivia-override-actions button.active{border-color:#8fc7ff;background:#eaf5ff;color:#0868cf}.trivia-preview-footer{display:grid;grid-template-columns:1.35fr .75fr;gap:10px;padding-top:14px}.trivia-preview-footer button{width:auto!important;min-height:42px;border:0;border-radius:9px;font-weight:800}.trivia-preview-footer button:first-child{background:#33445d;color:white}.trivia-preview-footer button:last-child{background:#cfe8ff;color:#0868cf}@media(max-width:520px){.match-facts-preview-sheet{padding:18px 16px}.trivia-override-actions{padding-left:35px}}

/* v3.11.4 STAGING6 — Dashboard copy + PHooty Socials */
.dashboard-heading{align-items:stretch}.dashboard-heading-main{flex:1}.dashboard-socials-tile{flex:0 0 104px;min-height:82px;border:1.5px solid #f97316;border-radius:15px;background:linear-gradient(180deg,#14263a,#0e1b2c);color:#fff;display:grid;grid-template-columns:30px 1fr 12px;align-items:center;gap:5px;padding:10px 8px;text-align:left;box-shadow:0 5px 18px rgba(0,0,0,.16)}.dashboard-socials-tile[hidden]{display:none}.dashboard-socials-tile>span{font-size:25px}.dashboard-socials-tile>strong{font-size:12px;line-height:1.16}.dashboard-socials-tile>b{font-size:23px;color:#fff}.dashboard-socials-dialog{max-width:520px}.dashboard-socials-sheet{position:relative;background:linear-gradient(180deg,#14263a,#0e1b2c)!important;color:#edf5ff!important}.dashboard-socials-brand{display:flex;align-items:center;gap:10px;margin:5px 0 18px}.dashboard-socials-brand span{font-size:30px}.dashboard-socials-brand h2{margin:0;color:#fff}.dashboard-socials-sheet>h3{font-size:21px;margin:0 0 14px;color:#fff}.dashboard-socials-meta{display:flex;flex-direction:column;gap:9px;margin-bottom:18px}.dashboard-socials-meta>div{display:grid;grid-template-columns:25px 1fr;gap:8px;align-items:center;color:#c6d3e5}.dashboard-socials-meta strong{font-weight:600}.dashboard-socials-description{color:#d5dfec;line-height:1.5;margin:4px 0 18px}.dashboard-socials-calendar{width:100%;background:linear-gradient(180deg,#fb923c,#f97316)!important;color:#111827!important;border-color:#f97316!important}.dev-social-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.dev-social-fields label{display:flex;flex-direction:column;gap:5px}.dev-social-fields .dev-social-description{grid-column:1/-1}.dev-social-preview{width:100%;margin-top:10px}.dev-welcome-field small{display:block;color:#718096;margin-top:5px}@media(max-width:700px){.dashboard-heading-main{align-items:flex-start}.dashboard-socials-tile{flex-basis:96px;min-height:78px}.dev-social-fields{grid-template-columns:1fr 1fr}.dev-social-fields .dev-social-description,.dev-social-fields label:nth-child(2),.dev-social-fields label:nth-child(6){grid-column:1/-1}}

/* v3.11.4 STAGING6 revised — compact Upcoming Social + centred tray identity */
.dashboard-heading{position:relative;min-height:0!important;}
.dashboard-heading-main{min-height:0!important;}
.dashboard-socials-tile{flex:0 0 104px!important;min-height:0!important;height:58px!important;align-self:center!important;border-radius:14px!important;padding:7px 7px!important;grid-template-columns:27px 1fr 10px!important;gap:4px!important;}
.dashboard-socials-tile>span{font-size:23px!important;}
.dashboard-socials-tile>strong{font-size:11.5px!important;line-height:1.12!important;}
.dashboard-socials-tile>b{font-size:21px!important;}
.dashboard-socials-brand{display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:center!important;text-align:center!important;gap:3px!important;margin:8px 42px 18px!important;}
.dashboard-socials-brand span{font-size:34px!important;line-height:1!important;}
.dashboard-socials-brand h2{font-size:14px!important;line-height:1.2!important;color:#aebdd0!important;font-weight:700!important;margin:0!important;}
.dashboard-socials-sheet .dashboard-announcement-close{top:16px!important;right:16px!important;left:auto!important;}
@media(max-width:700px){.dashboard-socials-tile{flex-basis:100px!important;height:56px!important;min-height:0!important;}.dashboard-socials-brand{margin-left:42px!important;margin-right:42px!important;}}

/* v3.11.4 STAGING7 — approved compact Upcoming Social tray */
.dashboard-socials-sheet{position:relative!important;padding-top:10px!important;}
.dashboard-socials-sheet .dashboard-announcement-close{position:absolute!important;top:14px!important;right:14px!important;left:auto!important;margin:0!important;z-index:5!important;}
.dashboard-socials-brand{margin:2px 48px 14px!important;gap:3px!important;}
.dashboard-socials-brand span{font-size:32px!important;line-height:1!important;}
.dashboard-socials-brand h2{font-size:14px!important;line-height:1.15!important;margin:0!important;}
.dashboard-socials-sheet>h3{margin-top:0!important;margin-bottom:14px!important;}
@media(max-width:700px){
  .dashboard-socials-sheet{padding-top:9px!important;}
  .dashboard-socials-sheet .dashboard-announcement-close{position:absolute!important;top:13px!important;right:13px!important;left:auto!important;}
  .dashboard-socials-brand{margin:1px 48px 13px!important;}
}

/* v3.11.5 STAGING — year/month filters + PH A Cup */
.shell-filter{width:auto!important;min-width:112px;border:1.5px solid #ff7a1a!important;background:#102a43!important;color:#fff!important;border-radius:10px!important;padding:7px 28px 7px 10px!important;font-size:12px!important;font-weight:800!important}.rankings-filter-stack,.financial-filter-stack,.history-filter-stack{display:flex;flex-direction:column;align-items:flex-end;gap:6px}.rankings-filter-stack .badge,.financial-filter-stack .badge{align-self:flex-end}.financial-filter-stack .phees-open-btn{margin:0!important}.phees-chevron{font-size:18px;line-height:1;margin-left:3px}.cup-randomiser-control{border:1px solid #d59a24;background:linear-gradient(180deg,#17304a,#10263b);border-radius:14px;padding:11px;margin:4px 0 12px;color:#fff}.cup-toggle-row{display:flex;justify-content:space-between;align-items:center;gap:12px}.cup-toggle-row>div{min-width:0}.cup-toggle-row strong{display:block;font-size:15px}.cup-toggle-row small{display:block;color:#aec0d4;margin-top:3px}.cup-match-status{margin-top:9px;padding:9px 10px;border-radius:10px;background:#241f15;border:1px solid #a8791e;color:#f4e7c2;font-size:12px;line-height:1.4}.cup-player-badge{font-size:11px;margin-left:4px}.cup-tournament-view{color:#f4f7fb}.cup-hero{border:1px solid #31506d;border-radius:14px;padding:14px;background:#102a43;margin-bottom:10px;text-align:center}.cup-hero h2{margin:3px 0;font-size:23px}.cup-hero p{color:#aec0d4;font-size:12px}.cup-trophy{font-size:34px}.cup-stats{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:12px}.cup-stats span{background:#173650;border-radius:9px;padding:8px;font-size:11px}.cup-stats b{font-size:15px;color:#fff}.cup-survivors{border:1px solid #31506d;border-radius:14px;padding:12px;background:#102a43;margin-bottom:10px}.cup-survivors>div:first-child{display:flex;justify-content:space-between;gap:8px}.cup-survivors>div:first-child span{color:#52d273;font-size:12px;font-weight:800}.cup-player-chips{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}.cup-player-chips span{background:#173650;border:1px solid #31506d;border-radius:8px;padding:6px 9px;font-size:11px}.cup-survivors button{width:100%;border:1px solid #ff7a1a!important;background:transparent!important;color:#ff9a4b!important}.cup-rounds{display:grid;gap:7px}.cup-round-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:8px;border:1px solid #31506d;background:#102a43;border-radius:11px;padding:10px}.cup-round-row div{min-width:0}.cup-round-row strong,.cup-round-row small{display:block}.cup-round-row small{color:#9fb0c5;font-size:10px;margin-top:2px}.cup-round-row>span{color:#f7b84b;font-weight:800;font-size:11px}.cup-round-row>b{font-size:12px}.cup-editor-head{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px}.cup-editor-head h2{text-align:center;margin:0}.cup-player-checklist{display:grid;gap:6px;margin-top:10px}.cup-player-checklist label{display:flex;align-items:center;gap:9px;border:1px solid #dce3eb;border-radius:9px;padding:8px}.cup-player-checklist input{width:18px!important;height:18px!important}.cup-player-checklist label span{margin:0!important}.dev-settings-tabs{grid-template-columns:repeat(3,minmax(0,1fr))!important}
@media(max-width:430px){#tab-history>.panel>.section-heading,#tab-rankings>.panel>.section-heading,#tab-financials #financialContent>.section-heading{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important}.shell-filter{min-width:105px!important;max-width:132px}.cup-round-row{grid-template-columns:minmax(0,1fr) auto}.cup-round-row>b{grid-column:2}.financial-filter-stack .phees-open-btn{min-width:104px}}

/* v3.11.5 STAGING r2 — approved Financials/Rankings/Social UX */
.shell-filter{-webkit-appearance:none!important;appearance:none!important;background-color:#102a43!important;background-image:linear-gradient(45deg,transparent 50%,#ff7a1a 50%),linear-gradient(135deg,#ff7a1a 50%,transparent 50%)!important;background-position:calc(100% - 15px) 50%,calc(100% - 10px) 50%!important;background-size:5px 5px,5px 5px!important;background-repeat:no-repeat!important;color:#fff!important;border:1.5px solid #ff7a1a!important;}
.rankings-filter-stack .shell-filter{min-width:92px!important;width:92px!important;max-width:92px!important;padding-right:26px!important;}
.financial-filter-stack .shell-filter{min-width:116px!important;width:116px!important;max-width:116px!important;padding-right:26px!important;}
.financial-filter-stack #monthSummary{display:none!important;}
.financial-filter-stack .phees-open-btn{min-width:116px!important;width:116px!important;min-height:36px!important;padding:7px 10px!important;border-radius:12px!important;font-size:12px!important;}
.financial-filter-stack .phees-open-btn svg{width:16px!important;height:16px!important;flex-basis:16px!important;}
.financial-period-summary{color:#c5d2e2;font-size:11px;font-weight:750;margin:2px 2px 9px;}
.dashboard-socials-rsvp{width:100%;min-height:48px;margin:0 0 10px!important;border:1.5px solid #ff7a1a!important;background:transparent!important;color:#ff8a2a!important;font-weight:850!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;}
.dashboard-socials-rsvp[hidden]{display:none!important}.dashboard-socials-rsvp span{font-size:22px;line-height:1}.dev-social-rsvp-config{grid-column:1/-1;border-top:1px solid rgba(113,128,150,.3);padding-top:10px;display:grid;grid-template-columns:1fr 1fr;gap:10px}.dev-social-rsvp-config>.dev-dashboard-setting-row,.dev-social-rsvp-config>.dev-social-description{grid-column:1/-1}.dev-social-rsvp-config small{display:block;color:#718096;margin-top:3px}
@media(max-width:430px){.rankings-filter-stack .shell-filter{width:92px!important;min-width:92px!important;max-width:92px!important}.financial-filter-stack .shell-filter,.financial-filter-stack .phees-open-btn{width:116px!important;min-width:116px!important;max-width:116px!important}.dev-social-rsvp-config{grid-template-columns:1fr}}

/* v3.11.5 staging r3: align Financials + Match History selectors with Rankings */
.financial-filter-stack .shell-filter{background-color:#102a43!important;color:#fff!important;border:1.5px solid #ff7a1a!important;}
.history-filter-stack .shell-filter{min-width:146px!important;width:146px!important;max-width:146px!important;padding-right:26px!important;}
@media(max-width:430px){.history-filter-stack .shell-filter{width:146px!important;min-width:146px!important;max-width:146px!important}}

/* v3.11.5 STAGING R4 — shell selector consistency */
/* Financials previously had a legacy #financialMonth white-background !important rule.
   Override at equal/higher specificity so it is visually identical to Rankings. */
#tab-financials #financialContent .financial-filter-stack #financialMonth{
  -webkit-appearance:none!important;appearance:none!important;
  background-color:#102a43!important;
  background-image:linear-gradient(45deg,transparent 50%,#ff7a1a 50%),linear-gradient(135deg,#ff7a1a 50%,transparent 50%)!important;
  background-position:calc(100% - 15px) 50%,calc(100% - 10px) 50%!important;
  background-size:5px 5px,5px 5px!important;background-repeat:no-repeat!important;
  color:#fff!important;border:1.5px solid #ff7a1a!important;border-radius:10px!important;
  width:116px!important;min-width:116px!important;max-width:116px!important;
  padding:7px 26px 7px 10px!important;font-size:12px!important;font-weight:800!important;
}
/* Match History: keep full label but reclaim heading-copy width. */
.history-filter-stack .shell-filter{
  width:132px!important;min-width:132px!important;max-width:132px!important;
  font-size:11px!important;padding-left:9px!important;padding-right:22px!important;
  background-position:calc(100% - 12px) 50%,calc(100% - 7px) 50%!important;
}
@media(max-width:430px){.history-filter-stack .shell-filter{width:132px!important;min-width:132px!important;max-width:132px!important}}

/* v3.11.5 STAGING R6 — Android pull-to-refresh experiments removed; native iOS scrolling restored. */

/* v3.11.5 STAGING R8 — restore native vertical boundary/elastic scrolling.
   Explicitly undo all vertical overscroll suppression on the document/app shell.
   Component-specific horizontal gesture protection remains unchanged. */
html, body, .app-shell {
  overscroll-behavior-y: auto !important;
}
/* v3.11.5 STAGING R11 — PH A Cup staged UX */
.cup-game-mode-control{border:0!important;background:transparent!important;padding:0!important;margin:4px 0 12px!important}.cup-game-mode-slider{display:grid;grid-template-columns:1fr 1fr;width:100%;padding:3px;border:1.5px solid #45647f;border-radius:12px;background:#0d2236;gap:3px}.cup-game-mode-option{min-height:38px;border:0!important;border-radius:9px!important;background:transparent!important;color:#d9e3ee!important;font-weight:850!important;font-size:13px!important;box-shadow:none!important}.cup-game-mode-option.is-active{background:#ff7a1a!important;color:#fff!important}.cup-game-mode-control .cup-match-status{margin-top:8px}.orbit-player.cup-qualified span{color:#ffd84d!important;font-weight:900}.orbit-player.cup-eliminated span{color:#ff6269!important;font-weight:900}.history-cup-controls{display:flex;flex-direction:column;align-items:flex-end;gap:6px}.history-cup-toggle{width:46px;height:42px;border:1.5px solid #61758b!important;border-radius:11px!important;background:#18324b!important;color:#8798aa!important;font-size:21px!important;padding:0!important;box-shadow:none!important}.history-cup-toggle.is-active{border-color:#ff9c24!important;color:#ffc33d!important;background:#2b281d!important;box-shadow:0 0 0 1px rgba(255,156,36,.18)!important}.history-cup-controls .shell-filter{min-width:128px!important;max-width:150px!important}.history-item-cup .history-meta{align-items:flex-start}.history-cup-match-mark{display:block;color:#e8b52f;font-size:16px;line-height:1;margin-top:5px}.history-player-name .history-cup-player-mark{color:#dcae2d;font-size:10px;margin-right:4px;vertical-align:1px}.edit-cup-game-row{display:flex!important;align-items:center;justify-content:space-between;gap:12px;margin:12px 0;padding:11px 12px;border:1px solid #d8dee7;border-radius:12px;background:#f6f8fb}.edit-cup-game-row>span:first-child{display:block;min-width:0}.edit-cup-game-row strong,.edit-cup-game-row small{display:block}.edit-cup-game-row small{color:#6c7889;margin-top:3px;font-size:11px}.dev-cup-reset-row .danger{width:auto!important;min-width:82px}.cup-phase-note{color:#aebed0;font-size:12px;line-height:1.45;margin:5px 0 10px}.cup-round-row{display:block!important}.cup-round-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.cup-round-score{font-weight:850;color:#fff}.cup-round-detail{margin-top:8px;padding-top:8px;border-top:1px solid #29465f;display:grid;gap:5px;font-size:11px}.cup-round-detail span{display:block;color:#b7c6d6}.cup-round-detail strong{color:#fff}.cup-qualified-label{color:#ffd84d!important}.cup-progress-label{color:#7ce09a!important}.cup-eliminated-label{color:#ff7b80!important}
@media(max-width:430px){.history-cup-controls .shell-filter{min-width:122px!important;max-width:142px!important}.cup-game-mode-option{font-size:12px!important}}

/* v3.11.5 STAGING R13 — isolated PH A Cup lifecycle refinements */
.history-cup-toggle{width:40px!important;height:36px!important;font-size:18px!important;border-radius:10px!important}.history-cup-match-line{display:flex;align-items:center;gap:5px;margin-top:5px;color:#e8b52f;font-size:11px;font-weight:800}.history-cup-match-line .history-cup-match-mark{display:inline;margin:0;font-size:13px}.history-cup-player-mark{display:inline-block;width:12px;height:12px;margin-right:4px;font-size:0!important;vertical-align:-1px;position:relative}.history-cup-player-mark:before{content:"🏆";font-size:10px;position:absolute;inset:-1px 0 0 0;filter:grayscale(1);opacity:.9}.cup-mark-entering:before{filter:sepia(1) saturate(5);opacity:1}.cup-mark-progress:before{filter:hue-rotate(70deg) saturate(4);opacity:1}.cup-mark-eliminated:before{filter:hue-rotate(300deg) saturate(6);opacity:1}.cup-round-score{display:flex;gap:4px;align-items:center;font-size:11px!important}.cup-score-orange{color:#ff9a4b}.cup-score-blue{color:#75b8ff}.cup-score-winner{font-weight:950;text-decoration:underline}.cup-score-loser{opacity:.65}.cup-victory-row{color:#ffe06b!important}.cup-goal-row{color:#e9f2ff!important}.cup-resurrect-btn{width:100%;margin-top:9px!important;border-color:#ff7a1a!important;color:#ff9a4b!important;background:transparent!important}.cup-resurrected{margin-top:9px;display:flex;justify-content:center;align-items:center;gap:8px;padding:8px;border-radius:9px;background:#153b2c;color:#80e39b;font-weight:850;font-size:11px}.cup-resurrection-undo{width:20px!important;height:20px!important;min-height:0!important;padding:0!important;border:0!important;border-radius:50%!important;background:#d9464f!important;color:#fff!important;line-height:20px!important}.cup-winner-detected{border:1px solid #d5a22c;background:#282315;border-radius:14px;padding:14px;margin-bottom:10px;text-align:center}.cup-winner-detected strong{display:block;color:#ffd75b;font-size:16px;margin-bottom:10px}.cup-publish-winner{width:100%}.cup-champion-hero{border-color:#d5a22c!important;background:linear-gradient(180deg,#2b281c,#102a43)!important}.cup-champion-name{margin-top:12px;padding:12px;border:1px solid #d5a22c;border-radius:11px;color:#ffd75b;font-size:16px;font-weight:950}.cup-player-checklist input[type=radio]{width:18px!important;height:18px!important}

/* v3.11.5 STAGING R13 — Cup identity callouts only */
.lineups-cup-callout,.dashboard-cup-callout{display:flex;align-items:center;gap:.38rem;margin:.15rem 0 .75rem;padding:.48rem .72rem;border:1px solid rgba(255,166,0,.55);border-radius:12px;background:rgba(255,153,0,.08);color:#ffd35a;font-size:.9rem;line-height:1.25}.dashboard-cup-callout{margin:.15rem 0 .55rem}.lineups-cup-callout strong{color:#ffd35a}

/* v3.11.5 STAGING R17 — contained Cup/announcement fixes */
.lineups-team li{position:relative}.lineups-cup-player{margin-left:auto;padding-left:8px;color:#e6b72f;font-size:13px;line-height:1;flex:0 0 auto}.dev-auto-announcements{margin:10px 0 12px;padding:10px 12px;border:1px solid #d9e0e8;border-radius:12px;background:#f7f9fc}.dev-auto-announcements h4{margin:0 0 6px;font-size:13px}.dev-auto-announcement-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0}.dev-auto-announcement-row+.dev-auto-announcement-row{border-top:1px solid #e2e7ed}.dev-auto-announcement-row>span:first-child{min-width:0}.dev-auto-announcement-row strong,.dev-auto-announcement-row small{display:block}.dev-auto-announcement-row small{margin-top:2px;color:#6d7888;font-size:10px;line-height:1.3}

/* v3.11.5 STAGING R17 — contained UI fixes */
.lineups-team li{grid-template-columns:27px minmax(0,1fr) 18px!important}
.lineups-team li .lineups-cup-player{grid-column:3;justify-self:end;margin-left:0!important;padding-left:0!important;font-size:13px;line-height:1}
@media(max-width:430px){.lineups-team li{grid-template-columns:23px minmax(0,1fr) 17px!important}}
.cup-round-row{position:relative}
.cup-resurrect-corner{position:absolute!important;right:10px!important;bottom:9px!important;width:34px!important;height:34px!important;min-height:34px!important;padding:0!important;border:1px solid #ff7a1a!important;border-radius:10px!important;background:#ff7a1a!important;color:#fff!important;font-size:18px!important;line-height:32px!important;box-shadow:0 2px 8px rgba(0,0,0,.2)}
.cup-round-row:has(.cup-resurrect-corner){padding-bottom:48px!important}
.cup-resurrected-line{display:block;color:#ffd06a!important;margin-top:4px}.cup-resurrected-line strong{color:#fff}
.cup-resurrect-clear{margin-top:8px!important;border-top:1px solid rgba(255,255,255,.12);padding-top:10px!important;color:#ff8b8b}


/* v3.11.5 STAGING R17 — Resurrect control sits within natural round-card content */
.cup-resurrect-corner{right:10px!important;bottom:10px!important;z-index:3!important;pointer-events:auto!important}
.cup-round-row:has(.cup-resurrect-corner){padding-bottom:16px!important}
.cup-round-row:has(.cup-resurrect-corner) .cup-round-detail{padding-right:48px!important;min-height:38px}
\n\n/* v3.11.5 STAGING R19 — Dashboard outstanding-action attention states. */
@keyframes phootySocialAttention{0%,100%{box-shadow:0 5px 18px rgba(0,0,0,.16),0 0 0 rgba(249,115,22,0)}50%{box-shadow:0 5px 18px rgba(0,0,0,.16),0 0 14px rgba(249,115,22,.72),0 0 3px rgba(249,115,22,.95)}}
@keyframes phootySocialIconPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
@keyframes phootyMotmAttention{0%,100%{box-shadow:0 10px 25px rgba(0,0,0,.15),0 0 0 rgba(228,63,95,0)}50%{box-shadow:0 10px 25px rgba(0,0,0,.15),0 0 17px rgba(228,63,95,.58),0 0 4px rgba(228,63,95,.9)}}
@keyframes phootyMotmIconPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.07)}}
.dashboard-socials-tile.is-attention{animation:phootySocialAttention 2.8s ease-in-out infinite;will-change:box-shadow}
.dashboard-socials-tile.is-attention>span{animation:phootySocialIconPulse 2.8s ease-in-out infinite;transform-origin:center}
.dashboard-motm-card.is-attention{animation:phootyMotmAttention 3.2s ease-in-out .8s infinite;will-change:box-shadow}
.dashboard-motm-card.is-attention .dashboard-card-icon{display:inline-block;animation:phootyMotmIconPulse 3.2s ease-in-out .8s infinite;transform-origin:center}
@media (prefers-reduced-motion:reduce){.dashboard-socials-tile.is-attention,.dashboard-socials-tile.is-attention>span,.dashboard-motm-card.is-attention,.dashboard-motm-card.is-attention .dashboard-card-icon{animation:none!important}}
\n\n/* v3.11.5 STAGING R19 — stronger outstanding-action animation. */
@keyframes phootySocialAttentionR19{0%,100%{box-shadow:0 5px 18px rgba(0,0,0,.18),0 0 0 1px rgba(249,115,22,.32),0 0 5px rgba(249,115,22,.18)}50%{box-shadow:0 5px 18px rgba(0,0,0,.18),0 0 0 2px rgba(249,115,22,.95),0 0 24px rgba(249,115,22,.9),0 0 10px rgba(249,115,22,.7)}}
@keyframes phootySocialContentR19{0%,100%{transform:scale(1)}50%{transform:scale(1.055)}}
@keyframes phootyMotmAttentionR19{0%,100%{box-shadow:0 10px 25px rgba(0,0,0,.17),0 0 0 1px rgba(228,63,95,.3),0 0 5px rgba(228,63,95,.16)}50%{box-shadow:0 10px 25px rgba(0,0,0,.17),0 0 0 2px rgba(228,63,95,.95),0 0 27px rgba(228,63,95,.86),0 0 11px rgba(228,63,95,.64)}}
@keyframes phootyMotmCtaR19{0%,100%{transform:scale(1)}50%{transform:scale(1.035)}}
.dashboard-socials-tile.is-attention{animation:phootySocialAttentionR19 2.35s ease-in-out infinite!important;will-change:box-shadow}
.dashboard-socials-tile.is-attention #dashboardSocialsTileIcon,.dashboard-socials-tile.is-attention strong{display:inline-block;animation:phootySocialContentR19 2.35s ease-in-out infinite!important;transform-origin:center;will-change:transform}
.dashboard-motm-card.is-attention{animation:phootyMotmAttentionR19 2.65s ease-in-out .55s infinite!important;will-change:box-shadow}
.dashboard-motm-card.is-attention .dashboard-tile-cta.motm-open{animation:phootyMotmCtaR19 2.15s ease-in-out .35s infinite;transform-origin:center;will-change:transform}
@media (prefers-reduced-motion:reduce){.dashboard-socials-tile.is-attention,.dashboard-socials-tile.is-attention #dashboardSocialsTileIcon,.dashboard-socials-tile.is-attention strong,.dashboard-motm-card.is-attention,.dashboard-motm-card.is-attention .dashboard-tile-cta.motm-open{animation:none!important}}

/* v3.11.5 STAGING R20 — stronger Social outstanding-action treatment. */
@keyframes phootySocialGlowR20{
  0%,100%{border-color:#f97316;box-shadow:0 5px 18px rgba(0,0,0,.18),0 0 0 1px rgba(249,115,22,.35),0 0 8px 2px rgba(249,115,22,.28);filter:drop-shadow(0 0 2px rgba(249,115,22,.30))}
  50%{border-color:#ffb15f;box-shadow:0 5px 18px rgba(0,0,0,.18),0 0 0 3px rgba(255,132,28,.98),0 0 25px 7px rgba(249,115,22,.88),0 0 38px 10px rgba(249,115,22,.42);filter:drop-shadow(0 0 7px rgba(255,130,25,.95))}
}
@keyframes phootySocialIconR20{0%,100%{transform:scale(1)}50%{transform:scale(1.15)}}
@keyframes phootySocialTextR20{0%,100%{transform:scale(1)}50%{transform:scale(1.095)}}
.dashboard-heading{overflow:visible!important}
.dashboard-socials-tile{overflow:visible!important;position:relative!important;transform:translateZ(0)}
.dashboard-socials-tile.is-attention{animation:phootySocialGlowR20 2.15s ease-in-out infinite!important;will-change:box-shadow,filter,border-color}
.dashboard-socials-tile.is-attention #dashboardSocialsTileIcon{display:block!important;animation:phootySocialIconR20 2.15s ease-in-out infinite!important;transform-origin:center center!important;will-change:transform}
.dashboard-socials-tile.is-attention strong{display:block!important;animation:phootySocialTextR20 2.15s ease-in-out infinite!important;transform-origin:center center!important;will-change:transform}
@media (prefers-reduced-motion:reduce){.dashboard-socials-tile.is-attention,.dashboard-socials-tile.is-attention #dashboardSocialsTileIcon,.dashboard-socials-tile.is-attention strong{animation:none!important;filter:none!important}}
/* v3.12.0 STAGING R1 — Web Push */
.push-bell-btn{position:relative;border:0;background:transparent;color:var(--text,#fff);font-size:21px;padding:8px 7px;line-height:1;cursor:pointer}.push-bell-btn i{position:absolute;right:4px;top:5px;width:8px;height:8px;border-radius:50%;background:#36d67a;box-shadow:0 0 0 2px #071b34}.push-tray-body{padding:4px 2px 10px}.push-tray-body .primary,.push-tray-body .secondary{width:100%;margin-top:12px}.push-dev-status{display:grid;gap:8px;margin:12px 0 18px}.push-dev-status>div{display:flex;justify-content:space-between;gap:14px;padding:10px 12px;border-radius:10px;background:rgba(255,255,255,.055)}.push-dev-status span{opacity:.72}.push-dev-status strong{text-align:right}.push-ok{color:#52db8a}.push-warn{color:#ffbf55}

/* v3.12.0 STAGING R2 — Push UX refinement */
.push-bell-btn{color:#ff7a1a!important}.push-bell-art{display:flex;align-items:center;gap:1px;color:#ff7a1a;font-weight:950}.push-bell-shape{font-size:20px;position:relative;width:15px;color:#ff7a1a}.push-bell-shape:before{content:"";position:absolute;left:2px;top:-8px;width:11px;height:14px;border-radius:7px 7px 5px 5px;background:#ff7a1a}.push-bell-shape:after{content:"";position:absolute;left:5px;top:6px;width:6px;height:3px;border-radius:0 0 5px 5px;background:#ff7a1a}.push-bell-wave{font-size:16px;font-weight:900;transform:scaleX(.65);opacity:.95}.push-bell-btn i{background:#35d47b!important;box-shadow:0 0 0 2px #071b34!important}
.push-dialog{background:linear-gradient(180deg,#082b4b,#061f39)!important;color:#fff!important;border:2px solid #ff7a1a!important;border-radius:24px!important;max-width:520px!important;padding:0!important;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.55)!important}.push-dialog form{position:relative;padding:24px 22px 20px}.push-tray-close{position:absolute;right:18px;top:17px;width:42px;height:42px;border-radius:50%;border:1.5px solid #ff7a1a;background:#0b2742;color:#fff;font-size:28px;line-height:34px;z-index:2}.push-tray-head{display:flex;align-items:center;gap:15px;padding:7px 54px 18px 4px}.push-tray-bell{font-size:39px;filter:saturate(1.6)}.push-tray-head h2{margin:0;font-size:25px;color:#fff}.push-tray-head h2 span{color:#ff7a1a}.push-tray-head p{margin:3px 0 0;color:#aebed3;font-size:14px}.push-enabled-panel{border:1px solid rgba(153,187,219,.18);border-radius:18px;background:rgba(5,27,49,.42);padding:24px 16px;text-align:center;margin:0 0 12px}.push-enabled-check{width:68px;height:68px;margin:0 auto 15px;border-radius:50%;display:grid;place-items:center;background:#18c968;color:#fff;font-size:42px;font-weight:950;box-shadow:0 0 0 8px rgba(24,201,104,.12),0 0 24px rgba(24,201,104,.38)}.push-enabled-panel strong{font-size:20px;line-height:1.25}.push-enabled-panel p{color:#9eb0c8;margin:12px 0 0;line-height:1.4}.push-tray-body>#pushTrayCopy{color:#b9c6d8;text-align:center;margin:14px 0}.push-tray-body .primary,.push-disable-btn{width:100%;border-radius:14px!important;padding:15px 12px!important;font-weight:900!important}.push-disable-btn{border:0;background:linear-gradient(90deg,#ff8a2b,#ff6f1d);color:#071b34;font-size:16px;margin-top:12px}.push-dev-pane{color:#eaf2fb}.push-dev-heading{display:flex;align-items:center;gap:12px;margin-bottom:14px}.push-dev-heading-icon{font-size:30px}.push-dev-heading h3{margin:0;color:#fff;font-size:22px}.push-dev-heading p{margin:3px 0 0;color:#91a8c3}.push-dev-card{background:linear-gradient(180deg,rgba(8,46,79,.96),rgba(5,34,61,.96));border:1px solid #2f76a6;border-radius:15px;padding:14px;margin:0 0 14px;box-shadow:inset 0 1px rgba(255,255,255,.025)}.push-dev-card-title{display:flex;gap:10px;align-items:flex-start;margin-bottom:13px}.push-dev-card-title>span{color:#ff7a1a;font-size:24px}.push-dev-card-title h4{margin:0;color:#fff;font-size:17px}.push-dev-card-title p{margin:3px 0 0;color:#9bb0c8;font-size:12px}.push-dev-card-title em{font-size:9px;color:#ff9a4b;border:1px solid #ff7a1a;border-radius:8px;padding:2px 5px;font-style:normal;margin-left:5px}.push-dev-status{margin:0}.push-dev-status>div{background:transparent;border-bottom:1px solid rgba(255,255,255,.08);border-radius:0;padding:8px 2px}.push-dev-status>div:last-child{border-bottom:0}.push-dev-status strong{color:#43d884}.push-dev-field{display:grid;grid-template-columns:92px 1fr;gap:8px;align-items:center;margin:10px 0}.push-dev-field strong{font-size:12px}.push-dev-field input,.push-dev-field textarea,.push-dev-field select{width:100%;box-sizing:border-box;background:#08253f;color:#fff;border:1px solid #4b789d;border-radius:9px;padding:10px;font:inherit}.push-dev-field textarea{resize:vertical}.push-dev-field small{grid-column:2;color:#8da5bf;font-size:10px}.push-preview{margin:14px 0;padding:12px;border:1px solid rgba(255,255,255,.12);border-radius:12px;background:#061d33}.push-preview>strong{font-size:12px}.push-preview-tabs{display:flex;margin:9px 0;border:1px solid #355a7b;border-radius:9px;overflow:hidden}.push-preview-tabs span{flex:1;text-align:center;padding:7px;font-size:10px}.push-preview-tabs span:first-child{background:#ff7a1a;color:#071b34;font-weight:900}.push-preview-card{display:flex;gap:9px;align-items:center;background:#f1f3f6;color:#111827;border-radius:10px;padding:10px}.push-preview-card img{width:34px;height:34px;border-radius:8px}.push-preview-card b{font-size:11px}.push-preview-card p{margin:2px 0 0;font-size:9px}.push-send-btn{background:linear-gradient(90deg,#ff8a2b,#ff6f1d)!important;color:#071b34!important}.push-event-list label{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:10px 2px;border-bottom:1px solid rgba(255,255,255,.08)}.push-event-list label:last-child{border-bottom:0}.push-event-list b,.push-event-list small{display:block}.push-event-list b{font-size:12px}.push-event-list small{color:#8ea5bf;font-size:9px;margin-top:2px}.push-event-list input{accent-color:#ff7a1a;width:20px;height:20px}.push-future-note{color:#ffb15f;font-size:10px;line-height:1.4;margin:12px 0 0}.push-advanced-list{display:grid;gap:1px}.push-advanced-list span{padding:10px;border-bottom:1px solid rgba(255,255,255,.08);color:#b8c7d8;font-size:12px}.push-advanced-list span:last-child{border-bottom:0}

/* v3.12.0 STAGING R4 — approved Push UX fidelity pass (scoped) */
.push-bell-btn{width:46px;height:46px;padding:5px!important;display:grid;place-items:center;overflow:visible}.push-bell-art{position:relative;width:38px;height:36px;display:block!important}.push-bell-glyph{position:absolute;left:11px;top:5px;width:17px;height:22px;background:#ff7a1a;border-radius:9px 9px 6px 6px}.push-bell-glyph:before{content:"";position:absolute;left:6px;top:-5px;width:5px;height:7px;border:3px solid #ff7a1a;border-bottom:0;border-radius:6px 6px 0 0}.push-bell-glyph:after{content:"";position:absolute;left:5px;bottom:-6px;width:8px;height:5px;background:#ff7a1a;border-radius:0 0 8px 8px}.push-bell-glyph i{position:absolute;left:-3px;right:-3px;bottom:-1px;height:4px;background:#ff7a1a;border-radius:5px}.push-wave{position:absolute;top:9px;width:8px;height:14px;border-top:3px solid #ff7a1a;border-bottom:3px solid #ff7a1a}.push-wave-left{left:0;border-left:3px solid #ff7a1a;border-radius:12px 0 0 12px}.push-wave-right{right:0;border-right:3px solid #ff7a1a;border-radius:0 12px 12px 0}.push-bell-btn i#pushBellDot{right:2px!important;top:4px!important;width:9px;height:9px}
.push-dialog{width:min(92vw,500px)!important;max-height:min(78vh,650px)!important}.push-dialog form{padding:22px 20px 18px!important}.push-tray-head{padding:5px 54px 15px 2px!important;align-items:center!important}.push-tray-bell{font-size:36px!important;line-height:1}.push-tray-head h2{font-size:25px!important;line-height:1.05!important;white-space:nowrap}.push-tray-head p{font-size:13px!important;line-height:1.25!important}.push-enabled-panel{padding:20px 14px!important}.push-enabled-panel strong{display:block!important;color:#fff!important;font-size:19px!important;line-height:1.25!important}.push-enabled-panel p{font-size:14px!important}.push-enabled-check{width:62px!important;height:62px!important;font-size:38px!important;margin-bottom:13px!important}.push-disable-btn{min-height:54px}
#devSettingsContent .push-dev-pane.active{margin-left:-12px;margin-right:-12px;margin-bottom:-12px;padding:0!important;background:#061b31;color:#eaf2fb;border-radius:0 0 16px 16px;overflow:hidden}.push-dev-shell{padding:18px 14px 24px;background:radial-gradient(circle at 20% 0%,rgba(19,76,116,.32),transparent 34%),linear-gradient(180deg,#06223c 0%,#061a2e 100%)}.push-dev-heading{margin:0 2px 16px!important}.push-dev-heading-icon{font-size:35px!important}.push-dev-heading h3{color:#fff!important;font-size:24px!important;line-height:1.05}.push-dev-heading p{color:#a9bdd3!important;font-size:12px!important}.push-dev-card{border-color:#2b6f9e!important;background:linear-gradient(180deg,#082e4f,#062540)!important;border-radius:15px!important;padding:14px!important;margin-bottom:14px!important}.push-dev-status>div{padding:9px 3px!important}.push-dev-status span{color:#d8e3ef!important;opacity:1!important;font-size:12px}.push-dev-status strong{font-size:12px!important}.push-dev-card-title h4{font-size:17px!important}.push-dev-card-title p{font-size:11px!important;line-height:1.3}.push-dev-field{grid-template-columns:84px minmax(0,1fr)!important}.push-dev-field strong{color:#fff!important}.push-dev-field input,.push-dev-field textarea,.push-dev-field select{min-width:0;background:#071f37!important;border-color:#527b9c!important}.push-preview{background:#061b30!important;border-color:#2b5f86!important}.push-preview-heading{display:flex;gap:9px;align-items:flex-start}.push-preview-heading>span{font-size:20px;color:#dceafa}.push-preview-heading strong,.push-preview-heading small{display:block}.push-preview-heading small{color:#91a8c3;font-size:9px;margin-top:2px}.push-preview-tabs{height:36px}.push-preview-tabs button{flex:1;border:0;background:transparent;color:#fff;font:inherit;font-size:10px}.push-preview-tabs button.active{background:linear-gradient(90deg,#ff8a2b,#ff6f1d);color:#071b34;font-weight:900}.push-preview-card{position:relative;padding-right:38px!important}.push-preview-card>div{min-width:0;display:grid}.push-preview-app{font-size:8px;font-weight:800;color:#4b5563}.push-preview-card b{font-size:11px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.push-preview-card p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.push-preview-now{position:absolute;right:9px;top:8px;font-size:7px;color:#6b7280}.push-event-list label{padding:10px 2px!important}.push-event-list b{color:#fff!important}.push-switch{flex:0 0 auto;width:38px;height:22px;border-radius:12px;background:#55728d;position:relative;opacity:.72}.push-switch i{position:absolute;left:3px;top:3px;width:16px;height:16px;border-radius:50%;background:#dce5ed}.push-switch.is-on{background:#ff7a1a;opacity:1}.push-switch.is-on i{left:19px;background:#fff}.push-advanced-list{gap:0!important}.push-advanced-list>div{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 2px;border-bottom:1px solid rgba(255,255,255,.08)}.push-advanced-list>div:last-child{border-bottom:0}.push-advanced-list>div>span:first-child{display:grid;grid-template-columns:22px 1fr;align-items:start;color:#dce7f3;font-size:12px}.push-advanced-list b{color:#fff}.push-advanced-list small{grid-column:2;color:#8ea5bf;font-size:9px;margin-top:2px}.push-advanced-note{border:1px solid rgba(255,122,26,.65);background:rgba(255,122,26,.07);padding:10px;border-radius:10px}.push-save-preview{width:100%;min-height:46px;border:1px solid #557b9c;border-radius:11px;background:#173c5e;color:#eaf2fb;font-weight:800;opacity:.8}.push-future-note{color:#ffb15f!important}
@media(max-width:430px){.push-tray-head h2{font-size:23px!important}.push-dialog form{padding:20px 17px 17px!important}.push-dev-shell{padding-left:12px;padding-right:12px}.push-dev-field{grid-template-columns:76px minmax(0,1fr)!important}.push-dev-field input,.push-dev-field textarea,.push-dev-field select{font-size:12px!important;padding:9px!important}}

/* v3.12.0 STAGING R4 — approved PHooty ringing bell, geometry-only visual fix */
.push-bell-btn{width:48px!important;height:46px!important;padding:3px!important;display:grid!important;place-items:center!important;overflow:visible!important}
.push-bell-art{position:relative!important;width:42px!important;height:38px!important;display:block!important;transform:none!important}
.push-bell-glyph{position:absolute!important;left:12px!important;top:6px!important;width:18px!important;height:22px!important;background:#ff7a1a!important;border-radius:10px 10px 5px 5px!important;transform:none!important}
.push-bell-glyph:before{content:""!important;position:absolute!important;left:6px!important;top:-6px!important;width:6px!important;height:7px!important;border:3px solid #ff7a1a!important;border-bottom:0!important;border-radius:6px 6px 0 0!important;background:transparent!important;box-sizing:border-box!important}
.push-bell-glyph:after{content:""!important;position:absolute!important;left:5px!important;bottom:-7px!important;width:8px!important;height:6px!important;background:#ff7a1a!important;border:0!important;border-radius:0 0 7px 7px!important}
.push-bell-glyph>i{position:absolute!important;left:-3px!important;right:-3px!important;bottom:-2px!important;height:4px!important;background:#ff7a1a!important;border-radius:5px!important;display:block!important}
.push-wave{position:absolute!important;top:10px!important;width:7px!important;height:15px!important;background:transparent!important;border-top:0!important;border-bottom:0!important;box-sizing:border-box!important}
.push-wave-left{left:1px!important;border:3px solid #ff7a1a!important;border-right:0!important;border-radius:12px 0 0 12px!important}
.push-wave-right{right:1px!important;border:3px solid #ff7a1a!important;border-left:0!important;border-radius:0 12px 12px 0!important}
.push-bell-btn>i#pushBellDot{position:absolute!important;right:2px!important;top:3px!important;width:10px!important;height:10px!important;border-radius:50%!important;background:#35d47b!important;box-shadow:0 0 0 2px #071b34!important;display:block}
.push-bell-btn>i#pushBellDot[hidden]{display:none!important}

/* v3.12.0 STAGING R6 — fixed raster bell assets; no CSS-drawn bell geometry */
.push-bell-btn{width:48px!important;height:46px!important;padding:2px!important;display:grid!important;place-items:center!important;overflow:visible!important}
.push-bell-image{display:block!important;width:44px!important;height:44px!important;object-fit:contain!important;object-position:center!important;max-width:none!important;transform:none!important}

/* v3.12.0 STAGING R6 — approved smaller, optically-centred fixed PNG header bell */
.push-bell-btn{width:44px!important;height:46px!important;padding:0!important;display:grid!important;place-items:center!important;overflow:visible!important}
.push-bell-image{display:block!important;width:38px!important;height:38px!important;object-fit:contain!important;object-position:center!important;max-width:none!important;transform:translateY(1px)!important}


/* v3.12.0 STAGING R7 — smaller right-side fixed PNG bell; visual-only */
.push-bell-btn{width:44px!important;height:46px!important;padding:0!important;display:grid!important;place-items:center!important;overflow:visible!important}
.push-bell-image{display:block!important;width:29px!important;height:29px!important;object-fit:contain!important;object-position:center!important;max-width:none!important;transform:translateY(1px)!important}

/* v3.12.0 STAGING R8 — push onboarding + header bell corrections */
/* Browser is bell-free by default. JS and standalone media both have to agree
   before the control is exposed. */
.push-bell-btn{display:none!important}
html.standalone-pwa .push-bell-btn:not(.hidden),body.standalone-pwa .push-bell-btn:not(.hidden){display:grid!important}
@media(display-mode:standalone){.push-bell-btn:not(.hidden){display:grid!important}}
/* R10: keep the R7 size/right-side slot; align the visible bell centre with the bib/title axis. */
.push-bell-image{width:29px!important;height:29px!important;transform:translateY(-2px)!important}

.push-onboarding-dialog{width:min(90vw,390px)!important;max-width:390px!important;border:0!important;padding:0!important;background:transparent!important;color:#fff!important}
.push-onboarding-dialog::backdrop{background:rgba(2,8,18,.72)!important;backdrop-filter:blur(4px)}
.push-onboarding-dialog form{position:relative;margin:0;padding:28px 20px 22px;border:2px solid #ff7a1a;border-radius:20px;background:linear-gradient(180deg,#0b2b49,#071d34);box-shadow:0 18px 50px rgba(0,0,0,.42);text-align:center}
.push-onboarding-close{position:absolute;right:13px;top:13px;width:34px;height:34px;border-radius:50%;border:1px solid #6d8baa;background:#173550;color:#fff;font-size:24px;line-height:29px;padding:0}
.push-onboarding-bell{height:78px;display:grid;place-items:center;margin:2px 0 5px}.push-onboarding-bell img{width:74px;height:74px;object-fit:contain}
.push-onboarding-dialog h2{font-size:25px;line-height:1.05;margin:6px 0 12px;color:#fff}.push-onboarding-dialog h2 span{color:#ff7a1a}
.push-onboarding-dialog p{margin:0 auto 18px;max-width:300px;color:#c0d0e1;font-size:15px;line-height:1.45}
.push-onboarding-open{width:100%;min-height:52px;border:0;border-radius:13px;background:linear-gradient(90deg,#ff8c2d,#ff6f1d);color:#07182b;font-weight:900;font-size:16px}.push-onboarding-open span{margin-left:8px;font-size:20px;vertical-align:-1px}
.push-onboarding-dialog small{display:block;margin-top:11px;color:#8fa8c1;font-size:11px}

/* v3.12.0 STAGING R11 — post-splash onboarding and final header bell alignment */

/* v3.12.1 STAGING — admin/player preview toggle beside the welcome line. */
.admin-salutation-row{margin-top:5px;margin-left:44px;display:flex;align-items:center;gap:10px;width:max-content}
.admin-salutation-row.hidden{display:none!important}
.admin-salutation-row .admin-salutation{margin:0!important}
.admin-user-view-toggle{width:38px;height:25px;border:1px solid #53627a;border-radius:9px;background:#172033;color:#f8fafc;display:grid;place-items:center;padding:0;flex:0 0 auto}
.admin-user-view-toggle:active{transform:scale(.94)}
.admin-view-eye{position:relative;width:21px;height:13px;border:2px solid currentColor;border-radius:70% 20% 70% 20%;transform:rotate(45deg);display:block}
.admin-view-eye::before{content:"";position:absolute;width:5px;height:5px;border:2px solid currentColor;border-radius:50%;left:5px;top:2px}
.admin-user-view-toggle.user-view-active{color:#f97316;border-color:#53627a}
.admin-user-view-toggle.user-view-active .admin-view-eye::after{content:"";position:absolute;width:27px;height:2px;background:currentColor;left:-5px;top:5px;transform:rotate(-45deg);border-radius:2px;box-shadow:0 0 0 1px #172033}
@media(max-width:430px){.admin-salutation-row{margin-left:42px;margin-top:3px;gap:9px}.admin-user-view-toggle{width:36px;height:24px}}

/* v3.12.1 STAGING R2 — exact five-tab player preview + fixed PNG eye artwork. */
.bottom-nav.player-nav{grid-template-columns:repeat(5,minmax(0,1fr))!important}
.admin-view-eye-image{display:block;width:27px;height:18px;object-fit:contain;pointer-events:none}
.admin-user-view-toggle.user-view-active{color:#f97316;border-color:#53627a}
.admin-user-view-toggle .admin-view-eye{display:none!important}


/* v3.12.1 STAGING R3 — user preview is a presentation override, not an auth role. */
body.admin-user-preview .bottom-nav.player-nav .tab[data-tab="welcome"]{display:flex!important}
body.admin-user-preview .bottom-nav.player-nav{
  width:100vw!important;max-width:920px!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:0!important;
  padding-left:max(2px,env(safe-area-inset-left))!important;padding-right:max(2px,env(safe-area-inset-right))!important;overflow:hidden!important
}
body.admin-user-preview .bottom-nav.player-nav .tab:not([hidden]){min-width:0!important;width:auto!important;padding:5px 1px 4px!important;font-size:8px!important;gap:3px!important;overflow:hidden!important}
body.admin-user-preview .bottom-nav.player-nav .tab:not([hidden]) svg,
body.admin-user-preview .bottom-nav.player-nav .tab:not([hidden]) .welcome-nav-icon,
body.admin-user-preview .bottom-nav.player-nav .tab:not([hidden]) .lineups-group-icon{width:19px!important;height:19px!important;flex:0 0 19px!important}
body.admin-user-preview .bottom-nav.player-nav .tab:not([hidden])>span:last-child{display:block!important;width:100%!important;min-width:0!important;white-space:nowrap!important;overflow:hidden!important;text-align:center!important;letter-spacing:-.015em!important}


/* v3.12.1 STAGING R4 — preview routing correction.
   Do not force #tab-welcome visible: .active owns page visibility. */
body.admin-user-preview .bottom-nav.player-nav{grid-template-columns:repeat(5,minmax(0,1fr))!important}

/* v3.12.1 STAGING R6 — authenticated View-as-User may display the genuine Welcome page. */
body.admin-user-preview #tab-welcome.active{display:block!important}

/* v3.12.1 STAGING R6 — Lineups fixture states, form guide + local formation sandbox */
.lineups-fixture-card{display:flex;align-items:center;gap:14px;margin:2px 0 18px;padding:13px 15px;border:1px solid #304157;border-radius:15px;background:#101d2b;color:#d9e4f2;text-align:left}.lineups-date-block{width:66px;flex:0 0 66px;overflow:hidden;border-radius:10px;background:#f4f6fa;text-align:center;box-shadow:0 2px 8px #0003}.lineups-date-block strong{display:block;padding:4px;background:#d74e59;color:#fff;font-size:12px}.lineups-date-block span{display:block;padding:4px 0 7px;color:#142033;font-size:28px;font-weight:900}.lineups-fixture-copy strong,.lineups-fixture-copy span{display:block}.lineups-fixture-copy strong{margin-bottom:5px;color:#fff;font-size:20px}.lineups-fixture-copy span{margin-top:3px;color:#b9c9dc;font-size:12px}.lineups-awaiting{text-align:center;color:#aec0d4;padding:2px 0 8px}.lineups-awaiting h3{margin:10px 0 6px;color:#fff;font-size:22px}.lineups-awaiting>p{margin:0 0 15px}.lineups-tactics-visual{position:relative;width:180px;height:150px;margin:4px auto 8px;border-radius:50%;background:#152b40}.tactics-clip{position:absolute;left:50%;top:30px;width:78px;height:96px;transform:translateX(-50%);border:8px solid #8fa2ba;border-radius:5px;background:#e7edf5}.tactics-clip:before{content:"";position:absolute;left:19px;top:-20px;width:38px;height:20px;border-radius:8px 8px 3px 3px;background:#8fa2ba}.tactics-shirt{position:absolute;left:50%;top:62px;width:42px;height:38px;transform:translateX(-50%);background:#677991;clip-path:polygon(20% 0,38% 10%,62% 10%,80% 0,100% 20%,82% 38%,76% 100%,24% 100%,18% 38%,0 20%)}.lineups-tactics-visual i{position:absolute;color:#677991;font-style:normal;font-weight:900;font-size:24px}.tactics-x.x1{left:116px;top:58px}.tactics-x.x2{left:113px;top:104px}.tactics-o{left:48px;top:106px}.tactics-arrow{left:77px;top:92px;font-size:34px}.lineups-get-ready{display:grid;grid-template-columns:48px 1fr;gap:12px;align-items:center;margin-top:10px;padding:13px 15px;border:1.5px solid #ff7a1a;border-radius:14px;background:#2b201b;text-align:left}.lineups-get-ready>span{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#ff7a1a;filter:none}.lineups-get-ready strong,.lineups-get-ready small{display:block}.lineups-get-ready strong{color:#ff8a29;font-size:15px}.lineups-get-ready small{margin-top:2px;color:#f0b17f;line-height:1.35}.formation-open{margin-left:auto;border:0;background:transparent;color:#fff;font-size:22px;line-height:1;padding:2px;filter:grayscale(1) brightness(2.2);cursor:pointer}.lineups-player-form{justify-self:end;display:flex;align-items:center}.lineups-player-form .form-dots{gap:3px}.lineups-player-form .form-dot{width:8px;height:8px}.formation-sandbox-dialog{width:min(94vw,430px);max-width:430px;padding:0;border:1px solid #34516d;border-radius:20px;background:#0b1c2c;color:#fff}.formation-sandbox-dialog::backdrop{background:#020713cc}.formation-shell{position:relative;padding:18px}.formation-close{position:absolute;right:13px;top:10px;border:0;background:transparent;color:#b8c9dd;font-size:32px}.formation-title{margin:0 42px 2px 0;font-size:24px}.formation-title-orange{color:#ff8a29}.formation-title-blue{color:#36b0ff}.formation-shell>p{margin:0 0 12px;color:#b8c9dd}.formation-pitch{position:relative;height:min(116vw,520px);max-height:520px;min-height:390px;overflow:hidden;border:4px solid #79d58d;border-radius:12px;background:repeating-linear-gradient(0deg,#158536 0 54px,#188d3b 54px 108px);box-shadow:inset 0 0 0 2px #ffffff33}.formation-pitch:before{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;background:transparent}.formation-pitch:after{content:"";position:absolute;left:0;right:0;top:50%;height:2px;background:#b9efc5;box-shadow:0 -150px 0 #b9efc5,0 150px 0 #b9efc5}.formation-player{position:absolute;z-index:2;width:72px;height:72px;transform:translate(-50%,-50%);touch-action:none;border:2px solid #fff;border-radius:50%;color:#fff;box-shadow:0 3px 8px #0007;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:5px}.formation-player-orange{background:#ff7417}.formation-player-blue{background:#169be9}.formation-player strong{max-width:62px;font-size:12px;line-height:1.05;text-align:center}.formation-player span{font-size:11px;margin-top:3px}.formation-actions{display:flex;justify-content:space-between;gap:12px;margin-top:14px}.formation-actions button{min-height:44px;border:1px solid #54708d;border-radius:10px;background:#142b40;color:#fff;font-weight:800;padding:0 18px}.formation-actions .primary{background:#ff7417;border-color:#ff8a29}.lineups-team li{grid-template-columns:27px minmax(0,1fr) auto!important}

/* v3.12.1 STAGING R7 — formation touch/persistence + approved tactics artwork */
.lineups-tactics-visual{width:190px;height:170px;background:transparent;display:grid;place-items:center}
.lineups-tactics-visual img{display:block;width:100%;height:100%;object-fit:contain}
.formation-pitch{touch-action:none;overscroll-behavior:contain;background:linear-gradient(0deg,#157f36,#199143 50%,#157f36);border-color:#70d18b;user-select:none;-webkit-user-select:none}
.formation-pitch:after{display:none}
.formation-player{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;cursor:grab}
.formation-player:active{cursor:grabbing;z-index:5}
body.formation-dragging{overflow:hidden;overscroll-behavior:none}
.pitch-halfway,.pitch-circle,.pitch-box,.pitch-goal{position:absolute;pointer-events:none;box-sizing:border-box;border-color:#c8f2d2}
.pitch-halfway{left:0;right:0;top:50%;border-top:2px solid #c8f2d2}
.pitch-circle{left:50%;top:50%;width:88px;height:88px;transform:translate(-50%,-50%);border:2px solid #c8f2d2;border-radius:50%}
.pitch-box{left:22%;width:56%;height:18%;border:2px solid #c8f2d2}
.pitch-box-top{top:-2px}.pitch-box-bottom{bottom:-2px}
.pitch-goal{left:38%;width:24%;height:4%;border:2px solid #c8f2d2}
.pitch-goal-top{top:-2px}.pitch-goal-bottom{bottom:-2px}

/* v3.12.1 STAGING R8 — compact formations + correlated landscape full-pitch view */
.formation-rotate-hint{display:block;margin:-5px 0 10px;color:#7f96ad;font-size:11px}
.formation-player{width:58px;height:58px;padding:3px}
.formation-player strong{max-width:50px;font-size:10px;line-height:1.02}
.formation-player span{font-size:9px;margin-top:2px}
.formation-player.is-overlapping{opacity:.58}
.formation-title-both{color:#fff}
@media (orientation:landscape){
  .formation-sandbox-dialog{width:min(96vw,900px);max-width:900px;max-height:96vh}
  .formation-shell{padding:12px 16px}
  .formation-shell>p,.formation-rotate-hint{display:none}
  .formation-title{font-size:21px;margin-bottom:7px}
  .formation-pitch{height:min(70vh,480px);min-height:280px;max-height:480px}
  .formation-player{width:48px;height:48px}
  .formation-player strong{max-width:42px;font-size:9px}
  .formation-player span{font-size:8px}
  .formation-actions{margin-top:8px}
}

/* v3.12.1 STAGING R11 — true landscape pitch, auto-save workspace, approved tactics artwork */
.lineups-tactics-visual{width:220px;height:143px;margin:10px auto 12px}
.lineups-tactics-visual img{width:100%;height:100%;object-fit:cover;border-radius:50%}
@media (orientation:landscape){
  .formation-pitch{height:min(68vh,430px);min-height:260px;max-height:430px}
  .formation-actions{display:none}
  .pitch-halfway{top:0;bottom:0;left:50%;right:auto;width:0;border-top:0;border-left:2px solid #c8f2d2}
  .pitch-box{top:22%;height:56%;width:18%;border:2px solid #c8f2d2}
  .pitch-box-top{left:-2px}.pitch-box-bottom{left:auto;right:-2px;bottom:auto}
  .pitch-goal{top:38%;height:24%;width:4%;border:2px solid #c8f2d2}
  .pitch-goal-top{left:-2px}.pitch-goal-bottom{left:auto;right:-2px;bottom:auto}
}


/* v3.12.1 STAGING R11 — faithful full-pitch landscape + opposing 90° team transforms */
.pitch-centre-spot,.pitch-six,.pitch-arc,.pitch-corner{position:absolute;pointer-events:none;box-sizing:border-box;border-color:#c8f2d2}
.pitch-centre-spot{left:50%;top:50%;width:6px;height:6px;transform:translate(-50%,-50%);border-radius:50%;background:#c8f2d2}
.pitch-six{left:38%;width:24%;height:7%;border:2px solid #c8f2d2}
.pitch-six-top{top:-2px}.pitch-six-bottom{bottom:-2px}
.pitch-arc{left:50%;width:72px;height:36px;transform:translateX(-50%);border:2px solid #c8f2d2;border-radius:0 0 72px 72px;border-top:0}
.pitch-arc-top{top:18%}.pitch-arc-bottom{bottom:18%;transform:translateX(-50%) rotate(180deg)}
.pitch-corner{width:22px;height:22px;border:2px solid #c8f2d2;border-radius:50%}
.pc1{left:-12px;top:-12px}.pc2{right:-12px;top:-12px}.pc3{left:-12px;bottom:-12px}.pc4{right:-12px;bottom:-12px}
@media (orientation:landscape){
  .formation-sandbox-dialog{width:min(97vw,980px);max-width:980px}
  .formation-pitch{height:min(76vh,520px);min-height:300px;max-height:520px;background:repeating-linear-gradient(90deg,#158536 0 74px,#188d3b 74px 148px)}
  .pitch-circle{width:112px;height:112px}
  .pitch-box{top:22%;height:56%;width:18%}
  .pitch-box-top{left:-2px}.pitch-box-bottom{left:auto;right:-2px}
  .pitch-six{top:38%;height:24%;width:7%;left:auto}
  .pitch-six-top{left:-2px}.pitch-six-bottom{right:-2px;bottom:auto}
  .pitch-arc{top:50%;width:36px;height:72px;border:2px solid #c8f2d2;border-radius:0 72px 72px 0;border-left:0;transform:translateY(-50%)}
  .pitch-arc-top{left:18%}.pitch-arc-bottom{left:auto;right:18%;bottom:auto;transform:translateY(-50%) rotate(180deg)}
  .pitch-goal{top:38%;height:24%;width:4%;left:auto}
  .pitch-goal-top{left:-2px}.pitch-goal-bottom{right:-2px}
  .formation-player{width:48px;height:48px}
}


/* v3.12.1 STAGING R11 — formation orientation state, clean chrome + approved clipboard artwork */
.lineups-tactics-visual{width:220px;height:150px;margin:10px auto 12px;background:transparent}
.lineups-tactics-visual img{display:block;width:100%;height:100%;object-fit:contain;border-radius:0}
.formation-open{width:34px;height:34px;display:grid;place-items:center;padding:0;border:0!important;background:transparent!important;box-shadow:none!important;filter:none!important;overflow:hidden}
.formation-open img{display:block;width:26px;height:32px;object-fit:contain;object-position:center}
.formation-actions{display:none!important}
.formation-close{appearance:none!important;-webkit-appearance:none!important;border:0!important;outline:0!important;background:transparent!important;box-shadow:none!important;border-radius:0!important;padding:0!important;width:38px;height:38px;display:grid;place-items:center;color:#b8c9dd!important;line-height:1}
.formation-close:focus,.formation-close:active{outline:0!important;border:0!important;background:transparent!important;box-shadow:none!important}
.pitch-goal{display:none!important}

/* v3.12.1 STAGING R17 — registered push device diagnostics */
.push-dev-status .push-dev-device-row{width:100%;display:grid;grid-template-columns:1fr auto 12px;align-items:center;gap:10px;padding:10px 12px;border:0;border-radius:10px;background:rgba(255,255,255,.055);color:inherit;text-align:left;font:inherit;cursor:pointer}.push-dev-device-row>span{display:flex;flex-direction:column;gap:2px}.push-dev-device-row small{font-size:9px;color:#8ea5bf;opacity:1}.push-dev-device-row strong{color:#fff}.push-dev-device-row>b{font-size:20px;color:#ff8a2a}.push-dev-device-row:disabled{cursor:default;opacity:.75}.push-devices-dialog{background:transparent;border:0;padding:0;color:#fff;width:min(92vw,430px)}.push-devices-dialog::backdrop{background:rgba(2,8,23,.7);backdrop-filter:blur(4px)}.push-devices-dialog form{position:relative;background:linear-gradient(180deg,#0c2947,#071d35);border:1px solid rgba(255,255,255,.12);border-radius:22px;padding:22px 18px 18px;box-shadow:0 24px 60px rgba(0,0,0,.4)}.push-devices-close{position:absolute;right:14px;top:12px;width:34px;height:34px;border:0;border-radius:50%;background:rgba(255,255,255,.08);color:#fff;font-size:24px;line-height:1}.push-devices-head{display:flex;gap:12px;align-items:center;padding-right:38px;margin-bottom:16px}.push-devices-head>span{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#ff7a1a;font-size:21px}.push-devices-head h2{font-size:20px;margin:0;color:#fff}.push-devices-head p{font-size:11px;color:#91a8c0;margin:3px 0 0}.push-devices-list{display:grid;gap:8px}.push-device-item{display:grid;grid-template-columns:36px 1fr;gap:10px;align-items:center;padding:11px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.07);border-radius:12px}.push-device-provider{font-size:23px;text-align:center}.push-device-item>div{display:grid;grid-template-columns:1fr auto;gap:2px 8px;min-width:0}.push-device-item strong{font-size:12px;color:#fff}.push-device-item code{font-size:10px;color:#ffb15f}.push-device-item small{grid-column:1/-1;font-size:9px;color:#8ea5bf;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.push-devices-note{font-size:9px;line-height:1.4;color:#7892ac;text-align:center;margin:14px 8px 0}.push-devices-empty{text-align:center;color:#8ea5bf}

/* v3.12.1 R17 — App Users diagnostics (scoped; no global scrolling changes). */
.app-users-list{display:grid;gap:10px;margin-top:12px}.app-user-card{width:100%;display:grid;grid-template-columns:34px 1fr auto;gap:10px;align-items:center;text-align:left;padding:13px;border:1px solid rgba(255,255,255,.1);border-radius:14px;background:rgba(255,255,255,.04);color:inherit}.app-user-card span:nth-child(2){display:grid;gap:3px}.app-user-card code,.app-user-details code{font-size:11px;opacity:.72;overflow-wrap:anywhere}.app-user-card small{line-height:1.45;opacity:.78}.app-user-platform{font-size:22px}.app-user-details{display:grid;gap:14px}.app-user-detail-head{display:grid;grid-template-columns:1fr auto;gap:5px;align-items:center}.app-user-detail-head strong{font-size:22px}.app-user-detail-head span{background:#7c3aed;color:#fff;padding:4px 9px;border-radius:999px;font-size:12px}.app-user-detail-head small{grid-column:1/-1}.app-user-details dl{display:grid;grid-template-columns:1fr 1.2fr;margin:0}.app-user-details dt,.app-user-details dd{padding:9px 0;border-bottom:1px solid rgba(255,255,255,.1);margin:0}.app-user-details dd{text-align:right;font-weight:600}


/* v3.12.1 STAGING R17 — App Users contrast only. */
.app-users-pane .push-dev-shell,
.app-users-pane .push-dev-card,
.app-users-pane #appUsersSummary,
.app-users-pane .app-user-card,
.app-users-pane .app-user-card strong,
.app-users-pane .app-user-card code,
.app-users-pane .app-user-card small,
.app-users-pane .app-user-card b{color:#fff;}
#appUserDetailsDialog .app-user-details,
#appUserDetailsDialog .app-user-details strong,
#appUserDetailsDialog .app-user-details code,
#appUserDetailsDialog .app-user-details small,
#appUserDetailsDialog .app-user-details dt,
#appUserDetailsDialog .app-user-details dd{color:#fff;}
/* v3.12.2 unified-experience staging */
.main-menu-btn{width:42px;height:42px;border:0;border-radius:11px;background:rgba(255,255,255,.1);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;padding:0;color:#fff}.main-menu-btn span{display:block;width:21px;height:2.5px;border-radius:2px;background:currentColor}.header-tools{gap:8px}.menu-scrim{position:fixed;inset:0;background:rgba(1,15,31,.55);z-index:1500;backdrop-filter:blur(2px)}.main-drawer{position:fixed;z-index:1501;right:0;top:0;height:100dvh;width:min(88vw,380px);background:#f6f9fc;box-shadow:-12px 0 32px rgba(0,0,0,.25);transform:translateX(105%);transition:transform .24s ease;display:flex;flex-direction:column}.main-drawer.open{transform:translateX(0)}.drawer-head{background:#08243d;color:#fff;padding:max(20px,env(safe-area-inset-top)) 20px 18px;display:flex;justify-content:space-between;align-items:center}.drawer-head strong{font-size:24px}.drawer-head small{display:block;opacity:.8;margin-top:3px}.drawer-head button{border:0;background:none;color:#fff;font-size:34px}.drawer-body{padding:14px;overflow:auto}.drawer-item{width:100%;display:grid;grid-template-columns:36px 1fr 18px;gap:10px;align-items:center;text-align:left;border:0;border-bottom:1px solid #d9e2ea;background:transparent;padding:15px 8px;color:#10263b}.drawer-item>span{font-size:23px}.drawer-item strong,.drawer-item small{display:block}.drawer-item small{color:#61758a;margin-top:2px}.drawer-item b{font-size:24px;color:#7f93a7}.drawer-section{margin-top:14px;border-top:1px solid #cbd8e3;padding-top:12px}.drawer-section label{font-size:11px;font-weight:800;color:#57718a;padding:0 8px}.drawer-logout{margin:4px 8px 10px;border:1px solid #d7e0e8;background:#e9eff5;border-radius:8px;padding:9px;width:calc(100% - 16px);font-weight:700}.drawer-version{margin-top:auto;text-align:center;padding:14px;color:#71869a;font-size:12px}.unified-login-sheet{position:relative;padding:26px 20px 22px;text-align:center;min-width:min(86vw,360px)}.unified-login-sheet h2{margin:5px 0 8px}.unified-login-sheet p{color:#60758a;line-height:1.45}.login-hero{font-size:45px;margin-top:8px}.unified-login-sheet input,.unified-login-sheet select{width:100%;box-sizing:border-box;padding:12px;border:1px solid #cbd8e3;border-radius:9px;font-size:16px}.unified-login-sheet label{display:block;text-align:left;font-weight:700;margin:13px 0 5px}.request-password-btn{width:100%;margin-top:12px;padding:11px;border:1px solid #bdd3e8;border-radius:9px;background:#eaf4ff;color:#174e7c;font-weight:700}.player-login-settings{text-align:left}.player-install-card{margin:16px 0;padding:14px;border-radius:10px;background:#eef5fb}.player-install-card div{margin-top:8px;color:#547087;line-height:1.45}.dev-player-row .dev-player-login-open{flex:0 0 30px;border:0;background:transparent;font-size:25px;color:#6e8498;padding:0}.dev-player-name{min-width:0}

/* v3.12.2 STAGING R1 — unified header controls: bell + burger share the existing header row */
.app-header{
  grid-template-columns:minmax(0,1fr) auto !important;
  align-items:start !important;
}
.header-tools,
body[data-role="player"] .header-tools,
body[data-role="admin"] .app-header .header-tools,
body[data-role="super"] .app-header .header-tools{
  grid-column:2 !important;
  grid-row:1 !important;
  position:static !important;
  width:auto !important;
  max-width:none !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  transform:none !important;
  align-self:start !important;
  justify-self:end !important;
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:6px !important;
  overflow:visible !important;
}
.main-menu-btn{flex:0 0 42px !important;margin:2px 0 !important}
.push-bell-btn{flex:0 0 44px !important;margin:0 !important}


/* v3.12.2 STAGING R3 — unified nav + unmistakable staging chrome */
.staging-header-badge{
  display:inline-flex;align-items:center;align-self:center;
  margin-left:8px;padding:3px 6px;border:1px solid rgba(255,122,26,.72);
  border-radius:6px;color:#ff8a29;background:rgba(255,122,26,.10);
  font-size:9px;font-weight:900;line-height:1;letter-spacing:.55px;
  vertical-align:middle;white-space:nowrap;
}
.splash-staging-badge{
  display:inline-block;margin-left:7px;padding:3px 7px;border-radius:6px;
  background:#ff7a1a;color:#fff;font-size:10px;font-weight:900;
  letter-spacing:.7px;line-height:1;vertical-align:1px;
}
/* Drawer footer must finish above PHooty's fixed bottom nav / iOS safe area. */
.main-drawer{
  height:calc(100dvh - var(--bottom-nav-height, 82px) - env(safe-area-inset-bottom)) !important;
  max-height:calc(100dvh - var(--bottom-nav-height, 82px) - env(safe-area-inset-bottom)) !important;
}
.drawer-body{min-height:0;flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch}
.drawer-version{flex:0 0 auto;margin-top:0 !important;padding:10px 14px 12px !important;border-top:1px solid #d9e2ea;background:#f6f9fc}
/* Old role-specific header version is superseded by the always-visible STAGING badge. */
.admin-header-version{display:none !important}
@media(max-width:390px){
  .staging-header-badge{margin-left:5px;padding:3px 5px;font-size:8px;letter-spacing:.35px}
}

/* =========================================================
   v3.12.2 STAGING R5 — deterministic mobile header geometry
   Keep staging/revision markers out of document flow.
   ========================================================= */
:root{--fixed-header-height:120px}
.app-header{
  height:var(--fixed-header-height) !important;
  min-height:var(--fixed-header-height) !important;
  max-height:var(--fixed-header-height) !important;
  overflow:visible !important;
  align-items:center !important;
  padding-top:env(safe-area-inset-top) !important;
  padding-bottom:0 !important;
}
.app-shell{padding-top:calc(var(--fixed-header-height) + 6px) !important}
.brand-block{position:relative !important;min-width:0 !important;overflow:visible !important}
.brand-title{position:relative !important;margin:0 !important}
.staging-header-badge{
  position:absolute !important;
  right:-2px !important;
  bottom:-14px !important;
  z-index:2 !important;
  margin:0 !important;
  padding:2px 5px !important;
  font-size:8px !important;
  line-height:1 !important;
  pointer-events:none !important;
}
.staging-header-badge::after{content:" · R5"}
.splash-version .splash-staging-badge::after{content:" R5"}
.drawer-version::after{content:" R5"}
@media(max-width:430px){
  :root{--fixed-header-height:120px}
  .app-header{height:var(--fixed-header-height)!important;min-height:var(--fixed-header-height)!important;max-height:var(--fixed-header-height)!important}
  .app-shell{padding-top:calc(var(--fixed-header-height) + 6px)!important}
}

/* =========================================================
   v3.12.2 STAGING R6 — canonical five-tab nav + larger
   Player Table login-settings touch target. Header geometry
   remains locked to the stable R5 implementation.
   ========================================================= */
/* Welcome is a canonical tab for every role. Override the old v3.10.35 role rule. */
body[data-role="admin"] #tab-welcome,
body[data-role="super"] #tab-welcome{display:none !important}
body[data-role="admin"] #tab-welcome.active,
body[data-role="super"] #tab-welcome.active{display:block !important}
body[data-role="admin"] .bottom-nav .tab[data-tab="welcome"],
body[data-role="super"] .bottom-nav .tab[data-tab="welcome"]{display:flex !important}

/* The unified bottom nav is always the same five destinations. */
.bottom-nav.player-nav{grid-template-columns:repeat(5,minmax(0,1fr)) !important}

/* Player Table: explicitly allocate a full 48px login-settings column.
   This shortens the name field and makes the whole right-hand button easy to tap. */
#devSettingsContent .dev-player-editor-head,
#devSettingsContent .dev-player-row{
  grid-template-columns:24px minmax(0,1fr) 43px 29px 43px 27px 48px !important;
  gap:3px !important;
}
#devSettingsContent .dev-player-login-open{
  width:48px !important;min-width:48px !important;max-width:48px !important;
  height:48px !important;min-height:48px !important;
  display:grid !important;place-items:center !important;
  padding:0 !important;margin:0 !important;border:0 !important;
  border-radius:12px !important;background:transparent !important;
  color:#6e8498 !important;font-size:28px !important;line-height:1 !important;
  cursor:pointer !important;touch-action:manipulation !important;
}
#devSettingsContent .dev-player-login-open:active{background:#e9f1f8 !important;transform:scale(.96)}

/* Revision marker only; preserve R5 positioning/geometry. */
.staging-header-badge::after{content:" · R6"}
.splash-version .splash-staging-badge::after{content:" R6"}
.drawer-version::after{content:" R6"}

/* v3.12.2 STAGING R7 — pairing-code controls only; R5 header geometry remains locked. */
.show-pairing-code{display:flex!important;align-items:center;gap:8px;margin:8px 0 2px;font-size:14px;font-weight:700;color:#5d7288}.show-pairing-code input{width:18px;height:18px;margin:0}.staging-header-badge::after{content:" · R7"}.splash-version .splash-staging-badge::after{content:" R7"}.drawer-version::after{content:" R7"}


/* =========================================================
   v3.12.2 STAGING R11 — restore production header sizing.
   R5's hard 120px header lock caused the oversized 3.12.2 header.
   Return to the production behaviour: the fixed header sizes itself from
   its contents and the existing ResizeObserver publishes that measured
   height to --fixed-header-height for the page offset.
   ========================================================= */
.app-header{
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  align-items:start !important;
  padding-bottom:8px !important;
}
.app-shell{padding-top:calc(var(--fixed-header-height) + 6px) !important}
@media(max-width:430px){
  .app-header{height:auto !important;min-height:0 !important;max-height:none !important;padding-bottom:6px !important}
  .app-shell{padding-top:calc(var(--fixed-header-height) + 5px) !important}
}
.staging-header-badge::after{content:" · R11"}
.splash-version .splash-staging-badge::after{content:" R11"}
.drawer-version::after{content:" R11"}

/* R10 remote player disconnect */
#disconnectPlayerInstallation{width:100%;margin-top:12px}

/* =========================================================
   v3.12.2 STAGING R12 — side navigation visual redesign only.
   Behaviour/roles remain R11; logout lives behind the identity/profile entry.
   ========================================================= */
.menu-scrim{background:rgba(0,10,24,.66)!important;backdrop-filter:blur(7px)!important;-webkit-backdrop-filter:blur(7px)!important}
.main-drawer{
  width:min(82vw,410px)!important;
  background:linear-gradient(155deg,#06223b 0%,#041a30 48%,#031426 100%)!important;
  color:#f7fbff!important;border-left:1px solid rgba(0,169,255,.65)!important;
  box-shadow:-18px 0 50px rgba(0,0,0,.48)!important;
}
.drawer-head{background:transparent!important;padding:max(20px,env(safe-area-inset-top)) 22px 10px!important;align-items:flex-start!important}
.drawer-brand{display:flex;align-items:center;gap:13px;min-width:0}
.drawer-brand img{width:46px;height:46px;object-fit:contain;flex:0 0 auto}
.drawer-brand>div{min-width:0;padding-top:1px}
.drawer-brand strong{display:block!important;font-size:23px!important;line-height:1.05;letter-spacing:-.45px;white-space:nowrap;color:#fff}
.drawer-brand strong em{font-style:normal;color:#ff7417}
.drawer-brand span{display:inline-flex;margin-top:7px;border:2px solid #ff7417;border-radius:999px;padding:2px 13px 1px;color:#ff8a3c;font-size:10px;font-weight:900;letter-spacing:.65px;line-height:1.35}
.drawer-head button{width:44px;height:44px;display:grid;place-items:center;padding:0!important;margin:-3px -7px 0 8px!important;color:#d9ebff!important;font-size:42px!important;font-weight:200!important;line-height:1!important}
.drawer-body{padding:7px 16px 16px!important;min-height:0;flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch}
.drawer-identity{width:100%;display:grid;grid-template-columns:54px minmax(0,1fr) 18px;gap:13px;align-items:center;text-align:left;border:0;background:transparent;color:#fff;padding:5px 1px 14px;margin:0 0 4px;cursor:pointer}
.drawer-avatar{width:50px;height:50px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#164e78,#0b3556);border:1px solid rgba(83,183,244,.45);font-size:16px;font-weight:900;color:#d9ecff;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.drawer-avatar.logged-in{background:linear-gradient(145deg,#ff8b31,#ef5c0b);border-color:#ff8a32;color:#fff;font-size:18px}
.drawer-identity strong,.drawer-identity small{display:block}.drawer-identity strong{font-size:17px;line-height:1.2;color:#eaf5ff}.drawer-identity small{font-size:14px;color:#9dbbd8;margin-top:3px}.drawer-identity b{font-size:29px;color:#d8eaff;font-weight:400}
.drawer-item{grid-template-columns:46px minmax(0,1fr) 18px!important;gap:12px!important;min-height:72px;border:1px solid rgba(46,139,199,.64)!important;border-radius:14px!important;background:linear-gradient(100deg,rgba(10,50,80,.72),rgba(7,39,67,.42))!important;padding:11px 12px!important;margin:0 0 8px!important;color:#fff!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important}
.drawer-item:active{transform:scale(.988);background:rgba(13,61,96,.9)!important}
.drawer-icon{width:42px;height:42px;display:grid;place-items:center;color:#ff7417!important;font-size:0!important}
.drawer-icon svg{width:34px;height:34px;display:block}
.drawer-item strong{font-size:17px!important;line-height:1.15;color:#f8fbff!important}.drawer-item small{font-size:13px!important;line-height:1.3;color:#9ebbd7!important;margin-top:4px!important}.drawer-item b{font-size:29px!important;font-weight:400!important;color:#e3f1ff!important}
.drawer-section{margin-top:18px!important;border:0!important;padding-top:0!important}
.drawer-section-title{display:flex;align-items:center;gap:11px;margin:0 1px 10px}.drawer-section-title label{padding:0!important;color:#ff7417!important;font-size:12px!important;font-weight:900!important;letter-spacing:.9px!important;white-space:nowrap}.drawer-section-title span{height:1px;background:linear-gradient(90deg,#ff7417,rgba(255,116,23,.15));flex:1}
.drawer-footer{flex:0 0 auto;margin:0 16px;padding:13px 0 calc(max(18px,env(safe-area-inset-bottom)) + 72px);border-top:1px solid rgba(154,192,224,.38);text-align:center}
.drawer-version{margin:0!important;padding:0!important;border:0!important;background:transparent!important;color:#a8bfd5!important;font-size:12px!important}.drawer-version::after{content:" R12"!important;color:#ff7417;font-weight:900}
.drawer-tagline{margin-top:8px;color:#ff7417;font-size:19px;font-weight:700;font-style:italic;letter-spacing:.2px;transform:rotate(-2deg)}
.staging-header-badge::after{content:" · R12"!important}.splash-version .splash-staging-badge::after{content:" R12"!important}
@media(max-width:390px){.main-drawer{width:86vw!important}.drawer-head{padding-left:17px!important;padding-right:17px!important}.drawer-body{padding-left:13px!important;padding-right:13px!important}.drawer-brand strong{font-size:21px!important}.drawer-item{min-height:68px!important}.drawer-footer{margin-left:13px;margin-right:13px}}


/* =========================================================
   v3.12.2 STAGING R13 — side-nav reliability + full-height drawer.
   ========================================================= */
.main-drawer{
  top:0!important;bottom:0!important;height:100dvh!important;max-height:100dvh!important;
}
.drawer-body{min-height:0!important;flex:1 1 auto!important;overflow-y:auto!important;padding-bottom:18px!important}
.drawer-footer{margin:0 16px!important;padding:13px 0 max(18px,env(safe-area-inset-bottom))!important;flex:0 0 auto!important}
.drawer-avatar{overflow:hidden!important}
.drawer-avatar.has-photo{padding:0!important;background:#0b3556!important}
.drawer-avatar img{width:100%;height:100%;display:block;object-fit:cover;border-radius:50%}
.staging-header-badge::after{content:" · R13"!important}.splash-version .splash-staging-badge::after{content:" R13"!important}.drawer-version::after{content:" R13"!important;color:#ff7417;font-weight:900}


/* =========================================================
   v3.12.2 STAGING R17 — drawer/tab-bar seam + pre-hydrated admin navigation.
   Drawer stops exactly at the top edge of the persistent bottom nav.
   ========================================================= */
.main-drawer{
  top:0!important;
  bottom:calc(var(--nav-h) + env(safe-area-inset-bottom))!important;
  height:auto!important;
  max-height:none!important;
}
.drawer-footer{
  margin:0 16px!important;
  padding:12px 0 14px!important;
  flex:0 0 auto!important;
}
.drawer-tagline{display:none!important}
.staging-header-badge::after{content:" · R18"!important}
.splash-version .splash-staging-badge::after{content:" R18"!important}
.drawer-version::after{content:" R18"!important;color:#ff7417;font-weight:900}
@supports not (height:100dvh){
  .main-drawer{bottom:calc(var(--nav-h) + env(safe-area-inset-bottom))!important}
}

/* =========================================================
   v3.12.2 STAGING R17 — authoritative app-chrome boundaries.
   The fixed header's measured bottom edge is the content start;
   the bottom nav's measured top edge is the drawer end.
   ========================================================= */
:root{
  --app-content-top:120px;
  --bottom-nav-boundary:calc(var(--nav-h) + env(safe-area-inset-bottom));
}
.app-shell{
  padding-top:calc(var(--app-content-top) + 5px) !important;
}
.main-drawer{
  top:0 !important;
  bottom:var(--bottom-nav-boundary) !important;
  height:auto !important;
  max-height:none !important;
}
.staging-header-badge::after{content:" · R18"!important}
.splash-version .splash-staging-badge::after{content:" R18"!important}
.drawer-version::after{content:" R18"!important;color:#ff7417;font-weight:900}

/* =========================================================
   v3.12.2 STAGING R17 — identity/header/nav polish.
   Header outer geometry is intentionally unchanged from R17.
   ========================================================= */
.brand-title{position:relative!important}
.header-welcome{
  position:absolute!important;
  left:calc(var(--brand-bib-size, 44px) + 10px)!important;
  top:calc(50% + 13px)!important;
  display:none;
  color:#ff7417!important;
  font-size:10px!important;
  font-weight:800!important;
  line-height:1!important;
  white-space:nowrap!important;
  pointer-events:none!important;
  max-width:calc(100vw - 205px)!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.header-welcome.visible{display:block!important}
.drawer-brand strong em{
  color:transparent!important;
  background:linear-gradient(135deg,#ff7417 0 49%,#31b9ef 51% 100%)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
}
.login-success-check{width:64px;height:64px;margin:6px auto 16px;border:4px solid #5fd17b;border-radius:50%;display:grid;place-items:center;color:#5fd17b;font-size:40px;font-weight:900;line-height:1}
/* Android/PWA: keep the app chrome dark right through the viewport edge. */
html,body{background-color:#0b1020!important}
.bottom-nav{border-bottom:0!important;box-shadow:0 -1px 0 rgba(255,255,255,.08)!important}
.staging-header-badge::after{content:" · R18"!important}
.splash-version .splash-staging-badge::after{content:" R18"!important}
.drawer-version::after{content:" R18"!important;color:#ff7417;font-weight:900}

/* =========================================================
   v3.12.2 STAGING R18 — header welcome clipping fix.
   Use the existing header space; do not change outer header geometry.
   ========================================================= */
.header-welcome{
  overflow:visible !important;
  text-overflow:clip !important;
  line-height:1.2 !important;
}
.brand-title,
.brand-block{
  overflow:visible !important;
}
.staging-header-badge::after{content:" · R18"!important}
.splash-version .splash-staging-badge::after{content:" R18"!important}
.drawer-version::after{content:" R18"!important;color:#ff7417;font-weight:900}


/* =========================================================
   v3.12.2 STAGING R19 — identity sync + pairing input polish.
   Header outer geometry remains exactly as R17/R18.
   ========================================================= */
.header-welcome{
  font-size:12px!important;
  line-height:1.2!important;
}
.staging-header-badge::after{content:" · R20"!important}
.splash-version .splash-staging-badge::after{content:" R20"!important}
.drawer-version::after{content:" R20"!important;color:#ff7417;font-weight:900}

/* =========================================================
   v3.12.2 STAGING R20 — approved side-nav/player-table polish.
   Long identity names remain single-line and scale down after
   10 characters. Pairing dot overlays the existing login control,
   so Player Table geometry is completely unchanged from R19.
   ========================================================= */
.drawer-identity > div{min-width:0!important;overflow:hidden!important}
.drawer-identity strong{white-space:nowrap!important;overflow:hidden!important;text-overflow:clip!important}
.drawer-identity strong.drawer-name-md{font-size:16px!important}
.drawer-identity strong.drawer-name-sm{font-size:15px!important}
.drawer-identity strong.drawer-name-xs{font-size:14px!important}
#devSettingsContent .dev-player-login-open{position:relative!important}
#devSettingsContent .dev-player-paired-dot{position:absolute;right:2px;top:50%;transform:translateY(-50%);width:6px;height:6px;border-radius:50%;background:#12b76a;box-shadow:0 0 0 1px rgba(18,183,106,.12);pointer-events:none}
#devSettingsContent .dev-player-paired-dot[hidden]{display:none!important}
.staging-header-badge::after{content:" · R20"!important}
.splash-version .splash-staging-badge::after{content:" R20"!important}
.drawer-version::after{content:" R20"!important;color:#ff7417;font-weight:900}


/* =========================================================
   v3.12.2 STAGING R23 — accepted lock, Predictions branding,
   Randomiser drawer icon and Android viewport edge.
   ========================================================= */
html,body{background:#0f1524!important;min-height:100%;}
@supports(height:100dvh){html,body{min-height:100dvh}}
.bottom-nav{background:#0f1524!important;border-bottom:0!important;bottom:0!important}
.drawer-icon .randomiser-swap-icon{width:35px!important;height:35px!important}
.predictions-mark{width:36px;height:36px;display:block;object-fit:contain}
.predictions-mark-full{width:58px;height:58px;display:inline-grid;place-items:center;flex:0 0 auto}
.predictions-mark-full img{width:100%;height:100%;display:block;object-fit:contain}
.predictions-dialog::backdrop{background:rgba(2,10,20,.76);backdrop-filter:blur(7px)}
.predictions-sheet{background:linear-gradient(145deg,#092844,#071d32)!important;border:1px solid rgba(255,116,23,.85)!important;color:#f5f9ff!important;text-align:center!important;box-shadow:0 18px 50px rgba(0,0,0,.45),0 0 24px rgba(255,116,23,.12)!important}
.predictions-sheet .modal-close{color:#bcd0e5!important}.predictions-hero{display:flex;justify-content:center;margin:6px 0 10px}.predictions-hero .predictions-mark-full{width:82px;height:82px}.predictions-sheet h2{color:#fff!important}.predictions-sheet p{color:#bdd0e3!important;line-height:1.45!important}.predictions-sheet .primary{background:linear-gradient(90deg,#ff8b31,#ff7417)!important;color:#08111d!important;font-weight:900!important}
.lineups-kickoff{display:grid!important;grid-template-columns:auto minmax(0,1fr) auto!important;align-items:center!important;gap:14px!important}
.lineups-kickoff-copy{min-width:0;display:flex;flex-direction:column}
.lineups-predictions-shortcut{border:0;border-left:1px solid rgba(150,185,215,.22);background:transparent;color:#f7fbff;display:grid;grid-template-columns:auto auto auto;align-items:center;gap:8px;padding:5px 0 5px 14px;text-align:left;cursor:pointer}
.lineups-predictions-shortcut .predictions-mark-full{width:50px;height:50px}.lineups-predictions-shortcut span{font-weight:800;font-size:12px;line-height:1.2}.lineups-predictions-shortcut b{font-size:25px;font-weight:400;color:#cfe3f5}
#tab-selection .selection-player-card.accepted-locked{background:linear-gradient(135deg,#d8f6df,#c6efd1)!important;border-color:#82d69a!important;color:#143822!important;box-shadow:inset 0 0 0 1px rgba(27,145,67,.12)!important;cursor:default!important}
#tab-selection .selection-player-card.accepted-locked::before{content:"🔒";font-size:12px;margin-right:5px}
#tab-selection .selection-player-card.accepted-unlocked{background:#fff!important;border-color:#e0e7ef!important;color:#152238!important;cursor:grab!important}
#tab-selection .selection-player-card.accepted-unlocked::before{content:""}
#tab-selection .selection-player-card.accepted-locked:active{transform:none!important}
.staging-header-badge::after{content:" · R23"!important}.splash-version .splash-staging-badge::after{content:" R23"!important}.drawer-version::after{content:" R23"!important;color:#ff7417;font-weight:900}
@media(max-width:390px){.lineups-kickoff{gap:8px!important}.lineups-predictions-shortcut{padding-left:8px!important;gap:5px!important}.lineups-predictions-shortcut .predictions-mark-full{width:44px;height:44px}.lineups-predictions-shortcut span{font-size:11px}}


/* v3.12.2 STAGING R23 — browser install gate + compact future features */
.browser-install-gate{min-height:calc(100dvh - 112px);display:grid;place-items:center;padding:22px 14px 110px;background:radial-gradient(circle at 50% 20%,rgba(23,144,216,.14),transparent 38%),linear-gradient(180deg,#071523,#08111d)}
.browser-install-gate.hidden{display:none!important}
.browser-gate-card{width:min(520px,100%);border:1px solid rgba(48,166,229,.55);border-radius:24px;padding:28px 24px;background:linear-gradient(145deg,rgba(8,42,69,.96),rgba(5,24,41,.98));box-shadow:0 18px 50px rgba(0,0,0,.35);color:#f7fbff}
.browser-gate-card h2{font-size:clamp(30px,8vw,44px);line-height:1.05;margin:0 0 12px}.browser-gate-card h2 span{color:#ff7417}.browser-gate-lead{color:#c0d1e2;font-size:18px;line-height:1.45;margin:0 0 24px}.browser-gate-benefits{display:grid;gap:13px;margin:0 0 26px}.browser-gate-benefits div{display:grid;grid-template-columns:30px 1fr;align-items:center;font-size:16px}.browser-gate-install{width:100%;border:0;border-radius:15px;padding:16px 18px;background:linear-gradient(90deg,#ff9238,#ff7417);color:#07111d;font-size:19px;font-weight:900}.browser-gate-install b{float:right}.browser-gate-card>small{display:block;text-align:center;color:#aebfd1;margin-top:10px}
body.browser-install-only .tab-page,body.browser-install-only .bottom-nav,body.browser-install-only #mainMenuBtn,body.browser-install-only #pushBellBtn,body.browser-install-only #installAppBtn{display:none!important}
body.browser-install-only .app-shell{padding-bottom:0!important}body.browser-install-only .app-header{position:relative!important;top:auto!important}body.browser-install-only .header-tools{display:none!important}
.drawer-future-item{min-height:82px!important}.drawer-future-item small{white-space:nowrap!important}.awards-mark{width:36px;height:36px;display:block;object-fit:contain}
#awardsDialog .predictions-mark-full img{object-fit:contain}

/* =========================================================
   v3.12.2 STAGING R24 — mobile-browser install gate + compact
   future-feature cards. PWA/app chrome geometry is unchanged.
   ========================================================= */
/* Browser-only install mode: keep the canonical fixed header at the top and
   make the install gate its own viewport region directly beneath it. This
   avoids mixing the fixed-header content offset with normal-flow header
   positioning, which caused the large blank area on mobile Safari. */
body.browser-install-only .app-shell{
  padding-top:0!important;
  padding-bottom:0!important;
  min-height:100dvh!important;
}
body.browser-install-only .app-header{
  position:fixed!important;
  top:0!important;
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  width:min(920px,100%)!important;
  max-width:920px!important;
  margin:0!important;
}
body.browser-install-only .browser-install-gate{
  position:fixed!important;
  z-index:40!important;
  top:var(--app-content-top)!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  min-height:0!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
  place-items:start center!important;
  padding:22px 14px max(28px,env(safe-area-inset-bottom))!important;
}
body.browser-install-only .browser-gate-card{margin:auto 0!important}

/* Approved compact treatment for the two coming-soon cards. */
.drawer-future-item{
  min-height:62px!important;
  padding:7px 10px!important;
  margin-bottom:7px!important;
  grid-template-columns:40px minmax(0,1fr) 16px!important;
  gap:9px!important;
}
.drawer-future-item .drawer-icon{width:36px!important;height:36px!important}
.drawer-future-item .drawer-icon img{width:32px!important;height:32px!important}
.drawer-future-item strong{font-size:16px!important;line-height:1.08!important}
.drawer-future-item small{font-size:12px!important;line-height:1.15!important;margin-top:2px!important}
.drawer-future-item>b{font-size:25px!important}

.staging-header-badge::after{content:" · R24 v3"!important}
.splash-version .splash-staging-badge::after{content:" R24 v3"!important}
.drawer-version::after{content:" R24 v3"!important;color:#ff7417;font-weight:900}


/* =========================================================
   v3.12.2 STAGING R24 v4 — PHooty-themed player login sheets.
   ========================================================= */
#playerLoginDialog.modal{background:transparent!important;color:#f4f8ff!important;overflow:visible!important}
#playerLoginDialog::backdrop{background:rgba(2,10,20,.78)!important;backdrop-filter:blur(7px)!important;-webkit-backdrop-filter:blur(7px)!important}
#playerLoginDialog .unified-login-sheet{box-sizing:border-box;background:linear-gradient(145deg,#092844,#071d32)!important;border:1px solid rgba(36,160,224,.78)!important;border-radius:24px!important;color:#f5f9ff!important;box-shadow:0 20px 60px rgba(0,0,0,.5),0 0 24px rgba(35,164,229,.08)!important;padding:28px 20px 22px!important}
#playerLoginDialog .modal-close{color:#d8e7f5!important;right:13px!important;top:10px!important}
#playerLoginDialog .login-hero{width:64px;height:64px;margin:5px auto 13px;border:2px solid #ff7417;border-radius:50%;display:grid;place-items:center;color:#ff7417;font-size:0!important;background:rgba(255,116,23,.06)}
#playerLoginDialog .login-hero::after{content:'●';font-size:37px;line-height:1;color:#ff7417;clip-path:polygon(25% 0,75% 0,75% 44%,100% 70%,100% 100%,0 100%,0 70%,25% 44%)}
#playerLoginDialog h2{color:#fff!important;font-size:25px!important;margin:5px 0 8px!important}
#playerLoginDialog h2::first-letter{color:inherit}
#playerLoginDialog p{color:#bdd0e3!important;line-height:1.45!important}
#playerLoginDialog #unifiedPlayerPassword{background:#082039!important;border:1px solid #276a94!important;border-radius:12px!important;color:#f5f9ff!important;min-height:52px!important;padding:13px 15px!important}
#playerLoginDialog #unifiedPlayerPassword::placeholder{color:#7191ae!important}
#playerLoginDialog .show-pairing-code{color:#d6e5f4!important;font-weight:650!important;display:flex!important;align-items:center!important;gap:9px!important;margin:12px 2px 5px!important}
#playerLoginDialog .show-pairing-code input{width:24px!important;height:24px!important;margin:0!important;accent-color:#ff7417!important}
#playerLoginDialog .primary{background:linear-gradient(90deg,#ff9238,#ff7417)!important;border:0!important;border-radius:13px!important;color:#07111d!important;min-height:50px!important;font-weight:900!important;box-shadow:0 8px 22px rgba(255,116,23,.18)!important}
#playerLoginDialog .request-password-btn{background:#0b2b47!important;border:1px solid #2877a6!important;border-radius:12px!important;color:#cfe7fb!important;min-height:46px!important;font-weight:800!important}
#playerLoginDialog #playerLoginLogoutBtn{width:100%!important;min-height:50px!important;margin-top:14px!important;border:0!important;border-radius:13px!important;background:linear-gradient(90deg,#ef4658,#f05262)!important;color:#fff!important;font-weight:900!important}
.staging-header-badge::after{content:" · R24 v4"!important}
.splash-version .splash-staging-badge::after{content:" R24 v4"!important}
.drawer-version::after{content:" R24 v4"!important;color:#ff7417;font-weight:900}


/* =========================================================
   v3.12.2 STAGING R32 — robust login icons + browser/PWA state.
   ========================================================= */
#playerLoginDialog .login-hero{font-size:0!important;clip-path:none!important}
#playerLoginDialog .login-hero::after{content:none!important;display:none!important}
#playerLoginDialog .login-hero svg{width:42px;height:42px;display:block;color:#ff7417}
#playerLoginDialog .login-hero-install svg{width:38px;height:38px}
.staging-header-badge::after{content:" · R32"!important}
.splash-version .splash-staging-badge::after{content:" R32"!important}
.drawer-version::after{content:" R32"!important;color:#ff7417;font-weight:900}

/* =========================================================
   v3.12.2 STAGING R32 — clean iOS close control on player login.
   Keep a generous invisible tap target; render only the X.
   ========================================================= */
#playerLoginDialog .modal-close{
  -webkit-appearance:none!important;
  appearance:none!important;
  box-sizing:border-box!important;
  width:44px!important;
  height:44px!important;
  padding:0!important;
  margin:0!important;
  display:grid!important;
  place-items:center!important;
  border:0!important;
  outline:0!important;
  border-radius:0!important;
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  color:#d8e7f5!important;
  font:inherit!important;
  font-size:32px!important;
  font-weight:300!important;
  line-height:1!important;
  text-decoration:none!important;
  -webkit-tap-highlight-color:transparent!important;
}
#playerLoginDialog .modal-close:hover,
#playerLoginDialog .modal-close:focus,
#playerLoginDialog .modal-close:focus-visible,
#playerLoginDialog .modal-close:active{
  border:0!important;
  outline:0!important;
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
}
.staging-header-badge::after{content:" · R32"!important}
.splash-version .splash-staging-badge::after{content:" R32"!important}
.drawer-version::after{content:" R32"!important;color:#ff7417;font-weight:900}


/* v3.12.2 STAGING R32 — bib duty tracking */
.edit-match-meta-row{display:grid;grid-template-columns:1fr 1.45fr;gap:10px;margin:12px 0;padding:10px 12px;border:1px solid #d8dee7;border-radius:12px;background:#f6f8fb;align-items:stretch}
.edit-match-meta-row .edit-cup-game-row{margin:0!important;padding:2px 10px 2px 0!important;border:0!important;border-radius:0!important;background:transparent!important;border-right:1px solid #d8dee7!important;gap:7px}
.edit-match-meta-row .edit-cup-game-row small{display:none!important}.edit-bibs-row{display:flex;flex-direction:column;justify-content:center;gap:7px;min-width:0}.edit-bibs-row strong{font-size:13px;color:#111827;white-space:nowrap}.edit-bibs-row select{width:100%;min-height:38px;border:1.5px solid #cbd3dd;border-radius:9px;background:#fff;color:#172033;padding:0 30px 0 10px;font:inherit;font-size:13px;font-weight:700}
.history-bib-mark{display:inline-block;margin-left:5px;font-size:15px;line-height:1;vertical-align:-1px}.rankings-title-row{display:flex;align-items:center;gap:10px}.bib-rankings-toggle{appearance:none;-webkit-appearance:none;border:0!important;background:transparent!important;box-shadow:none!important;border-radius:10px!important;width:42px;height:42px;display:inline-grid;place-items:center;padding:0!important;font-size:25px;line-height:1;transition:background .15s ease,box-shadow .15s ease,transform .1s ease}.bib-rankings-toggle:active{transform:scale(.95)}.bib-rankings-toggle.is-active{background:#ff7417!important;box-shadow:0 0 0 1px rgba(255,154,61,.35),0 4px 14px rgba(255,116,23,.24)!important}.rankings-table th:nth-child(n+3),.rankings-table td:nth-child(n+3){text-align:center}
@media(max-width:520px){.edit-match-meta-row{grid-template-columns:.95fr 1.35fr;gap:8px;padding:9px 10px}.edit-bibs-row strong{font-size:12px}.edit-bibs-row select{font-size:12px}.bib-rankings-toggle{width:38px;height:38px;font-size:23px}.rankings-title-row{gap:7px}}


/* v3.12.2 STAGING R32 — refined bib duty layout */
/* Keep the rankings title free to use the full left column. The bib toggle sits
   immediately to the left of the period selector and never changes position. */
.rankings-filter-row{display:flex;align-items:center;justify-content:flex-end;gap:7px}
#tab-rankings .rankings-title-row{display:block!important}
#tab-rankings .rankings-title-row h2{white-space:nowrap!important}
#tab-rankings .bib-rankings-toggle{flex:0 0 auto}

/* Balanced, compact match-meta card: two equal zones with a centred divider. */
.edit-match-meta-row{grid-template-columns:1fr 1fr!important;gap:0!important;padding:10px 12px!important;align-items:stretch!important}
.edit-match-meta-row .edit-cup-game-row{padding:2px 12px 2px 0!important;justify-content:space-between!important;gap:8px!important}
.edit-match-meta-row .edit-cup-game-row>span:first-child{flex:1 1 auto!important;min-width:0!important}
.edit-match-meta-row .edit-cup-game-row strong{font-size:13px!important;line-height:1.2!important}
.edit-match-meta-row .selection-toggle{flex:0 0 auto!important}
.edit-match-meta-row .edit-bibs-row{padding:2px 0 2px 12px!important;gap:6px!important;justify-content:center!important}
.edit-match-meta-row .edit-bibs-row strong{font-size:13px!important;line-height:1.2!important;white-space:nowrap!important}
.edit-match-meta-row .edit-bibs-row select{min-height:36px!important;height:36px!important}
@media(max-width:430px){
  .edit-match-meta-row{grid-template-columns:1fr 1fr!important;padding:9px 10px!important}
  .edit-match-meta-row .edit-cup-game-row{padding-right:9px!important}
  .edit-match-meta-row .edit-bibs-row{padding-left:9px!important}
  .edit-match-meta-row .edit-cup-game-row strong,.edit-match-meta-row .edit-bibs-row strong{font-size:11.5px!important}
  .rankings-filter-row{gap:5px}
  #tab-rankings .bib-rankings-toggle{width:38px!important;height:38px!important;font-size:23px!important}
}

/* v3.12.2 STAGING R32 — Bib Washing table proportions */
#tab-rankings.bib-washing-mode .rankings-table{table-layout:fixed!important}
#tab-rankings.bib-washing-mode .rankings-table th:nth-child(1),#tab-rankings.bib-washing-mode .rankings-table td:nth-child(1){width:7%!important}
#tab-rankings.bib-washing-mode .rankings-table th:nth-child(2),#tab-rankings.bib-washing-mode .rankings-table td:nth-child(2){width:43%!important}
#tab-rankings.bib-washing-mode .rankings-table th:nth-child(3),#tab-rankings.bib-washing-mode .rankings-table td:nth-child(3){width:13%!important}
#tab-rankings.bib-washing-mode .rankings-table th:nth-child(4),#tab-rankings.bib-washing-mode .rankings-table td:nth-child(4){width:18%!important;white-space:nowrap!important}
#tab-rankings.bib-washing-mode .rankings-table th:nth-child(5),#tab-rankings.bib-washing-mode .rankings-table td:nth-child(5){width:19%!important;white-space:nowrap!important}
#tab-rankings.bib-washing-mode .rankings-table th{font-size:11px!important}
@media(max-width:430px){#tab-rankings.bib-washing-mode .rankings-table th{font-size:10px!important;letter-spacing:.02em!important}}

/* v3.12.2 STAGING R32 — Bib Washing columns + Last Took */
#tab-rankings.bib-washing-mode .rankings-table th:nth-child(1),#tab-rankings.bib-washing-mode .rankings-table td:nth-child(1){width:6%!important}
#tab-rankings.bib-washing-mode .rankings-table th:nth-child(2),#tab-rankings.bib-washing-mode .rankings-table td:nth-child(2){width:28%!important;text-align:left!important}
#tab-rankings.bib-washing-mode .rankings-table th:nth-child(3),#tab-rankings.bib-washing-mode .rankings-table td:nth-child(3){width:11%!important}
#tab-rankings.bib-washing-mode .rankings-table th:nth-child(4),#tab-rankings.bib-washing-mode .rankings-table td:nth-child(4){width:13%!important;white-space:nowrap!important}
#tab-rankings.bib-washing-mode .rankings-table th:nth-child(5),#tab-rankings.bib-washing-mode .rankings-table td:nth-child(5){width:27%!important;white-space:nowrap!important}
#tab-rankings.bib-washing-mode .rankings-table th:nth-child(6),#tab-rankings.bib-washing-mode .rankings-table td:nth-child(6){width:15%!important;white-space:nowrap!important}
#tab-rankings.bib-washing-mode .bib-last-took{font-size:12px!important}
#tab-rankings.bib-washing-mode .bib-last-took.is-stale{color:#ff4d55!important;font-weight:800!important}
@media(max-width:430px){#tab-rankings.bib-washing-mode .rankings-table th{font-size:9px!important;letter-spacing:0!important}#tab-rankings.bib-washing-mode .bib-last-took{font-size:10.5px!important}}

/* v3.12.2 STAGING R33 — Bib Washing: give WASHES enough header width */
#tab-rankings.bib-washing-mode .rankings-table th:nth-child(2),
#tab-rankings.bib-washing-mode .rankings-table td:nth-child(2){width:26%!important}
#tab-rankings.bib-washing-mode .rankings-table th:nth-child(4),
#tab-rankings.bib-washing-mode .rankings-table td:nth-child(4){width:15%!important}
.staging-header-badge::after{content:" · R33"!important}
.splash-version .splash-staging-badge::after{content:" R33"!important}
.drawer-version::after{content:" R33"!important;color:#ff7417;font-weight:900}


/* v3.12.2 STAGING R34 — What's New */
.staging-header-badge::after{content:" · R34"!important}.splash-version .splash-staging-badge::after{content:" R34"!important}.drawer-version::after{content:""!important}
.drawer-whats-new{appearance:none;-webkit-appearance:none;border:0;background:transparent;color:#ff7417;font:inherit;font-weight:850;text-decoration:underline;text-underline-offset:3px;padding:3px 1px;cursor:pointer}
.whats-new-dialog{width:min(94vw,520px);max-height:min(90dvh,820px);padding:0;border:0;border-radius:22px;background:transparent;color:#eef7ff;overflow:visible}
.whats-new-dialog::backdrop{background:rgba(1,10,20,.78);backdrop-filter:blur(4px)}
.whats-new-sheet{position:relative;max-height:min(88dvh,800px);overflow:auto;box-sizing:border-box;padding:24px 20px 20px;border:1px solid #24587b;border-radius:22px;background:linear-gradient(160deg,#0c2a43 0%,#071c30 100%);box-shadow:0 18px 60px rgba(0,0,0,.42)}
.whats-new-sheet .modal-close{appearance:none;-webkit-appearance:none;background:rgba(255,255,255,.05);border:1px solid #315f80;box-shadow:none;outline:0;color:#eef7ff;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-size:30px;line-height:1;position:absolute;right:14px;top:14px}
.whats-new-brand{display:flex;align-items:center;gap:10px;padding-right:52px}.whats-new-brand img{width:45px;height:45px;object-fit:contain}.whats-new-brand strong{font-size:24px}.whats-new-brand em{font-style:normal;color:#ff7417}
.whats-new-sheet h2{font-size:31px;line-height:1.08;margin:20px 0 8px;color:#fff}.whats-new-intro{margin:0 0 16px;color:#b7c9d9;line-height:1.45}
.whats-new-list{display:grid;gap:10px}.whats-new-list article{display:grid;grid-template-columns:46px 1fr;gap:11px;align-items:start;padding:12px;border:1px solid #285979;border-radius:13px;background:rgba(8,31,51,.64)}.whats-new-list article>span{font-size:31px;text-align:center}.whats-new-list strong{display:block;font-size:17px;color:#fff;margin-bottom:3px}.whats-new-list p{margin:0;color:#b9ccdc;line-height:1.38;font-size:14px}
.whats-new-release{text-align:center;color:#9fb5c8;border-top:1px solid #285979;margin-top:16px;padding-top:14px;font-size:13px}.whats-new-got-it{width:100%;margin-top:12px}
@media(max-width:390px){.whats-new-sheet{padding:21px 15px 16px}.whats-new-sheet h2{font-size:27px}.whats-new-list article{grid-template-columns:39px 1fr;padding:10px}.whats-new-list article>span{font-size:27px}.drawer-version{font-size:11.5px!important}}


/* v3.12.3 STAGING R1 — Predictions League */
.predictions-league-dialog{padding:0;background:transparent;border:0;width:min(100vw,560px);max-width:100vw;height:100dvh;max-height:100dvh;margin:auto;overflow:hidden}.predictions-league-dialog::backdrop{background:rgba(1,10,24,.82)}
.predictions-league-sheet{position:relative;box-sizing:border-box;height:100%;overflow:auto;padding:calc(env(safe-area-inset-top) + 18px) 16px calc(env(safe-area-inset-bottom) + 24px);background:linear-gradient(180deg,#062a46 0,#021b30 100%);color:#f7fbff}.predictions-close{position:absolute;right:13px;top:calc(env(safe-area-inset-top) + 11px);color:#fff;z-index:3}.predictions-league-head{display:flex;align-items:center;gap:12px;padding-right:45px;margin:0 0 14px}.predictions-league-head img{width:52px;height:52px;object-fit:contain}.predictions-league-head h2{margin:0;font-size:23px}.predictions-league-head p{margin:2px 0 0;color:#8fd1ff;font-size:13px}.predictions-tabs{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #1689cf;border-radius:13px;overflow:hidden;margin-bottom:16px}.predictions-tabs button{appearance:none;border:0;border-right:1px solid #1689cf;background:#042b49;color:#cce9ff;font-weight:800;font-size:12px;padding:13px 5px}.predictions-tabs button:last-child{border-right:0}.predictions-tabs button.active{background:#ff741c;color:#fff}.predictions-card{border:1px solid #167fba;background:rgba(2,40,68,.78);border-radius:14px;margin:0 0 12px;overflow:hidden}.predictions-card-pad{padding:15px}.predictions-fixture{padding:13px 15px}.predictions-fixture strong{display:block;font-size:15px}.predictions-fixture span{display:block;color:#9ed5fa;margin-top:4px;font-size:13px}.prediction-teams{display:grid;grid-template-columns:1fr 1fr;gap:0}.prediction-team{padding:14px 14px 12px}.prediction-team+ .prediction-team{border-left:1px solid #126a9e}.prediction-team h3{margin:0 0 8px;font-size:15px}.prediction-team.orange h3{color:#ff741c}.prediction-team.blue h3{color:#48a9ff}.prediction-team ul{list-style:none;padding:0;margin:0}.prediction-team li{display:flex;align-items:center;gap:7px;padding:5px 0;font-weight:650;font-size:14px}.prediction-team .mvp-shirt{transform:scale(.72);transform-origin:center}.prediction-entry h3{text-align:center;margin:0 0 14px;font-size:21px}.prediction-score-controls{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:9px}.prediction-side label{display:block;text-align:center;font-weight:800;font-size:12px;margin-bottom:7px}.prediction-side.orange label{color:#ff741c}.prediction-side.blue label{color:#48a9ff}.prediction-counter{display:grid;grid-template-columns:42px 1fr 42px;align-items:center;border:1px solid #1689cf;border-radius:11px;overflow:hidden}.prediction-counter button{border:0;background:#0a4c79;color:#fff;font-size:25px;height:46px}.prediction-side.orange .prediction-counter button{background:#f36d1a}.prediction-counter b{text-align:center;font-size:28px}.prediction-dash{font-size:25px;padding-bottom:8px}.prediction-submit{width:100%;margin-top:14px;background:#ff741c!important}.prediction-meta{text-align:center;color:#9ed5fa;font-size:13px;margin:12px 0 0}.prediction-locked{text-align:center;padding:17px}.prediction-locked .score{font-size:42px;font-weight:900;margin:8px}.prediction-locked .score .o{color:#ff741c}.prediction-locked .score .b{color:#48a9ff}.prediction-locked .ok{color:#4be08b;font-weight:800}.prediction-edit{margin-top:10px;border:1px solid #25a7ff;border-radius:18px;background:transparent;color:#8fd1ff;padding:8px 18px}.prediction-empty{min-height:410px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px 25px}.prediction-empty .empty-icon{font-size:52px;opacity:.5}.prediction-empty h3{font-size:20px;margin:15px 0 7px}.prediction-empty p{color:#a7c8df;line-height:1.5;margin:0;max-width:330px}.prediction-rules-link,.prediction-match-link{width:100%;display:flex;align-items:center;gap:10px;border:1px solid #167fba;background:rgba(2,40,68,.78);border-radius:12px;color:#d8efff;padding:12px 14px;text-align:left}.prediction-rules-link b,.prediction-match-link b{margin-left:auto;font-size:22px}.predictions-result-head{text-align:center;padding:14px}.predictions-result-head small{display:block;color:#9ed5fa}.predictions-result-head .final-score{font-size:35px;font-weight:900;margin:10px 0}.predictions-result-head .orange{color:#ff741c}.predictions-result-head .blue{color:#48a9ff}.submitted-title{display:flex;align-items:center;justify-content:space-between;padding:2px 2px 9px}.submitted-title h3{margin:0}.submitted-title span{color:#9ed5fa;font-size:12px}.prediction-row{display:grid;grid-template-columns:minmax(90px,1fr) 48px 46px minmax(82px,auto);align-items:center;gap:6px;padding:10px 12px;border-top:1px solid rgba(42,151,214,.42);font-size:13px}.prediction-row .who{font-weight:750}.prediction-row .pick{text-align:center;font-weight:800}.prediction-row .pts{text-align:center;border-radius:16px;padding:6px 4px;font-weight:900}.prediction-row .cat{font-size:10px;color:#c9e8fb}.prediction-row.exact .pts{background:#1cae6b}.prediction-row.close .pts{background:#168bf0}.prediction-row.winner .pts{background:#d79b2c}.prediction-row.nothing .pts{background:#526b7c}.league-head{display:flex;align-items:center;justify-content:space-between;padding:13px 14px;border-bottom:1px solid #167fba}.league-head h3{margin:0}.league-head select{background:#063354;color:#fff;border:1px solid #1689cf;border-radius:9px;padding:7px 10px}.predictions-table{width:100%;border-collapse:collapse;font-size:12px}.predictions-table th,.predictions-table td{padding:9px 5px;border-bottom:1px solid rgba(42,151,214,.35);text-align:center}.predictions-table th:nth-child(2),.predictions-table td:nth-child(2){text-align:left}.predictions-table td:last-child{font-weight:900}.predictions-table tr.me{background:rgba(23,126,204,.32)}.predictions-rules-dialog{border:0;padding:0;background:transparent;width:min(92vw,500px);max-height:88dvh}.predictions-rules-dialog::backdrop{background:rgba(0,8,18,.78)}.predictions-rules-sheet{position:relative;overflow:auto;max-height:88dvh;background:#052641;color:#fff;border:1px solid #1689cf;border-radius:16px;padding:20px}.predictions-rules-sheet h2{margin:0 0 6px}.predictions-rules-intro{color:#b9d7eb}.rule-card{border:1px solid #477087;border-radius:12px;padding:12px;margin-top:10px}.rule-card strong{display:flex;justify-content:space-between}.rule-card h3{margin:6px 0}.rule-card p{margin:0;color:#d0e3ef;line-height:1.4;font-size:13px}.rule-card.exact{border-color:#28bf79}.rule-card.close{border-color:#168bf0}.rule-card.winner{border-color:#d79b2c}.predictions-error{padding:20px;text-align:center;color:#ffb0a6}
/* 3.12.3 R2 — player credit */
.payment-heading-legacy{display:none!important}.payment-player-heading{display:flex;align-items:center;gap:11px}.payment-player-heading h2{margin:0;font-size:21px}.payment-player-heading p{margin:2px 0 0;color:#697386}.payment-player-avatar{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#dce6f2;color:#0b1b36;font-weight:900;overflow:hidden;border:2px solid #fff;box-shadow:0 1px 5px #0002}.payment-player-avatar img{width:100%;height:100%;object-fit:cover}.payment-credit-card{width:100%;border:1px solid #b9e7cd;background:linear-gradient(100deg,#f1fbf5,#eaf8f0);border-radius:14px;padding:11px 14px;margin:2px 0 12px;display:grid;grid-template-columns:42px 1fr auto;align-items:center;text-align:left;color:#10203b}.payment-credit-card .credit-coins,.credit-balance-hero .credit-coins{color:#07964b;font-size:20px;letter-spacing:-7px}.payment-credit-card small,.payment-credit-card em{display:block;font-style:normal}.payment-credit-card strong{display:block;color:#07863f;font-size:22px;line-height:1.05}.payment-credit-card em{font-size:10px;color:#64748b;margin-top:2px}.payment-credit-card>b{font-size:25px;color:#07863f}.credit-sheet{max-height:min(92dvh,760px);overflow:auto}.credit-balance-hero{display:flex;gap:15px;align-items:center;background:linear-gradient(100deg,#f1fbf5,#e8f8ef);border:1px solid #b9e7cd;border-radius:14px;padding:14px;margin:14px 0 10px;color:#10203b}.credit-balance-hero small,.credit-balance-hero em{display:block;font-style:normal}.credit-balance-hero strong{display:block;color:#07863f;font-size:30px;line-height:1.1}.credit-balance-hero em{font-size:11px;color:#64748b;margin-top:3px}.credit-balance-hero.compact strong{font-size:25px}.credit-adjust-btn{width:100%;margin:0 0 14px}.credit-history-title{margin:12px 0 8px}.credit-history-list{border:1px solid #d9e0ea;border-radius:13px;overflow:hidden;background:#fff}.credit-history-row{display:grid;grid-template-columns:34px 1fr auto;gap:8px;align-items:center;padding:9px 10px;border-bottom:1px solid #e7ebf1;color:#10203b}.credit-history-row:last-child{border:0}.credit-history-icon{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#e8f7ef;color:#07964b;font-weight:900}.credit-history-row.debit .credit-history-icon{background:#ffeded;color:#df2f2f}.credit-history-copy strong,.credit-history-copy small{display:block}.credit-history-copy small{font-size:10px;color:#68758b}.credit-history-value{font-weight:900;color:#07964b}.credit-history-row.debit .credit-history-value{color:#df2f2f}.credit-history-empty{padding:18px;text-align:center;color:#68758b}.credit-mode{display:grid;grid-template-columns:1fr 1fr;background:#eef2f7;border-radius:12px;padding:3px;margin:12px 0}.credit-mode button{border:0;background:transparent;border-radius:10px;padding:11px;font-weight:800;color:#334155}.credit-mode button.active{background:#fff3eb;color:#f36f21;box-shadow:inset 0 0 0 1px #ff7b2c}.credit-presets{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin:7px 0 10px}.credit-presets button{border:1px solid #e2e8f0;background:#f3f6fa;border-radius:10px;padding:10px;color:#17233c}.credit-presets button.active{border-color:#ff7b2c;background:#fff3eb;color:#e75f12}.credit-amount-field{display:flex;align-items:center;gap:8px;border:1px solid #ccd5e2;border-radius:12px;padding:8px 12px;font-size:25px;margin-bottom:12px;color:#17233c}.credit-amount-field input{border:0;outline:0;font-size:25px;width:100%;background:transparent;color:#17233c}.credit-note-field{display:block;font-weight:800;color:#17233c}.credit-note-field span{font-weight:400;color:#78849a}.credit-note-field input{display:block;width:100%;box-sizing:border-box;border:1px solid #ccd5e2;border-radius:10px;padding:12px;margin-top:6px;font-size:14px}.credit-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}.payment-match-row .payment-credit-used{font-size:10px;color:#07863f;font-weight:800}
/* 3.12.3 R2 — Predictions League visual density overhaul */
.predictions-league-sheet{padding-left:12px!important;padding-right:12px!important;background:radial-gradient(circle at 50% 78%,rgba(19,105,158,.15),transparent 35%),linear-gradient(180deg,#062a46,#02192c)!important}.predictions-league-head{margin-bottom:9px!important;gap:9px!important}.predictions-league-head img{width:42px!important;height:42px!important}.predictions-league-head h2{font-size:19px!important;letter-spacing:-.2px}.predictions-league-head p{font-size:11px!important}.predictions-tabs{margin-bottom:11px!important;border-radius:10px!important}.predictions-tabs button{padding:9px 4px!important;font-size:10px!important}.predictions-card{border-radius:11px!important;margin-bottom:8px!important}.predictions-fixture{padding:9px 11px!important}.predictions-fixture strong{font-size:13px!important}.predictions-fixture span{font-size:11px!important;margin-top:2px!important}.prediction-team{padding:10px 11px 9px!important}.prediction-team h3{display:flex;align-items:center;gap:6px;font-size:12px!important;margin-bottom:5px!important}.prediction-team h3 .mvp-shirt{transform:scale(.58)!important;margin:-5px}.prediction-team li{padding:2px 0!important;font-size:11px!important;gap:6px!important}.prediction-avatar{width:23px;height:23px;border-radius:50%;display:inline-grid;place-items:center;overflow:hidden;background:#31546c;color:#dcecff;font-size:9px;font-weight:900;flex:0 0 23px}.prediction-avatar img{width:100%;height:100%;object-fit:cover}.prediction-entry{padding:11px!important}.prediction-entry h3{font-size:15px!important;margin-bottom:8px!important}.prediction-counter{grid-template-columns:35px 1fr 35px!important}.prediction-counter button{height:38px!important;font-size:20px!important}.prediction-counter b{font-size:21px!important}.prediction-submit{margin-top:9px!important;padding:10px!important}.prediction-meta{font-size:10px!important;margin-top:8px!important}.prediction-rules-link,.prediction-match-link{padding:9px 11px!important;font-size:12px!important}.predictions-result-head{padding:9px 11px!important;text-align:left!important}.predictions-result-head small{font-size:10px!important}.predictions-result-head .final-score{display:flex;align-items:center;justify-content:center;gap:8px;font-size:27px!important;margin:6px 0 2px!important}.predictions-result-head .final-score span{font-size:12px!important}.submitted-title{padding:3px 2px 6px!important}.submitted-title h3{font-size:15px!important}.prediction-row{grid-template-columns:minmax(110px,1fr) 42px 40px 74px!important;padding:6px 8px!important;font-size:11px!important}.prediction-row .who{display:flex;align-items:center;gap:6px;min-width:0}.prediction-row .who b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.prediction-row .pts{padding:5px 3px!important}.prediction-row .cat{font-size:8px!important}.prediction-empty{position:relative;min-height:360px!important;overflow:hidden}.prediction-empty:after{content:"";position:absolute;width:150px;height:150px;bottom:45px;left:50%;transform:translateX(-50%);background:url('predictions-icon-orange.png') center/contain no-repeat;opacity:.055;filter:grayscale(1)}.prediction-empty h3,.prediction-empty p,.prediction-empty .empty-icon{position:relative;z-index:1}.prediction-empty h3{font-size:17px!important}.prediction-empty p{font-size:12px!important}.league-head{padding:9px 10px!important}.league-head h3{font-size:15px!important}.league-head select{padding:5px 8px!important;font-size:11px}.predictions-table{font-size:10px!important}.predictions-table th,.predictions-table td{padding:7px 3px!important}
/* v3.12.3 STAGING R3 — cache-safe rebuild */
.staging-header-badge::after{content:" · R3"!important}.splash-version .splash-staging-badge::after{content:" R3"!important}
.payment-heading-legacy{display:block!important}

/* v3.12.3 STAGING R4 — manual credit + balanced Predictions UX */
.staging-header-badge::after{content:" · R5"!important}.splash-version .splash-staging-badge::after{content:" R5"!important}
.payment-heading-legacy{display:none!important}
.credit-history-actions{display:grid;gap:9px}.credit-apply-open{display:grid;grid-template-columns:30px 1fr auto;align-items:center;gap:9px;width:100%;border:1px solid #acd9f3;background:#eaf7ff;border-radius:13px;padding:11px 12px;text-align:left;color:#10203b}.credit-apply-open span strong,.credit-apply-open span small{display:block}.credit-apply-open span small{font-size:10px;color:#60758a;margin-top:2px}.credit-apply-open>b{font-size:22px}.apply-credit-info{display:flex;gap:9px;background:#e8f5ff;border:1px solid #b7def5;border-radius:12px;padding:11px;color:#245271;font-size:12px;line-height:1.35;margin-top:10px}.apply-credit-list{border:1px solid #d9e0ea;border-radius:13px;overflow:hidden;background:#fff}.apply-credit-row{display:grid;grid-template-columns:1fr auto 32px;align-items:center;gap:9px;padding:11px;border-bottom:1px solid #e7ebf1;color:#10203b}.apply-credit-row:last-child{border:0}.apply-credit-row span small{display:block;color:#07863f;font-size:9px;margin-top:2px}.apply-credit-row input{position:absolute;opacity:0;pointer-events:none}.apply-credit-row i{width:25px;height:25px;border-radius:6px;background:#dce4ed;color:transparent;display:grid;place-items:center;font-style:normal;font-weight:900}.apply-credit-row:has(input:checked) i{background:#ff7623;color:#fff}.apply-credit-total{display:flex;justify-content:space-between;padding:12px;margin-top:8px;background:#f3f6fa;border-radius:11px;color:#10203b}.apply-new-balance{margin-top:10px}.payment-match-row.credit-paid .payment-state-label{color:#1688db;font-weight:850}.payment-match-row.credit-partial .payment-state-label{color:#dc3a32;font-weight:850}.payment-credit-info{border:0;background:#61768a;color:#fff;width:28px;height:28px;border-radius:50%;font-weight:900}.payment-toggle-wrap{display:contents}.payment-match-date .payment-credit-used{display:block!important;color:#1688db!important;font-size:9px!important;font-weight:700!important;margin-top:2px}.payment-match-row>strong{min-width:48px;text-align:right}
/* restore target Predictions proportions: dense, not miniaturised */
.predictions-league-sheet{padding-left:16px!important;padding-right:16px!important}.predictions-league-head{gap:11px!important;margin-bottom:13px!important}.predictions-league-head img{width:50px!important;height:50px!important}.predictions-league-head h2{font-size:23px!important}.predictions-league-head p:empty{display:none!important}.predictions-tabs{margin-bottom:14px!important;border-radius:12px!important}.predictions-tabs button{padding:12px 5px!important;font-size:12px!important}.predictions-card{border-radius:13px!important;margin-bottom:11px!important}.predictions-fixture{padding:12px 14px!important}.predictions-fixture strong{font-size:15px!important}.predictions-fixture span{font-size:12px!important}.prediction-team{padding:12px 13px 11px!important}.prediction-team h3{font-size:14px!important;margin-bottom:7px!important}.prediction-team li{padding:3px 0!important;font-size:13px!important;gap:7px!important}.prediction-avatar{width:28px!important;height:28px!important;flex-basis:28px!important;font-size:10px!important}.prediction-entry{padding:14px!important}.prediction-entry h3{font-size:17px!important}.prediction-counter{grid-template-columns:39px 1fr 39px!important}.prediction-counter button{height:42px!important;font-size:22px!important}.prediction-counter b{font-size:24px!important}.prediction-submit{padding:11px!important}.prediction-meta{font-size:11px!important}.prediction-rules-link,.prediction-match-link{padding:11px 13px!important;font-size:13px!important}.predictions-result-head{padding:12px 14px!important}.predictions-result-head small{font-size:11px!important}.predictions-result-head .final-score{font-size:31px!important;margin:8px 0 3px!important}.predictions-result-head .final-score span{font-size:14px!important}.submitted-title h3{font-size:17px!important}.prediction-row{grid-template-columns:minmax(125px,1fr) 46px 44px 86px!important;padding:8px 10px!important;font-size:12px!important}.prediction-row .cat{font-size:9px!important}.league-head{padding:11px 13px!important}.league-head h3{font-size:17px!important;white-space:nowrap}.league-head select{padding:6px 10px!important;font-size:12px!important;min-width:92px}.predictions-table{font-size:11px!important;table-layout:fixed}.predictions-table th,.predictions-table td{padding:9px 3px!important}.predictions-table th:nth-child(1),.predictions-table td:nth-child(1){width:8%}.predictions-table th:nth-child(2),.predictions-table td:nth-child(2){width:34%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.predictions-table th:nth-child(n+3),.predictions-table td:nth-child(n+3){width:auto}

/* v3.12.3 STAGING R5 — partial-credit accounting and coin icon polish */
.credit-coins{width:34px;height:34px;color:#07964b;display:block;overflow:visible;flex:0 0 auto}
.payment-credit-card .credit-coins{width:31px;height:31px}
.payment-match-row.credit-partial .payment-credit-used{display:block!important}

/* v3.12.3 STAGING R6 — cache correction + persistent partial-credit provenance */
.staging-header-badge::after{content:" · R7"!important}
.splash-version .splash-staging-badge::after{content:" R7"!important}

/* v3.12.3 STAGING R7 — compact payment month + settled credit status */
.payment-match-row.credit-paid .payment-state-label{color:#08a34a!important;font-weight:850}
.payment-match-row.credit-paid .payment-credit-info{background:#08a34a!important;color:#fff!important}


/* v3.12.3 STAGING R8 — approved Predictions target + Financials five-date density */
.staging-header-badge::after{content:" · R8"!important}
.splash-version .splash-staging-badge::after{content:" R8"!important}

/* Financials: preserve player/date readability but reclaim just enough from UNPAID. */
.financials-table th:first-child,.financials-table td:first-child{width:29%!important}
.financials-table th:nth-child(2),.financials-table td:nth-child(2){width:51%!important}
.financials-table th:last-child,.financials-table td:last-child{width:20%!important;padding-left:1px!important;padding-right:4px!important}
.financials-table .phee-unpaid-lozenge{min-width:54px!important;padding-left:6px!important;padding-right:6px!important;font-size:10.5px!important}
.financials-table .date-lozenge-list{flex-wrap:nowrap!important;gap:2px!important}
.financials-table .payment-date-lozenge{min-width:0!important;padding-left:5px!important;padding-right:5px!important;font-size:10px!important}

/* Predict fixture: approved mock-up — calendar, larger fixture copy and chevron. */
.prediction-fixture-link{width:100%;display:grid!important;grid-template-columns:24px 1fr 22px;align-items:center;text-align:left;color:#fff;background:rgba(2,40,68,.78);cursor:pointer}
.prediction-fixture-calendar{font-size:18px;color:#d8efff;line-height:1}
.prediction-fixture-copy{min-width:0}.prediction-fixture-copy>span{display:block}
.prediction-fixture-chevron{font-size:28px;color:#bde4ff;text-align:right;line-height:1}
.prediction-team h3{font-size:16px!important;gap:8px!important;margin-bottom:8px!important}
.prediction-team h3 .mvp-shirt{transform:scale(.82)!important;margin:-2px!important}
.prediction-team li{font-size:13.5px!important;padding:3.5px 0!important}
.prediction-avatar-orange{background:#a64b1d!important;color:#fff2e8!important;border:1px solid #ff7a1c}
.prediction-avatar-blue{background:#155b88!important;color:#eaf7ff!important;border:1px solid #48a9ff}

/* Locked score is one clean neutral score object; no orange/blue digits. */
.prediction-locked .score{display:inline-flex;align-items:center;justify-content:center;background:#f3f6fc;color:#17233c;border-radius:999px;padding:8px 18px;font-size:34px!important;line-height:1;margin:10px auto!important}
.prediction-locked .score span{color:#17233c!important}

/* LAST GAME: reproduce target hierarchy and compact tabulated prediction rows. */
.predictions-result-head{padding:11px 13px!important;text-align:left!important}
.prediction-last-date{display:flex;align-items:center;gap:8px;color:#d8efff;font-size:12px;font-weight:700}
.prediction-last-date>b{margin-left:auto;background:#167449;color:#d9ffeb;border-radius:999px;padding:5px 9px;font-size:9px;letter-spacing:.35px}
.predictions-result-head .final-score{display:grid!important;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px!important;margin:10px 0 2px!important}
.predictions-result-head .final-score strong{font-size:31px;color:#fff;white-space:nowrap}
.predictions-result-head .score-team{display:flex;align-items:center;gap:6px;font-size:13px!important;font-weight:850}
.predictions-result-head .score-team.orange{justify-content:flex-start;color:#ff741c}
.predictions-result-head .score-team.blue{justify-content:flex-end;color:#48a9ff}
.predictions-result-head .score-team .mvp-shirt{transform:scale(.72);margin:-4px}
.prediction-results-table{overflow:hidden}
.prediction-row{grid-template-columns:20px minmax(108px,1fr) 45px 42px 80px!important;gap:5px!important;padding:7px 9px!important;font-size:11.5px!important;min-height:38px;box-sizing:border-box}
.prediction-row:first-child{border-top:0}
.prediction-row .rank-medal{font-size:16px;text-align:center;line-height:1}
.prediction-row .who{display:flex;align-items:center;gap:6px;min-width:0}
.prediction-row .who b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prediction-row .prediction-avatar{width:25px!important;height:25px!important;flex-basis:25px!important}
.prediction-row .pick{font-size:12px;font-weight:850;white-space:nowrap}
.prediction-row .pts{font-size:12px;padding:5px 3px!important}
.prediction-row .cat{font-size:8px!important;white-space:nowrap;letter-spacing:.15px}

@media(max-width:390px){
 .financials-table th:first-child,.financials-table td:first-child{width:28.5%!important}
 .financials-table th:nth-child(2),.financials-table td:nth-child(2){width:51.5%!important}
 .financials-table th:last-child,.financials-table td:last-child{width:20%!important}
 .financials-table .payment-date-lozenge{padding-left:4px!important;padding-right:4px!important;font-size:9.7px!important}
 .prediction-row{grid-template-columns:18px minmax(96px,1fr) 41px 39px 72px!important;padding-left:7px!important;padding-right:7px!important}
 .prediction-row .cat{font-size:7.5px!important}
}


/* v3.12.3 STAGING R11 — approved Predictions League UX fidelity */
.staging-header-badge::after{content:" · R11"!important}
.splash-version .splash-staging-badge::after{content:" R11"!important}

/* Locked prediction: integrated navy scoreline, no white pill and no coloured digits. */
.prediction-locked{padding:14px!important;text-align:center}
.prediction-locked>strong{display:block;font-size:13px;letter-spacing:.2px;margin-bottom:9px}
.prediction-locked .score{display:none!important}
.prediction-locked-score{display:flex;align-items:flex-end;justify-content:center;gap:10px;margin:4px auto 8px}
.prediction-locked-side{display:grid;grid-template-rows:auto auto;justify-items:center;min-width:62px}
.prediction-locked-side small{font-size:10px;font-weight:900;line-height:1;margin-bottom:3px}
.prediction-locked-side.orange small{color:#ff741c}
.prediction-locked-side.blue small{color:#48a9ff}
.prediction-locked-side b{font-size:34px;line-height:1;color:#fff!important;font-weight:900}
.prediction-locked-dash{font-size:30px;line-height:1;color:#d8efff;font-weight:800;padding-bottom:1px}
.prediction-locked .ok{margin-top:8px!important}
.prediction-locked .prediction-edit{margin-top:10px!important}

/* Last Game: remove FINAL treatment and restore the approved breathing room. */
.prediction-last-date>b{display:none!important}
.prediction-match-link{margin-bottom:16px!important}
.submitted-title{display:flex!important;align-items:center!important;justify-content:space-between!important;padding:0 3px 8px!important;margin:0!important}
.submitted-title h3{font-size:17px!important;line-height:1.2!important;margin:0!important}
.submitted-title span{font-size:12px!important;color:#9fcbe6!important}
.prediction-results-table{margin-bottom:16px!important;border-radius:10px!important;background:rgba(3,35,59,.58)!important;border:1px solid rgba(35,151,218,.48)!important}
.prediction-row{border-top:1px solid rgba(86,160,201,.28)!important;border-radius:0!important;background:transparent!important}
.prediction-row:first-child{border-top:0!important}
.prediction-row .rank-medal{width:20px}
.prediction-row .pts{border-radius:999px!important;font-weight:900!important;text-align:center}
.prediction-row.exact .pts{background:#19c97a!important;color:#fff!important}
.prediction-row.close .pts{background:#168bf0!important;color:#fff!important}
.prediction-row.winner .pts{background:#f2a51a!important;color:#fff!important}
.prediction-row.nothing .pts{background:#496b82!important;color:#fff!important}

/* Keep the result card visually balanced like the approved UX. */
.predictions-result-head{margin-bottom:11px!important}
.predictions-result-head .final-score{margin-top:11px!important;margin-bottom:4px!important}

/* Fixture card is explicitly a Lineups affordance. */
.prediction-fixture-link{cursor:pointer!important}
.prediction-fixture-chevron{font-weight:700!important}

/* STAGING R11 — compact PHooty-style Predictions League year selector */
.league-head{align-items:center!important;gap:12px!important}
.league-head h3{flex:1 1 auto!important;min-width:0!important}
.league-head select[data-prediction-year]{
  flex:0 0 auto!important;
  width:auto!important;
  min-width:82px!important;
  max-width:96px!important;
  padding:7px 32px 7px 12px!important;
  border:2px solid #ff741c!important;
  border-radius:12px!important;
  background-color:#123550!important;
  color:#fff!important;
  font-size:13px!important;
  font-weight:800!important;
  line-height:1.15!important;
  appearance:none!important;
  -webkit-appearance:none!important;
  background-image:linear-gradient(45deg,transparent 50%,#ff741c 50%),linear-gradient(135deg,#ff741c 50%,transparent 50%)!important;
  background-position:calc(100% - 16px) 50%,calc(100% - 10px) 50%!important;
  background-size:6px 6px,6px 6px!important;
  background-repeat:no-repeat!important;
}
\n\n/* v3.12.3 STAGING R11 — approved polish and robustness */
/* Predictions League: intentional empty-state artwork + clean close control. */
.predictions-close{appearance:none!important;-webkit-appearance:none!important;border:0!important;outline:0!important;background:transparent!important;box-shadow:none!important;border-radius:0!important;padding:0!important;width:38px!important;height:38px!important;display:grid!important;place-items:center!important;color:#d8efff!important;line-height:1!important}
.predictions-close:focus,.predictions-close:active{outline:0!important;border:0!important;background:transparent!important;box-shadow:none!important}
.prediction-empty-teams,.prediction-empty-result{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:14px;margin-bottom:8px;color:#91a9bb}
.prediction-empty-teams .mvp-shirt,.prediction-empty-result .mvp-shirt{transform:scale(1.28);margin:0 5px}
.prediction-empty-teams b{font-size:30px;letter-spacing:2px;color:#8ca5b9}.prediction-empty-result b{font-size:28px;color:#9bb0c1}
.prediction-empty-podium{position:relative;z-index:1;height:62px;display:flex;align-items:flex-end;justify-content:center;margin:0 0 8px}
.prediction-empty-podium span,.prediction-empty-podium strong{display:grid;place-items:center;width:46px;color:#d8efff;font-size:18px;font-weight:900;border-radius:7px 7px 0 0}
.prediction-empty-podium span:first-child{height:38px;background:#486d87}.prediction-empty-podium strong{height:55px;background:#ff741c;font-size:22px}.prediction-empty-podium span:last-child{height:31px;background:#2d6591}
.prediction-empty-podium strong:before{content:'★';position:absolute;top:-19px;color:#ffb21c;font-size:20px}
/* Financials: credit marker only; preserve existing columns and calculations. */
.financial-player-name{display:flex;align-items:center;gap:5px;min-width:0;overflow:hidden}.financial-player-name>span:last-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.financial-credit-icon{position:relative;display:inline-block;width:13px;height:14px;flex:0 0 13px}.financial-credit-icon i{position:absolute;left:1px;width:10px;height:4px;border:1.5px solid #13a653;border-radius:50%;background:#eafff1}.financial-credit-icon i:nth-child(1){bottom:1px}.financial-credit-icon i:nth-child(2){bottom:5px}.financial-credit-icon i:nth-child(3){bottom:9px}
.financials-table .date-lozenge-list{flex-wrap:wrap!important;align-content:center!important}
.financials-table .dates-played{overflow:visible!important}
/* Player photo access inside the existing Player · Login modal. */
.player-settings-photo-row{display:flex;align-items:center;gap:14px;margin:4px 0 15px}.player-settings-photo-preview{width:66px;height:66px;flex:0 0 66px;border:2px solid #ff741c;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:#e9f0f6;color:#657b8f;font-weight:900}.player-settings-photo-preview img{width:100%;height:100%;object-fit:cover}.player-settings-photo-action{margin:0!important;display:inline-flex!important;width:auto!important}.player-settings-photo-action input{position:absolute!important;opacity:0!important;width:1px!important;height:1px!important;pointer-events:none}.player-settings-photo-action span{display:inline-flex;align-items:center;min-height:42px;padding:0 16px;border-radius:10px;background:#ff741c;color:#fff;font-weight:800;cursor:pointer}.player-settings-photo-action span:before{content:'▣';margin-right:8px;font-size:15px}
/* Logout uses the same player photo when one exists. */
#playerLoginDialog .login-hero-photo{overflow:hidden;background:#08243d!important}#playerLoginDialog .login-hero-photo img{width:100%;height:100%;object-fit:cover;display:block}
/* Formation is the only view where landscape is useful. */
.formation-landscape-return{display:none;color:#8799aa;font-size:13px;position:absolute;right:18px;top:17px}
@media (orientation:landscape){.formation-sandbox-dialog .formation-close{display:none!important}.formation-sandbox-dialog .formation-landscape-return{display:block}.formation-sandbox-dialog .formation-title{margin-right:230px}}


/* v3.12.3 STAGING R17 — landscape guard outside Formation Changer. */
html,body{background:#0f1524!important}
.phooty-portrait-guard{position:fixed;inset:0;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:28px;border:0;background:#0f1524;color:#fff;box-sizing:border-box;align-items:center;justify-content:center;text-align:center;overflow:hidden}
.phooty-portrait-guard[open]{display:flex}
.phooty-portrait-guard::backdrop{background:#0f1524}
.phooty-portrait-guard-inner{display:flex;flex-direction:column;align-items:center;justify-content:center;max-width:360px;margin:auto}
.phooty-portrait-guard-bib{width:76px;height:76px;margin-bottom:18px}.phooty-portrait-guard-bib img{width:100%;height:100%;object-fit:contain;display:block}
.phooty-portrait-guard h2{margin:0 0 8px;color:#fff;font-size:28px;line-height:1.1;font-weight:900}.phooty-portrait-guard p{margin:0;color:#9fb1c2;font-size:16px;font-weight:650}.phooty-rotate-phone{margin-top:20px;color:#ff741c;font-size:44px;line-height:1}
body.formation-orientation-enabled .phooty-portrait-guard{display:none!important}
/* R17 staging badges */
.staging-header-badge::after{content:" · R18"!important}.splash-version .splash-staging-badge::after{content:" R18"!important}.drawer-version::after{content:" R18"!important}

/* v3.12.3 STAGING R19 — dedicated staging origin */
.staging-header-badge::after{content:" · R20"!important}
.splash-version .splash-staging-badge::after{content:" R20"!important}
.drawer-version::after{content:" R20"!important;color:#ff7417;font-weight:900}
