/* Short everyday movements; a single cinematic result reveal. */
#main>*{animation:none}
.header-audio{display:flex;align-items:center;gap:12px;flex-shrink:0}
.audio-toggle{border:1px solid var(--line);border-radius:30px;background:var(--surface);font-size:12px;min-height:44px;padding:10px 16px;white-space:nowrap}
.audio-toggle:before{content:'';display:inline-block;width:6px;height:6px;background:var(--muted);border-radius:50%;margin-right:8px;vertical-align:2px}
.audio-toggle[aria-pressed=true]{border-color:var(--accent);color:var(--accent)}
.audio-toggle[aria-pressed=true]:before{background:var(--accent);box-shadow:0 0 9px color-mix(in srgb,var(--accent) 35%,transparent)}

.site-header{gap:25px}.site-header .edition{display:none}.site-header nav{gap:20px}
.answer-option{transition:border-color 140ms,background-color 140ms,box-shadow 140ms}
.relationship-row{transition:background-color 220ms,padding 220ms}
.primary-button,.secondary-button{transition:filter 140ms,transform 140ms}
.primary-button:active,.secondary-button:active{transform:translateY(1px) scale(.985)}
.progress-track{overflow:hidden;padding:2px 0}
dialog[open]{animation:dialog-enter 200ms cubic-bezier(.2,.75,.25,1)}
dialog[open]::backdrop{animation:backdrop-enter 180ms ease-out}
@keyframes dialog-enter{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes backdrop-enter{from{opacity:0}to{opacity:1}}
.stamp-stage{height:270px;margin:12px -10px 4px;perspective:900px;overflow:hidden}
.stamp-imprint{z-index:1;transform:rotate(-8deg);width:min(90%,330px);background:var(--surface)}
.stamp-imprint:after{opacity:.3;background:repeating-linear-gradient(173deg,transparent 0 31px,var(--surface) 32px,transparent 33px 57px)}
.stamp-spotlight{position:absolute;inset:0;background:radial-gradient(ellipse at 46% 40%,#dbd0b818,transparent 68%);opacity:0;pointer-events:none}
.stamp-shadow{position:absolute;z-index:0;width:240px;height:68px;left:calc(50% - 120px);top:153px;border-radius:50%;background:#000;filter:blur(12px);opacity:0;transform:rotate(-8deg)}
.physical-stamp{width:290px;height:250px;left:calc(50% - 145px);top:0;filter:drop-shadow(12px 20px 7px #0009);transform-origin:50% 87%;will-change:auto}
.impact-ring{position:absolute;inset:65px 14px 56px;border:1px solid var(--stamp-colour);border-radius:8px;opacity:0;pointer-events:none}
.is-stamping .physical-stamp{display:block;animation:cinematic-strike 1500ms both;will-change:transform}
.is-stamping .stamp-imprint{animation:cinematic-ink 1500ms both}
.is-stamping .stamp-shadow{animation:cinematic-shadow 1500ms both}
.is-stamping .stamp-spotlight{animation:cinematic-light 1500ms both}
.is-stamping .impact-ring{animation:impact-ripple 1500ms both}
.is-revealing .verdict-panel{animation:local-impact 1500ms both}
.is-revealing .verdict-panel h1,.is-revealing .score-number,.is-revealing .score-caption,.is-revealing .score-footer{animation:verdict-enter 1500ms both}
.is-revealing .domain-panel,.is-revealing .useful-result{animation:details-enter 1500ms both}
@keyframes cinematic-strike{
  0%{opacity:0;transform:translate3d(25px,-220px,160px) rotateX(28deg) rotateZ(13deg) scale(1.35);filter:drop-shadow(30px 40px 25px #0008) blur(3px)}
  12%{opacity:1}
  27%{transform:translate3d(5px,-58px,60px) rotateX(12deg) rotateZ(-4deg) scale(1.12);filter:drop-shadow(18px 28px 13px #0009) blur(0);animation-timing-function:cubic-bezier(.65,0,1,.5)}
  38%{opacity:1;transform:translate3d(0,0,0) rotateX(0) rotateZ(-8deg) scale(1);filter:drop-shadow(3px 6px 2px #000b);animation-timing-function:ease-out}
  41%{transform:translate3d(0,3px,0) rotateZ(-8deg) scale(1.018,.96)}
  46%{transform:translate3d(0,-3px,0) rotateZ(-8deg) scale(1)}
  51%,61%{transform:translate3d(0,0,0) rotateZ(-8deg) scale(1);filter:drop-shadow(3px 6px 2px #000b)}
  78%{opacity:1;transform:translate3d(-12px,-60px,45px) rotateX(-8deg) rotateZ(-12deg) scale(1.07);filter:drop-shadow(14px 24px 15px #0008)}
  100%{opacity:0;transform:translate3d(-45px,-280px,100px) rotateX(-15deg) rotateZ(-20deg) scale(1.2);filter:drop-shadow(25px 35px 25px #0005)}
}
@keyframes cinematic-ink{0%,37.9%{opacity:0;transform:rotate(-8deg) scale(1.06)}38%{opacity:.5;transform:rotate(-8deg) scale(1.025)}48%,100%{opacity:1;transform:rotate(-8deg) scale(1)}}
@keyframes cinematic-shadow{0%{opacity:0;transform:translateY(20px) scale(1.5)}20%{opacity:.2;transform:translateY(10px) scale(1.3)}38%,61%{opacity:.65;transform:translateY(0) rotate(-8deg) scale(.95)}100%{opacity:0;transform:translateY(15px) scale(1.5)}}
@keyframes cinematic-light{0%{opacity:0}20%,70%{opacity:1}100%{opacity:0}}
@keyframes impact-ripple{0%,37.9%{opacity:0;transform:rotate(-8deg) scale(.8)}38%{opacity:.22;transform:rotate(-8deg) scale(.9)}58%,100%{opacity:0;transform:rotate(-8deg) scale(1.12)}}
@keyframes local-impact{0%,37.9%{transform:translateY(0)}38%{transform:translateY(2px)}41%{transform:translateY(-1px)}45%,100%{transform:translateY(0)}}
@keyframes verdict-enter{0%,50%{opacity:0;transform:translateY(7px)}78%,100%{opacity:1;transform:translateY(0)}}
@keyframes details-enter{0%,66%{opacity:0;transform:translateY(8px)}100%{opacity:1;transform:translateY(0)}}
@media(max-width:900px){.site-header{flex-wrap:wrap;height:auto;min-height:112px;gap:8px 20px;padding:14px 0}.site-header nav{order:3;width:100%;margin:0;justify-content:space-between}.header-audio{margin-left:auto}.site-header nav .text-button:last-child{display:block}.site-header nav .text-button{font-size:12px}.site-header .wordmark{font-size:27px}}
@media(max-width:420px){.site-header{min-height:118px;gap:4px 8px}.site-header .wordmark{font-size:23px;letter-spacing:-.9px}.site-header .wordmark svg{width:22px;margin-right:4px}.audio-toggle{font-size:11px;padding:8px 10px}.audio-toggle:before{margin-right:5px}.stamp-stage{height:250px}.physical-stamp{width:270px;height:233px;left:calc(50% - 135px);top:0}.stamp-imprint strong{font-size:26px}.stamp-incomplete .stamp-imprint strong{font-size:21px}}
@media(max-width:360px){.site-header .wordmark{font-size:21px}.audio-toggle{padding:7px 8px}.stamp-stage{height:235px}.physical-stamp{width:245px;height:211px;left:calc(50% - 122.5px);top:4px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.is-stamping .physical-stamp{display:none}.stamp-imprint{opacity:1}.stamp-shadow,.stamp-spotlight,.impact-ring{display:none}.primary-button:active,.secondary-button:active{transform:none}}
