/* /Features/Account/Account.razor.rz.scp.css */
.char-protected[b-d8ytm12e6u] {
    font-size: 11.5px;
    font-weight: 700;
    color: var(--gold-lit);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.modal-backdrop[b-d8ytm12e6u] {
    position: fixed;
    inset: 0;
    z-index: 100;
    background: rgba(7, 5, 4, 0.75);
    backdrop-filter: blur(2px);
    animation: fade-in-b-d8ytm12e6u 160ms var(--ease-out) both;
}

.modal-dialog[b-d8ytm12e6u] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 101;
    width: min(420px, calc(100% - 32px));
    animation: scale-in-b-d8ytm12e6u 180ms var(--ease-out) both;
}

.modal-body[b-d8ytm12e6u] {
    background: linear-gradient(180deg, #f7ecd4, #f0e3c8);
    border: 2px solid var(--gold);
    border-radius: 5px;
    padding: 22px 24px 24px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.55),
                inset 0 0 30px rgba(120, 70, 20, 0.08);
    text-align: center;
}

.modal-title[b-d8ytm12e6u] {
    font-family: var(--font-display);
    font-size: 1.25rem;
    color: var(--blood);
    margin: 0 0 12px;
    text-wrap: balance;
}

.modal-text[b-d8ytm12e6u] {
    font-size: 14px;
    line-height: 1.55;
    color: var(--ink-soft);
    margin: 0 0 22px;
}

.modal-text strong[b-d8ytm12e6u] {
    color: var(--ink);
}

.modal-actions[b-d8ytm12e6u] {
    display: flex;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
}

.modal-actions .btn[b-d8ytm12e6u] {
    padding: 9px 22px;
    font-size: 12.5px;
}

@keyframes fade-in-b-d8ytm12e6u {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes scale-in-b-d8ytm12e6u {
    from { opacity: 0; transform: translate(-50%, -50%) scale(0.96); }
    to { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
    .modal-backdrop[b-d8ytm12e6u],
    .modal-dialog[b-d8ytm12e6u] {
        animation: none;
    }
}

/* ── account dashboard ── */
.acct-info[b-d8ytm12e6u] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0;
    border: 1px solid rgba(58, 36, 16, 0.24);
    border-radius: 4px;
    overflow: hidden;
    background: rgba(58, 36, 16, 0.03);
    margin-bottom: 14px;
}

.ainfo-row[b-d8ytm12e6u] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
    padding: 11px 14px;
    font-size: 13px;
    line-height: 1.35;
    border-bottom: 1px solid rgba(58, 36, 16, 0.14);
}

.ainfo-row:nth-child(odd)[b-d8ytm12e6u] {
    background: rgba(58, 36, 16, 0.055);
}

.ainfo-row span[b-d8ytm12e6u] {
    color: var(--ink-soft);
    font-weight: 600;
    text-transform: capitalize;
}

.ainfo-row b[b-d8ytm12e6u] {
    color: var(--ink);
    font-weight: 700;
    text-align: right;
}

.acct-status[b-d8ytm12e6u] {
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 3px 8px;
    border-radius: 3px;
    border: 1px solid transparent;
}

.acct-status--player[b-d8ytm12e6u] {
    background: rgba(58, 36, 16, 0.08);
    color: var(--ink-soft);
    border-color: rgba(58, 36, 16, 0.25);
}

.acct-status--gm[b-d8ytm12e6u] {
    background: rgba(255, 106, 26, 0.12);
    color: var(--blood);
    border-color: rgba(255, 106, 26, 0.45);
}

.acct-status--staff[b-d8ytm12e6u] {
    background: rgba(179, 22, 15, 0.12);
    color: var(--blood);
    border-color: rgba(179, 22, 15, 0.45);
}

.acct-actions[b-d8ytm12e6u] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.acct-actions .btn[b-d8ytm12e6u] {
    flex: 1 1 auto;
    min-width: 120px;
}

@media (max-width: 560px) {
    .acct-info[b-d8ytm12e6u] {
        grid-template-columns: 1fr;
    }

    .acct-actions .btn[b-d8ytm12e6u] {
        width: 100%;
    }
}
/* /Features/Achievements/Achievements.razor.rz.scp.css */
/* Achievements — scoped styles. Leans on the global parchment theme (.post, .ptable,
   .cats, .pinp, .bst-pill from app.css); only achievement-specific bits live here. */

.ach-search[b-vflmndx9ir] { max-width: 100%; margin: 10px 0 12px; }
.ach-cats[b-vflmndx9ir] { margin-bottom: 10px; }

.ach-secret-toggle[b-vflmndx9ir] {
    display: inline-flex; align-items: center; gap: 8px; margin-bottom: 14px;
    font-size: 13px; color: var(--ink-soft); cursor: pointer;
}
.ach-secret-toggle input[b-vflmndx9ir] {
    width: 16px; height: 16px; accent-color: var(--blood); cursor: pointer;
}

.ach-table td:first-child[b-vflmndx9ir] { white-space: nowrap; }
.ach-grade[b-vflmndx9ir] { color: var(--ink-link); letter-spacing: 1px; }
.ach-req[b-vflmndx9ir] { font-size: 12.5px; line-height: 1.5; }

.ach-count[b-vflmndx9ir] { font-size: 11.5px; color: var(--ink-link); margin-top: 8px; }
.ach-empty[b-vflmndx9ir] { font-size: 13px; color: var(--ink-soft); padding: 8px 0; }

.ach-attribution[b-vflmndx9ir] {
    margin-top: 18px; padding-top: 12px; border-top: 1px solid rgba(58, 36, 16, .2);
    font-size: 11.5px; color: var(--ink-link); font-style: italic;
}
/* /Features/Bestiary/Bestiary.razor.rz.scp.css */
/* Bestiary — scoped styles. Leans on the global parchment theme (.post, .ptable,
   .slots/.slot, .cats, .pinp, .btn-ghost from app.css); only the bestiary-specific
   bits live here. Ink-on-parchment palette via the shared :root variables. */

/* ── search + category filter ── */
.bst-search[b-f9p81tn8mv] { max-width: 100%; margin: 10px 0 12px; }
.bst-cats[b-f9p81tn8mv] { margin-bottom: 14px; }
.bst-pill[b-f9p81tn8mv] {
    font-size: 11.5px; font-weight: 600;
    padding: 4px 10px; border-radius: 3px; cursor: pointer;
    border: 1px solid rgba(138, 52, 16, .35); background: transparent; color: var(--ink-link);
    transition: background .16s var(--ease-out), color .16s var(--ease-out), transform .12s var(--ease-out);
}
.bst-pill:hover[b-f9p81tn8mv] { background: rgba(138, 52, 16, .1); }
.bst-pill:active[b-f9p81tn8mv] { transform: scale(0.98); }
.bst-pill.on[b-f9p81tn8mv] {
    background: linear-gradient(180deg, var(--blood-lit), var(--blood));
    color: #ffe9dd; border-color: var(--blood);
}
.bst-pill.on:hover[b-f9p81tn8mv] { background: linear-gradient(180deg, #ff5533, #c41710); }
.bst-pill:focus-visible[b-f9p81tn8mv] { outline: 2px solid var(--ember); outline-offset: 2px; }

/* ── sortable table ── */
.bst-table th.sortable[b-f9p81tn8mv] {
    cursor: pointer; user-select: none; white-space: nowrap;
    transition: color .16s var(--ease-out), transform .12s var(--ease-out);
}
.bst-table th.sortable:hover[b-f9p81tn8mv] { color: var(--blood); }
.bst-table th.sortable:active[b-f9p81tn8mv] { transform: scale(0.985); }
.bst-row[b-f9p81tn8mv] {
    cursor: pointer;
    transition: background .12s var(--ease-out);
}
.bst-row:active[b-f9p81tn8mv] { background: rgba(138, 52, 16, .08); }
.bst-row.sel[b-f9p81tn8mv] { background: rgba(179, 22, 15, .12); }
.bst-row.sel td:first-child[b-f9p81tn8mv] { color: var(--blood); }
.bst-count[b-f9p81tn8mv] { font-size: 11.5px; color: var(--ink-link); margin-top: 8px; }
.bst-empty[b-f9p81tn8mv] { font-size: 13px; color: var(--ink-soft); padding: 8px 0; }

/* ── detail view ── */
.bst-detail[b-f9p81tn8mv] { position: relative; }
.bst-close[b-f9p81tn8mv] {
    position: absolute; top: 0; right: 0;
    transition: background .16s var(--ease-out), border-color .16s var(--ease-out), box-shadow .16s var(--ease-out), transform .12s var(--ease-out);
}

.bst-head[b-f9p81tn8mv] { display: flex; gap: 16px; align-items: flex-start; margin: 4px 0 6px; }
.bst-portrait[b-f9p81tn8mv] {
    flex: none; width: 84px; height: 84px; display: grid; place-items: center;
    background: linear-gradient(180deg, #1a0f06, #0c0703);
    border: 2px solid #3a2410; border-radius: 4px; box-shadow: inset 0 0 12px rgba(255, 90, 20, .18);
}
.bst-portrait img[b-f9p81tn8mv] { max-width: 72px; max-height: 72px; image-rendering: pixelated; }
.bst-meta[b-f9p81tn8mv] { flex: 1; min-width: 0; }
.bst-cat[b-f9p81tn8mv] {
    font-family: Cinzel, serif; font-weight: 700; font-size: 11.5px; letter-spacing: .08em;
    text-transform: uppercase; color: var(--blood); margin-bottom: 8px;
}
.bst-stats[b-f9p81tn8mv] { grid-template-columns: repeat(4, 1fr); margin-top: 0; }
.bst-stats .slot[b-f9p81tn8mv] { padding: 10px 6px; }
.bst-stats .big[b-f9p81tn8mv] { font-size: 17px; text-transform: capitalize; }
.bst-flee[b-f9p81tn8mv] { font-size: 12.5px; color: var(--ink-soft); margin-top: 10px; }

/* resistance / weakness chips */
.bst-chips[b-f9p81tn8mv] { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 4px; }
.bst-chip[b-f9p81tn8mv] {
    font-size: 11.5px; font-weight: 600; padding: 3px 9px; border-radius: 3px;
    border: 1px solid transparent; text-transform: capitalize;
}
.bst-chip.weak[b-f9p81tn8mv] { background: rgba(179, 22, 15, .14); border-color: var(--blood); color: var(--blood); }
.bst-chip.resist[b-f9p81tn8mv] { background: rgba(58, 36, 16, .18); border-color: rgba(58, 36, 16, .55); color: var(--ink); }
.bst-chip.immune[b-f9p81tn8mv] {
    background: linear-gradient(180deg, #1a0f06, #0c0703); border-color: #3a2410; color: var(--gold-lit);
}
.bst-legend[b-f9p81tn8mv] { font-size: 11px; color: var(--ink-link); margin: 6px 0 2px; display: flex; align-items: center; }
.bst-legend .sw[b-f9p81tn8mv] { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 4px; vertical-align: -1px; }
.bst-legend .sw.weak[b-f9p81tn8mv] { background: var(--blood); }
.bst-legend .sw.resist[b-f9p81tn8mv] { background: rgba(58, 36, 16, .4); }
.bst-legend .sw.immune[b-f9p81tn8mv] { background: #1a0f06; }

/* attack + spawn lists */
.bst-attacks[b-f9p81tn8mv], .bst-spawns[b-f9p81tn8mv] { list-style: none; margin: 4px 0 6px; padding: 0; }
.bst-attacks li[b-f9p81tn8mv], .bst-spawns li[b-f9p81tn8mv] {
    font-size: 13px; color: var(--ink-soft); padding: 4px 0 4px 16px; position: relative;
    border-bottom: 1px solid rgba(58, 36, 16, .12);
}
.bst-attacks li:last-child[b-f9p81tn8mv], .bst-spawns li:last-child[b-f9p81tn8mv] { border-bottom: 0; }
.bst-attacks li[b-f9p81tn8mv]::before, .bst-spawns li[b-f9p81tn8mv]::before {
    content: "◆"; color: var(--ember); font-size: 7px; position: absolute; left: 2px; top: 8px;
}
.bst-spawns li b[b-f9p81tn8mv] { color: var(--ink); font-variant-numeric: tabular-nums; }
.bst-nospawn[b-f9p81tn8mv] { font-size: 12.5px; color: var(--ink-link); font-style: italic; margin-top: 4px; }

@media (prefers-reduced-motion: reduce) {
    .bst-pill[b-f9p81tn8mv],
    .bst-table th.sortable[b-f9p81tn8mv],
    .bst-row[b-f9p81tn8mv],
    .bst-close[b-f9p81tn8mv] {
        transition: none;
    }
    .bst-pill:active[b-f9p81tn8mv],
    .bst-table th.sortable:active[b-f9p81tn8mv],
    .bst-row:active[b-f9p81tn8mv],
    .bst-close:active[b-f9p81tn8mv] {
        transform: none;
    }
}

@media (max-width: 560px) {
    .bst-head[b-f9p81tn8mv] { flex-direction: column; }
    .bst-stats[b-f9p81tn8mv] { grid-template-columns: repeat(2, 1fr); }
}
/* /Features/Characters/CharacterProfile.razor.rz.scp.css */
/* ─────────────────────────────────────────────────────────────────────
   Character profile — classic Tibia 8.6 character-sheet aesthetic.
   Parchment panel, brown bordered tables, boxed section headings,
   decorative outfit frame, HP/Mana tinted stat boxes.
   Uses only existing CSS tokens from app.css; no JS / interop.
   Honors prefers-reduced-motion. WCAG AA on parchment.
   ───────────────────────────────────────────────────────────────────── */

/* ── Layout root ───────────────────────────────────────────────────── */
.char-sheet[b-4p8d2bhjar] {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

/* ── Identity block: portrait frame + name/meta ───────────────────── */
.char-id[b-4p8d2bhjar] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 16px;
    background: linear-gradient(180deg, rgba(58, 36, 16, 0.06), rgba(58, 36, 16, 0.02));
    border: 1px solid rgba(58, 36, 16, 0.32);
    border-radius: 3px;
    box-shadow: inset 0 1px 0 rgba(243, 233, 212, 0.6);
}

.char-portrait[b-4p8d2bhjar] {
    flex: 0 0 auto;
    width: 192px;
    height: 192px;
    padding: 6px;
    background: linear-gradient(180deg, var(--ink-soft), var(--ink));
    border: 2px solid #3a2410;
    border-radius: 3px;
    box-shadow:
        inset 0 0 0 1px rgba(232, 161, 60, 0.45),
        inset 0 0 16px rgba(0, 0, 0, 0.45),
        0 2px 6px rgba(58, 36, 16, 0.3);
    display: grid;
    place-items: center;
    position: relative;
}

.char-portrait[b-4p8d2bhjar]::after {
    content: "";
    position: absolute;
    inset: 4px;
    border: 1px solid rgba(232, 161, 60, 0.22);
    border-radius: 2px;
    pointer-events: none;
}

.char-portrait img[b-4p8d2bhjar] {
    width: 160px;
    height: 160px;
    image-rendering: auto;
    display: block;
    position: relative;
    z-index: 1;
}

@media (prefers-reduced-motion: no-preference) {
    .char-portrait[b-4p8d2bhjar] {
        animation: portrait-glow-b-4p8d2bhjar 4s var(--ease-in-out) infinite alternate;
    }
}

@keyframes portrait-glow-b-4p8d2bhjar {
    from { box-shadow: inset 0 0 0 1px rgba(232, 161, 60, 0.45), inset 0 0 16px rgba(0, 0, 0, 0.45), 0 2px 6px rgba(58, 36, 16, 0.3); }
    to { box-shadow: inset 0 0 0 1px rgba(232, 161, 60, 0.65), inset 0 0 24px rgba(255, 106, 26, 0.22), 0 2px 10px rgba(58, 36, 16, 0.35); }
}

.char-id-text[b-4p8d2bhjar] {
    flex: 1 1 auto;
    min-width: 0;
}

.char-name[b-4p8d2bhjar] {
    margin: 0 0 6px;
    font-family: Cinzel, serif;
    font-size: clamp(1.85rem, 5vw, 2.5rem);
    font-weight: 900;
    letter-spacing: 0.005em;
    color: var(--ink);
    line-height: 1.1;
    text-wrap: balance;
    word-break: break-word;
}

.char-id-meta[b-4p8d2bhjar] {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 6px 16px;
    align-items: center;
    font-size: 13.5px;
    color: var(--ink-soft);
}

.char-id-meta li[b-4p8d2bhjar] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.char-id-meta b[b-4p8d2bhjar] {
    color: var(--ink-soft);
    font-weight: 600;
    text-transform: uppercase;
    font-size: 10.5px;
    letter-spacing: 0.06em;
}

.char-id-meta .v[b-4p8d2bhjar] {
    width: 11px;
    height: 11px;
    border-radius: 50%;
    box-shadow: 0 0 4px currentColor;
    flex: 0 0 auto;
}

.char-status[b-4p8d2bhjar] {
    font-family: Cinzel, serif;
    font-size: 10.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 3px 9px 2px;
    border-radius: 2px;
    border: 1px solid transparent;
    line-height: 1;
}

.char-status.online[b-4p8d2bhjar] {
    background: rgba(79, 201, 106, 0.18);
    color: #1f5a30;
    border-color: rgba(79, 201, 106, 0.4);
}

.char-status.offline[b-4p8d2bhjar] {
    background: rgba(58, 36, 16, 0.10);
    color: var(--ink-soft);
    border-color: rgba(58, 36, 16, 0.3);
}

/* ── Boxed section heading — tibia.com solid caption bar ──────────── */
.char-section-head[b-4p8d2bhjar] {
    margin: 0 0 10px;
    padding: 7px 14px;
    background: linear-gradient(180deg, #5d3a12, #40260b);
    border: 1px solid rgba(42, 24, 8, 0.9);
    border-radius: 3px;
    color: #f3e9d4;
    font-family: Cinzel, serif;
    font-weight: 800;
    font-size: 14px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
    box-shadow:
        inset 0 1px 0 rgba(232, 161, 60, 0.35),
        0 1px 2px rgba(42, 24, 8, 0.25);
}

/* ── Stats grid (HP/Mana tinted, others neutral) ──────────────────── */
.char-statgrid[b-4p8d2bhjar] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 10px;
}

.char-stat[b-4p8d2bhjar] {
    padding: 10px 12px;
    background: rgba(58, 36, 16, 0.05);
    border: 1px solid rgba(58, 36, 16, 0.25);
    border-radius: 3px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: inset 0 1px 0 rgba(243, 233, 212, 0.55);
}

.char-stat.is-hp[b-4p8d2bhjar] {
    background: linear-gradient(180deg, rgba(179, 22, 15, 0.08), rgba(179, 22, 15, 0.04));
    border-color: rgba(179, 22, 15, 0.35);
}

.char-stat.is-mana[b-4p8d2bhjar] {
    background: linear-gradient(180deg, rgba(58, 134, 201, 0.08), rgba(58, 134, 201, 0.04));
    border-color: rgba(58, 134, 201, 0.35);
}

.char-stat-label[b-4p8d2bhjar] {
    font-family: Cinzel, serif;
    font-size: 10.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--ink-soft);
}

.char-stat-value[b-4p8d2bhjar] {
    font-family: Cinzel, serif;
    font-size: 17px;
    font-weight: 800;
    color: var(--ink);
    font-variant-numeric: tabular-nums;
}

.char-stat small[b-4p8d2bhjar] { font-size: 11px; color: var(--ink-soft); margin-left: 2px; font-weight: 600; }

/* ── Visual bars: HP / Mana / XP ──────────────────────────────────── */
.char-bar[b-4p8d2bhjar] {
    margin-top: 6px;
    height: 8px;
    background: rgba(58, 36, 16, 0.18);
    border: 1px solid rgba(58, 36, 16, 0.35);
    border-radius: 2px;
    overflow: hidden;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25);
}
.char-bar > span[b-4p8d2bhjar] {
    display: block;
    height: 100%;
    background: linear-gradient(180deg, #d23a2a 0%, #8a1a0a 100%);
    box-shadow: inset 0 1px 0 rgba(255, 200, 180, 0.5);
    transition: width 240ms var(--ease-out);
}
.char-bar.is-mana-bar > span[b-4p8d2bhjar] {
    background: linear-gradient(180deg, #4f7fc8 0%, #1a3e7a 100%);
    box-shadow: inset 0 1px 0 rgba(200, 220, 255, 0.5);
}

.char-xp[b-4p8d2bhjar] {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid rgba(58, 36, 16, 0.22);
}
.char-xp-label[b-4p8d2bhjar] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-family: Cinzel, serif;
    font-size: 10.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--ink-soft);
    margin-bottom: 4px;
}
.char-xp-label b[b-4p8d2bhjar] {
    color: var(--ink);
    font-weight: 800;
    font-size: 12px;
}
.char-xp-bar[b-4p8d2bhjar] {
    height: 9px;
    background: rgba(58, 36, 16, 0.18);
    border: 1px solid rgba(58, 36, 16, 0.35);
    border-radius: 2px;
    overflow: hidden;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25);
}
.char-xp-fill[b-4p8d2bhjar] {
    display: block;
    height: 100%;
    background: linear-gradient(180deg, var(--gold-lit), #b88a3a 80%, #6a5018);
    box-shadow: inset 0 1px 0 rgba(255, 235, 180, 0.5);
}
.char-xp-detail[b-4p8d2bhjar] {
    margin-top: 4px;
    font-size: 11.5px;
    color: var(--ink-soft);
    font-variant-numeric: tabular-nums;
}

@media (prefers-reduced-motion: no-preference) {
    .char-stat[b-4p8d2bhjar]::after {
        content: "";
        position: absolute;
        inset: 0;
        border-radius: 3px;
        background: linear-gradient(110deg, transparent 40%, rgba(255, 255, 255, 0.18) 50%, transparent 60%);
        background-size: 200% 100%;
        animation: stat-shimmer-b-4p8d2bhjar 2.4s var(--ease-out) infinite;
        pointer-events: none;
    }

    .char-stat[b-4p8d2bhjar] {
        position: relative;
        overflow: hidden;
    }
}

@keyframes stat-shimmer-b-4p8d2bhjar {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* ── Table wraps + column widths ──────────────────────────────────── */
.char-table-wrap[b-4p8d2bhjar] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.char-table-wrap .ptable[b-4p8d2bhjar] {
    margin: 0;
    min-width: 100%;
}

.char-info-table th[b-4p8d2bhjar] {
    width: 36%;
    color: var(--ink-soft);
    font-family: Cinzel, serif;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 11.5px;
    background: transparent;
    border-bottom: 1px solid rgba(58, 36, 16, 0.18);
}

.char-info-table td[b-4p8d2bhjar] {
    color: var(--ink);
    font-weight: 600;
}

.char-skills-table th:first-child[b-4p8d2bhjar],
.char-skills-table td:first-child[b-4p8d2bhjar] {
    width: 65%;
}

/* Date column shrinks to fit; the death sentence gets everything else
   on one line (wraps only when it genuinely can't fit). */
.char-deaths-table th:first-child[b-4p8d2bhjar],
.char-deaths-table td:first-child[b-4p8d2bhjar] {
    width: 1%;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

/* ── PK death row highlight ───────────────────────────────────────── */
.char-deaths-table tr.death-pk[b-4p8d2bhjar] {
    background: linear-gradient(180deg, rgba(179, 22, 15, 0.08), rgba(179, 22, 15, 0.03));
    border-left: 3px solid var(--blood);
}

.death-pk-icon[b-4p8d2bhjar] {
    display: inline-block;
    margin-left: 8px;
    color: var(--blood);
    font-size: 13px;
    vertical-align: middle;
    animation: pk-pulse-b-4p8d2bhjar 1.8s var(--ease-in-out) infinite alternate;
}

@keyframes pk-pulse-b-4p8d2bhjar {
    from { opacity: 0.7; transform: scale(1); }
    to { opacity: 1; transform: scale(1.15); }
}

@media (prefers-reduced-motion: reduce) {
    .death-pk-icon[b-4p8d2bhjar] { animation: none; }
}

.char-houses-table th:first-child[b-4p8d2bhjar],
.char-houses-table td:first-child[b-4p8d2bhjar] {
    width: 50%;
}

.char-characters-table .v[b-4p8d2bhjar] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    box-shadow: 0 0 4px currentColor;
    margin-right: 6px;
    vertical-align: -1px;
    display: inline-block;
}

/* ── Empty state for sections with no data ────────────────────────── */
.char-empty[b-4p8d2bhjar] {
    font-size: 13px;
    color: var(--ink-soft);
    font-style: italic;
    padding: 9px 14px;
    margin: 0;
    background: rgba(58, 36, 16, 0.04);
    border: 1px solid rgba(58, 36, 16, 0.18);
    border-radius: 3px;
}

/* ── Comment block ────────────────────────────────────────────────── */
.char-comment[b-4p8d2bhjar] {
    margin: 0;
    padding: 12px 16px;
    background: rgba(58, 36, 16, 0.05);
    border: 1px solid rgba(58, 36, 16, 0.22);
    border-radius: 3px;
    box-shadow: inset 0 1px 0 rgba(243, 233, 212, 0.55);
}

.char-comment p[b-4p8d2bhjar] {
    margin: 0;
    font-size: 13.5px;
    line-height: 1.6;
    color: var(--ink-soft);
    font-style: italic;
}

.char-comment p[b-4p8d2bhjar]::before {
    content: """;
    color: var(--ember);
    font-family: Georgia, serif;
    font-size: 1.4em;
    line-height: 0;
    margin-right: 3px;
    vertical-align: -4px;
}

/* ── Equipment paper doll — outfit in the middle, slots around it ─── */
.char-gear[b-4p8d2bhjar] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-areas:
        "neck   head  backpack"
        "rhand  doll  lhand"
        "ring   doll  ammo"
        ".      armor ."
        ".      legs  ."
        ".      feet  .";
    gap: 10px;
    max-width: 460px;
    margin: 0 auto;
}

.char-gear .slot-head[b-4p8d2bhjar]     { grid-area: head; }
.char-gear .slot-neck[b-4p8d2bhjar]     { grid-area: neck; }
.char-gear .slot-backpack[b-4p8d2bhjar] { grid-area: backpack; }
.char-gear .slot-armor[b-4p8d2bhjar]    { grid-area: armor; }
.char-gear .slot-rhand[b-4p8d2bhjar]    { grid-area: rhand; }
.char-gear .slot-lhand[b-4p8d2bhjar]    { grid-area: lhand; }
.char-gear .slot-legs[b-4p8d2bhjar]     { grid-area: legs; }
.char-gear .slot-feet[b-4p8d2bhjar]     { grid-area: feet; }
.char-gear .slot-ring[b-4p8d2bhjar]     { grid-area: ring; }
.char-gear .slot-ammo[b-4p8d2bhjar]     { grid-area: ammo; }

.char-gear-doll[b-4p8d2bhjar] {
    grid-area: doll;
    display: flex;
    align-items: center;
    justify-content: center;
    background:
        radial-gradient(circle at 50% 42%, rgba(232, 161, 60, 0.16), transparent 68%),
        linear-gradient(180deg, rgba(58, 36, 16, 0.1), rgba(58, 36, 16, 0.04));
    border: 1px solid rgba(232, 161, 60, 0.4);
    border-radius: 3px;
    box-shadow: inset 0 0 22px rgba(58, 36, 16, 0.14);
}

.char-gear-doll img[b-4p8d2bhjar] {
    display: block;
    width: 96px;
    height: 96px;
    image-rendering: pixelated;
    filter: drop-shadow(0 3px 4px rgba(42, 24, 8, 0.35));
}

.char-gear-slot[b-4p8d2bhjar] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-height: 92px;
    padding: 10px 8px;
    background: linear-gradient(180deg, rgba(58, 36, 16, 0.06), rgba(58, 36, 16, 0.02));
    border: 1px solid rgba(58, 36, 16, 0.22);
    border-radius: 3px;
    box-shadow: inset 0 1px 0 rgba(243, 233, 212, 0.55);
    transition: transform 160ms var(--ease-out), border-color 160ms var(--ease-out), box-shadow 160ms var(--ease-out);
}

@media (hover: hover) and (pointer: fine) {
    .char-gear-slot:hover[b-4p8d2bhjar] {
        transform: translateY(-3px);
        border-color: rgba(232, 161, 60, 0.55);
        box-shadow:
            inset 0 1px 0 rgba(243, 233, 212, 0.55),
            0 0 14px rgba(255, 106, 26, 0.18),
            0 4px 10px rgba(58, 36, 16, 0.18);
    }
}

.char-gear-slot.filled[b-4p8d2bhjar] {
    background: linear-gradient(180deg, rgba(232, 161, 60, 0.08), rgba(232, 161, 60, 0.03));
    border-color: rgba(232, 161, 60, 0.35);
}

.char-gear-slot.empty[b-4p8d2bhjar] {
    opacity: 0.75;
}

.char-gear-slot-label[b-4p8d2bhjar] {
    font-family: Cinzel, serif;
    font-size: 9.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--ink-soft);
}

.char-gear-icon[b-4p8d2bhjar] {
    width: 32px;
    height: 32px;
    image-rendering: pixelated;
    display: block;
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.25));
}

.char-gear-name[b-4p8d2bhjar] {
    font-size: 11px;
    font-weight: 700;
    color: var(--ink);
    text-align: center;
    line-height: 1.25;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.char-gear-empty[b-4p8d2bhjar] {
    font-size: 18px;
    color: var(--ash-dim);
    font-weight: 700;
}

.char-gear-count[b-4p8d2bhjar] {
    position: absolute;
    bottom: 6px;
    right: 7px;
    font-size: 10px;
    font-weight: 800;
    color: var(--ember);
    background: rgba(7, 5, 4, 0.85);
    padding: 1px 4px;
    border-radius: 2px;
    line-height: 1;
}

/* ── Search Character section: tighter rhythm ─────────────────────── */
.char-section .pform[b-4p8d2bhjar] {
    margin-bottom: 0;
}

/* ── Responsive: stack portrait on narrow screens ─────────────────── */
@media (max-width: 640px) {
    .char-id[b-4p8d2bhjar] {
        flex-direction: column;
        text-align: center;
        gap: 12px;
        padding: 14px 12px;
    }

    .char-id-meta[b-4p8d2bhjar] {
        justify-content: center;
    }

    .char-portrait[b-4p8d2bhjar] {
        width: 160px;
        height: 160px;
    }

    .char-portrait img[b-4p8d2bhjar] {
        width: 128px;
        height: 128px;
    }

    .char-name[b-4p8d2bhjar] {
        font-size: clamp(1.5rem, 7vw, 1.85rem);
    }

    .char-statgrid[b-4p8d2bhjar] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 420px) {
    .char-statgrid[b-4p8d2bhjar] {
        grid-template-columns: 1fr;
    }

    .char-gear[b-4p8d2bhjar] {
        gap: 7px;
    }

    .char-gear-slot[b-4p8d2bhjar] {
        min-height: 78px;
        padding: 7px 4px;
    }

    .char-gear-slot-label[b-4p8d2bhjar] {
        font-size: 8.5px;
    }

    .char-gear-doll img[b-4p8d2bhjar] {
        width: 72px;
        height: 72px;
    }
}

/* ── Animation: subtle rise-in, honors reduced motion ─────────────── */
@media (prefers-reduced-motion: no-preference) {
    @keyframes char-rise-b-4p8d2bhjar {
        from { opacity: 0; transform: translateY(6px); }
        to { opacity: 1; transform: none; }
    }

    .char-sheet > *[b-4p8d2bhjar] {
        animation: char-rise-b-4p8d2bhjar 320ms var(--ease-out) both;
    }

    .char-sheet > *:nth-child(1)[b-4p8d2bhjar] { animation-delay: 0ms; }
    .char-sheet > *:nth-child(2)[b-4p8d2bhjar] { animation-delay: 50ms; }
    .char-sheet > *:nth-child(3)[b-4p8d2bhjar] { animation-delay: 100ms; }
    .char-sheet > *:nth-child(4)[b-4p8d2bhjar] { animation-delay: 150ms; }
    .char-sheet > *:nth-child(5)[b-4p8d2bhjar] { animation-delay: 200ms; }
    .char-sheet > *:nth-child(6)[b-4p8d2bhjar] { animation-delay: 250ms; }
    .char-sheet > *:nth-child(7)[b-4p8d2bhjar] { animation-delay: 300ms; }
    .char-sheet > *:nth-child(8)[b-4p8d2bhjar] { animation-delay: 350ms; }
}

@media (prefers-reduced-motion: reduce) {
    .char-sheet > *[b-4p8d2bhjar] {
        animation: none;
    }
}

/* ── tibia.com table readability: zebra rows, tight label column ──── */
.char-info-table[b-4p8d2bhjar],
.char-deaths-table[b-4p8d2bhjar],
.char-characters-table[b-4p8d2bhjar],
.char-skills-table[b-4p8d2bhjar],
.char-houses-table[b-4p8d2bhjar] {
    background: rgba(243, 233, 212, 0.55);
    border: 1px solid rgba(58, 36, 16, 0.4);
    border-radius: 3px;
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
}

.char-info-table tbody tr:nth-child(odd)[b-4p8d2bhjar],
.char-deaths-table tbody tr:nth-child(odd)[b-4p8d2bhjar],
.char-characters-table tbody tr:nth-child(odd)[b-4p8d2bhjar],
.char-skills-table tbody tr:nth-child(odd)[b-4p8d2bhjar],
.char-houses-table tbody tr:nth-child(odd)[b-4p8d2bhjar] {
    background: rgba(58, 36, 16, 0.07);
}

.char-info-table th[b-4p8d2bhjar] {
    width: 30%;
    color: #4a2c10;
}

.char-info-table th[b-4p8d2bhjar],
.char-info-table td[b-4p8d2bhjar] {
    padding: 6px 12px;
    border-bottom: 1px solid rgba(58, 36, 16, 0.14);
}

.char-info-table tbody tr:last-child th[b-4p8d2bhjar],
.char-info-table tbody tr:last-child td[b-4p8d2bhjar],
.char-deaths-table tbody tr:last-child td[b-4p8d2bhjar],
.char-characters-table tbody tr:last-child td[b-4p8d2bhjar] {
    border-bottom: 0;
}

/* ── Online dot in the Characters (account) table ─────────────────── */
.char-dot[b-4p8d2bhjar] {
    display: inline-block;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    margin-right: 7px;
    vertical-align: 0;
}

.char-dot.on[b-4p8d2bhjar] {
    background: #2f8f3e;
    box-shadow: 0 0 4px rgba(47, 143, 62, 0.8);
}

.char-dot.off[b-4p8d2bhjar] {
    background: #a3342a;
    box-shadow: 0 0 3px rgba(163, 52, 42, 0.6);
}

/* ── tibia.com death-line layout ──────────────────────────────────── */
.char-death-date[b-4p8d2bhjar] {
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
    color: var(--ink-soft);
    font-size: 12.5px;
}

/* ── Guild nick + inline comment row ──────────────────────────────── */
.char-guild-nick[b-4p8d2bhjar] {
    color: var(--ink-soft);
    font-style: italic;
}

.char-comment-row[b-4p8d2bhjar] {
    font-style: italic;
    color: var(--ink-soft);
}

/* ── /characters index intro ──────────────────────────────────────── */
.char-index-intro[b-4p8d2bhjar] {
    margin: 0 0 16px;
    font-size: 13.5px;
    line-height: 1.6;
    color: var(--ink-soft);
}
/* /Features/Characters/CreateCharacter.razor.rz.scp.css */
/* ── Create Character · responsive + accessibility polish ── */

/* Focus rings for the custom picker controls */
.cc-chan:focus-visible[b-zrlripo7hv],
.cc-pcell:focus-visible[b-zrlripo7hv],
.cc-rot:focus-visible[b-zrlripo7hv] {
    outline: 2px solid var(--gold-lit);
    outline-offset: 2px;
}

.cc-hint[b-zrlripo7hv] {
    display: block;
    margin-top: 6px;
    font-size: 11.5px;
    color: var(--ink-soft);
}

.cc-pcell:focus-visible[b-zrlripo7hv] {
    outline-offset: 1px;
}

/* Make the color palette scrollable on very narrow screens so all 133 swatches stay usable */
.cc-palette[b-zrlripo7hv] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.cc-palette[b-zrlripo7hv]::-webkit-scrollbar {
    height: 8px;
}

.cc-palette[b-zrlripo7hv]::-webkit-scrollbar-thumb {
    background: rgba(255, 106, 26, 0.45);
    border-radius: 4px;
}

.cc-palette[b-zrlripo7hv]::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.25);
}

@media (max-width: 520px) {
    .cc-name[b-zrlripo7hv] {
        max-width: none;
        width: 100%;
    }

    .cc-name .pinp[b-zrlripo7hv] {
        width: 100%;
    }

    .cc-medallion[b-zrlripo7hv] {
        width: 148px;
        height: 148px;
    }

    .cc-medallion img[b-zrlripo7hv] {
        width: 112px;
        height: 112px;
    }

    .cc-vocs[b-zrlripo7hv] {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
    }

    .cc-voc[b-zrlripo7hv] {
        max-width: none;
        width: 100%;
    }

    .cc-palette[b-zrlripo7hv] {
        justify-content: start;
        padding: 6px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cc-pcell[b-zrlripo7hv],
    .cc-chan[b-zrlripo7hv],
    .cc-rot[b-zrlripo7hv],
    .cc-voc[b-zrlripo7hv] {
        transition: none;
    }

    .cc-pcell:hover[b-zrlripo7hv] {
        transform: none;
    }
}
/* /Features/Colosseum/Colosseum.razor.rz.scp.css */
/* Colosseum ladder — scoped styles. Leans on the global .ptable from app.css. */

/* Narrow screens: scroll the board sideways instead of overflowing the panel. */
.hs-table-wrap[b-d4xn3t2eol] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.hs-table-wrap .ptable[b-d4xn3t2eol] {
    margin: 0;
    min-width: 520px;
}
/* /Features/Fleet/FleetWatch.razor.rz.scp.css */
/* Fleet Watch — public spectator cards on the parchment theme.
   The admin console palette (FleetDashboard) is dark-console scoped; these are the
   same status semantics translated to the light site theme. */

.fw-pause[b-olccwd6j2w] {
    margin-left: 8px;
    padding: 1px 8px;
    font: inherit;
    font-size: 12px;
    border: 1px solid rgba(58, 36, 16, 0.35);
    border-radius: 4px;
    background: rgba(243, 233, 212, 0.6);
    cursor: pointer;
}

.fw-pause:hover[b-olccwd6j2w] {
    background: rgba(243, 233, 212, 0.9);
}

.fw-grid[b-olccwd6j2w] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 12px;
}

.fw-card[b-olccwd6j2w] {
    background: rgba(243, 233, 212, 0.55);
    border: 1px solid rgba(58, 36, 16, 0.18);
    border-radius: 6px;
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fw-card.off[b-olccwd6j2w] {
    opacity: 0.55;
}

.fw-hd[b-olccwd6j2w] {
    display: flex;
    gap: 10px;
    align-items: center;
}

.fw-av[b-olccwd6j2w] {
    image-rendering: pixelated;
    flex: none;
}

.fw-id[b-olccwd6j2w] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.fw-nm[b-olccwd6j2w] {
    font-weight: 700;
}

.fw-voc[b-olccwd6j2w] {
    font-size: 12px;
    color: var(--ink-soft);
}

/* vocation-tinted names, same hues as the admin console */
.fw-voc.voc-knight[b-olccwd6j2w]   { color: #c94f2a; }
.fw-voc.voc-paladin[b-olccwd6j2w]  { color: #3a86c9; }
.fw-voc.voc-sorcerer[b-olccwd6j2w] { color: #a04fc9; }
.fw-voc.voc-druid[b-olccwd6j2w]    { color: #4fc96a; }

.fw-st[b-olccwd6j2w] {
    align-self: flex-start;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 1px 6px;
    border-radius: 3px;
}

.fw-st.s-hunt[b-olccwd6j2w]  { background: rgba(87, 201, 138, 0.18); color: #2c7a4e; }
.fw-st.s-walk[b-olccwd6j2w]  { background: rgba(232, 161, 60, 0.18); color: #8a5a14; }
.fw-st.s-wedge[b-olccwd6j2w],
.fw-st.s-dead[b-olccwd6j2w]  { background: rgba(179, 22, 15, 0.14);  color: var(--blood); }
.fw-st.s-off[b-olccwd6j2w],
.fw-st.s-unknown[b-olccwd6j2w] { background: rgba(58, 36, 16, 0.10);  color: var(--ink-soft); }

.fw-bars[b-olccwd6j2w] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.fw-barrow[b-olccwd6j2w] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
}

.fw-lab[b-olccwd6j2w] {
    width: 18px;
    font-weight: 700;
    color: var(--ink-soft);
}

.fw-bar[b-olccwd6j2w] {
    flex: 1;
    height: 8px;
    background: rgba(58, 36, 16, 0.12);
    border-radius: 4px;
    overflow: hidden;
}

.fw-bar i[b-olccwd6j2w] {
    display: block;
    height: 100%;
    transition: width 0.4s ease;
}

.fw-bar i.hp[b-olccwd6j2w]   { background: #57c98a; }
.fw-bar i.mana[b-olccwd6j2w] { background: #3a86c9; }
.fw-bar i.xp[b-olccwd6j2w]   { background: #e8a13c; }

.fw-num[b-olccwd6j2w] {
    min-width: 56px;
    text-align: right;
    font-variant-numeric: tabular-nums;
    color: var(--ink-soft);
}

.fw-meta[b-olccwd6j2w] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: 12px;
    color: var(--ink-soft);
}

.fw-mission[b-olccwd6j2w] {
    font-style: italic;
}

.fw-tally[b-olccwd6j2w] {
    font-variant-numeric: tabular-nums;
}

@media (prefers-reduced-motion: reduce) {
    .fw-bar i[b-olccwd6j2w] { transition: none; }
}
/* /Features/Highscores/Deaths.razor.rz.scp.css */
/* Latest Deaths — scoped styles. Leans on the global .ptable/.darkbox from app.css. */

.deaths-layout[b-bhuni9w85w] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 260px;
    gap: 16px;
    align-items: start;
}

@media (max-width: 860px) {
    .deaths-layout[b-bhuni9w85w] {
        grid-template-columns: 1fr;
    }
}

.deaths-table-wrap[b-bhuni9w85w] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.deaths-table[b-bhuni9w85w] {
    margin: 0;
    min-width: 480px;
    background: rgba(243, 233, 212, 0.55);
    border-radius: 6px;
    overflow: hidden;
}

.deaths-table tbody tr:nth-child(odd)[b-bhuni9w85w] {
    background: rgba(58, 36, 16, 0.07);
}

.deaths-table tbody tr:last-child td[b-bhuni9w85w] {
    border-bottom: 0;
}

/* Date column shrinks to fit; the death sentence gets the rest. */
.deaths-table td:first-child[b-bhuni9w85w] {
    width: 1%;
    white-space: nowrap;
}

.death-date[b-bhuni9w85w] {
    font-variant-numeric: tabular-nums;
    color: var(--ink-soft);
    font-size: 12.5px;
}

/* ── PK death row highlight (same language as CharacterProfile) ────── */
.deaths-table tr.death-pk[b-bhuni9w85w] {
    background: linear-gradient(180deg, rgba(179, 22, 15, 0.08), rgba(179, 22, 15, 0.03));
    border-left: 3px solid var(--blood);
}

.death-pk-icon[b-bhuni9w85w] {
    display: inline-block;
    margin-left: 8px;
    color: var(--blood);
    font-size: 13px;
}

/* ── Top Killers sidebar ──────────────────────────────────────────── */
.killers-list[b-bhuni9w85w] {
    margin: 0;
    padding: 8px 12px 10px 28px;
}

.killers-list li[b-bhuni9w85w] {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    padding: 3px 0;
}

.killers-list .num[b-bhuni9w85w] {
    font-variant-numeric: tabular-nums;
    color: var(--ink-soft);
}

.killers-empty[b-bhuni9w85w] {
    margin: 0;
    padding: 10px 12px;
}
/* /Features/Highscores/Highscores.razor.rz.scp.css */
/* Highscores — scoped styles. Leans on the global .ptable from app.css. */

/* Narrow screens: scroll the board sideways instead of overflowing the panel. */
.hs-table-wrap[b-cucp18apiw] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.hs-table-wrap .ptable[b-cucp18apiw] {
    margin: 0;
    min-width: 520px;
}

/* Row highlight for ?player= deep-links from the sidebar Top Players widget. */
.ptable tbody tr.player-hl td[b-cucp18apiw] {
    background: rgba(138, 52, 16, .16);
}

.ptable tbody tr.player-hl:hover td[b-cucp18apiw] {
    background: rgba(138, 52, 16, .22);
}
/* /Features/Houses/HouseDetail.razor.rz.scp.css */
.house-buy[b-31w3dfj4nt] {
    margin: 18px 0;
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--panel-bg);
}

.house-buy h4[b-31w3dfj4nt] {
    margin: 0 0 10px;
    font-size: 1rem;
}

.house-buy .ash[b-31w3dfj4nt] {
    color: var(--muted);
    font-size: 0.875rem;
    line-height: 1.45;
}
/* /Features/Houses/Houses.razor.rz.scp.css */
.houses-table-wrap[b-c8c7uf8eq0] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 6px 0;
}

.houses-table-wrap .ptable[b-c8c7uf8eq0] {
    min-width: 640px;
    margin: 0;
}

@media (max-width: 560px) {
    .house-filters[b-c8c7uf8eq0] {
        flex-direction: column;
        align-items: stretch;
    }

    .house-filter-field[b-c8c7uf8eq0] {
        flex: 1 1 auto;
        width: 100%;
    }

    .house-filter-submit[b-c8c7uf8eq0] {
        width: 100%;
        margin-top: 2px;
    }
}
/* /Features/Hunts/HuntDetail.razor.rz.scp.css */
.hunt-detail h3[b-j1akh14ofo] {
    font-family: Cinzel, serif;
    font-weight: 800;
    font-size: 17px;
    color: var(--ink);
    margin: 16px 0 8px;
}

.hunt-head[b-j1akh14ofo] {
    margin-bottom: 14px;
}

.hunt-meta[b-j1akh14ofo] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-bottom: 6px;
}

.hunt-band[b-j1akh14ofo] {
    font-family: Cinzel, serif;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ink-link);
}

.hunt-status[b-j1akh14ofo] {
    font-size: 10.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    padding: 2px 7px;
    border-radius: 3px;
}

.hunt-location[b-j1akh14ofo] {
    font-size: 13.5px;
    color: var(--ink-soft);
    font-style: italic;
}

.hunt-stats[b-j1akh14ofo] {
    margin: 6px 0 18px;
}

.hunt-stats .slot[b-j1akh14ofo] {
    padding: 14px 8px;
}

.hunt-stats .big[b-j1akh14ofo] {
    font-size: 20px;
}

.hunt-monsters[b-j1akh14ofo] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.hunt-monsters li a[b-j1akh14ofo] {
    display: inline-block;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--ink-link);
    background: rgba(90, 36, 8, .1);
    border: 1px solid rgba(90, 36, 8, .35);
    border-radius: 4px;
    padding: 4px 10px;
    transition: background-color .16s var(--ease-out), border-color .16s var(--ease-out), color .16s var(--ease-out), transform .16s var(--ease-out);
}

.hunt-monsters li a:hover[b-j1akh14ofo] {
    background: rgba(90, 36, 8, .2);
    border-color: rgba(90, 36, 8, .55);
    color: var(--blood-lit);
}

.hunt-monsters li a:active[b-j1akh14ofo] {
    transform: scale(0.985);
    background: rgba(90, 36, 8, .25);
    border-color: rgba(90, 36, 8, .65);
}

.hunt-key-table td:first-child[b-j1akh14ofo] {
    font-family: Cinzel, serif;
    font-weight: 700;
    color: var(--ink);
}

.hunt-key-table td:first-child a[b-j1akh14ofo] {
    color: inherit;
    text-decoration: none;
    transition: color .16s var(--ease-out), opacity .16s var(--ease-out);
}

.hunt-key-table td:first-child a:hover[b-j1akh14ofo] {
    color: var(--blood-lit);
    text-decoration: underline;
}

.hunt-key-table td:first-child a:active[b-j1akh14ofo] {
    opacity: 0.8;
}

.hunt-notes[b-j1akh14ofo] {
    font-size: 13.5px;
    line-height: 1.6;
    color: var(--ink-soft);
}

.hunt-actions[b-j1akh14ofo] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid rgba(58, 36, 16, .2);
}

.hunt-not-found[b-j1akh14ofo],
.hunt-loading[b-j1akh14ofo] {
    font-size: 13.5px;
    color: var(--ink-soft);
}

.hunt-not-found code[b-j1akh14ofo] {
    font-weight: 700;
    color: var(--ink);
}

@media (prefers-reduced-motion: reduce) {
    .hunt-monsters li a[b-j1akh14ofo],
    .hunt-key-table td:first-child a[b-j1akh14ofo] {
        transition: none;
    }
    .hunt-monsters li a:active[b-j1akh14ofo] {
        transform: none;
    }
}
/* /Features/Items/Items.razor.rz.scp.css */
/* Item catalog scoped styles */

.item-detail[b-njx0wtt3lo] { position: relative; }

.item-close[b-njx0wtt3lo] {
    position: absolute;
    top: 0;
    right: 0;
}

.item-head[b-njx0wtt3lo] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 14px;
}

.item-portrait[b-njx0wtt3lo] {
    flex: none;
    width: 84px;
    height: 84px;
    display: grid;
    place-items: center;
    background: linear-gradient(180deg, #1a0f06, #0c0703);
    border: 2px solid #3a2410;
    border-radius: 4px;
    box-shadow: inset 0 0 12px rgba(255, 90, 20, .18);
}

.item-portrait img[b-njx0wtt3lo] {
    max-width: 72px;
    max-height: 72px;
    image-rendering: pixelated;
}

.item-meta[b-njx0wtt3lo] {
    flex: 1;
    min-width: 0;
}

.item-cat[b-njx0wtt3lo] {
    font-family: Cinzel, serif;
    font-weight: 700;
    font-size: 11.5px;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--blood);
    margin-bottom: 6px;
}

.item-id[b-njx0wtt3lo] {
    font-size: 11.5px;
    color: var(--ink-link);
    font-family: 'JetBrains Mono', monospace;
}

.item-stats[b-njx0wtt3lo] {
    margin: 6px 0 18px;
}

.item-stats .slot[b-njx0wtt3lo] {
    padding: 10px 6px;
}

.item-stats .big[b-njx0wtt3lo] {
    font-size: 17px;
}

.item-element[b-njx0wtt3lo] {
    font-size: 13.5px;
    color: var(--ink-soft);
    margin-bottom: 10px;
}

.item-element b[b-njx0wtt3lo] {
    color: var(--ink);
}

.item-desc[b-njx0wtt3lo] {
    font-size: 14px;
    line-height: 1.6;
    color: var(--ink-soft);
    font-style: italic;
    border-left: 1px solid var(--ember);
    padding-left: 12px;
}

.item-search[b-njx0wtt3lo] {
    max-width: 100%;
    margin: 10px 0 12px;
}

.item-cats[b-njx0wtt3lo] {
    margin-bottom: 14px;
}

.item-empty[b-njx0wtt3lo] {
    font-size: 13px;
    color: var(--ink-soft);
    font-style: italic;
    padding: 8px 0;
}

.item-thumb[b-njx0wtt3lo] {
    width: 44px;
    text-align: center;
}

.item-thumb img[b-njx0wtt3lo] {
    display: block;
    margin: 0 auto;
    image-rendering: pixelated;
}

/* Placeholder for items the 8.60 client has no sprite for */
.item-nosprite[b-njx0wtt3lo] {
    font-family: Cinzel, serif;
    font-size: 28px;
    font-weight: 800;
    color: rgba(232, 161, 60, .4);
}

.item-nosprite-sm[b-njx0wtt3lo] {
    display: block;
    width: 32px;
    height: 32px;
    margin: 0 auto;
    line-height: 30px;
    font-family: Cinzel, serif;
    font-weight: 800;
    color: rgba(58, 36, 16, .35);
    border: 1px dashed rgba(58, 36, 16, .3);
    border-radius: 3px;
}

.item-count[b-njx0wtt3lo] {
    margin-top: 10px;
    font-size: 11.5px;
    color: var(--ink);
}

.item-row[b-njx0wtt3lo] {
    cursor: pointer;
    transition: background .12s var(--ease-out);
}

@media (hover: hover) and (pointer: fine) {
    .item-row:hover[b-njx0wtt3lo] {
        background: rgba(120, 70, 20, .08);
    }
}

.item-row:active[b-njx0wtt3lo] {
    background: rgba(120, 70, 20, .14);
}

.item-row.sel[b-njx0wtt3lo] {
    background: rgba(179, 22, 15, .12);
}

.item-row.sel td:first-child[b-njx0wtt3lo] {
    color: var(--blood);
}

.item-table-wrap[b-njx0wtt3lo] {
    /* No max-height/overflow-y: the catalog scrolls with the page (Virtualize
       against the window), not in a cramped inner box. overflow-x: clip keeps
       narrow overflow invisible WITHOUT creating a scroll container — an
       overflow:auto wrap would become Virtualize's scroll root and break
       window virtualization. */
    overflow-x: clip;
}

/* Rows must match <Virtualize ItemSize="48"> exactly or the spacer drifts
   (measured 46.5px ≈ 4,000px of drift over 2,633 rows). */
.item-row td[b-njx0wtt3lo] {
    height: 48px;
    box-sizing: border-box;
}

/* Narrow screens: shed the least-critical stat columns and switch to fixed
   layout with truncation, so the table fits the viewport instead of clipping
   (the detail panel has the full stats). */
@media (max-width: 720px) {
    .hide-sm[b-njx0wtt3lo] {
        display: none;
    }

    .item-table[b-njx0wtt3lo] {
        table-layout: fixed;
        width: 100%;
    }

    .item-table thead th:first-child[b-njx0wtt3lo] {
        width: 40px;
    }

    .item-row td[b-njx0wtt3lo] {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

@media (prefers-reduced-motion: reduce) {
    .item-row[b-njx0wtt3lo] {
        transition: none;
    }
}
/* /Features/Library/Library.razor.rz.scp.css */
/* ── Library page — scoped styles ──────────────────────────────────────────
   Tokens inherit from wwwroot/app.css. No hex literals here — use CSS vars.
   Sections: search · vocation-tabs · progress-band · hunt-zones · spells
             quests · monsters · search-results
   ──────────────────────────────────────────────────────────────────────── */

/* ── Root ────────────────────────────────────────────────────────────────── */
.lib-root[b-o2i11ta2uw] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* ── Loading ─────────────────────────────────────────────────────────────── */
.lib-loading[b-o2i11ta2uw] {
    color: var(--ink-soft);
    font-style: italic;
    padding: 16px 0;
}

/* ── Search bar ──────────────────────────────────────────────────────────── */
.lib-search-wrap[b-o2i11ta2uw] {
    margin-bottom: 14px;
}

.lib-search-bar[b-o2i11ta2uw] {
    display: flex;
    align-items: center;
    gap: 6px;
    background: rgba(255, 255, 255, .55);
    border: 2px solid var(--blood);
    border-radius: 4px;
    padding: 3px 6px 3px 10px;
    transition: border-color .18s var(--ease-out);
}

.lib-search-bar:focus-within[b-o2i11ta2uw] {
    border-color: var(--ember);
    box-shadow: 0 0 0 3px rgba(255, 106, 26, .18);
}

.lib-search-icon[b-o2i11ta2uw] {
    color: var(--blood);
    font-size: 13px;
    flex-shrink: 0;
    opacity: .8;
}

.lib-search-input[b-o2i11ta2uw] {
    flex: 1;
    border: none;
    background: transparent;
    font-family: Inter, sans-serif;
    font-size: 13px;
    color: var(--ink);
    outline: none;
    padding: 6px 0;
    min-width: 0;
}

.lib-search-input[b-o2i11ta2uw]::placeholder {
    color: var(--ink-soft);
}

.lib-search-input[b-o2i11ta2uw]::-webkit-search-cancel-button {
    display: none;
}

.lib-search-clear[b-o2i11ta2uw] {
    background: none;
    border: none;
    color: var(--ink);
    cursor: pointer;
    font-size: 12px;
    padding: 4px 6px;
    border-radius: 2px;
    transition: color .14s var(--ease-out), background .14s var(--ease-out), transform .1s var(--ease-out);
}

.lib-search-clear:hover[b-o2i11ta2uw] {
    color: var(--blood);
    background: rgba(179, 22, 15, .08);
}

.lib-search-clear:active[b-o2i11ta2uw] {
    transform: scale(.97);
}

.lib-search-clear:focus-visible[b-o2i11ta2uw] {
    outline: 2px solid var(--ember);
    outline-offset: 1px;
}

/* Quick chips */
.lib-quick-chips[b-o2i11ta2uw] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 8px;
    align-items: center;
}

.lib-chip-label[b-o2i11ta2uw] {
    font-size: 11px;
    color: var(--ink-link);
    font-family: Inter, sans-serif;
}

.lib-chip[b-o2i11ta2uw] {
    font-size: 11px;
    padding: 3px 9px;
    border-radius: 10px;
    background: rgba(42, 24, 8, .10);
    border: 1px solid rgba(42, 24, 8, .28);
    color: var(--ink);
    cursor: pointer;
    transition: background .15s var(--ease-out), border-color .15s var(--ease-out), color .15s var(--ease-out), transform .1s var(--ease-out);
    font-family: Inter, sans-serif;
}

.lib-chip:hover[b-o2i11ta2uw] {
    background: rgba(179, 22, 15, .12);
    border-color: rgba(179, 22, 15, .40);
    color: var(--blood);
}

.lib-chip:active[b-o2i11ta2uw] {
    transform: scale(.97);
}

.lib-chip:focus-visible[b-o2i11ta2uw] {
    outline: 2px solid var(--ember);
    outline-offset: 2px;
}

/* ── Character spine ─────────────────────────────────────────────────────── */
.lib-char-selector[b-o2i11ta2uw] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

/* Vocation tabs */
.lib-voc-tabs[b-o2i11ta2uw] {
    display: flex;
    flex-wrap: wrap;
    gap: 3px;
}

.lib-voc-tab[b-o2i11ta2uw] {
    font-family: Inter, sans-serif;
    font-size: 12.5px;
    font-weight: 600;
    padding: 5px 13px;
    border-radius: 3px;
    border: 1px solid rgba(42, 24, 8, .32);
    background: rgba(255, 255, 255, .35);
    color: var(--ink);
    cursor: pointer;
    transition: background .14s var(--ease-out), color .14s var(--ease-out), border-color .14s var(--ease-out), transform .1s var(--ease-out);
}

.lib-voc-tab:hover[b-o2i11ta2uw] {
    background: rgba(255, 255, 255, .55);
    border-color: rgba(42, 24, 8, .42);
    color: var(--ink);
}

.lib-voc-tab:active[b-o2i11ta2uw] {
    transform: scale(.985);
}

.lib-voc-tab:focus-visible[b-o2i11ta2uw] {
    outline: 2px solid var(--ember);
    outline-offset: 2px;
}

/* Active states per vocation */
.lib-voc-tab.lib-voc-k.on[b-o2i11ta2uw] {
    background: rgba(201, 79, 42, .14);
    color: var(--vocation-knight);
    border-color: rgba(201, 79, 42, .38);
}

.lib-voc-tab.lib-voc-p.on[b-o2i11ta2uw] {
    background: rgba(58, 134, 201, .14);
    color: var(--vocation-paladin);
    border-color: rgba(58, 134, 201, .38);
}

.lib-voc-tab.lib-voc-s.on[b-o2i11ta2uw] {
    background: rgba(160, 79, 201, .14);
    color: var(--vocation-sorcerer);
    border-color: rgba(160, 79, 201, .38);
}

.lib-voc-tab.lib-voc-d.on[b-o2i11ta2uw] {
    background: rgba(79, 201, 106, .16);
    color: var(--vocation-druid);
    border-color: rgba(79, 201, 106, .40);
}

/* Level input */
.lib-level-selector[b-o2i11ta2uw] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--ink-soft);
    font-family: Inter, sans-serif;
}

.lib-level-label[b-o2i11ta2uw] {
    font-size: 11.5px;
    color: var(--ink);
    letter-spacing: .06em;
    text-transform: uppercase;
    font-weight: 600;
}

.lib-level-input[b-o2i11ta2uw] {
    width: 54px;
    min-width: 0;
    padding: 4px 6px;
    border: 1px solid rgba(42, 24, 8, .2);
    border-radius: 3px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 13px;
    background: rgba(255, 255, 255, .5);
    color: var(--ink);
    outline: none;
    font-variant-numeric: tabular-nums;
    transition: border-color .14s var(--ease-out), box-shadow .14s var(--ease-out);
    -moz-appearance: textfield;
}

.lib-level-input:focus[b-o2i11ta2uw] {
    border-color: var(--ember);
    box-shadow: 0 0 0 2px rgba(255, 106, 26, .15);
}

.lib-level-input[b-o2i11ta2uw]::-webkit-inner-spin-button,
.lib-level-input[b-o2i11ta2uw]::-webkit-outer-spin-button {
    opacity: 1;
}

/* ── Progress band ────────────────────────────────────────────────────────── */
.lib-progress-band[b-o2i11ta2uw] {
    display: flex;
    gap: 2px;
    margin-bottom: 16px;
    border-radius: 3px;
    overflow: hidden;
}

.lib-band-seg[b-o2i11ta2uw] {
    flex: 1;
    padding: 6px 4px 5px;
    text-align: center;
    background: rgba(42, 24, 8, .06);
    border: 1px solid rgba(42, 24, 8, .1);
    font-size: 9.5px;
    color: var(--ink);
    cursor: default;
    transition: background .15s;
}

.lib-band-seg.lib-band-active[b-o2i11ta2uw] {
    background: rgba(179, 22, 15, .12);
    border-color: rgba(179, 22, 15, .30);
    color: var(--ink);
}

.lib-band-verified[b-o2i11ta2uw]    { border-top: 2px solid rgba(95, 224, 138, .5); }
.lib-band-partial[b-o2i11ta2uw]     { border-top: 2px solid rgba(232, 161, 60, .5); }
.lib-band-unverified[b-o2i11ta2uw]  { border-top: 2px solid rgba(42, 24, 8, .15); }

.lib-band-lbl[b-o2i11ta2uw] {
    display: block;
    font-family: Cinzel, Georgia, serif;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.lib-band-range[b-o2i11ta2uw] {
    display: block;
    font-family: 'JetBrains Mono', monospace;
    font-size: 8.5px;
    margin-top: 1px;
    font-variant-numeric: tabular-nums;
}

/* ── Section headings ────────────────────────────────────────────────────── */
.lib-section[b-o2i11ta2uw] {
    margin-top: 18px;
    padding-top: 14px;
    border-top: 1px solid rgba(42, 24, 8, .1);
}

.lib-section:first-child[b-o2i11ta2uw] {
    margin-top: 0;
    border-top: none;
}

.lib-section-title[b-o2i11ta2uw] {
    font-family: Cinzel, Georgia, serif;
    font-size: 12.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .09em;
    color: var(--blood);
    margin-bottom: 10px;
}

/* ── Notices ─────────────────────────────────────────────────────────────── */
.lib-notice[b-o2i11ta2uw] {
    font-size: 12px;
    border-radius: 3px;
    padding: 8px 12px;
    margin-bottom: 10px;
    line-height: 1.55;
    color: var(--ink-soft);
}

.lib-notice-warn[b-o2i11ta2uw] {
    background: rgba(179, 22, 15, .07);
    border: 1px solid rgba(179, 22, 15, .25);
}

.lib-notice-info[b-o2i11ta2uw] {
    background: rgba(232, 161, 60, .08);
    border: 1px solid rgba(232, 161, 60, .25);
}

.lib-empty-note[b-o2i11ta2uw] {
    font-size: 12px;
    color: var(--ink-soft);
    font-style: italic;
    padding: 6px 0;
}

/* ── Hunt zone cards ─────────────────────────────────────────────────────── */
.lib-zone-card[b-o2i11ta2uw] {
    border: 1px solid rgba(42, 24, 8, .14);
    border-radius: 4px;
    padding: 10px 12px;
    margin-bottom: 8px;
    background: rgba(255, 255, 255, .3);
    transition: background .15s var(--ease-out), transform .1s var(--ease-out);
}

.lib-zone-card:hover[b-o2i11ta2uw] {
    background: rgba(255, 255, 255, .48);
}

.lib-zone-card:active[b-o2i11ta2uw] {
    transform: scale(.985);
}

.lib-zone-verified[b-o2i11ta2uw]   { background: rgba(95, 224, 138, .06); }
.lib-zone-partial[b-o2i11ta2uw]    { background: rgba(232, 161, 60, .06); }
.lib-zone-unverified[b-o2i11ta2uw] { background: rgba(255, 255, 255, .3); }

.lib-zone-head[b-o2i11ta2uw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 4px;
}

.lib-zone-name[b-o2i11ta2uw] {
    font-family: Cinzel, Georgia, serif;
    font-size: 12px;
    font-weight: 600;
    color: var(--ink);
}

.lib-zone-badge[b-o2i11ta2uw] {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    padding: 1px 6px;
    border-radius: 10px;
    flex-shrink: 0;
}

.lib-badge-verified[b-o2i11ta2uw]   { background: rgba(95, 224, 138, .15); color: #236b38; }
.lib-badge-partial[b-o2i11ta2uw]    { background: rgba(232, 161, 60, .15);  color: #8a6020; }
.lib-badge-unverified[b-o2i11ta2uw] { background: rgba(42, 24, 8, .07);     color: var(--ink); }

.lib-zone-meta[b-o2i11ta2uw] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    font-size: 11px;
    color: var(--ink-soft);
    margin-bottom: 3px;
}

.lib-zone-xp[b-o2i11ta2uw] {
    font-family: 'JetBrains Mono', monospace;
    font-variant-numeric: tabular-nums;
}

.lib-zone-monsters[b-o2i11ta2uw] {
    font-size: 11.5px;
    color: var(--ink-soft);
    margin-bottom: 4px;
}

.lib-zone-notes[b-o2i11ta2uw] {
    font-size: 11px;
    color: var(--ink-soft);
    margin: 4px 0 0;
    line-height: 1.5;
}

/* ── Spells ──────────────────────────────────────────────────────────────── */
.lib-spell-group[b-o2i11ta2uw] {
    margin-bottom: 12px;
}

.lib-sg-label[b-o2i11ta2uw] {
    font-family: Cinzel, Georgia, serif;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ink);
    margin-bottom: 5px;
}

.lib-spell-row[b-o2i11ta2uw] {
    display: grid;
    grid-template-columns: 38px 130px 1fr auto;
    align-items: center;
    gap: 6px;
    padding: 4px 6px;
    border-radius: 2px;
    font-size: 12px;
    border-bottom: 1px solid rgba(42, 24, 8, .06);
    transition: background .12s var(--ease-out), transform .1s var(--ease-out);
}

.lib-spell-row:hover[b-o2i11ta2uw] {
    background: rgba(255, 255, 255, .4);
}

.lib-spell-row:active[b-o2i11ta2uw] {
    transform: scale(.985);
}

.lib-spell-row.lib-spell-milestone[b-o2i11ta2uw] {
    background: rgba(232, 161, 60, .08);
}

.lib-spell-badge[b-o2i11ta2uw] {
    font-size: 8.5px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    padding: 1px 5px;
    border-radius: 10px;
    text-align: center;
}

.lib-badge-new[b-o2i11ta2uw]   { background: rgba(79, 201, 106, .18); color: #1f5a30; }
.lib-badge-have[b-o2i11ta2uw]  { background: rgba(42, 24, 8, .07);    color: var(--ink); }
.lib-badge-soon[b-o2i11ta2uw]  { background: rgba(179, 22, 15, .1);   color: #7a1010; }

.lib-spell-words[b-o2i11ta2uw] {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    color: var(--ember-soft);
    background: rgba(42, 24, 8, .06);
    border-radius: 2px;
    padding: 1px 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lib-spell-name[b-o2i11ta2uw] {
    color: var(--ink-soft);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lib-spell-stat[b-o2i11ta2uw] {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    color: var(--ink);
    text-align: right;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

/* Narrow viewport: stack spell row */
@media (max-width: 600px) {
    .lib-spell-row[b-o2i11ta2uw] {
        grid-template-columns: 38px 1fr;
        grid-template-rows: auto auto;
    }

    .lib-spell-words[b-o2i11ta2uw] { grid-column: 2; }
    .lib-spell-name[b-o2i11ta2uw]  { grid-column: 1 / -1; }
    .lib-spell-stat[b-o2i11ta2uw]  { grid-column: 1 / -1; text-align: left; }
}

/* ── Quest table ─────────────────────────────────────────────────────────── */
.lib-quest-table[b-o2i11ta2uw] {
    width: 100%;
    font-size: 12px;
    margin-bottom: 10px;
}

.lib-quest-reward[b-o2i11ta2uw] {
    color: var(--ink-soft);
    font-size: 11.5px;
}

.lib-quest-link[b-o2i11ta2uw] {
    color: var(--ink-link);
    text-decoration: underline;
    text-underline-offset: 2px;
    transition: color .14s var(--ease-out), filter .14s var(--ease-out);
}

.lib-quest-link:hover[b-o2i11ta2uw] {
    color: var(--ember);
}

.lib-quest-link:active[b-o2i11ta2uw] {
    filter: brightness(.85);
}

.lib-quest-link:focus-visible[b-o2i11ta2uw] {
    outline: 2px solid var(--ember);
    border-radius: 1px;
}

/* Quest tags */
.lib-qtag[b-o2i11ta2uw] {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    padding: 1px 5px;
    border-radius: 8px;
    margin-right: 3px;
    white-space: nowrap;
}

.lib-qtag-solo[b-o2i11ta2uw]     { background: rgba(58, 134, 201, .12); color: #225080; }
.lib-qtag-team[b-o2i11ta2uw]     { background: rgba(160, 79, 201, .12); color: #5a2080; }
.lib-qtag-inferred[b-o2i11ta2uw] { background: rgba(232, 161, 60, .12); color: #7a5010; }
.lib-qtag-toosoon[b-o2i11ta2uw]  { background: rgba(179, 22, 15, .1);   color: #7a1010; }

/* Too-soon row */
.lib-toosoon-group[b-o2i11ta2uw] {
    margin-top: 10px;
}

.lib-toosoon-row[b-o2i11ta2uw] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 6px;
    font-size: 12px;
    color: var(--ink-soft);
    border-bottom: 1px solid rgba(42, 24, 8, .06);
}

.lib-toosoon-name[b-o2i11ta2uw] {
    flex: 1;
    color: var(--ink-soft);
}

.lib-toosoon-city[b-o2i11ta2uw] {
    font-size: 11px;
    color: var(--ink);
}

/* ── Monster table ────────────────────────────────────────────────────────── */
.lib-monster-table[b-o2i11ta2uw] {
    width: 100%;
    font-size: 12px;
}

/* Element chips */
.lib-el[b-o2i11ta2uw] {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    padding: 1px 5px;
    border-radius: 8px;
    margin-right: 3px;
    white-space: nowrap;
}

.lib-el-none[b-o2i11ta2uw] {
    color: var(--ink);
}

/* Element colours (weakness = bright, immunity = muted) */
.lib-el-fire[b-o2i11ta2uw]    { background: rgba(255, 106, 26, .15); color: #8a3010; }
.lib-el-ice[b-o2i11ta2uw]     { background: rgba(150, 210, 255, .25); color: #1a5080; }
.lib-el-energy[b-o2i11ta2uw]  { background: rgba(200, 150, 255, .2);  color: #5a2080; }
.lib-el-earth[b-o2i11ta2uw]   { background: rgba(120, 200, 80, .2);   color: #2a5010; }
.lib-el-death[b-o2i11ta2uw]   { background: rgba(80, 60, 100, .2);    color: #3a2050; }
.lib-el-holy[b-o2i11ta2uw]    { background: rgba(255, 220, 100, .2);  color: #7a5010; }
.lib-el-physical[b-o2i11ta2uw] { background: rgba(42, 24, 8, .1);     color: var(--ink); }
.lib-el-immune[b-o2i11ta2uw]  { background: rgba(42, 24, 8, .06);     color: var(--ink); font-style: italic; }

/* Narrow viewport: scroll monster + quest tables */
@media (max-width: 640px) {
    .lib-monster-table[b-o2i11ta2uw],
    .lib-quest-table[b-o2i11ta2uw] {
        display: block;
        overflow-x: auto;
    }
}

/* ── Search results ───────────────────────────────────────────────────────── */
.lib-results-wrap[b-o2i11ta2uw] {
    display: grid;
    grid-template-columns: 130px 1fr;
    gap: 0;
    border-top: 1px solid rgba(42, 24, 8, .1);
    margin-top: 8px;
}

.lib-facets[b-o2i11ta2uw] {
    padding: 10px 10px 10px 0;
    border-right: 1px solid rgba(42, 24, 8, .1);
}

.lib-facet-title[b-o2i11ta2uw] {
    font-family: Cinzel, Georgia, serif;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ink);
    margin-bottom: 6px;
}

.lib-facet-item[b-o2i11ta2uw] {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 3px 0;
    font-size: 11.5px;
    color: var(--ink-soft);
}

.lib-facet-name[b-o2i11ta2uw] {
    flex: 1;
}

.lib-facet-count[b-o2i11ta2uw] {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    color: var(--ink);
    font-variant-numeric: tabular-nums;
}

/* Type colour dots */
.lib-type-dot[b-o2i11ta2uw] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.lib-type-monster[b-o2i11ta2uw] { background: var(--blood); }
.lib-type-quest[b-o2i11ta2uw]   { background: var(--gold); }
.lib-type-hunt[b-o2i11ta2uw]    { background: var(--vocation-druid); }
.lib-type-spell[b-o2i11ta2uw]   { background: var(--vocation-sorcerer); }

.lib-results-panel[b-o2i11ta2uw] {
    padding: 10px 4px 10px 12px;
}

.lib-result-meta[b-o2i11ta2uw] {
    font-size: 11.5px;
    color: var(--ink);
    margin-bottom: 10px;
}

.lib-result-meta strong[b-o2i11ta2uw] {
    color: var(--ink);
}

/* Result group headers */
.lib-rg-head[b-o2i11ta2uw] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 5px;
    margin-top: 12px;
}

.lib-rg-head:first-of-type[b-o2i11ta2uw] {
    margin-top: 0;
}

.lib-rg-name[b-o2i11ta2uw] {
    font-family: Cinzel, Georgia, serif;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.lib-type-text-monster[b-o2i11ta2uw] { color: #7a1010; }
.lib-type-text-quest[b-o2i11ta2uw]   { color: #8a6020; }
.lib-type-text-hunt[b-o2i11ta2uw]    { color: #1f5a30; }
.lib-type-text-spell[b-o2i11ta2uw]   { color: #5a2080; }

.lib-rg-count[b-o2i11ta2uw] {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    color: var(--ink);
    font-variant-numeric: tabular-nums;
}

.lib-rg-line[b-o2i11ta2uw] {
    flex: 1;
    height: 1px;
    background: rgba(42, 24, 8, .1);
}

/* Result cards */
.lib-result-card[b-o2i11ta2uw] {
    display: flex;
    align-items: center;
    gap: 0;
    border-radius: 3px;
    margin-bottom: 4px;
    background: rgba(255, 255, 255, .3);
    border: 1px solid rgba(42, 24, 8, .1);
    overflow: hidden;
    transition: background .13s var(--ease-out), transform .1s var(--ease-out);
    min-height: 38px;
}

.lib-result-card:hover[b-o2i11ta2uw] {
    background: rgba(255, 255, 255, .5);
}

.lib-result-card:active[b-o2i11ta2uw] {
    transform: scale(.985);
}

.lib-result-link[b-o2i11ta2uw] {
    display: block;
    text-decoration: none;
    color: inherit;
}

.lib-result-link:hover .lib-result-card[b-o2i11ta2uw] {
    background: rgba(255, 255, 255, .5);
}

.lib-result-link:active .lib-result-card[b-o2i11ta2uw] {
    transform: scale(.985);
}

.lib-rc-bar[b-o2i11ta2uw] {
    width: 3px;
    align-self: stretch;
    flex-shrink: 0;
}

.lib-type-bar-monster[b-o2i11ta2uw] { background: var(--blood); }
.lib-type-bar-quest[b-o2i11ta2uw]   { background: var(--gold); }
.lib-type-bar-hunt[b-o2i11ta2uw]    { background: var(--vocation-druid); }
.lib-type-bar-spell[b-o2i11ta2uw]   { background: var(--vocation-sorcerer); }

.lib-rc-body[b-o2i11ta2uw] {
    flex: 1;
    padding: 6px 8px;
    min-width: 0;
}

.lib-rc-name[b-o2i11ta2uw] {
    font-size: 12px;
    color: var(--ink);
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lib-rc-sub[b-o2i11ta2uw] {
    font-size: 10.5px;
    color: var(--ink-soft);
    margin-top: 1px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lib-rc-badge[b-o2i11ta2uw] {
    font-size: 8.5px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ink);
    padding: 2px 8px;
    flex-shrink: 0;
}

.lib-result-more[b-o2i11ta2uw] {
    font-size: 11px;
    color: var(--ink);
    font-style: italic;
    padding: 3px 6px;
}

/* Narrow: stack results to single column */
@media (max-width: 580px) {
    .lib-results-wrap[b-o2i11ta2uw] {
        grid-template-columns: 1fr;
    }

    .lib-facets[b-o2i11ta2uw] {
        border-right: none;
        border-bottom: 1px solid rgba(42, 24, 8, .1);
        padding-bottom: 8px;
        padding-right: 0;
    }

    .lib-facets .lib-facet-item[b-o2i11ta2uw] {
        display: inline-flex;
        margin-right: 10px;
    }

    .lib-results-panel[b-o2i11ta2uw] {
        padding-left: 0;
    }
}

/* Prefers-reduced-motion: disable transitions and active transforms */
@media (prefers-reduced-motion: reduce) {
    .lib-voc-tab[b-o2i11ta2uw],
    .lib-search-bar[b-o2i11ta2uw],
    .lib-search-clear[b-o2i11ta2uw],
    .lib-level-input[b-o2i11ta2uw],
    .lib-zone-card[b-o2i11ta2uw],
    .lib-spell-row[b-o2i11ta2uw],
    .lib-quest-link[b-o2i11ta2uw],
    .lib-result-card[b-o2i11ta2uw],
    .lib-result-link[b-o2i11ta2uw],
    .lib-chip[b-o2i11ta2uw] {
        transition: none;
    }
    .lib-voc-tab:active[b-o2i11ta2uw],
    .lib-search-clear:active[b-o2i11ta2uw],
    .lib-zone-card:active[b-o2i11ta2uw],
    .lib-spell-row:active[b-o2i11ta2uw],
    .lib-quest-link:active[b-o2i11ta2uw],
    .lib-result-card:active[b-o2i11ta2uw],
    .lib-result-link:active .lib-result-card[b-o2i11ta2uw],
    .lib-chip:active[b-o2i11ta2uw] {
        transform: none;
    }
}
/* /Features/Npcs/Npcs.razor.rz.scp.css */
/* ── NPC Directory page styles ── */
/* Leans on global .post, .ptable, .cats, .pinp, .btn-ghost, .bst-pill from app.css.
   Only NPC-specific bits live here. */

/* ── Filter row ── */
.npc-filters[b-81wjehn1xy] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 12px;
}

.npc-search[b-81wjehn1xy] { max-width: 100%; }

.npc-cats[b-81wjehn1xy] { margin-bottom: 4px; }

/* ── Index table row ── */
.npc-row[b-81wjehn1xy] {
    cursor: pointer;
    transition: background .14s var(--ease-out), transform .12s var(--ease-out);
}

@media (hover: hover) and (pointer: fine) {
    .npc-row:hover[b-81wjehn1xy] {
        background: rgba(255, 106, 26, .06);
    }
}

.npc-row:active[b-81wjehn1xy] {
    transform: scale(0.985);
}

.npc-row.sel[b-81wjehn1xy] {
    background: rgba(232, 161, 60, .12);
}

.npc-thumb[b-81wjehn1xy] {
    width: 36px;
    text-align: center;
    padding: 2px 4px;
}

.npc-thumb img[b-81wjehn1xy] {
    display: block;
    margin: 0 auto;
    image-rendering: pixelated;
}

.npc-count[b-81wjehn1xy] {
    margin-top: 10px;
    font-size: 11.5px;
    color: var(--ink, #2a1a0a);
}

/* ── Detail panel ── */
.npc-detail[b-81wjehn1xy] {
    position: relative;
}

.npc-close[b-81wjehn1xy] {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 12px;
    padding: 4px 10px;
    color: var(--ink-soft, #5a3d22);
    background: none;
    border: 1px solid rgba(138, 52, 16, .3);
    border-radius: 3px;
    cursor: pointer;
    transition: color .14s var(--ease-out), border-color .14s var(--ease-out), transform .12s var(--ease-out);
}

@media (hover: hover) and (pointer: fine) {
    .npc-close:hover[b-81wjehn1xy] {
        color: var(--gold-lit, #e8a13c);
        border-color: var(--gold-lit, #e8a13c);
    }
}

.npc-close:focus-visible[b-81wjehn1xy] {
    outline: 2px solid var(--ember);
    outline-offset: 2px;
}

.npc-close:active[b-81wjehn1xy] {
    transform: scale(0.97);
}

/* ── Portrait + meta badges ── */
.npc-head[b-81wjehn1xy] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 14px;
}

.npc-portrait img[b-81wjehn1xy] {
    display: block;
    image-rendering: pixelated;
    width: 64px;
    height: 64px;
}

.npc-meta[b-81wjehn1xy] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    padding-top: 4px;
}

/* Badge pills */
.npc-badge[b-81wjehn1xy] {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    padding: 3px 9px;
    border-radius: 3px;
    border: 1px solid rgba(138, 52, 16, .3);
    color: var(--ink-soft, #5a3d22);
}

.npc-city[b-81wjehn1xy] { background: rgba(58, 36, 16, .18); }
.npc-pos[b-81wjehn1xy]  { background: rgba(58, 36, 16, .14); font-family: monospace; font-size: 10.5px; }
.npc-shop[b-81wjehn1xy] { border-color: rgba(42, 107, 56, .4); color: #2a6b38; background: rgba(42, 107, 56, .08); }

/* ── Greeting text ── */
.npc-greet[b-81wjehn1xy] {
    font-style: italic;
    color: var(--ink-soft, #5a3d22);
    border-left: 1px solid var(--ember, #ff6a1a);
    padding-left: 12px;
    margin-bottom: 14px;
    font-size: 13.5px;
    line-height: 1.55;
}

/* ── Shop tables ── */
.npc-shop-table[b-81wjehn1xy] { margin-bottom: 16px; }

/* ── No-shop notice ── */
.npc-noshop[b-81wjehn1xy] {
    font-size: 12.5px;
    color: var(--ink-link, #7a5c3a);
    font-style: italic;
    margin-top: 8px;
}

@media (prefers-reduced-motion: reduce) {
    .npc-row[b-81wjehn1xy],
    .npc-close[b-81wjehn1xy] {
        transition: none;
    }

    .npc-row:active[b-81wjehn1xy],
    .npc-close:active[b-81wjehn1xy] {
        transform: none;
    }
}

@media (max-width: 560px) {
    .npc-head[b-81wjehn1xy] { flex-direction: column; }
}
/* /Features/Quests/Quests.razor.rz.scp.css */
/* ── Quest guide page styles ── */

/* Sticky table chrome: the column header pins at the viewport top, and each
   city band pins just beneath it — this is what the page intro means by
   "sticky bands". Both need an opaque parchment background so rows slide
   under invisibly. */
.qst-table thead th[b-dn9ik4vipt] {
    position: sticky;
    top: 0;
    z-index: 3;
    background: #f3e9d4;
}

.qst-city-band th[b-dn9ik4vipt] {
    position: sticky;
    top: 31px; /* thead height (12px caps + padding) */
    z-index: 2;
    background: #ead9b8;
    text-align: left;
    scroll-margin-top: 66px; /* deep links (#edron) land below both sticky layers */
}

/* Narrow viewport: scroll instead of clipping the rightmost columns.
   The block layout drops sticky (the table scrolls horizontally instead). */
@media (max-width: 640px) {
    .qst-table[b-dn9ik4vipt] {
        display: block;
        overflow-x: auto;
    }

    .qst-table thead th[b-dn9ik4vipt],
    .qst-city-band th[b-dn9ik4vipt] {
        position: static;
    }
}

/* Index table row — clickable like Bestiary */
.qst-row[b-dn9ik4vipt] {
    cursor: pointer;
    transition: background .14s var(--ease-out);
}

@media (hover: hover) and (pointer: fine) {
    .qst-row:hover[b-dn9ik4vipt] {
        background: rgba(255, 106, 26, .06);
    }
}

.qst-row:active[b-dn9ik4vipt] {
    background: rgba(255, 106, 26, .1);
}

.qst-row.sel[b-dn9ik4vipt] {
    background: rgba(232, 161, 60, .12);
}

.qst-count[b-dn9ik4vipt] {
    margin-top: 10px;
    font-size: 11.5px;
    color: var(--ink, #2a1a0a);
}

/* Detail panel */
.qst-detail[b-dn9ik4vipt] {
    position: relative;
}

.qst-close[b-dn9ik4vipt] {
    position: absolute;
    top: 0;
    right: 0;
}

.qst-close:focus-visible[b-dn9ik4vipt] {
    outline: 2px solid var(--ember);
    outline-offset: 2px;
}

/* Meta badges row */
.qst-meta[b-dn9ik4vipt] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 14px;
}

.qst-badge[b-dn9ik4vipt] {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    padding: 3px 9px;
    border-radius: 3px;
    border: 1px solid rgba(138, 52, 16, .3);
    color: var(--ink-soft, #5a3d22);
}

.qst-city[b-dn9ik4vipt] {
    background: rgba(58, 36, 16, .18);
}

.qst-level[b-dn9ik4vipt] {
    background: rgba(58, 36, 16, .14);
}

/* Evidence badge */
.qst-ev[b-dn9ik4vipt] {
    border-color: rgba(60, 110, 60, .45);
    color: #2a6b38;
}

/* Danger / difficulty colours — ink-on-parchment versions so they pass AA. */
.qst-danger-low[b-dn9ik4vipt]    { color: #2a6b38; border-color: rgba(42, 107, 56, .35); }
.qst-danger-medium[b-dn9ik4vipt] { color: #8a5a10; border-color: rgba(138, 90, 16, .35); }
.qst-danger-high[b-dn9ik4vipt]   { color: #a04010; border-color: rgba(160, 64, 16, .35); }
.qst-danger-extreme[b-dn9ik4vipt] { color: #8a1010; border-color: rgba(138, 16, 16, .4); font-weight: 800; }

/* Coloured dot in index table */
.qst-dot[b-dn9ik4vipt] {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 4px;
    vertical-align: middle;
    box-shadow: 0 0 5px currentColor;
    background: currentColor;
}

/* Intro paragraph — full ink, no italics: readable on the busy parchment. */
.qst-intro[b-dn9ik4vipt] {
    color: var(--ink, #2a1a0a);
    border-left: 1px solid var(--ember, #ff6a1a);
    padding-left: 12px;
    margin-bottom: 14px;
}

/* Detail body text at full ink — ink-soft washes out against the parchment texture. */
.qst-detail p[b-dn9ik4vipt] {
    color: var(--ink, #2a1a0a);
}

/* Hints list */
.qst-hints[b-dn9ik4vipt] {
    padding-left: 22px;
    margin: 0;
}

.qst-hints li[b-dn9ik4vipt] {
    font-size: 13.5px;
    line-height: 1.6;
    color: var(--ink, #2a1a0a);
    margin-bottom: 7px;
}

/* Chest table */
.qst-chests td:first-child[b-dn9ik4vipt] {
    font-family: monospace;
    font-size: 12px;
}

/* Wiki spoiler link badge */
.qst-wiki[b-dn9ik4vipt] {
    text-decoration: none;
}

.qst-wiki:hover[b-dn9ik4vipt] {
    background: rgba(138, 52, 16, .1);
}

/* Quest area map (rendered from the live OTBM by /map/region) */
.qst-map[b-dn9ik4vipt] {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 8px 0 12px;
    border: 2px solid #1a0f06;
    border-radius: 5px;
    image-rendering: pixelated;
}

/* Numbered chest rewards — numbers match the map markers */
.qst-rewards[b-dn9ik4vipt] {
    margin: 0 0 6px;
    padding-left: 22px;
}

.qst-rewards li[b-dn9ik4vipt] {
    font-size: 13.5px;
    line-height: 1.6;
    color: var(--ink, #2a1a0a);
}

.qst-rewards li[b-dn9ik4vipt]::marker {
    font-weight: 700;
    color: var(--ember, #ff6a1a);
}

/* Raw coordinates as small-print for those who want them */
.qst-coords[b-dn9ik4vipt] {
    font-family: monospace;
    font-size: 11.5px;
    color: var(--ink-soft, #5a3d22);
    margin-bottom: 10px;
}

/* Inferred notice */
.qst-notice[b-dn9ik4vipt] {
    margin-top: 16px;
    padding: 10px 14px;
    background: rgba(58, 36, 16, .1);
    border: 1px solid rgba(138, 52, 16, .25);
    border-radius: 3px;
    font-size: 12.5px;
    color: var(--ink-soft, #5a3d22);
}

@media (prefers-reduced-motion: reduce) {
    .qst-row[b-dn9ik4vipt] {
        transition: none;
    }
}
/* /Features/Spells/Spells.razor.rz.scp.css */
/* ── Spell List page styles ── */
/* Leans on global .post, .ptable, .pinp from app.css. Vocation tab palette
   matches Library.razor.css for visual consistency. */

/* ── Controls row ── */
.spl-root[b-rlyzdha22v] { }

.spl-controls[b-rlyzdha22v] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 16px;
}

/* ── Vocation tabs ── */
.spl-voc-tabs[b-rlyzdha22v] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.spl-tab[b-rlyzdha22v] {
    font-family: Lora, Georgia, serif;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .04em;
    padding: 5px 14px;
    border-radius: 4px;
    border: 1px solid rgba(138, 52, 16, .3);
    background: rgba(58, 36, 16, .06);
    color: var(--ink-soft, #5a3d22);
    cursor: pointer;
    transition: background .14s var(--ease-out), border-color .14s var(--ease-out), color .14s var(--ease-out), transform .12s var(--ease-out);
}

.spl-tab:hover[b-rlyzdha22v] {
    background: rgba(232, 161, 60, .14);
    border-color: rgba(232, 161, 60, .5);
    color: var(--ink, #2a1a0a);
}

.spl-tab.on[b-rlyzdha22v] {
    background: linear-gradient(180deg, rgba(232, 161, 60, .28), rgba(232, 161, 60, .18));
    border-color: rgba(179, 22, 15, .65);
    color: var(--ink, #2a1a0a);
    box-shadow: inset 0 0 8px rgba(232, 161, 60, .25);
}

.spl-tab.on:hover[b-rlyzdha22v] {
    background: linear-gradient(180deg, rgba(232, 161, 60, .34), rgba(232, 161, 60, .22));
}

.spl-tab:active[b-rlyzdha22v] {
    transform: scale(0.985);
}

@media (prefers-reduced-motion: reduce) {
    .spl-tab[b-rlyzdha22v] {
        transition: none;
    }

    .spl-tab:active[b-rlyzdha22v] {
        transform: none;
    }
}

/* Vocation tints */
.spl-tab-knight[b-rlyzdha22v]  { border-color: rgba(80, 130, 200, .35); }
.spl-tab-paladin[b-rlyzdha22v] { border-color: rgba(140, 80, 180, .35); }
.spl-tab-sorcerer[b-rlyzdha22v] { border-color: rgba(200, 60, 60, .35); }
.spl-tab-druid[b-rlyzdha22v]   { border-color: rgba(60, 160, 80, .35); }

/* ── Search input ── */
.spl-search[b-rlyzdha22v] { max-width: 100%; }

/* ── Group heading ── */
.spl-group[b-rlyzdha22v] {
    margin: 20px 0 8px;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--blood, #b3160f);
    border-bottom: 1px solid rgba(138, 52, 16, .2);
    padding-bottom: 4px;
}

/* ── Spell table ── */
.spl-table[b-rlyzdha22v] { margin-bottom: 4px; }

.spl-table td[b-rlyzdha22v] { vertical-align: middle; }

/* Narrow viewport: scroll instead of clipping the rightmost columns */
@media (max-width: 640px) {
    .spl-table[b-rlyzdha22v] {
        display: block;
        overflow-x: auto;
    }
}

.spl-words[b-rlyzdha22v] {
    font-family: monospace;
    font-size: 12.5px;
    color: var(--ink-soft, #5a3d22);
}

.spl-vocs[b-rlyzdha22v] {
    font-size: 12px;
    color: var(--ink-soft, #5a3d22);
    white-space: nowrap;
}

/* Milestone row — subtle highlight */
.spl-milestone td[b-rlyzdha22v] {
    background: rgba(232, 161, 60, .10);
}

.spl-star[b-rlyzdha22v] {
    color: var(--gold-lit, #e8a13c);
    font-size: 11px;
    margin-left: 4px;
    vertical-align: top;
    line-height: 1.8;
}

/* ── Footer count ── */
.spl-count[b-rlyzdha22v] {
    margin-top: 10px;
    font-size: 11.5px;
    color: var(--ink, #2a1a0a);
}

/* ── Empty state ── */
.spl-empty[b-rlyzdha22v] {
    font-style: italic;
    color: var(--ink-link, #7a5c3a);
    margin-top: 12px;
}

@media (prefers-reduced-motion: reduce) {
    .spl-tab[b-rlyzdha22v] {
        transition: none;
    }
    .spl-tab:active[b-rlyzdha22v] {
        transform: none;
    }
}

@media (max-width: 560px) {
    .spl-voc-tabs[b-rlyzdha22v] { gap: 4px; }
    .spl-tab[b-rlyzdha22v] { font-size: 11px; padding: 4px 10px; }
}
/* /Shared/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-pewej239sm],
.components-reconnect-repeated-attempt-visible[b-pewej239sm],
.components-reconnect-failed-visible[b-pewej239sm],
.components-pause-visible[b-pewej239sm],
.components-resume-failed-visible[b-pewej239sm],
.components-rejoining-animation[b-pewej239sm] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-pewej239sm],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-pewej239sm],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-pewej239sm],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-pewej239sm],
#components-reconnect-modal.components-reconnect-retrying[b-pewej239sm],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-pewej239sm],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-pewej239sm],
#components-reconnect-modal.components-reconnect-failed[b-pewej239sm],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-pewej239sm] {
    display: block;
}


#components-reconnect-modal[b-pewej239sm] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s var(--ease-out) allow-discrete, overlay 0.5s var(--ease-out) allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-pewej239sm 0.5s var(--ease-out) both;
    &[open] {
        animation: components-reconnect-modal-slideUp-b-pewej239sm 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-pewej239sm 0.3s var(--ease-out) 0.3s;
        animation-fill-mode: both;
    }
}

#components-reconnect-modal[b-pewej239sm]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-pewej239sm 0.3s var(--ease-out);
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-pewej239sm {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-pewej239sm {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-pewej239sm {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-pewej239sm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-pewej239sm] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-pewej239sm] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
    transition: background-color 150ms var(--ease-out), transform 150ms var(--ease-out);
}

    #components-reconnect-modal button:hover[b-pewej239sm] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-pewej239sm] {
        background-color: #6b9ed2;
        transform: scale(0.985);
        transition-duration: 100ms;
    }

@media (prefers-reduced-motion: reduce) {
    #components-reconnect-modal[b-pewej239sm],
    #components-reconnect-modal[open][b-pewej239sm],
    #components-reconnect-modal[b-pewej239sm]::backdrop {
        animation: none;
        transition: none;
    }
    #components-reconnect-modal button[b-pewej239sm],
    #components-reconnect-modal button:active[b-pewej239sm] {
        transition: none;
        transform: none;
    }
}

.components-rejoining-animation[b-pewej239sm] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-pewej239sm] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-pewej239sm 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-pewej239sm] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-pewej239sm {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}