:root {
    color-scheme: dark;
    --bg: #10130f;
    --panel: #191f18;
    --panel-2: #20271f;
    --line: #384133;
    --text: #eef1df;
    --muted: #aeb7a3;
    --faint: #788270;
    --tan: #c8a66c;
    --rust: #b36a3f;
    --blue: #5fa2c7;
    --green: #6f8f5f;
    --danger: #d88363;
    --shadow: 0 20px 60px rgba(0, 0, 0, 0.35);
    --font-ui: "Roboto Condensed", Arial, Helvetica, sans-serif;
    --font-display: "IM Fell English SC", Georgia, serif;
    --font-notes: "Special Elite", "Courier New", monospace;
}

* {
    box-sizing: border-box;
}

img,
svg,
canvas,
video {
    max-width: 100%;
}

body {
    margin: 0;
    overflow-x: hidden;
    background:
        linear-gradient(180deg, rgba(16, 19, 15, 0.92), rgba(16, 19, 15, 0.98)),
        radial-gradient(circle at 18% 8%, rgba(111, 143, 95, 0.16), transparent 28%),
        #10130f;
    color: var(--text);
    font-family: var(--font-ui);
    line-height: 1.5;
}

body.auth-page {
    min-height: 100vh;
    background:
        linear-gradient(90deg, rgba(7, 10, 8, 0.3), rgba(7, 10, 8, 0.62) 46%, rgba(7, 10, 8, 0.92)),
        linear-gradient(180deg, rgba(7, 10, 8, 0.08), rgba(7, 10, 8, 0.88)),
        url('../images/auth-hero.png') center / cover fixed no-repeat,
        #10130f;
}

body.home-command-page {
    min-height: 100vh;
    background:
        linear-gradient(180deg, rgba(5, 7, 6, 0.38), rgba(5, 7, 6, 0.9)),
        radial-gradient(circle at 16% 12%, rgba(116, 94, 58, 0.22), transparent 25%),
        radial-gradient(circle at 88% 18%, rgba(79, 96, 74, 0.18), transparent 28%),
        linear-gradient(135deg, #070a08, #11160f 42%, #090c08);
}

body.home-page::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(90deg, rgba(0, 0, 0, 0.35), transparent 24%, transparent 76%, rgba(0, 0, 0, 0.42)),
        repeating-linear-gradient(118deg, rgba(255, 255, 255, 0.025) 0, rgba(255, 255, 255, 0.025) 1px, transparent 1px, transparent 9px);
    opacity: 0.72;
}

a {
    color: var(--tan);
}

button,
input {
    font: inherit;
}

button,
[role="button"],
summary,
.panel-link,
.survivor-actions a,
.market-link-button,
.mobile-detail-close {
    min-height: 40px;
}

a:focus-visible,
button:focus-visible,
summary:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 3px solid rgba(235, 200, 125, 0.92);
    outline-offset: 3px;
}

h1,
h2,
.brand-name {
    font-family: var(--font-display);
    font-weight: 400;
}

h1,
h2,
h3,
p,
span,
strong,
small,
dd,
dt,
a,
button {
    max-width: 100%;
    overflow-wrap: anywhere;
}

.topbar {
    position: sticky;
    top: 0;
    z-index: 10;
    display: grid;
    grid-template-columns: minmax(210px, 1fr) auto minmax(140px, 1fr);
    align-items: center;
    gap: 14px;
    min-height: 58px;
    padding: 0 16px;
    background: rgba(13, 16, 12, 0.94);
    border-bottom: 1px solid var(--line);
    backdrop-filter: blur(12px);
}

.topbar > * {
    min-width: 0;
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    color: var(--text);
    text-decoration: none;
    font-weight: 800;
}

.brand-logo {
    display: block;
    width: 42px;
    height: 42px;
    object-fit: contain;
    object-position: left center;
}

.brand-name {
    display: inline-block;
    min-width: 0;
    font-size: 1.12rem;
    line-height: 1;
    text-transform: uppercase;
}

.topbar-status {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 0;
}

.resource-pill {
    display: grid;
    gap: 1px;
    min-width: 72px;
    padding: 6px 10px;
    border: 1px solid rgba(200, 166, 108, 0.22);
    border-radius: 7px;
    background: rgba(7, 10, 8, 0.68);
}

.resource-pill small {
    color: var(--tan);
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.resource-pill strong {
    color: var(--text);
    font-family: var(--font-notes);
    font-size: 0.88rem;
    line-height: 1.05;
    white-space: nowrap;
}

.topbar-player {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    min-width: 0;
    gap: 12px;
    color: var(--muted);
    font-size: 0.9rem;
}

.account-menu {
    position: relative;
}

.account-menu summary,
.nav-menu summary,
.mobile-menu summary {
    cursor: pointer;
    list-style: none;
}

.account-menu summary::-webkit-details-marker,
.nav-menu summary::-webkit-details-marker,
.mobile-menu summary::-webkit-details-marker {
    display: none;
}

.account-menu summary {
    max-width: 180px;
    overflow: hidden;
    padding: 8px 10px;
    border: 1px solid rgba(200, 166, 108, 0.2);
    border-radius: 7px;
    color: var(--text);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.account-menu-panel,
.nav-menu-panel,
.mobile-menu-panel {
    border: 1px solid rgba(200, 166, 108, 0.3);
    background:
        linear-gradient(180deg, rgba(29, 35, 27, 0.98), rgba(10, 13, 9, 0.98)),
        #141913;
    box-shadow: var(--shadow);
}

.account-menu-panel {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 40;
    display: grid;
    min-width: 160px;
    border-radius: 7px;
    overflow: hidden;
}

.account-menu-panel a,
.nav-menu-panel a,
.mobile-menu-panel a {
    color: var(--text);
    text-decoration: none;
}

.account-menu-panel a {
    padding: 10px 12px;
    border-bottom: 1px solid rgba(200, 166, 108, 0.12);
}

.account-menu-panel a:hover,
.nav-menu-panel a:hover,
.mobile-menu-panel a:hover {
    background: rgba(200, 166, 108, 0.1);
}

.main-nav {
    position: sticky;
    top: 58px;
    z-index: 9;
    display: flex;
    justify-content: center;
    gap: 8px;
    padding: 9px 12px;
    background: rgba(21, 26, 20, 0.94);
    border-bottom: 1px solid var(--line);
}

.main-nav a,
.main-nav summary,
.future-link {
    flex: 0 0 auto;
    min-width: 74px;
    padding: 8px 12px;
    border: 1px solid transparent;
    border-radius: 6px;
    color: var(--text);
    text-align: center;
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 700;
    text-transform: uppercase;
}

.main-nav a.is-active,
.main-nav > a:hover,
.nav-menu.is-active > summary,
.nav-menu[open] > summary {
    border-color: rgba(200, 166, 108, 0.42);
    background: rgba(200, 166, 108, 0.12);
    color: #f4e8c5;
}

.nav-menu {
    position: relative;
}

.nav-menu-panel {
    position: absolute;
    top: calc(100% + 8px);
    left: 50%;
    z-index: 45;
    display: grid;
    min-width: 170px;
    padding: 6px;
    border-radius: 8px;
    transform: translateX(-50%);
}

.nav-menu-panel a {
    min-width: 0;
    padding: 9px 12px;
    text-align: left;
}

.future-link {
    color: var(--faint);
    border-color: rgba(120, 130, 112, 0.22);
}

.mobile-bottom-nav {
    display: none;
}

.page-shell {
    width: min(1180px, 100%);
    max-width: 100%;
    margin: 0 auto;
    padding: 16px;
    overflow-x: clip;
}

.command-status-bar,
.command-grid,
.survivor-layout,
.survivor-card,
.perk-header,
.perk-skill-table-card,
.perk-skill-table,
.perk-card-grid,
.hunt-layout,
.downtime-layout,
.market-panel,
.market-hall,
.market-sign,
.market-status-strip,
.market-listings,
.market-row,
.market-row-main,
.market-item-drawer,
.market-board-card,
.inventory-locker-layout,
.inventory-locker-header,
.jobs-layout,
.missions-layout,
.camp-layout,
.camp-main,
.camp-hero-panel,
.camp-compound-grid,
.camp-compound-map,
.camp-section-grid,
.downtime-header,
.hunt-board,
.hunt-board-header,
.hunt-current-plan,
.hunt-board-layout,
.hunt-conditions,
.map-stage,
.map-location-hero,
.home-location-hero,
.story-feature,
.profile-grid {
    min-width: 0;
}

.command-status-bar > *,
.command-grid > *,
.survivor-layout > *,
.survivor-card > *,
.perk-header > *,
.perk-skill-table-card > *,
.perk-skill-table > *,
.perk-card-grid > *,
.hunt-layout > *,
.downtime-layout > *,
.market-panel > *,
.market-hall > *,
.market-sign > *,
.market-status-strip > *,
.market-listings > *,
.market-row > *,
.market-row-main > *,
.market-item-drawer > *,
.market-board-card > *,
.inventory-locker-layout > *,
.inventory-locker-header > *,
.jobs-layout > *,
.missions-layout > *,
.camp-layout > *,
.camp-main > *,
.camp-hero-panel > *,
.camp-compound-grid > *,
.camp-compound-map > *,
.camp-section-grid > *,
.downtime-header > *,
.hunt-board > *,
.hunt-board-header > *,
.hunt-current-plan > *,
.hunt-board-layout > *,
.hunt-conditions > *,
.map-stage > *,
.map-location-hero > *,
.home-location-hero > *,
.story-feature > *,
.profile-grid > * {
    min-width: 0;
}

.auth-page .page-shell {
    width: 100%;
    padding: 0;
}

.auth-panel {
    min-height: calc(100vh - 90px);
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 22px;
    align-items: center;
    padding: 28px 0;
}

.auth-page .auth-panel {
    width: min(1180px, 100%);
    margin: 0 auto;
    padding: 32px 16px;
}

.auth-panel h1,
.map-toolbar h1,
.panel > h1 {
    margin: 0;
    font-size: clamp(2rem, 8vw, 4.8rem);
    line-height: 0.95;
}

.auth-panel h1 {
    font-size: clamp(2.6rem, 10vw, 6rem);
    text-transform: uppercase;
}

.lede {
    max-width: 620px;
    color: var(--muted);
    font-size: 1.08rem;
}

.form-card,
.panel {
    border: 1px solid var(--line);
    border-radius: 8px;
    background: linear-gradient(180deg, rgba(32, 39, 31, 0.96), rgba(22, 27, 21, 0.98));
    box-shadow: var(--shadow);
}

.form-card {
    display: grid;
    gap: 14px;
    padding: 20px;
}

.auth-page .form-card {
    background: linear-gradient(180deg, rgba(22, 27, 21, 0.94), rgba(11, 14, 10, 0.96));
    border-color: rgba(200, 166, 108, 0.26);
    backdrop-filter: blur(10px);
}

.form-card h2,
.panel h2 {
    margin: 0 0 8px;
}

.form-card h2 {
    font-family: var(--font-display);
    font-size: 1.7rem;
    text-transform: uppercase;
}

label {
    display: grid;
    gap: 6px;
    color: var(--muted);
    font-size: 0.92rem;
    font-weight: 700;
    text-transform: uppercase;
}

fieldset {
    min-width: 0;
}

.choice-fieldset {
    display: grid;
    gap: 10px;
    margin: 0;
    padding: 0;
    border: 0;
}

.choice-fieldset legend {
    margin-bottom: 6px;
    color: var(--muted);
    font-size: 0.92rem;
}

.segmented-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.auth-session-options {
    grid-template-columns: 1fr;
}

.auth-session-options span {
    justify-items: start;
    min-height: 38px;
    padding: 8px 10px;
    text-align: left;
}

.bot-field {
    position: absolute;
    left: -10000px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.segmented-options label,
.avatar-picker label {
    cursor: pointer;
}

.segmented-options input,
.avatar-picker input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.segmented-options span {
    display: grid;
    min-height: 42px;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: #121810;
    color: var(--text);
    font-weight: 700;
}

.alerts-link {
    flex: 0 0 auto;
    padding: 8px 10px;
    border: 1px solid rgba(200, 166, 108, 0.2);
    border-radius: 7px;
    color: rgba(239, 234, 215, 0.78);
    text-decoration: none;
    font-size: 0.82rem;
    font-weight: 900;
    text-transform: uppercase;
}

.alerts-link.has-alerts {
    border-color: rgba(190, 62, 47, 0.72);
    color: #f1c6bb;
    box-shadow: 0 0 18px rgba(190, 62, 47, 0.14);
}

.segmented-options input:checked + span,
.avatar-picker input:checked + .avatar-option {
    border-color: var(--tan);
    box-shadow: 0 0 0 2px rgba(200, 166, 108, 0.28);
}

.avatar-picker {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.avatar-picker label {
    display: grid;
    gap: 6px;
}

.avatar-picker label[hidden] {
    display: none;
}

.avatar-option,
.profile-portrait {
    display: block;
    aspect-ratio: 1;
    border: 1px solid var(--line);
    border-radius: 8px;
    background-repeat: no-repeat;
    background-color: #10150f;
    background-position: center bottom;
    background-size: cover, contain;
}

.avatar-option {
    width: 100%;
}

.avatar-picker small {
    color: var(--faint);
    font-size: 0.72rem;
    text-align: center;
}

.profile-portrait {
    width: min(190px, 62vw);
    margin: 16px 0;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04), var(--shadow);
}

input {
    width: 100%;
    min-height: 46px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: #11160f;
    color: var(--text);
}

button {
    min-height: 44px;
    border: 1px solid #d0aa72;
    border-radius: 6px;
    background: #b98a4d;
    color: #10130f;
    font-weight: 800;
    text-transform: uppercase;
    cursor: pointer;
}

button:disabled {
    cursor: wait;
    opacity: 0.68;
}

.alert {
    margin: 0;
    padding: 10px 12px;
    border: 1px solid rgba(216, 131, 99, 0.42);
    border-radius: 6px;
    background: rgba(216, 131, 99, 0.14);
    color: #ffd7c8;
}

.notice {
    margin: 0;
    padding: 10px 12px;
    border: 1px solid rgba(111, 143, 95, 0.42);
    border-radius: 6px;
    background: rgba(111, 143, 95, 0.16);
    color: #def0d2;
}

.checkbox-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 10px;
    padding: 12px;
    border: 1px solid rgba(200, 166, 108, 0.2);
    border-radius: 6px;
    background: rgba(10, 14, 10, 0.42);
    color: var(--text);
    font-size: 0.86rem;
    line-height: 1.45;
    text-transform: none;
}

.checkbox-row input {
    width: 18px;
    min-height: 18px;
    margin-top: 2px;
    accent-color: var(--tan);
}

.checkbox-row span {
    min-width: 0;
}

.auth-form-link {
    margin: -4px 0 0;
    font-size: 0.92rem;
    font-weight: 800;
    text-align: right;
}

.oauth-login-options {
    display: grid;
    gap: 10px;
}

.oauth-button {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    min-height: 46px;
    padding: 9px 12px;
    border: 1px solid rgba(238, 241, 223, 0.22);
    border-radius: 6px;
    background: rgba(238, 241, 223, 0.95);
    color: #11160f;
    text-align: center;
    text-decoration: none;
    font-weight: 900;
    text-transform: uppercase;
}

.oauth-button span {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border-radius: 50%;
    background: #ffffff;
    color: #11160f;
    font-weight: 900;
}

.oauth-button--facebook {
    background: #1877f2;
    border-color: #69a7ff;
    color: #ffffff;
}

.oauth-divider {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    color: var(--faint);
    font-size: 0.78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.oauth-divider::before,
.oauth-divider::after {
    content: "";
    height: 1px;
    background: rgba(200, 166, 108, 0.24);
}

.legal-page {
    width: min(920px, 100%);
    margin: 0 auto;
    padding: 32px 16px 56px;
}

.legal-hero {
    display: grid;
    gap: 8px;
    margin-bottom: 18px;
}

.legal-hero h1 {
    margin: 0;
    font-size: clamp(2.4rem, 9vw, 5rem);
    line-height: 0.95;
    text-transform: uppercase;
}

.legal-hero p {
    margin: 0;
    color: var(--muted);
}

.legal-card {
    display: grid;
    gap: 16px;
    padding: 22px;
    border: 1px solid rgba(200, 166, 108, 0.26);
    border-radius: 8px;
    background: linear-gradient(180deg, rgba(22, 27, 21, 0.95), rgba(11, 14, 10, 0.98));
    box-shadow: var(--shadow);
}

.legal-card h2 {
    margin: 12px 0 -4px;
    color: var(--tan);
    font-size: 1rem;
    text-transform: uppercase;
}

.legal-card p {
    margin: 0;
    color: var(--muted);
    line-height: 1.65;
}

.muted,
.quiet-message {
    color: var(--muted);
}

#squatch-system-notice,
#squatch-result-toast {
    position: fixed;
    right: 18px;
    z-index: 40;
    max-width: min(420px, calc(100vw - 36px));
    border-radius: 6px;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.52);
}

#squatch-system-notice {
    top: 82px;
    padding: 12px 14px;
    border: 1px solid rgba(216, 131, 99, 0.45);
    background: rgba(42, 16, 11, 0.96);
    color: #ffd9cb;
}

#squatch-result-toast {
    top: 86px;
    display: flex;
    align-items: start;
    gap: 12px;
    padding: 14px;
    border: 1px solid rgba(200, 166, 108, 0.42);
    background:
        linear-gradient(180deg, rgba(33, 37, 28, 0.98), rgba(15, 18, 14, 0.98)),
        #151a12;
    color: #f3ead1;
    transform: translateY(-10px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 160ms ease, transform 160ms ease;
}

#squatch-result-toast.is-visible {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
}

#squatch-result-toast span {
    flex: 1;
    font-family: var(--font-notes);
    font-size: 0.95rem;
}

#squatch-result-toast button {
    min-width: 34px;
    min-height: 30px;
    padding: 0 8px;
    border-color: rgba(200, 166, 108, 0.3);
    background: rgba(5, 7, 5, 0.55);
    color: #d8bd82;
    font-size: 0;
}

#squatch-result-toast button::before {
    content: "x";
    font-size: 0.95rem;
}

.tutorial-overlay {
    position: fixed;
    inset: 0;
    z-index: 118;
    display: none;
    place-items: center;
    padding: 18px;
    background:
        radial-gradient(circle at 50% 34%, rgba(123, 100, 67, 0.24), transparent 30%),
        rgba(0, 0, 0, 0.76);
}

.tutorial-overlay.is-visible {
    display: grid;
}

.tutorial-card {
    position: relative;
    width: min(620px, 100%);
    display: grid;
    gap: 14px;
    padding: 22px;
    border: 1px solid rgba(95, 63, 31, 0.55);
    border-radius: 6px;
    background:
        linear-gradient(135deg, rgba(92, 62, 30, 0.18), transparent 34%),
        radial-gradient(circle at 20% 12%, rgba(255, 244, 199, 0.22), transparent 28%),
        #c8a66b;
    color: #1e160d;
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.62), inset 0 0 42px rgba(87, 51, 22, 0.18);
}

.tutorial-card .eyebrow {
    color: #67451f;
}

.tutorial-card h2 {
    margin: 0;
    color: #21160b;
    font-family: var(--font-display);
    font-size: clamp(2rem, 5vw, 3.25rem);
    line-height: 0.95;
    letter-spacing: 0;
    text-transform: uppercase;
}

.tutorial-card p {
    margin: 0;
    color: rgba(31, 22, 12, 0.82);
    font-size: 1.05rem;
    font-weight: 800;
}

.tutorial-points {
    display: grid;
    gap: 8px;
    margin: 0;
    padding-left: 20px;
    color: rgba(28, 20, 10, 0.86);
    font-family: var(--font-notes);
    font-size: 1rem;
}

.tutorial-dots,
.tutorial-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.tutorial-dots button {
    width: 12px;
    min-width: 12px;
    min-height: 12px;
    height: 12px;
    padding: 0;
    border-radius: 999px;
    border-color: rgba(57, 36, 16, 0.48);
    background: rgba(41, 28, 14, 0.22);
}

.tutorial-dots button.is-active {
    background: #33200f;
}

.tutorial-actions {
    justify-content: space-between;
}

.tutorial-actions a,
.faq-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 9px 14px;
    border: 1px solid rgba(45, 30, 13, 0.42);
    border-radius: 6px;
    color: #1b1208;
    background: rgba(255, 241, 191, 0.28);
    font-weight: 900;
    text-decoration: none;
    text-transform: uppercase;
}

.tutorial-close {
    position: absolute;
    top: 12px;
    right: 12px;
    min-width: 34px;
    min-height: 30px;
    padding: 0 8px;
    border-color: rgba(45, 30, 13, 0.32);
    background: rgba(34, 22, 10, 0.12);
    color: #2d1c0d;
    font-size: 0;
}

.tutorial-close::before {
    content: "x";
    font-size: 0.95rem;
}

.sasquatch-encounter,
.story-lead-overlay {
    position: fixed;
    inset: 0;
    z-index: 120;
    display: none;
    place-items: center;
    padding: 18px;
    background:
        radial-gradient(circle at 50% 36%, rgba(93, 104, 82, 0.2), transparent 28%),
        rgba(0, 0, 0, 0.74);
}

.sasquatch-encounter.is-visible,
.story-lead-overlay.is-visible {
    display: grid;
}

.sasquatch-encounter-card,
.story-lead-card-modal {
    width: min(560px, 100%);
    display: grid;
    gap: 13px;
    padding: 20px;
    border: 1px solid rgba(211, 178, 115, 0.42);
    border-radius: 6px;
    background:
        linear-gradient(180deg, rgba(28, 32, 24, 0.98), rgba(8, 10, 8, 0.99)),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.025) 0, rgba(255, 255, 255, 0.025) 1px, transparent 1px, transparent 10px);
    box-shadow: 0 30px 90px rgba(0, 0, 0, 0.68);
}

.sasquatch-encounter-card {
    max-height: min(88vh, 720px);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-color: rgba(199, 164, 101, 0.72) rgba(6, 8, 6, 0.7);
}

.story-lead-card-modal {
    width: min(680px, 100%);
    max-height: min(84vh, 760px);
    overflow-y: auto;
    overscroll-behavior: contain;
    background:
        radial-gradient(circle at 80% 12%, rgba(150, 95, 45, 0.16), transparent 26%),
        linear-gradient(180deg, rgba(35, 29, 20, 0.98), rgba(12, 10, 7, 0.99)),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.025) 0, rgba(255, 255, 255, 0.025) 1px, transparent 1px, transparent 10px);
    scrollbar-color: rgba(199, 164, 101, 0.72) rgba(6, 8, 6, 0.7);
}

.sasquatch-encounter-card h2,
.story-lead-card-modal h2 {
    margin: 0;
    color: #f2e6c8;
    font-family: var(--font-display);
    font-size: clamp(2rem, 8vw, 3.4rem);
    line-height: 0.92;
    text-transform: uppercase;
}

.sasquatch-encounter-image {
    width: 100%;
    max-height: 260px;
    object-fit: cover;
    object-position: center;
    border: 1px solid rgba(211, 178, 115, 0.32);
    border-radius: 4px;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.28);
}

.sasquatch-encounter-image[hidden] {
    display: none;
}

.story-lead-image {
    width: 100%;
    height: clamp(220px, 38vh, 360px);
    object-fit: contain;
    object-position: center;
    background:
        radial-gradient(circle at 50% 24%, rgba(229, 196, 135, 0.1), transparent 32%),
        rgba(5, 7, 5, 0.72);
    border: 1px solid rgba(211, 178, 115, 0.34);
    border-radius: 4px;
    box-shadow:
        inset 0 0 0 1px rgba(0, 0, 0, 0.28),
        0 12px 30px rgba(0, 0, 0, 0.28);
}

.story-lead-image.is-portrait-art {
    height: clamp(300px, 52vh, 500px);
    object-position: center top;
}

.story-lead-image[hidden] {
    display: none;
}

.sasquatch-encounter-card p,
.sasquatch-encounter-card small,
.story-lead-card-modal p,
.story-lead-card-modal small {
    margin: 0;
    color: rgba(236, 224, 194, 0.74);
}

.sasquatch-encounter-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.sasquatch-encounter-actions button {
    min-height: 38px;
    border-color: rgba(211, 178, 115, 0.38);
    border-radius: 4px;
    background: rgba(8, 10, 8, 0.72);
    color: #f0dfb8;
}

.sasquatch-encounter-actions button:hover {
    border-color: rgba(211, 178, 115, 0.68);
    background: rgba(126, 68, 45, 0.34);
}

.sasquatch-encounter-status {
    padding-top: 4px;
    font-family: var(--font-notes);
}

@media (max-width: 640px) {
    .sasquatch-encounter {
        place-items: start center;
        padding: 10px;
        overflow-y: auto;
    }

    .sasquatch-encounter-card {
        max-height: calc(100vh - 20px);
        gap: 10px;
        padding: 14px;
    }

    .sasquatch-encounter-card h2 {
        font-size: clamp(1.45rem, 9vw, 2.35rem);
        line-height: 1;
    }

    .sasquatch-encounter-image {
        max-height: 34vh;
    }

    .sasquatch-encounter-actions {
        position: sticky;
        bottom: -14px;
        margin-inline: -14px;
        padding: 8px 14px 14px;
        background: linear-gradient(180deg, rgba(12, 14, 11, 0), rgba(8, 10, 8, 0.98) 24%);
    }

    .sasquatch-encounter-actions button {
        flex: 1 1 100%;
    }
}

.story-lead-close {
    justify-self: end;
    min-height: 30px;
    padding: 4px 9px;
    border-color: rgba(211, 178, 115, 0.25);
    background: rgba(5, 7, 5, 0.52);
    color: rgba(236, 224, 194, 0.74);
    font-size: 0.75rem;
}

.story-choice-list {
    display: grid;
    gap: 9px;
}

.story-choice-list button {
    display: grid;
    gap: 5px;
    justify-items: start;
    min-height: 52px;
    padding: 9px 12px;
    border-color: rgba(211, 178, 115, 0.34);
    border-radius: 5px;
    background: rgba(7, 9, 7, 0.72);
    color: #f0dfb8;
    text-align: left;
}

.story-choice-list button:hover {
    border-color: rgba(211, 178, 115, 0.68);
    background: rgba(126, 68, 45, 0.28);
}

.story-choice-list strong {
    font-family: var(--font-display);
    font-size: 1.24rem;
    line-height: 1;
}

.story-choice-list span,
.story-lead-status {
    color: rgba(236, 224, 194, 0.68);
    font-family: var(--font-notes);
}

.story-impact-line {
    display: block;
    color: rgba(215, 178, 117, 0.82);
    font-family: var(--font-notes);
    font-size: 0.78rem;
    line-height: 1.25;
    overflow-wrap: break-word;
}

.origin-story-modal {
    width: min(760px, 100%);
}

.origin-story-modal h3 {
    margin: 0;
    color: #e8c989;
    font-family: var(--font-notes);
    font-size: 1.15rem;
    line-height: 1.15;
    text-transform: uppercase;
}

.origin-story-body {
    display: grid;
    gap: 9px;
    min-width: 0;
}

.origin-story-body p {
    max-width: 68ch;
    color: rgba(247, 233, 202, 0.82);
    font-size: 1rem;
    line-height: 1.5;
}

.origin-action-list button strong {
    font-size: 1.35rem;
}

@media (max-width: 560px) {
    .story-lead-overlay {
        align-items: start;
        padding: 12px 12px 104px;
    }

    .story-lead-card-modal {
        max-height: calc(100dvh - 128px);
        gap: 10px;
        padding: 14px;
    }

    .story-lead-card-modal h2 {
        font-size: clamp(1.8rem, 12vw, 2.45rem);
    }

    .story-lead-image {
        height: min(300px, 40vh);
    }

    .story-lead-image.is-portrait-art {
        height: min(380px, 50vh);
    }

    .story-choice-list button {
        min-height: 48px;
    }
}

.eyebrow {
    margin: 0 0 8px;
    color: var(--tan);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.dashboard-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
}

.panel {
    padding: 16px;
}

.diagnostics-panel {
    display: grid;
    gap: 16px;
    max-width: 900px;
    margin: 18px auto;
}

.diagnostics-panel .stat-list div {
    align-items: start;
}

.diagnostics-output {
    min-height: 180px;
    overflow: auto;
    margin: 0;
    padding: 14px;
    border: 1px solid rgba(200, 166, 108, 0.24);
    border-radius: 6px;
    background: #060806;
    color: #d8e8cf;
    white-space: pre-wrap;
}

meter {
    grid-column: 1 / -1;
    width: 100%;
    height: 12px;
}

.stat-list {
    display: grid;
    gap: 8px;
    margin: 0;
}

.stat-list div {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 8px 0;
    border-bottom: 1px solid rgba(56, 65, 51, 0.62);
}

.stat-list dt {
    color: var(--muted);
}

.upgrade-card {
    display: grid;
    gap: 6px;
    margin-top: 12px;
    padding: 12px;
    border: 1px dashed rgba(82, 57, 32, 0.34);
    border-radius: 4px;
    background: rgba(74, 52, 28, 0.07);
}

.upgrade-card span,
.upgrade-card small {
    color: rgba(43, 33, 22, 0.66);
    font-family: var(--font-notes);
    font-size: 0.84rem;
}

.upgrade-card h3 {
    margin: 0;
    color: #2d2014;
    font-family: var(--font-display);
    font-size: 1.2rem;
    text-transform: uppercase;
}

.upgrade-card p {
    margin: 0;
    color: rgba(43, 33, 22, 0.78);
}

.upgrade-card button {
    justify-self: start;
    margin-top: 4px;
}

.stat-list dd {
    margin: 0;
    font-weight: 800;
}

.travel-list {
    display: grid;
    gap: 8px;
    margin-top: 12px;
}

.travel-option {
    display: grid;
    min-height: 58px;
    padding: 10px 12px;
    border-color: var(--line);
    background: #151b14;
    color: var(--text);
    text-align: left;
}

.travel-option small {
    color: var(--muted);
    font-weight: 400;
}

.activity-list {
    display: grid;
    gap: 10px;
    margin: 0;
    padding-left: 18px;
}

.activity-list li {
    color: var(--text);
}

.activity-list time {
    display: block;
    color: var(--faint);
    font-size: 0.82rem;
}

.action-list {
    display: grid;
    gap: 10px;
}

.action-list article {
    display: grid;
    gap: 5px;
    padding: 10px 0;
    border-bottom: 1px dashed rgba(82, 57, 32, 0.26);
}

.action-list article:last-child {
    border-bottom: 0;
}

.action-list span,
.action-list small {
    display: block;
    color: rgba(43, 33, 22, 0.66);
    font-family: var(--font-notes);
    font-size: 0.84rem;
}

.action-list h3 {
    margin: 2px 0 4px;
    color: #2d2014;
    font-family: var(--font-display);
    font-size: 1.15rem;
    text-transform: uppercase;
}

.action-list p {
    margin: 0 0 4px;
    color: rgba(43, 33, 22, 0.78);
}

.action-button {
    justify-self: start;
    min-height: 32px;
    margin-top: 4px;
    padding: 6px 10px;
    border-radius: 4px;
    font-size: 0.78rem;
}

.hunt-list {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 12px;
    margin-top: 16px;
}

.hunt-card {
    display: grid;
    gap: 6px;
    padding: 13px;
    border: 1px solid rgba(82, 57, 32, 0.34);
    border-radius: 4px;
    background:
        linear-gradient(90deg, rgba(55, 79, 49, 0.1), transparent 48%),
        rgba(74, 52, 28, 0.08);
    font-family: var(--font-notes);
}

.hunt-card span,
.hunt-card small {
    color: rgba(76, 48, 25, 0.72);
    font-size: 0.84rem;
}

.hunt-card h2 {
    margin: 0;
    color: #281d13;
    font-family: var(--font-display);
    font-size: 1.32rem;
    text-transform: uppercase;
}

.hunt-card p {
    margin: 0;
    color: rgba(43, 33, 22, 0.78);
}

.hunt-button {
    justify-self: start;
    min-height: 34px;
    margin-top: 4px;
    padding: 6px 12px;
    border-radius: 4px;
    font-size: 0.78rem;
}

.hunt-button:disabled {
    cursor: not-allowed;
    opacity: 0.48;
}

.home-page .page-shell {
    width: min(1360px, 100%);
}

.home-command {
    display: grid;
    gap: 14px;
}

.command-status-bar,
.county-briefing,
.command-panel {
    border: 1px solid rgba(173, 140, 88, 0.26);
    border-radius: 6px;
    background:
        linear-gradient(180deg, rgba(28, 33, 25, 0.96), rgba(9, 11, 8, 0.98)),
        #10130f;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.38);
}

.command-status-bar {
    display: grid;
    grid-template-columns: minmax(360px, 0.95fr) minmax(380px, 1.18fr) minmax(220px, 0.62fr);
    gap: 14px;
    align-items: stretch;
    padding: 14px;
    background:
        linear-gradient(90deg, rgba(7, 9, 7, 0.94), rgba(27, 32, 24, 0.96)),
        radial-gradient(circle at 76% 24%, rgba(83, 118, 90, 0.16), transparent 28%),
        #0d100c;
}

.command-player {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 22px;
    align-items: center;
    min-width: 0;
}

.command-player > div {
    min-width: 0;
    padding-left: 6px;
}

.command-avatar {
    width: 60px;
    height: 88px;
    justify-self: start;
    margin: 0;
    border-radius: 5px;
    border-color: rgba(199, 164, 101, 0.3);
    box-shadow: none;
}

.command-player h1,
.county-briefing h2,
.command-panel h2 {
    margin: 0;
    color: #f2e6c8;
    font-family: var(--font-display);
    line-height: 0.96;
    text-transform: uppercase;
}

.command-player h1 {
    font-size: clamp(1.55rem, 2.4vw, 2.35rem);
    overflow-wrap: anywhere;
}

.command-player .eyebrow,
.command-player span {
    overflow-wrap: anywhere;
}

.command-player span,
.command-weather span,
.command-weather small,
.command-panel p,
.county-briefing p,
.command-panel small {
    color: rgba(236, 224, 194, 0.72);
}

.command-vitals {
    display: grid;
    grid-template-columns: repeat(4, minmax(92px, 1fr));
    gap: 8px;
}

.command-vitals div {
    display: grid;
    gap: 3px;
    align-content: center;
    min-width: 0;
    padding: 10px;
    border: 1px solid rgba(173, 140, 88, 0.18);
    border-radius: 5px;
    background: rgba(4, 6, 4, 0.48);
}

.command-vitals div,
.command-weather,
.briefing-list article,
.active-objectives article,
.field-tasks article,
.snapshot-list div,
.compact-report div {
    min-width: 0;
}

.command-vitals span,
.snapshot-list dt,
.compact-report dt,
.briefing-heading span,
.active-objectives article span,
.action-list span {
    color: #b99b65;
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.command-vitals strong,
.command-weather strong,
.snapshot-list dd,
.compact-report dd,
.timer-row strong {
    color: #f2e6c8;
    font-family: var(--font-notes);
}

.command-vitals small {
    color: rgba(236, 224, 194, 0.52);
    font-size: 0.74rem;
}

.command-vitals i {
    display: block;
    width: 100%;
    height: 5px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(236, 224, 194, 0.12);
}

.command-vitals i::before {
    content: "";
    display: block;
    width: var(--value);
    height: 100%;
    background: linear-gradient(90deg, #6f8f5f, #c8a66c);
}

.command-weather {
    display: grid;
    align-content: center;
    gap: 4px;
    min-width: 0;
    padding: 10px 12px;
    border-left: 1px solid rgba(173, 140, 88, 0.18);
}

.county-briefing {
    display: grid;
    gap: 14px;
    padding: 18px;
    background:
        linear-gradient(180deg, rgba(35, 36, 27, 0.96), rgba(10, 12, 8, 0.98)),
        radial-gradient(circle at 14% 8%, rgba(134, 85, 48, 0.16), transparent 28%),
        #11140e;
}

.briefing-heading,
.panel-heading {
    display: flex;
    gap: 12px;
    align-items: end;
    justify-content: space-between;
    min-width: 0;
    flex-wrap: wrap;
}

.county-briefing h2 {
    font-size: clamp(1.85rem, 4vw, 3.1rem);
}

.briefing-list {
    display: grid;
    gap: 8px;
}

.briefing-list article,
.active-objectives article,
.field-tasks article {
    display: grid;
    gap: 8px;
    padding: 12px;
    border: 1px solid rgba(173, 140, 88, 0.18);
    border-radius: 5px;
    background: rgba(5, 7, 5, 0.46);
}

.briefing-list article {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
}

.briefing-list p,
.active-objectives p,
.field-tasks p {
    margin: 0;
}

.briefing-list a,
.command-quick-actions a,
.panel-link,
.active-objectives a,
.active-objectives button,
.field-tasks a,
.field-tasks button,
.story-lead-card button,
.timer-row {
    color: #e7d7ac;
    font-weight: 900;
    text-decoration: none;
    text-transform: uppercase;
}

.command-quick-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.command-quick-actions a,
.panel-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 7px 12px;
    border: 1px solid rgba(185, 155, 101, 0.3);
    border-radius: 4px;
    background: rgba(9, 12, 8, 0.68);
    font-size: 0.78rem;
}

.command-quick-actions a.is-primary,
.command-quick-actions a:hover,
.panel-link.is-primary,
.panel-link:hover {
    border-color: rgba(199, 164, 101, 0.62);
    background: rgba(157, 82, 46, 0.22);
    color: #f2e6c8;
}

.active-objectives button,
.field-tasks button,
.story-lead-card button {
    width: fit-content;
    min-height: 32px;
    padding: 6px 10px;
    border-color: rgba(185, 155, 101, 0.28);
    border-radius: 4px;
    background: rgba(9, 12, 8, 0.68);
    font-size: 0.76rem;
}

.active-objectives button:hover,
.field-tasks button:hover,
.story-lead-card button:hover {
    border-color: rgba(199, 164, 101, 0.62);
    background: rgba(157, 82, 46, 0.22);
    color: #f2e6c8;
}

.continue-panel {
    padding: 18px;
    background:
        linear-gradient(135deg, rgba(45, 38, 26, 0.96), rgba(9, 12, 8, 0.98)),
        radial-gradient(circle at 88% 22%, rgba(199, 164, 101, 0.15), transparent 28%),
        #11140e;
}

.continue-panel .panel-heading span {
    color: rgba(236, 224, 194, 0.58);
    font-size: 0.82rem;
    font-weight: 900;
    text-transform: uppercase;
}

.continue-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
    align-items: center;
}

.continue-card h2 {
    margin: 0;
    color: #f2e6c8;
    font-family: var(--font-display);
    font-size: clamp(1.8rem, 4vw, 3.4rem);
    line-height: 0.92;
    text-transform: uppercase;
}

.continue-card p {
    margin: 6px 0 0;
    color: rgba(236, 224, 194, 0.74);
    font-size: 1.05rem;
}

.command-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    grid-template-areas:
        "objectives objectives objectives objectives story story story story tasks tasks tasks tasks"
        "work work work work work work path path path timers timers timers"
        "intel intel intel hunt hunt hunt camp camp camp career career career"
        "market market market property property property threat threat threat travel travel travel";
    gap: 14px;
}

.command-panel {
    display: grid;
    gap: 12px;
    align-content: start;
    min-width: 0;
    padding: 15px;
}

.command-panel h2 {
    font-size: 1.55rem;
}

.command-panel h3 {
    margin: 0;
    color: #f2e6c8;
    font-family: var(--font-display);
    font-size: 1.16rem;
    line-height: 1;
    text-transform: uppercase;
}

.active-objectives {
    grid-area: objectives;
}

.story-missions {
    grid-area: story;
}

.field-tasks {
    grid-area: tasks;
}

.field-work-panel {
    grid-area: work;
}

.hunt-snapshot {
    grid-area: hunt;
}

.intel-panel {
    grid-area: intel;
}

.timers-panel {
    grid-area: timers;
}

.camp-snapshot {
    grid-area: camp;
}

.career-snapshot {
    grid-area: career;
}

.work-stats-panel {
    grid-area: workstats;
}

.market-snapshot {
    grid-area: market;
}

.condition-panel {
    grid-area: shelter;
}

.property-panel {
    grid-area: property;
}

.path-panel {
    grid-area: path;
}

.path-card,
.story-lead-card,
.field-note-preview article {
    display: grid;
    gap: 8px;
    padding: 12px;
    border: 1px solid rgba(173, 140, 88, 0.18);
    border-radius: 5px;
    background:
        linear-gradient(180deg, rgba(13, 17, 12, 0.72), rgba(6, 8, 6, 0.54)),
        radial-gradient(circle at 88% 16%, rgba(95, 162, 199, 0.08), transparent 34%);
}

.path-card > span {
    color: #b99b65;
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.story-lead-card {
    background:
        linear-gradient(180deg, rgba(35, 24, 16, 0.62), rgba(6, 8, 6, 0.54)),
        radial-gradient(circle at 90% 18%, rgba(199, 164, 101, 0.08), transparent 30%);
}

.story-lead-card span {
    color: #b99b65;
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.story-lead-card p {
    margin: 0;
}

.path-meter {
    display: grid;
    gap: 5px;
}

.path-meter span {
    color: rgba(236, 224, 194, 0.72);
    font-size: 0.76rem;
    font-weight: 900;
}

.path-meter i {
    display: block;
    width: 100%;
    height: 6px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(236, 224, 194, 0.12);
}

.path-meter i::before {
    content: "";
    display: block;
    width: var(--value);
    height: 100%;
    background: linear-gradient(90deg, #8b5a39, #d1b16f, #7f9a70);
}

.first-week-list,
.field-note-preview {
    display: grid;
    gap: 8px;
}

.first-week-list a {
    display: grid;
    grid-template-columns: 16px minmax(0, 1fr) auto;
    gap: 9px;
    align-items: center;
    padding: 9px 10px;
    border: 1px solid rgba(173, 140, 88, 0.14);
    border-radius: 4px;
    background: rgba(4, 6, 4, 0.42);
    color: #eadfc3;
    text-decoration: none;
}

.first-week-list a > span {
    width: 11px;
    height: 11px;
    border: 1px solid rgba(199, 164, 101, 0.74);
    border-radius: 999px;
}

.first-week-list a.is-done > span {
    background: #8da672;
    box-shadow: 0 0 0 3px rgba(141, 166, 114, 0.16);
}

.first-week-list strong,
.field-note-preview strong {
    color: #f2e6c8;
}

.first-week-list small,
.field-note-preview small {
    color: rgba(236, 224, 194, 0.54);
    font-size: 0.72rem;
    text-transform: uppercase;
}

.shelter-card-visual {
    display: grid;
    gap: 8px;
    justify-items: center;
    margin: 0;
    padding: 10px;
    border: 1px solid rgba(173, 140, 88, 0.18);
    border-radius: 5px;
    background:
        radial-gradient(ellipse at 50% 78%, rgba(0, 0, 0, 0.32), transparent 64%),
        linear-gradient(180deg, rgba(9, 12, 8, 0.62), rgba(4, 6, 4, 0.34));
}

.shelter-card-visual img {
    display: block;
    width: min(100%, 320px);
    height: clamp(150px, 20vw, 230px);
    object-fit: contain;
    filter: drop-shadow(0 18px 18px rgba(0, 0, 0, 0.48)) saturate(0.92) contrast(0.98);
}

.home-shelter-preview img {
    height: clamp(120px, 14vw, 190px);
}

.shelter-card-visual figcaption {
    color: rgba(236, 224, 194, 0.62);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.threat-panel {
    grid-area: threat;
}

.crime-panel {
    grid-area: crime;
}

.travel-panel {
    grid-area: travel;
}

.stats-panel {
    grid-area: character;
}

.field-tasks article {
    grid-template-columns: 14px minmax(0, 1fr) auto;
    align-items: center;
}

.field-tasks article > span {
    width: 9px;
    height: 9px;
    border: 1px solid rgba(199, 164, 101, 0.7);
    border-radius: 999px;
}

.snapshot-list,
.compact-report {
    display: grid;
    gap: 8px;
    margin: 0;
}

.snapshot-list div,
.compact-report div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 7px;
    border-bottom: 1px dashed rgba(173, 140, 88, 0.2);
}

.snapshot-list dd,
.compact-report dd {
    margin: 0;
    text-align: right;
}

.snapshot-list dd.is-good {
    color: #a9cb83;
}

.snapshot-list dd.is-fair {
    color: #d7bd78;
}

.snapshot-list dd.is-poor {
    color: #d88363;
}

.intel-grid {
    display: grid;
    gap: 8px;
}

.intel-grid a {
    display: grid;
    gap: 2px;
    padding: 10px;
    border: 1px solid rgba(173, 140, 88, 0.16);
    border-radius: 5px;
    background: rgba(5, 7, 5, 0.44);
    color: inherit;
    text-decoration: none;
}

.intel-grid a:hover {
    border-color: rgba(216, 181, 112, 0.42);
    background: rgba(11, 15, 10, 0.72);
}

.intel-grid strong {
    color: #f2e6c8;
    font-family: var(--font-display);
    font-size: 1.55rem;
    line-height: 1;
}

.intel-grid span {
    color: #d7bd78;
    font-weight: 900;
    text-transform: uppercase;
}

.timer-row {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px dashed rgba(173, 140, 88, 0.22);
}

.career-mini-meter {
    display: grid;
    gap: 6px;
}

.career-mini-meter span {
    color: rgba(236, 224, 194, 0.72);
}

.command-panel .quiet-message {
    border: 1px solid rgba(173, 140, 88, 0.18);
    border-radius: 4px;
    padding: 9px 10px;
    background: rgba(5, 7, 5, 0.44);
    color: rgba(236, 224, 194, 0.72);
}

.command-action-list {
    max-height: 520px;
    overflow: auto;
    padding-right: 4px;
}

.command-action-list article {
    border-bottom-color: rgba(173, 140, 88, 0.18);
}

.command-action-list h3,
.command-action-list p,
.command-action-list span,
.command-action-list small {
    color: inherit;
}

.command-action-list span,
.command-action-list small {
    color: rgba(236, 224, 194, 0.56);
}

.command-action-list h3 {
    color: #f2e6c8;
}

.command-action-list p {
    color: rgba(236, 224, 194, 0.74);
}

.command-action-list .action-button {
    border-color: rgba(185, 155, 101, 0.3);
    background: rgba(9, 12, 8, 0.68);
    color: #e7d7ac;
}

.command-activity-list li {
    color: rgba(236, 224, 194, 0.82);
}

.command-activity-list time {
    color: rgba(236, 224, 194, 0.46);
}

.survivor-page .page-shell {
    width: min(1280px, 100%);
}

.survivor-board {
    display: grid;
    gap: 14px;
}

.survivor-header,
.survivor-layout,
.survivor-card,
.survivor-note {
    border: 1px solid rgba(173, 140, 88, 0.26);
    border-radius: 6px;
    background:
        linear-gradient(180deg, rgba(28, 33, 25, 0.96), rgba(9, 11, 8, 0.98)),
        #10130f;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.38);
}

.survivor-header {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(420px, 1.1fr);
    gap: 16px;
    padding: 18px;
}

.survivor-header h1,
.survivor-note h2,
.survivor-card h2 {
    margin: 0;
    color: #f2e6c8;
    font-family: var(--font-display);
    line-height: 0.96;
    text-transform: uppercase;
}

.survivor-header h1 {
    font-size: clamp(2rem, 5vw, 3.6rem);
}

.survivor-header p,
.survivor-card p,
.survivor-card small,
.survivor-note p,
.survivor-note li {
    color: rgba(236, 224, 194, 0.72);
}

.survivor-status {
    display: grid;
    grid-template-columns: repeat(2, minmax(130px, 1fr));
    gap: 8px;
    margin: 0;
}

.survivor-status div {
    display: grid;
    gap: 3px;
    padding: 10px;
    border: 1px solid rgba(173, 140, 88, 0.18);
    border-radius: 5px;
    background: rgba(4, 6, 4, 0.48);
}

.survivor-status dt,
.survivor-card span,
.survivor-note span {
    color: #b99b65;
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.survivor-status dd {
    margin: 0;
    color: #f2e6c8;
    font-family: var(--font-notes);
}

.survivor-board > .quiet-message {
    border: 1px solid rgba(173, 140, 88, 0.2);
    border-radius: 4px;
    padding: 10px 12px;
    background: rgba(5, 7, 5, 0.5);
    color: rgba(236, 224, 194, 0.78);
}

.survivor-victory-panel {
    display: grid;
    gap: 14px;
    padding: 16px;
    border: 1px solid rgba(216, 131, 99, 0.42);
    border-radius: 6px;
    background:
        linear-gradient(180deg, rgba(46, 25, 18, 0.94), rgba(11, 12, 8, 0.98)),
        #15100c;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.38);
}

.survivor-victory-head {
    display: grid;
    grid-template-columns: 74px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
}

.survivor-victory-avatar.profile-portrait {
    width: 74px;
    max-width: 74px;
    height: 74px;
    margin: 0;
    border-radius: 5px;
}

.survivor-victory-panel h2 {
    margin: 0;
    color: #f2e6c8;
    font-family: var(--font-display);
    font-size: clamp(1.45rem, 3vw, 2.15rem);
    line-height: 1;
    text-transform: uppercase;
}

.survivor-victory-panel p {
    margin: 4px 0 0;
    color: rgba(236, 224, 194, 0.74);
}

.survivor-victory-actions {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
}

.pvp-victory-choice-button {
    display: grid;
    gap: 4px;
    align-content: start;
    min-height: 92px;
    padding: 9px;
    border-color: rgba(216, 181, 112, 0.32);
    border-radius: 4px;
    background: rgba(8, 10, 8, 0.64);
    color: #e7d7ac;
    text-align: left;
}

.pvp-victory-choice-button strong {
    color: #f2e6c8;
    font-size: 0.78rem;
    line-height: 1.1;
    text-transform: uppercase;
}

.pvp-victory-choice-button span {
    color: rgba(236, 224, 194, 0.64);
    font-size: 0.72rem;
    line-height: 1.25;
    text-transform: none;
}

.pvp-victory-choice-button:hover {
    border-color: rgba(216, 131, 99, 0.64);
    background: rgba(109, 46, 35, 0.28);
}

.survivor-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.65fr);
    gap: 0;
    overflow: hidden;
}

.survivor-targets {
    display: grid;
    gap: 10px;
    align-content: start;
    padding: 16px;
    border-right: 1px solid rgba(173, 140, 88, 0.18);
}

.survivor-card {
    display: grid;
    grid-template-columns: 84px minmax(0, 1fr) minmax(190px, auto);
    gap: 16px;
    align-items: center;
    padding: 13px;
    box-shadow: none;
}

.survivor-avatar-link {
    display: block;
    width: 84px;
    height: 84px;
    border-radius: 5px;
}

.survivor-avatar {
    display: block;
    width: 84px;
    height: 84px;
    margin: 0;
    border-radius: 5px;
    border-color: rgba(199, 164, 101, 0.3);
    box-shadow: none;
}

.survivor-card-main,
.survivor-card > div:not(.survivor-avatar) {
    min-width: 0;
}

.survivor-card h2 {
    font-size: clamp(1.35rem, 2.4vw, 1.8rem);
}

.survivor-card p {
    margin: 4px 0;
}

.survivor-card-read {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    margin: 8px 0;
}

.survivor-card-read div {
    padding: 7px 8px;
    border: 1px solid rgba(173, 140, 88, 0.16);
    border-radius: 4px;
    background: rgba(4, 6, 4, 0.38);
}

.survivor-card-read dt,
.survivor-card-read dd {
    margin: 0;
    font-size: 0.75rem;
}

.survivor-card-read dt {
    color: rgba(236, 224, 194, 0.48);
    font-weight: 900;
    text-transform: uppercase;
}

.survivor-card-read dd {
    color: rgba(236, 224, 194, 0.78);
    font-family: var(--font-notes);
}

.survivor-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 7px;
    justify-items: stretch;
    min-width: 0;
}

.survivor-actions a,
.pvp-scout-button,
.pvp-attack-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 7px 12px;
    border-radius: 4px;
    border: 1px solid rgba(185, 155, 101, 0.34);
    background: rgba(8, 10, 8, 0.64);
    color: #e7d7ac;
    font-size: 0.78rem;
    font-weight: 900;
    text-decoration: none;
    text-transform: uppercase;
}

.pvp-attack-button {
    border-color: rgba(141, 50, 36, 0.62);
    background: linear-gradient(180deg, rgba(109, 46, 35, 0.88), rgba(63, 24, 20, 0.92));
    color: #f0d2b6;
}

.pvp-scout-button {
    background: rgba(77, 88, 60, 0.42);
}

.survivor-actions a:hover,
.pvp-scout-button:hover {
    border-color: rgba(199, 164, 101, 0.64);
    background: rgba(122, 94, 52, 0.28);
}

.pvp-scout-button:disabled,
.pvp-attack-button:disabled,
.pvp-victory-choice-button:disabled {
    cursor: not-allowed;
    opacity: 0.5;
}

.survivor-sidebar {
    display: grid;
    align-content: start;
    gap: 12px;
    padding: 16px;
}

.survivor-note {
    display: grid;
    gap: 10px;
    padding: 14px;
    box-shadow: none;
}

.survivor-note ul {
    display: grid;
    gap: 7px;
    margin: 0;
    padding-left: 18px;
}

.survivor-note article {
    display: grid;
    gap: 4px;
    padding-top: 9px;
    border-top: 1px dashed rgba(173, 140, 88, 0.2);
}

.survivor-note h3 {
    margin: 0;
    color: #f2e6c8;
    font-family: var(--font-display);
    font-size: 1.05rem;
    line-height: 1;
    text-transform: uppercase;
}

.perk-page .page-shell {
    width: min(1320px, 100%);
}

.perk-board {
    display: grid;
    gap: 14px;
}

.perk-header,
.perk-skill-table-card,
.perk-category,
.perk-card {
    border: 1px solid rgba(173, 140, 88, 0.26);
    border-radius: 6px;
    background:
        linear-gradient(180deg, rgba(28, 33, 25, 0.96), rgba(9, 11, 8, 0.98)),
        #10130f;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.36);
}

.perk-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 0.45fr);
    gap: 16px;
    align-items: center;
    padding: 18px;
}

.perk-header h1,
.perk-category h2,
.perk-card h3,
.perk-skill-row strong {
    margin: 0;
    color: #f2e6c8;
    font-family: var(--font-display);
    line-height: 0.96;
    text-transform: uppercase;
}

.perk-header h1 {
    font-size: clamp(2.4rem, 6vw, 4.6rem);
}

.perk-header p,
.perk-card p,
.perk-card small {
    color: rgba(236, 224, 194, 0.72);
}

.perk-point-card {
    display: grid;
    gap: 8px;
    margin: 0;
}

.perk-point-card div {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    padding: 10px;
    border: 1px solid rgba(173, 140, 88, 0.18);
    border-radius: 5px;
    background: rgba(4, 6, 4, 0.48);
}

.perk-point-card dt,
.perk-card span {
    color: #b99b65;
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.perk-point-card dd {
    margin: 0;
    color: #f2e6c8;
    font-family: var(--font-notes);
    text-align: right;
}

.perk-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.perk-card {
    display: grid;
    gap: 10px;
    align-content: start;
    padding: 15px;
}

.perk-skill-table-card {
    overflow-x: auto;
    padding: 12px;
}

.perk-skill-table {
    display: grid;
    gap: 6px;
    min-width: 720px;
}

.perk-skill-row {
    display: grid;
    grid-template-columns: minmax(170px, 1.2fr) minmax(110px, 0.75fr) minmax(76px, 0.45fr) minmax(150px, 1fr) minmax(120px, 0.65fr);
    gap: 12px;
    align-items: center;
    min-height: 46px;
    padding: 9px 10px;
    border: 1px solid rgba(173, 140, 88, 0.14);
    border-radius: 5px;
    background: rgba(4, 6, 4, 0.38);
}

.perk-skill-row-head {
    min-height: 34px;
    background: rgba(200, 166, 108, 0.1);
}

.perk-skill-row span,
.perk-skill-row strong {
    min-width: 0;
    overflow-wrap: normal;
}

.perk-skill-row span,
.perk-skill-row-head span {
    color: rgba(236, 224, 194, 0.72);
    font-family: var(--font-notes);
    white-space: nowrap;
}

.perk-skill-row-head span {
    color: #b99b65;
    font-family: var(--font-body);
    font-size: 0.74rem;
    font-weight: 900;
    text-transform: uppercase;
}

.perk-meter {
    display: grid;
    gap: 7px;
}

.perk-meter span {
    color: rgba(236, 224, 194, 0.68);
    font-family: var(--font-notes);
}

.perk-meter i {
    display: block;
    height: 8px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(236, 224, 194, 0.12);
}

.perk-meter i::before {
    content: "";
    display: block;
    width: var(--value);
    height: 100%;
    background: linear-gradient(90deg, #6f8f5f, #c8a66c);
}

.perk-category {
    display: grid;
    gap: 14px;
    padding: 16px;
}

.perk-card.is-owned {
    border-color: rgba(111, 143, 95, 0.42);
}

.perk-buy-button {
    justify-self: start;
    min-height: 34px;
    padding: 7px 12px;
    border-radius: 4px;
    border-color: rgba(185, 155, 101, 0.34);
    background: rgba(77, 88, 60, 0.42);
    color: #e7d7ac;
    font-size: 0.78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.perk-buy-button:disabled {
    cursor: not-allowed;
    opacity: 0.48;
}

@media (max-width: 920px) {
    .survivor-header,
    .survivor-layout,
    .perk-header,
    .perk-card-grid {
        grid-template-columns: 1fr;
    }

    .survivor-targets {
        border-right: 0;
        border-bottom: 1px solid rgba(173, 140, 88, 0.18);
    }

    .survivor-card {
        grid-template-columns: 78px minmax(0, 1fr);
    }

    .survivor-avatar-link,
    .survivor-avatar {
        width: 78px;
        height: 78px;
    }

    .survivor-actions {
        grid-column: 1 / -1;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .survivor-victory-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 560px) {
    .survivor-status,
    .survivor-card {
        grid-template-columns: 1fr;
    }

    .survivor-header,
    .survivor-targets,
    .survivor-sidebar {
        padding: 12px;
    }

    .survivor-avatar-link,
    .survivor-avatar {
        width: 72px;
        height: 72px;
    }

    .survivor-card-read,
    .survivor-actions,
    .survivor-victory-head,
    .survivor-victory-actions {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 1120px) {
    .command-status-bar {
        grid-template-columns: 1fr;
    }

    .command-player {
        grid-template-columns: 66px minmax(0, 1fr);
        gap: 14px;
    }

    .command-avatar {
        width: 54px;
        height: 76px;
    }

    .command-player > div {
        padding-left: 4px;
    }

    .command-player h1 {
        font-size: clamp(1.55rem, 4.5vw, 2.45rem);
    }

    .command-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-areas:
            "objectives story"
            "tasks path"
            "work work"
            "intel timers"
            "hunt camp"
            "career market"
            "property threat"
            "travel travel";
    }

    .command-weather {
        border-left: 0;
        border-top: 1px solid rgba(173, 140, 88, 0.18);
    }
}

@media (max-width: 760px) {
    .continue-card {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .continue-card .panel-link {
        justify-self: start;
    }

    .command-vitals {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .command-grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "objectives"
            "story"
            "tasks"
            "path"
            "work"
            "intel"
            "timers"
            "hunt"
            "camp"
            "career"
            "market"
            "property"
            "threat"
            "travel";
    }

    .briefing-list article,
    .field-tasks article {
        grid-template-columns: 1fr;
    }

    .command-action-list {
        max-height: none;
    }
}

/* Keep expandable detail rows hidden until their parent row is opened. */
.home-data-table tr.table-detail-drawer {
    display: none;
}

.home-data-table tr.table-detail-drawer.is-open {
    display: table-row;
}

@media (max-width: 760px) {
    .home-data-table tr.table-detail-drawer.is-open {
        display: block;
    }

    .home-data-table tr.table-detail-drawer td {
        display: block;
        width: 100%;
    }

    .table-detail-inner,
    .table-detail-inner dl {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 520px) {
    .command-player {
        grid-template-columns: 54px minmax(0, 1fr);
        gap: 10px;
    }

    .command-avatar {
        width: 48px;
        height: 62px;
    }

    .command-player > div {
        padding-left: 0;
    }

    .command-vitals {
        grid-template-columns: 1fr;
    }

    .briefing-heading,
    .panel-heading {
        align-items: start;
        flex-direction: column;
    }
}

.hunt-page {
    background:
        linear-gradient(180deg, rgba(8, 10, 8, 0.28), rgba(8, 10, 8, 0.86)),
        radial-gradient(circle at 12% 10%, rgba(92, 111, 66, 0.18), transparent 33%),
        radial-gradient(circle at 82% 4%, rgba(156, 127, 76, 0.12), transparent 29%),
        #0b0f0b;
}

.hunt-page .page-shell {
    width: min(1360px, 100%);
}

.hunt-board {
    display: grid;
    gap: 14px;
}

.hunt-board-header,
.hunt-tabs,
.hunt-board-layout,
.hunt-panel,
.hunt-detail-card {
    border: 1px solid rgba(147, 121, 76, 0.28);
    border-radius: 6px;
    background:
        linear-gradient(180deg, rgba(28, 34, 24, 0.95), rgba(11, 15, 11, 0.97)),
        #10140e;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.38);
}

.hunt-board-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
    align-items: start;
    padding: 18px;
}

.hunt-current-plan {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 0.62fr);
    gap: 14px;
    align-items: stretch;
    padding: 16px;
    border: 1px solid rgba(147, 121, 76, 0.22);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(32, 38, 27, 0.96), rgba(9, 12, 8, 0.98)),
        radial-gradient(circle at 82% 18%, rgba(126, 94, 49, 0.18), transparent 32%);
}

.hunt-current-plan h2 {
    margin: 0;
    color: #f1dfb7;
    font-family: var(--font-display);
    font-size: clamp(1.8rem, 4vw, 3.3rem);
    line-height: 0.94;
    text-transform: uppercase;
}

.hunt-current-plan p {
    margin: 8px 0 0;
    color: rgba(234, 223, 195, 0.74);
}

.hunt-current-plan dl {
    display: grid;
    gap: 8px;
    margin: 0;
}

.hunt-current-plan dl div {
    display: grid;
    gap: 2px;
    padding: 9px 10px;
    border: 1px solid rgba(147, 121, 76, 0.2);
    border-radius: 5px;
    background: rgba(5, 7, 5, 0.42);
}

.hunt-current-plan dt,
.hunt-current-plan dd {
    margin: 0;
}

.hunt-current-plan dt {
    color: #b99b65;
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.hunt-current-plan dd {
    color: #f1dfb7;
    font-family: var(--font-notes);
}

.hunt-board-header h1 {
    margin: 0;
    color: #f2ead5;
    font-family: var(--font-display);
    font-size: clamp(2.35rem, 4.2vw, 3.45rem);
    line-height: 0.96;
    overflow-wrap: break-word;
    text-wrap: balance;
    text-transform: uppercase;
    word-break: normal;
}

.hunt-board-header p {
    margin: 6px 0 0;
    color: rgba(232, 222, 197, 0.72);
}

.hunt-conditions {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px;
}

.hunt-conditions div,
.hunt-record-grid div,
.hunt-intel-list div {
    display: grid;
    gap: 3px;
}

.hunt-conditions span,
.hunt-panel-heading small,
.hunt-target-card span,
.hunt-target-card dt,
.hunt-intel-list dt,
.hunt-log-list span {
    color: #b99b65;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.hunt-conditions strong,
.hunt-target-card dd,
.hunt-intel-list dd,
.hunt-record-grid dd {
    color: #f2ead5;
    font-family: var(--font-notes);
}

.hunt-board > .quiet-message {
    border: 1px solid rgba(147, 121, 76, 0.22);
    border-radius: 4px;
    padding: 10px 12px;
    background: rgba(7, 9, 7, 0.58);
    color: rgba(232, 222, 197, 0.78);
}

.hunt-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 10px;
}

.hunt-tabs button {
    min-height: 34px;
    padding: 6px 12px;
    border-color: rgba(185, 155, 101, 0.28);
    background: rgba(185, 155, 101, 0.08);
    color: #d7c18e;
    font-size: 0.78rem;
}

.hunt-tabs button.is-active,
.hunt-tabs button:hover {
    border-color: rgba(185, 155, 101, 0.62);
    background: rgba(185, 155, 101, 0.18);
    color: #f2ead5;
}

.hunt-board-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
    overflow: hidden;
}

.hunt-main {
    min-width: 0;
    padding: 16px;
}

.hunt-intel-panel {
    display: grid;
    align-content: start;
    gap: 12px;
    padding: 16px;
}

.hunt-intel-panel-wide {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding-top: 0;
}

.hunt-panel {
    display: none;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.hunt-panel.is-active {
    display: grid;
    gap: 14px;
}

.hunt-panel-heading {
    display: flex;
    gap: 12px;
    align-items: end;
    justify-content: space-between;
}

.hunt-panel-heading h2,
.hunt-detail-card h2 {
    margin: 0;
    color: #f2ead5;
    font-family: var(--font-display);
    font-size: clamp(1.6rem, 4vw, 2.4rem);
    line-height: 0.95;
    text-transform: uppercase;
}

.hunt-target-grid,
.hunt-scout-grid,
.hunt-log-list {
    display: grid;
    gap: 10px;
}

.hunt-target-grid {
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
}

.hunt-target-card,
.hunt-scout-grid article,
.hunt-log-list article {
    display: grid;
    gap: 8px;
    padding: 14px;
    border: 1px solid rgba(147, 121, 76, 0.22);
    border-radius: 5px;
    background:
        linear-gradient(135deg, rgba(59, 79, 45, 0.18), transparent 48%),
        rgba(5, 7, 5, 0.48);
    color: #e8dec5;
}

.hunt-target-card {
    cursor: pointer;
}

.hunt-target-card:hover,
.hunt-target-card.is-selected {
    border-color: rgba(185, 155, 101, 0.54);
    background:
        linear-gradient(135deg, rgba(83, 111, 61, 0.22), transparent 48%),
        rgba(90, 74, 45, 0.18);
}

.hunt-target-card h3,
.hunt-scout-grid h3,
.hunt-log-list h3 {
    margin: 0;
    color: #f2ead5;
    font-family: var(--font-display);
    font-size: 1.35rem;
    line-height: 0.98;
    text-transform: uppercase;
}

.hunt-target-card p,
.hunt-scout-grid p,
.hunt-log-list p,
.hunt-detail-card p {
    margin: 0;
    color: rgba(232, 222, 197, 0.76);
}

.hunt-target-card dl,
.hunt-record-grid,
.hunt-intel-list {
    display: grid;
    gap: 8px;
    margin: 0;
}

.hunt-target-card dl {
    grid-template-columns: repeat(3, 1fr);
}

.hunt-target-card dd,
.hunt-record-grid dd,
.hunt-intel-list dd {
    margin: 0;
}

.hunt-board .hunt-button,
.hunt-scout-button {
    justify-self: start;
    min-height: 34px;
    padding: 6px 12px;
    border-radius: 4px;
    border-color: rgba(185, 155, 101, 0.32);
    background: rgba(15, 18, 13, 0.72);
    color: #e7d7ac;
    font-size: 0.78rem;
}

.hunt-board .hunt-button:disabled,
.hunt-scout-button:disabled {
    cursor: not-allowed;
    opacity: 0.48;
}

.hunt-detail-card {
    display: grid;
    gap: 10px;
    padding: 15px;
    box-shadow: none;
}

.hunt-detail-card .mission-lines span {
    border-color: rgba(185, 155, 101, 0.22);
    background: rgba(185, 155, 101, 0.08);
    color: #e8dec5;
}

.hunt-intel-list {
    gap: 9px;
}

.hunt-intel-list div {
    grid-template-columns: minmax(92px, 1fr) auto;
    align-items: baseline;
}

.hunt-report-list {
    display: grid;
    gap: 8px;
}

.hunt-report-list span {
    padding-left: 10px;
    border-left: 2px solid rgba(185, 155, 101, 0.32);
    color: rgba(232, 222, 197, 0.74);
    font-family: var(--font-notes);
}

.hunt-record-grid {
    grid-template-columns: repeat(4, minmax(120px, 1fr));
}

.hunt-record-grid div {
    padding: 12px;
    border: 1px solid rgba(147, 121, 76, 0.22);
    border-radius: 5px;
    background: rgba(5, 7, 5, 0.42);
}

.hunt-record-grid dt {
    color: #b99b65;
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
}

@media (max-width: 980px) {
    .hunt-board-header,
    .hunt-current-plan,
    .hunt-board-layout,
    .hunt-conditions,
    .hunt-record-grid {
        grid-template-columns: 1fr;
    }

    .hunt-main {
        border-right: 0;
        border-bottom: 1px solid rgba(147, 121, 76, 0.22);
    }

    .hunt-panel-heading {
        align-items: start;
        flex-direction: column;
    }

    .hunt-target-card dl {
        grid-template-columns: 1fr;
    }
}

.market-buy-button {
    justify-self: start;
    min-height: 34px;
    margin-top: 4px;
    padding: 6px 12px;
    border-radius: 4px;
    font-size: 0.78rem;
}

.market-buy-button:disabled {
    cursor: not-allowed;
    opacity: 0.48;
}

.market-page {
    background:
        linear-gradient(180deg, rgba(7, 9, 7, 0.88), rgba(15, 13, 9, 0.95)),
        #11100c;
}

.market-page .page-shell {
    width: min(1320px, 100%);
}

.market-hall {
    display: grid;
    gap: 14px;
}

.market-sign,
.market-panel,
.market-message,
.market-board-card {
    border: 1px solid rgba(185, 142, 85, 0.28);
    border-radius: 6px;
    background:
        linear-gradient(180deg, rgba(42, 32, 21, 0.92), rgba(18, 18, 14, 0.94)),
        #171611;
    box-shadow: 0 20px 52px rgba(0, 0, 0, 0.42);
}

.market-sign {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
    align-items: start;
    padding: 18px;
    background:
        linear-gradient(90deg, rgba(73, 49, 28, 0.9), rgba(24, 23, 17, 0.96)),
        #21180f;
}

.market-sign h1 {
    margin: 0;
    color: #f2dfb8;
    font-family: var(--font-display);
    font-size: clamp(2.05rem, 5vw, 4rem);
    line-height: 0.96;
    letter-spacing: 0;
    text-transform: uppercase;
    overflow-wrap: normal;
}

.market-status-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin: 0;
}

.market-status-strip div,
.market-ledger {
    border: 1px solid rgba(185, 142, 85, 0.22);
    border-radius: 4px;
    background: rgba(8, 10, 8, 0.52);
}

.market-status-strip div {
    padding: 10px;
}

.market-status-strip dt {
    color: rgba(232, 210, 173, 0.62);
    font-size: 0.72rem;
    text-transform: uppercase;
}

.market-status-strip dd {
    margin: 2px 0 0;
    color: #fff0cc;
    font-weight: 800;
}

.market-tabs {
    display: flex;
    gap: 8px;
    overflow-x: auto;
}

.market-tabs button,
.market-filter-group button,
.market-link-button {
    min-height: 34px;
    padding: 7px 11px;
    border: 1px solid rgba(185, 142, 85, 0.24);
    border-radius: 4px;
    color: #ecd8ae;
    background: rgba(10, 12, 9, 0.68);
}

.market-tabs button.is-active,
.market-tabs button[aria-selected="true"],
.market-filter-group button.is-active {
    color: #1c150d;
    background: #d7af69;
}

.market-message {
    padding: 11px 14px;
    color: #eadfc8;
}

.market-panel {
    display: none;
    gap: 12px;
    padding: 14px;
}

.market-panel.is-active {
    display: grid;
}

.market-panel[data-market-panel="browse"] {
    grid-template-columns: minmax(0, 1fr) minmax(210px, 240px);
    align-items: start;
}

.market-ledger,
.market-board-card {
    padding: 16px;
}

.market-ledger {
    display: grid;
    grid-column: 2;
    gap: 14px;
}

.market-search {
    display: grid;
    gap: 6px;
    color: rgba(232, 210, 173, 0.72);
    font-size: 0.78rem;
    text-transform: uppercase;
}

.market-search input {
    width: 100%;
    min-height: 38px;
    padding: 8px 10px;
    color: #f4e6c8;
    background: rgba(6, 8, 7, 0.72);
    border: 1px solid rgba(185, 142, 85, 0.3);
    border-radius: 4px;
}

.market-filter-group {
    display: grid;
    gap: 6px;
    margin-top: 0;
}

.market-filter-group button {
    display: flex;
    justify-content: space-between;
    gap: 8px;
}

.market-listings {
    display: grid;
    grid-column: 1;
    grid-row: 1;
    gap: 7px;
    min-width: 0;
}

.market-row,
.market-empty,
.market-demand-board article {
    border: 1px solid rgba(185, 142, 85, 0.18);
    border-radius: 4px;
    background:
        linear-gradient(90deg, rgba(92, 68, 38, 0.2), transparent 46%),
        rgba(7, 9, 7, 0.48);
}

.market-empty {
    padding: 14px;
}

.market-row {
    display: grid;
    min-width: 0;
    overflow: hidden;
    padding: 0;
    color: #e8d7b9;
    cursor: pointer;
}

.market-row:hover,
.market-row.is-selected {
    border-color: rgba(223, 184, 112, 0.58);
    background:
        linear-gradient(90deg, rgba(137, 98, 48, 0.28), transparent 50%),
        rgba(10, 12, 9, 0.72);
}

.market-row strong {
    color: #fff0cc;
}

.market-row small,
.market-row span,
.market-board-card p,
.market-demand-board small {
    color: rgba(235, 219, 190, 0.72);
}

.market-row-main {
    display: grid;
    grid-template-columns: 126px minmax(0, 1fr) 58px 70px;
    align-items: stretch;
    min-width: 0;
}

.market-item-media {
    display: grid;
    align-items: center;
    justify-items: center;
    width: 126px;
    min-height: 78px;
    margin: 0;
    border-right: 1px solid rgba(185, 142, 85, 0.18);
    background:
        linear-gradient(135deg, rgba(236, 224, 194, 0.16), rgba(95, 77, 52, 0.1)),
        rgba(236, 224, 194, 0.06);
}

.market-item-media img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 8px;
}

.market-item-media span {
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    border: 1px solid rgba(215, 178, 117, 0.3);
    border-radius: 50%;
    color: rgba(244, 230, 200, 0.76);
    font-family: var(--font-display);
    font-size: 1.35rem;
    line-height: 1;
}

.market-item-summary {
    display: grid;
    gap: 4px;
    align-content: center;
    min-width: 0;
    padding: 10px 14px;
}

.market-item-summary strong,
.market-item-summary span,
.market-item-summary small {
    min-width: 0;
    overflow-wrap: anywhere;
}

.market-quantity {
    display: grid;
    min-width: 0;
    border-left: 1px solid rgba(185, 142, 85, 0.18);
}

.market-quantity input {
    width: 100%;
    min-width: 0;
    padding: 0 6px;
    border: 0;
    border-radius: 0;
    color: #f4e6c8;
    background: rgba(6, 8, 7, 0.44);
    font-size: 0.9rem;
    text-align: center;
}

.market-row .market-buy-button {
    justify-self: stretch;
    width: 100%;
    min-height: 100%;
    margin: 0;
    border-width: 0 0 0 1px;
    border-radius: 0;
    color: #1c150d;
    background: #d7af69;
}

.market-item-drawer {
    display: grid;
    grid-template-columns: minmax(0, 0.85fr) minmax(240px, 1.15fr);
    gap: 12px;
    max-height: 0;
    overflow: hidden;
    padding: 0 14px;
    border-top: 0 solid rgba(185, 142, 85, 0.16);
    opacity: 0;
    transition: max-height 180ms ease, padding 180ms ease, opacity 150ms ease;
}

.market-item-drawer.is-open {
    max-height: 1600px;
    padding: 12px 14px;
    border-top-width: 1px;
    opacity: 1;
}

.market-item-drawer p {
    margin: 0 0 6px;
    color: rgba(235, 219, 190, 0.78);
}

.market-item-drawer small {
    color: rgba(215, 178, 117, 0.82);
}

.market-item-meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 0;
}

.market-item-meta > div {
    min-width: 0;
    padding: 8px;
    border: 1px solid rgba(185, 142, 85, 0.16);
    background: rgba(4, 6, 5, 0.28);
}

.market-item-stat-groups {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    padding-top: 12px;
    border-top: 1px solid rgba(185, 142, 85, 0.18);
}

.market-item-stat-group {
    min-width: 0;
}

.market-item-stat-group h3 {
    margin: 0 0 7px;
    color: #d7af69;
    font-family: var(--font-display);
    font-size: 0.78rem;
    letter-spacing: 0;
    text-transform: uppercase;
}

.market-item-stat-group dl {
    display: grid;
    gap: 0;
    margin: 0;
}

.market-item-stat-group dl > div {
    display: flex;
    min-width: 0;
    justify-content: space-between;
    gap: 10px;
    padding: 6px 0;
    border-bottom: 1px solid rgba(185, 142, 85, 0.12);
}

.market-item-stat-group dd {
    color: #f5d88e;
    font-family: var(--font-display);
    text-align: right;
}

.market-item-purpose {
    display: grid;
    grid-column: 1 / -1;
    gap: 4px;
    padding-top: 12px;
    border-top: 1px solid rgba(185, 142, 85, 0.18);
}

.market-item-purpose strong {
    color: #d7af69;
    font-size: 0.72rem;
    text-transform: uppercase;
}

.market-item-purpose span {
    color: #fff0cc;
}

.market-item-drawer dt {
    color: rgba(232, 210, 173, 0.58);
    font-size: 0.68rem;
    font-weight: 900;
    text-transform: uppercase;
}

.market-item-drawer dd {
    margin: 2px 0 0;
    color: #fff0cc;
    font-family: var(--font-notes);
    overflow-wrap: anywhere;
}

.market-board-card h2 {
    margin: 0 0 8px;
    color: #f1dfba;
    font-family: var(--font-display);
    font-size: 1.65rem;
    letter-spacing: 0;
    text-transform: uppercase;
}

.market-panel:not([data-market-panel="browse"]).is-active {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.market-fee-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 14px 0;
}

.market-fee-list div {
    padding: 10px;
    background: rgba(8, 11, 9, 0.5);
    border: 1px solid rgba(174, 137, 87, 0.18);
    border-radius: 4px;
}

.market-fee-list dt {
    color: rgba(232, 210, 173, 0.66);
    font-size: 0.74rem;
    text-transform: uppercase;
}

.market-fee-list dd {
    margin: 2px 0 0;
    color: #fff0cc;
    font-weight: 800;
}

.market-action-list {
    display: grid;
    gap: 8px;
    margin-top: 14px;
}

.market-action-list article,
.market-demand-board article {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
}

.market-action-list article > div,
.market-demand-board article > div {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.market-action-list span,
.market-demand-board span {
    color: rgba(235, 219, 190, 0.72);
}

.market-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 14px;
}

.market-form label,
.market-inline-form {
    display: grid;
    gap: 5px;
}

.market-form label span {
    color: rgba(232, 210, 173, 0.7);
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
}

.market-form input,
.market-form select,
.market-inline-form input {
    width: 100%;
    min-height: 38px;
    padding: 8px 10px;
    color: #f4e6c8;
    background: rgba(6, 8, 7, 0.72);
    border: 1px solid rgba(185, 142, 85, 0.3);
    border-radius: 4px;
}

.market-form button {
    grid-column: 1 / -1;
}

.market-inline-form {
    grid-template-columns: minmax(86px, 110px) auto;
    align-items: center;
    min-width: 170px;
}

.market-link-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    text-decoration: none;
}

.market-demand-board {
    display: grid;
    gap: 10px;
}

.market-demand-board article {
    display: grid;
    gap: 4px;
}

.work-start-button {
    justify-self: start;
    min-width: 0;
    min-height: 34px;
    margin-top: 4px;
    padding: 6px 12px;
    border-radius: 4px;
    font-size: 0.78rem;
    line-height: 1.12;
    white-space: normal;
}

.work-start-button:disabled {
    cursor: not-allowed;
    opacity: 0.48;
}

.jobs-page .page-shell,
.missions-page .page-shell {
    width: min(1440px, 100%);
}

.jobs-layout,
.missions-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 380px);
    gap: 18px;
    align-items: start;
}

.job-board-frame {
    position: relative;
    min-height: 720px;
    padding: clamp(28px, 4vw, 54px);
    border: 1px solid rgba(215, 160, 93, 0.32);
    border-radius: 4px;
    background:
        linear-gradient(rgba(36, 21, 11, 0.08), rgba(36, 21, 11, 0.18)),
        url('../images/jobs/cork-board-empty.png') center / 100% 100% no-repeat,
        #7a4e2d;
    box-shadow: 0 26px 70px rgba(0, 0, 0, 0.52);
}

.job-board-header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    max-width: 820px;
    margin: 0 auto 18px;
    padding: 12px 18px;
    color: #211910;
    background:
        linear-gradient(90deg, rgba(244, 227, 188, 0.92), rgba(215, 190, 145, 0.86)),
        #e2c999;
    border: 1px solid rgba(63, 42, 23, 0.28);
    box-shadow: 0 7px 16px rgba(46, 25, 10, 0.28);
    transform: rotate(-0.5deg);
}

.job-board-header h1,
.mission-board-header h1 {
    margin: 0;
    color: #201811;
    font-family: var(--font-display);
    font-size: clamp(2rem, 5vw, 4.3rem);
    line-height: 0.9;
    text-transform: uppercase;
}

.job-board-header span,
.job-board-header aside span,
.mission-board-header span {
    color: rgba(31, 24, 17, 0.72);
    font-weight: 700;
    text-transform: uppercase;
}

.job-board-seal {
    display: grid;
    place-items: center;
    width: 68px;
    height: 68px;
    border: 3px double #1f2519;
    border-radius: 50%;
    color: #1f2519;
    font-family: var(--font-display);
    font-size: 1.35rem;
}

.job-board-header aside {
    display: grid;
    justify-items: center;
    min-width: 92px;
    padding: 8px;
    border-left: 1px solid rgba(58, 40, 25, 0.24);
}

.job-board-header aside strong {
    color: #1f281a;
    font-size: 2rem;
    line-height: 1;
}

.board-message {
    width: fit-content;
    max-width: 100%;
    margin: 0 auto 16px;
    padding: 8px 14px;
    color: #1e170f;
    background: rgba(238, 212, 160, 0.92);
    border: 1px solid rgba(58, 40, 25, 0.22);
    border-radius: 3px;
    box-shadow: 0 7px 14px rgba(45, 24, 11, 0.24);
    font-family: var(--font-notes);
}

.career-card-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(130px, 1fr));
    gap: clamp(10px, 1.5vw, 18px);
    max-width: 880px;
    margin: 0 auto;
}

.career-card {
    position: relative;
    margin: 0;
    transform: rotate(var(--tilt, -1deg));
}

.career-card:nth-child(2n) {
    --tilt: 1deg;
}

.career-card:nth-child(3n) {
    --tilt: -0.4deg;
}

.career-card::before,
.mission-posting::before {
    content: "";
    position: absolute;
    top: -8px;
    left: 50%;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background:
        radial-gradient(circle at 32% 28%, #d6a461, #7b4c21 62%, #3c2312);
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.45);
    transform: translateX(-50%);
}

.career-card img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 2px;
    filter: drop-shadow(0 10px 12px rgba(37, 20, 9, 0.5));
}

.mission-posting {
    position: relative;
    display: grid;
    gap: 6px;
    min-width: 0;
    padding: 18px 14px 14px;
    color: #211910;
    background:
        linear-gradient(180deg, rgba(251, 235, 198, 0.94), rgba(216, 188, 137, 0.9)),
        #e0c28b;
    border: 1px solid rgba(56, 35, 18, 0.24);
    border-radius: 3px;
    box-shadow: 0 8px 14px rgba(39, 20, 8, 0.34);
    font-family: var(--font-notes);
    overflow-wrap: anywhere;
}

[data-board-detail] {
    cursor: pointer;
}

[data-board-detail]:focus-visible {
    outline: 3px solid rgba(235, 200, 125, 0.9);
    outline-offset: 4px;
}

.mission-posting.is-selected,
.current-career-panel.is-selected {
    box-shadow:
        0 0 0 3px rgba(92, 41, 23, 0.36),
        0 12px 22px rgba(22, 12, 6, 0.42);
    transform: translateY(-2px);
}

.mission-posting.is-selected::before {
    background:
        radial-gradient(circle at 32% 28%, #f2c47d, #9a2f22 62%, #3b1711);
}

.mission-posting h2,
.job-detail-sheet h2,
.mission-request-sheet h2 {
    margin: 0;
    color: #1f1710;
    font-family: var(--font-display);
    font-size: 1.34rem;
    line-height: 1;
    overflow-wrap: anywhere;
    text-transform: uppercase;
}

.mission-posting p,
.job-detail-sheet p,
.mission-request-sheet p {
    margin: 0;
    color: rgba(31, 23, 15, 0.84);
}

.mission-posting span,
.mission-posting small {
    color: rgba(45, 32, 20, 0.72);
    font-size: 0.82rem;
}

.work-impact-list {
    display: grid;
    gap: 4px;
    margin: 3px 0 0;
    padding: 7px 9px;
    border: 1px dashed rgba(68, 47, 27, 0.28);
    background: rgba(255, 248, 224, 0.36);
    list-style: none;
}

.work-impact-list li {
    color: rgba(39, 28, 17, 0.82);
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1.25;
    overflow-wrap: break-word;
}

.action-impact-list {
    border-color: rgba(205, 169, 110, 0.2);
    background: rgba(8, 10, 8, 0.34);
}

.action-impact-list li {
    color: rgba(234, 223, 195, 0.76);
}

.job-detail-sheet,
.mission-request-sheet {
    min-height: 620px;
    padding: 34px 28px;
    color: #201810;
    background:
        linear-gradient(180deg, rgba(245, 226, 188, 0.94), rgba(213, 184, 135, 0.9)),
        #dfc18e;
    border: 1px solid rgba(79, 51, 27, 0.35);
    border-radius: 6px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
    font-family: var(--font-notes);
}

.job-detail-sheet {
    position: sticky;
    top: 124px;
}

.job-detail-sheet .stamp {
    float: right;
    padding: 8px 10px;
    border: 3px solid rgba(116, 47, 35, 0.66);
    color: rgba(116, 47, 35, 0.82);
    font-weight: 800;
    text-transform: uppercase;
    transform: rotate(8deg);
}

.job-detail-sheet dl,
.mission-lines {
    display: grid;
    gap: 8px;
    margin: 20px 0;
    padding: 16px 0;
    border-top: 1px solid rgba(49, 34, 20, 0.28);
    border-bottom: 1px solid rgba(49, 34, 20, 0.28);
}

.job-detail-sheet dl div,
.mission-lines span {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}

.job-detail-sheet dt {
    font-weight: 800;
}

.job-detail-sheet dd {
    margin: 0;
}

.board-log-list {
    display: grid;
    gap: 8px;
    margin: 10px 0 0;
    padding: 0;
    list-style: none;
}

.board-log-list li {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(49, 34, 20, 0.16);
}

.jobs-layout,
.missions-layout {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 430px);
}

.mission-case-board {
    min-height: 720px;
    padding: clamp(22px, 3vw, 40px);
    border: 12px solid rgba(48, 31, 20, 0.92);
    border-radius: 4px;
    background:
        linear-gradient(180deg, rgba(27, 18, 12, 0.12), rgba(27, 18, 12, 0.28)),
        repeating-linear-gradient(8deg, rgba(95, 61, 36, 0.42) 0, rgba(95, 61, 36, 0.42) 2px, rgba(130, 84, 48, 0.38) 2px, rgba(130, 84, 48, 0.38) 8px),
        #6e482b;
    box-shadow: 0 26px 70px rgba(0, 0, 0, 0.52);
}

.mission-board-header {
    max-width: 760px;
    margin: 0 0 18px;
    padding: 14px 18px;
    background:
        linear-gradient(180deg, rgba(238, 221, 184, 0.94), rgba(210, 181, 133, 0.9)),
        #dcc08e;
    box-shadow: 0 8px 16px rgba(35, 18, 8, 0.32);
}

.mission-board-tabs {
    position: relative;
    z-index: 1;
}

.mission-tab-list {
    padding: 0 0 4px;
}

.mission-tab-list button {
    border-color: rgba(82, 57, 32, 0.34);
    background: rgba(238, 212, 160, 0.88);
    color: #4b2d18;
    font-family: var(--font-notes);
    box-shadow: 0 5px 10px rgba(58, 36, 18, 0.14);
}

.mission-tab-list button.is-active,
.mission-tab-list button[aria-selected="true"],
.mission-tab-list button:hover {
    border-color: rgba(111, 66, 34, 0.46);
    background: rgba(242, 226, 190, 0.96);
    color: #28180d;
}

.missions-page .page-tab-panel {
    gap: 12px;
}

.mission-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.mission-history-grid {
    grid-template-columns: 1fr;
}

.board-section-title {
    margin: 22px 0 10px;
    color: #f1e0bd;
    font-family: var(--font-display);
    font-size: 1.55rem;
    text-transform: uppercase;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
}

.mission-posting {
    min-height: 230px;
    background:
        linear-gradient(180deg, rgba(241, 223, 187, 0.95), rgba(203, 175, 128, 0.9)),
        #d7ba86;
}

.contract-posting {
    background:
        linear-gradient(180deg, rgba(248, 229, 187, 0.96), rgba(210, 179, 126, 0.92)),
        #d8b77c;
}

.job-case-board {
    background:
        linear-gradient(180deg, rgba(27, 18, 12, 0.1), rgba(27, 18, 12, 0.24)),
        repeating-linear-gradient(8deg, rgba(92, 58, 34, 0.42) 0, rgba(92, 58, 34, 0.42) 2px, rgba(122, 76, 44, 0.38) 2px, rgba(122, 76, 44, 0.38) 8px),
        #694329;
}

.job-posting {
    background:
        linear-gradient(180deg, rgba(242, 222, 182, 0.95), rgba(200, 170, 120, 0.9)),
        #d1b178;
}

.current-career-panel {
    display: grid;
    gap: 10px;
    min-width: 0;
    margin: 0 0 18px;
    padding: 18px;
    color: #211910;
    background:
        linear-gradient(180deg, rgba(238, 221, 184, 0.94), rgba(210, 181, 133, 0.9)),
        #dcc08e;
    border: 1px solid rgba(56, 35, 18, 0.28);
    box-shadow: 0 8px 16px rgba(35, 18, 8, 0.32);
    font-family: var(--font-notes);
    overflow-wrap: anywhere;
}

.current-career-panel h2 {
    margin: 0;
    color: #1f1710;
    font-family: var(--font-display);
    font-size: 1.7rem;
    text-transform: uppercase;
}

.current-career-panel p,
.current-career-panel span {
    margin: 0;
    color: rgba(31, 23, 15, 0.82);
}

.career-progress {
    display: grid;
    gap: 5px;
}

.career-progress meter {
    width: 100%;
}

.career-action-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.career-action-button {
    min-width: 0;
    min-height: 34px;
    padding: 7px 12px;
    border-radius: 4px;
    font-size: 0.78rem;
    line-height: 1.12;
    white-space: normal;
}

.career-action-button:disabled {
    cursor: not-allowed;
    opacity: 0.5;
}

.muted-career-button {
    border-color: rgba(83, 45, 33, 0.55);
    background: linear-gradient(180deg, #765040, #513125);
}

.career-posting-image {
    width: min(100%, 140px);
    margin: -4px auto 4px;
    filter: drop-shadow(0 8px 10px rgba(40, 20, 8, 0.34));
}

.mission-request-sheet {
    position: sticky;
    top: 124px;
    min-height: 760px;
    padding: 250px 54px 70px;
    background:
        linear-gradient(180deg, rgba(244, 226, 190, 0.08), rgba(244, 226, 190, 0.12)),
        url('../images/missions/mission-sheet-01.png') center top / 100% 100% no-repeat;
    border: 0;
    box-shadow: none;
}

.mission-request-sheet section {
    margin-top: 34px;
}

.mission-request-sheet > .eyebrow {
    display: none;
}

.job-request-sheet {
    min-height: 620px;
    padding: 42px 34px;
    background:
        linear-gradient(180deg, rgba(245, 226, 188, 0.94), rgba(213, 184, 135, 0.9)),
        #dfc18e;
    border: 1px solid rgba(79, 51, 27, 0.35);
    border-radius: 6px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
}

.job-request-sheet > .eyebrow {
    display: block;
}

/* Missions story hub */
.mission-hub-layout {
    grid-template-columns: minmax(0, 1fr);
}

.jobs-layout {
    grid-template-columns: minmax(0, 1fr);
}

.mission-hub-board {
    display: grid;
    gap: 22px;
    min-width: 0;
}

.job-case-board {
    display: grid;
    gap: 18px;
    min-width: 0;
}

.jobs-page .mission-card-grid {
    grid-template-columns: repeat(4, minmax(180px, 1fr));
}

.job-history-strip {
    display: grid;
    grid-template-columns: minmax(150px, 220px) minmax(0, 1fr);
    gap: 14px;
    align-items: start;
    margin-top: 6px;
    padding: 14px;
    border: 1px solid rgba(238, 212, 160, 0.26);
    border-radius: 6px;
    background: rgba(31, 20, 12, 0.54);
    color: #f1e0bd;
}

.job-history-strip h2 {
    margin: 2px 0 0;
    color: #f2e6c8;
    font-family: var(--font-display);
    font-size: 1.6rem;
    line-height: 0.95;
    text-transform: uppercase;
}

.job-history-strip .board-log-list {
    margin: 0;
}

.job-history-strip .board-log-list li {
    border-bottom-color: rgba(238, 212, 160, 0.18);
}

.job-history-strip .board-log-list span,
.job-history-strip .board-log-list time,
.job-history-strip .muted {
    color: rgba(242, 230, 200, 0.78);
}

.mission-case-board .field-flow-strip {
    border-color: rgba(238, 212, 160, 0.28);
    background: rgba(27, 18, 12, 0.66);
    box-shadow: 0 8px 16px rgba(35, 18, 8, 0.22);
}

.mission-case-board .field-flow-current {
    border-right-color: rgba(238, 212, 160, 0.2);
}

.mission-case-board .field-flow-actions a {
    border-color: rgba(238, 212, 160, 0.2);
    background: rgba(9, 7, 5, 0.26);
}

.mission-hub-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(210px, 300px);
    gap: 16px;
    align-items: end;
    padding: 16px 18px;
    background:
        linear-gradient(180deg, rgba(238, 221, 184, 0.94), rgba(210, 181, 133, 0.9)),
        #dcc08e;
    box-shadow: 0 8px 16px rgba(35, 18, 8, 0.32);
}

.mission-hub-header h1,
.mission-section-heading h2 {
    margin: 0;
    color: #1f1710;
    font-family: var(--font-display);
    line-height: 0.95;
    text-transform: uppercase;
}

.mission-hub-header h1 {
    font-size: 3.2rem;
}

.mission-hub-header span {
    color: rgba(31, 24, 17, 0.76);
    font-weight: 800;
    text-transform: uppercase;
}

.mission-hub-header dl {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 0;
}

.mission-hub-header dl div {
    min-width: 0;
    padding: 8px;
    border: 1px solid rgba(56, 35, 18, 0.24);
    background: rgba(255, 244, 218, 0.42);
}

.mission-hub-header dt,
.mission-hub-header dd {
    margin: 0;
    color: #211910;
    text-align: center;
    text-transform: uppercase;
}

.mission-hub-header dt {
    font-size: 0.68rem;
    font-weight: 900;
}

.mission-hub-header dd {
    font-family: var(--font-notes);
    font-size: 1.25rem;
}

.story-hub-feature,
.story-trail-section {
    display: grid;
    gap: 12px;
    min-width: 0;
}

.mission-section-heading {
    display: grid;
    gap: 2px;
}

.mission-section-heading h2 {
    color: #f1e0bd;
    font-size: 1.8rem;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
}

.story-trail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    min-width: 0;
}

.story-trail-card {
    display: grid;
    grid-template-rows: 150px minmax(0, 1fr);
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(226, 199, 142, 0.26);
    border-radius: 7px;
    background:
        linear-gradient(180deg, rgba(22, 27, 19, 0.94), rgba(8, 11, 7, 0.97)),
        #10140d;
    box-shadow: 0 12px 28px rgba(23, 12, 6, 0.36);
}

.story-trail-card.is-featured {
    grid-template-columns: minmax(220px, 0.92fr) minmax(0, 1.08fr);
    grid-template-rows: minmax(280px, auto);
}

.story-trail-card figure {
    min-width: 0;
    min-height: 0;
    margin: 0;
    background: #080a06;
}

.story-trail-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(0.88) contrast(1.04);
}

.story-trail-card > div {
    display: grid;
    gap: 8px;
    align-content: start;
    min-width: 0;
    padding: 13px;
}

.story-trail-card.is-featured > div {
    align-content: center;
    padding: 20px;
}

.story-trail-card span,
.story-trail-card small {
    color: rgba(226, 199, 142, 0.72);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.story-trail-card h2 {
    margin: 0;
    color: #f2e6c8;
    font-family: var(--font-display);
    font-size: 1.65rem;
    line-height: 0.95;
    text-transform: uppercase;
}

.story-trail-card.is-featured h2 {
    font-size: 2.45rem;
}

.story-trail-card p {
    display: -webkit-box;
    margin: 0;
    overflow: hidden;
    color: rgba(236, 224, 194, 0.78);
    line-height: 1.42;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
}

.story-trail-card.is-featured p {
    display: block;
    overflow: visible;
}

.story-trail-card ul {
    display: grid;
    gap: 4px;
    margin: 0;
    padding-left: 17px;
    color: rgba(236, 224, 194, 0.72);
    font-size: 0.84rem;
    font-weight: 800;
}

.story-trail-card button {
    justify-self: start;
    min-height: 34px;
    padding: 7px 12px;
    border: 1px solid rgba(226, 199, 142, 0.34);
    border-radius: 5px;
    background: rgba(200, 166, 108, 0.16);
    color: #f2e6c8;
    font-weight: 900;
    text-transform: uppercase;
}

.story-trail-card button:disabled {
    cursor: not-allowed;
    opacity: 0.52;
}

.story-trail-card.is-locked {
    border-color: rgba(143, 130, 105, 0.2);
    background:
        linear-gradient(180deg, rgba(22, 23, 20, 0.9), rgba(9, 10, 8, 0.96)),
        #10110e;
}

.origin-library-layout {
    grid-template-columns: minmax(0, 1fr);
}

.origin-library-board {
    min-width: 0;
}

.origin-library-header h1 {
    overflow-wrap: anywhere;
}

.origin-library-header dd {
    overflow-wrap: anywhere;
}

.origin-feature .origin-card {
    grid-template-columns: minmax(220px, 0.9fr) minmax(0, 1.1fr);
    grid-template-rows: minmax(260px, auto);
}

.origin-feature .origin-card > div {
    align-content: center;
    padding: 20px;
}

.origin-feature .origin-card h2 {
    font-size: 2.45rem;
}

.origin-card.is-recorded {
    border-color: rgba(180, 204, 139, 0.34);
}

.mission-history-stack {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    gap: 14px;
}

.mission-history-stack section {
    min-width: 0;
}

.mission-history-stack h2 {
    margin: 0 0 10px;
    color: #f1e0bd;
    font-family: var(--font-display);
    font-size: 1.6rem;
    line-height: 1;
    text-transform: uppercase;
}

.story-log-list {
    display: grid;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.story-log-list li {
    display: grid;
    gap: 4px;
    min-width: 0;
    padding: 10px;
    border: 1px solid rgba(226, 199, 142, 0.22);
    border-radius: 6px;
    background: rgba(8, 11, 7, 0.58);
}

.story-log-list span {
    color: rgba(236, 224, 194, 0.84);
}

.story-log-list time {
    color: rgba(226, 199, 142, 0.62);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.mission-hub-board,
.mission-hub-header,
.story-trail-card,
.story-trail-card > div,
.mission-history-stack,
.story-log-list li {
    overflow-wrap: anywhere;
}

@media (max-width: 1380px) {
    .mission-hub-layout {
        grid-template-columns: 1fr;
    }

    .mission-request-sheet {
        position: relative;
        top: auto;
        min-height: 0;
    }
}

@media (max-width: 900px) {
    .mission-hub-header,
    .story-trail-card.is-featured,
    .origin-feature .origin-card,
    .mission-history-stack {
        grid-template-columns: 1fr;
    }

    .mission-hub-header h1 {
        font-size: 2.55rem;
    }

    .story-trail-card.is-featured {
        grid-template-rows: 210px auto;
    }

    .origin-feature .origin-card {
        grid-template-rows: 210px auto;
    }

    .story-trail-card.is-featured h2 {
        font-size: 2rem;
    }

    .origin-feature .origin-card h2 {
        font-size: 2rem;
    }
}

@media (max-width: 640px) {
    .mission-hub-header dl,
    .story-trail-grid {
        grid-template-columns: 1fr;
    }

    .mission-hub-header {
        padding: 14px;
    }
}

@media (max-width: 1100px) {
    .jobs-layout,
    .missions-layout {
        grid-template-columns: 1fr;
    }

    .job-detail-sheet,
    .mission-request-sheet {
        position: relative;
        top: auto;
    }

    .mission-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .job-board-frame,
    .mission-case-board {
        min-height: 0;
        padding: 18px;
        background-size: cover;
    }

    .job-board-header {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .job-board-seal,
    .job-board-header aside {
        justify-self: center;
    }

    .career-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .mission-card-grid {
        grid-template-columns: 1fr;
    }

    .inventory-locker-header h1 {
        font-size: 2.25rem;
    }

    .job-history-strip {
        grid-template-columns: 1fr;
    }

    .mission-request-sheet {
        min-height: 0;
        padding: 170px 34px 52px;
        background-size: cover;
    }

    .job-request-sheet {
        padding: 32px 26px;
        background-size: auto;
    }
}

.camp-page .page-shell {
    width: min(1440px, 100%);
}

.camp-entry-layout {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.camp-entry-card,
.camp-public-list {
    grid-column: 1 / -1;
}

.camp-layout {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr);
    gap: 16px;
    align-items: start;
}

.camp-sidebar {
    position: sticky;
    top: 124px;
    display: grid;
    gap: 8px;
    padding: 16px;
    background:
        linear-gradient(180deg, rgba(47, 35, 25, 0.94), rgba(20, 18, 15, 0.95)),
        #211a14;
    border: 1px solid rgba(162, 129, 86, 0.28);
    border-radius: 6px;
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.42);
}

.camp-sidebar a,
.camp-sidebar button {
    padding: 9px 10px;
    color: #ead6b1;
    border: 1px solid rgba(174, 137, 87, 0.2);
    border-radius: 4px;
    background: rgba(8, 10, 8, 0.34);
    text-decoration: none;
    text-transform: uppercase;
    font-family: var(--font-display);
    font-size: 0.9rem;
    text-align: left;
}

.camp-sidebar button.is-active,
.camp-sidebar button:hover {
    border-color: rgba(231, 194, 121, 0.58);
    background: rgba(231, 194, 121, 0.14);
    color: #fff0cc;
}

.camp-main {
    display: grid;
    gap: 16px;
}

.camp-main > .page-tab-panel {
    min-width: 0;
}

#camp-home {
    order: 1;
}

#camp-compound {
    order: 2;
}

#camp-operations {
    order: 3;
}

#camp-actions {
    order: 4;
}

#camp-expeditions {
    order: 5;
}

.camp-hero-panel,
.camp-panel,
.camp-detail-sheet {
    color: #eadfc8;
    background:
        linear-gradient(180deg, rgba(37, 31, 24, 0.94), rgba(13, 15, 13, 0.96)),
        repeating-linear-gradient(90deg, rgba(95, 67, 42, 0.16) 0, rgba(95, 67, 42, 0.16) 2px, transparent 2px, transparent 10px),
        #171814;
    border: 1px solid rgba(166, 132, 83, 0.3);
    border-radius: 6px;
    box-shadow: 0 20px 48px rgba(0, 0, 0, 0.48);
}

.camp-hero-panel {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(340px, 520px);
    gap: 20px;
    padding: clamp(20px, 3vw, 32px);
}

.camp-banner-display {
    position: relative;
    min-height: 180px;
    margin: 0;
    overflow: hidden;
    border: 1px solid rgba(231, 194, 121, 0.28);
    border-radius: 5px;
    background: rgba(8, 11, 9, 0.5);
}

.camp-banner-display img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 180px;
    object-fit: cover;
}

.camp-banner-display figcaption {
    position: absolute;
    left: 10px;
    bottom: 10px;
    padding: 5px 8px;
    border: 1px solid rgba(231, 194, 121, 0.34);
    border-radius: 4px;
    background: rgba(8, 10, 8, 0.78);
    color: #f3dfb7;
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.camp-hero-panel h1,
.camp-entry-card h1,
.camp-panel h2,
.camp-detail-sheet h2 {
    margin: 0;
    color: #f3dfb7;
    font-family: var(--font-display);
    text-transform: uppercase;
}

.camp-hero-panel p,
.camp-panel p,
.camp-detail-sheet p {
    margin: 8px 0 0;
    color: rgba(237, 224, 199, 0.82);
}

.camp-status-grid {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
}

.camp-status-grid div {
    padding: 10px;
    background: rgba(9, 12, 10, 0.48);
    border: 1px solid rgba(180, 145, 95, 0.2);
    border-radius: 4px;
}

.camp-status-grid dt {
    color: rgba(232, 210, 173, 0.66);
    font-size: 0.78rem;
    text-transform: uppercase;
}

.camp-status-grid dd {
    margin: 2px 0 0;
    color: #fff0cc;
    font-weight: 800;
}

.camp-profile-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 8px 12px;
    color: #120e09;
    background: #c79654;
    border: 1px solid rgba(255, 226, 168, 0.38);
    border-radius: 5px;
    font-size: 0.86rem;
    font-weight: 900;
    text-transform: uppercase;
}

.camp-profile-link:hover,
.camp-profile-link:focus-visible {
    color: #090806;
    background: #e1b56f;
}

.camp-message {
    padding: 11px 14px;
    color: #eadfc8;
    background: rgba(13, 16, 13, 0.78);
    border: 1px solid rgba(160, 124, 78, 0.28);
    border-radius: 5px;
}

.camp-message-form {
    display: grid;
    gap: 10px;
}

.camp-message-form textarea {
    width: 100%;
    min-height: 96px;
    resize: vertical;
    padding: 12px;
    border: 1px solid rgba(180, 145, 95, 0.3);
    border-radius: 5px;
    background: rgba(5, 8, 5, 0.72);
    color: #f0ead5;
    font-family: var(--font-notes);
}

.camp-message-form button {
    justify-self: start;
    min-width: 150px;
}

.camp-message-list li span {
    font-family: var(--font-notes);
}

.camp-compound-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
}

.camp-specialization-card {
    display: grid;
    align-content: start;
    gap: 10px;
}

.camp-profile-page {
    display: grid;
    gap: 16px;
}

.camp-profile-hero {
    display: grid;
    grid-template-columns: minmax(220px, 360px) minmax(0, 1fr);
    gap: 18px;
    align-items: stretch;
    padding: clamp(18px, 3vw, 30px);
}

.camp-profile-banner {
    min-height: 240px;
    margin: 0;
    overflow: hidden;
    border: 1px solid rgba(231, 194, 121, 0.28);
    border-radius: 5px;
    background: rgba(8, 11, 9, 0.5);
}

.camp-profile-banner img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.camp-profile-hero h1 {
    margin: 0;
    color: #f3dfb7;
    font-family: var(--font-display);
    text-transform: uppercase;
}

.camp-profile-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
}

.camp-profile-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.camp-profile-grid > .camp-panel {
    padding: 18px;
}

.camp-profile-wide {
    grid-column: 1 / -1;
}

.camp-compound-map {
    position: relative;
    aspect-ratio: 3 / 2;
    min-height: 460px;
    overflow: hidden;
    padding: 0;
    background:
        linear-gradient(180deg, rgba(24, 31, 24, 0.28), rgba(8, 10, 8, 0.5)),
        #11140f;
    border: 10px solid rgba(56, 39, 26, 0.92);
    border-radius: 6px;
    box-shadow: inset 0 0 60px rgba(0, 0, 0, 0.55), 0 24px 56px rgba(0, 0, 0, 0.5);
}

.camp-map-underlay {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(0.94) contrast(1.03);
}

.camp-hotspot-layer {
    position: absolute;
    inset: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.camp-map-hotspot {
    fill: rgba(239, 195, 111, 0);
    stroke: rgba(255, 228, 155, 0);
    stroke-width: 5;
    cursor: pointer;
    pointer-events: auto;
    transition: fill 160ms ease, stroke 160ms ease;
}

.camp-map-hotspot:hover,
.camp-map-hotspot:focus-visible,
.camp-map-hotspot.is-selected {
    fill: rgba(239, 195, 111, 0.16);
    stroke: rgba(255, 228, 155, 0.74);
    outline: none;
}

.camp-facility {
    position: absolute;
    display: none;
    align-items: center;
    justify-content: space-between;
    gap: 7px;
    width: clamp(98px, 9.5vw, 140px);
    min-height: 38px;
    padding: 7px 9px;
    color: #f6e3bd;
    background:
        linear-gradient(180deg, rgba(34, 28, 19, 0.9), rgba(12, 15, 12, 0.86)),
        rgba(22, 24, 18, 0.86);
    border: 1px solid rgba(234, 194, 116, 0.58);
    border-radius: 4px;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.42), inset 0 0 0 1px rgba(255, 238, 190, 0.08);
    cursor: pointer;
    text-align: left;
    font-family: var(--font-notes);
    transform: translate(-50%, -50%);
    z-index: 2;
    backdrop-filter: blur(2px);
}

.camp-facility span {
    overflow: hidden;
    color: inherit;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.camp-facility strong {
    flex: 0 0 auto;
    color: #10130e;
    padding: 2px 5px;
    background: rgba(231, 194, 121, 0.9);
    border-radius: 3px;
    font-size: 0.72rem;
}

.camp-facility.is-selected {
    outline: 2px solid rgba(255, 224, 145, 0.92);
    transform: translate(-50%, calc(-50% - 3px));
}

.camp-facility--main-lodge { left: 49%; top: 40%; }
.camp-facility--garage { left: 81%; top: 24%; }
.camp-facility--meat-locker { left: 31%; top: 23%; }
.camp-facility--workshop { left: 67%; top: 57%; }
.camp-facility--radio-tower { left: 62%; top: 18%; }
.camp-facility--medical-cabin { left: 85%; top: 57%; }
.camp-facility--watchtower { left: 37%; top: 14%; }
.camp-facility--trail-camera-network { left: 76%; top: 41%; }

.camp-detail-sheet {
    position: static;
    min-height: 0;
    padding: 28px;
}

.camp-detail-actions {
    margin-top: 4px;
    padding-top: 14px;
    border-top: 1px solid rgba(205, 169, 110, 0.2);
}

.camp-detail-actions [data-facility-controls]:not([hidden]) {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.camp-detail-actions button {
    min-height: 38px;
}

.camp-section-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 430px);
    gap: 16px;
}

#camp-storage {
    grid-template-columns: minmax(0, 1fr);
}

#camp-storage > .camp-panel {
    min-width: 0;
}

.camp-storage-top-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.camp-storage-top-row > .camp-panel {
    min-width: 0;
}

.camp-treasury-panel {
    align-content: start;
}

.camp-treasury-readout {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 14px 0;
}

.camp-treasury-readout div {
    padding: 11px;
    border: 1px solid rgba(174, 137, 87, 0.18);
    border-radius: 4px;
    background: rgba(8, 11, 9, 0.5);
}

.camp-treasury-readout dt {
    color: rgba(235, 219, 190, 0.68);
    font-size: 0.78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.camp-treasury-readout dd {
    margin: 2px 0 0;
    color: #fff0cc;
    font-family: var(--font-notes);
    font-size: 1.15rem;
}

.camp-treasury-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: end;
    margin-top: 14px;
}

.camp-treasury-form label {
    display: grid;
    gap: 6px;
    color: rgba(235, 219, 190, 0.72);
    font-size: 0.78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.camp-resource-donation-block {
    display: grid;
    gap: 8px;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid rgba(174, 137, 87, 0.24);
}

.camp-resource-donation-block h3 {
    margin: 0;
    color: #f3dfb7;
    font-family: var(--font-display);
    font-size: 1.28rem;
    font-weight: 400;
    line-height: 1;
    text-transform: uppercase;
}

.camp-resource-donation-block .camp-donation-list {
    margin-top: 4px;
}

.camp-actions-board {
    align-items: start;
}

.camp-action-list {
    grid-column: 1 / -1;
}

.camp-defense-gauges {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 14px 0;
}

.camp-defense-gauges article,
.camp-defense-breakdown div,
.camp-action-grid article {
    background: rgba(8, 11, 9, 0.5);
    border: 1px solid rgba(174, 137, 87, 0.18);
    border-radius: 4px;
}

.camp-defense-gauges article {
    display: grid;
    gap: 5px;
    padding: 11px;
}

.camp-defense-gauges span,
.camp-action-meta span {
    color: rgba(235, 219, 190, 0.68);
    font-size: 0.78rem;
    text-transform: uppercase;
}

.camp-defense-gauges strong {
    color: #fff0cc;
    font-size: 1.35rem;
}

.camp-defense-breakdown {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin: 14px 0 0;
}

.camp-defense-breakdown div {
    padding: 10px;
}

.camp-defense-breakdown dt {
    color: rgba(232, 210, 173, 0.66);
    font-size: 0.74rem;
    text-transform: uppercase;
}

.camp-defense-breakdown dd {
    margin: 2px 0 0;
    color: #fff0cc;
    font-weight: 800;
}

.camp-effect-list {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 14px;
}

.camp-effect-list span {
    padding: 6px 8px;
    color: rgba(245, 225, 190, 0.86);
    background: rgba(19, 45, 36, 0.5);
    border: 1px solid rgba(115, 164, 122, 0.24);
    border-radius: 3px;
    font-size: 0.78rem;
}

.camp-action-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-top: 14px;
}

.camp-action-grid article {
    display: grid;
    gap: 8px;
    align-content: start;
    padding: 14px;
}

.camp-action-grid h3 {
    margin: 0;
    color: #f1dfba;
    font-family: var(--font-display);
    font-size: 1.25rem;
    letter-spacing: 0;
}

.camp-action-grid p {
    margin: 0;
}

.camp-action-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.camp-action-meta span {
    min-height: 24px;
    padding: 4px 7px;
    color: rgba(245, 225, 190, 0.82);
    background: rgba(6, 8, 7, 0.48);
    border: 1px solid rgba(174, 137, 87, 0.18);
    border-radius: 3px;
}

.camp-panel {
    padding: 22px;
}

.camp-resource-grid,
.camp-member-list,
.camp-donation-list,
.camp-upgrade-list,
.camp-production-list,
.camp-expedition-site-list,
.camp-expedition-list,
.camp-expedition-role-list,
.camp-recovery-list,
.camp-site-control-list {
    display: grid;
    gap: 10px;
    margin-top: 14px;
}

.camp-resource {
    display: grid;
    grid-template-columns: minmax(110px, 1fr) 80px;
    gap: 8px;
    align-items: center;
    padding: 11px;
    background: rgba(8, 11, 9, 0.5);
    border: 1px solid rgba(174, 137, 87, 0.18);
    border-radius: 4px;
}

.camp-resource meter {
    grid-column: 1 / -1;
    width: 100%;
}

.camp-button-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}

.camp-donate-button,
.camp-upgrade-button,
.camp-operation-button,
.camp-expedition-button,
.camp-site-control-button,
.camp-action-button,
.camp-facility-production-button,
.camp-recon-button,
.camp-rank-button,
.camp-approval-button,
.camp-leave-button {
    min-height: 34px;
    padding: 7px 12px;
    border-radius: 4px;
    font-size: 0.78rem;
}

.camp-leave-button,
.camp-approval-button[data-decision="reject"],
.muted-career-button[data-career-action="resign"] {
    border-color: rgba(141, 50, 36, 0.54);
    background: linear-gradient(180deg, rgba(109, 46, 35, 0.9), rgba(63, 24, 20, 0.92));
    color: #f6e0c6;
}

.camp-donation-list .camp-donate-button {
    justify-self: start;
}

.camp-donation-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 86px auto;
    gap: 10px;
    align-items: end;
    padding: 10px;
    background: rgba(8, 11, 9, 0.5);
    border: 1px solid rgba(174, 137, 87, 0.18);
    border-radius: 4px;
}

.camp-donation-row strong,
.camp-donation-row small,
.camp-donation-row label {
    display: block;
}

.camp-donation-row strong {
    color: #fff0cc;
    line-height: 1.15;
}

.camp-donation-row small,
.camp-donation-row label {
    color: rgba(235, 219, 190, 0.68);
    font-size: 0.74rem;
    font-weight: 900;
    text-transform: uppercase;
}

.camp-donation-row input {
    width: 100%;
    min-height: 34px;
    margin-top: 4px;
    padding: 6px 8px;
    border: 1px solid rgba(180, 145, 95, 0.3);
    border-radius: 4px;
    background: rgba(5, 8, 5, 0.72);
    color: #f0ead5;
}

.camp-upgrade-list article,
.camp-production-list article,
.camp-member-list article,
.camp-expedition-site-list article,
.camp-expedition-card,
.camp-expedition-role-list section,
.camp-recovery-list article,
.camp-site-control-list article {
    display: grid;
    gap: 5px;
    padding: 12px;
    background: rgba(8, 11, 9, 0.5);
    border: 1px solid rgba(174, 137, 87, 0.18);
    border-radius: 4px;
}

.camp-upgrade-list article {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
}

.camp-facility-production {
    grid-column: 1 / -1;
}

.camp-production-list article {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
}

.camp-production-list article > div {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.camp-production-list small {
    color: rgba(235, 219, 190, 0.68);
}

.camp-upgrade-copy {
    display: grid;
    min-width: 0;
    gap: 4px;
}

.camp-upgrade-copy span,
.camp-upgrade-copy small {
    min-width: 0;
    overflow-wrap: anywhere;
}

.camp-expedition-site-list article {
    gap: 4px;
}

.camp-expedition-site-list strong,
.camp-expedition-card h3,
.camp-expedition-role-list strong,
.camp-recovery-list strong,
.camp-site-control-list strong {
    color: #f5e6c9;
}

.camp-expedition-site-list span,
.camp-expedition-site-list small,
.camp-expedition-card small,
.camp-expedition-role-list span,
.camp-expedition-role-list small,
.camp-expedition-role-list p,
.camp-recovery-list span,
.camp-recovery-list small,
.camp-recovery-list p,
.camp-site-control-list span,
.camp-site-control-list small,
.camp-site-control-list p {
    color: rgba(235, 219, 190, 0.68);
}

.camp-expedition-card {
    gap: 10px;
    background:
        linear-gradient(90deg, rgba(35, 45, 26, 0.62), rgba(9, 11, 8, 0.5)),
        rgba(8, 11, 9, 0.5);
}

.camp-expedition-card > header,
.camp-expedition-role-list header {
    display: grid;
    gap: 3px;
}

.camp-expedition-card > header span,
.camp-expedition-role-list header span {
    color: #b99b65;
    font-size: 0.74rem;
    font-weight: 900;
    text-transform: uppercase;
}

.camp-expedition-card h3 {
    margin: 0;
    font-family: var(--font-display);
    font-size: 1.45rem;
    line-height: 1;
    text-transform: uppercase;
}

.camp-expedition-card meter {
    width: 100%;
}

.camp-expedition-readout {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.camp-expedition-readout span {
    min-width: 0;
    padding: 7px 8px;
    color: #ead7ad;
    font-size: 0.76rem;
    font-weight: 900;
    text-align: center;
    text-transform: uppercase;
    background: rgba(25, 29, 20, 0.72);
    border: 1px solid rgba(190, 154, 93, 0.22);
    border-radius: 4px;
}

.camp-expedition-role-list {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.camp-expedition-role-list section {
    align-content: start;
    background: rgba(5, 7, 5, 0.38);
}

.camp-expedition-role-list button {
    justify-self: start;
    margin-top: 6px;
}

.camp-conflict-list {
    display: grid;
    gap: 10px;
    margin-top: 14px;
}

.camp-conflict-list article {
    display: grid;
    gap: 7px;
    padding: 12px;
    background: rgba(10, 10, 8, 0.58);
    border: 1px solid rgba(174, 137, 87, 0.2);
    border-radius: 4px;
}

.camp-conflict-list header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: start;
}

.camp-conflict-list strong {
    color: #f5e6c9;
}

.camp-conflict-list header span {
    color: #d0a76a;
    font-size: 0.74rem;
    font-weight: 900;
    text-align: right;
    text-transform: uppercase;
}

.camp-conflict-list small {
    color: rgba(235, 219, 190, 0.68);
}

.camp-conflict-readout {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.camp-conflict-readout span {
    min-width: 0;
    padding: 7px 8px;
    color: #ead7ad;
    font-size: 0.74rem;
    font-weight: 900;
    text-align: center;
    text-transform: uppercase;
    background: rgba(25, 29, 20, 0.72);
    border: 1px solid rgba(190, 154, 93, 0.22);
    border-radius: 4px;
}

.camp-hauling-readout {
    display: grid;
    gap: 3px;
    margin-top: 8px;
    padding: 10px 12px;
    background: rgba(13, 24, 18, 0.58);
    border: 1px solid rgba(115, 164, 122, 0.24);
    border-radius: 4px;
}

.camp-hauling-readout strong {
    color: #f5e6c9;
}

.camp-hauling-readout small {
    color: rgba(235, 219, 190, 0.68);
}

.camp-recovery-list article {
    align-content: start;
}

.camp-recovery-list header {
    display: grid;
    gap: 3px;
}

.camp-recovery-list button {
    justify-self: start;
    margin-top: 6px;
}

.camp-site-control-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 16px;
}

.camp-site-control-grid h3 {
    margin: 0;
    color: #cba66a;
    font-size: 0.82rem;
    font-weight: 900;
    text-transform: uppercase;
}

.camp-site-control-list article {
    align-content: start;
    min-width: 0;
}

.camp-site-control-list header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: start;
}

.camp-site-control-list header span {
    color: #cba66a;
    font-size: 0.72rem;
    font-weight: 900;
    text-align: right;
    text-transform: uppercase;
}

.camp-site-control-list meter {
    width: 100%;
}

.camp-site-control-list button {
    justify-self: start;
    margin-top: 6px;
}

.camp-expedition-planner {
    align-self: start;
    align-content: start;
    grid-auto-rows: max-content;
}

.camp-expedition-planner .camp-expedition-site-list {
    margin-top: 0;
}

.camp-expedition-planner > button[type="submit"] {
    justify-self: start;
    align-self: start;
    width: auto;
    min-height: 38px;
    padding: 8px 14px;
}

.camp-member-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.camp-member-list small {
    color: rgba(235, 219, 190, 0.68);
}

.camp-rank-controls {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.camp-member-table-wrap {
    margin-top: 14px;
}

.camp-member-table {
    min-width: 820px;
}

.camp-member-table tbody th {
    min-width: 210px;
}

.camp-player-cell img {
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    border: 1px solid rgba(174, 137, 87, 0.34);
    border-radius: 4px;
    object-fit: cover;
    object-position: top center;
    background: rgba(8, 11, 9, 0.72);
}

.camp-rank-label {
    display: inline-block;
    padding: 4px 7px;
    border: 1px solid rgba(174, 137, 87, 0.3);
    border-radius: 3px;
    background: rgba(174, 137, 87, 0.1);
    color: #f1dfba;
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
    white-space: nowrap;
}

.camp-member-table .camp-rank-controls {
    min-width: 240px;
}

.camp-form-panel {
    display: grid;
    gap: 12px;
}

.camp-form-panel label {
    display: grid;
    gap: 5px;
    color: rgba(237, 224, 199, 0.78);
    font-size: 0.86rem;
    text-transform: uppercase;
}

.camp-form-panel input,
.camp-form-panel select,
.camp-form-panel textarea {
    width: 100%;
    min-height: 40px;
    padding: 9px 10px;
    color: #f5e6c9;
    background: rgba(6, 8, 7, 0.72);
    border: 1px solid rgba(180, 145, 95, 0.34);
    border-radius: 4px;
}

.camp-form-panel textarea {
    min-height: 110px;
    resize: vertical;
}

.camp-banner-picker {
    display: grid;
    gap: 10px;
    margin: 0;
    padding: 0;
    border: 0;
}

.camp-banner-picker legend {
    margin-bottom: 6px;
    color: rgba(237, 224, 199, 0.78);
    font-size: 0.86rem;
    font-weight: 900;
    text-transform: uppercase;
}

.camp-banner-picker > div {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 10px;
}

.camp-banner-picker label {
    position: relative;
    display: grid;
    gap: 7px;
    padding: 8px;
    border: 1px solid rgba(180, 145, 95, 0.24);
    border-radius: 5px;
    background: rgba(6, 8, 7, 0.48);
    color: #e7d7ac;
    cursor: pointer;
}

.camp-banner-picker input {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    opacity: 0;
    pointer-events: none;
}

.camp-banner-picker img {
    width: 100%;
    aspect-ratio: 16 / 7;
    object-fit: cover;
    border: 2px solid transparent;
    border-radius: 4px;
}

.camp-banner-picker input:checked + img,
.camp-banner-picker label.is-selected img {
    border-color: rgba(231, 194, 121, 0.9);
}

.camp-banner-picker span {
    font-size: 0.78rem;
    line-height: 1.15;
    text-transform: uppercase;
}

.camp-radio-feed .board-log-list li {
    border-bottom-color: rgba(235, 219, 190, 0.16);
}

@media (max-width: 1040px) {
    .market-form {
        grid-template-columns: 1fr;
    }

    .market-action-list article,
    .market-demand-board article {
        align-items: stretch;
        flex-direction: column;
    }

    .market-inline-form {
        grid-template-columns: minmax(0, 1fr) auto;
        min-width: 0;
    }

    .camp-layout,
    .camp-entry-layout,
    .camp-hero-panel,
    .camp-compound-grid,
    .camp-section-grid,
    .camp-storage-top-row,
    .camp-donation-row,
    .camp-treasury-form,
    .camp-site-control-grid,
    .camp-profile-hero,
    .camp-profile-grid {
        grid-template-columns: 1fr;
    }

    .camp-sidebar {
        position: relative;
        top: auto;
    }

    .camp-sidebar {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        overflow-x: visible;
    }

    .camp-sidebar .eyebrow {
        grid-column: 1 / -1;
    }

    .camp-sidebar button {
        min-height: 54px;
        overflow-wrap: normal;
        text-align: center;
        white-space: nowrap;
    }

    .camp-action-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .market-sign,
    .market-panel[data-market-panel="browse"],
    .market-panel:not([data-market-panel="browse"]).is-active {
        grid-template-columns: 1fr;
    }

    .market-ledger {
        grid-column: auto;
    }

    .market-listings {
        grid-column: auto;
        grid-row: auto;
    }
}

@media (max-width: 720px) {
    .camp-status-grid,
    .camp-member-list,
    .camp-defense-gauges,
    .camp-defense-breakdown,
    .camp-action-grid,
    .camp-site-control-list header,
    .camp-expedition-readout,
    .camp-conflict-list header,
    .camp-conflict-readout {
        grid-template-columns: 1fr;
    }

    .camp-site-control-list header span,
    .camp-conflict-list header span {
        text-align: left;
    }

    .camp-compound-map {
        display: block;
        min-height: min(360px, 62vw);
        padding: 0;
    }

    .camp-map-underlay {
        position: absolute;
        inset: 0;
        aspect-ratio: auto;
        border: 1px solid rgba(174, 137, 87, 0.28);
        border-radius: 4px;
        object-fit: cover;
    }

    .camp-hotspot-layer {
        display: block;
    }

    .camp-facility {
        display: flex;
        width: clamp(82px, 22vw, 112px);
        min-height: 32px;
        padding: 5px 7px;
        font-size: 0.72rem;
    }

    .camp-facility.is-selected {
        transform: translate(-50%, calc(-50% - 3px));
    }

    .camp-upgrade-list article,
    .camp-resource {
        grid-template-columns: 1fr;
    }

    .market-status-strip,
    .market-fee-list {
        grid-template-columns: 1fr;
    }

    .market-row-main {
        grid-template-columns: 98px minmax(0, 1fr) 54px 64px;
    }

    .market-item-media {
        width: 98px;
        min-height: 72px;
    }

    .market-item-summary {
        padding: 9px 10px;
    }

    .market-item-drawer {
        grid-template-columns: 1fr;
    }

    .market-item-drawer.is-open {
        max-height: 420px;
    }

    .market-item-drawer dl {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 520px) {
    .market-row-main {
        grid-template-columns: 86px minmax(0, 1fr) 54px;
    }

    .market-item-media {
        width: 86px;
        min-height: 68px;
    }

    .market-item-media span {
        width: 44px;
        height: 44px;
        font-size: 1.1rem;
    }

    .market-row .market-buy-button {
        grid-column: 1 / -1;
        min-height: 40px;
        border-top: 1px solid rgba(185, 142, 85, 0.22);
        border-left: 0;
    }

    .market-item-drawer dl {
        grid-template-columns: 1fr;
    }
}

.inventory-filter-bar {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 14px;
}

.inventory-filter {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    padding: 6px 9px;
    border: 1px solid rgba(82, 57, 32, 0.34);
    border-radius: 4px;
    background: rgba(74, 52, 28, 0.08);
    color: #2b2116;
    font-family: var(--font-notes);
    font-size: 0.84rem;
    text-transform: none;
    box-shadow: none;
}

.inventory-filter:hover,
.inventory-filter.is-active {
    border-color: rgba(82, 57, 32, 0.62);
    background: rgba(72, 48, 24, 0.18);
    color: #24180f;
}

.inventory-filter small {
    display: inline-grid;
    min-width: 20px;
    min-height: 20px;
    place-items: center;
    padding: 0 5px;
    border-radius: 999px;
    background: rgba(43, 33, 22, 0.14);
    color: rgba(43, 33, 22, 0.72);
    font-size: 0.72rem;
    line-height: 1;
}

.inventory-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.inventory-actions button {
    min-height: 32px;
    padding: 6px 10px;
    border-radius: 4px;
    font-size: 0.78rem;
}

.inventory-actions button:disabled {
    cursor: not-allowed;
    opacity: 0.48;
}

.inventory-page {
    background:
        linear-gradient(180deg, rgba(9, 11, 9, 0.32), rgba(9, 11, 9, 0.78)),
        radial-gradient(circle at 18% 12%, rgba(121, 93, 54, 0.16), transparent 34%),
        #0d100c;
}

.inventory-page .page-shell {
    width: min(1340px, 100%);
}

.inventory-locker {
    display: grid;
    gap: 16px;
}

.inventory-tabs {
    display: grid;
    gap: 12px;
}

.inventory-tab-list button {
    border-color: rgba(185, 155, 101, 0.24);
    background: rgba(185, 155, 101, 0.08);
    color: #d6c291;
}

.inventory-tab-list button.is-active,
.inventory-tab-list button[aria-selected="true"],
.inventory-tab-list button:hover {
    border-color: rgba(185, 155, 101, 0.58);
    background: rgba(185, 155, 101, 0.17);
    color: #f2ead5;
}

.inventory-locker-header,
.inventory-locker-layout,
.inventory-main-panel,
.inventory-detail-panel {
    border: 1px solid rgba(128, 101, 60, 0.28);
    border-radius: 6px;
    background:
        linear-gradient(180deg, rgba(28, 31, 24, 0.94), rgba(12, 15, 12, 0.96)),
        #12150f;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.36);
}

.inventory-locker-header {
    display: grid;
    grid-template-columns: minmax(260px, 0.45fr) minmax(0, 1fr);
    gap: 24px;
    align-items: center;
    padding: 18px;
}

.inventory-locker-header > div {
    min-width: 0;
}

.inventory-locker-header h1 {
    margin: 0;
    color: #f2ead5;
    font-family: var(--font-display);
    font-size: 2.7rem;
    line-height: 0.95;
    overflow-wrap: anywhere;
    text-transform: uppercase;
}

.inventory-load-status {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 12px;
}

.inventory-load-status div {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.inventory-load-status span,
.inventory-row-head,
.inventory-search span {
    color: #b99b65;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.inventory-load-status strong {
    color: #f2ead5;
}

.inventory-load-status meter {
    width: 100%;
    height: 8px;
}

.inventory-locker-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    overflow: hidden;
}

.inventory-main-panel,
.inventory-detail-panel {
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.inventory-detail-panel {
    padding: 16px;
}

.inventory-main-panel {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
    padding: 16px;
}

.inventory-detail-panel {
    display: none;
    grid-column: 1;
    grid-row: 2;
    border-top: 1px solid rgba(128, 101, 60, 0.22);
}

.inventory-detail-panel.is-open {
    display: grid;
}

.inventory-row > .inventory-detail-panel {
    grid-column: 1 / -1;
    grid-row: auto;
    width: 100%;
    min-width: 0;
    padding: 14px 4px 6px;
    border-top: 1px solid rgba(185, 155, 101, 0.28);
    cursor: default;
}

.inventory-row > .inventory-detail-panel.is-open {
    display: grid;
    gap: 8px;
}

.inventory-row > .inventory-detail-panel .mobile-detail-close {
    justify-self: end;
}

.inventory-detail-panel .mobile-detail-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.inventory-toolbar {
    display: grid;
    gap: 12px;
    margin-bottom: 12px;
}

.inventory-search {
    display: grid;
    gap: 6px;
}

.inventory-search input {
    width: 100%;
    border-color: rgba(185, 155, 101, 0.3);
    background: rgba(6, 8, 6, 0.52);
    color: #f2ead5;
}

.inventory-search input::placeholder {
    color: rgba(242, 234, 213, 0.44);
}

.inventory-locker .inventory-filter {
    border-color: rgba(185, 155, 101, 0.24);
    background: rgba(185, 155, 101, 0.08);
    color: #d6c291;
}

.inventory-locker .inventory-filter:hover,
.inventory-locker .inventory-filter.is-active {
    border-color: rgba(185, 155, 101, 0.62);
    background: rgba(185, 155, 101, 0.17);
    color: #f2ead5;
}

.inventory-locker .inventory-filter small {
    background: rgba(6, 8, 6, 0.5);
    color: #d6c291;
}

.inventory-table-wrap {
    display: grid;
    gap: 6px;
    min-width: 0;
    max-width: 100%;
    overflow-x: auto;
    padding-bottom: 2px;
}

.inventory-row {
    display: grid;
    grid-template-columns: 54px minmax(190px, 1.6fr) 38px 70px minmax(82px, 0.55fr) 54px minmax(74px, 0.42fr);
    gap: 8px;
    align-items: center;
    width: 100%;
    min-width: 760px;
    min-height: 58px;
    padding: 8px 10px;
    border: 1px solid rgba(128, 101, 60, 0.18);
    border-radius: 4px;
    background: rgba(7, 9, 7, 0.38);
    color: #e8dec5;
}

.inventory-row:not(.inventory-row-head) {
    cursor: pointer;
}

.inventory-row:not(.inventory-row-head):hover,
.inventory-row.is-selected {
    border-color: rgba(185, 155, 101, 0.5);
    background: rgba(92, 75, 43, 0.24);
}

.inventory-row.is-equipped {
    border-color: rgba(139, 167, 99, 0.38);
}

.inventory-row.is-filter-hidden,
.market-row.is-filter-hidden {
    display: none !important;
}

.inventory-row-head {
    min-height: 34px;
    background: rgba(185, 155, 101, 0.07);
    cursor: default;
}

.inventory-thumb {
    display: grid;
    place-items: center;
    width: 48px;
    aspect-ratio: 1;
    overflow: hidden;
    border: 1px solid rgba(185, 155, 101, 0.26);
    border-radius: 4px;
    background:
        linear-gradient(135deg, rgba(185, 155, 101, 0.12), rgba(60, 79, 58, 0.16)),
        rgba(9, 12, 9, 0.66);
}

.inventory-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.inventory-thumb span {
    color: rgba(232, 222, 197, 0.58);
    font-size: 0.62rem;
    font-weight: 900;
    text-transform: uppercase;
}

.inventory-row-item {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.inventory-row-item strong {
    color: #f2ead5;
    line-height: 1.12;
    overflow-wrap: anywhere;
}

.inventory-row-item small,
.inventory-row > span {
    color: rgba(232, 222, 197, 0.72);
    font-family: var(--font-notes);
    font-size: 0.86rem;
}

.inventory-row-item .inventory-effect-line {
    color: #d8bf83;
}

.inventory-locker .inventory-actions {
    justify-content: flex-end;
    margin-top: 0;
    min-width: 0;
}

.inventory-locker .inventory-actions button {
    min-height: 30px;
    max-width: 100%;
    padding: 5px 7px;
    border-color: rgba(185, 155, 101, 0.3);
    background: rgba(15, 18, 13, 0.72);
    color: #e7d7ac;
    font-size: 0.68rem;
    line-height: 1.1;
    white-space: nowrap;
}

.inventory-detail-panel h2 {
    margin: 6px 0 8px;
    color: #f2ead5;
    font-family: var(--font-display);
    font-size: 1.7rem;
    line-height: 0.95;
    text-transform: uppercase;
}

.inventory-detail-panel p {
    color: rgba(232, 222, 197, 0.76);
}

.inventory-detail-panel .mission-lines span {
    border-color: rgba(185, 155, 101, 0.22);
    background: rgba(185, 155, 101, 0.08);
    color: #e8dec5;
}

.inventory-locker > .quiet-message {
    border: 1px solid rgba(185, 155, 101, 0.22);
    border-radius: 4px;
    padding: 10px 12px;
    background: rgba(7, 9, 7, 0.56);
    color: rgba(232, 222, 197, 0.78);
}

.responsive-table-wrap {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    border: 1px solid rgba(128, 101, 60, 0.28);
    border-radius: 6px;
    background: rgba(7, 9, 7, 0.42);
}

.data-table {
    width: 100%;
    border-collapse: collapse;
    color: #e8dec5;
    font-size: 0.88rem;
}

.data-table th,
.data-table td {
    padding: 11px 12px;
    border-bottom: 1px solid rgba(128, 101, 60, 0.2);
    text-align: left;
    vertical-align: middle;
}

.data-table thead th {
    color: #b99b65;
    background: rgba(185, 155, 101, 0.08);
    font-size: 0.7rem;
    font-weight: 900;
    text-transform: uppercase;
    white-space: nowrap;
}

.data-table tbody tr:last-child > * {
    border-bottom: 0;
}

.data-table tbody tr:hover > * {
    background: rgba(92, 75, 43, 0.16);
}

.data-table small {
    display: block;
    margin-top: 3px;
    color: rgba(232, 222, 197, 0.65);
    font-family: var(--font-notes);
    font-weight: 400;
}

.equipped-table {
    min-width: 800px;
}

.equipped-table tbody th {
    width: 132px;
    color: #d6c291;
    font-size: 0.75rem;
    text-transform: uppercase;
}

.equipped-table .is-empty > * {
    color: rgba(232, 222, 197, 0.5);
}

.table-item-cell,
.camp-player-cell {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.table-item-cell > div:last-child,
.camp-player-cell > div {
    min-width: 0;
}

.table-item-cell strong,
.camp-player-cell strong {
    display: block;
    color: #f2ead5;
    line-height: 1.15;
    overflow-wrap: anywhere;
}

.equipped-detail-cell {
    width: 34%;
    color: rgba(232, 222, 197, 0.78);
}

.equipped-detail-cell small {
    color: #d8bf83;
}

.table-action-cell {
    text-align: right;
}

.equipped-table .inventory-action {
    min-height: 34px;
    padding: 6px 10px;
    white-space: nowrap;
}

.storage-board {
    display: grid;
    gap: 16px;
}

.storage-summary-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.storage-summary-strip article {
    display: grid;
    gap: 6px;
    min-width: 0;
    padding: 14px;
    border: 1px solid rgba(128, 101, 60, 0.26);
    border-radius: 6px;
    background: rgba(8, 11, 8, 0.55);
}

.storage-summary-strip span,
.storage-section-heading .eyebrow,
.storage-category-row,
.storage-row-head {
    color: #b99b65;
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0;
    text-transform: uppercase;
}

.storage-summary-strip strong {
    min-width: 0;
    color: #f2ead5;
    overflow-wrap: anywhere;
}

.storage-summary-strip small {
    color: rgba(232, 222, 197, 0.68);
}

.storage-summary-strip meter {
    width: 100%;
    height: 8px;
}

.storage-section {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.storage-section--wide {
    grid-column: 1 / -1;
}

.storage-section-heading {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: end;
}

.storage-section-heading h2 {
    margin: 0;
    color: #f2ead5;
    font-family: var(--font-display);
    font-size: 1.45rem;
    line-height: 1;
    text-transform: uppercase;
}

.storage-table-wrap {
    display: grid;
    gap: 6px;
    min-width: 0;
    max-width: 100%;
    overflow-x: auto;
    padding-bottom: 2px;
}

.storage-row {
    display: grid;
    grid-template-columns: 54px minmax(170px, 1.5fr) minmax(72px, 0.48fr) 40px 70px minmax(82px, 0.56fr) minmax(96px, 0.52fr);
    gap: 8px;
    align-items: center;
    width: 100%;
    min-width: 680px;
    min-height: 58px;
    padding: 8px 10px;
    border: 1px solid rgba(128, 101, 60, 0.18);
    border-radius: 4px;
    background: rgba(7, 9, 7, 0.38);
    color: #e8dec5;
}

.storage-row-head {
    min-height: 34px;
    background: rgba(185, 155, 101, 0.07);
}

.storage-category-row {
    min-height: 28px;
    padding: 7px 10px 4px;
    border-bottom: 1px solid rgba(128, 101, 60, 0.2);
}

.storage-thumb {
    display: grid;
    place-items: center;
    width: 48px;
    aspect-ratio: 1;
    overflow: hidden;
    border: 1px solid rgba(185, 155, 101, 0.26);
    border-radius: 4px;
    background:
        linear-gradient(135deg, rgba(185, 155, 101, 0.12), rgba(60, 79, 58, 0.16)),
        rgba(9, 12, 9, 0.66);
}

.storage-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.storage-thumb span {
    color: rgba(232, 222, 197, 0.58);
    font-size: 0.62rem;
    font-weight: 900;
    text-transform: uppercase;
}

.storage-item-name {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.storage-item-name strong {
    color: #f2ead5;
    line-height: 1.12;
    overflow-wrap: anywhere;
}

.storage-item-name small,
.storage-row > span {
    color: rgba(232, 222, 197, 0.72);
    font-family: var(--font-notes);
    font-size: 0.86rem;
}

.storage-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
    min-width: 0;
}

.storage-actions .storage-transfer-button {
    min-height: 34px;
    padding: 6px 8px;
    white-space: nowrap;
}

.storage-transfer-button {
    min-height: 30px;
    padding: 5px 8px;
    border-color: rgba(185, 155, 101, 0.3);
    background: rgba(15, 18, 13, 0.72);
    color: #e7d7ac;
    font-size: 0.72rem;
}

@media (max-width: 1180px) {
    .inventory-locker-header,
    .inventory-locker-layout,
    .inventory-load-status,
    .storage-summary-strip {
        grid-template-columns: 1fr;
    }

    .inventory-main-panel {
        grid-column: auto;
        grid-row: auto;
        border: 0;
        border-top: 1px solid rgba(128, 101, 60, 0.22);
        border-bottom: 1px solid rgba(128, 101, 60, 0.22);
    }

    .inventory-detail-panel {
        grid-column: auto;
        grid-row: auto;
    }

    .inventory-row,
    .inventory-row-head {
        grid-template-columns: 50px minmax(160px, 1fr) 48px 76px 68px;
        min-width: 560px;
    }

    .inventory-row > span:nth-of-type(3),
    .inventory-row > span:nth-of-type(4),
    .inventory-row-head span:nth-child(5),
    .inventory-row-head span:nth-child(6) {
        display: none;
    }

    .inventory-row .inventory-actions,
    .inventory-row-head span:nth-child(7) {
        grid-column: 1 / -1;
        justify-content: start;
    }

    .storage-row,
    .storage-row-head {
        grid-template-columns: 50px minmax(150px, 1fr) 48px 72px;
    }

    .storage-row > span:nth-of-type(1),
    .storage-row > span:nth-of-type(4),
    .storage-row-head span:nth-child(3),
    .storage-row-head span:nth-child(6) {
        display: none;
    }

    .storage-actions,
    .storage-row-head span:nth-child(7) {
        grid-column: 1 / -1;
        justify-content: start;
    }
}

@media (max-width: 820px) {
    .market-panel[data-market-panel="browse"] {
        grid-template-columns: 1fr;
    }

    .mobile-detail-close {
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .equipped-table,
    .camp-member-table {
        min-width: 650px;
    }

    .data-table th,
    .data-table td {
        padding: 9px 10px;
    }

    .data-table .table-secondary-column {
        display: none;
    }

    .equipped-detail-cell {
        width: 30%;
    }

    .camp-member-table .camp-rank-controls {
        min-width: 0;
    }
}

@media (min-width: 981px) and (max-width: 1180px) {
    .inventory-load-status {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

body.downtime-page {
    background:
        linear-gradient(180deg, rgba(5, 7, 6, 0.42), rgba(5, 7, 6, 0.95)),
        radial-gradient(circle at 22% 20%, rgba(160, 91, 47, 0.16), transparent 26%),
        radial-gradient(circle at 80% 12%, rgba(80, 121, 116, 0.12), transparent 28%),
        linear-gradient(135deg, #060806, #14170f 46%, #080a08);
}

.downtime-page .page-shell {
    width: min(1320px, 100%);
}

.downtime-board {
    display: grid;
    gap: 14px;
}

.downtime-header,
.downtime-layout,
.downtime-card,
.downtime-detail-card,
.downtime-log {
    border: 1px solid rgba(168, 130, 79, 0.28);
    border-radius: 6px;
    background:
        linear-gradient(180deg, rgba(30, 31, 23, 0.96), rgba(9, 11, 8, 0.98)),
        #10120d;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.4);
}

.downtime-header {
    display: grid;
    grid-template-columns: minmax(260px, 0.85fr) minmax(520px, 1.4fr);
    gap: 18px;
    align-items: end;
    padding: 18px;
    background:
        linear-gradient(90deg, rgba(6, 8, 6, 0.92), rgba(21, 25, 18, 0.96)),
        radial-gradient(circle at 72% 78%, rgba(181, 92, 47, 0.18), transparent 28%),
        #11140e;
}

.downtime-header h1 {
    margin: 0;
    color: #f4e8c9;
    font-size: clamp(2.1rem, 5vw, 4rem);
    line-height: 0.92;
    text-transform: uppercase;
}

.downtime-header p {
    margin: 8px 0 0;
    max-width: 660px;
    color: rgba(236, 224, 194, 0.72);
}

.downtime-status {
    display: grid;
    grid-template-columns: repeat(3, minmax(120px, 1fr));
    gap: 10px;
    margin: 0;
}

.downtime-status div {
    display: grid;
    gap: 2px;
    padding: 10px;
    border: 1px solid rgba(168, 130, 79, 0.2);
    border-radius: 5px;
    background: rgba(6, 8, 6, 0.5);
}

.downtime-status dt,
.downtime-card span,
.downtime-log span {
    color: #b99b65;
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.downtime-status dd {
    margin: 0;
    color: #f4e8c9;
    font-family: var(--font-notes);
}

.downtime-board > .quiet-message {
    border: 1px solid rgba(168, 130, 79, 0.24);
    border-radius: 4px;
    padding: 10px 12px;
    background: rgba(7, 9, 7, 0.58);
    color: rgba(236, 224, 194, 0.8);
}

.downtime-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
    overflow: hidden;
}

.downtime-activity-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    min-width: 0;
    padding: 16px;
}

.downtime-card {
    display: grid;
    gap: 8px;
    align-content: start;
    min-height: 236px;
    padding: 15px;
    background:
        linear-gradient(150deg, rgba(115, 71, 45, 0.2), transparent 44%),
        linear-gradient(180deg, rgba(31, 35, 25, 0.9), rgba(8, 10, 7, 0.95));
    color: #eadfc3;
    cursor: pointer;
}

.downtime-card:hover,
.downtime-card.is-selected {
    border-color: rgba(198, 164, 103, 0.58);
    background:
        linear-gradient(150deg, rgba(143, 85, 49, 0.26), transparent 44%),
        linear-gradient(180deg, rgba(40, 45, 30, 0.92), rgba(10, 12, 8, 0.96));
}

.downtime-card h2,
.downtime-detail-card h2,
.downtime-log h2 {
    margin: 0;
    color: #f4e8c9;
    font-family: var(--font-display);
    line-height: 0.98;
    text-transform: uppercase;
}

.downtime-card h2 {
    font-size: 1.55rem;
}

.downtime-card p,
.downtime-detail-card p,
.downtime-log p {
    margin: 0;
    color: rgba(236, 224, 194, 0.76);
}

.downtime-card small,
.downtime-detail-card small,
.downtime-log small {
    color: rgba(236, 224, 194, 0.58);
}

.downtime-cooldown {
    color: #d88363;
    font-weight: 900;
}

.action-cooldown {
    color: #8a3628;
    font-weight: 900;
}

.downtime-button {
    align-self: end;
    justify-self: start;
    min-height: 34px;
    padding: 6px 12px;
    border-radius: 4px;
    border-color: rgba(185, 155, 101, 0.34);
    background: rgba(12, 15, 10, 0.78);
    color: #e7d7ac;
    font-size: 0.78rem;
}

.downtime-button:disabled {
    cursor: not-allowed;
    opacity: 0.52;
}

.downtime-sidebar {
    display: grid;
    align-content: start;
    gap: 12px;
    padding: 16px;
}

.downtime-detail-card,
.downtime-log {
    display: grid;
    gap: 10px;
    padding: 15px;
    box-shadow: none;
}

.downtime-detail-card .mission-lines span {
    border-color: rgba(185, 155, 101, 0.22);
    background: rgba(185, 155, 101, 0.08);
    color: #e8dec5;
}

.downtime-log article {
    display: grid;
    gap: 4px;
    padding: 10px 0;
    border-top: 1px dashed rgba(185, 155, 101, 0.22);
}

.downtime-log h3 {
    margin: 0;
    color: #f4e8c9;
    font-family: var(--font-display);
    font-size: 1.18rem;
    line-height: 1;
    text-transform: uppercase;
}

@media (max-width: 980px) {
    .downtime-header,
    .downtime-layout,
    .downtime-status {
        grid-template-columns: 1fr;
    }

    .downtime-activity-grid {
        border-right: 0;
        border-bottom: 1px solid rgba(168, 130, 79, 0.22);
    }
}

.map-layout {
    display: grid;
    gap: 10px;
}

.map-page .page-shell {
    width: min(1320px, 100%);
}

.map-command-center {
    min-width: 0;
}

.map-location-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 420px);
    gap: 10px;
    align-items: end;
    min-width: 0;
    padding: 12px 14px;
    border: 1px solid rgba(200, 166, 108, 0.24);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(23, 30, 20, 0.96), rgba(8, 11, 7, 0.98)),
        radial-gradient(circle at 86% 16%, rgba(126, 94, 49, 0.16), transparent 30%),
        #10140d;
    box-shadow: 0 20px 56px rgba(0, 0, 0, 0.34);
}

.map-location-hero h1 {
    margin: 0;
    color: #f2e6c8;
    font-family: var(--font-display);
    font-size: 2.8rem;
    line-height: 0.92;
    overflow-wrap: anywhere;
    text-transform: uppercase;
}

.map-location-hero p {
    margin: 7px 0 0;
    color: rgba(236, 224, 194, 0.76);
    font-weight: 900;
    text-transform: uppercase;
}

.map-location-hero dl {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 0;
}

.map-location-hero dl div {
    min-width: 0;
    padding: 7px 9px;
    border: 1px solid rgba(200, 166, 108, 0.18);
    border-radius: 6px;
    background: rgba(4, 7, 5, 0.42);
}

.map-location-hero dt,
.map-location-hero dd {
    margin: 0;
}

.map-location-hero dt {
    color: #b99b65;
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.map-location-hero dd {
    color: #f2e6c8;
    font-family: var(--font-notes);
}

.field-flow-strip {
    display: grid;
    grid-template-columns: minmax(200px, 0.32fr) minmax(0, 1fr);
    gap: 12px;
    align-items: stretch;
    min-width: 0;
    padding: 12px;
    border: 1px solid rgba(200, 166, 108, 0.2);
    border-radius: 8px;
    background: rgba(8, 11, 7, 0.72);
}

.field-flow-current {
    display: grid;
    gap: 4px;
    align-content: center;
    min-width: 0;
    padding-right: 12px;
    border-right: 1px solid rgba(200, 166, 108, 0.16);
}

.field-flow-current h2 {
    margin: 0;
    color: #f2e6c8;
    font-family: var(--font-display);
    font-size: 1.5rem;
    line-height: 0.96;
    text-transform: uppercase;
}

.field-flow-current span {
    color: rgba(236, 224, 194, 0.62);
    font-size: 0.86rem;
}

.field-flow-actions {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
    min-width: 0;
}

.field-flow-actions a {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    grid-template-rows: auto auto;
    gap: 2px 7px;
    align-content: center;
    min-width: 0;
    min-height: 74px;
    padding: 9px;
    border: 1px solid rgba(200, 166, 108, 0.16);
    border-radius: 6px;
    background: rgba(4, 7, 5, 0.36);
    color: rgba(238, 241, 223, 0.84);
    text-decoration: none;
}

.field-flow-actions a:hover,
.field-flow-actions a.is-active {
    border-color: rgba(200, 166, 108, 0.42);
    background: rgba(200, 166, 108, 0.12);
    color: #f2e6c8;
}

.field-flow-actions .nav-icon-wrap {
    grid-row: 1 / span 2;
    display: grid;
    place-items: center;
    color: #c8a66c;
}

.field-flow-actions span {
    overflow: hidden;
    font-size: 0.82rem;
    font-weight: 900;
    line-height: 1;
    overflow-wrap: anywhere;
    text-overflow: ellipsis;
    text-transform: uppercase;
}

.field-flow-actions small {
    display: -webkit-box;
    overflow: hidden;
    color: rgba(236, 224, 194, 0.58);
    font-size: 0.74rem;
    line-height: 1.2;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.map-toolbar {
    display: grid;
    gap: 12px;
}

.map-page .map-toolbar {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    padding: 10px 12px;
    border: 1px solid rgba(85, 58, 32, 0.62);
    border-radius: 8px;
    background:
        radial-gradient(circle at 12% 20%, rgba(91, 53, 28, 0.12), transparent 28%),
        linear-gradient(90deg, rgba(113, 80, 40, 0.14), transparent 18%, transparent 84%, rgba(113, 80, 40, 0.14)),
        #d2bd8d;
    color: #2b2116;
    box-shadow: var(--shadow);
}

.map-page .map-toolbar h1 {
    color: #24180f;
    font-size: clamp(2.4rem, 8vw, 5.4rem);
    text-transform: uppercase;
}

.map-page .map-toolbar h2 {
    margin: 0;
    color: #24180f;
    font-family: var(--font-display);
    font-size: 2.2rem;
    line-height: 0.96;
    overflow-wrap: anywhere;
    text-transform: uppercase;
}

.map-page .map-toolbar .eyebrow {
    color: #5f4328;
    font-family: var(--font-notes);
    font-weight: 400;
}

.map-toolbar-copy {
    margin: 6px 0 0;
    max-width: 760px;
    color: rgba(43, 33, 22, 0.72);
    font-family: var(--font-notes);
}

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

.legend span {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 4px 8px;
    border: 1px solid var(--line);
    border-radius: 6px;
    color: var(--muted);
    font-size: 0.8rem;
}

.map-page .legend span {
    border-color: rgba(82, 57, 32, 0.34);
    color: rgba(43, 33, 22, 0.74);
    font-family: var(--font-notes);
    background: rgba(74, 52, 28, 0.06);
}

.legend-river { border-left: 4px solid #416f82 !important; }
.legend-creek { border-left: 4px solid #5f8790 !important; }
.legend-highway { border-left: 4px solid #6b3f1f !important; }
.legend-road { border-left: 4px solid #7b5732 !important; }
.legend-trail { border-left: 4px dotted #6a5a3c !important; }
.legend-known { border-left: 4px solid #c8844a !important; }
.legend-unknown { border-left: 4px dashed #6a6048 !important; }
.legend-forest { border-left: 4px solid #2d4d2f !important; }
.legend-ridge { border-left: 4px solid #51402d !important; }
.legend-strategic-site { border-left: 4px solid #9aa766 !important; }
.legend-camp { border-left: 4px solid #ead9ad !important; }
.legend-your-camp { border-left: 4px solid #f0cf78 !important; }

.map-stage {
    position: relative;
    display: block;
    align-items: start;
    min-width: 0;
}

.map-frame {
    position: relative;
    min-width: 0;
    padding: 10px;
    border: 1px solid rgba(61, 38, 18, 0.78);
    border-radius: 8px;
    background:
        repeating-linear-gradient(90deg, #3a2514 0 18px, #d9c897 18px 34px),
        #3a2514;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.48);
}

.map-frame::before {
    content: "";
    position: absolute;
    inset: 5px;
    pointer-events: none;
    border: 2px solid rgba(58, 37, 20, 0.7);
    border-radius: 5px;
    z-index: 3;
}

#skookum-map {
    position: relative;
    z-index: 1;
    height: min(74vh, 780px);
    min-height: 540px;
    border: 1px solid rgba(61, 38, 18, 0.62);
    border-radius: 4px;
    background: #10140f;
    overflow: hidden;
}

#skookum-map .asset-map-svg {
    display: block;
    width: 100%;
    height: 100%;
    background: #10140f;
}

#skookum-map.is-panzoom-ready {
    cursor: grab;
    touch-action: none;
    overscroll-behavior: contain;
    user-select: none;
    -webkit-user-select: none;
}

#skookum-map.is-panzoom-ready.is-grabbing {
    cursor: grabbing;
}

#skookum-map.is-panzoom-ready .asset-map-svg {
    touch-action: none;
}

@media (max-width: 760px) {
    #skookum-map.is-panzoom-ready,
    #skookum-map.is-panzoom-ready .asset-map-svg {
        touch-action: pan-y pinch-zoom;
    }
}

.map-zoom-controls {
    position: absolute;
    top: 22px;
    right: 22px;
    z-index: 6;
    display: grid;
    grid-template-columns: 44px;
    gap: 6px;
    padding: 6px;
    border: 1px solid rgba(61, 38, 18, 0.72);
    border-radius: 8px;
    background: rgba(27, 23, 16, 0.82);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.32);
    backdrop-filter: blur(3px);
}

.map-zoom-controls button {
    display: grid;
    place-items: center;
    min-width: 44px;
    height: 42px;
    padding: 0;
    border: 1px solid rgba(222, 199, 147, 0.42);
    border-radius: 5px;
    color: #f0dfb8;
    font-family: var(--font-display);
    font-size: 1.55rem;
    line-height: 1;
    background: rgba(42, 48, 36, 0.94);
    cursor: pointer;
    box-shadow: none;
}

.map-zoom-controls button:hover,
.map-zoom-controls button:focus-visible {
    color: #fff4d5;
    border-color: rgba(239, 208, 133, 0.85);
    background: rgba(59, 68, 49, 0.98);
    outline: none;
}

.map-zoom-controls button:disabled {
    opacity: 0.34;
    cursor: default;
}

.map-zoom-controls .map-zoom-reset {
    height: 34px;
    font-family: var(--font-notes);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.asset-map-svg path:not(.asset-map-region):not(.asset-map-hit-area):not(.asset-camp-hitbox):not(.asset-site-control-hitbox):not(.asset-strategic-site-hitbox) {
    pointer-events: none;
}

.asset-map-region {
    cursor: pointer;
    fill: rgba(239, 208, 133, 0.02);
    fill-opacity: 1;
    stroke: rgba(246, 229, 188, 0);
    stroke-opacity: 1;
    transition: fill 0.18s ease, filter 0.18s ease, opacity 0.18s ease, stroke 0.18s ease, stroke-width 0.18s ease;
}

.asset-map-region.known {
    filter: saturate(1.05) contrast(1.04);
}

.asset-map-region.unknown {
    fill: rgba(14, 16, 12, 0.84);
    stroke-dasharray: 9 6;
    filter: saturate(0.55) contrast(0.88);
}

.asset-map-region:hover,
.asset-map-region.is-hovered,
.asset-map-region:focus-visible,
.asset-map-region.is-selected {
    fill: rgba(239, 208, 133, 0.16);
    stroke: rgba(246, 229, 188, 0.82);
    filter: drop-shadow(0 0 8px rgba(0, 0, 0, 0.62)) saturate(1.12);
    outline: none;
    stroke-width: 4;
}

.asset-map-region.unknown:hover,
.asset-map-region.unknown.is-hovered,
.asset-map-region.unknown:focus-visible,
.asset-map-region.unknown.is-selected {
    fill: rgba(18, 20, 15, 0.88);
    stroke: rgba(246, 229, 188, 0.52);
    filter: saturate(0.55) contrast(0.88);
}

.asset-map-hit-area {
    cursor: pointer;
    fill: transparent;
    pointer-events: all;
    stroke: transparent;
    stroke-width: 14;
}

.asset-map-hit-area:focus-visible {
    outline: none;
    stroke: rgba(45, 29, 14, 0.38);
}

.asset-map-label,
.asset-tree,
.asset-mountain,
.asset-water,
.asset-road,
.asset-deer {
    pointer-events: none;
}

.asset-map-label {
    fill: #f0dfb8;
    font-family: var(--font-display);
    font-weight: 700;
    letter-spacing: 0;
    text-anchor: middle;
    text-transform: uppercase;
    paint-order: stroke;
    stroke: rgba(11, 13, 10, 0.82);
    stroke-width: 5;
    stroke-linejoin: round;
}

.asset-map-label.unknown {
    fill: rgba(225, 213, 184, 0.6);
    font-family: var(--font-notes);
    font-weight: 700;
    stroke: rgba(11, 13, 10, 0.68);
}

.asset-tree {
    fill: rgba(29, 52, 31, 0.74);
    stroke: rgba(27, 29, 18, 0.52);
    stroke-width: 1.1;
    stroke-linejoin: round;
}

.asset-mountain path {
    fill: rgba(61, 48, 34, 0.66);
    stroke: rgba(38, 28, 17, 0.62);
    stroke-width: 2;
    stroke-linejoin: round;
}

.asset-mountain .snow {
    fill: rgba(221, 204, 162, 0.54);
    stroke: rgba(38, 28, 17, 0.2);
}

.asset-water {
    fill: none;
    stroke: rgba(58, 104, 118, 0.72);
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 4.5;
    mix-blend-mode: multiply;
}

.asset-water.creek {
    stroke-width: 2.2;
    stroke: rgba(70, 119, 127, 0.66);
}

.asset-road {
    fill: none;
    stroke: rgba(89, 58, 28, 0.5);
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2.8;
    stroke-dasharray: 9 7;
    mix-blend-mode: multiply;
}

.asset-road.highway {
    stroke-width: 4;
    stroke-dasharray: none;
}

.asset-road.trail {
    stroke-width: 1.8;
    stroke-dasharray: 2 7;
}

.asset-deer path {
    fill: rgba(45, 29, 15, 0.7);
    stroke: rgba(45, 29, 15, 0.7);
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.asset-location {
    cursor: pointer;
    pointer-events: auto;
    transform-box: fill-box;
    transform-origin: center;
    transition: opacity 0.18s ease, transform 0.18s ease;
}

.asset-location-pin {
    fill: rgba(24, 21, 16, 0.96);
    stroke: #ead9ad;
    stroke-width: 4;
    vector-effect: non-scaling-stroke;
}

.asset-location.is-unknown .asset-location-pin {
    fill: rgba(13, 15, 13, 0.82);
    stroke: rgba(205, 190, 151, 0.5);
    stroke-dasharray: 3 3;
}

.asset-location-current-halo {
    fill: none;
    stroke: #f0cf78;
    stroke-width: 2;
    stroke-dasharray: 3 3;
    opacity: 0.95;
    vector-effect: non-scaling-stroke;
}

.asset-location.is-selected .asset-location-current-halo {
    stroke: #fff4cf;
    stroke-width: 3;
    stroke-dasharray: none;
}

.asset-location-glyph {
    pointer-events: none;
    stroke: #fff0c6;
    stroke-width: 2.6;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
}

.asset-location-glyph-settlement path,
.asset-location-glyph-shelter path {
    fill: #f0cf78;
    stroke: #fff0c6;
}

.asset-location-glyph-water {
    stroke: #93adad;
}

.asset-location-glyph-hunting {
    stroke: #a7b47f;
}

.asset-location-glyph-lookout {
    stroke: #c99769;
}

.asset-location-glyph-radio {
    stroke: #9ec0bf;
}

.asset-location-glyph-bridge {
    stroke: #cfb686;
}

.asset-location-glyph-mill {
    stroke: #d2a36f;
}

.asset-location-glyph-cave,
.asset-location-glyph-ruin {
    stroke: #c4b89d;
}

.asset-location-glyph-access {
    stroke: #cdb98f;
}

.asset-location-glyph-mystery,
.asset-location-glyph-unknown {
    stroke: rgba(207, 195, 165, 0.56);
    opacity: 0.82;
}

.asset-location-label {
    fill: #2f2115;
    font-family: var(--font-notes);
    font-size: 15px;
    font-weight: 700;
    paint-order: stroke;
    stroke: rgba(218, 196, 139, 0.9);
    stroke-width: 4;
    stroke-linejoin: round;
}

.asset-location:hover .asset-location-pin,
.asset-location:focus-visible .asset-location-pin,
.asset-location.is-selected .asset-location-pin {
    fill: #120b05;
    stroke: #fff0c6;
}

.asset-location.is-selected {
    transform: scale(1.12);
}

.asset-location.is-current .asset-location-pin {
    fill: #5a4420;
    stroke: #fff0c6;
}

.asset-strategic-site-marker {
    cursor: pointer;
    pointer-events: auto;
    transform-box: fill-box;
    transform-origin: center;
}

.asset-strategic-site-halo {
    fill: rgba(9, 12, 8, 0.28);
    stroke: rgba(244, 226, 181, 0.42);
    stroke-width: 1.5;
    stroke-dasharray: 3 3;
    vector-effect: non-scaling-stroke;
}

.asset-strategic-site-core {
    fill: rgba(30, 39, 25, 0.94);
    stroke: rgba(234, 217, 173, 0.86);
    stroke-width: 2;
    filter: drop-shadow(0 3px 4px rgba(0, 0, 0, 0.42));
    vector-effect: non-scaling-stroke;
}

.asset-strategic-site-symbol {
    fill: none;
    stroke: #f4e6bd;
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-linejoin: round;
    pointer-events: none;
    vector-effect: non-scaling-stroke;
}

.asset-strategic-site-hitbox {
    fill: transparent;
    pointer-events: all;
}

.asset-map-svg .asset-strategic-site-hitbox,
.asset-map-svg .asset-site-control-hitbox,
.asset-map-svg .asset-camp-hitbox {
    pointer-events: all;
}

.asset-strategic-site-marker:hover .asset-strategic-site-core,
.asset-strategic-site-marker:focus-visible .asset-strategic-site-core,
.asset-strategic-site-marker.is-selected .asset-strategic-site-core {
    fill: rgba(18, 22, 14, 0.98);
    stroke: #fff4cf;
    stroke-width: 3;
}

.asset-strategic-site-marker.is-selected .asset-strategic-site-halo {
    stroke: rgba(255, 244, 207, 0.88);
    stroke-dasharray: none;
}

.asset-strategic-site-salvage .asset-strategic-site-core,
.asset-strategic-site-construction .asset-strategic-site-core {
    fill: rgba(67, 52, 32, 0.96);
}

.asset-strategic-site-food .asset-strategic-site-core,
.asset-strategic-site-hunting .asset-strategic-site-core {
    fill: rgba(47, 65, 34, 0.96);
}

.asset-strategic-site-medical .asset-strategic-site-core {
    fill: rgba(39, 73, 55, 0.96);
}

.asset-strategic-site-fuel .asset-strategic-site-core {
    fill: rgba(81, 54, 30, 0.96);
}

.asset-strategic-site-intelligence .asset-strategic-site-core,
.asset-strategic-site-communications .asset-strategic-site-core {
    fill: rgba(43, 62, 72, 0.96);
}

.asset-strategic-site-logistics .asset-strategic-site-core,
.asset-strategic-site-lumber .asset-strategic-site-core {
    fill: rgba(69, 66, 38, 0.96);
}

.asset-site-control-marker {
    cursor: pointer;
    pointer-events: auto;
}

.asset-site-control-pole {
    stroke: rgba(37, 20, 13, 0.94);
    stroke-width: 2.7;
    stroke-linecap: round;
    vector-effect: non-scaling-stroke;
}

.asset-site-control-pennant {
    fill: rgba(115, 48, 31, 0.95);
    stroke: rgba(235, 196, 146, 0.9);
    stroke-width: 2;
    filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.42));
    vector-effect: non-scaling-stroke;
}

.asset-site-control-anchor {
    fill: #26130c;
    stroke: rgba(235, 196, 146, 0.74);
    stroke-width: 1.4;
    vector-effect: non-scaling-stroke;
}

.asset-site-control-hitbox {
    fill: transparent;
    pointer-events: all;
}

.asset-site-control-marker:hover .asset-site-control-pennant,
.asset-site-control-marker:focus-visible .asset-site-control-pennant,
.asset-site-control-marker.is-selected .asset-site-control-pennant {
    fill: rgba(137, 61, 39, 0.98);
    stroke: #fff4cf;
}

.asset-site-control-marker.is-selected .asset-site-control-anchor {
    stroke: #fff4cf;
}

.asset-site-control-controlled .asset-site-control-pennant {
    fill: rgba(100, 53, 35, 0.96);
}

.asset-site-control-established .asset-site-control-pennant {
    fill: rgba(112, 68, 39, 0.96);
}

.asset-site-control-contested .asset-site-control-pennant {
    fill: rgba(112, 55, 38, 0.96);
}

.asset-site-control-marker.is-player-camp .asset-site-control-pennant {
    stroke: #f0cf78;
    stroke-width: 2.2;
}

.asset-camp-marker {
    cursor: pointer;
    pointer-events: auto;
    transform-box: fill-box;
    transform-origin: center;
}

.asset-camp-banner-shadow {
    fill: rgba(9, 7, 5, 0.5);
    transform: translate(2px, 3px);
}

.asset-camp-banner-frame {
    fill: rgba(28, 22, 16, 0.92);
    stroke: rgba(245, 226, 181, 0.86);
    stroke-width: 2;
    filter: drop-shadow(0 3px 4px rgba(0, 0, 0, 0.45));
    vector-effect: non-scaling-stroke;
}

.asset-camp-banner-image {
    pointer-events: none;
}

.asset-camp-banner-rim {
    fill: none;
    stroke: rgba(52, 34, 17, 0.82);
    stroke-width: 1.2;
    vector-effect: non-scaling-stroke;
}

.asset-camp-hitbox {
    fill: transparent;
    pointer-events: all;
}

.asset-camp-marker:hover .asset-camp-banner-frame,
.asset-camp-marker:focus-visible .asset-camp-banner-frame,
.asset-camp-marker.is-selected .asset-camp-banner-frame {
    stroke: #fff4cf;
    stroke-width: 3;
    fill: rgba(20, 13, 8, 0.96);
}

.asset-camp-marker.is-selected .asset-camp-banner-rim {
    stroke: #fff4cf;
    stroke-width: 2;
}

.asset-camp-marker.is-player-camp .asset-camp-banner-frame {
    stroke: #f0cf78;
    stroke-width: 3;
}

.asset-camp-cluster-badge {
    cursor: pointer;
    pointer-events: auto;
}

.asset-camp-cluster-badge circle {
    fill: rgba(28, 22, 16, 0.92);
    stroke: #ead9ad;
    stroke-width: 2;
    vector-effect: non-scaling-stroke;
}

.asset-camp-cluster-badge text {
    fill: #f4e6bd;
    font-family: var(--font-notes);
    font-size: 12px;
    font-weight: 900;
}

.map-error {
    display: grid;
    min-height: inherit;
    place-items: center;
    padding: 24px;
    color: #4b2f18;
    font-family: var(--font-notes);
    text-align: center;
    background: #d2bd8d;
}

.fallback-map {
    display: block;
    width: 100%;
    min-height: inherit;
    background: #d2bd8d;
}

.illustrated-map {
    overflow: hidden;
}

.fallback-paper {
    fill: #d2bd8d;
}

.paper-noise {
    filter: url("#paperNoise");
    opacity: 0.72;
}

.fallback-border {
    fill: none;
    stroke: rgba(61, 38, 18, 0.72);
    stroke-width: 3;
}

.county-fill {
    fill: rgba(209, 190, 138, 0.92);
    stroke: none;
    filter: url("#landShadow");
}

.county-shadow {
    fill: rgba(34, 50, 40, 0.3);
    filter: url("#landShadow");
}

.county-outline {
    fill: none;
    stroke: rgba(36, 24, 12, 0.92);
    stroke-width: 5.5;
    stroke-linejoin: round;
    stroke-linecap: round;
}

.drawn-region {
    cursor: pointer;
    fill: var(--region-fill);
    fill-opacity: 0.84;
    stroke: rgba(37, 24, 12, 0.48);
    stroke-width: 1.1;
    stroke-linejoin: round;
    stroke-linecap: round;
    transition: fill 0.18s ease;
}

.drawn-region.known {
    opacity: 0.96;
}

.drawn-region.unknown {
    fill: #8a8064;
    opacity: 0.55;
}

.drawn-region:hover {
    fill-opacity: 1;
}

.drawn-boundary {
    fill: none;
    stroke: rgba(35, 22, 10, 0.72);
    stroke-width: 2.3;
    stroke-linejoin: round;
    stroke-linecap: round;
}

.drawn-boundary.unknown {
    stroke-dasharray: 8 8;
    stroke: rgba(35, 22, 10, 0.38);
}

.fallback-region {
    stroke: #5b3d22;
    stroke-width: 2;
    cursor: pointer;
    transition: fill 0.18s ease, stroke-width 0.18s ease;
}

.fallback-region:hover {
    stroke-width: 3;
}

.fallback-region.known {
    fill: rgba(220, 202, 151, 0.82);
}

.fallback-region.unknown {
    fill: rgba(125, 105, 68, 0.58);
    stroke-dasharray: 8 6;
}

.fallback-contour {
    fill: none;
    stroke: rgba(112, 88, 53, 0.35);
    stroke-width: 1.3;
}

.terrain-mark {
    pointer-events: none;
}

.terrain-mark.mountains path {
    fill: rgba(63, 45, 27, 0.46);
    stroke: rgba(45, 29, 13, 0.62);
    stroke-width: 2;
    stroke-linejoin: round;
}

.terrain-mark.mountains path.snow {
    fill: rgba(216, 199, 156, 0.42);
    stroke: rgba(45, 29, 13, 0.22);
}

.terrain-mark.tree {
    fill: rgba(34, 53, 32, 0.58);
    stroke: rgba(32, 31, 19, 0.46);
    stroke-width: 1;
    stroke-linejoin: round;
}

.animal-mark {
    fill: rgba(47, 30, 15, 0.72);
    stroke: rgba(47, 30, 15, 0.72);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    pointer-events: none;
}

.animal-mark.grouse {
    stroke-width: 1.6;
}

.fallback-water {
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.fallback-water.river {
    stroke: #416f82;
    stroke-width: 5;
}

.fallback-water.creek {
    stroke: #5f8790;
    stroke-width: 2.5;
}

.fallback-road {
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.fallback-road.highway {
    stroke: #6b3f1f;
    stroke-width: 4;
}

.fallback-road.gravel-road {
    stroke: #7b5732;
    stroke-width: 3;
}

.fallback-road.logging-road {
    stroke: #71512f;
    stroke-width: 2.4;
    stroke-dasharray: 8 5;
}

.fallback-road.trail {
    stroke: #6a5a3c;
    stroke-width: 1.8;
    stroke-dasharray: 2 5;
}

.fallback-location {
    fill: #6a4224;
    stroke: #d8c996;
    stroke-width: 2;
    cursor: pointer;
}

.fallback-location:hover {
    fill: #2f1c0e;
    stroke-width: 3;
}

.fallback-label {
    fill: #3e2814;
    paint-order: stroke;
    stroke: #d9c897;
    stroke-width: 4;
    stroke-linejoin: round;
    font-family: Georgia, serif;
    text-anchor: middle;
}

.region-label {
    font-size: 17px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.region-label.unknown {
    fill: rgba(62, 40, 20, 0.52);
}

.location-label {
    font-size: 13px;
    text-anchor: start;
}

.map-title-mark {
    fill: rgba(54, 33, 16, 0.84);
    font-family: var(--font-display);
    font-size: 42px;
    text-transform: uppercase;
    paint-order: stroke;
    stroke: rgba(219, 200, 149, 0.66);
    stroke-width: 3;
}

.map-compass {
    position: absolute;
    left: 24px;
    bottom: 24px;
    z-index: 4;
    display: grid;
    place-items: center;
    width: 66px;
    aspect-ratio: 1;
    border: 2px solid rgba(61, 38, 18, 0.68);
    border-radius: 50%;
    color: #4b2f18;
    font-family: var(--font-display);
    font-size: 1rem;
    background: rgba(213, 194, 142, 0.88);
    box-shadow: 0 4px 16px rgba(64, 41, 21, 0.24);
}

.map-compass::before {
    content: "";
    position: absolute;
    top: 10px;
    left: 50%;
    width: 0;
    height: 0;
    transform: translateX(-50%);
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 31px solid rgba(61, 38, 18, 0.82);
}

.map-compass::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 11px;
    width: 2px;
    height: 20px;
    transform: translateX(-50%);
    background: rgba(61, 38, 18, 0.68);
}

.map-compass span {
    position: relative;
    z-index: 1;
    transform: translateY(-21px);
    color: #2e1d0e;
}

.region-panel {
    min-height: 160px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: rgba(19, 24, 18, 0.96);
    overflow-y: auto;
    overscroll-behavior: contain;
    min-width: 0;
    overflow-wrap: anywhere;
}

.map-page .region-panel {
    position: absolute;
    top: 22px;
    right: 22px;
    z-index: 8;
    width: min(360px, calc(100% - 44px));
    max-height: min(68vh, 720px);
    padding-bottom: 28px;
    border-color: rgba(85, 58, 32, 0.62);
    border-radius: 8px;
    background:
        radial-gradient(circle at 22% 20%, rgba(91, 53, 28, 0.11), transparent 24%),
        repeating-linear-gradient(0deg, transparent 0, transparent 31px, rgba(75, 88, 83, 0.16) 32px),
        #d2bd8d;
    color: #2b2116;
    font-family: var(--font-notes);
    box-shadow: var(--shadow);
}

.map-page .region-panel.is-hidden {
    display: none;
}

.map-panel-close {
    position: sticky;
    top: 0;
    z-index: 1;
    float: right;
    min-height: 34px;
    margin: -6px -6px 8px 10px;
    padding: 5px 8px;
    border-color: rgba(82, 57, 32, 0.28);
    border-radius: 4px;
    background: rgba(43, 33, 22, 0.12);
    color: #281d13;
    font-family: var(--font-notes);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
    box-shadow: none;
}

.map-panel-body {
    display: grid;
    gap: 8px;
    clear: both;
}

.region-panel h2 {
    margin: 0 0 8px;
}

.map-page .region-panel h2 {
    color: #281d13;
    font-family: var(--font-display);
    font-size: 1.65rem;
    text-transform: uppercase;
}

.region-panel p {
    color: var(--muted);
}

.map-page .region-panel p,
.map-page .region-panel small {
    color: rgba(43, 33, 22, 0.76);
}

.map-intel-stack {
    display: grid;
    gap: 12px;
    margin-top: 14px;
}

.map-intel-stack section {
    display: grid;
    gap: 8px;
    padding: 11px;
    border: 1px solid rgba(82, 57, 32, 0.2);
    border-radius: 5px;
    background: rgba(74, 52, 28, 0.06);
}

.map-intel-stack h3 {
    margin: 0;
    color: #352416;
    font-family: var(--font-display);
    font-size: 1.05rem;
    line-height: 1;
    text-transform: uppercase;
}

.map-intel-stack > section:first-child {
    margin-top: 0;
}

.map-intel-stack p {
    margin: 0;
}

.map-intel-badges,
.map-intel-items {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.map-intel-badges span,
.map-intel-items span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 28px;
    padding: 5px 8px;
    border: 1px solid rgba(82, 57, 32, 0.2);
    border-radius: 4px;
    background: rgba(36, 24, 14, 0.08);
    color: #2d2116;
    font-family: var(--font-notes);
    font-size: 0.82rem;
}

.map-intel-items small {
    color: rgba(43, 33, 22, 0.52);
    font-size: 0.68rem;
    text-transform: uppercase;
}

.map-intel-list {
    display: grid;
    gap: 7px;
    margin: 0;
}

.map-intel-list div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(82, 57, 32, 0.18);
}

.map-intel-list dt,
.map-intel-list dd {
    margin: 0;
    color: #2d2116;
    font-family: var(--font-notes);
    font-size: 0.84rem;
}

.map-intel-list dt a {
    color: inherit;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}

.map-intel-list dd {
    text-align: right;
    color: rgba(43, 33, 22, 0.66);
}

.map-camp-banner {
    margin: 12px 0;
    width: 100%;
    max-width: 190px;
    border: 1px solid rgba(82, 57, 32, 0.28);
    border-radius: 6px;
    overflow: hidden;
    background: rgba(36, 24, 14, 0.12);
}

.map-camp-banner img {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
}

.map-camp-stats {
    margin: 12px 0;
}

.map-site-stats {
    margin: 12px 0;
}

.map-site-note {
    display: grid;
    gap: 4px;
    padding: 10px;
    border: 1px solid rgba(154, 167, 102, 0.28);
    border-radius: 5px;
    background: rgba(19, 29, 18, 0.42);
}

.map-camp-list {
    display: grid;
    gap: 8px;
    margin-top: 12px;
}

.map-camp-card {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    padding: 8px;
    border: 1px solid rgba(82, 57, 32, 0.22);
    border-radius: 5px;
    background: rgba(74, 52, 28, 0.08);
    color: inherit;
    text-decoration: none;
}

.map-camp-card img {
    width: 54px;
    height: 54px;
    border: 1px solid rgba(82, 57, 32, 0.28);
    border-radius: 4px;
    object-fit: cover;
}

.map-camp-card span {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.map-camp-card strong,
.map-camp-card small {
    overflow-wrap: anywhere;
}

.map-camp-card strong {
    color: #2d2116;
    font-family: var(--font-display);
    font-size: 1.04rem;
    line-height: 1;
}

.map-travel-card button {
    justify-self: stretch;
    min-height: 44px;
    border-color: rgba(50, 65, 35, 0.58);
    border-radius: 5px;
    background:
        linear-gradient(180deg, rgba(94, 120, 68, 0.88), rgba(48, 70, 37, 0.88)),
        #5f7844;
    color: #f5edd0;
    font-family: var(--font-notes);
    font-size: 1rem;
    box-shadow: 0 8px 18px rgba(38, 29, 17, 0.22);
}

.map-route-list {
    display: grid;
    gap: 8px;
}

.map-route-list button {
    display: grid;
    gap: 3px;
    min-height: 48px;
    padding: 9px 10px;
    border: 1px solid rgba(50, 65, 35, 0.32);
    border-radius: 5px;
    background:
        linear-gradient(90deg, rgba(84, 106, 57, 0.2), rgba(74, 52, 28, 0.06)),
        rgba(245, 228, 184, 0.2);
    color: #2f3f24;
    font-family: var(--font-notes);
    text-align: left;
    text-transform: none;
}

.map-route-list button:hover {
    border-color: rgba(50, 65, 35, 0.58);
    background:
        linear-gradient(90deg, rgba(84, 106, 57, 0.3), rgba(74, 52, 28, 0.08)),
        rgba(245, 228, 184, 0.28);
}

.map-route-list span {
    color: #28351f;
    font-weight: 900;
}

.map-route-list small,
.map-route-note small {
    color: rgba(43, 33, 22, 0.58);
}

.map-route-hint {
    display: grid;
    gap: 6px;
    margin-top: 8px;
    padding: 10px;
    border: 1px solid rgba(82, 57, 32, 0.24);
    border-radius: 5px;
    background:
        linear-gradient(90deg, rgba(84, 106, 57, 0.16), rgba(74, 52, 28, 0.06)),
        rgba(245, 228, 184, 0.18);
}

.map-route-hint strong {
    color: #2f3f24;
    font-family: var(--font-notes);
    font-size: 0.78rem;
    text-transform: uppercase;
}

.map-route-hint p {
    color: #2d2116;
}

.map-route-hint button {
    justify-self: start;
    min-height: 38px;
    padding: 7px 10px;
    border-color: rgba(50, 65, 35, 0.42);
    background: rgba(48, 70, 37, 0.82);
    color: #f5edd0;
}

.map-route-note {
    border-style: dashed !important;
}

.map-travel-card > span {
    color: #4d6238;
    font-family: var(--font-notes);
    font-size: 0.78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.map-travel-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 0;
}

.map-travel-stats div {
    display: grid;
    gap: 2px;
    padding: 8px;
    border: 1px solid rgba(50, 65, 35, 0.2);
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.14);
}

.map-travel-stats dt,
.map-travel-stats dd {
    margin: 0;
    color: #2f3f24;
    font-family: var(--font-notes);
}

.map-travel-stats dt {
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.map-travel-stats dd {
    font-size: 1.05rem;
}

.map-travel-load-note {
    color: #5b4a32;
    font-family: var(--font-notes);
    font-size: 0.82rem;
    line-height: 1.35;
}

.map-travel-links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
}

.map-travel-links a,
.map-panel-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    text-align: center;
    padding: 6px 9px;
    border: 1px solid rgba(82, 57, 32, 0.24);
    border-radius: 4px;
    background: rgba(74, 52, 28, 0.06);
    color: #352416;
    font-family: var(--font-notes);
    font-size: 0.78rem;
    font-weight: 900;
    text-decoration: none;
    text-transform: uppercase;
}

.map-travel-card button:hover {
    background:
        linear-gradient(180deg, rgba(116, 142, 82, 0.92), rgba(58, 84, 43, 0.92)),
        #6f8b51;
}

.map-travel-card {
    position: sticky;
    top: 0;
    z-index: 2;
    border-color: rgba(50, 65, 35, 0.32) !important;
    background:
        linear-gradient(180deg, rgba(217, 201, 155, 0.98), rgba(197, 173, 120, 0.98)) !important;
    box-shadow: 0 10px 24px rgba(58, 37, 20, 0.18);
}

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

.page-tabs {
    display: grid;
    gap: 14px;
}

.page-tab-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.page-tab-list button {
    flex: 1 1 132px;
    min-width: 0;
    min-height: 42px;
    padding: 9px 12px;
    border: 1px solid rgba(200, 166, 108, 0.3);
    border-radius: 6px;
    background: rgba(7, 10, 8, 0.76);
    color: var(--muted);
    font-weight: 900;
    line-height: 1.12;
    text-transform: uppercase;
    white-space: nowrap;
}

.page-tab-list button.is-active,
.page-tab-list button[aria-selected="true"],
.page-tab-list button:hover {
    background: rgba(200, 166, 108, 0.14);
    color: var(--text);
}

.page-tab-panel {
    display: none;
}

.page-tab-panel.is-active {
    display: grid;
    gap: 14px;
}

.shelter-page-wrap,
.journal-board,
.settings-board,
.faq-board {
    display: grid;
    gap: 18px;
}

.shelter-hero,
.journal-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 420px);
    gap: 18px;
    align-items: center;
    padding: 20px;
    border: 1px solid rgba(200, 166, 108, 0.28);
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(28, 35, 27, 0.92), rgba(18, 23, 17, 0.96)),
        #171d15;
}

.shelter-command-hero {
    grid-template-columns: minmax(0, 1.05fr) minmax(220px, 0.72fr) minmax(180px, 300px);
    align-items: stretch;
}

.shelter-hero h1,
.journal-hero h1 {
    margin: 0;
    font-size: clamp(2.2rem, 6vw, 5rem);
    line-height: 0.9;
}

.shelter-command-hero h1 {
    font-size: 4rem;
    overflow-wrap: anywhere;
}

.shelter-hero p,
.journal-hero p {
    margin: 8px 0 0;
    color: var(--muted);
    font-size: 1.08rem;
}

.shelter-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}

.shelter-hero-actions a,
.shelter-recovery-primary a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    min-height: 36px;
    padding: 8px 12px;
    border: 1px solid rgba(200, 166, 108, 0.3);
    border-radius: 6px;
    background: rgba(200, 166, 108, 0.12);
    color: #f2e6c8;
    font-size: 0.82rem;
    font-weight: 900;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
}

.shelter-hero-status {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    align-content: stretch;
    margin: 0;
    min-width: 0;
}

.shelter-hero-status div {
    display: grid;
    align-content: center;
    min-width: 0;
    min-height: 78px;
    padding: 10px;
    border: 1px solid rgba(200, 166, 108, 0.18);
    border-radius: 6px;
    background: rgba(7, 10, 8, 0.52);
}

.shelter-hero-status dt,
.shelter-hero-status dd {
    margin: 0;
}

.shelter-hero-status dt {
    color: var(--tan);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.shelter-hero-status dd {
    margin-top: 4px;
    color: #f2e6c8;
    font-family: var(--font-notes);
    font-size: 1.05rem;
    overflow-wrap: anywhere;
}

.shelter-hero-visual {
    display: grid;
    gap: 6px;
    margin: 0;
    justify-items: center;
}

.shelter-hero-visual img {
    width: min(100%, 360px);
    max-height: 260px;
    object-fit: contain;
}

.shelter-hero-visual figcaption {
    color: var(--tan);
    font-weight: 900;
    text-transform: uppercase;
}

.shelter-recovery-board {
    display: grid;
    grid-template-columns: minmax(220px, 0.76fr) minmax(0, 1.34fr) minmax(190px, 0.56fr);
    gap: 12px;
    align-items: stretch;
    min-width: 0;
}

.shelter-recovery-primary,
.shelter-exposure-card {
    min-width: 0;
    border: 1px solid rgba(200, 166, 108, 0.22);
    border-radius: 8px;
    background: rgba(14, 18, 13, 0.84);
}

.shelter-recovery-primary {
    display: grid;
    gap: 8px;
    align-content: start;
    padding: 16px;
}

.shelter-recovery-primary.is-ready {
    border-color: rgba(128, 167, 92, 0.34);
    background:
        linear-gradient(180deg, rgba(33, 48, 27, 0.86), rgba(14, 20, 13, 0.92)),
        #121a10;
}

.shelter-recovery-primary.is-blocked {
    border-color: rgba(208, 132, 86, 0.34);
    background:
        linear-gradient(180deg, rgba(55, 36, 21, 0.86), rgba(18, 15, 11, 0.94)),
        #17120d;
}

.shelter-recovery-primary h2,
.shelter-exposure-card strong {
    margin: 0;
    color: #f4e8c8;
    font-family: var(--font-display);
    font-size: 1.8rem;
    line-height: 0.96;
    overflow-wrap: anywhere;
    text-transform: uppercase;
}

.shelter-recovery-primary p,
.shelter-exposure-card p {
    margin: 0;
    color: rgba(236, 224, 194, 0.7);
    line-height: 1.45;
}

.shelter-recovery-primary a {
    justify-self: start;
    margin-top: 4px;
}

.shelter-recovery-checklist {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
    min-width: 0;
}

.shelter-exposure-card span {
    color: var(--tan);
    font-size: 0.7rem;
    font-weight: 900;
    text-transform: uppercase;
}

.shelter-exposure-card {
    display: grid;
    gap: 8px;
    align-content: start;
    padding: 14px;
}

.shelter-exposure-card strong {
    font-size: 1.55rem;
}

.shelter-stat-grid,
.settings-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.shelter-stat-grid article,
.settings-grid article,
.journal-list article,
.shelter-info-card,
.shelter-upgrade-panel {
    border: 1px solid rgba(200, 166, 108, 0.22);
    border-radius: 8px;
    background: rgba(14, 18, 13, 0.84);
}

.shelter-stat-grid article,
.settings-grid article,
.journal-list article,
.shelter-info-card {
    padding: 14px;
}

.shelter-stat-grid span,
.settings-grid span,
.journal-list span,
.shelter-info-card span {
    color: var(--tan);
    font-size: 0.78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.shelter-stat-grid strong {
    display: block;
    margin-top: 4px;
    color: var(--text);
    font-family: var(--font-notes);
    font-size: 1.2rem;
}

.shelter-upgrade-panel {
    padding: 16px;
}

.shelter-security-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 12px;
}

.shelter-security-grid .shelter-info-card {
    display: grid;
    gap: 8px;
}

.shelter-security-button {
    justify-self: start;
    border: 1px solid rgba(200, 166, 108, 0.34);
    border-radius: 6px;
    padding: 8px 12px;
    background: rgba(200, 166, 108, 0.14);
    color: var(--text);
    font-weight: 900;
    text-transform: uppercase;
    cursor: pointer;
}

.shelter-security-button:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

.shelter-upgrade-panel h2,
.settings-grid h2,
.journal-list h2,
.shelter-info-card h2 {
    margin: 4px 0 8px;
    font-family: var(--font-display);
    font-weight: 400;
    line-height: 0.98;
}

.journal-hero dl {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
}

.journal-hero dl div {
    padding: 12px;
    border: 1px solid rgba(200, 166, 108, 0.22);
    border-radius: 7px;
    background: rgba(7, 10, 8, 0.68);
}

.journal-hero dt,
.journal-list small {
    color: var(--muted);
}

.journal-hero dd {
    margin: 0;
    color: var(--text);
    font-family: var(--font-notes);
    font-size: 1.15rem;
}

.journal-list {
    display: grid;
    gap: 10px;
}

.journal-benefits {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.journal-benefits article {
    display: grid;
    gap: 7px;
    padding: 14px;
    border: 1px solid rgba(200, 166, 108, 0.22);
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(24, 30, 23, 0.88), rgba(10, 14, 10, 0.94)),
        #11170f;
}

.journal-benefits span {
    color: var(--tan);
    font-size: 0.78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.journal-benefits h2 {
    margin: 0;
    color: var(--text);
    font-family: var(--font-display);
    line-height: 0.98;
}

.journal-benefits p {
    margin: 0;
    color: var(--muted);
    line-height: 1.45;
}

.journal-list article {
    display: grid;
    gap: 5px;
}

.journal-list p,
.settings-grid p,
.shelter-info-card p {
    margin: 0;
    color: var(--muted);
}

.journal-list a {
    justify-self: start;
    padding: 7px 12px;
    border: 1px solid rgba(200, 166, 108, 0.3);
    border-radius: 6px;
    color: var(--text);
    text-decoration: none;
    font-weight: 900;
    text-transform: uppercase;
}

.settings-board > .quiet-message,
.trade-board > .quiet-message,
.alerts-board > .quiet-message {
    border: 1px solid rgba(200, 166, 108, 0.22);
    border-radius: 6px;
    padding: 10px 12px;
    background: rgba(7, 9, 7, 0.56);
}

.settings-form,
.trade-layout {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    align-items: start;
}

.settings-panel,
.trade-panel,
.alerts-list article,
.alerts-list a {
    border: 1px solid rgba(200, 166, 108, 0.24);
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(25, 31, 23, 0.92), rgba(12, 15, 11, 0.97)),
        #121710;
}

.settings-panel,
.trade-panel {
    display: grid;
    gap: 12px;
    padding: 16px;
}

.settings-panel h2,
.trade-panel h2,
.alerts-list p {
    margin: 0;
}

.settings-panel h2,
.trade-panel h2 {
    color: #f5ecd2;
    font-family: var(--font-display);
    font-size: clamp(1.8rem, 3vw, 2.6rem);
    font-weight: 400;
    line-height: 0.95;
}

.settings-panel label,
.trade-form label {
    display: grid;
    gap: 7px;
    color: var(--tan);
    font-size: 0.8rem;
    font-weight: 900;
    text-transform: uppercase;
}

.setting-toggle {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 10px;
    padding: 10px;
    border: 1px solid rgba(200, 166, 108, 0.16);
    border-radius: 6px;
    background: rgba(5, 8, 6, 0.42);
    text-transform: none;
}

.setting-toggle input {
    margin-top: 4px;
    accent-color: #c79b52;
}

.setting-toggle span {
    display: grid;
    gap: 3px;
}

.setting-toggle strong {
    color: #f4e9ca;
    font-size: 0.95rem;
    text-transform: uppercase;
}

.setting-toggle small,
.settings-panel p,
.trade-list p,
.alerts-list small {
    color: rgba(236, 224, 194, 0.7);
}

.settings-panel input[type="text"],
.settings-panel select,
.trade-form input,
.trade-form select,
.trade-form textarea {
    width: 100%;
    border: 1px solid rgba(200, 166, 108, 0.24);
    border-radius: 6px;
    padding: 10px 11px;
    background: rgba(5, 8, 6, 0.72);
    color: #f2ead1;
    font: inherit;
}

.settings-panel--account {
    align-content: start;
}

.settings-panel--account button,
.trade-form button,
.trade-response-button,
.alerts-actions button,
.alerts-actions a {
    justify-self: start;
    min-width: 150px;
}

.trade-layout {
    grid-template-columns: minmax(280px, 0.9fr) minmax(0, 1fr) minmax(0, 1fr);
}

.trade-form {
    display: grid;
    gap: 11px;
}

.trade-form textarea {
    min-height: 92px;
    resize: vertical;
}

.trade-list {
    display: grid;
    gap: 10px;
}

.trade-list article {
    display: grid;
    gap: 8px;
    padding: 12px;
    border: 1px solid rgba(200, 166, 108, 0.16);
    border-radius: 6px;
    background: rgba(5, 8, 6, 0.44);
}

.trade-list span,
.alerts-list span {
    color: var(--tan);
    font-size: 0.78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.trade-list strong {
    color: #f3ead0;
    font-family: var(--font-notes);
    font-size: 1.05rem;
}

.alerts-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.alerts-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 9px 13px;
    border: 1px solid rgba(200, 166, 108, 0.28);
    border-radius: 6px;
    color: #f2ead1;
    text-decoration: none;
    font-weight: 900;
    text-transform: uppercase;
}

.alerts-list {
    display: grid;
    gap: 10px;
}

.alerts-list article,
.alerts-list a {
    display: grid;
    gap: 6px;
    padding: 14px;
    color: inherit;
    text-decoration: none;
}

.alerts-list article.is-unread,
.alerts-list a.is-unread {
    border-color: rgba(190, 62, 47, 0.56);
    background:
        linear-gradient(180deg, rgba(45, 25, 19, 0.9), rgba(17, 12, 9, 0.96)),
        #1a100d;
}

.alerts-list article.is-unread small,
.alerts-list a.is-unread small {
    color: #f1c6bb;
}

.compact-interface .page-shell {
    padding-top: 14px;
}

.compact-interface .journal-hero,
.compact-interface .settings-panel,
.compact-interface .trade-panel,
.compact-interface .alerts-list article {
    padding: 12px;
}

.reduce-motion *,
.reduce-motion *::before,
.reduce-motion *::after {
    animation-duration: 0.01ms !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
}

.faq-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.faq-actions button,
.faq-actions a {
    min-width: 160px;
}

.faq-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.faq-section {
    display: grid;
    align-content: start;
    gap: 8px;
    padding: 16px;
    border: 1px solid rgba(200, 166, 108, 0.22);
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(23, 29, 22, 0.9), rgba(11, 15, 11, 0.96)),
        #11170f;
}

.faq-section details {
    border: 1px solid rgba(200, 166, 108, 0.16);
    border-radius: 6px;
    background: rgba(5, 8, 6, 0.46);
}

.faq-section summary {
    padding: 12px;
    color: #f2e6c8;
    cursor: pointer;
    font-weight: 900;
    text-transform: uppercase;
}

.faq-section p {
    margin: 0;
    padding: 0 12px 12px;
    color: rgba(236, 224, 194, 0.72);
    line-height: 1.5;
}

.journal-subhead {
    margin: 8px 0 0;
}

.messages-board {
    display: grid;
    gap: 18px;
}

.messages-layout {
    display: grid;
    grid-template-columns: minmax(250px, 340px) minmax(0, 1fr);
    gap: 14px;
    align-items: start;
}

.message-thread-list,
.message-conversation,
.message-empty {
    border: 1px solid rgba(200, 166, 108, 0.24);
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(25, 31, 23, 0.92), rgba(12, 15, 11, 0.97)),
        #121710;
}

.message-thread-list {
    display: grid;
    gap: 8px;
    padding: 14px;
}

.message-thread-list a {
    position: relative;
    display: grid;
    gap: 5px;
    padding: 11px 12px;
    border: 1px solid rgba(200, 166, 108, 0.16);
    border-radius: 6px;
    background: rgba(5, 8, 6, 0.5);
    color: var(--text);
    text-decoration: none;
}

.message-thread-list a.is-active,
.message-thread-list a:hover {
    border-color: rgba(200, 166, 108, 0.46);
    background: rgba(200, 166, 108, 0.1);
}

.message-thread-list strong {
    color: #f1e4c2;
    font-family: var(--font-display);
    font-size: 1.25rem;
    line-height: 1;
}

.message-thread-list span,
.message-thread-list small {
    color: rgba(238, 230, 204, 0.68);
}

.message-thread-list small {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.message-thread-list em {
    position: absolute;
    top: 9px;
    right: 9px;
    display: grid;
    min-width: 22px;
    height: 22px;
    place-items: center;
    border-radius: 999px;
    background: #9f2f25;
    color: #fff1d5;
    font-style: normal;
    font-weight: 900;
}

.message-conversation {
    display: grid;
    min-height: 520px;
    overflow: hidden;
}

.message-conversation-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px;
    border-bottom: 1px solid rgba(200, 166, 108, 0.18);
}

.message-conversation-head h2,
.message-empty h2 {
    margin: 0;
    color: #f5ecd2;
    font-family: var(--font-display);
    font-size: clamp(2rem, 4vw, 3.2rem);
    line-height: 0.9;
}

.message-conversation-head a {
    flex: 0 0 auto;
    padding: 8px 12px;
    border: 1px solid rgba(200, 166, 108, 0.32);
    border-radius: 5px;
    color: #ead8a7;
    text-decoration: none;
    font-weight: 900;
    text-transform: uppercase;
}

.message-bubbles {
    display: grid;
    align-content: start;
    gap: 10px;
    max-height: 52vh;
    min-height: 260px;
    overflow-y: auto;
    padding: 16px;
    background:
        linear-gradient(180deg, rgba(6, 9, 6, 0.2), rgba(6, 9, 6, 0.64)),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.025) 0, rgba(255, 255, 255, 0.025) 1px, transparent 1px, transparent 34px);
}

.message-bubbles article {
    display: grid;
    gap: 5px;
    width: min(78%, 620px);
    padding: 11px 12px;
    border: 1px solid rgba(185, 150, 94, 0.22);
    border-radius: 7px;
    background: rgba(22, 28, 19, 0.86);
}

.message-bubbles article.is-mine {
    justify-self: end;
    border-color: rgba(112, 143, 95, 0.36);
    background: rgba(35, 49, 31, 0.86);
}

.message-bubbles span {
    color: var(--tan);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.message-bubbles p,
.message-empty p {
    margin: 0;
    color: rgba(239, 234, 215, 0.86);
}

.message-compose {
    display: grid;
    gap: 10px;
    padding: 14px;
    border-top: 1px solid rgba(200, 166, 108, 0.18);
    background: rgba(5, 8, 6, 0.5);
}

.message-compose label {
    display: grid;
    gap: 7px;
}

.message-compose span {
    color: var(--tan);
    font-size: 0.78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.message-compose textarea {
    width: 100%;
    min-height: 116px;
    resize: vertical;
    padding: 12px;
    border: 1px solid rgba(200, 166, 108, 0.26);
    border-radius: 6px;
    background: rgba(7, 10, 8, 0.82);
    color: var(--text);
    font-family: var(--font-notes);
}

.message-compose button {
    justify-self: start;
    min-width: 160px;
}

.message-empty {
    padding: 20px;
}

.county-radio {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 30;
    width: min(380px, calc(100vw - 28px));
    color: #eadfbe;
    font-family: var(--font-notes);
}

.county-radio-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 44px;
    border-color: rgba(190, 160, 92, 0.42);
    border-radius: 8px 8px 0 0;
    background: #141913;
    color: #eadfbe;
    box-shadow: 0 14px 40px rgba(0, 0, 0, 0.42);
}

.county-radio-toggle strong {
    display: grid;
    min-width: 24px;
    height: 24px;
    place-items: center;
    border-radius: 999px;
    background: #9f2f25;
    color: #fff3dc;
    font-family: var(--font-sans);
    font-size: 0.76rem;
}

.county-radio-toggle strong[hidden],
.county-radio-toggle strong:not(.is-visible) {
    display: none;
}

.county-radio-panel {
    position: static;
    display: grid;
    grid-template-rows: auto minmax(180px, 260px) auto;
    border: 1px solid rgba(190, 160, 92, 0.42);
    border-top: 0;
    border-radius: 0 0 8px 8px;
    background:
        linear-gradient(180deg, rgba(45, 59, 40, 0.95), rgba(14, 18, 13, 0.98)),
        #141913;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.48);
    overflow: hidden;
}

.county-radio.is-collapsed .county-radio-panel {
    display: none;
}

.county-radio.is-collapsed .county-radio-toggle {
    border-radius: 8px;
}

.county-radio-header,
.county-radio-form {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px;
    border-top: 1px solid rgba(232, 210, 152, 0.1);
}

.county-radio-header {
    border-top: 0;
    border-bottom: 1px solid rgba(232, 210, 152, 0.1);
}

.county-radio-header span {
    color: #f2e4bd;
    font-family: var(--font-display);
    text-transform: uppercase;
}

.county-radio-header small {
    min-width: 0;
    color: rgba(234, 223, 190, 0.62);
    overflow: hidden;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.county-radio-log {
    display: grid;
    align-content: start;
    gap: 8px;
    padding: 10px;
    overflow-y: auto;
}

.county-radio-log article {
    display: grid;
    gap: 2px;
    padding-bottom: 8px;
    border-bottom: 1px dashed rgba(232, 210, 152, 0.12);
}

.county-radio-log span {
    color: rgba(234, 223, 190, 0.62);
    font-size: 0.76rem;
}

.county-radio-log .chat-message-meta {
    display: flex;
    align-items: baseline;
    gap: 7px;
    flex-wrap: wrap;
}

.county-radio-log p {
    margin: 0;
    color: #f4ead1;
    overflow-wrap: anywhere;
}

.chat-report-button {
    justify-self: start;
    min-height: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #d1b784;
    cursor: pointer;
    font-size: 0.68rem;
    font-weight: 800;
    line-height: 1;
    padding: 0;
    text-transform: none;
}

.chat-report-button:hover,
.chat-report-button:focus-visible {
    color: #f8e8c1;
}

.chat-report-button:disabled {
    cursor: default;
    opacity: 0.72;
}

.chat-report-button.is-reported {
    color: #e5342f;
    opacity: 1;
}

.county-radio-form input {
    width: auto;
    min-width: 0;
    flex: 1 1 auto;
    border-color: rgba(232, 210, 152, 0.18);
    background: rgba(5, 7, 5, 0.48);
    color: #f4ead1;
}

.county-radio-form button {
    flex: 0 0 auto;
    min-height: 40px;
    padding: 8px 12px;
    border-radius: 4px;
}

body.profile-page {
    background:
        linear-gradient(180deg, rgba(6, 8, 7, 0.62), rgba(6, 8, 7, 0.94)),
        radial-gradient(circle at 18% 16%, rgba(167, 64, 48, 0.12), transparent 24%),
        radial-gradient(circle at 82% 14%, rgba(89, 127, 139, 0.14), transparent 28%),
        linear-gradient(135deg, #080907, #18140f 44%, #0b0f0a);
}

body.profile-page::before {
    background:
        linear-gradient(90deg, rgba(0, 0, 0, 0.52), transparent 28%, transparent 72%, rgba(0, 0, 0, 0.46)),
        repeating-linear-gradient(90deg, rgba(197, 142, 85, 0.035) 0, rgba(197, 142, 85, 0.035) 1px, transparent 1px, transparent 18px),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.018) 0, rgba(255, 255, 255, 0.018) 1px, transparent 1px, transparent 12px);
    opacity: 0.84;
}

.profile-page .page-shell {
    width: min(1240px, 100%);
}

.profile-dossier {
    display: grid;
    gap: 16px;
    margin: 10px auto 34px;
    color: #eadfc3;
}

.profile-tabs {
    display: grid;
    gap: 14px;
}

.profile-tab-list button {
    border-color: rgba(205, 169, 110, 0.26);
    background: rgba(8, 10, 8, 0.54);
    color: #d9bd82;
}

.profile-tab-list button.is-active,
.profile-tab-list button[aria-selected="true"],
.profile-tab-list button:hover {
    border-color: rgba(205, 169, 110, 0.52);
    background: rgba(205, 169, 110, 0.16);
    color: #f3ead1;
}

.profile-hero,
.profile-panel {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(205, 169, 110, 0.28);
    border-radius: 6px;
    background:
        linear-gradient(180deg, rgba(36, 33, 26, 0.96), rgba(18, 21, 17, 0.98)),
        #171b14;
    box-shadow: 0 22px 58px rgba(0, 0, 0, 0.46);
}

.profile-hero::before,
.profile-panel::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 14% 18%, rgba(222, 194, 139, 0.08), transparent 24%),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.025) 0, rgba(255, 255, 255, 0.025) 1px, transparent 1px, transparent 9px);
    mix-blend-mode: screen;
    opacity: 0.55;
}

.profile-hero {
    display: grid;
    gap: 18px;
    min-width: 0;
    padding: 18px;
}

.profile-report-button {
    position: absolute;
    z-index: 3;
    top: 14px;
    right: 16px;
    min-height: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: rgba(215, 178, 117, 0.72);
    cursor: pointer;
    font-size: 0.74rem;
    font-weight: 900;
    line-height: 1;
    padding: 0;
    text-transform: none;
}

.profile-report-button:hover,
.profile-report-button:focus-visible {
    color: #f8e8c1;
}

.profile-report-button.is-reported {
    color: #e5342f;
}

.profile-report-button:disabled {
    cursor: default;
}

.notices-page {
    display: grid;
    gap: 18px;
}

.form-success,
.form-error {
    border: 1px solid rgba(205, 169, 110, 0.32);
    border-radius: 6px;
    background: rgba(6, 8, 6, 0.72);
    color: #f4ead1;
    padding: 12px 14px;
}

.form-success {
    border-color: rgba(151, 184, 116, 0.58);
}

.form-error {
    border-color: rgba(209, 76, 64, 0.65);
}

.notices-panel {
    display: grid;
    gap: 16px;
}

.notice-list {
    display: grid;
    gap: 12px;
}

.notice-card {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    border: 1px solid rgba(205, 169, 110, 0.2);
    border-radius: 6px;
    background: rgba(6, 8, 6, 0.42);
    padding: 14px;
}

.notice-card--stacked {
    display: grid;
}

.notice-card span,
.notice-card small {
    display: block;
    color: rgba(234, 223, 190, 0.62);
    font-weight: 800;
}

.notice-card p {
    margin: 5px 0;
}

.notice-card > strong {
    color: #d7b275;
    text-transform: capitalize;
    white-space: nowrap;
}

.notice-appeal-form {
    display: grid;
    gap: 10px;
}

.notice-appeal-form textarea,
.notices-page textarea {
    width: 100%;
    border: 1px solid rgba(232, 210, 152, 0.24);
    border-radius: 6px;
    background: rgba(5, 7, 5, 0.58);
    color: #f4ead1;
    padding: 12px;
    resize: vertical;
}

.notices-page table {
    width: 100%;
    border-collapse: collapse;
}

.notices-page th,
.notices-page td {
    border-bottom: 1px solid rgba(205, 169, 110, 0.16);
    padding: 10px;
    text-align: left;
    vertical-align: top;
}

.notices-page th {
    color: rgba(234, 223, 190, 0.62);
    font-size: 0.78rem;
    text-transform: uppercase;
}

@media (max-width: 760px) {
    .notice-card {
        display: grid;
    }
}

.profile-avatar-frame {
    position: relative;
    z-index: 1;
    width: min(190px, 58vw);
    padding: 8px;
    border: 1px solid rgba(223, 195, 135, 0.3);
    background:
        linear-gradient(145deg, rgba(124, 76, 42, 0.45), rgba(31, 29, 23, 0.9)),
        #15140f;
    box-shadow: inset 0 0 18px rgba(0, 0, 0, 0.45);
}

.profile-avatar {
    display: block;
    aspect-ratio: 1;
    border: 1px solid rgba(15, 16, 12, 0.86);
    background-repeat: no-repeat;
    background-color: #10150f;
    background-position: center bottom;
    background-size: cover, contain;
    filter: contrast(0.98) sepia(0.1);
}

.profile-identity,
.profile-panel > * {
    position: relative;
    z-index: 1;
}

.profile-title-row {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 14px;
    min-width: 0;
    flex-wrap: wrap;
}

.profile-title-row h1 {
    margin: 0;
    color: #f3ead1;
    font-size: clamp(2.3rem, 7vw, 4.85rem);
    line-height: 0.86;
    text-transform: uppercase;
}

.profile-title-row span {
    padding: 7px 10px;
    border: 1px solid rgba(205, 169, 110, 0.34);
    background: rgba(4, 6, 5, 0.34);
    color: #d7b275;
    font-weight: 900;
    text-transform: uppercase;
}

.profile-identity p {
    max-width: 760px;
    color: rgba(234, 223, 195, 0.78);
}

.profile-status-grid,
.profile-stat-grid,
.profile-record-grid,
.profile-collection-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.profile-status-grid {
    margin-top: 16px;
}

.profile-status-grid div,
.profile-stat-grid div,
.profile-record-grid div,
.profile-collection-grid div {
    min-width: 0;
    padding: 10px;
    border: 1px solid rgba(205, 169, 110, 0.16);
    background: rgba(8, 10, 8, 0.42);
}

.profile-status-grid span,
.profile-record-grid span,
.profile-collection-grid span,
.profile-record-list dt,
.profile-stat-grid dt {
    display: block;
    color: rgba(234, 223, 195, 0.58);
    font-size: 0.78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.profile-status-grid strong,
.profile-record-grid strong,
.profile-collection-grid strong,
.profile-record-list dd,
.profile-stat-grid dd {
    margin: 0;
    color: #f2e6c6;
    font-size: 1.05rem;
    font-weight: 900;
}

.profile-xp-strip {
    display: grid;
    grid-template-columns: auto minmax(160px, 1fr);
    gap: 8px 14px;
    align-items: center;
    margin-top: 14px;
    padding: 12px;
    border: 1px solid rgba(205, 169, 110, 0.2);
    background: rgba(6, 8, 7, 0.5);
}

.profile-xp-summary {
    display: grid;
    gap: 2px;
    min-width: 118px;
}

.profile-xp-summary span {
    color: rgba(234, 223, 195, 0.58);
    font-size: 0.74rem;
    font-weight: 900;
    text-transform: uppercase;
}

.profile-xp-summary strong {
    color: #f2e6c6;
    font-family: var(--font-notes);
    font-size: 1rem;
}

.profile-xp-meter {
    min-width: 0;
}

.profile-xp-meter i {
    display: block;
    width: 100%;
    height: 9px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(236, 224, 194, 0.13);
}

.profile-xp-meter i::before {
    content: "";
    display: block;
    width: var(--value);
    height: 100%;
    background: linear-gradient(90deg, #6f8f5f, #d7b275);
}

.profile-xp-strip p {
    grid-column: 1 / -1;
    margin: 0;
    color: rgba(234, 223, 195, 0.7);
    font-family: var(--font-notes);
    overflow-wrap: anywhere;
}

.profile-grid {
    display: grid;
    gap: 16px;
}

.profile-panel {
    display: grid;
    gap: 12px;
    align-content: start;
    padding: 16px;
}

.profile-panel h2 {
    margin: 0;
    color: #f1dfb7;
    font-family: var(--font-display);
    font-size: 1.7rem;
    line-height: 1;
    text-transform: uppercase;
}

.profile-panel p {
    margin: 0;
    color: rgba(234, 223, 195, 0.72);
}

.profile-meter-list {
    display: grid;
    gap: 10px;
}

.profile-meter-list div {
    display: grid;
    grid-template-columns: 78px minmax(0, 1fr);
    gap: 8px;
    align-items: center;
}

.profile-meter-list span,
.profile-meter-list strong {
    color: #eadfc3;
}

.profile-meter-list meter {
    height: 11px;
    filter: sepia(0.28) saturate(0.9);
}

.profile-stat-grid {
    margin: 0;
}

.profile-feature-panel {
    min-height: 320px;
    background:
        linear-gradient(180deg, rgba(39, 34, 25, 0.96), rgba(16, 18, 15, 0.98)),
        radial-gradient(circle at 78% 22%, rgba(142, 70, 45, 0.18), transparent 36%);
}

.profile-trophy-mark {
    width: min(220px, 70%);
    aspect-ratio: 1.35;
    justify-self: center;
    border-bottom: 4px double rgba(205, 169, 110, 0.38);
    background:
        radial-gradient(ellipse at 50% 78%, rgba(224, 199, 142, 0.2) 0 16%, transparent 17%),
        radial-gradient(ellipse at 28% 38%, transparent 0 35%, rgba(224, 199, 142, 0.42) 36% 39%, transparent 40%),
        radial-gradient(ellipse at 72% 38%, transparent 0 35%, rgba(224, 199, 142, 0.42) 36% 39%, transparent 40%),
        linear-gradient(90deg, transparent 45%, rgba(224, 199, 142, 0.48) 46% 54%, transparent 55%);
    opacity: 0.9;
}

.profile-trophy-mark.is-empty {
    opacity: 0.35;
    filter: grayscale(1);
}

.profile-record-list {
    display: grid;
    gap: 8px;
    margin: 0;
}

.profile-record-list div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 7px;
    border-bottom: 1px dashed rgba(205, 169, 110, 0.18);
}

.profile-standing-grid {
    align-items: start;
}

.profile-standing-overview {
    background:
        linear-gradient(180deg, rgba(38, 31, 25, 0.96), rgba(16, 18, 15, 0.98)),
        radial-gradient(circle at 82% 16%, rgba(111, 143, 95, 0.14), transparent 34%);
}

.profile-standing-list {
    display: grid;
    gap: 10px;
}

.profile-standing-list article {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    min-width: 0;
    padding: 12px;
    border: 1px solid rgba(205, 169, 110, 0.17);
    background: rgba(8, 10, 8, 0.38);
}

.profile-standing-list div {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.profile-standing-list strong {
    color: #f2e6c6;
    font-size: 1rem;
    line-height: 1.1;
    overflow-wrap: break-word;
}

.profile-standing-list span {
    color: rgba(234, 223, 195, 0.58);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.profile-standing-list b {
    min-width: 48px;
    padding: 7px 9px;
    border: 1px solid rgba(205, 169, 110, 0.24);
    background: rgba(205, 169, 110, 0.12);
    color: #ecd5a2;
    font-family: var(--font-notes);
    text-align: center;
}

.profile-secondary-button {
    justify-self: start;
    border-color: rgba(205, 169, 110, 0.34);
    background: rgba(8, 10, 8, 0.54);
    color: #d9bd82;
}

.profile-camp-panel {
    background:
        linear-gradient(180deg, rgba(31, 38, 31, 0.96), rgba(15, 18, 14, 0.98)),
        radial-gradient(circle at 20% 80%, rgba(95, 162, 199, 0.1), transparent 32%);
}

.profile-shelter-panel {
    grid-column: 1 / -1;
}

.profile-shelter-layout {
    display: grid;
    gap: 18px;
    align-items: center;
}

.profile-shelter-visual img {
    width: min(100%, 420px);
    height: clamp(190px, 25vw, 300px);
}

.profile-note-copy {
    font-family: var(--font-notes);
    font-size: 0.94rem;
}

.profile-badge-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.profile-badge-list span {
    padding: 8px 10px;
    border: 1px solid rgba(205, 169, 110, 0.26);
    background: rgba(175, 93, 59, 0.13);
    color: #ecd5a2;
    font-weight: 900;
    text-transform: uppercase;
}

.profile-dossier > #profile-message:not(:empty) {
    margin-bottom: 12px;
    padding: 10px 12px;
    border: 1px solid rgba(205, 169, 110, 0.24);
    border-radius: 4px;
    background: rgba(7, 9, 7, 0.58);
}

.profile-trophy-list-panel,
.profile-merit-panel,
.profile-title-panel {
    grid-column: 1 / -1;
}

.profile-achievement-list {
    display: grid;
    gap: 8px;
}

.profile-achievement-list article {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 11px 12px;
    border: 1px solid rgba(205, 169, 110, 0.2);
    background: rgba(7, 9, 7, 0.42);
}

.profile-achievement-list article > div {
    min-width: 0;
}

.profile-achievement-list p {
    margin-top: 3px;
}

.profile-achievement-list small {
    display: block;
    margin-top: 5px;
    color: rgba(234, 223, 195, 0.58);
}

.merit-purchase-button,
.profile-display-button {
    flex: 0 0 auto;
    min-height: 36px;
    padding: 7px 11px;
}

@media (max-width: 620px) {
    .profile-achievement-list article {
        align-items: stretch;
        flex-direction: column;
    }
}

.profile-field-note blockquote {
    margin: 0;
    padding: 6px 0 0 14px;
    border-left: 3px solid rgba(205, 169, 110, 0.36);
    color: #eadfc3;
    font-family: var(--font-notes);
    font-size: 1rem;
}

.profile-field-note-list {
    display: grid;
    gap: 10px;
}

.profile-field-note-list article {
    display: grid;
    gap: 7px;
    padding: 12px;
    border: 1px solid rgba(205, 169, 110, 0.16);
    background: rgba(8, 10, 8, 0.38);
}

.profile-field-note-list h2 {
    font-size: 1.22rem;
}

.profile-field-note-list small {
    color: rgba(234, 223, 195, 0.52);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.profile-activity-panel {
    grid-column: 1 / -1;
}

.profile-activity-list {
    display: grid;
    gap: 10px;
    margin: 0;
    padding-left: 20px;
}

.profile-activity-list li {
    color: rgba(234, 223, 195, 0.86);
}

.profile-activity-list time {
    display: block;
    color: rgba(234, 223, 195, 0.48);
    font-size: 0.82rem;
}

@media (min-width: 760px) {
    .auth-panel {
        grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.55fr);
        padding: 70px 0;
    }

    .auth-page .auth-panel {
        min-height: calc(100vh - 58px);
        padding: 60px 24px;
    }

    .dashboard-grid {
        grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
    }

    .map-toolbar {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: end;
    }

    .profile-hero {
        grid-template-columns: 210px minmax(0, 1fr);
        align-items: center;
        padding: 22px;
    }

    .profile-grid {
        grid-template-columns: minmax(260px, 0.7fr) minmax(0, 1fr) minmax(280px, 0.74fr);
    }

    .profile-feature-panel,
    .profile-camp-panel,
    .profile-field-note,
    .profile-standing-panel {
        grid-column: span 2;
    }

    .profile-shelter-layout {
        grid-template-columns: minmax(240px, 0.72fr) minmax(0, 1fr);
    }

    .profile-status-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (min-width: 1060px) {
    .dashboard-grid {
        grid-template-columns: 1.15fr 0.85fr 0.8fr;
    }

    .profile-panel {
        padding: 20px;
    }

    .profile-feature-panel {
        grid-row: span 2;
    }
}

@media (min-width: 760px) and (max-width: 900px) {
    .profile-hero {
        grid-template-columns: 160px minmax(0, 1fr);
    }

    .profile-avatar-frame {
        width: min(160px, 44vw);
    }

    .profile-title-row h1 {
        font-size: clamp(2.05rem, 6vw, 3.4rem);
    }
}

@media (max-width: 1020px) {
    .topbar {
        grid-template-columns: minmax(180px, 1fr) minmax(0, auto);
    }

    .topbar-status {
        grid-column: 1 / -1;
        order: 3;
        padding-bottom: 8px;
        overflow-x: auto;
        justify-content: flex-start;
    }

    .main-nav {
        top: 94px;
    }

    .map-location-hero,
    .field-flow-strip {
        grid-template-columns: 1fr;
    }

    .field-flow-current {
        padding-right: 0;
        padding-bottom: 10px;
        border-right: 0;
        border-bottom: 1px solid rgba(200, 166, 108, 0.16);
    }

    .shelter-command-hero,
    .shelter-recovery-board {
        grid-template-columns: 1fr;
    }

    .shelter-command-hero h1 {
        font-size: 3.2rem;
    }

    .shelter-recovery-checklist {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .messages-layout {
        grid-template-columns: 1fr;
    }

    .settings-form,
    .trade-layout {
        grid-template-columns: 1fr;
    }

    .message-thread-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .message-thread-list > .eyebrow,
    .message-thread-list > .muted {
        grid-column: 1 / -1;
    }
}

@media (max-width: 760px) {
    .map-location-hero dl,
    .field-flow-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .map-location-hero h1 {
        font-size: 2.7rem;
    }

    .map-page .map-toolbar h2 {
        font-size: 2.35rem;
    }

    .map-page .map-toolbar {
        grid-template-columns: 1fr;
    }

    .map-page .region-panel {
        position: static;
        width: 100%;
        max-height: none;
        margin-top: 10px;
    }

    .shelter-command-hero h1 {
        font-size: 2.65rem;
    }

    .shelter-hero-status,
    .shelter-recovery-checklist {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    #skookum-map {
        min-height: 360px;
        height: min(62vh, 520px);
    }

    .map-zoom-controls {
        top: 16px;
        right: 16px;
        grid-template-columns: 42px;
        padding: 5px;
    }

    .map-zoom-controls button {
        min-width: 42px;
        height: 40px;
    }

    .map-zoom-controls .map-zoom-reset {
        height: 32px;
    }

    .map-compass {
        width: 50px;
        left: 16px;
        bottom: 16px;
    }
}

@media (max-width: 460px) {
    .map-location-hero dl,
    .field-flow-actions,
    .map-travel-links,
    .shelter-hero-status,
    .shelter-recovery-checklist,
    .profile-xp-strip {
        grid-template-columns: 1fr;
    }

    .map-location-hero h1 {
        font-size: 2.2rem;
    }

    .map-page .map-toolbar h2 {
        font-size: 2rem;
    }

    .shelter-command-hero h1 {
        font-size: 2.15rem;
    }

    .field-flow-actions a {
        min-height: 64px;
    }
}

@media (max-width: 760px) {
    body.home-command-page {
        padding-bottom: 78px;
    }

    .page-shell {
        padding: 12px;
    }

    button,
    summary,
    .panel-link,
    .survivor-actions a,
    .market-link-button,
    .mobile-detail-close,
    .camp-donate-button,
    .camp-upgrade-button,
    .camp-operation-button,
    .camp-action-button,
    .camp-recon-button,
    .camp-rank-button,
    .camp-approval-button,
    .camp-leave-button,
    .career-action-button,
    .work-start-button,
    .downtime-button,
    .perk-buy-button,
    .hunt-button,
    .hunt-scout-button,
    .inventory-locker .inventory-actions button,
    .storage-transfer-button,
    .market-buy-button {
        min-height: 44px;
    }

    .topbar {
        position: sticky;
        grid-template-columns: minmax(0, 1fr) auto;
        min-height: 56px;
        padding: 7px 10px;
    }

    .brand-logo {
        width: 34px;
        height: 34px;
    }

    .brand-name {
        font-size: 0.95rem;
    }

    .topbar-status {
        display: none;
    }

    .account-menu summary {
        max-width: 112px;
        padding: 7px 8px;
    }

    .alerts-link {
        padding: 7px 8px;
        font-size: 0.72rem;
    }

    .main-nav {
        display: none;
    }

    .mobile-bottom-nav {
        position: fixed;
        right: auto;
        bottom: 8px;
        left: 8px;
        z-index: 28;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 5px;
        width: calc(100% - 16px);
        max-width: calc(100vw - 16px);
        padding: 6px;
        border: 1px solid rgba(200, 166, 108, 0.28);
        border-radius: 10px;
        background:
            linear-gradient(180deg, rgba(23, 30, 21, 0.97), rgba(9, 12, 8, 0.98)),
            #10130f;
        box-shadow: 0 18px 46px rgba(0, 0, 0, 0.56);
    }

    .mobile-bottom-nav > a,
    .mobile-menu summary {
        display: grid;
        grid-template-rows: 18px auto;
        gap: 2px;
        min-width: 0;
        min-height: 38px;
        place-items: center;
        padding: 5px 4px;
        border: 1px solid transparent;
        border-radius: 7px;
        color: var(--text);
        text-align: center;
        text-decoration: none;
        font-size: 0.72rem;
        font-weight: 900;
        text-transform: uppercase;
    }

    .mobile-bottom-nav > a.is-active,
    .mobile-bottom-nav > a:hover,
    .mobile-menu[open] summary {
        border-color: rgba(200, 166, 108, 0.36);
        background: rgba(200, 166, 108, 0.12);
    }

    .mobile-menu {
        position: relative;
        min-width: 0;
    }

    .mobile-menu-panel {
        position: absolute;
        right: 0;
        bottom: calc(100% + 74px);
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 5px;
        width: min(330px, calc(100vw - 16px));
        max-height: none;
        overflow: visible;
        padding: 10px;
        border-radius: 10px;
    }

    .mobile-menu-panel strong {
        grid-column: 1 / -1;
        color: var(--tan);
        font-family: var(--font-display);
        font-weight: 400;
        text-transform: uppercase;
    }

    .mobile-menu-panel section {
        display: grid;
        gap: 5px;
        min-width: 0;
    }

    .mobile-menu-panel section > span {
        color: rgba(232, 210, 173, 0.62);
        font-size: 0.68rem;
        font-weight: 900;
        text-transform: uppercase;
    }

    .mobile-menu-panel a {
        display: grid;
        grid-template-columns: 18px minmax(0, 1fr);
        gap: 7px;
        align-items: center;
        padding: 9px;
        border-radius: 6px;
        background: rgba(255, 255, 255, 0.03);
        font-weight: 800;
        text-transform: uppercase;
    }

    .county-radio {
        bottom: 78px;
        width: calc(100% - 16px);
        max-width: calc(100vw - 16px);
    }

    .shelter-hero,
    .journal-hero {
        grid-template-columns: 1fr;
    }

    .shelter-stat-grid,
    .shelter-security-grid,
    .settings-grid,
    .faq-grid,
    .journal-benefits,
    .journal-hero dl {
        grid-template-columns: 1fr;
    }

    .message-thread-list {
        grid-template-columns: 1fr;
    }

    .message-conversation {
        min-height: auto;
    }

    .message-conversation-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .message-bubbles {
        max-height: 48vh;
        min-height: 220px;
    }

    .message-bubbles article {
        width: 100%;
    }

    .message-compose button,
    .camp-message-form button {
        width: 100%;
    }
}

.home-command .command-avatar.profile-portrait {
    width: 60px;
    max-width: 60px;
    height: 88px;
    margin: 0;
}

.survivor-card .survivor-avatar.profile-portrait {
    width: 84px;
    max-width: 84px;
    height: 84px;
    margin: 0;
}

@media (max-width: 1120px) {
    .home-command .command-avatar.profile-portrait {
        width: 54px;
        max-width: 54px;
        height: 76px;
    }
}

@media (max-width: 760px) {
    .survivor-card {
        grid-template-columns: 72px minmax(0, 1fr);
    }

    .survivor-card .survivor-avatar.profile-portrait {
        width: 72px;
        max-width: 72px;
        height: 72px;
    }

    .survivor-card .survivor-actions {
        grid-column: 2;
        justify-self: start;
        justify-content: flex-start;
    }
}

@media (max-width: 520px) {
    .home-command .command-avatar.profile-portrait {
        width: 48px;
        max-width: 48px;
        height: 62px;
    }
}

@media (max-width: 560px) {
    .county-radio {
        right: 8px;
        bottom: 78px;
        width: calc(100vw - 16px);
        max-width: calc(100vw - 16px);
    }

    .county-radio-panel {
        grid-template-rows: auto minmax(180px, 45vh) auto;
    }
}

.radio-dock {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 30;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    gap: 10px;
    width: min(380px, calc(100vw - 28px));
    overflow: visible;
}

.radio-dock.has-camp-radio {
    width: auto;
}

.radio-dock .county-radio {
    position: static;
    right: auto;
    bottom: auto;
    flex: 0 0 56px;
    width: 56px;
    max-width: none;
    min-width: 0;
    overflow: visible;
}

.radio-dock .county-radio.is-collapsed .county-radio-toggle,
.radio-dock .county-radio-toggle {
    width: 56px;
    padding-right: 0;
    padding-left: 0;
    border-radius: 8px;
}

.radio-dock .county-radio:not(.is-collapsed) .county-radio-toggle {
    border-color: rgba(232, 210, 152, 0.62);
    box-shadow: 0 0 0 1px rgba(232, 210, 152, 0.18), 0 14px 40px rgba(0, 0, 0, 0.42);
}

.radio-dock .county-radio-toggle {
    justify-content: center;
    gap: 10px;
    position: relative;
}

.radio-dock .county-radio-badge {
    display: none !important;
}

.radio-dock .county-radio-panel {
    position: absolute;
    right: 0;
    bottom: calc(100% + 10px);
    width: min(380px, calc(100vw - 28px));
    max-height: min(520px, calc(100vh - 180px));
    border-top: 1px solid rgba(190, 160, 92, 0.42);
    border-radius: 8px;
}

.radio-dock.has-camp-radio .county-radio-panel {
    width: min(430px, calc(100vw - 28px));
}

.chat-toggle-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.chat-icon {
    display: inline-flex;
    width: 24px;
    height: 24px;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.chat-icon svg {
    width: 24px;
    height: 24px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
    filter: drop-shadow(0 1px 0 rgba(0, 0, 0, 0.42));
}

.chat-icon--camp svg path:first-child {
    fill: rgba(240, 210, 160, 0.16);
}

.county-radio.has-unread .chat-icon {
    color: #d84d3f;
}

.county-radio.has-unread .county-radio-toggle {
    border-color: rgba(216, 77, 63, 0.62);
    box-shadow: 0 0 0 1px rgba(216, 77, 63, 0.16), 0 0 18px rgba(216, 77, 63, 0.16), 0 14px 40px rgba(0, 0, 0, 0.42);
}

.camp-radio-widget .county-radio-toggle {
    border-color: rgba(188, 125, 61, 0.54);
    background:
        linear-gradient(180deg, rgba(83, 52, 28, 0.98), rgba(44, 26, 15, 0.98)),
        #3d2818;
    color: #f0d2a0;
}

.camp-radio-widget .county-radio-panel {
    border-color: rgba(188, 125, 61, 0.54);
    background:
        linear-gradient(180deg, rgba(76, 48, 27, 0.96), rgba(28, 17, 11, 0.98)),
        #2d1d13;
}

.camp-radio-widget .county-radio-header span,
.camp-radio-widget .county-radio-log p {
    color: #f0d2a0;
}

.camp-radio-widget .county-radio-form input {
    border-color: rgba(224, 164, 93, 0.24);
    background: rgba(19, 11, 7, 0.58);
}

@media (max-width: 760px) {
    .radio-dock {
        right: 8px;
        bottom: 78px;
        width: auto;
        max-width: calc(100vw - 16px);
    }

    .radio-dock.has-camp-radio {
        width: auto;
    }

    .radio-dock .county-radio,
    .radio-dock .county-radio.is-collapsed .county-radio-toggle,
    .radio-dock .county-radio-toggle {
        flex-basis: 50px;
        width: 50px;
    }

    .radio-dock.has-camp-radio .county-radio.is-collapsed .county-radio-toggle,
    .radio-dock.has-camp-radio .county-radio-toggle {
        width: 50px;
    }

    .radio-dock .county-radio-panel {
        right: 0;
        width: calc(100vw - 16px);
        max-height: calc(100vh - 168px);
        grid-template-rows: auto minmax(180px, 45vh) auto;
    }
}

/* Persistent RPG shell */
body.home-command-page {
    background:
        linear-gradient(180deg, rgba(5, 7, 6, 0.46), rgba(5, 7, 6, 0.94)),
        #10130f;
}

.game-shell {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr) 260px;
    min-height: 100vh;
    isolation: isolate;
}

.game-sidebar,
.player-hud {
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(200, 166, 108, 0.42) rgba(0, 0, 0, 0.18);
}

.game-sidebar {
    z-index: 20;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 18px;
    padding: 16px 12px;
    border-right: 1px solid rgba(200, 166, 108, 0.22);
    background:
        linear-gradient(180deg, rgba(16, 20, 14, 0.98), rgba(6, 8, 5, 0.98)),
        #0b0e0a;
    box-shadow: 18px 0 44px rgba(0, 0, 0, 0.22);
}

.game-brand {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: center;
    padding: 0 4px 14px;
    border-bottom: 1px solid rgba(200, 166, 108, 0.16);
}

.game-brand .brand-name {
    font-size: 1rem;
}

.game-nav {
    position: static;
    display: grid;
    align-content: start;
    gap: 16px;
    padding: 0;
    border: 0;
    background: transparent;
}

.game-nav section {
    display: grid;
    gap: 5px;
}

.game-nav section > span,
.hud-section .eyebrow,
.mobile-menu-panel section > span {
    color: rgba(226, 199, 142, 0.58);
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.game-nav a,
.game-nav summary {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 9px;
    align-items: center;
    min-width: 0;
    min-height: 36px;
    padding: 8px 9px;
    border: 1px solid transparent;
    border-radius: 5px;
    color: rgba(238, 241, 223, 0.82);
    text-align: left;
    text-decoration: none;
    font-size: 0.84rem;
    font-weight: 900;
    text-transform: uppercase;
}

.game-nav a > span,
.game-nav summary > span {
    display: grid;
    place-items: center;
    color: rgba(200, 166, 108, 0.76);
    text-align: center;
}

.nav-icon {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.game-nav .nav-icon {
    width: 17px;
    height: 17px;
}

.mobile-bottom-nav .nav-icon {
    width: 18px;
    height: 18px;
}

.game-nav a.is-active,
.game-nav a:hover,
.game-nav .nav-menu.is-active > summary,
.game-nav .nav-menu[open] > summary {
    border-color: rgba(200, 166, 108, 0.38);
    background: rgba(200, 166, 108, 0.11);
    color: #f4e8c5;
}

.game-nav .nav-menu {
    display: grid;
    gap: 5px;
}

.game-nav .nav-menu-panel {
    position: static;
    display: grid;
    min-width: 0;
    padding: 4px 0 4px 30px;
    border: 0;
    border-left: 1px solid rgba(200, 166, 108, 0.18);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    transform: none;
}

.game-nav .nav-menu-panel a {
    min-height: 30px;
    padding: 6px 8px;
    font-size: 0.78rem;
}

.game-nav-system {
    align-self: end;
    padding-top: 12px;
    border-top: 1px solid rgba(200, 166, 108, 0.16);
}

.game-shell .page-shell {
    width: 100%;
    margin: 0;
    padding: 18px clamp(16px, 2vw, 26px);
}

.player-hud {
    z-index: 18;
    display: grid;
    align-content: start;
    gap: 16px;
    padding: 16px 14px;
    border-left: 1px solid rgba(200, 166, 108, 0.2);
    background:
        linear-gradient(180deg, rgba(13, 16, 12, 0.98), rgba(7, 9, 6, 0.98)),
        #0b0d09;
    box-shadow: -18px 0 44px rgba(0, 0, 0, 0.18);
}

.hud-section {
    display: grid;
    gap: 9px;
    padding-bottom: 15px;
    border-bottom: 1px solid rgba(200, 166, 108, 0.14);
}

.hud-section h2,
.hud-section h3 {
    margin: 0;
    color: #f2e6c8;
    font-family: var(--font-display);
    font-weight: 400;
    line-height: 1;
    text-transform: uppercase;
}

.hud-section h2 {
    font-size: 1.35rem;
}

.hud-section h3 {
    font-size: 1.15rem;
}

.hud-section span,
.hud-section small {
    color: rgba(236, 224, 194, 0.65);
}

.hud-survivor-head {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
}

.hud-avatar {
    width: 48px;
    height: 64px;
    margin: 0;
    border-radius: 4px;
    box-shadow: none;
}

.hud-meter {
    display: grid;
    gap: 4px;
}

.hud-xp-meter {
    display: grid;
    gap: 5px;
    padding: 9px 10px;
    border: 1px solid rgba(205, 169, 110, 0.14);
    background: rgba(8, 10, 8, 0.3);
}

.hud-xp-meter div {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    min-width: 0;
}

.hud-meter span,
.hud-cash span,
.hud-xp-meter span {
    color: #b99b65;
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.hud-meter strong,
.hud-cash strong,
.hud-timer strong,
.hud-xp-meter strong {
    color: #f2e6c8;
    font-family: var(--font-notes);
    font-size: 0.92rem;
}

.hud-meter i,
.hud-xp-meter i {
    display: block;
    width: 100%;
    height: 6px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(236, 224, 194, 0.12);
}

.hud-meter i::before,
.hud-xp-meter i::before {
    content: "";
    display: block;
    width: var(--value);
    height: 100%;
    background: linear-gradient(90deg, #7f9a70, #d4b56f);
}

.hud-xp-meter small {
    font-family: var(--font-notes);
    overflow-wrap: anywhere;
}

.hud-cash,
.hud-timer {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    min-width: 0;
}

.hud-cash span,
.hud-cash strong,
.hud-timer span,
.hud-timer strong {
    min-width: 0;
    overflow-wrap: anywhere;
}

.hud-timer strong {
    min-width: 3.8rem;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.hud-timer.is-ready strong {
    color: #d4b56f;
}

.hud-alert-link {
    color: #e7d7ac;
    font-weight: 900;
    text-decoration: none;
    text-transform: uppercase;
}

.hud-alert-link.has-alerts {
    color: #f2b38d;
}

.mobile-game-status {
    display: none;
}

@media (max-width: 1180px) {
    .game-shell {
        grid-template-columns: 190px minmax(0, 1fr) 230px;
    }

    .game-brand {
        grid-template-columns: 34px minmax(0, 1fr);
    }

    .game-brand .brand-logo {
        width: 34px;
        height: 34px;
    }

    .game-nav a,
    .game-nav summary {
        font-size: 0.78rem;
    }
}

@media (max-width: 900px) {
    body.home-page {
        padding-bottom: 78px;
    }

    .game-shell {
        display: block;
        min-height: 100vh;
    }

    .game-sidebar,
    .player-hud {
        display: none;
    }

    .mobile-game-status {
        position: sticky;
        top: 0;
        z-index: 30;
        display: grid;
        gap: 4px;
        padding: 8px 10px;
        border-bottom: 1px solid rgba(200, 166, 108, 0.22);
        background:
            linear-gradient(180deg, rgba(13, 16, 12, 0.98), rgba(7, 9, 6, 0.96)),
            #0b0d09;
        box-shadow: 0 10px 26px rgba(0, 0, 0, 0.32);
    }

    .mobile-game-status > div {
        display: flex;
        justify-content: space-between;
        gap: 8px;
        min-width: 0;
    }

    .mobile-game-status strong {
        color: #f2e6c8;
        font-family: var(--font-display);
        font-size: 1rem;
        font-weight: 400;
        line-height: 1;
        text-transform: uppercase;
    }

    .mobile-game-status span,
    .mobile-game-status small {
        color: rgba(236, 224, 194, 0.72);
        font-size: 0.78rem;
        font-weight: 900;
        text-transform: uppercase;
    }

    .mobile-vitals {
        align-items: center;
    }

    .mobile-xp-meter {
        align-items: center;
    }

    .mobile-xp-meter i {
        display: block;
        flex: 1 1 80px;
        height: 5px;
        min-width: 70px;
        overflow: hidden;
        border-radius: 999px;
        background: rgba(236, 224, 194, 0.13);
    }

    .mobile-xp-meter i::before {
        content: "";
        display: block;
        width: var(--value);
        height: 100%;
        background: linear-gradient(90deg, #7f9a70, #d4b56f);
    }

    .game-shell .page-shell {
        padding: 12px;
    }

    .mobile-menu-panel {
        position: fixed;
        right: 8px;
        bottom: 74px;
        left: 8px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: auto;
        max-height: min(72vh, 620px);
        overflow: auto;
    }
}

/* Home command center */
.command-table {
    position: relative;
    gap: 18px;
}

.command-table::before {
    content: "";
    position: absolute;
    inset: -18px;
    z-index: -1;
    border-radius: 10px;
    background:
        linear-gradient(180deg, rgba(47, 35, 22, 0.74), rgba(17, 13, 9, 0.86)),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.018) 0, rgba(255, 255, 255, 0.018) 1px, transparent 1px, transparent 18px);
    box-shadow: inset 0 0 0 1px rgba(200, 166, 108, 0.09), 0 24px 80px rgba(0, 0, 0, 0.26);
}

.home-location-hero,
.home-choice-strip,
.home-board,
.story-feature {
    min-width: 0;
}

.home-location-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 320px);
    gap: 18px;
    align-items: end;
    padding: 8px 0 18px;
    border-bottom: 1px solid rgba(226, 199, 142, 0.2);
}

.home-location-hero h1 {
    margin: 0;
    color: #f2e6c8;
    font-size: clamp(2.4rem, 5.8vw, 5.4rem);
    line-height: 0.9;
    text-transform: uppercase;
}

.home-location-hero p {
    margin: 8px 0 0;
    color: rgba(236, 224, 194, 0.76);
    font-size: 1rem;
    font-weight: 800;
    text-transform: uppercase;
}

.home-location-hero dl,
.story-feature dl {
    display: grid;
    gap: 7px;
    margin: 0;
}

.home-location-hero dl div,
.story-feature dl div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 7px;
    border-bottom: 1px dashed rgba(226, 199, 142, 0.2);
}

.home-location-hero dt,
.story-feature dt {
    color: #b99b65;
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.home-location-hero dd,
.story-feature dd {
    margin: 0;
    color: #f2e6c8;
    font-family: var(--font-notes);
    text-align: right;
}

.story-feature {
    display: grid;
    grid-template-columns: minmax(260px, 0.86fr) minmax(0, 1.14fr);
    min-height: 340px;
    overflow: hidden;
    border: 1px solid rgba(226, 199, 142, 0.24);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(41, 33, 22, 0.96), rgba(7, 9, 6, 0.98)),
        #10130f;
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.42);
}

.recommendation-feature {
    border-color: rgba(226, 199, 142, 0.34);
}

.story-feature-secondary {
    grid-template-columns: minmax(220px, 0.56fr) minmax(0, 1.44fr);
    min-height: 220px;
}

.story-feature figure {
    position: relative;
    min-height: 100%;
    margin: 0;
    background: #090b08;
}

.story-feature figure::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, transparent 55%, rgba(7, 9, 6, 0.9)),
        linear-gradient(180deg, rgba(0, 0, 0, 0.06), rgba(0, 0, 0, 0.36));
}

.story-feature img {
    width: 100%;
    height: 100%;
    min-height: 340px;
    object-fit: cover;
    filter: saturate(0.88) contrast(1.05);
}

.story-feature-secondary img {
    min-height: 220px;
}

.story-feature > div {
    display: grid;
    align-content: center;
    gap: 14px;
    padding: clamp(20px, 4vw, 42px);
}

.story-feature h2,
.home-choice-strip h2,
.home-board h2 {
    margin: 0;
    color: #f2e6c8;
    font-family: var(--font-display);
    font-weight: 400;
    line-height: 0.94;
    text-transform: uppercase;
}

.home-command,
.home-command-grid,
.home-board,
.story-feature,
.home-action-grid a,
.today-list li,
.field-task-row,
.story-line-item,
.command-action-list article {
    overflow-wrap: anywhere;
}

.story-feature h2 {
    font-size: clamp(2.3rem, 5vw, 4.6rem);
}

.story-feature-secondary h2 {
    font-size: clamp(1.8rem, 3vw, 2.7rem);
}

.story-feature p {
    max-width: 62ch;
    margin: 0;
    color: rgba(236, 224, 194, 0.8);
    font-size: 1.15rem;
}

.home-choice-strip {
    display: grid;
    grid-template-columns: minmax(210px, 0.34fr) minmax(0, 1fr);
    gap: 18px;
    align-items: center;
    padding: 18px 0;
    border-top: 1px solid rgba(226, 199, 142, 0.16);
    border-bottom: 1px solid rgba(226, 199, 142, 0.16);
}

.home-choice-strip h2,
.home-board h2 {
    font-size: clamp(1.7rem, 3vw, 2.4rem);
}

.home-action-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
}

.home-action-grid a {
    display: grid;
    gap: 4px;
    min-height: 76px;
    align-content: center;
    padding: 10px;
    border: 1px solid rgba(226, 199, 142, 0.24);
    border-radius: 6px;
    background: rgba(7, 10, 7, 0.58);
    color: #f2e6c8;
    text-decoration: none;
}

.home-action-grid a:hover {
    border-color: rgba(226, 199, 142, 0.5);
    background: rgba(157, 82, 46, 0.22);
}

.home-action-grid span {
    font-weight: 900;
    text-transform: uppercase;
}

.home-action-grid small {
    color: rgba(236, 224, 194, 0.58);
    font-size: 0.74rem;
}

.home-command-grid {
    display: grid;
    grid-template-columns: minmax(220px, 0.9fr) minmax(260px, 1.08fr) minmax(240px, 0.98fr);
    gap: 18px;
    align-items: start;
}

.home-board {
    display: grid;
    gap: 13px;
    align-content: start;
    padding: 0;
}

.home-board > div:first-child {
    display: grid;
    gap: 2px;
}

.board-kicker {
    color: rgba(236, 224, 194, 0.58);
    font-size: 0.78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.today-list {
    display: grid;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.today-list li,
.field-task-row,
.story-line-item,
.radio-board,
.active-board {
    border-top: 1px solid rgba(226, 199, 142, 0.14);
    padding-top: 10px;
}

.today-list li {
    display: grid;
    grid-template-columns: 16px minmax(0, 1fr) auto;
    gap: 10px;
    align-items: start;
}

.today-list li > span,
.field-task-row > span {
    width: 11px;
    height: 11px;
    margin-top: 5px;
    border: 1px solid rgba(226, 199, 142, 0.72);
    border-radius: 999px;
}

.today-list strong,
.field-task-row strong,
.story-line-item strong {
    display: block;
    color: #f2e6c8;
    line-height: 1.12;
}

.today-list small,
.field-task-row small,
.story-line-item small {
    display: block;
    color: rgba(236, 224, 194, 0.62);
    font-size: 0.82rem;
}

.today-list a,
.field-task-row a,
.story-line-item button,
.home-board .panel-link,
.story-feature .panel-link {
    align-self: start;
    color: #e7d7ac;
    font-weight: 900;
    text-decoration: none;
    text-transform: uppercase;
}

.story-line-item {
    display: grid;
    gap: 5px;
}

.story-line-item span {
    color: #b99b65;
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.story-line-item button {
    width: fit-content;
    min-height: 32px;
    padding: 6px 10px;
    border: 1px solid rgba(226, 199, 142, 0.24);
    border-radius: 4px;
    background: rgba(7, 10, 7, 0.62);
}

.story-line-item button:disabled,
.story-feature button:disabled {
    cursor: not-allowed;
    opacity: 0.56;
}

.story-requirement-list {
    display: grid;
    gap: 5px;
    margin: 0;
    padding-left: 18px;
    color: rgba(236, 224, 194, 0.72);
    font-size: 0.9rem;
    font-weight: 800;
}

.radio-board blockquote {
    margin: 0;
    padding: 2px 0 2px 14px;
    border-left: 2px solid rgba(226, 199, 142, 0.42);
    color: rgba(236, 224, 194, 0.82);
    font-family: var(--font-notes);
}

.field-task-row {
    display: grid;
    grid-template-columns: 16px minmax(0, 1fr) auto;
    gap: 10px;
    align-items: start;
}

.field-work-panel {
    grid-column: 1 / -1;
}

.field-work-panel .quiet-message {
    border: 0;
    padding: 0;
    background: transparent;
    color: rgba(236, 224, 194, 0.62);
}

.command-action-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    max-height: 430px;
    overflow: auto;
    padding-right: 4px;
}

.command-action-list article {
    display: grid;
    gap: 7px;
    align-content: start;
    min-width: 0;
    padding: 12px;
    border: 1px solid rgba(226, 199, 142, 0.18);
    border-radius: 6px;
    background: rgba(7, 10, 7, 0.58);
}

.command-action-list .action-button {
    justify-self: start;
    margin-top: 3px;
}

.recent-activity-panel {
    margin-top: 4px;
    padding-top: 16px;
    border-top: 1px solid rgba(226, 199, 142, 0.16);
}

@media (max-width: 1380px) {
    .home-action-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .home-command-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .field-work-panel {
        grid-column: 1 / -1;
    }

    .command-action-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .command-table::before {
        inset: -12px;
        border-radius: 0;
    }

    .home-location-hero,
    .story-feature,
    .home-choice-strip,
    .home-command-grid {
        grid-template-columns: 1fr;
    }

    .home-location-hero {
        gap: 12px;
        padding-top: 4px;
    }

    .home-location-hero h1 {
        font-size: clamp(2.2rem, 14vw, 3.6rem);
    }

    .story-feature {
        min-height: 0;
    }

    .story-feature figure,
    .story-feature img {
        min-height: 190px;
        max-height: 240px;
    }

    .story-feature figure::after {
        background: linear-gradient(180deg, transparent 42%, rgba(7, 9, 6, 0.88));
    }

    .story-feature > div {
        padding: 16px;
    }

    .story-feature h2 {
        font-size: clamp(2rem, 13vw, 3.1rem);
    }

    .home-action-grid,
    .command-action-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .today-list li,
    .field-task-row {
        grid-template-columns: 16px minmax(0, 1fr);
    }

    .today-list a,
    .field-task-row a {
        grid-column: 2;
        justify-self: start;
    }
}

@media (max-width: 430px) {
    .home-action-grid,
    .command-action-list {
        grid-template-columns: 1fr;
    }
}

.home-priority-feature {
    min-height: 300px;
}

.home-priority-feature.is-downtime {
    border-color: rgba(126, 163, 126, 0.34);
}

.home-density-stack {
    display: grid;
    gap: 18px;
    align-items: start;
}

.home-data-panel {
    display: grid;
    gap: 10px;
    min-width: 0;
    padding-top: 14px;
    border-top: 1px solid rgba(226, 199, 142, 0.18);
}

.home-panel-heading {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: end;
}

.home-panel-heading h2 {
    margin: 0;
    color: #f2e6c8;
    font-family: var(--font-display);
    font-size: clamp(1.5rem, 2.4vw, 2.2rem);
    font-weight: 400;
    line-height: 1;
    text-transform: uppercase;
}

.home-panel-heading > a,
.table-action {
    color: #e7d7ac;
    font-weight: 900;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap;
}

.home-panel-heading .quiet-message {
    max-width: 460px;
    border: 0;
    padding: 0;
    background: transparent;
    color: rgba(236, 224, 194, 0.62);
    text-align: right;
}

.home-table-wrap {
    overflow-x: auto;
    border: 1px solid rgba(226, 199, 142, 0.16);
    border-radius: 6px;
    background: rgba(7, 10, 7, 0.44);
}

.home-data-table {
    width: 100%;
    min-width: 640px;
    border-collapse: collapse;
}

.home-data-table th,
.home-data-table td {
    padding: 11px 12px;
    border-bottom: 1px solid rgba(226, 199, 142, 0.12);
    color: rgba(236, 224, 194, 0.78);
    font-size: 0.88rem;
    text-align: left;
    vertical-align: middle;
}

.home-data-table th {
    color: #b99b65;
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
    white-space: nowrap;
}

.home-data-table tr:last-child td {
    border-bottom: 0;
}

.home-data-table strong,
.home-data-table a {
    color: #f2e6c8;
}

.home-data-table strong,
.home-data-table small {
    display: block;
}

.home-data-table small {
    margin-top: 3px;
    color: rgba(236, 224, 194, 0.58);
    font-size: 0.78rem;
}

.home-actions-table th:first-child,
.home-actions-table td:first-child,
.home-objectives-table th:first-child,
.home-objectives-table td:first-child {
    width: 34%;
}

.home-progress {
    width: 100%;
    min-width: 96px;
    height: 8px;
    overflow: hidden;
    border: 1px solid rgba(226, 199, 142, 0.18);
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.28);
}

.home-progress span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #7f9a70, #d4b56f);
}

.home-status {
    display: inline-grid;
    min-width: 92px;
    min-height: 26px;
    place-items: center;
    padding: 4px 8px;
    border: 1px solid rgba(226, 199, 142, 0.18);
    border-radius: 999px;
    background: rgba(17, 13, 9, 0.66);
    color: #e7d7ac;
    font-size: 0.7rem;
    font-weight: 900;
    text-transform: uppercase;
    white-space: nowrap;
}

.home-status.is-ready,
.home-status.is-complete {
    border-color: rgba(126, 163, 126, 0.38);
    color: #b7d7a8;
}

.home-status.is-cooling-down,
.home-status.is-open {
    border-color: rgba(212, 181, 111, 0.36);
    color: #e4c97d;
}

.home-status.is-low-energy,
.home-status.is-low-nerve {
    border-color: rgba(188, 86, 70, 0.44);
    color: #e5a092;
}

.home-data-table .action-button.table-action {
    min-height: 32px;
    padding: 7px 11px;
    border-radius: 4px;
}

@media (max-width: 980px) {
    .home-panel-heading {
        align-items: start;
        flex-direction: column;
    }

    .home-panel-heading .quiet-message {
        text-align: left;
    }
}

@media (max-width: 760px) {
    .home-data-table {
        min-width: 0;
    }

    .home-data-table thead {
        display: none;
    }

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

    .home-data-table tr {
        padding: 8px 0;
        border-bottom: 1px solid rgba(226, 199, 142, 0.14);
    }

    .home-data-table tr:last-child {
        border-bottom: 0;
    }

    .home-data-table td {
        display: grid;
        grid-template-columns: 96px minmax(0, 1fr);
        gap: 10px;
        padding: 7px 10px;
        border-bottom: 0;
    }

    .home-data-table td::before {
        content: attr(data-label);
        color: #b99b65;
        font-size: 0.7rem;
        font-weight: 900;
        text-transform: uppercase;
    }

    .home-data-table td[colspan] {
        display: block;
    }

    .home-data-table td[colspan]::before {
        content: "";
    }

    .home-objectives-table tr,
    .home-actions-table tr,
    .world-board .home-data-table tr {
        display: grid;
        align-items: center;
        column-gap: 10px;
        row-gap: 7px;
        padding: 10px;
    }

    .home-objectives-table tr {
        grid-template-columns: minmax(0, 1fr) auto auto;
        grid-template-areas:
            "objective progress action"
            "bar bar bar";
    }

    .home-actions-table tr {
        grid-template-columns: minmax(8rem, 1fr) minmax(88px, auto) minmax(78px, auto);
        grid-template-areas:
            "task availability action"
            "cost reward action";
    }

    .world-board .home-data-table tr {
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-areas:
            "time location"
            "activity activity";
    }

    .home-objectives-table td,
    .home-actions-table td,
    .world-board .home-data-table td {
        display: block;
        width: auto;
        padding: 0;
    }

    .home-objectives-table td::before,
    .home-actions-table td::before,
    .world-board .home-data-table td::before {
        content: "";
    }

    .home-objectives-table td:nth-child(1) {
        grid-area: objective;
        min-width: 0;
    }

    .home-objectives-table td:nth-child(2) {
        grid-area: bar;
    }

    .home-objectives-table td:nth-child(3) {
        grid-area: progress;
    }

    .home-objectives-table td:nth-child(4) {
        grid-area: action;
        justify-self: end;
    }

    .home-actions-table td:nth-child(1) {
        grid-area: task;
        min-width: 0;
        overflow: hidden;
    }

    .home-actions-table td:nth-child(2) {
        grid-area: cost;
    }

    .home-actions-table td:nth-child(3) {
        grid-area: reward;
        min-width: 0;
    }

    .home-actions-table td:nth-child(4) {
        grid-area: availability;
        justify-self: end;
    }

    .home-actions-table td:nth-child(5) {
        grid-area: action;
        justify-self: end;
    }

    .world-board .home-data-table td:nth-child(1) {
        grid-area: time;
        color: #b99b65;
        font-size: 0.72rem;
        font-weight: 900;
        white-space: nowrap;
    }

    .world-board .home-data-table td:nth-child(2) {
        grid-area: location;
        min-width: 0;
        color: rgba(236, 224, 194, 0.58);
        font-size: 0.72rem;
        font-weight: 900;
        overflow: hidden;
        text-overflow: ellipsis;
        text-transform: uppercase;
        white-space: nowrap;
    }

    .world-board .home-data-table td:nth-child(3) {
        grid-area: activity;
        min-width: 0;
    }

    .home-objectives-table td:first-child small,
    .home-actions-table td:first-child small {
        display: none;
    }

    .home-objectives-table strong,
    .home-actions-table strong {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow-wrap: normal;
        word-break: normal;
        line-height: 1.08;
    }

    .home-actions-table td:nth-child(2),
    .home-actions-table td:nth-child(3) {
        color: rgba(236, 224, 194, 0.66);
        font-size: 0.78rem;
        font-weight: 800;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .home-actions-table td:nth-child(3) {
        text-align: right;
    }

    .home-objectives-table .home-progress {
        min-width: 0;
    }

    .home-objectives-table .home-status,
    .home-actions-table .home-status {
        min-width: 0;
        min-height: 24px;
        padding: 3px 8px;
        font-size: 0.66rem;
    }

    .home-actions-table .action-button.table-action {
        min-width: 74px;
        min-height: 34px;
        padding: 7px 9px;
        font-size: 0.72rem;
    }

    .home-objectives-table .table-action {
        display: inline-grid;
        min-height: 28px;
        place-items: center;
        padding: 4px 8px;
        border: 1px solid rgba(226, 199, 142, 0.18);
        border-radius: 4px;
        background: rgba(17, 13, 9, 0.66);
        font-size: 0.7rem;
    }
}

@media (max-width: 430px) {
    .home-objectives-table tr {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "objective progress"
            "bar action";
    }

    .home-objectives-table td:nth-child(4) {
        align-self: center;
    }

    .home-actions-table tr {
        grid-template-columns: minmax(6.5rem, 1fr) minmax(78px, auto) minmax(68px, auto);
        grid-template-areas:
            "task availability action"
            "cost reward action";
    }

    .home-actions-table .action-button.table-action {
        min-width: 68px;
        padding-right: 8px;
        padding-left: 8px;
    }
}

.job-table-panel,
.survivor-targets,
.survivor-combat-log {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.current-career-panel .home-table-wrap,
.job-table-panel .home-table-wrap,
.job-history-strip .home-table-wrap,
.survivor-targets .home-table-wrap,
.survivor-combat-log .home-table-wrap,
.trade-offer-table-panel .home-table-wrap,
.alerts-table-wrap {
    background: rgba(5, 8, 6, 0.38);
}

.job-careers-table th:first-child,
.job-careers-table td:first-child,
.job-actions-table th:first-child,
.job-actions-table td:first-child {
    width: 32%;
}

.job-history-table {
    min-width: 520px;
}

.survivor-board {
    gap: 16px;
}

.survivor-targets {
    padding: 0;
    border-right: 0;
}

.survivor-targets-table {
    min-width: 780px;
}

.survivor-table-name {
    display: inline-grid;
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    text-decoration: none;
}

.survivor-targets-table .survivor-avatar {
    width: 48px;
    height: 48px;
    margin: 0;
    border-radius: 5px;
}

.survivor-targets-table .survivor-actions {
    grid-template-columns: repeat(4, minmax(76px, 1fr));
    gap: 6px;
}

.survivor-targets-table .survivor-actions a,
.survivor-targets-table .pvp-scout-button,
.survivor-targets-table .pvp-attack-button {
    min-height: 34px;
    padding: 6px 9px;
    font-size: 0.72rem;
}

.survivor-combat-table {
    min-width: 680px;
}

.trade-layout {
    grid-template-columns: minmax(280px, 0.72fr) minmax(0, 1fr);
}

.trade-layout > .trade-panel:first-child {
    grid-row: span 2;
}

.trade-offer-table-panel {
    min-width: 0;
}

.trade-offers-table {
    min-width: 760px;
}

.table-button-row {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.table-button-row button,
.trade-offers-table .trade-response-button {
    min-width: 82px;
    min-height: 32px;
    padding: 6px 9px;
    font-size: 0.72rem;
}

.alerts-table {
    min-width: 760px;
}

.alerts-table tr.is-unread td {
    background: rgba(63, 28, 21, 0.28);
}

.map-position-table,
.hunt-target-table,
.hunt-scout-table,
.hunt-log-table,
.hunt-trophy-table,
.hunt-area-intel-table,
.hunt-readiness-table,
.downtime-actions-table,
.downtime-log-table,
.shelter-recovery-table,
.shelter-upgrade-table,
.shelter-security-table,
.journal-tasks-table,
.journal-notes-table,
.journal-rumors-table,
.journal-discoveries-table,
.journal-evidence-table,
.journal-activity-table,
.profile-standing-table,
.profile-record-table,
.profile-activity-table,
.perk-list-table {
    min-width: 720px;
}

.hunt-target-table,
.downtime-actions-table,
.shelter-security-table,
.journal-notes-table,
.journal-rumors-table,
.journal-evidence-table,
.perk-list-table {
    min-width: 880px;
}

.downtime-table-panel,
.shelter-recovery-checklist,
.shelter-security-grid {
    grid-template-columns: minmax(0, 1fr);
}

.downtime-table-panel .home-table-wrap,
.hunt-panel .home-table-wrap,
.shelter-recovery-checklist.home-table-wrap,
.shelter-security-grid.home-table-wrap,
.journal-list.home-table-wrap,
.profile-activity-list.home-table-wrap,
.profile-standing-list.home-table-wrap,
.perk-category .home-table-wrap,
.map-position-table-wrap {
    background: rgba(5, 8, 6, 0.38);
}

.hunt-target-table tr.is-selected td,
.downtime-actions-table tr.is-selected td,
.perk-list-table tr.is-owned td {
    background: rgba(74, 91, 54, 0.2);
}

.hunt-target-table th:first-child,
.hunt-target-table td:first-child,
.downtime-actions-table th:first-child,
.downtime-actions-table td:first-child,
.perk-list-table th:first-child,
.perk-list-table td:first-child {
    width: 28%;
}

.home-data-table .table-action {
    min-width: 74px;
    min-height: 32px;
    padding: 6px 9px;
    font-size: 0.72rem;
    line-height: 1.1;
    white-space: nowrap;
}

.home-data-table a.table-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(200, 166, 108, 0.3);
    border-radius: 4px;
    color: var(--text);
    font-weight: 900;
    text-decoration: none;
    text-transform: uppercase;
}

.home-data-table tr[data-row-toggle] {
    cursor: pointer;
}

.table-detail-drawer {
    display: none;
}

.table-detail-drawer.is-open {
    display: table-row;
}

.table-detail-drawer td {
    padding: 0;
    background: rgba(7, 10, 8, 0.72);
}

.table-detail-inner {
    display: grid;
    grid-template-columns: minmax(220px, 0.75fr) minmax(0, 1fr);
    gap: 14px;
    padding: 14px;
    border-top: 1px solid rgba(200, 166, 108, 0.18);
}

.table-detail-inner h3 {
    margin: 3px 0 6px;
    color: #f4e8c9;
    font-family: var(--font-display);
    font-size: 1.5rem;
    line-height: 0.95;
    text-transform: uppercase;
}

.table-detail-inner p,
.table-detail-inner small {
    margin: 0;
    color: rgba(236, 224, 194, 0.72);
}

.table-detail-inner dl {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    margin: 0;
}

.table-detail-inner dl div {
    display: grid;
    gap: 2px;
    padding: 8px;
    border: 1px solid rgba(200, 166, 108, 0.14);
    border-radius: 4px;
    background: rgba(5, 8, 6, 0.36);
}

.table-detail-inner dt,
.table-detail-inner dd {
    margin: 0;
    min-width: 0;
}

.table-detail-inner dt {
    color: #b99b65;
    font-size: 0.68rem;
    font-weight: 900;
    text-transform: uppercase;
}

.table-detail-inner dd {
    color: #efe2c2;
    font-family: var(--font-notes);
}

.table-detail-inner > small {
    grid-column: 1 / -1;
}

@media (max-width: 980px) {
    .trade-layout {
        grid-template-columns: 1fr;
    }

    .trade-layout > .trade-panel:first-child {
        grid-row: auto;
    }
}

@media (max-width: 760px) {
    .job-careers-table,
    .job-actions-table,
    .job-history-table,
    .survivor-targets-table,
    .survivor-combat-table,
    .trade-offers-table,
    .alerts-table,
    .map-position-table,
    .hunt-target-table,
    .hunt-scout-table,
    .hunt-log-table,
    .hunt-trophy-table,
    .hunt-area-intel-table,
    .hunt-readiness-table,
    .downtime-actions-table,
    .downtime-log-table,
    .shelter-recovery-table,
    .shelter-upgrade-table,
    .shelter-security-table,
    .journal-tasks-table,
    .journal-notes-table,
    .journal-rumors-table,
    .journal-discoveries-table,
    .journal-evidence-table,
    .journal-activity-table,
    .profile-standing-table,
    .profile-record-table,
    .profile-activity-table,
    .perk-list-table {
        min-width: 0;
    }

    .job-careers-table tr,
    .job-actions-table tr,
    .job-history-table tr,
    .survivor-targets-table tr,
    .survivor-combat-table tr,
    .trade-offers-table tr,
    .alerts-table tr,
    .map-position-table tr,
    .hunt-target-table tr,
    .hunt-scout-table tr,
    .hunt-log-table tr,
    .hunt-trophy-table tr,
    .hunt-area-intel-table tr,
    .hunt-readiness-table tr,
    .downtime-actions-table tr,
    .downtime-log-table tr,
    .shelter-recovery-table tr,
    .shelter-upgrade-table tr,
    .shelter-security-table tr,
    .journal-tasks-table tr,
    .journal-notes-table tr,
    .journal-rumors-table tr,
    .journal-discoveries-table tr,
    .journal-evidence-table tr,
    .journal-activity-table tr,
    .profile-standing-table tr,
    .profile-record-table tr,
    .profile-activity-table tr,
    .perk-list-table tr {
        display: grid;
        align-items: center;
        column-gap: 10px;
        row-gap: 7px;
        padding: 10px;
    }

    .job-careers-table td,
    .job-actions-table td,
    .job-history-table td,
    .survivor-targets-table td,
    .survivor-combat-table td,
    .trade-offers-table td,
    .alerts-table td,
    .map-position-table td,
    .hunt-target-table td,
    .hunt-scout-table td,
    .hunt-log-table td,
    .hunt-trophy-table td,
    .hunt-area-intel-table td,
    .hunt-readiness-table td,
    .downtime-actions-table td,
    .downtime-log-table td,
    .shelter-recovery-table td,
    .shelter-upgrade-table td,
    .shelter-security-table td,
    .journal-tasks-table td,
    .journal-notes-table td,
    .journal-rumors-table td,
    .journal-discoveries-table td,
    .journal-evidence-table td,
    .journal-activity-table td,
    .profile-standing-table td,
    .profile-record-table td,
    .profile-activity-table td,
    .perk-list-table td {
        display: block;
        width: auto;
        padding: 0;
    }

    .job-careers-table td::before,
    .job-actions-table td::before,
    .job-history-table td::before,
    .survivor-targets-table td::before,
    .survivor-combat-table td::before,
    .trade-offers-table td::before,
    .alerts-table td::before,
    .map-position-table td::before,
    .hunt-target-table td::before,
    .hunt-scout-table td::before,
    .hunt-log-table td::before,
    .hunt-trophy-table td::before,
    .hunt-area-intel-table td::before,
    .hunt-readiness-table td::before,
    .downtime-actions-table td::before,
    .downtime-log-table td::before,
    .shelter-recovery-table td::before,
    .shelter-upgrade-table td::before,
    .shelter-security-table td::before,
    .journal-tasks-table td::before,
    .journal-notes-table td::before,
    .journal-rumors-table td::before,
    .journal-discoveries-table td::before,
    .journal-evidence-table td::before,
    .journal-activity-table td::before,
    .profile-standing-table td::before,
    .profile-record-table td::before,
    .profile-activity-table td::before,
    .perk-list-table td::before {
        content: "";
    }

    .job-careers-table tr {
        grid-template-columns: minmax(0, 1fr) auto auto;
        grid-template-areas:
            "career level action"
            "employer starts pay";
    }

    .job-actions-table tr {
        grid-template-columns: minmax(0, 1fr) auto auto;
        grid-template-areas:
            "shift status action"
            "cost reward action";
    }

    .job-history-table tr {
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-areas:
            "when career"
            "shift shift";
    }

    .survivor-targets-table tr {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "survivor status"
            "level actions";
    }

    .survivor-combat-table tr {
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-areas:
            "time location"
            "survivors outcome";
    }

    .trade-offers-table tr {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "player action"
            "offer want"
            "note note";
    }

    .alerts-table tr {
        grid-template-columns: auto minmax(0, 1fr) auto;
        grid-template-areas:
            "time type status"
            "notice notice action";
    }

    .map-position-table tr {
        grid-template-columns: minmax(0, 1fr) auto auto;
        grid-template-areas:
            "location energy nerve"
            "region condition exposure";
    }

    .hunt-target-table tr {
        grid-template-columns: minmax(0, 1fr) auto auto;
        grid-template-areas:
            "animal difficulty action"
            "sign activity action";
    }

    .hunt-scout-table tr {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "read action"
            "purpose cost";
    }

    .hunt-log-table tr {
        grid-template-columns: auto minmax(0, 1fr) auto;
        grid-template-areas:
            "when animal spend"
            "result result location";
    }

    .hunt-trophy-table tr {
        grid-template-columns: auto minmax(0, 1fr) auto;
        grid-template-areas:
            "when animal score"
            "grade grade grade";
    }

    .hunt-area-intel-table tr {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "animal activity"
            "population population";
    }

    .hunt-readiness-table tr {
        grid-template-columns: minmax(0, 1fr) auto auto;
        grid-template-areas:
            "weapon condition fatigue"
            "tracking woodcraft marksman";
    }

    .downtime-actions-table tr {
        grid-template-columns: minmax(0, 1fr) auto auto;
        grid-template-areas:
            "activity availability action"
            "cost benefit action";
    }

    .downtime-log-table tr {
        grid-template-columns: auto minmax(0, 1fr) auto;
        grid-template-areas:
            "when activity cost"
            "result result result";
    }

    .shelter-recovery-table tr {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "need status"
            "now target";
    }

    .shelter-upgrade-table tr {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "upgrade action"
            "current status"
            "cost cost";
    }

    .shelter-security-table tr {
        grid-template-columns: minmax(0, 1fr) auto auto;
        grid-template-areas:
            "system level action"
            "benefit benefit status"
            "cost cost cost";
    }

    .journal-tasks-table tr {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "task action"
            "type lead";
    }

    .journal-notes-table tr,
    .journal-rumors-table tr {
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-areas:
            "when note"
            "source body";
    }

    .journal-discoveries-table tr {
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-areas:
            "when discovery"
            "type source";
    }

    .journal-evidence-table tr {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "evidence quality"
            "place place"
            "notes notes";
    }

    .journal-activity-table tr,
    .profile-activity-table tr {
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-areas:
            "when activity"
            "type activity";
    }

    .profile-standing-table tr {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "name score"
            "status status";
    }

    .profile-record-table tr {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .perk-list-table tr {
        grid-template-columns: minmax(0, 1fr) auto auto;
        grid-template-areas:
            "perk rank action"
            "requirement cost action"
            "effect effect effect";
    }

    .job-careers-table td:nth-child(1) { grid-area: career; min-width: 0; }
    .job-careers-table td:nth-child(2) { grid-area: employer; }
    .job-careers-table td:nth-child(3) { grid-area: starts; }
    .job-careers-table td:nth-child(4) { grid-area: pay; }
    .job-careers-table td:nth-child(5) { grid-area: level; }
    .job-careers-table td:nth-child(6) { grid-area: action; justify-self: end; }

    .job-actions-table td:nth-child(1) { grid-area: shift; min-width: 0; }
    .job-actions-table td:nth-child(2) { grid-area: cost; }
    .job-actions-table td:nth-child(3) { grid-area: reward; }
    .job-actions-table td:nth-child(4) { grid-area: status; justify-self: end; }
    .job-actions-table td:nth-child(5) { grid-area: action; justify-self: end; }

    .job-history-table td:nth-child(1) { grid-area: when; color: #b99b65; font-size: 0.72rem; font-weight: 900; white-space: nowrap; }
    .job-history-table td:nth-child(2) { grid-area: career; min-width: 0; }
    .job-history-table td:nth-child(3) { grid-area: shift; min-width: 0; }

    .survivor-targets-table td:nth-child(1) { grid-area: survivor; min-width: 0; }
    .survivor-targets-table td:nth-child(2) { grid-area: level; }
    .survivor-targets-table td:nth-child(3) { display: none; }
    .survivor-targets-table td:nth-child(4) { grid-area: status; justify-self: end; }
    .survivor-targets-table td:nth-child(5) { grid-area: actions; min-width: 0; }

    .survivor-combat-table td:nth-child(1) { grid-area: time; color: #b99b65; font-size: 0.72rem; font-weight: 900; white-space: nowrap; }
    .survivor-combat-table td:nth-child(2) { grid-area: survivors; min-width: 0; }
    .survivor-combat-table td:nth-child(3) { grid-area: location; min-width: 0; text-align: right; }
    .survivor-combat-table td:nth-child(4) { grid-area: outcome; }

    .trade-offers-table td:nth-child(1) { grid-area: player; min-width: 0; }
    .trade-offers-table td:nth-child(2) { grid-area: offer; min-width: 0; }
    .trade-offers-table td:nth-child(3) { grid-area: want; min-width: 0; text-align: right; }
    .trade-offers-table td:nth-child(4) { grid-area: note; min-width: 0; }
    .trade-offers-table td:nth-child(5) { grid-area: action; justify-self: end; }

    .alerts-table td:nth-child(1) { grid-area: time; color: #b99b65; font-size: 0.72rem; font-weight: 900; white-space: nowrap; }
    .alerts-table td:nth-child(2) { grid-area: type; min-width: 0; }
    .alerts-table td:nth-child(3) { grid-area: notice; min-width: 0; }
    .alerts-table td:nth-child(4) { grid-area: status; justify-self: end; }
    .alerts-table td:nth-child(5) { grid-area: action; justify-self: end; }

    .map-position-table td:nth-child(1) { grid-area: location; min-width: 0; }
    .map-position-table td:nth-child(2) { grid-area: region; min-width: 0; }
    .map-position-table td:nth-child(3) { grid-area: condition; }
    .map-position-table td:nth-child(4) { grid-area: energy; justify-self: end; }
    .map-position-table td:nth-child(5) { grid-area: nerve; justify-self: end; }
    .map-position-table td:nth-child(6) { grid-area: exposure; justify-self: end; }

    .hunt-target-table td:nth-child(1) { grid-area: animal; min-width: 0; }
    .hunt-target-table td:nth-child(2) { grid-area: sign; }
    .hunt-target-table td:nth-child(3) { grid-area: activity; }
    .hunt-target-table td:nth-child(4) { grid-area: difficulty; justify-self: end; }
    .hunt-target-table td:nth-child(5) { grid-area: action; justify-self: end; }

    .hunt-scout-table td:nth-child(1) { grid-area: read; min-width: 0; }
    .hunt-scout-table td:nth-child(2) { grid-area: purpose; min-width: 0; }
    .hunt-scout-table td:nth-child(3) { grid-area: cost; justify-self: end; }
    .hunt-scout-table td:nth-child(4) { grid-area: action; justify-self: end; }

    .hunt-log-table td:nth-child(1) { grid-area: when; color: #b99b65; font-size: 0.72rem; font-weight: 900; white-space: nowrap; }
    .hunt-log-table td:nth-child(2) { grid-area: animal; min-width: 0; }
    .hunt-log-table td:nth-child(3) { grid-area: result; min-width: 0; }
    .hunt-log-table td:nth-child(4) { grid-area: location; justify-self: end; min-width: 0; }
    .hunt-log-table td:nth-child(5) { grid-area: spend; justify-self: end; }

    .hunt-trophy-table td:nth-child(1) { grid-area: when; color: #b99b65; font-size: 0.72rem; font-weight: 900; white-space: nowrap; }
    .hunt-trophy-table td:nth-child(2) { grid-area: animal; min-width: 0; }
    .hunt-trophy-table td:nth-child(3) { grid-area: grade; }
    .hunt-trophy-table td:nth-child(4) { grid-area: score; justify-self: end; }

    .hunt-area-intel-table td:nth-child(1) { grid-area: animal; min-width: 0; }
    .hunt-area-intel-table td:nth-child(2) { grid-area: population; }
    .hunt-area-intel-table td:nth-child(3) { grid-area: activity; justify-self: end; }

    .hunt-readiness-table td:nth-child(1) { grid-area: weapon; min-width: 0; }
    .hunt-readiness-table td:nth-child(2) { grid-area: condition; justify-self: end; }
    .hunt-readiness-table td:nth-child(3) { grid-area: tracking; }
    .hunt-readiness-table td:nth-child(4) { grid-area: woodcraft; }
    .hunt-readiness-table td:nth-child(5) { grid-area: marksman; }
    .hunt-readiness-table td:nth-child(6) { grid-area: fatigue; justify-self: end; }

    .downtime-actions-table td:nth-child(1) { grid-area: activity; min-width: 0; }
    .downtime-actions-table td:nth-child(2) { grid-area: cost; }
    .downtime-actions-table td:nth-child(3) { grid-area: benefit; min-width: 0; }
    .downtime-actions-table td:nth-child(4) { grid-area: availability; justify-self: end; }
    .downtime-actions-table td:nth-child(5) { grid-area: action; justify-self: end; }

    .downtime-log-table td:nth-child(1) { grid-area: when; color: #b99b65; font-size: 0.72rem; font-weight: 900; white-space: nowrap; }
    .downtime-log-table td:nth-child(2) { grid-area: activity; min-width: 0; }
    .downtime-log-table td:nth-child(3) { grid-area: result; min-width: 0; }
    .downtime-log-table td:nth-child(4) { grid-area: cost; justify-self: end; }

    .shelter-recovery-table td:nth-child(1) { grid-area: need; min-width: 0; }
    .shelter-recovery-table td:nth-child(2) { grid-area: now; }
    .shelter-recovery-table td:nth-child(3) { grid-area: target; }
    .shelter-recovery-table td:nth-child(4) { grid-area: status; justify-self: end; }

    .shelter-upgrade-table td:nth-child(1) { grid-area: upgrade; min-width: 0; }
    .shelter-upgrade-table td:nth-child(2) { grid-area: current; }
    .shelter-upgrade-table td:nth-child(3) { grid-area: cost; min-width: 0; }
    .shelter-upgrade-table td:nth-child(4) { grid-area: status; justify-self: end; }
    .shelter-upgrade-table td:nth-child(5) { grid-area: action; justify-self: end; }

    .shelter-security-table td:nth-child(1) { grid-area: system; min-width: 0; }
    .shelter-security-table td:nth-child(2) { grid-area: level; }
    .shelter-security-table td:nth-child(3) { grid-area: benefit; min-width: 0; }
    .shelter-security-table td:nth-child(4) { grid-area: cost; min-width: 0; }
    .shelter-security-table td:nth-child(5) { grid-area: status; justify-self: end; }
    .shelter-security-table td:nth-child(6) { grid-area: action; justify-self: end; }

    .journal-tasks-table td:nth-child(1) { grid-area: task; min-width: 0; }
    .journal-tasks-table td:nth-child(2) { grid-area: type; }
    .journal-tasks-table td:nth-child(3) { grid-area: lead; min-width: 0; }
    .journal-tasks-table td:nth-child(4) { grid-area: action; justify-self: end; }

    .journal-notes-table td:nth-child(1),
    .journal-rumors-table td:nth-child(1),
    .journal-discoveries-table td:nth-child(1),
    .journal-activity-table td:nth-child(1),
    .profile-activity-table td:nth-child(1) { grid-area: when; color: #b99b65; font-size: 0.72rem; font-weight: 900; white-space: nowrap; }

    .journal-notes-table td:nth-child(2),
    .journal-rumors-table td:nth-child(2) { grid-area: note; min-width: 0; }
    .journal-notes-table td:nth-child(3),
    .journal-rumors-table td:nth-child(3),
    .journal-discoveries-table td:nth-child(4) { grid-area: source; }
    .journal-notes-table td:nth-child(4),
    .journal-rumors-table td:nth-child(4) { grid-area: body; min-width: 0; }

    .journal-discoveries-table td:nth-child(2) { grid-area: discovery; min-width: 0; }
    .journal-discoveries-table td:nth-child(3) { grid-area: type; }

    .journal-evidence-table td:nth-child(1) { grid-area: evidence; min-width: 0; }
    .journal-evidence-table td:nth-child(2) { grid-area: place; min-width: 0; }
    .journal-evidence-table td:nth-child(3) { grid-area: quality; justify-self: end; }
    .journal-evidence-table td:nth-child(4) { grid-area: notes; min-width: 0; }

    .journal-activity-table td:nth-child(2) { grid-area: type; }
    .journal-activity-table td:nth-child(3),
    .profile-activity-table td:nth-child(2) { grid-area: activity; min-width: 0; }

    .profile-standing-table td:nth-child(1) { grid-area: name; min-width: 0; }
    .profile-standing-table td:nth-child(2) { grid-area: status; }
    .profile-standing-table td:nth-child(3) { grid-area: score; justify-self: end; }

    .perk-list-table td:nth-child(1) { grid-area: perk; min-width: 0; }
    .perk-list-table td:nth-child(2) { grid-area: rank; }
    .perk-list-table td:nth-child(3) { grid-area: requirement; min-width: 0; }
    .perk-list-table td:nth-child(4) { grid-area: effect; min-width: 0; }
    .perk-list-table td:nth-child(5) { grid-area: cost; }
    .perk-list-table td:nth-child(6) { grid-area: action; justify-self: end; }

    .job-careers-table td:nth-child(n+2):nth-child(-n+5),
    .job-actions-table td:nth-child(2),
    .job-actions-table td:nth-child(3),
    .survivor-targets-table td:nth-child(2),
    .survivor-combat-table td:nth-child(3),
    .survivor-combat-table td:nth-child(4),
    .trade-offers-table td:nth-child(2),
    .trade-offers-table td:nth-child(3),
    .trade-offers-table td:nth-child(4),
    .alerts-table td:nth-child(2),
    .map-position-table td:nth-child(n+2),
    .hunt-target-table td:nth-child(n+2):nth-child(-n+4),
    .hunt-scout-table td:nth-child(2),
    .hunt-scout-table td:nth-child(3),
    .hunt-log-table td:nth-child(4),
    .hunt-area-intel-table td:nth-child(2),
    .hunt-area-intel-table td:nth-child(3),
    .hunt-readiness-table td:nth-child(n+2),
    .downtime-actions-table td:nth-child(2),
    .downtime-actions-table td:nth-child(3),
    .downtime-log-table td:nth-child(4),
    .shelter-recovery-table td:nth-child(2),
    .shelter-recovery-table td:nth-child(3),
    .shelter-upgrade-table td:nth-child(2),
    .shelter-upgrade-table td:nth-child(3),
    .shelter-security-table td:nth-child(2),
    .shelter-security-table td:nth-child(4),
    .journal-tasks-table td:nth-child(2),
    .journal-notes-table td:nth-child(3),
    .journal-rumors-table td:nth-child(3),
    .journal-discoveries-table td:nth-child(3),
    .journal-discoveries-table td:nth-child(4),
    .profile-standing-table td:nth-child(2),
    .perk-list-table td:nth-child(2),
    .perk-list-table td:nth-child(3),
    .perk-list-table td:nth-child(5) {
        color: rgba(236, 224, 194, 0.66);
        font-size: 0.78rem;
        font-weight: 800;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .job-careers-table strong,
    .job-actions-table strong,
    .survivor-targets-table strong,
    .trade-offers-table strong,
    .alerts-table strong,
    .map-position-table strong,
    .hunt-target-table strong,
    .hunt-scout-table strong,
    .downtime-actions-table strong,
    .shelter-recovery-table strong,
    .shelter-upgrade-table strong,
    .shelter-security-table strong,
    .journal-tasks-table strong,
    .journal-notes-table strong,
    .journal-rumors-table strong,
    .journal-discoveries-table strong,
    .journal-evidence-table strong,
    .profile-standing-table strong,
    .perk-list-table strong {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow-wrap: normal;
        word-break: normal;
    }

    .job-careers-table td:first-child small,
    .job-actions-table td:first-child small {
        display: none;
    }

    .survivor-table-name {
        grid-template-columns: 38px minmax(0, 1fr);
    }

    .survivor-targets-table .survivor-avatar {
        width: 38px;
        height: 38px;
    }

    .survivor-targets-table .survivor-actions {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-end;
    }

    .survivor-targets-table .survivor-actions a,
    .survivor-targets-table .pvp-scout-button,
    .survivor-targets-table .pvp-attack-button,
    .career-action-button.table-action,
    .trade-response-button,
    .alerts-table .table-action,
    .hunt-target-table .table-action,
    .hunt-scout-table .table-action,
    .downtime-actions-table .table-action,
    .shelter-upgrade-table .table-action,
    .shelter-security-table .table-action,
    .journal-tasks-table .table-action,
    .perk-list-table .table-action {
        min-width: 64px;
        min-height: 30px;
        padding: 5px 8px;
        font-size: 0.68rem;
    }

    .trade-offers-table .table-button-row {
        justify-content: flex-end;
    }
}

/* Responsive page sweep */
@media (max-width: 1500px) {
    .game-shell {
        grid-template-columns: 200px minmax(0, 1fr) 230px;
    }

    .game-shell .page-shell {
        padding-right: 16px;
        padding-left: 16px;
    }

    .home-location-hero h1,
    .story-feature h2,
    .market-sign h1,
    .job-board-header h1,
    .mission-board-header h1,
    .mission-hub-header h1,
    .hunt-board-header h1,
    .hunt-current-plan h2,
    .downtime-header h1,
    .map-location-hero h1,
    .map-page .map-toolbar h1,
    .shelter-hero h1,
    .shelter-command-hero h1,
    .journal-hero h1,
    .profile-title-row h1,
    .perk-header h1,
    .survivor-header h1,
    .camp-hero-panel h1,
    .camp-entry-card h1 {
        max-width: 100%;
        font-size: clamp(2rem, 5vw, 3.4rem);
        line-height: 0.96;
        letter-spacing: 0;
        overflow-wrap: break-word;
        text-wrap: balance;
        word-break: normal;
    }

    .hunt-board-header,
    .hunt-current-plan,
    .hunt-board-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .hunt-main {
        border-right: 0;
        border-bottom: 1px solid rgba(147, 121, 76, 0.22);
    }
}

@media (max-width: 1280px) {
    .hunt-board-header,
    .hunt-current-plan,
    .hunt-board-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .hunt-board-header {
        align-items: start;
    }

    .hunt-board-header h1 {
        width: 100%;
        font-size: clamp(2rem, 6.5vw, 3.25rem);
        line-height: 0.96;
    }

    .hunt-main {
        border-right: 0;
        border-bottom: 1px solid rgba(147, 121, 76, 0.22);
    }

    .hunt-conditions,
    .hunt-record-grid {
        grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    }

    .jobs-page .mission-card-grid {
        grid-template-columns: repeat(3, minmax(170px, 1fr));
    }

    .camp-hero-panel,
    .camp-section-grid,
    .downtime-header,
    .downtime-layout,
    .shelter-command-hero,
    .shelter-recovery-board,
    .survivor-header,
    .survivor-layout,
    .perk-header,
    .inventory-locker-header,
    .map-stage {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 1180px) {
    .home-location-hero h1,
    .story-feature h2,
    .market-sign h1,
    .job-board-header h1,
    .mission-board-header h1,
    .mission-hub-header h1,
    .hunt-board-header h1,
    .hunt-current-plan h2,
    .downtime-header h1,
    .map-location-hero h1,
    .map-page .map-toolbar h1,
    .shelter-hero h1,
    .shelter-command-hero h1,
    .journal-hero h1,
    .profile-title-row h1,
    .perk-header h1,
    .survivor-header h1,
    .camp-hero-panel h1,
    .camp-entry-card h1 {
        max-width: 100%;
        font-size: clamp(2rem, 6.5vw, 3.2rem);
        line-height: 0.96;
        letter-spacing: 0;
        overflow-wrap: break-word;
        text-wrap: balance;
        word-break: normal;
    }

    .market-sign h1 {
        overflow-wrap: anywhere;
    }

    .mission-hub-header,
    .home-location-hero,
    .story-feature,
    .job-board-header,
    .mission-board-header {
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
    }

    .job-board-header {
        transform: none;
    }

    .mission-hub-header dl,
    .market-status-strip,
    .shelter-recovery-checklist,
    .camp-defense-breakdown,
    .camp-action-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 980px) {
    .market-panel[data-market-panel="browse"],
    .market-panel:not([data-market-panel="browse"]).is-active,
    .market-form,
    .market-item-drawer,
    .inventory-locker-layout,
    .camp-layout,
    .camp-entry-layout,
    .trade-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .market-ledger,
    .market-listings {
        grid-column: auto;
        grid-row: auto;
    }

    .market-item-stat-groups {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .market-ledger,
    .camp-sidebar {
        position: static;
        top: auto;
    }

    .camp-sidebar {
        grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    }

    .camp-compound-map {
        min-height: min(420px, 70vw);
        border-width: 7px;
    }

    .career-card-grid,
    .jobs-page .mission-card-grid {
        grid-template-columns: repeat(2, minmax(160px, 1fr));
    }
}

@media (max-width: 620px) {
    .market-item-meta,
    .market-item-stat-groups {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 720px) {
    .home-location-hero h1,
    .story-feature h2,
    .market-sign h1,
    .job-board-header h1,
    .mission-board-header h1,
    .mission-hub-header h1,
    .hunt-board-header h1,
    .hunt-current-plan h2,
    .downtime-header h1,
    .map-location-hero h1,
    .map-page .map-toolbar h1,
    .shelter-hero h1,
    .shelter-command-hero h1,
    .journal-hero h1,
    .profile-title-row h1,
    .perk-header h1,
    .survivor-header h1,
    .camp-hero-panel h1,
    .camp-entry-card h1 {
        font-size: clamp(1.85rem, 10vw, 2.65rem);
        line-height: 1;
    }

    .market-row-main {
        grid-template-columns: 92px minmax(0, 1fr) 52px 60px;
    }

    .market-item-media {
        width: 92px;
        min-height: 72px;
    }

    .market-item-summary {
        padding: 9px 10px;
    }

    .market-status-strip,
    .mission-hub-header dl,
    .hunt-conditions,
    .hunt-record-grid,
    .camp-status-grid,
    .camp-defense-gauges,
    .camp-defense-breakdown,
    .camp-action-grid,
    .shelter-stat-grid,
    .shelter-security-grid,
    .settings-grid,
    .journal-hero dl,
    .profile-status-grid,
    .profile-stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 520px) {
    .page-shell {
        padding-right: 10px;
        padding-left: 10px;
    }

    .home-location-hero h1,
    .story-feature h2,
    .market-sign h1,
    .job-board-header h1,
    .mission-board-header h1,
    .mission-hub-header h1,
    .hunt-board-header h1,
    .hunt-current-plan h2,
    .downtime-header h1,
    .map-location-hero h1,
    .map-page .map-toolbar h1,
    .shelter-hero h1,
    .shelter-command-hero h1,
    .journal-hero h1,
    .profile-title-row h1,
    .perk-header h1,
    .survivor-header h1,
    .camp-hero-panel h1,
    .camp-entry-card h1 {
        font-size: clamp(1.7rem, 12vw, 2.25rem);
    }

    .market-row-main {
        grid-template-columns: 76px minmax(0, 1fr) 48px;
    }

    .market-item-media {
        width: 76px;
        min-height: 68px;
    }

    .market-row .market-buy-button {
        grid-column: 1 / -1;
        min-height: 38px;
        border-width: 1px 0 0;
    }

    .market-item-drawer.is-open {
        max-height: 520px;
    }

    .market-status-strip,
    .mission-hub-header dl,
    .hunt-conditions,
    .hunt-record-grid,
    .camp-status-grid,
    .camp-defense-gauges,
    .camp-defense-breakdown,
    .camp-action-grid,
    .shelter-hero-status,
    .shelter-recovery-checklist,
    .shelter-stat-grid,
    .shelter-security-grid,
    .settings-grid,
    .journal-hero dl,
    .profile-status-grid,
    .profile-stat-grid,
    .career-card-grid,
    .jobs-page .mission-card-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .camp-compound-map {
        min-height: 300px;
        border-width: 5px;
    }

    .camp-facility {
        width: clamp(76px, 22vw, 108px);
        min-height: 34px;
        padding: 6px;
        font-size: 0.72rem;
    }
}

@media (max-width: 720px) {
    .camp-sidebar {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        overflow: visible;
    }

    .camp-sidebar .eyebrow {
        grid-column: 1 / -1;
    }

    .camp-sidebar button {
        min-width: 0;
        min-height: 48px;
        padding: 8px 6px;
        font-size: clamp(0.72rem, 3.4vw, 0.9rem);
        line-height: 1.05;
        white-space: normal;
        word-break: normal;
        overflow-wrap: normal;
    }

    .camp-compound-map {
        display: block;
        position: relative;
        aspect-ratio: 3 / 2;
        min-height: min(340px, 62vw);
        padding: 0;
    }

    .camp-map-underlay,
    .camp-hotspot-layer {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
    }

    .camp-hotspot-layer {
        display: block;
        pointer-events: none;
    }

    .camp-map-hotspot {
        pointer-events: auto;
    }
}

.home-data-table tr.table-detail-drawer {
    display: none;
}

.home-data-table tr.table-detail-drawer.is-open {
    display: table-row;
}

@media (max-width: 920px) {
    .hunt-intel-panel-wide {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 760px) {
    .home-data-table tr.table-detail-drawer.is-open {
        display: block;
    }

    .home-data-table tr.table-detail-drawer td {
        display: block;
        width: 100%;
    }

    .table-detail-inner {
        grid-template-columns: minmax(0, 1fr);
    }

    .table-detail-inner dl {
        grid-template-columns: minmax(0, 1fr);
    }
}

.downtime-table-panel,
.shelter-recovery-checklist,
.shelter-security-grid {
    grid-template-columns: minmax(0, 1fr);
}

@media (max-width: 760px) {
    .shelter-recovery-checklist,
    .shelter-security-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .map-position-table tr,
    .hunt-target-table tr,
    .hunt-scout-table tr,
    .hunt-log-table tr,
    .hunt-trophy-table tr,
    .downtime-actions-table tr,
    .downtime-log-table tr,
    .shelter-recovery-table tr,
    .shelter-upgrade-table tr,
    .shelter-security-table tr,
    .journal-tasks-table tr,
    .journal-notes-table tr,
    .journal-rumors-table tr,
    .journal-discoveries-table tr,
    .journal-evidence-table tr,
    .journal-activity-table tr,
    .profile-standing-table tr,
    .profile-record-table tr,
    .profile-activity-table tr,
    .perk-list-table tr {
        display: grid;
        align-items: center;
        column-gap: 10px;
        row-gap: 7px;
        padding: 10px;
    }

    .map-position-table td,
    .hunt-target-table td,
    .hunt-scout-table td,
    .hunt-log-table td,
    .hunt-trophy-table td,
    .downtime-actions-table td,
    .downtime-log-table td,
    .shelter-recovery-table td,
    .shelter-upgrade-table td,
    .shelter-security-table td,
    .journal-tasks-table td,
    .journal-notes-table td,
    .journal-rumors-table td,
    .journal-discoveries-table td,
    .journal-evidence-table td,
    .journal-activity-table td,
    .profile-standing-table td,
    .profile-record-table td,
    .profile-activity-table td,
    .perk-list-table td {
        display: block;
        width: auto;
        min-width: 0;
        padding: 0;
    }

    .map-position-table td::before,
    .hunt-target-table td::before,
    .hunt-scout-table td::before,
    .hunt-log-table td::before,
    .hunt-trophy-table td::before,
    .downtime-actions-table td::before,
    .downtime-log-table td::before,
    .shelter-recovery-table td::before,
    .shelter-upgrade-table td::before,
    .shelter-security-table td::before,
    .journal-tasks-table td::before,
    .journal-notes-table td::before,
    .journal-rumors-table td::before,
    .journal-discoveries-table td::before,
    .journal-evidence-table td::before,
    .journal-activity-table td::before,
    .profile-standing-table td::before,
    .profile-record-table td::before,
    .profile-activity-table td::before,
    .perk-list-table td::before {
        content: "";
    }

    .map-position-table tr {
        grid-template-columns: minmax(0, 1fr) auto auto;
        grid-template-areas:
            "location energy nerve"
            "region condition exposure";
    }

    .hunt-target-table tr {
        grid-template-columns: minmax(0, 1fr) auto auto;
        grid-template-areas:
            "animal difficulty action"
            "sign activity action";
    }

    .hunt-scout-table tr {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "read action"
            "purpose cost";
    }

    .hunt-log-table tr {
        grid-template-columns: auto minmax(0, 1fr) auto;
        grid-template-areas:
            "when animal spend"
            "result result location";
    }

    .hunt-trophy-table tr {
        grid-template-columns: auto minmax(0, 1fr) auto;
        grid-template-areas:
            "when animal score"
            "grade grade grade";
    }

    .downtime-actions-table tr {
        grid-template-columns: minmax(0, 1fr) auto auto;
        grid-template-areas:
            "activity availability action"
            "cost benefit action";
    }

    .downtime-log-table tr {
        grid-template-columns: auto minmax(0, 1fr) auto;
        grid-template-areas:
            "when activity cost"
            "result result result";
    }

    .shelter-recovery-table tr {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "need status"
            "now target";
    }

    .shelter-upgrade-table tr {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "upgrade action"
            "current status"
            "cost cost";
    }

    .shelter-security-table tr {
        grid-template-columns: minmax(0, 1fr) auto auto;
        grid-template-areas:
            "system level action"
            "benefit benefit status"
            "cost cost cost";
    }

    .journal-tasks-table tr {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "task action"
            "type lead";
    }

    .journal-notes-table tr,
    .journal-rumors-table tr {
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-areas:
            "when note"
            "source body";
    }

    .journal-discoveries-table tr {
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-areas:
            "when discovery"
            "type source";
    }

    .journal-evidence-table tr {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "evidence quality"
            "place place"
            "notes notes";
    }

    .journal-activity-table tr,
    .profile-activity-table tr {
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-areas:
            "when activity"
            "type activity";
    }

    .profile-standing-table tr {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "name score"
            "status status";
    }

    .profile-record-table tr {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .perk-list-table tr {
        grid-template-columns: minmax(0, 1fr) auto auto;
        grid-template-areas:
            "perk rank action"
            "requirement cost action"
            "effect effect effect";
    }

    .map-position-table td:nth-child(1) { grid-area: location; }
    .map-position-table td:nth-child(2) { grid-area: region; }
    .map-position-table td:nth-child(3) { grid-area: condition; }
    .map-position-table td:nth-child(4) { grid-area: energy; justify-self: end; }
    .map-position-table td:nth-child(5) { grid-area: nerve; justify-self: end; }
    .map-position-table td:nth-child(6) { grid-area: exposure; justify-self: end; }

    .hunt-target-table td:nth-child(1) { grid-area: animal; }
    .hunt-target-table td:nth-child(2) { grid-area: sign; }
    .hunt-target-table td:nth-child(3) { grid-area: activity; }
    .hunt-target-table td:nth-child(4) { grid-area: difficulty; justify-self: end; }
    .hunt-target-table td:nth-child(5) { grid-area: action; justify-self: end; }

    .hunt-scout-table td:nth-child(1) { grid-area: read; }
    .hunt-scout-table td:nth-child(2) { grid-area: purpose; }
    .hunt-scout-table td:nth-child(3) { grid-area: cost; justify-self: end; }
    .hunt-scout-table td:nth-child(4) { grid-area: action; justify-self: end; }

    .hunt-log-table td:nth-child(1),
    .hunt-trophy-table td:nth-child(1),
    .downtime-log-table td:nth-child(1),
    .journal-notes-table td:nth-child(1),
    .journal-rumors-table td:nth-child(1),
    .journal-discoveries-table td:nth-child(1),
    .journal-activity-table td:nth-child(1),
    .profile-activity-table td:nth-child(1) {
        color: #b99b65;
        font-size: 0.72rem;
        font-weight: 900;
        white-space: nowrap;
    }

    .hunt-log-table td:nth-child(1) { grid-area: when; }
    .hunt-log-table td:nth-child(2) { grid-area: animal; }
    .hunt-log-table td:nth-child(3) { grid-area: result; }
    .hunt-log-table td:nth-child(4) { grid-area: location; justify-self: end; }
    .hunt-log-table td:nth-child(5) { grid-area: spend; justify-self: end; }

    .hunt-trophy-table td:nth-child(1) { grid-area: when; }
    .hunt-trophy-table td:nth-child(2) { grid-area: animal; }
    .hunt-trophy-table td:nth-child(3) { grid-area: grade; }
    .hunt-trophy-table td:nth-child(4) { grid-area: score; justify-self: end; }

    .downtime-actions-table td:nth-child(1) { grid-area: activity; }
    .downtime-actions-table td:nth-child(2) { grid-area: cost; }
    .downtime-actions-table td:nth-child(3) { grid-area: benefit; }
    .downtime-actions-table td:nth-child(4) { grid-area: availability; justify-self: end; }
    .downtime-actions-table td:nth-child(5) { grid-area: action; justify-self: end; }

    .downtime-log-table td:nth-child(1) { grid-area: when; }
    .downtime-log-table td:nth-child(2) { grid-area: activity; }
    .downtime-log-table td:nth-child(3) { grid-area: result; }
    .downtime-log-table td:nth-child(4) { grid-area: cost; justify-self: end; }

    .shelter-recovery-table td:nth-child(1) { grid-area: need; }
    .shelter-recovery-table td:nth-child(2) { grid-area: now; }
    .shelter-recovery-table td:nth-child(3) { grid-area: target; }
    .shelter-recovery-table td:nth-child(4) { grid-area: status; justify-self: end; }

    .shelter-upgrade-table td:nth-child(1) { grid-area: upgrade; }
    .shelter-upgrade-table td:nth-child(2) { grid-area: current; }
    .shelter-upgrade-table td:nth-child(3) { grid-area: cost; }
    .shelter-upgrade-table td:nth-child(4) { grid-area: status; justify-self: end; }
    .shelter-upgrade-table td:nth-child(5) { grid-area: action; justify-self: end; }

    .shelter-security-table td:nth-child(1) { grid-area: system; }
    .shelter-security-table td:nth-child(2) { grid-area: level; }
    .shelter-security-table td:nth-child(3) { grid-area: benefit; }
    .shelter-security-table td:nth-child(4) { grid-area: cost; }
    .shelter-security-table td:nth-child(5) { grid-area: status; justify-self: end; }
    .shelter-security-table td:nth-child(6) { grid-area: action; justify-self: end; }

    .journal-tasks-table td:nth-child(1) { grid-area: task; }
    .journal-tasks-table td:nth-child(2) { grid-area: type; }
    .journal-tasks-table td:nth-child(3) { grid-area: lead; }
    .journal-tasks-table td:nth-child(4) { grid-area: action; justify-self: end; }

    .journal-notes-table td:nth-child(1),
    .journal-rumors-table td:nth-child(1),
    .journal-discoveries-table td:nth-child(1),
    .journal-activity-table td:nth-child(1),
    .profile-activity-table td:nth-child(1) { grid-area: when; }

    .journal-notes-table td:nth-child(2),
    .journal-rumors-table td:nth-child(2) { grid-area: note; }
    .journal-notes-table td:nth-child(3),
    .journal-rumors-table td:nth-child(3),
    .journal-discoveries-table td:nth-child(4) { grid-area: source; }
    .journal-notes-table td:nth-child(4),
    .journal-rumors-table td:nth-child(4) { grid-area: body; }

    .journal-discoveries-table td:nth-child(2) { grid-area: discovery; }
    .journal-discoveries-table td:nth-child(3) { grid-area: type; }

    .journal-evidence-table td:nth-child(1) { grid-area: evidence; }
    .journal-evidence-table td:nth-child(2) { grid-area: place; }
    .journal-evidence-table td:nth-child(3) { grid-area: quality; justify-self: end; }
    .journal-evidence-table td:nth-child(4) { grid-area: notes; }

    .journal-activity-table td:nth-child(2) { grid-area: type; }
    .journal-activity-table td:nth-child(3),
    .profile-activity-table td:nth-child(2) { grid-area: activity; }

    .profile-standing-table td:nth-child(1) { grid-area: name; }
    .profile-standing-table td:nth-child(2) { grid-area: status; }
    .profile-standing-table td:nth-child(3) { grid-area: score; justify-self: end; }

    .perk-list-table td:nth-child(1) { grid-area: perk; }
    .perk-list-table td:nth-child(2) { grid-area: rank; }
    .perk-list-table td:nth-child(3) { grid-area: requirement; }
    .perk-list-table td:nth-child(4) { grid-area: effect; }
    .perk-list-table td:nth-child(5) { grid-area: cost; }
    .perk-list-table td:nth-child(6) { grid-area: action; justify-self: end; }
}

/* Final visibility guard for expandable Hunt and Downtime detail rows. */
.home-data-table tr.table-detail-drawer {
    display: none;
}

.home-data-table tr.table-detail-drawer.is-open {
    display: table-row;
}

@media (max-width: 760px) {
    .home-data-table tr.table-detail-drawer.is-open {
        display: block;
    }

    .home-data-table tr.table-detail-drawer td {
        display: block;
        width: 100%;
    }

    .table-detail-inner,
    .table-detail-inner dl {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Small-phone table polish after the density pass. */
@media (max-width: 520px) {
    .home-actions-table tr {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "task task"
            "cost availability"
            "reward action";
        align-items: center;
    }

    .downtime-actions-table tr {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "activity activity"
            "cost availability"
            "benefit action";
        align-items: center;
    }

    .home-actions-table td:nth-child(1),
    .downtime-actions-table td:nth-child(1) {
        width: 100%;
        overflow: visible;
    }

    .home-actions-table strong,
    .downtime-actions-table strong,
    .hunt-target-table strong,
    .survivor-targets-table strong {
        overflow: visible;
        text-overflow: clip;
        white-space: normal;
        overflow-wrap: normal;
        word-break: normal;
    }

    .home-actions-table td:nth-child(2),
    .home-actions-table td:nth-child(3),
    .downtime-actions-table td:nth-child(2),
    .downtime-actions-table td:nth-child(3) {
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
    }

    .home-actions-table td:nth-child(4),
    .downtime-actions-table td:nth-child(4) {
        justify-self: start;
    }

    .home-actions-table td:nth-child(5),
    .downtime-actions-table td:nth-child(5) {
        align-self: stretch;
    }

    .home-actions-table .table-action,
    .downtime-actions-table .table-action {
        height: 100%;
        min-height: 38px;
    }

    .survivor-targets-table tr {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "survivor survivor"
            "level status"
            "actions actions";
        align-items: stretch;
    }

    .survivor-targets-table td:nth-child(1),
    .survivor-targets-table td:nth-child(5) {
        width: 100%;
        min-width: 0;
    }

    .survivor-table-name {
        display: grid;
        width: 100%;
        grid-template-columns: 44px minmax(0, 1fr);
        gap: 10px;
    }

    .survivor-targets-table .survivor-avatar {
        width: 44px;
        height: 44px;
    }

    .survivor-targets-table .survivor-actions {
        display: grid;
        width: 100%;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 7px;
    }

    .survivor-targets-table .survivor-actions a,
    .survivor-targets-table .pvp-scout-button,
    .survivor-targets-table .pvp-attack-button {
        width: 100%;
        min-width: 0;
    }

    .hunt-target-table tr {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "animal action"
            "sign sign"
            "difficulty activity";
        align-items: center;
    }

    .hunt-target-table td:nth-child(1),
    .hunt-target-table td:nth-child(2),
    .hunt-target-table td:nth-child(3) {
        width: 100%;
        min-width: 0;
        justify-self: stretch;
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
    }

    .hunt-target-table td:nth-child(2) {
        line-height: 1.35;
    }

    .hunt-target-table td:nth-child(3),
    .hunt-target-table td:nth-child(4) {
        color: rgba(236, 224, 194, 0.7);
        font-size: 0.8rem;
    }
}

@media (max-width: 760px) {
    .downtime-actions-table tr:not(.table-detail-drawer) {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "activity action"
            "cost cost"
            "availability availability"
            "benefit benefit";
        align-items: center;
    }

    .downtime-actions-table td:first-child {
        width: auto;
    }

    .downtime-actions-table td:nth-child(1),
    .downtime-actions-table td:nth-child(2),
    .downtime-actions-table td:nth-child(3),
    .downtime-actions-table td:nth-child(4) {
        min-width: 0;
        justify-self: stretch;
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
    }

    .downtime-actions-table td:nth-child(1) small {
        display: none;
    }

    .downtime-actions-table td:nth-child(4) .home-status {
        min-width: 0;
        max-width: 100%;
        place-items: center start;
        text-align: left;
        white-space: normal;
    }

    .downtime-actions-table td:nth-child(5) {
        align-self: start;
    }
}
.daily-reward-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1rem;
    padding: 1rem 1.1rem;
    border: 1px solid var(--line, #33414a);
    background: rgba(255, 255, 255, 0.03);
}

.daily-reward-panel.is-ready {
    border-color: var(--tan, #d7a85a);
    background: rgba(215, 168, 90, 0.09);
}

.daily-reward-panel h3,
.daily-reward-panel p {
    margin: 0;
}

.daily-reward-panel .eyebrow {
    margin-bottom: 0.25rem;
}

.daily-reward-panel small {
    display: block;
    margin-top: 0.45rem;
    opacity: 0.72;
}

.daily-reward-status {
    color: var(--tan, #d7a85a);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.75rem;
}

@media (max-width: 640px) {
    .daily-reward-panel {
        align-items: flex-start;
        flex-direction: column;
    }
}

.login-reward-summary {
    margin: 0 0 0.85rem;
    color: var(--muted, #a8aaa5);
}

.login-reward-track {
    display: grid;
    grid-template-columns: repeat(10, minmax(0, 1fr));
    gap: 0.35rem;
}

.login-reward-day {
    display: grid;
    min-height: 50px;
    place-content: center;
    border: 1px solid var(--line, #33414a);
    background: rgba(255, 255, 255, 0.025);
    text-align: center;
}

.login-reward-day span {
    color: var(--muted, #a8aaa5);
    font-size: 0.62rem;
    text-transform: uppercase;
}

.login-reward-day.is-complete {
    border-color: rgba(117, 151, 98, 0.65);
    background: rgba(117, 151, 98, 0.12);
}

.login-reward-day.is-next {
    border-color: var(--tan, #d7a85a);
    box-shadow: inset 0 0 0 1px var(--tan, #d7a85a);
}

.login-reward-day.is-medium,
.login-reward-day.is-large,
.login-reward-day.is-major {
    color: var(--tan, #d7a85a);
}

.survivor-checklist-progress {
    margin-bottom: 0.85rem;
}

.checklist-table td:first-child {
    width: 70%;
}

.checklist-final-reward {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1rem;
    padding: 0.85rem 1rem;
    border: 1px solid var(--line, #33414a);
}

.checklist-final-reward.is-ready {
    border-color: var(--tan, #d7a85a);
    background: rgba(215, 168, 90, 0.09);
}

.checklist-final-reward small {
    display: block;
    margin-top: 0.25rem;
    color: var(--muted, #a8aaa5);
}

@media (max-width: 820px) {
    .login-reward-track {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }
}

@media (max-width: 520px) {
    .login-reward-track {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .checklist-final-reward {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* Unified communications hub */
.communications-page .page-shell {
    width: min(1180px, 100%);
}

.communications-hub {
    display: grid;
    min-height: min(760px, calc(100vh - 44px));
    overflow: hidden;
    border: 1px solid rgba(199, 166, 104, 0.28);
    border-radius: 7px;
    background: #0d110d;
    color: #eee5cf;
}

.communications-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 18px;
    border-bottom: 1px solid rgba(199, 166, 104, 0.2);
    background: #171c15;
}

.communications-head h1 {
    margin: 0;
    color: #f2e8ce;
    font-family: var(--font-display);
    font-size: 2rem;
    line-height: 1;
    text-transform: uppercase;
}

.communications-signal {
    color: #9db886;
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.communications-signal::before {
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-right: 6px;
    border-radius: 50%;
    background: #91b66f;
    content: "";
}

.communications-tabs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-bottom: 1px solid rgba(199, 166, 104, 0.22);
    background: #10140f;
}

.communications-tabs button {
    position: relative;
    min-width: 0;
    min-height: 52px;
    border: 0;
    border-right: 1px solid rgba(199, 166, 104, 0.14);
    border-radius: 0;
    background: transparent;
    color: rgba(235, 226, 201, 0.58);
    font-size: 0.82rem;
    font-weight: 900;
    text-transform: uppercase;
}

.communications-tabs button:last-child {
    border-right: 0;
}

.communications-tabs button[aria-selected="true"] {
    background: rgba(188, 150, 84, 0.13);
    color: #f4e5bd;
    box-shadow: inset 0 -3px #b9924d;
}

.communications-tabs b,
.nav-communications-badge,
.communications-dock-link b {
    display: inline-grid;
    min-width: 19px;
    height: 19px;
    margin-left: 5px;
    place-items: center;
    border-radius: 50%;
    background: #9f372e;
    color: #fff4dd;
    font-family: var(--font-sans);
    font-size: 0.66rem;
}

.communications-tabs i {
    position: absolute;
    top: 10px;
    right: calc(50% - 31px);
    display: none;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #d0ad5b;
}

.communications-tabs i.is-visible {
    display: block;
}

.communications-status {
    min-height: 32px;
    padding: 7px 14px;
    border-bottom: 1px solid rgba(199, 166, 104, 0.14);
    background: #11160f;
    color: rgba(232, 222, 197, 0.64);
    font-size: 0.76rem;
}

.communications-status.is-error {
    color: #ef9a86;
}

.communications-panel {
    display: none;
    min-width: 0;
}

.communications-panel.is-active {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    min-height: 0;
}

.comm-channel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 54px;
    padding: 9px 14px;
    border-bottom: 1px solid rgba(199, 166, 104, 0.16);
    background: #151a13;
}

.comm-channel-head > div:not(.comm-channel-switch) {
    display: grid;
    gap: 2px;
}

.comm-channel-head strong {
    color: #f0e1ba;
    font-family: var(--font-display);
    font-size: 1.12rem;
    text-transform: uppercase;
}

.comm-channel-head span,
.comm-channel-head a {
    color: rgba(234, 225, 200, 0.64);
    font-size: 0.75rem;
}

.comm-channel-head a {
    color: #d8bb76;
    font-weight: 900;
    text-decoration: none;
    text-transform: uppercase;
}

.comm-channel-head > button {
    min-height: 34px;
    padding: 6px 10px;
    border-radius: 4px;
    font-size: 0.72rem;
}

.comm-channel-switch {
    display: inline-flex;
    gap: 4px;
    padding: 3px;
    border: 1px solid rgba(199, 166, 104, 0.22);
    border-radius: 5px;
    background: #090c09;
}

.comm-channel-switch button {
    min-height: 34px;
    padding: 6px 12px;
    border: 0;
    border-radius: 3px;
    background: transparent;
    color: rgba(235, 226, 201, 0.6);
    font-size: 0.74rem;
}

.comm-channel-switch button.is-active {
    background: #34452f;
    color: #f3ead2;
}

.comm-stream {
    display: grid;
    align-content: start;
    min-height: 420px;
    max-height: calc(100vh - 310px);
    overflow-y: auto;
    overflow-anchor: none;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    background:
        repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.018) 0, rgba(255, 255, 255, 0.018) 1px, transparent 1px, transparent 36px),
        #0a0e0a;
}

.comm-message {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 10px;
    min-width: 0;
    padding: 11px 14px;
    border-bottom: 1px solid rgba(199, 166, 104, 0.12);
}

.comm-message:hover {
    background: rgba(188, 150, 84, 0.055);
}

.comm-avatar-button {
    width: 42px;
    height: 42px;
    min-height: 42px;
    padding: 0;
    overflow: hidden;
    border: 1px solid rgba(199, 166, 104, 0.3);
    border-radius: 4px;
    background: #151a13;
}

.comm-avatar-button img,
.comm-inbox img,
.comm-conversation > header img,
.comm-dialog-player img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top center;
}

.comm-message-copy {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.comm-message-copy header {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 5px 8px;
}

.comm-player-name {
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #d9eee3;
    font-size: 0.92rem;
    font-weight: 900;
    text-transform: none;
}

.comm-message-copy header > span,
.comm-message-copy time {
    color: rgba(231, 222, 197, 0.5);
    font-size: 0.68rem;
}

.comm-message-copy time {
    margin-left: 0;
    white-space: nowrap;
}

.comm-message-copy .comm-camp-tag {
    padding: 2px 5px;
    border: 1px solid rgba(100, 143, 135, 0.35);
    border-radius: 3px;
    color: #8fc3bb;
    text-transform: uppercase;
}

.comm-message-copy p {
    margin: 0;
    color: #eee7d5;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.comm-message-copy blockquote {
    margin: 0;
    padding: 5px 8px;
    border-left: 2px solid #7a9c78;
    background: rgba(77, 105, 72, 0.14);
    color: rgba(235, 229, 211, 0.66);
    font-size: 0.76rem;
    overflow-wrap: anywhere;
}

.comm-message-copy blockquote strong {
    color: #b8cfac;
}

.comm-message-copy footer {
    display: flex;
    gap: 12px;
}

.comm-message-copy footer button {
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #bda86f;
    font-size: 0.68rem;
    text-transform: uppercase;
}

.comm-message.is-event {
    grid-template-columns: 92px minmax(0, 1fr);
    border-left: 3px solid #bf8b3f;
    background: rgba(110, 71, 29, 0.13);
}

.comm-event-mark {
    color: #d4a656;
    font-size: 0.7rem;
    font-weight: 900;
    text-transform: uppercase;
}

.comm-structured-event {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 14px;
    padding: 9px;
    border: 1px solid rgba(191, 139, 63, 0.32);
    border-radius: 4px;
    background: #17130d;
}

.comm-structured-event strong {
    color: #f0cf8e;
    text-transform: uppercase;
}

.comm-structured-event span {
    color: rgba(238, 225, 195, 0.7);
}

.comm-structured-event a {
    margin-left: auto;
    color: #e7c16d;
    font-weight: 900;
    text-transform: uppercase;
}

.comm-compose {
    display: grid;
    border-top: 1px solid rgba(199, 166, 104, 0.2);
    background: #141913;
}

.comm-compose > div:last-of-type {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 8px;
    align-items: end;
    padding: 10px;
}

.comm-compose textarea {
    width: 100%;
    min-height: 46px;
    max-height: 120px;
    padding: 10px;
    resize: vertical;
    border: 1px solid rgba(199, 166, 104, 0.26);
    border-radius: 4px;
    background: #080b08;
    color: #f1e9d4;
    font-family: var(--font-notes);
}

.comm-compose small {
    color: rgba(235, 225, 200, 0.45);
    font-size: 0.68rem;
    white-space: nowrap;
}

.comm-compose button[type="submit"] {
    min-width: 84px;
    min-height: 44px;
    padding: 8px 12px;
    border-radius: 4px;
}

.comm-reply-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 7px 10px;
    border-bottom: 1px solid rgba(122, 156, 120, 0.24);
    background: rgba(77, 105, 72, 0.16);
    color: #c6d8b9;
    font-size: 0.74rem;
}

.comm-reply-banner[hidden] {
    display: none;
}

.comm-reply-banner button {
    min-height: 28px;
    padding: 3px 8px;
    border-radius: 3px;
    font-size: 0.65rem;
}

.comm-empty {
    margin: 0;
    padding: 22px;
    color: rgba(234, 225, 200, 0.58);
}

.comm-no-camp,
.comm-mail-empty {
    display: grid;
    align-content: center;
    justify-items: start;
    gap: 10px;
    min-height: 440px;
    padding: 24px;
}

.comm-no-camp h2,
.comm-mail-empty h2 {
    margin: 0;
    color: #f0e1ba;
    font-family: var(--font-display);
    font-size: 2rem;
    text-transform: uppercase;
}

.comm-no-camp p,
.comm-mail-empty p {
    margin: 0;
    color: rgba(234, 225, 200, 0.64);
}

.comm-no-camp a {
    padding: 8px 12px;
    border: 1px solid rgba(199, 166, 104, 0.32);
    border-radius: 4px;
    color: #ddc17e;
    font-weight: 900;
    text-decoration: none;
    text-transform: uppercase;
}

.communications-panel[data-comm-panel="mail"] {
    grid-template-rows: minmax(0, 1fr);
}

.comm-mail-layout {
    display: grid;
    grid-template-columns: minmax(230px, 34%) minmax(0, 1fr);
    min-height: 590px;
}

.comm-mail-layout:not(.has-conversation) {
    grid-template-columns: minmax(0, 1fr);
}

.comm-mail-layout:not(.has-conversation) .comm-conversation {
    display: none;
}

.comm-inbox {
    min-width: 0;
    overflow-y: auto;
    border-right: 1px solid rgba(199, 166, 104, 0.18);
    background: #10140f;
}

.comm-inbox > header {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    padding: 12px;
    border-bottom: 1px solid rgba(199, 166, 104, 0.16);
}

.comm-inbox > header strong {
    color: #f0e1ba;
    text-transform: uppercase;
}

.comm-inbox > header span {
    color: rgba(234, 225, 200, 0.5);
    font-size: 0.72rem;
}

.comm-inbox > header > div {
    display: flex;
    align-items: center;
    gap: 8px;
}

.comm-inbox > header button,
.comm-mail-empty button {
    min-height: 30px;
    padding: 4px 9px;
    border-radius: 3px;
    font-size: 0.68rem;
    text-transform: uppercase;
}

.comm-thread {
    position: relative;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    gap: 9px;
    align-items: center;
    min-width: 0;
    padding: 10px;
    border-bottom: 1px solid rgba(199, 166, 104, 0.12);
    color: #e9e0ca;
    text-decoration: none;
}

.comm-thread:hover,
.comm-thread.is-active {
    background: rgba(188, 150, 84, 0.1);
}

.comm-thread img {
    width: 42px;
    height: 42px;
    border: 1px solid rgba(199, 166, 104, 0.28);
    border-radius: 4px;
}

.comm-thread > span {
    display: grid;
    min-width: 0;
    gap: 3px;
}

.comm-thread strong,
.comm-thread small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.comm-thread small,
.comm-thread time {
    color: rgba(234, 225, 200, 0.54);
    font-size: 0.7rem;
}

.comm-thread b {
    position: absolute;
    right: 8px;
    bottom: 8px;
    display: grid;
    min-width: 18px;
    height: 18px;
    place-items: center;
    border-radius: 50%;
    background: #9f372e;
    color: #fff4dd;
    font-size: 0.64rem;
}

.comm-conversation {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    min-width: 0;
}

.comm-conversation > header {
    display: grid;
    grid-template-columns: auto 44px minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    padding: 10px 12px;
    border-bottom: 1px solid rgba(199, 166, 104, 0.16);
    background: #151a13;
}

.comm-conversation > header img {
    width: 44px;
    height: 44px;
    border-radius: 4px;
}

.comm-conversation > header > div {
    display: grid;
}

.comm-conversation > header strong {
    color: #e9eee1;
}

.comm-conversation > header span {
    color: rgba(234, 225, 200, 0.56);
    font-size: 0.7rem;
}

.comm-conversation > header button,
.comm-mail-back {
    min-height: 34px;
    padding: 6px 9px;
    border: 1px solid rgba(199, 166, 104, 0.28);
    border-radius: 4px;
    color: #dbc184;
    font-size: 0.7rem;
    text-decoration: none;
    text-transform: uppercase;
}

.comm-mail-back {
    display: none;
}

.comm-mail-stream {
    display: grid;
    align-content: start;
    gap: 9px;
    max-height: calc(100vh - 300px);
    overflow-y: auto;
    padding: 14px;
    background: #0a0e0a;
}

.comm-mail-stream article {
    display: grid;
    gap: 4px;
    justify-self: start;
    width: min(78%, 580px);
    padding: 9px 11px;
    border: 1px solid rgba(199, 166, 104, 0.2);
    border-radius: 5px;
    background: #181d16;
}

.comm-mail-stream article.is-mine {
    justify-self: end;
    border-color: rgba(109, 146, 101, 0.32);
    background: #1c291a;
}

.comm-mail-stream article [data-comm-report] {
    justify-self: start;
    min-height: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: #bda86f;
    font-size: 0.66rem;
    font-weight: 800;
    text-transform: uppercase;
}

.comm-mail-stream article [data-comm-report]:hover,
.comm-mail-stream article [data-comm-report]:focus-visible {
    color: #f1d58d;
}

.comm-mail-stream article span {
    color: #bfae7f;
    font-size: 0.68rem;
    text-transform: uppercase;
}

.comm-mail-stream article p {
    margin: 0;
    overflow-wrap: anywhere;
}

.comm-mail-compose > div:last-of-type {
    grid-template-columns: minmax(0, 1fr) auto;
}

.communications-panel[data-comm-panel="noti"] {
    grid-template-rows: auto minmax(0, 1fr);
}

.comm-notification-list {
    display: grid;
    align-content: start;
    min-height: 500px;
    overflow-y: auto;
    background: #0a0e0a;
}

.comm-notification-list article {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 12px 14px;
    border-bottom: 1px solid rgba(199, 166, 104, 0.13);
}

.comm-notification-list article.is-unread {
    border-left: 3px solid #c29b4e;
    background: rgba(194, 155, 78, 0.08);
}

.comm-notification-list article > span {
    color: #bda566;
    font-size: 0.68rem;
    font-weight: 900;
}

.comm-notification-list article > div {
    display: grid;
    gap: 4px;
}

.comm-notification-list time {
    color: rgba(234, 225, 200, 0.5);
    font-size: 0.7rem;
}

.comm-notification-list a {
    color: #d5ba77;
    font-weight: 900;
    text-transform: uppercase;
}

.comm-player-dialog,
.comm-new-mail-dialog {
    width: min(430px, calc(100vw - 24px));
    padding: 18px;
    border: 1px solid rgba(199, 166, 104, 0.42);
    border-radius: 7px;
    background: #111610;
    color: #ece4d0;
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.64);
}

.comm-player-dialog::backdrop,
.comm-new-mail-dialog::backdrop {
    background: rgba(3, 5, 3, 0.76);
}

.comm-new-mail-dialog > header {
    padding-right: 58px;
}

.comm-new-mail-dialog h2 {
    margin: 0;
    color: #f1e4c2;
    font-family: var(--font-display);
    font-size: 1.65rem;
    text-transform: uppercase;
}

.comm-new-mail-dialog form,
.comm-new-mail-dialog label {
    display: grid;
    gap: 7px;
}

.comm-new-mail-dialog form {
    gap: 12px;
    margin-top: 16px;
}

.comm-new-mail-dialog label {
    color: #bda86f;
    font-size: 0.7rem;
    font-weight: 900;
    text-transform: uppercase;
}

.comm-new-mail-dialog select,
.comm-new-mail-dialog textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid rgba(199, 166, 104, 0.28);
    border-radius: 4px;
    background: #080b08;
    color: #f1e9d4;
    font: inherit;
    text-transform: none;
}

.comm-new-mail-dialog textarea {
    min-height: 104px;
    resize: vertical;
}

.comm-new-mail-dialog button[type="submit"] {
    min-height: 42px;
    border-radius: 4px;
}

.comm-dialog-close {
    position: absolute;
    top: 8px;
    right: 8px;
    min-height: 30px;
    padding: 4px 8px;
    border-radius: 3px;
    font-size: 0.66rem;
}

.comm-dialog-player {
    display: grid;
    grid-template-columns: 66px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    padding-right: 54px;
}

.comm-dialog-player img {
    width: 66px;
    height: 66px;
    border: 1px solid rgba(199, 166, 104, 0.3);
    border-radius: 4px;
}

.comm-dialog-player h2 {
    margin: 0;
    color: #f1e4c2;
    font-family: var(--font-display);
    font-size: 1.65rem;
    text-transform: uppercase;
}

.comm-dialog-player div {
    display: grid;
    gap: 3px;
}

.comm-dialog-player span,
.comm-dialog-player small {
    color: rgba(234, 225, 200, 0.62);
}

.comm-dialog-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    margin-top: 16px;
}

.comm-dialog-actions a,
.comm-dialog-actions button {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 8px;
    border: 1px solid rgba(199, 166, 104, 0.28);
    border-radius: 4px;
    background: #171d15;
    color: #e6d6a9;
    font-size: 0.72rem;
    font-weight: 900;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
}

.comm-dialog-actions .is-danger {
    border-color: rgba(153, 56, 47, 0.5);
    color: #ed9f8e;
}

.communications-dock-link {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 32;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 48px;
    padding: 8px 12px;
    border: 1px solid rgba(199, 166, 104, 0.42);
    border-radius: 6px;
    background: #151a13;
    color: #e9ddb9;
    box-shadow: 0 14px 40px rgba(0, 0, 0, 0.46);
    font-size: 0.76rem;
    font-weight: 900;
    font-family: inherit;
    text-decoration: none;
    text-transform: uppercase;
    cursor: pointer;
}

.communications-dock-link .nav-icon {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
}

.communications-dock-link.has-unread {
    border-color: rgba(194, 155, 78, 0.72);
    color: #f1d58d;
}

.nav-communications-badge {
    margin-left: auto;
}

.communications-popup {
    position: fixed;
    right: 18px;
    bottom: 76px;
    z-index: 41;
    display: grid;
    grid-template-rows: 46px minmax(0, 1fr);
    width: min(460px, calc(100vw - 36px));
    height: min(720px, calc(100vh - 96px));
    overflow: hidden;
    border: 1px solid rgba(199, 166, 104, 0.46);
    border-radius: 7px;
    background: #0b0f0b;
    box-shadow: 0 18px 54px rgba(0, 0, 0, 0.62);
}

.communications-popup[hidden] {
    display: none;
}

.communications-popup > header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) 36px;
    gap: 9px;
    align-items: center;
    padding: 5px 6px 5px 12px;
    border-bottom: 1px solid rgba(199, 166, 104, 0.26);
    background: #1a2018;
}

.communications-popup > header strong {
    color: #f0dfb4;
    font-family: var(--font-display);
    font-size: 1.12rem;
    text-transform: uppercase;
}

.communications-popup > header span {
    overflow: hidden;
    color: rgba(234, 225, 200, 0.52);
    font-size: 0.68rem;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.communications-popup > header button {
    width: 34px;
    min-height: 34px;
    padding: 0;
    border: 1px solid rgba(199, 166, 104, 0.24);
    border-radius: 4px;
    background: #111610;
    color: #d8caa5;
    font-weight: 900;
}

.communications-popup iframe {
    width: 100%;
    height: 100%;
    border: 0;
    background: #0d110d;
}

body.communications-popup-open .communications-dock-link {
    display: none;
}

.communications-popup-page {
    min-width: 0;
    min-height: 100vh;
    margin: 0;
    overflow: hidden;
    background: #0d110d;
}

.communications-popup-shell,
.communications-popup-page .communications-hub {
    width: 100%;
    height: 100vh;
    min-height: 100vh;
}

.communications-popup-page .communications-hub {
    border: 0;
    border-radius: 0;
}

.communications-popup-page .communications-head {
    display: none;
}

@media (max-width: 760px) {
    .communications-page .page-shell {
        padding: 8px;
    }

    .communications-hub {
        grid-template-rows: auto auto minmax(0, 1fr);
        min-height: calc(100dvh - 168px - env(safe-area-inset-bottom, 0px));
        max-height: calc(100dvh - 168px - env(safe-area-inset-bottom, 0px));
        border-radius: 5px;
    }

    .communications-head {
        padding: 11px 12px;
    }

    .communications-head h1 {
        font-size: 1.55rem;
    }

    .communications-tabs button {
        min-height: 48px;
        padding: 6px 3px;
        font-size: 0.72rem;
    }

    .communications-status {
        display: none;
    }

    .comm-channel-head {
        min-height: 50px;
        padding: 7px 9px;
    }

    .comm-channel-head > span {
        display: none;
    }

    .comm-channel-switch {
        width: 100%;
    }

    .comm-channel-switch button {
        flex: 1 1 50%;
        min-width: 0;
        padding: 6px;
        overflow-wrap: anywhere;
    }

    .comm-stream {
        min-height: 0;
        max-height: none;
    }

    .comm-message {
        grid-template-columns: 38px minmax(0, 1fr);
        gap: 8px;
        padding: 9px;
    }

    .comm-avatar-button {
        width: 36px;
        height: 36px;
        min-height: 36px;
    }

    .comm-message.is-event {
        grid-template-columns: 1fr;
    }

    .comm-compose > div:last-of-type {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .comm-compose small {
        display: none;
    }

    .comm-compose button[type="submit"] {
        min-width: 68px;
    }

    .comm-mail-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        min-height: 0;
        height: 100%;
    }

    .comm-mail-layout.has-conversation .comm-inbox {
        display: none;
    }

    .comm-mail-layout:not(.has-conversation) .comm-conversation {
        display: none;
    }

    .comm-inbox {
        border-right: 0;
    }

    .comm-conversation {
        min-height: 0;
        height: 100%;
        overflow: hidden;
    }

    .comm-conversation > header {
        grid-template-columns: auto 40px minmax(0, 1fr) auto;
        padding: 8px;
    }

    .comm-conversation > header img {
        width: 40px;
        height: 40px;
    }

    .comm-mail-back {
        display: inline-flex;
        align-items: center;
    }

    .comm-mail-stream {
        min-height: 0;
        max-height: none;
        padding: 10px;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }

    .comm-mail-stream article {
        width: 92%;
    }

    .communications-panel.is-active,
    .communications-panel[data-comm-panel="mail"],
    .communications-panel[data-comm-panel="mail"].is-active {
        min-height: 0;
        overflow: hidden;
    }

    .communications-panel[data-comm-panel="mail"].is-active {
        grid-template-rows: minmax(0, 1fr);
    }

    .comm-mail-compose {
        padding-bottom: env(safe-area-inset-bottom, 0px);
    }

    .comm-mail-compose > div:last-of-type {
        align-items: end;
        padding: 8px;
    }

    .comm-mail-compose textarea {
        min-height: 44px;
        max-height: 92px;
        resize: none;
    }

    .comm-notification-list article {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 5px 10px;
        padding: 10px;
    }

    .comm-notification-list article > span {
        grid-column: 1 / -1;
    }

    .comm-player-dialog,
    .comm-new-mail-dialog {
        width: 100%;
        max-width: none;
        margin: auto 0 0;
        border-radius: 7px 7px 0 0;
    }

    .communications-dock-link {
        right: 10px;
        bottom: 78px;
        min-height: 46px;
    }

    body.communications-popup-open {
        overflow: hidden;
    }

    .communications-popup {
        top: 0;
        right: 0;
        bottom: 68px;
        left: 0;
        width: auto;
        height: auto;
        max-height: none;
        border-width: 0 0 1px;
        border-radius: 0;
    }

    .communications-popup-page .communications-hub {
        height: 100dvh;
        min-height: 100dvh;
        max-height: 100dvh;
    }
}