/*
 * Wilderings Encyclopedia — public pages, dressed as the game's Kuxaan.
 *
 * Every texture comes from the Kuxaan UI kit (assets/kuxaan, see tools/dev/ui-kit.mjs) and the font is the game's
 * own (Averia Libre, as in ReWild's Content/UI/Fonts). White textures are masks the game tints in code; here they are
 * tinted with CSS mask + the colour of the Hântu type, the same colours as the Kuxaan design sheet (_Tab_Hantus_Info).
 * Everything is scoped under .wenc so the site's theme and Elementor neither style nor are styled by it.
 */

/* Averia Libre has Light, Regular and Bold: weights 500-600 used below fall to Regular/Bold by the usual matching. */
@font-face { font-family: "Averia Libre"; src: url("../fonts/AveriaLibre-Light.ttf") format("truetype"); font-weight: 300; font-display: swap; }
@font-face { font-family: "Averia Libre"; src: url("../fonts/AveriaLibre-Regular.ttf") format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Averia Libre"; src: url("../fonts/AveriaLibre-Bold.ttf") format("truetype"); font-weight: 700; font-display: swap; }
/* Averia Libre only covers Western European Latin. Pages in a language with letters it lacks (Polish, Turkish, Czech,
   Hungarian, Romanian, the Cyrillic ones) use Marmelad throughout, the closest free face (same width, same soft
   forms), so a word never mixes two fonts. Marmelad has one weight: bold is synthesised. Figures, "+" and "%" stay in
   Averia ("Averia Numbers"): values look the same in every language and keep fitting their columns. */
@font-face { font-family: "Marmelad"; src: url("../fonts/Marmelad-Regular.ttf") format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Averia Numbers"; src: url("../fonts/AveriaLibre-Regular.ttf") format("truetype"); font-weight: 400; font-display: swap; unicode-range: U+0025, U+002B, U+0030-0039, U+2212; }
@font-face { font-family: "Averia Numbers"; src: url("../fonts/AveriaLibre-Bold.ttf") format("truetype"); font-weight: 700; font-display: swap; unicode-range: U+0025, U+002B, U+0030-0039, U+2212; }

.wenc {
	/* Kuxaan palette (design sheet values) */
	--k-ink: #8f6d4c;          /* labels, titles (Stats Summary sheet) */
	--k-ink-soft: #a38963;     /* small links and secondary labels ("DETAILS", "+INFO") */
	--k-ink-dark: #67482a;     /* values in bold (Stats Summary sheet) */
	--k-paper: #e8dba6;        /* page colour, sampled from T_Page_base */
	--k-paper-light: #f4e3b1;  /* stat bars */
	--k-paper-dark: #d8c48f;
	--k-orange: #f38416;       /* "Level: 5" */
	--k-red: #f56565;
	--k-teal: #6ad7c9;         /* FEED button */
	--k-leather: #5a4330;
	--k-night: #2e2a26;        /* around the book */
	--type: #9a7b5a;           /* current Hântu type colour (overridden per type) */
	--wenc-font: "Averia Libre", "Averia Sans Libre", Georgia, system-ui, -apple-system, "Segoe UI", sans-serif;

	box-sizing: border-box;
	/* A word longer than its box (German compounds, Russian) breaks instead of spilling out or widening the page */
	overflow-wrap: break-word;
	color: var(--k-ink);
	font-family: var(--wenc-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.45;
	text-align: left;
}
.wenc:is(:lang(pl), :lang(tr), :lang(cs), :lang(hu), :lang(ro), :lang(ru), :lang(uk), :lang(bg)) { --wenc-font: "Averia Numbers", "Marmelad", Georgia, system-ui, sans-serif; }
.wenc *, .wenc *::before, .wenc *::after { box-sizing: inherit; }
.wenc a { color: inherit; text-decoration: none; }
.wenc img { max-width: 100%; height: auto; border: 0; box-shadow: none; }
.wenc ul, .wenc ol, .wenc dl { list-style: none; margin: 0; padding: 0; }
.wenc h1, .wenc h2, .wenc h3, .wenc p { margin: 0; font-family: var(--wenc-font); letter-spacing: 0; text-transform: none; color: inherit; }
.wenc button { font-family: var(--wenc-font); }

/* Hântu type colours (Kuxaan design sheet) */
.wenc .wenc-type-grassland { --type: #b3cb42; }
.wenc .wenc-type-forest { --type: #77a54e; }
.wenc .wenc-type-tundra { --type: #abd6c9; }
.wenc .wenc-type-wetland { --type: #76919d; }
.wenc .wenc-type-jungle { --type: #99517e; }
.wenc .wenc-type-mountain { --type: #9a8c78; }
.wenc .wenc-type-desert { --type: #b18558; }
.wenc .wenc-type-volcanic { --type: #a94858; }
.wenc .wenc-type-mushroom { --type: #e49c3d; }
.wenc .wenc-type-bacteroid { --type: #f8d751; }

/* ------------------------------------------------------------------------------------------------------------------
 * The book: leather cover with golden corners (T_Book_base) stretched around the content, tabs on top.
 * ---------------------------------------------------------------------------------------------------------------- */
/* PlayerX (the studio site's theme) pulls its content 90px up under a transparent header meant for sliders, which
   would hide the top of the book. This stylesheet only loads on encyclopedia pages, so the reset is scoped to them. */
body.wenc-route .edgtf-content { margin-top: 0 !important; }

/* .wenc-main wraps .wenc, so it cannot use the --k-* variables (they are declared on .wenc). Night blue: the colour the
   home page's trailer header fades into. */
.wenc-main { background: #121830; padding: 28px 16px 56px; }
.wenc-main > .wenc { max-width: 1240px; margin: 0 auto; }

.wenc-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 0 56px; position: relative; z-index: 2; }
.wenc-brand { display: flex; align-items: baseline; gap: 10px; color: var(--k-paper-light); padding-bottom: 10px; }
.wenc-brand-game { font-size: 13px; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; opacity: 0.7; }
.wenc-brand-book { font-size: 28px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; }
.wenc-lang { padding-bottom: 12px; }
.wenc-lang select {
	appearance: auto; background: var(--k-paper-light); color: var(--k-ink); border: 2px solid var(--k-leather);
	border-radius: 999px; padding: 4px 12px; font: 500 14px var(--wenc-font); height: auto; width: auto; margin: 0;
}

/* Tabs (T_Tab_on / T_Tab_off): one row that wraps, never scrolls */
/* Tabs sit over the cover but under the pages (see .wenc-book): they cross the cover's leather rim (11px) and go
   another 32px under the pages, which hide their bottom at the rim's inner edge. */
.wenc-tabs { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 4px; padding: 0 64px; margin-bottom: -44px; position: relative; z-index: 1; }
/* Long tabs: only the wavy top of T_Tab_* shows; the rest (rounded bottom included) goes under the pages. One image
   stretched to the tab (border-image slices showed hairline joins on high-density screens). */
.wenc-tab {
	display: flex; justify-content: center; align-items: flex-start; min-width: 96px; height: 86px; padding: 22px 16px 0;
	background: url("../kuxaan/tab-off.webp") center top / 100% 100% no-repeat;
	color: var(--k-paper-light) !important; font-weight: 600; font-size: 14px; line-height: 1.05; text-transform: uppercase; letter-spacing: 0.02em;
	text-align: center; transition: transform 0.12s; white-space: nowrap;
}
.wenc-tab:hover { transform: translateY(-3px); }
.wenc-tab.is-active { background-image: url("../kuxaan/tab-on.webp"); color: var(--k-ink) !important; height: 96px; margin-top: -10px; padding-top: 24px; }
.wenc-tab:focus-visible, .wenc a:focus-visible, .wenc button:focus-visible, .wenc [tabindex]:focus-visible, .wenc input:focus-visible { outline: 3px solid var(--k-orange); outline-offset: 2px; }

/*
 * The whole book, pages included, is T_Book_base (::before). The tabs sit over it, and ::after lays the top strip of
 * the same texture's pages (book-top: rows 24-150, just under the leather rim) over the tabs, so they vanish under the
 * pages exactly where the book's own pages start, with nothing on top that does not belong to the book.
 * Layers: cover 0, tabs 1 (in the header), page strip 2, content 3. No z-index on .wenc-book, so they all share
 * one stacking context. The texture is drawn at exactly half size (slices 150/140/170 -> 75/70/85px): with a whole
 * ratio the joins between the border-image slices do not show as hairlines.
 */
.wenc-book {
	position: relative; padding: 12px 28px 40px; min-height: 420px;
	/* Paper colour under the joins of the border-image slices: browsers anti-alias each slice's edge, and without
	   this the dark page background shows through as hairlines. Inset 4px into the cover border on each side. */
	background: linear-gradient(#e6d6a3, #e6d6a3) 66px 71px / calc(100% - 132px) calc(100% - 152px) no-repeat;
}
.wenc-book::before {
	content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
	border-style: solid; border-width: 75px 70px 85px;
	border-image: url("../kuxaan/book.webp") 150 140 170 140 fill / 75px 70px 85px stretch;
}
.wenc-book::after {
	content: ""; position: absolute; left: 0; right: 0; top: 12px; height: 63px; z-index: 2; pointer-events: none;
	border-style: solid; border-width: 0 70px;
	border-image: url("../kuxaan/book-top.webp") 0 140 fill / 0 70px stretch;
}
.wenc-page { position: relative; z-index: 3; min-height: 360px; padding: 44px 48px 40px; }

/* Two-page spread with the spine of T_Page_base between them (desktop) */
.wenc-spread { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 72px; position: relative; }
.wenc-spread::before {
	content: ""; position: absolute; top: -20px; bottom: -16px; left: 50%; width: 22px; transform: translateX(-50%);
	background: linear-gradient(90deg, transparent, rgba(143, 109, 76, 0.18) 40%, rgba(94, 70, 49, 0.45) 50%, rgba(143, 109, 76, 0.18) 60%, transparent);
	pointer-events: none;
	/* Fades in and out at both ends instead of starting and stopping with a hard edge. */
	-webkit-mask-image: linear-gradient(transparent, #000 90px, #000 calc(100% - 90px), transparent);
	mask-image: linear-gradient(transparent, #000 90px, #000 calc(100% - 90px), transparent);
}

/* Type scale */
.wenc-h1 { font-size: clamp(28px, 3.2vw, 38px) !important; line-height: 1.1 !important; font-weight: 600 !important; color: var(--k-ink) !important; margin: 0 0 4px !important; }
.wenc-h2 { font-size: 20px !important; line-height: 1.2 !important; font-weight: 600 !important; color: var(--k-ink) !important; text-transform: uppercase; margin: 0 0 12px !important; }
.wenc-h3 { font-size: 17px !important; line-height: 1.2 !important; font-weight: 600 !important; color: var(--k-ink) !important; }
.wenc-kicker { display: block; font-size: 14px; font-weight: 600; text-transform: uppercase; color: var(--k-ink); letter-spacing: 0.02em; }
.wenc-prose { font-size: 15px; color: var(--k-ink); }
.wenc-prose strong { font-weight: 600; color: var(--k-ink-dark); }
.wenc-prose p + p { margin-top: 8px; }
.wenc-lead { font-size: 17px; color: var(--k-ink); margin: 0 0 10px; }
.wenc-level-label { display: block; color: var(--k-orange); font-size: 19px; font-weight: 500; margin-bottom: 10px; }
.wenc-note { font-size: 13px; color: var(--k-ink-soft); margin-top: 8px; }
.wenc-empty { padding: 40px 0; color: var(--k-ink-soft); }
.wenc-crumbs { margin: -10px 0 14px; font-size: 14px; font-weight: 600; text-transform: uppercase; color: var(--k-ink-soft); }
.wenc-crumbs a:hover { color: var(--k-ink); }
.wenc-journal { font-size: 15.5px; }

/* Buttons: the teal FEED button (Button_blue_on) */
.wenc-button {
	display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 6px 26px 10px;
	background: url("../kuxaan/button.webp") center / 100% 100% no-repeat; color: #fff !important;
	font-weight: 600; font-size: 17px; text-transform: uppercase; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.15);
}
.wenc-button:hover { filter: brightness(1.06); }
.wenc-button-small { min-height: 34px; padding: 4px 16px 7px; font-size: 14px; }

/* Chips (type, fruit, home biome) */
.wenc-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.wenc-chip {
	display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px 4px 6px; border-radius: 999px;
	background: var(--k-paper-light); color: var(--k-ink); font: 500 14px var(--wenc-font); line-height: 1.2; border: 0;
}
a.wenc-chip:hover { background: #fff3cc; }
/* Chips that open a page (Vlügkin traits and the Vlügkin that carry them). */
.wenc-chips-links { margin-bottom: 4px !important; }
.wenc-chips-links a.wenc-chip { font-weight: 600; color: var(--k-ink-dark); box-shadow: 0 0 0 2px var(--k-paper-dark); }
.wenc-chips-links a.wenc-chip::after { content: "→"; color: var(--k-ink-soft); font-weight: 400; }
.wenc-chips-links a.wenc-chip small { font-size: 12px; font-weight: 600; color: var(--k-ink); }
.wenc-vlugkin .wenc-h2 { margin-top: 18px !important; }
.wenc-appears li { font-size: 15px; color: var(--k-ink-dark); margin: 2px 0; }
.wenc-appears li::before { content: "◆ "; color: var(--k-ink-soft); font-size: 11px; }
.wenc-chip-icon, .wenc-inline-icon, .wenc-type-icon { width: 24px; height: 24px; object-fit: contain; vertical-align: middle; }

/* Facts list (left page) */
.wenc-facts { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 14px !important; }
.wenc-fact { display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px 4px 6px; border-radius: 999px; background: var(--k-paper-light); font-size: 14px; font-weight: 500; }
.wenc-fact-label { color: var(--k-ink-soft); font-weight: 500; }
.wenc-fact-type { background: var(--type); color: #fff; }
.wenc-fact-type .wenc-fact-label { color: rgba(255, 255, 255, 0.8); }
a.wenc-fact:hover { background: #fff3cc; }

/* ------------------------------------------------------------------------------------------------------------------
 * Home
 * ---------------------------------------------------------------------------------------------------------------- */
.wenc-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 16px; margin-bottom: 34px; }
.wenc-tile {
	position: relative; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; min-height: 170px; padding: 14px;
	background: url("../kuxaan/box.webp") center / 100% 100% no-repeat; text-align: center; transition: transform 0.12s;
}
.wenc-tile:hover { transform: translateY(-3px); }
.wenc-tile-art { flex: 1; display: grid; place-items: center; width: 100%; }
.wenc-tile-art img { max-height: 110px; width: auto; object-fit: contain; filter: drop-shadow(0 4px 4px rgba(94, 70, 49, 0.25)); }
.wenc-tile-map .wenc-tile-art img { max-height: 120px; border-radius: 10px; }
.wenc-tile-title { font-weight: 600; font-size: 17px; text-transform: uppercase; color: var(--k-ink); }
.wenc-tile-count { position: absolute; top: 10px; right: 12px; background: var(--k-ink); color: var(--k-paper-light); border-radius: 999px; padding: 0 9px; font-size: 13px; font-weight: 600; }

/* ------------------------------------------------------------------------------------------------------------------
 * Hântu grid: type tabs + coloured header band (T_Hantu_type_header, tinted) + paper body (T_Hantu_type_body)
 * with the hexagon avatars of the Kuxaan.
 * ---------------------------------------------------------------------------------------------------------------- */
/* Type tabs tuck under the coloured header band (same trick as the book tabs). */
.wenc-typetabs { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 4px; padding: 0 12px; position: relative; z-index: 0; margin-bottom: -12px; }
.wenc-typetab {
	/* Tall enough that the icon sits fully above the 12px hidden under the header band. */
	display: grid; place-items: start center; width: 50px; height: 52px; border-radius: 12px 12px 0 0; border: 0; cursor: pointer;
	background: var(--type); padding: 7px 0 0; transition: height 0.12s;
}
.wenc-typetab img { width: 30px; height: 30px; object-fit: contain; }
.wenc-typetab.is-active { height: 62px; padding-top: 10px; }
.wenc-typetab-all { background: var(--k-ink); color: var(--k-paper-light); font-weight: 600; font-size: 13px; width: auto; padding: 13px 12px 0; text-transform: uppercase; }
.wenc-typetab-all.is-active { padding-top: 17px; }
.wenc-typebox { position: relative; }
.wenc-typebox-head {
	position: relative; z-index: 1; padding: 12px 26px 22px; color: #fff; font-weight: 600; font-size: 20px; text-transform: uppercase;
}
.wenc-typebox-head::before {
	content: ""; position: absolute; inset: 0; background: var(--type); z-index: 0;
	-webkit-mask: url("../kuxaan/type-header.webp") center / 100% 100% no-repeat; mask: url("../kuxaan/type-header.webp") center / 100% 100% no-repeat;
}
.wenc-typebox-head span { position: relative; }
.wenc-typebox-body {
	margin-top: -12px; padding: 26px 22px 22px;
	border-style: solid; border-width: 24px; border-image: url("../kuxaan/type-body.webp") 40 fill / 24px stretch;
}
.wenc-search {
	margin-left: auto; align-self: center; min-width: 190px; padding: 6px 14px; border-radius: 999px; border: 2px solid var(--k-paper-dark);
	background: var(--k-paper-light); color: var(--k-ink); font: 500 14px var(--wenc-font); height: auto; margin-bottom: 6px;
}
.wenc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 18px 12px; }
.wenc-card[hidden] { display: none; }
.wenc-card > a { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; }
.wenc-hexslot { position: relative; display: grid; place-items: center; width: 108px; height: 116px; }
.wenc-hexslot img { width: 96px; height: 96px; object-fit: contain; position: relative; z-index: 1; transition: transform 0.12s; }
.wenc-hexslot::after {
	content: ""; position: absolute; inset: 0; z-index: 2; background: #f6b800; opacity: 0; transition: opacity 0.12s;
	-webkit-mask: url("../kuxaan/hex-active.webp") center / contain no-repeat; mask: url("../kuxaan/hex-active.webp") center / contain no-repeat;
}
.wenc-card > a:hover .wenc-hexslot::after, .wenc-card > a:focus-visible .wenc-hexslot::after { opacity: 1; }
.wenc-card > a:hover .wenc-hexslot img { transform: scale(1.04); }
.wenc-card-name { font-weight: 600; font-size: 16px; color: var(--k-ink); line-height: 1.15; }
.wenc-card-type { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; color: var(--k-ink-soft); font-weight: 500; }
.wenc-card-type img { width: 18px; height: 18px; }

/* Square slots (Vlügkin, T_Selected_mooglers) */
.wenc-squareslot { position: relative; display: grid; place-items: center; width: 116px; height: 116px; }
.wenc-squareslot img { width: 104px; height: 104px; object-fit: contain; }
.wenc-squareslot::after {
	content: ""; position: absolute; inset: 0; background: #f6b800; opacity: 0; transition: opacity 0.12s;
	-webkit-mask: url("../kuxaan/square-active.webp") center / contain no-repeat; mask: url("../kuxaan/square-active.webp") center / contain no-repeat;
}
.wenc-card > a:hover .wenc-squareslot::after { opacity: 1; }

/* Item strips (greenhouse, resources: T_Item_Background) */
.wenc-banner {
	display: grid; place-items: center; min-height: 58px; margin: 0 auto 18px; max-width: 520px; padding: 8px 40px 12px;
	background: url("../kuxaan/banner.webp") center / 100% 100% no-repeat; font-weight: 600; font-size: 20px; text-transform: uppercase; text-align: center;
}
.wenc .wenc-banner { color: #fff; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.18); }
.wenc-items { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 10px; }
.wenc-item > a, .wenc-item > span {
	display: flex; align-items: center; gap: 14px; min-height: 76px; padding: 10px 18px;
	background: url("../kuxaan/item.webp") center / 100% 100% no-repeat; transition: transform 0.12s;
}
.wenc-item > a:hover { transform: translateX(3px); }
.wenc-item-icon { width: 56px; height: 56px; object-fit: contain; flex: none; }
.wenc-item-name { display: block; font-weight: 600; font-size: 16px; color: var(--k-ink); line-height: 1.15; }
.wenc-item-text { display: block; font-size: 13px; color: var(--k-ink-soft); line-height: 1.3; margin-top: 2px; }

/* ------------------------------------------------------------------------------------------------------------------
 * Entry pages
 * ---------------------------------------------------------------------------------------------------------------- */
.wenc-portrait { position: relative; display: grid; place-items: center; min-height: 260px; margin: 6px 0 14px; }
.wenc-portrait::after { content: ""; position: absolute; left: 22%; right: 22%; bottom: 4px; height: 18px; border-radius: 50%; background: rgba(143, 109, 76, 0.25); z-index: 0; }
.wenc-portrait img { position: relative; z-index: 1; max-height: 320px; width: auto; object-fit: contain; filter: drop-shadow(0 6px 6px rgba(94, 70, 49, 0.2)); }
.wenc-portrait-icon img { max-height: 170px; }

/* Skills (right page) */
.wenc-skill { display: grid; grid-template-columns: 96px 1fr; gap: 16px; align-items: start; margin-bottom: 18px; }
.wenc-skill-icon { width: 92px; height: 92px; object-fit: contain; }
.wenc-skill-kind { display: block; font-size: 14px; font-weight: 600; text-transform: uppercase; color: var(--k-ink); }
.wenc-skill-name { display: block; font-size: 16px; font-weight: 600; color: var(--k-ink-dark); margin-bottom: 2px; }

/* Level bar (T_Fruit_bar_bg) + the level slider in place of the FEED button */
.wenc-level { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin: 22px 0 18px; position: sticky; top: 8px; z-index: 5; }
.wenc-level-pill {
	display: inline-flex; align-items: center; gap: 10px; padding: 4px 16px 6px 6px; border-radius: 999px; background: var(--k-leather); color: var(--k-paper-light); font-weight: 600;
}
.wenc-level-pill img { width: 30px; height: 30px; }
.wenc-level-pill output { font-weight: 600; color: #fff; }
.wenc-level-range {
	flex: 1 1 220px; display: flex; align-items: center; height: 30px; padding: 0 14px; border-radius: 999px;
	background: url("../kuxaan/fruit-bar-bg.webp") center / 100% 100% no-repeat;
}
.wenc-level-range input[type="range"] { width: 100%; margin: 0; accent-color: var(--k-orange); background: transparent; }
.wenc-level-cost { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: var(--k-ink); }
.wenc-level .wenc-note { flex-basis: 100%; margin: 0; }

/* Stat bars (T_Stats_bg01: cream value part + darker "next level" part) */
.wenc-stat-head { display: grid; grid-template-columns: 1fr 64px; margin: 6px 0 4px; font-size: 13px; font-weight: 600; text-transform: uppercase; color: var(--k-ink-soft); }
.wenc-stat-head span:last-child { text-align: center; }
.wenc-stats { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 8px 18px; margin: 4px 0 0 !important; }
.wenc-stat {
	display: grid; grid-template-columns: 26px 1fr auto 64px; align-items: center; gap: 0 8px; height: 30px; padding: 0 0 0 8px;
	background: url("../kuxaan/stat-bg.webp") center / 100% 100% no-repeat; font-size: 14px; font-weight: 500;
}
.wenc-stat dt { color: var(--k-ink); margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wenc-stat dd { margin: 0; font-weight: 600; color: var(--k-ink); font-variant-numeric: tabular-nums; text-align: right; transition: color 0.2s; }
.wenc-stat dd.wenc-stat-next { color: #fff; text-align: center; }
.wenc-stat dd.is-changing { color: var(--k-orange); }
.wenc-stat-icon { width: 24px; height: 24px; object-fit: contain; display: block; }
.wenc-stats-passive .wenc-stat { background-image: url("../kuxaan/stat-bg-next.webp"); }
.wenc-stats-passive .wenc-stat dd.wenc-stat-next { color: var(--k-ink-dark); }
.wenc-stats-plain .wenc-stat { grid-template-columns: 1fr auto; padding: 0 14px; background: var(--k-paper-light); border-radius: 999px; }

/* Text boxes (strengths/weaknesses) */
.wenc-box { padding: 18px 22px; margin: 0 0 14px; border-style: solid; border-width: 20px; border-image: url("../kuxaan/box.webp") 40 fill / 20px stretch; }
.wenc-box .wenc-h2 { margin-bottom: 6px !important; }

/* Tables (plant levels) */
.wenc-table { width: 100%; border-collapse: separate; border-spacing: 0 6px; margin-top: 8px; font-size: 15px; }
.wenc-table th { text-align: left; padding: 0 12px; font-size: 13px; font-weight: 600; text-transform: uppercase; color: var(--k-ink-soft); background: transparent; border: 0; }
.wenc-table td { padding: 6px 12px; background: var(--k-paper-light); color: var(--k-ink); font-weight: 500; border: 0; font-variant-numeric: tabular-nums; }
.wenc-table td:first-child { border-radius: 999px 0 0 999px; font-weight: 600; }
.wenc-table td:last-child { border-radius: 0 999px 999px 0; }

/* Prev / next */
.wenc-prevnext { display: flex; justify-content: space-between; gap: 12px; margin-top: 26px; padding-top: 14px; border-top: 2px dashed rgba(143, 109, 76, 0.35); font-weight: 600; text-transform: uppercase; font-size: 14px; }
.wenc-prevnext a:hover { color: var(--k-orange); }

/* Quests */
.wenc-quest-list { display: grid; gap: 12px; margin-bottom: 28px !important; }
.wenc-quest { padding: 14px 18px; border-style: solid; border-width: 16px; border-image: url("../kuxaan/box.webp") 40 fill / 16px stretch; }
.wenc-quest-body { display: grid; grid-template-columns: 200px 1fr; gap: 16px; align-items: start; }
.wenc-quest-img { border-radius: 10px; width: 100%; }
.wenc-spoiler summary { cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--k-ink); font-weight: 600; list-style: none; }
.wenc-spoiler summary::-webkit-details-marker { display: none; }
.wenc-spoiler[open] summary { margin-bottom: 12px; }

/* Map */
.wenc-map { position: relative; height: min(70vh, 680px); border-radius: 14px; overflow: hidden; background: #5b4d43; border: 3px solid var(--k-leather); }
.wenc-map.leaflet-container, .wenc-map .leaflet-container { font-family: var(--wenc-font); }
.wenc-map .leaflet-control-layers, .wenc-map .leaflet-bar a { background: var(--k-paper-light); color: var(--k-ink); border-color: var(--k-paper-dark); font-family: var(--wenc-font); }
.wenc-map-hint {
	position: absolute; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 16px; text-align: center;
	background: rgba(46, 42, 38, 0.55); color: #fff; font-weight: 600; font-size: 18px; pointer-events: none; opacity: 0; transition: opacity 0.2s;
}
.wenc-map-hint.is-visible { opacity: 1; }
.wenc-map-legend { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px !important; }
.wenc-map-region { display: inline-flex; align-items: center; gap: 8px; padding: 4px 14px 4px 8px; border-radius: 999px; background: var(--k-paper-light); font-weight: 500; }
.wenc-swatch { width: 14px; height: 14px; border-radius: 4px; border: 1px solid rgba(0, 0, 0, 0.2); }
.wenc-map-tip { font-family: var(--wenc-font); font-weight: 600; white-space: nowrap; color: var(--k-ink); background: var(--k-paper-light); border-color: var(--k-paper-dark); }
.wenc-map-tip-inner { display: inline-flex; align-items: center; gap: 6px; }
.wenc-map-tip img { width: 22px; height: 22px; flex: none; }
.wenc-map-popup .leaflet-popup-content-wrapper, .wenc-map-popup .leaflet-popup-tip { background: var(--k-paper-light); color: var(--k-ink); box-shadow: 0 3px 12px rgba(0, 0, 0, 0.35); }
.wenc-map-popup .leaflet-popup-content { margin: 12px 16px; font-family: var(--wenc-font); font-size: 14px; line-height: 1.45; }
.wenc-map-popup strong { display: block; font-size: 17px; }
.wenc-map-popup p { margin: 6px 0 0 !important; }
.wenc-map-popup-kind { display: block; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; opacity: 0.7; }
.wenc-map-marker img { width: 100%; height: 100%; filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.45)); }
.wenc-map-marker { cursor: pointer; }
.wenc-map-marker:focus-visible { outline: 3px solid var(--k-ink); outline-offset: 2px; border-radius: 50%; }
.wenc-map-dot { display: block; width: 100%; height: 100%; border-radius: 50%; background: #3f9fb8; border: 2px solid #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5); }
.is-scarecrow .wenc-map-dot { background: #b8643f; }
.wenc-map-teaser { position: relative; display: block; border-radius: 14px; overflow: hidden; border: 3px solid var(--k-leather); }
.wenc-map-teaser img { width: 100%; display: block; aspect-ratio: 16 / 7; object-fit: cover; }
.wenc-map-teaser span { position: absolute; left: 16px; bottom: 16px; }

/* Skill trees */
.wenc-tree { margin-bottom: 26px; }
/* The tree lives in the game's night sky (Skill_Tree_Background_01 + the vignette of M_Skilltree_Vignette). */
.wenc-tree-viewport {
	position: relative; height: min(74vh, 740px); overflow: hidden; border-radius: 18px; cursor: grab;
	background: radial-gradient(ellipse at center, transparent 45%, rgba(0, 2, 20, 0.75) 100%), url("../kuxaan/tree-sky.webp") center / cover, #020a3a;
	box-shadow: inset 0 0 0 3px #11226b, 0 6px 18px rgba(46, 42, 38, 0.35);
}
.wenc-tree-viewport.is-dragging { cursor: grabbing; }
.wenc-tree-svg { display: block; width: 100%; height: 100%; touch-action: none; user-select: none; }
.wenc-tree-controls { position: absolute; top: 12px; right: 12px; z-index: 3; display: flex; flex-direction: column; gap: 6px; }
.wenc-tree-controls button {
	width: 38px; height: 38px; border: 2px solid #2a4fc4; border-radius: 12px; background: rgba(8, 16, 60, 0.85); color: #fff;
	font: 600 20px/1 var(--wenc-font); cursor: pointer;
}
.wenc-tree-controls button:hover { border-color: #70eeff; color: #70eeff; }
.wenc-tree .wenc-map-hint { z-index: 4; }
/* Floating node tooltip (paper box of the Kuxaan) */
.wenc-tip {
	position: absolute; z-index: 5; width: max-content; max-width: min(320px, calc(100% - 16px)); padding: 12px 14px;
	border-style: solid; border-width: 14px; border-image: url("../kuxaan/box.webp") 40 fill / 14px stretch;
	filter: drop-shadow(0 6px 10px rgba(46, 42, 38, 0.3)); pointer-events: none; font-size: 14px;
}
.wenc-tip[hidden] { display: none; }
.wenc-tip.is-hidden-off { visibility: hidden; }
.wenc-tip .wenc-h3 { margin-bottom: 4px !important; }
/* Nodes: the game's hexagon icons as they are; states drawn as in the layout guide (white glow on hover, gold ring
   when selected, cyan for the branch a padlock opens: MI_Skilltree_Border_Highlighted colours). */
.wenc-hex-hit { fill: transparent; }
.wenc-hex-glow { opacity: 0; transition: opacity 0.15s; pointer-events: none; }
.wenc-hex-center-ring { opacity: 0.8; }
.wenc-hex-icon { transition: opacity 0.15s; }
.wenc-hex-state { fill: none; stroke: none; stroke-width: 4; pointer-events: none; }
.wenc-hex.is-behind-lock .wenc-hex-icon { opacity: 0.55; }
.wenc-hex[tabindex="0"] { cursor: pointer; outline: none; }
.wenc-hex[tabindex="0"]:hover .wenc-hex-glow, .wenc-hex:focus-visible .wenc-hex-glow { opacity: 0.9; }
.wenc-hex.is-selected .wenc-hex-state { stroke: #f6c533; filter: drop-shadow(0 0 4px rgba(246, 197, 51, 0.8)); }
.wenc-hex.is-branch-lit .wenc-hex-icon { opacity: 1; }
.wenc-hex.is-branch-lit:not(.is-selected) .wenc-hex-state { stroke: #70eeff; stroke-width: 3; filter: drop-shadow(0 0 4px rgba(112, 238, 255, 0.8)); }
/* Details popup in the style of the game's skill popup: deep blue panel, white text, green cost. */
.wenc-tip.wenc-tip-sky {
	border: 3px solid #2a4fc4; border-image: none; border-radius: 22px; padding: 14px 18px; color: #fff;
	background: rgba(8, 16, 60, 0.94); box-shadow: 0 0 0 2px rgba(112, 238, 255, 0.18), 0 12px 28px rgba(0, 0, 0, 0.55); filter: none;
}
.wenc-tip-sky .wenc-h3 { color: #fff !important; text-transform: uppercase; letter-spacing: 0.02em; }
.wenc-tip-sky .wenc-prose { color: #dfe7ff; font-weight: 300; }
.wenc-tip-sky .wenc-prose strong { color: #fff; }
.wenc-tree-cost { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; font-weight: 600; color: #86d52a; }
.wenc-tree-lock-note { margin-top: 8px !important; font-weight: 600; color: #70eeff; }

/* ------------------------------------------------------------------------------------------------------------------
 * "Wilderings" tab: the way into the Kuxaan (the Hântu walking, one card per section). The rest of the /wilderings
 * page is Elementor content styled with the kit classes (wenc-kit.css).
 * ---------------------------------------------------------------------------------------------------------------- */
.wenc-tab-icon { display: none; }
.wenc-embed-home > .wenc { max-width: 1240px; margin: 0 auto; }

/* Book pages swapped in place by wenc.js; when the book has to be brought back into view, it stops clear of a sticky
   site header. While the next page loads, a paper-coloured veil with a thin running bar covers the page's content
   (inside the cover border, under the tabs), 150ms late so quick loads do not flicker. The book itself stays opaque:
   on a light page background a translucent book looks washed out. */
.wenc[data-wenc-base] { scroll-margin-top: 100px; }
.wenc.is-loading .wenc-page { cursor: progress; }
/* Over Leaflet's panes (z-index up to 1000) too, on the map page. */
.wenc.is-loading .wenc-page::before,
.wenc.is-loading .wenc-page::after { content: ""; position: absolute; z-index: 1001; opacity: 0; animation: wenc-loading-in 0.2s ease 150ms forwards; }
.wenc.is-loading .wenc-page::before { inset: 50px 42px 45px; background: rgba(230, 214, 163, 0.75); border-radius: 6px; }
.wenc.is-loading .wenc-page::after {
	top: 50px; left: 42px; right: 42px; height: 3px; z-index: 1002; border-radius: 2px;
	background: linear-gradient(90deg, transparent, var(--k-ink) 40%, var(--k-ink) 60%, transparent) 0 0 / 40% 100% no-repeat, rgba(143, 109, 76, 0.2);
	animation: wenc-loading-in 0.2s ease 150ms forwards, wenc-loading-bar 1.1s linear 150ms infinite;
}
@keyframes wenc-loading-in { to { opacity: 1; } }
@keyframes wenc-loading-bar { from { background-position: -70% 0, 0 0; } to { background-position: 170% 0, 0 0; } }
@media (prefers-reduced-motion: reduce) {
	.wenc.is-loading .wenc-page::after { animation: wenc-loading-in 0.2s ease 150ms forwards; }
}
.wenc-page:focus { outline: none; } /* Focused by wenc.js after a swap, for screen readers; not a control. */

.wenc-home { display: flex; flex-direction: column; gap: 22px; }
.wenc-home-intro { display: flex; flex-direction: column; gap: 10px; max-width: 760px; }
.wenc .wenc-home-title { font-size: 36px; line-height: 1.1; font-weight: 700; color: var(--k-ink-dark); }
.wenc .wenc-home-text { font-size: 17px; line-height: 1.55; color: var(--k-ink-dark); }

.wenc-home-hantu { background: rgba(143, 109, 76, 0.12); border: 2px solid rgba(143, 109, 76, 0.35); border-radius: 14px; padding: 16px 22px 14px; }
.wenc-home-hantu-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.wenc .wenc-home-hantu-head h3 { font-size: 22px; font-weight: 700; text-transform: uppercase; color: var(--k-ink-dark); }
.wenc-home-hantu-head h3 span { color: var(--k-ink); font-weight: 400; font-size: 16px; }
.wenc-home-open { color: var(--k-ink); font-size: 14px; text-transform: uppercase; white-space: nowrap; }
.wenc-home-hantu-row { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; align-items: end; margin: 10px 0 8px !important; }
.wenc-home-hantu-row a { display: flex; flex-direction: column; align-items: center; }
.wenc .wenc-home-hantu-row img { height: 130px; width: auto; max-width: 100%; object-fit: contain; transition: transform 0.15s; }
.wenc-home-hantu-row a:hover img { transform: translateY(-4px); }
.wenc-home-ground { display: block; width: 60%; height: 12px; margin-top: -6px; background: radial-gradient(closest-side, rgba(94, 70, 49, 0.28), rgba(94, 70, 49, 0)); }
.wenc-home-hantu-name { margin-top: 4px; font-size: 14px; text-transform: uppercase; color: var(--k-ink); text-align: center; }
.wenc .wenc-home-hantu > p { font-size: 15px; color: var(--k-ink-dark); }

.wenc-home-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px; }
.wenc-home-card {
	display: flex; align-items: center; gap: 12px; height: 92px; padding: 0 14px; font-size: 14px; color: var(--k-ink-dark);
	background: url("../kuxaan/item.webp") center / 100% 100% no-repeat; transition: transform 0.12s;
}
.wenc-home-card:hover { transform: translateY(-2px); }
.wenc-home-card strong { display: block; font-size: 16px; font-weight: 700; text-transform: uppercase; color: var(--k-ink-dark); }
.wenc-home-card strong span { font-weight: 400; color: var(--k-ink); }
.wenc-home-card-art { flex: none; width: 66px; height: 66px; display: flex; align-items: center; justify-content: center; background: url("../kuxaan/square.webp") center / 100% 100% no-repeat; }
.wenc .wenc-home-card-art img { max-width: 54px; max-height: 54px; }
.wenc .wenc-home-card-art.is-cover img { width: 56px; height: 56px; object-fit: cover; border-radius: 6px; }

/* ------------------------------------------------------------------------------------------------------------------
 * Builds tab: the Kuxaan's Stats Summary (mockups in Art/UI/Kuxaan Screen/Kuxaan/Stats_Summary) as a calculator.
 * ---------------------------------------------------------------------------------------------------------------- */
.wenc-builds-banner { position: relative; display: flex; justify-content: center; align-items: center; height: 60px; margin: 0 auto 18px !important; max-width: 420px; }
/* The Kuxaan's teal title banner, turned to the summary's yellow. */
.wenc-builds-banner::before { content: ""; position: absolute; inset: 0; background: url("../kuxaan/banner.webp") center / 100% 100% no-repeat; filter: sepia(1) saturate(4.5) hue-rotate(-12deg) brightness(1.25); }
.wenc-builds-banner span { position: relative; font-size: 24px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; color: #8a5a1c; }
.wenc-builds-abi-row { display: grid; grid-template-columns: minmax(120px, 0.8fr) minmax(0, 1.4fr); gap: 18px; align-items: center; }
.wenc .wenc-builds-abi { width: 100%; max-height: 330px; object-fit: contain; filter: drop-shadow(0 8px 6px rgba(94, 70, 49, 0.25)); }
.wenc-builds-label, .wenc .wenc-builds-heading { display: block; font-size: 15px !important; font-weight: 600 !important; text-transform: uppercase; color: var(--k-ink) !important; letter-spacing: 0.02em; margin: 0 0 6px !important; }
.wenc-builds-bar { position: relative; height: 22px; border-radius: 999px; background: linear-gradient(#93d34a, #6db52c); box-shadow: inset 0 0 0 2px #67482a, 0 1px 0 rgba(255, 255, 255, 0.4); margin-bottom: 14px; }
.wenc-builds-bar b { position: absolute; right: 10px; top: 1px; font-size: 14px; font-weight: 700; color: #fff; text-shadow: 0 1px 2px rgba(60, 40, 20, 0.7); }
.wenc-builds-rows li { display: flex; justify-content: space-between; gap: 10px; align-items: center; height: 30px; padding: 0 10px; margin-bottom: 4px; background: url("../kuxaan/stat-bg.webp") center / 100% 100% no-repeat; font-size: 15px; text-transform: uppercase; }
.wenc-builds-rows li span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wenc-builds-rows b, .wenc-builds-bar b { font-variant-numeric: tabular-nums; white-space: nowrap; }
.wenc-builds-rows b { color: var(--k-ink-dark); font-weight: 700; text-transform: none; }
/* Changes against Abi without upgrades, in green (up) or orange (down) after the value: the book has no red but
   the Mythic frame. */
.wenc-builds-rows b.is-up { color: #3f8a1e; }
.wenc-builds-rows b.is-down { color: #d9650d; }
.wenc-builds-rows b[data-delta]:not([data-delta=""])::after { content: " (" attr(data-delta) ")"; font-size: 12px; font-weight: 600; }
.wenc-builds-link { display: inline-block; margin-top: 8px; padding: 4px 2px; border: 0; background: none; color: var(--k-ink-soft); font-size: 14px; font-weight: 600; text-transform: uppercase; cursor: pointer; }
.wenc-builds-link:hover { color: var(--k-ink-dark); }
.wenc-builds-link[disabled] { display: none; }
.wenc-builds-stats .wenc-builds-link { float: right; }
.wenc-builds-cond { margin-top: 18px; padding: 12px 16px; border-style: solid; border-width: 14px; border-image: url("../kuxaan/box.webp") 40 fill / 14px stretch; }
.wenc-builds-cond li { font-size: 14px; color: var(--k-ink-dark); margin: 2px 0; }
.wenc-builds-cond b { color: #3f8a1e; }
.wenc-builds-cond small { color: var(--k-ink); font-size: 13px; }
.wenc-builds.is-ready .wenc-builds-nojs { display: none; }

.wenc-builds-box { padding: 6px 12px 10px; margin: 0 0 12px; border-style: solid; border-width: 16px; border-image: url("../kuxaan/box.webp") 40 fill / 16px stretch; }
.wenc-builds-slots { display: flex; flex-wrap: wrap; gap: 10px 12px; align-items: flex-start; min-height: 96px; }
.wenc-builds-slot { position: relative; display: flex; flex-direction: column; align-items: center; gap: 4px; width: 84px; padding: 0; border: 0; background: none; cursor: pointer; color: var(--k-ink); transition: transform 0.12s; }
.wenc-builds-slot:hover, .wenc-builds-slot:focus-visible { transform: translateY(-3px); }
.wenc-builds-slot:focus-visible { outline: 2px solid var(--k-orange); outline-offset: 2px; border-radius: 8px; }
.wenc-builds-hex { display: grid; place-items: center; width: 80px; height: 86px; background: url("../kuxaan/hex.webp") center / contain no-repeat; }
.wenc .wenc-builds-hex img { width: 64px; height: 64px; object-fit: contain; }
.wenc-builds-hex.is-chest { filter: sepia(0.25); }
.wenc-builds-hex.is-big { width: 132px; height: 142px; }
.wenc .wenc-builds-hex.is-big img { width: 108px; height: 108px; }
.wenc-builds-add .wenc-builds-hex, .wenc-builds-add > span { display: grid; place-items: center; width: 80px; height: 86px; background: url("../kuxaan/hex-unknown.webp") center / contain no-repeat; font-size: 0; }
.wenc-builds-add > span::after { content: "+"; font-size: 34px; font-weight: 700; color: var(--k-ink-soft); }
.wenc-builds-plant { width: 92px; }
.wenc .wenc-builds-plant img { width: 76px; height: 76px; object-fit: cover; border-radius: 12px; box-shadow: 0 0 0 3px var(--k-paper-light), 0 2px 6px rgba(70, 48, 26, 0.3); }
.wenc-builds-badge { padding: 1px 10px 2px; border-radius: 999px; background: var(--k-leather); color: var(--k-paper-light); font-size: 13px; font-weight: 700; white-space: nowrap; }
.wenc-builds-level { position: absolute; top: 0; right: 0; min-width: 26px; height: 26px; padding: 0 6px; border-radius: 999px; display: grid; place-items: center; background: var(--k-orange); color: #fff; font-size: 14px; font-weight: 700; box-shadow: 0 0 0 2px var(--k-paper-light); }
.wenc-builds-stars { display: inline-flex; gap: 1px; font-size: 13px; line-height: 1; color: rgba(143, 109, 76, 0.45); }
.wenc-builds-stars .is-on { color: #f1a524; text-shadow: 0 1px 0 #9a5c12; }
.wenc-builds-stars i { font-style: normal; }
.wenc-builds-treesum { margin: 6px 0 0 !important; font-size: 14px; font-weight: 600; color: var(--k-ink-dark); }
.wenc-builds-actions { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; }

.wenc-builds-treebox { margin-top: 26px; }
.wenc-builds-budget { margin-bottom: 14px; }
.wenc-builds-budget-list { display: flex; flex-wrap: wrap; gap: 8px 14px; margin-top: 8px; }
.wenc-builds-cur { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; background: var(--k-paper-light); font-size: 14px; font-weight: 600; color: var(--k-ink-dark); }
.wenc-builds-cur input { width: 84px; padding: 2px 6px; border: 2px solid var(--k-paper-dark); border-radius: 8px; background: #fffaf0; color: var(--k-ink-dark); font: 600 14px var(--wenc-font); }
.wenc-builds-cur small { font-weight: 500; color: var(--k-ink); font-size: 12px; }
.wenc-builds-cur small.is-over { color: #b3412f; font-weight: 700; }
/* Skill tree states while building: bought nodes glow, buyable ones look normal, the rest is dimmed. */
.wenc-tree-build .wenc-hex.is-owned .wenc-hex-state { stroke: #86d52a; stroke-width: 4; filter: drop-shadow(0 0 5px rgba(134, 213, 42, 0.85)); }
.wenc-tree-build .wenc-hex.is-owned .wenc-hex-glow { opacity: 0.75; }
.wenc-tree-build .wenc-hex.is-buyable .wenc-hex-state { stroke: rgba(112, 238, 255, 0.55); stroke-width: 2; stroke-dasharray: 6 5; }
.wenc-tree-build .wenc-hex.is-poor .wenc-hex-icon { opacity: 0.6; }
.wenc-tree-build .wenc-hex.is-unreachable .wenc-hex-icon { opacity: 0.35; }
.wenc-tree-build .wenc-hex-locked.is-open .wenc-hex-icon { opacity: 0.45; }
.wenc-tree-build .wenc-hex-locked.is-open .wenc-hex-state { stroke: #70eeff; stroke-width: 3; }

/* Dialogs: details, pickers and the card / plant / Hântu panels, on the Stats Details paper. */
/* The Stats Details paper (1103 x 600) as a border image: its top band (where the title goes, 55-95px down the image)
   keeps its place whatever the dialog's height, and the torn edges stay at the borders. */
.wenc-builds-dialog {
	width: min(900px, calc(100vw - 32px)); max-height: calc(100vh - 48px); padding: 0 14px 4px; color: var(--k-ink); font-family: var(--wenc-font);
	border-style: solid; border-width: 96px 50px 58px; border-image: url("../web/builds/details-bg.webp") 110 58 66 fill / 96px 50px 58px stretch;
	background: none; overflow: visible; filter: drop-shadow(0 18px 30px rgba(0, 0, 0, 0.45));
}
/* The body scrolls, not the dialog: the title and × live in the border, which a scrolling box would clip. */
.wenc-builds-dialog:not(.is-picker) .wenc-builds-dialog-body { max-height: calc(100vh - 48px - 154px - 4px); overflow-y: auto; overscroll-behavior: contain; }
.wenc-builds-dialog::backdrop { background: rgba(20, 16, 12, 0.6); }
.wenc-builds-dialog:focus, .wenc .wenc-builds-dialog[tabindex]:focus-visible { outline: none; } /* Focused on opening so Tab starts inside; not a control. */
/* The band is where a banner goes, as in the game: the Kuxaan's teal banner (524 x 86, leafy ends kept as they are,
   only its middle stretched) covers it, a little wider, with the title on it. The band runs 48-82px down the dialog
   (in its border, so the banner is pulled up into it) and over about 64% of its width. */
.wenc-builds-dialog-head {
	display: flex; align-items: center; justify-content: center; height: 56px; width: calc((100% + 128px) * 0.72); max-width: calc(100% + 80px);
	margin: -59px auto 24px; padding: 0 6px 5px; border-style: solid; border-width: 0 42px;
	border-image: url("../kuxaan/banner.webp") 0 64 fill / 0 42px stretch;
	/* No filter here: it would make the head the × button's containing block (the × sits in it, placed on the dialog). */
}
/* wenc-builds.js shrinks the letters until the title fits the banner (long Spanish and Catalan titles). */
.wenc .wenc-builds-dialog-title {
	margin: 0; max-width: 100%; overflow: hidden; white-space: nowrap; font-size: 21px; font-weight: 700; text-transform: uppercase;
	letter-spacing: 0.05em; line-height: 1.1; color: #fdeec4; text-align: center; text-shadow: 0 2px 0 rgba(20, 70, 70, 0.55);
}
.wenc .wenc-builds-dialog-title.is-two { white-space: normal; line-height: 1.02; letter-spacing: 0.03em; }
.wenc-builds-close { position: absolute; top: -80px; right: -36px; width: 36px; height: 36px; border: 0; border-radius: 50%; background: var(--k-leather); color: var(--k-paper-light); font-size: 24px; line-height: 1; cursor: pointer; }
.wenc-builds-dialog-body { display: flex; flex-direction: column; gap: 14px; align-items: stretch; }
/* Stats Details: two columns of three groups (health | damage, stamina | speed, ammo | others), each row of groups
   lined up at the top; the group's icon centred on its rows. The value has a column of its own on the row's dark
   end, so long names are cut short (full name on hover) instead of running into it. */
.wenc-builds-dialog.is-details { width: min(1040px, calc(100vw - 32px)); }
.wenc-builds-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 36px; align-items: start; padding: 0 4px 6px; }
.wenc-builds-group { display: grid; grid-template-columns: 58px minmax(0, 1fr); gap: 12px; align-items: center; }
.wenc .wenc-builds-group-icon { width: 58px; height: auto; }
/* The rows' own paper strip: the dark end is as wide as the values need (with the strip's slanted edge). */
.wenc-builds-group .wenc-builds-rows li {
	display: grid; grid-template-columns: minmax(0, 1fr) 84px; gap: 0; padding: 0; font-size: 13.5px; letter-spacing: 0.01em;
	background: linear-gradient(105deg, #f4e3b1 calc(100% - 88px), #d8bf8f calc(100% - 87px)); border-radius: 999px;
	box-shadow: inset 0 -1px 0 rgba(143, 109, 76, 0.18);
}
.wenc-builds-group .wenc-builds-rows li span { padding-left: 12px; }
.wenc-builds-group .wenc-builds-rows li b { padding-right: 12px; text-align: right; }
/* Run reward cards as the game's reward screen draws them (UI/Cards/Textures, set by wenc-builds.js as --face and
   --frame): the face, the reward's icon in its window, the name on the ribbon, the value on its plate, the text
   below, the rarity's stars on top and the rarity frame around. Sizes follow the card's width (container units). */
.wenc-builds-card {
	position: relative; container-type: inline-size; width: 100%; aspect-ratio: 372 / 530; isolation: isolate;
	display: block; color: #fff; font-family: var(--wenc-font); text-align: center; filter: drop-shadow(0 6px 10px rgba(40, 24, 10, 0.35));
}
.wenc-builds-card::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--face) center / 100% 100% no-repeat; }
.wenc-builds-card.is-skill::before { filter: hue-rotate(205deg) saturate(1.15) brightness(1.05); }
.wenc-builds-card::after { content: ""; position: absolute; inset: 0; z-index: 3; pointer-events: none; background: var(--frame) center / 100% 100% no-repeat; }
/* The frame takes the rarity's colour (the game's common frame is grey). */
.wenc-builds-card.is-r1::after { filter: sepia(1) saturate(5) hue-rotate(60deg) brightness(1.1); }
.wenc-builds-card.is-r2::after { filter: sepia(1) saturate(6) hue-rotate(170deg) brightness(1.1); }
.wenc-builds-card.is-r3::after { filter: sepia(1) saturate(6) hue-rotate(235deg) brightness(1.05); }
.wenc-builds-card.is-r4::after { filter: sepia(1) saturate(7) hue-rotate(5deg) brightness(1.25); }
.wenc-builds-card.is-r5::after { filter: sepia(1) saturate(7) hue-rotate(285deg) brightness(1.15); }
.wenc-builds-card.is-back::after { display: none; }
.wenc .wenc-builds-card-icon { position: absolute; left: 50%; top: 13%; width: 60%; height: 40%; translate: -50% 0; object-fit: contain; filter: drop-shadow(0 3px 4px rgba(0, 0, 0, 0.3)); }
.wenc .wenc-builds-card-stars { position: absolute; left: 50%; top: 1.5%; width: 26%; translate: -50% 0; z-index: 4; }
.wenc-builds-card-name {
	/* Centred on the ribbon (67.3% of the card's height) whatever the number of lines. */
	position: absolute; left: 13%; right: 13%; top: 67.3%; translate: 0 -50%;
	/* The ribbon is 74cqw wide; an upper-case letter of the game's font is about 0.9em wide. */
	font-size: min(7.4cqw, calc(74cqw / var(--len, 10))); font-weight: 700; line-height: 1; white-space: nowrap;
	text-transform: uppercase; text-shadow: 0 0.5cqw 0 rgba(0, 0, 0, 0.35);
}
/* Two lines (wenc-builds.js splits long names): smaller so both fit the ribbon's height (about 12cqw). */
.wenc-builds-card-name.is-two { font-size: min(5.6cqw, calc(74cqw / var(--len, 10))); line-height: 0.98; }
.wenc-builds-card-value {
	position: absolute; left: 50%; top: 73.5%; translate: -50% 0; min-width: 34%; padding: 1.2cqw 4cqw; border-radius: 2.4cqw;
	background: rgba(40, 14, 10, 0.55); font-size: 9.5cqw; font-weight: 700; line-height: 1.1; white-space: nowrap;
}
.wenc-builds-card.is-health .wenc-builds-card-value { top: 72.6%; background: none; }
/* From under the value plate to where the rarity frame starts (about 78 x 11cqw: the frame is drawn over the face's
   lower band). The text's area grows with the square of the letter size, so the size follows the square root of its
   length (--dlen, set by wenc-builds.js). */
.wenc-builds-card-desc {
	position: absolute; left: 11%; right: 11%; top: 83%; bottom: 9.4%; display: flex; align-items: center; justify-content: center;
	overflow: hidden; font-size: min(5.2cqw, calc(sqrt(950 / var(--dlen, 40)) * 1cqw)); line-height: 1.05;
}
.wenc-builds-card-desc .wenc-rt-r, .wenc-builds-card-long .wenc-rt-r { color: #ffd23f; }
/* The back's long text, sized the same way for its larger area (about 78 x 103cqw). */
.wenc-builds-card-long {
	position: absolute; inset: 14% 13% 13%; display: flex; align-items: center; justify-content: center; overflow: hidden;
	font-size: min(6.6cqw, calc(sqrt(7000 / var(--dlen, 120)) * 1cqw)); line-height: 1.3; white-space: pre-line;
}
.wenc-builds-card.is-small .wenc-builds-card-name:not(.is-two) { font-size: min(8.4cqw, calc(74cqw / var(--len, 10))); }
.wenc-builds-card.is-small .wenc-builds-card-value { top: 76%; font-size: 10.5cqw; }
.wenc-builds-card-stage { align-self: center; width: min(280px, 70vw); }
.wenc-builds-cardslot { width: 104px; }
.wenc-builds-cardslot:nth-child(odd) .wenc-builds-card { rotate: -3deg; }
.wenc-builds-cardslot:nth-child(even) .wenc-builds-card { rotate: 3deg; }
.wenc-builds-cardslot:hover .wenc-builds-card, .wenc-builds-cardslot:focus-visible .wenc-builds-card { rotate: 0deg; }
/* The run reward picker: cards across the whole width, each with what it does under it; "i" lays its long text over
   it (hover shows it too, as the button's title). */
.wenc-builds-pick-grid:has(.wenc-builds-pick-wrap) { grid-template-columns: repeat(auto-fill, minmax(124px, 1fr)); gap: 18px 12px; }
.wenc-builds-pick + .wenc-builds-pick { margin-top: 22px; }
.wenc-builds-pick-wrap { position: relative; display: flex; flex-direction: column; align-items: stretch; gap: 6px; }
.wenc-builds-pick-effect { font-size: 12.5px; font-weight: 600; line-height: 1.2; color: var(--k-ink-dark); text-align: center; }
.wenc-builds-info {
	position: absolute; top: 2px; left: 2px; z-index: 6; width: 24px; height: 24px; padding: 0; border: 0; border-radius: 50%;
	background: rgba(40, 24, 10, 0.75); color: #fff; font: italic 700 14px Georgia, serif; line-height: 24px; cursor: pointer;
}
.wenc-builds-pick-wrap.is-info .wenc-builds-info { background: var(--k-orange); }
.wenc-builds-pick-info {
	display: none; position: absolute; left: 4px; right: 4px; top: 4px; aspect-ratio: 372 / 530; z-index: 5; overflow: auto;
	padding: 30px 10px 10px; border-radius: 12px; background: #15474d; box-shadow: inset 0 0 0 3px #2aa6a0; color: #fff; font-size: 12.5px; line-height: 1.35; white-space: pre-line;
}
.wenc-builds-pick-info .wenc-rt-r { color: #ffd23f; }
.wenc-builds-pick-wrap.is-info .wenc-builds-pick-info { display: block; }
/* Traversal tools in the permanent upgrades: the Kuxaan's tool icon with its name under it. */
.wenc-builds-tool { width: 92px; }
.wenc .wenc-builds-tool > img { width: 76px; height: 76px; object-fit: contain; }
.wenc-builds-tool-name { font-size: 12px; font-weight: 700; text-transform: uppercase; color: var(--k-ink); line-height: 1.1; text-align: center; }
.wenc .wenc-builds-tool-big { width: 120px; height: 120px; object-fit: contain; margin: 0 auto; }
.wenc .wenc-builds-pick-item.is-tool > img { width: 72px; height: 72px; object-fit: contain; border-radius: 0; }

/* Pickers: header (title, filters, ×) and footer (Cancel / Add) fixed; only the list scrolls, in its own box and the
   whole width, with a fade at the edge that has more (set by wenc-builds.js); a level to choose before adding (a plant's
   blooming stage, a Hântu's level) sits in the footer. */
.wenc-builds-dialog.is-picker[open] { display: flex; flex-direction: column; height: min(800px, calc(100vh - 48px)); }
.wenc-builds-dialog.is-picker .wenc-builds-dialog-head { flex: none; margin-bottom: 10px; }
.wenc-builds-filters { flex: none; margin-bottom: 10px; }
/* The row takes the height left (not its content's), so the list scrolls inside it instead of running over the footer. */
.wenc-builds-pickbody { flex: 1 1 auto; min-height: 0; display: grid; grid-template-rows: minmax(0, 1fr); }
.wenc-builds-scroll {
	--fade-top: 0px; --fade-bottom: 0px;
	/* Its own stacking context: the cards in it are positioned, and without one they would still take clicks over the
	   footer where the list hides them (the hidden part below its edge). */
	position: relative; z-index: 0;
	min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 4px 6px 10px 2px;
	-webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 var(--fade-top), #000 calc(100% - var(--fade-bottom)), transparent 100%);
	mask-image: linear-gradient(to bottom, transparent 0, #000 var(--fade-top), #000 calc(100% - var(--fade-bottom)), transparent 100%);
}
.wenc-builds-scroll.has-above { --fade-top: 30px; }
.wenc-builds-scroll.has-below { --fade-bottom: 30px; }
.wenc-builds-detail-name { font-size: 17px; font-weight: 700; text-transform: uppercase; color: var(--k-ink-dark); text-align: center; }
.wenc-builds-dialog-foot { position: relative; z-index: 1; flex: none; display: flex; align-items: center; justify-content: flex-end; gap: 10px; margin-top: 12px; padding-top: 12px; border-top: 2px solid rgba(143, 109, 76, 0.25); }
.wenc-builds-foot-detail { flex: 1 1 auto; min-width: 0; }
.wenc-builds-foot-detail .wenc-note { margin: 0; }
.wenc-builds-foot-sel { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; }
.wenc-builds-foot-sel strong { font-size: 15px; font-weight: 700; text-transform: uppercase; color: var(--k-ink-dark); }
.wenc-builds-foot-sel .wenc-builds-stepper { gap: 8px; }
.wenc-builds-foot-sel .wenc-builds-stepper button { width: 30px; height: 30px; font-size: 18px; }
.wenc-builds-foot-sel .wenc-builds-stepper span { min-width: 140px; padding: 3px 12px; font-size: 13px; }
.wenc-builds-foot-effect { font-size: 13px; font-weight: 600; color: #3f8a1e; }
/* The buttons never shrink below their label ("Abbrechen", "Hinzufügen"): next to the plant stepper, the stepper gives */
.wenc-builds-cancel, .wenc-builds-accept { flex-shrink: 0; min-width: 120px; padding: 8px 20px; border: 0; border-radius: 999px; font: 700 15px var(--wenc-font); text-transform: uppercase; cursor: pointer; }
.wenc-builds-cancel { background: var(--k-paper-light); color: var(--k-ink-dark); box-shadow: inset 0 0 0 2px var(--k-paper-dark); }
.wenc-builds-accept { background: linear-gradient(#93d34a, #6db52c); color: #fff; text-shadow: 0 1px 1px rgba(40, 70, 10, 0.6); }
.wenc-builds-accept[disabled] { background: var(--k-paper-dark); text-shadow: none; cursor: default; }
.wenc-builds-pick-item.is-chosen, .wenc-builds-pick-card.is-chosen { box-shadow: 0 0 0 3px var(--k-orange), 0 4px 10px rgba(70, 48, 26, 0.3); }
.wenc-builds-pick-card { position: relative; padding: 4px; border: 0; border-radius: 14px; background: none; cursor: pointer; transition: transform 0.12s; }
.wenc-builds-pick-card:hover, .wenc-builds-pick-card:focus-visible { transform: translateY(-3px); }
.wenc-builds-pick-card:focus, .wenc-builds-pick-item:focus { outline: none; }
.wenc-builds-pick-card:focus-visible, .wenc-builds-pick-item:focus-visible { outline: 2px dashed var(--k-orange); outline-offset: 2px; }
.wenc-builds-pick-card.is-chosen::after, .wenc-builds-pick-item.is-chosen::after {
	content: "✓"; position: absolute; top: -6px; right: -6px; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center;
	background: var(--k-orange); color: #fff; font-weight: 700; font-size: 15px; box-shadow: 0 0 0 2px var(--k-paper-light);
}
.wenc-builds-pick-item { position: relative; }
.wenc-builds-rarities { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; }
.wenc-builds-rarity { display: inline-flex; flex-direction: column; align-items: center; gap: 2px; padding: 6px 10px; border: 2px solid transparent; border-radius: 10px; background: var(--k-paper-light); color: var(--k-ink-dark); font-size: 12px; font-weight: 600; text-transform: uppercase; cursor: pointer; }
.wenc-builds-rarity.is-active { border-color: var(--k-orange); }
.wenc-builds-pick h3 { margin-top: 4px !important; }
.wenc-builds-pick-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.wenc-builds-pick-item { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 10px 8px; border: 0; border-radius: 12px; background: var(--k-paper-light); color: var(--k-ink-dark); text-align: center; cursor: pointer; transition: transform 0.12s; }
.wenc-builds-pick-item:hover, .wenc-builds-pick-item:focus-visible { transform: translateY(-2px); box-shadow: 0 0 0 2px var(--k-orange); }
.wenc .wenc-builds-pick-item > img { width: 72px; height: 72px; object-fit: cover; border-radius: 10px; }
.wenc-builds-pick-name { font-weight: 700; font-size: 14px; text-transform: uppercase; }
.wenc-builds-pick-desc { font-size: 13px; color: var(--k-ink); hyphens: auto; }
.wenc-builds-card-face { align-self: center; display: flex; flex-direction: column; align-items: center; gap: 10px; width: min(340px, 100%); min-height: 330px; padding: 22px 20px; border-radius: 22px; text-align: center; color: #fff; background: radial-gradient(circle at 50% 30%, #1f8fd0, #123f8f 70%); box-shadow: inset 0 0 0 6px #f08a24; }
.wenc-builds-card-face.is-chest { box-shadow: inset 0 0 0 6px #c9a227; }
.wenc-builds-card-face.is-skill { background: radial-gradient(circle at 50% 30%, #3db9b0, #13615f 70%); }
.wenc-builds-card-face.is-back { justify-content: center; background: radial-gradient(circle at 50% 50%, #1d7f86, #0f4b55 75%); box-shadow: inset 0 0 0 6px #2aa6a0; }
.wenc-builds-card-face .wenc-prose { color: #fff; font-size: 17px; }
.wenc-builds-card-face .wenc-rt-r, .wenc-builds-card-face strong { color: #ffd23f; }
.wenc-builds-card-face .wenc-builds-hex { background: none; }
.wenc-builds-effects { padding: 10px 14px !important; border-radius: 10px; background: var(--k-paper-light); }
.wenc-builds-effects li { font-size: 15px; font-weight: 600; color: var(--k-ink-dark); margin: 2px 0; }
.wenc-builds-remove { align-self: center; padding: 6px 22px; border: 0; border-radius: 999px; background: #b3412f; color: #fff; font-size: 14px; font-weight: 700; text-transform: uppercase; cursor: pointer; }
.wenc-builds-plant-head { display: flex; gap: 16px; align-items: center; justify-content: center; }
.wenc .wenc-builds-plant-head > img { width: 110px; height: 110px; object-fit: cover; border-radius: 16px; box-shadow: 0 0 0 4px var(--k-paper-light); }
.wenc-builds-plant-head .wenc-builds-detail-name { margin-bottom: 6px; text-align: left; }
.wenc-builds-stepper { display: flex; align-items: center; justify-content: center; gap: 14px; }
.wenc-builds-stepper button { width: 38px; height: 38px; border: 0; border-radius: 50%; background: #86c53a; color: #fff; font-size: 22px; font-weight: 700; cursor: pointer; }
.wenc-builds-stepper button[disabled] { background: var(--k-paper-dark); cursor: default; }
.wenc-builds-stepper span { min-width: 180px; padding: 4px 14px; border-radius: 999px; background: linear-gradient(#93d34a, #6db52c); color: #fff; font-weight: 700; text-align: center; text-transform: uppercase; }
.wenc-builds-plant-value { text-align: center; font-size: 22px; font-weight: 700; color: #3f8a1e; }

/* Builds: the open build, my builds, sharing and the save game importer */
.wenc-builds-current { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; margin: 0 0 10px; padding: 6px 12px; border-radius: 10px; background: var(--k-paper-light); color: var(--k-ink-dark); }
.wenc-builds-current[hidden] { display: none; }
.wenc-builds-current.is-shared { box-shadow: inset 0 0 0 2px var(--k-orange); }
.wenc-builds-current-name { font-size: 14px; font-weight: 700; text-transform: uppercase; overflow-wrap: anywhere; }
.wenc-builds-current small { flex: 1 1 180px; font-size: 13px; color: var(--k-ink); }
.wenc-builds-current .wenc-builds-link { margin: 0; }
.wenc-builds-dialog-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 10px; }
.wenc-builds-field { display: flex; flex-direction: column; gap: 6px; font-weight: 600; color: var(--k-ink-dark); }
.wenc-builds-name, .wenc-builds-share-url { width: 100%; box-sizing: border-box; padding: 8px 12px; border: 2px solid var(--k-paper-dark); border-radius: 10px; background: #fffaf0; color: var(--k-ink-dark); font: 600 15px var(--wenc-font); }
.wenc-builds-saved { display: flex; flex-direction: column; gap: 8px; margin: 0 !important; padding: 0 !important; list-style: none; }
.wenc-builds-saved-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 12px; padding: 8px 12px; border-radius: 12px; background: var(--k-paper-light); }
.wenc-builds-saved-row.is-active { box-shadow: inset 0 0 0 2px #6db52c; }
.wenc-builds-saved-main { display: flex; flex-direction: column; flex: 1 1 220px; min-width: 0; }
.wenc-builds-saved-main b { color: var(--k-ink-dark); overflow-wrap: anywhere; }
.wenc-builds-saved-main small { font-size: 13px; color: var(--k-ink); }
.wenc-builds-saved-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0 12px; }
.wenc-builds-saved-actions .wenc-builds-link { margin: 0; font-size: 13px; }
.wenc-builds-saved-actions > span { font-size: 13px; font-weight: 600; color: var(--k-ink-dark); }
.wenc-builds-link.is-danger { color: #b3412f; }
.wenc-builds-saved-actions .wenc-builds-saved-now { font-weight: 700; text-transform: uppercase; color: #3f8a1e; }
.wenc-builds-saved-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 12px; border-radius: 12px; font-weight: 700; text-transform: uppercase; color: var(--k-ink-dark); background: var(--k-paper-light); box-shadow: 0 0 0 2px rgba(246, 196, 69, .55), 0 0 10px rgba(246, 184, 0, .45); } /* The build on screen, not kept yet: a golden glow round its own shape, as Builds marks focus. */
.wenc-builds-saved-foot .wenc-note { margin: 0 0 6px !important; }
.wenc-builds-saved-foot .wenc-builds-dialog-actions { justify-content: flex-start; }
.wenc-builds-saved-foot .wenc-builds-link { margin: 0; }
.wenc-builds-status { margin: 0 !important; font-weight: 600; color: #3f8a1e; }
.wenc-builds-dialog-body > .wenc-builds-status:empty { margin-top: -14px !important; } /* Stays in place for screen readers (aria-live) without a gap. */
.wenc-builds-share-link { display: flex; flex-wrap: wrap; gap: 10px; }
.wenc-builds-share-link .wenc-builds-accept { flex: 0 0 auto; }
.wenc-builds-share-link .wenc-builds-share-url { flex: 1 1 160px; min-width: 0; font-size: 13px; }
/* Themes style text fields (input[type=text], heavier than one class): ink on paper here, whatever the theme says */
.wenc .wenc-builds-share-url, .wenc .wenc-builds-name { background: #fbf2d6; color: var(--kx-ink, var(--k-ink-dark)); -webkit-text-fill-color: currentColor; }
/* The networks: round teal buttons with the mark in cream, a light ring and a tonal lip, as on the landing's
   Community card (and honey on hover and keyboard focus); the name under each, the whole set in one centred row
   across the page (4 + 3 on a phone). */
.wenc-builds-share-targets { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 6px; margin-top: 2px; }
.wenc-builds-share-target {
	display: flex; flex-direction: column; align-items: center; gap: 6px; width: 58px; padding: 0; border: 0; background: none;
	color: var(--k-ink-dark) !important; font: 700 11.5px/1.15 var(--wenc-font); letter-spacing: .02em; text-align: center; text-decoration: none !important;
	cursor: pointer; user-select: none; -webkit-user-select: none; caret-color: transparent; -webkit-tap-highlight-color: transparent;
}
/* The disc turns honey on keyboard focus too: no orange box around it (on the narrow "X" it read as a text cursor) */
.wenc .wenc-builds-share-target:focus, .wenc .wenc-builds-share-target:focus-visible { outline: none; }
.wenc-builds-share-icon {
	display: grid; place-items: center; width: 46px; height: 46px; box-sizing: border-box; border-radius: 50%; border: 2px solid #0f5c55;
	background: radial-gradient(80% 80% at 50% 28%, #7fe9da, #3fbcad 75%) #3fbcad; color: #fffdf4;
	box-shadow: inset 0 0 0 2px rgba(225, 255, 250, .4), 0 3px 0 #0b4843; transition: transform .2s cubic-bezier(.34, 1.56, .64, 1), background .15s, color .15s;
}
.wenc-builds-share-icon svg { width: 20px; height: 20px; fill: currentColor; filter: drop-shadow(0 1px 0 rgba(19, 128, 115, .9)); }
.wenc-builds-share-target:hover .wenc-builds-share-icon,
.wenc-builds-share-target:focus-visible .wenc-builds-share-icon {
	background: #ffc83d; border-color: #d9861a; color: #5a3410; transform: translateY(-2px);
	box-shadow: inset 0 0 0 2px rgba(255, 247, 210, .55), 0 3px 0 #b8650f;
}
.wenc-builds-share-target:hover .wenc-builds-share-icon svg,
.wenc-builds-share-target:focus-visible .wenc-builds-share-icon svg { filter: none; }
/* Sharing on the page, under the build's actions; off (dimmed, not clickable) while the build is empty */
.wenc-builds-share { display: flex; flex-direction: column; gap: 12px; margin-top: 20px; container: wencshare / inline-size; }
/* All seven in a row when they fit (7 x 58px + gaps), else four and three: never one or two left alone */
@container wencshare (max-width: 441px) {
	.wenc-builds-share-targets { width: 100%; max-width: 268px; margin-left: auto; margin-right: auto; }
	.wenc-builds-share-target { width: calc((100% - 18px) / 4); }
}
@container wencshare (max-width: 230px) {
	.wenc-builds-share-target { font-size: 10px; letter-spacing: 0; }
	.wenc-builds-share-icon { width: 40px; height: 40px; }
	.wenc-builds-share-icon svg { width: 18px; height: 18px; }
}
.wenc-builds:not(.is-ready) .wenc-builds-share { display: none; }
.wenc .wenc-builds-share > .wenc-builds-status { margin: -4px 0 -4px !important; text-align: center; }
.wenc .wenc-builds-share > .wenc-builds-status:empty { display: none; }
.wenc .wenc-builds-share-empty { margin: 0; text-align: center; }
.wenc .wenc-builds-share .wenc-builds-accept { white-space: nowrap; }
.wenc-builds-share-url:disabled { opacity: .55; }
.wenc-builds-share-target[disabled], .wenc-builds-share-target[aria-disabled="true"] { opacity: .45; cursor: default; pointer-events: none; }
.wenc-builds-where { margin: 0 !important; }
.wenc-builds-where code { font-size: 13px; overflow-wrap: anywhere; }
.wenc-builds-drop { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 22px; border: 2px dashed var(--k-paper-dark); border-radius: 16px; text-align: center; cursor: pointer; }
.wenc-builds-drop.is-over, .wenc-builds-drop:focus-within { border-color: #6db52c; background: rgba(147, 211, 74, 0.12); }
.wenc-builds-drop small { color: var(--k-ink); }
.wenc-builds-import-found { display: grid; gap: 4px; margin: 0 !important; padding: 0 !important; list-style: none; }
.wenc-builds-import-found li { display: flex; justify-content: space-between; gap: 12px; padding: 6px 12px; border-radius: 8px; background: var(--k-paper-light); color: var(--k-ink-dark); }
.wenc-builds-import-found b { text-align: right; }
.wenc-builds-import-team { display: flex; flex-wrap: wrap; gap: 8px; }
.wenc-builds-import-team .wenc-builds-hantu { opacity: 0.5; }
.wenc-builds-import-team .wenc-builds-hantu.is-chosen { opacity: 1; box-shadow: 0 0 0 3px var(--k-orange); border-radius: 12px; }
.wenc-builds-check { display: flex; align-items: center; gap: 8px; font-weight: 600; color: var(--k-ink-dark); cursor: pointer; }

/* Embedded (shortcode / Elementor) */
.wenc-embed { max-width: 1240px; margin: 0 auto; }
.wenc-embed .wenc-tiles { margin-bottom: 24px; }
.wenc-embed-more { margin-top: 18px; text-align: center; }

.wenc .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); }

/* Tablet / mobile: one page instead of a spread, thinner cover */
@media (max-width: 900px) {
	.wenc-spread { grid-template-columns: 1fr; gap: 18px; }
	.wenc-spread::before { display: none; }
	.wenc-tree-viewport { height: 64vh; }
	.wenc-builds-groups { grid-template-columns: 1fr; }
}
/* The book can sit in a narrow column of any page (an Elementor container): a spread turns into one page by the
   page's own width too, not only the screen's. (Dialogs are sized by the screen: they are on top of everything.) */
.wenc-page { container: wencpage / inline-size; }
@container wencpage (max-width: 760px) {
	.wenc-spread { grid-template-columns: 1fr; gap: 18px; }
	.wenc-spread::before { display: none; }
}
@container wencpage (max-width: 520px) {
	.wenc-builds-abi-row { grid-template-columns: 1fr; }
	.wenc .wenc-builds-abi { max-height: 200px; }
}
@media (max-width: 640px) {
	.wenc-builds-abi-row { grid-template-columns: 1fr; }
	.wenc .wenc-builds-abi { max-height: 200px; }
	.wenc-builds-banner span { font-size: 19px; }
	/* Phones: plain paper, no torn borders (they would eat a third of the width). */
	.wenc-builds-dialog { padding: 26px 18px 22px; border: 0; border-image: none; background: var(--k-paper); border-radius: 16px; }
	/* The banner across the top, leaving room for ×. */
	.wenc-builds-dialog-head { width: calc(100% - 44px); max-width: none; height: 48px; margin: -4px 0 14px; border-width: 0 34px; border-image-width: 0 34px; }
	.wenc .wenc-builds-dialog-title { font-size: 17px; }
	.wenc-builds-close { top: 18px; right: 18px; }
	.wenc-builds-dialog:not(.is-picker) .wenc-builds-dialog-body { max-height: calc(100vh - 140px); }
	/* Stats Details on a phone: one column, the group's icon above its rows so they get the whole width. */
	.wenc-builds-groups { gap: 18px; padding: 0; }
	.wenc-builds-group { grid-template-columns: 1fr; gap: 6px; }
	.wenc .wenc-builds-group-icon { width: 40px; }
	.wenc-builds-group .wenc-builds-rows li { grid-template-columns: minmax(0, 1fr) 72px; font-size: 12.5px; background: linear-gradient(105deg, #f4e3b1 calc(100% - 76px), #d8bf8f calc(100% - 75px)); }
	.wenc-builds-group .wenc-builds-rows li span { padding-left: 10px; }
	.wenc-builds-group .wenc-builds-rows li b { padding-right: 10px; }
	.wenc-builds-pick-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.wenc-builds-dialog.is-picker[open] { height: calc(100vh - 24px); max-height: none; }
	/* The footer's level picker gets a row of its own above the buttons. */
	.wenc-builds-dialog-foot { flex-wrap: wrap; }
	.wenc-builds-foot-detail { flex-basis: 100%; }
	.wenc-builds-cancel, .wenc-builds-accept { min-width: 0; flex: 1; }
	.wenc-builds-share-link .wenc-builds-share-url, .wenc-builds-share-link .wenc-builds-accept { flex: 1 1 100%; }
	.wenc-builds-pick-grid:has(.wenc-builds-pick-wrap) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.wenc-builds-slot { width: 72px; }
	.wenc-builds-cardslot { width: 88px; }
	.wenc-builds-hex, .wenc-builds-add > span { width: 68px; height: 74px; }
	.wenc .wenc-builds-hex img { width: 54px; height: 54px; }
}
@media (max-width: 640px) {
	.wenc-main { padding: 14px 4px 32px; }
	.wenc-head { padding: 0 12px; }
	.wenc-brand-book { font-size: 22px; }
	.wenc-tabs { padding: 0 8px; margin-bottom: -30px; }
	/* Long names ("The Greenhouse") wrap onto two lines instead of overflowing a third of the screen. */
	.wenc-tab { min-width: 0; flex: 1 1 30%; height: 72px; font-size: 12px; padding: 14px 6px 0; white-space: normal; }
	.wenc-tab.is-active { height: 78px; margin-top: -6px; padding-top: 16px; }
	.wenc-book { padding: 6px 12px 22px; }
	/* One fifth of the texture size on phones: whole pixel widths for every slice (30/28/34). */
	.wenc-book::before { border-width: 30px 28px 34px; border-image-width: 30px 28px 34px; }
	.wenc-book { background-position: 24px 26px; background-size: calc(100% - 48px) calc(100% - 56px); }
	.wenc-book::after { top: 4.8px; height: 25.2px; border-width: 0 28px; border-image-width: 0 28px; }
	.wenc-page { padding: 26px 14px 30px; }
	.wenc.is-loading .wenc-page::before { inset: 24px 16px 12px; }
	.wenc.is-loading .wenc-page::after { top: 24px; left: 16px; right: 16px; }
	.wenc-crumbs { margin-top: -4px; }
	.wenc-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 6px; }
	.wenc-hexslot { width: 86px; height: 92px; }
	.wenc-hexslot img { width: 76px; height: 76px; }
	.wenc-squareslot { width: 92px; height: 92px; }
	.wenc-squareslot img { width: 82px; height: 82px; }
	.wenc-typebox-body { padding: 10px 6px; }
	.wenc-search { margin-left: 0; width: 100%; }
	.wenc-skill { grid-template-columns: 64px 1fr; gap: 12px; }
	.wenc-skill-icon { width: 64px; height: 64px; }
	.wenc-stats { grid-template-columns: 1fr; }
	.wenc-quest-body { grid-template-columns: 1fr; }
	.wenc-items { grid-template-columns: 1fr; }
	.wenc-map { height: 64vh; }

	/* One row of icon-only tabs (the name stays as the link's accessible name). */
	.wenc-tabs { flex-wrap: nowrap; gap: 3px; margin-bottom: -26px; }
	.wenc-tab { flex: 1 1 0; height: 62px; padding: 12px 0 0; }
	.wenc-tab.is-active { height: 68px; margin-top: -6px; padding-top: 13px; }
	.wenc-tab-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
	.wenc-tab-icon { display: block; }

	/* "Wilderings" tab */
	.wenc .wenc-home-title { font-size: 28px; }
	.wenc .wenc-home-text { font-size: 16px; line-height: 1.5; }
	.wenc-home-hantu { padding: 12px 10px; }
	.wenc .wenc-home-hantu-head h3 { font-size: 18px; }
	.wenc .wenc-home-hantu-row img { height: 58px; }
	.wenc-home-hantu-name { font-size: 10px; }
	.wenc-home-cards { grid-template-columns: 1fr; gap: 8px; }
	.wenc-home-card { height: 76px; padding: 0 12px; }
	.wenc-home-card-art { width: 56px; height: 56px; }
	.wenc .wenc-home-card-art img { max-width: 46px; max-height: 46px; }
	.wenc .wenc-home-card-art.is-cover img { width: 46px; height: 46px; }
}
@media (prefers-reduced-motion: reduce) {
	.wenc * { transition: none !important; }
}

/* =====================================================================================================================
 * The Kuxaan, polished (0.5.0). Still the game's open leather book, with its paper, tabs, teal banners, hexagons,
 * rarity cards and popups; what is new comes from ReWild's Art/UI (assets/kuxaan) or is light, depth, rhythm and
 * hierarchy. The finish is the game's: outlines a shade darker than the piece they belong to (never dark ink), a
 * tonal lip and a soft shadow, flat surfaces without noise. No stationery (tape, clips, rings, stamps) and nothing
 * the game does not have. These rules come last on purpose: they refine the ones above.
 * ===================================================================================================================== */
.wenc {
	--kx-ink: #5e4026;        /* titles and values */
	--kx-ink2: #6f5134;       /* text */
	--kx-ink3: #9a7c58;       /* soft labels */
	--kx-paper: #f6e9bf;      /* chips and rows */
	--kx-paper2: #fbf2d6;
	--kx-line: rgba(143, 109, 76, .38);
	--kx-leather: linear-gradient(180deg, #8f6a45, #6c4b2f);
	--kx-gold: #f6b800;
	--kx-honey: #ffcf4a;
	--kx-teal: #2fb7aa;
	--kx-teal-d: #0f5f58;
	--kx-orange: #f38416;
	--kx-up: #3f8a1e;
	--kx-down: #d9650d;
	--kx-violet: #6e4a72;
	--kx-bounce: cubic-bezier(.34, 1.56, .64, 1);
	--kx-gem: var(--kx-honey);
	--kx-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238f6d4c' stroke-width='2.6' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M15.5 15.5L21 21'/%3E%3C/svg%3E");
	--kx-chev: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a07a52' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E");
	/* The eye-in-a-diamond of Strengths / Weakness (the game's icon shape, orange or teal: never red) */
	--kx-eye-o: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 2.5C17.6 9.4 22.6 14.4 29.5 16C22.6 17.6 17.6 22.6 16 29.5C14.4 22.6 9.4 17.6 2.5 16C9.4 14.4 14.4 9.4 16 2.5Z' fill='%235b4a40' stroke='%23ff9a3c' stroke-width='3' stroke-linejoin='round'/%3E%3Cpath d='M9.4 16C11.4 13 13.8 11.9 16 11.9S20.6 13 22.6 16C20.6 19 18.2 20.1 16 20.1S11.4 19 9.4 16Z' fill='%23fff1d2'/%3E%3Ccircle cx='16' cy='16' r='2.7' fill='%235b4a40'/%3E%3C/svg%3E");
	--kx-eye-t: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 2.5C17.6 9.4 22.6 14.4 29.5 16C22.6 17.6 17.6 22.6 16 29.5C14.4 22.6 9.4 17.6 2.5 16C9.4 14.4 14.4 9.4 16 2.5Z' fill='%235b4a40' stroke='%236ad7c9' stroke-width='3' stroke-linejoin='round'/%3E%3Cpath d='M9.4 16C11.4 13 13.8 11.9 16 11.9S20.6 13 22.6 16C20.6 19 18.2 20.1 16 20.1S11.4 19 9.4 16Z' fill='%23fff1d2'/%3E%3Ccircle cx='16' cy='16' r='2.7' fill='%235b4a40'/%3E%3C/svg%3E");
	color: var(--kx-ink2);
}

/* ── The Spring's light behind the book (wenc.js draws it next to the book, outside what a page swap replaces) ── */
.wenc-aura-host { position: relative; }
.wenc-aura-host > .wenc { position: relative; z-index: 1; }
/* 60px past the book's sides, but never past the window's (it would make the page scroll sideways): 50% - 50vw is
   how far the centred host is from the window's edge; 8px leave room for a scrollbar */
.wenc-aura { position: absolute; inset: -70px -60px -30px; left: max(-60px, calc(50% - 50vw + 8px)); right: max(-60px, calc(50% - 50vw + 8px)); z-index: 0; overflow: clip; pointer-events: none; }
.wenc-aura::before {
	content: ""; position: absolute; inset: 0;
	background: radial-gradient(closest-side, rgba(255, 249, 214, .92), rgba(255, 240, 178, .5) 48%, rgba(170, 236, 225, .2) 74%, rgba(170, 236, 225, 0));
}
.wenc-aura i {
	position: absolute; width: var(--s); height: var(--s); border-radius: 50%; opacity: .9;
	background: radial-gradient(circle, #fff 0 22%, rgba(255, 242, 180, .95) 38%, rgba(255, 226, 120, 0) 70%); box-shadow: 0 0 10px 2px rgba(255, 236, 160, .55);
	animation: wenc-mote var(--t) linear var(--d) infinite;
}
.wenc-aura i:nth-child(3n) { background: radial-gradient(circle, #fff 0 22%, rgba(170, 245, 232, .95) 38%, rgba(106, 215, 201, 0) 70%); box-shadow: 0 0 10px 2px rgba(130, 235, 220, .5); }
@keyframes wenc-mote { 0% { transform: translate(0, 50px) scale(.6); opacity: 0; } 18% { opacity: .95; } 80% { opacity: .8; } 100% { transform: translate(var(--x), -190px) scale(1); opacity: 0; } }

/* ── Book: a shadow under it, tabs in relief and the spine's three rope stitches (T_Page_base) ──────────────── */
.wenc .wenc-book::before { filter: drop-shadow(0 22px 26px rgba(16, 30, 70, .34)); }
.wenc .wenc-tab {
	font-weight: 700; letter-spacing: .05em; text-shadow: 0 1px 0 rgba(58, 38, 22, .55);
	transition: transform .22s var(--kx-bounce), filter .18s;
}
.wenc .wenc-tab:not(.is-active) { filter: brightness(.96); }
.wenc .wenc-tab:hover { transform: translateY(-5px); filter: brightness(1.09); }
.wenc .wenc-tab.is-active { color: #6b4a2b !important; text-shadow: 0 1px 0 rgba(255, 255, 255, .65); filter: drop-shadow(0 -3px 7px rgba(255, 238, 170, .65)); }
/* Three stitches as in the game: as far from the top as from the bottom, and one in the middle (stitch.webp is the
   stitch of T_Page_base with its shadow in the groove, at the book's scale). A short spread (wenc.js: is-short) keeps
   only the middle one: three would bunch up like a binder's rings. */
.wenc .wenc-spread::after {
	content: ""; position: absolute; z-index: 1; top: -20px; bottom: -16px; left: 50%; width: 30px; margin-left: -15px; pointer-events: none;
	background: url(../kuxaan/stitch.webp) 50% 92px / 29px 155px no-repeat, url(../kuxaan/stitch.webp) 50% 50% / 29px 155px no-repeat,
		url(../kuxaan/stitch.webp) 50% calc(100% - 92px) / 29px 155px no-repeat;
}
.wenc .wenc-spread.is-short::after { background: url(../kuxaan/stitch.webp) 50% 50% / 29px 155px no-repeat; }
/* Vlügkin: the paper with the purple corruption of the game's Mooglers tab (same proportions as the book) */
.wenc:not(.is-loading) .wenc-page:has(> .wenc-list-vlugkin, > .wenc-vlugkin)::before {
	content: ""; position: absolute; inset: -12px -28px -40px; z-index: -1; pointer-events: none;
	border-style: solid; border-width: 75px 70px 85px; border-image: url(../kuxaan/stain.webp) 150 140 170 140 fill / 75px 70px 85px stretch;
}

/* ── Page type ──────────────────────────────────────────────────────────────────────────────────────────────────── */
.wenc .wenc-h1 { font-size: clamp(30px, 3.3vw, 42px) !important; font-weight: 700 !important; color: var(--kx-ink) !important; letter-spacing: .005em; text-shadow: 0 2px 0 rgba(255, 250, 230, .7); }
.wenc .wenc-prose { color: var(--kx-ink2); font-size: 15.5px; line-height: 1.55; }
.wenc .wenc-prose strong { color: var(--kx-ink); font-weight: 700; }
.wenc .wenc-lead { color: var(--kx-ink2); font-size: 17.5px; font-style: italic; }
.wenc .wenc-level-label { color: var(--kx-orange); font-size: 22px; font-weight: 700; text-shadow: 0 1px 0 rgba(255, 250, 230, .8); }
.wenc .wenc-note { color: var(--kx-ink3); font-size: 13.5px; }

/* Back (like the game's "B BACK") */
.wenc .wenc-crumbs { margin: -14px 0 16px; }
.wenc .wenc-crumbs a {
	display: inline-flex; align-items: center; gap: 6px; padding: 5px 14px 6px 11px; border-radius: 999px;
	background: var(--kx-leather); color: #fff6dc; font-size: 13px; letter-spacing: .06em; text-shadow: 0 1px 0 rgba(30, 15, 5, .5);
	box-shadow: inset 0 1px 0 rgba(255, 225, 170, .3), 0 3px 0 rgba(58, 38, 22, .3); transition: transform .2s var(--kx-bounce), filter .15s;
}
.wenc .wenc-crumbs a:hover { transform: translateX(-3px); filter: brightness(1.12); color: #fff; }

/* ── Section signs: centred, all the same size (460 x 58). Long titles shrink to fit (wenc.js) ────────────────── */
.wenc .wenc-list-title,
.wenc .wenc-home-title {
	position: relative; display: flex; align-items: center; justify-content: center; box-sizing: border-box;
	width: min(460px, 100%); height: 58px; padding: 0 0 1px; margin: -8px auto 26px !important;
	border-style: solid; border-width: 0 46px; border-image: url(../kuxaan/plaque.webp) 0 70 fill / 0 46px stretch;
	color: #7a5634 !important; font: 700 24px/1 var(--wenc-font) !important; letter-spacing: .07em !important; text-transform: uppercase !important; text-align: center;
	text-shadow: 0 1px 0 #fff6d6; white-space: nowrap;
	filter: drop-shadow(0 4px 3px rgba(94, 70, 49, .22));
}
/* The Greenhouse: teal banner with yellow letters (T_Banner_Greenhouse) */
.wenc .wenc-list-plants > .wenc-list-title {
	border-image-source: url(../kuxaan/banner-teal.webp); color: #ffd84a !important; letter-spacing: .06em !important;
	text-shadow: 0 2px 0 #1d5d57, 1px 0 0 #1d5d57, -1px 0 0 #1d5d57, 0 -1px 0 #1d5d57;
}
/* Home: the tribes' golden banner (T_Banner_header), the brightest of the Kuxaan */
.wenc .wenc-home-title {
	border-width: 0 37px; border-image: url(../kuxaan/banner-gold.webp) 0 46 fill / 0 37px stretch;
	color: #5c3510 !important; letter-spacing: .08em !important; text-shadow: 0 1px 0 rgba(255, 240, 190, .8);
	filter: drop-shadow(0 4px 3px rgba(150, 90, 10, .28));
}
/* Vlügkin: the dripping purple brushstroke, like the header of the Mooglers tab */
.wenc .wenc-list-vlugkin > .wenc-list-title {
	border: 0; height: 84px; margin: -14px auto 6px !important; padding: 0 0 26px;
	background: url(../kuxaan/brush-purple.webp) center / 100% 100% no-repeat; filter: none;
	color: #fbeee0 !important; letter-spacing: .1em !important; text-shadow: 0 2px 0 rgba(50, 22, 45, .45);
}

/* The quests' brushstrokes (T_Header_mainquest): headings inside the pages, with the quest marker in the type's colour */
.wenc .wenc-entry .wenc-h2,
.wenc .wenc-traits > .wenc-h2,
.wenc .wenc-builds-treebox > .wenc-h2,
.wenc .wenc-builds-box > .wenc-builds-heading,
.wenc .wenc-builds-cond > .wenc-builds-heading {
	position: relative; display: flex !important; align-items: center; gap: 10px;
	width: fit-content; min-width: min(64%, 300px); max-width: 100%; box-sizing: border-box;
	padding: 9px 0 10px 4px !important; margin: 8px 0 16px -8px !important;
	border-style: solid; border-width: 0 92px 0 16px; border-image: url(../kuxaan/h-brown.webp) 0 140 0 22 fill / 0 92px 0 16px stretch;
	color: #fff6dc !important; font-size: 17px !important; font-weight: 700 !important; line-height: 1.1 !important; letter-spacing: .07em; text-transform: uppercase;
	text-shadow: 0 1px 0 rgba(40, 20, 5, .55);
}
.wenc .wenc-entry .wenc-h2::before,
.wenc .wenc-traits > .wenc-h2::before,
.wenc .wenc-builds-treebox > .wenc-h2::before,
.wenc .wenc-builds-box > .wenc-builds-heading::before,
.wenc .wenc-builds-cond > .wenc-builds-heading::before {
	/* The game's quest marker (a ring with a dot, as on MAIN QUEST), in the type's colour, without a dark outline */
	content: ""; flex: none; width: 14px; height: 14px; border-radius: 50%;
	background: radial-gradient(circle, var(--kx-gem) 0 3px, transparent 3.6px); box-shadow: inset 0 0 0 2.5px var(--kx-gem);
}
/* Vertical rhythm: a heading that follows another block gets air above it */
.wenc .wenc-entry .wenc-h2:not(:first-child) { margin-top: 28px !important; }
.wenc .wenc-entry .wenc-prose + .wenc-note { margin-top: 10px; }
.wenc .wenc-hantu { --kx-gem: var(--type); }
.wenc .wenc-vlugkin, .wenc .wenc-list-vlugkin ~ .wenc-traits { --kx-gem: #b58ad0; }
/* The lore and what the Hântu gives Abi: the teal brushstroke of the secondary quests */
.wenc .wenc-entry .wenc-lore > .wenc-h2,
.wenc .wenc-entry .wenc-h2.is-teal { border-image-source: url(../kuxaan/h-teal.webp); }

/* Strengths / Weakness: the Kuxaan's dark torn-paper band (T_Page_bg) with its eye-in-a-diamond */
.wenc .wenc-entry .wenc-box { padding: 0 4px 2px; border: 0; border-image: none; background: none; }
.wenc .wenc-entry .wenc-box > .wenc-h2 {
	width: 100%; min-width: 0; margin: 0 0 10px -4px !important; padding: 11px 18px 21px 54px !important; border: 0; border-image: none;
	background: url(../kuxaan/band.webp) 0 0 / 100% 100% no-repeat; font-size: 18px !important; letter-spacing: .06em; text-transform: none;
}
.wenc .wenc-entry .wenc-box > .wenc-h2::before {
	position: absolute; left: 13px; top: 6px; width: 30px; height: 30px; rotate: none; border-radius: 0; box-shadow: none;
	background: var(--kx-eye-o) center / contain no-repeat;
}
.wenc .wenc-entry .wenc-box ~ .wenc-box > .wenc-h2::before { background-image: var(--kx-eye-t); }
.wenc .wenc-entry .wenc-box > .wenc-prose { padding: 0 8px; }
.wenc .wenc-entry .wenc-lore { margin-top: 18px; }
.wenc .wenc-entry .wenc-lore > .wenc-h2 {
	width: fit-content; min-width: min(64%, 300px); padding: 9px 0 10px 4px !important; margin: 8px 0 12px -8px !important;
	border-style: solid; border-width: 0 92px 0 16px; border-image: url(../kuxaan/h-teal.webp) 0 140 0 22 fill / 0 92px 0 16px stretch; background: none; font-size: 17px !important; text-transform: uppercase; letter-spacing: .07em;
}
.wenc .wenc-entry .wenc-lore > .wenc-h2::before { position: static; width: 14px; height: 14px; rotate: none; border-radius: 4px; background: #bff2ea; box-shadow: none; }

/* ── Fact chips ─────────────────────────────────────────────────────────────────────────────────────────────────── */
.wenc .wenc-facts { gap: 8px 10px; margin: 12px 0 16px !important; }
.wenc .wenc-fact {
	padding: 5px 15px 5px 6px; background: var(--kx-paper); color: var(--kx-ink); font-weight: 700; font-size: 14px;
	box-shadow: inset 0 0 0 2px var(--kx-line), 0 2px 0 rgba(94, 70, 49, .18);
}
.wenc .wenc-fact .wenc-inline-icon, .wenc .wenc-fact .wenc-type-icon { width: 28px; height: 28px; }
.wenc .wenc-fact-type { background: var(--type); color: #fff; text-shadow: 0 1px 1px rgba(30, 20, 5, .5); box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .14), inset 0 0 0 2px rgba(255, 255, 255, .25), 0 2px 0 rgba(94, 70, 49, .25); }
.wenc a.wenc-fact { transition: transform .2s var(--kx-bounce), background .15s; }
.wenc a.wenc-fact:hover { background: var(--kx-honey); transform: translateY(-2px); }
.wenc .wenc-fact-label { color: var(--kx-ink3); font-weight: 600; }
.wenc .wenc-plant .wenc-leftpage > p:has(> .wenc-fact) { margin: 6px 0 0; }

/* Chips that open a page (traits, Vlügkin): leather medals */
.wenc .wenc-chips { gap: 10px; }
.wenc .wenc-chips-links a.wenc-chip {
	gap: 8px; padding: 5px 16px 5px 6px; min-height: 38px; background: var(--kx-leather); color: #fff6dc; font-weight: 700; font-size: 14.5px;
	text-shadow: 0 1px 0 rgba(30, 15, 5, .5); box-shadow: inset 0 1px 0 rgba(255, 225, 170, .3), 0 3px 0 rgba(58, 38, 22, .32);
	transition: transform .2s var(--kx-bounce), background .15s, color .15s;
}
.wenc .wenc-chips-links a.wenc-chip:not(:has(img)) { padding-left: 16px; }
.wenc .wenc-chips-links a.wenc-chip img { width: 30px; height: 30px; padding: 2px; border-radius: 50%; background: #fbf2d6; box-shadow: 0 0 0 2px var(--kx-honey); }
.wenc .wenc-chips-links a.wenc-chip::after { content: ""; width: 12px; height: 12px; background: currentColor; opacity: .7; -webkit-mask: var(--kx-chev) center / contain no-repeat; mask: var(--kx-chev) center / contain no-repeat; }
.wenc .wenc-chips-links a.wenc-chip small { color: var(--kx-honey); }
.wenc .wenc-chips-links a.wenc-chip:hover { background: var(--kx-honey); color: var(--kx-ink); text-shadow: none; transform: translateY(-2px); }
.wenc .wenc-chips-links a.wenc-chip:hover small { color: var(--kx-ink); }
.wenc .wenc-appears li { color: var(--kx-ink); font-weight: 600; margin: 4px 0; display: flex; align-items: center; gap: 10px; }
.wenc .wenc-appears li::before { content: ""; flex: none; width: 18px; height: 18px; background: url(../kuxaan/bullet-on.webp) center / contain no-repeat; filter: sepia(1) saturate(4) hue-rotate(5deg) brightness(.95); font-size: 0; }

/* ── Portraits: a halo in the type's colour and the game's Hântu shadow (T_Hantu_Shadow) ────────────────────────── */
.wenc .wenc-entry .wenc-portrait { min-height: 300px; margin: 8px 0 18px; isolation: isolate; }
.wenc .wenc-entry .wenc-portrait::before {
	content: ""; position: absolute; left: 50%; top: 47%; width: min(340px, 92%); aspect-ratio: 1; translate: -50% -50%; border-radius: 50%; z-index: 0;
	background: radial-gradient(closest-side, color-mix(in srgb, var(--type) 58%, transparent), color-mix(in srgb, var(--type) 18%, transparent) 62%, transparent);
}
.wenc .wenc-entry .wenc-portrait::after { left: 50%; right: auto; width: min(260px, 64%); translate: -50% 0; bottom: 0; height: 34px; border-radius: 0; background: url(../kuxaan/shadow.webp) center / 100% 100% no-repeat; }
.wenc .wenc-entry .wenc-portrait img { max-height: 340px; filter: drop-shadow(0 5px 0 rgba(94, 70, 49, .16)); }
.wenc .wenc-vlugkin .wenc-portrait::before { background: radial-gradient(closest-side, rgba(126, 92, 140, .42), rgba(126, 92, 140, .14) 62%, transparent); }
/* Icons (plant, resource): a medallion with reward rays. The icon keeps its own size (128px: enlarging it would
   pixelate it) and the shadow goes right under it, in a column, whatever the picture's size. */
.wenc .wenc-entry .wenc-portrait-icon { min-height: 260px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; background: none; }
.wenc .wenc-entry .wenc-portrait-icon::after { position: static; flex: none; width: 150px; height: 26px; translate: none; }
.wenc .wenc-entry .wenc-portrait-icon::before {
	width: 290px; top: calc(50% - 14px); background:
		radial-gradient(closest-side, rgba(255, 236, 160, .95), rgba(255, 214, 90, .55) 38%, rgba(255, 214, 90, 0) 70%),
		repeating-conic-gradient(from 6deg, rgba(255, 200, 70, .42) 0 9deg, rgba(255, 200, 70, 0) 9deg 22.5deg);
	-webkit-mask: radial-gradient(closest-side, #000 55%, transparent); mask: radial-gradient(closest-side, #000 55%, transparent);
}
.wenc .wenc-entry .wenc-portrait-icon img { max-height: 176px; filter: drop-shadow(0 6px 0 rgba(94, 70, 49, .25)) drop-shadow(0 0 14px rgba(255, 220, 120, .8)); }

/* ── Skills and stats ───────────────────────────────────────────────────────────────────────────────────────────── */
.wenc .wenc-skill { position: relative; grid-template-columns: 92px 1fr; gap: 18px; margin-bottom: 24px; }
.wenc .wenc-skill-icon { width: 92px; height: 92px; filter: drop-shadow(0 4px 0 rgba(94, 70, 49, .24)) drop-shadow(0 0 10px color-mix(in srgb, var(--type) 60%, transparent)); }
.wenc .wenc-skill + .wenc-skill::before { content: ""; position: absolute; left: 43px; top: -26px; height: 28px; border-left: 5px dotted rgba(143, 109, 76, .45); }
.wenc .wenc-skill-kind {
	display: inline-block; margin-bottom: 4px; padding: 3px 10px 3px 12px; border-radius: 6px; background: #7a5a3a; color: #fff6dc;
	font-size: 12px; font-weight: 700; letter-spacing: .1em; box-shadow: inset 4px 0 0 var(--type);
}
.wenc .wenc-vlugkin .wenc-skill-kind { box-shadow: inset 4px 0 0 #b58ad0; }
.wenc .wenc-trait > .wenc-spread > .wenc-leftpage > .wenc-skill-kind { margin-bottom: 8px; }
.wenc .wenc-skill-name { font-size: 18px; font-weight: 700; color: var(--kx-ink); margin: 2px 0 3px; }
/* Stat bars (T_Stats_bg01): both values on the same baseline in dark ink over the tan part (the game's outlined white
   does not read on this light tan: 1.9:1); the next level's, bolder */
.wenc .wenc-stat-head { color: var(--kx-ink3); letter-spacing: .02em; white-space: nowrap; font-size: 12px; }
/* Centred over its 64 px column even when the label is wider (it spills evenly into the gap, not past the page) */
.wenc .wenc-stat-head span:last-child { overflow: visible; justify-self: center; }
.wenc .wenc-stat { height: 32px; font-size: 14.5px; }
.wenc .wenc-stat dt { color: var(--kx-ink); font-weight: 600; }
.wenc .wenc-stat dd { color: var(--kx-ink2); font-size: 15px; line-height: 1; font-weight: 700; }
.wenc .wenc-stat dd.wenc-stat-next { color: #4a2f17; font-weight: 800; text-shadow: 0 1px 0 rgba(255, 246, 220, .45); }
.wenc .wenc-stat dd.is-changing { color: #b5530a; }
.wenc .wenc-stat dd.wenc-stat-next.is-changing { color: #b5530a; }
/* Passive (T_Stats_bg02): both values sit on the leather, in cream */
.wenc .wenc-stats-passive .wenc-stat dd { color: #fff6dc; text-shadow: 0 1px 0 rgba(40, 20, 5, .6); }
.wenc .wenc-stats-passive .wenc-stat dd.wenc-stat-next { color: #fff; }
.wenc .wenc-stats-passive .wenc-stat dt { color: #5c3d12; }
/* Loose data (Vlügkin, traits): a cream row with the value in its leather capsule */
.wenc .wenc-stats-plain { grid-template-columns: 1fr; gap: 8px; }
.wenc .wenc-stats-plain .wenc-stat dt { white-space: normal; overflow: visible; line-height: 1.15; }
.wenc .wenc-stats-plain .wenc-stat { height: auto; min-height: 38px; padding: 4px 5px 4px 16px; background: var(--kx-paper); box-shadow: inset 0 0 0 2px var(--kx-line), 0 2px 0 rgba(94, 70, 49, .16); }
.wenc .wenc-stats-plain .wenc-stat dd { min-width: 64px; padding: 4px 12px 5px; border-radius: 999px; background: var(--kx-leather); color: #fff6dc; text-align: center; text-shadow: 0 1px 0 rgba(30, 15, 5, .5); }

/* Level bar like the Kuxaan's FEED bar: dark leather, the fruit, the level in orange, an orange fill up to the
   knob (--kx-f, 0..1, set by wenc.js) and a teal knob */
.wenc .wenc-level {
	gap: 8px 16px; margin: 24px 0 20px; padding: 9px 20px 9px 9px; border-radius: 26px; background: linear-gradient(180deg, #5f4630, #48331f);
	box-shadow: inset 0 2px 0 rgba(255, 225, 170, .16), inset 0 0 0 2px rgba(30, 15, 5, .35), 0 4px 0 rgba(58, 38, 22, .3), 0 10px 18px -8px rgba(30, 15, 5, .45);
}
.wenc .wenc-level-pill { padding: 3px 14px 3px 3px; background: rgba(255, 246, 220, .1); color: #fff6dc; font-size: 15px; letter-spacing: .05em; text-transform: uppercase; box-shadow: inset 0 0 0 2px rgba(255, 246, 220, .14); }
.wenc .wenc-level-pill img { width: 34px; height: 34px; padding: 3px; border-radius: 50%; background: radial-gradient(circle at 45% 35%, #fff6dc, #e5cf98); box-shadow: 0 0 0 2px var(--kx-honey); }
.wenc .wenc-level-pill output { color: #ffa53a; font-size: 20px; font-weight: 700; }
.wenc .wenc-level-range { height: 30px; padding: 0; background: none; }
.wenc .wenc-level-range input[type="range"] {
	-webkit-appearance: none; appearance: none; height: 16px; border-radius: 999px; cursor: pointer;
	background: linear-gradient(180deg, #ffbe5c, #f07d12) 0 0 / calc(13px + (100% - 26px) * var(--kx-f, 0)) 100% no-repeat, linear-gradient(180deg, #2a1c11, #3d2a1b);
	box-shadow: inset 0 2px 3px rgba(0, 0, 0, .5), 0 1px 0 rgba(255, 225, 170, .16);
}
.wenc .wenc-level-range input[type="range"]::-webkit-slider-thumb {
	-webkit-appearance: none; width: 28px; height: 28px; border-radius: 50%; border: 3px solid #fff6dc; cursor: grab;
	background: radial-gradient(circle at 40% 32%, #b4fff4, #3bc9b8 55%, #1a8e83); box-shadow: 0 3px 0 rgba(0, 0, 0, .35), 0 0 10px rgba(112, 238, 225, .55);
}
.wenc .wenc-level-range input[type="range"]::-moz-range-thumb {
	width: 22px; height: 22px; border-radius: 50%; border: 3px solid #fff6dc; background: radial-gradient(circle at 40% 32%, #b4fff4, #3bc9b8 55%, #1a8e83); box-shadow: 0 3px 0 rgba(0, 0, 0, .35);
}
.wenc .wenc-level-range input[type="range"]::-moz-range-track { background: transparent; }
.wenc .wenc-level-cost { color: rgba(255, 246, 220, .88); font-size: 14px; }
.wenc .wenc-level-cost strong { color: var(--kx-honey); font-size: 17px; }
.wenc .wenc-level .wenc-note { color: rgba(255, 246, 220, .74); padding: 0 6px 2px; font-size: 13px; }

/* ── Previous / next ────────────────────────────────────────────────────────────────────────────────────────────── */
.wenc .wenc-prevnext { position: relative; margin-top: 30px; padding-top: 20px; border-top: 0; }
.wenc .wenc-prevnext::before { content: ""; position: absolute; top: 0; left: 8%; right: 8%; height: 2px; background: linear-gradient(90deg, transparent, var(--kx-line) 18% 82%, transparent); }
.wenc .wenc-prevnext a {
	display: inline-flex; align-items: center; padding: 8px 18px 9px; border-radius: 999px; background: var(--kx-paper); color: var(--kx-ink);
	letter-spacing: .05em; box-shadow: inset 0 0 0 2px var(--kx-line), 0 3px 0 rgba(94, 70, 49, .22); transition: transform .2s var(--kx-bounce), background .15s;
}
.wenc .wenc-prevnext a:hover { background: var(--kx-honey); color: var(--kx-ink); transform: translateY(-2px); }

/* ── Home (the Wilderings tab) ──────────────────────────────────────────────────────────────────────────────────── */
.wenc .wenc-home { gap: 28px; }
.wenc .wenc-home-intro { align-items: center; text-align: center; margin: 0 auto; max-width: 760px; gap: 4px; }
.wenc .wenc-home-title { margin: -6px auto 12px !important; }
.wenc .wenc-home-text { color: var(--kx-ink2); font-size: 17.5px; }
/* The Hântu as in their tab of the game: a leather band and a paper box (type-body); inside, the Hântu standing on
   the paper with their shadow (T_Hantu_Shadow), like the Hântu of a Kuxaan entry. No art backgrounds. */
.wenc .wenc-home-hantu {
	margin-top: 12px; padding: 0 12px 6px; background: none; border-radius: 0;
	border-style: solid; border-width: 24px; border-image: url(../kuxaan/type-body.webp) 40 fill / 24px stretch;
}
.wenc .wenc-home-hantu-head { position: relative; isolation: isolate; align-items: center; margin: -40px -32px 8px; padding: 14px 30px 26px; }
.wenc .wenc-home-hantu-head::before {
	content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, #9a7650, #7d5a3a);
	-webkit-mask: url(../kuxaan/type-header.webp) center / 100% 100% no-repeat; mask: url(../kuxaan/type-header.webp) center / 100% 100% no-repeat;
}
.wenc .wenc-home-hantu-head h3 { display: flex; align-items: center; gap: 12px; color: #fff6dc; font-size: 22px; letter-spacing: .07em; text-shadow: 0 2px 0 rgba(30, 15, 5, .35); }
.wenc .wenc-home-hantu-head h3 span, .wenc .wenc-home-card strong span {
	display: inline-flex; align-items: center; padding: 3px 12px 4px; border-radius: 999px; background: #5a3f28; color: #fff6dc;
	font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; text-shadow: none; box-shadow: inset 0 0 0 2px rgba(255, 246, 220, .18);
}
.wenc .wenc-home-open {
	display: inline-flex; align-items: center; height: 40px; padding: 0 22px 4px; border-style: solid; border-width: 0 18px; border-image: url(../kuxaan/btn-yellow.webp) 0 50 fill / 0 18px stretch;
	color: #6b3d0a; font-weight: 700; font-size: 14px; letter-spacing: .08em; text-shadow: 0 1px 0 rgba(255, 255, 255, .5); transition: transform .2s var(--kx-bounce), filter .15s;
}
.wenc .wenc-home-hantu-head:hover .wenc-home-open { transform: translateY(-2px) scale(1.04); filter: brightness(1.06); }
.wenc .wenc-home-hantu-row { gap: 10px; margin: 2px 0 4px !important; padding: 18px 8px 6px; background: none; }
.wenc .wenc-home-hantu-row a { position: relative; }
.wenc .wenc-home-hantu-row img { height: 150px; position: relative; z-index: 1; filter: drop-shadow(0 4px 0 rgba(94, 70, 49, .16)); transition: transform .25s var(--kx-bounce); }
.wenc .wenc-home-hantu-row a:hover img { transform: translateY(-8px) scale(1.04); }
.wenc .wenc-home-ground { width: 76%; height: 22px; margin-top: -13px; background: url(../kuxaan/shadow.webp) center / 100% 100% no-repeat; opacity: .95; }
.wenc .wenc-home-hantu-name {
	margin-top: 8px; padding: 3px 14px 4px; border-radius: 999px; background: rgba(255, 248, 225, .78); color: var(--kx-ink);
	font-size: 14px; font-weight: 700; letter-spacing: .06em; box-shadow: inset 0 0 0 1.5px var(--kx-line);
}
.wenc .wenc-home-hantu-row a:hover .wenc-home-hantu-name { background: var(--kx-honey); }
.wenc .wenc-home-hantu > p { margin: 10px 6px 2px; color: var(--kx-ink2); text-align: center; font-size: 15px; }

/* Inventory rows of the Crafting tab (also the sections of the home page) */
.wenc .wenc-home-cards { grid-template-columns: repeat(auto-fit, minmax(330px, 1fr)); gap: 14px 16px; }
.wenc .wenc-home-card,
.wenc .wenc-item > a {
	position: relative; display: flex; align-items: center; gap: 16px; height: auto; min-height: 100px; padding: 12px 44px 12px 12px; border-radius: 14px;
	background: url(../kuxaan/item-row.webp) center / 100% 100% no-repeat; color: var(--kx-ink2); font-size: 14px; line-height: 1.35;
	box-shadow: 0 3px 0 rgba(143, 109, 76, .22); transition: transform .22s var(--kx-bounce), box-shadow .15s;
}
.wenc .wenc-home-card::after,
.wenc .wenc-item > a::after {
	content: ""; position: absolute; right: 16px; top: 50%; width: 18px; height: 18px; margin-top: -9px; opacity: .45;
	background: var(--kx-chev) center / contain no-repeat; transition: opacity .15s, translate .2s var(--kx-bounce);
}
.wenc .wenc-home-card:hover,
.wenc .wenc-item > a:hover {
	background-image: url(../kuxaan/item-row-hover.webp); transform: translateY(-3px);
	box-shadow: 0 0 0 3px var(--kx-gold), 0 0 18px rgba(246, 184, 0, .5), 0 6px 0 rgba(143, 109, 76, .18);
}
.wenc .wenc-home-card:hover::after,
.wenc .wenc-item > a:hover::after { opacity: 1; translate: 3px 0; }
.wenc .wenc-home-card-art,
.wenc .wenc-item-icon {
	flex: none; width: 76px; height: 76px; border-radius: 16px; background: radial-gradient(circle at 50% 38%, #fbf1d2, #e4d09b);
	box-shadow: inset 0 0 0 3px #f8ecc8, inset 0 0 0 5px rgba(143, 109, 76, .4), 0 3px 0 rgba(94, 70, 49, .2);
}
.wenc .wenc-item-icon { padding: 9px; object-fit: contain; }
.wenc .wenc-home-card-art img { max-width: 58px !important; max-height: 58px !important; filter: drop-shadow(0 3px 0 rgba(94, 70, 49, .2)); }
.wenc .wenc-home-card-art.is-cover img { width: 64px !important; height: 64px !important; border-radius: 11px; box-shadow: 0 0 0 2px #f8ecc8; }
.wenc .wenc-home-card strong { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin-bottom: 3px; font-size: 18px; color: var(--kx-ink); letter-spacing: .03em; }
.wenc .wenc-home-card strong span { font-size: 12px; padding: 2px 10px 3px; }
.wenc .wenc-home .wenc-note { text-align: center; }
/* The five sections are Crafting inventory rows at every width (the same design as the Greenhouse and Resources
   lists). Wide: 3 + 2 with the bottom row centred; in between: 2 + 2 + 1, the last one centred. */
.wenc .wenc-home-cards > li { display: flex; }
.wenc .wenc-home-cards > li > .wenc-home-card { flex: 1 1 auto; }
@container wencpage (min-width: 1000px) {
	.wenc .wenc-home-cards { grid-template-columns: repeat(6, minmax(0, 1fr)); }
	.wenc .wenc-home-cards > li { grid-column: span 2; }
	.wenc .wenc-home-cards > li:nth-child(4):nth-last-child(2) { grid-column: 2 / span 2; }
}
@container wencpage (min-width: 680px) and (max-width: 999.98px) {
	.wenc .wenc-home-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.wenc .wenc-home-cards > li:last-child:nth-child(odd) { grid-column: 1 / -1; justify-self: center; width: calc(50% - 8px); }
}

/* ── Greenhouse and Resources lists ─────────────────────────────────────────────────────────────────────────────── */
.wenc .wenc-items { grid-template-columns: repeat(auto-fill, minmax(400px, 1fr)); gap: 12px 16px; }
.wenc .wenc-item-name { font-size: 18px; font-weight: 700; color: var(--kx-ink); letter-spacing: .02em; }
/* The description sits on T_Item_Background (#d6c290): in the titles' ink (5.3:1), not the labels' */
.wenc .wenc-item-text { font-size: 13.5px; font-weight: 600; color: var(--kx-ink); margin-top: 3px; }

/* ── Hântu: type tabs with their texture, the type band and hexagons with a golden ring ─────────────────────────── */
.wenc .wenc-typetabs { gap: 5px; padding: 0 22px; margin-bottom: -12px; }
.wenc .wenc-typetab {
	width: 54px; height: 58px; padding: 0; border-radius: 0; background: var(--kx-tab, #8a6440) center top / 100% auto no-repeat;
	filter: brightness(.9) saturate(.85); transition: height .22s var(--kx-bounce), filter .15s;
}
.wenc .wenc-typetab img { opacity: 0; }
.wenc .wenc-typetab:hover { height: 64px; filter: none; }
.wenc .wenc-typetab.is-active { height: 72px; filter: drop-shadow(0 -4px 8px rgba(255, 240, 180, .75)); }
.wenc .wenc-typetab.wenc-type-bacteroid { --kx-tab: url(../kuxaan/tab-bacteroid.webp); }
.wenc .wenc-typetab.wenc-type-grassland { --kx-tab: url(../kuxaan/tab-grassland.webp); }
.wenc .wenc-typetab.wenc-type-tundra { --kx-tab: url(../kuxaan/tab-tundra.webp); }
.wenc .wenc-typetab.wenc-type-volcanic { --kx-tab: url(../kuxaan/tab-volcanic.webp); }
.wenc .wenc-typetab.wenc-type-wetland { --kx-tab: url(../kuxaan/tab-wetland.webp); }
.wenc .wenc-typetab.wenc-type-forest { --kx-tab: url(../kuxaan/tab-forest.webp); }
.wenc .wenc-typetab.wenc-type-jungle { --kx-tab: url(../kuxaan/tab-jungle.webp); }
.wenc .wenc-typetab.wenc-type-mountain { --kx-tab: url(../kuxaan/tab-mountain.webp); }
.wenc .wenc-typetab.wenc-type-desert { --kx-tab: url(../kuxaan/tab-desert.webp); }
.wenc .wenc-typetab.wenc-type-mushroom { --kx-tab: url(../kuxaan/tab-mushroom.webp); }
.wenc .wenc-typetab.wenc-typetab-all {
	width: auto; min-width: 62px; padding: 14px 14px 0; border-radius: 16px 16px 0 0; background: linear-gradient(180deg, #a07a52, #7a5634);
	color: #fff6dc; font-size: 13px; letter-spacing: .1em; text-shadow: 0 1px 0 rgba(30, 15, 5, .5); box-shadow: inset 0 2px 0 rgba(255, 225, 170, .3);
}
.wenc .wenc-typetab.wenc-typetab-all.is-active { padding-top: 18px; }
.wenc .wenc-search {
	min-width: 220px; height: 38px; padding: 6px 16px 6px 38px; margin-bottom: 8px; border: 0; border-radius: 999px;
	background: var(--kx-search) 13px 50% / 17px no-repeat, var(--kx-paper2); color: var(--kx-ink); font-size: 14.5px;
	box-shadow: inset 0 2px 4px rgba(94, 70, 49, .28), 0 0 0 2px var(--kx-line), 0 2px 0 rgba(255, 255, 255, .5);
}
.wenc .wenc-search::placeholder { color: var(--kx-ink3); }
.wenc .wenc-typebox-head { padding: 14px 30px 26px; font-size: 22px; letter-spacing: .08em; text-shadow: 0 2px 0 rgba(30, 15, 5, .3); }
.wenc .wenc-typebox-head::after {
	content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(180deg, rgba(255, 255, 255, .22), rgba(255, 255, 255, 0) 55%);
	-webkit-mask: url(../kuxaan/type-header.webp) center / 100% 100% no-repeat; mask: url(../kuxaan/type-header.webp) center / 100% 100% no-repeat;
}
.wenc .wenc-typebox-head span { display: inline-flex; align-items: center; gap: 12px; z-index: 1; }
.wenc .wenc-typebox[class*="wenc-type-"] .wenc-typebox-head span::before { content: ""; width: 34px; height: 34px; border-radius: 50%; background: var(--kx-ticon) center / contain no-repeat; filter: drop-shadow(0 2px 0 rgba(30, 15, 5, .3)); }
.wenc .wenc-typebox-body { padding: 34px 26px 26px; }
.wenc .wenc-typebox .wenc-grid { grid-template-columns: repeat(auto-fill, minmax(134px, 1fr)); gap: 22px 8px; }
.wenc .wenc-hexslot { width: 126px; height: 138px; }
.wenc .wenc-hexslot::before { content: ""; position: absolute; left: 50%; bottom: -2px; width: 96px; height: 22px; translate: -50% 0; background: url(../kuxaan/shadow.webp) center / 100% 100% no-repeat; opacity: .9; }
.wenc .wenc-hexslot img { width: 114px; height: 114px; transition: transform .25s var(--kx-bounce), filter .2s; filter: drop-shadow(0 4px 0 rgba(94, 70, 49, .22)); }
.wenc .wenc-hexslot::after { inset: 4px 1px 7px; background: var(--kx-gold); }
.wenc .wenc-card > a:hover .wenc-hexslot img, .wenc .wenc-card > a:focus-visible .wenc-hexslot img { transform: translateY(-5px) scale(1.05); filter: drop-shadow(0 4px 0 rgba(94, 70, 49, .22)) drop-shadow(0 0 12px rgba(255, 210, 80, .85)); }
.wenc .wenc-card > a:hover .wenc-hexslot::after { translate: 0 -5px; scale: 1.05; }
.wenc .wenc-card-name {
	padding: 3px 13px 4px; border-radius: 999px; background: rgba(255, 248, 225, .78); color: var(--kx-ink); font-size: 15px; font-weight: 700;
	box-shadow: inset 0 0 0 1.5px var(--kx-line); transition: background .15s;
}
.wenc .wenc-card > a:hover .wenc-card-name { background: var(--kx-honey); }
/* The biome icon (Biomes_NEW) on the band and on the Hântu cards of Builds (data-type, set by wenc-builds.js) */
.wenc .wenc-type-bacteroid, .wenc [data-type="bacteroid"] { --kx-ticon: url(../kuxaan/type-bacteroid.webp); }
.wenc .wenc-type-grassland, .wenc [data-type="grassland"] { --kx-ticon: url(../kuxaan/type-grassland.webp); }
.wenc .wenc-type-tundra, .wenc [data-type="tundra"] { --kx-ticon: url(../kuxaan/type-tundra.webp); }
.wenc .wenc-type-volcanic, .wenc [data-type="volcanic"] { --kx-ticon: url(../kuxaan/type-volcanic.webp); }
.wenc .wenc-type-wetland, .wenc [data-type="wetland"] { --kx-ticon: url(../kuxaan/type-wetland.webp); }
.wenc .wenc-type-forest, .wenc [data-type="forest"] { --kx-ticon: url(../kuxaan/type-forest.webp); }
.wenc .wenc-type-jungle, .wenc [data-type="jungle"] { --kx-ticon: url(../kuxaan/type-jungle.webp); }
.wenc .wenc-type-mountain, .wenc [data-type="mountain"] { --kx-ticon: url(../kuxaan/type-mountain.webp); }
.wenc .wenc-type-desert, .wenc [data-type="desert"] { --kx-ticon: url(../kuxaan/type-desert.webp); }
.wenc .wenc-type-mushroom, .wenc [data-type="mushroom"] { --kx-ticon: url(../kuxaan/type-mushroom.webp); }

/* ── Vlügkin: the game's portraits in their slot with a cream border (no double frame), traits as medals ─────────── */
.wenc .wenc-list-vlugkin .wenc-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 26px 26px; max-width: 800px; margin: 0 auto; }
.wenc .wenc-list-vlugkin .wenc-card { width: 150px; }
.wenc .wenc-squareslot { width: 132px; height: 132px; background: none; box-shadow: none; }
.wenc .wenc-squareslot img {
	width: 124px; height: 124px; border-radius: 20px; object-fit: cover; transition: transform .25s var(--kx-bounce);
	box-shadow: 0 0 0 4px #f6e9bf, 0 0 0 6px rgba(94, 70, 49, .32), 0 7px 0 4px rgba(94, 70, 49, .2);
}
.wenc .wenc-squareslot::after { inset: -6px; background: var(--kx-gold); }
.wenc .wenc-card > a:hover .wenc-squareslot img { transform: scale(1.06) translateY(-3px); }
.wenc .wenc-card > a:hover .wenc-squareslot::after { scale: 1.06; translate: 0 -3px; }
.wenc .wenc-list-vlugkin .wenc-card-name { margin-top: 4px; }
.wenc .wenc-traits { margin-top: 34px; padding-top: 26px; position: relative; }
.wenc .wenc-traits::before { content: ""; position: absolute; top: 0; left: 8%; right: 8%; height: 2px; background: linear-gradient(90deg, transparent, var(--kx-line) 18% 82%, transparent); }
.wenc .wenc-traits .wenc-chips { margin-top: 4px !important; }

/* Vlügkin / trait / resource entry: Abi's journal on the game's torn paper cut-out (no tape) */
.wenc .wenc-entry .wenc-rightpage > .wenc-journal:first-child {
	position: relative; padding: 4px 10px 6px; border-style: solid; border-width: 26px 28px 30px; rotate: .4deg;
	border-image: url(../kuxaan/popup.webp) 70 fill / 26px 28px 30px stretch; filter: drop-shadow(0 5px 6px rgba(94, 70, 49, .22));
	color: var(--kx-ink2); font-size: 16px;
}
.wenc .wenc-entry .wenc-rightpage > .wenc-journal:first-child + .wenc-box { margin-top: 24px !important; }

/* ── Map: a book frame, a vignette and the biome legend with the game map's icons ───────────────────────────────── */
.wenc .wenc-map-page { position: relative; }
.wenc .wenc-map {
	height: min(72vh, 700px); border: 0; border-radius: 20px; background: radial-gradient(120% 90% at 50% 45%, #6c5c4f, #4a3d33 75%);
	box-shadow: 0 0 0 7px #ecdaa6, 0 0 0 9px #cdb07a, 0 18px 30px -8px rgba(46, 30, 15, .4);
}
/* Over the tiles (z 400) and under the markers (600) */
.wenc .wenc-map::after { content: ""; position: absolute; inset: 0; z-index: 450; pointer-events: none; border-radius: inherit; box-shadow: inset 0 0 0 2px rgba(58, 38, 22, .55), inset 0 0 70px rgba(20, 12, 4, .5); }
.wenc .wenc-map .leaflet-bar { border: 0; border-radius: 14px; overflow: hidden; box-shadow: 0 0 0 2px #cdb07a, 0 3px 0 rgba(94, 70, 49, .3); }
.wenc .wenc-map .leaflet-bar a { width: 38px; height: 38px; line-height: 36px; font-size: 22px; font-weight: 700; background: var(--kx-paper2); color: var(--kx-ink); border-color: var(--kx-line); }
.wenc .wenc-map .leaflet-bar a:hover { background: var(--kx-honey); }
.wenc .wenc-map .leaflet-control-layers { border: 0; border-radius: 14px; background: var(--kx-paper2); box-shadow: 0 0 0 2px #cdb07a, 0 3px 0 rgba(94, 70, 49, .3); color: var(--kx-ink); font-weight: 700; }
.wenc .wenc-map-legend { position: absolute; z-index: 460; left: 22px; bottom: 22px; display: flex; flex-direction: column; gap: 8px; margin: 0 !important; min-width: 196px;
	/* The tan foot of T_Map_legend_bg (its last 150px) whole in the bottom slice: the rows end on the light paper */
	border-style: solid; border-width: 40px 18px 34px; border-image: url(../kuxaan/legend.webp) 80 30 150 fill / 40px 18px 34px stretch; padding: 4px 4px 8px;
	filter: drop-shadow(0 8px 10px rgba(20, 12, 4, .45)); }
.wenc .wenc-map-legend::before { content: attr(data-title); position: absolute; top: -33px; left: 0; right: 0; text-align: center; color: #fff6dc; font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.wenc .wenc-map-region { gap: 10px; padding: 4px 16px 4px 4px; background: rgba(255, 248, 225, .6); color: var(--kx-ink); font-weight: 700; font-size: 15px; box-shadow: inset 0 0 0 1.5px var(--kx-line); transition: background .15s, transform .2s var(--kx-bounce); }
.wenc a.wenc-map-region:hover { background: var(--kx-honey); transform: translateX(3px); }
.wenc .wenc-map-region .wenc-swatch { display: none; }
.wenc .wenc-map-region::before { content: ""; flex: none; width: 34px; height: 34px; border-radius: 50%; background: var(--kx-micon, #c8b27e) center / contain no-repeat; filter: drop-shadow(0 2px 0 rgba(58, 38, 22, .3)); }
.wenc .wenc-map-region[data-wenc-region="Grasslands"] { --kx-micon: url(../kuxaan/map-Grasslands.webp); }
.wenc .wenc-map-region[data-wenc-region="Wetlands"] { --kx-micon: url(../kuxaan/map-Wetlands.webp); }
.wenc .wenc-map-region[data-wenc-region="Volcanics"], .wenc .wenc-map-region[data-wenc-region="Volcanic"] { --kx-micon: url(../kuxaan/map-Volcanics.webp); }
.wenc .wenc-map-region[data-wenc-region="Tundra"] { --kx-micon: url(../kuxaan/map-Tundra.webp); }
.wenc .wenc-map-region[data-wenc-region="Bacteroid"] { --kx-micon: url(../kuxaan/map-Bacteroid.webp); }
.wenc .wenc-map-region[data-wenc-region="Forest"] { --kx-micon: url(../kuxaan/map-Forest.webp); }
.wenc .wenc-map-region[data-wenc-region="Jungle"] { --kx-micon: url(../kuxaan/map-Jungle.webp); }
.wenc .wenc-map-region[data-wenc-region="Mountain"] { --kx-micon: url(../kuxaan/map-Mountain.webp); }
.wenc .wenc-map-region[data-wenc-region="Desert"] { --kx-micon: url(../kuxaan/map-Desert.webp); }
.wenc .wenc-map-region[data-wenc-region="Mushrooms"] { --kx-micon: url(../kuxaan/map-Mushrooms.webp); }
.wenc .wenc-map-tip { border: 0; border-radius: 10px; background: var(--kx-paper2); color: var(--kx-ink); box-shadow: 0 0 0 2px #cdb07a, 0 3px 0 rgba(94, 70, 49, .3); }

/* ── Plant: blooming stages with their bullets, cost in its pill and the effect in green ───────────────────────── */
.wenc .wenc-table { border-spacing: 0 8px; margin-top: 4px; font-size: 15px; }
.wenc .wenc-table th { color: var(--kx-ink3); letter-spacing: .1em; padding: 0 14px; }
.wenc .wenc-table td { padding: 8px 14px; background: var(--kx-paper); color: var(--kx-ink); font-weight: 700; box-shadow: inset 0 2px 0 rgba(255, 255, 255, .45), inset 0 -2px 0 rgba(143, 109, 76, .16); }
.wenc .wenc-table td:first-child { width: 86px; white-space: nowrap; }
.wenc .wenc-table td:first-child::before { content: ""; display: inline-block; width: 20px; height: 20px; margin-right: 8px; vertical-align: -4px; background: url(../kuxaan/bullet-on.webp) center / contain no-repeat; filter: sepia(1) saturate(4) hue-rotate(5deg) brightness(.95); }
.wenc .wenc-table td:last-child { color: var(--kx-up); font-size: 16px; }
.wenc .wenc-table td .wenc-inline-icon { width: 26px; height: 26px; }
/* The plant's journal on torn paper. On a spread it is on the right page, under the table, and the left page is left
   to the medallion (wenc-spread-pic); on one column it goes back under the icon (see the narrow layout below). */
.wenc .wenc-plant .wenc-journal {
	margin-top: 28px; padding: 6px 12px 8px; border-style: solid; border-width: 26px 28px 30px; rotate: -.3deg;
	border-image: url(../kuxaan/popup.webp) 70 fill / 26px 28px 30px stretch; filter: drop-shadow(0 5px 6px rgba(94, 70, 49, .22));
}
/* Builds: Abi with her Hântu team on the left page; what only works in some situations next to the upgrades that
   give it, on the right (builds.php). The two pages even out with any build. */
.wenc .wenc-builds-summary > .wenc-builds-box { margin-top: 22px; }
.wenc .wenc-builds-upgrades > .wenc-builds-cond { margin: 4px 0 16px; }

/* Wide spreads only: the plant's medallion takes the left page; an entry with a single text (a resource) is centred,
   the medallion on one side and the torn paper on the other. */
@media (min-width: 900.02px) {
	@container wencpage (min-width: 760.02px) {
		.wenc .wenc-spread-pic > .wenc-leftpage { display: flex; flex-direction: column; }
		.wenc .wenc-spread-pic > .wenc-leftpage .wenc-portrait-icon { flex: 1 1 auto; min-height: 320px; margin: 10px 0 0; }
		.wenc .wenc-spread-pic > .wenc-leftpage .wenc-portrait-icon::before { width: 330px; }
		.wenc .wenc-spread.wenc-spread-solo { align-items: center; min-height: 380px; }
		.wenc .wenc-spread.wenc-spread-solo > .wenc-leftpage { display: flex; flex-direction: column; align-items: center; text-align: center; }
		.wenc .wenc-spread.wenc-spread-solo > .wenc-leftpage .wenc-portrait { width: 100%; min-height: 320px; margin-bottom: 0; }
		.wenc .wenc-spread.wenc-spread-solo > .wenc-leftpage .wenc-portrait-icon::before { width: 330px; }
		.wenc .wenc-spread.wenc-spread-solo > .wenc-leftpage .wenc-portrait-icon img { max-height: 200px; }
		.wenc .wenc-spread.wenc-spread-solo > .wenc-rightpage > .wenc-journal:first-child { padding: 18px 22px 20px; font-size: 18px; line-height: 1.6; text-align: center; }
		/* Builds: the last box of each page (the Hântu team, Share build) reaches down to the same line, whatever the
		   build holds */
		.wenc .wenc-builds > .wenc-spread > .wenc-leftpage, .wenc .wenc-builds > .wenc-spread > .wenc-rightpage { display: flex; flex-direction: column; }
		.wenc .wenc-builds-summary > .wenc-builds-box:last-of-type, .wenc .wenc-builds-upgrades > .wenc-builds-share { flex: 1 1 auto; }
	}
}
/* One column: the plant's journal goes back under its icon, before the upgrades (the right page's boxes become items
   of the spread so the journal can be put in between). */
@media (max-width: 900px) {
	.wenc .wenc-spread-pic { display: flex; flex-direction: column; gap: 0; }
	.wenc .wenc-spread-pic > .wenc-rightpage { display: contents; }
	.wenc .wenc-spread-pic > .wenc-leftpage { order: -2; }
	.wenc .wenc-spread-pic > .wenc-rightpage > .wenc-journal { order: -1; margin: 0 0 28px; }
}
@container wencpage (max-width: 760px) {
	.wenc .wenc-spread-pic { display: flex; flex-direction: column; gap: 0; }
	.wenc .wenc-spread-pic > .wenc-rightpage { display: contents; }
	.wenc .wenc-spread-pic > .wenc-leftpage { order: -2; }
	.wenc .wenc-spread-pic > .wenc-rightpage > .wenc-journal { order: -1; margin: 0 0 28px; }
}

/* ── Builds ─────────────────────────────────────────────────────────────────────────────────────────────────────── */
/* Stats Summary: the same one-piece golden banner as the home page (T_Banner_header), with no seams between pieces */
.wenc .wenc-builds-banner {
	width: min(460px, 100%); max-width: none; height: auto; min-height: 58px; box-sizing: border-box; padding: 0 8px 4px;
	border-style: solid; border-width: 0 37px; border-image: url(../kuxaan/banner-gold.webp) 0 46 fill / 0 37px stretch; background: none;
	filter: drop-shadow(0 4px 3px rgba(150, 90, 10, .28));
}
.wenc .wenc-builds-banner::before { display: none; }
/* One line where it fits; a long name (ru, pl on a phone) takes two and the banner grows, instead of widening the page */
.wenc .wenc-builds-banner span { color: #5c3510; font-size: 23px; line-height: 1.05; letter-spacing: .07em; text-align: center; text-wrap: balance; text-shadow: 0 1px 0 rgba(255, 240, 190, .8); }
.wenc .wenc-builds-label { color: var(--kx-ink) !important; letter-spacing: .07em; }
.wenc .wenc-builds-abi-row { grid-template-columns: minmax(150px, 1fr) minmax(0, 1.35fr); gap: 22px; }
.wenc .wenc-builds-abi { max-height: 380px; filter: drop-shadow(0 8px 6px rgba(94, 70, 49, .25)); }
.wenc .wenc-builds-bar { height: 26px; margin-bottom: 16px; background: linear-gradient(180deg, #b0e865, #6cb82c 60%, #5aa323); box-shadow: inset 0 0 0 2px #4e9a1e, inset 0 -6px 0 rgba(0, 0, 0, .1), inset 0 5px 0 rgba(255, 255, 255, .22), 0 2px 0 rgba(255, 255, 255, .45); }
.wenc .wenc-builds-bar b { top: 3px; right: 14px; font-size: 15px; }
/* Stats Summary rows: a long name wraps onto two lines instead of running over the value; up in green, down in orange */
.wenc .wenc-builds-summary .wenc-builds-rows li { height: auto; min-height: 34px; margin-bottom: 5px; padding: 3px 12px; gap: 12px; color: var(--kx-ink); font-weight: 600; letter-spacing: .03em; }
.wenc .wenc-builds-summary .wenc-builds-rows li span { flex: 1 1 auto; min-width: 0; max-width: 64%; white-space: normal; line-height: 1.08; overflow: visible; }
.wenc .wenc-builds-rows b { flex: none; color: var(--kx-ink); text-align: right; }
.wenc .wenc-builds-rows b.is-up { color: var(--kx-up); }
.wenc .wenc-builds-rows b.is-down { color: var(--kx-down); }
.wenc .wenc-builds-rows b[data-delta]:not([data-delta=""])::after { font-size: 11.5px; font-weight: 700; opacity: .9; }
/* The game's buttons: Details and the build's actions with the FEED texture and white letters outlined in a darker teal */
.wenc .wenc-builds-link {
	/* The texture's rounded ends keep their shape (border-image) however wide the button is */
	display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 4px 6px 8px; border-radius: 0; background: none;
	border-style: solid; border-width: 0 20px; border-image: url(../kuxaan/button.webp) 0 36 fill / 0 20px stretch; color: #fff;
	font-size: 14px; font-weight: 700; letter-spacing: .08em;
	text-shadow: 1.5px 0 0 #1f8c83, -1.5px 0 0 #1f8c83, 0 1.5px 0 #1f8c83, 0 -1.5px 0 #1f8c83, 1px 1px 0 #1f8c83, -1px 1px 0 #1f8c83, 1px -1px 0 #1f8c83, -1px -1px 0 #1f8c83, 0 2.5px 0 #1a7a72;
	transition: transform .2s var(--kx-bounce), filter .15s;
}
.wenc .wenc-builds-link[disabled] { display: none; }
.wenc .wenc-builds-link:hover { color: #fff; filter: brightness(1.08) saturate(1.1); transform: translateY(-2px); }
.wenc .wenc-builds-stats .wenc-builds-link { margin-top: 6px; }
.wenc .wenc-builds-actions { align-items: center; justify-content: center; gap: 10px 16px; margin-top: 4px; }
.wenc .wenc-builds-actions [data-action="new"] { padding: 4px 22px 6px; border: 0; border-image: none; background: var(--kx-paper); border-radius: 999px; color: var(--kx-ink); text-shadow: none; box-shadow: inset 0 0 0 2px var(--kx-line), 0 3px 0 rgba(94, 70, 49, .22); }
.wenc .wenc-builds-cond { border-image-source: url(../kuxaan/popup.webp); border-image-slice: 70 fill; border-width: 20px; padding: 6px 12px 10px; }
.wenc .wenc-builds-cond b { color: var(--kx-up); }
/* Upgrade boxes: the Kuxaan's paper with its brushstroke */
.wenc .wenc-builds-box { padding: 2px 14px 14px; margin-bottom: 14px; }
.wenc .wenc-builds-box > .wenc-builds-heading { margin: 0 0 14px -18px !important; font-size: 14.5px !important; padding: 8px 0 9px 4px !important; }
.wenc .wenc-builds-slots { gap: 14px 12px; min-height: 104px; }
.wenc .wenc-builds-add > span { position: relative; width: 84px; height: 92px; filter: drop-shadow(0 3px 0 rgba(94, 70, 49, .2)); transition: transform .22s var(--kx-bounce), filter .15s; }
.wenc .wenc-builds-add > span::after {
	content: "+"; position: absolute; left: 50%; top: 50%; translate: -50% -50%; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; padding-bottom: 3px; box-sizing: border-box;
	background: radial-gradient(circle at 40% 32%, #8ff5e7, #2fb7aa 55%, #178a80); color: #fff; font-size: 28px; line-height: 1; text-shadow: 0 1px 1px rgba(10, 70, 64, .6);
	box-shadow: 0 0 0 3px #fff6dc, 0 3px 0 3px rgba(94, 70, 49, .3);
}
.wenc .wenc-builds-add:hover > span { filter: drop-shadow(0 3px 0 rgba(94, 70, 49, .2)) drop-shadow(0 0 10px rgba(255, 210, 80, .9)); transform: scale(1.05); }
.wenc .wenc-builds-plant img { border-radius: 16px; box-shadow: 0 0 0 3px #f8ecc8, 0 0 0 5px rgba(143, 109, 76, .4), 0 3px 0 5px rgba(94, 70, 49, .15); }
.wenc .wenc-builds-badge { background: #5a3f28; padding: 2px 10px 3px; box-shadow: inset 0 0 0 1.5px rgba(255, 246, 220, .2); }
.wenc .wenc-builds-tool > img { filter: drop-shadow(0 3px 0 rgba(94, 70, 49, .25)); }
.wenc .wenc-builds-tool-name { color: var(--kx-ink); }

/* Reward cards with their real rarity frame (Common grey, Uncommon green, Rare cyan, Epic purple, Legendary gold) */
.wenc .wenc-builds-card::after { filter: none !important; }
.wenc .wenc-builds-card.is-r0::after { background-image: url(../kuxaan/frame-0.webp); }
.wenc .wenc-builds-card.is-r1::after { background-image: url(../kuxaan/frame-1.webp); }
.wenc .wenc-builds-card.is-r2::after { background-image: url(../kuxaan/frame-2.webp); }
.wenc .wenc-builds-card.is-r3::after { background-image: url(../kuxaan/frame-3.webp); }
.wenc .wenc-builds-card.is-r4::after { background-image: url(../kuxaan/frame-4.webp); }
.wenc .wenc-builds-card.is-r5::after { background-image: url(../kuxaan/frame-5.webp); }
/* Mythic: the game's frame is red and does not stand out on the red card; a soft halo in the Spring's colours around
   the silhouette (like T_Card_Rarity_Glow) shows the rarity without recolouring the frame */
.wenc .wenc-builds-card.is-r5 {
	filter: drop-shadow(-2px -2px 2.5px rgba(255, 207, 74, .95)) drop-shadow(2px -2px 2.5px rgba(143, 227, 106, .9)) drop-shadow(2px 2px 2.5px rgba(79, 211, 224, .9))
		drop-shadow(-2px 2px 2.5px rgba(160, 128, 245, .9)) drop-shadow(0 6px 8px rgba(40, 24, 10, .3));
}
.wenc .wenc-builds-cardslot { width: 100px; }
/* The card's name, legible, in its pill under the card (on the card's ribbon it is 5-7px tall) */
.wenc .wenc-builds-cardslot::after {
	content: attr(title); display: block; max-width: 100%; box-sizing: border-box; margin-top: 2px; padding: 2px 8px 3px; border-radius: 999px;
	background: rgba(255, 248, 225, .78); box-shadow: inset 0 0 0 1.5px var(--kx-line); color: var(--kx-ink);
	font-size: 11.5px; font-weight: 700; line-height: 1.15; text-align: center; overflow-wrap: anywhere;
}
.wenc .wenc-builds-cardslot:hover .wenc-builds-card { filter: drop-shadow(0 6px 10px rgba(40, 24, 10, .35)) drop-shadow(0 0 10px rgba(255, 214, 90, .8)); }

/* Hântu cards (T_Hantu_Card_Front without the empty plate): biome icon, level in orange in its circle, name on the ribbon */
.wenc .wenc-builds-hantu,
.wenc .wenc-builds-plant-head:has(> .wenc-builds-hex.is-big) {
	position: relative; display: block; width: 96px; height: auto; aspect-ratio: 370 / 606; padding: 0; border: 0; border-radius: 0; box-shadow: none;
	background: url(../kuxaan/hcard-plain.webp) center / 100% 100% no-repeat; color: #fff7c2; filter: drop-shadow(0 5px 5px rgba(40, 24, 10, .35));
	container-type: inline-size;
}
.wenc .wenc-builds-hantu .wenc-builds-hex,
.wenc .wenc-builds-plant-head > .wenc-builds-hex.is-big {
	position: absolute; left: 12%; right: 12%; top: 15%; width: auto; height: auto; aspect-ratio: 1 / 1.1; background: none; filter: none;
}
.wenc .wenc-builds-hantu .wenc-builds-hex img,
.wenc .wenc-builds-plant-head > .wenc-builds-hex.is-big img { width: 100% !important; height: 100% !important; object-fit: contain; border-radius: 0 !important; filter: drop-shadow(0 3px 3px rgba(0, 0, 0, .35)); }
.wenc .wenc-builds-hantu .wenc-builds-level {
	top: 4.8%; right: 7.4%; width: 20.5%; min-width: 0; height: auto; aspect-ratio: 1; padding: 0; background: none; box-shadow: none;
	color: #ff8d1c; font-size: 16cqw; font-weight: 700; line-height: 1; text-shadow: 0 1px 0 rgba(30, 10, 0, .65), 0 0 6px rgba(255, 141, 28, .45);
}
.wenc .wenc-builds-hantu::before,
.wenc .wenc-builds-plant-head:has(> .wenc-builds-hex.is-big)::before {
	content: ""; position: absolute; left: 7.4%; top: 4.8%; width: 20.5%; aspect-ratio: 1; border-radius: 50%; background: var(--kx-ticon, none) center / 86% no-repeat;
}
.wenc .wenc-builds-hantu::after,
.wenc .wenc-builds-plant-head:has(> .wenc-builds-hex.is-big)::after {
	content: attr(data-name); position: absolute; left: 15%; right: 15%; top: 74.4%; translate: 0 -50%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
	color: #fff7c2; font-size: 11.5cqw; font-weight: 700; letter-spacing: .04em; text-align: center; text-transform: uppercase; text-shadow: 0 1px 0 rgba(90, 45, 10, .85), 0 0 4px rgba(90, 45, 10, .5);
}
.wenc .wenc-builds-hantu:hover, .wenc .wenc-builds-hantu:focus-visible { filter: drop-shadow(0 5px 5px rgba(40, 24, 10, .35)) drop-shadow(0 0 10px rgba(255, 210, 80, .85)); }
/* The team picked from a save game: the chosen cards glow gold around their silhouette, like the picker's */
.wenc .wenc-builds-import-team { gap: 12px; }
.wenc .wenc-builds-import-team .wenc-builds-hantu.is-chosen { box-shadow: none; border-radius: 0; filter: drop-shadow(0 0 3px #fff2a0) drop-shadow(0 0 10px #ffc21f); }

/* Skill tree: the night sky framed like a page of the book, the game's teal controls */
.wenc .wenc-builds-treebox { margin-top: 38px; }
.wenc .wenc-tree-viewport {
	border-radius: 22px; box-shadow: 0 0 0 7px #ecdaa6, 0 0 0 9px #cdb07a, 0 18px 30px -8px rgba(30, 20, 10, .4), inset 0 0 0 2px rgba(112, 238, 255, .35), inset 0 0 90px rgba(0, 0, 0, .6);
}
.wenc .wenc-tree > .wenc-note { margin-top: 30px; text-align: center; }
.wenc .wenc-builds-treebox + .wenc-note { margin-top: 22px; text-align: center; }
.wenc .wenc-tree-controls { top: 16px; right: 16px; gap: 8px; }
.wenc .wenc-tree-controls button {
	width: 42px; height: 42px; border: 2px solid #9ff6ea; border-radius: 13px; background: linear-gradient(180deg, #34c3b5, #157a71); color: #fff;
	text-shadow: 0 1px 1px rgba(5, 50, 45, .7); box-shadow: 0 3px 0 #11665f, 0 0 12px rgba(112, 238, 225, .35); transition: transform .2s var(--kx-bounce), filter .15s;
}
.wenc .wenc-tree-controls button:hover { color: #fff; border-color: #fff; filter: brightness(1.12); transform: translateY(-2px); }
.wenc .wenc-tip.wenc-tip-sky { border-color: #2fb7aa; box-shadow: 0 0 0 2px rgba(112, 238, 255, .25), 0 0 24px rgba(47, 183, 170, .35), 0 12px 28px rgba(0, 0, 0, .55); }
.wenc .wenc-builds-budget > .wenc-builds-heading { color: var(--kx-ink) !important; letter-spacing: .08em; }
.wenc .wenc-builds-budget-list { gap: 10px 14px; }
.wenc .wenc-builds-cur {
	gap: 8px; padding: 5px 14px 5px 6px; background: linear-gradient(180deg, #5f4630, #48331f); color: #fff6dc; font-size: 14px;
	box-shadow: inset 0 2px 0 rgba(255, 225, 170, .16), 0 3px 0 rgba(58, 38, 22, .3);
}
.wenc .wenc-builds-cur .wenc-inline-icon { width: 30px; height: 30px; }
.wenc .wenc-builds-cur input { width: 86px; height: 30px; border: 0; border-radius: 9px; background: #fbf2d6; color: var(--kx-ink); box-shadow: inset 0 2px 3px rgba(94, 70, 49, .35); text-align: center; }
.wenc .wenc-builds-cur small { color: rgba(255, 246, 220, .76); font-size: 12.5px; }
.wenc .wenc-builds-cur small.is-over { color: #ffb36b; }

/* ── Builds popups: Stats Details paper, the banner on the strip, the game's buttons and cards that glow ─────────── */
.wenc .wenc-builds-dialog::backdrop { background: radial-gradient(70% 70% at 50% 45%, rgba(30, 22, 14, .55), rgba(14, 10, 6, .78)); }
.wenc .wenc-builds-dialog:focus, .wenc .wenc-builds-dialog:focus-visible { outline: none; }
/* Keyboard focus in Builds (and where it lands again when a popup closes) follows each control's own shape: the
   game's buttons are textures and a box would not fit them, so a golden glow goes round the silhouette instead */
.wenc .wenc-builds :is(button, a, .wenc-hex):focus-visible { outline: none; filter: drop-shadow(0 0 1.5px #fff6dc) drop-shadow(0 0 5px rgba(246, 184, 0, .95)); }
.wenc .wenc-builds input:focus-visible { outline: 2px solid var(--kx-gold); outline-offset: 1px; }
.wenc .wenc-builds-close {
	top: -86px; right: -40px; width: 44px; height: 44px; border: 3px solid #f6c445; background: radial-gradient(circle at 40% 32%, #a07a52, #7a5634); color: #fff6dc;
	font-size: 26px; font-weight: 700; padding-bottom: 3px; box-shadow: 0 3px 0 rgba(94, 70, 49, .4); transition: transform .2s var(--kx-bounce), filter .15s;
}
.wenc .wenc-builds-close:hover { transform: rotate(90deg) scale(1.06); filter: brightness(1.12); }
.wenc .wenc-builds-dialog-foot { border-top: 0; padding-top: 14px; }
.wenc .wenc-builds-dialog-foot::before { content: ""; position: absolute; top: 0; left: 2%; right: 2%; height: 2px; background: linear-gradient(90deg, transparent, var(--kx-line) 15% 85%, transparent); }
.wenc .wenc-builds-accept {
	/* A long label ("Guardar en mis builds") may take two lines: the button grows instead of spilling out */
	/* The game's pill in three pieces: round ends at their own proportions (the texture's 64 px of 128 per end, at 27 px
	   for this height), the middle stretching with the label's width, in any language */
	min-width: 160px; height: auto; min-height: 54px; padding: 6px 6px 12px; line-height: 1.1; border-style: solid; border-width: 0 27px; border-radius: 0;
	border-image: url(../kuxaan/btn-green.webp) 0 64 fill / 0 27px stretch; background: none;
	color: #fff; font-size: 17px; letter-spacing: .08em; text-shadow: 0 2px 0 rgba(60, 100, 10, .6); transition: transform .2s var(--kx-bounce), filter .15s;
}
.wenc .wenc-builds-accept:not([disabled]):hover { border-image-source: url(../kuxaan/btn-green-hover.webp); transform: translateY(-2px); }
/* Next to a label (My builds: the build on screen) the button keeps its label on one line; where it does not fit, it
   goes under the label, the whole width */
.wenc .wenc-builds-saved-top .wenc-builds-accept { flex: 0 0 auto; white-space: nowrap; }
/* Discord: the build copied, what to do with it, and the countdown to the channel */
.wenc .wenc-builds-discord-text { margin: 0 !important; font-size: 17px; font-weight: 600; color: var(--kx-ink, var(--k-ink-dark)); text-align: center; }
.wenc .wenc-builds-discord-text .wenc-builds-share-url { margin-top: 10px; background: #fbf2d6; color: var(--kx-ink, var(--k-ink-dark)); font-size: 14px; box-shadow: inset 0 2px 3px rgba(94, 70, 49, .3); }
.wenc .wenc-builds-discord-count { margin: 0 !important; min-height: 1.3em; font-size: 15px; font-weight: 700; color: #3f8a1e; text-align: center; }
@media (max-width: 640px) { .wenc .wenc-builds-saved-top .wenc-builds-accept { flex: 1 1 100%; white-space: normal; } }
.wenc .wenc-builds-accept[disabled] { border-image-source: url(../kuxaan/btn-green.webp); background: none; filter: grayscale(1) brightness(1.15) opacity(.6); text-shadow: 0 2px 0 rgba(0, 0, 0, .25); }
.wenc .wenc-builds-cancel {
	min-width: 130px; height: 46px; margin-bottom: 4px; background: var(--kx-paper); color: var(--kx-ink); letter-spacing: .06em;
	box-shadow: inset 0 0 0 2px var(--kx-line), 0 4px 0 rgba(94, 70, 49, .25); transition: transform .2s var(--kx-bounce), background .15s;
}
.wenc .wenc-builds-cancel:hover { background: #fff3cc; transform: translateY(-2px); }
.wenc .wenc-builds-remove { padding: 8px 24px 9px; background: var(--kx-leather); color: #fff6dc; letter-spacing: .08em; box-shadow: inset 0 1px 0 rgba(255, 225, 170, .3), 0 3px 0 rgba(58, 38, 22, .35); }
.wenc .wenc-builds-remove:hover { filter: brightness(1.12); }
/* Rarities as tabs in their colour (Mythic: the Spring's colours, like the halo of its cards; the frame stays red) */
.wenc .wenc-builds-rarities { gap: 8px; }
.wenc .wenc-builds-rarity {
	--rc: #9aa0a6; position: relative; padding: 7px 12px 10px; border: 0; border-radius: 12px; background: var(--kx-paper); color: var(--kx-ink); letter-spacing: .06em;
	box-shadow: inset 0 0 0 2px var(--kx-line), 0 2px 0 rgba(94, 70, 49, .2); transition: transform .2s var(--kx-bounce), background .15s;
}
.wenc .wenc-builds-rarity::after { content: ""; position: absolute; left: 6px; right: 6px; bottom: 3px; height: 4px; border-radius: 4px; background: var(--rcg, var(--rc)); }
.wenc .wenc-builds-rarity.is-r1 { --rc: #63c43c; }
.wenc .wenc-builds-rarity.is-r2 { --rc: #27bfe0; }
.wenc .wenc-builds-rarity.is-r3 { --rc: #8b3ff0; }
.wenc .wenc-builds-rarity.is-r4 { --rc: #f2b81f; }
.wenc .wenc-builds-rarity.is-r5 { --rc: #f2b81f; --rcg: linear-gradient(90deg, #ffcf4a, #8fe36a, #4fd3e0, #8b6cf0); }
.wenc .wenc-builds-rarity:hover { transform: translateY(-2px); }
.wenc .wenc-builds-rarity.is-active { background: #fffaf0; transform: translateY(-3px); box-shadow: 0 0 0 3px var(--rc), 0 0 14px color-mix(in srgb, var(--rc) 60%, transparent), 0 3px 0 rgba(94, 70, 49, .2); }
/* Room for the chosen card's glow, so it is not cut off against the banner or the edge */
.wenc .wenc-builds-scroll { padding: 14px 14px 18px 10px; }
/* The chosen card: a golden glow around its silhouette (like T_Card_Rarity_Glow), not a box */
.wenc .wenc-builds-pick-card.is-chosen, .wenc .wenc-builds-pick-item:has(> .wenc-builds-hex).is-chosen { box-shadow: none; }
.wenc .wenc-builds-pick-card.is-chosen .wenc-builds-card { filter: drop-shadow(0 0 3px #fff2a0) drop-shadow(0 0 10px #ffc21f) drop-shadow(0 0 18px rgba(255, 170, 20, .7)); }
.wenc .wenc-builds-pick-card:hover .wenc-builds-card { filter: drop-shadow(0 6px 10px rgba(40, 24, 10, .35)) drop-shadow(0 0 8px rgba(255, 214, 90, .7)); }
.wenc .wenc-builds-pick-card.is-chosen::after, .wenc .wenc-builds-pick-item.is-chosen::after {
	width: 30px; height: 30px; top: -8px; right: -8px; z-index: 7; background: radial-gradient(circle at 40% 32%, #b5f06a, #5aa323); border: 2.5px solid #fff6dc; font-size: 16px;
	box-shadow: 0 2px 0 rgba(30, 50, 5, .45), 0 0 0 1.5px #5aa323; text-shadow: 0 1px 0 rgba(30, 60, 5, .6);
}
.wenc .wenc-builds-pick-effect { padding: 4px 8px 5px; border-radius: 9px; background: rgba(255, 248, 225, .6); box-shadow: inset 0 0 0 1.5px var(--kx-line); color: var(--kx-ink); }
.wenc .wenc-builds-info { width: 28px; height: 28px; top: 0; left: 0; background: radial-gradient(circle at 40% 32%, #8ff5e7, #2fb7aa 55%, #157a71); border: 2px solid #fff6dc; font-size: 15px; line-height: 24px; box-shadow: 0 2px 0 rgba(10, 60, 55, .45); }
.wenc .wenc-builds-pick-wrap.is-info .wenc-builds-info { background: radial-gradient(circle at 40% 32%, #ffd98a, #f38416); }
.wenc .wenc-builds-pick-info { border-radius: 14px; background: linear-gradient(180deg, #17535a, #0f3b41); box-shadow: inset 0 0 0 3px #2fb7aa, inset 0 0 0 5px rgba(255, 246, 220, .25); }
.wenc .wenc-builds-pick > .wenc-builds-heading { display: flex; align-items: center; gap: 10px; color: var(--kx-ink) !important; letter-spacing: .08em; }
.wenc .wenc-builds-pick > .wenc-builds-heading::after { content: ""; flex: 1; height: 2px; background: linear-gradient(90deg, var(--kx-line), transparent); }
/* Plants and tools of the picker: inventory tiles */
.wenc .wenc-builds-pick-item:not(:has(> .wenc-builds-hex)) {
	padding: 12px 10px 12px; border-radius: 16px; background: var(--kx-paper); color: var(--kx-ink);
	box-shadow: inset 0 0 0 2px var(--kx-line), 0 3px 0 rgba(94, 70, 49, .2); transition: transform .2s var(--kx-bounce), box-shadow .15s;
}
.wenc .wenc-builds-pick-item:not(:has(> .wenc-builds-hex)):hover { transform: translateY(-3px); box-shadow: 0 0 0 3px var(--kx-gold), 0 0 14px rgba(246, 184, 0, .45); }
.wenc .wenc-builds-pick-item:not(:has(> .wenc-builds-hex)).is-chosen { background: #fffaf0; box-shadow: 0 0 0 3px var(--kx-gold), 0 0 18px rgba(246, 184, 0, .6); }
.wenc .wenc-builds-pick-item:not(:has(> .wenc-builds-hex)) > img { width: 76px; height: 76px; border-radius: 14px; box-shadow: 0 0 0 3px #f8ecc8, 0 0 0 5px rgba(143, 109, 76, .35); }
.wenc .wenc-builds-pick-item.is-tool > img { box-shadow: none; }
/* Hântu of the picker: the whole card (level in its circle, name on the ribbon) and its passive effect under it, legible */
.wenc .wenc-builds-pick-grid:has(.wenc-builds-hex) { grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 22px 18px; }
.wenc .wenc-builds-pick-item:has(> .wenc-builds-hex) {
	position: relative; display: block; width: 100%; padding: 163.8% 0 0; border: 0; border-radius: 0; background: none; box-shadow: none; color: var(--kx-ink);
	container-type: inline-size; transition: transform .2s var(--kx-bounce);
}
.wenc .wenc-builds-pick-item:has(> .wenc-builds-hex)::before {
	content: ""; position: absolute; left: -1.89%; top: -1.89cqw; width: 103.78%; aspect-ratio: 384 / 620; pointer-events: none;
	background: var(--kx-ticon, none) 12.5% 7.5% / 17% auto no-repeat, url(../kuxaan/hcard-plain.webp) center / 96.35% 97.74% no-repeat;
	filter: drop-shadow(0 5px 5px rgba(40, 24, 10, .35)); transition: filter .2s;
}
.wenc .wenc-builds-pick-item:has(> .wenc-builds-hex):hover { transform: translateY(-4px); }
.wenc .wenc-builds-pick-item:has(> .wenc-builds-hex):hover::before { filter: drop-shadow(0 5px 5px rgba(40, 24, 10, .35)) drop-shadow(0 0 8px rgba(255, 214, 90, .75)); }
.wenc .wenc-builds-pick-item:has(> .wenc-builds-hex).is-chosen::before {
	background: url(../kuxaan/hcard-on.webp) center / 100% 100% no-repeat, var(--kx-ticon, none) 12.5% 7.5% / 17% auto no-repeat, url(../kuxaan/hcard-plain.webp) center / 96.35% 97.74% no-repeat;
	filter: drop-shadow(0 0 10px rgba(255, 190, 40, .75));
}
.wenc .wenc-builds-pick-item > .wenc-builds-hex { position: absolute; left: 12%; right: 12%; top: 24.6cqw; width: auto; height: auto; aspect-ratio: 1 / 1.1; background: none; filter: none; }
.wenc .wenc-builds-pick-item > .wenc-builds-hex img { width: 100% !important; height: 100% !important; object-fit: contain; border-radius: 0 !important; filter: drop-shadow(0 3px 3px rgba(0, 0, 0, .35)); }
.wenc .wenc-builds-pick-item:has(> .wenc-builds-hex) .wenc-builds-pick-name {
	position: absolute; left: 15%; right: 15%; top: 121.9cqw; translate: 0 -50%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
	color: #fff7c2; font-size: 11.5cqw; letter-spacing: .04em; text-shadow: 0 1px 0 rgba(90, 45, 10, .85), 0 0 4px rgba(90, 45, 10, .5);
}
.wenc .wenc-builds-pick-item:has(> .wenc-builds-hex) .wenc-builds-level {
	position: absolute; left: auto; right: 7.4%; top: 7.86cqw; width: 20.5%; min-width: 0; height: auto; aspect-ratio: 1; padding: 0; display: grid; place-items: center;
	background: none; box-shadow: none; color: #ff8d1c; font-size: 15cqw; font-weight: 700; line-height: 1; text-shadow: 0 1px 0 rgba(30, 10, 0, .65), 0 0 6px rgba(255, 141, 28, .45);
}
.wenc .wenc-builds-pick-item:has(> .wenc-builds-hex) .wenc-builds-pick-desc {
	display: block; margin-top: 8px; padding: 4px 6px 5px; border-radius: 9px; background: rgba(255, 248, 225, .7); box-shadow: inset 0 0 0 1.5px var(--kx-line);
	color: var(--kx-ink); font-size: 12.5px; font-weight: 700; line-height: 1.2; text-align: center;
}
.wenc .wenc-builds-pick-item:has(> .wenc-builds-hex)::after { z-index: 7; }
/* A Hântu's panel: its big card, with the level the picker set in its circle, and reward light behind it */
.wenc .wenc-builds-plant-head:has(> .wenc-builds-hex.is-big) { width: 170px; margin: 0 auto 4px; }
.wenc .wenc-builds-plant-head > .wenc-builds-hex.is-big::after {
	content: attr(data-level); position: absolute; left: 92.6%; top: -7.4%; width: 27%; aspect-ratio: 1; translate: -50% -50%; display: grid; place-items: center;
	color: #ff8d1c; font-size: 16cqw; font-weight: 700; line-height: 1; text-shadow: 0 1px 0 rgba(30, 10, 0, .65), 0 0 6px rgba(255, 141, 28, .45);
}
.wenc .wenc-builds-dialog-body:has(> .wenc-builds-card-stage, > .wenc-builds-plant-head > .wenc-builds-hex.is-big) { position: relative; isolation: isolate; }
.wenc .wenc-builds-dialog-body:has(> .wenc-builds-card-stage, > .wenc-builds-plant-head > .wenc-builds-hex.is-big)::before {
	content: ""; position: absolute; z-index: -1; left: 50%; top: 0; width: 420px; max-width: 120%; aspect-ratio: 1; translate: -50% -14%; pointer-events: none;
	background: radial-gradient(closest-side, rgba(255, 240, 170, .95), rgba(255, 214, 90, .5) 36%, rgba(255, 214, 90, 0) 70%),
		repeating-conic-gradient(from 0deg, rgba(255, 200, 70, .4) 0 8deg, rgba(255, 200, 70, 0) 8deg 20deg);
	-webkit-mask: radial-gradient(closest-side, #000 50%, transparent); mask: radial-gradient(closest-side, #000 50%, transparent);
}
.wenc .wenc-builds-dialog-body > .wenc-builds-link { align-self: center; }
/* Stats Details */
.wenc .wenc-builds-group .wenc-builds-group-icon { filter: drop-shadow(0 3px 0 rgba(94, 70, 49, .25)); }
.wenc .wenc-builds-group .wenc-builds-rows li { height: auto; min-height: 32px; padding: 0; font-size: 14px; color: var(--kx-ink); }
.wenc .wenc-builds-group .wenc-builds-rows li span { max-width: none; padding: 4px 0 4px 12px; }
.wenc .wenc-builds-effects { background: var(--kx-paper); box-shadow: inset 0 0 0 2px var(--kx-line); }
.wenc .wenc-builds-stepper button { background: radial-gradient(circle at 40% 32%, #b5f06a, #6cb82c 60%, #4f9220); box-shadow: 0 3px 0 rgba(40, 70, 10, .45); border: 2px solid #fff6dc; }
.wenc .wenc-builds-stepper button[disabled] { background: var(--kx-paper); box-shadow: inset 0 0 0 2px var(--kx-line); border-color: transparent; color: var(--kx-ink3); }
.wenc .wenc-builds-stepper span { box-shadow: inset 0 0 0 2px rgba(60, 100, 10, .35), 0 2px 0 rgba(60, 100, 10, .3); text-shadow: 0 1px 0 rgba(40, 70, 10, .5); }

/* ── Motion (none of it with the landing's wl-static or "reduce motion") ────────────────────────────────────────── */
/* A new one-column page slides in a little; between spreads the leaf turns over the spine (wenc.js). */
@keyframes wenc-page-in { from { opacity: 0; translate: 0 12px; } }
@keyframes wenc-tab-in { 0% { translate: 0 10px; } 100% { translate: 0 0; } }
html:not(.wl-static) .wenc .wenc-page.wenc-page-enter > * { animation: wenc-page-in .45s cubic-bezier(.2, .8, .2, 1) both; }
html:not(.wl-static) .wenc .wenc-tab.is-active { animation: wenc-tab-in .45s var(--kx-bounce) both; }
/* The popups' paper unfolds as they open */
@keyframes wenc-unfold { from { opacity: 0; transform: perspective(1200px) translateY(18px) rotateX(10deg) scale(.95); } }
html:not(.wl-static) .wenc .wenc-builds-dialog[open] { animation: wenc-unfold .42s cubic-bezier(.2, .9, .3, 1.15) both; }
/* The reward light turns slowly */
@keyframes wenc-spin { to { rotate: 360deg; } }
html:not(.wl-static) .wenc .wenc-builds-dialog-body:has(> .wenc-builds-card-stage, > .wenc-builds-plant-head > .wenc-builds-hex.is-big)::before { animation: wenc-spin 40s linear infinite; }
/* The turning leaf: front = the old page, back = the new one, both on paper. While the new page sets itself up
   (Builds, map), the old one stays whole on top (wenc-page-hold). */
.wenc .wenc-page.wenc-page-hold { clip-path: inset(0 0 0 100%); }
.wenc .wenc-page.wenc-page-turning { clip-path: inset(-60px -60px -60px 50%); }
.wenc .wenc-page.wenc-page-turning.is-back { clip-path: inset(-60px 50% -60px -60px); }
.wenc-turn-under, .wenc-turn-leaf { position: absolute; z-index: 4; pointer-events: none; }
.wenc-turn-under { overflow: hidden; }
.wenc-turn-leaf { transform-style: preserve-3d; transform-origin: 0 50%; animation: wenc-leaf .72s cubic-bezier(.45, .05, .3, 1) both; }
.wenc-turn-leaf.is-back { transform-origin: 100% 50%; animation-name: wenc-leaf-back; }
@keyframes wenc-leaf { from { transform: perspective(2400px) rotateY(0deg); } to { transform: perspective(2400px) rotateY(-180deg); } }
@keyframes wenc-leaf-back { from { transform: perspective(2400px) rotateY(0deg); } to { transform: perspective(2400px) rotateY(180deg); } }
.wenc-turn-face {
	--sp: 90deg; position: absolute; inset: 0; overflow: hidden; backface-visibility: hidden; -webkit-backface-visibility: hidden;
	background: none; box-shadow: 0 0 22px rgba(60, 40, 20, .25);
}
.wenc-turn-face.sp-r { --sp: 270deg; }
/* The leaf's paper is T_Page_base (page.webp): the spread's right page (spine on the left, sp-l) or its left page
   (sp-r), with its uneven edge in proportion and the spine's shadow on the side it touches */
.wenc-turn-face::before {
	content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; border-style: solid;
	border-width: 30px 30px 30px 0; border-image: url(../kuxaan/page.webp) 60 60 60 721 fill / 30px 30px 30px 0 stretch;
}
.wenc-turn-face.sp-r::before { border-width: 30px 0 30px 30px; border-image: url(../kuxaan/page.webp) 60 721 60 60 fill / 30px 0 30px 30px stretch; }
.wenc-turn-clone { z-index: 1; }
.wenc-turn-face.is-back { transform: rotateY(180deg); }
.wenc-turn-face::after {
	content: ""; position: absolute; inset: 0; z-index: 5; pointer-events: none; background: linear-gradient(var(--sp), rgba(94, 70, 49, .4), rgba(94, 70, 49, .08) 45%, rgba(255, 250, 230, .12));
	animation: wenc-leaf-shade .72s cubic-bezier(.45, .05, .3, 1) both;
}
@keyframes wenc-leaf-shade { 0% { opacity: 0; } 45% { opacity: 1; } 100% { opacity: 0; } }
.wenc-turn-clone { position: absolute; top: 0; margin: 0 !important; }
@media (prefers-reduced-motion: reduce) {
	.wenc .wenc-page > *, .wenc .wenc-tab.is-active, .wenc .wenc-builds-dialog[open],
	.wenc .wenc-builds-dialog-body::before { animation: none !important; }
	.wenc-aura i { animation: none !important; }
}
html.wl-static .wenc-aura i { animation: none; }

/* ── Up to 1100px the map's legend goes under the map (inside, it would cover the west island) ───────────────── */
@media (max-width: 1100px) {
	.wenc .wenc-map-legend { position: static; flex-direction: row; flex-wrap: wrap; justify-content: center; min-width: 0; margin-top: 26px !important; border: 0; border-image: none; padding: 0; filter: none; }
	.wenc .wenc-map-legend::before { content: none; }
}
@media (max-width: 900px) {
	.wenc .wenc-spread::after { display: none; }
}
@container wencpage (max-width: 760px) {
	.wenc .wenc-spread::after { display: none; }
}
@container wencpage (max-width: 520px) {
	.wenc .wenc-builds-abi-row { grid-template-columns: 1fr; }
}

/* ── Phones ─────────────────────────────────────────────────────────────────────────────────────────────────────── */
@media (max-width: 640px) {
	.wenc-aura { inset: -40px -10px -20px; left: max(-10px, calc(50% - 50vw + 8px)); right: max(-10px, calc(50% - 50vw + 8px)); }
	.wenc:not(.is-loading) .wenc-page:has(> .wenc-list-vlugkin, > .wenc-vlugkin)::before { inset: -6px -12px -22px; border-width: 30px 28px 34px; border-image-width: 30px 28px 34px; }
	.wenc .wenc-list-title,
	.wenc .wenc-home-title { height: 48px; margin-bottom: 18px !important; border-width: 0 38px; border-image-width: 0 38px; font-size: 19px !important; letter-spacing: .05em !important; }
	.wenc .wenc-home-title { margin-top: 0 !important; border-width: 0 31px; border-image-width: 0 31px; }
	.wenc .wenc-list-vlugkin > .wenc-list-title { height: 70px; padding-bottom: 20px; margin-bottom: 4px !important; }
	.wenc .wenc-builds-banner { min-height: 48px; padding: 0 6px 4px; border-width: 0 31px; border-image-width: 0 31px; }
	.wenc .wenc-builds-banner span { font-size: 19px !important; }
	.wenc .wenc-h1 { font-size: 30px !important; }
	.wenc .wenc-entry .wenc-h2, .wenc .wenc-traits > .wenc-h2, .wenc .wenc-builds-treebox > .wenc-h2 { font-size: 15.5px !important; border-right-width: 70px; border-image-width: 0 70px 0 16px; }
	.wenc .wenc-entry .wenc-box > .wenc-h2 { border-width: 0; font-size: 16.5px !important; }
	.wenc .wenc-crumbs { margin-top: -6px; }
	.wenc .wenc-home { gap: 22px; }
	.wenc .wenc-home-text { font-size: 16px; }
	.wenc .wenc-home-hantu { border-width: 16px; border-image-width: 16px; padding: 0 2px 4px; }
	.wenc .wenc-home-hantu-head { margin: -30px -20px 6px; padding: 11px 16px 20px; }
	.wenc .wenc-home-hantu-head h3 { font-size: 17px; gap: 8px; }
	.wenc .wenc-home-hantu-head h3 span { font-size: 11px; padding: 2px 8px 3px; }
	.wenc .wenc-home-open { height: 34px; padding: 0 8px 3px; font-size: 12px; border-width: 0 14px; border-image-width: 0 14px; }
	.wenc .wenc-home-hantu-row { gap: 2px; padding: 22px 4px 10px; border-radius: 12px; }
	.wenc .wenc-home-hantu-row img { height: 62px; }
	.wenc .wenc-home-ground { height: 12px; margin-top: -7px; }
	.wenc .wenc-home-hantu-name { font-size: 10px; padding: 2px 6px 3px; margin-top: 5px; letter-spacing: .02em; }
	.wenc .wenc-home-hantu > p { font-size: 14px; }
	.wenc .wenc-home-cards, .wenc .wenc-items { grid-template-columns: 1fr; gap: 10px; }
	.wenc .wenc-home-card, .wenc .wenc-item > a { min-height: 84px; padding: 9px 36px 9px 9px; gap: 12px; }
	.wenc .wenc-home-card::after, .wenc .wenc-item > a::after { right: 12px; }
	.wenc .wenc-home-card-art, .wenc .wenc-item-icon { width: 62px; height: 62px; border-radius: 13px; }
	.wenc .wenc-home-card-art img { max-width: 48px !important; max-height: 48px !important; }
	.wenc .wenc-home-card-art.is-cover img { width: 52px !important; height: 52px !important; }
	.wenc .wenc-home-card strong, .wenc .wenc-item-name { font-size: 16px; }
	.wenc .wenc-typetabs { padding: 0 6px; gap: 3px; }
	.wenc .wenc-typetab { width: 44px; height: 50px; }
	.wenc .wenc-typetab:hover { height: 54px; }
	.wenc .wenc-typetab.is-active { height: 60px; }
	.wenc .wenc-typetab.wenc-typetab-all { min-width: 50px; padding: 12px 8px 0; font-size: 12px; }
	/* All the type tabs on one row: they share the width up to their own size */
	.wenc .wenc-typetab:not(.wenc-typetab-all) { flex: 1 1 0; width: auto; min-width: 26px; max-width: 44px; }
	/* A skill's stat bars use the whole width, under its icon too: the names stay readable */
	.wenc .wenc-skill > div > .wenc-stat-head, .wenc .wenc-skill > div > .wenc-stats { margin-left: -76px !important; }
	.wenc .wenc-entry .wenc-h2 { letter-spacing: .04em; }
	.wenc .wenc-search { min-width: 0; margin: 4px 0 10px; }
	.wenc .wenc-typebox-head { padding: 12px 18px 22px; font-size: 18px; }
	.wenc .wenc-typebox-body { padding: 18px 6px 12px; }
	.wenc .wenc-typebox .wenc-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 4px; }
	.wenc .wenc-hexslot { width: 92px; height: 100px; }
	.wenc .wenc-hexslot img { width: 84px; height: 84px; }
	.wenc .wenc-hexslot::before { width: 70px; height: 16px; }
	.wenc .wenc-card-name { font-size: 13px; padding: 2px 9px 3px; }
	.wenc .wenc-list-vlugkin .wenc-grid { gap: 18px 14px; }
	.wenc .wenc-list-vlugkin .wenc-card { width: 118px; }
	.wenc .wenc-squareslot { width: 104px; height: 104px; }
	.wenc .wenc-squareslot img { width: 98px; height: 98px; border-radius: 16px; }
	.wenc .wenc-skill { grid-template-columns: 64px 1fr; gap: 12px; }
	.wenc .wenc-skill-icon { width: 64px; height: 64px; }
	.wenc .wenc-skill + .wenc-skill::before { left: 29px; }
	.wenc .wenc-level { padding: 8px 12px 8px 8px; border-radius: 22px; gap: 8px 10px; }
	.wenc .wenc-level-range { flex-basis: 100%; order: 3; }
	.wenc .wenc-level .wenc-note { order: 4; }
	.wenc .wenc-entry .wenc-portrait { min-height: 240px; }
	.wenc .wenc-entry .wenc-portrait img { max-height: 250px; }
	.wenc .wenc-entry .wenc-rightpage > .wenc-journal:first-child,
	.wenc .wenc-plant .wenc-journal { border-width: 18px 20px 22px; border-image-width: 18px 20px 22px; rotate: 0deg; }
	.wenc .wenc-prevnext a { padding: 7px 12px 8px; font-size: 12.5px; }
	.wenc .wenc-map { height: min(62vh, 520px); box-shadow: 0 0 0 5px #ecdaa6, 0 0 0 7px #cdb07a, 0 12px 20px -8px rgba(46, 30, 15, .4); border-radius: 14px; }
	.wenc .wenc-tree-viewport { height: min(64vh, 540px); }
	.wenc .wenc-table td { padding: 7px 8px; }
	.wenc .wenc-table td:first-child { width: 64px; }
	.wenc .wenc-table td:first-child::before { width: 16px; height: 16px; margin-right: 5px; }
	.wenc .wenc-builds-box > .wenc-builds-heading { margin-left: -14px !important; }
	.wenc .wenc-builds-hantu { width: 84px; }
	.wenc .wenc-builds-cardslot { width: 92px; }
	.wenc .wenc-builds-add > span { width: 70px; height: 76px; }
	.wenc .wenc-builds-add > span::after { width: 30px; height: 30px; font-size: 24px; }
	.wenc .wenc-builds-close { top: 14px; right: 14px; width: 40px; height: 40px; }
	/* The game's popup paper (T_Popup_bg_01) as a border-image with thin edges: one paper, its torn edges in
	   proportion and everything (the footer too) inside it */
	.wenc .wenc-builds-dialog {
		padding: 12px 8px 8px; border-radius: 0; background: none;
		border-style: solid; border-width: 18px 20px 22px; border-image: url(../kuxaan/popup.webp) 70 fill / 18px 20px 22px stretch;
	}
	/* Both buttons track tighter and the accept pill (its ends take 44 px) gets a bit more of the row than Cancel, so
	   "Hinzufügen", "Сохранить" and "Abbrechen" keep each word whole on a phone */
	.wenc .wenc-builds-accept { flex-grow: 1.25; min-width: 0; min-height: 50px; padding: 6px 2px 11px; border-width: 0 22px; border-image-width: 0 22px; font-size: 15px; letter-spacing: .03em; }
	.wenc .wenc-builds-abi-row { grid-template-columns: 1fr; }
	/* The box's brushstroke takes the box's right padding too and a shorter tail: long names keep to one or two lines */
	.wenc .wenc-builds-box > .wenc-builds-heading,
	.wenc .wenc-builds-cond > .wenc-builds-heading { max-width: calc(100% + 28px); margin-right: -14px !important; border-right-width: 40px; border-image-width: 0 40px 0 16px; font-size: 14px !important; letter-spacing: .04em; }
	.wenc .wenc-builds-cancel { min-width: 0; padding-inline: 10px; font-size: 15px; letter-spacing: .03em; }
	.wenc .wenc-builds-share .wenc-builds-accept { white-space: normal; }
	.wenc .wenc-builds-pick-grid:has(.wenc-builds-hex) { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 10px; }
	.wenc .wenc-builds-pick-item:has(> .wenc-builds-hex) .wenc-builds-pick-desc { font-size: 11px; padding: 3px 4px 4px; }
	.wenc .wenc-builds-dialog-head { width: calc(100% - 58px); }
	.wenc .wenc-typebox[class*="wenc-type-"] .wenc-typebox-head span::before { width: 28px; height: 28px; }
	.wenc .wenc-builds-cur { flex-wrap: wrap; }
	.wenc .wenc-builds-abi { max-height: 220px; }
	.wenc .wenc-builds-summary .wenc-builds-rows li span { max-width: 62%; }
	.wenc .wenc-builds-dialog-body:has(> .wenc-builds-card-stage, > .wenc-builds-plant-head > .wenc-builds-hex.is-big)::before { width: 320px; }
}