:root{--bg:#ececec;--surface:#fff;--text:#141414;--muted:#5d5d5d;--border:#d4d4d4;--green:#1eaf4b;--red:#d63c3c;--radius:16px;--shadow:0 10px 30px #00000014;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}body{background:var(--bg);margin:0}#root{min-height:100vh}.page{gap:12px;width:min(680px,100%);margin:0 auto;padding:24px 16px 40px;display:grid}.brand{text-align:center;place-items:center;gap:8px;display:grid}.brand__logo{aspect-ratio:1;color:#fff;background:#000;border-radius:50%;place-items:center;width:82px;font-size:46px;font-weight:800;display:grid}h1,h2,p{margin:0}h1{font-size:1.7rem}h2{font-size:1.2rem}.card{border:1px solid var(--border);background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);gap:12px;padding:16px;display:grid}.header{justify-content:space-between;align-items:center;gap:10px;display:flex}.header__left{align-items:center;gap:8px;display:flex}.stack{gap:8px;display:grid}.split{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.field{gap:6px;font-size:.93rem;font-weight:600;display:grid}input,select,.btn{border:1px solid var(--border);border-radius:12px;min-height:44px;padding:0 12px;font-size:1rem}.btn{cursor:pointer;background:#fff;font-weight:700}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--small{min-height:36px;font-size:.9rem}.btn--primary{color:#fff;background:#000}.btn--ready{background:var(--green);color:#fff;border-color:var(--green)}.btn--danger{background:var(--red);color:#fff;border-color:var(--red)}.muted{color:var(--muted);font-size:.92rem}.error{color:#b62a2a;margin:0;font-weight:700}.avatar{color:#fff;background:#000;border-radius:999px;place-items:center;font-weight:700;display:grid}.avatar--md{width:40px;height:40px;font-size:1.1rem}.avatar--sm{width:32px;height:32px;font-size:.95rem}.avatarPicker{grid-auto-columns:1fr;grid-auto-flow:column;gap:8px;width:100%;display:grid}.avatarPick{aspect-ratio:1;border:1px solid var(--border);cursor:pointer;background:#fff;border-radius:999px;place-items:center;width:100%;min-height:0;padding:0;font-size:1.3rem;display:grid}.avatarPick--taken{opacity:.35;cursor:not-allowed}.avatarPick--selected{border-color:#111;box-shadow:inset 0 0 0 2px #111}.playerList,.playerStack{gap:8px;display:grid}.playerRow{border:1px solid var(--border);border-radius:12px;justify-content:space-between;align-items:center;gap:8px;padding:8px 10px;display:flex}.resultsStats{grid-template-columns:repeat(4,minmax(56px,auto));place-items:center end;column-gap:14px;margin-left:auto;display:grid}.resultsStat{text-align:right;display:block}.resultsStat strong{font-variant-numeric:tabular-nums}.resultsStats--head{color:var(--muted);font-size:.78rem;font-weight:700}.resultsHeaderRow{border:0;padding-top:0;padding-bottom:0}.ready{color:var(--muted);font-weight:700}.ready--yes{color:var(--green)}.center{text-align:center;justify-items:center}.ballReveal{cursor:pointer;background:0 0;border:0;place-items:center;gap:8px;display:grid}.ballReveal--multi{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;display:flex}.ballReveal--multi .ball{width:clamp(64px,12vw,88px)}.ballGrid{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;display:grid}.ball{--ball-color:#333;aspect-ratio:1;background:var(--ball-color);color:#111;cursor:pointer;border:3px solid #111;border-radius:999px;place-items:center;width:100%;padding:0;font-weight:800;display:grid;position:relative;overflow:hidden}.ball:disabled{cursor:default}.ball__face{aspect-ratio:1;z-index:1;background:#fff;border:2px solid #111;border-radius:999px;place-items:center;width:52%;display:grid}.ball__face span{letter-spacing:-.06em;font-size:clamp(1.2rem,4.1vw,1.65rem);font-weight:800;line-height:1}.ball--striped{background:#fff}.ball--striped:before{content:"";background:var(--ball-color);position:absolute;inset:20% 0}.ball--sunk{background:#9e9e9e;position:relative;--ball-color:#9e9e9e!important}.ball--sunk .ball__face{background:#e3e3e3;border-color:#8f8f8f}.ball--sunk.ball--striped{background:#dbdbdb}.ball--sunk.ball--striped:before{background:#9e9e9e}.ball--sunk:after{content:"";z-index:6;background:red;border-radius:999px;width:170%;height:10px;position:absolute;top:calc(50% - 5px);left:-35%;transform:rotate(-30deg)}.ball--large{border-width:4px;width:min(260px,72vw);box-shadow:0 12px 24px #0000001f}.ball--large .ball__face{border-width:3px;width:56%}.ball--large .ball__face span{letter-spacing:-.04em;font-size:4.6rem;font-weight:800}.myBallDock{flex-wrap:wrap;gap:6px;display:flex}.myBallDock .ball{width:38px;height:38px}.headerBallIndicator{align-items:center;gap:6px;display:flex}.headerBallIndicator .ball{width:42px;height:42px}.headerBallIndicator .ball .ball__face{width:58%}.headerBallIndicator .ball .ball__face span{letter-spacing:-.08em;font-size:.72rem}.orderRow{grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:8px;display:grid}.orderCard{border:1px solid var(--border);border-radius:12px;place-items:center;gap:6px;padding:8px;display:grid}.playersRow{grid-auto-columns:1fr;grid-auto-flow:column;gap:8px;width:100%;display:grid}.playerMiniCard{border:1px solid var(--border);background:#fff;border-radius:12px;gap:6px;min-width:0;padding:8px;display:grid}.playerMiniCard--turn{border-color:#111;box-shadow:inset 0 0 0 2px #111}.playerMiniCard--in{background:#bdeec8}.playerMiniCard--out{background:#f6bcbc}.turnBadge{color:#fff;letter-spacing:.04em;background:#111;border-radius:999px;padding:2px 8px;font-size:.68rem;font-weight:700}.playerMiniPots{flex-wrap:wrap;justify-content:center;gap:4px;min-height:22px;display:flex}.playerMiniPots .ball{border-width:2px;width:20px;height:20px}.playerMiniPots .ball .ball__face{border-width:1px}.playerMiniPots .ball .ball__face span{letter-spacing:-.04em;font-size:.48rem}.turnText{font-size:1.1rem}.previewStage{border:1px solid var(--border);background:#f7f7f7;border-radius:12px;place-items:center;min-height:250px;padding:12px;display:grid}.previewStage--cards{overflow:hidden}.shuffleTable{width:100%;height:230px;position:relative}.dealSlots{pointer-events:none;position:absolute;inset:0}.dealSlot{width:min(calc(100% / var(--slot-count,6)), 136px);aspect-ratio:2/3;background:#ffffff73;border:1px dashed #c9c9c9;border-radius:10px;height:auto;transition:border-color .12s,background .12s,transform .12s;position:absolute;top:50%;transform:translate(-50%,-50%)}.dealSlot--active{background:#fffffff2;border-color:#111;transform:translate(-50%,calc(-50% - 2px))}.dealCard{width:min(calc(100% / var(--slot-count,6)), 136px);aspect-ratio:2/3;transform-style:preserve-3d;z-index:2;transition:left .38s cubic-bezier(.2,.75,.2,1),transform .38s cubic-bezier(.2,.75,.2,1);position:absolute;top:50%}.dealCard__inner{width:100%;height:100%;transform-style:preserve-3d;transition:transform .36s;position:relative}.dealCard--down .dealCard__inner{transform:rotateY(180deg)}.dealCard__face{backface-visibility:hidden;border:2px solid #111;border-radius:10px;position:absolute;inset:0}.dealCard__face--front{background:#fff;place-items:center;gap:6px;display:grid}.dealCard__face--front small{font-size:clamp(.42rem, calc(1.04rem - (var(--slot-count,6) * .075rem)), .76rem);line-height:1.05}.dealCard__face--back{color:#fff;background-color:#9e1111;background-image:repeating-linear-gradient(45deg,#ffffff14 0 6px,#00000014 6px 12px),repeating-linear-gradient(-45deg,#ffffff14 0 6px,#00000014 6px 12px);place-items:center;display:grid;transform:rotateY(180deg)}.dealCardIcon{font-size:clamp(.8rem, calc(1.58rem - (var(--slot-count,6) * .09rem)), 1.3rem)}.backMark{aspect-ratio:1;background:#fff3;border:1px solid #ffffffa6;border-radius:999px;place-items:center;width:28px;font-weight:800;display:grid}.rankCorner{font-weight:800;font-size:clamp(.5rem, calc(.93rem - (var(--slot-count,6) * .05rem)), .74rem);color:#111;position:absolute;top:4px;left:6px}.breakerName{opacity:0;min-width:1ch;transition:opacity .85s,transform .85s;display:inline-block;transform:translateY(4px)}.breakerName--visible{opacity:1;transform:translateY(0)}.previewControls{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.previewControls input[type=range]{width:100%}.leaveGameBtn{color:#6d6d6d;letter-spacing:.02em;cursor:pointer;background:0 0;border:0;width:fit-content;margin:6px auto 0;padding:4px 6px;font-size:.78rem}@media (width<=520px){.split,.previewControls{grid-template-columns:1fr}}