/* kit v1 — shared: paper grain + explore panel (page-specific texture/blue overrides live in each page's #kitv1-strong block, injected at end of body so they win the cascade) */
.grain{position:fixed;inset:0;pointer-events:none;z-index:9990;opacity:.075;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='280' height='280'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:280px 280px}
/* grunge ink edges — stamps and chips only; soft edge on buttons so text stays crisp */
.loop-tag .lt,.about-photo .stamp,.pgstamp{filter:url(#grungeEdge)}
.wmchip,.btn,.kicker{filter:url(#grungeSoft)}

/* ---- delight layer (paired with scripts/delight-v1.js) ---- */
@media (prefers-reduced-motion: no-preference){
.rv{opacity:0;translate:0 16px;transition:opacity .55s ease,translate .6s cubic-bezier(.2,.8,.25,1);transition-delay:var(--rvd,0ms)}
.rv.in{opacity:1;translate:none}
.tk{opacity:0;translate:-10px 0;transition:opacity .4s ease,translate .4s cubic-bezier(.2,.8,.25,1)}
.tk.in{opacity:1;translate:none}
.tk svg path{stroke-dasharray:24;stroke-dashoffset:24}
.tk.in svg path{animation:mrwDraw .5s .12s ease forwards}
@keyframes mrwDraw{to{stroke-dashoffset:0}}
.slam{opacity:0}
.slam.in{animation:mrwSlam .5s cubic-bezier(.2,1.4,.4,1) forwards}
@keyframes mrwSlam{0%{opacity:0;scale:1.7;rotate:-8deg}55%{opacity:1;scale:.94;rotate:2deg}100%{opacity:1;scale:1;rotate:0deg}}
.wfp{opacity:0;translate:0 12px;transition:opacity .5s ease,translate .5s cubic-bezier(.2,.8,.25,1)}
.wfp.in{opacity:1;translate:none}
.wf .varrow{transition:scale .4s ease;transform-origin:top center}
.wf .varrow:not(.in){scale:1 .2}
.wf.ran .hub .face{animation:mrwWave 1.6s ease}
@keyframes mrwWave{0%,100%{rotate:0deg}15%{rotate:-7deg}35%{rotate:6deg}55%{rotate:-4deg}75%{rotate:2deg}}
.atrail .aarr{transition:opacity .4s,translate .4s;opacity:0;translate:-8px 0}
.atrail.flow-on .aarr{opacity:1;translate:none}
.atrail.flow-on .aarr{animation:mrwNudge 2.2s ease 1s 2}
@keyframes mrwNudge{0%,100%{translate:0 0}50%{translate:5px 0}}
.btn .arr,.btn svg{transition:translate .22s ease}
.btn:hover .arr{translate:3px 0}
.btn:active{translate:0 1.5px;transition-duration:.08s}
.brand .mark{transition:rotate .3s cubic-bezier(.3,1.6,.4,1)}
.brand:hover .mark{rotate:-5deg}
.kicker{transition:rotate .25s ease}
.sec-head:hover .kicker{rotate:-1.5deg}
}
/* get-started field ticks + received stamp (motion-safe outside the media query too) */
.gs-field label{display:flex;align-items:center;gap:7px}
.gs-field .fld-ok{display:none;width:13px;height:13px;color:var(--ok)}
.gs-field.ok .fld-ok{display:inline-block}
.gs-field.ok input,.gs-field.ok textarea{border-color:var(--ok)}
.gs-thanks{position:relative}
.gs-thanks .gs-check svg path{stroke-dasharray:34;stroke-dashoffset:34}
.gs-thanks.show .gs-check svg path{animation:mrwDraw .6s .25s ease forwards}
.gs-stamp{position:absolute;top:16px;right:18px;rotate:8deg;font-family:"JetBrains Mono",monospace;font-size:11px;font-weight:700;letter-spacing:0.22em;text-transform:uppercase;color:var(--stamp);border:2px solid var(--stamp);border-radius:4px;padding:5px 9px;opacity:0;filter:url(#grungeEdge)}
.gs-thanks.show .gs-stamp{animation:mrwSlam .45s .9s cubic-bezier(.2,1.4,.4,1) forwards}

