:root{--bg-primary: #fef5f8;--bg-secondary: #f8e8ef;--surface: #ffffff;--surface-alt: #fef8fa;--border: #f0ccd8;--border-light: #e8bcc8;--accent: #d898b0;--accent-hover: #c8859e;--accent-soft: #e8b8ca;--accent-softer: #f2d5df;--accent-muted: #e0c5d0;--accent-muted-hover: #d5b0be;--text-primary: #3a2030;--text-secondary: #886575;--text-body: #4a2e3e;--card-shadow: rgba(0, 0, 0, .12);--table-bg: #f8e8ef;--penalty-zone: #f0bcc8;--card-width: 90px;--card-height: 57px;--card-width-lg: 120px;--card-height-lg: 75px}[data-theme=dark]{--bg-primary: #1a0f14;--bg-secondary: #2d1420;--surface: #3a1a2b;--surface-alt: #462235;--border: #622e48;--border-light: #7c3a5b;--accent: #d898b0;--accent-hover: #e8b8ca;--accent-soft: #894565;--accent-softer: #5c2b42;--accent-muted: #492235;--accent-muted-hover: #5c2b42;--text-primary: #f8e8ef;--text-secondary: #e8b8ca;--text-body: #f0ccd8;--card-shadow: rgba(0, 0, 0, .5);--table-bg: #2d1420;--penalty-zone: #73304c}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:var(--bg-primary);min-height:100vh;color:var(--text-body);overflow:hidden;user-select:none;-webkit-user-select:none;touch-action:manipulation}.screen{display:none;width:100vw;height:100vh}.screen.active{display:flex}#lobby{justify-content:center;align-items:center;background:var(--bg-primary)}.lobby-container{background:var(--surface);padding:40px;border-radius:16px;border:1px solid var(--border);box-shadow:0 2px 12px #0000000f;text-align:center;max-width:420px;width:90%}.game-title{font-size:2.2rem;font-weight:800;margin-bottom:8px;color:var(--text-primary);letter-spacing:-.5px}.subtitle{color:var(--text-secondary);margin-bottom:25px;font-size:.9rem;font-weight:400}.menu-buttons{display:flex;flex-direction:column;gap:15px}.btn{padding:16px 28px;border:none;border-radius:12px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:10px;letter-spacing:.01em}.btn-large{padding:18px 30px;font-size:1rem}.btn-icon{font-size:1.3rem}.btn-primary{background:var(--accent);color:#fff;box-shadow:0 1px 3px #00000014}.btn-primary:hover{background:var(--accent-hover);transform:translateY(-1px);box-shadow:0 3px 8px #0000001a}.btn-primary:active{transform:translateY(0);box-shadow:0 1px 2px #00000014}.btn-secondary{background:var(--accent-softer);color:var(--text-body);box-shadow:0 1px 3px #0000000f}.btn-secondary:hover{background:var(--accent-muted-hover);transform:translateY(-1px);box-shadow:0 3px 8px #00000014}.btn-secondary:active{transform:translateY(0);box-shadow:0 1px 2px #0000000f}.form-card{background:var(--surface-alt);padding:25px;border-radius:14px;border:1px solid var(--border);display:flex;flex-direction:column;align-items:center}.form-card h3{margin-bottom:20px;color:var(--text-primary);font-size:1.1rem;font-weight:700}.input-group{margin-bottom:15px;text-align:left;width:100%}.input-group label{display:block;margin-bottom:6px;font-size:.82rem;color:var(--text-secondary);font-weight:500}.input-group input{width:100%;padding:13px 16px;border:1.5px solid var(--border-light);border-radius:10px;font-size:.95rem;font-family:inherit;transition:border-color .2s,box-shadow .2s;background:var(--surface);color:var(--text-body)}.input-group input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #e8a0a033}.input-group input::placeholder{color:var(--border-light)}.code-input{text-transform:uppercase;text-align:center;font-size:1.5rem!important;letter-spacing:8px;font-weight:700}.btn-link{background:none;border:none;color:var(--text-secondary);cursor:pointer;margin-top:15px;font-size:.85rem;padding:10px;transition:color .2s}.btn-link:hover{color:var(--text-primary)}.lobby-section{margin-top:20px}.room-info{margin-top:25px;display:flex;flex-direction:column;align-items:center}.code-display{background:var(--bg-secondary);padding:25px 30px;border-radius:14px;border:1px solid var(--border);margin-bottom:20px}.code-label{color:var(--text-secondary);font-size:.8rem;margin-bottom:8px;font-weight:500;text-transform:uppercase;letter-spacing:.08em}.room-code-box{font-size:2.5rem;font-weight:800;color:var(--text-primary);letter-spacing:10px}.btn-copy{margin-top:12px;background:var(--surface);color:var(--text-secondary);border:1px solid var(--border-light);padding:8px 18px;border-radius:8px;font-size:.82rem;font-weight:500;font-family:inherit;cursor:pointer;transition:all .2s}.btn-copy:hover{background:var(--surface-alt);border-color:var(--accent);color:var(--text-body)}.players-section,.lobby-section{margin-top:15px}.lobby-section input{margin-bottom:12px}.btn-back{background:none;border:none;color:var(--text-secondary);cursor:pointer;margin-top:15px;font-size:.9rem;padding:8px}.btn-back:hover{color:var(--text-primary)}.player-list{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:15px 0}.player-list .player-tag{background:var(--accent-softer);color:var(--text-body);padding:6px 14px;border-radius:8px;font-size:.85rem;font-weight:500;border:1px solid var(--border)}.player-list .player-tag.host{background:var(--accent);color:#fff;font-weight:600;border-color:var(--accent)}.waiting-text{color:var(--text-secondary);font-style:italic;font-size:.85rem;margin-top:10px}.hard-mode-toggle{margin:15px 0}.timer-setting{margin:10px 0 15px}.timer-select{padding:4px 8px;border-radius:6px;border:1px solid var(--border);background:var(--bg);color:var(--text);font-family:inherit;font-size:.95rem;margin-left:auto;outline:none;cursor:pointer}.timer-select:focus{border-color:var(--accent)}.toggle-label{display:flex;align-items:center;gap:10px;cursor:pointer;padding:10px 15px;background:var(--surface-alt);border-radius:10px;border:1.5px solid var(--accent-soft)}.toggle-label input[type=checkbox]{width:18px;height:18px;cursor:pointer;accent-color:var(--accent)}.toggle-text{font-weight:600;color:var(--accent-hover);font-size:.9rem}.hidden{display:none!important}.game-table{position:relative;width:100vw;height:100vh;height:100dvh;background:var(--bg-secondary);overflow:visible}.deck{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100px;height:70px;cursor:pointer;z-index:100}.deck-cards{position:relative;width:100%;height:100%}.deck-card{position:absolute;width:100%;height:100%;background-size:cover;background-position:center;border-radius:8px;box-shadow:0 2px 8px var(--card-shadow)}.deck-count{position:absolute;bottom:-25px;left:50%;transform:translate(-50%);background:var(--surface);padding:4px 12px;border-radius:10px;font-size:.85rem;font-weight:600;border:1px solid var(--border);box-shadow:0 1px 4px #0000000f}.deck:hover .deck-cards{transform:translateY(-3px)}.deck:active .deck-cards{transform:translateY(0)}.players-container{position:absolute;width:100%;height:100%;pointer-events:none}.player-slot{position:absolute;display:flex;flex-direction:column;align-items:center;pointer-events:auto;transform:translate(-50%,-50%)}.player-info{background:var(--surface);padding:6px 16px;border-radius:20px;margin-bottom:8px;box-shadow:0 2px 10px #0000000f;border:1px solid var(--border);display:flex;align-items:center;gap:8px}.player-name{font-weight:600;font-size:.9rem}.player-penalty{background:var(--accent-softer);color:var(--accent-hover);padding:2px 8px;border-radius:10px;font-size:.75rem;font-weight:700}.player-timer{width:90%;height:6px;background-color:var(--border);border-radius:3px;margin-bottom:8px;overflow:hidden;box-shadow:inset 0 1px 3px #0000001a}.timer-progress{height:100%;background-color:#4caf50;width:100%;border-radius:3px;transition:width .1s linear,background-color .3s ease}[data-theme=dark] .player-timer{background-color:#ffffff1a}.player-cards{display:flex;flex-direction:column-reverse;gap:8px;min-height:130px}.card-slot{width:var(--card-width);height:var(--card-height);border:2px dashed var(--border);border-radius:8px;display:flex;align-items:center;justify-content:center;background:#fff6}.card-slot.occupied{border:none;background:none}.card-slot.drag-over{border-color:var(--accent);background:#e8a0a026}.player-slot.current-player .player-info{background:var(--accent-soft);border-color:var(--accent-soft)}.player-slot.current-player .card-slot{width:var(--card-width-lg);height:var(--card-height-lg)}.player-slot.drag-over:not(.current-player){background:#e8a0a01f;border-radius:16px}.card{position:relative;width:var(--card-width);height:var(--card-height);cursor:grab;perspective:1000px;transition:transform .15s ease}.card.large{width:var(--card-width-lg);height:var(--card-height-lg)}.card:active{cursor:grabbing}.card-inner{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.4,0,.2,1)}.card.flipped .card-inner{transform:rotateY(180deg)}.card-face{position:absolute;width:100%;height:100%;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:8px;box-shadow:0 4px 15px var(--card-shadow);background-size:cover;background-position:center;background-repeat:no-repeat}.card-front{z-index:2}.card-back{transform:rotateY(180deg)}.card.dragging{opacity:.8;z-index:1000;transform:scale(1.05);pointer-events:none}.penalty-zone{position:fixed;bottom:15px;right:15px;padding:16px 28px;background:var(--accent);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:.9rem;color:#fff;font-weight:600;box-shadow:0 2px 8px #00000014;transition:all .2s ease;z-index:1000}.penalty-zone .penalty-text{writing-mode:horizontal-tb;text-orientation:mixed}.penalty-zone.drag-over{background:var(--accent-hover);transform:scale(1.18);box-shadow:0 4px 16px #e8a0a066}.fullscreen-btn{position:fixed;bottom:15px;left:15px;padding:10px 14px;background:var(--surface);border:1px solid var(--border);border-radius:10px;cursor:pointer;font-size:1rem;font-weight:600;color:var(--text-body);z-index:1000;transition:all .2s ease}.fullscreen-btn:hover{background:var(--surface-alt);border-color:var(--accent);box-shadow:0 2px 8px #00000014}.fullscreen-btn:active{transform:scale(.95)}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:9999}.modal-content{background:var(--surface);padding:40px;border-radius:16px;text-align:center;max-width:350px;width:90%;border:1px solid var(--border);box-shadow:0 8px 30px #0000001f;display:flex;flex-direction:column;align-items:center}.modal-content h2{font-size:2rem;margin-bottom:15px;color:var(--accent)}.modal-content p{margin-bottom:25px;color:var(--text-secondary)}.discard-history-modal{max-width:400px;max-height:80vh}.discard-history-modal h2{color:var(--accent);margin-bottom:20px}.discard-history-list{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;max-height:50vh;overflow-y:auto;padding:10px;margin-bottom:20px;width:100%}.discard-item{display:flex;flex-direction:column;align-items:center;gap:6px}.discard-card{width:70px;height:44px;background-size:cover;background-position:center;border-radius:6px;box-shadow:0 2px 8px #00000026}.discard-player{font-size:.75rem;color:var(--text-secondary);font-weight:500;max-width:70px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.no-discards{color:var(--text-secondary);font-style:italic;padding:20px}@media (max-width: 600px){:root{--card-width: 70px;--card-height: 44px;--card-width-lg: 90px;--card-height-lg: 57px}.lobby-container{padding:25px}.game-title{font-size:1.8rem}.deck{width:80px;height:55px;top:45%}.player-info{padding:2px 6px;font-size:.65rem;margin-bottom:4px;gap:4px}.player-name{font-size:.65rem}.player-penalty{font-size:.6rem;padding:1px 5px}.penalty-zone{padding:8px 14px;font-size:.75rem;bottom:8px;right:8px}.player-cards{gap:4px;min-height:95px}}@keyframes cardDraw{0%{transform:translate(-50%,-50%) scale(.5);opacity:0}to{transform:translate(0) scale(1);opacity:1}}@keyframes cardDiscard{0%{transform:scale(1);opacity:1}to{transform:scale(0) rotate(20deg);opacity:0}}.card.drawing{animation:cardDraw .4s ease forwards}.card.discarding{animation:cardDiscard .3s ease forwards}.turn-indicator{position:absolute;top:15px;left:50%;transform:translate(-50%);background:var(--surface);padding:10px 25px;border-radius:10px;font-size:.9rem;font-weight:500;border:1px solid var(--border);box-shadow:0 2px 8px #0000000f;z-index:200;text-align:center}.turn-indicator.your-turn{background:var(--accent-softer);border-color:var(--accent-soft);font-weight:700}.gift-modal{max-width:400px}.gift-modal h2{color:var(--accent)}#giftMessage{font-size:1.1rem;margin:20px 0}#giftMessage strong{color:var(--accent-hover)}.gift-buttons{display:flex;gap:15px;margin-top:20px}.btn-accept{flex:1;background:var(--accent-soft);color:var(--text-body);padding:15px;border:none;border-radius:10px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.btn-accept:hover{background:var(--accent-muted);transform:translateY(-1px)}.btn-refuse{flex:1;background:var(--accent-softer);color:var(--text-secondary);padding:15px;border:none;border-radius:10px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.btn-refuse:hover{background:var(--accent-soft);transform:translateY(-1px)}.drawn-card-display{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--surface);padding:20px;border-radius:14px;border:1px solid var(--border);box-shadow:0 8px 30px #0000001f;z-index:500;text-align:center}.drawn-card-container p{margin:10px 0;color:var(--text-primary)}.drawn-card-container .instruction{font-size:.85rem;color:var(--text-secondary)}.drawn-card{width:140px;height:88px;margin:15px auto;background-size:cover;background-position:center;border-radius:10px;box-shadow:0 4px 15px #0003}.game-notification{position:fixed;bottom:80px;left:50%;transform:translate(-50%);background:var(--text-primary);color:var(--surface);padding:12px 25px;border-radius:10px;font-size:.9rem;z-index:9999;animation:fadeInUp .3s ease}@keyframes fadeInUp{0%{opacity:0;transform:translate(-50%) translateY(20px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.player-slot:not(.current-player):hover{cursor:pointer}.player-slot:not(.current-player):hover .player-info{background:var(--accent-softer);border-color:var(--accent-soft);transform:scale(1.05)}.theme-toggle-btn{position:fixed;top:15px;left:15px;width:44px;height:44px;border-radius:50%;background:var(--surface);border:2px solid var(--border);color:var(--text-primary);font-size:1.2rem;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:1000;transition:all .3s ease;box-shadow:0 4px 10px var(--card-shadow)}.theme-icon{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.theme-toggle-btn:hover{transform:scale(1.1);background:var(--accent-softer);border-color:var(--accent)}.theme-toggle-btn:active{transform:scale(.95)}.mic-toggle-btn{position:fixed;top:70px;left:15px;width:44px;height:44px;border-radius:50%;background:var(--surface);border:2px solid var(--border);color:var(--text-primary);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:1000;transition:all .3s ease;box-shadow:0 4px 10px var(--card-shadow)}.mic-toggle-btn.active{background:var(--accent-soft);border-color:var(--accent);color:var(--accent);animation:pulse-mic 2s infinite}@keyframes pulse-mic{0%{box-shadow:0 0 #ff6b6b66}70%{box-shadow:0 0 0 10px #ff6b6b00}to{box-shadow:0 0 #ff6b6b00}}.mic-icon{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.mic-toggle-btn:hover{transform:scale(1.1);background:var(--accent-softer);border-color:var(--accent)}.mic-toggle-btn:active{transform:scale(.95)}@keyframes shake-subtle{0%{transform:translate(2px,2px) rotate(0)}20%{transform:translate(-2px,-2px) rotate(-1deg)}40%{transform:translate(-2px,2px) rotate(1deg)}60%{transform:translate(2px,-2px) rotate(0)}80%{transform:translate(2px,2px) rotate(-1deg)}to{transform:translate(0) rotate(0)}}.shake-effect{animation:shake-subtle .4s cubic-bezier(.36,.07,.19,.97) both}.vignette-overlay{position:fixed;top:0;left:0;right:0;bottom:0;pointer-events:none;box-shadow:inset 0 0 #e3187b00;transition:box-shadow .3s ease-out;z-index:9999}.vignette-effect{box-shadow:inset 0 0 80px 30px #e3187b80}[data-theme=dark] .vignette-effect{box-shadow:inset 0 0 100px 40px #b41450b3}.void-suck{transform:scale(0) rotate(180deg)!important;opacity:0!important;filter:brightness(0)}
