/* v1.6.2 — hard single-source magazine component geometry.
   Loaded LAST in live and editor. This file deliberately ignores older tab/book rules. */
:root{
  --nc-book-ratio: 1.72;
  --nc-book-width: min(1260px, calc(100vw - 320px), calc((100vh - 230px) * 1.72));
  --nc-tab-w: 44px;
  --nc-tab-visible: 32px;
  --nc-tab-top: 7.2%;
  --nc-tab-bottom: 7.2%;
  --nc-stack-w: 42px;
}

body:not(.nc-editor-page) .stage,
body.nc-editor-page .nc-canvas{
  display:grid !important;
  place-items:center !important;
  box-sizing:border-box !important;
  overflow:visible !important;
}
body:not(.nc-editor-page) .stage{
  min-height:calc(100vh - 158px) !important;
  padding:24px 0 116px !important;
}
body.nc-editor-page .nc-canvas{
  position:fixed !important;
  inset:0 !important;
  width:100vw !important;
  height:100vh !important;
  padding:70px 0 86px !important;
  background:radial-gradient(circle at 50% 48%, rgba(76,43,18,.54), #050302 72%) !important;
}

/* The book itself: identical in live and editor. */
.magazine-shell,
body.nc-editor-page .nc-canvas .magazine-shell,
body:not(.nc-editor-page) .stage .magazine-shell{
  width:var(--nc-book-width) !important;
  height:auto !important;
  aspect-ratio:var(--nc-book-ratio) !important;
  max-width:none !important;
  min-width:0 !important;
  margin:0 auto !important;
  position:relative !important;
  overflow:visible !important;
  display:block !important;
  transform:none !important;
  filter:none !important;
}
.magazine-shell .book-wrap{
  width:100% !important;
  height:100% !important;
  aspect-ratio:var(--nc-book-ratio) !important;
  position:relative !important;
  overflow:visible !important;
  isolation:isolate !important;
  margin:0 !important;
  transform:none !important;
}
.magazine-shell .book{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  z-index:60 !important;
  overflow:visible !important;
  transform:none !important;
}
.magazine-shell .spread{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  display:none !important;
  grid-template-columns:1fr 1fr !important;
  z-index:70 !important;
  overflow:visible !important;
}
.magazine-shell .spread.is-active{display:grid !important;}
.magazine-shell .page{
  position:relative !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  overflow:hidden !important;
  z-index:90 !important;
}
.magazine-shell .page-safe-area,
.magazine-shell .folio{position:relative !important; z-index:96 !important;}
.magazine-shell .spine{z-index:125 !important;}

/* Page stack remains BEHIND open sheets. */
.magazine-shell .stack-left,
.magazine-shell .stack-right{
  position:absolute !important;
  top:2.4% !important;
  bottom:2.4% !important;
  width:var(--nc-stack-w) !important;
  z-index:14 !important;
  opacity:1 !important;
  pointer-events:none !important;
  border-radius:12px !important;
  background:
    linear-gradient(90deg,rgba(71,47,18,.55),rgba(255,245,202,.42) 20%,rgba(221,190,113,.72) 54%,rgba(107,73,24,.48) 86%),
    repeating-linear-gradient(90deg,#5b3e17 0 1px,#9c732b 1px 2px,#d8bc72 2px 4px,#fff1b9 4px 6px,#9c7127 6px 7px) !important;
  box-shadow:inset 8px 0 8px rgba(255,250,224,.40), inset -12px 0 14px rgba(43,27,9,.48), 0 16px 24px rgba(0,0,0,.45) !important;
}
.magazine-shell .stack-left{left:calc(-1 * var(--nc-stack-w) + 8px) !important;}
.magazine-shell .stack-right{right:calc(-1 * var(--nc-stack-w) + 8px) !important;}

/* Reference integrated index tabs. They are below the open pages; only outside lips are visible. */
.magazine-shell .tabs{
  position:absolute !important;
  top:var(--nc-tab-top) !important;
  bottom:var(--nc-tab-bottom) !important;
  width:var(--nc-tab-w) !important;
  padding:2px 0 !important;
  display:flex !important;
  flex-direction:column !important;
  gap:0 !important;
  z-index:31 !important;
  pointer-events:auto !important;
  overflow:visible !important;
  transform:none !important;
  filter:drop-shadow(0 8px 9px rgba(0,0,0,.34)) !important;
}
.magazine-shell .tabs.left{left:calc(-1 * var(--nc-tab-visible)) !important; right:auto !important; align-items:flex-end !important;}
.magazine-shell .tabs.right{right:calc(-1 * var(--nc-tab-visible)) !important; left:auto !important; align-items:flex-start !important;}

.magazine-shell .tabs::before{
  content:"" !important;
  position:absolute !important;
  top:-2% !important;
  bottom:-2% !important;
  width:18px !important;
  z-index:0 !important;
  pointer-events:none !important;
  background:linear-gradient(90deg,rgba(255,249,218,.82),rgba(198,164,83,.70),rgba(70,46,17,.38)),repeating-linear-gradient(0deg,rgba(93,68,29,.18) 0 1px,rgba(255,255,255,.20) 1px 5px) !important;
  box-shadow:inset 0 0 10px rgba(0,0,0,.26) !important;
}
.magazine-shell .tabs.left::before{right:0 !important;border-radius:0 9px 9px 0 !important;}
.magazine-shell .tabs.right::before{left:0 !important;border-radius:9px 0 0 9px !important;}

.magazine-shell .tab{
  position:relative !important;
  z-index:1 !important;
  flex:1 1 0 !important;
  width:40px !important;
  min-height:0 !important;
  height:auto !important;
  margin:0 !important;
  padding:0 2px !important;
  border:1px solid rgba(112,84,42,.62) !important;
  color:#23180a !important;
  background:linear-gradient(90deg,#fff9e8 0%,#efe0b4 36%,#c7a361 70%,#876027 100%),repeating-linear-gradient(0deg,rgba(255,255,255,.17) 0 1px,transparent 1px 5px) !important;
  font-family:Arial,Helvetica,sans-serif !important;
  font-size:9px !important;
  line-height:1 !important;
  letter-spacing:.01em !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
  writing-mode:vertical-rl !important;
  text-orientation:mixed !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-shadow:0 1px 0 rgba(255,255,255,.72) !important;
  box-shadow:inset 1px 0 0 rgba(255,255,255,.75), inset -8px 0 10px rgba(78,52,20,.25), 0 2px 4px rgba(0,0,0,.23) !important;
  transform:none !important;
  overflow:hidden !important;
}
.magazine-shell .tabs.left .tab{border-radius:8px 2px 2px 8px !important;}
.magazine-shell .tabs.right .tab{border-radius:2px 8px 8px 2px !important;}
.magazine-shell .tab + .tab{margin-top:-1px !important;}
.magazine-shell .tab::before{
  content:"" !important; position:absolute !important; inset:0 !important; border-radius:inherit !important; pointer-events:none !important;
  background:linear-gradient(180deg,rgba(255,255,255,.56),transparent 46%,rgba(78,55,25,.20)) !important;
}
.magazine-shell .tab::after{
  content:"" !important; position:absolute !important; top:0 !important; bottom:0 !important; width:6px !important; pointer-events:none !important;
  background:linear-gradient(90deg,rgba(255,255,255,.55),rgba(67,46,18,.30)) !important;
}
.magazine-shell .tabs.left .tab::after{right:0 !important;}
.magazine-shell .tabs.right .tab::after{left:0 !important;}
.magazine-shell .tab.is-active,
.magazine-shell .tab[aria-current="true"]{
  background:linear-gradient(90deg,#ffeb86 0%,#e0b21c 60%,#9a680e 100%),repeating-linear-gradient(0deg,rgba(255,255,255,.15) 0 1px,transparent 1px 5px) !important;
  border-color:rgba(105,70,9,.78) !important;
  box-shadow:inset 1px 0 0 rgba(255,255,255,.65), inset -8px 0 10px rgba(90,56,7,.27), 0 3px 7px rgba(0,0,0,.31) !important;
}

/* Open page edge masks the inserted part of the tabs. */
.magazine-shell .page.left{
  box-shadow:inset -58px 0 48px rgba(54,35,17,.32), inset 18px 0 10px rgba(255,244,196,.30), -10px 0 0 rgba(246,229,169,.95), -22px 0 0 rgba(143,105,46,.48), inset 0 0 42px rgba(90,55,17,.18) !important;
}
.magazine-shell .page.right{
  box-shadow:inset 58px 0 48px rgba(54,35,17,.28), inset -18px 0 10px rgba(255,244,196,.30), 10px 0 0 rgba(246,229,169,.95), 22px 0 0 rgba(143,105,46,.48), inset 0 0 42px rgba(90,55,17,.18) !important;
}

/* Editor selection must be an overlay only; never changes book/tab geometry. */
body.nc-editor-page .nc-canvas .page.is-active-page::after{
  content:"" !important;
  position:absolute !important;
  inset:12px !important;
  border:2px solid rgba(58,185,255,.9) !important;
  border-radius:5px !important;
  box-shadow:0 0 0 2px rgba(0,0,0,.12) !important;
  pointer-events:none !important;
  z-index:180 !important;
  background:transparent !important;
}
body.nc-editor-page .nc-select-chip{z-index:300 !important;}
body.nc-editor-page .nc-editor-topline{z-index:320 !important;}

@media (max-width: 980px){
  :root{--nc-book-width:min(94vw, calc((100vh - 190px) * 1.45)); --nc-tab-visible:24px; --nc-tab-w:34px;}
  .magazine-shell .tab{width:32px !important;font-size:7.5px !important;}
}
