.error-page{color:#fff;background:linear-gradient(135deg,#0a0a1a 0%,#1a1a2e 50%,#0f0f20 100%);flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:40px 20px;display:flex;position:relative;overflow:hidden}.error-page.mounted .error-content{opacity:1;transform:translateY(0)}.error-bg{pointer-events:none;position:absolute;inset:0;overflow:hidden}.floating-shape{opacity:.1;border-radius:50%;animation:8s ease-in-out infinite floatShape;position:absolute}.shape-1{background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 100%);width:400px;height:400px;top:-150px;left:-150px}.shape-2{background:linear-gradient(135deg,#3b82f6 0%,#06b6d4 100%);width:300px;height:300px;animation-delay:-2s;bottom:-100px;right:-100px}.shape-3{background:linear-gradient(135deg,#8b5cf6 0%,#ec4899 100%);width:200px;height:200px;animation-delay:-4s;top:50%;left:10%}.shape-4{background:linear-gradient(135deg,#f59e0b 0%,#ef4444 100%);width:150px;height:150px;animation-delay:-1s;top:20%;right:15%}.shape-5{background:linear-gradient(135deg,#10b981 0%,#3b82f6 100%);width:100px;height:100px;animation-delay:-3s;bottom:30%;left:20%}@keyframes floatShape{0%,to{transform:translate(0)rotate(0)}25%{transform:translate(30px,-30px)rotate(5deg)}50%{transform:translateY(-50px)rotate(0)}75%{transform:translate(-30px,-30px)rotate(-5deg)}}.error-content{text-align:center;z-index:10;opacity:0;max-width:600px;transition:all .8s cubic-bezier(.4,0,.2,1);transform:translateY(30px)}.error-code-container{margin-bottom:20px;position:relative}.error-code{background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 50%,#ec4899 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin:0;font-size:140px;font-weight:800;line-height:1;position:relative}.error-code-shadow{color:#6366f11a;z-index:-1;font-size:140px;font-weight:800;line-height:1;animation:3s ease-in-out infinite shadowPulse;position:absolute;top:10px;left:50%;transform:translate(-50%)}@keyframes shadowPulse{0%,to{opacity:.1;transform:translate(-50%)scale(1)}50%{opacity:.2;transform:translate(-50%)scale(1.02)}}.glitch{animation:3s infinite glitch}.glitch:before,.glitch:after{content:attr(data-text);background:linear-gradient(135deg,#0a0a1a 0%,#1a1a2e 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;width:100%;position:absolute;top:0;left:50%;transform:translate(-50%)}.glitch:before{clip-path:polygon(0 0,100% 0,100% 33%,0 33%);animation:3s infinite glitchTop}.glitch:after{clip-path:polygon(0 67%,100% 67%,100% 100%,0 100%);animation:3s infinite glitchBottom}@keyframes glitch{0%,90%,to{transform:none}92%{transform:skew(.5deg)}94%{transform:skew(-.5deg)}96%{transform:skew(.3deg)}98%{transform:skew(-.3deg)}}@keyframes glitchTop{0%,90%,to{transform:translate(-50%)}92%{transform:translate(calc(8px - 50%))}94%{transform:translate(calc(-50% - 8px))}96%{transform:translate(calc(4px - 50%))}}@keyframes glitchBottom{0%,90%,to{transform:translate(-50%)}92%{transform:translate(calc(-50% - 8px))}94%{transform:translate(calc(8px - 50%))}96%{transform:translate(calc(-50% - 4px))}}.shake{animation:.5s infinite paused shake}.error-page:hover .shake{animation-play-state:running}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-4px)}20%,40%,60%,80%{transform:translate(4px)}}.error-icon{margin-bottom:30px;position:relative}.icon-circle{z-index:2;background:linear-gradient(135deg,#6366f133 0%,#8b5cf61a 100%);border-radius:50%;justify-content:center;align-items:center;width:100px;height:100px;margin:0 auto;animation:4s ease-in-out infinite iconFloat;display:flex;position:relative}.icon-circle i{background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:42px}.icon-circle.warning{background:linear-gradient(135deg,#f59e0b33 0%,#ef44441a 100%)}.icon-circle.warning i{background:linear-gradient(135deg,#f59e0b 0%,#ef4444 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}@keyframes iconFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.icon-pulse{border:2px solid #6366f14d;border-radius:50%;width:100px;height:100px;animation:2s ease-out infinite pulseRing;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.icon-pulse.warning{border-color:#f59e0b4d}.icon-pulse.delay-1{animation-delay:.5s}.icon-pulse.delay-2{animation-delay:1s}@keyframes pulseRing{0%{opacity:1;transform:translate(-50%,-50%)scale(1)}to{opacity:0;transform:translate(-50%,-50%)scale(2)}}.error-title{color:#fff;margin:0 0 16px;font-size:28px;font-weight:700}.error-description{color:#fff9;margin:0 0 24px;font-size:16px;line-height:1.7}.error-hint{color:#a5b4fc;background:#6366f11a;border:1px solid #6366f133;border-radius:30px;align-items:center;gap:10px;margin-bottom:30px;padding:12px 20px;font-size:14px;display:inline-flex}.error-hint i{color:#fbbf24}.error-actions{flex-wrap:wrap;justify-content:center;gap:16px;margin-bottom:40px;display:flex}.error-btn{cursor:pointer;border:none;border-radius:14px;align-items:center;gap:10px;padding:14px 28px;font-size:15px;font-weight:600;text-decoration:none;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex}.error-btn.primary{color:#fff;background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 100%);box-shadow:0 8px 30px #6366f14d}.error-btn.primary:hover{transform:translateY(-3px);box-shadow:0 15px 40px #6366f166}.error-btn.secondary{color:#fffc;background:#ffffff0d;border:1px solid #ffffff1a}.error-btn.secondary:hover{background:#ffffff1a;border-color:#fff3;transform:translateY(-2px)}.error-details{text-align:left;max-width:400px;margin-bottom:30px;margin-left:auto;margin-right:auto}.error-details summary{color:#f87171;cursor:pointer;background:#ef44441a;border:1px solid #ef444433;border-radius:8px;align-items:center;gap:8px;padding:10px 16px;font-size:13px;transition:all .2s;display:inline-flex}.error-details summary:hover{background:#ef444426}.error-details[open] summary{border-radius:8px 8px 0 0}.details-content{background:#0000004d;border:1px solid #ef444433;border-top:none;border-radius:0 0 8px 8px;padding:12px 16px}.details-content code{color:#f87171;word-break:break-all;font-family:Fira Code,monospace;font-size:12px}.astronaut-container{width:200px;height:150px;margin:0 auto;position:relative}.astronaut{animation:6s ease-in-out infinite astronautFloat;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}@keyframes astronautFloat{0%,to{transform:translate(-50%,-50%)rotate(-5deg)}50%{transform:translate(-50%,calc(-50% - 20px))rotate(5deg)}}.astronaut-body{width:60px;height:80px;position:relative}.helmet{background:linear-gradient(135deg,#e5e7eb 0%,#9ca3af 100%);border-radius:50%;width:40px;height:40px;position:absolute;top:0;left:50%;overflow:hidden;transform:translate(-50%)}.visor{background:linear-gradient(135deg,#1e3a5f 0%,#0c1929 100%);border-radius:15px 15px 10px 10px;width:30px;height:25px;position:absolute;top:8px;left:50%;transform:translate(-50%)}.visor:after{content:"";background:#ffffff4d;border-radius:50%;width:8px;height:8px;position:absolute;top:3px;left:3px}.body-main{background:linear-gradient(135deg,#e5e7eb 0%,#9ca3af 100%);border-radius:8px;width:35px;height:35px;position:absolute;top:35px;left:50%;transform:translate(-50%)}.arm{background:linear-gradient(135deg,#e5e7eb 0%,#9ca3af 100%);border-radius:6px;width:12px;height:25px;position:absolute;top:38px}.arm.arm-left{animation:2s ease-in-out infinite armWave;left:2px;transform:rotate(20deg)}.arm.arm-right{animation:2s ease-in-out .5s infinite armWave;right:2px;transform:rotate(-20deg)}@keyframes armWave{0%,to{transform:rotate(20deg)}50%{transform:rotate(40deg)}}.leg{background:linear-gradient(135deg,#e5e7eb 0%,#9ca3af 100%);border-radius:6px;width:12px;height:20px;position:absolute;top:65px}.leg.leg-left{left:12px;transform:rotate(10deg)}.leg.leg-right{right:12px;transform:rotate(-10deg)}.stars .star{background:#fff;border-radius:50%;width:3px;height:3px;animation:2s ease-in-out infinite twinkle;position:absolute}@keyframes twinkle{0%,to{opacity:.3;transform:scale(1)}50%{opacity:1;transform:scale(1.5)}}.robot-container{width:150px;height:150px;margin:0 auto;position:relative}.robot{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.robot-head{background:linear-gradient(135deg,#4a5568 0%,#2d3748 100%);border-radius:10px 10px 5px 5px;width:60px;height:50px;margin:0 auto;animation:.3s infinite robotShake;position:relative}@keyframes robotShake{0%,to{transform:translate(0)}25%{transform:translate(-2px)}75%{transform:translate(2px)}}.robot-eye{background:#22c55e;border-radius:50%;width:12px;height:12px;animation:3s infinite blink;position:absolute;top:15px;box-shadow:0 0 10px #22c55e}.robot-eye.left{left:12px}.robot-eye.right{right:12px}.robot-eye.broken{background:#ef4444;animation:.2s infinite flicker;box-shadow:0 0 10px #ef4444}@keyframes blink{0%,90%,to{transform:scaleY(1)}95%{transform:scaleY(.1)}}@keyframes flicker{0%,to{opacity:1}50%{opacity:.3}}.robot-mouth{background:#1a202c;border-radius:0 0 4px 4px;width:20px;height:8px;position:absolute;bottom:8px;left:50%;transform:translate(-50%)}.robot-mouth.sad{border-radius:4px 4px 0 0;bottom:12px}.robot-body{background:linear-gradient(135deg,#4a5568 0%,#2d3748 100%);border-radius:5px;width:50px;height:40px;margin:5px auto 0;position:relative}.sparks{position:absolute;top:-10px;left:50%;transform:translate(-50%)}.spark{background:#fbbf24;border-radius:50%;width:4px;height:4px;animation:.5s ease-out infinite sparkFly;position:absolute}.spark:first-child{animation-delay:0s}.spark:nth-child(2){animation-delay:.15s}.spark:nth-child(3){animation-delay:.3s}@keyframes sparkFly{0%{opacity:1;transform:translate(0)}to{transform:translate(var(--x,20px),var(--y,-20px));opacity:0}}.spark:first-child{--x:-15px;--y:-25px}.spark:nth-child(2){--x:0px;--y:-30px}.spark:nth-child(3){--x:15px;--y:-25px}.robot-arms{justify-content:space-between;width:80px;margin:-35px auto 0;display:flex}.robot-arms .arm{background:linear-gradient(135deg,#4a5568 0%,#2d3748 100%);border-radius:5px;width:10px;height:30px}.robot-arms .arm.left{transform:rotate(30deg)}.robot-arms .arm.right{transform:rotate(-30deg)}.smoke{position:absolute;bottom:20px;left:50%;transform:translate(-50%)}.smoke-particle{background:#64646466;border-radius:50%;width:15px;height:15px;animation:2s ease-out infinite smokeRise;position:absolute}.smoke-particle:first-child{animation-delay:0s}.smoke-particle:nth-child(2){animation-delay:.5s;left:-10px}.smoke-particle:nth-child(3){animation-delay:1s;left:10px}@keyframes smokeRise{0%{opacity:.6;transform:translateY(0)scale(1)}to{opacity:0;transform:translateY(-50px)scale(2)}}.glitch-lines{pointer-events:none;background:repeating-linear-gradient(0deg,#0000,#0000 2px,#ffffff05 2px 4px);animation:8s linear infinite scanline;position:absolute;inset:0}@keyframes scanline{0%{background-position:0 0}to{background-position:0 100vh}}.error-footer{z-index:10;margin-top:auto;padding-top:40px}.error-footer p{color:#ffffff4d;margin:0;font-size:12px}@media (max-width:600px){.error-code,.error-code-shadow{font-size:100px}.error-title{font-size:22px}.error-description{font-size:14px}.error-actions{flex-direction:column}.error-btn{justify-content:center;width:100%}.icon-circle{width:80px;height:80px}.icon-circle i{font-size:32px}.icon-pulse{width:80px;height:80px}.astronaut-container,.robot-container{transform:scale(.8)}}html[data-theme=light] .error-page{background:linear-gradient(135deg,#f8f9fa 0%,#fff 50%,#f0f2f5 100%)}html[data-theme=light] .error-title{color:#1a1a2e}html[data-theme=light] .error-description{color:#1a1a1a99}html[data-theme=light] .error-hint{color:#6366f1;background:#6366f114;border-color:#6366f126}html[data-theme=light] .error-btn.secondary{color:#1a1a1acc;background:#00000008;border-color:#0000001a}html[data-theme=light] .error-btn.secondary:hover{background:#0000000f}html[data-theme=light] .error-footer p{color:#1a1a1a4d}html[data-theme=light] .floating-shape{opacity:.05}html[data-theme=light] .icon-circle{background:linear-gradient(135deg,#6366f126 0%,#8b5cf614 100%)}html[data-theme=light] .icon-circle.warning{background:linear-gradient(135deg,#f59e0b26 0%,#ef444414 100%)}html[data-theme=light] .error-details summary{background:#ef444414;border-color:#ef444426}html[data-theme=light] .details-content{background:#00000008;border-color:#ef444426}html[data-theme=light] .glitch-lines{background:repeating-linear-gradient(0deg,#0000,#0000 2px,#00000003 2px 4px)}
