*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
:root{--a:#ff5a36;--b:#2f8cff;--bg:#0b1020;--card:#151c33;--gold:#ffc83d;--txt:#eef2ff;--mut:#8a94b8}
html,body{margin:0;background:radial-gradient(circle at 50% -20%,#22305e,var(--bg) 60%);color:var(--txt);font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;min-height:100%}
#app{max-width:760px;margin:0 auto;padding:12px 12px 40px}
h1{font-size:34px;margin:18px 0 4px;text-align:center;font-weight:900;letter-spacing:-1px;font-style:italic;text-transform:uppercase}
h1 span{color:var(--gold)}h2{margin:12px 0 8px;font-size:20px}
.sub{text-align:center;color:var(--mut);margin-bottom:20px}
.btn{display:block;width:100%;border:0;border-radius:16px;padding:18px;font-size:20px;font-weight:800;color:#fff;background:linear-gradient(180deg,#ffb020,#ff6a00);box-shadow:0 5px 0 #a74300;cursor:pointer;text-transform:uppercase;margin:10px 0}
.btn:active{transform:translateY(3px);box-shadow:0 2px 0 #a74300}.btn:disabled{opacity:.35}
.btn.ghost{background:#2a3358;box-shadow:0 5px 0 #161c36}
input{width:100%;padding:16px;font-size:20px;border-radius:14px;border:2px solid #2a3358;background:#0f152a;color:#fff;margin:6px 0 12px}
label{font-weight:700;color:var(--mut)}
.teams{display:grid;grid-template-columns:1fr 1fr;gap:8px;position:sticky;top:0;z-index:5;background:var(--bg);padding:6px 0}
.team{background:var(--card);border-radius:14px;padding:8px 10px;border-top:5px solid var(--a);transition:.2s}
.team.t1{border-top-color:var(--b)}.team.active{box-shadow:0 0 0 3px var(--gold);transform:scale(1.02)}
.team .nm{font-weight:900;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.team .money{font-size:28px;font-weight:900;color:var(--gold)}.team .small{font-size:12px;color:var(--mut)}
.roster{display:flex;flex-wrap:wrap;gap:3px;margin-top:4px}.chip{font-size:11px;background:#232c50;padding:3px 6px;border-radius:8px}
.chip.e{opacity:.35}
.pool{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.card{background:var(--card);border-radius:14px;padding:10px;border:2px solid transparent;cursor:pointer;position:relative}
.card:active{border-color:var(--gold)}.card .n{font-weight:800;font-size:15px;line-height:1.1;min-height:34px}
.card .p{font-size:11px;color:var(--mut);margin:2px 0 6px}.tag{font-size:10px;padding:2px 6px;border-radius:6px;background:#3b2a6b;margin-left:4px}
.tag.c{background:#155e4a}.stats{display:flex;justify-content:space-between;text-align:center}
.stats b{display:block;font-size:17px}.stats small{font-size:10px;color:var(--mut)}
.lot{background:linear-gradient(160deg,#1b2550,#121a36);border-radius:20px;padding:14px;margin:10px 0;text-align:center;border:2px solid var(--gold)}
.lot .pn{font-size:26px;font-weight:900}.bid{font-size:56px;font-weight:900;color:var(--gold);line-height:1}
.who{font-size:20px;font-weight:900;padding:8px;border-radius:12px;margin:8px 0}
.who.t0{background:var(--a)}.who.t1{background:var(--b)}
.clock{height:14px;background:#2a3358;border-radius:8px;overflow:hidden;margin:8px 0}
.clock div{height:100%;background:linear-gradient(90deg,#3ddc84,var(--gold),#ff3b3b);transform-origin:left}
.row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.row .btn{font-size:22px;margin:4px 0}
.pass{background:linear-gradient(180deg,#ff4d6d,#c9184a);box-shadow:0 5px 0 #7a0e2c}
.custom{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:center}.custom input{margin:0}
.toast{position:fixed;left:50%;top:40%;transform:translate(-50%,-50%) scale(.5);background:var(--gold);color:#111;font-weight:900;font-size:26px;padding:20px 28px;border-radius:20px;opacity:0;pointer-events:none;transition:.25s;text-align:center;z-index:50;max-width:90%}
.toast.show{opacity:1;transform:translate(-50%,-50%) scale(1)}
.game{background:var(--card);border-radius:16px;padding:12px;margin:10px 0;animation:pop .5s ease}
@keyframes pop{from{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:none}}
.score{display:flex;justify-content:space-between;align-items:center;font-size:22px;font-weight:900}
.score .w{color:var(--gold)}.lead{font-size:13px;color:#c9d1f0;margin-top:6px;line-height:1.6}
.final{font-size:30px;font-weight:900;text-align:center;color:var(--gold);margin:16px 0;animation:pop .6s}
.note{font-size:13px;color:var(--mut)}.vs{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.big{font-size:42px;font-weight:900;text-align:center}
.help{font-size:14px;color:var(--mut);line-height:1.5;background:var(--card);padding:12px;border-radius:12px}
.mute{position:fixed;right:10px;bottom:10px;z-index:60;width:54px;height:54px;border-radius:50%;border:0;font-size:26px;background:#2a3358;box-shadow:0 3px 10px #0008;cursor:pointer}
.lbrow{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid #232c50;color:var(--txt);font-size:16px}
.linkbtn{background:none;border:0;color:var(--mut);text-decoration:underline;margin-top:6px;font-size:12px;cursor:pointer}
.card.sold{opacity:.4;filter:grayscale(1);cursor:default;pointer-events:none}
.card.block{border-color:var(--gold);box-shadow:0 0 0 3px var(--gold),0 0 18px #ffc83d88;animation:pulse 1.2s infinite}
@keyframes pulse{50%{box-shadow:0 0 0 3px var(--gold),0 0 4px #ffc83d33}}
.badge{font-size:11px;font-weight:900;padding:3px 6px;border-radius:7px;margin-bottom:5px;display:inline-block;color:#fff}
.badge.t0{background:var(--a)}.badge.t1{background:var(--b)}.badge.blk{background:var(--gold);color:#111}
.card.sold .badge{filter:none}
