
body{background:#090c0c}body>header.noir-controls{position:fixed;left:22px;top:20px;z-index:90;border:0;padding:0;gap:10px;max-width:65vw;margin:0;direction:ltr}header.noir-controls #open-menu{background:#080e0dd9;border:1px solid #ffffff50;backdrop-filter:blur(10px);min-height:44px}header.noir-controls>a{font:10px 'IBM Plex Mono',monospace;letter-spacing:.13em;text-shadow:0 2px 6px black}.fixed-identity{position:fixed;top:20px;right:clamp(18px,3vw,48px);width:clamp(70px,8.8vw,120px);z-index:95;filter:drop-shadow(0 3px 6px #000) drop-shadow(0 0 10px #0008)}.fixed-identity img{display:block;width:100%;height:auto;background:none}.language-bar{position:fixed;left:22px;top:77px;z-index:90;margin:0;padding:7px 11px;background:#080e0dd9;gap:12px;border:1px solid #ffffff35;backdrop-filter:blur(8px);direction:ltr}.language-bar a{font-size:11px;min-width:28px;min-height:28px}.noir-cover{height:100svh;position:relative;overflow:hidden;width:100%;margin:0;background:#090c0c}.noir-cover>img,.noir-cover>picture>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}.noir-cover:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#050808df,transparent 55%,#0003)}.noir-cover-copy{position:absolute;inset-inline-start:5vw;bottom:6vh;z-index:1;max-width:min(1020px,83vw)}.noir-cover h1{font-size:clamp(2.4rem,5.8vw,6rem);font-weight:300;line-height:1.02;letter-spacing:-.035em;margin:16px 0;text-shadow:0 3px 12px #000}.noir-cover-copy p{max-width:780px;margin:12px 0;color:#d7dfd7;font-size:clamp(.95rem,1.3vw,1.15rem)}.noir-cover-copy .noir-note{font-size:.68rem;color:#bdc8bc}.noir-cover-copy .eyebrow{font-size:.7rem;letter-spacing:.16em}.noir-cover-copy a{display:inline-block;margin-top:10px;font-size:24px}.main-eight{max-width:none;padding:0}.main-eight .editorial-content{max-width:1680px;margin:auto;padding:42px 4vw 60px}.main-eight .breadcrumb{margin-top:15px}.eight-nav{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin:0;background:#29372e}.eight-nav a{background:#0d1511;padding:20px 18px;font-size:.9rem}.eight-nav a[aria-current]{color:#aee797}.eight-nav span{display:block;color:#75916f;font-size:11px;margin-bottom:5px}#menu{z-index:150}#menu nav{grid-template-columns:repeat(2,minmax(0,1fr))}#menu nav a{min-height:65px}.preview-feedback-note{border-inline-start:2px solid #aee797;padding:12px;color:#c3d1bf}body:not(.has-noir-cover) main{padding-top:165px}html{scroll-padding-top:150px}.reading-progress{position:fixed;left:0;bottom:0;height:3px;width:0;background:#aee797;z-index:110}.skip{z-index:180}
@media(max-width:700px){header.noir-controls>a{display:none}body>header.noir-controls{left:14px;top:14px}.fixed-identity{width:70px;top:14px;right:14px}.language-bar{left:14px;top:70px;gap:3px;padding:4px}.language-bar a{min-width:26px;font-size:10px}.noir-cover-copy{bottom:6vh;max-width:88vw}.noir-cover h1{font-size:clamp(2.1rem,9vw,3.5rem)}.noir-cover-copy p{font-size:.95rem;line-height:1.45}.eight-nav{grid-template-columns:repeat(2,1fr)}.eight-nav a{padding:16px 12px;font-size:.8rem}#menu nav{grid-template-columns:1fr}.noir-cover-copy .noir-note{font-size:.62rem}.main-eight .editorial-content{padding-top:26px}}
.noir-cover>img,.noir-cover>picture>img{filter:contrast(1.22) saturate(1.06) brightness(1.07)}
.noir-cover:after{background:linear-gradient(0deg,#050808c7 0%,#0508087a 22%,transparent 48%)}

@media(max-width:700px){.main-eight .stream-photo{margin-inline:-4vw}}

/* Responsive panorama system: phone, tablet and desktop. */
html,body{max-width:100%;overflow-x:clip}
.noir-cover-copy{padding-inline-end:max(16px,env(safe-area-inset-right));padding-inline-start:env(safe-area-inset-left)}

@media(min-width:701px) and (max-width:1180px){
  body>header.noir-controls{left:18px;top:18px;max-width:58vw}
  .language-bar{left:18px;top:74px;gap:8px;padding:6px 9px}
  .fixed-identity{top:18px;right:22px;width:clamp(83px,10.4vw,110px)}
  .noir-cover-copy{inset-inline-start:5vw;bottom:5.5svh;max-width:82vw}
  .noir-cover h1,.panorama-sequence h2{font-size:clamp(3rem,7vw,5.5rem)}
  .noir-cover-copy .decay-slogan{font-size:clamp(2.25rem,5.8vw,4.1rem);max-width:88vw}
  .eight-nav{grid-template-columns:repeat(2,1fr)}
  .main-eight .editorial-content{padding-inline:5vw}
}

@media(max-width:700px){
  body>header.noir-controls{left:max(12px,env(safe-area-inset-left));top:max(12px,env(safe-area-inset-top))}
  header.noir-controls #open-menu{min-width:48px;min-height:48px;padding:10px 13px}
  .fixed-identity{top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));width:clamp(58px,17.6vw,74px)}
  .language-bar{left:max(12px,env(safe-area-inset-left));top:72px;right:auto;max-width:calc(100vw - 24px);overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:none}
  .language-bar::-webkit-scrollbar{display:none}
  .noir-cover{height:100svh;min-height:560px}
  /* A 16:10 panorama cannot fill a portrait phone without cropping. On
     phones we preserve the complete frame and use the black stage around it. */
  .noir-cover>img,.noir-cover>picture>img{inset:clamp(122px,16svh,146px) 0 auto;width:100%;height:auto;max-height:100%;object-fit:contain;object-position:center center;transform:none}
  .main-eight>.noir-cover:nth-of-type(2)>img,.main-eight>.noir-cover:nth-of-type(2)>picture>img{object-position:center center}
  .noir-cover-copy{inset-inline-start:5vw;bottom:max(4svh,24px);max-width:90vw;padding-bottom:env(safe-area-inset-bottom)}
  .noir-cover-copy>.eyebrow{font-size:.62rem;letter-spacing:.12em}
  .noir-cover h1,.panorama-sequence h2{font-size:clamp(2.15rem,10.5vw,3.6rem);line-height:.96;margin:10px 0}
  .noir-cover-copy>p:not(.decay-slogan){display:none}
  .noir-cover-copy .decay-slogan{font-size:clamp(1.65rem,8.2vw,2.75rem);line-height:1.01;margin:12px 0;max-width:92vw;text-wrap:balance}
  .noir-cover-copy a{margin-top:4px}
  .main-eight .editorial-content{padding-inline:5vw}
}

@media(max-width:430px){
  .language-bar{gap:1px;padding:3px}
  .language-bar a{min-width:25px;min-height:30px;font-size:9px}
  .fixed-identity{width:61px}
  .noir-cover-copy{bottom:max(3.5svh,20px)}
}

@media(max-height:520px) and (orientation:landscape){
  .noir-cover{min-height:100svh}
  .language-bar{display:none}
  .fixed-identity{width:54px}
  .noir-cover-copy{bottom:18px;max-width:78vw}
  .noir-cover h1,.panorama-sequence h2{font-size:clamp(1.8rem,7vh,2.7rem);margin:6px 0}
  .noir-cover-copy .decay-slogan{font-size:clamp(1.4rem,6.5vh,2.2rem);margin:7px 0}
}

/* Cross-device editorial consistency v7 */
@media (max-width:1180px){
  .noir-cover{
    height:auto;
    min-height:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    background:#090c0c;
  }
  .noir-cover>img,.noir-cover>picture>img{
    position:relative;
    inset:auto;
    order:1;
    display:block;
    width:100%;
    height:auto;
    max-height:none;
    aspect-ratio:16/10;
    object-fit:contain;
    object-position:center center;
    transform:none;
    flex:none;
  }
  .noir-cover:after{display:none}
  .noir-cover-copy{
    position:relative;
    inset:auto;
    order:2;
    box-sizing:border-box;
    width:100%;
    max-width:none;
    min-height:clamp(190px,28vw,300px);
    padding:clamp(20px,4vw,38px) 5vw clamp(28px,5vw,52px);
    background:linear-gradient(180deg,#07100d 0%,#090c0c 100%);
    border-bottom:1px solid #29372e;
  }
  .noir-cover-copy>p:not(.decay-slogan){display:block}
  .noir-cover-copy .decay-slogan{max-width:min(900px,92vw);text-wrap:balance}
}
@media (max-width:700px){
  .noir-cover-copy{min-height:190px;padding:18px 5vw 28px}
  .noir-cover h1,.panorama-sequence h2{font-size:clamp(1.8rem,8.5vw,2.7rem);line-height:1;margin:8px 0}
  .noir-cover-copy p{font-size:.9rem;line-height:1.42;margin:8px 0}
  .noir-cover-copy .decay-slogan{font-size:clamp(1.4rem,7vw,2.2rem);line-height:1.04;margin:10px 0}
  .noir-cover-copy a{font-size:1.05rem}
}
/* a11y 2026-10-07: minimum target size 24x24 (WCAG 2.2 SC 2.5.8) */
.stream-nav a,.noir-controls>a,.footer-links a,dd a,form a{display:inline-block;min-height:24px;padding-block:3px;line-height:1.4}
.advance,.noir-cover-copy>a[href^="#"]{min-width:32px;min-height:32px}
.language-bar a,.story-languages a{min-width:24px;min-height:24px}
/* min text size 12px 2026-10-07 */
dialog#menu span,dialog#menu button,dialog#menu a{font-size:max(12px,1em)}
#close-menu{font-size:12px}
/* v12 */
picture{display:contents}
/* aside wrapper for fixed logo 2026-10-07 */
aside.identity-wrap{display:contents}
