/* Sacralib V2.25 — owner-only V2 alignment on market, levels, patch notes, quests.
   Scenery follows the same inner-view model as V2.20; public UI is untouched. */
body.sv225-preview {
  --sv225-paper:#f6efe3; --sv225-line:#d6bea0;
}
body.sv225-preview #markettestView.active,
body.sv225-preview #patch-notesView.active {
  position:relative!important;
  isolation:isolate!important;
  overflow:visible!important;
  min-width:0!important;
}
@media(min-width:1551px) {
  /* Market scenery stays attached to its own view. */
  body.sv225-preview #markettestView.active::before,
  body.sv225-preview #markettestView.active::after {
    content:""!important; display:block!important;
    position:absolute!important; top:-42px!important;
    width:clamp(78px,5.8vw,116px)!important;
    aspect-ratio:160 / 2048!important; height:auto!important;
    background-repeat:no-repeat!important; background-size:100% 100%!important;
    pointer-events:none!important;z-index:-1!important;opacity:.87!important;
  }
  body.sv225-preview #markettestView.active::before {
    left:-102px!important; background-image:url('/assets/codex-v27-figma/side-left.webp')!important;
  }
  body.sv225-preview #markettestView.active::after {
    right:-102px!important; background-image:url('/assets/codex-v27-figma/side-right.webp')!important;
  }
  /* Patch notes share the view-anchored murals of Quests via V2.20.
     Do not draw a second pair on the inner feed layout. */
  /* Existing V2.20 figures were pushed to the outer viewport edge, leaving
     empty strips between illustration and the Experience content. */
  body.sv225-preview.sv218-page-theme.sv217-page-theme.sv216-page-theme.codex-site-v2-current
  #experienceView.active::before {left:-104px!important;top:-42px!important;}
  body.sv225-preview.sv218-page-theme.sv217-page-theme.sv216-page-theme.codex-site-v2-current
  #experienceView.active::after {right:-104px!important;top:-42px!important;}
}
@media(max-width:1550px) {
  /* The patch layout can sit over the existing body-edge artwork, so reserve
     actual side gutters rather than letting its third column overlap it. */
  body.sv225-preview #markettestView.active::before,
  body.sv225-preview #markettestView.active::after,
  body.sv225-preview #patch-notesView.active::before,
  body.sv225-preview #patch-notesView.active::after {display:none!important;content:none!important;}
}
@media(min-width:1200px) and (max-width:1550px) {
  /* Unlike article views, market was completely absent from V2.20 scenery
     selectors. At laptop widths its 2 decorative side rails fit in the
     unused space outside the market table, without covering any controls. */
  body.sv225-preview #markettestView.active::before,
  body.sv225-preview #markettestView.active::after {
    content:""!important; display:block!important;
    position:absolute!important; top:-42px!important;
    width:clamp(60px,5.2vw,82px)!important;
    aspect-ratio:160 / 2048!important; height:auto!important;
    background-repeat:no-repeat!important;background-size:100% 100%!important;
    pointer-events:none!important;z-index:-1!important;opacity:.86!important;
  }
  body.sv225-preview #markettestView.active::before {
    left:-92px!important; background-image:url('/assets/codex-v27-figma/side-left.webp')!important;
  }
  body.sv225-preview #markettestView.active::after {
    right:-92px!important; background-image:url('/assets/codex-v27-figma/side-right.webp')!important;
  }
}
/* Market: page is already a table — no card/grid conversions or new scroll traps. */
body.sv225-preview #markettestView.active .markettest-page {
  box-sizing:border-box!important;max-width:none!important;width:100%!important;
  margin-inline:auto!important;min-width:0!important;
}
@media(min-width:1551px) {
  /* The artwork extends 14px inside the view at its maximum 116px width:
     inset market content by 28px on each side for an unobstructed gap.
     Below 1551px the murals already end OUTSIDE the view. */
  body.sv225-preview #markettestView.active .markettest-page {
    width:calc(100% - 56px)!important;
    margin-inline:auto!important;
  }
}
body.sv225-preview #markettestView.active .markettest-heading {
  border-color:var(--sv225-line)!important;
  background:linear-gradient(165deg,#fffaf2,#f1e5cd)!important;
}
body.sv225-preview #markettestView.active .markettest-controls,
body.sv225-preview #markettestView.active .markettest-filters {min-width:0!important;max-width:100%!important;}
/* The footer is outside the market view, and used to reach the mural rails
   on both sides. Give it the same inner clearance as the market content. */
@media(min-width:1200px) {
  body.sv225-preview.markettest-mode #siteFooter {
    box-sizing:border-box!important;
    width:calc(100% - 2 * (var(--sv216-gutter) + 32px))!important;
    max-width:1840px!important;
    margin-inline:auto!important;
  }
}
/* Experience calculator: stretch into the full inner column while respecting
   its independent light/dark CSS variables and existing calculations. */
body.sv225-preview #experienceView.active,
body.sv225-preview #experienceView.active #experienceRoot {min-width:0!important;width:100%!important;max-width:none!important;}
body.sv225-preview #experienceView.active .exp-v33 {
  box-sizing:border-box!important;width:100%!important;max-width:none!important;
  padding:clamp(13px,1.45vw,23px)!important;
  margin:0!important;border-color:var(--ex-line)!important;
  background:var(--ex-paper)!important;border-radius:4px!important;
}
body.sv225-preview #experienceView.active :is(.exp-v33-planner,.exp-v33-levels) {
  border-color:var(--ex-line)!important;border-radius:4px!important;
  background:var(--ex-soft)!important;
}
body.sv225-preview #experienceView.active :is(.exp-v33-topfacts,.exp-v33-fields,.exp-v33-output,.exp-v33-cards) {min-width:0!important;}
body.sv225-preview #experienceView.active :is(.exp-v33-topfacts,.exp-v33-output,.exp-v33-fields)>* {min-width:0!important;}
/* Align patch notes with Quest and other inner pages. V2.23 preserves
   the responsive two-column feed, but no longer reduces its total width
   by 280/320px, which shifted murals towards the middle of the viewport. */
body.sv225-preview #patch-notesView.active .sv223-patch-layout {
  box-sizing:border-box!important;
  width:100%!important;
  max-width:none!important;
  margin-inline:auto!important;
}
body.sv225-preview #patch-notesView.active .sv223-patch-left {
  padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;
}
body.sv225-preview #patch-notesView.active .sv225-patch-nav {
  margin:0!important;width:100%!important;
  border:1px solid var(--sv225-line)!important;border-radius:4px!important;
  background:linear-gradient(145deg,#fffaf1,#f3e9d7)!important;
}
body.sv225-preview #patch-notesView.active .sv225-patch-nav .sv218-nav-heading {
  padding:13px 12px!important;margin:0!important;
}
body.sv225-preview #patch-notesView.active .sv225-patch-nav .sv218-nav-summary {cursor:pointer!important;}
body.sv225-preview #patch-notesView.active .sv225-patch-nav .sv218-nav-link {
  display:block!important;min-width:0!important;overflow-wrap:break-word!important;
}
/* The legacy chevron was drawn over the beginning of each label at narrow
   widths. The library categories already have their own disclosure arrows. */
body.sv225-preview #patch-notesView.active .sv225-patch-nav .sv218-nav-link::before {
  content:none!important;
}
body.sv225-preview #patch-notesView.active .sv225-patch-nav .sv218-nav-link {
  padding-inline:12px 8px!important;
}
body.sv225-preview #patch-notesView.active .sv225-patch-nav .sv218-nav-summary {
  display:flex!important;align-items:center!important;gap:9px!important;
  min-width:0!important;
}
body.sv225-preview #patch-notesView.active .sv225-patch-nav .sv218-nav-summary .sv217-nav-icon {
  flex:0 0 28px!important;width:28px!important;height:30px!important;
}
body.sv225-preview #patch-notesView.active .sv225-patch-nav .sv218-nav-summary > span {
  flex:1 1 auto!important;min-width:0!important;overflow-wrap:break-word!important;
}
body.sv225-preview #patch-notesView.active .sv225-patch-nav .sv218-nav-summary::after {
  flex:0 0 auto!important;
}

body.sv225-preview #patch-notesView.active .sv223-patch-main,
body.sv225-preview #patch-notesView.active .patch-notes-page {min-width:0!important;max-width:100%!important;}
/* Counter must stay inside the quest search toolbar, not spill past its edge. */
body.sv225-preview .quest-block.quest-v2-block .quest-v5-toolbar {
  box-sizing:border-box!important;width:100%!important;max-width:100%!important;min-width:0!important;
  grid-template-columns:minmax(180px,1.6fr) repeat(4,minmax(0,1fr))!important;
}
body.sv225-preview .quest-block.quest-v2-block .quest-v5-toolbar >* {min-width:0!important;max-width:100%!important;}
body.sv225-preview .quest-block.quest-v2-block .quest-v5-toolbar-actions {
  grid-column:1/-1!important;justify-self:stretch!important;justify-content:flex-end!important;
  min-width:0!important;max-width:100%!important;flex-wrap:wrap!important;
}
body.sv225-preview .quest-block.quest-v2-block .quest-v5-filter-status {
  white-space:normal!important;overflow-wrap:break-word!important;text-align:right!important;
}
@media(max-width:1100px) {
  body.sv225-preview .quest-block.quest-v2-block .quest-v5-toolbar {
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  body.sv225-preview .quest-block.quest-v2-block .quest-v5-search {grid-column:1/-1!important;}
}
@media(max-width:620px) {
  body.sv225-preview .quest-block.quest-v2-block .quest-v5-toolbar {grid-template-columns:minmax(0,1fr)!important;}
  body.sv225-preview .quest-block.quest-v2-block .quest-v5-toolbar-actions {grid-column:1!important;}
  body.sv225-preview #experienceView.active .exp-v33 {padding:10px!important;}
}

/* Visible, keyboard-operable manual refresh for freshly published Telegram posts. */
#patch-notesView .patch-notes-updates {
  display:flex;align-items:center;justify-content:space-between;
  gap:10px;flex-wrap:wrap;min-width:0;
}
#patch-notesView .patch-notes-updates .patch-notes-status {
  min-width:0;flex:1 1 260px;overflow-wrap:break-word;
}
#patch-notesView .patch-notes-refresh {
  flex:none;min-height:34px;padding:6px 11px;
  border:1px solid #c9ae8b;border-radius:4px;
  color:#743b2d;background:#f9f0de;
  font:600 13px/1.2 Georgia,serif;cursor:pointer;
}
#patch-notesView .patch-notes-refresh:hover {background:#efe0c7;}
#patch-notesView .patch-notes-refresh:disabled {opacity:.5;cursor:wait;}
#patch-notesView .patch-notes-refresh:focus-visible {outline:2px solid #845b31;outline-offset:2px;}

/* Patch notes + market side scenery uses the entire natural-height illustration.
   Its vertical fade is proportional to the image instead of a short fixed 455px
   segment; horizontal inner-edge feather is preserved.
   Preserve positions, aspect ratios, legible content gutters and all
   other routes' established artwork. Patch art lives on the view itself. */
@media (min-width:1200px) {
  body.sv225-preview #markettestView.active::before,
  body.sv225-preview #markettestView.active::after,
  body.sv225-preview #patch-notesView.active::before,
  body.sv225-preview #patch-notesView.active::after {
    /* The 160×2048 artwork is >1,000px tall at desktop rail widths.
       Fixed 455px mask hid nearly all of it, as seen in owner screenshots.
       Follow the natural image height so the mural continues down the page
       and disappears gradually before its actual bottom edge. */
    --sv225-mural-fade:linear-gradient(to bottom,
      #000 0%,#000 42%,rgba(0,0,0,.94) 59%,
      rgba(0,0,0,.7) 73%,rgba(0,0,0,.28) 89%,
      transparent 100%);
    -webkit-mask-image:var(--sv225-mural-fade)!important;
    mask-image:var(--sv225-mural-fade)!important;
    -webkit-mask-repeat:no-repeat!important;
    mask-repeat:no-repeat!important;
  }
  /* Composed masks feather the inside edge towards the parchment as well as
     the bottom, with an explicit single-gradient fallback above. */
  @supports (mask-composite:intersect) {
    body.sv225-preview #markettestView.active::before,
    body.sv225-preview #patch-notesView.active::before {
      -webkit-mask-image:var(--sv225-mural-fade),
        linear-gradient(to right,#000 0%,#000 55%,rgba(0,0,0,.75) 73%,transparent 100%)!important;
      mask-image:var(--sv225-mural-fade),
        linear-gradient(to right,#000 0%,#000 55%,rgba(0,0,0,.75) 73%,transparent 100%)!important;
      -webkit-mask-composite:source-in;
      mask-composite:intersect;
    }
    body.sv225-preview #markettestView.active::after,
    body.sv225-preview #patch-notesView.active::after {
      -webkit-mask-image:var(--sv225-mural-fade),
        linear-gradient(to left,#000 0%,#000 55%,rgba(0,0,0,.75) 73%,transparent 100%)!important;
      mask-image:var(--sv225-mural-fade),
        linear-gradient(to left,#000 0%,#000 55%,rgba(0,0,0,.75) 73%,transparent 100%)!important;
      -webkit-mask-composite:source-in;
      mask-composite:intersect;
    }
  }
}

/* Patch notes side categories honor the homepage artwork size setting. */
body.sv225-preview #patch-notesView.active .sv225-patch-nav
  .sv218-nav-summary .sv217-nav-icon {
  transform:scale(var(--sv2-icon-scale,1));
  transform-origin:center;
}
