.exam-draft{border:1px solid var(--color-line);background:var(--color-sheet);gap:14px;padding:18px 16px 18px 28px;display:grid;position:relative}.exam-draft:before{content:"";background:color-mix(in srgb, var(--color-pen) 45%, transparent);width:1px;position:absolute;inset:0 auto 0 16px}.exam-ink-line{background:color-mix(in srgb, var(--color-ink) 62%, transparent);transform-origin:0;height:3px;animation:5.6s cubic-bezier(.45,0,.25,1) infinite both exam-write;animation-delay:calc(var(--i,0) * .7s);border-radius:2px}.exam-ink-line[data-marked]{background:color-mix(in srgb, var(--color-pen) 75%, transparent)}@keyframes exam-write{0%{opacity:1;transform:scaleX(0)}22%{transform:scaleX(1)}82%{opacity:1;transform:scaleX(1)}to{opacity:0;transform:scaleX(1)}}.exam-tip{animation:.45s cubic-bezier(.16,1,.3,1) both exam-tip-in}@keyframes exam-tip-in{0%{opacity:0;transform:translateY(6px)}}.exam-progress{transform-origin:0;transition:transform .7s cubic-bezier(.16,1,.3,1)}.exam-current{isolation:isolate;position:relative}.exam-current:before{content:"";z-index:-1;background:color-mix(in srgb, var(--color-marker) 70%, transparent);transform-origin:0;animation:.55s cubic-bezier(.16,1,.3,1) .15s both exam-swipe;position:absolute;inset:35% -4px 2px}@keyframes exam-swipe{0%{transform:scaleX(0)}}.exam-tick{animation:.4s cubic-bezier(.16,1,.3,1) both exam-pop;display:inline-block}@keyframes exam-pop{0%{opacity:0;transform:scale(.3)rotate(-25deg)}}.exam-page-in{animation:.5s cubic-bezier(.16,1,.3,1) both exam-page-in}@keyframes exam-page-in{0%{opacity:0;transform:translate(28px)rotate(.8deg)}}.exam-numeral{animation:.8s cubic-bezier(.16,1,.3,1) .1s both exam-numeral}@keyframes exam-numeral{0%{opacity:0;transform:translateY(24px)scale(.92)}}.exam-stagger>*{animation:.45s cubic-bezier(.16,1,.3,1) both exam-tip-in;animation-delay:calc(min(var(--i,0), 8) * 60ms + .15s)}.exam-stamp{animation:.6s cubic-bezier(.55,0,.3,1) both exam-stamp;animation-delay:var(--d,0s)}@keyframes exam-stamp{0%{opacity:0;transform:scale(2.6)rotate(-8deg)}55%{opacity:1;transform:scale(.9)rotate(0)}78%{transform:scale(1.04)}to{opacity:1;transform:scale(1)}}.exam-bleed{pointer-events:none;border:2px solid var(--color-pen);opacity:0;animation:.7s cubic-bezier(.16,1,.3,1) both exam-bleed;animation-delay:calc(var(--d,0s) + .33s);border-radius:4px;position:absolute;inset:-6px}@keyframes exam-bleed{0%{opacity:.55;transform:scale(.85)rotate(-3deg)}to{opacity:0;transform:scale(1.7)rotate(-3deg)}}.exam-thud{animation:.28s ease-out both exam-thud;animation-delay:calc(var(--d,0s) + .33s)}@keyframes exam-thud{40%{transform:translateY(2px)}}.exam-fade{animation:.5s cubic-bezier(.16,1,.3,1) both exam-tip-in;animation-delay:var(--d,0s)}.exam-row{animation:.4s ease-out both exam-row;animation-delay:var(--d,0s)}@keyframes exam-row{0%{opacity:0}}.exam-fill{transform-origin:0;animation:.6s cubic-bezier(.16,1,.3,1) both exam-swipe;animation-delay:var(--d,0s)}.exam-circle{animation:.55s cubic-bezier(.16,1,.3,1) both exam-circle;animation-delay:var(--d,0s)}@keyframes exam-circle{0%{opacity:0;transform:scale(1.6)rotate(-14deg)}}@media (prefers-reduced-motion:reduce){.exam-ink-line{opacity:.45;animation:none}.exam-progress{transition:none}.exam-current:before,.exam-fill,.exam-bleed,.exam-thud{animation:none}.exam-tip,.exam-tick,.exam-page-in,.exam-numeral,.exam-stagger>*,.exam-stamp,.exam-fade,.exam-row,.exam-circle{animation:.2s ease-out both exam-row}}
