:root{--bg:#080b08;--panel:#0f140f;--line:rgba(255,255,255,.09);--text:#f5f7f5;--muted:#7f8a7f;--kick:#53fc18;--yellow:#ffe100;--red:#ff5d5d}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:radial-gradient(circle at 12% 0%,rgba(83,252,24,.08),transparent 30%),var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}body{padding:82px 18px 48px}.rank-shell{width:min(1220px,100%);margin:0 auto}.rank-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:30px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(135deg,rgba(83,252,24,.09),rgba(255,225,0,.025) 50%,rgba(255,255,255,.02));box-shadow:0 25px 80px rgba(0,0,0,.28)}.eyebrow,.mini{display:block;color:var(--kick);font-size:10px;font-weight:950;letter-spacing:.16em}.rank-hero h1{font-size:clamp(36px,6vw,72px);line-height:.88;margin:10px 0 12px;letter-spacing:-.065em}.rank-hero h1 em{font-style:normal;color:var(--kick)}.rank-hero p{margin:0;color:#899389;max-width:680px}.hero-actions{display:flex;gap:8px;flex-wrap:wrap}.hero-actions a{text-decoration:none;color:#fff;border:1px solid var(--line);background:#111711;border-radius:10px;padding:12px 14px;font-size:10px;font-weight:900}.hero-actions a:first-child{background:var(--kick);color:#061006;border-color:transparent}.period-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:16px 0}.period-tabs button{border:1px solid var(--line);background:#0d110d;color:#839083;padding:14px 10px;border-radius:12px;font-weight:950;font-size:11px;cursor:pointer}.period-tabs button:hover{color:#fff;border-color:rgba(83,252,24,.35)}.period-tabs button.active{background:var(--kick);color:#061006;border-color:var(--kick);box-shadow:0 7px 30px rgba(83,252,24,.13)}.summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:10px}.summary-card{min-width:0;padding:17px;border:1px solid var(--line);border-radius:15px;background:#0d110d}.summary-card span{font-size:8px;font-weight:950;color:#768176;letter-spacing:.13em}.summary-card strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:7px 0 3px;font-size:20px}.summary-card small{color:#6f796f;font-size:9px}.summary-card.green strong{color:var(--kick)}.summary-card.yellow strong{color:var(--yellow)}.rank-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.panel{border:1px solid var(--line);background:linear-gradient(180deg,#101510,#0b0f0b);border-radius:18px;padding:18px;min-width:0}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:13px}.panel-head h2{font-size:20px;margin:5px 0 0;letter-spacing:-.03em}.live-dot{font-size:8px;font-weight:950;color:var(--kick);border:1px solid rgba(83,252,24,.25);padding:6px 8px;border-radius:999px}.help{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;border:1px solid var(--line);color:#7e887e;font-weight:900}.panel-note{color:#687268;font-size:10px;line-height:1.55;margin:-4px 0 12px}.board{display:flex;flex-direction:column;gap:6px}.rank-row{display:grid;grid-template-columns:36px 38px minmax(0,1fr) auto;gap:10px;align-items:center;min-height:52px;border:1px solid rgba(255,255,255,.055);background:rgba(255,255,255,.018);border-radius:12px;padding:7px 10px}.rank-row.me{border-color:rgba(83,252,24,.35);background:rgba(83,252,24,.055)}.rank-num{font-size:12px;font-weight:1000;text-align:center;color:#6f7a6f}.rank-row:nth-child(1) .rank-num{color:#ffe100;font-size:17px}.rank-row:nth-child(2) .rank-num{color:#d8dfe5;font-size:15px}.rank-row:nth-child(3) .rank-num{color:#c78455;font-size:14px}.avatar{width:36px;height:36px;border-radius:10px;object-fit:cover;background:#181e18;border:1px solid rgba(255,255,255,.08)}.avatar.fallback{display:grid;place-items:center;font-weight:950;color:#071007;background:var(--kick)}.who{min-width:0}.who b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px}.who small{display:block;color:#687268;font-size:8px;margin-top:3px}.rank-value{text-align:right}.rank-value b{display:block;color:var(--kick);font-size:13px}.rank-value small{color:#687268;font-size:8px}.empty{padding:32px 12px;border:1px dashed rgba(255,255,255,.09);border-radius:12px;text-align:center;color:#667066;font-size:10px}.game-rank-panel{margin-top:10px}.game-head{align-items:flex-end}.game-select-wrap{display:flex;flex-direction:column;gap:5px}.game-select-wrap span{font-size:8px;font-weight:950;color:#687268}.game-select-wrap select{min-width:230px;border:1px solid var(--line);background:#0a0e0a;color:#fff;padding:10px 12px;border-radius:10px;font-weight:800;outline:none}.game-board{display:grid;grid-template-columns:1fr 1fr;gap:6px}.game-board .rank-row{width:100%}.history-note{margin:12px 2px 0;color:#596359;font-size:9px;line-height:1.55}.error-box{padding:16px;border:1px solid rgba(255,93,93,.3);background:rgba(255,93,93,.06);border-radius:12px;color:#ff8585;font-size:10px}@media(max-width:900px){.summary-grid{grid-template-columns:1fr 1fr}.rank-grid{grid-template-columns:1fr}.game-board{grid-template-columns:1fr}}@media(max-width:650px){body{padding:20px 10px 90px}.rank-hero{padding:20px;display:block}.hero-actions{margin-top:18px}.period-tabs{gap:5px}.period-tabs button{padding:11px 4px;font-size:8px}.summary-grid{grid-template-columns:1fr 1fr}.summary-card{padding:13px}.summary-card strong{font-size:15px}.panel{padding:13px}.game-head{align-items:stretch;flex-direction:column}.game-select-wrap select{width:100%;min-width:0}.rank-row{grid-template-columns:29px 34px minmax(0,1fr) auto;padding:6px}.avatar{width:34px;height:34px}.rank-value b{font-size:11px}}