.material-page{--background:212 51% 11%;--foreground:45 30% 97%;--surface:212 45% 15%;--surface-elevated:212 42% 19%;--surface-glass:212 38% 23%;--card:212 45% 15%;--card-foreground:45 30% 97%;--popover:212 45% 15%;--popover-foreground:45 30% 97%;--primary:22 100% 55%;--primary-foreground:212 51% 8%;--primary-glow:45 96% 56%;--secondary:212 38% 23%;--secondary-foreground:45 30% 97%;--muted:212 35% 21%;--muted-foreground:210 18% 78%;--accent:160 84% 39%;--accent-foreground:212 51% 8%;--success:160 84% 39%;--warning:45 96% 56%;--destructive:0 85% 58%;--destructive-foreground:0 0% 100%;--border:212 35% 28%;--border-bright:22 100% 55%;--input:212 35% 22%;--ring:22 100% 55%;--radius:1rem;--gradient-primary:linear-gradient(135deg, #ff6e1a, #fbc523);--gradient-hero:linear-gradient(180deg, #0f1e2e, #091420);--gradient-card:linear-gradient(145deg, #182a3feb, #0e1b2af5);--gradient-border:linear-gradient(135deg, #ff6e1a99, #10b77f59);--gradient-cta:linear-gradient(135deg, #ff6e1a, #f93f06);--shadow-glow:0 0 40px #ff6e1a59;--shadow-glow-strong:0 0 60px #ff6e1a99, 0 0 90px #10b77f33;--shadow-card:0 10px 40px -10px #02070db3;--shadow-elevated:0 20px 60px -20px #02070dcc;--color-background:hsl(var(--background));--color-foreground:hsl(var(--foreground));--color-card:hsl(var(--card));--color-card-foreground:hsl(var(--card-foreground));--color-popover:hsl(var(--popover));--color-popover-foreground:hsl(var(--popover-foreground));--color-primary:hsl(var(--primary));--color-primary-foreground:hsl(var(--primary-foreground));--color-secondary:hsl(var(--secondary));--color-secondary-foreground:hsl(var(--secondary-foreground));--color-muted:hsl(var(--muted));--color-muted-foreground:hsl(var(--muted-foreground));--color-accent:hsl(var(--accent));--color-accent-foreground:hsl(var(--accent-foreground));--color-destructive:hsl(var(--destructive));--color-destructive-foreground:hsl(var(--destructive-foreground));--color-border:hsl(var(--border));--color-input:hsl(var(--input));--color-ring:hsl(var(--ring));background-color:hsl(var(--background));color:hsl(var(--foreground));background-image:var(--gradient-hero);scroll-behavior:smooth;isolation:isolate;background-attachment:fixed;font-family:Space Grotesk,system-ui,sans-serif;position:relative;overflow-x:hidden}.material-page:before{content:"";z-index:-2;pointer-events:none;background-image:linear-gradient(#10b77f14 1px,#0000 1px),linear-gradient(90deg,#10b77f14 1px,#0000 1px);background-size:48px 48px;position:fixed;inset:0;-webkit-mask-image:radial-gradient(#000 30%,#0000 80%);mask-image:radial-gradient(#000 30%,#0000 80%)}.material-page:after{content:"";z-index:-1;pointer-events:none;filter:blur(40px);background:radial-gradient(50% 50% at 10% 0,#ff6e1a47,#0000 70%),radial-gradient(40% 40% at 95% 30%,#10b77f38,#0000 70%),radial-gradient(45% 45% at 30% 90%,#fbc52329,#0000 70%),radial-gradient(35% 35% at 80% 100%,#ff6e1a2e,#0000 70%);animation:18s ease-in-out infinite alternate material-aurora;position:fixed;inset:0}@keyframes material-aurora{0%{opacity:.95;transform:translate(0)scale(1)}50%{opacity:1;transform:translate(-2%,1%)scale(1.08)}to{opacity:.9;transform:translate(2%,-1%)scale(1.04)}}.material-page .container{width:100%;max-width:1200px;margin-inline:auto;padding-inline:1rem}@media(min-width:768px){.material-page .container{padding-inline:2rem}}.material-page h1,.material-page h2,.material-page h3,.material-page h4,.material-page h5{letter-spacing:-.02em;font-family:Space Grotesk,sans-serif}.material-page section[id]{scroll-margin-top:6rem}.material-page .font-display{font-family:Space Grotesk,sans-serif}.material-page .font-mono{font-family:JetBrains Mono,monospace}.material-page .glass-card{-webkit-backdrop-filter:blur(24px)saturate(140%);backdrop-filter:blur(24px)saturate(140%);box-shadow:var(--shadow-card),inset 0 1px #ffffff0f;background:linear-gradient(145deg,#182a3f8c,#0e1b2abf);border:1px solid #ffffff14;position:relative}.material-page .glass-card:after{content:"";border-radius:inherit;pointer-events:none;opacity:.6;background:linear-gradient(135deg,#ff6e1a59,#0000 40%,#10b77f4d);padding:1px;transition:opacity .4s;position:absolute;inset:-1px;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.material-page .glass-card:hover:after{opacity:1}.material-page .glow-border{position:relative}.material-page .glow-border:before{content:"";border-radius:inherit;background:var(--gradient-border);pointer-events:none;padding:1px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.material-page .text-gradient{background:var(--gradient-primary);color:#0000;-webkit-background-clip:text;background-clip:text}.material-page .scanline-bg{background-image:linear-gradient(hsl(var(--border) / .4) 1px,transparent 1px),linear-gradient(90deg,hsl(var(--border) / .4) 1px,transparent 1px);background-size:40px 40px}.material-page .shadow-glow{box-shadow:var(--shadow-glow)}.material-page .shadow-glow-strong{box-shadow:var(--shadow-glow-strong)}.material-page .shadow-elevated{box-shadow:var(--shadow-elevated)}.material-page .bg-gradient-primary{background:var(--gradient-primary)}.material-page .bg-gradient-cta{background:var(--gradient-cta)}.material-page .bg-surface{background-color:hsl(var(--surface))}.material-page .bg-surface-elevated{background-color:hsl(var(--surface-elevated))}.material-page .hover\:bg-surface\/60:hover,.material-page .bg-surface\/60{background-color:hsl(var(--surface) / .6)}.material-page .bg-surface\/40{background-color:hsl(var(--surface) / .4)}.material-page .bg-surface\/50{background-color:hsl(var(--surface) / .5)}@keyframes material-pulse-glow{0%,to{box-shadow:0 0 20px hsl(var(--primary) / .3)}50%{box-shadow:0 0 40px hsl(var(--primary) / .6)}}@keyframes material-float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.material-page .animate-pulse-glow{animation:3s ease-in-out infinite material-pulse-glow}.material-page .animate-float{animation:6s ease-in-out infinite material-float}