/* Sacralib V2: rune fusion calculator adapts to ARTICLE COLUMN width,
   not the browser viewport. Calculations, table columns and saved layout
   options remain unchanged. */
body.codex-article-v2-active .cv2-layout .article-body .rune-calculator {
  container: rune-widget / inline-size;
  display: grid;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  gap: clamp(12px, 1.4vw, 18px);
  padding: clamp(12px, 1.7vw, 20px);
  border: 1px solid #d4bf9d;
  border-radius: 6px;
  background: linear-gradient(155deg,#fffaf0 0%,#f4ead9 100%);
  box-shadow: 0 4px 18px rgba(63,43,26,.08), inset 0 1px rgba(255,255,255,.75);
  color: #32251c;
}
body.codex-article-v2-active .cv2-layout .article-body .rune-calculator *,
body.codex-article-v2-active .cv2-layout .article-body .rune-calculator *::before {
  box-sizing: border-box;
}
body.codex-article-v2-active .cv2-layout .article-body .rune-calculator-head {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px 14px;
  padding-bottom: 11px;
  border-bottom: 1px solid #ddc9ac;
}
body.codex-article-v2-active .cv2-layout .article-body .rune-calculator h3 {
  max-width: 100%;
  font: 600 clamp(20px, 1.9vw, 28px)/1.2 Georgia,serif;
  overflow-wrap: anywhere;
  letter-spacing: 0;
}
body.codex-article-v2-active .cv2-layout .article-body .rune-calculator-head > span {
  color: #875b34;
  font: 700 11px/1.35 Georgia,serif;
  letter-spacing: .04em;
}
body.codex-article-v2-active .cv2-layout .article-body .rune-calculator-main {
  display: grid;
  gap: 14px;
  min-width: 0;
  max-width: 100%;
}
body.codex-article-v2-active .cv2-layout .article-body
.rune-calculator.result-right .rune-calculator-main {
  grid-template-columns: minmax(0,min(48%,var(--rune-table-width,460px))) minmax(0,1fr);
  align-items: start;
}
body.codex-article-v2-active .cv2-layout .article-body
.rune-calculator :is(.rune-calculator-panel,.rune-calculator-table-wrap,.rune-calculator-result) {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
body.codex-article-v2-active .cv2-layout .article-body .rune-calculator-panel {gap:12px;}
body.codex-article-v2-active .cv2-layout .article-body .rune-calculator-table-wrap {
  overflow-x: auto;
  overscroll-behavior-x: contain;
  border: 1px solid #ddc9ac;
  border-radius: 5px;
  background: #fffaf0;
}
body.codex-article-v2-active .cv2-layout .article-body .rune-calculator-table {
  width: 100%;
  min-width: 350px;
  margin: 0;
  border: 0;
  background: transparent;
}
body.codex-article-v2-active .cv2-layout .article-body .rune-calculator-table :is(th,td) {
  padding: 7px 9px;
  border-color: #e2d2bb;
  overflow-wrap: anywhere;
}
body.codex-article-v2-active .cv2-layout .article-body .rune-calculator-table thead th {
  background: #efe0c4;
  color: #754323;
  font: 700 12px/1.35 Georgia,serif;
  letter-spacing: 0;
}
body.codex-article-v2-active .cv2-layout .article-body .rune-calculator-table tbody th {
  font: 600 clamp(13px,1vw,15px)/1.35 Georgia,serif;
}
body.codex-article-v2-active .cv2-layout .article-body .rune-calculator :is(input,select) {
  max-width: 100%;
  min-width: 0;
  border-radius: 4px;
  border-color: #bfa98a;
  background: #fffdf6;
  color: #33261c;
}
body.codex-article-v2-active .cv2-layout .article-body .rune-calculator :is(input,select):focus-visible {
  outline: 2px solid #97643d;
  outline-offset: 2px;
}
body.codex-article-v2-active .cv2-layout .article-body .rune-calculator-target {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 12px;
  border: 1px solid #ddc9ac;
  border-radius: 5px;
  background: rgba(255,252,246,.65);
}
body.codex-article-v2-active .cv2-layout .article-body .rune-calculator-target label {
  flex: 1 1 155px;
  min-width: 0;
  color: #6d482b;
  letter-spacing: 0;
}
body.codex-article-v2-active .cv2-layout .article-body .rune-calculator-result {
  display: grid;
  align-content: start;
  gap: 12px;
  padding: 12px;
  border: 1px solid #ddc9ac;
  border-radius: 5px;
  background: rgba(255,253,247,.72);
}
body.codex-article-v2-active .cv2-layout .article-body .rune-result-summary {
  grid-template-columns: auto minmax(0,1fr) auto;
  min-width: 0;
  padding: 12px;
  border: 1px solid #e1ceb0;
  border-left: 4px solid #9f6042;
  border-radius: 4px;
  background: #fbf0dc;
}
body.codex-article-v2-active .cv2-layout .article-body .rune-result-summary.enough {
  border-left-color: #53764b;
  background: #edf3e5;
}
body.codex-article-v2-active .cv2-layout .article-body .rune-result-section {
  min-width: 0;
  padding: 0;
}
body.codex-article-v2-active .cv2-layout .article-body .rune-result-section h4 {
  margin: 0 0 9px;
  padding-bottom: 6px;
  border-bottom: 1px solid #e3d5c0;
  color: #713e26;
  font: 700 14px/1.35 Georgia,serif;
  letter-spacing: 0;
}
body.codex-article-v2-active .cv2-layout .article-body .rune-buy-table,
body.codex-article-v2-active .cv2-layout .article-body .rune-missing-list {
  width: 100%;
  max-width: 100%;
}
body.codex-article-v2-active .cv2-layout .article-body .rune-missing-list {
  grid-template-columns: repeat(auto-fit,minmax(min(100%,185px),1fr));
}
body.codex-article-v2-active .cv2-layout .article-body .rune-recipe-list {
  overflow-wrap: anywhere;
}

/* 13-inch laptops, sidebars and nested columns all use the calculator's
   measured space. The old viewport-only media query cannot detect these. */
@container rune-widget (max-width: 850px) {
  body.codex-article-v2-active .cv2-layout .article-body
  .rune-calculator.result-right .rune-calculator-main {
    grid-template-columns: minmax(0,1fr);
  }
  body.codex-article-v2-active .cv2-layout .article-body .rune-result-summary {
    grid-template-columns: minmax(0,1fr);
    align-items: start;
    gap: 5px;
  }
}
@container rune-widget (max-width: 460px) {
  body.codex-article-v2-active .cv2-layout .article-body .rune-calculator-target {
    padding: 9px;
  }
  body.codex-article-v2-active .cv2-layout .article-body .rune-calculator-target label {
    flex-basis: 100%;
  }
  body.codex-article-v2-active .cv2-layout .article-body .rune-calculator-table {
    min-width: 345px;
  }
  body.codex-article-v2-active .cv2-layout .article-body .rune-calculator-result {
    padding: 10px;
  }
}

/* Both theme modes keep usable contrast when the global V2 design is active. */
body.codex-article-v2-active:is(.theme-dark,.dark-mode) .cv2-layout .article-body .rune-calculator {
  background: linear-gradient(155deg,#302820,#25221e);
  border-color: #776148;
  color: #f2e6d4;
}
body.codex-article-v2-active:is(.theme-dark,.dark-mode) .cv2-layout .article-body
.rune-calculator :is(.rune-calculator-table-wrap,.rune-calculator-target,.rune-calculator-result) {
  background: #322b25;
  border-color: #78634d;
  color: #eee3d3;
}
body.codex-article-v2-active:is(.theme-dark,.dark-mode) .cv2-layout .article-body
.rune-calculator :is(h3,.rune-result-summary strong,.rune-calculator-table tbody th) {color:#f4e9d8;}
body.codex-article-v2-active:is(.theme-dark,.dark-mode) .cv2-layout .article-body
.rune-calculator :is(label,.rune-calculator-head>span,.rune-result-section h4,.rune-calculator-table thead th) {color:#e8c89b;}
body.codex-article-v2-active:is(.theme-dark,.dark-mode) .cv2-layout .article-body
.rune-calculator .rune-calculator-table thead th {background:#443629;}
body.codex-article-v2-active:is(.theme-dark,.dark-mode) .cv2-layout .article-body
.rune-calculator :is(input,select) {background:#3d342b;border-color:#8b745b;color:#fff0dc;}
body.codex-article-v2-active:is(.theme-dark,.dark-mode) .cv2-layout .article-body
.rune-calculator .rune-result-summary {background:#40302b;border-color:#88634d;color:#f3e7d5;}
body.codex-article-v2-active:is(.theme-dark,.dark-mode) .cv2-layout .article-body
.rune-calculator .rune-result-summary.enough {background:#303d2d;border-left-color:#9eb892;}
body.codex-article-v2-active:is(.theme-dark,.dark-mode) .cv2-layout .article-body
.rune-calculator .rune-result-section h4 {border-color:#685440;}