/* Framed header hotfix v3. One layout for all six scene pages.
   Original image files and HOME tile/grid sizing are deliberately retained. */
html{overflow-y:scroll}
@supports(scrollbar-gutter:stable){html{overflow-y:auto;scrollbar-gutter:stable}}
#app>.page:first-child{padding-top:28px}
#app .cp-scene-header{
 position:relative;isolation:isolate;display:grid;
 grid-template-columns:minmax(250px,.8fr) minmax(0,1.2fr);
 gap:22px;align-items:start;box-sizing:border-box;
 min-height:280px;margin:0 0 24px;padding:0;background:transparent;
}
#app .cp-scene-header::after{content:none}
#app .cp-scene-header>:not(.cp-scene-art):not(.atlas-metrics){
 grid-column:1;grid-row:1;position:relative;z-index:1;
 min-width:0;margin:0;padding:0;align-self:start;
}
#app .cp-scene-header>.cp-scene-art{
 grid-column:2;grid-row:1;position:relative;inset:auto;z-index:0;
 align-self:stretch;min-width:0;width:100%;height:auto;min-height:280px;
 overflow:hidden;pointer-events:none;opacity:1;transform:none;
 background:var(--panel,#0d0f14);border:1px solid #242933;border-radius:14px;
 -webkit-mask-image:none;mask-image:none;
}
#app .cp-scene-header:not(.cp-scene-collection)>.cp-scene-art::before{content:none}
#app .cp-scene-header:not(.cp-scene-collection)>.cp-scene-art::after{
 content:"";position:absolute;inset:0 0 0 -33.333333%;pointer-events:none;
 background-image:var(--cp-scene-image);background-repeat:no-repeat;
 background-size:cover;background-position:var(--cp-scene-position,center);
 opacity:1;filter:none;
 -webkit-mask-image:none;mask-image:none;
}
#app .cp-scene-atlas{--cp-scene-image:url('header-scenes-v3/atlas.webp')}
#app .cp-scene-trading{--cp-scene-image:url('header-scenes-v3/trading.webp')}
#app .cp-scene-wanted{--cp-scene-image:url('header-scenes-v3/wanted.webp')}
#app .cp-scene-game{--cp-scene-image:url('header-scenes-v3/game.webp')}
#app .cp-scene-contact{--cp-scene-image:url('header-scenes-v3/contact.webp')}
#app .cp-scene-atlas .atlas-metrics{display:none}
#app .cp-scene-header .game-heading{margin:0;padding:0;min-height:0}
#app .cp-country-hero h1,#app .cp-scene-header h1{
 font-family:Arial,Helvetica,sans-serif;font-size:clamp(30px,3.5vw,64px);
 font-weight:900;font-style:normal;text-transform:uppercase;line-height:1.08;
 letter-spacing:-.035em;margin:0 0 14px;max-width:100%;
 white-space:normal;overflow-wrap:normal;
 text-shadow:0 1px 0 #bababa,0 2px 0 #646464,0 3px 0 #222,1px 5px 3px #000b;
}
#app .cp-scene-header h1 span{color:var(--mint,#63f5c5)}
#app .cp-scene-game h1>span,
#app .rx-hero .cp-home-title>.cp-home-patches{
 text-shadow:0 1px 0 #3eac88,0 2px 0 #24674f,0 3px 0 #12372b,1px 5px 3px #000b;
}
/* Preserve the established HOME title sizing and deliberate mobile word breaks. */
#app .rx-hero .cp-page-header .cp-home-title{
 font-family:Arial,Helvetica,sans-serif;font-size:clamp(30px,3.5vw,64px);
 font-weight:900;line-height:1.08;letter-spacing:-.035em;margin:0 0 14px;
 text-shadow:0 1px 0 #bababa,0 2px 0 #646464,0 3px 0 #222,1px 5px 3px #000b;
}
#app .cp-country-hero .rx-kicker,#app .cp-scene-header .rx-kicker,#app .cp-scene-header .eyebrow,
#app .rx-hero .cp-page-header>.rx-kicker{
 display:flex;align-items:center;gap:10px;font-family:Arial,Helvetica,sans-serif;
 font-size:15px;font-weight:700;line-height:1.35;letter-spacing:.10em;
 text-transform:uppercase;color:var(--mint,#63f5c5);margin:0 0 14px;padding:0;
 text-shadow:0 1px 0 #24674f,0 2px 3px #0009;
}
#app .cp-country-hero .rx-kicker::before,#app .cp-scene-header .rx-kicker::before,#app .cp-scene-header .eyebrow::before,
#app .rx-hero .cp-page-header>.rx-kicker::before{
 content:"";height:1px;flex:0 0 32px;background:var(--mint,#63f5c5);box-shadow:none;
}
#app .cp-country-hero .cp-intro,#app .cp-scene-header .cp-intro,#app .cp-scene-header .intro{
 width:100%;max-width:520px;font-size:15px;line-height:1.55;
 color:#bdc4cd;letter-spacing:normal;margin:0;text-shadow:none;
}
#app .cp-scene-header .cp-intro+.cp-intro{margin-top:10px}
#app .rx-hero .cp-page-header>.cp-intro{font-size:16px;line-height:1.7;color:#bdc4cd}
#app .cp-scene-collection .cp-scene-slice{
 position:absolute;top:0;bottom:0;width:calc(12.5% + 40px);
 background-size:auto 100%;background-position:66% center;
 clip-path:polygon(40px 0,100% 0,calc(100% - 40px) 100%,0 100%);
}
.cp-scene-slice:nth-child(1){left:0;background-image:url('themes/historic.webp')}
.cp-scene-slice:nth-child(2){left:12.5%;background-image:url('themes/maritime.webp')}
.cp-scene-slice:nth-child(3){left:25%;background-image:url('themes/air.webp')}
.cp-scene-slice:nth-child(4){left:37.5%;background-image:url('themes/land.webp')}
.cp-scene-slice:nth-child(5){left:50%;background-image:url('themes/k9.webp')}
.cp-scene-slice:nth-child(6){left:62.5%;background-image:url('themes/swat.webp')}
.cp-scene-slice:nth-child(7){left:75%;background-image:url('themes/narco.webp')}
.cp-scene-slice:nth-child(8){left:87.5%;background-image:url('themes/medic.webp')}
#app .cp-scene-collection .cp-scene-slice::after{
 content:"";position:absolute;inset:0;background:var(--bg,#08090c);
 clip-path:polygon(40px 0,43px 0,3px 100%,0 100%);
}
body.is-playing #app .cp-scene-game{display:none}
@media(max-width:1100px){
 #app .cp-country-hero .rx-kicker,#app .cp-scene-header .rx-kicker,#app .cp-scene-header .eyebrow,
 #app .rx-hero .cp-page-header>.rx-kicker{font-size:14px}
}
@media(max-width:700px){
 #app>.page:first-child{padding-top:18px}
 #app .cp-scene-header{grid-template-columns:minmax(0,1fr);gap:12px;min-height:0;margin-bottom:16px}
 #app .cp-scene-header>:not(.cp-scene-art):not(.atlas-metrics){grid-column:1;grid-row:1}
 #app .cp-scene-header>.cp-scene-art{
  grid-column:1;grid-row:2;min-height:0;height:110px;border-radius:14px;
  -webkit-mask-image:none;mask-image:none;
 }
 #app .cp-scene-header:not(.cp-scene-collection)>.cp-scene-art::after{-webkit-mask-image:none;mask-image:none}
 #app .cp-country-hero h1,#app .cp-scene-header h1{font-size:32px;margin-bottom:10px}
 #app .rx-hero .cp-page-header .cp-home-title{font-size:32px}
 #app .cp-country-hero h1,#app .cp-scene-header h1,#app .rx-hero .cp-page-header .cp-home-title{
  text-shadow:0 1px 0 #999,0 2px 0 #333,1px 4px 3px #000b;
 }
 #app .cp-scene-game h1>span,#app .rx-hero .cp-home-title>.cp-home-patches{
  text-shadow:0 1px 0 #339879,0 2px 0 #164d3c,1px 4px 3px #000b;
 }
 #app .cp-country-hero .rx-kicker,#app .cp-scene-header .rx-kicker,#app .cp-scene-header .eyebrow,
 #app .rx-hero .cp-page-header>.rx-kicker{
  font-size:12px;line-height:1.4;letter-spacing:.07em;gap:8px;margin-bottom:8px;
 }
 #app .cp-country-hero .rx-kicker::before,#app .cp-scene-header .rx-kicker::before,#app .cp-scene-header .eyebrow::before,
 #app .rx-hero .cp-page-header>.rx-kicker::before{flex-basis:20px}
 #app .cp-country-hero .cp-intro,#app .cp-scene-header .cp-intro,#app .cp-scene-header .intro{font-size:14px;line-height:1.5}
 #app .rx-hero .cp-page-header>.cp-intro{font-size:15px;line-height:1.65}
 #app .cp-scene-collection .cp-scene-slice{width:calc(12.5% + 24px);clip-path:polygon(24px 0,100% 0,calc(100% - 24px) 100%,0 100%)}
 #app .cp-scene-collection .cp-scene-slice::after{clip-path:polygon(24px 0,27px 0,3px 100%,0 100%)}
}

/* v4: the historic scene fills the framed collage's outer left corners.
   Only interior boundaries remain diagonal. */
#app .cp-scene-collection .cp-scene-slice:first-child{
 clip-path:polygon(0 0,100% 0,calc(100% - 40px) 100%,0 100%);
}
#app .cp-scene-collection .cp-scene-slice:first-child::after{content:none}
@media(max-width:700px){
 #app .cp-scene-collection .cp-scene-slice:first-child{
  clip-path:polygon(0 0,100% 0,calc(100% - 24px) 100%,0 100%);
 }
}