/* Preserve every upload; recommended ratios improve fit without forced cropping. */
.card-cover-image{width:100%;height:100%;object-fit:contain;background:#eaf0fa;display:block}
.game-cover:focus-visible{outline:3px solid #597ab8;outline-offset:-3px}
.detail-card-media{width:100%;aspect-ratio:16/9;max-height:400px;overflow:hidden;border:1px solid #dce5f1;border-radius:18px;background:#eaf0fa;margin:0 0 28px}
.detail-card-image{display:block;width:100%;height:100%;object-fit:contain}
.detail-logo{display:block;width:min(260px,70%);height:110px;object-fit:contain;object-position:left center;margin:4px 0 20px}
.featured-game-banner{display:grid;grid-template-columns:minmax(0,36%) minmax(0,64%);min-height:260px;margin:18px 0 26px;border-radius:18px;overflow:hidden;background:#e7edfa}
.featured-game-copy{display:flex;flex-direction:column;justify-content:center;gap:9px;padding:25px;color:#263f70}
.featured-game-copy strong{font-size:clamp(20px,2.5vw,30px);line-height:1.3}.featured-kicker{font-size:10px;font-weight:800;letter-spacing:.12em}
.featured-game-image{width:100%;height:100%;max-height:350px;object-fit:contain;background:#d9e4f4}
.screenshot-section{margin:30px 0}.screenshot-section h3{margin-bottom:14px}.screenshot-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.screenshot-thumb{border:1px solid #dce5f1;background:#eef3fa;border-radius:12px;padding:0;overflow:hidden;cursor:zoom-in;aspect-ratio:16/9}
.screenshot-thumb-image{width:100%;height:100%;object-fit:contain;display:block}.screenshot-thumb:focus-visible{outline:3px solid #597ab8}
.screenshot-lightbox{border:0;border-radius:18px;padding:20px;background:#fff;max-width:min(96vw,1200px);max-height:95vh;box-shadow:0 20px 65px #10284b66}
.screenshot-lightbox::backdrop{background:#0e193bc9}.lightbox-image{display:block;max-width:100%;max-height:70vh;object-fit:contain;margin:auto}
.lightbox-caption{text-align:center;margin:12px 0}.lightbox-close,.lightbox-nav{border:1px solid #d6e0ee;border-radius:8px;background:#f4f7fc;padding:8px 12px;margin:3px}
.lightbox-close{display:block;margin-left:auto;margin-bottom:10px}
@media(max-width:650px){.featured-game-banner{grid-template-columns:1fr}.featured-game-copy{padding:20px}.featured-game-image{max-height:240px;min-height:160px}.screenshot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.project-updates{margin-top:28px;border-top:1px solid #dfe8f4;padding-top:18px}
.project-updates[hidden]{display:none}
.project-update{border:1px solid #e2eaf4;background:#fff;border-radius:12px;padding:16px;margin:12px 0}
.project-update strong{display:block;color:#2b426d}
.project-update time{display:block;font-size:12px;color:#8391a5;margin:4px 0 10px}
.project-update p{white-space:pre-wrap;overflow-wrap:anywhere;margin:0 0 8px;color:#5b708b;line-height:1.8}
.brand-logo{display:block;width:64px;height:64px;border-radius:50%;object-fit:cover;box-shadow:0 4px 14px #2339612b;flex-shrink:0}
.header-layout{min-height:96px}
.hero-custom-image{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.hero-custom-image[hidden]{display:none}
.hero.has-custom-image::before,.hero.has-custom-image .hero-glow,.hero.has-custom-image .hero-art{display:none}
.hero.has-custom-image::after{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,#f8fbfff2 0%,#f8fbffcc 32%,#f8fbff00 70%);pointer-events:none}
.hero.has-custom-image .hero-grid{grid-template-columns:minmax(0,1fr);min-height:640px;z-index:2}
.hero.has-custom-image .hero-copy{max-width:590px}
.hero.has-custom-image .hero-divider{z-index:2}
.screenshot-section{max-width:920px;border:1px solid #dfe8f4;border-radius:22px;background:#fff;padding:28px;margin:24px 0 0;box-shadow:0 8px 28px #3852740b}
@media(max-width:780px){.brand-logo{width:54px;height:54px}.header-layout{min-height:82px}.site-nav{top:76px}}
@media(max-width:780px){
  .hero.has-custom-image::after{background:linear-gradient(90deg,#f8fbfff2 0%,#f8fbffb8 35%,#f8fbff00 65%)}
  .hero.has-custom-image .hero-custom-image{object-fit:contain;object-position:center top}
  .hero.has-custom-image .hero-grid{min-height:clamp(260px,50vw,410px);align-items:start;padding-top:12px;padding-bottom:10px}
  .hero.has-custom-image .hero-copy{width:53%;max-width:360px;min-width:0;overflow-wrap:anywhere}
  .hero.has-custom-image .eyebrow{padding:6px 8px;margin-bottom:8px}
  .hero.has-custom-image h1{font-size:clamp(27px,5vw,39px);line-height:1.2;margin-bottom:8px}
  .hero.has-custom-image .hero-intro{font-size:13px;line-height:1.5;margin-bottom:10px}
  .hero.has-custom-image .hero-actions{flex-wrap:nowrap;gap:6px}
  .hero.has-custom-image .hero-actions .btn{min-height:38px;padding:6px 7px;font-size:12px;gap:4px;white-space:nowrap}
  .hero.has-custom-image .hero-footnote{font-size:9px;line-height:1.4;margin-top:10px}
  .hero.has-custom-image .hero-divider{padding-top:6px;padding-bottom:6px;font-size:8px}
}
@media(max-width:530px){
  .brand-logo{width:50px;height:50px}.screenshot-section{padding:18px}
  .hero.has-custom-image .hero-grid{min-height:260px;padding-top:8px;padding-bottom:8px}
  .hero.has-custom-image .hero-copy{width:57%}
  .hero.has-custom-image h1{font-size:clamp(26px,7.5vw,31px);line-height:1.15}
  .hero.has-custom-image .hero-intro{font-size:12px;line-height:1.45;margin-bottom:8px}
  .hero.has-custom-image .eyebrow{font-size:8px;letter-spacing:0;padding:4px 6px;margin-bottom:6px}
  .hero.has-custom-image .hero-actions .btn{font-size:12px;min-height:38px;padding:6px 4px;gap:3px}
  .hero.has-custom-image .hero-footnote{font-size:10px;line-height:1.35;margin-top:8px}
}
