/* ===========================================================================
   The free-preview overlay.

   The same rules site.css carries, in a file of its own so the rebuilt
   course page can load the overlay without loading the whole of the old
   stylesheet with it. The variables it reads are declared here with the
   theme's values.
   ========================================================================= */
.pv{--ink:#0D084D;--ink-2:#55597A;--line:#E4E8EF;--bg-2:#F6F8FB;--muted:#696C89;
  --brand:#1362B1;--panel-2:#F6F8FB;--r:14px}
.pv{position:fixed;inset:0;background:rgba(20,20,20,.72);backdrop-filter:blur(3px);z-index:400;
  display:flex;align-items:center;justify-content:center;padding:24px}
.pv[hidden]{display:none}
.pv-box{background:#fff;border-radius:20px;width:100%;max-width:880px;max-height:92vh;overflow:hidden;
  display:flex;flex-direction:column;box-shadow:0 40px 90px rgba(0,0,0,.4)}
.pv-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px;
  border-bottom:1px solid var(--line)}
.pv-head b{font-size:16.5px;font-weight:800;letter-spacing:-.02em;min-width:0;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.pv-x{width:34px;height:34px;border:none;background:var(--panel-2);border-radius:50%;font-size:22px;
  line-height:1;cursor:pointer;color:var(--ink-2);flex:none}
.pv-x:hover{background:#E8E8E4}
.pv-body{flex:1;overflow-y:auto;background:#0E0E12;display:grid;place-items:center;min-height:220px}
.pv-body video{width:100%;max-height:70vh;display:block;background:#000}
.pv-body img{max-width:100%;max-height:70vh;object-fit:contain}
.pv-body iframe{width:100%;height:70vh;border:none;background:#fff}
.pv-body audio{padding:40px 24px}
.pv-text{background:#fff;color:var(--ink);padding:28px 30px;line-height:1.75;font-size:15.5px;width:100%;
  max-height:70vh;overflow-y:auto}
.pv-load{color:#B9B9C4;font-size:15px;padding:60px 24px;text-align:center}
.pv-alt{background:#fff;width:100%;padding:12px 18px;font-size:14px}
.pv-alt a{color:var(--brand);font-weight:600}
.pv-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 20px;
  border-top:1px solid var(--line);font-size:14px;color:var(--ink-2);flex-wrap:wrap}
@media(max-width:640px){
  .pv{padding:0}
  .pv-box{border-radius:0;max-height:100vh;height:100vh}
}



/* ---------- carousels on the course page ---------- */