/* SHARED REEL CONTROL — REVISION 302
   REEL lights green while a timed scene is moving. NEXT carries one permanent
   inset signal lens: green arrow at rest, red illumination while the reel runs. */

body:not(.verticale-edition) :is(#p1,#p2,#p3,#p5,#p6,#p7) .view-rail.has-reel-instrument .scene-unspool-control{
  grid-template-rows:auto 38px;
  align-content:center;
  gap:1px;
  padding-top:2px;
  padding-bottom:2px;
}

body:not(.verticale-edition) :is(#p1,#p2,#p3,#p5,#p6,#p7) .scene-unspool-control .scene-unspool-caption{
  grid-row:1;
  align-self:end;
  transform:translateX(-18px);
  color:rgba(255,255,255,.62);
  font-size:9px;
  letter-spacing:.20em;
  text-indent:.20em;
}

body:not(.verticale-edition) :is(#p1,#p2,#p3,#p5,#p6,#p7) .scene-unspool-control .scene-unspool-icon{
  grid-row:2;
  align-self:start;
  transform:translateX(-18px);
}

body:not(.verticale-edition) :is(#p1,#p2,#p3,#p5,#p6,#p7) .scene-unspool-control.is-reel-active{
  color:#9cff54;
  background:radial-gradient(ellipse at center,rgba(117,230,13,.25),rgba(82,160,4,.07) 64%,transparent 74%);
  box-shadow:inset 0 0 18px rgba(117,230,13,.13);
}

body:not(.verticale-edition) :is(#p1,#p2,#p3,#p5,#p6,#p7) .scene-unspool-control.is-reel-active .scene-unspool-caption{
  color:#9cff54;
  text-shadow:0 0 5px rgba(117,230,13,.58);
}

/* Once Scene 10's power field has completed its one-second running cue,
   keep that cue legible while NEXT returns to its quiet green state. */
body:not(.verticale-edition) :is(#p1,#p2,#p3,#p5,#p6,#p7) .portal-shell:has(.architecture-sipalay-slide.is-sipalay-power-running) .scene-unspool-control .scene-unspool-caption{
  color:#9cff54;
  text-shadow:0 0 5px rgba(117,230,13,.58);
}

body:not(.verticale-edition) :is(#p1,#p2,#p3,#p5,#p6,#p7) .scene-unspool-control.is-reel-active .scene-unspool-eye,
body:not(.verticale-edition) :is(#p1,#p2,#p3,#p5,#p6,#p7) .scene-unspool-control.is-reel-active .scene-unspool-reel,
body:not(.verticale-edition) :is(#p1,#p2,#p3,#p5,#p6,#p7) .scene-unspool-control.is-reel-active .scene-unspool-arc{
  opacity:1;
  filter:drop-shadow(0 0 2px rgba(156,255,84,.72));
}

/* BACK and NEXT share one exact, mirrored triangle. Their invisible seats are
   equal, so the red reel signal can appear without shifting the control. */
body:not(.verticale-edition) :is(#p1,#p2,#p3,#p5,#p6,#p7).page .banatti-journey-selector > .portal-nav .portal-nav-arrow{
  position:relative;
  display:block;
  flex:0 0 15px;
  width:15px;
  height:15px;
  box-sizing:border-box;
  overflow:visible;
  clip-path:none !important;
  border:0;
  border-radius:0;
  color:transparent !important;
  font-size:0;
  line-height:0;
  text-shadow:none;
  background:transparent !important;
  box-shadow:none !important;
  filter:none !important;
}

body:not(.verticale-edition) :is(#p1,#p2,#p3,#p5,#p6,#p7).page .banatti-journey-selector > .portal-nav:first-of-type .portal-nav-arrow{
  transform:translateY(-1px) !important;
}

body:not(.verticale-edition) :is(#p1,#p2,#p3,#p5,#p6,#p7).page .banatti-journey-selector > .portal-nav:last-of-type .portal-nav-arrow{
  transform:translateY(-2px) !important;
}

body:not(.verticale-edition) :is(#p1,#p2,#p3,#p5,#p6,#p7).page .banatti-journey-selector > .portal-nav .portal-nav-arrow::after{
  content:'';
  position:absolute;
  left:50%;
  top:50%;
  width:9px;
  height:10px;
  background:#58a90a;
  filter:drop-shadow(0 0 2px rgba(82,160,4,.38));
  transform:translate(-50%,-50%);
}

body:not(.verticale-edition) :is(#p1,#p2,#p3,#p5,#p6,#p7).page .banatti-journey-selector > .portal-nav:first-of-type .portal-nav-arrow::after{
  clip-path:polygon(100% 0,0 50%,100% 100%);
}

body:not(.verticale-edition) :is(#p1,#p2,#p3,#p5,#p6,#p7).page .banatti-journey-selector > .portal-nav:last-of-type .portal-nav-arrow::after{
  clip-path:polygon(0 0,100% 50%,0 100%);
}

body:not(.verticale-edition) :is(#p1,#p2,#p3,#p6,#p7) .portal-shell.is-forward-navigation-locked > .portal-status > .portal-nav:last-of-type,
body:not(.verticale-edition) #p5.page.is-forward-navigation-locked .showroom-nav > .portal-nav:last-of-type{
  opacity:1 !important;
  color:rgba(255,255,255,.96) !important;
  text-shadow:0 0 5px rgba(228,255,199,.24) !important;
}

body:not(.verticale-edition) :is(#p1,#p2,#p3,#p6,#p7) .portal-shell.is-forward-navigation-locked > .portal-status > .portal-nav:last-of-type::after,
body:not(.verticale-edition) #p5.page.is-forward-navigation-locked .showroom-nav > .portal-nav:last-of-type::after{
  background:
    radial-gradient(ellipse 124% 122% at 50% 2%,rgba(1,8,0,.40) 0%,rgba(3,14,0,.19) 42%,rgba(3,14,0,0) 78%),
    radial-gradient(ellipse 128% 126% at 50% 98%,rgba(228,255,199,.14) 0%,rgba(183,240,118,.07) 42%,rgba(117,230,13,0) 78%),
    linear-gradient(180deg,rgb(54,110,7) 0%,rgb(45,92,5) 44%,rgb(36,74,4) 100%) !important;
  box-shadow:
    inset 0 4px 7px rgba(1,9,0,.196),
    inset 0 -2px 4px rgba(225,255,194,.207),
    inset 7px 0 10px rgba(2,12,0,.08),
    inset -7px 0 10px rgba(2,12,0,.08),
    0 0 0 1px rgba(117,230,13,.17),
    0 0 6px rgba(82,160,4,.08) !important;
  filter:drop-shadow(0 0 4px rgba(117,230,13,.13)) !important;
}

body:not(.verticale-edition) :is(#p1,#p2,#p3,#p6,#p7) .portal-shell.is-forward-navigation-locked > .portal-status > .portal-nav:last-of-type .portal-nav-arrow,
body:not(.verticale-edition) #p5.page.is-forward-navigation-locked .showroom-nav > .portal-nav:last-of-type .portal-nav-arrow{
  display:block;
  flex:0 0 15px;
  width:15px;
  height:15px;
  box-sizing:border-box;
  overflow:visible;
  clip-path:none !important;
  border:0;
  border-radius:0;
  color:transparent !important;
  font-size:0;
  line-height:0;
  text-shadow:none;
  background:transparent !important;
  box-shadow:none !important;
  filter:none !important;
  transform:translateY(-2px) !important;
  animation:none;
}

body:not(.verticale-edition) :is(#p1,#p2,#p3,#p6,#p7) .portal-shell.is-forward-navigation-locked > .portal-status > .portal-nav:last-of-type .portal-nav-arrow::after,
body:not(.verticale-edition) #p5.page.is-forward-navigation-locked .showroom-nav > .portal-nav:last-of-type .portal-nav-arrow::after{
  z-index:1;
  background-image:linear-gradient(100deg,#78bd2b 0%,#8cdc35 34%,#e5ffc0 49%,#8cdc35 64%,#78bd2b 100%) !important;
  background-size:260% 100% !important;
  background-position:130% 0 !important;
  animation:banatGreenFlou .72s linear infinite !important;
  filter:drop-shadow(0 0 5px rgba(117,230,13,.48)) !important;
}

@media (hover:hover) and (pointer:fine){
  body:not(.verticale-edition) :is(#p1,#p2,#p3,#p5,#p6,#p7).page .banatti-journey-selector > .portal-nav:not(:disabled):is(:hover,.banatti-actuator-hovering) .portal-nav-arrow::after{
    background-image:linear-gradient(100deg,#78bd2b 0%,#8cdc35 34%,#e5ffc0 49%,#8cdc35 64%,#78bd2b 100%) !important;
    background-size:260% 100% !important;
    background-position:130% 0 !important;
    animation:banatGreenFlou .72s linear infinite !important;
    filter:drop-shadow(0 0 5px rgba(117,230,13,.48)) !important;
  }
}

/* Keep the chosen arrow in its moving flou-green state after the click is
   released. The View Lens draws the same state with its paired arrow marks. */
body:not(.verticale-edition) :is(#p1,#p2,#p3,#p5,#p6,#p7).page .banatti-journey-selector > .portal-nav:not(:disabled).banatti-actuator-engaged .portal-nav-arrow::after{
  background-image:linear-gradient(100deg,#78bd2b 0%,#8cdc35 34%,#e5ffc0 49%,#8cdc35 64%,#78bd2b 100%) !important;
  background-size:260% 100% !important;
  background-position:130% 0 !important;
  animation:banatGreenFlou .72s linear infinite !important;
  filter:drop-shadow(0 0 5px rgba(117,230,13,.48)) !important;
}

body:not(.verticale-edition) :is(#p1,#p2,#p3,#p6,#p7) .portal-shell.is-forward-navigation-locked > .portal-status > .portal-nav:last-of-type .portal-nav-arrow::before,
body:not(.verticale-edition) #p5.page.is-forward-navigation-locked .showroom-nav > .portal-nav:last-of-type .portal-nav-arrow::before{
  content:'';
  position:absolute;
  left:50%;
  top:50%;
  width:12px;
  height:12px;
  border:0;
  border-radius:1px;
  background:#e33b1d;
  box-shadow:0 0 4px rgba(227,59,29,.30);
  transform:translate(-50%,-50%);
  animation:architectureReelSignalGlow 1.8s ease-in-out infinite;
}

/* The red square takes the inner NEXT mark's place while playback is active.
   Hide only that mark so no green tip peeks out beneath the square. */
body:not(.verticale-edition) :is(#p1,#p2,#p3,#p6,#p7) .portal-shell.is-forward-navigation-locked > .portal-status > .portal-nav:last-of-type .portal-nav-arrow::after,
body:not(.verticale-edition) #p5.page.is-forward-navigation-locked .showroom-nav > .portal-nav:last-of-type .portal-nav-arrow::after{
  content:none !important;
  display:none !important;
  animation:none !important;
}

/* View Lens draws its directional marks as child shapes and suppresses these
   pseudo-elements. During a mini-reel, replace only the inner forward arrow
   with the same red stop square; leave the outer fast-forward marks in place. */
body.banatti-view-lens-host:not(.verticale-edition) :is(#p1,#p2,#p3,#p6,#p7).page .portal-shell.is-forward-navigation-locked > .portal-status > .portal-nav:last-of-type .portal-nav-arrow::before,
body.banatti-view-lens-host:not(.verticale-edition) #p5.page.is-forward-navigation-locked .showroom-nav > .portal-nav:last-of-type .portal-nav-arrow::before{
  content:'' !important;
  display:block !important;
  position:absolute !important;
  left:11.155px !important;
  top:24.513px !important;
  width:12px !important;
  height:12px !important;
  border:0 !important;
  border-radius:0 !important;
  background:#e33b1d !important;
  box-shadow:none !important;
  transform:translate(-50%,-50%) !important;
  animation:architectureReelSignalGlow 1.8s ease-in-out infinite !important;
  z-index:2 !important;
}

body.banatti-view-lens-host:not(.verticale-edition) :is(#p1,#p2,#p3,#p6,#p7).page .portal-shell.is-forward-navigation-locked > .portal-status > .portal-nav:last-of-type .mstr-directional-mark-single,
body.banatti-view-lens-host:not(.verticale-edition) #p5.page.is-forward-navigation-locked .showroom-nav > .portal-nav:last-of-type .mstr-directional-mark-single{
  opacity:0 !important;
  visibility:hidden !important;
  background-image:none !important;
  animation:none !important;
  filter:none !important;
}

@media (hover:hover) and (pointer:fine){
  body.banatti-view-lens-host:not(.verticale-edition) :is(#p1,#p2,#p3,#p5,#p6,#p7).page .portal-status > .portal-nav:not(:disabled).banatti-actuator-hovering-single .mstr-directional-mark-single,
  body.banatti-view-lens-host:not(.verticale-edition) :is(#p1,#p2,#p3,#p5,#p6,#p7).page .portal-status > .portal-nav:not(:disabled).banatti-actuator-hovering-fast .mstr-directional-mark-double{
    background-image:linear-gradient(100deg,#78bd2b 0%,#8cdc35 34%,#e5ffc0 49%,#8cdc35 64%,#78bd2b 100%) !important;
    background-size:260% 100% !important;
    background-position:130% 0 !important;
    animation:banatGreenFlou .72s linear infinite !important;
    filter:drop-shadow(0 0 5px rgba(117,230,13,.48)) !important;
  }
}

@keyframes architectureReelSignalGlow{
  0%,100%{
    box-shadow:0 0 4px rgba(239,61,37,.26);
  }
  50%{
    box-shadow:0 0 7px rgba(239,61,37,.42);
  }
}

@media (prefers-reduced-motion:reduce){
  body:not(.verticale-edition) :is(#p1,#p2,#p3,#p6,#p7) .portal-shell.is-forward-navigation-locked > .portal-status > .portal-nav:last-of-type .portal-nav-arrow::before,
  body:not(.verticale-edition) #p5.page.is-forward-navigation-locked .showroom-nav > .portal-nav:last-of-type .portal-nav-arrow::before{
    animation:none;
  }
}