/* Motion is progressive: all content is visible without JavaScript. */
@media(prefers-reduced-motion:no-preference){
 @view-transition{navigation:auto}
 ::view-transition-old(root){animation:se-page-out .16s ease-out both}
 ::view-transition-new(root){animation:se-page-in .24s ease-out both}
}
@keyframes se-page-out{to{opacity:0}}
@keyframes se-page-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.se-home .home-hero{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(260px,1fr);align-items:center;gap:42px;isolation:isolate}
.se-home .home-hero-content{min-width:0;position:relative;z-index:2}
.se-home .home-hero h1{font-size:clamp(2rem,4.2vw,3.5rem)}
.se-home .home-motion-art{position:relative;min-width:0;height:360px;pointer-events:none;isolation:isolate}
.se-home .home-liquid{position:absolute;inset:10%;transform:translate3d(0,var(--parallax-y,0px),0);will-change:transform}
.se-home .liquid-orb{display:block;position:absolute;inset:0;border-radius:48% 52% 57% 43% / 46% 42% 58% 54%;background:linear-gradient(125deg,var(--primary),var(--accent),color-mix(in srgb,var(--primary) 40%,var(--surface)));background-size:240% 240%;animation:se-liquid-flow 14s ease-in-out infinite,se-gradient-drift 12s ease-in-out infinite;opacity:.88;box-shadow:0 28px 65px color-mix(in srgb,var(--primary) 22%,transparent)}
.se-home .orb-two{inset:12% -5% -8% 20%;background:linear-gradient(135deg,var(--accent),color-mix(in srgb,var(--surface) 40%,var(--primary)));opacity:.6;animation-delay:-5s;animation-duration:18s,15s;mix-blend-mode:screen}
.se-home .orb-three{inset:15% 30% 35% -8%;background:linear-gradient(135deg,var(--surface),var(--primary));opacity:.45;animation-delay:-8s}
.se-home .liquid-ring{position:absolute;inset:-6%;border:1px solid color-mix(in srgb,var(--primary) 24%,transparent);border-radius:50%;transform:rotate(-20deg) scaleY(.8)}
.se-home .motion-grid{position:absolute;inset:0;background-image:radial-gradient(color-mix(in srgb,var(--text) 15%,transparent) 1px,transparent 1px);background-size:20px 20px;mask-image:radial-gradient(ellipse,#000,transparent 70%);z-index:-1}
.se-home .motion-tool{position:absolute;display:grid;place-items:center;width:76px;height:76px;border-radius:18px;border:1px solid color-mix(in srgb,var(--surface) 65%,transparent);background:color-mix(in srgb,var(--surface) 88%,transparent);color:var(--primary);box-shadow:0 15px 35px color-mix(in srgb,var(--text) 12%,transparent);animation:se-tool-float 6s ease-in-out infinite}
.se-home .motion-tool-one{top:8%;left:12%;transform:rotate(-10deg)}
.se-home .motion-tool-two{right:0;top:40%;animation-delay:-2s}
.se-home .motion-tool-three{left:20%;bottom:0;animation-delay:-4s}
.se-home .home-motion-toggle{display:inline-flex;align-items:center;min-height:44px;padding:8px 0;margin-top:8px;border:0;background:transparent;color:var(--muted);font:inherit;font-size:.75rem;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.se-home .home-search-row{background:linear-gradient(var(--surface),var(--surface)) padding-box,linear-gradient(110deg,var(--primary),var(--accent),var(--primary)) border-box;border:1px solid transparent;box-shadow:0 10px 30px color-mix(in srgb,var(--primary) 8%,transparent)}
.se-archive :is(.tool-card,.post-card,.home-category,.btn){transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease,background-color .2s ease}
.se-archive :is(.tool-card,.post-card,.home-category):hover{transform:translateY(-4px);box-shadow:0 12px 28px color-mix(in srgb,var(--text) 8%,transparent)}
.se-archive .archive-card-action>span{transition:transform .2s ease}
.se-archive :is(.tool-card,.post-card):hover .archive-card-action>span{transform:translateX(4px)}
.se-archive .btn:hover{transform:translateY(-2px)}
.se-archive .btn:active{transform:translateY(1px) scale(.985)}
.se-archive .btn-primary{background:linear-gradient(115deg,var(--primary),var(--accent),var(--primary));background-size:200% 200%;color:#fff}
.se-archive .btn-primary:hover{background-position:100% 50%}
.se-home .home-suggestions{animation:se-pop-in .18s ease-out both;transform-origin:top center}
@keyframes se-pop-in{from{opacity:0;transform:translateY(-6px) scale(.99)}to{opacity:1;transform:none}}
@keyframes se-liquid-flow{0%,100%{border-radius:48% 52% 57% 43% / 46% 42% 58% 54%;transform:rotate(-8deg) scale(.96)}50%{border-radius:61% 39% 42% 58% / 54% 61% 39% 46%;transform:rotate(12deg) scale(1.04)}}
@keyframes se-gradient-drift{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes se-tool-float{0%,100%{translate:0 0;rotate:-6deg}50%{translate:0 -12px;rotate:6deg}}
.se-archive .home-section-head,.se-archive .archive-heading{scroll-margin-top:100px}
.se-scroll-heading{position:relative;padding-inline-start:18px}
.se-scroll-heading::before{content:"";position:absolute;inset-inline-start:0;top:4px;width:3px;height:calc(100% - 8px);background:linear-gradient(var(--primary),var(--accent));border-radius:4px}
.se-motion-paused .se-home .liquid-orb,.se-motion-paused .se-home .motion-tool,.se-motion-offscreen .se-home .liquid-orb,.se-motion-offscreen .se-home .motion-tool{animation-play-state:paused}
.se-motion-paused .se-home .home-liquid{transform:none;will-change:auto}
.se-loading-overlay{position:fixed;inset:76px 0 0;background:var(--bg);z-index:90;padding:36px max(20px,calc((100vw - 1180px)/2));overflow:auto;pointer-events:none;contain:layout paint}
.se-loading-overlay[hidden]{display:none!important}
.se-loading-note{font-size:.9rem;color:var(--muted);margin-bottom:26px}
.se-skeleton-heading,.se-skeleton-line,.se-skeleton-icon{background:color-mix(in srgb,var(--text) 9%,var(--surface));border-radius:6px;position:relative;overflow:hidden}
.se-skeleton-heading{height:38px;max-width:420px;margin-bottom:16px}
.se-skeleton-line{height:12px;width:100%;margin-top:14px}
.se-skeleton-line.short{width:65%}
.se-skeleton-icon{width:44px;height:44px;border-radius:9px;margin-bottom:28px}
.se-skeleton-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:40px}
.se-skeleton-card{padding:24px;border:1px solid color-mix(in srgb,var(--text) 12%,transparent);border-radius:12px;min-height:220px;background:var(--surface)}
.se-skeleton-line::after,.se-skeleton-heading::after,.se-skeleton-icon::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--surface) 80%,transparent),transparent);transform:translateX(-100%);animation:se-shimmer 1.3s ease-in-out infinite}
@keyframes se-shimmer{to{transform:translateX(100%)}}
@media(max-width:1000px){.se-home .home-hero{grid-template-columns:minmax(0,1.6fr) minmax(220px,1fr);gap:24px}.se-home .home-motion-art{height:280px}.se-home .motion-tool{width:60px;height:60px}.se-skeleton-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.se-home .home-hero{grid-template-columns:minmax(0,1fr);gap:20px}.se-home .home-motion-art{height:210px;max-width:320px;width:100%;justify-self:center;grid-row:auto}.se-home .home-motion-art .home-liquid{inset:8% 18%}.se-home .motion-tool-one{top:4%;left:18%}.se-home .motion-tool-two{right:8%}.se-home .motion-tool-three{left:28%}.se-home .home-hero h1{font-size:clamp(2rem,7vw,2.8rem)}.se-home .home-motion-toggle{margin-top:0}.se-skeleton-grid{grid-template-columns:minmax(0,1fr)}.se-loading-overlay{padding-top:26px}}
@media(prefers-reduced-motion:reduce){
 @view-transition{navigation:none}
 ::view-transition-old(root),::view-transition-new(root){animation:none}
 .se-home .liquid-orb,.se-home .motion-tool,.se-home .home-suggestions,.se-loading-overlay *::after{animation:none!important}
 .se-home .home-liquid{transform:none;will-change:auto}
 .se-archive :is(.tool-card,.post-card,.home-category,.btn),.se-archive .archive-card-action>span{transition:none}
 .se-archive :is(.tool-card,.post-card,.home-category,.btn):hover,.se-archive .btn:active,.se-archive :is(.tool-card,.post-card):hover .archive-card-action>span{transform:none}
}

.se-motion-paused .se-home .home-suggestions,.se-motion-paused .se-loading-overlay *::after{animation:none!important}
html.se-motion-paused::view-transition-old(root),html.se-motion-paused::view-transition-new(root){animation:none}
.se-motion-paused .se-archive :is(.tool-card,.post-card,.home-category,.btn),.se-motion-paused .se-archive .archive-card-action>span{transition:none}
.se-motion-paused .se-archive :is(.tool-card,.post-card,.home-category,.btn):hover,.se-motion-paused .se-archive .btn:active{transform:none}

html:not(.se-motion-enabled) .se-home .liquid-orb,html:not(.se-motion-enabled) .se-home .motion-tool{animation:none}