/*
  TEST ARCHI DRAFT-UPDATE
  Architecture becomes a visual story: one proposition, one supporting thought,
  one image at a time. This sheet is intentionally isolated from the masters.
*/

#p3 .architecture-draft-overture{
  width:100%;
  box-sizing:border-box;
  margin-top:2px;
}

#p3 .architecture-draft-overture .architecture-overture-lead{
  margin:0 0 11px;
  color:var(--white);
  font-family:'Archivo Black',sans-serif;
  font-size:clamp(20px,2.05vw,30px);
  font-weight:700;
  line-height:1.03;
  letter-spacing:-.012em;
}

#p3 .architecture-draft-overture .architecture-overture-rhythm{
  margin:0 0 8px;
  color:var(--green);
  font-family:'DM Mono',monospace;
  font-size:clamp(14px,1.05vw,17px);
  line-height:1.35;
  letter-spacing:.1em;
  text-transform:uppercase;
}

#p3 .architecture-draft-overture .architecture-overture-question{
  margin:0;
  max-width:32ch;
  color:var(--w80);
  font-family:'IBM Plex Sans',sans-serif;
  font-size:clamp(20px,1.42vw,21px);
  font-weight:300;
  line-height:1.2;
}

/* Horizontale Architecture thesis: the question leads, the principle answers. */
body:not(.verticale-edition) #p3 .page-headline{
  line-height:1.13;
}

body:not(.verticale-edition) #p3 .architecture-draft-overture .architecture-overture-question{
  margin:0 0 24px;
  max-width:none;
  color:var(--green);
  font-family:'DM Mono',monospace;
  font-size:21pt;
  font-weight:500;
  line-height:1.12;
  letter-spacing:.012em;
  word-spacing:-.12em;
  text-transform:uppercase;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 .architecture-draft-overture .architecture-overture-lead{
  margin:0 0 40px;
  font-size:24.5pt;
  line-height:1.15;
}

body:not(.verticale-edition) #p3 .architecture-draft-overture .architecture-overture-rhythm{
  margin:0;
  font-size:20pt;
  line-height:1.22;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 .architecture-overture-rhythm-line,
body:not(.verticale-edition) #p3 .architecture-overture-resolve{
  display:block;
}

body:not(.verticale-edition) #p3 .architecture-overture-rhythm-line{
  letter-spacing:.05em;
  word-spacing:-.18em;
}

body:not(.verticale-edition) #p3 .architecture-overture-resolve{
  margin-top:7px;
  letter-spacing:.13em;
}

#p3 .archi-story-slide{
  box-sizing:border-box;
  isolation:isolate;
  padding:0 !important;
  color:#fff;
  background:#080b09;
}

#p3 .archi-story-slide > .archi-story-image{
  position:absolute;
  inset:0;
  z-index:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:inherit;
}

#p3 .archi-story-slide.archi-story-contain > .archi-story-image{
  box-sizing:border-box;
  object-fit:contain;
  padding:clamp(14px,2vw,28px);
  background:#f4f2ec;
}

#p3 .archi-story-slide::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(2,7,8,.08) 0 42%,rgba(2,7,8,.86) 100%),
    linear-gradient(90deg,rgba(2,7,8,.32),transparent 64%);
}

#p3 .archi-story-slide.archi-copy-top::after{
  background:
    linear-gradient(180deg,rgba(2,7,8,.84) 0,rgba(2,7,8,.22) 58%,rgba(2,7,8,.06) 100%),
    linear-gradient(90deg,rgba(2,7,8,.28),transparent 70%);
}

#p3 .archi-story-slide.archi-copy-center::after{
  background:radial-gradient(ellipse at center,rgba(2,7,8,.12),rgba(2,7,8,.82));
}

#p3 .archi-story-slide.archi-tone-light::after{
  background:
    linear-gradient(180deg,rgba(247,246,240,.04) 0 43%,rgba(247,246,240,.92) 100%),
    linear-gradient(90deg,rgba(247,246,240,.2),transparent 72%);
}

#p3 .archi-story-copy{
  position:absolute;
  z-index:4;
  left:clamp(24px,4.3vw,70px);
  right:clamp(24px,4.3vw,70px);
  bottom:clamp(24px,4vw,58px);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:clamp(7px,.72vw,11px);
  max-width:min(82%,820px);
  pointer-events:none;
  text-align:left;
  text-shadow:none !important;
}

#p3 .archi-copy-top .archi-story-copy{
  top:clamp(26px,4vw,58px);
  bottom:auto;
}

#p3 .archi-copy-right .archi-story-copy{
  left:auto;
  align-items:flex-end;
  text-align:right;
}

#p3 .archi-copy-center .archi-story-copy{
  top:50%;
  bottom:auto;
  left:50%;
  right:auto;
  width:min(86%,900px);
  max-width:none;
  align-items:center;
  text-align:center;
  transform:translate(-50%,-50%);
}

#p3 .archi-story-kicker{
  display:block;
  color:#69be12;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:clamp(13px,1vw,16px);
  font-weight:700;
  line-height:1.2;
  letter-spacing:.16em;
  text-transform:uppercase;
}

#p3 .archi-story-title{
  margin:0;
  max-width:18ch;
  color:#fff;
  font-family:'Archivo Black',sans-serif;
  font-size:clamp(29px,3.1vw,50px);
  font-weight:400;
  line-height:.98;
  letter-spacing:-.022em;
  text-wrap:nowrap;
  text-shadow:none !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v7"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  word-spacing:.08em;
}

#p3 .archi-story-title.archi-story-title-long{
  max-width:27ch;
  font-size:clamp(24px,2.45vw,40px);
  line-height:1.02;
}

#p3 .archi-story-title.archi-story-title-hero{
  max-width:none;
  font-size:clamp(48px,7.2vw,112px);
  color:#d84f36;
}

#p3 .archi-story-title.archi-story-title-wall{
  max-width:15ch;
  color:#fff;
  font-size:clamp(46px,5.2vw,84px);
  line-height:.94;
  letter-spacing:-.035em;
  text-wrap:balance;
}

#p3 .archi-story-body{
  margin:0;
  max-width:44ch;
  color:rgba(255,255,255,.88);
  font-family:'IBM Plex Sans',sans-serif;
  font-size:clamp(16px,1.32vw,21px);
  font-weight:300;
  line-height:1.18;
  letter-spacing:.005em;
  text-shadow:none !important;
}

/* Horizontale house rule: keep the supporting line visually tied to its
   lower-left Archivo title, even when the two type sizes change. */
body:not(.verticale-edition) #p3 .architecture-story-hud.archi-copy-start .archi-story-title + .archi-story-body{
  margin-top:-6px;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v16"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker{
  font-size:clamp(11px,1.05vw,18px);
}

#p3 .archi-story-body.archi-story-body-wide{
  max-width:66ch;
}

#p3 .archi-copy-wall .archi-story-body{
  max-width:30ch;
  color:#fff;
  font-size:clamp(23px,2vw,32px);
  line-height:1.05;
}

/* Horizontale question wall — approved type hierarchy. */
body:not(.verticale-edition) #p3 .archi-copy-wall .archi-story-kicker{
  font-size:20pt;
  line-height:1.2;
}

body:not(.verticale-edition) #p3 .archi-story-title.archi-story-title-wall{
  max-width:24ch;
  font-size:43pt;
  line-height:1.04;
  white-space:pre-line;
  text-wrap:wrap;
}

body:not(.verticale-edition) #p3 .archi-copy-wall .archi-story-body{
  color:#8cdc35;
  max-width:none;
  font-size:26pt;
  line-height:1.4;
  white-space:pre-line;
  text-wrap:nowrap;
}

/* View 01: the material words become windows into the mined landscape of 00. */
body:not(.verticale-edition) #p3 .archi-copy-wall .archi-mineral-window{
  display:inline;
  color:transparent;
  background-image:url('optimized-v39/images/banatti-mining-community-photoreal-v16-original-drawing-red-laterite-prebuild-coastline--ed35fc873ec7.lossless.webp');
  background-repeat:no-repeat;
  background-size:760px auto;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  filter:saturate(1.2) brightness(1.18);
}

body:not(.verticale-edition) #p3 .archi-copy-wall .archi-mineral-window-nickel{
  background-position:48% 42%;
}

body:not(.verticale-edition) #p3 .archi-copy-wall .archi-mineral-window-copper{
  background-image:
    linear-gradient(rgba(64,19,7,.04),rgba(92,32,13,.09)),
    url('optimized-v39/images/architecture-copper-material-atlas-v1--cf612dcb75d8.lossless.webp');
  background-repeat:no-repeat,no-repeat;
  background-size:100% 100%,176% auto;
  background-position:50% 50%,50% 50%;
  filter:contrast(1.16) saturate(1.06) brightness(1.02);
}

body:not(.verticale-edition) #p3 .archi-copy-wall .archi-mineral-window-elements{
  background-position:42% 74%;
}

/* View 01 material wave: nickel, copper and elements softly resolve in
   sequence, overlap, and keep moving without a static colour hold. */
body:not(.verticale-edition) #p3 .archi-copy-wall .archi-mineral-window-nickel,
body:not(.verticale-edition) #p3 .archi-copy-wall .archi-mineral-window-copper,
body:not(.verticale-edition) #p3 .archi-copy-wall .archi-mineral-window-elements{
  position:relative;
  display:inline-block;
  isolation:isolate;
}

body:not(.verticale-edition) #p3 .archi-copy-wall .archi-mineral-window-nickel::after,
body:not(.verticale-edition) #p3 .archi-copy-wall .archi-mineral-window-copper::after,
body:not(.verticale-edition) #p3 .archi-copy-wall .archi-mineral-window-elements::after{
  content:attr(data-word);
  position:absolute;
  z-index:1;
  inset:0;
  display:block;
  color:transparent;
  background-repeat:no-repeat,no-repeat;
  background-size:235% 100%,var(--archi-mineral-texture-size,180%) auto;
  background-position:100% 50%,var(--archi-texture-start-x,50%) var(--archi-texture-start-y,50%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  white-space:nowrap;
  opacity:.16;
  pointer-events:none;
  text-shadow:none !important;
  animation:archiMaterialWordPulse 5.6s cubic-bezier(.45,.05,.55,.95) infinite both;
}

body:not(.verticale-edition) #p3 .archi-copy-wall .archi-mineral-window-nickel::after{
  --archi-mineral-texture-size:155%;
  --archi-texture-start-x:45%;
  --archi-texture-start-y:42%;
  --archi-texture-end-x:55%;
  --archi-texture-end-y:47%;
  background-image:
    linear-gradient(
      102deg,
      rgba(18,25,24,.28) 0%,
      rgba(126,140,136,.12) 26%,
      rgba(255,255,252,.72) 40%,
      rgba(80,92,89,.12) 49%,
      rgba(238,247,243,.46) 63%,
      rgba(22,30,28,.26) 100%
    ),
    url('../assets/architecture-nickel-crystal-reference.webp');
  filter:contrast(1.24) saturate(.8);
}

body:not(.verticale-edition) #p3 .archi-copy-wall .archi-mineral-window-copper::after{
  --archi-mineral-texture-size:176%;
  --archi-texture-start-x:43%;
  --archi-texture-start-y:100%;
  --archi-texture-end-x:57%;
  --archi-texture-end-y:100%;
  background-image:
    linear-gradient(
      102deg,
      rgba(45,15,8,.34) 0%,
      rgba(111,49,29,.08) 27%,
      rgba(255,197,155,.46) 41%,
      rgba(75,29,16,.08) 51%,
      rgba(235,139,82,.28) 65%,
      rgba(42,14,8,.3) 100%
    ),
    url('optimized-v39/images/architecture-copper-material-atlas-v1--cf612dcb75d8.lossless.webp');
  filter:contrast(1.12) saturate(1.03) brightness(1.03);
  animation:archiCopperStrandPass 8.4s cubic-bezier(.45,.05,.55,.95) 1.2s infinite both;
}

body:not(.verticale-edition) #p3 .archi-copy-wall .archi-mineral-window-copper::before{
  content:attr(data-word);
  position:absolute;
  z-index:2;
  inset:0;
  display:block;
  color:transparent;
  background-image:url('optimized-v39/images/architecture-copper-material-atlas-v1--cf612dcb75d8.lossless.webp');
  background-repeat:no-repeat;
  background-size:176% auto;
  background-position:50% 0%;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  white-space:nowrap;
  opacity:0;
  pointer-events:none;
  filter:contrast(1.18) saturate(1.05) brightness(1.06);
  animation:archiCopperCircuitPass 8.4s cubic-bezier(.45,.05,.55,.95) infinite both;
}

body:not(.verticale-edition) #p3 .archi-copy-wall .archi-mineral-window-elements::after{
  background-image:linear-gradient(
    102deg,
    #183a3a 0%,
    #477f79 19%,
    #b9d8c8 39%,
    #6f9f75 56%,
    #d5e6c8 76%,
    #234c49 100%
  );
  animation-delay:1.8s;
}

@keyframes archiMaterialWordPulse{
  0%{opacity:.16;background-position:110% 50%,var(--archi-texture-start-x,50%) var(--archi-texture-start-y,50%);}
  10%{opacity:.48;}
  23%{opacity:.94;}
  38%{opacity:.64;}
  57%{opacity:.2;}
  76%{opacity:.38;}
  100%{opacity:.16;background-position:-10% 50%,var(--archi-texture-end-x,56%) var(--archi-texture-end-y,50%);}
}

@keyframes archiCopperCircuitPass{
  0%,6%{opacity:0;background-position:43% 0%;}
  16%{opacity:.72;}
  28%{opacity:.35;}
  38%,100%{opacity:0;background-position:57% 0%;}
}

@keyframes archiCopperStrandPass{
  0%,34%{opacity:0;background-position:43% 50%,43% 100%;}
  46%{opacity:.92;}
  60%{opacity:.48;}
  72%,100%{opacity:0;background-position:57% 50%,57% 100%;}
}

body:not(.verticale-edition) #p3 .archi-story-body:empty{
  display:none;
}

body:not(.verticale-edition) #p3 .archi-story-kicker:empty{
  display:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-origin"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  max-width:none;
}

/* View 02 cinematic reveal: the mined landscape holds, then a soft travelling
   edge paints the reimagined landscape from left to right. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-origin"] .architecture-origin-before-image{
  position:absolute;
  z-index:2;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:50% 50%;
  opacity:1;
  -webkit-mask-image:linear-gradient(90deg,
    transparent 0%,transparent 45%,rgba(0,0,0,.2) 47.5%,rgba(0,0,0,.76) 51%,#000 54.5%,#000 100%);
  mask-image:linear-gradient(90deg,
    transparent 0%,transparent 45%,rgba(0,0,0,.2) 47.5%,rgba(0,0,0,.76) 51%,#000 54.5%,#000 100%);
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-size:220% 100%;
  mask-size:220% 100%;
  -webkit-mask-position:100% 0;
  mask-position:100% 0;
  will-change:opacity,-webkit-mask-position,mask-position;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-origin"]:not(.is-hidden) .architecture-origin-before-image{
  animation:archiOriginBeforeWaft 3.8s cubic-bezier(.4,0,.2,1) both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-origin"]:not(.is-hidden) .architecture-origin-after-image{
  opacity:1;
  -webkit-mask-image:none;
  mask-image:none;
  animation:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-origin"]:not(.is-hidden) ~ .architecture-story-hud.is-entering{
  animation:none;
  opacity:1;
  transform:none;
  filter:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-origin"]:not(.is-hidden) ~ .architecture-story-hud.is-entering .archi-story-kicker{
  animation:
    archiOriginKickerIn .46s cubic-bezier(.2,.72,.2,1) .06s both,
    archiLetterFluoresce 6.8s ease-in-out .52s infinite;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-origin"]:not(.is-hidden) ~ .architecture-story-hud.is-entering .archi-story-title{
  animation:archiOriginTitleBoom .48s cubic-bezier(.16,.82,.2,1.18) .25s both;
}

@keyframes archiOriginBeforeWaft{
  0%,12%{
    opacity:1;
    -webkit-mask-position:100% 0;
    mask-position:100% 0;
  }
  92%{
    opacity:1;
    -webkit-mask-position:0 0;
    mask-position:0 0;
  }
  100%{
    opacity:0;
    -webkit-mask-position:0 0;
    mask-position:0 0;
  }
}

@keyframes archiOriginKickerIn{
  from{opacity:0;transform:translate3d(0,7px,0);}
  to{opacity:1;transform:translate3d(0,0,0);}
}

@keyframes archiOriginTitleBoom{
  0%{opacity:0;transform:translate3d(0,12px,0) scale(.97);}
  68%{opacity:1;transform:translate3d(0,-2px,0) scale(1.012);}
  100%{opacity:1;transform:translate3d(0,0,0) scale(1);}
}

/* Mining 03 — one locked construction reel. The territory does not jump
   through separate viewer slides: its armature, livelihood and planting
   arrive in one witnessed sequence. */
body:not(.verticale-edition) #p3 .architecture-mining-slide[data-panel-id="architecture-mining-v18"]{
  padding:0;
  overflow:hidden;
  background:#020503;
}

body:not(.verticale-edition) #p3 .architecture-growth-reel,
body:not(.verticale-edition) #p3 .architecture-growth-frame,
body:not(.verticale-edition) #p3 .architecture-growth-frame img{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  margin:0;
}

body:not(.verticale-edition) #p3 .architecture-growth-reel{
  z-index:0;
  overflow:hidden;
  background:#030604;
}

body:not(.verticale-edition) #p3 .architecture-growth-frame{
  opacity:0;
  overflow:hidden;
  will-change:opacity,transform,filter,clip-path;
}

body:not(.verticale-edition) #p3 .architecture-growth-frame img{
  max-width:none;
  object-fit:cover;
  object-position:50% 0;
  transform:translateY(-1%) scale(1.045);
  transform-origin:50% 0;
}

body:not(.verticale-edition) #p3 .architecture-growth-frame-ground{
  z-index:0;
  opacity:1;
}

body:not(.verticale-edition) #p3 .architecture-growth-frame-lev{z-index:1;}
body:not(.verticale-edition) #p3 .architecture-growth-frame-build{z-index:2;}
body:not(.verticale-edition) #p3 .architecture-growth-frame-grow{z-index:3;}
body:not(.verticale-edition) #p3 .architecture-growth-frame-master-memory{
  z-index:4;
  opacity:0;
}

/* Scene 03 opens with the excavator strike, then reveals the same barren
   canvas underneath without changing the reel's total run. */
body:not(.verticale-edition) #p3 .architecture-growth-frame-strike{
  z-index:5;
  opacity:0;
  transform-origin:56% 44%;
}

body:not(.verticale-edition) #p3 .architecture-growth-frame-strike img{
  object-position:58% 42%;
  transform:translateY(-1%) scale(1.045);
  transform-origin:58% 42%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"].is-growth-reel-playing .architecture-growth-frame-strike{
  animation:archiGrowthExcavatorStrike 5.25s cubic-bezier(.18,.76,.18,1) both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"].is-growth-reel-settled .architecture-growth-frame-strike{
  opacity:0;
}

/* The opening memory inherits the exact approved framing of Scenes 01–02.
   This keeps the source plate's presentation rim outside the live image. */
body:not(.verticale-edition) #p3 .architecture-growth-frame-master-memory img{
  object-position:50% 0;
  transform:translateY(-1%) scale(1.08);
  transform-origin:50% 0;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"].is-growth-reel-playing .architecture-growth-frame-lev{
  animation:archiGrowthLevFrame 3s cubic-bezier(.2,.66,.18,1) 5.25s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"].is-growth-reel-playing .architecture-growth-frame-build{
  animation:archiGrowthLivingBuild 3.2s cubic-bezier(.22,.64,.18,1) 11.95s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"].is-growth-reel-playing .architecture-growth-frame-grow{
  animation:archiGrowthLivingCanopy 3.4s cubic-bezier(.2,.66,.16,1) 16.75s both;
}

body:not(.verticale-edition) #p3 .architecture-growth-writ{
  position:absolute;
  z-index:4;
  inset:0;
  display:block;
  pointer-events:none;
}

body:not(.verticale-edition) #p3 .architecture-growth-beat{
  position:absolute;
  left:32px;
  right:32px;
  bottom:84px;
  display:block;
  margin:0;
  color:#fff;
  font:400 40px/1.08 'Archivo Black',sans-serif;
  letter-spacing:-.018em;
  word-spacing:normal;
  text-align:left;
  text-shadow:none;
  opacity:0;
  will-change:opacity,transform,filter;
}

body:not(.verticale-edition) #p3 .architecture-growth-beat-canvas{
  left:16px !important;
  right:auto !important;
  width:max-content !important;
  margin-left:0 !important;
  bottom:41px;
  opacity:1;
  text-align:left;
}

body:not(.verticale-edition) #p3 .architecture-growth-beat-canvas span{
  display:block;
  opacity:0;
  will-change:opacity,transform,filter;
}

body:not(.verticale-edition) #p3 .architecture-growth-canvas-title{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  width:max-content;
  font:400 57.5pt/.94 'Archivo Black',sans-serif;
  letter-spacing:-.012em;
  line-height:.94;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 .architecture-growth-canvas-title > span{
  display:block;
  width:max-content;
  font:inherit;
  line-height:.94;
  white-space:nowrap;
  opacity:1;
}

body:not(.verticale-edition) #p3 .architecture-growth-canvas-answer{
  margin-top:8px;
  font:400 22pt/1.28 'IBM Plex Sans',sans-serif;
  letter-spacing:0;
  text-transform:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"].is-growth-reel-playing .architecture-growth-canvas-title{
  animation:archiGrowthCanvasLine 5.45s cubic-bezier(.2,.7,.18,1) .35s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"].is-growth-reel-playing .architecture-growth-canvas-answer{
  animation:archiGrowthCanvasLine 4.15s cubic-bezier(.2,.7,.18,1) 1.65s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"].is-growth-reel-playing .architecture-growth-beat-soil{
  animation:archiGrowthWritBeat 4.15s cubic-bezier(.2,.7,.18,1) 8.15s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"].is-growth-reel-playing .architecture-growth-beat-plant{
  animation:archiGrowthWritBeat 4.15s cubic-bezier(.2,.7,.18,1) 12.35s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"].is-growth-reel-playing .architecture-growth-beat-community{
  animation:archiGrowthWritBeat 4.20s cubic-bezier(.2,.7,.18,1) 16.55s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"].is-growth-reel-playing:not(.is-hidden) ~ .architecture-story-hud.is-entering{
  opacity:0;
  transform:none;
  filter:none;
  animation:archiGrowthFinalTitle .9s cubic-bezier(.18,.74,.2,1) 21.25s both;
}

@keyframes archiGrowthCanvasLine{
  0%{opacity:0;transform:translate3d(0,8px,0);filter:blur(.7px);}
  14%,82%{opacity:1;transform:translate3d(0,0,0);filter:blur(0);}
  92%{opacity:.2;transform:translate3d(0,-1px,0);filter:blur(.15px);}
  100%{opacity:0;transform:translate3d(0,-2px,0);filter:blur(.3px);}
}

@keyframes archiGrowthExcavatorStrike{
  0%{opacity:1;transform:scale(1.02);filter:brightness(.86) saturate(.92);}
  68%{opacity:1;transform:scale(1.16);filter:brightness(.94) saturate(.96);}
  100%{opacity:0;transform:scale(1.34);filter:brightness(1) saturate(1);}
}

@keyframes archiGrowthLevFrame{
  0%,9%{opacity:0;transform:scale(1.016);filter:brightness(.78) saturate(.84);}
  40%{opacity:.94;filter:brightness(.94) saturate(.94);}
  67%,100%{opacity:1;transform:scale(1);filter:brightness(1) saturate(1);}
}

@keyframes archiGrowthLivingBuild{
  0%,10%{opacity:0;transform:scale(1.012);filter:brightness(.82) saturate(.84);}
  43%{opacity:.9;filter:brightness(.96) saturate(.93);}
  70%,100%{opacity:1;transform:scale(1);filter:brightness(1) saturate(1);}
}

@keyframes archiGrowthLivingCanopy{
  0%,8%{opacity:0;transform:scale(1.01);filter:brightness(.86) saturate(.86);}
  42%{opacity:.88;filter:brightness(.98) saturate(.98);}
  64%,100%{opacity:1;transform:scale(1);filter:brightness(1) saturate(1);}
}

@keyframes archiGrowthWritBeat{
  0%{opacity:0;transform:translate3d(0,8px,0);filter:blur(.7px);}
  14%,82%{opacity:1;transform:translate3d(0,0,0);filter:blur(0);}
  92%{opacity:.2;transform:translate3d(0,-1px,0);filter:blur(.15px);}
  100%{opacity:0;transform:translate3d(0,-2px,0);filter:blur(.3px);}
}

@keyframes archiGrowthFinalTitle{
  from{opacity:0;transform:translate3d(0,8px,0);}
  to{opacity:1;transform:translate3d(0,0,0);}
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker{
  position:relative;
  top:3px;
  color:#69be12;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:clamp(31px,2.58vw,41px);
  font-weight:700;
  line-height:1.15;
  letter-spacing:.14em;
  text-transform:uppercase;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"]:not(.is-hidden) ~ .architecture-story-hud{
  left:32px;
  right:32px;
  max-width:none;
  width:auto;
  bottom:29px;
  gap:4px;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  position:relative;
  top:-3pt;
  left:0;
  align-self:flex-start;
  width:100% !important;
  max-width:none;
  line-height:1.2;
  white-space:pre-line;
  text-wrap:wrap;
  text-align:right;
}

#p3 .archi-tone-light .archi-story-title,
#p3 .archi-tone-light .archi-story-body{
  color:#071015;
}

#p3 .archi-story-provenance{
  margin:4px 0 0;
  max-width:68ch;
  color:#8cdc35;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:clamp(13px,1vw,16px);
  font-weight:700;
  line-height:1.25;
  letter-spacing:.1em;
  text-transform:uppercase;
  text-shadow:none !important;
}

/* Quiet fluorescence within the green slide typography itself: a restrained
   reading current, with no halo, glow, or change to the letter edges. */
#p3 .architecture-story-hud .archi-story-kicker:not([hidden]),
#p3 .architecture-story-hud .archi-story-provenance:not([hidden]),
body:not(.verticale-edition) #p3 .architecture-story-hud.archi-copy-wall .archi-story-body:not([hidden]){
  --archi-fluor-base:#69be12;
  --archi-fluor-lift:#86d92f;
  --archi-fluor-crest:#a8eb57;
  color:var(--archi-fluor-base);
  background-image:linear-gradient(
    102deg,
    var(--archi-fluor-base) 0%,
    var(--archi-fluor-base) 42%,
    var(--archi-fluor-lift) 47%,
    var(--archi-fluor-crest) 50%,
    var(--archi-fluor-lift) 53%,
    var(--archi-fluor-base) 58%,
    var(--archi-fluor-base) 100%
  );
  background-repeat:no-repeat;
  background-size:235% 100%;
  background-position:100% 50%;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:archiLetterFluoresce 6.8s ease-in-out infinite;
  text-shadow:none !important;
}

body:not(.verticale-edition) #p3 .architecture-story-hud.archi-copy-wall .archi-story-body:not([hidden]){
  font-family:'IBM Plex Sans',sans-serif;
  font-weight:700;
}

#p3 .architecture-story-hud .archi-story-provenance:not([hidden]),
body:not(.verticale-edition) #p3 .architecture-story-hud.archi-copy-wall .archi-story-body:not([hidden]){
  --archi-fluor-base:#8cdc35;
  --archi-fluor-lift:#a3ea50;
  --archi-fluor-crest:#c1f778;
}

body:not(.verticale-edition) #p3 .architecture-story-hud.archi-copy-wall .archi-story-body:not([hidden]){
  animation-delay:.55s;
}

#p3 .architecture-story-hud .archi-story-provenance:not([hidden]){
  animation-delay:.35s;
}

@keyframes archiLetterFluoresce{
  0%{background-position:100% 50%;}
  72%,100%{background-position:0% 50%;}
}

#p3 .archi-tone-light .archi-story-provenance{
  color:#3e780d;
}

#p3 .archi-story-cue{
  display:none !important;
  align-items:center;
  min-height:25px;
  margin-top:5px;
  padding:4px 9px;
  border:1px solid rgba(105,190,18,.6);
  border-radius:999px;
  color:#8cdc35;
  background:rgba(3,9,5,.72);
  font-family:'DM Mono',monospace;
  font-size:9px;
  line-height:1.1;
  letter-spacing:.13em;
  text-transform:uppercase;
}

#p3 .archi-story-slide:not(.is-hidden) .archi-story-copy{
  animation:archiStoryCopyIn .72s cubic-bezier(.2,.72,.2,1) .08s both;
}

@keyframes archiStoryCopyIn{
  from{opacity:0;transform:translate3d(0,10px,0);filter:blur(1px);}
  to{opacity:1;transform:translate3d(0,0,0);filter:blur(0);}
}

#p3 .archi-copy-center:not(.is-hidden) .archi-story-copy{
  animation:archiStoryCopyCenterIn .72s cubic-bezier(.2,.72,.2,1) .08s both;
}

@keyframes archiStoryCopyCenterIn{
  from{opacity:0;transform:translate(-50%,calc(-50% + 10px));filter:blur(1px);}
  to{opacity:1;transform:translate(-50%,-50%);filter:blur(0);}
}

#p3 .archi-story-placeholder{
  background:
    radial-gradient(circle at 70% 24%,rgba(105,190,18,.2),transparent 24%),
    linear-gradient(145deg,#111813,#030504 74%);
}

#p3 .archi-story-placeholder::before{
  content:"";
  position:absolute;
  z-index:0;
  inset:8%;
  border:1px solid rgba(105,190,18,.32);
  border-radius:44% 56% 48% 52% / 58% 44% 56% 42%;
  transform:rotate(-4deg);
}

#p3 .archi-placeholder-wolf{
  background:
    radial-gradient(circle at 72% 20%,rgba(235,239,221,.17) 0 9%,transparent 9.5%),
    linear-gradient(160deg,#18211c 0,#070b08 58%,#020302 100%);
}

#p3 .archi-placeholder-wolf .archi-placeholder-mark{
  position:absolute;
  z-index:2;
  top:12%;
  right:10%;
  color:rgba(255,255,255,.08);
  font-family:'Archivo Black',sans-serif;
  font-size:clamp(72px,12vw,190px);
  line-height:.8;
  letter-spacing:-.06em;
}

#p3 .archi-placeholder-droplet{
  background:radial-gradient(circle at 50% 48%,#183829 0,#07120d 44%,#020403 78%);
}

#p3 .archi-placeholder-droplet .archi-droplet{
  position:absolute;
  z-index:2;
  left:50%;
  top:44%;
  width:min(24vw,250px);
  aspect-ratio:1;
  border:1px solid rgba(126,222,54,.64);
  border-radius:66% 34% 64% 36% / 72% 37% 63% 28%;
  transform:translate(-50%,-50%) rotate(45deg);
  box-shadow:0 0 0 18px rgba(105,190,18,.035),0 0 0 42px rgba(105,190,18,.025);
}

#p3 .archi-bridge-card{
  background:
    linear-gradient(rgba(105,190,18,.07) 1px,transparent 1px),
    linear-gradient(90deg,rgba(105,190,18,.07) 1px,transparent 1px),
    radial-gradient(circle at 50% 50%,#132317,#030604 68%);
  background-size:54px 54px,54px 54px,auto;
}

#p3 .archi-bridge-card::before{
  content:"";
  position:absolute;
  z-index:1;
  left:7%;
  right:7%;
  top:50%;
  height:1px;
  background:linear-gradient(90deg,transparent,#69be12 20% 80%,transparent);
  opacity:.55;
}

#p3 .architecture-hugong-origin-saucer-copy{
  display:none;
}

#p3 .archi-image-top > .archi-story-image{object-position:50% 24%;}
#p3 .archi-image-bottom > .archi-story-image{object-position:50% 76%;}
#p3 .archi-image-left > .archi-story-image{object-position:28% 50%;}
#p3 .archi-image-right > .archi-story-image{object-position:72% 50%;}
#p3 .archi-image-zoom > .archi-story-image{transform:scale(1.1);}

#p3 .archi-story-slide,
#p3 .archi-story-slide *{
  text-shadow:none !important;
}

/* One shared story layer sits above every existing Architecture image. */
#p3 .golden-box > .architecture-story-scrim{
  position:absolute;
  inset:14px 8px 2px;
  z-index:3;
  display:block;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(2,7,8,.02) 0 40%,rgba(2,7,8,.86) 100%),
    linear-gradient(90deg,rgba(2,7,8,.24),transparent 66%);
}

#p3 .golden-box > .architecture-story-scrim.archi-copy-top{
  background:linear-gradient(180deg,rgba(2,7,8,.86) 0,rgba(2,7,8,.2) 60%,transparent 100%);
}

#p3 .golden-box > .architecture-story-scrim.archi-copy-center{
  background:radial-gradient(ellipse at center,rgba(2,7,8,.15),rgba(2,7,8,.86));
}

/* View 00 returns to the approved Banatti lower-left title origin:
   20px inside the image edge, 27px above its lower edge. */
#p3 .architecture-story-hud.archi-copy-start{
  left:28px;
  right:28px;
  bottom:29px;
  max-width:calc(100% - 56px);
  align-items:flex-start;
  text-align:left;
}

#p3 .golden-box > .architecture-story-scrim.archi-copy-start{
  background:none !important;
}

#p3 .golden-box > .architecture-story-scrim.archi-copy-wall{
  background:none;
}

#p3 .architecture-mining-prologue::after{
  background:none;
}

#p3 .architecture-mining-slide.archi-question-wall{
  background:#010201;
}

#p3 .architecture-mining-slide.archi-question-wall::before,
#p3 .architecture-mining-slide.archi-question-wall::after{
  content:none;
}

/* View 01 joins the black-board family: IBM Plex lives only in the wired
   menu header; the statement below is one unbroken Archivo voice. */
body:not(.verticale-edition) #p3 .architecture-question-menu-stage{
  position:absolute;
  z-index:5;
  inset:0;
  pointer-events:none;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credits-eyebrow.architecture-question-menu{
  top:6.5%;
  left:12%;
  width:68%;
  min-height:54px;
  padding:4px 24px;
  justify-content:flex-start;
  border-radius:51px / 13px;
  font-size:20px;
  text-align:left;
  opacity:1;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credits-rule.architecture-question-menu-rule{
  display:block;
  top:11.35%;
  background:linear-gradient(90deg,transparent,rgba(105,190,18,.7) 5% 8%,transparent 8% 76%,rgba(105,190,18,.7) 76% 95%,transparent);
  opacity:1;
  transform:scaleX(1);
}

body:not(.verticale-edition) #p3 .architecture-question-menu-rule::before{left:0;}
body:not(.verticale-edition) #p3 .architecture-question-menu-rule::after{right:0;}

/* Architecture 00 speaks one pure-white thought per image. The words stay
   on the established left caption edge and never occupy the image centre. */
body:not(.verticale-edition) #p3 .architecture-question-scene-writ{
  position:absolute;
  z-index:4;
  inset:0;
  display:block;
  margin:0;
  color:#fff;
  font-family:'Archivo Black',sans-serif;
  font-size:40px;
  font-weight:400;
  line-height:1.04;
  letter-spacing:-.012em;
  word-spacing:normal;
  text-align:left;
  text-align-last:left;
  pointer-events:none;
}

body:not(.verticale-edition) #p3 .architecture-question-scene-beat{
  position:absolute;
  left:32px;
  right:32px;
  bottom:84px;
  display:block;
  margin:0;
  color:#fff;
  background:none;
  -webkit-text-fill-color:#fff;
  font:400 40px/1.04 'Archivo Black',sans-serif;
  letter-spacing:-.012em;
  word-spacing:normal;
  text-align:left;
  text-align-last:left;
  opacity:0;
  will-change:opacity,transform,filter;
}

body:not(.verticale-edition) #p3 .architecture-question-scene-beat-mining{font-size:56px;}
body:not(.verticale-edition) #p3 .architecture-question-scene-beat-mining{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:0;
  line-height:.78;
  white-space:nowrap;
}
body:not(.verticale-edition) #p3 .architecture-question-scene-beat-mining > span{
  display:block;
  width:max-content;
  line-height:.78;
  white-space:nowrap;
}
body:not(.verticale-edition) #p3 .architecture-question-scene-beat-mining .archi-scene00-beat-when{font-size:42px;}
body:not(.verticale-edition) #p3 .architecture-question-scene-beat-mining .archi-scene00-beat-we{font-size:112px;}
body:not(.verticale-edition) #p3 .architecture-question-scene-beat-mining .archi-scene00-beat-mine-nature{font-size:50pt;}
body:not(.verticale-edition) #p3 .architecture-question-scene-beat-nickel{font-size:42px;}
body:not(.verticale-edition) #p3 .architecture-question-scene-beat-copper{font-size:44px;}
body:not(.verticale-edition) #p3 .architecture-question-scene-beat-multiplication{font-size:46px;}
body:not(.verticale-edition) #p3 .architecture-question-scene-beat-elements{font-size:48px;}
body:not(.verticale-edition) #p3 .architecture-question-scene-beat-after{
  font-size:74px;
  line-height:.98;
}

body:not(.verticale-edition) #p3 .architecture-question-scene-beat-after > span{
  display:block;
}

body:not(.verticale-edition) #p3 .architecture-question-scene-beat-after > span:nth-child(1){
  font-size:140px;
}

body:not(.verticale-edition) #p3 .architecture-question-scene-beat-after > span:nth-child(2){
  font-size:79px;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 .architecture-question-scene-beat-after > span:nth-child(3){
  font-size:74px;
}

/* Architecture 00 — the proposition becomes a brief material memory.
   Each glimpse arrives in the order spoken, then the reel settles on the
   mined coast that becomes the untouched first frame of 01. */
body:not(.verticale-edition) #p3 .architecture-opening-reel{
  position:absolute;
  z-index:1;
  inset:0;
  overflow:hidden;
  background:#010201;
  pointer-events:none;
}

body:not(.verticale-edition) #p3 .architecture-opening-reel::after{
  content:"";
  position:absolute;
  z-index:2;
  inset:0;
  background:
    linear-gradient(90deg,rgba(0,0,0,.30),rgba(0,0,0,.04) 56%,rgba(0,0,0,.10)),
    linear-gradient(180deg,rgba(0,0,0,.08),transparent 55%,rgba(0,0,0,.18));
  pointer-events:none;
}

body:not(.verticale-edition) #p3 .architecture-opening-reel-frame{
  position:absolute;
  z-index:1;
  inset:0;
  margin:0;
  opacity:0;
  overflow:hidden;
  transform:scale(1.04);
  will-change:opacity,transform;
}

body:not(.verticale-edition) #p3 .architecture-opening-reel-frame img{
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:50% 50%;
}

body:not(.verticale-edition) #p3 .architecture-opening-reel-frame-nickel img{object-position:52% 50%;}
body:not(.verticale-edition) #p3 .architecture-opening-reel-frame-nickel-ore img{object-position:48% 52%;}
body:not(.verticale-edition) #p3 .architecture-opening-reel-frame-nickel-use img{object-position:51% 52%;}
body:not(.verticale-edition) #p3 .architecture-opening-reel-frame-copper-ore img{object-position:55% 50%;}
body:not(.verticale-edition) #p3 .architecture-opening-reel-frame-elements img{object-position:50% 51%;}
body:not(.verticale-edition) #p3 .architecture-opening-reel-frame-destruction img{object-position:51% 50%;}
body:not(.verticale-edition) #p3 .architecture-opening-reel-frame-barren img{object-position:50% 50%;}

/* The former three-image copper atlas is now read as three separate thoughts.
   Each third is enlarged into its own complete frame. */
body:not(.verticale-edition) #p3 :is(
  .architecture-opening-reel-frame-copper-coil,
  .architecture-opening-reel-frame-copper-strands,
  .architecture-opening-reel-frame-copper-circuit
) img{
  position:absolute;
  left:50%;
  width:300%;
  height:auto;
  max-width:none;
}

body:not(.verticale-edition) #p3 .architecture-opening-reel-frame-copper-circuit img{
  top:0;
  transform:translateX(-50%);
}

body:not(.verticale-edition) #p3 .architecture-opening-reel-frame-copper-coil img{
  top:50%;
  transform:translate(-50%,-50%);
}

body:not(.verticale-edition) #p3 .architecture-opening-reel-frame-copper-strands img{
  bottom:0;
  transform:translateX(-50%);
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"].is-opening-reel-playing .architecture-opening-reel-frame:not(.architecture-opening-reel-frame-barren):not(.architecture-opening-reel-frame-destruction){
  animation:archiOpeningMaterialGlimpse var(--archi-opening-duration,2.80s) cubic-bezier(.22,.65,.2,1) var(--archi-opening-delay,0s) both;
}

body:not(.verticale-edition) #p3 .architecture-opening-reel-frame-nickel{--archi-opening-delay:0s;--archi-opening-duration:4.60s;}
body:not(.verticale-edition) #p3 .architecture-opening-reel-frame-nickel-ore{--archi-opening-delay:3.60s;}
body:not(.verticale-edition) #p3 .architecture-opening-reel-frame-nickel-use{--archi-opening-delay:5.40s;}
body:not(.verticale-edition) #p3 .architecture-opening-reel-frame-copper-ore{--archi-opening-delay:7.20s;}
body:not(.verticale-edition) #p3 .architecture-opening-reel-frame-copper-coil{--archi-opening-delay:9.00s;}
body:not(.verticale-edition) #p3 .architecture-opening-reel-frame-copper-strands{--archi-opening-delay:10.80s;}
body:not(.verticale-edition) #p3 .architecture-opening-reel-frame-copper-circuit{--archi-opening-delay:12.60s;}
body:not(.verticale-edition) #p3 .architecture-opening-reel-frame-elements{--archi-opening-delay:14.40s;}

body:not(.verticale-edition) #p3 .architecture-question-scene-beat-mining{--archi-writ-delay:.25s;--archi-writ-duration:3.58s;}
body:not(.verticale-edition) #p3 .architecture-question-scene-beat-nickel{--archi-writ-delay:3.85s;--archi-writ-duration:1.92s;}
body:not(.verticale-edition) #p3 .architecture-question-scene-beat-copper{--archi-writ-delay:7.45s;--archi-writ-duration:3.75s;}
body:not(.verticale-edition) #p3 .architecture-question-scene-beat-multiplication{--archi-writ-delay:11.40s;--archi-writ-duration:3.05s;}
body:not(.verticale-edition) #p3 .architecture-question-scene-beat-elements{--archi-writ-delay:14.65s;--archi-writ-duration:1.92s;}
body:not(.verticale-edition) #p3 .architecture-question-scene-beat-after{--archi-writ-delay:16.52s;--archi-writ-duration:3.35s;}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"].is-opening-reel-playing .architecture-question-scene-beat{
  animation:archiOpeningWritBeat var(--archi-writ-duration,2.2s) cubic-bezier(.2,.72,.2,1) var(--archi-writ-delay,0s) both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"] .architecture-question-scene-writ,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"] .architecture-question-scene-writ *,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"]:not(.is-hidden) ~ .architecture-story-hud,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"]:not(.is-hidden) ~ .architecture-story-hud *{
  text-shadow:none !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"].is-opening-reel-playing .architecture-opening-reel-frame-destruction{
  animation:archiOpeningDestructionWitness 4.70s cubic-bezier(.24,.66,.2,1) 15.20s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"].is-opening-reel-playing .architecture-opening-reel-frame-barren{
  animation:archiOpeningBarrenSettle 2.60s cubic-bezier(.22,.68,.2,1) 16.95s both;
}

/* The REEL light can return to ready without taking the final pit away. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"].is-opening-reel-settled .architecture-opening-reel-frame-barren{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
  filter:brightness(.94) saturate(.96);
}

@keyframes archiOpeningMaterialGlimpse{
  0%{opacity:0;transform:translate3d(0,-5px,0) scale(1.045);filter:brightness(.80) saturate(.86);}
  28%{opacity:1;filter:brightness(.97) saturate(.95);}
  48%{opacity:1;}
  68%{opacity:.78;}
  87%{opacity:.30;}
  100%{opacity:0;transform:translate3d(0,5px,0) scale(1.015);filter:brightness(.84) saturate(.86);}
}

@keyframes archiOpeningWritBeat{
  0%{opacity:0;transform:translate3d(0,-11px,0);filter:blur(1px);}
  24%,92%{opacity:1;transform:translate3d(0,0,0);filter:blur(0);}
  97%{opacity:1;transform:translate3d(0,0,0);filter:blur(0);}
  100%{opacity:0;transform:translate3d(0,2px,0);filter:blur(0);}
}

@keyframes archiOpeningDestructionWitness{
  0%{opacity:0;transform:translate3d(0,-4px,0) scale(1.03);filter:brightness(.78) saturate(.84);}
  18%{opacity:1;filter:brightness(.94) saturate(.94);}
  32%{opacity:1;}
  68%{opacity:.62;}
  100%{opacity:0;transform:translate3d(0,4px,0) scale(1.01);filter:brightness(.82) saturate(.84);}
}

@keyframes archiOpeningBarrenSettle{
  0%{opacity:0;transform:translate3d(0,-3px,0) scale(1.055);filter:brightness(.70) saturate(.82);}
  30%{opacity:.34;filter:brightness(.84) saturate(.89);}
  72%{opacity:.90;filter:brightness(.96) saturate(.96);}
  100%{opacity:1;transform:translate3d(0,0,0) scale(1);filter:brightness(.94) saturate(.96);}
}

body:not(.verticale-edition) #p3 .archi-question-wall:not(.is-hidden) .architecture-question-menu-rule{
  animation:sipalayCreditsRule 1.3s cubic-bezier(.2,.72,.2,1) .12s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"]:not(.is-hidden) ~ .architecture-story-hud.archi-copy-wall{
  top:59%;
  left:calc(12% + 24px);
  right:8%;
  max-width:none;
  gap:12px;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  font-family:'Archivo Black',sans-serif;
  font-weight:400;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  margin-top:10px;
  font-size:26pt;
  line-height:1.08;
}

/* Architecture 00 — echo Scene 06's monument and separated answer line. */
body:not(.verticale-edition) #p3 .architecture-question-scene-beat-after{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  width:auto;
  font-size:51px;
  line-height:.94;
}

body:not(.verticale-edition) #p3 .architecture-question-scene-beat-after > span:first-child{
  display:block;
  font-size:150pt;
  line-height:.78;
  letter-spacing:-.06em;
}

body:not(.verticale-edition) #p3 .architecture-question-scene-beat-after > .architecture-question-scene-beat-after-line{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
  width:auto;
  gap:0;
  font-size:51px;
  line-height:.94;
  letter-spacing:-.045em;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 .architecture-question-scene-beat-after-line > span{
  display:block;
  width:auto;
  font-size:inherit;
  line-height:inherit;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 .architecture-question-scene-beat-after-line > span:last-child{
  text-align:left;
  transform:none;
}

body:not(.verticale-edition) #p3 .architecture-question-scene-beat-after-line > span:first-child{
  font-size:44px;
}

body:not(.verticale-edition) #p3 .architecture-question-scene-gifts-line{
  font-size:51px;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 .architecture-question-scene-gifts-word{
  display:inline-block;
}

body:not(.verticale-edition) #p3 .architecture-question-scene-gifts-tail{
  display:block;
  font-size:51px;
  position:relative;
  top:-5px;
}

/* KRAKEN hold for Architecture 00: keep the working frame visible while the
   composition is being tuned, without changing the normal reel. */
body.banatti-kraken-manual:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"].is-opening-reel-manual .architecture-opening-reel-frame{
  animation:none !important;
  opacity:0 !important;
  transform:translate3d(0,0,0) scale(1) !important;
}

body.banatti-kraken-manual:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"].is-opening-reel-manual .architecture-opening-reel-frame-barren{
  opacity:1 !important;
  filter:brightness(.94) saturate(.96);
}

body.banatti-kraken-manual:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"].is-opening-reel-manual .architecture-question-scene-beat{
  animation:none !important;
  opacity:0 !important;
  transform:translate3d(0,0,0) !important;
}

body.banatti-kraken-manual:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"].is-opening-reel-manual .architecture-question-scene-beat-after{
  opacity:1 !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"]:not(.is-hidden) ~ .architecture-story-hud .archi-question-body-lead{
  display:block;
  font-size:21pt;
  line-height:1.05;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"]:not(.is-hidden) ~ .architecture-story-hud .archi-question-body-thesis{
  display:block;
  margin-top:16px;
  font-size:29pt;
  line-height:1.05;
}

#p3 .architecture-mining-slide.architecture-mining-fullbleed{
  padding:0;
  overflow:hidden;
  background:#080b09;
}

#p3 .architecture-mining-fullbleed-image{
  position:absolute;
  z-index:0;
  top:0;
  left:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:50% 0;
  transform:translateY(-1%) scale(1.045);
  transform-origin:50% 0;
}

#p3 [data-panel-id="architecture-mining-origin"] .architecture-mining-fullbleed-image{
  transform:translateY(-1%) scale(1.08);
}

/* Scene 02 continues the exact original framing established in Scene 01. */
#p3 [data-panel-id="architecture-mining-v16"].architecture-mining-prologue img{
  object-position:50% 0;
  transform:translateY(-1%) scale(1.08);
  transform-origin:50% 0;
  backface-visibility:hidden;
}

/* Scene 02 title block — three quiet words, with Nature setting the measure. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v16"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  width:max-content !important;
  max-width:100% !important;
  white-space:nowrap;
  text-align:left;
}
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v16"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title > span{
  display:block;
  width:max-content;
  line-height:.94;
  white-space:nowrap;
}
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v16"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title .archi-scene02-title-nature{
  font-size:156%;
}

#p3 [data-panel-id="architecture-mining-v16"].architecture-mining-prologue{
  overflow:hidden;
  contain:paint;
}

#p3 [data-panel-id="architecture-mining-v16"] .architecture-man-within-camera{
  position:absolute;
  z-index:0;
  inset:0;
  overflow:visible;
  transform:translate3d(0,0,0);
  will-change:transform;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v16"].architecture-mining-prologue:not(.is-hidden) .architecture-man-within-camera{
  animation:architectureMiningManWithinNatureFlight 4s cubic-bezier(.33,.33,.67,.67) both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v16"].architecture-mining-prologue:not(.is-hidden) .architecture-man-within-camera img{
  animation:architectureMiningManWithinNatureFocus 4s cubic-bezier(.33,.33,.67,.67) both;
  will-change:transform;
}

@keyframes architectureMiningManWithinNatureFlight{
  0%{transform:translate3d(0,0,0);}
  16%{transform:translate3d(1.15%,0,0);}
  36%{transform:translate3d(.42%,0,0);}
  56%{transform:translate3d(-1.65%,0,0);}
  78%{transform:translate3d(-.76%,0,0);}
  98%{transform:translate3d(0,0,0);}
  99.1%{transform:translate3d(0,.012%,0);}
  100%{transform:translate3d(0,0,0);}
}

@keyframes architectureMiningManWithinNatureFocus{
  0%{transform:translateY(-1%) scale(1.08);}
  16%{transform:translateY(-1.2%) scale(1.18);}
  36%{transform:translateY(-1.5%) scale(1.30);}
  46%{transform:translateY(-1.7%) scale(1.32);}
  64%{transform:translateY(-1.52%) scale(1.29);}
  82%{transform:translateY(-1.22%) scale(1.17);}
  98%{transform:translateY(-1%) scale(1.08);}
  99.1%{transform:translateY(-1%) scale(1.0815);}
  100%{transform:translateY(-1%) scale(1.08);}
}

@media (prefers-reduced-motion:reduce){
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v16"].architecture-mining-prologue:not(.is-hidden) .architecture-man-within-camera,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v16"].architecture-mining-prologue:not(.is-hidden) .architecture-man-within-camera img{
    animation:none !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v16"].architecture-mining-prologue:not(.is-hidden) .architecture-man-within-camera{
    transform:translate3d(0,0,0);
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v16"].architecture-mining-prologue:not(.is-hidden) .architecture-man-within-camera img{
    transform:translateY(-1%) scale(1.08);
  }
}

/* 15A map reveal — let the map breathe in a few readable gestures while the
   red signal keeps NEXT held. The public handoff to 15B still follows after
   this short opening tableau. */
@keyframes hugongMapGroveIn{
  from{opacity:0;transform:translateX(64px);filter:blur(1px);}
  to{opacity:1;transform:translateX(0);filter:blur(0);}
}

@keyframes hugongMapBodyIn{
  from{opacity:0;transform:translateY(10px);filter:blur(1px);}
  to{opacity:1;transform:translateY(0);filter:blur(0);}
}

body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing .architecture-hugong-map-callout-riverwalk{
  opacity:0 !important;
  animation:hugongMapRiverwalkIn .56s cubic-bezier(.2,.72,.2,1) .72s both !important;
}

body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing .architecture-hugong-map-callout-center{
  animation:hugongMapCalloutIn .62s cubic-bezier(.2,.72,.2,1) 1.42s both !important;
}

body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing .architecture-hugong-map-callout-locale{
  animation:hugongMapGroveIn .68s cubic-bezier(.2,.72,.2,1) 2.32s both !important;
}

body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing .architecture-hugong-map-callout-line-center,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing .architecture-hugong-map-callout-node-center{
  display:block !important;
  animation:hugongMapCalloutLineIn .56s ease 1.42s both !important;
}

body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing .architecture-hugong-map-callout-line-locale,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing .architecture-hugong-map-callout-node-locale{
  display:block !important;
  animation:hugongMapCalloutLineIn .56s ease 2.32s both !important;
}

body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing .architecture-hugong-map-callout-line-riverwalk,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing .architecture-hugong-map-callout-node-riverwalk{
  display:block !important;
  animation:hugongMapCalloutLineIn .56s ease .72s both !important;
}

body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing .architecture-story-hud .archi-story-body.is-hugong-map-body-entering{
  animation:hugongMapBodyIn .62s cubic-bezier(.2,.72,.2,1) both !important;
}

/* September 14, 2026 — Scene 14 opens the restoration chapter before the drawings. */
#p3 .architecture-hugong-restoration-frame{
  position:absolute;
  inset:0;
  padding:0;
  overflow:hidden;
  background:#030604;
}

#p3 .architecture-hugong-restoration-reel,
#p3 .architecture-hugong-restoration-shot,
#p3 .architecture-hugong-restoration-shot img{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  margin:0;
}

#p3 .architecture-hugong-restoration-reel{
  z-index:0;
  overflow:hidden;
  background:#030604;
}

#p3 .architecture-hugong-restoration-shot{
  opacity:0;
  overflow:hidden;
  z-index:0;
  /* Hold each picture still while the next one dissolves into place. */
  transition:opacity 1.35s cubic-bezier(.2,.68,.2,1);
  transform:scale(1.012);
  will-change:opacity;
}

#p3 .architecture-hugong-restoration-shot.is-active{
  opacity:1;
  z-index:2;
  transform:scale(1.012);
  filter:none;
}

/* September 17, 2026 — hold the outgoing frame underneath Kodak Boy so the
   handoff is a continuous dissolve rather than a one-frame empty pop. */
#p3 .architecture-hugong-restoration-shot.is-outgoing{
  opacity:1;
  z-index:1;
  transform:scale(1.012);
  filter:none;
}

#p3 .architecture-hugong-restoration-shot img{
  max-width:none;
  object-fit:cover;
  object-position:50% 50%;
}

#p3 .architecture-hugong-restoration-shot:nth-child(2) img,
#p3 .architecture-hugong-restoration-shot:nth-child(3) img{
  object-position:50% 50%;
}

#p3 .architecture-hugong-restoration-shot:nth-child(4) img{
  object-position:0 50%;
  /* The artwork includes its own Kodak film edge; align it with the aperture. */
  transform:none;
}

#p3 .architecture-hugong-restoration-scrim{
  position:absolute;
  z-index:2;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(0,0,0,.03) 0 45%,rgba(0,0,0,.72) 100%),linear-gradient(90deg,rgba(0,0,0,.42),transparent 68%);
}

#p3 .architecture-hugong-restoration-copy{
  position:absolute;
  z-index:3;
  left:32px;
  right:32px;
  bottom:40px;
  max-width:72%;
  color:#fff;
  font:400 40px/1.16 'Archivo Black',sans-serif;
  letter-spacing:-.018em;
  text-align:left;
  text-wrap:balance;
  text-shadow:none;
  transition:opacity 1.15s cubic-bezier(.2,.68,.2,1),transform 1.15s cubic-bezier(.2,.68,.2,1);
}

#p3 .architecture-hugong-restoration-copy span{
  display:block;
}

#p3 .architecture-hugong-restoration-follow-copy{
  position:absolute;
  z-index:3;
  left:32px;
  right:32px;
  bottom:42px;
  max-width:100%;
  color:#fff;
  font:400 40px/1.30 'Archivo Black',sans-serif;
  letter-spacing:-.018em;
  text-align:left;
  text-wrap:balance;
  text-shadow:none;
  opacity:0;
  transform:translate3d(0,8px,0);
  transition:opacity 1.35s cubic-bezier(.2,.68,.2,1),transform 1.35s cubic-bezier(.2,.68,.2,1);
}

#p3 .architecture-hugong-restoration-frame.is-hugong-restoration-follow-in .architecture-hugong-restoration-follow-copy{
  opacity:1;
  transform:translate3d(0,0,0);
}

/* September 14, 2026 — keep the opening title from colliding with the lower Kodak question. */
#p3 .architecture-hugong-restoration-frame.is-hugong-restoration-follow-in .architecture-hugong-restoration-copy,
#p3 .architecture-hugong-restoration-frame.is-hugong-restoration-kodak .architecture-hugong-restoration-copy{
  display:none !important;
}

#p3 .architecture-hugong-restoration-follow-copy span{
  display:block;
  white-space:nowrap;
}

/* September 17, 2026 — let the Kodak Boy coda deliver the second title thought.
   The first thought arrives with the returning river; the future-facing phrase
   waits for the Kodak Boy frame instead of appearing as one lump of type. */
#p3 .architecture-hugong-restoration-follow-copy span:nth-child(2){
  opacity:0;
  transform:translate3d(0,8px,0);
  transition:opacity .72s cubic-bezier(.2,.72,.2,1),transform .72s cubic-bezier(.2,.72,.2,1);
}

#p3 .architecture-hugong-restoration-follow-copy span:first-child{
  opacity:1;
  transform:translate3d(0,0,0);
  transition:opacity .72s cubic-bezier(.2,.72,.2,1),transform .72s cubic-bezier(.2,.72,.2,1);
}

#p3 .architecture-hugong-restoration-frame.is-hugong-restoration-future-in .architecture-hugong-restoration-follow-copy span:nth-child(2){
  opacity:1;
  transform:translate3d(0,0,0);
}

#p3 .architecture-hugong-restoration-frame.is-hugong-restoration-kodak .architecture-hugong-restoration-follow-copy span:first-child,
#p3 .architecture-hugong-restoration-frame.is-hugong-restoration-future-in .architecture-hugong-restoration-follow-copy span:first-child{
  opacity:0;
  transform:translate3d(0,-8px,0);
}

#p3 .architecture-hugong-restoration-frame.is-hugong-restoration-copy-out .architecture-hugong-restoration-follow-copy{
  opacity:0;
  transform:translate3d(0,-5px,0);
}

/* September 22, 2026 — the Kodak future line uses the established title
   bottomline; preserve its existing 32px left edge and all copy timing. */
#p3 .architecture-hugong-restoration-frame.is-hugong-restoration-kodak .architecture-hugong-restoration-follow-copy{
  bottom:84px;
}

#p3 .architecture-hugong-restoration-frame.is-hugong-restoration-reel-playing:not(.is-hugong-restoration-follow-in) .architecture-hugong-restoration-copy{
  display:block !important;
  animation:hugongRestorationThoughtIn .9s cubic-bezier(.2,.72,.2,1) both;
}

#p3 .architecture-hugong-restoration-frame.is-hugong-restoration-copy-out .architecture-hugong-restoration-copy{
  opacity:0;
  transform:translate3d(0,-5px,0);
}

@keyframes hugongRestorationThoughtIn{
  from{opacity:0;transform:translate3d(0,8px,0);}
  to{opacity:1;transform:translate3d(0,0,0);}
}

@media (prefers-reduced-motion:reduce){
  #p3 .architecture-hugong-restoration-shot,
  #p3 .architecture-hugong-restoration-copy,
  #p3 .architecture-hugong-restoration-follow-copy{
    transition:none !important;
    animation:none !important;
  }
  #p3 .architecture-hugong-restoration-follow-copy span:nth-child(2){
    opacity:1;
    transform:none;
  }
  #p3 .architecture-hugong-restoration-follow-copy span:first-child{
    opacity:1;
    transform:none;
  }
  #p3 .architecture-hugong-restoration-frame.is-hugong-restoration-kodak .architecture-hugong-restoration-follow-copy span:first-child,
  #p3 .architecture-hugong-restoration-frame.is-hugong-restoration-future-in .architecture-hugong-restoration-follow-copy span:first-child{
    opacity:0;
  }
  #p3 .architecture-hugong-restoration-shot{transform:none;}
}

/* September 14, 2026 — use the supplied larger, left-biased blackout aperture. */
body #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-puzzle-images{
  display:none !important;
}

body #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-puzzle-blackout{
  display:none !important;
}

body #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-puzzle-supplied-mask{
  position:absolute;
  z-index:2;
  inset:-2% -2% -2% -4%;
  display:block;
  width:106%;
  height:104%;
  max-width:none;
  object-fit:cover;
  object-position:50% 50%;
  transform:translateX(3.5%) scale(1.01);
  transform-origin:52% 50%;
  filter:brightness(0);
  pointer-events:none;
}

/* September 14, 2026 — a quicker, quieter Hugong landing and wind handoff. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-hugong-phase .architecture-hugong-files-copy{
  right:12%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-both-missing-phase .architecture-hugong-files-copy{
  right:10%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-question-phase-both > span{
  display:block;
  font-size:clamp(29px,2.2vw,38px);
  line-height:1.18;
  letter-spacing:-.018em;
  white-space:nowrap;
}

body #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-question-phase-bamboo{
  display:block;
  max-width:100%;
  text-align:left;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-question-phase-hugong > strong{
  display:block;
  margin-bottom:7px;
  font-size:clamp(34px,2.35vw,42px);
  line-height:1.18;
  letter-spacing:.01em;
  animation:hugongWordEmphasis .85s cubic-bezier(.2,.72,.2,1) both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-question-phase-hugong > span{
  display:block;
  font-size:clamp(25px,1.92vw,33px);
  line-height:1.18;
  letter-spacing:-.018em;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-question-phase-hugong > small{
  display:block;
  max-width:100%;
  margin-top:13px !important;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:clamp(22px,1.42vw,27px) !important;
  font-weight:600;
  line-height:1.22;
  letter-spacing:0;
  white-space:pre-wrap;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-wind-phase .architecture-hugong-bamboo-wind-image{
  z-index:7;
  animation:hugongWindTakeover 2.4s cubic-bezier(.18,.72,.2,1) both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-wind-phase .architecture-hugong-time-lapse-lush,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-wind-phase .architecture-hugong-time-lapse-transition,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-wind-phase .architecture-hugong-time-lapse-present{
  animation:hugongRiverFadeToWind 2.4s ease both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-legacy-question-phase .architecture-hugong-files-copy{
  right:8%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-question-phase-now > strong{
  display:block;
  font-size:clamp(30px,2.2vw,38px);
  line-height:1.18;
  letter-spacing:-.018em;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-legacy-question-phase .architecture-hugong-bamboo-wind-image{
  z-index:7;
  animation:hugongWindPunchZoom 7.5s cubic-bezier(.18,.72,.2,1) both;
}

@keyframes hugongWindPunchZoom{
  0%{opacity:1;transform:scale(1.01);filter:contrast(1.05) brightness(.84) saturate(.88) blur(0);}
  100%{opacity:1;transform:scale(1.14);filter:contrast(1.08) brightness(.88) saturate(.94) blur(0);}
}

@keyframes hugongWordEmphasis{
  from{opacity:0;transform:translateY(8px) scale(.985);}
  to{opacity:1;transform:translateY(0) scale(1);}
}

@keyframes hugongWindTakeover{
  0%{opacity:0;transform:scale(1.035);filter:contrast(.96) brightness(.68) saturate(.72) blur(.7px);}
  48%{opacity:1;transform:scale(1.02);filter:contrast(1.02) brightness(.8) saturate(.82) blur(.12px);}
  100%{opacity:1;transform:scale(1.01);filter:contrast(1.05) brightness(.84) saturate(.88) blur(0);}
}

@keyframes hugongRiverFadeToWind{
  from{opacity:1;transform:scale(1.012);filter:brightness(.7) contrast(1.03) saturate(.76);}
  to{opacity:0;transform:scale(1.026);filter:brightness(.58) contrast(.98) saturate(.62) blur(.45px);}
}

/* September 14, 2026 — one continuous Scene 13 thought train. */
body:not(.verticale-edition) #p3 .architecture-hugong-black-bang[data-panel-id="architecture-hugong-wolf"]{
  overflow:hidden;
  isolation:isolate;
  background:#010201;
}

body:not(.verticale-edition) #p3 .architecture-hugong-black-bang[data-panel-id="architecture-hugong-wolf"] ~ .architecture-story-hud{
  display:none !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-question-wolf-image{
  z-index:1;
  opacity:1;
  animation:hugongQuestionWolfPush 10.2s cubic-bezier(.18,.72,.2,1) both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-files-stage{
  z-index:8;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-files-copy{
  z-index:8;
  transition:opacity 1.35s ease,transform 1.35s ease;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-puzzle-phase .architecture-hugong-files-copy{
  animation:hugongCombinedCopyOut .85s ease both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-sepia-release-phase .architecture-hugong-files-copy,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-both-missing-phase .architecture-hugong-files-copy,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-killed-wolves-phase .architecture-hugong-files-copy,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-river-evidence-phase .architecture-hugong-files-copy,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-name-phase .architecture-hugong-files-copy,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-hugong-phase .architecture-hugong-files-copy{
  opacity:1;
  transform:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-files-copy.is-hugong-combined-copy-entering{
  animation:hugongCombinedCopyIn 1.35s cubic-bezier(.2,.72,.2,1) both;
}

/* September 14, 2026 — let “Both” arrive first, then give the missing thought a breath. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-both-missing-phase .architecture-hugong-files-copy.is-hugong-combined-copy-entering{
  animation:hugongBothCopyIn 1.35s cubic-bezier(.2,.68,.2,1) both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-both-missing-phase .architecture-hugong-question-phase-both > strong,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-both-missing-phase .architecture-hugong-question-phase-both > span{
  opacity:0;
  transform:translateY(7px);
  animation:hugongBothPhraseIn 1.15s cubic-bezier(.2,.72,.2,1) both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-both-missing-phase .architecture-hugong-question-phase-both > strong{
  animation-delay:.12s;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-both-missing-phase .architecture-hugong-question-phase-both > span{
  animation-delay:.48s;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-files-origin > span{
  display:block;
  max-width:100%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-files-origin > span[hidden]{
  display:none !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] :is(
  .architecture-hugong-question-phase-both,
  .architecture-hugong-question-phase-name,
  .architecture-hugong-question-phase-hugong
) > strong{
  display:block;
  margin-bottom:7px;
  line-height:1.18;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] :is(
  .architecture-hugong-question-phase-name,
  .architecture-hugong-question-phase-hugong
) > small{
  display:block;
  margin-top:9px;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:22px;
  font-weight:600;
  line-height:1.22;
  letter-spacing:0;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-killed-wolves-image{
  position:absolute;
  z-index:5;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:contain;
  object-position:50% 50%;
  opacity:0;
  background:#010201;
  filter:sepia(.72) grayscale(.12) contrast(1.08) brightness(.72) saturate(.6);
  will-change:opacity,transform,filter;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-killed-wolves-phase .architecture-hugong-killed-wolves-image{
  animation:hugongKilledWolvesReveal 2.6s cubic-bezier(.2,.72,.2,1) both;
}

/* September 22, 2026 — the approved full-frame wolf montage fades over the hunters' record. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-killed-wolves-ghost-montage{
  position:absolute;
  z-index:6;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:center;
  opacity:0;
  transform:none;
  mix-blend-mode:normal;
  filter:sepia(.08) saturate(.82) contrast(1.04) brightness(.9);
  pointer-events:none;
  will-change:opacity,filter;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-killed-wolves-phase .architecture-hugong-killed-wolves-ghost-montage{
  animation:hugongGhostMontageReveal 1.25s ease both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-river-evidence-phase .architecture-hugong-killed-wolves-ghost-montage,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-new-bamboo-phase .architecture-hugong-killed-wolves-ghost-montage{
  animation:hugongGhostMontageRetire 1.15s ease both;
}

@keyframes hugongGhostMontageReveal{
  0%{opacity:0;filter:sepia(.08) saturate(.82) contrast(1.04) brightness(.78);}
  100%{opacity:.78;filter:sepia(.08) saturate(.82) contrast(1.04) brightness(.9);}
}

@keyframes hugongGhostMontageRetire{
  from{opacity:.78;filter:sepia(.08) saturate(.82) contrast(1.04) brightness(.9);}
  to{opacity:0;filter:sepia(.08) saturate(.82) contrast(1.04) brightness(.82);}
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-river-evidence-phase .architecture-hugong-killed-wolves-image{
  animation:hugongKilledWolvesRetire 2.4s ease both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-sepia-release-phase .architecture-hugong-puzzle-layer{
  animation:hugongCombinedPuzzleRelease 2.8s ease both !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-sepia-release-phase .architecture-hugong-question-wolf-image{
  animation:hugongQuestionWolfRetire 1.8s ease both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-sepia-release-phase .architecture-hugong-bamboo-image{
  animation:hugongSepiaFullReveal 3.2s cubic-bezier(.18,.68,.22,1) both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-river-evidence-phase .architecture-hugong-bamboo-river-image{
  animation:hugongBambooRiverReveal 2.8s cubic-bezier(.18,.72,.2,1) both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-new-bamboo-phase .architecture-hugong-killed-wolves-image{
  animation:hugongKilledWolvesRetire 1.8s ease both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-puzzle-phase :is(
  .architecture-hugong-question-focus,
  .architecture-hugong-question-eye-catch,
  .architecture-hugong-question-muzzle-glint,
  .architecture-hugong-question-water-glint
){
  opacity:0 !important;
  animation:none !important;
}

@keyframes hugongCombinedCopyOut{
  from{opacity:1;transform:translateY(0);}
  to{opacity:0;transform:translateY(-10px);}
}

@keyframes hugongCombinedCopyIn{
  from{opacity:0;transform:translateY(13px);}
  to{opacity:1;transform:translateY(0);}
}

@keyframes hugongBothCopyIn{
  from{opacity:0;transform:translateY(10px);}
  to{opacity:1;transform:translateY(0);}
}

@keyframes hugongBothPhraseIn{
  from{opacity:0;transform:translateY(7px);}
  to{opacity:1;transform:translateY(0);}
}

@media (prefers-reduced-motion:reduce){
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-both-missing-phase .architecture-hugong-files-copy.is-hugong-combined-copy-entering,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-both-missing-phase .architecture-hugong-question-phase-both > strong,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-both-missing-phase .architecture-hugong-question-phase-both > span{
    animation:none !important;
    opacity:1 !important;
    transform:none !important;
  }
}

@keyframes hugongCombinedPuzzleRelease{
  from{opacity:1;}
  to{opacity:0;}
}

@keyframes hugongQuestionWolfRetire{
  from{opacity:1;filter:brightness(.78) contrast(1.06) saturate(.82);}
  to{opacity:0;filter:brightness(.58) contrast(.94) saturate(.68) blur(.5px);}
}

@keyframes hugongSepiaFullReveal{
  0%{opacity:0;transform:scale(1.04);filter:sepia(.78) grayscale(.14) contrast(.96) brightness(.62) saturate(.42) blur(.8px);}
  52%{opacity:1;transform:scale(1.02);filter:sepia(.68) grayscale(.1) contrast(1.04) brightness(.78) saturate(.52) blur(.16px);}
  100%{opacity:1;transform:scale(1.01);filter:sepia(.62) grayscale(.08) contrast(1.07) brightness(.84) saturate(.58) blur(0);}
}

@keyframes hugongSepiaReturnReveal{
  0%{opacity:0;transform:scale(1.035);filter:sepia(.8) grayscale(.16) contrast(.94) brightness(.6) saturate(.38) blur(1.1px);}
  52%{opacity:.62;transform:scale(1.02);filter:sepia(.7) grayscale(.11) contrast(1.02) brightness(.76) saturate(.5) blur(.22px);}
  100%{opacity:1;transform:scale(1.01);filter:sepia(.62) grayscale(.08) contrast(1.07) brightness(.84) saturate(.58) blur(0);}
}

@keyframes hugongKilledWolvesReveal{
  0%{opacity:0;transform:scale(1.025);filter:sepia(.8) grayscale(.18) contrast(.96) brightness(.5) saturate(.4) blur(1px);}
  52%{opacity:1;transform:scale(1.01);filter:sepia(.74) grayscale(.13) contrast(1.06) brightness(.68) saturate(.56) blur(.12px);}
  100%{opacity:1;transform:scale(1);filter:sepia(.72) grayscale(.12) contrast(1.08) brightness(.72) saturate(.6) blur(0);}
}

@keyframes hugongKilledWolvesRetire{
  from{opacity:1;transform:scale(1);filter:sepia(.72) grayscale(.12) contrast(1.08) brightness(.72) saturate(.6);}
  to{opacity:0;transform:scale(1.025);filter:sepia(.58) grayscale(.2) contrast(.94) brightness(.5) saturate(.4) blur(.6px);}
}

@media (prefers-reduced-motion:reduce){
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-question-wolf-image,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-killed-wolves-image,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-bamboo-image,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-puzzle-layer,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-bamboo-river-image{
    animation:none !important;
  }
}

/* HUGONG PUZZLE APERTURE PASS — the supplied piece is a hole through the black field. */

body #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-puzzle-layer{
  position:absolute;
  z-index:7;
  inset:0;
  display:block;
  overflow:hidden;
  pointer-events:none;
  opacity:0;
  background:transparent;
  isolation:isolate;
  will-change:opacity;
}

body #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-puzzle-blackout{
  position:absolute;
  z-index:1;
  inset:0;
  display:block;
  background:#010201;
}

body #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-puzzle-images{
  position:absolute;
  z-index:2;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  pointer-events:none;
  overflow:visible;
}

body #p3 [data-panel-id="architecture-hugong-wolf"] :is(
  .architecture-hugong-puzzle-wolf-image,
  .architecture-hugong-puzzle-bamboo-image
){
  display:block;
  pointer-events:none;
  will-change:opacity,filter;
}

body #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-puzzle-wolf-image{
  opacity:1;
  filter:blur(.08px) brightness(.98) contrast(1.08) saturate(.92);
}

body #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-puzzle-bamboo-image{
  opacity:0;
  filter:sepia(.84) grayscale(.08) contrast(1.06) brightness(.84) saturate(.56);
}

body #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-bamboo-river-image{
  position:absolute;
  z-index:4;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:50% 50%;
  opacity:0;
  transform:scale(1.025);
  transform-origin:50% 50%;
  filter:brightness(.72) contrast(1.02) saturate(.72) blur(.6px);
  will-change:opacity,transform,filter;
}

body #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-puzzle-phase .architecture-hugong-puzzle-layer{
  animation:hugongPuzzleArrive 2.6s cubic-bezier(.18,.72,.2,1) both;
}

body #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-puzzle-phase .architecture-hugong-puzzle-wolf-image{
  animation:hugongPuzzleWolfSettle 2.6s cubic-bezier(.18,.72,.2,1) both;
}

body #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-puzzle-bamboo-phase .architecture-hugong-puzzle-wolf-image{
  animation:hugongPuzzleWolfFade 1.8s ease both;
}

body #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-puzzle-bamboo-phase .architecture-hugong-puzzle-bamboo-image{
  animation:hugongPuzzleBambooReveal 2.4s cubic-bezier(.2,.72,.2,1) both;
}

body #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-bamboo-river-phase .architecture-hugong-puzzle-layer{
  animation:hugongPuzzleRelease 2.8s ease both;
}

body #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-bamboo-river-phase .architecture-hugong-wolf-image{
  animation:hugongPuzzleWolfRetire 2.8s ease both !important;
}

body #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-bamboo-river-phase .architecture-hugong-bamboo-river-image{
  animation:hugongBambooRiverReveal 2.8s cubic-bezier(.18,.72,.2,1) both;
}

body #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-new-bamboo-phase .architecture-hugong-bamboo-river-image{
  animation:hugongBambooRiverRetire 2.4s ease both;
}

@keyframes hugongPuzzleArrive{
  0%{opacity:0;}
  100%{opacity:1;}
}

@keyframes hugongPuzzleWolfSettle{
  0%{opacity:0;filter:blur(1px) brightness(.74) contrast(1.02) saturate(.78);}
  42%{opacity:1;filter:blur(.28px) brightness(.9) contrast(1.06) saturate(.88);}
  100%{opacity:1;filter:blur(.08px) brightness(.98) contrast(1.08) saturate(.92);}
}

@keyframes hugongPuzzleWolfFade{
  0%{opacity:1;}
  100%{opacity:0;}
}

@keyframes hugongPuzzleBambooReveal{
  0%{opacity:0;filter:sepia(.96) grayscale(.16) contrast(.96) brightness(.64) saturate(.38) blur(.8px);}
  56%{opacity:1;filter:sepia(.88) grayscale(.1) contrast(1.04) brightness(.8) saturate(.5) blur(.18px);}
  100%{opacity:1;filter:sepia(.84) grayscale(.08) contrast(1.06) brightness(.84) saturate(.56) blur(0);}
}

@keyframes hugongPuzzleRelease{
  0%{opacity:1;}
  100%{opacity:0;}
}

@keyframes hugongPuzzleWolfRetire{
  0%{opacity:1;}
  100%{opacity:0;}
}

@keyframes hugongBambooRiverReveal{
  0%{opacity:0;transform:scale(1.04);filter:brightness(.58) contrast(.96) saturate(.5) blur(1px);}
  48%{opacity:1;transform:scale(1.03);filter:brightness(.72) contrast(1) saturate(.7) blur(.22px);}
  100%{opacity:1;transform:scale(1.025);filter:brightness(.78) contrast(1.03) saturate(.78) blur(0);}
}

@keyframes hugongBambooRiverRetire{
  0%{opacity:1;transform:scale(1.025);filter:brightness(.78) contrast(1.03) saturate(.78) blur(0);}
  100%{opacity:0;transform:scale(1.045);filter:brightness(.62) contrast(.98) saturate(.6) blur(.7px);}
}

@media (prefers-reduced-motion:reduce){
  body #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-puzzle-layer,
  body #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-puzzle-wolf-image,
  body #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-puzzle-bamboo-image,
  body #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-bamboo-river-image{
    animation:none !important;
  }
}

@keyframes hugongWolfOpeningHold{
  0%{opacity:0;transform:translate3d(3%,0,0) scale(1.02);filter:blur(1px) brightness(.8) contrast(.92) saturate(.84);}
  18%{opacity:1;transform:translate3d(3%,0,0) scale(1.04);filter:blur(.25px) brightness(.95) contrast(1.02) saturate(.94);}
  100%{opacity:1;transform:translate3d(6%,-3%,0) scale(1.3);filter:blur(0) brightness(.99) contrast(1.05) saturate(1);}
}

@keyframes hugongRecordsFade{
  0%{opacity:1;transform:scale(1);}
  100%{opacity:0;transform:scale(1.025);filter:sepia(.12) brightness(.78) blur(.35px);}
}

/* SCENE CONTAINMENT LOCK
   Panel-specific title, support, scrim, and arrival overrides must be scoped
   to the active panel with :not(.is-hidden). The shared Architecture HUD is
   never to inherit a later scene's treatment while that scene is parked. */

@media (min-width:901px){
  body:not(.verticale-edition) #p3 .golden-box > [data-panel-id="architecture-mining-v18"].is-growth-reel-playing:not(.is-hidden) ~ .architecture-story-hud.is-entering{
    opacity:0;
    transform:none;
    filter:none;
    animation:archiGrowthFinalTitle .9s cubic-bezier(.18,.74,.2,1) 21.25s both !important;
  }
}

#p3 [data-panel-id="architecture-mining-v18"] .architecture-callout-stage{
  position:absolute;
  z-index:0;
  inset:0;
  transform:translateY(-1%) scale(1.2);
  transform-origin:50% 0;
}

#p3 [data-panel-id="architecture-mining-v18"] .architecture-callout-stage .architecture-callout-base-image{
  filter:none;
  transform:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"] .architecture-callout{
  position:absolute;
  z-index:1;
  display:block;
  margin:0;
  color:#fff;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:21pt;
  font-weight:500;
  line-height:1.22;
  letter-spacing:.005em;
  text-align:left;
  text-transform:uppercase;
  text-shadow:none !important;
  opacity:0;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"] .architecture-callout::before{
  content:"";
  position:absolute;
  top:.28em;
  left:-17px;
  width:10px;
  height:10px;
  box-sizing:border-box;
  border:2px solid #55c900;
  border-radius:50%;
  background:#fff;
}

body:not(.verticale-edition) #p3 .architecture-callout-lev{
  top:calc(50.5% - 10px);
  left:38.5%;
  font-size:clamp(12.65px,1.21vw,20.7px) !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"] .architecture-callout-lev::before{
  top:5px;
}

body:not(.verticale-edition) #p3 .architecture-callout-water{
  top:9%;
  left:31%;
}

body:not(.verticale-edition) #p3 .architecture-callout-factories{
  top:30.7%;
  left:19.3%;
}

body:not(.verticale-edition) #p3 .architecture-callout-cultural{
  top:10.3%;
  left:57%;
}

body:not(.verticale-edition) #p3 .architecture-callout-community{
  top:calc(36.4% - 17px);
  left:calc(60.8% + 20px);
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"] .architecture-community-motion-stage{
  position:absolute;
  z-index:0;
  inset:0;
  overflow:visible;
  isolation:isolate;
  transform:translateY(50px) scale(1.2);
  transform-origin:50% 50%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"] .architecture-mining-fullbleed-image{
  z-index:0;
  filter:contrast(1.08);
  transform:none;
  transform-origin:50% 50%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"]:not(.is-hidden) .architecture-community-motion-stage{
  animation:archiCommunityGentlePush 5.2s cubic-bezier(.3,0,.16,1) both;
}

body:not(.verticale-edition) #p3 .architecture-community-loop-map{
  position:absolute;
  z-index:10;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  overflow:visible;
  pointer-events:none;
}

body:not(.verticale-edition) #p3 .architecture-community-loop-line{
  fill:none;
  stroke:#58a807;
  stroke-width:3.4;
  stroke-dasharray:1 1;
  stroke-dashoffset:0;
  vector-effect:non-scaling-stroke;
  opacity:0;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.72));
  animation-delay:1.8s;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"]:not(.is-hidden) .architecture-community-loop-line-a{
  animation:archiCommunityLoopA 12s ease-in-out infinite;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"]:not(.is-hidden) .architecture-community-loop-line-b{
  animation:archiCommunityLoopB 12s ease-in-out infinite;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"]:not(.is-hidden) .architecture-community-loop-line-c{
  animation:archiCommunityLoopC 12s ease-in-out infinite;
}

body:not(.verticale-edition) #p3 .architecture-community-loop-blip{
  color:#91e83a;
  opacity:0;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.82));
  animation-delay:1.8s;
}

body:not(.verticale-edition) #p3 .architecture-community-loop-blip circle{
  fill:#a3f357;
}

body:not(.verticale-edition) #p3 .architecture-community-loop-blip-c circle{
  fill:currentColor;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"] .architecture-community-loop-blip circle{
  fill:#fff;
  stroke:#55c900;
  stroke-width:4;
  vector-effect:non-scaling-stroke;
}

body:not(.verticale-edition) #p3 .architecture-community-loop-blip-tail{
  fill:currentColor;
  opacity:.94;
}

body:not(.verticale-edition) #p3 .architecture-community-junction-oval{
  fill:rgba(72,143,10,.30);
  stroke:#86df2f;
  stroke-width:4.2;
  stroke-linejoin:round;
  vector-effect:non-scaling-stroke;
  opacity:0;
  filter:drop-shadow(0 2px 2px rgba(0,0,0,.82));
}

body:not(.verticale-edition) #p3 .architecture-community-junction-oval rect{
  fill:rgba(104,185,25,.38);
  stroke-width:2.4;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"]:not(.is-hidden) .architecture-community-loop-blip-a{
  animation:archiCommunityBlipA 12s linear infinite;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"]:not(.is-hidden) .architecture-community-loop-blip-b{
  animation:archiCommunityBlipB 12s linear infinite;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"]:not(.is-hidden) .architecture-community-loop-blip-c{
  animation:archiCommunityBlipC 12s linear infinite;
}

@keyframes archiCommunityGentlePush{
  0%{transform:translateY(50px) scale(1.2);}
  10%{transform:translateY(50px) scale(1.2);}
  38%{transform:translateY(47px) scale(1.225);}
  100%{transform:translateY(38px) scale(1.34);}
}

@keyframes archiCommunityLoopA{
  0%,2.5%,24%,100%{opacity:0;}
  3.5%,21.5%{opacity:.88;}
}

@keyframes archiCommunityLoopB{
  0%,21%,43%,100%{opacity:0;}
  21.5%,40.5%{opacity:.88;}
}

@keyframes archiCommunityLoopC{
  0%,40%,68.5%,100%{opacity:0;}
  40.5%,66.5%{opacity:.88;}
}

@keyframes archiCommunityBlipA{
  0%,2.5%,24%,100%{opacity:0;}
  3.5%,21.5%{opacity:1;}
  23%{opacity:.34;}
}

@keyframes archiCommunityBlipB{
  0%,21%,43%,100%{opacity:0;}
  21.5%,40.5%{opacity:1;}
  42%{opacity:.34;}
}

@keyframes archiCommunityBlipC{
  0%,40%,68.5%,100%{opacity:0;}
  40.5%,66.5%{opacity:1;}
  68%{opacity:.34;}
}

@media(prefers-reduced-motion:reduce){
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"]:not(.is-hidden) .architecture-community-motion-stage{
    animation:none;
    transform:translateY(43px) scale(1.275);
  }
  body:not(.verticale-edition) #p3 .architecture-community-loop-line,
  body:not(.verticale-edition) #p3 .architecture-community-loop-blip{
    animation:none;
    opacity:0;
  }
}

/* View 13 onward: let the imagery keep its own light. No blanket veils. */
body:not(.verticale-edition) #p3 .architecture-no-veil::after{
  background:none !important;
}

/* View 13: the established Horizontale lower-left editorial lockup. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-rings-overhead"]:not(.is-hidden) ~ .architecture-story-hud{
  left:28px;
  right:28px;
  bottom:29px;
  width:auto;
  max-width:none;
  align-items:flex-start;
  text-align:left;
  transform:none;
  gap:6px;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-rings-overhead"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-rings-overhead"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-rings-overhead"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  width:auto;
  margin-left:0;
  margin-right:0;
  text-align:left;
  text-align-last:left;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-rings-overhead"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker{
  margin-bottom:-6px;
  font-size:18pt;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-rings-overhead"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  max-width:none;
  font-size:30pt;
  line-height:1;
  white-space:nowrap;
  text-wrap:nowrap;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-rings-overhead"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  max-width:none;
  margin-top:0;
  font-size:16pt;
  line-height:1.15;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker{
  max-width:none;
  font-size:18pt;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  position:relative;
  top:3px;
  max-width:none;
  font-size:25pt;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  font-size:16pt;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v7"] .architecture-mining-fullbleed-image{
  transform:scale(1.15);
  transform-origin:0 100%;
}

body:not(.verticale-edition) #p3 .architecture-v7-junction-map{
  position:absolute;
  z-index:3;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  overflow:visible;
  pointer-events:none;
  transform:scale(1.15);
  transform-origin:0 100%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v7"]:not(.is-hidden) ~ .architecture-story-hud{
  z-index:4;
}

body:not(.verticale-edition) #p3 .architecture-v7-ring-line{
  fill:none;
  stroke:#58a807;
  stroke-width:2.7;
  vector-effect:non-scaling-stroke;
  opacity:0;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.72));
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v7"]:not(.is-hidden) .architecture-v7-ring-line{
  animation:archiV7RingLine 8s ease-in-out .3s infinite;
}

body:not(.verticale-edition) #p3 .architecture-v7-ring-blip{
  color:#91e83a;
  opacity:0;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.82));
}

body:not(.verticale-edition) #p3 .architecture-v7-ring-blip circle{
  fill:#fff;
  stroke:#55c900;
  stroke-width:4;
  vector-effect:non-scaling-stroke;
}

body:not(.verticale-edition) #p3 .architecture-v7-junction-tail{
  fill:currentColor;
  opacity:.94;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v7"]:not(.is-hidden) .architecture-v7-ring-blip{
  animation:archiV7RingBlip 8s linear .3s infinite;
}

body:not(.verticale-edition) #p3 .architecture-v7-surge-line{
  fill:none;
  stroke:#91e83a;
  stroke-width:4.2;
  stroke-linecap:round;
  vector-effect:non-scaling-stroke;
  stroke-dasharray:1;
  stroke-dashoffset:1;
  opacity:0;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.76));
}

body:not(.verticale-edition) #p3 .architecture-v7-surge-line-left{
  stroke:url(#architecture-v7-surge-fan-fade);
}

body:not(.verticale-edition) #p3 .architecture-v7-surge-line-right{
  stroke:url(#architecture-v7-surge-fan-fade);
}

body:not(.verticale-edition) #p3 .architecture-v7-surge-line-inner{
  stroke-width:3.2;
  stroke-opacity:.78;
}

body:not(.verticale-edition) #p3 .architecture-v7-surge-line-center{
  stroke-width:4.2;
  stroke-opacity:1;
}

body:not(.verticale-edition) #p3 .architecture-v7-surge-line-outer{
  stroke-width:3;
  stroke-opacity:.66;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v7"]:not(.is-hidden) .architecture-v7-surge-line{
  animation:archiV7Surge 8s cubic-bezier(.2,.72,.18,1) .3s infinite;
}

body:not(.verticale-edition) #p3 .architecture-v7-return-line{
  fill:none;
  stroke:#f1ffe8;
  stroke-width:3.6;
  stroke-linecap:round;
  vector-effect:non-scaling-stroke;
  stroke-dasharray:.16 .84;
  stroke-dashoffset:0;
  opacity:0;
  filter:drop-shadow(0 0 3px rgba(105,190,18,.96));
}

body:not(.verticale-edition) #p3 .architecture-v7-return-line-inner{stroke-width:3;}
body:not(.verticale-edition) #p3 .architecture-v7-return-line-center{stroke-width:4.2;}
body:not(.verticale-edition) #p3 .architecture-v7-return-line-outer{stroke-width:2.8;}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v7"]:not(.is-hidden) .architecture-v7-return-line{
  animation:archiV7ReturnSweep 8s linear .3s infinite;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v7"]:not(.is-hidden) .architecture-v7-return-line-late{
  animation-delay:.38s;
}

body:not(.verticale-edition) #p3 .architecture-v7-contact-pulse{
  fill:none;
  stroke:#a7f45d;
  stroke-width:3.2;
  vector-effect:non-scaling-stroke;
  opacity:0;
  transform-box:fill-box;
  transform-origin:center;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v7"]:not(.is-hidden) .architecture-v7-contact-pulse{
  animation:archiV7ContactPulse 8s ease-out .3s infinite;
}

body:not(.verticale-edition) #p3 .architecture-v7-junction-oval{
  fill:rgba(72,143,10,.30);
  stroke:#86df2f;
  stroke-width:4.2;
  stroke-linejoin:round;
  vector-effect:non-scaling-stroke;
  opacity:0;
  filter:drop-shadow(0 2px 2px rgba(0,0,0,.82));
  transform-box:fill-box;
  transform-origin:center;
}

body:not(.verticale-edition) #p3 .architecture-v7-junction-oval rect{
  fill:rgba(104,185,25,.38);
  stroke-width:2.4;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v7"]:not(.is-hidden) .architecture-v7-junction-oval-community{
  animation:archiV7CommunityOval 8s ease-out .3s infinite;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v7"]:not(.is-hidden) .architecture-v7-junction-oval-port{
  animation:archiV7PortOval 8s ease-in-out .3s infinite;
}

@keyframes archiV7RingLine{
  0%,2%,88%,100%{opacity:0;}
  5%,84%{opacity:.58;}
  86%{opacity:.22;}
}

@keyframes archiV7RingBlip{
  0%,2%,86%,100%{opacity:0;}
  4%,82%{opacity:1;}
  84%{opacity:.38;}
}

@keyframes archiV7Surge{
  0%,36%{opacity:0;stroke-dashoffset:1;}
  38%{opacity:1;stroke-dashoffset:1;}
  46%{opacity:.96;stroke-dashoffset:0;}
  52%{opacity:.72;stroke-dashoffset:0;}
  55%{opacity:.96;stroke-dashoffset:0;}
  64%{opacity:.82;stroke-dashoffset:1;}
  70%{opacity:.18;stroke-dashoffset:1;}
  74%,100%{opacity:0;stroke-dashoffset:1;}
}

@keyframes archiV7ReturnSweep{
  0%,54%{opacity:0;stroke-dashoffset:0;}
  56%{opacity:.96;stroke-dashoffset:0;}
  70%{opacity:.9;stroke-dashoffset:-.84;}
  74%{opacity:0;stroke-dashoffset:-1;}
  100%{opacity:0;stroke-dashoffset:-1;}
}

@keyframes archiV7ContactPulse{
  0%,35%{opacity:0;transform:scale(.25);}
  38%{opacity:.78;transform:scale(.5);}
  47%{opacity:.48;transform:scale(1.15);}
  52%{opacity:0;transform:scale(1.4);}
  56%{opacity:.62;transform:scale(.55);}
  65%{opacity:.34;transform:scale(1.12);}
  72%,100%{opacity:0;transform:scale(1.38);}
}

@keyframes archiV7CommunityOval{
  0%,34%{opacity:0;transform:scale(.72);}
  38%{opacity:1;transform:scale(1.04);}
  46%{opacity:.9;transform:scale(1);}
  55%{opacity:.72;transform:scale(1);}
  62%,100%{opacity:0;transform:scale(.96);}
}

@keyframes archiV7PortOval{
  0%,3%{opacity:.84;transform:scale(1);}
  7%{opacity:1;transform:scale(1.04);}
  14%{opacity:.36;transform:scale(.98);}
  20%,72%{opacity:0;transform:scale(.82);}
  78%{opacity:.42;transform:scale(.9);}
  82%{opacity:1;transform:scale(1.04);}
  94%{opacity:.82;transform:scale(1);}
  100%{opacity:.84;transform:scale(1);}
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v7"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker{
  position:relative;
  top:1px;
  --archi-fluor-lift:#98e83e;
  --archi-fluor-crest:#c0f86d;
  font-size:18pt;
  background-size:210% 100%;
  animation:archiLetterFluoresce 6.4s ease-in-out infinite;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v7"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v7"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  max-width:none;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v7"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  font-size:28pt;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v7"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  font-size:15.75pt;
}

/* Final Horizontale house lockup. Sentence length may change the point size,
   but every standard three-line slide shares one anchor and one rhythm:
   green sits into the title; the IBM line breathes below it. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v16"]:not(.is-hidden) ~ .architecture-story-hud,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"]:not(.is-hidden) ~ .architecture-story-hud,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v7"]:not(.is-hidden) ~ .architecture-story-hud,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud{
  bottom:29px;
  gap:6px;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v16"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v7"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker{
  margin-bottom:-6px;
  transform:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v16"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v7"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  line-height:1;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v16"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v7"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  margin-top:0;
  line-height:1.15;
}

/* View 06: twin harbour systems converge at the central crossing, then a
   closer pulse carries the idea inland. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden){
  transform-origin:50% 52%;
  will-change:transform;
  animation:archiV10GentlePush 10s cubic-bezier(.45,0,.55,1) .2s infinite alternate;
}

body:not(.verticale-edition) #p3 .architecture-mining-v10-slide{
  overflow:hidden;
}

body:not(.verticale-edition) #p3 .architecture-v10-image,
body:not(.verticale-edition) #p3 .architecture-v10-route-map{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
}

body:not(.verticale-edition) #p3 .architecture-v10-image{
  z-index:0;
  max-width:none;
  object-fit:cover;
  object-position:50% 50%;
}

body:not(.verticale-edition) #p3 .architecture-v10-route-map{
  z-index:2;
  overflow:visible;
  pointer-events:none;
  transform:translateX(5px);
}

body:not(.verticale-edition) #p3 .architecture-v10-route-line{
  fill:none;
  stroke:#64b515;
  stroke-width:2.8;
  stroke-linecap:round;
  vector-effect:non-scaling-stroke;
  opacity:0;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.78));
}

body:not(.verticale-edition) #p3 .architecture-v10-route-line-inland{
  stroke:#78cf24;
}

body:not(.verticale-edition) #p3 .architecture-v10-start-oval{
  color:#69be12;
  opacity:0;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.82));
}

body:not(.verticale-edition) #p3 .architecture-v10-start-oval path{
  fill:rgba(45,104,6,.34);
  stroke:currentColor;
  stroke-width:3;
  vector-effect:non-scaling-stroke;
}

body:not(.verticale-edition) #p3 .architecture-v10-start-oval rect{
  fill:rgba(0,0,0,.26);
  stroke:currentColor;
  stroke-width:2;
  vector-effect:non-scaling-stroke;
}

body:not(.verticale-edition) #p3 .architecture-v10-start-oval circle{
  fill:#fff;
  stroke:currentColor;
  stroke-width:3;
  vector-effect:non-scaling-stroke;
}

body:not(.verticale-edition) #p3 .architecture-v10-route-blip{
  color:#87dc31;
  opacity:0;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.82));
}

body:not(.verticale-edition) #p3 .architecture-v10-route-blip circle{
  fill:#fff;
  stroke:#55c900;
  stroke-width:4;
  vector-effect:non-scaling-stroke;
}

body:not(.verticale-edition) #p3 .architecture-v10-route-blip-inland{
  color:#75c72b;
}

body:not(.verticale-edition) #p3 .architecture-v10-route-tail{
  fill:currentColor;
  opacity:.92;
}

body:not(.verticale-edition) #p3 .architecture-v10-merge-pulse{
  fill:none;
  stroke:#a7f45d;
  stroke-width:3;
  vector-effect:non-scaling-stroke;
  opacity:0;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.82));
}

/* View 07: the evidence receives its own impact board, allowing View 06 to
   conclude the living-systems idea without carrying the presentation record. */
body:not(.verticale-edition) #p3 .architecture-mining-record-board{
  overflow:hidden;
  isolation:isolate;
  background:#010201;
}

body:not(.verticale-edition) #p3 .architecture-mining-record-board::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  background:
    radial-gradient(ellipse at 48% 47%,rgba(105,190,18,.075),transparent 50%),
    linear-gradient(180deg,rgba(105,190,18,.025),transparent 34% 70%,rgba(105,190,18,.02));
  pointer-events:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-record"]:not(.is-hidden) ~ .architecture-story-hud{
  display:none;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credits-eyebrow.architecture-mining-record-menu{
  width:68%;
  font-size:16px;
  justify-content:flex-start;
  text-align:left;
}

body:not(.verticale-edition) #p3 .architecture-mining-record-menu-rule{
  background:linear-gradient(90deg,transparent,rgba(105,190,18,.7) 5% 8%,transparent 8% 76%,rgba(105,190,18,.7) 76% 95%,transparent);
}

body:not(.verticale-edition) #p3 .architecture-mining-record-copy{
  position:absolute;
  top:50%;
  left:50%;
  right:auto;
  width:max-content;
  max-width:calc(100% - 64px);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:0;
  text-align:left;
  opacity:0;
  transform:translate(-50%,-50%);
}

body:not(.verticale-edition) #p3 .architecture-mining-record-lockup{
  position:absolute;
  left:32px;
  right:32px;
  bottom:55px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  text-align:left;
  opacity:0;
  transform:translateY(24px);
}

body:not(.verticale-edition) #p3 .architecture-mining-record-label{
  display:block;
  margin:0 0 14px;
  color:#fff;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:17px;
  font-weight:700;
  line-height:1;
  letter-spacing:.18em;
  text-transform:uppercase;
}

body:not(.verticale-edition) #p3 .architecture-mining-record-kicker{
  color:#fff;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:19px;
  font-weight:700;
  line-height:1;
  letter-spacing:.18em;
  text-transform:uppercase;
  margin:10px 0 0;
}

body:not(.verticale-edition) #p3 .architecture-mining-record-title{
  display:block;
  color:#fff;
  font-family:'Archivo Black',sans-serif;
  font-size:40px;
  font-weight:400;
  line-height:1.06;
  letter-spacing:-.018em;
  text-align:left;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 .architecture-mining-record-credit{
  display:grid;
  grid-template-columns:max-content max-content;
  column-gap:16px;
  margin-top:0;
  color:#fff;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:clamp(19px,1.55vw,24px);
  font-weight:400;
  line-height:1.34;
  letter-spacing:.035em;
  text-transform:uppercase;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 .architecture-mining-record-credit-line{
  display:block;
}

body:not(.verticale-edition) #p3 .architecture-mining-record-credit-line:not(.architecture-mining-record-credit-label){
  grid-column:2;
}

body:not(.verticale-edition) #p3 .architecture-mining-record-credit-label{
  grid-column:1;
  grid-row:1;
  margin:0;
  color:var(--green);
  font-weight:700;
  letter-spacing:.1em;
}

body:not(.verticale-edition) #p3 .architecture-mining-record-credit-via{
  margin-top:10px;
  color:var(--green);
  font-family:'IBM Plex Sans',sans-serif;
  font-weight:700;
}

body:not(.verticale-edition) #p3 .architecture-mining-record-board:not(.is-hidden) .architecture-mining-record-menu-rule{
  animation:sipalayCreditsRule 1.3s cubic-bezier(.2,.72,.2,1) .18s both;
}

body:not(.verticale-edition) #p3 .architecture-mining-record-board:not(.is-hidden) .architecture-mining-record-copy{
  animation:architectureRecordCopyIn .85s cubic-bezier(.2,.72,.2,1) .25s both;
}

body:not(.verticale-edition) #p3 .architecture-mining-record-board:not(.is-hidden) .architecture-mining-record-lockup{
  animation:hugongFilesCopyIn .85s cubic-bezier(.2,.72,.2,1) .38s both;
}

@keyframes architectureRecordCopyIn{
  from{opacity:0;transform:translate(-50%,calc(-50% + 24px));}
  to{opacity:1;transform:translate(-50%,-50%);}
}

@keyframes archiV10GentlePush{
  0%{transform:translate3d(0,0,0) scale(1);}
  100%{transform:translate3d(.15%,-.12%,0) scale(1.08);}
}

@media (prefers-reduced-motion:reduce){
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden){
    animation:none;
  }
  body:not(.verticale-edition) #p3 .architecture-v10-route-map{
    display:none;
  }
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-prologue"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker{
  display:none;
}

/* View 07: let the original lake photograph breathe. The former image
   dimming and full-frame veils made the landscape much darker than source. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-prologue"] img{
  filter:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-prologue"]::after{
  background:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-prologue"]:not(.is-hidden) ~ .architecture-story-hud{
  bottom:29px;
  width:auto;
  max-width:min(88%,900px);
  gap:6px;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-prologue"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  max-width:none;
  font-size:26pt;
  line-height:1;
  white-space:nowrap;
  text-wrap:nowrap;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-prologue"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  position:relative;
  top:6px;
  max-width:none;
  font-size:21.75pt;
  line-height:1.15;
  white-space:nowrap;
  transform:none;
  text-transform:none;
}

/* View 08: the lake becomes a measured resource. The crop removes the people
   and lets the water occupy the frame; the green survey graphics stay quiet
   and architectural rather than becoming an infographic. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-origin"]{
  overflow:hidden;
  background:#071015;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-origin"] .architecture-sipalay-measured-image{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:50% 62%;
  transform:translate3d(12.24%,0,0) scale(1.44);
  transform-origin:50% 62%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-origin"]:not(.is-hidden) .architecture-sipalay-measured-image{
  animation:archiSipalayLakePush 5.2s cubic-bezier(.22,.61,.36,1) .05s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-origin"]:not(.is-hidden) ~ .architecture-story-hud{
  bottom:29px;
  gap:6px;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-origin"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker{
  margin-bottom:-6px;
  font-size:16pt;
  transform:none;
  white-space:nowrap;
  text-wrap:nowrap;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-origin"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  position:relative;
  top:3px;
  max-width:none;
  font-size:28pt;
  line-height:1;
  white-space:nowrap;
  text-wrap:nowrap;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-origin"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  position:relative;
  top:3px;
  max-width:none;
  margin-top:0;
  font-size:20pt;
  font-weight:700;
  line-height:1.15;
  white-space:nowrap;
  text-transform:uppercase;
}

/* View 09: an editorial stop. Real floating solar is held as evidence on a
   black field; the reading arrives in four short beats before the concept
   imagery begins. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"]{
  overflow:hidden;
  background:#010201;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-editorial-menu-stage{
  position:absolute;
  z-index:5;
  inset:0;
  pointer-events:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-sipalay-credits-eyebrow.architecture-editorial-menu{
  top:4.5%;
  left:8%;
  width:84%;
  min-height:46px;
  padding:4px 24px;
  align-items:center;
  justify-content:flex-start;
  border-radius:30px / 13px;
  font-size:18px;
  text-align:left;
  opacity:1;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-sipalay-credits-rule.architecture-editorial-menu-rule{
  display:block;
  top:8.8%;
  background:linear-gradient(90deg,transparent,rgba(105,190,18,.7) 5% 8%,transparent 8% 92%,rgba(105,190,18,.7) 92% 95%,transparent);
  opacity:1;
  transform:scaleX(1);
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-editorial-menu-rule::before{left:0;}
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-editorial-menu-rule::after{right:0;}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"]:not(.is-hidden) .architecture-editorial-menu-rule{
  animation:sipalayCreditsRule 1.3s cubic-bezier(.2,.72,.2,1) .12s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-editorial-evidence{
  position:absolute;
  z-index:1;
  top:17.5%;
  left:8%;
  width:84%;
  height:28.5%;
  margin:0;
  overflow:hidden;
  border:1px solid rgba(105,190,18,.48);
  border-radius:22px 22px 14px 14px;
  background:#010201;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-editorial-image-pair{
  display:grid;
  grid-template-columns:.95fr 1fr 1.05fr;
  gap:10px;
  width:100%;
  height:100%;
  background:#010201;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-editorial-image-pair img{
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  filter:saturate(.92) contrast(1.08) brightness(.94);
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-editorial-image-human{
  object-position:50% 52%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-editorial-image-water{
  object-position:50% 54%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-editorial-image-territory{
  object-position:50% 50%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-editorial-evidence figcaption{
  position:absolute;
  right:15.75px;
  bottom:11.55px;
  color:#8cdc35;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:10.5pt;
  font-weight:700;
  line-height:1;
  letter-spacing:.12em;
  text-transform:uppercase;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-editorial-credit{
  color:rgba(255,255,255,.58);
  font-size:.72em;
  letter-spacing:.08em;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"]:not(.is-hidden) .architecture-editorial-evidence{
  animation:archiEditorialEvidenceIn .68s cubic-bezier(.2,.72,.2,1) .04s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"]:not(.is-hidden) ~ .architecture-story-hud{
  top:53.5%;
  left:calc(8% + 8.3px);
  right:8%;
  bottom:auto;
  width:auto;
  max-width:none;
  gap:8.4px;
  align-items:flex-start;
  text-align:left;
  transform:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker{
  margin:0 0 3.15px;
  font-size:16.8pt;
  line-height:1.15;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  max-width:none;
  font-size:21.15pt;
  line-height:1.02;
  white-space:nowrap;
  text-wrap:nowrap;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  max-width:none;
  margin-top:3.5px;
  color:rgba(255,255,255,.9);
  font-family:'Archivo Black',sans-serif;
  font-size:19pt;
  line-height:1.18;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-provenance{
  position:relative;
  top:0;
  margin-top:10px;
  color:#69be12;
  font-family:'Archivo Black',sans-serif;
  font-size:26.5pt;
  line-height:1;
  letter-spacing:0;
  text-transform:none;
  background:none;
  -webkit-text-fill-color:#69be12;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"]:not(.is-hidden) ~ .architecture-story-hud.is-entering{
  animation:none;
  opacity:1;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"]:not(.is-hidden) ~ .architecture-story-hud.is-entering .archi-story-kicker{
  animation:
    archiEditorialLineIn .28s cubic-bezier(.2,.72,.2,1) .16s both,
    archiLetterFluoresce 6.8s ease-in-out .5s infinite;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"]:not(.is-hidden) ~ .architecture-story-hud.is-entering .archi-story-title{
  animation:archiEditorialLineIn .38s cubic-bezier(.16,.82,.2,1) .38s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"]:not(.is-hidden) ~ .architecture-story-hud.is-entering .archi-story-body{
  animation:archiEditorialLineIn .38s cubic-bezier(.2,.72,.2,1) .8s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"]:not(.is-hidden) ~ .architecture-story-hud.is-entering .archi-story-provenance{
  animation:archiEditorialBoom .32s cubic-bezier(.12,.88,.18,1.16) 1.32s both;
}

@keyframes archiEditorialEvidenceIn{
  from{opacity:0;transform:translateY(5px);}
  to{opacity:1;transform:translateY(0);}
}

@keyframes archiEditorialLineIn{
  from{opacity:0;transform:translateY(7px);}
  to{opacity:1;transform:translateY(0);}
}

@keyframes archiEditorialBoom{
  from{opacity:0;transform:translateY(6px) scale(.96);}
  to{opacity:1;transform:translateY(0) scale(1);}
}

/* Sipalay arrival — the former View 09 now opens the chapter as View 08.
   It begins on black with the original solar study, then travels from the
   wider Sipalay coast through the mine landscape and finally into Cansibit
   Pit. The place and its transformation resolve in the final two beats. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-sipalay-idea-reel{
  position:absolute;
  z-index:0;
  inset:0;
  overflow:hidden;
  background:#010201;
  pointer-events:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-sipalay-idea-reel::after{
  content:"";
  position:absolute;
  z-index:3;
  inset:0;
  background:
    linear-gradient(90deg,rgba(0,0,0,.20),rgba(0,0,0,.02) 58%,rgba(0,0,0,.06)),
    linear-gradient(180deg,rgba(0,0,0,.03),transparent 51%,rgba(0,0,0,.24));
  pointer-events:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-sipalay-idea-frame{
  position:absolute;
  z-index:1;
  inset:0;
  margin:0;
  overflow:hidden;
  opacity:0;
  will-change:opacity,transform,filter;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-sipalay-idea-frame img{
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  filter:saturate(.96) contrast(1.02) brightness(1);
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-sipalay-idea-frame-coast img{
  object-position:50% 58%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-sipalay-idea-frame-mines img{
  object-position:50% 60%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-sipalay-idea-frame-pit-wide img{
  object-position:50% 52%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-sipalay-idea-frame-pit-close img{
  object-position:47% 56%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-sipalay-place-credit{
  position:absolute;
  z-index:5;
  right:16px;
  bottom:14px;
  max-width:78%;
  color:rgba(255,255,255,.62);
  font-family:'IBM Plex Sans',sans-serif;
  font-size:7px;
  font-weight:500;
  line-height:1.2;
  letter-spacing:.06em;
  text-align:right;
  opacity:0;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-editorial-menu-stage{
  opacity:0;
  animation:sipalayIdeaOpeningMark 4.5s ease .35s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing:not(.is-hidden) .architecture-editorial-evidence{
  opacity:0;
  animation:sipalayIdeaSolarEvidence 4.8s cubic-bezier(.2,.72,.2,1) .7s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-frame-coast{
  animation:sipalayIdeaLandscape 4.7s cubic-bezier(.2,.7,.2,1) 4.25s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-frame-mines{
  animation:sipalayIdeaLandscape 4.7s cubic-bezier(.2,.7,.2,1) 7.25s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-frame-pit-wide{
  animation:sipalayIdeaLandscape 4.9s cubic-bezier(.2,.7,.2,1) 10.15s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-frame-pit-close{
  animation:sipalayIdeaPitSettle 4.8s cubic-bezier(.18,.72,.2,1) 13s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-place-credit{
  animation:sipalayIdeaCredit 8.1s ease 4.6s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing:not(.is-hidden) ~ .architecture-story-hud{
  opacity:1 !important;
  animation:none !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  opacity:0;
  animation:sipalayIdeaWrit 4.35s cubic-bezier(.18,.76,.18,1) 1.45s both !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  opacity:0;
  animation:sipalayIdeaWrit 6.25s cubic-bezier(.18,.76,.18,1) 5.05s both !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing:not(.is-hidden) ~ .architecture-story-hud .archi-story-provenance{
  opacity:0;
  animation:sipalayIdeaFinalQuestion .7s cubic-bezier(.12,.88,.18,1.08) 13.4s both !important;
}

@keyframes sipalayIdeaOpeningMark{
  0%{opacity:0;}
  14%,68%{opacity:1;}
  100%{opacity:0;}
}

@keyframes sipalayIdeaSolarEvidence{
  0%{opacity:0;transform:translateY(7px);}
  18%,68%{opacity:1;transform:translateY(0);}
  100%{opacity:0;transform:translateY(2px);}
}

@keyframes sipalayIdeaLandscape{
  0%{opacity:0;transform:translate3d(0,-5px,0) scale(1.055);filter:brightness(.88) saturate(.90);}
  24%{opacity:1;filter:brightness(1) saturate(.98);}
  67%{opacity:1;}
  100%{opacity:0;transform:translate3d(0,5px,0) scale(1.018);filter:brightness(.96) saturate(.94);}
}

@keyframes sipalayIdeaPitSettle{
  0%{opacity:0;transform:scale(1.01);filter:brightness(.90) saturate(.92);}
  26%{opacity:1;filter:brightness(1) saturate(.98);}
  100%{opacity:1;transform:scale(1.14);filter:brightness(.99) saturate(.97);}
}

@keyframes sipalayIdeaWrit{
  0%{opacity:0;transform:translate3d(0,9px,0);filter:blur(1px);}
  18%,66%{opacity:1;transform:translate3d(0,0,0);filter:blur(0);}
  100%{opacity:0;transform:translate3d(0,2px,0);filter:blur(.2px);}
}

@keyframes sipalayIdeaFinalQuestion{
  from{opacity:0;transform:translate3d(0,8px,0) scale(.97);}
  to{opacity:1;transform:translate3d(0,0,0) scale(1);}
}

@keyframes sipalayIdeaCredit{
  0%,7%{opacity:0;}
  15%,88%{opacity:.62;}
  100%{opacity:0;}
}

@media(prefers-reduced-motion:reduce){
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-editorial-menu-stage,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-editorial-evidence,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-frame,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-place-credit,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing:not(.is-hidden) ~ .architecture-story-hud :is(.archi-story-title,.archi-story-body,.archi-story-provenance){
    animation:none !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-editorial-menu-stage,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing:not(.is-hidden) ~ .architecture-story-hud :is(.archi-story-title,.archi-story-body,.archi-story-provenance){
    opacity:1 !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-frame-pit-close{
    opacity:1;
    transform:none;
    filter:none;
  }
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"]:not(.is-hidden) ~ .architecture-story-hud{
  display:none !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-sipalay-idea-frame img{
  filter:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-sipalay-idea-frame-aerial-present img{
  object-position:50% 52%;
  filter:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-sipalay-idea-frame-solar-human img{
  object-position:50% 47%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-sipalay-idea-frame-solar-water img{
  object-position:50% 54%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-sipalay-idea-frame-solar-territory img{
  object-position:50% 50%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-sipalay-idea-frame-historic img{
  object-position:50% 49%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-sipalay-idea-frame-water-restored img{
  object-position:50% 50%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"] .architecture-sipalay-idea-frame-pit-close img{
  object-position:50% 47%;
  filter:brightness(1.07) contrast(1.01) saturate(.99);
}

body:not(.verticale-edition) #p3 .architecture-sipalay-idea-writ{
  position:absolute;
  z-index:5;
  inset:0;
  display:block;
  margin:0;
  color:#fff;
  pointer-events:none;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-idea-beat{
  position:absolute;
  left:32px;
  right:32px;
  bottom:84px;
  display:block;
  margin:0;
  color:#fff;
  background:none;
  -webkit-text-fill-color:#fff;
  font:400 40px/1.04 'Archivo Black',sans-serif;
  letter-spacing:-.012em;
  word-spacing:normal;
  text-align:left;
  text-align-last:left;
  opacity:0;
  will-change:opacity,transform,filter;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-idea-beat-opening{font-size:40px;}
body:not(.verticale-edition) #p3 .architecture-sipalay-idea-beat-what-if{
  left:32px;
  right:auto;
  bottom:84px;
  width:max-content;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  white-space:nowrap;
  font-size:180pt;
  line-height:.82;
  letter-spacing:-.025em;
}
body:not(.verticale-edition) #p3 .architecture-sipalay-idea-beat-float{font-size:40px;}
body:not(.verticale-edition) #p3 .architecture-sipalay-idea-beat-read-resource{font-size:40px;}
body:not(.verticale-edition) #p3 .architecture-sipalay-idea-beat-read-area{font-size:40px;}
body:not(.verticale-edition) #p3 .architecture-sipalay-idea-beat-beautiful-area{font-size:32px;}
body:not(.verticale-edition) #p3 .architecture-sipalay-idea-beat-gift{font-size:40px;}

body:not(.verticale-edition) #p3 .architecture-sipalay-idea-beat-gift{
  bottom:41px;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-idea-beat-gift-title,
body:not(.verticale-edition) #p3 .architecture-sipalay-idea-beat-gift-support{
  display:block;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-idea-beat-gift-support{
  margin-top:8px;
  font:400 22pt/1.28 'IBM Plex Sans',sans-serif;
  letter-spacing:0;
  text-transform:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-frame-aerial-present{
  animation:sipalayFullAerialEstablish 5.1s cubic-bezier(.22,.65,.2,1) .55s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-frame-solar-territory{
  animation:sipalayFullFrameGlimpse 4.9s cubic-bezier(.22,.65,.2,1) 4.1s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-frame-historic{
  animation:sipalayFullFrameGlimpse 4.7s cubic-bezier(.22,.65,.2,1) 7.8s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-frame-coast{
  animation:sipalayFullFrameGlimpse 4.3s cubic-bezier(.22,.65,.2,1) 11.3s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-frame-water-restored{
  animation:sipalayFullFrameGlimpse 4.2s cubic-bezier(.22,.65,.2,1) 14.6s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-frame-pit-close{
  animation:sipalayFullPitSettle 6.4s cubic-bezier(.22,.65,.2,1) 17.45s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-beat-opening{
  animation:sipalayFullWritBeat 2.9s cubic-bezier(.2,.72,.2,1) 4.45s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-beat-what-if{
  animation:sipalayFullWhatIfBeat 2.9s cubic-bezier(.2,.72,.2,1) 1.05s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-beat-float{
  animation:sipalayFullWritBeat 4s cubic-bezier(.2,.72,.2,1) 7.75s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-beat-read-resource{
  animation:sipalayFullWritBeat 3.8s cubic-bezier(.2,.72,.2,1) 12.05s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-beat-read-area{
  animation:sipalayFullWritBeat 3.2s cubic-bezier(.2,.72,.2,1) 16.05s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-beat-beautiful-area{
  animation:sipalayFullWritBeat 5.35s cubic-bezier(.2,.72,.2,1) 19.55s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-beat-gift{
  animation:sipalayFullWritSettle .8s cubic-bezier(.12,.88,.18,1.08) 25.15s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-beat-gift-support{
  animation:sipalayFullWritSettle .7s cubic-bezier(.12,.88,.18,1.08) 25.75s both;
}

/* The reel light switches off independently; the place and its transformation stay. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-settled .architecture-sipalay-idea-frame-pit-close{
  opacity:1;
  transform:scale(1.055);
  filter:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-settled .architecture-sipalay-idea-beat-gift{
  opacity:1;
  transform:none;
  filter:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-settled .architecture-sipalay-idea-beat-gift-support{
  opacity:1;
  transform:none;
  filter:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-place-credit{
  animation:sipalayFullPlaceCredit 4s ease 11.45s both;
}

@keyframes sipalayFullAerialEstablish{
  0%{opacity:0;transform:scale(1.012);}
  17%,72%{opacity:1;}
  100%{opacity:0;transform:scale(1.04);}
}

@keyframes sipalayFullFrameGlimpse{
  0%{opacity:0;transform:translate3d(0,-5px,0) scale(1.045);}
  27%{opacity:1;transform:translate3d(0,0,0) scale(1.03);}
  63%{opacity:1;}
  100%{opacity:0;transform:translate3d(0,5px,0) scale(1.012);}
}

@keyframes sipalayFullPitSettle{
  0%{opacity:0;transform:scale(1);}
  16%{opacity:1;transform:scale(1.012);}
  58%{opacity:1;transform:scale(1.032);}
  100%{opacity:1;transform:scale(1.055);}
}

@keyframes sipalayFullWritBeat{
  0%{opacity:0;transform:translate3d(0,-10px,0);filter:blur(1px);}
  23%,66%{opacity:1;transform:translate3d(0,0,0);filter:blur(0);}
  100%{opacity:0;transform:translate3d(0,2px,0);filter:blur(.25px);}
}

@keyframes sipalayFullWhatIfBeat{
  0%{opacity:0;transform:translate3d(0,-10px,0);filter:blur(1px);}
  22%,66%{opacity:1;transform:translate3d(0,0,0);filter:blur(0);}
  100%{opacity:0;transform:translate3d(0,2px,0);filter:blur(.25px);}
}

@keyframes sipalayFullWritSettle{
  from{opacity:0;transform:translate3d(0,8px,0) scale(.97);}
  to{opacity:1;transform:translate3d(0,0,0) scale(1);}
}

@keyframes sipalayFullPlaceCredit{
  0%,8%{opacity:0;}
  17%,86%{opacity:.62;}
  100%{opacity:0;}
}

@media(prefers-reduced-motion:reduce){
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-frame,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-beat,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-place-credit{
    animation:none !important;
    opacity:0 !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-frame-pit-close,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-beat-gift,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-editorial-solar"].is-sipalay-idea-reel-playing .architecture-sipalay-idea-beat-gift-support{
    animation:none !important;
    opacity:1 !important;
    transform:none !important;
    filter:none !important;
  }
}

/* View 10: standard Horizontale lower-left lockup. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-early-architecture"]:not(.is-hidden) ~ .architecture-story-hud{
  left:28px;
  right:28px;
  bottom:29px;
  width:auto;
  max-width:none;
  align-items:flex-start;
  text-align:left;
  transform:none;
  gap:6px;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-early-architecture"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-early-architecture"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-early-architecture"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  width:auto;
  margin-left:0;
  margin-right:0;
  text-align:left;
  text-align-last:left;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-early-architecture"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker{
  margin-bottom:-6px;
  font-size:20pt;
  transform:translateY(-2px);
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-early-architecture"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  max-width:none;
  font-size:30pt;
  line-height:1;
  white-space:nowrap;
  text-wrap:nowrap;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-early-architecture"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  max-width:none;
  margin-top:0;
  font-size:16pt;
  line-height:1.15;
  white-space:nowrap;
}

/* Naming reveal: lift the resolved lockup without moving its established
   left edge. The three lines breathe as one deliberate declaration. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-early-architecture"]:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-architecture-resolved{
  align-items:flex-start;
  gap:8px;
  text-align:left;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-early-architecture"]:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-architecture-resolved :is(.archi-story-kicker,.archi-story-title,.archi-story-body){
  margin-left:0;
  margin-right:0;
  text-align:left;
  text-align-last:left;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-early-architecture"]:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-architecture-resolved .archi-story-kicker{
  margin-bottom:0;
  font-size:21pt;
  line-height:1.2;
  transform:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-early-architecture"]:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-architecture-resolved .archi-story-title{
  max-width:none;
  font-size:34pt;
  line-height:1.04;
  white-space:nowrap;
  text-wrap:nowrap;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-early-architecture"]:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-architecture-resolved .archi-story-body{
  max-width:44ch;
  margin-top:0;
  font-size:18pt;
  line-height:1.28;
  white-space:normal;
  text-wrap:wrap;
}

/* View 11: standard Horizontale lower-left lockup. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"]:not(.is-hidden) ~ .architecture-story-hud{
  left:28px;
  right:28px;
  bottom:29px;
  width:auto;
  max-width:none;
  align-items:flex-start;
  text-align:left;
  transform:none;
  gap:6px;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  width:auto;
  margin-left:0;
  margin-right:0;
  text-align:left;
  text-align-last:left;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker{
  font-size:26pt;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  max-width:none;
  font-size:24pt;
  line-height:1.03;
  white-space:nowrap;
  text-wrap:nowrap;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"]:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-reel-copy{
  transition:opacity .5s ease,filter .5s ease;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"]:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-reel-copy-out{
  opacity:0;
  transform:none;
  filter:blur(.7px);
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"]:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-reel-copy-entering .archi-story-kicker{
  animation:sipalayReelKickerWashIn .9s cubic-bezier(.16,.72,.2,1) both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"]:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-reel-copy-entering .archi-story-title{
  animation:sipalayReelTitleSettleIn .62s ease .22s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-dusk-copy:not(.is-hidden) ~ .architecture-story-hud .archi-story-body.is-dusk-tagline-entering{
  animation:sipalayDuskTaglineIn .95s cubic-bezier(.16,.72,.2,1) both;
}

@keyframes sipalayReelKickerWashIn{
  0%{opacity:0;clip-path:inset(0 100% 0 0);filter:brightness(1.85);}
  62%{opacity:1;clip-path:inset(0 0 0 0);filter:brightness(1.28);}
  100%{opacity:1;clip-path:inset(0 0 0 0);filter:brightness(1);}
}

@keyframes sipalayReelTitleSettleIn{
  0%{opacity:0;}
  100%{opacity:1;}
}

@keyframes sipalayDuskTaglineIn{
  0%{opacity:0;transform:translate3d(0,5px,0);filter:blur(1.4px);}
  58%{opacity:.86;transform:translate3d(0,0,0);filter:blur(.15px);}
  100%{opacity:1;transform:translate3d(0,0,0);filter:blur(0);}
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-reel-phase-two:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker{
  font-size:17pt;
  transform:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-reel-phase-two:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  font-size:24pt;
  line-height:1.03;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-reel-phase-three:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker{
  font-size:17pt;
  transform:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-reel-phase-three:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  max-width:none;
  font-size:24pt;
  line-height:1.03;
  white-space:nowrap;
  text-wrap:nowrap;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-reel-phase-three:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  max-width:none;
  margin-top:0;
  font-size:16pt;
  line-height:1.15;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview:not(.is-hidden) .architecture-sipalay-reel-daylight,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview:not(.is-hidden) .architecture-sipalay-reel-blue-hour{
  opacity:0;
}

/* The old overview arrival push must not wake during the Dusk handoff.
   That older 1.055 animation was the one-frame scale lurch before the fade. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview:not(.is-lake-sunset-transition):not(.is-hidden) .architecture-sipalay-reel-overview{
  animation:architectureSipalayVisionOverviewArrival 1.05s cubic-bezier(.16,.72,.2,1) both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview:not(.is-hidden) ~ .architecture-story-hud{
  opacity:0 !important;
  pointer-events:none;
}

/* Let the outgoing B11 copy dissolve with the lake instead of stepping away
   before the image handoff finishes. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-dusk-to-overview:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-reel-copy-out{
  transition:opacity 1.8s ease-in-out,filter 1.8s ease-in-out !important;
}

/* Scene 11 carries its lower tagline across the C11 lake handoff. Keep the
   title clear while the existing Water / Community line stays continuously on. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-dusk-to-overview:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-tagline-carrying,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview.is-c11-lake:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-tagline-carrying{
  opacity:1 !important;
  pointer-events:none !important;
  transform:none !important;
  filter:none !important;
}
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-dusk-to-overview:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-tagline-carrying .archi-story-kicker,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-dusk-to-overview:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-tagline-carrying .archi-story-title,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview.is-c11-lake:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-tagline-carrying .archi-story-kicker,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview.is-c11-lake:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-tagline-carrying .archi-story-title{
  opacity:0 !important;
  visibility:hidden !important;
}
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-dusk-to-overview:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-tagline-carrying .archi-story-body,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview.is-c11-lake:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-tagline-carrying .archi-story-body{
  opacity:1 !important;
  visibility:visible !important;
}

/* The empty-lake coda is the third and final thought: let its title arrive
   with the overview image instead of disappearing with the first two views. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-reel-copy:not(.is-sipalay-reel-copy-out){
  opacity:1 !important;
  pointer-events:auto;
  transform:none;
  filter:none;
}

/* C11 is the quiet lake. D11 is the same view after the light has turned.
   Let the final words belong to the sunset, with the supporting line arriving
   first and the title taking one small breath before it follows. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview.is-c11-lake:not(.is-hidden) ~ .architecture-story-hud,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview.is-lake-sunset-transition:not(.is-d11-sunset):not(.is-hidden) ~ .architecture-story-hud{
  opacity:0 !important;
  pointer-events:none !important;
  transform:none !important;
  filter:none !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview.is-lake-sunset-transition.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-reel-copy:not(.is-sipalay-reel-copy-out),
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview.is-lake-sunset.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-reel-copy:not(.is-sipalay-reel-copy-out){
  opacity:1 !important;
  pointer-events:auto !important;
  transform:none !important;
  filter:none !important;
}

/* Scene 11 title arrival — hold the approved title geometry, then fade the
   live three-line title in as one composed block. */
body:not(.verticale-edition) #p3 #slideA11.is-overview.is-lake-sunset-transition.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-sunset-title-pending,
body:not(.verticale-edition) #p3 #slideA11.is-overview.is-lake-sunset.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-sunset-title-pending{
  visibility:hidden !important;
  opacity:0 !important;
  transform:none !important;
  filter:none !important;
}

body:not(.verticale-edition) #p3 #slideA11.is-overview.is-lake-sunset-transition.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-sunset-title-lines-live,
body:not(.verticale-edition) #p3 #slideA11.is-overview.is-lake-sunset.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-sunset-title-lines-live{
  visibility:visible !important;
  opacity:1 !important;
}

/* Scene 11 anti-jump lock — establish the approved three-line geometry while
   the title is still pending, so the reveal never passes through two lines. */
body:not(.verticale-edition) #p3 #slideA11.is-overview.is-lake-sunset-transition.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-nature-proves-stack{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  width:max-content !important;
  max-width:100% !important;
  font-size:38pt !important;
  line-height:.82 !important;
  row-gap:12px !important;
  position:relative !important;
  top:-15px !important;
  white-space:nowrap !important;
  text-wrap:nowrap !important;
  text-align:left !important;
  text-align-last:left !important;
}

body:not(.verticale-edition) #p3 #slideA11.is-overview.is-lake-sunset-transition.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-nature-proves-stack span{
  display:block !important;
}

body:not(.verticale-edition) #p3 #slideA11.is-overview.is-lake-sunset-transition.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-nature-proves-stack .nature-proves-word{
  font-size:38pt !important;
  line-height:.82 !important;
}

body:not(.verticale-edition) #p3 #slideA11.is-overview.is-lake-sunset-transition.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-nature-proves-stack .man-must-word{
  font-size:56pt !important;
  line-height:.82 !important;
  margin-bottom:-16px !important;
}

body:not(.verticale-edition) #p3 #slideA11.is-overview.is-lake-sunset-transition.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-nature-proves-stack .improve-word{
  font-size:68pt !important;
  line-height:.82 !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview.is-lake-sunset-transition.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-sunset-title-pending,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview.is-lake-sunset.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-sunset-title-pending{
  opacity:0 !important;
  transform:none !important;
  filter:none !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview.is-lake-sunset-transition.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-body.is-sunset-tagline-entering,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview.is-lake-sunset.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-body.is-sunset-tagline-entering{
  animation:sipalayDuskTaglineIn .95s cubic-bezier(.16,.72,.2,1) both !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview.is-lake-sunset-transition.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-sunset-title-entering,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview.is-lake-sunset.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-sunset-title-entering{
  animation:sipalaySunsetTitleIn .95s cubic-bezier(.16,.72,.2,1) both !important;
}

@keyframes sipalaySunsetTitleIn{
  0%{opacity:0;transform:none;filter:none;}
  56%{opacity:1;transform:none;filter:none;}
  100%{opacity:1;transform:none;filter:none;}
}

@media(prefers-reduced-motion:reduce){
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview.is-lake-sunset.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-sunset-title-pending,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview.is-lake-sunset.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-sunset-title-entering{
    opacity:1 !important;
    transform:none !important;
    filter:none !important;
    animation:none !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview.is-lake-sunset.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-body.is-sunset-tagline-entering{
    opacity:1 !important;
    transform:none !important;
    filter:none !important;
    animation:none !important;
  }
}

@keyframes architectureSipalayVisionOverviewArrival{
  from{opacity:0;transform:scale(1.012);}
  to{opacity:1;transform:scale(1.055);}
}

/* Sipalay presentation record: a quiet black impact board, paced like film credits. */
body:not(.verticale-edition) #p3 .architecture-sipalay-credits-board{
  overflow:hidden;
  background:#010201;
  isolation:isolate;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credits-board::before{
  content:"";
  position:absolute;
  z-index:1;
  inset:0;
  background:
    linear-gradient(180deg,rgba(1,2,1,.72),rgba(1,2,1,.42) 36%,rgba(1,2,1,.64)),
    radial-gradient(ellipse at 50% 62%,rgba(105,190,18,.075),transparent 47%),
    linear-gradient(180deg,rgba(105,190,18,.025),transparent 30% 72%,rgba(105,190,18,.035));
  pointer-events:none;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credits-backdrop{
  position:absolute;
  z-index:0;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:50% 50%;
  opacity:0;
  transform:scale(1.035);
  transform-origin:50% 50%;
  will-change:opacity,transform;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credits-board:not(.is-hidden) .architecture-sipalay-credits-backdrop{
  animation:sipalayCreditsBackdrop 14.5s cubic-bezier(.2,.72,.2,1) both;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credits-stage{
  position:absolute;
  z-index:2;
  inset:0;
  overflow:hidden;
  color:#fff;
  font-family:'IBM Plex Sans',sans-serif;
  text-align:center;
  text-shadow:none;
}

body:not(.verticale-edition) #p3 .architecture-hugong-credit-frame-label{
  position:absolute;
  z-index:3;
  top:5.2%;
  left:32px;
  color:#69be12;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:14px;
  font-weight:700;
  line-height:1;
  letter-spacing:.22em;
  text-transform:uppercase;
  opacity:.9;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credits-eyebrow{
  position:absolute;
  z-index:2;
  top:6.5%;
  left:12%;
  right:auto;
  display:flex;
  align-items:center;
  justify-content:center;
  width:61%;
  min-height:46px;
  padding:4px 24px;
  border:1.5px solid rgba(105,190,18,.92);
  border-radius:30px / 13px;
  box-shadow:inset 0 0 0 1px rgba(105,190,18,.18),0 0 18px rgba(105,190,18,.045);
  color:#69be12;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:14px;
  font-weight:700;
  line-height:1;
  letter-spacing:.22em;
  text-transform:uppercase;
  opacity:.9;
}

/* View 12: use the same presentation-record composition established in
   Mining — evidence in the centre, record lockup on the shared lower-left
   edge. Sipalay keeps its own measured film-credit pacing. */
body:not(.verticale-edition) #p3 .architecture-sipalay-record-menu{
  top:auto;
  left:32px;
  right:32px;
  bottom:55px;
  width:auto;
  min-height:0;
  padding:0;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
  text-align:left;
  gap:0;
  border:0;
  border-radius:0;
  box-shadow:none;
  opacity:0;
  transform:translateY(24px);
}

body:not(.verticale-edition) #p3 .architecture-sipalay-record-place{
  display:block;
  order:2;
  color:#fff;
  font-family:'Archivo Black',sans-serif;
  font-size:clamp(23px,2.35vw,34px);
  font-weight:400;
  line-height:1.1;
  letter-spacing:-.018em;
  white-space:normal;
  max-width:calc(100% - 64px);
}

body:not(.verticale-edition) #p3 .architecture-sipalay-record-label{
  display:block;
  order:1;
  margin:0 0 14px;
  color:#fff;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:17px;
  font-weight:700;
  line-height:1;
  letter-spacing:.18em;
  text-transform:uppercase;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-record-complex{
  display:block;
  order:3;
  margin:10px 0 0;
  color:#fff;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:19px;
  font-weight:700;
  line-height:1;
  letter-spacing:.18em;
  text-transform:uppercase;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credits-rule.architecture-sipalay-record-rule{
  display:none;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credits-rule.architecture-sipalay-record-rule::before{left:0;}
body:not(.verticale-edition) #p3 .architecture-sipalay-credits-rule.architecture-sipalay-record-rule::after{right:0;}

body:not(.verticale-edition) #p3 .architecture-sipalay-credits-rule{
  position:absolute;
  z-index:1;
  top:11.35%;
  left:5%;
  right:5%;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(105,190,18,.7) 5% 8%,transparent 8% 69%,rgba(105,190,18,.7) 69% 95%,transparent);
  transform:scaleX(0);
  transform-origin:50% 50%;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credits-rule::before,
body:not(.verticale-edition) #p3 .architecture-sipalay-credits-rule::after{
  content:"";
  position:absolute;
  top:50%;
  width:7px;
  height:7px;
  border:1px solid rgba(105,190,18,.85);
  border-radius:50%;
  background:#010201;
  transform:translateY(-50%);
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credits-rule::before{left:4.5%;}
body:not(.verticale-edition) #p3 .architecture-sipalay-credits-rule::after{right:4.5%;}

body:not(.verticale-edition) #p3 .architecture-sipalay-credits-board:not(.is-hidden) .architecture-sipalay-credits-rule{
  animation:sipalayCreditsRule 1.3s cubic-bezier(.2,.72,.2,1) .22s both;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credit{
  position:absolute;
  top:50%;
  left:50%;
  right:auto;
  width:max-content;
  max-width:calc(100% - 64px);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:11px;
  text-align:left;
  opacity:0;
  transform:translate(-50%,calc(-50% + 34px));
  will-change:opacity,transform;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credit small{
  display:block;
  color:#69be12;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:17px;
  font-weight:700;
  line-height:1.15;
  letter-spacing:.18em;
  text-transform:uppercase;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credit strong{
  display:block;
  color:#fff;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:clamp(20px,1.78vw,29px);
  font-weight:400;
  line-height:1.05;
  letter-spacing:.005em;
  text-transform:uppercase;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credit-presentation{
  top:50%;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credit-presentation strong:last-child{
  font-size:clamp(16px,1.4vw,23px);
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credit-presentation strong:first-of-type{
  font-family:'Archivo Black',sans-serif;
  font-weight:400;
}

body:not(.verticale-edition) #p3 .architecture-hugong-credit-thanks{
  margin-top:4px;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credit-twice strong{
  color:#fff;
  font-family:'Archivo Black',sans-serif;
  font-size:clamp(29px,calc(4vw - 5.33px),53px);
  font-weight:400;
  letter-spacing:.04em;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credit-world strong{
  max-width:none;
  font-size:clamp(22px,2.35vw,36px);
  line-height:.98;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credit-leo strong{
  font-size:clamp(20px,calc(2.32vw - 3px),33px);
  line-height:1;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credit-leo strong span{
  display:block;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credit-leo-name{
  margin-top:7px;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credits-eyebrow,
body:not(.verticale-edition) #p3 .architecture-sipalay-credit small{
  font-family:'IBM Plex Sans',sans-serif !important;
  font-weight:700 !important;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credits-board:not(.is-hidden) .architecture-sipalay-credit-presentation{
  animation:sipalayRecordPass 5.7s cubic-bezier(.2,.72,.2,1) .35s both;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credits-board:not(.is-hidden) .architecture-sipalay-credit-twice{
  animation:sipalayCreditsPass 3.4s cubic-bezier(.2,.72,.2,1) 5.15s both;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credits-board:not(.is-hidden) .architecture-sipalay-credit-world{
  animation:sipalayRecordPass 4.6s cubic-bezier(.2,.72,.2,1) 7.55s both;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credits-board:not(.is-hidden) .architecture-sipalay-credit-leo{
  animation:sipalayRecordFinal 3.1s cubic-bezier(.2,.72,.2,1) 11.35s both;
}

body:not(.verticale-edition) #p3 .architecture-hugong-credits-frame-c:not(.is-hidden) .architecture-sipalay-credit-world{
  animation:sipalayRecordPass 4.6s cubic-bezier(.2,.72,.2,1) .6s both;
}

body:not(.verticale-edition) #p3 .architecture-hugong-credits-frame-d:not(.is-hidden) .architecture-sipalay-credit-leo{
  animation:sipalayRecordFinal 3.1s cubic-bezier(.2,.72,.2,1) .6s both;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-credits-board:not(.is-hidden) .architecture-sipalay-record-menu{
  animation:hugongFilesCopyIn .85s cubic-bezier(.2,.72,.2,1) .38s both;
}

@keyframes sipalayCreditsRule{
  from{opacity:0;transform:scaleX(0);}
  to{opacity:1;transform:scaleX(1);}
}

@keyframes sipalayCreditsBackdrop{
  0%{opacity:0;transform:scale(1.035);}
  9%{opacity:.68;transform:scale(1.02);}
  34%{opacity:.48;transform:scale(1);}
  55%{opacity:.18;transform:scale(.99);}
  72%,100%{opacity:0;transform:scale(.985);}
}

/* Scene 20 is one panel with two living layers: sepia memory, then moving
   bamboo. Keeping both moments inside one stage prevents a duplicate leaves
   card from flashing in a second time. */
body:not(.verticale-edition) #p3 .architecture-hugong-credits-frame-a:not(.is-hidden) .architecture-sipalay-credits-backdrop:not(.architecture-hugong-credits-sequence-leaves){
  opacity:1 !important;
  transform:none !important;
  animation:hugongCreditsSepiaOut 2.2s cubic-bezier(.22,.61,.36,1) 3.2s both !important;
}

body:not(.verticale-edition) #p3 .architecture-hugong-credits-frame-a:not(.is-hidden) .architecture-hugong-credits-sequence-leaves{
  opacity:0 !important;
  transform:none !important;
  animation:hugongCreditsLeavesIn 2.2s cubic-bezier(.22,.61,.36,1) 3.2s both !important;
  z-index:1;
}

body:not(.verticale-edition) #p3 .architecture-hugong-credits-frame-a:not(.is-hidden) .architecture-sipalay-credit-presentation{
  animation:hugongCreditsPresentationOut 2.2s cubic-bezier(.22,.61,.36,1) 3.2s both !important;
}

body:not(.verticale-edition) #p3 .architecture-hugong-credits-frame-a:not(.is-hidden) .architecture-hugong-credits-sequence-record{
  animation:hugongCreditsRecordIn .85s cubic-bezier(.2,.72,.2,1) 3.2s both !important;
}

body:not(.verticale-edition) #p3 .architecture-hugong-credits-frame-a:not(.is-hidden) .architecture-hugong-credits-sequence-record-rule{
  animation:hugongCreditsRuleIn .85s cubic-bezier(.2,.72,.2,1) 3.2s both !important;
}

@keyframes hugongCreditsSepiaOut{
  from{opacity:1;}
  to{opacity:0;}
}

@keyframes hugongCreditsLeavesIn{
  from{opacity:0;}
  to{opacity:1;}
}

@keyframes hugongCreditsPresentationOut{
  from{opacity:1;transform:translate(-50%,calc(-50% + 34px));}
  to{opacity:0;transform:translate(-50%,calc(-50% + 24px));}
}

@keyframes hugongCreditsRecordIn{
  from{opacity:0;transform:translateY(24px);}
  to{opacity:1;transform:translateY(0);}
}

@keyframes hugongCreditsRuleIn{
  from{opacity:0;transform:scaleX(0);}
  to{opacity:1;transform:scaleX(1);}
}

@keyframes sipalayCreditsPass{
  0%{opacity:0;transform:translateY(36px);filter:blur(1px);}
  15%{opacity:1;transform:translateY(0);filter:blur(0);}
  68%{opacity:1;transform:translateY(-8px);filter:blur(0);}
  100%{opacity:0;transform:translateY(-40px);filter:blur(.5px);}
}

@keyframes sipalayCreditsFinal{
  0%{opacity:0;transform:translateY(34px);filter:blur(1px);}
  48%,100%{opacity:1;transform:translateY(0);filter:blur(0);}
}

@keyframes sipalayRecordPass{
  0%{opacity:0;transform:translate(-50%,calc(-50% + 36px));filter:blur(1px);}
  15%{opacity:1;transform:translate(-50%,-50%);filter:blur(0);}
  68%{opacity:1;transform:translate(-50%,calc(-50% - 8px));filter:blur(0);}
  100%{opacity:0;transform:translate(-50%,calc(-50% - 40px));filter:blur(.5px);}
}

@keyframes sipalayRecordFinal{
  0%{opacity:0;transform:translate(-50%,calc(-50% + 34px));filter:blur(1px);}
  48%,100%{opacity:1;transform:translate(-50%,-50%);filter:blur(0);}
}

/* View 13: the landscape resolves into its missing wolf. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"]{
  overflow:hidden;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"]::after{
  content:"";
  position:absolute;
  z-index:4;
  left:0;
  right:0;
  bottom:0;
  height:34%;
  pointer-events:none;
  opacity:0;
  background:linear-gradient(180deg,transparent 0%,rgba(2,8,4,.08) 24%,rgba(2,8,4,.3) 68%,rgba(2,8,4,.44) 100%);
}

body:not(.verticale-edition) #p3 .architecture-hugong-wolf-image{
  position:absolute;
  z-index:1;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:50% 50%;
  opacity:0;
  transform:scale(1);
  transform-origin:50% 50%;
  will-change:transform,filter,opacity;
}

body:not(.verticale-edition) #p3 .architecture-hugong-records-image{
  position:absolute;
  z-index:2;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:50% 50%;
  opacity:0;
  transform:scale(1.025);
  filter:sepia(.2) contrast(1.04) brightness(.91);
  will-change:opacity,transform,filter;
}

body:not(.verticale-edition) #p3 .architecture-hugong-bamboo-image{
  position:absolute;
  z-index:3;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:50% 50%;
  opacity:0;
  transform:scale(1.02);
  transform-origin:50% 48%;
  filter:sepia(.58) grayscale(.08) contrast(1.08) brightness(.84) saturate(.62) blur(.08px);
  will-change:opacity,transform,filter;
}

body:not(.verticale-edition) #p3 .architecture-hugong-bamboo-wind-image{
  position:absolute;
  z-index:3;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:50% 50%;
  opacity:0;
  transform:scale(1.02);
  transform-origin:50% 48%;
  filter:contrast(1.04) brightness(.84) saturate(.88) blur(.1px);
  will-change:opacity,transform,filter;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-wolf-return-phase .architecture-hugong-wolf-image{
  animation:hugongWolfReturnReveal 5.9s cubic-bezier(.18,.78,.18,1) both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-records-phase .architecture-hugong-records-image{
  animation:hugongRecordsReveal 2.1s cubic-bezier(.2,.72,.2,1) both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-records-phase .architecture-hugong-wolf-image{
  animation:hugongWolfRetire 1.2s ease both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-bamboo-phase .architecture-hugong-bamboo-image{
  animation:hugongBambooWindReveal 6.8s cubic-bezier(.18,.68,.22,1) both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-new-bamboo-phase .architecture-hugong-bamboo-image{
  animation:hugongBambooSepiaRetire 1.4s ease both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-new-bamboo-phase .architecture-hugong-bamboo-wind-image{
  animation:hugongBambooLivingReveal 6.8s cubic-bezier(.18,.68,.22,1) both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-bamboo-phase::after{
  animation:hugongBambooReflection .9s ease-out .28s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"]:not(.is-hidden) ~ .architecture-story-hud{
  left:28px;
  right:28px;
  bottom:29px;
  width:auto;
  max-width:none;
  align-items:flex-start;
  text-align:left;
  transform:none;
  gap:6px;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  width:auto;
  margin-left:0;
  margin-right:0;
  text-align:left;
  text-align-last:left;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker{
  margin-bottom:-6px;
  font-size:14pt;
  font-weight:700;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-bamboo-phase:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker{
  color:#7fd322;
  font-size:16pt;
}

@keyframes hugongWolfReturnReveal{
  0%{opacity:0;transform:translate3d(3%,0,0) scale(1.02);filter:blur(1px) brightness(.82) contrast(.96) saturate(.9);}
  15%{opacity:1;transform:translate3d(3%,0,0) scale(1.035);filter:blur(.4px) brightness(.94) contrast(1) saturate(.96);}
  45%{opacity:1;transform:translate3d(4%,-1%,0) scale(1.12);filter:blur(.16px) brightness(.99) contrast(1.045) saturate(1);}
  88%{opacity:1;transform:translate3d(5.5%,-2.5%,0) scale(1.25);filter:blur(.02px) brightness(1.035) contrast(1.09) saturate(1.03);}
  100%{opacity:1;transform:translate3d(6%,-3%,0) scale(1.3);filter:blur(0) brightness(1.04) contrast(1.1) saturate(1.035);}
}

@keyframes hugongWolfRetire{
  0%{opacity:1;transform:translate3d(6%,-3%,0) scale(1.3);filter:brightness(1.04) contrast(1.1) saturate(1.035);}
  100%{opacity:0;transform:translate3d(6.4%,-3.2%,0) scale(1.33);filter:brightness(.86) contrast(1.02) saturate(.9);}
}

@keyframes hugongRecordsReveal{
  0%{opacity:0;transform:scale(1.035);filter:sepia(.28) contrast(.98) brightness(.76) blur(.8px);}
  62%{opacity:1;transform:scale(1.012);filter:sepia(.22) contrast(1.035) brightness(.9) blur(.08px);}
  100%{opacity:1;transform:scale(1);filter:sepia(.2) contrast(1.05) brightness(.92) blur(0);}
}

@keyframes hugongBambooWindReveal{
  0%{opacity:0;transform:translate3d(0,0,0) scale(1.015);filter:sepia(.7) grayscale(.12) contrast(.95) brightness(.68) saturate(.52) blur(.85px);}
  18%{opacity:1;transform:translate3d(-.18%,.1%,0) scale(1.035);filter:sepia(.64) grayscale(.1) contrast(1.04) brightness(.8) saturate(.58) blur(.15px);}
  42%{opacity:1;transform:translate3d(.28%,-.12%,0) scale(1.06);filter:sepia(.61) grayscale(.09) contrast(1.07) brightness(.82) saturate(.6) blur(.1px);}
  68%{opacity:1;transform:translate3d(-.24%,.14%,0) scale(1.085);filter:sepia(.59) grayscale(.085) contrast(1.09) brightness(.83) saturate(.61) blur(.08px);}
  100%{opacity:1;transform:translate3d(.08%,-.05%,0) scale(1.105);filter:sepia(.58) grayscale(.08) contrast(1.1) brightness(.84) saturate(.62) blur(.08px);}
}

@keyframes hugongBambooSepiaRetire{
  0%{opacity:1;transform:scale(1.105);filter:sepia(.58) grayscale(.08) contrast(1.1) brightness(.84) saturate(.62) blur(.08px);}
  100%{opacity:0;transform:scale(1.12);filter:sepia(.68) grayscale(.14) contrast(1.02) brightness(.64) saturate(.45) blur(.5px);}
}

@keyframes hugongBambooLivingReveal{
  0%{opacity:0;transform:translate3d(0,.2%,0) scale(1.015);filter:contrast(.96) brightness(.66) saturate(.68) blur(.9px);}
  18%{opacity:1;transform:translate3d(-.16%,.08%,0) scale(1.035);filter:contrast(1.02) brightness(.78) saturate(.78) blur(.18px);}
  44%{opacity:1;transform:translate3d(.24%,-.12%,0) scale(1.06);filter:contrast(1.045) brightness(.84) saturate(.86) blur(.1px);}
  72%{opacity:1;transform:translate3d(-.2%,.12%,0) scale(1.085);filter:contrast(1.06) brightness(.86) saturate(.9) blur(.08px);}
  100%{opacity:1;transform:translate3d(.08%,-.05%,0) scale(1.105);filter:contrast(1.07) brightness(.87) saturate(.92) blur(.08px);}
}

@keyframes hugongBambooReflection{
  from{opacity:0;}
  to{opacity:1;}
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"]:not(.is-hidden) ~ .architecture-story-hud.is-hugong-records-copy-out{
  animation:none !important;
  opacity:0;
  transform:translateY(8px);
  transition:opacity .5s ease,transform .5s ease;
}

/* View 14: a clean black impact beat before the Hugong evidence begins. */
body:not(.verticale-edition) #p3 .architecture-hugong-black-bang{
  overflow:hidden;
  isolation:isolate;
  background:#010201;
}

body:not(.verticale-edition) #p3 .architecture-hugong-black-bang::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  background:
    radial-gradient(ellipse at 50% 50%,rgba(105,190,18,.075),transparent 48%),
    linear-gradient(180deg,rgba(105,190,18,.025),transparent 32% 70%,rgba(105,190,18,.02));
  pointer-events:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-black-bang"]:not(.is-hidden) ~ .architecture-story-hud{
  display:none;
}

body:not(.verticale-edition) #p3 .architecture-hugong-files-stage{
  position:absolute;
  z-index:2;
  inset:0;
  overflow:hidden;
  color:#fff;
  text-align:left;
  text-shadow:none;
}

/* View 14 reuses the Leo-credit menu component verbatim; only its width grows
   enough to hold this longer record label. */
body:not(.verticale-edition) #p3 .architecture-hugong-files-menu{
  width:68%;
}

body:not(.verticale-edition) #p3 .architecture-hugong-files-menu-rule{
  background:linear-gradient(90deg,transparent,rgba(105,190,18,.7) 5% 8%,transparent 8% 76%,rgba(105,190,18,.7) 76% 95%,transparent);
}

body:not(.verticale-edition) #p3 .architecture-hugong-files-copy{
  position:absolute;
  top:31%;
  left:calc(12% + 24px);
  right:7%;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:13px;
  text-align:left;
  opacity:0;
  transform:translateY(24px);
}

body:not(.verticale-edition) #p3 .architecture-hugong-files-name{
  color:#69be12;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:19px;
  font-weight:700;
  line-height:1;
  letter-spacing:.18em;
  text-transform:uppercase;
}

body:not(.verticale-edition) #p3 .architecture-hugong-files-origin{
  display:block;
  margin-bottom:17px;
  color:#fff;
  font-family:'Archivo Black',sans-serif;
  font-size:clamp(22px,1.78vw,29px);
  font-weight:400;
  line-height:1;
  letter-spacing:-.018em;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 .architecture-hugong-files-thesis{
  display:block;
  color:#fff;
  font-family:'Archivo Black',sans-serif;
  font-size:clamp(22px,1.78vw,29px);
  font-weight:400;
  line-height:1;
  letter-spacing:-.018em;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 .architecture-hugong-files-proof{
  display:block;
  margin-top:10px;
  color:#69be12;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:19px;
  font-weight:700;
  line-height:1;
  letter-spacing:.08em;
  text-transform:uppercase;
}

body:not(.verticale-edition) #p3 .architecture-hugong-black-bang:not(.is-hidden) .architecture-hugong-files-menu-rule{
  animation:sipalayCreditsRule 1.3s cubic-bezier(.2,.72,.2,1) .18s both;
}

body:not(.verticale-edition) #p3 .architecture-hugong-black-bang:not(.is-hidden) .architecture-hugong-files-copy{
  animation:hugongFilesCopyIn .85s cubic-bezier(.2,.72,.2,1) .25s both;
}

@keyframes hugongFilesCopyIn{
  from{opacity:0;transform:translateY(24px);}
  to{opacity:1;transform:translateY(0);}
}

/* Remaining Architecture house rule: one left edge, one rhythm, no accidental
   third title line. Impact boards remain deliberate exceptions. */
body:not(.verticale-edition) #p3 [data-archi-house-lockup="true"]:not(.is-hidden) ~ .architecture-story-hud{
  left:28px;
  right:28px;
  bottom:29px;
  width:auto;
  max-width:none;
  align-items:flex-start;
  text-align:left;
  transform:none;
  gap:6px;
}

body:not(.verticale-edition) #p3 [data-archi-house-lockup="true"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker,
body:not(.verticale-edition) #p3 [data-archi-house-lockup="true"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title,
body:not(.verticale-edition) #p3 [data-archi-house-lockup="true"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body,
body:not(.verticale-edition) #p3 [data-archi-house-lockup="true"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-provenance{
  width:auto;
  margin-left:0;
  margin-right:0;
  text-align:left;
  text-align-last:left;
}

body:not(.verticale-edition) #p3 [data-archi-house-lockup="true"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker{
  margin-bottom:-6px;
  font-size:14pt;
  font-weight:700;
  line-height:1.12;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 [data-archi-house-lockup="true"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  max-width:none;
  font-size:30pt;
  line-height:1;
  white-space:nowrap;
  text-wrap:nowrap;
}

body:not(.verticale-edition) #p3 [data-archi-house-lockup="true"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body,
body:not(.verticale-edition) #p3 [data-archi-house-lockup="true"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-provenance{
  max-width:none;
  margin-top:0;
  font-size:16pt;
  line-height:1.15;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-bridge-question"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  font-size:23pt;
  line-height:1.04;
}

/* Architecture green voice: IBM Plex Bold everywhere narrative green appears.
   Instrument markings and measurement graphics retain their monospaced language. */
body:not(.verticale-edition) #p3 .architecture-story-hud .archi-story-kicker:not([hidden]),
body:not(.verticale-edition) #p3 .architecture-story-hud .archi-story-provenance:not([hidden]){
  font-family:'IBM Plex Sans',sans-serif !important;
  font-weight:700 !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker{
  margin-bottom:0;
  color:#69be12 !important;
  background-image:none !important;
  -webkit-background-clip:initial !important;
  background-clip:initial !important;
  -webkit-text-fill-color:#69be12 !important;
  font-family:'IBM Plex Sans',sans-serif !important;
  font-weight:700 !important;
  letter-spacing:.13em;
  transform:translateY(-1px);
  -webkit-text-stroke:.24px #69be12;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  max-width:none;
  font-size:24pt;
  white-space:nowrap;
  text-wrap:nowrap;
}

/* View 11: the same approved Horizontale lower-left story module. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v2"]:not(.is-hidden) ~ .architecture-story-hud{
  left:28px;
  right:28px;
  bottom:29px;
  width:auto;
  max-width:none;
  align-items:flex-start;
  text-align:left;
  transform:none;
  gap:6px;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v2"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v2"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  width:auto;
  margin-left:0;
  margin-right:0;
  text-align:left;
  text-align-last:left;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v2"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker{
  font-size:18pt;
  transform:translateY(2px);
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v2"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  max-width:none;
  font-size:25pt;
  line-height:1.03;
  white-space:nowrap;
  text-wrap:nowrap;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-measurements{
  position:absolute;
  z-index:3;
  inset:0;
  overflow:hidden;
  pointer-events:none;
  color:#92e83b;
  font-family:'DM Mono',monospace;
  transform:translateY(10px);
}

body:not(.verticale-edition) #p3 .architecture-sipalay-measure{
  position:absolute;
  height:52px;
  opacity:0;
  transform-origin:50% 50%;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-measure-length{
  top:calc(50% - 21px);
  left:10.5%;
  width:79%;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-measure-width{
  display:none;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-measure::before,
body:not(.verticale-edition) #p3 .architecture-sipalay-measure::after{
  content:none;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-measure::before{
  left:0;
  border-right:21px solid currentColor;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-measure::after{
  right:0;
  border-left:21px solid currentColor;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-measure-line{
  position:absolute;
  z-index:1;
  top:50%;
  left:8px;
  right:8px;
  height:17px;
  overflow:hidden;
  border:1px solid rgba(159,238,72,.96);
  border-radius:999px / 78%;
  background:linear-gradient(90deg,rgba(92,181,7,.68),rgba(145,231,53,.96) 50%,rgba(92,181,7,.68));
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.24) 3%,#000 10% 90%,rgba(0,0,0,.24) 97%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.24) 3%,#000 10% 90%,rgba(0,0,0,.24) 97%,transparent 100%);
  box-sizing:border-box;
  opacity:0;
  transform:translateY(-50%) scaleX(.18);
  transform-origin:50% 50%;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-measure-line::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,transparent,rgba(211,255,150,.48) 50%,transparent);
  opacity:0;
  animation:none;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-measure-value{
  position:absolute;
  z-index:3;
  top:50%;
  left:50%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  width:202px;
  height:50px;
  padding:0 24px;
  border:1px solid #52a004;
  border-radius:999px / 104px;
  background:linear-gradient(135deg,#52a004,rgba(82,160,4,.68));
  box-shadow:0 8px 0 rgba(82,160,4,.12),0 0 18px rgba(82,160,4,.12),inset 0 0 0 1px rgba(255,255,255,.16);
  box-sizing:border-box;
  color:#fff;
  line-height:1;
  white-space:nowrap;
  transform:translate(-50%,-50%);
  animation:none;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-measure-primary{
  position:absolute;
  top:50%;
  left:50%;
  font-size:28px;
  letter-spacing:.14em;
  opacity:1;
  transform:translate(-50%,-50%);
}

body:not(.verticale-edition) #p3 .architecture-sipalay-measure-equivalent{
  position:absolute;
  top:50%;
  left:50%;
  margin:0;
  color:rgba(255,255,255,.92);
  font-family:'IBM Plex Sans',sans-serif;
  font-weight:500;
  font-size:17pt;
  line-height:1;
  letter-spacing:.12em;
  text-transform:uppercase;
  opacity:0;
  transform:translate(-50%,-50%);
}

body:not(.verticale-edition) #p3 .architecture-sipalay-measure-plural{
  display:inline-block;
  margin-left:.04em;
  font-size:.8em;
  line-height:1;
  letter-spacing:0;
  text-transform:none;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-measure-plane{
  position:absolute;
  z-index:2;
  top:50%;
  left:50%;
  display:block;
  width:53px;
  height:53px;
  color:#fff;
  opacity:0;
  pointer-events:none;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-measure-plane svg{
  display:block;
  width:100%;
  height:100%;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-measure-value::before,
body:not(.verticale-edition) #p3 .architecture-sipalay-measure-value::after{
  content:'';
  position:absolute;
  top:50%;
  width:10px;
  height:5px;
  border:1px solid rgba(5,5,5,.42);
  border-radius:999px / 60%;
  opacity:.78;
  transform:translateY(-50%);
}

body:not(.verticale-edition) #p3 .architecture-sipalay-measure-value::before{
  left:8px;
}

body:not(.verticale-edition) #p3 .architecture-sipalay-measure-value::after{
  right:8px;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-origin"]:not(.is-hidden) .architecture-sipalay-measure-length{
  animation:archiSipalayMeasureArrive .48s ease-out 1.15s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-origin"]:not(.is-hidden) .architecture-sipalay-measure-length .architecture-sipalay-measure-line{
  animation:archiSipalayElasticOval 8.4s cubic-bezier(.2,.72,.2,1) 1.55s infinite;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-origin"]:not(.is-hidden) .architecture-sipalay-measure-plane-left{
  animation:archiSipalayPlaneLeft 8.4s cubic-bezier(.18,.76,.16,1) 1.55s infinite;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-origin"]:not(.is-hidden) .architecture-sipalay-measure-plane-right{
  animation:archiSipalayPlaneRight 8.4s cubic-bezier(.18,.76,.16,1) 1.55s infinite;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-origin"]:not(.is-hidden) .architecture-sipalay-measure-length .architecture-sipalay-measure-line::after{
  animation:archiSipalayElasticCurrent 8.4s ease 1.55s infinite;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-origin"]:not(.is-hidden) .architecture-sipalay-measure-length .architecture-sipalay-measure-value{
  animation:
    archiSipalayMainOvalSettle .5s cubic-bezier(.2,.72,.2,1.08) 1.15s both,
    archiSipalayMainDimensionCycle 8.4s ease 1.55s infinite;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-origin"]:not(.is-hidden) .architecture-sipalay-measure-primary{
  animation:archiSipalayPrimaryScaleCycle 8.4s ease 1.55s infinite;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-origin"]:not(.is-hidden) .architecture-sipalay-measure-equivalent{
  animation:archiSipalayEquivalentScaleCycle 8.4s ease 1.55s infinite;
}

@keyframes archiSipalayLakePush{
  from{
    object-position:50% 50%;
    transform:translate3d(0,0,0) scale(1);
  }
  to{
    object-position:50% 62%;
    transform:translate3d(12.24%,0,0) scale(1.44);
  }
}

@keyframes archiSipalayMeasureArrive{
  from{opacity:0;}
  to{opacity:1;}
}

@keyframes archiSipalayMainOvalSettle{
  from{opacity:0;transform:translate(-50%,-50%) scale(.92);}
  to{opacity:1;transform:translate(-50%,-50%) scale(1);}
}

@keyframes archiSipalayMainDimensionCycle{
  0%,50%{opacity:1;}
  58%,76%{opacity:0;}
  86%,100%{opacity:1;}
}

@keyframes archiSipalayPrimaryScaleCycle{
  0%,31%{opacity:1;transform:translate(-50%,-50%);}
  37%,84%{opacity:0;transform:translate(-50%,calc(-50% - 3px));}
  92%,100%{opacity:1;transform:translate(-50%,-50%);}
}

@keyframes archiSipalayEquivalentScaleCycle{
  0%,37%{opacity:0;transform:translate(-50%,calc(-50% + 2px));}
  42%,50%{opacity:1;transform:translate(-50%,-50%);}
  57%,100%{opacity:0;transform:translate(-50%,calc(-50% - 2px));}
}

@keyframes archiSipalayElasticOval{
  0%,4%{opacity:0;transform:translateY(-50%) scaleX(.18);}
  10%{opacity:.9;}
  28%{opacity:1;transform:translateY(-50%) scaleX(1);}
  35%{opacity:.94;transform:translateY(-50%) scaleX(1.035);}
  48%,100%{opacity:0;transform:translateY(-50%) scaleX(1.035);}
}

@keyframes archiSipalayPlaneLeft{
  0%,7%{opacity:0;left:calc(50% - 78px);transform:translate(-50%,-50%) rotate(-90deg) scale(.72);}
  13%{opacity:1;left:calc(50% - 92px);transform:translate(-50%,-50%) rotate(-90deg) scale(.88);}
  30%{opacity:1;left:0;transform:translate(-50%,-50%) rotate(-90deg) scale(1);}
  68%{opacity:1;left:0;transform:translate(-50%,-50%) rotate(-90deg) scale(1);}
  78%,100%{opacity:0;left:0;transform:translate(-50%,-50%) rotate(-90deg) scale(1);}
}

@keyframes archiSipalayPlaneRight{
  0%,7%{opacity:0;left:calc(50% + 78px);transform:translate(-50%,-50%) rotate(90deg) scale(.72);}
  13%{opacity:1;left:calc(50% + 92px);transform:translate(-50%,-50%) rotate(90deg) scale(.88);}
  30%{opacity:1;left:100%;transform:translate(-50%,-50%) rotate(90deg) scale(1);}
  68%{opacity:1;left:100%;transform:translate(-50%,-50%) rotate(90deg) scale(1);}
  78%,100%{opacity:0;left:100%;transform:translate(-50%,-50%) rotate(90deg) scale(1);}
}

@keyframes archiSipalayElasticCurrent{
  0%,5%{opacity:0;transform:scaleX(.12);}
  18%{opacity:.68;}
  40%{opacity:0;transform:scaleX(1);}
  100%{opacity:0;transform:scaleX(1);}
}

@keyframes archiSipalayValueFluoresce{
  0%,100%{color:#9fe64a;}
  48%{color:#c5fa79;}
  70%{color:#adef57;}
}

#p3 .golden-box > .architecture-story-scrim.archi-tone-light{
  background:linear-gradient(180deg,rgba(248,247,242,.03) 0 40%,rgba(248,247,242,.94) 100%);
}

#p3 .golden-box > .architecture-story-scrim.archi-tone-light.archi-copy-top{
  background:linear-gradient(180deg,rgba(248,247,242,.94) 0,rgba(248,247,242,.18) 62%,transparent 100%);
}

#p3 .golden-box > .architecture-story-hud{
  z-index:4;
}

#p3 .architecture-story-hud.archi-copy-top{
  top:clamp(32px,4vw,64px);
  bottom:auto;
}

#p3 .architecture-story-hud.archi-copy-right{
  left:auto;
  align-items:flex-end;
  text-align:right;
}

#p3 .architecture-story-hud.archi-copy-center{
  top:50%;
  bottom:auto;
  left:50%;
  right:auto;
  width:min(82%,900px);
  max-width:none;
  align-items:center;
  text-align:center;
  transform:translate(-50%,-50%);
}

#p3 .architecture-story-hud.archi-copy-wall{
  top:47%;
  bottom:auto;
  left:clamp(28px,4.3vw,70px);
  right:clamp(28px,4.3vw,70px);
  width:auto;
  max-width:min(86%,1120px);
  align-items:flex-start;
  text-align:left;
  transform:translateY(-50%);
}

#p3 .architecture-story-hud.is-entering{
  animation:archiStoryCopyIn .72s cubic-bezier(.2,.72,.2,1) .05s both;
}

#p3 .architecture-story-hud.archi-copy-center.is-entering{
  animation:archiStoryCopyCenterIn .72s cubic-bezier(.2,.72,.2,1) .05s both;
}

#p3 .architecture-story-hud.archi-copy-wall.is-entering{
  animation:archiStoryWallIn .82s cubic-bezier(.18,.76,.18,1) .04s both;
}

@keyframes archiStoryWallIn{
  from{opacity:0;transform:translateY(calc(-50% + 16px));filter:blur(1px);}
  to{opacity:1;transform:translateY(-50%);filter:blur(0);}
}

#p3 .architecture-story-hud.archi-tone-light .archi-story-title,
#p3 .architecture-story-hud.archi-tone-light .archi-story-body{
  color:#071015;
}

#p3 .architecture-story-hud.archi-tone-light .archi-story-provenance{
  color:#3e780d;
}

#p3 .architecture-mining-copy,
#p3 .architecture-sipalay-copy{
  display:none !important;
}

@media(max-width:600px) and (orientation:portrait){
  body.verticale-edition #p3 .architecture-draft-overture .architecture-overture-lead{
    font-size:20px;
  }

  body.verticale-edition #p3 .architecture-draft-overture .architecture-overture-rhythm{
    font-size:13px;
  }

  body.verticale-edition #p3 .architecture-draft-overture .architecture-overture-question{
    font-size:20px;
  }

  body.verticale-edition #p3 .archi-story-copy{
    left:18px;
    right:18px;
    bottom:20px;
    max-width:calc(100% - 36px);
    gap:6px;
  }

  body.verticale-edition #p3 .golden-box > .architecture-story-scrim{
    inset:14px 8px 2px;
    background:linear-gradient(180deg,rgba(2,7,8,.02) 0 34%,rgba(2,7,8,.9) 100%);
  }

  body.verticale-edition #p3 .golden-box > .architecture-story-scrim.archi-copy-top{
    background:linear-gradient(180deg,rgba(2,7,8,.9) 0,rgba(2,7,8,.26) 62%,transparent 100%);
  }

  body.verticale-edition #p3 .golden-box > .architecture-story-scrim.archi-tone-light{
    background:linear-gradient(180deg,rgba(248,247,242,.03) 0 36%,rgba(248,247,242,.95) 100%);
  }

  body.verticale-edition #p3 .architecture-story-hud.archi-copy-top{
    top:22px;
    bottom:auto;
  }

  body.verticale-edition #p3 .architecture-story-hud.archi-copy-center{
    top:50%;
    left:50%;
    right:auto;
    width:calc(100% - 36px);
  }

  body.verticale-edition #p3 .architecture-story-hud.archi-copy-wall{
    top:50%;
    bottom:auto;
    left:18px;
    right:18px;
    width:auto;
    max-width:calc(100% - 36px);
    transform:translateY(-50%);
  }

  body.verticale-edition #p3 .archi-copy-top .archi-story-copy{
    top:20px;
    bottom:auto;
  }

  body.verticale-edition #p3 .archi-copy-center .archi-story-copy{
    top:50%;
    left:50%;
    right:auto;
    width:calc(100% - 36px);
    max-width:none;
  }

  body.verticale-edition #p3 .archi-story-kicker{
    font-size:12px;
    letter-spacing:.12em;
  }

  body.verticale-edition #p3 .archi-story-title{
    max-width:16ch;
    font-size:22px;
    line-height:1;
  }

  body.verticale-edition #p3 .archi-story-title.archi-story-title-long{
    max-width:22ch;
    font-size:18px;
    line-height:1.04;
  }

  body.verticale-edition #p3 .archi-story-title.archi-story-title-hero{
    max-width:none;
    font-size:52px;
  }

  body.verticale-edition #p3 .archi-story-title.archi-story-title-wall{
    max-width:14ch;
    font-size:40px;
    line-height:.95;
  }

  body.verticale-edition #p3 .archi-story-body{
    max-width:34ch;
    font-size:13px;
    line-height:1.16;
  }

  body.verticale-edition #p3 .archi-copy-wall .archi-story-body{
    max-width:28ch;
    font-size:18px;
    line-height:1.08;
  }

  body.verticale-edition #p3 .archi-story-provenance{
    max-width:38ch;
    font-size:13px;
    line-height:1.2;
  }

  body.verticale-edition #p3 .archi-story-cue{
    min-height:20px;
    padding:3px 7px;
    font-size:8px;
  }

  body.verticale-edition #p3 .archi-story-slide::after{
    background:linear-gradient(180deg,rgba(2,7,8,.05) 0 34%,rgba(2,7,8,.9) 100%);
  }

  body.verticale-edition #p3 .archi-story-slide.archi-copy-top::after{
    background:linear-gradient(180deg,rgba(2,7,8,.9) 0,rgba(2,7,8,.28) 62%,rgba(2,7,8,.04) 100%);
  }

  body.verticale-edition #p3 .archi-story-slide.archi-tone-light::after{
    background:linear-gradient(180deg,rgba(247,246,240,.03) 0 38%,rgba(247,246,240,.94) 100%);
  }

  body.verticale-edition #p3 .archi-story-slide.archi-story-contain > .archi-story-image{
    padding:10px;
  }

  body.verticale-edition #p3 .archi-placeholder-wolf .archi-placeholder-mark{
    top:14%;
    right:8%;
    font-size:76px;
  }

  body.verticale-edition #p3 .archi-placeholder-droplet .archi-droplet{
    width:140px;
  }
}

@media(prefers-reduced-motion:reduce){
  #p3 .archi-story-slide:not(.is-hidden) .archi-story-copy{
    animation:none;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"]:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-reel-copy-entering .archi-story-kicker,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"]:not(.is-hidden) ~ .architecture-story-hud.is-sipalay-reel-copy-entering .archi-story-title{
    opacity:1;
    transform:none;
    clip-path:none;
    filter:none;
    animation:none;
  }

  #p3 .architecture-story-hud .archi-story-kicker,
  #p3 .architecture-story-hud .archi-story-provenance,
  body:not(.verticale-edition) #p3 .architecture-story-hud.archi-copy-wall .archi-story-body{
    background-image:none;
    -webkit-text-fill-color:currentColor;
    animation:none;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"] .architecture-callout{
    opacity:1;
    transform:none;
    animation:none !important;
  }

  body:not(.verticale-edition) #p3 .archi-copy-wall .archi-mineral-window-nickel::after,
  body:not(.verticale-edition) #p3 .archi-copy-wall .archi-mineral-window-copper::after{
    opacity:0;
    animation:none;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"].is-opening-reel-playing .architecture-opening-reel-frame{
    opacity:0;
    transform:none;
    filter:none;
    animation:none !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"].is-opening-reel-playing .architecture-opening-reel-frame-barren{
    opacity:1;
  }

  body:not(.verticale-edition) #p3 .architecture-sipalay-credits-board .architecture-sipalay-credits-rule{
    opacity:1;
    transform:scaleX(1);
    animation:none;
  }

  body:not(.verticale-edition) #p3 .architecture-sipalay-credits-board .architecture-sipalay-credits-backdrop{
    opacity:.14;
    transform:none;
    animation:none;
  }

  body:not(.verticale-edition) #p3 .architecture-sipalay-credits-board .architecture-sipalay-credit{
    position:relative;
    top:auto;
    left:auto;
    right:auto;
    margin:0 auto 18px;
    opacity:1;
    transform:none;
    filter:none;
    animation:none;
  }

  body:not(.verticale-edition) #p3 .architecture-sipalay-credits-stage{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:72px 8% 26px;
  }

  body:not(.verticale-edition) #p3 .architecture-sipalay-credits-eyebrow{
    top:8.5%;
  }

  body:not(.verticale-edition) #p3 .architecture-sipalay-record-menu{
    top:auto;
    bottom:55px;
    left:32px;
    right:32px;
    margin:0;
    transform:none;
  }
}

/*
  ARCHITECTURE — BE CAUSE RULED STOMP / 2026-09-07
  The ordinary Architecture story frames now borrow BE CAUSE's complete
  caption grammar: one white phrase-kicker, one white Archivo title, one
  white IBM Plex supporting thought, and one shared lower-left floor.
  Black record boards, diagram plates and the final impact cards remain
  deliberate exceptions until they are art-directed individually.
*/
@media (min-width:901px){
  body:not(.verticale-edition) #p3{
    --archi-because-left:32px;
    --archi-because-title-size:40px;
    --archi-because-title-bottom:84px;
    --archi-because-support-size:18pt;
    --archi-because-support-gap:8px;
    --archi-because-kicker-size:22pt;
    --archi-because-kicker-gap:10px;
  }

  body:not(.verticale-edition) #p3 [data-archi-be-cause-rule="true"]:not(.is-hidden) ~ .architecture-story-hud{
    top:0 !important;
    left:var(--archi-because-left) !important;
    right:var(--archi-because-left) !important;
    bottom:var(--archi-because-title-bottom) !important;
    width:auto !important;
    height:auto !important;
    max-width:none !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:flex-end !important;
    align-items:flex-start !important;
    gap:var(--archi-because-kicker-gap) !important;
    overflow:visible !important;
    text-align:left !important;
    text-align-last:left !important;
    transform:none !important;
  }

  body:not(.verticale-edition) #p3 [data-archi-be-cause-rule="true"]:not(.is-hidden) ~ .architecture-story-hud.is-entering{
    animation:archiBecauseRuleArrival 1.3s cubic-bezier(.16,.78,.22,1) 40ms both !important;
  }

  body:not(.verticale-edition) #p3 [data-archi-be-cause-rule="true"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker:not([hidden]){
    position:static !important;
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    height:auto !important;
    margin:0 !important;
    padding:0 !important;
    color:#fff !important;
    background:none !important;
    -webkit-background-clip:initial !important;
    background-clip:initial !important;
    -webkit-text-fill-color:#fff !important;
    -webkit-text-stroke:0 !important;
    font-family:'IBM Plex Sans',sans-serif !important;
    font-size:var(--archi-because-kicker-size) !important;
    font-weight:700 !important;
    font-style:normal !important;
    line-height:1.15 !important;
    letter-spacing:.01em !important;
    text-transform:none !important;
    white-space:normal !important;
    text-wrap:wrap !important;
    text-align:left !important;
    text-align-last:left !important;
    text-shadow:none !important;
    transform:none !important;
    filter:none !important;
    animation:none !important;
  }

  body:not(.verticale-edition) #p3 [data-archi-be-cause-rule="true"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
    position:static !important;
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    height:auto !important;
    margin:0 !important;
    padding:0 !important;
    color:#fff !important;
    font-family:'Archivo Black',sans-serif !important;
    font-size:var(--archi-because-title-size) !important;
    font-weight:400 !important;
    font-style:normal !important;
    line-height:1 !important;
    letter-spacing:0 !important;
    white-space:normal !important;
    text-wrap:wrap !important;
    text-align:left !important;
    text-align-last:left !important;
    text-shadow:none !important;
    transform:none !important;
    filter:none !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker .archi-kicker-regular{
    font-weight:400 !important;
  }

  /* Mining scene 01 declaration: two stacked lines, one firm block. */
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-origin"]:not(.is-hidden) ~ .architecture-story-hud{
    gap:4px !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-origin"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker:not([hidden]){
    font-size:28pt !important;
    line-height:1.12 !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-origin"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
    font-size:52px !important;
    line-height:1 !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v16"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
    font-size:45px !important;
  }

  body:not(.verticale-edition) #p3 [data-archi-be-cause-rule="true"]:not(.is-hidden) ~ .architecture-story-hud :is(.archi-story-body,.archi-story-provenance):not([hidden]){
    position:absolute !important;
    top:calc(100% + var(--archi-because-support-gap)) !important;
    left:0 !important;
    right:0 !important;
    bottom:auto !important;
    display:block !important;
    width:auto !important;
    max-width:100% !important;
    height:auto !important;
    margin:0 !important;
    padding:0 !important;
    color:#fff !important;
    background:none !important;
    -webkit-background-clip:initial !important;
    background-clip:initial !important;
    -webkit-text-fill-color:#fff !important;
    font-family:'IBM Plex Sans',sans-serif !important;
    font-size:var(--archi-because-support-size) !important;
    font-weight:400 !important;
    font-style:normal !important;
    line-height:1.18 !important;
    letter-spacing:.01em !important;
    text-transform:none !important;
    white-space:normal !important;
    text-wrap:wrap !important;
    text-align:left !important;
    text-align-last:left !important;
    text-shadow:none !important;
    transform:none !important;
    filter:none !important;
    animation:none !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body:not([hidden]){
    font-size:21pt !important;
    line-height:1.18 !important;
  }

  /* Retire the former independent title treatments on frames now ruled by
     the shared caption system. Their content is carried by the HUD above. */
  body:not(.verticale-edition) #p3 [data-archi-be-cause-rule="true"] :is(
    .architecture-mining-copy,
    .architecture-sipalay-copy,
    .architecture-hugong-origin-saucer-copy
  ){
    display:none !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-prologue"][data-archi-be-cause-rule="true"] .architecture-sipalay-ring-label{
    display:none !important;
  }

  /* The standing Architecture writ speaks in the same human voice now.
     Green remains cockpit language; the narrative is pure white. */
  body:not(.verticale-edition) #p3 .architecture-draft-overture :is(
    .architecture-overture-question,
    .architecture-overture-lead,
    .architecture-overture-rhythm,
    .architecture-overture-rhythm-line,
    .architecture-overture-resolve
  ){
    max-width:100% !important;
    color:#fff !important;
    background:none !important;
    -webkit-background-clip:initial !important;
    background-clip:initial !important;
    -webkit-text-fill-color:#fff !important;
    font-family:'IBM Plex Sans',sans-serif !important;
    letter-spacing:0 !important;
    word-spacing:normal !important;
    text-transform:none !important;
    white-space:normal !important;
    text-wrap:pretty !important;
    text-align:left !important;
    text-align-last:left !important;
    filter:none !important;
    animation:none !important;
  }

  body:not(.verticale-edition) #p3 .architecture-draft-overture .architecture-overture-question{
    margin:0 0 22px !important;
    font-size:22pt !important;
    font-weight:700 !important;
    line-height:1.18 !important;
  }

  body:not(.verticale-edition) #p3 .architecture-draft-overture .architecture-overture-lead{
    margin:0 0 28px !important;
    font-size:18pt !important;
    font-weight:400 !important;
    line-height:1.38 !important;
  }

  body:not(.verticale-edition) #p3 .architecture-draft-overture .architecture-overture-rhythm{
    margin:0 !important;
    font-size:18pt !important;
    font-weight:400 !important;
    line-height:1.38 !important;
  }

  body:not(.verticale-edition) #p3 .architecture-overture-rhythm-line,
  body:not(.verticale-edition) #p3 .architecture-overture-resolve{
    display:inline !important;
    margin:0 !important;
  }
}

@keyframes archiBecauseRuleArrival{
  from{
    opacity:0;
    transform:translate3d(-28px,6px,0);
    filter:blur(2px);
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
    filter:blur(0);
  }
}

@media (prefers-reduced-motion:reduce){
  body:not(.verticale-edition) #p3 [data-archi-be-cause-rule="true"]:not(.is-hidden) ~ .architecture-story-hud.is-entering{
    animation:none !important;
    opacity:1;
    transform:none !important;
    filter:none;
  }
}

/* Architecture 00 withholds the question until the evidence has finished.
   The wide mined coast lands first; only then do the three caption lines
   arrive, one clear thought at a time. */
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"].is-opening-reel-playing:not(.is-hidden) ~ .architecture-story-hud.is-entering{
  opacity:1 !important;
  transform:none !important;
  filter:none !important;
  animation:none !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"].is-opening-reel-playing:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker:not([hidden]){
  opacity:0;
  animation:archiOpeningHudLineIn .58s cubic-bezier(.18,.76,.18,1) 20.05s both !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"].is-opening-reel-playing:not(.is-hidden) ~ .architecture-story-hud .archi-story-title:not([hidden]){
  opacity:0;
  animation:archiOpeningHudLineIn .62s cubic-bezier(.18,.76,.18,1) 20.45s both !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"].is-opening-reel-playing:not(.is-hidden) ~ .architecture-story-hud .archi-story-body:not([hidden]){
  opacity:0;
  animation:archiOpeningHudLineIn .62s cubic-bezier(.18,.76,.18,1) 20.85s both !important;
}

@keyframes archiOpeningHudLineIn{
  from{opacity:0;transform:translate3d(0,10px,0);filter:blur(1px);}
  to{opacity:1;transform:translate3d(0,0,0);filter:blur(0);}
}

@media (prefers-reduced-motion:reduce){
  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"].is-opening-reel-playing:not(.is-hidden) ~ .architecture-story-hud :is(
    .archi-story-kicker,
    .archi-story-title,
    .archi-story-body
  ){
    opacity:1 !important;
    transform:none !important;
    filter:none !important;
    animation:none !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"].is-opening-reel-playing .architecture-opening-reel-breath{
    opacity:0;
    animation:none !important;
  }
}

/* Architecture HERO writ — the standing discipline, expressed as one
   centered sequence with distinct pauses between distinct thoughts. */
#p3 .architecture-hero-writ-title{
  max-width:100%;
  text-align:center;
  text-align-last:center;
  text-wrap:wrap;
}

#p3 .architecture-hero-writ{
  display:flex;
  flex-direction:column;
  align-items:center;
  width:100%;
  color:rgba(255,255,255,.82);
  font-family:'IBM Plex Sans',sans-serif;
  text-align:center;
  text-align-last:center;
}

#p3 .architecture-hero-writ-group{
  width:100%;
}

#p3 .architecture-hero-writ-column{
  display:contents;
}

#p3 .architecture-hero-writ p{
  width:100%;
  margin:0;
  font-weight:400;
  letter-spacing:0;
  word-spacing:normal;
  text-align:center;
  text-align-last:center;
  text-wrap:pretty;
}

#p3 .architecture-hero-writ p + p{
  margin-top:2px;
}

#p3 .architecture-hero-writ strong{
  color:#fff;
  font-weight:400;
}

#p3 .architecture-hero-writ-declaration{
  color:#fff;
  font-family:'IBM Plex Sans',sans-serif;
  font-weight:400;
  line-height:1.33;
}

#p3 .architecture-hero-writ-declaration strong{
  font-weight:400;
}

#p3 .architecture-hero-writ-emphasis,
#p3 .architecture-hero-writ-emphasis strong{
  font-weight:700;
}

#p3 .architecture-hero-writ-emphasis .architecture-hero-writ-support{
  font-weight:400;
  margin-left:0;
}

#p3 .architecture-hero-writ-emphasis .architecture-hero-writ-resolution{
  margin-left:0;
}

#p3 .architecture-hero-writ-emphasis .architecture-hero-writ-distill{
  margin-left:0;
}

#p3 .architecture-hero-writ-no-break{
  white-space:nowrap;
}

#p3 .architecture-hero-writ-conclusion strong{
  display:inline;
  font-weight:700;
}

body:not(.verticale-edition) #p3 .architecture-hero-writ-conclusion strong{
  letter-spacing:-.012em;
}

#p3 .architecture-hero-writ .architecture-hero-writ-vehicle{
  font-weight:700;
}

body:not(.verticale-edition) #p3 .architecture-hero-writ-title{
  max-width:100% !important;
  margin-bottom:14px !important;
  font-size:clamp(27px,7.15cqw,36px) !important;
  line-height:1.04 !important;
  letter-spacing:-.018em !important;
  text-wrap:nowrap !important;
}

body:not(.verticale-edition) #p3 .architecture-hero-writ-title + .divider{
  margin:11px 0 15px;
}

body:not(.verticale-edition) #p3 .architecture-hero-writ{
  display:flex;
  flex:1 1 auto;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-height:0;
  gap:clamp(10px,3.4cqw,18px);
  margin-top:4px;
  position:relative;
  left:8px;
  font-size:20pt;
  font-weight:400;
  line-height:1.38;
  text-align:center;
  text-align-last:center;
}

body:not(.verticale-edition) #p3 .architecture-hero-writ-column{
  display:contents;
}

body:not(.verticale-edition) #p3 .architecture-hero-writ p{
  font-family:'IBM Plex Sans',sans-serif;
  font-size:20pt;
  font-weight:400;
  text-align:center;
  text-align-last:center;
}

body:not(.verticale-edition) #p3 .architecture-hero-writ p.architecture-hero-writ-conduct{
  font-size:20pt;
}

body:not(.verticale-edition) #p3 .architecture-hero-writ p.architecture-hero-writ-conduct strong{
  font-weight:700;
}

body:not(.verticale-edition) #p3 .architecture-hero-writ-relationships-materials{
  margin-bottom:4px;
}

body:not(.verticale-edition) #p3 .architecture-hero-writ p + p{
  margin-top:5px;
}

/* Architecture writ, opening pair: one connected question in the familiar
   Banatti headline voice, centered on the shared vertical spine. */
body:not(.verticale-edition) #p3 .architecture-hero-writ-column:first-child .architecture-hero-writ-group:first-child p{
  font-family:'Archivo Black',sans-serif;
  font-size:32pt;
  font-weight:400;
  line-height:1.04;
  letter-spacing:-.012em;
  word-spacing:normal;
  text-transform:uppercase;
  text-align:center;
  text-align-last:center;
}

body:not(.verticale-edition) #p3 .architecture-hero-writ-column:first-child .architecture-hero-writ-group:first-child p:first-child{
  font-size:32pt;
}

body:not(.verticale-edition) #p3 .architecture-hero-writ-column:first-child .architecture-hero-writ-group:first-child p + p{
  margin-top:18px;
  margin-left:15.2px;
  width:calc(100% - 15.2px);
  text-align:left;
  text-align-last:left;
}

body:not(.verticale-edition) #p3 .architecture-hero-writ-column:first-child .architecture-hero-writ-group:first-child p,
body:not(.verticale-edition) #p3 .architecture-hero-writ-column:first-child .architecture-hero-writ-group:first-child p strong{
  color:#58a90a;
}

body:not(.verticale-edition) #p3 > .two-col > .col-left > .section-label{
  position:relative;
  top:-15px;
  left:18px;
}

body:not(.verticale-edition) #p3 .architecture-hero-writ-declaration{
  font-size:20pt;
  font-family:'IBM Plex Sans',sans-serif;
  font-weight:400;
  line-height:1.38;
  text-align:center;
  text-align-last:center;
}

@media (min-width:861px) and (max-height:1020px){
  body:not(.verticale-edition) #p3 .architecture-hero-writ-title{
    margin-bottom:7px !important;
    font-size:27px !important;
  }

  body:not(.verticale-edition) #p3 .architecture-hero-writ-title + .divider{
    margin:5px 0 8px;
  }

  body:not(.verticale-edition) #p3 .architecture-hero-writ{
    gap:6px;
    font-size:13.5px;
    line-height:1.28;
  }

  body:not(.verticale-edition) #p3 .architecture-hero-writ-declaration{
    font-size:14px;
  }
}

body.verticale-edition #p3 .architecture-hero-writ-title{
  max-width:100% !important;
  margin-bottom:12px !important;
  font-size:clamp(28px,8vw,36px) !important;
  line-height:1.04 !important;
  letter-spacing:-.018em !important;
  text-wrap:wrap !important;
}

body.verticale-edition #p3 .architecture-hero-writ-title + .divider{
  margin:10px 0 16px;
}

body.verticale-edition #p3 .architecture-hero-writ{
  gap:17px;
  padding-bottom:22px;
  font-size:16px;
  line-height:1.38;
}

body.verticale-edition #p3 .architecture-hero-writ-declaration{
  font-size:16px;
}

@media (min-width:861px) and (max-height:820px){
  body:not(.verticale-edition) #p3 .architecture-hero-writ-title{
    margin-bottom:5px !important;
    font-size:24px !important;
  }

  body:not(.verticale-edition) #p3 .architecture-hero-writ-title + .divider{
    margin:4px 0 7px;
  }

  body:not(.verticale-edition) #p3 .architecture-hero-writ{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    align-items:start;
    gap:0 18px;
    font-size:12.5px;
    line-height:1.24;
  }

  body:not(.verticale-edition) #p3 .architecture-hero-writ-column{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:5px;
    min-width:0;
  }

  body:not(.verticale-edition) #p3 .architecture-hero-writ-declaration{
    font-size:13px;
  }
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"] .architecture-callout-stage{
  z-index:5;
  opacity:1;
  transform:translateY(-1%) scale(1.045);
  transform-origin:50% 0;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"] .architecture-callout-base-image{
  opacity:0;
  will-change:opacity,filter;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"].is-growth-reel-playing .architecture-callout-base-image{
  animation:archiGrowthCalloutPlateIn 1.55s cubic-bezier(.18,.72,.2,1) 20.65s both;
}

/* The red REEL signal may finish, but the completed place remains landed. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"].is-growth-reel-settled .architecture-callout-base-image{
  opacity:1;
  filter:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"].is-growth-reel-playing .architecture-callout{
  animation-name:archiGrowthCalloutIn,archiGrowthCalloutOut !important;
  animation-duration:.56s,.9s !important;
  animation-timing-function:cubic-bezier(.18,.74,.2,1),cubic-bezier(.4,0,.2,1) !important;
  animation-fill-mode:both,forwards !important;
  animation-iteration-count:1,1 !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"].is-growth-reel-playing .architecture-callout-lev{animation-delay:6.45s,20.35s !important;}
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"].is-growth-reel-playing .architecture-callout-water{animation-delay:8.15s,20.35s !important;}
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"].is-growth-reel-playing .architecture-callout-factories{animation-delay:13.75s,20.35s !important;}
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"].is-growth-reel-playing .architecture-callout-cultural{animation-delay:15.05s,20.35s !important;}
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"].is-growth-reel-playing .architecture-callout-community{animation-delay:16.35s,20.35s !important;}

@media (min-width:901px){
body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
    font-size:50px !important;
    line-height:1.04 !important;
  }
}

@keyframes archiGrowthCalloutIn{
  from{opacity:0;transform:translateY(3px);}
  to{opacity:1;transform:translateY(0);}
}

@keyframes archiGrowthCalloutOut{
  from{opacity:1;}
  to{opacity:0;}
}

@keyframes archiGrowthCalloutPlateIn{
  from{opacity:0;filter:brightness(.9) saturate(.9);}
  to{opacity:1;filter:brightness(1) saturate(1);}
}

@media (prefers-reduced-motion:reduce){
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"] .architecture-growth-frame{
    opacity:0;
    transform:none;
    filter:none;
    animation:none !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"] .architecture-growth-frame-grow{
    opacity:0;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"] .architecture-growth-beat{
    opacity:0;
    animation:none !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"] .architecture-callout-stage,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"]:not(.is-hidden) ~ .architecture-story-hud.is-entering{
    opacity:1;
    transform:none;
    animation:none !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"] .architecture-callout-base-image,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"] .architecture-callout{
    opacity:1;
    animation:none !important;
  }
}

/* Scene 09 is the Sipalay grounding plate: place first, magnitude second. */
@media (min-width:901px){
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-origin"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker:not([hidden]){
    font-size:26pt !important;
    line-height:1.12 !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-origin"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body:not([hidden]){
    line-height:1.28 !important;
  }
}

/* Scene 09 scale reveal — the green 1.8 KM proof lands first. The 747 line
   is timed by renderArchitectureStory so a replay resets the same sequence. */

/* Architecture title continuity — the opening question and the Scene 03
   culmination each arrive once, then remain landed when the red reel light
   returns to green. This removes the one-frame preview and the second blink. */
@media (min-width:901px){
  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"]:not(.is-opening-reel-playing):not(.is-opening-reel-settled):not(.is-hidden) ~ .architecture-story-hud.is-entering,
  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"]:not(.is-growth-reel-playing):not(.is-growth-reel-settled):not(.is-hidden) ~ .architecture-story-hud.is-entering{
    opacity:0 !important;
    transform:none !important;
    filter:none !important;
    animation:none !important;
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"].is-opening-reel-settled:not(.is-hidden) ~ .architecture-story-hud.is-entering,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"].is-growth-reel-settled:not(.is-hidden) ~ .architecture-story-hud.is-entering{
    opacity:1 !important;
    transform:none !important;
    filter:none !important;
    animation:none !important;
  }
}

/* Architecture support voice — every under-line lands at the same readable
   22pt measure while the question wall keeps its approved declaration scale. */
@media (min-width:901px){
  body:not(.verticale-edition) #p3 .architecture-story-hud:not(.archi-copy-wall) :is(.archi-story-body,.archi-story-provenance):not([hidden]){
    font-size:22pt !important;
    line-height:1.28 !important;
  }

  /* Scene 08 proof line — the added depth measure gets +3pt without moving
     the established title rule, left edge, or lower anchor. */
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-origin"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body:not([hidden]){
    font-size:23pt !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-origin"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title:not([hidden]){
    font-size:31pt !important;
  }

  /* A11 tagline — give the four-beat line more air and presence while its
     top edge stays pinned beneath the title. */
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body:not([hidden]){
    font-size:22pt !important;
    line-height:1.28 !important;
    white-space:pre !important;
    word-spacing:normal !important;
  }
}

/* Scene 06 cinema pass — the proposed system returns to the real ground.
   The title waits for that return so it reads as a responsibility, not a
   caption placed over the spectacle. */
@media (min-width:901px){
  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]{
    overflow:hidden;
    isolation:isolate;
    background:#080b09;
    animation:none !important;
    transform:none !important;
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"] .architecture-v10-image{
    position:absolute;
    inset:0;
    display:block;
    width:100%;
    height:100%;
    max-width:none;
    object-fit:cover;
    backface-visibility:hidden;
    will-change:opacity,transform,filter;
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"] .architecture-v10-image-loops{
    z-index:0;
    opacity:0;
    object-position:50% 50%;
    transform-origin:0 100%;
    transform:translate3d(0,0,0) scale(1.15);
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"] .architecture-v10-image-reimagined{
    z-index:1;
    opacity:0;
    object-position:50% 50%;
    transform-origin:50% 68%;
    transform:translate3d(0,2%,0) scale(1.28);
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"] .architecture-v10-image-barren{
    z-index:2;
    opacity:0;
    object-position:50% 50%;
    transform-origin:50% 50%;
    transform:translate3d(0,0,0) scale(1.08);
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"] .architecture-v10-image-ore{
    z-index:3;
    opacity:0;
    object-position:50% 50%;
    transform-origin:50% 50%;
    transform:translate3d(0,0,0) scale(1.02);
    filter:saturate(.55) brightness(.72) contrast(1.04);
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"] .architecture-v10-route-map{
    z-index:3;
    opacity:0;
    transform-origin:0 100%;
    transform:translate3d(0,0,0) scale(1.15);
    animation:none;
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden):not(.is-architecture-passive-reel-playing) .architecture-v10-image-barren{
    opacity:1;
    transform:translate3d(0,0,0) scale(1.08);
  }

  /* Prime the opening loop before the rebuilt reel releases its first frame.
     This keeps the panel from exposing its black ground during a replay reset. */
  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-scene05-image-primed:not(.is-hidden) .architecture-v10-image-loops{
    opacity:1 !important;
    transform:translate3d(0,0,0) scale(1.15) !important;
    filter:none !important;
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-scene05-image-primed:not(.is-hidden) .architecture-v10-image-reimagined,
  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-scene05-image-primed:not(.is-hidden) .architecture-v10-image-barren,
  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-scene05-image-primed:not(.is-hidden) .architecture-v10-image-ore,
  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-scene05-image-primed:not(.is-hidden) .architecture-v10-route-map{
    opacity:0 !important;
    animation:none !important;
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing .architecture-v10-image-loops{
    animation:archiV10LoopsToCoast 15s cubic-bezier(.45,0,.55,1) both;
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing .architecture-v10-image-reimagined{
    animation:archiV10ReimaginedReturn 15s cubic-bezier(.45,0,.55,1) both;
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing .architecture-v10-image-barren{
    animation:archiV10BarrenReturn 15s cubic-bezier(.45,0,.55,1) both;
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing .architecture-v10-route-map{
    animation:archiV10RouteMatch 15s linear both;
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing .architecture-v10-route-map .architecture-v7-ring-line{
    animation:archiV7RingLine 8s ease-in-out .3s infinite;
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing .architecture-v10-route-map .architecture-v7-ring-blip{
    animation:archiV7RingBlip 8s linear .3s infinite;
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing .architecture-v10-route-map .architecture-v7-surge-line{
    animation:archiV7Surge 8s cubic-bezier(.2,.72,.18,1) .3s infinite;
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing .architecture-v10-route-map .architecture-v7-return-line{
    animation:archiV7ReturnSweep 8s linear .3s infinite;
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing .architecture-v10-route-map .architecture-v7-return-line-late{
    animation-delay:.38s;
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing .architecture-v10-route-map .architecture-v7-contact-pulse{
    animation:archiV7ContactPulse 8s ease-out .3s infinite;
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing .architecture-v10-route-map .architecture-v7-junction-oval-community{
    animation:archiV7CommunityOval 8s ease-out .3s infinite;
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing .architecture-v10-route-map .architecture-v7-junction-oval-port{
    animation:archiV7PortOval 8s ease-in-out .3s infinite;
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud.is-entering{
    opacity:1 !important;
    transform:none !important;
    filter:none !important;
    animation:none !important;
  }

}

@keyframes archiV10LoopsToCoast{
  0%,10%{opacity:1;transform:translate3d(0,0,0) scale(1.15);filter:saturate(1) brightness(1);}
  25%{opacity:1;transform:translate3d(0,-.25%,0) scale(1.2);filter:saturate(1.03) brightness(1.01);}
  34%{opacity:1;transform:translate3d(0,-.7%,0) scale(1.27);filter:saturate(1.06) brightness(1.02);}
  42%{opacity:1;transform:translate3d(0,-.85%,0) scale(1.27);filter:saturate(1.06) brightness(1.02);}
  50%{opacity:.72;transform:translate3d(0,-.85%,0) scale(1.27);filter:saturate(1.04) brightness(1.01);}
  56%,100%{opacity:0;transform:translate3d(0,-.85%,0) scale(1.27);filter:saturate(1) brightness(1);}
}

@keyframes archiV10ReimaginedReturn{
  0%,22%{opacity:0;transform:translate3d(0,2%,0) scale(1.28);filter:saturate(.9) brightness(.84);}
  28%{opacity:.14;transform:translate3d(0,1.6%,0) scale(1.26);filter:saturate(.93) brightness(.9);}
  36%{opacity:.56;transform:translate3d(0,1%,0) scale(1.21);filter:saturate(.97) brightness(.96);}
  45%{opacity:.95;transform:translate3d(0,.35%,0) scale(1.15);filter:saturate(1) brightness(1);}
  53.333%{opacity:1;transform:translate3d(0,0,0) scale(1.08);filter:saturate(1.02) brightness(1.01);}
  59%{opacity:1;transform:translate3d(0,0,0) scale(1.08);filter:saturate(1.02) brightness(1.01);}
  69%,100%{opacity:0;transform:translate3d(0,0,0) scale(1.08);filter:saturate(1) brightness(1);}
}

@keyframes archiV10BarrenReturn{
  0%,59%{opacity:0;transform:translate3d(0,0,0) scale(1.08);filter:saturate(.98) brightness(.94);}
  60%{opacity:.08;transform:translate3d(0,0,0) scale(1.06);filter:saturate(.99) brightness(.96);}
  64%{opacity:.38;transform:translate3d(0,0,0) scale(1.05);filter:saturate(1) brightness(.98);}
  69%{opacity:1;transform:translate3d(0,0,0) scale(1.035);filter:saturate(1.02) brightness(1);}
  100%{opacity:1;transform:translate3d(0,0,0) scale(1.035);filter:saturate(1) brightness(1);}
}

@keyframes archiV10RouteMatch{
  0%,12%{opacity:1;transform:translate3d(0,0,0) scale(1.15);}
  25%{opacity:1;transform:translate3d(0,-.25%,0) scale(1.2);}
  35%{opacity:.74;transform:translate3d(0,-.7%,0) scale(1.27);}
  44%{opacity:.25;transform:translate3d(0,-.85%,0) scale(1.27);}
  52%,100%{opacity:0;transform:translate3d(0,-.85%,0) scale(1.27);}
}

@media (prefers-reduced-motion:reduce){
  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"] .architecture-v10-image-loops,
  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"] .architecture-v10-image-reimagined{
    opacity:0 !important;
    animation:none !important;
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"] .architecture-v10-image-barren{
    opacity:1 !important;
    transform:translate3d(0,0,0) scale(1.08) !important;
    animation:none !important;
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"] .architecture-v10-route-map{
    display:none;
    animation:none !important;
  }

  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
    opacity:1 !important;
    transform:none !important;
    filter:none !important;
    animation:none !important;
  }
}

/* Final Hugong precedence: the living wolf opens, then the record and bamboo
   evidence arrive in the same held frame. */
body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-wolf-image{
  position:absolute;
  z-index:1;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:50% 50%;
  transform-origin:50% 50%;
  opacity:1;
  filter:brightness(.78) contrast(1.06) saturate(.82);
  will-change:transform,filter;
  animation:hugongQuestionWolfPush 10.2s cubic-bezier(.18,.72,.2,1) both;
}

/* Hugong question mini-reel: a held wolf, a precise muzzle glint, and small
   reflections returned by the water. These remain inside this held frame. */
body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-focus{
  position:absolute;
  z-index:3;
  inset:0;
  pointer-events:none;
  opacity:0;
  isolation:isolate;
  animation:hugongQuestionFocusShadow 8.1s ease-in-out -.4s both;
}

body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-focus::before,
body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-focus::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
}

body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-focus::before{
  background:radial-gradient(ellipse 17% 22% at 62% 37%,transparent 0 34%,rgba(0,0,0,.12) 49%,rgba(0,0,0,.54) 82%,rgba(0,0,0,.7) 100%);
  mix-blend-mode:multiply;
}

body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-focus::after{
  background:radial-gradient(ellipse 8% 10% at 62% 37%,rgba(255,245,204,.16) 0,rgba(255,239,177,.06) 38%,transparent 76%);
  mix-blend-mode:screen;
  filter:blur(1px);
}

body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-eye-catch{
  position:absolute;
  z-index:7;
  left:60%;
  top:36%;
  width:.6%;
  height:.9%;
  pointer-events:none;
  opacity:0;
  mix-blend-mode:screen;
  background:radial-gradient(ellipse at 50% 50%,rgba(255,253,223,.42) 0 7%,rgba(255,241,176,.08) 25%,transparent 72%);
  filter:blur(.12px);
  animation:hugongQuestionEyeCatch 8.1s ease-in-out -.4s both;
}

body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-muzzle-glint,
body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-water-glint{
  position:absolute;
  pointer-events:none;
  opacity:0;
  mix-blend-mode:screen;
}

body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-muzzle-glint{
  z-index:6;
  left:61.5%;
  top:44%;
  width:4.2%;
  height:3.2%;
  background:radial-gradient(ellipse at 53% 58%,rgba(255,255,248,1) 0 4%,rgba(255,248,207,.88) 11%,rgba(255,224,144,.28) 31%,transparent 70%);
  filter:blur(.18px);
  box-shadow:0 0 4px rgba(255,246,190,.12);
  transform:scale(.35) rotate(-10deg);
  animation:hugongQuestionMuzzleBling 8.1s ease-in-out -.4s both;
}

body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-muzzle-glint::before,
body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-muzzle-glint::after{
  display:none;
}

body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-water-glint{
  z-index:5;
  left:22%;
  right:30%;
  top:calc(57% + 50px);
  height:23%;
  background:
    radial-gradient(ellipse at 24% 48%,rgba(255,248,206,.7) 0 1.8%,transparent 8%),
    radial-gradient(ellipse at 52% 63%,rgba(255,245,190,.54) 0 1.7%,transparent 8%),
    radial-gradient(ellipse at 78% 37%,rgba(255,249,208,.58) 0 1.8%,transparent 9%);
  filter:blur(.2px);
  transform-origin:50% 56%;
  animation:hugongQuestionWaterGlint 8.1s ease-out -.4s both;
}

body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-water-glint::before,
body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-water-glint::after{
  content:"";
  position:absolute;
  pointer-events:none;
}

body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-water-glint::before{
  left:10%;
  right:24%;
  top:23%;
  height:22%;
  background:repeating-linear-gradient(171deg,transparent 0 13px,rgba(255,248,207,.24) 14px 16px,transparent 17px 34px);
  mask-image:linear-gradient(90deg,transparent 0%,#000 30% 70%,transparent 100%);
}

body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-water-glint::after{
  left:38%;
  top:54%;
  width:24%;
  height:8%;
  background:linear-gradient(171deg,transparent 0 40%,rgba(255,244,184,.3) 49% 56%,transparent 68%);
  filter:blur(.4px);
}

@keyframes hugongQuestionMuzzleBling{
  0%,38%{opacity:0;transform:scale(.35) rotate(-10deg);}
  41%{opacity:.01;transform:scale(.62) rotate(-10deg);}
  44%{opacity:.155;transform:scale(1.02) rotate(-10deg);}
  47%{opacity:.026;transform:scale(.72) rotate(-10deg);}
  52%,100%{opacity:0;transform:scale(.42) rotate(-10deg);}
}

@keyframes hugongQuestionEyeCatch{
  0%,39%{opacity:0;transform:scale(.55);}
  42%{opacity:.025;transform:scale(.8);}
  44%{opacity:.02;transform:scale(1.02);}
  47%{opacity:.006;transform:scale(.82);}
  52%,100%{opacity:0;transform:scale(.6);}
}

@keyframes hugongQuestionWaterGlint{
  0%,47%{opacity:0;transform:translate3d(-150px,4px,0) scaleX(.88);}
  56%{opacity:.1;transform:translate3d(-150px,1px,0) scaleX(.95);}
  68%{opacity:.4;transform:translate3d(-150px,0,0) scaleX(1);}
  80%{opacity:.17;transform:translate3d(-150px,-1px,0) scaleX(1.03);}
  100%{opacity:0;transform:translate3d(-150px,-3px,0) scaleX(1.08);}
}

@keyframes hugongQuestionWolfPush{
  0%{transform:translate3d(3%,0,0) scale(1.02);filter:blur(.28px) brightness(.84) contrast(1.12) saturate(.82);}
  38%{transform:translate3d(4%,-1%,0) scale(1.08);filter:blur(.12px) brightness(.9) contrast(1.15) saturate(.85);}
  74%{transform:translate3d(5%,-2%,0) scale(1.18);filter:blur(.03px) brightness(.96) contrast(1.19) saturate(.885);}
  100%{transform:translate3d(6%,-3%,0) scale(1.27);filter:blur(0) brightness(.98) contrast(1.2) saturate(.9);}
}

@keyframes hugongQuestionFocusShadow{
  0%,23%{opacity:0;}
  30%{opacity:.08;}
  38%{opacity:.18;}
  45%{opacity:.27;}
  54%{opacity:.13;}
  64%,100%{opacity:0;}
}

@keyframes hugongQuestionFirstPhase{
  0%,12%{opacity:0;transform:translateY(10px);}
  22%,100%{opacity:1;transform:translateY(0);}
}

@keyframes hugongQuestionCopyArrival{
  0%{opacity:0;transform:translate3d(0,12px,0);}
  100%{opacity:1;transform:translate3d(0,0,0);}
}

body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-files-stage{
  z-index:4;
  background:linear-gradient(180deg,transparent 0%,transparent 56%,rgba(0,0,0,.12) 71%,rgba(0,0,0,.68) 100%);
}

body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-files-menu,
body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-files-menu-rule,
body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-files-name{
  display:none;
}

body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-files-copy{
  left:32px;
  right:34%;
  bottom:84px;
  gap:0;
  opacity:1;
  transform:none;
  text-shadow:none;
  animation:hugongQuestionCopyArrival .9s cubic-bezier(.2,.72,.2,1) .45s both;
}

body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-files-origin{
  max-width:100%;
  color:#fff;
  font-size:40px;
  line-height:1.18;
  white-space:normal;
  text-wrap:wrap;
  text-transform:none;
}

body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-phase-one{
  display:block;
}

body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-phase-one{
  animation:hugongQuestionFirstPhase 3.1s cubic-bezier(.2,.72,.2,1) .6s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-wolf-image{
  z-index:0;
  opacity:1;
  /* Keep the base image on the same continuous push as the aperture image. */
  animation:hugongQuestionWolfPush 10.2s cubic-bezier(.18,.72,.2,1) both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-puzzle-phase :is(
  .architecture-hugong-wolf-image,
  .architecture-hugong-question-wolf-image
){
  animation:hugongQuestionWolfPush 10.2s cubic-bezier(.18,.72,.2,1) both !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-records-phase .architecture-hugong-wolf-image{
  animation:hugongWolfRetire 1.1s ease both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-records-phase .architecture-hugong-records-image{
  animation:hugongRecordsReveal 2.1s cubic-bezier(.2,.72,.2,1) both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-bamboo-phase .architecture-hugong-records-image{
  animation:hugongRecordsFade 2.1s ease both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-bamboo-phase .architecture-hugong-bamboo-image{
  animation:hugongBambooWindReveal 6.8s cubic-bezier(.18,.68,.22,1) both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-missing-phase:not(.is-hidden) ~ .architecture-story-hud .archi-story-title,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-name-phase:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  font-size:clamp(23px,2.25vw,36px);
  line-height:1.04;
  white-space:normal;
  text-wrap:balance;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-origin"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  max-width:calc(100% - 56px);
  font-size:clamp(23px,2.35vw,38px);
  line-height:1.04;
  white-space:normal;
  text-wrap:balance;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-origin"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  max-width:calc(100% - 56px);
  white-space:normal;
}

body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-files-copy{
  top:auto;
  left:32px;
  bottom:84px;
  right:34%;
  gap:0;
}

body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-files-origin{
  max-width:100%;
  margin-bottom:0;
  font-size:40px;
  line-height:1.18;
  white-space:normal;
  text-wrap:wrap;
  text-transform:none;
}

/* September 14, 2026 — give intentional title stacks a little air while
   preserving the established left-justified 40px voice. */
body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-phase-both > strong,
body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-phase-both > span,
body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-phase-name > strong,
body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-phase-name > span,
body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-phase-hugong > strong,
body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-phase-hugong > span,
body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-phase-now > strong{
  line-height:1.18;
}

body:not(.verticale-edition) #p3 .architecture-hugong-question-bang :is(
  .architecture-hugong-question-phase-both,
  .architecture-hugong-question-phase-name,
  .architecture-hugong-question-phase-hugong
) > strong{
  margin-bottom:7px;
}

body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-files-thesis,
body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-files-proof{
  display:none;
}

@media (prefers-reduced-motion:reduce){
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-wolf-image,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-records-image,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-bamboo-image,
  body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-files-copy,
  body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-question-focus{
    animation:none !important;
  }

  body:not(.verticale-edition) #p3 .architecture-hugong-question-bang :is(
    .architecture-hugong-question-focus,
    .architecture-hugong-question-eye-catch,
    .architecture-hugong-question-muzzle-glint,
    .architecture-hugong-question-water-glint
  ){
    animation:none !important;
    opacity:0 !important;
  }
}

/* September 14, 2026 — evidence frame and present-day river time-lapse. */
body:not(.verticale-edition) #p3 .architecture-hugong-question-bang .architecture-hugong-killed-wolves-image{
  object-fit:cover;
  object-position:50% 100%;
  transform:scale(1.015);
  filter:sepia(.48) grayscale(.06) contrast(1.04) brightness(.92) saturate(.66);
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-files-stage{
  z-index:8;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-files-copy{
  z-index:9;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-records-meta{
  position:absolute;
  z-index:10;
  left:auto;
  right:32px;
  max-width:42%;
  bottom:18%;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  justify-content:space-between;
  gap:7px;
  color:#fff;
  text-align:right;
  text-shadow:none;
  opacity:0;
  transform:translateY(10px);
  pointer-events:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-records-meta > span{
  font-family:'IBM Plex Sans',sans-serif;
  font-size:14px;
  font-weight:700;
  letter-spacing:.16em;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-records-meta > strong{
  font-family:'Archivo Black',sans-serif;
  font-size:22px;
  line-height:1;
  letter-spacing:.04em;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-killed-wolves-phase .architecture-hugong-records-meta{
  animation:hugongRecordsMetaIn 1s cubic-bezier(.2,.72,.2,1) .25s both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-river-evidence-phase .architecture-hugong-records-meta,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-time-lapse-phase .architecture-hugong-records-meta{
  animation:hugongRecordsMetaOut 1.2s ease both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-time-lapse-image{
  position:absolute;
  z-index:6;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:50% 50%;
  opacity:0;
  transform:scale(1.012);
  filter:brightness(.76) contrast(1.04) saturate(.78);
  will-change:opacity,transform,filter;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-time-lapse-phase .architecture-hugong-time-lapse-present{
  animation:hugongTimeLapsePresentIn 2s cubic-bezier(.18,.72,.2,1) both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-time-lapse-urban-phase .architecture-hugong-time-lapse-present{
  animation:hugongTimeLapseFade 2s ease both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-time-lapse-urban-phase .architecture-hugong-time-lapse-transition{
  animation:hugongTimeLapseTransitionIn 2s cubic-bezier(.18,.72,.2,1) both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-time-lapse-final-phase .architecture-hugong-time-lapse-transition{
  animation:hugongTimeLapseFade 2s ease both;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-time-lapse-final-phase .architecture-hugong-time-lapse-lush{
  animation:hugongTimeLapseLushIn 2s cubic-bezier(.18,.72,.2,1) both;
}

/* September 14, 2026 — after the three present-day missing beats, return to the sepia source. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-sepia-return-phase .architecture-hugong-time-lapse-image{
  animation:hugongTimeLapseFade 2.4s ease both !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-sepia-return-phase .architecture-hugong-bamboo-image{
  z-index:7;
  animation:hugongSepiaReturnReveal 2.8s cubic-bezier(.18,.68,.22,1) both !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] :is(
  .architecture-hugong-question-phase-now
) > strong{
  display:block;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-question-phase-now > span{
  display:block;
  margin-top:5px;
}

@keyframes hugongRecordsMetaIn{
  from{opacity:0;transform:translateY(10px);}
  to{opacity:1;transform:translateY(0);}
}

@keyframes hugongRecordsMetaOut{
  from{opacity:1;transform:translateY(0);}
  to{opacity:0;transform:translateY(-8px);}
}

@keyframes hugongTimeLapseLushIn{
  0%{opacity:0;transform:scale(1.026);filter:brightness(.56) contrast(.98) saturate(.62) blur(1px);}
  50%{opacity:1;transform:scale(1.018);filter:brightness(.7) contrast(1.02) saturate(.72) blur(.24px);}
  100%{opacity:1;transform:scale(1.012);filter:brightness(.78) contrast(1.05) saturate(.82) blur(0);}
}

@keyframes hugongTimeLapseTransitionIn{
  0%{opacity:0;transform:scale(1.026);filter:brightness(.54) contrast(.98) saturate(.58) blur(1px);}
  52%{opacity:1;transform:scale(1.018);filter:brightness(.68) contrast(1.02) saturate(.7) blur(.22px);}
  100%{opacity:1;transform:scale(1.012);filter:brightness(.76) contrast(1.05) saturate(.78) blur(0);}
}

@keyframes hugongTimeLapsePresentIn{
  0%{opacity:0;transform:scale(1.026);filter:brightness(.5) contrast(.98) saturate(.56) blur(1px);}
  52%{opacity:1;transform:scale(1.018);filter:brightness(.66) contrast(1.03) saturate(.68) blur(.2px);}
  100%{opacity:1;transform:scale(1.012);filter:brightness(.74) contrast(1.07) saturate(.76) blur(0);}
}

@keyframes hugongTimeLapseFade{
  from{opacity:1;transform:scale(1.012);}
  to{opacity:0;transform:scale(1.026);filter:brightness(.56) contrast(.98) saturate(.6) blur(.7px);}
}

@media (prefers-reduced-motion:reduce){
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-killed-wolves-image,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-time-lapse-image,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-records-meta{
    animation:none !important;
    transition:none !important;
  }
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"] .architecture-hugong-killed-wolves-image{
    opacity:1;
  }
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-time-lapse-phase .architecture-hugong-time-lapse-present,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-time-lapse-urban-phase .architecture-hugong-time-lapse-transition,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-time-lapse-final-phase .architecture-hugong-time-lapse-lush{
    opacity:1;
  }
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-sepia-return-phase .architecture-hugong-time-lapse-image{
    opacity:0;
  }
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-sepia-return-phase .architecture-hugong-bamboo-image{
    opacity:1;
  }
}

/* September 14, 2026 — temporary black rehearsal field for the replacement
   Hugong images. Keep the original files and the narrative rail; remove only
   the current picture surfaces until the new image set is supplied. */
body:not(.verticale-edition) #p3 [data-hugong-image-hold="black"]{
  background:#000 !important;
  background-image:none !important;
}

body:not(.verticale-edition) #p3 [data-hugong-image-hold="black"] :is(
  img,
  video,
  svg,
  figure,
  .architecture-hugong-origin-crop
){
  opacity:0 !important;
  visibility:hidden !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-origin"][data-hugong-image-hold="black"] ~ .architecture-story-hud{
  left:28px;
  right:28px;
  bottom:28px;
  width:auto;
  max-width:none;
  align-items:flex-start;
  gap:0;
  text-align:left;
  transform:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-origin"][data-hugong-image-hold="black"] ~ .architecture-story-hud :is(
  .archi-story-kicker,
  .archi-story-body,
  .archi-story-provenance,
  .archi-story-cue
){
  display:none !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-origin"][data-hugong-image-hold="black"] ~ .architecture-story-hud .archi-story-title{
  width:auto;
  max-width:calc(100% - 56px);
  margin:0;
  color:#fff;
  font-size:clamp(28px,2.5vw,40px);
  line-height:1.18;
  white-space:normal;
  text-align:left;
  text-align-last:left;
  text-wrap:balance;
}

/* September 15, 2026 — Scene 15 tagline beats.
   The Helios river-city frame and its established title arrive as one BANG.
   The two new IBM Plex thoughts then enter from their own anchors, preserving
   the lower-left title floor and the natural word flow. */
body:not(.verticale-edition) #p3 [data-hugong-scene-bang="true"]{
  box-sizing:border-box;
  padding:0 !important;
  overflow:hidden;
  isolation:isolate;
  background:#070609;
}

body:not(.verticale-edition) #p3 [data-hugong-scene-bang="true"]:not(.is-hidden){
  animation:hugongScene15PanelBang .78s cubic-bezier(.16,.78,.22,1) both !important;
}

body:not(.verticale-edition) #p3 [data-hugong-scene-bang="true"] .architecture-hugong-scene-17-image{
  position:absolute;
  inset:0;
  z-index:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:50% 50%;
}

body:not(.verticale-edition) #p3 [data-hugong-scene-bang="true"] .architecture-hugong-scene-17-pulse-copy{
  position:absolute;
  inset:0;
  z-index:5;
  pointer-events:none;
}

body:not(.verticale-edition) #p3 [data-hugong-scene-bang="true"] .architecture-hugong-scene-17-topline,
body:not(.verticale-edition) #p3 [data-hugong-scene-bang="true"] .architecture-hugong-scene-17-bottomline{
  position:absolute;
  left:32px;
  right:32px;
  display:block;
  color:#fff;
  font-family:'IBM Plex Sans',sans-serif;
  font-style:normal;
  text-align:left;
  text-shadow:none;
  opacity:0;
  animation-name:hugongScene15TaglineIn;
  animation-duration:.68s;
  animation-timing-function:cubic-bezier(.2,.72,.2,1);
  animation-fill-mode:both;
}

body:not(.verticale-edition) #p3 [data-hugong-scene-bang="true"] .architecture-hugong-scene-17-topline{
  top:28px;
  max-width:min(72%,32ch);
  font-size:clamp(18px,1.7vw,27px);
  font-weight:600;
  line-height:1.2;
  letter-spacing:.015em;
  animation-delay:.92s;
}

body:not(.verticale-edition) #p3 [data-hugong-scene-bang="true"] .architecture-hugong-scene-17-bottomline{
  bottom:24px;
  max-width:min(84%,46ch);
  font-size:clamp(16px,1.32vw,21px);
  font-weight:400;
  line-height:1.32;
  letter-spacing:.005em;
  animation-delay:2.08s;
}

body:not(.verticale-edition) #p3 [data-hugong-scene-bang="true"][data-archi-be-cause-rule="true"]:not(.is-hidden) ~ .architecture-story-hud.is-entering{
  animation:hugongScene15TitleBang .72s cubic-bezier(.16,.78,.22,1) 20ms both !important;
}

@keyframes hugongScene15PanelBang{
  0%{opacity:0;filter:brightness(.78) saturate(.92);}
  62%{opacity:1;filter:brightness(1.04) saturate(1.02);}
  100%{opacity:1;filter:brightness(1) saturate(1);}
}

@keyframes hugongScene15TitleBang{
  0%{opacity:0;transform:translate3d(0,12px,0) scale(.985);filter:blur(1.4px);}
  68%{opacity:1;transform:translate3d(0,-2px,0) scale(1.006);filter:blur(0);}
  100%{opacity:1;transform:translate3d(0,0,0) scale(1);filter:blur(0);}
}

@keyframes hugongScene15TaglineIn{
  0%{opacity:0;transform:translate3d(0,9px,0);filter:blur(1px);}
  100%{opacity:1;transform:translate3d(0,0,0);filter:blur(0);}
}

@media (prefers-reduced-motion:reduce){
  body:not(.verticale-edition) #p3 [data-hugong-scene-bang="true"]:not(.is-hidden),
  body:not(.verticale-edition) #p3 [data-hugong-scene-bang="true"] .architecture-hugong-scene-17-topline,
  body:not(.verticale-edition) #p3 [data-hugong-scene-bang="true"] .architecture-hugong-scene-17-bottomline,
  body:not(.verticale-edition) #p3 [data-hugong-scene-bang="true"][data-archi-be-cause-rule="true"]:not(.is-hidden) ~ .architecture-story-hud.is-entering{
    animation:none !important;
    opacity:1 !important;
    transform:none !important;
    filter:none !important;
  }
}

/* September 15, 2026 — put the Scene 15 proposition back into the ruled
   caption position: IBM Plex immediately above the Archivo title. The lower
   engineering thought stays one clean line with natural word spacing. */
body:not(.verticale-edition) #p3 [data-hugong-scene-bang="true"][data-archi-be-cause-rule="true"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-kicker:not([hidden]){
  animation:hugongScene15TaglineIn .68s cubic-bezier(.2,.72,.2,1) .92s both !important;
  opacity:0;
}

body:not(.verticale-edition) #p3 [data-hugong-scene-bang="true"] .architecture-hugong-scene-17-topline{
  display:none !important;
}

body:not(.verticale-edition) #p3 [data-hugong-scene-bang="true"] .architecture-hugong-scene-17-bottomline{
  max-width:none;
  white-space:nowrap;
  font-size:clamp(13px,1.05vw,17px);
  line-height:1.24;
  letter-spacing:0;
}

/* September 15, 2026 — 16B riverfront plan, tightened to the living ground. */
body:not(.verticale-edition) #p3 [data-hugong-map-plate]{
  box-sizing:border-box;
  padding:0 !important;
  overflow:hidden;
  isolation:isolate;
  background:#111;
}

body:not(.verticale-edition) #p3 [data-hugong-map-plate] .architecture-hugong-map-image{
  position:absolute;
  inset:0;
  z-index:0;
  display:block;
  box-sizing:border-box;
  width:100%;
  height:100%;
  max-width:none;
  padding:clamp(10px,1.5vw,24px);
  object-fit:contain;
  object-position:50% 50%;
  background:#f4f1e8;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-image{
  padding:0;
  object-fit:cover;
  object-position:50% 50%;
  inset:0;
  height:100%;
  transform:translate(-10px, 20px) scale(1.2);
  transform-origin:0 100%;
  background:#111;
}

/* September 15, 2026 — carry the Sipalay callout grammar into Hugong.
   The language stays short, local, structural, and readable at reduction. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-stage{
  position:absolute;
  z-index:3;
  inset:0;
  overflow:hidden;
  pointer-events:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-lines{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  overflow:visible;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-line{
  fill:none;
  stroke:#55c900;
  stroke-width:.34;
  vector-effect:non-scaling-stroke;
  stroke-linecap:round;
  stroke-linejoin:round;
  opacity:0;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-node{
  fill:#fff;
  stroke:#55c900;
  stroke-width:.34;
  vector-effect:non-scaling-stroke;
  opacity:0;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout{
  position:absolute;
  z-index:1;
  display:block;
  margin:0;
  color:#fff;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:18pt;
  font-weight:500;
  line-height:1.18;
  letter-spacing:.005em;
  text-align:left;
  text-transform:uppercase;
  text-shadow:none;
  opacity:0;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout strong,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout small{
  display:block;
  margin:0;
  color:#fff;
  font:inherit;
  font-weight:700;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout small{
  margin-bottom:.18em;
  color:#55c900;
  font-size:.72em;
  letter-spacing:.12em;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-locale{
  box-sizing:border-box;
  isolation:isolate;
  top:calc(44% - 100px);
  left:calc(70% + 90px);
  width:34%;
  max-width:none;
  padding:clamp(8px,.8vw,12px) clamp(14px,1.8vw,26px) clamp(8px,.9vw,13px);
  border:0;
  border-top:3px solid rgba(247,196,0,.98);
  border-left:3px solid rgba(247,196,0,.98);
  border-bottom:3px solid rgba(247,196,0,.98);
  border-radius:46% 0 0 46% / 28% 0 0 28%;
  background:linear-gradient(90deg,rgba(247,196,0,.8) 0%,rgba(247,196,0,.45) 48%,rgba(247,196,0,.2) 78%,transparent 100%);
  background-repeat:no-repeat;
  background-size:100% 100%;
  font-size:16pt;
  color:rgba(255,255,255,.96);
  text-align:left;
}

body:not(.verticale-edition) #p3 .architecture-hugong-map-callout-center{
  top:calc(46% - 200px);
  left:calc(23% + 60px);
  width:46%;
  max-width:none;
}

body:not(.verticale-edition) #p3 .architecture-hugong-map-callout-base{
  top:45%;
  left:61%;
  max-width:27%;
}

body:not(.verticale-edition) #p3 .architecture-hugong-map-callout-riverwalk{
  top:calc(59% - 30px);
  left:calc(50% + 35px);
  z-index:4;
  box-sizing:border-box;
  isolation:isolate;
  width:max-content;
  max-width:none;
  padding:.2em .72em .24em;
  border:0;
  border-radius:0;
  background:transparent;
  color:rgba(255,255,255,.98);
  font-size:12pt;
  font-weight:700;
  text-align:center;
  white-space:nowrap;
  opacity:1;
  transform:translateX(-50%);
}

body:not(.verticale-edition) #p3 .architecture-hugong-map-callout-riverwalk::before{
  content:'';
  position:absolute;
  z-index:-1;
  top:0;
  right:2.5%;
  bottom:0;
  left:2.5%;
  box-sizing:border-box;
  border:2px solid rgba(247,196,0,.98);
  border-radius:999px;
  background:rgba(247,196,0,.7);
  pointer-events:none;
}

body:not(.verticale-edition) #p3 .architecture-hugong-map-callout-system{
  top:14%;
  left:20%;
  max-width:32%;
  color:#9be95b;
  font-weight:700;
}

/* 15A revision: the center callout borrows Sipalay's labelled growth grammar,
   recoloured to the map's warm yellow and turned into one rooted clump. */
body:not(.verticale-edition) #p3 .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled{
  box-sizing:border-box;
  isolation:isolate;
  padding:clamp(9px,1.05vw,16px) clamp(20px,2.8vw,42px) clamp(11px,1.35vw,20px);
  border:0;
  border-top:3px solid rgba(247,196,0,.98);
  border-left:3px solid rgba(247,196,0,.98);
  border-right:3px solid rgba(247,196,0,.98);
  border-bottom:0;
  border-radius:46% 46% 0 0 / 28% 28% 0 0;
  background:linear-gradient(180deg,rgba(247,196,0,.78) 0%,rgba(247,196,0,.38) 45%,rgba(247,196,0,.1) 78%,transparent 100%);
  background-repeat:no-repeat;
  background-size:100% 100%;
  color:rgba(255,248,207,.98);
  text-align:center;
  text-shadow:none;
}

body:not(.verticale-edition) #p3 .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled::after{
  content:'';
  position:absolute;
  z-index:-1;
  left:6%;
  right:6%;
  top:calc(100% - 3px);
  height:clamp(62px,7.5vw,116px);
  border-radius:12% 12% 48% 48% / 14% 14% 70% 70%;
  background:
    linear-gradient(180deg,rgba(247,196,0,.42) 0%,rgba(247,196,0,.2) 42%,transparent 100%);
  filter:blur(2px);
  opacity:.78;
  transform:scaleY(.28);
  transform-origin:50% 0;
  pointer-events:none;
}

body:not(.verticale-edition) #p3 .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled strong,
body:not(.verticale-edition) #p3 .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled small{
  display:block;
  margin:0;
  font:inherit;
  font-weight:700;
  line-height:1.04;
  text-align:center;
}

body:not(.verticale-edition) #p3 .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled small{
  margin-top:.42em;
  color:rgba(255,255,255,.98);
  font-size:16pt;
  letter-spacing:.08em;
}

body:not(.verticale-edition) #p3 .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled strong{
  font-size:21pt;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-locale strong,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-locale small{
  color:rgba(255,255,255,.96);
  font-weight:700;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-locale strong{
  display:block;
  font-size:1em;
  line-height:1.08;
  letter-spacing:.06em;
  white-space:nowrap;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-locale small{
  margin-top:.14em;
  font-size:13.5pt;
  line-height:1.06;
  letter-spacing:.08em;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-locale .architecture-hugong-map-callout-rockwell{
  position:relative;
  left:0;
  font-size:16.5pt;
  text-align:left;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-locale .architecture-hugong-map-callout-distance{
  position:relative;
  left:0;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-arrow{
  color:#fff;
  position:absolute;
  top:10px;
  left:50%;
  font-size:1.71em;
  font-weight:700;
  transform:translateX(-50%);
}

body:not(.verticale-edition) #p3 .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled::before,
body:not(.verticale-edition) #p3 .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled::after{
  content:'';
  position:absolute;
  z-index:-1;
  top:100%;
  width:3px;
  height:120px;
  border:0;
  border-radius:0;
  background:linear-gradient(180deg,rgba(247,196,0,.98),rgba(247,196,0,.68) 66%,rgba(247,196,0,.12) 100%);
  filter:none;
  opacity:.96;
  transform-origin:50% 0;
  transform:none;
  pointer-events:none;
}

body:not(.verticale-edition) #p3 .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled::before{
  left:-3px;
  right:auto;
}

body:not(.verticale-edition) #p3 .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled::after{
  left:auto;
  right:-3px;
}

@keyframes hugongMapRiverwalkIn{
  from{opacity:0;transform:translate(-50%,10px);filter:blur(1px);}
  to{opacity:1;transform:translate(-50%,0);filter:blur(0);}
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"]:not(.is-hidden) .architecture-hugong-map-callout-riverwalk{
  animation:hugongMapRiverwalkIn .56s cubic-bezier(.2,.72,.2,1) 1.8s both !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] ~ .architecture-story-hud .archi-story-body{
  font-weight:700 !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"][data-archi-be-cause-rule="true"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body:not([hidden]){
  font-family:'IBM Plex Sans',sans-serif !important;
  font-weight:700 !important;
}

/* The Grove arrow and the other future callout decisions stay parked for the
   next pass; 15A currently carries only the requested centered labels. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-base,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-system,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-line-locale,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-node-locale,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-line-center,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-node-center,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-line-base,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-node-base,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-line-riverwalk,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-node-riverwalk,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-line-system,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-node-system{
  display:none !important;
  animation:none !important;
}

@keyframes hugongMapCalloutIn{
  from{opacity:0;transform:translateY(10px);filter:blur(1px);}
  to{opacity:1;transform:translateY(0);filter:blur(0);}
}

@keyframes hugongMapCalloutLineIn{
  from{opacity:0;stroke-dashoffset:18;}
  to{opacity:1;stroke-dashoffset:0;}
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"]:not(.is-hidden) .architecture-hugong-map-callout-locale{
  animation:hugongMapCalloutIn .56s cubic-bezier(.2,.72,.2,1) .48s both;
}
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"]:not(.is-hidden) .architecture-hugong-map-callout-center{
  animation:hugongMapCalloutIn .56s cubic-bezier(.2,.72,.2,1) .92s both;
}
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"]:not(.is-hidden) .architecture-hugong-map-callout-base{
  animation:hugongMapCalloutIn .56s cubic-bezier(.2,.72,.2,1) 1.36s both;
}
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"]:not(.is-hidden) .architecture-hugong-map-callout-riverwalk{
  animation:hugongMapCalloutIn .56s cubic-bezier(.2,.72,.2,1) 1.8s both;
}
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"]:not(.is-hidden) .architecture-hugong-map-callout-system{
  animation:hugongMapCalloutIn .56s cubic-bezier(.2,.72,.2,1) 2.24s both;
}

body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-manual [data-panel-id="architecture-hugong-map-16b"]:not(.is-hidden) .architecture-hugong-map-callout{
  opacity:1 !important;
  visibility:visible !important;
  animation:none !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"]:not(.is-hidden) .architecture-hugong-map-callout-line-locale,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"]:not(.is-hidden) .architecture-hugong-map-callout-node-locale{
  animation:hugongMapCalloutLineIn .56s ease .48s both;
}
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"]:not(.is-hidden) .architecture-hugong-map-callout-line-center,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"]:not(.is-hidden) .architecture-hugong-map-callout-node-center{
  animation:hugongMapCalloutLineIn .56s ease .92s both;
}
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"]:not(.is-hidden) .architecture-hugong-map-callout-line-base,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"]:not(.is-hidden) .architecture-hugong-map-callout-node-base{
  animation:hugongMapCalloutLineIn .56s ease 1.36s both;
}
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"]:not(.is-hidden) .architecture-hugong-map-callout-line-riverwalk,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"]:not(.is-hidden) .architecture-hugong-map-callout-node-riverwalk{
  animation:hugongMapCalloutLineIn .56s ease 1.8s both;
}
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"]:not(.is-hidden) .architecture-hugong-map-callout-line-system,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"]:not(.is-hidden) .architecture-hugong-map-callout-node-system{
  animation:hugongMapCalloutLineIn .56s ease 2.24s both;
}

@media (prefers-reduced-motion:reduce){
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-line,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-node{
    opacity:1;
    animation:none !important;
  }
}

/* September 20, 2026 — Scene 15A lets the picture arrive, then brings the
   title, upper tagline and lower tagline in sequence before automatically
   dissolving to 15B. The clean frame keeps only the upper tagline. */
@media (min-width:901px){
  body:not(.verticale-edition) #p3 .architecture-hugong-arrival-frame[data-hugong-arrival-frame="15A"]:not(.is-hidden) ~ .architecture-story-hud.is-hugong-arrival-copy-sequence.is-entering{
    opacity:1 !important;
    transform:none !important;
    filter:none !important;
    animation:none !important;
  }

  body:not(.verticale-edition) #p3 .architecture-hugong-arrival-frame[data-hugong-arrival-frame="15A"]:not(.is-hidden) ~ .architecture-story-hud.is-hugong-arrival-copy-sequence.is-entering .archi-story-title:not([hidden]){
    opacity:0;
    animation:hugongArrivalCopyLineIn .62s cubic-bezier(.18,.76,.18,1) .60s both !important;
  }

  body:not(.verticale-edition) #p3 .architecture-hugong-arrival-frame[data-hugong-arrival-frame="15A"]:not(.is-hidden) ~ .architecture-story-hud.is-hugong-arrival-copy-sequence.is-entering .archi-story-kicker:not([hidden]){
    opacity:0;
    animation:hugongArrivalCopyLineIn .54s cubic-bezier(.18,.76,.18,1) 1.28s both !important;
  }

  body:not(.verticale-edition) #p3 .architecture-hugong-arrival-frame[data-hugong-arrival-frame="15A"]:not(.is-hidden) ~ .architecture-story-hud.is-hugong-arrival-copy-sequence.is-entering .archi-story-body:not([hidden]){
    opacity:0;
    animation:hugongArrivalCopyLineIn .58s cubic-bezier(.18,.76,.18,1) 1.94s both !important;
  }

  body:not(.verticale-edition) #p3 .architecture-hugong-arrival-frame[data-hugong-arrival-frame="15B"]:not(.is-hidden) ~ .architecture-story-hud.is-hugong-arrival-copy-hold.is-entering{
    opacity:1 !important;
    transform:none !important;
    filter:none !important;
    animation:none !important;
  }

  body:not(.verticale-edition) #p3 .architecture-hugong-arrival-frame[data-hugong-arrival-frame="15B"]:not(.is-hidden) ~ .architecture-story-hud.is-hugong-arrival-copy-hold.is-entering .archi-story-kicker:not([hidden]){
    opacity:1 !important;
    transform:none !important;
    filter:none !important;
    animation:none !important;
  }

  body:not(.verticale-edition) #p3 .architecture-hugong-arrival-frame[data-hugong-arrival-frame="15B"]:not(.is-hidden) ~ .architecture-story-hud.is-hugong-arrival-copy-hold.is-entering :is(.archi-story-title,.archi-story-body):not([hidden]){
    opacity:1;
    animation:hugongArrivalCopyLineOut .72s cubic-bezier(.4,0,.2,1) .08s both !important;
  }

  /* Scene 14 clean hold: let the last caption leave too, without blanking the picture. */
  body:not(.verticale-edition) #p3 .architecture-hugong-arrival-frame[data-hugong-arrival-frame="15B"]:not(.is-hidden) ~ .architecture-story-hud.is-hugong-arrival-copy-hold.is-entering .archi-story-kicker:not([hidden]){
    opacity:1;
    animation:hugongArrivalCopyLineOut .72s cubic-bezier(.4,0,.2,1) .08s both !important;
  }
}

@keyframes hugongArrivalCopyLineIn{
  from{opacity:0;transform:translate3d(0,8px,0);filter:blur(1px);}
  to{opacity:1;transform:translate3d(0,0,0);filter:blur(0);}
}

@keyframes hugongArrivalCopyLineOut{
  from{opacity:1;transform:translate3d(0,0,0);filter:blur(0);}
  to{opacity:0;transform:translate3d(0,-5px,0);filter:blur(.6px);}
}

@media (prefers-reduced-motion:reduce){
  body:not(.verticale-edition) #p3 .architecture-hugong-arrival-frame:not(.is-hidden) ~ .architecture-story-hud.is-hugong-arrival-copy-sequence.is-entering,
  body:not(.verticale-edition) #p3 .architecture-hugong-arrival-frame:not(.is-hidden) ~ .architecture-story-hud.is-hugong-arrival-copy-sequence.is-entering :is(.archi-story-kicker,.archi-story-title,.archi-story-body),
  body:not(.verticale-edition) #p3 .architecture-hugong-arrival-frame:not(.is-hidden) ~ .architecture-story-hud.is-hugong-arrival-copy-hold.is-entering :is(.archi-story-kicker,.archi-story-title,.archi-story-body){
    opacity:1 !important;
    transform:none !important;
    filter:none !important;
    animation:none !important;
  }
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"]:not(.is-hidden) ~ .architecture-story-hud{
  bottom:calc(var(--archi-because-title-bottom) - 20px) !important;
}

/* September 15, 2026 — 15A–15D is one chunky Hugong thought. The supplied
   plates remain full-bleed, with a quiet crossfade between each beat. */
body:not(.verticale-edition) #p3 .architecture-hugong-fifteen-frame{
  position:absolute;
  z-index:0;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:50% 50%;
  background:#000;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-system-15d"]{
  object-position:50% 50%;
}

/* The generic Architecture entrance must not replay when an arrival dissolve ends. */
#p3 .architecture-hugong-arrival-frame:not(.is-hidden):not(.hugong-fifteen-frame-in):not(.hugong-fifteen-frame-out){
  animation:none;
  opacity:1;
}

body:not(.verticale-edition) #p3 .architecture-hugong-fifteen-frame.hugong-fifteen-frame-in{
  z-index:7;
  animation:hugongFifteenFrameIn .82s cubic-bezier(.2,.72,.2,1) both !important;
}

body:not(.verticale-edition) #p3 .architecture-hugong-fifteen-frame.hugong-fifteen-frame-out{
  z-index:6;
  animation:hugongFifteenFrameOut .82s ease both !important;
}

/* Scene 14 entry: keep the previous picture present until the new picture is decoded. */
body:not(.verticale-edition) #p3 .architecture-hugong-arrival-frame.is-hugong-arrival-preload{
  z-index:7;
  opacity:0 !important;
}

/* Keep only the incoming picture during the Scene 14→15 bridge; no legacy wolf
   or restoration copy may ride through. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-wolf"].is-hugong-arrival-source-out :is(.architecture-hugong-files-stage,.architecture-hugong-records-meta),
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-restoration"].is-hugong-arrival-source-out :is(.architecture-hugong-restoration-follow-copy,.architecture-hugong-restoration-scrim){
  opacity:0 !important;
  visibility:hidden !important;
  animation:none !important;
}

/* Do not let the incoming Scene 14 HUD paint over the outgoing restoration frame. */
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-arrival-entry-pending .architecture-story-hud,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-arrival-entry-pending [data-panel-id="architecture-hugong-restoration"] :is(.architecture-hugong-restoration-follow-copy,.architecture-hugong-restoration-scrim){
  opacity:0 !important;
  visibility:hidden !important;
  animation:none !important;
}

@keyframes hugongFifteenFrameIn{
  from{opacity:0;}
  to{opacity:1;}
}

@keyframes hugongFifteenFrameOut{
  from{opacity:1;}
  to{opacity:0;}
}

@media (prefers-reduced-motion:reduce){
  body:not(.verticale-edition) #p3 .architecture-hugong-fifteen-frame.hugong-fifteen-frame-in,
  body:not(.verticale-edition) #p3 .architecture-hugong-fifteen-frame.hugong-fifteen-frame-out{
    animation:none !important;
    opacity:1 !important;
  }
}

/* The four 15 beats live inside one public scene. Only the inner picture
   changes; the outer scene counter stays on 15 while the thought unfolds. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-fifteen-inner-frame{
  position:absolute;
  z-index:4;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:50% 50%;
  background:#000;
}

/* 15D — keep the lower-left corner planted while the vision opens 20% toward the right. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] [data-hugong-fifteen-frame="15D"]{
  object-position:left bottom;
  transform:translateY(10px) scale(1.2);
  transform-origin:left bottom;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-fifteen-inner-frame.is-hidden{
  display:none;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-fifteen-inner-frame.hugong-fifteen-frame-in{
  z-index:7;
  animation:hugongFifteenFrameIn .82s cubic-bezier(.2,.72,.2,1) both !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] :is(.architecture-hugong-map-image,.architecture-hugong-map-callout-stage).hugong-fifteen-frame-out{
  animation:hugongFifteenFrameOut .82s ease both !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] :is(.architecture-hugong-map-image,.architecture-hugong-map-callout-stage).hugong-fifteen-frame-in{
  animation:hugongFifteenFrameIn .82s cubic-bezier(.2,.72,.2,1) both !important;
}

@media (prefers-reduced-motion:reduce){
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-fifteen-inner-frame.hugong-fifteen-frame-in,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] :is(.architecture-hugong-map-image,.architecture-hugong-map-callout-stage).hugong-fifteen-frame-in,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] :is(.architecture-hugong-map-image,.architecture-hugong-map-callout-stage).hugong-fifteen-frame-out{
    animation:none !important;
    opacity:1 !important;
  }
}

/* September 16, 2026 — a hidden slide must stay hidden. The Hugong
   full-bleed rules intentionally promote these panels to display:block;
   this final guard keeps an old 15A plate from sitting over Scene 16. */
body:not(.verticale-edition) #p3 .section-screen-slide.is-hidden{
  display:none !important;
}

/* September 16, 2026 — Scene 17 breathes back to the whole supplied plate.
   Keep its lower edge seated while giving the bridge on the right its room. */
body:not(.verticale-edition) #p3 [data-hugong-stage="17"] .architecture-hugong-scene-17-image{
  object-fit:contain;
  object-position:50% 100%;
  background:#070609;
  transform:translateX(0) scale(1.28);
  transform-origin:50% 100%;
}

/* September 16, 2026 — Scene 17 carries the Heritage callout forward as a
   bridge-side marker. It uses the approved 15A frame and its warm linear fade. */
body:not(.verticale-edition) #p3 [data-hugong-stage="17"] .architecture-hugong-scene-16-callout-stage{
  position:absolute;
  z-index:3;
  inset:0;
  overflow:hidden;
  pointer-events:none;
}

body:not(.verticale-edition) #p3 [data-hugong-stage="17"] .architecture-hugong-scene-16-callout-stage .architecture-hugong-map-callout{
  position:absolute;
  z-index:1;
  display:block;
  box-sizing:border-box;
  top:calc(31% - 120px);
  left:calc(7% + 280px);
  width:54%;
  max-width:none;
  margin:0;
  padding:clamp(9px,1.05vw,16px) clamp(20px,2.8vw,42px) clamp(11px,1.35vw,20px);
  border:0;
  border-top:3px solid rgba(247,196,0,.98);
  border-left:3px solid rgba(247,196,0,.98);
  border-right:3px solid rgba(247,196,0,.98);
  border-bottom:0;
  border-radius:46% 46% 0 0 / 28% 28% 0 0;
  background:linear-gradient(180deg,rgba(247,196,0,.78) 0%,rgba(247,196,0,.38) 45%,rgba(247,196,0,.1) 78%,transparent 100%);
  background-repeat:no-repeat;
  background-size:100% 100%;
  color:rgba(255,248,207,.98);
  font-family:'IBM Plex Sans',sans-serif;
  font-size:18pt;
  font-weight:500;
  line-height:1.18;
  letter-spacing:.005em;
  text-align:center;
  text-transform:uppercase;
  text-shadow:none;
  opacity:1;
}

body:not(.verticale-edition) #p3 [data-hugong-stage="17"] .architecture-hugong-scene-16-callout-stage .architecture-hugong-map-callout strong,
body:not(.verticale-edition) #p3 [data-hugong-stage="17"] .architecture-hugong-scene-16-callout-stage .architecture-hugong-map-callout small{
  display:block;
  margin:0;
  font:inherit;
  font-weight:700;
  line-height:1.04;
  text-align:center;
}

body:not(.verticale-edition) #p3 [data-hugong-stage="17"] .architecture-hugong-scene-16-callout-stage .architecture-hugong-map-callout small{
  margin-top:.42em;
  color:rgba(255,255,255,.98);
  font-size:16pt;
  letter-spacing:.08em;
}

body:not(.verticale-edition) #p3 [data-hugong-stage="17"] .architecture-hugong-scene-16-callout-stage .architecture-hugong-map-callout strong{
  font-size:21pt;
}

body:not(.verticale-edition) #p3 [data-hugong-stage="17"] .architecture-hugong-scene-17-river-system{
  text-transform:none;
}

body:not(.verticale-edition) #p3 [data-hugong-stage="17"] .architecture-hugong-scene-16-callout-stage .architecture-hugong-map-callout strong,
body:not(.verticale-edition) #p3 [data-hugong-stage="17"] .architecture-hugong-scene-16-callout-stage .architecture-hugong-map-callout small{
  position:relative;
  top:5px;
}

body:not(.verticale-edition) #p3 [data-hugong-stage="17"] .architecture-hugong-scene-16-bridge-count{
  font-size:16pt !important;
}

/* September 17, 2026 — the bridge count now names the six locales and stays
   centered as one quiet line beneath the bridgeway declaration. */
body:not(.verticale-edition) #p3 [data-hugong-stage="17"] .architecture-hugong-scene-16-callout-stage .architecture-hugong-map-callout,
body:not(.verticale-edition) #p3 [data-hugong-stage="17"] .architecture-hugong-scene-16-callout-stage .architecture-hugong-map-callout strong,
body:not(.verticale-edition) #p3 [data-hugong-stage="17"] .architecture-hugong-scene-16-callout-stage .architecture-hugong-map-callout small{
  text-align:center;
}

body:not(.verticale-edition) #p3 [data-hugong-stage="17"] .architecture-hugong-scene-16-callout-stage .architecture-hugong-map-callout::before,
body:not(.verticale-edition) #p3 [data-hugong-stage="17"] .architecture-hugong-scene-16-callout-stage .architecture-hugong-map-callout::after{
  content:'';
  position:absolute;
  z-index:-1;
  top:100%;
  width:3px;
  height:120px;
  border:0;
  border-radius:0;
  background:linear-gradient(180deg,rgba(247,196,0,.98),rgba(247,196,0,.68) 66%,rgba(247,196,0,.12) 100%);
  opacity:.96;
  pointer-events:none;
}

body:not(.verticale-edition) #p3 [data-hugong-stage="17"] .architecture-hugong-scene-16-callout-stage .architecture-hugong-map-callout::before{
  left:-3px;
}

body:not(.verticale-edition) #p3 [data-hugong-stage="17"] .architecture-hugong-scene-16-callout-stage .architecture-hugong-map-callout::after{
  right:-3px;
}

/* Keep the Heritage marker in the same golden-orange register as the
   structural lines in the supplied bridge drawing — on Scene 16 and 17. */
body:not(.verticale-edition) #p3 :is([data-panel-id="architecture-hugong-map-16b"],[data-hugong-stage="17"]) .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled{
  border-top-color:rgba(255,174,24,.98);
  border-left-color:rgba(255,174,24,.98);
  border-right-color:rgba(255,174,24,.98);
  background:linear-gradient(180deg,rgba(255,174,24,.78) 0%,rgba(255,174,24,.38) 45%,rgba(255,174,24,.1) 78%,transparent 100%);
}

body:not(.verticale-edition) #p3 :is([data-panel-id="architecture-hugong-map-16b"],[data-hugong-stage="17"]) .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled::before,
body:not(.verticale-edition) #p3 :is([data-panel-id="architecture-hugong-map-16b"],[data-hugong-stage="17"]) .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled::after{
  background:linear-gradient(180deg,rgba(255,174,24,.98),rgba(255,174,24,.68) 66%,rgba(255,174,24,.12) 100%);
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-locale{
  border-top-color:rgba(255,174,24,.98);
  border-left-color:rgba(255,174,24,.98);
  border-bottom-color:rgba(255,174,24,.98);
  background:linear-gradient(90deg,rgba(255,174,24,.8) 0%,rgba(255,174,24,.45) 48%,rgba(255,174,24,.2) 78%,transparent 100%);
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"] .architecture-hugong-map-callout-riverwalk::before{
  border-color:rgba(255,174,24,.98);
  background:rgba(255,174,24,.7);
}

/* September 15, 2026 — restore the permanent ruled support standard. */
body:not(.verticale-edition) #p3 [data-hugong-scene-bang="true"] .architecture-hugong-scene-17-bottomline{
  top:calc(100% - 76px);
  right:32px;
  bottom:auto;
  max-width:calc(100% - 64px);
  white-space:normal;
  font-size:var(--archi-because-support-size,18pt);
  line-height:1.18;
  letter-spacing:0;
}

/* September 16, 2026 — Scene 17 opens with the supplied ferry drawing,
   held as a complete plate before the ferry-in-action image arrives. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-ferry-drawing-17"]{
  background:#070609;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-ferry-drawing-17"] .architecture-hugong-ferry-drawing-image{
  position:absolute;
  inset:0;
  z-index:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:contain;
  object-position:50% 50%;
  background:#070609;
  transform:scale(1.05);
  transform-origin:50% 50%;
  filter:saturate(.95);
}

/* September 16, 2026 — Scene 18 holds two ferry photographs inside one
   composed beat: first ferry, title, rider ferry, then the supporting line. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-ferry-golden-hour"]{
  background:#070609;
  overflow:hidden;
  isolation:isolate;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-ferry-golden-hour"] :is(.architecture-hugong-ferry-primary-image,.architecture-hugong-ferry-rider-image){
  position:absolute;
  inset:0;
  z-index:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:50% 50%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-ferry-golden-hour"] .architecture-hugong-ferry-rider-image.is-hidden{
  display:none !important;
}

@keyframes architectureFerryTitleIn{
  from{opacity:0;transform:translate3d(0,8px,0);filter:blur(.7px);}
  to{opacity:1;transform:translate3d(0,0,0);filter:blur(0);}
}

@keyframes architectureFerryTaglineIn{
  from{opacity:0;transform:translate3d(0,6px,0);filter:blur(.55px);}
  to{opacity:1;transform:translate3d(0,0,0);filter:blur(0);}
}

@keyframes architectureFerryPrimaryOut{
  from{opacity:1;}
  to{opacity:0;}
}

@keyframes architectureFerryRiderIn{
  from{opacity:0;}
  to{opacity:1;}
}

@media (min-width:901px){
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-ferry-golden-hour"]:not(.is-hidden) ~ .architecture-story-hud.is-entering{
    opacity:1 !important;
    transform:none !important;
    filter:none !important;
    animation:none !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-ferry-golden-hour"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
    opacity:0;
    word-spacing:.08em;
    animation:architectureFerryTitleIn .78s cubic-bezier(.18,.74,.2,1) 1s both !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-ferry-golden-hour"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
    opacity:0;
    font-weight:700 !important;
    text-transform:uppercase !important;
    animation:none !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-ferry-golden-hour"].is-architecture-ferry-tagline-ready ~ .architecture-story-hud .archi-story-body{
    animation:architectureFerryTaglineIn .72s cubic-bezier(.18,.74,.2,1) both !important;
  }

  body:not(.verticale-edition) #p3 .architecture-story-hud .archi-story-body.is-architecture-ferry-tagline-visible{
    opacity:1 !important;
    animation:architectureFerryTaglineIn .72s cubic-bezier(.18,.74,.2,1) both !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-ferry-golden-hour"] .architecture-hugong-ferry-primary-image.architecture-ferry-primary-out{
    z-index:1;
    animation:architectureFerryPrimaryOut 1.1s ease both !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-ferry-golden-hour"] .architecture-hugong-ferry-rider-image.architecture-ferry-rider-in{
    z-index:2;
    animation:architectureFerryRiderIn 1.1s ease both !important;
  }
}

@media (prefers-reduced-motion:reduce){
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-ferry-golden-hour"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title,
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-ferry-golden-hour"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
    opacity:1;
    animation:none !important;
  }
}

/* September 16, 2026 — Scene 19 is the Ugong finale: close, middle, then
   pulled-back view, with the existing grid bridge held for Scene 20. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"]{
  background:#070609;
  overflow:hidden;
  isolation:isolate;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"] .architecture-hugong-finale-image{
  position:absolute;
  inset:0;
  z-index:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"] .architecture-hugong-finale-image.is-hidden{
  display:none !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"] .architecture-hugong-finale-image-close{
  object-position:50% 50%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"] .architecture-hugong-finale-image-mid{
  object-position:50% 50%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"] .architecture-hugong-finale-image-pulled-back{
  object-position:50% 50%;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"].is-hugong-finale-final ~ .architecture-story-hud .archi-story-title{
  max-width:none;
  white-space:nowrap;
}

/* September 17, 2026 — Scene 19 carries its relationship line above the
   river title in the established IBM Plex Bold Architecture voice. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"] ~ .architecture-story-hud .archi-story-kicker:not([hidden]){
  color:#fff;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:22pt;
  font-weight:700;
  line-height:1.15;
  letter-spacing:.01em;
  text-transform:none;
}

@keyframes hugongFinaleTaglineIn{
  from{opacity:0;transform:translateY(8px);filter:blur(1px);}
  to{opacity:1;transform:translateY(0);filter:blur(0);}
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"] ~ .architecture-story-hud .archi-story-body.is-hugong-finale-tagline-visible{
  max-width:44ch;
  color:#fff;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:clamp(16px,1.32vw,21px);
  font-weight:700 !important;
  line-height:1.28;
  letter-spacing:.005em;
  text-transform:uppercase;
  animation:hugongFinaleTaglineIn .72s cubic-bezier(.18,.74,.2,1) both !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"].is-hugong-finale-final::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(39,81,123,.24) 0%,rgba(48,80,112,.12) 23%,rgba(0,0,0,0) 50%);
}

/* 19A framing pass — lower the close tower composition by 150px while it
   remains a full-bleed image. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"] .architecture-hugong-finale-image-close{
  object-position:50% 100%;
}

/* The two tall photographs keep the same top and bottom crops, while the
   picture itself glides on the compositor instead of recropping every frame. */
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"] .architecture-hugong-finale-image-close,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"] .architecture-hugong-finale-image-mid{
  right:auto;
  bottom:auto;
  width:100%;
  height:auto;
  min-height:100%;
  object-fit:fill;
  backface-visibility:hidden;
  will-change:transform,opacity;
}
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"] .architecture-hugong-finale-image-close{
  transform:translate3d(0,calc(var(--hugong-finale-height, 0px) - 100%),0);
}
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"] .architecture-hugong-finale-image-mid{
  transform:translate3d(0,0,0);
}

@keyframes hugongFinaleClosePan{
  from{transform:translate3d(0,calc(var(--hugong-finale-height, 0px) - 100%),0);}
  to{transform:translate3d(0,0,0);}
}

@keyframes hugongFinaleMidPan{
  from{transform:translate3d(0,0,0);}
  to{transform:translate3d(0,calc(var(--hugong-finale-height, 0px) - 100%),0);}
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"] .architecture-hugong-finale-image-close.hugong-finale-close-pan{
  animation:hugongFinaleClosePan 5.5s linear both !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"] .architecture-hugong-finale-image-mid.hugong-finale-mid-pan{
  animation:hugongFinaleMidPan 4s cubic-bezier(.45,.05,.75,1) .45s both !important;
}

@keyframes hugongFinaleLayerIn{
  from{opacity:0;}
  to{opacity:1;}
}

@keyframes hugongFinaleLayerOut{
  from{opacity:1;}
  to{opacity:0;}
}

@keyframes hugongFinaleFinalOverlayIn{
  from{opacity:0;}
  to{opacity:1;}
}

@media (min-width:901px){
  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"] .architecture-hugong-finale-image.architecture-hugong-finale-layer-in{
    z-index:2;
    animation:hugongFinaleLayerIn 2.2s cubic-bezier(.22,.61,.36,1) both !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"] .architecture-hugong-finale-image.architecture-hugong-finale-layer-out{
    z-index:1;
    animation:hugongFinaleLayerOut 2.2s cubic-bezier(.22,.61,.36,1) both !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"] .architecture-hugong-finale-image-close.architecture-hugong-finale-layer-out{
    animation:hugongFinaleLayerOut 2.2s cubic-bezier(.48,0,.82,1) both !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"] .architecture-hugong-finale-image-mid.hugong-finale-mid-pan.architecture-hugong-finale-layer-in{
    animation:hugongFinaleMidPan 4s cubic-bezier(.45,.05,.75,1) .45s both, hugongFinaleLayerIn 2.2s cubic-bezier(.48,0,.82,1) both !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"] .architecture-hugong-finale-image-mid.hugong-finale-mid-pan.architecture-hugong-finale-layer-out{
    animation:hugongFinaleLayerOut 2.2s cubic-bezier(.22,.61,.36,1) both !important;
  }

  body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-finale-19"].is-hugong-finale-final::after{
    animation:hugongFinaleFinalOverlayIn .9s ease both;
  }
}

/* September 17, 2026 — 15A map choreography. The map arrives first, then
   the title, promenade, heritage clump and finally the Grove. */
@keyframes hugongMapTitleIn{
  from{opacity:0;transform:translate3d(0,12px,0);filter:blur(1px);}
  68%{opacity:1;transform:translate3d(0,-2px,0);filter:blur(0);}
  to{opacity:1;transform:translate3d(0,0,0);filter:blur(0);}
}

@keyframes hugongMapHeritageStemRise{
  from{opacity:0;transform:scaleY(0);}
  to{opacity:.96;transform:scaleY(1);}
}

@keyframes hugongMapHeritageTextRise{
  from{opacity:0;transform:translate3d(0,12px,0);clip-path:inset(100% 0 0 0);}
  62%{opacity:1;}
  to{opacity:1;transform:translate3d(0,0,0);clip-path:inset(0 0 0 0);}
}

body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden) ~ .architecture-story-hud.is-entering{
  opacity:1;
  transform:none;
  filter:none;
  animation:none !important;
}

body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden) ~ .architecture-story-hud :is(.archi-story-title,.archi-story-body){
  opacity:0 !important;
  transform:translate3d(0,12px,0);
  filter:blur(1px);
  animation:none !important;
}

body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden) .architecture-hugong-map-callout,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden) .architecture-hugong-map-callout-line,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden) .architecture-hugong-map-callout-node{
  opacity:0 !important;
  animation:none !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-title-phase:not(.is-hidden) ~ .architecture-story-hud :is(.archi-story-title,.archi-story-body){
  animation:hugongMapTitleIn .7s cubic-bezier(.2,.72,.2,1) var(--hugong-map-title-delay,0s) both !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-title-phase:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  --hugong-map-title-delay:.14s;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-riverwalk-phase .architecture-hugong-map-callout-riverwalk{
  opacity:1 !important;
  animation:hugongMapRiverwalkIn .72s cubic-bezier(.2,.72,.2,1) both !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-riverwalk-phase .architecture-hugong-map-callout-line-riverwalk,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-riverwalk-phase .architecture-hugong-map-callout-node-riverwalk{
  display:block !important;
  animation:hugongMapCalloutLineIn .56s ease both !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-heritage-phase .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled{
  opacity:1 !important;
  animation:hugongMapCalloutIn .82s cubic-bezier(.2,.72,.2,1) both !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-heritage-phase .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled strong,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-heritage-phase .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled small{
  animation:hugongMapHeritageTextRise .92s cubic-bezier(.2,.72,.2,1) .16s both !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-heritage-phase .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled::before,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-heritage-phase .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled::after{
  animation:hugongMapHeritageStemRise .96s cubic-bezier(.2,.72,.2,1) both !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-heritage-phase .architecture-hugong-map-callout-line-center,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-heritage-phase .architecture-hugong-map-callout-node-center,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-heritage-phase .architecture-hugong-map-callout-line-base,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-heritage-phase .architecture-hugong-map-callout-node-base{
  display:block !important;
  stroke-dasharray:18;
  animation:hugongMapCalloutLineIn .88s ease .08s both !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-grove-phase .architecture-hugong-map-callout-locale{
  opacity:1 !important;
  animation:hugongMapGroveIn .78s cubic-bezier(.2,.72,.2,1) both !important;
}

body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-grove-phase .architecture-hugong-map-callout-line-locale,
body:not(.verticale-edition) #p3 [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-grove-phase .architecture-hugong-map-callout-node-locale{
  display:block !important;
  animation:hugongMapCalloutLineIn .56s ease both !important;
}

@media (prefers-reduced-motion:reduce){
  body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden) ~ .architecture-story-hud :is(.archi-story-title,.archi-story-body),
  body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden) .architecture-hugong-map-callout,
  body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden) .architecture-hugong-map-callout-line,
  body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden) .architecture-hugong-map-callout-node{
    opacity:1 !important;
    transform:none !important;
    clip-path:none !important;
    animation:none !important;
  }
}

/* Cascade repair for the 15A arrival: the original map-reel hold rules have
   higher weight, so each new beat repeats that weight while its phase is live. */
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing.is-hugong-map-title-phase:not(.is-hidden) ~ .architecture-story-hud :is(.archi-story-title,.archi-story-body){
  opacity:1 !important;
  animation:hugongMapTitleIn .7s cubic-bezier(.2,.72,.2,1) var(--hugong-map-title-delay,0s) both !important;
}

body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing.is-hugong-map-riverwalk-phase:not(.is-hidden) .architecture-hugong-map-callout-riverwalk{
  opacity:1 !important;
  animation:hugongMapRiverwalkIn .72s cubic-bezier(.2,.72,.2,1) both !important;
}

body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing.is-hugong-map-heritage-phase:not(.is-hidden) .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing.is-hugong-map-heritage-phase:not(.is-hidden) .architecture-hugong-map-callout-base{
  display:block !important;
  opacity:1 !important;
  animation:hugongMapCalloutIn .82s cubic-bezier(.2,.72,.2,1) both !important;
}

body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing.is-hugong-map-grove-phase:not(.is-hidden) .architecture-hugong-map-callout-locale{
  opacity:1 !important;
  animation:hugongMapGroveIn .78s cubic-bezier(.2,.72,.2,1) both !important;
}

body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing.is-hugong-map-riverwalk-phase:not(.is-hidden) .architecture-hugong-map-callout-line-riverwalk,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing.is-hugong-map-riverwalk-phase:not(.is-hidden) .architecture-hugong-map-callout-node-riverwalk,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing.is-hugong-map-heritage-phase:not(.is-hidden) .architecture-hugong-map-callout-line-center,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing.is-hugong-map-heritage-phase:not(.is-hidden) .architecture-hugong-map-callout-node-center,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing.is-hugong-map-heritage-phase:not(.is-hidden) .architecture-hugong-map-callout-line-base,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing.is-hugong-map-heritage-phase:not(.is-hidden) .architecture-hugong-map-callout-node-base,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing.is-hugong-map-grove-phase:not(.is-hidden) .architecture-hugong-map-callout-line-locale,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing.is-hugong-map-grove-phase:not(.is-hidden) .architecture-hugong-map-callout-node-locale{
  display:block !important;
  animation:hugongMapCalloutLineIn .56s ease both !important;
}

/* September 17, 2026 — Scene 21 keeps the approved View Lens chassis. The
   old live grid card is gone, while the usual Architecture body copy remains
   seated on the left beside the four-beat image passage. */
body:not(.verticale-edition) #p3.is-architecture-scale-landing .two-col{
  grid-template-columns:470px 1024px;
  gap:64px;
  padding:0 61px;
  transform:translateY(-5px);
  height:auto;
}

body:not(.verticale-edition) #p3.is-architecture-scale-landing .col-left{
  display:flex;
  width:470px;
  max-width:470px;
}

body:not(.verticale-edition) #p3.is-architecture-scale-landing .col-right{
  width:1024px;
  max-width:1024px;
  height:auto;
  min-height:0;
  justify-self:end;
}

body:not(.verticale-edition) #p3.is-architecture-scale-landing .golden-box{
  width:1024px;
  height:auto;
  min-height:0;
  aspect-ratio:auto;
  padding:42px clamp(44px,6.2vw,111px);
  overflow:visible;
}

body:not(.verticale-edition) #p3 .architecture-bridge-scale-card{
  position:absolute;
  inset:0;
  z-index:1;
  overflow:hidden;
  isolation:isolate;
  background:#020303;
}

body:not(.verticale-edition) #p3 .architecture-bridge-scale-card::before{
  content:none;
}

body:not(.verticale-edition) #p3 .architecture-bridge-scale-reel{
  position:absolute;
  z-index:0;
  inset:0;
  overflow:hidden;
  background:#020303;
}

body:not(.verticale-edition) #p3 .architecture-bridge-scale-frame{
  position:absolute;
  inset:0;
  z-index:0;
  display:block;
  width:100%;
  height:100%;
  margin:0;
  overflow:hidden;
  opacity:0;
  background:#020303;
  will-change:opacity,transform,filter;
}

body:not(.verticale-edition) #p3 .architecture-bridge-scale-frame.is-active{
  z-index:1;
  opacity:1;
}

body:not(.verticale-edition) #p3 .architecture-bridge-scale-frame img{
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
}

body:not(.verticale-edition) #p3 .architecture-bridge-scale-frame-landscape img{
  object-position:50% 52%;
}
body:not(.verticale-edition) #p3 .architecture-bridge-scale-frame-landscape .architecture-scale-landscape-image{
  object-fit:contain;
  object-position:50% 50%;
}

body:not(.verticale-edition) #p3 .architecture-bridge-scale-frame-river img{
  object-position:50% 50%;
}

body:not(.verticale-edition) #p3 .architecture-bridge-scale-frame-material img{
  object-position:50% 54%;
  filter:saturate(.94) contrast(.98);
}

body:not(.verticale-edition) #p3 .architecture-bridge-scale-frame-vehicle img{
  object-position:50% 50%;
  filter:saturate(.96) contrast(.99);
  transform:scale(1.15);
  transform-origin:50% 0%;
}

body:not(.verticale-edition) #p3 .architecture-bridge-scale-frame.is-entering{
  z-index:3;
  animation:architectureScaleFrameIn .9s cubic-bezier(.2,.72,.2,1) both !important;
}

body:not(.verticale-edition) #p3 .architecture-bridge-scale-frame.is-outgoing{
  z-index:2;
  animation:architectureScaleFrameOut .9s ease both !important;
}

@keyframes architectureScaleFrameIn{
  from{opacity:0;transform:scale(1.012);filter:brightness(.84) saturate(.9);}
  to{opacity:1;transform:scale(1);filter:brightness(1) saturate(1);}
}

@keyframes architectureScaleFrameOut{
  from{opacity:1;}
  to{opacity:0;}
}

/* Scene 21A borrows only 11A's opening image and visual motion. Its own
   destination title and the later River / Material / Vehicle beats stay in
   the scale reel above. */
body:not(.verticale-edition) #p3 .architecture-bridge-scale-frame-landscape .architecture-sipalay-11a-image-stage{
  position:absolute;
  inset:0;
  z-index:2;
  overflow:hidden;
  pointer-events:none;
}

/* This scene borrows Sipalay's daylight picture, but the original reveal
   selector belongs to its own panel. Keep the opening landscape on screen
   from the first beat, including when reduced motion is requested. */
#p3 [data-panel-id="architecture-bridge-scale"] .architecture-bridge-scale-frame-landscape .architecture-sipalay-reel-daylight{
  opacity:1;
  transform:none;
  animation:none;
}

@media (prefers-reduced-motion:reduce){
  #p3 [data-panel-id="architecture-bridge-scale"] .architecture-bridge-scale-frame-landscape .architecture-sipalay-reel-daylight{
    opacity:1 !important;
    transform:none !important;
  }
}

body:not(.verticale-edition) #p3 .architecture-bridge-scale-card ~ .architecture-story-hud{
  z-index:4;
  left:5%;
  right:6%;
  bottom:8%;
  max-width:84%;
  gap:10px;
}

body:not(.verticale-edition) #p3 .architecture-bridge-scale-card ~ .architecture-story-hud .archi-story-kicker{
  color:#fff;
  background:none;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:22pt;
  font-weight:700;
  line-height:1.15;
  letter-spacing:0;
  text-transform:none;
  -webkit-text-fill-color:#fff;
  animation:none;
}

body:not(.verticale-edition) #p3 .architecture-bridge-scale-card ~ .architecture-story-hud .archi-story-title{
  max-width:none;
  color:#fff;
  font-size:40px;
  line-height:1.06;
  letter-spacing:-.022em;
  white-space:pre;
  text-wrap:nowrap;
}

body:not(.verticale-edition) #p3 .architecture-bridge-scale-card ~ .architecture-story-hud .archi-story-body{
  max-width:44ch;
  color:#fff;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:22pt;
  font-weight:700;
  line-height:1.28;
  letter-spacing:.005em;
  text-transform:none;
}

body:not(.verticale-edition) #p3 .architecture-bridge-scale-card ~ .architecture-story-hud .archi-story-provenance:not([hidden]){
  position:absolute;
  top:calc(50% - 175px);
  right:-12.5%;
  display:block;
  margin:0;
  padding:9px 8px;
  border-left:1px solid rgba(255,255,255,.7);
  color:#fff;
  background:rgba(2,7,8,.55);
  font-family:'DM Mono',monospace;
  font-size:10px;
  font-weight:400;
  line-height:1.1;
  letter-spacing:.08em;
  text-transform:uppercase;
  white-space:nowrap;
  max-width:none;
  writing-mode:vertical-rl;
  transform:translateY(-50%) rotate(180deg);
  -webkit-text-fill-color:#fff;
  animation:architectureScaleCreditIn .72s cubic-bezier(.2,.72,.2,1) both;
}

body:not(.verticale-edition) #p3 .architecture-bridge-scale-card ~ .architecture-story-hud.is-architecture-scale-phase-landscape .archi-story-title,
body:not(.verticale-edition) #p3 .architecture-bridge-scale-card ~ .architecture-story-hud.is-architecture-scale-phase-river .archi-story-title,
body:not(.verticale-edition) #p3 .architecture-bridge-scale-card ~ .architecture-story-hud.is-architecture-scale-phase-material .archi-story-title,
body:not(.verticale-edition) #p3 .architecture-bridge-scale-card ~ .architecture-story-hud.is-architecture-scale-phase-vehicle .archi-story-title{
  animation:architectureScaleTitleIn .72s cubic-bezier(.2,.72,.2,1) both;
}

body:not(.verticale-edition) #p3 .architecture-bridge-scale-card ~ .architecture-story-hud.is-architecture-scale-phase-landscape .archi-story-kicker,
body:not(.verticale-edition) #p3 .architecture-bridge-scale-card ~ .architecture-story-hud.is-architecture-scale-phase-river .archi-story-kicker,
body:not(.verticale-edition) #p3 .architecture-bridge-scale-card ~ .architecture-story-hud.is-architecture-scale-phase-material .archi-story-kicker,
body:not(.verticale-edition) #p3 .architecture-bridge-scale-card ~ .architecture-story-hud.is-architecture-scale-phase-vehicle .archi-story-kicker{
  animation:architectureScaleKickerIn .62s cubic-bezier(.2,.72,.2,1) both;
}

body:not(.verticale-edition) #p3 .architecture-bridge-scale-card ~ .architecture-story-hud.is-architecture-scale-phase-vehicle .archi-story-body{
  animation:architectureScaleBodyIn .72s cubic-bezier(.2,.72,.2,1) .1s both;
}

@keyframes architectureScaleKickerIn{
  from{opacity:0;transform:none;filter:blur(1px);}
  to{opacity:1;transform:none;filter:blur(0);}
}

@keyframes architectureScaleTitleIn{
  from{opacity:0;transform:none;filter:blur(1.2px);}
  to{opacity:1;transform:none;filter:blur(0);}
}

@keyframes architectureScaleBodyIn{
  from{opacity:0;transform:translateY(7px);filter:blur(1px);}
  to{opacity:1;transform:translateY(0);filter:blur(0);}
}

@keyframes architectureScaleCreditIn{
  from{opacity:0;transform:translateY(-50%) rotate(180deg) translateX(-8px);}
  to{opacity:1;transform:translateY(-50%) rotate(180deg) translateX(0);}
}

@media (prefers-reduced-motion:reduce){
  body:not(.verticale-edition) #p3 .architecture-bridge-scale-frame.is-entering,
  body:not(.verticale-edition) #p3 .architecture-bridge-scale-frame.is-outgoing,
  body:not(.verticale-edition) #p3 .architecture-bridge-scale-card ~ .architecture-story-hud .archi-story-kicker,
  body:not(.verticale-edition) #p3 .architecture-bridge-scale-card ~ .architecture-story-hud .archi-story-title,
  body:not(.verticale-edition) #p3 .architecture-bridge-scale-card ~ .architecture-story-hud .archi-story-body,
  body:not(.verticale-edition) #p3 .architecture-bridge-scale-card ~ .architecture-story-hud .archi-story-provenance:not([hidden]){
    animation:none !important;
  }
}

/* Keep every later map label quiet until its own entrance beat arrives. */
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden):not(.is-hugong-map-title-phase) ~ .architecture-story-hud :is(.archi-story-title,.archi-story-body){
  opacity:0 !important;
  animation:none !important;
}

body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden):not(.is-hugong-map-title-phase) .architecture-hugong-map-callout-system{
  opacity:0 !important;
  animation:none !important;
}

body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden):not(.is-hugong-map-riverwalk-phase):not(.is-hugong-map-heritage-phase):not(.is-hugong-map-grove-phase) .architecture-hugong-map-callout-riverwalk,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden):not(.is-hugong-map-heritage-phase):not(.is-hugong-map-grove-phase) .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden):not(.is-hugong-map-heritage-phase):not(.is-hugong-map-grove-phase) .architecture-hugong-map-callout-base,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden):not(.is-hugong-map-grove-phase) .architecture-hugong-map-callout-locale{
  opacity:0 !important;
  animation:none !important;
}

body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden):not(.is-hugong-map-riverwalk-phase):not(.is-hugong-map-heritage-phase):not(.is-hugong-map-grove-phase) .architecture-hugong-map-callout-line-riverwalk,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden):not(.is-hugong-map-heritage-phase):not(.is-hugong-map-grove-phase) .architecture-hugong-map-callout-line-center,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden):not(.is-hugong-map-heritage-phase):not(.is-hugong-map-grove-phase) .architecture-hugong-map-callout-line-base,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden):not(.is-hugong-map-grove-phase) .architecture-hugong-map-callout-line-locale,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden):not(.is-hugong-map-riverwalk-phase):not(.is-hugong-map-heritage-phase):not(.is-hugong-map-grove-phase) .architecture-hugong-map-callout-node-riverwalk,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden):not(.is-hugong-map-heritage-phase):not(.is-hugong-map-grove-phase) .architecture-hugong-map-callout-node-center,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden):not(.is-hugong-map-heritage-phase):not(.is-hugong-map-grove-phase) .architecture-hugong-map-callout-node-base,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing:not(.is-hidden):not(.is-hugong-map-grove-phase) .architecture-hugong-map-callout-node-locale{
  display:none !important;
  animation:none !important;
}

body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing.is-hugong-map-heritage-phase:not(.is-hidden) .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled strong,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing.is-hugong-map-heritage-phase:not(.is-hidden) .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled small{
  animation:hugongMapHeritageTextRise .92s cubic-bezier(.2,.72,.2,1) .16s both !important;
}

body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing.is-hugong-map-heritage-phase:not(.is-hidden) .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled::before,
body:not(.verticale-edition) #p3 .portal-shell.is-hugong-fifteen-reel-playing [data-panel-id="architecture-hugong-map-16b"].is-hugong-map-reveal-playing.is-hugong-map-heritage-phase:not(.is-hidden) .architecture-hugong-map-callout-center.architecture-hugong-map-callout-labeled::after{
  animation:hugongMapHeritageStemRise .96s cubic-bezier(.2,.72,.2,1) both !important;
}

/* Final Scene 21 cascade lock: the older house/support rules stay available
   for every other Architecture panel, but cannot squeeze this credit or
   force the final support line beneath the new scale-stage HUD. */
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-bridge-scale"][data-archi-be-cause-rule="true"]:not(.is-hidden) ~ .architecture-story-hud{
  left:5% !important;
  right:6% !important;
  bottom:8% !important;
  top:auto !important;
  width:auto !important;
  max-width:84% !important;
  align-items:flex-start !important;
  text-align:left !important;
  transform:none !important;
  animation:none !important;
  opacity:1 !important;
  filter:none !important;
  gap:10px !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-bridge-scale"][data-archi-be-cause-rule="true"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  width:auto !important;
  max-width:none !important;
  font-size:40px !important;
  line-height:1.06 !important;
  white-space:pre !important;
  text-wrap:nowrap !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-bridge-scale"][data-archi-be-cause-rule="true"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  position:static !important;
  width:auto !important;
  max-width:44ch !important;
  height:auto !important;
  margin:0 !important;
  padding:0 !important;
  font-size:22pt !important;
  font-weight:700 !important;
  line-height:1.2 !important;
  line-height:1.28 !important;
  white-space:normal !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-bridge-scale"][data-archi-be-cause-rule="true"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-provenance:not([hidden]){
  position:absolute !important;
  top:calc(50% - 175px) !important;
  right:-12.5% !important;
  left:auto !important;
  bottom:auto !important;
  display:block !important;
  width:auto !important;
  max-width:none !important;
  height:auto !important;
  margin:0 !important;
  padding:9px 8px !important;
  border-left:1px solid rgba(255,255,255,.7) !important;
  color:#fff !important;
  background:rgba(2,7,8,.55) !important;
  font-family:'DM Mono',monospace !important;
  font-size:16px !important;
  font-weight:400 !important;
  line-height:1.1 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
  white-space:nowrap !important;
  writing-mode:vertical-rl !important;
  transform:translateY(-50%) rotate(180deg) !important;
  -webkit-text-fill-color:#fff !important;
  animation:architectureScaleCreditIn .72s cubic-bezier(.2,.72,.2,1) both !important;
}

/* Scene 22 finale exception: lower only the established title by 50px. */
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-vehicle-reading-nature-clean"][data-archi-be-cause-rule="true"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  transform:translateY(25px) !important;
}

/* Scene 22 composition test: center the title and let its baseline settle just
   above the motorcycle without changing the image or its lighting. */
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-vehicle-reading-nature-clean"][data-archi-be-cause-rule="true"]:not(.is-hidden) ~ .architecture-story-hud{
  top:calc(50% - 70px) !important;
  right:auto !important;
  bottom:auto !important;
  left:50% !important;
  width:min(86%,900px) !important;
  max-width:none !important;
  align-items:center !important;
  text-align:center !important;
  transform:translate(-50%,-100%) !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-vehicle-reading-nature-clean"][data-archi-be-cause-rule="true"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  width:auto !important;
  text-align:center !important;
  text-align-last:center !important;
  transform:none !important;
}

/* Scene 22 finale choreography: image first, then title, then one centered
   Archivo quote line at a time. */
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-vehicle-reading-nature-clean"]{
  opacity:1 !important;
  transition:opacity 1.2s cubic-bezier(.2,.72,.2,1) !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-vehicle-reading-nature-clean"].is-vehicle-finale-image-out{
  opacity:0 !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-vehicle-reading-nature-clean"]:not(.is-hidden) ~ .architecture-story-hud.is-vehicle-finale-playing{
  top:calc(50% - 70px) !important;
  right:auto !important;
  bottom:auto !important;
  left:50% !important;
  width:min(86%,900px) !important;
  height:0 !important;
  max-width:none !important;
  display:block !important;
  transform:translateX(-50%) !important;
  text-align:center !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-vehicle-reading-nature-clean"]:not(.is-hidden) ~ .architecture-story-hud.is-vehicle-finale-playing .archi-story-title{
  position:absolute !important;
  top:auto !important;
  right:auto !important;
  bottom:0 !important;
  left:50% !important;
  width:max-content !important;
  max-width:90vw !important;
  margin:0 !important;
  padding:0 !important;
  font-family:'Archivo Black',sans-serif !important;
  font-size:30pt !important;
  line-height:1 !important;
  white-space:nowrap !important;
  text-align:center !important;
  text-align-last:center !important;
  opacity:0 !important;
  transform:translate(-50%,8px) !important;
  transition:opacity .72s cubic-bezier(.2,.72,.2,1),transform .72s cubic-bezier(.2,.72,.2,1) !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-vehicle-reading-nature-clean"]:not(.is-hidden) ~ .architecture-story-hud.is-vehicle-finale-playing.is-vehicle-finale-title-on .archi-story-title{
  opacity:1 !important;
  transform:translate(-50%,0) !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-vehicle-reading-nature-clean"]:not(.is-hidden) ~ .architecture-story-hud.is-vehicle-finale-playing.is-vehicle-finale-title-out .archi-story-title{
  opacity:0 !important;
  transform:translate(-50%,-8px) !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-vehicle-reading-nature-clean"]:not(.is-hidden) ~ .architecture-story-hud.is-vehicle-finale-playing .archi-story-body{
  position:absolute !important;
  top:18px !important;
  right:auto !important;
  bottom:auto !important;
  left:50% !important;
  width:max-content !important;
  max-width:90vw !important;
  margin:0 !important;
  padding:0 !important;
  color:#fff !important;
  font-family:'Archivo Black',sans-serif !important;
  font-size:clamp(22px,2.25vw,36px) !important;
  font-weight:400 !important;
  line-height:1.5 !important;
  letter-spacing:-.012em !important;
  white-space:pre-line !important;
  text-align:center !important;
  text-align-last:center !important;
  opacity:0 !important;
  transform:translate(-50%,8px) !important;
  transition:opacity .72s cubic-bezier(.2,.72,.2,1),transform .72s cubic-bezier(.2,.72,.2,1) !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-vehicle-reading-nature-clean"]:not(.is-hidden) ~ .architecture-story-hud.is-vehicle-finale-playing.is-vehicle-finale-quote-on .archi-story-body{
  opacity:1 !important;
  transform:translate(-50%,0) !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-vehicle-reading-nature-clean"]:not(.is-hidden) ~ .architecture-story-hud.is-vehicle-finale-playing.is-vehicle-finale-quote-out .archi-story-body{
  opacity:0 !important;
  transform:translate(-50%,-8px) !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-vehicle-reading-nature-clean"]:not(.is-hidden) ~ .architecture-story-hud.is-vehicle-finale-static .archi-story-body{
  white-space:pre-line !important;
  text-wrap:balance !important;
  opacity:1 !important;
  transform:translate(-50%,0) !important;
}

html body:not(.verticale-edition) #p3 .architecture-story-hud .archi-story-title,
html body:not(.verticale-edition) #p3 .architecture-story-hud .archi-story-body,
html body:not(.verticale-edition) #p3 .architecture-hero-writ,
html body:not(.verticale-edition) #p3 .architecture-hero-writ p{
  color:#fff;
}

html body:not(.verticale-edition) #p3 .architecture-story-hud .archi-story-title,
html body:not(.verticale-edition) #p3 .architecture-story-hud .archi-story-body{
  -webkit-text-fill-color:#fff;
}

/* Scene 06 — make the question the hit; let the existing line answer beneath it. */
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  height:auto !important;
  max-width:none !important;
  width:max-content !important;
  font-size:36pt !important;
  line-height:1.02 !important;
  white-space:nowrap !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud{
  left:28px !important;
  right:28px !important;
  bottom:29px !important;
  max-width:calc(100% - 56px) !important;
  align-items:flex-start !important;
  text-align:left !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  width:100% !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  height:auto !important;
  margin-top:4px !important;
  font-size:17pt !important;
  line-height:1.18 !important;
  white-space:nowrap !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud{
  left:28px !important;
  right:28px !important;
  bottom:129px !important;
  width:auto !important;
  max-width:calc(100% - 56px) !important;
  align-items:center !important;
  text-align:center !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  width:max-content !important;
  max-width:100% !important;
  align-self:center !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-title-so,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-title-much{
  width:100%;
  text-align:center;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  align-self:center !important;
  text-align:center !important;
  transform:translateX(10px);
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud{
  left:28px !important;
  right:28px !important;
  bottom:29px !important;
  width:auto !important;
  max-width:calc(100% - 56px) !important;
  align-items:flex-start !important;
  text-align:left !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  width:100% !important;
  max-width:100% !important;
  align-self:auto !important;
}

/* Scene 05/06 merge: keep the final right-rule after legacy Scene 06 overrides. */
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud{
  align-items:flex-start !important;
  text-align:right !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  width:100% !important;
  max-width:none !important;
  text-align:right !important;
  text-align-last:right !important;
}

/* Scene 05 finale: left-slammed two-stack question. */
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud{
  left:32px !important;
  right:32px !important;
  align-items:flex-start !important;
  text-align:left !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  text-align:left !important;
  text-align-last:left !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  display:none !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-combined-loop-title,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-combined-final-title{
  inset:0 auto auto 0;
  width:100%;
  text-align:left;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-columns{
  display:flex !important;
  flex-direction:row !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
  gap:clamp(28px,3vw,56px) !important;
  width:max-content !important;
  max-width:100% !important;
  margin:0 !important;
  text-align:left !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-column{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  width:max-content !important;
  max-width:100% !important;
  margin:0 !important;
  text-align:left !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-column > span{
  display:block !important;
  width:max-content !important;
  max-width:100% !important;
  font-family:'Archivo Black',sans-serif !important;
  font-size:60pt !important;
  font-weight:400 !important;
  line-height:.78 !important;
  letter-spacing:-.022em !important;
  white-space:nowrap !important;
  text-align:left !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-title-taken,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-title-leave{
  font-size:60pt !important;
}

/* Scene 05 finale: both stacks share the image-floor stopper. */
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-columns{
  width:100% !important;
  max-width:none !important;
  justify-content:space-between !important;
  align-items:flex-end !important;
  gap:0 !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-column{
  align-self:flex-end !important;
}

/* Scene 05 finale: lock the right stack to the actual inner right rule. */
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-combined-final-title{
  width:100% !important;
  min-width:100% !important;
  max-width:none !important;
  box-sizing:border-box !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-columns{
  width:100% !important;
  min-width:100% !important;
  max-width:none !important;
  box-sizing:border-box !important;
  justify-content:flex-start !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-column-right{
  margin-left:auto !important;
  margin-right:0 !important;
  transform:none !important;
}

/* Scene 05 finale: requested 100px right adjustment. */
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-column-right{
  transform:translateX(100px) !important;
}

/* Scene 05 finale: the right question stack moves 250px right. */
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-column-right{
  transform:translateX(250px) !important;
}

/* Scene 05 finale: honor the established 84px title baseline and both rules. */
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-combined-final-title{
  top:-56px !important;
  right:auto !important;
  bottom:auto !important;
  left:0 !important;
  display:block !important;
  width:100% !important;
  max-width:none !important;
  text-align:left !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-columns{
  width:100% !important;
  min-width:100% !important;
  max-width:none !important;
  justify-content:flex-start !important;
  align-items:flex-end !important;
  gap:0 !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-column-right{
  margin-left:auto !important;
}

/* Scene 03 final title: restored left rule, five-pixel increase. */
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"]:not(.is-hidden) ~ .architecture-story-hud.archi-story-copy{
  left:32px !important;
  right:32px !important;
  width:auto !important;
  max-width:none !important;
  align-items:flex-start !important;
  text-align:left !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v18"]:not(.is-hidden) ~ .architecture-story-hud.archi-story-copy .archi-story-title{
  position:relative !important;
  top:-3pt !important;
  left:0 !important;
  right:auto !important;
  display:block !important;
  width:max-content !important;
  max-width:100% !important;
  align-self:flex-start !important;
  margin:0 !important;
  text-align:left !important;
  text-align-last:left !important;
  white-space:nowrap !important;
  text-wrap:nowrap !important;
  font-size:55px !important;
  line-height:1.04 !important;
}

/* Scene 04: let the third loop claim the upper-right destination. */
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"]:not(.is-hidden) .architecture-community-motion-stage .architecture-mining-fullbleed-image,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"]:not(.is-hidden) .architecture-community-motion-stage .architecture-community-loop-map{
  transform-origin:100% 0% !important;
  animation:archiCommunityUpperRightZoom 12s ease-in-out 1 both !important;
  will-change:transform;
}

@keyframes archiCommunityUpperRightZoom{
  0%,34%{transform:scale(1);}
  46%{transform:scale(1.06);}
  62%{transform:scale(1.18);}
  78%{transform:scale(1.23);}
  100%{transform:scale(1.26);}
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  font-size:32pt !important;
}

@media(prefers-reduced-motion:reduce){
  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"]:not(.is-hidden) .architecture-community-motion-stage .architecture-mining-fullbleed-image,
  html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-community"]:not(.is-hidden) .architecture-community-motion-stage .architecture-community-loop-map{
    animation:none !important;
    transform:none !important;
  }
}

/* Scene 00 and Scene 02 use one measured block language: each word is a
   complete line, the anchor word sets the measure, and the other lines grow
   in real type size before the shared entrance begins. */
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v16"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  width:max-content !important;
  max-width:100% !important;
  white-space:nowrap !important;
  text-align:left !important;
  text-align-last:left !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title > span,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v16"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title > span{
  display:block !important;
  width:max-content !important;
  max-width:none !important;
  line-height:.94 !important;
  white-space:nowrap !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title .archi-scene00-title-gift-back{
  font-size:150% !important;
}

/* The three designed blocks share one ruled lower edge and one left origin. */
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"]:not(.is-hidden) ~ .architecture-story-hud.archi-copy-wall,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v16"]:not(.is-hidden) ~ .architecture-story-hud.archi-copy-start{
  top:auto !important;
  bottom:84px !important;
  left:32px !important;
  right:32px !important;
  align-items:flex-start !important;
  text-align:left !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-question-wall"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title > span{
  line-height:.86 !important;
}

/* Scene 11 final coda — a three-line block with the lower line kept quieter. */
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview.is-lake-sunset.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-nature-proves-stack{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  width:max-content !important;
  max-width:100% !important;
  font-size:80pt !important;
  line-height:.82 !important;
  row-gap:12px !important;
  position:relative !important;
  top:-15px !important;
  white-space:nowrap !important;
  text-wrap:nowrap !important;
  text-align:left !important;
  text-align-last:left !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview.is-lake-sunset.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-nature-proves-stack span{
  display:block;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-sipalay-v1"].is-overview.is-lake-sunset.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-nature-proves-stack .improve-word{
  font-size:68pt;
}

/* Scene 11 reference lock — measured from the supplied approved frame:
   preserve the left edge, keep the first line's measure, and scale the
   shorter words up so the three-line title carries one visual block. */
html body:not(.verticale-edition) #p3 #slideA11.is-overview.is-lake-sunset.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-nature-proves-stack{
  font-size:38pt !important;
  line-height:.82 !important;
  row-gap:12px !important;
  top:-15px !important;
}

html body:not(.verticale-edition) #p3 #slideA11.is-overview.is-lake-sunset.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud{
  left:32px !important;
  right:32px !important;
}

html body:not(.verticale-edition) #p3 #slideA11.is-overview.is-lake-sunset.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-nature-proves-stack .nature-proves-word{
  font-size:38pt !important;
  line-height:.82 !important;
}

html body:not(.verticale-edition) #p3 #slideA11.is-overview.is-lake-sunset.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-nature-proves-stack .man-must-word{
  font-size:56pt !important;
  line-height:.82 !important;
}

html body:not(.verticale-edition) #p3 #slideA11.is-overview.is-lake-sunset.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-nature-proves-stack .improve-word{
  font-size:68pt !important;
  line-height:.82 !important;
}

html body:not(.verticale-edition) #p3 #slideA11.is-overview.is-lake-sunset.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  margin-top:0 !important;
  font-size:22pt !important;
  line-height:1.28 !important;
  white-space:nowrap !important;
}

/* Keep the restored sunset title in its first approved lower-left position
   while the image changes from sunset-transition to settled sunset. */
html body:not(.verticale-edition) #p3 #slideA11.is-overview.is-lake-sunset-transition.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud.is-sunset-title-lock,
html body:not(.verticale-edition) #p3 #slideA11.is-overview.is-lake-sunset.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud.is-sunset-title-lock{
  left:32px !important;
  right:32px !important;
  top:auto !important;
  bottom:84px !important;
  width:auto !important;
  max-width:none !important;
  align-items:flex-start !important;
  text-align:left !important;
  transform:none !important;
}
html body:not(.verticale-edition) #p3 #slideA11.is-overview.is-lake-sunset-transition.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud.is-sunset-title-lock .archi-story-title,
html body:not(.verticale-edition) #p3 #slideA11.is-overview.is-lake-sunset.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud.is-sunset-title-lock .archi-story-title{
  align-self:flex-start !important;
  margin-left:0 !important;
  margin-right:0 !important;
  text-align:left !important;
  text-align-last:left !important;
}

/* Scene 10 title rhythm — keep the larger beat after Nature Proves,
   then let Man Must and Improve read as one tighter answering pair. */
html body:not(.verticale-edition) #p3 #slideA11.is-overview.is-lake-sunset.is-d11-sunset:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-nature-proves-stack .man-must-word{
  margin-bottom:-16px !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-title-so,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-title-much{
  width:auto;
  text-align:left;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  align-self:auto !important;
  text-align:left !important;
  transform:none;
  margin-left:0 !important;
  font-size:21pt !important;
  font-weight:700 !important;
  line-height:1.18 !important;
  letter-spacing:.005em !important;
  text-transform:uppercase !important;
  white-space:nowrap !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud{
  bottom:89px !important;
}

#p3 .archi-story-scene06-unit{
  display:contents;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud{
  align-items:center !important;
  text-align:center !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-scene06-unit{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  width:max-content;
  max-width:100%;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  width:max-content !important;
  max-width:100% !important;
  align-self:auto !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  align-self:flex-start !important;
  text-align:left !important;
  transform:none;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud{
  align-items:flex-start !important;
  text-align:left !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-scene06-unit{
  display:contents;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  width:100% !important;
  max-width:100% !important;
  align-self:auto !important;
}

/* Scene 05 finale: final precedence for the left-slammed two-stack title. */
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud{
  align-items:flex-start !important;
  left:32px !important;
  right:32px !important;
  text-align:left !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  width:100% !important;
  max-width:none !important;
  text-align:left !important;
  text-align-last:left !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-body{
  display:none !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-combined-loop-title,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-combined-final-title{
  inset:0 auto auto 0;
  width:100%;
  text-align:left;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-columns{
  display:flex !important;
  flex-direction:row !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
  gap:clamp(28px,3vw,56px) !important;
  width:max-content !important;
  max-width:100% !important;
  margin:0 !important;
  text-align:left !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-column{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  width:max-content !important;
  max-width:100% !important;
  margin:0 !important;
  text-align:left !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-column > span{
  display:block !important;
  width:max-content !important;
  max-width:100% !important;
  font-family:'Archivo Black',sans-serif !important;
  font-size:60pt !important;
  font-weight:400 !important;
  line-height:.78 !important;
  letter-spacing:-.022em !important;
  white-space:nowrap !important;
  text-align:left !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-title-taken,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-title-leave{
  font-size:60pt !important;
}

/* Scene 05 final authority: one inner-width frame, two ruled title stacks.
   This is the last Scene 05 rule so retired natural-width and nudge rules
   cannot move the right stack away from the image's inner right rule. */
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-combined-final-title{
  left:0 !important;
  right:auto !important;
  width:100% !important;
  min-width:100% !important;
  max-width:none !important;
  box-sizing:border-box !important;
  text-align:left !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-columns{
  display:flex !important;
  flex-direction:row !important;
  align-items:flex-end !important;
  justify-content:flex-start !important;
  width:100% !important;
  min-width:100% !important;
  max-width:none !important;
  gap:0 !important;
  margin:0 !important;
  box-sizing:border-box !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-column-left{
  flex:0 0 auto !important;
  width:max-content !important;
  max-width:none !important;
  margin:0 !important;
  align-self:flex-end !important;
  text-align:left !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-column-right{
  flex:0 0 auto !important;
  width:max-content !important;
  max-width:none !important;
  margin-left:auto !important;
  margin-right:0 !important;
  align-self:flex-end !important;
  transform:none !important;
  text-align:right !important;
}

/* Scene 05 rebuilt sequence: one title state at a time, driven by the
   same three beat markers as the passive reel. */
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-story-title{
  position:relative !important;
  opacity:1 !important;
  transform:none !important;
  filter:none !important;
  animation:none !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-combined-loop-title{
  display:block !important;
  visibility:visible !important;
  position:absolute !important;
  top:auto !important;
  left:0 !important;
  right:auto !important;
  bottom:0 !important;
  width:100% !important;
  max-width:none !important;
  font-family:'Archivo Black',sans-serif !important;
  font-size:40pt !important;
  line-height:1.02 !important;
  word-spacing:.12em !important;
  white-space:nowrap !important;
  text-align:left !important;
  opacity:1 !important;
  transform:none !important;
  animation:none !important;
  transition:opacity .16s linear !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"]:not(.is-hidden) ~ .architecture-story-hud .archi-combined-final-title{
  display:block !important;
  left:0 !important;
  right:auto !important;
  width:100% !important;
  text-align:left !important;
  opacity:0 !important;
  visibility:hidden !important;
  transform:none !important;
  animation:none !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-column-left,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-column-right{
  opacity:0 !important;
  transform:none !important;
  animation:none !important;
  transition:opacity .12s linear !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing.is-scene05-phase-loop:not(.is-hidden) ~ .architecture-story-hud .archi-combined-final-title,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing.is-scene05-phase-barren:not(.is-hidden) ~ .architecture-story-hud .archi-combined-final-title{
  opacity:0 !important;
  visibility:hidden !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing.is-scene05-phase-left:not(.is-hidden) ~ .architecture-story-hud .archi-combined-final-title,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing.is-scene05-phase-right:not(.is-hidden) ~ .architecture-story-hud .archi-combined-final-title{
  opacity:1 !important;
  visibility:visible !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing.is-scene05-phase-barren:not(.is-hidden) ~ .architecture-story-hud .archi-combined-loop-title,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing.is-scene05-phase-left:not(.is-hidden) ~ .architecture-story-hud .archi-combined-loop-title,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing.is-scene05-phase-right:not(.is-hidden) ~ .architecture-story-hud .archi-combined-loop-title{
  opacity:0 !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing.is-scene05-phase-left:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-column-left,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing.is-scene05-phase-right:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-column-left,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-playing.is-scene05-phase-right:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-column-right{
  opacity:1 !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-finished:not(.is-hidden) ~ .architecture-story-hud .archi-combined-loop-title{
  opacity:0 !important;
  transform:none !important;
  animation:none !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-finished:not(.is-hidden) ~ .architecture-story-hud .archi-combined-final-title,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-finished:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-column-left,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-architecture-passive-reel-finished:not(.is-hidden) ~ .architecture-story-hud .archi-scene06-final-column-right{
  opacity:1 !important;
  visibility:visible !important;
  transform:none !important;
  animation:none !important;
}

/* Scene 05 handoff: after the final two-beat hold, the barren ground drives
   rapidly into black and offers one deliberate click into the record. */
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-scene05-phase-black:not(.is-hidden){
  background:#000 !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-scene05-phase-black:not(.is-hidden) .architecture-v10-image-loops,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-scene05-phase-black:not(.is-hidden) .architecture-v10-image-reimagined,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-scene05-phase-black:not(.is-hidden) .architecture-v10-route-map{
  opacity:0 !important;
  animation:none !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-scene05-phase-black:not(.is-hidden) .architecture-v10-image-barren{
  animation:archiScene05BarrenPunchToBlack .6s cubic-bezier(.08,.9,.18,1) both !important;
  transform-origin:50% 50% !important;
  transition:none !important;
  will-change:opacity,transform,filter;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-scene05-phase-black:not(.is-hidden) .architecture-v10-image-ore{
  animation:archiScene05OreRushToBlack .6s cubic-bezier(.08,.9,.18,1) both !important;
  transform-origin:50% 50% !important;
  transition:none !important;
  will-change:opacity,transform,filter;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-scene05-handoff-ready:not(.is-hidden) .architecture-v10-image-barren{
  animation:none !important;
  opacity:0 !important;
  transform:scale(13.5) !important;
  filter:brightness(0) !important;
  transition:opacity .14s linear,filter .14s linear !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-scene05-handoff-ready:not(.is-hidden) .architecture-v10-image-ore{
  animation:none !important;
  opacity:0 !important;
  transform:scale(13.5) !important;
  filter:brightness(0) !important;
  transition:opacity .14s linear,filter .14s linear !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-scene05-phase-black:not(.is-hidden) ~ .architecture-story-hud .archi-combined-loop-title,
html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-scene05-phase-black:not(.is-hidden) ~ .architecture-story-hud .archi-combined-final-title{
  opacity:0 !important;
  visibility:hidden !important;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"] .archi-scene05-handoff{
  position:absolute;
  z-index:12;
  top:50%;
  left:50%;
  width:max-content;
  max-width:calc(100% - 64px);
  padding:0;
  border:0;
  background:transparent;
  color:#fff;
  font-family:'Archivo Black',sans-serif;
  font-size:40pt;
  font-weight:400;
  line-height:1;
  letter-spacing:.01em;
  white-space:nowrap;
  text-transform:none;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:18px;
  text-align:center;
  transform:translate(-50%,-50%);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  cursor:pointer;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"] .archi-scene05-handoff-title{
  display:block;
  font:inherit;
  line-height:1;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"] .archi-scene05-handoff-tagline{
  display:block;
  color:#fff;
  font-family:'IBM Plex Sans',sans-serif;
  font-size:21pt;
  font-weight:500;
  line-height:1.12;
  letter-spacing:.015em;
  white-space:nowrap;
  opacity:0;
  visibility:hidden;
  transform:translateY(8px);
  transition:opacity .18s linear,transform .18s ease-out;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-scene05-handoff-ready:not(.is-hidden) .archi-scene05-handoff{
  opacity:1;
  visibility:visible;
  pointer-events:none;
  animation:archiScene05HandoffIn .32s ease-out both;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-scene05-handoff-ready.is-scene05-handoff-tagline-ready:not(.is-hidden) .archi-scene05-handoff{
  pointer-events:auto;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-scene05-handoff-ready.is-scene05-handoff-tagline-ready:not(.is-hidden) .archi-scene05-handoff-tagline{
  opacity:1;
  visibility:visible;
  transform:none;
}

html body:not(.verticale-edition) #p3 [data-panel-id="architecture-mining-v10"].is-scene05-handoff-ready:not(.is-hidden) .archi-scene05-handoff:focus-visible{
  outline:2px solid #69be12;
  outline-offset:12px;
}

@keyframes archiScene05HandoffIn{
  from{opacity:0;transform:translate(-50%,-50%) scale(.97);}
  to{opacity:1;transform:translate(-50%,-50%) scale(1);}
}

@keyframes archiScene05BarrenPunchToBlack{
  0%{opacity:1;transform:translate3d(0,0,0) scale(1.035);filter:saturate(1.02) brightness(1);}
  32%{opacity:1;transform:translate3d(0,0,0) scale(1.35);filter:saturate(1) brightness(1);}
  52%{opacity:.5;transform:translate3d(0,0,0) scale(2);filter:saturate(.98) brightness(.96);}
  64%{opacity:0;transform:translate3d(0,0,0) scale(2.2);filter:saturate(.9) brightness(.8);}
  100%{opacity:0;transform:translate3d(0,0,0) scale(2.2);filter:saturate(.72) brightness(.18);}
}

@keyframes archiScene05OreRushToBlack{
  0%,35%{opacity:0;transform:translate3d(0,0,0) scale(1.02);filter:saturate(.55) brightness(.72) contrast(1.04);}
  48%{opacity:.28;transform:translate3d(0,0,0) scale(1.03);filter:saturate(.52) brightness(.72) contrast(1.06);}
  64%{opacity:.92;transform:translate3d(0,0,0) scale(1.08);filter:saturate(.48) brightness(.66) contrast(1.1);}
  78%{opacity:1;transform:translate3d(0,0,0) scale(2.6);filter:saturate(.43) brightness(.46) contrast(1.14);}
  100%{opacity:1;transform:translate3d(0,0,0) scale(13.5);filter:saturate(.38) brightness(.16) contrast(1.16);}
}

/* Scene 11 water-question coda — no lateral travel. The finished lake
   dissolves through a soft black curtain, then the question types from its
   left edge across the vertical centre. */
@keyframes architectureSipalayWaterQuestionBlackout{
  0%{opacity:0;}
  100%{opacity:1;}
}
html body:not(.verticale-edition) #p3 #slideA11.is-water-question-black:not(.is-hidden){
  background:#000 !important;
  overflow:hidden;
}
html body:not(.verticale-edition) #p3 #slideA11.is-water-question-black:not(.is-hidden)::after{
  content:'';
  position:absolute;
  inset:0;
  z-index:80;
  background:#000;
  opacity:1;
  pointer-events:none;
  animation:architectureSipalayWaterQuestionBlackout .45s ease-in-out both;
}
html body:not(.verticale-edition) #p3 #slideA11.is-water-question-black:not(.is-hidden) > *{
  opacity:0 !important;
  visibility:visible !important;
  transform:none !important;
  animation:none !important;
  transition:opacity .45s ease-in-out !important;
}
html body:not(.verticale-edition) #p3 #slideA11.is-water-question-black:not(.is-hidden) .architecture-sipalay-reel-sunset{
  transform:scale(1.025) !important;
  transition:opacity .45s ease-in-out !important;
}
html body:not(.verticale-edition) #p3 #slideA11.is-water-question-black:not(.is-hidden) ~ .architecture-story-hud{
  left:32px !important;
  right:32px !important;
  top:50% !important;
  bottom:auto !important;
  width:auto !important;
  max-width:none !important;
  align-items:center !important;
  text-align:center !important;
  transform:translate3d(0,-50%,0) !important;
  opacity:0 !important;
  visibility:visible !important;
  pointer-events:none !important;
  transition:opacity .45s ease-in-out !important;
}
html body:not(.verticale-edition) #p3 #slideA11.is-water-question-black:not(.is-hidden) ~ .architecture-story-hud.is-water-question-ready{
  opacity:1 !important;
  pointer-events:auto !important;
  transition:none !important;
}
html body:not(.verticale-edition) #p3 #slideA11.is-water-question-black:not(.is-hidden) ~ .architecture-story-hud .archi-story-title.is-water-question-title{
  max-width:none !important;
  width:100% !important;
  font-size:34pt !important;
  line-height:1 !important;
  white-space:nowrap !important;
  text-wrap:nowrap !important;
  text-align:center !important;
  text-align-last:center !important;
}