:root{
  --bg:#12171b; --bg-2:#1b2329; --panel:#202930; --panel-2:#2a353d; --text:#eef3f6; --muted:#b5c1c9;
  --line:#3a4750; --accent:#8ea3b0; --accent-2:#cfdbe2; --nav:#0d1216; --nav-2:#171e23; --nav-text:#f4f7f9;
  --shadow:0 12px 28px rgba(0,0,0,.28); --radius:18px; --division-shell:#243038; --division-shell-2:#2e3a43;
  --division-edge:#4f636f; --division-title:#f2f7fa;
}
*{box-sizing:border-box} html,body{margin:0;padding:0}
body{font-family:Arial,Helvetica,sans-serif;background:linear-gradient(180deg,var(--bg) 0%,var(--bg-2) 100%);color:var(--text);overflow-x:hidden}
a{color:inherit}.shell{min-height:100vh}
.topbar{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:18px 20px;background:linear-gradient(180deg,var(--nav) 0%,var(--nav-2) 100%);color:var(--nav-text);box-shadow:0 8px 22px rgba(0,0,0,.26)}
.brand-link{display:flex;flex-direction:column;gap:2px;min-width:0;text-decoration:none;color:inherit}
.brand-link:hover{opacity:.98}
.topbar-subline{font-size:.78rem;color:#b5c1c9;line-height:1.2}
.topbar-actions{display:flex;align-items:center;gap:12px;justify-content:flex-end;min-width:0;position:relative}
.eyebrow{font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:#d4dbe1}.title{font-size:1.5rem;font-weight:800;line-height:1.05}
.topnav{display:flex;gap:10px;align-items:center}
.topnav a{text-decoration:none;font-weight:700;color:var(--nav-text);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);padding:10px 14px;border-radius:999px}
.topnav a:hover{background:rgba(255,255,255,.14)}
.nav-dropdown{position:relative}
.nav-dropdown__menu--right{left:auto;right:0}
.nav-dropdown__toggle{min-height:42px;padding:0 14px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.08);color:var(--nav-text);font-weight:700;cursor:pointer}
.nav-dropdown__menu{display:none;position:absolute;top:calc(100% + 8px);left:0;min-width:220px;max-width:min(260px,calc(100vw - 24px));padding:8px;border-radius:14px;background:#182026;border:1px solid rgba(255,255,255,.12);box-shadow:0 14px 28px rgba(0,0,0,.28);z-index:200}
.nav-dropdown__menu a{display:block;border-radius:10px;padding:10px 12px;background:transparent;border:none}
.account-badge{display:inline-flex;align-items:center;justify-content:center;min-width:52px;height:42px;padding:0 14px;border-radius:0;background:radial-gradient(circle at center,#9fd0ff 0%,#5a93d3 48%,#2d5d9a 100%);color:#f7fbff;border:1px solid rgba(255,255,255,.22);font-size:1rem;font-weight:900;box-shadow:0 8px 18px rgba(0,0,0,.24);clip-path:polygon(12px 0,calc(100% - 12px) 0,100% 12px,100% calc(100% - 12px),calc(100% - 12px) 100%,12px 100%,0 calc(100% - 12px),0 12px)}
.account-badge:hover{filter:brightness(.98)}
.account-dropdown{position:relative}
.account-menu{right:0;left:auto;transform-origin:top right}
.account-dropdown__label{padding:8px 12px 10px;font-size:.9rem;font-weight:800;color:var(--muted);border-bottom:1px solid rgba(255,255,255,.08);margin-bottom:4px}
.nav-dropdown__menu a:hover{background:rgba(255,255,255,.08)}
.nav-dropdown:hover .nav-dropdown__menu{display:block}.nav-dropdown.is-open .nav-dropdown__menu{display:block}
.main{width:min(1180px,calc(100% - 24px));margin:24px auto}
.card{background:linear-gradient(180deg,var(--panel) 0%,var(--panel-2) 100%);border:1px solid var(--line);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);margin-bottom:18px}
.card-narrow{max-width:520px;margin:40px auto}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px}.stack > div + div{margin-top:14px}
label{display:block;font-weight:700;margin-bottom:6px;color:var(--text)}
input,select,textarea{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:#10161a;color:var(--text)}
button{appearance:none;border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg,var(--accent-2) 0%,var(--accent) 100%);color:#101215;font-weight:800;padding:12px 16px;border-radius:999px;cursor:pointer}
button:hover{filter:brightness(.98)}
.flash{border-radius:14px;padding:12px 14px;margin-bottom:16px;border:1px solid transparent;font-weight:700}
.flash-success{background:#1f4f33;border-color:#3f7a5b;color:#e8fff0}.flash-error{background:#5b2222;border-color:#8b4040;color:#ffeaea}
.muted{color:var(--muted)} .plain-list{list-style:none;margin:0;padding:0}.plain-list li + li{margin-top:8px}
h1,h2{margin-top:0;color:var(--division-title)}
.row-between{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.button-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.publish-note{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);color:var(--text);font-weight:700}
.button-link{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 16px;border-radius:999px;text-decoration:none;border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg,var(--accent-2) 0%,var(--accent) 100%);color:#101215;font-weight:800}
.button-link.small-btn{min-height:38px;padding:0 12px}.table-wrap{overflow:auto}.admin-table{width:100%;border-collapse:collapse}
.admin-table th,.admin-table td{text-align:left;padding:10px 12px;border-bottom:1px solid rgba(255,255,255,.08);vertical-align:top}.admin-table.compact{min-width:0}
.inline-form{display:inline}
.publish-pill{display:inline-flex;align-items:center;min-height:34px;padding:0 12px;border-radius:999px;font-weight:700}
.publish-pill.is-live{background:#1f4f33;color:#e8fff0;border:1px solid #3f7a5b}
.publish-pill.is-draft{background:#6a5415;color:#fff6db;border:1px solid #9c8341}
.hero-card{margin-top:4px}
.session-filter{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap}.session-filter select{min-width:280px}
.session-summary{display:inline-flex;align-items:center;min-height:42px;padding:0 14px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);color:var(--text);font-weight:700}
.session-actions{display:flex;justify-content:flex-end;margin-top:18px}
.game-card-list{display:grid;gap:16px}
.game-card{border:1px solid var(--division-edge);border-radius:16px;padding:16px;box-shadow:0 8px 18px rgba(0,0,0,.14)}
.game-card.shade-a{background:linear-gradient(180deg,var(--division-shell) 0%,var(--division-shell-2) 100%)}
.game-card.shade-b{background:linear-gradient(180deg,var(--division-shell-2) 0%,var(--division-shell) 100%)}
.game-card__top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:14px}
.game-card__body{display:grid;gap:14px}.game-meta{font-weight:800;color:var(--division-title)}.game-meta-subtle{color:var(--muted);font-size:.95rem;margin-top:4px}
.status-block select{max-width:260px}.team-score-grid{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:end}.team-score-box{display:grid;gap:8px}
.versus-pill{display:inline-flex;align-items:center;justify-content:center;min-width:52px;min-height:44px;padding:0 12px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1);color:var(--text);font-weight:800}
.division-card{border-color:var(--division-edge)} .division-index-card{border-width:2px}
.division-theme.division-red,.division-index-card.division-red{--division-shell:#412223;--division-shell-2:#542b2d;--division-edge:#8f5054}
.division-theme.division-white,.division-index-card.division-white{--division-shell:#f3f6f8;--division-shell-2:#e7edf1;--division-edge:#c3ced6;--division-title:#f2f7fa}
.division-theme.division-gold,.division-index-card.division-gold{--division-shell:#4a3a1c;--division-shell-2:#5b4924;--division-edge:#b08b36}
.division-theme.division-gray,.division-index-card.division-gray{--division-shell:#d8dfe4;--division-shell-2:#c9d2d9;--division-edge:#99a7b1;--division-title:#f2f7fa}
.division-theme.division-blue,.division-index-card.division-blue{--division-shell:#1f3552;--division-shell-2:#274163;--division-edge:#4f7db8}
.division-theme.division-white .game-card,.division-theme.division-gray .game-card{color:#11161a}
.division-theme.division-white .game-card label,.division-theme.division-gray .game-card label,.division-theme.division-white .game-card .game-meta,.division-theme.division.gray .game-card .game-meta,.division-theme.division-white .game-card .versus-pill,.division-theme.division-gray .game-card .versus-pill{color:#11161a}
.division-theme.division-white .game-card .game-meta-subtle,.division-theme.division-gray .game-card .game-meta-subtle,.division-theme.division-white .game-card .tiny-note,.division-theme.division-gray .game-card .tiny-note{color:#3f4d57}
.division-theme.division-white .game-card input,.division-theme.division-gray .game-card input,.division-theme.division-white .game-card select,.division-theme.division-gray .game-card select,.division-theme.division-white .game-card textarea,.division-theme.division-gray .game-card textarea{background:#ffffff;color:#11161a;border-color:#aebbc4}
.division-theme.division-white .game-card .versus-pill,.division-theme.division-gray .game-card .versus-pill{background:rgba(0,0,0,.05);border-color:rgba(0,0,0,.12)}
.division-theme.division-white .game-card .publish-pill.is-live,.division-theme.division-gray .game-card .publish-pill.is-live{color:#10361d;background:#dff3e4;border-color:#88b997}
.division-theme.division-white .game-card .publish-pill.is-draft,.division-theme.division-gray .game-card .publish-pill.is-draft{color:#654900;background:#f6e9c6;border-color:#d6bd77}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}.top-gap{padding-top:28px}
.checkbox-row{display:flex;align-items:center}.checkbox-inline{display:inline-flex;align-items:center;gap:10px;font-weight:700}.checkbox-inline input{width:auto;margin:0}
.subpanel{padding:18px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.04)}.division-assignment-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.assignment-card{border:1px solid var(--line);border-radius:14px;padding:14px;background:rgba(255,255,255,.04)}.secondary-check{margin-top:12px}.tiny-note{margin-top:6px;color:var(--muted);font-size:.92rem}
@media (max-width: 720px){
  .topbar{align-items:flex-start;flex-direction:row;justify-content:space-between;gap:12px}
  .topbar-actions{justify-content:flex-end;align-items:flex-start;min-width:auto}
  .topnav{display:none}
  .main{width:min(100% - 16px,1180px);margin:16px auto}
  .team-score-grid{grid-template-columns:1fr}
  .versus-pill{justify-self:start}
  .session-actions{justify-content:stretch}
  .session-actions button{width:100%}
  .account-menu{position:absolute;top:calc(100% + 8px);right:0;left:auto;width:min(240px,calc(100vw - 24px))}
  .nav-dropdown:hover .nav-dropdown__menu{display:none}
  .nav-dropdown.is-open .nav-dropdown__menu{display:block}
}

.beta-float-btn{position:fixed;right:20px;bottom:20px;z-index:999;display:flex;align-items:center;justify-content:center;min-height:48px;padding:0 18px;border-radius:999px;text-decoration:none !important;font-weight:800;background:#2a6a49;color:#eefbf3;box-shadow:0 10px 24px rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.18);white-space:nowrap}
.beta-float-btn:hover{filter:brightness(1.04)}
@media (max-width: 720px){.beta-float-btn{right:12px;bottom:12px;padding:0 14px;min-height:44px;font-size:.92rem;max-width:calc(100vw - 24px)}}

@media (min-width: 721px){
  .account-menu{max-width:min(260px,calc(100vw - 24px));}
}

.light-field{background:#d7dee3 !important;color:#11161a !important;border-color:#aab6bf !important}
.light-field::-webkit-calendar-picker-indicator{opacity:1;filter:none;cursor:pointer}
.light-field::-webkit-inner-spin-button,.light-field::-webkit-clear-button{opacity:1}
.reorder-row{margin-top:8px;gap:6px}
button.small-btn{min-height:34px;padding:0 10px;border-radius:12px}


.order-cell{display:inline-flex;align-items:center;gap:10px;white-space:nowrap}
.order-value{display:inline-block;min-width:1.5rem}
.reorder-compact{display:inline-flex;align-items:center;gap:6px}
button.tiny-icon-btn{display:inline-flex;align-items:center;justify-content:center;width:32px;min-width:32px;height:32px;min-height:32px;padding:0;border-radius:10px;font-size:1rem;line-height:1;font-weight:900}
@media (max-width: 720px){
  .order-cell{gap:8px}
  .reorder-compact{flex-direction:column;gap:4px}
  button.tiny-icon-btn{width:28px;min-width:28px;height:28px;min-height:28px;border-radius:8px;font-size:.95rem}
}


/* Announcement list tightening */
.announcements-table .title-cell{min-width:180px}
.action-row{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.compact-action-btn{display:inline-flex;align-items:center;justify-content:center;min-height:30px;padding:4px 8px;border-radius:8px;font-size:.82rem;font-weight:800;line-height:1.15;text-decoration:none !important}
a.compact-action-btn{background:linear-gradient(180deg,var(--accent-2) 0%,var(--accent) 100%);color:#101215;border:1px solid rgba(255,255,255,.12)}
button.compact-action-btn{appearance:none;border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg,var(--accent-2) 0%,var(--accent) 100%);color:#101215}
.danger-action-btn{background:linear-gradient(180deg,#d8b7b7 0%,#b97a7a 100%) !important;color:#1b0f0f !important}
.order-cell{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.order-value{display:inline-block;min-width:1.2rem;text-align:center}
.reorder-compact{display:inline-flex;align-items:center;gap:4px}
button.tiny-icon-btn{display:inline-flex;align-items:center;justify-content:center;width:24px;min-width:24px;height:24px;min-height:24px;padding:0;border-radius:6px;font-size:.78rem;line-height:1;font-weight:900}
.window-cell{white-space:nowrap;font-size:.92rem}
.announcements-table th:nth-child(2), .announcements-table td:nth-child(2){width:34%}

@media (max-width: 720px){
  .announcements-table th:nth-child(2), .announcements-table td:nth-child(2){width:auto}
  .announcements-table .title-cell{min-width:140px}
  .window-cell{font-size:.82rem;white-space:normal}
  .action-row{gap:4px}
  .compact-action-btn{min-height:28px;padding:3px 7px;font-size:.76rem;border-radius:7px}
  .order-cell{gap:6px}
  .reorder-compact{flex-direction:row;gap:3px}
  button.tiny-icon-btn{width:22px;min-width:22px;height:22px;min-height:22px;font-size:.72rem;border-radius:5px}
}
