:root{--primary-color: #2563eb;--secondary-color: #10b981;--accent-color: #8b5cf6;--text-color: #1f2937;--bg-color: #ffffff;--surface-color: #f8fafc;--gray-light: #f3f4f6;--gray-dark: #4b5563;--max-width: 1200px;--spacing-unit: 1rem;--gradient-1: #667eea;--gradient-2: #764ba2;--gradient-3: #f093fb;--gradient-4: #4facfe;--shadow-color: rgba(0, 0, 0, 0.1);--shadow-hover: rgba(0, 0, 0, 0.2);--transition-speed: 0.3s;--transition-bounce: cubic-bezier(0.68, -0.55, 0.265, 1.55)}[data-theme="dark"]{--primary-color: #3b82f6;--secondary-color: #34d399;--accent-color: #a78bfa;--text-color: #f3f4f6;--bg-color: #0f172a;--surface-color: #1e293b;--gray-light: #334155;--gray-dark: #94a3b8;--gradient-1: #434343;--gradient-2: #000000;--gradient-3: #1e3c72;--gradient-4: #2a5298;--shadow-color: rgba(0, 0, 0, 0.3);--shadow-hover: rgba(0, 0, 0, 0.5)}[data-theme="dark"] body::before{background:linear-gradient(45deg, #1a1a2e, #16213e, #0f3460, #533483, #1a1a2e);opacity:0.15}[data-theme="dark"] body::after{background:radial-gradient(circle at 20% 80%, rgba(83,52,131,0.2) 0%, transparent 50%),radial-gradient(circle at 80% 20%, rgba(15,52,96,0.2) 0%, transparent 50%),radial-gradient(circle at 40% 40%, rgba(22,33,62,0.2) 0%, transparent 50%);opacity:0.2}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;line-height:1.6;color:var(--text-color);background-color:var(--bg-color);position:relative;min-height:100vh;transition:background-color var(--transition-speed) ease,color var(--transition-speed) ease}body::before{content:'';position:fixed;top:0;left:0;width:100%;height:100%;background:linear-gradient(45deg, #667eea, #764ba2, #f093fb, #4facfe, #667eea);background-size:400% 400%;animation:gradientShift 15s ease infinite;opacity:0.08;z-index:-10;pointer-events:none}body::after{content:'';position:fixed;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 20% 80%, rgba(120,119,198,0.2) 0%, transparent 50%),radial-gradient(circle at 80% 20%, rgba(255,119,198,0.2) 0%, transparent 50%),radial-gradient(circle at 40% 40%, rgba(120,200,255,0.2) 0%, transparent 50%);animation:floatingGradient 25s ease infinite;opacity:0.1;z-index:-9;pointer-events:none}@keyframes gradientShift{0%{background-position:0% 50%;transform:rotate(0deg)}25%{background-position:100% 50%;transform:rotate(90deg)}50%{background-position:100% 100%;transform:rotate(180deg)}75%{background-position:0% 100%;transform:rotate(270deg)}100%{background-position:0% 50%;transform:rotate(360deg)}}@keyframes floatingGradient{0%, 100%{transform:scale(1) rotate(0deg);opacity:0.2}33%{transform:scale(1.1) rotate(120deg);opacity:0.3}66%{transform:scale(0.9) rotate(240deg);opacity:0.1}}@keyframes pulse{0%, 100%{transform:scale(1) rotate(0deg)}50%{transform:scale(1.1) rotate(180deg)}}@keyframes gradientText{0%, 100%{filter:hue-rotate(0deg);transform:rotateY(0deg)}50%{filter:hue-rotate(30deg);transform:rotateY(5deg)}}@keyframes glowPulse{0%, 100%{filter:brightness(1);transform:scale(1)}50%{filter:brightness(1.2);transform:scale(1.02)}}@keyframes floatButton{0%, 100%{transform:translateY(0) rotateX(0)}50%{transform:translateY(-10px) rotateX(5deg)}}@keyframes rotateGradient{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@keyframes neonGlow{0%{transform:translateY(0) scale(1);box-shadow:0 5px 15px var(--shadow-color)}100%{transform:translateY(-5px) scale(1.05);box-shadow:0 10px 30px var(--shadow-hover),0 0 30px rgba(102,126,234,0.5)}}@keyframes goldShine{0%, 100%{filter:brightness(1)}50%{filter:brightness(1.3)}}@keyframes rotate{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@keyframes shimmer{0%{background-position:-200% center}100%{background-position:200% center}}@keyframes achievementUnlock{0%{transform:scale(0) rotate(0)}50%{transform:scale(1.2) rotate(180deg)}100%{transform:scale(1) rotate(360deg)}}[data-theme="dark"] .branch-btn{color:#f3f4f6}[data-theme="dark"] .stat-label{color:#94a3b8}[data-theme="dark"] .stat-card{color:#f3f4f6}.main-content{max-width:var(--max-width);margin:0 auto;padding:calc(var(--spacing-unit) * 2)}.container{max-width:var(--max-width);margin:0 auto;padding:0 calc(var(--spacing-unit) * 2);position:relative;z-index:1}.rpg-interface{min-height:100vh;padding:calc(var(--spacing-unit) * 2) 0;background:var(--background-color);position:relative;overflow:hidden}[data-theme="light"] .rpg-interface{background:var(--background-color)}.rpg-interface::before{display:none}[data-theme="light"] .rpg-interface::before{display:none}.game-container{max-width:1400px;margin:0 auto;padding:4rem calc(var(--spacing-unit) * 2) calc(var(--spacing-unit) * 2);position:relative;z-index:1;background:repeating-linear-gradient(0deg, #0f172a 0px, #0f172a 4px, #1e293b 4px, #1e293b 8px),repeating-linear-gradient(90deg, rgba(255,255,255,0.02) 0px, rgba(255,255,255,0.02) 4px, transparent 4px, transparent 8px);background-size:8px 8px;border:4px solid rgba(255,215,0,0.3);border-radius:1rem;box-shadow:0 0 0 8px #0f172a,0 0 0 12px rgba(255,215,0,0.1),0 20px 50px rgba(0,0,0,0.5)}.game-container::before,.game-container::after{content:'';position:absolute;left:-2rem;right:-2rem;height:2.5rem;background:linear-gradient(180deg, #8b4513 0%, sienna 25%, peru 50%, sienna 75%, #8b4513 100%);border:3px solid #654321;border-radius:1.25rem;box-shadow:0 4px 12px rgba(0,0,0,0.4),inset 0 2px 4px rgba(255,255,255,0.2),inset 0 -2px 4px rgba(0,0,0,0.2);z-index:2}.game-container::before{top:-1.25rem;background-image:linear-gradient(180deg, #8b4513 0%, sienna 25%, peru 50%, sienna 75%, #8b4513 100%),repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 4px)}.game-container::after{bottom:-1.25rem;background-image:linear-gradient(180deg, #8b4513 0%, sienna 25%, peru 50%, sienna 75%, #8b4513 100%),repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 4px)}[data-theme="light"] .game-container{background:repeating-linear-gradient(0deg, #e2e8f0 0px, #e2e8f0 4px, #f1f5f9 4px, #f1f5f9 8px),repeating-linear-gradient(90deg, rgba(0,0,0,0.02) 0px, rgba(0,0,0,0.02) 4px, transparent 4px, transparent 8px);background-size:8px 8px;border:4px solid rgba(217,119,6,0.3);box-shadow:0 0 0 8px #e2e8f0,0 0 0 12px rgba(217,119,6,0.1),0 20px 50px rgba(0,0,0,0.1)}[data-theme="light"] .game-container::before,[data-theme="light"] .game-container::after{background:linear-gradient(180deg, sienna 0%, peru 25%, #deb887 50%, peru 75%, sienna 100%);border:3px solid #8b4513}[data-theme="light"] .game-container::before{background-image:linear-gradient(180deg, sienna 0%, peru 25%, #deb887 50%, peru 75%, sienna 100%),repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 4px)}[data-theme="light"] .game-container::after{background-image:linear-gradient(180deg, sienna 0%, peru 25%, #deb887 50%, peru 75%, sienna 100%),repeating-linear-gradient(0deg, rgba(0,0,0,0.15) 0px, rgba(0,0,0,0.15) 1px, transparent 1px, transparent 4px)}.site-header{background-color:var(--surface-color);backdrop-filter:blur(10px);background-color:rgba(var(--surface-color), 0.8);box-shadow:0 1px 3px var(--shadow-color);position:sticky;top:0;z-index:100;transition:all var(--transition-speed) ease;box-shadow:0 0 20px rgba(102,126,234,0.3),0 4px 15px rgba(118,75,162,0.2),inset 0 -1px 0 rgba(255,255,255,0.1)}[data-theme="dark"] .site-header{box-shadow:0 0 25px rgba(96,165,250,0.4),0 4px 20px rgba(167,139,250,0.3),inset 0 -1px 0 rgba(255,255,255,0.05)}.site-nav{max-width:var(--max-width);margin:0 auto;padding:var(--spacing-unit) calc(var(--spacing-unit) * 2);display:flex;justify-content:space-between;align-items:center;position:relative;z-index:10}.nav-container{display:flex;align-items:center;gap:calc(var(--spacing-unit) * 2);position:relative;z-index:10}.theme-switch-wrapper{display:flex;align-items:center;gap:0.5rem}.theme-switch{position:relative;display:inline-block;width:60px;height:30px}.theme-switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:var(--gray-light);transition:var(--transition-speed);border-radius:30px;overflow:hidden}.slider:before{position:absolute;content:'';height:22px;width:22px;left:4px;bottom:4px;background-color:white;transition:var(--transition-speed) var(--transition-bounce);border-radius:50%;box-shadow:0 2px 5px rgba(0,0,0,0.2)}input:checked+.slider{background:linear-gradient(45deg, var(--gradient-3), var(--gradient-4))}input:checked+.slider:before{transform:translateX(30px)}.theme-icon{font-size:1.2rem;transition:transform var(--transition-speed) ease}.theme-switch-wrapper:hover .theme-icon{transform:rotate(180deg)}.site-title{font-size:1.5rem;font-weight:bold;text-decoration:none;color:var(--text-color);position:relative;text-transform:uppercase;letter-spacing:0.1em;transition:all var(--transition-speed) ease;background:linear-gradient(45deg, gold, #ff6b6b, #4ecdc4, #a855f7, gold);background-size:300% 300%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:dungeonGradient 3s ease infinite;font-family:'Courier New', monospace}@keyframes dungeonGradient{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}.site-title::before{content:attr(class);position:absolute;top:0;left:0;text-shadow:0 0 10px #667eea, 0 0 20px #667eea, 0 0 30px #667eea, 0 0 40px #764ba2;opacity:0;transition:opacity var(--transition-speed) ease;pointer-events:none}.site-title:hover{transform:scale(1.05);filter:drop-shadow(0 0 20px rgba(255,215,0,0.8));animation-duration:1s}.site-title:hover::before{opacity:0.5;animation:neonFlicker 1.5s infinite alternate}@keyframes neonFlicker{0%, 100%{opacity:0.5}50%{opacity:0.8}}@media (max-width: 768px){.site-nav{padding:calc(var(--spacing-unit) * 0.75) var(--spacing-unit)}.nav-container{gap:var(--spacing-unit)}.site-title{font-size:1.2rem}.theme-switch{width:50px;height:25px}.slider:before{height:18px;width:18px;left:3px;bottom:3.5px}input:checked+.slider:before{transform:translateX(25px)}}.site-footer{background:var(--surface-color);padding:calc(var(--spacing-unit) * 3) 0;margin-top:calc(var(--spacing-unit) * 4);position:relative;overflow:hidden;box-shadow:0 -4px 20px rgba(102,126,234,0.3),inset 0 1px 0 rgba(255,255,255,0.1)}[data-theme="dark"] .site-footer{box-shadow:0 -4px 25px rgba(96,165,250,0.4),inset 0 1px 0 rgba(255,255,255,0.05)}.footer-content{max-width:var(--max-width);margin:0 auto;padding:0 calc(var(--spacing-unit) * 2);text-align:center;position:relative;z-index:10}.social-links{display:flex;gap:calc(var(--spacing-unit) * 2);justify-content:center;margin-bottom:var(--spacing-unit)}.social-links a{color:var(--gray-dark);text-decoration:none;transition:color 0.3s ease}.social-links a:hover{color:var(--primary-color)}.nav-links{display:flex;list-style:none;gap:calc(var(--spacing-unit) * 2)}.nav-links a{text-decoration:none;color:var(--text-color);position:relative;padding:0.5rem 1rem;transition:color var(--transition-speed) ease;overflow:hidden}.nav-links a::before{content:'';position:absolute;bottom:0;left:0;width:0;height:3px;background:linear-gradient(90deg, var(--gradient-1), var(--gradient-2));transition:width var(--transition-speed) var(--transition-bounce)}.nav-links a:hover{color:var(--primary-color)}.nav-links a:hover::before{width:100%}[data-theme="light"] .skill-nav-top{background:transparent}[data-theme="light"] .skill-nav-top::-webkit-scrollbar-track{background:rgba(0,0,0,0.05)}[data-theme="light"] .skill-nav-top::-webkit-scrollbar-thumb{background:rgba(0,0,0,0.2)}[data-theme="light"] .skill-nav-top::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,0.3)}[data-theme="light"] .nav-btn{background:linear-gradient(135deg, rgba(255,255,255,0.7) 0%, rgba(248,250,252,0.5) 100%);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%)}[data-theme="light"] .nav-btn::before{background:linear-gradient(135deg, rgba(59,130,246,0.3), rgba(147,51,234,0.3), rgba(236,72,153,0.3))}[data-theme="light"] .nav-btn::after{background:radial-gradient(circle at center, rgba(59,130,246,0.15) 0%, transparent 70%)}[data-theme="light"] .nav-btn:hover{background:linear-gradient(135deg, rgba(241,245,249,0.8) 0%, rgba(226,232,240,0.6) 100%)}[data-theme="light"] .nav-btn:hover .nav-name{color:#3b82f6;filter:drop-shadow(0 0 8px rgba(59,130,246,0.5))}[data-theme="light"] .nav-btn.active{background:linear-gradient(135deg, rgba(59,130,246,0.95) 0%, rgba(99,102,241,0.95) 100%)}[data-theme="light"] .nav-btn.active::before{background:linear-gradient(135deg, #3b82f6, #9333ea, #ec4899);opacity:0.3}[data-theme="light"] .nav-btn.active .nav-name{color:#ffffff;font-weight:700;text-shadow:0 2px 4px rgba(0,0,0,0.3)}[data-theme="light"] .nav-name{color:#475569}.skill-nav-top{position:absolute;top:20px;left:50%;transform:translateX(-50%);display:flex;gap:calc(var(--spacing-unit) * 1.5);justify-content:center;padding:var(--spacing-unit);z-index:5;background:transparent;border-radius:1rem;overflow-x:auto;overflow-y:hidden;white-space:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:rgba(255,215,0,0.3) rgba(0,0,0,0.1);max-width:calc(100% - 40px)}.skill-nav-top{justify-content:flex-start}.skill-nav-top::-webkit-scrollbar{height:6px}.skill-nav-top::-webkit-scrollbar-track{background:rgba(0,0,0,0.1);border-radius:3px}.skill-nav-top::-webkit-scrollbar-thumb{background:rgba(255,215,0,0.3);border-radius:3px}.skill-nav-top::-webkit-scrollbar-thumb:hover{background:rgba(255,215,0,0.5)}.nav-btn{background:linear-gradient(135deg, rgba(15,23,42,0.6) 0%, rgba(30,41,59,0.4) 100%);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid transparent;background-clip:padding-box;border-radius:12px;padding:calc(var(--spacing-unit) * 1.5) calc(var(--spacing-unit) * 2.5);cursor:pointer;transition:all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);display:inline-flex;align-items:center;justify-content:center;position:relative;overflow:hidden;flex-shrink:0;min-width:100px;font-weight:600;text-transform:uppercase;letter-spacing:0.05em}.nav-btn::before{content:'';position:absolute;inset:0;border-radius:12px;padding:1px;background:linear-gradient(135deg, rgba(59,130,246,0.5), rgba(147,51,234,0.5), rgba(236,72,153,0.5));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity 0.3s ease}.nav-btn::after{content:'';position:absolute;inset:-50%;background:radial-gradient(circle at center, rgba(59,130,246,0.2) 0%, transparent 70%);transform:scale(0);opacity:0;transition:all 0.4s ease}.nav-btn:hover{transform:translateY(-2px) scale(1.02);background:linear-gradient(135deg, rgba(30,41,59,0.7) 0%, rgba(51,65,85,0.5) 100%)}.nav-btn:hover::before{opacity:1}.nav-btn:hover::after{transform:scale(1);opacity:1}.nav-btn:hover .nav-name{filter:drop-shadow(0 0 8px currentColor)}.nav-btn.active{background:linear-gradient(135deg, rgba(59,130,246,0.2) 0%, rgba(147,51,234,0.2) 100%)}.nav-btn.active::before{opacity:1;background:linear-gradient(135deg, rgba(59,130,246,0.8), rgba(147,51,234,0.8), rgba(236,72,153,0.8));animation:gradient-shift 3s ease infinite}.nav-btn.active::after{transform:scale(1.5);opacity:0.5;animation:pulse 2s ease-in-out infinite}.nav-btn.active .nav-name{color:#fff;text-shadow:0 0 20px rgba(59,130,246,0.8)}@keyframes gradient-shift{0%, 100%{background:linear-gradient(135deg, rgba(59,130,246,0.8), rgba(147,51,234,0.8), rgba(236,72,153,0.8))}50%{background:linear-gradient(135deg, rgba(236,72,153,0.8), rgba(59,130,246,0.8), rgba(147,51,234,0.8))}}@keyframes pulse{0%, 100%{transform:scale(1.5);opacity:0.5}50%{transform:scale(2);opacity:0.3}}.nav-name{font-size:0.85rem;color:rgba(255,255,255,0.9);transition:all 0.3s ease;z-index:1}.branch-btn{background:linear-gradient(135deg, rgba(30,41,59,0.9) 0%, rgba(51,65,85,0.9) 100%);border:2px solid rgba(100,116,139,0.5);border-radius:0.75rem;padding:calc(var(--spacing-unit) * 1.5);color:var(--text-color);cursor:pointer;transition:all var(--transition-speed) ease;position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;gap:0.5rem;font-family:inherit}.branch-btn::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg, transparent, rgba(255,215,0,0.2), transparent);transform:translateX(-100%);transition:transform 0.6s ease}.branch-btn:hover::before{transform:translateX(100%)}.branch-btn:hover{transform:translateY(-3px);box-shadow:0 10px 30px rgba(0,0,0,0.5),inset 0 1px 0 rgba(255,255,255,0.2);border-color:rgba(255,215,0,0.5)}.branch-btn.active{background:linear-gradient(135deg, rgba(59,130,246,0.3) 0%, rgba(147,51,234,0.3) 100%);border-color:rgba(255,215,0,0.8);box-shadow:0 0 30px rgba(255,215,0,0.3),inset 0 1px 0 rgba(255,255,255,0.3)}.branch-icon{font-size:2rem}.branch-name{font-weight:600;font-size:0.9rem}.branch-level{font-size:0.8rem;color:#ffd700;font-weight:bold}.skill-nav-top{top:10px;padding:calc(var(--spacing-unit) * 0.75);gap:calc(var(--spacing-unit) * 1);max-width:calc(100% - 20px)}.nav-btn{min-width:100px;padding:calc(var(--spacing-unit) * 1) calc(var(--spacing-unit) * 1.5);font-size:0.9rem}.nav-name{font-size:0.85rem}.nav-links{display:flex;list-style:none;gap:calc(var(--spacing-unit) * 2)}.nav-links a{text-decoration:none;color:var(--text-color);position:relative;padding:0.5rem 1rem;transition:color var(--transition-speed) ease;overflow:hidden}.nav-links a::before{content:'';position:absolute;bottom:0;left:0;width:0;height:3px;background:linear-gradient(90deg, var(--gradient-1), var(--gradient-2));transition:width var(--transition-speed) var(--transition-bounce)}.nav-links a:hover{color:var(--primary-color)}.nav-links a:hover::before{width:100%}[data-theme="light"] .skill-nav-top{background:transparent}[data-theme="light"] .skill-nav-top::-webkit-scrollbar-track{background:rgba(0,0,0,0.05)}[data-theme="light"] .skill-nav-top::-webkit-scrollbar-thumb{background:rgba(0,0,0,0.2)}[data-theme="light"] .skill-nav-top::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,0.3)}[data-theme="light"] .nav-btn{background:linear-gradient(135deg, rgba(255,255,255,0.7) 0%, rgba(248,250,252,0.5) 100%);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%)}[data-theme="light"] .nav-btn::before{background:linear-gradient(135deg, rgba(59,130,246,0.3), rgba(147,51,234,0.3), rgba(236,72,153,0.3))}[data-theme="light"] .nav-btn::after{background:radial-gradient(circle at center, rgba(59,130,246,0.15) 0%, transparent 70%)}[data-theme="light"] .nav-btn:hover{background:linear-gradient(135deg, rgba(241,245,249,0.8) 0%, rgba(226,232,240,0.6) 100%)}[data-theme="light"] .nav-btn:hover .nav-name{color:#3b82f6;filter:drop-shadow(0 0 8px rgba(59,130,246,0.5))}[data-theme="light"] .nav-btn.active{background:linear-gradient(135deg, rgba(59,130,246,0.95) 0%, rgba(99,102,241,0.95) 100%)}[data-theme="light"] .nav-btn.active::before{background:linear-gradient(135deg, #3b82f6, #9333ea, #ec4899);opacity:0.3}[data-theme="light"] .nav-btn.active .nav-name{color:#ffffff;font-weight:700;text-shadow:0 2px 4px rgba(0,0,0,0.3)}[data-theme="light"] .nav-name{color:#475569}.btn{padding:0.875rem 2rem;border-radius:50px;text-decoration:none;font-weight:600;transition:all var(--transition-speed) var(--transition-bounce);display:inline-block;position:relative;overflow:hidden;text-transform:uppercase;letter-spacing:0.05em;transform-style:preserve-3d;perspective:1000px}.btn::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:inherit;border-radius:inherit;transform:translateZ(-5px) translateY(5px);filter:brightness(0.7) blur(2px);opacity:0.7;z-index:-1}.btn::after{content:'';position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:radial-gradient(circle, rgba(255,255,255,0.5) 0%, transparent 70%);transform:translate(-50%, -50%);transition:width 0.6s, height 0.6s}.btn:hover::after{width:300px;height:300px}.btn-primary{background:linear-gradient(135deg, #667eea, #764ba2, #f093fb);color:white;box-shadow:0 5px 20px rgba(102,126,234,0.4),0 10px 40px rgba(118,75,162,0.3),inset 0 1px 0 rgba(255,255,255,0.3)}.btn-primary:hover{transform:translateY(-5px) rotateX(-10deg) scale(1.05);box-shadow:0 15px 35px rgba(102,126,234,0.5),0 20px 50px rgba(118,75,162,0.4),0 0 50px rgba(240,147,251,0.3);background:linear-gradient(135deg, #764ba2, #f093fb, #667eea)}.btn-secondary{background:linear-gradient(135deg, transparent 25%, rgba(102,126,234,0.1) 50%, transparent 75%);color:var(--text-color);border:2px solid transparent;background-image:linear-gradient(var(--bg-color), var(--bg-color)),linear-gradient(135deg, #667eea, #764ba2, #f093fb);background-origin:border-box;background-clip:padding-box, border-box;box-shadow:0 5px 20px rgba(102,126,234,0.2),inset 0 0 20px rgba(102,126,234,0.1)}.btn-secondary:hover{transform:translateY(-5px) rotateX(-10deg) scale(1.05);box-shadow:0 15px 35px rgba(102,126,234,0.4),0 0 50px rgba(118,75,162,0.3),inset 0 0 30px rgba(240,147,251,0.2);color:white;background-image:linear-gradient(135deg, #667eea, #764ba2, #f093fb),linear-gradient(135deg, #667eea, #764ba2, #f093fb)}.hero-buttons .btn{animation:floatButton 6s ease-in-out infinite}.hero-buttons .btn:nth-child(2){animation-delay:0.5s}.view-full-tree{background:linear-gradient(135deg, gold, #ffed4e);color:#000;border:none;padding:1rem 2rem;border-radius:50px;font-weight:bold;font-size:1rem;cursor:pointer;transition:all var(--transition-speed) ease;text-transform:uppercase;letter-spacing:0.05em}.view-full-tree:hover{transform:translateY(-3px);box-shadow:0 10px 30px rgba(255,215,0,0.5)}[data-theme="dark"] .developer-stats{background:rgba(30,41,59,0.9);border:1px solid rgba(148,163,184,0.2);backdrop-filter:blur(15px)}[data-theme="dark"] .social-link{background:rgba(30,41,59,0.9);border:1px solid rgba(148,163,184,0.2);backdrop-filter:blur(10px)}.developer-stats{background:rgba(var(--surface-color), 0.8);backdrop-filter:blur(10px);padding:calc(var(--spacing-unit) * 1.5);border-radius:1rem;margin:calc(var(--spacing-unit) * 2) 0;border:1px solid rgba(var(--gradient-1), 0.2)}.developer-stats h3{margin-bottom:var(--spacing-unit);text-align:center;color:var(--text-color)}[data-theme="dark"] .developer-stats h3{color:#f3f4f6}.time-display{text-align:center;font-size:1.5rem;font-weight:600;color:var(--primary-color)}[data-theme="dark"] .time-display{color:#60a5fa}.social-section{margin:calc(var(--spacing-unit) * 2) 0}.social-section h3{text-align:center;margin-bottom:calc(var(--spacing-unit) * 1.5);color:var(--text-color)}[data-theme="dark"] .social-section h3{color:#f3f4f6}.social-links-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(100px, 1fr));gap:var(--spacing-unit);margin-bottom:calc(var(--spacing-unit) * 2)}.social-link{display:flex;flex-direction:column;align-items:center;padding:var(--spacing-unit);text-decoration:none;color:var(--text-color);background:var(--surface-color);border-radius:1rem;transition:all var(--transition-speed) var(--transition-bounce);border:1px solid transparent;position:relative;overflow:hidden}.social-link:hover{transform:translateY(-5px) scale(1.05);box-shadow:0 10px 30px var(--shadow-hover);border-color:var(--gradient-1)}.social-icon{margin-bottom:0.5rem;transition:all var(--transition-speed) ease;color:var(--text-color)}.social-icon svg{width:32px;height:32px;transition:all var(--transition-speed) ease}.social-link:hover .social-icon{transform:rotate(10deg) scale(1.1)}.social-link span{font-size:0.875rem;font-weight:500;transition:color var(--transition-speed) ease;color:var(--text-color)}[data-theme="dark"] .social-link span{color:#e2e8f0}.social-link{transform-style:preserve-3d;perspective:1000px}.social-link::before{content:'';position:absolute;inset:-2px;border-radius:1rem;background:linear-gradient(45deg, transparent, var(--gradient-1), transparent);opacity:0;transition:opacity var(--transition-speed) ease;z-index:-1;animation:rotateGradient 3s linear infinite}.social-link:hover::before{opacity:0.7}.social-link.github:hover{animation:neonGlow 1.5s ease-in-out infinite alternate}.social-link.github:hover .social-icon svg{color:#333;filter:drop-shadow(0 0 10px #333) drop-shadow(0 0 20px #333)}[data-theme="dark"] .social-link.github:hover .social-icon svg{color:#f3f4f6;filter:drop-shadow(0 0 10px #f3f4f6) drop-shadow(0 0 20px #f3f4f6)}.social-link.linkedin:hover .social-icon svg{color:#0077b5;filter:drop-shadow(0 0 10px #0077b5) drop-shadow(0 0 20px #0077b5)}.social-link.medium:hover .social-icon svg{color:#00ab6c;filter:drop-shadow(0 0 10px #00ab6c) drop-shadow(0 0 20px #00ab6c)}.social-link.cakeresume:hover .social-icon svg{color:#ffc107;filter:drop-shadow(0 0 10px #ffc107) drop-shadow(0 0 20px #ffc107)}.social-link.facebook:hover .social-icon svg{color:#1877f2;filter:drop-shadow(0 0 10px #1877f2) drop-shadow(0 0 20px #1877f2)}.social-link.threads:hover .social-icon svg{color:#000;filter:drop-shadow(0 0 10px rgba(0,0,0,0.5)) drop-shadow(0 0 20px rgba(0,0,0,0.3))}[data-theme="dark"] .social-link.threads:hover .social-icon svg{color:#fff;filter:drop-shadow(0 0 10px #fff) drop-shadow(0 0 20px #fff)}.hero{min-height:80vh;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;background:linear-gradient(135deg, rgba(var(--gradient-1), 0.1), rgba(var(--gradient-2), 0.1))}.hero::before{content:'';position:absolute;width:200%;height:200%;top:-50%;left:-50%;background:radial-gradient(circle, var(--gradient-3) 0%, transparent 70%);animation:pulse 8s ease-in-out infinite;opacity:0.1}.hero-content{text-align:center;z-index:2;position:relative}.hero h1{font-size:3.5rem;margin-bottom:var(--spacing-unit);background:linear-gradient(135deg, var(--gradient-1), var(--gradient-2), var(--gradient-3));background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:gradientText 5s ease infinite, glowPulse 2s ease-in-out infinite;text-shadow:0 0 30px rgba(102,126,234,0.5),0 0 60px rgba(118,75,162,0.3),0 0 90px rgba(240,147,251,0.2);position:relative;transform-style:preserve-3d;perspective:1000px}.hero h1::after{content:attr(class);position:absolute;top:0;left:0;background:linear-gradient(135deg, var(--gradient-1), var(--gradient-2), var(--gradient-3));background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;z-index:-1;transform:translateZ(-5px) translateX(2px) translateY(2px);opacity:0.5;filter:blur(2px)}[data-theme="dark"] .hero h1{background:linear-gradient(135deg, #60a5fa, #a78bfa, #f472b6);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 0 40px rgba(96,165,250,0.6),0 0 80px rgba(167,139,250,0.4),0 0 120px rgba(244,114,182,0.3)}.hero p{font-size:1.25rem;color:var(--gray-dark);margin-bottom:calc(var(--spacing-unit) * 2)}[data-theme="dark"] .hero p{color:#cbd5e1}.hero-buttons{display:flex;gap:var(--spacing-unit);justify-content:center}.hero-buttons{perspective:1000px}.hero-canvas{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}.hero-subtitle{font-size:1.25rem;color:var(--gray-dark);margin-bottom:calc(var(--spacing-unit) * 2);opacity:0.9}[data-theme="dark"] .hero-subtitle{color:#cbd5e1;opacity:1}.status-bar{background:linear-gradient(135deg, rgba(30,41,59,0.98) 0%, rgba(51,65,85,0.98) 100%);border:3px solid rgba(255,215,0,0.3);border-radius:1rem;padding:calc(var(--spacing-unit) * 1.5);margin-bottom:calc(var(--spacing-unit) * 2);box-shadow:0 10px 30px rgba(0,0,0,0.5),inset 0 1px 0 rgba(255,255,255,0.1),0 0 50px rgba(255,215,0,0.1);display:flex;gap:calc(var(--spacing-unit) * 3);align-items:center;position:relative;overflow:hidden}[data-theme="light"] .status-bar{background:linear-gradient(135deg, rgba(255,255,255,0.98) 0%, rgba(248,250,252,0.98) 100%);border:3px solid rgba(217,119,6,0.4);box-shadow:0 10px 30px rgba(0,0,0,0.1),inset 0 1px 0 rgba(255,255,255,0.9),0 0 50px rgba(217,119,6,0.1)}.status-bar::before{content:'';position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;background:linear-gradient(45deg, gold, transparent, gold);opacity:0.3;animation:borderGlow 3s linear infinite;z-index:-1}@keyframes borderGlow{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.player-info{display:flex;gap:calc(var(--spacing-unit) * 1.5);align-items:center}.avatar-frame{position:relative;width:80px;height:80px;background:linear-gradient(45deg, transparent 30%, rgba(255,215,0,0.2) 30%, rgba(255,215,0,0.2) 70%, transparent 70%),linear-gradient(-45deg, transparent 30%, rgba(255,215,0,0.1) 30%, rgba(255,215,0,0.1) 70%, transparent 70%);border-radius:50%;padding:3px;animation:avatarGlow 3s ease-in-out infinite}@keyframes avatarGlow{0%, 100%{background-size:100% 100%;filter:hue-rotate(0deg)}50%{background-size:120% 120%;filter:hue-rotate(30deg)}}.player-avatar{width:100%;height:100%;border-radius:50%;border:3px solid #ffd700;box-shadow:0 0 20px rgba(255,215,0,0.5),0 0 40px rgba(255,215,0,0.3);object-fit:cover;image-rendering:-moz-crisp-edges;image-rendering:-webkit-crisp-edges;image-rendering:pixelated;image-rendering:crisp-edges;filter:contrast(1.1) saturate(1.2);transition:all var(--transition-speed) ease}.player-avatar:hover{transform:scale(1.05);filter:contrast(1.2) saturate(1.3) brightness(1.1);box-shadow:0 0 30px rgba(255,215,0,0.7),0 0 60px rgba(255,215,0,0.4)}.avatar-placeholder{width:100%;height:100%;border-radius:50%;border:3px solid #ffd700;background:linear-gradient(135deg, rgba(30,41,59,0.9) 0%, rgba(51,65,85,0.9) 100%);display:flex;align-items:center;justify-content:center;box-shadow:0 0 20px rgba(255,215,0,0.5),0 0 40px rgba(255,215,0,0.3);transition:all var(--transition-speed) ease}.avatar-placeholder:hover{transform:scale(1.05);box-shadow:0 0 30px rgba(255,215,0,0.7),0 0 60px rgba(255,215,0,0.4)}.pixel-char{font-size:2.5rem;filter:drop-shadow(0 0 5px rgba(255,215,0,0.8)) drop-shadow(0 0 10px rgba(255,215,0,0.6));animation:pixelBounce 2s ease-in-out infinite}@keyframes pixelBounce{0%, 100%{transform:translateY(0) scale(1)}50%{transform:translateY(-3px) scale(1.1)}}.level-badge{position:absolute;bottom:-5px;right:-5px;background:linear-gradient(135deg, gold, #ffed4e);color:#000;font-weight:900;font-size:0.8rem;padding:0.2rem 0.5rem;border-radius:50px;box-shadow:0 0 10px rgba(255,215,0,0.8)}.player-stats h2{color:#ffd700;font-size:1.5rem;margin:0;text-shadow:0 0 10px rgba(255,215,0,0.5);font-weight:900}[data-theme="light"] .player-stats h2{color:#d97706;text-shadow:0 0 10px rgba(217,119,6,0.3)}.player-title{color:#94a3b8;font-size:0.9rem;margin:0.25rem 0 0 0;max-width:250px;line-height:1.4;word-break:keep-all}[data-theme="light"] .player-title{color:#64748b}.resource-bars{flex:1;display:flex;flex-direction:column;gap:0.75rem}.hp-bar,.mp-bar,.sp-bar,.exp-bar{display:flex;align-items:center;gap:var(--spacing-unit)}.bar-label{min-width:40px;font-weight:bold;text-transform:uppercase;font-size:0.9rem;font-family:monospace;text-shadow:2px 2px 0 rgba(0,0,0,0.5)}.hp-bar .bar-label{color:#ef4444}.mp-bar .bar-label{color:#3b82f6}.sp-bar .bar-label{color:#22c55e}.exp-bar .bar-label{color:#ffd700}[data-theme="light"] .bar-label{color:#475569;text-shadow:1px 1px 2px rgba(0,0,0,0.05)}.bar-container{flex:1;height:24px;background:rgba(0,0,0,0.5);border:2px solid rgba(255,255,255,0.1);border-radius:50px;position:relative;overflow:hidden}.bar-fill{height:100%;border-radius:50px;position:relative;transition:width 0.2s ease-out;box-shadow:0 0 20px currentColor}.hp-fill{background:linear-gradient(90deg, #dc2626, #ef4444, #f87171);animation:hpPulse 2s ease-in-out infinite}.mp-fill{background:linear-gradient(90deg, #2563eb, #3b82f6, #60a5fa);animation:mpShimmer 3s linear infinite}.sp-fill{background:linear-gradient(90deg, #16a34a, #22c55e, #4ade80);animation:spGlow 2.5s ease-in-out infinite}.exp-fill{background:linear-gradient(90deg, gold, #ffed4e, gold) !important;background-size:200% 100%}.exp-fill.leveling-up{animation:shimmer 2s linear 3}.exp-fill.near-level-up{animation:nearLevelGlow 3s ease-in-out infinite}@keyframes nearLevelGlow{0%, 100%{filter:brightness(1)}50%{filter:brightness(1.4) drop-shadow(0 0 10px gold)}}@keyframes spGlow{0%, 100%{filter:brightness(1);opacity:0.9}50%{filter:brightness(1.3);opacity:1}}@keyframes hpPulse{0%, 100%{filter:brightness(1)}50%{filter:brightness(1.2)}}@keyframes mpShimmer{0%{background-position:-200% center}100%{background-position:200% center}}@keyframes shimmer{0%{background-position:-200% center}100%{background-position:200% center}}.bar-text{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);color:white;font-weight:bold;font-size:0.8rem;text-shadow:0 0 5px rgba(0,0,0,0.8)}.pixel-text{font-family:'Courier New', monospace;font-weight:bold;letter-spacing:1px;text-shadow:1px 1px 0 #000,-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,2px 2px 0 rgba(0,0,0,0.5);image-rendering:pixelated;-webkit-font-smoothing:none;font-smooth:never}.damage-popup{position:absolute;font-family:'Courier New', monospace;font-weight:bold;font-size:1.2rem;pointer-events:none;z-index:1000;animation:floatUp 1.5s ease-out forwards;text-shadow:2px 2px 0 #000, -2px -2px 0 #000, 2px -2px 0 #000, -2px 2px 0 #000}.damage-popup.damage{color:#ff4444}.damage-popup.heal{color:#44ff44}.damage-popup.mana{color:#4444ff}.damage-popup.stamina{color:#44ff88}@keyframes floatUp{0%{opacity:1;transform:translateY(0) scale(1)}50%{opacity:1;transform:translateY(-30px) scale(1.2)}100%{opacity:0;transform:translateY(-60px) scale(0.8)}}.player-avatar.dead{filter:grayscale(100%) contrast(1.2);opacity:0.7;transition:all 0.5s ease}.hp-bar.critical .bar-container{animation:criticalPulse 0.5s ease-in-out infinite}@keyframes criticalPulse{0%, 100%{box-shadow:0 0 10px rgba(255,0,0,0.8)}50%{box-shadow:0 0 20px red,inset 0 0 10px rgba(255,0,0,0.5)}}@media (max-width: 1024px){.status-bar{flex-direction:column;gap:calc(var(--spacing-unit) * 1.5);text-align:center}.player-info{justify-content:center}.resource-bars{width:100%}}@media (max-width: 768px){.status-bar{padding:var(--spacing-unit)}.avatar-frame{width:60px;height:60px}.player-stats h2{font-size:1.2rem}.player-title{font-size:0.8rem}.bar-label{font-size:0.8rem;min-width:30px}.bar-container{height:20px}}.game-tabs{display:grid;grid-template-columns:repeat(5, 1fr);gap:1rem;margin-bottom:calc(var(--spacing-unit) * 2);padding:1rem;background:rgba(30,41,59,0.5);border-radius:1rem}[data-theme="light"] .game-tabs{background:rgba(226,232,240,0.8);scrollbar-color:rgba(217,119,6,0.3) transparent}.tab-btn{background:linear-gradient(135deg, rgba(51,65,85,0.9) 0%, rgba(71,85,105,0.9) 100%);border:2px solid rgba(148,163,184,0.3);border-radius:0.75rem;padding:0.75rem 1rem;color:#cbd5e1;cursor:pointer;transition:all var(--transition-speed) ease;display:flex;align-items:center;justify-content:center;font-family:inherit;font-size:0.9rem;font-weight:600;white-space:nowrap;position:relative;overflow:hidden;height:44px}[data-theme="light"] .tab-btn{background:linear-gradient(135deg, rgba(241,245,249,0.9) 0%, rgba(226,232,240,0.9) 100%);border:2px solid rgba(148,163,184,0.5);color:#475569}.tab-btn::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg, transparent, rgba(255,215,0,0.2), transparent);transform:translateX(-100%);transition:transform 0.6s ease}.tab-btn:hover::before{transform:translateX(100%)}.tab-btn:hover{transform:translateY(-2px);box-shadow:0 5px 20px rgba(255,215,0,0.2);border-color:rgba(255,215,0,0.5);color:#ffd700}.tab-btn.active{background:linear-gradient(135deg, rgba(59,130,246,0.3) 0%, rgba(147,51,234,0.3) 100%);border-color:#ffd700;color:#ffd700;box-shadow:0 0 20px rgba(255,215,0,0.3),inset 0 1px 0 rgba(255,255,255,0.2)}[data-theme="light"] .tab-btn.active{background:linear-gradient(135deg, rgba(217,119,6,0.2) 0%, rgba(245,158,11,0.2) 100%);border-color:#d97706;color:#d97706;box-shadow:0 0 20px rgba(217,119,6,0.2),inset 0 1px 0 rgba(255,255,255,0.9)}.tab-content{background:linear-gradient(0deg, transparent 24%, rgba(255,255,255,0.05) 25%, rgba(255,255,255,0.05) 26%, transparent 27%, transparent 74%, rgba(255,255,255,0.05) 75%, rgba(255,255,255,0.05) 76%, transparent 77%, transparent),linear-gradient(90deg, transparent 24%, rgba(255,255,255,0.05) 25%, rgba(255,255,255,0.05) 26%, transparent 27%, transparent 74%, rgba(255,255,255,0.05) 75%, rgba(255,255,255,0.05) 76%, transparent 77%, transparent),#1e293b;background-size:30px 30px;border:3px solid rgba(255,215,0,0.2);border-radius:0;padding:calc(var(--spacing-unit) * 2);min-height:500px;box-shadow:0 0 0 3px #0f172a,0 0 0 6px rgba(255,215,0,0.1),0 20px 50px rgba(0,0,0,0.5);position:relative;overflow:hidden;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges}[data-theme="light"] .tab-content{background:linear-gradient(0deg, transparent 24%, rgba(0,0,0,0.05) 25%, rgba(0,0,0,0.05) 26%, transparent 27%, transparent 74%, rgba(0,0,0,0.05) 75%, rgba(0,0,0,0.05) 76%, transparent 77%, transparent),linear-gradient(90deg, transparent 24%, rgba(0,0,0,0.05) 25%, rgba(0,0,0,0.05) 26%, transparent 27%, transparent 74%, rgba(0,0,0,0.05) 75%, rgba(0,0,0,0.05) 76%, transparent 77%, transparent),#f8fafc;background-size:30px 30px;border:3px solid rgba(217,119,6,0.3);box-shadow:0 0 0 3px #e2e8f0,0 0 0 6px rgba(217,119,6,0.1),0 20px 50px rgba(0,0,0,0.1)}.tab-panel{display:none;animation:fadeIn 0.5s ease;overflow:visible}.tab-panel.active{display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}100%{opacity:1;transform:translateY(0)}}[data-theme="light"] .tab-panel{color:#1e293b}[data-theme="light"] .tab-panel h3{color:#0f172a;text-shadow:2px 2px 4px rgba(0,0,0,0.1)}[data-theme="light"] .tab-panel h4{color:#1e293b}[data-theme="light"] .tab-panel p{color:#475569}@media (max-width: 1200px){.game-tabs{grid-template-columns:repeat(4, 1fr)}}@media (max-width: 900px){.game-tabs{grid-template-columns:repeat(3, 1fr);gap:0.75rem}}@media (max-width: 768px){.game-tabs{grid-template-columns:repeat(2, 1fr);gap:0.5rem;padding:0.75rem}.tab-btn{padding:0.5rem 0.75rem;font-size:0.8rem;height:38px}}.status-panel{display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--spacing-unit) * 2)}.attributes-section,.stats-section{background:rgba(0,0,0,0.3);border:2px solid rgba(148,163,184,0.2);border-radius:1rem;padding:calc(var(--spacing-unit) * 1.5)}.attributes-section h3,.stats-section h3{color:#ffd700;margin-bottom:calc(var(--spacing-unit) * 1.5);text-align:center;text-transform:uppercase;font-size:1.1rem;letter-spacing:0.1em}.attribute-item{display:grid;grid-template-columns:auto 1fr;gap:calc(var(--spacing-unit) * 0.5);align-items:center;margin-bottom:calc(var(--spacing-unit) * 1.25);position:relative}.attr-name-container{display:flex;align-items:center;gap:calc(var(--spacing-unit) * 0.5)}.attr-icon{width:24px;height:24px;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges;cursor:help;transition:all 0.2s ease;filter:brightness(0.9)}.attr-icon:hover{filter:brightness(1.2) drop-shadow(0 0 8px rgba(255,215,0,0.6));transform:scale(1.1)}.attr-name{color:#cbd5e1;font-weight:700;font-family:'Courier New', monospace;font-size:1rem;letter-spacing:0.05em}.attr-value{color:#ffd700;font-weight:bold;font-size:1.1rem}.attr-bar{grid-column:1 / -1;height:8px;background:rgba(0,0,0,0.5);border-radius:50px;overflow:hidden;margin-top:0.25rem}.attr-fill{height:100%;background:linear-gradient(90deg, #10b981, #34d399);border-radius:50px;transition:width 0.6s var(--transition-bounce)}.bug-bar{background:linear-gradient(90deg, #dc2626, #ef4444)}.san-bar{background:linear-gradient(90deg, #7c3aed, #a855f7)}.stress-bar{background:linear-gradient(90deg, #ea580c, #f97316)}.coffee-bar{background:linear-gradient(90deg, #78350f, #92400e)}.overtime-bar{background:linear-gradient(90deg, #1e3a8a, #2563eb)}.deadline-bar{background:linear-gradient(90deg, #b91c1c, #dc2626);animation:deadline-pulse 1.5s ease-in-out infinite}.luck-bar{background:linear-gradient(90deg, gold, #fbbf24)}@keyframes deadline-pulse{0%, 100%{opacity:1}50%{opacity:0.6}}.dev-stats{display:grid;gap:calc(var(--spacing-unit) * 1.5)}.dev-stats .stat-item{display:flex;align-items:center;gap:var(--spacing-unit);padding:var(--spacing-unit);background:rgba(0,0,0,0.2);border-radius:0.5rem;border:1px solid rgba(148,163,184,0.1)}.dev-stats .stat-icon{font-size:1.5rem;color:#ffd700}.dev-stats .stat-label{flex:1;color:#94a3b8}.dev-stats .stat-value{color:#f3f4f6;font-weight:bold;font-size:1.1rem}.time-stats{display:flex;gap:calc(var(--spacing-unit) * 1.5);margin-bottom:calc(var(--spacing-unit) * 2);flex-wrap:wrap}.time-stat-item{flex:1;min-width:140px;padding:calc(var(--spacing-unit) * 1.5);background:rgba(0,0,0,0.3);border-radius:0.5rem;border:1px solid rgba(148,163,184,0.2);display:flex;flex-direction:column;gap:calc(var(--spacing-unit) * 0.5)}.time-label{color:#94a3b8;font-size:0.8rem;text-transform:uppercase;letter-spacing:0.05em}.time-value{color:#f3f4f6;font-weight:bold;font-size:1.1rem;font-family:'Courier New', monospace}.buff-container{padding:calc(var(--spacing-unit) * 1.5);background:rgba(0,0,0,0.3);border-radius:0.5rem;border:1px solid rgba(148,163,184,0.2)}.buff-container h4{color:#cbd5e1;font-size:0.9rem;margin-bottom:var(--spacing-unit);text-transform:uppercase;letter-spacing:0.05em}.buff-list{display:flex;gap:calc(var(--spacing-unit) * 0.75);flex-wrap:wrap}.buff-item{width:32px;height:32px;background:rgba(30,41,59,0.8);border:2px solid rgba(148,163,184,0.3);position:relative;cursor:pointer;transition:all 0.2s ease;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges}.buff-item:hover{transform:scale(1.1);border-color:#ffd700;box-shadow:0 0 10px rgba(255,215,0,0.3)}.buff-icon-img{width:100%;height:100%;object-fit:cover;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges}.debuff-container{padding:calc(var(--spacing-unit) * 1.5);background:rgba(0,0,0,0.3);border-radius:0.5rem;border:1px solid rgba(220,38,38,0.3);margin-top:calc(var(--spacing-unit) * 1.5)}.debuff-container h4{color:#fca5a5;font-size:0.9rem;margin-bottom:var(--spacing-unit);text-transform:uppercase;letter-spacing:0.05em}.debuff-list{display:flex;gap:calc(var(--spacing-unit) * 0.75);flex-wrap:wrap}.debuff-item{width:32px;height:32px;background:rgba(59,7,7,0.8);border:2px solid rgba(220,38,38,0.4);position:relative;cursor:pointer;transition:all 0.2s ease;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges}.debuff-item:hover{transform:scale(1.1);border-color:#dc2626;box-shadow:0 0 10px rgba(220,38,38,0.5)}.debuff-icon-img{width:100%;height:100%;object-fit:cover;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges}[data-theme="light"] .attributes-section,[data-theme="light"] .stats-section{background:rgba(248,250,252,0.8);border-color:rgba(203,213,225,0.5)}[data-theme="light"] .attributes-section h3,[data-theme="light"] .stats-section h3{color:#d97706;text-shadow:0 0 10px rgba(217,119,6,0.3)}[data-theme="light"] .attr-name{color:#475569}[data-theme="light"] .attr-value{color:#d97706}[data-theme="light"] .dev-stats .stat-item{background:rgba(241,245,249,0.6);border-color:#cbd5e1}[data-theme="light"] .dev-stats .stat-icon{color:#d97706}[data-theme="light"] .dev-stats .stat-label{color:#64748b}[data-theme="light"] .dev-stats .stat-value{color:#1e293b}[data-theme="light"] .time-stat-item{background:rgba(241,245,249,0.6);border-color:#cbd5e1}[data-theme="light"] .time-label{color:#64748b}[data-theme="light"] .time-value{color:#1e293b}[data-theme="light"] .buff-container{background:rgba(241,245,249,0.6);border-color:#cbd5e1}[data-theme="light"] .buff-container h4{color:#475569}[data-theme="light"] .buff-item{background:rgba(248,250,252,0.9);border-color:#cbd5e1}[data-theme="light"] .buff-item:hover{border-color:#d97706;box-shadow:0 0 10px rgba(217,119,6,0.3)}[data-theme="light"] .debuff-container{background:rgba(241,245,249,0.6);border-color:#f87171}[data-theme="light"] .debuff-container h4{color:#dc2626}[data-theme="light"] .debuff-item{background:rgba(254,242,242,0.9);border-color:#fca5a5}[data-theme="light"] .debuff-item:hover{border-color:#dc2626;box-shadow:0 0 10px rgba(220,38,38,0.4)}@media (max-width: 768px){.status-panel{grid-template-columns:1fr}.attribute-item{grid-template-columns:auto 1fr;gap:calc(var(--spacing-unit) * 0.3)}.attr-icon{font-size:1.2rem}.attr-name{font-size:0.9rem}.attr-value{font-size:1rem}.time-stats{gap:var(--spacing-unit)}.time-stat-item{min-width:120px;padding:var(--spacing-unit)}}.skill-points-display{position:absolute;bottom:calc(var(--spacing-unit) * 2);right:calc(var(--spacing-unit) * 2);background:linear-gradient(135deg, rgba(15,23,42,0.95) 0%, rgba(30,41,59,0.95) 100%);border:2px solid rgba(255,215,0,0.8);border-radius:1rem;padding:calc(var(--spacing-unit) * 1) calc(var(--spacing-unit) * 1.5);text-align:center;box-shadow:0 4px 20px rgba(0,0,0,0.5),0 0 30px rgba(255,215,0,0.3),inset 0 0 20px rgba(255,215,0,0.1);backdrop-filter:blur(10px);z-index:10;min-width:150px;overflow:hidden;transition:all 0.3s ease}.skill-points-display:hover{transform:translateY(-2px);box-shadow:0 6px 25px rgba(0,0,0,0.6),0 0 40px rgba(255,215,0,0.4),inset 0 0 25px rgba(255,215,0,0.15);border-color:gold}.skill-points-display::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg, transparent, rgba(255,215,0,0.4), transparent);animation:shimmer 3s linear infinite}.points-label{font-size:0.9rem;color:#94a3b8;text-transform:uppercase;letter-spacing:0.05em;margin-right:calc(var(--spacing-unit) * 0.3)}.points-value{font-size:1.8rem;font-weight:900;color:#ffd700;text-shadow:0 0 15px rgba(255,215,0,0.8),0 0 30px rgba(255,215,0,0.5);animation:goldShine 2s ease-in-out infinite;font-family:'Courier New', monospace}[data-theme="light"] .skill-points-display{background:linear-gradient(135deg, rgba(248,250,252,0.95) 0%, rgba(241,245,249,0.95) 100%);border-color:rgba(217,119,6,0.8);box-shadow:0 4px 20px rgba(0,0,0,0.1),0 0 30px rgba(217,119,6,0.2),inset 0 0 20px rgba(217,119,6,0.05)}[data-theme="light"] .points-label{color:#64748b}[data-theme="light"] .points-value{color:#d97706;text-shadow:0 0 10px rgba(217,119,6,0.5)}[data-theme="dark"] .skill-card{background:rgba(15,23,42,0.95);backdrop-filter:blur(15px)}.skill-tree-container{background:linear-gradient(135deg, rgba(15,23,42,0.95) 0%, rgba(30,41,59,0.95) 100%);border-radius:1.5rem;padding:calc(var(--spacing-unit) * 2);box-shadow:0 20px 50px rgba(0,0,0,0.5),inset 0 2px 4px rgba(255,255,255,0.1),inset 0 -2px 4px rgba(0,0,0,0.3);border:2px solid rgba(255,215,0,0.3);position:relative;overflow:hidden}[data-theme="dark"] .skill-tree-container{background:linear-gradient(135deg, rgba(15,23,42,0.98) 0%, rgba(30,41,59,0.98) 100%)}[data-theme="dark"] .skill-details-panel{color:#f3f4f6}[data-theme="dark"] .skill-details-content p{color:#cbd5e1}.skill-tree-container{position:relative;height:calc(100vh - 300px);min-height:600px}.skill-tree-view{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden}#skill-tree-canvas{width:100%;height:100%;background:rgba(0,0,0,0.2);border-radius:1rem}.skill-details-panel{position:absolute;top:50%;right:20px;transform:translateY(-50%) translateX(20px);width:300px;max-height:400px;background:linear-gradient(135deg, rgba(30,41,59,0.98) 0%, rgba(51,65,85,0.98) 100%);border:2px solid rgba(100,116,139,0.5);border-radius:1rem;padding:0;overflow:hidden;opacity:0;transition:all 0.3s ease;pointer-events:none;box-shadow:0 10px 30px rgba(0,0,0,0.5);z-index:10;display:flex;flex-direction:column}.skill-details-panel.active{opacity:1;transform:translateY(-50%) translateX(0);pointer-events:auto}.skill-details-close{position:absolute;top:10px;right:10px;width:30px;height:30px;background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.2);border-radius:50%;color:#fff;font-size:20px;line-height:1;cursor:pointer;transition:all 0.2s ease;display:flex;align-items:center;justify-content:center}.skill-details-close:hover{background:rgba(255,255,255,0.2);border-color:rgba(255,255,255,0.3);transform:scale(1.1)}.skill-details-content{padding:calc(var(--spacing-unit) * 2);overflow-y:auto;overflow-x:hidden;flex:1}.skill-details-panel::before{content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle, rgba(255,215,0,0.1) 0%, transparent 70%);animation:rotate 20s linear infinite;pointer-events:none}.skill-details-content h3{color:#ffd700;font-size:1.3rem;margin-bottom:calc(var(--spacing-unit) * 0.75);text-shadow:0 0 20px rgba(255,215,0,0.5)}.skill-level-bar{background:rgba(0,0,0,0.3);border:1px solid rgba(255,215,0,0.3);border-radius:50px;height:24px;position:relative;overflow:hidden;margin-bottom:calc(var(--spacing-unit) * 1.5)}.skill-stats{display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--spacing-unit) * 0.75);margin-top:calc(var(--spacing-unit) * 1.5)}.skill-stats-overview{display:grid;grid-template-columns:repeat(3, 1fr);gap:calc(var(--spacing-unit) * 2);margin-top:calc(var(--spacing-unit) * 3)}@media (max-width: 1024px){.skill-tree-container{height:calc(100vh - 400px);min-height:400px}.skill-details-panel{width:90%;max-width:300px;right:5%;left:5%;margin:0 auto}}@media (max-width: 768px){.nav-links{flex-wrap:wrap;justify-content:center}.hero h1{font-size:2.5rem}.hero-buttons{flex-direction:column;align-items:center}.social-links-grid{grid-template-columns:repeat(3, 1fr)}.skills-grid{grid-template-columns:1fr}.developer-stats{margin:var(--spacing-unit) 0}.skill-stats-overview{grid-template-columns:1fr;gap:var(--spacing-unit)}.skill-details-panel{margin-top:calc(var(--spacing-unit) * 2)}}.skills-panel{text-align:center;padding:calc(var(--spacing-unit) * 3)}.skill-tree-mini{min-height:300px;background:radial-gradient(ellipse at center, rgba(102,126,234,0.1) 0%, transparent 70%);border-radius:1rem;margin-bottom:calc(var(--spacing-unit) * 2)}[data-theme="light"] .skill-tree-container{color:#1e293b}[data-theme="light"] .skill-details-panel{background:rgba(248,250,252,0.9);border-color:#cbd5e1}[data-theme="light"] .skill-details-content h3{color:#0f172a}[data-theme="light"] .skill-branches{background:rgba(248,250,252,0.5)}[data-theme="light"] .skill-tree-view{color:#1e293b}.story-panel{color:#cbd5e1}.story-panel h3{color:#ffd700;margin-bottom:calc(var(--spacing-unit) * 1.5);text-align:center;font-size:1.5rem}.story-content{background:rgba(0,0,0,0.2);padding:calc(var(--spacing-unit) * 1.5);border-radius:1rem;margin-bottom:calc(var(--spacing-unit) * 2);line-height:1.8}.story-content p{margin-bottom:var(--spacing-unit)}.timeline{display:grid;gap:var(--spacing-unit)}.timeline-item{display:flex;align-items:center;gap:calc(var(--spacing-unit) * 1.5);padding:var(--spacing-unit);background:rgba(0,0,0,0.2);border-radius:0.5rem;border-left:3px solid #ffd700;transition:all var(--transition-speed) ease}.timeline-item:hover{transform:translateX(5px);background:rgba(255,215,0,0.1)}.timeline-date{color:#ffd700;font-weight:bold;min-width:80px}.timeline-event{color:#e2e8f0}[data-theme="light"] .story-content{background:rgba(248,250,252,0.8);color:#334155}[data-theme="light"] .timeline-item{background:rgba(241,245,249,0.8);border-color:#cbd5e1;color:#1e293b}[data-theme="light"] .timeline-date{color:#3b82f6}[data-theme="light"] .timeline-event{color:#475569}.book-container{width:100%;height:calc(100vh - 200px);min-height:600px;display:flex;justify-content:center;align-items:center;perspective:2000px;position:relative;overflow:hidden}.book{width:1000px;height:600px;position:relative;transform-style:preserve-3d;transition:transform 0.5s ease;margin:0 auto;left:0;right:0}.book-page{position:absolute !important;width:500px;height:600px;background:linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);border:1px solid rgba(0,0,0,0.1);box-shadow:0 0 20px rgba(0,0,0,0.1),inset 0 0 40px rgba(0,0,0,0.05);transform-style:preserve-3d;transition:transform 0.6s cubic-bezier(0.645, 0.045, 0.355, 1);transform-origin:left center;backface-visibility:hidden;overflow:hidden;top:0 !important;will-change:transform}[data-theme="dark"] .book-page{background:linear-gradient(135deg, #1e293b 0%, #334155 100%);border:1px solid rgba(100,116,139,0.3);box-shadow:0 0 20px rgba(0,0,0,0.5),inset 0 0 40px rgba(255,255,255,0.02)}.page-content{padding:50px;height:100%;box-sizing:border-box;position:relative;display:flex;flex-direction:column;overflow-y:auto;min-height:100%}.page-left{left:0;top:0;border-radius:0 10px 10px 0;z-index:2}.page-right{left:500px;top:0;border-radius:10px 0 0 10px;z-index:2}.page-bg-left{left:0;top:0;border-radius:0 10px 10px 0;z-index:1;opacity:0;transition:opacity 0.3s ease}.page-bg-right{left:500px;top:0;border-radius:10px 0 0 10px;z-index:1;opacity:0;transition:opacity 0.3s ease}.book.flipping .page-bg-left,.book.flipping .page-bg-right{opacity:1}.page-flipped{transform:rotateY(-180deg)}.book-spine{position:absolute;left:498px;top:0;width:4px;height:600px;background:linear-gradient(to bottom, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.1) 50%, rgba(0,0,0,0.3) 100%);transform:translateZ(10px)}.page-number{position:absolute;bottom:20px;font-size:1rem;opacity:0.5}.page-left .page-number{left:30px}.page-right .page-number{right:30px}.page-bg-left .page-number{left:30px}.page-bg-right .page-number{right:30px}.chapter-page{display:flex;align-items:center;justify-content:center;height:100%;width:100%}.chapter-title{font-size:2.5rem;font-weight:700;margin:0;background:linear-gradient(135deg, #3B82F6 0%, #9333EA 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-align:center}.chapter-content{flex:1;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:rgba(59,130,246,0.3) transparent;padding-right:10px}.chapter-content::-webkit-scrollbar{width:6px}.chapter-content::-webkit-scrollbar-track{background:transparent}.chapter-content::-webkit-scrollbar-thumb{background:rgba(59,130,246,0.3);border-radius:3px}.page-hover-left{position:relative;box-shadow:-5px 0 20px rgba(59,130,246,0.3),0 0 30px rgba(59,130,246,0.1),inset 0 0 60px rgba(59,130,246,0.05)}.page-hover-left::before{content:'';position:absolute;top:50%;left:20px;transform:translateY(-50%);width:0;height:0;border-style:solid;border-width:15px 25px 15px 0;border-color:transparent rgba(59,130,246,0.5) transparent transparent;animation:arrowPulse 1.5s ease-in-out infinite;pointer-events:none}.page-hover-right{position:relative;box-shadow:5px 0 20px rgba(59,130,246,0.3),0 0 30px rgba(59,130,246,0.1),inset 0 0 60px rgba(59,130,246,0.05)}.page-hover-right::before{content:'';position:absolute;top:50%;right:20px;transform:translateY(-50%);width:0;height:0;border-style:solid;border-width:15px 0 15px 25px;border-color:transparent transparent transparent rgba(59,130,246,0.5);animation:arrowPulse 1.5s ease-in-out infinite;pointer-events:none}@keyframes arrowPulse{0%, 100%{opacity:0.5;transform:translateY(-50%) scale(1)}50%{opacity:1;transform:translateY(-50%) scale(1.1)}}.page-left:active,.page-right:active{opacity:0.95;transition:opacity 0.1s ease}.timeline-entry{margin-bottom:2rem;padding-left:2rem;border-left:2px solid rgba(59,130,246,0.3);position:relative}.timeline-entry::before{content:'';position:absolute;left:-6px;top:0;width:10px;height:10px;border-radius:50%;background:#3B82F6;box-shadow:0 0 10px rgba(59,130,246,0.5)}.timeline-date{font-size:1rem;color:#3B82F6;font-weight:600;margin-bottom:0.5rem;display:block}.timeline-title{font-size:1.375rem;font-weight:600;margin-bottom:0.75rem}.timeline-description{opacity:0.8;line-height:1.8;font-size:1.125rem}@keyframes pageFlip{0%{transform:rotateY(0deg)}100%{transform:rotateY(-180deg)}}.page-turning{animation:pageFlip 0.6s cubic-bezier(0.645, 0.045, 0.355, 1) forwards}.book-loading{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);font-size:2rem;color:#3B82F6}.book{position:relative}.book::before{content:'';position:absolute;inset:-20px;background:radial-gradient(ellipse at center, rgba(59,130,246,0.1) 0%, transparent 70%);opacity:0;transition:opacity 0.3s ease;pointer-events:none}.book:hover::before{opacity:1}.book-page{position:relative}.book-page::after{content:'';position:absolute;inset:0;background:linear-gradient(to right, transparent 0%, rgba(0,0,0,0.05) 2%, transparent 5%);pointer-events:none}.page-right::after{background:linear-gradient(to left, transparent 0%, rgba(0,0,0,0.05) 2%, transparent 5%)}.page-content::before{content:'';position:absolute;inset:0;background-image:repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(0,0,0,0.01) 2px, rgba(0,0,0,0.01) 4px);pointer-events:none;opacity:0.5}@media (max-width: 1100px){.book{width:800px;height:500px}.book-page{width:400px;height:500px}.page-right{left:400px}.book-spine{left:398px;height:500px}.page-content{padding:35px}}@media (max-width: 900px){.book{width:700px;height:450px}.book-page{width:350px;height:450px}.page-right{left:350px}.book-spine{left:348px;height:450px}.page-content{padding:30px}.timeline-title{font-size:1.25rem}.timeline-description{font-size:1rem}}@media (max-width: 640px){.book{width:100%;height:100%;max-width:400px;max-height:600px}.book-page{width:100%;max-width:400px;height:100%;position:relative;left:0 !important}.page-right{display:none}.book-spine{display:none}.page-content{padding:20px}}.cheat-modal{display:none;position:fixed;z-index:9999;left:0;top:0;width:100%;height:100%;background-color:rgba(0,0,0,0.8);backdrop-filter:blur(5px);animation:fadeIn 0.3s ease-out}.cheat-modal.show{display:flex;justify-content:center;align-items:center}.cheat-modal-content{background:linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);border:3px solid #00d4ff;border-radius:15px;box-shadow:0 0 30px rgba(0,212,255,0.5),inset 0 0 20px rgba(0,212,255,0.1);max-width:500px;width:90%;max-height:80vh;overflow-y:auto;animation:slideIn 0.3s ease-out;position:relative}.cheat-header{background:linear-gradient(135deg, #0f3460 0%, #0f4c75 100%);padding:1rem 1.5rem;border-bottom:2px solid #00d4ff;border-radius:12px 12px 0 0;display:flex;justify-content:space-between;align-items:center}.cheat-header h3{color:#00d4ff;font-size:1.3rem;font-weight:bold;margin:0;text-shadow:0 0 10px rgba(0,212,255,0.7)}.cheat-close{background:none;border:none;color:#ff6b6b;font-size:1.5rem;cursor:pointer;padding:0.2rem;border-radius:50%;width:30px;height:30px;display:flex;align-items:center;justify-content:center;transition:all 0.2s ease}.cheat-close:hover{background-color:rgba(255,107,107,0.2);transform:scale(1.1)}.cheat-body{padding:1.5rem}.cheat-section{margin-bottom:2rem;padding:1rem;background:rgba(0,212,255,0.05);border:1px solid rgba(0,212,255,0.2);border-radius:10px}.cheat-section:last-child{margin-bottom:0}.cheat-section h4{color:#00d4ff;font-size:1.1rem;margin:0 0 0.5rem 0;font-weight:600}.cheat-section p{color:#b8c5d1;font-size:0.9rem;margin:0 0 1rem 0;line-height:1.4}.cheat-input-group{display:flex;gap:0.5rem;align-items:center}.cheat-input-group input{flex:1;padding:0.7rem;border:2px solid rgba(0,212,255,0.3);border-radius:8px;background:rgba(0,0,0,0.3);color:#fff;font-size:0.9rem;outline:none;transition:border-color 0.2s ease}.cheat-input-group input:focus{border-color:#00d4ff;box-shadow:0 0 10px rgba(0,212,255,0.3)}.cheat-input-group input::placeholder{color:#888}.cheat-button{padding:0.7rem 1.2rem;border:none;border-radius:8px;font-weight:600;font-size:0.9rem;cursor:pointer;transition:all 0.2s ease;text-transform:uppercase;letter-spacing:0.5px}.cheat-button.primary{background:linear-gradient(135deg, #00d4ff 0%, #09c 100%);color:#fff;box-shadow:0 4px 15px rgba(0,212,255,0.3)}.cheat-button.primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,212,255,0.4)}.cheat-button.success{background:linear-gradient(135deg, #4ecdc4 0%, #26a69a 100%);color:#fff;box-shadow:0 4px 15px rgba(78,205,196,0.3)}.cheat-button.success:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(78,205,196,0.4)}.cheat-button.danger{background:linear-gradient(135deg, #ff6b6b 0%, #ee5a52 100%);color:#fff;box-shadow:0 4px 15px rgba(255,107,107,0.3)}.cheat-button.danger:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(255,107,107,0.4)}.cheat-button:active{transform:translateY(0)}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes slideIn{from{transform:translateY(-50px) scale(0.9);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}@media (max-width: 768px){.cheat-modal-content{margin:1rem;width:calc(100% - 2rem)}.cheat-input-group{flex-direction:column}.cheat-input-group input,.cheat-input-group .cheat-button{width:100%}}.d2-inventory-panel{background:linear-gradient(135deg, #1a1a1a 0%, #0d0d0d 100%);border:3px solid #8B7355;border-radius:0;padding:calc(var(--spacing-unit) * 2);box-shadow:inset 0 0 50px rgba(139,115,85,0.3),0 0 20px rgba(0,0,0,0.8);position:relative}.d2-inventory-panel::before{content:'';position:absolute;inset:0;background-image:repeating-linear-gradient(45deg, transparent, transparent 10px, rgba(139,115,85,0.05) 10px, rgba(139,115,85,0.05) 20px);pointer-events:none}.d2-title{color:#D4AF37;text-align:center;font-family:'Exocet', serif;font-size:1.5rem;text-shadow:2px 2px 4px rgba(0,0,0,0.8),0 0 20px rgba(212,175,55,0.5);margin-bottom:calc(var(--spacing-unit) * 2);letter-spacing:2px}.d2-subtitle{color:#B8860B;font-size:1.1rem;text-align:center;margin-bottom:var(--spacing-unit);text-shadow:1px 1px 2px rgba(0,0,0,0.8)}.character-section{background:repeating-linear-gradient(0deg, #1a1a1a 0px, #1a1a1a 2px, #262626 2px, #262626 4px),repeating-linear-gradient(90deg, #1a1a1a 0px, #1a1a1a 2px, #262626 2px, #262626 4px);background-size:4px 4px;border:3px solid #4A3C28;padding:var(--spacing-unit);margin-bottom:calc(var(--spacing-unit) * 1.5);position:relative;box-shadow:inset 0 0 0 1px #8B7355,inset 0 0 20px rgba(139,115,85,0.2);overflow:hidden;width:100%}.character-section::before{content:'';position:absolute;inset:4px;background:repeating-linear-gradient(45deg, transparent, transparent 10px, rgba(139,115,85,0.03) 10px, rgba(139,115,85,0.03) 20px);pointer-events:none}.pixel-text{image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges}.d2-equipment-layout{display:flex;justify-content:center;gap:calc(var(--spacing-unit) * 2);padding:var(--spacing-unit) 0}.equipment-left-panel,.equipment-right-panel{display:flex;flex-direction:column;gap:calc(var(--spacing-unit) * 0.5);justify-content:space-between;height:260px}.equipment-center-panel{display:flex;flex-direction:column;gap:calc(var(--spacing-unit) * 0.5);align-items:center}.center-top,.center-bottom{display:flex;gap:calc(var(--spacing-unit) * 0.5);align-items:center}.equip-slot{position:relative;width:60px;height:60px;background:#1a1a1a;border:2px solid #4A3C28;cursor:pointer;transition:all 0.3s ease}.equip-slot.rect-slot{width:85px;height:170px}.equip-slot.rect-slot .slot-content img{width:100%;height:100%;max-width:none;max-height:none;object-fit:contain}.equip-slot.square-slot{width:85px;height:85px}.equip-slot.square-slot .slot-content img{width:100%;height:100%;object-fit:contain}.equip-slot.small-slot{width:40px;height:40px}.equip-slot.small-slot .slot-bg{background-size:70% 70%}.equip-slot.small-slot .slot-content img{width:28px;height:28px}.equip-slot.small-slot .empty-text{font-size:0.5rem}.equip-slot.belt-slot{width:90px;height:35px}.equip-slot.belt-slot .slot-bg{background-size:80% 60%}.equip-slot.belt-slot .slot-content img{width:100%;height:100%;object-fit:contain}.equip-slot:hover{border-color:#8B7355;box-shadow:0 0 15px rgba(139,115,85,0.6),inset 0 0 15px rgba(139,115,85,0.2);transform:scale(1.05)}.equip-slot.occupied{border-color:#6B5D54}.slot-bg{position:absolute;inset:0;opacity:0.2;background-size:60% 60%;background-position:center;background-repeat:no-repeat}.slot-bg.weapon{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%238B7355" d="M6.92,5H5L14,14L15,13.06M19.96,19.12L19.12,19.96C18.73,20.35 18.1,20.35 17.71,19.96L14.59,16.84L11.91,19.5L10.5,18.09L11.92,16.67L3,7.75V3H7.75L16.67,11.92L18.09,10.5L19.5,11.91L16.83,14.58L19.95,17.7C20.35,18.1 20.35,18.73 19.96,19.12Z"/></svg>')}.slot-bg.helmet{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%238B7355" d="M12,2C13.11,2 14,2.89 14,4C14,4.39 13.89,4.77 13.71,5.1L16,8.74V11H8V8.74L10.29,5.1C10.11,4.77 10,4.39 10,4C10,2.89 10.89,2 12,2M8,16V22H16V16L22,16L12,7L2,16H8Z"/></svg>')}.slot-bg.armor{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%238B7355" d="M12,1L21,5V11C21,16.55 17.16,21.74 12,23C6.84,21.74 3,16.55 3,11V5L12,1Z"/></svg>')}.slot-bg.gloves{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%238B7355" d="M8,2A3,3 0 0,0 5,5V14C5,15.85 6.1,17.47 7.67,18.35C8.69,16.95 10.31,16 12.11,16C13.91,16 15.53,16.95 16.55,18.35C18.12,17.47 19.22,15.85 19.22,14V5A3,3 0 0,0 16.22,2H8Z"/></svg>')}.slot-bg.boots{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%238B7355" d="M2,18V20H12L13.41,21.41C13.78,21.78 14.28,22 14.83,22H21A1,1 0 0,0 22,21A1,1 0 0,0 21,20H14.83L13,18H10V16L6,12V3H8V11L12,15V18H2Z"/></svg>')}.slot-bg.belt{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%238B7355" d="M22,10.5V13.5A1.5,1.5 0 0,1 20.5,15H3.5A1.5,1.5 0 0,1 2,13.5V10.5A1.5,1.5 0 0,1 3.5,9H20.5A1.5,1.5 0 0,1 22,10.5M10,11V13H14V11H10Z"/></svg>')}.slot-bg.amulet{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%238B7355" d="M12,2A3,3 0 0,1 15,5A3,3 0 0,1 12,8A3,3 0 0,1 9,5A3,3 0 0,1 12,2M12,9L16.5,15L12,22L7.5,15L12,9Z"/></svg>')}.slot-bg.ring{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%238B7355" d="M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M12,6A6,6 0 0,1 18,12A6,6 0 0,1 12,18A6,6 0 0,1 6,12A6,6 0 0,1 12,6Z"/></svg>')}.slot-bg.shield{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%238B7355" d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1Z"/></svg>')}.slot-bg.charm{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%238B7355" d="M17.81,4.47C17.73,4.47 17.65,4.45 17.58,4.41C15.66,3.42 14,3 12,3C10,3 8.34,3.42 6.42,4.41C5.96,4.64 5.38,4.42 5.15,3.96C4.92,3.5 5.14,2.92 5.6,2.69C7.65,1.64 9.72,1.15 12,1.15C14.28,1.15 16.35,1.64 18.4,2.69C18.86,2.92 19.08,3.5 18.85,3.96C18.68,4.28 18.35,4.47 17.81,4.47M3.5,9.72C3.4,9.72 3.3,9.69 3.21,9.63C2.76,9.33 2.65,8.71 2.95,8.26C5.12,5.03 8.31,3 12,3C15.69,3 18.88,5.03 21.05,8.26C21.35,8.71 21.24,9.33 20.79,9.63C20.34,9.93 19.72,9.82 19.42,9.37C17.62,6.72 15,5 12,5C9,5 6.38,6.72 4.58,9.37C4.39,9.61 4.1,9.72 3.5,9.72M9.75,21.79C9.62,21.79 9.5,21.74 9.4,21.64C8.53,20.77 8.06,19.84 7.78,18.75C7,16.39 8.18,13.9 10.55,12.9C12.92,11.91 15.47,12.79 16.61,14.93C17.75,17.06 16.94,19.65 14.81,20.8C13.66,21.41 12.5,21.55 11.5,21.41C11.11,21.36 10.73,21.53 10.5,21.85C10.27,22.17 10.22,22.59 10.38,22.96C10.53,23.33 10.88,23.59 11.27,23.64C12.65,23.84 14.24,23.66 15.88,22.75C19.22,20.88 20.57,16.78 18.69,13.44C16.82,10.1 12.72,8.75 9.38,10.63C6.03,12.5 4.68,16.6 6.56,19.94C7,20.73 7.56,21.33 8.15,21.82C8.5,22.12 8.54,22.64 8.24,22.99C8.08,23.19 7.91,23.29 7.75,23.29M12,14A2,2 0 0,0 10,16A2,2 0 0,0 12,18A2,2 0 0,0 14,16A2,2 0 0,0 12,14Z"/></svg>')}.slot-content{position:relative;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4px}.slot-content.empty{opacity:0.3}.slot-content.empty .empty-text{font-size:0.6rem;color:#8B7355;text-shadow:1px 1px 2px rgba(0,0,0,0.8)}.slot-content img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(0,0,0,0.8))}.inventory-section{background:rgba(0,0,0,0.6);border:2px solid #4A3C28;padding:calc(var(--spacing-unit) * 1.5);display:flex;justify-content:center;align-items:center;overflow:hidden;width:100%}.inventory-container{position:relative;display:inline-block}.inventory-grid{display:grid;grid-template-columns:repeat(20, 40px);grid-template-rows:repeat(10, 40px);gap:1px;background:#0d0d0d;padding:4px;border:1px solid #2A2A2A}.inventory-items{position:absolute;top:4px;left:4px;pointer-events:none}.inventory-items>*{pointer-events:auto}.inventory-slot{background:#1a1a1a;border:1px solid #2A2A2A;position:relative;cursor:pointer;transition:all 0.2s ease}.inventory-slot:hover{border-color:#4A3C28;background:#2a2a2a}.inventory-slot.drag-over{border-color:#8B7355;box-shadow:inset 0 0 10px rgba(139,115,85,0.5)}.inventory-slot.occupied{background:#2a2a2a;cursor:default}.item{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;cursor:grab;transition:all 0.2s ease}.item:hover{transform:scale(1.1);z-index:10}.item.dragging{opacity:0.5;cursor:grabbing}.multi-slot-item{position:absolute;background:rgba(0,0,0,0.8);border:2px solid #4A3C28;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:grab;transition:all 0.2s ease;z-index:5}.multi-slot-item:hover{transform:scale(1.05);z-index:20;border-color:#8B7355;box-shadow:0 0 15px rgba(139,115,85,0.6)}.multi-slot-item.dragging{opacity:0.5;cursor:grabbing}.multi-slot-item .item-icon{font-size:1.8rem;filter:drop-shadow(0 2px 4px rgba(0,0,0,0.8))}.multi-slot-item img.item-icon{width:90%;height:90%;max-width:none;margin:0;object-fit:contain}.item-icon{font-size:1.8rem;filter:drop-shadow(0 2px 4px rgba(0,0,0,0.8))}img.item-icon{width:32px;height:32px;object-fit:contain;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges;pointer-events:none}.item-rarity{position:absolute;inset:0;border:2px solid transparent;pointer-events:none;border-radius:4px}.item-rarity.common{border-color:#FFFFFF;box-shadow:inset 0 0 5px rgba(255,255,255,0.2)}.item-rarity.magic{border-color:#4169E1;box-shadow:inset 0 0 8px rgba(65,105,225,0.3),0 0 10px rgba(65,105,225,0.2)}.item-rarity.rare{border-color:#FFD700;box-shadow:inset 0 0 10px rgba(255,215,0,0.3),0 0 12px rgba(255,215,0,0.25)}.item-rarity.legendary{border-color:#FF8C00;box-shadow:inset 0 0 12px rgba(255,140,0,0.4),0 0 15px rgba(255,140,0,0.3)}.item-rarity.unique{border-color:#32CD32;box-shadow:inset 0 0 12px rgba(50,205,50,0.4),0 0 15px rgba(50,205,50,0.3)}.item-rarity.epic{border-color:#8A2BE2;box-shadow:inset 0 0 15px rgba(138,43,226,0.5),0 0 20px rgba(138,43,226,0.4);animation:epicGlow 2s ease-in-out infinite alternate}.item-rarity.epic::before{content:'';position:absolute;inset:-4px;border:1px solid transparent;background:linear-gradient(45deg, rgba(138,43,226,0.3) 0%, rgba(255,105,180,0.3) 50%, rgba(138,43,226,0.3) 100%);border-radius:6px;animation:epicPulse 2s ease-in-out infinite alternate;pointer-events:none}@keyframes epicGlow{from{box-shadow:inset 0 0 15px rgba(138,43,226,0.5),0 0 20px rgba(138,43,226,0.4)}to{box-shadow:inset 0 0 20px rgba(138,43,226,0.7),0 0 25px rgba(138,43,226,0.6)}}@keyframes epicPulse{0%{opacity:0.3;transform:scale(1)}50%{opacity:0.7;transform:scale(1.02)}100%{opacity:0.3;transform:scale(1)}}.item-tooltip{display:none;position:fixed;background:#000;border:2px solid #8B7355;padding:12px;z-index:1000;min-width:200px;pointer-events:none;box-shadow:0 4px 20px rgba(0,0,0,0.9)}.item-tooltip.show{display:block}.tooltip-header{display:flex;justify-content:space-between;margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid #4A3C28}.tooltip-name{font-weight:bold;color:#D4AF37}.tooltip-type{color:#8B7355;font-size:0.8rem}.tooltip-stats{margin-bottom:8px;color:#B8860B;font-size:0.9rem;line-height:1.4}.tooltip-description{color:#7D6D5D;font-size:0.8rem;font-style:italic}.character-section::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background-image:linear-gradient(0deg, transparent 24%, rgba(255,255,255,0.02) 25%, rgba(255,255,255,0.02) 26%, transparent 27%, transparent 74%, rgba(255,255,255,0.02) 75%, rgba(255,255,255,0.02) 76%, transparent 77%, transparent);background-size:50px 50px;pointer-events:none}[data-theme="light"] .d2-inventory-panel{background:linear-gradient(135deg, #F5E6D3 0%, #E9D5B8 100%);border-color:#A0522D;box-shadow:inset 0 0 50px rgba(160,82,45,0.2),0 0 20px rgba(0,0,0,0.2)}[data-theme="light"] .character-section{background:repeating-linear-gradient(0deg, #F5E6D3 0px, #F5E6D3 2px, #E9D5B8 2px, #E9D5B8 4px),repeating-linear-gradient(90deg, #F5E6D3 0px, #F5E6D3 2px, #E9D5B8 2px, #E9D5B8 4px);background-size:4px 4px;border-color:#D2691E}[data-theme="light"] .inventory-section{background:rgba(255,255,255,0.7);border-color:#D2691E}[data-theme="light"] .equip-slot,[data-theme="light"] .inventory-slot{background:#FFF8DC;border-color:#DEB887}[data-theme="light"] .inventory-grid{background:#FAF0E6}[data-theme="light"] .d2-title{color:#8B4513}[data-theme="light"] .empty-text,[data-theme="light"] .item-name{color:#A0522D}@keyframes equip-flash{0%, 100%{box-shadow:0 0 15px rgba(139,115,85,0.6)}50%{box-shadow:0 0 30px #d4af37,inset 0 0 20px rgba(212,175,55,0.5)}}.equip-flash{animation:equip-flash 0.5s ease-out}@keyframes item-pickup{0%{transform:scale(1) rotate(0deg)}50%{transform:scale(1.2) rotate(180deg)}100%{transform:scale(1) rotate(360deg)}}.item-pickup{animation:item-pickup 0.6s ease-out}@keyframes tooltip-show{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.item-tooltip.show{animation:tooltip-show 0.2s ease-out}@keyframes slot-pulse{0%, 100%{border-color:#4A3C28}50%{border-color:#8B7355}}.equip-slot.can-equip{animation:slot-pulse 1s ease-in-out infinite}.gold-display{display:flex;align-items:center;gap:6px;margin-top:8px;padding:4px 8px;background:rgba(0,0,0,0.3);border:1px solid #8B7355;border-radius:4px;box-shadow:inset 0 0 5px rgba(139,115,85,0.2)}.gold-icon{width:16px;height:16px;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges;filter:drop-shadow(0 1px 2px rgba(0,0,0,0.8))}.gold-amount{color:#FFD700;font-weight:bold;font-size:0.9rem;text-shadow:1px 1px 2px rgba(0,0,0,0.8);font-family:'Courier New', monospace}@keyframes gold-increase{0%{transform:scale(1);color:#FFD700}50%{transform:scale(1.1);color:#FFFF00;text-shadow:0 0 10px rgba(255,255,0,0.8)}100%{transform:scale(1);color:#FFD700}}.gold-amount.increase-animation{animation:gold-increase 0.5s ease-out}.falling-coin{position:fixed;width:24px;height:24px;pointer-events:none;z-index:1;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges;filter:drop-shadow(0 0 8px rgba(255,215,0,0.8));animation:coinFall linear, coinGlow ease-in-out alternate infinite}@keyframes coinFall{from{transform:translateY(-20px) translateX(var(--random-x, 0)) rotateY(0deg);opacity:1}to{transform:translateY(100vh) translateX(var(--random-x, 0)) rotateY(720deg);opacity:0}}@keyframes coinGlow{0%{filter:drop-shadow(0 0 8px rgba(255,215,0,0.8)) drop-shadow(0 0 15px rgba(255,215,0,0.4))}50%{filter:drop-shadow(0 0 15px #ff0) drop-shadow(0 0 25px rgba(255,215,0,0.6)) drop-shadow(0 0 35px rgba(255,215,0,0.3))}100%{filter:drop-shadow(0 0 8px rgba(255,215,0,0.8)) drop-shadow(0 0 15px rgba(255,215,0,0.4))}}.coin-particle{position:fixed;width:4px;height:4px;background:radial-gradient(circle, gold 0%, #FFC000 50%, transparent 100%);border-radius:50%;pointer-events:none;z-index:0;animation:particleFloat linear}@keyframes particleFloat{from{transform:translate(0, 0) scale(1);opacity:1}to{transform:translate(var(--particle-x, 0), var(--particle-y, 50px)) scale(0);opacity:0}}@keyframes potion-drink{0%{transform:scale(1) rotate(0deg);opacity:1}30%{transform:scale(1.2) rotate(-15deg)}60%{transform:scale(0.8) rotate(15deg);opacity:0.8}100%{transform:scale(0) rotate(360deg);opacity:0}}@keyframes float-up{0%{transform:translateY(0);opacity:0}10%{opacity:1}90%{opacity:1}100%{transform:translateY(-50px);opacity:0}}.character-section-inner,.inventory-section-inner{transform-origin:center;transition:transform 0.3s ease}.character-section{container-type:inline-size}.inventory-section{container-type:inline-size}@container (max-width: 450px){.d2-equipment-layout{transform:scale(0.7)}}@container (max-width: 380px){.d2-equipment-layout{transform:scale(0.6)}}@container (max-width: 320px){.d2-equipment-layout{transform:scale(0.5)}}@container (max-width: 850px){.inventory-container{transform:scale(0.8)}}@container (max-width: 700px){.inventory-container{transform:scale(0.6)}}@container (max-width: 500px){.inventory-container{transform:scale(0.4)}}@media (max-width: 992px){.d2-inventory-panel{padding:calc(var(--spacing-unit) * 0.5)}.d2-equipment-layout{transform:scale(0.85)}.inventory-container{transform:scale(0.85)}}@media (max-width: 768px){.d2-equipment-layout{transform:scale(0.7)}.inventory-container{transform:scale(0.65)}}@media (max-width: 576px){.d2-equipment-layout{transform:scale(0.55)}.inventory-container{transform:scale(0.5)}}.quest-board-container{display:flex;gap:calc(var(--spacing-unit) * 2);padding:calc(var(--spacing-unit) * 1.5);min-height:600px}.quest-board{flex:1;background:repeating-linear-gradient(90deg, #8B4513 0px, #8B4513 4px, sienna 4px, sienna 8px),linear-gradient(135deg, #D2691E 0%, #8B4513 100%);border:6px solid #654321;border-radius:16px;box-shadow:0 8px 24px rgba(0,0,0,0.6),inset 0 2px 4px rgba(255,255,255,0.1),inset 0 -2px 4px rgba(0,0,0,0.2);position:relative;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges}.quest-board::before{content:'';position:absolute;inset:6px;background:repeating-linear-gradient(0deg, transparent 0px, transparent 2px, rgba(0,0,0,0.1) 2px, rgba(0,0,0,0.1) 4px);border-radius:8px;pointer-events:none}.main-quest-board{border-color:#FFD700;background:repeating-linear-gradient(90deg, #8B4513 0px, #8B4513 4px, sienna 4px, sienna 8px),linear-gradient(135deg, #F4A460 0%, #8B4513 100%)}.main-quest-board::after{content:'';position:absolute;inset:-2px;background:linear-gradient(45deg, rgba(255,215,0,0.3) 0%, transparent 50%, rgba(255,215,0,0.3) 100%);border-radius:20px;z-index:-1;animation:mainQuestGlow 3s ease-in-out infinite alternate}@keyframes mainQuestGlow{from{opacity:0.5}to{opacity:0.8}}.quest-board-header{background:linear-gradient(135deg, #2F1B14 0%, #1A0F0A 100%);border:4px solid #654321;border-radius:12px;margin:12px;padding:calc(var(--spacing-unit) * 1.5);position:relative;box-shadow:inset 0 2px 4px rgba(255,255,255,0.1),inset 0 -2px 4px rgba(0,0,0,0.3)}.board-title-container{display:flex;align-items:center;justify-content:center;gap:calc(var(--spacing-unit) * 1)}.board-icon{font-size:1.8rem;filter:drop-shadow(2px 2px 4px rgba(0,0,0,0.8));animation:iconBounce 2s ease-in-out infinite}@keyframes iconBounce{0%, 100%{transform:translateY(0px)}50%{transform:translateY(-4px)}}.board-title{color:#FFD700;font-size:1.8rem;font-weight:bold;text-shadow:2px 2px 0px #8B4513,4px 4px 8px rgba(0,0,0,0.8);letter-spacing:2px;text-transform:uppercase}.board-decoration{position:absolute;bottom:-6px;left:50%;transform:translateX(-50%);width:60%;height:4px;background:linear-gradient(90deg, transparent 0%, gold 20%, orange 50%, gold 80%, transparent 100%);border-radius:2px}.quest-scroll{padding:calc(var(--spacing-unit) * 1.5);max-height:500px;overflow-y:auto}.quest-scroll::-webkit-scrollbar{width:12px}.quest-scroll::-webkit-scrollbar-track{background:rgba(139,69,19,0.3);border-radius:6px}.quest-scroll::-webkit-scrollbar-thumb{background:linear-gradient(135deg, gold, orange);border-radius:6px;border:2px solid rgba(139,69,19,0.3)}.quest-scroll::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg, orange, #FF8C00)}.quest-item{background:radial-gradient(circle at 20% 30%, rgba(255,248,220,0.1) 0%, transparent 50%),radial-gradient(circle at 80% 70%, rgba(245,245,220,0.1) 0%, transparent 50%),linear-gradient(135deg, beige 0%, #DDBF88 100%);border:3px solid #8B7355;border-radius:12px;padding:calc(var(--spacing-unit) * 1.5);margin-bottom:calc(var(--spacing-unit) * 1);position:relative;cursor:pointer;transition:all 0.3s ease;box-shadow:0 4px 12px rgba(0,0,0,0.3),inset 0 1px 2px rgba(255,255,255,0.2),inset 0 -1px 2px rgba(0,0,0,0.1)}.quest-item::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:repeating-linear-gradient(90deg, transparent 0px, transparent 40px, rgba(139,115,85,0.1) 40px, rgba(139,115,85,0.1) 42px);border-radius:inherit;pointer-events:none}.quest-item:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 8px 20px rgba(0,0,0,0.4),inset 0 1px 2px rgba(255,255,255,0.3),0 0 20px rgba(255,215,0,0.3)}.quest-item[data-stars="1"],.quest-item[data-difficulty="common"]{border-color:#FFFFFF}.quest-item[data-stars="1"] .quest-rank,.quest-item[data-difficulty="common"] .quest-rank{color:#FFFFFF;background:linear-gradient(135deg, #F5F5F5, #E0E0E0);color:#333}.quest-item[data-stars="2"],.quest-item[data-difficulty="uncommon"]{border-color:#32CD32;box-shadow:0 4px 12px rgba(50,205,50,0.2)}.quest-item[data-stars="2"] .quest-rank,.quest-item[data-difficulty="uncommon"] .quest-rank{color:#32CD32;background:linear-gradient(135deg, #32CD32, #228B22);color:white;box-shadow:0 2px 8px rgba(50,205,50,0.3)}.quest-item[data-stars="2"]:hover,.quest-item[data-difficulty="uncommon"]:hover{box-shadow:0 8px 20px rgba(50,205,50,0.4)}.quest-item[data-stars="3"],.quest-item[data-difficulty="rare"]{border-color:#4169E1;box-shadow:0 4px 12px rgba(65,105,225,0.3)}.quest-item[data-stars="3"] .quest-rank,.quest-item[data-difficulty="rare"] .quest-rank{color:#4169E1;background:linear-gradient(135deg, #4169E1, #1E3A8A);color:white;box-shadow:0 2px 8px rgba(65,105,225,0.4)}.quest-item[data-stars="3"] .quest-title,.quest-item[data-difficulty="rare"] .quest-title{color:#4169E1;text-shadow:0 0 5px rgba(65,105,225,0.3)}.quest-item[data-stars="3"]:hover,.quest-item[data-difficulty="rare"]:hover{box-shadow:0 8px 20px rgba(65,105,225,0.5)}.quest-item[data-stars="4"],.quest-item[data-difficulty="epic"]{border-color:#8A2BE2;box-shadow:0 6px 16px rgba(138,43,226,0.3),inset 0 1px 2px rgba(255,255,255,0.2)}.quest-item[data-stars="4"] .quest-rank,.quest-item[data-difficulty="epic"] .quest-rank{color:#8A2BE2;background:linear-gradient(135deg, #8A2BE2, #4C1D95);color:white;box-shadow:0 3px 10px rgba(138,43,226,0.4),0 0 15px rgba(138,43,226,0.2)}.quest-item[data-stars="4"] .quest-title,.quest-item[data-difficulty="epic"] .quest-title{color:#8A2BE2;text-shadow:0 0 8px rgba(138,43,226,0.4)}.quest-item[data-stars="4"]:hover,.quest-item[data-difficulty="epic"]:hover{box-shadow:0 10px 24px rgba(138,43,226,0.5),inset 0 1px 2px rgba(255,255,255,0.3),0 0 25px rgba(138,43,226,0.4)}.quest-item[data-stars="5"],.quest-item[data-difficulty="legendary"]{border-color:#FF8C00;border-width:3px;box-shadow:0 8px 20px rgba(255,140,0,0.4),inset 0 2px 4px rgba(255,255,255,0.2),0 0 20px rgba(255,140,0,0.3);animation:legendaryGlow 3s ease-in-out infinite alternate}.quest-item[data-stars="5"] .quest-rank,.quest-item[data-difficulty="legendary"] .quest-rank{color:#FF8C00;background:linear-gradient(135deg, #FF8C00, #EA580C);color:white;box-shadow:0 4px 12px rgba(255,140,0,0.5),0 0 20px rgba(255,140,0,0.3);font-weight:900}.quest-item[data-stars="5"] .quest-title,.quest-item[data-difficulty="legendary"] .quest-title{background:linear-gradient(45deg, #FF8C00, gold);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 0 10px rgba(255,140,0,0.5)}.quest-item[data-stars="5"]:hover,.quest-item[data-difficulty="legendary"]:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 12px 28px rgba(255,140,0,0.6),inset 0 2px 4px rgba(255,255,255,0.3),0 0 30px rgba(255,140,0,0.5)}.quest-item[data-stars="6"]{border-color:#DC143C;border-width:3px;background:radial-gradient(circle at 20% 30%, rgba(220,20,60,0.05) 0%, transparent 50%),radial-gradient(circle at 80% 70%, rgba(255,140,0,0.05) 0%, transparent 50%),linear-gradient(135deg, beige 0%, #DDBF88 100%);box-shadow:0 10px 24px rgba(220,20,60,0.4),inset 0 2px 4px rgba(255,255,255,0.3),0 0 25px rgba(220,20,60,0.3);animation:epicEnhancedGlow 3.5s ease-in-out infinite alternate}.quest-item[data-stars="6"] .quest-rank{color:#DC143C;background:linear-gradient(135deg, #DC143C, #B91C1C, #FF8C00);background-size:200% 200%;color:white;box-shadow:0 4px 12px rgba(220,20,60,0.6),0 0 25px rgba(220,20,60,0.4);font-weight:900;animation:epicEnhancedRankGlow 2.5s ease-in-out infinite alternate}.quest-item[data-stars="6"] .quest-title{background:linear-gradient(45deg, #DC143C, #FF8C00, gold);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-size:200% 200%;animation:epicEnhancedTextGlow 2.8s ease-in-out infinite alternate}.quest-item[data-stars="6"]:hover{transform:translateY(-3px) scale(1.025);box-shadow:0 14px 32px rgba(220,20,60,0.6),inset 0 2px 4px rgba(255,255,255,0.4),0 0 35px rgba(220,20,60,0.5),0 0 45px rgba(255,140,0,0.3)}.quest-item[data-stars="7"]{border-color:#FFD700;border-width:4px;background:radial-gradient(circle at 15% 20%, rgba(255,215,0,0.08) 0%, transparent 40%),radial-gradient(circle at 85% 80%, rgba(255,140,0,0.08) 0%, transparent 40%),radial-gradient(circle at 50% 50%, rgba(220,20,60,0.05) 0%, transparent 50%),linear-gradient(135deg, beige 0%, #DDBF88 100%);box-shadow:0 12px 28px rgba(255,215,0,0.5),inset 0 3px 6px rgba(255,255,255,0.3),0 0 30px rgba(255,215,0,0.4);animation:legendaryEnhancedGlow 4s ease-in-out infinite alternate}.quest-item[data-stars="7"] .quest-rank{color:#FFD700;background:linear-gradient(135deg, gold, orange, #FF8C00);background-size:200% 200%;color:#2F1B14;box-shadow:0 5px 15px rgba(255,215,0,0.7),0 0 30px rgba(255,215,0,0.5);font-weight:900;letter-spacing:1px;animation:legendaryEnhancedRankGlow 3s ease-in-out infinite alternate;border:2px solid rgba(255,255,255,0.4)}.quest-item[data-stars="7"] .quest-title{background:linear-gradient(45deg, gold, orange, #FF8C00, #DC143C);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-size:300% 300%;animation:legendaryEnhancedTextGlow 3.2s ease-in-out infinite alternate;font-weight:bold}.quest-item[data-stars="7"]:hover{transform:translateY(-4px) scale(1.03);box-shadow:0 16px 36px rgba(255,215,0,0.7),inset 0 3px 6px rgba(255,255,255,0.4),0 0 40px rgba(255,215,0,0.6),0 0 55px rgba(255,140,0,0.4)}.quest-item[data-stars="8"]{border-width:4px;border-style:solid;border-image:linear-gradient(45deg, #FF1493, gold, #8A2BE2, #32CD32, #FF8C00) 4;background:radial-gradient(circle at 10% 20%, rgba(255,20,147,0.1) 0%, transparent 35%),radial-gradient(circle at 90% 80%, rgba(255,215,0,0.1) 0%, transparent 35%),radial-gradient(circle at 50% 10%, rgba(138,43,226,0.08) 0%, transparent 40%),radial-gradient(circle at 20% 90%, rgba(50,205,50,0.08) 0%, transparent 40%),linear-gradient(135deg, beige 0%, #DDBF88 100%);box-shadow:0 14px 32px rgba(255,20,147,0.5),inset 0 3px 6px rgba(255,255,255,0.4),0 0 35px rgba(255,20,147,0.4),0 0 50px rgba(255,215,0,0.3);animation:nearMythicalGlow 4.5s ease-in-out infinite alternate}.quest-item[data-stars="8"] .quest-rank{background:linear-gradient(135deg, #FF1493, gold, #8A2BE2, #32CD32);background-size:300% 300%;color:white;box-shadow:0 6px 18px rgba(255,20,147,0.8),0 0 35px rgba(255,215,0,0.6);font-weight:900;letter-spacing:1px;animation:nearMythicalRankGlow 3.5s ease-in-out infinite alternate;border:2px solid rgba(255,255,255,0.5);min-width:120px}.quest-item[data-stars="8"] .quest-title{background:linear-gradient(45deg, #FF1493, gold, #8A2BE2, #32CD32, #FF8C00);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-size:400% 400%;animation:nearMythicalTextGlow 3.8s ease-in-out infinite alternate;font-weight:bold}.quest-item[data-stars="8"]:hover{transform:translateY(-5px) scale(1.04);box-shadow:0 18px 40px rgba(255,20,147,0.7),inset 0 3px 6px rgba(255,255,255,0.5),0 0 45px rgba(255,20,147,0.6),0 0 65px rgba(255,215,0,0.5)}.quest-item[data-stars="9"],.quest-item[data-difficulty="mythical"]{border-width:5px;border-style:solid;border-image:linear-gradient(45deg, #FF1493 0%, gold 20%, #8A2BE2 40%, #32CD32 60%, #FF8C00 80%, #FF1493 100%) 5;background:radial-gradient(circle at 15% 20%, rgba(255,20,147,0.12) 0%, transparent 30%),radial-gradient(circle at 85% 80%, rgba(255,215,0,0.12) 0%, transparent 30%),radial-gradient(circle at 50% 50%, rgba(138,43,226,0.08) 0%, transparent 40%),radial-gradient(circle at 20% 80%, rgba(50,205,50,0.08) 0%, transparent 40%),radial-gradient(circle at 80% 20%, rgba(255,140,0,0.08) 0%, transparent 40%),linear-gradient(135deg, beige 0%, #DDBF88 100%);box-shadow:0 16px 36px rgba(255,20,147,0.6),inset 0 4px 8px rgba(255,255,255,0.4),0 0 40px rgba(255,20,147,0.5),0 0 60px rgba(255,215,0,0.4),0 0 80px rgba(138,43,226,0.3);animation:mythicalGlow 5s ease-in-out infinite alternate}.quest-item[data-stars="9"] .quest-rank,.quest-item[data-difficulty="mythical"] .quest-rank{background:linear-gradient(135deg, #FF1493, gold, #8A2BE2, #32CD32, #FF8C00);background-size:400% 400%;color:white;box-shadow:0 8px 20px #ff1493,0 0 40px rgba(255,215,0,0.8),0 0 60px rgba(138,43,226,0.6);font-weight:900;letter-spacing:2px;animation:mythicalRankGlow 4s ease-in-out infinite alternate;border:3px solid rgba(255,255,255,0.6);min-width:160px;font-size:0.7rem}.quest-item[data-stars="9"] .quest-title,.quest-item[data-difficulty="mythical"] .quest-title{background:linear-gradient(45deg, #FF1493, gold, #8A2BE2, #32CD32, #FF8C00, #FF1493);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-size:500% 500%;animation:mythicalTextGlow 4.5s ease-in-out infinite alternate;font-weight:bold}.quest-item[data-stars="9"]:hover,.quest-item[data-difficulty="mythical"]:hover{transform:translateY(-6px) scale(1.05);box-shadow:0 20px 44px rgba(255,20,147,0.8),inset 0 4px 8px rgba(255,255,255,0.5),0 0 50px rgba(255,20,147,0.7),0 0 75px rgba(255,215,0,0.6),0 0 100px rgba(138,43,226,0.4)}.quest-item[data-stars="9"]::before,.quest-item[data-difficulty="mythical"]::before{background:repeating-linear-gradient(90deg, transparent 0px, transparent 40px, rgba(255,20,147,0.15) 40px, rgba(255,20,147,0.15) 42px)}@keyframes legendaryGlow{0%, 100%{box-shadow:0 0 5px rgba(255,165,0,0.8),0 0 15px rgba(255,165,0,0.6),0 0 25px rgba(255,165,0,0.4),inset 0 0 10px rgba(255,215,0,0.2)}50%{box-shadow:0 0 15px orange,0 0 25px rgba(255,165,0,0.8),0 0 35px rgba(255,165,0,0.6),inset 0 0 15px rgba(255,215,0,0.3)}}@keyframes legendaryEnhancedGlow{0%, 100%{box-shadow:0 0 8px rgba(255,140,0,0.9),0 0 18px rgba(255,165,0,0.7),0 0 30px rgba(255,140,0,0.5),0 0 40px rgba(255,165,0,0.3),inset 0 0 15px rgba(255,215,0,0.2)}50%{box-shadow:0 0 18px #ff8c00,0 0 28px rgba(255,165,0,0.9),0 0 40px rgba(255,140,0,0.7),0 0 50px rgba(255,165,0,0.5),inset 0 0 20px rgba(255,215,0,0.3)}}@keyframes epicEnhancedGlow{0%, 100%{box-shadow:0 0 12px rgba(138,43,226,0.9),0 0 24px rgba(147,112,219,0.7),0 0 36px rgba(138,43,226,0.5),0 0 48px rgba(147,112,219,0.3),inset 0 0 18px rgba(138,43,226,0.2)}50%{box-shadow:0 0 24px #8a2be2,0 0 36px rgba(147,112,219,0.9),0 0 48px rgba(138,43,226,0.7),0 0 60px rgba(147,112,219,0.5),inset 0 0 24px rgba(138,43,226,0.3)}}@keyframes nearMythicalGlow{0%, 100%{box-shadow:0 0 15px rgba(255,20,147,0.9),0 0 30px rgba(255,215,0,0.7),0 0 45px rgba(138,43,226,0.5),0 0 60px rgba(50,205,50,0.3),inset 0 0 20px rgba(255,140,0,0.2);transform:scale(1)}50%{box-shadow:0 0 30px #ff1493,0 0 45px rgba(255,215,0,0.9),0 0 60px rgba(138,43,226,0.7),0 0 75px rgba(50,205,50,0.5),inset 0 0 25px rgba(255,140,0,0.3);transform:scale(1.02)}}@keyframes legendaryRankGlow{0%, 100%{text-shadow:0 0 5px rgba(255,165,0,0.8),0 0 10px rgba(255,215,0,0.6)}50%{text-shadow:0 0 10px orange,0 0 15px rgba(255,215,0,0.8)}}@keyframes legendaryEnhancedRankGlow{0%, 100%{text-shadow:0 0 8px rgba(255,140,0,0.9),0 0 15px rgba(255,215,0,0.7)}50%{text-shadow:0 0 15px #ff8c00,0 0 20px rgba(255,215,0,0.9)}}@keyframes epicEnhancedRankGlow{0%, 100%{text-shadow:0 0 10px rgba(138,43,226,0.9),0 0 18px rgba(147,112,219,0.7)}50%{text-shadow:0 0 18px #8a2be2,0 0 25px rgba(147,112,219,0.9)}}@keyframes nearMythicalRankGlow{0%, 100%{text-shadow:0 0 12px rgba(255,20,147,0.9),0 0 20px rgba(255,215,0,0.7),0 0 25px rgba(138,43,226,0.5)}50%{text-shadow:0 0 20px #ff1493,0 0 28px rgba(255,215,0,0.9),0 0 35px rgba(138,43,226,0.7)}}@keyframes legendaryTextGlow{0%, 100%{color:rgba(255,165,0,0.9)}50%{color:gold}}@keyframes legendaryEnhancedTextGlow{0%, 100%{color:#ff8c00}50%{color:gold}}@keyframes epicEnhancedTextGlow{0%, 100%{color:#8a2be2}50%{color:#9370db}}@keyframes nearMythicalTextGlow{0%{color:#ff1493}25%{color:gold}50%{color:#8a2be2}75%{color:#32cd32}100%{color:#ff1493}}.quest-item.active{border-color:#FFD700;box-shadow:0 6px 16px rgba(255,215,0,0.4),inset 0 1px 2px rgba(255,255,255,0.3),0 0 16px rgba(255,215,0,0.6)}.quest-item.active::after{content:'';position:absolute;top:-3px;left:-3px;right:-3px;bottom:-3px;border:2px solid rgba(255,215,0,0.5);border-radius:15px;animation:activeQuestGlow 2s ease-in-out infinite alternate}@keyframes activeQuestGlow{from{opacity:0.5}to{opacity:1}}@keyframes mythicalGlow{0%{box-shadow:0 8px 24px rgba(255,20,147,0.4),inset 0 2px 4px rgba(255,255,255,0.3),0 0 30px rgba(255,20,147,0.3)}50%{box-shadow:0 8px 24px rgba(255,20,147,0.6),inset 0 2px 4px rgba(255,255,255,0.3),0 0 40px rgba(255,20,147,0.5),0 0 60px rgba(255,215,0,0.2)}100%{box-shadow:0 8px 24px rgba(255,20,147,0.4),inset 0 2px 4px rgba(255,255,255,0.3),0 0 30px rgba(255,20,147,0.3)}}@keyframes mythicalTextGlow{0%{background-position:0% 50%;text-shadow:0 0 5px rgba(255,20,147,0.6),0 0 10px rgba(255,215,0,0.4)}50%{background-position:100% 50%;text-shadow:0 0 8px rgba(255,20,147,0.8),0 0 15px rgba(255,215,0,0.6),0 0 20px rgba(138,43,226,0.4)}100%{background-position:0% 50%;text-shadow:0 0 5px rgba(255,20,147,0.6),0 0 10px rgba(255,215,0,0.4)}}@keyframes mythicalRankGlow{0%{background-position:0% 50%;box-shadow:0 0 10px rgba(255,20,147,0.6),0 0 20px rgba(255,215,0,0.4),inset 0 1px 2px rgba(255,255,255,0.3)}50%{background-position:100% 50%;box-shadow:0 0 15px rgba(255,20,147,0.8),0 0 25px rgba(255,215,0,0.6),0 0 35px rgba(138,43,226,0.4),inset 0 1px 2px rgba(255,255,255,0.4)}100%{background-position:0% 50%;box-shadow:0 0 10px rgba(255,20,147,0.6),0 0 20px rgba(255,215,0,0.4),inset 0 1px 2px rgba(255,255,255,0.3)}}.quest-item.completed{background:radial-gradient(circle at 20% 30%, rgba(144,238,144,0.1) 0%, transparent 50%),radial-gradient(circle at 80% 70%, rgba(152,251,152,0.1) 0%, transparent 50%),linear-gradient(135deg, #F0FFF0 0%, #E0F2E0 100%);border-color:#32CD32;opacity:0.8}.quest-item.completed .quest-title,.quest-item.completed .quest-description{text-decoration:line-through;opacity:0.7}.quest-rank{position:absolute;top:-8px;right:12px;background:linear-gradient(135deg, #2F1B14 0%, #1A0F0A 100%);color:#FFD700;padding:4px 12px;border-radius:20px;border:2px solid #654321;font-weight:bold;font-size:0.9rem;text-shadow:1px 1px 2px rgba(0,0,0,0.8);box-shadow:0 2px 6px rgba(0,0,0,0.4);z-index:2;display:flex;align-items:center;gap:2px}.star-icon{width:12px;height:12px;filter:drop-shadow(1px 1px 2px rgba(0,0,0,0.5))}.quest-rank.completed-stamp{background:linear-gradient(135deg, #32CD32, #228B22);color:white;font-size:1.2rem;animation:completedStamp 0.5s ease-out}.quest-rank.mythical-rank{background:linear-gradient(135deg, #FF1493, #8A2BE2, gold);background-size:200% 200%;color:white;font-size:0.7rem;padding:6px 14px;font-weight:900;letter-spacing:1px;animation:mythicalRankGlow 3s ease-in-out infinite alternate;box-shadow:0 0 10px rgba(255,20,147,0.6),0 0 20px rgba(255,215,0,0.4),inset 0 1px 2px rgba(255,255,255,0.3);border:2px solid rgba(255,255,255,0.3);min-width:140px;text-align:center}@keyframes completedStamp{0%{transform:scale(0) rotate(-180deg)}50%{transform:scale(1.2) rotate(-10deg)}100%{transform:scale(1) rotate(0deg)}}.quest-content{margin-left:0}.quest-title{color:#2F1B14;font-size:1.2rem;font-weight:bold;margin-bottom:calc(var(--spacing-unit) * 0.5);text-shadow:1px 1px 2px rgba(255,255,255,0.5);line-height:1.4}.quest-description{color:#5D4E37;font-size:0.95rem;line-height:1.5;margin-bottom:calc(var(--spacing-unit) * 1);text-shadow:0px 1px 1px rgba(255,255,255,0.3)}.quest-rewards{display:flex;gap:calc(var(--spacing-unit) * 1);margin-bottom:calc(var(--spacing-unit) * 1);flex-wrap:wrap}.reward-item{background:linear-gradient(135deg, gold, orange);color:#2F1B14;padding:4px 10px;border-radius:16px;font-size:0.8rem;font-weight:bold;text-shadow:1px 1px 1px rgba(255,255,255,0.5);box-shadow:0 2px 4px rgba(0,0,0,0.3),inset 0 1px 1px rgba(255,255,255,0.3);border:1px solid #B8860B}.reward-item.completed{background:linear-gradient(135deg, #90EE90, #32CD32);text-decoration:line-through;opacity:0.8}.quest-progress-container{display:flex;align-items:center;gap:calc(var(--spacing-unit) * 0.5)}.quest-progress{flex:1;height:12px;background:linear-gradient(135deg, #8B4513 0%, #654321 100%);border:2px solid #2F1B14;border-radius:8px;overflow:hidden;box-shadow:inset 0 2px 4px rgba(0,0,0,0.5)}.progress-bar{height:100%;background:linear-gradient(90deg, #32CD32 0%, #90EE90 50%, #32CD32 100%);border-radius:4px;transition:width 0.5s ease;position:relative}.progress-bar::after{content:'';position:absolute;top:0;left:0;right:0;height:50%;background:linear-gradient(90deg, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0.1) 50%, rgba(255,255,255,0.3) 100%);border-radius:4px 4px 0 0}.mythical-progress{border:3px solid #FF1493;background:linear-gradient(135deg, #2F1B14 0%, #654321 100%);box-shadow:inset 0 2px 4px rgba(0,0,0,0.6),0 0 15px rgba(255,20,147,0.4);animation:mythicalProgressGlow 2s ease-in-out infinite alternate}.mythical-bar{background:linear-gradient(90deg, #FF1493 0%, gold 25%, #8A2BE2 50%, gold 75%, #FF1493 100%);background-size:200% 100%;animation:mythicalBarFlow 4s linear infinite, mythicalBarGlow 2s ease-in-out infinite alternate;position:relative}.mythical-bar::after{background:linear-gradient(90deg, rgba(255,255,255,0.4) 0%, rgba(255,255,255,0.2) 50%, rgba(255,255,255,0.4) 100%)}.mythical-bar::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(90deg, rgba(255,20,147,0.3) 0%, rgba(255,215,0,0.3) 50%, rgba(138,43,226,0.3) 100%);border-radius:inherit;animation:mythicalBarSparkle 1.5s ease-in-out infinite}@keyframes mythicalProgressGlow{0%{box-shadow:inset 0 2px 4px rgba(0,0,0,0.6),0 0 15px rgba(255,20,147,0.4)}100%{box-shadow:inset 0 2px 4px rgba(0,0,0,0.6),0 0 25px rgba(255,20,147,0.6),0 0 35px rgba(255,215,0,0.3)}}@keyframes mythicalBarFlow{0%{background-position:-200% 0}100%{background-position:200% 0}}@keyframes mythicalBarGlow{0%{filter:brightness(1) saturate(1)}100%{filter:brightness(1.2) saturate(1.3)}}@keyframes mythicalBarSparkle{0%, 100%{opacity:0.3;transform:scaleX(1)}50%{opacity:0.7;transform:scaleX(1.05)}}.progress-text{color:#2F1B14;font-weight:bold;font-size:0.9rem;text-shadow:1px 1px 1px rgba(255,255,255,0.5);min-width:40px}@media (max-width: 768px){.quest-board-container{flex-direction:column;gap:calc(var(--spacing-unit) * 1);padding:var(--spacing-unit)}.quest-scroll{max-height:400px}.board-title{font-size:1.4rem}.quest-title{font-size:1rem}.quest-rewards{gap:calc(var(--spacing-unit) * 0.5)}}[data-theme="light"] .quest-board{background:repeating-linear-gradient(90deg, tan 0px, tan 4px, #DDD8C0 4px, #DDD8C0 8px),linear-gradient(135deg, wheat 0%, tan 100%);border-color:#8B7355}[data-theme="light"] .quest-board-header{background:linear-gradient(135deg, beige 0%, #E6E6FA 100%);border-color:#8B7355}[data-theme="light"] .board-title{color:#8B4513;text-shadow:1px 1px 0px beige,2px 2px 4px rgba(0,0,0,0.3)}[data-theme="light"] .quest-item{background:radial-gradient(circle at 20% 30%, rgba(255,248,220,0.3) 0%, transparent 50%),radial-gradient(circle at 80% 70%, rgba(245,245,220,0.3) 0%, transparent 50%),linear-gradient(135deg, #FFFAF0 0%, beige 100%);border-color:#D2B48C}[data-theme="light"] .quest-title{color:#8B4513}[data-theme="light"] .quest-description{color:#654321}@keyframes progressGlow{0%, 100%{box-shadow:inset 0 2px 4px rgba(0,0,0,0.5)}50%{box-shadow:inset 0 2px 4px rgba(0,0,0,0.5),0 0 15px rgba(50,205,50,0.6)}}@keyframes completedBubble{0%{opacity:0;transform:translate(-50%, -50%) scale(0.3)}10%{opacity:1;transform:translate(-50%, -50%) scale(1.1)}20%{transform:translate(-50%, -50%) scale(1)}80%{opacity:1;transform:translate(-50%, -50%) scale(1)}100%{opacity:0;transform:translate(-50%, -50%) scale(0.9) translateY(-20px)}}.achievements-hall{position:relative;width:100%;min-height:100vh;background:linear-gradient(135deg, #2d1810, #1a0f09);overflow:visible;display:flex;justify-content:center;align-items:center;transition:background 1s ease;background-clip:padding-box;box-shadow:inset 0 0 0 4px rgba(255,215,0,0.8),inset 0 0 0 8px rgba(255,215,0,0.4),inset 0 0 20px rgba(255,215,0,0.3),0 0 0 2px gold,0 0 0 6px rgba(255,215,0,0.6),0 0 0 10px rgba(255,215,0,0.3),0 0 30px rgba(255,215,0,0.5),0 0 60px rgba(255,215,0,0.3);animation:borderGlow 4s ease-in-out infinite alternate}.achievements-hall::before{content:'';position:absolute;top:-12px;left:-12px;right:-12px;bottom:-12px;background:linear-gradient(45deg, transparent 40%, rgba(255,215,0,0.8) 50%, transparent 60%),linear-gradient(-45deg, transparent 40%, rgba(255,215,0,0.8) 50%, transparent 60%),linear-gradient(135deg, transparent 40%, rgba(255,215,0,0.8) 50%, transparent 60%),linear-gradient(-135deg, transparent 40%, rgba(255,215,0,0.8) 50%, transparent 60%);background-size:100px 100px;background-position:0 0, 0 0, 100% 100%, 100% 100%;background-repeat:no-repeat;z-index:-10;animation:cornerShine 3s ease-in-out infinite}.achievements-hall::after{content:'';position:absolute;top:-5px;left:-5px;right:-5px;bottom:-5px;background:radial-gradient(circle at 20% 20%, rgba(255,215,0,0.6) 2px, transparent 3px),radial-gradient(circle at 80% 20%, rgba(255,215,0,0.6) 2px, transparent 3px),radial-gradient(circle at 20% 80%, rgba(255,215,0,0.6) 2px, transparent 3px),radial-gradient(circle at 80% 80%, rgba(255,215,0,0.6) 2px, transparent 3px),radial-gradient(circle at 50% 10%, rgba(255,215,0,0.4) 1px, transparent 2px),radial-gradient(circle at 50% 90%, rgba(255,215,0,0.4) 1px, transparent 2px),radial-gradient(circle at 10% 50%, rgba(255,215,0,0.4) 1px, transparent 2px),radial-gradient(circle at 90% 50%, rgba(255,215,0,0.4) 1px, transparent 2px);background-size:100% 100%;z-index:-20;animation:sparkle 2s ease-in-out infinite}@keyframes borderGlow{0%{box-shadow:inset 0 0 0 4px rgba(255,215,0,0.6),inset 0 0 0 8px rgba(255,215,0,0.3),inset 0 0 20px rgba(255,215,0,0.2),0 0 0 2px gold,0 0 0 6px rgba(255,215,0,0.4),0 0 0 10px rgba(255,215,0,0.2),0 0 20px rgba(255,215,0,0.3),0 0 40px rgba(255,215,0,0.2)}100%{box-shadow:inset 0 0 0 4px gold,inset 0 0 0 8px rgba(255,215,0,0.6),inset 0 0 20px rgba(255,215,0,0.4),0 0 0 2px gold,0 0 0 6px rgba(255,215,0,0.8),0 0 0 10px rgba(255,215,0,0.5),0 0 40px rgba(255,215,0,0.6),0 0 80px rgba(255,215,0,0.4)}}@keyframes cornerShine{0%, 100%{opacity:0.3;transform:scale(0.8)}50%{opacity:0.8;transform:scale(1.2)}}@keyframes sparkle{0%, 100%{opacity:0.4}50%{opacity:1}}.achievements-hall.doors-opening{background:radial-gradient(circle at center, rgba(255,215,0,0.4) 0%, rgba(255,215,0,0.2) 30%, rgba(255,215,0,0.1) 50%, rgba(45,24,16,0.8) 70%, #1a0f09 100%),linear-gradient(135deg, #2d1810, #1a0f09);animation:goldenGlow 3s ease-out, borderGlowIntense 3s ease-out;box-shadow:inset 0 0 0 6px gold,inset 0 0 0 12px rgba(255,215,0,0.8),inset 0 0 40px rgba(255,215,0,0.6),0 0 0 3px gold,0 0 0 8px gold,0 0 0 15px rgba(255,215,0,0.7),0 0 60px rgba(255,215,0,0.8),0 0 120px rgba(255,215,0,0.6),0 0 200px rgba(255,215,0,0.4)}.holy-light-particles{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:150;opacity:0;transition:opacity 0.5s ease}.holy-light-particles.active{opacity:1}.light-ray{position:absolute;background:linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.9) 10%, rgba(255,215,0,0.8) 50%, rgba(255,255,255,0.9) 90%, transparent 100%);transform-origin:left center;animation:lightRayBurst 2s ease-out}.light-ray:nth-child(1){top:30%;left:50%;width:200%;height:4px;transform:translate(-50%, -50%) rotate(-15deg);animation-delay:0s}.light-ray:nth-child(2){top:50%;left:50%;width:250%;height:6px;transform:translate(-50%, -50%) rotate(0deg);animation-delay:0.2s}.light-ray:nth-child(3){top:70%;left:50%;width:200%;height:4px;transform:translate(-50%, -50%) rotate(15deg);animation-delay:0.1s}.light-ray:nth-child(4){top:40%;left:50%;width:180%;height:3px;transform:translate(-50%, -50%) rotate(-30deg);animation-delay:0.3s}.light-ray:nth-child(5){top:60%;left:50%;width:180%;height:3px;transform:translate(-50%, -50%) rotate(30deg);animation-delay:0.15s}@keyframes lightRayBurst{0%{opacity:0;transform:translate(-50%, -50%) rotate(var(--rotation, 0deg)) scaleX(0);filter:blur(10px)}30%{opacity:1;transform:translate(-50%, -50%) rotate(var(--rotation, 0deg)) scaleX(1);filter:blur(2px)}100%{opacity:0;transform:translate(-50%, -50%) rotate(var(--rotation, 0deg)) scaleX(1.2);filter:blur(0px)}}.particle-cloud{position:absolute;width:8px;height:8px;background:linear-gradient(45deg, gold 0%, gold 25%, #FFF 25%, #FFF 50%, gold 50%, gold 75%, #FFF 75%, #FFF 100%);background-size:4px 4px;border:1px solid rgba(255,255,255,0.8);box-shadow:0 0 4px rgba(255,215,0,0.8),inset 0 0 2px rgba(255,255,255,0.6);image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges;top:50%;left:50%}.particle-cloud:nth-child(6){animation:pixelParticleShoot 2.5s ease-out;animation-delay:0.1s;--angle: 0deg;--distance: 150px}.particle-cloud:nth-child(7){animation:pixelParticleShoot 2.5s ease-out;animation-delay:0.2s;--angle: 30deg;--distance: 180px}.particle-cloud:nth-child(8){animation:pixelParticleShoot 2.5s ease-out;animation-delay:0.15s;--angle: 60deg;--distance: 160px}.particle-cloud:nth-child(9){animation:pixelParticleShoot 2.5s ease-out;animation-delay:0.3s;--angle: 90deg;--distance: 200px}.particle-cloud:nth-child(10){animation:pixelParticleShoot 2.5s ease-out;animation-delay:0.25s;--angle: 120deg;--distance: 170px}.particle-cloud:nth-child(11){animation:pixelParticleShoot 2.5s ease-out;animation-delay:0.35s;--angle: 150deg;--distance: 190px}.particle-cloud:nth-child(12){animation:pixelParticleShoot 2.5s ease-out;animation-delay:0.4s;--angle: 180deg;--distance: 160px}.particle-cloud:nth-child(13){animation:pixelParticleShoot 2.5s ease-out;animation-delay:0.3s;--angle: 210deg;--distance: 180px}.particle-cloud:nth-child(14){animation:pixelParticleShoot 2.5s ease-out;animation-delay:0.2s;--angle: 240deg;--distance: 150px}.particle-cloud:nth-child(15){animation:pixelParticleShoot 2.5s ease-out;animation-delay:0.45s;--angle: 270deg;--distance: 200px}.particle-cloud:nth-child(16){animation:pixelParticleShoot 2.5s ease-out;animation-delay:0.35s;--angle: 300deg;--distance: 170px}.particle-cloud:nth-child(17){animation:pixelParticleShoot 2.5s ease-out;animation-delay:0.1s;--angle: 330deg;--distance: 160px}.particle-cloud:nth-child(18){animation:pixelParticleShoot 2.5s ease-out;animation-delay:0.5s;--angle: 45deg;--distance: 140px}.particle-cloud:nth-child(19){animation:pixelParticleShoot 2.5s ease-out;animation-delay:0.4s;--angle: 135deg;--distance: 180px}.particle-cloud:nth-child(20){animation:pixelParticleShoot 2.5s ease-out;animation-delay:0.6s;--angle: 225deg;--distance: 160px}@keyframes pixelParticleShoot{0%{opacity:0;transform:translate(-50%, -50%) rotate(0deg) translateX(0px) scale(0)}10%{opacity:1;transform:translate(-50%, -50%) rotate(var(--angle)) translateX(20px) scale(1)}70%{opacity:0.9;transform:translate(-50%, -50%) rotate(var(--angle)) translateX(var(--distance)) scale(1.2)}100%{opacity:0;transform:translate(-50%, -50%) rotate(var(--angle)) translateX(calc(var(--distance) + 50px)) scale(0.5)}}.center-burst{position:absolute;top:50%;left:50%;width:300px;height:300px;transform:translate(-50%, -50%);background:radial-gradient(circle, rgba(255,255,255,0.9) 0%, rgba(255,215,0,0.7) 30%, rgba(255,215,0,0.3) 60%, transparent 100%);border-radius:50%;animation:centerBurstEffect 2.5s ease-out}@keyframes centerBurstEffect{0%{opacity:0;transform:translate(-50%, -50%) scale(0);filter:blur(20px)}30%{opacity:1;transform:translate(-50%, -50%) scale(0.8);filter:blur(10px)}70%{opacity:0.7;transform:translate(-50%, -50%) scale(1.5);filter:blur(5px)}100%{opacity:0;transform:translate(-50%, -50%) scale(2);filter:blur(0px)}}@keyframes borderGlowIntense{0%{box-shadow:inset 0 0 0 6px rgba(255,215,0,0.8),inset 0 0 0 12px rgba(255,215,0,0.6),inset 0 0 40px rgba(255,215,0,0.4),0 0 0 3px gold,0 0 0 8px rgba(255,215,0,0.8),0 0 0 15px rgba(255,215,0,0.5),0 0 60px rgba(255,215,0,0.6),0 0 120px rgba(255,215,0,0.4),0 0 200px rgba(255,215,0,0.2)}50%{box-shadow:inset 0 0 0 8px gold,inset 0 0 0 16px rgba(255,215,0,0.9),inset 0 0 60px rgba(255,215,0,0.8),0 0 0 4px gold,0 0 0 12px gold,0 0 0 20px rgba(255,215,0,0.8),0 0 100px gold,0 0 180px rgba(255,215,0,0.8),0 0 300px rgba(255,215,0,0.6)}100%{box-shadow:inset 0 0 0 6px gold,inset 0 0 0 12px rgba(255,215,0,0.8),inset 0 0 40px rgba(255,215,0,0.6),0 0 0 3px gold,0 0 0 8px gold,0 0 0 15px rgba(255,215,0,0.7),0 0 60px rgba(255,215,0,0.8),0 0 120px rgba(255,215,0,0.6),0 0 200px rgba(255,215,0,0.4)}}@keyframes goldenGlow{0%{filter:brightness(1)}50%{filter:brightness(1.5) saturate(1.3);box-shadow:inset 0 0 100px rgba(255,215,0,0.3)}100%{filter:brightness(1.2);box-shadow:inset 0 0 50px rgba(255,215,0,0.2)}}.door-container{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;z-index:200;perspective:1000px;transition:all 0.3s ease}.door-container:hover{filter:brightness(1.1)}.door-container:active{transform:scale(0.98);transition:transform 0.1s ease}.door{width:50%;height:100%;position:relative;transition:transform 2.5s cubic-bezier(0.25, 0.46, 0.45, 0.94)}.door-left{background:linear-gradient(to right, #8B4513, sienna, #8B4513);border-right:3px solid #654321;transform-origin:left center}.door-right{background:linear-gradient(to left, #8B4513, sienna, #8B4513);border-left:3px solid #654321;transform-origin:right center}.door-panel{width:100%;height:100%;position:relative;background:radial-gradient(ellipse at 30% 20%, rgba(139,69,19,0.3) 0%, transparent 50%),linear-gradient(45deg, transparent 20%, rgba(160,82,45,0.1) 21%, rgba(160,82,45,0.1) 25%, transparent 26%),linear-gradient(-45deg, transparent 20%, rgba(160,82,45,0.1) 21%, rgba(160,82,45,0.1) 25%, transparent 26%)}.door-panel::before{content:'';position:absolute;top:10%;left:10%;right:10%;bottom:10%;border:4px solid #654321;border-radius:8px;box-shadow:inset 0 0 20px rgba(0,0,0,0.3)}.door-handle{position:absolute;width:12px;height:60px;background:linear-gradient(45deg, gold, orange, gold);border-radius:6px;top:50%;transform:translateY(-50%);box-shadow:0 2px 4px rgba(0,0,0,0.3),inset 0 1px 2px rgba(255,255,255,0.3)}.door-left .door-handle{right:20px}.door-right .door-handle{left:20px}.door-container.doors-opening .door-left{transform:translateX(-85%)}.door-container.doors-opening .door-right{transform:translateX(85%)}.achievement-bookshelf{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;opacity:0;transition:opacity 1.5s ease-in-out;z-index:50;background:linear-gradient(135deg, #3E2723 0%, #4A2C2A 20%, #5D4037 35%, #3E2723 50%, #2E1A17 70%, #4A2C2A 85%, #1D0F0D 100%);background-image:repeating-linear-gradient(0deg, transparent 0px, rgba(62,39,35,0.3) 1px, transparent 2px, transparent 6px),repeating-linear-gradient(90deg, transparent 0px, rgba(74,44,42,0.2) 1px, transparent 3px, transparent 12px),radial-gradient(circle at 20% 30%, rgba(93,64,55,0.1) 1px, transparent 2px),radial-gradient(circle at 70% 60%, rgba(46,26,23,0.15) 1px, transparent 2px)}.bookshelf-visible .achievement-bookshelf{opacity:1}.bookshelf-early-show .achievement-bookshelf{opacity:0.3;transition:opacity 0.8s ease-in-out}.bookshelf-bg{max-width:100%;max-height:100%;width:auto;height:auto;box-shadow:0 0 50px rgba(255,215,0,0.3);cursor:pointer;object-fit:contain;background-color:#1a0f09;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges}.achievement-hotspot{cursor:pointer}.achievement-hover-effect{position:absolute;pointer-events:none;z-index:1000;border-radius:8px;background:radial-gradient(ellipse at center, rgba(255,255,255,0.8) 0%, rgba(255,215,0,0.6) 30%, rgba(255,255,255,0.4) 60%, transparent 100%);animation:hotspotPulse 1.5s ease-in-out infinite;mix-blend-mode:overlay}.achievement-hover-border{position:absolute;pointer-events:none;z-index:999;background:linear-gradient(45deg, transparent 0%, transparent 40%, rgba(255,255,255,0.9) 50%, transparent 60%, transparent 100%);background-size:8px 8px;animation:pixelBorderFlow 2s linear infinite}@keyframes hotspotPulse{0%{opacity:0.3;transform:scale(0.95);box-shadow:0 0 10px rgba(255,255,255,0.8),0 0 20px rgba(255,215,0,0.6),inset 0 0 10px rgba(255,255,255,0.4)}50%{opacity:0.9;transform:scale(1.05);box-shadow:0 0 20px #fff,0 0 40px rgba(255,215,0,0.8),inset 0 0 15px rgba(255,255,255,0.6)}100%{opacity:0.3;transform:scale(0.95);box-shadow:0 0 10px rgba(255,255,255,0.8),0 0 20px rgba(255,215,0,0.6),inset 0 0 10px rgba(255,255,255,0.4)}}@keyframes pixelBorderFlow{0%{background-position:0 0}100%{background-position:8px 8px}}.achievement-tooltip{position:fixed;background:linear-gradient(135deg, #2a1810, #1f140a);border:3px solid #FFD700;border-radius:12px;padding:16px;min-width:280px;max-width:350px;box-shadow:0 8px 32px rgba(0,0,0,0.6),inset 0 1px 0 rgba(255,215,0,0.2);z-index:1100;opacity:0;transform:scale(0.8);transition:all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);pointer-events:none}.achievement-tooltip::before,.achievement-tooltip::after{display:none}.achievement-tooltip.tooltip-top::before{content:'';display:block;position:absolute;bottom:-10px;left:15px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid #FFD700}.achievement-tooltip.tooltip-top::after{content:'';display:block;position:absolute;bottom:-7px;left:17px;width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid #2a1810}.achievement-tooltip.tooltip-bottom::before{content:'';display:block;position:absolute;top:-10px;left:15px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:10px solid #FFD700}.achievement-tooltip.tooltip-bottom::after{content:'';display:block;position:absolute;top:-7px;left:17px;width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-bottom:8px solid #2a1810}.achievement-tooltip.show{opacity:1;transform:scale(1);pointer-events:auto}.tooltip-header{display:flex;align-items:center;gap:10px;margin-bottom:12px}.tooltip-icon{width:96px;height:96px;display:flex;align-items:center;justify-content:center;font-size:2rem;text-shadow:0 0 10px currentColor}.tooltip-icon img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 0 16px gold);border-radius:12px;border:5px solid #FFD700;box-shadow:0 0 0 2px orange,0 0 0 4px rgba(255,69,0,0.6),0 0 25px rgba(255,215,0,0.8),inset 0 0 10px rgba(255,255,255,0.2);image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges;animation:tooltipIconGlow 3s ease-in-out infinite alternate}@keyframes tooltipIconGlow{0%{box-shadow:0 0 0 2px orange,0 0 0 4px rgba(255,69,0,0.6),0 0 25px rgba(255,215,0,0.8),inset 0 0 10px rgba(255,255,255,0.2)}100%{box-shadow:0 0 0 2px orange,0 0 0 4px rgba(255,69,0,0.8),0 0 35px gold,inset 0 0 15px rgba(255,255,255,0.4)}}.tooltip-title{font-family:'Courier New', monospace;font-size:1.2rem;font-weight:bold;color:#FFD700;text-shadow:0 0 10px rgba(255,215,0,0.5)}.tooltip-description{color:#E8E8E8;line-height:1.5;margin-bottom:12px;font-size:0.95rem}.tooltip-date{font-size:0.8rem;color:#7F8C8D;text-align:right;margin-top:8px;font-style:italic}.golden-burst-effect{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:300;opacity:0;transition:opacity 0.3s ease;overflow:hidden}.golden-burst-effect.active{opacity:1}.intense-golden-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(ellipse at center, rgba(255,215,0,0.95) 0%, rgba(255,255,0,0.8) 15%, rgba(255,215,0,0.6) 30%, rgba(255,215,0,0.4) 50%, rgba(255,215,0,0.2) 70%, rgba(255,215,0,0.1) 85%, transparent 100%);animation:intensePulse 3s ease-out;filter:blur(1px)}.solar-ray{position:absolute;top:50%;left:50%;background:linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.3) 2%, rgba(255,215,0,0.9) 8%, #fff 50%, rgba(255,215,0,0.9) 92%, rgba(255,255,255,0.3) 98%, transparent 100%);transform-origin:center center;width:300%;height:4px;box-shadow:0 0 15px rgba(255,215,0,0.9),0 0 30px rgba(255,215,0,0.7),0 0 45px rgba(255,215,0,0.5),0 0 60px rgba(255,215,0,0.3);animation:solarExplosion 3s ease-out}.solar-ray:nth-child(2){transform:translate(-50%, -50%) rotate(0deg);animation-delay:0s;height:5px}.solar-ray:nth-child(3){transform:translate(-50%, -50%) rotate(45deg);animation-delay:0.2s;height:4px}.solar-ray:nth-child(4){transform:translate(-50%, -50%) rotate(90deg);animation-delay:0.4s;height:5px}.solar-ray:nth-child(5){transform:translate(-50%, -50%) rotate(135deg);animation-delay:0.6s;height:4px}.solar-ray:nth-child(6){transform:translate(-50%, -50%) rotate(180deg);animation-delay:0.8s;height:5px}.solar-ray:nth-child(7){transform:translate(-50%, -50%) rotate(225deg);animation-delay:1.0s;height:4px}.solar-ray:nth-child(8){transform:translate(-50%, -50%) rotate(270deg);animation-delay:1.2s;height:5px}.solar-ray:nth-child(9){transform:translate(-50%, -50%) rotate(315deg);animation-delay:1.4s;height:4px}.solar-ray.secondary{height:3px;width:250%;opacity:0.6}.solar-ray.secondary:nth-child(10){transform:translate(-50%, -50%) rotate(22.5deg);animation-delay:0.1s}.solar-ray.secondary:nth-child(11){transform:translate(-50%, -50%) rotate(67.5deg);animation-delay:0.3s}.solar-ray.secondary:nth-child(12){transform:translate(-50%, -50%) rotate(112.5deg);animation-delay:0.5s}.solar-ray.secondary:nth-child(13){transform:translate(-50%, -50%) rotate(157.5deg);animation-delay:0.7s}@keyframes intensePulse{0%{opacity:0;transform:scale(0.3)}15%{opacity:1;transform:scale(1.1)}50%{opacity:0.9;transform:scale(1)}100%{opacity:0;transform:scale(1.2)}}@keyframes solarExplosion{0%{opacity:0;width:0%;filter:blur(10px) brightness(2)}20%{opacity:1;width:250%;filter:blur(3px) brightness(1.5)}40%{opacity:1;width:300%;filter:blur(1px) brightness(1.2)}80%{opacity:0.6;width:350%;filter:blur(0px) brightness(1)}100%{opacity:0;width:400%;filter:blur(0px) brightness(0.8)}}@media (max-width: 768px){.achievement-tooltip{min-width:250px;max-width:280px;font-size:0.9rem}.bookshelf-bg{max-width:95%;max-height:85%}.door-decoration{font-size:3rem}}@media (max-width: 480px){.achievement-tooltip{min-width:200px;max-width:240px;padding:12px}.tooltip-title{font-size:1.1rem}.tooltip-icon{font-size:1.5rem}.door-decoration{font-size:2.5rem}}.achievements-hall.animate-entrance .door-container{animation:doorSequence 3s ease-out forwards}@keyframes doorSequence{0%{transform:scale(1)}60%{transform:scale(1)}100%{transform:scale(1);pointer-events:none}}.party-panel{color:#cbd5e1;text-align:center}.party-panel h3{color:#ffd700;margin-bottom:calc(var(--spacing-unit) * 2);font-size:1.5rem}.party-members{display:grid;grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));gap:calc(var(--spacing-unit) * 1.5)}.member-card{background:rgba(0,0,0,0.3);border:2px solid rgba(148,163,184,0.2);border-radius:1rem;padding:calc(var(--spacing-unit) * 1.5);transition:all var(--transition-speed) ease}.member-card:hover{transform:translateY(-5px);border-color:#ffd700;box-shadow:0 10px 30px rgba(255,215,0,0.2)}.member-avatar{font-size:3rem;margin-bottom:var(--spacing-unit)}.member-card h4{color:#ffd700;margin-bottom:0.5rem}.member-card p{color:#94a3b8;font-size:0.9rem}.party-members{grid-template-columns:1fr}[data-theme="light"] .member-card{background:rgba(248,250,252,0.8);border-color:#cbd5e1}[data-theme="light"] .member-card h4{color:#0f172a}[data-theme="light"] .member-card p{color:#64748b}.summon-system{width:100vw;min-height:100vh;position:relative;margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%)}.summon-system .summon-section{width:100%;position:relative}.summon-section{position:relative}.summon-controls{margin:2rem 0}.summon-btn{position:relative;padding:1.5rem 3rem;font-size:1.5rem;font-weight:bold;color:#FFF;background:linear-gradient(45deg, #FF4500, tomato, #FF4500);border:none;border-radius:25px;cursor:pointer;transition:all 0.3s ease;overflow:hidden;box-shadow:0 8px 16px rgba(255,69,0,0.4),inset 0 1px 0 rgba(255,255,255,0.2)}.summon-btn .btn-text{position:relative;z-index:2}.summon-btn .btn-effect{position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);transition:left 0.6s ease;z-index:1}.summon-btn:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 12px 24px rgba(255,69,0,0.6),inset 0 1px 0 rgba(255,255,255,0.3)}.summon-btn:hover .btn-effect{left:100%}.summon-btn:active{transform:translateY(-1px) scale(1.02)}.summon-btn:disabled{opacity:0.6;cursor:not-allowed;transform:none}.summon-portal-container{position:relative;width:calc(min(100vw, 100vh) - 40px);max-width:1200px;height:calc(min(100vw, 100vh) - 40px);max-height:1200px;margin:20px auto;display:flex;justify-content:center;align-items:center;transition:transform 0.3s ease}.summon-portal-container.summoning{animation:summonPulse 1s ease-in-out infinite alternate}.summon-portal-container .portal-background{width:100%;height:100%;object-fit:contain;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges;border-radius:20px;position:relative;z-index:1;transition:opacity 0.3s ease;border:4px solid transparent;background:linear-gradient(#fff, #fff) padding-box,linear-gradient(45deg, gold 0%, #FF6B6B 25%, #4ECDC4 50%, #45B7D1 75%, #96CEB4 100%) border-box;box-shadow:0 0 20px rgba(255,215,0,0.4),0 0 40px rgba(255,107,107,0.2),0 0 60px rgba(78,205,196,0.2),inset 0 0 30px rgba(255,255,255,0.1)}.summon-portal-container .portal-background::before{content:'';position:absolute;top:-8px;left:10%;right:10%;height:6px;background:linear-gradient(90deg, transparent 0%, gold 20%, #FF6B6B 40%, #4ECDC4 60%, #45B7D1 80%, transparent 100%);border-radius:10px;box-shadow:0 0 15px rgba(255,215,0,0.6);animation:topBorderPulse 3s ease-in-out infinite}.summon-portal-container .portal-background::after{content:'';position:absolute;bottom:-8px;left:15%;right:15%;height:4px;background:linear-gradient(90deg, transparent 0%, #96CEB4 25%, #45B7D1 50%, #4ECDC4 75%, transparent 100%);border-radius:8px;box-shadow:0 0 12px rgba(150,206,180,0.5);animation:bottomBorderFlow 4s linear infinite}.summon-portal-container .summon-animation-video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain;border-radius:20px;z-index:3;opacity:0;pointer-events:none;transition:opacity 0.3s ease;border:4px solid transparent;background:linear-gradient(transparent, transparent) padding-box,linear-gradient(45deg, gold 0%, #FF6B6B 25%, #4ECDC4 50%, #45B7D1 75%, #96CEB4 100%) border-box;box-shadow:0 0 20px rgba(255,215,0,0.4),0 0 40px rgba(255,107,107,0.2),0 0 60px rgba(78,205,196,0.2),inset 0 0 30px rgba(255,255,255,0.1)}.summon-portal-container .summon-animation-video::before{content:'';position:absolute;top:-8px;left:10%;right:10%;height:6px;background:linear-gradient(90deg, transparent 0%, gold 20%, #FF6B6B 40%, #4ECDC4 60%, #45B7D1 80%, transparent 100%);border-radius:10px;box-shadow:0 0 15px rgba(255,215,0,0.6);animation:topBorderPulse 3s ease-in-out infinite}.summon-portal-container .summon-animation-video::after{content:'';position:absolute;bottom:-8px;left:15%;right:15%;height:4px;background:linear-gradient(90deg, transparent 0%, #96CEB4 25%, #45B7D1 50%, #4ECDC4 75%, transparent 100%);border-radius:8px;box-shadow:0 0 12px rgba(150,206,180,0.5);animation:bottomBorderFlow 4s linear infinite}.summon-portal-container .summon-animation-video.playing{opacity:1;pointer-events:none}.summon-portal-container .summon-aura{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:200px;height:200px;border-radius:50%;opacity:0;z-index:5;transition:opacity 0.5s ease}.summon-portal-container .summon-aura.star-1{background:radial-gradient(circle, rgba(255,255,255,0.8), rgba(255,255,255,0.4), transparent);box-shadow:0 0 30px rgba(255,255,255,0.6),0 0 60px rgba(255,255,255,0.4),0 0 100px rgba(255,255,255,0.2)}.summon-portal-container .summon-aura.star-1.burst{box-shadow:0 0 80px rgba(255,255,255,0.9),0 0 160px rgba(255,255,255,0.7),0 0 240px rgba(255,255,255,0.5),inset 0 0 50px rgba(255,255,255,0.4)}.summon-portal-container .summon-aura.star-2{background:radial-gradient(circle, rgba(34,197,94,0.8), rgba(34,197,94,0.4), transparent);box-shadow:0 0 30px rgba(34,197,94,0.6),0 0 60px rgba(34,197,94,0.4),0 0 100px rgba(34,197,94,0.2)}.summon-portal-container .summon-aura.star-2.burst{box-shadow:0 0 80px rgba(34,197,94,0.9),0 0 160px rgba(34,197,94,0.7),0 0 240px rgba(34,197,94,0.5),inset 0 0 50px rgba(34,197,94,0.4)}.summon-portal-container .summon-aura.star-3{background:radial-gradient(circle, rgba(59,130,246,0.8), rgba(59,130,246,0.4), transparent);box-shadow:0 0 30px rgba(59,130,246,0.6),0 0 60px rgba(59,130,246,0.4),0 0 100px rgba(59,130,246,0.2)}.summon-portal-container .summon-aura.star-3.burst{box-shadow:0 0 80px rgba(59,130,246,0.9),0 0 160px rgba(59,130,246,0.7),0 0 240px rgba(59,130,246,0.5),inset 0 0 50px rgba(59,130,246,0.4)}.summon-portal-container .summon-aura.star-4{background:radial-gradient(circle, rgba(255,193,7,0.8), rgba(255,193,7,0.4), transparent);box-shadow:0 0 30px rgba(255,193,7,0.6),0 0 60px rgba(255,193,7,0.4),0 0 100px rgba(255,193,7,0.2)}.summon-portal-container .summon-aura.star-4.burst{box-shadow:0 0 80px rgba(255,193,7,0.9),0 0 160px rgba(255,193,7,0.7),0 0 240px rgba(255,193,7,0.5),inset 0 0 50px rgba(255,193,7,0.4)}.summon-portal-container .summon-aura.star-5{background:radial-gradient(circle, rgba(255,0,150,0.9) 0%, rgba(255,206,84,0.9) 25%, rgba(255,107,107,0.9) 50%, rgba(78,205,196,0.9) 75%, rgba(138,43,226,0.9) 100%);box-shadow:0 0 50px rgba(255,0,150,0.8),0 0 100px rgba(255,206,84,0.7),0 0 150px rgba(78,205,196,0.6),0 0 200px rgba(138,43,226,0.5);animation:rainbowPulse 0.5s ease-in-out infinite alternate}.summon-portal-container .summon-aura.star-5.burst{box-shadow:0 0 100px #ff0096,0 0 200px rgba(255,206,84,0.9),0 0 300px rgba(78,205,196,0.8),0 0 400px rgba(138,43,226,0.7),inset 0 0 100px rgba(255,255,255,0.3)}.summon-portal-container .summon-aura.initial{opacity:0.6;transform:translate(-50%, -50%) scale(0.7);animation:auraInitial 1s ease-in-out infinite alternate}.summon-portal-container .summon-aura.show{opacity:0.9;transform:translate(-50%, -50%) scale(1);animation:auraGlow 1s ease-in-out infinite alternate}.summon-portal-container .summon-aura.transitioning{transition:opacity 1s ease-in-out, transform 1s ease-in-out, animation 1s ease-in-out;animation:none}.summon-portal-container .summon-aura.burst{width:100%;height:100%;transform:translate(-50%, -50%);opacity:1;animation:auraBurstEnhanced 0.5s ease-out;z-index:6;transition:all 0.5s ease-in-out}.summon-portal-container .summon-aura.fade-out{opacity:0;transform:translate(-50%, -50%) scale(1.2);transition:opacity 0.5s ease-out, transform 0.5s ease-out;animation:none}.summon-portal-container .particle-container{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:4}.summon-portal-container .particle-container .particle{position:absolute;width:8px;height:8px;border-radius:50%;opacity:0;filter:brightness(1.5)}.summon-portal-container .particle-container .particle.star-1{background:radial-gradient(circle, #fff, rgba(255,255,255,0.8));box-shadow:0 0 15px #fff,0 0 30px rgba(255,255,255,0.9),0 0 45px rgba(255,255,255,0.7),0 0 60px rgba(255,255,255,0.4);animation:particleWhiteGlow 1s ease-in-out infinite alternate}.summon-portal-container .particle-container .particle.star-2{background:radial-gradient(circle, #22c55e, rgba(34,197,94,0.8));box-shadow:0 0 15px #22c55e,0 0 30px rgba(34,197,94,0.9),0 0 45px rgba(34,197,94,0.7),0 0 60px rgba(34,197,94,0.4);animation:particleGreenGlow 1s ease-in-out infinite alternate}.summon-portal-container .particle-container .particle.star-3{background:radial-gradient(circle, #3b82f6, rgba(59,130,246,0.8));box-shadow:0 0 15px #3b82f6,0 0 30px rgba(59,130,246,0.9),0 0 45px rgba(59,130,246,0.7),0 0 60px rgba(59,130,246,0.4);animation:particleBlueGlow 1s ease-in-out infinite alternate}.summon-portal-container .particle-container .particle.star-4{background:radial-gradient(circle, #ffc107, rgba(255,193,7,0.8));box-shadow:0 0 15px #ffc107,0 0 30px rgba(255,193,7,0.9),0 0 45px rgba(255,193,7,0.7),0 0 60px rgba(255,193,7,0.4);animation:particleGoldGlow 1s ease-in-out infinite alternate}.summon-portal-container .particle-container .particle.star-5{background:radial-gradient(circle, #ff0096 0%, #ffce54 25%, #ff6b6b 50%, #4ecdc4 75%, #8a2be2 100%);box-shadow:0 0 20px #ff0096,0 0 40px rgba(255,206,84,0.9),0 0 60px rgba(255,107,107,0.8),0 0 80px rgba(78,205,196,0.6);animation:particleRainbow 0.3s ease-in-out infinite alternate;filter:brightness(2) saturate(1.5)}.summon-portal-container .particle-container .particle.show{opacity:1;animation:particleFloat 2s ease-out forwards}.summon-portal-container .particle-container .particle.rainbow-particle.show{animation:particleFloatRainbow 2s ease-out forwards}.summon-portal-container .particle-container .particle.rainbow-particle.star-1{filter:brightness(2) saturate(1.5);animation:particleWhiteGlow 0.8s ease-in-out infinite alternate, particleFloatRainbow 2s ease-out forwards}.summon-portal-container .particle-container .particle.rainbow-particle.star-2{filter:brightness(2) saturate(1.5);animation:particleGreenGlow 0.8s ease-in-out infinite alternate, particleFloatRainbow 2s ease-out forwards}.summon-portal-container .particle-container .particle.rainbow-particle.star-3{filter:brightness(2) saturate(1.5);animation:particleBlueGlow 0.8s ease-in-out infinite alternate, particleFloatRainbow 2s ease-out forwards}.summon-portal-container .particle-container .particle.rainbow-particle.star-4{filter:brightness(2) saturate(1.5);animation:particleGoldGlow 0.8s ease-in-out infinite alternate, particleFloatRainbow 2s ease-out forwards}.summon-portal-container .particle-container .particle.rainbow-particle.star-5{filter:brightness(2.5) saturate(2);animation:particleRainbow 0.3s ease-in-out infinite alternate, particleFloatRainbow 2s ease-out forwards}@keyframes topBorderPulse{0%, 100%{opacity:0.8;transform:scaleX(1);box-shadow:0 0 15px rgba(255,215,0,0.6)}50%{opacity:1;transform:scaleX(1.05);box-shadow:0 0 25px rgba(255,215,0,0.8)}}@keyframes summonPulse{0%{transform:scale(1)}100%{transform:scale(1.02)}}@keyframes auraInitial{0%{opacity:0.5;transform:translate(-50%, -50%) scale(0.6)}100%{opacity:0.7;transform:translate(-50%, -50%) scale(0.8)}}@keyframes auraGlow{0%{opacity:0.8;transform:translate(-50%, -50%) scale(0.95)}100%{opacity:1;transform:translate(-50%, -50%) scale(1.1)}}@keyframes auraBurst{0%{opacity:1;transform:translate(-50%, -50%) scale(1)}50%{opacity:1;transform:translate(-50%, -50%) scale(4)}100%{opacity:0.8;transform:translate(-50%, -50%) scale(3)}}@keyframes auraBurstEnhanced{0%{opacity:0.8;filter:brightness(1) saturate(1)}30%{opacity:1;filter:brightness(2) saturate(2)}70%{opacity:1;filter:brightness(2.5) saturate(2.5)}100%{opacity:0.9;filter:brightness(2) saturate(2)}}@keyframes particleFloat{0%{opacity:0;transform:translateY(0) scale(0.5)}20%{opacity:1;transform:translateY(-20px) scale(1)}80%{opacity:1;transform:translateY(-60px) scale(1.2)}100%{opacity:0;transform:translateY(-100px) scale(0.8)}}@keyframes particleFloatRainbow{0%{opacity:0;transform:translateY(0) scale(0.5) rotate(0deg)}20%{opacity:1;transform:translateY(-25px) scale(1) rotate(90deg)}80%{opacity:1;transform:translateY(-70px) scale(1.3) rotate(270deg)}100%{opacity:0;transform:translateY(-120px) scale(0.9) rotate(360deg)}}@keyframes particleRainbow{0%{filter:brightness(2) saturate(1.5) hue-rotate(0deg);transform:scale(1)}100%{filter:brightness(2.5) saturate(2) hue-rotate(180deg);transform:scale(1.2)}}@keyframes particleWhiteGlow{0%{filter:brightness(1.5) drop-shadow(0 0 5px rgba(255,255,255,0.8));transform:scale(1)}100%{filter:brightness(2) drop-shadow(0 0 10px #fff);transform:scale(1.1)}}@keyframes particleGreenGlow{0%{filter:brightness(1.5) drop-shadow(0 0 5px rgba(34,197,94,0.8));transform:scale(1)}100%{filter:brightness(2) drop-shadow(0 0 10px #22c55e);transform:scale(1.1)}}@keyframes particleBlueGlow{0%{filter:brightness(1.5) drop-shadow(0 0 5px rgba(59,130,246,0.8));transform:scale(1)}100%{filter:brightness(2) drop-shadow(0 0 10px #3b82f6);transform:scale(1.1)}}@keyframes particleGoldGlow{0%{filter:brightness(1.5) drop-shadow(0 0 5px rgba(255,193,7,0.8));transform:scale(1)}100%{filter:brightness(2) drop-shadow(0 0 10px #ffc107);transform:scale(1.1)}}@keyframes rainbowPulse{0%{filter:brightness(1) saturate(1)}100%{filter:brightness(1.2) saturate(1.3)}}@keyframes bottomBorderFlow{0%{background:linear-gradient(90deg, transparent 0%, #96CEB4 25%, #45B7D1 50%, #4ECDC4 75%, transparent 100%)}50%{background:linear-gradient(90deg, transparent 0%, #4ECDC4 25%, #96CEB4 50%, #45B7D1 75%, transparent 100%)}100%{background:linear-gradient(90deg, transparent 0%, #45B7D1 25%, #4ECDC4 50%, #96CEB4 75%, transparent 100%)}}.portal-interactive-area{position:absolute;width:20%;height:20%;min-width:180px;min-height:180px;max-width:300px;max-height:300px;top:50%;left:50%;transform:translate(-50%, -50%);cursor:pointer;border-radius:50%;transition:all 0.3s ease;z-index:10}.portal-interactive-area::before{content:'';position:absolute;top:-10px;left:-10px;right:-10px;bottom:-10px;border-radius:50%;background:radial-gradient(circle, rgba(0,191,255,0.1), transparent);animation:portalPulse 3s ease-in-out infinite}.portal-interactive-area:hover{transform:translate(-50%, -50%) scale(1.1)}.portal-interactive-area:hover::before{background:radial-gradient(circle, rgba(0,191,255,0.3), transparent);animation:portalPulseIntense 1.5s ease-in-out infinite}.portal-interactive-area:hover .portal-glow{opacity:1;transform:scale(1.2)}.portal-interactive-area:hover .portal-ring{border-width:4px;animation-duration:2s}.portal-interactive-area:active{transform:translate(-50%, -50%) scale(0.95)}.portal-glow{position:absolute;width:100%;height:100%;border-radius:50%;background:radial-gradient(circle, rgba(0,191,255,0.4), rgba(138,43,226,0.3), transparent);opacity:0.5;transition:all 0.3s ease;animation:glowPulse 4s ease-in-out infinite}@keyframes portalPulse{0%, 100%{transform:scale(1);opacity:0.1}50%{transform:scale(1.1);opacity:0.2}}@keyframes portalPulseIntense{0%, 100%{transform:scale(1);opacity:0.3}50%{transform:scale(1.2);opacity:0.5}}@keyframes glowPulse{0%, 100%{opacity:0.3;transform:scale(1)}50%{opacity:0.7;transform:scale(1.05)}}.summon-tooltip{position:fixed;background:linear-gradient(145deg, rgba(0,0,0,0.9), rgba(30,30,30,0.9));border:2px solid rgba(255,215,0,0.6);border-radius:12px;padding:12px 16px;font-size:14px;color:#FFF;white-space:nowrap;opacity:0;visibility:hidden;transition:opacity 0.3s ease, visibility 0.3s ease;z-index:1000;backdrop-filter:blur(8px);box-shadow:0 8px 32px rgba(0,0,0,0.4),0 0 20px rgba(255,215,0,0.2);pointer-events:none}.summon-tooltip::after{content:'';position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid rgba(255,215,0,0.6)}.summon-tooltip.show{opacity:1;visibility:visible}.tooltip-content{display:flex;flex-direction:column;align-items:center;gap:8px}.tooltip-title{font-weight:bold;color:#FFD700;text-shadow:0 0 8px rgba(255,215,0,0.6);font-size:16px}.tooltip-cost{display:flex;align-items:center;gap:8px;font-size:14px}.tooltip-cost .tooltip-coin{width:20px;height:20px;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges;filter:drop-shadow(0 0 4px rgba(255,215,0,0.6))}.tooltip-cost span{color:#E8E8E8;font-weight:600}.summon-portal{width:100%;height:100%;position:relative}.summon-portal .portal-ring{position:absolute;border:3px solid transparent;border-radius:50%;animation:portalRotate 4s linear infinite}.summon-portal .portal-ring.portal-ring-1{width:100%;height:100%;top:0;left:0;border-color:rgba(255,215,0,0.6);animation-duration:3s}.summon-portal .portal-ring.portal-ring-2{width:80%;height:80%;top:10%;left:10%;border-color:rgba(138,43,226,0.6);animation-duration:4s;animation-direction:reverse}.summon-portal .portal-ring.portal-ring-3{width:60%;height:60%;top:20%;left:20%;border-color:rgba(30,144,255,0.6);animation-duration:2s}.summon-portal .portal-center{position:absolute;width:40%;height:40%;top:30%;left:30%;background:radial-gradient(circle, rgba(255,255,255,0.8) 0%, rgba(255,215,0,0.6) 30%, rgba(138,43,226,0.4) 60%, transparent 100%);border-radius:50%;animation:portalPulse 2s ease-in-out infinite}@keyframes portalRotate{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@keyframes portalPulse{0%, 100%{transform:scale(1);opacity:0.7}50%{transform:scale(1.2);opacity:1}}@keyframes portalActivate{0%{transform:scale(0.5);opacity:0}50%{transform:scale(1.2);opacity:1}100%{transform:scale(1);opacity:1}}.summon-light-effect{position:absolute;width:100%;height:100%;border-radius:50%;animation:lightBurst 2s ease-out}.summon-light-effect.rarity-1{background:radial-gradient(circle, rgba(192,192,192,0.8) 0%, transparent 70%)}.summon-light-effect.rarity-2{background:radial-gradient(circle, rgba(50,205,50,0.8) 0%, transparent 70%)}.summon-light-effect.rarity-3{background:radial-gradient(circle, rgba(65,105,225,0.8) 0%, transparent 70%)}.summon-light-effect.rarity-4{background:radial-gradient(circle, rgba(218,112,214,0.8) 0%, transparent 70%);box-shadow:0 0 50px rgba(218,112,214,0.6)}.summon-light-effect.rarity-5{background:radial-gradient(circle, gold 0%, rgba(255,69,0,0.8) 50%, transparent 70%);box-shadow:0 0 100px rgba(255,215,0,0.8)}@keyframes lightBurst{0%{transform:scale(0);opacity:0}50%{transform:scale(1.5);opacity:1}100%{transform:scale(2.5);opacity:0}}.summon-particle{position:absolute;width:4px;height:4px;background:#FFF;border-radius:50%;animation:particleFly 3s ease-out forwards}.summon-particle.rarity-1{background:#C0C0C0}.summon-particle.rarity-2{background:#32CD32}.summon-particle.rarity-3{background:#4169E1}.summon-particle.rarity-4{background:#DA70D6}.summon-particle.rarity-5{background:#FFD700;box-shadow:0 0 10px #FFD700}@keyframes particleFly{0%{transform:translate(0, 0) scale(1);opacity:1}100%{transform:translate(var(--random-x, 0), var(--random-y, -100px)) scale(0);opacity:0}}.summon-special-effect{position:absolute;width:120%;height:120%;top:-10%;left:-10%}.summon-special-effect.rarity-4{background:conic-gradient(from 0deg, transparent 0deg, rgba(218,112,214,0.3) 90deg, transparent 180deg, rgba(218,112,214,0.3) 270deg, transparent 360deg);animation:specialRotate 1s linear infinite}.summon-special-effect.rarity-5{background:conic-gradient(from 0deg, rgba(255,215,0,0.6) 0deg, rgba(255,69,0,0.4) 60deg, rgba(255,215,0,0.6) 120deg, rgba(255,69,0,0.4) 180deg, rgba(255,215,0,0.6) 240deg, rgba(255,69,0,0.4) 300deg, rgba(255,215,0,0.6) 360deg);animation:specialRotate 0.5s linear infinite}@keyframes specialRotate{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.summon-legendary-effect{position:absolute;width:150%;height:150%;top:-25%;left:-25%;background:radial-gradient(circle at 50% 50%, rgba(255,215,0,0.1) 0%, transparent 50%),conic-gradient(from 0deg, gold 0deg, #FF4500 45deg, gold 90deg, #FF4500 135deg, gold 180deg, #FF4500 225deg, gold 270deg, #FF4500 315deg, gold 360deg);border-radius:50%;animation:legendaryBurst 2s ease-out, legendaryRotate 3s linear infinite;filter:blur(2px)}@keyframes legendaryBurst{0%{transform:scale(0);opacity:0}50%{transform:scale(1.2);opacity:0.8}100%{transform:scale(1);opacity:0.6}}@keyframes legendaryRotate{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.companion-collection{padding:2rem;overflow:visible}.companion-collection:has(.companion-card){background:rgba(0,0,0,0.2);border-top:2px solid rgba(255,215,0,0.3);border-radius:8px}.companion-collection h3{color:#FFD700;font-size:1.8rem;text-align:center;margin-bottom:2rem;text-shadow:0 0 10px rgba(255,215,0,0.6)}.companion-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(120px, 1fr));gap:1.5rem;width:100%;box-sizing:border-box;padding:20px 0;justify-items:center}.companion-grid .no-companions{grid-column:1 / -1;text-align:center;color:#888;font-style:italic;padding:3rem;font-size:1.1rem}.companion-card{position:relative;cursor:pointer;transition:all 0.3s ease;width:100%;max-width:120px;margin:0 auto}.companion-card:hover{transform:translateY(-5px) scale(1.05)}.companion-card:hover .companion-tooltip{opacity:1;visibility:visible;transform:translateY(0)}.companion-avatar{position:relative;width:100%;aspect-ratio:1;border-radius:12px;overflow:hidden}.companion-avatar img{width:100%;height:100%;object-fit:cover;display:block}.companion-avatar .rarity-border{position:absolute;top:-3px;left:-3px;right:-3px;bottom:-3px;border-radius:15px;border:3px solid;pointer-events:none}.companion-avatar .rarity-border.rarity-1{border-color:#C0C0C0}.companion-avatar .rarity-border.rarity-2{border-color:#32CD32}.companion-avatar .rarity-border.rarity-3{border-color:#4169E1}.companion-avatar .rarity-border.rarity-4{border-color:#DA70D6;box-shadow:0 0 15px rgba(218,112,214,0.3)}.companion-avatar .rarity-border.rarity-5{border-color:#FFD700;box-shadow:0 0 25px rgba(255,215,0,0.5);animation:legendaryCardGlow 3s ease-in-out infinite alternate}.companion-avatar .star-badge{position:absolute;bottom:4px;right:4px;background:rgba(0,0,0,0.8);padding:2px 6px;border-radius:12px;display:flex;align-items:center;gap:1px}.companion-avatar .star-badge .star-icon{width:12px;height:12px;filter:brightness(1.2)}.companion-avatar .star-badge.rarity-5 .star-icon{filter:brightness(1.5) drop-shadow(0 0 2px gold)}.companion-avatar .companion-count{position:absolute;top:4px;right:4px;background:rgba(255,215,0,0.9);color:#000;font-size:12px;font-weight:bold;padding:2px 6px;border-radius:10px;line-height:1}.companion-tooltip{position:absolute;bottom:100%;left:50%;transform:translateX(-50%) translateY(-10px);background:linear-gradient(145deg, rgba(0,0,0,0.95), rgba(30,30,30,0.95));border:1px solid rgba(255,215,0,0.3);border-radius:8px;padding:8px 12px;min-width:200px;max-width:300px;opacity:0;visibility:hidden;transition:all 0.3s ease;z-index:100;backdrop-filter:blur(5px)}.companion-tooltip::after{content:'';position:absolute;top:100%;left:50%;transform:translateX(-50%);border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid rgba(0,0,0,0.95)}.companion-tooltip .tooltip-name{font-size:14px;font-weight:bold;color:#FFD700;margin-bottom:4px;text-align:center}.companion-tooltip .tooltip-description{font-size:12px;color:#CCC;line-height:1.4;text-align:center}@keyframes legendaryCardGlow{0%{box-shadow:0 0 25px rgba(255,215,0,0.5)}100%{box-shadow:0 0 35px rgba(255,215,0,0.8)}}.summon-result-modal{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:2000;opacity:0;visibility:hidden;transition:opacity 0.3s ease, visibility 0.3s ease;pointer-events:none}.summon-result-modal.show{opacity:1;visibility:visible;pointer-events:all}.summon-result-modal.show .modal-content{transform:translateY(0) scale(1)}.summon-result-modal .modal-background{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.8);z-index:-1}.summon-result-modal .modal-content{position:relative;width:90%;max-width:600px;background:linear-gradient(145deg, #1a0b2e, #16213e);border:3px solid #FFD700;border-radius:20px;padding:2rem;transform:translateY(-50px) scale(0.9);transition:transform 0.3s ease;box-shadow:0 20px 40px rgba(0,0,0,0.5);z-index:10;backdrop-filter:none;filter:none}.summon-result-modal .modal-content *{filter:none !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important}.summon-result-modal.rarity-5 .modal-content{border-color:#FFD700;box-shadow:0 20px 40px rgba(0,0,0,0.5),0 0 50px rgba(255,215,0,0.4);animation:modalLegendaryGlow 2s ease-in-out infinite alternate}@keyframes modalLegendaryGlow{0%{box-shadow:0 20px 40px rgba(0,0,0,0.5),0 0 50px rgba(255,215,0,0.4)}100%{box-shadow:0 20px 40px rgba(0,0,0,0.5),0 0 70px rgba(255,215,0,0.7)}}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.modal-header h3{color:#FFD700;font-size:1.8rem;text-shadow:0 0 10px rgba(255,215,0,0.6)}.modal-header .close-btn{background:none;border:none;color:#FFF;font-size:2rem;cursor:pointer;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background-color 0.3s ease}.modal-header .close-btn:hover{background-color:rgba(255,255,255,0.1)}.companion-showcase{display:flex;gap:2rem;margin-bottom:2rem;filter:none;backdrop-filter:none}.companion-showcase .companion-image{position:relative;width:200px;height:200px}.companion-showcase .companion-image img{width:100%;height:100%;object-fit:cover;border-radius:12px}.companion-showcase .companion-image .companion-frame{position:absolute;top:-3px;left:-3px;right:-3px;bottom:-3px;border:3px solid #FFD700;border-radius:15px;pointer-events:none}.companion-showcase .companion-details{flex:1;filter:none;backdrop-filter:none}.companion-showcase .companion-details .rarity-stars{font-size:1.5rem;margin-bottom:1rem}.companion-showcase .companion-details .companion-name{font-size:1.5rem;font-weight:bold;color:#FFF;margin-bottom:1rem;filter:none;text-shadow:none}.companion-showcase .companion-details .companion-description{color:#CCC;line-height:1.6;margin-bottom:1.5rem;filter:none}.companion-showcase .companion-details .companion-skills{margin-top:1.5rem}.companion-showcase .companion-details .companion-skills .skills-header{margin-bottom:1rem;text-align:center}.companion-showcase .companion-details .companion-skills .skills-header .skills-title{font-size:1.1rem;font-weight:bold;color:#FFD700;text-shadow:0 0 10px rgba(255,215,0,0.6);background:linear-gradient(90deg, rgba(255,215,0,0.1), rgba(255,215,0,0.3), rgba(255,215,0,0.1));padding:0.5rem 1rem;border-radius:20px;border:1px solid rgba(255,215,0,0.3);display:inline-block}.companion-showcase .companion-details .companion-skills .skills-grid{display:flex;flex-wrap:wrap;gap:0.5rem;margin-top:1rem}.companion-showcase .companion-details .companion-skills .skill-tag{position:relative;padding:0.3rem 0.8rem;border-radius:16px;font-size:0.8rem;font-weight:500;text-align:center;overflow:hidden;display:inline-flex;align-items:center;gap:0.25rem;height:auto;min-height:auto;animation:skillSlideIn 0.6s ease-out;animation:skillSlideIn 0.6s ease backwards}.companion-showcase .companion-details .companion-skills .skill-tag::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(45deg, transparent 40%, rgba(255,255,255,0.4) 50%, transparent 60%);animation:shimmer 3s infinite;z-index:1}.companion-showcase .companion-details .companion-skills .skill-tag .skill-icon{font-size:0.9rem;filter:drop-shadow(0 0 2px currentColor);z-index:2;position:relative}.companion-showcase .companion-details .companion-skills .skill-tag .skill-name{font-size:0.8rem;line-height:1.2;z-index:2;position:relative;text-shadow:0 1px 2px rgba(0,0,0,0.5);white-space:nowrap}.companion-showcase .companion-details .companion-skills .skill-tag.skill-attack{background:linear-gradient(135deg, rgba(255,69,69,0.9), rgba(220,38,38,0.8));border:2px solid rgba(255,140,140,0.8);color:#fff;box-shadow:0 4px 15px rgba(255,69,69,0.4),0 2px 4px rgba(255,69,69,0.6),inset 0 1px 0 rgba(255,255,255,0.3)}.companion-showcase .companion-details .companion-skills .skill-tag.skill-defense{background:linear-gradient(135deg, rgba(59,130,246,0.9), rgba(37,99,235,0.8));border:2px solid rgba(147,197,253,0.8);color:#fff;box-shadow:0 4px 15px rgba(59,130,246,0.4),0 2px 4px rgba(59,130,246,0.6),inset 0 1px 0 rgba(255,255,255,0.3)}.companion-showcase .companion-details .companion-skills .skill-tag.skill-support{background:linear-gradient(135deg, rgba(34,197,94,0.9), rgba(22,163,74,0.8));border:2px solid rgba(134,239,172,0.8);color:#fff;box-shadow:0 4px 15px rgba(34,197,94,0.4),0 2px 4px rgba(34,197,94,0.6),inset 0 1px 0 rgba(255,255,255,0.3)}.companion-showcase .companion-details .companion-skills .skill-tag.skill-tech{background:linear-gradient(135deg, rgba(168,85,247,0.2), rgba(147,51,234,0.3));border:1px solid rgba(168,85,247,0.4);color:#A78BFA}.companion-showcase .companion-details .companion-skills .skill-tag.skill-tech .skill-tech{background:linear-gradient(135deg, rgba(168,85,247,0.9), rgba(147,51,234,0.8));border:2px solid rgba(196,181,253,0.8);color:#fff;box-shadow:0 4px 15px rgba(168,85,247,0.4),0 2px 4px rgba(168,85,247,0.6),inset 0 1px 0 rgba(255,255,255,0.3)}.companion-showcase .companion-details .companion-skills .skill-tag.skill-tech .skill-glow{background:linear-gradient(135deg, rgba(168,85,247,0.6), rgba(147,51,234,0.8));box-shadow:0 0 20px rgba(168,85,247,0.3)}.companion-showcase .companion-details .companion-skills .skill-tag.skill-tech:hover{transform:translateY(-2px) scale(1.05);box-shadow:0 8px 25px rgba(168,85,247,0.4)}.companion-showcase .companion-details .companion-skills .skill-tag.skill-tech:hover .skill-glow{opacity:1}.companion-showcase .companion-details .companion-skills .skill-tag.skill-special{background:linear-gradient(135deg, rgba(255,215,0,0.2), rgba(255,105,180,0.2), rgba(32,201,151,0.2));border:1px solid rgba(255,215,0,0.4);color:#FFD700}.companion-showcase .companion-details .companion-skills .skill-tag.skill-special .skill-glow{background:linear-gradient(135deg, rgba(255,215,0,0.6), rgba(255,105,180,0.6), rgba(32,201,151,0.6));box-shadow:0 0 20px rgba(255,215,0,0.4)}.companion-showcase .companion-details .companion-skills .skill-tag.skill-special:hover{transform:translateY(-2px) scale(1.05);box-shadow:0 8px 25px rgba(255,215,0,0.5)}.companion-showcase .companion-details .companion-skills .skill-tag.skill-special:hover .skill-glow{opacity:1}.companion-showcase .companion-details .companion-skills .skill-tag.skill-normal{background:linear-gradient(135deg, rgba(255,215,0,0.15), rgba(255,193,7,0.25));border:1px solid rgba(255,215,0,0.3);color:#FFD700}.companion-showcase .companion-details .companion-skills .skill-tag.skill-normal .skill-glow{background:linear-gradient(135deg, rgba(255,215,0,0.5), rgba(255,193,7,0.7));box-shadow:0 0 20px rgba(255,215,0,0.3)}.companion-showcase .companion-details .companion-skills .skill-tag.skill-normal:hover{transform:translateY(-2px) scale(1.05);box-shadow:0 8px 25px rgba(255,215,0,0.4)}.companion-showcase .companion-details .companion-skills .skill-tag.skill-normal:hover .skill-glow{opacity:1}.companion-showcase .companion-details .companion-skills .skill-tag::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);transition:left 0.6s ease;z-index:1}.companion-showcase .companion-details .companion-skills .skill-tag:hover::before{left:100%}.companion-showcase .companion-details .companion-skills .skill-tag[data-skill-index="1"]{animation-delay:0.1s}.companion-showcase .companion-details .companion-skills .skill-tag[data-skill-index="2"]{animation-delay:0.2s}.companion-showcase .companion-details .companion-skills .skill-tag[data-skill-index="3"]{animation-delay:0.3s}@keyframes skillSlideIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes shimmer{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}.modal-actions{text-align:center}.modal-actions .confirm-btn{padding:0.8rem 2rem;font-size:1.1rem;font-weight:bold;color:#000;background:linear-gradient(45deg, gold, orange);border:none;border-radius:25px;cursor:pointer;transition:all 0.3s ease}.modal-actions .confirm-btn:hover{transform:translateY(-2px);box-shadow:0 5px 15px rgba(255,215,0,0.4)}.summon-message{position:fixed;top:20px;right:20px;padding:1rem 2rem;border-radius:8px;font-weight:bold;z-index:3000;opacity:0;transform:translateX(100%);transition:all 0.3s ease}.summon-message.show{opacity:1;transform:translateX(0)}.summon-message.error{background:linear-gradient(45deg, #f44, #c00);color:#FFF;border-left:4px solid #AA0000}.summon-message.info{background:linear-gradient(45deg, #4169E1, #0000CD);color:#FFF;border-left:4px solid #0000AA}.summon-message.success{background:linear-gradient(45deg, #32CD32, #228B22);color:#FFF;border-left:4px solid #006600}@keyframes float-down{0%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(30px)}}.decrease-animation{animation:goldDecrease 0.5s ease-out}@keyframes goldDecrease{0%{color:#FFD700}50%{color:#FF4444;transform:scale(1.1)}100%{color:#FFD700;transform:scale(1)}}@media (max-width: 768px){.summon-info{flex-direction:column;gap:1rem}.companion-showcase{flex-direction:column}.companion-showcase .companion-image{width:150px;height:150px;margin:0 auto}.companion-grid{grid-template-columns:repeat(auto-fill, minmax(100px, 1fr));gap:1rem}.companion-collection{padding:1rem}.summon-portal-container{width:calc(100vw - 30px);height:calc(min(100vw, 100vh) - 100px);max-width:700px;max-height:700px;margin:15px auto}.summon-portal-container .portal-interactive-area{width:25%;height:25%;min-width:120px;min-height:120px}}@media (max-width: 480px){.summon-btn{padding:1rem 2rem;font-size:1.2rem}.modal-content{padding:1.5rem;margin:1rem}.companion-collection{padding:0.5rem}.companion-grid{grid-template-columns:repeat(auto-fill, minmax(80px, 1fr));gap:0.75rem}.companion-card{max-width:80px}.summon-portal-container{width:calc(100vw - 20px);height:calc(min(100vw, 100vh) - 120px);max-width:500px;max-height:500px;margin:10px auto}.summon-portal-container .portal-interactive-area{width:30%;height:30%;min-width:100px;min-height:100px}.summon-tooltip{font-size:12px;padding:8px 12px}.summon-tooltip .tooltip-title{font-size:14px}.summon-tooltip .tooltip-cost{font-size:12px}.summon-tooltip .tooltip-cost .tooltip-coin{width:16px;height:16px}}@media (min-width: 1400px){.summon-portal-container{width:calc(min(90vw, 90vh));height:calc(min(90vw, 90vh));max-width:1400px;max-height:1400px}}[data-theme="light"] .portal-interactive-area::before{background:radial-gradient(circle, rgba(30,64,175,0.15), transparent)}[data-theme="light"] .portal-interactive-area:hover::before{background:radial-gradient(circle, rgba(30,64,175,0.4), transparent)}[data-theme="light"] .portal-glow{background:radial-gradient(circle, rgba(30,64,175,0.4), rgba(59,130,246,0.3), transparent)}[data-theme="light"] .summon-tooltip{background:linear-gradient(145deg, rgba(255,255,255,0.95), rgba(248,250,252,0.95));border:2px solid rgba(30,64,175,0.6);color:#1f2937;box-shadow:0 8px 32px rgba(0,0,0,0.15),0 0 20px rgba(30,64,175,0.2)}[data-theme="light"] .summon-tooltip::after{border-top-color:rgba(30,64,175,0.6)}[data-theme="light"] .tooltip-title{color:#1e40af;text-shadow:0 0 8px rgba(30,64,175,0.4)}[data-theme="light"] .tooltip-cost .tooltip-coin{filter:drop-shadow(0 0 4px rgba(30,64,175,0.6))}[data-theme="light"] .tooltip-cost span{color:#374151}[data-theme="light"] .companion-collection{background:rgba(255,255,255,0.3);border-top:2px solid rgba(30,64,175,0.4)}[data-theme="light"] .companion-collection h3{color:#1e40af;text-shadow:0 0 10px rgba(30,64,175,0.4)}[data-theme="light"] .companion-card{background:linear-gradient(145deg, rgba(255,255,255,0.8), rgba(255,255,255,0.5));border:2px solid transparent}[data-theme="light"] .companion-info .companion-name{color:#1f2937}[data-theme="light"] .no-companions{color:#6b7280}[data-theme="light"] .summon-result-modal .modal-content{background:linear-gradient(145deg, #f8fafc, #e2e8f0);border:3px solid #1e40af}[data-theme="light"] .summon-result-modal .modal-header h3{color:#1e40af;text-shadow:0 0 10px rgba(30,64,175,0.4)}[data-theme="light"] .companion-showcase .companion-name{color:#1f2937}[data-theme="light"] .companion-showcase .companion-description{color:#4b5563}.star-display{display:flex;align-items:center;gap:2px}.star-icon{width:16px;height:16px;object-fit:contain;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges;filter:brightness(1) saturate(1.2)}.star-icon.empty{filter:brightness(0.4) saturate(0.3);opacity:0.6}.rarity-stars{display:flex;align-items:center;gap:2px}.rarity-stars .star-icon{width:14px;height:14px}.rarity-stars.rarity-5 .star-icon:not(.empty){filter:brightness(1.2) saturate(1.5) drop-shadow(0 0 3px gold);animation:starGlow 2s ease-in-out infinite alternate}.rarity-stars.rarity-4 .star-icon:not(.empty){filter:brightness(1.1) saturate(1.3) drop-shadow(0 0 2px orchid)}.rarity-stars.rarity-3 .star-icon:not(.empty){filter:brightness(1.05) saturate(1.2) drop-shadow(0 0 1px #4169E1)}@keyframes starGlow{0%{filter:brightness(1.2) saturate(1.5) drop-shadow(0 0 3px gold)}100%{filter:brightness(1.4) saturate(1.8) drop-shadow(0 0 6px gold)}}.rate-percentage{font-size:0.8rem}.collection-header{display:flex;justify-content:space-between;align-items:center;background:linear-gradient(135deg, rgba(0,0,0,0.4), rgba(0,0,0,0.2));border:2px solid rgba(255,215,0,0.3);border-radius:15px;padding:1.5rem;margin-bottom:2rem;box-shadow:0 8px 32px rgba(0,0,0,0.3);backdrop-filter:blur(10px);flex-wrap:wrap;gap:1rem}.collection-header h3{color:#FFD700;font-size:1.8rem;text-shadow:0 0 15px rgba(255,215,0,0.6);margin:0;display:flex;align-items:center;gap:0.5rem}.collection-header .collection-progress-summary{display:flex;flex-direction:column;align-items:flex-end;min-width:200px}.collection-header .collection-progress-summary .progress-info{color:#FFF;font-size:1.2rem;font-weight:bold;margin-bottom:0.5rem;text-shadow:0 0 10px rgba(255,255,255,0.5);text-align:right}.collection-header .collection-progress-summary .progress-info #collection-percentage{color:#FFD700;text-shadow:0 0 15px rgba(255,215,0,0.8)}.collection-header .collection-progress-summary .progress-bar-container{width:200px;height:10px;background:rgba(255,255,255,0.2);border-radius:5px;overflow:hidden;box-shadow:inset 0 2px 4px rgba(0,0,0,0.3)}.collection-header .collection-progress-summary .progress-bar-container .progress-bar,.collection-header .collection-progress-summary .progress-bar-container .collection-progress-bar{height:100%;background:linear-gradient(90deg, gold, orange, #FF6B6B);border-radius:5px;transition:width 0.8s ease-in-out;box-shadow:0 0 10px rgba(255,215,0,0.6);position:relative}.collection-header .collection-progress-summary .progress-bar-container .progress-bar::after,.collection-header .collection-progress-summary .progress-bar-container .collection-progress-bar::after{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);animation:progressShine 2s infinite linear}.category-section{background:linear-gradient(135deg, rgba(0,0,0,0.3), rgba(0,0,0,0.1));border:1px solid rgba(255,255,255,0.1);border-radius:12px;margin-bottom:1.5rem;overflow:hidden;box-shadow:0 4px 20px rgba(0,0,0,0.2);backdrop-filter:blur(5px)}.category-section .category-header{background:linear-gradient(90deg, rgba(255,215,0,0.2), rgba(255,215,0,0.05));border-bottom:1px solid rgba(255,215,0,0.3);padding:1rem 1.5rem}.category-section .category-header .category-title{display:flex;justify-content:space-between;align-items:center}.category-section .category-header .category-title .rarity-stars .star-icon{width:20px;height:20px;filter:drop-shadow(0 0 5px currentColor)}.category-section .category-header .category-title .category-stats{color:rgba(255,255,255,0.8);font-size:0.9rem;font-weight:bold}.category-section .companion-grid{padding:1.5rem}.collection-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;padding:0 20px}.collection-header .collection-title{color:#FFD700;font-size:1.8rem;font-weight:bold;text-shadow:0 0 15px rgba(255,215,0,0.6);margin:0}.collection-header .collection-stats .stats-row{display:flex;align-items:center;gap:1rem}.collection-stats .progress-info{color:#FFF;font-size:1rem;font-weight:bold;text-shadow:0 0 10px rgba(255,255,255,0.5);white-space:nowrap}.collection-stats .progress-info #collection-percentage{color:#FFD700;text-shadow:0 0 15px rgba(255,215,0,0.8)}.collection-stats .progress-bar-container{width:200px;height:12px;background:linear-gradient(90deg, rgba(30,30,30,0.9), rgba(50,50,50,0.7), rgba(30,30,30,0.9));border:1px solid rgba(255,215,0,0.3);border-radius:6px;overflow:hidden;box-shadow:inset 0 2px 4px rgba(0,0,0,0.5),0 0 15px rgba(255,215,0,0.3);position:relative}.collection-stats .progress-bar-container::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg, transparent, rgba(255,215,0,0.2), transparent);animation:backgroundShimmer 3s ease-in-out infinite}.collection-stats .progress-bar-container .progress-bar,.collection-stats .progress-bar-container .collection-progress-bar{height:100%;background:linear-gradient(90deg, gold 0%, orange 25%, #FF6B6B 50%, #8A2BE2 75%, #00BFFF 100%);border-radius:4px;transition:width 1.2s cubic-bezier(0.4, 0, 0.2, 1);box-shadow:0 0 20px rgba(255,215,0,0.8),inset 0 1px 0 rgba(255,255,255,0.3);position:relative;overflow:hidden;min-width:5px;z-index:2}.collection-stats .progress-bar-container .progress-bar::after,.collection-stats .progress-bar-container .collection-progress-bar::after{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg, transparent, rgba(255,255,255,0.6), transparent);animation:progressFlow 2s ease-in-out infinite}.collection-stats .progress-bar-container .progress-bar::before,.collection-stats .progress-bar-container .collection-progress-bar::before{content:'';position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;background:linear-gradient(90deg, rgba(255,215,0,0.5), rgba(255,165,0,0.5), rgba(255,107,107,0.5));border-radius:8px;filter:blur(4px);animation:progressPulse 1.5s ease-in-out infinite;z-index:-1}@keyframes backgroundShimmer{0%{left:-100%}50%{left:100%}100%{left:100%}}@keyframes progressFlow{0%{left:-100%;opacity:0}20%{opacity:1}80%{opacity:1}100%{left:100%;opacity:0}}@keyframes progressPulse{0%{opacity:0.5;transform:scale(1)}50%{opacity:0.8;transform:scale(1.05)}100%{opacity:0.5;transform:scale(1)}}.unified-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(120px, 1fr));gap:1.5rem;width:100%;box-sizing:border-box;padding:20px;justify-items:center;align-items:start}.collection-card{position:relative;cursor:pointer;transition:all 0.3s ease;border-radius:12px;overflow:hidden;background:linear-gradient(145deg, rgba(255,255,255,0.1), rgba(255,255,255,0.05));border:2px solid transparent;backdrop-filter:blur(5px);width:120px;height:120px;display:flex;flex-direction:column}.collection-card:hover{transform:translateY(-8px) scale(1.05);box-shadow:0 15px 40px rgba(0,0,0,0.4);border-color:rgba(255,215,0,0.5)}.collection-card .collection-avatar{position:relative;width:100%;height:120px;overflow:hidden;border-radius:8px;flex-shrink:0}.collection-card .collection-avatar img{width:100%;height:100%;object-fit:cover;border-radius:8px;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges}.collection-card .collection-avatar .rarity-border{position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;border-radius:10px;pointer-events:none}.collection-card .collection-avatar .rarity-border.rarity-5{border:2px solid #FFD700;box-shadow:0 0 15px rgba(255,215,0,0.6)}.collection-card .collection-avatar .rarity-border.rarity-4{border:2px solid #DA70D6;box-shadow:0 0 12px rgba(218,112,214,0.5)}.collection-card .collection-avatar .rarity-border.rarity-3{border:2px solid #4169E1;box-shadow:0 0 10px rgba(65,105,225,0.4)}.collection-card .collection-avatar .rarity-border.rarity-2{border:2px solid #32CD32;box-shadow:0 0 8px rgba(50,205,50,0.4)}.collection-card .collection-avatar .rarity-border.rarity-1{border:2px solid #C0C0C0;box-shadow:0 0 6px rgba(192,192,192,0.4)}.collection-card .collection-avatar .collection-star-badge{position:absolute;top:4px;right:4px;background:rgba(0,0,0,0.8);border-radius:4px;padding:2px 4px;display:flex;gap:1px}.collection-card .collection-avatar .collection-star-badge .star-icon{width:12px;height:12px}.collection-card .collection-avatar .collection-count{position:absolute;bottom:4px;right:4px;background:rgba(255,215,0,0.9);color:#000;border-radius:50%;width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:0.7rem;font-weight:bold}.collection-card .collection-avatar .collected-badge{position:absolute;top:4px;left:4px;background:linear-gradient(45deg, lime, #32CD32);color:#000;border-radius:50%;width:18px;height:18px;display:flex;align-items:center;justify-content:center;font-size:0.8rem;font-weight:bold;box-shadow:0 0 10px rgba(0,255,0,0.6)}.collection-card .collection-avatar .unknown-badge{position:absolute;top:4px;left:4px;background:linear-gradient(45deg, #FF6B6B, #FF4757);color:#FFF;border-radius:50%;width:18px;height:18px;display:flex;align-items:center;justify-content:center;font-size:0.9rem;font-weight:bold;text-shadow:0 0 5px rgba(255,255,255,0.8);animation:unknownPulse 2s ease-in-out infinite}.collection-card .collection-info{display:none}.collection-card.collected .collection-avatar .rarity-border{animation:collectedGlow 3s ease-in-out infinite}.collection-card.silhouette{background:linear-gradient(145deg, rgba(0,0,0,0.6), rgba(0,0,0,0.4));border-color:rgba(255,255,255,0.2)}.collection-card.silhouette:hover{border-color:rgba(255,215,0,0.3);background:linear-gradient(145deg, rgba(0,0,0,0.7), rgba(0,0,0,0.5))}.collection-card.silhouette .collection-avatar.silhouette .silhouette-shape{width:100%;height:100%;background:linear-gradient(135deg, rgba(255,255,255,0.1), rgba(255,255,255,0.05), rgba(0,0,0,0.3));border-radius:8px;position:relative;overflow:hidden}.collection-card.silhouette .collection-avatar.silhouette .silhouette-shape::before{content:'👤';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);font-size:2rem;opacity:0.3;filter:grayscale(1)}.collection-card.silhouette .collection-avatar.silhouette .silhouette-shape::after{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg, transparent, rgba(255,255,255,0.1), transparent);animation:silhouetteShine 3s ease-in-out infinite}.collection-card.silhouette .collection-avatar.silhouette .rarity-border.silhouette{border-color:rgba(255,255,255,0.2);box-shadow:none;animation:silhouetteBorderPulse 2s ease-in-out infinite}.collection-card.silhouette .collection-avatar.silhouette .star-icon.silhouette{filter:grayscale(1) brightness(0.4) opacity(0.6)}.collection-card.silhouette .collection-info .collection-name.silhouette{color:rgba(255,255,255,0.4);text-shadow:none}@keyframes progressShine{0%{left:-100%}100%{left:100%}}@keyframes collectedGlow{0%, 100%{box-shadow:0 0 10px rgba(255,215,0,0.3)}50%{box-shadow:0 0 20px rgba(255,215,0,0.8)}}@keyframes silhouetteShine{0%{left:-100%}50%{left:100%}100%{left:100%}}@keyframes silhouetteBorderPulse{0%, 100%{border-color:rgba(255,255,255,0.2);box-shadow:0 0 5px rgba(255,255,255,0.1)}50%{border-color:rgba(255,255,255,0.4);box-shadow:0 0 15px rgba(255,255,255,0.3)}}@keyframes unknownPulse{0%, 100%{box-shadow:0 0 10px rgba(255,107,107,0.6);transform:scale(1)}50%{box-shadow:0 0 20px rgba(255,107,107,0.9);transform:scale(1.1)}}@media (max-width: 768px){.collection-stats{padding:1rem}.collection-stats .stats-header{flex-direction:column;text-align:center}.collection-stats .stats-header .collection-progress{align-items:center}.collection-stats .stats-header .collection-progress .progress-bar-container{width:200px}.collection-stats .rarity-overview{grid-template-columns:repeat(5, 1fr);gap:0.5rem}.collection-stats .rarity-overview .rarity-stat{padding:0.5rem 0.3rem}.collection-stats .rarity-overview .rarity-stat .star-icon{width:14px;height:14px}.collection-stats .rarity-overview .rarity-stat .rarity-count{font-size:0.8rem}.category-header{padding:0.8rem 1rem}.category-header .rarity-stars .star-icon{width:16px;height:16px}.collection-card .collection-avatar .collection-star-badge .star-icon{width:10px;height:10px}.collection-card .collection-avatar .collection-count{width:16px;height:16px;font-size:0.6rem}.collection-card .collection-avatar .collected-badge,.collection-card .collection-avatar .unknown-badge{width:16px;height:16px;font-size:0.7rem}.collection-card .collection-info .collection-name{font-size:0.8rem}}@media (max-width: 480px){.collection-stats .rarity-overview{grid-template-columns:repeat(5, 1fr);gap:0.3rem}.collection-stats .rarity-overview .rarity-stat{padding:0.3rem 0.2rem}.collection-stats .rarity-overview .rarity-stat .star-icon{width:12px;height:12px}.collection-stats .rarity-overview .rarity-stat .rarity-count{font-size:0.7rem}}.map-panel{display:grid;grid-template-columns:2fr 1fr;gap:calc(var(--spacing-unit) * 2);color:#cbd5e1}#world-map{width:100%;height:400px;background:radial-gradient(ellipse at center, rgba(59,130,246,0.1) 0%, transparent 70%);border:2px solid rgba(255,215,0,0.3);border-radius:1rem}.location-list h3{color:#ffd700;margin-bottom:calc(var(--spacing-unit) * 1.5)}.location-item{display:flex;align-items:center;gap:var(--spacing-unit);padding:var(--spacing-unit);background:rgba(0,0,0,0.2);border-radius:0.5rem;margin-bottom:0.75rem;transition:all var(--transition-speed) ease}.location-item:hover{transform:translateX(5px);background:rgba(255,215,0,0.1)}.location-icon{font-size:1.5rem}.map-panel{grid-template-columns:1fr}#world-map{height:250px}[data-theme="light"] #world-map{background:rgba(255,255,255,0.5);border-color:#cbd5e1}[data-theme="light"] .location-item{background:rgba(241,245,249,0.8);color:#1e293b}[data-theme="light"] .location-item:hover{background:rgba(226,232,240,0.9);border-color:#d97706}.reputation-panel h3{color:#ffd700;text-align:center;margin-bottom:calc(var(--spacing-unit) * 2);font-size:1.5rem}.faction-list{display:grid;gap:calc(var(--spacing-unit) * 1.5)}.faction-item{background:rgba(0,0,0,0.3);border:2px solid rgba(148,163,184,0.2);border-radius:0.75rem;padding:calc(var(--spacing-unit) * 1.5);transition:all var(--transition-speed) ease}.faction-item:hover{transform:translateY(-3px);border-color:#ffd700}.faction-icon{font-size:2rem;margin-bottom:0.5rem}.faction-item h4{color:#ffd700;margin-bottom:var(--spacing-unit)}.reputation-bar{height:20px;background:rgba(0,0,0,0.5);border-radius:50px;overflow:hidden;position:relative}.rep-fill{height:100%;border-radius:50px;transition:width 0.6s var(--transition-bounce)}.rep-fill.friendly{background:linear-gradient(90deg, #10b981, #34d399)}.rep-fill.honored{background:linear-gradient(90deg, #3b82f6, #60a5fa)}.rep-fill.revered{background:linear-gradient(90deg, #8b5cf6, #a78bfa)}.rep-fill.exalted{background:linear-gradient(90deg, gold, #ffed4e)}.rep-status{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);color:white;font-weight:bold;font-size:0.8rem;text-shadow:0 0 5px rgba(0,0,0,0.8)}.journal-panel{text-align:center;padding:calc(var(--spacing-unit) * 3)}.journal-panel h3{color:#ffd700;margin-bottom:calc(var(--spacing-unit) * 2);font-size:1.5rem}.journal-link{display:inline-flex;align-items:center;gap:var(--spacing-unit);background:linear-gradient(135deg, gold, #ffed4e);color:#000;padding:1rem 2rem;border-radius:50px;text-decoration:none;font-weight:bold;transition:all var(--transition-speed) ease}.journal-link:hover{transform:translateY(-3px);box-shadow:0 10px 30px rgba(255,215,0,0.5)}.journal-icon{font-size:1.5rem}@media (max-width: 1024px){.status-bar{flex-direction:column;gap:calc(var(--spacing-unit) * 1.5);text-align:center}.player-info{justify-content:center}.resource-bars{width:100%}}@media (max-width: 768px){.tab-btn{padding:0.5rem 0.75rem;font-size:0.8rem;height:40px}.player-avatar{width:60px;height:60px}.achievement-grid{grid-template-columns:1fr;gap:var(--spacing-unit)}}[data-theme="light"] .resource-bar{background:rgba(241,245,249,0.9);border-color:#cbd5e1}[data-theme="light"] .bar-label{color:#475569;text-shadow:1px 1px 2px rgba(0,0,0,0.05)}[data-theme="light"] .bar-container{background:#e2e8f0;border-color:#cbd5e1}[data-theme="light"] .bar-text{color:#1e293b;text-shadow:1px 1px 2px rgba(255,255,255,0.8)}[data-theme="light"] .hp-fill{background:linear-gradient(90deg, #ef4444, #dc2626);box-shadow:0 0 10px rgba(239,68,68,0.3)}[data-theme="light"] .mp-fill{background:linear-gradient(90deg, #3b82f6, #2563eb);box-shadow:0 0 10px rgba(59,130,246,0.3)}[data-theme="light"] .sp-fill{background:linear-gradient(90deg, #10b981, #059669);box-shadow:0 0 10px rgba(16,185,129,0.3)}[data-theme="light"] .exp-fill{background:linear-gradient(90deg, #f59e0b, #d97706) !important;box-shadow:0 0 10px rgba(245,158,11,0.3)}[data-theme="light"] .stats-section{background:rgba(241,245,249,0.6);border-color:#cbd5e1}[data-theme="light"] .attributes-section h3,[data-theme="light"] .stats-section h3{color:#d97706}[data-theme="light"] .branch-btn{background:linear-gradient(135deg, #f1f5f9, #e2e8f0);color:#334155;border-color:#cbd5e1}[data-theme="light"] .branch-btn:hover{background:linear-gradient(135deg, #e2e8f0, #cbd5e1);color:#1e293b}[data-theme="light"] .branch-btn.active{background:linear-gradient(135deg, #f59e0b, #d97706);color:#ffffff;border-color:#d97706}[data-theme="light"] #skill-tree-canvas{background:rgba(255,255,255,0.5);border-color:#cbd5e1}[data-theme="light"] .level-progress{background:linear-gradient(90deg, #f59e0b, #d97706)}[data-theme="light"] .level-text{color:#1e293b}[data-theme="light"] .progress-fill{background:linear-gradient(90deg, #10b981, #059669)}[data-theme="light"] .faction-item{background:rgba(248,250,252,0.8);border-color:#cbd5e1}[data-theme="light"] .faction-item h4{color:#0f172a}[data-theme="light"] .reputation-bar{background:#e2e8f0;border-color:#cbd5e1}[data-theme="light"] .rep-status{color:#1e293b}[data-theme="light"] .journal-link{background:rgba(241,245,249,0.8);color:#334155;border-color:#cbd5e1}[data-theme="light"] .journal-link:hover{background:rgba(226,232,240,0.9);color:#0f172a;border-color:#94a3b8}[data-theme="light"] .damage-popup.damage{color:#dc2626;text-shadow:2px 2px 0 #fff,-2px -2px 0 #fff,2px -2px 0 #fff,-2px 2px 0 #fff,0 0 10px rgba(220,38,38,0.4)}[data-theme="light"] .damage-popup.heal{color:#059669;text-shadow:2px 2px 0 #fff,-2px -2px 0 #fff,2px -2px 0 #fff,-2px 2px 0 #fff,0 0 10px rgba(5,150,105,0.4)}[data-theme="light"] .damage-popup.mana{color:#2563eb;text-shadow:2px 2px 0 #fff,-2px -2px 0 #fff,2px -2px 0 #fff,-2px 2px 0 #fff,0 0 10px rgba(37,99,235,0.4)}[data-theme="light"] .damage-popup.stamina{color:#d97706;text-shadow:2px 2px 0 #fff,-2px -2px 0 #fff,2px -2px 0 #fff,-2px 2px 0 #fff,0 0 10px rgba(217,119,6,0.4)}[data-theme="light"] .pixel-text{color:#1e293b;text-shadow:1px 1px 0 rgba(255,255,255,0.8),-1px -1px 0 rgba(255,255,255,0.8),1px -1px 0 rgba(255,255,255,0.8),-1px 1px 0 rgba(255,255,255,0.8)}[data-theme="light"] .level-badge{background:linear-gradient(135deg, #f59e0b, #d97706);color:#ffffff;border-color:#d97706;text-shadow:1px 1px 2px rgba(0,0,0,0.3)}[data-theme="light"] .player-avatar{border-color:#d97706;box-shadow:0 0 20px rgba(217,119,6,0.5),0 0 40px rgba(217,119,6,0.3)}[data-theme="light"] .player-avatar:hover{box-shadow:0 0 30px rgba(217,119,6,0.7),0 0 60px rgba(217,119,6,0.4)}[data-theme="light"] .avatar-placeholder{background:linear-gradient(135deg, rgba(241,245,249,0.9) 0%, rgba(226,232,240,0.9) 100%);border-color:#d97706;box-shadow:0 0 20px rgba(217,119,6,0.5),0 0 40px rgba(217,119,6,0.3)}[data-theme="light"] .pixel-char{filter:drop-shadow(0 0 5px rgba(217,119,6,0.8)) drop-shadow(0 0 10px rgba(217,119,6,0.6))}[data-theme="light"] .branch-level{color:#64748b}[data-theme="light"] .view-full-tree{background:linear-gradient(135deg, #d97706, #f59e0b);color:#ffffff}[data-theme="light"] .view-full-tree:hover{box-shadow:0 10px 30px rgba(217,119,6,0.5)}[data-theme="dark"] .post-card{background:rgba(30,41,59,0.95);backdrop-filter:blur(15px)}.post-tags{margin-top:var(--spacing-unit);display:flex;gap:0.5rem;flex-wrap:wrap}.level-progress{background:linear-gradient(90deg, gold, #ffed4e, gold);background-size:200% 100%;height:100%;border-radius:50px;position:relative;animation:shimmer 2s linear infinite;box-shadow:0 0 20px rgba(255,215,0,0.5);transition:width 0.6s var(--transition-bounce)}.level-text{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);color:white;font-weight:bold;font-size:0.8rem;text-shadow:0 0 5px rgba(0,0,0,0.5)}.stat-item{background:rgba(0,0,0,0.2);border:1px solid rgba(100,116,139,0.3);border-radius:0.5rem;padding:calc(var(--spacing-unit) * 0.75);display:flex;flex-direction:column;align-items:center;gap:0.25rem;font-size:0.9rem}.stat-icon{font-size:1.5rem}.stat-label{font-size:0.8rem;color:var(--gray-dark)}.stat-value{font-size:1.2rem;font-weight:bold;color:#ffd700}.stat-card{background:linear-gradient(135deg, rgba(30,41,59,0.9) 0%, rgba(51,65,85,0.9) 100%);border:2px solid rgba(255,215,0,0.3);border-radius:1rem;padding:calc(var(--spacing-unit) * 2);text-align:center;position:relative;overflow:hidden;transition:all var(--transition-speed) ease}.stat-card::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg, transparent, rgba(255,215,0,0.1), transparent);transform:translateX(-100%);transition:transform 0.6s ease}.stat-card:hover::before{transform:translateX(100%)}.stat-card:hover{transform:translateY(-5px);box-shadow:0 15px 40px rgba(255,215,0,0.2);border-color:rgba(255,215,0,0.6)}.stat-number{display:block;font-size:2.5rem;font-weight:900;color:#ffd700;text-shadow:0 0 20px rgba(255,215,0,0.5);margin-bottom:0.5rem}.tag{background:linear-gradient(135deg, var(--gradient-1), var(--gradient-2));color:white;padding:0.25rem 0.75rem;border-radius:50px;font-size:0.75rem;font-weight:500;text-transform:lowercase}.view-all-posts{text-align:center;margin-top:calc(var(--spacing-unit) * 3)}.items-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(80px, 1fr));gap:0.75rem}.progress-fill{height:100%;background:linear-gradient(90deg, #10b981, #34d399);border-radius:50px;transition:width 0.6s var(--transition-bounce)}@media (max-width: 768px){.skill-nav-top{justify-content:flex-start}}@media (max-width: 640px){.skill-nav-top{top:10px;padding:calc(var(--spacing-unit) * 0.75);gap:calc(var(--spacing-unit) * 1);max-width:calc(100% - 20px)}.nav-btn{min-width:100px;padding:calc(var(--spacing-unit) * 1) calc(var(--spacing-unit) * 1.5);font-size:0.9rem}.nav-name{font-size:0.85rem}.nav-level{font-size:0.75rem}}