*,:before,:after{box-sizing:border-box}:root{--bg:#0c0c18;--surface:#16162a;--surface2:#1e1e35;--border:#2a2a45;--text:#c0c0d8;--text-dim:#6a6a8a;--text-h:#eef;--accent:#7c5cbf;--accent-bright:#a07de0;--red:#e05555;--green:#4c7;--yellow:#da3;--gold:#f0c030;--felt:#0d1f12;--felt2:#112218;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;font:15px/1.5 system-ui,Segoe UI,sans-serif}body{margin:0}#root{flex-direction:column;min-height:100svh;display:flex}h1,h2,h3{color:var(--text-h);margin:0}p{margin:0}button{cursor:pointer;font-family:inherit}.home-page{flex-direction:column;gap:40px;max-width:680px;margin:0 auto;padding:48px 24px;display:flex}.home-hero h1{margin-bottom:10px;font-size:42px}.home-hero p{color:var(--text-dim)}.home-options{flex-direction:column;gap:12px;display:flex}.home-option{background:var(--surface);border:1px solid var(--border);color:var(--text);text-align:left;border-radius:10px;align-items:center;gap:16px;padding:18px 20px;transition:border-color .15s,background .15s;display:flex}.home-option:not(:disabled):hover{border-color:var(--accent);background:var(--surface2)}.home-option:disabled{opacity:.45;cursor:not-allowed}.home-option.primary{border-color:var(--accent)}.option-icon{flex-shrink:0;font-size:28px}.option-title{color:var(--text-h);font-size:16px;font-weight:600;display:block}.option-desc{color:var(--text-dim);margin-top:2px;font-size:13px;display:block}.home-option>span{flex-direction:column;display:flex}.home-rules{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:20px 24px}.home-rules h3{text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim);margin-bottom:10px;font-size:13px}.home-rules ul{margin:0;padding-left:20px}.home-rules li{color:var(--text-dim);margin-bottom:6px;font-size:13px}.solo-page{flex-direction:column;height:100svh;display:flex;overflow:hidden}.page-header{background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0;align-items:center;gap:16px;padding:8px 16px;display:flex}.page-header h1{letter-spacing:.02em;font-size:17px;font-weight:600}.btn-back{border:1px solid var(--border);color:var(--text-dim);background:0 0;border-radius:6px;padding:4px 10px;font-size:13px;transition:color .15s,border-color .15s}.btn-back:hover{color:var(--text-h);border-color:var(--text-dim)}.game-setup{flex-direction:column;gap:24px;max-width:560px;margin:0 auto;padding:32px 24px;display:flex;overflow-y:auto}.game-setup h2{font-size:22px}.setup-section{flex-direction:column;gap:8px;display:flex}.setup-section>label{color:var(--text-dim);text-transform:uppercase;letter-spacing:.08em;font-size:12px}.setup-section input:not([type=radio]){background:var(--surface);border:1px solid var(--border);color:var(--text-h);border-radius:6px;outline:none;width:100%;padding:8px 12px;font-family:inherit;font-size:15px}.setup-section input:focus{border-color:var(--accent)}.radio-group{flex-direction:column;gap:8px;display:flex}.radio-option{background:var(--surface);border:1px solid var(--border);cursor:pointer;border-radius:8px;flex-direction:column;padding:12px 14px;transition:border-color .15s;display:flex;position:relative}.radio-option input[type=radio]{opacity:0;width:0;height:0;position:absolute}.radio-option:hover{border-color:var(--text-dim)}.radio-option.selected{border-color:var(--accent-bright);background:var(--surface2)}.radio-option .option-label{color:var(--text-h);font-size:14px;font-weight:600}.radio-option .option-desc{color:var(--text-dim);margin-top:2px;font-size:12px}.btn-start{background:var(--accent);color:#fff;border:none;border-radius:8px;padding:12px;font-size:16px;font-weight:600;transition:background .15s}.btn-start:hover{background:var(--accent-bright)}.game-board{background:var(--bg);flex-direction:column;flex:1;gap:0;display:flex;overflow:hidden}.king-banner,.curse-banner{text-align:center;letter-spacing:.02em;flex-shrink:0;padding:7px 16px;font-size:13px;font-weight:600}.king-banner{color:var(--gold);background:#f0c0301f;border-bottom:1px solid #f0c0304d}.curse-banner{color:#c080e0;background:#a050c81f;border-bottom:1px solid #a050c84d}.board-main{flex-direction:column;flex:1;min-height:0;display:flex;overflow:hidden}.player-zone{background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0;align-items:center;gap:12px;padding:10px 16px;display:flex;overflow:visible}.player-zone.bottom{border-bottom:none;border-top:1px solid var(--border)}.player-panel{flex-direction:column;flex-shrink:0;gap:5px;width:160px;display:flex}.player-panel.active .player-name{color:var(--gold)}.player-panel.ghost{opacity:.6}.player-header{align-items:center;gap:6px;display:flex}.player-name{color:var(--text-h);white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:700;transition:color .2s;overflow:hidden}.hp-row{align-items:center;gap:8px;display:flex}.hp-bar-container{background:#ffffff12;border-radius:4px;flex:1;height:8px;overflow:hidden}.hp-bar{border-radius:4px;height:100%;transition:width .4s,background .4s}.hp-number{white-space:nowrap;text-align:right;min-width:36px;font-size:14px;font-weight:700;transition:color .4s}.hp-max{color:var(--text-dim);font-size:11px;font-weight:400}.pile-counts{color:var(--text-dim);gap:10px;font-size:12px;display:flex}.dice-tray{align-items:center;gap:5px;margin-top:2px;display:flex}.die{border:1px solid var(--border);background:var(--surface2);width:26px;height:26px;color:var(--text-dim);border-radius:5px;flex-shrink:0;justify-content:center;align-items:center;font-size:13px;font-weight:700;display:flex}.die.ready{border-color:var(--accent);color:var(--accent-bright)}.die.spent{opacity:.35}.table-area{flex:1;align-items:stretch;min-height:0;display:flex;overflow:hidden}.table-felt{background:radial-gradient(#152b1c 0%,#0d1c12 60%,#090f0b 100%);flex:1;justify-content:center;align-items:center;display:flex;position:relative}.table-felt:before{content:"";pointer-events:none;background-image:repeating-linear-gradient(0deg,#0000,#0000 24px,#ffffff03 24px 25px),repeating-linear-gradient(90deg,#0000,#0000 24px,#ffffff03 24px 25px);position:absolute;inset:0}.room-display{z-index:1;flex-direction:column;align-items:center;gap:10px;display:flex;position:relative}.room-name{text-transform:uppercase;letter-spacing:.12em;color:#ffffff73;background:#0000004d;border:1px solid #ffffff1a;border-radius:20px;padding:3px 12px;font-size:12px;font-weight:700}.room-meta{color:#ffffff59;letter-spacing:.04em;font-size:13px}.room-monster .room-name{color:#f99;border-color:#e0555566}.room-trap .room-name{color:#8cf;border-color:#64b4ff4d}.room-blessing .room-name{color:#8e9;border-color:#55c87866}.room-treasure .room-name{color:var(--gold);border-color:#f0c03066}.room-joker .room-name{color:#d8f;border-color:#c864f066}.room-jack .room-name,.room-queen .room-name,.room-king .room-name,.room-ace .room-name{color:#ffc060;border-color:#ffb43266}.dungeon-pile-display{opacity:.45;z-index:1;flex-direction:column;align-items:center;gap:6px;display:flex;position:relative}.pile-icon{font-size:72px;line-height:1}.pile-count{color:var(--text-h);font-size:18px;font-weight:700}.pile-label{color:var(--text-dim);text-transform:uppercase;letter-spacing:.08em;font-size:12px}.table-meta{background:#00000040;border-left:1px solid #ffffff0f;flex-direction:column;flex-shrink:0;justify-content:center;gap:14px;width:130px;padding:16px 12px;display:flex}.meta-row{flex-direction:column;gap:2px;display:flex}.meta-label{text-transform:uppercase;letter-spacing:.1em;color:var(--text-dim);font-size:10px}.meta-val{color:var(--text-h);word-break:break-word;font-size:13px;font-weight:600}.card-wrap{flex-shrink:0;display:inline-flex;position:relative}.card-tooltip{border:1px solid var(--border);color:var(--text-h);white-space:nowrap;pointer-events:none;background:#141428;border-radius:7px;padding:6px 11px;font-size:12px;box-shadow:0 6px 18px #0009}.playing-card{-webkit-user-select:none;user-select:none;background:#fafafa;border:1.5px solid #d0d0d0;border-radius:9px;flex-direction:column;flex-shrink:0;justify-content:space-between;align-items:stretch;width:78px;height:112px;padding:5px;font-weight:700;transition:transform .12s,box-shadow .12s;display:flex;position:relative;box-shadow:0 3px 10px #00000059,inset 0 1px #fffc}.playing-card.red{color:#c81414}.playing-card.black{color:#0a0a0a}.card-corner{flex-direction:column;align-items:center;gap:1px;line-height:1.05;display:flex}.card-corner.br{align-self:flex-end;transform:rotate(180deg)}.c-rank{font-size:17px;font-weight:800}.c-suit{font-size:13px}.card-center-pip{opacity:.85;pointer-events:none;font-size:36px;line-height:1;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.face-pip{opacity:.9;font-size:40px;font-weight:900}.joker-pip{font-size:34px}.joker-label{letter-spacing:.1em;color:#555;white-space:nowrap;font-size:9px;font-weight:700;position:absolute;bottom:24px;left:50%;transform:translate(-50%)}.playing-card.joker{background:linear-gradient(160deg,#fff 0%,#f8f4ff 100%)}.playing-card.room-size{border-width:2px;border-radius:12px;width:112px;height:160px;padding:7px;box-shadow:0 8px 32px #0009,0 0 0 1px #ffffff1a,inset 0 1px #fffc}.playing-card.room-size .c-rank{font-size:22px}.playing-card.room-size .c-suit{font-size:17px}.playing-card.room-size .card-center-pip{font-size:52px}.playing-card.room-size .face-pip{font-size:58px}.playing-card.playable{cursor:pointer;box-shadow:0 3px 10px #0000004d, 0 0 0 2.5px var(--accent), inset 0 1px 0 #fffc}.playing-card.playable:hover{box-shadow:0 12px 28px #7c5cbf80, 0 0 0 2.5px var(--accent);transform:translateY(-8px)scale(1.04)}.playing-card.selected{box-shadow:0 12px 32px #f0c0308c, 0 0 0 2.5px var(--gold);transform:translateY(-10px)scale(1.04)}.playing-card.disabled{opacity:.3}.playing-card.facedown{background:linear-gradient(145deg,#1a237e,#283593);border-color:#3949ab;box-shadow:0 3px 10px #0006}.hand{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex;overflow:visible}.hand-label{color:var(--text-dim);text-transform:uppercase;letter-spacing:.07em;font-size:10px}.hand-cards{align-items:flex-end;padding-bottom:6px;padding-left:12px;display:flex;overflow:visible}.facedown-row{align-items:flex-start;padding-top:6px;padding-bottom:0}.hand-fan-slot{transform:rotate(var(--r,0deg)) translateY(var(--a,0px));z-index:1;margin-left:-18px;transition:transform .15s;position:relative}.hand-fan-slot:first-child{margin-left:0}.hand-fan-slot:hover{z-index:20;transition:transform .12s;transform:translateY(-14px)rotate(0)!important}.card-back{background:linear-gradient(145deg,#1a237e,#283593);border:1.5px solid #3949ab;border-radius:9px;width:78px;height:112px;position:relative;overflow:hidden;box-shadow:0 3px 10px #0006}.card-back:after{content:"";background:repeating-linear-gradient(45deg,#6482ff0d,#6482ff0d 3px,#0000 3px 6px);border:1px solid #6482ff4d;border-radius:5px;position:absolute;inset:6px}.hand-empty{color:var(--text-dim);padding:4px 0;font-size:12px}.action-prompt{background:var(--surface);border-top:1px solid var(--border);flex-direction:column;flex-shrink:0;gap:10px;padding:12px 16px;display:flex}.action-prompt.warning{border-top-color:var(--red);background:#e055550f}.action-prompt.ghost{border-top-color:var(--text-dim);background:#64648c12}.action-prompt.joker{border-top-color:var(--gold);background:#f0c0300f}.action-prompt.king-boss{border-top-color:var(--gold);background:#f0c03014}.action-prompt.game-over{border-top-color:var(--accent-bright);text-align:center;background:#a07de014}.prompt-text{color:var(--text);font-size:14px}.prompt-text strong{color:var(--text-h)}.prompt-hint{color:var(--text-dim);font-size:12px}.prompt-title{color:var(--text-h);font-size:14px;font-weight:600}.prompt-actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.btn{border:1px solid var(--border);background:var(--surface2);color:var(--text);border-radius:7px;padding:6px 13px;font-family:inherit;font-size:13px;transition:background .12s,border-color .12s,color .12s}.btn:hover:not(:disabled){background:var(--surface);border-color:var(--text-dim);color:var(--text-h)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-draw{color:#7d7;letter-spacing:.02em;background:linear-gradient(135deg,#1a3a1a,#223a22);border:1px solid #3a6a3a;border-radius:8px;padding:9px 22px;font-family:inherit;font-size:14px;font-weight:700;transition:background .12s,box-shadow .12s;box-shadow:0 2px 8px #32963233}.btn-draw:hover{background:linear-gradient(135deg,#223a22,#2a4a2a);box-shadow:0 4px 14px #3296324d}.btn-attack{border-color:var(--red);color:#f88;background:#e055551a}.btn-attack:hover:not(:disabled){background:#e0555533}.btn-skip{background:var(--surface2);border-color:var(--border);color:var(--text-dim)}.btn-block{border-color:var(--green);color:#8da;background:#44cc771a}.btn-block:hover:not(:disabled){background:#4c73}.btn-roll{border-color:var(--gold);color:var(--gold);background:#f0c0301a;font-weight:600}.btn-roll:hover:not(:disabled){background:#f0c03033}.btn-confirm{border-color:var(--accent);color:var(--accent-bright);background:#7c5cbf26;font-weight:600}.btn-confirm:hover:not(:disabled){background:#7c5cbf47}.btn-end-turn{border:1px solid var(--accent);color:var(--accent-bright);background:#7c5cbf1f;border-radius:8px;padding:9px 22px;font-family:inherit;font-size:14px;font-weight:700;transition:background .12s,box-shadow .12s}.btn-end-turn:hover{background:#7c5cbf38;box-shadow:0 2px 10px #7c5cbf4d}.btn-primary{background:var(--accent);color:#fff;border:none;border-radius:8px;padding:10px 28px;font-family:inherit;font-size:15px;font-weight:700;transition:background .15s}.btn-primary:hover{background:var(--accent-bright)}.play-again{flex-shrink:0;justify-content:center;padding:10px;display:flex}.dice-row{align-items:center;gap:8px;display:flex}.dice-result{color:var(--gold);text-align:center;min-width:32px;font-size:22px;font-weight:700}.target-list{flex-direction:column;gap:6px;display:flex}.target-btn{background:var(--surface2);border:1px solid var(--border);color:var(--text);text-align:left;border-radius:7px;padding:8px 14px;font-family:inherit;font-size:13px;transition:border-color .12s}.target-btn:hover{border-color:var(--red);color:var(--text-h)}.ace-choice{background:var(--surface2);border:1px solid var(--accent);border-radius:8px;flex-direction:column;gap:8px;padding:12px;display:flex}.ace-choice p{color:var(--text-dim);margin-bottom:4px;font-size:13px}.ace-choice .prompt-actions{margin-top:4px}.king-select-area{flex-direction:column;gap:8px;display:flex}.king-select-area p{color:var(--text-dim);font-size:13px}.selected-club-info{color:var(--gold);font-size:13px}.game-over-winner{color:var(--text-h);margin:4px 0;font-size:26px;font-weight:700}.game-over-scores{justify-content:center;gap:20px;margin-top:6px;display:flex}.score-item{color:var(--text-dim);font-size:13px}.score-item strong{color:var(--text-h);font-size:16px;display:block}.event-toast{color:var(--text-h);opacity:0;pointer-events:none;z-index:500;text-align:center;background:#080814f2;border:1px solid #7c5cbf80;border-radius:14px;max-width:480px;padding:16px 28px;font-size:16px;font-weight:600;line-height:1.5;transition:opacity .2s,transform .2s;position:fixed;top:42%;left:50%;transform:translate(-50%)translateY(-50%)scale(.92);box-shadow:0 16px 48px #000c}.event-toast.in{opacity:1;transition:opacity .2s,transform .2s;transform:translate(-50%)translateY(-50%)scale(1)}.event-toast.out{opacity:0;transition:opacity 1.4s,transform 1.4s;transform:translate(-50%)translateY(-38%)scale(.95)}.game-log{background:var(--surface);border-top:1px solid var(--border);flex-shrink:0;max-height:88px;padding:6px 14px;overflow-y:auto}.log-header{text-transform:uppercase;letter-spacing:.1em;color:var(--text-dim);margin-bottom:4px;font-size:10px}.log-entries{flex-direction:column;gap:2px;display:flex}.log-entry{color:var(--text-dim);gap:8px;font-size:12px;display:flex}.log-turn{color:#fff3;flex-shrink:0;font-size:11px}.log-msg{color:var(--text-dim)}.log-empty{color:#ffffff26;font-size:12px;font-style:italic}.loading-screen{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:16px;padding:48px 24px;display:flex}.loading-screen h2{color:var(--text-h)}.loading-screen p{color:var(--text-dim)}.share-link-row{gap:8px;width:100%;max-width:480px;display:flex}.share-link-input{background:var(--surface2);border:1px solid var(--border);color:var(--text);cursor:text;border-radius:6px;flex:1;padding:8px 12px;font-size:13px}.btn-copy{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:8px 16px;font-size:13px}.btn-copy:hover{background:var(--accent-bright)}.error-text{color:var(--red);font-size:13px}.reconnect-badge{background:var(--yellow);color:#000;border-radius:4px;margin-left:auto;padding:2px 8px;font-size:12px}.action-prompt.waiting{background:var(--surface2);border-color:var(--border);color:var(--text-dim)}.action-prompt.waiting .prompt-title{color:var(--text-dim)}
