:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#edf4ff;background:#090b13;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body{background:#090b13;min-width:320px;min-height:100%;margin:0}body{overflow:hidden}button,select,input{font:inherit}button,select{color:#ecf6ff;background:#131f36f2;border:1px solid #89bbe642;border-radius:8px}button{cursor:pointer;padding:.56rem .58rem;font-size:.62rem}button:hover,select:focus{background:#183748f2;border-color:#67e4d7cc}button:disabled,select:disabled,input:disabled{cursor:not-allowed;opacity:.5}select{min-width:0;padding:.4rem .45rem}#animation-events-app,#scene-shell,#scene-shell canvas{width:100vw;height:100vh}#animation-events-app{background:radial-gradient(circle at 85% 42%,#3e6aae40,#0000 38rem),#090b13;position:relative;overflow:hidden}#scene-shell{position:absolute;inset:0}#scene-shell canvas{display:block}.stage-labels{z-index:1;pointer-events:none;grid-template-columns:repeat(3,1fr);gap:.42rem;display:grid;position:absolute;bottom:7.5vh;left:35vw;right:1.7vw}.stage-labels span{color:#cfe1f7ad;letter-spacing:.08em;text-align:center;white-space:nowrap;text-overflow:ellipsis;background:#080c188c;border:1px solid #82addf40;border-radius:999px;min-width:0;padding:.38rem .3rem;font-size:.48rem;overflow:hidden}.control-hud{pointer-events:none;background:linear-gradient(90deg,#090b13fc 0%,#090b13eb 82%,#090b1300 100%);width:min(510px,100vw);padding:1.05rem 1rem 1rem;position:absolute;inset:0 auto 0 0;overflow-y:auto}.control-hud>*{pointer-events:auto}.back-link,.next-link{color:#9adfd8;letter-spacing:.04em;font-size:.72rem;text-decoration:none}.back-link:hover,.next-link:hover{color:#fff}.eyebrow{color:#7a91b7;letter-spacing:.18em;margin-top:1.55rem;font-size:.64rem;font-weight:700}h1{letter-spacing:-.055em;max-width:460px;margin:.5rem 0 .42rem;font-size:clamp(2rem,4.5vw,3.05rem);line-height:.98}.intro{color:#a9bad0;max-width:455px;margin:0 0 .85rem;font-size:.81rem;line-height:1.42}.status-panel,.event-card,.intent-card,.time-card,.lifecycle-panel{-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);background:#0e1524d6;border:1px solid #71a5d238;border-radius:11px;max-width:455px;margin:.58rem 0;padding:.68rem;box-shadow:0 16px 40px #0000002e}.event-card{border-color:#66c4ff6b}.intent-card{border-color:#67e4d766}.time-card{border-color:#ffb86566}.status-line,.button-row,.card-heading,.select-row,.slider-row{justify-content:space-between;align-items:center;gap:.42rem;display:flex}.status-pill,.backend-pill{color:#c9f8ed;background:#1e6f663d;border-radius:999px;align-items:center;gap:.35rem;padding:.24rem .5rem;font-size:.67rem;font-weight:700;display:inline-flex}.status-pill i{background:#61ead2;border-radius:50%;width:.4rem;height:.4rem;box-shadow:0 0 12px #61ead2}.backend-pill{color:#b9cbea;background:#53689733}.status-detail,.lifecycle-panel p{color:#91a5c0;margin:.48rem 0 0;font-size:.67rem;line-height:1.38}.metrics,.intent-metrics,.time-metrics{grid-template-columns:repeat(4,1fr);gap:.34rem;margin:.65rem 0 0;display:grid}.metrics div,.intent-metrics div,.time-metrics div{background:#0509128c;border-radius:7px;min-width:0;padding:.39rem .4rem}dt{color:#7487a4;letter-spacing:.05em;text-transform:uppercase;font-size:.52rem}dd{color:#e7f3ff;font-variant-numeric:tabular-nums;text-overflow:ellipsis;white-space:nowrap;margin:.17rem 0 0;font-size:.65rem;overflow:hidden}.card-heading strong{letter-spacing:.02em;font-size:.71rem}.card-heading span,.card-detail{color:#879bb8;font-size:.57rem}.select-row{color:#b9c8da;margin:.48rem 0;font-size:.67rem}.select-row select{width:67%}.button-row{margin-top:.5rem}.button-row button{flex:1}.compact-row{margin-top:.35rem}.compact-row button{padding-inline:.38rem;font-size:.55rem}.slider-row{color:#b9c8da;margin-top:.5rem;font-size:.63rem}.slider-row output{color:#e7f3ff;font-variant-numeric:tabular-nums}input[type=range]{accent-color:#61d9cd;width:100%;margin:.24rem 0 .1rem}.check-row{color:#aebdd0;align-items:center;gap:.28rem;margin-top:.55rem;font-size:.61rem;display:inline-flex}.check-row input{accent-color:#61d9cd}.control-label{color:#78a9c8;letter-spacing:.14em;text-transform:uppercase;margin:.56rem 0 .36rem;font-size:.57rem;font-weight:700}.emote-label{margin-top:.7rem}.button-grid{grid-template-columns:repeat(3,1fr);gap:.34rem;display:grid}.button-grid button.active{color:#d7fff7;background:#1e6f666b;border-color:#67e4d7e6}.event-log{flex-direction:column;gap:.25rem;min-height:5.1rem;max-height:7.2rem;margin:.52rem 0 0;padding:0;list-style:none;display:flex;overflow:auto}.event-log li{color:#b7c6da;font-variant-numeric:tabular-nums;background:#0509128c;border-radius:5px;grid-template-columns:3.3rem 5.2rem 1fr;gap:.3rem;padding:.3rem .35rem;font-size:.56rem;display:grid}.event-log li strong{color:#75e0d1;letter-spacing:.06em;text-transform:uppercase;font-size:.53rem}.event-log li span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.event-log .empty-log{color:#7487a4;display:block}.intent-metrics,.time-metrics{grid-template-columns:repeat(2,1fr)}.card-detail{margin:.42rem 0 0;line-height:1.32}.lifecycle{color:#dceafa;flex-wrap:wrap;align-items:center;gap:.25rem;font-size:.57rem;display:flex}.lifecycle span{background:#518fba2e;border-radius:5px;padding:.26rem .33rem}.lifecycle b{color:#6fd6cb;font-weight:500}.utility-row{max-width:455px}.speed-row{color:#aebdd0;align-items:center;gap:.4rem;margin-top:.6rem;font-size:.61rem;display:flex}.speed-row input{margin:0}.error-panel{color:#ffd8d8;background:#4d1723c7;border:1px solid #ff7c7c99;border-radius:9px;max-width:455px;margin-top:.58rem;padding:.68rem;font-size:.68rem}.error-panel strong{margin-bottom:.25rem;display:block}.hint{color:#6e819c;max-width:455px;margin:.68rem 0 .45rem;font-size:.61rem;line-height:1.35}code{color:#c5fff4;font-size:.6rem}.next-link{padding-bottom:.7rem;display:inline-block}.signature{color:#a9c0dc75;letter-spacing:.16em;pointer-events:none;font-size:.61rem;position:absolute;bottom:.68rem;right:.9rem}@media (width<=760px){body{overflow:auto}#animation-events-app,#scene-shell,#scene-shell canvas{height:100%;min-height:2250px}.stage-labels{grid-template-columns:repeat(3,1fr);bottom:1rem;left:1rem;right:1rem}.control-hud{background:linear-gradient(#090b13fa,#090b13e0);width:100%;min-height:2250px;position:relative}.signature{position:fixed}}
