/* Scoped motion/clarity pass. The canonical source asset and housing are unchanged. */
.instrument{padding-left:max(4.5vw,env(safe-area-inset-left));padding-right:max(4.5vw,env(safe-area-inset-right));padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}
.button-assembly{position:relative;--press:0}
.button-assembly::after{content:'';position:absolute;left:14.15%;right:14.25%;top:29.1%;bottom:34.3%;border-radius:14.5% / 50%;box-shadow:0 0 15px 4px #d9fb1e80,0 0 32px 7px #d9fb1e30,inset 0 0 9px #e5ff7440;opacity:var(--idle-glow,0);pointer-events:none;will-change:opacity}
.button-object .button-assembly img{width:100%;height:auto;transition:none}
.button-object #capsule,.button-object.pressed #capsule{transform:none;filter:drop-shadow(0 18px 22px #0009)}
.button-object .button-cap,.cap-well{position:absolute;inset:0;clip-path:inset(29.1% 14.25% 34.3% 14.15% round 10.4% / 18.3%);pointer-events:none}
.cap-well{background:#263009;opacity:var(--press)}
.button-object .button-cap{filter:brightness(calc(1 - var(--press)*.06));transform-origin:50% 48%;transform:translateY(calc(var(--press)*5px)) scaleY(calc(1 - var(--press)*.026));will-change:transform}
.label small{display:block;margin-top:8px;color:#939c85;font:10px/1.4 ui-monospace,monospace}
.label p{font-size:12px;color:#bdc5b0;line-height:1.5}
.label>span{color:#a4ac99}
.label{top:2%}
.timeline-key{display:flex;gap:20px;margin:10px 0 0;font:9px/1.5 ui-monospace,monospace;color:#939c85}
.timeline-key .burn-key{color:#e7b793}.timeline-key .fund-key{color:var(--lime)}.timeline-key span:last-child{margin-left:auto}
.scene-foot{color:#a2aa97;line-height:1.5}
.activity{transition:border-color .5s}
.activity[data-event=burn]{border-left:2px solid #ecb894;padding-left:16px}
.activity[data-event=fund]{border-left:2px solid var(--lime);padding-left:16px}
.activity[data-event=collection]{border-left:2px solid var(--lime);padding-left:16px}
#claim{background:var(--lime);border-color:var(--lime);color:var(--ink)}
.live-mode .controls .control-group:not(.transport),.live-mode #reset,.live-mode #time,.live-mode #present,.live-mode #replay{display:none}
.live-mode .controls{justify-content:flex-end}.live-mode .activity a{color:inherit;text-decoration-color:#5d6846;text-underline-offset:4px}
.live-mode .label p{font:600 19px/1.5 ui-monospace,monospace;color:#e2e8d7}
.live-mode .rewards .label p,.live-mode #fund-caption{color:var(--lime)}
.live-mode .history{display:none}
#fund-delta{opacity:0;color:var(--lime);font-size:13px;font-weight:600;min-height:2.8em;overflow-wrap:anywhere;padding:0 8px}
.live-mode #live-breakdown{overflow-wrap:anywhere}
@media(max-width:700px){.live-mode .label p{font-size:13px}.live-mode .label small{font-size:9px}.live-mode .scene-foot{font-size:9px}.live-mode .scene{height:505px}.live-mode .controls .transport{width:auto}}
@media(max-width:700px){.label p{font-size:10px}.label small{font-size:8px;padding:0 3px;margin-top:5px}.label{top:0}h2{font-size:17px;margin:8px 0 6px}.timeline-key{gap:8px;font-size:8px;flex-wrap:wrap}.timeline-key span:last-child{width:100%;margin:0;color:#8e9781}.scene-foot{font-size:8px}.button-object .button-cap{transform:translateY(calc(var(--press)*3px)) scaleY(calc(1 - var(--press)*.026))}}
@media(prefers-reduced-motion:reduce){.button-object .button-cap{transform:none;filter:none}.cap-well{opacity:0}.activity{transition:none}}
@media(max-width:700px){
 .instrument{padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right))}
 .live-mode .scene{height:560px;min-height:560px}
 .button-object{top:77%}
 #machine-state{font-size:9px;letter-spacing:1px}
 .demo-label{font-size:10px}
 #stream{min-height:44px}
 .scene-foot,.live-mode .scene-foot{font-size:10px}
 #fund-delta{font-size:12px;line-height:1.5;min-height:3em}
 .activity p{min-width:0;overflow-wrap:anywhere}
 #event-age{font-size:11px}
 footer{font-size:11px}footer summary{min-height:44px;padding:12px 0}
 footer details p{font-size:13px;line-height:1.6}
 body.stream .scene{min-height:560px}
}
@media(max-width:374px){
 #fund-delta{min-height:4.5em}
 header{height:auto;min-height:94px;display:grid;grid-template-columns:1fr auto;padding:10px 0;gap:6px 10px}
 header .wordmark{grid-column:1;grid-row:1}
 header #stream{grid-column:2;grid-row:1}
 header .demo-label{grid-column:1/-1;grid-row:2;justify-self:start}
 .transport{width:100%!important}.transport button{flex:1;padding-inline:10px}
}
@media(min-width:701px) and (max-width:1100px){.live-mode .scene{height:560px;min-height:560px}}