:root {
    color-scheme: dark;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background: #101014;
    color: #f2f2f2;
    --color-bg: #101014;
    --color-text: #f2f2f2;
    --color-text-muted: rgba(242, 242, 242, 0.68);
    --color-text-soft: rgba(242, 242, 242, 0.76);
    --surface-panel: rgba(255, 255, 255, 0.045);
    --surface-panel-strong: rgba(255, 255, 255, 0.075);
    --surface-panel-hover: rgba(255, 255, 255, 0.1);
    --border-soft: rgba(255, 255, 255, 0.12);
    --border-strong: rgba(255, 255, 255, 0.18);
    --radius-lg: 18px;
    --radius-md: 14px;
    --radius-sm: 12px;
    --space-xs: 0.35rem;
    --space-sm: 0.75rem;
    --space-md: 1rem;
    --space-lg: 1.25rem;
    --space-xl: 1.75rem;
    --shadow-soft: 0 12px 32px rgba(0, 0, 0, 0.22);

    /* Semantic design tokens */
    --surface-stone-canvas: #07090b;
    --surface-stone-base: #0d1114;
    --surface-stone-raised: #171b1d;
    --surface-stone-overlay: #202528;
    --surface-parchment-base: #c9a36d;
    --surface-parchment-raised: #d8b77d;
    --surface-parchment-muted: #b58d58;
    --surface-parchment-canvas: #a47c49;

    --text-on-stone: #f1dfba;
    --text-on-stone-muted: #c5ad7f;
    --text-ink: #21170e;
    --text-ink-muted: #66533d;

    --color-accent-gold: #d6a844;
    --color-accent-gold-muted: #a97829;
    --color-accent-bronze: #815421;
    --color-accent-bronze-dark: #4f3015;

    --state-success-surface: #315122;
    --state-success-border: #6f9948;
    --state-success-text: #edf7df;
    --state-information-surface: #16354c;
    --state-information-border: #4f7895;
    --state-information-text: #edf6fb;
    --state-warning-surface: #6b4a18;
    --state-warning-border: #c18a32;
    --state-warning-text: #fff2d2;
    --state-danger-surface: #66251f;
    --state-danger-border: #b95348;
    --state-danger-text: #fff0ed;

    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --space-7: 3rem;
    --space-8: 4rem;

    --border-width-thin: 1px;
    --border-width-strong: 2px;
    --border-width-emphasis: 3px;
    --radius-subtle: 2px;
    --radius-control: 4px;
    --radius-panel: 6px;

    --shadow-frame-inset: inset 0 0 0 1px rgba(255, 222, 151, 0.12);
    --shadow-surface: 0 8px 18px rgba(0, 0, 0, 0.28);
    --shadow-elevated: 0 14px 32px rgba(0, 0, 0, 0.38);

    --font-family-display: Georgia, "Times New Roman", serif;
    --font-family-body: Georgia, "Times New Roman", serif;
    --font-family-interface: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

    --layout-content-max: 96rem;
    --layout-sidebar-width: 14.5rem;
    --layout-header-min-height: 4.75rem;
    --layout-footer-min-height: 2.5rem;
    --layout-content-gap: 0.75rem;

    --motion-duration-fast: 120ms;
    --motion-duration-standard: 200ms;
    --motion-duration-slow: 320ms;
    --motion-easing-standard: cubic-bezier(0.2, 0, 0, 1);
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    min-height: 100vh;
    background: radial-gradient(circle at top, rgba(255, 255, 255, 0.08), transparent 34rem), #101014;
}

a {
    color: inherit;
}

.skip-link {
    position: absolute;
    left: 1rem;
    top: 1rem;
    transform: translateY(-200%);
    padding: 0.75rem 1rem;
    border-radius: 0.75rem;
    background: #f2f2f2;
    color: #101014;
    z-index: 10;
}

.skip-link:focus {
    transform: translateY(0);
}

.game-shell {
    width: min(1180px, calc(100% - 32px));
    margin: 0 auto;
    padding: 24px 0;
}

.panel,
.auth-card {
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.045);
    border-radius: 18px;
}

.game-frame {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 18px;
    margin: 18px 0;
}

.content-shell {
    isolation: isolate;
    position: relative;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 0;
    min-width: 0;
    padding: var(--space-2);
    border: var(--border-width-strong) solid color-mix(in srgb, var(--color-accent-bronze) 82%, var(--surface-stone-canvas));
    border-radius: var(--radius-subtle);
    background:
        linear-gradient(180deg, var(--surface-stone-raised), var(--surface-stone-base));
    box-shadow: var(--shadow-frame-inset), var(--shadow-elevated);
}

.content-shell::before,
.content-shell::after {
    content: "";
    position: absolute;
    pointer-events: none;
}

.content-shell::before {
    inset: var(--border-width-strong);
    z-index: 2;
    border: var(--border-width-thin) solid color-mix(in srgb, var(--color-accent-gold) 38%, transparent);
}

.content-shell::after {
    inset: calc(var(--space-2) - var(--border-width-thin));
    z-index: 2;
    background:
        linear-gradient(135deg, var(--color-accent-bronze) 0 1px, transparent 1px) top left / 1.35rem 1.35rem no-repeat,
        linear-gradient(225deg, var(--color-accent-bronze) 0 1px, transparent 1px) top right / 1.35rem 1.35rem no-repeat,
        linear-gradient(45deg, var(--color-accent-bronze) 0 1px, transparent 1px) bottom left / 1.35rem 1.35rem no-repeat,
        linear-gradient(315deg, var(--color-accent-bronze) 0 1px, transparent 1px) bottom right / 1.35rem 1.35rem no-repeat;
    opacity: 0.72;
}

.content-title-region,
.content-body {
    position: relative;
    z-index: 1;
    min-width: 0;
    background-color: var(--surface-parchment-base);
    background-image:
        url("../images/ui/surfaces/parchment-grain.svg"),
        radial-gradient(circle at 10% 0%, rgba(255, 250, 226, 0.34), transparent 24rem),
        linear-gradient(90deg, rgba(129, 84, 33, 0.045) 1px, transparent 1px);
    background-repeat: repeat, no-repeat, repeat;
    background-size: 96px 96px, auto, 3rem 100%;
}

.content-title-region {
    display: grid;
    gap: var(--space-1);
    padding: clamp(1rem, 2vw, 1.4rem) clamp(1rem, 2.4vw, 1.65rem);
    border-bottom: var(--border-width-thin) solid color-mix(in srgb, var(--color-accent-bronze) 58%, transparent);
    color: var(--text-ink);
}

.content-title-region::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -0.28rem;
    width: 0.48rem;
    height: 0.48rem;
    transform: translateX(-50%) rotate(45deg);
    border: var(--border-width-thin) solid var(--color-accent-bronze);
    background: var(--surface-parchment-base);
    pointer-events: none;
}

.content-title-section {
    color: var(--text-ink-muted);
    font-family: var(--font-family-interface);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.content-page-title {
    color: var(--text-ink);
    font-family: var(--font-family-display);
    font-size: clamp(1.55rem, 3vw, 2.25rem);
    line-height: 1.08;
    overflow-wrap: anywhere;
}

.content-page-purpose {
    max-width: 70ch;
    margin: 0;
    color: var(--text-ink-muted);
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.content-body {
    display: grid;
    align-content: start;
    gap: var(--layout-content-gap);
    padding: clamp(1rem, 2.4vw, 1.65rem);
}

.content-shell:focus-visible {
    outline: var(--border-width-strong) solid var(--color-accent-gold);
    outline-offset: var(--border-width-strong);
}

@media (max-width: 620px) {
    .flash { grid-template-columns: auto minmax(0, 1fr); }
    .flash .notice-copy { grid-column: 2; }

    .content-shell {
        padding: var(--space-1);
    }

    .content-title-region,
    .content-body {
        padding: var(--space-3);
    }

    .content-page-title {
        font-size: clamp(1.35rem, 8vw, 1.8rem);
    }
}

.panel {
    padding: 28px;
}

.hero-panel h1 {
    margin-top: 0;
    font-size: clamp(2rem, 6vw, 4rem);
}

.eyebrow {
    letter-spacing: 0.12em;
    text-transform: uppercase;
    opacity: 0.72;
    margin: 0 0 0.5rem;
}

dt {
    color: rgba(242, 242, 242, 0.66);
}

.flash-stack {
    display: grid;
    gap: 10px;
}

.flash {
    display: grid;
    grid-template-columns: auto auto minmax(0, 1fr);
    gap: 0.35rem 0.65rem;
    padding: 14px 16px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-left-width: 5px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.1);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
    color: var(--text-on-stone);
    line-height: 1.5;
}

.flash-label {
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--text-on-stone);
    opacity: 1;
}

.notice-icon { color: var(--text-on-stone); font-weight: 900; }
.notice-copy { display: grid; gap: 0.35rem; min-width: 0; }
.flash-primary { color: var(--text-on-stone); overflow-wrap: anywhere; }
.flash-details { display: grid; gap: 0.2rem; color: var(--text-on-stone-muted); }
.notice-detail { display: block; overflow-wrap: anywhere; }
.flash-actions { display: flex; flex-wrap: wrap; gap: 0.45rem 0.75rem; }
.flash-actions a { color: var(--text-on-stone); font-weight: 800; text-decoration: underline; text-underline-offset: 0.18em; overflow-wrap: anywhere; }
.flash-success .flash-label { color: var(--state-success-text); }
.flash-error .flash-label { color: var(--state-danger-text); }
.flash-warning .flash-label { color: var(--state-warning-text); }
.flash-notice .flash-label,
.flash-info .flash-label { color: var(--state-information-text); }

.flash-success {
    border-left-color: rgba(132, 255, 169, 0.72);
}

.flash-error {
    border-left-color: rgba(255, 126, 126, 0.78);
}

.auth-layout {
    display: grid;
    place-items: center;
    padding: 24px;
}

.auth-card {
    width: min(460px, 100%);
    padding: 32px;
}

.auth-note {
    color: rgba(242, 242, 242, 0.66);
}

dl {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 10px 18px;
}

dd {
    margin: 0;
}

.quiet-note {
    color: rgba(242, 242, 242, 0.66);
    font-size: 0.95rem;
}

@media (max-width: 780px) {
    .game-frame {
        grid-template-columns: 1fr;
    }

}


.form-stack {
    display: grid;
    gap: 1rem;
    margin: 1rem 0;
}

.form-stack label {
    display: grid;
    gap: 0.4rem;
    font-weight: 700;
}

.form-stack input {
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 0.75rem;
    background: rgba(255, 255, 255, 0.08);
    color: inherit;
    padding: 0.8rem 0.9rem;
}

.form-stack button,
.inline-form button {
    border: 0;
    border-radius: 0.75rem;
    cursor: pointer;
    font-weight: 800;
    padding: 0.75rem 1rem;
}

.form-error {
    color: #ffb4b4;
    font-size: 0.9rem;
    margin: -0.4rem 0 0;
}

.auth-switch {
    margin-top: 1rem;
}

.inline-form {
    display: inline;
    margin: 0;
}

.inline-form button {
    padding: 0.45rem 0.7rem;
}

.account-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 0.8fr);
    gap: 1rem;
}

.character-slot-card {
    border: 1px dashed rgba(255, 255, 255, 0.22);
    border-radius: 1rem;
    padding: 1.25rem;
    background: var(--surface-parchment-base);
}

@media (max-width: 780px) {
    .account-grid {
        grid-template-columns: 1fr;
    }
}


.button-link {
    display: inline-block;
    border-radius: 0.75rem;
    font-weight: 800;
    padding: 0.75rem 1rem;
    text-decoration: none;
    background: rgba(255, 255, 255, 0.12);
}

.button-link:hover,
.button-link:focus {
    background: rgba(255, 255, 255, 0.18);
    outline: none;
}


.profile-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 0.8fr);
    gap: 1rem;
}

.profile-card {
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 1rem;
    padding: 1.25rem;
    background: rgba(255, 255, 255, 0.04);
}

@media (max-width: 780px) {
    .profile-grid {
        grid-template-columns: 1fr;
    }
}


.world-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 0.8fr);
    gap: 1rem;
}

.world-card {
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 1rem;
    padding: 1.25rem;
    background: rgba(255, 255, 255, 0.04);
}

@media (max-width: 780px) {
    .world-grid {
        grid-template-columns: 1fr;
    }
}


.activity-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 0.8fr);
    gap: 1rem;
}

.activity-card {
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 1rem;
    padding: 1.25rem;
    background: rgba(255, 255, 255, 0.04);
}

.inline-action-form {
    display: inline-block;
    margin: 0 0.5rem 0.75rem 0;
}

.inline-action-form button {
    border: 0;
    border-radius: 0.75rem;
    cursor: pointer;
    font-weight: 800;
    padding: 0.75rem 1rem;
}

@media (max-width: 780px) {
    .activity-grid {
        grid-template-columns: 1fr;
    }
}


.travel-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 0.8fr);
    gap: 1rem;
}

.travel-card,
.destination-card {
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 1rem;
    padding: 1.25rem;
    background: rgba(255, 255, 255, 0.04);
}

.destination-card {
    margin-bottom: 1rem;
}

@media (max-width: 780px) {
    .travel-grid {
        grid-template-columns: 1fr;
    }
}


.inventory-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 0.8fr);
    gap: 1rem;
}

.inventory-card,
.item-definition-card {
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 1rem;
    padding: 1.25rem;
    background: rgba(255, 255, 255, 0.04);
}

.item-definition-card {
    margin-bottom: 1rem;
}

.inventory-table {
    width: calc(100% - .5rem);
    border-collapse: collapse;
    margin-top: 1rem;
}

.inventory-table th,
.inventory-table td {
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
    padding: 0.75rem;
    text-align: left;
}

@media (max-width: 780px) {
    .inventory-grid {
        grid-template-columns: 1fr;
    }
}


.skills-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 0.8fr);
    gap: 1rem;
}

.skills-card,
.skill-definition-card {
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 1rem;
    padding: 1.25rem;
    background: rgba(255, 255, 255, 0.04);
}

.skill-definition-card {
    margin-bottom: 1rem;
}

.skills-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 1rem;
}

.skills-table th,
.skills-table td {
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
    padding: 0.75rem;
    text-align: left;
}

@media (max-width: 780px) {
    .skills-grid {
        grid-template-columns: 1fr;
    }
}


.harvesting-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 0.8fr);
    gap: 1rem;
}

.harvesting-card,
.harvesting-node-card {
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 1rem;
    padding: 1.25rem;
    background: rgba(255, 255, 255, 0.04);
}

.harvesting-node-card {
    margin-bottom: 1rem;
}

.harvesting-node-identity {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.7rem;
    align-items: start;
}

.harvesting-node-identity__portrait {
    display: grid;
    width: 2.75rem;
    height: 2.75rem;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(230, 190, 98, 0.28);
    border-radius: 0.65rem;
    background: rgba(230, 190, 98, 0.09);
    color: var(--color-gold-light);
    font-weight: 700;
}

.harvesting-node-identity__image { width: 100%; height: 100%; object-fit: cover; }
.harvesting-node-identity__copy { min-width: 0; }
.harvesting-node-identity__copy h3,
.harvesting-node-identity__copy p { margin-top: 0; }
.harvesting-node-identity__description { margin-bottom: 0.25rem; color: var(--color-text-soft); line-height: 1.5; }
.harvesting-node-identity__meta { margin-bottom: 0; color: var(--color-text-soft); }

@media (max-width: 780px) {
    .harvesting-grid {
        grid-template-columns: 1fr;
    }
}


.crafting-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 0.8fr);
    gap: 1rem;
}

.crafting-card,
.crafting-recipe-card {
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 1rem;
    padding: 1.25rem;
    background: rgba(255, 255, 255, 0.04);
}

.crafting-recipe-card {
    margin-bottom: 1rem;
}

.crafting-recipe-identity {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.7rem;
    align-items: start;
}

.crafting-recipe-identity__portrait {
    display: grid;
    width: 2.75rem;
    height: 2.75rem;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(230, 190, 98, 0.28);
    border-radius: 0.65rem;
    background: rgba(230, 190, 98, 0.09);
    color: var(--color-gold-light);
    font-weight: 700;
}

.crafting-recipe-identity__image { width: 100%; height: 100%; object-fit: cover; }
.crafting-recipe-identity__copy { min-width: 0; }
.crafting-recipe-identity__copy h3,
.crafting-recipe-identity__copy p { margin-top: 0; }
.crafting-recipe-identity__description { margin-bottom: 0.25rem; color: var(--color-text-soft); line-height: 1.5; }
.crafting-recipe-items { display: grid; gap: 0.35rem; margin: 0; padding: 0; list-style: none; }
.crafting-recipe-items li,
.crafting-recipe-output { display: flex; align-items: center; gap: 0.45rem; flex-wrap: wrap; }
.crafting-recipe-items strong { margin-left: auto; }

@media (max-width: 780px) {
    .crafting-grid {
        grid-template-columns: 1fr;
    }
}

.stacked-form {
    display: grid;
    gap: 0.75rem;
}

.stacked-form input,
.stacked-form textarea {
    width: 100%;
}

.message-thread-card {
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 0.75rem;
    margin: 0.75rem 0;
    padding: 1rem;
}

/* Shared card and module layout refinements */
.game-frame {
    grid-template-columns: 260px minmax(0, 1fr);
}

.module-stat-bar {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    padding: 14px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.045);
}

.module-stat-item,
.module-stat-progress {
    padding: 12px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.055);
}

.module-stat-item span,
.module-stat-progress span {
    display: block;
    color: rgba(242, 242, 242, 0.66);
    font-size: 0.9rem;
}

.module-stat-item strong {
    display: block;
    margin-top: 4px;
}

.module-stat-progress progress {
    width: 100%;
    margin-top: 8px;
}

.skill-switcher {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 1rem 0;
}

.skill-switcher a {
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 999px;
    padding: 0.55rem 0.85rem;
    text-decoration: none;
    background: rgba(255, 255, 255, 0.055);
}

.skill-switcher a:hover,
.skill-switcher a:focus,
.skill-switcher a.active {
    background: rgba(255, 255, 255, 0.14);
    outline: none;
}

.item-row,
.item-card-heading {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
}

.item-card-heading h3 {
    margin: 0;
}

.item-icon {
    display: inline-grid;
    width: 2.25rem;
    height: 2.25rem;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 0.75rem;
    background: rgba(255, 255, 255, 0.08);
    font-weight: 900;
    line-height: 1;
    overflow: hidden;
}

.item-icon--large {
    width: 3.25rem;
    height: 3.25rem;
    flex-basis: 3.25rem;
    font-size: 1.3rem;
}

.item-icon__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.item-icon__glyph {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
}

.item-catalog-grid {
    display: grid;
    gap: 1rem;
}

.error-panel {
    display: grid;
    gap: 0.75rem;
}

.error-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 0.75rem;
}

@media (max-width: 780px) {
    .game-frame {
        grid-template-columns: 1fr;
    }

    .module-stat-bar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 520px) {
    .module-stat-bar {
        grid-template-columns: 1fr;
    }
}


/* Starter onboarding */
.starter-guide-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(260px, 0.75fr);
    gap: 1rem;
}

.starter-guide-card,
.quick-link-card {
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 1rem;
    padding: 1.25rem;
    background: rgba(255, 255, 255, 0.04);
}

.starter-checklist {
    display: grid;
    gap: 0.85rem;
    list-style: none;
    margin: 1rem 0 0;
    padding: 0;
}

.starter-checklist li {
    display: grid;
    grid-template-columns: 5.5rem minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
    padding: 1rem;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.045);
}

.starter-checklist p {
    margin: 0.35rem 0;
    color: rgba(242, 242, 242, 0.72);
}

.starter-step-status {
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    padding: 0.35rem 0.55rem;
    background: rgba(255, 255, 255, 0.1);
    font-size: 0.82rem;
    font-weight: 800;
    text-align: center;
}

.text-link {
    font-weight: 800;
}

.starter-quick-links {
    display: grid;
    gap: 1rem;
}

.quick-link-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1rem;
}

.quick-link-card {
    display: grid;
    gap: 0.4rem;
    text-decoration: none;
}

.quick-link-card span {
    color: rgba(242, 242, 242, 0.68);
}

.secondary-link {
    margin-left: 0.5rem;
}

@media (max-width: 780px) {
    .starter-guide-grid {
        grid-template-columns: 1fr;
    }

    .starter-checklist li {
        grid-template-columns: 1fr;
    }

    .secondary-link {
        margin-left: 0;
        margin-top: 0.5rem;
    }
}

/* Starter gameplay loop surfaces */
.starter-loop-checkpoint {
    display: grid;
    gap: 0.75rem;
}

.starter-loop-checkpoint h2 {
    margin: 0;
}

.starter-loop-checkpoint p:not(.eyebrow) {
    margin: 0;
    color: rgba(242, 242, 242, 0.76);
}

.checkpoint-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 0.35rem;
}

.secondary-action {
    background: rgba(255, 255, 255, 0.075);
}


/* Core systems overview */
.system-map-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 1rem;
}

.system-map-card {
    display: grid;
    gap: 0.65rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 1rem;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.04);
}

.system-map-card h3 {
    margin: 0;
}

.system-map-card p {
    margin: 0;
    color: rgba(242, 242, 242, 0.74);
}

.system-map-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

.system-status-pill,
.system-phase-pill {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 0.25rem 0.6rem;
    font-size: 0.78rem;
    font-weight: 800;
    background: rgba(255, 255, 255, 0.1);
}

.system-status-pill {
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.system-next {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 0.65rem;
}

.system-legend-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.75rem;
    margin: 1rem 0 0;
}

.system-legend-list div {
    border-radius: 0.85rem;
    padding: 0.85rem;
    background: rgba(255, 255, 255, 0.045);
}

.system-legend-list dt {
    font-weight: 900;
    text-transform: capitalize;
}

.system-legend-list dd {
    margin: 0.35rem 0 0;
    color: rgba(242, 242, 242, 0.72);
}

/* Combat */
.combat-loop-checkpoint,
.training-checkpoint {
    border-color: rgba(255, 255, 255, 0.18);
}

.combat-timer-card {
    margin: 1rem 0;
}

.training-target-list {
    display: grid;
    gap: 1rem;
}

.training-target-card {
    display: grid;
    gap: 0.75rem;
}

.training-target-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.training-target-header h3 {
    margin: 0;
}

.training-target-header span {
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    padding: 0.25rem 0.65rem;
    background: rgba(255, 255, 255, 0.06);
    color: rgba(242, 242, 242, 0.78);
    white-space: nowrap;
}

.reward-summary-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 0.75rem;
    margin: 0;
}

.reward-summary-list div {
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 0.85rem;
    padding: 0.75rem;
    background: rgba(255, 255, 255, 0.045);
}

.reward-summary-list dt,
.reward-summary-list dd {
    margin: 0;
}

.reward-summary-list dd {
    margin-top: 0.25rem;
    font-weight: 700;
}

/* Inventory and equipment */
.equipment-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1rem;
}

.equipment-card {
    display: grid;
    gap: 1rem;
}

.equipment-slot-grid,
.equippable-item-list {
    display: grid;
    gap: 0.85rem;
}

.equipment-slot-card,
.equippable-item-card {
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 0.9rem;
    padding: 0.9rem;
    background: rgba(255, 255, 255, 0.045);
}

.equipment-slot-card p,
.equippable-item-card p {
    margin-bottom: 0.65rem;
}

.equipment-slot-card .item-row,
.equippable-item-card .item-row {
    margin-bottom: 0.5rem;
}

.inline-action-form button:disabled {
    cursor: not-allowed;
    opacity: 0.55;
}

.crafting-loop-checkpoint {
    margin-top: 1rem;
}

.crafting-timer-card {
    margin-top: 1rem;
}

.crafting-recipe-list {
    display: grid;
    gap: 1rem;
}

.crafting-recipe-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.crafting-recipe-header span {
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 999px;
    padding: 0.25rem 0.65rem;
    color: rgba(242, 242, 242, 0.78);
    font-size: 0.85rem;
    white-space: nowrap;
}

.crafting-recipe-flow {
    margin: 1rem 0;
}

.crafting-material-list {
    display: grid;
    gap: 0.35rem;
    padding-left: 1.25rem;
}

.crafting-recipe-ready {
    border-color: rgba(255, 255, 255, 0.24);
}

.crafting-recipe-missing {
    opacity: 0.84;
}

/* Shops and economy */
.shop-loop-checkpoint {
    margin-top: 1rem;
}

.compact-checklist {
    display: grid;
    gap: 0.45rem;
    padding-left: 1.25rem;
}

.economy-owned-list {
    display: grid;
    gap: 0.45rem;
    padding-left: 0;
    list-style: none;
}

.economy-owned-list li,
.economy-price-grid div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 0.75rem;
    padding: 0.6rem 0.75rem;
    background: rgba(255, 255, 255, 0.04);
}

.shop-stock-list {
    display: grid;
    gap: 1rem;
    margin-top: 1rem;
}

.shop-stock-card {
    display: grid;
    gap: 0.85rem;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 1rem;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.045);
}

.shop-stock-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.shop-stock-header h3,
.shop-stock-header p {
    margin: 0;
}

.shop-stock-header p {
    margin-top: 0.35rem;
}

.shop-stock-header span {
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 999px;
    padding: 0.25rem 0.65rem;
    color: rgba(242, 242, 242, 0.78);
    font-size: 0.85rem;
    white-space: nowrap;
}

.economy-price-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 0.6rem;
    margin: 0;
}

.economy-price-grid dt,
.economy-price-grid dd {
    margin: 0;
}

.economy-price-grid dd {
    font-weight: 700;
}

.shop-action-row {
    display: grid;
    gap: 0.55rem;
}

/* Page map structure */
.page-map-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin-top: 1rem;
}

.page-map-card {
    display: grid;
    gap: 0.65rem;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 1rem;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.045);
}

.page-map-card h3,
.page-map-card p {
    margin: 0;
}

.page-map-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    align-items: center;
}

.page-map-pill {
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 999px;
    padding: 0.2rem 0.55rem;
    color: rgba(242, 242, 242, 0.78);
    font-size: 0.78rem;
    text-transform: capitalize;
}

.version-policy-note {
    border-left: 3px solid rgba(255, 255, 255, 0.22);
    padding-left: 1rem;
    color: rgba(242, 242, 242, 0.76);
}


/* Foundation theme surfaces */
.theme-foundation {
    accent-color: var(--color-text);
}

.theme-foundation .game-shell {
    width: min(1240px, calc(100% - 32px));
}

.theme-foundation .panel,
.theme-foundation .auth-card,
.theme-card {
    border-color: var(--border-soft);
    background: var(--surface-panel);
    border-radius: var(--radius-lg);
}

.theme-foundation .panel,
.theme-card {
    display: block;
}

.theme-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--space-md);
}

.theme-card {
    padding: var(--space-lg);
}

.theme-pill {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--border-soft);
    border-radius: 999px;
    padding: 0.2rem 0.6rem;
    color: var(--color-text-soft);
    font-size: 0.78rem;
    font-weight: 800;
}

.theme-foundation .button-link,
.theme-foundation .inline-action-form button,
.theme-foundation .form-stack button,
.theme-foundation .inline-form button {
    border: 1px solid var(--border-soft);
    background: var(--surface-panel-strong);
    color: inherit;
}

.theme-foundation .button-link:hover,
.theme-foundation .button-link:focus,
.theme-foundation .inline-action-form button:hover,
.theme-foundation .inline-action-form button:focus,
.theme-foundation .form-stack button:hover,
.theme-foundation .form-stack button:focus,
.theme-foundation .inline-form button:hover,
.theme-foundation .inline-form button:focus {
    background: var(--surface-panel-hover);
    outline: none;
}

.theme-foundation input,
.theme-foundation select,
.theme-foundation textarea,
.theme-foundation button {
    font: inherit;
}

.theme-foundation table {
    width: 100%;
    border-collapse: collapse;
}

.theme-foundation th,
.theme-foundation td {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    padding: 0.65rem 0.75rem;
    text-align: left;
    vertical-align: top;
}

.theme-foundation th {
    color: var(--color-text-soft);
    font-size: 0.82rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

@media (max-width: 520px) {
    .theme-foundation .game-shell {
        width: min(100% - 20px, 1240px);
        padding: 10px 0;
    }

    .theme-foundation .panel {
        padding: 18px;
    }

}

/* Global shell */
.theme-foundation {
    --shell-gap: clamp(0.85rem, 2vw, 1.35rem);
    --shell-pad: clamp(0.85rem, 2vw, 1.5rem);
    --shell-line: rgba(255, 255, 255, 0.1);
}

.theme-foundation .game-shell {
    width: min(1280px, calc(100% - 28px));
    padding-block: var(--shell-pad);
}

.game-frame.game-frame {
    grid-template-columns: minmax(216px, var(--layout-sidebar-width)) minmax(0, 1fr);
    gap: var(--shell-gap);
    align-items: start;
}

.notice-stack.notice-stack {
    position: relative;
    z-index: 1;
}

@media (max-width: 960px) {
    .game-frame.game-frame {
        grid-template-columns: 1fr;
    }

}

@media (max-width: 620px) {
    .theme-foundation .game-shell {
        width: min(100% - 18px, 1280px);
    }

}

/* Start Here, account, and profile */
.account-page-hero.account-page-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-lg);
    align-items: end;
    overflow: hidden;
}

.account-hero-copy.account-hero-copy {
    display: grid;
    gap: var(--space-sm);
    min-width: 0;
}

.account-hero-copy.account-hero-copy h1,
.account-hero-copy.account-hero-copy p {
    margin: 0;
}

.account-hero-copy.account-hero-copy p:not(.eyebrow) {
    max-width: 68ch;
    color: var(--color-text-soft);
    line-height: 1.6;
}

.account-hero-actions.account-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
    justify-content: flex-end;
}

.account-section.account-section,
.profile-card.profile-card,
.profile-card.profile-card,
.quick-link-card.quick-link-card {
    min-width: 0;
}

.account-section-header.account-section-header {
    display: grid;
    gap: 0.35rem;
    margin-bottom: var(--space-md);
}

.account-section-header.account-section-header h2,
.account-section-header.account-section-header p {
    margin: 0;
}

.profile-page-grid.profile-page-grid,
.home-path-panel .home-path-grid {
    align-items: stretch;
}

.profile-card.profile-card,
.home-environment-card.home-environment-card {
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, 0.045);
    box-shadow: var(--shadow-soft);
}

.profile-summary-strip.profile-summary-strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
    gap: var(--space-sm);
    padding: var(--space-sm);
}

.profile-summary-strip.profile-summary-strip > div,
.home-environment-card.home-environment-card > div,
.profile-definition-grid.profile-definition-grid > div {
    display: grid;
    gap: 0.25rem;
    min-width: 0;
    padding: var(--space-sm);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.04);
}

.profile-summary-strip.profile-summary-strip strong,
.profile-definition-grid.profile-definition-grid dd {
    overflow-wrap: anywhere;
}

.home-path-panel .path-list {
    display: grid;
    gap: 0.65rem;
    margin: 0;
    padding-left: 1.2rem;
    color: var(--color-text-soft);
}

.home-path-panel .home-path-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(14rem, 0.45fr);
    gap: var(--space-md);
}

.home-environment-card.home-environment-card {
    margin: 0;
    padding: var(--space-sm);
}

.profile-definition-grid.profile-definition-grid {
    display: grid;
    gap: var(--space-sm);
    margin: 0;
}

.compact-definition-grid.compact-definition-grid {
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
}

.profile-definition-grid.profile-definition-grid dt,
.home-environment-card.home-environment-card dt {
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.profile-definition-grid.profile-definition-grid dd,
.home-environment-card.home-environment-card dd {
    margin: 0;
    color: var(--color-text);
    font-weight: 750;
}

.quick-link-card.quick-link-card:hover,
.quick-link-card.quick-link-card:focus {
    transform: translateY(-1px);
    border-color: var(--border-strong);
}

@media (max-width: 780px) {
    .account-page-hero.account-page-hero,
    .home-path-panel .home-path-grid {
        grid-template-columns: 1fr;
    }

    .account-hero-actions.account-hero-actions {
        justify-content: flex-start;
    }
}

/* World, travel, and activity */
.theme-foundation {
    --surface-stone: rgba(13, 12, 10, 0.78);
    --surface-parchment: rgba(201, 174, 124, 0.12);
    --surface-parchment-strong: rgba(201, 174, 124, 0.18);
    --accent-gold: rgba(230, 190, 98, 0.82);
    --accent-gold-soft: rgba(230, 190, 98, 0.18);
}

.theme-foundation .panel {
    border-color: rgba(230, 190, 98, 0.16);
    box-shadow: var(--shadow-soft);
}

.exploration-page-hero.exploration-page-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-lg);
    align-items: end;
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(201, 174, 124, 0.16), rgba(255, 255, 255, 0.035)),
        var(--surface-stone);
}

.exploration-hero-copy.exploration-hero-copy,
.exploration-section-header.exploration-section-header {
    display: grid;
    gap: 0.45rem;
    min-width: 0;
}

.exploration-hero-copy.exploration-hero-copy h1,
.exploration-hero-copy.exploration-hero-copy p,
.exploration-section-header.exploration-section-header h2,
.exploration-section-header.exploration-section-header p {
    margin: 0;
}

.exploration-hero-copy.exploration-hero-copy p:not(.eyebrow),
.exploration-section-header.exploration-section-header p {
    max-width: 70ch;
    color: var(--color-text-soft);
    line-height: 1.6;
}

.exploration-hero-actions.exploration-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
    justify-content: flex-end;
}

.theme-foundation .eyebrow {
    color: var(--accent-gold);
    opacity: 0.95;
}

.exploration-ledger-panel.exploration-ledger-panel {
    background: linear-gradient(135deg, rgba(230, 190, 98, 0.09), rgba(255, 255, 255, 0.035));
}

.exploration-status-strip.exploration-status-strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
    gap: var(--space-sm);
    padding: var(--space-sm);
    background: rgba(13, 12, 10, 0.58);
}

.exploration-status-strip.exploration-status-strip > div,
.exploration-definition-grid.exploration-definition-grid > div,
.travel-timer-card.travel-timer-card {
    display: grid;
    gap: 0.25rem;
    min-width: 0;
    padding: var(--space-sm);
    border: 1px solid rgba(230, 190, 98, 0.12);
    border-radius: var(--radius-md);
    background: var(--surface-parchment);
}

.exploration-status-strip.exploration-status-strip span,
.exploration-definition-grid.exploration-definition-grid dt,
.travel-timer-card.travel-timer-card span,
.travel-timer-card.travel-timer-card small {
    color: var(--text-ink-muted);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.exploration-status-strip.exploration-status-strip strong,
.exploration-definition-grid.exploration-definition-grid dd,
.travel-timer-card.travel-timer-card strong {
    margin: 0;
    color: var(--color-text);
    font-weight: 800;
    overflow-wrap: anywhere;
}

.exploration-board-grid.exploration-board-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(20rem, 1.1fr);
    gap: var(--space-md);
    align-items: start;
}

.world-map-card.world-map-card,
.travel-route-card.travel-route-card,
.activity-timer-board.activity-timer-board,
.exploration-action-card.exploration-action-card,
.world-location-card.world-location-card,
.travel-destination-card.travel-destination-card {
    min-width: 0;
    border-color: rgba(230, 190, 98, 0.14);
    background: linear-gradient(180deg, var(--surface-parchment), rgba(255, 255, 255, 0.035));
}

.world-map-card.world-map-card h2,
.travel-route-card.travel-route-card h2,
.activity-timer-board.activity-timer-board h2,
.exploration-action-card.exploration-action-card h2,
.world-location-card.world-location-card h3,
.travel-destination-card.travel-destination-card h3 {
    margin-top: 0;
}

.exploration-definition-grid.exploration-definition-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
    gap: var(--space-sm);
    margin: var(--space-md) 0 0;
}

.exploration-card-grid.exploration-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: var(--space-md);
}

.world-location-card.world-location-card,
.travel-destination-card.travel-destination-card {
    display: grid;
    gap: 0.65rem;
    padding: var(--space-md);
}

.location-identity.location-identity {
    display: grid;
    gap: 0.65rem;
}

.location-identity__media {
    min-height: 8rem;
    overflow: hidden;
    border: 1px solid rgba(230, 190, 98, 0.14);
    border-radius: var(--radius-sm);
    background: var(--surface-stone);
}

.location-identity__image {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 8rem;
    object-fit: cover;
    object-position: var(--location-card-image-focal-x, 50%) var(--location-card-image-focal-y, 50%);
}

.location-identity__copy {
    min-width: 0;
}

.location-identity__copy h2,
.location-identity__copy h3,
.location-identity__description {
    margin-top: 0;
}

.location-identity__description {
    margin-bottom: 0;
    color: var(--color-text-soft);
    line-height: 1.5;
}

.npc-identity {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.7rem;
    align-items: start;
}

.npc-identity__portrait {
    display: grid;
    width: 2.75rem;
    height: 2.75rem;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(230, 190, 98, 0.24);
    border-radius: 50%;
    background: var(--surface-stone);
    color: var(--color-gold);
    font-weight: 700;
}

.npc-identity__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.npc-identity__copy { min-width: 0; }
.npc-identity__copy h2,
.npc-identity__copy h3,
.npc-identity__copy p { margin-top: 0; }
.npc-identity__title { margin-bottom: 0.25rem; font-weight: 700; }
.npc-identity__description { color: var(--color-text-soft); line-height: 1.5; }
.npc-identity__description { margin-bottom: 0; }

.shop-identity {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.7rem;
    align-items: start;
    margin-bottom: 1rem;
}

.shop-identity__portrait {
    display: grid;
    width: 2.75rem;
    height: 2.75rem;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(230, 190, 98, 0.28);
    border-radius: 0.65rem;
    background: rgba(230, 190, 98, 0.09);
    color: var(--color-gold-light);
    font-weight: 700;
}

.shop-identity__image { width: 100%; height: 100%; object-fit: cover; }
.shop-identity__copy { min-width: 0; }
.shop-identity__copy h2,
.shop-identity__copy h3,
.shop-identity__copy p { margin-top: 0; }
.shop-identity__description { margin-bottom: 0.25rem; color: var(--color-text-soft); line-height: 1.5; }
.shop-identity__location { margin-bottom: 0; color: var(--color-text-soft); }

.world-location-card.world-location-card p,
.travel-destination-card.travel-destination-card p {
    margin: 0;
    color: var(--color-text-soft);
    line-height: 1.5;
}

.travel-destination-card.travel-destination-card {
    margin-bottom: 0;
}

.exploration-section.exploration-section {
    display: grid;
    gap: var(--space-md);
}

.exploration-page-hero .button-link,
.exploration-ledger-panel .button-link,
.exploration-action-card .button-link,
.exploration-action-card .inline-action-form button,
.activity-timer-board .inline-action-form button,
.travel-destination-card .inline-action-form button {
    border: 1px solid rgba(230, 190, 98, 0.2);
}

.exploration-action-card .inline-action-form button:disabled,
.travel-destination-card .inline-action-form button:disabled,
.travel-timer-card button[disabled] {
    cursor: not-allowed;
    opacity: 0.58;
}

@media (max-width: 900px) {
    .exploration-page-hero.exploration-page-hero,
    .exploration-board-grid.exploration-board-grid {
        grid-template-columns: 1fr;
    }

    .exploration-hero-actions.exploration-hero-actions {
        justify-content: flex-start;
    }
}

/* Root-safe links, inventory, skills, and harvesting */
.progression-page-hero.progression-page-hero {
    display: grid;
    gap: var(--space-sm);
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(230, 190, 98, 0.14), rgba(255, 255, 255, 0.035)),
        rgba(13, 12, 10, 0.78);
}

.progression-page-hero.progression-page-hero h1,
.progression-page-hero.progression-page-hero p {
    margin: 0;
}

.progression-page-hero.progression-page-hero p:not(.eyebrow) {
    max-width: 72ch;
    color: var(--color-text-soft);
    line-height: 1.6;
}

.progression-status-strip.progression-status-strip {
    grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
    border-color: rgba(230, 190, 98, 0.16);
    background: rgba(13, 12, 10, 0.58);
}

.progression-status-strip.progression-status-strip .module-stat-item,
.progression-status-strip.progression-status-strip .module-stat-progress {
    border: 1px solid rgba(230, 190, 98, 0.12);
    background: rgba(201, 174, 124, 0.11);
}

.progression-board-grid.progression-board-grid,
.inventory-card-grid.inventory-card-grid {
    gap: var(--space-md);
    align-items: start;
}

.progression-board-grid.progression-board-grid {
    grid-template-columns: minmax(0, 0.95fr) minmax(20rem, 1.05fr);
}

.progression-ledger-card.progression-ledger-card,
.progression-action-card.progression-action-card,
.progression-definition-card.progression-definition-card,
.equipment-slot-card.equipment-slot-card {
    min-width: 0;
    border-color: rgba(230, 190, 98, 0.14);
    background: linear-gradient(180deg, rgba(201, 174, 124, 0.12), rgba(255, 255, 255, 0.035));
}

.progression-ledger-card.progression-ledger-card h2,
.progression-action-card.progression-action-card h3,
.progression-definition-card.progression-definition-card h3 {
    margin-top: 0;
}

.equipment-slot-grid.equipment-slot-grid,
.equippable-item-list.equippable-item-list,
.item-catalog-grid.item-catalog-grid {
    display: grid;
    gap: var(--space-sm);
}

.equipment-slot-grid.equipment-slot-grid {
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
}

.progression-action-card.progression-action-card,
.progression-definition-card.progression-definition-card,
.equipment-slot-card.equipment-slot-card {
    display: grid;
    gap: 0.65rem;
    padding: var(--space-md);
}

.progression-data-table.progression-data-table {
    overflow-wrap: anywhere;
}

.progression-data-table.progression-data-table th {
    color: var(--accent-gold);
    font-size: 0.74rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.progression-data-table.progression-data-table tbody tr:hover {
    background: rgba(230, 190, 98, 0.06);
}

.harvesting-skill-switcher.harvesting-skill-switcher a {
    border-color: rgba(230, 190, 98, 0.18);
    background: rgba(201, 174, 124, 0.1);
}

.harvesting-skill-switcher.harvesting-skill-switcher a:hover,
.harvesting-skill-switcher.harvesting-skill-switcher a:focus,
.harvesting-skill-switcher.harvesting-skill-switcher a.active {
    border-color: rgba(230, 190, 98, 0.38);
    background: rgba(230, 190, 98, 0.14);
}

/* Shared production-board pattern for harvesting now and crafting later. */
.production-active-panel,
.production-resource-row,
.production-recent-harvests,
.production-empty-state {
    min-width: 0;
    border-color: rgba(230, 190, 98, 0.16);
    background: linear-gradient(180deg, rgba(201, 174, 124, 0.11), rgba(255, 255, 255, 0.035));
}

.production-active-panel p,
.production-resource-row p,
.production-recent-harvests p {
    margin: 0;
}

.production-metadata-grid dt,
.production-progress span {
    color: var(--color-text-soft);
    font-size: 0.82rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.production-category-section,
.production-selected-resources,
.production-resource-list {
    display: grid;
    gap: 0.75rem;
}

.harvesting-interaction-region { display: grid; gap: 0.75rem; }
.gathering-workspace-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem 1rem; }
.gathering-stamina-compact { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: flex-end; gap: 0.25rem 0.75rem; margin: 0; }
.gathering-stamina-compact small { color: var(--text-muted); }

.production-section-heading h2,
.production-active-panel h2 {
    margin: 0;
}

.production-section-heading .eyebrow,
.production-active-panel .eyebrow {
    margin-bottom: 0.2rem;
}

.production-category-selector {
    display: flex;
    gap: 0.5rem;
    overflow-x: auto;
    padding: 0.1rem 0 0.3rem;
    scrollbar-color: var(--color-accent-bronze) transparent;
}

.production-category-selector__item {
    display: grid;
    flex: 0 0 auto;
    gap: 0.16rem;
    min-width: 8.75rem;
    padding: 0.58rem 0.72rem;
    border: 1px solid var(--border-soft);
    border-radius: 0.55rem;
    color: var(--text-ink);
    text-decoration: none;
    background: color-mix(in srgb, var(--surface-parchment-raised) 88%, white);
    box-shadow: 0 2px 5px rgba(79, 48, 21, 0.06);
}

.production-category-selector__item small {
    color: color-mix(in srgb, var(--text-ink) 64%, var(--text-ink-muted));
}

.production-category-selector__item:hover,
.production-category-selector__item:focus-visible {
    border-color: var(--color-accent-bronze-dark);
    background: color-mix(in srgb, var(--surface-parchment-raised) 76%, white);
    outline: 2px solid transparent;
}

.production-category-selector__item.is-selected {
    border-color: color-mix(in srgb, var(--color-accent-bronze-dark) 68%, var(--border-soft));
    background: color-mix(in srgb, var(--surface-parchment-raised) 82%, var(--color-accent-gold));
    box-shadow: inset 0 0 0 2px rgba(77, 104, 70, 0.28), 0 3px 7px rgba(79, 48, 21, 0.1);
}

.production-category-selector__item.is-unavailable {
    border-style: dashed;
    color: color-mix(in srgb, var(--text-ink) 80%, var(--text-ink-muted));
    background: color-mix(in srgb, var(--surface-parchment-muted) 70%, white);
}

.production-category-selector__item.is-unavailable small {
    color: color-mix(in srgb, var(--text-ink) 72%, var(--text-ink-muted));
    font-weight: 700;
}

.production-category-selector__item:focus-visible,
.production-resource-row button:focus-visible {
    outline-color: var(--accent-gold);
    outline-offset: 3px;
}

.production-active-panel,
.production-recent-harvests {
    display: grid;
    gap: var(--space-md);
}

.production-resource-table {
    display: grid;
    gap: 0.35rem;
}

.crafting-resource-table {
    --crafting-recipe-table-columns: minmax(15rem, 1.65fr) minmax(5.5rem, 0.55fr) minmax(6.5rem, 0.7fr) minmax(9rem, 0.9fr) minmax(4.5rem, 0.45fr) minmax(15rem, auto);
}

.crafting-resource-table .production-resource-table__header,
.crafting-resource-table .crafting-resource-row {
    grid-template-columns: var(--crafting-recipe-table-columns);
}

.crafting-resource-table .production-resource-table__header {
    box-sizing: border-box;
    border: 1px solid transparent;
}

.crafting-resource-table .crafting-resource-row > * {
    min-width: 0;
}

.production-resource-table__header,
.production-resource-row.production-resource-row {
    display: grid;
    grid-template-columns: minmax(15rem, 1.65fr) minmax(5.5rem, 0.55fr) minmax(6.5rem, 0.7fr) minmax(9rem, 0.9fr) minmax(4.5rem, 0.45fr) minmax(15rem, auto);
    gap: 0.65rem;
    align-items: center;
}

.production-resource-table__header {
    padding: 0 0.75rem 0.25rem;
    color: var(--text-ink-muted);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.production-resource-row.production-resource-row {
    padding: 0.55rem 0.75rem;
}

.production-resource-row__resource {
    min-width: 0;
}

.production-resource-row__resource [data-quest-indicator="gathering"] {
    margin-top: 0.25rem;
}

.production-resource-row__value {
    min-width: 0;
    color: var(--text-ink);
    font-size: 0.88rem;
    overflow-wrap: anywhere;
}

.production-resource-row__action {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    align-items: center;
    justify-self: end;
}

.crafting-resource-table .production-resource-row__action {
    justify-self: stretch;
    justify-content: center;
    text-align: center;
}

.crafting-resource-table .production-resource-row__action .inline-action-form {
    display: grid;
    justify-content: center;
}

.production-resource-row__action .inline-action-form {
    display: grid;
    gap: 0.55rem;
    width: 100%;
}

.production-batch-field {
    display: grid;
    gap: 0.3rem;
    width: 100%;
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--color-text-soft);
}

.production-batch-field select {
    width: 100%;
    min-width: 0;
}

.production-batch-help {
    display: block;
    line-height: 1.35;
    color: var(--color-text-soft);
}

.crafting-resource-table .crafting-resource-row__state {
    display: grid;
    gap: 0.1rem;
}

.crafting-resource-table .crafting-resource-row__state small {
    font-size: 0.82em;
}

@media (min-width: 981px) {
    .crafting-resource-table .crafting-resource-row__action {
        inline-size: 15rem;
        max-inline-size: 100%;
    }

    .crafting-resource-table .crafting-resource-row__state {
        overflow-wrap: anywhere;
    }
}

.production-resource-row .harvesting-node-identity__description {
    color: color-mix(in srgb, var(--text-ink) 72%, var(--text-ink-muted));
    font-size: 0.92rem;
    line-height: 1.4;
}

.production-resource-row .harvesting-node-identity__portrait {
    width: 2.5rem;
    height: 2.5rem;
}

.production-resource-row .harvesting-node-identity__glyph {
    color: var(--color-accent-bronze-dark);
    font-size: 1.25rem;
}

.production-resource-row .crafting-recipe-identity__description,
.crafting-recipe-materials {
    color: color-mix(in srgb, var(--text-ink) 72%, var(--text-ink-muted));
    font-size: 0.88rem;
    line-height: 1.4;
}

.crafting-recipe-materials {
    margin-top: 0.3rem !important;
}

.production-resource-row .crafting-recipe-identity__portrait {
    width: 2.5rem;
    height: 2.5rem;
}

.production-metadata-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
    gap: 0.65rem;
    margin: 0;
}

.production-metadata-grid div {
    min-width: 0;
    padding: 0.4rem 0.5rem;
    border: 1px solid rgba(230, 190, 98, 0.12);
    border-radius: 0.65rem;
    background: rgba(13, 12, 10, 0.36);
}

.production-metadata-grid dd {
    margin: 0.25rem 0 0;
    overflow-wrap: anywhere;
}

.production-progress {
    display: grid;
    gap: 0.4rem;
}

.production-progress div {
    display: flex;
    justify-content: space-between;
    gap: var(--space-sm);
}

.production-progress progress {
    width: 100%;
}

.production-resource-row__action .inline-action-form {
    margin: 0;
}

.theme-foundation .production-resource-row__action .harvesting-primary-action,
.theme-foundation .production-resource-row__action .crafting-primary-action {
    min-height: 2.45rem;
    border: 1px solid color-mix(in srgb, var(--state-success-border) 72%, var(--color-accent-bronze-dark));
    border-radius: 0.6rem;
    background: linear-gradient(180deg, var(--foundation-button-resource-top), var(--foundation-button-resource-bottom));
    color: var(--state-success-text);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 3px 7px rgba(48, 73, 22, 0.22);
}

.theme-foundation .production-resource-row__action .harvesting-primary-action:hover,
.theme-foundation .production-resource-row__action .harvesting-primary-action:focus-visible,
.theme-foundation .production-resource-row__action .crafting-primary-action:hover,
.theme-foundation .production-resource-row__action .crafting-primary-action:focus-visible {
    background: linear-gradient(180deg, #688a3a, #38551a);
    outline: 2px solid var(--state-success-border);
    outline-offset: 2px;
}

.production-recent-harvests__list {
    display: grid;
    gap: 0.65rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.production-recent-harvests__list li {
    display: flex;
    justify-content: space-between;
    gap: var(--space-md);
    padding-top: 0.65rem;
    border-top: 1px solid rgba(230, 190, 98, 0.12);
}

.production-recent-harvests__list time {
    flex: 0 0 auto;
    color: var(--color-text-soft);
    font-size: 0.88rem;
}

.production-recent-harvests__list strong {
    color: var(--text-ink);
    font-weight: 700;
}

@media (max-width: 980px) {
    .production-resource-table__header {
        display: none;
    }

    .crafting-resource-table .crafting-resource-row {
        grid-template-columns: 1fr;
    }

    .production-resource-row.production-resource-row {
        grid-template-columns: 1fr;
        gap: 0.45rem;
        padding: 0.7rem;
    }

    .production-resource-row__value,
    .production-resource-row__action {
        display: grid;
        grid-template-columns: minmax(8rem, 0.75fr) minmax(0, 1fr);
        gap: 0.5rem;
        align-items: center;
        justify-self: stretch;
    }

    .production-resource-row__value::before,
    .production-resource-row__action::before {
        color: var(--text-ink-muted);
        font-size: 0.76rem;
        font-weight: 800;
        letter-spacing: 0.04em;
        text-transform: uppercase;
        content: attr(data-label);
    }
}

.item-icon.item-icon {
    border-color: rgba(230, 190, 98, 0.18);
    background: rgba(201, 174, 124, 0.14);
    color: var(--accent-gold);
}

.progression-board-grid .inline-action-form button,
.inventory-card-grid .inline-action-form button,
.progression-page-hero .button-link,
.progression-board-grid .button-link,
.inventory-card-grid .button-link {
    border-color: rgba(230, 190, 98, 0.22);
}

@media (max-width: 900px) {
    .progression-board-grid.progression-board-grid,
    .inventory-card-grid.inventory-card-grid,
    .inventory-grid.inventory-grid,
    .skills-grid.skills-grid,
    .harvesting-grid.harvesting-grid {
        grid-template-columns: 1fr;
    }
}

/* Combat and shops */
.combat-page-hero.combat-page-hero {
    display: grid;
    gap: var(--space-sm);
    overflow: hidden;
    border-color: rgba(230, 190, 98, 0.18);
    background:
        linear-gradient(135deg, rgba(230, 190, 98, 0.16), rgba(88, 125, 101, 0.08)),
        rgba(13, 12, 10, 0.78);
}

.combat-page-hero.combat-page-hero h1,
.combat-page-hero.combat-page-hero p {
    margin: 0;
}

.combat-page-hero.combat-page-hero p:not(.eyebrow) {
    max-width: 74ch;
    color: var(--color-text-soft);
    line-height: 1.6;
}

.combat-status-strip.combat-status-strip {
    grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
    border-color: rgba(230, 190, 98, 0.16);
    background: rgba(13, 12, 10, 0.58);
}

.combat-status-strip.combat-status-strip .module-stat-item,
.combat-status-strip.combat-status-strip .module-stat-progress,
.combat-timer-card.combat-timer-card,
.combat-definition-grid.combat-definition-grid > div {
    border: 1px solid rgba(230, 190, 98, 0.12);
    border-radius: var(--radius-md);
    background: rgba(201, 174, 124, 0.11);
}

.combat-board-grid.combat-board-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(20rem, 1.05fr);
    gap: var(--space-md);
    align-items: start;
}

.combat-card-grid.combat-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: var(--space-md);
}

.combat-ledger-card.combat-ledger-card,
.adventurer-action-card.adventurer-action-card {
    min-width: 0;
    border-color: rgba(230, 190, 98, 0.14);
    background: linear-gradient(180deg, rgba(201, 174, 124, 0.12), rgba(255, 255, 255, 0.035));
}

.combat-ledger-card.combat-ledger-card h2,
.adventurer-action-card.adventurer-action-card h3 {
    margin-top: 0;
}

.adventurer-action-card.adventurer-action-card {
    display: grid;
    gap: 0.65rem;
    padding: var(--space-md);
}

.combat-definition-grid.combat-definition-grid,
.adventurer-reward-grid.adventurer-reward-grid {
    display: grid;
    gap: var(--space-sm);
}

.combat-definition-grid.combat-definition-grid {
    grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
}

.adventurer-reward-grid.adventurer-reward-grid {
    grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
}

.combat-definition-grid.combat-definition-grid > div,
.adventurer-reward-grid.adventurer-reward-grid > div {
    display: grid;
    gap: 0.25rem;
    padding: var(--space-sm);
}

.combat-definition-grid.combat-definition-grid dt,
.adventurer-reward-grid.adventurer-reward-grid dt {
    color: var(--color-text-muted);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.combat-definition-grid.combat-definition-grid dd,
.adventurer-reward-grid.adventurer-reward-grid dd {
    margin: 0;
    color: var(--color-text);
    font-weight: 800;
    overflow-wrap: anywhere;
}

.training-target-header.training-target-header,
.shop-stock-header.shop-stock-header,
.shop-action-row.shop-action-row {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
    align-items: center;
    justify-content: space-between;
}

.training-target-header.training-target-header span,
.shop-stock-header.shop-stock-header span {
    border: 1px solid rgba(230, 190, 98, 0.16);
    border-radius: 999px;
    padding: 0.2rem 0.55rem;
    color: var(--accent-gold);
    background: rgba(230, 190, 98, 0.08);
    font-size: 0.78rem;
    font-weight: 800;
}

.economy-owned-list.economy-owned-list {
    display: grid;
    gap: var(--space-sm);
    padding: 0;
    list-style: none;
}

.economy-owned-list.economy-owned-list li {
    display: flex;
    justify-content: space-between;
    gap: var(--space-sm);
    padding: var(--space-sm);
    border: 1px solid rgba(230, 190, 98, 0.12);
    border-radius: var(--radius-md);
    background: rgba(201, 174, 124, 0.1);
}

.combat-board-grid .inline-action-form button,
.combat-card-grid .inline-action-form button,
.combat-page-hero .button-link,
.combat-board-grid .button-link,
.combat-card-grid .button-link {
    border-color: rgba(230, 190, 98, 0.22);
}

@media (max-width: 900px) {
    .combat-board-grid.combat-board-grid,
    .combat-card-grid.combat-card-grid,
    .combat-grid.combat-grid,
    .shop-grid.shop-grid {
        grid-template-columns: 1fr;
    }
}

/* Combat Focus Mode: server-rendered battlefield hooks; artwork is supplied in a later batch.
 * Production artwork contract: background 2432 x 912px (no combatants or UI); transparent
 * combatants about 900 x 1200px (no scenery or baked ground shadows). */
.combat-focus-mode .game-frame--combat-focus { display: block; }
.combat-focus-mode .content-shell--combat-focus { max-width: none; }
.combat-focus-mode .content-shell--combat-focus .content-body { width: 100%; max-width: 76rem; margin: 0 auto; justify-self: stretch; box-sizing: border-box; }
.combat-focus-mode .header-actions--combat-inert { pointer-events: none; }
.combat-focus-mode .footer-item--unavailable { cursor: default; }
.combat-encounter { display: grid; gap: 1rem; }
.combat-battlefield {
    /* Artwork geometry contract: all stage values are percentages of the 8:3 battlefield. */
    --battlefield-aspect-ratio: 8 / 3;
    --battlefield-ground-line: 88%;
    --battlefield-player-area-start: 5%;
    --battlefield-player-area-end: 38%;
    --battlefield-opponent-area-start: 62%;
    --battlefield-opponent-area-end: 95%;
    --battlefield-overlay-safe-zone: 36%;
    --battlefield-figure-top: 31%;
    position: relative;
    isolation: isolate;
    width: 100%;
    max-width: 76rem;
    aspect-ratio: var(--battlefield-aspect-ratio);
    margin-inline: auto;
    overflow: hidden;
    border: 2px solid var(--color-border-strong, #8c6a3b);
    border-radius: .6rem;
    background: #1a2630;
}
.battlefield-background-layer, .battlefield-combatant-art { position: absolute; inset: 0; pointer-events: none; }
.battlefield-background-layer { z-index: -1; background-color: #1e2931; background-image: url("../images/combat/battlefields/woodland-clearing.png"); background-position: center; background-repeat: no-repeat; background-size: cover; }
.combat-battlefield--pvp .battlefield-background-layer { background-color: #252839; }
.battlefield-combatant-art { z-index: 0; inset: auto; top: var(--battlefield-figure-top); bottom: calc(100% - var(--battlefield-ground-line)); opacity: 1; background-repeat: no-repeat; background-position: center bottom; background-size: contain; }
.battlefield-combatant-art--player { left: var(--battlefield-player-area-start); width: calc(var(--battlefield-player-area-end) - var(--battlefield-player-area-start)); background-image: url("../images/combat/combatants/default-player-right.png"); }
.battlefield-combatant-art--opponent { left: var(--battlefield-opponent-area-start); width: calc(var(--battlefield-opponent-area-end) - var(--battlefield-opponent-area-start)); background-image: url("../images/combat/combatants/default-pvp-opponent-left.png"); }
.combat-battlefield--npc .battlefield-combatant-art--opponent { background-image: var(--combat-opponent-image, none); transform: translate(var(--combat-opponent-offset-x, 0%), var(--combat-opponent-offset-y, 0%)) scale(var(--combat-opponent-scale, 1)); transform-origin: center bottom; }
.combatant-overlay { position: absolute; z-index: 1; top: 1rem; width: var(--battlefield-overlay-safe-zone); padding: .85rem 1rem; border: 1px solid rgba(237, 219, 173, .72); border-radius: .35rem; background: rgba(16, 20, 24, .84); color: #fff8e4; box-shadow: 0 .3rem .9rem rgba(0, 0, 0, .35); }
.combatant-overlay--player { left: var(--battlefield-player-area-start); }
.combatant-overlay--opponent { right: calc(100% - var(--battlefield-opponent-area-end)); text-align: right; }
.combatant-overlay--defeated { opacity: .66; filter: grayscale(.75); }
.combatant-role, .combatant-level, .combat-health-exact { margin: .15rem 0; }
.combatant-role { font-size: .74rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.combatant-overlay h1, .combatant-overlay h2 { margin: 0; font-size: clamp(1rem, 2.2vw, 1.35rem); color: inherit; }
.combat-health-bar { height: .65rem; margin-top: .6rem; overflow: hidden; border: 1px solid rgba(255,255,255,.5); border-radius: 99px; background: rgba(0,0,0,.55); }
.combat-health-bar-fill { display: block; height: 100%; background: linear-gradient(90deg, #b44335, #79a44c); transition: width 300ms ease; }
.combat-feedback-line { margin: 0; text-align: center; font-weight: 700; }
.combat-feedback-line[hidden] { display: none; }
.combat-latest-round { display: grid; gap: .55rem; padding: .8rem 1rem; border: 1px solid var(--border-soft); border-radius: var(--radius-panel); background: var(--surface-parchment-raised); }
.combat-latest-round[hidden] { display: none; }
.combat-latest-round h2 { margin: 0; font-size: 1rem; text-align: center; }
.combat-latest-round-sides { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.combat-latest-round-side { display: grid; gap: .3rem; min-width: 0; padding: .35rem .85rem; text-align: center; }
.combat-latest-round-side + .combat-latest-round-side { border-left: 1px solid var(--border-soft); }
.combat-latest-round-side:only-child { grid-column: 1 / -1; border-left: 0; }
.combat-latest-round-side h3 { margin: 0; font-size: .78rem; letter-spacing: .04em; text-transform: uppercase; }
.combat-latest-round-action { margin: 0; overflow-wrap: anywhere; }
.combat-damage-value { white-space: nowrap; font-weight: 800; }
.combat-damage-value--positive { color: var(--state-danger-border); }
.combat-damage-value--zero { color: var(--state-information-border); }
.combat-latest-round-terminal { margin: .4rem 0 0; font-weight: 700; text-align: center; overflow-wrap: anywhere; }
.combat-inline-error { max-width: 46rem; margin: 0 auto; padding: .55rem .8rem; border: 1px solid #9f3d31; border-radius: .3rem; background: rgba(117, 34, 27, .15); color: #721d17; text-align: center; font-weight: 700; }
.combat-inline-error[hidden] { display: none; }
.combat-action-controls { display: grid; justify-items: center; gap: 1rem; }
.combat-outcome-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; }
.combat-action-controls form, .combat-outcome-actions form { margin: 0; }
.combat-melee-style-controls { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; width: min(100%, 72rem); }
.combat-melee-style-controls form { display: grid; gap: .35rem; padding: .75rem; border: 1px solid var(--border-soft); border-radius: var(--radius-panel); background: var(--surface-parchment-raised); }
.combat-melee-style-name { margin: 0; font-weight: 700; }
.combat-melee-style-description, .combat-round-style { margin: 0; color: var(--text-ink-muted); font-size: .85rem; }
.combat-flee-control { display: flex; justify-content: center; width: 100%; margin-top: .25rem; }
.combat-melee-style-controls button, .combat-flee-control button { width: 100%; }
.combat-primary-action {
    min-height: 2.75rem;
    border: 1px solid rgba(187, 145, 67, 0.42);
    border-radius: var(--radius-control);
    background: linear-gradient(180deg, var(--foundation-button-primary-top), var(--foundation-button-primary-bottom));
    color: #f6eedf;
    cursor: pointer;
    font: inherit;
    font-weight: 800;
    padding: .75rem 1rem;
}
.combat-primary-action:hover, .combat-primary-action:focus-visible {
    background: linear-gradient(180deg, #1f4468, #0c2740);
    color: #fff5df;
    outline: 2px solid var(--color-accent-gold);
    outline-offset: 2px;
}
.combat-action-controls button:disabled { cursor: wait; opacity: .72; }
.combat-read-only-notice, .combat-result-summary { text-align: center; }
.combat-result-summary { padding: 1rem; border: 1px solid var(--color-border, #aa8c5a); border-radius: .4rem; background: rgba(247, 238, 211, .6); }
.combat-result-summary h2 { margin-top: 0; }
.combat-result-xp { margin: 1rem 0; padding-top: .75rem; border-top: 1px solid var(--border-soft); }
.combat-result-xp h3 { margin: 0 0 .4rem; font-size: 1rem; }
.combat-result-xp ul { display: grid; gap: .2rem; margin: 0; padding: 0; list-style: none; }
.combat-round-log { padding-top: .5rem; text-align: center; }
.combat-round-log h2 { margin-bottom: .75rem; text-align: center; }
.combat-round-cards, .combat-flat-log { display: grid; gap: .6rem; margin: 0; padding: 0; list-style: none; text-align: center; }
.combat-round-card { padding: .75rem 1rem; border-left: .3rem solid #9a7943; border-radius: .25rem; background: rgba(247, 238, 211, .7); text-align: center; overflow-wrap: anywhere; }
.combat-round-card p { margin: .2rem 0; }
.combat-round-number, .combat-round-terminal { font-weight: 700; }
.combat-round-health { font-size: .85rem; opacity: .8; }
.combat-log-empty { text-align: center; }
.combat-preferences { margin-top: var(--space-lg); }
.combat-preferences-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-sm); margin-bottom: var(--space-sm); }
.combat-preferences-option { display: grid; gap: .3rem; padding: var(--space-sm); border: 1px solid var(--border-soft); border-radius: var(--radius-panel); background: var(--surface-parchment-raised); cursor: pointer; }
.combat-preferences-option:has(input:checked) { border-color: var(--color-accent-gold); box-shadow: 0 0 0 1px color-mix(in srgb, var(--color-accent-gold) 44%, transparent); }
.combat-preferences-label { font-weight: 700; }
.combat-preferences-stat, .combat-preferences-description { color: var(--text-ink-muted); font-size: .9rem; }
.combat-flat-log { padding: 0; list-style: decimal inside; }

.combat-confirmation-layout { display: grid; gap: 1rem; }
.combat-confirmation-layout--npc { grid-template-columns: minmax(7rem, .48fr) minmax(0, 1fr); align-items: center; }
.combat-confirmation-art {
    position: relative;
    inset: auto;
    left: auto;
    top: auto;
    bottom: auto;
    width: calc(100% - .5rem);
    height: 12rem;
    min-height: 0;
    aspect-ratio: 1 / 1;
    margin: 0;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background-color: transparent;
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: contain;
    box-shadow: none;
}
.combat-confirmation-art.battlefield-combatant-art--opponent { background-image: var(--combat-opponent-image, none); transform: translate(var(--combat-opponent-offset-x, 0%), var(--combat-opponent-offset-y, 0%)) scale(var(--combat-opponent-scale, 1)); transform-origin: center bottom; }
.combat-confirmation-details { display: grid; gap: 1rem; min-width: 0; }
.combat-confirmation-actions { display: flex; flex-wrap: wrap; align-items: stretch; gap: .75rem; }
.combat-confirmation-actions form,
.combat-confirmation-actions .button-link { flex: 1 1 10rem; }
.combat-confirmation-actions form { display: flex; margin: 0; }
.combat-confirmation-actions .combat-primary-action,
.combat-confirmation-actions .button-link { width: 100%; min-height: 2.75rem; }
.combat-confirmation-actions .button-link { display: inline-flex; align-items: center; justify-content: center; border-color: rgba(187, 145, 67, 0.42); }
.combat-confirmation-actions .secondary-action { background: linear-gradient(180deg, color-mix(in srgb, var(--foundation-button-primary-top) 76%, var(--surface-stone-overlay)), color-mix(in srgb, var(--foundation-button-primary-bottom) 84%, var(--surface-stone-base))); }

.local-threats-history { display: grid; gap: var(--space-md); }
.local-threats-history-list { display: grid; gap: var(--space-sm); margin: 0; padding: 0; list-style: none; }
.local-threats-history-list li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: var(--space-sm); align-items: center; padding: var(--space-sm); border: 1px solid var(--border-soft); border-radius: var(--radius-control); background: var(--surface-parchment-raised); }
.local-threats-history-list strong, .local-threats-history-list time { overflow-wrap: anywhere; }
.local-threats-history-list time { color: var(--text-ink-muted); font-size: .9rem; }

@media (max-width: 900px) {
    .combat-melee-style-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
    .combat-melee-style-controls, .combat-preferences-grid { grid-template-columns: 1fr; }
    .combat-battlefield { height: clamp(18.75rem, 70vw, 21.25rem); aspect-ratio: auto; }
    .combatant-overlay { width: 44%; padding: .55rem .65rem; }
    .combatant-overlay--player { left: 3%; }
    .combatant-overlay--opponent { top: 1rem; right: 3%; bottom: auto; }
    .combatant-role, .combatant-level, .combat-health-exact { font-size: .76rem; }
    .combat-confirmation-layout--npc { grid-template-columns: 1fr; }
    .combat-confirmation-art { width: min(calc(100% - .5rem), 9rem); height: 10rem; margin-inline: auto; }
    .combat-confirmation-actions, .combat-confirmation-actions form { width: 100%; }
    .combat-confirmation-actions .combat-primary-action, .combat-confirmation-actions .button-link { width: 100%; }
    .combat-flee-control { width: 100%; }
    .combat-flee-control form, .combat-flee-control button { width: 100%; }
    .local-threats-history-list li { grid-template-columns: 1fr; gap: .3rem; }
    .combat-latest-round-sides { grid-template-columns: 1fr; }
    .combat-latest-round-side + .combat-latest-round-side { border-top: 1px solid var(--border-soft); border-left: 0; }
    .combat-damage-value { justify-self: center; }
}

@media (prefers-reduced-motion: reduce) {
    .combat-health-bar-fill { transition: none; }
}

/* Crafting and quests */
.questing-page-hero.questing-page-hero {
    display: grid;
    gap: var(--space-sm);
    overflow: hidden;
    border-color: rgba(230, 190, 98, 0.18);
    background:
        linear-gradient(135deg, rgba(230, 190, 98, 0.16), rgba(75, 92, 111, 0.09)),
        rgba(13, 12, 10, 0.78);
}

.questing-page-hero.questing-page-hero h1,
.questing-page-hero.questing-page-hero p {
    margin: 0;
}

.questing-page-hero.questing-page-hero p:not(.eyebrow) {
    max-width: 74ch;
    color: var(--color-text-soft);
    line-height: 1.6;
}

.questing-status-strip.questing-status-strip {
    grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
    border-color: rgba(230, 190, 98, 0.16);
    background: rgba(13, 12, 10, 0.58);
}

.questing-status-strip.questing-status-strip .module-stat-item,
.questing-status-strip.questing-status-strip .module-stat-progress,
.crafting-timer-card.crafting-timer-card,
.questing-definition-grid.questing-definition-grid > div {
    border: 1px solid rgba(230, 190, 98, 0.12);
    border-radius: var(--radius-md);
    background: rgba(201, 174, 124, 0.11);
}

.questing-board-grid.questing-board-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(20rem, 1.05fr);
    gap: var(--space-md);
    align-items: start;
}

.questing-card-grid.questing-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: var(--space-md);
}

.questing-ledger-card.questing-ledger-card,
.questing-action-card.questing-action-card,
.quest-handoff-card.quest-handoff-card {
    min-width: 0;
    border-color: rgba(230, 190, 98, 0.14);
    background: linear-gradient(180deg, rgba(201, 174, 124, 0.12), rgba(255, 255, 255, 0.035));
}

.questing-ledger-card.questing-ledger-card h2,
.questing-action-card.questing-action-card h2,
.questing-action-card.questing-action-card h3 {
    margin-top: 0;
}

.questing-action-card.questing-action-card,
.quest-handoff-card.quest-handoff-card {
    display: grid;
    gap: 0.65rem;
    padding: var(--space-md);
}

.questing-section-header.questing-section-header,
.crafting-card-header.crafting-card-header {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
    align-items: center;
    justify-content: space-between;
}

.questing-section-header.questing-section-header h2,
.questing-section-header.questing-section-header p,
.crafting-card-header.crafting-card-header h3 {
    margin: 0;
}

.crafting-card-header.crafting-card-header span {
    border: 1px solid rgba(230, 190, 98, 0.16);
    border-radius: 999px;
    padding: 0.2rem 0.55rem;
    color: var(--accent-gold);
    background: rgba(230, 190, 98, 0.08);
    font-size: 0.78rem;
    font-weight: 800;
}

.questing-definition-grid.questing-definition-grid,
.questing-reward-grid.questing-reward-grid {
    display: grid;
    gap: var(--space-sm);
}

.questing-definition-grid.questing-definition-grid {
    grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
}

.questing-reward-grid.questing-reward-grid {
    grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
}

.questing-definition-grid.questing-definition-grid > div,
.questing-reward-grid.questing-reward-grid > div {
    display: grid;
    gap: 0.25rem;
    padding: var(--space-sm);
}

.questing-definition-grid.questing-definition-grid dt,
.questing-reward-grid.questing-reward-grid dt {
    color: var(--color-text-muted);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.questing-definition-grid.questing-definition-grid dd,
.questing-reward-grid.questing-reward-grid dd {
    margin: 0;
    color: var(--color-text);
    font-weight: 800;
    overflow-wrap: anywhere;
}

.crafting-ledger-list.crafting-ledger-list,
.quest-path-list.quest-path-list {
    display: grid;
    gap: var(--space-sm);
}

.crafting-ledger-list.crafting-ledger-list {
    padding: 0;
    list-style: none;
}

.crafting-ledger-list.crafting-ledger-list li,
.quest-path-list.quest-path-list li {
    padding: var(--space-sm);
    border: 1px solid rgba(230, 190, 98, 0.12);
    border-radius: var(--radius-md);
    background: rgba(201, 174, 124, 0.1);
}

.crafting-ledger-list.crafting-ledger-list li {
    display: flex;
    justify-content: space-between;
    gap: var(--space-sm);
}

.quest-handoff-card.quest-handoff-card {
    text-decoration: none;
}

.quest-handoff-card.quest-handoff-card strong {
    color: var(--accent-gold);
}

.quest-handoff-card.quest-handoff-card span {
    color: var(--color-text-soft);
}

.quest-card-list.quest-card-list {
    align-items: stretch;
}

/* Quest Journal V2 workspace */
.quest-journal-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-block: var(--space-md);
}

.quest-journal-tab,
.quest-journal-index-item {
    border: 1px solid rgba(230, 190, 98, 0.16);
    border-radius: var(--radius-md);
    color: var(--text-ink);
    text-decoration: none;
}

.quest-journal-tab {
    padding: 0.55rem 0.8rem;
    font-weight: 800;
}

.quest-journal-tab.is-active,
.quest-journal-index-item.is-selected {
    border-color: rgba(230, 190, 98, 0.42);
    color: var(--text-ink);
    background: var(--surface-parchment-raised);
    box-shadow: inset 0 -3px 0 var(--color-accent-bronze-dark);
}

.quest-journal-tab:hover,
.quest-journal-tab:focus-visible,
.quest-journal-index-item:hover,
.quest-journal-index-item:focus-visible {
    color: var(--text-ink);
    border-color: var(--color-accent-bronze-dark);
    background: color-mix(in srgb, var(--surface-parchment-raised) 82%, white);
    outline: 2px solid color-mix(in srgb, var(--color-accent-bronze-dark) 55%, transparent);
    outline-offset: 2px;
}

.quest-journal-workspace { display: block; }

.quest-journal-index,
.quest-journal-detail {
    min-width: 0;
}

.quest-journal-detail { margin-top: var(--space-md); }

.quest-journal-index-section + .quest-journal-index-section {
    margin-top: var(--space-md);
    padding-top: var(--space-md);
    border-top: 1px solid rgba(230, 190, 98, 0.12);
}

.quest-journal-index-section h2,
.quest-journal-entry h1,
.quest-journal-entry-section h2,
.quest-journal-dialogue h3 {
    margin-top: 0;
}

.quest-journal-index-list {
    display: grid;
    gap: 0.45rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.quest-journal-index-item {
    display: grid;
    gap: 0.2rem;
    padding: 0.6rem 0.7rem;
}

.quest-journal-index-item small {
    color: var(--text-ink-muted);
    font-size: 0.82rem;
    line-height: 1.45;
}

.quest-journal-index,
.quest-journal-detail,
.quest-journal-entry {
    color: var(--text-ink);
}

.quest-journal-index .quiet-note,
.quest-journal-detail .quiet-note,
.quest-journal-entry .quiet-note {
    color: var(--text-ink-muted);
    line-height: 1.5;
}

.quest-journal-entry-section p:not(.quiet-note),
.quest-journal-entry-section dd {
    color: var(--text-ink);
    line-height: 1.5;
}

.quest-journal-entry-section h2,
.quest-journal-index-section h2 {
    color: var(--text-ink);
}

.quest-objective-card p strong { color: var(--text-ink); }

.quest-journal-entry-section a,
.quest-journal-index a {
    color: var(--color-accent-bronze-dark);
    text-underline-offset: 0.18em;
}

.quest-journal-entry {
    display: grid;
    gap: var(--space-sm);
}

.quest-journal-entry-section + .quest-journal-entry-section {
    padding-top: var(--space-sm);
    border-top: 1px solid rgba(230, 190, 98, 0.12);
}

.quest-journal-dialogue,
.quest-objective-card {
    margin-top: var(--space-sm);
    padding: var(--space-sm);
    border: 1px solid rgba(230, 190, 98, 0.12);
    border-radius: var(--radius-md);
    background: rgba(201, 174, 124, 0.08);
}

.quest-objective-completed { opacity: 0.76; }
.quest-objective-current { border-color: rgba(230, 190, 98, 0.38); }
.quest-objective-upcoming { color: var(--color-text-soft); }

.quest-status-strip.quest-status-strip {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.35rem 1.25rem;
    padding: 0.65rem 0.85rem;
}

.quest-status-strip.quest-status-strip .module-stat-item {
    display: inline-flex;
    align-items: baseline;
    gap: 0.4rem;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.quest-status-strip.quest-status-strip .module-stat-item + .module-stat-item {
    padding-left: 1.25rem;
    border-left: 1px solid var(--border-soft);
}

.quest-journal-metadata {
    display: grid;
    gap: 0.55rem;
    margin: var(--space-sm) 0;
}

.quest-journal-metadata > div {
    display: grid;
    gap: 0.12rem;
    padding-bottom: 0.55rem;
    border-bottom: 1px solid var(--border-soft);
}

.quest-journal-metadata dt {
    color: var(--text-ink-muted);
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.quest-journal-metadata dd { margin: 0; }

.quest-objective-group {
    display: grid;
    gap: 0.35rem;
}

.quest-objective-group + .quest-objective-group { margin-top: var(--space-sm); }

.quest-objective-group h3 { margin: 0; color: var(--text-ink); }

.quest-objective-list { display: grid; gap: 0.35rem; }

.quest-objective-card.quest-objective-card {
    margin-top: 0;
    padding: 0.55rem 0.7rem;
}

.quest-objective-card p { margin: 0.15rem 0; }

.quest-objective-label {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
}

.quest-objective-indicator {
    flex: 0 0 1.1rem;
    width: 1.1rem;
    color: var(--text-ink-muted);
    font-weight: 900;
    text-align: center;
}

.quest-objective-completed .quest-objective-indicator { color: var(--state-success-border); }
.quest-objective-current .quest-objective-indicator { color: var(--color-accent-bronze-dark); }
.quest-objective-upcoming .quest-objective-indicator { color: var(--text-ink-muted); }
.quest-objective-progress { color: var(--text-ink-muted); font-weight: 800; }
.quest-journal-workspace + .quiet-note { color: var(--text-ink-muted); }

.crafting-recipe-ready.crafting-recipe-ready {
    border-color: rgba(88, 125, 101, 0.35);
}

.crafting-recipe-missing.crafting-recipe-missing {
    border-color: rgba(230, 190, 98, 0.12);
}

.crafting-timer-card .inline-action-form button,
.questing-action-card .inline-action-form button,
.questing-page-hero .button-link,
.questing-ledger-card .button-link {
    border-color: rgba(230, 190, 98, 0.22);
}

@media (max-width: 900px) {
    .questing-board-grid.questing-board-grid,
    .questing-card-grid.questing-card-grid,
    .crafting-grid.crafting-grid,
    .quest-grid.quest-grid {
        grid-template-columns: 1fr;
    }

    .quest-journal-workspace { display: block; }

    .quest-status-strip.quest-status-strip .module-stat-item + .module-stat-item {
        padding-left: 0;
        border-left: 0;
    }
}

/* Guilds, messages, and notifications */
.social-page-hero.social-page-hero {
    display: grid;
    gap: var(--space-sm);
    overflow: hidden;
    border-color: rgba(230, 190, 98, 0.18);
    background:
        linear-gradient(135deg, rgba(230, 190, 98, 0.15), rgba(88, 125, 101, 0.1)),
        rgba(13, 12, 10, 0.78);
}

.social-page-hero.social-page-hero h1,
.social-page-hero.social-page-hero p {
    margin: 0;
}

.social-page-hero.social-page-hero p:not(.eyebrow) {
    max-width: 74ch;
    color: var(--color-text-soft);
    line-height: 1.6;
}

.social-status-strip.social-status-strip {
    grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
    border-color: rgba(230, 190, 98, 0.16);
    background: rgba(13, 12, 10, 0.58);
}

.social-status-strip.social-status-strip .module-stat-item,
.social-definition-grid.social-definition-grid > div {
    border: 1px solid rgba(230, 190, 98, 0.12);
    border-radius: var(--radius-md);
    background: rgba(201, 174, 124, 0.11);
}

.social-board-grid.social-board-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(20rem, 1.05fr);
    gap: var(--space-md);
    align-items: start;
}

.guild-card-grid.guild-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: var(--space-md);
}

.social-ledger-card.social-ledger-card,
.guild-action-card.guild-action-card,
.social-entry-card.social-entry-card {
    min-width: 0;
    border-color: rgba(230, 190, 98, 0.14);
    background: linear-gradient(180deg, rgba(201, 174, 124, 0.12), rgba(255, 255, 255, 0.035));
}

.social-ledger-card.social-ledger-card h2,
.guild-action-card.guild-action-card h2,
.guild-action-card.guild-action-card h3,
.social-entry-card.social-entry-card h3 {
    margin-top: 0;
}

.guild-action-card.guild-action-card,
.social-entry-card.social-entry-card {
    display: grid;
    gap: 0.65rem;
    padding: var(--space-md);
}

.social-section-header.social-section-header,
.social-card-header.social-card-header {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
    align-items: center;
    justify-content: space-between;
}

.social-section-header.social-section-header h2,
.social-section-header.social-section-header p,
.social-card-header.social-card-header h3 {
    margin: 0;
}

.message-subsection-header.message-subsection-header {
    margin-top: var(--space-lg);
}

.social-card-header.social-card-header span {
    border: 1px solid rgba(230, 190, 98, 0.16);
    border-radius: 999px;
    padding: 0.2rem 0.55rem;
    color: var(--accent-gold);
    background: rgba(230, 190, 98, 0.08);
    font-size: 0.78rem;
    font-weight: 800;
}

.social-definition-grid.social-definition-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
    gap: var(--space-sm);
}

.social-definition-grid.social-definition-grid > div {
    display: grid;
    gap: 0.25rem;
    padding: var(--space-sm);
}

.social-definition-grid.social-definition-grid dt {
    color: var(--color-text-muted);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.social-definition-grid.social-definition-grid dd {
    margin: 0;
    color: var(--color-text);
    font-weight: 800;
    overflow-wrap: anywhere;
}

.guild-roster-list.guild-roster-list,
.social-board-grid .card-list.compact-list {
    gap: var(--space-sm);
}

.notification-unread.notification-unread {
    border-color: rgba(230, 190, 98, 0.28);
    box-shadow: inset 0 0 0 1px rgba(230, 190, 98, 0.08);
}

.notification-read.notification-read {
    opacity: 0.88;
}

.message-compose-form.message-compose-form input,
.message-compose-form.message-compose-form textarea {
    width: 100%;
}

.social-board-grid .inline-action-form button,
.guild-card-grid .inline-action-form button,
.social-board-grid .button-link,
.guild-card-grid .button-link {
    border-color: rgba(230, 190, 98, 0.22);
}

/* Messages list/detail workspace. Kept separate from shared social cards and Notifications. */
.messages-toolbar,
.messages-empty-state,
.messages-compose-panel,
.messages-ledger { display: grid; gap: var(--space-md); min-width: 0; }
.theme-foundation .content-body .messages-toolbar.messages-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 0.75rem; padding: 0.8rem 1rem; }
.messages-toolbar__summary { display: flex; flex: 1 1 auto; flex-wrap: wrap; align-items: baseline; gap: 0.35rem 0.85rem; min-width: 0; }
.messages-toolbar h2,
.messages-empty-state h2,
.messages-compose-panel h2,
.messages-ledger h2,
.messages-ledger h3,
.messages-toolbar p,
.messages-empty-state p,
.messages-compose-panel p,
.messages-ledger p { margin: 0; }
.messages-toolbar__counts { display: flex; flex-wrap: wrap; gap: 0.35rem 0.7rem; }
.messages-toolbar__counts p { display: inline-flex; align-items: baseline; gap: 0.35rem; color: var(--text-ink-muted); font-family: var(--font-family-interface); font-size: 0.82rem; }
.messages-toolbar__counts strong { color: var(--text-ink); font-size: 1.05rem; }
.messages-toolbar__action { align-self: center; justify-self: end; white-space: nowrap; }
.messages-empty-state { justify-items: start; }
.messages-compose-panel__header,
.messages-ledger__header,
.message-inline-detail__header { display: flex; flex-wrap: wrap; align-items: start; justify-content: space-between; gap: var(--space-sm); }
.messages-compose-panel > p { color: var(--text-ink-muted); line-height: 1.5; }
.messages-compose-panel .message-compose-form { max-width: 44rem; }
.message-compose-recipient { display: grid; gap: 0.25rem; padding: 0.75rem; border: 1px solid var(--border-soft); border-radius: var(--radius-control); background: var(--surface-parchment-base); }
.message-compose-recipient span { color: var(--text-ink-muted); font-family: var(--font-family-interface); font-size: 0.76rem; font-weight: 800; }
.message-compose-recipient strong { color: var(--text-ink); overflow-wrap: anywhere; }
.messages-tabs { margin-bottom: 0; }
.messages-ledger__empty { color: var(--text-ink-muted); line-height: 1.5; }
.messages-list { display: grid; gap: 0.5rem; }
.message-list-entry { min-width: 0; border: 1px solid var(--border-soft); border-left: 3px solid color-mix(in srgb, var(--text-ink-muted) 62%, var(--surface-stone-overlay)); border-radius: var(--radius-control); background: color-mix(in srgb, var(--surface-parchment-base) 86%, var(--surface-parchment-raised)); overflow: hidden; }
.message-list-entry.is-unread { border-left-color: var(--color-accent-gold-muted); background: color-mix(in srgb, var(--surface-parchment-raised) 78%, var(--surface-parchment-base)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--color-accent-gold) 18%, transparent); }
.message-list-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(8rem, 0.48fr); align-items: stretch; width: 100%; min-width: 0; box-sizing: border-box; }
.message-list-row__thread { display: grid; grid-template-columns: minmax(5.4rem, auto) minmax(0, 1fr) minmax(9rem, 0.6fr); gap: var(--space-sm); align-items: start; min-width: 0; padding: 0.75rem; color: var(--text-ink); text-decoration: none; }
.message-list-row__thread:hover { background: color-mix(in srgb, var(--surface-parchment-raised) 70%, transparent); }
.message-list-row__thread:focus-visible { outline: 2px solid var(--color-accent-gold); outline-offset: -2px; }
.message-list-row__state { display: inline-flex; align-items: center; gap: 0.35rem; color: var(--text-ink-muted); font-family: var(--font-family-interface); font-size: 0.76rem; font-weight: 800; }
.message-list-row__dot { width: 0.55rem; height: 0.55rem; flex: 0 0 auto; border-radius: 50%; background: color-mix(in srgb, var(--text-ink-muted) 62%, var(--surface-stone-overlay)); }
.message-list-entry.is-unread .message-list-row__dot { background: var(--color-accent-gold-muted); box-shadow: 0 0 0 0.14rem color-mix(in srgb, var(--color-accent-gold-muted) 22%, transparent); }
.message-list-row__content { display: grid; gap: 0.25rem; min-width: 0; }
.message-list-row__content strong,
.message-list-row__preview,
.message-list-row__participant,
.message-list-row__timestamp { overflow-wrap: anywhere; }
.message-list-row__preview { color: var(--text-ink); line-height: 1.4; }
.message-list-row__participant,
.message-list-row__timestamp { color: var(--text-ink-muted); font-family: var(--font-family-interface); font-size: 0.78rem; line-height: 1.4; }
.message-list-row__participant { display: flex; align-items: flex-start; min-width: 0; padding: 0.75rem; }
.message-list-row__participant:focus-visible { outline-offset: -2px; }
.message-inline-detail { display: grid; gap: var(--space-md); padding: var(--space-md); border-top: 1px solid var(--border-soft); background: var(--surface-parchment-raised); }
.message-inline-detail__meta { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.5rem; margin: 0; }
.message-inline-detail__meta > div { min-width: 0; padding: 0.5rem; border: 1px solid var(--border-soft); border-radius: var(--radius-subtle); background: var(--surface-parchment-base); }
.message-inline-detail__meta dt { color: var(--text-ink-muted); font-family: var(--font-family-interface); font-size: 0.7rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.message-inline-detail__meta dd { margin: 0.2rem 0 0; color: var(--text-ink); overflow-wrap: anywhere; }
.message-inline-detail__body { color: var(--text-ink); line-height: 1.55; overflow-wrap: anywhere; }

/* Notifications activity ledger. Kept separate from the shared Messages and Guild social cards. */
.notifications-toolbar,
.notifications-empty-state,
.notifications-ledger { display: grid; gap: var(--space-md); min-width: 0; }
.theme-foundation .content-body .notifications-toolbar.notifications-toolbar { display: grid; gap: 0.75rem; padding: 0.8rem 1rem; }
.notifications-toolbar__summary { display: flex; flex: 1 1 auto; flex-wrap: wrap; align-items: baseline; gap: 0.35rem 0.85rem; min-width: 0; }
.notifications-toolbar h2,
.notifications-empty-state h2,
.notifications-ledger h2,
.notifications-ledger h3,
.notification-ledger-row h4,
.notifications-toolbar p,
.notifications-empty-state p,
.notifications-ledger p { margin: 0; }
.notifications-toolbar__counts { display: flex; flex-wrap: wrap; gap: 0.35rem 0.7rem; }
.notifications-toolbar__counts p { display: inline-flex; align-items: baseline; gap: 0.35rem; color: var(--text-ink-muted); font-family: var(--font-family-interface); font-size: 0.82rem; }
.notifications-toolbar__counts strong { color: var(--text-ink); font-size: 1.05rem; }
.notifications-empty-state { justify-items: start; }
.notifications-ledger__header { display: grid; gap: 0.3rem; }
.notifications-ledger__group { display: grid; gap: 0.5rem; }
.notifications-ledger__group h3 { color: var(--text-ink-muted); font-family: var(--font-family-interface); font-size: 0.78rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.notifications-ledger__rows { display: grid; gap: 0.45rem; }
.notifications-ledger__empty { color: var(--text-ink-muted); line-height: 1.5; }
.notification-ledger-row { display: grid; grid-template-columns: minmax(5.75rem, auto) minmax(0, 1fr) minmax(6rem, 0.42fr) minmax(9rem, 0.6fr) auto; gap: var(--space-sm); align-items: start; min-width: 0; padding: 0.75rem; border: 1px solid var(--border-soft); border-left: 3px solid color-mix(in srgb, var(--text-ink-muted) 62%, var(--surface-stone-overlay)); border-radius: var(--radius-control); background: color-mix(in srgb, var(--surface-parchment-base) 86%, var(--surface-parchment-raised)); }
.notification-ledger-row.is-unread { border-left-color: var(--color-accent-gold-muted); background: color-mix(in srgb, var(--surface-parchment-raised) 78%, var(--surface-parchment-base)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--color-accent-gold) 18%, transparent); }
.notification-ledger-row__status { display: inline-flex; align-items: center; gap: 0.35rem; color: var(--text-ink-muted); font-family: var(--font-family-interface); font-size: 0.76rem; font-weight: 800; }
.notification-ledger-row__dot { width: 0.55rem; height: 0.55rem; flex: 0 0 auto; border-radius: 50%; background: color-mix(in srgb, var(--text-ink-muted) 62%, var(--surface-stone-overlay)); }
.notification-ledger-row.is-unread .notification-ledger-row__dot { background: var(--color-accent-gold-muted); box-shadow: 0 0 0 0.14rem color-mix(in srgb, var(--color-accent-gold-muted) 22%, transparent); }
.notification-ledger-row__content { display: grid; gap: 0.3rem; min-width: 0; }
.notification-ledger-row__identity { color: var(--text-ink-muted); font-family: var(--font-family-interface); font-size: 0.76rem; font-weight: 800; }
.notification-ledger-row__identity .notification-identity-glyph { color: var(--color-accent-gold-muted); }
.notification-ledger-row h4 { overflow-wrap: anywhere; }
.notification-ledger-row__content > p { color: var(--text-ink); line-height: 1.45; overflow-wrap: anywhere; }
.notification-ledger-row__category { display: grid; gap: 0.15rem; color: var(--text-ink); font-size: 0.86rem; overflow-wrap: anywhere; }
.notification-ledger-row__category span { color: var(--text-ink-muted); font-family: var(--font-family-interface); font-size: 0.7rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.notification-ledger-row__timestamp { color: var(--text-ink-muted); font-family: var(--font-family-interface); font-size: 0.78rem; line-height: 1.4; overflow-wrap: anywhere; }
.notification-ledger-row__actions { display: flex; flex-wrap: wrap; gap: 0.45rem; align-items: start; justify-content: flex-end; min-width: 0; }
.notification-ledger-row__actions .inline-action-form { margin: 0; }
.notification-ledger-row__actions .button-link,
.notification-ledger-row__actions button { min-height: 2.35rem; white-space: nowrap; }

@media (max-width: 900px) {
    .social-board-grid.social-board-grid,
    .guild-card-grid.guild-card-grid,
    .social-board-grid.guild-grid,
    .social-board-grid.account-grid {
        grid-template-columns: 1fr;
    }

    .notification-ledger-row { grid-template-columns: auto minmax(0, 1fr); }
    .notification-ledger-row__category,
    .notification-ledger-row__timestamp,
    .notification-ledger-row__actions { grid-column: 2; }
    .notification-ledger-row__actions { justify-content: flex-start; }

    .message-list-row { grid-template-columns: 1fr; }
    .message-list-row__thread { grid-template-columns: auto minmax(0, 1fr); }
    .message-list-row__timestamp { grid-column: 2; }
    .message-list-row__participant { padding: 0 var(--space-sm) var(--space-sm); }
    .message-inline-detail__meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
    .theme-foundation .content-body .messages-toolbar.messages-toolbar { grid-template-columns: 1fr; padding: var(--space-sm); }
    .messages-toolbar__summary { gap: 0.35rem 0.65rem; }
    .messages-toolbar__action { justify-self: start; }
    .message-list-row__thread { gap: 0.6rem; padding: var(--space-sm); }
    .message-inline-detail { padding: var(--space-sm); }
    .message-inline-detail__meta { grid-template-columns: 1fr; }

    .theme-foundation .content-body .notifications-toolbar.notifications-toolbar { grid-template-columns: 1fr; padding: var(--space-sm); }
    .notifications-toolbar__summary { gap: 0.35rem 0.65rem; }
    .notification-ledger-row { gap: 0.6rem; padding: var(--space-sm); }
    .notification-ledger-row__category,
    .notification-ledger-row__timestamp { font-size: 0.8rem; }
}

/* Auth, registration, and character creation */
.auth-entry.auth-entry {
    min-height: 100vh;
}

.auth-shell.auth-shell,
.auth-entry.auth-entry .auth-shell {
    display: grid;
    grid-template-columns: minmax(16rem, 0.85fr) minmax(20rem, 28rem);
    gap: var(--space-lg);
    width: min(980px, calc(100% - 32px));
    margin: 0 auto;
    align-items: stretch;
}

.auth-lore-panel.auth-lore-panel,
.auth-entry.auth-entry .auth-lore-panel {
    display: grid;
    align-content: center;
    gap: var(--space-md);
    min-width: 0;
    padding: clamp(1.5rem, 4vw, 2.5rem);
    border: 1px solid rgba(230, 190, 98, 0.18);
    border-radius: var(--radius-lg);
    background:
        linear-gradient(135deg, rgba(230, 190, 98, 0.16), rgba(88, 125, 101, 0.11)),
        rgba(13, 12, 10, 0.78);
    box-shadow: var(--shadow-soft);
}

.auth-lore-panel.auth-lore-panel h1,
.auth-lore-panel.auth-lore-panel p,
.auth-entry.auth-entry .auth-lore-panel h1,
.auth-entry.auth-entry .auth-lore-panel p {
    margin: 0;
}

.auth-lore-panel.auth-lore-panel p:not(.eyebrow),
.auth-entry.auth-entry .auth-lore-panel p:not(.eyebrow) {
    max-width: 54ch;
    color: var(--color-text-soft);
    line-height: 1.6;
}

.auth-ledger.auth-ledger,
.auth-entry.auth-entry .auth-ledger {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-sm);
    margin: var(--space-sm) 0 0;
}

.auth-ledger.auth-ledger > div,
.auth-entry.auth-entry .auth-ledger > div {
    display: grid;
    grid-template-columns: 7rem minmax(0, 1fr);
    gap: var(--space-sm);
    padding: var(--space-sm);
    border: 1px solid rgba(230, 190, 98, 0.12);
    border-radius: var(--radius-md);
    background: rgba(201, 174, 124, 0.1);
}

.auth-ledger.auth-ledger dt,
.auth-entry.auth-entry .auth-ledger dt {
    color: var(--color-text-muted);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.auth-ledger.auth-ledger dd,
.auth-entry.auth-entry .auth-ledger dd {
    color: var(--color-text-soft);
    line-height: 1.45;
}

.auth-entry-card.auth-entry-card,
.auth-entry.auth-entry .auth-entry-card {
    display: grid;
    align-content: center;
    gap: var(--space-md);
    border-color: rgba(230, 190, 98, 0.18);
    background:
        linear-gradient(180deg, rgba(201, 174, 124, 0.12), rgba(255, 255, 255, 0.035)),
        var(--surface-panel);
    box-shadow: var(--shadow-soft);
}

.auth-entry-card.auth-entry-card h1,
.auth-intro.auth-intro h2,
.auth-intro.auth-intro p,
.auth-entry.auth-entry .auth-entry-card h1,
.auth-entry.auth-entry .auth-intro h2,
.auth-entry.auth-entry .auth-intro p {
    margin: 0;
}

.auth-intro.auth-intro,
.auth-entry.auth-entry .auth-intro {
    display: grid;
    gap: 0.45rem;
    padding: var(--space-md);
    border: 1px solid rgba(230, 190, 98, 0.12);
    border-radius: var(--radius-md);
    background: rgba(13, 12, 10, 0.42);
}

.auth-intro.auth-intro p:not(.eyebrow),
.auth-entry.auth-entry .auth-intro p:not(.eyebrow) {
    color: var(--color-text-soft);
    line-height: 1.55;
}

.auth-form.auth-form,
.auth-entry.auth-entry .auth-form {
    gap: 0.85rem;
}

.auth-form.auth-form label,
.character-creation-form.character-creation-form label,
.auth-entry.auth-entry .auth-form label {
    color: var(--color-text-soft);
}

.auth-form.auth-form input,
.character-creation-form.character-creation-form input,
.auth-entry.auth-entry .auth-form input {
    border-color: rgba(230, 190, 98, 0.18);
    background: rgba(13, 12, 10, 0.48);
}

.auth-form.auth-form button,
.character-creation-form.character-creation-form button,
.auth-entry.auth-entry .auth-form button {
    border-color: rgba(230, 190, 98, 0.26);
    background: rgba(230, 190, 98, 0.14);
}

.auth-switch-panel.auth-switch-panel,
.auth-entry.auth-entry .auth-switch-panel {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem 0.7rem;
    align-items: center;
    color: var(--color-text-soft);
}

.auth-switch-panel.auth-switch-panel a,
.auth-entry.auth-entry .auth-switch-panel a {
    color: var(--accent-gold);
    font-weight: 800;
}

.auth-page-hero.auth-page-hero {
    display: grid;
    gap: var(--space-sm);
    overflow: hidden;
    border-color: rgba(230, 190, 98, 0.18);
    background:
        linear-gradient(135deg, rgba(230, 190, 98, 0.15), rgba(88, 125, 101, 0.1)),
        rgba(13, 12, 10, 0.78);
}

.auth-page-hero.auth-page-hero h1,
.auth-page-hero.auth-page-hero p {
    margin: 0;
}

.auth-page-hero.auth-page-hero p:not(.eyebrow) {
    max-width: 74ch;
    color: var(--color-text-soft);
    line-height: 1.6;
}

.character-create-status-strip.character-create-status-strip {
    grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
    border-color: rgba(230, 190, 98, 0.16);
    background: rgba(13, 12, 10, 0.58);
}

.character-create-status-strip.character-create-status-strip .module-stat-item,
.character-creation-definition-grid.character-creation-definition-grid > div {
    border: 1px solid rgba(230, 190, 98, 0.12);
    border-radius: var(--radius-md);
    background: rgba(201, 174, 124, 0.11);
}

.character-create-grid.character-create-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(20rem, 1.1fr);
    gap: var(--space-md);
    align-items: start;
}

.character-creation-ledger-card.character-creation-ledger-card,
.character-creation-action-card.character-creation-action-card {
    display: grid;
    gap: var(--space-md);
    min-width: 0;
    padding: var(--space-md);
    border: 1px solid rgba(230, 190, 98, 0.14);
    border-radius: var(--radius-lg);
    background: linear-gradient(180deg, rgba(201, 174, 124, 0.12), rgba(255, 255, 255, 0.035));
}

.character-creation-ledger-card.character-creation-ledger-card h2,
.character-creation-action-card.character-creation-action-card h2 {
    margin: 0;
}

.character-creation-definition-grid.character-creation-definition-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
    gap: var(--space-sm);
}

.character-creation-definition-grid.character-creation-definition-grid > div {
    display: grid;
    gap: 0.25rem;
    padding: var(--space-sm);
}

.character-creation-definition-grid.character-creation-definition-grid dt {
    color: var(--color-text-muted);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.character-creation-definition-grid.character-creation-definition-grid dd {
    margin: 0;
    color: var(--color-text);
    font-weight: 800;
    overflow-wrap: anywhere;
}

@media (max-width: 900px) {
    .auth-shell.auth-shell,
    .auth-entry.auth-entry .auth-shell,
    .character-create-grid.character-create-grid {
        grid-template-columns: 1fr;
    }

    .auth-ledger.auth-ledger > div,
    .auth-entry.auth-entry .auth-ledger > div {
        grid-template-columns: 1fr;
    }
}

/* Error pages, maintenance, and flash messages */
.error-panel.error-panel {
    display: grid;
    gap: var(--space-md);
    overflow: hidden;
    border-color: rgba(230, 190, 98, 0.2);
    background:
        radial-gradient(circle at top right, rgba(230, 190, 98, 0.14), transparent 34rem),
        linear-gradient(135deg, rgba(201, 174, 124, 0.12), rgba(255, 255, 255, 0.035)),
        var(--surface-panel);
    box-shadow: var(--shadow-soft);
}

.error-panel.error-panel h1,
.error-panel.error-panel p,
.error-panel.error-panel dl {
    margin: 0;
}

.error-panel.error-panel p:not(.eyebrow) {
    max-width: 72ch;
    color: var(--color-text-soft);
    line-height: 1.6;
}

.error-status-strip.error-status-strip {
    grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
    border-color: rgba(230, 190, 98, 0.16);
    background: rgba(13, 12, 10, 0.56);
}

.error-status-strip.error-status-strip .module-stat-item {
    border: 1px solid rgba(230, 190, 98, 0.12);
    border-radius: var(--radius-md);
    background: rgba(201, 174, 124, 0.11);
}

.error-actions.error-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
    align-items: center;
}

.error-reference.error-reference {
    display: inline-flex;
    width: fit-content;
    gap: 0.4rem;
    align-items: center;
    padding: 0.55rem 0.7rem;
    border: 1px solid rgba(230, 190, 98, 0.14);
    border-radius: var(--radius-sm);
    background: rgba(13, 12, 10, 0.48);
}

.error-reference.error-reference code {
    color: var(--accent-gold);
    font-weight: 800;
}

.maintenance-panel.maintenance-panel {
    border-color: rgba(88, 125, 101, 0.34);
    background:
        radial-gradient(circle at top right, rgba(88, 125, 101, 0.2), transparent 34rem),
        linear-gradient(135deg, rgba(201, 174, 124, 0.12), rgba(255, 255, 255, 0.035)),
        var(--surface-panel);
}

.notice-stack {
    display: grid;
    gap: var(--space-sm);
    margin-block: 0 var(--space-md);
}

.notice-message {
    display: grid;
    grid-template-columns: auto auto minmax(0, 1fr);
    gap: 0.65rem;
    align-items: start;
    border-color: rgba(230, 190, 98, 0.18);
    background:
        linear-gradient(135deg, rgba(201, 174, 124, 0.13), rgba(255, 255, 255, 0.035)),
        rgba(13, 12, 10, 0.72);
}

.notice-icon {
    display: inline-grid;
    place-items: center;
    width: 1.45rem;
    height: 1.45rem;
    border: 1px solid rgba(230, 190, 98, 0.24);
    border-radius: 999px;
    color: var(--accent-gold);
    font-weight: 900;
    line-height: 1;
}

.notice-label {
    color: var(--accent-gold);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.notice-copy {
    min-width: 0;
    color: var(--color-text);
    line-height: 1.45;
}

@media (max-width: 680px) {
    .notice-message {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .notice-label {
        grid-column: 2;
    }

    .notice-copy {
        grid-column: 1 / -1;
    }
}

/* Public information pages */
.information-page { max-width: 52rem; margin-inline: auto; padding: clamp(1.25rem, 3vw, 2.25rem); color: var(--text-ink); }
.information-page > * + * { margin-top: 1rem; }
.information-page h1, .information-page h2 { color: var(--text-ink); }
.information-page h2 { margin-top: 1.75rem; font-size: 1.25rem; }
.information-page p { max-width: 46rem; line-height: 1.6; }
.information-updated { color: var(--text-ink-muted); font-size: 0.85rem; }
.information-nav { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 2rem; }
.information-nav a, .information-return { color: var(--text-ink); text-underline-offset: 0.2em; }
.information-nav a { padding: 0.4rem 0.65rem; border: 1px solid var(--border-soft); border-radius: var(--radius-subtle); }
.information-nav a[aria-current="page"] { background: var(--surface-parchment-muted); font-weight: 800; }
.information-nav a:focus-visible, .information-return:focus-visible { outline: var(--border-width-strong) solid var(--color-accent-gold); outline-offset: var(--space-1); }
.account-settings { color: var(--text-ink); }
.account-settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
.account-settings label { display: grid; gap: 0.35rem; margin-top: 0.8rem; font-weight: 700; }
.account-settings input { width: 100%; min-height: 2.75rem; }
.account-settings form button { margin-top: 1rem; }
@media (max-width: 720px) { .account-settings-grid { grid-template-columns: 1fr; } }

/* Shared authenticated content banner */
/* Control Center operations console */
.control-hero.control-hero {
    position: relative;
    overflow: hidden;
    border-color: rgba(230, 190, 98, 0.24);
    background:
        linear-gradient(135deg, rgba(36, 31, 24, 0.95), rgba(16, 17, 18, 0.93)),
        radial-gradient(circle at top right, rgba(230, 190, 98, 0.12), transparent 36%);
}

.control-hero.control-hero::after {
    content: "";
    position: absolute;
    inset: auto 1.2rem 1rem auto;
    width: 6.5rem;
    height: 6.5rem;
    border: 1px solid rgba(230, 190, 98, 0.16);
    border-radius: 999px;
    background: radial-gradient(circle, rgba(230, 190, 98, 0.08), transparent 62%);
    pointer-events: none;
}

.control-command-strip.control-command-strip {
    border-color: rgba(133, 178, 148, 0.28);
    background:
        linear-gradient(135deg, rgba(23, 35, 29, 0.9), rgba(15, 16, 16, 0.92));
}

.control-ledger-grid.control-ledger-grid {
    align-items: stretch;
}

.control-status-card.control-status-card,
.control-card.control-card {
    border-color: rgba(230, 190, 98, 0.2);
    background:
        linear-gradient(180deg, rgba(246, 229, 190, 0.08), rgba(20, 18, 14, 0.68));
    box-shadow: inset 0 1px 0 rgba(255, 244, 211, 0.08);
}

.control-status-card.control-status-card dl {
    display: grid;
    grid-template-columns: minmax(8rem, 0.42fr) minmax(0, 1fr);
    gap: 0.55rem 1rem;
    margin: 0.75rem 0 0;
}

.control-status-card.control-status-card dt {
    color: var(--accent-gold);
    font-size: 0.74rem;
    font-weight: 900;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.control-status-card.control-status-card dd {
    margin: 0;
    color: var(--color-text);
    font-weight: 700;
}

.control-card-list.control-card-list {
    gap: 0.9rem;
}

.control-card.control-card h3 {
    color: var(--accent-gold);
}

.control-card.control-card .button-link,
.control-command-strip.control-command-strip .button-link {
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.22);
}

.control-center-checkpoint.control-command-strip.control-command-strip h2,
.control-hero.control-hero h1 {
    letter-spacing: -0.02em;
}

@media (max-width: 720px) {
    .control-status-card.control-status-card dl {
        grid-template-columns: 1fr;
        gap: 0.25rem;
    }

    .control-hero.control-hero::after {
        opacity: 0.45;
        transform: scale(0.72);
    }
}


/* Theme consistency */
.page-map-pill.page-map-pill,
.system-status-pill.system-status-pill,
.system-phase-pill.system-phase-pill {
    text-transform: capitalize;
}


/* Responsive shell and mobile readability */
.theme-foundation {
    --tap-target-min: 44px;
    --mobile-shell-pad: clamp(0.7rem, 3vw, 1rem);
    --mobile-panel-pad: clamp(1rem, 4vw, 1.35rem);
}

.content-shell.content-shell,
.panel.panel,
.theme-card.theme-card,
.notice-copy.notice-copy {
    min-width: 0;
}

.theme-foundation .button-link,
.theme-foundation .inline-action-form button,
.theme-foundation .form-stack button,
.theme-foundation .inline-form button {
    min-height: var(--tap-target-min);
}

.theme-foundation .button-link,
.theme-foundation button,
.theme-foundation input,
.theme-foundation select,
.theme-foundation textarea {
    max-width: 100%;
}

.theme-card-grid.theme-card-grid,
.combat-board-grid.combat-board-grid,
.questing-board-grid.questing-board-grid,
.control-ledger-grid.control-ledger-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
}

.theme-foundation table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.theme-foundation th,
.theme-foundation td {
    min-width: 8rem;
}

.theme-foundation progress {
    max-width: 100%;
}

.hero-panel.hero-panel h1,
.account-page-hero.account-page-hero h1,
.exploration-page-hero.exploration-page-hero h1,
.progression-page-hero.progression-page-hero h1,
.combat-page-hero.combat-page-hero h1,
.questing-page-hero.questing-page-hero h1,
.social-page-hero.social-page-hero h1,
.error-hero.error-hero h1,
.control-hero.control-hero h1 {
    overflow-wrap: anywhere;
}

@media (max-width: 960px) {
    .theme-foundation .game-shell {
        width: min(100% - 20px, 1280px);
        padding-block: var(--mobile-shell-pad);
    }

    .game-frame.game-frame {
        grid-template-columns: 1fr;
        gap: var(--mobile-shell-pad);
    }

    .module-stat-bar.module-stat-bar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 680px) {
    .theme-foundation .game-shell {
        width: min(100% - 14px, 1280px);
    }

    .panel.panel,
    .auth-card.auth-card,
    .theme-card.theme-card {
        padding: var(--mobile-panel-pad);
    }

    .account-page-hero.account-page-hero,
    .exploration-page-hero.exploration-page-hero,
    .progression-page-hero.progression-page-hero,
    .combat-page-hero.combat-page-hero,
    .questing-page-hero.questing-page-hero,
    .social-page-hero.social-page-hero,
    .error-hero.error-hero,
    .control-hero.control-hero {
        grid-template-columns: 1fr;
        justify-items: stretch;
        align-items: stretch;
    }

    .account-hero-actions.account-hero-actions,
    .exploration-hero-actions.exploration-hero-actions,
    .error-actions.error-actions {
        justify-content: stretch;
    }

    .theme-foundation .button-link,
    .theme-foundation .inline-action-form,
    .theme-foundation .inline-action-form button {
        width: 100%;
    }

    .module-stat-bar.module-stat-bar,
    .compact-definition-grid.compact-definition-grid,
    .theme-foundation dl {
        grid-template-columns: 1fr;
    }

    .theme-foundation .form-stack input,
    .theme-foundation .form-stack select,
    .theme-foundation .form-stack textarea {
        width: 100%;
    }

    .harvesting-skill-switcher.harvesting-skill-switcher {
        grid-template-columns: 1fr;
        flex-direction: column;
        align-items: stretch;
    }

    .production-resource-row__action,
    .production-resource-row__action .inline-action-form,
    .production-resource-row__action button {
        width: 100%;
    }

    .production-resource-row__action {
        align-items: stretch;
    }

    .production-resource-row.production-resource-row {
        grid-template-columns: 1fr;
        grid-template-areas:
            "identity"
            "quest"
            "metadata"
            "action";
        gap: 0.65rem;
    }

    .production-resource-row > .production-resource-row__action {
        justify-self: stretch;
    }

    .production-recent-harvests__list li {
        flex-direction: column;
        gap: 0.35rem;
    }
}

@media (max-width: 440px) {
    .theme-foundation .game-shell {
        width: min(100% - 10px, 1280px);
    }

    .notice-stack.notice-stack {
        padding-inline: 0.75rem;
    }

    .module-stat-item.module-stat-item strong {
        font-size: 1rem;
    }
}


/* Cross-page theme refinements */
.home-path-panel.home-path-panel {
    box-shadow: var(--shadow-soft);
}

.home-path-panel .path-list {
    display: grid;
    gap: 0.65rem;
    margin: 0;
    padding-left: 1.2rem;
    color: var(--color-text-soft);
}

.home-path-panel .home-path-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(14rem, 0.45fr);
    gap: var(--space-md);
}

.account-section-header.account-section-header h2,
.exploration-section-header.exploration-section-header h2,
.questing-section-header.questing-section-header h2,
.social-section-header.social-section-header h2,
.control-card.control-card h2 {
    overflow-wrap: anywhere;
}

@media (max-width: 680px) {
    .home-path-panel .home-path-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {
    .progression-data-table.progression-data-table {
        display: table;
        overflow: visible;
    }

    .progression-data-table.progression-data-table thead {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }

    .progression-data-table.progression-data-table tbody,
    .progression-data-table.progression-data-table tr,
    .progression-data-table.progression-data-table td {
        display: block;
        width: 100%;
    }

    .progression-data-table.progression-data-table tr {
        padding: 0.65rem 0;
        border-bottom: 1px solid var(--border-soft);
    }

    .progression-data-table.progression-data-table td {
        display: grid;
        grid-template-columns: minmax(5.5rem, 0.45fr) minmax(0, 1fr);
        gap: 0.75rem;
        min-width: 0;
        padding: 0.45rem 0;
        border: 0;
        overflow-wrap: anywhere;
    }

    .progression-data-table.progression-data-table td::before {
        color: var(--color-text-muted);
        content: attr(data-label);
        font-size: 0.78rem;
        font-weight: 800;
        letter-spacing: 0.05em;
        text-transform: uppercase;
    }
}

/* Overview journal */
.overview-journal {
    display: grid;
    gap: var(--space-lg);
}

.overview-journal .overview-adventure,
.overview-journal .overview-location,
.overview-journal .overview-recap {
    display: grid;
    gap: var(--space-sm);
}

.overview-journal .overview-section-heading,
.overview-journal .overview-section-heading h2,
.overview-journal .overview-section-heading p,
.overview-journal .overview-adventure-description,
.overview-journal .overview-adventure-objective,
.overview-journal .overview-location-description,
.overview-journal .overview-recap-empty {
    margin: 0;
}

.overview-journal .overview-section-heading {
    display: grid;
    gap: 0.35rem;
}

.overview-journal .overview-adventure {
    padding: clamp(1.25rem, 3vw, 2rem);
}

.overview-journal .overview-adventure h2 {
    font-size: clamp(1.55rem, 3vw, 2.35rem);
}

.overview-journal .overview-adventure-objective {
    display: grid;
    gap: 0.25rem;
    padding: 0.85rem 1rem;
    border-left: 3px solid var(--color-accent-bronze);
    background: color-mix(in srgb, var(--surface-parchment-raised) 84%, transparent);
}

.overview-journal .overview-adventure-objective span,
.overview-journal .overview-location-facts span {
    color: var(--text-ink-muted);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.overview-journal .overview-action {
    margin: var(--space-sm) 0 0;
}

.overview-journal .overview-location-facts {
    display: grid;
    gap: 0;
    margin-top: var(--space-xs);
}

.overview-journal .overview-location-facts p {
    display: grid;
    gap: 0.25rem;
    margin: 0;
    padding: 0.75rem 0;
    border-top: 1px solid var(--border-soft);
}

.overview-journal .overview-recap-list {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.overview-journal .overview-recap-entry {
    display: grid;
    grid-template-columns: minmax(8.5rem, 0.45fr) minmax(0, 1fr);
    gap: var(--space-md);
    padding: 1rem 0;
    border-top: 1px solid var(--border-soft);
}

.overview-journal .overview-recap-entry time {
    color: var(--text-ink-muted);
    font-size: 0.82rem;
}

.overview-journal .overview-recap-entry strong,
.overview-journal .overview-recap-entry a {
    color: var(--text-ink);
    font-weight: 800;
}

.overview-journal .overview-recap-entry p {
    margin: 0.3rem 0 0;
    color: var(--text-ink-muted);
}

@media (max-width: 620px) {
    .overview-journal .overview-recap-entry {
        grid-template-columns: 1fr;
        gap: 0.35rem;
    }
}

/* Palette, borders, and card surfaces */
.theme-foundation {
    --foundation-shell-background: #07090d;
    --foundation-panel-surface: #0d1218;
    --foundation-panel-surface-raised: #111821;
    --foundation-panel-surface-strong: #161d27;
    --foundation-accent-bronze: rgba(170, 126, 52, 0.78);
    --foundation-accent-bronze-soft: rgba(129, 94, 35, 0.42);
    --foundation-text-parchment: #d5c09a;
    --foundation-text-parchment-deep: #b99d74;
    --foundation-text-ink: #1e1710;
    --foundation-text-ivory: #f2dfb7;
    --foundation-text-muted: #c2a976;
    --foundation-button-primary-top: #173452;
    --foundation-button-primary-bottom: #0a2034;
    --foundation-button-resource-top: #587330;
    --foundation-button-resource-bottom: #304916;
}

body.theme-foundation,
.theme-foundation {
    background:
        radial-gradient(circle at top, rgba(22, 28, 38, 0.35), transparent 32%),
        linear-gradient(180deg, #07090d 0%, #05070a 100%);
    color: var(--foundation-text-ivory);
}

.theme-foundation .game-shell {
    max-width: 1500px;
    margin: 0 auto;
    padding: 0.7rem;
}

.theme-foundation .panel,
.theme-foundation .module-stat-bar {
    position: relative;
    background:
        linear-gradient(180deg, rgba(24, 31, 41, 0.96), rgba(10, 14, 20, 0.98)),
        linear-gradient(135deg, rgba(255,255,255,0.04), rgba(255,255,255,0));
    border: 1px solid var(--foundation-accent-bronze-soft);
    box-shadow:
        inset 0 0 0 1px rgba(224, 182, 95, 0.08),
        0 12px 30px rgba(0, 0, 0, 0.24);
}

.theme-foundation .panel::before,
.theme-foundation .module-stat-bar::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    border: 1px solid rgba(241, 205, 130, 0.08);
}

.theme-foundation .eyebrow,
.theme-foundation .quiet-note {
    color: var(--foundation-text-muted);
    letter-spacing: 0.06em;
}

.theme-foundation .content-body > .module-stat-bar {
    margin-bottom: 1rem;
    background: linear-gradient(180deg, rgba(20, 27, 36, 0.98), rgba(10, 15, 22, 0.98));
}

.theme-foundation .button-link,
.theme-foundation .secondary-link {
    border-color: rgba(187, 145, 67, 0.42);
}

.theme-foundation .button-link {
    background: linear-gradient(180deg, var(--foundation-button-primary-top), var(--foundation-button-primary-bottom));
    color: #f6eedf;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        inset 0 0 0 1px rgba(0, 0, 0, 0.16),
        0 6px 12px rgba(0, 0, 0, 0.2);
}

.theme-foundation .button-link:hover,
.theme-foundation .button-link:focus {
    background: linear-gradient(180deg, #1f4468, #0c2740);
    color: #fff5df;
}

.footer.footer {
    isolation: isolate;
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: var(--space-4);
    min-width: 0;
    min-height: var(--layout-footer-min-height);
    padding: var(--space-3) var(--space-5);
    overflow: hidden;
    border: var(--border-width-thin) solid color-mix(in srgb, var(--color-accent-bronze) 72%, transparent);
    border-radius: var(--radius-subtle);
    background:
        url("../images/ui/surfaces/dark-stone-grain.svg"),
        radial-gradient(circle at center, color-mix(in srgb, var(--color-accent-gold) 5%, transparent), transparent 38rem),
        linear-gradient(180deg, var(--surface-stone-raised), var(--surface-stone-base));
    background-repeat: repeat, no-repeat, no-repeat;
    background-size: 96px 96px, auto, auto;
    box-shadow: var(--shadow-frame-inset), var(--shadow-surface);
    color: var(--text-on-stone-muted);
    font-family: var(--font-family-body);
    font-size: 0.82rem;
}

.footer.footer::before,
.footer.footer::after {
    content: "";
    position: absolute;
    pointer-events: none;
}

.footer.footer::before {
    inset: var(--space-1);
    border: var(--border-width-thin) solid color-mix(in srgb, var(--color-accent-gold) 24%, transparent);
}

.footer.footer::after {
    inset: var(--space-1);
    background:
        radial-gradient(circle at top left, var(--color-accent-gold) 0 1px, transparent 2px),
        radial-gradient(circle at top right, var(--color-accent-gold) 0 1px, transparent 2px),
        radial-gradient(circle at bottom left, var(--color-accent-gold) 0 1px, transparent 2px),
        radial-gradient(circle at bottom right, var(--color-accent-gold) 0 1px, transparent 2px);
    opacity: 0.62;
}

.footer-copyright,
.footer-version {
    position: relative;
    z-index: 1;
    margin: 0;
    overflow-wrap: anywhere;
}

.footer-copyright {
    justify-self: start;
}

.footer-links {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-4);
    min-width: 0;
}

.footer-item {
    color: var(--text-on-stone-muted);
    white-space: nowrap;
}

a.footer-item {
    color: var(--color-accent-gold);
    text-underline-offset: 0.2em;
}

a.footer-item:hover {
    color: var(--color-accent-gold);
}

a.footer-item:focus-visible {
    outline: var(--border-width-strong) solid var(--color-accent-gold);
    outline-offset: var(--space-1);
}

.footer-item--unavailable {
    cursor: default;
    opacity: 0.72;
}

.footer-version {
    justify-self: end;
    color: var(--color-accent-gold);
    font-family: var(--font-family-display);
    letter-spacing: 0.04em;
}

.auth-shell.auth-shell > .footer.footer {
    grid-column: 1 / -1;
    width: 100%;
}

@media (max-width: 780px) {
    .footer.footer {
        grid-template-columns: 1fr;
        justify-items: center;
        gap: var(--space-2);
        padding: var(--space-3);
        text-align: center;
    }

    .footer-copyright,
    .footer-version {
        justify-self: center;
    }

    .footer-links {
        flex-wrap: wrap;
        gap: var(--space-2) var(--space-4);
    }
}

/* Shared sidebar and primary navigation */
.game-frame.game-frame {
    grid-template-columns: minmax(13.5rem, var(--layout-sidebar-width)) minmax(0, 1fr);
    gap: var(--layout-content-gap);
}

.primary-sidebar {
    isolation: isolate;
    position: sticky;
    top: calc(var(--layout-header-min-height) + var(--space-4));
    z-index: 10;
    min-width: 0;
    padding: var(--space-2);
    overflow: hidden;
    border: var(--border-width-thin) solid color-mix(in srgb, var(--color-accent-bronze) 72%, transparent);
    border-radius: var(--radius-subtle);
    background:
        url("../images/ui/surfaces/dark-stone-grain.svg"),
        radial-gradient(circle at top, color-mix(in srgb, var(--color-accent-gold) 7%, transparent), transparent 18rem),
        linear-gradient(180deg, var(--surface-stone-raised), var(--surface-stone-base));
    background-repeat: repeat, no-repeat, no-repeat;
    background-size: 96px 96px, auto, auto;
    box-shadow: var(--shadow-frame-inset), var(--shadow-surface);
    color: var(--text-on-stone);
}

.primary-sidebar::before,
.primary-sidebar::after {
    content: "";
    position: absolute;
    inset: var(--border-width-strong);
    z-index: -1;
    pointer-events: none;
}

.primary-sidebar::before {
    border: var(--border-width-thin) solid color-mix(in srgb, var(--color-accent-gold) 24%, transparent);
}

.primary-sidebar::after {
    background:
        linear-gradient(135deg, var(--color-accent-bronze) 0 1px, transparent 1px) top left / 1.15rem 1.15rem no-repeat,
        linear-gradient(225deg, var(--color-accent-bronze) 0 1px, transparent 1px) top right / 1.15rem 1.15rem no-repeat,
        linear-gradient(45deg, var(--color-accent-bronze) 0 1px, transparent 1px) bottom left / 1.15rem 1.15rem no-repeat,
        linear-gradient(315deg, var(--color-accent-bronze) 0 1px, transparent 1px) bottom right / 1.15rem 1.15rem no-repeat;
    opacity: 0.68;
}

.player-summary {
    position: relative;
    z-index: 1;
    display: grid;
    gap: var(--space-2);
    min-width: 0;
    padding: var(--space-3) var(--space-2);
    border-bottom: var(--border-width-thin) solid color-mix(in srgb, var(--color-accent-bronze) 42%, transparent);
}

.player-identity {
    display: grid;
    gap: var(--space-1);
    min-width: 0;
}

.player-identity-label {
    color: var(--text-on-stone-muted);
    font-family: var(--font-family-interface);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.player-name {
    color: color-mix(in srgb, var(--color-accent-gold) 82%, var(--text-on-stone));
    font-family: var(--font-family-display);
    font-size: 1.08rem;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.player-combat-level {
    color: var(--text-on-stone-muted);
    font-family: var(--font-family-interface);
    font-size: 0.78rem;
    line-height: 1.2;
}

.player-state {
    min-width: 0;
}

.sidebar-resources {
    display: grid;
    gap: var(--space-1);
}

.sidebar-resource {
    display: grid;
    gap: var(--space-1);
    min-width: 0;
}

.sidebar-resource-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, max-content);
    align-items: baseline;
    gap: var(--space-2);
    color: var(--text-on-stone-muted);
    font-size: 0.78rem;
}

.sidebar-resource-heading strong {
    color: var(--text-on-stone);
    font-variant-numeric: tabular-nums;
    justify-self: end;
    white-space: nowrap;
}

.resource-meter {
    display: block;
    width: 100%;
    height: 0.55rem;
    overflow: hidden;
    border: var(--border-width-thin) solid color-mix(in srgb, var(--color-accent-bronze) 45%, var(--surface-stone-base));
    border-radius: var(--radius-subtle);
    background: var(--surface-stone-base);
    accent-color: var(--state-information-border);
}

.resource-meter-interaction {
    position: relative;
    min-width: 0;
    outline: none;
}

.resource-meter-interaction:focus-visible {
    outline: var(--border-width-strong) solid var(--color-accent-gold);
    outline-offset: var(--space-1);
}

.resource-recovery-tooltip {
    position: absolute;
    top: calc(100% + var(--space-1));
    right: 0;
    left: 0;
    z-index: 5;
    display: grid;
    gap: 0.1rem;
    padding: var(--space-2);
    visibility: hidden;
    border: var(--border-width-thin) solid color-mix(in srgb, var(--color-accent-gold) 48%, var(--surface-stone-base));
    border-radius: var(--radius-subtle);
    background: var(--surface-stone-overlay);
    box-shadow: var(--shadow-surface);
    color: var(--text-on-stone);
    font-family: var(--font-family-interface);
    font-size: 0.75rem;
    line-height: 1.3;
    opacity: 0;
    pointer-events: none;
    transform: translateY(calc(var(--space-1) * -1));
    transition:
        opacity var(--motion-duration-fast) var(--motion-easing-standard),
        transform var(--motion-duration-fast) var(--motion-easing-standard),
        visibility var(--motion-duration-fast) var(--motion-easing-standard);
}

.resource-meter-interaction:hover .resource-recovery-tooltip,
.resource-meter-interaction:focus .resource-recovery-tooltip,
.resource-meter-interaction:focus-within .resource-recovery-tooltip {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
}

.resource-recovery-tooltip small {
    color: color-mix(in srgb, var(--text-on-stone) 86%, var(--surface-stone-base));
    font-size: 0.68rem;
}

.sidebar-resource--health .resource-meter {
    accent-color: var(--state-danger-border);
}

.sidebar-resource--energy .resource-meter {
    accent-color: var(--state-warning-border);
}

.combat-health-meter {
    accent-color: var(--state-danger-border);
}

.combat-health-summary {
    margin-bottom: var(--space-2);
}

.resource-meter--unavailable {
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--surface-stone-raised) 76%, transparent), var(--surface-stone-base));
    box-shadow: var(--shadow-frame-inset);
}

.sidebar-resource--unavailable .sidebar-resource-heading,
.sidebar-resource--unavailable .sidebar-resource-value {
    color: var(--text-on-stone-muted);
}

.sidebar-currencies {
    display: grid;
    gap: 0;
    margin: 0;
    padding-top: var(--space-2);
    border-top: var(--border-width-thin) solid color-mix(in srgb, var(--color-accent-bronze) 28%, transparent);
}

.sidebar-currency {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, max-content);
    align-items: center;
    gap: var(--space-2);
    min-height: 2rem;
}

.sidebar-currency-label {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    min-width: 0;
    color: var(--text-on-stone-muted);
    font-size: 0.8rem;
}

.sidebar-currency-marker {
    flex: 0 0 auto;
    width: 0.75rem;
    height: 0.75rem;
    border: var(--border-width-thin) solid color-mix(in srgb, var(--color-accent-gold) 72%, var(--surface-stone-base));
    border-radius: 50%;
    background: radial-gradient(circle at 35% 30%, var(--color-accent-gold), var(--color-accent-bronze) 68%, var(--surface-stone-base));
    box-shadow: var(--shadow-frame-inset);
}

.sidebar-currency-value {
    color: var(--text-on-stone);
    font-family: var(--font-family-interface);
    font-size: 0.78rem;
    line-height: 1.2;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    justify-self: end;
    white-space: nowrap;
}

.sidebar-currency--pocket_copper .sidebar-currency-value {
    min-width: 0;
    overflow-wrap: anywhere;
    white-space: normal;
}

.player-state-note {
    margin: 0;
    color: var(--text-on-stone-muted);
    font-size: 0.8rem;
    line-height: 1.4;
}

.player-account-link {
    width: 100%;
    min-height: 2.75rem;
    text-align: center;
}

.primary-navigation {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 0;
    min-width: 0;
    padding: var(--space-1) 0 var(--space-2);
}

.navigation-group {
    min-width: 0;
    border-bottom: var(--border-width-thin) solid color-mix(in srgb, var(--color-accent-bronze) 22%, transparent);
}

.navigation-group:last-child {
    border-bottom: 0;
}

.navigation-group-toggle {
    display: none;
    width: 100%;
    min-height: 2.75rem;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-1);
    align-items: center;
    padding: var(--space-1) var(--space-2);
    border: 0;
    border-radius: var(--radius-subtle);
    background: transparent;
    color: var(--color-accent-gold);
    box-shadow: none;
    font-family: var(--font-family-display);
    font-size: 0.88rem;
    font-weight: 800;
    letter-spacing: 0.045em;
    text-align: left;
    text-transform: uppercase;
    cursor: pointer;
}

.primary-navigation--disclosures-ready .navigation-group-toggle {
    display: grid;
}

.navigation-group-toggle:hover {
    background: color-mix(in srgb, var(--color-accent-bronze) 12%, transparent);
}

.navigation-group-toggle:focus-visible,
.navigation-link:focus-visible,
.player-account-link:focus-visible {
    outline: var(--border-width-strong) solid var(--color-accent-gold);
    outline-offset: calc(var(--border-width-strong) * -1);
}

.navigation-group-indicator {
    width: 0.55rem;
    height: 0.55rem;
    transform: rotate(45deg);
    border-right: var(--border-width-strong) solid currentColor;
    border-bottom: var(--border-width-strong) solid currentColor;
    transition: transform var(--motion-duration-fast) var(--motion-easing-standard);
}

.navigation-group-toggle[aria-expanded="false"] .navigation-group-indicator {
    transform: rotate(-45deg);
}

.navigation-list {
    display: grid;
    gap: 0.1rem;
    margin: 0;
    padding: 0 0 var(--space-1);
    list-style: none;
}

.navigation-list[hidden] {
    display: none;
}

.navigation-item {
    min-width: 0;
}

.navigation-link {
    display: grid;
    grid-template-columns: 0.75rem minmax(0, 1fr);
    gap: var(--space-1);
    align-items: center;
    min-width: 0;
    min-height: 2rem;
    padding: 0.3rem 0.5rem;
    border: var(--border-width-thin) solid transparent;
    border-radius: var(--radius-subtle);
    color: var(--text-on-stone);
    font-family: var(--font-family-interface);
    font-size: 0.8125rem;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
}

.navigation-link:hover {
    border-color: color-mix(in srgb, var(--color-accent-bronze) 52%, transparent);
    background: color-mix(in srgb, var(--color-accent-bronze) 14%, transparent);
    color: var(--surface-parchment-base);
}

.navigation-link--active,
.navigation-link[aria-current="page"] {
    border-color: color-mix(in srgb, var(--color-accent-gold) 62%, transparent);
    background: linear-gradient(90deg,
        color-mix(in srgb, var(--color-accent-bronze) 48%, transparent),
        color-mix(in srgb, var(--color-accent-bronze) 12%, transparent));
    box-shadow: inset var(--border-width-strong) 0 0 var(--color-accent-gold);
    color: var(--surface-parchment-base);
}

.navigation-link-marker {
    width: 0.42rem;
    height: 0.42rem;
    border-radius: 50%;
    background: currentColor;
    opacity: 0.55;
}

.navigation-link--active .navigation-link-marker,
.navigation-link[aria-current="page"] .navigation-link-marker {
    transform: scale(1.25);
    opacity: 1;
}

.navigation-link-label {
    min-width: 0;
    overflow-wrap: anywhere;
}

.navigation-link-unread-count {
    color: var(--state-danger-border);
    font-size: 0.9em;
    font-variant-numeric: tabular-nums;
}

.player-name-link {
    color: inherit;
    text-decoration: none;
}

.player-name-link:hover,
.player-name-link:focus-visible {
    color: var(--color-accent-gold);
    text-decoration: underline;
    text-decoration-thickness: var(--border-width-strong);
    text-underline-offset: 0.18em;
}

.player-name-link:focus-visible {
    outline: var(--border-width-strong) solid var(--color-accent-gold);
    outline-offset: 0.16rem;
}

@media (prefers-reduced-motion: reduce) {
    .navigation-group-indicator {
        transition-duration: 0.01ms;
    }
}

@media (max-width: 960px) {
    .game-frame.game-frame {
        grid-template-columns: 1fr;
    }

    .primary-sidebar {
        position: static;
        order: -1;
    }

    .primary-navigation {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: var(--space-2);
    }

    .navigation-group {
        align-self: start;
    }

    .navigation-link {
        min-height: 2.75rem;
        padding: var(--space-1) var(--space-2);
        font-size: 1rem;
        line-height: 1.25;
    }
}

@media (max-width: 620px) {
    .primary-navigation {
        grid-template-columns: 1fr;
    }

    .player-summary {
        padding-inline: var(--space-3);
    }
}


/* Shared header */
.top-interface-shell.top-interface-shell {
    display: grid;
    position: sticky;
    top: 0;
    z-index: 20;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    margin-bottom: 0.9rem;
    overflow: hidden;
    border: 1px solid rgba(170, 126, 52, 0.52);
    background:
        linear-gradient(180deg, rgba(19, 25, 34, 0.98), rgba(7, 10, 15, 0.99)),
        radial-gradient(circle at top left, rgba(197, 148, 58, 0.12), transparent 28%);
    box-shadow:
        inset 0 0 0 1px rgba(255, 224, 157, 0.08),
        0 12px 32px rgba(0, 0, 0, 0.3);
}

.site-header {
    isolation: isolate;
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-4);
    align-items: center;
    min-height: var(--layout-header-min-height);
    min-width: 0;
    padding: var(--space-3) var(--space-5);
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background:
        url("../images/ui/surfaces/dark-stone-grain.svg"),
        linear-gradient(180deg, var(--surface-stone-raised), var(--surface-stone-base)),
        var(--surface-stone-canvas);
    background-repeat: repeat, no-repeat, no-repeat;
    background-size: 96px 96px, auto, auto;
    box-shadow: var(--shadow-surface);
    color: var(--text-on-stone);
}

.site-header::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    border-style: solid;
    border-width: 0.5rem 1rem 0.56rem;
    border-image-source: url("../images/ui/header-ornamental-frame.png");
    border-image-slice: 64 132 66 132;
    border-image-repeat: stretch;
    pointer-events: none;
}

.site-header::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: -1;
    width: min(34vw, 29rem);
    height: var(--border-width-thin);
    transform: translate(-50%, -50%);
    background: linear-gradient(90deg, transparent, var(--color-accent-bronze), transparent);
    opacity: 0.72;
    pointer-events: none;
}

.site-brand {
    position: relative;
    display: block;
    justify-self: start;
    width: 100%;
    max-width: min(36vw, 24rem);
    height: 4.25rem;
    min-width: 0;
    padding-inline: var(--space-2);
    overflow: hidden;
}

.site-brand-image {
    position: absolute;
    top: 50%;
    left: 16.02%;
    display: block;
    width: 65.82%;
    height: auto;
    transform: translateY(calc(-50% - 0.3rem));
    object-fit: contain;
}

.site-crest {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    display: grid;
    width: 6.7rem;
    height: 6.55rem;
    place-items: center;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

.site-crest-image {
    display: block;
    width: 90.2%;
    height: auto;
    object-fit: contain;
}

.header-action-label {
    position: absolute;
    bottom: calc(100% + 0.35rem);
    left: 50%;
    z-index: 5;
    padding: 0.3rem 0.5rem;
    transform: translate(-50%, -0.25rem);
    border: 1px solid color-mix(in srgb, var(--color-accent-bronze) 72%, transparent);
    border-radius: var(--radius-subtle);
    background: var(--surface-stone-raised);
    box-shadow: var(--shadow-surface);
    color: var(--text-on-stone);
    font-size: 0.75rem;
    line-height: 1;
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
    white-space: nowrap;
    transition: opacity var(--motion-duration-fast) var(--motion-easing-standard), transform var(--motion-duration-fast) var(--motion-easing-standard), visibility var(--motion-duration-fast) var(--motion-easing-standard);
}

.header-action:hover .header-action-label,
.header-action:focus-visible .header-action-label {
    transform: translate(-50%, 0);
    opacity: 1;
    visibility: visible;
}

.header-actions {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-self: end;
    gap: var(--space-2);
    min-width: 0;
    font-family: var(--font-family-interface);
}

.header-action {
    position: relative;
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 2.75rem;
    min-width: 2.75rem;
    height: 2.75rem;
    min-height: 2.75rem;
    padding: 0;
    border: var(--border-width-thin) solid transparent;
    border-radius: var(--radius-control);
    background: transparent;
    color: var(--text-on-stone);
    box-shadow: none;
    cursor: pointer;
    text-decoration: none;
    transition:
        border-color var(--motion-duration-fast) var(--motion-easing-standard),
        color var(--motion-duration-fast) var(--motion-easing-standard),
        filter var(--motion-duration-fast) var(--motion-easing-standard),
        transform var(--motion-duration-fast) var(--motion-easing-standard);
}

.header-action:hover {
    color: var(--surface-parchment-base);
    filter: brightness(1.12);
    transform: translateY(-1px);
}

.header-action:active {
    transform: translateY(1px) scale(0.96);
}

.header-action:focus-visible {
    outline: var(--border-width-strong) solid var(--color-accent-gold);
    outline-offset: var(--border-width-strong);
}

.header-logout-form {
    display: contents;
    margin: 0;
}

.header-action-icon {
    position: relative;
    display: block;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    pointer-events: none;
}

.header-action-messages .header-action-icon {
    width: 1.765rem;
    height: 1rem;
}

.header-action-notifications .header-action-icon {
    width: 1.4rem;
    height: 1.47rem;
}

.header-action-settings .header-action-icon {
    width: 1.55rem;
    height: 1.28rem;
}

.header-action::after {
    content: "";
    position: absolute;
    right: var(--space-2);
    bottom: 0.18rem;
    left: var(--space-2);
    height: var(--border-width-strong);
    transform: scaleX(0);
    background: var(--color-accent-gold);
    transition: transform var(--motion-duration-fast) var(--motion-easing-standard);
}

.header-action:hover::after,
.header-action:focus-visible::after {
    transform: scaleX(1);
}

.header-action-logout {
    overflow: visible;
}

.header-action-logout .header-action-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 2.28rem;
    height: auto;
    max-width: none;
    max-height: none;
    transform: translate(-50%, -50%);
}

@media (prefers-reduced-motion: reduce) {
    .header-action {
        transition-duration: 0.01ms;
    }
}

@media (max-width: 980px) {
    .site-brand {
        max-width: 36vw;
    }

    .site-crest {
        transform: translate(-50%, -50%) scale(0.84);
    }

}

@media (max-width: 760px) {
    .site-header {
        padding-inline: var(--space-4);
    }

    .site-brand {
        max-width: none;
    }

    .site-crest,
    .site-header::after {
        display: none;
    }

    .site-header::before {
        border-width: 0.42rem 0.75rem 0.46rem;
    }

}

@media (max-width: 520px) {
    .site-header {
        gap: var(--space-2);
        padding: var(--space-2) var(--space-3);
    }

    .site-brand {
        padding-inline: 0;
    }

    .site-brand {
        height: 3.65rem;
    }

    .header-actions {
        gap: var(--space-1);
    }

    .site-header::before {
        border-width: 0.34rem 0.56rem 0.38rem;
    }

}


/* Authenticated content parchment surfaces */
.theme-foundation .content-body {
    color: var(--text-ink);
    --color-text: var(--text-ink);
    --color-text-muted: var(--text-ink-muted);
    --color-text-soft: var(--text-ink-muted);
    --surface-panel: var(--surface-parchment-base);
    --surface-panel-strong: var(--surface-parchment-raised);
    --surface-panel-hover: color-mix(in srgb, var(--surface-parchment-raised) 82%, white);
    --border-soft: color-mix(in srgb, var(--color-accent-bronze) 48%, var(--surface-parchment-muted));
    --border-strong: color-mix(in srgb, var(--color-accent-bronze-dark) 54%, var(--surface-parchment-muted));
}

.theme-foundation .content-body .panel,
.theme-foundation .content-body .module-stat-bar,
.theme-foundation .content-body .theme-card {
    background-color: var(--surface-panel);
    background-image: url("../images/ui/surfaces/parchment-grain.svg");
    background-repeat: repeat;
    background-size: 96px 96px;
    border-color: var(--border-soft);
    box-shadow: var(--shadow-frame-inset), 0 8px 18px rgba(79, 48, 21, 0.14);
}

.theme-foundation .content-body .panel::before,
.theme-foundation .content-body .module-stat-bar::before {
    border-color: color-mix(in srgb, var(--color-accent-bronze) 30%, transparent);
}

.theme-foundation .content-body .module-stat-item,
.theme-foundation .content-body .module-stat-progress,
.theme-foundation .content-body .compact-definition-grid > div,
.theme-foundation .content-body dl > div {
    background: var(--surface-panel-strong);
    border-color: var(--border-soft);
    color: var(--text-ink);
}

.theme-foundation .content-body input,
.theme-foundation .content-body select,
.theme-foundation .content-body textarea {
    background: var(--surface-parchment-raised);
    border-color: var(--border-soft);
    color: var(--text-ink);
}

.theme-foundation .content-body th,
.theme-foundation .content-body td {
    border-color: var(--border-soft);
}

.theme-foundation .content-body th,
.theme-foundation .content-body .eyebrow,
.theme-foundation .content-body .quiet-note,
.theme-foundation .content-body .module-stat-item span,
.theme-foundation .content-body .module-stat-progress span,
.theme-foundation .content-body .dashboard-summary-card p,
.theme-foundation .content-body .dashboard-quick-action small {
    color: var(--text-ink-muted);
}

.theme-foundation .content-body .start-here-dashboard .dashboard-summary-card p {
    color: var(--text-ink);
}

.theme-foundation .content-body .start-here-dashboard .dashboard-quick-action small {
    color: var(--text-ink-muted);
}

/* Public authentication parchment surfaces */
.theme-foundation.auth-entry {
    --color-text: var(--text-ink);
    --color-text-muted: var(--text-ink-muted);
    --color-text-soft: var(--text-ink-muted);
    --surface-panel: var(--surface-parchment-base);
    --surface-panel-strong: var(--surface-parchment-raised);
    --border-soft: color-mix(in srgb, var(--color-accent-bronze) 48%, var(--surface-parchment-muted));
}

.theme-foundation.auth-entry .auth-lore-panel,
.theme-foundation.auth-entry .auth-entry-card {
    background-color: var(--surface-parchment-base);
    background-image: url("../images/ui/surfaces/parchment-grain.svg");
    background-repeat: repeat;
    background-size: 96px 96px;
    border-color: var(--border-soft);
    box-shadow: var(--shadow-frame-inset), 0 10px 22px rgba(79, 48, 21, 0.18);
    color: var(--text-ink);
}

.theme-foundation.auth-entry .auth-lore-panel p:not(.eyebrow),
.theme-foundation.auth-entry .auth-entry-card,
.theme-foundation.auth-entry .auth-note,
.theme-foundation.auth-entry .auth-switch-panel {
    color: var(--text-ink-muted);
}

.theme-foundation.auth-entry .auth-lore-panel h1,
.theme-foundation.auth-entry .auth-entry-card h1,
.theme-foundation.auth-entry .auth-intro h2,
.theme-foundation.auth-entry .auth-form label {
    color: var(--text-ink);
}

.theme-foundation.auth-entry .auth-ledger > div,
.theme-foundation.auth-entry .auth-intro,
.theme-foundation.auth-entry .auth-switch-panel {
    background-color: var(--surface-parchment-raised);
    background-image: url("../images/ui/surfaces/parchment-grain.svg");
    background-repeat: repeat;
    background-size: 96px 96px;
    border: var(--border-width-thin) solid var(--border-soft);
    border-radius: var(--radius-md);
    padding: var(--space-md);
}

.theme-foundation.auth-entry .auth-ledger dt,
.theme-foundation.auth-entry .auth-intro p:not(.eyebrow),
.theme-foundation.auth-entry .auth-ledger dd {
    color: var(--text-ink-muted);
}

.theme-foundation.auth-entry .auth-form input {
    background: var(--surface-parchment-raised);
    border-color: var(--border-soft);
    color: var(--text-ink);
}

.theme-foundation.auth-entry .auth-form input:focus {
    border-color: var(--color-accent-bronze);
    outline: var(--border-width-strong) solid color-mix(in srgb, var(--color-accent-gold) 45%, transparent);
    outline-offset: var(--space-1);
}

.theme-foundation.auth-entry .auth-form button {
    border-color: rgba(187, 145, 67, 0.42);
    background: linear-gradient(180deg, var(--foundation-button-primary-top), var(--foundation-button-primary-bottom));
    color: #f6eedf;
}

.theme-foundation.auth-entry .auth-switch-panel a {
    color: var(--color-accent-bronze-dark);
    text-decoration-thickness: var(--border-width-strong);
    text-underline-offset: var(--space-1);
}

.theme-foundation.auth-entry .form-error {
    color: #7a201b;
    font-weight: 700;
}

.theme-foundation.auth-entry .flash {
    border-color: var(--border-soft);
    background: var(--surface-parchment-raised);
    box-shadow: 0 6px 14px rgba(79, 48, 21, 0.12);
    color: var(--text-ink);
}

.theme-foundation.auth-entry .flash-success {
    border-left-color: var(--state-success-border);
    background: color-mix(in srgb, var(--state-success-border) 12%, var(--surface-parchment-raised));
}

.theme-foundation.auth-entry .flash-error {
    border-left-color: var(--state-danger-border);
    background: color-mix(in srgb, var(--state-danger-border) 12%, var(--surface-parchment-raised));
}

.theme-foundation.auth-entry .flash-notice {
    border-left-color: var(--state-information-border);
    background: color-mix(in srgb, var(--state-information-border) 12%, var(--surface-parchment-raised));
}

/* Authenticated content hierarchy and neutral metadata contrast */
.theme-foundation .content-body {
    background-color: var(--surface-parchment-canvas);
    background-image:
        url("../images/ui/surfaces/parchment-grain.svg"),
        radial-gradient(circle at 12% 0%, rgba(255, 249, 224, 0.26), transparent 26rem);
    background-repeat: repeat, no-repeat;
    background-size: 96px 96px, auto;
    --border-soft: color-mix(in srgb, var(--color-accent-bronze) 62%, var(--surface-parchment-muted));
    --border-strong: color-mix(in srgb, var(--color-accent-bronze-dark) 68%, var(--surface-parchment-muted));
}

.theme-foundation .content-body .panel,
.theme-foundation .content-body .module-stat-bar,
.theme-foundation .content-body .theme-card {
    background-color: var(--surface-parchment-base);
    background-image: url("../images/ui/surfaces/parchment-grain.svg");
    border-color: var(--border-strong);
}

.theme-foundation .content-body .module-stat-item,
.theme-foundation .content-body .module-stat-progress,
.theme-foundation .content-body .compact-definition-grid > div,
.theme-foundation .content-body dl > div {
    background-color: var(--surface-parchment-raised);
    background-image: url("../images/ui/surfaces/parchment-grain.svg");
    border-color: var(--border-soft);
}

.theme-foundation .content-body .exploration-status-strip span,
.theme-foundation .content-body .exploration-definition-grid dt,
.theme-foundation .content-body .travel-timer-card span,
.theme-foundation .content-body .travel-timer-card small,
.theme-foundation .content-body dt,
.theme-foundation .content-body .module-stat-item span,
.theme-foundation .content-body .module-stat-progress span,
.theme-foundation .content-body th,
.theme-foundation .content-body label,
.theme-foundation .content-body .eyebrow,
.theme-foundation .content-body .quiet-note {
    color: var(--text-ink-muted);
}

.theme-foundation .content-body .training-target-header span,
.theme-foundation .content-body .shop-stock-header span,
.theme-foundation .content-body .theme-pill {
    border-color: var(--border-strong);
    background: var(--surface-parchment-raised);
    color: var(--text-ink-muted);
}

/* Guest home login */
.theme-foundation .content-body .home-login-panel {
    display: grid;
    gap: var(--space-md);
}

.theme-foundation .content-body .home-login-intro {
    display: grid;
    gap: var(--space-2);
    max-width: 58ch;
}

.theme-foundation .content-body .home-login-intro h2,
.theme-foundation .content-body .home-login-intro p {
    margin: 0;
}

.theme-foundation .content-body .home-login-intro p:not(.eyebrow) {
    color: var(--text-ink-muted);
}

.theme-foundation .content-body .home-login-panel .auth-form {
    max-width: 34rem;
}

.theme-foundation .content-body .home-login-panel .auth-form button {
    border-color: rgba(187, 145, 67, 0.42);
    background: linear-gradient(180deg, var(--foundation-button-primary-top), var(--foundation-button-primary-bottom));
    color: #f6eedf;
}

/* Shared parchment navigation and filter bars */
.parchment-button-bar {
    display: block;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    margin: var(--space-md) 0;
    padding: 0.35rem;
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-md);
    background: var(--surface-parchment-raised);
}

.parchment-button-group {
    display: flex;
    width: 100%;
    min-width: 0;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.parchment-nav-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    flex: 0 0 auto;
    min-height: 2.5rem;
    padding: 0.5rem 0.85rem;
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-control);
    background: var(--surface-parchment-base);
    color: var(--text-ink);
    font-family: var(--font-family-interface);
    font-size: 0.86rem;
    font-weight: 750;
    text-decoration: none;
}

.parchment-nav-button:hover,
.parchment-nav-button:focus-visible {
    border-color: var(--color-accent-gold-muted);
    background: color-mix(in srgb, var(--surface-parchment-raised) 82%, white);
    outline: 2px solid var(--color-accent-gold-muted);
    outline-offset: 2px;
}

.parchment-nav-button.is-active,
.parchment-nav-button[aria-current="page"] {
    border-color: color-mix(in srgb, var(--state-success-border) 65%, var(--color-accent-bronze));
    background: color-mix(in srgb, var(--state-success-border) 16%, var(--surface-parchment-raised));
    box-shadow: inset 0 -3px 0 color-mix(in srgb, var(--state-success-border) 72%, var(--color-accent-bronze-dark));
    color: var(--text-ink);
}

.parchment-nav-button:disabled,
.parchment-nav-button[aria-disabled="true"] {
    cursor: not-allowed;
    opacity: 0.58;
}

.parchment-button-badge {
    min-width: 1.35rem;
    padding: 0.08rem 0.35rem;
    border-radius: 999px;
    background: rgba(91, 75, 48, 0.12);
    color: var(--text-ink-muted);
    font-size: 0.78rem;
    font-variant-numeric: tabular-nums;
    text-align: center;
}

.parchment-nav-button.is-active .parchment-button-badge,
.parchment-nav-button[aria-current="page"] .parchment-button-badge {
    background: rgba(77, 104, 70, 0.16);
    color: currentColor;
}

@media (max-width: 520px) {
    .parchment-button-bar { padding: 0.3rem; }
    .parchment-button-group { gap: 0.3rem; }
    .parchment-nav-button { min-height: 2.35rem; padding: 0.45rem 0.7rem; }
}

.skills-tabs,
.inventory-tabs {
    margin: var(--space-md) 0;
}

.skills-summary-grid, .skills-overview-grid { display: grid; gap: var(--space-md); margin: var(--space-md) 0; }
.skills-summary-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.skills-summary-card { min-width: 0; padding: var(--space-md); }
.skills-summary-card p, .skills-summary-card strong { margin: 0; overflow-wrap: anywhere; }
.skills-summary-card p { color: var(--text-ink-muted); font-size: 0.8rem; text-transform: uppercase; }
.skills-summary-card strong { display: block; margin-top: 0.35rem; font-size: 1.1rem; }
.skills-overview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.skills-overview-panel { display: grid; gap: var(--space-sm); min-width: 0; }
.skills-panel-heading p, .skills-panel-heading h2 { margin: 0; }
.skills-panel-heading h2 { font-size: 1.1rem; }
.skills-leading-list { display: grid; gap: 0.45rem; margin: 0; padding: 0; list-style: none; }
.skills-leading-list li { display: grid; grid-template-columns: minmax(0, 1fr) minmax(4rem, 1fr) auto; gap: 0.6rem; align-items: center; }
.skills-leading-list li > span:first-child { display: grid; min-width: 0; }
.skills-leading-list small { color: var(--text-ink-muted); }
.skills-mini-progress, .skills-progress-track { display: block; height: 0.5rem; overflow: hidden; border: 1px solid var(--border-soft); border-radius: 999px; background: var(--surface-stone-base); }
.skills-mini-progress span, .skills-progress-track span { display: block; height: 100%; background: linear-gradient(90deg, var(--color-accent-bronze), var(--color-accent-gold)); }
.skills-category-panel { display: grid; gap: var(--space-md); min-width: 0; margin-top: var(--space-md); }
.skills-category-heading { display: flex; flex-wrap: wrap; gap: var(--space-md); align-items: center; justify-content: space-between; border-bottom: 1px solid var(--border-soft); padding-bottom: var(--space-sm); }
.skills-category-heading p, .skills-category-heading h2 { margin: 0; }
.skills-sort { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.skills-sort span, .skills-sort a { font-size: 0.86rem; }
.skills-sort a[aria-current="true"] { color: var(--color-accent-bronze); font-weight: 700; }
.skills-row-list { display: grid; gap: 0.5rem; min-width: 0; }
.skills-row { display: grid; grid-template-columns: auto minmax(11rem, 1.3fr) minmax(6rem, 0.55fr) minmax(10rem, 1fr); gap: 0.75rem; align-items: center; min-width: 0; padding: 0.75rem; border: 1px solid var(--border-soft); border-radius: var(--radius-control); background: var(--surface-parchment-raised); }
.skills-emblem { display: grid; width: 2.35rem; height: 2.35rem; place-items: center; border: 1px solid var(--border-strong); border-radius: 50%; background: var(--surface-stone-base); color: var(--color-accent-gold); font-weight: 700; }
.skills-emblem-image { width: 100%; height: 100%; object-fit: contain; border-radius: inherit; }
.notification-identity { display: inline-flex; gap: .35rem; align-items: center; }.notification-identity-glyph { color: var(--color-accent-gold); font-weight: 700; }
.skills-emblem--harvesting { background: #4a4637; }.skills-emblem--crafting { background: #514234; }
.skills-row-name, .skills-row-progress { min-width: 0; }
.skills-row-name h3, .skills-row-name p { margin: 0; overflow-wrap: anywhere; }
.skills-row-name p, .skills-row-progress small { color: var(--text-ink-muted); font-size: 0.82rem; }
.skills-row-level { display: grid; gap: 0.2rem; }.skills-row-level small { color: var(--color-accent-bronze); font-weight: 700; }
.skills-row-progress { display: grid; gap: 0.35rem; }
@media (max-width: 980px) { .skills-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.skills-row { grid-template-columns: auto minmax(0, 1fr); }.skills-row-progress { grid-column: 2; } }
@media (max-width: 600px) { .skills-summary-grid, .skills-overview-grid { grid-template-columns: 1fr; }.skills-leading-list li { grid-template-columns: minmax(0, 1fr) minmax(3.5rem, 0.7fr) auto; }.skills-row { grid-template-columns: auto minmax(0, 1fr); }.skills-row-level { grid-column: 2; }.skills-row-progress { grid-column: 1 / -1; } }

.inventory-controls,
.inventory-list-detail-layout,
.inventory-equipment-layout { margin-top: var(--space-md); }

.inventory-controls {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
    align-items: end;
}

.inventory-controls label { display: grid; gap: 0.35rem; min-width: min(100%, 13rem); }
.inventory-controls button { min-height: 2.7rem; }

.inventory-list-detail-layout {
    display: grid;
    grid-template-columns: minmax(16rem, 0.9fr) minmax(19rem, 1.1fr);
    gap: var(--space-md);
    align-items: start;
}

.inventory-panel-heading { margin-bottom: var(--space-sm); }
.inventory-panel-heading h2,
.inventory-panel-heading p { margin: 0; }
.inventory-panel-heading p { margin-bottom: 0.3rem; }

.inventory-item-list { display: grid; gap: 0.5rem; }

.inventory-item-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) minmax(0, 0.8fr);
    gap: 0.7rem;
    align-items: center;
    padding: 0.65rem;
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-control);
    background: var(--surface-parchment-raised);
    color: var(--text-ink);
    text-decoration: none;
}

.inventory-item-row:hover,
.inventory-item-row:focus-visible,
.inventory-item-row.is-selected {
    border-color: var(--color-accent-bronze);
    box-shadow: inset 0 0 0 1px rgba(187, 145, 67, 0.2);
}

.inventory-item-row span:not(.item-icon) { display: grid; gap: 0.18rem; }
.inventory-item-row small { color: var(--text-ink-muted); }

.inventory-detail-panel { min-width: 0; }
.inventory-detail-panel > .item-icon { margin-bottom: var(--space-sm); }

.inventory-detail-list {
    display: grid;
    gap: 0.5rem;
    margin: var(--space-md) 0;
}

.inventory-detail-list > div {
    display: flex;
    justify-content: space-between;
    gap: var(--space-md);
    padding: 0.55rem 0.65rem;
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-control);
    background: var(--surface-parchment-raised);
}

.inventory-detail-list dt { color: var(--text-ink-muted); }
.inventory-detail-list dd { margin: 0; font-weight: 700; }
.inventory-effect-list { margin: 0 0 var(--space-md); padding-left: 1.2rem; }
.inventory-comparison { padding-top: var(--space-sm); border-top: 1px solid var(--border-soft); }

.equipment-loadout-stage {
    position: relative;
    display: grid;
    min-height: 25rem;
    place-items: center;
    margin-block: var(--space-sm);
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-md);
    background: radial-gradient(circle, rgba(187, 145, 67, 0.15), transparent 62%), var(--surface-parchment-raised);
}

.equipment-silhouette {
    display: grid;
    width: 8rem;
    height: 14rem;
    place-items: end center;
    padding-bottom: 1.3rem;
    border: 0.5rem solid rgba(80, 64, 46, 0.58);
    border-radius: 48% 48% 24% 24%;
    background: linear-gradient(180deg, rgba(60, 66, 71, 0.75), rgba(32, 36, 39, 0.92));
    color: var(--surface-parchment-base);
    font-size: 0.72rem;
    text-transform: uppercase;
}

.equipment-slot-ring { position: absolute; inset: 0.75rem; }

.equipment-loadout-slot {
    position: absolute;
    display: grid;
    width: min(38%, 9.5rem);
    gap: 0.2rem;
    padding: 0.45rem;
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-control);
    background: var(--surface-parchment-base);
    color: var(--text-ink);
    font-size: 0.75rem;
    text-decoration: none;
}

.equipment-loadout-slot span { color: var(--text-ink-muted); font-size: 0.68rem; text-transform: uppercase; }
.equipment-loadout-slot.is-equipped { border-color: var(--color-accent-bronze); }
.equipment-loadout-slot:nth-child(1) { top: 4%; left: 2%; }
.equipment-loadout-slot:nth-child(2) { top: 30%; left: 2%; }
.equipment-loadout-slot:nth-child(3) { bottom: 7%; left: 2%; }
.equipment-loadout-slot:nth-child(4) { top: 19%; right: 2%; }
.equipment-loadout-slot:nth-child(5) { bottom: 20%; right: 2%; }

.inventory-empty-state { margin-top: var(--space-md); }

@media (max-width: 1080px) {
    .inventory-detail-panel { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
    .inventory-list-detail-layout { grid-template-columns: 1fr; }
    .inventory-detail-panel { grid-column: auto; }
    .inventory-item-row { grid-template-columns: auto minmax(0, 1fr); }
    .inventory-item-row > small { grid-column: 2; }
    .equipment-loadout-stage { min-height: 22rem; }
}

/* Inventory selection and loadout refinements */
.inventory-controls label:first-of-type { min-width: 0; width: min(100%, 18rem); }
.inventory-controls input[type="search"] { width: 100%; }

.inventory-list-detail-layout > *,
.inventory-loadout-panel,
.inventory-owned-equipment,
.inventory-detail-panel,
.inventory-item-row,
.inventory-item-row > span { min-width: 0; }

.inventory-owned-equipment-row {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
}

.inventory-owned-equipment-row > small {
    grid-column: 2;
    overflow-wrap: anywhere;
}

.inventory-item-row strong,
.inventory-item-row small,
.inventory-detail-panel p,
.inventory-detail-panel li,
.inventory-detail-list dd { overflow-wrap: anywhere; }

.inventory-detail-panel .inline-action-form,
.inventory-detail-panel .inline-action-form button { max-width: 100%; }

.equipment-loadout-stage { min-width: 0; min-height: 31rem; overflow: hidden; }
.equipment-slot-ring { min-width: 0; }

.equipment-slot-ring .equipment-loadout-slot {
    width: min(31%, 9.5rem);
    min-width: 0;
    overflow: hidden;
}

.equipment-loadout-slot strong { overflow-wrap: anywhere; }
.equipment-loadout-slot.is-selected { box-shadow: inset 0 0 0 2px var(--color-accent-bronze); }

.equipment-slot-ring .equipment-loadout-slot--helmet { top: 2%; left: 50%; transform: translateX(-50%); }
.equipment-slot-ring .equipment-loadout-slot--necklace { top: 14%; left: 4%; }
.equipment-slot-ring .equipment-loadout-slot--cape { top: 14%; right: 4%; }
.equipment-slot-ring .equipment-loadout-slot--weapon { top: 31%; left: 2%; }
.equipment-slot-ring .equipment-loadout-slot--body { top: 31%; left: 50%; transform: translateX(-50%); }
.equipment-slot-ring .equipment-loadout-slot--shield { top: 31%; right: 2%; }
.equipment-slot-ring .equipment-loadout-slot--hands { top: 49%; left: 3%; }
.equipment-slot-ring .equipment-loadout-slot--ring { top: 49%; right: 3%; }
.equipment-slot-ring .equipment-loadout-slot--legs { bottom: 4%; left: 7%; }
.equipment-slot-ring .equipment-loadout-slot--feet { bottom: 4%; right: 7%; }

@media (max-width: 760px) {
    .inventory-controls label:first-of-type { width: 100%; }
    .equipment-loadout-stage { min-height: 34rem; }
    .equipment-slot-ring .equipment-loadout-slot { width: min(34%, 9.5rem); font-size: 0.69rem; }
    .equipment-slot-ring .equipment-loadout-slot--necklace { left: 1%; }
    .equipment-slot-ring .equipment-loadout-slot--cape { right: 1%; }
    .equipment-slot-ring .equipment-loadout-slot--weapon { left: 1%; }
    .equipment-slot-ring .equipment-loadout-slot--shield { right: 1%; }
    .equipment-slot-ring .equipment-loadout-slot--hands { left: 1%; }
    .equipment-slot-ring .equipment-loadout-slot--ring { right: 1%; }
}

/* Carried item panel and inline selection details */
.inventory-items-panel {
    display: grid;
    gap: var(--space-md);
    min-width: 0;
    margin-top: var(--space-md);
}

.inventory-items-panel-header {
    display: flex;
    gap: var(--space-md);
    align-items: center;
    justify-content: space-between;
    min-width: 0;
    padding-bottom: var(--space-sm);
    border-bottom: 1px solid var(--border-soft);
}

.inventory-items-panel-header h2 { min-width: 0; margin: 0; }
.inventory-inline-search { display: flex; flex: 0 1 18rem; gap: 0.4rem; align-items: center; min-width: 0; margin: 0; }
.inventory-inline-search input[type="search"] { width: 100%; min-width: 0; }
.inventory-clear-search { flex: 0 0 auto; white-space: nowrap; }
.inventory-inline-search .visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.inventory-items-panel .inventory-item-list {
    display: grid;
    gap: 0.5rem;
    min-width: 0;
}

.inventory-inline-detail {
    display: grid;
    gap: var(--space-sm);
    min-width: 0;
    padding: var(--space-md);
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-control);
    background: var(--surface-parchment-raised);
    box-shadow: var(--shadow-frame-inset);
}

.inventory-inline-detail-heading {
    display: flex;
    gap: var(--space-sm);
    align-items: center;
    min-width: 0;
}

.inventory-inline-detail-heading h3 {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
}

.inventory-inline-detail .item-icon--large {
    width: 3.25rem;
    height: 3.25rem;
    flex: 0 0 3.25rem;
    font-size: 1.3rem;
}

.inventory-inline-detail p { min-width: 0; margin: 0; overflow-wrap: anywhere; }
.inventory-inline-detail .inventory-detail-list { margin: 0; }
.inventory-inline-detail-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.inventory-inline-detail-meta-card {
    display: grid;
    flex: 0 1 auto;
    min-width: 7rem;
    gap: 0.15rem;
    padding: 0.45rem 0.6rem;
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-control);
    background: var(--surface-parchment-base);
}

.inventory-inline-detail-meta-card dt { font-size: 0.72rem; }
.inventory-inline-detail-meta-card dd { margin: 0; overflow-wrap: anywhere; }
.inventory-inline-detail .inline-action-form,
.inventory-inline-detail .inline-action-form button { max-width: 100%; }

@media (max-width: 600px) {
    .inventory-items-panel-header {
        display: grid;
        gap: var(--space-sm);
        align-items: start;
    }

    .inventory-inline-search { width: 100%; flex-wrap: wrap; }
    .inventory-inline-search input[type="search"] { flex: 1 1 12rem; }
    .inventory-inline-detail { padding: var(--space-sm); }
    .inventory-inline-detail .inventory-detail-list > div {
        grid-template-columns: minmax(0, 1fr) auto;
    }
}

.inventory-equipment-list-panel .inventory-item-list {
    display: grid;
    gap: 0.5rem;
}

.inventory-equipment-list-panel .inventory-owned-equipment-row {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
}

.inventory-equipment-list-panel .inventory-owned-equipment-row > small {
    grid-column: 2;
    min-width: 0;
    overflow-wrap: anywhere;
}

.inventory-equipment-inline-detail {
    min-width: 0;
    overflow: hidden;
}

.inventory-equipment-inline-detail .inventory-effect-list,
.inventory-equipment-inline-detail .inventory-comparison {
    min-width: 0;
    overflow-wrap: anywhere;
}

@media (max-width: 680px) {
    .theme-foundation .content-body .home-login-panel {
        gap: var(--space-3);
    }
}

/* Shared authenticated content banner */
.theme-foundation .content-body .content-page-banner {
    isolation: isolate;
    position: relative;
    display: grid;
    box-sizing: border-box;
    align-items: center;
    min-height: 18rem;
    aspect-ratio: 25 / 8;
    overflow: hidden;
    border-color: rgba(230, 190, 98, 0.28);
    background: var(--surface-parchment-base);
    box-shadow: var(--shadow-frame-inset), 0 8px 18px rgba(79, 48, 21, 0.14);
}

.content-page-banner::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(201, 163, 109, 0.97) 0%, rgba(201, 163, 109, 0.84) 35%, rgba(201, 163, 109, 0.26) 58%, rgba(56, 45, 29, 0.06) 100%);
}

.content-page-banner--overlay-none::after {
    background: transparent;
}

.content-page-banner--compact {
    min-height: 15rem;
}

.content-page-banner-media {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.content-page-banner-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: right center;
}

.content-page-banner--image-left .content-page-banner-media img {
    object-position: left center;
}

.content-page-banner--image-center .content-page-banner-media img {
    object-position: center center;
}

.content-page-banner-copy {
    position: relative;
    z-index: 2;
    display: grid;
    gap: 0.45rem;
    align-content: start;
    align-items: start;
    justify-items: start;
    text-align: left;
    width: min(36%, 24rem);
    padding: 28px;
    color: var(--text-ink);
}

.content-page-banner-copy h1,
.content-page-banner-copy p {
    margin: 0;
    color: var(--text-ink);
}

.content-page-banner-copy h1 {
    font-size: clamp(1.55rem, 3vw, 2.25rem);
    line-height: 1.08;
}

/* Item Market browsing workspace */
.item-market-tabs { margin-bottom: 0; }
.inventory-heading-actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); align-items: center; margin-left: auto; }
.inventory-heading-actions .inventory-heading-action { margin: 0; }
.inventory-heading-actions .inline-action-form { display: contents; }
.inventory-heading-actions .inventory-use-action {
    border-color: rgba(72, 119, 164, 0.72);
    background: linear-gradient(180deg, var(--foundation-button-primary-top), var(--foundation-button-primary-bottom));
    color: #f6eedf;
}
.inventory-heading-actions .inventory-use-action:not(:disabled):hover,
.inventory-heading-actions .inventory-use-action:not(:disabled):focus-visible {
    background: linear-gradient(180deg, #1f4468, #0c2740);
    color: #fff5df;
    outline: 2px solid var(--color-accent-gold);
    outline-offset: 2px;
}
.inventory-heading-actions .inventory-use-action:disabled {
    cursor: not-allowed;
    opacity: 0.58;
    border-color: rgba(72, 119, 164, 0.56);
    background: linear-gradient(180deg, var(--foundation-button-primary-top), var(--foundation-button-primary-bottom));
    color: rgba(246, 238, 223, 0.78);
    outline: none;
}
[data-market-browse-region].is-loading { opacity: 0.55; pointer-events: none; }
.item-market-workspace,
.item-market-item-summary,
.item-market-listings-panel {
    display: grid;
    gap: var(--space-md);
}

.item-market-toolbar,
.item-market-filter-form,
.item-market-item-summary,
.item-market-listings-panel {
    min-width: 0;
}

.item-market-toolbar { display: grid; gap: var(--space-sm); }
.item-market-category-tabs,
.item-market-filter-form { margin: 0; }
.item-market-filter-controls { align-items: end; }
.item-market-filter-form label { display: grid; gap: 0.25rem; }
.item-market-item-summary h2,
.item-market-listings-panel h2 { margin: 0; }
.item-market-card-heading { display: flex; gap: var(--space-sm); align-items: center; min-width: 0; }
.item-market-card-heading > div { min-width: 0; }
.item-market-card-heading .eyebrow { margin: 0 0 0.2rem; }
.item-market-stat-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-sm); margin: 0; }
.item-market-stat-grid > div { min-width: 0; padding: 0.5rem; border: 1px solid var(--border-soft); border-radius: var(--radius-subtle); background: var(--surface-parchment-base); }
.item-market-stat-grid dt { font-size: 0.72rem; color: var(--text-ink-muted); }
.item-market-stat-grid dd { margin: 0.15rem 0 0; overflow-wrap: anywhere; }
.item-market-empty-state { margin: 0; padding: var(--space-lg); text-align: center; color: var(--text-ink-muted); }
/* Shared responsive data-table foundation */
.responsive-data-table-wrap {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.theme-foundation .responsive-data-table {
    display: table;
    width: 100%;
    max-width: none;
    min-width: 0;
    overflow: visible;
    border-collapse: collapse;
}

.responsive-data-table th,
.responsive-data-table td {
    text-align: left;
    vertical-align: middle;
}

.responsive-data-table-item {
    display: flex;
    gap: var(--space-sm);
    align-items: center;
    min-width: 0;
}

.responsive-data-table-action {
    text-align: right;
    white-space: nowrap;
}

@media (max-width: 700px) {
    .theme-foundation .responsive-data-table {
        display: block;
        min-width: 0;
        overflow: visible;
    }

    .responsive-data-table thead {
        display: none;
    }

    .responsive-data-table,
    .responsive-data-table tbody,
    .responsive-data-table tr,
    .responsive-data-table td {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }

    .responsive-data-table tr {
        padding: var(--space-sm) 0;
    }

    .responsive-data-table td {
        display: grid;
        grid-template-columns: minmax(7rem, 0.8fr) minmax(0, 1.2fr);
        gap: var(--space-sm);
        min-width: 0;
        padding: 0.35rem 0;
        border: 0;
    }

    .responsive-data-table td::before {
        display: block;
        content: attr(data-label);
    }

    .responsive-data-table-action {
        white-space: normal;
    }
}

.item-market-listing-table th,
.item-market-listing-table td { padding: 0.7rem; border-bottom: 1px solid var(--border-soft); }
.item-market-listing-table th { color: var(--text-ink-muted); font-size: 0.74rem; letter-spacing: 0.06em; text-transform: uppercase; }
.item-market-listing-table td::before { color: var(--text-ink-muted); font-size: 0.72rem; text-transform: uppercase; }

.theme-foundation .content-body .item-market-workspace {
    color: var(--text-ink);
    background: var(--surface-parchment-base);
    background-image: url("../images/ui/surfaces/parchment-grain.svg");
    border-color: var(--border-strong);
    box-shadow: var(--shadow-frame-inset), 0 8px 18px rgba(79, 48, 21, 0.14);
}

.item-market-browse-table {
    color: var(--text-ink);
    background: var(--surface-parchment-base);
}

.item-market-browse-table thead {
    background: var(--surface-parchment-raised);
}

.item-market-browse-table th,
.item-market-browse-table td {
    border-color: var(--border-soft);
}

.item-market-browse-table .item-market-table-item {
    color: var(--text-ink);
}

.item-market-browse-table .item-market-table-item small {
    color: var(--text-ink-muted);
}

.item-market-workspace .item-market-filter-form input,
.item-market-workspace .item-market-filter-form select {
    border-color: var(--border-soft);
    background: var(--surface-parchment-base);
    color: var(--text-ink);
}

.item-market-browse-table .responsive-data-table-action .button-link {
    border-color: rgba(72, 119, 164, 0.72);
    background: linear-gradient(180deg, var(--foundation-button-primary-top), var(--foundation-button-primary-bottom));
    color: #f6eedf;
}

.item-market-browse-table .responsive-data-table-action .button-link:hover,
.item-market-browse-table .responsive-data-table-action .button-link:focus-visible {
    background: linear-gradient(180deg, #1f4468, #0c2740);
    color: #fff5df;
}

/* Item Market transactions and Inventory gifting */
.item-market-transaction-panel,
.item-market-management-panel,
.inventory-gift-panel { display: grid; gap: var(--space-md); }
.inventory-gift-recipient-context { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-md); }
.inventory-gift-recipient-context h2,
.inventory-gift-recipient-context p { margin: 0; }
.inventory-gift-recipient-context > div { display: grid; gap: 0.25rem; }
.inventory-gift-recipient { display: grid; gap: 0.25rem; padding: 0.65rem 0.75rem; border: 1px solid var(--border-soft); border-radius: var(--radius-control); background: var(--surface-parchment-base); }
.inventory-gift-recipient span { color: var(--text-ink-muted); font-family: var(--font-family-interface); font-size: 0.76rem; font-weight: 800; }
.inventory-gift-recipient strong { overflow-wrap: anywhere; }
.item-market-transaction-panel > *,
.item-market-management-panel > *,
.inventory-gift-panel > * { margin: 0; }
.inventory-gift-form { display: grid; gap: var(--space-sm); min-width: 0; padding: var(--space-md); border: 1px solid var(--border-soft); border-radius: var(--radius-control); background: var(--surface-parchment-raised); }
.inventory-gift-item-heading h3,
.inventory-gift-item-heading p { margin: 0; }
.inventory-gift-form label { display: grid; gap: 0.25rem; }
.item-market-receipt-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.5rem; margin: 0; }
.item-market-receipt-grid > div { min-width: 0; padding: 0.5rem; border: 1px solid var(--border-soft); border-radius: var(--radius-subtle); background: var(--surface-parchment-base); }
.item-market-receipt-grid dt { color: var(--text-ink-muted); font-size: 0.72rem; }
.item-market-receipt-grid dd { margin: 0.15rem 0 0; overflow-wrap: anywhere; }
.item-market-warning,
.inventory-gift-warning { padding: 0.65rem 0.75rem; border-left: 3px solid var(--accent-gold); border-radius: var(--radius-subtle); background: var(--surface-parchment-muted); color: var(--text-ink-muted); }
.item-market-transaction-actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); align-items: center; }
.item-market-transaction-actions form { margin: 0; }
.item-market-purchase-form { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 0.5rem; margin: 0; }
.item-market-purchase-quantity { width: 4.25rem; max-width: 100%; box-sizing: border-box; }
.item-market-management-table .item-market-table-item { display: flex; gap: var(--space-sm); align-items: center; min-width: 12rem; }
.item-market-table-item > div { display: grid; gap: 0.2rem; min-width: 0; }
.item-market-table-item small { color: var(--text-ink-muted); overflow-wrap: anywhere; }
.item-market-management-table .inline-action-form { margin: 0; }
.item-market-bulk-listings,
.item-market-bulk-form,
.item-market-bulk-review { display: grid; gap: var(--space-md); }
.item-market-bulk-heading > div { display: grid; gap: 0.35rem; }
.item-market-bulk-heading h2,
.item-market-bulk-heading p { margin: 0; }
.item-market-bulk-actions { display: flex; justify-content: flex-end; }
.item-market-add-table .item-market-add-col-item { width: 35%; }
.item-market-add-table .item-market-add-col-owned { width: 1%; white-space: nowrap; }
.item-market-add-table .item-market-add-col-reference { width: 38%; }
.item-market-add-table .item-market-add-col-quantity { width: 12%; }
.item-market-add-table .item-market-add-col-price { width: 14%; }
.item-market-add-table .item-market-table-item { display: flex; gap: var(--space-sm); align-items: flex-start; min-width: 0; }
.item-market-add-table th:nth-child(2),
.item-market-add-table td:nth-child(2) { white-space: nowrap; }
.item-market-add-table td[data-label="Quantity"],
.item-market-add-table td[data-label="Unit price"] { text-align: right; }
.item-market-add-table td[data-label="Quantity"] input,
.item-market-add-table td[data-label="Unit price"] input { margin-left: auto; }
.item-market-quantity-input { width: 4.25rem; max-width: 100%; box-sizing: border-box; }
.item-market-price-input { width: 6.5rem; max-width: 100%; box-sizing: border-box; }
.item-market-item-name { display: block; max-width: 100%; margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; color: inherit; font: inherit; text-align: left; overflow-wrap: anywhere; }
.item-market-item-name:hover,
.item-market-item-name:focus-visible { background: transparent; box-shadow: none; color: var(--text-link); }
.item-market-item-name:focus-visible { outline: 2px solid var(--color-accent-gold); outline-offset: 2px; }
.item-market-browse-table .item-market-table-item { min-width: 16rem; }
.item-market-browse-table .item-market-table-item small { display: block; max-width: 34rem; color: var(--text-ink-muted); overflow-wrap: anywhere; }
.item-market-confirm-button {
    min-height: 2.75rem;
    border: 1px solid rgba(149, 194, 157, 0.48);
    border-radius: var(--radius-control);
    background: linear-gradient(180deg, #315b43, #1d3929);
    color: #f4f0df;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), inset 0 0 0 1px rgba(0, 0, 0, 0.16), 0 6px 12px rgba(0, 0, 0, 0.2);
    cursor: pointer;
    font: inherit;
    font-weight: 800;
    padding: 0.75rem 1rem;
}
.item-market-confirm-button:hover { background: linear-gradient(180deg, #3d7051, #254a34); color: #fff5df; }
.item-market-confirm-button:focus-visible { outline: 2px solid var(--color-accent-gold); outline-offset: 2px; }
.item-market-confirm-button:active { transform: translateY(1px); box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.18), 0 3px 7px rgba(0, 0, 0, 0.2); }
.item-market-add-table-row.is-unavailable { color: var(--text-ink-muted); }
.item-market-add-table-row.has-incomplete-listing { background: var(--surface-parchment-muted); }
.item-market-add-detail-row[hidden] { display: none; }
.item-market-add-detail-row td { padding: var(--space-md); background: var(--surface-parchment-raised); }
.item-market-add-detail-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-sm); margin: 0; }
.item-market-add-detail-grid > div { min-width: 0; }
.item-market-add-detail-grid dt { color: var(--text-ink-muted); font-size: 0.72rem; }
.item-market-add-detail-grid dd { margin: 0.15rem 0 0; overflow-wrap: anywhere; }
.item-market-row-error { display: block; max-width: 12rem; margin-top: 0.3rem; color: var(--text-danger, #7a241f); font-size: 0.75rem; }
.item-market-row-error[hidden] { display: none; }
.item-market-review-table .item-market-table-item { min-width: 11rem; }
.item-market-bulk-summary { margin-top: 0; }
.inventory-gift-item-heading { display: flex; gap: var(--space-sm); align-items: center; min-width: 0; }
.inventory-gift-item-heading > div { display: grid; gap: 0.25rem; min-width: 0; }
.inventory-gift-form { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: end; }
.inventory-gift-form button { grid-column: 1 / -1; justify-self: start; }

@media (max-width: 700px) {
    .item-market-filter-form > * { max-width: 100%; }
    .item-market-filter-form input,
    .item-market-filter-form select { width: 100%; box-sizing: border-box; }
    .item-market-listing-table tr { border-bottom: 1px solid var(--border-soft); }
    .item-market-stat-grid { grid-template-columns: 1fr; }
    .item-market-purchase-table td[data-label="Purchase"] .item-market-purchase-form { justify-content: flex-start; }
    .item-market-add-detail-row td { display: block; padding: var(--space-sm); }
    .item-market-add-detail-row td::before { content: none; }
    .item-market-add-detail-grid { grid-template-columns: 1fr; }
    .item-market-bulk-actions button { width: 100%; }
    .item-market-receipt-grid { grid-template-columns: 1fr; }
    .inventory-gift-form input,
    .inventory-gift-form button { width: 100%; box-sizing: border-box; }
    .inventory-gift-form { grid-template-columns: 1fr; }
    .inventory-gift-form button { justify-self: stretch; }
    .inventory-inline-detail-heading { flex-wrap: wrap; }
    .inventory-heading-actions { width: 100%; margin-left: 0; }
}

@media (max-width: 420px) {
    .item-market-quantity-input, .item-market-price-input { width: 100%; }
    .item-market-purchase-form { justify-content: flex-start; }
    .item-market-purchase-quantity { width: 100%; }
}

.content-page-banner-copy p {
    color: var(--text-ink-muted);
}

.content-page-banner--harvesting .content-page-banner-copy {
    gap: 0.25rem;
}

.content-page-banner--crafting .content-page-banner-copy {
    gap: 0.25rem;
}

.content-page-banner-harvesting-location,
.content-page-banner-crafting-location {
    color: var(--text-ink) !important;
    font-weight: 800;
}

.content-page-banner-harvesting-description,
.content-page-banner-crafting-description {
    font-size: 0.88rem;
    line-height: 1.4;
}

.theme-foundation .content-body .content-page-banner--placeholder {
    background:
        radial-gradient(circle at 78% 44%, color-mix(in srgb, var(--color-accent-bronze) 16%, transparent), transparent 30%),
        linear-gradient(135deg, var(--surface-parchment-raised), var(--surface-parchment-muted));
}

.overview-journal .overview-adventure,
.overview-journal .overview-location,
.overview-journal .overview-recap {
    border-color: var(--border-soft);
    background: var(--surface-parchment-base);
    color: var(--text-ink);
}

.overview-journal .overview-section-heading h2,
.overview-journal .overview-section-heading p,
.overview-journal .overview-adventure-description,
.overview-journal .overview-adventure-objective,
.overview-journal .overview-location-description,
.overview-journal .overview-location-facts p,
.overview-journal .overview-recap-empty {
    color: var(--text-ink);
}

.overview-journal .overview-recap-entry time,
.overview-journal .overview-recap-entry p {
    color: var(--text-ink-muted);
}

@media (max-width: 900px) {
    .theme-foundation .content-body .content-page-banner {
        min-height: 15rem;
        aspect-ratio: auto;
    }

    .content-page-banner-copy {
        width: min(50%, 28rem);
        padding: 28px;
    }
}

@media (max-width: 560px) {
    .theme-foundation .content-body .content-page-banner {
        min-height: 13rem;
    }

    .content-page-banner::after {
        background: linear-gradient(90deg, rgba(201, 163, 109, 0.98) 0%, rgba(201, 163, 109, 0.9) 56%, rgba(201, 163, 109, 0.38) 100%);
    }

    .content-page-banner-copy {
        width: 100%;
        padding: 1.25rem;
    }

    .content-page-banner-copy h1 {
        font-size: clamp(1.45rem, 8vw, 2rem);
    }

}

/* Full-width Equipment layout */
.inventory-equipment-layout {
    display: block;
    width: 100%;
    max-width: none;
    min-width: 0;
    grid-column: 1 / -1;
    justify-self: stretch;
    container-type: inline-size;
}

.inventory-equipment-columns {
    display: grid;
    grid-template-columns: minmax(22rem, 2fr) minmax(0, 3fr);
    gap: var(--space-md);
    align-items: start;
    width: 100%;
    max-width: none;
    min-width: 0;
}

.inventory-equipment-columns > *,
.inventory-loadout-panel,
.inventory-equipment-list-panel,
.inventory-equipment-list-panel .inventory-item-list,
.inventory-equipment-list-panel .inventory-item-row,
.inventory-equipment-list-panel .inventory-inline-detail {
    width: 100%;
    max-width: none;
    min-width: 0;
    box-sizing: border-box;
}

.inventory-loadout-panel .equipment-loadout-stage {
    width: 100%;
    max-width: none;
    min-width: 0;
}

.inventory-equipment-list-panel .inventory-inline-detail {
    overflow: hidden;
}

.inventory-equipment-inline-detail .inventory-inline-detail-meta {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
    width: 100%;
    min-width: 0;
}

.inventory-equipment-inline-detail .inventory-inline-detail-meta-card {
    width: auto;
    min-width: 0;
}

.inventory-equipment-inline-detail .inventory-inline-detail-meta-card dd {
    overflow-wrap: normal;
}

.inventory-equipment-totals {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-auto-flow: row;
    gap: 0.5rem;
    margin: var(--space-md) 0;
    width: 100%;
    min-width: 0;
}

.inventory-equipment-totals > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--space-md);
    padding: 0.55rem 0.65rem;
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-control);
    background: var(--surface-parchment-raised);
    width: 100%;
    min-width: 0;
    grid-column: 1;
}

.inventory-equipment-totals dt,
.inventory-equipment-totals dd {
    min-width: 0;
}

.inventory-equipment-totals dt { color: var(--text-ink-muted); }
.inventory-equipment-totals dd { margin: 0; font-weight: 700; }

@container (max-width: 44rem) {
    .inventory-equipment-columns {
        grid-template-columns: minmax(0, 1fr);
    }
}

@container (max-width: 28rem) {
    .inventory-equipment-inline-detail .inventory-inline-detail-meta {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Shops browsing workspace */
.shops-interaction-region {
    display: block;
    width: 100%;
    min-width: 0;
}

.shops-interaction-region > * + * {
    margin-top: var(--layout-content-gap);
}

.shop-selector-section {
    display: grid;
    gap: var(--space-md);
    width: 100%;
    min-width: 0;
}

.shop-stock-workspace {
    display: block;
    width: 100%;
    min-width: 0;
}

.shop-stock-workspace > * + * {
    margin-top: var(--space-md);
}

.shop-section-heading h2,
.shop-welcome-purse h2,
.shop-empty-state h2,
.shop-empty-state h3 {
    margin: 0;
}

.shop-welcome-purse {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-lg);
    padding: var(--space-md);
}

.shop-welcome-purse p {
    margin: 0.3rem 0 0;
    color: var(--text-ink-muted);
}

.shop-selector-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 21rem));
    gap: var(--space-md);
    justify-content: start;
    min-width: 0;
}

.shop-selector-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: var(--space-sm);
}

.theme-foundation .content-body .shop-selector-card.is-selected {
    border-color: color-mix(in srgb, var(--state-success-border) 72%, var(--color-accent-bronze));
    background-color: color-mix(in srgb, var(--state-success-border) 12%, var(--surface-parchment-base));
    box-shadow:
        inset 0 0 0 2px color-mix(in srgb, var(--state-success-border) 28%, transparent),
        0 8px 18px rgba(79, 48, 21, 0.14);
}

.shop-selector-card .shop-identity {
    margin-bottom: 0;
}

.shop-selector-card .shop-identity__description {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.shop-selector-card__action {
    display: flex;
    align-items: center;
    margin-top: auto;
    padding-top: var(--space-sm);
}

.shop-selector-card__action .button-link {
    width: 100%;
    text-align: center;
}

.shop-mode-tabs,
.shop-category-filters {
    margin: 0;
}

.shop-selector-card__action .button-link:focus-visible {
    border-color: var(--color-accent-gold-muted);
    background: color-mix(in srgb, var(--surface-parchment-raised) 82%, white);
    outline: 2px solid var(--color-accent-gold-muted);
    outline-offset: 2px;
}

.shop-stock-table {
    min-width: 44rem;
    border-collapse: separate;
    border-spacing: 0 0.35rem;
}

.shop-stock-table th,
.shop-stock-table td {
    padding: 0.55rem 0.7rem;
    border-bottom: 1px solid var(--border-soft);
    text-align: left;
    vertical-align: middle;
}

.shop-stock-table tbody td {
    border-top: 1px solid var(--border-soft);
    border-bottom: 1px solid var(--border-soft);
    background: var(--surface-parchment-base);
}

.shop-stock-table tbody td:first-child {
    border-left: 1px solid var(--border-soft);
    border-radius: var(--radius-subtle) 0 0 var(--radius-subtle);
}

.shop-stock-table tbody td:last-child {
    border-right: 1px solid var(--border-soft);
    border-radius: 0 var(--radius-subtle) var(--radius-subtle) 0;
}

.shop-stock-table th {
    color: var(--text-ink-muted);
    font-size: 0.74rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.shop-stock-table td[data-label="Price"],
.shop-stock-table td[data-label="Stock"],
.shop-stock-table td[data-label="Owned"] {
    font-size: 0.9rem;
    line-height: 1.3;
    white-space: nowrap;
}

.shop-stock-table td[data-label="Action"] {
    text-align: right;
    white-space: nowrap;
}

.shop-stock-table td[data-label="Item"] {
    white-space: nowrap;
}

.shop-stock-table-item-link {
    gap: 0;
    color: inherit;
    text-decoration: none;
    vertical-align: middle;
}

.shop-stock-table-item-link > .item-icon {
    flex: 0 0 auto;
    margin-right: var(--space-sm);
}

.shop-stock-table-item {
    display: inline-grid;
    gap: 0.15rem;
    min-width: 0;
    max-width: 100%;
    vertical-align: middle;
    white-space: normal;
}

.shop-stock-table-item strong,
.shop-stock-table-item small {
    overflow-wrap: anywhere;
}

.shop-stock-table-item small {
    color: var(--text-ink-muted);
}

.shop-stock-table td::before {
    color: var(--text-ink-muted);
    font-size: 0.7rem;
    text-transform: uppercase;
}

.shop-stock-detail-row > td {
    padding-top: 0;
    border-top: 0;
    border-left: 1px solid var(--border-soft);
    border-right: 1px solid var(--border-soft);
    border-radius: 0;
}

.shop-item-inline-detail .inventory-inline-detail-heading {
    flex-wrap: wrap;
    min-height: 0;
    margin: 0;
}

.shop-item-inline-detail .inventory-inline-detail-heading h3 {
    flex: 1 1 auto;
    min-width: 0;
}

.shop-restock-info {
    position: relative;
    display: inline-grid;
    width: 1.2rem;
    height: 1.2rem;
    margin-left: 0.25rem;
    place-items: center;
    border: 1px solid var(--border-soft);
    border-radius: 50%;
    background: var(--surface-parchment-raised);
    color: var(--text-ink-muted);
    font-size: 0.72rem;
    font-weight: 800;
    cursor: help;
}

.shop-restock-info::after {
    position: absolute;
    z-index: 2;
    right: 0;
    bottom: calc(100% + 0.4rem);
    width: max-content;
    max-width: 14rem;
    padding: 0.35rem 0.5rem;
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-subtle);
    background: var(--surface-parchment-raised);
    color: var(--text-ink);
    content: attr(data-tooltip);
    font-size: 0.72rem;
    font-weight: 600;
    opacity: 0;
    pointer-events: none;
    transform: translateY(0.2rem);
    transition: opacity 120ms ease, transform 120ms ease;
}

.shop-restock-info:hover::after,
.shop-restock-info:focus-visible::after {
    opacity: 1;
    transform: translateY(0);
}

.shop-stock-table .inline-action-form {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    width: auto;
    margin: 0;
}

.shop-quantity-input {
    width: 3.8rem;
    min-height: 2.45rem;
    padding: 0.35rem 0.4rem;
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-control);
    background: var(--surface-parchment-raised);
    color: var(--text-ink);
    text-align: center;
}

.theme-foundation .content-body .shop-primary-action {
    width: auto;
    min-width: 5.5rem;
    min-height: 2.45rem;
    padding: 0.45rem 0.75rem;
    border: 1px solid color-mix(in srgb, var(--state-success-border) 72%, var(--color-accent-bronze-dark));
    border-radius: var(--radius-control);
    background: linear-gradient(180deg, var(--foundation-button-resource-top), var(--foundation-button-resource-bottom));
    color: var(--state-success-text);
    font-weight: 800;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 3px 7px rgba(48, 73, 22, 0.22);
}

.theme-foundation .content-body .shop-primary-action:hover,
.theme-foundation .content-body .shop-primary-action:focus-visible {
    background: linear-gradient(180deg, #688a3a, #38551a);
    outline: 2px solid var(--state-success-border);
    outline-offset: 2px;
}

.shop-action-state {
    display: grid;
    gap: 0.1rem;
    width: 100%;
    color: var(--text-ink);
    text-align: right;
}

.shop-action-state small {
    color: var(--text-ink-muted);
    line-height: 1.3;
}

.shop-empty-state {
    display: grid;
    gap: var(--space-sm);
    min-width: 0;
    padding: var(--space-md);
}

.shop-empty-state p {
    margin: 0;
    color: var(--text-ink-muted);
}

@media (max-width: 680px) {
    .shop-stock-table tr { border-bottom: 1px solid var(--border-soft); }

    .shop-stock-table td[data-label="Item"] {
        display: flex;
        align-items: center;
        white-space: normal;
    }

    .shop-stock-table td[data-label="Item"]::before {
        flex: 0 0 7rem;
    }

    .shop-stock-table td[data-label="Item"] > .shop-stock-table-item-link {
        flex: 1 1 auto;
        min-width: 0;
    }

    .shop-stock-table td[data-label="Item"] > .shop-stock-table-item-link > .item-icon {
        margin-right: var(--space-sm);
    }

    .shop-stock-table .shop-stock-detail-row,
    .shop-stock-table .shop-stock-detail-row > td {
        display: block;
        padding: 0;
        border: 0;
    }

    .shop-stock-table .shop-stock-detail-row > td::before {
        display: none;
        content: none;
    }

    .shop-action-state {
        text-align: left;
    }

    .shop-stock-table td[data-label="Action"] .inline-action-form,
    .shop-stock-table td[data-label="Action"] .shop-primary-action {
        width: 100%;
    }

    .shop-stock-table td[data-label="Action"] .shop-quantity-input {
        flex: 0 0 auto;
        width: 4.5rem;
    }
}

@media (max-width: 620px) {
    .shop-welcome-purse {
        align-items: stretch;
        flex-direction: column;
    }

    .shop-welcome-purse .inline-action-form,
    .shop-welcome-purse .shop-primary-action,
    .shop-selector-card__action .button-link {
        width: 100%;
    }

    .shop-mode-tabs .parchment-nav-button {
        flex: 1 1 9rem;
    }
}

/* World map-led overview: markers remain semantic HTML above temporary map artwork. */
.world-map-section,
.world-residents-section,
.world-destinations-section,
.world-local-summary-card { display: grid; gap: var(--space-md); min-width: 0; }
.world-travel-status { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-md); }
.world-travel-status h2, .world-travel-status p { margin: 0; }
.world-travel-status .eyebrow { margin-bottom: 0.25rem; }
.world-travel-status .inline-action-form { margin: 0; }
.world-map-section,
.world-residents-section,
.world-destinations-section {
    --world-copy: var(--text-on-stone);
    --world-secondary-copy: var(--text-on-stone-muted);
}
.world-map-section {
    --world-current-location-background: rgba(92, 61, 25, 0.96);
    --world-current-location-border: var(--color-accent-gold);
    --world-current-location-text: #fff4d2;
}
.world-map-section__header,
.world-map-current-location,
.world-resident-row,
.world-destination-card { display: grid; gap: var(--space-md); min-width: 0; }
.world-map-section__header { grid-template-columns: minmax(0, 1fr) auto; align-items: start; }
.world-map-section h1, .world-map-section h2, .world-map-section h3, .world-residents-section h2, .world-destinations-section h2, .world-destination-card h3, .world-local-summary-card h2 { margin: 0; }
.world-map-current-location { grid-template-columns: minmax(0, 1fr) minmax(9rem, 0.34fr); padding: var(--space-md); border: 1px solid rgba(230, 190, 98, 0.2); background: rgba(13, 12, 10, 0.38); }
.world-map-current-location p { margin: 0.35rem 0 0; color: var(--world-copy); line-height: 1.55; }
.theme-foundation .content-body .world-map-current-location .eyebrow,
.theme-foundation .content-body .world-residents-section .eyebrow,
.theme-foundation .content-body .world-destinations-section .eyebrow { color: var(--world-secondary-copy); opacity: 1; }
.world-map-location-type { align-self: center; color: var(--world-copy); font-weight: 700; }
.world-map-location-type span, .world-destination-card__type span { display: block; margin-bottom: 0.18rem; color: var(--world-secondary-copy); font-family: var(--font-family-interface); font-size: 0.72rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.world-current-location-indicator { display: inline-flex; width: fit-content; align-items: center; min-height: 2rem; padding: 0.3rem 0.65rem; border: 1px solid var(--color-accent-gold); border-radius: 999px; background: rgba(230, 190, 98, 0.14); color: var(--text-on-stone); font-family: var(--font-family-interface); font-size: 0.78rem; font-weight: 800; }

.world-map-stage { position: relative; min-height: 12rem; overflow: hidden; aspect-ratio: 16 / 9; border: 1px solid rgba(230, 190, 98, 0.28); border-radius: var(--radius-panel); background: var(--surface-stone-base); box-shadow: inset 0 0 0 2px rgba(20, 16, 10, 0.28); }
.world-map-stage__art { position: absolute; inset: 0; z-index: 0; display: grid; place-items: center; pointer-events: none; }
.world-map-stage__art img { display: block; width: 100%; height: 100%; object-fit: contain; }
.world-map-marker { position: absolute; z-index: 2; transform: translate(-50%, -50%); }
.world-map-marker form { margin: 0; }
.world-map-marker__control { display: inline-flex; align-items: center; gap: 0.3rem; min-height: var(--tap-target-min); padding: 0.35rem 0.55rem; border: 1px solid rgba(255, 242, 205, 0.72); border-radius: 999px; background: rgba(18, 22, 20, 0.88); color: #fff4d2; font-family: var(--font-family-interface); font-size: clamp(0.68rem, 1.2vw, 0.82rem); font-weight: 800; line-height: 1.1; text-decoration: none; box-shadow: 0 0.25rem 0.6rem rgba(0, 0, 0, 0.28); }
.world-map-marker__control:hover, .world-map-marker__control:focus-visible { border-color: var(--color-accent-gold); background: rgba(37, 44, 35, 0.96); outline: 2px solid var(--color-accent-gold); outline-offset: 2px; }
.world-map-marker.is-current .world-map-marker__control,
.world-current-location-indicator.is-current { border-color: var(--world-current-location-border); background: var(--world-current-location-background); color: var(--world-current-location-text); }
.world-map-marker__pin { width: 0.56rem; height: 0.56rem; flex: 0 0 auto; border-radius: 50%; background: #e2ba55; box-shadow: 0 0 0 0.18rem rgba(226, 186, 85, 0.22); }
.world-map-marker__quest { display: block; margin-top: 0.25rem; color: #fff0b3; font-family: var(--font-family-interface); font-size: 0.65rem; font-weight: 800; text-align: center; text-shadow: 0 1px 2px #111; }
.world-map-marker[data-location-key="haven_town_square"] { top: 51%; left: 46%; }
.world-map-marker[data-location-key="haven_workshop"] { top: 38%; left: 33%; }
.world-map-marker[data-location-key="haven_garden_walk"] { top: 20%; left: 61%; }
.world-map-marker[data-location-key="haven_riverside_landing"] { top: 76%; left: 25%; }
.world-map-marker[data-location-key="haven_quarry"] { top: 26%; left: 15%; }
.world-map-marker[data-location-key="haven_watchwood"] { top: 68%; left: 74%; }

.world-section-heading { display: grid; gap: 0.35rem; }
.world-section-heading h2, .world-section-heading p { margin: 0; }
.world-empty-state { margin: 0; color: var(--world-copy); }
.world-resident-list { display: grid; gap: var(--space-sm); }
.world-resident-row { grid-template-columns: minmax(0, 1fr) auto; align-items: center; padding: var(--space-md); border: 1px solid rgba(230, 190, 98, 0.18); background: rgba(13, 12, 10, 0.34); }
.world-resident-row .npc-identity__title,
.world-resident-row .npc-identity__description { color: var(--world-copy); }
.world-resident-row__action { display: grid; gap: var(--space-sm); justify-items: start; }
.theme-foundation .content-body .world-resident-row .quiet-note { margin: 0; color: var(--world-secondary-copy); }
.world-local-summary-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-md); }
.world-local-summary-card > p { margin: 0; color: var(--text-ink); line-height: 1.5; }
.world-local-summary-card > p strong { color: var(--text-ink); font-size: 1.25em; }
.world-local-summary-card__detail { min-height: 3rem; }
.world-local-summary-card .button-link { justify-self: start; }
.world-destination-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-md); }
.world-destination-card { align-content: start; padding: var(--space-md); border: 1px solid rgba(230, 190, 98, 0.18); background: rgba(13, 12, 10, 0.34); }
.world-destination-card.is-current { border-color: rgba(230, 190, 98, 0.56); background: linear-gradient(135deg, rgba(137, 94, 34, 0.46), rgba(13, 12, 10, 0.4)); }
.world-destination-card__header { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: var(--space-sm) var(--space-md); min-width: 0; }
.world-destination-card__identity { flex: 1 1 12rem; min-width: 0; }
.world-destination-card__identity .eyebrow { margin: 0 0 0.35rem; }
.world-destination-card__body { min-width: 0; }
.world-destination-card p { margin: 0.45rem 0 0; color: var(--world-copy); line-height: 1.5; }
.world-destination-card__type { color: var(--world-copy); font-weight: 700; }
.theme-foundation .content-body .world-destination-card .quiet-note { color: var(--world-secondary-copy); }
.world-destination-card__action { display: flex; flex: 0 1 auto; align-items: flex-start; justify-content: flex-end; min-height: var(--tap-target-min); min-width: 0; }
.world-destination-card__action .inline-action-form { margin: 0; }
.world-destination-card__action .button-link,
.world-destination-card__action button { min-height: var(--tap-target-min); }

@media (max-width: 760px) { .world-map-current-location, .world-resident-row { grid-template-columns: 1fr; } .world-map-current-location { gap: var(--space-sm); } }
@media (max-width: 620px) {
    .world-map-section__header { grid-template-columns: 1fr; }
    .world-map-section__header .world-current-location-indicator { justify-self: start; }
    .world-map-stage { min-height: 12rem; aspect-ratio: 16 / 9; }
    .world-map-marker__control { max-width: 8.2rem; padding-inline: 0.4rem; font-size: 0.66rem; }
    .world-map-marker[data-location-key="haven_town_square"] { left: 48%; }
    .world-map-marker[data-location-key="haven_workshop"] { left: 29%; }
    .world-map-marker[data-location-key="haven_garden_walk"] { left: 67%; }
    .world-map-marker[data-location-key="haven_riverside_landing"] { left: 27%; }
    .world-map-marker[data-location-key="haven_quarry"] { left: 17%; }
    .world-map-marker[data-location-key="haven_watchwood"] { left: 71%; }
    .world-local-summary-grid, .world-destination-grid { grid-template-columns: 1fr; }
    .world-local-summary-card__detail { min-height: 0; }
    .world-destination-card__header { align-items: stretch; }
    .world-destination-card__action { flex: 1 1 100%; justify-content: flex-start; }
}

/* Quest Journal V2 parchment contrast and compact presentation */
.theme-foundation .content-body .quest-status-strip .module-stat-item {
    padding: 0;
    border: 0;
    background: transparent;
    background-image: none;
    box-shadow: none;
}

.theme-foundation .content-body .quest-journal-metadata > div {
    padding: 0 0 0.55rem;
    border: 0;
    border-bottom: 1px solid var(--border-soft);
    border-radius: 0;
    background: transparent;
    background-image: none;
}

.theme-foundation .content-body .quest-journal-metadata dt,
.theme-foundation .content-body .quest-journal-index-item small,
.theme-foundation .content-body .quest-journal-entry .quiet-note { color: var(--text-ink-muted); }
.theme-foundation .content-body .quest-journal-metadata dd,
.theme-foundation .content-body .quest-journal-entry-section p:not(.quiet-note) { color: var(--text-ink); }
.theme-foundation .content-body .quest-journal-index-item,
.theme-foundation .content-body .quest-journal-tab { color: var(--text-ink); }
.theme-foundation .content-body .quest-journal-index-item:hover,
.theme-foundation .content-body .quest-journal-index-item:focus-visible,
.theme-foundation .content-body .quest-journal-tab:hover,
.theme-foundation .content-body .quest-journal-tab:focus-visible,
.theme-foundation .content-body .quest-journal-tab.is-active,
.theme-foundation .content-body .quest-journal-index-item.is-selected {
    color: var(--text-ink);
    background: color-mix(in srgb, var(--surface-parchment-raised) 82%, white);
    background-image: none;
    border-color: var(--color-accent-bronze-dark);
}

/* Keep the selected tab marker separate from transient hover and focus states. */
.theme-foundation .content-body .quest-journal-tab.is-active,
.theme-foundation .content-body .quest-journal-tab.is-active:hover,
.theme-foundation .content-body .quest-journal-tab.is-active:focus-visible {
    box-shadow: inset 0 -3px 0 var(--color-accent-bronze-dark);
}

.theme-foundation .content-body .quest-journal-tab:hover:not(.is-active),
.theme-foundation .content-body .quest-journal-tab:focus-visible:not(.is-active) {
    box-shadow: none;
}

.theme-foundation .content-body .quest-journal-index .quiet-note,
.theme-foundation .content-body .quest-journal-index-item small,
.theme-foundation .content-body .quest-status-strip .module-stat-item span,
.theme-foundation .content-body .quest-journal-workspace + .quiet-note,
.theme-foundation .content-body .quest-journal-detail .quiet-note,
.theme-foundation .content-body .quest-journal-entry .quiet-note {
    color: #4b3927;
}

.theme-foundation .content-body .quest-status-strip .module-stat-item strong {
    color: var(--text-ink);
}

/* Guild member workspace and capability-gated management */
.guild-workspace-header { display: grid; gap: var(--space-md); }
.guild-workspace-header__identity { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-md); align-items: center; }
.guild-workspace-header__identity h1,
.guild-workspace-header__identity p { margin: 0; }
.guild-workspace-header__identity .eyebrow { margin-bottom: 0.25rem; }
.guild-workspace-header__identity h1 { margin-bottom: 0.35rem; }
.guild-monogram { display: grid; width: 4.5rem; height: 4.5rem; place-items: center; border: 1px solid var(--color-accent-bronze-dark); border-radius: var(--radius-panel); background: linear-gradient(145deg, var(--surface-parchment-raised), var(--surface-parchment-muted)); color: var(--text-ink); font-family: var(--font-family-heading); font-size: 1.5rem; font-weight: 800; letter-spacing: 0.08em; box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--surface-parchment-base) 74%, transparent); }
.guild-workspace-header__facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); gap: var(--space-sm); margin: 0; }
.guild-workspace-header__facts > div { min-width: 0; padding: var(--space-sm); border: 1px solid var(--border-soft); border-radius: var(--radius-control); background: var(--surface-parchment-raised); }
.guild-workspace-header__facts dt { color: var(--text-ink-muted); font-family: var(--font-family-interface); font-size: 0.75rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.guild-workspace-header__facts dd { min-width: 0; margin: 0.2rem 0 0; color: var(--text-ink); font-weight: 750; overflow-wrap: anywhere; }
.guild-member-navigation { margin-top: 0; }
.guild-control-navigation { margin-top: calc(var(--space-sm) * -1); }
.guild-overview-grid { display: grid; gap: var(--space-md); }
.guild-overview-grid .social-definition-grid,
.guild-public-record .social-definition-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); }
.guild-overview-grid .social-definition-grid { max-width: 52rem; }
.guild-member-preview-list,
.guild-readonly-roster,
.guild-admin-member-list { display: grid; gap: var(--space-sm); }
.guild-member-preview-row,
.guild-readonly-member-row,
.guild-admin-member-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-md); align-items: center; padding: var(--space-sm); border: 1px solid var(--border-soft); border-radius: var(--radius-control); background: var(--surface-parchment-raised); }
.guild-readonly-member-row h3,
.guild-readonly-member-row p,
.guild-admin-member-row h3,
.guild-admin-member-row p { margin: 0; }
.guild-you-marker { display: inline-flex; margin-left: 0.35rem; padding: 0.08rem 0.4rem; border: 1px solid var(--border-soft); border-radius: 999px; color: var(--text-ink-muted); font-family: var(--font-family-interface); font-size: 0.68rem; font-weight: 800; vertical-align: middle; }
.guild-control-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); gap: var(--space-md); }
.guild-control-card { display: grid; align-content: start; gap: var(--space-sm); margin: 0; }
.guild-control-card h2,
.guild-control-card p { margin: 0; }
.guild-control-card .button-link { justify-self: start; margin-top: auto; }
.guild-danger-zone { margin-top: var(--space-xl); border-color: var(--state-danger-border); background: color-mix(in srgb, var(--state-danger-border) 8%, var(--surface-parchment-base)); }
.guild-public-navigation { margin-bottom: var(--space-md); }
.guild-directory-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-md); align-items: end; }
.guild-directory-toolbar h1,
.guild-directory-toolbar p,
.guild-activity-panel h2,
.guild-activity-panel p,
.guild-directory-card h2,
.guild-directory-card p,
.guild-public-header h1,
.guild-public-header h2,
.guild-public-header p,
.guild-public-record h2,
.guild-public-record p,
.guild-membership-panel h2,
.guild-membership-panel p,
.guild-charter-panel h1,
.guild-charter-panel > p { margin: 0; }
.guild-directory-toolbar__count { color: var(--text-ink-muted); font-family: var(--font-family-interface); font-size: 0.82rem; white-space: nowrap; }
.guild-directory-toolbar__count strong { color: var(--text-ink); font-size: 1.1rem; }
.guild-activity-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); gap: var(--space-sm); margin-top: var(--space-md); }
.guild-activity-card { display: grid; gap: var(--space-sm); padding: var(--space-sm); border: 1px solid var(--border-soft); border-radius: var(--radius-control); background: var(--surface-parchment-raised); }
.guild-activity-card h3 { margin: 0; }
.guild-directory-list { display: grid; gap: var(--space-md); }
.guild-directory-card { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(12rem, 0.85fr) auto; gap: var(--space-md); align-items: center; }
.guild-directory-card--no-action { grid-template-columns: minmax(0, 1.4fr) minmax(12rem, 0.85fr); }
.guild-directory-card__identity { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-md); align-items: center; min-width: 0; }
.guild-directory-card__identity h2 { margin: 0; }
.guild-directory-card__identity > div:last-child { min-width: 0; }
.guild-policy-badge { display: inline-flex; border: 1px solid var(--border-soft); border-radius: 999px; padding: 0.2rem 0.55rem; color: var(--text-ink-muted); font-family: var(--font-family-interface); font-size: 0.76rem; font-weight: 800; white-space: nowrap; }
.guild-directory-card__facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-sm); margin: 0; }
.guild-directory-card__facts > div { min-width: 0; }
.guild-directory-card__facts dt { color: var(--text-ink-muted); font-family: var(--font-family-interface); font-size: 0.7rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.guild-directory-card__facts dd { margin: 0.2rem 0 0; color: var(--text-ink); font-weight: 750; overflow-wrap: anywhere; }
.guild-directory-card__action { justify-self: end; }
.guild-directory-card__action .inline-action-form { margin: 0; }
.guild-public-header { display: grid; gap: var(--space-md); }
.guild-public-profile-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(17rem, 0.7fr); gap: var(--space-md); align-items: start; }
.guild-public-record,
.guild-membership-panel { display: grid; gap: var(--space-sm); }
.guild-membership-panel .checkpoint-actions { margin-top: var(--space-sm); }
.guild-charter-panel { display: grid; gap: var(--space-md); width: min(100%, 42rem); margin: var(--space-xl) auto 0; }
.guild-charter-panel .stacked-form { display: grid; gap: var(--space-sm); }
.guild-charter-panel .stacked-form .quiet-note { margin: -0.2rem 0 var(--space-sm); }
.guild-announcement-list { gap: var(--space-sm); }
.guild-announcement-card { min-width: 0; border-left: 3px solid color-mix(in srgb, var(--color-accent-bronze) 72%, var(--border-soft)); }
.guild-announcement-card h3,
.guild-announcement-card h4,
.guild-announcement-card p { min-width: 0; overflow-wrap: anywhere; }
.guild-announcement-card__metadata { margin: -0.2rem 0 0; color: var(--text-ink-muted); font-family: var(--font-family-interface); font-size: 0.78rem; font-weight: 700; }
.guild-announcement-form { display: grid; gap: var(--space-sm); width: 100%; }
.guild-announcement-form textarea { width: 100%; max-width: 100%; box-sizing: border-box; resize: vertical; }
.guild-board,
.guild-management-log { display: grid; gap: var(--space-md); min-width: 0; }
.guild-board > h2,
.guild-board > h3,
.guild-management-log > h2 { margin: 0; }
.guild-board-tabs,
.guild-board-filters,
.guild-management-log__filters { margin: 0; }
.guild-activity-ledger { display: grid; gap: var(--space-sm); min-width: 0; }
.guild-activity-ledger__empty { margin: 0; color: var(--text-ink-muted); }
.guild-activity-ledger__row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-sm); min-width: 0; border-left: 3px solid color-mix(in srgb, var(--color-accent-bronze) 62%, var(--border-soft)); }
.guild-activity-ledger__content { display: grid; gap: 0.3rem; min-width: 0; }
.guild-activity-ledger__content h4,
.guild-activity-ledger__content p,
.guild-activity-ledger__category,
.guild-activity-ledger__timestamp { margin: 0; overflow-wrap: anywhere; }
.guild-activity-ledger__category,
.guild-activity-ledger__timestamp { color: var(--text-ink-muted); font-family: var(--font-family-interface); font-size: 0.78rem; font-weight: 750; }
.guild-activity-ledger__category { grid-column: 1 / -1; letter-spacing: 0.05em; text-transform: uppercase; }
.guild-activity-ledger__timestamp { text-align: right; line-height: 1.4; white-space: nowrap; }

@media (max-width: 680px) {
    .guild-workspace-header__facts,
    .guild-overview-grid .social-definition-grid,
    .guild-public-record .social-definition-grid { grid-template-columns: 1fr; }
    .guild-directory-toolbar,
    .guild-directory-card,
    .guild-public-profile-grid { grid-template-columns: 1fr; align-items: start; }
    .guild-directory-card__action { justify-self: start; }
    .guild-readonly-member-row,
    .guild-admin-member-row,
    .guild-activity-ledger__row { grid-template-columns: 1fr; align-items: start; }
    .guild-activity-ledger__timestamp { text-align: left; white-space: normal; }
}

@media (max-width: 480px) {
    .guild-workspace-header__identity { grid-template-columns: 1fr; }
    .guild-directory-card__identity,
    .guild-directory-card__facts { grid-template-columns: 1fr; }
    .guild-monogram { width: 3.75rem; height: 3.75rem; }
}