/* Zenaria v3: база знаний. Префикс kb-. Построено на наборе xp-* и токенах главной. */

.kb-head .x-lead a { color: var(--accent-2); }
.kb-crumb { flex-wrap: wrap; }
.kb-crumb span[aria-hidden] { color: var(--faint); }
.kb-note { margin-top: 14px !important; color: var(--faint); font-size: 14px; line-height: 1.55; max-width: 90ch; }
.kb-note a, .xp-sub a { color: var(--accent-2); }
.kb-muted { color: var(--faint); font-size: .92em; font-weight: 400; }
.kb-sec-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 12px 24px; margin-bottom: 18px; }
.kb-sec-head .xp-h2 { margin: 0; }
.kb-card-h { font-size: 18px; font-weight: 600; letter-spacing: -.015em; margin: 0 0 14px; }

/* поиск */
.kb-search { position: relative; max-width: 640px; margin-top: 26px; }
.kb-search > .ico { position: absolute; z-index: 2; left: 18px; top: 18px; width: 20px; height: 20px; color: var(--dim); pointer-events: none; }
.v3 .kb-search input[type="search"] { width: 100%; height: 56px; padding: 0 20px 0 52px; border-radius: 999px; border: 1px solid var(--line-hi); background: rgb(7 8 11 / .7);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); color: var(--text); font: 400 16px var(--font); }
.kb-search input:focus { outline: none; border-color: var(--accent); }
.kb-results { position: absolute; z-index: 20; left: 0; right: 0; top: calc(100% + 8px); margin: 0; padding: 6px; list-style: none; max-height: 420px; overflow: auto;
  border: 1px solid var(--line-hi); border-radius: 16px; background: #0f1116; box-shadow: 0 20px 50px rgb(0 0 0 / .5); }
.kb-results a { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; padding: 10px 12px; border-radius: 10px; color: var(--text); text-decoration: none; }
.kb-results a:hover, .kb-results a.is-sel { background: rgb(255 255 255 / .06); }
.kb-results b { font-weight: 500; }
.kb-results small { color: var(--faint); font-size: 12px; }
.kb-results .kb-r-type { grid-row: 1 / span 2; grid-column: 2; align-self: center; font-size: 12px; color: var(--dim); }
.kb-results .kb-r-empty { padding: 12px; color: var(--faint); font-size: 14px; }

/* карточки разделов на главной базы */
.kb-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.kb-card { position: relative; display: block; min-height: 220px; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--line); background: #0d0f14;
  color: var(--text); text-decoration: none; isolation: isolate; }
.kb-card-big { grid-column: span 1; min-height: 300px; }
.kb-cards .kb-card:nth-child(1), .kb-cards .kb-card:nth-child(2) { grid-column: span 1; }
.kb-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform .6s var(--ease); }
.kb-card::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgb(7 8 11 / .05) 30%, rgb(7 8 11 / .92) 100%); }
.kb-card:hover img { transform: scale(1.04); }
.kb-card:hover { border-color: var(--line-hi); }
.kb-card-body { position: absolute; left: 22px; right: 22px; bottom: 20px; display: grid; gap: 4px; }
.kb-card-body b { font-size: 22px; font-weight: 600; letter-spacing: -.02em; }
.kb-card-body b small { font-size: 14px; font-weight: 500; color: var(--dim); margin-left: 4px; }
.kb-card-body span { color: var(--dim); font-size: 14px; line-height: 1.45; }
@media (min-width: 1000px) { .kb-cards { grid-template-columns: repeat(12, minmax(0, 1fr)); } .kb-card { grid-column: span 3; } .kb-cards .kb-card:nth-child(-n+2) { grid-column: span 6; } .kb-cards .kb-card:nth-child(n+3):nth-child(-n+5) { grid-column: span 4; } }

.kb-guides { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; }
.kb-guides a { display: grid; gap: 6px; height: 100%; padding: 20px; color: var(--text); text-decoration: none; }
.kb-guides a:hover { border-color: var(--line-hi); }
.kb-guides b { font-size: 16px; font-weight: 600; letter-spacing: -.01em; line-height: 1.3; }
.kb-guides span { color: var(--faint); font-size: 14px; line-height: 1.5; }
.kb-two { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.kb-list-card { padding: 24px; display: grid; gap: 14px; align-content: start; }
.kb-mini { list-style: none; margin: 0; padding: 0; display: grid; }
.kb-mini li { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.kb-mini li:last-child { border-bottom: 0; }
.kb-mini a { color: var(--text); text-decoration: none; font-weight: 500; }
.kb-mini a:hover { color: var(--accent-2); }
.kb-mini li > span:last-child { color: var(--faint); white-space: nowrap; font-variant-numeric: tabular-nums; }
.kb-cta { display: grid; gap: 6px; padding: 24px; color: var(--text); text-decoration: none; }
.kb-cta b { font-size: 18px; font-weight: 600; }
.kb-cta span { color: var(--faint); font-size: 14px; }
.kb-cta:hover { border-color: var(--line-hi); }

/* нижняя навигация по разделам */
.kb-sections { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 28px; border-top: 1px solid var(--line); }
.kb-sections a { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 999px; border: 1px solid var(--line-hi); background: var(--glass);
  color: var(--dim); font-size: 14px; font-weight: 500; text-decoration: none; }
.kb-sections a:hover { color: var(--text); }
.kb-sections a[aria-current] { background: var(--text); border-color: var(--text); color: #0b0c10; }
.kb-sections .ico { width: 16px; height: 16px; }
.kb-more { width: var(--wrap); margin: 40px auto 0; display: flex; flex-wrap: wrap; gap: 8px 22px; }
.kb-more a { color: var(--accent-2); font-size: 15px; font-weight: 500; text-decoration: none; }
.kb-more a:hover { color: var(--text); }

/* таблицы */
.kb-table td { line-height: 1.45; }
.kb-table tr.is-boss td:first-child a { color: var(--accent-2); }
.kb-badge { display: inline-block; margin-left: 6px; padding: 2px 8px; border-radius: 999px; background: rgb(227 38 54 / .16); color: var(--accent-2); font-size: 11px; font-weight: 600; vertical-align: 1px; }
.kb-where { color: var(--faint); font-size: 13px; }
.kb-filter input { height: 42px; width: min(280px, 100%); padding: 0 14px; border-radius: 12px; border: 1px solid var(--line-hi); background: rgb(7 8 11 / .6); color: var(--text); font: 400 14px var(--font); }
.kb-filter input:focus { outline: none; border-color: var(--accent); }
.kb-link { color: var(--text); text-decoration: none; font-weight: 500; }
.kb-link:hover { color: var(--accent-2); }
.kb-item-link { display: inline-flex; align-items: center; gap: 10px; vertical-align: middle; }
.kb-ico { flex: none; object-fit: contain; filter: drop-shadow(0 0 1px rgb(255 255 255 / .45)) drop-shadow(0 0 5px rgb(255 255 255 / .12)) drop-shadow(0 4px 8px rgb(0 0 0 / .5)); }   /* светлый контур: тёмные рендеры (Wings of Darkness, Cloak of Death) не сливаются с фоном */
.kb-ico-none { display: inline-block; border-radius: 8px; border: 1px dashed var(--line-hi); }
.kb-items-table td:first-child { min-width: 220px; }
.kb-reqs { display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: 13px; color: var(--faint); }
.kb-req b { color: var(--dim); font-weight: 500; }
.kb-clss { white-space: nowrap; }
.kb-cls { display: inline-block; margin: 0 4px 2px 0; padding: 2px 7px; border-radius: 6px; background: rgb(255 255 255 / .06); color: var(--dim); font-size: 11px; font-weight: 600; text-decoration: none; }
a.kb-cls:hover { color: var(--text); }
.kb-cls-all { background: none; padding: 0; font-weight: 400; color: var(--faint); font-size: 13px; }
.kb-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.kb-chips li { padding: 7px 14px; border-radius: 999px; border: 1px solid var(--line); background: var(--glass); font-size: 14px; color: var(--dim); }
.kb-chips li:has(a) { padding: 0; }
.kb-chips a { display: inline-flex; gap: 8px; padding: 7px 14px; color: var(--text); text-decoration: none; }
.kb-chips a span { color: var(--faint); }
.kb-chips a:hover { color: var(--accent-2); }
.kb-toc-inline { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 22px; }
.kb-toc-inline a { color: var(--dim); font-size: 14px; text-decoration: none; border-bottom: 1px solid var(--line-hi); padding-bottom: 2px; }
.kb-toc-inline a:hover { color: var(--text); }

/* классы */
.kb-classes { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; }
.kb-class { position: relative; display: block; aspect-ratio: 3 / 4; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--line); color: var(--text); text-decoration: none; isolation: isolate; background: #0d0f14; }
.kb-class img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform .6s var(--ease); }
.kb-class::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, transparent 40%, rgb(7 8 11 / .95) 100%); }
.kb-class:hover img { transform: scale(1.04); }
.kb-class-body { position: absolute; left: 18px; right: 18px; bottom: 16px; display: grid; gap: 3px; }
.kb-class-body b { font-size: 20px; font-weight: 600; letter-spacing: -.02em; }
.kb-class-ru { color: var(--dim); font-size: 14px; }
.kb-class-line { color: var(--faint); font-size: 12px; }
.kb-class-open { color: var(--accent-2); font-size: 12px; font-weight: 500; margin-top: 4px; }
.kb-split { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 32px; align-items: end; }
.kb-split-img { width: 100%; height: auto; border-radius: var(--radius); border: 1px solid var(--line); }
.kb-line { list-style: none; margin: 24px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.kb-line li { display: grid; gap: 2px; padding: 10px 16px; border-radius: 14px; border: 1px solid var(--line); background: var(--glass); }
.kb-line b { font-size: 15px; font-weight: 600; }
.kb-line span { font-size: 12px; color: var(--faint); }
.kb-stats { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.kb-stats .x-card { padding: 18px 20px; display: grid; gap: 4px; }
.kb-stats b { font-size: 30px; font-weight: 600; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.kb-stats span { color: var(--faint); font-size: 13px; }
.kb-steps { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; margin-bottom: 14px; }
.kb-step { padding: 20px; display: grid; gap: 8px; align-content: start; }
.kb-step h3 { font-size: 17px; font-weight: 600; margin: 0; }
.kb-step p { margin: 0 !important; color: var(--dim); font-size: 14px; line-height: 1.55; }
.kb-step-k { font-size: 12px !important; color: var(--accent-2) !important; font-weight: 500; }
.kb-set-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; }
.kb-set-list a { display: flex; align-items: center; gap: 12px; padding: 12px 16px; color: var(--text); text-decoration: none; }
.kb-set-list a > span { display: grid; gap: 2px; }
.kb-set-list small { color: var(--faint); font-size: 12px; }
.kb-set-list a:hover { border-color: var(--line-hi); }

/* карты */
.kb-maps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.kb-map { position: relative; display: block; aspect-ratio: 16 / 10; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--line); color: var(--text); text-decoration: none; isolation: isolate;
  background: radial-gradient(120% 120% at 100% 0%, rgb(227 38 54 / .12), transparent 60%), linear-gradient(180deg, var(--glass), rgb(255 255 255 / .015)); }
.kb-map img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform .6s var(--ease); }
.kb-map::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, transparent 35%, rgb(7 8 11 / .92) 100%); }
.kb-map:hover img { transform: scale(1.04); }
.kb-map-body { position: absolute; left: 18px; right: 18px; bottom: 14px; display: grid; gap: 3px; }
.kb-map-body b { font-size: 19px; font-weight: 600; letter-spacing: -.02em; }
.kb-map-body span { color: var(--dim); font-size: 13px; }
.kb-prevnext { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.kb-prevnext a { display: grid; gap: 4px; padding: 18px 20px; color: var(--text); text-decoration: none; }
.kb-prevnext a:hover { border-color: var(--line-hi); }
.kb-prevnext small { color: var(--faint); font-size: 12px; }
.kb-prevnext b { font-size: 17px; font-weight: 600; }
.kb-prevnext .kb-next { text-align: right; }

/* монстры */
.kb-boss-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 10px; }
.kb-boss-list a { display: grid; gap: 3px; padding: 16px 18px; height: 100%; color: var(--text); text-decoration: none; }
.kb-boss-list a:hover { border-color: rgb(227 38 54 / .5); }
.kb-boss-list b { font-size: 16px; font-weight: 600; }
.kb-boss-list span { color: var(--dim); font-size: 13px; font-variant-numeric: tabular-nums; }
.kb-boss-list small { color: var(--faint); font-size: 12px; }
.kb-infobox { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 24px; align-items: start; }
.kb-infobox:not(:has(.kb-portrait)) { grid-template-columns: 1fr; }
.kb-portrait img { width: 260px; height: auto; border-radius: var(--radius); border: 1px solid var(--line); background: radial-gradient(circle at 50% 40%, rgb(255 255 255 / .06), transparent 70%); }
.kb-dl { margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; }
.kb-dl > div { padding: 14px 16px; border-radius: 14px; border: 1px solid var(--line); background: linear-gradient(180deg, var(--glass), rgb(255 255 255 / .015)); }
.kb-dl dt { font-size: 12px; color: var(--faint); margin-bottom: 4px; }
.kb-dl dd { margin: 0; font-size: 20px; font-weight: 600; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.kb-drops { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.kb-drops li { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 12px; border: 1px solid var(--line); background: var(--glass); }
.kb-drops-grid { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.kb-chance { margin-left: auto; color: var(--accent-2); font-weight: 600; font-size: 13px; font-variant-numeric: tabular-nums; }

/* разделы предметов */
.kb-secs { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 10px; }
.kb-sec-card { display: flex; align-items: center; gap: 14px; padding: 14px 16px; color: var(--text); text-decoration: none; }
.kb-sec-card > span { display: grid; gap: 2px; }
.kb-sec-card b { font-size: 15px; font-weight: 600; }
.kb-sec-card small { color: var(--faint); font-size: 12px; }
.kb-sec-card:hover { border-color: var(--line-hi); }

/* страница предмета */
.kb-item-hero { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 28px; align-items: center; }
.kb-item-pic { display: grid; place-items: center; width: 200px; height: 200px; border-radius: 24px; border: 1px solid var(--line-hi);
  background: radial-gradient(70% 70% at 50% 45%, rgb(255 255 255 / .08), transparent 70%), rgb(7 8 11 / .6); }
.kb-item-pic img { width: 176px; height: 176px; object-fit: contain; filter: drop-shadow(0 12px 20px rgb(0 0 0 / .6)); }
.kb-item-pic.is-exc { border-color: rgb(111 207 127 / .5); background: radial-gradient(70% 70% at 50% 45%, rgb(111 207 127 / .14), transparent 70%), rgb(7 8 11 / .6); }
.kb-item-main { display: grid; grid-template-columns: minmax(0, 420px) minmax(0, 1fr); gap: 20px; align-items: start; }
.kb-tip-ctl { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.kb-tip-ctl button { padding: 6px 12px; border-radius: 999px; border: 1px solid var(--line-hi); background: var(--glass); color: var(--dim); font: 500 13px var(--font); cursor: pointer; }
.kb-tip-ctl button:hover { color: var(--text); }
.kb-tip-ctl .is-on, .kb-tip-ctl [aria-pressed="true"] { background: var(--text); border-color: var(--text); color: #0b0c10; }
.kb-tip-ctl .kb-exc[aria-pressed="true"] { background: rgb(111 207 127 / .2); border-color: rgb(111 207 127 / .6); color: #bff0c9; }
.kb-tip { list-style: none; margin: 0; padding: 18px 20px; display: grid; gap: 4px; border-radius: 16px; border: 1px solid var(--line-hi); background: rgb(7 8 11 / .85);
  font-size: 14px; line-height: 1.45; text-align: center; font-variant-numeric: tabular-nums; }
.kb-tip-name { font-size: 16px; font-weight: 600; color: var(--text); margin-bottom: 6px; }
.kb-tip.is-exc .kb-tip-name { color: #8ee09a; }
.kb-tip .s-base { color: var(--text); }
.kb-tip .s-req, .kb-tip .s-cls { color: var(--faint); font-size: 13px; }
.kb-tip .s-opt, .kb-tip .s-exc, td.s-opt { color: #8fb0ff; }
.kb-tip .s-anc { color: #7ed89a; }
.kb-dl-compact { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.kb-dl-compact dd { font-size: 17px; }
.kb-where-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; align-items: start; }
.kb-where-grid .x-card { padding: 20px; }
.kb-where-grid h3 { font-size: 15px; font-weight: 600; margin: 0 0 8px; }

/* комплекты */
.kb-cls-filter { display: flex; flex-wrap: wrap; gap: 6px; }
.kb-cls-filter button { padding: 6px 12px; border-radius: 999px; border: 1px solid var(--line-hi); background: var(--glass); color: var(--dim); font: 600 12px var(--font); cursor: pointer; }
.kb-cls-filter .is-on { background: var(--text); border-color: var(--text); color: #0b0c10; }
.kb-set-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 12px; }
.kb-set-grid li[hidden] { display: none; }
.kb-set-card { display: grid; gap: 6px; height: 100%; padding: 16px 18px; color: var(--text); text-decoration: none; }
.kb-set-card:hover { border-color: var(--line-hi); }
.kb-set-pics { display: flex; gap: 2px; margin-bottom: 4px; }
.kb-set-card b { font-size: 16px; font-weight: 600; }
.kb-set-card small { color: var(--faint); font-size: 12px; }
.kb-parts { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
.kb-parts li { display: grid; justify-items: center; gap: 6px; padding: 18px; text-align: center; }
.kb-parts .kb-item-link { flex-direction: column; gap: 8px; }

/* камни */
.kb-jewels { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 12px; }
.kb-jewels li { display: grid; gap: 8px; padding: 18px 20px; }
.kb-jewels p { margin: 0 !important; color: var(--dim); font-size: 14px; line-height: 1.5; }
.kb-zjewels { list-style: none; margin: 0; padding: 0; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.kb-zjewels li { display: grid; grid-template-columns: 190px minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 14px 20px; border-bottom: 1px solid var(--line); }
.kb-zjewels li:last-child { border-bottom: 0; }
.kb-zjewels b { font-weight: 600; }
.kb-zjewels span { color: var(--dim); font-size: 14px; }
.kb-zjewels i { font-style: normal; padding: 4px 10px; border-radius: 999px; background: rgb(227 38 54 / .14); color: var(--accent-2); font-weight: 600; font-size: 13px; }

/* рецепты */
.kb-recipes { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 12px; align-items: start; }
.kb-recipe { padding: 22px; display: grid; gap: 12px; align-content: start; scroll-margin-top: 100px; }
.kb-recipe:target { border-color: var(--accent); }
.kb-recipe header { display: grid; gap: 6px; }
.kb-recipe h3 { font-size: 18px; font-weight: 600; margin: 0; letter-spacing: -.01em; }
.kb-recipe-meta { display: flex; flex-wrap: wrap; gap: 6px 12px; margin: 0 !important; font-size: 13px; color: var(--faint); }
.kb-pct { padding: 2px 9px; border-radius: 999px; background: rgb(227 38 54 / .16); color: var(--accent-2); font-weight: 600; }
.kb-pct-var { background: rgb(255 255 255 / .06); color: var(--dim); }
.kb-recipe > p { margin: 0 !important; color: var(--dim); font-size: 14px; line-height: 1.55; }
.kb-ingr { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.kb-ingr li { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 8px 12px; border-radius: 12px; background: rgb(255 255 255 / .03); font-size: 14px; }
.kb-cnt { margin-left: auto; color: var(--faint); font-size: 13px; font-variant-numeric: tabular-nums; }
.kb-any { color: var(--dim); }
.kb-result { font-size: 14px; }

/* квесты */
.kb-quest-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; counter-reset: q; }
.kb-quest-steps li { padding: 20px 22px; display: grid; gap: 6px; }
.kb-quest-steps h3 { font-size: 17px; font-weight: 600; margin: 0; }
.kb-quest-steps p { margin: 0 !important; color: var(--dim); font-size: 14px; line-height: 1.6; }
.kb-reward { color: var(--text) !important; }

/* гайды */
.kb-guide-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
.kb-guide-card { display: grid; height: 100%; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--line); background: linear-gradient(180deg, var(--glass), rgb(255 255 255 / .015));
  color: var(--text); text-decoration: none; }
.kb-guide-card img { width: 100%; aspect-ratio: 16 / 8; object-fit: cover; }
.kb-guide-card > span { display: grid; gap: 6px; padding: 18px 20px 20px; align-content: start; }
.kb-guide-card b { font-size: 17px; font-weight: 600; letter-spacing: -.01em; line-height: 1.3; }
.kb-guide-card small { color: var(--faint); font-size: 14px; line-height: 1.5; }
.kb-guide-card:hover { border-color: var(--line-hi); }
.kb-article-wrap { display: grid; grid-template-columns: 240px minmax(0, 760px); gap: 48px; align-items: start; }
.kb-toc { position: sticky; top: 100px; padding: 18px 20px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--glass); }
.kb-toc-h { margin: 0 0 10px !important; font-size: 13px; color: var(--faint); }
.kb-toc ol { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.kb-toc a { color: var(--dim); font-size: 14px; line-height: 1.4; text-decoration: none; }
.kb-toc a:hover, .kb-toc a.is-on { color: var(--text); }
.kb-prose { font-size: 17px; line-height: 1.7; color: var(--dim); }
.kb-prose section { scroll-margin-top: 100px; }
.kb-prose section + section { margin-top: 40px; }
.kb-prose h2 { font-size: clamp(24px, 2.4vw, 30px); letter-spacing: -.025em; line-height: 1.2; color: var(--text); margin: 0 0 16px; }
.kb-prose h3 { font-size: 19px; color: var(--text); margin: 24px 0 10px; }
.kb-prose p { margin: 0 0 14px; }
.kb-prose strong { color: var(--text); font-weight: 600; }
.kb-prose a { color: var(--accent-2); text-decoration: none; border-bottom: 1px solid rgb(227 38 54 / .3); }
.kb-prose a:hover { color: var(--text); }
.kb-prose ul, .kb-prose ol { margin: 0 0 16px; padding-left: 22px; display: grid; gap: 6px; }
.kb-prose li::marker { color: var(--accent-2); }
.kb-prose table { width: 100%; margin: 6px 0 18px; border-collapse: separate; border-spacing: 0; font-size: 15px; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
@media (max-width: 767px) { .kb-prose table { display: block; overflow-x: auto; } }
.kb-prose th { text-align: left; padding: 10px 14px; font-size: 13px; font-weight: 500; color: var(--faint); background: rgb(255 255 255 / .03); border-bottom: 1px solid var(--line); white-space: nowrap; }
.kb-prose td { padding: 10px 14px; border-bottom: 1px solid var(--line); color: var(--text); }
.kb-prose tr:last-child td { border-bottom: 0; }
.kb-faq-list { display: grid; gap: 10px; max-width: 900px; }
.kb-q { padding: 0; }
.kb-q summary { padding: 18px 22px; cursor: pointer; font-weight: 600; font-size: 16px; list-style: none; }
.kb-q summary::-webkit-details-marker { display: none; }
.kb-q summary::after { content: "+"; float: right; color: var(--faint); font-weight: 400; }
.kb-q[open] summary::after { content: "−"; }
.kb-a { padding: 0 22px 18px; color: var(--dim); font-size: 15px; line-height: 1.65; }

@media (max-width: 1000px) {
  .kb-article-wrap { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .kb-toc { position: static; }
  .kb-item-main { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .kb-cards { grid-template-columns: 1fr; }
  .kb-card, .kb-card-big { min-height: 200px; }
  .kb-two, .kb-prevnext { grid-template-columns: 1fr; }
  .kb-split { grid-template-columns: 1fr; }
  .kb-split-img { max-width: 260px; }
  .kb-item-hero { grid-template-columns: 1fr; gap: 18px; }
  .kb-item-pic { width: 160px; height: 160px; }
  .kb-item-pic img { width: 140px; height: 140px; }
  .kb-infobox { grid-template-columns: 1fr; }
  .kb-portrait img { width: 200px; }
  .kb-zjewels li { grid-template-columns: 1fr auto; }
  .kb-zjewels span { grid-column: 1 / -1; grid-row: 2; }
  .kb-recipes { grid-template-columns: 1fr; }
  .kb-prose { font-size: 16px; }
  .kb-search input { height: 50px; }
  .kb-items-table td:first-child { min-width: 180px; }
}

/* карточки главной занимают несколько колонок сетки; в базе знаний сетки свои */
.v3 [class*="kb-"] > .x-card, .v3 [class*="kb-"] > li > .x-card, .v3 [class*="kb-"] > li.x-card { grid-column: auto; }

/* портреты монстров из клиента */
.kb-mon-link { display: inline-flex; align-items: center; gap: 10px; vertical-align: middle; }
.kb-mon-ico { flex: none; object-fit: contain; border-radius: 10px; background: radial-gradient(circle at 50% 45%, rgb(255 255 255 / .07), transparent 70%); }
.kb-boss-list a { grid-template-columns: 72px minmax(0, 1fr); column-gap: 14px; align-items: center; }
.kb-boss-list a > :not(img) { grid-column: 2; }
.kb-boss-img { grid-row: 1 / span 3; width: 72px; height: 72px; object-fit: contain; filter: drop-shadow(0 6px 10px rgb(0 0 0 / .5)); }
.kb-chips a img { width: 28px; height: 28px; object-fit: contain; margin: -4px 0; }
.kb-portrait img { width: 300px; }
.kb-about-text { max-width: 80ch; color: var(--dim); font-size: 16px; line-height: 1.7; margin: 0; }
.v3 .kb-fresh { width: var(--wrap); margin: 18px auto 0; color: var(--faint); font-size: 13px; }

/* Подсказки поиска выпадают поверх следующих блоков: блок с поиском стоит слоем выше остальных */
main > *:has(.kb-search) { z-index: 6; }
.kb-hp-map { display: block; margin-top: 2px; font-size: 12px; font-weight: 400; color: var(--dim); }
/* Плитка «Где взять» в карточке вещи: шире остальных, с примером монстра и карты */
.kb-dl > .kb-dl-where { grid-column: span 2; }
.kb-dl-where dd a { color: var(--text); text-decoration: none; border-bottom: 1px solid rgb(255 255 255 / .25); }
.kb-dl-where dd a:hover { border-bottom-color: var(--accent-2); }
.kb-dl-where small { display: block; margin-top: 4px; font-size: 12px; color: var(--dim); }
.kb-dl-where small a { color: var(--accent-2); text-decoration: none; }
@media (max-width: 420px) { .kb-dl > .kb-dl-where { grid-column: 1 / -1; } }
.kb-where-note { margin: -2px 0 8px; font-size: 12px; color: var(--dim); }
.kb-loot-h { margin: 0 0 6px; font-size: 13px; font-weight: 600; color: var(--dim); text-transform: uppercase; letter-spacing: .04em; }
.kb-loot-h + .xp-ticks { margin-bottom: 14px; }
.kb-loot-list > li a { color: var(--text); font-weight: 600; }
.kb-loot-in { list-style: none; margin: 8px 0 4px; padding: 0; display: grid; gap: 4px; font-size: 14px; color: var(--dim); }
.kb-loot-in b { display: inline-block; min-width: 54px; color: var(--accent-2); font-weight: 600; font-variant-numeric: tabular-nums; }
/* хвост длинного списка монстров: раскрывается по нажатию */
.kb-mon-more { margin-top: 2px; border-top: 1px solid var(--line); }
.kb-mon-more > summary { cursor: pointer; padding: 9px 0; font-size: 14px; color: var(--accent-2); list-style: none; }
.kb-mon-more > summary::-webkit-details-marker { display: none; }
.kb-mon-more > summary::after { content: " ▾"; }
.kb-mon-more[open] > summary::after { content: " ▴"; }

/* карточки гайдов: картинка всегда 16:8, текстовая часть тянется, чтобы карточки в ряду были одной высоты */
.kb-guide-grid > li { display: flex; }
.kb-guide-card { display: flex; flex-direction: column; width: 100%; }
.kb-guide-card img { display: block; height: auto; flex: none; }
.kb-guide-card > span { flex: 1 1 auto; }
.kb-guide-card small { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* содержимое коробки: ровная сетка вещей вместо сплошного потока */
.kb-inbox { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 8px 16px; }
.kb-inbox .kb-item-link { gap: 8px; min-width: 0; }
.kb-inbox .kb-item-link span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kb-inbox-more { margin-top: 8px; }
.kb-inbox-more > summary { cursor: pointer; padding: 4px 0; font-size: 14px; color: var(--accent-2); list-style: none; }
.kb-inbox-more > summary::-webkit-details-marker { display: none; }
.kb-inbox-more > summary::after { content: " ▾"; }
.kb-inbox-more[open] > summary::after { content: " ▴"; }
.kb-inbox-more[open] > summary { margin-bottom: 8px; }
.kb-table td:has(.kb-inbox) + td.num { vertical-align: top; }
@media (max-width: 600px) { .kb-dl { grid-template-columns: repeat(2, minmax(0, 1fr)); } .kb-dl > div { padding: 12px 14px; } .kb-dl dd { font-size: 18px; } }

/* ===== Страница предмета: подсветка картинки, плашки свойств, подсказка как в игре ===== */
.kb-item-pic { position: relative; overflow: hidden; border-color: rgb(242 193 78 / .3);
  background: radial-gradient(60% 60% at 50% 50%, rgb(242 193 78 / .16), transparent 72%), radial-gradient(120% 90% at 50% 120%, rgb(227 38 54 / .14), transparent 60%), rgb(7 8 11 / .7);
  box-shadow: 0 24px 60px -24px rgb(0 0 0 / .8), inset 0 0 0 1px rgb(255 255 255 / .03); }
.kb-item-pic::after { content: ""; position: absolute; inset: auto 18% 10% 18%; height: 14px; border-radius: 50%; background: rgb(0 0 0 / .55); filter: blur(8px); z-index: 0; }
.kb-item-pic img { position: relative; z-index: 1; transition: transform .3s; }
.kb-item-pic:hover img { transform: translateY(-3px) scale(1.03); }
.kb-item-pic.is-exc { border-color: rgb(111 207 127 / .55); background: radial-gradient(60% 60% at 50% 50%, rgb(111 207 127 / .2), transparent 72%), rgb(7 8 11 / .7); }
.kb-hchips { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.kb-hchips li { display: inline-flex; align-items: center; height: 30px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--line-hi); background: rgb(255 255 255 / .04); color: var(--dim); font-size: 13px; font-weight: 500; }
.kb-hchips a { color: var(--text); text-decoration: none; }
.kb-hchips li:first-child { background: rgb(255 255 255 / .1); border-color: rgb(255 255 255 / .18); }
.kb-hchips .is-set { border-color: rgb(111 181 240 / .4); } .kb-hchips .is-set a { color: #8fc8f5; }
.kb-hchips .is-exc { border-color: rgb(111 207 127 / .4); color: #8ee09a; }
.kb-hchips .is-lv { color: var(--text); }
.kb-hchips .is-cls { height: 26px; padding: 0 10px; font-size: 12px; color: var(--faint); }
.kb-tip { background: linear-gradient(180deg, rgb(20 16 12 / .96), rgb(8 8 10 / .96)); border-color: rgb(242 193 78 / .25);
  box-shadow: 0 20px 50px -20px rgb(0 0 0 / .9), inset 0 1px 0 rgb(255 255 255 / .05); }
.kb-tip.is-exc { border-color: rgb(111 207 127 / .45); }
.kb-tip-name { font-size: 17px; letter-spacing: .01em; color: #f2d48a; }
.kb-tip-wrap { position: sticky; top: 92px; }
.kb-wh { display: flex; align-items: center; gap: 8px; }
.kb-wh .ico { width: 16px; height: 16px; color: var(--accent-2); opacity: .9; }
.kb-where-grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
@media (max-width: 860px) { .kb-tip-wrap { position: static; } }
.kb-hchips .is-boss { border-color: rgb(227 38 54 / .5); color: #ffb3ba; background: rgb(227 38 54 / .12); }
.kb-hchips .is-map a { color: var(--text); }
.kb-hchips .is-map { border-color: rgb(242 193 78 / .3); }
.kb-hchips .is-ev { color: #c9b4ff; border-color: rgb(160 120 255 / .3); }
.x-lead + .kb-hchips { margin-top: 12px; }

/* соседние карты: обложкой, а не пустой плашкой */
.kb-nb { position: relative; display: grid; align-content: end; gap: 4px; min-height: 150px; padding: 18px 20px; overflow: hidden; color: var(--text); text-decoration: none;
  background: linear-gradient(180deg, rgb(8 9 12 / .1), rgb(8 9 12 / .92)), var(--img, none) center / cover, var(--glass); }
.kb-nb small { color: var(--dim); font-size: 12px; text-transform: uppercase; letter-spacing: .05em; }
.kb-nb b { font-size: 22px; font-weight: 700; letter-spacing: -.02em; }
.kb-nb span { color: var(--dim); font-size: 13px; }
.kb-nb.kb-next { text-align: right; }
.kb-nb:hover { border-color: var(--line-hi); }
.kb-note-top { margin: -8px 0 16px; }

/* один квест для разных классов: что принести каждому */
.kb-qvar { list-style: none; margin: 8px 0 4px; padding: 0; display: grid; gap: 8px; }
.kb-qvar li { display: grid; gap: 4px; padding: 10px 12px; border-radius: 10px; background: rgb(255 255 255 / .03); border: 1px solid var(--line); font-size: 14px; }
.kb-qvar b { font-size: 13px; color: var(--text); }

/* ===== Телефон: карточки по две в ряд вместо одной во всю ширину ===== */
@media (max-width: 767px) {
  .kb-cards { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px; }
  .kb-cards .kb-card { grid-column: span 1 !important; min-height: 130px; }
  .kb-cards .kb-card:first-child { grid-column: 1 / -1 !important; }
  .kb-classes { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .kb-class { aspect-ratio: 3 / 4.2; }
  .kb-class-body { left: 12px; right: 12px; bottom: 10px; }
  .kb-class-body b { font-size: 16px; } .kb-class-line { display: none; }
  .kb-guides { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  /* широкие таблицы: первый столбец держится при прокрутке вбок */
  .xp-table-wrap .kb-table th:first-child, .xp-table-wrap .kb-table td:first-child { position: sticky; left: 0; z-index: 1; background: #0e1015; box-shadow: 6px 0 8px -6px rgb(0 0 0 / .8); }
}
@media (max-width: 767px) { .kb-card-body { left: 12px; right: 12px; bottom: 10px; } .kb-card-body b { font-size: 17px; } .kb-card-body span { font-size: 12px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } }

/* ---------- 03.10: гайды по темам — общий вид для базы знаний и страницы гайдов ---------- */
.kb-gcats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.kb-gcat { --gc: #ff5a66; position: relative; display: flex; flex-direction: column; min-width: 0; border-radius: var(--radius); overflow: hidden;
  background: linear-gradient(180deg, rgb(255 255 255 / .04), rgb(255 255 255 / .012)); box-shadow: inset 0 1px 0 rgb(255 255 255 / .045), 0 24px 48px -28px rgb(0 0 0 / .75); }
.kb-gcat-hero { --gc: #c9b4ff; } .kb-gcat-items { --gc: #f2c14e; }
.kb-gcat-head { position: relative; display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; min-height: 170px; padding: 20px 22px; isolation: isolate; }
.kb-gcat-head img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.kb-gcat-head::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgb(10 11 15 / .1) 0%, rgb(10 11 15 / .55) 55%, rgb(14 15 20 / .98) 100%); }
.kb-gcat:hover .kb-gcat-head img { transform: scale(1.04); }
.kb-gcat-t { display: grid; gap: 4px; min-width: 0; }
.kb-gcat-t b { font-size: 21px; font-weight: 700; letter-spacing: -.02em; }
.kb-gcat-t small { color: var(--dim); font-size: 13px; line-height: 1.45; }
.kb-gcat-n { flex: none; font-style: normal; font-size: 12px; font-weight: 600; color: var(--gc); padding: 4px 10px; border-radius: 999px; background: color-mix(in srgb, var(--gc) 16%, rgb(10 11 15 / .7)); }
.kb-gcat-list { list-style: none; margin: 0; padding: 6px 10px 10px; display: grid; }
.kb-gcat-list a { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: baseline; gap: 12px; padding: 12px; border-radius: 12px; color: var(--text); text-decoration: none; transition: background-color .2s; }
.kb-gcat-list li + li a { box-shadow: inset 0 1px 0 rgb(255 255 255 / .05); }
.kb-gcat-list a:hover { background: rgb(255 255 255 / .045); box-shadow: none; }
.kb-gcat-list a:hover + * , .kb-gcat-list li:hover + li a { box-shadow: none; }
.kb-gcat-i { font-size: 12px; font-weight: 700; color: var(--gc); font-variant-numeric: tabular-nums; }
.kb-gcat-b { display: grid; gap: 4px; min-width: 0; }
.kb-gcat-b b { font-size: 15px; font-weight: 600; line-height: 1.35; }
.kb-gcat-b small { color: var(--faint); font-size: 13.5px; line-height: 1.5; }
.kb-gcat-m { font-size: 12px; color: var(--faint); white-space: nowrap; }
.kb-gcat-list a:hover .kb-gcat-b b { color: #fff; }
.kb-gcat-more { margin: auto 22px 18px; padding-top: 4px; color: var(--gc); font-size: 13.5px; font-weight: 600; text-decoration: none; }
.kb-gcat-more:hover { text-decoration: underline; }
/* страница всех гайдов: тема слева, список с описаниями справа */
.kb-gcats.is-full { grid-template-columns: 1fr; gap: 20px; }
.kb-gcats.is-full .kb-gcat { display: grid; grid-template-columns: minmax(260px, 360px) minmax(0, 1fr); }
.kb-gcats.is-full .kb-gcat-head { min-height: 100%; flex-direction: column; align-items: flex-start; justify-content: flex-end; padding: 26px; }
.kb-gcats.is-full .kb-gcat-head::after { background: linear-gradient(180deg, rgb(10 11 15 / .05) 20%, rgb(10 11 15 / .9) 100%); }
.kb-gcats.is-full .kb-gcat-t b { font-size: 26px; }
.kb-gcats.is-full .kb-gcat-list { padding: 12px 16px; align-content: start; }
.kb-gcats.is-full .kb-gcat-list a { padding: 16px 14px; }
.kb-gcats.is-full .kb-gcat-b b { font-size: 17px; }
.kb-gcat { scroll-margin-top: 110px; }
@media (max-width: 1100px) { .kb-gcats { grid-template-columns: 1fr 1fr; } .kb-gcats > .kb-gcat:last-child:nth-child(odd) { grid-column: 1 / -1; } .kb-gcats.is-full > .kb-gcat:last-child { grid-column: auto; } }
@media (max-width: 860px) {
  .kb-gcats, .kb-gcats.is-full .kb-gcat { grid-template-columns: 1fr; }
  .kb-gcats.is-full .kb-gcat-head { min-height: 180px; }
}
@media (max-width: 640px) {
  .kb-gcat-head { min-height: 140px; padding: 16px; }
  .kb-gcat-list { padding: 4px 6px 8px; }
  .kb-gcat-list a { grid-template-columns: 24px minmax(0, 1fr); gap: 10px; }
  .kb-gcat-m { grid-column: 2; }
}

/* ---------- 03.10: боссы с портретами и карты с обложками на главной базы знаний ---------- */
.kb-hboss { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 12px; }
.kb-hboss a { display: grid; justify-items: center; gap: 4px; padding: 16px 10px 14px; border-radius: 18px; text-align: center; color: var(--text); text-decoration: none;
  background: linear-gradient(180deg, rgb(255 255 255 / .035), rgb(255 255 255 / .01)); box-shadow: inset 0 1px 0 rgb(255 255 255 / .04); transition: background-color .25s, transform .3s var(--ease); }
.kb-hboss a:hover { transform: translateY(-3px); background: radial-gradient(120% 90% at 50% 0%, rgb(227 38 54 / .16), transparent 70%), rgb(255 255 255 / .03); }
.kb-hboss-pic { display: grid; place-items: center; width: 84px; height: 84px; margin-bottom: 6px; border-radius: 50%; background: radial-gradient(circle at 50% 40%, rgb(227 38 54 / .22), rgb(255 255 255 / .02) 70%); }
.kb-hboss-pic img { width: 76px; height: 76px; object-fit: contain; filter: drop-shadow(0 8px 14px rgb(0 0 0 / .6)); }
.kb-hboss b { font-size: 13.5px; font-weight: 600; line-height: 1.3; }
.kb-hboss small { font-size: 12px; color: var(--faint); }
.kb-hmaps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; counter-reset: m; }
.kb-hmaps a { position: relative; display: block; aspect-ratio: 16 / 10; border-radius: 16px; overflow: hidden; color: var(--text); text-decoration: none; background: rgb(255 255 255 / .03); isolation: isolate; }
.kb-hmaps img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.kb-hmaps a::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, transparent 35%, rgb(8 9 12 / .92)); }
.kb-hmaps a:hover img { transform: scale(1.06); }
.kb-hmaps span { position: absolute; left: 14px; right: 14px; bottom: 12px; display: grid; gap: 2px; }
.kb-hmaps b { font-size: 15px; font-weight: 600; }
.kb-hmaps small { font-size: 12px; color: var(--dim); }
@media (max-width: 1100px) { .kb-hboss { grid-template-columns: repeat(4, minmax(0, 1fr)); } .kb-hmaps { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .kb-hboss { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; } .kb-hmaps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; } }

/* ---------- 03.10: карточка класса — первый экран без провала, путь профессий, статы в шапке ---------- */
.kb-cls-hero { grid-template-columns: minmax(0, 1fr) 300px; gap: 48px; align-items: center; margin-top: 8px; }
.kb-cls-main { display: grid; gap: 0; align-content: center; }
.kb-cls-main h1 { margin: 0; }
.kb-cls-main .x-lead { margin: 12px 0 0; }
.kb-cls-art { margin: 0; position: relative; border-radius: var(--radius); overflow: hidden; aspect-ratio: 3 / 4; max-height: 400px;
  box-shadow: 0 30px 60px -30px rgb(0 0 0 / .9), inset 0 0 0 1px rgb(255 255 255 / .06); }
.kb-cls-art img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kb-path { list-style: none; margin: 26px 0 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 0; }
.kb-path li { display: flex; align-items: center; gap: 10px; }
.kb-path li + li::before { content: ""; width: 34px; height: 2px; margin: 0 12px; border-radius: 2px; background: linear-gradient(90deg, rgb(255 255 255 / .12), rgb(227 38 54 / .55)); }
.kb-path i { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; font-style: normal; font-size: 13px; font-weight: 700; color: var(--dim); background: rgb(255 255 255 / .06); }
.kb-path .kb-path-t2 i { color: #ffb3b8; background: rgb(227 38 54 / .16); }
.kb-path .kb-path-t3 i { color: #fff; background: var(--accent); box-shadow: 0 0 18px rgb(227 38 54 / .45); }
.kb-path span { display: grid; gap: 1px; }
.kb-path b { font-size: 15px; font-weight: 600; }
.kb-path small { font-size: 12px; color: var(--faint); }
.kb-cstats { display: flex; flex-wrap: wrap; margin: 26px 0 0; padding: 16px 0 0; border-top: 1px solid rgb(255 255 255 / .07); }
.kb-cstats div { display: grid; gap: 2px; padding-right: 24px; margin-right: 24px; border-right: 1px solid rgb(255 255 255 / .07); }
.kb-cstats div:last-child { border-right: 0; margin-right: 0; }
.kb-cstats dt { order: 2; font-size: 12px; color: var(--faint); }
.kb-cstats dd { order: 1; margin: 0; font-size: 26px; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.kb-cstats .kb-cs-pts dd { color: var(--accent-2); }
.kb-cls-main .kb-note { margin: 12px 0 0; }
@media (max-width: 900px) {
  .kb-cls-hero { grid-template-columns: 1fr; gap: 24px; }
  .kb-cls-art { order: -1; max-width: 220px; max-height: 280px; }
}
@media (max-width: 640px) {
  .kb-path li + li::before { width: 16px; margin: 0 8px; }
  .kb-cstats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 0; }
  .kb-cstats div { padding-right: 12px; margin-right: 12px; }
  .kb-cstats div:nth-child(3n) { border-right: 0; margin-right: 0; }
  .kb-cstats dd { font-size: 22px; }
}

/* квесты профессий: уровень и зен чипами, что принести и кого убить — списком с иконками */
.kb-qsteps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; counter-reset: q; }
.kb-qstep { position: relative; display: grid; gap: 10px; align-content: start; padding: 22px 22px 20px; border-radius: var(--radius);
  background: linear-gradient(180deg, rgb(255 255 255 / .04), rgb(255 255 255 / .012)); box-shadow: inset 0 1px 0 rgb(255 255 255 / .045), 0 24px 48px -28px rgb(0 0 0 / .75); }
.kb-qstep-k { margin: 0; display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: 12px; font-weight: 600; letter-spacing: .02em; color: var(--accent-2); }
.kb-qstep-k span { color: var(--faint); font-weight: 500; }
.kb-qstep h3 { margin: 0; font-size: 18px; font-weight: 600; letter-spacing: -.01em; line-height: 1.3; }
.kb-qstep-meta { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.kb-qstep-meta li { padding: 4px 10px; border-radius: 999px; background: rgb(255 255 255 / .06); font-size: 12.5px; color: var(--text); font-variant-numeric: tabular-nums; }
.kb-qstep-meta li.is-cls { background: none; padding-left: 2px; color: var(--faint); }
.kb-qstep-need { display: grid; gap: 8px; margin-top: 4px; padding-top: 12px; border-top: 1px solid rgb(255 255 255 / .06); }
.kb-qstep-need > span { font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--faint); }
.kb-qstep-need ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.kb-qstep-need li { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-width: 0; }
.kb-qstep-need .kb-link { display: inline-flex; align-items: center; gap: 10px; min-width: 0; font-size: 14px; line-height: 1.3; }
.kb-qstep-need .kb-link > span:last-child { overflow-wrap: anywhere; }
.kb-qstep-need em { flex: none; font-style: normal; font-size: 13px; font-weight: 600; color: var(--dim); font-variant-numeric: tabular-nums; }
.kb-qstep-need .kb-mon-ico { border-radius: 8px; object-fit: contain; background: rgb(255 255 255 / .04); }

/* умения: квест вместо вещи, длинный список оружия свёрнут */
.kb-howto { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; }
td.kb-howto { display: table-cell; }
.kb-howto .kb-item-link, .kb-howto .kb-quest-link { margin: 3px 14px 3px 0; }
.kb-quest-link { display: inline-flex; align-items: center; gap: 10px; vertical-align: middle; }
.kb-ico-quest { display: inline-block; width: 28px; height: 28px; border: 0; border-radius: 8px; background: rgb(227 38 54 / .16); position: relative; filter: none; }
.kb-ico-quest::after { content: ""; position: absolute; inset: 6px; background: var(--accent-2); -webkit-mask: url(/icons/flag-banner.svg) center / contain no-repeat; mask: url(/icons/flag-banner.svg) center / contain no-repeat; }
.kb-howto-more { display: inline; }
.kb-howto-more summary { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: 999px; background: rgb(255 255 255 / .06); color: var(--dim); font-size: 12.5px; font-weight: 600; cursor: pointer; list-style: none; vertical-align: middle; }
.kb-howto-more summary::-webkit-details-marker { display: none; }
.kb-howto-more[open] summary { display: none; }
.kb-ico-none { border: 0 !important; background: rgb(255 255 255 / .05); position: relative; }
.kb-ico-none::after { content: ""; position: absolute; inset: 30%; background: var(--faint); -webkit-mask: url(/icons/sword.svg) center / contain no-repeat; mask: url(/icons/sword.svg) center / contain no-repeat; opacity: .6; }
@media (max-width: 640px) {
  .kb-path { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
  .kb-path li { flex-direction: column; align-items: flex-start; gap: 8px; }
  .kb-path li + li::before { display: none; }
}

/* ---------- 03.10: гайды — наведение без плашки, страница гайдов с баннером темы сверху ---------- */
.kb-gcat-list a, .kb-gcat-list a:hover { background: none !important; }
.kb-gcat-list li + li a, .kb-gcat-list li:hover + li a, .kb-gcat-list a:hover { box-shadow: inset 0 1px 0 rgb(255 255 255 / .05) !important; }
.kb-gcat-list li:first-child a:hover { box-shadow: none !important; }
.kb-gcat-b b { transition: color .2s; }
.kb-gcat-list a:hover .kb-gcat-b b { color: color-mix(in srgb, var(--gc) 55%, #fff); }
.kb-gcat-i { transition: transform .25s var(--ease); }
.kb-gcat-list a:hover .kb-gcat-i { transform: translateX(3px); }
.kb-gcat-m::after { content: " →"; color: var(--gc); opacity: 0; transition: opacity .2s; }
.kb-gcat-list a:hover .kb-gcat-m::after { opacity: 1; }
.kb-gcat-list a:hover .kb-gcat-m { color: var(--dim); }

.kb-gcats.is-full .kb-gcat { display: flex; flex-direction: column; }
.kb-gcats.is-full .kb-gcat-head { min-height: 0; height: 190px; flex-direction: row; align-items: flex-end; justify-content: space-between; padding: 24px 28px; }
.kb-gcats.is-full .kb-gcat-head img { object-position: 50% 35%; }
.kb-gcats.is-full .kb-gcat-head::after { background: linear-gradient(90deg, rgb(10 11 15 / .92) 0%, rgb(10 11 15 / .5) 55%, rgb(10 11 15 / .2) 100%), linear-gradient(180deg, transparent 50%, rgb(14 15 20 / .9)); }
.kb-gcats.is-full .kb-gcat-t { max-width: 560px; }
.kb-gcats.is-full .kb-gcat-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 28px; padding: 8px 18px 14px; }
.kb-gcats.is-full .kb-gcat-list li a { box-shadow: inset 0 1px 0 rgb(255 255 255 / .05) !important; }
.kb-gcats.is-full .kb-gcat-list li:nth-child(-n+2) a { box-shadow: none !important; }
@media (max-width: 860px) {
  .kb-gcats.is-full .kb-gcat-head { height: 160px; padding: 18px; }
  .kb-gcats.is-full .kb-gcat-list { grid-template-columns: 1fr; padding: 4px 8px 10px; }
  .kb-gcats.is-full .kb-gcat-list li:nth-child(2) a { box-shadow: inset 0 1px 0 rgb(255 255 255 / .05) !important; }
}
.kb-gcat-head { overflow: hidden; border-radius: var(--radius) var(--radius) 0 0; }
.kb-hchips li.is-exp { color: #7ed89a; border-color: rgb(126 216 154 / .35); }

/* ---------- 04.10: куда идти по ресетам ---------- */
.kb-rg-jump { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 20px; }
.kb-rg-jump a { display: inline-flex; align-items: center; padding: 8px 14px; border-radius: 999px; background: rgb(255 255 255 / .05); color: var(--dim); font-size: 14px; text-decoration: none; }
.kb-rg-jump a:hover { background: rgb(255 255 255 / .09); color: var(--text); }
.kb-rg-h { margin-top: 36px; scroll-margin-top: 110px; }
.kb-rg td b { color: var(--accent-2); }
.kb-rg-link { margin: 0 0 22px; }
.kb-badge-gold { background: rgb(242 193 78 / .16); color: #f2c14e; }
.kb-only-boss { display: inline-flex; align-items: center; gap: 8px; margin-left: 14px; color: var(--dim); font-size: 14px; cursor: pointer; }
.kb-only-boss input { accent-color: var(--accent-2, #ff5a67); width: 16px; height: 16px; }
.kb-hchips .is-gold { border-color: rgb(242 193 78 / .5); color: #f7d98c; background: rgb(242 193 78 / .12); }