/* v2 polish layer: make-interfaces-feel-better + emil-design-engineering + web-animation-design */
:root{--ease:cubic-bezier(.23,1,.32,1);--sh:0 1px 1px #14163a0d,0 4px 8px #14163a0d,0 12px 24px #14163a12;--shh:0 2px 2px #14163a10,0 10px 20px #14163a14,0 24px 48px #14163a1f}
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;scrollbar-gutter:stable;scroll-padding-top:90px;-webkit-tap-highlight-color:transparent}
h1,h2,h3{text-wrap:balance}p{text-wrap:pretty}
.pr,#tot,.qt,#cc,.stats b,.pc b{font-variant-numeric:tabular-nums}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:8px}
.skip{position:fixed;left:12px;top:-80px;z-index:200;background:var(--ink);color:#fff;padding:12px 18px;border-radius:99px;font-weight:800;transition:top .2s var(--ease)}.skip:focus{top:12px}
/* concentric radii + layered shadows + image outlines */
.box,.card,.hc,.pc,.cv{box-shadow:var(--sh)}
.pc img,.gal img,.about img,.md .pv img,.cv img[style*=cover]{outline:1px solid #14163a14;outline-offset:-1px}
.pc{border-radius:28px;padding:10px}.pc img,.pc .ph{border-radius:18px}.hc{padding:14px}
/* specific transitions, press feedback, hover only on pointer devices */
.btn,.cb,.ch button,.chips a,.pc,.hc,.cv,nav a,.qt button{transition:transform .2s var(--ease),box-shadow .2s var(--ease),background-color .2s,color .2s}
.btn:active,.cb:active,.ch button:active,.chips a:active,.qt button:active{transform:scale(.96)}
.pc:active,.hc:active,.cv:active{transform:scale(.98)}
@media(hover:none){.pc:hover,.hc:hover,.cv:hover,.btn:hover,.cb:hover{transform:none;box-shadow:var(--sh)}.hc:hover img{transform:none}}
@media(hover:hover){.pc:hover,.hc:hover{box-shadow:var(--shh),8px 8px 0 var(--ink)}}
/* tap targets 44px */
.ch button,.chips a,.qt button,.cb,#mx,#cx,#rx{min-height:44px}.qt button{min-width:44px;border-radius:50%}.ch button{padding-inline:16px}
input[type=text],select{min-height:48px;font-size:16px}
.chk{align-items:center}.chk input{width:22px;height:22px;flex:none}
/* stagger + view transitions */
.grid>*,.heroes>*{animation:up .55s var(--ease) both;animation-delay:calc(var(--i,0)*45ms)}
@keyframes up{from{opacity:0;transform:translateY(18px) scale(.98)}}
#view>*{animation:up .45s var(--ease) both}
.md{animation-timing-function:var(--ease)}#cart{transition-timing-function:var(--ease)}
.toast{max-width:90vw;text-align:center}
/* tilt */
.tilt{transform-style:preserve-3d;will-change:transform}
/* burger */
.bg{display:none;width:44px;height:44px;border:0;background:var(--ink);color:#fff;border-radius:50%;font-size:20px;cursor:pointer}
@media(max-width:760px){.bg{display:block}header{gap:10px}nav{display:flex;position:fixed;inset:76px 12px auto;flex-direction:column;background:#fffffff2;backdrop-filter:blur(14px);border-radius:24px;padding:10px;box-shadow:var(--shh);opacity:0;visibility:hidden;transform:translateY(-10px) scale(.98);transition:opacity .2s,transform .25s var(--ease),visibility .2s}nav.on{opacity:1;visibility:visible;transform:none}nav a{padding:14px 16px;font-size:16px}header .cb{margin-left:auto}}
@media(min-width:761px){nav{margin-left:auto}}
.hero{min-height:100svh}.view{min-height:100svh}
.marq:hover div{animation-play-state:paused}
.note,small,.hc small{opacity:.8}
footer a{padding:6px 0}
footer{padding-bottom:calc(40px + env(safe-area-inset-bottom,0px))}
.nojs{padding:120px 5vw}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.rv{opacity:1!important;transform:none!important}.tilt{transform:none!important}}
.cb{white-space:nowrap}
@media(max-width:760px){nav{background:#fff}.logo img,header>a img{max-width:42vw;height:auto;max-height:28px}header .cb{padding-inline:14px}}
