/* editor.css — the writing room. It borrows the film's grade and type so the
   two feel like one product, and adds nothing but a two-column grid. */
body.editor { padding:26px clamp(16px,4vw,40px) 60px; }
body.editor::before, body.editor::after { display:none; }
.ed-top { display:flex; flex-wrap:wrap; gap:18px; justify-content:space-between; align-items:end;
  border-bottom:1px solid var(--line); padding-bottom:18px; margin-bottom:24px; }
.ed-top h1 { font-size:1.8rem; }
.ed-top p { color:var(--title-soft); margin:6px 0 0; font-size:.9rem; }
.ed-actions { display:flex; gap:10px; }
.ed-grid { display:grid; grid-template-columns:minmax(300px,1fr) minmax(320px,1.05fr); gap:28px; align-items:start; }
.ed-fields { display:grid; gap:16px; }
.ed-fields fieldset { border:1px solid var(--line); border-radius:4px; padding:16px; display:grid; gap:12px; margin:0; }
.ed-fields legend { font-family:var(--mono); font-size:.6rem; letter-spacing:.26em; text-transform:uppercase;
  color:var(--warm); padding:0 8px; }
.ed-preview { position:sticky; top:20px; display:grid; gap:10px; }
.ed-tabs { display:flex; flex-wrap:wrap; gap:8px; }
.ed-tabs .btn[aria-pressed="true"] { border-color:var(--warm); color:var(--warm); }
.ed-frame { border:1px solid var(--line); border-radius:4px; overflow:hidden; background:#000; aspect-ratio:4/3; }
.ed-frame iframe { width:100%; height:100%; border:0; display:block; }
.ed-out { margin-top:20px; color:var(--title-soft); }
@media (max-width:900px) { .ed-grid { grid-template-columns:1fr; } .ed-preview { position:static; } }