.title-trigger{padding:0;text-align:left;font:inherit;letter-spacing:inherit;line-height:inherit;min-height:24px;position:relative;z-index:8}
.title-trigger:hover{color:var(--blue)}
.signal .tear-layer{position:absolute;inset:0;width:100%;height:100%;z-index:5;pointer-events:none}
.tear-stroke{stroke:var(--blue);stroke-width:1;fill:none;stroke-linecap:round;stroke-dasharray:55;stroke-dashoffset:55;transition:stroke-dashoffset 1.1s var(--ease)}
.tear-drop{fill:var(--blue);opacity:0;transform:translateY(-8px);transform-origin:center;transition:opacity .3s .65s,transform .8s .5s var(--ease)}
.tear-on .tear-stroke{stroke-dashoffset:0}.tear-on .tear-drop{opacity:1;transform:translateY(0)}
.bone-overlay{position:absolute;inset:7% 1% 3%;width:98%;height:90%;object-fit:contain;opacity:0;mix-blend-mode:multiply;transition:opacity .65s var(--ease),transform .75s var(--ease);transform:translateY(3px);pointer-events:none}
.touch.bones-on .bone-overlay{opacity:.85;transform:translateY(0)}
.touch.bones-on [data-layer=upper],.touch.bones-on [data-layer=lower]{opacity:0}
.touch [data-layer=upper],.touch [data-layer=lower]{transition:opacity .65s}
.echo .moon{filter:grayscale(1);transition:filter 1.1s var(--ease)}.echo.moon-on .moon{filter:grayscale(0)}
.within-art-state{position:absolute;width:78%;height:84%;left:8%;top:8%;object-fit:contain;mix-blend-mode:multiply;transition:clip-path .95s var(--ease),opacity .65s var(--ease)}
.within-closed{opacity:.7}.within-open{clip-path:inset(0 50% 0 50%);opacity:0}
.within.within-on .within-open{clip-path:inset(0);opacity:.8}.within.within-on .within-closed{opacity:0}
.scene-page{position:relative;padding:26px 26px 32px;min-height:calc(100svh - var(--nav-height));overflow:hidden;isolation:isolate}
.scene-top{display:flex;justify-content:space-between;align-items:center;font-size:max(8px, round(nearest, calc((10px) * var(--type-scale, 1)), 4px));letter-spacing:.12em;border-bottom:.6px solid var(--guide);padding-bottom:16px}
.scene-back{padding:8px 10px 8px 0;font-size:max(8px, round(nearest, calc((12px) * var(--type-scale, 1)), 4px));letter-spacing:0}
.scene-heading{margin-top:26px}.scene-heading h1{font-size:max(8px, round(nearest, calc((33px) * var(--type-scale, 1)), 4px));font-weight:400;line-height:1.05;letter-spacing:-.03em}.scene-heading p{font-size:max(8px, round(nearest, calc((15px) * var(--type-scale, 1)), 4px));margin-top:10px;letter-spacing:.08em}
.scene-stage{position:relative;width:100%;height:300px;margin:25px auto 14px;isolation:isolate;background:var(--paper)}
.scene-lines{position:absolute;inset:0;width:100%;height:100%;stroke:var(--guide);stroke-width:.65;fill:none;pointer-events:none}
.scene-lines .scene-accent{stroke:var(--blue)}
.scene-micro{font-size:max(8px, round(nearest, calc((10px) * var(--type-scale, 1)), 4px));line-height:1.5;letter-spacing:.03em;color:#5d6758;font-style:italic}
.scene-art{position:absolute;inset:0;pointer-events:none}
.scene-art>.art{inset:0}
.scene-art .layer{opacity:.72}
.scene-art .bird{opacity:1}
.scene-signal .scene-stage{height:290px}.scene-signal .scene-art{inset:7% 12% 4% 15%}
.scene-signal .scene-stage>.scene-micro{position:absolute;left:0;top:19%;writing-mode:vertical-rl;transform:rotate(180deg)}
.scene-action{display:flex;align-items:center;justify-content:space-between;width:100%;border-bottom:.7px solid var(--ink);padding:16px 0;font-size:max(8px, round(nearest, calc((14px) * var(--type-scale, 1)), 4px));color:var(--blue);text-align:left}
.scene-note{font-size:max(8px, round(nearest, calc((13px) * var(--type-scale, 1)), 4px));line-height:1.8;margin:16px 0 22px;max-width:27ch}
.scene-note-input{width:100%;border:0;border-bottom:.7px solid #a9afa3;border-radius:0;background:transparent;padding:12px 0;font-size:max(8px, round(nearest, calc((14px) * var(--type-scale, 1)), 4px));line-height:1.8;resize:vertical;min-height:64px;max-height:150px;outline-offset:3px}
.scene-note-input::placeholder{color:#747c6b}
.scene-save-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:10px}
.scene-save-row button{padding:12px 0;font-size:max(8px, round(nearest, calc((12px) * var(--type-scale, 1)), 4px));color:var(--blue)}
.scene-save-row span{font-size:max(8px, round(nearest, calc((10px) * var(--type-scale, 1)), 4px));color:#707a65}
.scene-touch .scene-stage{height:310px;margin-top:13px}
.scene-touch .scene-art{inset:0 5%}
.hold-touch{position:absolute;width:95px;height:95px;left:50%;top:50%;transform:translate(-50%,-50%);border:.7px solid var(--guide);border-radius:50%;background:var(--paper);font-size:max(8px, round(nearest, calc((12px) * var(--type-scale, 1)), 4px));z-index:4;touch-action:none;user-select:none;-webkit-user-select:none}
.hold-touch:after{content:'';position:absolute;inset:-9px;border:.6px dashed #aeb5a6;border-radius:50%;transition:transform .6s,border-color .6s}
.hold-touch.is-held{color:var(--blue);border-color:var(--blue)}.hold-touch.is-held:after{transform:scale(1.12);border-color:var(--blue)}
.hold-touch em{display:block;font-size:max(8px, round(nearest, calc((10px) * var(--type-scale, 1)), 4px));margin-top:5px;color:#777f6d}
.scene-touch.is-held .scene-art{transform:scale(.96);transition:transform .5s var(--ease)}
.scene-moon .scene-stage{height:275px}.scene-moon .scene-art{inset:12% 4% 10% 18%}
.moon-control{position:absolute;inset:0;pointer-events:auto;width:100%;height:100%;padding:0;display:grid;place-items:center}
.lunar-disc{position:relative;width:174px;height:174px;border-radius:50%;overflow:hidden;transition:clip-path .55s var(--ease),filter .8s;filter:grayscale(1)}
.lunar-disc.is-blue{filter:grayscale(0)}
.lunar-disc>svg{width:100%;height:100%;display:block}
.phase-choices{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin:16px 0 8px}
.phase-choices button{font-size:max(8px, round(nearest, calc((12px) * var(--type-scale, 1)), 4px));padding:11px 0;border-bottom:.8px solid transparent}
.phase-choices button[aria-pressed=true]{color:var(--blue);border-color:var(--blue)}
.scene-within .scene-stage{height:280px}
.scene-within .scene-art{inset:12% 0 0}
.scene-stage>.scene-micro{position:absolute;top:0;left:0;max-width:16ch}
.back-state{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.back-state-open{clip-path:inset(0 50%);transition:clip-path .25s linear}
.back-state-closed{transition:opacity .25s}
.opening-slider{width:100%;accent-color:var(--blue);margin:10px 0}
.slider-labels{display:flex;justify-content:space-between;font-size:max(8px, round(nearest, calc((11px) * var(--type-scale, 1)), 4px));color:#6b7560}
.scene-reveal-caption{font-size:max(8px, round(nearest, calc((11px) * var(--type-scale, 1)), 4px));color:var(--blue);text-align:center;margin-top:10px;min-height:18px}
.scene-nav-talk{margin-top:25px;font-style:italic;font-size:max(8px, round(nearest, calc((13px) * var(--type-scale, 1)), 4px));display:block;text-align:right;color:var(--blue);padding:12px 0}
.motion-setting-note{font-size:max(8px, round(nearest, calc((11px) * var(--type-scale, 1)), 4px));line-height:1.8;color:#66715c;margin-top:12px}
.replay-intro{font-size:max(8px, round(nearest, calc((12px) * var(--type-scale, 1)), 4px));color:var(--blue);padding:10px 0}
.intro-overlay{position:fixed;inset:0;z-index:1000;background:var(--paper);overflow:hidden;display:grid;place-items:center;isolation:isolate}
.intro-overlay svg{position:absolute;inset:0;width:100%;height:100%}
.intro-skip{position:absolute;bottom:calc(22px + env(safe-area-inset-bottom));right:25px;z-index:5;font-size:max(8px, round(nearest, calc((12px) * var(--type-scale, 1)), 4px));letter-spacing:.05em;color:var(--ink);padding:12px}
.intro-word{font-size:max(8px, round(nearest, calc((11px) * var(--type-scale, 1)), 4px));letter-spacing:.27em;position:absolute;left:22px;top:25px;z-index:3;opacity:.65}
.intro-aim{stroke:var(--ink);stroke-width:.75;fill:none;stroke-dasharray:1100;stroke-dashoffset:1100}
.intro-center{fill:var(--blue);transform-origin:50% 50%;transform:scale(0)}
.intro-ink{fill:var(--blue);transform-box:view-box;transform-origin:50% 50%;transform:scale(0);opacity:0}
.intro-fill{position:absolute;inset:0;background:var(--blue);opacity:0;z-index:2}
.intro-overlay.is-playing .intro-aim{animation:aim-draw .6s var(--ease) forwards}
.intro-overlay.is-playing .intro-center{animation:point-impact .32s .34s forwards}
.intro-overlay.is-playing .intro-ink{animation:ink-impact .6s .48s var(--ease) forwards}
.intro-overlay.is-playing .intro-fill{animation:ink-cover .3s .83s forwards}
.intro-overlay.is-wiping{animation:paper-wipe .75s var(--ease) forwards}
@keyframes aim-draw{to{stroke-dashoffset:0}}
@keyframes point-impact{to{transform:scale(1)}}
@keyframes ink-impact{0%{transform:scale(.01);opacity:1}55%{transform:scale(.8);opacity:1}100%{transform:scale(3.5);opacity:1}}
@keyframes ink-cover{to{opacity:1}}
@keyframes paper-wipe{from{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}to{clip-path:polygon(0 0,0 0,0 0,0 0)}}
@keyframes label-grow{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
.home-growing .specimen h2,.home-growing .masthead,.home-growing .intro{animation:label-grow .65s var(--ease) both}
.home-growing .signal h2{animation-delay:.2s}.home-growing .touch h2{animation-delay:.45s}.home-growing .echo h2{animation-delay:.7s}.home-growing .within h2{animation-delay:.9s}
::view-transition-old(shared-specimen){animation:shared-out .4s var(--ease) both}
::view-transition-new(shared-specimen){animation:shared-in .5s var(--ease) both}
@keyframes shared-out{to{opacity:0;filter:blur(2px)}}@keyframes shared-in{from{opacity:0;filter:blur(2px)}to{opacity:1;filter:blur(0)}}
@media(min-width:700px){.scene-page{min-height:calc(100svh - 90px)}}
@media(prefers-reduced-motion:reduce){.intro-overlay{display:none!important}}