/* Maintained CSS reproducing the surviving site's black/lime/magenta identity. */
:root { color-scheme: light; --green:#3fff3f; --pink:#c400a5; }
* { box-sizing:border-box; }
body { margin:0; background:#efefef; color:#222; font:16px/1.5 Arial, sans-serif; }
a { color:var(--pink); text-decoration:none; }
a:hover { text-decoration:underline; }
button, input { font:inherit; }
button { cursor:pointer; }
img { max-width:100%; }
[hidden] { display:none !important; }
:focus-visible { outline:3px solid #aa0092; outline-offset:4px; }
.visually-hidden, .skip:not(:focus) { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.skip:focus { position:fixed; top:0; left:0; padding:12px; background:white; z-index:10; }
.brand { font-family:FilmotypeGinger, Impact, sans-serif; font-weight:normal; font-size:44px; line-height:1; letter-spacing:2px; color:var(--green); }
.brand img { object-fit:contain; height:auto; width:280px; display:block; }
.section-title { grid-column:1/-1; }
.editorial-block { grid-column:1/-1; margin:20px 0; }
.editorial-block h2, .editorial-block h3 { font-size:30px; font-weight:normal; }
.site-header { padding:12px 24px 18px; background:#000; color:#eee; }
.header-row { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.site-header h1 { margin:24px 0 0; text-align:center; font-size:clamp(26px, 4vw, 42px); font-weight:normal; line-height:1.2; }
.collections-nav { color:var(--green); line-height:1.9; }
.collections-nav a { color:#ff63e7; display:inline-block; padding:0 7px; }
.collections-nav a + a { border-left:1px solid #277727; }
.collections-nav span { display:inline-block; min-width:70px; }
.collection { max-width:1320px; margin:0 auto; padding:20px 30px 60px; }
.collection.best-of { display:grid; grid-template-columns:minmax(0,1fr) 170px; gap:0 40px; max-width:1160px; }
.best-of .collection-intro { grid-column:1/-1; }
.collection-outro { grid-column:1/-1; margin-top:30px; }
.best-of .filters { grid-column:2; grid-row:2; flex-direction:column; align-items:start; align-self:start; gap:2px; }
.best-of .video-grid { grid-column:1; grid-row:2; }
.collection.best-of:not(:has(.filters)) { grid-template-columns:minmax(0,1fr); max-width:1000px; }
.collection-intro { max-width:1050px; margin:0 auto 25px; }
.collection-intro:empty { display:none; }
.collection-intro p { font-size:20px; }
.filters { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:0 0 28px; padding:10px 14px; border-left:3px solid #00bd00; }
.filters button { border:0; background:transparent; color:var(--pink); padding:6px 10px; }
.filters button[aria-pressed=true] { background:#222; color:var(--green); }
.video-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:32px 22px; }
.video-card { min-width:0; }
.thumbnail { aspect-ratio:4/3; display:block; position:relative; background:linear-gradient(145deg,#262626,#535353); box-shadow:1px 3px 8px #999; overflow:hidden; }
.thumbnail img { width:100%; height:100%; object-fit:cover; display:block; }
.thumbnail-placeholder { position:absolute; inset:0; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:2px; padding:10px 8px 25px; color:#c2c8c4; font-size:11px; background:linear-gradient(145deg,#202823,#35433b); }
.mountain-mark { color:#779d85; font-size:48px; line-height:1; }
.thumbnail:has(img:not([hidden])) .thumbnail-placeholder { display:none; }
.play-label { position:absolute; inset:auto 0 0; padding:4px; font-size:12px; color:white; background:#000b; text-align:center; }
.video-card h3 { color:#222; font-size:15px; font-weight:normal; line-height:1.3; margin:9px 0; }
.video-card a:hover h3 { color:var(--pink); }
.video-card .editorial { display:none; }
.editorial dl { margin:0; }
.editorial dd { margin:0 0 12px; }
.editorial dd > span { font-weight:bold; }
.top-ten .video-grid { display:block; max-width:1024px; margin:auto; }
.top-ten .video-card { margin:0 auto 75px; }
.top-ten .thumbnail { aspect-ratio:auto; width:fit-content; max-width:100%; background:transparent; box-shadow:none; }
.top-ten .thumbnail img { width:auto; height:auto; max-width:100%; object-fit:contain; }
.top-ten .thumbnail-missing .thumbnail, .top-ten .thumbnail.thumbnail-missing { width:240px; aspect-ratio:16/9; background:linear-gradient(145deg,#262626,#535353); }
.top-ten .thumbnail.no-preview { width:240px; aspect-ratio:16/9; }
.top-ten .video-card h3 { font-size:26px; }
.top-ten .editorial { display:block; padding:0 20px 20px; border-left:1px solid #444; border-bottom:1px solid #444; }
.top-ten .editorial p { margin:8px 0; }
.site-footer { background:#111; color:#aaa; padding:24px; font-size:13px; text-align:center; }
.site-footer a { color:#ff63e7; }
body.home { background:#000; color:#ccc; }
.home-layout { display:grid; grid-template-columns:5fr 7fr; min-height:85vh; }
#cover { padding:15px 8px; }
#cover .brand { margin:0 0 24px; }
#cover .brand img { width:100px; height:auto; }
#cover .collections-nav { font-size:16px; }
#cover .collections-nav a { padding:0 4px; }
.archive-feature { min-width:0; padding:10px 18px 40px 10px; }
.gallery-filters { display:flex; flex-wrap:wrap; align-items:center; gap:12px; border-bottom:1px solid var(--green); margin:0 0 20px; padding:0 0 10px; }
.gallery-filters h2 { color:var(--green); font-size:16px; font-weight:normal; margin:0 auto 0 0; }
.gallery-filters select { max-width:160px; padding:4px; color:#bbb; background:#000; border:1px solid #444; font-size:12px; border-radius:0; }
.archive-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:34px 20px; }
.archive-grid .video-card { min-width:0; }
.archive-grid h3 { color:#aaa; font-size:14px; font-weight:normal; line-height:1.4; margin:8px 0 0; }
.archive-grid .thumbnail { aspect-ratio:16/9; box-shadow:none; background:none; }
.archive-grid .play-label { inset:50% auto auto 50%; transform:translate(-50%,-50%); width:38px; height:38px; font-size:0; padding:0; border:2px solid #fff9; border-radius:50%; background:#0005; opacity:0; }
.archive-grid .play-label::before { content:'▶'; display:block; font-size:18px; line-height:34px; text-align:center; padding-left:3px; }
.archive-grid .video-link:hover .play-label, .archive-grid .video-link:focus-visible .play-label { opacity:1; }
#gallery-pagination { display:flex; justify-content:space-between; align-items:center; gap:20px; margin:36px 0 0; font-size:13px; }
#gallery-pagination a { color:#bbb; }
#gallery-pagination a[aria-disabled=true] { color:#555; pointer-events:none; }
#gallery-page { color:#888; }
.video-date { margin:6px 0; font-size:12px; color:#aaa; }
dialog { width:min(1000px,95vw); max-height:94vh; border:1px solid #999; background:#222; color:#ddd; padding:20px; }
dialog::backdrop { background:#000d; }
dialog a { color:#ff7bea; }
.player-heading { display:flex; justify-content:space-between; align-items:start; gap:20px; margin-bottom:15px; }
.player-heading h2 { margin:0; font-size:21px; }
#player-close { background:#eee; color:#222; border:0; padding:8px 12px; flex-shrink:0; }
#player-frame:has(iframe) { aspect-ratio:16/9; }
#player-frame iframe { border:0; width:100%; height:100%; display:block; }
#player-status { font-size:14px; }
.player-navigation { display:flex; justify-content:space-between; gap:12px; margin:16px 0; }
.player-navigation button, #player-copy { padding:9px 12px; border:1px solid #67736a; border-radius:3px; background:#344239; color:#fff; }
.player-navigation button:disabled { opacity:.45; cursor:default; }
.share-tools { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin:18px 0; }
#player-link { flex:1; min-width:180px; max-width:100%; padding:9px; }
#copy-status { font-size:14px; }
.about-page { max-width:800px; margin:60px auto; padding:0 24px; min-height:50vh; }
.about-page h1 { font-size:36px; font-weight:normal; }
.about-page p { font-size:20px; line-height:1.7; }
.player-open { overflow:hidden; }
.error-page { max-width:800px; margin:80px auto; padding:20px; min-height:50vh; }
@media(max-width:1000px) { .header-row { flex-direction:column; gap:14px; } #cover .brand { max-width:none; font-size:50px; } .collection.best-of { display:block; } .best-of .filters { flex-direction:row; align-items:center; gap:8px; } }
@media(max-width:600px) { .brand { font-size:34px; } .site-header { padding:14px; } .collections-nav { font-size:14px; } .collections-nav a { padding:4px; } .collection { padding:20px 16px 40px; } .video-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px 18px; } .collection-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .top-ten .video-card h3 { font-size:21px; } dialog { padding:14px; } }
@media(max-width:1023px) { .home-layout { display:block; } #cover .brand { margin-bottom:16px; } #cover .brand img { width:280px; height:auto; } .archive-feature { padding:12px 20px 40px; } .archive-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) { .archive-grid { grid-template-columns:minmax(0,1fr); gap:34px; } .archive-grid h3 { font-size:16px; } #cover .collections-nav { font-size:14px; } #cover .collections-nav span { min-width:58px; } #cover .collections-nav a { padding:0 3px; } .gallery-filters { gap:8px; } .gallery-filters select { max-width:140px; } .brand img { width:auto; height:80px; } }