:root{--bg-primary: #fef6f0;--bg-secondary: #fff5f5;--accent-pink: #ffb5b5;--accent-mint: #b5e8d5;--accent-lavender: #d4c5f9;--accent-peach: #ffd5c2;--accent-sky: #b5d8f7;--accent-lemon: #fff3b5;--text-primary: #4a4a4a;--text-secondary: #7a7a7a;--card-shadow: rgba(0, 0, 0, .15);--table-bg: #e8f4e8;--table-border: #b5d4b5;--penalty-zone: #ffcccb;--card-width: 90px;--card-height: 57px;--card-width-lg: 120px;--card-height-lg: 75px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:linear-gradient(135deg,var(--bg-primary) 0%,var(--bg-secondary) 100%);min-height:100vh;color:var(--text-primary);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:linear-gradient(135deg,var(--accent-lavender) 0%,var(--accent-pink) 50%,var(--accent-peach) 100%)}.lobby-container{background:#fff;padding:40px;border-radius:24px;box-shadow:0 20px 60px #00000026;text-align:center;max-width:420px;width:90%}.game-title{font-size:2.2rem;margin-bottom:8px;background:linear-gradient(135deg,var(--accent-pink),var(--accent-lavender));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.subtitle{color:var(--text-secondary);margin-bottom:25px;font-size:.95rem}.menu-buttons{display:flex;flex-direction:column;gap:15px}.btn{padding:16px 28px;border:none;border-radius:14px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;gap:10px}.btn-large{padding:20px 30px;font-size:1.1rem}.btn-icon{font-size:1.3rem}.btn-primary{background:linear-gradient(135deg,var(--accent-pink),var(--accent-lavender));color:#fff;box-shadow:0 4px 15px #ffb5b54d}.btn-primary:hover{transform:translateY(-3px);box-shadow:0 8px 25px #ffb5b580}.btn-secondary{background:linear-gradient(135deg,var(--accent-mint),var(--accent-sky));color:var(--text-primary);box-shadow:0 4px 15px #b5e8d54d}.btn-secondary:hover{transform:translateY(-3px);box-shadow:0 8px 25px #b5e8d580}.form-card{background:linear-gradient(145deg,#fafafa,#f5f5f5);padding:25px;border-radius:16px;border:1px solid #eee;display:flex;flex-direction:column;align-items:center}.form-card h3{margin-bottom:20px;color:var(--text-primary);font-size:1.2rem}.input-group{margin-bottom:15px;text-align:left;width:100%}.input-group label{display:block;margin-bottom:6px;font-size:.85rem;color:var(--text-secondary);font-weight:500}.input-group input{width:100%;padding:14px 16px;border:2px solid #e0e0e0;border-radius:12px;font-size:1rem;transition:all .3s;background:#fff}.input-group input:focus{outline:none;border-color:var(--accent-lavender);box-shadow:0 0 0 3px #d4c5f933}.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:.9rem;padding:10px;transition:color .3s}.btn-link:hover{color:var(--accent-lavender)}.lobby-section{margin-top:20px}.room-info{margin-top:25px;display:flex;flex-direction:column;align-items:center}.code-display{background:linear-gradient(145deg,var(--accent-lavender),var(--accent-pink));padding:25px;border-radius:16px;margin-bottom:20px}.code-label{color:#fff;font-size:.85rem;margin-bottom:8px;opacity:.9}.room-code-box{font-size:2.5rem;font-weight:800;color:#fff;letter-spacing:10px;text-shadow:0 2px 4px rgba(0,0,0,.1)}.btn-copy{margin-top:12px;background:#ffffffe6;color:var(--accent-lavender);border:none;padding:10px 20px;border-radius:20px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .3s}.btn-copy:hover{background:#fff;transform:scale(1.05)}.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-mint);padding:6px 14px;border-radius:20px;font-size:.9rem}.player-list .player-tag.host{background:linear-gradient(135deg,var(--accent-lavender),var(--accent-pink));color:#fff;font-weight:600}.waiting-text{color:var(--text-secondary);font-style:italic;margin-top:10px}.hidden{display:none!important}.game-table{position:relative;width:100vw;height:100vh;background:radial-gradient(ellipse at center,var(--table-bg) 0%,#c5dfc5 100%);overflow:hidden}.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:#fff;padding:4px 12px;border-radius:12px;font-size:.85rem;font-weight:600;box-shadow:0 2px 8px #0000001a}.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:#fff;padding:6px 16px;border-radius:20px;margin-bottom:8px;box-shadow:0 2px 10px #0000001a;display:flex;align-items:center;gap:8px}.player-name{font-weight:600;font-size:.9rem}.player-penalty{background:var(--penalty-zone);color:#c00;padding:2px 8px;border-radius:10px;font-size:.75rem;font-weight:700}.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 rgba(0,0,0,.15);border-radius:8px;display:flex;align-items:center;justify-content:center;background:#ffffff4d}.card-slot.occupied{border:none;background:none}.card-slot.drag-over{border-color:var(--accent-lavender);background:#d4c5f94d}.player-slot.current-player .player-info{background:linear-gradient(135deg,var(--accent-mint),var(--accent-sky))}.player-slot.current-player .card-slot{width:var(--card-width-lg);height:var(--card-height-lg)}.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:12px 20px;background:linear-gradient(135deg,#ff6464e6,#ff5050bf);border-radius:25px;display:flex;align-items:center;justify-content:center;font-size:.85rem;color:#fff;font-weight:600;box-shadow:0 4px 15px #ff64644d;transition:all .3s ease;z-index:1000}.penalty-zone .penalty-text{writing-mode:horizontal-tb;text-orientation:mixed}.penalty-zone.drag-over{background:linear-gradient(135deg,#ff3232f2,#ff1e1ed9);transform:scale(1.1);box-shadow:0 6px 25px #ff323280}.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:#fff;padding:40px;border-radius:24px;text-align:center;max-width:350px;width:90%;box-shadow:0 20px 60px #0003;display:flex;flex-direction:column;align-items:center}.modal-content h2{font-size:2rem;margin-bottom:15px;color:var(--accent-pink)}.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-pink);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:#fff;padding:10px 25px;border-radius:25px;font-size:.9rem;font-weight:500;box-shadow:0 4px 15px #0000001a;z-index:200;text-align:center}.turn-indicator.your-turn{background:linear-gradient(135deg,var(--accent-mint),var(--accent-lemon));font-weight:700}.gift-modal{max-width:400px}.gift-modal h2{color:var(--accent-lavender)}#giftMessage{font-size:1.1rem;margin:20px 0}#giftMessage strong{color:var(--accent-pink)}.gift-buttons{display:flex;gap:15px;margin-top:20px}.btn-accept{flex:1;background:var(--accent-mint);color:#2d6a4f;padding:15px;border:none;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s}.btn-accept:hover{background:#a0dcc8;transform:translateY(-2px)}.btn-refuse{flex:1;background:var(--accent-pink);color:#c44536;padding:15px;border:none;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s}.btn-refuse:hover{background:#f99;transform:translateY(-2px)}.drawn-card-display{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#fff;padding:20px;border-radius:20px;box-shadow:0 10px 40px #0003;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:#000c;color:#fff;padding:12px 25px;border-radius:25px;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-lemon);transform:scale(1.05)}