:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;display:block;width:100%;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}button{background-color:#f9f9f9}}.card{width:60px;height:90px;background:#fff;border-radius:8px;border:1px solid #ccc;display:flex;flex-direction:column;justify-content:space-between;padding:4px;box-shadow:0 2px 4px #0000001a;cursor:pointer;transition:transform .2s,box-shadow .2s;-webkit-user-select:none;user-select:none;position:relative}.card:hover{transform:translateY(-2px);box-shadow:0 4px 8px #00000026}.card.selected{border:2px solid #007bff;transform:translateY(-10px);box-shadow:0 0 10px #007bff80}.card.hidden{border:2px solid #fff;background:#333}.card-back-classic .card-back{background:repeating-linear-gradient(45deg,#2c3e50,#2c3e50 10px,#34495e 10px 20px)}.card-back-red-modern{border-color:#ffcdd2!important}.card-back-red-modern .card-back{background:radial-gradient(circle at center,#d32f2f,#b71c1c);background-size:20px 20px;background-image:radial-gradient(circle,#e57373 1px,transparent 1px)}.card-back-blue-modern{border-color:#bbdefb!important}.card-back-blue-modern .card-back{background:linear-gradient(135deg,#1565c0 25%,#0d47a1 25% 50%,#1565c0 50% 75%,#0d47a1 75% 100%);background-size:20px 20px}.card-back-gold-luxury{border-color:gold!important}.card-back-gold-luxury .card-back{background:linear-gradient(45deg,gold,#ffecb3,#ffb300,gold);background-size:200% 200%;animation:shimmer 5s ease infinite}.card-back-cyber-neon{border-color:#00e5ff!important;box-shadow:0 0 5px #00e5ff!important}.card-back-cyber-neon .card-back{background:#000;background-image:linear-gradient(0deg,transparent 24%,rgba(0,229,255,.3) 25%,rgba(0,229,255,.3) 26%,transparent 27%,transparent 74%,rgba(0,229,255,.3) 75%,rgba(0,229,255,.3) 76%,transparent 77%,transparent),linear-gradient(90deg,transparent 24%,rgba(0,229,255,.3) 25%,rgba(0,229,255,.3) 26%,transparent 27%,transparent 74%,rgba(0,229,255,.3) 75%,rgba(0,229,255,.3) 76%,transparent 77%,transparent);background-size:30px 30px}.card-back-dark-matter{border-color:#424242!important}.card-back-dark-matter .card-back{background:#202020;background-image:radial-gradient(grey 1px,transparent 0);background-size:10px 10px}.card-back-wood-grain{border-color:#d7ccc8!important}.card-back-wood-grain .card-back{background:#8d6e63;background-image:linear-gradient(90deg,rgba(255,255,255,.07) 50%,transparent 50%),linear-gradient(90deg,rgba(255,255,255,.13) 50%,transparent 50%),linear-gradient(90deg,transparent 50%,rgba(255,255,255,.17) 50%),linear-gradient(90deg,transparent 50%,rgba(255,255,255,.19) 50%);background-size:13px,29px,37px,53px}.card-back-matrix{border-color:#00c853!important}.card-back-matrix .card-back{background:#000;color:#00c853;font-family:monospace;position:relative;overflow:hidden}.card-back-matrix .card-back:before{content:"010101 101010 001100";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(90deg);font-size:8px;opacity:.5;white-space:nowrap}.card-back-sunset{border-color:#ff4081!important}.card-back-sunset .card-back{background:linear-gradient(to bottom,#ff4081,#ff80ab,#ffd180)}.card-back-royal-purple{border-color:#b388ff!important}.card-back-royal-purple .card-back{background:#6200ea;background-image:radial-gradient(circle,#7c4dff 10%,transparent 10%),radial-gradient(circle,#7c4dff 10%,transparent 10%);background-size:20px 20px;background-position:0 0,10px 10px}.card-back-cool-mint{border-color:#a7ffeb!important}.card-back-cool-mint .card-back{background:#a7ffeb;background-image:repeating-linear-gradient(45deg,#a7ffeb 0 2px,#1de9b6 2px 4px)}.card-back-dragon-scale{border-color:#bf360c!important}.card-back-dragon-scale .card-back{background:#bf360c;background-image:radial-gradient(circle at 100% 150%,#bf360c 24%,#ff5722 25%,#ff5722 28%,#bf360c 29%,#bf360c 36%,#ff5722 36%,#ff5722 40%,transparent 40%,transparent),radial-gradient(circle at 0 150%,#bf360c 24%,#ff5722 25%,#ff5722 28%,#bf360c 29%,#bf360c 36%,#ff5722 36%,#ff5722 40%,transparent 40%,transparent),radial-gradient(circle at 50% 100%,#ff5722 10%,#bf360c 11%,#bf360c 23%,#ff5722 24%,#ff5722 30%,#bf360c 31%,#bf360c 43%,#ff5722 44%,#ff5722 50%,#bf360c 51%,#bf360c 63%,#ff5722 64%,#ff5722 71%,transparent 71%,transparent),radial-gradient(circle at 100% 50%,#ff5722 5%,#bf360c 6%,#bf360c 15%,#ff5722 16%,#ff5722 20%,#bf360c 21%,#bf360c 30%,#ff5722 31%,#ff5722 35%,#bf360c 36%,#bf360c 45%,#ff5722 46%,#ff5722 49%,transparent 50%,transparent),radial-gradient(circle at 0 50%,#ff5722 5%,#bf360c 6%,#bf360c 15%,#ff5722 16%,#ff5722 20%,#bf360c 21%,#bf360c 30%,#ff5722 31%,#ff5722 35%,#bf360c 36%,#bf360c 45%,#ff5722 46%,#ff5722 49%,transparent 50%,transparent);background-size:20px 20px}.card-back{width:100%;height:100%;border-radius:4px}@keyframes shimmer{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.card.hearts,.card.diamonds{color:#e74c3c}.card.clubs,.card.spades{color:#2c3e50}.card.joker{color:#8e44ad}.card-top,.card-bottom{display:flex;flex-direction:column;align-items:center;font-size:12px;line-height:1}.card-bottom{transform:rotate(180deg)}.card-center{font-size:24px;text-align:center;flex-grow:1;display:flex;align-items:center;justify-content:center}@media(max-width:600px){.card{padding:2px;border-radius:4px}.card-top,.card-bottom{font-size:10px}.card-center{font-size:16px}}.card.peeking{border:2px solid #f39c12;box-shadow:0 0 10px #f39c1299}.peek-overlay{position:absolute;inset:0;background:#f39c1233;border-radius:8px;pointer-events:none;z-index:1}.card.small{width:36px;height:54px;padding:2px;border-radius:4px}.card.small .card-top,.card.small .card-bottom{font-size:8px}.card.small .card-center{font-size:16px}.card.xs{width:30px;height:45px;padding:1px;border-radius:3px}.card.xs .card-top,.card.xs .card-bottom{font-size:7px}.card.xs .card-center{font-size:12px}.dice{font-size:10px;width:4em;height:4em;background:#fff;border:.1em solid #ccc;border-radius:.8em;position:relative;box-shadow:0 .2em .4em #0000001a;display:flex;flex-shrink:0}.dice.small{font-size:7px}.dice.medium{font-size:10px}.dice.large{font-size:20px}.dot{width:.8em;height:.8em;background:#333;border-radius:50%;position:absolute}.center{top:50%;left:50%;transform:translate(-50%,-50%)}.top-left{top:.8em;left:.8em}.top-right{top:.8em;right:.8em}.bottom-left{bottom:.8em;left:.8em}.bottom-right{bottom:.8em;right:.8em}.middle-left{top:50%;left:.8em;transform:translateY(-50%)}.middle-right{top:50%;right:.8em;transform:translateY(-50%)}.dice.white{background:#fff;border-color:#ccc}.dice.white .dot{background:#333}.dice.red{background:#d32f2f;border-color:#b71c1c}.dice.red .dot{background:#fff}.dice.blue{background:#1976d2;border-color:#0d47a1}.dice.blue .dot{background:#fff}.dice.green{background:#388e3c;border-color:#1b5e20}.dice.green .dot{background:#fff}.dice.yellow{background:#fbc02d;border-color:#f57f17}.dice.yellow .dot{background:#333}.dice.purple{background:#7b1fa2;border-color:#4a148c}.dice.purple .dot{background:#fff}.dice.black{background:#212121;border-color:#000}.dice.black .dot{background:gold;box-shadow:0 0 2px #ffd70080}.dice.pink{background:#e91e63;border-color:#c2185b}.dice.pink .dot{background:#fff}.dice.orange{background:#f57c00;border-color:#e65100}.dice.orange .dot{background:#fff}.dice.teal{background:#00796b;border-color:#004d40}.dice.teal .dot{background:#fff}.dice.silver{background:#e0e0e0;border-color:#9e9e9e;box-shadow:0 .2em .4em #0003,inset 0 0 10px #ffffff80}.dice.silver .dot{background:#424242;box-shadow:0 0 1px #ffffff80}.dice.gold{background:gold;border-color:#ff8f00;box-shadow:0 .2em .4em #0003,inset 0 0 10px #ffffff80}.dice.gold .dot{background:#3e2723;box-shadow:0 0 1px #ffffff80}.shared-board{display:flex;gap:16px;padding:20px;background:#f0f2f5;border-radius:12px;justify-content:center;align-items:center}@media(min-width:601px){.shared-board{transform:scale(1) translateY(0);transform-origin:center center}}.shared-column{display:flex;flex-direction:column;gap:8px;align-items:center}.shared-column.interactive:hover .player-slots{background:#0000000d;border-radius:8px}.shared-column.winning-column-p1{background:#4facfe26;border-radius:12px;padding:8px;border:3px solid rgba(79,172,254,.8);box-shadow:0 0 25px #4facfe99;animation:glow-p1 2s ease-in-out infinite}.shared-column.winning-column-p2{background:#ff585826;border-radius:12px;padding:8px;border:3px solid rgba(255,88,88,.8);box-shadow:0 0 25px #ff585899;animation:glow-p2 2s ease-in-out infinite}@keyframes glow-p1{0%,to{box-shadow:0 0 25px #4facfe99;border-color:#4facfecc}50%{box-shadow:0 0 40px #4facfee6;border-color:#4facfe}}@keyframes glow-p2{0%,to{box-shadow:0 0 25px #ff585899;border-color:#ff5858cc}50%{box-shadow:0 0 40px #ff5858e6;border-color:#ff5858}}.card-slot.winning-row-yellow{border:4px solid #ffd700;animation:glow-yellow 1.5s ease-in-out infinite;z-index:10}@keyframes glow-yellow{0%,to{box-shadow:0 0 20px #ffd700b3}50%{box-shadow:0 0 35px gold}}.card-slot.winning-slot-p1{border:3px solid #4facfe}.card-slot.winning-slot-p2{border:3px solid #ff5858}.interactive .shared-column:hover,.opponent-slots,.player-slots{display:flex;flex-direction:column;gap:8px}.board-theme-classic-green{background:#2e7d32!important}.board-theme-midnight-blue{background:radial-gradient(circle at center,#283593,#1a237e)!important}.board-theme-casino-red{background:#b71c1c!important;border-top:5px solid #d32f2f;border-bottom:5px solid #d32f2f}.board-theme-void-black{background:#121212!important;box-shadow:inset 0 0 50px #000}.board-theme-neon-grid{background:#263238!important;background-image:linear-gradient(rgba(0,255,255,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(0,255,255,.1) 1px,transparent 1px)!important;background-size:30px 30px!important}.board-theme-warm-wood{background:#4e342e!important;background-image:repeating-linear-gradient(45deg,#3e2723 0 10px,#4e342e 10px 20px)!important}.board-theme-ice-blue{background:linear-gradient(to bottom,#b2ebf2,#e0f7fa)!important}.board-theme-royal-gold{background:radial-gradient(circle,#fff8e1,#ffecb3)!important;border:2px solid #ffd54f}.board-theme-cyber-punk{background:#212121!important;border-top:2px solid #f50057;border-bottom:2px solid #00e676}.board-theme-minimal-grey{background:#eceff1!important}.board-theme-space-station{background:#37474f!important;border-top:5px solid #cfd8dc;border-bottom:5px solid #cfd8dc}.board-theme-volcano{background:#210a04!important;background-image:radial-gradient(circle at 50% 100%,#dd2c00,#3e2723,#000)!important}.opponent-slot .card{transform:rotate(180deg)}.dice-row{margin:8px 0;padding:8px;background:#e0e0e0;border-radius:50%;box-shadow:inset 0 2px 4px #0000001a}.card-slot{width:60px;height:90px;border:2px dashed #ccc;border-radius:8px;display:flex;align-items:center;justify-content:center}.empty-slot{width:100%;height:100%}@media(max-width:600px){.shared-board{gap:0;padding:0;transform:scale(1.25) translateY(10px);transform-origin:center center;position:relative;z-index:100}.card-slot{width:45px;height:63px;border-width:1px;border-radius:4px}.card-slot .card{width:100%!important;height:100%!important}.dice-row{padding:2px;margin:1px 0}}.hand{display:flex;gap:12px;padding:16px;background:#fffc;border-radius:12px;min-height:110px;align-items:center;justify-content:center;transition:background .3s}.hand.active{background:#fff;box-shadow:0 0 15px #007bff33}.hand-card-wrapper{transition:transform .2s}.hand-card-wrapper:hover{transform:translateY(-5px)}@media(max-width:600px){.hand{padding:4px;gap:4px;height:50px;min-height:0;overflow-x:auto;justify-content:center;width:100%;box-sizing:border-box}.hand::-webkit-scrollbar{display:none}.hand-card-wrapper{height:100%;display:flex;align-items:center}.hand .card{height:100%;width:auto;aspect-ratio:5/7;min-width:0}.hand .card .card-top,.hand .card .card-bottom{font-size:7px;line-height:.9}.hand .card .card-center{font-size:12px}.hand-card-wrapper:hover,.hand .card:hover,.hand .card.selected{transform:none}}.game-info{display:flex;flex-direction:column;align-items:center;gap:0;padding:0 2px 2px;background:transparent;border-radius:8px;box-shadow:none;margin-bottom:0;width:100%;box-sizing:border-box}.status-bar{font-size:.8rem;font-weight:700;display:flex;align-items:center;justify-content:center;position:relative;width:100%}.turn-indicator{padding:.5rem 1rem;border-radius:6px;font-weight:700}.turn-indicator.your-turn{font-size:1rem;padding:.5rem 1rem;background:linear-gradient(135deg,#4facfe,#00f2fe);color:#fff;border-radius:6px;font-weight:700;animation:pulse-color 1.5s ease-in-out infinite}.turn-indicator.opponent-turn{font-size:1rem;padding:.5rem 1rem;background:#ffffff1a;color:#aaa;border-radius:6px}@keyframes pulse-color{0%,to{opacity:1}50%{opacity:.7}}.scores{display:flex;gap:16px;width:100%;justify-content:center;align-items:center}.player-score-row{display:flex;gap:8px;align-items:center}.score-item{font-size:.8rem;font-weight:500;padding:2px 8px;border-radius:4px}.score-item.active{background:#e3f2fd;color:#1976d2;font-weight:700}.bonus-item{font-size:.7rem;color:#666}.surrender-btn{position:absolute;right:0;padding:.3rem .6rem;font-size:.7rem;background:#ff585833;color:#ff5858;border:1px solid #ff5858;border-radius:4px;cursor:pointer;transition:all .2s;white-space:nowrap}.surrender-btn:hover{background:#ff58584d}@media(max-width:600px){.game-info{display:grid;grid-template-columns:80px 1fr 80px;grid-template-rows:1fr auto 1fr;padding:0;margin:0;background:transparent;position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:10;align-items:center;transform:translateY(-20px)}.status-bar,.scores{display:contents}.game-info>*{pointer-events:auto}.player-score-row{grid-row:2;display:flex;flex-direction:column;justify-content:center;gap:2px;font-size:.7rem;writing-mode:horizontal-tb;transform:none;max-width:none;background:#ffffffe6;padding:6px;border-radius:4px;z-index:20;box-shadow:0 2px 4px #0003}.score-item{font-weight:700;font-size:.65rem;padding:0}.bonus-item{font-size:.55rem}.game-info[data-my-index="0"] .player-1{grid-column:1;align-items:flex-start;text-align:left;margin-left:4px}.game-info[data-my-index="0"] .player-2{grid-column:3;align-items:flex-end;text-align:right;margin-right:4px}.game-info[data-my-index="1"] .player-2{grid-column:1;align-items:flex-start;text-align:left;margin-left:4px}.game-info[data-my-index="1"] .player-1{grid-column:3;align-items:flex-end;text-align:right;margin-right:4px}.turn-indicator{grid-row:1;align-self:end;padding:4px 8px;font-size:.7rem;background:#fffffff2!important;border-radius:4px;margin-bottom:8px;z-index:20;display:flex;justify-content:center;align-items:center;width:100%;box-sizing:border-box}.turn-indicator.your-turn{grid-column:1;margin-left:4px;border:2px solid #00d2ff;color:#00d2ff!important;background:#e0f9ff!important;font-weight:700;text-align:center}.turn-indicator.opponent-turn{grid-column:3;margin-right:4px;text-align:center;border:1px solid #888}.surrender-btn{grid-column:3;grid-row:3;align-self:start;margin-top:8px;margin-right:4px;background:#ff4757;color:#fff;border:none;padding:8px 12px;border-radius:4px;font-size:.75rem;z-index:20}.winner-banner,.scoring-banner{display:none!important}}@media(max-width:600px){body:has(.game-result-overlay) .game-info{display:none}}.game-info[data-my-index="1"] .turn-indicator.your-turn{background:linear-gradient(135deg,#ff5858,#ffbdbe);box-shadow:0 4px 15px #ff585866}.player-score-row.player-2 .score-item.active{background:#ffebee;color:#d32f2f;border:1px solid rgba(211,47,47,.2)}.game-result-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000d9;display:flex;justify-content:center;align-items:center;z-index:1000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.game-result-modal{background:#1a1a1a;border:2px solid #444;border-radius:16px;padding:2rem;width:90%;max-width:800px;color:#fff;box-shadow:0 10px 30px #00000080;display:flex;flex-direction:column;gap:1.5rem}.winner-announcement{font-size:1.5rem;font-weight:700;text-align:center;margin-bottom:1.5rem;margin-top:10px}.p1-text{color:#4facfe}.p2-text{color:#ff5858}.results-table{display:flex;flex-direction:column;gap:.5rem;background:#222;padding:1rem;border-radius:8px}.table-header,.table-row{display:grid;grid-template-columns:.5fr 2fr 2fr;gap:1rem;align-items:center;text-align:center;padding:.5rem}.table-header{font-weight:700;color:#888;border-bottom:1px solid #444;padding-bottom:.5rem}.table-row{background:#ffffff05;border-radius:4px}.hand-name{font-size:.9rem;color:#ccc}.hand-name.p1-text{color:#4facfe;font-weight:700}.hand-name.p2-text{color:#ff5858;font-weight:700}.draw-text{color:#ffa726;font-weight:700;font-size:1.2em}.winner-col.p1{color:#4facfe}.winner-col.p2{color:#ff5858}@media(max-width:600px){.game-result-modal{transform:scale(.8) translateY(25px);width:100%}}.score-box.winner-box{box-shadow:0 0 20px #ffd70099;border:2px solid #ffd700;background:#ffd7001a;animation:winner-glow 2s infinite ease-in-out}@keyframes winner-glow{0%{box-shadow:0 0 15px #ffd70080}50%{box-shadow:0 0 25px #ffd700cc}to{box-shadow:0 0 15px #ffd70080}}.winner-col.draw{color:#888}.table-divider{height:1px;background:#444;margin:.5rem 0}.x-hand-row{background:#ffd7000d;border:1px solid rgba(255,215,0,.2)}.final-scores{display:flex;justify-content:center;gap:2rem;margin-top:1rem}.score-box{background:#333;padding:1.5rem;border-radius:12px;text-align:center;min-width:150px}.score-box.p1{border-bottom:4px solid #4facfe}.score-box.p2{border-bottom:4px solid #ff5858}.score-box h3{margin:0;font-size:1rem;color:#aaa}.score-val{font-size:2.5rem;font-weight:700;margin:.5rem 0}.bonus-val{font-size:.8rem;color:#888}.button-group{display:flex;justify-content:center;gap:1rem;margin-top:1rem}.restart-btn,.view-board-btn{padding:1rem 2rem;font-size:1.1rem}@media(max-width:600px){.game-result-modal{padding:.25rem;width:95%;max-height:90vh;overflow-y:auto;transform:translateY(-20px)}.game-result-modal h2{font-size:.8rem;margin-bottom:.25rem}.winner-announcement{margin-top:30px;margin-bottom:.5rem}.final-scores{gap:.25rem;margin:0 0 .15rem;transform:translateY(-50px)}.score-box{padding:.4rem;min-width:90px}.score-box h3{font-size:.9rem}.score-val{font-size:1.5rem;margin:.2rem 0}.bonus-val{font-size:.7rem}.results-table{padding:.15rem;margin:0 0 .15rem;transform:translateY(-30px)}.table-header,.table-row{grid-template-columns:.5fr 1.5fr 1.5fr;font-size:.5rem;gap:.15rem;padding:.15rem}.button-group{gap:.25rem;margin-top:0;transform:translateY(-65px)}.restart-btn,.view-board-btn{padding:.4rem .8rem;font-size:.65rem}}.rating-update{margin-top:10px;padding:8px;background:#0003;border-radius:6px;font-size:.9rem;color:#eee}.rating-values{font-weight:700;margin:4px 0}.rating-new{color:#fff;font-size:1.1em}.rating-change{font-weight:700;font-size:1.2rem}.rating-change.pos{color:#4cd137;text-shadow:0 0 5px rgba(76,209,55,.5)}.rating-change.neg{color:#e74c3c;text-shadow:0 0 5px rgba(231,76,60,.5)}.lobby-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:#fff;gap:2rem}.name-input-section{display:flex;flex-direction:column;align-items:center;gap:.5rem}.name-input-section label{font-size:.9rem;color:#aaa}.name-input-section input:focus{outline:none;border-color:#4facfe;box-shadow:0 0 5px #4facfe80}.quick-match-section{display:flex;flex-direction:column;align-items:center;gap:.5rem;margin-top:1.5rem}.btn-large{font-size:1.2rem;padding:1rem 2rem;min-width:250px}.quick-match-hint{font-size:.85rem;color:#888;margin:0}.divider{display:flex;align-items:center;margin:1.5rem 0;color:#666}.divider:before,.divider:after{content:"";flex:1;height:1px;background:#444}.divider span{padding:0 1rem;font-size:.9rem}.name-input-section input{padding:.6rem 1rem;border-radius:6px;border:1px solid #555;background:#222;color:#fff;text-align:center;font-size:1rem;width:250px;box-sizing:border-box}.lobby-actions{display:flex;gap:2rem;align-items:center}.action-box{background:#222;padding:2rem;border-radius:12px;text-align:center;width:250px;display:flex;flex-direction:column;gap:1rem;border:1px solid #444}.action-box h3{margin:0;color:#aaa}.action-box p{font-size:.9rem;color:#888}.divider{font-weight:700;color:#666}.room-id-display{font-size:2rem;background:#333;padding:1rem 2rem;border-radius:8px;margin:1rem 0;border:2px dashed #666;display:flex;align-items:center;gap:1rem;justify-content:center}.room-id-display span{color:#4facfe;font-weight:700}.copy-btn{background:none;border:none;font-size:1.5rem;cursor:pointer;padding:.5rem;border-radius:50%;transition:background .2s}.copy-btn:hover{background:#ffffff1a}.waiting-room{text-align:center;background:#222;padding:3rem;border-radius:16px}.loading-spinner{margin-top:1rem;color:#aaa;font-style:italic;animation:pulse 1.5s infinite}.btn-cancel{margin-top:1rem;padding:.6rem 1.2rem;font-size:.9rem;background:#ffffff1a;color:#aaa;border:1px solid #666;border-radius:6px;cursor:pointer;transition:all .2s}.btn-cancel:hover{background:#ffffff26;border-color:#888}input[type=text]{padding:.8rem;border-radius:4px;border:1px solid #555;background:#111;color:#fff;text-align:center;font-size:1.2rem;letter-spacing:2px;width:100%;box-sizing:border-box}@media(max-width:768px){.lobby-container{gap:.4rem;padding:.4rem 0;transform:translateY(-50px)}.lobby-container h2{font-size:.8rem;margin:0}.name-input-section{gap:.32rem;margin-top:.4rem}.name-input-section label{font-size:.72rem}.name-input-section input{padding:.4rem .64rem;font-size:.72rem}.quick-match-section{gap:.32rem;margin-top:.8rem}.btn-large{font-size:.8rem;padding:.64rem 1.28rem;min-width:160px}.quick-match-hint{font-size:.56rem}.divider{display:none}.lobby-actions{flex-direction:column;gap:.4rem}.divider{transform:rotate(90deg);margin:.2rem 0}.action-box{width:90%;max-width:300px;padding:.4rem;gap:.3rem}.action-box h3{font-size:.75rem;margin:0}.action-box p{font-size:.65rem;margin:0}.action-box button{padding:.64rem 1.28rem;font-size:.8rem}.action-box input{padding:.4rem .64rem;font-size:.75rem}.room-id-display{font-size:.8rem;padding:.32rem;flex-direction:row}.waiting-room{padding:.64rem}.waiting-room h3{font-size:.76rem;margin:0 0 .24rem}}.skin-store-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000d9;display:flex;justify-content:center;align-items:center;z-index:2000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.skin-store-modal{background:#1e1e24;border:1px solid #333;padding:30px;border-radius:20px;width:90%;max-width:600px;max-height:90vh;overflow-y:auto;text-align:center;position:relative;box-shadow:0 10px 30px #00000080;display:flex;flex-direction:column}.skin-store-modal h2{margin-top:0;margin-bottom:5px;color:#fff;font-size:2rem;text-shadow:0 0 10px rgba(255,255,255,.2)}.store-subtitle{color:#aaa;margin-bottom:20px;font-size:.9rem}.expiry-notice{color:#fff;margin-bottom:20px;font-size:.9rem;font-weight:700;text-shadow:0 0 5px rgba(255,0,0,.5)}.store-tabs{display:flex;justify-content:center;gap:10px;margin-bottom:20px}.tab-btn{background:transparent;border:2px solid #333;color:#888;padding:8px 20px;border-radius:20px;font-size:1rem;cursor:pointer;transition:all .2s}.tab-btn.active{background:#fff;color:#000;border-color:#fff;font-weight:700;box-shadow:0 0 10px #ffffff4d}.skins-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:15px;margin-bottom:30px;flex:1;overflow-y:auto}.skin-item{background:#2b2b35;border-radius:12px;padding:15px;cursor:pointer;border:2px solid transparent;transition:all .2s;position:relative;display:flex;flex-direction:column;align-items:center;gap:10px}.skin-item:hover{background:#363642;transform:translateY(-2px)}.skin-item.selected{border-color:#4da8da;background:#4da8da1a;box-shadow:0 0 15px #4da8da33}.skin-item.pending{border-color:#fc0;animation:pulse-border 2s infinite}.skin-preview{width:60px;height:60px;display:flex;justify-content:center;align-items:center}.preview-card{width:40px;height:56px;border-radius:4px;background-color:#1a1a1a;border:2px solid #444;position:relative}.preview-board{width:60px;height:60px;border-radius:50%;border:2px solid #555;position:relative;background-color:#2e7d32;overflow:hidden}.gacha-banner{background:linear-gradient(135deg,#7b2cbf,#240046);border-radius:12px;padding:16px;margin-bottom:20px;display:flex;align-items:center;cursor:pointer;box-shadow:0 4px 15px #7b2cbf66;position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s}.gacha-banner:hover{transform:translateY(-2px);box-shadow:0 6px 20px #7b2cbf99}.gacha-banner:after{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(to bottom right,transparent,rgba(255,255,255,.1),transparent);transform:rotate(45deg);animation:shine 3s infinite}.gacha-icon{font-size:2.5rem;margin-right:16px;animation:bounce 2s infinite}.gacha-text{flex:1}.gacha-text h3{margin:0;color:gold;font-size:1.2rem;text-transform:uppercase;text-shadow:0 0 10px rgba(255,215,0,.5)}.gacha-text p{margin:4px 0 0;font-size:.9rem;color:#fffc}.gacha-btn{background:#ff006e;color:#fff;padding:8px 16px;border-radius:20px;font-weight:700;font-size:.9rem;box-shadow:0 2px 10px #ff006e66}.gacha-pending{background:#1a1a1a;border-radius:12px;padding:20px;margin-bottom:20px;text-align:center;border:1px solid #333}.btn-claim-gacha{background:linear-gradient(45deg,#ff9e00,#ff0054);color:#fff;border:none;padding:12px 32px;border-radius:25px;font-size:1.2rem;font-weight:700;cursor:pointer;box-shadow:0 0 20px #ff005480;margin-top:10px}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes shine{0%{transform:translate(-100%) rotate(45deg)}to{transform:translate(100%) rotate(45deg)}}@keyframes shake-hint{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-10px);background:linear-gradient(135deg,#9d4edd,#3c096c)}20%,40%,60%,80%{transform:translate(10px)}}.shake-hint{animation:shake-hint .4s ease-in-out}.skin-name{font-size:.9rem;color:#ddd;font-weight:500}.lock-icon{position:absolute;top:5px;right:5px;font-size:.8rem;opacity:.7}.check-icon{position:absolute;top:5px;right:5px;color:#4da8da;font-weight:700;font-size:1rem;background:#00000080;border-radius:50%;width:20px;height:20px;display:flex;justify-content:center;align-items:center}.claim-overlay{position:absolute;inset:0;background:#000c;border-radius:10px;display:flex;justify-content:center;align-items:center;z-index:10}.watching-text{color:#aaa;font-size:.8rem;font-style:italic;animation:pulse 1.5s infinite}.btn-claim{background:#fc0;color:#000;border:none;padding:5px 12px;border-radius:20px;font-weight:700;font-size:.9rem;cursor:pointer;box-shadow:0 0 10px #ffcc0080}.store-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.coin-balance{background:#0009;border:1px solid #ffd700;padding:5px 10px;border-radius:20px;display:flex;align-items:center;gap:8px;color:gold;font-weight:700}.btn-add-coins{background:#28a745;border:none;color:#fff;width:24px;height:24px;border-radius:50%;font-size:1.2rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}.gacha-actions{display:flex;gap:10px;margin-bottom:1.5rem}.gacha-option{flex:1;background:linear-gradient(135deg,#4da8da,#007bb5);padding:15px;border-radius:12px;cursor:pointer;text-align:center;transition:transform .1s;border:2px solid rgba(255,255,255,.1)}.gacha-option:active{transform:scale(.98)}.gacha-option.special{background:linear-gradient(135deg,#9c40ff,#7000e0);border:2px solid #ffd700}.gacha-label{font-size:1.1rem;font-weight:700;margin-bottom:5px}.gacha-cost{font-size:.9rem;opacity:.9}.store-tabs{display:flex;gap:10px;margin-bottom:1rem;justify-content:center}.btn-close{background:#e74c3c;color:#fff;border:none;padding:10px 30px;font-size:1rem;border-radius:25px;cursor:pointer;transition:background .2s;margin-top:auto}.btn-close:hover{background:#c0392b}.btn-close-x{position:absolute;top:15px;right:15px;background:transparent;border:none;color:#666;font-size:1.5rem;cursor:pointer;line-height:1;width:30px;height:30px;border-radius:50%;display:flex;justify-content:center;align-items:center;transition:all .2s}.btn-close-x:hover{color:#fff;background:#ffffff1a}@keyframes pulse{0%{opacity:.5}50%{opacity:1}to{opacity:.5}}@keyframes pulse-border{0%{border-color:#fc0}50%{border-color:#fff}to{border-color:#fc0}}@media(max-width:480px){.skin-store-modal{padding:20px;width:95%}.skins-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}}.gacha-reveal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:9999;background:#000;display:flex;justify-content:center;align-items:center;flex-direction:column;overflow:hidden}.stage-summon .energy-orb{animation:pulse-summon 1.5s infinite ease-in-out}.energy-orb{width:100px;height:100px;border-radius:50%;background:radial-gradient(circle,#fff,#7b2cbf,#240046);box-shadow:0 0 20px #7b2cbf,0 0 50px #3c096c;position:relative;z-index:10}.summon-circle{position:absolute;width:300px;height:300px;border:2px solid rgba(123,44,191,.5);border-radius:50%;animation:spin-slow 10s linear infinite}.summon-circle:before{content:"";position:absolute;inset:-10px;border:2px dashed rgba(224,170,255,.3);border-radius:50%;animation:spin-reverse 15s linear infinite}.stage-charging .energy-orb{animation:shake-charge .1s infinite;background:radial-gradient(circle,#fff,#ff006e,#590d22);box-shadow:0 0 40px #ff006e,0 0 80px #800f2f;scale:1.2}.stage-charging .summon-circle{border-color:#ff006e;animation:spin-fast 1s linear infinite,collapse 2.5s forwards}.charge-particles{position:absolute;width:100%;height:100%;background:radial-gradient(circle at 50% 50%,transparent 20%,rgba(255,0,110,.2) 21%,transparent 22%),radial-gradient(circle at 40% 60%,transparent 20%,rgba(131,56,236,.2) 21%,transparent 22%);animation:zoom-in 2s linear infinite;pointer-events:none}.white-flash{position:absolute;top:0;left:0;width:100%;height:100%;background:#fff;animation:flash-fade .5s ease-out forwards;z-index:100}.stage-reveal{background:radial-gradient(circle at center,#240046,#000)}.reveal-container{display:flex;flex-direction:column;align-items:center;animation:float-in 1s ease-out;justify-content:center;width:100%;height:100%;max-width:none!important;animation:pop-in .2s cubic-bezier(.175,.885,.32,1.275);z-index:20}.gacha-title{color:#ff9e00;font-size:3rem;text-transform:uppercase;text-shadow:0 0 20px #ff9e00;margin-bottom:2rem;animation:scale-bounce .8s cubic-bezier(.175,.885,.32,1.275)}.item-showcase{position:relative;width:200px;height:200px;display:flex;justify-content:center;align-items:center;margin-bottom:2rem;transform:scale(1.5);margin:40px 0}.item-showcase:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:250px;height:250px;background:radial-gradient(circle,var(--item-color, #fff) 0%,transparent 70%);opacity:.5;z-index:2000;animation:pulse-glow 2s infinite}.preview-card-large{width:120px;height:180px;border-radius:12px;perspective:1000px;box-shadow:0 10px 30px #00000080}.preview-board-large{width:180px;height:120px;border-radius:12px;border:2px solid rgba(255,255,255,.2);display:flex;justify-content:center;align-items:center;box-shadow:0 10px 30px #00000080}.gacha-reveal-content{background:transparent;padding:0;border:none;box-shadow:none;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;animation:pop-in .5s cubic-bezier(.175,.885,.32,1.275);position:relative;overflow:hidden}.gacha-reveal-content h2{color:#ff9e00;margin-bottom:40px;font-size:3.5rem;text-shadow:0 0 20px rgba(255,158,0,.8);z-index:10}.results-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:20px;margin-bottom:40px;padding:20px;max-height:70vh;overflow-y:auto;z-index:10;width:100%;max-width:1000px;justify-items:center}.reveal-item{display:flex;flex-direction:column;align-items:center;width:120px;animation:pop-in .3s cubic-bezier(.175,.885,.32,1.275) backwards}.reveal-item:nth-child(1){animation-delay:.1s}.reveal-item:nth-child(2){animation-delay:.2s}.reveal-item:nth-child(3){animation-delay:.3s}.reveal-item:nth-child(4){animation-delay:.4s}.reveal-item:nth-child(5){animation-delay:.5s}.reveal-item:nth-child(6){animation-delay:.6s}.reveal-item:nth-child(7){animation-delay:.7s}.reveal-item:nth-child(8){animation-delay:.8s}.reveal-item:nth-child(9){animation-delay:.9s}.reveal-item:nth-child(10){animation-delay:1s}.reveal-preview{width:60px;height:60px;border-radius:12px;background:#ffffff1a;display:flex;justify-content:center;align-items:center;margin-bottom:10px;border:2px solid rgba(255,255,255,.3)}.reveal-preview.type-dice{border-color:gold;color:gold}.reveal-preview.type-card{border-color:#ff006e;color:#ff006e}.reveal-preview.type-board{border-color:#00d4ff;color:#00d4ff}.reveal-name{color:#fff;font-size:.8rem;text-align:center;word-break:break-all}.gacha-title,h2{color:#ff9e00;font-size:2.5rem;text-transform:uppercase;text-shadow:0 0 20px #ff9e00;margin-bottom:2rem;animation:scale-bounce .8s cubic-bezier(.175,.885,.32,1.275)}.item-name{font-size:2rem;color:#fff;font-weight:700;text-shadow:0 0 10px rgba(255,255,255,.5);margin-bottom:3rem}.tap-to-close,.btn-collect{color:#fff9;font-size:1rem;animation:blink 2s infinite;cursor:pointer;background:transparent;border:1px solid rgba(255,255,255,.5);padding:10px 40px;border-radius:30px;margin-top:20px}.btn-collect:hover{background:#ffffff1a;color:#fff}.god-rays{position:absolute;top:50%;left:50%;width:100vmax;height:100vmax;background:conic-gradient(from 0deg,transparent 0deg,rgba(255,255,255,.1) 10deg,transparent 20deg,rgba(255,255,255,.1) 30deg,transparent 40deg,rgba(255,255,255,.1) 50deg,transparent 60deg,rgba(255,255,255,.1) 70deg,transparent 80deg);transform:translate(-50%,-50%);animation:spin-slow 20s linear infinite;mix-blend-mode:screen;pointer-events:none;z-index:0}@keyframes pulse-summon{50%{transform:scale(1.1);opacity:1}to{transform:scale(1);opacity:.8}}@keyframes spin-slow{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}@keyframes spin-reverse{0%{transform:rotate(360deg)}to{transform:rotate(0)}}@keyframes spin-fast{0%{transform:rotate(0)}to{transform:rotate(720deg)}}@keyframes shake-violent{0%{transform:translate(0) rotate(0) scale(1.2)}25%{transform:translate(-10px,10px) rotate(-1deg) scale(1.25);filter:hue-rotate(90deg)}50%{transform:translate(10px,-10px) rotate(1deg) scale(1.3);filter:hue-rotate(180deg)}75%{transform:translate(-10px,-10px) rotate(-1deg) scale(1.25);filter:hue-rotate(270deg)}to{transform:translate(0) rotate(0) scale(1.2)}}.warp-lines{position:absolute;top:50%;left:50%;width:200vmax;height:200vmax;background:conic-gradient(from 0deg,transparent 0deg,rgba(255,255,255,.8) 2deg,transparent 5deg);transform:translate(-50%,-50%);animation:warp-speed .2s linear infinite;opacity:.5;pointer-events:none;z-index:5}@keyframes warp-speed{0%{transform:translate(-50%,-50%) rotate(0) scale(1)}to{transform:translate(-50%,-50%) rotate(180deg) scale(1.5)}}@keyframes bg-pulse{0%{filter:brightness(1)}50%{filter:brightness(1.2)}to{filter:brightness(1)}}@keyframes shake-charge{0%{transform:translate(0) scale(1.2)}25%{transform:translate(-5px,5px) scale(1.25)}50%{transform:translate(5px,-5px) scale(1.2)}75%{transform:translate(-5px,-5px) scale(1.25)}to{transform:translate(0) scale(1.2)}}@keyframes collapse{0%{width:300px;height:300px;opacity:1}to{width:0;height:0;opacity:0}}@keyframes flash-fade{0%{opacity:1}to{opacity:0}}@keyframes float-in{0%{transform:translateY(50px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes scale-bounce{0%{transform:scale(0)}60%{transform:scale(1.2)}to{transform:scale(1)}}@keyframes pulse-glow{0%{transform:translate(-50%,-50%) scale(1);opacity:.5}50%{transform:translate(-50%,-50%) scale(1.2);opacity:.3}to{transform:translate(-50%,-50%) scale(1);opacity:.5}}@keyframes blink{0%,to{opacity:.6}50%{opacity:.2}}.contact-modal{background:#1a1a1a;width:90%;max-width:500px;padding:24px;border-radius:12px;border:1px solid #333;box-shadow:0 10px 30px #00000080;color:#eee}.contact-modal h2{margin:0 0 20px;font-size:1.5rem;color:#fff;display:flex;align-items:center;gap:10px}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.close-btn{background:#ffffff1a;border:none;color:#fff;font-size:1.8rem;cursor:pointer;padding:0;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background .2s}.close-btn:hover{background:#fff3;color:#fff}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;font-size:.9rem;color:#ccc;font-weight:500}.required{color:#f44}.category-options{display:flex;gap:10px}.cat-btn{flex:1;padding:10px;border-radius:8px;border:1px solid #333;background:#252525;color:#aaa;cursor:pointer;transition:all .2s;font-size:.9rem}.cat-btn:hover{background:#333}.cat-btn.active{background:#4a90e2;color:#fff;border-color:#4a90e2}input,textarea{width:100%;padding:12px;border-radius:8px;border:1px solid #333;background:#252525;color:#fff;font-family:inherit;font-size:.95rem;box-sizing:border-box}input:focus,textarea:focus{outline:none;border-color:#4a90e2;background:#2a2a2a}textarea{resize:vertical;min-height:100px}.modal-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:24px}.btn-secondary{background:transparent;border:1px solid #444;color:#ccc;padding:10px 20px;border-radius:8px;cursor:pointer}.btn-secondary:hover{background:#333;color:#fff}.btn-primary{background:#4a90e2;border:none;color:#fff;padding:10px 24px;border-radius:8px;cursor:pointer;font-weight:600}.btn-primary:hover:not(:disabled){background:#357abd}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.error-message{color:#f44;font-size:.9rem;margin-bottom:15px;padding:10px;background:#ff44441a;border-radius:6px}.contact-modal.success{text-align:center;padding:40px}.success-icon{font-size:3rem;margin-bottom:15px}.app{text-align:center;min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center}.app-header{background:#2c3e50;color:#fff;padding:.3rem;box-shadow:0 2px 4px #0000001a}.header-title-row{position:relative;display:flex;justify-content:center;align-items:center;width:100%;min-height:1.5rem}.app-header h1{font-size:1rem;margin:0;text-align:center}.app-header .version{position:absolute;right:.2rem;top:50%;transform:translateY(-50%);font-size:.6rem;color:#888;font-weight:400}.btn-fullscreen{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;cursor:pointer;margin-left:auto;margin-right:10px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);transition:all .2s}.btn-fullscreen:hover{background:#fff3;transform:scale(1.05)}.btn-fullscreen:active{transform:scale(.95)}body:has(.game-result-overlay) .app-header{display:none}.game-board{flex:1;padding:20px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}.play-area{display:flex;flex-direction:column;gap:32px;width:100%;max-width:none;transform:scale(.8);transform-origin:center center;margin-top:-90px}.opponent-area,.player-area{background:#fff;padding:16px;border-radius:12px;box-shadow:0 4px 6px #0000000d}.opponent-area{opacity:.9;transform:scale(.95)}.opponent-area .board{transform:rotate(180deg)}.controls{background:#fff;padding:8px;box-shadow:0 -2px 10px #0000000d;position:sticky;bottom:0}.hand-container{margin-bottom:8px;display:flex;justify-content:center}.action-bar{display:flex;justify-content:center;align-items:center;gap:10px;min-height:30px;font-size:.85rem}.btn-primary{background:#007bff;color:#fff;border:none;padding:12px 24px;font-size:1.1rem;border-radius:6px;cursor:pointer;transition:background .2s}.btn-primary:hover{background:#0056b3}.btn-secondary{background:#28a745;color:#fff;border:none;padding:12px 24px;font-size:1.1rem;border-radius:6px;cursor:pointer;transition:background .2s}.btn-secondary:hover{background:#1e7e34}.btn-secondary:disabled{background:#6c757d;cursor:not-allowed;opacity:.6}.toggle-hidden{display:flex;align-items:center;gap:8px;font-weight:700;cursor:pointer;-webkit-user-select:none;user-select:none;color:#000;white-space:nowrap}.instruction{color:#666;font-style:italic;min-height:1.2em;display:block}@media(max-width:900px){.instruction{width:100%;text-align:center}}.setup-screen{display:flex;flex-direction:column;align-items:center;gap:20px}@media(max-width:900px){.app{height:100dvh;overflow:hidden;display:flex;flex-direction:column;justify-content:center;gap:0}.app-header{padding:.2rem .2rem 0;flex-shrink:0;z-index:20}.app-header h1{font-size:1rem;margin:0;line-height:1.2}.game-board{flex:1;padding:20px 0 0;min-height:0;display:flex;flex-direction:column;justify-content:center;align-items:center}.play-area{gap:0;width:100%;transform:scale(.63) translateY(-115px);transform-origin:center center;margin:0;padding:0;flex:0 0 auto;display:flex;flex-direction:column;align-items:center}.controls{padding:5px;flex-shrink:0;background:#fffffff2;z-index:10;width:100vw;box-sizing:border-box;position:relative;bottom:110px}.action-bar{display:flex;justify-content:center;align-items:center;width:100%;margin-top:5px}.place-controls{display:flex;justify-content:center;width:100%}.toggle-hidden{display:inline-flex;align-items:center;justify-content:center;gap:4px;white-space:nowrap;font-size:.8rem;background:#ffffffe6;padding:6px 8px;border-radius:20px;max-width:95vw;width:fit-content;flex:0 0 auto}.toggle-hidden input{margin:0;padding:0;width:16px;height:16px;flex-shrink:0}.app-header.battle-mode{display:none!important}}.waiting-message{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:2rem;background:#ffffffe6;border-radius:12px;box-shadow:0 4px 6px #0000001a}.waiting-message h3{margin:0;color:#333}.loading-spinner{width:24px;height:24px;border:3px solid #ddd;border-top-color:#007bff;border-radius:50%;animation:spinner .8s linear infinite}@keyframes spinner{to{transform:rotate(360deg)}}.mode-switch{display:flex;gap:10px;justify-content:center;margin-top:5px}.mode-switch button{background:#ffffff1a;border:1px solid rgba(255,255,255,.3);color:#ccc;padding:4px 12px;font-size:.8rem;border-radius:15px;cursor:pointer;transition:all .2s}.mode-switch button:hover{background:#fff3;color:#fff}.mode-switch button.active{background:#3498db;border-color:#3498db;color:#fff;font-weight:700;box-shadow:0 0 5px #3498db80}.auth-status{position:absolute;top:10px;right:10px;z-index:50}.btn-auth{padding:6px 12px;background:#4da8da;border:none;color:#000;border-radius:4px;font-weight:700;cursor:pointer;font-size:1rem}@media(max-width:900px){.auth-status{top:2px;right:2px}.btn-auth{padding:10px 4px;font-size:.65rem;line-height:1.1;white-space:break-spaces;max-width:60px;text-align:center}}.ad-banner-container{width:100%;height:50px;background-color:#f0f0f0;display:flex;align-items:center;justify-content:center;margin-top:2rem;border-radius:4px}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000c;display:flex;justify-content:center;align-items:center;z-index:9999}.modal-content{background:#fff;padding:2rem;border-radius:16px;text-align:center;box-shadow:0 10px 25px #00000080;max-width:90%;width:320px;animation:popIn .3s cubic-bezier(.175,.885,.32,1.275)}.modal-content h3{margin-top:0;color:#2c3e50}.modal-actions{display:flex;justify-content:center;gap:1rem;margin-top:1.5rem}@keyframes popIn{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}.finish-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0006;display:flex;justify-content:center;align-items:center;z-index:10000;pointer-events:none}.finish-text{font-size:clamp(3rem,15vw,6rem);text-align:center;width:100%;font-weight:900;color:#fc0;text-shadow:0 0 20px rgba(0,0,0,.5),0 0 10px white;animation:finishPop .5s cubic-bezier(.175,.885,.32,1.275) forwards;letter-spacing:.5rem}@keyframes finishPop{0%{transform:scale(0) rotate(-10deg);opacity:0}60%{transform:scale(1.2) rotate(5deg);opacity:1}to{transform:scale(1) rotate(0);opacity:1}}.active-auto{animation:pulse-red 1.5s infinite}@keyframes pulse-red{0%{box-shadow:0 0 #e91e63b3}70%{box-shadow:0 0 0 10px #e91e6300}to{box-shadow:0 0 #e91e6300}}.dice-roll-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000e6;z-index:2000;display:flex;justify-content:center;align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.dice-roll-content{text-align:center;display:flex;flex-direction:column;align-items:center;gap:2rem}.dice-container-large .dice{font-size:3rem;box-shadow:0 10px 25px #00000080}@media(max-width:900px){.dice-container-large{transform:scale(.3);transform-origin:center center}}.dice-roll-title{color:#fff;font-size:2.5rem;text-shadow:0 0 10px rgba(79,172,254,.8);font-weight:700;letter-spacing:2px}.dice-container-large{display:flex;gap:1.5rem}.rolling-dice{transition:transform .2s}.rolling-dice.shaking{animation:shake .1s infinite}.rolling-dice.landed{transform:scale(1.1);animation:land-pulse .3s ease-out}@keyframes shake{0%{transform:translate(1px,1px) rotate(0)}10%{transform:translate(-1px,-2px) rotate(-1deg)}20%{transform:translate(-3px) rotate(1deg)}30%{transform:translate(3px,2px) rotate(0)}40%{transform:translate(1px,-1px) rotate(1deg)}50%{transform:translate(-1px,2px) rotate(-1deg)}60%{transform:translate(-3px,1px) rotate(0)}70%{transform:translate(3px,1px) rotate(-1deg)}80%{transform:translate(-1px,-1px) rotate(1deg)}90%{transform:translate(1px,2px) rotate(0)}to{transform:translate(1px,-2px) rotate(-1deg)}}@keyframes land-pulse{0%{transform:scale(1.1);filter:brightness(1.5)}50%{transform:scale(1.3);filter:brightness(2);box-shadow:0 0 20px #ffffff80}to{transform:scale(1.1);filter:brightness(1)}}@media(max-width:600px){.dice-container-large{gap:.5rem}.dice-roll-title{font-size:1.5rem}}.rules-overlay{position:fixed;inset:0;background-color:#000000d9;display:flex;justify-content:center;align-items:center;z-index:1000;animation:fadeIn .2s ease-out}.rules-content{background:linear-gradient(135deg,#1a1a2e,#16213e);border:1px solid #4da8da;border-radius:16px;padding:24px;width:90%;max-width:600px;max-height:85vh;display:flex;flex-direction:column;box-shadow:0 0 30px #4da8da4d;position:relative;color:#e0e0e0}.rules-content h2{margin-top:0;margin-bottom:20px;text-align:center;color:#4da8da;border-bottom:2px solid rgba(77,168,218,.2);padding-bottom:10px}.close-btn{position:absolute;top:10px;right:15px;background:none;border:none;color:#888;font-size:2rem;cursor:pointer;padding:0;line-height:1;transition:color .2s}.rules-scroll-area{overflow-y:auto;padding-right:10px}.rules-scroll-area::-webkit-scrollbar{width:6px}.rules-scroll-area::-webkit-scrollbar-track{background:#ffffff1a;border-radius:3px}.rules-scroll-area::-webkit-scrollbar-thumb{background:#4da8da;border-radius:3px}section{margin-bottom:24px;background:#ffffff08;padding:15px;border-radius:8px}h3{margin-top:0;color:#fc0;display:flex;align-items:center;gap:8px}.rules-list,ol{padding-left:20px;line-height:1.6}.score-explanation{display:flex;flex-direction:column;gap:12px}.score-item{background:#0000004d;padding:10px;border-radius:6px;border-left:3px solid #ffcc00}.score-item strong{color:#fff;display:block;margin-bottom:4px}.score-item p{margin:4px 0;font-size:.95rem;color:#ccc}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media(max-width:600px){.rules-content{padding:16px;max-height:90vh}.rules-content h2{font-size:1.5rem}.rankings-grid{flex-direction:column}}.rankings-grid{display:flex;gap:20px}.ranking-column{flex:1;background:#0003;padding:15px;border-radius:8px;border:1px solid rgba(255,255,255,.1)}.ranking-column h4{margin-top:0;margin-bottom:10px;color:#4da8da;border-bottom:1px solid rgba(77,168,218,.3);padding-bottom:5px;font-size:1rem}.hand-list{margin:0;padding-left:20px}.hand-list li{margin-bottom:4px;font-size:.9rem;color:#ddd}.note{font-size:.8em;color:#888;margin-left:4px}.hand-example{margin-bottom:12px;background:#0003;padding:8px;border-radius:6px}.hand-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.hand-title{color:#e0e0e0;font-weight:700;font-size:.95rem}.hand-note{font-size:.8rem;color:gold;background:#ffd7001a;padding:2px 6px;border-radius:4px}.hand-cards{display:flex;gap:4px;justify-content:flex-start;flex-wrap:wrap}.turn-timer{position:fixed;top:80px;right:20px;background:#000000d9;border:4px solid #fff;border-radius:12px;padding:10px 20px;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 4px 12px #00000080;z-index:100;width:100px;transition:border-color .3s ease}@media(max-width:600px){.turn-timer{top:55px;bottom:auto;right:5px;width:80px;padding:5px 10px;transform:scale(.8);transform-origin:top right}}.timer-label{font-size:.8rem;color:#aaa;margin-bottom:2px}.timer-value{font-size:1.8rem;font-weight:700;color:#fff;font-family:monospace}.turn-timer.warning .timer-value{color:#fc0;animation:pulse 1s infinite}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.auth-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000c;display:flex;justify-content:center;align-items:center;z-index:2000}.auth-content{background:#1a1a1a;padding:30px;border-radius:12px;width:90%;max-width:400px;position:relative;border:1px solid #333;box-shadow:0 4px 20px #00000080;color:#fff;text-align:center}.auth-content h2{margin-top:0;margin-bottom:10px}.auth-description{color:#888;margin-bottom:20px;font-size:.9rem}.auth-error{background:#ff00001a;border:1px solid #ff4444;color:#f44;padding:10px;border-radius:4px;margin-bottom:20px;font-size:.9rem}.auth-content form input{width:100%;padding:12px;background:#333;border:1px solid #444;border-radius:6px;margin-bottom:12px;color:#fff;box-sizing:border-box}.auth-content form input:focus{outline:none;border-color:#4da8da}.auth-submit-btn{width:100%;padding:12px;background:#4da8da;color:#000;border:none;border-radius:6px;font-weight:700;cursor:pointer;margin-top:10px;transition:background .2s}.auth-submit-btn:hover{background:#3d98c9}.auth-submit-btn:disabled{background:#555;cursor:wait}.auth-toggle{margin-top:20px;padding-top:20px;border-top:1px solid #333}.auth-toggle button{background:none;border:none;color:#888;font-size:.9rem;cursor:pointer;text-decoration:underline}.auth-toggle button:hover{color:#fff}.close-btn{position:absolute;top:10px;right:15px;background:none;border:none;color:#666;font-size:1.5rem;cursor:pointer}.close-btn:hover{color:#fff}.mypage-overlay{position:fixed;inset:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.mypage-content{background:#1a1a1a;width:90%;max-width:500px;height:80vh;border-radius:12px;border:1px solid #333;display:flex;flex-direction:column;position:relative;box-shadow:0 10px 30px #00000080;color:#eee}.close-btn{position:absolute;top:10px;right:15px;background:#ffffff1a;border:none;color:#fff;font-size:1.8rem;cursor:pointer;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background .2s;z-index:10}.close-btn:hover{background:#fff3}.mypage-header{padding:20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #333;gap:15px}.header-left{display:flex;flex-direction:column;gap:5px}.mypage-header h2{margin:0;font-size:1.5rem;background:linear-gradient(45deg,#fff,#aaa);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.user-identity{min-height:24px}.name-display-row{display:flex;align-items:center;gap:8px}.username{font-size:1rem;color:#4da8da;font-weight:700}.edit-icon-btn{background:none;border:none;color:#666;cursor:pointer;font-size:1rem;padding:0}.edit-icon-btn:hover{color:#fff}.name-edit-row{display:flex;align-items:center;gap:5px}.name-input{background:#333;border:1px solid #555;color:#fff;padding:4px 8px;border-radius:4px;font-size:.9rem;width:120px}.save-btn,.cancel-btn{padding:4px 8px;border-radius:4px;border:none;cursor:pointer;font-size:.8rem;font-weight:700}.save-btn{background:#4da8da;color:#000}.cancel-btn{background:#444;color:#ccc}.level-badge{background:linear-gradient(135deg,#f09819,#edde5d);padding:5px 10px;border-radius:20px;color:#000;font-weight:700;display:flex;align-items:center;gap:4px;box-shadow:0 0 10px #f0981966}.level-label{font-size:.7rem;opacity:.8}.level-val{font-size:1.2rem}.mypage-tabs{display:flex;background:#111}.mypage-tabs button{flex:1;background:transparent;border:none;padding:15px;color:#666;font-weight:700;cursor:pointer;border-bottom:2px solid transparent;transition:all .2s}.mypage-tabs button.active{color:#fff;border-bottom-color:#4da8da;background:#4da8da0d}.mypage-body{flex:1;overflow-y:auto;padding:20px}.stats-view{display:grid;grid-template-columns:1fr 1fr 1fr;gap:15px}.stat-card{background:#252525;padding:15px;border-radius:8px;text-align:center;border:1px solid #333}.stat-card label{display:block;font-size:.8rem;color:#888;margin-bottom:5px;text-transform:uppercase;letter-spacing:1px}.stat-card .value{font-size:1.5rem;font-weight:700;color:#fff}.stat-card .value.highlight{color:#4da8da}.xp-section{grid-column:1 / -1;margin-top:20px;background:#252525;padding:15px;border-radius:8px;border:1px solid #333}.xp-labels{display:flex;justify-content:space-between;margin-bottom:8px;font-size:.9rem;color:#ccc}.xp-bar-bg{height:10px;background:#111;border-radius:5px;overflow:hidden}.xp-bar-fill{height:100%;background:linear-gradient(90deg,#4da8da,#00cdac);border-radius:5px}.ranking-view table{width:100%;border-collapse:collapse}.ranking-view th{text-align:left;color:#666;font-size:.8rem;padding-bottom:10px;border-bottom:1px solid #333}.ranking-view td{padding:12px 0;border-bottom:1px solid #222;font-size:.95rem}.ranking-view tr.highlight td{color:#f09819;font-weight:700}.achievement-item{display:flex;align-items:center;gap:15px;background:#252525;padding:12px;margin-bottom:10px;border-radius:8px;border:1px border #333}.achievement-item .icon{font-size:1.5rem;background:#333;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%}.achievement-item .info{flex:1}.achievement-item .title{font-weight:700;color:#eee}.achievement-item .date{font-size:.8rem;color:#666}.empty-state{text-align:center;color:#666;margin-top:50px}