@font-face {
  font-family: "Noto Sans";
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 62.5% 100%;
  font-display: swap;
  src: url("/combat/fonts/noto-sans-cyrillic-ext.woff2") format("woff2");
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: "Noto Sans";
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 62.5% 100%;
  font-display: swap;
  src: url("/combat/fonts/noto-sans-cyrillic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Noto Sans";
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 62.5% 100%;
  font-display: swap;
  src: url("/combat/fonts/noto-sans-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 100 800;
  font-display: swap;
  src: url("/combat/fonts/jetbrains-mono-variable.woff2") format("woff2");
}

:root {
  --wiki-bg: #181b1a;
  --wiki-surface: #212121;
  --wiki-surface-raised: #292929;
  --wiki-control: #303030;
  --wiki-border: #414141;
  --wiki-border-soft: #363636;
  --wiki-text: #f5f5f5;
  --wiki-muted: #a3a3a3;
  --wiki-dim: #777b79;
  --wiki-accent: #30f8a0;
  --wiki-accent-soft: #38d8c0;
  --wiki-accent-bg: #203830;
  --wiki-danger: #ff8797;
  --wiki-warning: #f1d17b;
  font-family: "Noto Sans", "Segoe UI", Arial, sans-serif;
  color: var(--wiki-text);
  background: var(--wiki-bg);
}

body,
button,
input,
select,
.catalog-result strong,
.selected-npc strong,
.skill-select-trigger,
.skill-menu-option,
.effect-chip {
  font-family: "Noto Sans", "Segoe UI", Arial, sans-serif;
}

input[type="number"],
.catalog-result small,
.catalog-result-stats,
.equipment-enchant-badge,
.equipment-twohand-badge,
.enchant-controls,
.armor-set-grade > strong,
.stat-vital-track b,
.stat-card-combat b,
.stat-card-primary b,
.metric b,
.result-row b,
.formula-row code {
  font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
  font-variant-ligatures: none;
}

[hidden] { display: none !important; }

* {
  scrollbar-color: #555 #202020;
}

body {
  color: var(--wiki-text);
  background:
    radial-gradient(circle at 50% -10%, rgba(48, 248, 160, .08), transparent 34%),
    linear-gradient(180deg, #171a19 0, var(--wiki-bg) 45%, #151716 100%);
}

.topbar {
  height: 66px;
  padding-inline: 28px;
  border-bottom-color: var(--wiki-border);
  background: rgba(33, 33, 33, .97);
  box-shadow: 0 8px 26px rgba(0, 0, 0, .22);
}

.brand-mark {
  border-color: rgba(48, 248, 160, .62);
  border-radius: 9px;
  background: #18231f;
  color: var(--wiki-accent);
}

.topbar h1 { color: #fff; font-size: 18px; font-weight: 600; }
.topbar p { color: var(--wiki-muted); font-size: 12px; }

.build-actions { gap: 8px; }
.toolbar-button {
  border-color: var(--wiki-border);
  border-radius: 999px;
  background: transparent;
  color: var(--wiki-text);
}
.toolbar-button.accent {
  border-color: var(--wiki-accent);
  background: transparent;
  color: var(--wiki-accent);
}
.build-status { color: var(--wiki-accent-soft); }
.build-status.error { color: var(--wiki-danger); }

.wiki-lang-dropdown {
  position: relative;
  display: inline-flex;
  align-items: center;
  margin-left: 4px;
}

.wiki-lang-button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 34px;
  padding: 0 14px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 9999px;
  background: #27272a;
  color: #f4f4f5;
  font-size: 13.5px;
  font-weight: 500;
  cursor: pointer;
  box-shadow: none;
  transition: background-color 0.15s ease, border-color 0.15s ease;
  white-space: nowrap;
}

.wiki-lang-button:hover {
  background: #323236;
  border-color: rgba(255, 255, 255, 0.2);
  filter: none;
}

.wiki-lang-button.open {
  background: #323236;
  border-color: rgba(255, 255, 255, 0.25);
}

.wiki-lang-icon {
  width: 15px;
  height: 15px;
  color: #e4e4e7;
  flex-shrink: 0;
}

.wiki-lang-chevron {
  width: 11px;
  height: 11px;
  color: #a1a1aa;
  flex-shrink: 0;
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

.wiki-lang-button.open .wiki-lang-chevron {
  transform: rotate(180deg);
}

.wiki-lang-menu {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  min-width: 148px;
  padding: 6px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 14px;
  background: #1e1f22;
  box-shadow: 0 14px 35px rgba(0, 0, 0, 0.65);
  z-index: 1000;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.wiki-lang-item {
  display: flex;
  align-items: center;
  width: 100%;
  height: 34px;
  padding: 0 12px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #e4e4e7;
  font-size: 13.5px;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
  box-shadow: none;
  transition: background-color 0.12s ease, color 0.12s ease;
}

.wiki-lang-item:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
  filter: none;
}

.wiki-lang-item.active {
  background: rgba(48, 248, 160, 0.12);
  color: var(--wiki-accent);
  font-weight: 600;
}

.server-status {
  border-color: var(--wiki-border);
  background: #292929;
  color: var(--wiki-muted);
}
.server-status.online {
  border-color: rgba(48, 248, 160, .55);
  background: var(--wiki-accent-bg);
  color: var(--wiki-accent);
}
.server-status.offline {
  border-color: #78424a;
  background: #392328;
  color: #ffacb7;
}

.layout { max-width: 1900px; grid-template-columns: minmax(0, 1fr) 260px; padding: 16px; gap: 14px; }
.participants {
  --actor-pane-width: calc((100% - 10px) / 2);
  grid-template-columns: minmax(0, var(--actor-pane-width)) 10px minmax(0, 1fr);
  gap: 0;
  align-items: stretch;
}
.participant { min-width: 0; container-type: inline-size; }
.participant-resizer {
  position: relative;
  z-index: 4;
  min-width: 10px;
  cursor: col-resize;
  touch-action: none;
  outline: none;
}
.participant-resizer::before {
  content: '';
  position: absolute;
  inset: 12px 4px;
  width: 2px;
  border-radius: 2px;
  background: #414b46;
  transition: background .15s, box-shadow .15s;
}
.participant-swap-button {
  position: absolute;
  z-index: 6;
  top: 14px;
  left: 50%;
  display: grid;
  width: 34px;
  height: 34px;
  padding: 0;
  place-items: center;
  transform: translateX(-50%);
  border: 1px solid #52615a;
  border-radius: 50%;
  background: #202724;
  color: var(--wiki-accent);
  box-shadow: 0 4px 16px rgba(0, 0, 0, .48);
}
.participant-swap-button svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.participant-swap-button:hover, .participant-swap-button:focus-visible { border-color: var(--wiki-accent); background: #263a32; box-shadow: 0 0 12px rgba(48, 248, 160, .35); outline: none; }
.participant-swap-button:disabled { cursor: wait; opacity: .55; }
.participant-resizer span {
  position: sticky;
  top: calc(50vh - 27px);
  display: block;
  width: 8px;
  height: 54px;
  margin: calc(50vh - 27px) auto 0;
  border: 1px solid #52615a;
  border-radius: 7px;
  background: #292f2c;
  box-shadow: 0 3px 12px rgba(0, 0, 0, .35);
}
.participant-resizer span::after {
  content: '⋮';
  display: grid;
  height: 100%;
  place-items: center;
  color: #9ba69f;
  font-size: 18px;
}
.participant-resizer:hover::before,
.participant-resizer:focus-visible::before,
.participant-resizer.dragging::before {
  background: var(--wiki-accent);
  box-shadow: 0 0 9px rgba(48, 248, 160, .45);
}
.participant-resizer:hover span,
.participant-resizer:focus-visible span,
.participant-resizer.dragging span { border-color: var(--wiki-accent); background: #263a32; }
html.participant-resizing, html.participant-resizing * { cursor: col-resize !important; user-select: none !important; }
.panel {
  border-color: var(--wiki-border);
  border-radius: 16px;
  background: rgba(33, 33, 33, .98);
  box-shadow: 0 18px 44px rgba(0, 0, 0, .18);
}
.participant, .action-panel, .result-panel { padding: 15px; }
.panel-title { color: var(--wiki-text); font-size: 13px; }
.panel-title strong { font-weight: 600; }
.side-badge,
.target-panel .side-badge {
  border: 1px solid rgba(48, 248, 160, .34);
  background: var(--wiki-accent-bg);
  color: var(--wiki-accent);
}
.mode-label { color: var(--wiki-accent-soft); }

.catalog-picker,
.equipment-builder,
.effects-builder {
  border-color: var(--wiki-border);
  border-radius: 12px;
  background: var(--wiki-surface-raised);
}
.catalog-fields.single { grid-template-columns: 1fr; }
.global-profile-picker {
  width: 190px;
  margin-left: 18px;
  color: var(--wiki-muted);
}
.global-profile-picker select { height: 30px; margin-top: 2px; }
.rounding-picker {
  display: flex;
  flex: 0 0 auto;
  flex-direction: row;
  align-items: center;
  gap: 7px;
  margin-left: 2px;
  color: var(--wiki-text);
  font-size: 12px;
  text-transform: none;
  white-space: nowrap;
}
.rounding-picker input {
  width: 15px;
  height: 15px;
  margin: 0;
  padding: 0;
  accent-color: var(--wiki-accent);
}
.derived-field { display: none !important; }
.legacy-attribute-field,
.profession-selection-summary { display: none !important; }
.actor-mode-switch, .target-mode-switch {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
  margin: -2px 0 10px;
  padding: 4px;
  border: 1px solid var(--wiki-border);
  border-radius: 999px;
  background: #292929;
}
.target-mode-switch {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.actor-panel-title, .target-panel-title { align-items: center; }
.actor-panel-title .actor-mode-switch, .target-panel-title .target-mode-switch {
  height: 25px;
  margin: 0 0 0 auto;
  padding: 2px;
  text-transform: none;
  letter-spacing: normal;
}
.actor-panel-title .actor-mode-switch {
  flex: 0 1 240px;
  width: min(240px, calc(100% - 90px));
}
.target-panel-title .target-mode-switch {
  flex: 0 1 520px;
  width: min(520px, calc(100% - 80px));
}
.actor-panel-title .actor-mode-switch button, .target-panel-title .target-mode-switch button { height: 19px; }
.target-summary-fields { margin-bottom: 10px; }
.actor-summary-fields { margin-bottom: 10px; }
.actor-mode-switch button, .target-mode-switch button {
  height: 28px;
  padding: 0 8px;
  border-color: transparent;
  background: transparent;
  color: var(--wiki-muted);
  font-size: 11px;
  white-space: nowrap;
}
.actor-mode-switch button.active, .target-mode-switch button.active {
  border-color: rgba(48, 248, 160, .56);
  background: var(--wiki-accent-bg);
  color: var(--wiki-accent);
  box-shadow: inset 0 0 12px rgba(48, 248, 160, .08);
}
.character-loadout {
  display: grid;
  grid-template-columns: 340px minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  margin-top: 10px;
}
.character-loadout .equipment-builder { min-width: 0; margin-top: 0; }
.character-stat-card {
  min-height: 398px;
  padding: 10px;
  border: 1px solid #44503f;
  border-radius: 5px;
  background: linear-gradient(150deg, rgba(34, 40, 33, .97), rgba(17, 20, 18, .98));
  color: #ddd9c9;
  font-family: "Noto Sans", "Segoe UI", Arial, sans-serif;
  box-shadow: inset 0 0 24px rgba(0, 0, 0, .48);
}
.character-stat-card.updating { opacity: 1; }
.npc-stat-card { min-height: 0; margin: 0 0 10px; }
.npc-stat-card .stat-card-empty.npc { min-height: 150px; }
.stat-card-empty { min-height: 378px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; color: #878b82; text-align: center; }
.stat-card-empty-icon { display: grid; width: 42px; height: 42px; place-items: center; color: #9da98e; }
.stat-card-empty-icon.npc { color: #a5ad91; }
.stat-card-empty-icon svg { width: 34px; height: 34px; fill: currentColor; }
.stat-card-empty-icon .monster-cut { fill: #263025; }
.stat-card-empty strong { color: #d9dccf; font-size: 13px; }
.stat-card-empty small { max-width: 190px; color: #969b91; font-size: 10px; line-height: 1.5; }
.stat-card-header { display: flex; align-items: center; gap: 11px; min-height: 62px; padding: 3px 2px 9px; border-bottom: 1px solid #394635; }
.stat-card-emblem { display: grid; flex: 0 0 48px; height: 52px; place-items: center; border: 2px solid #675c4b; background: radial-gradient(circle at 40% 26%, #b24e40, #641c20 74%); color: #e8d3ad; font-size: 27px; text-shadow: 0 2px 3px #101010; }
.stat-card-emblem.npc { background: radial-gradient(circle at 40% 26%, #738269, #384a35 74%); }
.stat-card-emblem svg { width: 31px; height: 31px; fill: currentColor; filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .55)); }
.stat-card-emblem .monster-cut { fill: #344433; }
.stat-card-header > div { display: flex; min-width: 0; flex-direction: column; gap: 4px; }
.stat-card-header strong { overflow: hidden; color: #ebe6d4; font-size: 18px; font-weight: 400; text-overflow: ellipsis; white-space: nowrap; }
.stat-card-header small { overflow: hidden; color: #c6bd9f; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.stat-card-class { display: flex; gap: 9px; padding: 8px 3px; border-bottom: 1px solid #394635; font-size: 15px; }
.stat-card-class span { color: #b9c0b1; }
.stat-card-class b { color: #d5c5a3; font-weight: 500; }
.character-stat-card section { margin-top: 8px; }
.character-stat-card h3 { margin: 0 0 4px; color: #d6dbcc; font-size: 18px; font-weight: 400; }
.stat-card-vitals,
.stat-card-combat,
.stat-card-primary { padding: 6px; border: 1px solid #354032; background: rgba(8, 11, 9, .38); }
.stat-card-vitals { display: grid; grid-template-columns: 1fr 1fr; gap: 5px 13px; margin-top: 8px; }
.stat-vital { display: flex; min-width: 0; align-items: center; gap: 6px; color: #d8d7ca; font-size: 14px; }
.stat-vital > span { flex: 0 0 24px; }
.stat-vital-track { position: relative; flex: 1; min-width: 0; height: 18px; background: #151917; }
.stat-vital-track i { position: absolute; inset: 0 auto 0 0; width: var(--vital-fill, 100%); opacity: .92; }
.stat-vital.hp .stat-vital-track i { background: #a24343; }
.stat-vital.mp .stat-vital-track i { background: #4876bc; }
.stat-vital.cp .stat-vital-track i { background: #c6922d; }
.stat-vital-track b { position: relative; display: block; overflow: hidden; color: #fff; font-size: 13px; font-weight: 400; line-height: 18px; text-align: center; text-overflow: ellipsis; white-space: nowrap; text-shadow: 0 1px 2px #000; }
.stat-card-combat > div,
.stat-card-primary > div { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 7px; padding: 4px 0; color: #d0cec0; font-size: 14px; }
.stat-card-combat b,
.stat-card-primary b { color: #ddc5a0; font-size: 14px; font-weight: 400; }
.stat-card-combat { display: grid; grid-template-columns: 1fr 1fr; gap: 0 7px; }
.stat-card-combat > div:nth-child(-n+5) { grid-column: 1; }
.stat-card-combat > div:nth-child(n+6) { grid-column: 2; }
.stat-card-combat > div:nth-child(1), .stat-card-combat > div:nth-child(6) { grid-row: 1; }
.stat-card-combat > div:nth-child(2), .stat-card-combat > div:nth-child(7) { grid-row: 2; }
.stat-card-combat > div:nth-child(3), .stat-card-combat > div:nth-child(8) { grid-row: 3; }
.stat-card-combat > div:nth-child(4), .stat-card-combat > div:nth-child(9) { grid-row: 4; }
.stat-card-combat > div:nth-child(5), .stat-card-combat > div:nth-child(10) { grid-row: 5; }
.stat-card-primary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 9px; }
.stat-card-primary-row { white-space: nowrap; }
.primary-stepper { display: inline-flex; align-items: center; gap: 2px; }
.primary-stepper b { min-width: 18px; text-align: center; }
.primary-stepper button { display: grid; width: 19px; height: 19px; padding: 0; place-items: center; border: 1px solid #526252; border-radius: 2px; background: #2b352b; color: #d3ead1; font-size: 16px; line-height: 1; }
.primary-stepper button:hover { border-color: var(--wiki-accent); background: #344a39; filter: none; }
.npc-primary b { margin-left: auto; }
.stat-card-footer { display: flex; flex-direction: column; gap: 3px; margin-top: 9px; padding-top: 7px; border-top: 1px solid #3a4637; color: #a2a69b; font-size: 12px; }
.equipment-mechanics { margin-top: 9px; }
.profile-attributes-empty,
.equipment-mechanics-title { display: flex; flex-direction: column; gap: 4px; padding: 8px; border: 1px solid #465141; background: rgba(18, 24, 19, .7); color: #d8ddd2; }
.profile-attributes-empty strong,
.equipment-mechanics-title strong { color: var(--wiki-accent); font-size: 12px; text-transform: uppercase; }
.profile-attributes-empty small,
.equipment-mechanics-title small { color: #aeb4aa; font-size: 11px; line-height: 1.4; }
.equipment-attribute { margin-top: 5px; padding: 7px; border: 1px solid #3c493b; background: #1a211c; }
.equipment-attribute > strong,
.equipment-attribute summary strong { overflow: hidden; color: #e3e0cf; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.equipment-attribute > span,
.equipment-attribute summary span { margin-left: auto; color: #99a393; font-size: 10px; }
.equipment-attribute.weapon { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 5px; }
.equipment-attribute.weapon > div { display: grid; grid-column: 1 / -1; grid-template-columns: 1fr 82px; gap: 5px; }
.equipment-attribute select,
.equipment-attribute input { height: 28px; border-radius: 3px; font-size: 12px; }
.equipment-attribute summary { display: flex; cursor: pointer; list-style-position: inside; }
.armor-attribute-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 5px; padding-top: 7px; }
.armor-attribute-grid label { font-size: 10px; }
@media (max-width: 1450px) {
  .character-loadout { grid-template-columns: 1fr; }
  .character-stat-card { min-height: 0; }
  .stat-card-primary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1150px) { .layout { grid-template-columns: 1fr; } }
.catalog-status { color: var(--wiki-muted); }
.catalog-results {
  border-color: #505050;
  border-radius: 10px;
  background: var(--wiki-surface);
  box-shadow: 0 18px 38px rgba(0, 0, 0, .5);
}
.catalog-results-close {
  position: sticky;
  z-index: 4;
  top: 4px;
  float: right;
  width: 26px;
  height: 26px;
  margin: 4px 4px -30px 0;
  padding: 0;
  border: 1px solid #58635a;
  border-radius: 50%;
  background: #202722;
  color: #dce6d8;
  box-shadow: 0 2px 7px rgba(0, 0, 0, .55);
  font-size: 17px;
  line-height: 22px;
}
.catalog-results-close:hover { border-color: #30f8a0; color: #30f8a0; }
.catalog-result {
  border-color: var(--wiki-border-soft);
  background: var(--wiki-control);
}
.catalog-result:hover { background: #36403c; }
.catalog-result strong { color: #fff; }
.catalog-result strong.rare-item-name { color: #ffd45c; }
.catalog-result small,
.catalog-result .catalog-result-stats { color: var(--wiki-muted); }

.selected-npc {
  border-color: rgba(48, 248, 160, .45);
  border-radius: 9px;
  background: var(--wiki-accent-bg);
}
.selected-npc small { color: #81cbb0; }
.selected-npc strong { color: var(--wiki-accent); }
.icon-button {
  border-color: rgba(48, 248, 160, .45);
  background: #263a33;
  color: var(--wiki-accent);
}

label { color: #b7b9b8; font-size: 11px; }
input,
select {
  border-color: #505050;
  border-radius: 9px;
  background: var(--wiki-control);
  color: #fff;
}
input::placeholder { color: #7f8280; }
input:focus,
select:focus {
  border-color: var(--wiki-accent);
  box-shadow: 0 0 0 2px rgba(48, 248, 160, .12);
}
input:disabled,
select:disabled { background: #262626; color: #9a9d9b; opacity: .76; }
option { background: var(--wiki-control); color: #fff; }
.check { border-color: #505050; border-radius: 9px; background: var(--wiki-control); }
.check input { accent-color: var(--wiki-accent); }
.check span { color: var(--wiki-text); }

button {
  border: 1px solid var(--wiki-accent);
  border-radius: 999px;
  background: var(--wiki-accent);
  color: #132019;
  box-shadow: none;
}
button:hover { filter: brightness(1.06); }
button:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
#calculate { width: 100%; font-size: 14px; }
.calculate-anchor { display: block; grid-column: span 2; min-width: 0; height: 32px; }
.calculation-action-buttons { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 7px; width: 100%; height: 32px; }
.calculation-action-buttons > button { min-width: 0; padding-inline: 12px; }
.compare-calculations { border-color: #667069; background: #303330; color: #e9f0eb; }
.calculation-action-buttons.is-floating {
  position: fixed;
  z-index: 24;
  left: var(--calculate-float-left, 50vw);
  bottom: max(14px, env(safe-area-inset-bottom));
  width: var(--calculate-float-width, min(480px, calc(100vw - 24px)));
  height: 42px;
  padding: 5px;
  border: 1px solid rgba(48, 248, 160, .25);
  border-radius: 999px;
  background: rgba(24, 27, 25, .94);
  box-shadow: 0 10px 30px rgba(0, 0, 0, .48);
  backdrop-filter: blur(10px);
  transform: translateX(-50%);
  transition: filter .18s ease, box-shadow .18s ease, opacity .18s ease;
}
.calculation-action-buttons.is-floating > button { height: 30px; }
.result-panel { top: 80px; }
.empty-result { color: var(--wiki-muted); }
.empty-result span { color: var(--wiki-accent); }
.empty-result strong { color: var(--wiki-text); }
.result-head strong { color: var(--wiki-accent); }
.result-head span { color: var(--wiki-muted); }
.metric {
  border-color: var(--wiki-border);
  border-radius: 11px;
  background: var(--wiki-surface-raised);
}
.metric small { color: var(--wiki-muted); }
.metric b,
.metric.damage b { color: var(--wiki-accent); }
.metric.critical b { color: var(--wiki-warning); }
.metric.chance b { color: var(--wiki-accent-soft); }
.metric.expected b { color: #fff; }
.metric.rate b { color: #f0d38a; font-size: 16px; }
.result-section {
  border-color: var(--wiki-border);
  border-radius: 11px;
  background: var(--wiki-surface-raised);
}
.result-section h3 { color: var(--wiki-accent); }
.result-row { border-color: var(--wiki-border-soft); color: var(--wiki-muted); }
.result-row b { color: #fff; }
.formula-row {
  padding: 10px 12px;
  border-top: 1px solid var(--wiki-border-soft);
}
.formula-row:first-of-type { border-top: 0; }
.formula-row strong,
.formula-row span,
.formula-row code { display: block; }
.formula-row strong { color: #fff; font-size: 14px; }
.formula-row span { margin-top: 3px; color: var(--wiki-muted); font-size: 13px; line-height: 1.45; }
.formula-row code {
  margin-top: 5px;
  color: var(--wiki-warning);
  font: 13px/1.5 "JetBrains Mono", Consolas, "Courier New", monospace;
  white-space: normal;
  overflow-wrap: anywhere;
}
.result-error { border-color: #75414a; background: #3a2429; color: #ffb1bc; }
.blocked { color: var(--wiki-danger) !important; }
.shield { color: var(--wiki-accent-soft) !important; }

.equipment-head { color: var(--wiki-text); }
.equipment-head span { color: var(--wiki-muted); }
.equipment-slot-holder .equipment-select {
  border-color: var(--wiki-border);
  border-radius: 2px;
}
.equipment-slot-holder.active .equipment-select {
  border-color: var(--wiki-accent);
  box-shadow: 0 0 0 1px rgba(48, 248, 160, .18);
}
.equipment-slot-holder.mirrored .equipment-select { border-color: #6a6544; }
.equipment-grid { border-color: #465141; }
.enchant-controls { border-color: #485044; }
.enchant-controls button {
  border: 0;
  border-radius: 0;
  background: #30352f;
  color: var(--wiki-accent);
}
.enchant-controls span { border-color: var(--wiki-border); color: var(--wiki-warning); }

.effect-chip {
  border-color: #427361;
  border-radius: 999px;
  background: #263a33;
  color: #bdf4df;
}
.effect-chip button { border: 0; background: transparent; color: var(--wiki-danger); }
.effect-chip select { border-radius: 999px; }

footer { color: var(--wiki-dim); }

@media (max-width: 760px) {
  .topbar { padding-inline: 12px; }
  .global-profile-picker { width: 145px; margin-left: auto; }
  .layout { padding: 8px; }
  .participants { grid-template-columns: 1fr; gap: 4px; }
  .participant-resizer { display: grid; min-height: 40px; cursor: default; place-items: center; }
  .participant-resizer::before, .participant-resizer > span { display: none; }
  .participant-swap-button { position: static; transform: none; }
  .participant, .action-panel, .result-panel { padding: 10px; }
}
@media (max-width: 560px) {
  .character-loadout { grid-template-columns: 1fr; }
  .character-stat-card { min-height: 0; }
  .stat-card-empty { min-height: 170px; }
  .actor-mode-switch, .target-mode-switch { border-radius: 12px; }
  .actor-mode-switch button, .target-mode-switch button { padding-inline: 3px; font-size: 10px; }
}
@media (max-width: 430px) {
  .topbar .brand-mark, .topbar > div:nth-child(2), .server-status { display: none; }
  .global-profile-picker { width: 150px; margin-left: 0; }
  .rounding-picker span { display: none; }
  .build-actions { margin-left: auto; }
}

@container (max-width: 690px) {
  .actor-panel-title, .target-panel-title { flex-wrap: wrap; }
  .actor-panel-title .actor-mode-switch, .target-panel-title .target-mode-switch { flex-basis: 100%; width: 100%; margin: 7px 0 0; }
  .character-loadout { grid-template-columns: 1fr; }
  .character-stat-card { min-height: 0; }
  .stat-card-primary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Language Dropdown */
.wiki-lang-dropdown {
  position: relative;
  display: inline-flex;
  align-items: center;
  z-index: 50;
}

.wiki-lang-button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 34px;
  padding: 0 14px;
  background: #27272a;
  border: 1px solid #3f3f46;
  border-radius: 9999px;
  color: #f4f4f5;
  font-family: inherit;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  box-shadow: none;
  transition: background-color 0.15s ease, border-color 0.15s ease;
  user-select: none;
}

.wiki-lang-button:hover {
  background: #323238;
  border-color: #52525b;
  filter: none;
}

.wiki-lang-icon {
  width: 15px;
  height: 15px;
  flex-shrink: 0;
  color: #e4e4e7;
}

.wiki-lang-chevron {
  width: 12px;
  height: 12px;
  flex-shrink: 0;
  color: #a1a1aa;
  transition: transform 0.2s ease;
}

.wiki-lang-dropdown.open .wiki-lang-chevron {
  transform: rotate(180deg);
}

.wiki-lang-dropdown.open .wiki-lang-button {
  background: #323238;
  border-color: #52525b;
}

.wiki-lang-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  min-width: 140px;
  padding: 6px;
  background: #1e1f22;
  border: 1px solid #33363d;
  border-radius: 12px;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.55);
  display: flex;
  flex-direction: column;
  gap: 2px;
  z-index: 100;
}

.wiki-lang-menu[hidden] {
  display: none !important;
}

.wiki-lang-item {
  display: flex;
  align-items: center;
  width: 100%;
  height: 34px;
  padding: 0 14px;
  background: transparent !important;
  border: 0;
  border-radius: 8px;
  color: #f4f4f5;
  font-family: inherit;
  font-size: 13px;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
  box-shadow: none;
  transition: background-color 0.15s ease, color 0.15s ease;
}

.wiki-lang-item:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  filter: none;
}

.wiki-lang-item.active {
  background: transparent !important;
  color: #38ef7d !important;
  font-weight: 600;
}

@media (max-width: 760px) {
  .wiki-lang-button {
    height: 29px;
    padding: 0 9px;
    font-size: 11px;
  }
}

@media (max-width: 430px) {
  .wiki-lang-button span {
    display: none;
  }
}

.summon-controls { grid-template-columns: minmax(130px,.7fr) minmax(180px,1.3fr); margin-top: 8px; } .summon-controls[hidden] { display:none; }
.master-buffs-builder { border-left: 3px solid var(--wiki-accent, #4a9eff) !important; }
.master-buffs-builder .effects-head strong { color: var(--wiki-accent, #4a9eff); }

/* Calculation history and comparison */
.result-head-with-picker { display: flex; flex-direction: column; align-items: stretch; gap: 8px; }
.result-title-row { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 5px; }
.result-title-row > strong { min-width: 0; white-space: nowrap; }
.result-title-row > button { flex: 0 0 auto; height: 21px; padding-inline: 7px; border-color: #b84957; background: #8b2937; color: #fff; font-size: 8px; line-height: 1; }
.result-title-row > button:hover { background: #a93343; }
.result-title-row > button:disabled { cursor: default; opacity: .42; }
.result-history-controls { display: grid; grid-template-columns: minmax(0, 1fr) 30px auto; gap: 6px; align-items: end; }
.result-history-picker { width: 100%; }
.result-history-controls > button { height: 30px; padding-inline: 12px; font-size: 11px; }
.history-delete-button { width: 30px; height: 30px; padding: 0 !important; display: grid; place-items: center; border-color: #74464c; background: #3a2529; color: #ff9aa9; font-size: 18px !important; line-height: 1; }
.history-delete-button:disabled { cursor: default; opacity: .4; }
.result-history-picker span { color: var(--wiki-muted); font-size: 10px; }
.result-history-picker select { height: 30px; font-size: 11px; }
.calculation-history-popup {
  position: fixed;
  z-index: 50;
  left: 50%;
  bottom: max(12px, env(safe-area-inset-bottom));
  width: min(1500px, calc(100vw - 24px));
  max-height: min(82vh, 860px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid #4a5e50;
  border-radius: 16px;
  background: rgba(28, 29, 28, .985);
  box-shadow: 0 24px 70px rgba(0, 0, 0, .72), 0 0 0 1px rgba(48, 248, 160, .09);
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 22px) scale(.985);
  transition: opacity .18s ease, transform .18s ease;
}
.calculation-history-popup[hidden] { display: none; }
.calculation-history-popup.is-open { opacity: 1; pointer-events: auto; transform: translate(-50%, 0) scale(1); }
.calculation-history-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border-bottom: 1px solid var(--wiki-border); background: #202220; }
.calculation-history-header > div { display: flex; align-items: baseline; gap: 9px; }
.calculation-history-header strong { color: var(--wiki-accent); font-size: 14px; text-transform: uppercase; }
.calculation-history-header span { color: var(--wiki-muted); font-size: 11px; }
.calculation-history-close { width: 30px; height: 30px; padding: 0; display: grid; place-items: center; border-color: #59605b; background: #2b2d2b; color: #fff; font-size: 20px; line-height: 1; }
.calculation-comparison { min-height: 0; padding: 12px; overflow: auto; }
.calculation-compare-grid { display: grid; grid-template-columns: minmax(360px, 1fr) minmax(360px, 1fr); gap: 12px; min-width: 744px; }
.calculation-compare-column { min-width: 0; max-height: calc(min(82vh, 860px) - 76px); overflow: auto; padding: 10px; border: 1px solid var(--wiki-border); border-radius: 12px; background: #171917; }
.calculation-compare-picker { position: sticky; z-index: 2; top: -10px; margin: -10px -10px 10px; padding: 10px; border-bottom: 1px solid var(--wiki-border); background: rgba(32, 34, 32, .97); }
.calculation-compare-picker > span { display: block; margin-bottom: 5px; color: var(--wiki-accent); font-size: 11px; font-weight: 700; text-transform: uppercase; }
.calculation-compare-picker-controls { display: grid; grid-template-columns: minmax(0, 1fr) 30px; gap: 6px; }
.calculation-compare-picker select { height: 32px; }
.calculation-compare-picker .history-delete-button { height: 32px; }
.comparison-diff-higher { border-color: rgba(62, 220, 139, .82) !important; background: rgba(49, 190, 120, .13) !important; }
.comparison-diff-lower { border-color: rgba(244, 91, 111, .82) !important; background: rgba(220, 65, 88, .13) !important; }
.comparison-diff-changed { border-color: rgba(240, 211, 138, .72) !important; background: rgba(240, 211, 138, .09) !important; }
.result-row.comparison-diff-higher, .result-row.comparison-diff-lower, .result-row.comparison-diff-changed,
.formula-row.comparison-diff-higher, .formula-row.comparison-diff-lower, .formula-row.comparison-diff-changed { padding-inline: 7px; border-radius: 5px; }
.comparison-diff-higher > b, .comparison-diff-higher .diff-delta { color: #62f2a7 !important; }
.comparison-diff-lower > b, .comparison-diff-lower .diff-delta { color: #ff8797 !important; }
.metric-value-line { display: flex; min-width: 0; align-items: baseline; justify-content: space-between; gap: 7px; margin-top: 4px; white-space: nowrap; }
.metric-value-line > b { min-width: 0; margin-top: 0; }
.metric-value-line > .diff-delta { margin-left: auto; }
.result-panel .metric-value-line.metric-value-range { align-items: flex-start; white-space: normal; }
.result-panel .metric-value-range > b { max-width: 100%; font-size: 15px; line-height: 1.15; overflow-wrap: normal; }
.result-panel .result-row { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); align-items: start; gap: 7px; padding-block: 5px; line-height: 1.3; }
.result-panel .result-row > span { min-width: 0; overflow-wrap: anywhere; }
.result-panel .result-row > b { display: block; min-width: 0; margin-left: 0; color: #fff; font-size: 10px; line-height: 1.3; text-align: right; white-space: normal; overflow-wrap: anywhere; }
.result-row > b { display: flex; min-width: 0; align-items: baseline; justify-content: flex-end; gap: 7px; white-space: nowrap; }
.diff-delta { display: inline-block; flex: 0 0 auto; margin: 0; font: 9px "JetBrains Mono", Consolas, monospace; white-space: nowrap; }.calculation-empty { padding: 30px; color: var(--wiki-muted); text-align: center; }
@media (max-width: 760px) {
  .calculation-history-popup { width: calc(100vw - 12px); bottom: max(6px, env(safe-area-inset-bottom)); max-height: 88vh; }
  .calculation-comparison { padding: 7px; }
  .calculation-compare-grid { gap: 7px; min-width: 680px; }
  .calculation-compare-column { max-height: calc(88vh - 70px); }
}