/* Course Builder: editor chrome (library, panels, dialogs). Learner-facing styles live in runtime.css.
   v2 — calm, solid, Apple-inspired: neutral surfaces, segmented controls, 32px controls, 8–10px radii,
   dark-blue tinted shadows, labels that truncate instead of wrapping. Previous version: builder/_v1/editor.css */
img{max-width:100%}
[hidden]:not([hidden=until-found i]){display:none!important}
:root{
  --e-bg:#F2F4F6;--e-panel:#FFFFFF;--e-sunk:#F7F8FA;--e-fill:rgba(37,55,70,.06);--e-fill2:rgba(37,55,70,.10);
  --e-ink:#1D2A35;--e-muted:#55636F;--e-faint:#667582;--e-line:rgba(37,55,70,.10);--e-line2:rgba(37,55,70,.18);
  --e-accent:#007096;--e-accent-hover:#005C7C;--e-accent-ink:#FFFFFF;--e-accent-soft:#E7F3F8;--e-accent-text:#005C7C;--e-hl:#EADA24;
  --e-danger:#B42318;--e-danger-soft:#FDEEEC;--e-ok:#17785A;--e-ok-soft:#E5F4EE;--e-warn:#7A5A00;--e-warn-soft:#FBF4D2;
  --e-shadow-xs:0 1px 1px rgba(37,55,70,.05);
  --e-shadow-sm:0 1px 2px rgba(37,55,70,.08),0 0 0 .5px rgba(37,55,70,.06);
  --e-shadow:0 1px 2px rgba(37,55,70,.05),0 8px 24px rgba(37,55,70,.08);
  --e-shadow-lg:0 2px 6px rgba(37,55,70,.08),0 24px 64px rgba(37,55,70,.20);
  --e-ring:0 0 0 3px rgba(0,163,224,.35);
  --e-ease:cubic-bezier(.2,.7,.2,1);
  --e-top:56px;--e-rail:64px;--e-pw:340px;
  --e-font:'Figtree',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --e-bg:#0F1419;--e-panel:#171E25;--e-sunk:#131920;--e-fill:rgba(255,255,255,.06);--e-fill2:rgba(255,255,255,.10);
  --e-ink:#E6ECF1;--e-muted:#A4B1BC;--e-faint:#8D9AA6;--e-line:rgba(255,255,255,.08);--e-line2:rgba(255,255,255,.14);
  --e-accent:#3BB6E8;--e-accent-hover:#62C6EE;--e-accent-ink:#0B1419;--e-accent-soft:#15303D;--e-accent-text:#6CCBF0;
  --e-danger:#F07A6E;--e-danger-soft:#3A1E1C;--e-ok:#5CC39C;--e-ok-soft:#15302A;--e-warn:#E8D56A;--e-warn-soft:#332E14;
  --e-shadow-sm:0 1px 2px rgba(0,0,0,.4),0 0 0 .5px rgba(255,255,255,.06);--e-shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.35);--e-shadow-lg:0 24px 64px rgba(0,0,0,.5);color-scheme:dark}}
:root[data-theme="dark"]{
  --e-bg:#0F1419;--e-panel:#171E25;--e-sunk:#131920;--e-fill:rgba(255,255,255,.06);--e-fill2:rgba(255,255,255,.10);
  --e-ink:#E6ECF1;--e-muted:#A4B1BC;--e-faint:#8D9AA6;--e-line:rgba(255,255,255,.08);--e-line2:rgba(255,255,255,.14);
  --e-accent:#3BB6E8;--e-accent-hover:#62C6EE;--e-accent-ink:#0B1419;--e-accent-soft:#15303D;--e-accent-text:#6CCBF0;
  --e-danger:#F07A6E;--e-danger-soft:#3A1E1C;--e-ok:#5CC39C;--e-ok-soft:#15302A;--e-warn:#E8D56A;--e-warn-soft:#332E14;
  --e-shadow-sm:0 1px 2px rgba(0,0,0,.4),0 0 0 .5px rgba(255,255,255,.06);--e-shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.35);--e-shadow-lg:0 24px 64px rgba(0,0,0,.5);color-scheme:dark}

html,body{height:100%}
body{background:var(--e-bg);color:var(--e-ink);font-family:var(--e-font);font-size:13.5px;line-height:1.45;margin:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
*{box-sizing:border-box}
button,input,select,textarea{font:inherit;color:inherit}
button{-webkit-tap-highlight-color:transparent}
:focus-visible{outline:none;box-shadow:var(--e-ring)}
.e-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.e-ico{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}

/* ---------- top bar ---------- */
.e-app{display:grid;grid-template-rows:var(--e-top) 1fr;height:100%;min-height:0}
.e-top{height:var(--e-top);display:flex;align-items:center;gap:8px;padding:0 12px 0 14px;background:var(--e-panel);border-bottom:1px solid var(--e-line);position:sticky;top:0;z-index:20;flex-wrap:nowrap;min-width:0}
.e-mark{width:28px;height:28px;border-radius:7px;background:#253746;display:grid;place-items:center;flex:0 0 auto;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.e-mark i{width:12px;height:12px;border:2.5px solid #EADA24;border-radius:50%;display:block}
.e-name{display:flex;flex-direction:column;justify-content:center;min-width:0;flex:1 1 auto;margin-left:2px;line-height:1.25}
.e-name b{font-size:14px;font-weight:700;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.e-name span{font-size:12px;color:var(--e-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.e-name span:empty{display:none}
.e-status{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;height:26px;padding:0 10px;border-radius:99px;background:var(--e-fill);color:var(--e-muted);white-space:nowrap;flex:0 0 auto}
.e-status::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.8}
.e-status.dirty{background:var(--e-warn-soft);color:var(--e-warn)}
.e-status.ok{background:var(--e-ok-soft);color:var(--e-ok)}
.e-status.err{background:var(--e-danger-soft);color:var(--e-danger)}
.e-sep{width:1px;height:20px;background:var(--e-line2);flex:0 0 auto;margin:0 2px}
.e-group{display:inline-flex;align-items:center;gap:2px;flex:0 0 auto}
.e-top > .e-btn{flex:0 0 auto}

/* ---------- buttons ---------- */
.e-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:32px;padding:0 12px;border:1px solid var(--e-line2);background:var(--e-panel);border-radius:8px;cursor:pointer;font-weight:600;font-size:13px;letter-spacing:-.005em;white-space:nowrap;min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;box-shadow:var(--e-shadow-xs);transition:background .15s var(--e-ease),border-color .15s var(--e-ease),color .15s var(--e-ease),box-shadow .15s var(--e-ease)}
.e-btn .lbl{overflow:hidden;text-overflow:ellipsis}
.e-btn:hover:not([disabled]){background:var(--e-sunk);border-color:rgba(37,55,70,.26)}
.e-btn:active:not([disabled]){transform:translateY(1px)}
.e-btn[disabled]{opacity:.4;cursor:not-allowed;box-shadow:none}
.e-btn.primary{background:var(--e-accent);color:var(--e-accent-ink);border-color:transparent;box-shadow:0 1px 2px rgba(0,80,110,.25)}
.e-btn.primary:hover:not([disabled]){background:var(--e-accent-hover);border-color:transparent;color:var(--e-accent-ink)}
.e-btn.ghost{border-color:transparent;background:transparent;box-shadow:none}
.e-btn.ghost:hover:not([disabled]){background:var(--e-fill);border-color:transparent}
.e-btn.danger{color:var(--e-danger)}
.e-btn.danger:hover:not([disabled]){background:var(--e-danger-soft);border-color:transparent}
.e-btn.sm{height:28px;padding:0 10px;font-size:12.5px;border-radius:7px;gap:5px}
.e-btn.sm .e-ico{width:14px;height:14px}
.e-icbtn{border:0;background:none;border-radius:6px;padding:0;cursor:pointer;color:var(--e-muted);display:grid;place-items:center;width:28px;height:28px;flex:0 0 auto;transition:background .15s var(--e-ease),color .15s var(--e-ease)}
.e-icbtn .e-ico{width:15px;height:15px}
.e-icbtn:hover:not([disabled]){background:var(--e-fill2);color:var(--e-ink)}
.e-icbtn[disabled]{opacity:.3;cursor:not-allowed}

/* ---------- body: icon rail + one panel + canvas (everything on one side) ---------- */
.e-body{display:grid;grid-template-columns:var(--e-rail) auto minmax(0,1fr);min-height:0;height:calc(100vh - var(--e-top))}
.e-rail{display:flex;flex-direction:column;align-items:stretch;gap:2px;padding:8px 6px;background:var(--e-panel);border-right:1px solid var(--e-line);min-height:0;overflow:auto}
.e-rail button{border:0;background:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;height:56px;border-radius:9px;color:var(--e-muted);font-size:12px;font-weight:600;cursor:pointer;position:relative;padding:0 2px;min-width:0;transition:background .15s var(--e-ease),color .15s var(--e-ease)}
.e-rail button .e-ico{width:20px;height:20px;stroke-width:1.7}
.e-rail button span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.e-rail button:hover{background:var(--e-fill);color:var(--e-ink)}
.e-rail button[aria-pressed="true"]{background:var(--e-accent-soft);color:var(--e-accent-text)}
.e-rail button.has::after{content:"";position:absolute;top:8px;right:calc(50% - 17px);width:7px;height:7px;border-radius:50%;background:var(--e-hl);box-shadow:0 0 0 2px var(--e-panel)}
.e-panel{width:var(--e-pw);background:var(--e-panel);border-right:1px solid var(--e-line);min-height:0;min-width:0;display:flex;flex-direction:column;animation:e-panel .18s var(--e-ease)}
.e-panel[hidden]{display:none!important}
@keyframes e-panel{from{opacity:0;transform:translateX(-6px)}to{opacity:1;transform:none}}
.e-psub{flex:1;min-width:0;font-size:12px;color:var(--e-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#ePanelClose{margin-left:auto}
.e-grabber,.e-dscrim{display:none}
.e-lnav{display:flex;align-items:center;gap:2px;flex:1;min-width:0}
.e-lnav .e-icbtn{width:28px;height:28px}
.e-lessonpick{flex:0 1 auto;min-width:0;display:flex;align-items:center;gap:8px;border:0;background:none;padding:0 8px 0 4px;height:32px;border-radius:8px;cursor:pointer;text-align:left;color:inherit;transition:background .15s var(--e-ease)}
.e-lessonpick:hover{background:var(--e-fill)}
.e-lessonpick .no{flex:0 0 22px;height:22px;border-radius:50%;background:var(--e-accent);color:var(--e-accent-ink);display:grid;place-items:center;font-size:12px;font-weight:700;font-variant-numeric:tabular-nums}
.e-lessonpick .no:empty{display:none}
.e-lessonpick .chev{color:var(--e-faint)}
.e-center{grid-column:3}.e-rail{grid-column:1}.e-panel{grid-column:2}
/* left tabs = segmented control */
.e-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px;margin:12px 12px 4px;padding:2px;background:var(--e-fill);border-radius:9px;flex:0 0 auto}
.e-tabs button{border:0;background:transparent;height:28px;padding:0 2px;border-radius:7px;font-weight:600;font-size:12px;letter-spacing:-.005em;color:var(--e-muted);cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:background .15s var(--e-ease),color .15s var(--e-ease)}
.e-tabs button:hover{color:var(--e-ink)}
.e-tabs button[aria-selected="true"]{background:var(--e-panel);color:var(--e-ink);box-shadow:var(--e-shadow-sm)}
.e-phead{display:flex;align-items:center;gap:8px;height:48px;padding:0 8px 0 16px;border-bottom:1px solid var(--e-line);flex:0 0 auto;position:relative}
.e-phead b{font-size:13px;font-weight:700;letter-spacing:-.005em}
.e-scroll{overflow:auto;min-height:0;flex:1;padding:12px 14px 28px;scrollbar-gutter:stable}
.e-h{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--e-faint);margin:20px 2px 8px}
.e-h:first-child{margin-top:4px}

/* lesson outline */
.e-outline{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1px}
.e-outline .grp{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--e-faint);margin:14px 8px 4px}
.e-outline .grp:first-child{margin-top:4px}
.e-les{position:relative;border-radius:8px}
.e-les .pick{width:100%;min-width:0;text-align:left;border:0;background:none;border-radius:8px;padding:7px 8px;cursor:pointer;display:flex;gap:10px;align-items:center;transition:background .15s var(--e-ease)}
.e-les:hover .pick{background:var(--e-fill)}
.e-les.cur .pick{background:var(--e-accent-soft)}
.e-les .pick .no{flex:0 0 22px;height:22px;border-radius:50%;background:var(--e-fill);display:grid;place-items:center;font-size:12px;font-weight:700;color:var(--e-muted);font-variant-numeric:tabular-nums}
.e-les.cur .pick .no{background:var(--e-accent);color:var(--e-accent-ink)}
.e-les .pick .tt{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:500;font-size:13.5px}
.e-les.cur .pick .tt{font-weight:700;color:var(--e-accent-text)}
.e-les .acts{position:absolute;right:4px;top:50%;transform:translateY(-50%);display:none;gap:0;background:var(--e-panel);border-radius:8px;padding:2px;box-shadow:var(--e-shadow-sm)}
.e-les:hover .acts,.e-les:focus-within .acts{display:flex}
.e-les .acts .e-icbtn{width:26px;height:26px}
#eAddLesson{border-style:dashed;box-shadow:none;height:36px;color:var(--e-accent-text)}

/* ---------- canvas ---------- */
.e-center{min-height:0;min-width:0;display:flex;flex-direction:column;background:var(--e-bg)}
.e-canvasbar{display:flex;align-items:center;gap:12px;height:48px;padding:0 16px 0 20px;border-bottom:1px solid var(--e-line);background:var(--e-panel);flex:0 0 auto;min-width:0}
.e-canvasbar .ttl{font-weight:700;font-size:13.5px;letter-spacing:-.005em;flex:0 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.e-seg{display:inline-flex;gap:2px;padding:2px;background:var(--e-fill);border-radius:8px;flex:0 0 auto;min-width:0}
.e-seg button{border:0;background:transparent;height:26px;padding:0 11px;border-radius:6px;cursor:pointer;font-weight:600;font-size:12px;color:var(--e-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:background .15s var(--e-ease),color .15s var(--e-ease)}
.e-seg button:hover{color:var(--e-ink)}
.e-seg button[aria-pressed="true"]{background:var(--e-panel);color:var(--e-ink);box-shadow:var(--e-shadow-sm)}
.e-canvas{flex:1;overflow:auto;padding:36px 28px 96px}
.e-page{margin:0 auto;max-width:880px;transition:max-width .3s var(--e-ease)}
.e-page.tablet{max-width:720px}.e-page.phone{max-width:390px}
#stage{display:block;border-radius:10px;overflow:hidden;box-shadow:var(--e-shadow);outline:1px solid var(--e-line)}

/* ---------- inspector & forms ---------- */
.e-field{margin:0 0 14px;min-width:0}
.e-field > label,.e-lbl{display:block;font-weight:600;font-size:12px;margin-bottom:6px;color:var(--e-ink)}
.e-help{font-size:12px;line-height:1.45;color:var(--e-muted);margin-top:5px}
.e-in,.e-sel,.e-ta{width:100%;min-width:0;border:1px solid var(--e-line2);border-radius:8px;padding:0 10px;background:var(--e-panel);height:34px;font-size:13px;transition:border-color .15s var(--e-ease),box-shadow .15s var(--e-ease)}
.e-ta{height:auto;min-height:76px;padding:8px 10px;resize:vertical;line-height:1.45}
.e-sel{appearance:none;-webkit-appearance:none;padding-right:30px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2355636F' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;text-overflow:ellipsis}
.e-in:hover,.e-sel:hover,.e-ta:hover{border-color:rgba(37,55,70,.28)}
.e-in:focus,.e-sel:focus,.e-ta:focus,.e-rich:focus{outline:none;border-color:var(--e-accent);box-shadow:var(--e-ring)}
.e-in[type=number]{font-variant-numeric:tabular-nums}
.e-in,.e-ta,.e-rich{unicode-bidi:plaintext}
.e-rich{border:1px solid var(--e-line2);border-radius:0 0 8px 8px;padding:9px 10px;min-height:68px;background:var(--e-panel);overflow-wrap:anywhere;font-size:13px;line-height:1.5}
.e-rich p{margin:0 0 .5em}.e-rich ul{margin:0 0 .5em;padding-left:1.2em}
.e-rich mark{background:#EADA24;color:#253746}
.e-richbar{display:flex;gap:1px;border:1px solid var(--e-line2);border-bottom:0;border-radius:8px 8px 0 0;background:var(--e-sunk);padding:3px}
.e-richbar button{border:0;background:none;border-radius:5px;width:28px;height:26px;cursor:pointer;color:var(--e-muted);display:grid;place-items:center}
.e-richbar button .e-ico{width:15px;height:15px}
.e-rb-sep{width:1px;align-self:stretch;margin:4px 3px;background:var(--e-line2)}
.e-richbar button:hover{background:var(--e-fill2);color:var(--e-ink)}
.e-row{display:flex;gap:8px;align-items:center;min-width:0}
.e-row > *{flex:1;min-width:0}
.e-row > .e-btn{justify-content:center}
.e-row:has(> [data-bulk]){flex-direction:column;align-items:stretch;gap:6px}
.e-check{display:flex;gap:9px;align-items:flex-start;font-weight:500;font-size:13px;cursor:pointer;line-height:1.4}
.e-check input{margin:2px 0 0;width:16px;height:16px;accent-color:var(--e-accent);flex:0 0 auto}
.e-items{display:flex;flex-direction:column;gap:8px}
.e-item{border:1px solid var(--e-line);border-radius:10px;background:var(--e-sunk);padding:8px 10px 2px;min-width:0}
details.e-item{padding-bottom:0}
details.e-item[open]{padding-bottom:2px}
.e-item-h{display:flex;align-items:center;gap:4px;margin-bottom:8px;min-height:28px;min-width:0}
details.e-item:not([open]) > .e-item-h{margin-bottom:8px}
summary.e-item-h::-webkit-details-marker{display:none}
summary.e-item-h::before{content:"";width:6px;height:6px;border-right:1.8px solid var(--e-faint);border-bottom:1.8px solid var(--e-faint);transform:rotate(-45deg);margin:0 6px 0 2px;flex:0 0 auto;transition:transform .15s var(--e-ease)}
details[open] > summary.e-item-h::before{transform:rotate(45deg)}
.e-item-h b{flex:1;min-width:0;font-size:12.5px;font-weight:600;color:var(--e-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.e-item-h > span{opacity:.7;transition:opacity .15s var(--e-ease)}
.e-item:hover .e-item-h > span,.e-item-h:focus-within > span{opacity:1}
.e-item .e-icbtn{width:24px;height:24px}
.e-item .e-icbtn .e-ico{width:14px;height:14px}
.e-items > .e-row .e-icbtn{width:26px;height:26px}
.e-img{display:flex;gap:12px;align-items:center;min-width:0}
.e-img img,.e-img .ph{width:88px;height:64px;object-fit:cover;border-radius:8px;border:1px solid var(--e-line);background:var(--e-sunk);flex:0 0 auto}
.e-img .ph{display:grid;place-items:center;font-size:12px;color:var(--e-faint);text-align:center;padding:4px}
.e-img .bts{display:flex;flex-direction:column;gap:5px;align-items:stretch;min-width:0;flex:1}
.e-img .bts .e-btn{justify-content:flex-start}
.e-warnline{font-size:12px;color:var(--e-warn);background:var(--e-warn-soft);border-radius:7px;padding:6px 9px;margin-top:6px}
.e-empty{color:var(--e-muted);text-align:center;padding:32px 12px}
.e-empty b{display:block;color:var(--e-ink);font-size:15px;margin-bottom:6px}
.e-typechip{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--e-accent-text);background:var(--e-accent-soft);border-radius:99px;height:24px;padding:0 10px;margin:2px 0 10px}
.e-typechip .e-ico{width:13px;height:13px}
.e-swatches{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.e-sw{display:flex;align-items:center;gap:8px;border:1px solid var(--e-line);border-radius:8px;padding:6px 8px;min-width:0;background:var(--e-panel);cursor:pointer}
.e-sw:hover{border-color:var(--e-line2)}
.e-color{width:32px;height:32px;border:1px solid var(--e-line2);padding:2px;background:var(--e-panel);cursor:pointer;flex:0 0 auto;border-radius:8px;overflow:hidden}
.e-color::-webkit-color-swatch-wrapper{padding:0}.e-color::-webkit-color-swatch{border:0;border-radius:5px}
.e-sw input[type=color]{width:26px;height:26px;border:0;padding:0;background:none;cursor:pointer;flex:0 0 auto;border-radius:6px;overflow:hidden}
.e-sw input[type=color]::-webkit-color-swatch-wrapper{padding:0}
.e-sw input[type=color]::-webkit-color-swatch{border:1px solid rgba(0,0,0,.12);border-radius:6px}
.e-sw span{font-size:12px;font-weight:600;line-height:1.25;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.e-sw small{display:block;color:var(--e-faint);font-weight:500;font-variant-numeric:tabular-nums;font-size:12px}
.e-presets{display:grid;gap:6px}
.e-preset{display:flex;align-items:center;gap:10px;border:1px solid var(--e-line2);border-radius:10px;padding:9px 11px;background:var(--e-panel);cursor:pointer;text-align:left;min-width:0;transition:border-color .15s var(--e-ease),box-shadow .15s var(--e-ease)}
.e-preset:hover{border-color:rgba(37,55,70,.28)}
.e-preset[aria-pressed="true"]{border-color:var(--e-accent);box-shadow:inset 0 0 0 1px var(--e-accent)}
.e-preset > span:last-child{min-width:0}
.e-preset .dots{display:flex;gap:0;flex:0 0 auto}.e-preset .dots i{width:14px;height:14px;border-radius:50%;display:block;border:2px solid var(--e-panel);margin-left:-4px}.e-preset .dots i:first-child{margin-left:0}
.e-preset b{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.e-preset small{display:block;color:var(--e-muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.e-contrast{display:flex;flex-direction:column;gap:3px;margin-top:8px}
.e-contrast div{display:flex;justify-content:space-between;gap:8px;font-size:12px;padding:5px 9px;border-radius:7px;background:var(--e-sunk)}
.e-contrast span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.e-contrast .bad{background:var(--e-danger-soft);color:var(--e-danger);font-weight:600}
.e-contrast b{font-variant-numeric:tabular-nums;flex:0 0 auto}
.e-note{font-size:12.5px;line-height:1.5;background:var(--e-sunk);border:1px solid var(--e-line);border-radius:10px;padding:10px 12px;color:var(--e-muted)}
.e-note b{color:var(--e-ink)}
input[type=range]{accent-color:var(--e-accent)}

/* design style picker (Theme tab) */
.e-styles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.e-style{display:flex;flex-direction:column;border:1px solid var(--e-line2);border-radius:10px;background:var(--e-panel);padding:0;overflow:hidden;cursor:pointer;text-align:left;min-width:0;transition:border-color .15s var(--e-ease),box-shadow .15s var(--e-ease),transform .15s var(--e-ease)}
.e-style:hover{border-color:rgba(37,55,70,.3);transform:translateY(-1px)}
.e-style[aria-pressed="true"]{border-color:var(--e-accent);box-shadow:inset 0 0 0 1px var(--e-accent),0 0 0 3px rgba(0,163,224,.16)}
.e-style-t{display:block;padding:7px 9px 9px;min-width:0}
.e-style-t b{display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;min-width:0}
.e-style-t b span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.e-style-t em{font-style:normal;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;background:#1D2A35;color:#fff;border-radius:99px;padding:1px 6px;flex:0 0 auto}
.e-style-t small{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:12px;line-height:1.35;color:var(--e-muted);margin-top:2px}
.st-th{display:flex;flex-direction:column;height:66px;border-bottom:1px solid var(--e-line);overflow:hidden}
.st-bar{height:8px;flex:0 0 auto;display:block}
.st-body{flex:1;display:flex;gap:5px;padding:6px;min-height:0}
.st-side{width:14px;flex:0 0 auto;display:block}
.st-main{flex:1;display:flex;flex-direction:column;gap:5px;min-width:0}
.st-h{height:5px;border-radius:2px;display:block;flex:0 0 auto}
.st-cards{display:flex;gap:4px;flex:1;position:relative;min-height:0}
.st-cards i{flex:1;display:block}
.st-cn{position:absolute;top:-2px;left:-2px;width:7px;height:7px;border-top:1.5px solid;border-left:1.5px solid}
.st-btn{height:6px;width:36%;display:block;flex:0 0 auto}

/* ---------- popovers & dialogs ---------- */
.e-pop{position:fixed;z-index:60;background:var(--e-panel);border:1px solid var(--e-line);border-radius:12px;box-shadow:var(--e-shadow-lg);padding:12px;width:min(580px,calc(100vw - 24px));max-height:min(640px,calc(100vh - 40px));overflow:auto;animation:e-in .18s var(--e-ease)}
.e-pop h3{margin:2px 4px 8px;font-size:14px;letter-spacing:-.01em}
.e-lib{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}
.e-lib button{display:flex;gap:10px;align-items:flex-start;text-align:left;border:0;background:transparent;border-radius:9px;padding:8px 9px;cursor:pointer;min-width:0;transition:background .12s var(--e-ease)}
.e-lib button > span:last-child{min-width:0}
.e-lib button:hover{background:var(--e-fill)}
.e-lib button:focus-visible{background:var(--e-accent-soft)}
.e-lib .gi{width:32px;height:32px;border-radius:8px;background:var(--e-accent-soft);display:grid;place-items:center;flex:0 0 auto;color:var(--e-accent-text)}
.e-lib b{display:block;font-size:13px;font-weight:600}.e-lib small{color:var(--e-muted);font-size:12px;line-height:1.35;display:block}
.e-lib-cat{grid-column:1/-1;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--e-faint);margin:10px 9px 2px}
.e-lib-cat:first-child{margin-top:2px}
.e-scrim{position:fixed;inset:0;background:rgba(15,22,30,.42);z-index:70;display:grid;place-items:center;padding:16px;animation:e-fade .18s var(--e-ease)}
.e-dialog{background:var(--e-panel);border-radius:14px;box-shadow:var(--e-shadow-lg);width:min(560px,100%);max-height:calc(100vh - 32px);overflow:auto;padding:24px;animation:e-in .2s var(--e-ease)}
.e-dialog h2{margin:0 0 6px;font-size:19px;font-weight:700;letter-spacing:-.015em}
.e-dialog p{margin:0 0 12px;color:var(--e-muted);line-height:1.5}
.e-dialog .foot{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin-top:20px;flex-wrap:wrap}
.e-radio{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--e-line2);border-radius:10px;padding:11px 13px;margin-bottom:8px;cursor:pointer;transition:border-color .15s var(--e-ease),background .15s var(--e-ease)}
.e-radio:hover{border-color:rgba(37,55,70,.28)}
.e-radio:has(input:checked){border-color:var(--e-accent);background:var(--e-accent-soft);box-shadow:inset 0 0 0 1px var(--e-accent)}
.e-radio input{margin-top:3px;accent-color:var(--e-accent)}
.e-radio b{display:block;font-size:13.5px}.e-radio small{color:var(--e-muted);font-size:12.5px;line-height:1.4;display:block;margin-top:1px}
.e-list{margin:6px 0 0;padding-left:18px;color:var(--e-muted)}
.e-list li{margin-bottom:4px}
.e-list .w{color:var(--e-warn)}.e-list .x{color:var(--e-danger)}.e-list .k{color:var(--e-ok)}
.e-toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:#1D2A35;color:#fff;padding:10px 16px;border-radius:12px;z-index:90;box-shadow:var(--e-shadow-lg);font-weight:600;font-size:13px;max-width:calc(100vw - 32px);display:flex;align-items:center;animation:e-up .22s var(--e-ease)}
.e-toast .e-btn{background:transparent;color:#fff;border-color:rgba(255,255,255,.4);box-shadow:none}
.e-toast .e-btn:hover:not([disabled]){color:#fff;border-color:#fff;background:rgba(255,255,255,.1)}
.e-banner{display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:var(--e-warn-soft);color:var(--e-warn);padding:8px 16px;border-bottom:1px solid var(--e-line);font-weight:600;font-size:13px}
.e-banner span{flex:1;min-width:200px}
.e-preview{position:fixed;inset:0;z-index:80;background:var(--e-bg);display:flex;flex-direction:column}
.e-preview .bar{display:flex;align-items:center;gap:12px;height:52px;padding:0 16px;background:#1D2A35;color:#fff;flex:0 0 auto}
.e-preview .bar b{flex:1;font-size:14px}
.e-preview .bar .e-btn{background:transparent;color:#fff;border-color:rgba(255,255,255,.3);box-shadow:none}
.e-preview .bar .e-btn:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.5)}
.e-preview .bar label{display:flex;gap:7px;align-items:center;font-size:13px}
.e-preview .host{flex:1;overflow:auto}
.e-preview .body{flex:1;display:flex;min-height:0}
.e-tracklog{flex:0 0 340px;max-width:40vw;border-left:1px solid var(--e-line);background:var(--e-panel,#fff);display:flex;flex-direction:column;overflow:auto;font-size:12.5px}
.e-tracklog .hd{padding:12px 14px;border-bottom:1px solid var(--e-line);display:flex;flex-direction:column;gap:3px;position:sticky;top:0;background:inherit}
.e-tracklog ol{list-style:none;margin:0;padding:8px 10px}
.e-tracklog li{display:grid;grid-template-columns:44px 1fr;gap:6px 8px;padding:7px 6px;border-bottom:1px solid var(--e-line);color:var(--e-ink);line-height:1.4}
.e-tracklog li .k{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#fff;background:var(--e-muted);border-radius:4px;padding:2px 0;text-align:center;align-self:start;margin-top:1px}
.e-tracklog li.xapi .k{background:var(--e-accent)}
.e-tracklog li details{grid-column:2}.e-tracklog li summary{cursor:pointer;color:var(--e-muted);font-size:12px}
.e-tracklog pre,.e-xsample pre{font:12px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--e-sunk);border:1px solid var(--e-line);border-radius:8px;padding:8px;margin:6px 0 0;white-space:pre-wrap;word-break:break-all;max-height:260px;overflow:auto}
.e-xmap{display:flex;flex-direction:column;gap:10px;max-height:52vh;overflow:auto;padding-right:4px}
.e-xrow{border:1px solid var(--e-line);border-radius:10px;padding:10px 12px;background:var(--e-panel,#fff)}
.e-xrow.sub{margin-top:8px;background:var(--e-sunk)}
.e-xrow.off{border-style:dashed;opacity:.7}.e-xrow.off .e-xlvl{color:var(--e-muted)}
.e-xhead{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}.e-xhead b{font-size:13.5px}
.e-xlvl{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--e-accent)}
.e-xid{font:12px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--e-muted);word-break:break-all;margin:3px 0 4px}
.e-xrow p{margin:0 0 6px;font-size:12.5px;color:var(--e-muted);line-height:1.45}
.e-xrow ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:4px;font-size:12.5px}
.e-xrow li{display:flex;gap:8px;align-items:baseline}.e-xrow li span:last-child{color:var(--e-muted)}
.e-verb{flex:0 0 auto;font:600 12px ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--e-accent-soft,#E6F6FC);color:var(--e-accent);border-radius:4px;padding:2px 6px}
.e-xsample{margin-top:12px}.e-xsample summary{cursor:pointer;font-size:13px;font-weight:600}
@keyframes e-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes e-up{from{opacity:0;transform:translate(-50%,6px)}to{opacity:1;transform:translate(-50%,0)}}
@keyframes e-fade{from{opacity:0}to{opacity:1}}

/* ---------- library (home) ---------- */
.l-app{min-height:100%;background:var(--e-bg)}
.l-app[hidden],.e-app[hidden]{display:none!important}
.l-main{max-width:1180px;margin:0 auto;padding:40px 24px 96px}
.l-main h1{font-size:30px;font-weight:700;letter-spacing:-.025em;margin:0 0 22px}
.l-main h1:focus{box-shadow:none}
.l-muted{color:var(--e-muted);margin:0}
.l-warn{background:var(--e-warn-soft);color:var(--e-warn);border-radius:10px;padding:10px 14px;margin-bottom:16px;font-weight:600}
.l-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.l-bar h2{font-size:12px;margin:0;color:var(--e-faint);text-transform:uppercase;letter-spacing:.07em;font-weight:700}
.l-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:16px}
.l-card{background:var(--e-panel);border-radius:12px;box-shadow:var(--e-shadow-sm);display:flex;flex-direction:column;overflow:hidden;min-width:0;transition:box-shadow .2s var(--e-ease),transform .2s var(--e-ease)}
.l-card:hover{box-shadow:var(--e-shadow);transform:translateY(-2px)}
.l-card[hidden]{display:none}
.l-strip{display:flex;height:6px}.l-strip i{flex:1}
.l-cb{padding:16px 18px 14px;flex:1;min-width:0}
.l-cb h3{margin:6px 0 8px;font-size:17px;font-weight:700;line-height:1.3;letter-spacing:-.015em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.l-cb .l-muted{font-size:12.5px;line-height:1.55}
.l-eye{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--e-accent-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.l-acts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:12px 18px 16px;border-top:1px solid var(--e-line)}
.l-acts .e-btn{width:100%}
.l-empty{background:var(--e-panel);border-radius:16px;box-shadow:var(--e-shadow-sm);padding:48px 28px;text-align:center;max-width:620px;margin:24px auto}
.l-empty h2{margin:16px 0 8px;font-size:22px;letter-spacing:-.02em}.l-empty p{color:var(--e-muted);margin:0 0 20px;line-height:1.55}
.l-row{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.l-ill{display:flex;gap:6px;justify-content:center}.l-ill span{width:44px;height:56px;border-radius:8px;background:var(--e-accent-soft);border:2px solid var(--e-accent)}
.l-ill span:nth-child(2){background:#EADA24;border-color:#253746;transform:translateY(-6px)}
#libSearch{height:34px;border-radius:9px;background:var(--e-panel)}

/* ---------- AI review drawer (ai.js) ---------- */
#eAI[aria-pressed="true"]{border-color:transparent;color:var(--e-accent-text);background:var(--e-accent-soft)}
.ai-drawer{position:fixed;top:var(--e-top);left:var(--e-rail);bottom:0;width:min(460px,calc(100vw - var(--e-rail)));background:var(--e-panel);border-right:1px solid var(--e-line);box-shadow:16px 0 48px rgba(37,55,70,.14);z-index:55;display:flex;flex-direction:column;animation:ai-slide .22s var(--e-ease)}
@keyframes ai-slide{from{opacity:0;transform:translateX(-12px)}to{opacity:1;transform:none}}
.ai-head{display:flex;align-items:center;gap:8px;height:48px;padding:0 10px 0 16px;border-bottom:1px solid var(--e-line);color:var(--e-accent-text);flex:0 0 auto}
.ai-head b{font-size:14px;color:var(--e-ink);letter-spacing:-.01em}
.ai-head .ai-prov{flex:1;min-width:0;font-size:12px;color:var(--e-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ai-body{flex:1;overflow:auto;padding:16px}
.ai-body .e-seg{display:flex}.ai-body .e-seg button{flex:1;min-width:0}
.ai-checks{display:flex;flex-direction:column;gap:8px;margin:0 0 14px}
.ai-prog{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--e-muted);margin:6px 0 10px;font-variant-numeric:tabular-nums}
.ai-bar{height:6px;background:var(--e-fill);border-radius:99px;overflow:hidden;flex:1}
.ai-bar i{display:block;height:100%;background:var(--e-accent);border-radius:99px;transition:width .25s var(--e-ease)}
.ai-err{background:var(--e-danger-soft);color:var(--e-danger);border-radius:10px;padding:10px 12px;margin-top:12px;font-size:12.5px}
.ai-err ul{margin:4px 0 0;padding-left:18px}
.ai-sum{font-size:12.5px;line-height:1.5;background:var(--e-sunk);border:1px solid var(--e-line);border-radius:10px;padding:9px 11px;margin-bottom:6px}
.ai-filter{display:flex;flex-direction:column;gap:10px;margin:14px 0 12px}
.ai-issue{border:1px solid var(--e-line);border-radius:10px;padding:12px;margin-bottom:10px;background:var(--e-panel);box-shadow:var(--e-shadow-xs)}
.ai-issue.done{opacity:.55}
.ai-issue-h{display:flex;align-items:center;gap:6px;margin-bottom:8px;min-width:0}
.ai-sev{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;height:20px;display:inline-flex;align-items:center;padding:0 8px;border-radius:99px;background:var(--e-fill);color:var(--e-muted);flex:0 0 auto}
.ai-sev.critical,.ai-sev.error{background:var(--e-danger-soft);color:var(--e-danger)}
.ai-sev.major,.ai-sev.warning{background:var(--e-warn-soft);color:var(--e-warn)}
.ai-sev.minor,.ai-sev.suggestion{background:var(--e-accent-soft);color:var(--e-accent-text)}
.ai-kind{font-size:12px;font-weight:700;color:var(--e-faint);text-transform:uppercase;letter-spacing:.06em;flex:0 0 auto}
.ai-where{margin-left:auto;min-width:0;border:0;background:none;color:var(--e-accent-text);font-weight:600;font-size:12px;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:2px 0}
.ai-where:hover{text-decoration:underline}
.ai-diff{font-size:13px;display:grid;gap:4px;margin-bottom:8px}
.ai-diff del{background:var(--e-danger-soft);color:var(--e-danger);padding:4px 8px;border-radius:6px}
.ai-diff ins{background:var(--e-ok-soft);color:var(--e-ok);text-decoration:none;padding:4px 8px;border-radius:6px}
.ai-issue p{margin:0 0 6px;font-size:12.5px;line-height:1.5}
.ai-issue p.ai-ref{color:var(--e-muted);font-size:12px}

/* ---------- responsive ---------- */
@media (max-width:1360px){
  .e-top #eAI .lbl,.e-top #ePreview .lbl,.e-top #eExport .lbl{display:none}
  .e-top #eAI,.e-top #ePreview,.e-top #eExport{width:34px;padding:0}
}
@media (max-width:1200px){
  :root{--e-pw:312px}
  .e-name span{display:none}
  #eHome .lbl{display:none}#eHome{width:34px;padding:0}
}
/* Small screens: the rail becomes a bottom bar, the panel a sheet over the canvas. */
@media (max-width:1024px){
  :root{--e-top:52px;--e-rail:calc(58px + env(safe-area-inset-bottom,0px))}
  .e-app{height:100%;grid-template-rows:var(--e-top) minmax(0,1fr) var(--e-rail)}
  .e-body{display:flex;flex-direction:column;height:auto;min-height:0}
  .e-center{flex:1;min-height:0}
  .e-canvas{padding:16px 0 40px}
  .e-rail{order:9;position:fixed;left:0;right:0;bottom:0;height:var(--e-rail);flex-direction:row;padding:0 4px env(safe-area-inset-bottom,0px);border-right:0;border-top:1px solid var(--e-line);z-index:66;overflow:visible}
  .e-rail button{flex:1;height:100%;border-radius:8px;gap:3px}
  .e-rail button[aria-pressed="true"]{background:none}
  .e-rail button[aria-pressed="true"]::before{content:"";position:absolute;top:0;left:50%;width:28px;margin-left:-14px;height:2px;border-radius:2px;background:var(--e-accent)}
  .e-panel{position:fixed;left:0;right:0;bottom:var(--e-rail);top:auto;width:auto;max-height:calc(100vh - var(--e-top) - var(--e-rail) - 20px);height:min(72vh,calc(100vh - var(--e-top) - var(--e-rail) - 20px));border:0;border-radius:16px 16px 0 0;box-shadow:var(--e-shadow-lg);z-index:65;animation:e-sheet .3s var(--e-ease)}
  .e-panel.tall{height:calc(100vh - var(--e-top) - var(--e-rail) - 20px)}
  .e-phead{height:54px;align-items:flex-end;padding-bottom:9px}
  .e-grabber{display:block;position:absolute;left:50%;top:7px;width:38px;height:4px;margin-left:-19px;border-radius:99px;background:var(--e-line2)}
  .e-dscrim{display:block;position:fixed;left:0;right:0;top:var(--e-top);bottom:var(--e-rail);background:rgba(15,22,30,.42);z-index:64;animation:e-fade .2s var(--e-ease)}
  .e-dscrim[hidden]{display:none!important}
  .e-canvasbar{padding:0 8px 0 6px;gap:8px}
  .e-hide-sm{display:none}
  .e-top{gap:6px;padding:0 8px}
  #eSave .lbl{display:none}#eSave{width:34px;padding:0}
  .ai-drawer{left:0;width:100vw;bottom:var(--e-rail)}
  .e-multibar{padding:6px 10px}
  .e-toast{bottom:calc(var(--e-rail) + 12px)}
}
@keyframes e-sheet{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}
@media (max-width:640px){
  .e-seg button .lbl{display:none}
  .e-seg button{padding:0 9px}
  .e-status{font-size:0;padding:0;width:12px;height:12px;gap:0}
  .e-name b{font-size:13px}
  .e-lnav .e-icbtn{display:none}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* icons */
.e-les .pick .no .e-ico{width:12px;height:12px}
.e-seg button{display:inline-flex;align-items:center;gap:6px}
.e-seg button .e-ico{width:14px;height:14px}
.e-align{width:100%}.e-align button{flex:1;justify-content:center;height:28px}.e-align button .e-ico{width:16px;height:16px}
.e-rich [style*="text-align: center"],.e-rich [style*="text-align:center"]{text-align:center}
.e-lib .gi .e-ico{width:17px;height:17px}
.e-typechip .e-ico{stroke-width:2}
.e-iconpick{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.e-icprev{width:40px;height:40px;border-radius:8px;border:1px solid var(--e-line);background:var(--e-sunk);display:grid;place-items:center;color:var(--e-accent-text);flex:0 0 auto;font-size:18px}
.e-icprev svg{display:block}.e-icprev small{font-size:12px;color:var(--e-faint)}
.e-icgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:6px;max-height:min(360px,50vh);overflow:auto;padding:2px}
.e-icopt{display:flex;flex-direction:column;align-items:center;gap:7px;padding:12px 4px 9px;border:1px solid var(--e-line);border-radius:10px;background:var(--e-panel);cursor:pointer;color:var(--e-ink);min-width:0;transition:background .12s var(--e-ease),border-color .12s var(--e-ease)}
.e-icopt span{font-size:12px;color:var(--e-muted);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.e-icopt:hover{background:var(--e-sunk);border-color:var(--e-line2)}
.e-icopt[aria-pressed="true"]{border-color:var(--e-accent);box-shadow:inset 0 0 0 1px var(--e-accent);color:var(--e-accent-text)}
.e-icopt[hidden]{display:none}
.e-styles-g{grid-column:1/-1;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--e-faint);margin:8px 2px 0}
.e-styles-g:first-child{margin-top:0}
.e-style-t em.new{background:var(--e-accent)}

.e-multibar{display:flex;align-items:center;gap:6px;padding:8px 14px;background:var(--e-accent-soft);border-bottom:1px solid var(--e-line);font-size:12.5px;flex:0 0 auto;flex-wrap:wrap}
.e-multibar b{color:var(--e-accent-text);margin-right:4px}
.e-multibar[hidden]{display:none}

/* lesson menu picker */
.e-menus{grid-template-columns:repeat(3,minmax(0,1fr))}
.mn-th{height:62px;padding:8px 7px;gap:4px;justify-content:center}
.mn-th i{display:flex;align-items:center;gap:5px;height:14px;border-radius:4px;padding:0 4px}
.mn-th b{width:9px;height:9px;border-radius:50%;border:1.5px solid;flex:0 0 auto;background:transparent}
.mn-th u{display:block;height:3px;border-radius:2px;flex:1;text-decoration:none;opacity:.9}
/* cover focus point */
.e-focal{position:relative;width:min(100%,calc(260px * var(--ar,1.7778)));aspect-ratio:var(--ar,16/9);margin:0 auto;border-radius:8px;overflow:hidden;border:1px solid var(--e-line);background:var(--e-sunk);cursor:crosshair;touch-action:none;user-select:none}
.e-focal:focus-visible{outline:2px solid var(--e-accent);outline-offset:2px}
.e-focal img{width:100%;height:100%;object-fit:fill;display:block;pointer-events:none}
.e-focal .fx{position:absolute;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 2px var(--e-accent),0 2px 8px rgba(0,0,0,.45);background:rgba(0,163,224,.25);pointer-events:none}
.e-focal .fx::before,.e-focal .fx::after{content:"";position:absolute;background:#fff;left:50%;top:50%}
.e-focal .fx::before{width:1px;height:8px;margin:-4px 0 0 -.5px}.e-focal .fx::after{width:8px;height:1px;margin:-.5px 0 0 -4px}
.e-focal.drag .fx{transform:scale(1.1)}

.e-aud-perf{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;border:1px solid var(--e-line);border-radius:10px;margin:0 0 14px;background:var(--e-sunk);font-size:.9rem}.e-aud-perf small{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;opacity:.7}.e-aud-perf b{font-size:1.05rem;margin-right:4px}.e-aud-perf.warn{border-color:#E0B400;background:#FFF8D6}

/* ---------- export dialog ---------- */
.e-dialog:has(.ex-wrap){width:min(860px,100%);padding:0;overflow:hidden;display:flex;flex-direction:column}
.ex-wrap{display:flex;flex-direction:column;min-height:0;max-height:calc(100vh - 32px)}
.ex-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:24px 28px 18px;border-bottom:1px solid var(--e-line)}
.ex-head h2{margin:0 0 4px;font-size:20px}
.ex-head p{margin:0;max-width:52ch}
.ex-eyebrow{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--e-accent-text);margin-bottom:6px}
.ex-pill{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:99px;font-size:12px;font-weight:700;white-space:nowrap;margin-top:22px}
.ex-pill::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.ex-pill.k{background:var(--e-ok-soft);color:var(--e-ok)}.ex-pill.w{background:var(--e-warn-soft);color:var(--e-warn)}.ex-pill.x{background:var(--e-danger-soft);color:var(--e-danger)}
.ex-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:0;min-height:0;overflow:auto}
.ex-list{display:flex;flex-direction:column;gap:8px;padding:20px 20px 20px 28px}
.ex-card{position:relative;display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:12px;align-items:center;border:1px solid var(--e-line2);border-radius:12px;padding:12px 14px;cursor:pointer;background:var(--e-panel);transition:border-color .15s var(--e-ease),background .15s var(--e-ease),box-shadow .15s var(--e-ease),transform .15s var(--e-ease)}
.ex-card:hover{border-color:rgba(37,55,70,.3);transform:translateY(-1px);box-shadow:var(--e-shadow-sm)}
.ex-card input{position:absolute;opacity:0;pointer-events:none}
.ex-card:has(input:checked){border-color:var(--e-accent);background:var(--e-accent-soft);box-shadow:inset 0 0 0 1px var(--e-accent)}
.ex-card:has(input:focus-visible){box-shadow:var(--e-ring),inset 0 0 0 1px var(--e-accent)}
.ex-ic{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;background:var(--e-fill);color:var(--e-muted)}
.ex-ic svg{width:20px;height:20px}
.ex-card:has(input:checked) .ex-ic{background:var(--e-accent);color:var(--e-accent-ink)}
.ex-tx{min-width:0}
.ex-tx b{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:700;letter-spacing:-.01em}
.ex-tx small{display:block;color:var(--e-muted);font-size:12.5px;line-height:1.4;margin-top:2px}
.ex-tag{font-style:normal;font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#1D2A35;background:var(--e-hl);border-radius:5px;padding:2px 6px}
.ex-fmt{font:600 12px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--e-faint);white-space:nowrap;background:var(--e-sunk);border:1px solid var(--e-line);border-radius:6px;padding:3px 7px}
.ex-card:has(input:checked) .ex-fmt{color:var(--e-accent-text);border-color:transparent;background:rgba(255,255,255,.7)}
.ex-side{display:flex;flex-direction:column;gap:12px;padding:20px 28px 20px 20px;background:var(--e-sunk);border-left:1px solid var(--e-line)}
.ex-box{background:var(--e-panel);border:1px solid var(--e-line);border-radius:12px;padding:14px 16px}
.ex-k{font-size:12px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--e-faint);margin-bottom:10px}
.ex-get,.ex-checks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;font-size:13px;line-height:1.45}
.ex-get li,.ex-checks li{display:flex;gap:9px;align-items:flex-start}
.ex-get svg,.ex-checks svg{width:16px;height:16px;flex:0 0 auto;margin-top:2px;color:var(--e-ok)}
.ex-checks li.w svg{color:var(--e-warn)}.ex-checks li.x svg{color:var(--e-danger)}
.ex-checks li.x span{color:var(--e-danger);font-weight:600}
.ex-ok{margin:0;font-size:13px;color:var(--e-ok);font-weight:600}
.ex-rule{margin:0;font-size:13px;line-height:1.5;color:var(--e-muted)}
.ex-rule a{color:var(--e-accent-text);font-weight:600}
.ex-foot{margin:0;padding:14px 28px;border-top:1px solid var(--e-line);background:var(--e-panel)}
.ex-msg{margin:0;padding:0 28px 14px;font-size:13px;color:var(--e-muted);line-height:1.45}
.ex-msg:empty{display:none}
.ex-msg.x{color:var(--e-danger);font-weight:600}.ex-msg.k{color:var(--e-ok);font-weight:600}
@media (max-width:720px){.ex-grid{grid-template-columns:1fr}.ex-side{border-left:0;border-top:1px solid var(--e-line);padding:16px 20px}.ex-list{padding:16px 20px}.ex-head,.ex-foot{padding-left:20px;padding-right:20px}.ex-msg{padding-left:20px;padding-right:20px}.ex-card{grid-template-columns:36px minmax(0,1fr)}.ex-fmt{display:none}}

.ex-xapi{padding:0}
.ex-xapi summary{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;cursor:pointer;list-style:none;border-radius:12px}
.ex-xapi summary::-webkit-details-marker{display:none}
.ex-xapi summary::after{content:"";width:8px;height:8px;border-right:1.5px solid var(--e-faint);border-bottom:1.5px solid var(--e-faint);transform:rotate(45deg);margin:0 4px 0 auto;transition:transform .15s var(--e-ease)}
.ex-xapi[open] summary::after{transform:rotate(-135deg);margin-top:4px}
.ex-xapi summary .ex-pill{margin:0;order:2}
.ex-xapi summary:hover{background:var(--e-fill)}
.ex-xapi-body{padding:0 16px 14px;border-top:1px solid var(--e-line)}
.ex-xapi-body > :first-child{margin-top:12px}
.ex-pill.sm{height:22px;padding:0 8px;font-size:12px;background:var(--e-fill);color:var(--e-muted)}
/* Review count on the rail button (cloud/review.js) */
.e-rail-count{position:absolute;top:6px;right:calc(50% - 22px);min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#B42318;color:#fff;font:700 11px/18px var(--e-font,Arial,sans-serif);text-align:center;box-shadow:0 0 0 2px var(--e-panel)}