:root {
  color-scheme: dark;
  --ink:#090b09;
  --panel:#121512;
  --field:#0b0e0b;
  --line:#303730;
  --volt:#ccff00;
  --text:#f4f6f1;
  --muted:#a9b1a7;
  --danger:#ff8b82;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-width:320px; background:var(--ink); color:var(--text); font:400 16px/1.5 Inter,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; }
button,input,select { font:inherit; }
button { cursor:pointer; }
a { color:inherit; }
[hidden] { display:none!important; }
.site-header,main,footer { width:min(940px,calc(100% - 40px)); margin-inline:auto; }
.site-header { min-height:86px; display:flex; align-items:center; border-bottom:1px solid var(--line); }
.brand { display:inline-flex; align-items:center; gap:14px; color:var(--text); text-decoration:none; }
.brand-logo { display:block; width:58px; height:58px; object-fit:contain; }
.brand strong,.brand small { display:block; }
.brand strong { font-size:.85rem; line-height:1.3; letter-spacing:.085em; text-transform:uppercase; font-weight:800; }
.brand small { margin-top:4px; color:var(--muted); font-size:.79rem; line-height:1.3; }
.skip-link { position:fixed; z-index:30; top:-100px; left:16px; background:var(--volt); color:var(--ink); padding:10px 14px; }
.skip-link:focus { top:12px; }
.hero { max-width:780px; padding:48px 0 27px; }
.hero h1,.admin-hero h1 { margin:0; font-size:clamp(2rem,5vw,3.4rem); letter-spacing:-.045em; font-weight:750; line-height:1.1; }
.hero p { margin:12px 0 0; font-size:1rem; color:var(--muted); }
.form-card,.success-card { border:1px solid var(--line); background:var(--panel); padding:clamp(22px,4vw,38px); margin:0 0 48px; }
.form-heading { display:flex; justify-content:space-between; align-items:baseline; gap:18px; }
.form-heading h2,.success-card h2 { margin:0; font-size:1.35rem; font-weight:750; letter-spacing:-.02em; }
.form-heading p { margin:6px 0 0; color:var(--muted); }
.required-note,.selection-count { color:var(--muted); font-size:.78rem; white-space:nowrap; }
.field-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:22px; }
.field { display:block; min-width:0; }
.field > span { display:block; margin-bottom:8px; font-size:.82rem; font-weight:650; }
.field span small { margin-left:4px; color:var(--muted); font-weight:400; }
em { font-style:normal; color:var(--volt); }
.field input,.search-box input,.admin-search,select { width:100%; min-width:0; color:var(--text); background:var(--field); border:1px solid #424942; border-radius:3px; padding:12px 13px; outline:none; }
.field input:focus,.search-box:focus-within,.admin-search:focus,select:focus { border-color:var(--volt); outline:1px solid var(--volt); outline-offset:0; }
.field input::placeholder,.search-box input::placeholder,.admin-search::placeholder { color:#818d80; }
.honeypot { position:absolute; left:-9999px; }
.section-divider { height:1px; background:var(--line); margin:32px 0; }
.song-pickers { display:grid; gap:12px; margin-top:20px; }
.song-picker { display:grid; grid-template-columns:30px minmax(0,1fr); gap:16px; padding:19px; border:1px solid #343b33; background:#0e110e; }
.song-number { font-size:1rem; font-weight:800; color:var(--volt); border-top:2px solid var(--volt); padding-top:6px; line-height:1; }
.song-content { min-width:0; }
.song-content h3 { font-size:1rem; margin:0 0 14px; font-weight:700; }
.search-box { display:flex; align-items:center; gap:11px; padding:0 12px; background:var(--field); border:1px solid #424942; border-radius:3px; }
.search-box svg { width:19px; height:19px; stroke:var(--muted); stroke-width:2; fill:none; flex:0 0 auto; }
.search-box input { border:0; padding:12px 0; outline:0!important; background:transparent; }
.search-status,.field-help { min-height:1.35em; margin:8px 0; font-size:.78rem; color:var(--muted); }
.results { display:grid; gap:5px; max-height:360px; overflow-y:auto; }
.track-option,.selected-track { width:100%; display:grid; grid-template-columns:52px minmax(0,1fr) auto; align-items:center; gap:12px; padding:7px; border:1px solid var(--line); border-radius:2px; text-align:left; color:var(--text); background:#191e18; }
.track-option:hover,.track-option:focus-visible { border-color:var(--volt); outline:none; background:#22291e; }
.track-option img,.selected-track img,.mini-track img { width:52px; height:52px; object-fit:cover; background:#293128; }
.track-image { display:block; background:#293128; width:52px; height:52px; }
.track-info { min-width:0; }
.track-info strong,.track-info span { display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.track-info strong { font-size:.87rem; }
.track-info span { font-size:.78rem; color:var(--muted); }
.track-add { color:var(--volt); font-size:.73rem; font-weight:800; padding-right:8px; }
.selected-track { border-color:#9abe21; }
.remove-track { border:0; color:var(--muted); background:transparent; font-size:1.5rem; padding:8px; }
.text-button { display:inline-block; margin-top:3px; border:0; padding:8px 0; background:transparent; color:var(--volt); font-size:.81rem; text-decoration:underline; text-underline-offset:3px; }
.link-fallback { border-top:1px solid var(--line); padding-top:15px; margin-top:6px; }
.link-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:9px; }
.fallback-meta { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:12px; }
.secondary-button,.primary-button { display:inline-flex; align-items:center; justify-content:center; min-height:42px; padding:10px 16px; border-radius:3px; font-size:.82rem; font-weight:750; border:1px solid transparent; text-decoration:none; }
.secondary-button { color:var(--text); background:#242a23; border-color:#424942; }
.secondary-button:hover { background:#30392c; }
.primary-button { color:#0b0e08; background:var(--volt); }
.primary-button:hover { background:#e1ff74; }
.primary-button:disabled { opacity:.5; cursor:not-allowed; }
.submit-row { margin-top:28px; display:flex; justify-content:space-between; align-items:center; gap:18px; }
.submit-row p { margin:0; color:var(--muted); font-size:.79rem; }
.form-message { margin-top:18px; padding:12px 14px; border:1px solid var(--danger); background:#281a19; color:#ffb9b3; font-size:.88rem; }
.success-card { max-width:740px; }
.success-card > p { color:var(--muted); margin:8px 0 0; }
.success-tracks { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:24px; }
.mini-track { display:grid; grid-template-columns:52px minmax(0,1fr); gap:12px; align-items:center; min-width:0; padding:8px; border:1px solid var(--line); }
/* League impact note: editorial, not promotional. */
.club-impact { display:grid; grid-template-columns:125px minmax(0,1fr); gap:18px; margin:-18px 0 46px; padding:23px 0 0; border-top:1px solid var(--line); }
.club-impact h2 { margin:0; color:var(--volt); font-size:.78rem; font-weight:800; letter-spacing:.075em; line-height:1.7; }
.club-impact p { max-width:690px; margin:0; color:var(--muted); font-size:.94rem; line-height:1.7; }
.club-impact strong { color:var(--volt); font-weight:700; }
.club-impact .club-impact-signoff { display:block; margin-top:10px; color:var(--volt); font-weight:700; }
@media(max-width:600px) { .club-impact { grid-template-columns:1fr; gap:7px; margin:-18px 0 34px; } }
/* Small, intentionally understated sign-off */
.league-signoff { width:min(940px,calc(100% - 40px)); margin:0 auto 40px; padding:18px 0 0; border-top:1px solid var(--line); color:#a9b1a7; font-size:clamp(.92rem,2.5vw,1.05rem); line-height:1.5; }
.league-signoff p { margin:0; letter-spacing:-.012em; }
.league-signoff span { display:block; margin-top:4px; font-size:.89em; }
.league-signoff strong { color:var(--volt); font-weight:650; }
footer { border-top:1px solid var(--line); padding:22px 0 36px; color:#879184; font-size:.77rem; }
.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; }
/* Organizer */
.admin-main { width:min(1180px,calc(100% - 40px)); padding-top:44px; padding-bottom:80px; }
.login-card { max-width:450px; margin:22px auto 0; }
.login-card h1 { font-size:1.7rem; margin:0 0 6px; letter-spacing:-.025em; }
.login-help { color:var(--muted); margin:0 0 22px; }
.login-card .field { margin-bottom:16px; }
.dashboard { display:grid; gap:20px; }
.admin-hero { display:flex; justify-content:space-between; align-items:end; gap:18px; }
.admin-hero h1 { font-size:clamp(1.8rem,4vw,2.65rem); }
.admin-actions { display:flex; flex-wrap:wrap; gap:8px; }
.stat-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:0; border:1px solid var(--line); }
.stat { min-width:0; padding:16px 18px; border-right:1px solid var(--line); }
.stat:last-child { border-right:0; }
.stat span { display:block; color:var(--muted); font-size:.77rem; }
.stat strong { display:block; font-size:1.7rem; margin-top:4px; font-weight:700; }
.stat.duplicate strong { color:var(--text); }
.toolbar { display:grid; grid-template-columns:1fr 190px; gap:8px; }
.table-wrap { border:1px solid var(--line); overflow:auto; }
table { border-collapse:collapse; width:100%; min-width:860px; }
th,td { padding:12px 14px; text-align:left; vertical-align:top; border-bottom:1px solid var(--line); }
th { position:sticky; top:0; background:#1b1e1a; color:var(--muted); font-size:.73rem; font-weight:700; }
td { font-size:.83rem; }
.player-name { font-weight:700; }
.team-name,.date-text { color:var(--muted); font-size:.75rem; }
.table-track { max-width:250px; min-width:0; display:flex; align-items:center; gap:9px; }
.table-track img { width:42px; height:42px; object-fit:cover; }
.table-track span { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.table-track small { display:block; color:var(--muted); }
.duplicate-badge { display:inline-block; font-size:.69rem; padding:1px 4px; border:1px solid #839e38; color:var(--volt); margin-left:6px; }
.status-select { min-width:110px; padding:8px; }
.qr-dialog { max-width:95vw; background:var(--panel); color:var(--text); border:1px solid var(--line); padding:28px; text-align:center; }
.qr-dialog::backdrop { background:rgba(0,0,0,.76); }
.qr-dialog h2 { margin:0 0 16px; }
#qr-canvas { background:white; padding:10px; max-width:100%; height:auto; }
#player-url { max-width:320px; overflow-wrap:anywhere; font-size:.75rem; color:var(--muted); }
.dialog-actions { display:flex; justify-content:center; gap:8px; margin-top:15px; }
@media(max-width:760px) {
 .site-header { min-height:76px; }
 .league-signoff { margin-bottom:30px; }
 .brand-logo { width:48px; height:48px; }
 .hero { padding:32px 0 22px; }
 .field-grid,.fallback-meta,.success-tracks { grid-template-columns:1fr; }
 .form-heading { align-items:flex-start; }
 .song-picker { padding:14px; grid-template-columns:22px minmax(0,1fr); gap:12px; }
 .submit-row,.admin-hero { align-items:stretch; flex-direction:column; }
 .submit-row .primary-button { width:100%; }
 .link-row { grid-template-columns:1fr; }
 .stat-grid { grid-template-columns:1fr 1fr; }
 .stat:nth-child(2) { border-right:0; }
 .stat:nth-child(-n+2) { border-bottom:1px solid var(--line); }
 .toolbar { grid-template-columns:1fr; }
 .admin-main { padding-top:24px; }
}
@media(max-width:380px) { .site-header,main,footer,.league-signoff { width:calc(100% - 24px); } .admin-main { width:calc(100% - 24px); } .form-card { padding:16px; } }
@media(prefers-reduced-motion:reduce) { html {scroll-behavior:auto;} }



/* Full-screen, compositor-friendly kinetic confirmation. The club's volt remains primary;
   cyan/coral are motion accents, not alternate brand colors. No looping strobe. */
body.splash-open { overflow:hidden; }
.submission-splash {
  position:fixed; inset:0; width:100vw; height:100vh; height:100dvh; z-index:1000;
  isolation:isolate; overflow:hidden; background:#080a09; color:#f1f3ef;
}
.submission-splash[hidden] { display:none!important; }
.fc-stage {position:absolute;inset:0; overflow:hidden; background:#080a09;}
.fc-stage-grid {
  position:absolute;inset:0; opacity:.32; pointer-events:none;
  background-image:linear-gradient(to right,rgba(201,220,203,.085) 1px,transparent 1px),linear-gradient(to bottom,rgba(201,220,203,.085) 1px,transparent 1px);
  background-size:clamp(45px,7vw,115px) clamp(45px,7vw,115px);
}
.fc-topline,.fc-bottomline {
  position:absolute; left:max(24px,4.3vw);right:max(24px,4.3vw);
  display:flex;justify-content:space-between;gap:20px;align-items:center;
  font-size:clamp(.58rem,.9vw,.79rem);font-weight:750;letter-spacing:.16em;color:#a0aaa2;
}
.fc-topline {top:max(21px,env(safe-area-inset-top));}
.fc-bottomline {bottom:max(22px,env(safe-area-inset-bottom));}
.fc-kinetic {position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;overflow:hidden;}
.fc-kinetic-line {
  position:absolute; white-space:nowrap; display:block; text-align:center;
  font:900 clamp(5.5rem,17vw,25rem)/.77 Impact,'Arial Narrow',Arial,sans-serif;
  letter-spacing:-.075em; transform:translate3d(110vw,0,0) skewX(-7deg);opacity:0;
  will-change:transform,opacity; backface-visibility:hidden;
}
.fc-kinetic-line--cyan {color:#6ee0e5;animation:fc-slide-cyan 1.42s .05s both cubic-bezier(.13,.74,.19,1);}
.fc-kinetic-line--coral {color:#ff927a;animation:fc-slide-coral 1.38s .34s both cubic-bezier(.13,.74,.19,1);}
.fc-kinetic-line--volt {color:#ccff00;animation:fc-slide-volt 1.5s .66s both cubic-bezier(.13,.74,.19,1);}
.fc-kinetic-line--white {color:#f5f5ef;animation:fc-slide-white 1.65s 1.02s both cubic-bezier(.13,.74,.19,1);}
@keyframes fc-slide-cyan {0%{transform:translate3d(110vw,-10vh,0) skewX(-7deg);opacity:0}18%{opacity:1}60%{transform:translate3d(-6vw,-10vh,0) skewX(-7deg);opacity:1}100%{transform:translate3d(-115vw,-10vh,0) skewX(-7deg);opacity:0}}
@keyframes fc-slide-coral {0%{transform:translate3d(-110vw,11vh,0) skewX(6deg);opacity:0}22%{opacity:1}57%{transform:translate3d(3vw,11vh,0) skewX(6deg);opacity:1}100%{transform:translate3d(115vw,11vh,0) skewX(6deg);opacity:0}}
@keyframes fc-slide-volt {0%{transform:translate3d(110vw,0,0) skewX(-6deg);opacity:0}22%{opacity:1}57%{transform:translate3d(1vw,0,0) skewX(-6deg);opacity:1}100%{transform:translate3d(-115vw,0,0) skewX(-6deg);opacity:0}}
@keyframes fc-slide-white {0%{transform:translate3d(-110vw,0,0) skewX(5deg);opacity:0}22%{opacity:1}55%{transform:translate3d(0,0,0) skewX(0);opacity:1}100%{transform:translate3d(0,0,0) skewX(0);opacity:0}}
.fc-final {position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:clamp(22px,5.5vw,120px);padding:clamp(40px,7vw,110px);opacity:0;transform:translate3d(0,22px,0);pointer-events:none;will-change:transform,opacity;}
.submission-splash.is-visible .fc-final {animation:fc-final-enter 1.15s 2.36s both cubic-bezier(.16,1,.3,1);}
@keyframes fc-final-enter {from{opacity:0;transform:translate3d(0,22px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
.fc-crest-wrap {position:relative;flex:0 0 auto;width:clamp(145px,23vw,380px);aspect-ratio:1;display:grid;place-items:center;}
.fc-crest-rail {position:absolute;inset:5%;border:1px solid rgba(204,255,0,.45);border-radius:50%;transform:scale(.62);opacity:0;}
.submission-splash.is-visible .fc-crest-rail {animation:fc-crest-rail 1.2s 2.45s both cubic-bezier(.16,1,.3,1);}
@keyframes fc-crest-rail {0%{transform:scale(.62);opacity:0}35%{opacity:.55}100%{transform:scale(1);opacity:0}}
.fc-crest {width:80%;height:90%;object-fit:contain;transform:translate3d(-18px,0,0) scale(.76) rotate(-5deg);opacity:0;will-change:transform,opacity;}
.submission-splash.is-visible .fc-crest {animation:fc-bird-arrive 1.35s 2.46s both cubic-bezier(.16,1,.3,1);}
@keyframes fc-bird-arrive {0%{transform:translate3d(-18px,0,0) scale(.76) rotate(-5deg);opacity:0}45%{opacity:1}100%{transform:translate3d(0,0,0) scale(1) rotate(0);opacity:1}}
.fc-message {min-width:0;max-width:760px;}
.fc-label {display:flex;align-items:center;gap:11px;color:#9caba3;font-size:clamp(.66rem,1vw,.87rem);font-weight:800;letter-spacing:.17em;margin-bottom:clamp(20px,4vh,42px);}
.fc-label-dot {display:block;width:7px;height:7px;background:#6ee0e5;transform:rotate(45deg);}
.fc-thanks {display:flex;flex-direction:column;font:900 clamp(5.6rem,11.3vw,11.8rem)/.79 Impact,'Arial Narrow',Arial,sans-serif;letter-spacing:-.045em;}
.fc-thanks span:first-child {color:#f3f4ed;}
.fc-thanks span:last-child {color:#ccff00;}
.fc-confirm {font-weight:900;letter-spacing:.10em;color:#6ee0e5;margin-top:clamp(18px,4vh,37px);font-size:clamp(.8rem,1.6vw,1.3rem);}
.fc-see-you {font-weight:700;letter-spacing:.10em;color:#c4cec1;font-size:clamp(.7rem,1.25vw,1rem);margin-top:5px;}
.fc-corner-marks {position:absolute;top:0;bottom:0;left:0;display:flex;gap:7px;align-items:flex-end;padding:0 0 0 0;pointer-events:none;}
.fc-corner-marks i {display:block;width:clamp(3px,.45vw,7px);height:clamp(100px,19vh,210px);transform:translateY(110%);will-change:transform;}
.fc-corner-marks i:nth-child(1) {background:#6ee0e5;}
.fc-corner-marks i:nth-child(2) {background:#ccff00;}
.fc-corner-marks i:nth-child(3) {background:#ff927a;}
.submission-splash.is-visible .fc-corner-marks i:nth-child(1) {animation:fc-bar .8s 1.7s both cubic-bezier(.16,1,.3,1);}
.submission-splash.is-visible .fc-corner-marks i:nth-child(2) {animation:fc-bar .8s 1.82s both cubic-bezier(.16,1,.3,1);}
.submission-splash.is-visible .fc-corner-marks i:nth-child(3) {animation:fc-bar .8s 1.94s both cubic-bezier(.16,1,.3,1);}
@keyframes fc-bar {to{transform:translateY(0)}}
.splash-close {position:absolute;z-index:5;bottom:max(18px,env(safe-area-inset-bottom));right:max(20px,4.3vw);border:1px solid #6b776e;border-radius:0;background:#121714;color:#f1f3ef;min-height:45px;padding:11px 17px;font-size:.76rem;font-weight:800;letter-spacing:.065em;cursor:pointer;}
.splash-close span{color:#ccff00;margin-left:11px;}
.splash-close:hover,.splash-close:focus-visible {outline:2px solid #ccff00;outline-offset:3px;}
@media(max-width:720px) {
  .fc-topline,.fc-bottomline {left:18px;right:18px;gap:12px;letter-spacing:.075em;font-size:.59rem;}
  .fc-topline span:last-child {display:none;}
  .fc-final {flex-direction:column;gap:clamp(5px,2.5vh,20px);padding:52px 22px 110px;text-align:center;}
  .fc-crest-wrap {width:clamp(145px,39vw,225px);}
  .fc-label {justify-content:center;margin-bottom:22px;}
  .fc-thanks {font-size:clamp(5.9rem,20vw,9.5rem);}
  .fc-confirm {margin-top:26px;}
  .fc-kinetic-line {font-size:clamp(5.5rem,24vw,14rem);}
  .splash-close {right:18px;bottom:max(42px,env(safe-area-inset-bottom));}
  .fc-bottomline {bottom:max(14px,env(safe-area-inset-bottom));font-size:.53rem;}
}
@media(max-width:380px){ .fc-crest-wrap {width:130px;} .fc-thanks {font-size:clamp(5.1rem,19vw,6.3rem);} }
@media(prefers-reduced-motion:reduce) {
  .submission-splash *, .submission-splash *::before, .submission-splash *::after {animation:none!important;transition:none!important;}
  .fc-kinetic {display:none;}
  .fc-final {opacity:1!important;transform:none!important;}
  .fc-crest {opacity:1!important;transform:none!important;}
  .fc-crest-rail{display:none;}
  .fc-corner-marks i{transform:translateY(0)!important;}
}