:root{
  --bg:#f1faf3;--card:#fff;--line:#d7eadc;--txt:#12301f;--sub:#6a8573;
  --num:#15803d;--green:#16a34a;--yellow:#d97706;--red:#e11d48;
  --pitch1:#5ccf7d;--pitch2:#4fc271;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{min-height:100vh;color:var(--txt);font:15px/1.5 -apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;overflow-x:hidden;
  background:linear-gradient(180deg,#dcf5e3 0,#eefaf1 280px,#f7fcf8 100%)}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0}

/* 白天球场：阳光 + 看台彩旗 */
.lights{position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(420px 260px at 85% -40px,rgba(255,236,150,.7),transparent 70%),
    radial-gradient(60vw 40vh at 0% 0%,rgba(255,255,255,.9),transparent 60%)}
.lights:before{content:"";position:absolute;left:0;right:0;top:0;height:6px;opacity:.7;
  background:repeating-linear-gradient(90deg,#2563eb 0 18px,#fff 18px 22px,#e11d48 22px 40px,#fff 40px 44px)}

.wrap{position:relative;z-index:1;max-width:760px;margin:0 auto;padding:36px 16px 32px}

/* 计分板 */
.board{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px;
  box-shadow:0 12px 32px rgba(22,101,52,.12)}
.board-top{display:flex;align-items:center;gap:10px}
.live{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;letter-spacing:1px;color:#fff;background:var(--red);padding:2px 8px;border-radius:4px}
.live i{width:7px;height:7px;border-radius:50%;background:#fff;animation:blink 1s infinite}
@keyframes blink{50%{opacity:.2}}
.clock{margin-left:auto;font:700 15px/1 ui-monospace,Consolas,monospace;color:var(--num);letter-spacing:2px}
.title{margin:12px 0 6px;font-size:26px;font-weight:900;letter-spacing:2px;text-align:center;color:#12301f}
.score{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:stretch;margin-top:10px}
.cell{background:#f2faf4;border:1px solid var(--line);border-radius:10px;padding:8px 6px;text-align:center}
.cell small{display:block;font-size:11px;color:var(--sub);letter-spacing:2px}
.led{font:800 30px/1.15 ui-monospace,Consolas,"Courier New",monospace;color:var(--num);font-variant-numeric:tabular-nums;letter-spacing:1px}
.led.sm{font-size:16px;line-height:1.6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--green);font-family:inherit}
.vs{align-self:center;font:900 18px/1 sans-serif;color:var(--red);padding:0 2px}
.best{grid-column:1/-1;background:linear-gradient(90deg,#e3f8ea,#f2faf4)}
.ticker{margin-top:12px;overflow:hidden;white-space:nowrap;border-radius:8px;background:#fff7db;border:1px solid #fde68a;
  font-size:13px;color:#b45309;padding:5px 0}
.ticker span{display:inline-block;padding-left:100%;animation:run 16s linear infinite}
@keyframes run{to{transform:translateX(-100%)}}

/* 草坪 */
.pitch{position:relative;margin-top:22px;border-radius:16px;padding:16px 12px;overflow:hidden;border:3px solid #fff;
  box-shadow:0 12px 32px rgba(22,163,74,.18);
  background:repeating-linear-gradient(90deg,var(--pitch1) 0 12.5%,var(--pitch2) 12.5% 25%)}
.pitch:before{content:"";position:absolute;left:50%;top:-2px;bottom:-2px;border-left:2px solid rgba(255,255,255,.75)}
.pitch:after{content:"";position:absolute;left:50%;top:50%;width:140px;height:140px;margin:-70px 0 0 -70px;border:2px solid rgba(255,255,255,.75);border-radius:50%}
.pitch-head{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:13px;color:#fff;text-shadow:0 1px 2px rgba(0,80,30,.35)}
.pitch-head b{font-size:15px;letter-spacing:1px}

.list{position:relative;z-index:1;display:flex;flex-direction:column;gap:10px}
.item{position:relative;display:grid;grid-template-columns:44px 1fr auto auto;align-items:center;gap:10px;padding:10px 12px 12px;border-radius:12px;
  background:rgba(255,255,255,.96);box-shadow:0 4px 12px rgba(0,60,20,.12);transition:transform .15s,box-shadow .2s}
.item:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(0,60,20,.2)}
.jersey{position:relative;width:44px;height:40px;display:flex;align-items:center;justify-content:center;font:900 18px/1 sans-serif;color:#fff;
  background:linear-gradient(#3b82f6,#1d4ed8);clip-path:polygon(22% 0,40% 8%,60% 8%,78% 0,100% 18%,88% 38%,82% 34%,82% 100%,18% 100%,18% 34%,12% 38%,0 18%)}
.info{min-width:0}
.name,.host{display:block}
.name{font-weight:700;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.host{font-size:12px;color:var(--sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sig{display:flex;align-items:flex-end;gap:2px;height:18px}
.sig i{width:4px;background:#d5dde8;border-radius:1px}
.sig i:nth-child(1){height:5px}.sig i:nth-child(2){height:9px}.sig i:nth-child(3){height:13px}.sig i:nth-child(4){height:18px}
.ms{min-width:74px;text-align:right;background:#f2faf4;border:1px solid var(--line);border-radius:8px;padding:4px 8px}
.ms b{font:800 20px/1 ui-monospace,Consolas,monospace;color:var(--txt);font-variant-numeric:tabular-nums}
.ms small{font-size:10px;color:var(--sub);margin-left:2px}
.bar{position:absolute;left:12px;right:12px;bottom:4px;height:3px;border-radius:3px;background:#edf2f7;overflow:hidden}
.bar:before{content:"";display:block;height:100%;width:calc(var(--nv-p,0)*100%);background:var(--green);border-radius:3px;transition:width .6s}
.mvp{display:none;position:absolute;top:-9px;right:10px;font:900 11px/1 sans-serif;letter-spacing:1px;color:#5a3a00;
  background:linear-gradient(#ffe27a,#ffb703);padding:4px 7px;border-radius:4px;box-shadow:0 2px 8px rgba(255,170,0,.5)}

/* 测速状态 */
[data-nv-state=testing] .ms b{animation:blink .5s infinite;color:#2563eb}
[data-nv-state=fast] .sig i{background:var(--green)}
[data-nv-state=good] .sig i:nth-child(-n+3){background:var(--yellow)}
[data-nv-state=slow] .sig i:nth-child(-n+2){background:var(--red)}
[data-nv-state=fast] .ms b{color:var(--green)}
[data-nv-state=good] .ms b{color:var(--yellow)}
[data-nv-state=good] .bar:before{background:var(--yellow)}
[data-nv-state=slow] .bar:before{background:var(--red)}
[data-nv-state=slow] .ms b{color:var(--red)}
[data-nv-state=fail]{opacity:.6}
[data-nv-state=fail] .ms b{color:var(--red);font-size:15px}
[data-nv-place="1"]{box-shadow:0 0 0 2px #fbbf24,0 8px 22px rgba(251,191,36,.45);background:linear-gradient(90deg,#fffbeb,#fff 60%)}
[data-nv-place="1"] .mvp{display:block}
[data-nv-place="1"] .jersey{background:linear-gradient(#fcd34d,#f59e0b);color:#5a3a00}

.actions{display:grid;grid-template-columns:1fr 1.4fr;gap:10px;margin-top:18px}
.btn{display:flex;align-items:center;justify-content:center;gap:8px;height:48px;border-radius:12px;font-weight:800;font-size:16px;letter-spacing:1px;transition:filter .15s,transform .1s}
.btn:active{transform:scale(.98)}
.btn svg{width:20px;height:20px}
.btn.ghost{background:#fff;color:var(--num);border:2px solid #b6e0c2}
.btn.go{background:linear-gradient(90deg,#16a34a,#22c55e);color:#fff;box-shadow:0 8px 20px rgba(22,163,74,.3)}
.btn[disabled]{filter:grayscale(1);opacity:.6;cursor:not-allowed}
html[data-nv-running] .btn.ghost svg{animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.empty{position:relative;z-index:1;text-align:center;padding:40px 0;color:#fff}
.foot{margin-top:24px;text-align:center;font-size:12px;color:var(--sub)}
@media (max-width:480px){
  .title{font-size:22px}
  .led{font-size:24px}
  .item{grid-template-columns:38px 1fr auto;gap:8px}
  .jersey{width:38px;height:34px;font-size:15px}
  .sig{display:none}
  .ms{min-width:64px}
}