/* Nerts Scorekeeper styles. Retro-neon arcade theme; mobile-first, single column. */
  :root{
    --bg:#0a0612; --bg2:#140a24; --panel:#1a0f2e; --panel2:#241540;
    --cyan:#00f0ff; --magenta:#ff2bd6; --yellow:#ffe600; --green:#39ff14; --orange:#ff7b00;
    --red:#ff2d55; --txt:#eafcff; --dim:#8b7bb5; --line:#3a2a5e;
    --arcade:'Press Start 2P',monospace; --head:'Orbitron',sans-serif; --body:'Rajdhani',sans-serif;
  }
  *{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}
  html,body{height:100%}
  body{
    background:
      radial-gradient(circle at 20% 0%,rgba(255,43,214,.18),transparent 45%),
      radial-gradient(circle at 90% 15%,rgba(0,240,255,.15),transparent 40%),
      var(--bg);
    color:var(--txt); font-family:var(--body); overflow:hidden; background-attachment:fixed;
  }
  body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:9999;
    background:repeating-linear-gradient(0deg,rgba(0,0,0,.18) 0 1px,transparent 1px 3px);opacity:.35;mix-blend-mode:multiply}
  #app{max-width:480px;margin:0 auto;height:100dvh;display:flex;flex-direction:column;position:relative}
  .topbar{display:flex;align-items:center;justify-content:space-between;padding:14px 16px 10px;border-bottom:1px solid var(--line)}
  .brand{font-family:var(--arcade);font-size:13px;letter-spacing:1px;color:var(--cyan);text-shadow:0 0 8px var(--cyan),0 0 18px rgba(0,240,255,.5)}
  .brand b{color:var(--magenta);text-shadow:0 0 8px var(--magenta)}
  .topright{display:flex;align-items:center;gap:10px}
  .gear{font-size:20px;cursor:pointer;opacity:.8}
  .j5{font-family:var(--arcade);font-size:9px;color:var(--yellow);border:1px solid var(--yellow);padding:4px 6px;border-radius:6px;text-shadow:0 0 6px var(--yellow);box-shadow:0 0 10px rgba(255,230,0,.25)}
  .view{flex:1;overflow-y:auto;padding:18px 16px 96px;display:none;-webkit-overflow-scrolling:touch}
  .view.active{display:block;animation:fade .25s ease}
  @keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
  h1{font-family:var(--head);font-weight:900;font-size:26px;letter-spacing:1px;margin-bottom:4px}
  h2{font-family:var(--head);font-weight:700;font-size:16px;letter-spacing:1px;color:var(--cyan);text-transform:uppercase;margin:22px 0 10px;text-shadow:0 0 8px rgba(0,240,255,.4)}
  .sub{color:var(--dim);font-size:15px;margin-bottom:14px}
  .btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;font-family:var(--head);font-weight:700;letter-spacing:1px;text-transform:uppercase;font-size:15px;padding:16px;border-radius:14px;border:none;cursor:pointer;background:linear-gradient(135deg,var(--magenta),#b800a8);color:#fff;box-shadow:0 0 18px rgba(255,43,214,.5);transition:transform .1s,box-shadow .2s}
  .btn:active{transform:scale(.97)}
  .btn.cyan{background:linear-gradient(135deg,var(--cyan),#0090a8);box-shadow:0 0 18px rgba(0,240,255,.5);color:#021015}
  .btn.green{background:linear-gradient(135deg,var(--green),#1faa00);box-shadow:0 0 18px rgba(57,255,20,.45);color:#031300}
  .btn.ghost{background:transparent;border:1.5px solid var(--line);color:var(--txt);box-shadow:none}
  .btn.sm{font-size:12px;padding:10px 12px;width:auto;border-radius:10px}
  .row{display:flex;gap:10px}
  .row .btn{flex:1}
  .menu-btn{margin-bottom:12px;text-align:left;justify-content:flex-start;font-size:17px;padding:20px}
  .card{background:linear-gradient(160deg,var(--panel),var(--bg2));border:1px solid var(--line);border-radius:16px;padding:16px;margin-bottom:12px}
  .card.tight{padding:12px}  /* tighter padding for explainer / info cards */
  .pill{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:700;padding:3px 8px;border-radius:20px;border:1px solid var(--line);color:var(--dim)}
  .pill.flip{color:var(--cyan);border-color:var(--cyan)}
  .pill.nerts{color:var(--magenta);border-color:var(--magenta)}
  .av{border-radius:12px;display:flex;align-items:center;justify-content:center;flex:0 0 auto;border:2px solid #fff3;overflow:hidden}
  .av img{width:100%;height:100%;object-fit:cover}
  input,select{font-family:var(--body);font-size:17px;font-weight:600;color:var(--txt);background:var(--panel2);border:1.5px solid var(--line);border-radius:12px;padding:13px 14px;width:100%}
  input:focus,select:focus{outline:none;border-color:var(--cyan);box-shadow:0 0 12px rgba(0,240,255,.3)}
  label{display:block;font-size:13px;font-weight:700;color:var(--dim);text-transform:uppercase;letter-spacing:1px;margin:14px 0 6px}
  .chip{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:12px;border:1.5px solid var(--line);background:var(--panel);margin-bottom:8px;cursor:pointer}
  .chip.on{border-color:var(--green);box-shadow:0 0 12px rgba(57,255,20,.3);background:var(--panel2)}
  .chip .nm{font-size:17px;font-weight:600;flex:1}
  .chk{width:24px;height:24px;border-radius:7px;border:2px solid var(--line);flex:0 0 auto;display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--green)}
  .score-row{display:flex;align-items:center;gap:12px;padding:14px;border-radius:14px;background:linear-gradient(160deg,var(--panel),var(--bg2));border:1px solid var(--line);margin-bottom:10px;position:relative;overflow:hidden}
  .score-row.lead{border-color:var(--yellow);box-shadow:0 0 16px rgba(255,230,0,.25)}
  .score-row.win{border-color:var(--green);box-shadow:0 0 22px rgba(57,255,20,.5)}
  .score-row .who{flex:1;min-width:0}
  .score-row .tn{font-size:17px;font-weight:700;font-family:var(--head);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .score-row .meta{font-size:12px;color:var(--dim);margin-top:3px;display:flex;gap:5px;flex-wrap:wrap}
  .score-row .total{font-family:var(--head);font-weight:900;font-size:30px;min-width:58px;text-align:right}
  .bar{position:absolute;left:0;bottom:0;height:3px;background:var(--cyan);box-shadow:0 0 8px var(--cyan);transition:width .5s}
  .rank{font-family:var(--arcade);font-size:11px;color:var(--dim);width:16px;text-align:center}
  .entry{margin-bottom:14px;padding:14px;border-radius:14px;background:var(--panel);border:1px solid var(--line)}
  .entry .hd{display:flex;align-items:center;gap:10px;margin-bottom:10px}
  .entry .hd .tn{font-size:16px;font-weight:700;flex:1;font-family:var(--head)}
  /* ---- round-entry keypad ---- */
  .kp-teams{display:grid;grid-template-columns:repeat(var(--kp-cols,3),1fr);gap:8px;margin-bottom:12px}
  .kp-card{background:var(--panel);border:1.5px solid var(--line);border-radius:14px;padding:9px 4px 7px;text-align:center;cursor:pointer;position:relative;transition:all .15s;min-width:0}
  .kp-card.active{border-color:var(--cyan);box-shadow:0 0 14px rgba(0,240,255,.4);background:var(--panel2)}
  .kp-card.done:not(.active){border-color:var(--green)}
  .kp-card .avs{display:flex;justify-content:center;gap:3px}
  .kp-card .nm{font-family:var(--head);font-weight:700;font-size:10px;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 2px}
  .kp-card .sc{font-family:var(--head);font-weight:900;font-size:20px;margin-top:1px;color:var(--dim)}
  .kp-card.touched .sc{color:var(--txt)}
  .kp-card .sc.neg{color:var(--red)!important}
  .kp-card .sc.pos{color:var(--green)!important}
  .kp-card .badge{position:absolute;top:-9px;right:-5px;font-size:15px;filter:drop-shadow(0 0 5px var(--yellow));display:none}
  .kp-card.caller .badge{display:block}
  .kp-card .run{font-size:10px;color:var(--dim);margin-top:1px}
  .kp-readout{display:flex;align-items:center;justify-content:center;background:var(--panel);border:1.5px solid var(--line);border-radius:14px;padding:8px 12px;margin-bottom:12px;min-height:60px}
  .kp-readout .val{font-family:var(--head);font-weight:900;font-size:38px;line-height:1;text-align:center}
  .kp-readout .val.neg{color:var(--red);text-shadow:0 0 12px rgba(255,45,85,.5)}
  .kp-readout .val.pos{color:var(--green);text-shadow:0 0 12px rgba(57,255,20,.4)}
  .kp-readout .cursor{display:inline-block;width:3px;height:32px;background:var(--cyan);margin-left:2px;animation:kpblink 1s step-end infinite;vertical-align:-3px}
  @keyframes kpblink{50%{opacity:0}}
  #kp-roles .rolepick{margin:0 0 12px}
  .kpad{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;user-select:none;-webkit-user-select:none}
  .kkey{height:54px;border-radius:14px;border:1.5px solid var(--line);background:var(--panel2);color:var(--txt);font-family:var(--head);font-weight:700;font-size:22px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .06s}
  .kkey:active{transform:scale(.92);background:var(--panel)}
  .kkey.fn{font-size:17px}
  .kkey.minus{font-size:20px;color:var(--red);border-color:rgba(255,45,85,.5)}
  .kkey.minus.on{background:rgba(255,45,85,.18);box-shadow:0 0 12px rgba(255,45,85,.4);border-color:var(--red)}
  .kkey.nerts{color:var(--yellow);border-color:rgba(255,230,0,.5);font-size:13px;flex-direction:column;gap:1px}
  .kkey.nerts small{font-size:8px;letter-spacing:1px;color:var(--dim)}
  .kkey.nerts.on{background:rgba(255,230,0,.15);box-shadow:0 0 12px rgba(255,230,0,.4);border-color:var(--yellow)}
  .kkey.next{grid-row:span 2;height:auto;background:linear-gradient(135deg,var(--cyan),#0090a8);color:#021015;box-shadow:0 0 16px rgba(0,240,255,.45);border:none;font-size:15px;flex-direction:column;gap:2px}
  .kkey.next small{font-size:9px;letter-spacing:1px;opacity:.75;max-width:76px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .kkey.next.save{background:linear-gradient(135deg,var(--green),#1faa00);box-shadow:0 0 18px rgba(57,255,20,.5);animation:kppulse 1.2s ease infinite}
  @keyframes kppulse{50%{box-shadow:0 0 30px rgba(57,255,20,.8)}}
  .rolepick{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
  .rolepick .rp{flex:1 1 45%;min-width:0;display:flex;align-items:center;justify-content:center;gap:6px;padding:9px;border-radius:10px;border:1.5px solid var(--line);font-size:13px;font-weight:700;color:var(--dim);cursor:pointer}
  .rolepick .rp .who{font-family:var(--body)}
  .rolepick .rp.nerts{color:var(--magenta);border-color:var(--magenta);background:rgba(255,43,214,.12);box-shadow:0 0 10px rgba(255,43,214,.25)}
  .rolepick .rp.flip{color:var(--cyan);border-color:var(--line);opacity:.8}
  .rolelabel{font-size:11px;text-transform:uppercase;letter-spacing:.5px;font-weight:800}
  .nerts-call{display:flex;align-items:center;gap:8px;margin-top:12px;font-size:14px}
  .callbox{width:22px;height:22px;border-radius:50%;border:2px solid var(--yellow);cursor:pointer;flex:0 0 auto;transition:.15s}
  .callbox.on{background:var(--yellow);box-shadow:0 0 10px var(--yellow)}
  .req{color:var(--red);font-weight:700}
  .stat-grid{display:flex;flex-direction:column;gap:10px}
  .stat{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:14px 16px}
  .stat .hcat{font-family:var(--head);font-weight:900;font-size:17px;color:var(--cyan);text-shadow:0 0 8px rgba(0,240,255,.25);line-height:1.15}
  .stat .hname{font-size:16px;color:var(--txt);font-weight:700;margin-top:7px}
  .stat .hstat{font-size:14px;color:var(--txt);margin-top:4px}
  .stat .tietag{font-family:var(--head);font-size:10px;font-weight:800;color:var(--bg);background:var(--yellow);border-radius:5px;padding:2px 7px;margin-left:8px;letter-spacing:.5px;vertical-align:middle;text-transform:uppercase}
  .empty{text-align:center;color:var(--dim);padding:40px 20px;font-size:15px}
  .empty .big{font-size:40px;margin-bottom:10px}
  .nav{position:absolute;bottom:0;left:0;right:0;display:flex;background:rgba(10,6,18,.92);border-top:1px solid var(--line);backdrop-filter:blur(8px)}
  .nav button{flex:1;background:none;border:none;color:var(--dim);padding:10px 0 14px;font-family:var(--head);font-size:10px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;cursor:pointer}
  .nav button .ic{display:block;font-size:20px;margin-bottom:3px}
  .nav button.on{color:var(--cyan);text-shadow:0 0 8px var(--cyan)}
  .sheet-bg{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:100;display:none;align-items:flex-end}
  .sheet-bg.on{display:flex;animation:fade .2s}
  .sheet{background:linear-gradient(180deg,var(--bg2),var(--bg));width:100%;max-width:480px;margin:0 auto;border-radius:22px 22px 0 0;border-top:2px solid var(--magenta);box-shadow:0 0 40px rgba(255,43,214,.4);padding:18px 16px calc(18px + env(safe-area-inset-bottom));max-height:92dvh;overflow-y:auto;animation:slideup .28s ease}
  @keyframes slideup{from{transform:translateY(100%)}to{transform:none}}
  .sheet h2{margin-top:0}
  .small{font-size:13px;color:var(--dim)}
  .toast{position:fixed;bottom:90px;left:50%;transform:translateX(-50%);background:var(--panel2);border:1px solid var(--cyan);color:var(--txt);padding:12px 18px;border-radius:12px;z-index:200;font-weight:600;box-shadow:0 0 20px rgba(0,240,255,.4);display:none;max-width:90%;text-align:center}
  .avpick{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
  .avpick span{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:20px;background:var(--panel2);border:2px solid transparent;cursor:pointer}
  .avpick span.on{border-color:var(--cyan);box-shadow:0 0 10px var(--cyan)}
  .colorpick{display:flex;gap:10px;margin-top:6px;flex-wrap:wrap}
  .colorpick span{width:34px;height:34px;border-radius:50%;cursor:pointer;border:2px solid #fff2}
  .colorpick span.on{border-color:#fff;transform:scale(1.15)}
  .listitem{display:flex;align-items:center;gap:12px;padding:12px;border-radius:12px;background:var(--panel);border:1px solid var(--line);margin-bottom:8px}
  .listitem .nm{flex:1;font-size:17px;font-weight:600}
  .iconbtn{font-size:16px;cursor:pointer;padding:6px 8px;border-radius:8px;border:1px solid var(--line);background:var(--panel2)}
  .iconbtn.danger,.btn.danger{border-color:var(--red);color:var(--red)}  /* red delete affordance */
  .winner-banner{text-align:center;padding:18px;border-radius:16px;margin-bottom:14px;background:linear-gradient(135deg,rgba(57,255,20,.2),rgba(255,230,0,.15));border:2px solid var(--green);box-shadow:0 0 30px rgba(57,255,20,.4)}
  .winner-banner .t{font-family:var(--arcade);font-size:13px;color:var(--yellow);text-shadow:0 0 10px var(--yellow)}
  .winner-banner .n{font-family:var(--head);font-weight:900;font-size:22px;margin-top:8px;color:var(--green)}
  .goalbar{height:6px;background:var(--panel2);border-radius:6px;overflow:hidden;margin:4px 0 16px}
  /* In-game scoring view: fill the viewport, scale team rows to team count, collapsible log */
  #v-game.active{display:flex;flex-direction:column;overflow:hidden;padding:14px 16px 72px}
  #v-game #winner-zone{flex:0 0 auto}
  #v-game #winner-zone:empty{display:none}
  #v-game .game-head{flex:0 0 auto}
  #v-game .game-head h1{margin:0 0 2px}
  #v-game .game-head .sub{margin:0 0 6px}
  #v-game .goalbar{margin:2px 0 10px}
  #v-game #scoreboard{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;gap:8px;overflow-y:auto;margin:0}
  #v-game #scoreboard .score-row{flex:1 1 0;min-height:52px;margin:0}
  #v-game .game-actions{flex:0 0 auto;margin-top:8px}
  #v-game .round-log-wrap{flex:0 1 auto;display:flex;flex-direction:column;min-height:0;margin-top:10px}
  #v-game .log-toggle{flex:0 0 auto;background:none;border:1px solid var(--line);color:var(--dim);font-family:var(--head);font-weight:700;font-size:12px;letter-spacing:.5px;text-transform:uppercase;padding:9px 12px;border-radius:10px;cursor:pointer;display:flex;justify-content:space-between;align-items:center}
  #v-game #round-log{overflow-y:auto;min-height:0;max-height:40vh;margin-top:8px}
  #v-game #round-log.collapsed{display:none}
  /* Stats filter */
  .filterbar{display:flex;align-items:center;gap:10px;margin:2px 0 14px}
  #filter-btn.active{border-color:var(--cyan);color:var(--cyan);box-shadow:0 0 10px rgba(0,240,255,.25)}
  .seg{display:flex;gap:6px}
  .seg button{flex:1;padding:9px 0;border-radius:10px;border:1px solid var(--line);background:none;color:var(--dim);font-family:var(--head);font-weight:700;font-size:12px;letter-spacing:.5px;cursor:pointer}
  .seg button.on{background:var(--cyan);color:#001018;border-color:var(--cyan);box-shadow:0 0 10px rgba(0,240,255,.35)}
  .fchips{display:flex;flex-wrap:wrap;gap:8px}
  .fchip{display:inline-flex;align-items:center;gap:7px;padding:7px 11px;border-radius:20px;border:1px solid var(--line);background:none;color:var(--dim);cursor:pointer;font-size:13px;font-family:var(--body)}
  .fchip.on{border-color:var(--green);color:var(--txt);box-shadow:0 0 8px rgba(57,255,20,.25)}
  .fchip .dot{width:9px;height:9px;border-radius:50%;display:inline-block;flex:none}
  input[type=date]{color-scheme:dark}
  .goalbar i{display:block;height:100%;background:linear-gradient(90deg,var(--cyan),var(--magenta))}
  .roundlog{font-size:13px;color:var(--dim);margin-bottom:6px}
  .speak-toggle{display:flex;align-items:center;justify-content:space-between;padding:12px;background:var(--panel);border:1px solid var(--line);border-radius:12px;margin-bottom:10px}
  .switch{width:50px;height:28px;border-radius:20px;background:var(--panel2);border:1px solid var(--line);position:relative;cursor:pointer;flex:0 0 auto}
  .switch i{position:absolute;top:2px;left:2px;width:22px;height:22px;border-radius:50%;background:var(--dim);transition:.2s}
  .switch.on{background:rgba(57,255,20,.3);border-color:var(--green)}
  .switch.on i{left:24px;background:var(--green);box-shadow:0 0 8px var(--green)}
  .photo-prev{width:84px;height:84px;border-radius:18px;border:2px solid var(--line);overflow:hidden;display:flex;align-items:center;justify-content:center;font-size:40px;background:var(--panel2)}
  .photo-prev img{width:100%;height:100%;object-fit:cover}
  .assign-row{display:flex;align-items:center;gap:10px;margin-bottom:8px}
  .warpill{font-family:var(--head);font-weight:900;font-size:13px;color:var(--green)}
  #login{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;padding:24px;background:radial-gradient(circle at 30% 0%,rgba(255,43,214,.18),transparent 45%),radial-gradient(circle at 90% 20%,rgba(0,240,255,.15),transparent 40%),var(--bg)}
  .login-box{width:100%;max-width:340px;text-align:center;background:linear-gradient(160deg,var(--panel),var(--bg2));border:1px solid var(--line);border-radius:18px;padding:28px 22px}
  .login-box input{text-align:center;letter-spacing:2px}