:root{--bg0:#070A12;--bg1:#0E1630;--card: rgba(255,255,255,.06);--card2: rgba(255,255,255,.09);--stroke: rgba(255,255,255,.12);--text:#EAF0FF;--muted: rgba(234,240,255,.72);--accent:#7C5CFF;--accent2:#21C7A8;color-scheme:dark}*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;background:radial-gradient(1200px 700px at 20% 0%,#18235A 0%,transparent 60%),radial-gradient(900px 600px at 90% 10%,#2A0E4D 0%,transparent 55%),linear-gradient(180deg,var(--bg0) 0%,var(--bg1) 100%);color:var(--text)}a{color:inherit}button,input,select{font:inherit}.app{padding:16px;max-width:1220px;margin:0 auto}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid var(--stroke);border-radius:14px;background:linear-gradient(180deg,#ffffff14,#ffffff0a);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.brand{display:flex;align-items:center;gap:10px;min-width:0}.logo{width:34px;height:34px;border-radius:10px;background:conic-gradient(from 180deg,var(--accent),var(--accent2),#FF4FD8,var(--accent));box-shadow:0 10px 40px #7c5cff40}.brand h1{font-size:14px;letter-spacing:.3px;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.brand .sub{font-size:12px;color:var(--muted)}.grid{margin-top:14px;display:grid;grid-template-columns:1fr 360px;gap:14px}@media (max-width: 980px){.grid{grid-template-columns:1fr}}.panel{border:1px solid var(--stroke);border-radius:16px;background:linear-gradient(180deg,#ffffff12,#ffffff08);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.panelHeader{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 12px 10px;border-bottom:1px solid rgba(255,255,255,.08)}.panelHeader h2{margin:0;font-size:13px;letter-spacing:.3px}.panelHeader .hint{font-size:12px;color:var(--muted)}.panelBody{padding:12px}.stageWrap{display:grid;grid-template-columns:1fr;gap:10px}.stage{position:relative;width:100%;aspect-ratio:9/16;max-height:calc(100svh - 180px);max-width:min(56vh,560px);margin:0 auto;border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.14);background:#03050d}.stage canvas{width:100%;height:100%;display:block}.stageOverlay{position:absolute;inset:10px 10px auto 10px;display:flex;align-items:center;justify-content:space-between;gap:10px;pointer-events:none}.badge{pointer-events:none;display:inline-flex;align-items:center;gap:8px;padding:7px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.16);background:#00000047;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);font-size:12px}.dot{width:8px;height:8px;border-radius:999px;background:#ff345a;box-shadow:0 0 0 6px #ff345a2e}.mono{font-variant-numeric:tabular-nums}.controls{display:grid;grid-template-columns:1fr 1fr;gap:10px}@media (max-width: 520px){.controls{grid-template-columns:1fr}}.dock{position:fixed;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));z-index:60;display:none;align-items:center;justify-content:space-between;gap:8px;padding:8px;border-radius:18px;border:1px solid rgba(255,255,255,.14);background:#00000059;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.dockGroup{display:flex;gap:6px;align-items:center;min-width:0}.recordFab{width:64px;height:64px;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:radial-gradient(circle at 30% 30%,#ffffff2e,#ffffff0d 45%,#ffffff08),linear-gradient(180deg,#7c5cff59,#7c5cff2e);box-shadow:0 18px 50px #00000059;cursor:pointer;display:grid;place-items:center}.recordDot{width:18px;height:18px;border-radius:999px;background:#ff345a;box-shadow:0 0 0 10px #ff345a2e}.drawerScrim{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;z-index:70}.drawer{position:fixed;left:8px;right:8px;bottom:calc(86px + env(safe-area-inset-bottom));z-index:80;border-radius:18px;border:1px solid rgba(255,255,255,.14);background:#0a0c14c7;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);max-height:min(62svh,520px);overflow:auto}.drawerHeader{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px;border-bottom:1px solid rgba(255,255,255,.08);background:#0a0c14e0;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.drawerTitle{display:flex;flex-direction:column;gap:2px}.drawerTitle .t{font-size:13px;letter-spacing:.3px}.drawerTitle .d{font-size:12px;color:var(--muted)}.drawerBody{padding:12px}.pill{width:100%;padding:10px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:#ffffff0f;cursor:pointer;text-align:left}.pillActive{border-color:#7c5cff8c;background:#7c5cff2e}@media (max-width: 980px){.app{padding-bottom:128px}.grid{gap:10px}.panel{border-radius:14px}.dock{display:flex}.panelLooks,.controls{display:none}.dock .btn{padding:10px 8px;border-radius:14px;font-size:12px;line-height:1;white-space:nowrap;min-width:0}}.card{border:1px solid rgba(255,255,255,.12);border-radius:14px;background:#ffffff0d;padding:10px}.row{display:flex;gap:10px;align-items:center;justify-content:space-between}.stack{display:flex;flex-direction:column;gap:8px}.label{font-size:12px;color:var(--muted)}.select,.input{width:100%;background:#0000003d;border:1px solid rgba(255,255,255,.14);color:var(--text);padding:10px;border-radius:12px;outline:none}.btn{border:1px solid rgba(255,255,255,.14);background:#ffffff12;color:var(--text);padding:10px 12px;border-radius:12px;cursor:pointer}.btnPrimary{border-color:#7c5cff8c;background:linear-gradient(180deg,#7c5cff59,#7c5cff2e)}.btnDanger{border-color:#ff345a80;background:linear-gradient(180deg,#ff345a59,#ff345a2e)}.btn:disabled{opacity:.55;cursor:not-allowed}.btnRow{display:flex;gap:8px;flex-wrap:wrap}.btnIcon{padding:10px;min-width:44px}.small{font-size:12px;color:var(--muted)}.previewVideo{width:100%;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:#00000059}