/* Decorative layers never intercept page interactions. */
.hero-landscape{pointer-events:none;background:var(--paper)}
.hero-landscape [hidden]{display:none!important}
.hero-landscape .hero-silk{transform-origin:50% 70%;backface-visibility:hidden}
.hero[data-background=original] .hero-silk{animation:none;transform:none}
.hero-aurora,.hero-canvas,.hero-silk-canvas,.hero-scene-shield{position:absolute;inset:0;width:100%;height:100%}
.hero-aurora{overflow:hidden}
.aurora-glow{position:absolute;width:85%;height:120%;border-radius:50%;animation-duration:24s;animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-direction:alternate}
.aurora-glow-a{left:-32%;bottom:-52%;background:radial-gradient(ellipse,#b79bdb65 0%,#c8afe938 34%,transparent 68%);animation-name:aurora-left}
.aurora-glow-b{right:-30%;bottom:-30%;background:radial-gradient(ellipse,#e6b29366 0%,#edc6ac36 34%,transparent 68%);animation-name:aurora-right;animation-duration:29s;animation-delay:-9s}
.aurora-glow-c{left:14%;bottom:-80%;background:radial-gradient(ellipse,#8fbac970 0%,#b0cee236 34%,transparent 68%);animation-name:aurora-bottom;animation-duration:31s;animation-delay:-14s}
@keyframes aurora-left{to{transform:translate(14%,-5%) scale(1.12,1.04)}}
@keyframes aurora-right{to{transform:translate(-13%,13%) scale(1.03,1.19)}}
@keyframes aurora-bottom{to{transform:translate(13%,-14%) scale(1.15,1.08)}}
.hero-scene-shield{display:none;background:radial-gradient(ellipse 40% 42% at 50% 24%,var(--paper) 24%,#fbfaf8d9 53%,#fbfaf800 100%)}
.hero[data-background=network] .hero-scene-shield{display:block}
.hero[data-motion=paused] .hero-silk,.hero[data-motion=paused] .aurora-glow{animation-play-state:paused}
.hero-canvas{display:block}
.background-tools{position:fixed;right:24px;top:184px;z-index:26;font-family:var(--font);color:#332b3c}
.background-tools-toggle{display:grid;place-items:center;width:48px;height:48px;border:1px solid #ddd4e6;border-radius:15px;background:#ffffffef;box-shadow:0 6px 22px #30233d0e;color:#785492;cursor:pointer;transition:background .2s,box-shadow .2s}
.background-tools-toggle:hover,.background-tools-toggle[aria-expanded=true]{background:#eee5f6;box-shadow:0 6px 22px #30233d17}
.background-tools-toggle .icon{width:22px;height:22px}
.background-panel{position:absolute;right:60px;top:-58px;width:382px;max-width:calc(100vw - 90px);max-height:calc(100dvh - 150px);overflow:auto;overscroll-behavior:contain;background:#fff;border:1px solid #e7dfed;border-radius:20px;padding:21px;box-shadow:0 16px 65px #33213d26}
.background-panel[hidden]{display:none}
.background-panel-header{display:flex;justify-content:space-between;align-items:start;gap:15px;margin-bottom:20px}
.background-panel h2{font:500 1.125rem/1.4 var(--font)}
.background-panel-header p{font-size:.75rem;color:#9b8da5;line-height:1.6;margin-top:4px}
.background-panel-close{display:grid;place-items:center;width:28px;height:28px;padding:0;border:0;border-radius:7px;color:#8e7c9e;background:#f5f1f8;cursor:pointer;flex-shrink:0}
.background-panel-close .icon{width:17px;height:17px}
.scene-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.scene-option{font:400 .8125rem/1.45 var(--font);text-align:left;border:1px solid #e6e0eb;border-radius:12px;overflow:hidden;padding:0;background:#fff;cursor:pointer;min-width:0;color:#665273;transition:border-color .2s,background .2s}
.scene-option:hover{border-color:#ba9bce;background:#fcf9ff}
.scene-option[aria-checked=true]{border-color:#aa81c5;background:#f8f3fd;box-shadow:inset 0 0 0 1px #aa81c530}
.scene-preview{display:block;width:100%;height:70px;background:#fbfaf8;border-bottom:1px solid #eee8f2;object-fit:cover}
.scene-preview-silk{background:#fbfaf8 url('assets/hero-wave.webp') center 72%/cover no-repeat}
.scene-option-title{display:flex;align-items:center;justify-content:space-between;gap:4px;padding:9px 10px 0;font-weight:500;font-size:.8125rem}
.scene-selected{visibility:hidden;display:inline-flex;flex-shrink:0}.scene-selected .icon{width:14px;height:14px;color:#9266af}
.scene-option[aria-checked=true] .scene-selected{visibility:visible}
.scene-option-description{display:block;padding:4px 10px 11px;color:#a494ae;font-size:.75rem;line-height:1.5}
.scene-original{grid-column:1/-1;display:flex;align-items:center;gap:8px;padding:11px 10px;font-size:.75rem}
.scene-original-note{margin-left:auto;color:#a69bad;font-size:.75rem}
.motion-toggle{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;padding:12px 8px;border:1px solid #e1d7e9;border-radius:10px;background:#fff;color:#796384;font:400 .8125rem/1.5 var(--font);cursor:pointer;margin-top:16px}
.motion-toggle:hover{background:#f8f4fb}.motion-toggle:disabled{opacity:.6;cursor:default}.motion-toggle .icon{width:16px;height:16px}
.background-status{font-size:.75rem;line-height:1.6;color:#8b6d9f;margin-top:14px}.background-panel-note{font-size:.75rem;line-height:1.65;color:#a194aa;margin-top:7px}
@media(max-width:760px){.background-tools{right:14px;top:150px}.background-tools-toggle{width:43px;height:43px;border-radius:13px}.background-panel{right:53px;top:-53px;width:365px;max-width:calc(100vw - 82px);max-height:calc(100dvh - 116px);padding:17px}.scene-options{gap:8px}.scene-preview{height:58px}.scene-option-title{font-size:.75rem;padding:8px 8px 0}.scene-option-description{font-size:.75rem;padding:4px 8px 9px}.scene-original{flex-wrap:wrap}.scene-original-note{margin-left:0}.scene-original .scene-selected{margin-left:auto}.background-panel h2{font-size:1rem}.background-panel-header{gap:8px}}
@media(prefers-reduced-motion:reduce){.hero[data-background=silk] .hero-silk,.aurora-glow{animation:none!important}.scene-option,.background-tools-toggle{transition:none}}
.hero-silk-canvas{display:block}

@media(max-width:760px){.background-tools{right:67px;top:97px}.background-panel{right:-53px;top:53px;max-width:calc(100vw - 28px);max-height:calc(100dvh - 170px)}}

.hero-grainient-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.hero[data-background=grainient] .hero-landscape{background:linear-gradient(135deg,#ff9ffc,#5227ff 52%,#b497cf)}
.scene-preview-grainient{background:linear-gradient(135deg,#ff9ffc,#5227ff 52%,#b497cf)}

.scene-preview-horizon{display:block;background:#10080b url('assets/hero-horizon.jpg') center/cover}

.hero-waves-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.hero[data-background=waves] .hero-landscape{background:#101016}
.scene-preview-waves{background:radial-gradient(ellipse at 70% 110%,#fba3b9aa,transparent 45%),radial-gradient(ellipse at 30% 100%,#950346,transparent 75%),#101016}