/* CLEAR Video Editor. Loaded after chrome.css and hub.css (CLEAR colours, fonts, header, footer, buttons). */
.vd{background:linear-gradient(180deg,var(--ck-lav) 0,#fff 420px);min-height:60vh;padding:0 0 64px}
.vd-loading{text-align:center;font-size:1.1rem;padding:60px 20px}
.vd-card{background:#fff;border-radius:32px;padding:34px 34px 28px;box-shadow:0 10px 36px #3d2b9622;margin:40px auto 0;box-sizing:border-box}
.vd-narrow{max-width:600px;width:calc(100% - 32px)}
.vd h1{font-size:clamp(1.7rem,2.4vw + .9rem,2.4rem);color:var(--ck-purple);margin:0;line-height:1.15}
.vd h2{color:var(--ck-purple);font-size:1.4rem;margin:0 0 8px}
.vd .lead{font-size:1.12rem;line-height:1.6;margin:10px 0 18px}
.vd-eyebrow{font-size:.85rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#0a7a5c;margin:0 0 6px}
.vd-dim{color:var(--ck-slate)}
.vd-fine{font-size:.92rem;color:var(--ck-slate);line-height:1.6;margin:20px 0 0}
.vd-note{background:#fff;border-left:5px solid var(--ck-teal);border-radius:12px;padding:12px 16px;margin:14px 0;box-shadow:0 1px 3px #1f243314}
.vd-note.bad{border-color:var(--ck-pink);background:#fdf1f5}
.vd-err{color:#a8305f;font-weight:500;margin:10px 0}
.vd-link{background:none;border:0;padding:4px 2px;font:500 inherit var(--font);font-size:inherit;color:var(--ck-purple);text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.vd-link:disabled{color:var(--ck-grey);cursor:default}
.vd svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.vd svg .fill,.vd .vd-more svg{fill:currentColor;stroke:none}
.ck-btn.sm{min-height:42px;padding:8px 16px;font-size:.98rem;gap:6px;width:auto}
.ck-btn.danger{background:#fff;color:#a8305f;border-color:#a8305f}
.ck-btn.danger:hover{background:#fdf1f5}
.ck-btn:disabled{opacity:.5;cursor:default}

/* ---------------------------------------------------------------- forms */
.vd-form .vd-fld{margin-bottom:16px}
.vd-fld{display:flex;flex-direction:column;gap:6px;margin:0 0 16px}
.vd-fld label,.vd-fs legend{font-weight:600;font-size:.98rem;color:var(--ck-ink)}
.vd-fld .help{font-size:.88rem;color:var(--ck-slate);line-height:1.5}
.vd-fld .opt{font-weight:400;color:var(--ck-slate)}
.vd-fld input[type=text],.vd-fld input[type=password],.vd-fld select{font:400 1.05rem var(--font);color:var(--ck-ink);background:#fff;border:2px solid #3d2b9640;border-radius:12px;padding:10px 14px;min-height:48px;box-sizing:border-box;width:100%}
.vd-fld input:focus,.vd-fld select:focus{outline:3px solid #3d2b9640;border-color:var(--ck-purple)}
.vd-fld input[type=range]{width:100%;accent-color:var(--ck-purple);min-height:32px}

/* ---------------------------------------------------------------- choose a video */
.vd-drop{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;border:3px dashed #3d2b9655;border-radius:24px;padding:34px 18px;background:var(--ck-lav);cursor:pointer;color:var(--ck-purple);transition:background .15s,border-color .15s}
.vd-drop:hover,.vd-drop.over{background:#e0dcf7;border-color:var(--ck-purple)}
#file:focus-visible + .vd-err,.vd-drop:focus-within{outline:3px solid var(--focus)}
.vd-drop .big{width:54px;height:54px;stroke-width:1.6}
.vd-drop .t{font-size:1.3rem;font-weight:700}
.vd-drop .s{color:var(--ck-body);font-size:.98rem}
.vd-opts{margin-top:18px;border:2px solid #3d2b9622;border-radius:16px;padding:4px 16px}
.vd-opts summary{font-weight:600;color:var(--ck-purple);padding:10px 0;cursor:pointer}
.vd-opts[open]{padding-bottom:4px}

/* ---------------------------------------------------------------- busy */
.vd-busy{text-align:center;padding:48px 28px}
.vd-spin{width:52px;height:52px;margin:0 auto 18px;border-radius:50%;border:5px solid var(--ck-lav);border-top-color:var(--ck-purple);animation:vdspin 1s linear infinite}
@keyframes vdspin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.vd-spin{animation-duration:3s}}

/* ---------------------------------------------------------------- editor */
.vd-ed{max-width:1240px;margin:0 auto;padding:12px 16px 0;box-sizing:border-box}
.vd-bar{display:flex;align-items:center;gap:8px;margin:0 0 12px}
.vd-bar-mid{display:flex;gap:6px;margin-right:auto}
.vd-ib{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:46px;min-height:46px;padding:0 10px;border-radius:12px;border:2px solid #3d2b9633;background:#fff;color:var(--ck-purple);font:600 .98rem var(--font);cursor:pointer}
.vd-ib:hover{background:var(--ck-lav)}
.vd-ib:disabled{opacity:.4;cursor:default;background:#fff}
.vd-ib.sm{min-width:38px;min-height:38px;padding:0 6px;border-radius:10px}
.vd-ib.sm svg{width:18px;height:18px}
.vd-save{min-height:48px;padding:8px 20px;font-size:1.05rem;width:auto;gap:8px}
.vd-capnote{margin:0 0 12px}
.vd-layout{display:grid;gap:16px}
.vd-left{min-width:0}
.vd-right{min-width:0}

.vd-stagewrap{background:#14112a;border-radius:20px;padding:10px;display:flex;justify-content:center}
.vd-stage{position:relative;background:#000;border-radius:10px;overflow:hidden;max-width:100%}
.vd-stage video,.vd-stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.vd-stage video{object-fit:fill}
.vd-stage canvas{cursor:pointer}
.vd-qbox{position:absolute;box-sizing:border-box;border:2px dashed #ffffffb0;border-radius:8px;cursor:move;touch-action:none;user-select:none;-webkit-user-select:none;z-index:2;box-shadow:0 0 0 1px #0000004d}
.vd-qbox.sel{border:2px solid #fff;box-shadow:0 0 0 1px #00000080,inset 0 0 0 1px #00000040}
.vd-qbox:focus-visible{outline:3px solid var(--ck-yellow);outline-offset:2px}
.vd-qbox.dragging{background:#ffffff14}
.playing .vd-qbox:not(.dragging){border-color:transparent;box-shadow:none}
.playing .vd-qh{display:none}
.vd-qh{position:absolute;display:none;touch-action:none}
.vd-qbox.sel .vd-qh{display:block}
.vd-qh::before{content:"";position:absolute;background:#fff;box-shadow:0 0 0 2px var(--ck-purple),0 2px 6px #0007}
.vd-qh::after{content:"";position:absolute;inset:-10px}
.vd-qh.l,.vd-qh.r{top:50%;width:14px;height:34px;margin-top:-17px;cursor:ew-resize}
.vd-qh.l{left:-8px}.vd-qh.r{right:-8px}
.vd-qh.l::before,.vd-qh.r::before{left:4px;top:0;width:6px;height:34px;border-radius:3px}
.vd-qh.s{right:-11px;bottom:-11px;width:20px;height:20px;cursor:nwse-resize}
.vd-qh.s::before{inset:2px;border-radius:50%}
.vd-guide{position:absolute;left:50%;top:0;bottom:0;width:0;border-left:2px dashed #ff4d6d;z-index:2;pointer-events:none}
.vd-guide[hidden]{display:none}
.vd-bigplay{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:76px;height:76px;border-radius:50%;border:0;background:#000000a0;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer}
.vd-bigplay svg{width:38px;height:38px;margin-left:4px}

.vd-transport{display:flex;align-items:center;gap:12px;margin:12px 0 8px}
.vd-play{width:52px;height:52px;border-radius:50%;border:0;background:var(--ck-purple);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;flex:none}
.vd-play:hover{background:var(--ck-purple-d)}
.vd-play .ipause{display:none}
.playing .vd-play .ip{display:none}
.playing .vd-play .ipause{display:block}
.vd-time{font-variant-numeric:tabular-nums;font-weight:600;color:var(--ck-ink);font-size:1.02rem}
.vd-zoom{margin-left:auto;display:flex;gap:6px}
.vd-frames{display:flex;gap:6px}
.vd-time{white-space:nowrap}
@media (max-width:420px){.vd-transport{gap:6px}.vd-time{font-size:.84rem}.vd-play{width:46px;height:46px}.vd-frames,.vd-zoom{gap:4px}}
@media (max-width:360px){.vd-transport{flex-wrap:wrap}.vd-time{order:5;flex-basis:100%;font-size:.9rem}}
@media (pointer:coarse){.vd-keys{display:none}}

.vd-tl{overflow-x:auto;overflow-y:hidden;border-radius:14px;background:#14112a;padding:8px 0;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.vd-track{position:relative;height:134px;width:100%;margin:0 auto;touch-action:none;cursor:pointer;user-select:none;-webkit-user-select:none;box-sizing:border-box}
.vd-track:focus-visible{outline:3px solid #fff;outline-offset:-3px}
#thumbs{position:absolute;left:0;top:18px;width:100%;height:58px;display:block}
#ruler{position:absolute;left:0;top:0;width:100%;height:16px;display:block;pointer-events:none}
.vd-cuts{position:absolute;left:0;right:0;top:18px;height:58px;pointer-events:none}
.vd-cut{position:absolute;top:0;height:100%;background:repeating-linear-gradient(135deg,#000000c8 0 6px,#000000a0 6px 12px)}
.vd-join{position:absolute;top:-2px;height:62px;width:3px;margin-left:-1.5px;background:#fff;border-radius:2px;box-shadow:0 0 0 1px #000}
.vd-sel{position:absolute;top:0;height:100%;box-sizing:border-box;border:3px solid #ffd34d;border-radius:6px}
.vd-capsrow{position:absolute;left:0;right:0;top:82px;height:24px}
.vd-cap{position:absolute;top:0;height:24px;box-sizing:border-box;padding:0 5px;border-radius:5px;background:#6e57d6;color:#fff;font-size:.72rem;line-height:24px;white-space:nowrap;overflow:hidden;text-overflow:clip;border-right:1px solid #14112a}
.vd-cap.gone{background:#4a4566;color:#ffffff99}
.vd-qrow{position:absolute;left:0;right:0;top:110px;height:20px}
.vd-qseg{position:absolute;top:0;height:20px;box-sizing:border-box;padding:0 6px;border-radius:5px;background:#ffd34d;color:#14112a;font-size:.68rem;font-weight:600;line-height:20px;white-space:nowrap;overflow:hidden;border-right:1px solid #14112a;cursor:pointer}
.vd-qseg.on{box-shadow:inset 0 0 0 2px #fff;background:#ffe27f}
.vd-edges{position:static}
/* Cut edges: a white bracket on the inside of each kept part ([ at a start, ] at an end), with a wider invisible grip. */
.vd-handle{position:absolute;top:18px;height:58px;width:24px;z-index:3;display:flex;align-items:stretch;cursor:ew-resize;touch-action:none}
.vd-handle.l{margin-left:-6px;justify-content:flex-start;padding-left:6px}
.vd-handle.r{margin-left:-18px;justify-content:flex-end;padding-right:6px}
.vd-handle span{width:7px;border:3px solid #fff;box-shadow:0 0 0 1px #14112a,0 2px 6px #0008;background:#ffffff40}
.vd-handle.l span{border-right:0;border-radius:6px 0 0 6px}
.vd-handle.r span{border-left:0;border-radius:0 6px 6px 0}
.vd-handle:hover span,.vd-handle:focus-visible span{border-color:var(--ck-yellow,#ffd34d);background:#ffd34d55}
.vd-handle:focus-visible{outline:none}
/* The bit marked to cut */
.vd-mark{position:absolute;top:18px;height:58px;z-index:2;box-sizing:border-box;background:#e23b3b55;border-top:3px solid #ff5d6c;border-bottom:3px solid #ff5d6c;min-width:2px;pointer-events:none}
.vd-mark.half{background:none;border:0}
.vd-mark .lbl{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:#e23b3b;color:#fff;font:700 .72rem var(--font);padding:2px 7px;border-radius:99px;white-space:nowrap;pointer-events:none}
.vd-mh{position:absolute;top:-3px;bottom:-3px;width:24px;margin-left:-12px;cursor:ew-resize;pointer-events:auto;touch-action:none;display:flex;justify-content:center}
.vd-mh::before{content:"";width:5px;border-radius:3px;background:#ff5d6c;box-shadow:0 0 0 1px #14112a}
.vd-mh:focus-visible{outline:none}
.vd-mh:focus-visible::before,.vd-mh:hover::before{background:#fff}
/* The time above an edge while it is dragged */
.vd-tip{position:absolute;top:-4px;z-index:6;transform:translateX(-50%);background:#fff;color:#14112a;font:700 .78rem var(--font);font-variant-numeric:tabular-nums;padding:2px 8px;border-radius:99px;box-shadow:0 2px 8px #0006;pointer-events:none;white-space:nowrap}
.vd-ph{position:absolute;top:12px;bottom:-4px;width:2px;margin-left:-1px;background:#ff4d6d;z-index:4;pointer-events:none}
.vd-ph::before{content:"";position:absolute;top:0;left:-5px;border:6px solid transparent;border-top-color:#ff4d6d}

.vd-tools{display:flex;gap:10px;margin:12px 0 6px;flex-wrap:wrap}
.vd-tool{flex:1;min-width:110px;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;border-radius:14px;border:2px solid #3d2b9633;background:#fff;color:var(--ck-purple);font:600 1rem var(--font);cursor:pointer}
.vd-tool:hover{background:var(--ck-lav)}
.vd-tool:disabled{opacity:.4;cursor:default;background:#fff}
.vd-tool.on{border-color:#ff5d6c;background:#fff0f2;color:#b3263a}
.vd-tool.go{background:var(--ck-purple);border-color:var(--ck-purple);color:#fff}
.vd-tool.go:hover:not(:disabled){background:var(--ck-purple-d)}
.vd-tool.go:disabled{background:var(--ck-purple);opacity:.35}
.vd-tool span{white-space:nowrap}
@media (max-width:480px){.vd-tools{gap:6px}.vd-tool{min-width:0;padding:0 6px;gap:5px;font-size:.88rem}.vd-tool svg{width:18px;height:18px;flex:none}.vd-tools.sm .vd-tool{min-width:0!important;font-size:.82rem!important}.vd-tools.sm .vd-tool svg{display:none}}
@media (max-width:360px){.vd-tool svg{display:none}}
.vd-tools.sm .vd-tool{min-height:42px;font-size:.92rem;min-width:100px;border-width:1.5px}
.vd-markinfo{margin:4px 0 8px;padding:10px 12px;border-radius:12px;background:#fff0f2;color:#8a1c2c;font-size:.92rem;line-height:1.45}
.vd-hint kbd{font:600 .85em ui-monospace,Menlo,monospace;background:var(--ck-lav);border-radius:5px;padding:1px 6px}
.vd-hint{font-size:.9rem;color:var(--ck-slate);line-height:1.5;margin:4px 0 0}

/* tabs and panels */
.vd-tabs{display:flex;gap:6px;background:var(--ck-lav);padding:5px;border-radius:16px}
.vd-tabs [role=tab]{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;border:0;border-radius:12px;background:transparent;color:var(--ck-purple);font:600 1rem var(--font);cursor:pointer}
.vd-tabs [aria-selected=true]{background:#fff;box-shadow:0 1px 4px #3d2b9630}
.vd-panel{padding:16px 2px 0}
.vd-capacts{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.vd-sync{display:inline-flex;align-items:center;gap:6px;margin-left:auto}
.vd-sync .lbl,.vd-step .lbl{font-size:.88rem;color:var(--ck-slate);font-weight:500}
.vd-empty{color:var(--ck-slate)}
.vd-caplist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;max-height:min(52vh,560px);overflow-y:auto;position:relative;overscroll-behavior:contain}
.vd-row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:6px;padding:5px;border-radius:12px;border:2px solid transparent;background:#f7f6fc}
.vd-row.on{border-color:var(--ck-purple);background:#fff}
.vd-row.gone{opacity:.55}
.vd-tm{font:600 .82rem var(--font);font-variant-numeric:tabular-nums;color:var(--ck-purple);background:#fff;border:1px solid #3d2b9633;border-radius:8px;padding:0 4px;min-height:38px;width:58px;cursor:pointer}
.vd-row .vd-txt{font:500 1rem var(--font);color:var(--ck-ink);border:2px solid transparent;background:transparent;border-radius:8px;padding:7px 8px;min-height:40px;min-width:0;width:100%;box-sizing:border-box}
.vd-row .vd-txt:hover{border-color:#3d2b9622}
.vd-row .vd-txt:focus{outline:none;border-color:var(--ck-purple);background:#fff}
.vd-more{width:40px;height:40px;border-radius:10px;border:0;background:transparent;color:var(--ck-purple);cursor:pointer;display:flex;align-items:center;justify-content:center}
.vd-more:hover,.vd-more[aria-expanded=true]{background:var(--ck-lav)}
.vd-rowtools{grid-column:1 / -1;padding:6px 4px 4px}
.vd-timing{display:flex;flex-wrap:wrap;gap:8px 16px}
.vd-step{display:inline-flex;align-items:center;gap:5px}
.vd-step .vd-ib{font-size:1.15rem}
.vd-split-lbl{font-size:.88rem;color:var(--ck-slate);margin:10px 0 4px}
.vd-words{display:flex;flex-wrap:wrap;gap:6px}
.vd-word{font:500 .92rem var(--font);border:1px dashed var(--ck-purple);border-radius:8px;background:#fff;color:var(--ck-purple);padding:5px 10px;min-height:36px;cursor:pointer}
.vd-word:hover{background:var(--ck-lav)}
.vd-rowacts{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}

/* question panel */
.vd-qlist{list-style:none;margin:0 0 12px;padding:0;display:flex;flex-direction:column;gap:6px}
.vd-qpick{display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;text-align:left;padding:9px 12px;border-radius:12px;border:2px solid transparent;background:#f7f6fc;cursor:pointer;font:500 1rem var(--font);color:var(--ck-ink)}
.vd-qpick .tx{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.vd-qpick .tm{font-size:.82rem;font-weight:600;color:var(--ck-purple)}
.vd-qitem.on .vd-qpick{border-color:var(--ck-purple);background:#fff}
.vd-qedit{border-top:2px solid var(--ck-lav);padding-top:14px}
.vd-fld textarea{font:600 1.05rem/1.4 var(--font);color:var(--ck-ink);background:#fff;border:2px solid #3d2b9640;border-radius:12px;padding:10px 14px;box-sizing:border-box;width:100%;resize:vertical;min-height:84px}
.vd-fld textarea:focus{outline:3px solid #3d2b9640;border-color:var(--ck-purple)}
.lbl-like{font-weight:600;font-size:.98rem;color:var(--ck-ink)}
.vd-qwhen{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.vd-qtimes{font-weight:600;color:var(--ck-purple);flex-basis:100%}
.vd-wraps{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.vd-wraps label{cursor:pointer}
.vd-wraps input,.vd-seg input{position:absolute;opacity:0;width:1px;height:1px}
.vd-wraps span{display:flex;flex-direction:column;gap:2px;padding:10px 8px;border:2px solid #3d2b9630;border-radius:14px;text-align:center;height:100%;box-sizing:border-box;color:var(--ck-ink)}
.vd-wraps strong{font-size:.95rem}
.vd-wraps small{font-size:.78rem;color:var(--ck-slate);line-height:1.35}
.vd-wraps input:checked + span,.vd-seg input:checked + span{border-color:var(--ck-purple);background:var(--ck-lav)}
.vd-wraps input:focus-visible + span,.vd-seg input:focus-visible + span{outline:3px solid var(--focus);outline-offset:2px}
.vd-seg{display:flex;gap:8px}
.vd-seg label{cursor:pointer}
.vd-seg > label > span{display:flex;align-items:center;justify-content:center;width:56px;height:46px;border:2px solid #3d2b9630;border-radius:12px;color:var(--ck-purple);box-sizing:border-box}
.vd-qplace{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}
.vd-sw.none span:not(.sr-only){background:linear-gradient(135deg,#fff 45%,#d02e72 45% 55%,#fff 55%)!important}

/* style panel */
.vd-fs{border:0;padding:0;margin:0 0 16px}
.vd-fs legend{margin-bottom:8px;padding:0}
.vd-looks{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.vd-looks label{cursor:pointer}
.vd-looks input,.vd-sw input{position:absolute;opacity:0;width:1px;height:1px}
.vd-looks span{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 6px;border:2px solid #3d2b9630;border-radius:14px;font-size:.86rem;font-weight:500;color:var(--ck-ink);text-align:center;height:100%;box-sizing:border-box}
.vd-looks input:checked + span{border-color:var(--ck-purple);background:var(--ck-lav)}
.vd-looks input:focus-visible + span,.vd-sw input:focus-visible + span{outline:3px solid var(--focus);outline-offset:2px}
.lk{--hl:#412a9c;display:inline-block;font:700 1rem Poppins,sans-serif;padding:3px 9px;border-radius:7px;background:#14112a;color:#fff}
.lk.box{background:var(--hl);box-shadow:0 0 0 4px #14112a}
.lk.colour{color:var(--hl);text-shadow:-1px -1px 0 #fff,1px -1px 0 #fff,-1px 1px 0 #fff,1px 1px 0 #fff}
.vd-swatches{display:flex;gap:10px;flex-wrap:wrap}
.vd-sw{position:relative;cursor:pointer}
.vd-sw span:not(.sr-only){display:block;width:40px;height:40px;border-radius:50%;box-shadow:inset 0 0 0 2px #0002}
.vd-sw input:checked + span{box-shadow:0 0 0 3px #fff,0 0 0 6px var(--ck-ink)}
.vd-check{display:flex;align-items:center;gap:10px;font-weight:500;color:var(--ck-ink);margin:0 0 12px;cursor:pointer;min-height:36px}
.vd-check input{width:22px;height:22px;accent-color:var(--ck-purple)}

/* ---------------------------------------------------------------- saving */
.vd-modal{position:fixed;inset:0;z-index:1000;background:#14112acc;display:flex;align-items:center;justify-content:center;padding:16px}
.vd-modal[hidden]{display:none}
.vd-modalbox{background:#fff;border-radius:28px;padding:28px 26px;max-width:480px;width:100%;box-sizing:border-box;text-align:center;max-height:calc(100vh - 32px);overflow-y:auto}
.vd-progress{height:14px;border-radius:7px;background:var(--ck-lav);overflow:hidden;margin:18px 0 6px}
.vd-progress div{height:100%;width:0;background:linear-gradient(90deg,var(--ck-purple),var(--ck-pink));transition:width .2s}
.vd-pct{font-weight:700;color:var(--ck-purple);font-variant-numeric:tabular-nums;margin:0 0 16px}
.vd-outvid{display:block;width:100%;max-height:46vh;border-radius:14px;background:#000;margin:10px 0 12px}
.vd-ios{font-size:.98rem;margin:0 0 12px}
.vd-doneacts{display:flex;flex-direction:column;gap:10px}
.vd-doneacts .ck-btn{width:100%}
body.vd-modal-open{overflow:hidden}
body.vd-modal-open .ck-a11yfab,body.vd-modal-open .ck-top{display:none}

/* quality choice */
.vd-quality{text-align:left;margin:14px 0 10px}
.vd-quality legend{margin-bottom:8px}
.vd-quality label{display:block;cursor:pointer;margin:0 0 8px}
.vd-quality input{position:absolute;opacity:0;width:1px;height:1px}
.vd-quality span{display:flex;flex-wrap:wrap;align-items:center;gap:2px 8px;padding:12px 14px 12px 44px;border:2px solid #3d2b9630;border-radius:14px;position:relative;color:var(--ck-ink)}
.vd-quality span::before{content:"";position:absolute;left:14px;top:15px;width:18px;height:18px;border-radius:50%;border:2px solid var(--ck-purple);box-sizing:border-box;background:#fff}
.vd-quality input:checked + span{border-color:var(--ck-purple);background:var(--ck-lav)}
.vd-quality input:checked + span::before{background:radial-gradient(var(--ck-purple) 0 4px,#fff 5px)}
.vd-quality input:focus-visible + span{outline:3px solid var(--focus);outline-offset:2px}
.vd-quality strong{font-size:1.05rem}
.vd-quality .vd-rec{font-size:.75rem;font-weight:700;background:#0a7a5c;color:#fff;border-radius:6px;padding:1px 7px}
.vd-quality em{flex-basis:100%;font-style:normal;font-weight:600;font-size:.88rem;color:var(--ck-purple)}
.vd-quality small{flex-basis:100%;font-size:.86rem;color:var(--ck-slate);line-height:1.45}

/* ---------------------------------------------------------------- sizes */
@media (min-width:960px){
  .vd-ed{padding-top:18px}
  .vd-layout{grid-template-columns:minmax(0,1.25fr) minmax(340px,1fr);align-items:start;gap:24px}
  .vd-right{background:#fff;border-radius:22px;padding:14px;box-shadow:0 6px 24px #3d2b961a;position:sticky;top:12px}
  .vd-caplist{max-height:calc(100vh - 290px)}
}
@media (max-width:520px){
  .vd-card{padding:26px 20px 22px;border-radius:26px;margin-top:20px}
  .vd-ed{padding:10px 12px 0}
  .vd-ib span{display:none}
  .vd-save{padding:8px 14px}
  .vd-stagewrap{padding:6px;border-radius:16px}
  .vd-tool{min-width:0;padding:0 8px;font-size:.95rem}
  .vd-looks span{font-size:.8rem}
  .vd-sync .lbl{display:none}
  .vd-tabs [role=tab]{gap:5px;font-size:.92rem}
  .vd-tabs [role=tab] svg{width:18px;height:18px}
  .vd-wraps small{display:none}
}
/* the floating accessibility button would sit on the editor's buttons; keep it out of the way */
.vd-app .vd-ed{padding-bottom:84px}