/* Motion is progressive enhancement. Native content is always the source of truth. */
.quiet-load-line{position:absolute;top:0;left:0;right:0;height:1px;overflow:hidden;pointer-events:none;z-index:90}
body[data-motion=on] .quiet-load-line:after{content:"";position:absolute;inset:0;background:#b7ddf1;animation:quiet-pass .85s ease both}
.quiet-cursor{position:fixed;inset:0;width:100%;height:100%;z-index:80;pointer-events:none}
.quiet-motion-toggle{position:fixed;bottom:12px;right:18px;z-index:70;display:flex;gap:8px;align-items:center;min-height:36px;padding:7px 11px;background:#101318ed;color:#bac3ce;border:1px solid #ffffff20;border-radius:3px;font:11px/1.5 'Segoe UI',Arial,sans-serif;cursor:pointer}
.quiet-motion-toggle[hidden]{display:none}.quiet-motion-toggle>span:first-child{width:4px;height:4px;border-radius:50%;background:#7b8593}.quiet-motion-toggle[aria-pressed=true]>span:first-child{background:#b7ddf1}
.q-word{display:inline-block;position:relative;vertical-align:baseline;white-space:pre}.q-word.q-active>.q-readable{opacity:0}.q-visual{position:absolute;inset:0;pointer-events:none;perspective:400px;user-select:none}.q-glyph{position:absolute;display:block;transform-origin:50% 50%;backface-visibility:hidden;white-space:pre}
.quiet-depth{position:relative;perspective:1300px;isolation:isolate;user-select:none}.quiet-tilt{position:relative;transform-style:preserve-3d;transition:transform .48s cubic-bezier(.2,.8,.2,1);transform:rotateX(var(--qx,0deg)) rotateY(var(--qy,0deg)) translateY(var(--qlift,0px))}
.quiet-spot-source{opacity:0;pointer-events:none}
.quiet-spotlight{position:fixed;inset:0;z-index:150;pointer-events:none;user-select:none}
.quiet-spot-backdrop{position:absolute;inset:0;z-index:1;background:rgba(3,7,12,.79);opacity:0;transition:opacity .32s ease;pointer-events:none}
.quiet-spotlight.is-visible .quiet-spot-backdrop{opacity:1}
.quiet-spotlight.is-closing,.quiet-spotlight.is-closing *{pointer-events:none!important}
.quiet-spot-desktop,.quiet-spot-phone{position:absolute;transform-origin:0 0;transition:transform .48s cubic-bezier(.2,.8,.2,1);pointer-events:auto;will-change:transform}
.quiet-spot-desktop{z-index:2}.quiet-spot-phone{z-index:3}
.quiet-spotlight[data-stage=phone] .quiet-spot-desktop{z-index:0}
.quiet-spot-desktop>.quiet-depth{width:100%;height:100%;margin:0;perspective:none;isolation:auto}
.quiet-spot-desktop .quiet-tilt{width:100%;height:100%;transform:none!important;animation:none!important}
.quiet-spot-desktop .quiet-depth:before{display:none}
.quiet-spot-desktop .quiet-edge{opacity:1}
.quiet-spot-phone .quiet-phone-layer{position:relative;display:block;inset:auto;width:100%;max-width:none;height:100%}
.quiet-spot-phone .quiet-phone-layer:before{display:none}
.quiet-spot-phone .project-phone{transform:rotate(4deg)!important;box-shadow:0 24px 55px #0009}
.quiet-spotlight[data-stage=phone] .project-phone{transform:rotate(0deg)!important;box-shadow:0 28px 65px #000b,0 0 0 1px #b7ddf14d}
.quiet-depth:before{content:"";position:absolute;inset:9px -5px -9px 9px;border:1px solid #b7ddf121;opacity:0;transition:opacity .4s;pointer-events:none;z-index:-1}
.quiet-impact{position:absolute;left:8%;right:8%;bottom:-65px;height:130px;border:1px solid #b7ddf1;border-radius:50%;opacity:0;pointer-events:none;z-index:-1}
body[data-motion=on] .quiet-depth:hover:before,body[data-motion=on] .quiet-depth:focus-within:before{opacity:1}
body[data-motion=on] .quiet-depth:hover .quiet-tilt,body[data-motion=on] .quiet-depth:focus-within .quiet-tilt{--qlift:-10px}
body[data-motion=on] .quiet-depth.quiet-phone-active .quiet-tilt,body[data-motion=on] .quiet-depth:has(.quiet-phone-layer:hover) .quiet-tilt,body[data-motion=on] .quiet-depth:has(.quiet-phone-link:focus-visible) .quiet-tilt{--qlift:0px}
body[data-motion=on] .quiet-depth.quiet-phone-active:before{opacity:0}
body[data-motion=on] .quiet-arriving>.quiet-tilt{animation:quiet-arrive .55s cubic-bezier(.16,.8,.28,1) both}
body[data-motion=on] .quiet-settling>.quiet-tilt{animation:quiet-impact .24s ease-out}
body[data-motion=on] .quiet-settling>.quiet-impact{animation:quiet-ripple .65s ease-out both}
@keyframes quiet-pass{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
@keyframes quiet-arrive{0%{transform:translateY(-18px) rotateX(3deg);opacity:0}75%{transform:translateY(2px);opacity:1}100%{transform:translateY(0);opacity:1}}
@keyframes quiet-impact{0%,100%{transform:translate(0,0)}25%{transform:translate(0,1.5px)}50%{transform:translate(-.6px,-.4px)}75%{transform:translate(.4px,.4px)}}
@keyframes quiet-ripple{from{opacity:.22;transform:scale(.25,.1)}to{opacity:0;transform:scale(1.45,.3)}}
body[data-motion=off] .quiet-cursor{display:none}body[data-motion=off] .quiet-tilt{transform:none!important}
body[data-motion=off] *,body[data-motion=off] *:before,body[data-motion=off] *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
@media(pointer:coarse){.quiet-cursor{display:none}.quiet-tilt{transform:none!important}.quiet-depth:before{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.quiet-cursor,.quiet-load-line{display:none}*,*:before,*:after{animation:none!important;transition:none!important}.quiet-tilt{transform:none!important}}