:root{--sat: env(safe-area-inset-top, 0px);--sar: env(safe-area-inset-right, 0px);--sab: env(safe-area-inset-bottom, 0px);--sal: env(safe-area-inset-left, 0px)}:root{--bg:#1f2227;--panel:#24282e;--text:#fff;--muted:#cfd6df;--line:#2d3239;--green:#16a34a;--accent:#16a34a;--padH: 260px;--cricket-head-h: 44px}@media (max-height: 720px){:root{--padH: 220px}}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial}.container{height:calc(var(--vh,1vh)*100);display:flex;flex-direction:column;min-height:0;padding-top:var(--sat);padding-right:var(--sar);padding-bottom:var(--sab);padding-left:var(--sal)}.toast{position:fixed;left:50%;bottom:16px;transform:translate(-50%);background:#0f1318;border:1px solid var(--line);color:#e5fbea;padding:10px 14px;border-radius:12px;font-weight:900;box-shadow:0 6px 20px #0009;z-index:9999}.toast.ok{border-color:#14532d;background:linear-gradient(#0f1b12,#0a1510)}.header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 8px;padding-top:max(6px,var(--sat),28px);background:#13161a;border-bottom:1px solid var(--line)}.header .left{display:flex;align-items:center;gap:8px;min-width:0}.logo{display:flex;align-items:center;gap:8px;font-weight:900;white-space:nowrap}.logo .dart{width:18px;height:18px;border-radius:50%;background:conic-gradient(#000 0,#000 5deg,#ef4444 5deg,#ef4444 35deg,#000 35deg,#000 40deg,#16a34a 40deg,#16a34a 70deg,#000 70deg,#000 75deg,#fff 75deg,#fff 105deg,#000 105deg,#000 110deg,#ef4444 110deg,#ef4444 140deg,#000 140deg,#000 145deg,#16a34a 145deg,#16a34a 175deg,#000 175deg,#000 180deg,#fff 180deg,#fff 210deg,#000 210deg,#000 215deg,#ef4444 215deg,#ef4444 245deg,#000 245deg,#000 250deg,#16a34a 250deg,#16a34a 280deg,#000 280deg,#000 285deg,#fff 285deg,#fff 315deg,#000 315deg,#000 320deg,#ef4444 320deg,#ef4444 350deg,#000 350deg,#000 360deg);border:2px solid #333}.controls{display:flex;align-items:center;gap:6px}.iconBtn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid var(--line);border-radius:10px;background:#171a1f;position:relative;color:#cfd6df}.icon{width:22px;height:22px;fill:#bfc7d5}.iconHead{width:22px;height:22px;display:inline-block;background:#bfc7d5;-webkit-mask:url(/voice-head.png) center/contain no-repeat;mask:url(/voice-head.png) center/contain no-repeat}.iconBtn.muted .icon,.iconBtn.muted .iconHead{opacity:.55}.iconBtn.muted:before,.iconBtn.muted:after{content:"";position:absolute;width:22px;height:2.5px;background:#ef4444;top:50%;left:50%;transform-origin:center;box-shadow:0 0 0 1px #13161a;border-radius:2px}.iconBtn.muted:before{transform:translate(-50%,-50%) rotate(45deg)}.iconBtn.muted:after{transform:translate(-50%,-50%) rotate(-45deg)}.input,select{background:#12151a;color:#fff;border:1px solid var(--line);border-radius:10px;padding:8px 10px;font-size:14px}.input::placeholder{color:#fff;opacity:.7}input[type=text]{color:#fff}.btn{border:1px solid var(--line);background:#171a1f;color:#fff;border-radius:10px;padding:8px 10px;font-weight:800;cursor:pointer;font-size:14px}.btn.ghost{background:transparent}.btn.green{background:linear-gradient(var(--accent),#00000055);border:2px solid var(--line);color:#fff;font-weight:900}.adstrip{display:flex;gap:6px;padding:6px 8px;background:#171a1f;border-bottom:1px solid var(--line);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory}.adstrip::-webkit-scrollbar{display:none}.adcard{min-width:140px;height:44px;background:#fff;color:#111;border-radius:8px;display:flex;align-items:center;justify-content:center;font-weight:800}.lobbyWrap{display:flex;flex-direction:column;gap:8px;padding:8px;flex:1;min-height:0}.lobbyCard{flex:0 0 auto;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:8px}.lobbyControls{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.lobbyControls span{color:#fff;font-weight:800}.tab{padding:4px 8px;border:1px solid var(--line);border-radius:10px;background:#171a1f;cursor:pointer;font-weight:800;color:#fff;line-height:1.1;display:inline-flex;align-items:center}.tab input{accent-color:#16a34a}.tab.active{background:var(--green);border-color:#14532d}.playerRow{display:grid;grid-template-columns:1fr auto auto auto;gap:8px;align-items:center;padding:6px;border:1px solid var(--line);border-radius:10px;background:#1c2026}.playerName input{width:100%}.score{font-variant-numeric:tabular-nums;font-size:28px;font-weight:900}.playerActions{display:flex;gap:6px}.playerDelete{display:flex;justify-content:flex-end}.trash{width:40px;height:40px;border:1px solid var(--line);border-radius:10px;background:linear-gradient(#b91c1c,#7f1d1d);color:#fff;font-weight:900}.rules dt{font-weight:900;margin-top:6px}.rules dd{margin:0 0 6px;color:var(--muted)}.savedList{display:flex;flex-direction:column;gap:8px}.savedRow{display:flex;justify-content:space-between;align-items:center;padding:6px;border:1px solid var(--line);border-radius:10px;background:#1c2026}.savedTitle{font-weight:900}.savedSub{color:#cbd5e1;font-size:12px}.gameWrap{display:flex;flex-direction:column;gap:8px;padding:8px;flex:1;min-height:calc(var(--vh,1vh)*100)}.gameTopBar{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-bottom:12px}.badge{background:#0f1318;border:1px solid var(--accent);border-radius:999px;padding:6px 10px;font-weight:800;color:var(--accent)}.gameTopBtns{display:flex;gap:4px;flex-wrap:nowrap}.gameTopBtns .btn{white-space:nowrap;font-size:15px;padding:6px 10px;font-weight:700;border-radius:6px;flex:0 0 auto;min-width:max-content}.playersPane{flex:1 1 calc(100% - var(--padH));min-height:0;overflow:auto;display:flex;flex-direction:column;gap:8px}.cricketWrap{flex:1 1 auto;min-height:0;display:flex;gap:8px;align-items:flex-start}.targetsRail{flex:0 0 64px;background:var(--panel);border:1px solid var(--line);border-radius:12px;display:flex;flex-direction:column;overflow:hidden}.targetsRailHead,.playerColHead{height:40px;padding:0 8px;display:flex;align-items:center;justify-content:space-between;gap:8px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-bottom:1px solid var(--line)}.playerCol.active{outline:2px solid var(--accent);outline-offset:-2px;box-shadow:0 0 0 1px var(--accent),0 0 12px #16a34a40}.playerCol.active .playerColHead{background:#16a34a24}.playerCol.active .markCell{border-bottom-color:#16a34a59}.playerCol{flex:0 0 120px;max-width:120px;background:var(--panel);border:1px solid var(--line);border-radius:12px;display:flex;flex-direction:column;overflow:hidden}.targetsRailMarks,.playerColMarks{display:flex;flex-direction:column}.targetCell,.markCell{height:56px;display:flex;align-items:center;justify-content:center;background:#171a1f;font-size:20px;line-height:1;border-bottom:1px solid var(--line)}.targetsRailMarks .targetCell:last-child,.playerColMarks .markCell:last-child{border-bottom:none}.cricketScroll{display:flex;overflow-x:auto;gap:8px;padding-bottom:0;scrollbar-width:none}.cricketScroll::-webkit-scrollbar{display:none}.targetsRailMarks .targetCell:last-child{background:#7f1d1d}.playerCol{flex:0 0 160px;background:var(--panel);border:1px solid var(--line);border-radius:12px;display:flex;flex-direction:column;overflow:hidden}.playerColHead{height:40px;padding:0 8px;display:flex;align-items:center;justify-content:space-between;gap:8px;font-weight:800;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;border-bottom:1px solid var(--line)}.playerColName{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cricketScroll{flex:1 1 auto;min-width:0;display:flex;gap:8px;overflow-x:auto;padding-bottom:2px}.markCell.closed{background:#111827}.playerCard{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:8px}.playerCard.active{outline:2px solid var(--accent);outline-offset:-2px;box-shadow:0 0 0 1px var(--accent),0 0 12px #0006}.playerHeader{display:flex;align-items:center;justify-content:space-between;gap:8px}.playerNameText{font-weight:900}.playerStats{display:flex;gap:8px;color:var(--muted)}.playerScore{font-size:40px;font-weight:900}.playerTurn{display:flex;align-items:center;gap:8px;margin-top:6px}.dartBox{min-width:56px;height:40px;border-radius:10px;background:#171a1f;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-weight:900}.lastTotal{margin-left:auto;color:#cbd5e1;font-weight:800}.playerCard.winner .starburst{position:absolute;top:0;right:0;bottom:0;left:0;display:block;pointer-events:none;animation:starfade 2s ease-out forwards}@keyframes starfade{0%{opacity:0}10%{opacity:1}to{opacity:0}}.starburst span{--k:0;position:absolute;left:50%;top:50%;width:2px;height:120%;background:linear-gradient(transparent,#fff,transparent);transform-origin:center;transform:translate(-50%,-50%) rotate(calc(var(--k)*30deg));filter:drop-shadow(0 0 6px #fff)}.playerCard.winner{animation:rainbow 1s linear infinite}@keyframes rainbow{0%{box-shadow:0 0 0 3px #ff3b30}25%{box-shadow:0 0 0 3px #fc0}50%{box-shadow:0 0 0 3px #34c759}75%{box-shadow:0 0 0 3px #007aff}to{box-shadow:0 0 0 3px #af52de}}.confetti{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden}.confetti span{--i:0;position:absolute;left:50%;top:50%;width:7px;height:14px;border-radius:2px;transform:rotate(calc(var(--i) * 9deg)) translate(-50%,-50%);background:hsl(calc(var(--i)*15),90%,55%);animation:conf 1.2s ease-out forwards}@keyframes conf{0%{transform:rotate(var(--r,0)) translate(0) scale(1);opacity:0}10%{opacity:1}to{transform:rotate(var(--r,0)) translate(calc((var(--i) - 20) * 6px),calc((var(--i) - 10) * -6px)) scale(1.1);opacity:0}}.padPane{flex:0 0 var(--padH);background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:8px;overflow:hidden;max-width:100vw}.container[data-mode=cricket] .padPane{margin-top:40px}.padRow{display:flex;gap:8px;justify-content:center;margin-bottom:8px}.key{flex:1 1 auto;min-width:48px;height:56px;border-radius:12px;border:1px solid var(--line);background:#0f1318;color:#fff;font-weight:900;font-size:20px;box-shadow:inset 0 -2px #0005;transition:transform .05s,background-color .08s,box-shadow .08s,border-color .08s}.key:active{transform:translateY(1px) scale(.98)}.key.pressed{transform:translateY(1px) scale(.98);background:#2a2f36;border-color:#6b7280;box-shadow:inset 0 -1px #0008,0 0 0 2px #9aa3af66}.multBtn{flex:1 1 auto;min-width:120px;height:44px;border-radius:12px;border:1px solid var(--line);background:#1a1f26;color:#fff;font-weight:900;display:flex;align-items:center;justify-content:center}.multBtn.mult-2.active{background:#a11d1d;border-color:#7a1616}.multBtn.mult-3.active{background:#157f3a;border-color:#0e5d2b}.backspace{display:flex;align-items:center;justify-content:center}.iconBackspace{width:28px;height:28px;display:block}.container[data-mode=cricket] .padPane>.padRow:not(:first-child){display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;justify-items:stretch;align-items:stretch}.container[data-mode=cricket] .padPane>.padRow:first-child{display:flex;gap:8px;justify-content:center;align-items:center}.container[data-mode=cricket] .padPane>.padRow:not(:first-child) .key{width:100%;height:56px;font-size:20px}.container[data-mode=cricket] .padPane>.padRow:not(:first-child)>.key:only-child{grid-column:1 / -1}.container[data-mode=cricket] .multBtn{min-width:110px;height:44px}@media (max-width: 360px){.container[data-mode=cricket] .padPane>.padRow:not(:first-child) .key{height:52px;font-size:18px}}.targetBox{border-color:var(--accent);background:#0006;color:var(--accent);font-weight:900}.container:not([data-mode=cricket]) .padPane{overflow:hidden;max-width:100vw;padding:8px;box-sizing:border-box;display:grid;grid-template-rows:auto 1fr;grid-template-columns:repeat(5,1fr);grid-auto-rows:1fr;gap:8px}.container:not([data-mode=cricket]) .padPane>.padRow:first-child{grid-column:1 / -1;grid-row:1;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:8px}.container:not([data-mode=cricket]) .padPane>.padRow:not(:first-child){display:contents}.container:not([data-mode=cricket]) .padPane>.padRow:not(:first-child) .key{width:100%;height:100%;min-width:0;align-self:stretch;justify-self:stretch;font-size:clamp(14px,2.5vh,20px)}.container:not([data-mode=cricket]) .padPane .multBtn{width:100%;min-width:0}html,body{overflow-x:hidden}.container[data-mode=cricket] .cricketWrap{margin-bottom:32px!important}.container[data-mode=cricket] .padPane{flex:0 0 220px!important}.targetsRailMarks .targetCell{font-weight:900!important;font-size:22px!important;letter-spacing:.5px}.playersPane[data-premium="0"] .playerCard.active{background:#00b45a2e;border-color:#00b45a8c}.playersPane[data-premium="1"] .playerCard.active{border-color:#fff;box-shadow:0 0 0 1px #ffffffbf,inset 0 0 0 1px #ffffff1f}