/* An educational viewing room: all styling stays within the video library. */
.video-library { --vl-ink:#111719; --vl-muted:#56645f; --vl-silver:#aab5bb; --vl-line:#ced6d1; padding-top:18px; }
.video-library [hidden] { display:none!important; }
.vl-eyebrow { display:block; font-size:10px; font-weight:700; letter-spacing:.14em; line-height:1.65; text-transform:uppercase; color:#617067; }
.vl-intro { display:grid; grid-template-columns:minmax(0,1fr) 160px; align-items:center; gap:40px; padding:0 20px 38px; }
.vl-intro h1 { margin:16px 0 20px; font-size:clamp(35px,4.3vw,61px); font-weight:650; letter-spacing:-.055em; line-height:1.05; }
.vl-intro h1 span { color:#667570; }
.vl-intro p { max-width:660px; color:var(--vl-muted); font-size:15px; line-height:1.75; margin-bottom:23px; }
.vl-intro-meta { display:flex; align-items:center; flex-wrap:wrap; gap:12px 22px; font-size:11px; color:#526159; }
.vl-intro-meta>span { display:flex; align-items:center; gap:7px; }
.vl-intro-meta i { width:6px; height:6px; border-radius:50%; background:#5b7900; }
.vl-intro-meta a { text-decoration:underline; text-underline-offset:4px; color:#263f31; }
.vl-host { align-self:end; text-align:center; }
.vl-host picture { display:block; border-radius:80px 80px 10px 10px; background:#10191a; overflow:hidden; }
.vl-host img { width:160px; height:185px; object-fit:contain; }
.vl-host>span { display:block; margin-top:11px; font-size:9px; color:#68776e; letter-spacing:.09em; text-transform:uppercase; }
.vl-workspace { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(290px,1fr); gap:24px; align-items:start; }
.vl-featured { min-width:0; background:#10181b; color:#eef1ef; border:1px solid #334249; border-radius:12px; overflow:hidden; scroll-margin-top:calc(var(--sticky-navigation-height,88px) + 14px); }
.vl-featured-heading { padding:28px 28px 22px; display:flex; justify-content:space-between; align-items:start; flex-wrap:wrap; gap:17px; }
.vl-featured .vl-eyebrow { color:#a4b4b5; }
.vl-featured-heading h2 { font-size:clamp(27px,3.1vw,41px); letter-spacing:-.045em; line-height:1.12; margin:13px 0 0; overflow-wrap:anywhere; }
.vl-featured-heading h2 span { color:#aebdc2; }
.vl-state { display:inline-flex; flex-shrink:0; padding:7px 10px; border:1px solid #788a8a55; background:#ffffff04; color:#bac6c7; font-size:9px; letter-spacing:.015em; line-height:1.4; border-radius:4px; }
.vl-state.is-public { color:var(--lime); border-color:#b8f30066; background:#b8f30009; }
.vl-player-wrap { padding:0 18px; }
.vl-player { display:block; width:100%; max-height:480px; aspect-ratio:16/9; object-fit:contain; background:#05080a; border:1px solid #ffffff18; border-radius:5px; }
.vl-player.is-portrait { width:min(100%,270px); aspect-ratio:9/16; margin-inline:auto; }
.vl-video-error { margin:18px 28px 0; padding:17px; border:1px solid #a3b779; border-radius:5px; color:#dae3d2; font-size:13px; }
.vl-video-error p { margin-bottom:12px; }
.vl-video-error button { min-height:40px; border:1px solid #adbcac; background:transparent; color:#eef1ef; border-radius:3px; padding:8px 15px; font-size:12px; }
.vl-featured-copy { padding:27px 28px 24px; }
.vl-summary { color:#d4dedb; font-size:16px; line-height:1.7; margin:12px 0 22px; }
.vl-featured-links,.vl-member-links { display:flex; align-items:center; flex-wrap:wrap; gap:16px 22px; }
.vl-featured-links .btn,.vl-member-links .btn { font-size:10px; letter-spacing:.05em; padding:14px 18px; border-radius:3px; background:var(--lime); color:#132008; }
.vl-text-link { font-size:11px; text-decoration:underline; text-underline-offset:5px; }
.vl-text-link:hover { color:var(--lime); }
.vl-fine { font-size:11px; line-height:1.75; color:#a3b3b1; margin:20px 0; }
.vl-context { border-top:1px solid #a5b6b329; margin-top:23px; padding:16px 0; }
.vl-context summary { display:flex; align-items:center; justify-content:space-between; gap:20px; cursor:pointer; list-style:none; color:#c5d0cd; font-size:12px; min-height:28px; }
.vl-context summary::-webkit-details-marker { display:none; }
.vl-context summary span { color:var(--lime); font-size:20px; line-height:1; }
.vl-context[open] summary span { transform:rotate(45deg); }
.vl-context p { color:#aebdb7; font-size:12px; line-height:1.75; margin:14px 0 2px; }
.vl-related { margin-top:0; padding:21px 28px 28px; background:#0c1316; border-top:1px solid #a5b6b320; }
.vl-related>div { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:12px; }
.vl-related button { display:flex; justify-content:space-between; align-items:center; gap:12px; width:100%; min-width:0; text-align:left; padding:14px 13px; border:1px solid #91a7a12e; background:#ffffff03; color:#dce4e1; border-radius:4px; }
.vl-related button:hover { border-color:#b8f30077; }
.vl-related button strong { display:block; font-size:12px; overflow-wrap:anywhere; }
.vl-related button small { display:block; font-size:9px; color:#a4b5af; line-height:1.5; margin-top:4px; }
.vl-upcoming { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; margin:0 18px; background:#090e11; border:1px solid #ffffff19; border-radius:5px; overflow:hidden; }
.vl-upcoming-art { min-width:0; }
.vl-upcoming-art picture { display:block; }
.vl-upcoming-art picture img { width:100%; height:auto; min-height:260px; max-height:320px; object-fit:contain; }
.vl-upcoming-copy { padding:22px 24px 22px 10px; }
.vl-outline-mark { display:grid; place-items:center; width:36px; height:36px; color:var(--lime); border:1px solid #8fafa759; border-radius:50%; margin-bottom:18px; font-size:20px; }
.vl-upcoming-copy strong { display:block; font-size:24px; line-height:1.2; letter-spacing:-.03em; font-weight:600; }
.vl-upcoming-copy p { font-size:12px; color:#acbcb7; margin:14px 0 0; line-height:1.8; }
.vl-artwork-pending { min-height:260px; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:20px; padding:20px; background:radial-gradient(ellipse at center,#263137,#0b1013 75%); }
.vl-artwork-pending img { width:135px; height:auto; }
.vl-artwork-pending span { font-size:9px; color:#98aca4; text-align:center; line-height:1.7; }
.vl-browser { min-width:0; background:#fff; border:1px solid #cbd6cd; border-radius:12px; padding:25px 22px 20px; }
.vl-browser h2 { font-size:26px; font-weight:650; letter-spacing:-.04em; line-height:1.15; margin:12px 0; }
.vl-browser header p { font-size:12px; color:#63736b; line-height:1.7; margin-bottom:22px; }
.vl-search label,.vl-select label { display:block; font-size:11px; font-weight:650; color:#31483c; letter-spacing:.035em; margin-bottom:8px; }
.vl-search>div { position:relative; }
.vl-search svg { position:absolute; left:12px; top:15px; color:#64776b; pointer-events:none; }
.vl-search input { width:100%; min-height:46px; padding:11px 10px 11px 37px; border:1px solid #b6c5ba; background:#f6f8f5; color:#172e20; border-radius:5px; font-size:12px; }
.vl-search .vl-suggestions { position:fixed; z-index:1200; box-sizing:border-box; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; padding:5px; border:1px solid #aabca9; border-radius:7px; background:#fff; color:#172e20; box-shadow:0 12px 36px #111b2026; }
.vl-suggestion { cursor:pointer; padding:12px 10px; min-height:52px; border-radius:4px; line-height:1.45; }
.vl-suggestion strong { display:block; overflow-wrap:anywhere; font-size:13px; }
.vl-suggestion>span { display:block; margin-top:3px; font-size:10px; color:#627565; }
.vl-suggestion:hover,.vl-suggestion[aria-selected=true] { background:#eaf2df; outline:1px solid #94ab72; outline-offset:-1px; }
.vl-suggestion-empty { margin:0; padding:18px 12px; color:#617265; font-size:12px; }
.vl-select { margin-top:17px; }
.vl-select select { min-height:46px; font-size:12px; border:1px solid #b6c5ba; background:#fff; border-radius:5px; padding:10px; }
.vl-select>p { margin:8px 0 0; color:#6b796f; font-size:10px; line-height:1.6; }
.vl-list-meta { display:flex; align-items:center; justify-content:space-between; gap:15px; margin:18px 0 10px; font-size:10px; color:#6b796f; min-height:26px; }
.vl-list-meta button { border:0; background:transparent; color:#314c23; font-size:10px; text-decoration:underline; text-underline-offset:3px; padding:5px 0; min-height:26px; }
.vl-topic-scroll { max-height:min(560px,62vh); overflow-y:auto; scrollbar-width:thin; scrollbar-color:#8a9d8e #eef2ec; border-top:1px solid #dce3dc; border-bottom:1px solid #dce3dc; scroll-behavior:auto; }
.vl-topic-scroll ul { list-style:none; padding:0; margin:0; }
.vl-topic-scroll li { padding:0; margin:0; border-bottom:1px solid #e5eae5; }
.vl-topic-scroll li:last-child { border-bottom:0; }
.vl-topic-scroll li>button { display:flex; align-items:center; gap:12px; width:100%; min-height:75px; padding:14px 12px; text-align:left; border:0; border-left:3px solid transparent; background:#fff; color:#24392d; transition:background 160ms ease,border-color 160ms ease; }
.vl-topic-scroll li>button:hover { background:#f1f5ec; }
.vl-topic-scroll li>button[aria-pressed=true] { background:#ebf1e3; border-left-color:#739100; }
.vl-topic-number { font-size:9px; color:#849486; flex:0 0 16px; }
.vl-topic-copy { flex:1; min-width:0; }
.vl-topic-copy strong { display:block; font-size:14px; font-weight:650; line-height:1.3; overflow-wrap:anywhere; }
.vl-topic-copy small { display:block; font-size:9px; line-height:1.5; color:#6f7d72; margin-top:5px; }
.vl-topic-copy small.is-public { color:#4c6b11; font-weight:650; }
.vl-topic-arrow { color:#5f7655; font-size:12px; flex:0 0 auto; }
.vl-no-results { margin:0; padding:30px 20px; color:#6a786e; font-size:12px; text-align:center; }
.vl-selection-note { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; padding-top:15px; font-size:10px; color:#516257; }
.vl-selection-note a { text-decoration:underline; text-underline-offset:3px; color:#314c23; white-space:nowrap; }
.vl-filter-note { margin-top:13px; padding:12px; background:#f1f4ed; border-left:2px solid #789645; color:#5b6d55; font-size:11px; line-height:1.6; }
.vl-member-feature { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.35fr); align-items:center; gap:38px; margin-top:42px; padding:34px; border:1px solid #334043; background:#162024; border-radius:12px; color:#e9efeb; }
.vl-member-feature .vl-eyebrow { color:#a3b7b3; }
.vl-member-art { position:relative; overflow:hidden; border-radius:7px; background:#0b1214; }
.vl-member-art img { width:100%; height:auto; aspect-ratio:16/9; object-fit:contain; }
.vl-member-art>span { position:absolute; bottom:0; left:0; right:0; background:#0c141ae8; padding:9px 15px; font-size:9px; color:#c2cfd0; letter-spacing:.08em; text-transform:uppercase; }
.vl-member-feature h2 { font-size:clamp(28px,3vw,40px); line-height:1.1; font-weight:650; letter-spacing:-.045em; margin:16px 0 20px; }
.vl-member-feature h2 span { color:#a6b6bd; }
.vl-member-feature p:not(.vl-fine) { color:#b6c4c0; font-size:13px; line-height:1.8; }
.vl-ceo-themes { display:grid; grid-template-columns:1fr 1fr; gap:9px 16px; list-style:none; padding:0; margin:0 0 20px; color:#d2dec8; font-size:12px; }
.vl-ceo-themes li { padding-left:11px; border-left:2px solid #91b542; line-height:1.5; }
.vl-member-feature .vl-fine { margin-bottom:0; }
.vl-footer-links { display:flex; flex-wrap:wrap; justify-content:space-between; gap:20px 30px; padding:29px 6px 5px; color:#516453; font-size:12px; }
.vl-footer-links a { text-decoration:underline; text-underline-offset:5px; }
.vl-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.video-library :is(a,button,input,select,summary,[tabindex]):focus-visible { outline:2px solid #6d9100; outline-offset:3px; }
.vl-featured :is(a,button,summary,[tabindex]):focus-visible,.vl-member-feature a:focus-visible { outline-color:var(--lime); }
@media(max-width:1000px) {
  .vl-workspace { grid-template-columns:minmax(0,1.45fr) minmax(285px,1fr); gap:18px; }
  .vl-featured-heading,.vl-featured-copy { padding-left:22px; padding-right:22px; }
  .vl-related { padding-left:22px; padding-right:22px; }
  .vl-browser { padding:22px 17px 18px; }
  .vl-upcoming { grid-template-columns:1fr; }
  .vl-upcoming-art picture img { height:270px; min-height:0; }
  .vl-artwork-pending { min-height:220px; }
  .vl-upcoming-copy { padding:0 23px 24px; }
  .vl-outline-mark { display:none; }
  .vl-upcoming-copy strong br { display:none; }
  .vl-upcoming-copy strong { font-size:22px; }
  .vl-member-feature { padding:28px; gap:27px; }
}
@media(max-width:780px) {
  .vl-intro { grid-template-columns:minmax(0,1fr) 125px; gap:25px; padding:0 4px 29px; }
  .vl-intro h1 { font-size:40px; }
  .vl-host img { height:165px; width:125px; }
  .vl-intro p { font-size:13px; }
  .vl-workspace { grid-template-columns:1fr; }
  .vl-player { max-height:440px; }
  .vl-featured-heading h2 { font-size:36px; }
  .vl-upcoming { grid-template-columns:1fr 1fr; }
  .vl-upcoming-copy { padding:22px; }
  .vl-browser { padding:26px; }
  .vl-topic-scroll { max-height:425px; }
  .vl-member-feature { grid-template-columns:1fr; gap:27px; }
  .vl-member-art { max-width:500px; }
}
@media(max-width:520px) {
  .video-library { padding-top:10px; }
  .vl-intro { grid-template-columns:1fr; gap:0; }
  .vl-intro h1 { font-size:clamp(33px,8.5vw,43px); }
  .vl-intro>.vl-host { display:none; }
  .vl-intro-meta { gap:10px 17px; }
  .vl-intro-meta a { width:100%; }
  .vl-featured-heading { padding:23px 20px 19px; }
  .vl-featured-heading h2 { font-size:31px; }
  .vl-player-wrap { padding:0 9px; }
  .vl-featured-copy { padding:23px 20px 22px; }
  .vl-summary { font-size:14px; }
  .vl-featured-links { gap:19px; }
  .vl-featured-links .btn { width:100%; font-size:9px; }
  .vl-related { padding:20px; }
  .vl-related>div { grid-template-columns:1fr; }
  .vl-upcoming { margin:0 9px; grid-template-columns:1fr; }
  .vl-upcoming-art picture img { height:245px; }
  .vl-upcoming-copy { padding:0 22px 23px; }
  .vl-browser { padding:24px 20px; }
  .vl-topic-scroll { max-height:380px; }
  .vl-topic-scroll li>button { padding-right:9px; padding-left:8px; gap:9px; }
  .vl-member-feature { padding:22px; margin-top:28px; }
  .vl-member-feature h2 { font-size:32px; }
  .vl-member-links .btn { width:100%; }
  .vl-footer-links { display:grid; gap:20px; font-size:11px; }
}
@media(prefers-reduced-motion:reduce) { .video-library * { transition:none; animation:none; scroll-behavior:auto; } }