/* 大屏幕：配色取自大赛主 KV —— 深海蓝 / 天蓝 / 赛事红 / 草地绿 / 白 */
:root{--navy:#081f4d;--navy2:#0d3478;--blue:#2c6fd1;--sky:#7fb4f0;--red:#d0103a;--red2:#e8355a;--gold:#ffd769;--green:#3f9a34}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;overflow:hidden;background:var(--navy)}
body{font-family:"PingFang SC","Microsoft YaHei","Heiti SC",sans-serif;color:#fff;user-select:none}
.bg{position:fixed;inset:-3vh;background-size:cover;background-position:center;filter:blur(1.2vh) saturate(1.15)}
.bg-mask{position:fixed;inset:0;background:
  linear-gradient(180deg,rgba(8,31,77,.92) 0%,rgba(8,31,77,.78) 45%,rgba(8,31,77,.55) 78%,rgba(8,31,77,.85) 100%),
  radial-gradient(ellipse at 50% 55%,rgba(44,111,209,.35),transparent 60%)}
/* KV 里的红蓝斜向光带 */
.bg-mask::before{content:"";position:absolute;left:-10vw;top:22vh;width:40vw;height:60vh;background:linear-gradient(120deg,rgba(208,16,58,.75),rgba(208,16,58,0) 70%);transform:skewY(-18deg);filter:blur(2px)}
.bg-mask::after{content:"";position:absolute;right:-12vw;top:-10vh;width:45vw;height:80vh;background:linear-gradient(240deg,rgba(127,180,240,.35),rgba(127,180,240,0) 70%);transform:skewY(22deg)}
#confetti{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:50}

.screen{position:relative;z-index:2;height:100vh;display:flex;flex-direction:column;padding:3vh 4vw 1.5vh}
.head{text-align:center;position:relative}
.logo{position:absolute;left:0;top:0;max-height:8vh;max-width:18vw}
.title{font-size:3.2vh;line-height:1.45;font-weight:800;letter-spacing:.15vh;text-shadow:0 .3vh 1vh rgba(0,0,0,.45)}
.subtitle{margin-top:1.4vh}
.subtitle span{display:inline-block;font-size:5.6vh;font-weight:900;letter-spacing:1.4vh;padding:.4vh 4vh .6vh 5.4vh;
  background:linear-gradient(90deg,transparent,var(--red) 18%,var(--red2) 50%,var(--red) 82%,transparent);
  text-shadow:0 .4vh 1vh rgba(0,0,0,.35)}

.stage{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:0;padding:2vh 0}
.prize-bar{display:flex;align-items:center;gap:2.4vh;margin-bottom:3.5vh;padding:1.2vh 3.6vh;border-radius:2vh;
  background:linear-gradient(90deg,rgba(255,255,255,.04),rgba(255,255,255,.14),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.25)}
.prize-bar img{height:11vh;max-width:22vh;object-fit:contain;border-radius:1vh;background:rgba(255,255,255,.9);padding:.6vh}
.round{font-size:4.6vh;font-weight:900;color:var(--gold);letter-spacing:.4vh}
.pname{font-size:3.4vh;font-weight:700;margin-top:.3vh}
.pname b{color:var(--gold);font-size:4vh;margin-left:1vh}

.cards{display:flex;flex-wrap:wrap;justify-content:center;align-content:center;gap:2.4vh;width:100%;max-width:92vw}
.card{position:relative;display:flex;align-items:center;justify-content:center;border-radius:1.8vh;font-weight:900;
  font-family:"DIN Alternate","Bahnschrift","Arial Black","Helvetica Neue",Arial,sans-serif;letter-spacing:.3vh;
  background:linear-gradient(160deg,#fff 0%,#e9f1fd 100%);color:var(--navy2);
  box-shadow:0 1.2vh 3vh rgba(0,0,0,.35),inset 0 -.6vh 0 rgba(13,52,120,.15);transition:transform .3s}
.card::before{content:"";position:absolute;left:0;right:0;top:0;height:.9vh;border-radius:1.8vh 1.8vh 0 0;background:linear-gradient(90deg,var(--red),var(--blue))}
.card.empty{color:rgba(13,52,120,.25)}
.card.rolling{color:var(--navy2);animation:shake .12s infinite alternate}
.card.old{background:linear-gradient(160deg,rgba(255,255,255,.88),rgba(220,232,250,.88));color:var(--navy2)}
.card.win{background:linear-gradient(160deg,var(--red2) 0%,var(--red) 60%,#a00b2c 100%);color:#fff;
  box-shadow:0 0 0 .5vh var(--gold),0 0 5vh rgba(255,215,105,.75),0 1.2vh 3vh rgba(0,0,0,.4);animation:pop .6s cubic-bezier(.2,1.6,.4,1)}
.card.win::before{background:linear-gradient(90deg,var(--gold),#fff,var(--gold))}
.card .no{position:absolute;left:1.2vh;top:1.4vh;font-size:1.6vh;letter-spacing:0;opacity:.55;font-family:inherit}
/* 根据数量调整尺寸 */
.cards.n1 .card{width:46vw;height:27vh;font-size:14vh}
.cards.n2 .card{width:34vw;height:26vh;font-size:11vh}
.cards.n3 .card{width:27vw;height:24vh;font-size:9vh}
.cards.n4 .card{width:20.5vw;height:22vh;font-size:7.5vh}
.cards.n5 .card{width:16.5vw;height:20vh;font-size:6.4vh}
.cards.n10 .card{width:16.5vw;height:15vh;font-size:5.6vh}
.cards.n20 .card{width:13.5vw;height:10vh;font-size:4.2vh}
.cards.nmax{gap:1.4vh}
.cards.nmax .card{width:10.5vw;height:7.5vh;font-size:3.2vh;border-radius:1vh}
.cards.nmax .card .no{display:none}
.tip-line{margin-top:3vh;font-size:2.4vh;opacity:.85;min-height:3vh;text-align:center}
.tip-line.hl{color:var(--gold);font-size:3.4vh;font-weight:800;opacity:1;animation:glow 1.2s infinite alternate}

.foot{display:flex;flex-direction:column;align-items:center;gap:1.6vh}
.rounds{display:flex;gap:1.2vh;flex-wrap:wrap;justify-content:center}
.rounds button{border:1px solid rgba(255,255,255,.35);background:rgba(8,31,77,.55);color:#fff;padding:.8vh 2.2vh;border-radius:4vh;font-size:2vh;cursor:pointer;font-family:inherit}
body:not(.is-admin) .rounds button{cursor:default}
.rounds button.on{background:var(--blue);border-color:var(--sky);box-shadow:0 0 2vh rgba(127,180,240,.6)}
.rounds button.done{opacity:.55}
.rounds button.done::after{content:" ✔"}
.go{min-width:34vh;padding:1.8vh 6vh;font-size:3.6vh;font-weight:900;letter-spacing:.8vh;color:#fff;border:0;border-radius:6vh;cursor:pointer;font-family:inherit;
  background:linear-gradient(180deg,var(--red2),var(--red) 60%,#a00b2c);box-shadow:0 .8vh 0 #7a0821,0 1.5vh 3vh rgba(0,0,0,.4);transition:transform .1s}
.go:active{transform:translateY(.5vh);box-shadow:0 .3vh 0 #7a0821}
.go.stop{background:linear-gradient(180deg,#ffe28a,var(--gold) 60%,#e3aa20);color:#6b1020;box-shadow:0 .8vh 0 #a87808,0 0 4vh rgba(255,215,105,.6);animation:pulse 1s infinite}
.go:disabled{filter:grayscale(.7);opacity:.6;cursor:not-allowed;animation:none}
.login-link{color:rgba(255,255,255,.55);font-size:1.6vh}
.support{font-size:1.4vh;opacity:.6}
.tech-support{color:#fff;text-decoration:none}
.tech-support:hover{text-decoration:underline}
.tools{position:fixed;right:1.5vh;bottom:1.5vh;z-index:60;opacity:.25;transition:opacity .2s}
.tools:hover{opacity:1}
.tools button{width:4.4vh;height:4.4vh;border-radius:50%;border:1px solid rgba(255,255,255,.5);background:rgba(8,31,77,.6);color:#fff;font-size:2.2vh;cursor:pointer}
.toast{position:fixed;left:50%;top:40%;transform:translate(-50%,-50%);background:rgba(0,0,0,.8);padding:2vh 4vh;border-radius:1.4vh;font-size:2.6vh;z-index:80}

@keyframes shake{from{transform:translateY(-.2vh)}to{transform:translateY(.2vh)}}
@keyframes pop{0%{transform:scale(.6) rotateY(90deg)}100%{transform:scale(1) rotateY(0)}}
@keyframes pulse{50%{transform:scale(1.05)}}
@keyframes glow{from{text-shadow:0 0 1vh rgba(255,215,105,.3)}to{text-shadow:0 0 3vh rgba(255,215,105,.9)}}

/* 竖屏 / 窄屏兜底 */
@media (max-aspect-ratio:1/1){
  .cards.n1 .card,.cards.n2 .card,.cards.n3 .card{width:80vw;height:18vh;font-size:9vh}
  .cards.n4 .card,.cards.n5 .card,.cards.n10 .card{width:42vw;height:12vh;font-size:5vh}
  .cards.n20 .card,.cards.nmax .card{width:28vw}
}