/* Aimset animated mark — inks and motion for the inline symbol.
   Generated by docs/design/2026-10-17-aimset-animated-mark/src/build.py from the brand kit's masters;
   edit the generator, not this file. Spec: docs/design/2026-10-17-aimset-animated-mark/README.md.

   The markup's .mark__body and .mark__hit ARE the master's path and circle: with no class, no CSS or
   reduced motion, the master is what shows. While a motion runs, .mark__play stands in for the body inside
   a static clip of the master's own path (the ring drawn by a stroke's dash, the quarter by a scaled pie)
   and hands back to it on the last frame.

   Modes (classes on the <svg class="mark">):
     mark--intro       from nothing: the ring drawn clockwise, the hit lands, the quarter grows out of the
                       bull; once, 1.85 s, on first render (--mark-delay: start later)
     mark--intro-face  the face is there from the first frame; the hit lands, the quarter rises; 1.34 s
     mark--replay      the quarter re-reads: flush, then rising again; 1.1 s (mark.js adds it on hover/focus)
     mark--loop        loading: the re-read every 2.4 s, still for most of it (AimsetMark.loop(svg, false)
                       stops it with the quarter up)
     mark--hold        holds any mode on its first frame (mark.js, until the mark is in view)
   Cuts: (none) on dark, the default · mark--light ink on light · mark--small a symbol alone at <= 24 px
   Inks: --mark-ink, --mark-hit (fall back to --brand-ink, --brand-hit, then the on-dark master)
   prefers-reduced-motion: reduce -> none of the motion rules apply: the master, still. */
.mark{--mark-flush:0.798995;--mark-o:116px 140px}
.mark--light{--mark-flush:0.800000;--mark-ink:#05070B;--mark-hit:#C2410C}
.mark--small{--mark-flush:0.786885;--mark-o:115px 141px}
.mark__body,.mark__riser{fill:var(--mark-ink,var(--brand-ink,#FFFFFF))}
.mark__sweep{fill:none;stroke:var(--mark-ink,var(--brand-ink,#FFFFFF))}
.mark__hit{fill:var(--mark-hit,var(--brand-hit,#FF7438))}
.mark__riser{transform-box:view-box;transform-origin:var(--mark-o,116px 140px)}
.mark__hit{transform-box:fill-box;transform-origin:center}
@media (prefers-reduced-motion:no-preference){
.mark--intro .mark__body{animation:aimset-mark-off 1.85s linear backwards}
.mark--intro .mark__play{animation:aimset-mark-on 1.85s linear backwards}
.mark--intro .mark__sweep{animation:aimset-mark-draw 0.79s cubic-bezier(.45,0,.2,1) 0.06s backwards}
.mark--intro .mark__riser{animation:aimset-mark-emerge 0.96s cubic-bezier(.16,1,.3,1) 0.89s backwards}
.mark--intro .mark__hit{animation:aimset-mark-land 0.5s 0.66s backwards,aimset-mark-fade 0.03s linear 0.66s backwards}
.mark--small.mark--intro .mark__hit{animation-name:aimset-mark-land-s,aimset-mark-fade}
@supports (animation-delay:calc(1s + 1s)){
.mark--intro .mark__body{animation-delay:var(--mark-delay,0s)}
.mark--intro .mark__play{animation-delay:var(--mark-delay,0s)}
.mark--intro .mark__sweep{animation-delay:calc(var(--mark-delay,0s) + 0.06s)}
.mark--intro .mark__riser{animation-delay:calc(var(--mark-delay,0s) + 0.89s)}
.mark--intro .mark__hit{animation-delay:calc(var(--mark-delay,0s) + 0.66s),calc(var(--mark-delay,0s) + 0.66s)}
}
.mark--intro-face .mark__body{animation:aimset-mark-off 1.34s linear backwards}
.mark--intro-face .mark__play{animation:aimset-mark-on 1.34s linear backwards}
.mark--intro-face .mark__riser{animation:aimset-mark-rise 0.9s cubic-bezier(.16,1,.3,1) 0.44s backwards}
.mark--intro-face .mark__hit{animation:aimset-mark-land 0.5s 0.2s backwards,aimset-mark-fade 0.03s linear 0.2s backwards}
.mark--small.mark--intro-face .mark__hit{animation-name:aimset-mark-land-s,aimset-mark-fade}
@supports (animation-delay:calc(1s + 1s)){
.mark--intro-face .mark__body{animation-delay:var(--mark-delay,0s)}
.mark--intro-face .mark__play{animation-delay:var(--mark-delay,0s)}
.mark--intro-face .mark__riser{animation-delay:calc(var(--mark-delay,0s) + 0.44s)}
.mark--intro-face .mark__hit{animation-delay:calc(var(--mark-delay,0s) + 0.2s),calc(var(--mark-delay,0s) + 0.2s)}
}
.mark--replay .mark__body{animation:aimset-mark-off 1.1s linear backwards}
.mark--replay .mark__play{animation:aimset-mark-on 1.1s linear backwards}
.mark--replay .mark__riser{animation:aimset-mark-reread 1.1s linear backwards}
.mark--loop .mark__body{visibility:hidden}
.mark--loop .mark__play{visibility:visible}
.mark--loop .mark__riser{animation:aimset-mark-breathe 2.4s linear infinite}
.mark--hold *{animation-play-state:paused!important}
@keyframes aimset-mark-off{from,to{visibility:hidden}}
@keyframes aimset-mark-on{from,to{visibility:visible}}
@keyframes aimset-mark-fade{from{opacity:0}to{opacity:1}}
@keyframes aimset-mark-land{0%{transform:scale(1.9);animation-timing-function:cubic-bezier(.24,0,.39,1)}53.54%{transform:scale(0.9248);animation-timing-function:cubic-bezier(.35,0,.25,1)}100%{transform:scale(1)}}
@keyframes aimset-mark-land-s{0%{transform:scale(1.5);animation-timing-function:cubic-bezier(.24,0,.39,1)}53.54%{transform:scale(0.9582);animation-timing-function:cubic-bezier(.35,0,.25,1)}100%{transform:scale(1)}}
@keyframes aimset-mark-draw{from{stroke-dashoffset:339.29}to{stroke-dashoffset:0}}
@keyframes aimset-mark-emerge{from{transform:scale(0.3)}to{transform:scale(1)}}
@keyframes aimset-mark-rise{from{transform:scale(var(--mark-flush))}to{transform:scale(1)}}
@keyframes aimset-mark-reread{0%{transform:scale(1);animation-timing-function:cubic-bezier(.4,0,.2,1)}20%{transform:scale(var(--mark-flush));animation-timing-function:linear}27.27%{transform:scale(var(--mark-flush));animation-timing-function:cubic-bezier(.16,1,.3,1)}100%{transform:scale(1)}}
@keyframes aimset-mark-breathe{0%{transform:scale(1);animation-timing-function:cubic-bezier(.4,0,.2,1)}10%{transform:scale(var(--mark-flush));animation-timing-function:linear}15%{transform:scale(var(--mark-flush));animation-timing-function:cubic-bezier(.16,1,.3,1)}48.33%,100%{transform:scale(1)}}
}
