body{margin:0}.lobby{justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:relative;overflow:hidden}.lobby:before{content:"";opacity:.1;z-index:0;background:url(/images/main-back.jpg) 50%/cover no-repeat;position:absolute;inset:0}.lobby>*{z-index:1;position:relative}.table-area{background:radial-gradient(circle,#cfcfcf,#0b3d2e);width:100vw;height:100vh;position:relative}.player{color:#fff;background:#0009;border-radius:6px;padding:6px 12px;position:absolute}.top{top:20px;left:50%;transform:translate(-50%)}.bottom{bottom:210px;left:50%;transform:translate(-50%)}.left{top:50%;left:20px;transform:translateY(-50%)}.right{top:50%;right:20px;transform:translateY(-50%)}.turn{box-shadow:0 0 15px gold}.center-table{width:220px;height:220px;position:absolute;top:48%;left:50%;transform:translate(-50%,-50%)}.table-card{background:#fff;border-radius:10px;flex-direction:column;justify-content:space-between;width:90px;height:130px;padding:5px;display:flex;position:absolute;box-shadow:0 4px 10px #00000080}.p0{bottom:0;left:50%;transform:translate(-50%)}.p1{top:50%;left:0;transform:translateY(-50%)}.p2{top:0;left:50%;transform:translate(-50%)}.p3{top:50%;right:0;transform:translateY(-50%)}.hand{justify-content:center;gap:8px;width:100%;display:flex;position:absolute;bottom:40px}.card{transition:transform .2s}.dealing .card{opacity:0;animation:.3s forwards dealIn;transform:translateY(100px)scale(.7)}@keyframes dealIn{to{opacity:1;transform:translateY(0)scale(1)}}.c-top{font-family:Saira Stencil,sans-serif;font-size:16px;font-weight:600}.c-center{text-align:center;font-size:32px}.c-bottom{font-family:Saira Stencil,sans-serif;font-size:16px;font-weight:600;transform:rotate(180deg)}.red{color:#d40000}.black{color:#111}.top-bar{color:#fff;justify-content:space-around;width:100%;display:flex;position:absolute;top:5px}.panel{text-align:center;width:100%;position:absolute;top:60%}.menu{text-align:center;margin-top:100px}.card{cursor:pointer;background:#fff;border-radius:10px;flex-direction:column;justify-content:space-between;width:70px;height:100px;padding:5px;transition:transform .2s;display:flex}.card:hover{transform:translateY(-15px)scale(1.05)}.card.disabled{opacity:.35;filter:grayscale(.7);cursor:not-allowed;transform:none!important}.card.error{box-shadow:0 0 15px #ff0000e6}.tooltip{color:#fff;white-space:nowrap;pointer-events:none;background:#c80000f2;border-radius:5px;padding:3px 6px;font-size:11px;animation:.2s fadeIn;position:absolute;top:-28px;left:50%;transform:translate(-50%)}.tooltip:after{content:"";border:4px solid #0000;border-top-color:#c80000f2;position:absolute;bottom:-4px;left:50%;transform:translate(-50%)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.card.shake{animation:.4s shake}@keyframes shake{0%{transform:translate(0)}20%{transform:translate(-6px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}to{transform:translate(0)}}.ui-overlay{color:#fff;z-index:999;background:#000000d9;border-radius:12px;padding:20px 30px;font-family:Saira Stencil,sans-serif;font-size:20px;font-weight:700;animation:.3s pop;position:absolute;top:28%;left:50%;transform:translate(-50%,-50%)}@keyframes pop{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.action-panel{text-align:center;color:#fff;background:#0006;border-radius:12px;padding:15px;font-family:Saira Stencil,sans-serif;position:absolute;top:45%;left:50%;transform:translate(-50%,-50%)}.my-turn{color:#fff;margin-bottom:10px;font-family:Saira Stencil,sans-serif;font-weight:700}.wait{color:#fc0;margin-bottom:10px}.bid-buttons button,.trump-buttons button{cursor:pointer;border:none;border-radius:8px;margin:5px;padding:10px 14px;font-family:Saira Stencil,sans-serif;font-weight:600;transition:all .2s}.bid-buttons button:hover,.trump-buttons button:hover{transform:scale(1.1)}.score-bar{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0000001a;border-radius:12px;gap:10px;padding:8px 12px;font-family:Saira Stencil,sans-serif;display:flex;position:absolute;top:120px;left:50%;transform:translate(-50%)}.score-item{color:#fff;flex-direction:column;align-items:center;min-width:60px;font-size:12px;display:flex}.score-item .name{opacity:.8}.action-panel{text-align:center;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0000008c;border-radius:16px;padding:20px;position:absolute;top:55%;left:50%;transform:translate(-50%,-50%);box-shadow:0 10px 30px #0006}.action-panel .title{color:#fff;margin-bottom:15px;font-size:20px;font-weight:700}.action-panel .wait{color:#ccc}.action-panel .turn{color:#fff}.trump-buttons{justify-content:center;gap:12px;display:flex}.trump{cursor:pointer;color:#fff;background:#ffffff1a;border:none;border-radius:14px;justify-content:center;align-items:center;width:70px;height:70px;font-size:34px;transition:all .2s;display:flex}.trump:hover{transform:translateY(-6px)scale(1.08);box-shadow:0 0 15px #ffffff4d}.trump.spade,.trump.heart,.trump.diamond,.trump.club{color:#fff}.trump:active{transform:scale(.95);box-shadow:0 0 20px gold}.player{flex-direction:column;gap:2px;min-width:90px;display:flex}.p-name{color:#fff;font-family:Saira Stencil,sans-serif;font-size:20px;font-weight:700}.p-bid{color:#ffd166;font-size:11px}.p-score{color:#0f8;font-family:Saira Stencil,sans-serif;font-size:12px;font-weight:700}.winner-overlay{text-align:center;z-index:999;animation:.3s pop;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.winner-text{color:gold;text-shadow:0 0 10px #000;margin-bottom:10px;font-size:26px;font-weight:700}.winner-cards{justify-content:center;gap:8px;display:flex}.winner-card{background:#fff;border-radius:10px;justify-content:center;align-items:center;width:60px;height:85px;font-weight:700;animation:.6s infinite alternate winPulse;display:flex}@keyframes winPulse{0%{transform:scale(1);box-shadow:0 0 10px gold}to{transform:scale(1.15);box-shadow:0 0 25px gold}}.lobby{background:radial-gradient(circle at top,#145a32,#0b3d2e);justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:relative;overflow:hidden}.lobby-bg{filter:blur(80px);background:radial-gradient(circle,#00ff9640,#0000 70%);width:600px;height:600px;animation:6s ease-in-out infinite floatGlow;position:absolute}@keyframes floatGlow{0%{transform:translate(-20px,-20px)}50%{transform:translate(20px,20px)}to{transform:translate(-20px,-20px)}}.lobby-card{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);text-align:center;color:#fff;background:#0000008c;border-radius:18px;width:320px;padding:30px;animation:.4s popIn;box-shadow:0 10px 40px #00000080}@keyframes popIn{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}.logo{letter-spacing:2px;font-family:Saira Stencil,sans-serif;font-size:34px;font-weight:700}.subtitle{opacity:.7;margin-bottom:20px;font-size:13px}.input{color:#fff;background:#ffffff14;border:none;border-radius:10px;outline:none;width:93%;margin:8px 0;padding:12px;font-size:14px;transition:all .2s}.input:focus{background:#ffffff26;transform:scale(1.02)}.buttons{margin-top:15px}.btn{cursor:pointer;border:none;border-radius:10px;width:100%;padding:12px;font-weight:700;transition:all .2s}.btn.primary{color:#000;background:linear-gradient(135deg,#0f8,#00b36b)}.btn.primary:hover{transform:translateY(-3px);box-shadow:0 10px 25px #00ff964d}.hand-wrapper{flex-direction:column;align-items:center;gap:10px;width:100%;display:flex;position:absolute;bottom:10px}.hand-controls{justify-content:center;display:flex}.hand-controls button{cursor:pointer;color:#fff;background:#0009;border:none;border-radius:10px;padding:8px 14px;font-weight:700;transition:all .2s}.hand-controls button:hover{background:#000c;transform:scale(1.05)}.trump-bg{opacity:.08;pointer-events:none;z-index:0;-webkit-user-select:none;user-select:none;font-size:520px;position:absolute;top:42%;left:50%;transform:translate(-50%,-50%)}.trump-bg.heart,.trump-bg.diamond{color:#ff4d4d}.trump-bg.spade,.trump-bg.club{color:#fff}.card{background:#fff;border-radius:10px;width:70px;height:110px;padding:6px;position:relative}.top-left{top:10%;left:18%}.top-right{top:10%;right:18%}.mid-left{top:50%;left:18%;transform:translateY(-50%)}.mid-right{top:50%;right:18%;transform:translateY(-50%)}.bottom-left{bottom:10px;right:53px;transform:rotate(180deg)}.bottom-right{bottom:4px;right:6px;transform:rotate(180deg)}.pip.big{font-size:62px}.card-center{justify-content:center;align-items:center;display:flex;position:absolute;inset:18px 0}.face-img{object-fit:contain;width:100%;height:100%}.center{top:50%;left:50%;transform:translate(-50%,-50%)}.card{background:linear-gradient(145deg,#fff,#f3f3f3);border:1px solid #ddd;font-family:Saira Stencil,sans-serif}.corner{font-family:Saira Stencil,sans-serif;font-size:13px;font-weight:700;line-height:1}.pip{font-size:23px;position:absolute;transform:translate(-50%,-50%)}.pip.flipped{transform:translate(-50%,-50%)rotate(180deg)}.pip-grid{width:100%;height:125%;padding-left:100px;padding-right:0;position:relative}.pip.ace{font-size:64px}.table-card .pip{font-size:18px}.table-card .pip.ace{font-size:40px}.table-card .card-center{top:14px;bottom:14px}.sound-btn{cursor:pointer;font-size:22px;transition:all .2s}.sound-btn:hover{transform:scale(1.2)}*{-webkit-user-select:none;user-select:none}.tabs{background:#ffffff0d;border-radius:10px;margin-bottom:15px;display:flex;overflow:hidden}.tabs button{cursor:pointer;color:#fff;background:0 0;border:none;flex:1;padding:10px;font-weight:700;transition:all .2s}.tabs button.active{color:#000;background:linear-gradient(135deg,#0f8,#00b36b)}.modal-backdrop{z-index:9999;background:#000000b3;justify-content:center;align-items:center;font-family:Saira Stencil,sans-serif;display:flex;position:fixed;inset:0}.modal{color:#fff;background:#111;border-radius:12px;min-width:500px;padding:20px}.modal-title{text-align:center;margin-bottom:15px;font-size:20px}.score-table th,.score-table td{text-align:center;border:1px solid #333;padding:6px}.negative{color:#fff;background:#b30000}.danger-row{background:#f003}.close-btn{cursor:pointer;background:#0f8;border:none;width:100%;margin-top:10px;padding:8px;font-weight:700}.score-table{border-collapse:collapse;width:100%}.score-table th,.score-table td{text-align:center;color:#fff;border:1px solid #333;padding:6px}.negative{color:#fff;background:#b30000;font-weight:700}.total-row{background:#00ff6426;font-weight:700}.batan-row{background:#ff000026;font-weight:700}.fly-card{animation:1.2s ease-in forwards flyUp}@keyframes flyUp{0%{opacity:1;transform:translateY(0)scale(1)}to{opacity:0;transform:translateY(-600px)rotate(720deg)scale(.3)}}.end-overlay{z-index:99999;background:#000000d9;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.end-card{text-align:center;color:#fff;animation:.4s pop}.winner-title{color:gold;font-size:28px}.winner-name{margin-top:10px;font-size:40px;font-weight:700}.winner-score{opacity:.7;margin-top:10px}select.input{color:#0f8;cursor:pointer;background:#0006;border:1px solid #fff3}select.input option{color:#fff;background:#0b3d2e;padding:10px}.winner-overlay{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:9999;background:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.winner-modal{text-align:center;background:#14141ed9;border:1px solid #ffffff1a;border-radius:20px;padding:30px;animation:.3s pop;box-shadow:0 0 40px #00ffc833}.winner-title{color:#00f5d4;text-shadow:0 0 10px #00f5d4;font-size:26px;font-weight:700}.winner-sub{color:#aaa;margin-top:5px;font-size:14px}.winner-cards{justify-content:center;gap:10px;margin-top:20px;display:flex}.winner-card{color:#fff;background:linear-gradient(145deg,#1f1f2e,#141420);border:1px solid #ffffff1a;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;width:60px;height:90px;font-weight:700;transition:all .2s;display:flex;box-shadow:0 5px 15px #00000080}.card-value{font-size:18px}.card-suit{font-size:20px}.winner-overlay{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0009;justify-content:center;align-items:center;font-family:Saira Stencil,sans-serif;display:flex;position:fixed;inset:0;transform:none!important}.winner-overlay.hide{opacity:0;transform:scale(1.1)}.chat-wrapper{z-index:999;width:220px;font-family:Saira Stencil,sans-serif;transition:all .3s;position:absolute;bottom:15px;left:15px}.chat-header{color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0000008c;border-radius:12px;justify-content:space-between;padding:10px;display:flex;box-shadow:0 0 20px #00ff9626}.chat-body{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#00000059;border-radius:12px;flex-direction:column;height:260px;margin-top:6px;display:flex;overflow:hidden}.chat-messages{flex:1;padding:8px;overflow-y:auto}.msg{color:#fff;margin-bottom:6px;font-size:12px}.msg-name{color:#0f8;margin-right:4px;font-weight:700}.msg-text{opacity:.9}.chat-input{border-top:1px solid #ffffff1a;display:flex}.chat-input input{color:#fff;background:0 0;border:none;outline:none;flex:1;padding:8px;font-size:12px}.chat-input button{cursor:pointer;background:linear-gradient(135deg,#0f8,#00b36b);border:none;width:40px;font-weight:700}.chat-wrapper:not(.open) .chat-body{display:none}.chat-wrapper:hover .chat-header{box-shadow:0 0 25px #00ff964d}.chat-header{position:relative}.chat-badge{color:#fff;background:red;border-radius:50%;justify-content:center;align-items:center;width:18px;height:18px;font-size:11px;font-weight:700;display:flex;position:absolute;top:-6px;right:30px;box-shadow:0 0 10px #f009}.bidding-overlay{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0000008c;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.bidding-card{background:linear-gradient(145deg,#1b1f2a,#12151d);border:1px solid #ffffff14;border-radius:18px;width:420px;padding:20px;animation:.25s pop;box-shadow:0 20px 60px #0009}.bidding-header{justify-content:space-between;align-items:center;margin-bottom:15px;font-family:Saira Stencil,sans-serif;display:flex}.title{color:#fff;font-family:Saira Stencil,sans-serif;font-size:18px;font-weight:600}.my-turn{color:#00ffb3;font-family:Saira Stencil,sans-serif;font-weight:600}.waiting{color:#aaa;font-family:Saira Stencil,sans-serif}.bid-grid{grid-template-columns:repeat(7,1fr);gap:8px;display:grid}.bid-btn{color:#fff;cursor:pointer;background:#ffffff0d;border:1px solid #ffffff14;border-radius:10px;padding:10px 0;font-weight:700;transition:all .2s}.bid-btn:hover{background:#00ffc826;border-color:#00ffc866;transform:translateY(-2px)}.bid-btn.active{color:#000;background:linear-gradient(135deg,#00ffb3,#00b3ff);box-shadow:0 0 15px #00ffc866}.hint{color:#888;text-align:center;margin-top:12px;font-family:Saira Stencil,sans-serif;font-size:12px}.trump-overlay{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0000008c;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.trump-card{background:linear-gradient(145deg,#1b1f2a,#12151d);border:1px solid #ffffff14;border-radius:18px;width:360px;padding:20px;font-family:Saira Stencil,sans-serif;animation:.25s pop;box-shadow:0 20px 60px #0009}.trump-header{justify-content:space-between;align-items:center;margin-bottom:15px;font-family:Saira Stencil,sans-serif;display:flex}.title{color:#fff;font-size:18px;font-weight:600}.my-turn{color:#00ffb3;font-weight:600}.waiting{color:#aaa}.trump-grid{grid-template-columns:repeat(2,1fr);gap:12px;display:grid}.trump-btn{cursor:pointer;background:#ffffff0d;border:1px solid #ffffff14;border-radius:14px;padding:22px 0;font-size:28px;font-weight:700;transition:all .2s}.trump-btn:hover{transform:translateY(-3px)scale(1.03)}.spade{color:#fff}.heart{color:#ff3b5c}.diamond{color:#fc0}.club{color:#00d4ff}.spade:hover{box-shadow:0 0 20px #fff3}.heart:hover{box-shadow:0 0 20px #ff3b5c66}.diamond:hover{box-shadow:0 0 20px #fc06}.club:hover{box-shadow:0 0 20px #00d4ff66}.hint{color:#888;text-align:center;margin-top:12px;font-size:12px}.player-card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#222;background:#ffffffbf;border:1px solid #00000014;border-radius:14px;min-width:140px;padding:8px 16px;font-size:13px;transition:all .25s;position:absolute;box-shadow:0 4px 14px #00000014}.player-card.bottom{bottom:220px;left:50%;transform:translate(-50%)}.player-card.left{top:50%;left:20px;transform:translateY(-50%)}.player-card.right{top:50%;right:20px;transform:translateY(-50%)}.player-card.top{top:20px;left:50%;transform:translate(-50%)}.p-name{color:#222;margin-bottom:4px;font-size:20px;font-weight:600}.p-meta{color:#555;justify-content:space-between;gap:18px;font-family:Saira Stencil,sans-serif;font-size:16px;font-weight:700;display:flex}.player-card.turn{color:#fff;background:#141418eb;border:1px solid #00ffb359;box-shadow:0 0 18px #00ffb340,0 6px 18px #00000059}.player-card.turn .p-name{color:#fff}.player-card.turn .p-meta{color:#fff;font-family:Saira Stencil,sans-serif;font-weight:700}.player-card.turn{animation:1.6s infinite turnPulse}@keyframes turnPulse{0%{box-shadow:0 0 10px #00ffb326}50%{box-shadow:0 0 22px #00ffb359}to{box-shadow:0 0 10px #00ffb326}}.winner-overlay{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:9999;background:#0000008c;justify-content:center;align-items:center;animation:.25s fadeIn;display:flex;position:fixed;inset:0}.winner-overlay.hide{animation:.4s forwards fadeOut}.winner-modal{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);text-align:center;background:#ffffffd9;border:1px solid #00000014;border-radius:18px;min-width:320px;padding:24px 26px;animation:.35s forwards popIn;transform:scale(.95);box-shadow:0 20px 60px #00000040}.winner-title{color:#111;margin-bottom:6px;font-size:20px;font-weight:700}.winner-sub{color:#666;margin-bottom:18px;font-size:13px}.winner-cards{justify-content:center;align-items:center;margin-top:10px;display:flex}.winner-card{background:#fff;border:1px solid #0000001f;border-radius:10px;flex-direction:column;justify-content:space-between;width:55px;height:80px;padding:6px;transition:transform .2s;display:flex;position:relative;box-shadow:0 6px 14px #00000026}.winner-card.red{color:#d12b2b}.winner-card.black{color:#222}.card-value{font-size:14px;font-weight:700}.card-suit{text-align:right;font-size:18px}.winner-card:hover{transform:translateY(-6px)scale(1.05)!important}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.score-bar{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:100;background:#fff3;border:1px solid #00000014;border-radius:14px;gap:10px;padding:10px 14px;display:flex;position:absolute;top:120px;left:50%;transform:translate(-50%);box-shadow:0 6px 18px #0000001f}.score-item{color:#222;background:0 0;border-radius:10px;flex-direction:column;align-items:center;min-width:70px;padding:3px 10px;transition:all .25s;display:flex}.score-item .name{color:#000;font-size:13px;font-weight:600}.score-item .score{color:#111;font-size:14px;font-weight:600}.score-item.turn{color:#fff;background:#0e7058eb;transform:translateY(-2px)scale(1.05);box-shadow:0 0 16px #00ffb340,0 6px 14px #00000040}.score-item.turn .name{color:#ffffffbf}.score-item.turn .score{color:#fff}.score-item.turn{animation:1.8s infinite scorePulse}@keyframes scorePulse{0%{box-shadow:0 0 10px #00ffb326}50%{box-shadow:0 0 22px #00ffb359}to{box-shadow:0 0 10px #00ffb326}}