*,:before,:after{box-sizing:border-box;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;touch-action:manipulation;overscroll-behavior:none;margin:0;font-family:system-ui,Segoe UI,Roboto,sans-serif}#root{flex-direction:column;width:100%;min-height:100vh;display:flex}:root{--card-w:90px;--card-h:126px;--card-r:8px;--gap:12px;--felt:#1a6b35;--felt-dark:#145628;--p1:#1565c0;--p1-light:#bbdefb;--p2:#b71c1c;--p2-light:#ffcdd2;--gold:gold;--green-glow:#66bb6a;--red-card:#c62828;--black-card:#1a1a1a;--bar-bg:#00000073}@media (width<=768px){:root{--gap:5px;--card-w:calc((100vw - 24px - 6 * 5px) / 7);--card-h:calc(var(--card-w) * 1.4);--card-r:5px}}*,:before,:after{box-sizing:border-box}body{background:var(--felt-dark);color:#fff;min-height:100vh;margin:0;font-family:system-ui,Segoe UI,Roboto,sans-serif}#root{text-align:left;border:none;flex-direction:column;width:100%;min-height:100vh;display:flex}h1,h2,h3{margin:0;font-weight:700}p{margin:0}button{cursor:pointer;border:none;font-family:inherit}.setup-screen{background:radial-gradient(ellipse at 50% 0%, #2e7d52 0%, var(--felt-dark) 70%);flex:1;justify-content:center;align-items:center;padding:24px 16px;display:flex}.setup-card{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#00000080;border:1px solid #ffffff1f;border-radius:16px;flex-direction:column;gap:28px;width:100%;max-width:560px;padding:40px;display:flex}.setup-title{letter-spacing:-1px;color:#fff;text-align:center;font-size:48px}.title-duo{color:var(--gold)}.setup-sub{text-align:center;color:#fff9;margin-top:-20px;font-size:15px}.setup-players{align-items:center;gap:12px;display:flex}.setup-player{flex-direction:column;flex:1;gap:8px;display:flex}.setup-player label{text-transform:uppercase;letter-spacing:.5px;color:#fff9;font-size:13px;font-weight:600}.setup-player.p1 label{color:var(--p1-light)}.setup-player.p2 label{color:var(--p2-light)}.setup-player input{color:#fff;background:#ffffff14;border:2px solid #ffffff26;border-radius:8px;outline:none;width:100%;padding:10px 14px;font-size:16px;font-weight:600;transition:border-color .2s}.setup-player.p1 input:focus{border-color:var(--p1)}.setup-player.p2 input:focus{border-color:var(--p2)}.vs-badge{color:#fff6;flex-shrink:0;padding-top:28px;font-size:14px;font-weight:800}.setup-options{flex-direction:column;gap:8px;display:flex}.option-label{text-transform:uppercase;letter-spacing:.5px;color:#fff9;align-items:center;gap:8px;font-size:13px;font-weight:600;display:flex}.optional-tag{text-transform:none;letter-spacing:0;background:#ffffff1a;border-radius:10px;padding:2px 8px;font-size:11px;font-weight:400}.time-row{align-items:center;gap:10px;display:flex}.time-row input{color:#fff;background:#ffffff14;border:2px solid #ffffff26;border-radius:8px;outline:none;width:120px;padding:10px 14px;font-size:16px;transition:border-color .2s}.time-row input:focus{border-color:var(--gold)}.time-row input::placeholder{color:#ffffff4d}.unit{color:#ffffff80;font-size:14px}.btn-deal{color:#fff;letter-spacing:.5px;background:linear-gradient(135deg,#2e7d52,#1b5e20);border-radius:10px;padding:14px;font-size:18px;font-weight:700;transition:transform .15s,box-shadow .15s;box-shadow:0 4px 16px #0006}.btn-deal:hover{transform:translateY(-1px);box-shadow:0 6px 20px #00000080}.btn-deal:active{transform:translateY(0)}.rules{border-top:1px solid #ffffff1a;padding-top:20px}.rules h3{text-transform:uppercase;letter-spacing:.5px;color:#ffffff80;margin-bottom:12px;font-size:13px}.rules ul{flex-direction:column;gap:6px;margin:0;padding:0 0 0 16px;display:flex}.rules li{color:#ffffffa6;font-size:13px;line-height:1.5}.online-section{border-top:1px solid #ffffff1a;flex-direction:column;gap:12px;padding-top:20px;display:flex}.online-divider{text-transform:uppercase;letter-spacing:.6px;color:#ffffff59;text-align:center;font-size:12px}.online-row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.online-sep{color:#ffffff40;flex-shrink:0}.join-input{color:#fff;letter-spacing:2px;text-transform:uppercase;background:#ffffff14;border:2px solid #ffffff26;border-radius:8px;outline:none;flex:1;min-width:100px;padding:8px 12px;font-size:15px;font-weight:700;transition:border-color .2s}.join-input:focus{border-color:var(--gold)}.join-input::placeholder{letter-spacing:1px;opacity:.5;font-weight:400}.btn-secondary{color:#fff;cursor:pointer;white-space:nowrap;background:#ffffff14;border:2px solid #fff3;border-radius:8px;padding:8px 16px;font-size:14px;font-weight:600;transition:background .15s,border-color .15s}.btn-secondary:hover{background:#ffffff24;border-color:#ffffff59}.btn-secondary:disabled{opacity:.35;cursor:default}.lobby-status{text-align:center;color:#ffffffb3;font-size:15px}.lobby-code{letter-spacing:6px;text-align:center;color:var(--gold);padding:8px 0;font-size:40px;font-weight:800}.lobby-hint{text-align:center;color:#ffffff73;font-size:13px}.lobby-error{color:#ef9a9a}.game-shell{background:var(--felt);background-image:radial-gradient(ellipse at 50% 0%, #2e7d52 0%, var(--felt) 60%);flex-direction:column;flex:1;display:flex;position:relative}.game-shell.opponent-turn:after{content:"";pointer-events:none;z-index:10;background:#0000002e;transition:opacity .3s;position:absolute;inset:0}.board-scroll{flex:1;justify-content:center;align-items:flex-start;padding:20px;display:flex;overflow:auto}.player-bar{background:var(--bar-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid #ffffff14;flex-shrink:0;justify-content:space-between;align-items:center;gap:12px;padding:12px 20px;display:flex}.player-chip{background:#ffffff0a;border:2px solid #0000;border-radius:10px;min-width:150px;padding:10px 16px;transition:background .25s,border-color .25s;position:relative}.player-chip.active.p1{border-color:var(--p1);background:#1565c033}.player-chip.active.p2{border-color:var(--p2);background:#b71c1c33}.chip-name{color:#fff;font-size:16px;font-weight:700}.chip-status{margin-top:3px;font-size:12px}.chip-active-label{color:var(--gold);font-weight:600}.chip-waiting{color:#fff6}.bar-center{flex-direction:column;flex:1;align-items:center;gap:6px;display:flex}.game-timer{flex-direction:column;align-items:center;display:flex}.timer-label{text-transform:uppercase;letter-spacing:.5px;color:#ffffff73;font-size:10px}.timer-value{color:#fff;font-variant-numeric:tabular-nums;letter-spacing:1px;font-size:26px;font-weight:700}.turn-elapsed{color:#ffffff80;font-variant-numeric:tabular-nums;font-size:12px}.turn-timer-wrap{flex-direction:column;align-items:center;gap:4px;width:120px;display:flex}.turn-remaining{color:var(--green-glow);font-variant-numeric:tabular-nums;font-size:18px;font-weight:700}.turn-remaining.urgent{color:#ef5350;animation:.8s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.turn-bar-bg{background:#ffffff26;border-radius:2px;width:100%;height:4px;overflow:hidden}.turn-bar-fill{background:var(--green-glow);border-radius:2px;height:100%;transition:width .5s linear,background .3s}.turn-bar-fill.urgent{background:#ef5350}.bar-stats{color:#fff6;font-size:11px}.stuck-warning{color:#ffb74d;background:#ffb74d1f;border:1px solid #ffb74d4d;border-radius:20px;padding:4px 12px;font-size:12px}.bar-actions{gap:8px;display:flex}.btn-end-turn{color:#fff;background:linear-gradient(135deg,#2e7d52,#1b5e20);border-radius:8px;padding:8px 18px;font-size:14px;font-weight:700;transition:transform .15s,box-shadow .15s;box-shadow:0 2px 8px #0000004d}.btn-end-turn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #0006}.btn-give-up{color:#ffffff80;background:#ffffff12;border:1px solid #ffffff1f;border-radius:8px;padding:8px 14px;font-size:13px;transition:background .15s,color .15s}.btn-give-up:hover{color:#ef9a9a;background:#b71c1c40;border-color:#b71c1c66}.game-board{width:fit-content;min-width:calc(7 * (var(--card-w) + var(--gap)) - var(--gap));flex-direction:column;gap:16px;display:flex}.board-top,.board-tableau{grid-template-columns:repeat(7, var(--card-w));gap:var(--gap);align-items:start;display:grid}.card-slot{width:var(--card-w);height:var(--card-h);position:relative}.foundation-slot{position:relative}.f-count{text-align:center;color:#ffffff73;font-variant-numeric:tabular-nums;font-size:10px;position:absolute;bottom:-18px;left:0;right:0}.valid-target-slot>.card,.valid-target-slot>.empty-slot{box-shadow:0 0 0 2px var(--green-glow), 0 0 16px #66bb6a80}.stock-card{position:relative}.stock-count{color:#ffffffb3;background:#0000004d;border-radius:3px;padding:1px 3px;font-size:10px;font-weight:700;position:absolute;bottom:4px;right:5px}.tableau-col{width:var(--card-w);position:relative}.card{width:var(--card-w);height:var(--card-h);border-radius:var(--card-r);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;flex-shrink:0;transition:box-shadow .15s,transform .15s;position:relative}.card.face-up{cursor:pointer;background:#fff;border:1px solid #0000001f;box-shadow:1px 2px 6px #00000040}.card.face-up:hover{transform:translateY(-2px);box-shadow:2px 4px 12px #00000059}.card.face-down{cursor:default;background:#1a237e;box-shadow:1px 2px 6px #0000004d}.card.red{color:var(--red-card)}.card.black{color:var(--black-card)}.card.selected{transform:translateY(-4px);border:2px solid var(--gold)!important;box-shadow:0 0 0 2px var(--gold), 0 0 20px #ffd70099!important;z-index:100!important}.card.valid-target{border:2px solid var(--green-glow)!important;box-shadow:0 0 0 2px var(--green-glow), 0 0 16px #66bb6a80!important}.card.card-dragging{opacity:.4;transform:none!important}.card-corner{flex-direction:column;align-items:center;gap:1px;line-height:1;display:flex;position:absolute}.top-left{top:4px;left:5px}.bottom-right{bottom:4px;right:5px;transform:rotate(180deg)}.card-val{font-size:calc(var(--card-w) * .19);letter-spacing:-.5px;font-weight:800}.card-suit-sm{font-size:calc(var(--card-w) * .15)}.card-center{font-size:calc(var(--card-w) * .47);opacity:.85;line-height:1;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.card-back{border-radius:calc(var(--card-r) - 1px);background:repeating-linear-gradient(45deg,#283593,#283593 5px,#1a237e 5px 10px);width:100%;height:100%}.empty-slot{cursor:default;border-radius:var(--card-r);background:#0003;border:2px dashed #fff3;justify-content:center;align-items:center;display:flex}.empty-slot.valid-target{border-color:var(--green-glow);background:#66bb6a1a;box-shadow:0 0 16px #66bb6a59}.empty-label{font-size:calc(var(--card-w) * .39);opacity:.45;line-height:1}.end-screen{background:radial-gradient(ellipse at 50% 0%, #2e7d52 0%, var(--felt-dark) 70%);flex:1;justify-content:center;align-items:center;padding:24px 16px;display:flex}.end-card{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);text-align:center;background:#0000008c;border:1px solid #ffffff1f;border-radius:16px;flex-direction:column;align-items:center;gap:24px;width:100%;max-width:480px;padding:48px 40px;display:flex}.end-emoji{font-size:56px;line-height:1}.end-title{letter-spacing:-1px;font-size:40px}.end-title.win{color:var(--gold)}.end-title.lose{color:#ffffffb3}.end-sub{color:#fff9;margin-top:-16px;font-size:15px}.end-stats{border:1px solid #ffffff1a;border-radius:10px;gap:32px;padding:16px 32px;display:flex}.stat{flex-direction:column;align-items:center;gap:4px;display:flex}.stat-label{text-transform:uppercase;letter-spacing:.5px;color:#fff6;font-size:11px}.stat-value{color:#fff;font-variant-numeric:tabular-nums;font-size:28px;font-weight:700}.end-players{flex-direction:column;gap:8px;width:100%;display:flex}.end-player-row{border-radius:8px;justify-content:space-between;align-items:center;padding:10px 16px;display:flex}.end-player-row.p1{background:#1565c033}.end-player-row.p2{background:#b71c1c33}.epr-name{color:#fff;font-weight:700}.epr-detail{color:#fff9;font-size:13px}.end-actions{gap:10px;width:100%;display:flex}.end-actions .btn-deal{flex:2}.btn-outline{color:#fff9;background:0 0;border:2px solid #ffffff26;border-radius:10px;flex:1;padding:14px;font-size:15px;font-weight:600;transition:border-color .2s,color .2s}.btn-outline:hover{color:#fff;border-color:#ffffff59}@media (width<=768px){.player-bar{flex-wrap:wrap;gap:8px;padding:8px 12px}.player-chip{flex:1;min-width:0;padding:8px 12px}.chip-name{font-size:14px}.bar-center{flex-flow:wrap;order:1;justify-content:center;gap:8px 16px;width:100%}.game-timer{flex-direction:row;align-items:baseline;gap:6px}.timer-label{font-size:11px}.timer-value{font-size:20px}.turn-timer-wrap{width:90px}.bar-stats,.stuck-warning{text-align:center;width:100%}.bar-actions{justify-content:center;width:100%}.btn-end-turn{flex:1;padding:11px 16px;font-size:15px}.btn-give-up{padding:11px 14px;font-size:14px}.board-scroll{justify-content:flex-start;align-items:flex-start;padding:12px}.setup-card{gap:20px;padding:24px 20px}.setup-title{font-size:36px}.end-card{padding:32px 20px}.end-title{font-size:32px}.end-stats{gap:20px;padding:12px 20px}.stat-value{font-size:22px}}