/* /teduh_story/static/src/css/teduh_story.css */
 body.page-story{--pad:clamp(32px,6vw,96px); @media(max-width:820px){--pad:20px}.curtain,.story-begin,.story-lines,.story-skip{display:none}&.story-curtain{overflow:hidden;height:100svh; .curtain{display:block}.story-begin{display:inline-flex}.story-skip{display:inline-block}.story-lines{display:block}.story-open{min-height:100svh;justify-content:center}.story-open .label,.story-hint{display:none}.story-track,.cta,footer{opacity:0;pointer-events:none}.story-track{transform:translateY(26px)}}&.story-composed{.ln{opacity:0;transition:opacity .6s ease}.ln.is-said{opacity:.26}.ln.is-now{opacity:1}}&.story-told .ln{opacity:1}&.story-told .story-open{display:none}&.story-captioned.story-curtain{.story-open h1,.story-dek{display:none}}&.story-telling .story-begin{opacity:0;pointer-events:none;transform:translateY(-6px)}.story-track,.cta,footer{transition:opacity .9s ease,transform .9s cubic-bezier(.16,.84,.28,1)}.curtain{position:fixed;inset:0;z-index:1;pointer-events:none;color:var(--ink);}.leaves{position:absolute;top:0;bottom:0;width:clamp(120px,20vw,260px); height:100%;opacity:.5;}.leaves-l{left:0}.leaves-r{right:0;transform:scaleX(-1)}.leaf-g{transform-box:view-box; animation:story-leaf 15s linear infinite;}.leaves .leaf-g:nth-child(2){animation-duration:19s;animation-delay:-4s}.leaves .leaf-g:nth-child(3){animation-duration:13s;animation-delay:-8s}.leaves .leaf-g:nth-child(4){animation-duration:22s;animation-delay:-2s}.leaves .leaf-g:nth-child(5){animation-duration:17s;animation-delay:-11s}.leaves-r .leaf-g{animation-name:story-leaf-b}.leaf-rib{opacity:.4}.story-begin{align-items:center;gap:16px;margin:8px 2rem;padding:16px 30px 16px 18px; background:none;border:1px solid var(--line);border-radius:2px;cursor:pointer; font:inherit;text-align:left;color:var(--ink); transition:opacity .5s ease,transform .5s ease,border-color .3s ease;}.story-begin:hover{border-color:var(--pine)}.begin-ring{width:44px;height:44px;flex:none;border-radius:50%;background:var(--pine); color:var(--paper);display:grid;place-items:center;}.begin-ring svg{width:20px;height:20px}.begin-label{display:block;font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;}.begin-note{display:block;margin-top:4px;font-size:11px;color:var(--ink-40);letter-spacing:.04em}.story-lines{position:relative;z-index:2;min-height:4.6em;max-width:22ch;margin:6px auto 0; font-family:var(--serif);font-weight:300;line-height:1.18;letter-spacing:-.02em; font-size:clamp(26px,4.6vw,54px); opacity:0;transform:translateY(10px); transition:opacity .45s ease,transform .55s cubic-bezier(.16,.84,.28,1);}.story-lines.is-in{opacity:1;transform:none}.story-skip{position:relative;z-index:2;margin-top:6px;background:none;border:0;cursor:pointer; font:inherit;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase; color:var(--ink-40);padding:8px;transition:color .3s ease;}.story-skip:hover{color:var(--ink)}&.story-curtain:not(.story-telling) .story-lines{display:none}&.story-curtain:not(.story-telling) .story-skip{display:none}.story-open{min-height:74vh;display:flex;flex-direction:column;justify-content:center; align-items:center;text-align:center;gap:22px; padding:clamp(60px,10vh,120px) 0 clamp(36px,5vh,72px);}.story-open h1{font-family:var(--serif);font-weight:300;letter-spacing:-.025em;line-height:1.04; font-size:clamp(32px,6vw,76px);max-width:16ch;}.story-open h1 em{font-style:italic;color:var(--pine)}.story-dek{max-width:54ch;color:var(--ink-40);font-size:clamp(15px,1.5vw,18px);line-height:1.65}.story-hint{margin-top:14px;font-size:11px;font-weight:600;letter-spacing:.24em; text-transform:uppercase;color:var(--ink-40);}.story-hint span{display:inline-block;margin-left:8px;animation:story-drip 2.2s cubic-bezier(.6,0,.4,1) infinite}.story-track{--beat-scroll:165vh;position:relative}.story-track.is-armed{height:calc(var(--beats,9) * var(--beat-scroll) + 100vh)}@supports (height:100svh){.story-track.is-armed{height:calc(var(--beats,9) * var(--beat-scroll) + 100svh)}}.story-stage{display:flex;flex-direction:column;align-items:center;gap:14px}.story-track.is-armed .story-stage{position:sticky;top:0;height:100vh;justify-content:center; padding:calc(var(--frame) + 6px) 0;}@supports (height:100svh){.story-track.is-armed .story-stage{height:100svh}}.story-track.is-armed.is-rail{height:100vh}.story-track.is-armed.is-rail .story-stage{position:static;height:100%;padding:0;justify-content:center;}.story-track.is-armed.is-rail .stage-frame{width:100%;max-width:none;max-height:calc(100vh - 76px);}@supports (height:100svh){.story-track.is-armed.is-rail{height:100svh}.story-track.is-armed.is-rail .stage-frame{max-height:calc(100svh - 76px)}}.story-track.is-armed.is-rail .beat-rail{position:absolute;inset:0;display:flex;pointer-events:auto; align-items:flex-end; overflow-x:auto;overflow-y:hidden; scroll-snap-type:x mandatory;overscroll-behavior-x:contain; scrollbar-width:none;-webkit-overflow-scrolling:touch;}.story-track.is-armed.is-rail .beat-rail::-webkit-scrollbar{display:none}.story-track.is-armed.is-rail .beat{position:relative;inset:auto;flex:0 0 100%;width:100%; scroll-snap-align:center;scroll-snap-stop:always; display:block;opacity:1;transform:none;pointer-events:auto;}&.story-railing:not(.story-railed-out){.cta{display:none}}.story-track.is-armed.is-rail .beat.is-on{opacity:1}.story-track.is-armed.is-rail .beat{padding:3.4cqw 4.6cqw 4.4cqw;gap:1.6cqw; background:linear-gradient(to top, var(--paper) 0%, var(--paper) 82%, rgba(250,249,245,.88) 93%, rgba(250,249,245,0) 100%);}.story-track.is-armed.is-rail .beat-problem{font-size:clamp(15px,4.1cqw,21px);line-height:1.16}.story-track.is-armed.is-rail .beat-answer{font-size:clamp(10.5px,2.5cqw,13px);line-height:1.5}.story-track.is-armed.is-rail .beat-kicker, .story-track.is-armed.is-rail .beat-proof{font-size:clamp(8px,1.85cqw,10px)}.story-track.is-armed.is-rail .story-stage.is-final .beat.is-on{inset:auto;justify-items:stretch;text-align:left; padding:3.4cqw 4.6cqw 4.4cqw; background:linear-gradient(to top, var(--paper) 0%, var(--paper) 82%, rgba(250,249,245,.88) 93%, rgba(250,249,245,0) 100%);}.story-track.is-armed.is-rail .story-dots{margin-top:12px}.story-track.is-armed.is-rail .sfx-toggle.is-ready{z-index:3}.stage-frame{position:relative;display:grid;gap:clamp(14px,2vh,22px);width:100%;container-type:inline-size}.stage-svg{display:block;color:var(--ink);border:1px solid var(--line);border-radius:2px; aspect-ratio:3 / 4;width:min(100%, calc(58svh * 3 / 4));height:auto;margin-inline:auto;}.story-track.is-armed .stage-frame{display:block;overflow:hidden;background:var(--paper); border:1px solid var(--line);border-radius:2px; aspect-ratio:3 / 4;width:min(100%, calc(76vh * 3 / 4));}@supports (height:100svh){.story-track.is-armed .stage-frame{width:min(100%, calc(76svh * 3 / 4))}}.story-track.is-armed .stage-svg{width:100%;height:100%;aspect-ratio:auto;border:0;border-radius:0;max-width:none;}.camera{transform-box:view-box;transform-origin:0 0; transform:translate(450px,600px) scale(var(--cz,1.02)) translate(calc(var(--cx,1120) * -1px), calc(var(--cy,558) * -1px));}.cnc-pos{transform:translate(calc(var(--rx,990) * 1px),0)}.ln-ground{stroke-width:2.8}.ln-faint{stroke:currentColor;opacity:.22;stroke-width:2}.spot-word{font-family:var(--sans);font-size:26px;font-weight:600;letter-spacing:.12em}.spot{transition:opacity .6s cubic-bezier(.16,.84,.28,1),color .6s ease}.story-track.is-armed .spot{opacity:.26}.story-track.is-armed .spot.on{opacity:1;color:var(--pine)}.spot-halo{fill:var(--pine-soft);stroke:none;opacity:0; transform-box:fill-box;transform-origin:50% 50%;transform:scale(.5); transition:opacity .55s ease,transform .75s cubic-bezier(.16,.84,.28,1);}.spot.on .spot-halo{opacity:.26;transform:scale(1)}.spot-ring{stroke:var(--pine);stroke-width:2.6;opacity:0; transform-box:fill-box;transform-origin:50% 50%;transform:scale(.55); transition:opacity .5s ease,transform .7s cubic-bezier(.16,.84,.28,1);}.spot.on .spot-ring{opacity:1;transform:scale(1)}.spot.on .spot-ring-2{stroke-width:2;animation:story-pulse 2.8s cubic-bezier(.16,.84,.28,1) infinite}.spot-slash{stroke:var(--pine);stroke-width:3}.lamp{transform-box:fill-box;transform-origin:50% 0;animation:story-swing 7.4s ease-in-out infinite}.lamps .lamp:nth-child(2){animation-duration:8.6s;animation-delay:-2.4s}.lamps .lamp:nth-child(3){animation-duration:6.8s;animation-delay:-4.1s}.lamp-glow{fill:var(--pine-soft);stroke:none;opacity:.14;animation:story-glow 5.2s ease-in-out infinite}.lamps .lamp:nth-child(2) .lamp-glow{animation-delay:-1.7s}.lamps .lamp:nth-child(3) .lamp-glow{animation-delay:-3.3s}.wisp{stroke:currentColor;fill:none;opacity:0; transform-box:fill-box;transform-origin:50% 100%;}.steam .wisp{animation:story-steam 3.6s ease-out infinite}.steam .wisp:nth-child(2){animation-delay:1.2s}.steam .wisp:nth-child(3){animation-delay:2.4s}.chill .wisp{animation:story-chill 4.2s ease-in infinite}.chill .wisp:nth-child(2){animation-delay:1.4s}.chill .wisp:nth-child(3){animation-delay:2.8s}.cnc{color:var(--ink)}.cnc-shadow{opacity:.12}.cnc-torso,.cnc-head{fill:var(--paper)}.cnc-badge{fill:var(--pine);stroke:var(--pine)}.cnc-visor{stroke:var(--pine);stroke-width:3.6}.cnc-blip{fill:var(--pine);stroke:var(--pine)}.cnc-leg,.cnc-arm{transform-box:fill-box}.cnc-leg{transform-origin:50% 0%}.cnc-arm-a{transform-origin:100% 0%}.cnc-arm-b{transform-origin:0% 0%;transition:transform .7s cubic-bezier(.16,.84,.28,1)}.cnc-bob{transform-box:fill-box;transform-origin:50% 100%}.story-stage.is-walking .cnc-leg-a{animation:story-step-a .62s linear infinite}.story-stage.is-walking .cnc-leg-b{animation:story-step-b .62s linear infinite}.story-stage.is-walking .cnc-arm-a{animation:story-step-b .62s linear infinite}.story-stage.is-walking .cnc-bob{animation:story-bob .31s ease-in-out infinite}.story-stage.is-pointing .cnc-arm-b{transform:rotate(-58deg)}.story-stage.is-final .cnc-arm-b{animation:story-wave 2.4s ease-in-out infinite}.story-stage.is-final .cnc-blip{animation:story-glow 2s ease-in-out infinite}.beat-rail{display:grid;gap:clamp(14px,2vh,22px)}.beat{border:1px solid var(--line);border-radius:3px;background:var(--paper); padding:clamp(20px,2.4vw,30px);display:grid;gap:12px;}.beat-kicker{color:var(--ink-40)}.beat-problem{font-family:var(--serif);font-weight:300;font-style:italic; font-size:clamp(19px,2vw,28px);line-height:1.25;letter-spacing:-.015em;}.beat-answer{font-size:clamp(13.5px,1.1vw,15.5px);line-height:1.68;color:var(--ink-40)}.story-track.is-armed .beat-problem{font-size:clamp(15px,5cqw,27px);line-height:1.22}.story-track.is-armed .beat-answer{font-size:clamp(10.5px,2.85cqw,15px);line-height:1.6}.story-track.is-armed .beat-kicker, .story-track.is-armed .beat-proof{font-size:clamp(8.5px,2.05cqw,11px)}.story-track.is-armed .beat-cta .u-link{font-size:clamp(9px,2.3cqw,12px)}.beat-proof{display:flex;align-items:center;gap:10px;font-size:11px;font-weight:600; letter-spacing:.2em;text-transform:uppercase;color:var(--pine);}.bp-dot{width:6px;height:6px;border-radius:50%;background:var(--pine);flex:none}.beat-cta{margin-top:6px}.story-track.is-armed .beat-rail{position:absolute;inset:0;display:block;pointer-events:none}.story-track.is-armed .beat{position:absolute;inset:auto 0 0 0;border:0;border-radius:0;gap:2.1cqw; padding:7cqw 5.4cqw 5cqw; background:linear-gradient(to top, var(--paper) 0%, var(--paper) 58%, rgba(250,249,245,.86) 78%, rgba(250,249,245,0) 100%); opacity:0;transform:translateY(14px); transition:opacity .5s ease,transform .6s cubic-bezier(.16,.84,.28,1);}.story-track.is-armed .beat.is-on{opacity:1;transform:none;pointer-events:auto}.story-track.is-armed .story-stage.is-final .beat.is-on{inset:0 0 auto 0;justify-items:center;text-align:center; padding:8cqw 6cqw 18cqw; background:linear-gradient(to bottom, var(--paper) 0%, var(--paper) 74%, rgba(250,249,245,.86) 88%, rgba(250,249,245,0) 100%);}.story-track.is-armed .is-final .beat.is-on .beat-answer{max-width:34ch}.js-sfx{display:none}.js-sfx .sfx-wave{opacity:0;transition:opacity .3s ease}.js-sfx[aria-pressed="true"] .sfx-wave{opacity:1}.js-sfx[aria-pressed="true"] .sfx-off{opacity:0}.sfx-open.is-ready{display:inline-flex;align-items:center;gap:9px;margin-top:6px; padding:11px 20px;background:none;border:1px solid var(--line);border-radius:2px; color:var(--ink-40);cursor:pointer;font:inherit;font-size:11px;font-weight:600; letter-spacing:.2em;text-transform:uppercase; transition:color .3s ease,border-color .3s ease;}.sfx-open svg{width:15px;height:15px;flex:none}.sfx-open:hover{color:var(--ink);border-color:var(--ink-40)}.sfx-open[aria-pressed="true"]{color:var(--pine);border-color:var(--pine)}.story-track.is-armed .sfx-toggle.is-ready{display:flex;align-items:center;gap:7px;position:absolute;z-index:2; top:2.6cqw;right:2.6cqw;padding:1.6cqw 2.4cqw; background:rgba(250,249,245,.82);border:1px solid var(--line);border-radius:2px; color:var(--ink-40);cursor:pointer;font:inherit; font-size:clamp(8px,1.9cqw,10.5px);font-weight:600;letter-spacing:.18em; text-transform:uppercase;transition:color .3s ease,border-color .3s ease;}.sfx-toggle svg{width:1.4em;height:1.4em;flex:none}.sfx-toggle:hover{color:var(--ink);border-color:var(--ink-40)}.sfx-toggle[aria-pressed="true"]{color:var(--pine);border-color:var(--pine)}.story-dots{display:none}.story-track.is-armed .story-dots{display:flex;gap:9px;align-items:center;justify-content:center}.story-dots button{background:none;border:0;cursor:pointer;padding:8px 0;font:inherit;line-height:0;}.dot-i{display:block;width:15px;height:1px;background:var(--ink-14); transition:width .35s cubic-bezier(.22,.8,.3,1),background .35s ease;}.story-dots button:hover .dot-i{background:var(--ink-40)}.story-dots button.is-on .dot-i{width:30px;background:var(--pine)}.dot-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}@media(max-width:820px){.cta h2{font-size:clamp(30px,8.6vw,44px);line-height:1.08}.cta p{font-size:14px}.cta{gap:18px;padding:64px var(--pad)}}}@keyframes story-step-a{0%{transform:rotate(17deg)}50%{transform:rotate(-17deg)}100%{transform:rotate(17deg)}}@keyframes story-step-b{0%{transform:rotate(-17deg)}50%{transform:rotate(17deg)}100%{transform:rotate(-17deg)}}@keyframes story-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}@keyframes story-wave{0%,100%{transform:rotate(-104deg)}50%{transform:rotate(-138deg)}}@keyframes story-pulse{0%{transform:scale(1);opacity:.85}70%{transform:scale(1.32);opacity:0}100%{transform:scale(1.32);opacity:0}}@keyframes story-leaf{0%{transform:translate(-30px,-80px) rotate(-20deg);opacity:0}10%{opacity:.85}90%{opacity:.85}100%{transform:translate(150px,940px) rotate(320deg);opacity:0}}@keyframes story-leaf-b{0%{transform:translate(-10px,-80px) rotate(15deg);opacity:0}12%{opacity:.8}88%{opacity:.8}100%{transform:translate(180px,940px) rotate(-290deg);opacity:0}}@keyframes story-drip{0%,100%{transform:translateY(0);opacity:.5}50%{transform:translateY(5px);opacity:1}}@keyframes story-swing{0%,100%{transform:rotate(-1.7deg)}50%{transform:rotate(1.7deg)}}@keyframes story-glow{0%,100%{opacity:.12}50%{opacity:.32}}@keyframes story-steam{0%{opacity:0;transform:translateY(6px) scale(.6)}22%{opacity:.6}100%{opacity:0;transform:translateY(-92px) scale(1.3)}}@keyframes story-chill{0%{opacity:0;transform:translate(0,0) scale(.8)}25%{opacity:.55}100%{opacity:0;transform:translate(-46px,58px) scale(1.15)}}@media (prefers-reduced-motion:reduce){body.page-story *{animation:none !important}}body.page-story .frame, body.page-story .frame-cap{transition:opacity .55s ease, top .45s ease}body.page-story.story-in-stage .frame, body.page-story.story-in-stage .frame-cap{opacity:0}@supports (overflow-x: clip){body.page-story{overflow-x:clip}}body.page-story.story-railing:not(.story-railed-out) footer{display:none}