/* VODs Forever viewer shell: shared base for every template (t-<id>.css adds the look).
   Colors come from --vf-* custom properties (tenant theme). Fonts: Latin subsets, OFL (fonts-OFL.txt);
   a font file loads only when a template uses that family. */
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:400 800;font-display:swap;src:url(f-bricolage-grotesque-400-800.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Chakra Petch';font-style:normal;font-weight:500;font-display:swap;src:url(f-chakra-petch-500.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Chakra Petch';font-style:normal;font-weight:600;font-display:swap;src:url(f-chakra-petch-600.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Chakra Petch';font-style:normal;font-weight:700;font-display:swap;src:url(f-chakra-petch-700.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Geist';font-style:normal;font-weight:400 700;font-display:swap;src:url(f-geist-400-700.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Geist Mono';font-style:normal;font-weight:400 600;font-display:swap;src:url(f-geist-mono-400-600.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(f-ibm-plex-mono-400.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(f-ibm-plex-mono-500.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Rubik';font-style:normal;font-weight:400 600;font-display:swap;src:url(f-rubik-400-600.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none !important}
.vf-off{display:none !important}
body{margin:0;background:var(--vf-bg);color:var(--vf-text);font-family:var(--vf-font);line-height:1.5;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom);-webkit-text-size-adjust:100%}
a{color:var(--vf-accent)}
img{max-width:100%}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--vf-accent);outline-offset:2px}
.vf-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.vf-muted{color:var(--vf-muted)}
.vf-main{max-width:1400px;margin:0 auto;padding:1rem}
.vf-av{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;flex:none;object-fit:cover;background:var(--vf-accent2);color:var(--vf-bg);font-weight:800}
.vf-banner img{display:block;width:100%;max-height:260px;object-fit:cover}
.vf-search{display:flex;align-items:center;gap:.5rem;min-width:0;color:var(--vf-muted);margin:0}
.vf-search input{flex:1;min-width:0;background:none;border:0;color:var(--vf-text);font:inherit;outline:none}
.vf-search kbd{font:11px/1.6 var(--vf-mono,ui-monospace,monospace);border:1px solid var(--vf-surface2);border-radius:4px;padding:0 5px;color:var(--vf-muted)}
.vf-links{display:flex;flex-wrap:wrap;gap:1rem}
.vf-links a{color:var(--vf-muted);text-decoration:none}.vf-links a:hover{color:var(--vf-text)}
/* video cards */
.vf-card{display:flex;flex-direction:column;gap:.5rem;color:var(--vf-text);text-decoration:none;min-width:0}
.vf-thumb{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:var(--vf-radius);background:var(--vf-surface2)}
.vf-thumb img,.vf-mini img,.vf-th img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.vf-ph{position:absolute;inset:0;display:grid;place-items:center;font-weight:700;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.45);padding:.5rem;text-align:center}
.vf-dur{position:absolute;right:.4rem;bottom:.4rem;background:rgba(0,0,0,.78);color:#fff;font-size:.75rem;padding:.05rem .4rem;border-radius:4px;font-variant-numeric:tabular-nums}
.vf-title{font-weight:600;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.vf-sub{color:var(--vf-muted);font-size:.85rem;font-variant-numeric:tabular-nums}
.vf-g1{background:linear-gradient(140deg,var(--vf-accent2),var(--vf-accent))}.vf-g2{background:linear-gradient(160deg,var(--vf-surface) 10%,var(--vf-accent))}
.vf-g3{background:linear-gradient(120deg,var(--vf-accent),var(--vf-surface2))}.vf-g4{background:linear-gradient(150deg,var(--vf-surface2),var(--vf-accent2))}
.vf-g5{background:linear-gradient(130deg,var(--vf-accent2),var(--vf-surface))}.vf-g6{background:linear-gradient(170deg,var(--vf-surface),var(--vf-accent2))}
.vf-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:1.4rem 1.1rem}
.vf-empty{grid-column:1/-1;color:var(--vf-muted)}
.vf-item{display:flex;flex-direction:column;gap:.35rem;min-width:0}
.vf-hits{list-style:none;margin:0;padding:0 .25rem;display:grid;gap:.15rem;font-size:.85rem}
.vf-hits a{color:var(--vf-text);text-decoration:none}.vf-hits a:hover{color:var(--vf-accent)}.vf-hits span{color:var(--vf-accent);font-variant-numeric:tabular-nums;margin-right:.35rem}
.vf-more{color:var(--vf-muted)}
.vf-pager{display:flex;flex-wrap:wrap;justify-content:center;gap:.35rem;margin:1.5rem 0}
.vf-pager button{min-width:2.4rem;border:0;cursor:pointer;background:var(--vf-surface);color:var(--vf-text);border-radius:8px;padding:.4rem .7rem}
.vf-pager button[aria-current]{background:var(--vf-accent);color:var(--vf-bg);font-weight:700}
/* watch page */
.vf-player{position:relative;background:#000;overflow:hidden}
.vf-player video{display:block;width:100%;aspect-ratio:16/9;background:#000}
.vf-tap{position:absolute;inset:0 0 3.5rem 0;display:none}
@media (hover:none){.vf-tap{display:block}}
.vf-bar{position:relative;display:flex;gap:3px;height:8px;margin:.6rem 0 0;cursor:pointer;touch-action:manipulation}
.vf-bar .vf-seg-c{position:relative;border-radius:3px;overflow:hidden;min-width:2px;background:color-mix(in srgb,var(--vf-accent) 40%,var(--vf-surface2))}
.vf-bar .vf-seg-c:nth-of-type(even){background:color-mix(in srgb,var(--vf-accent2) 45%,var(--vf-surface2))}
.vf-bar .vf-seg-c::before{content:"";position:absolute;left:0;top:0;bottom:0;width:var(--vf-fill,0%);background:var(--vf-fill-c,var(--vf-accent))}
.vf-bar .vf-seg-c>*{position:relative}
.vf-bar-pos{position:absolute;top:-4px;bottom:-4px;left:0;width:3px;margin-left:-1px;border-radius:2px;background:var(--vf-text);pointer-events:none}
.vf-marks{position:absolute;inset:0;pointer-events:none}
.vf-marks i{position:absolute;top:-4px;width:3px;height:calc(100% + 8px);margin-left:-1px;border-radius:2px;background:var(--vf-accent2)}
.vf-h1{font-size:1.4rem;line-height:1.25;margin:.8rem 0 .25rem}
.vf-row{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.8rem;align-items:center}
.vf-row select,.vf-row button,.vf-row .vf-btn2{font:inherit;font-size:.9rem;color:var(--vf-text);background:var(--vf-surface);border:1px solid var(--vf-surface2);border-radius:var(--vf-radius);padding:.45rem .8rem;cursor:pointer;text-decoration:none}
.vf-qpills{display:flex;flex-wrap:wrap;gap:.35rem}
.vf-list{list-style:none;margin:0;padding:0}
.vf-list li{display:flex;flex-wrap:wrap;align-items:center}
.vf-list li>button{flex:1 1 auto;display:flex;gap:.6rem;align-items:baseline;text-align:left;background:none;border:0;padding:.45rem .5rem;border-radius:6px;cursor:pointer;color:var(--vf-text);min-width:0}
.vf-list li>button:hover{background:var(--vf-surface2)}
.vf-list .vf-t{color:var(--vf-accent);font-variant-numeric:tabular-nums;min-width:4.2rem;flex:none}
.vf-list .vf-n{flex:1;min-width:0;overflow-wrap:anywhere}
.vf-list .vf-by{color:var(--vf-muted);font-size:.8rem;flex:none}
.vf-list small{padding:0 .5rem .3rem}
.vf-form{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin:.5rem 0}
.vf-form input:not([type=checkbox]),.vf-form textarea{flex:1 1 14rem;min-width:0;font:inherit;color:var(--vf-text);background:var(--vf-bg);border:1px solid var(--vf-surface2);border-radius:var(--vf-radius);padding:.45rem .6rem}
.vf-form textarea{flex-basis:100%;resize:vertical}
.vf-form button{font-weight:700;color:var(--vf-bg);background:var(--vf-accent);border:0;border-radius:var(--vf-radius);padding:.45rem .9rem;cursor:pointer}
.vf-check{display:flex;gap:.35rem;align-items:center;color:var(--vf-muted);font-size:.9rem}
.vf-comments{list-style:none;margin:.5rem 0 0;padding:0}
.vf-comments li{display:flex;gap:.7rem;padding:.7rem 0;border-top:1px solid var(--vf-surface2)}
.vf-ini{width:30px;height:30px;border-radius:50%;flex:none;display:grid;place-items:center;font-size:.8rem;font-weight:700;background:var(--vf-surface2);color:var(--vf-text)}
.vf-com-main{min-width:0;flex:1}
.vf-com-head{display:flex;flex-wrap:wrap;gap:.4rem;align-items:baseline}
.vf-com-body{white-space:pre-wrap;overflow-wrap:anywhere;margin-top:.2rem}
.vf-t,.vf-link,.vf-del{font:inherit;background:none;border:0;padding:0;color:var(--vf-accent);cursor:pointer}
.vf-del{font-size:.8rem;color:var(--vf-muted);text-decoration:underline}
.vf-err{margin:.6rem 1rem;padding:.6rem .8rem;border-radius:8px;background:var(--vf-surface);color:var(--vf-text);border-left:4px solid var(--vf-accent)}
.vf-tags{list-style:none;margin:.5rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.35rem}
.vf-tags a{display:inline-block;padding:.15rem .6rem;border-radius:999px;background:var(--vf-surface2);color:var(--vf-text);text-decoration:none;font-size:.85rem}.vf-tags a:hover{outline:1px solid var(--vf-accent)}
.vf-foot{text-align:center;color:var(--vf-muted);font-size:.85rem;padding:2rem 1rem}
.vf-foot a{color:var(--vf-accent)}
/* help-encode page */
.vf-prose{max-width:46rem}.vf-prose ol{padding-left:1.3rem}.vf-prose li{margin:.35rem 0}
.vf-card-box{background:var(--vf-surface);border-radius:var(--vf-radius);padding:.8rem 1rem;margin:1rem 0}.vf-card-box .vf-list li{display:list-item;padding:.2rem 0}
.vf-pre{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--vf-bg);padding:.6rem;border-radius:8px;font-size:.85rem}
@media (hover:none){.vf-search kbd{display:none}}
/* player controls (parts.js playerEl, watch.js initControls); the browser's controls show until the script runs */
.vf-player{--vf-ctl-fg:#fff;--vf-ctl-bg:linear-gradient(transparent,rgba(0,0,0,.78));--vf-played:var(--vf-accent)}
.vf-player:not(.vf-js) .vf-ctl,.vf-player:not(.vf-js) .vf-big,.vf-player:not(.vf-js) .vf-spin{display:none}
.vf-player.vf-js video{cursor:pointer}
.vf-player.vf-idle,.vf-player.vf-idle video{cursor:none}
.vf-ctl{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:2.4rem .75rem .45rem;background:var(--vf-ctl-bg);color:var(--vf-ctl-fg);display:flex;flex-direction:column;gap:.35rem;transition:opacity .2s;font-size:13px}
.vf-player.vf-idle .vf-ctl{opacity:0;pointer-events:none}
.vf-player.vf-idle .vf-ctl:focus-within{opacity:1;pointer-events:auto}
.vf-crow{display:flex;align-items:center;gap:.15rem;min-width:0}
.vf-cb{display:inline-grid;place-items:center;min-width:36px;height:36px;padding:0 .35rem;border:0;border-radius:8px;background:none;color:inherit;cursor:pointer;font:600 13px/1 var(--vf-font)}
.vf-cb:hover{background:rgba(255,255,255,.14)}
.vf-cb:focus-visible{outline:2px solid var(--vf-played);outline-offset:0}
.vf-player .i-pause,.vf-player .i-muted,.vf-player .i-exit{display:none}
.vf-player.vf-playing [data-act="play"] .i-play{display:none}.vf-player.vf-playing [data-act="play"] .i-pause{display:block}
.vf-player.vf-muted .i-vol{display:none}.vf-player.vf-muted .i-muted{display:block}
.vf-player.vf-fs .i-full{display:none}.vf-player.vf-fs .i-exit{display:block}
.vf-volw{display:inline-flex;align-items:center}
.vf-vol{width:0;opacity:0;transition:width .15s,opacity .15s;accent-color:var(--vf-played);margin:0}
.vf-volw:hover .vf-vol,.vf-volw:focus-within .vf-vol{width:72px;opacity:1;margin:0 .35rem 0 .1rem}
@media (hover:none){.vf-volw .vf-vol{display:none}}
.vf-time{font-variant-numeric:tabular-nums;white-space:nowrap;margin-left:.35rem;opacity:.95}
.vf-chap{opacity:.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;margin:0 .5rem}
.vf-chapn,.vf-momn{display:none}
.vf-chapn:not(:empty)::before,.vf-momn:not(:empty)::before{content:" · "}
.vf-sp{flex:1}
.vf-big{position:absolute;left:50%;top:50%;z-index:2;transform:translate(-50%,-50%);width:76px;height:76px;border-radius:50%;border:0;display:grid;place-items:center;background:var(--vf-played);color:var(--vf-bg);cursor:pointer;box-shadow:0 6px 24px rgba(0,0,0,.35);transition:transform .15s}
.vf-big svg{width:34px;height:34px}
.vf-big:hover{transform:translate(-50%,-50%) scale(1.06)}
.vf-player.vf-started .vf-big{display:none}
.vf-spin{position:absolute;left:50%;top:50%;z-index:1;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;border:3px solid rgba(255,255,255,.25);border-top-color:#fff;animation:vf-rot .8s linear infinite;display:none;pointer-events:none}
.vf-player.vf-wait.vf-started .vf-spin{display:block}
@keyframes vf-rot{to{transform:rotate(360deg)}}
/* the scrubber: chapter segments, buffered range, position, timestamp markers, hover time */
.vf-scrub{position:relative;display:flex;gap:3px;height:5px;margin:0 .35rem;cursor:pointer;touch-action:none;transition:height .12s}
.vf-scrub::before{content:"";position:absolute;left:0;right:0;top:-10px;bottom:-8px}
.vf-ctl:hover .vf-scrub,.vf-scrub:focus-visible{height:8px}
.vf-scrub .vf-seg-c{position:relative;border-radius:3px;overflow:hidden;min-width:2px;background:rgba(255,255,255,.28)}
.vf-scrub .vf-seg-c::before{content:"";position:absolute;left:0;top:0;bottom:0;width:var(--vf-fill,0%);background:var(--vf-fill-c,var(--vf-played))}
.vf-buf{position:absolute;left:0;top:0;bottom:0;width:0;background:rgba(255,255,255,.22);border-radius:3px;pointer-events:none}
.vf-scrub .vf-bar-pos{top:50%;bottom:auto;width:13px;height:13px;margin:-6.5px 0 0 -6.5px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.5);opacity:0;transition:opacity .12s}
.vf-ctl:hover .vf-scrub .vf-bar-pos,.vf-scrub:focus-visible .vf-bar-pos{opacity:1}
.vf-scrub .vf-marks i{top:-3px;height:calc(100% + 6px);width:3px;margin-left:-1.5px;border-radius:2px;background:var(--vf-accent2);box-shadow:0 0 0 1px rgba(0,0,0,.45)}
.vf-tip{position:absolute;bottom:calc(100% + 10px);transform:translateX(-50%);background:rgba(0,0,0,.85);color:#fff;font-size:12px;padding:.2rem .5rem;border-radius:6px;white-space:nowrap;pointer-events:none;font-variant-numeric:tabular-nums}
@media (max-width:560px){.vf-cb[data-act="back"],.vf-cb[data-act="fwd"],.vf-cb[data-act="pip"],.vf-chap{display:none}.vf-big{width:62px;height:62px}}
.vf-player.vf-fs{border-radius:0;display:flex;align-items:center;background:#000}
.vf-player.vf-fs video{height:100%;max-height:none}
