body,html{margin:0;padding:0;overflow-x:hidden;overflow-y:auto;scroll-behavior:smooth}#root{width:100%;min-height:100vh;overflow-x:hidden;overflow-y:auto;display:flex;flex-direction:column}#root>div{flex:1;width:100%;min-height:100vh;overflow-x:hidden;overflow-y:auto}.shadow-glow{box-shadow:0 0 10px 2px #ffd70080}.text-blue-300{text-shadow:0 0 15px rgba(96,165,250,.8)}h2.text-4xl{text-shadow:0 2px 4px rgba(0,0,0,.8),0 0 10px rgba(255,255,255,.3);letter-spacing:1px}.text-cyan-400,.text-purple-400{text-shadow:0 1px 3px rgba(0,0,0,.8)}.overflow-y-auto{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.2) transparent;overflow-y:auto!important;overflow-x:hidden}.overflow-y-auto::-webkit-scrollbar{width:6px}.overflow-y-auto::-webkit-scrollbar-track{background:transparent}.overflow-y-auto::-webkit-scrollbar-thumb{background-color:#fff3;border-radius:3px}.backdrop-blur-sm{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);box-shadow:0 0 10px #0000004d,inset 0 0 3px #ffffff4d}@keyframes pulse-border{0%{box-shadow:0 0 #ffd70066}70%{box-shadow:0 0 0 6px #ffd70000}to{box-shadow:0 0 #ffd70000}}.ring-yellow-400{animation:pulse-border 2s infinite}.bg-gradient-to-r{background-size:200% 100%;animation:shine 3s infinite}@keyframes shine{0%{background-position:200% center}50%{background-position:0 center}to{background-position:200% center}}.preserve-3d{transform-style:preserve-3d;backface-visibility:hidden}.aspect-toggle{position:fixed;top:1rem;right:1rem;z-index:100;display:flex;align-items:center;padding:.5rem .75rem;background-color:#000000b3;color:#fff;border-radius:.5rem;box-shadow:0 2px 10px #0000004d;font-family:sans-serif;transition:transform .2s ease-in-out}.aspect-toggle:hover{transform:scale(1.05)}.aspect-toggle-label{margin-right:.5rem;font-size:.875rem;-webkit-user-select:none;user-select:none}.aspect-toggle-switch{position:relative;width:3rem;height:1.5rem;border-radius:2rem;transition:background-color .3s;cursor:pointer}.aspect-toggle-switch-handle{position:absolute;top:.25rem;left:.25rem;width:1rem;height:1rem;background-color:#fff;border-radius:50%;transition:transform .3s}.aspect-toggle-switch[data-active=true] .aspect-toggle-switch-handle{transform:translate(1.5rem)}.fixed-aspect-ratio{margin:0 auto;position:relative;transition:width .3s,height .3s;overflow:visible}.preserve-3d{transform-style:preserve-3d;backface-visibility:hidden;will-change:transform}@keyframes scale-in{0%{transform:scale(.9);opacity:.5}to{transform:scale(1);opacity:1}}.transition-container{animation:scale-in .3s ease-out}.aspect-container{position:relative;margin:0 auto;overflow:visible;transition:all .3s ease}.fixed-ratio-16-9{aspect-ratio:16/9;max-width:100vw;max-height:100vh}.scale-with-container{transform-origin:center center}.transition-dimensions{transition:width .3s ease,height .3s ease,transform .3s ease}@media (max-width: 768px){.responsive-text-sm{font-size:.8em}.responsive-text-md{font-size:.9em}.responsive-text-lg{font-size:1em}}.position-preserve{transform:translateZ(0);will-change:transform}.toggle-btn-slide{transition:transform .3s ease}.toggle-btn-slide.active{transform:translate(16px)}.bg-transition{transition:background-color .3s ease}@font-face{font-family:GameFont;src:url(/assets/Storm4Font-M5JvQpNh.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}body,.game-text{font-family:GameFont,sans-serif}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#1a1a1a}::-webkit-scrollbar-thumb{background:#fbbf24;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#f59e0b}.pagination-arrow{transition:all .3s ease;filter:drop-shadow(0 4px 8px rgba(0,0,0,.6))}.pagination-arrow:hover:not(:disabled){transform:scale(1.1);filter:drop-shadow(0 6px 12px rgba(0,0,0,.8))}.pagination-arrow:active:not(:disabled){transform:scale(.95)}.pagination-arrow:disabled{filter:grayscale(1) drop-shadow(0 2px 4px rgba(0,0,0,.4))}.page-indicator{background:linear-gradient(135deg,#000c,#1e1e1ee6);box-shadow:0 4px 12px #00000080,inset 0 1px #ffffff1a;border:1px solid rgba(255,215,0,.4);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.character-grid-pagination{overflow:hidden;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(5,1fr);gap:4px;height:100%;padding:8px}.empty-character-slot{background:#8080801a;border:1px solid rgba(128,128,128,.2);border-radius:4px;transition:all .3s ease}.empty-character-slot:hover{background:#80808026;border-color:#8080804d}.character-slot{transition:all .3s ease;position:relative}.character-slot:hover{transform:translateY(-2px);box-shadow:0 4px 12px #ffd7004d}.character-slot.selected{animation:selectedPulse 2s infinite}@keyframes selectedPulse{0%{box-shadow:0 0 5px #ffd70080}50%{box-shadow:0 0 20px #ffd700cc}to{box-shadow:0 0 5px #ffd70080}}.character-grid-container{position:relative}.page-transition{animation:pageSlide .4s ease-in-out}@keyframes pageSlide{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.keyboard-hint{animation:hintBlink 2s infinite}@keyframes hintBlink{0%,50%{opacity:.6}25%,75%{opacity:1}}.shadow-glow{box-shadow:0 0 5px #ffd70066,0 0 10px #ffd7004d,0 0 15px #ffd70033}@media (max-width: 768px){.pagination-arrow{width:8px;height:12px;font-size:1.2rem}.page-indicator{font-size:.75rem;padding:2px 6px}.character-grid-pagination{gap:2px;padding:4px}}.navigation-arrows{z-index:40}.character-grid-overlay{z-index:10}.character-area::-webkit-scrollbar{width:4px}.character-area::-webkit-scrollbar-track{background:#0003;border-radius:2px}.character-area::-webkit-scrollbar-thumb{background:#ffd70099;border-radius:2px}.character-area::-webkit-scrollbar-thumb:hover{background:#ffd700cc}.storm-button{background:linear-gradient(135deg,#ff6b35,#ff8e53);border:2px solid rgba(255,255,255,.2);color:#fff;font-weight:700;text-shadow:0 1px 2px rgba(0,0,0,.8);filter:drop-shadow(0 4px 8px rgba(0,0,0,.4));transition:all .3s ease}.storm-button:hover:not(:disabled){background:linear-gradient(135deg,#ff8e53,#ffb375);transform:translateY(-1px);filter:drop-shadow(0 6px 12px rgba(0,0,0,.6))}.storm-button:active:not(:disabled){transform:translateY(0);filter:drop-shadow(0 2px 4px rgba(0,0,0,.4))}.storm-button:disabled{background:linear-gradient(135deg,#666,#888);opacity:.5;cursor:not-allowed}