:root{--apex-red: #ff0000;--apex-orange: #f8f8f8;--apex-blue: #f8f8f8;--apex-dark: #303030;--apex-gray: #282828;--apex-light-gray: #383838;--apex-white: #f8f8f8;--apex-line: rgba(248, 248, 248, .16);--apex-line-strong: rgba(248, 248, 248, .34)}body{font-family:Noto Sans SC,Arial,sans-serif;background-color:var(--apex-dark);color:var(--apex-white);line-height:1.6;overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-family:Orbitron,Noto Sans SC,sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.05em}button{font-family:Orbitron,Noto Sans SC,sans-serif;cursor:pointer;border:none;outline:none}img{max-width:100%;height:auto}:root{--apex-black: #303030;--apex-red: #ff0000;--apex-white: #f8f8f8;--apex-gray: #282828;--apex-orange: #f8f8f8;--apex-blue: #f8f8f8;--apex-dark-gray: #282828;--apex-line: rgba(248, 248, 248, .16);--apex-line-strong: rgba(248, 248, 248, .34)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Noto Sans SC,Orbitron,sans-serif;background:var(--apex-black);color:var(--apex-white);overflow-x:hidden;min-height:100vh}.app-container{position:relative;min-height:100vh;padding:2rem}.bg-decoration{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--apex-black);pointer-events:none;z-index:-1}.bg-decoration:before,.bg-decoration:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0}.bg-decoration:before{left:25%;width:1px;background:var(--apex-line);box-shadow:25vw 0 0 var(--apex-line),50vw 0 0 var(--apex-line)}.bg-decoration:after{top:24%;height:1px;background:var(--apex-line);box-shadow:0 24vh 0 var(--apex-line),0 48vh 0 var(--apex-line)}.header{text-align:center;margin-bottom:3rem}.main-title{font-size:4rem;font-weight:900;font-family:Orbitron,Noto Sans SC,sans-serif;color:var(--apex-white);text-shadow:none;margin-bottom:1rem;letter-spacing:.2em}.sub-title{font-size:2.2rem;color:var(--apex-white);font-weight:700;opacity:1;position:relative;display:inline-block;padding:.5rem 2rem;margin:.5rem auto;border:1px solid var(--apex-line-strong);border-radius:4px;background:var(--apex-gray);text-shadow:none;letter-spacing:.1em}.result-section{margin-bottom:3rem}.result-container{display:grid;grid-template-columns:1fr 2fr;gap:2rem;max-width:1200px;margin:0 auto}.legend-result h3,.weapons-result h3{text-align:center;margin-bottom:1rem;font-size:1.2rem;color:var(--apex-white);text-transform:uppercase;letter-spacing:.1em}.weapons-container{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}.result-card{background:var(--apex-gray);border:1px solid var(--apex-line-strong);border-radius:4px;padding:1.5rem;text-align:center;position:relative;overflow:hidden;transition:all .3s ease;min-height:200px;display:flex;flex-direction:column;justify-content:center;align-items:center}.result-card:before{content:none;position:absolute;top:0;left:-100%;width:100%;height:100%;background:transparent;transition:left .5s}.result-card:hover:before{left:100%}.card-placeholder{opacity:.5;font-size:1rem}.legend-card{flex:1}.weapon-card{flex:1;min-width:150px;max-width:250px}.draw-section{text-align:center;margin-bottom:4rem}.draw-mode-selector{display:flex;gap:2rem;justify-content:center;align-items:center}.draw-button{position:relative;background:var(--apex-gray);border:1px solid var(--apex-line-strong);border-radius:4px;padding:1rem 3rem;font-size:1.5rem;font-weight:700;color:var(--apex-white);cursor:pointer;text-transform:uppercase;letter-spacing:.1em;transition:all .3s ease;overflow:hidden;font-family:Orbitron,Noto Sans SC,sans-serif}.draw-button.active{background:var(--apex-red);border-color:var(--apex-red);box-shadow:none}.draw-button:hover{transform:translateY(-2px);box-shadow:none;border-color:var(--apex-red)}.draw-button:active{transform:translateY(0)}.button-glow{position:absolute;top:0;left:-100%;width:100%;height:100%;background:transparent;transition:left .6s}.draw-button:hover .button-glow{left:100%}.manual-controls{display:flex;gap:1.5rem;margin-top:3rem;justify-content:center;flex-wrap:wrap;position:absolute;bottom:50px;left:50%;transform:translate(-50%);width:100%}.stop-button{background:var(--apex-red);border:1px solid var(--apex-red);border-radius:4px;padding:.8rem 2rem;color:var(--apex-white);font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .3s ease;font-family:Orbitron,Noto Sans SC,sans-serif;text-transform:uppercase;letter-spacing:.05em;min-width:120px}.stop-button:hover{transform:translateY(-2px);box-shadow:none}.stop-button:disabled{background:var(--apex-gray);cursor:not-allowed;transform:none;box-shadow:none;opacity:.6}.draw-animation{position:fixed;top:0;left:0;width:100%;height:100%;background:#303030f5;z-index:1000;display:flex;justify-content:center;align-items:center}.draw-animation.hidden{display:none}.animation-container{display:flex;gap:2rem;width:90%;max-width:1000px;height:500px}.legend-reel,.weapon-reel{flex:1;height:100%;overflow:hidden;border:1px solid var(--apex-line-strong);border-radius:4px;position:relative;background:#282828eb}.cards-reel{display:flex;flex-direction:column;gap:10px;padding:1rem;position:relative}.reel-title{position:absolute;top:10px;left:50%;transform:translate(-50%);background:var(--apex-red);color:var(--apex-white);padding:.5rem 1rem;border-radius:4px;font-size:.9rem;font-weight:700;text-transform:uppercase;z-index:10}.weapon-reel .reel-title{background:var(--apex-red)}.reel-highlight{position:absolute;top:calc(50% - 40px);left:10px;right:10px;height:80px;border:2px solid var(--apex-red);border-radius:4px;background:#ff000014;pointer-events:none;z-index:5;box-shadow:none}.weapon-reel .reel-highlight{border-color:var(--apex-line-strong);background:#f8f8f814;box-shadow:none}.section-title{text-align:center;font-size:2rem;margin-bottom:2rem;color:var(--apex-white);text-transform:uppercase;letter-spacing:.1em}.legends-section,.weapons-section{margin-bottom:4rem}.legends-grid,.weapons-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1.5rem;max-width:1400px;margin:0 auto}.legend-item,.weapon-item{background:var(--apex-gray);border:1px solid var(--apex-line);border-radius:4px;padding:1rem;text-align:center;transition:all .3s ease;cursor:pointer;position:relative;overflow:hidden}.legend-item:hover,.weapon-item:hover{border-color:var(--apex-red);transform:translateY(-5px);box-shadow:none}.legend-item img,.weapon-item img{width:auto;max-height:80px;object-fit:contain;border-radius:8px;margin-bottom:.5rem}.legend-item h3,.weapon-item h3{font-size:1rem;margin-bottom:.5rem;color:var(--apex-white)}@media (max-width: 768px){.app-container{padding:1rem}.main-title{font-size:2.2rem;letter-spacing:.1em}.sub-title{font-size:1.5rem;padding:.5rem 1rem}.result-container{grid-template-columns:1fr;gap:2rem}.weapons-container{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.result-card{width:100%;padding:1rem;min-height:180px}.legend-card img{width:100px;height:100px}.weapon-card img{max-height:80px}.card-name{font-size:1.2rem}.draw-mode-selector{flex-direction:column;gap:1rem}.draw-button{font-size:1.2rem;padding:.8rem 2rem}.animation-container{flex-direction:column;height:80vh;max-height:600px;gap:1rem;width:100%;padding:0 1rem}.legend-reel,.weapon-reel{flex:1;height:auto}.reel-highlight{top:calc(50% - 35px);height:70px}.redraw-reel-container .reel-highlight,.redraw-reel-container .animation-card{height:70px}.redraw-reel-container .reel-highlight{top:50%;transform:translateY(-50%)}.animation-card img{width:50px;height:40px}.animation-card h4{font-size:.7rem}.reel-title{left:15px;transform:none;font-size:.7rem;padding:.3rem .7rem}.manual-controls{display:none;position:absolute;bottom:50px;left:50%;transform:translate(-50%);width:100%;flex-wrap:wrap;justify-content:center;gap:1.5rem}.stop-button{font-size:.9rem;padding:.6rem 1.2rem}.redraw-reel-container{height:350px}.redraw-animation-content{max-width:90%;width:95%;padding:1.5rem}.redraw-title{font-size:1.2rem;margin-bottom:1rem}.legends-grid,.weapons-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:1rem}.legend-item img,.weapon-item img{max-height:60px}.draw-animation.manual-mode{display:grid;grid-template-columns:1fr auto;gap:.5rem;padding:0 .5rem}.draw-animation.manual-mode .animation-container{padding:1rem;border:2px solid var(--apex-red);border-radius:4px;background:#282828eb;width:100%}.draw-animation.manual-mode .manual-controls{display:flex;position:static;transform:none;margin:0;flex-direction:column;justify-content:space-around;align-items:center;height:80vh;max-height:600px}.draw-animation.manual-mode .stop-button{font-size:.8rem;padding:.5rem .25rem;white-space:normal;line-height:1.3;width:70px;height:55px;display:flex;align-items:center;justify-content:center;text-align:center}.animation-container.four-reels-active{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:1rem;padding:1rem}.animation-container.four-reels-active .legend-reel,.animation-container.four-reels-active .weapon-reel{flex:1 1 auto;height:100%}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.loading{animation:pulse 1.5s infinite}.hexagon{position:absolute;width:20px;height:20px;background:var(--apex-white);opacity:.1;clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%)}.result-card{justify-content:center;align-items:center;gap:1rem}.special-weapon{border-color:var(--apex-line-strong);box-shadow:none;animation:glow 2s infinite alternate;transition:all .6s cubic-bezier(.22,1,.36,1)}@keyframes glow{0%{border-color:var(--apex-line-strong)}to{border-color:var(--apex-white)}}.bonus-tag{position:absolute;top:-5px;right:-15px;background:var(--apex-red);color:var(--apex-white);padding:.2rem .8rem;border-radius:2px;font-size:.8rem;font-weight:700;text-align:center;z-index:10;box-shadow:none;transform:rotate(35deg);animation:swingIn .8s cubic-bezier(.17,.67,.83,.67);border:1px solid rgba(255,255,255,.5)}@keyframes swingIn{0%{transform:rotate(45deg) translateY(-30px);opacity:0}50%{transform:rotate(30deg) translateY(5px);opacity:.8}to{transform:rotate(35deg) translateY(0);opacity:1}}.result-card img{max-width:100%;height:auto;object-fit:contain;border-radius:8px;margin-bottom:.5rem}.legend-card img{width:120px;height:120px}.weapon-card img{width:auto;max-height:100px}.card-name{font-size:1.5rem;font-weight:700;color:var(--apex-white)}
