:root{color-scheme:dark;--bg:#142622;--panel:#203730;--line:#40594e;--fg:#f8f3e5;--muted:#b7c6b7;--mint:#d2e88b;--text:#172a25;font-family:"DM Sans",Inter,system-ui,sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg)}main{max-width:1220px;margin:auto;padding:0 32px}.top,.bar,.transport,.actions,footer{display:flex;align-items:center;justify-content:space-between;gap:12px}.top{padding:24px 0;border-bottom:1px solid var(--line);color:var(--muted)}.brand{font-weight:800;font-size:22px;letter-spacing:-.04em;color:var(--fg)}.mark{display:inline-grid;place-items:center;background:var(--mint);color:var(--text);border-radius:9px;width:34px;height:34px;margin-right:6px}.intro{padding:37px 0 24px}.intro h1{font-size:clamp(42px,8vw,80px);letter-spacing:-.08em;line-height:.98;margin:0}.intro p{color:var(--muted);margin-bottom:0}.workspace{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(330px,1fr);gap:18px;align-items:start}.preview,.editor{border:1px solid var(--line);border-radius:20px;background:var(--panel);padding:18px;min-width:0}.bar h2,.bar h3{margin:0;font-size:17px}.formats{display:flex;gap:6px}.formats small{margin-left:3px;opacity:.8}.stage{display:grid;place-items:center;min-height:440px;background:#101f1c;border:1px solid #394f46;border-radius:14px;margin:14px 0;padding:14px;overflow:hidden}.stage canvas{max-width:100%;max-height:530px;height:auto;width:auto;object-fit:contain;display:block;border-radius:8px}.transport input{flex:1;min-width:20px;accent-color:var(--mint)}#clock{font-variant-numeric:tabular-nums;min-width:42px;color:var(--muted)}button,input,textarea,select{font:inherit}button{background:#2a473c;color:var(--fg);border:1px solid #506d5d;padding:8px 11px;border-radius:8px;cursor:pointer;white-space:nowrap;font-size:14px}button:hover{background:#385b4d}button[aria-pressed=true],.primary{background:var(--mint);color:var(--text);border-color:transparent;font-weight:700}button:disabled{opacity:.45;cursor:default}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,a:focus-visible{outline:2px solid #f7b777;outline-offset:2px}.editor label{display:block;font-size:13px;color:var(--muted);margin:13px 0 6px}.editor input:not([type=file]),.editor textarea,.editor select{display:block;width:100%;background:#142923;border:1px solid #4b695a;color:var(--fg);border-radius:8px;padding:9px 10px}.editor textarea{resize:vertical}.scenes{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0}.scenes button{max-width:100%;overflow:hidden;text-overflow:ellipsis}.editor form{border-top:1px solid var(--line);padding-top:13px}.primary{margin-top:10px}.actions{justify-content:flex-start;flex-wrap:wrap;margin-top:13px}.status{font-size:13px;color:var(--muted);min-height:35px;margin:12px 0 0}footer{padding:23px 0;color:var(--muted);font-size:13px}a{color:var(--mint)}@media(max-width:820px){main{padding:0 16px}.workspace{grid-template-columns:1fr}.stage{min-height:240px}.stage canvas{max-height:420px}.intro{padding-top:26px}}@media(max-width:400px){.preview,.editor{padding:12px}.formats small{display:none}.top{font-size:13px}.transport{gap:6px}.transport button{padding:6px 7px}}
