/* praxis-visuals · styles for the moving figures (src/core/praxis-visuals.css, appended to praxis-core.css by build.py) */
.pv-stage,.pv-note,.pv-wheel,.pv-hand,.pv-glyph,.bodysvg,.pv-demo{--pv-moss:var(--moss,var(--accent,#345346));--pv-sun:var(--brass,var(--sun,#84631F));--pv-rule:var(--rule,#C7CEC5);--pv-muted:var(--muted,#59645D);--pv-ink:var(--ink,#1C2320);--pv-surface:var(--surface,#F6F7F3)}
/* 1 · the stage */
.pv-stage{display:flex;flex-direction:column;align-items:center;gap:.2rem;margin:.2rem auto .4rem}
.pv-stage-svg{width:min(62vw,240px);height:auto;display:block;overflow:visible}
.pv-stage .pv-frame{fill:none;stroke:var(--pv-rule);stroke-width:1}
.pv-stage .pv-ticks{stroke:var(--pv-rule);stroke-width:1.5}
.pv-stage .pv-dots{fill:none;stroke:var(--pv-rule);stroke-width:1;stroke-dasharray:2 7}
.pv-stage .pv-turn{transform-box:view-box;transform-origin:171px 171px;animation:pv-turn 180s linear infinite}
.pv-stage .pv-floor{fill:none;stroke:var(--pv-moss);stroke-width:1;stroke-dasharray:3 5;opacity:.45}
.pv-stage .pv-orb{fill:color-mix(in srgb,var(--pv-moss) 16%,transparent);stroke:var(--pv-moss);stroke-width:1.5;transform-box:fill-box;transform-origin:center}
.pv-stage .pv-ring{fill:none;stroke:var(--pv-sun);stroke-width:1.2;opacity:0;transform-box:fill-box;transform-origin:center}
.pv-stage .pv-point{fill:var(--pv-sun)}
.pv-stage .pv-gaze{opacity:0}
.pv-stage .pv-cross{stroke:var(--pv-rule);stroke-width:1.2}
.pv-stage .pv-flame{fill:var(--pv-sun);transform-box:fill-box;transform-origin:50% 100%}
.pv-stage:not(.on) .pv-cue{visibility:hidden}  /* no cue before Start: nothing is playing yet */
.pv-cue{margin:0;min-height:1.4em;font-family:var(--ui,Karla,sans-serif);font-weight:700;font-size:.92rem;letter-spacing:.03em;position:relative;width:100%;text-align:center}
.pv-cue span{position:absolute;left:0;right:0;opacity:0;transition:opacity .4s}
.pv-c-in{color:var(--pv-moss)}.pv-c-out,.pv-c-hum,.pv-c-beat{color:var(--pv-sun)}.pv-c-look{color:var(--pv-muted)}
/* breath: the orb leads (4 s in, 6 s out); the rings ride the out-breath */
.pv-stage[data-mode=breath] .pv-orb{animation:pv-breath 10s infinite}
.pv-stage[data-mode=breath] .r1{animation:pv-ring-out 10s infinite}
.pv-stage[data-mode=breath] .r2{animation:pv-ring-out2 10s infinite}
.pv-stage[data-mode=breath] .pv-c-in{animation:pv-cue-in 10s infinite}
.pv-stage[data-mode=breath] .pv-c-out{animation:pv-cue-out 10s infinite}
/* sound: the rings lead with the drone; the orb holds */
.pv-stage[data-mode=sound] .pv-orb{fill:color-mix(in srgb,var(--pv-sun) 18%,transparent);stroke:var(--pv-sun);transform:scale(.7);animation:pv-shimmer 6s ease-in-out infinite}
.pv-stage[data-mode=sound] .pv-ring{animation:pv-ring-sound 6s linear infinite}
.pv-stage[data-mode=sound] .r2{animation-delay:-2s}.pv-stage[data-mode=sound] .r3{animation-delay:-4s}
.pv-stage[data-mode=sound] .pv-c-hum{opacity:1}
.pv-stage[data-mode=sound] .pv-floor{opacity:0}
/* gaze: a steady point and a quiet flame (Ocular Sadhana, trāṭaka) */
.pv-stage[data-mode=gaze] .pv-orb,.pv-stage[data-mode=gaze] .pv-floor,.pv-stage[data-mode=gaze] .pv-rings{opacity:0}
.pv-stage[data-mode=gaze] .pv-gaze{opacity:1}
.pv-stage[data-mode=gaze] .pv-flame{animation:pv-flicker 3.2s ease-in-out infinite}
.pv-stage[data-mode=gaze] .pv-c-look{opacity:1}
/* drum: rings pulse at the beat (Drum, Bowl and Voice) */
.pv-stage[data-mode=drum] .pv-orb{transform:scale(.55);fill:color-mix(in srgb,var(--pv-sun) 22%,transparent);stroke:var(--pv-sun)}
.pv-stage[data-mode=drum] .pv-floor{opacity:0}
.pv-stage[data-mode=drum] .r1{animation:pv-ring-beat var(--pv-beat,.5s) ease-out infinite}
.pv-stage[data-mode=drum] .r2{animation:pv-ring-beat var(--pv-beat,.5s) ease-out infinite;animation-delay:calc(var(--pv-beat,.5s) / -2)}
.pv-stage[data-mode=drum] .pv-c-beat{opacity:1}
/* still: the frame, the point and the slow ring */
.pv-stage[data-mode=still] .pv-orb{transform:scale(.6);opacity:.55}
.pv-stage[data-mode=still] .pv-floor{opacity:0}
/* paused until the reader runs */
.pv-stage:not(.on) *,.pv-stage:not(.on) .pv-cue span{animation-play-state:paused!important}
.pv-stage:not(.on)[data-mode=breath] .pv-c-in{opacity:1}
@keyframes pv-turn{to{transform:rotate(360deg)}}
@keyframes pv-breath{0%{transform:scale(1);animation-timing-function:cubic-bezier(.42,0,.58,1)}40%{transform:scale(2.2);animation-timing-function:cubic-bezier(.42,0,.58,1)}100%{transform:scale(1)}}
@keyframes pv-ring-out{0%,40%{transform:scale(1);opacity:0}41%{opacity:.55}100%{transform:scale(2.6);opacity:0}}
@keyframes pv-ring-out2{0%,55%{transform:scale(1);opacity:0}56%{opacity:.35}100%{transform:scale(2.6);opacity:0}}
@keyframes pv-cue-in{0%{opacity:0}4%,36%{opacity:1}40%,100%{opacity:0}}
@keyframes pv-cue-out{0%,40%{opacity:0}44%,96%{opacity:1}100%{opacity:0}}
@keyframes pv-shimmer{0%,100%{transform:scale(.7)}50%{transform:scale(.77)}}
@keyframes pv-ring-sound{0%{transform:scale(.6);opacity:.75}100%{transform:scale(2.6);opacity:0}}
@keyframes pv-ring-beat{0%{transform:scale(.7);opacity:.7}100%{transform:scale(1.7);opacity:0}}
@keyframes pv-flicker{0%,100%{transform:scale(1,1);opacity:.95}30%{transform:scale(.94,1.06);opacity:.85}60%{transform:scale(1.04,.96);opacity:1}}
/* 2 · the body map: a quiet ring on the place, no brass halo crowding the face */
.bodysvg .bpt .halo{fill:none;stroke:var(--pv-moss);stroke-width:1;opacity:0}
.bodysvg .bpt.on .halo{opacity:.7;animation:pv-halo 2.6s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
.bodysvg .bpt.on .dot{fill:var(--pv-moss)}
.pv-trace .pv-seg{fill:none;stroke:var(--pv-sun);stroke-width:2;stroke-linecap:round}
.pv-trace .pv-seg.now{stroke-dasharray:var(--pv-len);stroke-dashoffset:var(--pv-len);animation:pv-draw 1.6s cubic-bezier(.42,0,.58,1) forwards}
@keyframes pv-halo{0%,100%{transform:scale(.75)}50%{transform:scale(1)}}
@keyframes pv-draw{to{stroke-dashoffset:0}}
/* 3 · hand plates */
.pv-hand{width:100%;max-width:200px;height:auto;display:block;margin:.2rem auto}
.pv-hand .pv-fo{fill:none;stroke:var(--pv-moss);stroke-width:15;stroke-linecap:round}
.pv-hand .pv-fi{fill:none;stroke:var(--pv-surface);stroke-width:12;stroke-linecap:round}
.pv-hand .pv-palm{fill:var(--pv-surface);stroke:var(--pv-moss);stroke-width:1.5}
.pv-hand .pv-wrist{stroke:var(--pv-moss);stroke-width:1.5;stroke-linecap:round}
.pv-hand .pv-touch{fill:var(--pv-sun)}
.mudra .pv-hand{max-width:150px;animation:pv-fade .4s ease-out}
@keyframes pv-fade{from{opacity:0}to{opacity:1}}
/* 4 · your note */
.pv-note{display:grid;gap:.6rem;padding:.9rem 1rem;border:1px solid var(--pv-rule);border-radius:16px;background:var(--pv-surface);margin:.6rem 0}
.pv-note-head{display:flex;align-items:flex-end;gap:.9rem}
.pv-note-name{font-family:var(--display,Marcellus,serif);font-size:3rem;line-height:1;color:var(--pv-moss)}
.pv-note-hz{font-family:var(--ui,Karla,sans-serif);font-weight:700;font-size:.9rem;padding-bottom:.35rem}
.pv-waves{width:100%;height:auto;display:block;overflow:hidden}
.pv-waves .pv-axis{stroke:var(--pv-rule)}
.pv-waves path{fill:none}
.pv-waves .pv-w1 path{stroke:var(--pv-sun);stroke-width:1.6}
.pv-waves .pv-w2 path{stroke:var(--pv-moss);stroke-width:2}
.pv-waves .pv-w1{animation:pv-slide 8s linear infinite}.pv-waves .pv-w2{animation:pv-slide 7.4s linear infinite}
.pv-matched .pv-waves .pv-w2{animation-duration:8s}
@keyframes pv-slide{to{transform:translateX(-342px)}}
.pv-note-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}
.pv-fig{margin:0;display:grid;gap:.3rem}
.pv-fig svg{width:100%;max-width:150px;height:auto;margin:0 auto;display:block}
.pv-fig .pv-rim{fill:none;stroke:var(--pv-rule)}
.pv-fig .pv-sig{fill:none;stroke:var(--pv-sun);stroke-width:1.6;stroke-linejoin:round;stroke-dasharray:1600;stroke-dashoffset:1600;animation:pv-draw 6s ease-out forwards}
.pv-fig .pv-live{fill:none;stroke:var(--pv-moss);stroke-width:1.8}
.pv-matched .pv-live{stroke:var(--pv-sun)}
.pv-fig figcaption{font-size:.9rem;line-height:1.35}
.pv-note-btns{display:flex;flex-wrap:wrap;gap:.5rem}
/* 5 · glyphs and 6 · the wheel */
.pv-glyph{width:100%;height:100%;display:block;color:currentColor}
.pv-wheel{width:100%;max-width:342px;height:auto;display:block;margin:0 auto}
.pv-wheel .pv-gring{fill:none;stroke:var(--pv-rule);stroke-width:.8;stroke-dasharray:1 4}
.pv-wheel .pv-gring.got{stroke:var(--pv-muted);stroke-dasharray:none;opacity:.5}
.pv-wheel .pv-y,.pv-wheel .pv-y *{fill:none;stroke:var(--pv-rule);stroke-width:1.15;stroke-linejoin:round}
.pv-wheel .pv-y.on,.pv-wheel .pv-y.on *{stroke:var(--pv-sun);stroke-width:1.35}
.pv-wheel .pv-y.next,.pv-wheel .pv-y.next *{stroke:var(--pv-moss);stroke-width:1.6}
.pv-wheel .pv-ybindu{fill:var(--pv-rule)}
.pv-wheel .pv-ybindu.on{fill:var(--pv-sun)}
.pv-wheel .pv-slot{fill:none;stroke:var(--pv-rule);stroke-width:5;stroke-linecap:round;opacity:.7}
.pv-wheel .pv-carc{fill:none;stroke:var(--pv-sun);stroke-width:5;stroke-linecap:round;stroke-dasharray:600;stroke-dashoffset:600;animation:pv-draw 1.6s .3s cubic-bezier(.42,0,.58,1) forwards}
.pv-wheel .pv-carc.sealed{stroke-width:6;filter:drop-shadow(0 0 3px var(--pv-sun))}
.pv-wheel .pv-seal{fill:var(--pv-sun);stroke:var(--ground,var(--bg,#ECEFEA));stroke-width:1.5}
.pv-wheel .pv-roman{font-family:var(--display,Marcellus,serif);font-size:34px;fill:var(--pv-ink);text-anchor:middle}
.pv-wheel .pv-gname{font-family:var(--ui,Karla,sans-serif);font-size:11px;font-weight:700;letter-spacing:.12em;fill:var(--pv-moss);text-anchor:middle}
/* Reduce Motion: the orb becomes a slow fade; rings, turns and draws rest; figures show whole */
@media (prefers-reduced-motion:reduce){
 .pv-stage .pv-turn,.pv-stage .pv-ring,.pv-stage .pv-flame,.pv-waves g,.bodysvg .bpt.on .halo{animation:none!important}
 .pv-stage .pv-ring{opacity:0!important}
 .pv-stage[data-mode=breath] .pv-orb{animation:pv-breath-fade 10s ease-in-out infinite!important;transform:scale(1.6)}
 .pv-trace .pv-seg.now,.pv-fig .pv-sig,.pv-wheel .pv-carc{animation:none!important;stroke-dashoffset:0!important}
}
@keyframes pv-breath-fade{0%,100%{opacity:.45}40%{opacity:1}}
@media print{.pv-stage{display:none}}

/* 7 · moving figures for practice cards (motion:"<kind>") and the home page's interval drawing: line figures, moss and brass */
.pv-demo{display:grid;justify-items:center;gap:.3rem;width:100%}
.pv-demo .pv-dfig{width:100%;max-width:300px;aspect-ratio:var(--pv-ar,1.25)}
.pv-demo .pv-dfig svg{width:100%;height:100%;display:block;overflow:visible}
.pv-dcue{margin:0;min-height:2.6em;font-family:var(--ui,Karla,sans-serif);font-weight:700;font-size:.9rem;line-height:1.35;color:var(--pv-moss);text-align:center;display:flex;align-items:center;justify-content:center;max-width:24rem}
.pv-demo .pv-dl{fill:none;stroke:var(--pv-ink);stroke-width:1.2;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke;opacity:.55}
.pv-demo .pv-dr{fill:none;stroke:var(--pv-rule);stroke-width:1;vector-effect:non-scaling-stroke}
.pv-demo .pv-dy{fill:none;stroke:var(--pv-moss);stroke-width:1.2;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.pv-demo .pv-db{fill:none;stroke:var(--pv-sun);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.pv-demo .pv-dm{fill:none;stroke:var(--pv-moss);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.pv-demo .pv-dfb{fill:var(--pv-sun)}.pv-demo .pv-dfm{fill:var(--pv-moss)}.pv-demo .pv-dfi{fill:var(--pv-ink)}
.pv-demo .pv-dg{fill:var(--pv-sun);fill-opacity:.2}.pv-demo .pv-dgm{fill:var(--pv-moss);fill-opacity:.14}
.pv-demo .pv-dskin{fill:var(--pv-sun);opacity:0}
.pv-demo .pv-dbig{font-family:var(--display,Marcellus,serif);fill:var(--pv-sun)}
.pv-demo .pv-ddark{fill:#0E1210}.pv-demo .pv-dafter{fill:#8CC9D9}
.sh-demo{margin:0 0 .6rem;padding:.6rem .4rem .2rem;border-bottom:1px solid var(--rule,#C7CEC5)}
.sh-demo .pv-dfig{max-width:min(300px,calc(250px * var(--pv-ar,1.25)))}  /* never taller than 250px: the title stays near the top */
.rdemo{margin:.2rem auto .4rem}
.rdemo .pv-dfig{max-width:min(62vw,260px,calc(min(30vh,240px) * var(--pv-ar,1.25)))}
/* the Sangha centre of the Path: the walked yantra */
.pv-wheel .pv-walked .pv-y,.pv-wheel .pv-walked .pv-y *{stroke:var(--pv-muted);stroke-width:1;opacity:.75}
.pv-wheel .pv-walked .pv-ybindu{fill:var(--pv-muted)}
.pv-wheel .pv-ylamp{fill:var(--pv-sun)}
.pv-wheel .pv-ylamph{fill:var(--pv-sun);opacity:.22}
@media print{.pv-demo{display:none}}
