/* KFFART V6.1 · Frameless AI Journey, precise in-glass screen + scrollable menu,
   with original-brain foreground above display and independent electric light.
   Isolated to the AI Journey route, never changes KFFART homepage. */

/* Only the Journey detail hides its top navigation; the in-scene return link
   and the mobile bottom bar remain operational. */
body:has(#detail-view.journey-view:not([hidden])) #topbar,
body:has(#detail-view.journey-view:not([hidden])) #mobile-menu{
  display:none!important;
}
body:has(#detail-view.journey-view:not([hidden])) .journey-copy{
  top:clamp(26px,4.0vh,48px)!important;
}
.journey-screen-perspective{
  /* Quad is inset strictly within the approved photo's original monitor.
     It is not a floating card: original physical bezel remains visible. */
  transform:matrix3d(
    0.2208431926,-0.2484615938,0,-0.0005535588,
    0.1078352874,0.8120245925,0,0.0000857878,
    0,0,1,0,
    982.0000000000,253.0000000000,0,1
  )!important;
  display:grid!important;
  grid-template-rows:37px minmax(0,1fr) 11px;
  align-items:stretch;
  box-sizing:border-box!important;
  padding:0;
  border:0!important;
  border-radius:2px!important;
  box-shadow:inset 0 0 11px rgba(42,139,255,.20)!important;
  background:linear-gradient(125deg,#071c37 0%,#06162f 65%,#081c3c 100%)!important;
  isolation:isolate;
  contain:paint;
}
.journey-screen-perspective::after{
  border:0;box-shadow:inset 0 0 10px rgba(86,178,255,.20)!important;
}
.journey-screen-heading{
  min-height:0!important;
  box-sizing:border-box;
  padding:10px 13px 8px!important;
  letter-spacing:.10em!important;
  white-space:nowrap;
  font-size:10px!important;
  line-height:16px;
  color:#b2dfff;
}
.journey-screen-tabs{
  min-height:0!important;
  height:100%;
  box-sizing:border-box;
  display:block!important;
  margin:0!important;
  padding:1px 7px 3px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:rgba(116,199,255,.68) transparent;
  scroll-behavior:smooth;
  pointer-events:auto;
}
.journey-screen-tabs::-webkit-scrollbar{width:5px;}
.journey-screen-tabs::-webkit-scrollbar-track{background:transparent;}
.journey-screen-tabs::-webkit-scrollbar-thumb{
  border-radius:12px;background:rgba(96,187,255,.51);
  border:1px solid rgba(23,76,135,.6);
}
.journey-screen-tab{
  height:40px!important;
  min-height:40px!important;
  margin:1px 0!important;
  padding:0 9px!important;
  border-radius:2px!important;
  grid-template-columns:31px 1fr 19px!important;
  line-height:1.15!important;
}
.journey-screen-tab .name{font-size:18px!important;}
.journey-screen-tab .arrow{font-size:18px!important;}
.journey-screen-bottom{
  height:1px!important;
  margin:5px 12px!important;
  align-self:start;
  opacity:.65;
}
.journey-lab-screen-ornament{display:none!important;}

/* Brain-light mask is sampled from the SOURCE image, not a screenshot.
   Only bright electrical structure is copied, so the brain can sit in front
   of the screen's extreme left edge but never intercept the tab clicks. */
.journey-brain-foreground{
  position:absolute;
  left:30.5024%;top:22.3167%;
  width:30.8014%;height:52.6036%;
  object-fit:fill;
  pointer-events:none;
  z-index:15;
  opacity:.61;
  mix-blend-mode:screen;
  filter:drop-shadow(0 0 10px rgba(102,202,255,.35));
}
.journey-brain-light{
  z-index:16!important;
  pointer-events:none;
  isolation:isolate;
}
.journey-brain-threads{
  z-index:2;
  pointer-events:none;
}

@media(max-width:1100px){
 .journey-screen-perspective{pointer-events:none!important;}
 .journey-chapters{pointer-events:auto;}
}
@media(max-width:650px){
 body:has(#detail-view.journey-view:not([hidden])) .journey-copy{
   top:clamp(22px,4.0vh,38px)!important;
 }
 /* Keep the photo brain visible from edge to edge without opaque header. */
 .journey-copy{max-width:350px;}
 .journey-return{color:#d1eaff!important;}
}
@media(prefers-reduced-motion:reduce){
  .journey-screen-tabs{scroll-behavior:auto!important;}
}
/* Deliberately tiny overlap, matching the reference brain's physical light spill. */
.journey-brain-foreground{
 opacity:.86!important;
 filter:drop-shadow(9px 0 10px rgba(85,202,255,.50))!important;
}