/* EZ Web Streams — Editor styles (edit.html only). Shared tokens come from /style.css */

/* ============================================================================
   PREMIUM DESIGN SYSTEM (v24) — restyle only; layout, ids & behavior unchanged.
   These tokens override the shared /style.css defaults for the editor page only,
   so the whole editor (header, cards, buttons, inputs, modals) reads as one
   calm, expensive SaaS surface (Linear / Framer / Figma direction).
   ============================================================================ */
:root{
  --bg:#F6F8FC; --card:#FFFFFF; --line:#E8ECF3; --line-soft:#EDF1F7;
  --txt:#121826; --dim:#697386;
  --acc:#2964FF; --accd:#1C57F8; --acc-hi:#4F7BFF;
  --acc-grad:linear-gradient(135deg,#4F7BFF 0%,#2964FF 100%);
  --ok:#22C55E; --danger:#E44C4C; --danger-bg:#FFF5F5;
  --r-card:18px; --r-btn:12px; --r-input:12px;
  --sh-card:0 8px 30px rgba(20,30,50,.06), 0 1px 2px rgba(20,30,50,.04);
  --sh-hover:0 18px 40px rgba(0,0,0,.08);
  --sh-primary:0 10px 24px rgba(41,100,255,.30);
  --ease:cubic-bezier(.2,.8,.2,1);
}
body.app{
  font-family:Inter,-apple-system,"Segoe UI",Roboto,sans-serif;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}

.edwrap{max-width:none;width:100%;box-sizing:border-box;margin:16px 0;padding:0 20px;display:flex;flex-direction:column;gap:16px}

/* ---------- empty state ---------- */
.ed-empty{text-align:center;padding:40px 26px}
.ed-empty h1{font-size:24px;margin-bottom:6px}
.ed-empty-row{justify-content:center;margin-top:18px}
/* All three entry points read as one row of equal-weight buttons — a plain .chip
   is normally smaller than .cta (Record Screen), so match its sizing here rather
   than shrinking .cta (that would fight its styling everywhere else it's used).
   body.app .chip (0,2,0, declared later in this file) sets padding/font-size —
   must out-specify it, not just out-order it. */
body.app .ed-empty-row .chip{padding:13px 24px;font-size:16px;border-radius:10px;font-weight:700}
/* body.app .chip (below) sets a higher-specificity card background — beat it
   explicitly rather than relying on source order, which is fragile here. */
body.app .chip.ed-phonechip{background:#f0731a;border-color:#f0731a;color:#fff;font-weight:700}
body.app .chip.ed-phonechip:hover{background:#d9640f;border-color:#d9640f;color:#fff}
body.app .chip.ed-browsechip{background:#eef1f6;border-color:#dbe1eb}
body.app .chip.ed-browsechip:hover{background:#e3e8f0;border-color:#c8d0dd}

/* ---------- top row: preview + bin ---------- */
/* Full-width top row: three equal premium cards. */
.ed-top{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:stretch;position:relative;z-index:5}
/* ↑ lift the FILES/preview row above the sibling timeline card so the "All Media" bin dropdown
   (which overflows the card, and whose card gets a transform on hover → own stacking context)
   always paints ABOVE the Background/Beat Sync toolbar below it. */
@media (max-width:1080px){.ed-top{grid-template-columns:1fr}}
.ed-top>.card{border:1px solid var(--line);border-radius:14px;box-shadow:0 6px 22px rgba(16,24,40,.07),0 1px 2px rgba(16,24,40,.04)}
.ed-top>.card h3{font-size:12px;text-transform:uppercase;letter-spacing:.07em;color:var(--dim);font-weight:700;margin:0 0 12px}

/* Preview fills its card to the edges; transport is OVERLAID on the video. */
.ed-previewcard{padding:12px;display:flex}
.ed-stage{position:relative;width:100%;align-self:flex-start;border-radius:10px;overflow:hidden;background:#000;border:1px solid var(--line);aspect-ratio:16/9;display:flex;align-items:center;justify-content:center}
#preview{display:block;height:100%;width:auto;max-width:100%;background:#000;touch-action:none}/* v66: touch-action none so scale/rotate handle drags don't scroll the page on touch. v132: height-constrained to the fixed 16:9 stage — JS sets the real aspect inline via previewCv.style.aspectRatio, so 9:16/1:1 just render smaller + centred at the SAME card height */
/* Aspect-ratio reframe: the stage is a FIXED 16:9 flex-centered box; the canvas fits
   inside it by height. Vertical (9:16) & square (1:1) therefore render narrower and
   centred at the same height as 16:9 — no extra card height, no side-card white space. */
.ed-transport{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;gap:8px;
  padding:10px 12px 11px;background:linear-gradient(to top,rgba(0,0,0,.75),rgba(0,0,0,.15) 70%,rgba(0,0,0,0))}
.ed-transport .chip{background:rgba(255,255,255,.92);border-color:transparent}
.ed-transport .chip:hover{background:#fff}
.ed-tcode{color:#fff;font-variant-numeric:tabular-nums;font-size:13px;text-shadow:0 1px 2px rgba(0,0,0,.6)}

/* Inspector (middle card) */
.ed-props{padding:16px}
.ed-propsempty{color:var(--dim);font-size:13px;padding:26px 6px;text-align:center;line-height:1.55}
.ed-proprow{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--line);font-size:13px}
.ed-proprow:last-of-type{border-bottom:0}
.ed-proprow span{color:var(--dim)}
.ed-proprow b{color:var(--txt);font-variant-numeric:tabular-nums;font-weight:600;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ed-speedctl{display:inline-flex;align-items:center;gap:3px;color:var(--txt);font-weight:600}
.ed-speedctl input{width:60px;text-align:right;background:var(--bg);color:var(--txt);border:1px solid var(--line);
  border-radius:6px;padding:4px 6px;font-size:13px;font-weight:600;font-variant-numeric:tabular-nums}
.ed-speedctl input:focus{outline:none;border-color:var(--acc)}
.ed-speedctl i{font-style:normal;color:var(--dim)}
.ed-speedctl input[type=text]{width:74px}
.ed-orig{font-style:normal;color:var(--dim);font-size:11px;font-weight:400;margin-left:4px}
.ed-iconbtn{font-size:17px;line-height:1;padding:6px 11px;font-weight:800}
/* instant hover tooltip for toolbar icons/buttons (replaces slow native title) */
.ed-uitip{position:fixed;display:none;z-index:200;pointer-events:none;transform:translateX(-50%);
  background:#0f1522;color:#fff;font-size:11px;font-weight:400;line-height:1.35;padding:5px 9px;border-radius:7px;
  box-shadow:0 8px 22px rgba(0,0,0,.35);white-space:nowrap;border:1px solid rgba(255,255,255,.1)}
.ed-confirmdanger{background:#c0392b;border-color:#c0392b;color:#fff}
.ed-confirmdanger:hover{background:#a93226}
/* profile menu (logged-in nav) */
.ed-profwrap{position:relative;display:inline-flex;align-items:center;gap:8px;margin-left:auto}
/* Plan badge — matches the recorder's gold PRO pill (#f0b429) */
.ed-navplan{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.06em;border-radius:6px;padding:3px 9px;
  background:var(--line);color:var(--dim)}
.ed-navplan.pro{background:#f0b429;color:#14181f}
/* profile avatar — IDENTICAL to the homepage (.ezn-avatar) + Free/PRO corner badge */
.ezn-avatar{position:relative;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;border:1px solid rgba(15,23,42,.16);color:#16233b;background:#fff;cursor:pointer;padding:0;flex:none}
.ezn-avatar:hover{background:#eef2f8}
.ezn-avatar svg{width:19px;height:19px}
.ezn-avatar.hidden{display:none!important}
.ezn-prodot{position:absolute;bottom:-3px;right:-5px;font-size:8px;font-weight:800;letter-spacing:.03em;color:#7a5600;background:#f0c14b;border:1.5px solid #fff;border-radius:999px;padding:0 4px;line-height:1.55}
.ezn-prodot.free{color:#5b6472;background:#e6eaf1}
/* Features / Compare / Blog nav pills (light, matching the editor nav) */
.ed-navpill{display:inline-flex;align-items:center;padding:7px 14px;border-radius:999px;font-size:12.5px;font-weight:700;color:var(--txt,#1a2233);background:var(--bg,#f7f9fc);border:1px solid var(--line,#e6eaf1);text-decoration:none;white-space:nowrap;transition:border-color .15s,color .15s,background .15s}
.ed-navpill:hover{border-color:var(--acc);color:var(--acc);background:#fff}
@media(max-width:960px){.ed-navpill{display:none}}
.ed-profmenu{transition:opacity .16s ease,transform .16s ease;transform-origin:top right}
.ed-profmenu.hidden{display:block;opacity:0;visibility:hidden;transform:translateY(-7px) scale(.97);pointer-events:none}
.ed-profmenu{position:absolute;right:0;top:calc(100% + 8px);background:var(--card);border:1px solid var(--line);
  border-radius:12px;box-shadow:0 12px 30px rgba(16,24,40,.18);min-width:214px;padding:6px;z-index:110}
.ed-profhead{font-size:12px;color:var(--dim);padding:8px 10px 10px;border-bottom:1px solid var(--line);
  margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ed-profitem{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:none;border:0;color:var(--txt);font-size:14px;padding:7px 10px;border-radius:8px;cursor:pointer}
.ed-profitem:hover{background:var(--bg)}
.ed-pi-ico{flex:none;width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;font-size:14px;line-height:1;border-radius:8px;background:var(--bg,#f2f5fa);border:1px solid var(--line,#e6eaf1)}
.ed-pi-lbl{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ed-profitem.mi-primary .ed-pi-ico{background:rgba(41,100,255,.10);border-color:rgba(41,100,255,.22)}
.ed-profitem.ed-pi-danger{color:var(--danger,#e5484d)}
.ed-profitem.ed-pi-danger .ed-pi-ico{background:rgba(229,72,77,.10);border-color:rgba(229,72,77,.24)}
.ed-profitem.active{color:var(--acc);font-weight:600}
/* Structured dropdown: hairline divider + emphasized core entry points */
.profdiv{height:0;margin:6px 8px;border:0;border-top:1px solid var(--line)}
.ed-profitem.mi-primary{font-weight:700;color:var(--acc)}
/* Context-aware plan badge: Free/logged-out → Upgrade CTA; Pro → quiet tag */
.ed-navplan-slot{display:inline-flex;align-items:center}
.upgrade-cta{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:800;letter-spacing:.01em;line-height:1;
  color:#fff;background:linear-gradient(135deg,#3b78ff,#1f54d6);border-radius:99px;padding:6px 13px;text-decoration:none;white-space:nowrap;
  box-shadow:0 2px 10px rgba(47,107,255,.35);transition:filter .15s ease,transform .15s ease,box-shadow .15s ease}
.upgrade-cta:hover{filter:brightness(1.07);transform:translateY(-1px);box-shadow:0 4px 16px rgba(47,107,255,.45)}
.upgrade-cta:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.pro-tag{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:800;letter-spacing:.05em;line-height:1;
  color:#a67908;background:rgba(240,180,41,.16);border:1px solid rgba(240,180,41,.55);border-radius:99px;padding:4px 10px;cursor:default;user-select:none}
.ed-fileinfo{font-size:11.5px;font-weight:400;text-align:right;white-space:normal;line-height:1.4;max-width:64%;color:var(--txt)}
/* Merged Source + File-properties row: [icon] filename (left, truncates) · properties (right) */
.ed-propfile{display:flex;align-items:center;gap:7px;min-width:0;flex:1 1 auto}
.ed-propicon{flex:none;font-size:15px;line-height:1}
.ed-propfile #propName{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;font-weight:600;color:var(--txt)}
.ed-fade2{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:10px 0;border-bottom:1px solid var(--line)}
.ed-fade2 label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--dim)}
.ed-fade2 .ed-speedctl{align-self:flex-start}
.ed-fade2 .ed-speedctl input{width:64px}
/* Fade in / Fade out / Speed / Duration all on one line */
.ed-fade4{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1.55fr);gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}
.ed-fade4 label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--dim);min-width:0}
.ed-fade4 .ed-lbl{white-space:nowrap}          /* keep "Duration (Original …)" on one line */
.ed-fade4 .ed-speedctl{align-self:flex-start;max-width:100%}
.ed-fade4 .ed-speedctl input{width:52px}
.ed-fade4 .ed-speedctl input[type=text]{width:58px}
@media (max-width:1180px){.ed-fade4{grid-template-columns:1fr 1fr}}
/* ▶ Clip-to-clip transition (crossfade / dissolve / wipe from the previous clip) */
.ed-transrow{padding:10px 0;border-bottom:1px solid var(--line)}
.ed-transrow-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:8px}
.ed-transrow-ctl{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ed-tsel{background:var(--bg);color:var(--txt);border:1px solid var(--line);border-radius:8px;
  padding:6px 8px;font:600 13px system-ui,-apple-system,sans-serif;min-width:118px}
.ed-tsel:focus{outline:none;border-color:var(--acc)}
.ed-transnote{margin:8px 0 0;font-size:11.5px;line-height:1.35;color:var(--dim)}
body.app .ed-transrow{border-bottom:1px solid var(--line-soft)}
body.app .ed-transrow .ed-lbl{font-size:11px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;color:var(--dim)}
body.app .ed-tsel{background:#fff;border:1px solid var(--line-soft);border-radius:10px}
body.app .ed-tsel:focus{border-color:var(--acc);box-shadow:0 0 0 3px rgba(70,120,255,.12)}
/* Transition dropdown highlights blue when a transition is active — matches the Background button */
.ed-tsel.ed-tsel-on,body.app .ed-tsel.ed-tsel-on{background:rgba(41,100,255,.12);border-color:var(--acc);color:var(--acc);font-weight:600}
/* ---------- 🔍 auto-zoom marker popover (restored) ---------- */
.az-pop{position:fixed;z-index:150;width:230px;background:var(--card);border:1px solid var(--line);border-radius:14px;
  box-shadow:0 18px 44px rgba(16,24,40,.20),0 2px 8px rgba(16,24,40,.08);padding:12px 13px;
  font-family:inherit;color:var(--txt);animation:azPopIn .14s var(--ease,ease)}
.az-pop.hidden{display:none}
@keyframes azPopIn{from{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:none}}
.az-pop-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}
.az-pop-title{font-size:13px;font-weight:700;line-height:1.25}
.az-pop-x{background:none;border:0;color:var(--dim);font-size:14px;line-height:1;cursor:pointer;padding:2px 4px;border-radius:6px}
.az-pop-x:hover{background:var(--bg);color:var(--txt)}
.az-pop-lbl{display:flex;align-items:center;justify-content:space-between;font-size:12px;font-weight:600;color:var(--dim);margin-bottom:6px}
.az-pop-val{font-weight:700;color:var(--acc)}
.az-pop-slrow{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.az-pop-slrow input[type=range]{flex:1;min-width:0;accent-color:var(--acc);cursor:pointer}
.az-pop-mini{font-size:10px;color:var(--dim);flex:none}
.az-pop-btn{display:block;width:100%;box-sizing:border-box;font:inherit;font-size:13px;font-weight:600;cursor:pointer;
  padding:8px 10px;margin-top:8px;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--txt);
  transition:border-color .15s,background .15s}
.az-pop-btn:hover{border-color:var(--acc);background:#fff}
.az-pop-del{color:var(--danger);border-color:transparent;background:var(--danger-bg)}
.az-pop-del:hover{border-color:var(--danger);background:var(--danger-bg)}
body.app .ed-transnote{color:#9aa3b2}
/* Clip heading with the layer name on the opposite side (saves a row) */
.ed-clabhead{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.ed-clayer{font-size:12.5px;color:var(--dim);white-space:nowrap}
.ed-clayer b{color:var(--txt);font-weight:600}
.ed-propbtns{margin-top:14px;gap:6px;flex-wrap:nowrap;overflow-x:auto}
.ed-propbtns .chip{flex:0 0 auto;padding:8px 10px;font-size:12.5px;white-space:nowrap}
.chip.ed-iconlbl{display:inline-flex;align-items:center;gap:6px}          /* Crop / Scale: real SVG icon + label */
.chip.ed-iconlbl svg{width:14px;height:14px;flex:none}
.ed-previewctrls .chip.ed-iconlbl svg{width:12px;height:12px}            /* smaller in the preview-overlay pill */
.ed-danger{color:#c0392b;border-color:#e6bcb6}
.ed-danger:hover{background:#fdecea}

/* MULTI-SELECT card (renderProps → >1 clip). Mirrors the clip card's header + field look. */
.ed-multicard .ed-clabhead{align-items:center;flex-wrap:wrap;row-gap:8px}
.ed-multihint{color:var(--dim);font-size:13px;line-height:1.5;margin:12px 0 6px}
.ed-multifade{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:6px 0 2px}
.ed-multifade label{display:flex;flex-direction:column;gap:8px;font-size:13px;color:var(--dim);min-width:0}
.ed-multifade .ed-lbl{font-size:11px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;color:var(--dim);white-space:nowrap}
.ed-multifade .ed-speedctl{align-self:flex-start;max-width:100%}
body.app .ed-multifade .ed-speedctl input{background:#fff}

.ed-transport{display:flex;align-items:center;gap:8px;margin-top:12px;flex-wrap:wrap}
.ed-transport .spacer{flex:1}
.ed-tcode{font-variant-numeric:tabular-nums;font-weight:700;font-size:15px;color:var(--txt);min-width:120px}

/* ---------- media bin ---------- */
.ed-bin{padding:18px;position:relative}
.ed-bin h3{margin-top:0}
/* Whole-bin drag-drop overlay — shown while dragging OS files over the Media card. */
.ed-bindrop{position:absolute;inset:8px;z-index:6;display:none;align-items:center;justify-content:center;text-align:center;
  border-radius:14px;border:2px dashed var(--acc);color:var(--acc);font-weight:700;font-size:15px;
  background:rgba(41,100,255,.10);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);pointer-events:none}
.ed-bin.ed-dropover .ed-bindrop{display:flex}
.ed-binlist{list-style:none;padding:0;margin:0 0 12px;display:flex;flex-direction:column;gap:6px;max-height:282px;overflow:auto}
.ed-binlist li.ed-binitem{display:flex;align-items:center;gap:10px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:8px;cursor:pointer;user-select:none;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}
.ed-binlist li.ed-binitem:hover{border-color:var(--acc);box-shadow:0 8px 18px -10px rgba(16,24,40,.28);transform:translateY(-1px)}
.ed-binthumb{position:relative;flex:none;width:78px;height:46px;border-radius:7px;background:#0b0f16 center/cover no-repeat;overflow:hidden}
.ed-binplay{position:absolute;inset:0;margin:auto;width:26px;height:26px;border:0;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:.4;transition:opacity .28s ease,transform .18s ease,background .18s ease}
.ed-binplay svg{width:13px;height:13px;display:block}
.ed-binplay[data-kind="play"] svg{margin-left:1.5px}   /* optically center the play triangle in the circle */
.ed-binthumb:hover .ed-binplay,.ed-binplay:focus-visible{opacity:1}
.ed-binplay:hover{transform:scale(1.14);background:#2563eb}
.ed-bintext{flex:1;min-width:0}
.ed-bintext .ed-binname{font-weight:600;color:var(--txt);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ed-shl{background:#ffe066;color:inherit;border-radius:2px;padding:0 1px;box-decoration-break:clone}   /* live-search match highlight (yellow) */
.ed-bintext .ed-binsub{margin-top:2px;font-size:11.5px;color:var(--dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ed-binlist li.ed-binitem .ed-binsize{color:var(--dim);font-variant-numeric:tabular-nums;flex:none;font-size:12px;align-self:flex-start;margin-top:1px;text-align:right;min-width:56px}
.ed-binlist li.ed-binitem .ed-bindur{color:var(--dim);font-variant-numeric:tabular-nums;flex:none;font-size:12px;align-self:flex-start;margin-top:1px;text-align:right;min-width:46px}
.ed-binlist li.ed-binitem{touch-action:none}
/* Bin-asset SELECTED — violet accent (matches the timeline linked-clip highlight) */
.ed-binlist li.ed-binitem.ed-binselected{border-color:#8B5CF6;background:rgba(139,92,246,.10);
  box-shadow:0 0 0 3px rgba(139,92,246,.18),0 8px 18px -10px rgba(88,28,135,.35)}
.ed-binlist li.ed-binitem.ed-binselected:hover{border-color:#8B5CF6}
/* PRIMARY item within a multi-select range (last-clicked) — a touch deeper ring so the whole range reads as selected, with the anchor/primary slightly emphasised */
.ed-binlist li.ed-binitem.ed-binprimary{box-shadow:0 0 0 3px rgba(139,92,246,.34),0 8px 18px -10px rgba(88,28,135,.4)}
/* "N Unused" button — red, and it smoothly collapses away when there's nothing unused */
#binUnusedBtn{background:#E44C4C;color:#fff;border-color:#E44C4C;font-weight:650;max-width:160px;
  transition:opacity .28s ease,transform .28s ease,max-width .28s ease,padding .28s ease,margin .28s ease}
#binUnusedBtn:hover:not(:disabled){background:#d63c3c;border-color:#d63c3c;color:#fff;transform:translateY(-1px)}
#binUnusedBtn.active{background:#c0392b;border-color:#c0392b;color:#fff}
#binUnusedBtn.ed-gone{opacity:0;transform:scale(.85);max-width:0;padding-left:0;padding-right:0;margin-left:0;
  border-width:0;overflow:hidden;pointer-events:none}

/* UNUSED asset (shown while the "N Unused" filter is on) — amber accent */
.ed-binlist li.ed-binitem.ed-binunused{border-color:#F59E0B;background:rgba(245,158,11,.10);
  box-shadow:0 0 0 2px rgba(245,158,11,.16)}
.ed-binlist li.ed-binitem.ed-binunused.ed-binselected{border-color:#8B5CF6;
  box-shadow:0 0 0 3px rgba(139,92,246,.20),0 0 0 5px rgba(245,158,11,.16)}
/* Bin header button group + the "N Unused" filter chip */
.ed-binhead-btns{display:flex;align-items:center;gap:8px;flex:none}
/* Icon-only bin buttons: keep every button the SAME height as ＋ Import — size the SVG icon
   (unsized SVGs stretch the button tall) and lay each out as a tidy inline pill. */
.ed-binhead-btns .chip{display:inline-flex;align-items:center;gap:6px;line-height:1}
.ed-binhead-btns .ic{width:16px;height:16px;flex:none}
/* Sort / filter dropdown */
.ed-sortwrap{position:relative;display:inline-flex}
.ed-sortmenu{position:absolute;top:calc(100% + 6px);right:0;z-index:130;min-width:184px;background:var(--card);
  border:1px solid var(--line);border-radius:12px;box-shadow:0 18px 40px rgba(16,24,40,.16),0 2px 6px rgba(16,24,40,.06);
  padding:6px;display:flex;flex-direction:column;gap:1px;max-height:min(72vh,540px);overflow-y:auto}
.ed-sortmenu.hidden{display:none}
.ed-sortlabel{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--dim);padding:6px 10px 4px}
.ed-sortopt{appearance:none;border:0;background:transparent;text-align:left;font:inherit;font-size:13px;font-weight:600;
  color:var(--txt);padding:8px 10px;border-radius:8px;cursor:pointer;white-space:nowrap}
.ed-sortopt:hover{background:var(--bg)}
.ed-sortopt.active{background:var(--acc);color:#fff}
.ed-sortopt-music:not(.active){color:#2f6bd6}    /* Royalty-Free Music — subtle blue */
.ed-sortopt-rec:not(.active){color:#1a9d5a}      /* My Recordings — subtle green */
.ed-sortopt-unused:not(.active){color:#d0524f}   /* Unused Clips — subtle reddish */
.ed-sortopt-premium:not(.active){color:#7c3aed}  /* Premium Tracks (AudioJungle) — violet */
/* AudioJungle preview flags — bin badge + clip-card License & Replace notice */
.ed-prevbadge{display:inline-block;background:#7c3aed;color:#fff;font-size:8.5px;font-weight:800;letter-spacing:.04em;padding:1px 5px;border-radius:4px;vertical-align:middle;margin-right:3px}
.ed-premiumbar{margin:0 0 12px;padding:11px 12px;border:1px solid #e6d9ff;background:#f6f1ff;border-radius:11px}
.ed-premiumbar.hidden{display:none}
.ed-premiumtop{display:flex;align-items:flex-start;gap:8px;margin-bottom:9px}
.ed-premiumbadge{flex:none;background:#7c3aed;color:#fff;font-size:9px;font-weight:800;letter-spacing:.04em;padding:2px 7px;border-radius:5px;line-height:1.5}
.ed-premiumtxt{font-size:11.5px;color:#5b21b6;line-height:1.35}
.ed-premiumacts{display:flex;gap:8px}
.ed-premiumlic{flex:none;border:1px solid #7c3aed;background:#7c3aed;color:#fff;text-decoration:none;font-weight:700}
.ed-premiumlic:hover{background:#6d28d9}
.ed-sortcaret{margin-left:7px;font-size:15px;line-height:1;color:var(--dim)}   /* the ▾ after the filter label */
.ed-sortbtn.active{border-color:var(--acc);color:var(--acc)}
.ed-unusedbtn.active{background:rgba(245,158,11,.14);border-color:rgba(245,158,11,.5);color:#b45309}
.ed-unusedbtn:disabled{opacity:.45;cursor:default;box-shadow:none;transform:none}
/* Ghost that follows the cursor when dragging a bin item onto the timeline */
.ed-bindragghost{position:fixed;z-index:9999;pointer-events:none;background:rgba(37,99,235,.94);color:#fff;font-size:12px;font-weight:600;padding:6px 11px;border-radius:8px;box-shadow:0 10px 26px rgba(0,0,0,.35);white-space:nowrap}
.ed-bindragghost.over{background:#16a34a}
.ed-binlist:empty::after{content:"No media yet";color:var(--dim);font-size:13px}
.ed-keys{margin:14px 0 0;font-size:12.5px;line-height:1.8}
.ed-keys b{color:var(--txt);background:var(--bg);border:1px solid var(--line);border-radius:5px;padding:1px 6px;font-weight:600}

/* ---------- timeline ---------- */
.ed-timelinecard{padding:14px 14px 10px;margin-top:14px}   /* breathing room from the 3 cards above */
.ed-tlbar{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.ed-tlbar h3{margin:0}
#snapBtn.active{background:var(--acc);color:#fff;border-color:var(--acc)}
#waveBtn.active{background:#3f6212;color:#ecfccb;border-color:#65a30d}
#polishBtn.active{background:#7c3aed;color:#fff;border-color:#7c3aed}
#autoMoveBtn.active{background:#0d9488;color:#fff;border-color:#0d9488}
.ed-tlbar .spacer{flex:1}
.ed-tlwrap{width:100%;position:relative}
/* OS file dragged over the timeline: premium glow ring + "drop to add" hint (the
   clip-shaped landing preview itself is drawn on the canvas via the bin-drag ghost). */
.ed-tlwrap.ed-tldropover{outline:2px dashed rgba(41,100,255,.6);outline-offset:-4px;border-radius:12px;
  box-shadow:inset 0 0 0 9999px rgba(41,100,255,.06),0 0 0 3px rgba(41,100,255,.14)}
.ed-tlwrap.ed-tldropover::after{content:"Drop to add to the timeline";position:absolute;top:8px;left:50%;
  transform:translateX(-50%);z-index:30;pointer-events:none;background:#2964FF;color:#fff;font-size:11px;
  font-weight:600;letter-spacing:.01em;padding:5px 12px;border-radius:999px;box-shadow:0 8px 22px rgba(41,100,255,.35)}
.ed-tltip{position:absolute;display:none;transform:translateX(-50%);z-index:1000;pointer-events:none;
  background:#0f1522;color:#fff;font-size:10.5px;font-weight:400;line-height:1.4;padding:5px 9px;border-radius:8px;
  box-shadow:0 8px 22px rgba(0,0,0,.35);white-space:nowrap;max-width:none;border:1px solid rgba(255,255,255,.1)}
.ed-tltip b{display:block;font-weight:400}
.ed-tltip span{display:block;color:#9fb0c6;font-size:9.5px;margin-top:1px;font-weight:400}
#timeline{display:block;width:100%;height:180px;background:var(--bg);border:1px solid var(--line);border-radius:10px;touch-action:none;cursor:default}

/* buttons */
button:disabled{opacity:.45;cursor:not-allowed}

/* ---------- modal ---------- */
.ed-modal{position:fixed;inset:0;background:rgba(5,8,12,.7);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:16px;z-index:120;overflow:auto}
/* The media/recording PREVIEW opens ON TOP of another modal (e.g. My Recordings) → stack it above */
#mediaPreviewModal{z-index:140}
.ed-modalcard{width:100%;max-width:560px;--modpad:22px;padding:var(--modpad);max-height:90vh;overflow-y:auto;overflow-x:hidden;margin:auto}
/* Keep the action footer (Done / Export / Confirm / Got it / etc.) always visible: pin the
   modal's footer to the bottom of the scrolling card so tall modals never hide their controls
   off-screen. Works for any footer tagged .ed-modalfoot (incl. buttons nested inside tab panes)
   AND the legacy last-child button row. --modpad keeps the sticky bleed aligned to the card
   edges even when the padding shrinks on small screens. */
.ed-modalcard>.btnrow:last-child,.ed-modalcard .ed-modalfoot{position:sticky;bottom:calc(-1*var(--modpad));
  margin:14px calc(-1*var(--modpad)) calc(-1*var(--modpad));padding:12px var(--modpad) var(--modpad);
  background:var(--card);box-shadow:0 -1px 0 var(--line-soft,var(--line)),0 -12px 14px -10px rgba(10,15,30,.16);z-index:3}
/* Consistent "primary action + Nevermind" modal footers: the secondary (Nevermind)
   button is pinned to the LEFT edge, the primary .cta (and any extra actions) are
   grouped to the RIGHT. Works regardless of source order because .ed-nevermind is
   pulled first (order:-1) and its margin-right:auto pushes everything else right. */
.ed-modalcard .ed-modalfoot.ed-footpair{display:flex;align-items:stretch;gap:10px}
.ed-modalcard .ed-modalfoot.ed-footpair>.ed-nevermind{order:-1}
/* EVERY modal footer: buttons split the row equally, edge to edge with identical indents,
   same height — only the background (filled primary vs outlined secondary) tells them apart. */
.ed-modalcard .ed-modalfoot{display:flex;align-items:stretch;gap:10px}
.ed-modalcard .ed-modalfoot>.cta,.ed-modalcard .ed-modalfoot>.chip{flex:1 1 0;min-width:0;height:48px;display:inline-flex;align-items:center;justify-content:center;text-align:center;margin:0;padding-top:0;padding-bottom:0;font-size:15px}
/* Modal body copy never strands a lone word on its last line. */
.ed-modalcard .hint,.ed-modalcard p{text-wrap:pretty}
/* Mobile: near-full-width modals, tighter padding, full-width action buttons, no horizontal overflow. */
@media(max-width:560px){
  .ed-modal{padding:8px}
  .ed-modalcard{--modpad:15px;max-height:94vh;border-radius:16px}
  .ed-modalhead h1{font-size:18px}
  .ed-modalcard>.btnrow:last-child,.ed-modalcard .ed-modalfoot{flex-wrap:wrap}
  .ed-modalcard>.btnrow:last-child>.cta,.ed-modalcard>.btnrow:last-child>.chip,
  .ed-modalcard .ed-modalfoot>.cta,.ed-modalcard .ed-modalfoot>.chip{flex:1 1 auto;justify-content:center;text-align:center}
  .ed-modalcard .ed-modalfoot.ed-footpair>.ed-nevermind{margin-right:0}
  .ed-tabpane input[type=text],.ed-tabpane textarea{max-width:100%}
  .ed-capstyle,.ed-cappos,.ed-transopt{min-width:0}
}
.ed-modalhead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
/* Contact / Report-a-Bug forms */
.ed-cform{display:flex;flex-direction:column;gap:11px}
.ed-cform label{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:600;color:var(--dim);letter-spacing:.01em}
.ed-cform input[type=text],.ed-cform input[type=email],.ed-cform textarea,.ed-cform select{width:100%;font:inherit;font-size:13.5px;font-weight:400;color:var(--txt);background:#fff;border:1px solid var(--line);border-radius:9px;padding:9px 11px;transition:border-color .15s ease,box-shadow .15s ease}
.ed-cform input:focus,.ed-cform textarea:focus,.ed-cform select:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 3px rgba(41,100,255,.14)}
.ed-cform textarea{resize:vertical;min-height:96px;line-height:1.5}
.ed-cform input[type=file]{font-size:12.5px;font-weight:400;color:var(--txt)}
.ed-cfrow{display:grid;grid-template-columns:1fr 1fr;gap:11px}
@media(max-width:540px){.ed-cfrow{grid-template-columns:1fr}}
.ed-cfhint{font-size:11px;font-weight:400;color:var(--dim);margin-top:1px}
.ed-cfopt{font-weight:400;color:var(--dim);text-transform:none;letter-spacing:0}
.ed-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0;pointer-events:none}
.ed-cfstatus{font-size:12.5px;font-weight:600;padding:8px 11px;border-radius:8px;line-height:1.4}
.ed-cfstatus.hidden{display:none}
.ed-cf-ok{background:#eaf7ee;color:#1a7f37;border:1px solid #bfe6c9}
.ed-cf-err{background:#fdecec;color:#c0392b;border:1px solid #f3c3c0}
.ed-caphead-actions{display:flex;align-items:center;gap:10px;margin-left:auto}
.ed-caphead-actions .ed-fillersoft{margin:0;flex:none;display:inline-flex;flex-direction:row;align-items:center;gap:6px;white-space:nowrap}
.ed-caphead-actions .ed-fillersoft span{white-space:nowrap;min-width:0}
.ed-caphead-actions .ed-fillersoft input{margin:0;flex:none}
.ed-modalhead h1{font-size:20px;margin:0}
#exportModal .ed-modalcard{max-width:660px}   /* +100px wider for the YouTube form */

/* ============ About / Privacy / Terms modals ============ */
/* Scrollable legal body for Privacy / Terms */
.ed-legalbody{max-height:65vh;overflow-y:auto;overflow-x:hidden;padding-right:6px;margin:2px 0}
.ed-legalbody .ed-legalupd{color:var(--dim);font-size:12.5px;margin:0 0 12px}
.ed-legalbody .ed-legallead{font-size:14.5px;line-height:1.65;margin:0 0 6px;color:var(--txt)}
.ed-legalbody h3{font-size:15.5px;margin:18px 0 6px;color:var(--txt);border-left:3px solid #2964ff;padding-left:9px;letter-spacing:0;text-transform:none}
.ed-legalbody h4{font-size:13.5px;margin:12px 0 4px;color:var(--txt);letter-spacing:0;text-transform:none}
.ed-legalbody p{font-size:14px;line-height:1.65;margin:0 0 10px;color:var(--txt)}
.ed-legalbody ul{margin:0 0 12px;padding-left:20px}
.ed-legalbody li{font-size:14px;line-height:1.6;margin:4px 0;color:var(--txt)}
.ed-legalbody a{color:#2964ff}

/* About — hero / wordmark */
.ed-abouthero{text-align:center;padding:6px 4px 16px;border-bottom:1px solid var(--line-soft,var(--line));margin-bottom:14px}
.ed-aboutmark{font-size:26px;font-weight:800;letter-spacing:-.02em;color:var(--txt)}
.ed-aboutmark span{color:#2964ff}
.ed-abouttag{font-size:14px;line-height:1.55;color:var(--dim);margin:8px auto 0;max-width:360px}
.ed-aboutver{font-size:12px;color:var(--dim);margin:10px 0 0;letter-spacing:.02em}

/* About — credits (Team + Technology) */
.ed-aboutcredits h2{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--dim);margin:0 0 10px}
.ed-aboutcredits h2.ed-techhd{margin-top:18px}
.ed-teamrow{display:flex;align-items:center;gap:12px;padding:8px 0}
.ed-teamphoto{width:58px;height:58px;border-radius:50%;object-fit:cover;flex:none;border:2px solid var(--line-soft,var(--line));background:var(--bg)}
.ed-teamlead .ed-teamphoto{width:64px;height:64px;border-color:#2964ff}
.ed-teamphoto.ed-bioclick{cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}
.ed-teamphoto.ed-bioclick:hover{transform:scale(1.06);box-shadow:0 4px 14px -4px rgba(41,100,255,.55)}
.ed-biobody{text-align:center}
.ed-biophoto{width:120px;height:120px;border-radius:50%;object-fit:cover;border:3px solid #2964ff;margin:0 auto 12px;display:block}
.ed-biotitle{font-size:12.5px;font-weight:700;color:#2964ff;text-transform:uppercase;letter-spacing:.04em;margin-bottom:10px}
.ed-biotext{font-size:14px;line-height:1.6;color:var(--txt);margin:0;text-align:left}
.ed-envcta-bin{margin-bottom:8px}
.ed-teaminfo{display:flex;flex-direction:column;gap:2px;min-width:0}
.ed-teaminfo b{font-size:15px;color:var(--txt)}
.ed-teamlead .ed-teaminfo b{font-size:16px}
.ed-teaminfo span{font-size:13px;line-height:1.5;color:var(--dim)}
.ed-otherapps{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.ed-otherapps a{display:flex;flex-direction:column;gap:1px;text-decoration:none;padding:9px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);transition:border-color .15s,background .15s,transform .15s}
.ed-otherapps a:hover{border-color:var(--acc);background:#fff;transform:translateY(-1px)}
.ed-otherapps a b{font-size:13.5px;font-weight:700;color:var(--txt)}
.ed-otherapps a span{font-size:12px;color:var(--dim)}
.ed-aboutcredits dl{display:grid;grid-template-columns:auto 1fr;gap:5px 14px;margin:2px 0 0}
.ed-aboutcredits dt{font-size:13px;color:var(--dim)}
.ed-aboutcredits dd{font-size:13px;color:var(--txt);margin:0;text-align:right;font-weight:600}

/* About — footer */
.ed-aboutfoot{margin-top:16px;padding-top:12px;border-top:1px solid var(--line-soft,var(--line));display:flex;flex-direction:column;gap:4px;align-items:center;text-align:center}
.ed-aboutfoot>span{font-size:12px;color:var(--dim)}
.ed-aboutlinks a{color:#2964ff;text-decoration:none}
.ed-aboutlinks a:hover{text-decoration:underline}

/* About — sticky top (brand+version+Team) with an internal scroll region for the software list */
.ed-aboutcard{display:flex;flex-direction:column;max-height:90vh;overflow:hidden;padding:0}
.ed-abouttop{flex:0 0 auto;padding:var(--modpad) var(--modpad) 12px;border-bottom:1px solid var(--line-soft,var(--line))}
.ed-aboutscroll{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;padding:14px var(--modpad) var(--modpad)}
.ed-abouthead{margin-bottom:11px;align-items:flex-start}
.ed-aboutbrand{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;min-width:0}
.ed-abouthead .ed-aboutmark{font-size:22px;line-height:1.1}
.ed-aboutverline{font-size:11px;color:var(--dim);letter-spacing:.02em;font-weight:500;white-space:nowrap}
.ed-abouttop .ed-abouttag{margin:0 0 8px;max-width:none;text-align:left}
.ed-aboutteam{margin-bottom:0}
.ed-aboutteam .ed-teamrow:last-child{padding-bottom:0}
.ed-aboutscroll .ed-techhd{margin-top:2px}
.ed-aboutscroll .ed-aboutfoot{margin-top:16px}

/* App info modal — opened from "Other software to try" */
.ed-appinfocard{position:relative;max-width:460px}
.ed-appinfoclose{position:absolute;top:14px;right:14px;z-index:4}
.ed-appinfobanner{position:relative;width:100%;aspect-ratio:16/9;border-radius:14px;overflow:hidden;
  background:var(--bg);border:1px solid var(--line-soft,var(--line))}
.ed-appinfobanner img{width:100%;height:100%;object-fit:cover;display:block}
.ed-appinfofallback{position:absolute;inset:0;display:none;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#2964ff,#7aa2ff)}
.ed-appinfofallback span{font-size:66px;line-height:1;filter:drop-shadow(0 6px 12px rgba(10,20,50,.28))}
.ed-appinfoname{font-size:22px;margin:16px 0 0;color:var(--txt);letter-spacing:-.01em}
.ed-appinfotag{font-size:14px;color:var(--acc);font-weight:600;margin:5px 0 0}
.ed-appinfodesc{font-size:14px;line-height:1.6;color:var(--dim);margin:10px 0 0}
/* Small rotating ring — used inside the busy #cleanRun button while audio is cleaning. */
.ed-spinner{display:inline-block;width:14px;height:14px;margin-right:8px;vertical-align:-2px;box-sizing:border-box;
  border:2px solid rgba(255,255,255,.42);border-top-color:#fff;border-radius:50%;animation:edSpin .7s linear infinite}
#cleanRun.is-busy{opacity:.85;cursor:progress}
@keyframes edSpin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.ed-spinner{animation:none;opacity:.55}}
/* ✓ Flash — compact centered auto-dismiss confirmation, above every modal (z 200). */
.ed-flash{position:fixed;left:50%;top:20%;transform:translateX(-50%);z-index:200;
  display:flex;align-items:center;gap:12px;padding:13px 16px;border-radius:14px;max-width:min(92vw,420px);
  background:var(--card,#fff);border:1px solid var(--line-soft,var(--line,#e5e9f0));
  box-shadow:0 22px 55px -14px rgba(10,15,30,.4);animation:edFlashIn .22s var(--ease,ease)}
.ed-flash.hidden{display:none}
.ed-flash-ic{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:26px;height:26px;
  border-radius:50%;background:#e7f7ee;color:#16a34a;font-weight:800;font-size:14px}
.ed-flash-msg{font-weight:650;font-size:14.5px;color:var(--txt,#111)}
.ed-flash-x{margin-left:4px;padding:4px;background:none;border:0;cursor:pointer;line-height:1;font-size:15px;color:var(--dim,#8a94a6)}
.ed-flash-x:hover{color:var(--txt,#111)}
@keyframes edFlashIn{from{opacity:0;transform:translateX(-50%) translateY(-8px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
@media(prefers-reduced-motion:reduce){.ed-flash{animation:none}}
.ed-headright{display:inline-flex;align-items:center;gap:12px}
.ed-ytlinkcta{background:#DCEAFF;color:var(--acc);border:1px solid rgba(41,100,255,.4);border-radius:12px;
  font-weight:700;font-size:13.5px;padding:9px 15px;cursor:pointer;box-shadow:0 3px 10px -3px rgba(41,100,255,.35);
  transition:background .18s var(--ease),transform .18s var(--ease),box-shadow .18s var(--ease)}
.ed-ytlinkcta:hover{background:#CFE1FF;transform:translateY(-1px);box-shadow:0 6px 16px -4px rgba(41,100,255,.45)}
.ed-uploadrow{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:6px}
.ed-uploadrow .hint{flex:1;min-width:180px}
.ed-cropstage{display:flex;justify-content:center;align-items:center;background:#0b0f16;border:1px solid var(--line);border-radius:10px;padding:10px;margin-top:6px}
.ed-cropstage canvas{max-width:100%;height:auto;border-radius:4px;touch-action:none;cursor:crosshair;display:block}
.ed-crophint{margin:10px 0 0;text-align:center;font-variant-numeric:tabular-nums}
/* -------- Animated Zoom modal (keyframed) -------- */
.ez-zmctl{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:12px}
.ez-zm-ease{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--dim);font-weight:600}
.ez-zm-ease select{background:var(--bg);color:var(--txt);border:1px solid var(--line);border-radius:8px;padding:7px 10px;font-size:14px}
.ez-zm-ease select:focus{outline:none;border-color:var(--acc)}
.ez-zmpresets{margin-top:12px;flex-wrap:wrap;justify-content:center}
.ez-zk-list{margin-top:14px;display:flex;flex-direction:column;gap:6px;max-height:230px;overflow:auto}
.ez-zk{display:flex;align-items:center;gap:10px;padding:7px 10px;background:var(--bg);border:1px solid var(--line);border-radius:9px}
.ez-zk-t{font-variant-numeric:tabular-nums;font-weight:700;min-width:52px}
.ez-zk-mini{position:relative;width:40px;height:24px;flex:0 0 auto;background:#0b0f16;border:1px solid var(--line);border-radius:3px;overflow:hidden}
.ez-zk-mini i{position:absolute;border:1.5px solid #2964FF;background:rgba(41,100,255,.18);box-sizing:border-box}
.ez-zk-z{font-variant-numeric:tabular-nums;font-weight:700;color:var(--acc);min-width:44px}
.ez-zk-ease{font-size:12px;color:var(--dim);flex:1}
.ez-zk-del{margin-left:auto;background:transparent;border:0;color:var(--dim);cursor:pointer;font-size:15px;line-height:1;padding:4px 6px;border-radius:6px}
.ez-zk-del:hover{background:rgba(239,68,68,.15);color:#ef4444}
.ed-fld{display:block;font-size:13px;color:var(--dim);font-weight:600}
.ed-fld input{display:block;width:100%;margin-top:7px;background:var(--bg);color:var(--txt);border:1px solid var(--line);border-radius:8px;padding:10px 12px;font-size:15px;box-sizing:border-box}
.ed-fld input:focus{outline:none;border-color:var(--acc)}
.ed-durrow{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid var(--line);font-size:13px}
.ed-durrow:last-of-type{border-bottom:0;margin-bottom:2px}
.ed-durrow span{color:var(--dim)}
.ed-durrow b{color:var(--txt);font-variant-numeric:tabular-nums;font-weight:600}
/* ✨ Polish Phase 2 — filler-word section */
.ed-fillersec{margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.ed-fillerh{display:flex;align-items:center;gap:.5em;font-size:16px;margin:0 0 4px}
.ed-fillersoft{display:flex;align-items:flex-start;gap:9px;margin:12px 0 4px;
  font-size:12.5px;line-height:1.45;color:var(--dim);cursor:pointer}
/* Polish modal: elevate the checkbox rows into premium bordered cards */
#polishModal .ed-fillersoft{padding:11px 13px;background:var(--bg);border:1px solid var(--line);border-radius:12px;transition:border-color .15s,background .15s}
#polishModal .ed-fillersoft:hover{border-color:var(--acc);background:var(--card)}
.ed-fillersoft input{width:16px;height:16px;accent-color:var(--acc);cursor:pointer;flex:none;margin-top:1px}
.ed-fillersoft span{white-space:normal;min-width:0}   /* wrap next to the checkbox, top-aligned — no ellipsis */
.ed-fillersoft i{color:var(--dim);opacity:.85}
#fillerGo{background:#ef4444;border-color:#ef4444}
/* Polish modal — pauses + filler words side by side in a wide modal */
.ed-polishcols{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start}
.ed-polishcol{min-width:0}
@media(max-width:700px){.ed-polishcols{grid-template-columns:1fr;gap:8px}}
/* My Projects list */
.ed-projinput{width:100%;box-sizing:border-box;padding:10px 12px;font-size:14px;border:1px solid var(--line);border-radius:9px;background:var(--bg);color:var(--txt)}
.ed-projinput:focus{outline:none;border-color:var(--acc)}
.ed-projlist{display:flex;flex-direction:column;gap:8px;max-height:340px;overflow:auto}
.ed-projrow{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg)}
.ed-projrow:hover{border-color:var(--acc)}
.ed-projmeta{display:flex;flex-direction:column;min-width:0}
.ed-projmeta b{color:var(--txt);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ed-projmeta span{font-size:12px;color:var(--dim)}
/* My Recordings — empty / signed-out states (premium, centered) reuse ed-projlist */
.ed-recmsg{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:26px 18px;color:var(--dim)}
.ed-recmsg .ed-recmsg-ic{font-size:30px;line-height:1;opacity:.9}
.ed-recmsg p{margin:0;max-width:340px;font-size:13.5px;line-height:1.5}
.ed-recmsg .cta,.ed-recmsg .chip{margin-top:2px}
/* My Recordings rows: [thumbnail ▶] [name + meta] [Import to Bin] [🗑] */
.ed-recrow{gap:12px;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}
.ed-recrow:hover{border-color:var(--acc);box-shadow:0 8px 18px -10px rgba(16,24,40,.28);transform:translateY(-1px)}   /* match the main All-Media bin-item hover (soft shadow + lift) */
.ed-recrow .ed-projmeta{flex:1 1 auto}
/* Nudge the first row of every bin view down 2px so it isn't flush to the top */
.ed-binlist > :first-child, .ed-mustracks > :first-child{margin-top:2px}
/* "My Recordings" modal: wider card so [Import to Bin] + 🗑 sit side-by-side on one row (not stacked) */
#recordingsModal .ed-modalcard{max-width:680px}
#recordingsModal .ed-recrow .btnrow{flex:none;flex-wrap:nowrap;align-items:center;gap:8px}
.ed-recthumb{position:relative;flex:none;width:72px;height:44px;border-radius:8px;overflow:hidden;cursor:pointer;
  background:linear-gradient(135deg,#243244,#0b0f16) center/cover no-repeat;border:1px solid var(--line);
  transition:border-color .18s ease,transform .18s ease}
.ed-recthumb:hover{border-color:var(--acc);transform:translateY(-1px)}
.ed-recthumb.ed-recthumb-has{background-color:#000}
.ed-recplay{position:absolute;inset:0;margin:auto;width:26px;height:26px;border-radius:50%;
  background:rgba(0,0,0,.5);color:#fff;display:flex;align-items:center;justify-content:center;
  pointer-events:none;opacity:.9;transition:opacity .18s ease,transform .18s ease,background .18s ease}
.ed-recplay svg{width:13px;height:13px;display:block;margin-left:1.5px}
.ed-recthumb:hover .ed-recplay{opacity:1;transform:scale(1.1);background:#2563eb}
.ed-recbusy{opacity:.72}
/* Sort dropdown divider before the "My Recordings" view option */
.ed-sortsep{height:1px;background:var(--line);margin:5px 6px}
/* "My Recordings" inline in the media bin: reuse .ed-recrow, fit the narrower bin width */
.ed-binlist .ed-recrow{padding:8px;cursor:default}
.ed-binlist .ed-recrow .btnrow{flex:none;gap:6px}
.ed-binlist .ed-recmsg{padding:22px 14px}

/* ==================== PREMIUM editor cards + interactions ==================== */
.edwrap .card{
  border-radius:16px; border:1px solid var(--line);
  box-shadow:0 1px 2px rgba(16,24,40,.045), 0 12px 30px -14px rgba(16,24,40,.14);
  transition:transform .26s cubic-bezier(.34,1.56,.64,1), box-shadow .26s ease, border-color .26s ease;
}
.ed-top>.card:hover{
  transform:translateY(-4px);
  box-shadow:0 8px 16px -6px rgba(16,24,40,.10), 0 28px 56px -18px rgba(37,99,235,.26);
  border-color:#cbd8ef;
}
.ed-timelinecard:hover{ box-shadow:0 1px 2px rgba(16,24,40,.045), 0 20px 44px -16px rgba(16,24,40,.18); }
/* header accent dot */
.ed-props h3, .ed-bin h3, .ed-clabhead h3{ display:flex; align-items:center; gap:9px; }
.ed-props h3::before, .ed-bin h3::before, .ed-clabhead h3::before{
  content:""; width:9px; height:9px; border-radius:3px; flex:none;
  background:linear-gradient(135deg,#4f8ef7,#7c4dff); box-shadow:0 0 0 3px rgba(79,142,247,.14);
}
/* Media-bin heading uses the count badge itself as its leading accent — drop the square */
.ed-bin h3::before{ display:none; }
/* premium count / label badge */
.ed-cardbadge{
  display:inline-flex; align-items:center; justify-content:center; min-width:20px; height:20px; padding:0 7px;
  font-size:11px; font-weight:800; border-radius:99px; color:#fff; line-height:1;
  background:linear-gradient(135deg,#4f8ef7,#7c4dff); box-shadow:0 4px 10px -3px rgba(124,77,255,.5);
}
.ed-projlabel{font-size:11px;font-weight:600;color:var(--dim);text-transform:none;letter-spacing:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:180px}
/* Media-bin header with View Shortcuts on the opposite side */
.ed-binhead{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px}
.ed-binhead .ed-binhead-btns{margin-left:auto}   /* heading + search on the left, action buttons pushed right */
/* Small predictive search between the heading and the buttons — 70px idle, expands on focus, ✕ to reset */
.ed-binsearch{position:relative;display:flex;align-items:center;flex:none}
#binSearch{width:155px;font-size:12px;padding:6px 24px 6px 11px;border:1px solid var(--line);border-radius:8px;background:#eef1f6;color:var(--txt);transition:width .18s ease,border-color .15s ease,background .15s ease}
#binSearch::placeholder{color:#9aa4b2}
#binSearch:focus{width:215px;border-color:var(--acc);outline:none;background:#fff}
.ed-binsearchx{position:absolute;right:4px;top:50%;transform:translateY(-50%);border:0;background:transparent;cursor:pointer;color:var(--dim);font-size:11px;line-height:1;padding:3px}
.ed-binsearchx:hover{color:var(--txt)}
.ed-binsearchx.hidden{display:none}
.ed-scbtn{flex:none;font-size:12px;font-weight:600}
/* Keyboard shortcuts modal */
.ed-sclist{display:flex;flex-direction:column}
.ed-scrow{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:11px 2px;border-bottom:1px solid var(--line);font-size:13.5px;color:var(--txt)}
.ed-scrow:last-child{border-bottom:0}
.ed-scmuted{color:var(--dim)}
.ed-sclist kbd{display:inline-block;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;font-weight:700;color:var(--txt);background:var(--bg);border:1px solid var(--line);border-bottom-width:2px;border-radius:6px;padding:3px 8px;white-space:nowrap}
/* button micro-interactions */
.edwrap .chip{ transition:transform .16s cubic-bezier(.34,1.56,.64,1), box-shadow .16s ease, background .16s ease, border-color .16s ease, opacity .25s ease; }
.edwrap .chip:hover:not(:disabled){ transform:translateY(-1.5px); box-shadow:0 6px 14px -6px rgba(16,24,40,.25); }
.edwrap .chip:active:not(:disabled){ transform:translateY(0) scale(.97); }
/* transport controls over the preview: dim until you reach for them, then bloom to full */
.ed-transport{ opacity:.35; transition:opacity .3s ease; }
.ed-stage:hover .ed-transport, .ed-transport:hover, .ed-transport:focus-within{ opacity:1; }
.ed-transport .cta{ transition:transform .16s cubic-bezier(.34,1.56,.64,1), box-shadow .16s ease, opacity .3s ease; }
.ed-transport .cta:hover{ transform:translateY(-1.5px); box-shadow:0 8px 20px -6px rgba(37,99,235,.6); }
.ed-transport .cta:active{ transform:translateY(0) scale(.97); }
#fillerGo:hover{background:#dc2626}
#fillerGo:disabled{opacity:.45;cursor:not-allowed}
#fillerAnalyze:disabled{opacity:.6;cursor:progress}
/* transition picker */
.ed-translist{display:flex;flex-direction:column;gap:8px;margin-top:6px}
.ed-transopt{display:flex;align-items:center;gap:12px;text-align:left;width:100%;
  background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:12px 14px;cursor:pointer;color:var(--txt)}
.ed-transopt:hover{border-color:var(--acc);background:color-mix(in srgb,var(--acc) 6%,var(--bg))}
.ed-transopt.active{border-color:var(--acc);box-shadow:0 0 0 2px color-mix(in srgb,var(--acc) 35%,transparent)}
.ed-transopt b{font-size:14px}
.ed-transopt small{color:var(--dim);font-size:12px;margin-left:auto}
.ed-transdot{width:12px;height:12px;border-radius:50%;flex:0 0 auto;box-shadow:0 0 8px currentColor}

.ed-tabs{display:flex;gap:6px;border-bottom:1px solid var(--line);margin-bottom:16px}
.ed-tab{background:none;border:0;border-bottom:2px solid transparent;color:var(--dim);font-size:14.5px;font-weight:600;padding:8px 14px;cursor:pointer}
.ed-tab:hover{color:var(--txt)}
.ed-tab.active{color:var(--acc);border-bottom-color:var(--acc)}

.ed-tabpane{display:flex;flex-direction:column;gap:14px}
.ed-tabpane label{gap:6px}
.ed-tabpane input[type=text],.ed-tabpane textarea{background:var(--bg);color:var(--txt);border:1px solid var(--line);border-radius:8px;padding:9px 10px;font-size:15px;font-family:inherit;width:100%;resize:vertical}
.ed-tabpane input[type=text]:focus,.ed-tabpane textarea:focus{outline:none;border-color:var(--acc)}
.ed-sub{color:var(--dim);font-weight:400}

.ed-fieldrow{display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-size:14px}
.ed-fieldlabel{color:var(--dim)}
.ed-radio{flex-direction:row;align-items:center;gap:6px;color:var(--txt);cursor:pointer}

/* Platform export presets — set aspect + target resolution/bitrate in one click */
.ed-presets{display:flex;flex-wrap:wrap;gap:8px}
.ed-preset{font:inherit;font-size:13px;color:var(--txt);background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:6px 13px;cursor:pointer;transition:border-color .12s,background .12s,color .12s}
.ed-preset:hover{border-color:var(--acc,#2964FF)}
.ed-preset .ed-sub{opacity:.6}
.ed-preset.active{background:var(--acc,#2964FF);border-color:var(--acc,#2964FF);color:#fff}
.ed-preset.active .ed-sub{opacity:.85}

/* Bio modal must stack ABOVE the About modal it opens from (both are .ed-modal, base z-index:120) */
#bioModal{z-index:140}

.ed-aibox{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:14px;display:flex;flex-direction:column;gap:10px}
.ed-aibox textarea{background:var(--card)}

.ed-ytlinkrow{align-items:center}

.ed-progress{height:8px;background:var(--bg);border:1px solid var(--line);border-radius:99px;overflow:hidden}
.ed-progress div{height:100%;width:0%;background:var(--acc);border-radius:99px;transition:width .15s linear}
/* Cancel render — red, white text, right-aligned */
#renderCancelBtn{background:#dc2626;border-color:#dc2626;color:#fff;font-weight:600}
#renderCancelBtn:hover{background:#b91c1c;border-color:#b91c1c;color:#fff}
/* Export MP3 modal: give the reused progress bar a little breathing room. */
#mp3ProgWrap{margin:14px 0 2px}

.ed-ytresult{background:var(--bg);border:1px solid var(--acc);border-radius:10px;padding:12px;font-size:14.5px;word-break:break-all}

/* ============================================================================
   PREMIUM RESTYLE v24 — appended overrides (scoped to body.app / .edwrap so they
   win over /style.css + earlier editor.css without touching layout or ids).
   ============================================================================ */

/* ---------- header: modern SaaS bar ---------- */
body.app .nav{padding:13px 24px;gap:12px;background:var(--card);border-bottom:1px solid var(--line)}
body.app .brand{font-size:17px;font-weight:800;letter-spacing:-.01em;display:inline-flex;align-items:center;gap:10px}
/* Decorative gradient tile removed — the real logo (.brand-ico img) is the mark. */
body.app .badge{border:1px solid var(--line);border-radius:10px;padding:7px 12px;font-size:12.5px;font-weight:600;
  color:var(--dim);background:var(--card);transition:.2s var(--ease)}
body.app .badge:hover{border-color:#BFD3FF;color:var(--txt);background:#F8FAFD}
/* Autosaved status pill (wired to editor.js autosave clock) */
.ed-autosave{display:inline-flex;align-items:center;gap:6px;flex:none;font-size:12.5px;font-weight:600;
  color:#0F8B4C;background:#EAF8F0;border:1px solid #CDEEDC;border-radius:99px;padding:6px 12px 6px 10px;
  white-space:nowrap;transition:.25s var(--ease)}
.ed-autosave .ed-as-ic{color:var(--ok);flex:none}
.ed-autosave.ed-as-idle{color:var(--dim);background:var(--bg);border-color:var(--line)}
.ed-autosave.ed-as-idle .ed-as-ic{opacity:.4}
body.app .ed-navplan{border-radius:8px;padding:4px 9px;font-size:10.5px;letter-spacing:.08em}
body.app .ed-profbtn{border:1px solid var(--line);background:var(--card);color:#5b6472;transition:.2s var(--ease)}
body.app .ed-profbtn:hover{border-color:#BFD3FF;background:#F8FAFD}
body.app .ed-profbtn.is-pro{border-color:#e5c24e;background:#fdf3d4;color:#996c0d}
body.app .ed-profbtn.is-pro:hover{border-color:#dcb63a;background:#fbecc0}
body.app .ed-profmenu{border-radius:14px;box-shadow:0 16px 40px rgba(20,30,50,.16);padding:6px}
body.app .ed-profitem{border-radius:9px;font-size:13.5px}
@keyframes edMenuIn{from{opacity:0;transform:scale(.98) translateY(-4px)}to{opacity:1;transform:none}}
body.app .ed-profmenu:not(.hidden){animation:edMenuIn .16s var(--ease)}

/* ---------- buttons: primary gradient / secondary / soft-red delete ---------- */
body.app .cta{background:var(--acc-grad);color:#fff;border:0;border-radius:var(--r-btn);font-weight:650;
  letter-spacing:-.01em;box-shadow:0 5px 14px -5px rgba(41,100,255,.5);
  transition:transform .22s var(--ease),box-shadow .22s var(--ease),filter .22s var(--ease)}
body.app .cta:hover{background:var(--acc-grad);transform:translateY(-2px);filter:brightness(1.06);box-shadow:var(--sh-primary)}
body.app .cta:active{transform:scale(.97)}
body.app .cta.small{padding:9px 16px;font-size:14px;border-radius:10px}
body.app .chip{background:var(--card);color:var(--txt);border:1px solid var(--line);border-radius:10px;
  padding:8px 13px;font-size:13px;font-weight:550}
body.app .chip:hover{background:#F8FAFD;border-color:#DCE4F2}
body.app .chip:focus-visible,body.app .cta:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(70,120,255,.35)}
body.app .ed-danger{color:var(--danger);border-color:#F3D0D0;background:var(--danger-bg)}
body.app .ed-danger:hover{color:var(--danger);background:#FCEBEB;border-color:#EBB8B8}
body.app .cta.ed-confirmdanger{background:var(--danger);box-shadow:0 8px 20px -6px rgba(228,76,76,.5)}
body.app .cta.ed-confirmdanger:hover{background:#D93B3B;filter:none}

/* ---------- inputs: 44px, soft fill, focus glow ---------- */
body.app .ed-fld input,body.app .ed-projinput,body.app .ed-tabpane input[type=text],body.app .ed-tabpane textarea{
  min-height:44px;border-radius:var(--r-input);background:#FAFBFD;border:1px solid var(--line);padding:11px 14px;
  transition:border-color .18s var(--ease),box-shadow .18s var(--ease),background .18s var(--ease)}
body.app .ed-tabpane textarea{min-height:88px}
body.app .ed-fld input:hover,body.app .ed-projinput:hover,body.app .ed-tabpane input[type=text]:hover,body.app .ed-tabpane textarea:hover{border-color:#BFD3FF}
body.app .ed-fld input:focus,body.app .ed-projinput:focus,body.app .ed-tabpane input[type=text]:focus,body.app .ed-tabpane textarea:focus{
  outline:none;border-color:var(--acc);background:#fff;box-shadow:0 0 0 4px rgba(70,120,255,.12)}
body.app .ed-speedctl input:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 3px rgba(70,120,255,.12)}

/* ---------- cards + section titles ---------- */
body.app .edwrap .card{border-radius:var(--r-card);border:1px solid var(--line-soft);box-shadow:var(--sh-card)}
body.app .ed-top>.card{border-radius:var(--r-card)}
body.app .ed-top>.card:hover{transform:translateY(-3px);box-shadow:var(--sh-hover);border-color:#DCE6F7}
body.app .ed-timelinecard:hover{box-shadow:var(--sh-hover)}
body.app .edwrap h3,body.app .ed-bin h3,body.app .ed-props h3,body.app .ed-clabhead h3{
  font-size:12px;font-weight:700;letter-spacing:.08em;color:var(--dim)}

/* ---------- segmented timeline toolbar (Figma-style) ---------- */
/* individual line-icon white pills (mockup), not a gray container */
.ed-seg{display:inline-flex;align-items:center;gap:8px;flex:none;padding:0;background:transparent;border:0;max-width:100%}
.ed-seg-layer{margin-right:2px}
.ed-seg .chip{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1px solid var(--line);border-radius:12px;
  box-shadow:0 1px 2px rgba(20,30,50,.04);color:var(--txt);font-weight:600;font-size:13.5px;padding:9px 15px;white-space:nowrap;
  transition:background .18s var(--ease),border-color .18s var(--ease),color .18s var(--ease),box-shadow .18s var(--ease),transform .18s var(--ease)}
.ed-seg .chip svg{width:17px;height:17px;flex:none}          /* icons follow the button color via currentColor */
.ed-seg .chip:hover:not(:disabled){background:#F8FAFD;border-color:#D7DEEA;box-shadow:0 4px 10px -4px rgba(20,30,50,.18);transform:translateY(-1px)}
.ed-seg .chip:active:not(:disabled){transform:scale(.97)}
#addLayerBtn{color:var(--acc)}                                /* Layer = blue accent */
.ed-seg .chip.ed-icononly{padding:9px 11px}                  /* Snap / Auto Move — icon-only (label removed), tooltip via title */
.ed-seg-icons .chip{font-size:16px;padding:8px 11px;color:var(--txt)}
.ed-seg-icons .chip svg{width:17px;height:17px;color:#1E293B}   /* bold undo/redo — strong dark slate so they read clearly */
.ed-zoomseg{gap:10px}
.ed-zoomseg .chip{font-size:16px;font-weight:700;padding:6px 12px;min-width:36px;color:var(--txt)}
#zoomSlider{-webkit-appearance:none;appearance:none;width:96px;height:4px;border-radius:99px;background:var(--line);cursor:pointer}
#zoomSlider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:#fff;border:2px solid var(--acc);box-shadow:0 1px 3px rgba(20,30,50,.25);cursor:pointer}
#zoomSlider::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#fff;border:2px solid var(--acc);cursor:pointer}
/* active toggles = light-blue fill + blue icon/text (mockup Snap) */
.ed-seg #snapBtn.active,.ed-seg #waveBtn.active,.ed-seg #polishBtn.active,.ed-seg #autoMoveBtn.active{
  background:rgba(41,100,255,.10);border-color:rgba(41,100,255,.38);color:var(--acc);box-shadow:none;transform:none}

/* ---------- aspect-ratio reframe segment ---------- */
.ed-seg-aspect{gap:6px}
/* Custom aspect dropdown (div-based) — matches the menu-bar dropdown look */
.ed-aspdd{position:relative;display:inline-flex}
.ed-aspbtn{appearance:none;display:inline-flex;align-items:center;gap:8px;cursor:pointer;
  font:inherit;font-size:12px;font-weight:700;padding:7px 10px;font-variant-numeric:tabular-nums;
  background:#fff;color:var(--txt);border:1px solid var(--line);border-radius:12px;line-height:1.2;
  transition:border-color .14s var(--ease),box-shadow .14s var(--ease)}
.ed-aspbtn:hover{border-color:#D7DEEA;box-shadow:0 4px 10px -4px rgba(20,30,50,.18)}
.ed-aspbtn:focus-visible{outline:none;border-color:var(--acc);box-shadow:0 0 0 3px rgba(41,100,255,.14)}
.ed-aspbtn-caret{font-size:10px;color:var(--dim);transition:transform .16s var(--ease)}
.ed-aspdd.open .ed-aspbtn{border-color:var(--acc);box-shadow:0 0 0 3px rgba(41,100,255,.12)}
.ed-aspdd.open .ed-aspbtn-caret{transform:rotate(180deg)}
.ed-aspmenu{position:absolute;top:calc(100% + 6px);left:0;min-width:210px;
  background:var(--card);border:1px solid var(--line);border-radius:12px;
  box-shadow:0 18px 40px rgba(16,24,40,.14),0 2px 6px rgba(16,24,40,.06);
  padding:6px;display:none;flex-direction:column;gap:1px;z-index:70}
.ed-aspdd.open .ed-aspmenu{display:flex}
.ed-aspopt{appearance:none;border:0;background:transparent;cursor:pointer;font:inherit;font-size:13px;
  font-weight:600;color:var(--txt);text-align:left;display:flex;align-items:center;gap:8px;width:100%;
  box-sizing:border-box;padding:7px 10px;border-radius:8px;line-height:1.25;transition:background .12s var(--ease)}
.ed-aspopt:hover,.ed-aspopt:focus-visible{background:var(--bg);outline:none}
.ed-aspopt .ed-aspopt-ck{flex:0 0 auto;width:14px;text-align:center;color:var(--acc);font-size:12px;font-weight:800;visibility:hidden}
.ed-aspopt.sel .ed-aspopt-ck{visibility:visible}
.ed-aspopt .ed-aspopt-lbl{flex:1 1 auto;white-space:nowrap;font-variant-numeric:tabular-nums}
.ed-seg-aspect .ed-rfbtn{font-size:12px;font-weight:700;padding:7px 10px;font-variant-numeric:tabular-nums}
.ed-seg-aspect .ed-aspbtn.active,.ed-seg-aspect .ed-rfbtn.active{
  background:rgba(41,100,255,.10);border-color:rgba(41,100,255,.38);color:var(--acc);box-shadow:none;transform:none}
.ed-aspreframe{display:inline-flex;align-items:center;gap:6px;padding-left:8px;margin-left:2px;border-left:1px solid var(--line)}
.ed-asppan{display:inline-flex;align-items:center;gap:9px;padding-left:6px}
.ed-asppan label{display:inline-flex;align-items:center;gap:4px;font-size:13px;color:var(--dim);cursor:pointer}
.ed-asppan input[type=range]{-webkit-appearance:none;appearance:none;width:64px;height:4px;border-radius:99px;background:var(--line);cursor:pointer}
.ed-asppan input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:13px;height:13px;border-radius:50%;background:#fff;border:2px solid var(--acc);box-shadow:0 1px 3px rgba(20,30,50,.25);cursor:pointer}
.ed-asppan input[type=range]::-moz-range-thumb{width:13px;height:13px;border-radius:50%;background:#fff;border:2px solid var(--acc);cursor:pointer}

/* ---------- preview + inspector ---------- */
body.app .ed-previewcard{padding:14px}
body.app .ed-props{padding:20px}
body.app .ed-fade4{gap:12px;border-bottom:1px solid var(--line-soft)}
/* Image/video (and audio) hide the bottom button row → drop the now-dangling divider under the fade grid */
#clipCard.is-imgvidcard .ed-fade4, #clipCard.is-audiocard .ed-fade4{border-bottom:0}
/* Pull the Fade/Speed/Duration row up 10px toward the preview box on image/video */
#clipCard.is-imgvidcard .ed-fade4{margin-top:-10px}
body.app .ed-fade4 label{background:none;border:0;border-radius:0;padding:0;gap:8px}   /* no card chrome — plain label + input */
body.app .ed-fade4 .ed-lbl{font-size:11px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;color:var(--dim)}
body.app .ed-fade4 .ed-speedctl input{background:#fff}
body.app #propDownload{flex:1 1 100%;justify-content:center}

/* ---------- media bin: cards + dashed dropzone ---------- */
body.app .ed-binlist li.ed-binitem{background:#fff;border:1px solid var(--line);border-radius:12px;padding:9px}
body.app .ed-binlist li.ed-binitem:hover{border-color:#BFD3FF;box-shadow:0 10px 22px -12px rgba(20,30,50,.3);transform:translateY(-2px)}
body.app #importBtn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:100%;
  padding:16px;border:1.5px dashed #C9D6EC;border-radius:12px;background:#FBFCFE;color:var(--dim);font-weight:600;
  line-height:1.3;transition:.2s var(--ease)}
body.app #importBtn::after{content:"Video, image or audio — MP4, MOV, WEBM, PNG, JPG, GIF, MP3, WAV, M4A";font-size:11px;font-weight:500;color:var(--dim);opacity:.8;text-align:center;line-height:1.4;max-width:92%}
body.app #importBtn:hover{border-color:var(--acc);color:var(--acc);background:#F4F8FF;transform:none;box-shadow:none}
body.app #importBtn.ed-dropover{border-color:var(--acc);border-style:solid;color:var(--acc);background:#EAF1FF;box-shadow:0 0 0 3px rgba(41,100,255,.14)}
body.app #importBtn.ed-dropover::after{content:"Drop to import"}

/* ---------- timeline card ---------- */
body.app .ed-timelinecard{padding:18px 18px 14px}
body.app #timeline{border-radius:12px;border:1px solid var(--line);background:#FDFDFE}

/* ---------- floating hover/selected clip toolbar (mockup pill) ---------- */
.ed-cliptb{position:absolute;display:none;z-index:40;transform:translateX(-50%);
  align-items:stretch;gap:2px;padding:4px;border-radius:12px;
  background:#fff;border:1px solid #E6EAF2;
  box-shadow:0 6px 20px -6px rgba(20,30,50,.28),0 2px 6px rgba(20,30,50,.12);
  opacity:0;transition:opacity .13s var(--ease);white-space:nowrap;user-select:none}
.ed-cliptb.show{display:inline-flex;opacity:1}
.ed-cliptb button .ed-tbic svg{width:15px;height:15px;display:block}   /* SVG Crop/Scale icons sized to match the emoji glyphs */
.ed-cliptb::before{content:'';position:absolute;top:-5px;left:50%;width:11px;height:11px;background:#fff;border-left:1px solid #E6EAF2;border-top:1px solid #E6EAF2;border-top-left-radius:3px;transform:translateX(-50%) rotate(45deg);box-shadow:-3px -3px 5px -3px rgba(20,30,50,.14)}   /* up-pointing caret at the clip — same fill/border/shadow as the bar */
.ed-toast-action{pointer-events:auto;margin-left:12px;background:transparent;border:0;color:#8ec5ff;font-weight:800;cursor:pointer;text-decoration:underline;font:inherit;padding:0}   /* clickable despite the toast's pointer-events:none */
.ed-toast-action:hover{color:#bcdcff}
.ed-cliptb button{display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:1px;min-width:40px;padding:5px 7px;border:0;background:transparent;border-radius:8px;
  cursor:pointer;color:#3a465a;font:inherit;line-height:1;transition:background .12s}
.ed-cliptb button:hover{background:#EEF3FD}
.ed-cliptb button .ed-tbic{font-size:15px;line-height:1}
.ed-cliptb button .ed-tblbl{font-size:9.5px;font-weight:600;letter-spacing:.01em;color:#697386}
.ed-cliptb button.ed-tbdanger:hover{background:#FDECEC}
.ed-cliptb button.ed-tbdanger .ed-tbic{color:#e0645f}
.ed-cliptb button.ed-tbon .ed-tbic,.ed-cliptb button.ed-tbon .ed-tblbl{color:#2964FF}
.ed-cliptb .ed-tbsep{width:1px;margin:4px 1px;background:#EDF0F6;flex:0 0 auto}
/* color swatch popover */
.ed-tbswatches{position:absolute;top:calc(100% + 6px);left:50%;transform:translateX(-50%);
  display:none;gap:6px;padding:7px 8px;border-radius:11px;background:#fff;border:1px solid #E6EAF2;
  box-shadow:0 8px 22px -6px rgba(20,30,50,.3);z-index:41}
.ed-tbswatches.show{display:flex}
.ed-tbswatches button{width:20px;height:20px;min-width:0;padding:0;border-radius:50%;
  border:2px solid #fff;box-shadow:0 0 0 1px rgba(20,30,50,.15);cursor:pointer}
.ed-tbswatches button.ed-tbclear{background:#fff;color:#8a97a8;box-shadow:0 0 0 1px #d7deea;
  display:flex;align-items:center;justify-content:center;font-size:12px}
@media(max-width:760px){
  .ed-cliptb button{min-width:38px;padding:6px}
  .ed-cliptb button .ed-tblbl{font-size:9px}
}

/* ---------- progress bars ---------- */
body.app .ed-progress div{background:var(--acc-grad)}

/* ---------- modals: refined + entrance motion ---------- */
body.app .ed-modal{background:rgba(15,22,38,.55);backdrop-filter:blur(6px)}
/* Captions modal: NO blur + lighter scrim so the live caption preview on the video stays visible while styling */
body.app #capModal{background:rgba(15,22,38,.28);backdrop-filter:none;-webkit-backdrop-filter:none}
body.app .ed-modalcard{border-radius:20px;border:1px solid var(--line-soft);box-shadow:0 30px 80px -20px rgba(10,15,30,.5)}
body.app .ed-modalhead h1{font-weight:750;letter-spacing:-.02em}
@keyframes edModalIn{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}
body.app .ed-modal:not(.hidden) .ed-modalcard{animation:edModalIn .26s var(--ease)}

/* ---------- responsive: header wraps, segments scroll ---------- */
@media(max-width:1080px){
  .ed-tlbar{flex-wrap:wrap}
  .ed-seg{overflow-x:auto;-webkit-overflow-scrolling:touch}
}
@media(max-width:900px){.ed-autosave .ed-as-txt{display:none}.ed-autosave{padding:6px}}
@media(max-width:760px){
  body.app .nav{flex-wrap:wrap;padding:12px 16px;gap:10px}
  body.app #proBanner{order:5;flex-basis:100%}
}

/* ============================================================ 🎵 MUSIC LIBRARY
   Bin "Music" view: toggle button, genre pills, track rows, licensing footer.
   Mirrors the media-bin look (pills = accent when active, rows like bin items). */
.ed-musicbtn.active{background:rgba(41,100,255,.12);border-color:rgba(41,100,255,.5);color:var(--accd)}
.ed-music{display:flex;flex-direction:column;gap:10px;margin:0 0 12px}
.ed-mustabs{display:flex;gap:6px;overflow-x:auto;overflow-y:hidden;padding-bottom:4px;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.ed-mustab{flex:0 0 auto;border:1px solid var(--line);background:var(--bg);color:var(--dim);border-radius:999px;padding:6px 12px;font-size:12.5px;font-weight:600;cursor:pointer;white-space:nowrap;transition:background .16s ease,color .16s ease,border-color .16s ease,transform .12s ease}
.ed-mustab:hover{border-color:var(--acc);color:var(--txt);transform:translateY(-1px)}
.ed-mustab.active{background:var(--acc);border-color:var(--acc);color:#fff}
.ed-mustracks{display:flex;flex-direction:column;gap:6px;max-height:150px;overflow:auto}   /* ~2.5 rows visible so the tabs+duck+list fit the bin card without pushing the layout down */
.ed-mustrack{display:flex;align-items:center;gap:10px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:8px 10px;cursor:pointer;user-select:none;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}
.ed-mustrack:hover{border-color:var(--acc);box-shadow:0 8px 18px -10px rgba(16,24,40,.28);transform:translateY(-1px)}
.ed-musplay{flex:none;width:30px;height:30px;border:0;border-radius:50%;background:#1f2937;color:#fff;font-size:12px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding-left:1px;transition:background .16s ease,transform .16s ease}
.ed-musplay:hover{background:var(--acc);transform:scale(1.12)}
.ed-musplay.playing{background:var(--acc);color:#fff}
.ed-musmeta{flex:1 1 auto;min-width:0}
.ed-mustitle{font-weight:600;color:var(--txt);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ed-musdur{flex:none;color:var(--dim);font-variant-numeric:tabular-nums;font-size:12px;min-width:48px;text-align:right}
.ed-musadd{flex:none;border:1px solid var(--line);background:var(--card);color:var(--acc);border-radius:8px;padding:6px 10px;font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap;transition:background .16s ease,border-color .16s ease,color .16s ease,transform .12s ease}
.ed-musadd:hover:not(:disabled){background:var(--acc);border-color:var(--acc);color:#fff;transform:translateY(-1px)}
.ed-musadd:disabled{opacity:.5;cursor:default}
/* BPM + Loop chips in a music-library row's meta */
.ed-muschips{display:flex;flex-wrap:wrap;gap:5px;margin-top:4px}
.ed-muschip{display:inline-flex;align-items:center;gap:3px;font-size:10.5px;font-weight:600;line-height:1;color:var(--dim);background:var(--card);border:1px solid var(--line);border-radius:999px;padding:3px 8px;white-space:nowrap;font-variant-numeric:tabular-nums}
.ed-muschip-loop{color:var(--acc)}
.ed-musempty{color:var(--dim);font-size:13px;text-align:center;line-height:1.5;padding:22px 14px;background:var(--bg);border:1px dashed var(--line);border-radius:10px}
/* ---- AudioJungle premium-music CTA (top of the Music view) ---- */
.ed-envcta{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin:2px 0 10px;padding:10px 14px;border:1px solid var(--acc);border-radius:10px;background:linear-gradient(180deg,#EEF3FF,#E4ECFF);color:var(--accd);font-size:12.5px;font-weight:700;cursor:pointer;letter-spacing:.1px;transition:background .16s ease,color .16s ease,box-shadow .18s ease,transform .14s ease}
.ed-envcta:hover{background:var(--acc);color:#fff;transform:translateY(-1px);box-shadow:0 12px 24px -12px rgba(41,100,255,.55)}
/* ---- AudioJungle modal (#envatoModal) ---- */
.ed-envsearch{display:flex;gap:8px;margin-bottom:12px}
.ed-envsearch input{flex:1 1 auto;min-width:0;padding:9px 12px;border:1px solid var(--line);border-radius:9px;background:var(--bg);color:var(--txt);font-size:13px;transition:border-color .16s ease,box-shadow .16s ease}
.ed-envsearch input:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 3px rgba(41,100,255,.15)}
.ed-envresults{display:flex;flex-direction:column;gap:8px;min-height:130px;max-height:52vh;overflow-y:auto;overflow-x:hidden}
.ed-envrow{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:11px;padding:9px 11px;transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}
.ed-envrow:hover{border-color:var(--acc);box-shadow:0 10px 22px -14px rgba(16,24,40,.3);transform:translateY(-1px)}
.ed-envthumb{flex:none;width:46px;height:46px;border-radius:8px;background:#EEF1F7;display:flex;align-items:center;justify-content:center;font-size:20px;color:#9AA6BC;overflow:hidden}
.ed-envthumb img{width:100%;height:100%;object-fit:cover;display:block}
.ed-envmeta{flex:1 1 auto;min-width:0}
.ed-envtitle{font-weight:700;color:var(--txt);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ed-envauth{color:var(--dim);font-size:11.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:2px}
.ed-envprice{color:var(--accd);font-weight:700;font-size:12px}
.ed-envplay{flex:none;width:34px;height:34px;border:0;border-radius:50%;background:#1f2937;color:#fff;font-size:13px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding-left:1px;transition:background .16s ease,transform .16s ease}
.ed-envplay:hover:not(:disabled){background:var(--acc);transform:scale(1.1)}
.ed-envplay.playing{background:var(--acc)}
.ed-envplay:disabled{opacity:.4;cursor:default}
.ed-envlicense{flex:none;border:1px solid var(--acc);background:var(--acc);color:#fff;border-radius:8px;padding:7px 12px;font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap;text-decoration:none;transition:background .16s ease,transform .12s ease}
.ed-envlicense:hover{background:var(--accd);transform:translateY(-1px)}
.ed-envadd{flex:none;border:1px solid var(--line);background:var(--card);color:var(--acc);border-radius:8px;padding:7px 11px;font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap;transition:background .16s ease,border-color .16s ease,color .16s ease,transform .12s ease}
.ed-envadd:hover:not(:disabled){background:var(--acc);border-color:var(--acc);color:#fff;transform:translateY(-1px)}
.ed-envadd:disabled{opacity:.45;cursor:default}
.ed-envcat{flex:none;border:1px solid var(--line);background:var(--bg);color:var(--txt);border-radius:9px;padding:9px 8px;font-size:13px;cursor:pointer;max-width:132px}
.ed-envcat:focus{outline:none;border-color:var(--acc)}
.ed-envstate{padding:26px 14px;text-align:center;color:var(--dim);font-size:13px;line-height:1.5}
.ed-envfoot{margin:12px 0 0;padding-top:10px;border-top:1px solid var(--line-soft);font-size:11.5px;line-height:1.5}

/* ---------- CLIP-card inline preview (audio player / video / image) ---------- */
.ed-clippreview{margin:11px 0;padding:10px;background:var(--bg);border:1px solid var(--line);border-radius:12px}
.ed-clippreview.hidden{display:none}
.ed-cpplayer{display:flex;flex-direction:column;gap:8px}
.ed-cpimg{display:block;width:100%;max-height:180px;object-fit:contain;border-radius:8px;background:#0b0f16}
.ed-cpvideo{display:block;width:100%;max-height:180px;background:#000;border-radius:8px}
.ed-cprow{display:flex;align-items:center;gap:9px}
.ed-cpbtn{flex:none;width:30px;height:30px;border:0;border-radius:50%;background:#1f2937;color:#fff;font-size:12px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding-left:1px;transition:background .16s ease,transform .16s ease}
.ed-cpbtn:hover{background:var(--acc);transform:scale(1.1)}
.ed-cpseek{flex:1 1 auto;min-width:0;accent-color:var(--acc);cursor:pointer}
.ed-cptime{flex:none;color:var(--dim);font-variant-numeric:tabular-nums;font-size:11.5px;min-width:78px;text-align:right}
.ed-cpmute{flex:none;width:30px;height:30px;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--txt);font-size:13px;cursor:pointer;transition:background .16s ease,border-color .16s ease}
.ed-cpmute:hover{border-color:var(--acc)}
.ed-cpmute.active{background:var(--line);color:var(--dim)}

/* ---------- CLIP-card INFO BOX (image/video: preview LEFT + meta RIGHT) ----------
   Bordered card under the "Clip" header. #propInfoBox is a 2-column flex box for
   image/video; JS adds .is-audio to collapse it to one column (player on top). */
.ed-clipinfo{display:flex;gap:14px;align-items:stretch;margin:12px 0;padding:12px;
  background:var(--bg);border:1px solid var(--line);border-radius:14px}
body.app .ed-clipinfo{background:#FAFBFD;border:1px solid var(--line-soft)}
/* LEFT — big source preview; overrides the standalone .ed-clippreview chrome */
.ed-clipinfo-preview{flex:0 0 42%;max-width:42%;min-width:0;margin:0;padding:0;height:150px;align-self:flex-start;
  background:transparent;border:0;border-radius:0;display:flex;align-items:stretch;justify-content:center}
.ed-clipinfo-preview.hidden{display:none}
/* Fixed 150px preview box — any aspect ratio letterboxes (contain + black bars), so a tall/portrait image doesn't blow up the card */
.ed-clipinfo-preview .ed-cpimg{width:100%;height:100%;object-fit:contain;background:#000;border-radius:10px}
.ed-clipinfo-preview .ed-cpvideo{width:100%;height:100%;object-fit:contain;background:#000;border-radius:10px}
.ed-clipinfo-preview .ed-cpplayer{width:100%;gap:8px}
/* RIGHT — labelled meta rows (Source / File Properties / Transition) */
.ed-clipinfo-meta{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;justify-content:center}
.ed-clipinfo-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding:8px 0;border-bottom:1px solid var(--line-soft);min-width:0}
.ed-clipinfo-row:first-child{padding-top:0}
.ed-clipinfo-row:last-child{border-bottom:0;padding-bottom:0}
.ed-clipinfo .ed-lbl{flex:0 0 auto;font-size:11px;font-weight:600;letter-spacing:.03em;
  text-transform:uppercase;color:var(--dim);white-space:nowrap}
.ed-clipinfo-val{flex:1 1 auto;min-width:0;text-align:right;color:var(--txt);font-weight:600;
  font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ed-clipinfo-file{font-weight:400;font-size:11.5px;line-height:1.4;white-space:normal}
/* Label-less meta rows: filename + properties sit on their own, left-aligned; hover shows a tooltip */
#propName,#propFile{text-align:left;cursor:help}
.ed-clipinfo-namefile .ed-clipinfo-row{border-bottom:0}  /* no divider under the file-properties rows */
/* Transition row — dropdown right-aligned like the other values; note drops full-width */
.ed-clipinfo-trans{flex-wrap:wrap;align-items:center}
.ed-clipinfo-transctl{display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  justify-content:flex-end;flex:1 1 auto;min-width:0}
.ed-clipinfo-trans .ed-transnote{flex:1 1 100%;margin:6px 0 0;text-align:right}
.ed-clipinfo .ed-tsel:disabled{opacity:.55;cursor:not-allowed}
/* AUDIO — single column: player on top, meta below (no big left preview) */
.ed-clipinfo.is-audio{flex-direction:column;gap:10px}
.ed-clipinfo.is-audio .ed-clipinfo-preview{flex:1 1 auto;max-width:100%;width:100%;height:auto}
.ed-clipinfo.is-audio .ed-clipinfo-meta{width:100%}
/* Audio card: filename + file-properties share one line (name left, props right) */
.ed-clipinfo.is-audio .ed-clipinfo-namefile{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.ed-clipinfo.is-audio .ed-clipinfo-namefile>.ed-clipinfo-row:first-child{flex:1 1 auto;min-width:0}
.ed-clipinfo.is-audio .ed-clipinfo-namefile>.ed-clipinfo-row:last-child{flex:0 1 auto;min-width:0}
.ed-clipinfo.is-audio .ed-clipinfo-trans{margin-top:-10px}  /* tighten the gap between file properties and Clip Transition */
.ed-clipinfo.is-audio #propName{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ed-clipinfo.is-audio #propFile{text-align:right}
/* ============ CLIP CARD — relocated layouts (v90) ============
   Set by reflowClipCard(): both AUDIO (#clipCard.is-audiocard) and IMAGE/VIDEO
   (#clipCard.is-imgvidcard) move the action buttons into the header top-right as
   one equal-height horizontal row (Delete icon-only) and drop "Timeline Layer"
   into the meta slot; the bottom button row is hidden and the Fade/Speed/Duration
   grid keeps its original 4 cells.
     • AUDIO: Timeline Layer (left) + Clip Transition (right) share one meta row.
     • IMAGE/VIDEO: Timeline Layer is its own meta row directly above the Clip
       Transition row, and Crop+Zoom overlay the preview (center-bottom pill).
   The TEXT card uses a separate inspector and is untouched; on image/video the
   empty header/meta slots collapse via :empty. */
/* Header action buttons — one horizontal, equal-height, right-aligned row */
.ed-headactions{display:flex;gap:6px;flex-wrap:nowrap;justify-content:flex-end;align-items:stretch;min-width:0}
.ed-headactions:empty{display:none}                       /* no buttons here → invisible */
.ed-headactions .chip{flex:0 0 auto;margin:0;padding:7px 10px;font-size:12px;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center}
/* 🎙️ Clean — compact subtle-blue header chip next to Duplicate; same height/shape as its siblings */
.ed-cleanchip{background:#eef4ff;border-color:#cfe0ff;color:#2964ff}
.ed-cleanchip:hover{background:#e0ebff;border-color:#b6d0ff;color:#1f57f0}
.ed-headactions .ed-cleanchip.hidden{display:none}   /* beats .ed-headactions .chip when hidden for image clips */
#clipCard.is-audiocard #propDel .ed-btnlabel,
#clipCard.is-imgvidcard #propDel .ed-btnlabel{display:none} /* Delete is icon-only (trash glyph + title tooltip) */
#clipCard.is-audiocard #propDownload .ed-btnlabel,
#clipCard.is-imgvidcard #propDownload .ed-btnlabel{display:none} /* Download is icon-only too (⤓ glyph + title tooltip) */
#propDup .ed-btnlabel,
#txtDup .ed-btnlabel{display:none} /* Duplicate is icon-only on every clip card (⧉ glyph + title tooltip) */
#propCrop .ed-btnlabel,
#propZoom .ed-btnlabel{display:none} /* Crop/Scale are icon-only in the header (SVG + hover tooltip) */
.ed-headactions #propCrop.hidden,
.ed-headactions #propZoom.hidden{display:none} /* hidden for audio clips (no picture to crop/scale) */
/* Even vertical rhythm (8px) between the 4 image/video meta rows: filename / properties / Timeline Layer / Clip Transition */
#clipCard.is-imgvidcard .ed-clipinfo-namefile>.ed-clipinfo-row{padding-top:0;padding-bottom:0}
#clipCard.is-imgvidcard .ed-clipinfo-namefile>.ed-clipinfo-row:last-child{padding-top:8px}
/* Meta slot — holds Timeline Layer (audio also puts Clip Transition on its right) */
.ed-layerslot{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;row-gap:6px;min-width:0;margin-top:-6px}
.ed-layerslot:empty{display:none}                         /* nothing relocated in → invisible */
.ed-layerslot>.ed-clayer{flex:0 0 auto;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
#clipCard.is-audiocard .ed-clabhead,
#clipCard.is-imgvidcard .ed-clabhead{align-items:center;flex-wrap:wrap;row-gap:8px}
#clipCard.is-audiocard .ed-propbtns,
#clipCard.is-imgvidcard .ed-propbtns{display:none}         /* the buttons live in the header now */
/* AUDIO — Clip Transition sits on the RIGHT of the layer's meta row */
#clipCard.is-audiocard #propLayerSlot #propTransRow{margin:0;padding:0;border:0;display:flex;align-items:center;justify-content:flex-end;gap:8px;flex:1 1 auto;flex-wrap:wrap;min-width:0}
#clipCard.is-audiocard #propLayerSlot #propTransRow>.ed-lbl{flex:0 0 auto}
#clipCard.is-audiocard #propLayerSlot #propTransRow .ed-clipinfo-transctl{flex:0 1 auto;justify-content:flex-end}
#clipCard.is-audiocard #propLayerSlot #propTransRow .ed-transnote{flex:1 1 100%;text-align:right;margin:4px 0 0}
/* IMAGE/VIDEO — Timeline Layer is its own meta row (left-aligned) above the transition */
#clipCard.is-imgvidcard #propLayerSlot{padding:8px 0 0}
/* IMAGE/VIDEO — Crop+Zoom overlay the preview, center-bottom translucent pill */
.ed-clipinfo-preview{position:relative}
.ed-previewctrls{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);
  display:flex;gap:6px;padding:5px;border-radius:999px;z-index:3;
  opacity:.4;transition:opacity .22s ease;
  background:rgba(17,20,28,.58);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);
  box-shadow:0 4px 14px rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.16)}
.ed-clipinfo-preview:hover .ed-previewctrls{opacity:1}   /* dimmed crop/zoom pill rises to full on preview hover */
@media(prefers-reduced-motion:reduce){.ed-previewctrls{transition:none}}
.ed-previewctrls .chip{margin:0;padding:6px 11px;font-size:8.5px;white-space:nowrap;line-height:1;
  background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.22);border-radius:999px}
.ed-previewctrls .chip:hover{background:rgba(255,255,255,.26)}
.ed-previewctrls .chip.hidden{display:none}

/* ---------------------------------------------------- BIN-ITEM PREVIEW CARD
   Read-only inspector card for an un-placed media-bin asset. Reuses #clipCard's
   info box + inline #propPreview (via renderClipPreview on a throwaway pseudo-clip);
   #clipCard.is-binpreview HIDES every clip-only control (fade/speed/duration,
   Clip Transition, Timeline Layer, the relocated header action buttons, crop/zoom
   overlay + the bottom clip-op row) and reveals just Place + Download. */
.ed-binpreviewbtns{display:none;margin-top:14px;gap:8px;flex-wrap:nowrap;overflow-x:auto}
.ed-binpreviewbtns .chip{flex:0 0 auto;padding:8px 12px;font-size:12.5px;white-space:nowrap}
#clipCard.is-binpreview .ed-fade4,
#clipCard.is-binpreview #propTransRow,
#clipCard.is-binpreview #propVolRow,
#clipCard.is-binpreview #propLayerWrap,
#clipCard.is-binpreview #propLayerSlot,
#clipCard.is-binpreview .ed-propbtns,
#clipCard.is-binpreview .ed-headactions,
#clipCard.is-binpreview .ed-previewctrls{display:none!important}

/* 🔊 Per-clip VOLUME (Layer 1) — labelled slider + dB readout row. Shown for audio & video
   clips only (renderProps() toggles .hidden for images). Premium-light; consistent in both
   the audio (.is-audiocard) and image/video (.is-imgvidcard) card layouts. */
.ed-volrow{display:flex;flex-direction:column;gap:8px;padding:12px 0 2px;margin-top:-10px}
.ed-volrow.hidden{display:none}
.ed-volhead{display:flex;align-items:center;justify-content:space-between;gap:10px}
body.app .ed-volrow .ed-lbl{font-size:11px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;color:var(--dim)}
.ed-voldb{font-variant-numeric:tabular-nums;font-size:12.5px;font-weight:700;color:var(--acc);min-width:66px;text-align:right}
.ed-volrow.is-muted .ed-voldb{color:var(--dim)}
.ed-voltrack{position:relative;display:flex;align-items:center;padding:2px 0}
/* subtle tick at 0 dB (slider pos 750/1000 = 75% for the −60…+20 dB range) */
.ed-voltrack::before{content:"";position:absolute;left:75%;top:50%;transform:translate(-50%,-50%);width:2px;height:13px;border-radius:2px;background:var(--line);pointer-events:none;z-index:0}
/* Volume + Clip Transition sit in the meta column (image/video) — compact so they fit the narrower width */
#clipCard.is-imgvidcard .ed-clipinfo-meta #propVolRow{padding:8px 0 2px;gap:5px}
#clipCard.is-imgvidcard .ed-clipinfo-meta #propTransRow{border-bottom:0;padding-top:6px}
.ed-volslider{-webkit-appearance:none;appearance:none;width:100%;height:5px;border-radius:99px;background:var(--line);cursor:pointer;position:relative;z-index:1;margin:0}
.ed-volslider:focus{outline:none}
.ed-volslider::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid var(--acc);box-shadow:0 1px 3px rgba(20,30,50,.25);cursor:pointer}
.ed-volslider::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid var(--acc);cursor:pointer}
.ed-volslider:focus::-webkit-slider-thumb{box-shadow:0 0 0 3px rgba(70,120,255,.14)}
#clipCard.is-binpreview .ed-binpreviewbtns{display:flex}
.ed-binplace{background:var(--acc-grad);border-color:transparent;color:#fff;font-weight:700;box-shadow:var(--sh-primary)}
.ed-binplace:hover{filter:brightness(1.04);color:#fff}
/* Narrow sidebar — stack preview over meta for image/video too */
@media(max-width:1180px){
  .ed-clipinfo{flex-direction:column;gap:10px}
  .ed-clipinfo-preview{flex:1 1 auto;max-width:100%;width:100%}
  .ed-clipinfo-preview .ed-cpimg{min-height:0;max-height:210px;object-fit:contain}
}
.ed-musfoot{color:var(--dim);font-size:11.5px;text-align:center;padding-top:2px;opacity:.85}
/* 🎚 Auto-ducking control — sits atop the Music panel (toggle + dip slider). */
.ed-duck{display:flex;flex-direction:column;gap:7px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
/* checkbox+title on the left, Dip slider filling the right — one line (wraps on very narrow widths) */
.ed-duck-top{display:flex;align-items:center;gap:16px}
.ed-duck-top .ed-duck-head{flex:0 0 auto;flex-direction:row;align-items:center;white-space:nowrap}
.ed-duck-top .ed-duck-amt{flex:0 1 auto;min-width:0;max-width:300px;margin-right:35px}
@media(max-width:520px){.ed-duck-top{flex-wrap:wrap;gap:8px}.ed-duck-top .ed-duck-amt{flex:1 1 100%}}
.ed-duck-head{display:flex;align-items:center;gap:9px;cursor:pointer;user-select:none}
.ed-duck-head input{width:16px;height:16px;accent-color:var(--acc);cursor:pointer;flex:none}
.ed-duck-title{font-weight:700;color:var(--txt);font-size:13px;white-space:nowrap}
.ed-duck-hint{color:var(--dim);font-size:11.5px;line-height:1.45}
.ed-duck-amt{display:flex;align-items:center;gap:10px}
.ed-duck-amtlab{color:var(--dim);font-size:12px;font-weight:600;flex:none}
.ed-duck-amt input[type=range]{flex:1 1 auto;accent-color:var(--acc);cursor:pointer}
.ed-duck-amtval{flex:none;min-width:42px;text-align:right;font-variant-numeric:tabular-nums;font-size:12px;font-weight:700;color:var(--acc)}
.ed-duck.ed-duck-off .ed-duck-amt{opacity:.45}
.ed-duck.ed-duck-off .ed-duck-amtval{color:var(--dim)}

/* ==================================================== 💬 Captions modal */
.ed-capstyles{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
@media(max-width:560px){.ed-capstyles{grid-template-columns:repeat(2,1fr)}}
.ed-capstyle{border:1px solid var(--line);background:var(--bg);color:var(--dim);border-radius:9px;padding:9px 8px;font-size:12.5px;font-weight:600;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:background .16s ease,color .16s ease,border-color .16s ease,transform .12s ease}
.ed-capstyle:hover{border-color:var(--acc);color:var(--txt);transform:translateY(-1px)}
.ed-capstyle.active{background:var(--acc);border-color:var(--acc);color:#fff}
.ed-caprow2{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:1.1rem}
@media(max-width:560px){.ed-caprow2{grid-template-columns:1fr}}
.ed-capseg{display:inline-flex;border:1px solid var(--line);border-radius:9px;overflow:hidden}
.ed-cappos{border:0;border-right:1px solid var(--line);background:var(--bg);color:var(--dim);padding:8px 14px;font-size:12.5px;font-weight:600;cursor:pointer;transition:background .16s ease,color .16s ease}
.ed-cappos:last-child{border-right:0}
.ed-cappos:hover{color:var(--txt)}
.ed-cappos.active{background:var(--acc);color:#fff}
/* 🎨 Background modal — wallpaper preset swatches + dimmed body when off */
.ed-bgpresets{display:grid;grid-template-columns:repeat(8,1fr);gap:9px}
@media(max-width:560px){.ed-bgpresets{grid-template-columns:repeat(6,1fr)}}
.ed-bgsw{position:relative;aspect-ratio:1/1;border:1px solid var(--line);border-radius:11px;padding:0;cursor:pointer;background-size:cover;background-position:center;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);transition:transform .12s ease,box-shadow .16s ease;display:flex;align-items:center;justify-content:center;font-size:15px}
.ed-bgsw:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(15,23,42,.16)}
.ed-bgsw.active{box-shadow:0 0 0 2px var(--card),0 0 0 4px var(--acc)}
.ed-bgsw-custom{background:conic-gradient(#ef4444,#f59e0b,#22c55e,#3b82f6,#a855f7,#ef4444);color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.55)}
.ed-bgsw-img{border-color:var(--acc)}
.ed-bgdim{opacity:.5;transition:opacity .18s ease}
.ed-bgbtn.active,.ed-bgbtn.active svg{color:var(--acc)}
.ed-bgbtn.active{border-color:var(--acc);background:rgba(41,100,255,.08)}
#bgBtn.active{background:rgba(41,100,255,.12);border-color:var(--acc);color:var(--acc)}
.ed-caplist{max-height:200px;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:6px}
.ed-caprow{display:flex;align-items:center;gap:8px;border-radius:9px;padding:3px 4px;transition:background .15s ease}
.ed-caprow:focus-within{background:rgba(41,100,255,.10)}
.ed-captime{flex:none;border:1px solid var(--line);background:var(--bg);color:var(--acc);border-radius:7px;padding:5px 8px;font-size:11.5px;font-weight:700;font-variant-numeric:tabular-nums;cursor:pointer;transition:background .16s ease,color .16s ease}
.ed-captime:hover{background:var(--acc);color:#fff;border-color:var(--acc)}
.ed-capinput{flex:1 1 auto;min-width:0;background:var(--bg);color:var(--txt);border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-size:13px;box-sizing:border-box}
.ed-capinput:focus{outline:none;border-color:var(--acc)}
/* Generate row: primary (free-aware) + secondary force-AI button, with a source/cost sublabel. */
.ed-capgen{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ed-capgenmain{display:flex;flex-direction:column;gap:3px;align-items:flex-start}
.ed-capgensub{font-size:11.5px;font-weight:600;color:var(--dim);letter-spacing:.01em}
.ed-capgensub.is-free{color:#12805c}
.ed-capai{white-space:nowrap}
@media(max-width:560px){.ed-capgen{gap:8px}.ed-capai{width:100%}}

/* ================================================ Media-bin hover actions
   A neat floating cluster of first-class controls (Place / Replace / Delete),
   revealed on hover/focus (always shown on touch). A soft scrim keeps them
   legible over the size/duration text. */
.ed-binitem{position:relative}
.ed-binacts{position:absolute;top:14px;right:9px;display:flex;gap:7px;opacity:0;transform:translateY(-4px) scale(.96);transition:opacity .18s ease,transform .18s ease;pointer-events:none;z-index:3}
.ed-binacts::before{content:"";position:absolute;top:-8px;bottom:-8px;right:-9px;left:-34px;background:linear-gradient(90deg,transparent,var(--card) 46%);border-radius:12px;z-index:-1;opacity:0;transition:opacity .18s ease;pointer-events:none}
.ed-binitem:hover .ed-binacts,.ed-binitem:focus-within .ed-binacts{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}
.ed-binitem:hover .ed-binacts::before,.ed-binitem:focus-within .ed-binacts::before{opacity:.94}
.ed-binact{display:inline-flex;align-items:center;gap:5px;min-height:32px;border:1px solid var(--line);background:var(--card);color:var(--txt);border-radius:10px;padding:6px 12px;font-size:13.5px;line-height:1;font-weight:700;cursor:pointer;white-space:nowrap;box-shadow:0 6px 16px -7px rgba(16,24,40,.42);transition:background .14s ease,color .14s ease,border-color .14s ease,transform .12s ease,box-shadow .14s ease}
.ed-binact:hover{background:var(--acc);border-color:var(--acc);color:#fff;transform:translateY(-1px);box-shadow:0 10px 22px -8px rgba(41,100,255,.55)}
.ed-binact:active{transform:translateY(0)}
.ed-binact-icon{padding:6px 10px;font-size:16px}                 /* icon-only (delete) — bigger, squarer glyph */
.ed-binact-danger{color:#dc2626;border-color:rgba(220,38,38,.3);background:rgba(220,38,38,.07)} /* soft-red danger tint */
.ed-binact-danger:hover{background:#dc2626;border-color:#dc2626;color:#fff;box-shadow:0 10px 22px -8px rgba(220,38,38,.55)}
@media(hover:none){.ed-binacts{opacity:1;transform:none;pointer-events:auto}.ed-binacts::before{opacity:.94}}

/* ================================================ Replace-asset modal */
.ed-replacebody{display:flex;flex-direction:column;gap:12px}
.ed-replaceopt .ed-fillerh{margin:0 0 8px}
.ed-replacetopbtns{display:flex;gap:10px}
.ed-replacetopbtns>.chip{flex:1 1 0;min-width:0;justify-content:center;text-align:center;padding:8px 10px;font-size:13px;white-space:nowrap;display:inline-flex;align-items:center}
.ed-replacetopbtns>.ed-replacemap{background:var(--acc);border-color:var(--acc);color:#fff}   /* same blue as the Replace CTA, smaller */
.ed-replacetopbtns>.ed-replacemap:hover{background:var(--accd);border-color:var(--accd)}
/* Save a copy: duplicate-name warning + "save over a recent project" chips */
.ed-saveas-dup{margin:8px 0 0;font-size:12.5px;line-height:1.5;color:#92400e;background:#fef3c7;border:1px solid #fde68a;border-radius:8px;padding:8px 10px}
.ed-saveas-recent{margin:12px 0 0}
.ed-saveas-rlbl{font-size:12px;font-weight:600;color:var(--dim);margin:0 0 6px}
.ed-saveas-rlist{display:flex;flex-direction:column;gap:6px}
.ed-saveas-rchip{display:flex;justify-content:space-between;align-items:center;gap:10px;width:100%;padding:7px 12px;font-size:13px;border-radius:10px}
.ed-saveas-rchip .ed-saveas-rname{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ed-saveas-rchip .ed-saveas-rdate{color:var(--dim);font-size:11.5px;flex:none}
.ed-saveas-rchip.ed-saveas-rsel{border-color:var(--acc);background:rgba(47,107,255,.08);box-shadow:inset 0 0 0 1px var(--acc)}
/* Export footer: 2 or 3 actions ALWAYS share one line in equal columns; ghost = white primary */
.cta.ed-ctaghost{background:#fff;color:var(--acc);border:1px solid var(--line)}
.cta.ed-ctaghost:hover{background:#eef3ff;border-color:var(--acc)}
.ed-modalcard .ed-exportfoot{flex-wrap:nowrap}
.ed-modalcard .ed-exportfoot>.cta{flex:1 1 0;min-width:0;white-space:nowrap;padding-left:8px;padding-right:8px;font-size:clamp(11.5px,2.4vw,14px)}
.ed-linkbtn{background:none;border:0;padding:0;color:var(--acc);font:inherit;font-weight:600;cursor:pointer;text-decoration:underline}
/* Toasts must surface ABOVE every modal overlay + backdrop blur (modals live at z 120–1400). */
.toast{z-index:2000}
/* Reconnect overlay: LARGE premium card dead-center of the screen. No blur, pointer-events
   pass through — highly visible, but the page underneath stays fully usable. */
.ed-reconnspin{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:1500;pointer-events:none}
.ed-reconncard{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;background:linear-gradient(180deg,#fff 0%,#f5f8ff 100%);border:1px solid rgba(47,107,255,.28);border-radius:26px;padding:56px 64px;min-width:min(560px,94vw);max-width:94vw;min-height:min(430px,82vh);box-shadow:0 24px 80px rgba(16,24,40,.38),0 0 0 8px rgba(47,107,255,.07)}
.ed-reconnspin .ed-spin{width:62px;height:62px;border:6px solid rgba(47,107,255,.15);border-top-color:var(--acc);border-radius:50%;animation:edspin .8s linear infinite;flex:none}
.ed-reconntitle{font-size:20px;font-weight:750;letter-spacing:-.02em}   /* matches .ed-modalhead h1 (Last Project Restored) */
.ed-reconnsub{font-size:14.5px;font-weight:600;color:var(--dim);max-width:520px;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ed-reconnbar{width:100%;height:7px;border-radius:4px;background:rgba(47,107,255,.12);overflow:hidden}
.ed-reconnbar>i{display:block;height:100%;width:4%;background:linear-gradient(90deg,var(--acc),#7aa2ff);border-radius:4px;transition:width .3s ease}
@keyframes edspin{to{transform:rotate(360deg)}}
/* Mid-render: the 3-button footer + subtexts hide; Cancel becomes ONE full-width red bar */
#tab-download.ed-rendering .ed-exportfoot,#tab-download.ed-rendering #renderRealtimeNote,#tab-download.ed-rendering #ezraNote{display:none}
#tab-download.ed-rendering #renderCancelBtn{width:100%;flex:1 1 100%;height:48px;display:inline-flex;align-items:center;justify-content:center;background:var(--danger);border-color:var(--danger);color:#fff;font-size:15px;font-weight:700}
/* Mid-render readouts: green compact status with the spec line tight beneath it */
#tab-download.ed-rendering #renderStatus{color:#16a34a;font-size:12px;margin:.3rem 0 0}
#tab-download.ed-rendering #renderFileProps{margin:2px 0 0;font-size:12px}
/* Mid-render the run's settings are locked in — dim + disable presets, range boxes, filename, save folder */
#tab-download.ed-rendering .ed-preset,
#tab-download.ed-rendering #exSelAreaRow,
#tab-download.ed-rendering #exFilename,
#tab-download.ed-rendering #exFmtRow,
#tab-download.ed-rendering #exSaveDirBtn{pointer-events:none;opacity:.45}
.ed-replaceor{text-align:center;font-size:12px;font-weight:700;color:var(--dim);letter-spacing:.06em;text-transform:uppercase;position:relative}
.ed-replaceor::before,.ed-replaceor::after{content:"";position:absolute;top:50%;width:calc(50% - 22px);height:1px;background:var(--line)}
.ed-replaceor::before{left:0}
.ed-replaceor::after{right:0}
.ed-replacelist{list-style:none;margin:0;padding:0;max-height:312px;overflow:auto;display:flex;flex-direction:column;gap:6px}
.ed-replacesearch{width:100%;margin:0 0 8px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg,#fff);color:inherit;font:inherit;font-size:13.5px;outline:none}
.ed-replacesearch:focus{border-color:var(--acc)}
.ed-replacerow{display:flex;align-items:center;gap:10px;padding:7px;border:1px solid var(--line);border-radius:10px;cursor:pointer;transition:border-color .14s ease,background .14s ease}
.ed-replacerow:hover{border-color:var(--acc);background:rgba(41,100,255,.05)}
.ed-replacerow.ed-replacesel{border-color:#8B5CF6;background:rgba(139,92,246,.1);box-shadow:inset 0 0 0 1px #8B5CF6}
.ed-replacethumb{width:52px;height:34px;flex:none;border-radius:6px;background:#0b0f17 center/cover no-repeat;display:flex;align-items:center;justify-content:center;font-size:16px;overflow:hidden}
.ed-replacemeta{min-width:0;flex:1 1 auto}
.ed-replacename{font-weight:650;font-size:13px;color:var(--txt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ed-replacesub{margin-top:2px;font-size:11.5px;color:var(--dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ed-replaceempty{font-size:12.5px;color:var(--dim);padding:10px;text-align:center;border:1px dashed var(--line);border-radius:10px}
.ed-replacechosen{margin-top:14px;font-size:12.5px;color:var(--txt);background:rgba(41,100,255,.07);border:1px solid rgba(41,100,255,.22);border-radius:8px;padding:8px 11px}

/* ================================================ 🔤 Text inspector — DOCKED CARD
   Lives in the RIGHT sidebar as a sibling of the CLIP card (#clipCard / #textCard),
   sharing the same .ed-props card shell. Exactly one is visible at a time (JS
   syncInspector toggles .hidden). Premium-light styling to match the CLIP card —
   NOT the old dark floating panel (retired). */
.ed-textcard.hidden{display:none}
.ed-txtbody{display:flex;flex-direction:column;gap:9px;margin-top:4px}
.ed-textcard .ed-lbl{display:flex;justify-content:space-between;align-items:center;gap:6px;
  font-size:11px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;color:var(--dim)}
.ed-textcard .ed-lbl b{color:var(--txt);font-weight:700;font-variant-numeric:tabular-nums;text-transform:none;letter-spacing:0}
.ed-txtblock{display:flex;flex-direction:column;gap:6px}
.ed-txtarea{width:100%;box-sizing:border-box;resize:vertical;min-height:46px;background:#fff;
  border:1px solid var(--line);border-radius:10px;color:var(--txt);padding:9px 10px;font-size:13px;
  font-family:inherit;line-height:1.4}
.ed-txtarea:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 3px rgba(41,100,255,.12)}
.ed-txtseg{display:flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#FAFBFD}
.ed-txtseg button{flex:1;border:0;border-right:1px solid var(--line);background:transparent;color:var(--dim);
  padding:8px 4px;font-size:11.5px;font-weight:600;cursor:pointer;transition:background .14s ease,color .14s ease}
.ed-txtseg button:last-child{border-right:0}
.ed-txtseg button:hover{color:var(--txt);background:#EEF3FB}
.ed-txtseg button.active{background:var(--acc);color:#fff}
.ed-txtgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ed-txtfield{display:flex;flex-direction:column;gap:6px;min-width:0}
.ed-txtfield input[type=text]{width:100%;box-sizing:border-box;background:#fff;border:1px solid var(--line);
  border-radius:9px;color:var(--txt);padding:8px 9px;font-size:12.5px;font-variant-numeric:tabular-nums}
.ed-txtfield input[type=text]:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 3px rgba(41,100,255,.12)}
.ed-txtsize{justify-content:space-between}
.ed-txtsize input[type=range]{width:100%;margin:0;accent-color:var(--acc)}
.ed-txtcolor input[type=color]{width:100%;height:34px;padding:0;border:1px solid var(--line);border-radius:9px;background:#fff;cursor:pointer}
.ed-txtalign{width:100%}
.ed-txtalign button{font-size:14px;padding:8px 4px}
.ed-txtchk{display:flex;align-items:center;justify-content:space-between;gap:8px;white-space:nowrap;font-size:12.5px;color:var(--txt);font-weight:600;cursor:pointer;
  user-select:none;background:#FAFBFD;border:1px solid var(--line);border-radius:9px;padding:8px 10px}
.ed-txtchk input{width:15px;height:15px;accent-color:var(--acc);flex:none}
/* TEXT card KIND / ALIGN icon dropdowns — styled like the media-bin sort dropdown (premium-light) */
.ed-txtdd{position:relative;display:inline-flex;width:100%}
.ed-txtddbtn{display:flex;align-items:center;gap:8px;width:100%;box-sizing:border-box;
  background:#fff;border:1px solid var(--line);border-radius:10px;color:var(--txt);
  padding:8px 10px;font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;line-height:1;
  transition:border-color .14s ease,box-shadow .14s ease,background .14s ease}
.ed-txtddbtn:hover{background:#F7F9FE;border-color:#cdd8ee}
.ed-txtddbtn:focus-visible{outline:none;border-color:var(--acc);box-shadow:0 0 0 3px rgba(41,100,255,.12)}
.ed-txtddbtn[aria-expanded="true"]{border-color:var(--acc);box-shadow:0 0 0 3px rgba(41,100,255,.12)}
.ed-txtddic{display:inline-flex;width:16px;height:16px;flex:none;color:var(--dim)}
.ed-txtddic svg{width:16px;height:16px}
.ed-txtddlbl{flex:1 1 auto;min-width:0;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ed-txtddcaret{flex:none;color:var(--dim);font-size:11px;line-height:1}
.ed-txtddmenu{min-width:190px}
.ed-txtddsep{height:1px;background:var(--line);margin:5px 6px}
.ed-txtalignopt,.ed-txtbgrow{display:flex;align-items:center;gap:9px}
.ed-txtoptic{width:16px;height:16px;flex:none}
.ed-txtbgrow{cursor:pointer;user-select:none}
.ed-txtbgrow input{width:15px;height:15px;accent-color:var(--acc);flex:none;margin:0}
.ed-txtbtns{margin-top:2px}
.ed-txthint{margin:0;font-size:11px;line-height:1.4;color:var(--dim)}
/* Compact docked TEXT card: kind toggles + layer name share the top line; Start/End go inline;
   Duplicate/Delete + the hint share one bottom line — so the card is no taller than the CLIP card. */
.ed-txthead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.ed-txthead .ed-txtseg{flex:1 1 auto;min-width:0}
.ed-txthead .ed-txtseg .ed-txtkind{padding:6px 4px;font-size:11px}
.ed-txthead .ed-txtdd{flex:1 1 auto;min-width:0}
.ed-txthead .ed-txtkinddd .ed-sortmenu{left:0;right:auto}
.ed-addmediawrap .ed-sortmenu{left:0;right:auto;min-width:230px}   /* Add Media opens left-aligned (it's a left-side header button) */
.ed-txthead .ed-clayer{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
.ed-txtfield.ed-txtinline{flex-direction:row;align-items:center;gap:8px}
.ed-txtfield.ed-txtinline .ed-lbl{flex:0 0 auto}
.ed-txtfield.ed-txtinline input[type=text]{flex:1 1 auto;min-width:0}
.ed-txtfoot{display:flex;align-items:center;gap:12px;margin-top:8px}
.ed-txtfoot .ed-txtbtns{flex:0 0 auto;margin:0}
.ed-txtfoot .ed-txthint{flex:1 1 auto;margin:0}
@media(max-width:1180px){.ed-textcard .ed-txtgrid{grid-template-columns:1fr}}

/* ============================================================ MENU BAR
   Desktop-app-style menu bar (File · Edit · View · Clip · Insert). Slim,
   premium light — sits below the header, above the preview/bin row. Each
   top-level opens one dropdown; clip-specific items dim when nothing is
   selected. Additive — the timeline toolbar buttons keep working. */
.ed-menubar{display:flex;align-items:stretch;gap:2px;margin:6px 20px -4px;padding:2px 4px;
  background:var(--card);border:1px solid var(--line);border-radius:12px;
  box-shadow:0 1px 2px rgba(20,30,50,.04);position:relative;z-index:60;user-select:none;
  font-family:inherit}
.ed-menu{position:relative;display:flex}
/* current project name, shown 40px after the Help menu (muted, truncates on small screens) */
.ed-menuproj{align-self:center;margin-left:40px;min-width:0;max-width:340px;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:400;color:var(--dim);letter-spacing:.02em;display:inline-flex;align-items:center;gap:6px}
.ed-menuproj:empty{display:none}
.ed-menuproj.ed-projediting{overflow:visible}
.ed-menuproj .ed-projprefix{flex:none}
/* Inline-editable project name — dotted affordance; click to rename in place */
.ed-menuproj .ed-projname{border:1px dashed rgba(120,132,156,.55);border-radius:6px;padding:1px 7px;
  cursor:text;color:var(--txt,#1a2233);max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  transition:border-color .15s,background .15s;outline:none}
.ed-menuproj .ed-projname:hover,.ed-menuproj .ed-projname:focus-visible{border-color:var(--acc);background:rgba(41,100,255,.07)}
.ed-menuproj .ed-projnameinp{font:inherit;color:var(--txt,#1a2233);border:1px solid var(--acc);border-radius:6px;
  padding:1px 7px;min-width:90px;max-width:240px;background:var(--card,#fff);box-shadow:0 0 0 3px rgba(41,100,255,.16);outline:none}
/* Autosave badge now sits in the menu bar, 20px after the project name */
.ed-menubar .ed-autosave-inbar{align-self:center;margin-left:20px;flex:none}
.ed-menuproj:empty + .ed-autosave-inbar{margin-left:40px}   /* keep left inset when there's no project name yet */
.ed-menutop{appearance:none;border:0;background:transparent;cursor:pointer;
  font:inherit;font-size:13px;font-weight:600;color:var(--txt);
  padding:6px 12px;border-radius:8px;line-height:1.2;transition:background .14s var(--ease),color .14s var(--ease)}
.ed-menutop:hover{background:var(--bg)}
.ed-menutop:focus-visible{outline:2px solid var(--acc);outline-offset:1px}
.ed-menu.open>.ed-menutop{background:var(--acc);color:#fff}
/* Dropdown panel */
.ed-menudrop{position:absolute;top:calc(100% + 6px);left:0;min-width:216px;
  background:var(--card);border:1px solid var(--line);border-radius:12px;
  box-shadow:0 18px 40px rgba(16,24,40,.14),0 2px 6px rgba(16,24,40,.06);
  padding:6px;display:none;flex-direction:column;gap:1px;z-index:70}
.ed-menu.open>.ed-menudrop{display:flex}
/* Menu item */
.ed-menuitem{appearance:none;border:0;background:transparent;cursor:pointer;
  font:inherit;font-size:13px;color:var(--txt);text-align:left;
  display:flex;align-items:center;gap:10px;width:100%;box-sizing:border-box;
  padding:7px 10px;border-radius:8px;line-height:1.25;position:relative;transition:background .12s var(--ease)}
.ed-menuitem:hover,.ed-menuitem:focus-visible{background:var(--bg);outline:none}
.ed-menuitem .ed-mi-lbl{flex:1 1 auto;white-space:nowrap}
.ed-menuitem .ed-mi-key{flex:0 0 auto;font-size:11px;color:var(--dim);
  font-variant-numeric:tabular-nums;letter-spacing:.02em;margin-left:14px}
.ed-menuitem .ed-mi-check{flex:0 0 auto;width:14px;text-align:center;color:var(--acc);
  font-size:12px;font-weight:800;visibility:hidden}
.ed-menuitem.ed-checked .ed-mi-check{visibility:visible}
.ed-menuitem .ed-mi-arrow{flex:0 0 auto;color:var(--dim);font-size:11px;margin-left:10px}
.ed-menuitem.ed-mi-danger{color:var(--danger)}
.ed-menuitem.ed-mi-danger:hover{background:var(--danger-bg)}
/* Disabled (greyed-out desktop-app look) — dimmed, not clickable */
.ed-menuitem.disabled{color:#aab2c0;cursor:default;pointer-events:none}
.ed-menuitem.disabled .ed-mi-key,.ed-menuitem.disabled .ed-mi-arrow{color:#c2c9d4}

/* ---- Connections menu: per-source CONNECTED / NOT CONNECTED status ---- */
.ed-connitem{min-width:230px}
.ed-connitem .ed-mi-lbl{flex:1 1 auto}
.ed-connstatus{flex:0 0 auto;margin-left:12px;font-size:10.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;
  color:#94a2b8;background:#eef1f6;border:1px solid #e2e7ef;border-radius:99px;padding:2px 9px;white-space:nowrap;max-width:150px;overflow:hidden;text-overflow:ellipsis}
.ed-connstatus.ed-conn-on{color:#0a7a3c;background:#e7fbf0;border-color:#b7ecca}
.ed-connstatus.ed-conn-soon{color:#9a6a00;background:#fff5e0;border-color:#f2d693}
.ed-connstatus.ed-conn-new{color:#0a7d4b;background:#e7f8ef;border-color:#bfe9d2}
/* mapped-folders flyout: folder name + a media-count line beneath it */
.ed-mappedsub{min-width:240px}
.ed-mappeditem .ed-mi-lbl{display:flex;flex-direction:column;gap:2px;align-items:flex-start}
.ed-mapped-nm{font-weight:600}
.ed-mapped-cnt{font-size:11px;color:var(--dim);font-weight:500;letter-spacing:.01em}
.ed-mappeditem{display:flex;align-items:center;cursor:pointer;min-height:42px}
.ed-mappeditem .ed-mi-lbl{min-width:0}
.ed-mapped-nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.ed-mapped-del{flex:none;margin-left:10px;display:inline-flex;align-items:center;color:#9aa6b6;opacity:0;border-radius:6px;padding:3px;cursor:pointer;transition:opacity .12s,color .12s,background .12s}
.ed-mappeditem:hover .ed-mapped-del{opacity:1}
.ed-mapped-del:hover{color:#e5484d;background:var(--danger-bg,#fdecec)}

/* ---- Browse-connected-files modal ---- */
.cb-ov{position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;background:rgba(12,18,30,.5);backdrop-filter:blur(2px);padding:20px}
.cb-ov.hidden{display:none}
.cb-card{width:min(610px,96vw);max-height:min(82vh,640px);display:flex;flex-direction:column;background:var(--card,#fff);color:var(--txt,#1a2233);border-radius:16px;box-shadow:0 24px 60px -12px rgba(16,24,40,.5);overflow:hidden}
.cb-head{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line,#e6eaf1)}
.cb-crumb{flex:1;min-width:0;display:flex;align-items:center;flex-wrap:wrap;gap:2px;overflow:hidden}
.cb-crumbseg{appearance:none;border:0;background:transparent;cursor:pointer;font:inherit;font-size:13px;font-weight:600;color:var(--acc);padding:2px 5px;border-radius:6px;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cb-crumbseg:hover{background:rgba(41,100,255,.08)}
.cb-crumbseg:last-child{color:var(--txt,#1a2233);cursor:default}
.cb-crumbsep{color:#9aa6b6;font-size:13px}
.cb-x{appearance:none;border:1px solid var(--line,#e6eaf1);background:var(--bg,#f7f9fc);border-radius:8px;width:30px;height:30px;cursor:pointer;font-size:14px;color:var(--dim,#697386);flex:none}
.cb-x:hover{border-color:var(--acc)}
.cb-addfolder{flex:none;appearance:none;border:1px solid var(--line,#e6eaf1);background:var(--bg,#f7f9fc);color:var(--acc);border-radius:8px;padding:5px 10px;font:inherit;font-size:12.5px;font-weight:700;cursor:pointer;margin-right:2px}
.cb-addfolder:hover{border-color:var(--acc);background:rgba(41,100,255,.06)}
.cb-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:8px 10px;padding:8px 14px;border-bottom:1px solid var(--line,#e6eaf1);font-size:10.5px}
.cb-filters{display:flex;align-items:center;gap:6px;flex:none}
.cb-filterpill{white-space:nowrap}
.cb-sortwrap{position:relative;flex:none}
.cb-sortpill{white-space:nowrap}
.cb-sortmenu{position:absolute;top:calc(100% + 6px);right:0;z-index:20;background:var(--card,#fff);border:1px solid var(--line,#e6eaf1);border-radius:10px;box-shadow:0 12px 30px rgba(8,12,22,.18);padding:5px;display:flex;flex-direction:column;min-width:150px}
.cb-sortmenu.hidden{display:none}
.cb-sortopt{appearance:none;border:none;background:transparent;text-align:left;padding:8px 12px;border-radius:7px;font:inherit;font-size:13px;font-weight:600;color:var(--txt,#1a2233);cursor:pointer;white-space:nowrap}
.cb-sortopt:hover{background:var(--bg,#f2f5fa)}
.cb-modeseg{display:inline-flex;border:1px solid var(--line,#e6eaf1);border-radius:8px;overflow:hidden;flex:none}
.cb-modebtn{appearance:none;border:0;background:transparent;color:var(--dim,#697386);padding:5px 11px;font:inherit;font-size:10.5px;font-weight:600;cursor:pointer}
.cb-modebtn+.cb-modebtn{border-left:1px solid var(--line,#e6eaf1)}
.cb-modebtn:hover{background:var(--bg,#f2f5fa)}
.cb-modebtn.cb-modeon{background:var(--acc);color:#fff}
.cb-summary{display:flex;align-items:center;flex-wrap:wrap;gap:7px;padding:7px 14px;border-bottom:1px solid var(--line,#e6eaf1);color:var(--dim,#697386);font-size:12.5px;font-weight:600}
.cb-summary:empty{display:none}
.cb-sumlabel{margin-right:2px}
.cb-pill{appearance:none;border:1px solid var(--line,#e6eaf1);background:var(--bg,#f7f9fc);color:var(--txt,#1a2233);border-radius:99px;padding:3px 11px;font:inherit;font-size:12px;font-weight:700;cursor:pointer;transition:background .15s,border-color .15s,color .15s,transform .1s}
.cb-pill:hover{border-color:var(--acc);background:rgba(41,100,255,.07)}
.cb-pill:active{transform:translateY(1px)}
.cb-pill.cb-pillon{background:var(--acc);border-color:var(--acc);color:#fff}
.cb-pill-all{margin-left:auto}
.cb-list{transition:opacity .18s ease}
.cb-selall{display:inline-flex;flex-direction:row;align-items:center;gap:7px;cursor:pointer;color:var(--txt,#1a2233);font-weight:600;font-size:10.5px}
.cb-selall input{width:15px;height:15px;flex:none;accent-color:var(--acc);cursor:pointer;margin:0}
.cb-searchwrap{flex:1;min-width:90px;position:relative;display:flex;align-items:center}
.cb-searchic{position:absolute;left:9px;font-size:11px;opacity:.55;pointer-events:none}
.cb-search{width:100%;border:1px solid var(--line,#e6eaf1);background:var(--bg,#f7f9fc);border-radius:8px;padding:5px 24px 5px 26px;font:inherit;font-size:12px;color:var(--txt,#1a2233);outline:none;transition:border-color .15s,box-shadow .15s}
.cb-search::placeholder{color:#9aa6b6}
.cb-search:focus{border-color:var(--acc);box-shadow:0 0 0 3px rgba(41,100,255,.14)}
.cb-searchx{position:absolute;right:5px;appearance:none;border:0;background:transparent;color:var(--dim,#697386);cursor:pointer;font-size:11px;padding:2px 4px;border-radius:6px;line-height:1}
.cb-searchx:hover{background:var(--line,#e6eaf1);color:var(--txt,#1a2233)}
.cb-hl{background:#fde68a;color:#5a3d00;border-radius:2px;padding:0 1px;font-weight:700}
/* Buy-storage modal rows */
.sb-row{display:flex;align-items:center;justify-content:space-between;padding:11px 12px;border:1px solid var(--line,#e6eaf1);border-radius:10px;margin-bottom:9px}
.sb-info{display:flex;flex-direction:column;gap:2px}
.sb-info b{font-size:14.5px;color:var(--txt,#1a2233)}
.sb-info span{font-size:12px;color:var(--dim,#697386)}
.sb-qty{display:flex;align-items:center;gap:10px}
.sb-step{appearance:none;border:1px solid var(--line,#e6eaf1);background:var(--bg,#f7f9fc);color:var(--txt,#1a2233);width:30px;height:30px;border-radius:8px;font-size:17px;font-weight:700;cursor:pointer;line-height:1}
.sb-step:hover{border-color:var(--acc);color:var(--acc)}
.sb-n{min-width:20px;text-align:center;font-weight:700;font-variant-numeric:tabular-nums}
/* Help: Import-vs-Map comparison table */
.ed-helptable{width:100%;border-collapse:collapse;margin:12px 0;font-size:13.5px}
.ed-helptable th,.ed-helptable td{text-align:left;padding:8px 12px;border-bottom:1px solid var(--line,#e6eaf1)}
.ed-helptable th{font-weight:700;color:var(--txt,#1a2233)}
.ed-helptable td:first-child{color:var(--dim,#697386);font-weight:600}
.ed-helpsoon{color:var(--dim,#697386);font-style:italic}
.cb-sortbtn{appearance:none;border:1px solid transparent;background:transparent;color:var(--dim,#697386);border-radius:7px;padding:4px 10px;font:inherit;font-size:10.5px;font-weight:700;cursor:pointer}
.cb-sortbtn:hover{background:var(--bg,#f2f5fa);color:var(--txt,#1a2233)}
.cb-list{flex:1;overflow-y:auto;padding:6px}
.cb-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;padding:44px 12px;text-align:center;color:var(--dim,#697386);font-size:13.5px}
.cb-loading-txt{font-weight:600;letter-spacing:.01em}
.cb-spinner{width:40px;aspect-ratio:1;border-radius:50%;
  background:conic-gradient(from 90deg, rgba(41,100,255,0) 8%, var(--acc,#2964ff));
  -webkit-mask:radial-gradient(farthest-side, #0000 calc(100% - 4px), #000 0);
          mask:radial-gradient(farthest-side, #0000 calc(100% - 4px), #000 0);
  animation:cbspin .8s linear infinite}
.cb-spinner-lg{width:54px}
.cb-spinner-sm{width:12px;display:inline-block;vertical-align:-2px;margin-right:5px}
@keyframes cbspin{to{transform:rotate(1turn)}}
.cb-row{display:flex;align-items:center;gap:11px;padding:7px 11px;border-radius:9px;cursor:pointer;font-size:14px;user-select:none}
.cb-row:hover{background:var(--bg,#f2f5fa)}
.cb-row.cb-on{background:rgba(41,100,255,.10)}
.cb-row.cb-imported{background:rgba(34,197,94,.12)}
.cb-row.cb-imported:hover{background:rgba(34,197,94,.18)}
.cb-row.cb-imported.cb-on{background:rgba(41,100,255,.14)}
.cb-imported-badge{flex:none;font-size:10px;font-weight:700;color:#0a7a3c;background:#e7fbf0;border:1px solid #b7ecca;border-radius:99px;padding:2px 7px;white-space:nowrap}
.cb-ic{flex:none;font-size:16px;width:20px;text-align:center}
.cb-thumb{position:relative;flex:none;width:46px;height:30px;border-radius:5px;background:#0b0f16;display:flex;align-items:center;justify-content:center;font-size:15px;overflow:hidden;cursor:zoom-in;box-shadow:inset 0 0 0 1px rgba(16,24,40,.12)}
.cb-thumbemoji{position:relative;z-index:0;line-height:1}
.cb-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;z-index:1}
.cb-thumb img:not([src]){display:none}
.cb-nm{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:1px}
.cb-nm .cb-fn{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cb-folder-sub{font-size:10.5px;color:var(--dim,#697386);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cb-size{flex:none;width:66px;text-align:right;color:var(--dim,#697386);font-size:12px;font-variant-numeric:tabular-nums}
.cb-arrow{flex:none;color:#9aa6b6}
.cb-rootdel{flex:none;margin-right:8px;display:inline-flex;align-items:center;color:#9aa6b6;opacity:0;border-radius:6px;padding:3px;cursor:pointer;transition:opacity .12s,color .12s,background .12s}
.cb-folder:hover .cb-rootdel{opacity:1}
.cb-rootdel:hover{color:#e5484d;background:var(--danger-bg,#fdecec)}
.cb-ck{flex:none;width:16px;height:16px;border:1.5px solid #c3cdda;border-radius:5px;position:relative}
.cb-row.cb-on .cb-ck{background:var(--acc);border-color:var(--acc)}
.cb-row.cb-on .cb-ck::after{content:"";position:absolute;left:4.5px;top:1px;width:4px;height:8px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
/* preview lightbox */
.cb-previewov{z-index:1260;padding:28px}
.cb-prevcard{display:flex;flex-direction:column;max-width:min(860px,94vw);max-height:90vh;background:var(--card,#fff);border-radius:14px;overflow:hidden;box-shadow:0 24px 60px -12px rgba(16,24,40,.55)}
.cb-prevbody{position:relative;flex:1;min-height:120px;display:flex;align-items:center;justify-content:center;background:#0b0f16;padding:10px;color:#aab4c4;font-size:13.5px;overflow:hidden}
.cb-prevmediawrap{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;max-height:76vh}
.cb-prevmedia{max-width:100%;max-height:76vh;display:block;border-radius:6px}
.cb-prevnav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:46px;height:46px;border-radius:50%;border:0;
  background:rgba(11,15,22,.5);color:#fff;font-size:30px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;
  backdrop-filter:blur(3px);transition:background .15s,transform .1s}
.cb-prevnav:hover{background:rgba(11,15,22,.82)}
.cb-prevnav:active{transform:translateY(-50%) scale(.94)}
.cb-prev-left{left:12px}
.cb-prev-right{right:12px}
.cb-prevfoot{display:flex;align-items:center;gap:10px;padding:12px 16px;border-top:1px solid var(--line,#e6eaf1)}
.cb-prevname{font-size:13px;font-weight:600;color:var(--txt,#1a2233);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:44%}
.cb-prevpos{font-size:12px;color:var(--dim,#697386);font-weight:600;font-variant-numeric:tabular-nums}
.cb-foot{display:flex;align-items:center;gap:10px;padding:12px 16px;border-top:1px solid var(--line,#e6eaf1)}
.cb-count{font-size:12.5px;color:var(--dim,#697386);font-weight:600}
.cb-btn{appearance:none;border:1px solid var(--line,#e6eaf1);background:var(--bg,#f7f9fc);color:var(--txt,#1a2233);border-radius:10px;padding:9px 16px;font:inherit;font-size:13.5px;font-weight:600;cursor:pointer}
.cb-btn:hover{border-color:var(--acc)}
.cb-primary{background:var(--acc);border-color:var(--acc);color:#fff}
.cb-primary:hover{background:var(--accd,#1c57f8)}
.cb-primary:disabled{opacity:.5;cursor:default}
@media(prefers-color-scheme:dark){
  .ed-connstatus{background:#1b2130;border-color:#2a3140;color:#95a2b8}
}

/* ---- Reconnect-local-files banner (Phase 1.1) — shown on reload when a project references local files ---- */
.ed-reconnbar{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);z-index:1300;display:flex;align-items:center;gap:12px;
  max-width:min(94vw,640px);background:#12151d;color:#eaf0fb;border:1px solid rgba(255,255,255,.16);border-radius:12px;
  padding:11px 14px;box-shadow:0 16px 42px rgba(0,0,0,.45);font-size:13.5px}
.ed-reconnbar.hidden{display:none}
.ed-reconn-ic{flex:none;font-size:16px}
.ed-reconn-msg{flex:1;line-height:1.4}
.ed-reconn-btn{flex:none;appearance:none;border:0;background:var(--acc);color:#fff;border-radius:9px;padding:8px 14px;font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.ed-reconn-btn:hover{background:var(--acc-hi,#4f7bff)}
.ed-reconn-x{flex:none;appearance:none;border:0;background:transparent;color:#aab4c4;cursor:pointer;font-size:14px;padding:2px 4px;line-height:1}
.ed-reconn-x:hover{color:#fff}
/* Separator */
.ed-menusep{height:0;margin:5px 6px;border-top:1px solid var(--line)}
/* Sub-menu (Aspect / Color) — flyout to the right on hover/focus */
.ed-hassub{position:relative}
/* Flush against the parent (no gap) + an invisible hover BRIDGE on the left so moving the
   pointer diagonally into the flyout never crosses dead space and closes it. */
.ed-submenu{position:absolute;top:-6px;left:100%;margin-left:2px;min-width:180px;
  background:var(--card);border:1px solid var(--line);border-radius:12px;
  box-shadow:0 18px 40px rgba(16,24,40,.14),0 2px 6px rgba(16,24,40,.06);
  padding:6px;display:none;flex-direction:column;gap:1px;z-index:80}
.ed-submenu::before{content:"";position:absolute;top:0;bottom:0;left:-12px;width:12px}
.ed-hassub:hover>.ed-submenu,.ed-hassub:focus-within>.ed-submenu,.ed-hassub.open>.ed-submenu{display:flex}
.ed-hassub:hover,.ed-hassub:focus-within{background:var(--bg)}
.ed-hassub.disabled>.ed-submenu{display:none!important}
/* Color swatches sub-menu */
.ed-colorsub{min-width:150px}
.ed-colorsub .ed-swrow{display:flex;flex-wrap:wrap;gap:6px;padding:4px}
.ed-colorsub .ed-sw{width:22px;height:22px;border-radius:6px;border:1px solid rgba(0,0,0,.12);
  cursor:pointer;padding:0}
.ed-colorsub .ed-sw:hover{transform:scale(1.08)}
.ed-colorsub .ed-sw.ed-swclear{background:var(--bg);color:var(--dim);font-size:12px;
  display:flex;align-items:center;justify-content:center}
/* Recent Projects sub-menu — wider, name + relative-date, ellipsis on long names */
.ed-recentsub{min-width:236px;max-width:340px}
.ed-recentsub .ed-mi-lbl{overflow:hidden;text-overflow:ellipsis;max-width:312px}
@media(max-width:760px){
  .ed-menubar{margin:6px 12px -2px;overflow-x:auto}
  .ed-menutop{padding:6px 10px}
  /* Narrow: flip the Recent flyout below its row rather than off-screen right */
  .ed-recentsub{left:6px;right:6px;top:calc(100% + 2px);min-width:0;max-width:none}
  .ed-recentsub .ed-mi-lbl{max-width:none}
}

/* ===================== Help & Guide modal ===================== */
.ed-helpcard{max-width:860px}
/* Predictive help search */
.ed-helpsearchwrap{position:relative;margin:0 0 14px}
#helpSearch{width:100%;font-size:14px;padding:9px 12px;border:1px solid var(--line);border-radius:9px;background:var(--bg);color:var(--txt)}
#helpSearch:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 3px rgba(41,100,255,.14)}
.ed-helpresults{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:5;background:var(--card,#fff);border:1px solid var(--line);border-radius:10px;box-shadow:0 12px 30px -10px rgba(16,24,40,.35);max-height:320px;overflow:auto;padding:5px}
.ed-helpresults.hidden{display:none}
.ed-helpres{display:flex;flex-direction:column;gap:2px;width:100%;text-align:left;border:0;background:transparent;padding:8px 10px;border-radius:7px;cursor:pointer}
.ed-helpres:hover{background:#eef3fd}
.ed-helpres-sec{font-size:10.5px;color:var(--dim);text-transform:uppercase;letter-spacing:.03em}
.ed-helpres-h{font-size:13.5px;color:var(--txt);font-weight:600}
.ed-helpres-h mark{background:#ffe066;color:inherit;border-radius:2px;padding:0 1px}
.ed-helpnores{padding:10px;color:var(--dim);font-size:13px}
.ed-helpflash{border-radius:6px;animation:edHelpFlash 1.6s ease}
@keyframes edHelpFlash{0%,100%{background:transparent}22%{background:rgba(41,100,255,.16)}}
.ed-helpwrap{display:flex;gap:22px;align-items:flex-start}
/* Left section nav */
.ed-helpnav{flex:0 0 210px;display:flex;flex-direction:column;gap:2px;position:sticky;top:0}
.ed-helplink{appearance:none;text-align:left;border:0;background:transparent;cursor:pointer;
  color:var(--dim);font-size:13.5px;font-weight:600;padding:9px 11px;border-radius:9px;line-height:1.3}
.ed-helplink:hover{background:var(--bg);color:var(--txt)}
.ed-helplink:focus-visible{outline:2px solid var(--acc);outline-offset:1px}
.ed-helplink.active{background:var(--acc);color:#fff}
/* Right content pane */
.ed-helpbody{flex:1 1 auto;min-width:0}
.ed-helpbody:focus{outline:none}
/* Sticky header + search + footer; ONLY the body scrolls; card fits any viewport height */
.ed-helpcard{display:flex;flex-direction:column;overflow:hidden;max-height:90vh}
.ed-helpcard>.ed-modalhead,.ed-helpcard>.ed-helpsearchwrap{flex:0 0 auto}
.ed-helpcard>.ed-helpwrap{flex:1 1 auto;min-height:0;align-items:stretch;margin-bottom:0;overflow:hidden}
.ed-helpcard .ed-helpnav{max-height:100%;overflow-y:auto;min-height:0}
.ed-helpcard .ed-helpbody{min-height:0;height:auto;align-self:stretch;overflow-y:auto;padding-right:6px;padding-bottom:8px}
.ed-helpcard>.ed-helpfoot{position:static;flex:0 0 auto;margin:0;padding-top:14px;border-top:1px solid var(--line);justify-content:flex-end}
@media(max-width:640px){.ed-helpcard{max-height:94vh}}
.ed-helpbody{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.ed-helpsec h2{font-size:21px;font-weight:800;letter-spacing:-.015em;margin:0 0 14px;color:var(--txt)}
.ed-helpsec h3{font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;margin:26px 0 6px;color:var(--acc)}
.ed-helpsec p{font-size:15px;line-height:1.72;color:#2b3646;margin:0;max-width:62ch}
.ed-helpsec p+p{margin-top:10px}
.ed-helpsec b{font-weight:650;color:var(--txt)}
.ed-helpsec .ed-helplede{color:var(--dim);font-size:15.5px;margin-bottom:8px}
.ed-helpsec kbd{display:inline-block;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;
  font-weight:700;color:var(--txt);background:var(--bg);border:1px solid var(--line);border-bottom-width:2px;
  border-radius:6px;padding:2px 7px;white-space:nowrap}
.ed-helpul{margin:6px 0 0;padding-left:18px}
.ed-helpul li{font-size:15px;line-height:1.72;color:#2b3646;margin:0 0 7px}
.ed-scmuted{color:var(--dim);font-size:12.5px}
/* Shortcuts table */
.ed-helpkeys{width:100%;border-collapse:collapse;margin-top:6px}
.ed-helpkeys td{padding:11px 2px;border-bottom:1px solid var(--line);font-size:14.5px;color:#2b3646;vertical-align:middle}
.ed-helpkeys tr:last-child td{border-bottom:0}
.ed-helpkeys td:last-child{text-align:right;white-space:nowrap}
.ed-helpkeys td:last-child kbd{margin-left:4px}
.ed-helpfoot{margin-top:14px;justify-content:flex-end}
@media(max-width:720px){
  .ed-helpwrap{flex-direction:column;gap:12px}
  .ed-helpnav{flex-basis:auto;flex-direction:row;flex-wrap:wrap;gap:6px;position:static;
    width:100%;border-bottom:1px solid var(--line);padding-bottom:10px}
  .ed-helplink{padding:7px 10px;font-size:12.5px}
}

/* ============================================================ Export Blog Article modal (v67) */
#blogModal .ed-blogcard{max-width:880px}
.ed-blogstep{display:flex;flex-direction:column;gap:14px}
/* form controls (this modal isn't a .ed-tabpane, so style its own labels/inputs) */
.ed-blogcard label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--dim);font-weight:600}
.ed-blogcard select,.ed-blogcard input[type=text],.ed-blogcard textarea{
  background:var(--bg);color:var(--txt);border:1px solid var(--line);border-radius:10px;
  padding:10px 11px;font-size:14.5px;font-family:inherit;width:100%;box-sizing:border-box;font-weight:500}
.ed-blogcard textarea{resize:vertical;min-height:52px}
.ed-blogcard select:hover,.ed-blogcard input[type=text]:hover,.ed-blogcard textarea:hover{border-color:#BFD3FF}
.ed-blogcard select:focus,.ed-blogcard input[type=text]:focus,.ed-blogcard textarea:focus{
  outline:none;border-color:var(--acc);box-shadow:0 0 0 3px rgba(41,100,255,.12)}
.ed-bloggrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:640px){.ed-bloggrid{grid-template-columns:1fr}}
.ed-blogwarn{color:#a67908;background:rgba(240,180,41,.12);border:1px solid rgba(240,180,41,.4);border-radius:10px;padding:9px 11px;margin:0}
.ed-blogerr{color:var(--danger);background:var(--danger-bg);border:1px solid rgba(228,76,76,.35);border-radius:10px;padding:9px 11px;margin:0}

/* loading */
.ed-blogloader{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;padding:46px 12px;text-align:center}
.ed-blogspin{width:46px;height:46px;border-radius:50%;border:4px solid var(--line);border-top-color:var(--acc);animation:edBlogSpin .9s linear infinite}
@keyframes edBlogSpin{to{transform:rotate(360deg)}}
.ed-blogloadtxt{font-size:16px;font-weight:700;color:var(--txt);margin:0;letter-spacing:.1px}
/* premium staged loader (v76): smooth conic dual-ring with a soft glowing core */
.ed-blogspin2{width:62px;height:62px;border-radius:50%;position:relative;
  background:conic-gradient(from 90deg,transparent 0%,var(--acc-hi) 45%,var(--acc) 100%);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 6px),#000 calc(100% - 5px));
          mask:radial-gradient(farthest-side,transparent calc(100% - 6px),#000 calc(100% - 5px));
  animation:edBlogSpin2 1s linear infinite}
.ed-blogspin2::after{content:"";position:absolute;inset:14px;border-radius:50%;
  background:radial-gradient(circle,rgba(41,100,255,.28),transparent 70%);animation:edBlogPulse 1.6s ease-in-out infinite}
@keyframes edBlogSpin2{to{transform:rotate(360deg)}}
@keyframes edBlogPulse{0%,100%{opacity:.45;transform:scale(.9)}50%{opacity:1;transform:scale(1.08)}}
.ed-blogdots{display:flex;gap:8px;margin-top:1px}
.ed-blogdots i{width:7px;height:7px;border-radius:50%;background:var(--line);
  transition:background .35s ease,transform .35s ease}
.ed-blogdots i.on{background:var(--acc);transform:scale(1.3)}
.ed-blogloadsub{opacity:.68;margin:0}
@media (prefers-reduced-motion:reduce){
  .ed-blogspin,.ed-blogspin2{animation:none}
  .ed-blogspin2::after{animation:none;opacity:.6}
  .ed-blogdots i{transition:none}
}

/* score rings */
.ed-blogscores{display:flex;gap:14px;flex-wrap:wrap}
.ed-blogscore{flex:1 1 200px;display:flex;align-items:center;gap:14px;background:#FAFBFD;border:1px solid var(--line-soft);border-radius:14px;padding:14px 16px}
.ed-blogring{--val:0;--ring:#94a3b8;position:relative;width:66px;height:66px;flex:none;border-radius:50%;
  background:conic-gradient(var(--ring) calc(var(--val)*1%),var(--line) 0);display:flex;align-items:center;justify-content:center}
.ed-blogring::before{content:"";position:absolute;inset:6px;border-radius:50%;background:var(--card)}
.ed-blogring span{position:relative;font-size:20px;font-weight:800;color:var(--txt);font-variant-numeric:tabular-nums}
.ed-blogring.is-good{--ring:#16a34a}.ed-blogring.is-good span{color:#16a34a}
.ed-blogring.is-ok{--ring:#d97706}.ed-blogring.is-ok span{color:#b45309}
.ed-blogring.is-poor{--ring:#dc2626}.ed-blogring.is-poor span{color:#dc2626}
.ed-blogscorelbl{display:flex;flex-direction:column;gap:2px}
.ed-blogscorelbl b{font-size:15px;color:var(--txt)}
.ed-blogscorelbl span{font-size:12px;color:var(--dim)}

/* sections */
.ed-blogsection{display:flex;flex-direction:column;gap:9px}
.ed-blogh2{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--dim);font-weight:800;margin:2px 0 0}
.ed-blogtips{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px;font-size:13.5px;color:var(--txt);line-height:1.5}
.ed-blogchips{display:flex;flex-wrap:wrap;gap:8px}
.ed-blogchip{display:inline-block;font-size:12.5px;font-weight:600;color:#1d4ed8;background:rgba(41,100,255,.09);
  border:1px solid rgba(41,100,255,.22);border-radius:99px;padding:5px 12px}

/* FAQ accordion */
.ed-blogfaqs{display:flex;flex-direction:column;gap:8px}
.ed-blogfaq{border:1px solid var(--line);border-radius:10px;background:#FAFBFD;overflow:hidden}
.ed-blogfaq summary{list-style:none;cursor:pointer;padding:11px 13px;font-size:14px;font-weight:650;color:var(--txt);
  display:flex;align-items:center;gap:8px}
.ed-blogfaq summary::-webkit-details-marker{display:none}
.ed-blogfaq summary::before{content:"▸";color:var(--acc);transition:transform .18s ease;flex:none}
.ed-blogfaq[open] summary::before{transform:rotate(90deg)}
.ed-blogfaq .ed-blogfaqa{padding:0 13px 12px 29px;font-size:13.5px;color:var(--dim);line-height:1.55}

/* rendered body preview */
.blog-preview{max-height:360px;overflow:auto;border:1px solid var(--line);border-radius:12px;padding:18px 20px;background:var(--card);
  font-size:14.5px;line-height:1.65;color:var(--txt)}
.blog-preview h1,.blog-preview h2,.blog-preview h3{color:var(--txt);line-height:1.3;margin:1.1em 0 .45em}
.blog-preview h1{font-size:22px}.blog-preview h2{font-size:18px}.blog-preview h3{font-size:15.5px}
.blog-preview p{margin:0 0 .85em}
.blog-preview ul,.blog-preview ol{margin:0 0 .9em;padding-left:22px}
.blog-preview li{margin:.25em 0}
.blog-preview a{color:var(--acc)}
.blog-preview img{max-width:100%;height:auto;border-radius:8px}
.blog-preview blockquote{margin:.8em 0;padding:.3em 0 .3em 14px;border-left:3px solid var(--line);color:var(--dim)}

/* export footer */
.ed-blogfoot{justify-content:space-between;flex-wrap:wrap;gap:10px}
.ed-blogexports{display:flex;flex-wrap:wrap;gap:8px}
@media(max-width:560px){
  .ed-blogfoot{flex-direction:column;align-items:stretch}
  .ed-blogexports{width:100%}
  .ed-blogexports>*{flex:1 1 auto;justify-content:center;text-align:center}
  .ed-blogscore{flex-basis:100%}
}

/* 📝 Show Notes modal — reuses .ed-blogloader / .ed-blogchip / .ed-blogh2 / .ed-blogerr.
   Card + per-section layout with copy buttons; chapter rows show time + label. */
#shownotesModal .ed-sncard{max-width:640px}
.ed-snstep{display:flex;flex-direction:column;gap:16px}
.ed-snstep.hidden{display:none}
.ed-snsection{display:flex;flex-direction:column;gap:8px}
.ed-snsechead{display:flex;align-items:center;justify-content:space-between;gap:10px}
.ed-sncard input[type=text],.ed-sncard textarea{width:100%;box-sizing:border-box;font:inherit;font-size:14px;color:var(--txt);
  background:var(--card);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.ed-sncard textarea{resize:vertical;min-height:64px;line-height:1.55}
.ed-sncard input[type=text]:focus,.ed-sncard textarea:focus{border-color:var(--acc);outline:none;box-shadow:0 0 0 3px rgba(41,100,255,.14)}
.ed-sncopy{flex:none;white-space:nowrap}
.chip.small{padding:5px 10px;font-size:12px;border-radius:8px}
.ed-snalts{display:flex;flex-direction:column;gap:6px;margin-top:2px}
.ed-snalts .ed-sub{font-size:11px;color:var(--dim)}
.ed-snaltlist{display:flex;flex-direction:column;gap:6px}
.ed-snalt{text-align:left;font:inherit;font-size:13px;color:var(--txt);background:#FAFBFD;border:1px solid var(--line);
  border-radius:9px;padding:8px 11px;cursor:pointer;transition:border-color .15s,background .15s}
.ed-snalt:hover{border-color:#BFD3FF;background:#F1F6FF}
.ed-snchapters{display:flex;flex-direction:column;gap:2px;border:1px solid var(--line);border-radius:10px;padding:6px;background:#FAFBFD;max-height:240px;overflow:auto}
.ed-snchap{display:flex;gap:12px;align-items:baseline;padding:6px 8px;border-radius:7px}
.ed-snchap:hover{background:rgba(41,100,255,.06)}
.ed-snchapt{flex:none;font-variant-numeric:tabular-nums;font-weight:700;font-size:12.5px;color:var(--acc);min-width:52px}
.ed-snchapl{font-size:13.5px;color:var(--txt)}
.ed-snfoot{justify-content:space-between;flex-wrap:wrap;gap:10px}
@media(prefers-color-scheme:dark){
  .ed-snalt,.ed-snchapters{background:rgba(255,255,255,.03)}
  .ed-snalt:hover{background:rgba(41,100,255,.12)}
}
@media(max-width:560px){
  .ed-snfoot{flex-direction:column;align-items:stretch}
  .ed-snfoot>*{width:100%;justify-content:center;text-align:center}
}

/* 🎙 AI Voiceover modal — reuses .ed-blogh2 / .ed-blogerr / .ed-modalfoot / .ed-snsechead.
   Script textarea + a 6-tile voice picker (radio grid) + a Generate button with a
   small inline spinner. On-brand premium-light, blue accent #2964ff. */
#voiceoverModal .ed-vocard{max-width:600px;display:flex;flex-direction:column;gap:16px}
.ed-vosection{display:flex;flex-direction:column;gap:8px}
.ed-vocard textarea{width:100%;box-sizing:border-box;font:inherit;font-size:14px;color:var(--txt);
  background:var(--card);border:1px solid var(--line);border-radius:10px;padding:10px 12px;resize:vertical;min-height:96px;line-height:1.55}
.ed-vocard textarea:focus{border-color:var(--acc);outline:none;box-shadow:0 0 0 3px rgba(41,100,255,.14)}
#voCount{font-size:11.5px;font-variant-numeric:tabular-nums}
.ed-vovoices{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.ed-vovoice{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;cursor:pointer;
  font:inherit;color:var(--txt);background:#FAFBFD;border:1px solid var(--line);border-radius:10px;padding:9px 11px;
  transition:border-color .15s,background .15s,box-shadow .15s}
.ed-vovoice:hover{border-color:#BFD3FF;background:#F1F6FF}
.ed-vovoice.ed-vovon{border-color:var(--acc);background:#EAF1FF;box-shadow:0 0 0 2px rgba(41,100,255,.16)}
.ed-vovname{font-weight:700;font-size:13.5px}
.ed-vovdesc{font-size:11px;color:var(--dim);line-height:1.25}
.ed-vofoot{justify-content:space-between;flex-wrap:wrap;gap:10px}
.ed-vogenlbl{display:inline-flex;align-items:center;gap:6px}
.ed-vospin{display:inline-block;width:14px;height:14px;border-radius:50%;margin-left:8px;vertical-align:-2px;
  border:2px solid rgba(255,255,255,.45);border-top-color:#fff;animation:edBlogSpin 0.8s linear infinite}
.ed-vospin.hidden{display:none}
@media(prefers-color-scheme:dark){
  .ed-vovoice{background:rgba(255,255,255,.03)}
  .ed-vovoice:hover{background:rgba(41,100,255,.1)}
  .ed-vovoice.ed-vovon{background:rgba(41,100,255,.16)}
}
@media (prefers-reduced-motion:reduce){ .ed-vospin{animation:none} }
@media(max-width:560px){
  .ed-vovoices{grid-template-columns:repeat(2,1fr)}
  .ed-vofoot{flex-direction:column;align-items:stretch}
  .ed-vofoot>*{width:100%;justify-content:center;text-align:center}
}

/* 🎙️ Voice Cleanup — premium-light action in the clip card (sits under Volume).
   Accent-tinted pill matching .ed-ytlinkcta; full-width so it reads as a primary
   audio action without competing with the chip button row below it. */
.ed-voiceclean-row{display:flex;flex-direction:column;gap:4px;margin:2px 0 2px}
.ed-voiceclean-row.hidden{display:none}
.ed-voiceclean{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;
  padding:9px 12px;border-radius:var(--r-btn);border:1px solid rgba(41,100,255,.4);
  background:#DCEAFF;color:var(--acc);font-weight:700;font-size:13px;cursor:pointer;
  transition:background .18s var(--ease),box-shadow .18s var(--ease),transform .18s var(--ease)}
.ed-voiceclean:hover:not(:disabled){background:#CFE1FF;box-shadow:0 8px 18px -10px rgba(41,100,255,.5);transform:translateY(-1px)}
.ed-voiceclean:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.ed-voiceclean:disabled{opacity:.65;cursor:default;background:#EAF1FF}
.ed-voiceclean.is-busy{cursor:progress}
.ed-voiceclean-note{font-size:11px;color:var(--dim);text-align:center;line-height:1.3}
/* Hidden while previewing an un-placed bin item (clip-only control), like the rest. */
#clipCard.is-binpreview .ed-voiceclean-row{display:none}

/* ✨ AI Clip Finder modal — reuses .ed-blogloader / .ed-blogerr / .ed-modalfoot.
   Result = a stack of ranked clip cards: score badge + title + hook + timestamp
   range + one-line reason, with Preview / Make Short actions. On-brand premium-
   light, blue accent #2964ff. */
#clipFinderModal .ed-cfcard{max-width:660px}
.ed-cfstep{display:flex;flex-direction:column;gap:16px}
.ed-cfstep.hidden{display:none}
.ed-cfintro{line-height:1.5}
.ed-cfcards{display:flex;flex-direction:column;gap:12px;max-height:min(56vh,540px);overflow:auto;padding:2px}
.ed-cfcard-item{display:flex;gap:14px;align-items:flex-start;border:1px solid var(--line);border-radius:14px;
  padding:13px 14px;background:#FAFBFD;transition:border-color .15s,box-shadow .15s,transform .15s}
.ed-cfcard-item:hover{border-color:#BFD3FF;box-shadow:0 10px 24px -16px rgba(41,100,255,.55);transform:translateY(-1px)}
.ed-cfscore{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;
  width:52px;height:52px;border-radius:12px;background:rgba(41,100,255,.09);border:1px solid rgba(41,100,255,.22)}
.ed-cfscore b{font-size:20px;font-weight:800;line-height:1;color:var(--acc);font-variant-numeric:tabular-nums}
.ed-cfscore span{font-size:8.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--dim)}
.ed-cfscore.is-hot{background:rgba(220,38,38,.10);border-color:rgba(220,38,38,.28)}
.ed-cfscore.is-hot b{color:#dc2626}
.ed-cfscore.is-good{background:rgba(22,163,74,.10);border-color:rgba(22,163,74,.26)}
.ed-cfscore.is-good b{color:#16a34a}
.ed-cfscore.is-ok{background:rgba(217,119,6,.10);border-color:rgba(217,119,6,.26)}
.ed-cfscore.is-ok b{color:#b45309}
.ed-cfbody{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.ed-cftitle{font-size:15px;font-weight:700;color:var(--txt);line-height:1.3}
.ed-cfhook{font-size:13px;color:var(--txt);opacity:.86;font-style:italic;line-height:1.45}
.ed-cfmeta{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ed-cfrange{font-size:12.5px;font-weight:700;color:var(--acc);font-variant-numeric:tabular-nums}
.ed-cfdur{font-size:11px;font-weight:700;color:var(--dim);background:rgba(41,100,255,.08);border-radius:6px;padding:2px 7px}
.ed-cfreason{font-size:12.5px;color:var(--dim);line-height:1.45}
.ed-cfacts{display:flex;gap:8px;margin-top:4px;flex-wrap:wrap}
.ed-cfmake{background:#DCEAFF;border-color:rgba(41,100,255,.4);color:var(--acc);font-weight:700}
.ed-cfmake:hover{background:#CFE1FF}
.ed-cffoot{justify-content:flex-end;flex-wrap:wrap;gap:10px}
@media(prefers-color-scheme:dark){
  .ed-cfcard-item{background:rgba(255,255,255,.03)}
  .ed-cfcard-item:hover{background:rgba(41,100,255,.07)}
}
@media(max-width:560px){
  .ed-cfcard-item{flex-direction:column;gap:10px}
  .ed-cfscore{flex-direction:row;width:auto;height:auto;gap:6px;padding:5px 10px;align-self:flex-start}
  .ed-cfacts{width:100%}
  .ed-cfacts .chip{flex:1;justify-content:center;text-align:center}
}

/* ==================================================== 🎵 BEAT SYNC WIZARD */
.ed-beatbtn.active,.ed-beatbtn.ed-checked{background:#DCEAFF;border-color:rgba(41,100,255,.4);color:#2964ff}
.ed-bsstep{margin-top:4px}
.ed-bsstep + .ed-bsstep{margin-top:16px;padding-top:14px;border-top:1px solid rgba(41,100,255,.14)}
.ed-bsselect{padding:9px 11px;border-radius:10px;border:1px solid rgba(41,100,255,.28);background:#fff;color:inherit;font:inherit}
.ed-bsselect:focus{outline:none;border-color:#2964ff;box-shadow:0 0 0 3px rgba(41,100,255,.16)}
.ed-bsrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ed-bsstep2head{justify-content:space-between;margin-bottom:9px}
.ed-bslbl{font-size:.88rem;color:var(--muted,#6b7280);font-weight:600}
.ed-bslbl2{font-weight:700;font-size:.98rem}
.ed-bscount{font-weight:600;color:var(--muted,#6b7280);font-size:.86rem;margin-left:4px}
.ed-bsresult{font-size:.92rem}
.ed-bsresult b{color:#2964ff}
.ed-bsneed{font-size:.86rem;color:var(--muted,#6b7280);font-weight:600}
.ed-bsgridtag{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:999px;background:#DCEAFF;color:#2964ff;font-size:.72rem;font-weight:800;letter-spacing:.02em;vertical-align:1px;cursor:help}
/* segmented + toggle chips (Cut-every / Randomize / Repeat) */
.ed-bsseg{display:inline-flex;gap:4px;background:rgba(41,100,255,.07);padding:3px;border-radius:11px}
.ed-bschip{padding:6px 13px;border-radius:8px;border:1px solid transparent;background:transparent;color:inherit;font:inherit;font-weight:700;cursor:pointer;transition:background .12s,color .12s,border-color .12s;line-height:1.1}
.ed-bsseg .ed-bschip{min-width:34px;text-align:center}
.ed-bschip:hover{background:rgba(41,100,255,.12)}
.ed-bschip.ed-on{background:#2964ff;border-color:#2964ff;color:#fff;box-shadow:0 1px 4px rgba(41,100,255,.32)}
.ed-bsopts{display:inline-flex;gap:8px}
.ed-bsopts .ed-bschip{border-color:rgba(41,100,255,.24);background:#fff}
.ed-bsopts .ed-bschip:hover{background:#DCEAFF}
.ed-bsopts .ed-bschip.ed-on{background:#2964ff;border-color:#2964ff;color:#fff}
/* clip picker grid */
.ed-bsgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px;max-height:290px;overflow-y:auto;padding:4px;margin:2px -4px}
.ed-bstile{display:flex;flex-direction:column;gap:5px;padding:0;background:none;border:none;cursor:pointer;text-align:left;font:inherit;color:inherit}
.ed-bstthumb{position:relative;width:100%;aspect-ratio:16/10;border-radius:9px;background-size:cover;background-position:center;background-color:#1e293b;border:2px solid transparent;box-shadow:0 1px 3px rgba(0,0,0,.14);transition:border-color .12s,transform .1s}
.ed-bstile:hover .ed-bstthumb{transform:translateY(-1px)}
.ed-bstile.ed-on .ed-bstthumb{border-color:#2964ff;box-shadow:0 0 0 2px rgba(41,100,255,.28)}
.ed-bstkind{position:absolute;left:5px;bottom:4px;font-size:13px;line-height:1;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6))}
.ed-bstbadge{position:absolute;top:4px;right:4px;min-width:19px;height:19px;padding:0 4px;display:none;align-items:center;justify-content:center;border-radius:999px;background:#2964ff;color:#fff;font-size:.72rem;font-weight:800;line-height:19px;text-align:center;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.ed-bstile.ed-on .ed-bstbadge{display:flex}
.ed-bstname{font-size:.74rem;color:var(--muted,#6b7280);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ed-bsempty{grid-column:1/-1;padding:22px 10px;text-align:center;color:var(--muted,#6b7280);font-size:.9rem}
.ed-bshint2{margin:.5rem 0 0}
.ed-bshint2 a{color:#2964ff;font-weight:700}
.ed-bshidden{display:none}
@media(prefers-color-scheme:dark){
  .ed-bsselect{background:rgba(255,255,255,.05);border-color:rgba(120,160,255,.32)}
  .ed-bsseg{background:rgba(120,160,255,.12)}
  .ed-bsopts .ed-bschip{background:rgba(255,255,255,.05);border-color:rgba(120,160,255,.3)}
  .ed-bsgridtag{background:rgba(41,100,255,.24);color:#bcd2ff}
  .ed-beatbtn.active,.ed-beatbtn.ed-checked{background:rgba(41,100,255,.24);color:#bcd2ff}
}
@media(max-width:560px){
  .ed-bsgrid{grid-template-columns:repeat(auto-fill,minmax(84px,1fr))}
  .ed-bsstep2head{flex-direction:column;align-items:flex-start;gap:8px}
}

/* ============================================================================
   FULLSCREEN PREVIEW  +  SECOND-SCREEN PROJECTOR                       (v133)
   Additive: corner chips + fullscreen control overlay + screen chooser.
   Nothing here affects the stage unless .is-fs is present or the chips render. */
.ed-fschips{position:absolute;top:10px;right:10px;display:flex;gap:6px;z-index:5;
  opacity:.35;transition:opacity .3s ease}
.ed-stage:hover .ed-fschips,.ed-fschips:hover,.ed-fschips:focus-within{opacity:1}
.ed-fschips .chip{background:rgba(255,255,255,.92);border-color:transparent;line-height:1}
.ed-fschips .chip:hover{background:#fff}
.ed-fschips .chip.ed-on{background:#2563eb;color:#fff}
.ed-stage.is-fs .ed-fschips{display:none}

/* stage fills the screen while fullscreen; canvas contain-fits (any aspect) */
.ed-stage.is-fs{width:100vw;height:100vh;max-width:none;aspect-ratio:auto;border:0;border-radius:0;background:#000}
.ed-stage.is-fs #preview{width:auto;height:auto;max-width:100vw;max-height:100vh}
.ed-stage.is-fs .ed-transport{display:none}   /* the fullscreen overlay replaces it */

/* control overlay — only visible while fullscreen; click-through except the bar */
.ed-fsoverlay{position:absolute;inset:0;display:none;pointer-events:none;z-index:6}
.ed-stage.is-fs .ed-fsoverlay{display:block}
.ed-fsbar{position:absolute;left:0;right:0;bottom:0;pointer-events:auto;padding:16px 22px 20px;
  background:linear-gradient(to top,rgba(0,0,0,.82),rgba(0,0,0,.2) 72%,rgba(0,0,0,0));
  transition:opacity .35s ease,transform .35s ease}
.ed-stage.is-fs.ed-fs-hidebar{cursor:none}
.ed-stage.is-fs.ed-fs-hidebar .ed-fsbar{opacity:0;transform:translateY(14px);pointer-events:none}
.ed-fstransport{display:flex;align-items:center;gap:12px;margin-top:12px}
.ed-fsc{appearance:none;-webkit-appearance:none;border:0;background:rgba(255,255,255,.14);color:#fff;
  font-size:18px;line-height:1;width:46px;height:46px;border-radius:11px;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;transition:background .15s ease,transform .12s ease}
.ed-fsc:hover{background:rgba(255,255,255,.28)}
.ed-fsc:active{transform:scale(.94)}
.ed-fsc.ed-on{background:rgba(255,255,255,.3)}
.ed-fsexit{margin-left:2px}
.ed-fsexport{width:auto;padding:0 16px;gap:6px;font-size:15px;font-weight:600}
.ed-fsinfo{color:rgba(255,255,255,.94);font-size:13px;font-variant-numeric:tabular-nums;letter-spacing:.01em;
  text-shadow:0 1px 3px rgba(0,0,0,.7);margin-bottom:10px;min-height:16px}
.ed-fsinfo:empty{display:none}
.ed-fstime{color:#fff;font-variant-numeric:tabular-nums;font-size:15px;text-shadow:0 1px 3px rgba(0,0,0,.7)}
.ed-fstime b{font-weight:700}
.ed-fsspacer{flex:1}
.ed-fsscrub{position:relative;height:22px;display:flex;align-items:center;cursor:pointer;touch-action:none;outline:none}
.ed-fsscrub::before{content:"";position:absolute;left:0;right:0;height:6px;border-radius:6px;background:rgba(255,255,255,.28)}
.ed-fsscrub:focus-visible::before{box-shadow:0 0 0 2px rgba(255,255,255,.5)}
.ed-fsscrubfill{position:absolute;left:0;height:6px;border-radius:6px;background:#2563eb;width:0}
.ed-fsscrubthumb{position:absolute;left:0;top:50%;width:16px;height:16px;border-radius:50%;background:#fff;
  box-shadow:0 1px 5px rgba(0,0,0,.55);transform:translate(-50%,-50%);pointer-events:none}
@media (prefers-reduced-motion: reduce){
  .ed-fsbar,.ed-fschips,.ed-fsc{transition:none}
  .ed-stage.is-fs.ed-fs-hidebar .ed-fsbar{transform:none}
}

/* second-screen chooser (>1 external screen) */
.ed-fspick{position:fixed;inset:0;z-index:99999;background:rgba(10,15,25,.55);
  display:flex;align-items:center;justify-content:center;padding:20px}
.ed-fspickcard{background:var(--card,#fff);color:var(--txt,#101828);border:1px solid var(--line,#e5e9f0);
  border-radius:14px;padding:20px;min-width:280px;max-width:92vw;box-shadow:0 24px 60px -12px rgba(0,0,0,.5)}
.ed-fspickcard h3{margin:0 0 12px;font-size:16px}
.ed-fspicklist{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.ed-fspickopt{justify-content:flex-start;text-align:left;width:100%}

/* ============================================================ DISCOVER / TIPS
   Fills the empty Properties card (no clip selected) with a rotating tip + 1–2
   blog cards. Fits the narrow right column (~280–320px). Theme-aware via the
   editor tokens; a few dark overrides for the placeholder surfaces below. */
.ed-propsempty:has(.ed-discover){text-align:left;padding:0}
.ed-discover{display:flex;flex-direction:column;gap:14px}
/* Top row: "💡 Tips & ideas" heading (matches the FILES BIN card heading) on the left,
   "Show another one" pinned to the top-right. */
.ed-disc-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.ed-disc-head{font-size:12px;text-transform:uppercase;letter-spacing:.07em;font-weight:700;color:var(--dim);margin:0}
/* Tip: centered, larger, NO card/box. Shortcut tips render in blue. */
.ed-disc-tip{text-align:center;font-size:16px;line-height:1.5;color:var(--acc);font-weight:600;
  background:none;border:0;border-radius:0;padding:6px 6px 2px;margin:0}   /* all tips blue, matching #addLayerBtn (+ Add Timeline) */
.ed-tip-kbd{color:var(--acc);background:none;border:0;font-weight:700}
.ed-tip-pro{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.04em;color:#996c0d;
  background:#fdf3d4;border:1px solid #e5c24e;border-radius:999px;padding:1px 7px;vertical-align:middle;margin:0 1px}
.ed-disc-more{flex:none;display:inline-flex;align-items:center;gap:6px;
  font:inherit;font-size:12px;font-weight:600;color:var(--dim);cursor:pointer;
  background:transparent;border:1px solid var(--line);border-radius:999px;padding:5px 11px;white-space:nowrap;
  transition:border-color .15s ease,color .15s ease,background .15s ease}
.ed-disc-more:hover{color:var(--acc);border-color:var(--acc);background:color-mix(in srgb,var(--acc) 6%,transparent)}
.ed-disc-more:focus-visible{outline:2px solid var(--acc);outline-offset:2px}

/* optional single tutorial video (dormant until DISCOVER_VIDEO is set) */
.ed-disc-video{display:flex;flex-direction:column;gap:6px}
.ed-disc-video video{width:100%;border-radius:12px;border:1px solid var(--line);background:#000;aspect-ratio:16/9}
.ed-disc-vlabel{font-size:11.5px;color:var(--dim);font-weight:600}

/* Hide the redundant "Video Properties" header + clip-action buttons while the tips panel shows */
.ed-props.is-discover .ed-clabhead{display:none}
/* Guides row header + prev/next paging */
.ed-disc-artshead{display:flex;align-items:center;justify-content:space-between;margin-top:2px}
.ed-disc-artstitle{font-size:11px;text-transform:uppercase;letter-spacing:.08em;font-weight:800;color:var(--dim)}
.ed-disc-nav{display:inline-flex;align-items:center;gap:6px}
.ed-disc-page{font-size:11px;font-weight:700;color:var(--dim);font-variant-numeric:tabular-nums;min-width:30px;text-align:center}
.ed-disc-arrow{width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;
  font-size:16px;line-height:1;color:var(--txt);background:var(--card);border:1px solid var(--line);
  border-radius:7px;cursor:pointer;transition:border-color .15s ease,color .15s ease,background .15s ease}
.ed-disc-arrow:hover{color:var(--acc);border-color:var(--acc);background:color-mix(in srgb,var(--acc) 7%,transparent)}
/* Compact 3-per-row guide cards — gradient placeholder + emoji, category, REAL title (clamped) */
.ed-disc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.ed-disc-card{display:flex;flex-direction:column;gap:5px;text-decoration:none;color:var(--txt);
  background:var(--card);border:1px solid var(--line);border-radius:10px;padding:6px;overflow:hidden;
  transition:transform .16s var(--ease),box-shadow .16s var(--ease),border-color .16s ease}
.ed-disc-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--acc) 45%,var(--line));
  box-shadow:0 12px 24px -14px rgba(16,24,40,.34)}
.ed-disc-card:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.ed-disc-card-img{position:relative;width:100%;aspect-ratio:16/10;border-radius:7px;overflow:hidden;
  display:flex;align-items:center;justify-content:center}
.ed-disc-card-emoji{font-size:22px;line-height:1;filter:drop-shadow(0 1px 4px rgba(0,0,0,.4));user-select:none}
.ed-disc-card-thumb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.ed-disc-card-cat{font-size:8.5px;font-weight:800;letter-spacing:.06em;color:var(--acc)}
.ed-disc-card-title{font-size:11px;font-weight:600;line-height:1.28;color:var(--txt);
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
@media(prefers-color-scheme:dark){
  .ed-disc-card{background:rgba(255,255,255,.02)}
  .ed-disc-arrow{background:rgba(255,255,255,.03)}
}

/* ============ Extras dropdown (relocated Speed/Polish/Captions/Background + Audio Leveling) */
.ed-extraswrap{position:relative;display:inline-flex}
#extrasBtn{gap:6px}
.ed-extraschev{width:14px;height:14px;opacity:.7;margin-left:-2px}
.ed-extrasmenu{position:absolute;top:calc(100% + 6px);left:0;z-index:70;min-width:196px;padding:6px;
  background:#fff;border:1px solid #e5e7eb;border-radius:12px;box-shadow:0 12px 34px rgba(15,23,42,.18);
  display:flex;flex-direction:column;gap:2px}
.ed-extrasmenu.hidden{display:none}
.ed-extrasitem{display:flex;align-items:center;gap:10px;width:100%;padding:9px 11px;border:0;border-radius:8px;
  background:transparent;font:inherit;font-size:.9rem;color:#0f172a;cursor:pointer;text-align:left;white-space:nowrap}
.ed-extrasitem:hover{background:#f1f5f9}
.ed-extrasitem .ed-xic{width:20px;text-align:center;font-size:1rem;flex:0 0 auto}
@media(prefers-color-scheme:dark){
  .ed-extrasmenu{background:#1e293b;border-color:#334155;box-shadow:0 12px 34px rgba(0,0,0,.5)}
  .ed-extrasitem{color:#e2e8f0}
  .ed-extrasitem:hover{background:#334155}
}

/* ============ Audio Leveling modal */
.ed-levelrow{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 14px;
  border:1px solid #e5e7eb;border-radius:12px;background:#f8fafc}
.ed-levelrow.is-disabled{opacity:.55}
.ed-levelh{font-weight:700;font-size:.98rem;color:#0f172a}
.ed-levelsub{font-size:.82rem;color:#64748b;margin-top:2px;max-width:370px;line-height:1.35}
.ed-switch{position:relative;width:46px;height:26px;border-radius:999px;border:0;background:#cbd5e1;cursor:pointer;
  transition:background .15s;flex:0 0 auto;padding:0}
.ed-switch.on{background:#16a34a}
.ed-switchknob{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;
  box-shadow:0 1px 3px rgba(0,0,0,.3);transition:left .15s}
.ed-switch.on .ed-switchknob{left:23px}
.ed-levelprog{margin-top:14px}
.ed-levelbar{height:9px;border-radius:999px;background:#e5e7eb;overflow:hidden}
.ed-levelbarfill{height:100%;width:0;background:linear-gradient(90deg,#2964ff,#16a34a);border-radius:999px;transition:width .12s}
.ed-levelpct{font-size:.82rem;color:#475569;margin-top:7px;text-align:center}
@media(prefers-color-scheme:dark){
  .ed-levelrow{background:#0f172a;border-color:#334155}
  .ed-levelh{color:#e2e8f0}
  .ed-levelbar{background:#334155}
  .ed-levelpct,.ed-levelsub{color:#94a3b8}
}

/* ============ Pan/Crop modal — header undo/redo group + single-line tools row */
.ed-crophead{display:flex;align-items:center;gap:6px}
.ed-croptools{display:flex;flex-wrap:nowrap;gap:8px;margin-top:12px;align-items:center;justify-content:center;overflow-x:auto}
.ed-croptools>.chip{white-space:nowrap;flex:0 0 auto}

/* Speed/Polish/Captions/Background moved into the Extras dropdown — the buttons stay in the
   DOM (the dropdown proxies .click() them) but must never render. The `hidden` ATTRIBUTE
   alone loses to the .chip display rule, hence the explicit kill. */
#speedAllBtn,#polishBtn,#captionsBtn,#bgBtn{display:none!important}

.ed-binitem.ed-bin-justadded{animation:edBinFlash 2.2s ease}
@keyframes edBinFlash{0%,40%{background:rgba(47,107,255,.16);box-shadow:inset 0 0 0 2px var(--acc)}100%{background:transparent;box-shadow:none}}