/*
  SNBK v77 visual restoration.
  Design tokens, masthead, condensed editorial typography and home composition
  based on the archived v77 source (white.css + site-shell.tsx + page.tsx).
  Served over the read-only recovery backend.
*/
:root {
  --white-bg:#f5f4ef;
  --white-paper:#fff;
  --white-ink:#111214;
  --white-muted:#686b70;
  --white-line:#d4d3ce;
  --white-orange:#ff8b1f;
}
html { background:var(--white-bg); }
body { background:var(--white-bg); color:var(--white-ink); font:400 15px/1.5 "Roboto",Arial,system-ui,sans-serif; }
.site-root { background:var(--white-bg); color:var(--white-ink); min-height:100vh; }
.site-root h1,.site-root h2,.site-root h3,.site-root h4,.site-root .desktop-nav a { font-family:"Roboto Condensed","Arial Narrow",Arial,sans-serif; }
.site-root a { color:inherit; }
.site-root a:hover { color:var(--white-orange); }
.page-frame { width:100%; max-width:none; margin:0 auto; min-height:calc(100vh - 350px); }
.site-root .masthead { position:relative; top:auto; z-index:30; height:auto; min-height:88px; background:rgba(255,255,255,.98); border-bottom:1px solid var(--white-line); box-shadow:0 1px rgba(0,0,0,.05); }
.header-main { max-width:1440px; width:100%; margin:auto; height:88px; display:grid; grid-template-columns:185px minmax(0,1fr) auto; align-items:stretch; }
.site-root .brand { padding:0; margin:9px 0 9px 14px; display:flex; justify-content:center; align-items:center; width:auto; min-width:0; height:auto; border:0; border-radius:11px; background:#0b0c0c; overflow:hidden; line-height:1; flex-shrink:unset; }
.brand-wordmark { color:#f5f2eb; display:flex; flex-direction:column; justify-content:center; align-items:center; width:100%; height:100%; line-height:1; }
.brand-wordmark b { font:900 38px/.85 "Arial Narrow",Impact,"Roboto Condensed",sans-serif; font-stretch:condensed; letter-spacing:.065em; transform:scaleX(1.08); }
.brand-wordmark small { display:block; font:700 10px/1 "Roboto",Arial,sans-serif; letter-spacing:.63em; padding-left:.6em; margin-top:7px; color:#f1eee8; }
.desktop-nav { display:flex; align-items:stretch; justify-content:flex-start; gap:0; padding-left:16px; min-width:0; }
.desktop-nav a { min-width:105px; padding:1rem 13px; display:flex; justify-content:center; align-items:center; text-transform:uppercase; color:#17181a; font-weight:750; font-size:15px; letter-spacing:.005em; border-bottom:3px solid transparent; transition:color 140ms ease, border-color 140ms ease, background 140ms ease; }
.desktop-nav a:hover { border-color:var(--white-orange); color:#111; background:#fff6ed; }
.header-actions { display:flex; align-items:center; gap:10px; padding:0 19px 0 12px; }
.search-toggle { display:grid; place-items:center; width:45px; height:45px; color:#17181a; border:1px solid var(--white-line); border-radius:9px; background:transparent; cursor:pointer; }
.search-toggle:hover,.search-toggle[aria-expanded="true"] { background:var(--white-orange); color:#111; border-color:var(--white-orange); }
.mobile-menu { display:block; position:relative; }
.mobile-menu summary { min-height:45px; display:flex; align-items:center; gap:10px; padding:0 15px; border:1px solid var(--white-line); border-radius:9px; font:700 13px "Roboto Condensed","Roboto",Arial,sans-serif; letter-spacing:.04em; text-transform:uppercase; background:#fff; cursor:pointer; user-select:none; list-style:none; }
.mobile-menu summary::-webkit-details-marker { display:none; }
.mobile-menu[open] summary { background:#f9f2e9; border-color:var(--white-orange); }
.mobile-menu nav { position:absolute; top:calc(100% + 12px); right:0; display:grid; gap:0; min-width:245px; padding:12px; border-radius:12px; background:#fff; border:1px solid var(--white-line); box-shadow:0 16px 34px #0a0b0c24; z-index:35; }
.mobile-menu nav a { display:block; padding:11px 13px; border-radius:7px; font-size:14px; font-weight:700; }
.mobile-menu nav a:hover { background:#fff5eb; color:#131313; }
.search-overlay { position:absolute; top:88px; right:0; left:0; z-index:29; padding:30px 22px; background:#fff; border-bottom:1px solid var(--white-line); box-shadow:0 20px 30px #1111; }
.search-overlay[hidden] { display:none; }
.site-search { max-width:840px; margin:0 auto; }
.site-search>label { display:block; font:800 20px "Roboto Condensed",sans-serif; margin-bottom:12px; }
.site-search>div { display:flex; gap:11px; }
.site-search input { width:100%; min-width:0; height:50px; padding:0 14px; background:#f5f4ef; border:1px solid var(--white-line); border-radius:8px; outline-offset:2px; }
.site-search button { background:#131313; color:#fff; padding:0 25px; border:0; border-radius:8px; font-weight:800; cursor:pointer; white-space:nowrap; }
.white-home { max-width:1440px; margin:0 auto; padding:34px 30px 80px; }
.white-home a:hover h1,.white-home a:hover h2,.white-home a:hover h3,.white-home a:hover strong { color:var(--white-orange); }
.w-lead,.w-briefs,.w-picks,.w-news,.w-duo>.w-pc,.w-duo>.w-consoles { border-radius:16px; overflow:hidden; }
.w-lead { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(390px,1fr); background:#fff; border:1px solid var(--white-line); min-height:585px; }
.w-lead-story { min-width:0; border-right:1px solid var(--white-line); }
.w-lead-image { display:block; aspect-ratio:16/9; overflow:hidden; background:#e9e8e3; }
.w-lead-image img { width:100%; height:100%; object-fit:cover; display:block; transition:transform 300ms ease; }
.w-lead-image:hover img { transform:scale(1.018); }
.w-lead-copy { min-height:142px; padding:20px 28px 24px; display:grid; grid-template-columns:minmax(0,1fr) auto; align-content:start; column-gap:21px; }
.w-byline { grid-column:1/-1; display:flex; align-items:center; gap:16px; font-size:12px; font-weight:750; color:#82868a; }
.w-byline span:first-child { color:#ea811d; font-size:11px; letter-spacing:.045em; text-transform:uppercase; }
.w-lead-copy h1 { grid-column:1; margin:12px 0 7px; font:800 clamp(30px,2.6vw,40px)/1.02 "Roboto Condensed","Arial Narrow",Arial,sans-serif; letter-spacing:-.035em; color:#111; }
.w-lead-copy p { grid-column:1; margin:0; color:var(--white-muted); font-size:14px; line-height:1.43; }
.w-read { grid-column:2; grid-row:2 / span 2; display:flex; align-self:end; align-items:center; justify-content:center; gap:8px; padding:10px 13px; border-radius:0; border-bottom:2px solid var(--white-orange); color:#161616; text-transform:uppercase; font-size:11px; font-weight:900; white-space:nowrap; }
.w-read span { color:var(--white-orange); font-size:16px; }
.w-latest { padding:22px 24px; display:flex; flex-direction:column; min-width:0; background:#fff; }
.w-latest header { display:flex; align-items:end; justify-content:space-between; gap:10px; padding:0 0 14px; border-bottom:3px solid #151515; }
.w-latest header h2 { margin:0; font:800 28px/1 "Roboto Condensed",sans-serif; letter-spacing:-.028em; }
.w-latest header a { font-size:11px; text-transform:uppercase; white-space:nowrap; font-weight:900; }
.heritage-news-row { flex:1; min-height:63px; display:grid; grid-template-columns:70px minmax(0,1fr) 15px; align-items:center; gap:11px; padding:7px 0; border-bottom:1px solid #e6e4df; }
.heritage-news-row:last-child { border-bottom:0; }
.heritage-news-thumb { display:grid; place-items:center; background:#161616; border-radius:8px; height:46px; width:70px; color:#fff; font-size:10px; font-weight:900; overflow:hidden; }
.heritage-news-thumb img { width:100%; height:100%; object-fit:cover; }
.heritage-news-copy { min-width:0; display:block; }
.heritage-news-copy small { display:block; margin-bottom:2px; font-size:10px; line-height:1.2; font-weight:650; color:#979a9d; }
.heritage-news-copy strong { display:-webkit-box; font:700 13.5px/1.18 "Roboto Condensed",Arial,sans-serif; letter-spacing:.002em; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.news-chevron { color:#b7b7b7; font-size:21px; font-weight:300; }
.w-briefs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); background:#fff; border:1px solid var(--white-line); margin-top:20px; }
.w-briefs a { min-height:116px; padding:22px 24px; display:grid; align-content:start; grid-template-columns:minmax(0,1fr) 20px; border-right:1px solid var(--white-line); }
.w-briefs a:last-child { border-right:0; }
.w-briefs a>span { color:#e87c15; font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.07em; }
.w-briefs h3 { grid-column:1; margin:11px 0 0; font:750 19px/1.16 "Roboto Condensed",Arial,sans-serif; }
.w-briefs small { grid-column:2; grid-row:1 / span 2; align-self:end; font-size:19px; font-weight:800; color:#e87c15; text-align:right; }
.w-picks,.w-news { background:#fff; border:1px solid var(--white-line); margin-top:56px; padding:29px 30px 35px; }
.w-section-title { display:flex; align-items:end; justify-content:space-between; gap:25px; min-height:78px; padding-bottom:16px; border-bottom:3px solid #111; }
.w-section-title>div>span { display:block; margin-bottom:5px; color:#ed841e; font-size:11px; text-transform:uppercase; font-weight:900; letter-spacing:.025em; }
.w-section-title h2 { margin:0; font:800 clamp(31px,2.6vw,42px)/.98 "Roboto Condensed","Arial Narrow",sans-serif; letter-spacing:-.035em; }
.w-section-title>a { display:flex; gap:8px; align-items:center; color:#151515; font-size:11px; text-transform:uppercase; white-space:nowrap; font-weight:900; }
.w-vgc-layout { display:grid; grid-template-columns:1fr 1.08fr .82fr; gap:28px; padding-top:24px; }
.w-editor-picks,.w-latest-vgc { min-width:0; }
.w-editor-picks>h3,.w-latest-vgc>h3 { display:flex; align-items:center; gap:10px; justify-content:center; margin:0 0 18px; color:#878787; font:800 16px/1 "Roboto Condensed",sans-serif; text-transform:uppercase; }
.w-editor-picks>h3:before,.w-editor-picks>h3:after,.w-latest-vgc>h3:before,.w-latest-vgc>h3:after { content:""; flex:1; height:1px; background:var(--white-line); }
.w-editor-picks article { border-bottom:1px solid var(--white-line); margin-bottom:18px; padding-bottom:17px; }
.w-pick-image { display:block; aspect-ratio:16/9; overflow:hidden; background:#f1f0ea; border-radius:11px; }
.w-pick-image img { display:block; width:100%; height:100%; object-fit:cover; }
.heritage-label { color:#d96c03; font-size:11px; font-weight:850; text-transform:uppercase; }
.w-editor-picks article .heritage-label { display:block; margin-top:11px; }
.w-editor-picks article h4 { margin:7px 0 8px; font:800 22px/1.1 "Roboto Condensed",sans-serif; }
.w-editor-picks article p { margin:0; font-size:12.5px; line-height:1.5; color:#6e7175; }
.w-latest-vgc>a { display:grid; grid-template-columns:105px minmax(0,1fr); align-items:start; gap:13px; margin-bottom:13px; padding-bottom:13px; border-bottom:1px solid var(--white-line); }
.w-latest-vgc>a img { display:block; width:105px; aspect-ratio:16/9; object-fit:cover; border-radius:9px; }
.w-latest-vgc>a div { min-width:0; }
.w-latest-vgc>a strong { display:block; margin:4px 0; font:750 16px/1.18 "Roboto Condensed",Arial,sans-serif; }
.w-latest-vgc>a p { font-size:11px; line-height:1.38; margin:0; color:var(--white-muted); }
.w-home-tools { min-width:0; }
.w-calendar { background:#f6f4ef; border:1px solid var(--white-line); border-radius:11px; overflow:hidden; }
.w-calendar>header { background:#18191a; padding:18px 18px 15px; color:#fff; }
.w-calendar>header>span { font-size:10px; letter-spacing:.06em; color:var(--white-orange); font-weight:850; text-transform:uppercase; }
.w-calendar header h3 { margin:6px 0 0; font:800 24px/1 "Roboto Condensed",sans-serif; }
.calendar-item { display:grid; grid-template-columns:67px minmax(0,1fr); gap:12px; align-items:start; padding:13px 12px; border-bottom:1px solid var(--white-line); }
.calendar-item time { font:850 13px "Roboto Condensed",sans-serif; color:#d76b00; }
.calendar-item strong { display:block; font:750 14px/1.18 "Roboto Condensed",sans-serif; }
.calendar-item small { display:block; margin-top:4px; color:var(--white-muted); font-size:10px; line-height:1.25; }
.calendar-more { display:flex; align-items:center; justify-content:space-between; padding:13px 18px; color:#1e1e1e; font-size:11px; font-weight:900; text-transform:uppercase; }
.w-feature-feed { padding-top:17px; }
.w-feature-feed article { min-height:164px; display:grid; grid-template-columns:245px minmax(0,1fr); gap:22px; border-bottom:1px solid var(--white-line); padding:17px 0; }
.w-feature-thumb { display:block; height:140px; border-radius:11px; background:#e9e8e4; overflow:hidden; }
.w-feature-thumb img { display:block; width:100%; height:100%; object-fit:cover; }
.w-feature-feed h3 { margin:7px 0; font:850 23px/1.11 "Roboto Condensed",sans-serif; }
.w-feature-feed p { margin:0 0 5px; color:#666b70; font-size:13px; line-height:1.48; }
.w-feature-feed small { color:#919498; font-size:11px; }
.w-duo { display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:24px; }
.w-duo>.w-pc,.w-duo>.w-consoles { min-width:0; padding:25px; background:#fff; border:1px solid var(--white-line); }
.w-duo .w-section-title { min-height:67px; }
.w-duo .w-section-title h2 { font-size:31px; }
.w-pc-entry { display:grid; grid-template-columns:130px 1fr; gap:13px; padding:15px 0; border-bottom:1px solid var(--white-line); }
.w-pc-entry img { width:130px; aspect-ratio:16/9; border-radius:8px; object-fit:cover; }
.w-pc-entry span { color:#d96c03; text-transform:uppercase; font-size:11px; font-weight:800; }
.w-pc-entry h3 { font:800 18px/1.2 "Roboto Condensed",sans-serif; margin:6px 0 0; }
.w-consoles-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:16px; margin-top:17px; }
.heritage-card { display:block; min-width:0; }
.heritage-card-photo { aspect-ratio:16/9; background:#e6e6e1; overflow:hidden; border-radius:10px; margin-bottom:7px; }
.heritage-card-photo img { display:block; width:100%; height:100%; object-fit:cover; transition:transform 200ms ease; }
.heritage-card:hover .heritage-card-photo img { transform:scale(1.027); }
.heritage-card>.heritage-label { display:block; margin:9px 0 5px; }
.heritage-card h3 { margin:0 0 6px; font:800 19px/1.14 "Roboto Condensed",sans-serif; }
.heritage-card p { margin:0; font-size:12px; color:var(--white-muted); line-height:1.42; }
.list-page,.article-shell { max-width:1440px; margin:0 auto; padding:0 30px 30px; }
.list-page>.breadcrumbs,.article-shell>.breadcrumbs { padding-top:26px; }
.list-header { padding:16px 0 25px; }
.list-header h1 { font:850 clamp(36px,4vw,56px)/.98 "Roboto Condensed",sans-serif; letter-spacing:-.035em; }
.list-page .card-grid { grid-template-columns:repeat(4,minmax(0,1fr)); column-gap:20px; row-gap:28px; }
.list-page .card-grid .heritage-card { min-width:0; }
.article-head h1 { font:850 clamp(36px,4.2vw,58px)/1.08 "Roboto Condensed",sans-serif; letter-spacing:-.034em; }
.article-head .category-tag { color:#d96c03; }
.article-columns { grid-template-columns:minmax(0,1fr) 315px; gap:34px; }
.article-body,.side-panel { background:#fff; border:1px solid var(--white-line); border-radius:12px; }
.article-body h2,.article-body h3 { font-family:"Roboto Condensed",sans-serif; font-weight:850; }
.article-body { font-size:17px; line-height:1.75; }
.article-body figcaption { font-size:12px; }
.article-aside .heritage-news-row { grid-template-columns:65px minmax(0,1fr) 13px; }
.article-aside .heritage-news-thumb { width:65px; height:48px; }
.article-aside .heritage-news-copy strong { font-size:12.4px; }
.category-grid a,.release-row { background:#fff; border-color:var(--white-line); }
.category-grid a strong,.release-row h2 { font-family:"Roboto Condensed",sans-serif; }
.search-big button { background:#171717; border-radius:7px; }
.pagination a { border-color:var(--white-line); }
.site-footer { background:#101112; color:#c3c3c3; margin-top:0; padding:43px max(30px,calc((100% - 1380px)/2)); display:grid; grid-template-columns:minmax(220px,1fr) 1.4fr auto; gap:35px; align-items:start; }
.footer-brand-block p { margin:13px 0 0; max-width:270px; font-size:12px; color:#929393; line-height:1.45; }
.footer-logo { display:flex; align-items:baseline; gap:5px; color:#fff!important; }
.footer-logo strong { font:900 28px "Roboto Condensed",sans-serif; }
.footer-logo span { font:900 12px "Roboto",Arial,sans-serif; letter-spacing:.19em; }
.site-footer nav { display:flex; justify-content:center; flex-wrap:wrap; gap:13px 22px; }
.site-footer nav a { color:#d0d0d0; font:650 12px "Roboto",Arial,sans-serif; }
.site-footer small { font-size:12px; color:#8b8d8f; }
@media(max-width:1180px){
  .header-main{grid-template-columns:170px minmax(0,1fr) auto}
  .desktop-nav{padding-left:9px}.desktop-nav a{min-width:83px;padding-inline:8px;font-size:13px}
  .w-lead{grid-template-columns:minmax(0,1.4fr) minmax(340px,1fr)}
  .w-vgc-layout{grid-template-columns:1fr 1fr;gap:26px}
  .w-home-tools{grid-column:1/-1}
  .w-calendar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
  .w-calendar header,.calendar-more{grid-column:1/-1}
  .calendar-item{border-right:1px solid var(--white-line)}
  .article-columns{grid-template-columns:minmax(0,1fr) 270px;gap:20px}
}
@media(max-width:850px){
  .header-main{height:72px;grid-template-columns:150px 1fr;gap:12px}
  .site-root .masthead{min-height:72px}
  .site-root .brand{margin:7px 0 7px 12px}
  .brand-wordmark b{font-size:31px}.brand-wordmark small{font-size:8px}
  .desktop-nav{display:none}.header-actions{justify-self:end}
  .search-overlay{top:72px}
  .white-home{padding:22px 18px 60px}
  .w-lead{grid-template-columns:1fr}
  .w-lead-story{border-right:0}
  .w-lead-image{max-height:460px}
  .w-latest{display:grid;grid-template-columns:1fr 1fr;gap:0 18px;border-top:1px solid var(--white-line)}
  .w-latest header{grid-column:1/-1}
  .w-briefs{grid-template-columns:1fr}
  .w-briefs a{border-right:0;border-bottom:1px solid var(--white-line);min-height:95px}
  .w-briefs a:last-child{border:0}
  .w-vgc-layout{grid-template-columns:1fr}
  .w-calendar{display:block}
  .w-feature-feed article{grid-template-columns:190px minmax(0,1fr)}
  .w-feature-thumb{height:126px}
  .w-duo{grid-template-columns:1fr}
  .list-page .card-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .article-columns{grid-template-columns:1fr}
  .article-aside{display:grid;grid-template-columns:1fr 1fr;gap:18px}
  .site-footer{grid-template-columns:1fr;gap:18px;padding:35px 24px}
  .site-footer nav{justify-content:flex-start}
}
@media(max-width:560px){
  .header-main{height:64px;grid-template-columns:123px 1fr}
  .site-root .masthead{min-height:64px}
  .site-root .brand{margin:7px 0 7px 10px;border-radius:9px}
  .brand-wordmark b{font-size:26px}.brand-wordmark small{font-size:7px;margin-top:4px}
  .header-actions{gap:7px;padding:0 12px 0 3px}
  .search-toggle,.mobile-menu summary{width:38px;min-width:38px;height:38px;padding:0;display:grid;place-items:center}
  .mobile-menu summary span{display:none}
  .search-overlay{top:64px;padding:17px 12px}
  .site-search>div{flex-direction:column}.site-search button{height:45px}
  .white-home{padding:14px 10px 45px}
  .w-lead{border-radius:12px}
  .w-lead-image{aspect-ratio:16/9}
  .w-lead-copy{padding:17px 17px 20px;display:block}
  .w-lead-copy h1{margin:10px 0;font-size:28px}
  .w-lead-copy p{font-size:13px;line-height:1.4}
  .w-read{width:max-content;margin-top:13px}
  .w-latest{display:block;padding:17px}
  .w-latest header h2{font-size:25px}
  .heritage-news-row{grid-template-columns:64px 1fr 13px;min-height:58px}
  .heritage-news-thumb{width:64px;height:44px}
  .heritage-news-copy strong{font-size:13px}
  .w-briefs{margin-top:12px}
  .w-briefs a{padding:15px 18px;min-height:78px}
  .w-briefs h3{font-size:17px;margin-top:5px}
  .w-picks,.w-news{margin-top:26px;padding:19px 15px 23px;border-radius:12px}
  .w-section-title{min-height:58px;gap:12px;padding-bottom:12px}
  .w-section-title>div>span{font-size:9px}
  .w-section-title h2{font-size:27px}
  .w-section-title>a{font-size:9px}
  .w-vgc-layout{gap:22px;padding-top:18px}
  .w-latest-vgc>a{grid-template-columns:90px 1fr;gap:11px;margin-bottom:11px;padding-bottom:11px}
  .w-latest-vgc>a img{width:90px}
  .w-editor-picks article h4{font-size:21px}
  .w-feature-feed article{grid-template-columns:116px minmax(0,1fr);gap:13px;min-height:118px}
  .w-feature-thumb{height:80px}
  .w-feature-feed h3{font-size:17px;margin:5px 0}
  .w-feature-feed p{display:none}
  .w-feature-feed small{font-size:10px}
  .w-duo{gap:14px;margin-top:14px}
  .w-duo>.w-pc,.w-duo>.w-consoles{padding:17px}
  .w-pc-entry{grid-template-columns:110px 1fr}
  .w-pc-entry img{width:110px}
  .w-consoles-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .heritage-card h3{font-size:16px}
  .heritage-card p{display:none}
  .list-page,.article-shell{padding-inline:12px}
  .list-page .card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
  .article-head h1{font-size:31px}
  .article-body{padding:22px 17px;font-size:16px}
  .article-body h2{font-size:24px}
  .article-aside{display:block}
  .site-footer{padding:25px 15px}
}

.brand-original{display:block;width:100%;height:100%;object-fit:cover;object-position:center center}.site-root .brand:hover{filter:brightness(1.05)}