@import url("pca-design-system.css?v=20260831-density-cleanup-v2");

:root{
  /* Authoritative production-logo colors */
  --brand-navy:#07172b;
  --brand-navy-rgb:7,23,43;
  --brand-navy-soft:#17304d;
  --brand-navy-deep:#061426;
  --brand-red:#aa1311;
  --brand-red-rgb:170,19,17;
  --brand-red-hover:#92100f;
  --brand-red-active:#770d0c;

  /* Semantic design tokens - dark mode default */
  --color-primary-action:#aa1311;
  --color-primary-action-rgb:170,19,17;
  --color-primary-action-hover:#92100f;
  --color-primary-action-active:#770d0c;
  --color-secondary-action:#17304d;
  --color-secondary-action-hover:#213f61;
  --color-success:#4ade80;
  --color-success-rgb:74,222,128;
  --color-information:#60a5fa;
  --color-information-rgb:96,165,250;
  --color-warning:#f59e0b;
  --color-warning-rgb:245,158,11;
  --color-warning-strong:#b45309;
  --color-destructive:#991b1b;
  --color-destructive-rgb:153,27,27;
  --color-destructive-hover:#7f1d1d;
  --color-text-primary:#f4f6f8;
  --color-text-secondary:#b8c2d8;
  --color-text-muted:#93a0b4;
  --color-page-background:#050b14;
  --color-page-background-alt:#07111f;
  --color-panel-background:rgba(11,25,43,.90);
  --color-panel-background-strong:#0d1d31;
  --color-elevated-surface:#102640;
  --color-input-background:rgba(3,11,22,.78);
  --color-border:rgba(184,194,216,.18);
  --color-border-strong:rgba(184,194,216,.32);
  --color-link:#60a5fa;
  --color-link-hover:#93c5fd;
  --color-focus-ring:#60a5fa;
  --color-navigation-background:#0d1b2d;
  --color-navigation-active:#aa1311;
  --color-table-header:#102640;
  --color-table-row:rgba(255,255,255,.035);
  --color-selected-background:rgba(170,19,17,.16);
  --color-selected-border:#c94a47;
  --color-disabled-background:rgba(148,160,180,.10);
  --color-disabled-text:#7f8a9d;

  /* Backward-compatible aliases used by established components. */
  --bg:var(--color-page-background);
  --bg-2:var(--color-page-background-alt);
  --panel:var(--color-panel-background);
  --panel-2:var(--color-panel-background-strong);
  --border:var(--color-border);
  --text:var(--color-text-primary);
  --muted:var(--color-text-muted);
  --accent:var(--brand-red);
  --accent-rgb:var(--brand-red-rgb);
  --accent-2:var(--brand-navy-soft);
  --accent-2-rgb:23,48,77;
  --gold:var(--color-warning);
  --danger:var(--color-destructive);
  --success:var(--color-success);
  --shadow:0 20px 60px rgba(0,0,0,.38);
}

/* Contextual workflow training */
.guide-me-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 34px;
    padding: 6px 12px;
    border-color: rgba(var(--accent-rgb), .42) !important;
    background: rgba(var(--accent-rgb), .1) !important;
    color: var(--accent) !important;
    font-weight: 850;
    white-space: nowrap;
}

.guide-me-button::before {
    content: "?";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 999px;
    background: var(--accent);
    color: #06111e;
    font-size: 12px;
    font-weight: 950;
}

html[data-theme="light"] .guide-me-button::before {
    color: var(--color-on-primary);
}

.workflow-guide-bar {
    display: flex;
    justify-content: flex-end;
    margin: 0 0 12px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body.poker-modern{
  min-height:100vh;
  font-family:Inter,Segoe UI,Arial,sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at top left, rgba(var(--color-information-rgb),.10), transparent 30%),
    radial-gradient(circle at top right, rgba(139,92,246,.16), transparent 32%),
    linear-gradient(135deg, #060913 0%, #0c1224 52%, #090d17 100%);
}
.poker-shell{max-width:1440px;margin:0 auto;padding:28px 24px 48px}
.poker-topbar{
  display:flex;justify-content:space-between;align-items:center;gap:16px;
  margin-bottom:24px;padding:18px 22px;border:1px solid var(--border);
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  border-radius:24px;backdrop-filter:blur(14px);box-shadow:var(--shadow);
}
.brand-kicker{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);font-weight:700}
.brand-title{font-size:34px;font-weight:800;line-height:1.05;margin-top:6px}
.brand-subtitle{color:var(--muted);margin-top:6px;font-size:14px}
.topbar-actions{display:flex;gap:12px;flex-wrap:wrap}
.topbar-brand-cluster{display:flex;align-items:center;gap:18px;min-width:0}.topbar-page-copy{min-width:0}.site-brand-logo{display:inline-flex;align-items:center;flex:0 0 auto;width:184px;max-width:26vw;overflow:visible;line-height:0;text-decoration:none}.site-brand-logo img{display:block;width:100%;max-width:100%;height:auto;object-fit:contain;transform:none;filter:none}.site-brand-logo-light{display:none!important}html[data-theme="light"] .site-brand-logo-dark{display:none!important}html[data-theme="light"] .site-brand-logo-light{display:block!important}
.poker-pill,.poker-btn,.poker-link-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  border-radius:14px;border:1px solid var(--border);text-decoration:none;
  color:var(--text);font-weight:700
}
.poker-pill{padding:10px 14px;background:rgba(255,255,255,.05);font-size:13px}
.poker-btn,.poker-link-btn{
  padding:12px 18px;background:linear-gradient(180deg, rgba(var(--color-information-rgb),.18), rgba(var(--color-information-rgb),.07));
  box-shadow:0 8px 24px rgba(var(--color-information-rgb),.12);
}
.poker-btn.secondary,.poker-link-btn.secondary{background:rgba(255,255,255,.04);box-shadow:none}
.poker-btn.gold{border-color:rgba(var(--color-warning-rgb),.45);background:var(--color-warning-surface);color:var(--color-text-primary)}

.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.panel{
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.025));
  border:1px solid var(--border);border-radius:24px;padding:22px;box-shadow:var(--shadow)
}
.panel h2,.panel h3{margin:0 0 8px}
.panel .subtle{color:var(--muted)}
.card-list{display:grid;gap:14px}
.card-link{text-decoration: none;color: inherit;display: block;}
.poker-card{cursor: pointer;transition: transform 0.15s ease, box-shadow 0.15s ease;}
.poker-card:hover{transform: translateY(-2px);box-shadow: 0 8px 24px rgba(0,0,0,.35);}
/* kill ALL link states */
.card-link:link,
.card-link:visited,
.card-link:hover,
.card-link:active{text-decoration: none;color: inherit;}
.nav-card{
  display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding:18px 18px;border-radius:20px;text-decoration:none;color:var(--text);
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.08);
}
.nav-card:hover{transform:translateY(-1px)}
.nav-card-title{font-size:18px;font-weight:800}
.nav-card-meta{font-size:13px;color:var(--muted);margin-top:4px}
.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.stat-card{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-height:96px;padding:16px;border-radius:18px;background:var(--panel);
  border:1px solid var(--border);text-align:center
}
.stat-card.stat-card-link{display:flex}
.stat-label{width:100%;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:700;text-align:center}
.stat-value{width:100%;font-size:32px;font-weight:800;margin-top:6px;text-align:center}
.stat-card .stat-foot{width:100%;text-align:center}
.table-shell{overflow:auto}
.table-modern{width:100%;border-collapse:separate;border-spacing:0 10px}
.table-modern tr{background:rgba(255,255,255,.035)}
.table-modern td,.table-modern th{padding:14px 16px}
.table-modern th{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:left}
.table-modern tbody tr td:first-child,.table-modern thead tr th:first-child{border-radius:14px 0 0 14px}
.table-modern tbody tr td:last-child,.table-modern thead tr th:last-child{border-radius:0 14px 14px 0}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 22px}
.form-group-modern label{
  display:block;margin-bottom:8px;font-weight:700;color:#dce7ff;font-size:14px
}
.form-group-modern input[type=text], .form-group-modern textarea{
  width:100%;padding:14px 16px;border-radius:16px;border:1px solid rgba(255,255,255,.10);
  background:rgba(3,8,20,.60);color:var(--text);font-size:15px;outline:none
}
.choice-group{display:flex;gap:18px;flex-wrap:wrap;padding:14px 16px;border-radius:16px;border:1px solid rgba(255,255,255,.10);background:rgba(3,8,20,.60)}
.choice-group label{margin:0;font-weight:600;color:var(--text)}
.form-full{grid-column:1 / -1}
.form-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:18px;flex-wrap:wrap}
.timer-shell{
  min-height:100vh;
  background:
    linear-gradient(180deg, rgba(4,8,18,.66), rgba(4,8,18,.94)),
    url("../timer-background-40.jpg") center/cover no-repeat fixed;
}
.timer-shell .poker-shell{max-width:1600px}
.timer-grid{
  display:grid;grid-template-columns:320px minmax(0,1fr) 320px;gap:18px;align-items:stretch
}
.timer-panel{
  background:linear-gradient(180deg, rgba(8,13,26,.90), rgba(15,23,42,.78));
  border:1px solid rgba(255,255,255,.08);border-radius:28px;padding:22px;box-shadow:var(--shadow)
}
.blind-title{font-size:14px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:800}
.blind-amount-label{font-size:18px;color:var(--gold);font-weight:800;margin-top:20px}
.blind-amount{font-size:66px;font-weight:900;margin-top:4px;line-height:1}
.timer-main{
  display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;
  padding:28px;background:
    radial-gradient(circle at center, rgba(var(--color-information-rgb),.10), transparent 40%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  border-radius:32px;border:1px solid rgba(255,255,255,.08);box-shadow:var(--shadow)
}
.timer-round{font-size:24px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:800}
.timer-count{font-size:clamp(100px, 14vw, 220px);font-weight:900;line-height:.95;margin:16px 0 8px}
.timer-alert{min-height:42px;font-size:30px;font-weight:800;color:var(--success)}
.timer-controls{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:12px}
.timer-button button,.pushable{
  background:transparent;border:none;padding:0;cursor:pointer
}
.front{
  display:inline-flex;align-items:center;justify-content:center;padding:15px 26px;border-radius:18px;
  font-size:1rem;background:linear-gradient(180deg, var(--brand-red-hover), var(--brand-red-active));color:white;
  transform:translateY(-4px);font-weight:800;letter-spacing:.02em;
  box-shadow:0 10px 28px rgba(var(--brand-red-rgb),.3)
}
.pushable.secondary .front{background:linear-gradient(180deg, var(--brand-navy-soft), var(--brand-navy-deep));box-shadow:0 10px 28px rgba(var(--brand-navy-rgb),.28)}
.pushable.gold .front{background:linear-gradient(180deg, var(--color-warning), var(--color-warning-strong));box-shadow:0 10px 28px rgba(var(--color-warning-rgb),.24)}
.pushable:active .front{transform:translateY(-1px)}
.chip-row{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:18px 0 0}
.chip-row img{width:82px;height:82px;object-fit:contain;filter:drop-shadow(0 10px 16px rgba(0,0,0,.35))}
.live-meta-grid{display:grid;grid-template-columns:300px 1fr 300px;gap:18px;margin-top:18px;align-items:start}
.mini-stat-table{width:100%;border-collapse:collapse}
.mini-stat-table td{padding:10px 0;border-bottom:1px solid rgba(255,255,255,.08);font-size:16px}
.mini-stat-table td:first-child{color:var(--muted);font-weight:700}
.counter-line{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:14px 0;border-bottom:1px solid rgba(255,255,255,.08);font-size:17px
}
.counter-line strong{font-size:24px}
.counter-controls{display:flex;align-items:center;gap:10px}
.icon-btn{width:38px;height:38px;object-fit:contain;cursor:pointer;filter:drop-shadow(0 8px 10px rgba(0,0,0,.25))}
.players-table{width:100%;border-collapse:collapse}
.players-table th,.players-table td{padding:12px 8px;border-bottom:1px solid rgba(255,255,255,.08)}
.players-table th{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.players-table td{font-size:16px}
.players-table td.name{font-weight:700}
.players-actions{text-align:right;white-space:nowrap}
.players-actions img{height:28px;vertical-align:middle}
.seat-chip{
  display:inline-flex;min-width:28px;height:28px;padding:0 10px;align-items:center;justify-content:center;
  border-radius:999px;background:rgba(250,204,21,.18);border:1px solid rgba(250,204,21,.25);color:#fde68a;font-weight:800
}
.payout-table td{padding:10px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.action-bar{
  display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:18px
}
.action-link{
  color:var(--muted);text-decoration:none;padding:12px 16px;border-radius:14px;
  border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.03)
}
.action-link a{color:inherit;text-decoration:none}
.small-note{color:var(--muted);font-size:13px}
@media (max-width: 1180px){
  .grid-3,.grid-2,.form-grid,.timer-grid,.live-meta-grid,.stat-grid{grid-template-columns:1fr}
  .timer-count{font-size:120px}
  .topbar-actions{width:100%}
}
@media (max-width: 720px){
  .poker-shell{padding:16px}
  .brand-title{font-size:28px}
  .timer-count{font-size:82px}
  .blind-amount{font-size:52px}
  .chip-row img{width:64px;height:64px}
}
/* Phase 1 shared form controls */
.panel form{display:grid;gap:14px}
.panel label{display:block;font-weight:700;color:#dce7ff;font-size:14px}
.form-input{
  width:100%;margin-top:8px;padding:14px 16px;border-radius:16px;
  border:1px solid rgba(255,255,255,.10);background:rgba(3,8,20,.60);
  color:var(--text);font:inherit;outline:none
}
textarea.form-input{resize:vertical}
.form-input:focus{border-color:rgba(var(--color-information-rgb),.65);box-shadow:0 0 0 3px rgba(var(--color-information-rgb),.10)}
button.poker-link-btn{cursor:pointer;font:inherit}
code{color:#fde68a;overflow-wrap:anywhere}
:where(a){color:var(--color-link)}
:where(a:hover,a:focus-visible){color:var(--color-link-hover)}
/* Phase 2 core data UI */
.notice{margin:0 0 20px;padding:14px 16px;border-radius:16px;border:1px solid var(--border);font-weight:700}
.notice-success{background:rgba(74,222,128,.10);border-color:rgba(74,222,128,.28)}
.notice-error{background:rgba(251,113,133,.10);border-color:rgba(251,113,133,.28)}
.toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:18px}
.toolbar form{display:flex!important;grid-template-columns:none!important;gap:10px!important;align-items:center;flex:1}
.toolbar .form-input{margin-top:0;min-width:220px}
.inline-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.poker-link-btn.danger,.poker-btn.danger{background:rgba(251,113,133,.10);border-color:rgba(251,113,133,.28);box-shadow:none}
.poker-link-btn.small,.poker-btn.small{padding:8px 11px;border-radius:11px;font-size:12px}
.badge{display:inline-flex;padding:5px 9px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid var(--border);font-size:12px;font-weight:800;text-transform:capitalize}
.badge.going{background:rgba(74,222,128,.12);border-color:rgba(74,222,128,.25)}
.badge.maybe{background:rgba(250,204,21,.12);border-color:rgba(250,204,21,.25)}
.badge.not_going{background:rgba(251,113,133,.12);border-color:rgba(251,113,133,.25)}
.help-tip{display:inline-flex;width:19px;height:19px;border-radius:50%;align-items:center;justify-content:center;margin-left:6px;border:1px solid rgba(var(--color-information-rgb),.35);color:var(--accent);font-size:11px;font-weight:900;cursor:help;vertical-align:middle}
.section-title{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.section-title h2{margin:0}
.empty-state{padding:28px;text-align:center;color:var(--muted);border:1px dashed var(--border);border-radius:18px}
.checkbox-row{display:flex!important;gap:12px!important;align-items:center!important;font-weight:600!important}.checkbox-row input{width:auto!important}
.split-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(280px,1fr);gap:22px}
.portal-shell{max-width:980px;margin:0 auto}
.app-footer {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 24px;
    padding: 14px 10px 8px;
    border-top: 1px solid var(--border);
    color: var(--muted);
    font-size: .78rem;
    line-height: 1.45;
    text-align: center;
}
.app-footer-disclaimer { max-width: 920px; margin: 0; }
.app-footer-meta { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 6px; }
.app-footer-links { display: inline-flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 6px; }
.app-footer a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.app-footer a:hover { color: var(--text); }
.app-footer a:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 3px; }
@media(max-width:520px){
    .app-footer { margin-top: 18px; padding: 10px 4px 6px; gap: 2px 6px; }
    .app-footer-meta { width: 100%; gap: 2px 6px; }
    .app-footer-company { flex-basis: 100%; }
    .app-footer-separator { display: none; }
    .app-footer-links { width: 100%; gap: 2px 6px; }
    .app-footer a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 2px; }
}
@media(max-width:900px){.split-layout{grid-template-columns:1fr}.table-modern td,.table-modern th{padding:11px 10px}.toolbar form{width:100%;flex-wrap:wrap}}
/* Phase 3 cash games */
.cash-inline-form{display:grid!important;grid-template-columns:minmax(150px,.8fr) minmax(110px,.5fr) minmax(180px,1fr) auto!important;gap:8px!important;align-items:end!important}
.cash-inline-form .form-input{margin-top:0}
.inline-form{display:inline-flex!important;gap:8px!important;align-items:center!important}
.points-grid{display:grid;grid-template-columns:repeat(5,minmax(100px,1fr));gap:10px}
.positive{color:#86efac;font-weight:800}.negative{color:#fda4af;font-weight:800}
button:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:900px){.cash-inline-form,.points-grid{grid-template-columns:1fr!important}}
@media print{.poker-topbar .topbar-actions,.form-actions,.toolbar form,.poker-link-btn{display:none!important}.poker-modern{background:#fff!important;color:#111!important}.panel,.stat-card{box-shadow:none!important;background:#fff!important;color:#111!important;border-color:#ddd!important}.table-modern tr{background:#fff!important}.table-modern td,.table-modern th,.small-note,.subtle{color:#222!important}}
/* Phase 6 reporting and analytics */
.report-kpis .stat-value{font-size:clamp(26px,3vw,42px)}
.stat-foot{margin-top:7px;color:var(--muted);font-size:12px;font-weight:700}
.trend-chart{display:grid;gap:10px}
.trend-row{display:grid;grid-template-columns:90px 1fr minmax(100px,auto);gap:12px;align-items:center}
.trend-label{color:var(--muted);font-size:12px;font-weight:800}
.trend-track{height:12px;border-radius:999px;background:rgba(255,255,255,.06);overflow:hidden;border:1px solid rgba(255,255,255,.06)}
.trend-fill{height:100%;min-width:2px;border-radius:999px;background:linear-gradient(90deg,rgba(var(--color-information-rgb),.55),rgba(var(--brand-navy-rgb),.75))}
.trend-value{text-align:right;font-weight:800;white-space:nowrap}
.metric-list{display:grid;gap:2px}
.metric-list>div{display:flex;justify-content:space-between;gap:20px;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.metric-list>div:last-child{border-bottom:none}.metric-list span{color:var(--muted);font-weight:700}.metric-list strong{text-align:right}
.player-report-head{display:flex;justify-content:space-between;gap:18px;align-items:center;flex-wrap:wrap}
.report-filter .form-grid{grid-template-columns:repeat(4,minmax(150px,1fr))}
@media(max-width:900px){.report-filter .form-grid,.trend-row{grid-template-columns:1fr}.trend-value{text-align:left}.trend-label{font-size:13px}}

/* Phase 7: production polish, accessibility, responsive behavior, light/dark appearance */
html{color-scheme:dark;scroll-behavior:smooth}
html[data-theme="light"]{color-scheme:light}
html[data-theme="light"]{
  --bg:#f3f6fb;--bg-2:#e8eef8;--panel:rgba(255,255,255,.94);--panel-2:#fff;
  --border:rgba(15,23,42,.13);--text:#07172b;--muted:#59677a;--accent:#aa1311;
  --accent-2:#07172b;--gold:#b45309;--danger:#991b1b;--success:#15803d;
  --shadow:0 18px 48px rgba(15,23,42,.12)
}
html[data-theme="light"] body.poker-modern{
  background:radial-gradient(circle at top left,rgba(var(--brand-red-rgb),.06),transparent 30%),radial-gradient(circle at top right,rgba(var(--brand-navy-rgb),.06),transparent 32%),linear-gradient(135deg,#f4f6f8,#ffffff 58%,#e8edf4)
}
html[data-theme="light"] .poker-topbar,
html[data-theme="light"] .panel,
html[data-theme="light"] .stat-card,
html[data-theme="light"] .nav-card,
html[data-theme="light"] .timer-panel,
html[data-theme="light"] .timer-main{background:rgba(255,255,255,.90);color:var(--text)}
html[data-theme="light"] .form-input{background:#fff;color:var(--text);border-color:rgba(15,23,42,.16)}
html[data-theme="light"] .poker-link-btn.secondary,
html[data-theme="light"] .poker-pill{background:rgba(15,23,42,.04)}
html[data-theme="light"] .table-modern tr{background:rgba(255,255,255,.78)}
html[data-theme="light"] .table-modern th,
html[data-theme="light"] .table-modern td{border-color:rgba(15,23,42,.10)}
html[data-theme="light"] .panel label{color:var(--text)}
html[data-theme="light"] .timer-shell{background:linear-gradient(180deg,rgba(241,245,249,.70),rgba(241,245,249,.90)),url("../timer-background-40.jpg") center/cover no-repeat fixed}

.skip-link{position:fixed;left:14px;top:12px;z-index:9999;transform:translateY(-160%);padding:11px 15px;border-radius:10px;background:var(--text);color:var(--bg);font-weight:800;text-decoration:none}
.skip-link:focus{transform:translateY(0)}
.appearance-toggle{font:inherit;cursor:pointer}
:where(a,button,input,select,textarea,[tabindex]):focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.form-input:focus-visible{outline:none}
.table-shell{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.table-modern{min-width:680px}
.auto-table-shell{width:100%}
.grid-2>*,.grid-3>*,.stat-grid>*,.form-grid>*,.split-layout>*{min-width:0}
.panel,.card-list,.nav-card,.toolbar,.form-actions,.player-report-head{min-width:0;max-width:100%}
.nav-card>div,.player-report-head>div{min-width:0}
.nav-card-title,.nav-card-meta,.brand-title,.brand-subtitle,.small-note{overflow-wrap:anywhere}
.form-input{min-width:0;max-width:100%}
.poker-btn,.poker-link-btn,button,input,select,textarea{min-height:44px}
.poker-pill{min-height:unset}
.help-tip:focus{outline:2px solid var(--accent);outline-offset:2px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

@media(max-width:720px){
  .poker-shell{padding:12px 12px 32px}
  .poker-topbar{padding:16px;border-radius:18px;align-items:flex-start;flex-direction:column}
  .topbar-brand-cluster{align-items:flex-start;width:100%;gap:12px}.site-brand-logo{width:150px;max-width:42vw}.topbar-page-copy{padding-top:2px}
  .topbar-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:8px}
  .topbar-actions .poker-link-btn,.topbar-actions .poker-pill{width:100%;text-align:center}
  .brand-title{font-size:26px}
  .panel{padding:17px;border-radius:18px}
  .grid-2,.grid-3,.stat-grid{gap:12px}
  .toolbar{align-items:stretch}.toolbar form{display:grid!important;grid-template-columns:1fr!important}.toolbar .form-input{min-width:0;width:100%}
  .inline-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}.inline-actions>*{width:100%}
  .form-actions{display:grid;grid-template-columns:1fr}.form-actions>*{width:100%}
  .timer-count{font-size:clamp(64px,22vw,96px)}
  .players-actions{white-space:normal}
}
@media(max-width:420px){.topbar-actions,.inline-actions{grid-template-columns:1fr}.poker-shell{padding-left:9px;padding-right:9px}.topbar-brand-cluster{display:grid}.site-brand-logo{width:138px;max-width:100%}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}

/* Phase 8: Help Center, contextual help, and guided onboarding */
.help-hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr);gap:24px;align-items:center;margin-bottom:20px}
.help-hero h1,.help-topic-main h1{font-size:clamp(28px,4vw,48px);margin:4px 0 8px}.help-search{display:flex;gap:10px;align-items:center}.help-search .form-input{flex:1;margin:0}.help-toolbar{margin-bottom:20px}.help-category-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:24px}.help-category{display:flex;gap:14px;align-items:center;text-decoration:none;color:inherit;transition:transform .15s ease,border-color .15s ease}.help-category:hover{transform:translateY(-2px);border-color:rgba(var(--color-information-rgb),.35)}.help-category h3{margin:0 0 3px}.help-category-icon{width:42px;height:42px;flex:0 0 42px;border-radius:14px;display:grid;place-items:center;background:rgba(var(--color-information-rgb),.10);border:1px solid rgba(var(--color-information-rgb),.25);font-size:22px;font-weight:900;color:var(--accent)}
.help-section{margin-top:28px}.help-article-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.help-article-card{text-decoration:none;color:inherit;display:block;transition:transform .15s ease,border-color .15s ease}.help-article-card:hover{transform:translateY(-2px);border-color:rgba(var(--color-information-rgb),.35)}.help-article-card h3{font-size:19px;margin:7px 0}.help-read-more{color:var(--color-link);font-weight:800;font-size:13px}.help-results-title{margin-top:26px}.help-video-panel{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:28px}.help-video-panel h2{margin:5px 0}
.onboarding-panel{margin-bottom:22px}.onboarding-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.onboarding-item{display:flex!important;gap:10px;align-items:flex-start;padding:13px;border:1px solid var(--border);border-radius:15px;background:rgba(255,255,255,.025);cursor:pointer}.onboarding-item input{margin-top:4px;width:18px;height:18px;min-height:18px}.onboarding-item span{display:grid;gap:5px}.onboarding-item a{font-size:12px;color:var(--color-link);font-weight:800}.onboarding-item.is-complete{opacity:.68}.onboarding-item.is-complete strong{text-decoration:line-through}
.help-topic-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(280px,.72fr);gap:22px;align-items:start}.help-topic-side{display:grid;gap:18px;position:sticky;top:18px}.help-topic-main{padding:clamp(22px,4vw,42px)}.help-lead{font-size:18px;line-height:1.7;color:var(--muted);max-width:900px}.help-steps{counter-reset:helpstep;list-style:none;padding:0;margin:18px 0 30px;display:grid;gap:12px}.help-steps li{counter-increment:helpstep;display:grid;grid-template-columns:42px 1fr;gap:14px;align-items:center;padding:16px;border:1px solid var(--border);border-radius:16px;background:rgba(255,255,255,.025);line-height:1.55}.help-steps li::before{content:counter(helpstep);width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:rgba(var(--color-information-rgb),.12);border:1px solid rgba(var(--color-information-rgb),.30);color:var(--accent);font-weight:900}.help-tip-box{margin:24px 0;padding:18px 20px;border-left:4px solid var(--accent);border-radius:14px;background:rgba(var(--color-information-rgb),.07)}.help-tip-box h3{margin:0 0 8px}.help-tip-box p:last-child{margin-bottom:0}.help-faq-list details{padding:14px 0;border-bottom:1px solid var(--border)}.help-faq-list summary{cursor:pointer;font-weight:800}.help-back{width:100%;margin-bottom:16px}
.context-label-row{display:flex;align-items:center;gap:6px}.context-label-row>label{margin:0!important}.context-label-row>.context-help-button{margin-left:0}
.context-help-button{appearance:none;border:1px solid rgba(var(--color-information-rgb),.35);background:rgba(var(--color-information-rgb),.08);color:var(--accent);width:20px;height:20px;min-height:20px;border-radius:50%;display:inline-grid;place-items:center;padding:0;margin-left:6px;font-size:11px;font-weight:900;vertical-align:middle;cursor:pointer}.context-help-popover{position:fixed;z-index:10020;width:min(390px,calc(100vw - 28px));padding:18px;border-radius:18px;background:var(--panel-2);border:1px solid var(--border);box-shadow:0 24px 70px rgba(0,0,0,.48);color:var(--text)}.context-help-popover h3{margin:0 48px 7px 0;font-size:17px}.context-help-popover p{margin:0 0 12px;color:var(--muted);line-height:1.5}.context-help-popover .context-close{position:absolute;right:4px;top:3px;border:0;background:transparent;color:var(--text);font-size:20px;line-height:1;min-height:44px;width:44px;padding:0;display:grid;place-items:center;cursor:pointer}.context-help-popover a{color:var(--color-link);font-weight:800;text-decoration:none}.context-help-popover .context-help-link-text{text-decoration:underline;text-decoration-thickness:from-font;text-underline-offset:.12em}.context-help-popover .context-help-link-arrow{text-decoration:none}.context-help-popover[hidden]{display:none}
@media(max-width:720px){.context-help-button{position:relative}.context-help-button::after{position:absolute;inset:-12px;content:""}}
.tour-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.60);z-index:10000}.tour-card{position:fixed;z-index:10010;width:min(420px,calc(100vw - 24px));padding:20px;border-radius:20px;background:var(--panel-2);border:1px solid var(--border);box-shadow:0 30px 90px rgba(0,0,0,.55)}.tour-card h3{margin:0 0 7px}.tour-card p{color:var(--muted);line-height:1.5}.tour-actions{display:flex;justify-content:space-between;gap:10px;margin-top:16px}.tour-actions>div{display:flex;gap:8px}.tour-target{position:relative;z-index:10005!important;box-shadow:0 0 0 5px rgba(var(--color-information-rgb),.55),0 0 0 9999px rgba(0,0,0,.48)!important}.tour-progress{font-size:12px;color:var(--muted);font-weight:800}
@media(max-width:1050px){.help-category-grid,.onboarding-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.help-article-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.help-hero,.help-topic-layout{grid-template-columns:1fr}.help-search{display:grid}.help-category-grid,.onboarding-grid,.help-article-grid{grid-template-columns:1fr}.help-topic-side{position:static}.help-video-panel{align-items:flex-start;flex-direction:column}.help-steps li{grid-template-columns:36px 1fr;padding:13px}.tour-card{max-height:calc(100dvh - var(--safe-area-top,0px) - var(--safe-area-bottom,0px) - 20px);overflow-y:auto;overscroll-behavior:contain;padding:16px}.tour-actions{flex-direction:column}.tour-actions>div{display:grid;grid-template-columns:1fr 1fr}.tour-actions .poker-link-btn{width:100%;min-height:44px}}
@media print{.help-category-grid,.help-toolbar,.help-topic-side,.onboarding-panel,.help-video-panel,.context-help-button{display:none!important}.help-topic-layout{display:block}.help-topic-main{border:0!important}}
.help-tour-grid{display:flex;gap:10px;flex-wrap:wrap}.help-tour-grid .poker-link-btn{flex:1 1 180px}
/* ============================================================
   User Appearance Settings
   Defect #17
   ============================================================ */


/* ------------------------------------------------------------
   DARK MODE COLOR SCHEMES
   ------------------------------------------------------------ */

html[data-color-scheme="brand"] {
    --accent: #aa1311;
    --accent-2: #17304d;

    --accent-rgb: 170, 19, 17;
    --accent-2-rgb: 23, 48, 77;
}

html[data-color-scheme="blue"] {
    --accent: #60a5fa;
    --accent-2: #22d3ee;

    --accent-rgb: 96, 165, 250;
    --accent-2-rgb: 34, 211, 238;
}

html[data-color-scheme="purple"] {
    --accent: #c084fc;
    --accent-2: #8b5cf6;

    --accent-rgb: 192, 132, 252;
    --accent-2-rgb: 139, 92, 246;
}

html[data-color-scheme="red"] {
    --accent: #fb7185;
    --accent-2: #f97316;

    --accent-rgb: 251, 113, 133;
    --accent-2-rgb: 249, 115, 22;
}

html[data-color-scheme="gold"] {
    --accent: #facc15;
    --accent-2: #f59e0b;

    --accent-rgb: 250, 204, 21;
    --accent-2-rgb: 245, 158, 11;
}


/* ------------------------------------------------------------
   LIGHT MODE COLOR SCHEMES

   Darker versions are used so text and controls retain proper
   contrast against light backgrounds.
   ------------------------------------------------------------ */

html[data-theme="light"][data-color-scheme="brand"] {
    --accent: #aa1311;
    --accent-2: #07172b;

    --accent-rgb: 170, 19, 17;
    --accent-2-rgb: 7, 23, 43;
}

html[data-theme="light"][data-color-scheme="blue"] {
    --accent: #1d4ed8;
    --accent-2: #0e7490;

    --accent-rgb: 29, 78, 216;
    --accent-2-rgb: 14, 116, 144;
}

html[data-theme="light"][data-color-scheme="purple"] {
    --accent: #7e22ce;
    --accent-2: #6d28d9;

    --accent-rgb: 126, 34, 206;
    --accent-2-rgb: 109, 40, 217;
}

html[data-theme="light"][data-color-scheme="red"] {
    --accent: #be123c;
    --accent-2: #c2410c;

    --accent-rgb: 190, 18, 60;
    --accent-2-rgb: 194, 65, 12;
}

html[data-theme="light"][data-color-scheme="gold"] {
    --accent: #a16207;
    --accent-2: #b45309;

    --accent-rgb: 161, 98, 7;
    --accent-2-rgb: 180, 83, 9;
}

/* Map appearance choices to the semantic tokens used by modern components. */
html[data-color-scheme="brand"] {
    --color-primary-action: #aa1311;
    --color-primary-action-rgb: 170,19,17;
    --color-primary-action-hover: #92100f;
    --color-primary-action-active: #770d0c;
    --color-on-primary: #ffffff;
    --color-focus-ring: #ff7378;
    --color-navigation-active: #aa1311;
    --color-selected-border: #c94a47;
    --color-selected-background: rgba(170,19,17,.16);
}

html[data-color-scheme="blue"] {
    --color-primary-action: #2563eb;
    --color-primary-action-rgb: 37,99,235;
    --color-primary-action-hover: #1d4ed8;
    --color-primary-action-active: #1e40af;
    --color-on-primary: #ffffff;
    --color-focus-ring: #60a5fa;
    --color-navigation-active: #2563eb;
    --color-selected-border: #60a5fa;
    --color-selected-background: rgba(96,165,250,.16);
}

html[data-color-scheme="purple"] {
    --color-primary-action: #7c3aed;
    --color-primary-action-rgb: 124,58,237;
    --color-primary-action-hover: #6d28d9;
    --color-primary-action-active: #5b21b6;
    --color-on-primary: #ffffff;
    --color-focus-ring: #a78bfa;
    --color-navigation-active: #7c3aed;
    --color-selected-border: #a78bfa;
    --color-selected-background: rgba(167,139,250,.16);
}

html[data-color-scheme="red"] {
    --color-primary-action: #e11d48;
    --color-primary-action-rgb: 225,29,72;
    --color-primary-action-hover: #be123c;
    --color-primary-action-active: #9f1239;
    --color-on-primary: #ffffff;
    --color-focus-ring: #fb7185;
    --color-navigation-active: #e11d48;
    --color-selected-border: #fb7185;
    --color-selected-background: rgba(251,113,133,.16);
}

html[data-color-scheme="gold"] {
    --color-primary-action: #f59e0b;
    --color-primary-action-rgb: 245,158,11;
    --color-primary-action-hover: #d97706;
    --color-primary-action-active: #b45309;
    --color-on-primary: #07172b;
    --color-focus-ring: #facc15;
    --color-navigation-active: #f59e0b;
    --color-selected-border: #facc15;
    --color-selected-background: rgba(250,204,21,.17);
}

html[data-theme="light"][data-color-scheme="brand"] {
    --color-primary-action: #aa1311;
    --color-primary-action-rgb: 170,19,17;
    --color-primary-action-hover: #92100f;
    --color-primary-action-active: #770d0c;
    --color-on-primary: #ffffff;
    --color-focus-ring: #aa1311;
    --color-navigation-active: #aa1311;
    --color-selected-border: #aa1311;
    --color-selected-background: rgba(170,19,17,.09);
}

html[data-theme="light"][data-color-scheme="blue"] {
    --color-primary-action: #1d4ed8;
    --color-primary-action-rgb: 29,78,216;
    --color-primary-action-hover: #1e40af;
    --color-primary-action-active: #1e3a8a;
    --color-focus-ring: #2563eb;
    --color-navigation-active: #1d4ed8;
    --color-selected-border: #1d4ed8;
    --color-selected-background: rgba(29,78,216,.10);
}

html[data-theme="light"][data-color-scheme="purple"] {
    --color-primary-action: #7e22ce;
    --color-primary-action-rgb: 126,34,206;
    --color-primary-action-hover: #6b21a8;
    --color-primary-action-active: #581c87;
    --color-focus-ring: #7e22ce;
    --color-navigation-active: #7e22ce;
    --color-selected-border: #7e22ce;
    --color-selected-background: rgba(126,34,206,.10);
}

html[data-theme="light"][data-color-scheme="red"] {
    --color-primary-action: #be123c;
    --color-primary-action-rgb: 190,18,60;
    --color-primary-action-hover: #9f1239;
    --color-primary-action-active: #881337;
    --color-focus-ring: #be123c;
    --color-navigation-active: #be123c;
    --color-selected-border: #be123c;
    --color-selected-background: rgba(190,18,60,.10);
}

html[data-theme="light"][data-color-scheme="gold"] {
    --color-primary-action: #a16207;
    --color-primary-action-rgb: 161,98,7;
    --color-primary-action-hover: #854d0e;
    --color-primary-action-active: #713f12;
    --color-on-primary: #ffffff;
    --color-focus-ring: #a16207;
    --color-navigation-active: #a16207;
    --color-selected-border: #a16207;
    --color-selected-background: rgba(161,98,7,.10);
}

/* Shared subscription control and authenticated AI Assistant launcher */
.poker-topbar .subscription-plan-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    cursor: pointer;
    transition: transform .18s ease, border-color .18s ease,
        box-shadow .18s ease, filter .18s ease;
}

.poker-topbar .subscription-plan-pill:hover,
.poker-topbar .subscription-plan-pill:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(var(--brand-red-rgb), .62);
    box-shadow: 0 7px 18px rgba(0, 0, 0, .18);
}

.poker-topbar .subscription-plan-pill:active {
    transform: translateY(0);
}

.poker-topbar .subscription-plan-pill.trial-cta {
    color: #fff !important;
    font-weight: 900;
    letter-spacing: .01em;
    border: 1px solid rgba(255, 255, 255, .52);
    background: linear-gradient(
        115deg,
        var(--brand-red-hover) 0%,
        var(--brand-red) 52%,
        var(--brand-red-active) 100%
    );
    background-size: 220% 220%;
    box-shadow:
        0 7px 20px rgba(var(--brand-red-rgb), .34),
        0 0 0 1px rgba(255, 255, 255, .10) inset;
    animation: trial-pill-shift 5s ease-in-out infinite;
}

.poker-topbar .subscription-plan-pill.trial-cta:hover,
.poker-topbar .subscription-plan-pill.trial-cta:focus-visible {
    filter: brightness(1.10) saturate(1.12);
    border-color: rgba(255, 255, 255, .78);
    box-shadow:
        0 10px 28px rgba(var(--brand-red-rgb), .42),
        0 0 22px rgba(var(--brand-red-rgb), .20);
}

@keyframes trial-pill-shift {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
}

html[data-theme="light"] .poker-topbar .subscription-plan-pill:not(.trial-cta) {
    background: rgba(255, 255, 255, .82);
    border-color: rgba(15, 23, 42, .18);
    box-shadow: 0 2px 6px rgba(15, 23, 42, .06);
}

.ai-assistant-launcher {
    position: fixed;
    right: max(20px, env(safe-area-inset-right));
    bottom: max(20px, env(safe-area-inset-bottom));
    z-index: 9000;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-width: 118px;
    min-height: 52px;
    padding: 12px 17px;
    border: 1px solid rgba(255, 255, 255, .32);
    border-radius: 999px;
    color: #07101e;
    background: linear-gradient(135deg, var(--accent), var(--accent-2));
    box-shadow: 0 16px 42px rgba(0, 0, 0, .38);
    font-weight: 900;
    text-decoration: none;
    transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}

.ai-assistant-launcher:hover {
    color: #07101e;
    transform: translateY(-2px);
    filter: brightness(1.06);
    box-shadow: 0 20px 48px rgba(0, 0, 0, .46);
}

.ai-assistant-launcher:active {
    transform: translateY(0);
}

.ai-assistant-launcher-icon {
    font-size: 21px;
    line-height: 1;
}

body.has-ai-assistant-launcher .poker-shell {
    padding-bottom: 112px;
}

html[data-theme="light"] .ai-assistant-launcher,
html[data-theme="light"] .ai-assistant-launcher:hover {
    color: #fff;
}

.live-game-shortcuts {
    position: fixed;
    right: max(20px, env(safe-area-inset-right));
    bottom: max(84px, calc(env(safe-area-inset-bottom) + 64px));
    z-index: 8990;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
    max-width: min(440px, calc(100vw - 40px));
}

.live-game-shortcut {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 42px;
    max-width: 100%;
    padding: 9px 14px;
    overflow: hidden;
    border: 1px solid rgba(var(--brand-red-rgb), .72);
    border-radius: 999px;
    color: var(--color-text-primary);
    background: var(--color-panel-background-strong);
    box-shadow: 0 12px 32px rgba(0, 0, 0, .36);
    font-size: 13px;
    font-weight: 850;
    line-height: 1.2;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
}

.live-game-shortcut:hover {
    color: var(--color-text-primary);
    border-color: var(--brand-red);
    background: var(--color-elevated-surface);
    box-shadow: 0 16px 38px rgba(0, 0, 0, .44);
    transform: translateY(-1px);
}

.live-game-shortcut:active {
    transform: translateY(0);
}

.live-game-shortcut:focus-visible {
    outline: 3px solid var(--color-focus-ring);
    outline-offset: 3px;
}

.live-game-shortcut-dot {
    width: 9px;
    height: 9px;
    flex: 0 0 9px;
    border-radius: 50%;
    background: var(--brand-red);
    box-shadow: 0 0 0 4px rgba(var(--brand-red-rgb), .18);
}

.live-game-shortcut-mobile-label { display: none; }

body:has(.live-game-shortcuts) .poker-shell {
    padding-bottom: 168px;
}

html[data-theme="light"] .live-game-shortcut {
    color: var(--brand-navy);
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 12px 30px rgba(var(--brand-navy-rgb), .18);
}

html[data-theme="light"] .live-game-shortcut:hover {
    color: var(--brand-navy);
    background: #fff;
}

@media (max-width: 620px) {
    .ai-assistant-launcher {
        right: max(14px, env(safe-area-inset-right));
        bottom: max(14px, env(safe-area-inset-bottom));
        width: 54px;
        min-width: 54px;
        height: 54px;
        min-height: 54px;
        padding: 0;
    }

    .ai-assistant-launcher-label {
        display: none;
    }

    body.has-ai-assistant-launcher .poker-shell {
        padding-bottom: 94px;
    }

    .live-game-shortcuts {
        right: max(14px, env(safe-area-inset-right));
        bottom: max(80px, calc(env(safe-area-inset-bottom) + 66px));
        max-width: calc(100vw - 28px);
        max-height: calc(100vh - 104px);
        overflow-y: auto;
        scrollbar-width: thin;
    }

    .live-game-shortcut {
        min-height: 40px;
        padding: 8px 12px;
        font-size: 12px;
    }

    body:has(.live-game-shortcuts) .poker-shell {
        padding-bottom: 152px;
    }
}

@media print {
    .ai-assistant-launcher,
    .live-game-shortcuts {
        display: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .poker-topbar .subscription-plan-pill.trial-cta {
        animation: none;
    }
}


/* ------------------------------------------------------------
   Sitewide Accent Application
   ------------------------------------------------------------ */

body.poker-modern {
    background:
        radial-gradient(
            circle at top left,
            rgba(var(--accent-rgb), .10),
            transparent 30%
        ),
        radial-gradient(
            circle at top right,
            rgba(var(--accent-2-rgb), .16),
            transparent 32%
        ),
        linear-gradient(
            135deg,
            #060913 0%,
            #0c1224 52%,
            #090d17 100%
        );
}


html[data-theme="light"] body.poker-modern {
    background:
        radial-gradient(
            circle at top left,
            rgba(var(--accent-rgb), .10),
            transparent 30%
        ),
        radial-gradient(
            circle at top right,
            rgba(var(--accent-2-rgb), .08),
            transparent 32%
        ),
        linear-gradient(
            135deg,
            #f7fafc,
            #edf3fa 58%,
            #f8fafc
        );
}


/* Primary buttons */

.poker-btn,
.poker-link-btn {
    background:
        linear-gradient(
            180deg,
            rgba(var(--accent-rgb), .18),
            rgba(var(--accent-rgb), .07)
        );

    box-shadow:
        0 8px 24px
        rgba(var(--accent-rgb), .12);
}


/* Form focus */

.form-input:focus {
    border-color:
        rgba(var(--accent-rgb), .65);

    box-shadow:
        0 0 0 3px
        rgba(var(--accent-rgb), .10);
}


/* Navigation card hover */

a.nav-card:hover,
a.nav-card:focus-visible {
    border-color:
        rgba(var(--accent-rgb), .45)
        !important;

    background:
        rgba(var(--accent-rgb), .07)
        !important;
}


/* Control Panel topbar buttons */

.poker-topbar
.topbar-actions
a.poker-link-btn:hover,

.poker-topbar
.topbar-actions
a.poker-link-btn:focus-visible,

.poker-topbar
.topbar-actions
button:hover,

.poker-topbar
.topbar-actions
button:focus-visible {

    background:
        rgba(var(--accent-rgb), .12)
        !important;

    border-color:
        rgba(var(--accent-rgb), .55)
        !important;
}


/* Light Mode clickable areas */

html[data-theme="light"]
a.nav-card:hover,

html[data-theme="light"]
a.nav-card:focus-visible {

    background:
        rgba(var(--accent-rgb), .08)
        !important;

    border-color:
        rgba(var(--accent-rgb), .50)
        !important;
}


html[data-theme="light"]
.poker-topbar
.topbar-actions
a.poker-link-btn:hover,

html[data-theme="light"]
.poker-topbar
.topbar-actions
a.poker-link-btn:focus-visible,

html[data-theme="light"]
.poker-topbar
.topbar-actions
button:hover,

html[data-theme="light"]
.poker-topbar
.topbar-actions
button:focus-visible {

    background:
        rgba(var(--accent-rgb), .08)
        !important;

    border-color:
        rgba(var(--accent-rgb), .55)
        !important;
}


/* Help UI */

.help-tip,
.context-help-button {

    border-color:
        rgba(var(--accent-rgb), .35);

    background:
        rgba(var(--accent-rgb), .08);
}


.help-category:hover,
.help-article-card:hover {

    border-color:
        rgba(var(--accent-rgb), .35);
}


.help-category-icon {

    background:
        rgba(var(--accent-rgb), .10);

    border-color:
        rgba(var(--accent-rgb), .25);
}


.help-steps li::before {

    background:
        rgba(var(--accent-rgb), .12);

    border-color:
        rgba(var(--accent-rgb), .30);
}


.help-tip-box {

    background:
        rgba(var(--accent-rgb), .07);
}


.tour-target {

    box-shadow:
        0 0 0 5px
            rgba(var(--accent-rgb), .55),
        0 0 0 9999px
            rgba(0, 0, 0, .48)
        !important;
}


/* Analytics */

.trend-fill {

    background:
        linear-gradient(
            90deg,
            rgba(var(--accent-rgb), .55),
            rgba(var(--accent-2-rgb), .75)
        );
}


/* Tournament center glow */

.timer-main {

    background:
        radial-gradient(
            circle at center,
            rgba(var(--accent-rgb), .10),
            transparent 40%
        ),
        linear-gradient(
            180deg,
            rgba(255,255,255,.05),
            rgba(255,255,255,.02)
        );
}


/* ============================================================
   Account Settings Appearance Panel
   ============================================================ */

.appearance-settings {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.appearance-setting-group h3 {
    margin:
        0 0 8px;
}

.appearance-setting-group .subtle {
    margin:
        0 0 12px;
}

.appearance-setting-divider {
    height: 1px;

    background:
        var(--border);
}


/* Light / Dark buttons */

.appearance-choice-row {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.appearance-choice {

    appearance: none;

    min-height: 44px;

    padding:
        10px 16px;

    border-radius:
        14px;

    border:
        1px solid
        var(--border);

    background:
        rgba(255,255,255,.04);

    color:
        var(--text);

    font:
        inherit;

    font-weight:
        700;

    cursor:
        pointer;

    transition:
        transform .16s ease,
        border-color .16s ease,
        background .16s ease,
        box-shadow .16s ease;
}

.appearance-choice:hover {
    transform:
        translateY(-1px);

    border-color:
        rgba(var(--accent-rgb), .45);
}

.appearance-choice.is-selected {

    background:
        rgba(var(--accent-rgb), .12);

    border-color:
        var(--accent);

    box-shadow:
        0 0 0 2px
        rgba(var(--accent-rgb), .15);
}


/* Color scheme choices */

.color-scheme-grid {

    display: grid;

    grid-template-columns:
        repeat(
            auto-fit,
            minmax(96px, 1fr)
        );

    gap: 10px;
}


.color-scheme-choice {

    appearance: none;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    gap: 8px;

    min-height: 78px;

    padding:
        10px;

    border-radius:
        14px;

    border:
        1px solid
        var(--border);

    background:
        rgba(255,255,255,.035);

    color:
        var(--text);

    font:
        inherit;

    font-size:
        13px;

    font-weight:
        700;

    cursor:
        pointer;

    transition:
        transform .16s ease,
        border-color .16s ease,
        background .16s ease,
        box-shadow .16s ease;
}


.color-scheme-choice:hover {

    transform:
        translateY(-2px);

    border-color:
        rgba(var(--accent-rgb), .45);
}


.color-scheme-choice.is-selected {

    border-color:
        var(--accent);

    background:
        rgba(var(--accent-rgb), .10);

    box-shadow:
        0 0 0 2px
        rgba(var(--accent-rgb), .14);
}


.scheme-swatch {

    width: 30px;
    height: 30px;

    border-radius:
        50%;

    background:
        linear-gradient(
            135deg,
            var(--swatch-a),
            var(--swatch-b)
        );

    border:
        2px solid
        rgba(255,255,255,.30);

    box-shadow:
        0 4px 10px
        rgba(0,0,0,.20);
}

.color-scheme-picker-wrap {
    position: relative;
}

.custom-accent-popover[hidden] {
    display: none !important;
}

.custom-accent-popover {
    margin-top: 12px;
    padding: 16px;
    border: 1px solid var(--color-selected-border);
    border-radius: 16px;
    background: var(--color-elevated-surface);
    box-shadow: 0 18px 44px rgba(0,0,0,.28);
}

.custom-accent-popover-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 14px;
}

.custom-accent-popover-head > div {
    display: grid;
    gap: 3px;
}

.custom-accent-popover-head span {
    color: var(--color-text-muted);
    font-size: 13px;
}

.custom-accent-close {
    appearance: none;
    display: inline-grid;
    place-items: center;
    flex: 0 0 34px;
    width: 34px;
    min-height: 34px;
    padding: 0;
    border: 1px solid var(--color-border-strong);
    border-radius: 10px;
    color: var(--color-text-primary);
    background: var(--color-secondary-action);
    font: inherit;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
}

.custom-accent-close:hover,
.custom-accent-close:focus-visible {
    border-color: var(--color-selected-border);
    background: var(--color-secondary-action-hover);
}

.custom-accent-groups {
    display: grid;
    gap: 16px;
}

.custom-accent-group {
    display: grid;
    gap: 8px;
}

.custom-accent-group-title {
    color: var(--color-text-secondary);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.custom-accent-palette {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(34px, 1fr));
    gap: 9px;
}

.custom-accent-swatch {
    appearance: none;
    width: 100%;
    min-width: 34px;
    min-height: 38px;
    padding: 0;
    border: 2px solid rgba(255,255,255,.28);
    border-radius: 11px;
    background: var(--palette-color);
    box-shadow: 0 5px 13px rgba(0,0,0,.22);
    cursor: pointer;
    transition: transform .14s ease, border-color .14s ease, box-shadow .14s ease;
}

.custom-accent-swatch:hover,
.custom-accent-swatch:focus-visible {
    transform: translateY(-2px);
    border-color: var(--color-text-primary);
    box-shadow: 0 8px 18px rgba(0,0,0,.30);
}

.custom-accent-swatch.is-selected,
.custom-accent-swatch[aria-pressed="true"] {
    border-color: #ffffff;
    box-shadow: 0 0 0 3px var(--color-selected-border), 0 8px 18px rgba(0,0,0,.30);
}

html[data-theme="light"] .custom-accent-swatch {
    border-color: rgba(7,23,43,.20);
}

html[data-theme="light"] .custom-accent-swatch.is-selected,
html[data-theme="light"] .custom-accent-swatch[aria-pressed="true"] {
    border-color: #ffffff;
}

.color-scheme-live-preview {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
    padding: 12px;
    border: 1px solid var(--color-border);
    border-radius: 14px;
    background: var(--color-panel-background);
}

.color-scheme-preview-label {
    margin-right: auto;
    color: var(--color-text-muted);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.color-scheme-preview-primary,
.color-scheme-preview-selected,
.color-scheme-preview-focus {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 7px 11px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
}

.color-scheme-preview-primary {
    color: var(--color-on-primary);
    border: 1px solid var(--color-primary-action);
    background: var(--color-primary-action);
}

.color-scheme-preview-selected {
    color: var(--color-text-primary);
    border: 1px solid var(--color-selected-border);
    background: var(--color-selected-background);
}

.color-scheme-preview-focus {
    color: var(--color-text-primary);
    border: 1px solid var(--color-border-strong);
    background: var(--color-input-background);
    box-shadow: 0 0 0 3px rgba(var(--color-primary-action-rgb), .22);
}


html[data-theme="light"]
.appearance-choice,

html[data-theme="light"]
.color-scheme-choice {

    background:
        rgba(255,255,255,.80);
}


/* Responsive */

@media (max-width: 720px) {

    .color-scheme-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

    .appearance-choice {
        flex:
            1 1 140px;
    }

    .custom-accent-palette {
        grid-template-columns: repeat(6, minmax(34px, 1fr));
    }
}

/* Stable label row used by dense setup forms after contextual help is injected. */
.context-field-label {
    display: block !important;
    min-width: 0;
    white-space: normal !important;
}

.context-field-label-row {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    line-height: 20px;
}

.context-field-label-text {
    min-width: 0;
    overflow-wrap: anywhere;
}

.context-field-label-row > :is(.context-help-button, .help-tip) {
    flex: 0 0 20px;
    margin: 0 !important;
}

/* ============================================================
   Poker Club Admin production brand system
   Authoritative colors are sourced from the finalized logo SVGs.
   ============================================================ */

html { color-scheme: dark; }

:root {
    --color-brand-accent-text: #ff7378;
    --color-on-primary: #ffffff;
    --color-on-destructive: #ffffff;
    --color-success-surface: rgba(var(--color-success-rgb), .11);
    --color-information-surface: rgba(var(--color-information-rgb), .10);
    --color-warning-surface: rgba(var(--color-warning-rgb), .11);
    --color-destructive-surface: rgba(var(--color-destructive-rgb), .18);
}

html[data-theme="light"] {
    color-scheme: light;
    --color-primary-action: #aa1311;
    --color-primary-action-rgb: 170,19,17;
    --color-primary-action-hover: #92100f;
    --color-primary-action-active: #770d0c;
    --color-secondary-action: #e8edf4;
    --color-secondary-action-hover: #dce3ec;
    --color-success: #15803d;
    --color-success-rgb: 21,128,61;
    --color-information: #1d4ed8;
    --color-information-rgb: 29,78,216;
    --color-warning: #b45309;
    --color-warning-rgb: 180,83,9;
    --color-warning-strong: #92400e;
    --color-destructive: #991b1b;
    --color-destructive-rgb: 153,27,27;
    --color-destructive-hover: #7f1d1d;
    --color-text-primary: #07172b;
    --color-text-secondary: #3f4c5f;
    --color-text-muted: #59677a;
    --color-page-background: #f4f6f8;
    --color-page-background-alt: #e8edf4;
    --color-panel-background: rgba(255,255,255,.96);
    --color-panel-background-strong: #ffffff;
    --color-elevated-surface: #ffffff;
    --color-input-background: #ffffff;
    --color-border: rgba(7,23,43,.16);
    --color-border-strong: rgba(7,23,43,.28);
    --color-link: #1d4ed8;
    --color-link-hover: #1d4ed8;
    --color-focus-ring: #2563eb;
    --color-navigation-background: rgba(255,255,255,.96);
    --color-navigation-active: #aa1311;
    --color-table-header: #e8edf4;
    --color-table-row: rgba(255,255,255,.92);
    --color-selected-background: rgba(170,19,17,.09);
    --color-selected-border: #aa1311;
    --color-disabled-background: rgba(89,103,122,.09);
    --color-disabled-text: #687386;
    --color-brand-accent-text: #a90d14;
    --color-success-surface: rgba(var(--color-success-rgb), .09);
    --color-information-surface: rgba(var(--color-information-rgb), .08);
    --color-warning-surface: rgba(var(--color-warning-rgb), .09);
    --color-destructive-surface: rgba(var(--color-destructive-rgb), .09);
    --bg: var(--color-page-background);
    --bg-2: var(--color-page-background-alt);
    --panel: var(--color-panel-background);
    --panel-2: var(--color-panel-background-strong);
    --border: var(--color-border);
    --text: var(--color-text-primary);
    --muted: var(--color-text-muted);
    --gold: var(--color-warning);
    --danger: var(--color-destructive);
    --success: var(--color-success);
    --shadow: 0 18px 48px rgba(7,23,43,.12);
}

body.poker-modern {
    color: var(--color-text-primary);
    background:
        radial-gradient(circle at 6% 0%, rgba(var(--brand-red-rgb), .13), transparent 27%),
        radial-gradient(circle at 96% 4%, rgba(var(--brand-navy-rgb), .48), transparent 34%),
        linear-gradient(145deg, var(--color-page-background), var(--color-page-background-alt) 58%, #040912);
}

html[data-theme="light"] body.poker-modern {
    background:
        radial-gradient(circle at 5% 0%, rgba(var(--brand-red-rgb), .055), transparent 27%),
        radial-gradient(circle at 96% 4%, rgba(var(--brand-navy-rgb), .055), transparent 34%),
        linear-gradient(145deg, var(--color-page-background), #f8fafc 62%, var(--color-page-background-alt));
}

.poker-topbar {
    position: relative;
    overflow: visible;
    background: var(--color-navigation-background);
    border-color: var(--color-border-strong);
}

.poker-topbar::after {
    content: "";
    position: absolute;
    inset: auto 24px 0;
    height: 2px;
    background: linear-gradient(90deg, var(--brand-red), transparent 72%);
    pointer-events: none;
}

.brand-kicker { color: var(--color-brand-accent-text); }
.brand-title,
.panel h1,
.panel h2,
.panel h3 { color: var(--color-text-primary); }
.brand-subtitle,
.subtle,
.small-note { color: var(--color-text-muted); }

.panel,
.stat-card,
.nav-card,
.timer-panel,
.timer-main,
.context-help-popover,
.tour-card {
    background: var(--color-panel-background);
    border-color: var(--color-border);
}

.nav-card:hover,
.nav-card:focus-visible,
.poker-card:hover,
.poker-card:focus-within {
    border-color: var(--color-selected-border) !important;
    background: var(--color-selected-background) !important;
}

.poker-btn,
.poker-link-btn {
    transition: background-color .16s ease, border-color .16s ease,
        box-shadow .16s ease, color .16s ease, transform .16s ease;
}

.poker-btn:not(.secondary):not(.danger):not(.gold),
.poker-link-btn:not(.secondary):not(.danger):not(.gold) {
    color: var(--color-on-primary);
    border-color: var(--color-primary-action);
    background: var(--color-primary-action);
    box-shadow: 0 9px 24px rgba(var(--color-primary-action-rgb), .23);
}

.poker-btn:not(.secondary):not(.danger):not(.gold):hover,
.poker-btn:not(.secondary):not(.danger):not(.gold):focus-visible,
.poker-link-btn:not(.secondary):not(.danger):not(.gold):hover,
.poker-link-btn:not(.secondary):not(.danger):not(.gold):focus-visible {
    color: var(--color-on-primary);
    border-color: var(--color-primary-action-hover);
    background: var(--color-primary-action-hover);
    box-shadow: 0 11px 28px rgba(var(--color-primary-action-rgb), .31);
    transform: translateY(-1px);
}

.poker-btn:not(.secondary):not(.danger):not(.gold):active,
.poker-link-btn:not(.secondary):not(.danger):not(.gold):active {
    border-color: var(--color-primary-action-active);
    background: var(--color-primary-action-active);
    transform: translateY(0);
}

.poker-btn.secondary,
.poker-link-btn.secondary,
.poker-pill {
    color: var(--color-text-primary);
    border-color: var(--color-border-strong);
    background: var(--color-secondary-action);
    box-shadow: none;
}

.poker-btn.secondary:hover,
.poker-btn.secondary:focus-visible,
.poker-link-btn.secondary:hover,
.poker-link-btn.secondary:focus-visible {
    color: var(--color-text-primary);
    border-color: var(--color-selected-border);
    background: var(--color-secondary-action-hover);
}

.poker-link-btn.danger,
.poker-btn.danger {
    color: var(--color-on-destructive);
    border: 2px solid #fca5a5;
    background: var(--color-destructive);
    box-shadow: inset 4px 0 0 #fecaca, 0 8px 20px rgba(var(--color-destructive-rgb), .22);
}

.poker-link-btn.danger:hover,
.poker-link-btn.danger:focus-visible,
.poker-btn.danger:hover,
.poker-btn.danger:focus-visible {
    color: var(--color-on-destructive);
    border-color: #fecaca;
    background: var(--color-destructive-hover);
    box-shadow: inset 4px 0 0 #ffffff, 0 10px 24px rgba(var(--color-destructive-rgb), .30);
}

button.poker-link-btn.danger,
.eliminate-toggle {
    border-color: var(--color-destructive);
    box-shadow: 0 8px 20px rgba(var(--color-destructive-rgb), .22);
}

button.poker-link-btn.danger:hover,
button.poker-link-btn.danger:focus-visible,
.eliminate-toggle:hover,
.eliminate-toggle:focus-visible {
    border-color: var(--color-destructive-hover);
    box-shadow: 0 10px 24px rgba(var(--color-destructive-rgb), .30);
}

.poker-btn.gold,
.poker-link-btn.gold {
    color: var(--color-text-primary);
    border-color: rgba(var(--color-warning-rgb), .45);
    background: var(--color-warning-surface);
    box-shadow: none;
}

.poker-btn.gold:hover,
.poker-btn.gold:focus-visible,
.poker-link-btn.gold:hover,
.poker-link-btn.gold:focus-visible {
    color: var(--color-text-primary);
    border-color: var(--color-warning);
    background: rgba(var(--color-warning-rgb), .18);
    box-shadow: 0 8px 20px rgba(var(--color-warning-rgb), .16);
}

:where(a:not([class])) { color: var(--color-link); }
:where(a:not([class])):hover,
:where(a:not([class])):focus-visible { color: var(--color-link-hover); }

:where(a,button,input,select,textarea,[tabindex]):focus-visible {
    outline-color: var(--color-focus-ring);
}

.form-input,
.form-group-modern input[type="text"],
.form-group-modern textarea,
.choice-group {
    color: var(--color-text-primary);
    background: var(--color-input-background);
    border-color: var(--color-border-strong);
}

.poker-modern .form-input:focus,
.poker-modern .form-input:focus-visible,
.form-group-modern input[type="text"]:focus,
.form-group-modern textarea:focus {
    border-color: var(--color-focus-ring);
    box-shadow: 0 0 0 3px rgba(var(--color-primary-action-rgb), .20);
}

:where(input[type="checkbox"],input[type="radio"]) { accent-color: var(--color-primary-action); }

.table-modern thead tr,
.players-table thead tr { background: var(--color-table-header); }
.table-modern tbody tr { background: var(--color-table-row); }
.table-modern td,
.table-modern th,
.players-table td,
.players-table th,
.mini-stat-table td,
.payout-table td { border-color: var(--color-border); }
.table-modern th,
.players-table th { color: var(--color-text-secondary); }
.table-modern th { background: var(--color-table-header); }

.badge {
    color: var(--color-text-secondary);
    background: var(--color-disabled-background);
    border-color: var(--color-border);
}
.badge.going {
    color: var(--color-success);
    background: var(--color-success-surface);
    border-color: rgba(var(--color-success-rgb), .34);
}
.positive { color: var(--color-success); }
.badge.maybe {
    color: var(--color-warning);
    background: var(--color-warning-surface);
    border-color: rgba(var(--color-warning-rgb), .34);
}
.badge.not_going {
    color: #fca5a5;
    background: var(--color-destructive-surface);
    border-color: rgba(var(--color-destructive-rgb), .42);
}
.negative { color: #fca5a5; }

.notice-success {
    color: var(--color-success);
    background: var(--color-success-surface);
    border-color: rgba(var(--color-success-rgb), .38);
}
.notice-info {
    color: var(--color-information);
    background: var(--color-information-surface);
    border-color: rgba(var(--color-information-rgb), .38);
}
.notice-warning {
    color: var(--color-warning);
    background: var(--color-warning-surface);
    border-color: rgba(var(--color-warning-rgb), .42);
}
.notice-error {
    color: #fecaca;
    background: var(--color-destructive-surface);
    border: 2px solid rgba(252,165,165,.72);
    box-shadow: inset 4px 0 0 var(--color-destructive);
}

html[data-theme="light"] .notice-error,
html[data-theme="light"] .badge.not_going,
html[data-theme="light"] .negative { color: var(--color-destructive); }

.help-tip,
.context-help-button,
.guide-me-button {
    color: var(--color-information) !important;
    border-color: rgba(var(--color-information-rgb), .42) !important;
    background: var(--color-information-surface) !important;
}
.guide-me-button::before {
    color: var(--brand-navy-deep);
    background: var(--color-information);
}
.help-category-icon,
.help-steps li::before {
    color: var(--color-information);
    background: var(--color-information-surface);
    border-color: rgba(var(--color-information-rgb), .34);
}
.help-tip-box {
    border-left-color: var(--color-information);
    background: var(--color-information-surface);
}
.context-help-popover a,
.help-read-more,
.onboarding-item a { color: var(--color-link); }
.onboarding-item a:hover,
.onboarding-item a:focus-visible,
.context-help-popover a:hover,
.context-help-popover a:focus-visible,
.help-article-card:hover .help-read-more,
.help-article-card:focus-visible .help-read-more { color: var(--color-link-hover); }
.context-help-popover { background: var(--color-panel-background-strong); }
.tour-target {
    box-shadow: 0 0 0 5px rgba(var(--color-information-rgb), .62),
        0 0 0 9999px rgba(0,0,0,.48) !important;
}

.appearance-choice.is-selected,
.color-scheme-choice.is-selected,
[aria-selected="true"],
.is-selected {
    border-color: var(--color-selected-border);
    background: var(--color-selected-background);
}

:where(button,input,select,textarea,[aria-disabled="true"]):disabled,
[aria-disabled="true"] {
    color: var(--color-disabled-text) !important;
    background: var(--color-disabled-background) !important;
    border-color: var(--color-border) !important;
    opacity: .72;
    box-shadow: none !important;
    cursor: not-allowed;
}

.front {
    color: var(--color-on-primary);
    background: linear-gradient(180deg, var(--color-primary-action-hover), var(--color-primary-action-active));
    box-shadow: 0 10px 28px rgba(var(--color-primary-action-rgb), .30);
}
.pushable.secondary .front {
    background: linear-gradient(180deg, var(--brand-navy-soft), var(--brand-navy-deep));
    box-shadow: 0 10px 28px rgba(var(--brand-navy-rgb), .34);
}
.pushable.gold .front {
    background: linear-gradient(180deg, var(--color-warning), var(--color-warning-strong));
    box-shadow: 0 10px 28px rgba(var(--color-warning-rgb), .24);
}
.timer-main {
    background: radial-gradient(circle at center, rgba(var(--brand-red-rgb), .10), transparent 42%),
        linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
}
.timer-alert { color: var(--color-success); }

.poker-topbar .subscription-plan-pill.trial-cta {
    color: #ffffff !important;
    border-color: rgba(255,255,255,.52);
    background: linear-gradient(115deg, var(--brand-red-hover), var(--brand-red), var(--brand-red-active));
    box-shadow: 0 8px 24px rgba(var(--brand-red-rgb), .30),
        0 0 0 1px rgba(255,255,255,.10) inset;
    animation: none;
}

.ai-assistant-launcher,
.ai-assistant-launcher:hover {
    color: #ffffff;
    border-color: rgba(255,255,255,.36);
    background: linear-gradient(135deg, var(--brand-navy-soft), var(--brand-red));
    box-shadow: 0 16px 42px rgba(var(--brand-navy-rgb), .42);
}

html[data-theme="light"] .poker-topbar,
html[data-theme="light"] .panel,
html[data-theme="light"] .stat-card,
html[data-theme="light"] .nav-card,
html[data-theme="light"] .timer-panel,
html[data-theme="light"] .timer-main {
    color: var(--color-text-primary);
    background-color: var(--color-panel-background);
}

html[data-theme="light"] .poker-btn.secondary,
html[data-theme="light"] .poker-link-btn.secondary,
html[data-theme="light"] .poker-pill {
    background: var(--color-secondary-action);
    border-color: var(--color-border-strong);
}

/* Mobile primitives - audit remediation batches 1 and 2. */
:root {
    --mobile-panel-padding: 14px;
    --mobile-section-gap: 10px;
    --safe-area-top: env(safe-area-inset-top, 0px);
    --safe-area-right: env(safe-area-inset-right, 0px);
    --safe-area-bottom: env(safe-area-inset-bottom, 0px);
    --safe-area-left: env(safe-area-inset-left, 0px);
    --mobile-floating-rail-height: 60px;
}

html,
body.poker-modern {
    max-width: 100%;
}

.poker-shell,
.poker-shell > *,
.panel,
.table-shell,
.table-scroll,
.table-priority,
.table-cards {
    min-width: 0;
    max-width: 100%;
}

.table-shell,
.table-scroll {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
}

.table-contained { contain: inline-size; }
.safe-area-bottom { padding-bottom: calc(var(--mobile-section-gap) + var(--safe-area-bottom)); }
.action-primary-mobile,
.actions-paired-mobile,
.actions-compact-mobile,
.actions-overflow-mobile { min-width: 0; }
.actions-compact-mobile { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.mobile-nav-toggle { display: none; }
[data-mobile-action-tray][hidden] { display: none !important; }

@media (max-width: 620px) {
    .density-mobile-compact { gap: var(--mobile-section-gap) !important; }
    .panel.density-mobile-compact,
    .density-mobile-compact.panel { padding: var(--mobile-panel-padding); }
    .action-primary-mobile { width: 100%; }
    .actions-paired-mobile { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .actions-paired-mobile > * { width: 100%; min-height: 44px; }
    .actions-compact-mobile > * { min-height: 44px; }
    .actions-overflow-mobile [data-mobile-overflow-items][hidden] { display: none; }

    .mobile-floating-tray {
        position: fixed;
        z-index: 9000;
        right: max(10px, var(--safe-area-right));
        bottom: max(10px, var(--safe-area-bottom));
        left: max(10px, var(--safe-area-left));
        display: flex;
        align-items: flex-end;
        justify-content: flex-end;
        gap: 8px;
        max-width: none;
        pointer-events: none;
    }
    .mobile-floating-tray > * { pointer-events: auto; }
    .mobile-floating-tray .ai-assistant-launcher,
    .mobile-floating-tray .live-game-shortcuts {
        position: static;
        inset: auto;
        margin: 0;
    }
    .mobile-floating-tray .live-game-shortcuts {
        display: flex;
        flex: 1 1 auto;
        min-width: 0;
        max-width: calc(100% - 62px);
        max-height: none;
        flex-direction: row;
        align-items: center;
        overflow-x: auto;
        overflow-y: hidden;
        scrollbar-width: thin;
    }
    .mobile-floating-tray .live-game-shortcut {
        flex: 0 1 auto;
        min-width: 44px;
        min-height: 44px;
    }
    body.has-mobile-floating-tray .poker-shell {
        padding-bottom: calc(var(--mobile-floating-rail-height) + var(--safe-area-bottom) + 24px);
    }
    body.mobile-field-focused .mobile-floating-tray,
    body.mobile-action-tray-open .mobile-floating-tray {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }
    body[data-mobile-context="live"] .mobile-floating-tray .ai-assistant-launcher,
    body[data-mobile-context="destructive"] .mobile-floating-tray .ai-assistant-launcher {
        display: none;
    }
    body[data-mobile-context="destructive"] .mobile-floating-tray:empty { display: none; }
}

@media (max-width: 430px) {
    .poker-topbar:has(.topbar-actions:not([hidden])) { z-index: 9200; }
    .poker-shell {
        padding-top: calc(10px + var(--safe-area-top));
        padding-right: max(10px, var(--safe-area-right));
        padding-left: max(10px, var(--safe-area-left));
    }
    .poker-topbar {
        position: relative;
        display: grid;
        grid-template-columns: minmax(0, 1fr) 48px;
        align-items: center;
        gap: 10px;
        margin-bottom: 14px;
        padding: 11px 12px;
        border-radius: 17px;
    }
    .topbar-brand-cluster {
        display: grid;
        grid-template-columns: 92px minmax(0, 1fr);
        align-items: center;
        gap: 10px;
        width: 100%;
    }
    .site-brand-logo { width: 92px; max-width: 92px; }
    .topbar-page-copy { padding-top: 0; }
    .brand-kicker {
        overflow: hidden;
        font-size: 10px;
        line-height: 1.2;
        letter-spacing: .09em;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .brand-title { margin-top: 3px; font-size: 18px; line-height: 1.16; }
    .brand-subtitle {
        display: -webkit-box;
        margin-top: 3px;
        overflow: hidden;
        font-size: 11px;
        line-height: 1.25;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
    }
    .mobile-nav-toggle {
        display: inline-flex;
        width: 48px;
        min-width: 48px;
        height: 48px;
        min-height: 48px;
        align-items: center;
        justify-content: center;
        padding: 0;
        border: 1px solid var(--border);
        border-radius: 13px;
        color: var(--text);
        background: var(--color-secondary-action);
        font: inherit;
        font-size: 22px;
        cursor: pointer;
    }
    .mobile-nav-toggle:focus-visible { outline: 3px solid var(--color-focus-ring); outline-offset: 2px; }
    .poker-topbar .topbar-actions {
        position: absolute;
        z-index: 9100;
        top: calc(100% + 7px);
        right: 0;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: min(320px, calc(100vw - 20px));
        max-height: calc(100vh - 92px - var(--safe-area-bottom));
        padding: 10px;
        overflow-y: auto;
        border: 1px solid var(--border);
        border-radius: 16px;
        background: var(--color-panel-background-strong);
        box-shadow: var(--shadow);
    }
    .poker-topbar .topbar-actions[hidden] { display: none !important; }
    .poker-topbar .topbar-actions > * {
        min-width: 0;
        min-height: 44px;
        font-family: inherit;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.2;
    }
html[data-theme="light"] .poker-topbar .topbar-actions { background: #fff; }
}

/* Mobile no-pan content presentations. Desktop table behavior is unchanged. */
@media (max-width: 620px) {
    .table-shell.mobile-reflow-shell,
    .plan-feature-matrix-wrap {
        overflow: visible;
        border: 0;
    }
    .mobile-reflow-table,
    .plan-feature-matrix.mobile-reflow-table {
        display: block;
        width: 100%;
        min-width: 0;
        table-layout: auto;
    }
    .mobile-reflow-table thead { display: none; }
    .mobile-reflow-table tbody { display: grid; gap: 10px; width: 100%; }
    .mobile-reflow-table tbody tr {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0;
        width: 100%;
        min-width: 0;
        margin: 0;
        overflow: hidden;
        border: 1px solid var(--border);
        border-radius: 15px;
        background: var(--color-table-row);
    }
    .mobile-reflow-table tbody td,
    .plan-feature-matrix.mobile-reflow-table tbody td {
        display: flex;
        min-width: 0;
        width: auto !important;
        padding: 9px 11px;
        flex-direction: column;
        justify-content: center;
        gap: 4px;
        overflow-wrap: anywhere;
        word-break: normal;
        border: 0;
        border-bottom: 1px solid var(--border);
        border-radius: 0 !important;
        text-align: left;
        white-space: normal;
    }
    .mobile-reflow-table tbody td::before {
        content: attr(data-mobile-label);
        color: var(--muted);
        font-size: 10px;
        font-weight: 800;
        line-height: 1.2;
        letter-spacing: .06em;
        text-transform: uppercase;
    }
    .mobile-reflow-table tbody td[data-mobile-primary="true"],
    .mobile-reflow-table tbody td[data-mobile-actions="true"],
    .mobile-reflow-table tbody td[colspan] {
        grid-column: 1 / -1;
    }
    .mobile-reflow-table tbody td[data-mobile-primary="true"] {
        padding-top: 11px;
        font-size: 16px;
        background: rgba(var(--accent-rgb), .055);
    }
    .mobile-reflow-table tbody td[data-mobile-primary="true"]::before,
    .mobile-reflow-table tbody td[data-mobile-label=""]::before { display: none; }
    .mobile-reflow-table tbody td[data-mobile-actions="true"] .inline-actions,
    .mobile-reflow-table tbody td[data-mobile-actions="true"] form {
        width: 100%;
    }
    .mobile-reflow-table tbody td[data-mobile-actions="true"] .poker-link-btn {
        min-height: 44px;
    }
    .mobile-reflow-table[data-mobile-pattern="metrics"] tbody tr {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .mobile-reflow-table[data-mobile-pattern="metrics"] tbody td:first-child {
        grid-column: 1 / -1;
    }
    .mobile-reflow-table a,
    .mobile-reflow-table code,
    .mobile-reflow-table .small-note,
    .mobile-reflow-table .audit-details { overflow-wrap: anywhere; }

    .mobile-floating-tray {
        left: auto;
        width: auto;
        max-width: calc(100vw - max(20px, var(--safe-area-left)) - max(20px, var(--safe-area-right)));
    }
    .mobile-floating-tray .live-game-shortcuts {
        flex: 0 1 auto;
        max-width: calc(100vw - 72px - var(--safe-area-left) - var(--safe-area-right));
        overflow-x: auto;
        overflow-y: hidden;
        gap: 6px;
    }
    .mobile-floating-tray .live-game-shortcut {
        width: auto;
        max-width: min(132px, 38vw);
        padding: 0 12px;
        justify-content: center;
        border-radius: 12px;
    }
    .mobile-floating-tray .live-game-shortcut-dot {
        display: block;
        width: 9px;
        height: 9px;
        flex-basis: 9px;
        box-shadow: none;
    }
    .mobile-floating-tray .live-game-shortcut-desktop-label {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }
    .mobile-floating-tray .live-game-shortcut-mobile-label {
        display: inline;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    body.has-mobile-floating-tray .poker-shell {
        padding-bottom: calc(54px + var(--safe-area-bottom) + 18px);
    }
}

/* Round 2 D-lite: comfortable mobile sizing for standard tap-driven form controls. */
@media (max-width: 620px) {
    body.poker-modern :is(
        .tournament-edit-form,
        .cashgame-edit-form,
        .cashgame-settings-form,
        .notification-settings-form,
        .report-filter,
        .player-report-filter,
        .communications-message-form
    ) :is(
        input.form-input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
        select.form-input
    ) {
        min-height: 44px;
        box-sizing: border-box;
    }
}
