*{box-sizing:border-box}.app{position:fixed;top:0;right:0;bottom:0;left:0;background:#05080d}.app canvas{display:block}.topbar{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:14px 20px;pointer-events:none;z-index:10}.brand{font-size:15px;letter-spacing:.3em;color:#cfe9e2;text-shadow:0 0 18px rgba(79,227,192,.35)}.brand span{color:#7fd8c8;font-weight:300}.progress-chip{font-variant-numeric:tabular-nums;font-size:13px;color:#bfe3d9;background:#0810168c;border:1px solid rgba(127,216,200,.25);padding:6px 14px;border-radius:999px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.progress-chip b{color:#7fe7d0}.toast{position:absolute;top:64px;left:50%;transform:translate(-50%);background:#0a161ed9;color:#bfe3d9;border:1px solid rgba(127,216,200,.3);padding:10px 22px;border-radius:10px;font-size:13px;z-index:30;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.toast.error{color:#ffb4a4;border-color:#ff8c7866;cursor:pointer}.start-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;gap:12px;align-items:center;justify-content:center;z-index:20;pointer-events:none}.start-btn{pointer-events:auto;cursor:pointer;font-size:17px;letter-spacing:.2em;color:#061210;background:linear-gradient(135deg,#6fe9c8,#3fc4a6);border:none;border-radius:999px;padding:14px 44px;box-shadow:0 0 40px #4fe3c059,0 6px 24px #00000080;transition:transform .15s ease}.start-btn:hover{transform:scale(1.05)}.start-hint{font-size:12px;color:#6f8f88}.finale-card{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);background:#081218d1;border:1px solid rgba(255,180,94,.35);border-radius:16px;padding:26px 40px;text-align:center;z-index:25;box-shadow:0 0 60px #ffb45e26,0 12px 40px #0009;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:pop .4s ease}@keyframes pop{0%{transform:translate(-50%,-50%) scale(.85);opacity:0}}.finale-title{font-size:22px;color:#ffd9a0;letter-spacing:.15em}.finale-sub{font-size:13px;color:#9fc0b8;margin:8px 0 16px}.finale-actions{display:flex;gap:12px;justify-content:center}.finale-actions button{cursor:pointer;background:#ffb45e1f;color:#ffd9a0;border:1px solid rgba(255,180,94,.4);border-radius:8px;padding:8px 22px;font-size:13px}.finale-actions button:hover{background:#ffb45e40}.controls{position:absolute;left:50%;bottom:14px;transform:translate(-50%);display:flex;align-items:center;gap:8px;z-index:15;background:#070d13b8;border:1px solid rgba(127,216,200,.18);border-radius:12px;padding:8px 12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);max-width:96vw;flex-wrap:wrap;justify-content:center}.controls select,.controls button{background:#14222ce6;color:#cfe9e2;border:1px solid rgba(127,216,200,.25);border-radius:7px;padding:6px 10px;font-size:12px;cursor:pointer}.controls button:hover,.controls select:hover{border-color:#7fd8c899}.controls button:disabled{opacity:.4;cursor:default}.controls .seek{width:220px;accent-color:#4fe3c0}.controls .vol{width:70px;accent-color:#4fe3c0}.controls .time{font-size:11px;color:#8fb8ae;font-variant-numeric:tabular-nums;min-width:78px}.file-btn{position:relative;display:inline-flex;align-items:center;gap:4px;background:#14222ce6;color:#cfe9e2;border:1px solid rgba(127,216,200,.25);border-radius:7px;padding:6px 10px;font-size:12px;cursor:pointer}.file-btn input[type=file]{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;cursor:pointer;width:100%}.file-btn:has(>input#imp-midi){gap:4px}.file-btn input#imp-midi,.file-btn input#imp-img{width:50%}.file-btn .mini{padding:2px 8px;font-size:11px}.debug{position:absolute;left:14px;bottom:70px;z-index:15;background:#050a0ed9;border:1px solid rgba(127,216,200,.2);border-radius:10px;padding:10px 14px;font-size:11px;line-height:1.7;color:#8fd8c4;font-family:Consolas,monospace;white-space:nowrap}