/* Desktop composition: a single viewport, with ornament only on the frame. */
@media(min-width:701px){
 html,body{height:100%;overflow:hidden;scroll-behavior:auto}
 body{height:100svh;display:flex;flex-direction:column;min-height:0}
 .demo-strip{flex:0 0 30px;min-height:30px;padding:5px max(40px,calc((100vw - 1440px)/2));font-size:8px}
 .demo-strip button{font-size:8px}
 .page-shell{--frame-pad:26px;flex:1;min-height:0;width:min(1440px,calc(100% - 128px));margin:20px auto;padding:var(--frame-pad);border:1px solid #ef31244a;display:grid;grid-template-rows:clamp(70px,10vh,100px) minmax(0,1fr)}
 .page-shell:before,.page-shell:after{display:none}
 .header{height:auto;min-height:0;position:relative;border:0}
 .header .bank-mark{left:50%;top:50%;transform:translate(-50%,-50%)}
 .rockstar-logo{width:204px}
 .header-digital{position:absolute;right:calc(16px - var(--frame-pad));top:calc(16px - var(--frame-pad));width:270px;height:18px;margin:0}
 .header .header-telemetry{height:18px;gap:14px}
 .header .header-telemetry .header-code{font-size:11px;line-height:15px;gap:18px;color:#a43a30}
 .header .header-telemetry .header-pixels{flex-basis:28px;width:28px;height:11px}
 .header .header-telemetry .header-pixels:before,.header .header-telemetry .header-pixels:after{width:11px;height:11px}
 .header-code{font-variant-numeric:tabular-nums}
 .header-code span{min-width:68px}
 main{display:grid;grid-template-rows:minmax(0,1fr) auto;gap:clamp(16px,2.8vh,30px);min-height:0}
 .hero{min-height:0;height:100%;padding:0;gap:28px;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);grid-template-rows:minmax(0,1fr);align-items:center}
 .hero-copy{padding:0;--copy-gap:clamp(22px,3.5vh,38px);gap:var(--copy-gap)}
 h1{font-size:clamp(64px,min(7.6vw,12.5vh),112px);width:5.2em;max-width:100%}
 .hero-copy .game-reveals{min-height:34px}
 .hero-copy .hero-action-slot{min-height:44px;padding:0}
 .game-chips{gap:8px}
 .game-chips li{font-size:12px;padding:7px 10px;line-height:1.35}
 .announcement-button{min-height:44px;padding:13px 24px}
 .digital-art{position:relative;height:calc(100% + 48px);width:auto;aspect-ratio:1269/1240;max-height:640px;max-width:100%;min-width:0;min-height:0;justify-self:end;align-self:end;margin:0;opacity:1}
 .case-canvas,.case-image{width:100%;height:100%}
 .keycap{width:clamp(76px,7.8vw,112px);height:clamp(76px,7.8vw,112px)}
 .key-w{left:2%}.key-a{left:3%}.key-d,.key-s{right:-2%}
 .loading-console{padding:0;background:none;border:0;min-height:0;margin-bottom:clamp(18px,3.7vh,40px)}
 .console-heading{align-items:flex-start;gap:24px}
 .console-copy{flex:1;min-width:0;min-height:96px}
 .console-heading h2{font-size:30px;line-height:1.3;max-width:none;margin:0;font-weight:500}
 .reveal-row{padding:0;margin-top:12px;min-height:0;border:0;display:block}
 .reveal-content{min-width:0;max-width:none}
 .reveal-content p{font-size:18px;line-height:1.5;margin:0;color:#aaa;max-width:1050px}
 .percent{font-size:76px;line-height:1;flex:none;letter-spacing:-3px}
 .percent-sign{font-size:26px;padding-top:7px}
 .progress-track{height:18px;margin-top:18px}
 .progress-dates{margin:12px 0 0;font-size:13px;line-height:1.4}
 .progress-dates b{font-size:13px}.progress-dates i{font-size:10px}
 .poster-details{position:absolute;inset:0;pointer-events:none;color:#ef31246b}
 .poster-details .detail-cross{width:19px;height:19px}
 .poster-details .detail-cross:before{width:19px;top:9px}
 .poster-details .detail-cross:after{height:19px;left:9px}
 .poster-details .detail-cross.cross-one{top:-10px;bottom:auto;left:26%}
 .poster-details .detail-cross.cross-two{bottom:-10px;top:auto;left:65%}
 .poster-details .detail-cross.cross-three{left:-10px;top:56%;bottom:auto}
 .poster-details .detail-cross.cross-four{right:-10px;left:auto;top:40%;bottom:auto}
 .poster-details .corner-top{left:-1px;top:-1px;width:28px;height:28px}
 .poster-details .corner-bottom{right:-1px;bottom:-1px;width:28px;height:28px}
 .demo-controls{flex:0 0 44px;height:44px;min-height:44px;border:0;padding:5px 24px;gap:12px;background:#101010}
 .demo-controls select{padding:6px 28px 6px 10px;font-size:9px;max-width:none;width:auto}
 .demo-controls button{padding:7px 12px;font-size:9px;width:auto;min-width:135px}
 .demo-speed{display:none}
 .frame-footer,footer,.header-map,.header-cross,.detail-edge,.detail-squares,.next-info{display:none}
}
@media(min-width:701px) and (max-width:1200px){
 .page-shell{width:calc(100% - 88px);--frame-pad:22px}
 .hero{gap:18px;grid-template-columns:minmax(0,1.18fr) minmax(0,1fr)}
 .hero-copy .game-reveals{min-height:60px}
 .game-chips{gap:7px}.game-chips li{font-size:11px;padding:6px 8px}
}
@media(min-width:701px) and (max-height:700px){
 .page-shell{margin:14px auto;--frame-pad:20px;grid-template-rows:68px minmax(0,1fr)}
 .hero-copy{--copy-gap:20px}
 .loading-console{margin-bottom:18px}
 .digital-art{height:calc(100% + 30px)}
 .console-copy{min-height:82px}.console-heading h2{font-size:26px}
 .reveal-row{margin-top:10px}.reveal-content p{font-size:16px}
 .progress-track{margin-top:14px}.percent{font-size:64px}
 .progress-dates,.progress-dates b{font-size:11px}.progress-dates i{font-size:9px}
}
@media(min-width:701px) and (max-height:560px){
 .page-shell{margin:10px auto;--frame-pad:14px;grid-template-rows:56px minmax(0,1fr)}
 .rockstar-logo{width:160px}.hero-copy{--copy-gap:14px}
 h1{font-size:clamp(48px,min(6.5vw,11vh),70px)}
 .hero-copy .game-reveals{min-height:28px}.game-chips li{font-size:10px;padding:5px 7px}
 .hero-copy .hero-action-slot{min-height:34px}.announcement-button{min-height:34px;padding:9px 18px;font-size:11px}
 .console-copy{min-height:65px}.console-heading h2{font-size:20px}.reveal-row{margin-top:8px}.reveal-content p{font-size:12px}
 .percent{font-size:46px}.progress-track{height:12px;margin-top:10px}.progress-dates{margin-top:8px;font-size:9px}
 main{gap:12px}.keycap{width:74px;height:74px}
}
/* 15.11, as on mobile: corner marks only (no full frame line, no plus marks), FPS stays, % sits on the baseline. */
@media(min-width:701px){
 .page-shell{border-color:transparent}
 .poster-details .detail-cross{display:none}
 .poster-details .detail-corner{color:#ef3124a8}
 .percent{align-items:flex-end}
 .percent-sign{padding:0 0 .14em}
}
