:root{
  --navy:#02365d;
  --navy-deep:#001f39;
  --red:#a2162b;
  --red-dark:#7d1021;
  --white:#fff;
  --ink:#102235;
  --muted:#667788;
  --line:#d8e0e7;
  --soft:#f4f7f9;
  --soft-blue:#eef4f8;
  --gold:#d4af37;
  --silver:#b0b7c3;
  --bronze:#cd7f32;
  --green:#2e7d32;
  --danger:#b42318;
  --success:#1f7a3f;
  --warning:#9a6700;
  --shadow:0 8px 24px rgba(0,34,61,.10);
}
*{box-sizing:border-box}
html{background:var(--soft);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
body{margin:0;min-height:100vh;background:linear-gradient(180deg,#fff 0,#f7f9fb 190px,#f4f7f9 100%)}
button,input,select{font:inherit}
button{cursor:pointer}
button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid rgba(2,54,93,.22);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}
.hidden{display:none!important}
.site-header{max-width:1280px;margin:0 auto;padding:14px 20px 10px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.header-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-left:auto;flex:0 0 auto}
.powered-by-block{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;flex:0 0 auto}
.powered-by-label{font-size:.62rem;line-height:1;color:var(--muted);font-weight:800}
.powered-by-block img{display:block;width:121.44px;height:auto;max-height:31.68px;object-fit:contain}
.brand-wrap{display:flex;align-items:center;gap:12px;min-width:0;cursor:pointer}
.brand-wrap img{width:74px;height:74px;object-fit:contain;background:#fff;border-radius:14px}
.brand-copy{display:flex;flex-direction:column;min-width:0}
.brand-copy strong{font-size:1.25rem;letter-spacing:.02em;color:var(--navy-deep)}
.brand-copy span{font-size:.88rem;color:var(--muted)}
.admin-link{border:1px solid var(--line);background:#fff;color:var(--navy);border-radius:999px;padding:9px 14px;font-weight:700}
.main-nav{max-width:1280px;margin:0 auto;padding:0 20px 14px;display:flex;gap:8px}
.main-nav button{border:1px solid var(--line);background:#fff;color:var(--navy);padding:10px 18px;border-radius:10px;font-weight:800}
.main-nav button.active{background:var(--navy);border-color:var(--navy);color:#fff}
main{max-width:1280px;margin:0 auto;padding:0 20px 40px}
.page{display:none}
.page.active-page{display:block}
.mode-banner{background:#fff4d6;color:#684900;border:1px solid #ecd08b;border-radius:10px;padding:10px 13px;margin-bottom:14px;font-weight:650}
.page-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin:10px 0 14px}
.page-heading h1{margin:0;color:var(--navy-deep);font-size:1.72rem;line-height:1.08}
.page-heading p{margin:5px 0 0;color:var(--muted)}
.heading-actions{display:flex;gap:10px}
.compact-field{display:flex;align-items:center;gap:8px;font-weight:800;color:var(--navy);white-space:nowrap}
.compact-field span{font-size:.84rem;text-transform:uppercase;letter-spacing:.04em}
.compact-field select{border:1px solid var(--line);background:#fff;border-radius:9px;padding:9px 34px 9px 10px;color:var(--ink);font-weight:750}
.summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 14px}
.summary-card{background:#fff;border:1px solid var(--line);border-radius:11px;padding:11px 12px}
.summary-card span{display:block;color:var(--muted);font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;font-weight:800}
.summary-card strong{display:block;color:var(--navy-deep);font-size:1.25rem;margin-top:2px}
.division-tabs,.skill-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}
.division-tabs button,.skill-tabs button,.mobile-division-bar button{border:1px solid var(--line);background:#fff;color:var(--navy);font-weight:800;border-radius:999px;padding:9px 14px}
.division-tabs button.active{background:var(--red);border-color:var(--red);color:#fff}
.skill-tabs button.active{background:var(--navy);border-color:var(--navy);color:#fff}
.skill-tabs button.skill-open{border-color:rgba(212,175,55,.65)}
.skill-tabs button.skill-advanced{border-color:rgba(176,183,195,.9)}
.skill-tabs button.skill-competitive{border-color:rgba(205,127,50,.65)}
.skill-tabs button.skill-social{border-color:rgba(46,125,50,.65)}
.skill-tabs button.skill-open.active{background:var(--gold);border-color:var(--gold);color:#2c2200}
.skill-tabs button.skill-advanced.active{background:var(--silver);border-color:var(--silver);color:#182433}
.skill-tabs button.skill-competitive.active{background:var(--bronze);border-color:var(--bronze);color:#fff}
.skill-tabs button.skill-social.active{background:var(--green);border-color:var(--green);color:#fff}
.stats-skill-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.skill-key{display:flex;align-items:center;gap:10px;flex-wrap:wrap;color:var(--navy);font-size:.84rem;font-weight:800}
.skill-key-label{font-weight:900;color:var(--navy-deep)}
.skill-key-item{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border:1px solid var(--line);border-radius:999px;background:#fff}
.skill-key-swatch{width:12px;height:12px;border-radius:999px;display:inline-block;border:1px solid rgba(0,0,0,.08)}
.skill-key-swatch.open{background:var(--gold)}
.skill-key-swatch.advanced{background:var(--silver)}
.skill-key-swatch.competitive{background:var(--bronze)}
.skill-key-swatch.social{background:var(--green)}
.skill-key-swatch.undefined{background:#c7cfd8}
.toolbar,.stats-filter-row,.event-controls{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.search-box{flex:1;min-width:180px}
.search-box input,.admin-card input{width:100%;border:1px solid var(--line);border-radius:10px;background:#fff;padding:11px 13px;color:var(--ink)}
.toolbar-note,.table-footnote{color:var(--muted);font-size:.88rem}
.table-shell{width:100%;overflow-x:auto;background:#fff;border:1px solid var(--line);border-radius:13px;box-shadow:0 4px 14px rgba(0,34,61,.05)}
.data-table{width:100%;border-collapse:separate;border-spacing:0;min-width:720px}
.data-table th,.data-table td{padding:10px 11px;border-bottom:1px solid #e8edf1;text-align:left;white-space:nowrap;vertical-align:middle}
.data-table th{position:sticky;top:0;z-index:3;background:var(--navy);color:#fff;font-size:.78rem;letter-spacing:.03em;text-transform:uppercase}
.data-table tbody tr:last-child td{border-bottom:none}
.data-table tbody tr:hover td{background:#f8fbfd}
.data-table td.num,.data-table th.num{text-align:right}
.standings-table{min-width:990px}
.standings-table .sticky-rank{left:0;z-index:5;width:62px}
.standings-table .sticky-player{left:62px;z-index:5;min-width:190px}
.standings-table tbody td.sticky-rank{position:sticky;left:0;z-index:2;background:#fff;font-weight:900;color:var(--navy)}
.standings-table tbody td.sticky-player{position:sticky;left:62px;z-index:2;background:#fff;font-weight:800}
.standings-table tbody tr:hover td.sticky-rank,.standings-table tbody tr:hover td.sticky-player{background:#f8fbfd}
.points-cell{font-variant-numeric:tabular-nums;text-align:center}
.points-cell.muted{color:#a7b2bc}
.total-points{font-weight:900;color:var(--navy)}
.status-badge,.skill-badge,.import-status{display:inline-flex;align-items:center;border-radius:999px;padding:4px 8px;font-size:.76rem;font-weight:900;line-height:1.1}
.status-badge.qualified{background:#e8f5eb;color:var(--success)}
.status-badge.progress{background:#eef3f7;color:var(--navy)}
.skill-badge.open{background:var(--gold);color:#2a2100}
.skill-badge.advanced{background:var(--silver);color:#1c2732}
.skill-badge.competitive{background:var(--bronze);color:#fff}
.skill-badge.social{background:var(--green);color:#fff}
.skill-badge.none{background:#eef1f4;color:#73808b}
.stats-filter-row{align-items:flex-end}
.stats-skill-select-wrap{display:none}
.sortable-table th[data-sort]{cursor:pointer;user-select:none}
.sortable-table th[data-sort] span{opacity:.65;font-size:.72rem}
.stats-shell .data-table{min-width:1080px}
.stats-shell tbody tr.skill-row-open td:first-child{border-left:5px solid var(--gold)}
.stats-shell tbody tr.skill-row-advanced td:first-child{border-left:5px solid var(--silver)}
.stats-shell tbody tr.skill-row-competitive td:first-child{border-left:5px solid var(--bronze)}
.stats-shell tbody tr.skill-row-social td:first-child{border-left:5px solid var(--green)}
.table-footnote{padding:8px 2px 0}
.event-controls{align-items:flex-end;flex-wrap:wrap}
.grow-field{min-width:210px}
.event-search{min-width:220px}
.event-table{min-width:650px}
.qualification-table{min-width:850px}
.progress-wrap{display:flex;align-items:center;gap:8px}
.progress-track{width:92px;height:8px;background:#e8edf1;border-radius:99px;overflow:hidden}
.progress-track span{display:block;height:100%;background:var(--navy);border-radius:99px}
.progress-text{font-weight:850;color:var(--navy)}
footer{max-width:1280px;margin:0 auto;padding:18px 20px 32px;color:var(--muted);display:flex;justify-content:space-between;align-items:center;font-size:.88rem}
footer button{border:0;background:transparent;color:var(--navy);font-weight:800}
.notice{border:1px solid #e2c377;background:#fff8e5;color:#6c4c00;padding:12px 14px;border-radius:10px;margin-bottom:14px}
.admin-page{max-width:1180px}
.admin-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:16px;margin-bottom:16px}
.admin-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px;box-shadow:0 4px 14px rgba(0,34,61,.05)}
.admin-card h2{margin:0 0 7px;color:var(--navy-deep);font-size:1.15rem}
.admin-card h3{margin:20px 0 10px;color:var(--navy)}
.admin-card p{margin:0 0 14px;color:var(--muted)}
.admin-card label{display:block;font-size:.86rem;font-weight:800;color:var(--navy);margin:0 0 11px}
.admin-card label input,.admin-card label select{margin-top:5px}
.narrow-card{max-width:430px}
.primary-button,.secondary-button{border-radius:9px;padding:10px 13px;font-weight:850}
.primary-button{border:1px solid var(--red);background:var(--red);color:#fff}
.primary-button:hover{background:var(--red-dark)}
.primary-button:disabled{opacity:.45;cursor:not-allowed}
.secondary-button{border:1px solid var(--line);background:#fff;color:var(--navy)}
.admin-session-bar{display:flex;justify-content:space-between;align-items:center;background:var(--navy);color:#fff;padding:10px 13px;border-radius:10px;margin-bottom:14px}
.file-drop{border:2px dashed #b8c5cf!important;border-radius:12px!important;padding:20px!important;text-align:center!important;background:#f8fbfd;color:var(--navy)!important;cursor:pointer}
.file-drop input{display:none}
.upload-preview{display:grid;gap:9px;margin:12px 0}
.upload-item{border:1px solid var(--line);border-radius:10px;padding:10px 11px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}
.upload-item strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.upload-meta{font-size:.8rem;color:var(--muted);margin-top:3px}
.import-status.new{background:#e8f5eb;color:var(--success)}
.import-status.existing{background:#fff1d6;color:var(--warning)}
.import-status.invalid{background:#fdeceb;color:var(--danger)}
.replace-row{grid-column:1/-1;font-size:.82rem;color:var(--ink)}
.upload-manual-row{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-top:2px}
.upload-manual-row label{display:flex;flex-direction:column;gap:4px;font-size:.78rem;font-weight:850;color:var(--navy)}
.upload-manual-row select{width:100%;border:1px solid var(--line);border-radius:8px;background:#fff;padding:8px 9px;color:var(--ink)}
.replace-row input{width:auto!important;margin-right:6px}
.form-message{min-height:1.1em;margin-top:9px;font-size:.88rem;color:var(--muted)}
.form-message.error{color:var(--danger)}
.form-message.success{color:var(--success)}
.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.compact-admin-table{box-shadow:none}
.compact-admin-table .data-table{min-width:520px}
.compact-admin-table input{min-width:70px;padding:7px 8px}
.player-admin-search{display:flex;gap:8px;margin-bottom:12px}
.admin-player-results{display:grid;gap:8px}
.admin-player-row{display:grid;grid-template-columns:minmax(140px,1fr) minmax(200px,1fr) 170px auto;gap:8px;align-items:center;border:1px solid var(--line);padding:9px;border-radius:10px}
.admin-player-row input,.admin-player-row select{width:100%;border:1px solid var(--line);border-radius:8px;padding:8px}
.admin-player-row .email{font-size:.82rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis}
.mobile-division-bar{display:none}
.empty-row td{text-align:center!important;color:var(--muted);padding:24px!important}
@media(max-width:900px){
  .admin-grid{grid-template-columns:1fr}
  .admin-player-row{grid-template-columns:1fr 1fr}
  .admin-player-row .email{grid-column:1/-1}
}
@media(max-width:720px){
  .summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .site-header{padding:10px 12px 7px}
  .brand-wrap img{width:54px;height:54px;border-radius:10px}
  .brand-copy strong{font-size:1rem}
  .brand-copy span{font-size:.72rem}
  .admin-link{padding:7px 10px;font-size:.78rem}
  .header-actions{margin-left:auto;align-items:flex-end}
  .powered-by-block img{width:113.52px;height:auto;max-height:29.04px}
  .main-nav{padding:0 10px 10px;gap:5px;display:grid;grid-template-columns:repeat(4,1fr)}
  .main-nav button{padding:8px 3px;font-size:.76rem;border-radius:8px}
  main{padding:0 10px 24px}
  .page-heading{align-items:flex-start;margin-top:6px}
  .page-heading h1{font-size:1.35rem}
  .page-heading p{font-size:.85rem}
  .heading-actions{width:auto}
  .compact-field{align-items:flex-start;flex-direction:column;gap:4px}
  .compact-field select{padding:8px 30px 8px 9px}
  .desktop-division-tabs{display:none}
  .toolbar,.stats-filter-row{gap:7px}
  .toolbar-note{display:none}
  .table-shell{border-radius:10px}
  .data-table th,.data-table td{padding:9px 9px}
  .standings-table .sticky-player{min-width:150px}
  .stats-skill-select-wrap{display:flex;min-width:150px}
  .stats-skill-toolbar{margin-bottom:12px}
  .skill-tabs{display:none}
  .skill-key{width:100%;gap:8px;font-size:.78rem}
  .skill-key-item{padding:4px 7px}
  .header-actions{gap:10px}
  .powered-by-block{align-items:flex-end}
  .powered-by-label{font-size:.66rem}
  .powered-by-block img{width:113.52px;height:auto;max-height:29.04px}
  .mobile-division-bar{display:grid!important;grid-template-columns:repeat(var(--tab-count,4),minmax(0,1fr));gap:6px;margin:0 0 10px;padding:0;background:transparent}
  .mobile-division-bar button{border-radius:8px;padding:9px 4px;font-size:.72rem;border:1px solid var(--line);background:#f2f5f7}
  .mobile-division-bar button.active{background:var(--red);border-color:var(--red);color:#fff}
  .event-controls{display:grid;grid-template-columns:1fr 1fr}
  .grow-field,.event-search{min-width:0}
  .event-search{grid-column:1/-1}
  .settings-grid{grid-template-columns:1fr}
  .admin-player-row{grid-template-columns:1fr}
  .upload-manual-row{grid-template-columns:1fr}
  .admin-player-row .email{grid-column:auto}
}
@media(max-width:430px){
  .brand-copy span{display:none}
  .powered-by-label{font-size:.62rem}
  .powered-by-block img{width:102.96px;height:auto;max-height:26.4px}
  .page-heading{gap:10px}
  .page-heading p{max-width:245px}
  .standings-table .sticky-rank{width:54px}
  .standings-table .sticky-player{left:54px;min-width:138px}
  .standings-table tbody td.sticky-player{left:54px}
  .event-controls{grid-template-columns:1fr}
  .event-search{grid-column:auto}
}


.footer-brand-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.footer-created-by{font-size:.78rem;color:var(--muted)}
.footer-fieldops-logo{width:76px;height:auto;display:block;object-fit:contain}
.footer-year{font-size:.78rem;font-weight:800;color:var(--muted)}
@media(max-width:720px){
  .footer-brand-line{gap:6px}
  .footer-fieldops-logo{width:68px}
}


.app-loading-screen{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:#0b2138;
  opacity:1;
  visibility:visible;
  transition:opacity .45s ease, visibility .45s ease;
}
.app-loading-screen.is-hidden{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
.app-loading-screen::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:url('assets/loading-desktop.webp');
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
  transform:scale(1.02);
}
.loading-screen-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(to bottom, rgba(2,24,45,.18), rgba(2,24,45,.30));
}
.loading-screen-content{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  padding:24px;
}
.loading-logo{
  display:block;
  margin:0 auto;
  width:min(210px,42vw);
  height:auto;
  border-radius:0;
  box-shadow:none;
  filter:drop-shadow(0 0 10px rgba(255,255,255,.32)) drop-shadow(0 0 22px rgba(255,255,255,.18));
  animation:muPulse 1.8s ease-in-out infinite;
}
@keyframes muPulse{
  0%,100%{transform:scale(1);opacity:.9}
  50%{transform:scale(1.06);opacity:1}
}
@media(max-width:720px){
  .app-loading-screen::before{
    background-image:url('assets/loading-mobile.jpg');
    background-position:center center;
  }
  .loading-logo{
    width:min(180px,52vw);
    margin-left:auto;
    margin-right:auto;
  }
}


/* Club affiliation */
.club-column{min-width:76px;text-align:center}
.club-badge{display:inline-flex;align-items:center;justify-content:center;min-width:40px;max-width:72px;padding:4px 8px;border-radius:999px;font-size:.72rem;font-weight:950;line-height:1;letter-spacing:.025em;white-space:nowrap;border:1px solid rgba(0,0,0,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.club-badge.none{background:#eef1f4!important;color:#73808b!important;border-color:#d9e0e6}
.club-key-host{margin:10px 0 14px}
.club-key-panel{background:#fff;border:1px solid var(--line);border-radius:11px;overflow:hidden}
.club-key-panel summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:8px;padding:10px 12px;color:var(--navy);font-size:.84rem;font-weight:900;user-select:none}
.club-key-panel summary::-webkit-details-marker{display:none}
.club-key-panel summary:after{content:'+';margin-left:auto;font-size:1.05rem}
.club-key-panel[open] summary:after{content:'−'}
.club-key-count{font-weight:700;color:var(--muted)}
.club-key-items{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:18px;row-gap:8px;padding:10px 12px 12px;border-top:1px solid #eef2f6;align-items:start}
.club-key-item{display:grid;grid-template-columns:42px minmax(0,1fr);align-items:center;gap:7px;min-width:0;color:var(--ink);font-size:.78rem;font-weight:750;line-height:1.2}
.club-key-item .club-badge{width:42px;min-width:42px;max-width:42px;padding-left:4px;padding-right:4px}
.club-key-item>span:last-child{min-width:0;overflow-wrap:anywhere}
.club-import-warnings{margin-top:10px;border:1px solid #f0c8c8;background:#fff6f6;border-radius:10px;padding:10px 12px;color:#7d2525;font-size:.8rem}
.club-import-warnings strong{display:block;margin-bottom:6px}
.club-import-warnings ul{margin:0;padding-left:18px;display:grid;gap:3px}
.admin-section-heading{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.club-manager-card{margin-bottom:16px}
.admin-club-rows{display:grid;gap:8px;margin-top:12px}
.admin-club-row{display:grid;grid-template-columns:minmax(220px,1fr) 100px 125px 80px auto;gap:8px;align-items:center;border:1px solid var(--line);padding:9px;border-radius:10px}
.admin-club-row input[type="text"]{width:100%;border:1px solid var(--line);border-radius:8px;padding:8px}
.admin-club-row .club-color-control{display:flex;align-items:center;gap:7px;margin:0}
.admin-club-row input[type="color"]{width:44px;height:34px;padding:2px;border:1px solid var(--line);border-radius:7px;background:#fff}
.admin-club-row .club-player-count{font-size:.78rem;color:var(--muted);font-weight:800;text-align:center}
.admin-player-row{grid-template-columns:minmax(140px,1fr) minmax(190px,1fr) 155px 170px auto}
@media(max-width:900px){
  .admin-club-row{grid-template-columns:1fr 100px 125px}
  .admin-club-row .club-player-count,.admin-club-row .save-club-button{grid-column:auto}
  .admin-player-row{grid-template-columns:1fr 1fr}
}
@media(max-width:1100px){.club-key-items{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.club-key-items{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){
  .admin-club-row{grid-template-columns:1fr}
  .admin-club-row .club-player-count{text-align:left}
  .admin-player-row{grid-template-columns:1fr}
}
@media(max-width:430px){.club-key-items{grid-template-columns:1fr}}
