/* Compact overlay previews; scoped to the overlay page. */
html body.r6-overlay-page #mainContent{padding-top:24px!important}
html body.r6-overlay-page .overlay-hero{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:40px;align-items:center;padding:10px 0 30px}
html body.r6-overlay-page .overlay-eyebrow{margin:0 0 12px;color:#ff9aac;font-size:12px;font-weight:750;letter-spacing:.13em}
html body.r6-overlay-page h1{font-size:clamp(32px,3.6vw,48px);line-height:1.1;margin:0 0 18px;max-width:18ch}
html body.r6-overlay-page .overlay-lead{font-size:20px;color:#f5f5f5;margin:0 0 12px}
html body.r6-overlay-page .overlay-description{max-width:48ch;color:#c9c9c9;font-size:16px;line-height:1.65;margin:0}
html body.r6-overlay-page .overlay-release-note{max-width:52ch;margin:20px 0 0;padding-left:14px;border-left:2px solid #f05c73;color:#b8b8b8;font-size:14px;line-height:1.65}
html body.r6-overlay-page .overlay-previews{padding:0 0 24px}
html body.r6-overlay-page .overlay-previews header{margin-bottom:16px}
html body.r6-overlay-page .overlay-previews h2{font-size:24px;margin:0 0 6px}
html body.r6-overlay-page .overlay-previews header p{font-size:15px;color:#c9c9c9;margin:0}
html body.r6-overlay-page .overlay-gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
html body.r6-overlay-page .overlay-preview{min-width:0;margin:0;overflow:hidden;border:1px solid #404040;border-radius:9px;background:#1a1a1a}
html body.r6-overlay-page .overlay-preview a{display:block;line-height:0;cursor:zoom-in}
html body.r6-overlay-page .overlay-preview img{display:block;width:100%;height:auto;aspect-ratio:1.5;object-fit:contain;background:#101418}
html body.r6-overlay-page .overlay-hero-preview img{max-height:360px}
html body.r6-overlay-page .overlay-preview figcaption{padding:10px 14px;font-size:15px;font-weight:650;color:#f5f5f5}
html body.r6-overlay-page .overlay-preview figcaption span{display:block;font-size:12px;font-weight:400;color:#b8b8b8;margin-top:2px}
html body.r6-overlay-page .overlay-preview-note{max-width:110ch;margin:16px 0 0;color:#b8b8b8;font-size:13px;line-height:1.65}
html body.r6-overlay-page .overlay-next{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:24px 0;border-top:1px solid #404040}
html body.r6-overlay-page .overlay-next h2{font-size:21px;margin:0 0 6px}
html body.r6-overlay-page .overlay-next p{margin:0;max-width:64ch;color:#c9c9c9;font-size:15px}
html body.r6-overlay-page .overlay-site-link{display:inline-flex;align-items:center;justify-content:center;gap:20px;min-height:44px;padding:10px 16px;border:1px solid #777;border-radius:7px;color:#f5f5f5;text-decoration:none;font-weight:650;white-space:nowrap}
html body.r6-overlay-page .overlay-site-link:hover{background:#282828;border-color:#aaa}
html body.r6-overlay-page .overlay-viewer[hidden]{display:none!important}
html body.r6-overlay-page .overlay-viewer{position:fixed;inset:0;z-index:3000;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(0,0,0,.9)}
html body.r6-overlay-page .overlay-viewer-panel{display:flex;flex-direction:column;max-width:1400px;width:100%;max-height:calc(100dvh - 40px);padding:16px;background:#171717;border:1px solid #555;border-radius:12px;overflow:auto}
html body.r6-overlay-page .overlay-viewer-header{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:12px;flex:none}
html body.r6-overlay-page .overlay-viewer-header h2{font-size:20px;margin:0}
html body.r6-overlay-page .overlay-viewer button{min-height:44px;padding:8px 14px;border:1px solid #737373;border-radius:6px;background:#252525;color:#f5f5f5;cursor:pointer;font-size:14px;font-weight:650}
html body.r6-overlay-page #overlayViewerImage{display:block;width:100%;min-height:0;max-height:calc(100dvh - 208px);object-fit:contain;flex:1 1 auto}
html body.r6-overlay-page .overlay-viewer-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;flex:none}
html body.r6-overlay-page .overlay-viewer-controls p{margin:0;color:#c9c9c9;font-size:14px}
html body.r6-overlay-page .overlay-viewer-note{margin:10px 0 0;text-align:center;color:#b8b8b8;font-size:12px;flex:none}
@media(max-width:900px){html body.r6-overlay-page .overlay-hero{gap:24px}html body.r6-overlay-page h1{font-size:34px}html body.r6-overlay-page .overlay-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){html body.r6-overlay-page #mainContent{padding-top:16px!important}html body.r6-overlay-page .overlay-hero{grid-template-columns:minmax(0,1fr);gap:20px;padding:0 0 24px}html body.r6-overlay-page h1{font-size:32px;margin-bottom:12px}html body.r6-overlay-page .overlay-lead{font-size:18px}html body.r6-overlay-page .overlay-release-note{margin-top:14px}html body.r6-overlay-page .overlay-gallery{gap:12px}html body.r6-overlay-page .overlay-preview figcaption{padding:9px 10px;font-size:13px}html body.r6-overlay-page .overlay-preview figcaption span{font-size:11px}html body.r6-overlay-page .overlay-next{align-items:flex-start;flex-direction:column;gap:16px}html body.r6-overlay-page .overlay-viewer{padding:8px}html body.r6-overlay-page .overlay-viewer-panel{padding:10px;max-height:calc(100dvh - 16px)}html body.r6-overlay-page .overlay-viewer-header{gap:12px}html body.r6-overlay-page .overlay-viewer-header h2{font-size:17px}html body.r6-overlay-page .overlay-viewer button{padding:8px 10px}html body.r6-overlay-page #overlayViewerImage{max-height:calc(100dvh - 200px)}}

html body.r6-overlay-page .overlay-features{padding:0 0 32px}
html body.r6-overlay-page .overlay-features header{margin-bottom:18px}
html body.r6-overlay-page .overlay-features h2{font-size:24px;margin:0 0 6px}
html body.r6-overlay-page .overlay-features header p{margin:0;max-width:80ch;color:#c9c9c9;font-size:15px;line-height:1.65}
html body.r6-overlay-page .overlay-feature-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 24px;list-style:none;margin:0;padding:0}
html body.r6-overlay-page .overlay-feature-list li{min-width:0;padding:16px 0;border-top:1px solid #404040}
html body.r6-overlay-page .overlay-feature-list h3{margin:0 0 6px;font-size:16px;color:#f5f5f5}
html body.r6-overlay-page .overlay-feature-list p{margin:0;color:#c9c9c9;font-size:14px;line-height:1.65}
@media(max-width:900px){html body.r6-overlay-page .overlay-feature-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){html body.r6-overlay-page .overlay-features{padding-bottom:24px}}
@media(max-width:380px){html body.r6-overlay-page .overlay-feature-list{grid-template-columns:minmax(0,1fr)}}
