.header{position:relative;padding:0 100px;height:50px;display:flex;align-items:center;justify-content:center;border-bottom:1px solid #1a1a1a;background:#000}.game-logo{position:absolute;left:100px;top:50%;transform:translateY(-50%);font-size:11px;color:#666;letter-spacing:2px}.logo-text{font-weight:600;text-transform:uppercase}.page-title{font-size:16px;font-weight:600;color:#fff;letter-spacing:1px}.user-info{position:absolute;right:100px;top:50%;transform:translateY(-50%);display:flex;align-items:center;gap:12px;color:#fffc;font-size:14px}.username{font-weight:500}.logout-btn,.login-btn{color:#fff9;transition:color .3s}.logout-btn:hover,.login-btn:hover{color:#4a9eff}.header-divider{color:#333;font-size:12px}@media (max-width: 1024px){.header{padding:0 20px}.game-logo{left:20px;font-size:10px}.page-title{font-size:15px}.user-info{right:20px;gap:8px;font-size:13px}}@media (max-width: 768px){.header{padding:0 12px;height:45px}.game-logo{left:12px;font-size:9px;letter-spacing:1px}.page-title{font-size:14px;letter-spacing:.5px}.user-info{right:12px;gap:6px;font-size:12px}.username{display:none}.logout-btn,.login-btn{font-size:12px;padding:4px 8px}}@media (max-width: 480px){.header{padding:0 8px;height:42px}.game-logo{left:8px;font-size:8px}.logo-text{display:none}.page-title{font-size:13px}.user-info{right:8px;gap:4px}.logout-btn span,.login-btn span{display:none}}.footer{width:100%;background:#0d0d0d;border-top:1px solid #1a1a1a;padding:15px 100px;box-sizing:border-box}.footer-content{display:flex;justify-content:space-between;align-items:center;max-width:1800px;margin:0 auto;gap:20px}.footer-left,.footer-center,.footer-right{display:flex;align-items:center;gap:10px}.footer-text{font-size:12px;color:#666;letter-spacing:.3px}.footer-link{font-size:12px;color:#888;text-decoration:none;transition:color .2s;letter-spacing:.3px}.footer-link:hover{color:#4a9eff}.footer-divider{color:#333;font-size:12px;margin:0 5px}@media (max-width: 1200px){.footer{padding:15px 50px}.footer-content{flex-direction:column;gap:10px}.footer-left,.footer-center,.footer-right{justify-content:center}}.d4-loading-container{width:100%;height:100%;min-height:60vh;background:radial-gradient(circle at center,#1a0a0a,#000 70%);display:flex;flex-direction:column;align-items:center;justify-content:center;animation:d4-fadeIn .3s ease-in;position:relative}.d4-loading-fullscreen{position:fixed;top:0;left:0;right:0;bottom:0;min-height:100vh;z-index:9999}.fire-orb-container{position:relative;width:60px;height:60px;margin-bottom:1rem}.outer-glow{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:70px;height:70px;background:radial-gradient(circle,rgba(180,0,0,.4) 0%,rgba(255,107,0,.2) 40%,transparent 70%);animation:d4-pulse 2s ease-in-out infinite;border-radius:50%}.central-orb{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:35px;height:35px;background:radial-gradient(circle,#ff6b00 0%,#d4af37 40%,#b40000 70%,transparent 100%);border-radius:50%;box-shadow:0 0 15px #ff6b00cc,0 0 25px #b4000080;animation:d4-fireFlicker .8s ease-in-out infinite alternate}.inner-core{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:15px;height:15px;background:radial-gradient(circle,#fff 0%,#ff6b00 50%,transparent 100%);border-radius:50%;animation:d4-coreFlicker .6s ease-in-out infinite alternate}.runes-container{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:55px;height:55px;animation:d4-rotateRunes 4s linear infinite}.rune-dot{position:absolute;top:50%;left:50%;width:3px;height:3px;background:#d4af37;border-radius:50%;box-shadow:0 0 5px #d4af37,0 0 10px #d4af3799;animation:d4-runeGlow 1.2s ease-in-out infinite}.loading-text-container{text-align:center;position:relative}.loading-title{color:#f44;font-size:1rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin-bottom:.3rem;text-shadow:0 0 8px rgba(255,68,68,.8),0 0 15px rgba(180,0,0,.6),0 2px 4px rgba(0,0,0,.8);animation:d4-textGlow 2s ease-in-out infinite;font-family:serif}.loading-subtitle{color:#888;font-size:.7rem;letter-spacing:.05em;text-shadow:0 1px 3px rgba(0,0,0,.8);font-family:serif;margin:0}.loading-dots{margin-top:.8rem;display:flex;gap:6px;justify-content:center}.loading-dot{width:5px;height:5px;background:#d4af37;border-radius:50%;animation:d4-dotBounce 1.4s ease-in-out infinite;box-shadow:0 0 8px #d4af3799}.bottom-flame{position:absolute;bottom:0;left:0;right:0;height:80px;background:linear-gradient(to top,rgba(180,0,0,.3) 0%,transparent 100%);opacity:.6;animation:d4-flameWave 3s ease-in-out infinite;pointer-events:none}@keyframes d4-rotateRunes{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}@keyframes d4-pulse{0%,to{transform:translate(-50%,-50%) scale(1);opacity:.6}50%{transform:translate(-50%,-50%) scale(1.2);opacity:.9}}@keyframes d4-fireFlicker{0%{transform:translate(-50%,-50%) scale(1);opacity:.9}to{transform:translate(-50%,-50%) scale(1.15);opacity:1}}@keyframes d4-coreFlicker{0%{transform:translate(-50%,-50%) scale(.8);opacity:.7}to{transform:translate(-50%,-50%) scale(1);opacity:1}}@keyframes d4-runeGlow{0%,to{box-shadow:0 0 10px #d4af37,0 0 20px #d4af3799;opacity:.8}50%{box-shadow:0 0 20px #d4af37,0 0 35px #d4af37e6;opacity:1}}@keyframes d4-textGlow{0%,to{text-shadow:0 0 10px rgba(255,68,68,.8),0 0 20px rgba(180,0,0,.6),0 2px 4px rgba(0,0,0,.8)}50%{text-shadow:0 0 20px rgba(255,68,68,1),0 0 30px rgba(180,0,0,.8),0 2px 4px rgba(0,0,0,.8)}}@keyframes d4-dotBounce{0%,80%,to{transform:translateY(0)}40%{transform:translateY(-10px)}}@keyframes d4-flameWave{0%,to{opacity:.4}50%{opacity:.7}}@keyframes d4-fadeIn{0%{opacity:0}to{opacity:1}}.build-guide-page{min-height:100vh;display:flex;flex-direction:column;background:#0a0a0a}.build-guide-content{flex:1;position:relative;width:100%;background:#0a0a0a;overflow:hidden;min-height:calc(100vh - 100px)}.build-guide-loading{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#0a0a0a;z-index:10}.build-guide-iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none}.planner-page{min-height:100vh;display:flex;flex-direction:column;background:#0a0a0a}.planner-content{flex:1;display:flex;position:relative;min-height:calc(100vh - 100px)}.planner-loading{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#0a0a0a;z-index:10}.planner-iframe{width:100%;height:100%;border:none;flex:1}#root{width:100%;height:100%}.app{height:100vh;width:100%;display:flex;flex-direction:column}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{margin:0;padding:0;box-sizing:border-box}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}#root{width:100%;margin:0}