:root{
  --bg:#120e0b;
  --panel:#201813;
  --panel2:#2a2018;
  --text:#e9ddc6;
  --muted:#aa9680;
  --line:#4a3728;
  --blue:#b88948;
  --purple:#8e643b;
  --cyan:#c2a064;
  --green:#6f8d58;
  --orange:#c88739;
  --pink:#9b5b45;
  --red:#a54a38;
  --gold:#d6ad5a;
  --gold-soft:#f0d995;
  --bronze:#8c623b;
  --shadow:0 12px 30px rgba(0,0,0,.28);
  --shadow2:0 18px 42px rgba(0,0,0,.42);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 16% 0%,rgba(149,92,42,.16),transparent 31%),
    radial-gradient(circle at 88% 4%,rgba(97,57,33,.18),transparent 28%),
    linear-gradient(180deg,#17100c,#100c09 48%,#15100c);
}
button,input,select{font:inherit}
.wrap{
  width:min(1180px,calc(100% - 28px));
  max-width:none;
  margin:auto;
  padding:0 0 42px;
}

/* ===== Header ===== */
.topbar{
  position:sticky;
  top:0;
  z-index:60;
  min-height:70px;
  margin:0 -14px 18px;
  padding:10px 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  background:rgba(20,14,10,.9);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(91,64,39,.8);
  box-shadow:0 6px 24px rgba(0,0,0,.18);
}
.eyebrow{
  color:var(--muted);
  font-size:.68rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.12em;
}
.topbar h1{
  margin:2px 0 0;
  color:#f0dfbd;
  font-size:1.22rem;
  line-height:1.1;
  letter-spacing:-.01em;
}
.status{
  color:var(--muted);
  font-size:.72rem;
  font-weight:700;
  text-align:right;
}
.status.ok{color:#a9bd91}
.status.err{color:#d98d7c}

/* ===== Main control bar ===== */
.toolbar{
  position:sticky;
  top:70px;
  z-index:50;
  display:grid;
  grid-template-columns:170px 245px minmax(180px,1fr) 90px 105px;
  gap:8px;
  margin-bottom:10px;
  padding:8px;
  background:rgba(32,24,19,.95);
  backdrop-filter:blur(12px);
  border:1px solid var(--line);
  border-radius:14px;
  box-shadow:var(--shadow);
}
select,input{
  min-width:0;
  height:36px;
  border:1px solid #4a3728;
  border-radius:8px;
  outline:none;
  background:#17110d;
  color:var(--text);
  padding:7px 9px;
  font-size:.74rem;
}
select:focus,input:focus{
  border-color:#b07a3d;
  box-shadow:0 0 0 3px rgba(176,122,61,.12);
}
input::placeholder{color:#806f5f}
button{
  border:1px solid #4f3928;
  border-radius:8px;
  background:linear-gradient(180deg,#211913,#1b140f);
  color:#cbb99f;
  font-size:.72rem;
  font-weight:800;
  padding:7px 10px;
  cursor:pointer;
  transition:.15s ease;
}
button:hover{
  background:#2b2018;
  border-color:#745437;
  color:#ecd7aa;
}
#expandAll{
  color:#1b110a;
  border-color:#d8ae5c;
  background:linear-gradient(135deg,#d9ad58,#9d6534);
}
#expandAll:hover{filter:brightness(1.06)}

/* ===== Info note + section navigation ===== */
.source-note{
  margin:0 0 10px;
  padding:9px 11px;
  border:1px solid #5b422c;
  border-radius:10px;
  background:linear-gradient(180deg,#241b15,#1b1410);
  color:#bda98f;
  font-size:.69rem;
  line-height:1.5;
}
.source-note b{color:#e0c582}
.source-note code{
  color:#d6ad5a;
  background:#17110d;
  border:1px solid #3d2d22;
  border-radius:5px;
  padding:1px 4px;
}
.section-nav{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  margin:0 0 14px;
}
.section-nav a{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:5px 9px;
  border:1px solid var(--line);
  border-radius:999px;
  background:#211913;
  color:#b9a58e;
  font-size:.68rem;
  font-weight:750;
  text-decoration:none;
}
.section-nav a:hover{
  background:#2b2018;
  border-color:#745437;
  color:#dfc899;
}

/* ===== Modifier sections ===== */
.section{
  margin:0 0 16px;
  padding:0;
  background:linear-gradient(180deg,rgba(36,27,21,.98),rgba(27,20,16,.98));
  border:1px solid var(--line);
  border-radius:16px;
  box-shadow:var(--shadow);
  overflow:hidden;
  scroll-margin-top:125px;
}
.section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  margin:0;
  padding:11px 13px;
  background:linear-gradient(180deg,#2a2018,#211812);
  border-bottom:1px solid #4a3728;
}
.section-head h2{
  margin:0;
  color:#f0dfbd;
  font-size:.95rem;
  line-height:1.2;
}
.section-head small{
  color:#8f7d68;
  font-size:.64rem;
  font-weight:700;
}
.cols{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  background:#4a3728;
}
.box{
  min-width:0;
  background:#17110d;
}
.box.full{grid-column:1/-1}
.box h3{
  margin:0;
  padding:8px 10px;
  background:#1d1611;
  border-bottom:1px solid #3d2d22;
  color:#d9c7a7;
  font-size:.72rem;
  font-weight:850;
  text-transform:none;
}

/* ===== Modifier rows ===== */
.modgroup{
  position:relative;
  border-top:1px solid #36281f;
}
.modgroup:first-of-type{border-top:0}
.modsum{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
  align-items:center;
  min-height:42px;
  padding:6px 9px;
  background:#201813;
  cursor:pointer;
  transition:background .13s ease;
}
.modsum:hover{background:#2a2018}
.modsum>div:first-child{min-width:0}
.modtitle{
  color:#d9bd7b;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  font-size:.70rem;
  line-height:1.35;
  font-weight:800;
  text-transform:none;
  letter-spacing:0;
  overflow-wrap:anywhere;
}
.modtype{
  display:block;
  margin-top:2px;
  color:#806f5f;
  font-size:.58rem;
  line-height:1.2;
}
.chips{
  display:inline-flex;
  gap:3px;
  flex-wrap:wrap;
  margin-left:5px;
  vertical-align:middle;
}
.chip{
  display:inline-flex;
  padding:2px 4px;
  border:1px solid #4d3828;
  border-radius:5px;
  background:#38291f;
  color:#ceb184;
  font-size:.49rem;
  line-height:1;
  font-weight:800;
}
.chip:nth-child(2n){background:#31251d;color:#d6b36e}
.chip:nth-child(3n){background:#263026;color:#aeb98d}
.nums{
  display:flex;
  align-items:center;
  gap:3px;
  font-size:.56rem;
  font-weight:850;
}
.pill{
  min-width:22px;
  padding:3px 5px;
  border-radius:999px;
  color:#eadfca;
  text-align:center;
  border:1px solid rgba(255,255,255,.08);
}
.pill.green{background:#31402f;color:#b9cf9f;border-color:#475b41}
.pill.gray{background:#332a24;color:#b9aa9b;border-color:#4d4036}
.pill.red{background:#41251f;color:#d8a293;border-color:#65372d}

/* ===== Expanded tier table ===== */
.detail{
  display:none;
  background:#17110d;
  overflow:auto;
}
.detail.open{display:block}
table{
  width:100%;
  min-width:620px;
  border-collapse:collapse;
  font-size:.66rem;
}
th,td{
  padding:7px 8px;
  border-top:1px solid #3d2d22;
  text-align:left;
  vertical-align:top;
}
th{
  position:sticky;
  top:0;
  z-index:1;
  background:#211913;
  color:#9d8c7a;
  font-size:.60rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.03em;
}
td{color:#d8cab4}
td.tier,.tier{color:#e0be78;font-weight:850}
td.affix,.affix{color:#c99c59}
tbody tr:hover td{background:#241a14}
.empty,.loading{
  padding:24px;
  color:var(--muted);
  text-align:center;
  font-size:.73rem;
}
.warning{
  margin:0;
  padding:12px;
  border:1px solid #5b422c;
  border-radius:10px;
  background:#241a14;
  color:#c5aa79;
  font-size:.72rem;
}

/* ===== Grouped item-class menu ===== */
.native-class-select{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  opacity:0!important;
  pointer-events:none!important;
}
.class-picker{
  position:relative;
  min-width:0;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
}
.class-picker-btn{
  width:100%;
  height:36px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:7px 9px;
  border:1px solid #4a3728;
  border-radius:8px;
  background:#17110d;
  color:#e9ddc6;
  font-size:.72rem;
  font-weight:750;
  box-shadow:none;
}
.class-picker-btn:hover,.class-picker.open .class-picker-btn{
  background:#2b2018;
  border-color:#745437;
  color:#f0d995;
}
.class-picker-arrow{
  color:#aa9680;
  font-size:.58rem;
  transition:transform .15s ease;
}
.class-picker.open .class-picker-arrow{transform:rotate(180deg)}
.class-picker-menu{
  display:none;
  position:absolute;
  z-index:1000;
  top:calc(100% + 7px);
  left:0;
  width:min(920px,calc(100vw - 42px));
  max-height:min(72vh,620px);
  overflow:auto;
  padding:6px 10px;
  border:1px solid #4a3728;
  border-radius:12px;
  background:rgba(29,22,17,.985);
  box-shadow:var(--shadow2);
  backdrop-filter:blur(12px);
}
.class-picker.open .class-picker-menu{display:block}
.class-menu-row{
  display:grid;
  grid-template-columns:130px minmax(0,1fr);
  gap:7px;
  align-items:start;
  min-height:28px;
  padding:5px 0;
  border-bottom:1px solid rgba(74,55,40,.72);
}
.class-menu-row:last-child{border-bottom:0}
.class-menu-group{
  padding:2px 0 0 1px;
  color:#8f7d68;
  font-size:.65rem;
  line-height:1.5;
  white-space:nowrap;
}
.class-menu-links{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  min-width:0;
}
.class-menu-item{
  appearance:none;
  border:0!important;
  background:transparent!important;
  padding:2px 4px!important;
  margin:0!important;
  color:#d6ad5a!important;
  font-size:.66rem!important;
  line-height:1.45!important;
  font-weight:720!important;
  border-radius:5px!important;
  box-shadow:none!important;
  white-space:nowrap;
}
.class-menu-item:hover{
  color:#f0d995!important;
  background:#2b2018!important;
}
.class-menu-item.active{
  color:#1b110a!important;
  background:linear-gradient(135deg,#d9ad58,#9d6534)!important;
}
.class-menu-sep{
  color:#6f5b48;
  padding:0 1px;
  font-size:.55rem;
}

/* ===== Hover Tier popup ===== */
.tier-hover-tooltip{
  display:none;
  position:fixed;
  z-index:99999;
  min-width:560px;
  max-width:820px;
  max-height:72vh;
  overflow:auto;
  background:#17110d;
  border:1px solid #745437;
  border-radius:12px;
  box-shadow:var(--shadow2);
  pointer-events:none;
}
.tier-hover-tooltip.show{display:block}
.tier-hover-title{
  padding:8px 10px;
  color:#e7c982;
  font-size:.72rem;
  font-weight:850;
  border-bottom:1px solid #4a3728;
  background:#241a14;
}
.tier-hover-tooltip table{
  min-width:620px;
  width:100%;
  font-size:.64rem;
}
.tier-hover-tooltip th,
.tier-hover-tooltip td{
  padding:6px 7px;
  border-top:1px solid #38291f;
  text-align:left;
  white-space:nowrap;
}
.tier-hover-tooltip td:nth-child(3){
  min-width:250px;
  white-space:normal;
}

/* ===== Scrollbar ===== */
*{scrollbar-width:thin;scrollbar-color:#5a402c #17110d}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-track{background:#17110d}
::-webkit-scrollbar-thumb{background:#5a402c;border:2px solid #17110d;border-radius:999px}
::-webkit-scrollbar-thumb:hover{background:#745437}

/* ===== Responsive ===== */
@media(max-width:950px){
  .toolbar{grid-template-columns:1fr 1fr;top:70px}
  .cols{grid-template-columns:1fr}
  .box.full{grid-column:auto}
}
@media(max-width:760px){
  .wrap{width:min(100% - 20px,1180px)}
  .topbar{margin-left:-10px;margin-right:-10px}
  .class-picker-menu{width:min(96vw,700px)}
  .class-menu-row{grid-template-columns:1fr;gap:2px;padding:6px 0}
  .class-menu-group{font-size:.62rem;color:#aa9680}
  .class-menu-item{font-size:.64rem!important}
  .tier-hover-tooltip{min-width:0;max-width:92vw}
  .tier-hover-tooltip table{min-width:620px}
}
@media(max-width:560px){
  .toolbar{grid-template-columns:1fr}
  .topbar{align-items:flex-start}
  .status{text-align:left}
}


/* ===== Typography refinement: MOD uppercase, lighter UI ===== */

/* Modifier text: always uppercase, no bold */
.modtitle{
  text-transform:uppercase !important;
  font-weight:400 !important;
  letter-spacing:.01em;
}

/* Modifier text inside tier/detail tables */
.detail td:nth-child(3),
.tier-hover-tooltip td:nth-child(3),
.tier-hover-title{
  text-transform:uppercase;
  font-weight:400 !important;
}

/* Reduce boldness throughout the database UI */
.topbar h1{font-weight:650}
.status{font-weight:500}
button{font-weight:600}
#expandAll{font-weight:650}
.source-note b{font-weight:650}
.section-nav a{font-weight:550}
.section-head h2{font-weight:650}
.section-head small{font-weight:500}
.box h3{font-weight:600}
.modtype{font-weight:400}
.chip{font-weight:550}
.nums{font-weight:600}
td.tier,.tier{font-weight:600}
th{font-weight:600}
.class-picker-btn{font-weight:550}
.class-menu-item{font-weight:500 !important}


/* Hide internal mod/stat name shown below each modifier row */
.modtype{
  display:none !important;
}


/* ===== Ultra compact modifier rows ===== */
.modsum{
  min-height:28px !important;
  padding:3px 7px !important;
  gap:5px !important;
}
.modgroup{
  border-top:1px solid #34271f !important;
}
.modtitle{
  font-size:.66rem !important;
  line-height:1.15 !important;
}
.chips{
  gap:2px !important;
  margin-left:4px !important;
}
.chip{
  padding:1px 4px !important;
  font-size:.46rem !important;
  line-height:1.05 !important;
}
.nums{
  gap:2px !important;
  font-size:.52rem !important;
}
.pill{
  min-width:20px !important;
  padding:2px 4px !important;
  line-height:1.05 !important;
}
.box h3{
  padding:6px 8px !important;
}
.section-head{
  padding:8px 10px !important;
}


/* ===== Modifier source tabs: replace content in-place, no page scrolling ===== */
.section-nav{
  align-items:center;
  margin-bottom:10px !important;
}
.section-nav .section-tab{
  min-height:26px;
  padding:4px 8px;
  border:1px solid #4a3728;
  border-radius:7px;
  background:#211913;
  color:#b9a58e;
  font-size:.64rem;
  line-height:1.2;
  font-weight:500;
  cursor:pointer;
  box-shadow:none;
}
.section-nav .section-tab:hover{
  background:#2b2018;
  border-color:#745437;
  color:#dfc899;
}
.section-nav .section-tab.active{
  color:#1b110a;
  border-color:#d8ae5c;
  background:linear-gradient(135deg,#d9ad58,#9d6534);
}
#activeModifierPanel{
  margin-top:0;
}


/* ===== PoE2DB-like modifier/tag colors ===== */

/* Main modifier text */
.modtitle{
  color:#a7a2ff !important;
  font-size:.66rem !important;
  font-weight:400 !important;
  line-height:1.15 !important;
}

/* Tags: same text size as modifier */
.chip{
  font-size:.66rem !important;
  line-height:1.05 !important;
  font-weight:600 !important;
  padding:1px 4px !important;
  border-radius:5px !important;
  border:1px solid rgba(255,255,255,.10) !important;
  vertical-align:middle;
}

/* Semantic tag palette inspired by the reference */
.chip.tag-damage{
  background:#b51f2d !important;
  color:#ff6570 !important;
  border-color:#d53848 !important;
}
.chip.tag-physical{
  background:#315c73 !important;
  color:#8dd7ff !important;
  border-color:#487f99 !important;
}
.chip.tag-fire{
  background:#6a4930 !important;
  color:#ff9b56 !important;
  border-color:#8a5c39 !important;
}
.chip.tag-cold{
  background:#315f78 !important;
  color:#9bdcff !important;
  border-color:#4b829d !important;
}
.chip.tag-lightning{
  background:#5f5422 !important;
  color:#ffd45b !important;
  border-color:#83742f !important;
}
.chip.tag-chaos{
  background:#563f66 !important;
  color:#cf9cff !important;
  border-color:#76588a !important;
}
.chip.tag-resistance{
  background:#35555d !important;
  color:#a9e5f1 !important;
  border-color:#4a7079 !important;
}
.chip.tag-life{
  background:#8d3a43 !important;
  color:#ff9aa3 !important;
  border-color:#a94f59 !important;
}
.chip.tag-mana{
  background:#355983 !important;
  color:#b3d6ff !important;
  border-color:#4b72a0 !important;
}
.chip.tag-attack{
  background:#8a4a2c !important;
  color:#ffae72 !important;
  border-color:#a8613f !important;
}
.chip.tag-caster{
  background:#2f6875 !important;
  color:#a6edf7 !important;
  border-color:#47808c !important;
}
.chip.tag-attribute{
  background:#456b8f !important;
  color:#d8ebff !important;
  border-color:#5c82a6 !important;
}
.chip.tag-defence{
  background:#44626f !important;
  color:#b9dbe8 !important;
  border-color:#5d7a86 !important;
}
.chip.tag-resource{
  background:#735a37 !important;
  color:#f2d38f !important;
  border-color:#8b7048 !important;
}
.chip.tag-drop{
  background:#725624 !important;
  color:#f5d36e !important;
  border-color:#8d6f31 !important;
}
.chip.tag-default{
  background:#3a3f45 !important;
  color:#d6d9dc !important;
  border-color:#50565d !important;
}


/* ===== PoE2DB-style tag presentation ===== */
.chip{
  color:#f3f5f7 !important;
  font-size:.66rem !important;
  font-weight:650 !important;
  border:0 !important;
  padding:2px 4px !important;
  border-radius:5px !important;
}
.chip.tag-damage{background:#c31f2d !important;color:#ff5360 !important}
.chip.tag-physical{background:#427ca0 !important;color:#b7dcf2 !important}
.chip.tag-fire{background:#c66c36 !important;color:#ffe1cb !important}
.chip.tag-cold{background:#4b8bb1 !important;color:#d8f0ff !important}
.chip.tag-lightning{background:#bd8b27 !important;color:#fff0b2 !important}
.chip.tag-chaos{background:#795a92 !important;color:#ead7ff !important}
.chip.tag-resistance{background:#3f718d !important;color:#eef8ff !important}
.chip.tag-life{background:#a84750 !important;color:#ffd9dc !important}
.chip.tag-mana{background:#3d6e9f !important;color:#edf6ff !important}
.chip.tag-attack{background:#bf6837 !important;color:#ffe0cc !important}
.chip.tag-caster{background:#408498 !important;color:#e6fbff !important}
.chip.tag-attribute{background:#4d82b0 !important;color:#f1f8ff !important}
.chip.tag-defence{background:#4c7486 !important;color:#e8f5fa !important}
.chip.tag-resource{background:#80643d !important;color:#fff0c7 !important}
.chip.tag-drop{background:#7b5e2c !important;color:#ffe9a8 !important}
.chip.tag-default{background:#4b5964 !important;color:#f0f3f5 !important}


/* ===== Jewel-specific tags use the same color system as item modifiers ===== */
.chip.tag-ailment{
  background:#506b78 !important;
  color:#eef8ff !important;
}
.chip.tag-minion{
  background:#4f6f83 !important;
  color:#eff8ff !important;
}
.chip.tag-aura{
  background:#526f80 !important;
  color:#eef8ff !important;
}
.chip.tag-block{
  background:#456b7f !important;
  color:#eef8ff !important;
}
.chip.tag-warcry{
  background:#8a4e35 !important;
  color:#ffe2d2 !important;
}
.chip.tag-totem{
  background:#73572f !important;
  color:#ffeab1 !important;
}


/* ===== Canonical tag palette: Jewel + normal item modifiers =====
   Same visible tag = same colour everywhere. */
.chip.tag-elemental,
.chip.tag-ailment,
.chip.tag-critical,
.chip.tag-charm,
.chip.tag-minion,
.chip.tag-aura,
.chip.tag-block{
  background:#456c80 !important;
  color:#f1f8ff !important;
}

.chip.tag-damage{
  background:#c52636 !important;
  color:#ff6974 !important;
}

.chip.tag-attack,
.chip.tag-warcry{
  background:#bd6738 !important;
  color:#ffe0cb !important;
}

.chip.tag-physical{
  background:#4a84a5 !important;
  color:#d5efff !important;
}

.chip.tag-fire,
.chip.tag-fire-resistance{
  background:#c56b38 !important;
  color:#ffe2cf !important;
}

.chip.tag-cold,
.chip.tag-cold-resistance{
  background:#4d8caf !important;
  color:#dcf2ff !important;
}

.chip.tag-lightning,
.chip.tag-lightning-resistance{
  background:#b88b27 !important;
  color:#fff0b5 !important;
}

.chip.tag-chaos,
.chip.tag-chaos-resistance{
  background:#77598f !important;
  color:#ead9ff !important;
}

.chip.tag-resistance,
.chip.tag-elemental-resistance{
  background:#416f89 !important;
  color:#eef9ff !important;
}

.chip.tag-life{
  background:#a44750 !important;
  color:#ffdadd !important;
}

.chip.tag-mana{
  background:#3f6f9f !important;
  color:#eef7ff !important;
}

.chip.tag-resource{
  background:#82653c !important;
  color:#fff0c6 !important;
}

.chip.tag-attribute{
  background:#4d81ac !important;
  color:#f1f8ff !important;
}

.chip.tag-caster,
.chip.tag-speed{
  background:#3e8191 !important;
  color:#ebfcff !important;
}

.chip.tag-defence,
.chip.tag-armour,
.chip.tag-evasion,
.chip.tag-energy-shield{
  background:#487386 !important;
  color:#ecf8fd !important;
}

.chip.tag-bleed,
.chip.tag-poison,
.chip.tag-ignite{
  background:#506e7c !important;
  color:#eef9ff !important;
}

.chip.tag-totem,
.chip.tag-drop{
  background:#7a5c2f !important;
  color:#ffebaf !important;
}


/* ===== FINAL UNIFIED TAG PALETTE =====
   Jewel / item / Liquid Emotions all use exactly the same colours.
   Keep this block last so legacy nth-child and earlier tag rules cannot alter it. */
.chips .chip{
  font-size:.66rem !important;
  line-height:1.05 !important;
  font-weight:650 !important;
  padding:2px 4px !important;
  border:0 !important;
  border-radius:5px !important;
  color:#fff !important;
  box-shadow:none !important;
}

.chips .chip.tag-damage{background:#cf2e43 !important;color:#ff8895 !important}
.chips .chip.tag-elemental{background:#3f7088 !important;color:#fff !important}
.chips .chip.tag-physical{background:#4381a4 !important;color:#fff !important}
.chips .chip.tag-attack{background:#c86a39 !important;color:#fff !important}
.chips .chip.tag-fire,
.chips .chip.tag-fire-resistance{background:#c86a39 !important;color:#fff !important}
.chips .chip.tag-cold,
.chips .chip.tag-cold-resistance{background:#4d8fb4 !important;color:#fff !important}
.chips .chip.tag-lightning,
.chips .chip.tag-lightning-resistance{background:#b98920 !important;color:#fff !important}
.chips .chip.tag-chaos,
.chips .chip.tag-chaos-resistance{background:#74548d !important;color:#fff !important}

.chips .chip.tag-resistance,
.chips .chip.tag-elemental-resistance{background:#3f7088 !important;color:#fff !important}

.chips .chip.tag-defence,
.chips .chip.tag-armour,
.chips .chip.tag-evasion,
.chips .chip.tag-energy-shield{background:#48788d !important;color:#fff !important}

.chips .chip.tag-life{background:#ae4854 !important;color:#fff !important}
.chips .chip.tag-mana{background:#4676a2 !important;color:#fff !important}
.chips .chip.tag-resource{background:#896832 !important;color:#fff !important}
.chips .chip.tag-attribute{background:#477aaa !important;color:#fff !important}
.chips .chip.tag-caster,
.chips .chip.tag-speed{background:#428596 !important;color:#fff !important}

.chips .chip.tag-ailment,
.chips .chip.tag-critical,
.chips .chip.tag-charm,
.chips .chip.tag-minion,
.chips .chip.tag-aura,
.chips .chip.tag-block,
.chips .chip.tag-bleed,
.chips .chip.tag-poison,
.chips .chip.tag-ignite{background:#486f81 !important;color:#fff !important}

.chips .chip.tag-warcry{background:#c86a39 !important;color:#fff !important}
.chips .chip.tag-totem,
.chips .chip.tag-drop{background:#8a6929 !important;color:#fff !important}
.chips .chip.tag-default{background:#52616b !important;color:#fff !important}

/* Kill legacy positional colouring completely. */
.chips .chip:nth-child(2n),
.chips .chip:nth-child(3n){
  color:inherit;
}


/* ===== ABSOLUTE SHARED TAG PALETTE =====
   One renderer, one palette: normal items, Jewels, Desecrated, Liquid Emotions. */
body .chips .chip{
  font-size:.66rem !important;
  line-height:1.05 !important;
  font-weight:650 !important;
  padding:2px 4px !important;
  border:0 !important;
  border-radius:5px !important;
  box-shadow:none !important;
  text-shadow:none !important;
}

/* Match the normal-item palette exactly */
body .chips .chip.tag-damage{background:#c31f2d !important;color:#ff5360 !important}
body .chips .chip.tag-elemental{background:#3f718d !important;color:#eef8ff !important}
body .chips .chip.tag-physical{background:#427ca0 !important;color:#b7dcf2 !important}
body .chips .chip.tag-attack{background:#bf6837 !important;color:#ffe0cc !important}
body .chips .chip.tag-fire,
body .chips .chip.tag-fire-resistance{background:#c66c36 !important;color:#ffe1cb !important}
body .chips .chip.tag-cold,
body .chips .chip.tag-cold-resistance{background:#4b8bb1 !important;color:#d8f0ff !important}
body .chips .chip.tag-lightning,
body .chips .chip.tag-lightning-resistance{background:#bd8b27 !important;color:#fff0b2 !important}
body .chips .chip.tag-chaos,
body .chips .chip.tag-chaos-resistance{background:#795a92 !important;color:#ead7ff !important}
body .chips .chip.tag-resistance,
body .chips .chip.tag-elemental-resistance{background:#3f718d !important;color:#eef8ff !important}
body .chips .chip.tag-life{background:#a84750 !important;color:#ffd9dc !important}
body .chips .chip.tag-mana{background:#3d6e9f !important;color:#edf6ff !important}
body .chips .chip.tag-resource{background:#80643d !important;color:#fff0c7 !important}
body .chips .chip.tag-attribute{background:#4d82b0 !important;color:#f1f8ff !important}
body .chips .chip.tag-caster,
body .chips .chip.tag-speed{background:#408498 !important;color:#e6fbff !important}
body .chips .chip.tag-defence,
body .chips .chip.tag-armour,
body .chips .chip.tag-evasion,
body .chips .chip.tag-energy-shield{background:#4c7486 !important;color:#e8f5fa !important}
body .chips .chip.tag-drop,
body .chips .chip.tag-totem{background:#7b5e2c !important;color:#ffe9a8 !important}
body .chips .chip.tag-ailment,
body .chips .chip.tag-critical,
body .chips .chip.tag-charm,
body .chips .chip.tag-minion,
body .chips .chip.tag-aura,
body .chips .chip.tag-block,
body .chips .chip.tag-bleed,
body .chips .chip.tag-poison,
body .chips .chip.tag-ignite{background:#4c7486 !important;color:#eef8ff !important}
body .chips .chip.tag-warcry{background:#bf6837 !important;color:#ffe0cc !important}
body .chips .chip.tag-default{background:#4b5964 !important;color:#f0f3f5 !important}

/* Explicitly kill old position-based palettes */
body .chips .chip:nth-child(n){
  border-color:transparent !important;
}


/* ===== EXACT NORMAL-ITEM TAG COLORS =====
   Apply the exact same palette to Jewel and every other modifier section. */
body .modgroup .chips .chip{
  font-size:.66rem !important;
  line-height:1.05 !important;
  font-weight:650 !important;
  padding:2px 4px !important;
  border:0 !important;
  border-radius:5px !important;
  box-shadow:none !important;
}

/* palette matched to the normal-item rows */
body .modgroup .chips .chip.tag-elemental{
  background:#456c80 !important;
  color:#f1f8ff !important;
}
body .modgroup .chips .chip.tag-attack{
  background:#bd6738 !important;
  color:#ffe0cb !important;
}
body .modgroup .chips .chip.tag-physical{
  background:#427ca0 !important;
  color:#b7dcf2 !important;
}
body .modgroup .chips .chip.tag-fire,
body .modgroup .chips .chip.tag-fire-resistance{
  background:#c56b38 !important;
  color:#ffe1cb !important;
}
body .modgroup .chips .chip.tag-cold,
body .modgroup .chips .chip.tag-cold-resistance{
  background:#4d8caf !important;
  color:#dcf2ff !important;
}
body .modgroup .chips .chip.tag-lightning,
body .modgroup .chips .chip.tag-lightning-resistance{
  background:#bd8b27 !important;
  color:#fff0b2 !important;
}
body .modgroup .chips .chip.tag-chaos,
body .modgroup .chips .chip.tag-chaos-resistance{
  background:#795a92 !important;
  color:#ead7ff !important;
}
body .modgroup .chips .chip.tag-damage{
  background:#c31f2d !important;
  color:#ff6570 !important;
}
body .modgroup .chips .chip.tag-resistance,
body .modgroup .chips .chip.tag-elemental-resistance{
  background:#456c80 !important;
  color:#f1f8ff !important;
}
body .modgroup .chips .chip.tag-defence,
body .modgroup .chips .chip.tag-armour,
body .modgroup .chips .chip.tag-evasion,
body .modgroup .chips .chip.tag-energy-shield{
  background:#456c80 !important;
  color:#f1f8ff !important;
}
body .modgroup .chips .chip.tag-life{
  background:#a84750 !important;
  color:#ffd9dc !important;
}
body .modgroup .chips .chip.tag-mana{
  background:#3d6e9f !important;
  color:#edf6ff !important;
}
body .modgroup .chips .chip.tag-resource{
  background:#80643d !important;
  color:#fff0c7 !important;
}
body .modgroup .chips .chip.tag-attribute{
  background:#456c80 !important;
  color:#f1f8ff !important;
}
body .modgroup .chips .chip.tag-caster,
body .modgroup .chips .chip.tag-speed{
  background:#408498 !important;
  color:#e6fbff !important;
}
body .modgroup .chips .chip.tag-ailment,
body .modgroup .chips .chip.tag-critical,
body .modgroup .chips .chip.tag-charm,
body .modgroup .chips .chip.tag-minion,
body .modgroup .chips .chip.tag-aura,
body .modgroup .chips .chip.tag-block,
body .modgroup .chips .chip.tag-bleed,
body .modgroup .chips .chip.tag-poison,
body .modgroup .chips .chip.tag-ignite{
  background:#456c80 !important;
  color:#f1f8ff !important;
}
body .modgroup .chips .chip.tag-warcry{
  background:#bd6738 !important;
  color:#ffe0cb !important;
}
body .modgroup .chips .chip.tag-totem,
body .modgroup .chips .chip.tag-drop{
  background:#7b5e2c !important;
  color:#ffe9a8 !important;
}
body .modgroup .chips .chip.tag-default{
  background:#52616b !important;
  color:#f0f3f5 !important;
}

/* Absolutely disable the old positional chip colouring. */
body .modgroup .chips .chip:nth-child(n){
  border-color:transparent !important;
}


/* DAMAGE tag: softer red, less visually dominant */
body .chips .chip.tag-damage,
body .modgroup .chips .chip.tag-damage{
  background:#7f3b42 !important;
  color:#e8b0b5 !important;
}


/* ===== Integrated Path Of Build navigation ===== */
.site-nav{
  position:sticky;
  top:0;
  z-index:120;
  background:rgba(18,14,11,.96);
  backdrop-filter:blur(14px);
  border-bottom:1px solid #4a3728;
}
.site-nav-inner{
  width:min(1180px,calc(100% - 28px));
  min-height:54px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}
.site-brand{
  display:flex;
  align-items:center;
  color:#ead9b8;
  text-decoration:none;
  font-size:.88rem;
  font-weight:700;
  white-space:nowrap;
}
.site-nav nav{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:4px;
  flex-wrap:wrap;
}
.site-nav nav a{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  color:#aa9680;
  text-decoration:none;
  font-size:.7rem;
  line-height:1;
  padding:6px 9px;
  border:1px solid transparent;
  border-radius:7px;
}
.site-nav nav a:hover{
  color:#ead9b8;
  background:#241a14;
  border-color:#443225;
}
.site-nav nav a.active{
  color:#f4dfa8;
  background:#2b2018;
  border-color:#8b6738;
}

/* ===== Grouped item selector ===== */
.toolbar .class-picker{
  position:relative;
  min-width:180px;
  flex:0 0 180px;
}
.toolbar .class-picker-btn{
  width:100%;
  height:100%;
  min-height:38px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:0 12px;
  background:#17110e;
  border:1px solid #5a402a;
  border-radius:8px;
  color:#f1dfbb;
  font-size:.72rem;
  cursor:pointer;
}
.toolbar .class-picker-btn:hover,
.class-picker.open .class-picker-btn{
  border-color:#a77b3f;
  background:#1e1611;
}
.class-picker-arrow{
  color:#b6925c;
  font-size:.65rem;
}
.native-class-select{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  opacity:0 !important;
  pointer-events:none !important;
  overflow:hidden !important;
}
.class-picker-menu{
  display:none;
  position:absolute;
  left:0;
  top:calc(100% + 6px);
  z-index:300;
  width:min(720px,calc(100vw - 40px));
  max-height:70vh;
  overflow:auto;
  padding:8px 12px;
  background:#15100d;
  border:1px solid #62472e;
  border-radius:10px;
  box-shadow:0 16px 45px rgba(0,0,0,.55);
}
.class-picker.open .class-picker-menu{display:block}
.class-menu-row{
  display:grid;
  grid-template-columns:150px 1fr;
  gap:12px;
  align-items:start;
  padding:6px 0;
  border-bottom:1px solid #2d211a;
}
.class-menu-row:last-child{border-bottom:0}
.class-menu-group{
  color:#9f896f;
  font-size:.62rem;
  line-height:1.55;
}
.class-menu-links{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:3px;
}
.class-menu-item{
  appearance:none;
  border:0;
  background:transparent;
  color:#ddcaa7;
  padding:2px 3px;
  border-radius:4px;
  font:inherit;
  font-size:.66rem !important;
  font-weight:400 !important;
  cursor:pointer;
}
.class-menu-item:hover{
  color:#f3d88d;
  background:#2a2018;
}
.class-menu-item.active{
  color:#f5d57a;
  background:#382818;
}
.class-menu-sep{
  color:#644a33;
  font-size:.58rem;
}

@media(max-width:760px){
  .site-nav-inner{
    min-height:auto;
    padding:8px 0;
    align-items:flex-start;
    flex-direction:column;
    gap:6px;
  }
  .site-nav nav{justify-content:flex-start;gap:2px}
  .site-nav nav a{padding:5px 7px;font-size:.65rem}
  .toolbar .class-picker{flex:1 1 100%;width:100%}
  .class-picker-menu{width:min(94vw,720px)}
  .class-menu-row{grid-template-columns:1fr;gap:2px}
}


/* ===== Keep PathOfBuild header exactly like the main site ===== */
body>header{
  position:sticky !important;
  top:0 !important;
  z-index:120 !important;
  background:rgba(20,14,10,.9) !important;
  backdrop-filter:blur(14px) !important;
  border-bottom:1px solid rgba(91,64,39,.8) !important;
  box-shadow:0 6px 24px rgba(0,0,0,.18) !important;
}
body>header .wrap{
  width:min(1160px,calc(100% - 28px)) !important;
  margin:auto !important;
  padding:0 !important;
}
body>header .nav{
  min-height:70px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:18px !important;
}
body>header .brand{
  display:flex !important;
  align-items:center !important;
  gap:11px !important;
  color:inherit !important;
  text-decoration:none !important;
  font-weight:900 !important;
}
body>header .logo{
  width:41px !important;
  height:41px !important;
  border-radius:13px !important;
  display:grid !important;
  place-items:center !important;
  color:#1a110b !important;
  font-weight:950 !important;
  background:linear-gradient(135deg,#f0d489,#c49349 54%,#85512e) !important;
  box-shadow:0 8px 20px rgba(186,127,59,.2) !important;
  border:1px solid #e0bd70 !important;
}
body>header .brand small{
  display:block !important;
  color:var(--muted) !important;
  font-size:.68rem !important;
  font-weight:650 !important;
  margin-top:-1px !important;
}
body>header .menu{
  display:flex !important;
  gap:7px !important;
  align-items:center !important;
}
body>header .menu a{
  padding:9px 12px !important;
  border-radius:10px !important;
  color:#b29d85 !important;
  font-size:.88rem !important;
  font-weight:750 !important;
  text-decoration:none !important;
}
body>header .menu a:hover{
  background:#2b2119 !important;
  color:#ecd7aa !important;
}
.modifier-wrap{
  width:min(1180px,calc(100% - 28px));
  margin:auto;
  padding:0 0 42px;
}


/* ===== Modifier Database — coherent PathOfBuild light mode ===== */
html[data-theme="light"] body{
  background:#f6f0e7 !important;
  color:#3f3227 !important;
}

html[data-theme="light"] .modifier-wrap{
  color:#3f3227 !important;
}

html[data-theme="light"] .page-head,
html[data-theme="light"] .toolbar,
html[data-theme="light"] .notice,
html[data-theme="light"] .section-nav,
html[data-theme="light"] .section,
html[data-theme="light"] .box,
html[data-theme="light"] #activeModifierPanel{
  background:#fffaf2 !important;
  border-color:#d7c5ab !important;
  color:#3f3227 !important;
}

html[data-theme="light"] .toolbar{
  box-shadow:0 4px 14px rgba(77,54,34,.08) !important;
}

html[data-theme="light"] .toolbar select,
html[data-theme="light"] .toolbar input,
html[data-theme="light"] .toolbar button,
html[data-theme="light"] .class-picker-btn{
  background:#fffdf8 !important;
  color:#3b2c20 !important;
  border-color:#cdb38d !important;
}

html[data-theme="light"] .toolbar input::placeholder{
  color:#9a8773 !important;
}

html[data-theme="light"] .class-picker-menu{
  background:#fffaf2 !important;
  border-color:#cdb38d !important;
  box-shadow:0 16px 38px rgba(72,49,30,.18) !important;
}

html[data-theme="light"] .class-menu-row{
  border-color:#eadfce !important;
}

html[data-theme="light"] .class-menu-group{
  color:#8b735d !important;
}

html[data-theme="light"] .class-menu-item{
  color:#4b3929 !important;
}

html[data-theme="light"] .class-menu-item:hover{
  color:#2e2118 !important;
  background:#f2e5d2 !important;
}

html[data-theme="light"] .class-menu-item.active{
  color:#6b451e !important;
  background:#ead5b2 !important;
}

html[data-theme="light"] .section-nav .section-tab{
  background:#fffaf2 !important;
  color:#6f5a45 !important;
  border-color:#d5c1a4 !important;
}

html[data-theme="light"] .section-nav .section-tab:hover{
  background:#f4e8d7 !important;
  color:#4b3725 !important;
  border-color:#b89563 !important;
}

html[data-theme="light"] .section-nav .section-tab.active{
  background:linear-gradient(135deg,#d9ad58,#b67b3f) !important;
  color:#1f160f !important;
  border-color:#b78543 !important;
}

html[data-theme="light"] .section-head,
html[data-theme="light"] .box h3,
html[data-theme="light"] .col-title{
  background:#f1e4d2 !important;
  color:#4a3523 !important;
  border-color:#d2b994 !important;
}

html[data-theme="light"] .modgroup{
  background:#fffdf8 !important;
  border-color:#e2d5c2 !important;
}

html[data-theme="light"] .modsum{
  background:#fffdf8 !important;
  border-color:#e6dac9 !important;
}

html[data-theme="light"] .modsum:hover{
  background:#f7eddf !important;
}

html[data-theme="light"] .modtitle{
  color:#5348b8 !important;
}

html[data-theme="light"] .detail{
  background:#f9f1e6 !important;
  color:#433326 !important;
  border-color:#dfcdb4 !important;
}

html[data-theme="light"] .detail table,
html[data-theme="light"] .detail th,
html[data-theme="light"] .detail td{
  border-color:#ddcbb2 !important;
}

html[data-theme="light"] .detail th{
  background:#efe1cf !important;
  color:#5a4029 !important;
}

html[data-theme="light"] .detail td{
  background:#fffaf2 !important;
  color:#4a3829 !important;
}

html[data-theme="light"] .status{
  color:#788f57 !important;
}

html[data-theme="light"] .notice{
  color:#725f49 !important;
}

html[data-theme="light"] code{
  background:#efe2cf !important;
  color:#6d491f !important;
  border-color:#d3bea0 !important;
}

/* Keep the PathOfBuild top header untouched in both themes. */
html[data-theme="light"] body>header{
  background:#2b241e !important;
  border-bottom-color:#5b4b3c !important;
}

html[data-theme="light"] body>header .brand{
  color:#ead9b8 !important;
}

html[data-theme="light"] body>header .brand small{
  color:#a99580 !important;
}

html[data-theme="light"] body>header .menu a{
  color:#c4ae94 !important;
}

html[data-theme="light"] body>header .menu a:hover{
  color:#f0d9aa !important;
  background:#382d25 !important;
}

html[data-theme="light"] body>header .theme-toggle{
  background:#fff8ec !important;
  color:#6d4f2c !important;
  border-color:#d4b98f !important;
}


/* ===== FINAL LIGHT MODE CLEANUP ===== */

/* In light mode, use the same light PathOfBuild header as the main site. */
html[data-theme="light"] body>header{
  background:#fbf6ee !important;
  border-bottom:1px solid #ddcfbd !important;
  box-shadow:0 4px 16px rgba(91,64,39,.08) !important;
  color:#34281f !important;
}

html[data-theme="light"] body>header .brand{
  color:#34281f !important;
}
html[data-theme="light"] body>header .brand small{
  color:#8c7b69 !important;
}
html[data-theme="light"] body>header .menu a{
  color:#655442 !important;
}
html[data-theme="light"] body>header .menu a:hover,
html[data-theme="light"] body>header .menu a.active{
  color:#3d2d20 !important;
  background:#efe5d8 !important;
}

/* Database dropdown must also switch to light mode. */
html[data-theme="light"] body>header .nav-dropdown-menu,
html[data-theme="light"] .menu .nav-dropdown-menu{
  background:#fffaf2 !important;
  border-color:#d7c5ab !important;
  box-shadow:0 12px 28px rgba(72,49,30,.16) !important;
}

html[data-theme="light"] body>header .nav-dropdown-menu a,
html[data-theme="light"] .menu .nav-dropdown-menu a{
  color:#5f4d3b !important;
  background:transparent !important;
}
html[data-theme="light"] body>header .nav-dropdown-menu a:hover,
html[data-theme="light"] .menu .nav-dropdown-menu a:hover{
  color:#34271d !important;
  background:#f0e3d0 !important;
}

/* The information bar under the filters should not remain black. */
html[data-theme="light"] .notice{
  background:#f4eadc !important;
  color:#6d5944 !important;
  border-color:#d5bea0 !important;
}

/* Any remaining generic dark panels around the top/filter area. */
html[data-theme="light"] .toolbar,
html[data-theme="light"] .page-head{
  background:#fffaf2 !important;
  color:#3f3227 !important;
}

/* Theme button should match the main site's light header. */
html[data-theme="light"] body>header .theme-toggle{
  background:#fff9ef !important;
  color:#6d4f2c !important;
  border-color:#d7bea0 !important;
  box-shadow:none !important;
}


/* ===== FINAL remaining light-mode fixes ===== */

/* RePoE information/source bar */
html[data-theme="light"] .source-note{
  background:#f4eadc !important;
  color:#6d5944 !important;
  border-color:#d5bea0 !important;
  box-shadow:none !important;
}
html[data-theme="light"] .source-note b{
  color:#6a481f !important;
}
html[data-theme="light"] .source-note code{
  background:#eadbc6 !important;
  color:#62431f !important;
  border-color:#cfb791 !important;
}

/* Tier hover tooltip: override the dark CSS injected by app.js */
html[data-theme="light"] .tier-hover-tooltip{
  background:#fffaf2 !important;
  color:#403126 !important;
  border-color:#cdb58f !important;
  box-shadow:0 14px 36px rgba(75,52,32,.20) !important;
}
html[data-theme="light"] .tier-hover-title{
  background:#efe0cb !important;
  color:#6c4a21 !important;
  border-bottom-color:#d1b994 !important;
}
html[data-theme="light"] .tier-hover-tooltip table{
  background:#fffaf2 !important;
  color:#403126 !important;
}
html[data-theme="light"] .tier-hover-tooltip th,
html[data-theme="light"] .tier-hover-tooltip td{
  background:#fffaf2 !important;
  color:#403126 !important;
  border-top-color:#e0d0ba !important;
}
html[data-theme="light"] .tier-hover-tooltip th{
  color:#76572f !important;
}
html[data-theme="light"] .tier-hover-tooltip td:first-child,
html[data-theme="light"] .tier-hover-tooltip td:nth-child(2){
  color:#8a6428 !important;
}


/* Light mode — soften modifier row counters only */
html[data-theme="light"] .modsum .meta span:nth-child(1),
html[data-theme="light"] .modsum .meta .pill:nth-child(1){
  background:#6f8a68 !important;
  color:#f4f8f1 !important;
  border-color:#829a7b !important;
}

html[data-theme="light"] .modsum .meta span:nth-child(2),
html[data-theme="light"] .modsum .meta .pill:nth-child(2){
  background:#8a7b69 !important;
  color:#fffaf3 !important;
  border-color:#9c8c78 !important;
}

html[data-theme="light"] .modsum .meta span:nth-child(3),
html[data-theme="light"] .modsum .meta .pill:nth-child(3){
  background:#9a675b !important;
  color:#fff8f5 !important;
  border-color:#aa786d !important;
}


/* ===== Light mode: exact selectors for current modifier markup ===== */

/* Page title: improve contrast without changing layout */
html[data-theme="light"] .page-head h1,
html[data-theme="light"] .page-head .title,
html[data-theme="light"] h1{
  color:#3e3026 !important;
  text-shadow:none !important;
}

/* Current row counters are .nums .pill.green/.gray/.red */
html[data-theme="light"] .nums .pill.green{
  background:#6f8d69 !important;
  color:#f7fbf5 !important;
  border-color:#7f9b79 !important;
}

html[data-theme="light"] .nums .pill.gray{
  background:#988b7c !important;
  color:#fffaf4 !important;
  border-color:#aa9c8c !important;
}

html[data-theme="light"] .nums .pill.red{
  background:#a66d61 !important;
  color:#fff8f5 !important;
  border-color:#b67c70 !important;
}

/* Slightly softer than dark-mode pills */
html[data-theme="light"] .nums .pill{
  box-shadow:none !important;
  text-shadow:none !important;
}


/* ===== Back to top ===== */
.back-to-top{
  position:fixed;right:18px;bottom:18px;z-index:9997;width:42px;height:42px;
  display:grid;place-items:center;border:1px solid #6b4c30;border-radius:10px;
  background:linear-gradient(180deg,#2a2018,#17110d);color:#e7c982;font-size:20px;font-weight:900;
  cursor:pointer;box-shadow:0 7px 20px rgba(0,0,0,.35);opacity:0;visibility:hidden;transform:translateY(8px);transition:.18s ease;
}
.back-to-top.show{opacity:1;visibility:visible;transform:translateY(0)}
.back-to-top:hover{border-color:#a77945;color:#ffe0a1;background:#33251b}
html[data-theme="light"] .back-to-top{background:#f5ede4;color:#62472d;border-color:#c3a888;box-shadow:0 6px 18px rgba(60,40,20,.15)}
@media(max-width:700px){.back-to-top{right:12px;bottom:12px;width:40px;height:40px}}