html,body{margin:0;padding:0;width:100%;height:100%;overflow:hidden}#root{width:100vw;height:100vh;overflow:hidden}.app{display:flex;flex-direction:column;width:100vw;height:100vh;margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden}*,*:before,*:after{box-sizing:border-box}*:focus{outline:2px solid #667eea;outline-offset:2px}button{font-family:inherit;cursor:pointer;border:none;background:none}input,textarea,select{font-family:inherit}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#a8a8a8}.app-header{height:5vh;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;display:flex;align-items:center;justify-content:space-between;text-align:center;box-shadow:0 2px 4px #0000001a;flex-shrink:0;padding:0 20px;box-sizing:border-box;position:fixed;top:0;left:0;right:0;z-index:1000}.header-left,.header-right{display:flex;align-items:center;min-width:60px}.header-right{justify-content:flex-end}.header-center{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}.app-header .hamburger-menu-button{width:40px!important;height:40px!important;background:rgba(255,255,255,.2)!important;border:2px solid rgba(255,255,255,.5)!important;border-radius:8px!important;cursor:pointer!important;padding:0!important;display:flex!important;align-items:center!important;justify-content:center!important;transition:all .3s ease!important;backdrop-filter:blur(5px)!important;box-shadow:0 2px 8px #0000004d!important;z-index:10!important}.app-header .hamburger-menu-button:hover{background:rgba(255,255,255,.3)!important;border-color:#ffffffb3!important;transform:scale(1.05)!important;box-shadow:0 4px 12px #0006!important}.app-header .menu-icon{display:flex!important;flex-direction:column!important;gap:3px!important;width:18px!important;pointer-events:none!important}.app-header .menu-icon span{width:100%!important;height:2px!important;background:white!important;border-radius:1px!important;transition:all .3s ease!important;display:block!important}.app-header .hamburger-menu-button:hover .menu-icon span{background:#ffffff!important}.app-header h1{margin:0;font-size:1.4rem;line-height:1}.app-header p{margin:.2rem 0 0;opacity:.9;font-size:.8rem}.app-content{height:90vh;width:100%;background:#f5f5f5;flex-shrink:0;overflow:hidden;display:flex;align-items:center;justify-content:center;margin-top:5vh;margin-bottom:5vh;box-sizing:border-box}.app-footer{height:5vh;background:#333;color:#fff;text-align:center;display:flex;align-items:center;justify-content:center;flex-shrink:0;position:fixed;bottom:0;left:0;right:0;z-index:1000}.app-footer p{margin:0;font-size:.9rem}@media (max-width: 768px){.app-header h1{font-size:1.4rem}.app-header p{font-size:.8rem}.app-header{padding:0 15px}.app-header .hamburger-menu-button{width:35px!important;height:35px!important}.app-header .menu-icon{width:16px!important;gap:2px!important}}button{background-color:#4caf50;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:4px;cursor:pointer;font-size:1rem;transition:background-color .3s}button:hover:not(:disabled){background-color:#45a049}button:disabled{background-color:#ccc;cursor:not-allowed}.btn-primary{background:#667eea;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:.5rem;cursor:pointer;font-size:1rem;transition:background .2s}.btn-primary:hover:not(:disabled){background:#5a6fd8}.btn-primary:disabled{background:#ccc;cursor:not-allowed}.btn-secondary{background:#6c757d;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:.5rem;cursor:pointer;font-size:1rem;transition:background .2s}.btn-secondary:hover:not(:disabled){background:#5a6268}.btn-secondary:disabled{background:#ccc;cursor:not-allowed}.count-button{padding:1rem 2rem;font-size:1.25rem;background-color:#4caf50;min-width:250px;height:60px}.game-buttons button{padding:15px 20px;border:none;border-radius:4px;font-size:16px;font-weight:700;cursor:pointer;transition:all .3s ease;background-color:#3498db;color:#fff}.game-buttons button:hover{background-color:#2980b9;transform:scale(1.02)}.menu-button{display:flex;align-items:center;width:100%;background:white;border:2px solid #e2e8f0;border-radius:12px;padding:1.5rem;margin-bottom:1rem;cursor:pointer;transition:all .3s ease;text-align:left}.menu-button:hover{transform:translateY(-2px);box-shadow:0 8px 25px #0000001a;border-color:#cbd5e0}.menu-button.online-match:hover{border-color:#667eea;background:linear-gradient(135deg,#f7fafc 0%,#ebf8ff 100%)}.menu-button.room-match:hover{border-color:#38a169;background:linear-gradient(135deg,#f7fafc 0%,#f0fff4 100%)}.prompt-buttons{display:flex;gap:1rem;margin-top:1rem}.notification-close{background:none;border:none;font-size:1.2rem;cursor:pointer;margin-left:auto}@media (max-width: 768px){.menu-button{flex-direction:column;text-align:center;padding:1.5rem 1rem}}.form-group{margin-bottom:1.5rem;display:flex;flex-direction:column;align-items:flex-start;width:100%}.form-group label{margin-bottom:.5rem;font-weight:700;color:#555;display:block;font-weight:600}.form-group input{width:100%;padding:.75rem;font-size:1rem;border:1px solid #ddd;border-radius:4px;box-sizing:border-box;border:2px solid #ddd;transition:border-color .2s}.form-group input:focus{outline:none;border-color:#667eea}.form-help{font-size:.875rem;color:#666;margin-top:.25rem}.error-message{background:#fee;color:#c33;padding:.75rem;border-radius:.5rem;margin-bottom:1rem;border:1px solid #fcc;background-color:#e74c3c1a;color:var(--danger-color)}.waiting-message{background:#e8f4fd;color:#0c5460;padding:1rem;border-radius:.5rem;margin-top:1rem;text-align:center;color:#666;font-style:italic}.notifications{position:fixed;top:1rem;right:1rem;z-index:1000;max-width:400px;top:6vh}.notification{background:white;border-radius:.5rem;padding:1rem;margin-bottom:.5rem;box-shadow:0 4px 6px #0000001a;display:flex;align-items:center;gap:.5rem}.notification.error{background:#fee;border-left:4px solid #dc3545}.notification.info{background:#e3f2fd;border-left:4px solid #2196f3}.targeting-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:1000}.targeting-message{background:white;padding:2rem;border-radius:1rem;text-align:center;box-shadow:0 4px 6px #0000001a}.warning{color:#f44336;font-weight:700;font-size:1.2rem}.status-warning{color:#dc3545;font-size:.7rem;font-weight:700;animation:blink 1s infinite}.uchikeshi-prompt{background:#fff3cd;border:1px solid #ffeaa7;border-radius:.5rem;padding:1rem;margin-bottom:1rem}.discard-info{color:#856404;font-size:.9rem;margin-top:.5rem}.danger-display{margin-top:1rem;min-height:1.5rem}.main-menu{width:100%;height:100%;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);display:flex;align-items:center;justify-content:center;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;overflow:hidden}.menu-container{background:rgba(255,255,255,.95);border-radius:20px;padding:2rem;box-shadow:0 20px 40px #00000026;max-width:600px;width:90%;max-height:85%;text-align:center;overflow-y:auto;display:flex;flex-direction:column;gap:1.5rem}.menu-options h2{color:#2d3748;margin-bottom:1.5rem;font-size:1.6rem}.button-icon{font-size:2.5rem;margin-right:1.5rem;flex-shrink:0}.button-content h3{margin:0 0 .5rem;color:#2d3748;font-size:1.3rem}.button-content p{margin:0 0 .5rem;color:#4a5568;font-size:1rem}.button-content small{color:#718096;font-size:.85rem}.game-selection{max-width:500px;margin:0 auto;padding:20px;text-align:center;background-color:#f5f5f5;border-radius:8px;box-shadow:0 2px 10px #0000001a}.game-selection h2{color:#333;margin-bottom:20px}.game-buttons{display:flex;flex-direction:column;gap:15px}@media (max-width: 768px){.menu-container{padding:1.5rem;width:95%}.button-icon{margin-right:0;margin-bottom:1rem}}.matchmaking-container{width:100%;height:100%;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);display:flex;align-items:center;justify-content:center;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;overflow:hidden}.matchmaking-card,.match-found-card{background:rgba(255,255,255,.95);border-radius:16px;padding:2rem;box-shadow:0 20px 40px #00000026;max-width:500px;width:90%;max-height:85%;text-align:center;overflow-y:auto}.matchmaking-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.matchmaking-header h1{margin:0;color:#2d3748;font-size:1.6rem}.back-button{background:#e2e8f0;border:none;padding:.5rem 1rem;border-radius:8px;cursor:pointer;color:#4a5568;transition:background-color .2s}.back-button:hover{background:#cbd5e0}.player-input,.opponent-info{margin-bottom:2rem}.player-input h3,.opponent-info h3{color:#4a5568;margin-bottom:1rem}.player-name-input{width:100%;padding:.75rem;border:2px solid #e2e8f0;border-radius:8px;font-size:1rem;transition:border-color .2s}.player-name-input:focus{outline:none;border-color:#667eea}.player-name-input:disabled{background:#f7fafc;color:#a0aec0}.match-info{background:#f7fafc;padding:1.5rem;border-radius:8px;margin-bottom:2rem;border-left:4px solid #667eea}.match-info h3{margin:0 0 .5rem;color:#2d3748}.match-info p{margin:0;color:#4a5568}.opponent-card{background:#f7fafc;padding:1rem;border-radius:8px;border-left:4px solid #667eea}.opponent-name{font-weight:700;color:#2d3748;margin-bottom:.5rem}.opponent-rating{color:#718096;font-size:.9rem}.queue-status{text-align:center}.queue-info h3{color:#667eea;margin-bottom:1rem}.queue-details{background:#f7fafc;padding:1rem;border-radius:8px;margin-bottom:1.5rem}.queue-details div{margin-bottom:.5rem;color:#4a5568}.loading-animation{margin:1.5rem 0}.loading-spinner{width:40px;height:40px;border:4px solid #e2e8f0;border-top:4px solid #667eea;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto}.loading-dots{display:flex;justify-content:center;gap:.5rem}.loading-dots span{width:12px;height:12px;background:#667eea;border-radius:50%;animation:bounce 1.4s ease-in-out infinite both}.loading-dots span:nth-child(1){animation-delay:-.32s}.loading-dots span:nth-child(2){animation-delay:-.16s}@keyframes bounce{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}.match-found-title{color:#38a169;margin-bottom:1.5rem}.match-details{background:#f7fafc;padding:1rem;border-radius:8px;margin-bottom:1.5rem}.match-mode{color:#4a5568;font-weight:700}.countdown-section{margin:2rem 0}.countdown-text{color:#4a5568;margin-bottom:.5rem}.countdown-number{font-size:3rem;font-weight:700;color:#667eea;line-height:1}.countdown-unit{color:#718096;margin-top:.5rem}.start-button,.leave-queue-button{background:#667eea;color:#fff;border:none;padding:1rem 2rem;border-radius:8px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:background-color .2s;width:100%}.start-button:hover{background:#5a67d8}.start-button:disabled{background:#a0aec0;cursor:not-allowed}.leave-queue-button{background:#e53e3e}.leave-queue-button:hover{background:#c53030}.game-lobby{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);overflow:hidden}.lobby-card{background:rgba(255,255,255,.95);border-radius:1rem;padding:2rem;box-shadow:0 20px 40px #00000026;max-width:600px;width:90%;max-height:85%;overflow-y:auto}.lobby-card h2{margin-bottom:1rem;color:var(--primary-color)}.form-group{margin-bottom:1.5rem}.form-group label{display:block;margin-bottom:.5rem;font-weight:600}.form-group input{width:100%;padding:.75rem;border:1px solid var(--border-color);border-radius:4px;font-size:1rem}.form-help{font-size:.8rem;color:#777;margin-top:.3rem}.btn-primary{background-color:var(--primary-color);color:#fff;border:none;border-radius:4px;padding:.75rem 1.5rem;font-size:1rem;cursor:pointer;transition:background-color .2s;width:100%}.btn-primary:hover{background-color:#2980b9}.btn-primary:disabled{background-color:var(--inactive-color);cursor:not-allowed}.btn-secondary{background-color:transparent;color:var(--primary-color);border:1px solid var(--primary-color);border-radius:4px;padding:.5rem 1rem;font-size:.9rem;cursor:pointer;transition:all .2s}.btn-secondary:hover{background-color:var(--primary-color);color:#fff}.error-message{background-color:#e74c3c1a;color:var(--danger-color);padding:.75rem;border-radius:4px;margin-bottom:1rem}.game-instructions{margin-top:2rem;padding-top:2rem;border-top:1px solid #eee}.game-instructions h3{color:#333;margin-bottom:1rem}.game-instructions ul{color:#666;line-height:1.6;list-style-position:inside;padding-left:1rem}.game-instructions li{margin-bottom:.5rem}.game-board-container{width:100%;height:100%;display:flex;flex-direction:column;background:linear-gradient(135deg,#2c3e50 0%,#34495e 100%);overflow:hidden;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.game-board,.opponent-area,.player-area{display:none}.main-game-area{height:100%;display:flex;flex-direction:row;overflow:hidden}.left-sidebar{width:15%;height:100%;background:linear-gradient(135deg,rgba(255,255,255,.95) 0%,rgba(240,242,245,.9) 100%);color:#333;border-right:3px solid rgba(200,200,200,.3);display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:3px 0 15px #0000001a;overflow:hidden;font-weight:700;padding:2vh 1vw;box-sizing:border-box}.right-play-area{width:85vw;height:100%;display:flex;flex-direction:column;overflow:hidden}.opponent-container{height:50%;background:linear-gradient(180deg,rgba(231,76,60,.15) 0%,rgba(192,57,43,.1) 100%);border-bottom:3px solid rgba(231,76,60,.4);display:flex;flex-direction:column;overflow:hidden;box-shadow:0 3px 15px #e74c3c33}.opponent-info,.player-info-area{height:6vh;background:linear-gradient(135deg,#fff 0%,#f8f9fa 100%);display:flex;align-items:center;padding:.5vh 2vw;overflow:hidden;box-sizing:border-box;margin:0!important}.opponent-info{border-bottom:2px solid rgba(231,76,60,.2);box-shadow:0 2px 8px #0000001a;margin-bottom:0!important}.opponent-hand-area{flex:1 1 0;min-height:0;background:linear-gradient(135deg,rgba(255,255,255,.98) 0%,rgba(248,249,250,.95) 100%);border-bottom:1px solid rgba(231,76,60,.2);display:flex;flex-direction:column;justify-content:center;padding:.5vh 1vw;overflow:hidden;box-sizing:border-box}.opponent-field-area{flex:1 1 0;min-height:0;background:linear-gradient(135deg,rgba(255,255,255,.95) 0%,rgba(240,242,245,.9) 100%);display:flex;align-items:center;justify-content:center;padding:.5vh 1vw;overflow:hidden;box-sizing:border-box}.player-container{height:50%;background:linear-gradient(0deg,rgba(46,204,113,.15) 0%,rgba(39,174,96,.1) 100%);border-top:3px solid rgba(46,204,113,.4);display:flex;flex-direction:column;overflow:hidden;box-shadow:0 -3px 15px #2ecc7133}.player-field-area{flex:1 1 0;min-height:0;background:linear-gradient(135deg,rgba(255,255,255,.95) 0%,rgba(240,242,245,.9) 100%);display:flex;align-items:center;justify-content:center;padding:.5vh 1vw;border-bottom:1px solid rgba(46,204,113,.15);overflow:hidden;box-sizing:border-box}.player-info-area{border-bottom:2px solid rgba(46,204,113,.2);box-shadow:0 -2px 8px #0000001a;margin-bottom:0!important}.player-hand-area{flex:1 1 0;min-height:0;background:linear-gradient(135deg,rgba(255,255,255,.98) 0%,rgba(248,249,250,.95) 100%);display:flex;flex-direction:column;justify-content:center;padding:.3vh .5vw;overflow:hidden;box-sizing:border-box}.opponent-hand{margin:0;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;box-sizing:border-box}.opponent-hand-cards{display:flex;gap:.3vw;justify-content:center;flex-wrap:wrap;align-items:center;height:100%;width:100%;padding:1vh;overflow:hidden}.opponent-hand-cards .card{height:calc(100% - 2vh);min-height:8vh}.opponent-hand-card{margin:0;transition:all .3s ease;z-index:1;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2))}.opponent-hand-card:hover{transform:translateY(-.5vh) scale(1.05);z-index:10;filter:drop-shadow(0 4px 8px rgba(0,0,0,.3))}.hand-overflow{display:flex;flex-direction:column;align-items:center;justify-content:center;width:auto;height:calc(100% - 2vh);min-height:8vh;background:linear-gradient(135deg,#f8f9fa 0%,#e9ecef 100%);border:1px dashed #e0e0e0;border-radius:.5rem;margin:0;font-size:clamp(.6rem,1.5vh,.75rem);color:#495057;box-shadow:0 2px 4px #0000001a;aspect-ratio:3 / 4}.overflow-icon{font-size:clamp(1rem,2.5vh,1.8rem);color:#6c757d;margin-bottom:.2rem}.overflow-text{font-weight:700;text-align:center;line-height:1.1}.deck-area{display:flex;gap:2vw;align-items:center;justify-content:space-between;padding:.5vh 1vw;height:100%;width:100%;box-sizing:border-box;flex-shrink:0}.left-sidebar .deck-area{flex-direction:column;justify-content:center;gap:3vh;height:100%;width:100%;padding:2vh .5vw}.left-sidebar .deck-graveyard-group{flex-direction:column;gap:3vh}.deck-area .deck-graveyard-group{display:flex;gap:2vw;align-items:center}.deck-container,.graveyard-container,.uchikeshi-container{display:flex;flex-direction:column;align-items:center;gap:.3vh;cursor:pointer;transition:transform .3s ease;background:white;padding:.5vh 1vw;border-radius:.8rem;border:1px solid #ced4da;box-shadow:0 2px 4px #0000001a;min-width:6vw;box-sizing:border-box}.deck-container:hover,.graveyard-container:hover,.uchikeshi-container:hover{transform:scale(1.08) translateY(-.2vh);background:#f8f9fa;box-shadow:0 4px 12px #0003}.deck-stack,.graveyard-stack,.uchikeshi-stack{position:relative;display:flex;align-items:center;justify-content:center;width:clamp(50px,5vw,80px);height:clamp(75px,5vh,120px)}.deck-shadow,.deck-shadow-2{position:absolute;z-index:-1}.deck-shadow{transform:translate(2px,2px);opacity:.7}.deck-shadow-2{transform:translate(4px,4px);opacity:.5}.graveyard-shadow{position:absolute;transform:translate(-2px,-2px);opacity:.6;z-index:-1}.deck-info,.graveyard-info,.uchikeshi-info{display:flex;align-items:center;gap:.3vw;font-size:clamp(.7rem,1.8vh,.85rem);font-weight:700;color:#495057;text-shadow:none;line-height:1.2;text-align:center}.deck-icon,.graveyard-icon,.uchikeshi-icon{font-size:clamp(.8rem,2vh,1.1rem)}.uchikeshi-stack{background:white;border:1px solid #ced4da;border-radius:.6rem;display:flex;align-items:center;justify-content:center;color:#495057;font-size:clamp(1.2rem,2vh,1.5rem);box-shadow:0 2px 4px #0000001a;aspect-ratio:3 / 4;width:clamp(40px,4vw,60px);height:clamp(60px,4vh,80px)}.graveyard-empty{width:auto;height:100%;border:1px dashed #e0e0e0;border-radius:.6rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.2vh;color:#666;font-size:clamp(.6rem,1.5vh,.75rem);background:rgba(240,240,240,.3);backdrop-filter:blur(5px);aspect-ratio:3 / 4}.graveyard-empty .graveyard-icon{font-size:clamp(1rem,2.5vh,1.8rem);opacity:.6}.player-info.opponent{border-left:5px solid #e74c3c;background:linear-gradient(135deg,#fff 0%,#fdfdfd 100%);margin:0;box-sizing:border-box}.player-info.own{border-left:5px solid #2ecc71;background:linear-gradient(135deg,#fff 0%,#fdfdfd 100%);margin:0;box-sizing:border-box}.player-details{flex:1;min-width:0;overflow:hidden}.hand{display:flex;flex-direction:column;justify-content:center;align-items:center;margin:0;height:100%;box-sizing:border-box;overflow:hidden}.hand-card{margin:0;transition:all .3s ease;filter:drop-shadow(0 2px 4px rgba(0,0,0,.15))}.hand-card:hover{transform:translateY(-.5vh) scale(1.05);filter:drop-shadow(0 4px 8px rgba(0,0,0,.25));z-index:10}.hand-cards{display:flex;gap:.2vw;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;justify-content:flex-start;padding:.5vh;box-sizing:border-box;scroll-behavior:smooth}.hand-cards .card{flex-shrink:0;min-width:auto}.field{margin:0;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;box-sizing:border-box}.field-cards{display:flex;gap:.2vw;flex-wrap:wrap;min-height:10vh;max-height:18vh;padding:.5vh 1vw;justify-content:center;align-items:center;overflow:hidden;box-sizing:border-box;width:100%;height:100%}.field-cards .card{height:calc(100% - 1vh);min-height:10vh;max-height:16vh;transition:all .3s ease;filter:drop-shadow(0 2px 4px rgba(0,0,0,.15));flex-shrink:0}.field-cards .card:hover{transform:translateY(-.3vh) scale(1.03);filter:drop-shadow(0 4px 8px rgba(0,0,0,.25))}.game-info{display:flex;flex-direction:row;gap:1.5vw;align-items:center;justify-content:space-between;width:100%;height:100%;box-sizing:border-box;padding:0 1vw}.game-info .deck-area{flex:1;width:100%}.deck-area .turn-end-button{flex-shrink:0;margin-left:2vw}.left-sidebar .turn-end-button{width:90%;max-width:none;min-width:none;padding:1vh 1vw;margin:0;font-size:clamp(.7rem,1.5vh,.9rem)}.turn-end-button{background:white;color:#333;border:2px solid #ddd;border-radius:.6rem;padding:.8vh 1.5vw;font-size:clamp(.7rem,1.8vh,.9rem);font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 8px #0000001a;backdrop-filter:blur(5px);min-width:clamp(80px,10vw,120px);height:clamp(30px,4vh,40px);display:flex;align-items:center;justify-content:center;gap:.3vw;flex-shrink:0;line-height:1.2;box-sizing:border-box}.turn-end-button:hover:not(:disabled){background:linear-gradient(135deg,#c0392b 0%,#a93226 100%);transform:translateY(-1px) scale(1.02);box-shadow:0 4px 12px #e74c3c66}.turn-end-button:active:not(:disabled){transform:translateY(0) scale(.98);box-shadow:0 2px 6px #e74c3c4d}.turn-end-button:disabled{background:linear-gradient(135deg,#95a5a6 0%,#7f8c8d 100%);cursor:not-allowed;opacity:.6;transform:none;box-shadow:0 2px 4px #95a5a633}.turn-end-button-icon{font-size:clamp(.8rem,2vh,1rem)}.turn-end-button.my-turn{background:linear-gradient(135deg,#27ae60 0%,#229954 100%);box-shadow:0 3px 8px #27ae604d}.turn-end-button.my-turn:hover:not(:disabled){background:linear-gradient(135deg,#229954 0%,#1e8449 100%);box-shadow:0 4px 12px #27ae6066}.turn-end-button.opponent-turn{background:linear-gradient(135deg,#95a5a6 0%,#7f8c8d 100%);opacity:.5;cursor:not-allowed;box-shadow:0 2px 4px #95a5a633}.turn-end-button.hidden{display:none}@media (max-width: 768px){.game-board-container{height:100%;font-size:.9rem}.main-game-area{height:100%}.left-sidebar{width:18vw;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;padding:1vh .5vw;box-sizing:border-box}.left-sidebar .game-info{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;min-height:0}.left-sidebar .deck-area{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1vh;width:100%;height:100%;padding:.5vh 0;box-sizing:border-box}.left-sidebar .deck-graveyard-group{display:flex;flex-direction:column;gap:.8vh;align-items:center}.left-sidebar .deck-container,.left-sidebar .graveyard-container,.left-sidebar .uchikeshi-container{padding:.3vh .5vw;min-width:4vw;gap:.2vh}.left-sidebar .deck-stack,.left-sidebar .graveyard-stack,.left-sidebar .uchikeshi-stack{width:clamp(30px,3vw,50px);height:clamp(45px,3vh,75px)}.left-sidebar .deck-icon,.left-sidebar .graveyard-icon,.left-sidebar .uchikeshi-info .uchikeshi-icon{display:none}.left-sidebar .deck-info,.left-sidebar .graveyard-info,.left-sidebar .uchikeshi-info{font-size:clamp(.6rem,1.3vh,.75rem);gap:.1vw}.left-sidebar .uchikeshi-stack{font-size:clamp(.8rem,1.5vh,1rem)}.left-sidebar .uchikeshi-stack:before{display:none}.left-sidebar .turn-end-button{width:95%;max-width:none;min-width:none;padding:.8vh .5vw;margin:.5vh 0;font-size:clamp(.6rem,1.3vh,.75rem);height:clamp(25px,3vh,35px);flex-shrink:0;border-radius:.5rem;line-height:1.2;text-align:center;display:flex;align-items:center;justify-content:center;gap:.2vw}.left-sidebar .turn-end-button .turn-end-button-icon{font-size:clamp(.7rem,1.4vh,.8rem)}.hand-cards{display:flex;gap:.2vw;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;justify-content:flex-start;padding:.5vh;box-sizing:border-box;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none}.hand-cards::-webkit-scrollbar{display:none}.opponent-hand-cards{gap:-.3vw;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;padding:.2vh;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none}.opponent-hand-cards::-webkit-scrollbar{display:none}.player-info .status-indicator,.player-info .status-indicator .status-text{font-size:clamp(.5rem,1.2vh,.65rem)!important}.player-info .status-indicator .status-icon{font-size:clamp(.6rem,1.3vh,.7rem)!important}.right-play-area{width:82vw}.opponent-info,.player-info-area{height:6vh;height:6dvh;padding:.3vh 1vw}.opponent-hand-area,.player-hand-area,.opponent-field-area,.player-field-area{padding:.5vh 1vw}.field-cards{gap:.2vw}.field-cards{min-height:8vh;max-height:16vh}.field-cards .card{min-height:8vh;max-height:14vh}.deck-area{gap:1vw;padding:.3vh .5vw;width:100%}.game-info{gap:1vw;padding:0 .5vw}.game-info .deck-area{flex:1;width:100%}.deck-area .turn-end-button{margin-left:1vw}.turn-end-button{padding:.6vh 1vw;min-width:clamp(60px,12vw,100px);height:clamp(25px,3.5vh,35px);font-size:clamp(.6rem,1.5vh,.8rem);gap:.2vw}.turn-end-button-icon{font-size:clamp(.7rem,1.8vh,.9rem)}}.deck-area .uchikeshi-container{background:white!important;color:#495057!important;border:1px solid #ced4da!important;box-shadow:0 2px 4px #0000001a!important}.deck-area .uchikeshi-container .uchikeshi-info{color:#495057!important}.deck-area .uchikeshi-container .uchikeshi-stack{background:white!important;color:#495057!important;border:1px solid #ced4da!important;width:clamp(40px,4vw,60px)!important;height:clamp(60px,4vh,80px)!important;font-size:clamp(1.2rem,2vh,1.5rem)!important}.deck-area .uchikeshi-container .uchikeshi-count{color:#495057!important}.hand-cards::-webkit-scrollbar{height:4px}.hand-cards::-webkit-scrollbar-track{background:rgba(0,0,0,.1);border-radius:2px}.hand-cards::-webkit-scrollbar-thumb{background:rgba(52,152,219,.6);border-radius:2px}.hand-cards::-webkit-scrollbar-thumb:hover{background:rgba(52,152,219,.8)}@media (max-width: 768px){.hand-cards::-webkit-scrollbar{display:none}.hand-cards{-ms-overflow-style:none;scrollbar-width:none}}.card{width:auto;height:100%;max-height:15vh;background:white;border:1px solid #e0e0e0;border-radius:.5rem;cursor:pointer;transition:all .2s;display:flex;flex-direction:column;font-size:.75rem;position:relative;overflow:hidden;aspect-ratio:3 / 4}.card:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0003}.card-monster{border-color:#e0e0e0;background:linear-gradient(135deg,#d4edda 0%,#c3e6cb 100%)}.card-magic{border-color:#e0e0e0;background:linear-gradient(135deg,#f8d7da 0%,#f5c6cb 100%)}.card-playable{border-color:#ffc107;box-shadow:0 0 10px #ffc10780}.card-selected{border-color:#007bff;background:#e3f2fd}.card-image{width:100%;height:100%;object-fit:cover;border-radius:calc(.5rem - 2px)}.card-fallback{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#f8f9fa;padding:.5rem;border:2px dashed #ccc;position:relative}.card-fallback-hidden{position:absolute;top:0;left:0;width:100%;height:100%}.card-fallback .card-name{font-size:.7rem;font-weight:700;text-align:center;color:#666;word-break:break-word;line-height:1.2}.card-selected-indicator{position:absolute;top:.5rem;left:.5rem;right:.5rem;background:rgba(0,123,255,.9);color:#fff;text-align:center;padding:.2rem;border-radius:.2rem;font-size:.6rem;font-weight:700;display:flex;align-items:center;justify-content:center;gap:.2rem;backdrop-filter:blur(2px)}.card-swipe-hint{position:absolute;bottom:.3rem;right:.3rem;background:rgba(40,167,69,.9);color:#fff;width:20px;height:20px;border-radius:50%;display:none;align-items:center;justify-content:center;font-size:.8rem;font-weight:700;animation:swipePulse 2s infinite}@keyframes swipePulse{0%,to{opacity:.7;transform:scale(1)}50%{opacity:1;transform:scale(1.1)}}@media (max-width: 768px) and (pointer: coarse){.card-swipe-hint{display:flex}}.card-back{background:linear-gradient(135deg,#4a90e2 0%,#357abd 100%);border:1px solid #e0e0e0}.card-small{width:auto;height:clamp(60px,8vh,90px);font-size:.6rem;aspect-ratio:3 / 4}.card-normal{width:auto;height:clamp(80px,15vh,200px);font-size:.75rem;aspect-ratio:3 / 4}.card-large{width:auto;height:clamp(100px,18vh,250px);font-size:.9rem;aspect-ratio:3 / 4}.card[draggable=true]{cursor:grab}.card[draggable=true]:active{cursor:grabbing}.card[draggable=true].card-playable{border:2px solid #ffc107;box-shadow:0 0 15px #ffc10799}.drop-zone{transition:all .3s ease}.drop-zone:hover{background:rgba(46,204,113,.1);border:2px dashed rgba(46,204,113,.5);border-radius:8px}.drop-zone.drag-over{background:rgba(46,204,113,.2);border:2px dashed rgba(46,204,113,.8);transform:scale(1.02)}.card-being-dragged{transform:translateY(-8px) scale(1.05);box-shadow:0 8px 20px #ffc10799;border-color:#28a745;z-index:100;transition:all .2s ease}@media (max-width: 768px){.card{min-width:clamp(60px,15vw,80px);touch-action:pan-y}.card-playable{box-shadow:0 0 8px #ffc107b3}.card-being-dragged{transform:translateY(-12px) scale(1.1);box-shadow:0 12px 30px #ffc107cc}.hand-card{transition:all .3s ease}.hand-card:active{transform:scale(.95)}.card-playable:hover{transform:translateY(-3px);box-shadow:0 6px 12px #ffc10799}}.game-container{background-color:#f8f9fa;border-radius:12px;padding:1.5vh 2vw;box-shadow:0 4px 6px #0000001a;width:100%;display:flex;flex-direction:column;gap:1.5vh;box-sizing:border-box;overflow:hidden}.game-info{display:flex;flex-direction:column;gap:1vh;align-items:center;overflow:hidden}.shared-info{display:flex;flex-direction:column;gap:.6vh;text-align:center;background:#f8f9fa;padding:.8vh 1.5vw;border-radius:.8rem;border:2px solid #dee2e6;box-sizing:border-box;overflow:hidden}.shared-uchikeshi{display:flex;align-items:center;justify-content:center;gap:.4vw;font-weight:700;color:#495057;background:white;padding:.4vh .8vw;border-radius:.5rem;box-shadow:0 2px 4px #0000001a;font-size:clamp(.8rem,2vh,1rem);line-height:1.2;box-sizing:border-box}.uchikeshi-icon{font-size:clamp(.8rem,2vh,1.1rem)}.uchikeshi-container,.turn-info{display:flex;align-items:center;justify-content:center;gap:.4vw;font-weight:700;color:#495057;background:white;padding:.4vh .8vw;border-radius:.5rem;box-shadow:0 2px 4px #0000001a;font-size:clamp(.8rem,2vh,1rem);line-height:1.2;box-sizing:border-box}.turn-icon{font-size:clamp(.9rem,2.2vh,1.2rem)}.phase-indicator{color:#007bff;background:#e3f2fd;padding:.1rem .4rem;border-radius:.3rem;font-size:clamp(.7rem,1.8vh,.9rem);line-height:1.2}.game-status{display:flex;align-items:center;justify-content:center;gap:.4vw;font-weight:700;padding:.4vh .8vw;border-radius:.5rem;background:white;box-shadow:0 2px 4px #0000001a;font-size:clamp(.8rem,2vh,1rem);line-height:1.2;box-sizing:border-box}.status-icon{font-size:clamp(.9rem,2.2vh,1.2rem)}.rules{background-color:#e8f5e9;border:1px solid #c8e6c9;border-radius:8px;padding:.8vh 1.5vw;margin:.8vh 0;text-align:left;box-sizing:border-box;overflow:hidden}.rules ul{margin:.4vh 0;padding-left:1.2rem}.rules li{margin-bottom:.3vh;font-size:clamp(.8rem,2vh,.9rem);line-height:1.3}.intro-rules{background-color:#e8f5e9;border:1px solid #c8e6c9;border-radius:8px;padding:.8vh 1.5vw;margin:.8vh 0;text-align:left;box-sizing:border-box;overflow:hidden}.intro-rules h3{color:#2e7d32;margin-bottom:.4vh;font-size:clamp(.9rem,2.2vh,1.1rem);line-height:1.2}.intro-rules ul{margin:.4vh 0;padding-left:1.2rem}.intro-rules li{margin-bottom:.3vh;color:#424242;font-size:clamp(.8rem,2vh,.9rem);line-height:1.3}.counter{margin:1vh 0;overflow:hidden}.count-display{font-size:clamp(2.5rem,8vh,4rem);font-weight:700;color:#333;background-color:#e9ecef;border-radius:8px;padding:.8vh 1vw;margin-bottom:.4vh;text-align:center;line-height:1.2;box-sizing:border-box}.danger-display{margin-top:.8vh;min-height:1.2vh;overflow:hidden}.warning{color:#f44336;font-weight:700;font-size:clamp(1rem,2.5vh,1.2rem);line-height:1.2}.count-button{padding:.8vh 1.5vw;font-size:clamp(1rem,2.5vh,1.25rem);background-color:#4caf50;min-width:clamp(200px,25vw,250px);height:clamp(50px,6vh,60px);line-height:1.2;box-sizing:border-box}.count-button.disabled{background-color:#ccc}.count-button.danger{background-color:#f44336}.count-button.lose{background-color:#9e9e9e;color:#333;animation:shake .5s}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-5px)}20%,40%,60%,80%{transform:translate(5px)}}.game-result{background-color:#ffebee;border:1px solid #ffcdd2;border-radius:8px;padding:.8vh 1.5vw;margin:.8vh 0;text-align:center;box-sizing:border-box;overflow:hidden}.game-result h3{color:#c62828;margin-bottom:.4vh;font-size:clamp(1rem,2.5vh,1.2rem);line-height:1.2}.players-list{border-top:1px solid #ddd;padding-top:.8vh;overflow:hidden}.players-list h3{margin-bottom:.4vh;font-size:clamp(.9rem,2.2vh,1rem);line-height:1.2}.players-list ul{list-style-type:none;padding:0;margin:0;overflow:hidden}.players-list li{padding:.4vh .8vw;border-bottom:1px solid #eee;font-size:clamp(.8rem,2vh,.9rem);line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.players-list li.current-player{font-weight:700;background-color:#e9ecef}.players-list li.loser-player{background-color:#ffebee}.game-controls{display:flex;justify-content:center;align-items:center;gap:1rem;margin:.8vh 0;overflow:hidden}.home-controls{display:flex;align-items:center}.home-button{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:linear-gradient(135deg,#6c757d 0%,#495057 100%);border:1px solid #6c757d;color:#fff;border-radius:6px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s ease;text-decoration:none}.home-button:hover{background:linear-gradient(135deg,#5a6268 0%,#343a40 100%);border-color:#5a6268;transform:translateY(-1px);box-shadow:0 2px 8px #6c757d4d}.home-button:active{transform:translateY(0)}.uchikeshi-prompt{background:#fff3cd;border:1px solid #ffeaa7;border-radius:.5rem;padding:.8vh 1.5vw;margin:.8vh 0;text-align:center;font-size:clamp(.8rem,2vh,.9rem);line-height:1.3;box-sizing:border-box;overflow:hidden}.prompt-buttons{display:flex;gap:.8vw;justify-content:center;margin-top:.8vh;flex-wrap:wrap}.discard-info{margin-top:.8vh;font-style:italic;color:#666;font-size:clamp(.7rem,1.8vh,.8rem);line-height:1.3}@media (max-width: 768px){.game-container{padding:1vh 1.5vw;gap:1vh}.shared-info{padding:.6vh 1vw;gap:.4vh}.shared-uchikeshi,.turn-info,.game-status{padding:.3vh .6vw;gap:.3vw;font-size:clamp(.7rem,1.8vh,.9rem)}.rules,.intro-rules{padding:.6vh 1vw;margin:.6vh 0}.rules li,.intro-rules li{font-size:clamp(.7rem,1.8vh,.8rem);margin-bottom:.2vh}.count-display{font-size:clamp(2rem,6vh,3rem);padding:.6vh .8vw}.count-button{padding:.6vh 1.2vw;min-width:clamp(150px,30vw,200px);height:clamp(40px,5vh,50px);font-size:clamp(.9rem,2.2vh,1.1rem)}.uchikeshi-prompt{padding:.6vh 1vw;margin:.6vh 0;font-size:clamp(.7rem,1.8vh,.8rem)}.prompt-buttons{gap:.6vw;margin-top:.6vh}.players-list li{padding:.3vh .6vw;font-size:clamp(.7rem,1.8vh,.8rem)}}.highlight{color:var(--accent-color);font-weight:600}.waiting-message{margin:2rem 0;padding:1.5rem;background-color:#f5f7fa;border-radius:8px;text-align:center;box-sizing:border-box;overflow:hidden}.waiting-message p{margin-bottom:.5rem;font-size:clamp(.8rem,2vh,1rem);line-height:1.4}.game-over-controls{margin-top:2rem;text-align:center;overflow:hidden}.player-info{margin:0;padding:.3vh 1vw;background-color:#e9ecef;border-radius:6px;display:flex;align-items:center;gap:.8vw;height:100%;width:100%;box-sizing:border-box;overflow:hidden}.player-info.active{background-color:#d4edda;border-left:4px solid #28a745;animation:active-pulse 2s infinite}.player-info.opponent{border-left:5px solid #dc3545}.player-info.own{border-left:5px solid #28a745}.player-details{display:inline-flex;flex-direction:row;align-items:center;gap:.5vw;flex:1;min-width:0;overflow:hidden}.player-avatar{width:clamp(30px,4vh,45px);height:clamp(30px,4vh,45px);border-radius:50%;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);display:inline-flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:clamp(.7rem,2vh,1.2rem);box-shadow:0 2px 6px #0003;transition:all .3s ease;position:relative;border:2px solid transparent;flex-shrink:0}.player-avatar.avatar-active{border-color:#28a745;box-shadow:0 0 20px #28a74580}.avatar-text{text-shadow:1px 1px 2px rgba(0,0,0,.3);line-height:1}.active-pulse{position:relative}.active-pulse:before{content:"";position:absolute;inset:-3px;border-radius:50%;border:2px solid #28a745;animation:pulse 2s infinite}@keyframes pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:.7}to{transform:scale(1);opacity:1}}.player-name{font-size:clamp(.8rem,2vh,1rem);font-weight:700;color:#333;margin-bottom:0;display:inline-flex;align-items:center;gap:.5vw;line-height:1.1;overflow:hidden;flex:1;min-width:0;white-space:nowrap}.player-name-text{color:#495057;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-shrink:0;min-width:0}.self-indicator{background:#007bff;color:#fff;font-size:clamp(.6rem,1.4vh,.7rem);padding:.1rem .3rem;border-radius:.3rem;font-weight:400;flex-shrink:0}.turn-badge{background:linear-gradient(45deg,#28a745,#20c997);color:#fff;padding:.2rem .4rem;border-radius:1rem;font-size:clamp(.6rem,1.5vh,.75rem);font-weight:700;box-shadow:0 2px 4px #28a7454d;animation:glow 2s ease-in-out infinite alternate;flex-shrink:0;line-height:1}@keyframes glow{0%{box-shadow:0 2px 4px #28a7454d}to{box-shadow:0 4px 8px #28a74599}}.player-stats{display:none}.player-name .life-stat,.player-name .uchikeshi-stat,.player-name .play-stat,.player-name .hand-stat{display:inline-flex;align-items:center;gap:.1vw;background:white;color:#333;padding:.15vh .3vw;border-radius:.6rem;font-size:clamp(.5rem,1.3vh,.65rem);font-weight:700;box-shadow:0 1px 2px #0000001a;border-left:2px solid #6c757d;flex-shrink:1;line-height:1;min-width:0;margin-left:.3vw}.player-stats .life-stat,.player-stats .uchikeshi-stat,.player-stats .play-stat,.player-stats .hand-stat{display:flex;align-items:center;gap:.1vw;background:white;padding:.2vh .4vw;border-radius:.8rem;font-size:clamp(.6rem,1.5vh,.75rem);font-weight:700;box-shadow:0 1px 3px #0000001a;border-left:2px solid #6c757d;flex-shrink:1;line-height:1.1;min-width:0}.player-name .stat-icon{font-size:clamp(.6rem,1.5vh,.8rem);flex-shrink:0;color:#333}.player-name .stat-label{font-size:clamp(.4rem,1.2vh,.6rem);opacity:.8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#333}.player-name .stat-value{font-size:clamp(.5rem,1.3vh,.7rem);font-weight:700;flex-shrink:0;color:#333}.player-stats .stat-icon{font-size:clamp(.8rem,2vh,1rem);flex-shrink:0}.player-stats .stat-label{font-size:clamp(.6rem,1.5vh,.75rem);opacity:.8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player-stats .stat-value{font-size:clamp(.8rem,2vh,1rem);font-weight:700;flex-shrink:0}.player-name .stat-normal{border-left:2px solid #28a745}.player-name .stat-warning{border-left:2px solid #ffc107;animation:warning-pulse 2s infinite}.player-name .stat-danger{border-left:2px solid #dc3545;animation:critical-pulse 1s infinite}.player-name .stat-critical{border-left:2px solid #dc3545;background:#ffe6e6;animation:critical-pulse .5s infinite}.player-stats .stat-normal{border-left:4px solid #28a745}.player-stats .stat-warning{border-left:4px solid #ffc107;animation:warning-pulse 2s infinite}.player-stats .stat-danger{border-left:4px solid #dc3545;animation:critical-pulse 1s infinite}.player-stats .stat-critical{border-left:4px solid #dc3545;background:#ffe6e6;animation:critical-pulse .5s infinite}@keyframes warning-pulse{0%,to{opacity:1}50%{opacity:.7}}@keyframes critical-pulse{0%,to{opacity:1}50%{opacity:.5}}.status-warning{color:#856404;background:#fff3cd;padding:.1rem .3rem;border-radius:.3rem;font-size:clamp(.6rem,1.5vh,.8rem);animation:blink 1s infinite;line-height:1.2}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:.5}}.uchikeshi-back-indicator{background:linear-gradient(45deg,#6f42c1,#e83e8c);color:#fff;padding:.1rem .3rem;border-radius:.3rem;font-size:clamp(.6rem,1.5vh,.75rem);font-weight:700;line-height:1.2}.status-complete{background:#d1ecf1;color:#0c5460;padding:.2rem .4rem;border-radius:.5rem;font-size:clamp(.6rem,1.5vh,.8rem);font-weight:700;border:1px solid #bee5eb;line-height:1.2}.player-status{display:inline-flex;gap:.3vw;align-items:center;margin-top:0;flex-wrap:nowrap;max-height:4vh;overflow:hidden}.status-indicator{padding:.1rem .3rem;border-radius:.3rem;font-size:clamp(.6rem,1.5vh,.75rem);font-weight:700;background:#e9ecef;color:#495057;line-height:1.2;flex-shrink:0}.status-indicator.defeated{background:#f8d7da;color:#721c24;border:1px solid #f5c6cb}.status-indicator.hand-limit{background:#fff3cd;color:#856404;border:1px solid #ffeaa7}.status-indicator.active-turn{background:#d1ecf1;color:#0c5460;border:1px solid #bee5eb}.status-icon{margin-right:.2rem;font-size:clamp(.6rem,1.5vh,.9rem)}@media (max-width: 768px){.player-info{padding:.2vh .6vw;gap:.6vw}.player-avatar{width:clamp(25px,3.5vh,40px);height:clamp(25px,3.5vh,40px);font-size:clamp(.6rem,1.8vh,1rem)}.player-stats{display:none}.player-name .life-stat,.player-name .uchikeshi-stat,.player-name .play-stat,.player-name .hand-stat{display:inline-flex;padding:.1vh .25vw;font-size:clamp(.4rem,1.1vh,.55rem);gap:.05vw;border-radius:.4rem;margin-left:.2vw;color:#333}.player-name .stat-icon{font-size:clamp(.5rem,1.3vh,.7rem);color:#333}.player-name .stat-label{font-size:clamp(.35rem,1vh,.5rem);color:#333}.player-name .stat-value{font-size:clamp(.4rem,1.1vh,.6rem);color:#333}.player-name{font-size:clamp(.7rem,1.8vh,.9rem);margin-bottom:0;gap:.2vw}.player-status{display:inline-flex;gap:.2vw;margin-top:0;max-height:3vh;flex-wrap:nowrap}.status-indicator{padding:.1rem .2rem;font-size:clamp(.4rem,1vh,.55rem)}}.player-name-container{background-color:#f8f9fa;border-radius:12px;padding:2rem;box-shadow:0 4px 6px #0000001a;width:100%;max-width:500px;text-align:center}.player-name-container h2{color:#333;margin-bottom:1rem}.player-name-container p{color:#666;margin-bottom:.5rem}@media (max-width: 600px){.player-name-container{padding:1rem;margin:.5rem}}.game-screen{width:100%;height:100%;background:linear-gradient(135deg,#1a1a2e 0%,#16213e 50%,#0f3460 100%);display:flex;flex-direction:column;overflow:hidden;position:relative}.game-screen.loading{justify-content:center;align-items:center}.loading-container{text-align:center;color:#fff}.loading-spinner{width:50px;height:50px;border:3px solid rgba(255,255,255,.3);border-radius:50%;border-top-color:#4a90e2;animation:spin 1s ease-in-out infinite;margin:0 auto 20px}@keyframes spin{to{transform:rotate(360deg)}}.game-screen.disconnected{justify-content:center;align-items:center}.disconnected-container{text-align:center;color:#fff;background:rgba(0,0,0,.8);padding:40px;border-radius:12px;border:2px solid #ff4444}.disconnected-container h2{color:#f44;margin-bottom:16px}.game-screen.waiting{justify-content:center;align-items:center}.waiting-container{text-align:center;color:#fff}.waiting-spinner{width:40px;height:40px;border:2px solid rgba(255,255,255,.3);border-radius:50%;border-top-color:#4a90e2;animation:spin 1.5s linear infinite;margin:0 auto 16px}.game-screen.error{justify-content:center;align-items:center}.error-container{text-align:center;color:#fff;background:rgba(0,0,0,.8);padding:40px;border-radius:12px;border:2px solid #ff4444}.error-container h2{color:#f44;margin-bottom:16px}.game-screen-layout{position:relative;height:100%;padding:0}.game-sidebar{position:fixed;top:5vh;left:-350px;width:350px;height:90vh;background:rgba(0,0,0,.95);border-right:2px solid #4a90e2;z-index:999;display:flex;flex-direction:column;transition:left .3s ease;backdrop-filter:blur(10px);overflow-y:auto}.game-sidebar.visible{left:0}.sidebar-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid rgba(255,255,255,.1);background:rgba(68,144,226,.1)}.sidebar-header h3{margin:0;color:#4a90e2;font-size:18px;font-weight:600}.close-sidebar-button{background:none;border:none;color:#ccc;font-size:24px;cursor:pointer;padding:4px 8px;border-radius:4px;transition:all .2s ease;line-height:1}.close-sidebar-button:hover{background:rgba(255,255,255,.1);color:#4a90e2}.sidebar-content{flex:1;padding:20px;display:flex;flex-direction:column;gap:20px;overflow-y:auto}.sidebar-actions{margin-top:auto;padding-top:20px;border-top:1px solid rgba(255,255,255,.1)}.home-button{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 16px;background:linear-gradient(135deg,#28a745 0%,#20c997 100%);border:none;border-radius:8px;color:#fff;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #28a7454d}.home-button:hover{background:linear-gradient(135deg,#218838 0%,#1e7e34 100%);transform:translateY(-2px);box-shadow:0 6px 16px #28a74566}.home-button:active{transform:translateY(0);box-shadow:0 2px 8px #28a7454d}.home-button-icon{font-size:18px}.home-button-text{font-size:14px;font-weight:600}.sidebar-overlay{position:fixed;top:5vh;left:0;width:100vw;height:90vh;background:rgba(0,0,0,.5);z-index:998;animation:fadeInOverlay .3s ease}@keyframes fadeInOverlay{0%{opacity:0}to{opacity:1}}.game-main{width:100%;height:100%;padding:0}@media (max-width: 768px){.game-sidebar{width:100%;left:-100%}.game-sidebar.visible{left:0}.sidebar-header,.sidebar-content{padding:15px}.sidebar-actions{padding-top:15px}.home-button{padding:10px 14px;font-size:14px}.home-button-icon{font-size:16px}.home-button-text{font-size:13px}}.game-screen.disconnected{position:relative;width:100vw;height:100vh;background:linear-gradient(135deg,#2c3e50 0%,#34495e 100%);display:flex;align-items:center;justify-content:center}.disconnected-container{text-align:center;color:#fff;background:rgba(0,0,0,.7);padding:40px;border-radius:16px;border:2px solid #e74c3c;box-shadow:0 16px 64px #e74c3c4d;max-width:500px;width:90%}.disconnected-container h2{color:#e74c3c;margin:0 0 16px;font-size:24px;font-weight:700}.disconnected-container p{color:#ecf0f1;margin:0 0 24px;font-size:16px;line-height:1.5}.connection-info{padding:20px;background:rgba(231,76,60,.1);border:1px solid rgba(231,76,60,.3);border-radius:8px;margin-bottom:20px}.connection-info h4{margin:0 0 12px;color:#e74c3c;font-size:18px;font-weight:600}.connection-info p{margin:0 0 8px;color:#fff;font-size:14px;line-height:1.4}.connection-info p:last-child{margin-bottom:0}@media (prefers-color-scheme: dark){.game-screen{background:linear-gradient(135deg,#0a0a0a 0%,#1a1a1a 50%,#2a2a2a 100%)}}.game-info-panel{background:rgba(0,0,0,.8);border-radius:12px;padding:20px;color:#fff;border:1px solid rgba(255,255,255,.1)}.game-info-panel-header h3{margin:0 0 16px;color:#4a90e2;font-size:18px;font-weight:600}.turn-info{margin-bottom:16px;padding:12px;border-radius:8px;transition:all .3s ease}.turn-info.my-turn{background:rgba(68,144,226,.2);border:2px solid #4a90e2}.turn-info.opponent-turn{background:rgba(255,68,68,.2);border:2px solid #ff4444}.turn-indicator{display:flex;align-items:center;gap:8px;margin-bottom:4px}.turn-icon{font-size:20px}.turn-text{font-weight:600;font-size:14px}.turn-player{font-size:16px;font-weight:700}.phase-info{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;padding:8px 12px;background:rgba(255,255,255,.1);border-radius:6px}.phase-label{font-size:14px;color:#ccc}.phase-value{font-weight:600;color:#fff}.turn-count-info{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;padding:8px 12px;background:rgba(255,255,255,.05);border-radius:6px}.turn-count-label{font-size:14px;color:#ccc}.turn-count-value{font-weight:600;color:#fff}.play-count-info{margin-bottom:16px;padding:12px;background:rgba(68,144,226,.1);border-radius:8px;border:1px solid rgba(68,144,226,.3)}.play-count-label{font-size:12px;color:#ccc;margin-bottom:4px}.play-count-value{font-size:16px;font-weight:600;color:#4a90e2;margin-bottom:8px}.play-count-bar{width:100%;height:6px;background:rgba(255,255,255,.2);border-radius:3px;overflow:hidden}.play-count-fill{height:100%;background:linear-gradient(90deg,#4a90e2,#357abd);transition:width .3s ease}.deck-info{margin-bottom:16px}.deck-count,.graveyard-count{display:flex;align-items:center;gap:8px;padding:6px 8px;margin-bottom:4px;background:rgba(255,255,255,.05);border-radius:4px}.deck-icon,.graveyard-icon{font-size:16px}.deck-label,.graveyard-label{font-size:14px;color:#ccc;flex:1}.deck-value,.graveyard-value{font-weight:600;color:#fff}.uchikeshi-info{margin-bottom:16px}.uchikeshi-shared,.uchikeshi-personal{display:flex;align-items:center;gap:8px;padding:6px 8px;margin-bottom:4px;background:rgba(138,43,226,.1);border-radius:4px;border:1px solid rgba(138,43,226,.3)}.uchikeshi-icon{font-size:16px}.uchikeshi-label{font-size:14px;color:#ccc;flex:1}.uchikeshi-value{font-weight:600;color:orchid}.waiting-message{display:flex;align-items:center;gap:8px;padding:12px;background:rgba(255,193,7,.1);border:1px solid rgba(255,193,7,.3);border-radius:8px;margin-bottom:16px}.waiting-icon{font-size:20px;animation:pulse 1.5s ease-in-out infinite}.waiting-text{font-size:14px;color:#ffc107}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.game-over-info{display:flex;align-items:center;gap:12px;padding:16px;border-radius:8px;font-weight:600;animation:gameOverPulse 2s ease-in-out infinite}.game-over-info:has(.game-over-icon:contains("🎉")){background:rgba(40,167,69,.2);border:2px solid #28a745;color:#28a745}.game-over-info:has(.game-over-icon:contains("😔")){background:rgba(220,53,69,.2);border:2px solid #dc3545;color:#dc3545}.game-over-icon{font-size:24px}.game-over-text{font-size:16px}@keyframes gameOverPulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@media (max-width: 768px){.game-info-panel{padding:16px}.turn-info,.play-count-info{padding:10px}}.action-log{background:rgba(0,0,0,.8);border-radius:12px;border:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column;height:300px;transition:height .3s ease}.action-log.expanded{height:500px}.action-log-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid rgba(255,255,255,.1)}.action-log-header h3{margin:0;color:#4a90e2;font-size:16px;font-weight:600}.expand-button{background:none;border:none;color:#ccc;font-size:16px;cursor:pointer;padding:4px;border-radius:4px;transition:all .2s ease}.expand-button:hover{background:rgba(255,255,255,.1);color:#4a90e2}.action-log-content{flex:1;overflow-y:auto;padding:0}.no-logs{display:flex;align-items:center;justify-content:center;height:100%;color:#666;font-style:italic}.log-entries{padding:8px}.log-entry{padding:8px 12px;margin-bottom:4px;border-radius:6px;font-size:13px;border-left:3px solid transparent;transition:all .2s ease}.log-entry:hover{background:rgba(255,255,255,.05)}.log-entry.turn{border-left-color:#4a90e2;background:rgba(68,144,226,.1)}.log-entry.card{border-left-color:#28a745;background:rgba(40,167,69,.1)}.log-entry.damage{border-left-color:#dc3545;background:rgba(220,53,69,.1)}.log-entry.draw{border-left-color:#17a2b8;background:rgba(23,162,184,.1)}.log-entry.discard{border-left-color:#6c757d;background:rgba(108,117,125,.1)}.log-entry.effect{border-left-color:#ffc107;background:rgba(255,193,7,.1)}.log-entry.uchikeshi{border-left-color:#6f42c1;background:rgba(111,66,193,.1)}.log-entry.game{border-left-color:#fd7e14;background:rgba(253,126,20,.1)}.log-entry.my-action{border-right:2px solid rgba(68,144,226,.3)}.log-entry.opponent-action{border-right:2px solid rgba(255,68,68,.3)}.log-entry-header{display:flex;align-items:center;gap:6px;margin-bottom:2px}.log-icon{font-size:12px;width:16px;text-align:center}.log-time{font-size:11px;color:#888;margin-left:auto;font-family:monospace}.log-message{color:#fff;line-height:1.3;word-wrap:break-word}.log-details{margin-top:4px;font-size:11px;color:#ccc;display:flex;gap:8px}.card-name{background:rgba(255,255,255,.1);padding:1px 4px;border-radius:3px;font-weight:500}.damage-amount{color:#f44;font-weight:600}.action-log-content::-webkit-scrollbar{width:6px}.action-log-content::-webkit-scrollbar-track{background:rgba(255,255,255,.1);border-radius:3px}.action-log-content::-webkit-scrollbar-thumb{background:rgba(255,255,255,.3);border-radius:3px}.action-log-content::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.5)}@media (max-width: 768px){.action-log{height:200px}.action-log.expanded{height:300px}.action-log-header{padding:12px 16px}.log-entry{padding:6px 10px;font-size:12px}}.card-target-selector{position:fixed;top:0;left:0;width:100vw;height:100vh;height:100dvh;background:rgba(0,0,0,.8);display:flex;align-items:center;justify-content:center;z-index:1900;animation:fadeIn .3s ease}.target-selector-modal{background:linear-gradient(135deg,#1a1a2e 0%,#16213e 50%,#0f3460 100%);border-radius:16px;max-width:90vw;max-height:80vh;max-height:80dvh;width:800px;border:2px solid #4a90e2;box-shadow:0 16px 64px #4a90e266;animation:slideIn .4s cubic-bezier(.34,1.56,.64,1);position:relative;overflow:hidden;display:flex;flex-direction:column}.target-selector-header{padding:20px 24px;border-bottom:1px solid rgba(255,255,255,.1);background:rgba(0,0,0,.2);flex-shrink:0}.target-selector-header h3{margin:0 0 12px;color:#4a90e2;font-size:1.4rem;font-weight:700;text-shadow:0 2px 8px rgba(74,144,226,.5)}.target-selector-header p{margin:0;color:#fff;font-size:1rem;opacity:.9}.target-selector-content{flex:1;padding:24px;overflow:hidden;display:flex;flex-direction:column}.effect-description{background:rgba(68,144,226,.1);border:1px solid rgba(68,144,226,.3);border-radius:8px;padding:16px;margin-bottom:20px;color:#fff;font-size:14px;line-height:1.4}.no-targets{display:flex;align-items:center;justify-content:center;flex:1;color:#ccc;font-size:1.2rem;text-align:center}.no-targets p{margin:0;padding:40px;background:rgba(0,0,0,.3);border:1px dashed rgba(255,255,255,.2);border-radius:12px;font-style:italic}.targets-grid{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-start;justify-content:flex-start;overflow-y:auto;padding:8px;max-height:100%}.target-item{flex-shrink:0;background:rgba(255,255,255,.05);border:2px solid transparent;border-radius:8px;padding:12px;cursor:pointer;transition:all .3s ease;position:relative;width:clamp(140px,15vw,180px)}.target-item:hover{background:rgba(255,255,255,.1);border-color:#4a90e280;transform:translateY(-2px) scale(1.02);box-shadow:0 4px 12px #4a90e24d}.target-item.selected{background:rgba(74,144,226,.2);border-color:#4a90e2;transform:translateY(-3px) scale(1.05);box-shadow:0 6px 16px #4a90e266}.target-item.disabled{opacity:.5;cursor:not-allowed}.target-item.disabled:hover{background:rgba(255,255,255,.05);border-color:transparent;transform:none;box-shadow:none}.card-target{display:flex;flex-direction:column;align-items:center;gap:8px}.target-info{text-align:center;width:100%}.target-name{font-weight:600;color:#fff;font-size:14px;margin-bottom:4px}.target-owner{font-size:12px;color:#fff;opacity:.8}.player-target{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}.player-avatar{font-size:32px;width:50px;height:50px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.1);border-radius:50%}.player-name{font-weight:600;color:#fff;font-size:16px;margin-bottom:4px}.self-indicator{font-size:12px;color:#4a90e2;font-weight:600}.selection-indicator{position:absolute;top:8px;right:8px;width:20px;height:20px;border-radius:50%;background:#28a745;color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;opacity:0;transition:opacity .2s ease}.target-item.selected .selection-indicator{opacity:1}.owner-badge{position:absolute;top:8px;left:8px;font-size:10px;padding:2px 6px;border-radius:12px;font-weight:600;text-transform:uppercase}.owner-badge.self{background:rgba(68,144,226,.8);color:#fff}.owner-badge.opponent{background:rgba(255,68,68,.8);color:#fff}.owner-badge.graveyard{background:rgba(108,117,125,.8);color:#fff}.target-selector-actions{padding:20px 24px;border-top:1px solid rgba(255,255,255,.1);display:flex;justify-content:center;gap:12px;flex-shrink:0;background:rgba(0,0,0,.2)}.confirm-button,.cancel-button{padding:12px 24px;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s ease;border:none;min-width:100px}.confirm-button{background:#28a745;color:#fff;box-shadow:0 2px 8px #28a7454d}.confirm-button:hover:not(:disabled){background:#218838;transform:translateY(-1px);box-shadow:0 4px 12px #28a74566}.confirm-button:disabled{background:#6c757d;cursor:not-allowed;opacity:.6;transform:none;box-shadow:none}.cancel-button{background:rgba(220,53,69,.2);border:1px solid #dc3545;color:#dc3545}.cancel-button:hover{background:rgba(220,53,69,.3);transform:translateY(-1px)}.target-details{margin-top:20px;padding:16px;background:rgba(74,144,226,.1);border:1px solid rgba(74,144,226,.3);border-radius:8px}.target-details h4{margin:0 0 12px;color:#4a90e2;font-size:16px;font-weight:600}.target-details p{margin:0 0 8px;color:#fff;font-size:14px}.target-details .card-effect{margin-top:8px;padding:8px;background:rgba(74,144,226,.1);border:1px solid rgba(74,144,226,.3);border-radius:6px;color:#fff;font-size:13px;line-height:1.4}.targets-grid::-webkit-scrollbar{width:8px}.targets-grid::-webkit-scrollbar-track{background:rgba(255,255,255,.1);border-radius:4px}.targets-grid::-webkit-scrollbar-thumb{background:rgba(74,144,226,.6);border-radius:4px}.targets-grid::-webkit-scrollbar-thumb:hover{background:rgba(74,144,226,.8)}@media (max-width: 768px){.target-selector-modal{margin:20px;width:calc(100vw - 40px);max-height:calc(100vh - 40px)}.target-selector-header{padding:16px 20px}.target-selector-header h3{font-size:1.2rem}.target-selector-content{padding:16px 20px}.targets-grid{gap:8px;justify-content:center}.target-item{width:clamp(120px,18vw,160px)}.target-selector-actions{padding:16px 20px;gap:8px}.confirm-button,.cancel-button{padding:10px 20px;font-size:14px;min-width:80px}}@media (max-width: 480px){.target-selector-modal{margin:10px;width:calc(100vw - 20px);max-height:calc(100vh - 20px)}.target-selector-header{padding:12px 16px}.target-selector-header h3{font-size:1rem}.target-selector-content{padding:12px 16px}.target-item{width:clamp(100px,20vw,140px)}}.uchikeshi-dialog-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;height:100dvh;background:rgba(0,0,0,.9);display:flex;align-items:center;justify-content:center;z-index:1100;animation:fadeIn .3s ease}.uchikeshi-dialog{background:linear-gradient(135deg,#1a1a2e 0%,#16213e 50%,#0f3460 100%);border-radius:20px;padding:32px;max-width:500px;width:90%;border:3px solid #da70d6;box-shadow:0 16px 64px #da70d666;animation:slideIn .4s cubic-bezier(.34,1.56,.64,1);position:relative;overflow:hidden}.uchikeshi-dialog:before{content:"";position:absolute;inset:0;background:linear-gradient(45deg,transparent 30%,rgba(218,112,214,.1) 50%,transparent 70%);pointer-events:none}@keyframes slideIn{0%{opacity:0;transform:translateY(-100px) scale(.8) rotate(-5deg)}to{opacity:1;transform:translateY(0) scale(1) rotate(0)}}.uchikeshi-header{text-align:center;margin-bottom:24px;position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center}.uchikeshi-header h3{margin:0;color:orchid;font-size:24px;font-weight:700;text-shadow:0 2px 8px rgba(218,112,214,.5);animation:glow 2s ease-in-out infinite alternate;flex:1}.time-limit{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:600;padding:6px 12px;border-radius:15px;background:rgba(255,255,255,.1);border:2px solid transparent;transition:all .3s ease}.time-limit.normal{color:#4a90e2;border-color:#4490e24d}.time-limit.warning{color:#ffc107;border-color:#ffc10780;animation:pulse 1s ease-in-out infinite}.time-limit.critical{color:#f44;border-color:#ff4444b3;animation:urgentPulse .5s ease-in-out infinite}.time-icon{font-size:18px}.time-text{font-weight:700}@keyframes glow{0%{text-shadow:0 2px 8px rgba(218,112,214,.5)}to{text-shadow:0 2px 16px rgba(218,112,214,.8)}}.effect-info{background:rgba(0,0,0,.4);border-radius:12px;padding:20px;margin-bottom:24px;border:1px solid rgba(255,255,255,.1);position:relative;z-index:1}.effect-name{display:flex;align-items:center;gap:12px;margin-bottom:12px}.effect-icon{font-size:24px;color:orchid}.effect-text{font-size:18px;font-weight:600;color:#fff}.effect-prompt{font-size:14px;color:#ccc;line-height:1.4;margin:0}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes urgentPulse{0%,to{transform:scale(1);box-shadow:0 0 #ff4444b3}50%{transform:scale(1.1);box-shadow:0 0 0 10px #f440}}.action-options{display:flex;flex-direction:column;gap:12px;margin-bottom:24px}.action-option{background:rgba(255,255,255,.05);border:2px solid rgba(255,255,255,.1);border-radius:12px;padding:16px;cursor:pointer;transition:all .3s ease;position:relative}.action-option:hover{background:rgba(255,255,255,.1);border-color:#ffffff4d;transform:translateY(-2px)}.action-option.selected{background:rgba(218,112,214,.2);border-color:orchid;transform:translateY(-2px)}.action-header{display:flex;align-items:center;gap:12px;margin-bottom:8px}.action-icon{font-size:20px}.action-title{font-size:16px;font-weight:600;color:#fff;flex:1}.action-cost{font-size:12px;color:#ffc107;background:rgba(255,193,7,.2);padding:2px 8px;border-radius:10px}.action-description{font-size:14px;color:#ccc;line-height:1.4}.selection-indicator{position:absolute;top:8px;right:8px;width:24px;height:24px;background:#da70d6;border-radius:50%;display:flex;align-items:center;justify-content:center}.checkmark{color:#fff;font-size:14px;font-weight:700}.selected-action-details{background:rgba(218,112,214,.1);border:1px solid rgba(218,112,214,.3);border-radius:8px;padding:16px;margin-bottom:24px}.selected-action-details h4{margin:0 0 8px;color:orchid;font-size:16px;font-weight:600}.selected-action-details p{margin:0;color:#ccc;font-size:14px;line-height:1.4}.dialog-actions{display:flex;gap:12px;margin-bottom:20px}.confirm-button{flex:1;padding:12px 24px;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s ease;background:linear-gradient(135deg,#da70d6,#ba55d3);color:#fff}.confirm-button:hover:not(:disabled){background:linear-gradient(135deg,#e688e0,#c967d6);transform:translateY(-2px);box-shadow:0 4px 12px #da70d666}.confirm-button:disabled{background:rgba(255,255,255,.2);color:#ffffff80;cursor:not-allowed;transform:none;box-shadow:none}.cancel-button{flex:1;padding:12px 24px;border:2px solid rgba(255,255,255,.3);border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s ease;background:transparent;color:#fff}.cancel-button:hover:not(:disabled){background:rgba(255,255,255,.1);border-color:#ffffff80;transform:translateY(-2px)}.cancel-button:disabled{color:#ffffff80;border-color:#fff3;cursor:not-allowed;transform:none}.resource-info{background:rgba(0,0,0,.3);border-radius:8px;padding:12px;margin-bottom:16px}.resource-item{display:flex;align-items:center;gap:8px;margin-bottom:8px}.resource-item:last-child{margin-bottom:0}.resource-icon{font-size:16px}.resource-text{font-size:14px;color:#ccc}.warning-message{display:flex;align-items:center;gap:8px;background:rgba(255,68,68,.2);border:1px solid rgba(255,68,68,.5);border-radius:8px;padding:12px;margin-top:16px;animation:warningPulse 1s ease-in-out infinite}@keyframes warningPulse{0%,to{opacity:1}50%{opacity:.8}}.warning-icon{font-size:16px;color:#f44}.warning-text{font-size:14px;color:#fff;font-weight:600}@media (max-width: 768px){.uchikeshi-dialog{padding:24px;margin:20px}.uchikeshi-header h3{font-size:20px}.action-option{padding:12px}.time-limit{font-size:14px}}.uchikeshi-counter-dialog-wrapper{border-color:#4a9eff;box-shadow:0 20px 40px #4a9eff66}.uchikeshi-counter-dialog-content{color:#fff}.played-card-section h4{font-size:1.1rem;color:#4a9eff;margin:0 0 12px;font-weight:600}.card-display{background:rgba(0,0,0,.3);border-radius:8px;padding:12px;border:1px solid rgba(74,158,255,.3);display:flex;align-items:center;gap:12px}.card-icon{font-size:2rem;color:#4a9eff}.card-type{font-size:.9rem;color:#4a9eff;display:block;margin-bottom:8px}.uchikeshi-info-section{background:rgba(0,0,0,.3);border-radius:8px;padding:16px;margin-bottom:20px;border:1px solid rgba(74,158,255,.3)}.uchikeshi-icon{font-size:1.2rem;color:#4a9eff}.uchikeshi-question h4{font-size:1.2rem;color:#4a9eff;margin:0 0 8px;font-weight:600}.uchikeshi-counter-actions{display:flex;gap:16px;margin-bottom:16px}.use-uchikeshi-button,.accept-effect-button{display:flex;align-items:center;gap:8px;padding:12px 24px;border:none;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;min-width:140px;justify-content:center;box-shadow:0 4px 12px #0000004d}.use-uchikeshi-button{background:linear-gradient(135deg,#6a1b9a 0%,#8e24aa 100%);color:#fff;border:2px solid #9c27b0}.use-uchikeshi-button:hover:not(:disabled){background:linear-gradient(135deg,#7b1fa2 0%,#9c27b0 100%);transform:translateY(-2px);box-shadow:0 6px 16px #9c27b066}.accept-effect-button{background:linear-gradient(135deg,#388e3c 0%,#4caf50 100%);color:#fff;border:2px solid #4caf50}.accept-effect-button:hover{background:linear-gradient(135deg,#43a047 0%,#66bb6a 100%);transform:translateY(-2px);box-shadow:0 6px 16px #4caf5066}.use-uchikeshi-button:disabled{background:linear-gradient(135deg,#424242 0%,#616161 100%);border-color:#616161;cursor:not-allowed;opacity:.6}@media (max-width: 768px){.uchikeshi-counter-actions{flex-direction:column;gap:12px}.use-uchikeshi-button,.accept-effect-button{width:100%}}.uchikeshi-back-dialog-wrapper{border-color:#ff4a4a;box-shadow:0 20px 40px #ff4a4a66}.uchikeshi-back-dialog-content{color:#fff}.timer-display{display:flex;justify-content:center;align-items:center;margin-bottom:20px}.timer{background:linear-gradient(135deg,#1e3c72 0%,#2a5298 100%);color:#fff;padding:8px 16px;border-radius:20px;font-weight:600;font-size:.9rem;border:1px solid rgba(74,158,255,.5);box-shadow:0 2px 8px #0000004d;transition:all .3s ease}.timer.warning{background:linear-gradient(135deg,#d32f2f 0%,#f44336 100%);border-color:#ff5252;animation:pulse 1s infinite}.played-card-section{margin-bottom:20px}.played-card-section h4{font-size:1.1rem;color:#ff4a4a;margin:0 0 12px;font-weight:600}.card-display{background:rgba(0,0,0,.3);border-radius:8px;padding:12px;border:1px solid rgba(255,74,74,.3);display:flex;align-items:center;gap:12px}.card-icon{font-size:2rem;color:#ff4a4a}.card-info{flex:1}.card-name{font-size:1.1rem;font-weight:600;color:#fff;display:block;margin-bottom:4px}.card-type{font-size:.9rem;color:#ff4a4a;display:block;margin-bottom:8px}.card-description{font-size:.9rem;color:#ccc;line-height:1.4}.uchikeshi-info-section{background:rgba(0,0,0,.3);border-radius:8px;padding:16px;margin-bottom:20px;border:1px solid rgba(255,74,74,.3)}.uchikeshi-status{display:flex;align-items:center;gap:8px;margin-bottom:12px}.uchikeshi-icon{font-size:1.2rem;color:#ff4a4a}.uchikeshi-count{font-size:1rem;font-weight:600;color:#fff}.uchikeshi-usage{display:flex;align-items:center;gap:8px}.usage-cost{font-size:.9rem;color:#ccc;background:rgba(255,255,255,.1);padding:4px 8px;border-radius:4px}.uchikeshi-question{text-align:center;margin-bottom:24px}.uchikeshi-question h4{font-size:1.2rem;color:#ff4a4a;margin:0 0 8px;font-weight:600}.uchikeshi-question p{font-size:.9rem;color:#ccc;margin:0}.explanation-section{background:rgba(0,0,0,.3);border-radius:8px;padding:16px;margin-bottom:20px;border:1px solid rgba(255,74,74,.3)}.explanation-item{display:flex;align-items:center;gap:8px;margin-bottom:8px}.explanation-item:last-child{margin-bottom:0}.explanation-item .icon{font-size:1rem;color:#ff4a4a;font-weight:700}.explanation-item span:last-child{font-size:.9rem;color:#ccc}.uchikeshi-back-actions{display:flex;gap:16px;margin-bottom:16px}.use-uchikeshi-back-button,.accept-counter-button{display:flex;align-items:center;gap:8px;padding:12px 24px;border:none;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;min-width:140px;justify-content:center;box-shadow:0 4px 12px #0000004d}.use-uchikeshi-back-button{background:linear-gradient(135deg,#d32f2f 0%,#f44336 100%);color:#fff;border:2px solid #ff4a4a}.use-uchikeshi-back-button:hover:not(:disabled){background:linear-gradient(135deg,#c62828 0%,#e53935 100%);transform:translateY(-2px);box-shadow:0 6px 16px #ff4a4a66}.accept-counter-button{background:linear-gradient(135deg,#388e3c 0%,#4caf50 100%);color:#fff;border:2px solid #4caf50}.accept-counter-button:hover{background:linear-gradient(135deg,#43a047 0%,#66bb6a 100%);transform:translateY(-2px);box-shadow:0 6px 16px #4caf5066}.use-uchikeshi-back-button:disabled{background:linear-gradient(135deg,#424242 0%,#616161 100%);border-color:#616161;cursor:not-allowed;opacity:.6}.button-icon{font-size:1.1rem}.insufficient-warning{text-align:center;background:rgba(244,67,54,.2);border:1px solid #f44336;border-radius:8px;padding:12px;margin-top:16px;color:#ffcdd2;font-size:.9rem;font-weight:500}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}@media (max-width: 768px){.uchikeshi-back-actions{flex-direction:column;gap:12px}.use-uchikeshi-back-button,.accept-counter-button{width:100%}}.waiting-dialog-content{text-align:center;padding:20px 0}.waiting-icon{margin-bottom:20px;display:flex;justify-content:center}.spinner{width:40px;height:40px;border:4px solid rgba(255,255,255,.2);border-left:4px solid #4a90e2;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.waiting-message{color:#e5e7eb;font-size:16px;margin-bottom:20px;line-height:1.6;font-weight:500}.waiting-card-info{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:20px;padding:16px;background:rgba(255,255,255,.05);border-radius:8px;border:1px solid rgba(255,255,255,.1)}.card-icon{font-size:24px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}.card-details{text-align:left}.card-name{color:#4a90e2;font-size:16px;font-weight:600;margin-bottom:4px;text-shadow:0 1px 2px rgba(74,144,226,.3)}.card-type{color:#9ca3af;font-size:14px;font-weight:500}.waiting-note{color:#9ca3af;font-size:14px;font-style:italic;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.8}50%{opacity:1}}@media (max-width: 768px){.waiting-dialog-content{padding:16px 0}.waiting-message{font-size:14px}.spinner{width:36px;height:36px}.card-info{flex-direction:column;gap:8px}.card-details{text-align:center}}.card-animation-layer{position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:500;overflow:hidden}.damage-animation,.heal-animation{position:absolute;font-size:32px;font-weight:700;pointer-events:none;text-shadow:2px 2px 4px rgba(0,0,0,.8);animation:damageFloat 2s ease-out forwards}.damage-animation{color:#f44}.heal-animation{color:#0f0}@keyframes damageFloat{0%{opacity:1;transform:scale(1) translateY(0)}20%{transform:scale(1.2) translateY(-10px)}to{opacity:0;transform:scale(.8) translateY(-60px)}}.card-move-animation{position:absolute;width:80px;height:112px;background:linear-gradient(135deg,#4a90e2,#357abd);border-radius:8px;border:2px solid rgba(255,255,255,.3);pointer-events:none;box-shadow:0 4px 12px #0000004d;animation:cardMove 1s ease-in-out forwards;z-index:1000}.card-move-animation:before{content:"🃏";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:24px;opacity:.8}@keyframes cardMove{0%{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.1)}to{opacity:0;transform:scale(.9)}}.flash-effect{position:absolute;border-radius:50%;pointer-events:none;animation:flashExpand .8s ease-out forwards}.flash-effect.attack{background:radial-gradient(circle,rgba(255,68,68,.8) 0%,rgba(255,68,68,.3) 50%,transparent 100%)}.flash-effect.defend{background:radial-gradient(circle,rgba(68,144,226,.8) 0%,rgba(68,144,226,.3) 50%,transparent 100%)}.flash-effect.heal{background:radial-gradient(circle,rgba(40,167,69,.8) 0%,rgba(40,167,69,.3) 50%,transparent 100%)}.flash-effect.special{background:radial-gradient(circle,rgba(218,112,214,.8) 0%,rgba(218,112,214,.3) 50%,transparent 100%)}@keyframes flashExpand{0%{opacity:1;transform:scale(0)}50%{opacity:.8;transform:scale(1)}to{opacity:0;transform:scale(1.5)}}.particle-effect{position:absolute;width:4px;height:4px;background:#ffffff;border-radius:50%;pointer-events:none;animation:particleFloat 1.5s ease-out forwards}.particle-effect.fire{background:linear-gradient(45deg,#ff4444,#ff8800)}.particle-effect.water{background:linear-gradient(45deg,#4a90e2,#2196f3)}.particle-effect.earth{background:linear-gradient(45deg,#8bc34a,#4caf50)}.particle-effect.air{background:linear-gradient(45deg,#ffeb3b,#ffc107)}@keyframes particleFloat{0%{opacity:1;transform:scale(1) translate(0)}to{opacity:0;transform:scale(.5) translate(var(--particle-x, 0px),var(--particle-y, -100px))}}.energy-wave{position:absolute;border:2px solid;border-radius:50%;pointer-events:none;animation:energyWave 1.2s ease-out forwards}.energy-wave.attack{border-color:#f44}.energy-wave.defend{border-color:#4a90e2}.energy-wave.heal{border-color:#28a745}.energy-wave.special{border-color:orchid}@keyframes energyWave{0%{opacity:1;transform:scale(0);border-width:4px}50%{opacity:.6;border-width:2px}to{opacity:0;transform:scale(3);border-width:1px}}.combo-effect{position:absolute;font-size:24px;font-weight:700;color:#ffc107;text-shadow:2px 2px 4px rgba(0,0,0,.8);pointer-events:none;animation:comboSpin 1.5s ease-out forwards}@keyframes comboSpin{0%{opacity:1;transform:scale(.5) rotate(0)}30%{transform:scale(1.2) rotate(180deg)}70%{transform:scale(1) rotate(360deg)}to{opacity:0;transform:scale(.8) rotate(540deg) translateY(-40px)}}.victory-effect{position:absolute;font-size:48px;font-weight:700;color:#28a745;text-shadow:3px 3px 6px rgba(0,0,0,.8);pointer-events:none;animation:victoryBounce 2s ease-out forwards}@keyframes victoryBounce{0%{opacity:1;transform:scale(0) rotate(-180deg)}50%{transform:scale(1.3) rotate(0)}70%{transform:scale(.9) rotate(10deg)}85%{transform:scale(1.1) rotate(-5deg)}to{opacity:.8;transform:scale(1) rotate(0)}}.defeat-effect{position:absolute;font-size:48px;font-weight:700;color:#dc3545;text-shadow:3px 3px 6px rgba(0,0,0,.8);pointer-events:none;animation:defeatFade 2s ease-out forwards}@keyframes defeatFade{0%{opacity:1;transform:scale(1.5) rotate(0)}50%{transform:scale(1) rotate(-10deg)}to{opacity:.3;transform:scale(.8) rotate(-20deg) translateY(20px)}}@media (max-width: 768px){.damage-animation,.heal-animation{font-size:24px}.card-move-animation{width:60px;height:84px}.card-move-animation:before{font-size:18px}.combo-effect{font-size:18px}.victory-effect,.defeat-effect{font-size:36px}}.card-animation-layer *{will-change:transform,opacity;backface-visibility:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@supports (transform: translate3d(0,0,0)){.damage-animation,.heal-animation,.card-move-animation,.flash-effect,.particle-effect,.energy-wave,.combo-effect,.victory-effect,.defeat-effect{transform:translateZ(0)}}.card-preview-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;height:100dvh;background:rgba(0,0,0,.8);display:flex;align-items:center;justify-content:center;z-index:2000;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.card-preview-modal{background:linear-gradient(135deg,#1a1a2e 0%,#16213e 50%,#0f3460 100%);border-radius:20px;padding:32px;max-width:600px;width:90%;max-height:80vh;max-height:80dvh;border:3px solid #4a90e2;box-shadow:0 16px 64px #4a90e266;animation:slideIn .4s cubic-bezier(.34,1.56,.64,1);position:relative;overflow:hidden}@keyframes slideIn{0%{opacity:0;transform:translateY(-50px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}.card-preview-close{position:absolute;top:16px;right:16px;width:32px;height:32px;border:none;background:rgba(255,255,255,.2);color:#fff;border-radius:50%;font-size:18px;font-weight:700;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;z-index:1}.card-preview-close:hover{background:rgba(255,68,68,.8);transform:scale(1.1)}.card-preview-content{display:flex;gap:24px;align-items:flex-start}.card-preview-image{flex-shrink:0;width:200px;height:266px;border-radius:12px;overflow:hidden;box-shadow:0 8px 32px #0000004d;background:white}.preview-image{width:100%;height:100%;object-fit:cover}.preview-fallback{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f8f9fa 0%,#e9ecef 100%);padding:16px}.preview-card-name{font-size:16px;font-weight:700;text-align:center;color:#333;line-height:1.4}.card-preview-details{flex:1;color:#fff;min-width:0}.preview-title{margin:0 0 16px;color:#4a90e2;font-size:28px;font-weight:700;text-shadow:0 2px 8px rgba(74,144,226,.5);line-height:1.2}.preview-type{display:inline-block;padding:8px 16px;border-radius:20px;font-size:14px;font-weight:600;margin-bottom:16px;text-transform:uppercase;letter-spacing:.5px}.preview-type.monster{background:linear-gradient(135deg,#28a745,#1e7e34);color:#fff;border:1px solid #28a745}.preview-type.magic{background:linear-gradient(135deg,#da70d6,#ba55d3);color:#fff;border:1px solid #da70d6}.preview-description{font-size:16px;line-height:1.6;color:#ccc;margin-bottom:20px;background:rgba(0,0,0,.3);padding:16px;border-radius:8px;border:1px solid rgba(255,255,255,.1)}.preview-damage{display:flex;align-items:center;gap:8px;margin-bottom:12px;padding:12px;background:rgba(255,68,68,.1);border:1px solid rgba(255,68,68,.3);border-radius:8px}.damage-label{font-size:14px;color:#fcc;font-weight:600}.damage-value{font-size:18px;font-weight:700;color:#f44;background:rgba(255,68,68,.2);padding:4px 8px;border-radius:4px}.preview-special{display:inline-block;padding:8px 12px;background:rgba(255,193,7,.1);border:1px solid rgba(255,193,7,.3);border-radius:6px;color:#ffc107;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}@media (max-width: 768px){.card-preview-modal{margin:20px;padding:24px;width:calc(100% - 40px);max-height:calc(100vh - 40px)}.card-preview-content{flex-direction:column;align-items:center;gap:16px}.card-preview-image{width:160px;height:213px}.preview-title{font-size:24px;text-align:center}.preview-description{font-size:14px}}@media (max-width: 480px){.card-preview-modal{margin:10px;padding:16px;width:calc(100% - 20px)}.card-preview-image{width:120px;height:160px}.preview-title{font-size:20px}.preview-description{font-size:13px;padding:12px}}.graveyard-modal-content{display:flex;flex-direction:column;height:100%;overflow:hidden}.graveyard-info{margin-bottom:16px;text-align:center}.graveyard-info p{color:#9ca3af;font-size:14px;margin:0;font-style:italic}.empty-graveyard{display:flex;flex-direction:column;align-items:center;justify-content:center;height:200px;gap:16px;color:#9ca3af;text-align:center}.empty-icon{font-size:48px;filter:drop-shadow(0 4px 8px rgba(156,163,175,.3))}.empty-graveyard p{font-size:16px;margin:0;font-weight:500}.graveyard-cards-container{flex:1;display:flex;flex-direction:column;overflow:hidden}.graveyard-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:16px;overflow-y:auto;padding:4px;flex:1}.graveyard-card{cursor:pointer;transition:all .3s ease;border-radius:8px;overflow:hidden;box-shadow:0 2px 8px #0000004d}.graveyard-card:hover{transform:translateY(-4px) scale(1.05);box-shadow:0 8px 24px #4a90e24d;border:2px solid #4a90e2}.graveyard-cards::-webkit-scrollbar{width:8px}.graveyard-cards::-webkit-scrollbar-track{background:rgba(255,255,255,.1);border-radius:4px}.graveyard-cards::-webkit-scrollbar-thumb{background:rgba(74,144,226,.6);border-radius:4px}.graveyard-cards::-webkit-scrollbar-thumb:hover{background:rgba(74,144,226,.8)}@media (max-width: 768px){.graveyard-cards{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:12px}.graveyard-info p{font-size:12px}.empty-icon{font-size:40px}.empty-graveyard p{font-size:14px}}@media (max-width: 480px){.graveyard-cards{grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:8px}.empty-icon{font-size:36px}.empty-graveyard p{font-size:12px}.empty-graveyard{height:150px}}.header-connection-status{display:flex;align-items:center;padding:4px 8px;border-radius:4px;background:rgba(255,255,255,.1);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.2);font-size:.75rem;font-weight:500;transition:all .3s ease}.connection-text{white-space:nowrap}.header-connection-status.connected{background:rgba(16,185,129,.2);border-color:#10b98166;color:#d1fae5}.header-connection-status.connecting{background:rgba(251,191,36,.2);border-color:#fbbf2466;color:#fef3c7}.header-connection-status.connecting .connection-text{animation:pulse 1.5s ease-in-out infinite}.header-connection-status.failed,.header-connection-status.disconnected{background:rgba(239,68,68,.2);border-color:#ef444466;color:#fecaca}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}@media (max-width: 768px){.header-connection-status{font-size:.65rem;padding:3px 6px}}.connection-status{position:fixed;top:20px;right:20px;background:rgba(0,0,0,.8);color:#fff;padding:12px 16px;border-radius:8px;z-index:1000;min-width:150px;box-shadow:0 4px 12px #0000004d}.status-indicator{display:flex;align-items:center;gap:8px;margin-bottom:8px}.status-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.status-text{font-size:14px;font-weight:500}.connection-status.connecting .status-dot{background:#fbbf24;animation:pulse 1.5s ease-in-out infinite}.connection-status.reconnecting .status-dot{background:#fb923c;animation:pulse 1.5s ease-in-out infinite}.connection-status.connected .status-dot{background:#10b981}.connection-status.failed .status-dot{background:#ef4444}.connection-status.disconnected .status-dot{background:#6b7280}.error-message{font-size:12px;color:#fca5a5;margin-bottom:8px;word-wrap:break-word}.retry-button{background:#3b82f6;color:#fff;border:none;padding:6px 12px;border-radius:4px;font-size:12px;cursor:pointer;transition:background-color .2s}.retry-button:hover:not(:disabled){background:#2563eb}.retry-button:disabled{background:#6b7280;cursor:not-allowed}@media (max-width: 768px){.connection-status{top:10px;right:10px;left:10px;max-width:none;text-align:center}.status-indicator{justify-content:center}}:root{--primary-color: #3498db;--secondary-color: #2ecc71;--accent-color: #e74c3c;--background-color: #f8f9fa;--card-background: #ffffff;--text-color: #333333;--border-color: #dddddd;--success-color: #27ae60;--warning-color: #f39c12;--danger-color: #e74c3c;--inactive-color: #95a5a6}*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background-color:var(--background-color);color:var(--text-color);line-height:1.6}.app{display:flex;flex-direction:column;min-height:100vh}.app-header{background-color:var(--primary-color);color:#fff;padding:1.5rem;text-align:center}.app-footer{background-color:var(--text-color);color:#fff;text-align:center;padding:1rem;margin-top:auto}