@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800&family=DM+Sans:wght@400;500;700&display=swap');
:root{--ink:#f8f7ff;--muted:#aca8c3;--pink:#ff4fa3;--lime:#d8ff62;--violet:#8167ff;--dark:#100e20;--panel:#1b1831}*{box-sizing:border-box}body{margin:0;background:#090813;color:var(--ink);font-family:'DM Sans',sans-serif;min-height:100vh}.app-shell{max-width:680px;margin:auto;padding:16px 16px 34px}.topbar{height:44px;display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.brand{font-weight:700;display:flex;gap:8px;align-items:center;font-size:14px}.brand small{color:#0e0c1a;background:var(--lime);font-size:8px;padding:3px 5px;border-radius:4px;letter-spacing:.08em}.brand-dot{width:10px;height:10px;border-radius:50%;background:var(--pink);box-shadow:0 0 16px var(--pink)}button{font:inherit;color:inherit;border:0;cursor:pointer}.ghost-button{background:#211e3b;padding:8px 11px;border-radius:9px;font-size:11px;font-weight:700}.stage{height:min(72vh,640px);min-height:500px;border-radius:28px;overflow:hidden;position:relative;background:linear-gradient(160deg,#20194d 0%,#171332 46%,#10101f 100%);isolation:isolate;box-shadow:0 20px 55px #0008}.aurora{position:absolute;border-radius:50%;filter:blur(8px);opacity:.65;z-index:-1}.aurora-one{width:300px;height:300px;background:#7139bd;top:-115px;right:-100px}.aurora-two{width:240px;height:260px;background:#f53f8b;bottom:-130px;left:-100px}.status-row{position:absolute;z-index:4;left:22px;right:22px;top:20px;display:flex;justify-content:space-between;align-items:center;font-family:'Barlow Condensed',sans-serif;letter-spacing:.1em;font-weight:700;font-size:13px}.status-row span:first-child{background:#ffffff1a;border:1px solid #ffffff24;border-radius:30px;padding:6px 10px}.round-progress{z-index:4;position:absolute;top:67px;left:22px;right:22px;background:#ffffff24;height:4px;border-radius:9px;overflow:hidden}.round-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--lime),#fff775);transition:width .2s linear}.avatar-scene{position:absolute;inset:80px 0 118px;overflow:hidden}.floor{position:absolute;bottom:0;left:-20%;right:-20%;height:85px;background:radial-gradient(ellipse,#fb5eb080 0%,#6436bb20 40%,transparent 70%);transform:perspective(130px) rotateX(61deg);transform-origin:bottom}.avatar{position:absolute;width:160px;height:310px;left:50%;bottom:20px;transform:translateX(-50%);filter:drop-shadow(0 18px 13px #06020d8c)}.head{position:absolute;z-index:3;top:0;left:59px;width:42px;height:50px;border-radius:48% 48% 45% 46%;background:#9b5b4d}.head:before{content:'';position:absolute;inset:-7px -7px 18px -6px;background:#201426;border-radius:46% 55% 30% 34%;z-index:-1}.head i{position:absolute;width:5px;height:5px;border-radius:50%;background:#21101b;top:26px;left:25px}.ponytail{position:absolute;z-index:-2;top:20px;left:94px;width:35px;height:76px;background:#201426;border-radius:0 85% 85% 80%;transform:rotate(-19deg)}.torso{position:absolute;z-index:2;top:47px;left:37px;width:86px;height:102px;background:linear-gradient(120deg,#ff56aa,#bc3ef4);clip-path:polygon(25% 0,75% 0,94% 100%,8% 100%);border-radius:16px}.torso:after{content:'';position:absolute;bottom:8px;left:0;right:0;height:18px;background:#1c1837;clip-path:polygon(0 50%,100% 0,100% 100%,0 100%)}.arm{position:absolute;z-index:1;width:22px;height:113px;border-radius:14px;background:#9b5b4d;transform-origin:top}.arm-left{top:59px;left:39px;transform:rotate(53deg)}.arm-right{top:59px;right:35px;transform:rotate(-53deg)}.leg{position:absolute;top:138px;width:31px;height:143px;background:linear-gradient(#2d2948,#161427);border-radius:14px;transform-origin:top}.leg:after{content:'';position:absolute;bottom:-6px;width:48px;height:14px;background:#f3f0fc;border-radius:14px}.leg-left{left:43px;transform:rotate(12deg)}.leg-left:after{left:-6px}.leg-right{right:42px;transform:rotate(-12deg)}.leg-right:after{right:-6px}.playing .avatar{animation:bounce .82s ease-in-out infinite}.playing .arm-left{animation:armL .82s ease-in-out infinite}.playing .arm-right{animation:armR .82s ease-in-out infinite}.playing .leg-left{animation:legL .82s ease-in-out infinite}.playing .leg-right{animation:legR .82s ease-in-out infinite}@keyframes bounce{50%{transform:translateX(-50%) translateY(-13px) rotate(-2deg)}}@keyframes armL{50%{transform:rotate(104deg)}}@keyframes armR{50%{transform:rotate(-104deg)}}@keyframes legL{50%{transform:rotate(-14deg)}}@keyframes legR{50%{transform:rotate(14deg)}}.move-trail{position:absolute;border:3px solid #e3ff66;border-radius:50%;opacity:.3}.trail-a{width:105px;height:105px;left:12%;top:37%;animation:orbit 2s linear infinite}.trail-b{width:74px;height:74px;right:12%;top:24%;border-color:#ff76b7;animation:orbit 1.8s linear infinite reverse}@keyframes orbit{to{transform:rotate(360deg) scale(.75);opacity:0}}.avatar-note{position:absolute;bottom:4px;width:100%;text-align:center;font-size:9px;font-weight:700;letter-spacing:.12em;color:#d3cee9}.movement-panel{z-index:3;position:absolute;left:22px;right:22px;bottom:50px;text-align:center;text-shadow:0 2px 12px #0b0719}.movement-label{font-family:'Barlow Condensed',sans-serif;letter-spacing:.16em;color:var(--lime);font-size:15px;font-weight:700}.movement-panel h1{font-family:'Barlow Condensed',sans-serif;font-size:clamp(30px,8vw,54px);letter-spacing:.02em;line-height:.9;margin:8px 0;text-transform:uppercase}.movement-panel p{font-size:12px;color:#e2ddf1;margin:0}.timer{z-index:4;position:absolute;right:22px;bottom:24px;font-family:'Barlow Condensed',sans-serif;font-size:48px;line-height:.8;font-weight:800;letter-spacing:-.04em}.beat-lights{position:absolute;left:22px;bottom:28px;display:flex;gap:5px}.beat-lights i{width:7px;height:7px;border-radius:50%;background:#fff4;animation:beat .5s infinite}.beat-lights i:nth-child(2){animation-delay:.14s}.beat-lights i:nth-child(3){animation-delay:.28s}.beat-lights i:nth-child(4){animation-delay:.42s}@keyframes beat{50%{background:var(--lime);box-shadow:0 0 10px var(--lime)}}.entry-count{display:none;z-index:10;position:absolute;inset:0;place-items:center;font-family:'Barlow Condensed',sans-serif;font-size:160px;font-weight:800;color:var(--lime);text-shadow:0 0 50px #d8ff6266}.entry-count.show{display:grid}.next-card{display:flex;align-items:center;gap:9px;padding:16px 6px 7px;font-size:12px}.next-card span{color:var(--muted);font-size:10px;letter-spacing:.09em}.next-card strong{font-family:'Barlow Condensed',sans-serif;font-size:19px;letter-spacing:.04em}.next-card em{font-style:normal;color:var(--lime);margin-left:auto;font-size:11px}.controls{display:flex;justify-content:center;align-items:center;gap:12px;padding:13px 0 4px}.icon-button{background:#211e3b;width:44px;height:44px;border-radius:50%;font-size:24px}.play-button{min-width:148px;height:52px;border-radius:28px;background:var(--lime);color:#18142a;font-size:13px;font-weight:800;letter-spacing:.06em;box-shadow:0 9px 24px #d8ff6244}.play-button span:first-child{margin-right:8px}.controls input{width:66px;accent-color:var(--lime)}.reference-panel{margin-top:18px;background:#151326;border:1px solid #292542;border-radius:15px;padding:13px 14px;display:flex;gap:12px;align-items:center}.reference-panel b{font-size:12px}.reference-panel p{font-size:10px;line-height:1.4;color:var(--muted);margin:4px 0 0}.upload-button{flex:none;background:#292544;border-radius:8px;padding:9px 8px;font-size:9px;font-weight:700;cursor:pointer}.upload-button input{display:none}.disclaimer{font-size:10px;line-height:1.45;color:#767189;text-align:center;margin:15px 6px}.hidden{display:none!important}.completion{position:fixed;inset:0;background:#080611e6;display:grid;place-items:center;padding:24px;z-index:12;text-align:center}.completion div{max-width:360px}.completion span{color:var(--lime);font-size:11px;font-weight:700;letter-spacing:.13em}.completion h2{font-family:'Barlow Condensed',sans-serif;font-size:44px;line-height:.9;margin:11px 0}.completion p{color:#c6c0d8;font-size:14px}.completion button{margin-top:14px;background:var(--lime);padding:14px 20px;border-radius:30px;color:#161325;font-weight:800}@media(min-width:700px){body{background:radial-gradient(circle at 50% 0,#1c1738,#090813 55%)}.app-shell{padding-top:26px}.stage{height:650px}}