html,body,#root{margin:0;width:100%;min-height:100%;background:#020617;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}.engine-shell{min-height:100vh;padding:32px;background:#020617;color:#fff}.engine-shell.embed{min-height:auto;padding:0}.engine-header{max-width:1240px;margin:0 auto 24px}.prototype-pill{display:inline-flex;align-items:center;gap:8px;margin-bottom:12px;padding:6px 12px;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:#ffffff12;color:#ffffffc2;font-size:14px}.engine-header h1{margin:0;font-size:clamp(34px,5vw,58px);font-weight:300;letter-spacing:-.04em}.engine-header p{margin:10px 0 0;max-width:720px;color:#ffffffa6}.engine-layout{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:1fr 340px;gap:24px}.engine-layout.embed{max-width:none;grid-template-columns:1fr;gap:0}.visual-card,.control-card{border:1px solid rgba(255,255,255,.1);border-radius:28px;background:#ffffff0e;box-shadow:0 24px 80px #00000059;overflow:hidden}.canvas-wrap{position:relative;width:100%;aspect-ratio:16 / 9;overflow:hidden;background:#020617}.canvas-wrap canvas{display:block;width:100%;height:100%}.loaded-pill{position:absolute;left:18px;bottom:18px;max-width:calc(100% - 36px);padding:12px 16px;border-radius:18px;background:#00000047;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.loaded-pill span{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.2em;color:#ffffff73}.loaded-pill strong{display:block;margin-top:4px;max-width:560px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#ffffffd1;font-size:14px;font-weight:400}.control-card{padding:20px;display:flex;flex-direction:column;gap:18px}.upload-box{display:flex;align-items:center;justify-content:center;gap:9px;min-height:56px;border:1px dashed rgba(255,255,255,.22);border-radius:18px;background:#ffffff12;color:#ffffffd1;cursor:pointer}.upload-box input{display:none}.play-button{height:52px;border:0;border-radius:18px;background:#fff;color:#020617;display:flex;align-items:center;justify-content:center;gap:9px;font-size:15px;font-weight:600;cursor:pointer}audio{display:none}.field-group{display:flex;flex-direction:column;gap:8px}.label-row{display:flex;justify-content:space-between;color:#ffffffb8;font-size:14px}.label-row span{color:#ffffff6b}input[type=range]{width:100%;accent-color:white}select{height:44px;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:#ffffff14;color:#fff;padding:0 12px}select option{color:#020617}.meters{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.meter{padding:12px;border:1px solid rgba(255,255,255,.1);border-radius:16px;background:#ffffff0e}.meter span{display:block;margin-bottom:9px;color:#ffffff73;font-size:12px}.meter div{height:6px;border-radius:999px;background:#ffffff1f;overflow:hidden}.meter i{display:block;height:100%;border-radius:999px;background:#ffffffb8}.note{margin:0;padding:14px;border:1px solid rgba(255,255,255,.1);border-radius:18px;background:#0000002e;color:#ffffff8c;font-size:12px;line-height:1.6}@media(max-width:900px){.engine-shell{padding:18px}.engine-layout{grid-template-columns:1fr}}.visual-card.dragging{outline:2px dashed rgba(255,255,255,.65);outline-offset:8px;box-shadow:0 0 90px #ffe6be59}.engine-shell.dragging,.visual-card.dragging{outline:2px dashed rgba(255,255,255,.65);outline-offset:-12px}.hero{margin-bottom:24px}.eyebrow{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:#ffffff73;margin-bottom:10px}.hero h1{font-size:42px;line-height:1;font-weight:700;color:#f8f7ff;margin-bottom:14px}.hero-copy{max-width:680px;font-size:16px;line-height:1.7;color:#ffffffad}.theater-button{height:44px;border:1px solid rgba(255,255,255,.18);border-radius:16px;background:#ffffff14;color:#fff;font-size:14px;cursor:pointer}.theater-mode .hero,.theater-mode .control-card{display:none}.theater-mode .engine-layout{max-width:none;grid-template-columns:1fr}.theater-mode .visual-card{border-radius:0;border:none;height:100vh}.theater-mode .canvas-wrap{height:100vh;aspect-ratio:auto;border-radius:0}.theater-exit{position:fixed;top:24px;right:24px;z-index:9999;height:44px;padding:0 18px;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:#00000073;color:#fff;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);cursor:pointer}.theater-mode{width:100vw;height:100vh;padding:0;max-width:100vw}.theater-mode .hero{display:none}.theater-mode .engine-layout{grid-template-columns:1fr 360px;gap:24px;width:100vw;height:100vh;padding:24px;align-items:stretch}.theater-mode .visual-card{height:calc(100vh - 48px)}.theater-mode .canvas-wrap{height:100%}.theater-mode canvas{height:100%}.theater-button{width:100%;border-radius:18px;border:1px solid rgba(255,255,255,.12);background:#ffffff0f;color:#fff;padding:14px 18px;font-size:16px;cursor:pointer;transition:all .25s ease}.theater-button:hover{background:#ffffff1f}.theater-mode .engine-layout{width:100vw;height:100vh;max-width:none;padding:0;margin:0;display:block}.theater-mode .visual-card{width:100vw;height:100vh;border-radius:0;border:none}.theater-mode .canvas-wrap{width:100vw;height:100vh;aspect-ratio:auto;border-radius:0}.theater-mode canvas{width:100vw!important;height:100vh!important}.theater-mode .control-card{display:none}html:fullscreen,body:fullscreen,#root:fullscreen{width:100vw;height:100vh;overflow:hidden;background:#020617}.theater-mode{width:100vw!important;height:100vh!important;padding:0!important;margin:0!important;overflow:hidden!important}.theater-mode .engine-layout{width:100vw!important;max-width:none!important;height:100vh!important;padding:0!important;margin:0!important;display:block!important}.theater-mode .visual-card,.theater-mode .canvas-wrap,.theater-mode canvas{width:100vw!important;max-width:none!important;height:100vh!important;border-radius:0!important;border:none!important}.theater-mode .control-card,.theater-mode .hero{display:none!important}