/* Video page (/video/{id}): player first, the moment list beside it. */
.vp-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:24px;align-items:start;margin-bottom:24px}
.vp-player{aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:#000}.vp-player iframe{width:100%;height:100%;border:0;display:block}
.video-page h1{font-size:clamp(20px,2.4vw,28px);line-height:1.5;margin:18px 0 12px}
.vp-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.vp-creator{display:flex;align-items:center;gap:10px;color:var(--text-primary)}.vp-creator img{width:44px;height:44px;border-radius:50%;object-fit:cover}.vp-creator span{display:grid}.vp-creator small{color:var(--text-secondary);font-size:12px}
.vp-actions{display:flex;gap:8px;flex-wrap:wrap}.vp-actions .place-secondary{padding:9px 14px;font-size:13px}
.vp-desc{margin-top:16px}
.vp-moments{position:sticky;top:90px;max-height:calc(100vh - 110px);display:flex;flex-direction:column;margin:0!important;padding:18px!important}
.vp-moments h2{font-size:17px;display:flex;align-items:center;gap:8px}.vp-moments h2 i{color:var(--teal)}.vp-moments h2 span{margin-inline-start:auto;font-size:12px;background:var(--hover-bg);padding:2px 8px;border-radius:6px;color:var(--text-secondary)}
.vp-list{list-style:none;padding:0;margin:0;overflow-y:auto;display:grid;gap:2px}
.vp-list li{display:flex;align-items:center;gap:10px;padding:8px;border-radius:10px;scroll-margin:8px}
.vp-list li[aria-current]{background:rgba(232,131,26,.12)}
.vp-seek{display:flex;align-items:center;gap:6px;flex:none;color:var(--text-primary)}
.vp-num{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--teal);color:#fff;font-size:11px;font-weight:700}
.vp-list li[aria-current] .vp-num{background:var(--orange)}
.vp-time{min-width:48px;padding:3px 8px;border-radius:999px;background:var(--hover-bg);font:700 12px/1.4 var(--font-latin);direction:ltr;text-align:center;color:var(--teal)}
.vp-seek:hover .vp-time,.vp-seek:focus-visible .vp-time{background:var(--teal);color:#fff}
.vp-place{min-width:0;display:grid;font-size:14px;font-weight:600}.vp-place a{color:var(--text-primary)}.vp-place a:hover{color:var(--teal)}.vp-place small{font-size:11px;font-weight:400;color:var(--text-secondary)}
.vp-map{height:360px;border-radius:12px;direction:ltr;z-index:0}
.vp-pin span{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#008a7c;color:#fff;font:700 11px/1 var(--font-latin);border:2px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.35);transition:transform .15s}
.vp-pin.is-active span{background:var(--orange);transform:scale(1.3)}
.vp-hint{font-size:13px;color:var(--text-secondary);margin-top:10px}.vp-hint a{color:var(--teal);font-weight:700}
.vp-more{color:var(--text-primary);border:1px solid var(--border-color);border-radius:14px}.vp-more:hover{border-color:var(--teal)}
@media(max-width:900px){.vp-layout{grid-template-columns:1fr}.vp-moments{position:static;max-height:none}.vp-list{max-height:360px}}
@media(max-width:600px){.vp-player{border-radius:12px;margin:0 -4px}.vp-map{height:280px}.vp-actions{width:100%}.vp-actions .place-secondary{flex:1}}
@media(prefers-reduced-motion:reduce){.vp-pin span{transition:none}}
