/* Watch: the video hub (/watch/) and single video pages. Loaded only there. */
.v-page{--v-gap:var(--space-4)}
.v-muted{color:var(--muted)}
.v-strong{font-weight:600}
.v-balance{text-wrap:balance}
.v-eyebrow{color:var(--human);text-transform:uppercase}
.v-cta{display:inline-flex;align-items:center;gap:var(--space-2);color:var(--human)}

/* Hero and filters */
.v-hero{padding-top:var(--space-8);padding-bottom:var(--space-5);display:grid;gap:var(--space-4)}
.v-lede{max-width:620px;color:var(--text);text-wrap:pretty}
.v-chips{display:flex;flex-wrap:nowrap;gap:var(--space-2);overflow-x:auto;padding:var(--space-2) 0 2px;scrollbar-width:none}
.v-chips .hu-tab{flex:none;cursor:pointer;font:inherit}
.v-filters{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3) var(--space-5)}
.v-segs{display:flex;gap:var(--space-1);padding:3px;border:1px solid var(--line);border-radius:999px}
.v-seg{background:transparent;color:var(--muted);cursor:pointer;border:0;border-radius:999px;padding:7px 14px;min-height:36px;white-space:nowrap;font-weight:500}
.v-seg[aria-pressed="true"]{background:var(--text);color:var(--void)}
.v-sorts{display:flex;gap:var(--space-1);margin-left:auto}
.v-sort{cursor:pointer;background:none;border:0;border-bottom:2px solid transparent;color:var(--muted);padding:10px;min-height:44px;font-weight:600}
.v-sort[aria-pressed="true"]{color:var(--text);border-bottom-color:var(--human)}

/* Cards */
.v-card{display:grid;gap:var(--space-2);align-content:start;color:var(--text);text-decoration:none;min-width:0}
.v-card:hover{color:var(--text)}
.v-thumb{position:relative;display:block;aspect-ratio:16/9;border-radius:var(--radius-md);overflow:hidden;background:var(--surface);border:1px solid var(--line)}
.v-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 600ms cubic-bezier(.2,.7,.2,1)}
.v-card:hover .v-thumb img{transform:scale(1.03)}
.v-lvl{position:absolute;left:8px;top:8px;padding:1px 7px;border-radius:4px;background:rgba(6,8,10,.8);font-weight:600;font-size:.6875rem;letter-spacing:.04em;text-transform:uppercase;color:var(--human)}
.v-lvl[data-level="Advanced"]{color:var(--ai)}
.v-dur{position:absolute;right:8px;bottom:8px;padding:1px 6px;border-radius:4px;background:rgba(6,8,10,.85);color:#fff;font-weight:600}
.v-num{position:absolute;left:8px;bottom:8px;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--human);color:var(--on-accent);font-weight:700;font-size:.8125rem}
.v-title,.v-why{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden}
.v-title{-webkit-line-clamp:2;font-weight:600;line-height:1.3}
.v-meta{color:var(--muted)}
.v-why{-webkit-line-clamp:2;color:var(--muted)}

/* Featured pick */
.v-featured-wrap{padding-top:var(--space-4);padding-bottom:var(--space-6)}
.v-featured{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:var(--space-6);align-items:center;padding:var(--space-4);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);color:var(--text);text-decoration:none;transition:border-color 240ms}
.v-featured:hover{border-color:var(--line-strong);color:var(--text)}
.v-featured-media{position:relative;display:block;aspect-ratio:16/9;border-radius:var(--radius-md);overflow:hidden;background:var(--void)}
.v-featured-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.v-featured-media .v-dur{right:10px;bottom:10px}
.v-play{position:absolute;inset:0;margin:auto;display:grid;place-items:center;width:72px;height:72px;border-radius:50%;background:rgba(6,8,10,.6);border:1px solid rgba(255,255,255,.25);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#fff}
.v-play-lg{width:84px;height:84px;background:var(--human);border:0;color:var(--on-accent);-webkit-backdrop-filter:none;backdrop-filter:none}
.v-featured-body{display:grid;gap:var(--space-3);padding:var(--space-2) var(--space-3) var(--space-2) 0}
.v-featured-why{color:var(--text);text-wrap:pretty}
.v-featured-by{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2) var(--space-4)}
.v-by{display:flex;align-items:center;gap:var(--space-2);color:var(--text)}

/* Shelves */
.v-shelf-section{padding-top:var(--space-4);padding-bottom:var(--space-5);display:grid;gap:var(--space-3)}
.v-shelf-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-4)}
.v-shelf-titles{display:grid;gap:2px}
.v-seeall,.v-clear{cursor:pointer;border:0;background:none;color:var(--human);display:inline-flex;align-items:center;gap:6px;min-height:44px}
.v-shelf{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(260px,1fr);gap:var(--space-4);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;padding-bottom:var(--space-3);scrollbar-width:thin;scrollbar-color:#2a323a transparent}
.v-shelf::-webkit-scrollbar{height:6px}
.v-shelf::-webkit-scrollbar-thumb{background:#2a323a;border-radius:6px}
.v-shelf .v-card{scroll-snap-align:start}
.v-shelf:focus-visible{outline:2px solid var(--focus-ring);outline-offset:4px}

/* Creators */
.v-creators{padding-top:var(--space-5);padding-bottom:var(--space-9);display:grid;gap:var(--space-4)}
.v-creator-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,170px),1fr));gap:var(--space-3)}
.v-creator{display:grid;justify-items:center;gap:var(--space-2);padding:var(--space-5) var(--space-3);text-align:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);color:var(--text);text-decoration:none;transition:border-color 240ms}
.v-creator:hover{border-color:var(--line-strong);color:var(--text)}
.v-creator-name{font-weight:600}
.v-av{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;background:var(--human-soft);color:var(--human);font-weight:600;font-size:.75rem}
.v-av[data-tone="ai"]{background:var(--ai-soft);color:var(--ai)}
.v-creator .v-av,.v-av-lg{width:56px;height:56px;font-size:1rem}
.v-av-lg{width:52px;height:52px}

/* Results */
.v-results{padding-top:var(--space-4);padding-bottom:var(--space-9);display:grid;gap:var(--space-5)}
.v-results[hidden],[data-v-browse][hidden],.v-grid .v-card[hidden],[data-v-empty][hidden]{display:none}
.v-results-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:var(--space-3)}
.v-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:var(--space-6) var(--space-4)}

/* Single video */
.v-detail{padding-top:var(--space-6);padding-bottom:var(--space-9);display:grid;gap:var(--space-6)}
.v-detail-cols{display:flex;flex-wrap:wrap;gap:var(--space-7);align-items:flex-start}
.v-detail-main{flex:2 1 560px;min-width:0;display:grid;gap:var(--space-5)}
.v-detail-side{flex:1 1 300px;display:grid;gap:var(--space-5);min-width:0}
.v-player{position:relative;aspect-ratio:16/9;border-radius:var(--radius-lg);overflow:hidden;background:var(--void);border:1px solid var(--line)}
.v-player-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.v-player-btn{position:absolute;inset:0;width:100%;padding:0;border:0;cursor:pointer;background:rgba(6,8,10,.25)}
.v-player-btn .v-dur{right:12px;bottom:12px;padding:2px 8px}
.v-player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.v-head{display:grid;gap:var(--space-3)}
.v-badges{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2)}
.v-why-box,.v-creator-box{display:grid;gap:var(--space-3);padding:var(--space-5);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg)}
.v-takeaways{margin:0;padding:0;list-style:none;display:grid;gap:var(--space-3)}
.v-takeaways li{display:grid;grid-template-columns:32px 1fr;gap:var(--space-3);color:var(--text)}
.v-num-label{color:var(--human);padding-top:4px}
.v-chapters{display:grid;border-top:1px solid var(--line)}
.v-ch{display:grid;grid-template-columns:56px 1fr;gap:var(--space-3);align-items:center;min-height:48px;padding:var(--space-2);text-align:left;cursor:pointer;background:transparent;border:0;border-bottom:1px solid var(--line);color:var(--text)}
.v-ch[aria-current="true"],.v-ch:hover{background:var(--surface)}
.v-ch-time{color:var(--human)}
.v-mentions{display:grid;gap:var(--space-2)}
.v-mention{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);color:var(--text);text-decoration:none}
.v-mention:hover{border-color:var(--line-strong);color:var(--text)}
.v-mention-text{display:grid}
.v-creator-box-head{display:flex;align-items:center;gap:var(--space-3)}
.v-creator-box-links{display:flex;flex-wrap:wrap;gap:var(--space-2)}

@media (max-width:640px){
.v-hero{padding-top:var(--space-7)}
.v-sorts{margin-left:0}
.v-featured{gap:var(--space-4);padding:var(--space-3)}
.v-featured-body{padding:0 var(--space-2) var(--space-2)}
.v-shelf{grid-auto-columns:minmax(240px,78%)}
}
@media (prefers-reduced-motion:reduce){.v-thumb img{transition:none}.v-card:hover .v-thumb img{transform:none}}
