/* v1.6.5 — move category tab text toward the outside edge.
   Final layer, shared by live and editor. Requires .tab-label generated by includes/render.php. */
:root{
  --nc-v165-tab-visible-lip:70px;
  --nc-v165-tab-face:58px;
  --nc-v165-label-outset:10px;
}
html body .magazine-shell .tabs.left{
  left:calc(-1 * var(--nc-v165-tab-visible-lip))!important;
}
html body .magazine-shell .tabs.right{
  right:calc(-1 * var(--nc-v165-tab-visible-lip))!important;
}
html body .magazine-shell .tab{
  width:var(--nc-v165-tab-face)!important;
  min-width:var(--nc-v165-tab-face)!important;
  max-width:var(--nc-v165-tab-face)!important;
  display:block!important;
  position:relative!important;
  overflow:hidden!important;
  padding:0!important;
  text-indent:-9999px!important; /* hide fallback raw text if browser keeps it outside label */
}
html body .magazine-shell .tab .tab-label{
  position:absolute!important;
  top:50%!important;
  left:50%!important;
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-height:calc(100% - 10px)!important;
  transform:translate(-50%,-50%)!important;
  writing-mode:vertical-rl!important;
  text-orientation:mixed!important;
  text-indent:0!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:clip!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:9.5px!important;
  line-height:1!important;
  letter-spacing:.02em!important;
  font-weight:900!important;
  text-transform:uppercase!important;
  color:#1f1609!important;
  text-shadow:0 1px 0 rgba(255,255,255,.72)!important;
  z-index:3!important;
  pointer-events:none!important;
}
/* Exterior text alignment: left tabs push label left; right tabs push label right. */
html body .magazine-shell .tabs.left .tab .tab-label{
  left:calc(50% - var(--nc-v165-label-outset))!important;
}
html body .magazine-shell .tabs.right .tab .tab-label{
  left:calc(50% + var(--nc-v165-label-outset))!important;
}
/* Keep physical paper edge highlight toward the visible lip. */
html body .magazine-shell .tabs.left .tab::after{
  right:auto!important;
  left:0!important;
  width:8px!important;
  background:linear-gradient(90deg,rgba(255,255,255,.62),rgba(86,61,25,.18))!important;
}
html body .magazine-shell .tabs.right .tab::after{
  left:auto!important;
  right:0!important;
  width:8px!important;
  background:linear-gradient(270deg,rgba(255,255,255,.62),rgba(86,61,25,.18))!important;
}
/* Active category remains readable after the label shift. */
html body .magazine-shell .tab.is-active .tab-label,
html body .magazine-shell .tab[aria-current="true"] .tab-label{
  color:#171006!important;
  font-weight:900!important;
}
@media (max-width:980px){
  :root{--nc-v165-tab-visible-lip:58px; --nc-v165-tab-face:50px; --nc-v165-label-outset:8px;}
  html body .magazine-shell .tab .tab-label{font-size:8.4px!important;}
}

/* v12.10.1 — category labels may split into two vertical columns so long names fit inside the physical tabs. */
html body .magazine-shell .tab .tab-label{
  display:flex!important;
  flex-direction:row-reverse!important;
  align-items:center!important;
  justify-content:center!important;
  gap:2px!important;
  width:calc(100% - 8px)!important;
  height:calc(100% - 12px)!important;
  max-height:calc(100% - 12px)!important;
  writing-mode:horizontal-tb!important;
  white-space:normal!important;
  overflow:hidden!important;
  text-align:center!important;
}
html body .magazine-shell .tab .tab-label .tab-line{
  display:block!important;
  writing-mode:vertical-rl!important;
  text-orientation:mixed!important;
  white-space:nowrap!important;
  line-height:1!important;
  max-height:100%!important;
  overflow:hidden!important;
}
html body .magazine-shell .tab .tab-label .tab-line:only-child{margin:0 auto!important;}
html body .magazine-shell .tabs.left .tab .tab-label,
html body .magazine-shell .tabs.right .tab .tab-label{
  left:50%!important;
}
@media (max-width:980px){
  html body .magazine-shell .tab .tab-label{gap:1px!important;}
  html body .magazine-shell .tab .tab-label .tab-line{font-size:8px!important;}
}

/* v12.10.3 — center category label inside the exposed tab lip, 5px away from the page cover edge. */
html body .magazine-shell .tabs.left .tab .tab-label{
  left:calc(50% - 5px)!important;
}
html body .magazine-shell .tabs.right .tab .tab-label{
  left:calc(50% + 5px)!important;
}
