@import url('https://fonts.googleapis.com/css2?family=VT323&family=IBM+Plex+Mono:wght@400;500;600;700&display=swap');
:root{
  --bg:#050705; --panel:#0A100A; --line:#1E2E1E; --white:#EAF0EA; --dim:#7C8C7C;
  --yellow:#FFD400; --cyan:#3FE0E0; --green:#33D17A; --red:#FF4136; --amber:#FF9F45; --gold:#FFC94A;
}
*{box-sizing:border-box;}
html,body{margin:0;background:var(--bg);}
body{font-family:'IBM Plex Mono',monospace;color:var(--white);font-size:14px;min-height:100vh;}
.tv{max-width:640px;margin:0 auto;border:1px solid var(--line);min-height:100vh;}
.topbar{padding:14px 16px;border-bottom:2px solid var(--line);font-family:'VT323',monospace;font-size:26px;color:var(--yellow);letter-spacing:2px;}
.content{padding:16px;}
h1.hd{font-family:'VT323',monospace;font-size:26px;color:var(--yellow);margin:0 0 10px;}
.panel{border:1px solid var(--line);background:var(--panel);margin-bottom:16px;}
.panelhead{padding:8px 14px;border-bottom:1px solid var(--line);font-size:11px;letter-spacing:1.5px;color:var(--cyan);text-transform:uppercase;}
.panelbody{padding:14px;}
label{display:block;font-size:11px;color:var(--dim);margin-bottom:4px;}
input[type=text],input[type=password],input[type=number]{
  background:#000;border:1px solid var(--line);color:var(--white);font-family:'IBM Plex Mono',monospace;
  font-size:14px;padding:8px;width:100%;
}
button{
  background:var(--cyan);color:#000;border:none;font-family:'IBM Plex Mono',monospace;font-weight:700;
  padding:10px 16px;cursor:pointer;font-size:13px;width:100%;margin-top:8px;
}
button:disabled{background:var(--line);color:var(--dim);cursor:not-allowed;}
.fixrow{border-bottom:1px solid var(--line);padding:10px 0;}
.fixrow:last-child{border-bottom:none;}
.fixname{font-size:13px;margin-bottom:6px;}
.scoreinputs{display:flex;align-items:center;gap:8px;}
.scoreinputs input{width:56px;text-align:center;}
.confwrap{display:flex;align-items:center;gap:6px;margin-left:auto;font-size:11px;color:var(--dim);}
.locked{color:var(--dim);font-size:12px;font-style:italic;}
table{width:100%;border-collapse:collapse;font-size:12.5px;}
th{text-align:left;color:var(--dim);font-size:10.5px;text-transform:uppercase;padding:6px;border-bottom:1px solid var(--line);}
td{padding:6px;border-bottom:1px solid var(--line);}
tr.me{background:rgba(63,224,224,.08);color:var(--cyan);}
.err{color:var(--red);font-size:12px;margin-top:6px;}
.savedmsg{color:var(--green);font-size:12px;margin-top:6px;}
.tabbar{display:flex;border-bottom:2px solid var(--line);flex-wrap:wrap;}
.tabbar button{width:auto;flex:1;background:transparent;color:var(--dim);border-radius:0;margin:0;padding:10px;font-size:12px;min-width:70px;}
.tabbar button.active{color:var(--yellow);border-bottom:2px solid var(--yellow);}
.logoutbar{text-align:right;padding:6px 16px;font-size:11px;color:var(--dim);}
.logoutbar a{color:var(--cyan);cursor:pointer;}
.versionBadge{font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--dim);letter-spacing:0;text-transform:none;margin-left:8px;vertical-align:middle;}
.kpigrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:16px;}
.kpi{background:var(--panel);padding:10px 12px;}
.kpi .label{font-size:10px;color:var(--dim);text-transform:uppercase;letter-spacing:.5px;}
.kpi .value{font-family:'VT323',monospace;font-size:28px;line-height:1.1;margin-top:2px;}
.kpi .value.yellow{color:var(--yellow);} .kpi .value.cyan{color:var(--cyan);} .kpi .value.green{color:var(--green);}
.kpi .value.red{color:var(--red);} .kpi .value.gold{color:var(--gold);} .kpi .value.amber{color:var(--amber);}
.kpi .foot{font-size:10px;color:var(--dim);margin-top:2px;}
.tag{display:inline-block;padding:1px 6px;font-size:10px;border-radius:2px;}
.tag.exact{background:rgba(51,209,122,.18);color:var(--green);}
.tag.result{background:rgba(79,168,255,.18);color:#4FA8FF;}
.tag.miss{background:rgba(255,65,54,.14);color:#ff8a80;}
.tag.postponed{background:rgba(255,159,69,.16);color:var(--amber);}
select{background:#000;border:1px solid var(--line);color:var(--white);font-family:'IBM Plex Mono',monospace;font-size:13px;padding:6px;width:100%;margin-bottom:10px;}
.strip{display:flex;flex-wrap:wrap;gap:3px;margin:12px 0;}
.blk{width:14px;height:20px;border-radius:1px;}
.blk.past{background:#1E2E1E;}
.blk.available{background:var(--green);}
.blk.approaching{background:var(--yellow);}
.blk.current{background:var(--cyan);}
.blk.locked{background:repeating-linear-gradient(45deg,var(--red) 0,var(--red) 2px,#8A0E08 2px,#8A0E08 4px);}
.legend{display:flex;flex-wrap:wrap;gap:10px;font-size:10px;color:var(--dim);}
.legend span{display:inline-flex;align-items:center;gap:4px;}
.swatch{width:9px;height:9px;display:inline-block;border-radius:1px;}
.foot{font-size:10px;color:var(--dim);}
