.yt-discovery { max-width:1280px; margin:0 auto; min-width:0; }
.yt-discovery [hidden] { display:none !important; }
.yt-heading { display:flex; align-items:center; justify-content:space-between; gap:2rem; margin:1rem 0 2rem; }
.yt-heading h1 { font-size:clamp(1.8rem,4vw,2.6rem); letter-spacing:-.04em; line-height:1.2; margin:.5rem 0; }
.yt-eyebrow { color:var(--accent2); font-size:.75rem; letter-spacing:.15em; font-weight:700; }
.yt-muted,.yt-channel { color:var(--muted); }
.yt-small { font-size:.8rem; }
.yt-search-row { display:flex; gap:.75rem; margin:1rem 0; }
.yt-search-row input { flex:1; min-width:0; width:100%; }
.yt-discovery input,.yt-discovery select { background:var(--surface); border:1px solid var(--border); color:var(--text); padding:.75rem; border-radius:var(--radius); font:inherit; }
.yt-filters { display:flex; gap:1rem; flex-wrap:wrap; margin:1rem 0 .5rem; }
.yt-filters label { display:flex; align-items:center; gap:.5rem; font-size:.85rem; }
#yt-status { margin:1.5rem 0 1rem; }
.yt-sorting { position:fixed; inset:0; width:min(22rem, calc(100vw - 2rem)); height:fit-content; margin:auto; border:1px solid var(--border); border-radius:12px; background:var(--surface); color:var(--text); padding:1.5rem 1.75rem; text-align:center; }
.yt-sorting::backdrop { background:rgba(0,0,0,.72); }
.yt-sorting h2 { font-size:1.05rem; margin-bottom:.45rem; }
.yt-sorting p { color:var(--muted); font-size:.85rem; line-height:1.5; }
.yt-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.5rem; }
.yt-card { min-width:0; background:var(--surface); border:1px solid var(--border); border-radius:12px; overflow:hidden; content-visibility:auto; contain-intrinsic-size:auto 28rem; }
.yt-thumb { display:block; aspect-ratio:16/9; background:var(--surface2); position:relative; }
.yt-thumb img { width:100%; height:100%; object-fit:cover; }
.yt-duration { position:absolute; right:.5rem; bottom:.5rem; background:#000d; color:white; border-radius:4px; padding:.05rem .35rem; font-size:.75rem; }
.yt-card-body { padding:1rem; }
.yt-card h2 { font-size:1rem; line-height:1.45; margin-bottom:.5rem; overflow-wrap:anywhere; }
.yt-card h2 a { color:var(--text); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.yt-channel { font-size:.85rem; overflow-wrap:anywhere; }
.yt-watch { display:inline-block; margin-top:.6rem; font-size:.8rem; }
.yt-pagination { text-align:center; margin:2rem 0; }
.yt-empty { text-align:center; padding:4rem 1rem; border:1px dashed var(--border); border-radius:var(--radius); margin:1.5rem 0; }
.yt-empty p { margin-top:.7rem; }
.yt-skeleton { border-radius:12px; overflow:hidden; background:var(--surface); padding-bottom:1rem; }
.yt-skeleton div { aspect-ratio:16/9; background:var(--surface2); }
.yt-skeleton p { height:1rem; background:var(--surface2); margin:1rem; width:70%; animation:yt-pulse 1.2s infinite alternate; }
@keyframes yt-pulse { to { opacity:.35; } }
.yt-ads { display:inline-block; margin:.35rem 0; padding:.15rem .55rem; border-radius:4px; background:var(--accent); color:#fff; font-size:.75rem; font-weight:700; letter-spacing:.08em; }
.yt-ads-thumb { position:absolute; left:.5rem; top:.5rem; z-index:3; margin:0; }
.yt-detail { display:grid; grid-template-columns:1fr 1fr; gap:2rem; margin:2rem 0; }
.yt-detail-image { width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; border-radius:12px; }
.yt-stats { display:flex; flex-wrap:wrap; gap:1rem 2rem; margin:1.5rem 0; }
.yt-stats dt { color:var(--muted); font-size:.8rem; }
.yt-stats dd { font-size:1.2rem; overflow-wrap:anywhere; }
.yt-description { white-space:pre-wrap; overflow-wrap:anywhere; margin:1rem 0 3rem; }
@media(max-width:1000px) { .yt-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) { .yt-grid,.yt-detail { grid-template-columns:1fr; } .yt-heading { display:block; } .yt-heading>a { display:inline-block; margin-top:1rem; } .yt-filters { gap:.6rem; } .yt-filters label { justify-content:space-between; width:100%; } .yt-filters select { width:65%; min-width:0; } }
@media(prefers-reduced-motion:reduce) { .yt-skeleton p { animation:none; } }
/* YouTube's own introduction, using the shared dark palette and gradient accents. */
.yt-landing { max-width:1280px; margin:0 auto 3rem; padding:3rem 0; display:grid; grid-template-columns:1.15fr 1fr; gap:4rem; align-items:center; position:relative; }
.yt-landing::before { content:""; position:absolute; inset:-2rem -1rem; background:radial-gradient(ellipse at 70% 40%,#fe2c5512,transparent 65%); pointer-events:none; z-index:-1; }
.yt-landing-badge { display:inline-flex; align-items:center; gap:.6rem; padding:.4rem .8rem; border:1px solid #fe2c5535; background:#fe2c5510; border-radius:999px; color:#ff8e9f; font-size:.78rem; font-weight:600; }
.yt-landing h1 { margin:1.25rem 0; font-size:clamp(2.6rem,4.6vw,4.5rem); line-height:1.08; letter-spacing:-.055em; overflow-wrap:anywhere; }
.yt-landing h1 span { background:linear-gradient(100deg,#fe2c55,#bd8bff); color:transparent; background-clip:text; -webkit-background-clip:text; }
.yt-landing-sub { max-width:520px; color:#aaa; font-size:1.05rem; line-height:1.8; }
.yt-landing-actions { display:flex; align-items:center; flex-wrap:wrap; gap:1.25rem; margin-top:1.75rem; }
.yt-landing-actions>a:last-child { font-size:.85rem; }
.yt-landing-note { color:var(--muted); font-size:.78rem; margin-top:1rem; }
.yt-flow { padding:2rem; border:1px solid #ffffff18; border-radius:24px; background:linear-gradient(150deg,#25161f,#141419 70%); box-shadow:0 24px 70px #0004; min-width:0; }
.yt-flow-orbit { width:110px; height:110px; margin:0 auto 1.5rem; display:grid; place-items:center; border-radius:50%; border:1px solid #ff536830; background:radial-gradient(circle,#ff536820,transparent 75%); }
.yt-flow-orbit svg { width:64px; color:#ff405f; filter:drop-shadow(0 10px 20px #fe2c5530); }
.yt-flow-label { font-size:.65rem; letter-spacing:.16em; color:#b38c9c; margin-bottom:1rem; text-align:center; }
.yt-flow-step { display:flex; align-items:center; gap:1rem; padding:1rem 0; border-top:1px solid #ffffff0e; }
.yt-flow-step>span:first-child { flex-shrink:0; display:grid; place-items:center; width:32px; height:32px; border:1px solid #ffffff15; border-radius:10px; color:#ff8e9f; font-size:.75rem; }
.yt-flow-step>span:last-child { color:#776474; margin-left:auto; }
.yt-flow-step strong { font-size:.9rem; font-weight:600; }
.yt-flow-step p { color:var(--muted); font-size:.78rem; }
.yt-heading h2 { font-size:clamp(1.4rem,3vw,2rem); letter-spacing:-.04em; margin-bottom:.4rem; }
#yt-search { scroll-margin-top:140px; }
.yt-landing-guide { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.5rem; max-width:1280px; margin:3rem auto; }
.yt-landing-guide>div { padding:1.5rem; border:1px solid var(--border); border-radius:14px; background:var(--surface); }
.yt-landing-guide span { font-size:.65rem; color:#ff8e9f; letter-spacing:.1em; }
.yt-landing-guide h2 { font-size:1rem; margin:.75rem 0 .5rem; }
.yt-landing-guide p { font-size:.85rem; color:var(--muted); line-height:1.8; }
.yt-seo { max-width:1280px; margin:0 auto 3rem; display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.yt-seo h2 { font-size:1.05rem; margin-bottom:.45rem; letter-spacing:-.02em; }
.yt-seo p { color:var(--muted); font-size:.9rem; line-height:1.7; }
@media(max-width:900px) { .yt-landing { gap:2rem; grid-template-columns:1fr; padding:1.5rem 0; } .yt-landing-copy { max-width:640px; } .yt-flow { display:none; } }
@media(max-width:600px) { .yt-landing { margin-bottom:2rem; } .yt-landing h1 { font-size:clamp(1.85rem,9vw,2.65rem); } .yt-landing-sub { font-size:.95rem; } .yt-landing-guide,.yt-seo { grid-template-columns:1fr; gap:1rem; margin-top:2rem; } .yt-landing-actions { gap:1rem; } }
.yt-demo-notice { display:block; padding:.85rem 1rem; border:1px solid #69c9d050; border-radius:10px; color:var(--accent2); background:#69c9d010; margin:0 auto 1.5rem; max-width:1280px; font-size:.85rem; }
.yt-channel-profile { margin-top:1rem; }
.yt-channel-profile>a,.yt-channel-profile>strong { font-size:1.05rem; }
.yt-analysis-state { margin-top:1.5rem; padding:1.15rem 1.25rem; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); line-height:1.6; }
.yt-analysis-state h3 { font-size:1rem; font-weight:600; margin:0 0 .7rem; }
.yt-analysis-state p { margin:.45rem 0; font-size:.95rem; }
.yt-analysis-state .yt-muted { color:#c8c8c8; }
.yt-analysis-state .yt-small { font-size:.9rem; }
.yt-analysis-state ul { list-style:none; margin:.7rem 0; padding:0; display:grid; gap:.4rem; }
.yt-analysis-state li::marker { content:none; }

.yt-performance-score {font-size:2.4rem;font-weight:750;margin:.5rem 0}.yt-performance-score span {font-size:1rem;font-weight:400}
.yt-card-analysis { margin:.75rem 0; padding:.9rem 1rem; border:1px solid var(--border); border-radius:8px; line-height:1.55; }
.yt-card-analysis p { margin:.4rem 0; overflow-wrap:anywhere; font-size:.92rem; color:#eee; }
.yt-card-analysis .yt-muted { color:#c8c8c8; }
/* Match the research card structure while keeping full video detail pages. */
.yt-card .card-banner { height:210px; aspect-ratio:auto; }
.yt-card .yt-score { background:#17131fe8; color:var(--accent2); }
.yt-card .yt-duration { z-index:3; }
.yt-card .stats-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.video-card.yt-card .stats-grid .sg-cell:nth-child(2) { display:block; }
.yt-card .yt-card-body { display:flex; flex-direction:column; flex:1; padding:0 1.25rem 1.25rem; }
.yt-card .yt-card-insights { margin:.75rem 0; }
.yt-card-insights summary { cursor:pointer; list-style:none; font-size:.9rem; padding:.55rem 0; color:var(--accent2); }
.yt-card-insights summary::-webkit-details-marker { display:none; }
.yt-card-insights summary::marker { content:none; }
.yt-card-links { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.6rem; padding:.75rem 0; font-size:.85rem; }
.yt-card-links .yt-watch { margin:0; }
.yt-save { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.5rem; margin-top:auto; padding-top:.75rem; border-top:1px solid var(--border); }
.yt-save label,.yt-save [data-saved-link],.yt-save [data-save-feedback] { grid-column:1/-1; font-size:.8rem; }
.yt-save label { color:var(--muted); }
.yt-save select { width:100%; min-width:0; font-size:.8rem; }
.yt-save button { min-height:44px; white-space:normal; }
.yt-save [data-save-feedback]:empty { display:none; }
.yt-detail + .yt-save { max-width:560px; margin:1rem 0 2rem; }
@media(max-width:380px) { .yt-save { grid-template-columns:1fr; } }
.yt-history { margin:2rem 0; padding:1.25rem; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); min-width:0; }
.yt-history h2 { font-size:1.15rem; margin-bottom:.5rem; }
.yt-history-chart { display:block; width:100%; height:auto; margin:1rem 0; overflow:visible; }
.yt-history-chart text { fill:var(--muted); font-size:11px; }
.yt-history-grid { stroke:var(--border); stroke-width:1; }
.yt-history-line { fill:none; stroke:var(--accent2); stroke-width:2; stroke-linejoin:round; }
.yt-history-chart circle { fill:var(--surface); stroke:var(--accent2); stroke-width:2; cursor:pointer; }
.yt-history-chart circle.is-selected { fill:var(--accent2); stroke:var(--text); }
.yt-history label { display:block; font-size:.85rem; margin:.5rem 0; }
.yt-history select { width:100%; max-width:100%; min-width:0; font-size:.8rem; }
#yt-history-readout { overflow-wrap:anywhere; margin:.5rem 0 1rem; }
.yt-history summary { cursor:pointer; color:var(--accent2); }
.yt-history-table { overflow-x:auto; }
.yt-history table { width:100%; text-align:left; border-collapse:collapse; font-size:.85rem; }
.yt-history th,.yt-history td { padding:.5rem; border-bottom:1px solid var(--border); }