/* SCI.help — media-library engine styles. All classes prefixed .ml- to avoid collisions with the site's style.css. Works standalone or under site chrome. */ /* Variables MUST be on :root, not .ml-root — the reader/toast are appended to (to escape transformed ancestors) and would otherwise lose every var, leaving the overlay background transparent and the page visibly broken. */ :root{--ml-navy:#1a3c5e;--ml-blue:#2e86ab;--ml-blue-light:#a8d8ea;--ml-amber:#e8a838;--ml-green:#2d6a4f; --ml-bg:#f4f7fa;--ml-card:#fff;--ml-text:#1a2332;--ml-muted:#5a6a7e;--ml-border:#dde3ea; --ml-radius:10px;--ml-radius-lg:16px;--ml-shadow:0 2px 12px rgba(26,60,94,.08);--ml-shadow-md:0 6px 28px rgba(26,60,94,.16);} .ml-root,.ml-reader,.ml-toast{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:var(--ml-text);} .ml-root *,.ml-reader *{box-sizing:border-box;} .ml-root mark,.ml-reader mark{background:#fff2c2;color:inherit;padding:0 1px;border-radius:2px;} .ml-wrap{max-width:1000px;margin:0 auto;padding:0 18px;} .ml-searchbar{position:sticky;top:0;z-index:30;background:var(--ml-bg);box-shadow:0 1px 0 var(--ml-border);padding:12px 0;} .ml-searchbar.stuck{box-shadow:0 2px 14px rgba(26,60,94,.10);} .ml-searchbox{position:relative;} .ml-searchbox>svg{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:var(--ml-muted);} #ml-q{width:100%;font-size:17px;padding:14px 46px;border:2px solid var(--ml-border);border-radius:var(--ml-radius-lg);background:#fff;color:var(--ml-text);box-shadow:var(--ml-shadow);} #ml-q:focus{outline:none;border-color:var(--ml-blue);} #ml-clearq{position:absolute;right:12px;top:50%;transform:translateY(-50%);border:none;background:none;color:var(--ml-muted);font-size:22px;cursor:pointer;line-height:1;padding:4px 8px;display:none;} .ml-meta-line{display:flex;justify-content:space-between;align-items:center;gap:10px 16px;margin-top:8px;flex-wrap:wrap;} #ml-count{font-size:13.5px;color:var(--ml-muted);font-weight:600;} #ml-tstatus{font-size:12.5px;color:var(--ml-muted);} .ml-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--ml-amber);margin-right:5px;vertical-align:middle;} .ml-dot.ready{background:var(--ml-green);} .ml-sortsel{font-size:13px;color:var(--ml-muted);margin-left:auto;} .ml-sortsel select{font-family:inherit;font-size:13px;padding:4px 6px;border:1px solid var(--ml-border);border-radius:7px;background:#fff;color:var(--ml-text);} .ml-main{padding:14px 0 60px;} .ml-hint{background:#eef5fb;border:1px solid #d6e6f2;border-radius:var(--ml-radius);padding:11px 14px;font-size:13px;color:var(--ml-navy);margin:6px 0 16px;} .ml-hint b{color:var(--ml-navy);} .ml-card{background:var(--ml-card);border:1px solid var(--ml-border);border-radius:var(--ml-radius-lg);box-shadow:var(--ml-shadow);padding:16px 18px;margin-bottom:14px;} .ml-card__head{display:flex;gap:12px;align-items:flex-start;} .ml-epno{flex:none;width:44px;height:44px;border-radius:11px;background:var(--ml-navy);color:#fff;font-weight:800;font-size:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;text-align:center;} .ml-epno span{font-size:9px;font-weight:600;opacity:.7;text-transform:uppercase;} .ml-card__t{flex:1;min-width:0;} .ml-card__t h3{font-size:18px;font-weight:750;line-height:1.3;color:var(--ml-navy);margin:0;} .ml-card__t h3 button{all:unset;cursor:pointer;} .ml-card__t h3 button:hover{color:var(--ml-blue);text-decoration:underline;} .ml-card__date{font-size:12.5px;color:var(--ml-muted);margin-top:2px;} .ml-card__sum{font-size:14px;color:#38465a;margin-top:8px;} .ml-facets{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;} .ml-facet{font-size:11.5px;padding:3px 9px;border-radius:16px;background:#eef2f7;color:var(--ml-navy);border:1px solid #e2e8f0;} .ml-facet.kw{background:#eaf5ef;color:#1e5a41;border-color:#d4ebe0;} .ml-facet.person{background:#f2eefb;color:#4a3a78;border-color:#e6ddf5;} .ml-facet.matched{background:#fff2c2;border-color:#ecd98a;color:#6b5411;} .ml-listenrow{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px;align-items:center;} .ml-btn{font-size:13.5px;font-weight:650;cursor:pointer;border-radius:9px;padding:8px 14px;border:1px solid var(--ml-border);background:#fff;color:var(--ml-navy);display:inline-flex;gap:7px;align-items:center;} .ml-btn:hover{border-color:var(--ml-blue);background:#f0f8fb;text-decoration:none;} .ml-btn.primary{background:var(--ml-blue);border-color:var(--ml-blue);color:#fff;} .ml-btn.primary:hover{background:#256f8f;} .ml-btn svg{width:15px;height:15px;} .ml-extlinks{font-size:12.5px;color:var(--ml-muted);margin-left:auto;} .ml-matches{margin-top:13px;border-top:1px dashed var(--ml-border);padding-top:11px;} .ml-matches h4{font-size:11.5px;text-transform:uppercase;letter-spacing:.5px;color:var(--ml-muted);margin-bottom:7px;font-weight:700;} .ml-matches h4:not(:first-child){margin-top:12px;} .ml-mrow{display:flex;gap:10px;align-items:flex-start;padding:5px 0;font-size:13.5px;} .ml-ts{flex:none;font-variant-numeric:tabular-nums;font-weight:700;font-size:12.5px;color:var(--ml-blue);background:#eaf4f9;border:1px solid #cfe6f1;border-radius:7px;padding:3px 8px;cursor:pointer;min-width:52px;text-align:center;font-family:inherit;} .ml-ts:hover{background:var(--ml-blue);color:#fff;} .ml-mtxt{flex:1;color:#37455a;} .ml-mtopic{color:var(--ml-navy);font-weight:650;} .ml-morebtn{font-size:12.5px;color:var(--ml-blue);background:none;border:none;cursor:pointer;padding:5px 0;font-weight:650;font-family:inherit;} .ml-morebtn:hover{text-decoration:underline;} .ml-empty{text-align:center;padding:60px 20px;color:var(--ml-muted);} .ml-empty svg{color:var(--ml-blue-light);margin-bottom:12px;} .ml-reader{position:fixed;inset:0;z-index:1000;background:var(--ml-bg);display:none;flex-direction:column;} .ml-reader.open{display:flex;} .ml-rhead{background:#fff;border-bottom:1px solid var(--ml-border);box-shadow:var(--ml-shadow);flex:none;} .ml-rhead .ml-wrap{padding:12px 18px;} .ml-rtop{display:flex;gap:12px;align-items:flex-start;} .ml-rtop .ml-epno{width:40px;height:40px;} .ml-rtitle{flex:1;min-width:0;} .ml-rtitle h2{font-size:17px;font-weight:750;color:var(--ml-navy);line-height:1.3;margin:0;} .ml-rmeta{font-size:12px;color:var(--ml-muted);margin-top:2px;} .ml-rclose{flex:none;border:none;background:#eef2f7;color:var(--ml-navy);width:38px;height:38px;border-radius:10px;font-size:20px;cursor:pointer;line-height:1;} .ml-rclose:hover{background:#e2e8f0;} #ml-audio{width:100%;margin-top:10px;height:38px;} .ml-videowrap{position:relative;width:100%;max-width:640px;margin:10px auto 0;aspect-ratio:16/9;background:#000;border-radius:10px;overflow:hidden;} .ml-videowrap>div,.ml-videowrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0;} .ml-audioerr{display:none;font-size:12.5px;color:#c0392b;background:#fdece9;border:1px solid #f4c7bf;border-radius:8px;padding:7px 10px;margin-top:8px;} .ml-audioerr.show{display:block;} .ml-rcontrols{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:9px;} .ml-rfind{position:relative;flex:1;min-width:170px;} .ml-rfind input{width:100%;font-size:14px;padding:8px 12px 8px 34px;border:1px solid var(--ml-border);border-radius:9px;font-family:inherit;} .ml-rfind input:focus{outline:none;border-color:var(--ml-blue);} .ml-rfind svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--ml-muted);} #ml-findcount{font-size:12px;color:var(--ml-muted);white-space:nowrap;} .ml-follow{font-size:12.5px;color:var(--ml-muted);display:flex;align-items:center;gap:6px;cursor:pointer;user-select:none;white-space:nowrap;} .ml-follow input{width:15px;height:15px;} .ml-copybtn{font-size:12.5px;font-weight:650;color:var(--ml-navy);background:#fff;border:1px solid var(--ml-border);border-radius:8px;padding:7px 11px;cursor:pointer;display:inline-flex;gap:6px;align-items:center;white-space:nowrap;font-family:inherit;} .ml-copybtn:hover{border-color:var(--ml-blue);background:#f0f8fb;} .ml-copybtn svg{width:14px;height:14px;} .ml-rbody{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;} .ml-rbody .ml-wrap{display:flex;gap:26px;padding:18px 18px 90px;align-items:flex-start;} details.ml-chapters{flex:none;width:250px;position:sticky;top:0;max-height:calc(100vh - 210px);overflow-y:auto;} details.ml-chapters>summary{font-size:11.5px;text-transform:uppercase;letter-spacing:.5px;color:var(--ml-muted);margin-bottom:8px;font-weight:700;cursor:pointer;list-style:none;padding:2px 0;} details.ml-chapters>summary::-webkit-details-marker{display:none;} details.ml-chapters>summary::before{content:"▾ ";color:var(--ml-blue);} .ml-chap{display:flex;gap:8px;padding:7px 0;font-size:13px;cursor:pointer;border-bottom:1px solid #eef2f6;} .ml-chap:hover .ml-ctopic{color:var(--ml-blue);} .ml-cts{font-variant-numeric:tabular-nums;color:var(--ml-blue);font-weight:700;font-size:12px;flex:none;min-width:48px;} .ml-ctopic{color:var(--ml-navy);font-weight:600;line-height:1.35;} .ml-transcript{flex:1;min-width:0;max-width:720px;} .ml-seg{display:flex;gap:12px;padding:3px 0;scroll-margin-top:20px;} .ml-seg .ml-ts{margin-top:1px;} .ml-stext{flex:1;color:#25313f;line-height:1.62;} .ml-seg.spk{margin-top:12px;} .ml-spk{font-size:11px;font-weight:700;color:var(--ml-muted);text-transform:uppercase;letter-spacing:.4px;display:block;margin-bottom:1px;} .ml-seg.active{background:#fff6da;border-radius:8px;} .ml-seg.active .ml-stext{color:#1a2332;} .ml-seg.hidden{display:none;} .ml-seg.jumpflash{animation:ml-flash 1.6s ease;} @keyframes ml-flash{0%{background:#ffe89a;}100%{background:transparent;}} .ml-rsummary{background:#eef5fb;border:1px solid #d6e6f2;border-radius:var(--ml-radius);padding:12px 14px;margin-bottom:16px;font-size:13.5px;color:#2a3c50;} .ml-rsummary b{color:var(--ml-navy);} .ml-loadwrap{text-align:center;padding:70px 20px;color:var(--ml-muted);} .ml-spinner{width:34px;height:34px;border:3px solid var(--ml-border);border-top-color:var(--ml-blue);border-radius:50%;animation:ml-spin 1s linear infinite;margin:0 auto 14px;} @keyframes ml-spin{to{transform:rotate(360deg);}} .ml-toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);background:var(--ml-navy);color:#fff;font-size:13.5px;font-weight:600;padding:10px 18px;border-radius:22px;box-shadow:var(--ml-shadow-md);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:1001;} .ml-toast.show{opacity:1;transform:translateX(-50%) translateY(0);} @media(max-width:720px){ .ml-rbody .ml-wrap{flex-direction:column;padding:14px 14px 90px;} details.ml-chapters{width:100%;position:static;max-height:280px;background:#fff;border:1px solid var(--ml-border);border-radius:10px;padding:10px 12px;margin-bottom:6px;} .ml-transcript{max-width:100%;} .ml-extlinks{margin-left:0;width:100%;} .ml-sortsel{margin-left:0;} } /* --- dated-content caution banner (optional per-item "warn" field) --- */ .ml-warn{display:flex;align-items:flex-start;gap:9px;background:#fdecea;border:1.5px solid #c62828; border-left:5px solid #c62828;color:#8c1d18;border-radius:8px;padding:10px 13px; font-size:13.5px;line-height:1.5;font-weight:600;margin:12px 0;} .ml-warn[hidden]{display:none;} .ml-warn__i{flex:0 0 auto;width:18px;height:18px;border-radius:50%;background:#c62828;color:#fff; font-weight:800;font-size:12px;line-height:18px;text-align:center;margin-top:1px;} .ml-warn--card{margin:8px 0 2px;font-size:12.5px;padding:8px 11px;font-weight:600;}