/* Abilities page: rotation cards, passives, spellbook and a sticky save bar.
   Loaded last; uses #ability-config to outrank the older form rules. */

.abilities-page { padding-bottom: 0; }
.ab-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px;
  margin-bottom: 16px;
}
.ab-head h2 { margin: 6px 0 6px; font-family: var(--title); font-size: 26px; letter-spacing: 1px; color: #e7ddd1; }
.ab-head p { max-width: 760px; line-height: 1.55; }
.ab-weapon {
  display: grid;
  justify-items: end;
  gap: 2px;
  padding: 10px 14px;
  border: 1px solid #4d3a38;
  border-radius: 10px;
  background: linear-gradient(160deg, #251f1f, #141111);
  white-space: nowrap;
}
.ab-weapon strong { font-family: var(--title); font-size: 17px; color: #e4d8ca; }

#ability-config .ab-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 380px);
  gap: 18px;
  align-items: start;
}
.ab-section { margin-bottom: 18px; }
.ab-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 9px; }
.ab-section-head h3 { margin: 0; font-family: var(--title); font-size: 15px; letter-spacing: 1.6px; text-transform: uppercase; color: #d9c9b2; }

/* ---- Rotation cards ---- */
#ability-config .ability-order { display: grid; grid-template-columns: 1fr; gap: 8px; }
#ability-config .ab-slot {
  position: relative;
  display: block;
  padding: 0;
  overflow: hidden;
  border: 1px solid #433433;
  border-radius: 11px;
  background: linear-gradient(160deg, #201818, #120e0e);
  box-shadow: 0 3px 12px #0006;
  transition: border-color .15s, box-shadow .15s;
}
#ability-config .ab-slot.is-selected { border-color: #b3262e; box-shadow: 0 0 0 1px #b3262e55, 0 3px 14px #0007; }
#ability-config .ab-slot.is-off .ab-slot-pick { opacity: .5; }
#ability-config .ab-slot > .ab-slot-main {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 12px;
  padding: 10px 12px 10px 10px;
}
.ab-rank {
  display: grid;
  place-items: center;
  flex: 0 0 30px;
  height: 30px;
  border: 1px solid #6e1a1f;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #402323, #151111);
  color: #e4d8ca;
  font-family: var(--title);
  font-size: 14px;
  font-weight: 700;
}
#ability-config .ab-slot-pick {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  gap: 12px;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
  color: inherit;
  text-align: left;
  cursor: pointer;
}
.ab-icon {
  display: grid;
  place-items: center;
  flex: 0 0 52px;
  width: 52px;
  height: 52px;
  border: 1px solid #6c504e;
  border-radius: 9px;
  background: linear-gradient(160deg, #251f1f, #100d0d);
  box-shadow: inset 0 0 12px #000c;
}
.ab-icon .hot-icon { width: 72%; height: 72%; }
.ab-icon .hot-icon svg { width: 100%; height: 100%; }
.ab-slot-info, .ab-book-body, .ab-passive-body { display: grid; gap: 4px; min-width: 0; }
.ab-slot-title { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.ab-slot-title strong { overflow: hidden; color: #ebe2d7; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.ab-kind, .ab-book-tag, .ab-slot-number {
  flex: 0 0 auto;
  padding: 1px 7px;
  border: 1px solid #433433;
  border-radius: 10px;
  color: #b8a684;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .5px;
  text-transform: uppercase;
}
.ab-slot-number { border-color: transparent; color: #7b5b59; padding: 0; }
.ab-meta { display: flex; flex-wrap: wrap; gap: 5px; }
.ab-chip {
  padding: 1px 7px;
  border-radius: 4px;
  background: #2a2222;
  color: #c9b995;
  font-size: 11px;
  line-height: 1.6;
}
.ab-chip.energy { background: #1c1616; color: #9fe7da; }
.ab-effect { color: #a8998c; line-height: 1.4; }

/* Auto switch */
#ability-config .ab-switch {
  display: inline-flex;
  flex: 0 0 auto;
  flex-wrap: nowrap;
  align-items: center;
  gap: 7px;
  color: #cfc2b0;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
#ability-config .ab-switch input { position: absolute; width: 1px; height: 1px; min-height: 0; opacity: 0; }
.ab-switch-track {
  position: relative;
  width: 34px;
  height: 18px;
  border: 1px solid #4d3a38;
  border-radius: 10px;
  background: #181313;
  transition: background .15s, border-color .15s;
}
.ab-switch-track::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #7f605e;
  transition: transform .15s, background .15s;
}
#ability-config .ab-switch input:checked + .ab-switch-track { background: #3f3131; border-color: #6f9d55; }
#ability-config .ab-switch input:checked + .ab-switch-track::after { transform: translateX(16px); background: #b6e08f; }
#ability-config .ab-switch input:focus-visible + .ab-switch-track { outline: 2px solid #e5dacd; outline-offset: 2px; }

#ability-config .ab-slot .priority-controls { display: flex; flex-direction: column; gap: 3px; }
#ability-config .ab-slot .priority-controls button { min-width: 30px; min-height: 22px; padding: 0; font-size: 12px; line-height: 1; }

/* Slot controls row */
#ability-config .ab-slot > .ab-slot-controls {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  padding: 0 12px 8px 52px;
}
#ability-config .ab-choose { display: flex; flex-wrap: nowrap; align-items: center; gap: 10px; color: #8e7776; font-size: 11px; text-transform: uppercase; letter-spacing: .8px; }
#ability-config .ab-choose select { flex: 1; min-height: 32px; font-size: 13px; text-transform: none; letter-spacing: 0; }
#ability-config .ab-conditions { margin-top: 6px; border-top: 1px solid #332828; }
#ability-config .ab-conditions summary {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 34px;
  padding: 6px 0;
  color: #cdbfae;
  font-size: 12px;
  font-weight: 600;
  list-style: none;
}
#ability-config .ab-conditions summary::-webkit-details-marker { display: none; }
#ability-config .ab-conditions summary::before { content: "▸"; color: #8e7776; transition: transform .15s; }
#ability-config .ab-conditions[open] summary::before { transform: rotate(90deg); }
.ab-cond-summary { overflow: hidden; color: #a8998c; font-weight: 400; text-overflow: ellipsis; white-space: nowrap; }
#ability-config .condition-fields { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 4px 0 8px; }
#ability-config .ab-checks { display: flex; flex-wrap: wrap; gap: 6px 16px; padding-bottom: 8px; font-size: 12px; color: #cfc2b0; }

/* ---- Passives ---- */
.ab-passives { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
#ability-config .ab-passive {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  gap: 10px;
  padding: 10px;
  border: 1px solid #433433;
  border-radius: 11px;
  background: linear-gradient(160deg, #201818, #120e0e);
}
.ab-passive .ab-icon { flex-basis: 44px; width: 44px; height: 44px; }
.ab-passive .passive-description { color: #a8998c; min-height: 2.6em; }
#ability-config .ab-passive select { width: 100%; min-height: 30px; font-size: 12px; }

/* ---- Spellbook ---- */
.ab-book {
  position: sticky;
  top: 0;
  display: flex;
  flex-direction: column;
  max-height: calc(100dvh - 210px);
  padding: 12px;
  border: 1px solid #433433;
  border-radius: 12px;
  background: linear-gradient(180deg, #1b1414, #0f0c0c);
}
.ab-book-list { display: grid; gap: 6px; min-height: 0; overflow-y: auto; padding-right: 2px; scrollbar-width: thin; scrollbar-color: #4e2226 transparent; }
#ability-config .ab-book-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  width: 100%;
  margin: 0;
  padding: 8px;
  border: 1px solid #362b2a;
  border-radius: 9px;
  background: #161111;
  box-shadow: none;
  color: inherit;
  text-align: left;
  cursor: pointer;
}
#ability-config .ab-book-item:hover { border-color: #b3262e; background: #1d1717; }
#ability-config .ab-book-item .ab-icon { flex-basis: 42px; width: 42px; height: 42px; }
#ability-config .ab-book-item.is-equipped { border-color: #5d7a46; }
#ability-config .ab-book-item.is-equipped .ab-book-tag { border-color: #5d7a46; color: #b6e08f; }
#ability-config .ab-book-item.is-locked { opacity: .55; cursor: not-allowed; }
#ability-config .ab-book-item.is-locked .ab-icon { filter: grayscale(1); }
.ab-book-item .ab-slot-title strong { font-size: 13.5px; }
.ab-book-effect { color: #a8998c; line-height: 1.35; }
.ab-reference { margin-top: 10px; color: #a8998c; }
.ab-reference summary { cursor: pointer; font-size: 12px; }

/* ---- Save bar ---- */
#ability-config .ab-savebar {
  position: sticky;
  bottom: 0;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 6px;
  padding: 12px 14px;
  border: 1px solid #4d3a38;
  border-radius: 11px 11px 0 0;
  background: linear-gradient(180deg, #1f1818f2, #130f0ff7);
  backdrop-filter: blur(4px);
  box-shadow: 0 -6px 18px #0009;
}
#ability-draft-status { margin: 0; color: #cdbfae; font-weight: 600; }
#ability-config[data-dirty="true"] #ability-draft-status { color: #e05a5a; }
.ab-savebar-actions { display: flex; gap: 8px; flex: 0 0 auto; }
.ab-savebar-actions button { min-height: 36px; padding: 0 16px; }

/* ---- Narrow screens ---- */
@media (max-width: 1180px) {
  #ability-config .ab-layout { grid-template-columns: minmax(0, 1fr); }
  .ab-book { position: static; max-height: none; }
  .ab-book-list { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
}
@media (max-width: 760px) {
  .ab-head { flex-direction: column; align-items: stretch; }
  .ab-weapon { justify-items: start; }
  .ab-passives { grid-template-columns: 1fr; }
  #ability-config .ab-slot > .ab-slot-controls { padding-left: 12px; }
  #ability-config .condition-fields { grid-template-columns: 1fr 1fr; }
  #ability-config .ab-slot > .ab-slot-main { flex-wrap: wrap; }
  #ability-config .ab-slot-pick { flex-basis: calc(100% - 44px); }
  .ab-savebar { flex-direction: column; align-items: stretch; }
}

/* Undo older .ability-editor ordering rules from refresh.css */
#ability-config .ability-editor.ab-slot .ab-slot-title strong { order: 0; margin-right: 0; font-size: 15px; }
#ability-config .ab-slot .ab-slot-title { order: 0; }
#ability-config .ab-book-list { grid-auto-rows: max-content; }
#ability-config .ab-book-item { height: auto; min-height: 0; max-height: none; flex-shrink: 0; line-height: 1.3; white-space: normal; }
#ability-config .ab-slot-pick { height: auto; min-height: 0; max-height: none; line-height: 1.3; white-space: normal; }
@media (max-width: 760px) {
  #ability-config .ab-savebar { flex-direction: row; align-items: center; gap: 8px; padding: 8px 10px; }
  #ability-config .ab-savebar .small { display: none; }
  #ability-draft-status { font-size: 12px; }
  .ab-savebar-actions button { min-height: 34px; padding: 0 10px; font-size: 12px; }
}

/* ================= Abilities v2 ================= */
.abx-page{display:grid;gap:16px;padding-bottom:40px;grid-auto-rows:max-content;align-content:start}
.abx-hero{position:relative;display:grid;grid-template-columns:170px 1fr;gap:18px;align-items:center;padding:16px 20px;border:1px solid #3a2a28;border-radius:16px;overflow:hidden;
 background:radial-gradient(ellipse at 12% 60%,rgba(170,40,36,.28),transparent 55%),radial-gradient(ellipse at 90% 0%,rgba(230,195,122,.08),transparent 50%),linear-gradient(180deg,#1a1212,#110c0c)}
.abx-hero-art{height:170px;display:grid;place-items:end center;filter:drop-shadow(0 10px 18px #000)}
.abx-hero-art img{max-height:170px;width:auto}
.abx-hero h2{margin:4px 0 6px;font-family:var(--display,Georgia,serif);font-weight:500;font-size:30px;color:#f1e3cf;letter-spacing:.02em}
.abx-hero h2 em{font-style:normal;font-size:15px;color:#e6c37a;margin-left:8px;letter-spacing:.08em;text-transform:uppercase}
.abx-hero p{margin:0 0 10px;color:#b9a898;font-size:13px;max-width:760px}
.abx-weapons{display:flex;flex-wrap:wrap;gap:6px}
.abx-weapons button{display:inline-flex;gap:6px;align-items:baseline;padding:5px 11px;border-radius:99px;font-size:12.5px}
.abx-weapons button small{color:#8e7f76;font-size:10.5px}
.abx-weapons button.active{border-color:#b33a32;background:#2a1414;color:#f6e7d4}
.abx-weapons button.current small{color:#e6c37a}

/* tiles */
.abx-tile{position:relative;display:grid;place-items:center;width:52px;height:52px;flex:none;border-radius:14px;border:1px solid color-mix(in srgb,var(--tone,#e1d4c5) 35%,#2e2321);
 background:radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--tone,#e1d4c5) 22%,transparent),transparent 70%),#140e0e;box-shadow:inset 0 0 12px rgba(0,0,0,.6)}
.abx-tile .abx-glyph{width:62%;height:62%;color:var(--tone,#e1d4c5);filter:drop-shadow(0 0 6px color-mix(in srgb,var(--tone,#e1d4c5) 55%,transparent))}
.abx-tile .abx-glyph svg{width:100%;height:100%}
.abx-tile.ult{width:62px;height:62px;border-radius:50%;--tone:#ffb14a;border-color:#a8742e;box-shadow:0 0 18px rgba(255,160,60,.25),inset 0 0 14px rgba(0,0,0,.6)}
.abx-tile.passive{--tone:#e6c37a;border-radius:50%}
.abx-tile .pglyph{display:grid;place-items:center;font-size:20px;line-height:1;width:auto;height:auto;color:#e6c37a}
.abx-tile.empty{border-style:dashed;background:#120d0d}.abx-tile.empty .abx-glyph{color:#6f5250;font-size:22px;display:grid;place-items:center}
.abx-tile.is-locked{filter:grayscale(1) brightness(.55)}
.abx-lock{position:absolute;right:-4px;bottom:-4px;font-size:12px;filter:none}
.abx-ring{position:absolute;inset:-5px;width:calc(100% + 10px);height:calc(100% + 10px);transform:rotate(-90deg)}
.abx-ring circle{fill:none;stroke-width:2.4}.abx-ring .track{stroke:rgba(255,255,255,.06)}.abx-ring .fill{stroke:#e6c37a;stroke-linecap:round;filter:drop-shadow(0 0 3px rgba(230,195,122,.6))}
.abx-rank{position:absolute;left:-6px;top:-6px;min-width:19px;height:19px;padding:0 4px;border-radius:99px;display:grid;place-items:center;font-size:10.5px;font-weight:700;color:#1a1010;background:linear-gradient(180deg,#f3dca0,#c79a4a);box-shadow:0 1px 3px #000}
.tone-ultimate{--tone:#ffb14a}

/* path */
.abx-path{position:relative;padding:18px 18px 12px;border:1px solid #33262a;border-radius:16px;background:linear-gradient(180deg,#151010,#100c0c)}
.abx-path ol{position:relative;list-style:none;margin:0;padding:0;height:128px}
.abx-path-track{position:absolute;left:62px;right:62px;top:62px;height:4px;border-radius:9px;background:#2a2020}
.abx-path-track i{position:absolute;inset:0 auto 0 0;border-radius:inherit;background:linear-gradient(90deg,#7a1f1f,#d0573f,#e6c37a);box-shadow:0 0 10px rgba(208,87,63,.5)}
.abx-path-track em{position:absolute;top:-4px;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:#f3dca0;box-shadow:0 0 0 3px rgba(243,220,160,.2),0 0 12px #e6c37a}
.abx-node{position:absolute;left:calc(44px + (100% - 88px) * var(--at));top:0;width:0;display:grid;justify-items:center}
.abx-node-btn{all:unset;cursor:pointer;display:grid;place-items:center;transform:translateX(0);margin-top:20px}
.abx-node .abx-tile{width:46px;height:46px;transition:transform .15s}
.abx-node.ult .abx-tile{width:54px;height:54px;margin-top:-4px}
.abx-node.passive .abx-tile{width:36px;height:36px;margin-top:5px}
.abx-node-btn:hover .abx-tile,.abx-node-btn:focus-visible .abx-tile{transform:scale(1.1)}
.abx-node.done .abx-tile{box-shadow:0 0 0 2px rgba(230,195,122,.35),0 0 14px color-mix(in srgb,var(--tone,#e6c37a) 35%,transparent)}
.abx-node.next .abx-tile{animation:abx-pulse 1.6s ease-in-out infinite;filter:none}
.abx-node.next .abx-tile .abx-glyph{opacity:.55}
@keyframes abx-pulse{0%,100%{box-shadow:0 0 0 0 rgba(208,87,63,.0)}50%{box-shadow:0 0 0 6px rgba(208,87,63,.35)}}
.abx-node-label{position:absolute;top:74px;width:96px;margin-left:-48px;left:0;text-align:center;display:grid;gap:1px}
.abx-node:nth-child(even) .abx-node-label{top:88px}
.abx-node-label b{font-size:11px;font-weight:600;color:#cdbcab;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.abx-node-label small{font-size:9.5px;color:#7f6f66;letter-spacing:.04em}
.abx-node.done .abx-node-label b{color:#f1e3cf}.abx-node.next .abx-node-label small{color:#e07a6a}
.abx-next{margin:6px 0 0;font-size:12.5px;color:#a99686;text-align:center}.abx-next b{color:#f1e3cf;font-weight:600}
.abx-preview{margin:-6px 0 0;font-size:12.5px;color:#e6c37a;text-align:center}

/* loadout */
.abx-loadout{display:grid;gap:10px}
.abx-sec-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 12px}
.abx-sec-head h3{margin:0;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:#c9b8a8}
.abx-sec-head button{margin-left:auto}
.abx-sec-head button.active{border-color:#b33a32;color:#f6e7d4}
.abx-slots{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.abx-slot,.abx-pslot{position:relative;display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center;padding:10px;border:1px solid #33262a;border-radius:13px;background:#151010;min-height:76px;text-align:left}
.abx-slot>div b,.abx-pslot>div b,.abx-slot-main b{display:block;font-size:13px;color:#f1e3cf;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.abx-slot small,.abx-pslot small{display:block;font-size:11px;color:#9b8b80}
.abx-slot .abx-trig{color:#e6c37a}
.abx-slot.empty,.abx-pslot.empty{border-style:dashed;cursor:pointer}
.abx-slot.locked,.abx-pslot.locked{opacity:.55}
.abx-slot.selected,.abx-pslot.selected{border-color:#d0573f;box-shadow:0 0 0 1px #d0573f,0 0 18px rgba(208,87,63,.25)}
.abx-slot.off{opacity:.7}
.abx-slot-n{position:absolute;left:6px;top:4px;font-size:10px;color:#6f5f58;font-weight:700}
.abx-slot-main{all:unset;cursor:pointer;display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center;min-width:0}
.abx-slot-main>div{min-width:0}
.abx-slot:not(.empty):not(.locked){grid-template-columns:1fr}
.abx-slot-tools{position:absolute;right:6px;top:6px;display:flex;gap:2px;opacity:0;transition:opacity .15s}
.abx-slot:hover .abx-slot-tools,.abx-slot.selected .abx-slot-tools,.abx-slot:focus-within .abx-slot-tools{opacity:1}
.abx-slot-tools button,.abx-pslot>button:last-child{min-height:0;padding:2px 6px;font-size:10px;line-height:1.3}
.abx-pslot>button:last-child{position:absolute;right:6px;top:6px}
.abx-triggers{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.abx-triggers button{min-height:0;padding:2px 7px;font-size:10.5px;border-radius:99px}
.abx-triggers button.on{border-color:#e6c37a;color:#f3dca0;background:#2a2014}
.abx-pslots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.abx-pslot.inactive{opacity:.6}
.abx-ult{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center;padding:12px 16px;border:1px solid #6a4a26;border-radius:14px;
 background:radial-gradient(ellipse at 6% 50%,rgba(255,160,60,.18),transparent 45%),#16100c}
.abx-ult.locked{border-color:#33262a;background:#141010;opacity:.75}
.abx-ult.full{box-shadow:0 0 22px rgba(255,160,60,.3)}
.abx-ult b{display:block;font-family:var(--display,Georgia,serif);font-weight:500;font-size:18px;color:#ffd79a}
.abx-ult small{display:block;font-size:12px;color:#b9a898;margin:2px 0 6px}
.abx-fury{position:relative;display:block;height:10px;border-radius:99px;background:#2a1d14;overflow:hidden;max-width:420px}
.abx-fury i{position:absolute;inset:0 auto 0 0;background:linear-gradient(90deg,#a8441e,#ffb14a);box-shadow:0 0 10px rgba(255,160,60,.6)}
.abx-fury em{position:absolute;right:6px;top:-2px;font-style:normal;font-size:9.5px;color:#fff2d8}

/* book */
.abx-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.abx-tabs button.active{border-color:#b33a32;background:#2a1414;color:#f6e7d4}
.abx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px}
.abx-card{display:grid;gap:8px;align-content:start;padding:13px;border:1px solid #33262a;border-radius:14px;background:linear-gradient(180deg,#191313,#120e0e);transition:border-color .15s,transform .15s}
.abx-card:hover{border-color:#5a3a37}
.abx-card.equipped{border-color:#7a2a26;box-shadow:inset 0 0 0 1px rgba(208,87,63,.2)}
.abx-card.ult{border-color:#6a4a26;background:radial-gradient(ellipse at 0% 0%,rgba(255,160,60,.12),transparent 50%),#140f0c}
.abx-card.locked{opacity:.62}
.abx-card.dim{opacity:.75}
.abx-card.focus{border-color:#e6c37a;box-shadow:0 0 0 1px #e6c37a,0 0 20px rgba(230,195,122,.2)}
.abx-card header{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center}
.abx-card header b{display:block;font-family:var(--display,Georgia,serif);font-weight:500;font-size:17px;color:#f1e3cf}
.abx-card header small{font-size:11px;color:#9b8b80;letter-spacing:.03em}
.abx-desc{margin:0;font-size:12.5px;color:#e2d3c1;line-height:1.45}
.abx-blurb{margin:0;font-size:11.5px;color:#8e7f76;font-style:italic}
.abx-rankbar{display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:center;font-size:11px;color:#e6c37a}
.abx-rankbar i{display:block;height:5px;border-radius:9px;background:#2a2120;overflow:hidden}.abx-rankbar i b{display:block;height:100%;background:linear-gradient(90deg,#8a6a2a,#e6c37a)}
.abx-ups{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.abx-ups li{display:grid;grid-template-columns:14px 1fr;gap:6px;font-size:11.5px;color:#8e7f76}
.abx-ups li b{grid-column:2;display:block;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#7f6f66;font-weight:600}
.abx-ups li span{grid-row:1/3;color:#6f5f58}
.abx-ups li.got{color:#d9c9b6}.abx-ups li.got span,.abx-ups li.got b{color:#e6c37a}
.abx-card footer{display:flex;justify-content:flex-end;align-items:center;min-height:28px}
.abx-req{font-size:11.5px;color:#9b8b80}.abx-equipped{font-size:11.5px;color:#e07a6a;font-weight:600}

/* hotbar additions */
.hot-rank{position:absolute;left:2px;bottom:2px;min-width:14px;height:14px;padding:0 3px;border-radius:99px;font-size:9px;font-weight:700;line-height:14px;text-align:center;color:#1a1010;background:linear-gradient(180deg,#f3dca0,#c79a4a)}
.hot-slot.is-locked{opacity:.5}
.hot-lock{font-size:15px}
.hot-ult{position:relative}
.hot-ult .hot-fury{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg);pointer-events:none}
.hot-ult .hot-fury circle{fill:none;stroke:#ffb14a;stroke-width:3;stroke-linecap:round;filter:drop-shadow(0 0 3px rgba(255,160,60,.7))}
.hot-ult.is-full{box-shadow:0 0 16px rgba(255,160,60,.55);animation:abx-pulse 1.2s ease-in-out infinite}

@media (max-width:1100px){.abx-slots{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){
 .abx-hero{grid-template-columns:90px 1fr;padding:12px}.abx-hero-art{height:110px}.abx-hero-art img{max-height:110px}.abx-hero h2{font-size:22px}
 .abx-path{overflow-x:auto}.abx-path ol,.abx-path-track{min-width:640px}.abx-path-track{right:auto;width:572px}
 .abx-slots{grid-template-columns:repeat(2,minmax(0,1fr))}.abx-pslots{grid-template-columns:1fr}
 .abx-slot-tools{opacity:1}
}
@media (prefers-reduced-motion:reduce){.abx-node.next .abx-tile,.hot-ult.is-full{animation:none}}
@media (max-width:760px){
 .hunt-hotbar{--slot:min(46px,calc((100vw - 74px) / 6.2))!important}
 .hot-tray{gap:5px;padding:7px 8px 5px}
 .hot-gear-cell{display:none!important}
 .hot-name{font-size:9px}
 .abx-slot:not(.empty):not(.locked){padding-bottom:38px}
 .abx-slot-tools{top:auto;bottom:6px;right:8px}
 .abx-triggers{margin-top:2px}
}