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}.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;-webkit-backdrop-filter:blur(5px)!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}.app-footer{height:5vh;background:#333;color:#fff;text-align:center;display:flex;align-items:center;justify-content:center;flex-shrink:0}.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;top:0;left:0;right:0;bottom: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}.player-info-card{background:#f8fafc;border:2px solid #e2e8f0;border-radius:12px;padding:1.5rem}.player-info-card h3{margin:0 0 1rem;color:#4a5568;font-size:1.1rem}.player-details{display:flex;flex-direction:column;gap:.5rem}.player-name{font-weight:700;color:#2d3748;font-size:1.2rem}.player-rating{color:#667eea;font-weight:600}.player-id{color:#718096;font-size:.9rem;font-family:monospace}.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}.player-details{text-align:center}}.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}.connection-status{margin-bottom:1rem}.status-indicator{padding:.5rem 1rem;border-radius:20px;font-size:.9rem;display:inline-block}.status-indicator.connected{background:#c6f6d5;color:#22543d}.status-indicator.disconnected{background:#fed7d7;color:#742a2a}.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:100vw;height:100vh;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}.game-title{height:5vh;background:linear-gradient(135deg,#1a252f 0%,#2c3e50 100%);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:.5vh 2vw;box-shadow:0 2px 10px #00000080;z-index:100;border-bottom:2px solid #3498db;box-sizing:border-box}.game-title h1{margin:0;font-size:clamp(1rem,2.5vh,1.3rem);font-weight:700;text-shadow:0 2px 4px rgba(0,0,0,.5);line-height:1.2}.game-title .title-info{display:flex;gap:1vw;align-items:center;font-size:clamp(.7rem,1.8vh,.9rem);line-height:1.2}.main-game-area{height:90vh;display:flex;flex-direction:row;overflow:hidden}.left-sidebar{width:15vw;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}.game-footer{height:3vh;background:linear-gradient(135deg,#1a252f 0%,#2c3e50 100%);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 -2px 10px #00000080;overflow:hidden;font-size:clamp(.6rem,1.5vh,.8rem);border-top:2px solid #3498db;padding:0 2vw;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);-webkit-backdrop-filter:blur(5px);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;-webkit-backdrop-filter:blur(5px);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{font-size:.9rem}.game-title{padding:.3vh 1vw}.game-title h1{font-size:clamp(.9rem,2vh,1.1rem)}.opponent-info,.player-info-area{padding:.3vh 1vw;height:5vh}.opponent-hand-area,.player-hand-area,.opponent-field-area,.player-field-area{padding:.5vh 1vw}.hand-cards,.field-cards{gap:.2vw}.field-cards{min-height:8vh;max-height:16vh}.field-cards .card{min-height:8vh;max-height:14vh}.opponent-hand-cards{gap:-.3vw;flex-wrap:nowrap;overflow-x:auto;padding:.2vh}.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;-webkit-overflow-scrolling:touch;scroll-behavior:smooth}.player-hand-area{-webkit-overflow-scrolling:touch;touch-action:pan-x}}.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;-webkit-backdrop-filter:blur(2px);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,10vh,120px);font-size:.75rem;aspect-ratio:3 / 4}.card-large{width:auto;height:clamp(100px,13vh,150px);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:manipulation;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.card-playable{box-shadow:0 0 8px #ffc107b3;-webkit-transform:translateZ(0);transform:translateZ(0)}.card-being-dragged{transform:translateY(-12px) scale(1.1);box-shadow:0 12px 30px #ffc107cc;-webkit-transform:translateY(-12px) scale(1.1) translateZ(0)}.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;top:-3px;left:-3px;right:-3px;bottom:-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;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}.player-name .stat-label{font-size:clamp(.4rem,1.2vh,.6rem);opacity:.8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player-name .stat-value{font-size:clamp(.5rem,1.3vh,.7rem);font-weight:700;flex-shrink:0}.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}.player-name .stat-icon{font-size:clamp(.5rem,1.3vh,.7rem)}.player-name .stat-label{font-size:clamp(.35rem,1vh,.5rem)}.player-name .stat-value{font-size:clamp(.4rem,1.1vh,.6rem)}.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:100vw;height:100vh;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:0;left:-350px;width:350px;height:100vh;background:rgba(0,0,0,.95);border-right:2px solid #4a90e2;z-index:999;display:flex;flex-direction:column;transition:left .3s ease;-webkit-backdrop-filter:blur(10px);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-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;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:100vh;padding:0}@media (max-width: 768px){.game-sidebar{width:100%;left:-100%}.game-sidebar.visible{left:0}.sidebar-header,.sidebar-content{padding:15px}}@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;background:rgba(0,0,0,.8);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.target-selector-modal{background:#1a1a2e;border-radius:16px;padding:24px;max-width:600px;width:90%;max-height:80vh;overflow-y:auto;border:2px solid #4a90e2;box-shadow:0 8px 32px #00000080;animation:slideIn .3s ease}.target-selector-header h3{margin:0 0 16px;color:#4a90e2;font-size:20px;font-weight:600;text-align:center}.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}.target-list,.target-section{margin-bottom:20px}.target-section-title{color:#ccc;font-size:16px;font-weight:600;margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.2);display:flex;align-items:center;gap:8px}.target-section-icon{font-size:18px}.target-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}.target-item{background:rgba(255,255,255,.05);border:2px solid transparent;border-radius:8px;padding:12px;cursor:pointer;transition:all .2s ease;position:relative}.target-item:hover{background:rgba(255,255,255,.1);border-color:#4490e280}.target-item.selected{background:rgba(68,144,226,.2);border-color:#4a90e2}.target-item.disabled{opacity:.5;cursor:not-allowed}.target-item.disabled:hover{background:rgba(255,255,255,.05);border-color:transparent}.card-display{display:flex;align-items:center;gap:12px}.card-icon{font-size:24px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.1);border-radius:6px}.card-name{font-weight:600;color:#fff;font-size:14px;margin-bottom:2px}.card-details{font-size:12px;color:#ccc;display:flex;gap:8px}.card-attack,.card-defense{background:rgba(255,255,255,.1);padding:1px 4px;border-radius:3px}.player-display{display:flex;align-items:center;gap:12px}.player-icon{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-info{flex:1}.target-selector-modal .player-name{font-weight:600;color:#fff;font-size:16px;margin-bottom:4px}.player-hp{font-size:14px;color:#f44;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-buttons{display:flex;gap:12px;justify-content:center;margin-top:20px}.confirm-button,.cancel-button{padding:12px 24px;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease;border:none;min-width:100px}.confirm-button{background:#28a745;color:#fff}.confirm-button:hover:not(:disabled){background:#218838;transform:translateY(-1px)}.confirm-button:disabled{background:#6c757d;cursor:not-allowed;opacity:.6}.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)}.selection-info{background:rgba(68,144,226,.1);border:1px solid rgba(68,144,226,.3);border-radius:8px;padding:12px;margin-bottom:16px;text-align:center;color:#4a90e2;font-size:14px}@media (max-width: 768px){.target-selector-modal{margin:20px;padding:20px;width:calc(100% - 40px)}.target-grid{grid-template-columns:1fr}.target-selector-buttons{flex-direction:column}.confirm-button,.cancel-button{width:100%}}.uchikeshi-dialog-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;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;top:0;left:0;right:0;bottom: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-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.8);display:flex;align-items:center;justify-content:center;z-index:10000;animation:fadeIn .3s ease-out}.uchikeshi-counter-dialog{background:linear-gradient(135deg,#1a1a2e 0%,#16213e 50%,#0f3460 100%);border:2px solid #4a9eff;border-radius:16px;padding:24px;min-width:450px;max-width:90vw;max-height:90vh;overflow-y:auto;box-shadow:0 20px 40px #00000080,0 0 0 1px #4a9eff4d,inset 0 1px #ffffff1a;color:#fff;animation:slideIn .3s ease-out;position:relative}.uchikeshi-counter-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid rgba(74,158,255,.3)}.uchikeshi-counter-header h3{font-size:1.4rem;font-weight:700;color:#4a9eff;margin:0;text-shadow:0 2px 4px rgba(0,0,0,.3)}.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}.uchikeshi-counter-content{margin-bottom:24px}.played-card-section h4{font-size:1.1rem;color:#4a9eff;margin:0 0 12px;font-weight:600}.card-display{display:flex;align-items:center;background:rgba(26,26,46,.6);border:1px solid rgba(74,158,255,.3);border-radius:12px;padding:16px;margin-bottom:16px}.card-type{font-size:.9rem;color:#4a9eff;margin-bottom:8px;font-weight:500}.card-description{font-size:.85rem;color:#b8c5d6;line-height:1.4}.uchikeshi-info-section{background:rgba(22,33,62,.8);border-radius:12px;padding:16px;margin-bottom:20px;border:1px solid rgba(74,158,255,.2)}.usage-cost{background:linear-gradient(135deg,#6a1b9a 0%,#8e24aa 100%);color:#fff;padding:4px 12px;border-radius:12px;font-size:.8rem;font-weight:600;border:1px solid rgba(156,39,176,.5)}.uchikeshi-question h4{font-size:1.2rem;color:#4a9eff;margin:0 0 8px;font-weight:700}.uchikeshi-question p{font-size:.9rem;color:#b8c5d6;margin:0;line-height:1.4}.uchikeshi-counter-actions{display:flex;gap:16px;justify-content:center}.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-dialog{margin:16px;min-width:auto;max-width:calc(100vw - 32px)}.uchikeshi-counter-actions{flex-direction:column;gap:12px}.use-uchikeshi-button,.accept-effect-button{width:100%}}.uchikeshi-back-dialog-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.8);display:flex;align-items:center;justify-content:center;z-index:10000;animation:fadeIn .3s ease-out}.uchikeshi-back-dialog{background:linear-gradient(135deg,#2e1a1a 0%,#3e1621 50%,#601a0f 100%);border:2px solid #ff4a4a;border-radius:16px;padding:24px;min-width:500px;max-width:90vw;max-height:90vh;overflow-y:auto;box-shadow:0 20px 40px #00000080,0 0 0 1px #ff4a4a4d,inset 0 1px #ffffff1a;color:#fff;animation:slideIn .3s ease-out;position:relative}.uchikeshi-back-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid rgba(255,74,74,.3)}.uchikeshi-back-header h3{font-size:1.4rem;font-weight:700;color:#ff4a4a;margin:0;text-shadow:0 2px 4px rgba(0,0,0,.3)}.timer-display{display:flex;align-items:center}.timer{background:linear-gradient(135deg,#721e1e 0%,#982a2a 100%);color:#fff;padding:8px 16px;border-radius:20px;font-weight:600;font-size:.9rem;border:1px solid rgba(255,74,74,.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}.uchikeshi-back-content{margin-bottom:24px}.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{display:flex;align-items:center;background:rgba(46,26,26,.6);border:1px solid rgba(255,74,74,.3);border-radius:12px;padding:16px;margin-bottom:16px}.card-icon{font-size:2rem;margin-right:16px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}.card-info{flex:1}.card-name{font-size:1.2rem;font-weight:700;color:#fff;margin-bottom:4px;text-shadow:0 1px 2px rgba(0,0,0,.5)}.card-type{font-size:.9rem;color:#ff4a4a;margin-bottom:8px;font-weight:500}.card-description{font-size:.85rem;color:#d6b8b8;line-height:1.4}.uchikeshi-info-section{background:rgba(62,22,33,.8);border-radius:12px;padding:16px;margin-bottom:20px;border:1px solid rgba(255,74,74,.2)}.uchikeshi-status{display:flex;align-items:center;margin-bottom:12px}.uchikeshi-icon{font-size:1.2rem;margin-right:8px}.uchikeshi-count{font-size:1rem;color:#fff;font-weight:600}.uchikeshi-usage{display:flex;align-items:center}.usage-cost{background:linear-gradient(135deg,#9a1b6a 0%,#aa248e 100%);color:#fff;padding:4px 12px;border-radius:12px;font-size:.8rem;font-weight:600;border:1px solid rgba(176,39,156,.5)}.uchikeshi-question{text-align:center;margin-bottom:20px}.uchikeshi-question h4{font-size:1.2rem;color:#ff4a4a;margin:0 0 8px;font-weight:700}.uchikeshi-question p{font-size:.9rem;color:#d6b8b8;margin:0;line-height:1.4}.uchikeshi-back-explanation{background:rgba(46,26,26,.4);border-radius:12px;padding:16px;margin-bottom:20px;border:1px solid rgba(255,74,74,.2)}.explanation-item{display:flex;align-items:center;margin-bottom:8px;font-size:.9rem;line-height:1.4}.explanation-item:last-child{margin-bottom:0}.explanation-item .icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;margin-right:12px;font-weight:700;font-size:.8rem}.explanation-item .icon:first-child{background:linear-gradient(135deg,#388e3c 0%,#4caf50 100%);color:#fff}.explanation-item:last-child .icon{background:linear-gradient(135deg,#d32f2f 0%,#f44336 100%);color:#fff}.uchikeshi-back-actions{display:flex;gap:16px;justify-content:center}.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,#9a1b6a 0%,#aa248e 100%);color:#fff;border:2px solid #b027b0}.use-uchikeshi-back-button:hover:not(:disabled){background:linear-gradient(135deg,#ad1f7b 0%,#b027b0 100%);transform:translateY(-2px);box-shadow:0 6px 16px #b027b066}.accept-counter-button{background:linear-gradient(135deg,#d32f2f 0%,#f44336 100%);color:#fff;border:2px solid #f44336}.accept-counter-button:hover{background:linear-gradient(135deg,#e53935 0%,#ff5252 100%);transform:translateY(-2px);box-shadow:0 6px 16px #f4433666}.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 slideIn{0%{opacity:0;transform:translateY(-20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@media (max-width: 768px){.uchikeshi-back-dialog{margin:16px;min-width:auto;max-width:calc(100vw - 32px)}.uchikeshi-back-actions{flex-direction:column;gap:12px}.use-uchikeshi-back-button,.accept-counter-button{width:100%}}.waiting-dialog-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0,0,0,.8);display:flex;align-items:center;justify-content:center;z-index:1200;animation:fadeIn .3s ease}.waiting-dialog{background:linear-gradient(135deg,#2c3e50 0%,#3498db 50%,#9b59b6 100%);border-radius:20px;padding:40px;max-width:400px;width:90%;border:3px solid #74b9ff;box-shadow:0 16px 64px #74b9ff66;animation:slideIn .4s cubic-bezier(.34,1.56,.64,1);position:relative;overflow:hidden;text-align:center}.waiting-dialog:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(45deg,transparent 30%,rgba(116,185,255,.1) 50%,transparent 70%);pointer-events:none}.waiting-header{margin-bottom:24px;position:relative;z-index:1}.waiting-header h3{margin:0;color:#74b9ff;font-size:24px;font-weight:700;text-shadow:0 2px 8px rgba(116,185,255,.5);animation:glow 2s ease-in-out infinite alternate}@keyframes glow{0%{text-shadow:0 2px 8px rgba(116,185,255,.5)}to{text-shadow:0 2px 16px rgba(116,185,255,.8)}}.waiting-content{margin-bottom:24px;position:relative;z-index:1}.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 #74b9ff;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.waiting-message{font-size:18px;font-weight:600;color:#fff;margin-bottom:20px;line-height:1.4}.waiting-card-info{display:flex;align-items:center;gap:12px;background:rgba(0,0,0,.3);padding:16px;border-radius:12px;margin-bottom:16px}.card-icon{font-size:24px;color:#74b9ff}.card-details{flex:1;text-align:left}.card-name{font-size:16px;font-weight:600;color:#fff;margin-bottom:4px}.card-type{font-size:14px;color:#bdc3c7}.waiting-note{font-size:14px;color:#bdc3c7;margin-bottom:20px;position:relative;z-index:1;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.waiting-actions{position:relative;z-index:1}.cancel-button{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{background:rgba(255,255,255,.1);border-color:#ffffff80;transform:translateY(-2px)}@media (max-width: 768px){.waiting-dialog{padding:30px;margin:20px}.waiting-header h3{font-size:20px}.waiting-message{font-size:16px}.spinner{width:32px;height:32px}}.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;background:rgba(0,0,0,.8);display:flex;align-items:center;justify-content:center;z-index:2000;animation:fadeIn .3s ease}.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;border:3px solid #4a90e2;box-shadow:0 16px 64px #4a90e266;animation:slideIn .4s cubic-bezier(.34,1.56,.64,1);position:relative;overflow:hidden}.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-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0,0,0,.8);display:flex;align-items:center;justify-content:center;z-index:1900;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.graveyard-modal{background:linear-gradient(135deg,#1a1a2e 0%,#16213e 50%,#0f3460 100%);border-radius:16px;max-width:90vw;max-height:80vh;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}@keyframes slideIn{0%{opacity:0;transform:translateY(-50px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}.graveyard-modal-header{padding:20px 24px;border-bottom:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;align-items:center;background:rgba(0,0,0,.2)}.graveyard-modal-header h3{margin:0;color:#4a90e2;font-size:1.4rem;font-weight:700;text-shadow:0 2px 8px rgba(74,144,226,.5)}.close-button{background:rgba(255,255,255,.1);border:none;color:#fff;font-size:1.5rem;font-weight:700;width:32px;height:32px;border-radius:50%;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center}.close-button:hover{background:rgba(255,68,68,.8);transform:scale(1.1)}.graveyard-modal-content{flex:1;padding:24px;overflow:hidden;display:flex;flex-direction:column}.empty-graveyard{display:flex;align-items:center;justify-content:center;flex:1;color:#ccc;font-size:1.2rem;text-align:center}.empty-graveyard 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}.graveyard-cards-container{flex:1;overflow:hidden;display:flex;flex-direction:column}.graveyard-cards{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-start;justify-content:flex-start;overflow-y:auto;padding:8px;max-height:100%}.graveyard-card{flex-shrink:0;transition:all .3s ease;cursor:pointer;border-radius:8px;overflow:hidden;width:clamp(100px,12vw,140px);height:auto;aspect-ratio:3 / 4}.graveyard-card:hover{transform:translateY(-4px) scale(1.05);box-shadow:0 8px 24px #4a90e266;z-index:10}.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-modal{margin:20px;width:calc(100vw - 40px);max-height:calc(100vh - 40px)}.graveyard-modal-header{padding:16px 20px}.graveyard-modal-header h3{font-size:1.2rem}.graveyard-modal-content{padding:16px 20px}.graveyard-cards{gap:8px;justify-content:center}.graveyard-card{width:clamp(80px,15vw,120px)}}@media (max-width: 480px){.graveyard-modal{margin:10px;width:calc(100vw - 20px);max-height:calc(100vh - 20px)}.graveyard-modal-header{padding:12px 16px}.graveyard-modal-header h3{font-size:1rem}.graveyard-modal-content{padding:12px 16px}.graveyard-card{width:clamp(70px,18vw,100px)}}: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;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}input,textarea,button,select{-webkit-user-select:auto;user-select:auto}button{-webkit-appearance:none;appearance:none;border:none;outline:none;background:none}input,textarea{-webkit-appearance:none;appearance:none;border-radius: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;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%;-webkit-overflow-scrolling:touch;overscroll-behavior:none;position:fixed;width:100%;height:100vh;height:-webkit-fill-available;overflow:hidden}.app{display:flex;flex-direction:column;min-height:100vh;width:100%;height:100vh;height:-webkit-fill-available;position:relative;overflow-y:auto;-webkit-overflow-scrolling:touch}.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}