:root {
    --font-sans: "Bahnschrift", "Arial Narrow", "Trebuchet MS", Arial, sans-serif;
    --font-display: "Bahnschrift", "Arial Narrow", "Trebuchet MS", Arial, sans-serif;
    --font-mono: "Consolas", "Liberation Mono", monospace;
    --color-void-975: #02050a;
    --color-void-950: #050a11;
    --color-void-900: #091320;
    --color-line-strong: #31465f;
    --color-line: #243547;
    --color-line-soft: #192635;
    --color-ink: #e6edf5;
    --color-ink-soft: #b9c4d0;
    --color-mist: #7c8998;
    --color-gold: #c39a53;
    --color-lawful: #49be78;
    --color-neutral: #8795a5;
    --color-criminal: #c85a5e;
    --color-corruption: #c7923f;
    --color-danger: #7f1d24;
    --color-suspicious: #c7923f;
    --shadow-panel: 0 18px 40px rgba(1, 5, 12, 0.62);
    --shadow-raised: 0 14px 28px rgba(0, 0, 0, 0.45);
    --shadow-inset: inset 0 1px 0 rgba(230, 237, 245, 0.04), inset 0 0 0 1px rgba(124, 137, 152, 0.05);
    --border-panel: 1px solid rgba(49, 70, 95, 0.76);
    --border-soft: 1px solid rgba(36, 53, 71, 0.82);
    --ui-motion-standard: 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

.identity-change-modal {
    background: transparent;
    border: 0;
    color: inherit;
    margin: auto;
    max-width: min(32rem, calc(100vw - 2rem));
    padding: 0;
    width: 100%;
}

.identity-change-modal::backdrop {
    background: rgba(3, 5, 13, 0.82);
    backdrop-filter: blur(4px);
}

.identity-change-modal__panel {
    background: linear-gradient(145deg, rgba(18, 24, 49, 0.99), rgba(8, 11, 25, 0.99));
    border: 1px solid rgba(109, 225, 159, 0.28);
    border-radius: 0.85rem;
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.58);
    max-height: calc(100vh - 2rem);
    overflow-y: auto;
    padding: 1.25rem;
}

.identity-change-modal__fee {
    align-items: center;
    background: rgba(0, 0, 0, 0.24);
    border: 1px solid rgba(255, 255, 255, 0.1);
    display: flex;
    justify-content: space-between;
    margin-top: 1rem;
    padding: 0.75rem 0.9rem;
}

.identity-change-modal__fee span {
    color: var(--color-mist);
    font-size: 0.75rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.identity-change-modal__fee strong {
    color: var(--color-acid);
}

.career-carousel-frame {
    display: grid;
    gap: 0.5rem;
}

.career-carousel-stage {
    min-width: 0;
}

.career-carousel-arrow,
.career-carousel-teaser {
    display: none;
}

.career-carousel-mobile-controls {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.career-carousel-selector {
    margin-inline: auto;
    max-width: 36rem;
    position: relative;
    width: min(100%, 36rem);
}

.career-carousel-picker--heading {
    margin: 0.5rem 0 0;
    max-width: min(100%, 32rem);
    width: min(100%, 32rem);
}

.career-carousel-picker__button {
    align-items: center;
    background: rgba(6, 12, 27, 0.94);
    border: 1px solid var(--color-panel-border);
    color: #fff;
    cursor: pointer;
    display: flex;
    font-size: 1rem;
    gap: 0.75rem;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    text-align: left;
    text-transform: none;
    width: 100%;
}

.career-carousel-picker__button--heading {
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.15;
    padding: 0.45rem 0.7rem;
}

.career-carousel-picker__button:focus-visible {
    border-color: var(--color-highlight);
    outline: 2px solid rgba(73, 190, 120, 0.32);
    outline-offset: 2px;
}

.career-carousel-picker__menu {
    background: #081020;
    border: 1px solid var(--color-panel-border);
    box-shadow: 0 1.25rem 3rem rgba(0, 0, 0, 0.42);
    left: 0;
    max-height: min(24rem, 55vh);
    overflow-y: auto;
    padding: 0.25rem;
    position: absolute;
    right: 0;
    text-align: left;
    top: calc(100% + 0.35rem);
    z-index: 60;
}

.career-carousel-picker__option {
    background: transparent;
    border: 0;
    color: #fff;
    cursor: pointer;
    display: block;
    font-size: 0.95rem;
    padding: 0.7rem 0.85rem;
    text-align: left;
    text-transform: none;
    width: 100%;
}

.career-carousel-picker__option:hover,
.career-carousel-picker__option:focus-visible,
.career-carousel-picker__option--active {
    background: rgba(73, 190, 120, 0.16);
    color: #9cff8f;
    outline: none;
}

@media (min-width: 1024px) {
    .career-carousel-frame {
        align-items: center;
        grid-template-columns: 2.25rem minmax(4.5rem, 0.45fr) minmax(0, 3.35fr) minmax(4.5rem, 0.45fr) 2.25rem;
    }

    .career-carousel-arrow {
        align-items: center;
        background: rgba(6, 12, 27, 0.58);
        border: 1px solid var(--color-panel-border);
        border-radius: 0.125rem;
        color: white;
        display: flex;
        font-size: 1.875rem;
        font-weight: 700;
        justify-content: center;
        min-height: 7rem;
        transition: background-color 0.16s ease, border-color 0.16s ease;
    }

    .career-carousel-arrow:hover {
        background: rgba(42, 69, 142, 0.42);
        border-color: var(--color-highlight);
    }

    .career-carousel-teaser {
        align-items: center;
        background: rgba(6, 12, 27, 0.42);
        border: 1px solid var(--color-panel-border);
        border-radius: 0.125rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        min-height: 18rem;
        padding: 0.85rem;
        text-align: center;
    }

    .career-carousel-mobile-controls {
        display: none;
    }
}

.career-overview-grid {
    display: grid;
    gap: 0.75rem;
    margin-top: 1rem;
}

.career-tier-grid {
    display: grid;
    gap: 0.9rem;
    margin-top: 1rem;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
}

.career-tier-card {
    background:
        linear-gradient(90deg, rgba(73, 190, 120, 0.28), transparent 0.35rem),
        rgba(0, 0, 0, 0.26);
    border: 1px solid rgba(124, 137, 152, 0.22);
    border-radius: 0.2rem;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
    padding: 0.9rem 0.95rem 0.85rem 1.05rem;
}

.career-tier-card__header {
    align-items: start;
    border-bottom: 1px solid rgba(124, 137, 152, 0.16);
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: space-between;
    padding-bottom: 0.65rem;
}

.career-tier-card__description {
    color: var(--color-mist);
    font-size: 0.875rem;
    line-height: 1.45;
    margin-top: 0.65rem;
}

.career-tier-summary {
    color: var(--color-mist);
    display: grid;
    font-size: 0.78rem;
    gap: 0.4rem;
    line-height: 1.35;
    margin-top: 0.75rem;
}

.career-tier-summary__row {
    align-items: start;
    display: grid;
    gap: 0.45rem;
    grid-template-columns: minmax(0, 3fr) minmax(0, 7fr);
}

.career-tier-summary__row dt,
.career-tier-summary__row dd {
    min-width: 0;
    overflow-wrap: anywhere;
}

@media (min-width: 768px) {
    .career-overview-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 768px) {
    button[data-shell-close].ui-button {
        display: none !important;
    }
}

.cosmetic-title-preview {
    display: inline-block;
    color: var(--color-gold);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.cosmetic-online-badge {
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(230, 237, 245, 0.22);
    color: white;
    background: rgba(13, 23, 37, 0.72);
    font-size: 0.56rem;
    font-weight: 800;
    line-height: 1;
    margin-left: 0.35rem;
    padding: 0.18rem 0.3rem;
    text-transform: uppercase;
}

.cosmetic-badge-s1 {
    border-color: rgba(73, 190, 120, 0.55);
    color: var(--color-lawful);
}

.cosmetic-badge-founder,
.cosmetic-rarity--founder {
    border-color: rgba(195, 154, 83, 0.8);
    color: var(--color-gold);
}

.cosmetic-frame-case-file {
    border-color: rgba(230, 237, 245, 0.42);
    box-shadow: inset 0 0 0 2px rgba(230, 237, 245, 0.08);
}

.cosmetic-frame-founder-ledger,
.cosmetic-business-founder-gold {
    border-color: rgba(195, 154, 83, 0.88);
    box-shadow: 0 0 0 1px rgba(195, 154, 83, 0.35), 0 0 18px rgba(195, 154, 83, 0.18);
}

.cosmetic-frame-court-seal {
    border-color: rgba(73, 190, 120, 0.72);
    box-shadow: inset 0 0 0 2px rgba(73, 190, 120, 0.12);
}

.cosmetic-newspaper-first-edition,
.cosmetic-newspaper-scandal,
.cosmetic-legacy-family-crest,
.cosmetic-legacy-memorial-stamp {
    border-color: rgba(195, 154, 83, 0.42);
}

.profile-emblem {
    position: absolute;
    inset: 0;
    display: block;
}

.profile-emblem__svg,
.profile-builder-preview__svg {
    display: block;
    width: 100%;
    height: 100%;
}

.cosmetic-shop-row__main {
    display: grid;
    gap: 1rem;
}

.cosmetic-shop-preview {
    justify-self: end;
    align-self: start;
    width: min(14rem, 100%);
}

.cosmetic-shop-preview__inner {
    width: 100%;
}

.cosmetic-shop-preview-emblem {
    position: relative;
    width: min(10rem, 100%);
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border-radius: 1rem;
    background: rgba(5, 10, 17, 0.55);
}

.cosmetic-shop-preview__asset {
    width: 100%;
    max-height: 10rem;
}

@media (min-width: 1024px) {
    .cosmetic-shop-row__main {
        grid-template-columns: minmax(0, 1.1fr) minmax(13rem, 0.85fr) 15rem;
        align-items: start;
    }
}

@media (max-width: 1023px) {
    .cosmetic-shop-preview {
        justify-self: stretch;
        width: 100%;
        max-width: 11rem;
        margin-left: auto;
    }
}

.profile-builder-layout {
    display: grid;
    gap: 0.85rem;
}

.profile-builder-preview-panel {
    display: grid;
    gap: 0.8rem;
}

.profile-builder-controls {
    display: grid;
    gap: 0.8rem;
    align-content: start;
}

.profile-builder-preview {
    position: relative;
    width: min(11.5rem, 100%);
    aspect-ratio: 1 / 1;
    margin: 0 auto;
    border-radius: 1.15rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: linear-gradient(180deg, rgba(14, 24, 39, 0.97) 0%, rgba(7, 13, 22, 0.98) 100%);
    overflow: hidden;
}

.profile-builder-preview-meta {
    text-align: center;
}

.profile-builder-summary {
    display: grid;
    gap: 0.45rem;
    margin-top: 0.8rem;
    text-align: left;
}

.profile-builder-summary__item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.55rem;
    padding: 0.45rem 0.6rem;
    border-radius: 0.7rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(5, 10, 17, 0.52);
}

.profile-builder-summary__label {
    color: var(--color-mist);
    font-size: 0.67rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.profile-builder-summary__value {
    font-size: 0.76rem;
    font-weight: 700;
    text-align: right;
}

.profile-builder-actions {
    display: grid;
    gap: 0.6rem;
}

.profile-builder-notice {
    padding: 0.6rem 0.75rem;
    border-radius: 0.8rem;
    border: 1px solid rgba(195, 154, 83, 0.3);
    background: rgba(58, 39, 15, 0.45);
    color: #f8dfb2;
    font-size: 0.74rem;
    font-weight: 700;
}

.profile-builder-tabs {
    display: grid;
    gap: 0.45rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.profile-builder-tab {
    width: 100%;
    padding: 0.65rem 0.75rem;
    border-radius: 0.8rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(5, 10, 17, 0.52);
    color: var(--color-mist);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    transition: border-color 160ms ease, background 160ms ease, color 160ms ease;
}

.profile-builder-tab--active {
    border-color: rgba(73, 190, 120, 0.58);
    background: rgba(20, 55, 35, 0.48);
    color: white;
}

.profile-builder-section {
    display: grid;
    gap: 0.75rem;
}

.profile-builder-section__header {
    display: grid;
    gap: 0.2rem;
}

.profile-builder-section__rows {
    display: grid;
    gap: 0.8rem;
}

.profile-builder-option-grid {
    display: grid;
    gap: 0.55rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.profile-builder-option-grid--colors {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.profile-builder-option {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 0.45rem;
    min-height: 3.45rem;
    width: 100%;
    padding: 0.55rem 0.65rem;
    border-radius: 0.8rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(5, 10, 17, 0.62);
    color: white;
    text-align: left;
    transition: border-color var(--ui-motion-standard), background var(--ui-motion-standard), transform var(--ui-motion-standard);
}

.game-pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.game-pagination__link,
.game-pagination__status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.5rem;
    padding: 0.55rem 0.9rem;
    border-radius: 0.9rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(5, 10, 17, 0.62);
    color: white;
    font-size: 0.78rem;
    font-weight: 700;
}

.game-pagination__link {
    transition: border-color var(--ui-motion-standard), background var(--ui-motion-standard), transform var(--ui-motion-standard);
}

.game-pagination__link:hover {
    border-color: rgba(73, 190, 120, 0.45);
    background: rgba(20, 55, 35, 0.35);
}

.game-pagination__link.is-disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

.game-pagination__status {
    color: var(--color-mist);
}

.profile-builder-option-form {
    display: block;
}

.profile-builder-option:hover {
    border-color: rgba(195, 154, 83, 0.42);
    transform: translateY(-1px);
}

.profile-builder-option--selected {
    border-color: rgba(73, 190, 120, 0.58);
    background: rgba(20, 55, 35, 0.52);
    box-shadow: inset 0 0 0 1px rgba(73, 190, 120, 0.18), 0 0 0 1px rgba(73, 190, 120, 0.2);
}

.profile-builder-option--locked {
    opacity: 0.72;
}

.profile-builder-option--fixed-disabled {
    cursor: not-allowed;
    opacity: 0.42;
    filter: grayscale(0.55);
}

.profile-builder-fixed-note {
    margin-top: -0.35rem;
    color: var(--color-mist);
    font-size: 0.72rem;
}

.profile-builder-option--compact {
    min-height: 3rem;
    padding: 0.55rem 0.6rem;
}

.profile-builder-option--compact .profile-builder-option__body {
    gap: 0.1rem;
}

.profile-builder-option--compact .profile-builder-option__meta {
    font-size: 0.58rem;
    letter-spacing: 0.06em;
    line-height: 1.2;
}

.profile-builder-option--compact .profile-builder-lock {
    font-size: 0.62rem;
}

.profile-builder-option__body {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 0.12rem;
    padding-right: 0.35rem;
}

.profile-builder-option__meta {
    color: var(--color-mist);
    font-size: 0.58rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    line-height: 1.25;
}

.profile-builder-option__selected-mark {
    display: none;
    position: absolute;
    right: 0.45rem;
    top: 0.45rem;
    border-radius: 999px;
    border: 1px solid rgba(73, 190, 120, 0.4);
    background: rgba(20, 55, 35, 0.82);
    color: #c7ffd9;
    font-size: 0.54rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    padding: 0.14rem 0.32rem;
    text-transform: uppercase;
}

.profile-builder-option--selected .profile-builder-option__selected-mark {
    display: inline-flex;
}

.profile-builder-swatch {
    flex: 0 0 1rem;
    width: 1rem;
    height: 1rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.24);
    margin-top: 0.1rem;
}

.profile-builder-lock {
    margin-left: auto;
    color: var(--color-mist);
    font-size: 0.58rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
}

@media (max-width: 639px) {
    .profile-builder-option-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .profile-builder-option-grid--colors {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    .profile-builder-layout {
        grid-template-columns: minmax(15rem, 18rem) minmax(0, 1fr);
        align-items: start;
    }

    .profile-builder-tabs {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .profile-builder-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

    .profile-builder-option-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .profile-builder-option-grid--colors {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    color-scheme: dark;
}

body {
    margin: 0;
    min-height: 100vh;
    color: var(--color-ink);
    font-family: var(--font-sans);
    background-color: var(--color-void-975);
    background-image:
        radial-gradient(circle at top, rgba(29, 48, 70, 0.34), transparent 28%),
        linear-gradient(180deg, rgba(2, 5, 10, 0) 0%, rgba(2, 5, 10, 0.78) 100%),
        linear-gradient(rgba(230, 237, 245, 0.015) 1px, transparent 1px),
        linear-gradient(90deg, rgba(230, 237, 245, 0.015) 1px, transparent 1px);
    background-size: auto, auto, 40px 40px, 40px 40px;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input,
textarea,
select {
    font: inherit;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.absolute { position: absolute; }
.relative { position: relative; }
.sticky { position: sticky; }
.block { display: block; }
.inline-flex { display: inline-flex; }
.flex { display: flex; }
.grid { display: grid; }
.hidden { display: none; }
.w-full { width: 100%; }
.min-w-0 { min-width: 0; }
.flex-1 { flex: 1 1 0%; }
.shrink-0 { flex-shrink: 0; }
.flex-col { flex-direction: column; }
.flex-wrap { flex-wrap: wrap; }
.items-center { align-items: center; }
.items-start { align-items: flex-start; }
.justify-between { justify-content: space-between; }
.justify-center { justify-content: center; }
.text-right { text-align: right; }
.font-semibold { font-weight: 600; }
.rounded-full { border-radius: 9999px; }
.border-t { border-top: 1px solid rgba(255, 255, 255, 0.1); }

.gap-2 { gap: 0.5rem; }
.gap-3 { gap: 0.75rem; }
.gap-4 { gap: 1rem; }
.gap-5 { gap: 1.25rem; }
.gap-6 { gap: 1.5rem; }

.p-4 { padding: 1rem; }
.p-5 { padding: 1.25rem; }
.px-3 { padding-left: 0.75rem; padding-right: 0.75rem; }
.px-4 { padding-left: 1rem; padding-right: 1rem; }
.px-5 { padding-left: 1.25rem; padding-right: 1.25rem; }
.py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; }
.py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
.py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; }
.py-4 { padding-top: 1rem; padding-bottom: 1rem; }
.py-2\.5 { padding-top: 0.625rem; padding-bottom: 0.625rem; }
.pt-4 { padding-top: 1rem; }

.mt-1 { margin-top: 0.25rem; }
.mt-2 { margin-top: 0.5rem; }
.mt-3 { margin-top: 0.75rem; }
.mt-4 { margin-top: 1rem; }

.space-y-2 > * + * { margin-top: 0.5rem; }
.space-y-3 > * + * { margin-top: 0.75rem; }
.space-y-4 > * + * { margin-top: 1rem; }
.space-y-5 > * + * { margin-top: 1.25rem; }
.space-y-6 > * + * { margin-top: 1.5rem; }

.text-xs { font-size: 0.75rem; }
.text-sm { font-size: 0.875rem; }
.text-base { font-size: 1rem; }
.text-lg { font-size: 1.125rem; }
.text-xl { font-size: 1.25rem; }
.text-2xl { font-size: 1.5rem; }

.dashboard-shell {
    min-height: 100vh;
    overflow-x: clip;
}

.dashboard-shell--prison {
    --color-acid: #d1d5db;
    --color-alert: #cbd5e1;
    --color-highlight: #e5e7eb;
    filter: saturate(0.42);
}

.dashboard-shell--prison .dashboard-masthead,
.dashboard-shell--prison .ui-panel,
.dashboard-shell--prison .ui-card {
    border-color: rgba(148, 163, 184, 0.34);
    background: linear-gradient(180deg, rgba(31, 41, 55, 0.96), rgba(10, 15, 22, 0.98));
}

.dashboard-shell--prison .dashboard-brandmark__crest {
    filter: grayscale(1);
}

.dashboard-shell > .relative.mx-auto,
.dashboard-shell > div:last-child {
    max-width: 1500px;
    margin: 0 auto;
    padding: 1rem;
}

.dashboard-mobile-bar {
    position: sticky;
    top: 0;
    z-index: 20;
    padding: 1rem 1rem 0;
}

.dashboard-mobile-bar__inner {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    max-width: 1500px;
    margin: 0 auto;
    padding: 0.75rem;
    overflow-x: auto;
    border: var(--border-panel);
    border-radius: 16px;
    background: rgba(5, 10, 17, 0.88);
    box-shadow: var(--shadow-raised);
    scrollbar-width: none;
}

.dashboard-mobile-bar__inner::-webkit-scrollbar,
.dashboard-mobile-rail::-webkit-scrollbar {
    display: none;
}

.dashboard-mobile-rail {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    overflow-x: auto;
    scrollbar-width: none;
}

.dashboard-mobile-rail .ui-badge {
    white-space: nowrap;
}

.dashboard-overlay {
    display: none;
}

.dashboard-main-shell {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.dashboard-status-grid {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

#dashboard-content {
    order: 1;
    min-width: 0;
}

.dashboard-sidebar {
    order: 2;
    width: 100%;
    left: 1.5vw;
  position: relative;
}

.ui-panel {
    position: relative;
    overflow: hidden;
    border-radius: 16px;
    border: var(--border-panel);
    background:
        radial-gradient(circle at top right, rgba(195, 154, 83, 0.06), transparent 26%),
        linear-gradient(180deg, rgba(16, 28, 42, 0.96) 0%, rgba(7, 13, 22, 0.98) 100%);
    box-shadow: 0 14px 28px rgba(1, 5, 12, 0.44), var(--shadow-inset);
}

.ui-card-muted,
.dashboard-list-item,
.dashboard-strip-item,
.dashboard-profile-block,
.dashboard-keydata {
    border-radius: 13px;
    border: var(--border-soft);
    background: linear-gradient(180deg, rgba(13, 23, 37, 0.95) 0%, rgba(6, 11, 18, 0.97) 100%);
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(230, 237, 245, 0.025);
}

.dashboard-strip-grid,
.dashboard-stat-grid,
.dashboard-broadcast-grid,
.dashboard-column-grid,
.dashboard-hero-grid {
    display: grid;
    gap: 1rem;
}

.dashboard-strip-grid {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

.dashboard-strip-item {
    padding: 0.75rem 0.9rem;
}

.dashboard-strip-label,
.dashboard-keydata__label {
    color: var(--color-mist);
    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

.dashboard-profile-block {
    padding: 1rem;
}

.dashboard-keydata {
    padding: 0.8rem 0.9rem;
    background: rgba(5, 10, 17, 0.58);
}

.dashboard-keydata__value {
    margin-top: 0.45rem;
    color: #fff;
    font-family: var(--font-display);
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.earn-board__status {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    border: var(--border-soft);
    border-radius: 14px;
    background: rgba(5, 10, 17, 0.58);
    color: var(--color-ink-soft);
    font-size: 0.875rem;
}

.earn-board__table-wrap {
    overflow: hidden;
    border-radius: 16px;
    border: var(--border-soft);
    background: rgba(5, 10, 17, 0.58);
}

.earn-board__table {
    width: 100%;
    border-collapse: collapse;
}

.earn-board__table th,
.earn-board__table td {
    padding: 0.9rem 1rem;
    vertical-align: top;
    text-align: left;
}

.earn-board__table th {
    color: var(--color-mist);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    background: rgba(12, 20, 33, 0.86);
}

.earn-board__table tbody tr + tr td {
    border-top: 1px solid rgba(36, 53, 71, 0.82);
}

.earn-board__option {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    cursor: pointer;
}

.earn-board__option input[type='radio'] {
    margin-top: 0.18rem;
    flex-shrink: 0;
}

.earn-board__option strong {
    display: block;
    color: #fff;
    font-size: 0.98rem;
    font-weight: 700;
}

.earn-board__option small,
.earn-board__reward small {
    display: block;
    margin-top: 0.3rem;
    color: var(--color-mist);
    font-size: 0.82rem;
    line-height: 1.5;
}

.earn-board__reward {
    white-space: nowrap;
}

.earn-board__reward div {
    color: #fff;
    font-weight: 700;
}

.dashboard-list-item {
    padding: 0.85rem 0.9rem;
}

.ui-label {
    color: #bc9150;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.24em;
    text-transform: uppercase;
}

.ui-title {
    color: #fff;
    font-family: var(--font-display);
    font-size: clamp(1.45rem, 1.9vw, 2rem);
    font-weight: 700;
    letter-spacing: 0.05em;
    line-height: 1.08;
    text-transform: uppercase;
}

.ui-section-head {
    margin-bottom: 0.95rem;
}

.ui-section-title {
    color: #fff;
    font-family: var(--font-display);
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    line-height: 1.25;
    text-transform: uppercase;
}

.ui-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border-radius: 12px;
    border: 1px solid rgba(49, 70, 95, 0.82);
    padding: 0.7rem 1rem;
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    box-shadow: inset 0 1px 0 rgba(230, 237, 245, 0.04);
    transition:
        transform var(--ui-motion-standard),
        border-color var(--ui-motion-standard),
        color var(--ui-motion-standard),
        background var(--ui-motion-standard),
        box-shadow var(--ui-motion-standard);
}

.ui-button-primary {
    color: #101823;
    background: linear-gradient(180deg, #d1ab62 0%, #af8341 100%);
    border-color: rgba(195, 154, 83, 0.78);
    box-shadow: inset 0 1px 0 rgba(255, 248, 232, 0.24);
}

.ui-button-secondary {
    color: var(--color-ink);
    background: linear-gradient(180deg, rgba(31, 44, 60, 0.96) 0%, rgba(17, 27, 41, 0.96) 100%);
}

.ui-button-ghost {
    color: var(--color-ink-soft);
    background: transparent;
    border-color: rgba(49, 70, 95, 0.45);
}

.ui-button-danger {
    color: #ffe3e3;
    background: linear-gradient(180deg, rgba(127, 29, 36, 0.9) 0%, rgba(88, 17, 24, 0.96) 100%);
    border-color: rgba(200, 90, 94, 0.7);
    box-shadow: inset 0 1px 0 rgba(255, 214, 214, 0.08);
}

.ui-button:hover {
    transform: translateY(-1px);
}

.banking-quick-amounts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
}

.banking-cash-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
}

.banking-quick-amounts .ui-button {
    width: 100%;
    min-width: 0;
    padding-inline: 0.5rem;
    text-align: center;
    white-space: nowrap;
}

@media (min-width: 640px) {
    .banking-quick-amounts {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (min-width: 768px) {
    .banking-cash-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.ui-button-primary:hover,
.ui-button-secondary:hover,
.ui-button-ghost:hover,
.ui-button-danger:hover {
    border-color: rgba(195, 154, 83, 0.42);
    color: #fff;
}

.ui-button-primary:hover {
    color: #101823;
    box-shadow: inset 0 1px 0 rgba(255, 248, 232, 0.28), 0 0 18px rgba(195, 154, 83, 0.14);
}

.ui-button-danger:hover {
    border-color: rgba(255, 181, 181, 0.42);
    box-shadow: inset 0 1px 0 rgba(255, 214, 214, 0.1), 0 0 20px rgba(127, 29, 36, 0.18);
}

.ui-link {
    color: #dfbc7c;
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.ui-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.38rem;
    border-radius: 9999px;
    border: 1px solid rgba(135, 149, 165, 0.34);
    padding: 0.35rem 0.75rem;
    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    background: linear-gradient(180deg, rgba(135, 149, 165, 0.16) 0%, rgba(33, 44, 58, 0.32) 100%);
    color: #d6dee7;
}

.tone-lawful {
    border-color: rgba(73, 190, 120, 0.34);
    background: linear-gradient(180deg, rgba(73, 190, 120, 0.2) 0%, rgba(19, 69, 39, 0.34) 100%);
    color: #b7efcb;
}

.tone-neutral {
    border-color: rgba(135, 149, 165, 0.34);
    background: linear-gradient(180deg, rgba(135, 149, 165, 0.16) 0%, rgba(33, 44, 58, 0.32) 100%);
    color: #d6dee7;
}

.tone-criminal {
    border-color: rgba(200, 90, 94, 0.38);
    background: linear-gradient(180deg, rgba(200, 90, 94, 0.18) 0%, rgba(72, 21, 24, 0.36) 100%);
    color: #ffc2c3;
}

.tone-suspicious,
.tone-corruption {
    border-color: rgba(199, 146, 63, 0.4);
    background: linear-gradient(180deg, rgba(199, 146, 63, 0.18) 0%, rgba(79, 55, 22, 0.34) 100%);
    color: #f3d39d;
}

.tone-danger,
.tone-notorious {
    border-color: rgba(127, 29, 36, 0.58);
    background: linear-gradient(180deg, rgba(127, 29, 36, 0.28) 0%, rgba(61, 10, 16, 0.48) 100%);
    color: #ffcad0;
    box-shadow: inset 0 1px 0 rgba(255, 214, 214, 0.05), 0 0 16px rgba(127, 29, 36, 0.12);
}

.ui-nav-entry {
    display: block;
    border-radius: 14px;
    border: var(--border-soft);
    padding: 1rem;
    background: linear-gradient(180deg, rgba(14, 22, 34, 0.96) 0%, rgba(7, 12, 21, 0.98) 100%);
    box-shadow: inset 2px 0 0 rgba(195, 154, 83, 0.18);
    transition:
        transform var(--ui-motion-standard),
        border-color var(--ui-motion-standard),
        box-shadow var(--ui-motion-standard);
}

.ui-nav-entry:hover {
    border-color: rgba(195, 154, 83, 0.35);
    box-shadow: inset 2px 0 0 rgba(195, 154, 83, 0.52), 0 0 18px rgba(195, 154, 83, 0.12);
    transform: translateX(2px);
}

.player-row {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    border-radius: 16px;
    border: var(--border-soft);
    padding: 0.95rem;
    background: linear-gradient(180deg, rgba(12, 21, 33, 0.96) 0%, rgba(7, 13, 22, 0.96) 100%);
    transition:
        transform var(--ui-motion-standard),
        border-color var(--ui-motion-standard),
        box-shadow var(--ui-motion-standard);
}

.player-row:hover {
    transform: translateY(-1px);
    border-color: rgba(195, 154, 83, 0.3);
    box-shadow: 0 0 18px rgba(195, 154, 83, 0.08);
}

.player-row > div:first-child,
.player-row > div:last-child {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.player-avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 12px;
    border: var(--border-soft);
    background: linear-gradient(180deg, rgba(24, 40, 59, 0.98) 0%, rgba(12, 20, 31, 0.98) 100%);
    color: #fff;
    font-weight: 700;
}

.ui-input {
    width: 100%;
    border-radius: 12px;
    border: var(--border-soft);
    padding: 0.85rem 1rem;
    color: #fff;
    background: rgba(6, 11, 18, 0.88);
}

.ui-input-label {
    color: var(--color-ink);
    font-size: 0.875rem;
    font-weight: 600;
}

.dashboard-board section > section,
.dashboard-board .ui-panel,
.dashboard-board .ui-card-muted,
.dashboard-board article {
    color: inherit;
}

.dashboard-filter-rail {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.dashboard-column > * + * {
    margin-top: 1rem;
}

.dashboard-board article {
    border-radius: 16px;
}

.text-\[var\(--color-mist\)\] {
    color: var(--color-mist);
}

.text-white {
    color: #fff;
}

.font-\[family-name\:var\(--font-display\)\] {
    font-family: var(--font-display);
}

@media (min-width: 640px) {
    .sm\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sm\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .sm\:flex-row { flex-direction: row; }
    .sm\:items-center { align-items: center; }
    .sm\:justify-between { justify-content: space-between; }
    .dashboard-strip-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1024px) {
    .dashboard-mobile-bar {
        display: none;
    }

    [data-shell-close] {
        display: none !important;
    }

    .dashboard-main-shell {
        flex-direction: row;
        align-items: flex-start;
    }

    .dashboard-sidebar {
        position: sticky;
        top: 1rem;
        order: 1;
        width: min(16rem, 31vw);
        max-height: calc(100vh - 2rem);
        overflow-y: auto;
        flex-shrink: 0;
    }

    .dashboard-sidebar--action {
        width: min(15rem, 29vw);
    }

    #dashboard-content {
        order: 2;
        flex: 1 1 0%;
        min-width: 0;
    }

    .dashboard-status-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    .lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

    .dashboard-sidebar {
        width: 4.5rem;
    }

    .dashboard-sidebar--action {
        width: 4.5rem;
    }

    #dashboard-content {
        flex: 1 1 0%;
        min-width: 0;
    }

    .player-row {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
}

@media (min-width: 1280px) {
    .xl\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .xl\:grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
    .dashboard-status-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
    .dashboard-strip-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
    .dashboard-hero-grid { grid-template-columns: minmax(0, 1.45fr) minmax(320px, 0.9fr); }
}

@media (min-width: 1536px) {
    .\32 xl\:grid-cols-3,
    .dashboard-column-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.dashboard-frame {
    max-width: 1500px;
    margin: 0 auto;
    padding: 1rem;
}

.dashboard-masthead__row {
    display: grid;
    gap: 1rem;
}

.dashboard-masthead__brand,
.dashboard-masthead__utility {
    min-width: 0;
}

.dashboard-brandmark {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
}

.dashboard-brandmark__crest {
    width: 1rem;
    height: 1rem;
    border-radius: 999px;
    background: linear-gradient(180deg, #d1ab62 0%, #af8341 100%);
    box-shadow: 0 0 18px rgba(195, 154, 83, 0.28);
}

.dashboard-brandmark__wordmark {
    color: #f7f1eb;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(1.45rem, 3vw, 2.3rem);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    white-space: nowrap;
}

.dashboard-brandmark__wordmark span {
    color: #d36b55;
}

.dashboard-masthead__tag,
.dashboard-masthead__identity-meta {
    color: rgba(232, 238, 251, 0.72);
    font-size: 0.74rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.dashboard-masthead__tag {
    margin-top: 0.35rem;
}

.dashboard-masthead__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.dashboard-header-button {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    border-radius: 13px;
    border: 1px solid rgba(218, 225, 246, 0.14);
    padding: 0.65rem 0.8rem;
    background: linear-gradient(180deg, rgba(25, 35, 67, 0.92) 0%, rgba(12, 21, 40, 0.96) 100%);
    color: #d7dff1;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    position: relative;
    text-transform: uppercase;
}

.dashboard-header-button.is-active {
    border-color: rgba(195, 154, 83, 0.68);
    background: linear-gradient(180deg, rgba(57, 71, 119, 0.98) 0%, rgba(28, 39, 73, 0.98) 100%);
    box-shadow: inset 0 -2px 0 rgba(195, 154, 83, 0.95);
    color: white;
}

.dashboard-header-button__icon {
    display: inline-flex;
    width: 1rem;
    height: 1rem;
}

.dashboard-header-button__icon svg {
    width: 100%;
    height: 100%;
}

.dashboard-header-button__badge {
    align-items: center;
    background: linear-gradient(180deg, rgba(95, 168, 255, 0.96) 0%, rgba(36, 124, 232, 0.96) 100%);
    border: 1px solid rgba(255, 255, 255, 0.55);
    border-radius: 999px;
    color: white;
    display: inline-flex;
    font-size: 0.62rem;
    font-weight: 800;
    height: 1.15rem;
    justify-content: center;
    letter-spacing: 0;
    min-width: 1.15rem;
    padding: 0 0.28rem;
    position: absolute;
    right: -0.28rem;
    top: -0.28rem;
}

.dashboard-masthead__identity-name {
    color: white;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.dashboard-timer-bar {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    margin-top: 1rem;
}

.dashboard-timer-card,
.dashboard-command-card,
.dashboard-status-panel,
.dashboard-status-marker,
.dashboard-status-metric,
.dashboard-status-player,
.dashboard-notification-item,
.dashboard-timer-item,
.dashboard-guest-note {
    border-radius: 14px;
    border: var(--border-soft);
    background: linear-gradient(180deg, rgba(10, 18, 28, 0.94) 0%, rgba(6, 11, 18, 0.96) 100%);
}

.dashboard-timer-card,
.dashboard-command-card,
.dashboard-status-panel,
.dashboard-status-marker,
.dashboard-status-metric,
.dashboard-status-player {
    padding: 0.85rem 0.9rem;
}

.dashboard-timer-card__label,
.dashboard-status-marker__label,
.dashboard-status-metric__label {
    color: var(--color-mist);
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.dashboard-timer-card__status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.dashboard-timer-card__time,
.dashboard-timer-card button.dashboard-timer-card__time,
.dashboard-command-card__value,
.dashboard-status-metric__value {
    color: white;
    font-family: var(--font-display);
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.dashboard-timer-card button.dashboard-timer-card__time {
    appearance: none;
    background: transparent;
    border: 0;
    cursor: pointer;
    line-height: 1;
    padding: 0;
    vertical-align: baseline;
}

.dashboard-timer-card form {
    display: contents;
    margin: 0;
}

.dashboard-timer-sound-toggle {
    align-items: center;
    align-self: center;
    background: rgba(10, 16, 36, 0.9);
    border: 1px solid rgba(123, 145, 194, 0.48);
    border-radius: 0.55rem;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
    color: var(--color-mist);
    cursor: pointer;
    display: inline-flex;
    flex: 0 0 2.55rem;
    font-size: 1.18rem;
    height: 2.55rem;
    justify-content: center;
    line-height: 1;
    margin-left: auto;
    padding: 0;
    touch-action: manipulation;
    width: 2.55rem;
}

.dashboard-timer-sound-toggle svg {
    fill: none;
    height: 1.15rem;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2;
    width: 1.15rem;
}

.dashboard-timer-sound-toggle svg[hidden] {
    display: none;
}

.dashboard-timer-sound-toggle:hover,
.dashboard-timer-sound-toggle:focus-visible {
    background: rgba(27, 39, 72, 0.96);
    border-color: #b7c6ef;
    color: white;
    outline: none;
}

.dashboard-timer-sound-toggle[aria-pressed='true'] {
    background: rgba(39, 84, 54, 0.92);
    border-color: #70ff85;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 0 0.8rem rgba(58, 222, 92, 0.12);
    color: white;
    outline: none;
}

.dashboard-command-card__value,
.dashboard-status-metric__value {
    margin-top: 0.5rem;
}

.dashboard-timer-card__meta,
.dashboard-command-card__meta,
.dashboard-status-metric__meta {
    color: var(--color-mist);
    font-size: 0.72rem;
    line-height: 1.45;
    margin-top: 0.4rem;
}

.dashboard-shell-grid {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.dashboard-shell-grid > .dashboard-sidebar {
    order: 3;
}

.dashboard-shell-body {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
    order: 1;
}

.dashboard-status-rail {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    order: 2;
}

.dashboard-sidebar-desktop {
    display: none;
}

.dashboard-shell-strip,
.dashboard-status-grid {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: minmax(0, 1fr);
}

.dashboard-stage {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.dashboard-shell-body > main {
    min-width: 0;
}

@media (min-width: 1024px) {
    .dashboard-masthead__row {
        grid-template-columns: max-content minmax(0, 1fr) max-content;
        align-items: center;
    }

    .dashboard-masthead__brand {
        min-width: 0;
    }

    .dashboard-masthead__actions {
        justify-content: flex-start;
        justify-self: start;
        min-width: 0;
    }

    .dashboard-masthead__utility {
        justify-self: end;
        min-width: 0;
    }

    .dashboard-shell-grid {
        display: grid;
        grid-template-columns: minmax(15rem, 16.25rem) minmax(0, 1fr);
        align-items: start;
    }

    .dashboard-shell-grid > .dashboard-sidebar {
        order: 1;
        position: sticky;
        top: 1rem;
        width: auto;
        max-height: calc(100vh - 2rem);
        overflow-y: auto;
    }

    .dashboard-status-rail {
        grid-column: 2;
        order: 3;
    }

    .dashboard-shell-strip {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 1280px) {
    .dashboard-masthead__row {
        grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    }

    .dashboard-shell-grid {
        grid-template-columns: minmax(15.5rem, 16.75rem) minmax(0, 1fr) minmax(16.5rem, 18rem);
    }

    .dashboard-status-rail {
        grid-column: 3;
    }

    .dashboard-shell-strip {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }

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

body {
    background: #1f2648;
    background-image: linear-gradient(180deg, #3a4677 0 4.75rem, #2f3966 4.75rem 100%);
    color: #f4f4f6;
}

.ui-panel,
.ui-card-muted,
.dashboard-status-marker,
.dashboard-status-metric,
.dashboard-status-player,
.detective-stat,
.detective-briefing,
.detective-module,
.evidence-ticket,
.forensic-report,
.clue-card,
.timeline-entry,
.detective-mini-stat,
.dashboard-command-card,
.dashboard-keydata,
.dashboard-list-item,
.dashboard-strip-item {
    border-radius: 0;
    border-color: #4b5888;
    box-shadow: none;
}

.ui-panel,
.ui-card-muted {
    background: #0b1021;
}

.ui-label {
    color: #91df7c;
    font-size: 0.72rem;
    letter-spacing: 0;
}

.ui-title,
.ui-section-title {
    font-family: Georgia, "Times New Roman", serif;
    letter-spacing: 0;
    text-transform: none;
}

.ui-title {
    font-size: clamp(2rem, 4vw, 3rem);
    text-align: center;
}

.ui-section-title {
    font-size: 1.1rem;
}

.ui-button {
    min-height: 2.5rem;
    border-radius: 2px;
    border-width: 1px;
    box-shadow: none;
    letter-spacing: 0;
    text-transform: none;
}

.ui-button:hover,
.ui-button:active {
    transform: none;
}

.ui-button-primary {
    background: #45d463;
    border-color: #38bb53;
    color: #ffffff;
}

.ui-button-secondary,
.ui-button-ghost {
    background: #425188;
    border-color: #546391;
    color: #eef1f7;
}

.ui-button-danger {
    background: #ef5b43;
    border-color: #d84d37;
    color: #ffffff;
}

.ui-badge {
    border: 0;
    border-radius: 2px;
    background: transparent;
    box-shadow: none;
    font-size: 0.78rem;
    letter-spacing: 0;
    padding: 0;
    text-transform: none;
}

.tone-lawful {
    color: #49df66;
}

.tone-neutral {
    color: #c8d0eb;
}

.tone-criminal,
.tone-danger,
.tone-notorious {
    color: #ff7561;
}

.tone-corruption,
.tone-suspicious {
    color: #ffd36f;
}

.ui-input,
.dashboard-shell input:not([type='checkbox']):not([type='radio']):not([type='hidden']),
.dashboard-shell textarea,
.dashboard-shell select {
    border-radius: 0 !important;
    border: 1px solid #6977a3 !important;
    background: #ececf0 !important;
    box-shadow: none !important;
    color: #111826 !important;
}

.dashboard-shell select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23111826' d='M1.41.59 6 5.17 10.59.59 12 2l-6 6-6-6z'/%3E%3C/svg%3E");
    background-position: right 0.85rem center;
    background-repeat: no-repeat;
    background-size: 0.75rem auto;
    padding-right: 2.5rem !important;
}

.dashboard-shell input::placeholder,
.dashboard-shell textarea::placeholder {
    color: #67728f !important;
}

.dashboard-shell option {
    background: #ececf0;
    color: #111826;
}

.policy-choice {
    cursor: pointer;
    display: inline-flex;
}

.policy-choice__input {
    height: 1px;
    margin: -1px;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    position: absolute;
    width: 1px;
}

.policy-choice__pill {
    align-items: center;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 0.85rem;
    color: var(--color-mist);
    display: inline-flex;
    min-height: 2.5rem;
    padding: 0.55rem 1rem;
    transition: background-color 140ms ease, border-color 140ms ease, color 140ms ease, transform 140ms ease;
}

.policy-choice:hover .policy-choice__pill {
    border-color: rgba(255, 255, 255, 0.28);
    color: #ffffff;
}

.policy-choice__input:checked + .policy-choice__pill {
    background: rgba(107, 255, 122, 0.14);
    border-color: var(--color-acid);
    color: #ffffff;
}

.policy-choice__input:focus-visible + .policy-choice__pill {
    border-color: #8ee69d;
    box-shadow: 0 0 0 2px rgba(142, 230, 157, 0.2);
}

.mayor-policy-layout {
    display: grid;
    gap: 1rem;
}

@media (min-width: 1024px) {
    .mayor-policy-layout {
        align-items: start;
        grid-template-columns: minmax(0, 1.15fr) minmax(18rem, 0.85fr);
    }

    .mayor-policy-layout__controls {
        grid-column: 1;
        grid-row: 1 / span 3;
    }

    .mayor-policy-layout__tax {
        grid-column: 2;
        grid-row: 1;
    }

    .mayor-policy-layout__budget {
        grid-column: 2;
        grid-row: 2;
    }

    .mayor-policy-layout__save {
        grid-column: 2;
        grid-row: 3;
    }
}

.dashboard-shell textarea {
    min-height: 7rem;
}

.dashboard-shell {
    --dashboard-shell-pad: 0;
    --dashboard-shell-gap: 0.55rem;
    --dashboard-masthead-height: 8rem;
    background: #313b6a;
}

.dashboard-frame {
    background: #313b6a;
    min-height: 100vh;
    padding: calc(var(--dashboard-masthead-height) + 0.45rem) 0.55rem 0.55rem;
}

.dashboard-masthead {
    top: 0;
    width: 100%;
    max-width: none;
    transform: none;
    left: 0;
    border: 0;
    border-bottom: 1px solid #4d5a8b;
    border-radius: 0;
    background: #3c477a;
    box-shadow: none;
    padding-top: 0.35rem !important;
    padding-bottom: 0.25rem !important;
}

@media (min-width: 1024px) {
    .dashboard-masthead {
        left: max(var(--dashboard-shell-pad), calc((100vw - 1500px) / 2));
        right: max(var(--dashboard-shell-pad), calc((100vw - 1500px) / 2));
        width: auto;
    }
}

.dashboard-masthead__row {
    gap: 0.25rem;
}

.dashboard-brandmark {
    align-items: baseline;
    gap: 0;
}

.dashboard-brandmark__crest,
.dashboard-masthead__tag {
    display: none;
}

.dashboard-brandmark__wordmark {
    color: #f2f0eb;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(2rem, 4vw, 3rem);
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.dashboard-brandmark__wordmark span {
    color: #ef624d;
}

.dashboard-masthead__actions {
    align-self: center;
    justify-content: center;
    justify-self: center;
    gap: 0.45rem;
}

.dashboard-header-button {
    align-items: center;
    justify-content: center;
    width: 2.9rem;
    height: 2.9rem;
    padding: 0;
    border-radius: 2px;
    border-color: #5b6894;
    background: #425188;
    box-shadow: none;
}

.dashboard-header-button.is-active {
    background: #4b578b;
    border-color: #7b88b4;
    box-shadow: none;
}

.dashboard-header-button > span:last-child {
    display: none;
}

.dashboard-header-button__icon {
    width: 1.35rem;
    height: 1.35rem;
}

.dashboard-masthead__utility {
    align-items: flex-start;
    flex-wrap: nowrap;
    gap: 1.15rem;
    justify-content: flex-end;
    justify-self: end;
}

.dashboard-masthead__player {
    align-items: flex-end;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    margin-left: auto;
    width: max-content;
}

.dashboard-masthead__player-body {
    align-items: center;
    display: flex;
    flex-direction: row;
    gap: 0.5rem;
    justify-content: flex-end;
    margin-left: auto;
    width: max-content;
}

.dashboard-masthead__stats {
    align-items: flex-end;
    display: flex;
    flex-direction: column;
    gap: 0;
    justify-content: flex-start;
    margin-left: auto;
    min-width: 5.2rem;
    text-align: right;
    line-height: 1.12;
}

.dashboard-masthead__stats > * {
    align-self: flex-end;
    text-align: right;
}

.dashboard-masthead__stats-table {
    border-collapse: collapse;
    color: #dfe5f8;
    font-size: 0.74rem;
    line-height: 1;
    min-width: 7.1rem;
    text-align: right;
}

.dashboard-masthead__stats-table th,
.dashboard-masthead__stats-table td {
    padding: 0.04rem 0;
    white-space: nowrap;
}

.dashboard-masthead__stats-table th {
    color: #9facd5;
    font-weight: 700;
    padding-right: 0.35rem;
    text-align: left;
}

.dashboard-masthead__stats-table td {
    font-weight: 700;
    text-align: right;
}

.dashboard-masthead__danger {
    color: #49df66;
}

.dashboard-masthead__badges {
    align-items: flex-end;
    display: flex !important;
    flex-direction: column;
    gap: 0;
    width: 100%;
}

.dashboard-masthead__badges > span {
    display: block;
}

.dashboard-masthead__brand {
    justify-self: start;
}

.dashboard-masthead__identity {
    min-width: 0;
    text-align: right;
}

.dashboard-masthead__identity-name {
    font-size: 1rem;
    letter-spacing: 0;
    text-transform: none;
}

.dashboard-masthead__identity-meta,
.dashboard-masthead__identity-cash,
.dashboard-masthead__identity-signal {
    color: #f0f2f7;
    font-size: 0.82rem;
    letter-spacing: 0;
    line-height: 1;
    text-transform: none;
}

.dashboard-masthead__identity-cash {
    margin-top: 0.2rem;
}

.dashboard-masthead__stats .dashboard-masthead__identity-cash,
.dashboard-masthead__stats .dashboard-masthead__identity-signal {
    margin-top: 0;
}

.dashboard-masthead__identity-cash .dashboard-masthead__cash-carried {
    color: #ff7460;
}

.dashboard-masthead__identity-cash .dashboard-masthead__cash-banked {
    color: #47e277;
}

.dashboard-masthead__stats-table .dashboard-masthead__cash-carried {
    color: #ff7460;
}

.dashboard-masthead__stats-table .dashboard-masthead__cash-banked {
    color: #47e277;
}

.dashboard-masthead__identity-signal {
    color: #cbd2ea;
    margin-top: 0.15rem;
}

.dashboard-masthead__plain-status {
    color: #f0f2f7;
    font-size: 0.82rem;
    font-weight: 700;
    line-height: 1;
}

.dashboard-masthead__plain-status--danger {
    color: #49df66;
    font-weight: 700;
}

.dashboard-masthead__portrait,
.dashboard-status-portrait {
    align-items: center;
    background: #f6f3ee;
    color: #11152b;
    display: flex;
    font-size: 0.8rem;
    justify-content: center;
    line-height: 1.1;
    text-align: center;
    text-transform: uppercase;
    width: 4.55rem;
    word-break: break-word;
}

.dashboard-masthead__portrait {
    height: 4.55rem;
}

.dashboard-timer-bar {
    border-top: 1px solid #4d5a8b;
    display: flex;
    flex-wrap: wrap;
    gap: 0.42rem 0.68rem;
    justify-content: flex-start;
    margin-top: 0.2rem;
    margin-right: auto;
    padding-top: 0.2rem;
    white-space: nowrap;
}

.dashboard-masthead__lower {
    align-items: flex-start;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.45rem;
    justify-content: space-between;
}

.dashboard-developer-messages {
    align-self: flex-start;
    background: rgba(9, 15, 34, 0.28);
    border: 1px solid rgba(111, 255, 134, 0.42);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05), 0 0.55rem 1.2rem rgba(5, 9, 22, 0.18);
    margin: 0 auto 0 0;
    max-width: 18.9rem;
    min-height: 4.85rem;
    padding: 0.48rem 0.75rem;
    width: 18.9rem;
}

.dashboard-developer-messages__head {
    align-items: center;
    color: var(--color-acid);
    display: flex;
    font-size: 0.64rem;
    font-weight: 800;
    justify-content: space-between;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.dashboard-developer-messages__item {
    color: white;
    display: grid;
    gap: 0.25rem;
    margin-top: 0.45rem;
}

.dashboard-developer-messages__item strong {
    font-size: 0.78rem;
}

.dashboard-developer-messages__item span {
    color: var(--color-mist);
    font-size: 0.72rem;
    line-height: 1.35;
}

@media (min-width: 641px) {
    .dashboard-developer-messages {
        position: relative;
        top: 10px;
    }
}

@media (max-width: 640px) {
    .dashboard-shell {
        --dashboard-shell-gap: 0.4rem;
        --dashboard-masthead-height: 6.2rem;
    }

    .dashboard-frame {
        padding: calc(var(--dashboard-masthead-height) + 0.2rem) 0.45rem 0.45rem;
    }

    .dashboard-masthead {
        padding-top: 0.1rem !important;
        padding-bottom: 0.05rem !important;
    }

    .dashboard-masthead__row {
        align-items: flex-start;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: space-between;
        gap: 0.15rem;
    }

    .dashboard-brandmark__wordmark {
        font-size: clamp(1.45rem, 3.8vw, 2rem);
        letter-spacing: 0.1em;
    }

    .dashboard-masthead__actions {
        gap: 0.3rem;
    }

    .dashboard-header-button {
        height: 2.35rem;
        width: 2.35rem;
    }

    .dashboard-header-button__icon {
        height: 1.15rem;
        width: 1.15rem;
    }

    .dashboard-masthead__utility {
        flex: 0 1 auto;
        gap: 0.6rem;
        min-width: 0;
    }

    .dashboard-masthead__player {
        gap: 0.1rem;
        min-width: 0;
    }

    .dashboard-masthead__player-body {
        gap: 0.35rem;
        width: auto;
    }

    .dashboard-masthead__identity-name {
        font-size: 0.88rem;
    }

    .dashboard-masthead__identity-meta,
    .dashboard-masthead__identity-cash,
    .dashboard-masthead__identity-signal {
        font-size: 0.72rem;
    }

    .dashboard-masthead__stats-table {
        font-size: 0.67rem;
        min-width: 6.2rem;
    }

    .dashboard-masthead__portrait {
        display: none;
    }

    .dashboard-timer-bar {
        border-top: 0;
        gap: 0.55rem;
        margin-top: 0;
        padding-top: 0.15rem;
        width: 100%;
    }

    .dashboard-masthead__lower {
        align-items: flex-start;
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }

    .dashboard-developer-messages {
        margin: 0 0 -5.5rem;
        max-width: 33vw;
        min-height: auto;
        order: -1;
        padding: 0.2rem 0.35rem 0.25rem;
        transform: translateY(-5.5rem);
        width: 33vw;
    }

    .dashboard-developer-messages__head {
        font-size: 0.56rem;
    }

    .dashboard-developer-messages__item {
        margin-top: 0.3rem;
    }

    .dashboard-developer-messages__item strong {
        font-size: 0.7rem;
    }

    .dashboard-developer-messages__item span {
        font-size: 0.64rem;
        line-height: 1.2;
    }
}

.dashboard-status-rack--masthead {
    display: flex;
    flex: 0 1 auto;
    flex-wrap: wrap;
    gap: 0.35rem;
    justify-content: flex-end;
    margin-top: 0.55rem;
    max-width: 34rem;
    overflow: visible;
    padding-bottom: 0;
}

.dashboard-strip-item--compact {
    min-width: 0;
    padding: 0.12rem 0.4rem;
    width: auto;
}

.dashboard-strip-item__inline {
    align-items: center;
    display: flex;
    gap: 0.3rem;
    margin-top: 0;
}

.dashboard-strip-item__footer {
    display: flex;
    justify-content: flex-end;
    margin-top: 0;
}

.dashboard-strip-item__scope {
    background: #293763;
    border: 1px solid #4b5888;
    border-radius: 999px;
    color: #d9deed;
    cursor: help;
    font-size: 0.58rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    padding: 0.14rem 0.42rem;
    text-transform: uppercase;
}

.dashboard-status-rack--masthead .dashboard-strip-item.dashboard-strip-item--compact {
    background: #33406f;
    flex: 0 0 auto;
    min-height: 0;
    padding: 0.62rem 0.4rem !important;
}

.dashboard-status-rack--masthead .dashboard-strip-label {
    font-size: 0.5rem;
    letter-spacing: 0.14em;
    line-height: 1;
    margin: 0;
}

.dashboard-status-rack--masthead .dashboard-strip-item__inline {
    gap: 0.28rem;
    margin-top: 0 !important;
}

.dashboard-status-rack--masthead .dashboard-strip-item__footer {
    margin-top: 0 !important;
}

.dashboard-status-rack--masthead .dashboard-strip-item__scope {
    font-size: 0.5rem;
    line-height: 1;
    padding: 0.09rem 0.32rem;
}

.dashboard-status-rack--masthead .ui-badge {
    line-height: 1;
    padding: 0.08rem 0.3rem;
}

.dashboard-status-rack--masthead .text-sm.font-semibold.text-white {
    font-size: 0.76rem;
    line-height: 1;
    margin: 0;
}

.dashboard-timer-card {
    background: transparent;
    border: 0;
    box-shadow: none;
    align-items: center;
    flex-direction: column;
    gap: 0.18rem;
    justify-content: center;
    min-width: 3.65rem;
    padding: 0;
    text-align: center;
}

.dashboard-timer-card__label,
.dashboard-timer-card__time,
.dashboard-timer-card button.dashboard-timer-card__time {
    font-family: var(--font-sans);
    font-size: 0.86rem;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1;
    text-transform: none;
}

.dashboard-timer-card__label {
    color: #f1f3f7;
    flex: none;
}

.dashboard-shell-grid {
    gap: 0.7rem;
    max-width: 1540px;
    overflow: visible;
}

.dashboard-sidebar {
    background: transparent;
    border: 0;
    box-shadow: none;
    padding: 0 !important;
}

.dashboard-sidebar--action {
    flex-basis: 4.2rem !important;
    width: 4.2rem !important;
}

.dashboard-sidebar .ui-card-muted {
    display: none;
}

.dashboard-action-rail {
    gap: 0.45rem;
    overflow: hidden;
    width: 100%;
}

.dashboard-action-rail__nav {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    overflow: hidden;
}

.dashboard-action-rail__header,
.dashboard-action-rail__footer {
    display: none;
}

.dashboard-action-button {
    display: grid;
    place-items: center;
    background: #425188;
    border: 1px solid #546391;
    border-radius: 0;
    box-shadow: none;
    gap: 0;
    min-height: 4.1rem;
    overflow: hidden;
    padding: 0;
    width: 100%;
}

.dashboard-action-button > span:last-child {
    display: none !important;
}

.dashboard-action-button:hover,
.dashboard-action-button:focus-visible {
    background: #425188;
    border-color: #546391;
    box-shadow: none;
    transform: none;
}

.dashboard-action-button:hover,
.dashboard-action-button:focus-visible {
    background: #4b578b;
    border-color: #7b88b4;
}

.dashboard-action-button.is-active {
    background: #ef5b43;
    border-color: #ef5b43;
    box-shadow: none;
    transform: none;
}

.dashboard-action-button__glyph {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 0;
    color: #f3f2f1;
    display: flex;
    font-family: var(--font-sans);
    font-size: 1rem;
    font-weight: 700;
    height: auto;
    justify-content: center;
    letter-spacing: 0;
    width: auto;
}

.dashboard-action-button__glyph svg {
    width: 1.8rem;
    height: 1.8rem;
    margin: 0 auto;
}

.dashboard-action-button__eyebrow,
.dashboard-action-button__label,
.dashboard-action-button__meta {
    display: none;
}

.dashboard-command-deck,
.dashboard-shell-body > header.ui-panel,
.city-bar,
.dashboard-stage,
.dashboard-status-panel {
    border-radius: 0;
    box-shadow: none;
}

.dashboard-command-deck,
.dashboard-shell-body > header.ui-panel,
.dashboard-stage {
    border-color: #4b5888;
}

.dashboard-command-deck {
    background: #101628;
}

.dashboard-command-card {
    background: #3b4778;
}

.city-bar {
    background: #356c57;
    border: 0;
    min-height: 1.5rem;
    padding: 0.25rem 1rem !important;
    text-align: center;
}

.city-bar__current {
    color: #f5f7f9;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 1;
    text-transform: none;
}

.city-chip {
    background: #425188;
    border-radius: 0;
    min-height: auto;
    padding: 0.35rem 0.7rem;
}

.city-chip.is-active {
    background: #101628;
    box-shadow: none;
}

.city-chip__label {
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
}

.dashboard-shell-body > header.ui-panel {
    background: #0b1021;
}

.dashboard-shell-body > header .ui-label {
    display: none;
}

.dashboard-shell-body > header .ui-title {
    font-size: clamp(2rem, 3vw, 2.9rem);
}

.dashboard-shell-body > header [data-shell-panel-subtitle] {
    color: #d7dbeb;
    margin-inline: auto;
    max-width: 42rem;
    text-align: center;
}

    .dashboard-stage {
        background: #080d1b;
        box-shadow: none;
        min-height: 32rem;
        overflow: hidden;
        padding: 1rem;
    }

    @media (max-width: 767px) {
        .dashboard-shell-body > header.ui-panel {
            padding: 0.45rem 0.7rem !important;
        }

        .dashboard-shell-body > header.ui-panel > div {
            align-items: center;
            display: grid;
            gap: 0.55rem;
            grid-template-columns: auto minmax(0, 1fr);
        }

        .dashboard-shell-body > header .ui-label {
            display: block;
            font-size: 0.62rem;
            white-space: nowrap;
        }

        .dashboard-shell-body > header .ui-title {
            font-size: 1.25rem;
            margin: 0;
        }

        .dashboard-shell-body > header [data-shell-panel-subtitle] {
            display: none;
        }
    }

    .dashboard-stage table {
    border-collapse: collapse;
    width: 100%;
}

.dashboard-stage thead th {
    background: #445181;
    color: #f3f4f7;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0;
    padding: 0.35rem 0.45rem;
    text-align: left;
}

.dashboard-stage tbody td {
    background: #333f6e;
    border-top: 1px solid #425180;
    color: #ffffff;
    font-size: 0.9rem;
    padding: 0.35rem 0.45rem;
}

.dashboard-stage tbody tr:nth-child(even) td {
    background: #3c4777;
}

.dashboard-status-rail {
    gap: 0.55rem;
}

.dashboard-status-panel {
    background: #313c6a;
    border-color: #4b5888;
}

.dashboard-compact-stat-panel {
    padding: 0.45rem 0.55rem !important;
    text-align: center;
}

.dashboard-compact-stat__label {
    color: #49df66;
    font-size: 0.82rem;
    font-weight: 700;
    line-height: 1;
}

.dashboard-compact-stat__value {
    background: #080d1b;
    border: 1px solid #1c264d;
    color: #ffffff;
    font-size: 0.88rem;
    font-weight: 700;
    line-height: 1.15;
    margin-top: 0.18rem;
    padding: 0.16rem 0.35rem;
}

.dashboard-status-identity {
    align-items: flex-start;
    display: flex;
    gap: 0.75rem;
}

.dashboard-status-portrait {
    flex-shrink: 0;
    height: 4.75rem;
}

.dashboard-status-grid {
    gap: 0.45rem;
    grid-template-columns: minmax(0, 1fr);
}

.dashboard-status-metric {
    background: #0b1021;
}

.dashboard-status-metric__label,
.dashboard-status-marker__label {
    color: #8adb79;
    letter-spacing: 0;
}

.dashboard-status-metric__value {
    font-family: var(--font-sans);
    font-size: 1.1rem;
    letter-spacing: 0;
}

.dashboard-status-progress__track {
    background: #0b1021;
    border-color: #4b5888;
}

.dashboard-online-head {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.dashboard-online-toggle {
    align-items: center;
    color: #f0f2f7;
    cursor: pointer;
    display: inline-flex;
    font-size: 0.78rem;
    font-weight: 700;
    gap: 0.35rem;
    margin-top: 0.35rem;
}

.dashboard-online-toggle input {
    accent-color: #f3f4f7;
}

.dashboard-online-list {
    background: #313c6a;
    border: 1px solid #4b5888;
    margin-top: 0.55rem;
}

.dashboard-online-player {
    background: var(--online-player-color, #3498db);
    border-bottom: 1px solid rgba(11, 16, 33, 0.28);
    color: #ffffff;
    font-size: 0.85rem;
    font-weight: 700;
    line-height: 1.15;
    padding: 0.34rem 0.55rem;
}

.dashboard-online-player--blue {
    background: #3f8fd7;
}

.dashboard-online-player--green {
    background: #35a85c;
}

.dashboard-online-player--yellow {
    background: #c5a62e;
    color: #111826;
}

.dashboard-online-player--orange {
    background: #d87926;
}

.dashboard-online-player--red,
.dashboard-online-player--critical {
    background: #d9483b;
}

.dashboard-online-player--critical {
    animation: heat-critical-pulse 900ms ease-in-out infinite;
}

@keyframes heat-critical-pulse {
    0%, 100% {
        background: #d9483b;
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
    }
    50% {
        background: #ff2418;
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.34), 0 0 10px rgba(255, 36, 24, 0.55);
    }
}

.dashboard-online-player em {
    color: rgba(255, 255, 255, 0.72);
    font-style: normal;
}

.dashboard-online-empty {
    color: #c8d0eb;
    font-size: 0.78rem;
    padding: 0.45rem 0.55rem;
}

.dashboard-city-services {
    border-top: 1px solid #4b5888;
    margin-top: 0.85rem;
    padding-top: 0.75rem;
}

.dashboard-city-service-group {
    background: #222b50;
    border: 1px solid #4b5888;
    margin-top: 0.55rem;
}

.dashboard-city-service-label {
    color: #8de37f;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    padding: 0.4rem 0.55rem 0.28rem;
    text-transform: uppercase;
}

.dashboard-city-service {
    align-items: center;
    border-top: 1px solid rgba(75, 88, 136, 0.65);
    color: #ffffff;
    display: flex;
    font-size: 0.78rem;
    font-weight: 700;
    gap: 0.5rem;
    justify-content: space-between;
    padding: 0.38rem 0.55rem;
}

.dashboard-city-service small {
    color: #c8d0eb;
    font-size: 0.64rem;
    font-weight: 600;
    text-align: right;
}

.dashboard-status-player {
    background: #4a86cc;
    border: 1px solid #68a0e0;
    padding: 0.45rem 0.7rem;
}

.dashboard-status-player .ui-badge,
.dashboard-status-chip {
    color: #ffffff;
}

.auth-legacy__backdrop,
.auth-legacy__veil {
    inset: 0;
    position: absolute;
}

.auth-legacy__backdrop {
    background:
        radial-gradient(circle at top, rgba(255, 255, 255, 0.08), transparent 32%),
        linear-gradient(180deg, rgba(72, 86, 150, 0.94) 0%, rgba(58, 69, 124, 0.97) 52%, rgba(18, 22, 43, 1) 100%);
}

.auth-legacy__veil {
    background: linear-gradient(180deg, rgba(8, 14, 34, 0.1), rgba(8, 14, 34, 0.32));
}

.auth-legacy__inner {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    min-height: 100vh;
    padding: 2.4rem 1rem 1.5rem;
    position: relative;
}

.auth-legacy__brand {
    color: #ffffff;
    text-align: center;
}

.public-lobby-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    justify-content: center;
    margin-top: 1rem;
    max-width: min(72rem, calc(100vw - 2rem));
}

.public-lobby-nav__link {
    background: rgba(8, 14, 34, 0.52);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 999px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    padding: 0.65rem 1rem;
    text-transform: uppercase;
    transition: background-color 140ms ease, border-color 140ms ease, color 140ms ease;
}

.public-lobby-nav__link:hover,
.public-lobby-nav__link:focus-visible,
.public-lobby-nav__link.is-active {
    background: rgba(239, 98, 77, 0.2);
    border-color: rgba(239, 98, 77, 0.42);
    color: #ffffff;
    outline: none;
}

.auth-legacy__brand-mark {
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(2.4rem, 5vw, 4.25rem);
    letter-spacing: 0.12em;
    line-height: 1;
    margin: 0;
    text-transform: uppercase;
}

.auth-legacy__brand-mark span {
    color: #ef624d;
}

.auth-legacy__brand-subtitle {
    color: rgba(255, 255, 255, 0.88);
    font-size: 0.88rem;
    letter-spacing: 0.06em;
    margin-top: 0.65rem;
    text-transform: uppercase;
}

.auth-legacy__panel {
    margin-top: 1.4rem;
    width: min(22rem, calc(100vw - 2rem));
}

.auth-legacy__copy {
    color: #f5f5f5;
    font-size: 0.92rem;
    margin-bottom: 0.9rem;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
}

.auth-legacy .ui-label,
.auth-legacy .ui-input-label {
    display: none;
}

.auth-legacy .ui-panel {
    background: rgba(8, 14, 34, 0.78);
    border-color: rgba(255, 255, 255, 0.14);
}

.auth-legacy .ui-input {
    background: rgba(248, 248, 248, 0.96) !important;
    border-color: rgba(32, 37, 58, 0.52) !important;
    color: #111827 !important;
    font-size: 1rem;
    min-height: 3rem;
}

.auth-legacy .ui-link {
    color: #ffffff;
    letter-spacing: 0;
    text-transform: none;
}

.auth-legacy .ui-button,
.auth-legacy .ui-button-primary,
.auth-legacy .ui-button-secondary,
.auth-legacy .ui-button-ghost {
    background: linear-gradient(180deg, #f7f7f7, #d7d7d7) !important;
    border-color: rgba(33, 38, 58, 0.5) !important;
    color: #1e2438 !important;
    min-height: 3rem;
}

.auth-legacy .ui-button-danger {
    background: #ef5b43 !important;
    border-color: #d84d37 !important;
    color: #ffffff !important;
}

.public-lobby-stack {
    display: grid;
    gap: 1rem;
}

.public-lobby-hero,
.public-lobby-section {
    background: rgba(8, 14, 34, 0.76);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 1.5rem;
    box-shadow: 0 24px 60px rgba(3, 7, 18, 0.3);
    padding: 1.25rem;
}

.public-lobby-grid {
    display: grid;
    gap: 1rem;
}

.public-lobby-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.public-lobby-badge {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 999px;
    color: rgba(255, 255, 255, 0.88);
    display: inline-flex;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    padding: 0.35rem 0.7rem;
    text-transform: uppercase;
}

@media (min-width: 768px) {
    .public-lobby-grid--two {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.npc-log-panel {
    display: flex;
    flex-direction: column;
    max-height: none;
    min-height: 0;
}

.npc-log-list {
    flex: 1 1 auto;
    min-height: 14rem;
    overflow-y: auto;
}

.town-centre-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.city-pulse-intro {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
}

.city-pulse-table-wrap {
    display: grid;
    gap: 0.75rem;
}

.city-pulse-table-wrap__table {
    border: 1px solid rgba(73, 190, 120, 0.16);
    border-radius: 0.4rem;
    overflow: hidden;
}

.city-pulse-table {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    text-align: left;
    font-size: 0.96rem;
}

.city-pulse-table thead th {
    color: var(--color-mist);
    font-size: 0.78rem;
    letter-spacing: 0.09em;
    line-height: 1;
    padding: 0.45rem 0.45rem 0.4rem;
    text-transform: uppercase;
    vertical-align: top;
}

.city-pulse-table th,
.city-pulse-table td {
    padding: 0.45rem 0.5rem;
    overflow-wrap: anywhere;
    vertical-align: top;
}

.city-pulse-table th,
.city-pulse-table td,
.city-pulse-table tbody tr + tr td {
    border-top: 1px solid rgba(124, 137, 152, 0.14);
}

.city-pulse-table__value {
    color: #fff;
    font-size: 0.93rem;
    font-weight: 600;
    line-height: 1.25;
}

.city-pulse-table__sub {
    color: var(--color-mist);
    font-size: 0.77rem;
    line-height: 1.2;
    margin-top: 0.2rem;
}

.city-pulse-table__heading {
    color: var(--color-mist);
    display: block;
    font-size: 0.81rem;
    letter-spacing: 0.08em;
    margin: 0.2rem 0.6rem;
    text-transform: uppercase;
}

.city-pulse-mobile-list,
.city-pulse-table-medium,
.city-pulse-table-wide {
    display: none;
}

.city-pulse-mobile-group {
    border: 1px solid rgba(124, 137, 152, 0.12);
    border-radius: 0.45rem;
    margin-top: 0.5rem;
    padding: 0.55rem 0.6rem 0.55rem;
}

.city-pulse-mobile__heading {
    color: #9ab0c1;
    font-size: 0.68rem;
    letter-spacing: 0.08em;
    margin: 0 0 0.4rem;
    text-transform: uppercase;
}

.city-pulse-mobile-row {
    display: grid;
    gap: 0.08rem 0.45rem;
    grid-template-columns: 7.5rem 1fr;
    align-items: baseline;
}

.city-pulse-mobile__label {
    color: var(--color-mist);
    font-size: 0.82rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.city-pulse-mobile__value,
.city-pulse-mobile__sub {
    color: #fff;
    font-size: 0.93rem;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.city-pulse-mobile__sub {
    color: var(--color-mist);
    grid-column: 2;
    font-size: 0.82rem;
    margin-top: -0.1rem;
}

.city-pulse-table-badges {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    justify-content: flex-end;
}

.city-pulse-table-badges__subtext {
    color: var(--color-mist);
    font-size: 0.68rem;
    margin: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
}

@media (min-width: 768px) {
    .city-pulse-mobile-list,
    .city-pulse-table-wide {
        display: none;
    }

    .city-pulse-table-medium {
        display: grid;
        gap: 0.75rem;
    }
}

@media (min-width: 1024px) {
    .city-pulse-table-medium,
    .city-pulse-mobile-list {
        display: none;
    }

    .city-pulse-table-wide {
        display: block;
    }
}

@media (max-width: 767px) {
    .city-pulse-mobile-list {
        display: block;
    }

    .city-pulse-table-medium,
    .city-pulse-table-wide {
        display: none;
    }

    .city-pulse-table-medium .city-pulse-table__heading {
        display: none;
    }
}

@media (max-width: 430px) {
    .city-pulse-mobile-row {
        grid-template-columns: 1fr;
        row-gap: 0.02rem;
    }

    .city-pulse-mobile__label {
        text-transform: none;
    }
}

.parkour-panel {
    display: grid;
    gap: 1rem;
}

.parkour-panel__meta {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.parkour-panel__action {
    max-width: 100%;
}

.parkour-panel {
    grid-template-columns: minmax(0, 1fr) minmax(14rem, 20rem);
    align-items: start;
}

.parkour-panel__notes {
    grid-column: 2;
}

.parkour-panel__action {
    grid-column: 1 / -1;
    justify-self: center;
    align-self: end;
    width: min(100%, 21rem);
}

@media (max-width: 639px) {
    .parkour-panel {
        grid-template-columns: minmax(0, 1fr) minmax(10rem, 12rem);
        gap: 0.85rem;
    }

    .parkour-panel__meta {
        gap: 0.65rem;
    }
}

.town-centre-tile {
    display: flex;
    min-height: 9rem;
    width: 100%;
    flex-direction: column;
    border: 1px solid rgba(134, 151, 205, 0.55);
    background: rgba(7, 12, 28, 0.72);
    padding: 1rem;
    color: #fff;
    text-align: left;
    transition: border-color 140ms ease, background 140ms ease, transform 140ms ease;
}

.town-centre-tile:hover,
.town-centre-tile:focus-visible {
    border-color: var(--color-gold);
    background: rgba(15, 25, 50, 0.92);
    outline: none;
    transform: translateY(-1px);
}

.town-centre-tile--locked {
    cursor: not-allowed;
    opacity: 0.82;
}

.town-centre-tile--locked:hover,
.town-centre-tile--locked:focus-visible {
    border-color: rgba(134, 151, 205, 0.55);
    background: rgba(7, 12, 28, 0.72);
    transform: none;
}

.town-centre-tile__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.town-centre-tile__title {
    font-size: 1.1rem;
    font-weight: 800;
    line-height: 1.15;
}

.town-centre-tile__status {
    flex-shrink: 0;
    border: 1px solid rgba(134, 151, 205, 0.4);
    background: rgba(38, 52, 95, 0.6);
    color: var(--color-ice);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    line-height: 1;
    padding: 0.35rem 0.5rem;
    text-transform: uppercase;
}

.town-centre-tile__owner {
    margin-top: 0.35rem;
    color: var(--color-mist);
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1.25;
}

.town-centre-tile__label {
    margin-top: 0.35rem;
    color: var(--color-acid);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.town-centre-tile__description {
    margin-top: 0.85rem;
    color: var(--color-mist);
    font-size: 0.88rem;
    line-height: 1.5;
}

.town-centre-tile__meta {
    margin-top: auto;
    padding-top: 0.9rem;
    color: var(--color-gold);
    font-size: 0.78rem;
    font-weight: 800;
}

.night-class-panel {
    padding: 0.9rem !important;
}

.night-class-status-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr));
    gap: 0.7rem;
}

.night-class-stat {
    padding: 0.65rem 0.75rem !important;
}

.night-class-stat__value {
    margin-top: 0.35rem;
}

.night-class-question {
    margin-top: 0.75rem;
    padding: 0.8rem !important;
}

.night-class-question__prompt {
    margin-top: 0.4rem;
    line-height: 1.25;
}

.night-class-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.night-class-pill {
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 999px;
    padding: 0.28rem 0.75rem;
    color: var(--color-mist);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.night-class-answer-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
    margin-top: 0.8rem;
}

.night-class-answer {
    width: 100%;
    min-height: 4.5rem;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0.75rem;
    padding: 0.9rem 1rem;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 0.35rem;
    background: rgba(0, 0, 0, 0.2);
    color: white;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease, opacity 0.15s ease;
}

.night-class-answer:hover,
.night-class-answer:focus-visible {
    border-color: rgba(111, 255, 134, 0.45);
    background: rgba(57, 85, 159, 0.18);
    outline: 2px solid transparent;
}

.night-class-answer:focus-visible {
    box-shadow: 0 0 0 3px rgba(111, 255, 134, 0.22);
}

.night-class-answer:disabled {
    cursor: wait;
    opacity: 0.55;
}

.night-class-answer__letter {
    color: var(--color-acid);
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.night-class-answer__text {
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.dashboard-admin-adjustments {
    display: grid;
    gap: 0.4rem;
    margin-top: 0.75rem;
}

.dashboard-admin-adjustment {
    display: grid;
    grid-template-columns: 2.15rem minmax(0, 1fr) 2.15rem;
    align-items: center;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(57, 85, 159, 0.75);
}

.dashboard-admin-adjustment span {
    color: #fff;
    font-size: 0.74rem;
    font-weight: 800;
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
}

.dashboard-admin-adjustment__button {
    display: grid;
    min-height: 2.25rem;
    width: 100%;
    place-items: center;
    border: 0;
    background: rgba(11, 16, 34, 0.2);
    color: #fff;
    cursor: pointer;
    font-size: 1rem;
    font-weight: 900;
    line-height: 1;
}

.dashboard-admin-adjustment__button:hover,
.dashboard-admin-adjustment__button:focus-visible {
    background: rgba(111, 255, 134, 0.22);
    outline: none;
}

.dashboard-admin-adjustment__button:disabled {
    cursor: wait;
    opacity: 0.6;
}

.dashboard-admin-adjustments__status {
    margin-top: 0.45rem;
    color: var(--color-acid);
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1.3;
}

.dashboard-admin-adjustments__status.is-error {
    color: #ff8b7d;
}

.politics-penalty-table-wrap {
    max-width: 100%;
    overflow-x: auto;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 1rem;
    background: rgba(5, 10, 17, 0.58);
}

.politics-penalty-table {
    width: 100%;
    min-width: 42rem;
    border-collapse: collapse;
}

.politics-penalty-table th,
.politics-penalty-table td {
    padding: 0.8rem 0.9rem;
    text-align: left;
    vertical-align: middle;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.politics-penalty-table thead th {
    color: var(--color-mist);
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    white-space: nowrap;
    background: rgba(12, 20, 33, 0.9);
}

.politics-penalty-table tbody tr:last-child td {
    border-bottom: 0;
}

.politics-penalty-table__crime-name {
    color: white;
    font-size: 0.88rem;
    font-weight: 700;
    line-height: 1.3;
}

.politics-penalty-table__crime {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem;
}

.politics-penalty-table__field {
    display: block;
}

.politics-penalty-table__field-label {
    display: none;
}

.politics-penalty-table__input {
    width: min(100%, 10rem);
    min-width: 7.5rem;
    padding: 0.7rem 0.85rem;
}

.politics-penalty-table__input--compact {
    width: min(100%, 8rem);
    min-width: 6.25rem;
    padding: 0.55rem 0.7rem;
}

.politics-penalty-table__save-cell {
    width: 1%;
    white-space: nowrap;
}

.politics-penalty-table--compact th,
.politics-penalty-table--compact td {
    padding-top: 0.7rem;
    padding-bottom: 0.7rem;
}

.politics-error-popup {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    z-index: 140;
    width: min(26rem, calc(100vw - 2rem));
    max-width: 100%;
}

.politics-error-popup[hidden] {
    display: none !important;
}

.politics-error-popup__panel {
    padding: 1rem;
    border-color: rgba(200, 90, 94, 0.55);
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.48), 0 0 0 1px rgba(200, 90, 94, 0.12);
}

.politics-error-popup__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

.politics-error-popup__eyebrow {
    color: #ffb2b4;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.politics-error-popup__title {
    margin-top: 0.2rem;
    color: white;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.politics-error-popup__close {
    border: 0;
    background: transparent;
    color: var(--color-ink-soft);
    cursor: pointer;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    padding: 0.15rem 0;
    text-transform: uppercase;
}

.politics-error-popup__close:hover,
.politics-error-popup__close:focus-visible {
    color: white;
    outline: none;
}

.politics-error-popup__body {
    margin-top: 0.8rem;
    color: #ffd3d4;
    font-size: 0.9rem;
    line-height: 1.5;
}

.politics-error-popup__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 1rem;
}

@media (max-width: 767px) {
    .politics-penalty-table {
        min-width: 36rem;
    }

    .politics-penalty-table th,
    .politics-penalty-table td {
        padding: 0.72rem 0.75rem;
    }

    .politics-penalty-table__input {
        width: 8.5rem;
    }

    .politics-penalty-table__input--compact {
        width: 7rem;
        min-width: 7rem;
    }

    .politics-error-popup {
        right: 0.75rem;
        left: 0.75rem;
        bottom: calc(5.25rem + env(safe-area-inset-bottom));
        width: auto;
    }
}

@media (min-width: 1024px) {
    .dashboard-shell-grid {
        display: grid !important;
        grid-template-columns: 56px minmax(0, 1fr) 13.25rem;
    }

    .dashboard-sidebar-desktop {
        align-self: stretch;
        background: #313b6a;
        border: 1px solid rgba(84, 99, 145, 0.5);
        box-shadow: none;
        display: flex !important;
        flex-direction: column;
        grid-column: 1;
        min-height: 100%;
        padding: 6px !important;
        width: 56px !important;
    }
    .dashboard-action-rail,
    .dashboard-action-rail__nav,
    .dashboard-action-button,
    .dashboard-action-button__glyph {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    .dashboard-sidebar-desktop .dashboard-action-rail,
    .dashboard-sidebar-desktop .dashboard-action-rail__nav {
        align-items: center;
        gap: 8px;
        height: 100%;
        overflow: hidden;
    }

    .dashboard-sidebar-desktop .dashboard-action-rail {
        flex: 1 1 auto;
    }

    .dashboard-sidebar-desktop .dashboard-action-rail__header,
    .dashboard-sidebar-desktop .dashboard-action-rail__footer,
    .dashboard-sidebar-desktop .dashboard-action-button > span:last-child,
    .dashboard-sidebar-desktop .dashboard-action-button__eyebrow,
    .dashboard-sidebar-desktop .dashboard-action-button__label,
    .dashboard-sidebar-desktop .dashboard-action-button__meta {
        display: none !important;
    }

    .dashboard-sidebar-desktop .dashboard-action-button {
        aspect-ratio: 1 / 1;
        align-items: center;
        background: #425188;
        border: 1px solid #546391;
        border-radius: 0;
        box-shadow: none;
        display: grid !important;
        flex: 0 0 44px;
        gap: 0;
        height: 44px;
        justify-content: center;
        min-height: 0;
        max-width: none;
        padding: 0;
        place-items: center;
        width: 44px;
    }

    .dashboard-sidebar-desktop .dashboard-action-button.is-active {
        background: #ef5b43;
        border-color: #ef5b43;
    }

    .dashboard-sidebar-desktop .dashboard-action-button__glyph {
        align-items: center;
        display: flex !important;
        height: auto;
        justify-content: center;
        width: auto;
    }

    .dashboard-sidebar-desktop .dashboard-action-button__glyph svg {
        height: 1.55rem;
        width: 1.55rem;
    }
}

@media (min-width: 1024px) {
    .dashboard-shell {
        --dashboard-masthead-height: calc(6.45rem - 80px);
        --dashboard-desktop-header-offset: 15rem;
    }

    .dashboard-masthead {
        padding-bottom: 8px !important;
        padding-top: 33px !important;
        position: sticky;
        top: 0;
        z-index: 80;
    }

    .dashboard-frame {
        height: auto;
        overflow: visible;
        padding-top: calc(var(--dashboard-desktop-header-offset) + 0.45rem);
    }

    .dashboard-masthead__row {
        align-items: center;
        display: grid;
        gap: 1rem;
        grid-template-columns: max-content minmax(0, 1fr) max-content;
        position: relative;
        top: -40px;
    }

    .dashboard-masthead__actions {
        justify-content: flex-start;
        justify-self: start;
        min-width: 0;
    }

    .dashboard-masthead__utility {
        position: relative;
        top: 20px;
    }

    .dashboard-masthead__lower {
        margin-bottom: -80px;
        padding-right: 20rem;
        position: relative;
        top: -80px;
    }

    .dashboard-shell-grid {
        gap: 0;
        height: auto;
        padding-top: 0;
        grid-template-columns: 56px minmax(0, 1fr) 13.25rem;
    }

    .dashboard-shell-grid > .dashboard-sidebar {
        display: none !important;
    }

    .dashboard-shell-body,
    .dashboard-shell-body > main,
    .dashboard-stage {
        overflow: visible;
    }

    .dashboard-shell-body {
        grid-column: 2;
        padding-left: 0;
    }

    .dashboard-status-rail {
        grid-column: 3;
    }
}

@media (max-width: 1023px) {
    .dashboard-overlay {
        background: rgba(2, 6, 12, 0.72);
        bottom: 0;
        display: none;
        left: 0;
        position: fixed;
        right: 0;
        top: 0;
        z-index: 85;
    }

    .dashboard-shell[data-shell-state='open'] .dashboard-overlay,
    .dashboard-shell[data-shell-status-state='open'] .dashboard-overlay {
        display: block;
    }

    .dashboard-shell-grid {
        display: block;
        max-width: 100%;
        overflow: visible;
        width: 100%;
    }

    .dashboard-shell-grid > .dashboard-sidebar,
    .dashboard-status-rail {
        bottom: 0;
        max-height: 100vh;
        overflow-y: auto;
        position: fixed !important;
        top: 0;
        width: min(20rem, calc(100vw - 2rem));
        z-index: 95;
    }

    .dashboard-shell-grid > .dashboard-sidebar {
        left: 0;
        transform: translateX(-105%);
        transition: transform var(--ui-motion-standard);
    }

    .dashboard-shell[data-shell-state='open'] .dashboard-shell-grid > .dashboard-sidebar {
        transform: translateX(0);
    }

    .dashboard-status-rail {
        display: block;
        padding: 0.75rem;
        right: 0;
        transform: translateX(105%);
        transition: transform var(--ui-motion-standard);
    }

    .dashboard-shell[data-shell-status-state='open'] .dashboard-status-rail {
        transform: translateX(0);
    }

    .dashboard-shell-grid > .dashboard-sidebar.dashboard-sidebar--action {
        background: #313b6a;
        flex-basis: auto !important;
        padding: 0.75rem !important;
        width: clamp(16rem, 72vw, 22rem) !important;
    }

    .dashboard-shell-grid > .dashboard-sidebar .dashboard-action-rail,
    .dashboard-shell-grid > .dashboard-sidebar .dashboard-action-rail__nav {
        overflow: visible;
    }

    .dashboard-shell-grid > .dashboard-sidebar .dashboard-action-button {
        align-items: center;
        display: flex;
        gap: 0.7rem;
        justify-content: flex-start;
        min-height: 3.15rem;
        overflow: visible;
        padding: 0.55rem 0.7rem;
        text-align: left;
    }

    .dashboard-shell-grid > .dashboard-sidebar .dashboard-action-button__copy {
        display: flex !important;
        flex: 1 1 auto;
        flex-direction: column;
        gap: 0.12rem;
        min-width: 0;
        overflow: visible;
    }

    .dashboard-shell-grid > .dashboard-sidebar .dashboard-action-button > span:last-child,
    .dashboard-shell-grid > .dashboard-sidebar .dashboard-action-button__label {
        display: block !important;
    }

    .dashboard-shell-grid > .dashboard-sidebar .dashboard-action-button__eyebrow,
    .dashboard-shell-grid > .dashboard-sidebar .dashboard-action-button__meta {
        display: none !important;
    }

    .dashboard-shell-grid > .dashboard-sidebar .dashboard-action-button__label {
        color: #ffffff !important;
        font-size: 0.82rem;
        letter-spacing: 0.08em;
        line-height: 1.2;
        margin-top: 0;
        overflow-wrap: anywhere;
        text-transform: uppercase;
        white-space: normal;
    }

    .dashboard-shell-grid > .dashboard-sidebar .dashboard-action-button__glyph {
        flex: 0 0 2.2rem;
        height: 2.2rem;
        width: 2.2rem;
    }

    .dashboard-shell-grid > .dashboard-sidebar .dashboard-action-button__glyph svg {
        height: 1.35rem;
        width: 1.35rem;
    }

    .dashboard-shell-body,
    .dashboard-shell-body > main {
        max-width: 100%;
        width: 100%;
    }

    .town-centre-grid {
        grid-template-columns: 1fr;
    }

    .city-bar {
        min-height: 1.5rem;
        padding: 0.32rem 0.75rem !important;
    }

    .city-bar__current {
        font-size: 1.4rem;
        line-height: 1;
    }

.night-class-status-grid,
.night-class-answer-grid {
    grid-template-columns: 1fr;
}

    .dashboard-shell {
        --dashboard-masthead-height: 12.8rem;
    }

    .dashboard-frame {
        padding-bottom: 0;
    }

    .dashboard-shell-grid,
    .dashboard-shell-body,
    #dashboard-content {
        padding-bottom: 0;
    }

    .dashboard-stage:last-child {
        margin-bottom: calc(4.75rem + env(safe-area-inset-bottom));
    }

    .dashboard-mobile-bar {
        background: #26345f;
        border-radius: 0;
        border-top: 1px solid rgba(147, 197, 253, 0.4);
        bottom: 0;
        box-sizing: border-box;
        left: 0;
        padding: 0.5rem 0.5rem max(env(safe-area-inset-bottom), 0px);
        position: fixed !important;
        right: 0;
        top: auto !important;
        width: 100%;
        z-index: 9999;
    }

    .dashboard-mobile-bar__inner {
        background: transparent;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 0.35rem;
        margin: 0;
        max-width: none;
        overflow: visible;
        padding: 0;
        width: 100%;
    }

    .dashboard-mobile-control {
        align-items: center;
        display: flex;
        flex-direction: column;
        gap: 0.16rem;
        justify-content: center;
        min-height: 3.25rem;
        min-width: 0;
        padding: 0.35rem 0.2rem;
        text-align: center;
        white-space: nowrap;
        width: 100%;
    }

    .dashboard-mobile-control.is-active {
        background: var(--color-danger);
        color: white;
    }

    .dashboard-mobile-control__icon {
        display: block;
        height: 1.15rem;
        width: 1.15rem;
    }

    .dashboard-mobile-control__icon svg {
        height: 100%;
        width: 100%;
    }

    .dashboard-mobile-more {
        bottom: calc(4.65rem + env(safe-area-inset-bottom));
        left: 0.45rem;
        right: 0.45rem;
        max-width: 34rem;
        margin: 0 auto;
        position: fixed;
        border: 1px solid rgba(49, 70, 95, 0.78);
        background: rgba(5, 10, 17, 0.98);
        padding: 0.6rem;
        box-shadow: var(--shadow-raised);
        z-index: 89;
    }

    .dashboard-mobile-more[hidden] {
        display: none !important;
    }

    .dashboard-mobile-more__head {
        align-items: center;
        color: var(--color-acid);
        display: flex;
        font-size: 0.68rem;
        font-weight: 800;
        justify-content: space-between;
        letter-spacing: 0.12em;
        margin-bottom: 0.5rem;
        text-transform: uppercase;
    }

    .dashboard-mobile-more__head button {
        color: white;
        font-size: 0.68rem;
        letter-spacing: 0;
        text-transform: none;
    }

    .dashboard-mobile-player-card {
        background: rgba(13, 20, 36, 0.96);
        border: 1px solid rgba(180, 196, 240, 0.16);
        border-radius: 1rem;
        margin-bottom: 0.55rem;
        min-width: 0;
        overflow: hidden;
        padding: 0.7rem;
    }

    .dashboard-mobile-player-card--prison {
        background: rgba(78, 83, 95, 0.96);
        border-color: rgba(217, 222, 232, 0.22);
    }

    .dashboard-mobile-player-card__top {
        align-items: flex-start;
        display: flex;
        gap: 0.7rem;
        justify-content: space-between;
        min-width: 0;
    }

    .dashboard-mobile-player-card__identity {
        flex: 1 1 auto;
        min-width: 0;
        text-align: left;
    }

    .dashboard-mobile-player-card__portrait {
        flex: 0 0 auto;
        height: 3.7rem;
        width: 3.7rem;
    }

    .dashboard-mobile-player-card__stats {
        font-size: 0.68rem;
        margin-top: 0.6rem;
        min-width: 0;
        table-layout: fixed;
        width: 100%;
    }

    .dashboard-mobile-player-card__stats th,
    .dashboard-mobile-player-card__stats td {
        padding-bottom: 0.16rem;
        padding-top: 0.16rem;
    }

    .dashboard-mobile-player-card__stats th {
        width: 2.65rem;
    }

    .dashboard-mobile-more__grid {
        display: grid;
        gap: 0.45rem;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-mobile-service {
        align-items: center;
        background: rgba(78, 101, 159, 0.75);
        border: 1px solid rgba(180, 196, 240, 0.18);
        color: white;
        display: flex;
        font-size: 0.76rem;
        font-weight: 800;
        justify-content: center;
        line-height: 1.2;
        min-height: 2.35rem;
        overflow-wrap: anywhere;
        padding: 0.55rem;
        text-align: center;
    }

    .dashboard-mobile-service.is-active {
        background: var(--color-danger);
    }

    .dashboard-masthead__actions,
    .dashboard-masthead__utility {
        display: none !important;
    }

    .dashboard-masthead__row {
        display: block;
    }

    .dashboard-masthead__lower {
        gap: 0.45rem;
    }

    .dashboard-developer-messages {
        margin: 0;
        max-width: 100%;
        order: 0;
        transform: none;
        width: 100%;
    }

    .dashboard-masthead__utility {
        justify-content: space-between;
    }

    .dashboard-stage {
        padding: 0.7rem 0.2rem;
    }

    .mobile-inline-summary {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 0;
        padding: 0.45rem 0.35rem !important;
    }

    .mobile-inline-summary > div {
        min-width: 0;
        padding: 0 0.25rem;
    }

    .mobile-inline-summary p:first-child {
        font-size: 0.58rem;
        letter-spacing: 0.03em;
        line-height: 1.1;
    }

    .mobile-inline-summary p + p {
        margin-top: 0.2rem;
        font-size: 0.78rem;
        line-height: 1.15;
        overflow-wrap: anywhere;
    }

.dashboard-stage :where(.earn-board__table-wrap, [class~="overflow-x-auto"]) {
    margin-left: -1rem;
    margin-right: -1rem;
    max-width: calc(100% + 2rem);
    overflow-x: hidden !important;
    }

    .dashboard-stage table {
        table-layout: fixed;
        width: 100%;
    }

    .dashboard-stage th,
    .dashboard-stage td {
        overflow-wrap: anywhere;
        padding-left: 0.32rem;
        padding-right: 0.32rem;
        vertical-align: top;
    }

    .earn-board__table th,
    .earn-board__table td {
        padding: 0.42rem 0.32rem;
    }

    .earn-board__table th {
        font-size: 0.58rem;
        letter-spacing: 0.04em;
    }

    .earn-board__table th:nth-child(1),
    .earn-board__table td:nth-child(1) {
        width: 41%;
    }

    .earn-board__table th:nth-child(2),
    .earn-board__table td:nth-child(2) {
        width: 25%;
    }

    .earn-board__table th:nth-child(3),
    .earn-board__table td:nth-child(3) {
        width: 13%;
    }

.earn-board__table th:nth-child(4),
.earn-board__table td:nth-child(4) {
    width: 21%;
}

.crime-board__table {
    table-layout: fixed;
}

.crime-board__table-wrap {
    overflow-x: auto;
}

.dashboard-stage .crime-table-scroll,
.dashboard-stage .crime-board__table-wrap {
    margin-left: 0;
    margin-right: 0;
    max-width: 100%;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
}

.crime-board__table th,
.crime-board__table td {
    padding: 0.75rem 0.8rem;
}

.crime-board__table th:nth-child(1),
.crime-board__table td:nth-child(1) {
    width: 7%;
}

.crime-board__table th:nth-child(2),
.crime-board__table td:nth-child(2) {
    width: 24%;
}

.crime-board__table th:nth-child(3),
.crime-board__table td:nth-child(3) {
    width: 16%;
}

.crime-board__table th:nth-child(4),
.crime-board__table td:nth-child(4) {
    width: 8%;
}

.crime-board__table th:nth-child(5),
.crime-board__table td:nth-child(5) {
    width: 14%;
}

.crime-board__table th:nth-child(6),
.crime-board__table td:nth-child(6) {
    width: 13%;
}

.crime-board__table th:nth-child(7),
.crime-board__table td:nth-child(7) {
    width: 7%;
}

.crime-board__table th:nth-child(8),
.crime-board__table td:nth-child(8) {
    width: 11%;
}

.crime-board__table td {
    font-size: 0.82rem;
    line-height: 1.2rem;
}

.crime-board__table small {
    display: block;
    margin-top: 0.22rem;
    font-size: 0.74rem;
    line-height: 1rem;
}

@media (max-width: 767px) {
    .crime-board__table {
        min-width: 760px;
    }

    .crime-stats-table {
        min-width: 100%;
        border-spacing: 0;
    }

    .crime-stats-table td {
        border-radius: 0;
        padding: 0.55rem 0.4rem;
        width: 20%;
    }

    .crime-stats-table td .ui-label {
        font-size: 0.58rem;
        line-height: 0.8rem;
        letter-spacing: 0.08em;
        overflow-wrap: anywhere;
    }

    .crime-stats-table td p:last-child {
        font-size: 0.72rem;
        line-height: 0.95rem;
        margin-top: 0.35rem;
        overflow-wrap: anywhere;
    }
}

.crime-mobile-bleed {
    border-left: 0;
    border-right: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
}

    .crime-table-scroll {
        max-width: 100%;
        overflow-x: auto;
    }

    .police-case-table-wrap {
        display: none;
        max-width: 100%;
        overflow-x: auto;
    }

    .police-case-table {
        min-width: 1180px;
        width: 100%;
    }

    .police-case-card-list {
        display: block;
    }

    @media (min-width: 768px) {
        .police-case-table-wrap {
            display: block;
        }

        .police-case-card-list {
            display: none;
        }
    }

    .crime-summary-grid,
    .crime-mobile-card__grid,
    .casefile-mobile-grid {
        display: grid;
        gap: 0.75rem;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .crime-mobile-card__grid .ui-label,
    .casefile-mobile-grid .detective-mini-stat span {
        letter-spacing: 0.16em;
    }

    .crime-stats-table {
        min-width: 100%;
        table-layout: fixed;
        width: 100%;
    }

    .crime-stats-table th,
    .crime-stats-table td {
        overflow-wrap: anywhere;
        padding-left: 0.32rem;
        padding-right: 0.32rem;
    }

    .crime-list-table {
        min-width: 100%;
        table-layout: fixed;
        width: 100%;
    }

.crime-list-table th,
.crime-list-table td {
    overflow-wrap: anywhere;
    padding-left: 0.32rem;
    padding-right: 0.32rem;
    vertical-align: top;
}

@media (min-width: 768px) {
    .crime-list-table {
        border-collapse: collapse;
        table-layout: fixed;
    }

    .crime-list-table thead th {
        font-size: 0.62rem;
        letter-spacing: 0.12em;
        padding: 0.55rem 0.75rem;
        white-space: nowrap;
    }

    .crime-list-table tbody td {
        font-size: 0.78rem;
        line-height: 1.2rem;
        padding: 0.55rem 0.75rem;
    }

    .crime-list-table tbody td strong {
        line-height: 1rem;
    }

    .crime-list-table tbody td span {
        line-height: 1rem;
    }
}

    .crime-list-table th:nth-child(1),
    .crime-list-table td:nth-child(1) {
        width: 31%;
    }

    .crime-list-table th:nth-child(2),
    .crime-list-table td:nth-child(2) {
        width: 20%;
    }

    .crime-list-table th:nth-child(3),
    .crime-list-table td:nth-child(3) {
        width: 11%;
    }

    .crime-list-table th:nth-child(4),
    .crime-list-table td:nth-child(4) {
        width: 16%;
    }

    .crime-list-table th:nth-child(5),
    .crime-list-table td:nth-child(5) {
        width: 16%;
    }

    .crime-list-table th:nth-child(6),
    .crime-list-table td:nth-child(6) {
        width: 6%;
    }

    .auth-legacy__brand-mark {
        font-size: 2.35rem;
    }

    .beginner-guide__progress {
        display: flex;
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .onboarding-checklist {
        width: 100%;
        max-width: none;
    }

    .onboarding-checklist__summary {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 1rem;
        margin-bottom: 0.55rem;
    }

    .onboarding-checklist__summary p,
    .onboarding-checklist__summary span {
        margin: 0;
    }

    .onboarding-checklist__summary span {
        color: var(--color-mist);
        font-size: 0.72rem;
        font-weight: 700;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .onboarding-table {
        width: 100%;
        table-layout: fixed;
        border: 1px solid rgba(60, 71, 122, 0.65);
        border-collapse: separate;
        border-spacing: 0;
        overflow: hidden;
    }

    .onboarding-table .status-column {
        width: 9%;
    }

    .onboarding-table .task-column {
        width: 25%;
    }

    .onboarding-table .description-column {
        width: 46%;
    }

    .onboarding-table .action-column {
        width: 20%;
    }

    .onboarding-table th,
    .onboarding-table td {
        padding: 0.7rem 0.8rem;
        border-bottom: 1px solid rgba(60, 71, 122, 0.45);
        vertical-align: middle;
        overflow-wrap: anywhere;
    }

    .onboarding-table thead {
        background: rgba(60, 71, 122, 0.32);
    }

    .onboarding-table thead th {
        color: #e8ebf5;
        font-size: 0.68rem;
        font-weight: 800;
        letter-spacing: 0.14em;
        text-align: left;
        text-transform: uppercase;
    }

    .onboarding-table tbody tr {
        background: rgba(0, 0, 0, 0.16);
        transition: background-color 150ms ease;
    }

    .onboarding-table tbody tr:hover,
    .onboarding-table tbody tr:focus-within {
        background: rgba(60, 71, 122, 0.2);
    }

    .onboarding-table tbody tr.is-complete {
        background: rgba(73, 190, 120, 0.08);
    }

    .onboarding-table tbody tr.is-current {
        background: rgba(239, 98, 77, 0.09);
    }

    .onboarding-table tbody th,
    .onboarding-table tbody td {
        background: transparent;
    }

    .onboarding-table tbody tr:last-child td,
    .onboarding-table tbody tr:last-child th {
        border-bottom: 0;
    }

    .onboarding-table tbody th {
        color: white;
        font-size: 0.86rem;
        font-weight: 700;
        line-height: 1.35;
        text-align: left;
    }

    .onboarding-table tbody td {
        color: var(--color-ink-soft);
        font-size: 0.8rem;
        line-height: 1.4;
    }

    .onboarding-table__status {
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
        color: var(--color-mist);
        font-size: 0.68rem;
        font-weight: 800;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .onboarding-table__status-icon {
        color: var(--color-mist);
        font-size: 1rem;
        line-height: 1;
    }

    .onboarding-table tr.is-complete .onboarding-table__status,
    .onboarding-table tr.is-complete .onboarding-table__status-icon {
        color: #9be7b7;
    }

    .onboarding-table tr.is-current .onboarding-table__status,
    .onboarding-table tr.is-current .onboarding-table__status-icon {
        color: #ef624d;
    }

    .onboarding-table tr.is-optional .onboarding-table__status {
        color: var(--color-mist);
    }

    .onboarding-table td:last-child {
        white-space: nowrap;
    }

    .onboarding-table td:last-child a:focus-visible {
        outline: 2px solid var(--color-acid);
        outline-offset: 2px;
    }

    .onboarding-guide__utility-grid {
        display: grid;
        gap: 1rem;
    }

    .beginner-guide__links {
        display: grid;
        gap: 0.65rem;
    }

    .beginner-earn-row td {
        background: rgba(73, 190, 120, 0.08);
    }

    .beginner-earn-badge {
        color: #9be7b7;
        display: block;
        font-size: 0.68rem;
        font-weight: 700;
        letter-spacing: 0.14em;
        margin-top: 0.25rem;
        text-transform: uppercase;
    }

    @media (min-width: 980px) {
        .onboarding-guide__utility-grid {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }
    }

    @media (max-width: 720px) {
        .onboarding-checklist__summary {
            align-items: flex-start;
            flex-direction: column;
            gap: 0.3rem;
        }

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

        .onboarding-table thead {
            display: none;
        }

        .onboarding-table tbody tr {
            border-bottom: 1px solid rgba(60, 71, 122, 0.45);
            padding: 0.35rem 0;
        }

        .onboarding-table tbody tr:last-child {
            border-bottom: 0;
        }

        .onboarding-table tbody td,
        .onboarding-table tbody th {
            display: grid;
            grid-template-columns: 6.2rem minmax(0, 1fr);
            gap: 0.5rem;
            align-items: start;
            padding: 0.45rem 0.7rem;
            border-bottom: 0;
            text-align: left;
        }

        .onboarding-table tbody td::before,
        .onboarding-table tbody th::before {
            color: var(--color-mist);
            content: attr(data-label);
            font-size: 0.63rem;
            font-weight: 800;
            letter-spacing: 0.1em;
            text-transform: uppercase;
        }

        .onboarding-table tbody th {
            font-size: 0.86rem;
        }

        .onboarding-table td:last-child {
            white-space: normal;
        }
    }

}

    .profession-overview-intro {
        padding: 1rem;
    }

    .profession-overview-intro__grid {
        align-items: stretch;
        display: grid;
        gap: 0.85rem;
    }

    .profession-overview-intro__progress,
    .profession-overview-intro__timer {
        min-width: 0;
    }

    .profession-overview-intro__timer {
        padding: 0.85rem;
    }

    .profession-overview-groups {
        display: grid;
        gap: 1rem;
    }

    .profession-overview-group {
        display: grid;
        gap: 0.55rem;
    }

    .profession-overview-group__heading {
        align-items: baseline;
        display: flex;
        gap: 0.75rem;
    }

    .profession-overview-group__heading h2 {
        color: #fff;
        font-size: 0.84rem;
        font-weight: 800;
        letter-spacing: 0.14em;
        text-transform: uppercase;
    }

    .profession-overview-group__heading p {
        color: var(--color-mist);
        font-size: 0.72rem;
    }

    .profession-overview-grid {
        display: grid;
        gap: 0.65rem;
    }

    .profession-overview-card {
        display: flex;
        flex-direction: column;
        gap: 0.7rem;
        min-width: 0;
        padding: 0.8rem;
    }

    .profession-overview-card__header,
    .profession-overview-card__body,
    .profession-overview-card__footer {
        align-items: center;
        display: flex;
        gap: 0.65rem;
        justify-content: space-between;
    }

    .profession-overview-card__header h3 {
        color: #fff;
        font-size: 1rem;
        font-weight: 700;
        line-height: 1.15;
        margin-top: 0.15rem;
    }

    .profession-overview-card__body {
        align-items: flex-start;
    }

    .profession-overview-card__mark {
        align-items: center;
        aspect-ratio: 1;
        background: rgba(73, 190, 120, 0.12);
        border: 1px solid rgba(73, 190, 120, 0.5);
        border-radius: 999px;
        color: #9be7b7;
        display: flex;
        flex: 0 0 2.55rem;
        font-size: 0.72rem;
        font-weight: 800;
        justify-content: center;
        letter-spacing: 0.08em;
    }

    .profession-overview-card__summary {
        color: var(--color-mist);
        display: -webkit-box;
        font-size: 0.72rem;
        line-height: 1.35;
        min-height: 1.95rem;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .profession-overview-card__progress {
        margin-top: 0.5rem;
    }

    .profession-overview-card__progress > div:first-child {
        font-size: 0.62rem;
    }

    .profession-overview-card__progress > div:last-child {
        height: 0.38rem;
    }

    .profession-overview-card__bonuses {
        display: grid;
        gap: 0.35rem;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .profession-overview-card__bonuses > div {
        align-items: center;
        background: rgba(0, 0, 0, 0.16);
        border: 1px solid rgba(255, 255, 255, 0.08);
        display: flex;
        gap: 0.35rem;
        justify-content: space-between;
        min-width: 0;
        padding: 0.35rem 0.45rem;
    }

    .profession-overview-card__bonuses dt,
    .profession-overview-card__bonuses dd,
    .profession-overview-card__footer p {
        font-size: 0.66rem;
    }

    .profession-overview-card__bonuses dt,
    .profession-overview-card__footer p {
        color: var(--color-mist);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .profession-overview-card__bonuses dd {
        color: #9be7b7;
        font-weight: 700;
    }

    .profession-overview-card__footer {
        border-top: 1px solid rgba(255, 255, 255, 0.1);
        margin-top: auto;
        padding-top: 0.6rem;
    }

    .profession-overview-card__footer .ui-button {
        min-height: 2rem;
        padding: 0.35rem 0.7rem;
    }

    @media (min-width: 700px) {
        .profession-overview-intro__grid {
            grid-template-columns: minmax(0, 1fr) minmax(14rem, 0.65fr);
        }

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

    @media (min-width: 1024px) {
        .profession-overview-grid--gathering,
        .profession-overview-grid--production {
            grid-template-columns: repeat(3, minmax(0, 1fr));
        }
    }

    @media (max-width: 520px) {
        .profession-overview-group__heading {
            align-items: flex-start;
            flex-direction: column;
            gap: 0.15rem;
        }
    }

.profession-detail-page {
    display: grid;
    gap: 1.25rem;
}

.profession-detail-top {
    display: grid;
    gap: 1rem;
}

.profession-detail-summary,
.profession-detail-occupation {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
    padding: 1rem;
}

.profession-detail-card__header {
    align-items: flex-start;
    display: flex;
    gap: 0.85rem;
    justify-content: space-between;
}

.profession-detail-card__header h2 {
    color: #fff;
    font-size: 1.2rem;
    font-weight: 750;
    line-height: 1.2;
    margin-top: 0.25rem;
}

.profession-detail-card__header p:not(.ui-label) {
    color: var(--color-mist);
    font-size: 0.75rem;
    margin-top: 0.25rem;
}

.profession-detail-occupation .profession-detail-card__header > strong {
    color: #9be7b7;
    font-size: 1.3rem;
    white-space: nowrap;
}

.profession-detail-progress > div:first-child {
    font-size: 0.63rem;
}

.profession-detail-progress > div:last-child {
    height: 0.5rem;
}

.profession-detail-facts,
.profession-detail-bonuses {
    display: grid;
    gap: 0.45rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.profession-detail-facts > div,
.profession-detail-bonuses > div {
    background: rgba(0, 0, 0, 0.16);
    border: 1px solid rgba(255, 255, 255, 0.08);
    min-width: 0;
    padding: 0.55rem 0.65rem;
}

.profession-detail-facts > div:last-child {
    grid-column: 1 / -1;
}

.profession-detail-facts dt,
.profession-detail-bonuses dt,
.profession-detail-occupation__footer span {
    color: var(--color-mist);
    font-size: 0.62rem;
    font-weight: 750;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.profession-detail-facts dd,
.profession-detail-bonuses dd {
    color: #fff;
    font-size: 0.78rem;
    font-weight: 700;
    margin-top: 0.2rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.profession-detail-facts dd.is-ready {
    color: var(--color-acid);
}

.profession-detail-facts dd.is-cooling {
    color: var(--color-alert);
}

.profession-detail-facts > div > span {
    color: var(--color-mist);
    display: block;
    font-size: 0.65rem;
    margin-top: 0.15rem;
}

.profession-detail-bonuses dd {
    color: #9be7b7;
}

.profession-detail-occupation__footer {
    align-items: center;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
    margin-top: auto;
    padding-top: 0.8rem;
}

.profession-detail-occupation__footer a {
    color: #9be7b7;
    font-size: 0.72rem;
    font-weight: 750;
}

.profession-masteries {
    display: grid;
    gap: 0.65rem;
}

.profession-masteries__heading {
    align-items: end;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.profession-masteries__heading h2 {
    color: #fff;
    font-size: 1.2rem;
    font-weight: 750;
    margin-top: 0.2rem;
}

.profession-masteries__heading > p {
    color: var(--color-mist);
    font-size: 0.7rem;
    text-transform: uppercase;
}

.profession-mastery-grid {
    display: grid;
    gap: 0.8rem;
}

.profession-mastery-card {
    background:
        linear-gradient(180deg, rgba(67, 104, 121, 0.22) 0 52%, rgba(9, 18, 33, 0.5) 52% 100%),
        rgba(8, 18, 32, 0.9);
    border: 1px solid rgba(155, 231, 183, 0.34);
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.04);
    display: flex;
    flex-direction: column;
    min-height: 9.25rem;
    overflow: hidden;
    position: relative;
    transition: border-color 160ms ease, transform 160ms ease;
}

.profession-mastery-card.is-unlocked:hover {
    border-color: rgba(155, 231, 183, 0.8);
    transform: translateY(-2px);
}

.profession-mastery-card.is-locked {
    border-color: rgba(255, 255, 255, 0.14);
    filter: saturate(0.65);
}

.profession-mastery-card__header {
    align-items: flex-start;
    display: flex;
    gap: 0.5rem;
    justify-content: space-between;
    padding: 0.72rem 0.78rem 0.35rem;
}

.profession-mastery-card__header h3 {
    color: #fff;
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.25;
}

.profession-mastery-card__header span {
    color: #9be7b7;
    font-size: 0.56rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
}

.profession-mastery-card.is-locked .profession-mastery-card__header span {
    color: var(--color-mist);
}

.profession-mastery-card__progress {
    padding: 0 0.78rem 0.72rem;
}

.profession-mastery-card__progress > div:first-child {
    font-size: 0.56rem;
}

.profession-mastery-card__progress > div:last-child {
    height: 0.42rem;
}

.profession-mastery-card__footer {
    display: grid;
    gap: 0.6rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: auto;
    padding: 0.75rem 0.78rem;
}

.profession-mastery-card__footer div {
    min-width: 0;
}

.profession-mastery-card.is-locked .profession-mastery-card__footer {
    padding-bottom: 3.25rem;
}

.profession-mastery-card__footer span,
.profession-mastery-card__footer strong {
    display: block;
}

.profession-mastery-card__footer span {
    color: var(--color-mist);
    font-size: 0.58rem;
}

.profession-mastery-card__footer strong {
    color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    margin-top: 0.15rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.profession-mastery-card__link {
    inset: 0;
    position: absolute;
    z-index: 1;
}

.profession-mastery-card__locked {
    background: rgba(0, 0, 0, 0.36);
    color: var(--color-mist);
    display: -webkit-box;
    font-size: 0.62rem;
    inset: auto 0 0;
    line-height: 1.25;
    overflow: hidden;
    padding: 0.42rem 0.78rem;
    position: absolute;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.mastery-compact-page {
    min-width: 0;
    overflow-x: hidden;
}

.mastery-compact-page :where(h1, h2, h3, p, dl, dd) {
    margin-block: 0;
}

.mastery-summary {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    padding: 0.75rem 1rem;
}

.mastery-summary > * {
    margin-block: 0 !important;
}

.mastery-summary-heading {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.mastery-summary-heading > div {
    flex: 1 1 auto;
}

.mastery-summary-title {
    align-items: baseline;
    display: flex;
    gap: 0.25rem 0.75rem;
    margin-top: 0.25rem;
}

.mastery-summary-title h1,
.mastery-summary-title span {
    line-height: 1.2;
}

.mastery-summary-grid,
.mastery-bonus-grid,
.mastery-recipe-grid,
.mastery-content-grid,
.mastery-stats-grid {
    display: grid;
    min-width: 0;
}

.mastery-summary-grid,
.mastery-bonus-grid,
.mastery-stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.mastery-content-grid,
.mastery-recipe-grid {
    grid-template-columns: minmax(0, 1fr);
}

.mastery-action-card,
.mastery-bonus-card {
    padding: 1rem;
}

.mastery-action-card,
.mastery-bonus-card,
.mastery-recipe-section {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.mastery-action-card > *,
.mastery-bonus-card > *,
.mastery-recipe-section > * {
    margin-block: 0 !important;
}

.mastery-recipe-section,
.mastery-recipe-card,
.mastery-stats {
    padding: 0.75rem;
}

@media (min-width: 640px) {
    .mastery-bonus-grid,
    .mastery-stats-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 768px) {
    .mastery-recipe-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    .mastery-summary-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .mastery-content-grid {
        grid-template-columns: minmax(0, 1.45fr) minmax(14rem, 0.75fr);
    }

    .mastery-stats-grid {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .mastery-bonus-grid {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .mastery-recipe-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 640px) {
    .profession-detail-facts {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .profession-detail-facts > div:last-child {
        grid-column: auto;
    }

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

@media (min-width: 900px) {
    .profession-detail-top {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .profession-mastery-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 1220px) {
    .profession-mastery-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 480px) {
    .profession-detail-card__header {
        align-items: stretch;
        flex-direction: column;
    }

    .profession-detail-card__header .ui-button {
        justify-content: center;
        width: 100%;
    }

}

.material-inventory-guide,
.material-inventory-city__header,
.material-inventory-card header,
.material-inventory-card__actions,
.material-transit-card {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
}

.material-inventory-guide {
    background: rgba(73, 190, 120, 0.08);
    border: 1px solid rgba(73, 190, 120, 0.28);
    color: var(--color-mist);
    font-size: 0.75rem;
    padding: 0.65rem 0.8rem;
}

.material-inventory-guide a,
.material-inventory-card__actions a,
.material-transit-card a {
    color: #9be7b7;
    font-size: 0.7rem;
    font-weight: 700;
    white-space: nowrap;
}

.material-inventory-groups {
    display: grid;
    gap: 0.85rem;
}

.material-inventory-city {
    background: rgba(2, 5, 10, 0.34);
    border: 1px solid rgba(84, 99, 145, 0.5);
    display: grid;
    gap: 0.65rem;
    padding: 0.75rem;
}

.material-inventory-city--current {
    border-color: rgba(73, 190, 120, 0.56);
    box-shadow: inset 3px 0 0 rgba(73, 190, 120, 0.75);
}

.material-inventory-city__header h3,
.material-inventory-card h4,
.material-transit-card h3 {
    color: #fff;
    font-size: 0.88rem;
    font-weight: 700;
}

.material-inventory-grid {
    display: grid;
    gap: 0.55rem;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
}

.material-inventory-card {
    background: #080f1e;
    border: 1px solid rgba(84, 99, 145, 0.48);
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    min-width: 0;
    padding: 0.7rem;
}

.material-inventory-card header strong {
    color: #9be7b7;
    font-size: 0.7rem;
}

.material-inventory-card dl {
    display: grid;
    gap: 0.35rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.material-inventory-card dl div {
    background: rgba(255, 255, 255, 0.025);
    border: 1px solid rgba(255, 255, 255, 0.07);
    padding: 0.35rem;
    text-align: center;
}

.material-inventory-card dt {
    color: var(--color-mist);
    font-size: 0.58rem;
    text-transform: uppercase;
}

.material-inventory-card dd {
    color: #fff;
    font-size: 0.76rem;
    font-weight: 700;
    margin-top: 0.15rem;
}

.material-inventory-card__actions {
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    justify-content: flex-start;
    padding-top: 0.5rem;
}

.material-inventory-move {
    display: grid;
    gap: 0.35rem;
    grid-template-columns: 3.25rem minmax(0, 1fr);
}

.material-inventory-move input,
.material-inventory-move select {
    background: #10182b;
    border: 1px solid rgba(84, 99, 145, 0.64);
    color: #fff;
    font-size: 0.68rem;
    min-width: 0;
    padding: 0.4rem;
}

.material-inventory-move button {
    background: #35c95a;
    color: #05110a;
    font-size: 0.66rem;
    font-weight: 800;
    grid-column: 1 / -1;
    min-height: 2rem;
    padding: 0.35rem 0.6rem;
    text-transform: uppercase;
}

.material-inventory-card__notice {
    color: #f4c77c;
    font-size: 0.66rem;
    line-height: 1.35;
}

.material-transit-card {
    background: #080f1e;
    border: 1px solid rgba(84, 99, 145, 0.48);
    padding: 0.7rem;
}

.material-transit-card > p {
    color: var(--color-mist);
    font-size: 0.72rem;
}

@media (max-width: 620px) {
    .material-inventory-guide,
    .material-transit-card {
        align-items: flex-start;
        flex-direction: column;
    }

    .material-inventory-grid {
        grid-template-columns: 1fr;
    }
}

/* Materials Exchange: compact city market board. */
.exchange-app {
    display: contents;
}

.exchange-app.is-loading > * {
    opacity: 0.62;
    pointer-events: none;
    transition: opacity 120ms ease;
}

.exchange-market-header {
    border-left: 3px solid var(--color-accent);
}

.exchange-market-header__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(14rem, 16rem);
    gap: 1rem;
    align-items: start;
}

.exchange-market-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    width: 100%;
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--color-line);
    background: var(--color-line);
}

.exchange-market-metrics > div {
    min-width: 0;
    background: var(--color-panel);
    padding: 0.75rem;
}

.exchange-tabs {
    display: flex;
    gap: 1px;
    overflow: hidden;
    border: 1px solid var(--color-line);
    background: var(--color-line);
}

.exchange-tab {
    flex: 1 1 0;
    min-width: 0;
    background: #0a1225;
    color: var(--color-mist);
    padding: 0.72rem 0.8rem;
    text-align: center;
    text-transform: uppercase;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.exchange-tab:hover,
.exchange-tab.is-active {
    background: #101d35;
    color: var(--color-accent);
}

.exchange-tab.is-active {
    box-shadow: inset 0 -2px 0 var(--color-accent);
}

.exchange-filters {
    display: grid;
    grid-template-columns: minmax(12rem, 2fr) repeat(3, minmax(7rem, 1fr)) repeat(5, auto);
    align-items: center;
    gap: 0.5rem;
}

.exchange-filters > * {
    min-width: 0;
}

.exchange-check {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: var(--color-mist);
    font-size: 0.72rem;
    font-weight: 700;
    white-space: nowrap;
}

.exchange-check input {
    accent-color: var(--color-accent);
}

.exchange-check-row {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
}

.exchange-help {
    position: relative;
    display: inline-grid;
    width: 1.1rem;
    height: 1.1rem;
    place-items: center;
    border: 1px solid var(--color-line);
    border-radius: 999px;
    color: var(--color-mist);
    cursor: help;
    font-size: 0.7rem;
    font-weight: 800;
    line-height: 1;
}

.exchange-help__tip {
    position: absolute;
    z-index: 20;
    top: calc(100% + 0.45rem);
    left: 0;
    width: min(18rem, calc(100vw - 3rem));
    padding: 0.65rem 0.75rem;
    border: 1px solid var(--color-line);
    border-radius: 0.6rem;
    background: #0d1724;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35);
    color: var(--color-mist);
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1.45;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-0.2rem);
    transition: opacity 150ms ease, transform 150ms ease;
}

.exchange-help:hover .exchange-help__tip,
.exchange-help:focus .exchange-help__tip {
    opacity: 1;
    transform: translateY(0);
}

.exchange-category-strip {
    display: flex;
    gap: 0.35rem;
    margin-top: 0.75rem;
    overflow-x: auto;
    padding-bottom: 0.15rem;
    scrollbar-width: thin;
}

.exchange-category {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    flex: 0 0 auto;
    border: 1px solid var(--color-line);
    background: #080f1e;
    color: var(--color-mist);
    padding: 0.38rem 0.55rem;
    font-size: 0.66rem;
    font-weight: 750;
    text-transform: uppercase;
}

.exchange-category span {
    color: #8895b8;
}

.exchange-category:hover,
.exchange-category.is-active {
    border-color: var(--color-accent);
    color: var(--color-accent);
}

.exchange-board-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(17rem, 21rem);
    gap: 0.8rem;
    align-items: start;
    min-width: 0;
}

.exchange-section-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 1px solid var(--color-line);
    padding: 0.8rem 0.9rem;
}

.exchange-market-table {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    font-size: 0.67rem;
}

.exchange-market-table th {
    background: #101a30;
    color: #98a5c5;
    padding: 0.55rem 0.4rem;
    text-align: right;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 0.57rem;
}

.exchange-market-table th:first-child {
    width: 16%;
    text-align: left;
}

.exchange-market-table th:nth-child(2),
.exchange-market-table th:nth-child(3),
.exchange-market-table td:nth-child(2),
.exchange-market-table td:nth-child(3) {
    text-align: left;
}

.exchange-market-table th:last-child {
    width: 6rem;
}

.exchange-market-table td {
    border-top: 1px solid rgba(84, 99, 145, 0.32);
    color: var(--color-mist);
    padding: 0.52rem 0.4rem;
    text-align: right;
    vertical-align: middle;
}

.exchange-market-table td:first-child {
    text-align: left;
}

.exchange-market-table tr:hover td,
.exchange-market-table tr.is-selected td {
    background: rgba(91, 255, 112, 0.055);
}

.exchange-market-table tr.is-selected td:first-child {
    box-shadow: inset 2px 0 0 var(--color-accent);
}

.exchange-material-link {
    display: block;
    min-width: 0;
}

.exchange-material-link strong,
.exchange-material-link span,
.exchange-subvalue {
    display: block;
}

.exchange-material-link strong {
    overflow: hidden;
    color: white;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.exchange-material-link span,
.exchange-subvalue {
    margin-top: 0.12rem;
    color: #8793b2;
    font-size: 0.56rem;
}

.exchange-number {
    color: #dce4f6 !important;
    font-variant-numeric: tabular-nums;
}

.exchange-price {
    color: #b8f7bd !important;
    font-variant-numeric: tabular-nums;
}

.exchange-row-action {
    color: var(--color-accent);
    font-size: 0.63rem;
    font-weight: 800;
    text-transform: uppercase;
}

.exchange-row-actions,
.exchange-card-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
}

.exchange-row-actions a,
.exchange-card-actions a {
    border: 1px solid rgba(112, 255, 133, 0.42);
    color: var(--color-accent);
    font-size: 0.56rem;
    font-weight: 800;
    padding: 0.25rem 0.35rem;
    text-align: center;
    text-transform: uppercase;
}

.exchange-row-actions a:hover,
.exchange-card-actions a:hover {
    background: rgba(91, 255, 112, 0.08);
    border-color: var(--color-accent);
}

.exchange-card-actions {
    display: none;
}

.exchange-remote-notice,
.exchange-remote-trade {
    border-left: 2px solid #f5c96a;
    background: rgba(245, 201, 106, 0.07);
    color: #f7dda5;
    font-size: 0.72rem;
    line-height: 1.5;
    margin-top: 0.7rem;
    padding: 0.55rem 0.7rem;
}

.exchange-remote-trade {
    display: grid;
    gap: 0.7rem;
}

.exchange-mobile-cards {
    display: none;
}

.exchange-detail {
    position: sticky;
    top: 1rem;
    min-width: 0;
    padding: 1rem;
}

.exchange-detail-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    margin: 0.9rem 0;
    border: 1px solid var(--color-line);
    background: var(--color-line);
}

.exchange-detail-stats > div {
    background: #080f1e;
    padding: 0.58rem;
}

.exchange-detail-stats dt {
    color: #8793b2;
    font-size: 0.58rem;
    text-transform: uppercase;
}

.exchange-detail-stats dd {
    margin-top: 0.18rem;
    color: white;
    font-size: 0.8rem;
    font-weight: 800;
}

.exchange-stock-block {
    margin-bottom: 0.8rem;
    border-top: 1px solid var(--color-line);
    border-bottom: 1px solid var(--color-line);
    padding: 0.7rem 0;
}

.exchange-stock-block p:not(.ui-label) {
    margin-top: 0.2rem;
    color: var(--color-mist);
    font-size: 0.68rem;
}

.exchange-order-form {
    display: grid;
    gap: 0.65rem;
    margin-top: 0.85rem;
    border-top: 1px solid var(--color-line);
    padding-top: 0.85rem;
}

.exchange-order-form h4 {
    color: white;
    font-size: 0.82rem;
    font-weight: 800;
}

.exchange-order-form label:not(.exchange-check) {
    display: grid;
    gap: 0.25rem;
    color: var(--color-mist);
    font-size: 0.62rem;
    font-weight: 700;
}

.exchange-preview {
    border-left: 2px solid var(--color-accent);
    background: rgba(91, 255, 112, 0.05);
    color: #b8f7bd;
    padding: 0.5rem 0.65rem;
    font-size: 0.62rem;
    line-height: 1.5;
}

.exchange-form-error {
    color: #ff9d9d;
    font-size: 0.68rem;
}

.exchange-order-list,
.exchange-listing-table,
.exchange-history-list {
    display: grid;
}

.exchange-order-row,
.exchange-listing-row,
.exchange-history-list article {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    border-top: 1px solid rgba(84, 99, 145, 0.32);
    padding: 0.72rem 0.9rem;
}

.exchange-order-row:first-child,
.exchange-listing-row:first-child,
.exchange-history-list article:first-child {
    border-top: 0;
}

.exchange-order-row > div,
.exchange-listing-main,
.exchange-history-list article > div {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    min-width: 0;
    color: var(--color-mist);
    font-size: 0.7rem;
}

.exchange-listing-row {
    display: grid;
    grid-template-columns: minmax(10rem, 1.2fr) minmax(19rem, 2fr) minmax(10rem, 1fr) auto;
}

.exchange-listing-main > div,
.exchange-history-list article > div {
    display: grid;
}

.exchange-listing-main strong,
.exchange-history-list strong {
    color: white;
}

.exchange-listing-main span,
.exchange-history-list span,
.exchange-listing-reservation {
    color: #8793b2;
    font-size: 0.62rem;
}

.exchange-listing-row dl,
.exchange-history-list dl {
    display: flex;
    gap: 0.8rem;
}

.exchange-listing-row dl div,
.exchange-history-list dl div {
    display: grid;
    gap: 0.12rem;
}

.exchange-listing-row dt,
.exchange-history-list dt {
    color: #8793b2;
    font-size: 0.54rem;
    text-transform: uppercase;
}

.exchange-listing-row dd,
.exchange-history-list dd {
    color: white;
    font-size: 0.67rem;
}

.exchange-listing-reservation {
    display: grid;
}

.exchange-sell-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(17rem, 0.6fr);
    gap: 0.8rem;
    align-items: start;
}

.exchange-empty {
    color: var(--color-mist);
    padding: 1.25rem !important;
    text-align: center !important;
    font-size: 0.75rem;
}

@media (max-width: 1180px) {
    .exchange-filters {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .exchange-filters .exchange-search {
        grid-column: span 2;
    }

    .exchange-filters .ui-button {
        width: 100%;
    }

    .exchange-listing-row {
        grid-template-columns: minmax(10rem, 1fr) minmax(18rem, 2fr) auto;
    }

    .exchange-listing-reservation {
        display: none;
    }
}

@media (max-width: 780px) {
    .exchange-market-header {
        border-left-width: 2px;
    }

    .exchange-market-header__inner {
        grid-template-columns: minmax(0, 1fr);
        gap: 0.75rem;
    }

    .exchange-tabs {
        overflow-x: auto;
    }

    .exchange-tab {
        flex: 0 0 auto;
        min-width: 6.5rem;
        padding-inline: 0.7rem;
    }

    .exchange-filters {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .exchange-search {
        grid-column: 1 / -1;
    }

    .exchange-filters label:not(.exchange-check) {
        grid-column: span 3;
    }

    .exchange-filters .exchange-check {
        justify-content: center;
        white-space: normal;
    }

    .exchange-filters .ui-button {
        grid-column: span 3;
    }

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

    .exchange-desktop-table {
        display: none;
    }

    .exchange-mobile-cards {
        display: grid;
        gap: 1px;
        background: var(--color-line);
    }

    .exchange-card-actions {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(4.5rem, 1fr));
        margin-top: 0.65rem;
    }

    .exchange-card-actions a {
        align-items: center;
        display: inline-flex;
        justify-content: center;
        min-height: 2.75rem;
    }

    .exchange-material-card {
        min-width: 0;
        background: #080f1e;
        padding: 0.8rem;
    }

    .exchange-material-card.is-selected {
        box-shadow: inset 2px 0 0 var(--color-accent);
        background: rgba(91, 255, 112, 0.055);
    }

    .exchange-material-card h4 {
        color: white;
        font-size: 0.82rem;
        font-weight: 800;
    }

    .exchange-material-card p {
        margin-top: 0.15rem;
        color: #8793b2;
        font-size: 0.6rem;
    }

    .exchange-material-card dl {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.5rem 0.8rem;
        margin-top: 0.65rem;
    }

    .exchange-material-card dl div {
        display: flex;
        justify-content: space-between;
        gap: 0.4rem;
        border-top: 1px solid rgba(84, 99, 145, 0.26);
        padding-top: 0.35rem;
        font-size: 0.64rem;
    }

    .exchange-material-card dt {
        color: #8793b2;
    }

    .exchange-material-card dd {
        color: white;
        font-weight: 800;
    }

    .exchange-detail {
        position: static;
    }

    .exchange-section-heading,
    .exchange-order-row,
    .exchange-history-list article {
        align-items: stretch;
        flex-direction: column;
    }

    .exchange-order-row form {
        width: 100%;
    }

    .exchange-order-row form .ui-input {
        flex: 1;
        width: auto;
        min-width: 0;
    }

    .exchange-listing-row {
        grid-template-columns: minmax(0, 1fr);
    }

    .exchange-listing-row dl,
    .exchange-history-list dl {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        width: 100%;
    }

    .exchange-listing-reservation {
        display: grid;
    }
}

@media (max-width: 430px) {
    .exchange-section-heading {
        padding: 0.7rem;
    }

    .exchange-tab {
        flex: 1 1 0;
        min-width: 5rem;
        padding-inline: 0.3rem;
        font-size: 0.56rem;
    }

    .exchange-detail,
    .exchange-material-card,
    .exchange-order-row,
    .exchange-listing-row,
    .exchange-history-list article {
        padding: 0.7rem;
    }

    .exchange-material-card dl {
        grid-template-columns: minmax(0, 1fr);
    }

    .exchange-listing-row dl,
    .exchange-history-list dl {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.activity-check-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 2000;
    overflow: hidden;
    overscroll-behavior: contain;
    background: rgba(2, 6, 18, 0.6);
    backdrop-filter: blur(2px);
}

.activity-check-modal {
    position: fixed;
    left: 50%;
    top: 50%;
    display: flex;
    width: 40vw;
    height: auto;
    min-width: 320px;
    max-width: 720px;
    max-height: calc(100vh - 32px);
    max-height: calc(100dvh - 32px);
    transform: translate(-50%, -50%);
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(91, 255, 112, 0.35);
    background: linear-gradient(180deg, #172144 0%, #0b1226 100%);
    box-shadow: 0 28px 90px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.05) inset;
    color: white;
}

.activity-check-modal[data-positioned="true"] {
    transform: none;
}

.activity-check-modal__header,
.activity-check-modal__body {
    padding: 1rem;
}

.activity-check-modal__header {
    flex: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.activity-check-modal__header h2 {
    margin-top: 0.25rem;
    font-size: clamp(1.35rem, 3vw, 2rem);
    font-weight: 900;
    letter-spacing: 0.02em;
}

.activity-check-modal__header p:last-child,
.activity-check-modal__notice p {
    margin-top: 0.35rem;
    color: var(--color-mist);
    font-size: 0.8rem;
    line-height: 1.5;
}

.activity-check-modal__body {
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    -webkit-overflow-scrolling: touch;
}

.activity-check-modal__error {
    margin-bottom: 0.75rem;
    border: 1px solid rgba(255, 91, 91, 0.45);
    background: rgba(94, 13, 30, 0.55);
    padding: 0.75rem;
    color: #ffd1d1;
    font-size: 0.8rem;
    font-weight: 700;
}

.activity-check-modal__stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.6rem;
}

.activity-check-modal__stats div,
.activity-check-modal__prompt,
.activity-check-modal__notice,
.activity-check-modal__options label {
    border: 1px solid rgba(255, 255, 255, 0.09);
    background: rgba(0, 0, 0, 0.22);
}

.activity-check-modal__stats div {
    padding: 0.65rem;
}

.activity-check-modal__stats dt {
    color: var(--color-mist);
    font-size: 0.58rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.activity-check-modal__stats dd {
    margin-top: 0.2rem;
    font-size: 0.78rem;
    font-weight: 800;
}

.activity-check-modal__prompt,
.activity-check-modal__notice {
    margin-top: 0.75rem;
}

.activity-check-modal__prompt {
    padding: 0.8rem;
}

.activity-check-modal__prompt h3 {
    margin-top: 0.35rem;
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.4;
}

.activity-check-modal__notice {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.8rem;
    align-items: center;
    padding: 0.8rem;
}

.activity-check-modal__notice strong {
    color: var(--color-acid);
    font-size: clamp(1.4rem, 4vw, 2.2rem);
    font-weight: 950;
    letter-spacing: 0.24em;
}

.activity-check-modal__form fieldset {
    min-width: 0;
}

.activity-check-modal__form {
    display: flex;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
}

.activity-check-modal__form input[type="text"] {
    margin-top: 0.5rem;
    width: 100%;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(0, 0, 0, 0.28);
    padding: 0.8rem;
    color: white;
    outline: none;
}

.activity-check-modal__form input[type="text"]:focus,
.activity-check-modal__options label:focus-within,
.activity-check-modal:focus {
    border-color: var(--color-acid);
    box-shadow: 0 0 0 2px rgba(91, 255, 112, 0.18);
}

.activity-check-modal__options {
    display: grid;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.activity-check-modal__options label {
    display: flex;
    gap: 0.65rem;
    align-items: flex-start;
    padding: 0.7rem;
    color: white;
    font-size: 0.82rem;
}

.activity-check-modal__footer {
    flex: none;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    background: #0b1226;
    padding: 0.8rem 1rem;
}

@media (max-width: 767px) {
    .activity-check-modal {
        width: 96vw;
        min-width: 0;
        max-width: calc(100vw - 16px);
    }

    .activity-check-modal__stats,
    .activity-check-modal__notice {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-height: 700px) {
    .activity-check-modal {
        max-height: calc(100vh - 16px);
        max-height: calc(100dvh - 16px);
    }

    .activity-check-modal__header,
    .activity-check-modal__body {
        padding: 0.75rem;
    }

    .activity-check-modal__footer {
        padding: 0.65rem 0.75rem;
    }
}

@media (min-width: 768px) and (orientation: portrait) {
    .activity-check-modal {
        width: 66vw;
    }
}

@media (min-width: 768px) and (orientation: landscape) and (max-width: 1199px) {
    .activity-check-modal {
        width: 50vw;
    }
}

@media (min-width: 1200px) {
    .activity-check-modal {
        width: 40vw;
    }
}
