/* Spiritvale Wiki — EVE-inspired front-end theme */

.sv-wiki-shell {
    --bg: #0a0c10;
    --panel: #12141b;
    --panel-2: #171a22;
    --ink: #e6edf3;
    --muted: #9aa4b2;
    --accent: #39d0ff;
    --accent-2: #00ffa8;
    --warn: #ffbe55;
    --red: #ff5555;
    --grid: #1f2430;
    --chip: #222635;
    --shadow: 0 10px 30px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.03);
    --radius: 14px;

    max-width: 1100px;
    margin: 0 auto;
    padding: 18px;
    color: var(--ink);
    font: 14px/1.5 Inter, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
    background: radial-gradient(1200px 600px at 70% -20%, rgba(57, 208, 255, 0.05), transparent 60%), var(--bg);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    position: relative;
    overflow: hidden;
}

.sv-wiki-shell::after {
    content: "";
    position: absolute;
    inset: -2px;
    background: radial-gradient(800px 400px at 110% 20%, rgba(0, 255, 168, 0.06), transparent 60%);
    pointer-events: none;
    filter: blur(2px);
}

.sv-wiki-shell > * {
    position: relative;
    z-index: 1;
}

/* Hide duplicate theme title when wiki card renders its own */
.sv-wiki-layout .entry-header,
.sv-wiki-layout .page-header,
.sv-wiki-layout article > header {
    display: none;
}

.sv-wiki-layout {
    max-width: none;
    margin: 0;
    padding: 1.5rem 1rem 2.5rem;
}

.sv-wiki-layout--home,
.sv-wiki-layout--build {
    padding: 1rem clamp(1rem, 3vw, 2.5rem) 2.5rem;
    width: 100%;
    max-width: none;
    box-sizing: border-box;
}

.sv-wiki {
    font-size: 14px;
    line-height: 1.55;
}

.sv-wiki h1,
.sv-wiki h2,
.sv-wiki h3 {
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* Holo header */
.sv-wiki__holo {
    display: grid;
    grid-template-columns: 120px 1fr;
    gap: 14px;
    align-items: center;
    padding: 14px 16px;
    margin-bottom: 16px;
    border: 1px solid #263042;
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(0, 255, 168, 0.06), rgba(57, 208, 255, 0.04));
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.02);
}

@media (max-width: 640px) {
    .sv-wiki__holo {
        grid-template-columns: 1fr;
        text-align: center;
    }
    .sv-wiki__icon-frame {
        margin: 0 auto;
    }
    .sv-wiki__chips {
        justify-content: center;
    }
}

.sv-wiki__icon-frame {
    width: 96px;
    height: 96px;
    background: linear-gradient(145deg, #12141b, #0a0c10);
    border: 2px solid var(--accent);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03), 0 0 18px rgba(57, 208, 255, 0.35), 0 6px 22px rgba(0, 0, 0, 0.5);
    position: relative;
}

.sv-wiki__icon-frame::after {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 30% 25%, rgba(57, 208, 255, 0.12), transparent 60%);
    pointer-events: none;
}

.sv-wiki__icon {
    width: 80px;
    height: 80px;
    object-fit: contain;
    border-radius: 6px;
    background: #0e1118;
    padding: 4px;
    image-rendering: crisp-edges;
    position: relative;
    z-index: 1;
}

.sv-wiki__icon--placeholder {
    display: block;
    background: #0e1118;
}

.sv-wiki__badge {
    display: inline-flex;
    gap: 6px;
    align-items: center;
    background: var(--chip);
    border: 1px solid #2a3144;
    color: #b8c0cc;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 6px;
}

.sv-wiki__title {
    margin: 0 0 6px;
    font-size: 22px;
    line-height: 1.2;
    color: #fff;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.sv-wiki__description {
    margin: 0 0 10px;
    color: var(--muted);
    font-size: 13px;
    text-transform: none;
    letter-spacing: 0;
    line-height: 1.5;
}

.sv-wiki__chips {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.sv-wiki__chip {
    display: inline-flex;
    align-items: center;
    background: var(--chip);
    border: 1px solid #2a3144;
    color: #b8c0cc;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 11px;
}

.sv-wiki__chip--id {
    background: rgba(57, 208, 255, 0.1);
    border-color: var(--accent);
    color: var(--accent);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}

.sv-wiki__chip--buff {
    background: #1a3a2a;
    border-color: var(--accent-2);
    color: var(--accent-2);
}

.sv-wiki__chip--debuff {
    background: rgba(255, 85, 85, 0.1);
    border-color: var(--red);
    color: var(--red);
}

.sv-wiki__chip--element {
    background: rgba(57, 208, 255, 0.08);
    border-color: #2a3144;
    color: #b8c0cc;
}

.sv-wiki__section-lede {
    margin: -4px 0 12px;
    color: var(--muted);
    font-size: 12.5px;
    line-height: 1.45;
    text-transform: none;
    letter-spacing: 0;
}

.sv-wiki__faint {
    color: var(--muted);
    font-size: 11.5px;
}

.sv-wiki__craft-qty {
    color: var(--accent-2);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.sv-wiki__notice {
    margin-top: 16px;
    padding: 12px 14px;
    border-radius: 10px;
    border: 1px solid rgba(255, 190, 85, 0.35);
    background: rgba(255, 190, 85, 0.06);
    color: var(--warn);
    font-size: 13px;
    line-height: 1.5;
}

/* Content body */
.sv-wiki__body {
    background: linear-gradient(180deg, var(--panel), var(--panel-2));
    border: 1px solid #202531;
    border-radius: var(--radius);
    padding: 16px;
}

.sv-wiki__section-title {
    margin: 0 0 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--grid);
    font-size: 13px;
    font-weight: 600;
    color: #fff;
}

.sv-wiki__section-title:not(:first-child) {
    margin-top: 20px;
}

.sv-wiki__table-wrap {
    margin-bottom: 12px;
    border: 1px solid #2a3144;
    border-radius: 10px;
    overflow: hidden;
    background: #0f131b;
}

.sv-wiki-shell .sv-wiki__table {
    width: 100%;
    max-width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    margin: 0;
    font-size: 13px;
    border: none;
}

.sv-wiki-shell .sv-wiki__table th,
.sv-wiki-shell .sv-wiki__table td {
    box-sizing: border-box;
    padding: 10px 12px;
    text-align: left;
    vertical-align: top;
    border: none;
    border-bottom: 1px solid #2a3144;
}

.sv-wiki-shell .sv-wiki__table tbody tr:hover {
    background: rgba(57, 208, 255, 0.04);
}

/* Overview fact panels */
.sv-wiki-overview {
    margin-bottom: 18px;
    padding: 14px 16px;
    border: 1px solid #263042;
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(21, 25, 36, 0.85), rgba(12, 14, 20, 0.92));
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.02);
}

.sv-wiki-overview .sv-wiki__section-title {
    margin-top: 0;
    margin-bottom: 12px;
}

.sv-wiki-overview__facts {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 10px;
}

.sv-wiki-overview__fact {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px solid #2a3144;
    background: rgba(10, 12, 18, 0.65);
    min-width: 0;
}

.sv-wiki-overview__fact--emphasis {
    border-color: rgba(57, 208, 255, 0.35);
    background: linear-gradient(145deg, rgba(57, 208, 255, 0.08), rgba(10, 12, 18, 0.75));
}

.sv-wiki-overview__fact--emphasis .sv-wiki-overview__fact-value {
    font-size: 22px;
    color: #7ae4ff;
}

.sv-wiki-overview__fact-label {
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--muted);
}

.sv-wiki-overview__fact-value {
    font-size: 15px;
    font-weight: 700;
    color: var(--ink);
    overflow-wrap: anywhere;
    word-break: break-word;
}

.sv-wiki-overview__fact-value a {
    font-weight: 700;
}

.sv-wiki-overview__traits {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #2a3144;
}

@media (max-width: 640px) {
    .sv-wiki-overview__facts {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Key/value overview tables (legacy fallback) */
.sv-wiki-shell .sv-wiki__table--overview {
    table-layout: fixed;
}

.sv-wiki-shell .sv-wiki__table--overview th,
.sv-wiki-shell .sv-wiki__table:not(.sv-wiki__table--stats):not(.sv-wiki__table--overview) th {
    color: var(--muted);
    font-weight: 600;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    width: 36%;
    max-width: 36%;
    min-width: 0;
    background: rgba(21, 25, 36, 0.65);
    border-right: 1px solid #2a3144;
    overflow-wrap: anywhere;
    word-break: break-word;
    hyphens: auto;
}

.sv-wiki-shell .sv-wiki__table--overview td,
.sv-wiki-shell .sv-wiki__table:not(.sv-wiki__table--stats):not(.sv-wiki__table--overview) td {
    color: var(--ink);
    background: transparent;
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.sv-wiki-shell .sv-wiki__table--overview tbody tr:last-child th,
.sv-wiki-shell .sv-wiki__table--overview tbody tr:last-child td {
    border-bottom: none;
}

/* Stats / data grid tables */
.sv-wiki-shell .sv-wiki__table--stats thead th {
    width: auto;
    color: var(--muted);
    font-weight: 600;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    background: linear-gradient(180deg, #151924, #121622);
    border-bottom: 1px solid #2a3144;
}

.sv-wiki-shell .sv-wiki__table--stats thead th + th {
    border-left: 1px solid #2a3144;
}

.sv-wiki-shell .sv-wiki__table--stats tbody td + td {
    border-left: 1px solid rgba(42, 49, 68, 0.65);
}

.sv-wiki__th-sortable {
    padding: 0;
    vertical-align: middle;
}

.sv-wiki__sort-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    padding: 8px 10px;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    font-size: inherit;
    font-weight: inherit;
    text-align: left;
    cursor: pointer;
    transition: color 0.15s ease, background 0.15s ease;
}

.sv-wiki__sort-btn:hover,
.sv-wiki__sort-btn:focus-visible {
    color: var(--accent);
    background: rgba(57, 208, 255, 0.06);
    outline: none;
}

.sv-wiki__sort-btn[data-sort-dir] {
    color: var(--accent);
}

.sv-wiki__sort-icon {
    opacity: 0.72;
    font-size: 11px;
}

.sv-wiki__sort-btn[data-sort-dir] .sv-wiki__sort-icon {
    opacity: 1;
    color: var(--accent);
}

/* Keep bottom line on last row */
.sv-wiki-shell .sv-wiki__table tbody tr:last-child th,
.sv-wiki-shell .sv-wiki__table tbody tr:last-child td {
    border-bottom: 1px solid #2a3144;
}

.sv-wiki__table a {
    color: var(--accent);
    text-decoration: none;
    font-weight: 600;
}

.sv-wiki__table a:hover {
    color: var(--accent-2);
    text-decoration: underline;
}

.sv-wiki__list {
    margin: 0 0 8px;
    padding: 10px 14px 10px 32px;
    background: #0f131b;
    border: 1px solid #1e2431;
    border-radius: 12px;
    list-style: none;
}

.sv-wiki__list li {
    padding: 6px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.03);
}

.sv-wiki__list li:last-child {
    border-bottom: none;
}

.sv-wiki__list a {
    color: var(--accent);
    text-decoration: none;
    font-weight: 600;
}

.sv-wiki__list a:hover {
    color: var(--accent-2);
    text-decoration: underline;
}

.sv-wiki__editor-content {
    margin-top: 16px;
    padding: 14px;
    background: #0f131b;
    border: 1px solid #1e2431;
    border-radius: 12px;
    color: var(--muted);
    font-size: 13px;
}

/* === Wiki app shell (sidebar + main) === */
.sv-wiki-app {
    --bg: #0a0c10;
    --panel: #12141b;
    --panel-2: #171a22;
    --ink: #e6edf3;
    --muted: #9aa4b2;
    --accent: #39d0ff;
    --accent-2: #00ffa8;
    --grid: #1f2430;
    --radius: 14px;

    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 16px;
    align-items: start;
    font: 14px/1.5 Inter, system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
    color: var(--ink);
}

/* Wiki home + build tool: no sidebar — must come after .sv-wiki-app grid or content sits in the 280px column */
.sv-wiki-app.sv-wiki-app--home,
.sv-wiki-app.sv-wiki-app--build {
    display: block;
    width: 100%;
    max-width: none;
    grid-template-columns: none;
}

.sv-wiki-app.sv-wiki-app--home > .sv-wiki-shell,
.sv-wiki-app.sv-wiki-app--build > .sv-build {
    max-width: none;
    width: 100%;
}

@media (max-width: 960px) {
    .sv-wiki-app {
        grid-template-columns: 1fr;
        display: block;
    }

    .sv-wiki-sidebar-backdrop {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 10030;
        background: rgba(0, 0, 0, 0.55);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        cursor: pointer;
        transition: opacity 0.22s ease, visibility 0.22s ease;
    }

    .sv-wiki-app.is-sidebar-open .sv-wiki-sidebar-backdrop {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }
}

@media (min-width: 961px) {
    .sv-wiki-sidebar-backdrop {
        display: none;
    }
}

body.sv-wiki-sidebar-locked {
    overflow: hidden;
}

.sv-wiki-main {
    min-width: 0;
}

.sv-wiki-mobile-bar {
    display: none;
    gap: 8px;
    align-items: center;
}

.sv-wiki-home-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border: 1px solid #1e2430;
    border-radius: 10px;
    background: linear-gradient(180deg, #151924, #121622);
    color: var(--ink);
    font: inherit;
    font-weight: 600;
    font-size: 13px;
    text-decoration: none;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.sv-wiki-home-link:hover {
    border-color: rgba(57, 208, 255, 0.45);
}

.sv-wiki-home-link.is-active {
    border-color: var(--accent);
    background: rgba(57, 208, 255, 0.08);
    pointer-events: none;
}

.sv-wiki-home-link .fa {
    color: var(--accent);
}

.sv-wiki-nav-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border: 1px solid #1e2430;
    border-radius: 10px;
    background: linear-gradient(180deg, #151924, #121622);
    color: var(--ink);
    font: inherit;
    font-weight: 600;
    font-size: 13px;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.sv-wiki-nav-toggle:hover {
    border-color: rgba(57, 208, 255, 0.45);
    background: linear-gradient(180deg, #1a2030, #141a28);
}

.sv-wiki-nav-toggle .fa {
    color: var(--accent);
}

@media (max-width: 960px) {
    .sv-wiki-mobile-bar {
        display: flex;
        margin-bottom: 14px;
    }

    .sv-wiki-home-link,
    .sv-wiki-nav-toggle {
        flex: 1;
        justify-content: center;
    }
}

.sv-wiki-sidebar__close {
    display: none;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 1px solid #1e2430;
    border-radius: 10px;
    background: #0e1118;
    color: var(--ink);
    cursor: pointer;
}

.sv-wiki-shell {
    margin: 0;
}

/* Sidebar */
.sv-wiki-sidebar {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    background: linear-gradient(180deg, var(--panel), var(--panel-2));
    border: 1px solid #202531;
    border-radius: var(--radius);
    overflow: visible;
}

@media (min-width: 961px) {
    .sv-wiki-sidebar {
        width: 280px;
        min-width: 280px;
        position: sticky;
        top: 20px;
        max-height: calc(100vh - 40px);
        z-index: 2;
    }

    .sv-wiki-main {
        position: relative;
        z-index: 1;
    }

    /* Sidebar search dropdown overlaps the main column — lift nav while searching */
    .sv-wiki-app.is-searching .sv-wiki-sidebar {
        z-index: 10060;
    }
}

@media (max-width: 960px) {
    .sv-wiki-sidebar {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        width: min(320px, 88vw);
        min-width: 0;
        max-height: none;
        height: 100vh;
        height: 100dvh;
        z-index: 10040;
        border-radius: 0;
        border-left: none;
        border-top: none;
        border-bottom: none;
        transform: translateX(-105%);
        transition: transform 0.24s ease;
        box-shadow: 12px 0 40px rgba(0, 0, 0, 0.45);
    }

    .sv-wiki-app.is-sidebar-open .sv-wiki-sidebar {
        transform: translateX(0);
    }

    .sv-wiki-sidebar__close {
        display: flex;
    }
}

.sv-wiki-sidebar__toolbar {
    display: grid;
    grid-template-columns: auto 1fr 36px;
    gap: 8px;
    padding: 10px;
    border-bottom: 1px solid var(--grid);
    background: linear-gradient(180deg, rgba(57, 208, 255, 0.04), transparent);
    position: relative;
    z-index: 30;
    overflow: visible;
    flex-shrink: 0;
}

@media (max-width: 960px) {
    .sv-wiki-sidebar__toolbar {
        grid-template-columns: 36px auto 1fr 36px;
    }
}

.sv-wiki-sidebar__search-wrap {
    position: relative;
    min-width: 0;
    overflow: visible;
}

.sv-wiki-sidebar__search-icon {
    color: #7d8798;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sv-wiki-sidebar__search {
    width: 100%;
    min-height: 36px;
    box-sizing: border-box;
    margin: 0;
    background: #0e1118;
    background-color: #0e1118;
    border: 1px solid #1e2430;
    border-radius: 10px;
    padding: 9px 12px;
    outline: none;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.4;
    color: #f5f8fc;
    color-scheme: dark;
    -webkit-appearance: none;
    appearance: none;
    box-shadow: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.sv-wiki-sidebar__search:focus {
    border-color: rgba(57, 208, 255, 0.55);
    box-shadow: 0 0 0 2px rgba(57, 208, 255, 0.12);
}

.sv-wiki-sidebar__search::placeholder {
    color: #8fa3bc;
    opacity: 1;
}

.sv-wiki-sidebar__sort {
    border: 1px solid #1e2430;
    background: #0e1118;
    color: var(--ink);
    border-radius: 10px;
    cursor: pointer;
}

.sv-wiki-sidebar__nav {
    overflow-x: hidden;
    overflow-y: auto;
    flex: 1 1 auto;
    min-height: 0;
    scrollbar-width: thin;
}

.sv-wiki-sidebar__home {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 12px;
    margin: 4px 6px 8px;
    border: 1px solid #1e2430;
    border-radius: 10px;
    background: linear-gradient(180deg, #151924, #121622);
    color: var(--ink);
    text-decoration: none;
    font-weight: 700;
    font-size: 13px;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.sv-wiki-sidebar__home:hover {
    border-color: rgba(57, 208, 255, 0.45);
}

.sv-wiki-sidebar__home.is-active {
    border-color: var(--accent);
    background: rgba(57, 208, 255, 0.1);
}

.sv-wiki-sidebar__home .fa {
    width: 18px;
    text-align: center;
    color: var(--accent);
}

.sv-wiki-sidebar__status {
    flex-shrink: 0;
}

/* Search: highlight matching sections, dim the rest — never hide/collapse nav */
.sv-wiki-app.is-searching .sv-wiki-sidebar__item.is-search-dim {
    opacity: 0.38;
}

.sv-wiki-app.is-searching .sv-wiki-sidebar__item.is-search-highlight {
    opacity: 1;
    background: linear-gradient(90deg, rgba(57, 208, 255, 0.14), transparent 70%);
    outline: 1px solid rgba(57, 208, 255, 0.28);
    outline-offset: -1px;
}

.sv-wiki-app.is-searching .sv-wiki-sidebar__group:has(.sv-wiki-sidebar__item.is-search-highlight) .sv-wiki-sidebar__group-title {
    color: var(--accent);
}

/* Global search autocomplete — portaled to body via JS; fixed overlay above main panel */
.sv-wiki-search-dropdown {
    position: fixed;
    z-index: 10070;
    max-height: min(360px, calc(100vh - 120px));
    overflow: auto;
    background: #0c1018;
    border: 1px solid rgba(57, 208, 255, 0.35);
    border-radius: 12px;
    box-shadow:
        0 16px 40px rgba(0, 0, 0, 0.55),
        0 0 0 1px rgba(255, 255, 255, 0.04),
        0 0 24px rgba(57, 208, 255, 0.08);
    scrollbar-width: thin;
}

.sv-wiki-search-dropdown__item {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 2px 10px;
    padding: 10px 12px;
    color: var(--ink);
    text-decoration: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    transition: background 0.12s ease;
}

.sv-wiki-search-dropdown__item:last-child {
    border-bottom: none;
}

.sv-wiki-search-dropdown__item:hover,
.sv-wiki-search-dropdown__item.is-active {
    background: rgba(57, 208, 255, 0.1);
}

.sv-wiki-search-dropdown__title {
    grid-column: 1;
    font-weight: 600;
    font-size: 13px;
    color: #fff;
}

.sv-wiki-search-dropdown__id {
    grid-column: 1;
    font-size: 11px;
    color: var(--muted);
    font-family: ui-monospace, monospace;
}

.sv-wiki-search-dropdown__entity {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--accent);
    white-space: nowrap;
}

.sv-wiki-search-dropdown__item mark {
    background: rgba(57, 208, 255, 0.25);
    color: var(--accent-2);
    padding: 0 2px;
    border-radius: 2px;
}

.sv-wiki-search-dropdown__empty {
    padding: 14px 12px;
    font-size: 12px;
    color: var(--muted);
    text-align: center;
}

.sv-wiki-sidebar__group-title {
    width: 100%;
    text-align: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 10px;
    cursor: pointer;
    background: linear-gradient(180deg, #151924, #121622);
    border: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.03);
    color: var(--ink);
    font-weight: 600;
    font-size: 12px;
}

.sv-wiki-sidebar__group-title .left {
    display: flex;
    align-items: center;
    gap: 8px;
}

.sv-wiki-sidebar__group-title .fa {
    color: var(--accent);
}

.sv-wiki-sidebar__group[data-open="false"] .sv-wiki-sidebar__group-items {
    display: none;
}

.sv-wiki-sidebar__group[data-open="false"] .caret {
    transform: rotate(-90deg);
}

.sv-wiki-sidebar__group-title .caret {
    transition: transform 0.15s ease;
    color: var(--muted);
}

.sv-wiki-sidebar__item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.03);
    color: var(--ink);
    text-decoration: none;
    transition: background 0.15s ease;
}

.sv-wiki-sidebar__item:hover {
    background: rgba(57, 208, 255, 0.06);
}

.sv-wiki-sidebar__item.is-active {
    background: linear-gradient(90deg, rgba(57, 208, 255, 0.12), transparent 60%);
    outline: 1px solid rgba(57, 208, 255, 0.25);
    outline-offset: -1px;
}

.sv-wiki-sidebar__item .fa {
    width: 18px;
    text-align: center;
    color: var(--muted);
}

.sv-wiki-sidebar__item .name {
    flex: 1;
    font-weight: 600;
    font-size: 13px;
}

.sv-wiki-sidebar__item .count {
    color: var(--muted);
    font-size: 11px;
}

.sv-wiki-sidebar__status {
    padding: 10px 12px;
    border-top: 1px solid var(--grid);
    font-size: 12px;
    color: var(--muted);
    display: flex;
    align-items: center;
    gap: 8px;
}

.sv-wiki-sidebar__status .fa {
    color: var(--accent);
}

/* Directory pages */
.sv-wiki__icon-frame .fa {
    font-size: 42px;
    color: var(--accent);
    position: relative;
    z-index: 1;
}

.sv-wiki-directory__toolbar {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
    flex-wrap: wrap;
}

.sv-wiki-directory__search {
    flex: 1;
    min-width: 200px;
    background: #0e1118;
    border: 1px solid #1e2430;
    color: #fff;
    border-radius: 10px;
    padding: 8px 12px;
}

.sv-wiki-directory__sort {
    background: #0e1118;
    border: 1px solid #1e2430;
    color: var(--ink);
    border-radius: 999px;
    padding: 8px 14px;
    cursor: pointer;
    font-size: 12px;
}

.sv-wiki-directory__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 12px;
}

.sv-wiki-directory__card {
    display: grid;
    grid-template-columns: 52px 1fr;
    gap: 12px;
    align-items: center;
    padding: 12px;
    background: #0f131b;
    border: 1px solid #2a3144;
    border-radius: 12px;
    color: var(--ink);
    text-decoration: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.1s ease;
}

.sv-wiki-directory__card:hover {
    border-color: var(--accent);
    box-shadow: 0 0 16px rgba(57, 208, 255, 0.15);
    transform: translateY(-1px);
}

.sv-wiki-directory__icon-wrap {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    border: 1px solid #2a3144;
    background: #0e1118;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sv-wiki-directory__icon {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.sv-wiki-directory__icon-placeholder {
    color: var(--accent);
    font-size: 20px;
}

.sv-wiki-directory__name {
    display: block;
    font-weight: 600;
    font-size: 13px;
    color: #fff;
}

.sv-wiki-directory__id {
    display: block;
    font-size: 11px;
    color: var(--muted);
    font-family: ui-monospace, monospace;
    margin-top: 2px;
}

.sv-wiki-directory__empty {
    grid-column: 1 / -1;
    padding: 24px;
    text-align: center;
    color: var(--muted);
}

/* Monster directory */
.sv-wiki-directory-monster__stats {
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: #0f131b;
}

.sv-wiki-directory-monster__stats-label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
    margin-bottom: 8px;
}

.sv-wiki-directory-monster__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.sv-wiki-directory-monster__chip {
    background: #0e1118;
    border: 1px solid #2a3144;
    color: var(--ink);
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 12px;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.sv-wiki-directory-monster__chip:hover,
.sv-wiki-directory-monster__chip.is-active {
    border-color: var(--accent);
    background: rgba(57, 208, 255, 0.08);
}

.sv-wiki-directory-monster__chip--element {
    border-color: color-mix(in srgb, var(--chip-color, var(--accent)) 45%, #2a3144);
}

.sv-wiki-directory-monster__chip--element::before {
    content: '';
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 6px;
    background: var(--chip-color, var(--accent));
    box-shadow: 0 0 6px var(--chip-color, var(--accent));
    vertical-align: middle;
}

.sv-wiki-directory-monster__chip .count {
    opacity: 0.7;
    margin-left: 2px;
}

.sv-wiki-directory-monster__toolbar {
    margin-bottom: 14px;
}

.sv-wiki-directory-monster__filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
    align-items: flex-end;
}

.sv-wiki-directory-monster__filter-group {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: flex-end;
    flex-shrink: 0;
}

.sv-wiki-directory-monster__filter-group--toggles {
    gap: 6px;
}

.sv-wiki-directory-monster__field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 11px;
    color: var(--muted);
    min-width: 0;
}

.sv-wiki-directory-monster__field--narrow {
    width: 84px;
    flex-shrink: 0;
}

.sv-wiki-directory-monster__field select,
.sv-wiki-directory-monster__field input[type="number"] {
    box-sizing: border-box;
    background: #0e1118;
    border: 1px solid #1e2430;
    color: #fff;
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 12px;
    min-width: 110px;
}

.sv-wiki-directory-monster__field--narrow input[type="number"] {
    min-width: 0;
    width: 100%;
}

.sv-wiki-directory-monster__toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: var(--ink);
    padding: 7px 12px;
    border: 1px solid #1e2430;
    border-radius: 8px;
    background: #0e1118;
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
    flex-shrink: 0;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.sv-wiki-directory-monster__toggle:hover {
    border-color: rgba(57, 208, 255, 0.45);
}

.sv-wiki-directory-monster__toggle:has(input:checked) {
    border-color: var(--accent);
    background: rgba(57, 208, 255, 0.08);
}

.sv-wiki-directory-monster__toggle input {
    accent-color: var(--accent);
    margin: 0;
}

.sv-wiki-directory-monster__clear {
    background: transparent;
    border: 1px solid #2a3144;
    color: var(--muted);
    border-radius: 8px;
    padding: 7px 12px;
    font-size: 12px;
    cursor: pointer;
}

.sv-wiki-directory-monster__clear:hover {
    border-color: var(--accent);
    color: var(--ink);
}

.sv-wiki-directory-monster__card.is-hidden {
    display: none;
}

.sv-wiki-directory-monster__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 4px;
}

.sv-wiki-directory-monster__level {
    font-size: 11px;
    font-weight: 600;
    color: var(--accent);
}

.sv-wiki-directory-monster__element {
    font-size: 11px;
    color: var(--element-color, var(--muted));
}

.sv-wiki-directory-monster__element::before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    margin-right: 4px;
    background: var(--element-color, var(--muted));
    vertical-align: middle;
}

.sv-wiki-directory-monster__boss-badge {
    position: absolute;
    top: -4px;
    right: -4px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #c44;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #2a3144;
    box-shadow: 0 0 8px rgba(204, 68, 68, 0.5);
}

.sv-wiki-directory-monster__card .sv-wiki-directory__icon-wrap {
    position: relative;
}

.sv-wiki-directory-monster__count {
    margin-top: 12px;
    font-size: 12px;
    color: var(--muted);
    text-align: right;
}

@media (max-width: 720px) {
    .sv-wiki-directory-monster__filter-row {
        flex-direction: column;
        align-items: stretch;
    }

    .sv-wiki-directory-monster__filter-group {
        width: 100%;
    }

    .sv-wiki-directory-monster__filter-group--level .sv-wiki-directory-monster__field--narrow {
        flex: 1;
        width: auto;
    }

    .sv-wiki-directory-monster__field select,
    .sv-wiki-directory-monster__field input[type="number"] {
        width: 100%;
    }

    .sv-wiki-directory-monster__filter-group--toggles .sv-wiki-directory-monster__toggle {
        flex: 1;
        justify-content: center;
    }
}

/* Artifact set directory */
.sv-wiki-directory-artifactset__stats {
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: #0f131b;
}

.sv-wiki-directory-artifactset__stats-label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
    margin-bottom: 8px;
}

.sv-wiki-directory-artifactset__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.sv-wiki-directory-artifactset__chip {
    background: #0e1118;
    border: 1px solid #2a3144;
    color: var(--ink);
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 12px;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.sv-wiki-directory-artifactset__chip:hover,
.sv-wiki-directory-artifactset__chip.is-active {
    border-color: var(--accent);
    background: rgba(57, 208, 255, 0.08);
}

.sv-wiki-directory-artifactset__chip .count {
    opacity: 0.7;
    margin-left: 2px;
}

.sv-wiki-directory-artifactset__toolbar {
    margin-bottom: 14px;
}

.sv-wiki-directory-artifactset__filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
    align-items: flex-end;
}

.sv-wiki-directory-artifactset__field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-artifactset__field select {
    background: #0e1118;
    border: 1px solid #1e2430;
    color: #fff;
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 12px;
    min-width: 110px;
}

.sv-wiki-directory-artifactset__toggle {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--ink);
    padding-bottom: 2px;
    cursor: pointer;
    user-select: none;
}

.sv-wiki-directory-artifactset__toggle input {
    accent-color: var(--accent);
}

.sv-wiki-directory-artifactset__clear {
    background: transparent;
    border: 1px solid #2a3144;
    color: var(--muted);
    border-radius: 8px;
    padding: 7px 12px;
    font-size: 12px;
    cursor: pointer;
}

.sv-wiki-directory-artifactset__clear:hover {
    border-color: var(--accent);
    color: var(--ink);
}

.sv-wiki-directory-artifactset__card.is-hidden {
    display: none;
}

.sv-wiki-directory-artifactset__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 4px;
}

.sv-wiki-directory-artifactset__pieces {
    font-size: 11px;
    font-weight: 600;
    color: var(--accent);
}

.sv-wiki-directory-artifactset__material {
    font-size: 11px;
    color: var(--accent-2, #ad8);
}

.sv-wiki-directory-artifactset__material--none {
    color: var(--muted);
}

.sv-wiki-directory-artifactset__bonus {
    display: block;
    font-size: 11px;
    color: var(--ink);
    margin-top: 3px;
    line-height: 1.35;
}

.sv-wiki-directory-artifactset__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 4px;
}

.sv-wiki-directory-artifactset__tag {
    font-size: 10px;
    padding: 1px 7px;
    border-radius: 999px;
    border: 1px solid #2a3144;
    color: var(--muted);
}

.sv-wiki-directory-artifactset__count {
    margin-top: 12px;
    font-size: 12px;
    color: var(--muted);
    text-align: right;
}

@media (max-width: 720px) {
    .sv-wiki-directory-artifactset__filter-row {
        flex-direction: column;
        align-items: stretch;
    }

    .sv-wiki-directory-artifactset__field select {
        width: 100%;
    }
}

/* Craftsman directory */
.sv-wiki-directory-craftsman__stats {
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: #0f131b;
}

.sv-wiki-directory-craftsman__stats-label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
    margin-bottom: 8px;
}

.sv-wiki-directory-craftsman__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.sv-wiki-directory-craftsman__chip {
    background: #0e1118;
    border: 1px solid #2a3144;
    color: var(--ink);
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 12px;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.sv-wiki-directory-craftsman__chip:hover,
.sv-wiki-directory-craftsman__chip.is-active {
    border-color: var(--accent);
    background: rgba(57, 208, 255, 0.08);
}

.sv-wiki-directory-craftsman__chip .count {
    opacity: 0.7;
    margin-left: 2px;
}

.sv-wiki-directory-craftsman__toolbar {
    margin-bottom: 14px;
}

.sv-wiki-directory-craftsman__filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
    align-items: flex-end;
}

.sv-wiki-directory-craftsman__field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-craftsman__field select {
    background: #0e1118;
    border: 1px solid #1e2430;
    color: #fff;
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 12px;
    min-width: 110px;
}

.sv-wiki-directory-craftsman__clear {
    background: transparent;
    border: 1px solid #2a3144;
    color: var(--muted);
    border-radius: 8px;
    padding: 7px 12px;
    font-size: 12px;
    cursor: pointer;
}

.sv-wiki-directory-craftsman__clear:hover {
    border-color: var(--accent);
    color: var(--ink);
}

.sv-wiki-directory-craftsman__card.is-hidden {
    display: none;
}

.sv-wiki-directory-craftsman__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 4px;
}

.sv-wiki-directory-craftsman__kind {
    font-size: 11px;
    font-weight: 600;
    color: var(--accent);
}

.sv-wiki-directory-craftsman__recipes {
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-craftsman__subtitle {
    display: block;
    font-size: 11px;
    color: var(--ink);
    margin-top: 3px;
    line-height: 1.35;
}

.sv-wiki-directory-craftsman__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 4px;
}

.sv-wiki-directory-craftsman__tag {
    font-size: 10px;
    padding: 1px 7px;
    border-radius: 999px;
    border: 1px solid #2a3144;
    color: var(--muted);
}

.sv-wiki-directory-craftsman__count {
    margin-top: 12px;
    font-size: 12px;
    color: var(--muted);
    text-align: right;
}

.sv-wiki-recipe-group {
    margin-bottom: 14px;
}

.sv-wiki-recipe-group__title {
    margin: 0 0 8px;
    font-size: 13px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--accent);
}

.sv-wiki-recipe__summary {
    font-weight: 600;
}

@media (max-width: 720px) {
    .sv-wiki-directory-craftsman__filter-row {
        flex-direction: column;
        align-items: stretch;
    }

    .sv-wiki-directory-craftsman__field select {
        width: 100%;
    }
}

/* Materials (junk) directory */
.sv-wiki-directory-junk__stats {
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: #0f131b;
}

.sv-wiki-directory-junk__stats-label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
    margin-bottom: 8px;
}

.sv-wiki-directory-junk__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.sv-wiki-directory-junk__chip {
    background: #0e1118;
    border: 1px solid #2a3144;
    color: var(--ink);
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 12px;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.sv-wiki-directory-junk__chip:hover,
.sv-wiki-directory-junk__chip.is-active {
    border-color: var(--accent);
    background: rgba(57, 208, 255, 0.08);
}

.sv-wiki-directory-junk__chip--legendary.is-active,
.sv-wiki-directory-junk__chip--unique.is-active {
    border-color: var(--warn);
    background: rgba(255, 190, 85, 0.08);
}

.sv-wiki-directory-junk__chip .count {
    opacity: 0.7;
    margin-left: 2px;
}

.sv-wiki-directory-junk__toolbar {
    margin-bottom: 14px;
}

.sv-wiki-directory-junk__filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
    align-items: flex-end;
}

.sv-wiki-directory-junk__field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-junk__field select {
    background: #0e1118;
    border: 1px solid #1e2430;
    color: #fff;
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 12px;
    min-width: 110px;
}

.sv-wiki-directory-junk__clear {
    background: transparent;
    border: 1px solid #2a3144;
    color: var(--muted);
    border-radius: 8px;
    padding: 7px 12px;
    font-size: 12px;
    cursor: pointer;
}

.sv-wiki-directory-junk__clear:hover {
    border-color: var(--accent);
    color: var(--ink);
}

.sv-wiki-directory-junk__card.is-hidden {
    display: none;
}

.sv-wiki-directory-junk__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 4px;
}

.sv-wiki-directory-junk__rarity {
    font-size: 11px;
    font-weight: 600;
    color: var(--muted);
}

.sv-wiki-directory-junk__rarity--legendary {
    color: var(--warn);
}

.sv-wiki-directory-junk__rarity--unique {
    color: var(--accent-2);
}

.sv-wiki-directory-junk__sell {
    font-size: 11px;
    color: var(--accent);
}

.sv-wiki-directory-junk__subtitle {
    display: block;
    font-size: 11px;
    color: var(--ink);
    margin-top: 3px;
    line-height: 1.35;
}

.sv-wiki-directory-junk__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 4px;
}

.sv-wiki-directory-junk__tag {
    font-size: 10px;
    padding: 1px 7px;
    border-radius: 999px;
    border: 1px solid #2a3144;
    color: var(--muted);
}

.sv-wiki-directory-junk__count {
    margin-top: 12px;
    font-size: 12px;
    color: var(--muted);
    text-align: right;
}

@media (max-width: 720px) {
    .sv-wiki-directory-junk__filter-row {
        flex-direction: column;
        align-items: stretch;
    }

    .sv-wiki-directory-junk__field select {
        width: 100%;
    }
}

/* Equipment directory */
.sv-wiki-directory-equip__stats {
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: #0f131b;
}

.sv-wiki-directory-equip__stats-label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
    margin-bottom: 8px;
}

.sv-wiki-directory-equip__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.sv-wiki-directory-equip__chip {
    background: #0e1118;
    border: 1px solid #2a3144;
    color: var(--ink);
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 12px;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.sv-wiki-directory-equip__chip:hover,
.sv-wiki-directory-equip__chip.is-active {
    border-color: var(--accent);
    background: rgba(57, 208, 255, 0.08);
}

.sv-wiki-directory-equip__chip .count {
    opacity: 0.7;
    margin-left: 2px;
}

.sv-wiki-directory-equip__toolbar {
    margin-bottom: 14px;
}

.sv-wiki-directory-equip__filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
    align-items: flex-end;
}

.sv-wiki-directory-equip__filter-group {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: flex-end;
    flex-shrink: 0;
}

.sv-wiki-directory-equip__filter-group--toggles {
    gap: 6px;
}

.sv-wiki-directory-equip__field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 11px;
    color: var(--muted);
    min-width: 0;
}

.sv-wiki-directory-equip__field--narrow {
    width: 84px;
    flex-shrink: 0;
}

.sv-wiki-directory-equip__field select,
.sv-wiki-directory-equip__field input[type="number"] {
    box-sizing: border-box;
    background: #0e1118;
    border: 1px solid #1e2430;
    color: #fff;
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 12px;
    min-width: 110px;
}

.sv-wiki-directory-equip__field--narrow input[type="number"] {
    min-width: 0;
    width: 100%;
}

.sv-wiki-directory-equip__toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: var(--ink);
    padding: 7px 12px;
    border: 1px solid #1e2430;
    border-radius: 8px;
    background: #0e1118;
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
    flex-shrink: 0;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.sv-wiki-directory-equip__toggle:hover {
    border-color: rgba(57, 208, 255, 0.45);
}

.sv-wiki-directory-equip__toggle:has(input:checked) {
    border-color: var(--accent);
    background: rgba(57, 208, 255, 0.08);
}

.sv-wiki-directory-equip__toggle input {
    accent-color: var(--accent);
    margin: 0;
}

.sv-wiki-directory-equip__clear {
    background: transparent;
    border: 1px solid #2a3144;
    color: var(--muted);
    border-radius: 8px;
    padding: 7px 12px;
    font-size: 12px;
    cursor: pointer;
}

.sv-wiki-directory-equip__clear:hover {
    border-color: var(--accent);
    color: var(--ink);
}

.sv-wiki-directory-equip__card.is-hidden {
    display: none;
}

.sv-wiki-directory-equip__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 4px;
}

.sv-wiki-directory-equip__type {
    font-size: 11px;
    font-weight: 600;
    color: var(--accent);
}

.sv-wiki-directory-equip__level {
    font-size: 11px;
    font-weight: 600;
    color: var(--muted);
}

.sv-wiki-directory-equip__element {
    font-size: 11px;
    color: var(--element-color, var(--muted));
}

.sv-wiki-directory-equip__element::before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    margin-right: 4px;
    background: var(--element-color, var(--muted));
    vertical-align: middle;
}

.sv-wiki-directory-equip__summary {
    display: block;
    font-size: 11px;
    color: var(--ink);
    margin-top: 4px;
    line-height: 1.4;
}

.sv-wiki-directory-equip__stats {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-top: 4px;
}

.sv-wiki-directory-equip__stat-line {
    display: block;
    font-size: 11px;
    color: var(--ink);
    line-height: 1.35;
}

.sv-wiki-directory-equip__stat-line--secondary {
    color: #b8c0d4;
}

.sv-wiki-directory-equip__stat-more {
    font-size: 10px;
    color: var(--muted);
    margin-top: 1px;
}

.sv-wiki-directory-equip__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 5px;
}

.sv-wiki-directory-equip__badge {
    font-size: 10px;
    padding: 1px 7px;
    border-radius: 999px;
    border: 1px solid #2a3144;
    color: var(--muted);
}

.sv-wiki-directory-equip__badge--grant {
    border-color: rgba(120, 200, 120, 0.35);
    color: #8fd48f;
}

.sv-wiki-directory-equip__badge--trigger {
    border-color: rgba(255, 180, 80, 0.35);
    color: #f0b060;
}

.sv-wiki-directory-equip__badge--immune {
    border-color: rgba(180, 140, 255, 0.35);
    color: #c4a8ff;
}

.sv-wiki-directory-equip__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 4px;
}

.sv-wiki-directory-equip__tag {
    font-size: 10px;
    padding: 1px 7px;
    border-radius: 999px;
    border: 1px solid #2a3144;
    color: var(--muted);
}

.sv-wiki-directory-equip__tag--drop {
    border-color: rgba(57, 208, 255, 0.35);
    color: var(--accent);
}

.sv-wiki-directory-equip__class {
    font-size: 11px;
    font-weight: 600;
    color: #c4a8ff;
}

.sv-wiki-directory-equip__variant {
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-equip__passive-title {
    display: block;
    font-size: 11px;
    font-weight: 600;
    color: #8fd48f;
    margin-top: 4px;
}

.sv-wiki-directory-equip__stats--passive .sv-wiki-directory-equip__stat-line--passive {
    color: #d8deea;
}

.sv-wiki-directory-equip__card--grimoire .sv-wiki-directory-equip__type {
    color: #c4a8ff;
}

.sv-wiki-directory-equip__tier-badge {
    position: absolute;
    bottom: -4px;
    left: -4px;
    min-width: 22px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: #1a2030;
    color: #c4a8ff;
    font-size: 10px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #3a2f5a;
}

.sv-wiki-directory-equip__slot-badge {
    position: absolute;
    bottom: -4px;
    left: -4px;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    border-radius: 999px;
    background: #1a2030;
    color: var(--accent);
    font-size: 10px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #2a3144;
}

.sv-wiki-directory-equip__unique-badge {
    position: absolute;
    top: -4px;
    right: -4px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #c9a227;
    color: #0a0c10;
    font-size: 10px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #2a3144;
    box-shadow: 0 0 8px rgba(201, 162, 39, 0.45);
}

.sv-wiki-directory-equip__card .sv-wiki-directory__icon-wrap {
    position: relative;
}

.sv-wiki-directory-equip__count {
    margin-top: 12px;
    font-size: 12px;
    color: var(--muted);
    text-align: right;
}

@media (max-width: 720px) {
    .sv-wiki-directory-equip__filter-row {
        flex-direction: column;
        align-items: stretch;
    }

    .sv-wiki-directory-equip__filter-group {
        width: 100%;
    }

    .sv-wiki-directory-equip__filter-group--level .sv-wiki-directory-equip__field--narrow {
        flex: 1;
        width: auto;
    }

    .sv-wiki-directory-equip__field select,
    .sv-wiki-directory-equip__field input[type="number"] {
        width: 100%;
    }

    .sv-wiki-directory-equip__filter-group--toggles .sv-wiki-directory-equip__toggle {
        flex: 1;
        justify-content: center;
    }
}

/* Artifact set pages */
.sv-wiki-lore-list {
    margin: 0 0 18px;
    padding-left: 1.2rem;
    color: var(--ink);
    line-height: 1.55;
}

.sv-wiki-lore-list li {
    margin-bottom: 8px;
}

.sv-wiki-lore-list li:last-child {
    margin-bottom: 0;
}

.sv-wiki-artifact-list {
    margin: 0;
    padding-left: 1.25rem;
}

.sv-wiki-artifact-list__item {
    margin-bottom: 10px;
    line-height: 1.5;
    color: var(--ink);
}

.sv-wiki-artifact-list__item:last-child {
    margin-bottom: 0;
}

.sv-wiki-artifact-list__sep {
    margin: 0 6px;
    color: var(--muted);
}

.sv-wiki-artifact-list__effect {
    margin-right: 6px;
}

.sv-wiki-artifact-list__value {
    color: var(--accent);
    font-weight: 600;
}

.sv-wiki-artifact-effects td strong {
    color: #fff;
}

.sv-wiki-artifact-effects td a {
    color: var(--accent);
}

/* Wiki home / front page */
.sv-wiki-shell--hub {
    max-width: none;
    width: 100%;
}

.sv-wiki-home__hero {
    position: relative;
    overflow: hidden;
    margin-bottom: 22px;
    padding: 28px 24px 24px;
    border: 1px solid #263042;
    border-radius: 16px;
    background:
        radial-gradient(900px 420px at 85% -10%, rgba(57, 208, 255, 0.14), transparent 60%),
        radial-gradient(700px 360px at 0% 100%, rgba(0, 255, 168, 0.08), transparent 55%),
        linear-gradient(180deg, #121622, #0f131b);
}

.sv-wiki-home__hero-glow {
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, transparent 40%, rgba(57, 208, 255, 0.04) 50%, transparent 60%);
    pointer-events: none;
}

.sv-wiki-home__hero-inner {
    position: relative;
    z-index: 1;
    max-width: none;
}

.sv-wiki-home__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    padding: 4px 12px;
    border: 1px solid #2a3144;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.22);
    color: var(--accent);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.sv-wiki-home__title {
    margin: 0 0 10px;
    font-size: clamp(28px, 5vw, 40px);
    line-height: 1.1;
    color: #fff;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.sv-wiki-home__lede {
    margin: 0 0 18px;
    max-width: 62ch;
    color: var(--muted);
    font-size: 15px;
    line-height: 1.6;
    text-transform: none;
    letter-spacing: 0;
}

.sv-wiki-home__search {
    margin-bottom: 18px;
}

.sv-wiki-home__search-label {
    display: block;
    margin-bottom: 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--muted);
}

/* Hero and later home sections share z-index:1 from .sv-wiki-shell > * — lift hero while search is open */
.sv-wiki-app.is-searching .sv-wiki-home__hero {
    z-index: 10060;
    overflow: visible;
}

.sv-wiki-home__search-wrap {
    position: relative;
    max-width: 720px;
    overflow: visible;
}

.sv-wiki-home__search-field {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 48px;
    margin: 0;
    padding: 0 16px;
    border: 1px solid rgba(57, 208, 255, 0.35);
    border-radius: 12px;
    background: rgba(8, 10, 14, 0.85);
    overflow: hidden;
    color-scheme: dark;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.sv-wiki-home__search-field:focus-within {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(57, 208, 255, 0.14);
}

.sv-wiki-home__search-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 16px;
    width: 16px;
    height: 16px;
    line-height: 1;
    color: var(--accent);
    font-size: 15px;
    pointer-events: none;
}

.sv-wiki-home__search-icon .fa {
    display: block;
    width: 1em;
    height: 1em;
    line-height: 1;
    text-align: center;
}

.sv-wiki-home__search-input {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    height: auto;
    min-height: 0;
    box-sizing: border-box;
    margin: 0;
    padding: 13px 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    background-color: transparent;
    background-image: none;
    color: #f5f8fc;
    font: inherit;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.4;
    vertical-align: middle;
    outline: none;
    box-shadow: none;
    -webkit-appearance: none;
    appearance: none;
}

.sv-wiki-home__search-input::placeholder {
    color: #8fa3bc;
    opacity: 1;
}

.sv-wiki-home__search-input:-webkit-autofill,
.sv-wiki-home__search-input:-webkit-autofill:hover,
.sv-wiki-home__search-input:-webkit-autofill:focus {
    -webkit-text-fill-color: #f5f8fc;
    caret-color: #39d0ff;
    box-shadow: 0 0 0 1000px rgba(8, 10, 14, 0.85) inset;
    transition: background-color 99999s ease-out 0s;
}

/* Beat theme input styles — keep search text readable on dark backgrounds */
#spiritvale-wiki-app .sv-wiki-home__search-input,
#spiritvale-wiki-app .sv-wiki-sidebar__search {
    color: #f5f8fc !important;
    -webkit-text-fill-color: #f5f8fc !important;
    caret-color: #39d0ff;
    opacity: 1 !important;
}

#spiritvale-wiki-app .sv-wiki-home__search-input {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
}

#spiritvale-wiki-app .sv-wiki-sidebar__search {
    background: #0e1118 !important;
    background-color: #0e1118 !important;
    background-image: none !important;
}

#spiritvale-wiki-app .sv-wiki-home__search-input::placeholder,
#spiritvale-wiki-app .sv-wiki-sidebar__search::placeholder {
    color: #8fa3bc !important;
    opacity: 1 !important;
}

.sv-wiki-home__search-hint {
    position: relative;
    z-index: 0;
    margin: 10px 0 0;
    font-size: 12px;
    color: var(--muted);
}

.sv-wiki-home__stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 10px;
    margin: 0;
}

.sv-wiki-home__stat {
    padding: 12px 14px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: rgba(0, 0, 0, 0.2);
}

.sv-wiki-home__stat dt {
    margin: 0 0 4px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--muted);
}

.sv-wiki-home__stat dd {
    margin: 0;
    font-size: 22px;
    font-weight: 700;
    color: #fff;
}

.sv-wiki-home__section {
    margin-bottom: 26px;
}

.sv-wiki-home__section-head {
    margin-bottom: 14px;
}

.sv-wiki-home__section-title {
    margin: 0 0 6px;
    font-size: 16px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #fff;
}

.sv-wiki-home__section-lede {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.5;
    text-transform: none;
    letter-spacing: 0;
}

.sv-wiki-home__quick-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 10px;
}

.sv-wiki-home__quick-card {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 12px;
    align-items: center;
    padding: 14px 16px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: #0f131b;
    color: var(--ink);
    text-decoration: none;
    transition: border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.sv-wiki-home__quick-card:hover {
    border-color: var(--accent);
    box-shadow: 0 0 20px rgba(57, 208, 255, 0.1);
    transform: translateY(-1px);
}

.sv-wiki-home__quick-icon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(57, 208, 255, 0.08);
    color: var(--accent);
    font-size: 18px;
}

.sv-wiki-home__quick-body {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.sv-wiki-home__quick-title {
    font-weight: 700;
    font-size: 14px;
    color: #fff;
}

.sv-wiki-home__quick-meta {
    font-size: 12px;
    color: var(--muted);
}

.sv-wiki-home__quick-arrow {
    color: var(--muted);
    font-size: 12px;
}

.sv-wiki-home__category {
    margin-bottom: 18px;
}

.sv-wiki-home__category-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 10px;
    font-size: 13px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--accent);
}

.sv-wiki-home__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 10px;
}

.sv-wiki-home__card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 14px 16px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: #0f131b;
    color: var(--ink);
    text-decoration: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.sv-wiki-home__card:hover {
    border-color: var(--accent);
    box-shadow: 0 0 18px rgba(57, 208, 255, 0.1);
}

.sv-wiki-home__card-top {
    display: flex;
    align-items: center;
    gap: 10px;
}

.sv-wiki-home__card-icon {
    font-size: 18px;
    color: var(--accent);
}

.sv-wiki-home__card-title {
    font-weight: 700;
    font-size: 14px;
    color: #fff;
}

.sv-wiki-home__card-meta {
    font-size: 12px;
    color: var(--muted);
    line-height: 1.45;
}

.sv-wiki-home__card-meta .sep {
    opacity: 0.55;
}

.sv-wiki-home__card-pill {
    display: inline-block;
    margin-left: 4px;
    padding: 1px 7px;
    border-radius: 999px;
    border: 1px solid rgba(57, 208, 255, 0.25);
    color: var(--accent);
    font-size: 10px;
    font-weight: 700;
}

.sv-wiki-home__tips {
    padding: 16px 18px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: #0f131b;
}

.sv-wiki-home__tips-list {
    margin: 10px 0 0;
    padding-left: 1.2rem;
    color: var(--muted);
    line-height: 1.6;
}

.sv-wiki-home__tips-list li {
    margin-bottom: 8px;
}

.sv-wiki-home__tips-list strong {
    color: var(--ink);
}

@media (max-width: 720px) {
    .sv-wiki-home__hero {
        padding: 22px 16px 18px;
    }

    .sv-wiki-home__quick-grid,
    .sv-wiki-home__grid {
        grid-template-columns: 1fr;
    }
}

/* Legacy hub class aliases */
.sv-wiki-hub__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
.sv-wiki-hub__card { display: flex; flex-direction: column; gap: 6px; padding: 16px; background: #0f131b; border: 1px solid #2a3144; border-radius: 12px; color: var(--ink); text-decoration: none; }
.sv-wiki-hub__card-icon { font-size: 22px; color: var(--accent); }
.sv-wiki-hub__card-title { font-weight: 700; font-size: 15px; color: #fff; }
.sv-wiki-hub__card-meta { font-size: 12px; color: var(--muted); }

/* Tabs */
.sv-wiki-tabs {
    margin: 16px 0;
    border: 1px solid #2a3144;
    border-radius: 12px;
    overflow: hidden;
    background: #0f131b;
}

.sv-wiki-tabs__nav {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    border-bottom: 1px solid #2a3144;
    background: linear-gradient(180deg, #151924, #121622);
}

.sv-wiki-tabs__btn {
    flex: 1 1 auto;
    min-width: 100px;
    padding: 10px 14px;
    border: none;
    border-right: 1px solid rgba(42, 49, 68, 0.5);
    background: transparent;
    color: var(--muted);
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    cursor: pointer;
    transition: color 0.15s, background 0.15s;
}

.sv-wiki-tabs__btn:last-child {
    border-right: none;
}

.sv-wiki-tabs__btn:hover,
.sv-wiki-tabs__btn.is-active {
    color: var(--accent);
    background: rgba(57, 208, 255, 0.08);
}

.sv-wiki-tabs__panel {
    display: none;
    padding: 14px 16px;
}

.sv-wiki-tabs__panel.is-active {
    display: block;
}

/* Collapsible details */
.sv-wiki-details {
    margin-bottom: 8px;
    border: 1px solid #2a3144;
    border-radius: 10px;
    background: #0f131b;
    overflow: hidden;
}

.sv-wiki-details summary {
    padding: 10px 14px;
    cursor: pointer;
    font-weight: 600;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--ink);
    list-style: none;
    background: linear-gradient(180deg, rgba(57, 208, 255, 0.04), transparent);
}

.sv-wiki-details summary::-webkit-details-marker {
    display: none;
}

.sv-wiki-details summary::before {
    content: "▸ ";
    color: var(--accent);
}

.sv-wiki-details[open] summary::before {
    content: "▾ ";
}

.sv-wiki-details > p,
.sv-wiki-details > div {
    padding: 0 14px 12px;
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
}

.sv-wiki-lore .sv-wiki-details > p {
    padding-top: 4px;
}

/* Filterable lists / tables */
.sv-wiki-filterable {
    margin-bottom: 14px;
}

.sv-wiki-filterable__toolbar {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
    flex-wrap: wrap;
}

.sv-wiki-filterable__search {
    flex: 1;
    min-width: 180px;
    background: #0e1118;
    border: 1px solid #1e2430;
    color: #fff;
    border-radius: 10px;
    padding: 8px 12px;
    font-size: 13px;
}

.sv-wiki-filterable__count {
    font-size: 11px;
    color: var(--muted);
    white-space: nowrap;
}

.sv-wiki-filterable [data-filter-item].is-hidden {
    display: none !important;
}

/* Attribute bars */
.sv-wiki-bars {
    display: grid;
    gap: 8px;
    margin-bottom: 14px;
}

.sv-wiki-bar {
    display: grid;
    grid-template-columns: 48px 1fr 40px;
    gap: 10px;
    align-items: center;
}

.sv-wiki-bar__label {
    font-size: 11px;
    font-weight: 700;
    color: var(--muted);
    text-align: right;
}

.sv-wiki-bar__track {
    height: 8px;
    background: #1a2030;
    border-radius: 999px;
    overflow: hidden;
    border: 1px solid #2a3144;
}

.sv-wiki-bar__fill {
    height: 100%;
    background: linear-gradient(90deg, var(--accent), var(--accent-2));
    border-radius: 999px;
    min-width: 2px;
    transition: width 0.3s ease;
}

.sv-wiki-bar__value {
    font-size: 12px;
    font-weight: 600;
    color: var(--accent);
    font-family: ui-monospace, monospace;
}

/* Recipe grid */
.sv-wiki-recipe__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    padding: 0 14px 12px;
}

@media (max-width: 640px) {
    .sv-wiki-recipe__grid {
        grid-template-columns: 1fr;
    }
}

.sv-wiki-recipe__grid h4 {
    margin: 0 0 8px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
}

.sv-wiki__subsection {
    margin: 0 0 10px;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
}

/* Element pages */
.sv-wiki__chip--swatch {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.sv-wiki__chip-swatch-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: currentColor;
    box-shadow: 0 0 8px currentColor;
}

.sv-wiki-element-hero {
    --element-color: var(--accent);
    display: grid;
    grid-template-columns: 12px 64px 1fr;
    gap: 14px;
    align-items: center;
    margin-bottom: 16px;
    padding: 14px 16px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: linear-gradient(90deg, color-mix(in srgb, var(--element-color) 12%, transparent), transparent 55%), #0f131b;
}

.sv-wiki-element-hero__swatch {
    width: 12px;
    height: 64px;
    border-radius: 6px;
    background: var(--element-color);
    box-shadow: 0 0 16px color-mix(in srgb, var(--element-color) 50%, transparent);
}

.sv-wiki-element-hero__icon-wrap {
    width: 56px;
    height: 56px;
    border-radius: 10px;
    border: 1px solid #2a3144;
    background: #0e1118;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.sv-wiki-element-hero__icon {
    width: 48px;
    height: 48px;
    object-fit: contain;
}

.sv-wiki-element-hero__icon--placeholder {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    background: rgba(57, 208, 255, 0.08);
}

.sv-wiki-element-hero__stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.sv-wiki-element-hero__stat {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 8px 10px;
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.04);
}

.sv-wiki-element-hero__stat .label {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
}

.sv-wiki-element-hero__stat .value {
    font-size: 18px;
    font-weight: 700;
    font-family: ui-monospace, monospace;
}

.sv-wiki-element-matchups__element {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 140px;
}

.sv-wiki-element-matchups__icon {
    width: 28px;
    height: 28px;
    object-fit: contain;
    border-radius: 6px;
    background: #0e1118;
    border: 1px solid #2a3144;
    flex-shrink: 0;
}

.sv-wiki-element-matchups__icon--fallback {
    display: inline-block;
    background: rgba(57, 208, 255, 0.1);
}

.sv-wiki-element-matchups__name a {
    font-weight: 600;
}

.sv-wiki-element-matchups__mult {
    min-width: 140px;
}

.sv-wiki-element-matchups__bar {
    height: 6px;
    background: #1a2030;
    border-radius: 999px;
    overflow: hidden;
    margin-bottom: 4px;
    border: 1px solid #2a3144;
}

.sv-wiki-element-matchups__bar-fill {
    height: 100%;
    border-radius: 999px;
}

.sv-wiki-element-matchups__mult-label {
    font-family: ui-monospace, monospace;
    font-size: 12px;
    font-weight: 600;
}

.sv-wiki-mult--strong,
.sv-wiki-element-matchups__bar-fill.sv-wiki-mult--strong {
    color: var(--accent-2);
    background: linear-gradient(90deg, #00c878, var(--accent-2));
}

.sv-wiki-mult--weak,
.sv-wiki-element-matchups__bar-fill.sv-wiki-mult--weak {
    color: var(--red);
    background: linear-gradient(90deg, #cc3344, var(--red));
}

.sv-wiki-mult--neutral,
.sv-wiki-element-matchups__bar-fill.sv-wiki-mult--neutral {
    color: var(--muted);
    background: #4a5568;
}

.sv-wiki-element-effect {
    display: inline-flex;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.sv-wiki-element-effect--strong {
    color: var(--accent-2);
    background: rgba(0, 255, 168, 0.12);
    border: 1px solid rgba(0, 255, 168, 0.35);
}

.sv-wiki-element-effect--weak {
    color: var(--red);
    background: rgba(255, 85, 85, 0.1);
    border: 1px solid rgba(255, 85, 85, 0.35);
}

.sv-wiki-element-effect--neutral {
    color: var(--muted);
    background: rgba(154, 164, 178, 0.1);
    border: 1px solid rgba(154, 164, 178, 0.25);
}

.sv-wiki-element-matchups__row--strong {
    background: rgba(0, 255, 168, 0.03);
}

.sv-wiki-element-matchups__row--weak {
    background: rgba(255, 85, 85, 0.03);
}

.sv-wiki-element-legend {
    margin-top: 10px;
    font-size: 11.5px;
}

@media (max-width: 640px) {
    .sv-wiki-element-hero {
        grid-template-columns: 8px 52px 1fr;
    }
    .sv-wiki-element-hero__stats {
        grid-template-columns: 1fr;
    }
}

/* Monster combat stats */
.sv-wiki-monster-combat {
    margin: 20px 0 24px;
    padding: 16px;
    border: 1px solid #263042;
    border-radius: 14px;
    background:
        linear-gradient(135deg, rgba(255, 85, 120, 0.05) 0%, transparent 40%),
        linear-gradient(225deg, rgba(57, 208, 255, 0.06) 0%, transparent 45%),
        linear-gradient(180deg, rgba(12, 14, 20, 0.95), rgba(8, 10, 14, 0.98));
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.02);
}

.sv-wiki-monster-combat__lede {
    margin-bottom: 14px;
}

.sv-wiki-monster-combat__badge {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    vertical-align: middle;
}

.sv-wiki-monster-combat__badge--boss {
    color: #ff6b8a;
    background: rgba(255, 85, 120, 0.12);
    border: 1px solid rgba(255, 85, 120, 0.35);
}

.sv-wiki-monster-combat__hero {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.sv-wiki-monster-combat__card {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 14px 16px;
    border-radius: 12px;
    border: 1px solid #2a3144;
    background: rgba(14, 17, 24, 0.85);
    position: relative;
    overflow: hidden;
}

.sv-wiki-monster-combat__card::before {
    content: '';
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    border-radius: 12px 0 0 12px;
}

.sv-wiki-monster-combat__card--hp::before {
    background: linear-gradient(180deg, #ff5577, #ff8aa8);
    box-shadow: 0 0 14px rgba(255, 85, 120, 0.45);
}

.sv-wiki-monster-combat__card--hit::before {
    background: linear-gradient(180deg, #39d0ff, #7ae4ff);
    box-shadow: 0 0 14px rgba(57, 208, 255, 0.4);
}

.sv-wiki-monster-combat__card--flee::before {
    background: linear-gradient(180deg, #00c878, var(--accent-2));
    box-shadow: 0 0 14px rgba(0, 255, 168, 0.35);
}

.sv-wiki-monster-combat__card-label {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--muted);
}

.sv-wiki-monster-combat__card-value {
    font-size: 28px;
    font-weight: 800;
    font-family: ui-monospace, monospace;
    line-height: 1.1;
    color: #f4f7fb;
}

.sv-wiki-monster-combat__card--hp .sv-wiki-monster-combat__card-value {
    color: #ff8aa8;
}

.sv-wiki-monster-combat__card--hit .sv-wiki-monster-combat__card-value {
    color: #7ae4ff;
}

.sv-wiki-monster-combat__card--flee .sv-wiki-monster-combat__card-value {
    color: var(--accent-2);
}

.sv-wiki-monster-combat__card-sub {
    font-size: 11px;
    color: var(--muted);
    font-family: ui-monospace, monospace;
}

.sv-wiki-monster-combat__panel {
    padding: 14px;
    border-radius: 12px;
    border: 1px solid #2a3144;
    background: rgba(10, 12, 18, 0.7);
}

.sv-wiki-monster-combat__panel-title {
    margin: 0 0 4px;
    font-size: 11px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--muted);
}

.sv-wiki-monster-combat__panel-lede {
    margin: 0 0 12px;
    font-size: 12px;
    color: var(--muted);
    font-family: ui-monospace, monospace;
}

.sv-wiki-monster-combat__attrs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px 16px;
}

.sv-wiki-monster-combat__attr-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 4px;
}

.sv-wiki-monster-combat__attr-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: #c8d0dc;
}

.sv-wiki-monster-combat__attr-value {
    font-family: ui-monospace, monospace;
    font-size: 14px;
    font-weight: 700;
}

.sv-wiki-monster-combat__attr-track {
    height: 6px;
    border-radius: 999px;
    background: #1a2030;
    border: 1px solid #2a3144;
    overflow: hidden;
    margin-bottom: 4px;
}

.sv-wiki-monster-combat__attr-fill {
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(57, 208, 255, 0.5), var(--accent));
}

.sv-wiki-monster-combat__attr-fill--str { background: linear-gradient(90deg, #cc4455, #ff6677); }
.sv-wiki-monster-combat__attr-fill--vit { background: linear-gradient(90deg, #cc8844, #ffaa55); }
.sv-wiki-monster-combat__attr-fill--agi { background: linear-gradient(90deg, #44aa66, #66cc88); }
.sv-wiki-monster-combat__attr-fill--int { background: linear-gradient(90deg, #6644cc, #8866ff); }
.sv-wiki-monster-combat__attr-fill--dex { background: linear-gradient(90deg, #4488cc, #66aaff); }
.sv-wiki-monster-combat__attr-fill--luck { background: linear-gradient(90deg, #ccaa44, #ffcc66); }

.sv-wiki-monster-combat__attr-formula {
    font-size: 10px;
    color: var(--muted);
    font-family: ui-monospace, monospace;
}

.sv-wiki-monster-combat__formulas {
    margin-top: 14px;
    font-size: 12px;
    color: var(--muted);
}

.sv-wiki-monster-combat__formulas summary {
    cursor: pointer;
    font-weight: 600;
    color: #c8d0dc;
    letter-spacing: 0.04em;
}

.sv-wiki-monster-combat__formula-list {
    margin: 10px 0 0;
    padding-left: 18px;
    line-height: 1.6;
}

.sv-wiki-monster-combat__formula-list li {
    margin-bottom: 4px;
}

@media (max-width: 768px) {
    .sv-wiki-monster-combat__hero {
        grid-template-columns: 1fr;
    }
    .sv-wiki-monster-combat__attrs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 480px) {
    .sv-wiki-monster-combat__attrs {
        grid-template-columns: 1fr;
    }
}

/* Grimoire directory */
.sv-wiki-directory-grimoire__hero .sv-wiki__icon-frame .fa {
    color: #b88cff;
}

.sv-wiki-directory-grimoire__intro {
    margin-bottom: 18px;
    padding: 16px 18px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(120, 70, 220, 0.08), rgba(57, 208, 255, 0.04));
}

.sv-wiki-directory-grimoire__intro-title {
    margin: 0 0 8px;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #c8b4ff;
}

.sv-wiki-directory-grimoire__intro-lede {
    margin: 0 0 10px;
    color: var(--ink);
    line-height: 1.6;
}

.sv-wiki-directory-grimoire__intro-links {
    margin: 0;
    padding-left: 0;
    list-style: none;
    display: grid;
    gap: 6px;
    color: var(--muted);
    font-size: 13px;
}

.sv-wiki-directory-grimoire__intro-links .fa {
    color: #b88cff;
    width: 16px;
    margin-right: 6px;
}

.sv-wiki-directory-grimoire__stats,
.sv-wiki-directory-grimoire__toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    margin-bottom: 14px;
}

.sv-wiki-directory-grimoire__stats-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
    font-weight: 600;
}

.sv-wiki-directory-grimoire__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.sv-wiki-directory-grimoire__chip {
    border: 1px solid #2a3144;
    background: #0e1118;
    color: var(--ink);
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.sv-wiki-directory-grimoire__chip:hover,
.sv-wiki-directory-grimoire__chip.is-active {
    border-color: rgba(184, 140, 255, 0.55);
    background: rgba(184, 140, 255, 0.1);
    color: #e8dcff;
}

.sv-wiki-directory-grimoire__toolbar .sv-wiki-directory__search {
    flex: 1;
    min-width: 220px;
}

.sv-wiki-directory-grimoire__field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-grimoire__field select {
    background: #0e1118;
    border: 1px solid #1e2430;
    color: #fff;
    border-radius: 10px;
    padding: 8px 10px;
}

.sv-wiki-directory-grimoire__clear {
    border: 1px solid #2a3144;
    background: #0e1118;
    color: var(--ink);
    border-radius: 10px;
    padding: 8px 12px;
    cursor: pointer;
}

.sv-wiki-directory-grimoire__group {
    margin-bottom: 22px;
    padding: 14px;
    border: 1px solid #263042;
    border-radius: 12px;
    background: rgba(12, 14, 20, 0.65);
}

.sv-wiki-directory-grimoire__group.is-hidden {
    display: none;
}

.sv-wiki-directory-grimoire__group-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
    margin-bottom: 10px;
}

.sv-wiki-directory-grimoire__group-title {
    margin: 0;
    font-size: 18px;
}

.sv-wiki-directory-grimoire__group-meta {
    font-size: 12px;
    color: var(--muted);
}

.sv-wiki-directory-grimoire__item {
    display: flex;
    align-items: center;
    gap: 10px;
}

.sv-wiki-directory-grimoire__thumb-wrap {
    flex-shrink: 0;
}

.sv-wiki-directory-grimoire__thumb {
    width: 36px;
    height: 36px;
    object-fit: contain;
    border-radius: 6px;
    background: #0e1118;
    border: 1px solid #2a3144;
}

.sv-wiki-directory-grimoire__name {
    font-weight: 700;
    color: var(--ink);
    text-decoration: none;
}

.sv-wiki-directory-grimoire__name:hover {
    color: #c8b4ff;
}

.sv-wiki-directory-grimoire__meta {
    display: block;
    font-size: 11px;
    color: var(--muted);
    margin-top: 2px;
}

.sv-wiki-directory-grimoire__id {
    display: block;
    font-size: 11px;
    color: var(--muted);
    font-family: ui-monospace, monospace;
    margin-top: 2px;
}

.sv-wiki-directory-grimoire__passive {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.sv-wiki-directory-grimoire__passive-title {
    font-size: 12px;
    font-weight: 700;
    color: #8fd48f;
    text-decoration: none;
}

a.sv-wiki-directory-grimoire__passive-title:hover {
    color: #b4f0b4;
}

.sv-wiki-directory-grimoire__bonuses {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.sv-wiki-directory-grimoire__bonus {
    display: block;
    font-size: 11px;
    color: #d8deea;
    line-height: 1.35;
}

.sv-wiki-directory-grimoire__bonus-more,
.sv-wiki-directory-grimoire__passive-summary {
    font-size: 11px;
    color: var(--muted);
    line-height: 1.35;
}

.sv-wiki-directory-grimoire__tier {
    font-family: ui-monospace, monospace;
    font-weight: 700;
    color: #c8b4ff;
}

.sv-wiki-directory-grimoire__variant {
    display: inline-flex;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.sv-wiki-directory-grimoire__variant--base {
    color: var(--accent);
    background: rgba(57, 208, 255, 0.1);
    border: 1px solid rgba(57, 208, 255, 0.3);
}

.sv-wiki-directory-grimoire__variant--adv {
    color: #e8b4ff;
    background: rgba(184, 140, 255, 0.12);
    border: 1px solid rgba(184, 140, 255, 0.35);
}

.sv-wiki-directory-grimoire__row.is-hidden {
    display: none;
}

.sv-wiki-directory-grimoire__count {
    margin-top: 12px;
    font-size: 12px;
    color: var(--muted);
}

.sv-wiki-sidebar__item--grimoire .fa {
    color: #b88cff;
}

.sv-wiki-home__card--grimoire .sv-wiki-home__card-icon {
    color: #b88cff;
}

.sv-wiki-grimoire-detail {
    margin-bottom: 18px;
}

.sv-wiki-grimoire-detail__grant {
    margin-top: 12px;
    padding: 12px 14px;
    border-radius: 10px;
    border: 1px solid rgba(184, 140, 255, 0.25);
    background: rgba(184, 140, 255, 0.06);
}

.sv-wiki-grimoire-detail__grant-title {
    margin: 0 0 6px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #c8b4ff;
}

.sv-wiki-grimoire-detail__grant-body {
    margin: 0;
}

.sv-wiki-grimoire-detail__more {
    margin-top: 12px;
    font-size: 13px;
}

/* Skills directory */
.sv-wiki-directory-skill__stats {
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: #0f131b;
}

.sv-wiki-directory-skill__stats-label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
    margin-bottom: 8px;
}

.sv-wiki-directory-skill__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.sv-wiki-directory-skill__chip {
    background: #0e1118;
    border: 1px solid #2a3144;
    color: var(--ink);
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 12px;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.sv-wiki-directory-skill__chip:hover,
.sv-wiki-directory-skill__chip.is-active {
    border-color: var(--accent);
    background: rgba(57, 208, 255, 0.08);
}

.sv-wiki-directory-skill__chip--element {
    border-color: color-mix(in srgb, var(--chip-color, var(--accent)) 45%, #2a3144);
}

.sv-wiki-directory-skill__chip--element::before {
    content: '';
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 6px;
    background: var(--chip-color, var(--accent));
    box-shadow: 0 0 6px var(--chip-color, var(--accent));
    vertical-align: middle;
}

.sv-wiki-directory-skill__chip .count {
    opacity: 0.7;
    margin-left: 2px;
}

.sv-wiki-directory-skill__toolbar {
    margin-bottom: 14px;
}

.sv-wiki-directory-skill__filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
    align-items: flex-end;
}

.sv-wiki-directory-skill__field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 11px;
    color: var(--muted);
    min-width: 0;
}

.sv-wiki-directory-skill__field select {
    box-sizing: border-box;
    background: #0e1118;
    border: 1px solid #1e2430;
    color: #fff;
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 12px;
    min-width: 110px;
}

.sv-wiki-directory-skill__clear {
    background: transparent;
    border: 1px solid #2a3144;
    color: var(--muted);
    border-radius: 8px;
    padding: 7px 12px;
    font-size: 12px;
    cursor: pointer;
}

.sv-wiki-directory-skill__clear:hover {
    border-color: var(--accent);
    color: var(--ink);
}

.sv-wiki-directory-skill__card {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
}

.sv-wiki-directory-skill__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-skill__element {
    color: var(--element-color, var(--accent));
    font-weight: 600;
}

.sv-wiki-directory-skill__types {
    opacity: 0.85;
}

.sv-wiki-directory-skill__stats-line {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 11px;
    color: #9aa8c2;
}

.sv-wiki-directory-skill__stats-line i {
    opacity: 0.75;
    margin-right: 3px;
}

.sv-wiki-directory-skill__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 2px;
}

.sv-wiki-directory-skill__badge {
    display: inline-block;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 2px 7px;
    border-radius: 999px;
    border: 1px solid #2a3144;
    background: #0e1118;
    color: var(--muted);
}

.sv-wiki-directory-skill__badge--status {
    border-color: rgba(92, 214, 160, 0.35);
    color: #8fe8be;
}

.sv-wiki-directory-skill__badge--prereq,
.sv-wiki-directory-skill__badge--tree {
    border-color: rgba(184, 140, 255, 0.35);
    color: #c8b4ff;
}

.sv-wiki-directory-skill__badge--monster {
    border-color: rgba(255, 140, 120, 0.35);
    color: #ffb0a0;
}

.sv-wiki-directory-skill__badge--gem {
    border-color: rgba(57, 208, 255, 0.35);
    color: #7de4ff;
}

.sv-wiki-directory-skill__count {
    margin-top: 12px;
    font-size: 12px;
    color: var(--muted);
    text-align: right;
}

.sv-wiki-directory-skill__card.is-hidden {
    display: none !important;
}

@media (max-width: 720px) {
    .sv-wiki-directory-skill__filter-row {
        flex-direction: column;
        align-items: stretch;
    }

    .sv-wiki-directory-skill__field select {
        width: 100%;
    }
}

/* Maps directory */
.sv-wiki-directory-map__stats {
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: #0f131b;
}

.sv-wiki-directory-map__stats-label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
    margin-bottom: 8px;
}

.sv-wiki-directory-map__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.sv-wiki-directory-map__chip {
    background: #0e1118;
    border: 1px solid #2a3144;
    color: var(--ink);
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 12px;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.sv-wiki-directory-map__chip:hover,
.sv-wiki-directory-map__chip.is-active {
    border-color: var(--accent);
    background: rgba(57, 208, 255, 0.08);
}

.sv-wiki-directory-map__chip .count {
    opacity: 0.7;
    margin-left: 2px;
}

.sv-wiki-directory-map__toolbar {
    margin-bottom: 14px;
}

.sv-wiki-directory-map__filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
    align-items: flex-end;
}

.sv-wiki-directory-map__filter-group--level {
    display: flex;
    gap: 8px;
}

.sv-wiki-directory-map__field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-map__field--narrow {
    width: 84px;
}

.sv-wiki-directory-map__field select,
.sv-wiki-directory-map__field input[type="number"] {
    box-sizing: border-box;
    background: #0e1118;
    border: 1px solid #1e2430;
    color: #fff;
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 12px;
    min-width: 110px;
}

.sv-wiki-directory-map__clear {
    background: transparent;
    border: 1px solid #2a3144;
    color: var(--muted);
    border-radius: 8px;
    padding: 7px 12px;
    font-size: 12px;
    cursor: pointer;
}

.sv-wiki-directory-map__grid {
    gap: 12px;
}

.sv-wiki-directory-map__card {
    flex-direction: row;
    align-items: flex-start;
    gap: 12px;
}

.sv-wiki-directory-map__icon-wrap {
    position: relative;
    flex-shrink: 0;
    width: 52px;
    height: 52px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #121722;
    border: 1px solid #2a3144;
    color: var(--accent);
    font-size: 20px;
}

.sv-wiki-directory-map__icon-wrap--forest { border-color: rgba(92, 214, 160, 0.35); color: #8fe8be; }
.sv-wiki-directory-map__icon-wrap--dungeon { border-color: rgba(184, 140, 255, 0.35); color: #c8b4ff; }
.sv-wiki-directory-map__icon-wrap--desert { border-color: rgba(255, 196, 120, 0.35); color: #ffd08a; }
.sv-wiki-directory-map__icon-wrap--water { border-color: rgba(57, 208, 255, 0.35); color: #7de4ff; }
.sv-wiki-directory-map__icon-wrap--cave { border-color: rgba(160, 160, 180, 0.35); color: #b8b8d0; }
.sv-wiki-directory-map__icon-wrap--volcano { border-color: rgba(255, 120, 90, 0.35); color: #ff9a80; }
.sv-wiki-directory-map__icon-wrap--snow { border-color: rgba(200, 220, 255, 0.35); color: #d8e8ff; }

.sv-wiki-directory-map__boss-badge {
    position: absolute;
    top: -4px;
    right: -4px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #ff6b4a;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #0f131b;
}

.sv-wiki-directory-map__meta,
.sv-wiki-directory-map__stats-line,
.sv-wiki-directory-map__elements {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-map__biome {
    font-weight: 600;
    color: var(--ink);
}

.sv-wiki-directory-map__level {
    font-size: 12px;
    color: #9aa8c2;
}

.sv-wiki-directory-map__element {
    padding: 2px 7px;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--element-color, var(--accent)) 40%, #2a3144);
    color: var(--element-color, var(--accent));
    font-size: 10px;
}

.sv-wiki-directory-map__element-more {
    opacity: 0.7;
    font-size: 10px;
}

.sv-wiki-directory-map__count {
    margin-top: 12px;
    font-size: 12px;
    color: var(--muted);
    text-align: right;
}

.sv-wiki-directory-map__card.is-hidden {
    display: none !important;
}

/* Map detail explorer */
.sv-wiki-map-explorer {
    margin: 18px 0;
    padding: 14px 16px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: #0f131b;
}

.sv-wiki-map-explorer__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.sv-wiki-map-explorer__chip {
    position: relative;
    overflow: hidden;
    background: #0e1118;
    border: 1px solid #2a3144;
    color: var(--ink);
    border-radius: 999px;
    padding: 8px 14px;
    font-size: 12px;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.sv-wiki-map-explorer__chip:hover,
.sv-wiki-map-explorer__chip.is-active {
    border-color: var(--accent);
    background: rgba(57, 208, 255, 0.08);
}

.sv-wiki-map-explorer__chip .count {
    opacity: 0.75;
    margin-left: 4px;
}

.sv-wiki-map-explorer__chip-bar {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 3px;
    background: var(--accent);
    opacity: 0.45;
    pointer-events: none;
}

.sv-wiki-map-monsters__role {
    display: inline-block;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 2px 7px;
    border-radius: 999px;
    border: 1px solid #2a3144;
}

.sv-wiki-map-monsters__role--boss {
    border-color: rgba(255, 107, 74, 0.45);
    color: #ff9a80;
}

.sv-wiki-map-monsters__role--pool {
    color: var(--muted);
}

.sv-wiki-map-monsters__card {
    color: #c8b4ff;
    font-weight: 600;
}

.sv-wiki-map-monsters__row.is-hidden,
.sv-wiki__table tbody tr.is-hidden {
    display: none;
}

.sv-wiki-map-connections__services {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 20px;
}

@media (max-width: 720px) {
    .sv-wiki-directory-map__filter-row {
        flex-direction: column;
        align-items: stretch;
    }

    .sv-wiki-directory-map__field select,
    .sv-wiki-directory-map__field input[type="number"] {
        width: 100%;
    }
}

/* Skill passives directory */
.sv-wiki-directory-skillpassive__stats {
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: #0f131b;
}

.sv-wiki-directory-skillpassive__stats--secondary {
    margin-top: -6px;
}

.sv-wiki-directory-skillpassive__stats-label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
    margin-bottom: 8px;
}

.sv-wiki-directory-skillpassive__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.sv-wiki-directory-skillpassive__chip {
    background: #0e1118;
    border: 1px solid #2a3144;
    color: var(--ink);
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 12px;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.sv-wiki-directory-skillpassive__chip:hover,
.sv-wiki-directory-skillpassive__chip.is-active {
    border-color: var(--accent);
    background: rgba(57, 208, 255, 0.08);
}

.sv-wiki-directory-skillpassive__chip .count {
    opacity: 0.7;
    margin-left: 2px;
}

.sv-wiki-directory-skillpassive__toolbar {
    margin-bottom: 14px;
}

.sv-wiki-directory-skillpassive__filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
    align-items: flex-end;
}

.sv-wiki-directory-skillpassive__field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-skillpassive__field--narrow {
    width: 96px;
}

.sv-wiki-directory-skillpassive__field select {
    box-sizing: border-box;
    background: #0e1118;
    border: 1px solid #1e2430;
    color: #fff;
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 12px;
    min-width: 110px;
}

.sv-wiki-directory-skillpassive__clear {
    background: transparent;
    border: 1px solid #2a3144;
    color: var(--muted);
    border-radius: 8px;
    padding: 7px 12px;
    font-size: 12px;
    cursor: pointer;
}

.sv-wiki-directory-skillpassive__clear:hover {
    border-color: var(--accent);
    color: var(--ink);
}

.sv-wiki-directory-skillpassive__card {
    flex-direction: column;
    align-items: stretch;
}

.sv-wiki-directory-skillpassive__card .sv-wiki-directory__icon-wrap {
    position: relative;
}

.sv-wiki-directory-skillpassive__tier-badge {
    position: absolute;
    right: -4px;
    bottom: -4px;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    border-radius: 999px;
    background: #1a2030;
    border: 1px solid rgba(184, 140, 255, 0.45);
    color: #c8b4ff;
    font-size: 10px;
    font-weight: 700;
    line-height: 18px;
    text-align: center;
}

.sv-wiki-directory-skillpassive__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 10px;
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-skillpassive__class {
    color: #8fe8be;
    font-weight: 600;
}

.sv-wiki-directory-skillpassive__summary {
    display: block;
    font-size: 11px;
    color: var(--muted);
    line-height: 1.45;
    margin-top: 4px;
}

.sv-wiki-directory-skillpassive__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 6px;
}

.sv-wiki-directory-skillpassive__badge {
    display: inline-block;
    font-size: 10px;
    padding: 2px 7px;
    border-radius: 999px;
    border: 1px solid #2a3144;
    color: var(--muted);
}

.sv-wiki-directory-skillpassive__badge--grimoire {
    border-color: rgba(255, 200, 120, 0.35);
    color: #ffd9a0;
}

.sv-wiki-directory-skillpassive__badge--grant {
    border-color: rgba(57, 208, 255, 0.35);
    color: #7de4ff;
}

.sv-wiki-directory-skillpassive__badge--trigger {
    border-color: rgba(184, 140, 255, 0.35);
    color: #c8b4ff;
}

.sv-wiki-directory-skillpassive__badge--status {
    border-color: rgba(92, 214, 160, 0.35);
    color: #8fe8be;
}

.sv-wiki-directory-skillpassive__count {
    margin-top: 12px;
    font-size: 12px;
    color: var(--muted);
    text-align: right;
}

.sv-wiki-directory-skillpassive__card.is-hidden {
    display: none !important;
}

@media (max-width: 720px) {
    .sv-wiki-directory-skillpassive__filter-row {
        flex-direction: column;
        align-items: stretch;
    }

    .sv-wiki-directory-skillpassive__field select {
        width: 100%;
    }
}

/* Status effects directory */
.sv-wiki-directory-status__stats {
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: #0f131b;
}

.sv-wiki-directory-status__stats--secondary {
    margin-top: -6px;
}

.sv-wiki-directory-status__stats-label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
    margin-bottom: 8px;
}

.sv-wiki-directory-status__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.sv-wiki-directory-status__chip {
    background: #0e1118;
    border: 1px solid #2a3144;
    color: var(--ink);
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 12px;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.sv-wiki-directory-status__chip:hover,
.sv-wiki-directory-status__chip.is-active {
    border-color: var(--accent);
    background: rgba(57, 208, 255, 0.08);
}

.sv-wiki-directory-status__chip--element {
    border-color: color-mix(in srgb, var(--chip-color, var(--accent)) 45%, #2a3144);
}

.sv-wiki-directory-status__chip--element::before {
    content: '';
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 6px;
    background: var(--chip-color, var(--accent));
    vertical-align: middle;
}

.sv-wiki-directory-status__chip .count {
    opacity: 0.7;
    margin-left: 2px;
}

.sv-wiki-directory-status__toolbar {
    margin-bottom: 14px;
}

.sv-wiki-directory-status__filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
    align-items: flex-end;
}

.sv-wiki-directory-status__field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-status__field select {
    box-sizing: border-box;
    background: #0e1118;
    border: 1px solid #1e2430;
    color: #fff;
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 12px;
    min-width: 110px;
}

.sv-wiki-directory-status__clear {
    background: transparent;
    border: 1px solid #2a3144;
    color: var(--muted);
    border-radius: 8px;
    padding: 7px 12px;
    font-size: 12px;
    cursor: pointer;
}

.sv-wiki-directory-status__clear:hover {
    border-color: var(--accent);
    color: var(--ink);
}

.sv-wiki-directory-status__card {
    flex-direction: column;
    align-items: stretch;
}

.sv-wiki-directory-status__card .sv-wiki-directory__icon-wrap {
    position: relative;
}

.sv-wiki-directory-status__category-badge {
    position: absolute;
    right: -4px;
    bottom: -4px;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    border-radius: 999px;
    background: #1a2030;
    font-size: 10px;
    font-weight: 700;
    line-height: 18px;
    text-align: center;
}

.sv-wiki-directory-status__category-badge--buff {
    border: 1px solid rgba(92, 214, 160, 0.45);
    color: #8fe8be;
}

.sv-wiki-directory-status__category-badge--debuff {
    border: 1px solid rgba(255, 140, 120, 0.45);
    color: #ffb0a0;
}

.sv-wiki-directory-status__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 10px;
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-status__category--buff {
    color: #8fe8be;
    font-weight: 600;
}

.sv-wiki-directory-status__category--debuff {
    color: #ffb0a0;
    font-weight: 600;
}

.sv-wiki-directory-status__element {
    color: var(--element-color, var(--accent));
    font-weight: 600;
}

.sv-wiki-directory-status__summary {
    display: block;
    font-size: 11px;
    color: var(--muted);
    line-height: 1.45;
    margin-top: 4px;
}

.sv-wiki-directory-status__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 6px;
}

.sv-wiki-directory-status__badge {
    display: inline-block;
    font-size: 10px;
    padding: 2px 7px;
    border-radius: 999px;
    border: 1px solid #2a3144;
    color: var(--muted);
}

.sv-wiki-directory-status__badge--skill {
    border-color: rgba(57, 208, 255, 0.35);
    color: #7de4ff;
}

.sv-wiki-directory-status__badge--monster {
    border-color: rgba(255, 140, 120, 0.35);
    color: #ffb0a0;
}

.sv-wiki-directory-status__badge--passive {
    border-color: rgba(184, 140, 255, 0.35);
    color: #c8b4ff;
}

.sv-wiki-directory-status__badge--chain {
    border-color: rgba(255, 200, 120, 0.35);
    color: #ffd9a0;
}

.sv-wiki-directory-status__count {
    margin-top: 12px;
    font-size: 12px;
    color: var(--muted);
    text-align: right;
}

.sv-wiki-directory-status__card.is-hidden {
    display: none !important;
}

@media (max-width: 720px) {
    .sv-wiki-directory-status__filter-row {
        flex-direction: column;
        align-items: stretch;
    }

    .sv-wiki-directory-status__field select {
        width: 100%;
    }
}

/* Summons directory */
.sv-wiki-directory-summon__stats {
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: #0f131b;
}

.sv-wiki-directory-summon__stats-label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
    margin-bottom: 8px;
}

.sv-wiki-directory-summon__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.sv-wiki-directory-summon__chip {
    background: #0e1118;
    border: 1px solid #2a3144;
    color: var(--ink);
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 12px;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.sv-wiki-directory-summon__chip:hover,
.sv-wiki-directory-summon__chip.is-active {
    border-color: var(--accent);
    background: rgba(57, 208, 255, 0.08);
}

.sv-wiki-directory-summon__chip .count {
    opacity: 0.7;
    margin-left: 2px;
}

.sv-wiki-directory-summon__toolbar {
    margin-bottom: 14px;
}

.sv-wiki-directory-summon__filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
    align-items: flex-end;
}

.sv-wiki-directory-summon__field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-summon__field--narrow {
    width: 96px;
}

.sv-wiki-directory-summon__field select {
    box-sizing: border-box;
    background: #0e1118;
    border: 1px solid #1e2430;
    color: #fff;
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 12px;
    min-width: 110px;
}

.sv-wiki-directory-summon__clear {
    background: transparent;
    border: 1px solid #2a3144;
    color: var(--muted);
    border-radius: 8px;
    padding: 7px 12px;
    font-size: 12px;
    cursor: pointer;
}

.sv-wiki-directory-summon__clear:hover {
    border-color: var(--accent);
    color: var(--ink);
}

.sv-wiki-directory-summon__card {
    flex-direction: column;
    align-items: stretch;
}

.sv-wiki-directory-summon__card .sv-wiki-directory__icon-wrap {
    position: relative;
}

.sv-wiki-directory-summon__stage-badge {
    position: absolute;
    right: -4px;
    bottom: -4px;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    border-radius: 999px;
    background: #1a2030;
    border: 1px solid rgba(255, 200, 120, 0.45);
    color: #ffd9a0;
    font-size: 10px;
    font-weight: 700;
    line-height: 18px;
    text-align: center;
}

.sv-wiki-directory-summon__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 10px;
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-summon__skills {
    color: #7de4ff;
    font-weight: 600;
}

.sv-wiki-directory-summon__stages {
    color: #ffd9a0;
    font-weight: 600;
}

.sv-wiki-directory-summon__hostile {
    color: #ffb0a0;
    font-weight: 600;
}

.sv-wiki-directory-summon__summary {
    display: block;
    font-size: 11px;
    color: var(--muted);
    line-height: 1.45;
    margin-top: 4px;
}

.sv-wiki-directory-summon__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 6px;
}

.sv-wiki-directory-summon__badge {
    display: inline-block;
    font-size: 10px;
    padding: 2px 7px;
    border-radius: 999px;
    border: 1px solid #2a3144;
    color: var(--muted);
}

.sv-wiki-directory-summon__badge--skill {
    border-color: rgba(57, 208, 255, 0.35);
    color: #7de4ff;
}

.sv-wiki-directory-summon__badge--monster {
    border-color: rgba(255, 140, 120, 0.35);
    color: #ffb0a0;
}

.sv-wiki-directory-summon__badge--status {
    border-color: rgba(92, 214, 160, 0.35);
    color: #8fe8be;
}

.sv-wiki-directory-summon__count {
    margin-top: 12px;
    font-size: 12px;
    color: var(--muted);
    text-align: right;
}

.sv-wiki-directory-summon__card.is-hidden {
    display: none !important;
}

@media (max-width: 720px) {
    .sv-wiki-directory-summon__filter-row {
        flex-direction: column;
        align-items: stretch;
    }

    .sv-wiki-directory-summon__field select {
        width: 100%;
    }
}

/* Cards directory */
.sv-wiki-directory-card__stats {
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: #0f131b;
}

.sv-wiki-directory-card__stats--secondary {
    margin-top: -6px;
}

.sv-wiki-directory-card__stats-label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
    margin-bottom: 8px;
}

.sv-wiki-directory-card__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.sv-wiki-directory-card__chip {
    background: #0e1118;
    border: 1px solid #2a3144;
    color: var(--ink);
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 12px;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.sv-wiki-directory-card__chip:hover,
.sv-wiki-directory-card__chip.is-active {
    border-color: var(--accent);
    background: rgba(57, 208, 255, 0.08);
}

.sv-wiki-directory-card__chip .count {
    opacity: 0.7;
    margin-left: 2px;
}

.sv-wiki-directory-card__toolbar {
    margin-bottom: 14px;
}

.sv-wiki-directory-card__filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
    align-items: flex-end;
}

.sv-wiki-directory-card__field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-card__field select {
    box-sizing: border-box;
    background: #0e1118;
    border: 1px solid #1e2430;
    color: #fff;
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 12px;
    min-width: 110px;
}

.sv-wiki-directory-card__clear {
    background: transparent;
    border: 1px solid #2a3144;
    color: var(--muted);
    border-radius: 8px;
    padding: 7px 12px;
    font-size: 12px;
    cursor: pointer;
}

.sv-wiki-directory-card__clear:hover {
    border-color: var(--accent);
    color: var(--ink);
}

.sv-wiki-directory-card__card {
    flex-direction: column;
    align-items: stretch;
}

.sv-wiki-directory-card__card .sv-wiki-directory__icon-wrap {
    position: relative;
}

.sv-wiki-directory-card__boss-badge,
.sv-wiki-directory-card__unique-badge {
    position: absolute;
    right: -4px;
    bottom: -4px;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    line-height: 18px;
    text-align: center;
}

.sv-wiki-directory-card__boss-badge {
    background: #2a1820;
    border: 1px solid rgba(255, 140, 120, 0.45);
    color: #ffb0a0;
}

.sv-wiki-directory-card__unique-badge {
    background: #1a2030;
    border: 1px solid rgba(120, 180, 255, 0.45);
    color: #a8d4ff;
}

.sv-wiki-directory-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 10px;
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-card__slot {
    color: #ffd9a0;
    font-weight: 600;
}

.sv-wiki-directory-card__affix {
    color: #7de4ff;
    font-weight: 600;
}

.sv-wiki-directory-card__summary {
    display: block;
    font-size: 11px;
    color: var(--muted);
    line-height: 1.45;
    margin-top: 4px;
}

.sv-wiki-directory-card__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 6px;
}

.sv-wiki-directory-card__badge {
    display: inline-block;
    font-size: 10px;
    padding: 2px 7px;
    border-radius: 999px;
    border: 1px solid #2a3144;
    color: var(--muted);
}

.sv-wiki-directory-card__badge--drop {
    border-color: rgba(255, 140, 120, 0.35);
    color: #ffb0a0;
}

.sv-wiki-directory-card__badge--grant {
    border-color: rgba(57, 208, 255, 0.35);
    color: #7de4ff;
}

.sv-wiki-directory-card__badge--immune {
    border-color: rgba(92, 214, 160, 0.35);
    color: #8fe8be;
}

.sv-wiki-directory-card__count {
    margin-top: 12px;
    font-size: 12px;
    color: var(--muted);
    text-align: right;
}

.sv-wiki-directory-card__card.is-hidden {
    display: none !important;
}

@media (max-width: 720px) {
    .sv-wiki-directory-card__filter-row {
        flex-direction: column;
        align-items: stretch;
    }

    .sv-wiki-directory-card__field select {
        width: 100%;
    }
}

/* Consumables directory */
.sv-wiki-directory-consumable__stats {
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: #0f131b;
}

.sv-wiki-directory-consumable__stats--secondary {
    margin-top: -6px;
}

.sv-wiki-directory-consumable__stats-label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
    margin-bottom: 8px;
}

.sv-wiki-directory-consumable__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.sv-wiki-directory-consumable__chip {
    background: #0e1118;
    border: 1px solid #2a3144;
    color: var(--ink);
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 12px;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.sv-wiki-directory-consumable__chip:hover,
.sv-wiki-directory-consumable__chip.is-active {
    border-color: var(--accent);
    background: rgba(57, 208, 255, 0.08);
}

.sv-wiki-directory-consumable__chip .count {
    opacity: 0.7;
    margin-left: 2px;
}

.sv-wiki-directory-consumable__toolbar {
    margin-bottom: 14px;
}

.sv-wiki-directory-consumable__filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
    align-items: flex-end;
}

.sv-wiki-directory-consumable__field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-consumable__field select {
    box-sizing: border-box;
    background: #0e1118;
    border: 1px solid #1e2430;
    color: #fff;
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 12px;
    min-width: 110px;
}

.sv-wiki-directory-consumable__clear {
    background: transparent;
    border: 1px solid #2a3144;
    color: var(--muted);
    border-radius: 8px;
    padding: 7px 12px;
    font-size: 12px;
    cursor: pointer;
}

.sv-wiki-directory-consumable__clear:hover {
    border-color: var(--accent);
    color: var(--ink);
}

.sv-wiki-directory-consumable__card {
    flex-direction: column;
    align-items: stretch;
}

.sv-wiki-directory-consumable__card .sv-wiki-directory__icon-wrap {
    position: relative;
}

.sv-wiki-directory-consumable__type-badge {
    position: absolute;
    right: -4px;
    bottom: -4px;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    line-height: 18px;
    text-align: center;
}

.sv-wiki-directory-consumable__type-badge--lure {
    background: #2a1820;
    border: 1px solid rgba(255, 140, 120, 0.45);
    color: #ffb0a0;
}

.sv-wiki-directory-consumable__type-badge--chest {
    background: #1a2030;
    border: 1px solid rgba(120, 180, 255, 0.45);
    color: #a8d4ff;
}

.sv-wiki-directory-consumable__type-badge--waystone {
    background: #182820;
    border: 1px solid rgba(92, 214, 160, 0.45);
    color: #8fe8be;
}

.sv-wiki-directory-consumable__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 10px;
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-consumable__type {
    color: #ffd9a0;
    font-weight: 600;
}

.sv-wiki-directory-consumable__reusable {
    color: #8fe8be;
    font-weight: 600;
}

.sv-wiki-directory-consumable__summary {
    display: block;
    font-size: 11px;
    color: var(--muted);
    line-height: 1.45;
    margin-top: 4px;
}

.sv-wiki-directory-consumable__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 6px;
}

.sv-wiki-directory-consumable__badge {
    display: inline-block;
    font-size: 10px;
    padding: 2px 7px;
    border-radius: 999px;
    border: 1px solid #2a3144;
    color: var(--muted);
}

.sv-wiki-directory-consumable__badge--drop {
    border-color: rgba(255, 140, 120, 0.35);
    color: #ffb0a0;
}

.sv-wiki-directory-consumable__badge--craft {
    border-color: rgba(255, 217, 160, 0.35);
    color: #ffd9a0;
}

.sv-wiki-directory-consumable__badge--target {
    border-color: rgba(57, 208, 255, 0.35);
    color: #7de4ff;
}

.sv-wiki-directory-consumable__count {
    margin-top: 12px;
    font-size: 12px;
    color: var(--muted);
    text-align: right;
}

.sv-wiki-directory-consumable__card.is-hidden {
    display: none !important;
}

@media (max-width: 720px) {
    .sv-wiki-directory-consumable__filter-row {
        flex-direction: column;
        align-items: stretch;
    }

    .sv-wiki-directory-consumable__field select {
        width: 100%;
    }
}

/* Cosmetics directory */
.sv-wiki-directory-cosmetic__stats {
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: #0f131b;
}

.sv-wiki-directory-cosmetic__stats--secondary {
    margin-top: -6px;
}

.sv-wiki-directory-cosmetic__stats-label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
    margin-bottom: 8px;
}

.sv-wiki-directory-cosmetic__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.sv-wiki-directory-cosmetic__chip {
    background: #0e1118;
    border: 1px solid #2a3144;
    color: var(--ink);
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 12px;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.sv-wiki-directory-cosmetic__chip:hover,
.sv-wiki-directory-cosmetic__chip.is-active {
    border-color: var(--accent);
    background: rgba(57, 208, 255, 0.08);
}

.sv-wiki-directory-cosmetic__chip .count {
    opacity: 0.7;
    margin-left: 2px;
}

.sv-wiki-directory-cosmetic__toolbar {
    margin-bottom: 14px;
}

.sv-wiki-directory-cosmetic__filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
    align-items: flex-end;
}

.sv-wiki-directory-cosmetic__field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-cosmetic__field--narrow {
    width: 96px;
}

.sv-wiki-directory-cosmetic__field select {
    box-sizing: border-box;
    background: #0e1118;
    border: 1px solid #1e2430;
    color: #fff;
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 12px;
    min-width: 110px;
}

.sv-wiki-directory-cosmetic__clear {
    background: transparent;
    border: 1px solid #2a3144;
    color: var(--muted);
    border-radius: 8px;
    padding: 7px 12px;
    font-size: 12px;
    cursor: pointer;
}

.sv-wiki-directory-cosmetic__clear:hover {
    border-color: var(--accent);
    color: var(--ink);
}

.sv-wiki-directory-cosmetic__card {
    flex-direction: column;
    align-items: stretch;
}

.sv-wiki-directory-cosmetic__card .sv-wiki-directory__icon-wrap {
    position: relative;
}

.sv-wiki-directory-cosmetic__tier-badge {
    position: absolute;
    right: -4px;
    bottom: -4px;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    border-radius: 999px;
    background: #1a2030;
    border: 1px solid rgba(255, 217, 160, 0.45);
    color: #ffd9a0;
    font-size: 10px;
    font-weight: 700;
    line-height: 18px;
    text-align: center;
}

.sv-wiki-directory-cosmetic__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 10px;
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-cosmetic__slot {
    color: #ffd9a0;
    font-weight: 600;
}

.sv-wiki-directory-cosmetic__tier {
    color: #a8d4ff;
    font-weight: 600;
}

.sv-wiki-directory-cosmetic__blend {
    color: #8fe8be;
    font-weight: 600;
}

.sv-wiki-directory-cosmetic__summary {
    display: block;
    font-size: 11px;
    color: var(--muted);
    line-height: 1.45;
    margin-top: 4px;
}

.sv-wiki-directory-cosmetic__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 6px;
}

.sv-wiki-directory-cosmetic__badge {
    display: inline-block;
    font-size: 10px;
    padding: 2px 7px;
    border-radius: 999px;
    border: 1px solid #2a3144;
    color: var(--muted);
}

.sv-wiki-directory-cosmetic__badge--drop {
    border-color: rgba(255, 140, 120, 0.35);
    color: #ffb0a0;
}

.sv-wiki-directory-cosmetic__badge--chest {
    border-color: rgba(120, 180, 255, 0.35);
    color: #a8d4ff;
}

.sv-wiki-directory-cosmetic__badge--monster {
    border-color: rgba(92, 214, 160, 0.35);
    color: #8fe8be;
}

.sv-wiki-directory-cosmetic__count {
    margin-top: 12px;
    font-size: 12px;
    color: var(--muted);
    text-align: right;
}

.sv-wiki-directory-cosmetic__card.is-hidden {
    display: none !important;
}

@media (max-width: 720px) {
    .sv-wiki-directory-cosmetic__filter-row {
        flex-direction: column;
        align-items: stretch;
    }

    .sv-wiki-directory-cosmetic__field select {
        width: 100%;
    }
}

/* Equip sets directory */
.sv-wiki-directory-equipset__stats {
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: #0f131b;
}

.sv-wiki-directory-equipset__stats--secondary {
    margin-top: -6px;
}

.sv-wiki-directory-equipset__stats-label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
    margin-bottom: 8px;
}

.sv-wiki-directory-equipset__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.sv-wiki-directory-equipset__chip {
    background: #0e1118;
    border: 1px solid #2a3144;
    color: var(--ink);
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 12px;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.sv-wiki-directory-equipset__chip:hover,
.sv-wiki-directory-equipset__chip.is-active {
    border-color: var(--accent);
    background: rgba(57, 208, 255, 0.08);
}

.sv-wiki-directory-equipset__chip .count {
    opacity: 0.7;
    margin-left: 2px;
}

.sv-wiki-directory-equipset__toolbar {
    margin-bottom: 14px;
}

.sv-wiki-directory-equipset__filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
    align-items: flex-end;
}

.sv-wiki-directory-equipset__field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-equipset__field--narrow {
    width: 96px;
}

.sv-wiki-directory-equipset__field select {
    box-sizing: border-box;
    background: #0e1118;
    border: 1px solid #1e2430;
    color: #fff;
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 12px;
    min-width: 110px;
}

.sv-wiki-directory-equipset__clear {
    background: transparent;
    border: 1px solid #2a3144;
    color: var(--muted);
    border-radius: 8px;
    padding: 7px 12px;
    font-size: 12px;
    cursor: pointer;
}

.sv-wiki-directory-equipset__clear:hover {
    border-color: var(--accent);
    color: var(--ink);
}

.sv-wiki-directory-equipset__card {
    flex-direction: column;
    align-items: stretch;
}

.sv-wiki-directory-equipset__card .sv-wiki-directory__icon-wrap {
    position: relative;
}

.sv-wiki-directory-equipset__piece-badge {
    position: absolute;
    right: -4px;
    bottom: -4px;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    border-radius: 999px;
    background: #1a2030;
    border: 1px solid rgba(255, 217, 160, 0.45);
    color: #ffd9a0;
    font-size: 10px;
    font-weight: 700;
    line-height: 18px;
    text-align: center;
}

.sv-wiki-directory-equipset__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 10px;
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-equipset__pieces {
    color: #ffd9a0;
    font-weight: 600;
}

.sv-wiki-directory-equipset__effects {
    color: #7de4ff;
    font-weight: 600;
}

.sv-wiki-directory-equipset__summary {
    display: block;
    font-size: 11px;
    color: var(--muted);
    line-height: 1.45;
    margin-top: 4px;
}

.sv-wiki-directory-equipset__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 6px;
}

.sv-wiki-directory-equipset__badge {
    display: inline-block;
    font-size: 10px;
    padding: 2px 7px;
    border-radius: 999px;
    border: 1px solid #2a3144;
    color: var(--muted);
}

.sv-wiki-directory-equipset__badge--grant {
    border-color: rgba(57, 208, 255, 0.35);
    color: #7de4ff;
}

.sv-wiki-directory-equipset__badge--immune {
    border-color: rgba(92, 214, 160, 0.35);
    color: #8fe8be;
}

.sv-wiki-directory-equipset__badge--drop {
    border-color: rgba(255, 140, 120, 0.35);
    color: #ffb0a0;
}

.sv-wiki-directory-equipset__count {
    margin-top: 12px;
    font-size: 12px;
    color: var(--muted);
    text-align: right;
}

.sv-wiki-directory-equipset__card.is-hidden {
    display: none !important;
}

@media (max-width: 720px) {
    .sv-wiki-directory-equipset__filter-row {
        flex-direction: column;
        align-items: stretch;
    }

    .sv-wiki-directory-equipset__field select {
        width: 100%;
    }
}

/* ── Saved builds directory ── */
.sv-wiki-directory-build__toolbar {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 16px;
}

.sv-wiki-directory-build__search-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: stretch;
}

.sv-wiki-directory-build__search-row .sv-wiki-directory__search {
    flex: 1;
    min-width: 220px;
}

.sv-wiki-directory-build__filter-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border: 1px solid #2a3144;
    border-radius: 10px;
    background: #121826;
    color: var(--muted);
    cursor: pointer;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.sv-wiki-directory-build__filter-toggle.is-open,
.sv-wiki-directory-build__filter-toggle.is-active {
    border-color: rgba(57, 208, 255, 0.45);
    color: #7de4ff;
    background: rgba(57, 208, 255, 0.08);
}

.sv-wiki-directory-build__advanced {
    padding: 12px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: rgba(0, 0, 0, 0.18);
}

.sv-wiki-directory-build__advanced[hidden] {
    display: none !important;
}

.sv-wiki-directory-build__advanced-lede {
    margin: 0 0 10px;
    font-size: 12px;
    color: var(--muted);
    line-height: 1.45;
}

.sv-wiki-directory-build__filter-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 10px;
}

.sv-wiki-directory-build__filter-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 12px;
}

.sv-wiki-directory-build__filter-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 700;
    color: #eef3fb;
}

.sv-wiki-directory-build__filter-label i {
    opacity: 0.75;
    font-size: 11px;
}

.sv-wiki-directory-build__filter-input {
    width: 100%;
    box-sizing: border-box;
    padding: 8px 10px;
    border: 1px solid #2a3144;
    border-radius: 8px;
    background: #0d111c;
    color: #eef3fb;
    font-size: 12px;
}

.sv-wiki-directory-build__filter-actions {
    margin-top: 10px;
    display: flex;
    justify-content: flex-end;
}

.sv-wiki-directory-build__filter-clear {
    padding: 6px 12px;
    border: 1px solid #2a3144;
    border-radius: 8px;
    background: transparent;
    color: var(--muted);
    cursor: pointer;
    font-size: 12px;
}

.sv-wiki-directory-build__filter-clear:hover {
    color: #eef3fb;
    border-color: rgba(57, 208, 255, 0.35);
}

.sv-wiki-directory-build__class-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.sv-wiki-directory-build__class-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border: 1px solid #2a3144;
    border-radius: 999px;
    background: #121826;
    color: var(--muted);
    cursor: pointer;
    font-size: 12px;
}

.sv-wiki-directory-build__class-btn.is-active {
    border-color: rgba(57, 208, 255, 0.45);
    color: #7de4ff;
    background: rgba(57, 208, 255, 0.08);
}

.sv-wiki-directory-build__class-count {
    opacity: 0.75;
}

.sv-wiki-directory-build__sort-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
}

.sv-wiki-directory-build__sort-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--muted);
    margin-right: 4px;
}

.sv-wiki-directory-build__sort-btn {
    border: 1px solid #2a3144;
    background: #0d111c;
    color: #9eb0c8;
    border-radius: 999px;
    padding: 5px 12px;
    font-size: 12px;
    cursor: pointer;
}

.sv-wiki-directory-build__sort-btn.is-active,
.sv-wiki-directory-build__sort-btn:hover {
    border-color: rgba(57, 208, 255, 0.45);
    color: #7de4ff;
}

.sv-wiki-directory-build__grid {
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
}

.sv-wiki-directory-build__card {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: #121826;
    color: inherit;
    transition: border-color 0.15s ease, transform 0.15s ease;
}

.sv-wiki-directory-build__card-vote {
    display: flex;
    justify-content: flex-start;
}

.sv-wiki-directory-build__card:hover {
    border-color: rgba(57, 208, 255, 0.4);
    transform: translateY(-1px);
}

.sv-wiki-directory-build__card-hit {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    text-decoration: none;
    color: inherit;
}

.sv-wiki-directory-build__card[hidden] {
    display: none !important;
}

.sv-wiki-directory-build__card-icon {
    width: 56px;
    height: 56px;
    border-radius: 10px;
    overflow: hidden;
    background: #0d111c;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sv-wiki-directory-build__card-icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.sv-wiki-directory-build__card-body {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.sv-wiki-directory-build__card-title {
    font-weight: 700;
    color: #eef3fb;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sv-wiki-directory-build__card-class {
    color: #7de4ff;
    font-size: 12px;
    font-weight: 600;
}

.sv-wiki-directory-build__card-meta,
.sv-wiki-directory-build__card-stats {
    font-size: 11px;
    color: var(--muted);
}

.sv-wiki-directory-build__card-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.sv-wiki-directory-build__card-preview {
    width: 100%;
    padding-top: 8px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.sv-build-card-preview {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 100%;
    min-width: 0;
}

.sv-build-card-preview__row {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    width: 100%;
}

.sv-build-card-preview__label {
    flex-shrink: 0;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--muted);
    min-width: 62px;
}

.sv-build-card-preview__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    justify-content: flex-end;
    min-width: 0;
    flex: 1;
}

.sv-build-card-preview__chip {
    position: relative;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 6px;
    background: rgba(0, 0, 0, 0.35);
    border: 1px solid rgba(255, 255, 255, 0.1);
    overflow: hidden;
    cursor: default;
}

.sv-build-card-preview__chip img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.sv-build-card-preview__chip i {
    font-size: 12px;
    opacity: 0.65;
    color: var(--muted);
}

.sv-build-card-preview__chip--skill .sv-build-card-preview__lv {
    position: absolute;
    right: 0;
    bottom: 0;
    min-width: 12px;
    padding: 0 2px;
    font-size: 9px;
    font-weight: 800;
    line-height: 1.15;
    text-align: center;
    color: #fff;
    background: rgba(0, 0, 0, 0.72);
    border-top-left-radius: 3px;
}

@media (max-width: 520px) {
    .sv-wiki-directory-build__card-hit {
        grid-template-columns: 48px minmax(0, 1fr);
    }

    .sv-wiki-directory-build__search-row {
        flex-direction: column;
    }

    .sv-wiki-directory-build__filter-toggle {
        width: 100%;
        justify-content: center;
    }

    .sv-build-card-preview__chips {
        justify-content: flex-start;
    }
}

.sv-wiki-directory-build__count {
    margin-top: 12px;
    font-size: 12px;
    color: var(--muted);
    text-align: right;
}

.sv-wiki-sidebar__home--builds .count {
    margin-left: auto;
}

/* ── Single saved build ── */
.sv-saved-build__hero {
    display: grid;
    grid-template-columns: 88px 1fr;
    gap: 18px;
    padding: 20px;
    border: 1px solid #2a3144;
    border-radius: 14px;
    background: linear-gradient(180deg, #1a2440, #121826);
    margin-bottom: 18px;
}

.sv-saved-build__hero-icon {
    width: 88px;
    height: 88px;
    border-radius: 12px;
    overflow: hidden;
    background: #0d111c;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 32px;
    color: var(--muted);
}

.sv-saved-build__hero-icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.sv-saved-build__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #7de4ff;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.sv-saved-build__title {
    margin: 6px 0;
    color: #fff;
    font-size: clamp(22px, 3vw, 30px);
}

.sv-saved-build__meta {
    margin: 0 0 14px;
    color: var(--muted);
}

.sv-saved-build__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.sv-saved-build__btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    border: 1px solid #2a3144;
    border-radius: 10px;
    background: #121826;
    color: #eef3fb;
    text-decoration: none;
    font-weight: 600;
}

.sv-saved-build__btn--primary {
    border-color: rgba(57, 208, 255, 0.45);
    background: rgba(57, 208, 255, 0.12);
    color: #7de4ff;
}

.sv-saved-build__section {
    margin-bottom: 18px;
    padding: 16px;
    border: 1px solid #2a3144;
    border-radius: 12px;
    background: #121826;
}

.sv-saved-build__section h2 {
    margin: 0 0 12px;
    font-size: 16px;
    color: #eef3fb;
}

.sv-saved-build__writeup-block {
    margin-bottom: 16px;
}

.sv-saved-build__writeup-block:last-child {
    margin-bottom: 0;
}

.sv-saved-build__writeup-heading {
    margin: 0 0 8px;
    font-size: 14px;
    color: #b06cff;
}

.sv-saved-build__writeup-body {
    font-size: 14px;
    line-height: 1.6;
    color: #c8d0e0;
}

.sv-saved-build__vote {
    margin: 0 0 14px;
}

/* Build Guide embed chips + floating tooltips (wiki summary pages) */
.sv-saved-build__writeup,
.sv-saved-build__writeup-block,
.sv-saved-build__writeup-body {
    position: relative;
    overflow: visible;
    z-index: 5;
}

.sv-build-writeup-embed {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 2px 8px 2px 4px;
    margin: 0 2px;
    border: 1px solid #2a3144;
    border-radius: 6px;
    background: rgba(57, 208, 255, 0.08);
    text-decoration: none;
    color: inherit;
    vertical-align: middle;
    white-space: nowrap;
}

.sv-build-writeup-embed:hover,
.sv-build-writeup-embed:focus-visible {
    border-color: rgba(57, 208, 255, 0.55);
    color: #7de4ff;
}

.sv-build-writeup-embed__icon {
    width: 22px;
    height: 22px;
    object-fit: contain;
}

.sv-build-writeup-embed__label {
    font-size: 12px;
    font-weight: 600;
}

/* Source markup only — floating tip is painted on document.body */
.sv-build-writeup-embed__tip {
    display: none !important;
}

.sv-build-writeup-float-tip {
    position: fixed;
    z-index: 100120;
    width: min(300px, calc(100vw - 16px));
    max-height: min(70vh, 420px);
    overflow: auto;
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px solid rgba(57, 208, 255, 0.45);
    background: rgba(10, 14, 26, 0.98);
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.55);
    color: #e8f1ff;
    white-space: normal;
    text-align: left;
    pointer-events: none;
}

.sv-build-writeup-float-tip[hidden] {
    display: none !important;
}

.sv-build-writeup-float-tip .sv-build-writeup-embed__tip-title,
.sv-build-writeup-embed__tip-title {
    display: block;
    font-size: 13px;
    font-weight: 700;
    color: #9fd0ff;
    margin-bottom: 4px;
}

.sv-build-writeup-float-tip .sv-build-writeup-embed__tip-desc,
.sv-build-writeup-embed__tip-desc {
    display: block;
    font-size: 12px;
    line-height: 1.45;
    color: #d5e4f7;
    margin-bottom: 6px;
}

.sv-build-writeup-float-tip .sv-build-writeup-embed__tip-lines,
.sv-build-writeup-embed__tip-lines {
    margin: 0;
    padding-left: 16px;
    font-size: 11px;
    line-height: 1.4;
    color: #b8c9de;
}

.sv-build-writeup-float-tip .sv-build-writeup-embed__tip-lines li + li,
.sv-build-writeup-embed__tip-lines li + li {
    margin-top: 2px;
}

/* Community build vote controls */
.sv-build-vote {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    user-select: none;
}

.sv-build-vote.is-busy {
    opacity: 0.65;
    pointer-events: none;
}

.sv-build-vote__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 26px;
    padding: 0;
    border: 1px solid #2a3144;
    border-radius: 6px;
    background: #0d111c;
    color: #8aa0b8;
    cursor: pointer;
    line-height: 1;
}

.sv-build-vote__btn:hover {
    border-color: rgba(57, 208, 255, 0.55);
    color: #7de4ff;
}

.sv-build-vote__btn--up.is-active {
    border-color: #3ecf8e;
    color: #3ecf8e;
    background: rgba(62, 207, 142, 0.12);
}

.sv-build-vote__btn--down.is-active {
    border-color: #ff6b7a;
    color: #ff6b7a;
    background: rgba(255, 107, 122, 0.12);
}

.sv-build-vote__score {
    min-width: 2.2em;
    text-align: center;
    font-size: 13px;
    font-weight: 700;
    color: #eef3fb;
    font-variant-numeric: tabular-nums;
}

.sv-build-vote__status {
    margin-left: 6px;
    font-size: 11px;
    color: #ffb4b4;
}

.sv-saved-build__stat-grid,
.sv-saved-build__attr-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 10px;
}

.sv-saved-build__stat,
.sv-saved-build__attr {
    padding: 10px;
    border-radius: 8px;
    background: #0d111c;
    border: 1px solid #222a3d;
}

.sv-saved-build__stat-label,
.sv-saved-build__attr-label {
    display: block;
    font-size: 11px;
    color: var(--muted);
    text-transform: uppercase;
}

.sv-saved-build__stat-value,
.sv-saved-build__attr-value {
    font-size: 18px;
    font-weight: 700;
    color: #fff;
}

.sv-saved-build__item-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.sv-saved-build__item-list li {
    padding: 10px 12px;
    border-radius: 8px;
    background: #0d111c;
    border: 1px solid #222a3d;
}

.sv-saved-build__slot {
    display: inline-block;
    min-width: 90px;
    font-size: 11px;
    color: var(--muted);
    text-transform: uppercase;
}

.sv-saved-build__item-name {
    font-weight: 600;
    color: #eef3fb;
}

.sv-saved-build__item-sub {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: var(--muted);
}

.sv-saved-build__skills-note,
.sv-saved-build__skills-hint {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
}

@media (max-width: 720px) {
    .sv-saved-build__hero {
        grid-template-columns: 1fr;
    }
}