/* Restore the approved radio composition; only the tonearm becomes a control. */
.turntable{transform:translateY(-50%) rotate(-5deg)}
.disc-control{cursor:default;pointer-events:none;padding:0}.tonearm-pivot{position:absolute;left:78.149%;top:25.84%;width:1px;height:1px;pointer-events:none}
.tonearm-control{position:absolute;left:54.98%;top:18.71%;width:44%;height:58%;padding:0;z-index:7;transform-origin:52.656% 12.292%;transform:rotate(var(--arm-angle,-8deg));clip-path:inset(5% 35% 3% 36%);cursor:grab;touch-action:none;transition:transform .45s cubic-bezier(.25,.7,.2,1)}
.tonearm-control>img{width:100%;height:100%;object-fit:fill;pointer-events:none;filter:drop-shadow(2px 6px 4px #26121377)}.tonearm-control.dragging{cursor:grabbing;transition:none}.tonearm-control:focus-visible>img{filter:drop-shadow(0 0 7px #ffe3b4)}.needle-down .tonearm-control{cursor:default}.turn-hint{font-size:clamp(12px,1vw,16px)}
/* Only a cropped score patch overlays the approved room file. */
.closed-score{position:absolute;z-index:2;pointer-events:none;background-repeat:no-repeat;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent),linear-gradient(0deg,transparent,#000 4%,#000 96%,transparent);mask-composite:intersect}
.voice-caption{position:fixed;z-index:45;bottom:max(6%,30px);left:50%;transform:translateX(-50%) translateY(5px);margin:0;padding:9px 18px;max-width:min(80vw,640px);border-radius:4px;background:#2817148a;backdrop-filter:blur(6px);font-size:clamp(14px,1.3vw,18px);line-height:1.65;letter-spacing:.04em;color:#fff0d9;opacity:0;transition:opacity .22s,transform .22s;pointer-events:none;text-align:center}.voice-caption.visible{opacity:1;transform:translateX(-50%)}.voice-caption.over-photo{bottom:calc(3dvh + 52px);font-size:14px;padding:5px 14px}
.piano-intro-notes{position:absolute;left:11.8%;top:48%;width:25.1%;height:12%;z-index:6;pointer-events:none}.intro-note{position:absolute;bottom:0;display:flex;align-items:center;color:#fff0cf;text-shadow:0 2px 8px #6b391d80;animation:letter-note 1.2s ease-out both}.intro-note b{font:italic 600 clamp(20px,2.2vw,32px) Georgia,serif}.intro-note i{font:12px Georgia;margin:0 0 14px 2px;opacity:.6}
@keyframes letter-note{0%{opacity:0;transform:translateY(0) scale(.8)}20%{opacity:.9;transform:translateY(-16px)}45%{opacity:.9;transform:translateY(-10px)}100%{opacity:0;transform:translateY(-35px) scale(.85)}}
.book-inspecting .scene-viewport{filter:blur(2px) brightness(.65)}
.score-dialog{position:fixed;inset:0;z-index:40;display:grid;place-items:center;background:#28150f48;perspective:1400px;touch-action:none}
.score-book{position:relative;width:min(88vw,820px);height:min(74dvh,490px);perspective:1500px;transform-origin:50% 50%;color:#694837}
.score-cover{position:absolute;left:25%;top:0;width:50%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:17px;border:1px solid #b99b68;border-left:9px solid #96724a;border-radius:3px 8px 8px 3px;background:linear-gradient(100deg,#ceba94,#eadcbb 10%,#e9d8b5 95%,#bc9f70);box-shadow:inset 0 0 0 10px #e1cda5,inset 0 0 0 11px #a789534d,8px 13px 40px #24100566;transform-origin:0 50%;transition:transform .8s,opacity .6s;backface-visibility:hidden;color:#704d32;z-index:2}
.score-cover small{font-size:10px;letter-spacing:.19em}.score-cover>span{font:clamp(24px,3vw,38px) 'Songti SC',serif;letter-spacing:.16em}.score-cover i{font:italic 22px Georgia,serif}.score-cover em{position:absolute;bottom:10%;font-size:12px;font-style:normal;letter-spacing:.15em;opacity:.65}
.score-pages{position:absolute;inset:0;padding:28px 36px 18px;background:linear-gradient(90deg,#f3e7cb,#f9efd9 48%,#dfd0b3 50%,#f4ead1 52%,#f5ebd4);border:1px solid #cdb68f;border-radius:3px;box-shadow:0 18px 65px #21100866,inset 0 0 25px #9e704524;opacity:0;transform:scaleX(.5);transition:opacity .45s,transform .75s;display:flex;flex-direction:column;align-items:center}
.is-open .score-cover{transform:translateX(-45%) rotateY(-150deg);opacity:0;pointer-events:none}.is-open .score-pages{opacity:1;transform:scaleX(1)}
.score-pages header{text-align:center}.score-pages header small{font:9px Georgia;letter-spacing:.14em;opacity:.65}.score-pages h2{font:400 clamp(23px,2.3vw,32px) 'Songti SC',serif;margin:8px 0}.score-pages header p{font:15px 'Songti SC',serif;margin:6px 0;color:#8e5542}
.score-staff{position:relative;width:100%;flex:1;min-height:110px;margin-top:10px;background:repeating-linear-gradient(0deg,transparent 0 11px,#967c5b77 11px 12px) left 47%/100% 60px no-repeat}
.score-clef{position:absolute;left:0;top:calc(47% - 32px);font:66px Georgia;color:#8f7459;opacity:.75}
.score-notes{position:absolute;inset:0 0 0 44px;display:grid;grid-template-columns:repeat(9,1fr);align-items:center;gap:3px}
.score-note{position:relative;top:calc(var(--pitch) - 38%);width:100%;min-width:0;height:48px;padding:0;display:grid;place-items:center;color:#826649;touch-action:manipulation;outline-offset:2px!important;transition:transform .15s}
.score-note>span{width:42px;height:37px;border-radius:50%;background:#f5e9ce;border:1px solid #ad95724d;display:grid;place-items:center;font:600 22px Georgia;box-shadow:0 1px 4px #9e704510;transform:rotate(-8deg)}
.score-note:after{content:'';position:absolute;left:calc(50% + 18px);bottom:29px;width:1px;height:28px;background:#9c806366;pointer-events:none}.score-note.current>span{color:#743d35;border-color:#ae6d58;box-shadow:0 0 17px #d6a36c77;animation:score-pulse 1.7s ease-in-out infinite}.score-note.played>span{color:#995141;background:#eedaba;border-color:#bd9172}.score-note.pressed{transform:translateY(3px)}.score-note:disabled{cursor:default}
.score-whisper{font-size:12px;letter-spacing:.06em;opacity:.68;margin:12px 0 0}.score-pages>button{font-size:13px;margin-top:8px;padding:7px 20px;border-bottom:1px solid #b38f6555;color:#8d5843}.score-return{position:absolute;bottom:4%;left:50%;transform:translateX(-50%);padding:10px 24px;font-size:14px;color:#fff0d9;text-shadow:0 2px 10px #211008;letter-spacing:.08em}
@keyframes score-pulse{50%{box-shadow:0 0 23px #d9a868aa;background:#ffedc6}}
@media(max-height:500px){.score-book{height:76dvh;width:min(90vw,760px)}.score-pages{padding:12px 22px 10px}.score-pages h2{font-size:23px;margin:4px 0}.score-pages header p{font-size:13px;margin:3px}.score-staff{min-height:75px;margin:0}.score-whisper{font-size:11px;margin:3px}.score-pages>button{margin:3px;padding:4px 15px}.score-return{bottom:0%;font-size:12px}.score-cover>span{font-size:28px}.score-cover i{font-size:18px}.voice-caption{font-size:13px;padding:5px 12px}.voice-caption.over-photo{bottom:48px;padding:3px 10px;font-size:12px}.photo-controls{gap:2px}.photo-controls button{padding:5px 7px}}
@media(max-width:550px) and (orientation:portrait){.score-book{width:94vw;height:58dvh}.score-cover{left:15%;width:70%}.score-pages{padding:20px 12px}.score-notes{inset:0 0 0 25px;gap:0}.score-clef{font-size:48px}.score-note>span{width:29px;height:34px;font-size:18px}.score-note:after{left:calc(50% + 13px)}.score-return{bottom:12%}.score-whisper{font-size:11px}.voice-caption.over-photo{bottom:68px}}
@media(prefers-reduced-motion:reduce){.intro-note{opacity:.65}.score-cover,.score-pages{transition:none}.score-note.current>span{background:#ffedc6}.tonearm-control{transition:none}}

/* The invitation returns without changing the approved radio artwork. */
#introMessage{white-space:pre-line;min-height:3.3em;opacity:1}
.needle-down .intro-copy #introMessage{opacity:1}.needle-down .invitation{opacity:.7}
/* The camera approaches the piano. The score stays on its wooden music rest. */
.score-dialog{background:#452419;overflow:hidden;perspective:1400px}
.piano-closeup{position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(#160b0510,#160b0500 65%,#160b0555),url('assets/scenes/childhood/room.webp');background-repeat:no-repeat;background-size:100% 100%,280vw auto;background-position:center,calc(50vw - 67.2vw) calc(45dvh - 77.2vw);filter:brightness(.85)}
.score-book{position:absolute;top:12%;width:min(76vw,850px);height:min(48dvh,345px);transform:perspective(1200px) rotateX(7deg) rotate(-1.5deg);transform-origin:50% 100%;isolation:isolate}
.score-book:after{content:'';position:absolute;left:-4%;right:-4%;bottom:-12px;height:15px;background:linear-gradient(#80502c,#482617 65%,#30190f);border-radius:3px;box-shadow:0 13px 20px #1c0c0977;z-index:3;pointer-events:none;transform:skewX(-8deg)}
.score-cover{box-shadow:inset 0 0 0 10px #e1cda5,inset 0 0 0 11px #a789534d,6px 5px 15px #24100566}.score-pages{box-shadow:0 6px 12px #21100888,inset 0 0 25px #9e704524;padding:16px 30px 13px}
.score-pages h2{font-size:27px;margin:5px 0}.score-staff{margin-top:3px;min-height:90px}.score-whisper{margin:5px 0 0}.score-cover>span{font-size:30px}.score-cover em{bottom:8%}.score-cover{gap:12px}.score-return{bottom:3%;background:#30180a70;border:1px solid #ffe3ba33;border-radius:3px}
.piano-key-response{position:absolute;left:var(--key-x,54%);top:74%;width:1.6%;height:3.5%;background:#ffe6a780;box-shadow:0 0 13px #ffd28b;opacity:0;pointer-events:none;transform:rotate(-5deg)}
/* Lift for the full speech, sway while held, and settle only when the audio ends. */
.toy-lift{transition:transform .7s cubic-bezier(.2,.7,.25,1)}
.toy-speaking .toy-lift{transform:translateY(-28%) scale(1.2)}
.toy-speaking .toy-body{animation:toy-held-sway 1.35s ease-in-out infinite}
.toy-speaking .toy-antenna{animation:antenna-wiggle .65s ease-in-out infinite}
.toy-shadow{transition:opacity .65s,transform .65s,filter .65s}
.toy-speaking .toy-shadow{opacity:.27;transform:scale(1.35,.75);filter:blur(4px)}
.toy-touched .toy-body{animation:toy-squeeze .6s ease-in-out}
.toy-settling .toy-body{animation:toy-landing .75s ease-out}
@keyframes toy-held-sway{0%,100%{transform:rotate(-7deg) translateX(-2px)}50%{transform:rotate(7deg) translateX(2px)}}
@keyframes toy-squeeze{0%,100%{transform:scale(1)}30%{transform:rotate(-10deg) scale(1.09,.94)}70%{transform:rotate(8deg) scale(.98,1.05)}}
@keyframes toy-landing{0%{transform:rotate(5deg)}60%{transform:scale(1.05,.94)}80%{transform:scale(.98,1.03)}100%{transform:none}}
@media(max-height:500px){.score-book{top:6%;height:55dvh;width:78vw}.score-pages{padding:8px 22px}.score-pages header small{font-size:8px}.score-pages h2{font-size:21px;margin:2px}.score-pages header p{font-size:12px;margin:2px}.score-staff{min-height:60px}.score-whisper{font-size:10px;margin:0}.score-note>span{width:34px;height:30px;font-size:19px}.score-note:after{bottom:27px;height:22px}.score-cover>span{font-size:25px}.score-cover small{font-size:8px}.score-cover i{font-size:17px}.score-cover{gap:7px}.score-return{bottom:2%}}
@media(max-aspect-ratio:1/1){.piano-closeup{background-size:100% 100%,auto 170dvh;background-position:center,calc(50vw - 72.5dvh) calc(45dvh - 83.3dvh)}.score-book{top:18%;width:94vw;height:36dvh}.score-pages{padding:12px}.score-pages h2{font-size:23px}.piano-key-response{top:64%}.score-cover>span{font-size:25px}}
@media(prefers-reduced-motion:reduce){.toy-speaking .toy-body,.toy-speaking .toy-antenna,.toy-touched .toy-body,.toy-settling .toy-body{animation:none}.toy-lift,.toy-shadow{transition:none}.score-book{transform:none}}

.piano-closeup{background:none;filter:brightness(.9)}
.piano-closeup:after{content:'';position:absolute;inset:0;background:linear-gradient(#160b0510,#160b0500 65%,#160b0555)}
.piano-environment{position:absolute;width:280vw;aspect-ratio:1672/941;left:calc(50vw - 67.2vw);top:calc(45dvh - 77.2vw);pointer-events:none}
.piano-environment>.room-art{position:absolute;inset:0;width:100%;height:100%}
@media(max-aspect-ratio:1/1){.piano-environment{width:calc(170dvh * 1672 / 941);height:170dvh;left:calc(50vw - 72.5dvh);top:calc(45dvh - 83.3dvh)}}
/* Letter score guides; the keys on the piano are the only playing surface. */
.piano-keybed{position:absolute;left:12.55%;top:58.25%;width:24.1%;height:2.35%;transform:rotate(-3deg);transform-origin:0 50%;display:block;background:#24140e;isolation:isolate;z-index:7}
.physical-key{position:absolute;top:0;left:calc(var(--slot)*100%/var(--white-count,24));width:calc(100%/var(--white-count,24));height:100%;padding:0;border:1px solid #664b3266;border-radius:0 0 2px 2px;transform-origin:50% 0;transition:transform .08s,filter .08s,box-shadow .08s;pointer-events:none}
.white-key{background:linear-gradient(#d8c3a5,#f3e4c9 35%,#e5d1b0);box-shadow:inset 0 -3px 0 #967751,inset 1px 0 #f7ead4;color:#643e2b}
.black-key{width:calc(65%/var(--white-count,24));height:65%;z-index:2;background:linear-gradient(90deg,#1b1512,#403128 65%,#100c09);border-color:#180e08;box-shadow:inset 0 -3px 0 #080604;color:#fff1d5}
.physical-key>span{position:absolute;bottom:3px;left:0;right:0;font:600 clamp(11px,1.05vw,16px) Georgia;text-align:center;pointer-events:none}
.physical-key.is-down{transform:perspective(150px) rotateX(-13deg) translateY(2px);filter:brightness(.8);box-shadow:inset 0 4px 8px #3e241778,inset 0 -1px #987956}
.black-key.is-down{transform:translateY(3px);filter:brightness(1.4)}
.physical-key.is-next{box-shadow:inset 0 0 0 2px #dfaa66,0 0 10px #ffdfa866;filter:brightness(1.12)}
.physical-key.is-down.is-next{filter:brightness(.85)}
.piano-controls-plane{z-index:4;pointer-events:none}.playable-keybed button{pointer-events:auto;cursor:pointer;touch-action:none}.playable-keybed button:disabled{pointer-events:none}.playable-keybed button:focus-visible{outline:2px solid #d7954c;outline-offset:1px}
.room-piano-keys{opacity:0;transition:opacity .25s;pointer-events:none}.playing .room-piano-keys{opacity:1}.room-piano-keys .physical-key>span{display:none}
.piano-intro-notes{left:12.55%;top:49%;width:24.1%;height:9%;z-index:8}
.score-note{pointer-events:none}.score-note>span{border:0;background:transparent;box-shadow:none}.score-note.current>span{border:1px solid #ae6d58;background:#ffedc6}.score-note.played>span{border:0;background:transparent}
@media(max-aspect-ratio:1/1){.physical-key>span{font-size:13px}}
@media(prefers-reduced-motion:reduce){.physical-key,.room-piano-keys{transition:none}.physical-key.is-down{transform:none;filter:brightness(.75)}}

.playable-keybed .black-key:focus-visible{z-index:3}

/* A single readable name appears gradually and stays until her introduction ends. */
.piano-intro-notes{top:47%;height:11%;left:12.55%;width:24.1%}
.intro-note{animation:readable-name .85s ease-out both;bottom:0}
.intro-note b{font:500 clamp(22px,2.2vw,34px) Georgia,serif;text-shadow:0 2px 4px #27120c,0 0 12px #ffd6a766}
.intro-note i{display:none}
@keyframes readable-name{0%{opacity:0;transform:translateY(8px)}55%{opacity:1;transform:translateY(-19px)}100%{opacity:1;transform:translateY(-12px)}}
.piano-invitation{position:absolute;left:50%;top:50%;bottom:auto;transform:translate(-50%,-50%);z-index:15;min-width:min(340px,86vw);padding:18px 28px;text-align:center;border:1px solid #ffe6bb33;border-radius:5px;background:#351b12c9;backdrop-filter:blur(10px);box-shadow:0 8px 30px #29100933;color:#fff0d8;animation:invitation-arrive .6s both}
.piano-invitation p{font:20px 'Songti SC',serif;margin:0 0 15px;letter-spacing:.08em}.piano-invitation>div{display:flex;justify-content:center;gap:14px}.piano-invitation button{padding:9px 18px;border:1px solid #e5bd8155;border-radius:3px;font-size:14px}.piano-invitation button:first-child{background:#ead3ad;color:#5f3b26}.piano-invitation button:last-child{opacity:.8}
@keyframes invitation-arrive{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}
/* Level the scene; the score and large playable keys share a horizontal center line. */
.piano-closeup .piano-environment{transform:rotate(3deg);transform-origin:24% 58%}
.score-book{transform:none;top:10%;height:min(46dvh,345px)}
.score-book:after{transform:none}.score-note>span{transform:none}
.piano-controls-plane{width:min(82vw,1000px);height:clamp(100px,19dvh,155px);aspect-ratio:auto;left:50%;top:67%;transform:translateX(-50%);padding:10px 15px 14px;border-radius:4px;background:linear-gradient(#693d22,#361e12 25%,#4d2b16);box-shadow:0 12px 28px #21100766,inset 0 1px #d8aa6966}
.piano-controls-plane .playable-keybed{position:relative;inset:auto;width:100%;height:100%;transform:none;box-shadow:0 4px 0 #271208}
.playable-keybed .physical-key{border-radius:0 0 4px 4px}.playable-keybed .physical-key>span{font:600 clamp(21px,2vw,28px) Georgia;bottom:16%}.playable-keybed .black-key>span{bottom:12%;font-size:clamp(18px,1.6vw,23px)}
.playable-keybed .white-key{box-shadow:inset 0 -6px 0 #b3956f,inset 1px 0 #f7ead4;background:linear-gradient(#cdb798,#f8edd9 30%,#e9d8b8)}
.playable-keybed .white-key.is-down{box-shadow:inset 0 5px 15px #57391c77,inset 0 -2px #a28762;transform:perspective(200px) rotateX(-8deg) translateY(4px)}
.playable-keybed .physical-key.is-next{box-shadow:inset 0 0 0 3px #d1a064,0 0 12px #ffdfa844}
.score-return{bottom:3%}
@media(max-aspect-ratio:1/1){.score-book{top:15%;height:36dvh}.piano-controls-plane{width:92vw;height:16dvh;left:50%;top:58%;aspect-ratio:auto}.score-return{bottom:9%}}
@media(max-height:500px){.score-book{top:4%;height:52dvh}.piano-controls-plane{width:84vw;height:21dvh;top:65%;padding:5px 9px 8px}.playable-keybed .physical-key>span{font-size:19px;bottom:12%}.playable-keybed .black-key>span{font-size:16px}.score-return{bottom:1%;padding:6px 18px}.piano-invitation{top:50%;bottom:auto;padding:12px 22px}.piano-invitation p{font-size:17px;margin-bottom:9px}}
@media(prefers-reduced-motion:reduce){.intro-note{animation:none;opacity:1;transform:translateY(-12px)}.piano-invitation{animation:none}}
/* The oversized room artwork must not create a focus-scrollable modal. */
.score-dialog,.piano-closeup{overflow:clip}

/* Hearts accompany the toy's movement and unchanged original voice. */
.toy-heart{position:absolute;left:50%;top:15%;z-index:10;line-height:1;pointer-events:none;user-select:none;filter:drop-shadow(0 2px 4px #571a2370);animation:toy-heart-float 1.8s var(--heart-delay,0ms) ease-out both;will-change:transform,opacity}
@keyframes toy-heart-float{0%{opacity:0;transform:translate(-50%,0) scale(.4)}15%{opacity:1;transform:translate(calc(-50% + var(--heart-x)*.25),-18px) scale(1.1)}45%{opacity:.95;transform:translate(calc(-50% + var(--heart-x)*.65),-48px) rotate(var(--heart-turn)) scale(.95)}100%{opacity:0;transform:translate(calc(-50% + var(--heart-x)),-100px) rotate(var(--heart-turn)) scale(.65)}}
@media(prefers-reduced-motion:reduce){.toy-heart{animation:toy-heart-soft .6s ease-out both;transform:translate(-50%,-12px)}}
@keyframes toy-heart-soft{0%,100%{opacity:0}35%,70%{opacity:.9}}

/* The record keeps its size; the invitation accumulates beside it on the voice timeline. */
.intro-copy{width:32%}.intro-copy .wordmark{margin-bottom:clamp(24px,5dvh,56px)}
.intro-copy h1{font-size:clamp(26px,2.7vw,44px);line-height:1.55;margin:0 0 18px}
.intro-lines{margin:0 0 22px;min-height:5.4em;font:400 clamp(19px,1.65vw,28px)/1.8 'Songti SC',serif;letter-spacing:.055em}
.intro-lines p{margin:0;opacity:0;transform:translateY(9px);white-space:nowrap}
.needle-down .intro-copy h1{opacity:1}.needle-down .invitation{opacity:.75}
.radio-sleeve{animation:none}.radio-neon{animation:none}
.photo-smile{position:absolute;left:var(--smile-x,50%);top:var(--smile-y,75%);translate:-50% -50%;width:30%;min-width:96px;z-index:3;pointer-events:none;filter:drop-shadow(0 4px 8px #46151c33);transform-origin:40% 85%}
.photo-smile svg{width:100%;height:auto;display:block}.photo-smile>span{position:absolute;bottom:8%;left:0;right:0;text-align:center;color:#a64d50;font:clamp(8px,.85vw,12px) 'Songti SC',serif;letter-spacing:.06em}
.photo-figure:has(.is-flipped) .photo-smile{visibility:hidden}
@media(max-aspect-ratio:1/1){.intro-copy{width:84%;top:5%}.intro-copy h1{font-size:clamp(24px,4vw,34px);margin-bottom:12px}.intro-lines{font-size:clamp(16px,2.8vw,22px);margin-bottom:12px;max-width:calc(100% - 90px)}.intro-copy .wordmark{margin-bottom:20px}.intro-copy .invitation{font-size:12px;margin-top:0}.radio-sleeve{top:56px}.radio-sleeve>img{width:62px;height:70px}}
@media(max-height:600px) and (orientation:landscape){.intro-copy{width:34%}.intro-copy .wordmark{margin-bottom:16px}.intro-copy .eyebrow{margin-bottom:10px}.intro-copy h1{font-size:24px;line-height:1.4;margin-bottom:10px}.intro-lines{font-size:17px;line-height:1.65;min-height:4.95em;margin-bottom:10px}.intro-copy .invitation{font-size:11px;margin:0}.radio-sleeve{margin-top:12px}.photo-smile{min-width:88px}}

.piano-invitation{max-width:92vw}.piano-invitation>div{gap:10px;flex-wrap:wrap}.piano-invitation button{white-space:nowrap}.piano-invitation #pianoDecline{opacity:.7}
.smile-spark{transform-box:fill-box;transform-origin:center}.smile-tooth{transform-box:fill-box;transform-origin:center}
