:root{--bg: #0a0a0a;--surface: #161616;--surface-2: #1f1f1f;--border: #2a2a2a;--text: #f5f5f5;--text-dim: #9a9a9a;--accent: #f08c50;--accent-hover: #f5a06b;--pitch: #0f5f3f;--pitch-dark: #0b3d2b;--gold: #f7c948;--success: #22c55e;--danger: #ef4444;color:var(--text);background:var(--bg);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(720px 240px at 50% -80px,rgb(240 140 80 / 18%),transparent 70%),radial-gradient(580px 320px at 10% 12%,rgb(15 95 63 / 26%),transparent 64%),var(--bg)}button,a{font:inherit}.loading,.shell{min-height:100vh}.loading{display:grid;place-items:center}.shell{display:flex;flex-direction:column;gap:18px;width:min(1180px,calc(100% - 32px));margin:0 auto;padding:0 0 48px}.topbar{position:sticky;top:0;z-index:10;display:flex;min-height:64px;align-items:center;justify-content:space-between;gap:16px;padding:0;border-bottom:1px solid var(--border);background:#0a0a0ae0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.brand{display:flex;min-width:0;align-items:center;gap:10px;font-size:18px;font-weight:800}.brand-mark{display:grid;width:34px;height:34px;place-items:center;border:1px solid rgb(240 140 80 / 45%);border-radius:8px;background:#111}.brand-mark img{width:28px;height:28px;object-fit:contain}.brand-accent{color:var(--accent)}.session{display:flex;align-items:center;gap:10px;color:var(--text-dim);font-size:14px}.hero{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:end;padding:44px 0 10px}.eyebrow{margin:0 0 12px;color:var(--gold);font-size:.82rem;font-weight:800;letter-spacing:0;text-transform:uppercase}h1{max-width:760px;margin:0;font-size:clamp(2.25rem,6vw,5.2rem);line-height:1;letter-spacing:0}.subcopy{max-width:620px;margin:18px 0 0;color:var(--text-dim);font-size:1.08rem;line-height:1.55}.hero-logo{display:grid;width:clamp(112px,18vw,210px);aspect-ratio:1;place-items:center;border:1px solid rgb(247 201 72 / 38%);border-radius:12px;background:radial-gradient(circle at 50% 35%,rgb(247 201 72 / 16%),transparent 58%),linear-gradient(135deg,rgb(15 95 63 / 42%),transparent 46%),var(--surface);box-shadow:0 22px 80px #0f5f3f2e}.hero-logo img{width:78%;height:78%;object-fit:contain}.btn,.ball{border:0;border-radius:8px;cursor:pointer}.btn{display:inline-flex;min-height:42px;align-items:center;justify-content:center;gap:8px;padding:0 16px;border:1px solid transparent;color:#000;background:var(--accent);font-weight:800;text-decoration:none}.btn:hover{background:var(--accent-hover)}.btn-secondary{color:var(--text);background:var(--surface-2);border-color:var(--border)}.btn-secondary:hover{background:#262626}.status{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;overflow:hidden;border:1px solid var(--border);border-radius:8px;background:var(--border)}.status div{display:flex;min-height:96px;flex-direction:column;justify-content:center;padding:18px;background:var(--surface)}.status span{color:var(--text-dim);font-size:.88rem}.status strong{margin-top:5px;font-size:1.8rem}.panel{border:1px solid var(--border);border-radius:12px;background:var(--surface)}.game{position:relative;display:grid;gap:18px;padding:28px;overflow:hidden;background:linear-gradient(90deg,rgb(255 255 255 / 9%) 1px,transparent 1px),linear-gradient(0deg,rgb(255 255 255 / 8%) 1px,transparent 1px),repeating-linear-gradient(90deg,var(--pitch-dark) 0,var(--pitch-dark) 12.5%,var(--pitch) 12.5%,var(--pitch) 25%);background-size:100% 100%,100% 50%,100% 100%}.game:before{content:"";position:absolute;top:28px;right:28px;bottom:28px;left:28px;pointer-events:none;border:2px solid rgb(255 255 255 / 20%);border-radius:8px}.game:after{content:"";position:absolute;top:50%;left:50%;width:120px;height:120px;pointer-events:none;border:2px solid rgb(255 255 255 / 18%);border-radius:50%;transform:translate(-50%,-50%)}.game-header{position:relative;z-index:1;display:flex;align-items:end;justify-content:space-between;gap:12px;color:#fff}.game-header span{color:#ffffffb8;font-size:.82rem;font-weight:800;letter-spacing:0;text-transform:uppercase}.game-header strong{color:var(--gold);font-size:1.25rem}.balls{position:relative;z-index:1;display:grid;grid-template-columns:repeat(5,minmax(96px,1fr));gap:14px}.ball{display:block;min-height:132px;padding:0;color:var(--text);border:0;background:transparent;perspective:900px;transition:opacity .15s ease,transform .15s ease}.ball:not(:disabled):hover{transform:translateY(-2px)}.ball:disabled{cursor:not-allowed}.card-inner{position:relative;display:block;width:100%;min-height:132px;transform-style:preserve-3d;transition:transform .65s cubic-bezier(.2,.8,.2,1)}.ball.used .card-inner{transform:rotateY(180deg)}.card-face{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;min-height:132px;place-items:center;padding:16px;overflow:hidden;backface-visibility:hidden;border:1px solid rgb(255 255 255 / 14%);border-radius:8px;box-shadow:inset 0 -5px #0000002e}.card-front{background:radial-gradient(circle at 50% 40%,rgb(255 255 255 / 9%),transparent 44%),#101010d1}.ball:not(:disabled):hover .card-front{border-color:#f7c948b8;background:radial-gradient(circle at 50% 40%,rgb(247 201 72 / 24%),transparent 48%),#101010e0}.card-back{color:#000;background:radial-gradient(circle at 50% 28%,rgb(255 255 255 / 35%),transparent 38%),linear-gradient(135deg,var(--gold),var(--accent));transform:rotateY(180deg)}.ball-icon{filter:grayscale(1);font-size:3.2rem;line-height:1}.ball.used .ball-icon{filter:none}.prize-label{display:block;max-width:100%;font-size:.82rem;font-weight:800;line-height:1.2;text-align:center;overflow-wrap:anywhere}@media(prefers-reduced-motion:reduce){.card-inner{transition:none}.ball:not(:disabled):hover{transform:none}}.result{padding:16px 18px;border-radius:8px;color:#000;background:var(--accent);font-size:1.15rem;font-weight:800}@media(max-width:740px){.shell{width:min(100% - 24px,1120px);padding-top:18px}.hero,.status{grid-template-columns:1fr}.hero{align-items:start}.topbar,.session{justify-content:flex-start}.topbar{position:static;min-height:auto;align-items:flex-start;flex-direction:column;padding:14px 0}.session{width:100%;flex-wrap:wrap}.balls{grid-template-columns:repeat(2,minmax(0,1fr))}.game{padding:16px}}
