.wanted-callout{position:relative;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);align-items:center;gap:clamp(40px,8vw,120px);padding-block:100px;border-top:1px solid var(--line);min-height:75svh}.callout-copy{position:relative;z-index:1}.callout-copy h2{font-size:clamp(40px,4.6vw,72px);margin-block:20px 28px}.callout-copy p{max-width:42ch;font-size:14px;line-height:1.85}.callout-copy small{display:block;margin-top:22px;color:var(--muted);font-size:11px}.marked{position:relative;white-space:nowrap}.marked svg{position:absolute;inset:-20% -7%;width:114%;height:140%;overflow:visible;pointer-events:none}.marked path,.callout-arrow path{fill:none;stroke:var(--accent);stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:0}.callout-arrow{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:2}.wanted-callout[data-draw=true] .marked path{animation:callout-pencil .65s ease-out both}.wanted-callout[data-draw=true] .callout-arrow path{animation:callout-pencil .7s ease-out .55s both}@keyframes callout-pencil{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}.feature{position:relative;min-width:0;border:1px solid var(--line);background:#201714;overflow:hidden}.feature-caption{font-size:10px;color:var(--muted);margin-top:12px;text-align:center}.wheel-stage{height:340px;background:#421519;overflow:hidden}.wheels{position:absolute;inset:0;pointer-events:none}.wheel{position:absolute;top:0;width:55%;max-width:none;filter:drop-shadow(0 12px 10px #0008)}.wheel--l{left:0}.wheel--r{right:0}.wheel-stage>span{position:absolute;inset:auto 20px 18px;color:#f7e9ce;font-size:11px;text-align:center}.board{min-height:430px;padding:45px 45px 32px;background:repeating-linear-gradient(88deg,#5a3225 0 24%,#311c16 24.2% 25%);display:grid;place-items:center;overflow:hidden}.notice{display:block;position:relative;width:min(280px,90%);padding:25px 18px 20px;background:#f7e9ce;color:#5b1f24;box-shadow:0 14px 28px #0007;transform-origin:50% 16px;transform:rotate(calc(-1.6deg + var(--swing,0deg)));font-family:Manrope,Arial,sans-serif}.notice:before{content:"";position:absolute;width:19px;height:19px;left:50%;top:6px;transform:translateX(-50%);background:url('assets/wanted-nail.webp') center/contain no-repeat}.notice__media{margin-bottom:14px;aspect-ratio:3/2;overflow:hidden}.notice__media img{width:100%;height:100%;object-fit:cover;filter:sepia(.45) saturate(.95) contrast(1.02)}.notice__kicker,.notice__meta,.notice__more{font-size:9px;text-transform:uppercase;letter-spacing:.08em}.notice__head{font:600 17px/1.2 Georgia,serif;margin-block:9px}.notice__excerpt{font-size:10px;line-height:1.6;margin-top:9px}.notice__meta{border-top:1px solid #5b1f2440;padding-top:8px}.notice__more{display:block;margin-top:10px}.nudge-controls{display:flex;align-items:center;justify-content:center;gap:15px;margin-top:14px}.nudge-controls button{min-height:44px;padding:8px 14px;border:1px solid var(--line);background:transparent;font-size:11px}.nudge-controls button:disabled{opacity:.5;cursor:default}.button-stage{min-height:300px;display:grid;place-items:center;background:#421519}.button-stage [data-wanted-button-demo]{display:grid;place-items:center;width:100%;height:300px}.button-stage .btn{min-width:180px;min-height:52px}.depth-stage{height:340px;background:#283663}.depth-layer{position:absolute;inset:0;transform:translateY(var(--par,0px));pointer-events:none}.depth-layer img{width:100%;height:100%;object-fit:cover}.depth-bg{inset:-24% 0 -6%}.depth-logo{inset:25px 15% auto;height:80px;z-index:2}.depth-logo img{object-fit:contain}.depth-figures{inset:auto 0 0;height:62%;z-index:3}.depth-figures img{object-fit:contain;object-position:bottom}.depth-grass{inset:auto 0 -30px;height:30%;z-index:5}.depth-grass img{object-position:top}.ember-closeup{height:340px}.ember-closeup .wanted-motion{position:absolute;width:180%;height:180%;max-height:none;left:-40%;top:-80%;aspect-ratio:3/2}@media(max-width:760px){.wanted-callout{grid-template-columns:1fr;gap:65px;padding-block:60px;min-height:0}.callout-copy p{font-size:13px}.wheel-stage,.depth-stage,.ember-closeup{height:280px}.board{padding:38px 24px;min-height:430px}.callout-copy h2{font-size:48px}.marked{white-space:normal}.ember-closeup .wanted-motion{top:-80%}}@media(prefers-reduced-motion:reduce){.wanted-callout .marked path,.wanted-callout .callout-arrow path{animation:none!important;stroke-dashoffset:0}.notice{transform:rotate(-1.6deg)}.depth-layer{transform:none}}html[data-motion=off] .wanted-callout .marked path,html[data-motion=off] .wanted-callout .callout-arrow path{animation:none;stroke-dashoffset:0}

@media(prefers-reduced-motion:reduce){.wheel{transform:none!important}}
html[data-motion=off] .wheel,html[data-motion=off] .depth-layer{transform:none!important}

.case-chapter-demo:has(.wanted-callout){flex-basis:min(92vw,1280px);width:min(92vw,1280px)}.wanted-callout{height:100%;min-height:0;padding:20px 12px;gap:clamp(28px,5vw,80px);border:0}.wanted-callout .callout-copy h2{font-size:clamp(38px,4vw,62px)}.wanted-callout .board{min-height:330px;padding:40px 30px}.wanted-callout .notice{width:min(300px,95%)}.wanted-callout .feature-caption{max-width:none}.wanted-callout>.preview-caption{grid-column:1/-1;margin:0;font-size:10px}.wanted-callout [data-wanted-button-demo]{gap:18px;padding:24px}.wanted-callout .wanted-button-option{padding:0}.wanted-callout .wheel-stage,.wanted-callout .depth-stage,.wanted-callout .ember-closeup{height:clamp(230px,42svh,360px)}@media(max-width:760px){.wanted-callout{height:auto;min-height:100%;padding:12px 8px;gap:52px}.wanted-callout .callout-copy h2{font-size:42px}.wanted-callout .callout-copy p{font-size:13px}.wanted-callout .board{padding:38px 20px}.wanted-callout .marked{white-space:normal}.wanted-callout .button-stage{min-height:250px}}

.live-preview-next{position:absolute;right:14px;bottom:14px;z-index:3;display:inline-flex;align-items:center;gap:18px;min-height:44px;padding:10px 16px;background:var(--paper);color:var(--ink);border:1px solid var(--ink);font-size:11px}.live-preview-next:focus-visible{outline:3px solid var(--accent);outline-offset:3px}

.wanted-callout .marked{display:inline-block;white-space:nowrap}

/* Pencil texture and genuinely deferred drawing. */
.marked path,.callout-arrow path{stroke:#b73b28;stroke-width:3.3;filter:url(#wanted-pencil-grain);opacity:.72;stroke-dashoffset:1}
.wanted-callout:not([data-draw=true]) .marked path,.wanted-callout:not([data-draw=true]) .callout-arrow path{opacity:0;animation:none}
.wanted-callout[data-draw=true] .marked path,.wanted-callout[data-draw=true] .callout-arrow path{opacity:.72}
/* A loosely assembled newspaper spread: overlapping copy and image columns. */
.wanted-callout{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:repeat(12,minmax(0,1fr));gap:0;padding:12px 8px}
.wanted-callout .callout-copy{grid-column:1/7;grid-row:1/10;align-self:start;max-width:42ch;padding:12px 20px 18px 4px;background:transparent;z-index:2}
.wanted-callout .callout-example{grid-column:6/13;grid-row:4/13;min-width:0;align-self:start;z-index:1}
.wanted-callout .callout-copy h2{margin:8px 0 18px}.wanted-callout .callout-copy p{font-size:13px;line-height:1.7}.wanted-callout .callout-copy small{margin-top:14px}
.wanted-callout .callout-copy a{text-decoration:underline;text-underline-offset:3px}
#wanted-swing-study .callout-copy,#wanted-sparks-study .callout-copy{grid-row:5/13;align-self:end}
#wanted-swing-study .callout-example,#wanted-sparks-study .callout-example{grid-row:1/10}
#wanted-depth-study .callout-copy{grid-row:3/12;align-self:center}#wanted-depth-study .callout-example{grid-row:1/10}
.wanted-callout .board{height:clamp(230px,35svh,340px);min-height:0;padding:24px}.wanted-callout .notice{padding:24px 16px 16px}.wanted-callout .notice__head{font-size:15px}
.wanted-callout .wheel-stage,.wanted-callout .depth-stage{height:clamp(210px,34svh,330px)}
.wanted-callout .ember-closeup{height:auto;aspect-ratio:3/2;position:relative;overflow:visible}
.wanted-callout .ember-closeup .wanted-motion{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:3/2;max-height:none}
.ember-glow-toggle{display:block;margin:12px auto 0;padding:10px 16px;min-height:44px;background:transparent;border:1px solid var(--line);color:var(--ink);font-size:11px}
.wheel-scroll{height:clamp(210px,34svh,330px);overflow-y:auto;overscroll-behavior-y:contain;touch-action:pan-y;scrollbar-width:thin}
.wheel-scroll-content{height:300%;position:relative}.wheel-scroll .wheel-stage{position:sticky;top:0}
@media(max-width:760px){.wanted-callout{display:flex;flex-direction:column;height:auto;gap:28px;padding:12px 8px}.wanted-callout .callout-copy,.wanted-callout .callout-example{width:100%;max-width:none;align-self:auto}.wanted-callout .callout-copy{padding:0}.wanted-callout .callout-copy h2{font-size:36px}.wanted-callout .feature{overflow:hidden}.wanted-callout .ember-closeup .wanted-motion{inset:auto}}
@media(prefers-reduced-motion:reduce){.wanted-callout .marked path,.wanted-callout .callout-arrow path{stroke-dashoffset:0;opacity:.72;animation:none!important}}
html[data-motion=off] .wanted-callout .marked path,html[data-motion=off] .wanted-callout .callout-arrow path{stroke-dashoffset:0;opacity:.72;animation:none!important}

.wanted-callout .callout-intent{font-size:10px;line-height:1.6;max-width:42ch;margin-top:12px;font-style:italic}

/* A callout is one text/visual unit; breathing room belongs between units. */
.case-chapter-demo:has(.wanted-callout)+.case-chapter-demo:has(.wanted-callout){margin-left:clamp(32px,4vw,64px)}
.wanted-callout{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);grid-template-rows:auto;gap:clamp(24px,2.5vw,40px);align-items:center;padding:20px 16px}
.wanted-callout .callout-copy,.wanted-callout .callout-example{grid-column:auto;grid-row:auto;align-self:center}
#wanted-swing-study .callout-copy,#wanted-sparks-study .callout-copy,#wanted-depth-study .callout-copy,#wanted-swing-study .callout-example,#wanted-sparks-study .callout-example,#wanted-depth-study .callout-example{grid-row:auto;align-self:center}
.wanted-callout .depth-stage.wanted-motion{height:auto;aspect-ratio:3/2}
.wheel-scroll-content{height:450%}.wanted-callout .wheel{width:44%}.wanted-callout .wheel--l{left:25%}.wanted-callout .wheel--r{right:25%}
[data-wheel-mode=single] .wheel--l{left:50%;width:50%}[data-wheel-mode=single] .wheel--r{display:none}
.wanted-callout .board{touch-action:pan-y pinch-zoom}.wanted-callout .board:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
@media(max-width:760px){.wanted-callout{display:flex;gap:24px;padding:12px 8px}.case-chapter-demo:has(.wanted-callout)+.case-chapter-demo:has(.wanted-callout){margin-left:36px}}

.case-reader-track>.case-chapter-demo:has(.wanted-callout){padding:0!important}
.wanted-callout{grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr)}
.wanted-callout .callout-example:has(.ember-glow-toggle) .feature{width:min(100%,calc((var(--case-usable-height,480px) - 100px)*1.5));margin-inline:auto}

/* Restore the retained newspaper spread, with tighter text/visual pairings. */
.wanted-callout:not([data-callout-layout=paired]){grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:repeat(12,minmax(0,1fr));gap:0;padding:20px 16px}
.wanted-callout:not([data-callout-layout=paired]) .callout-copy{grid-column:1/6;grid-row:1/10;align-self:start;max-width:42ch;padding:8px 18px 12px 0}
.wanted-callout:not([data-callout-layout=paired]) .callout-example{grid-column:6/13;grid-row:4/13;align-self:start}
#wanted-swing-study:not([data-callout-layout=paired]) .callout-copy,#wanted-sparks-study:not([data-callout-layout=paired]) .callout-copy{grid-row:5/13;align-self:end}
#wanted-swing-study:not([data-callout-layout=paired]) .callout-example,#wanted-sparks-study:not([data-callout-layout=paired]) .callout-example{grid-row:1/10}
#wanted-depth-study:not([data-callout-layout=paired]) .callout-copy{grid-row:3/12;align-self:center}
#wanted-depth-study:not([data-callout-layout=paired]) .callout-example{grid-row:1/11}
#wanted-embers-study:not([data-callout-layout=paired]) .callout-copy{grid-row:2/12;align-self:center}
#wanted-embers-study:not([data-callout-layout=paired]) .callout-example{grid-row:1/13;align-self:center}
@media(max-width:760px){.wanted-callout:not([data-callout-layout=paired]){display:flex;gap:24px;padding:12px 8px}.wanted-callout:not([data-callout-layout=paired]) .callout-copy{padding:0;max-width:none}.wanted-callout:not([data-callout-layout=paired]) .callout-copy,.wanted-callout:not([data-callout-layout=paired]) .callout-example{width:100%;align-self:auto!important}}

.case-chapter-demo:has(.wanted-callout)+.case-chapter-demo:has(.wanted-callout){margin-left:0}

/* Later hero closeup: two distinct story notes, one shared visual and control. */
#wanted-depth-study.hero-callout{height:auto;min-height:100%;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);grid-template-rows:auto auto;gap:22px 28px;align-items:start;padding:18px 16px}
#wanted-depth-study.hero-callout .callout-copy{grid-column:1;grid-row:auto;align-self:start;padding:0;max-width:42ch}
#wanted-depth-study.hero-callout .hero-motion-copy{grid-row:1}
#wanted-depth-study.hero-callout .hero-ember-copy{grid-row:2}
#wanted-depth-study.hero-callout .callout-example{grid-column:2;grid-row:1/3;align-self:start;position:sticky;top:12px;min-width:0}
#wanted-depth-study.hero-callout .callout-copy h2{font-size:clamp(28px,2.5vw,36px);line-height:1.05;margin:8px 0 14px}
#wanted-depth-study.hero-callout .callout-copy h2 br{display:none}
#wanted-depth-study.hero-callout .callout-copy h2 em{margin-left:.2em}
#wanted-depth-study.hero-callout .callout-copy p{font-size:13px;line-height:1.7}
#wanted-depth-study.hero-callout .callout-example .feature{width:min(100%,calc((var(--case-usable-height,480px) - 100px)*1.5))}
#wanted-depth-study.hero-callout[data-draw=true] .hero-ember-copy .marked path{animation-delay:.35s}
#wanted-depth-study.hero-callout[data-draw=true] .callout-arrow[data-annotation-kind=wanted-embers-study] path{animation-delay:.95s}
@media(max-width:760px){#wanted-depth-study.hero-callout{display:flex;flex-direction:column;gap:24px;padding:12px 8px}#wanted-depth-study.hero-callout .callout-copy,#wanted-depth-study.hero-callout .callout-example{width:100%;max-width:none;align-self:auto;position:static}#wanted-depth-study.hero-callout .callout-example .feature{width:100%}}

/* User-started previews begin with the original plain burgundy composition. */
.live-preview[data-live-auto],.hero-callout .wanted-motion{background:#421519}
.hero-callout .wanted-motion:focus-visible{outline:3px solid var(--accent);outline-offset:4px}

/* Canonical --yellow; original wheel alpha geometry is retained unchanged. */
.wanted-callout{--wanted-demo-yellow:#F2C96A}
.wanted-callout .wheel{display:block;aspect-ratio:1;background:var(--wanted-demo-yellow);mask:url('assets/wanted-wheel.webp') center/contain no-repeat;mask-mode:alpha;-webkit-mask:url('assets/wanted-wheel.webp') center/contain no-repeat}

/* Keep the authentic pair separated in the static reduced-motion state. */
@media(prefers-reduced-motion:reduce){.wanted-callout .wheel--l{left:3%}.wanted-callout .wheel--r{right:3%}[data-wheel-mode=single] .wheel--l{left:25%}}
html[data-motion=off] .wanted-callout .wheel--l{left:3%}html[data-motion=off] .wanted-callout .wheel--r{right:3%}html[data-motion=off] [data-wheel-mode=single] .wheel--l{left:25%}
.wanted-callout.paired-callout{display:grid!important;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);grid-template-rows:auto auto;gap:22px clamp(18px,2vw,28px);align-items:center}
.paired-callout>.callout-copy{grid-column:1!important;grid-row:auto!important;align-self:center!important;padding:0;max-width:none}
.paired-callout>.callout-example{grid-column:2!important;grid-row:1/3!important;width:100%;align-self:center!important}
.paired-callout .callout-copy h2{font-size:clamp(28px,2.7vw,38px);margin:6px 0 12px}
.paired-callout .callout-copy p{font-size:12px;line-height:1.65}
.wheel-pair .wheel-stage{position:sticky}
.wheel-pair .board{position:absolute;inset:0;height:100%;padding:22px;background:transparent;z-index:2}
.wheel-pair .board .notice{width:min(47%,210px);max-height:90%;margin:0}
.buttons-pair .button-stage [data-wanted-button-demo]{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:clamp(20px,3vw,40px)}
.click-here{font-family:Instrument,Georgia,serif;font-style:italic;font-size:34px;line-height:1.2;transform:rotate(-4deg);background:transparent;border:0;color:#cf5941;min-height:44px;padding:8px 16px}
.click-here:focus-visible{outline:2px solid #f0eee7;outline-offset:6px}
@media(max-width:760px){.wanted-callout.paired-callout{display:flex!important;flex-direction:column;gap:18px}.paired-callout>.callout-copy{width:100%}.paired-callout .callout-copy h2{font-size:28px}.paired-callout>.callout-example{width:100%}.paired-callout .feature{min-height:220px}.wheel-pair .board .notice{width:min(50%,180px)}}

@media(max-width:760px){.buttons-pair .button-stage [data-wanted-button-demo]{flex-wrap:wrap;gap:16px;padding:16px}.buttons-pair .click-here{font-size:28px;padding-inline:8px}.buttons-pair .button-stage .btn{min-width:128px;width:auto;padding-inline:18px}}