.clips-page{padding-block:4rem 6rem}
.clips-section{padding-block:4rem 5rem}
.clips-section h2{margin:.45rem 0 1rem;font-family:Georgia,"Times New Roman",serif;font-size:clamp(2.3rem,5vw,4.7rem);font-weight:400;line-height:.97;letter-spacing:-.045em}
.clips-section>p{max-width:720px;color:var(--muted);line-height:1.55}
.clips-section .clips-grid{margin-top:1.5rem}
.clips-intro{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr);align-items:end;gap:3rem;margin-bottom:2.5rem}
.clips-intro h1{max-width:760px;margin:.45rem 0 1rem;font-family:Georgia,"Times New Roman",serif;font-size:clamp(3rem,7vw,6.4rem);font-weight:400;line-height:.9;letter-spacing:-.06em}
.clips-intro>div>p:last-child{max-width:650px;color:var(--muted);line-height:1.6}
.clips-facts{padding:1.4rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--ink-2)}
.clips-status{margin:0;line-height:1.55}
.clips-status.is-stale{color:#ffd2bf}
.clips-source{margin:.75rem 0 0;color:var(--muted);font-size:.78rem;line-height:1.5}
.clips-source a{color:var(--lime)}
.clips-toolbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:2rem 0 1.4rem}
.clips-tabs{display:inline-flex;padding:.25rem;border:1px solid var(--line);border-radius:999px;background:var(--ink-2)}
.clips-tabs button{border:0;border-radius:999px;padding:.7rem 1rem;background:transparent;color:var(--muted);font:inherit;font-size:.78rem;font-weight:750;cursor:pointer}
.clips-tabs button[aria-selected=true]{background:var(--lime);color:var(--ink)}
#clips-count{color:var(--muted);font-size:.78rem}
.clips-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin:0;padding:0;list-style:none}
.clip-card{min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:1rem;background:var(--ink-2)}
.clip-card.is-requested{border-color:var(--lime);box-shadow:0 0 0 2px #c7ff4530}
.clip-media{position:relative;display:grid;width:100%;aspect-ratio:16/9;overflow:hidden;border:0;border-bottom:1px solid var(--line);padding:0;background:#080906;color:var(--ivory);cursor:pointer}
a.clip-media{text-decoration:none}
.clip-media img{width:100%;height:100%;object-fit:cover;transition:transform .25s ease,filter .25s ease}
.clip-media:hover img,.clip-media:focus-visible img{transform:scale(1.025);filter:brightness(.78)}
.clip-image-missing{display:grid;place-items:center;padding-top:4rem;color:var(--muted);font-size:.75rem}
.clip-play{position:absolute;left:50%;top:50%;display:grid;width:48px;height:48px;place-items:center;border-radius:50%;background:var(--lime);color:var(--ink);box-shadow:0 8px 30px #0009;transform:translate(-50%,-50%)}
.clip-body{padding:1rem}
.clip-body h3{display:-webkit-box;min-height:2.7em;margin:0;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:1rem;line-height:1.35}
.clip-broadcaster{margin:.45rem 0;color:var(--lime);font-size:.78rem;font-weight:750}
.clip-metrics{display:flex;flex-wrap:wrap;gap:.35rem 1rem;margin:.8rem 0;color:var(--muted);font-size:.72rem}
.clip-metrics strong{color:var(--ivory);font-variant-numeric:tabular-nums}
.clip-external{font-size:.75rem;color:var(--muted)}
.clips-empty{padding:4rem 1rem;border:1px dashed var(--line);border-radius:var(--radius);color:var(--muted);text-align:center}
.clip-player{margin:0 0 2rem;padding:1rem;border:1px solid var(--lime);border-radius:var(--radius);background:#090a08}
.clip-player-head{display:flex;align-items:start;justify-content:space-between;gap:1rem;margin-bottom:1rem}
.clip-player-head h2{margin:0;font-size:1.1rem}
.clip-player-close{flex:0 0 auto;border:1px solid var(--line);border-radius:999px;padding:.55rem .8rem;background:transparent;color:var(--ivory);font:inherit;cursor:pointer}
.clip-player-frame{width:100%}
.clip-player-frame iframe{display:block;width:100%;min-width:400px;min-height:300px;aspect-ratio:16/9;border:0;background:#000}
.clip-player-message{margin:.75rem 0 0;color:var(--muted);font-size:.78rem}
.clip-player-message a{color:var(--lime)}
@media(max-width:850px){.clips-intro{grid-template-columns:1fr;gap:1.2rem}.clips-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.clips-page{padding-block:2.5rem 4rem}.clips-grid{grid-template-columns:1fr}.clips-toolbar{align-items:flex-start;flex-direction:column}.clips-tabs{width:100%}.clips-tabs button{flex:1}.clips-intro h1{font-size:clamp(2.8rem,15vw,4.5rem)}}
@media(prefers-reduced-motion:reduce){.clip-media img{transition:none}.clip-player{scroll-behavior:auto}}