:root {
    --ad-bg: #d7e8f4;
    --ad-bg-2: #edf7fc;
    --ad-text: #102033;
    --ad-muted: #5d7288;
    --ad-muted-2: #72879b;
    --ad-muted-3: #6a7f93;
    --ad-border: rgba(82, 121, 150, 0.24);
    --ad-border-soft: rgba(82, 121, 150, 0.14);
    --ad-surface: linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(241, 248, 252, 0.92));
    --ad-surface-solid: #f7fbfe;
    --ad-surface-solid-2: #ffffff;
    --ad-accent: #0b75b7;
    --ad-accent-2: #1688c7;
    --ad-accent-soft: rgba(11, 117, 183, 0.12);
    --ad-success: #178b61;
    --ad-danger: #c63d35;
    --ad-info: #1688c7;
}

html {
    color-scheme: light;
}

html, body {
    min-height: 100%;
    font-family: "IBM Plex Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body {
    background:
        radial-gradient(980px 380px at 78% -8%, rgba(255, 255, 255, 0.88), transparent 62%),
        linear-gradient(180deg, var(--ad-bg-2), var(--ad-bg)),
        var(--ad-bg);
    color: var(--ad-text);
}

.font-mono,
code,
pre,
kbd,
table td:first-child {
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
}

h1:focus {
    outline: none;
}

.nav-link {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    width: 100%;
    border-radius: 0.5rem;
    padding: 0.65rem 0.8rem;
    color: var(--ad-muted);
    font-size: 0.925rem;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.nav-link:hover {
    background: rgba(11, 117, 183, 0.09);
    color: #0d5f94;
}

.nav-link.active {
    background: linear-gradient(180deg, rgba(229, 246, 255, 0.92), rgba(208, 234, 248, 0.92));
    color: #075f94;
    box-shadow: 0 12px 28px -24px rgba(16, 49, 75, 0.75);
}

a {
    color: var(--ad-accent-2);
}

a:hover {
    color: var(--ad-accent);
}

input,
select,
textarea {
    color-scheme: light;
}

/* Tailwind utility harmonization for the existing Blazor pages. */
.bg-slate-50 {
    background-color: transparent !important;
}

.bg-white {
    background: var(--ad-surface) !important;
}

.bg-slate-100 {
    background-color: rgba(224, 239, 248, 0.72) !important;
}

.bg-cyan-700 {
    background-color: var(--ad-accent) !important;
    color: #ffffff !important;
}

.hover\:bg-cyan-800:hover {
    background-color: var(--ad-accent-2) !important;
}

.bg-cyan-50,
.bg-amber-50 {
    background-color: var(--ad-accent-soft) !important;
}

.bg-emerald-50 {
    background-color: rgba(52, 211, 153, 0.12) !important;
}

.bg-rose-50 {
    background-color: rgba(239, 107, 98, 0.12) !important;
}

.bg-red-50 {
    background-color: rgba(255, 241, 239, 0.94) !important;
}

.bg-slate-300 {
    background-color: rgba(138, 160, 178, 0.38) !important;
}

.border-slate-200,
.border-slate-300,
.border-cyan-200,
.border-cyan-300,
.border-amber-200,
.border-amber-300,
.border-emerald-200,
.border-emerald-300,
.border-rose-300,
.border-red-200 {
    border-color: var(--ad-border) !important;
}

.divide-slate-100 > :not([hidden]) ~ :not([hidden]),
.divide-slate-200 > :not([hidden]) ~ :not([hidden]) {
    border-color: var(--ad-border-soft) !important;
}

.text-slate-950 {
    color: var(--ad-text) !important;
}

.text-slate-700 {
    color: #2f455c !important;
}

.text-slate-500 {
    color: var(--ad-muted) !important;
}

.text-slate-600 {
    color: #42586f !important;
}

.text-cyan-700,
.text-amber-800,
.text-amber-700 {
    color: var(--ad-accent-2) !important;
}

.text-emerald-700 {
    color: var(--ad-success) !important;
}

.text-rose-700,
.text-rose-600,
.text-red-700 {
    color: var(--ad-danger) !important;
}

.shadow-sm {
    box-shadow: 0 18px 44px -36px rgba(16, 49, 75, 0.66), 0 1px 0 rgba(255, 255, 255, 0.88) inset !important;
}

.rounded {
    border-radius: 0.5rem !important;
}

table {
    border-collapse: separate;
    border-spacing: 0;
}

thead th {
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    color: var(--ad-muted-3) !important;
    letter-spacing: 0.08em;
}

tbody tr {
    transition: background 0.15s ease;
}

tbody tr:hover {
    background: rgba(11, 117, 183, 0.045);
}

button,
.button-like {
    border-radius: 0.5rem;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.modal-surface-solid {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(238, 247, 252, 0.96)), #f7fbfe !important;
    color: var(--ad-text);
}

.route-builder-modal {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    max-width: min(64rem, calc(100vw - 2rem));
    max-height: calc(100vh - 2rem);
    overflow: hidden;
}

.route-builder-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 1px solid var(--ad-border);
    padding: 0.75rem 1rem;
}

.route-builder-header p,
.route-builder-summary span {
    color: var(--ad-muted-3);
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.route-builder-header h2 {
    margin: 0.18rem 0 0;
    color: var(--ad-text);
    font-size: 1.22rem;
    font-weight: 850;
}

.route-builder-close {
    border: 1px solid var(--ad-border);
    border-radius: 0.55rem;
    background: rgba(255, 255, 255, 0.72);
    color: var(--ad-muted-2);
    font-size: 0.8rem;
    font-weight: 800;
    padding: 0.48rem 0.72rem;
}

.route-builder-close:hover {
    background: rgba(229, 246, 255, 0.92);
    color: #075f94;
}

.route-builder-body {
    display: grid;
    gap: 0.75rem;
    min-height: 0;
    overflow: auto;
    padding: 0.9rem 1rem;
}

.route-builder-pickers {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    min-height: 0;
}

.airport-picker {
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    min-width: 0;
    min-height: 0;
    border: 1px solid var(--ad-border);
    border-radius: 0.78rem;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(242, 248, 252, 0.68)),
        rgba(247, 251, 254, 0.72);
    padding: 0.72rem;
}

.airport-picker-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    min-height: 2rem;
}

.airport-picker-title span {
    display: inline-flex;
    align-items: center;
    min-height: 1.8rem;
    border-radius: 999px;
    background: #0b75b7;
    color: #ffffff;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.16em;
    padding: 0.28rem 0.62rem;
    text-transform: uppercase;
    box-shadow: 0 12px 28px -22px rgba(11, 117, 183, 0.95);
}

.airport-picker-title strong {
    overflow: hidden;
    max-width: 62%;
    color: var(--ad-text);
    font-size: 0.82rem;
    font-weight: 850;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.airport-picker-filters {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
    gap: 0.55rem;
    margin-top: 0.62rem;
}

.airport-picker-filters label {
    display: grid;
    gap: 0.35rem;
    color: var(--ad-muted-2);
    font-size: 0.7rem;
    font-weight: 800;
}

.airport-picker-filters input,
.airport-picker-filters select {
    min-width: 0;
    border: 1px solid var(--ad-border);
    border-radius: 0.52rem;
    background: rgba(255, 255, 255, 0.9);
    color: var(--ad-text);
    font-size: 0.82rem;
    outline: none;
    padding: 0.5rem 0.58rem;
}

.airport-picker-filters input:focus,
.airport-picker-filters select:focus {
    border-color: #1688c7;
    box-shadow: 0 0 0 0.16rem rgba(22, 136, 199, 0.14);
}

.airport-picker-results {
    display: grid;
    align-content: start;
    gap: 0.38rem;
    max-height: clamp(11rem, 30vh, 16rem);
    min-height: 0;
    margin-top: 0.62rem;
    overflow: auto;
    padding-right: 0.15rem;
}

.airport-picker-option {
    display: grid;
    gap: 0.1rem;
    width: 100%;
    border: 1px solid rgba(82, 121, 150, 0.18);
    border-radius: 0.58rem;
    background: rgba(255, 255, 255, 0.62);
    color: var(--ad-text);
    padding: 0.5rem 0.62rem;
    text-align: left;
    transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}

.airport-picker-option:hover {
    border-color: rgba(11, 117, 183, 0.34);
    background: rgba(229, 246, 255, 0.9);
    transform: translateY(-1px);
}

.airport-picker-option.is-selected {
    border-color: rgba(11, 117, 183, 0.55);
    background: linear-gradient(180deg, rgba(224, 244, 255, 0.96), rgba(207, 235, 249, 0.92));
    box-shadow: inset 0.22rem 0 #0b75b7;
}

.airport-picker-code {
    color: #0b75b7;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.78rem;
    font-weight: 900;
}

.airport-picker-name {
    overflow: hidden;
    font-size: 0.84rem;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.airport-picker-meta {
    color: var(--ad-muted-2);
    font-size: 0.7rem;
    font-weight: 700;
}

.route-builder-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.55rem;
}

.route-builder-summary div {
    border: 1px solid var(--ad-border);
    border-radius: 0.62rem;
    background: rgba(255, 255, 255, 0.72);
    padding: 0.58rem 0.68rem;
}

.route-builder-summary strong {
    display: block;
    overflow: hidden;
    margin-top: 0.18rem;
    color: var(--ad-text);
    font-size: 0.9rem;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.route-builder-actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    border-top: 1px solid var(--ad-border);
    padding: 0.72rem 1rem;
}

@media (max-width: 920px) {
    .route-builder-modal {
        max-height: calc(100vh - 2rem);
        overflow: auto;
    }

    .route-builder-pickers,
    .route-builder-summary {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .airport-picker-filters {
        grid-template-columns: 1fr;
    }

    .route-builder-actions {
        display: grid;
    }
}

.app-shell,
.public-shell {
    background:
        radial-gradient(980px 420px at 82% -10%, rgba(255, 255, 255, 0.9), transparent 64%),
        linear-gradient(180deg, #edf7fc 0%, #d7e8f4 46%, #c4dbea 100%);
    color: var(--ad-text);
}

.app-shell {
    display: flex;
    width: 100%;
    height: 100dvh;
    min-height: 32rem;
    overflow: hidden;
}

.app-frame {
    display: flex;
    min-width: 0;
    min-height: 0;
    flex-direction: column;
}

.app-main {
    min-height: 0;
    overflow: auto;
}

.app-main-map {
    overflow: hidden;
}

.app-sidebar {
    position: relative;
    width: 4rem;
    height: 100dvh;
    flex: 0 0 4rem;
    border-bottom: 1px solid rgba(54, 82, 109, 0.34);
    background:
        radial-gradient(180px 260px at 50% 0%, rgba(46, 183, 229, 0.24), transparent 72%),
        linear-gradient(180deg, #081829 0%, #0b2134 48%, #071421 100%);
    color: #d9e9f6;
    box-shadow: 24px 0 58px -44px rgba(3, 13, 24, 0.95), inset -1px 0 rgba(255, 255, 255, 0.06);
}

.game-nav {
    gap: 0.5rem;
}

.game-nav-brand {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
}

.game-nav-logo {
    position: relative;
    display: grid;
    width: 3rem;
    height: 3rem;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(113, 211, 246, 0.24);
    border-radius: 0.72rem;
    background:
        linear-gradient(180deg, rgba(17, 45, 72, 0.92), rgba(6, 18, 33, 0.96)),
        #0a1728;
    box-shadow: 0 20px 42px -28px rgba(63, 207, 247, 0.95), inset 0 1px rgba(255, 255, 255, 0.12);
}

.game-nav-logo::after {
    position: absolute;
    inset: 0.38rem;
    border: 1px solid rgba(113, 211, 246, 0.10);
    border-radius: 0.5rem;
    content: "";
    pointer-events: none;
}

.game-nav-logo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.game-nav-list {
    min-height: 0;
    flex: 1;
    gap: 0.28rem;
}

.game-nav-link {
    position: relative;
    justify-content: center;
    min-height: 2.55rem;
    border: 1px solid rgba(113, 211, 246, 0.12);
    border-radius: 0.58rem;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.025)),
        rgba(9, 25, 42, 0.78);
    color: rgba(207, 226, 240, 0.72);
    padding: 0;
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.07);
}

.game-nav-link::before {
    position: absolute;
    left: -0.28rem;
    top: 50%;
    width: 0.18rem;
    height: 1.1rem;
    border-radius: 999px;
    background: transparent;
    content: "";
    transform: translateY(-50%);
}

.game-nav-link::after {
    position: absolute;
    left: calc(100% + 0.55rem);
    top: 50%;
    z-index: 50;
    min-width: max-content;
    border: 1px solid rgba(113, 211, 246, 0.18);
    border-radius: 0.65rem;
    background: rgba(9, 24, 40, 0.96);
    color: #eef8ff;
    content: attr(data-label);
    font-size: 0.82rem;
    font-weight: 800;
    opacity: 0;
    padding: 0.48rem 0.65rem;
    pointer-events: none;
    transform: translate(-0.3rem, -50%);
    transition: opacity 0.16s ease, transform 0.16s ease;
    box-shadow: 0 18px 44px -26px rgba(3, 13, 24, 0.9);
}

.game-nav-link:hover {
    border-color: rgba(113, 211, 246, 0.36);
    background:
        radial-gradient(90px 70px at 50% 20%, rgba(57, 194, 240, 0.18), transparent 72%),
        rgba(11, 35, 58, 0.92);
    color: #ffffff;
    transform: translateY(-1px);
}

.game-nav-link:hover::after {
    opacity: 1;
    transform: translate(0, -50%);
}

.game-nav-link.active {
    border-color: rgba(90, 213, 255, 0.52);
    background:
        radial-gradient(100px 80px at 50% 8%, rgba(78, 206, 250, 0.42), transparent 72%),
        linear-gradient(180deg, rgba(15, 120, 175, 0.9), rgba(7, 67, 108, 0.9));
    color: #ffffff;
    box-shadow: 0 16px 36px -24px rgba(78, 206, 250, 0.95), inset 0 1px rgba(255, 255, 255, 0.22);
}

.game-nav-link.active::before {
    display: none;
}

.game-nav-settings {
    margin-top: auto;
}

.game-nav-icon {
    display: grid;
    width: 1.25rem;
    height: 1.25rem;
    place-items: center;
}

.game-nav-icon svg {
    width: 1.25rem;
    height: 1.25rem;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.9;
}

.game-nav-fleet-icon {
    position: relative;
    display: block;
    width: 1.68rem;
    height: 1.55rem;
}

.game-nav-fleet-icon svg {
    position: absolute;
    width: 0.82rem;
    height: 0.82rem;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2.15;
}

.game-nav-fleet-icon svg:nth-child(1) {
    left: 50%;
    top: 0;
    opacity: 1;
    transform: translateX(-50%);
}

.game-nav-fleet-icon svg:nth-child(2) {
    bottom: 0.04rem;
    left: 0;
    opacity: 0.82;
}

.game-nav-fleet-icon svg:nth-child(3) {
    right: 0;
    bottom: 0.04rem;
    opacity: 0.82;
}

.game-nav-text {
    display: none;
}

@media (max-width: 767px) {
    .app-shell {
        min-height: 28rem;
        flex-direction: column;
    }

    .app-sidebar {
        width: 100%;
        height: auto;
        flex-basis: auto;
        background:
            radial-gradient(460px 180px at 4rem 0%, rgba(46, 183, 229, 0.24), transparent 72%),
            linear-gradient(180deg, #081829 0%, #0b2134 100%);
    }

    .game-nav {
        gap: 0;
    }

    .game-nav-brand {
        justify-content: space-between;
    }

    .game-nav-logo {
        width: 2.65rem;
        height: 2.65rem;
        border-radius: 0.62rem;
    }

    .game-nav-list {
        position: absolute;
        left: 0;
        right: 0;
        top: 100%;
        z-index: 80;
        max-height: calc(100dvh - 4rem);
        gap: 0.42rem;
        overflow-y: auto;
        border-top: 1px solid rgba(113, 211, 246, 0.14);
        background: rgba(6, 20, 33, 0.98);
        padding: 0.55rem;
        box-shadow: 0 22px 50px rgba(3, 13, 24, 0.48);
    }

    .game-nav-link {
        justify-content: flex-start;
        min-height: 3.15rem;
        border-radius: 0.75rem;
        padding: 0 0.85rem;
    }

    .game-nav-settings {
        margin-top: 0.35rem;
        border-top-color: rgba(113, 211, 246, 0.26);
    }

    .game-nav-link::after {
        display: none;
    }

    .game-nav-link::before {
        left: 0.25rem;
    }

    .game-nav-icon,
    .game-nav-icon svg {
        width: 1.35rem;
        height: 1.35rem;
    }

    .game-nav-fleet-icon {
        width: 1.75rem;
        height: 1.62rem;
    }

    .game-nav-fleet-icon svg {
        width: 0.86rem;
        height: 0.86rem;
    }

    .game-nav-fleet-icon svg:nth-child(3) {
        width: 0.86rem;
        height: 0.86rem;
    }

    .game-nav-text {
        display: inline;
        color: inherit;
        font-size: 0.94rem;
        font-weight: 800;
    }
}

.app-header {
    position: relative;
    z-index: 30;
    flex: 0 0 auto;
    border-bottom: 1px solid rgba(103, 211, 248, 0.2);
    background:
        linear-gradient(90deg, rgba(18, 68, 99, 0.34) 1px, transparent 1px),
        linear-gradient(180deg, #0c263b 0%, #081a2b 100%);
    background-size: 4rem 100%, auto;
    color: #eaf8ff;
    box-shadow: 0 12px 34px -28px rgba(2, 10, 18, 0.9), inset 0 1px rgba(255, 255, 255, 0.07);
}

.app-header-inner {
    display: flex;
    min-height: 2rem;
    align-items: center;
    justify-content: space-between;
    gap: 0.55rem;
}

.header-telemetry {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 0.4rem;
}

.header-chip,
.nav-toggle-button {
    border: 1px solid rgba(103, 211, 248, 0.18);
    background: rgba(5, 20, 34, 0.66);
    color: #eaf8ff;
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.06);
}

.header-chip {
    display: flex;
    min-width: 0;
    height: 2rem;
    align-items: center;
    gap: 0.42rem;
    border-radius: 0.32rem;
    padding: 0 0.58rem;
}

.header-label {
    color: #6fcff2;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.58rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.header-chip strong {
    overflow: hidden;
    color: #f4fbff;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.7rem;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.header-company {
    max-width: min(24rem, 34vw);
}

.header-status-light {
    width: 0.42rem;
    height: 0.42rem;
    flex: 0 0 auto;
    border-radius: 50%;
    background: #5df2b0;
    box-shadow: 0 0 0 3px rgba(93, 242, 176, 0.1), 0 0 10px rgba(93, 242, 176, 0.65);
}

.header-action {
    display: inline-flex;
    height: 2rem;
    align-items: center;
    gap: 0.35rem;
    border: 1px solid rgba(248, 113, 113, 0.26);
    border-radius: 0.32rem;
    background: rgba(93, 28, 36, 0.28);
    color: #ffc5c5;
    padding: 0 0.58rem;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.header-action svg {
    width: 0.9rem;
    height: 0.9rem;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
}

.header-action:hover,
.nav-toggle-button:hover {
    border-color: rgba(248, 113, 113, 0.55);
    background: rgba(127, 29, 29, 0.48);
    color: #ffffff;
}

.nav-toggle-button,
.nav-toggle-button:hover {
    border-color: rgba(103, 211, 248, 0.24);
    background: rgba(9, 35, 57, 0.9);
    color: #eaf8ff;
}

@media (max-width: 640px) {
    .header-company {
        max-width: 42vw;
    }

    .header-company .header-label,
    .header-clock-local {
        display: none;
    }
}

@media (max-width: 430px) {
    .header-action span,
    .header-clock .header-label {
        display: none;
    }

    .header-action {
        width: 2rem;
        justify-content: center;
        padding: 0;
    }
}

.stat-card {
    border: 1px solid var(--ad-border);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(241, 248, 252, 0.94)),
        #f7fbfe;
    color: var(--ad-text);
    box-shadow: 0 18px 44px -36px rgba(16, 49, 75, 0.68), 0 1px 0 rgba(255, 255, 255, 0.9) inset;
}

.stat-card p:first-child,
.company-selector {
    color: var(--ad-muted-3);
}

.stat-card p:last-child {
    color: var(--ad-text);
}

.stat-card-indicator {
    background: rgba(11, 117, 183, 0.1);
    color: #0b75b7;
}

.game-dashboard {
    display: grid;
    gap: 0.85rem;
    color: #e8f6ff;
}

.game-dashboard-hero,
.game-dashboard-panel,
.game-dashboard-stat,
.game-dashboard-loading,
.game-dashboard-alert {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(125, 211, 252, 0.22);
    background:
        linear-gradient(180deg, rgba(11, 25, 43, 0.97), rgba(5, 13, 25, 0.98)),
        #07111f;
    box-shadow: 0 26px 70px -46px rgba(0, 0, 0, 0.95), inset 0 1px rgba(255, 255, 255, 0.08);
}

.game-dashboard-hero {
    display: grid;
    min-height: 12.8rem;
    grid-template-columns: minmax(0, 1.1fr) minmax(17rem, 0.9fr);
    align-items: center;
    gap: 0.85rem;
    border-radius: 0.85rem;
    padding: clamp(0.9rem, 2vw, 1.35rem);
    background:
        radial-gradient(460px 220px at 82% 22%, rgba(34, 197, 94, 0.18), transparent 70%),
        radial-gradient(460px 240px at 18% 18%, rgba(14, 165, 233, 0.24), transparent 72%),
        linear-gradient(135deg, #0a1628 0%, #101625 44%, #06111d 100%);
}

.game-dashboard-hero::before {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(rgba(125, 211, 252, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(125, 211, 252, 0.04) 1px, transparent 1px);
    background-size: 34px 34px;
    content: "";
    mask-image: linear-gradient(90deg, black, transparent 78%);
    pointer-events: none;
}

.game-dashboard-hero-copy {
    position: relative;
    z-index: 1;
}

.game-dashboard-kicker,
.game-dashboard-panel-title span,
.game-dashboard-stat span,
.game-dashboard-flight-board span,
.game-dashboard-ledger span {
    color: #8bd9ff;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.game-dashboard-hero h1 {
    margin: 0.25rem 0 0;
    color: #ffffff;
    font-size: clamp(1.85rem, 3.7vw, 3.35rem);
    font-weight: 900;
    letter-spacing: 0;
    line-height: 0.92;
    text-transform: uppercase;
}

.game-dashboard-hero-copy p:last-child {
    max-width: 34rem;
    margin: 0.75rem 0 0;
    color: #b8c8da;
    font-size: 0.9rem;
    line-height: 1.5;
}

.game-dashboard-radar {
    position: relative;
    z-index: 1;
    justify-self: center;
    width: min(14.6rem, 58vw);
    aspect-ratio: 1;
    border: 1px solid rgba(125, 211, 252, 0.26);
    border-radius: 50%;
    background:
        repeating-radial-gradient(circle, rgba(125, 211, 252, 0.16) 0 1px, transparent 1px 3.2rem),
        linear-gradient(135deg, rgba(12, 35, 55, 0.72), rgba(5, 15, 27, 0.8));
    box-shadow: inset 0 0 42px rgba(14, 165, 233, 0.18), 0 22px 60px -38px rgba(34, 211, 238, 0.9);
}

.game-dashboard-radar::before,
.game-dashboard-radar::after {
    position: absolute;
    inset: 50% 8%;
    height: 1px;
    background: rgba(125, 211, 252, 0.22);
    content: "";
}

.game-dashboard-radar::after {
    transform: rotate(90deg);
}

.game-dashboard-radar-sweep {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: conic-gradient(from 12deg, rgba(34, 197, 94, 0.34), transparent 28%, transparent);
    animation: dashboard-radar-spin 6s linear infinite;
}

.game-dashboard-radar-plane {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 4.1rem;
    height: 4.1rem;
    background: #f8d66d;
    mask: url("/icons/aircraft/b747.svg") center / contain no-repeat;
    -webkit-mask: url("/icons/aircraft/b747.svg") center / contain no-repeat;
    transform: translate(-50%, -50%) rotate(52deg);
    filter: drop-shadow(0 0 12px rgba(248, 214, 109, 0.72)) drop-shadow(0 5px 8px rgba(22, 41, 58, 0.22));
}

.game-dashboard-radar-route {
    position: absolute;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, rgba(139, 217, 255, 0.9), transparent);
}

.game-dashboard-radar-route.route-a {
    left: 18%;
    top: 35%;
    width: 60%;
    transform: rotate(-28deg);
}

.game-dashboard-radar-route.route-b {
    left: 20%;
    top: 63%;
    width: 58%;
    transform: rotate(23deg);
}

.game-dashboard-radar-dot {
    position: absolute;
    width: 0.48rem;
    height: 0.48rem;
    border-radius: 999px;
    background: #5df2b0;
    box-shadow: 0 0 0 5px rgba(93, 242, 176, 0.12), 0 0 18px rgba(93, 242, 176, 0.65);
}

.game-dashboard-radar-dot.dot-a {
    left: 23%;
    top: 31%;
}

.game-dashboard-radar-dot.dot-b {
    right: 21%;
    top: 58%;
}

.game-dashboard-radar-dot.dot-c {
    left: 42%;
    bottom: 17%;
    background: #f8d66d;
    box-shadow: 0 0 0 5px rgba(248, 214, 109, 0.12), 0 0 18px rgba(248, 214, 109, 0.65);
}

.game-dashboard-alert,
.game-dashboard-loading {
    border-radius: 0.85rem;
    padding: 1rem 1.1rem;
    color: #ffe4a3;
    font-weight: 800;
}

.game-dashboard-loading {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    color: #b8c8da;
}

.game-dashboard-loading span {
    width: 0.75rem;
    height: 0.75rem;
    border-radius: 999px;
    background: #5df2b0;
    box-shadow: 0 0 0 6px rgba(93, 242, 176, 0.12);
}

.game-dashboard-status-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.7rem;
}

.game-dashboard-stat {
    min-height: 6.7rem;
    border-radius: 0.75rem;
    padding: 0.8rem;
}

.game-dashboard-stat::after {
    position: absolute;
    right: -1.4rem;
    bottom: -1.9rem;
    width: 7rem;
    height: 7rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 50%;
    content: "";
}

.game-dashboard-stat strong {
    display: block;
    overflow: hidden;
    margin-top: 0.55rem;
    color: #ffffff;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: clamp(1.12rem, 1.75vw, 1.55rem);
    font-weight: 900;
    line-height: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.game-dashboard-stat small {
    display: block;
    margin-top: 0.45rem;
    color: #93a7bc;
    font-weight: 800;
}

.game-dashboard-stat.is-cash {
    border-color: rgba(93, 242, 176, 0.24);
}

.game-dashboard-stat.is-profit {
    border-color: rgba(248, 214, 109, 0.28);
}

.game-dashboard-command-grid {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    gap: 0.7rem;
}

.game-dashboard-panel {
    min-height: 12.2rem;
    border-radius: 0.75rem;
    padding: 0.9rem;
}

.game-dashboard-panel-title {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.game-dashboard-panel-title h2 {
    margin: 0.2rem 0 0;
    color: #ffffff;
    font-size: 1rem;
    font-weight: 900;
}

.game-dashboard-reputation {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0.9rem;
    margin-top: 1rem;
}

.game-dashboard-reputation-ring {
    display: grid;
    width: 6.25rem;
    aspect-ratio: 1;
    place-items: center;
    border-radius: 50%;
    background:
        radial-gradient(circle at center, #081524 0 55%, transparent 56%),
        conic-gradient(#5df2b0 var(--reputation), rgba(125, 211, 252, 0.16) 0);
    box-shadow: inset 0 0 24px rgba(93, 242, 176, 0.12), 0 20px 44px -34px rgba(93, 242, 176, 0.8);
}

.game-dashboard-reputation-ring strong {
    margin-top: 0.35rem;
    color: #ffffff;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 1.55rem;
    font-weight: 900;
    line-height: 1;
}

.game-dashboard-reputation-ring span {
    margin-top: -1.75rem;
    color: #8bd9ff;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.62rem;
    font-weight: 900;
}

.game-dashboard-reputation p,
.game-dashboard-directive-panel p {
    margin: 0;
    color: #ffffff;
    font-size: 0.92rem;
    font-weight: 900;
}

.game-dashboard-reputation small,
.game-dashboard-directive-panel p {
    display: block;
    margin-top: 0.45rem;
    color: #9fb0c5;
    line-height: 1.55;
}

.game-dashboard-runway {
    position: absolute;
    left: 0.9rem;
    right: 0.9rem;
    bottom: 0.75rem;
    height: 2.35rem;
    border-radius: 0.5rem;
    background:
        repeating-linear-gradient(90deg, transparent 0 1.15rem, rgba(255, 255, 255, 0.28) 1.15rem 1.65rem, transparent 1.65rem 2.8rem),
        linear-gradient(180deg, rgba(69, 84, 103, 0.7), rgba(24, 34, 49, 0.9));
    transform: perspective(180px) rotateX(42deg);
    transform-origin: bottom;
}

.game-dashboard-runway span {
    position: absolute;
    top: 50%;
    width: 0.45rem;
    height: 0.45rem;
    border-radius: 50%;
    background: #f8d66d;
    box-shadow: 0 0 12px rgba(248, 214, 109, 0.85);
}

.game-dashboard-runway span:nth-child(1) {
    left: 16%;
}

.game-dashboard-runway span:nth-child(2) {
    left: 50%;
}

.game-dashboard-runway span:nth-child(3) {
    right: 16%;
}

.game-dashboard-flight-board,
.game-dashboard-ledger {
    display: grid;
    gap: 0.5rem;
    margin-top: 0.85rem;
}

.game-dashboard-flight-board div,
.game-dashboard-ledger div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border: 1px solid rgba(125, 211, 252, 0.13);
    border-radius: 0.58rem;
    background: rgba(255, 255, 255, 0.045);
    padding: 0.58rem 0.68rem;
}

.game-dashboard-flight-board strong,
.game-dashboard-ledger strong {
    color: #ffffff;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.94rem;
    font-weight: 900;
}

.game-dashboard-progress {
    overflow: hidden;
    height: 0.5rem;
    margin-top: 0.8rem;
    border-radius: 999px;
    background: rgba(125, 211, 252, 0.12);
}

.game-dashboard-progress div {
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #5df2b0, #8bd9ff);
    box-shadow: 0 0 18px rgba(93, 242, 176, 0.45);
}

.game-dashboard-ledger-panel {
    min-height: 10.5rem;
}

.game-dashboard-directive-panel {
    min-height: 10.5rem;
    border-color: rgba(248, 214, 109, 0.24);
    background:
        radial-gradient(240px 160px at 88% 22%, rgba(248, 214, 109, 0.13), transparent 72%),
        linear-gradient(180deg, rgba(17, 28, 43, 0.98), rgba(8, 17, 29, 0.98));
}

@keyframes dashboard-radar-spin {
    to {
        transform: rotate(1turn);
    }
}

@media (max-width: 1024px) {
    .game-dashboard-hero,
    .game-dashboard-command-grid {
        grid-template-columns: 1fr;
    }

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

@media (max-width: 640px) {
    .game-dashboard-hero {
        min-height: auto;
    }

    .game-dashboard-status-grid {
        grid-template-columns: 1fr;
    }

    .game-dashboard-reputation {
        grid-template-columns: 1fr;
    }

    .game-dashboard-reputation-ring {
        width: 7rem;
    }
}

/* Dashboard: light simulator acrylic inspired by modern flight-sim menus. */
.game-dashboard {
    color: #15334e;
}

.game-dashboard-hero,
.game-dashboard-panel,
.game-dashboard-stat,
.game-dashboard-loading,
.game-dashboard-alert {
    border-color: rgba(67, 127, 166, 0.22);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(229, 242, 250, 0.72)),
        rgba(241, 248, 252, 0.72);
    box-shadow: 0 24px 70px -46px rgba(24, 68, 98, 0.72), inset 0 1px rgba(255, 255, 255, 0.86);
    backdrop-filter: blur(18px) saturate(1.18);
}

.game-dashboard-hero {
    background:
        radial-gradient(520px 240px at 80% 18%, rgba(255, 255, 255, 0.72), transparent 68%),
        radial-gradient(600px 260px at 12% 2%, rgba(112, 194, 236, 0.3), transparent 70%),
        linear-gradient(135deg, rgba(219, 238, 249, 0.92) 0%, rgba(185, 218, 237, 0.84) 46%, rgba(122, 176, 211, 0.72) 100%);
}

.game-dashboard-hero::before {
    background:
        linear-gradient(rgba(23, 88, 132, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(23, 88, 132, 0.05) 1px, transparent 1px);
    opacity: 0.8;
}

.game-dashboard-kicker,
.game-dashboard-panel-title span,
.game-dashboard-stat span,
.game-dashboard-flight-board span,
.game-dashboard-ledger span {
    color: #0b75b7;
}

.game-dashboard-hero h1,
.game-dashboard-stat strong,
.game-dashboard-panel-title h2,
.game-dashboard-flight-board strong,
.game-dashboard-ledger strong,
.game-dashboard-reputation p {
    color: #102b43;
}

.game-dashboard-hero-copy p:last-child,
.game-dashboard-stat small,
.game-dashboard-reputation small,
.game-dashboard-directive-panel p {
    color: #506a80;
}

.game-dashboard-radar {
    border-color: rgba(13, 119, 183, 0.22);
    background:
        repeating-radial-gradient(circle, rgba(13, 119, 183, 0.18) 0 1px, transparent 1px 3.2rem),
        linear-gradient(135deg, rgba(255, 255, 255, 0.58), rgba(194, 225, 243, 0.5));
    box-shadow: inset 0 0 36px rgba(11, 117, 183, 0.13), 0 22px 58px -42px rgba(11, 117, 183, 0.65);
}

.game-dashboard-radar::before,
.game-dashboard-radar::after {
    background: rgba(11, 117, 183, 0.24);
}

.game-dashboard-radar-sweep {
    background: conic-gradient(from 12deg, rgba(11, 117, 183, 0.22), transparent 28%, transparent);
}

.game-dashboard-radar-plane {
    background: #0b75b7;
    filter: drop-shadow(0 0 10px rgba(11, 117, 183, 0.35)) drop-shadow(0 5px 8px rgba(22, 41, 58, 0.16));
}

.game-dashboard-radar-route {
    background: linear-gradient(90deg, transparent, rgba(11, 117, 183, 0.58), transparent);
}

.game-dashboard-radar-dot {
    background: #18a46d;
    box-shadow: 0 0 0 5px rgba(24, 164, 109, 0.12), 0 0 18px rgba(24, 164, 109, 0.42);
}

.game-dashboard-radar-dot.dot-c {
    background: #f0b429;
    box-shadow: 0 0 0 5px rgba(240, 180, 41, 0.14), 0 0 18px rgba(240, 180, 41, 0.42);
}

.game-dashboard-stat::after {
    border-color: rgba(11, 117, 183, 0.1);
}

.game-dashboard-stat.is-cash {
    border-color: rgba(24, 164, 109, 0.24);
}

.game-dashboard-stat.is-profit,
.game-dashboard-directive-panel {
    border-color: rgba(240, 180, 41, 0.26);
}

.game-dashboard-reputation-ring {
    background:
        radial-gradient(circle at center, rgba(247, 252, 255, 0.94) 0 55%, transparent 56%),
        conic-gradient(#0b75b7 var(--reputation), rgba(11, 117, 183, 0.13) 0);
    box-shadow: inset 0 0 20px rgba(11, 117, 183, 0.08), 0 18px 40px -34px rgba(11, 117, 183, 0.65);
}

.game-dashboard-reputation-ring strong {
    color: #102b43;
}

.game-dashboard-reputation-ring span {
    color: #0b75b7;
}

.game-dashboard-flight-board div,
.game-dashboard-ledger div {
    border-color: rgba(67, 127, 166, 0.14);
    background: rgba(255, 255, 255, 0.5);
}

.game-dashboard-progress {
    background: rgba(11, 117, 183, 0.12);
}

.game-dashboard-progress div {
    background: linear-gradient(90deg, #0b75b7, #37a9e8);
    box-shadow: 0 0 16px rgba(55, 169, 232, 0.32);
}

.game-dashboard-runway {
    background:
        repeating-linear-gradient(90deg, transparent 0 1.15rem, rgba(255, 255, 255, 0.78) 1.15rem 1.65rem, transparent 1.65rem 2.8rem),
        linear-gradient(180deg, rgba(108, 137, 157, 0.38), rgba(65, 95, 119, 0.42));
}

.game-dashboard-runway span {
    background: #f0b429;
    box-shadow: 0 0 10px rgba(240, 180, 41, 0.62);
}

.game-dashboard-directive-panel {
    background:
        radial-gradient(240px 160px at 88% 22%, rgba(240, 180, 41, 0.13), transparent 72%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.84), rgba(228, 241, 249, 0.74));
}

.company-selector select {
    border: 1px solid var(--ad-border) !important;
    background: rgba(255, 255, 255, 0.9) !important;
    color: var(--ad-text) !important;
}

.auth-page {
    background:
        radial-gradient(720px 320px at 72% 18%, rgba(255, 255, 255, 0.9), transparent 66%),
        linear-gradient(180deg, #edf7fc 0%, #c8deed 100%);
}

.auth-card {
    border: 1px solid var(--ad-border);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(239, 248, 253, 0.96)),
        #f7fbfe;
    color: var(--ad-text);
    box-shadow: 0 28px 90px -54px rgba(8, 31, 49, 0.86), 0 1px 0 rgba(255, 255, 255, 0.88) inset;
}

.auth-card h1,
.auth-brand {
    color: var(--ad-text);
}

.auth-card p,
.auth-card label {
    color: var(--ad-muted);
}

.auth-brand span {
    border: 1px solid rgba(11, 117, 183, 0.3);
    background: rgba(11, 117, 183, 0.1);
    color: #0b75b7;
}

.auth-card input {
    border: 1px solid var(--ad-border) !important;
    background: rgba(255, 255, 255, 0.94) !important;
    color: var(--ad-text) !important;
}

.auth-card input:focus {
    border-color: #1688c7 !important;
    box-shadow: 0 0 0 0.18rem rgba(22, 136, 199, 0.2) !important;
}

.auth-primary-button {
    border: 1px solid transparent;
    background: linear-gradient(180deg, #1688c7, #075f94);
    color: #ffffff;
}

.auth-error {
    border: 1px solid rgba(198, 61, 53, 0.28);
    background: rgba(255, 241, 239, 0.95);
    color: var(--ad-danger);
}

/* Auth pages: game campaign access. */
.auth-page-v2 {
    position: relative;
    min-height: 100vh;
    overflow: hidden;
    display: grid;
    place-items: center;
    padding: clamp(1rem, 3vw, 2.5rem);
    background: #07101b;
    color: #f8fbff;
    isolation: isolate;
}

.auth-bg,
.auth-atmosphere {
    position: absolute;
    inset: 0;
    z-index: -2;
}

.auth-bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 60% center;
}

.auth-atmosphere {
    z-index: -1;
    background:
        linear-gradient(90deg, rgba(5, 12, 23, 0.96) 0%, rgba(5, 12, 23, 0.74) 45%, rgba(5, 12, 23, 0.38) 76%, rgba(5, 12, 23, 0.72) 100%),
        linear-gradient(180deg, rgba(5, 12, 23, 0.66), rgba(5, 12, 23, 0.94)),
        linear-gradient(rgba(137, 207, 255, 0.07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(137, 207, 255, 0.07) 1px, transparent 1px);
    background-size: auto, auto, 72px 72px, 72px 72px;
}

.auth-shell-v2 {
    width: min(100%, 1120px);
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(22rem, 27rem);
    gap: clamp(1.5rem, 4vw, 4rem);
    align-items: center;
}

.auth-shell-register {
    grid-template-columns: minmax(0, 0.88fr) minmax(26rem, 34rem);
}

.auth-brand-v2 {
    position: absolute;
    left: clamp(1rem, 3vw, 3rem);
    top: clamp(1rem, 3vw, 2rem);
    display: inline-flex;
    align-items: center;
    gap: 0.8rem;
    color: #ffffff;
    text-decoration: none;
}

.auth-brand-v2:hover {
    color: #ffffff;
}

.auth-brand-v2 .brand-mark {
    border-color: rgba(116, 213, 255, 0.32);
    background: rgba(5, 14, 27, 0.76);
}

.auth-brand-v2 strong {
    display: block;
    color: #ffffff;
    font-size: 1.05rem;
    font-weight: 900;
    line-height: 1;
}

.auth-brand-v2 small {
    display: block;
    margin-top: 0.35rem;
    color: #8ed8ff;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.auth-briefing {
    max-width: 42rem;
    padding-top: 4rem;
}

.auth-kicker,
.auth-card-header p,
.auth-intel dt {
    color: #8ed8ff;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.auth-kicker {
    width: fit-content;
    margin: 0;
    padding: 0.48rem 0.72rem;
    border: 1px solid rgba(142, 216, 255, 0.24);
    border-radius: 999px;
    background: rgba(5, 14, 27, 0.48);
}

.auth-briefing h1 {
    max-width: 9.5ch;
    margin: 1.2rem 0 0;
    color: #ffffff;
    font-size: clamp(3.2rem, 6vw, 5.4rem);
    font-weight: 900;
    line-height: 0.94;
    text-shadow: 0 22px 70px rgba(0, 0, 0, 0.58);
}

.auth-briefing p:not(.auth-kicker) {
    max-width: 36rem;
    margin: 1.3rem 0 0;
    color: #d3e1ef;
    font-size: 1.08rem;
    line-height: 1.65;
    text-shadow: 0 8px 28px rgba(0, 0, 0, 0.7);
}

.auth-intel {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.65rem;
    margin: 2rem 0 0;
}

.auth-intel div {
    border: 1px solid rgba(201, 236, 255, 0.14);
    border-radius: 0.82rem;
    background:
        linear-gradient(180deg, rgba(8, 22, 39, 0.72), rgba(6, 16, 29, 0.58)),
        rgba(5, 14, 27, 0.58);
    padding: 0.86rem;
    box-shadow: 0 22px 60px -44px rgba(0, 0, 0, 0.92);
    backdrop-filter: blur(12px);
}

.auth-intel dd {
    margin: 0.35rem 0 0;
    color: #ffffff;
    font-size: 1.18rem;
    font-weight: 900;
}

.auth-card-v2 {
    position: relative;
    overflow: hidden;
    width: 100%;
    border: 1px solid rgba(201, 236, 255, 0.18);
    border-radius: 1.05rem;
    background:
        linear-gradient(180deg, rgba(8, 22, 39, 0.78), rgba(5, 14, 27, 0.72)),
        rgba(5, 14, 27, 0.68);
    color: #f8fbff;
    padding: clamp(1.1rem, 2.5vw, 1.45rem);
    box-shadow: 0 34px 88px -48px rgba(0, 0, 0, 0.95);
    backdrop-filter: blur(18px);
}

.auth-card-v2::before {
    position: absolute;
    inset: 0;
    pointer-events: none;
    content: "";
    background:
        linear-gradient(rgba(142, 216, 255, 0.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(142, 216, 255, 0.08) 1px, transparent 1px);
    background-size: 28px 28px;
    mask-image: linear-gradient(180deg, black, transparent 78%);
}

.auth-card-v2 > * {
    position: relative;
}

.auth-card-header h2 {
    margin: 0.35rem 0 0;
    color: #ffffff;
    font-size: 2rem;
    font-weight: 900;
}

.auth-card-header span {
    display: block;
    margin-top: 0.45rem;
    color: #b9c9d9;
    font-size: 0.95rem;
}

.auth-form-v2 {
    display: grid;
    gap: 0.88rem;
    margin-top: 1.3rem;
}

.auth-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.88rem;
}

.auth-form-v2 label {
    display: grid;
    gap: 0.42rem;
    color: #dcecff;
    font-size: 0.82rem;
    font-weight: 850;
}

.auth-form-v2 input {
    width: 100%;
    min-height: 2.8rem;
    border: 1px solid rgba(201, 236, 255, 0.18) !important;
    border-radius: 0.72rem;
    background: rgba(5, 14, 27, 0.58) !important;
    color: #ffffff !important;
    outline: none;
    padding: 0.75rem 0.85rem;
    font-size: 0.95rem;
}

.auth-form-v2 input:focus {
    border-color: rgba(142, 216, 255, 0.72) !important;
    box-shadow: 0 0 0 0.18rem rgba(142, 216, 255, 0.16) !important;
}

.auth-primary-button-v2 {
    min-height: 3.15rem;
    border: 1px solid rgba(255, 224, 116, 0.34);
    border-radius: 0.75rem;
    background: linear-gradient(180deg, #ffd45a, #e59f18);
    color: #111927;
    font-weight: 900;
    box-shadow: 0 18px 54px -28px rgba(255, 204, 73, 0.88);
}

.auth-primary-button-v2:hover {
    background: linear-gradient(180deg, #ffe27b, #f1b02a);
}

.auth-error-v2 {
    margin-top: 1rem;
    border: 1px solid rgba(255, 121, 114, 0.28);
    border-radius: 0.72rem;
    background: rgba(127, 29, 29, 0.38);
    color: #ffd1cd;
    padding: 0.82rem 0.9rem;
}

.auth-switch {
    margin: 1rem 0 0;
    color: #b9c9d9 !important;
    font-size: 0.9rem;
}

.auth-switch a {
    color: #ffd45a;
    font-weight: 900;
    text-decoration: none;
}

.auth-switch a:hover {
    color: #ffe27b;
}

@media (max-width: 920px) {
    .auth-page-v2 {
        place-items: start center;
    }

    .auth-shell-v2,
    .auth-shell-register {
        grid-template-columns: 1fr;
        padding-top: 5.5rem;
    }

    .auth-briefing {
        max-width: none;
        padding-top: 0;
    }

    .auth-card-v2 {
        max-width: 36rem;
    }
}

@media (max-width: 560px) {
    .auth-page-v2 {
        padding: 0.85rem;
    }

    .auth-brand-v2 {
        left: 0.85rem;
        top: 0.85rem;
    }

    .auth-brand-v2 small {
        display: none;
    }

    .auth-shell-v2,
    .auth-shell-register {
        padding-top: 5rem;
    }

    .auth-briefing h1 {
        font-size: 3rem;
    }

    .auth-briefing p:not(.auth-kicker) {
        font-size: 0.98rem;
    }

    .auth-intel,
    .auth-form-grid {
        grid-template-columns: 1fr;
    }
}

.settings-time-zone-select {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.settings-toggle {
    position: relative;
    display: inline-flex;
    width: 2.85rem;
    height: 1.55rem;
    flex: 0 0 auto;
}

.settings-toggle input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.settings-toggle > span {
    position: relative;
    width: 100%;
    height: 100%;
    border: 1px solid #94a3b8;
    border-radius: 999px;
    background: #cbd5e1;
    transition: background-color 0.18s ease, border-color 0.18s ease;
}

.settings-toggle > span::after {
    position: absolute;
    top: 0.17rem;
    left: 0.17rem;
    width: 1.08rem;
    height: 1.08rem;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.28);
    content: "";
    transition: transform 0.18s ease;
}

.settings-toggle input:checked + span {
    border-color: #0e7490;
    background: #0e7490;
}

.settings-toggle input:checked + span::after {
    transform: translateX(1.28rem);
}

.settings-toggle input:focus-visible + span {
    outline: 3px solid rgba(6, 182, 212, 0.28);
    outline-offset: 2px;
}

.flight-plan-modal {
    display: flex;
    max-height: calc(100vh - 2rem);
    max-height: calc(100dvh - 2rem);
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, 0.22);
    background: #07101b !important;
    color: var(--ad-text);
    box-shadow: 0 34px 120px -44px rgba(0, 0, 0, 1);
}

.flight-plan-modal-header {
    display: flex;
    flex: 0 0 auto;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.25rem 1.4rem;
    border-bottom: 1px solid rgba(148, 163, 184, 0.16);
    background:
        linear-gradient(180deg, rgba(17, 29, 45, 0.98), rgba(10, 20, 33, 0.98)),
        #0a1421;
}

.flight-plan-kicker {
    margin: 0 0 0.35rem;
    color: #8fb4f7;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.flight-plan-modal-header h2 {
    margin: 0;
    color: #ffffff;
    font-size: 1.35rem;
    font-weight: 800;
}

.flight-plan-modal-header p:last-child {
    margin: 0.35rem 0 0;
    color: #9fb0c5;
    font-size: 0.95rem;
}

.flight-plan-close {
    display: inline-flex;
    width: 2.35rem;
    height: 2.35rem;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 0.6rem;
    background: #142031;
    color: #dce6f2;
    font-weight: 800;
}

.flight-plan-modal-body {
    display: grid;
    min-height: 0;
    overflow-y: auto;
    gap: 1.05rem;
    padding: 1.1rem 1.4rem 1.25rem;
    background: #07101b;
}

.flight-plan-alert {
    margin: 1rem 1.4rem 0;
    border: 1px solid rgba(239, 107, 98, 0.28);
    border-radius: 0.65rem;
    background: rgba(239, 107, 98, 0.11);
    color: #ffb3ad;
    padding: 0.75rem 0.9rem;
    font-size: 0.9rem;
}

.flight-plan-summary {
    display: grid;
    order: 1;
    grid-template-columns: 1.35fr repeat(3, minmax(0, 1fr));
    gap: 0.7rem;
}

.flight-plan-section-base {
    order: 2;
}

.flight-plan-section-prices {
    order: 3;
}

.flight-plan-section-operations {
    order: 4;
}

.flight-plan-summary div,
.flight-plan-section {
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 0.85rem;
}

.flight-plan-summary div {
    min-width: 0;
    padding: 0.9rem 1rem;
    background:
        linear-gradient(180deg, rgba(28, 43, 63, 0.98), rgba(19, 32, 49, 0.98)),
        #142033;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.04) inset;
}

.flight-plan-summary span,
.flight-plan-section-title span,
.operation-board th {
    color: #7f91a8;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.flight-plan-summary strong {
    display: block;
    overflow: hidden;
    margin-top: 0.35rem;
    color: #ffffff;
    font-size: 1rem;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.flight-plan-summary small {
    display: block;
    margin-top: 0.2rem;
    color: #8294aa;
    font-size: 0.72rem;
}

.flight-plan-section {
    position: relative;
    padding: 1rem;
    background:
        linear-gradient(180deg, rgba(18, 31, 48, 0.98), rgba(12, 23, 37, 0.98)),
        #0d1827;
    box-shadow: 0 16px 36px -34px rgba(0, 0, 0, 1);
}

.flight-plan-section::before {
    position: absolute;
    inset: 1rem auto 1rem 0;
    width: 3px;
    border-radius: 999px;
    background: #38bdf8;
    content: "";
}

.flight-plan-section-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.9rem;
}

.flight-plan-section-title h3 {
    margin: 0.12rem 0 0;
    color: #ffffff;
    font-size: 1rem;
    font-weight: 800;
}

.flight-plan-time-reference {
    display: block;
    margin-top: 0.22rem;
    color: #64748b;
    font-size: 0.75rem;
    font-weight: 700;
}

.flight-plan-form-grid,
.flight-plan-price-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.8rem;
}

.flight-plan-price-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.flight-plan-form-grid label,
.flight-plan-price-grid label {
    display: grid;
    gap: 0.45rem;
    color: #cbd6e4;
    font-size: 0.9rem;
    font-weight: 700;
}

.flight-plan-form-grid input,
.flight-plan-form-grid select,
.flight-plan-price-grid input,
.operation-board input,
.operation-board select {
    width: 100%;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    border-radius: 0.65rem;
    background: #0a1422 !important;
    color: #e6edf5 !important;
    font-size: 0.95rem;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.035) inset;
}

.flight-plan-form-grid input,
.flight-plan-form-grid select,
.flight-plan-price-grid input {
    min-height: 2.75rem;
    padding: 0.65rem 0.8rem;
}

.flight-plan-days {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 0.55rem;
    margin-top: 0.9rem;
}

.flight-plan-days label {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 2.65rem;
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 0.65rem;
    background: #0a1422;
    color: #cbd6e4;
    padding: 0.55rem 0.7rem;
    font-weight: 700;
}

.flight-plan-days input {
    width: 1rem;
    height: 1rem;
    accent-color: #38bdf8;
}

.operation-board {
    overflow-x: auto;
}

.operation-board table {
    width: 100%;
    min-width: 58rem;
    border-collapse: separate;
    border-spacing: 0 0.55rem;
}

.operation-board th {
    padding: 0 0.7rem 0.15rem;
    text-align: left;
}

.operation-board td {
    padding: 0.7rem;
    border-top: 1px solid rgba(148, 163, 184, 0.12);
    border-bottom: 1px solid rgba(148, 163, 184, 0.12);
    background: #15243a;
    color: #cbd6e4;
    vertical-align: middle;
}

.operation-board tr td:first-child {
    border-left: 1px solid rgba(148, 163, 184, 0.12);
    border-top-left-radius: 0.75rem;
    border-bottom-left-radius: 0.75rem;
}

.operation-board tr td:last-child {
    border-right: 1px solid rgba(148, 163, 184, 0.12);
    border-top-right-radius: 0.75rem;
    border-bottom-right-radius: 0.75rem;
}

.operation-board input,
.operation-board select {
    min-height: 2.55rem;
    padding: 0.55rem 0.7rem;
}

.operation-board strong {
    display: block;
    color: #ffffff;
    font-weight: 800;
}

.operation-board small {
    display: block;
    margin-top: 0.2rem;
    color: #8294aa;
    font-size: 0.75rem;
}

.flight-plan-outline-button,
.flight-plan-danger-button,
.flight-plan-secondary-button,
.flight-plan-primary-button {
    min-height: 2.4rem;
    border-radius: 0.65rem;
    padding: 0.6rem 0.85rem;
    font-size: 0.9rem;
    font-weight: 800;
}

.flight-plan-outline-button {
    border: 1px solid rgba(56, 189, 248, 0.5);
    background: rgba(56, 189, 248, 0.08);
    color: #8bd9ff;
}

.flight-plan-danger-button {
    border: 1px solid rgba(239, 107, 98, 0.32);
    background: rgba(239, 107, 98, 0.08);
    color: #ff9b94;
}

.flight-plan-modal-footer {
    display: flex;
    order: 5;
    justify-content: flex-end;
    gap: 0.75rem;
    padding-top: 0.25rem;
}

.flight-plan-secondary-button {
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: #142031;
    color: #dce6f2;
}

.flight-plan-primary-button {
    border: 1px solid transparent;
    background: #0b75b7;
    color: #ffffff;
}

@media (max-width: 900px) {
    .flight-plan-summary,
    .flight-plan-form-grid,
    .flight-plan-price-grid,
    .flight-plan-days {
        grid-template-columns: 1fr;
    }

    .flight-plan-modal-header,
    .flight-plan-modal-body {
        padding-inline: 1rem;
    }
}

/* Flight planning modal: light aviation glass treatment inspired by modern simulator menus. */
.flight-plan-modal {
    border: 1px solid rgba(96, 132, 160, 0.34);
    background:
        linear-gradient(180deg, rgba(238, 247, 252, 0.98), rgba(209, 228, 240, 0.98)),
        #d7e9f4 !important;
    color: #102033;
    box-shadow: 0 34px 120px -46px rgba(4, 21, 35, 0.82);
}

.flight-plan-modal-header {
    border-bottom: 1px solid rgba(78, 117, 148, 0.26);
    background:
        linear-gradient(180deg, rgba(247, 252, 255, 0.98), rgba(223, 239, 248, 0.98)),
        #e7f4fb;
}

.flight-plan-kicker {
    color: #0b75b7;
}

.flight-plan-modal-header h2 {
    color: #102033;
}

.flight-plan-modal-header p:last-child {
    color: #53687c;
}

.flight-plan-close {
    border-color: rgba(80, 117, 146, 0.28);
    background: rgba(255, 255, 255, 0.82);
    color: #17304a;
}

.flight-plan-modal-body {
    background:
        linear-gradient(180deg, rgba(214, 234, 246, 0.78), rgba(189, 215, 231, 0.9)),
        #c8deed;
}

.flight-plan-summary div {
    border-color: rgba(82, 121, 150, 0.22);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(236, 246, 252, 0.96)),
        #f4fbff;
    box-shadow: 0 18px 42px -34px rgba(16, 49, 75, 0.7), 0 1px 0 rgba(255, 255, 255, 0.82) inset;
}

.flight-plan-section {
    border-color: rgba(82, 121, 150, 0.24);
    background:
        linear-gradient(180deg, rgba(249, 253, 255, 0.96), rgba(232, 243, 250, 0.96)),
        #eef8fd;
    box-shadow: 0 18px 48px -36px rgba(16, 49, 75, 0.62);
}

.flight-plan-section::before {
    display: none;
}

.flight-plan-summary span,
.flight-plan-section-title span,
.operation-board th {
    color: #5b7288;
}

.flight-plan-summary strong,
.flight-plan-section-title h3,
.operation-board strong {
    color: #102033;
}

.flight-plan-form-grid label,
.flight-plan-price-grid label,
.flight-plan-days label {
    color: #22384f;
}

.flight-plan-form-grid input,
.flight-plan-form-grid select,
.flight-plan-price-grid input,
.operation-board input,
.operation-board select {
    border-color: rgba(70, 105, 132, 0.28) !important;
    background: rgba(255, 255, 255, 0.94) !important;
    color: #102033 !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.88) inset, 0 12px 28px -24px rgba(16, 49, 75, 0.7);
}

.flight-plan-days label {
    border-color: rgba(70, 105, 132, 0.22);
    background: rgba(255, 255, 255, 0.7);
}

.operation-board td {
    border-top-color: rgba(82, 121, 150, 0.18);
    border-bottom-color: rgba(82, 121, 150, 0.18);
    background: rgba(255, 255, 255, 0.82);
    color: #2b4057;
}

.operation-board tr td:first-child {
    border-left-color: rgba(82, 121, 150, 0.18);
}

.operation-board tr td:last-child {
    border-right-color: rgba(82, 121, 150, 0.18);
}

.operation-board small {
    color: #61778c;
}

.flight-plan-outline-button {
    border-color: rgba(0, 126, 190, 0.45);
    background: rgba(224, 244, 255, 0.92);
    color: #075f94;
}

.flight-plan-danger-button {
    border-color: rgba(202, 83, 75, 0.35);
    background: rgba(255, 241, 239, 0.92);
    color: #b5322a;
}

.flight-plan-secondary-button {
    border-color: rgba(70, 105, 132, 0.28);
    background: rgba(255, 255, 255, 0.82);
    color: #20374f;
}

.flight-plan-primary-button {
    background: #0b75b7;
    color: #ffffff;
    box-shadow: 0 18px 34px -25px rgba(7, 95, 148, 0.86);
}

input:not([type="checkbox"]),
select,
textarea {
    background-color: var(--ad-surface-solid-2) !important;
    border-color: var(--ad-border) !important;
    color: var(--ad-text) !important;
}

input::placeholder,
textarea::placeholder {
    color: var(--ad-muted-2) !important;
}

input:focus,
select:focus,
textarea:focus {
    border-color: var(--ad-accent) !important;
    box-shadow: 0 0 0 0.2rem var(--ad-accent-soft) !important;
}

/* Flight planning modal: final MSFS-inspired light cockpit pass. */
.flight-plan-modal.modal-surface-solid {
    border: 1px solid rgba(103, 143, 174, 0.42);
    background:
        radial-gradient(900px 320px at 76% -8%, rgba(255, 255, 255, 0.92), transparent 62%),
        linear-gradient(180deg, #f4fbff 0%, #d7eaf6 46%, #bed7e8 100%) !important;
    color: #102033;
    box-shadow: 0 38px 120px -48px rgba(8, 31, 49, 0.9);
}

.flight-plan-modal .flight-plan-modal-header {
    border-bottom: 1px solid rgba(77, 116, 146, 0.24);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(233, 245, 252, 0.96)),
        #eef8fd;
}

.flight-plan-modal .flight-plan-modal-body {
    background:
        linear-gradient(180deg, rgba(214, 233, 245, 0.92), rgba(186, 210, 226, 0.94)),
        #c7deed;
}

.flight-plan-modal .flight-plan-summary div,
.flight-plan-modal .flight-plan-section {
    border: 1px solid rgba(82, 121, 150, 0.2);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(242, 248, 252, 0.92)),
        #f7fbfe;
    box-shadow: 0 18px 48px -38px rgba(17, 52, 78, 0.7), 0 1px 0 rgba(255, 255, 255, 0.9) inset;
}

.flight-plan-modal .flight-plan-section::before {
    display: none;
}

.flight-plan-modal .flight-plan-kicker,
.flight-plan-modal .flight-plan-section-title span {
    color: #0a76b7;
}

.flight-plan-modal .flight-plan-modal-header h2,
.flight-plan-modal .flight-plan-summary strong,
.flight-plan-modal .flight-plan-section-title h3,
.flight-plan-modal .operation-board strong {
    color: #102033;
}

.flight-plan-modal .flight-plan-modal-header p:last-child,
.flight-plan-modal .flight-plan-summary span,
.flight-plan-modal .flight-plan-summary small,
.flight-plan-modal .operation-board th,
.flight-plan-modal .operation-board small {
    color: #5c7288;
}

.flight-plan-modal .flight-plan-form-grid label,
.flight-plan-modal .flight-plan-price-grid label,
.flight-plan-modal .flight-plan-days label {
    color: #22384f;
}

.flight-plan-modal .flight-plan-form-grid input,
.flight-plan-modal .flight-plan-form-grid select,
.flight-plan-modal .flight-plan-price-grid input,
.flight-plan-modal .operation-board input,
.flight-plan-modal .operation-board select {
    border-color: rgba(70, 105, 132, 0.28) !important;
    background-color: rgba(255, 255, 255, 0.94) !important;
    color: #102033 !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.9) inset, 0 12px 28px -24px rgba(16, 49, 75, 0.75);
}

.flight-plan-modal .flight-plan-form-grid input:focus,
.flight-plan-modal .flight-plan-form-grid select:focus,
.flight-plan-modal .flight-plan-price-grid input:focus,
.flight-plan-modal .operation-board input:focus,
.flight-plan-modal .operation-board select:focus {
    border-color: #1688c7 !important;
    box-shadow: 0 0 0 0.18rem rgba(22, 136, 199, 0.2), 0 12px 28px -24px rgba(16, 49, 75, 0.75) !important;
}

.flight-plan-modal .flight-plan-days label {
    border-color: rgba(70, 105, 132, 0.2);
    background: rgba(255, 255, 255, 0.66);
}

.flight-plan-modal .flight-plan-days input {
    accent-color: #1688c7;
}

.flight-plan-modal .operation-board td {
    border-top-color: rgba(82, 121, 150, 0.16);
    border-bottom-color: rgba(82, 121, 150, 0.16);
    background: rgba(255, 255, 255, 0.78);
    color: #2d4258;
}

.flight-plan-modal .operation-board tr td:first-child {
    border-left-color: rgba(82, 121, 150, 0.16);
}

.flight-plan-modal .operation-board tr td:last-child {
    border-right-color: rgba(82, 121, 150, 0.16);
}

.flight-plan-modal .flight-plan-close,
.flight-plan-modal .flight-plan-secondary-button {
    border-color: rgba(70, 105, 132, 0.25);
    background: rgba(255, 255, 255, 0.8);
    color: #20374f;
}

.flight-plan-modal .flight-plan-outline-button {
    border-color: rgba(0, 126, 190, 0.42);
    background: rgba(229, 246, 255, 0.92);
    color: #075f94;
}

.flight-plan-modal .flight-plan-danger-button {
    border-color: rgba(202, 83, 75, 0.34);
    background: rgba(255, 241, 239, 0.94);
    color: #b5322a;
}

.flight-plan-modal .flight-plan-primary-button {
    background: linear-gradient(180deg, #1688c7, #075f94);
    color: #ffffff;
    box-shadow: 0 18px 34px -25px rgba(7, 95, 148, 0.9);
}

/* Landing page */
.landing-shell {
    min-height: 100vh;
    overflow: hidden;
    background: #070b12;
    color: var(--ad-text);
}

.landing-hero {
    position: relative;
    min-height: 100vh;
    padding: 1.5rem clamp(1rem, 3vw, 3rem) 1.25rem;
    isolation: isolate;
}

.landing-backdrop,
.landing-backdrop::before,
.landing-backdrop::after {
    position: absolute;
    inset: 0;
    z-index: -1;
    content: "";
}

.landing-backdrop {
    background:
        linear-gradient(125deg, rgba(7, 11, 18, 0.98) 0%, rgba(10, 16, 25, 0.97) 52%, rgba(30, 27, 20, 0.9) 100%),
        #070b12;
}

.landing-backdrop::before {
    opacity: 0.16;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.09) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.09) 1px, transparent 1px);
    background-size: 72px 72px;
    mask-image: linear-gradient(180deg, black 0%, transparent 86%);
}

.landing-backdrop::after {
    background:
        radial-gradient(560px 320px at 72% 34%, rgba(34, 211, 238, 0.16), transparent 68%),
        radial-gradient(460px 300px at 90% 76%, rgba(246, 166, 35, 0.13), transparent 72%);
}

.landing-header,
.hero-grid,
.landing-feature-strip {
    width: min(100%, 1180px);
    margin-inline: auto;
}

.landing-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.brand-lockup,
.landing-actions,
.hero-cta,
.ops-topbar,
.ops-panel,
.hero-metrics {
    display: flex;
    align-items: center;
}

.brand-lockup {
    min-width: 0;
    gap: 0.8rem;
    color: #ffffff;
    text-decoration: none;
}

.brand-lockup:hover {
    color: #ffffff;
}

.brand-mark {
    display: grid;
    width: 3rem;
    height: 3rem;
    flex: 0 0 auto;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(103, 232, 249, 0.18);
    border-radius: 0.65rem;
    background: rgba(6, 18, 37, 0.88);
    box-shadow: 0 18px 48px -30px rgba(34, 211, 238, 0.8);
}

.brand-mark img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.brand-copy {
    min-width: 0;
}

.brand-name,
.brand-tagline,
.eyebrow,
.hero-metrics dt,
.panel-label,
.ops-topbar,
.ops-table {
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.brand-name {
    display: block;
    font-size: 1.08rem;
    font-weight: 800;
    line-height: 1;
}

.brand-tagline {
    display: block;
    margin-top: 0.35rem;
    color: rgba(125, 211, 252, 0.72);
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.2em;
}

.landing-actions {
    flex: 0 0 auto;
    gap: 0.55rem;
}

.landing-link,
.landing-button {
    min-height: 2.65rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.6rem;
    text-decoration: none;
}

.landing-link {
    display: inline-flex;
    padding-inline: 0.9rem;
    color: #d8e3ef;
    font-size: 0.92rem;
    font-weight: 700;
}

.landing-link:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.055);
}

.landing-button {
    display: inline-flex;
    gap: 0.5rem;
    padding: 0.75rem 1.05rem;
    border: 1px solid transparent;
    font-size: 0.92rem;
    font-weight: 800;
    line-height: 1;
}

.landing-button-primary {
    background: linear-gradient(180deg, #1688c7, #075f94);
    color: #ffffff;
    box-shadow: 0 18px 42px -28px rgba(7, 95, 148, 0.95);
}

.landing-button-primary:hover {
    color: #ffffff;
    background: linear-gradient(180deg, #229ddd, #0b75b7);
}

.landing-button-secondary {
    border-color: rgba(255, 255, 255, 0.11);
    background: rgba(255, 255, 255, 0.045);
    color: #ffffff;
}

.landing-button-secondary:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.075);
}

.hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(22rem, 0.98fr);
    gap: clamp(2rem, 5vw, 5.25rem);
    align-items: center;
    min-height: calc(100vh - 13.5rem);
    padding-block: clamp(3.5rem, 7vw, 5.5rem) 2rem;
}

.hero-copy {
    max-width: 43rem;
}

.eyebrow {
    margin: 0;
    color: #f8cf61;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.77rem;
    font-weight: 800;
    letter-spacing: 0.22em;
}

.hero-copy h1 {
    max-width: 12ch;
    margin: 1.15rem 0 0;
    color: #ffffff;
    font-size: clamp(3rem, 6vw, 5.65rem);
    font-weight: 800;
    line-height: 0.98;
}

.hero-lede {
    max-width: 37rem;
    margin: 1.35rem 0 0;
    color: #b8c6d6;
    font-size: clamp(1.02rem, 1.45vw, 1.22rem);
    line-height: 1.65;
}

.hero-cta {
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 2rem;
}

.hero-metrics {
    flex-wrap: wrap;
    gap: 0.75rem;
    margin: 2.35rem 0 0;
}

.hero-metrics div {
    min-width: 8.5rem;
    padding: 0.88rem 1rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 0.75rem;
    background: rgba(14, 23, 35, 0.7);
}

.hero-metrics dt {
    color: #7f91a8;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.66rem;
    font-weight: 800;
}

.hero-metrics dd {
    margin: 0.35rem 0 0;
    color: #ffffff;
    font-size: 1.22rem;
    font-weight: 800;
}

.operations-stage {
    position: relative;
    min-width: 0;
}

.landing-hero-image {
    position: relative;
    overflow: hidden;
    min-height: clamp(21rem, 42vw, 34rem);
    margin: 0;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 1.15rem;
    background: rgba(9, 16, 27, 0.9);
    box-shadow: 0 42px 110px -58px rgba(0, 0, 0, 1);
}

.landing-hero-image::after {
    position: absolute;
    inset: 0;
    pointer-events: none;
    content: "";
    background:
        linear-gradient(90deg, rgba(7, 11, 18, 0.26), transparent 46%),
        linear-gradient(180deg, transparent 58%, rgba(7, 11, 18, 0.24));
}

.landing-hero-image img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: inherit;
    object-fit: cover;
}

.operations-card {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 1rem;
    background:
        linear-gradient(180deg, rgba(18, 29, 43, 0.92), rgba(10, 16, 25, 0.92)),
        rgba(9, 16, 27, 0.9);
    box-shadow: 0 42px 110px -58px rgba(0, 0, 0, 1);
}

.operations-card::before {
    position: absolute;
    inset: 0;
    pointer-events: none;
    content: "";
    background: linear-gradient(135deg, rgba(125, 211, 252, 0.12), transparent 40%, rgba(248, 189, 58, 0.08));
}

.ops-topbar {
    position: relative;
    justify-content: space-between;
    padding: 1rem 1.15rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    color: #91a2b7;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.68rem;
    font-weight: 800;
}

.live-pill {
    border: 1px solid rgba(52, 211, 153, 0.24);
    border-radius: 999px;
    padding: 0.3rem 0.55rem;
    background: rgba(52, 211, 153, 0.1);
    color: #74f0b2;
}

.ops-map {
    position: relative;
    display: grid;
    min-height: clamp(17rem, 34vw, 24rem);
    place-items: center;
    overflow: hidden;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    background:
        linear-gradient(rgba(255, 255, 255, 0.055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.055) 1px, transparent 1px),
        radial-gradient(circle at center, rgba(34, 211, 238, 0.12), transparent 68%);
    background-size: 44px 44px, 44px 44px, auto;
}

.ops-map img {
    width: min(62%, 20rem);
    opacity: 0.42;
    filter: saturate(1.08);
}

.route-line {
    position: absolute;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, #8ed8ff, #1688c7, transparent);
    opacity: 0.72;
    transform-origin: center;
}

.route-line-one {
    top: 39%;
    left: 17%;
    width: 68%;
    transform: rotate(-10deg);
}

.route-line-two {
    top: 57%;
    left: 24%;
    width: 56%;
    transform: rotate(18deg);
}

.airport-dot {
    position: absolute;
    display: grid;
    min-width: 3.1rem;
    min-height: 2rem;
    place-items: center;
    border: 1px solid rgba(103, 232, 249, 0.28);
    border-radius: 999px;
    background: rgba(7, 11, 18, 0.82);
    color: #dff9ff;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.72rem;
    font-weight: 800;
    box-shadow: 0 0 0 5px rgba(103, 232, 249, 0.06);
}

.airport-dot-lis {
    left: 13%;
    top: 49%;
}

.airport-dot-jfk {
    right: 13%;
    top: 30%;
}

.airport-dot-gru {
    right: 21%;
    bottom: 20%;
}

.ops-panel {
    position: relative;
    justify-content: space-between;
    gap: 1rem;
    margin: -2.4rem 1rem 0;
    padding: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 0.85rem;
    background: rgba(16, 26, 39, 0.9);
    backdrop-filter: blur(18px);
}

.panel-label {
    display: block;
    color: #8192a8;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.66rem;
    font-weight: 800;
}

.ops-panel strong {
    display: block;
    margin-top: 0.25rem;
    color: #ffffff;
    font-size: 1.35rem;
}

.panel-score {
    color: #74f0b2;
    font-size: 1.5rem;
    font-weight: 800;
}

.ops-table {
    position: relative;
    display: grid;
    gap: 0.55rem;
    padding: 1rem;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.04em;
}

.ops-table div {
    display: grid;
    grid-template-columns: 0.8fr 1fr auto;
    gap: 0.75rem;
    align-items: center;
    padding: 0.72rem 0.85rem;
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 0.65rem;
    background: rgba(255, 255, 255, 0.035);
    color: #9babc0;
}

.ops-table strong {
    color: #74f0b2;
}

.landing-feature-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
    margin-top: -0.35rem;
}

.landing-feature-strip article {
    min-height: 8.4rem;
    padding: 1.1rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 0.85rem;
    background: rgba(13, 21, 32, 0.74);
}

.landing-feature-strip span {
    color: #f8cf61;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.72rem;
    font-weight: 800;
}

.landing-feature-strip h2 {
    margin: 0.45rem 0 0;
    color: #ffffff;
    font-size: 1rem;
    font-weight: 800;
}

.landing-feature-strip p {
    margin: 0.45rem 0 0;
    color: #98a9bc;
    font-size: 0.92rem;
    line-height: 1.45;
}

@media (max-width: 920px) {
    .hero-grid {
        grid-template-columns: 1fr;
        min-height: auto;
        padding-block: 3.5rem 1.25rem;
    }

    .hero-copy {
        max-width: none;
    }

    .hero-copy h1 {
        max-width: 13ch;
    }

    .operations-card {
        max-width: 40rem;
        margin-inline: auto;
    }

    .landing-feature-strip {
        grid-template-columns: 1fr;
        padding-bottom: 1rem;
    }
}

@media (max-width: 560px) {
    .landing-hero {
        padding-top: 1rem;
    }

    .landing-header {
        align-items: flex-start;
    }

    .brand-tagline {
        display: none;
    }

    .landing-actions {
        gap: 0.35rem;
    }

    .landing-link,
    .landing-button {
        min-height: 2.35rem;
        padding-inline: 0.72rem;
        font-size: 0.82rem;
    }

    .hero-grid {
        padding-top: 3rem;
    }

    .hero-copy h1 {
        font-size: clamp(2.55rem, 15vw, 3.4rem);
    }

    .hero-metrics {
        display: grid;
        grid-template-columns: 1fr;
    }

    .hero-metrics div {
        min-width: 0;
    }

    .ops-map {
        min-height: 15rem;
    }

    .ops-table div {
        grid-template-columns: 1fr;
        gap: 0.25rem;
    }
}

/* Landing page: align with the light aviation simulator theme. */
.landing-shell {
    background:
        radial-gradient(980px 420px at 82% 12%, rgba(255, 255, 255, 0.92), transparent 64%),
        linear-gradient(180deg, #edf7fc 0%, #d7e8f4 52%, #c3dbea 100%);
    color: var(--ad-text);
}

.landing-backdrop {
    background:
        linear-gradient(180deg, rgba(237, 247, 252, 0.96), rgba(198, 220, 234, 0.94)),
        #d7e8f4;
}

.landing-backdrop::before {
    opacity: 0.34;
    background-image:
        linear-gradient(rgba(82, 121, 150, 0.18) 1px, transparent 1px),
        linear-gradient(90deg, rgba(82, 121, 150, 0.18) 1px, transparent 1px);
}

.landing-backdrop::after {
    background:
        radial-gradient(560px 320px at 72% 34%, rgba(255, 255, 255, 0.58), transparent 68%),
        radial-gradient(460px 300px at 90% 76%, rgba(11, 117, 183, 0.14), transparent 72%);
}

.brand-lockup,
.brand-lockup:hover,
.brand-name,
.hero-copy h1,
.hero-metrics dd,
.landing-feature-strip h2,
.ops-panel strong {
    color: var(--ad-text);
}

.brand-mark {
    border-color: rgba(11, 117, 183, 0.22);
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 18px 48px -34px rgba(16, 49, 75, 0.62);
}

.brand-tagline,
.hero-lede,
.landing-feature-strip p,
.panel-label,
.ops-topbar,
.ops-table div,
.hero-metrics dt {
    color: var(--ad-muted);
}

.eyebrow,
.landing-feature-strip span {
    color: #0b75b7;
}

.landing-link {
    color: #2f455c;
}

.landing-link:hover {
    color: #075f94;
    background: rgba(11, 117, 183, 0.08);
}

.landing-button-primary {
    background: linear-gradient(180deg, #1688c7, #075f94);
    color: #ffffff;
}

.landing-button-primary:hover {
    color: #ffffff;
    background: linear-gradient(180deg, #229ddd, #0b75b7);
}

.landing-button-secondary,
.hero-metrics div,
.landing-feature-strip article,
.operations-card,
.ops-panel,
.ops-table div {
    border-color: var(--ad-border);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(241, 248, 252, 0.88)),
        #f7fbfe;
    color: var(--ad-text);
    box-shadow: 0 18px 48px -38px rgba(16, 49, 75, 0.66);
}

.landing-button-secondary:hover {
    color: #075f94;
    background: rgba(229, 246, 255, 0.94);
}

.operations-card::before {
    background: linear-gradient(135deg, rgba(11, 117, 183, 0.11), transparent 42%, rgba(240, 165, 22, 0.08));
}

.ops-topbar {
    border-bottom-color: var(--ad-border);
}

.live-pill {
    border-color: rgba(23, 139, 97, 0.24);
    background: rgba(23, 139, 97, 0.1);
    color: #0f7b58;
}

.ops-map {
    border-bottom-color: var(--ad-border);
    background:
        linear-gradient(rgba(82, 121, 150, 0.12) 1px, transparent 1px),
        linear-gradient(90deg, rgba(82, 121, 150, 0.12) 1px, transparent 1px),
        radial-gradient(circle at center, rgba(255, 255, 255, 0.7), transparent 68%);
    background-size: 44px 44px, 44px 44px, auto;
}

.ops-map img {
    opacity: 0.2;
}

.airport-dot {
    border-color: rgba(11, 117, 183, 0.28);
    background: rgba(255, 255, 255, 0.9);
    color: #075f94;
    box-shadow: 0 0 0 5px rgba(11, 117, 183, 0.07);
}

.panel-score,
.ops-table strong {
    color: #0f7b58;
}

/* Landing page: cinematic game campaign shell. */
.landing-shell-v2 {
    min-height: 100vh;
    background: #07101b;
    color: #f8fbff;
}

.landing-hero-v2 {
    position: relative;
    min-height: 100vh;
    overflow: hidden;
    padding: 1.35rem clamp(1rem, 3vw, 3rem) 1rem;
    isolation: isolate;
}

.landing-hero-bg,
.landing-hero-atmosphere {
    position: absolute;
    inset: 0;
    z-index: -2;
}

.landing-hero-bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 58% center;
}

.landing-hero-atmosphere {
    z-index: -1;
    background:
        linear-gradient(90deg, rgba(5, 12, 23, 0.94) 0%, rgba(5, 12, 23, 0.72) 38%, rgba(5, 12, 23, 0.22) 70%, rgba(5, 12, 23, 0.58) 100%),
        linear-gradient(180deg, rgba(5, 12, 23, 0.62) 0%, transparent 48%, rgba(5, 12, 23, 0.92) 100%),
        linear-gradient(rgba(137, 207, 255, 0.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(137, 207, 255, 0.08) 1px, transparent 1px);
    background-size: auto, auto, 76px 76px, 76px 76px;
}

.landing-header-v2,
.landing-command-grid,
.landing-systems {
    width: min(100%, 1240px);
    margin-inline: auto;
}

.landing-header-v2 {
    position: relative;
    z-index: 2;
    padding: 0.35rem;
    border: 1px solid rgba(201, 236, 255, 0.16);
    border-radius: 0.95rem;
    background: rgba(5, 14, 27, 0.42);
    box-shadow: 0 18px 68px -48px rgba(0, 0, 0, 0.92);
    backdrop-filter: blur(16px);
}

.brand-lockup-v2 .brand-mark {
    border-color: rgba(116, 213, 255, 0.32);
    background: rgba(5, 14, 27, 0.76);
    box-shadow: 0 18px 44px -30px rgba(125, 211, 252, 0.94);
}

.brand-lockup-v2 .brand-name,
.brand-lockup-v2:hover .brand-name {
    color: #ffffff;
}

.brand-lockup-v2 .brand-tagline {
    color: #8ed8ff;
}

.landing-link-v2 {
    color: #dcecff;
}

.landing-link-v2:hover {
    color: #ffffff;
    background: rgba(142, 216, 255, 0.12);
}

.landing-button-v2 {
    border-radius: 0.7rem;
}

.landing-button-v2.landing-button-primary {
    border-color: rgba(255, 224, 116, 0.34);
    background: linear-gradient(180deg, #ffd45a, #e59f18);
    color: #111927;
    box-shadow: 0 18px 54px -28px rgba(255, 204, 73, 0.88);
}

.landing-button-v2.landing-button-primary:hover {
    background: linear-gradient(180deg, #ffe27b, #f1b02a);
    color: #111927;
}

.landing-button-v2.landing-button-secondary {
    border-color: rgba(201, 236, 255, 0.18);
    background: rgba(7, 19, 35, 0.58);
    color: #f8fbff;
}

.landing-button-v2.landing-button-secondary:hover {
    background: rgba(22, 136, 199, 0.28);
    color: #ffffff;
}

.landing-button-xl {
    min-height: 3.25rem;
    padding-inline: 1.35rem;
}

.landing-command-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(19rem, 25rem);
    gap: 2rem;
    align-items: end;
    min-height: calc(100vh - 13rem);
    padding-block: 5rem 2rem;
}

.hero-copy-v2 {
    max-width: 48rem;
}

.eyebrow-v2 {
    width: fit-content;
    margin: 0;
    padding: 0.48rem 0.72rem;
    border: 1px solid rgba(142, 216, 255, 0.24);
    border-radius: 999px;
    background: rgba(5, 14, 27, 0.48);
    color: #8ed8ff;
    box-shadow: 0 12px 44px -32px rgba(142, 216, 255, 0.92);
}

.hero-copy-v2 h1 {
    max-width: 9.5ch;
    margin: 1.2rem 0 0;
    color: #ffffff;
    font-size: 5.4rem;
    font-weight: 900;
    line-height: 0.94;
    text-shadow: 0 22px 70px rgba(0, 0, 0, 0.58);
}

.hero-lede-v2 {
    max-width: 38rem;
    margin-top: 1.35rem;
    color: #d3e1ef;
    font-size: 1.18rem;
    line-height: 1.65;
    text-shadow: 0 8px 28px rgba(0, 0, 0, 0.7);
}

.hero-cta-v2 {
    margin-top: 2rem;
}

.command-hud {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(201, 236, 255, 0.18);
    border-radius: 1.05rem;
    background:
        linear-gradient(180deg, rgba(8, 22, 39, 0.74), rgba(5, 14, 27, 0.64)),
        rgba(5, 14, 27, 0.62);
    padding: 1rem;
    box-shadow: 0 34px 88px -48px rgba(0, 0, 0, 0.95);
    backdrop-filter: blur(18px);
}

.command-hud::before {
    position: absolute;
    inset: 0;
    pointer-events: none;
    content: "";
    background:
        linear-gradient(rgba(142, 216, 255, 0.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(142, 216, 255, 0.08) 1px, transparent 1px);
    background-size: 28px 28px;
    mask-image: linear-gradient(180deg, black, transparent 78%);
}

.hud-topline,
.hud-route,
.hud-status-list span {
    position: relative;
    display: flex;
    align-items: center;
}

.hud-topline {
    justify-content: space-between;
    gap: 1rem;
    color: #8ed8ff;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.hud-topline strong {
    border: 1px solid rgba(99, 255, 184, 0.26);
    border-radius: 999px;
    padding: 0.28rem 0.48rem;
    background: rgba(99, 255, 184, 0.1);
    color: #63ffb8;
    font-size: 0.64rem;
}

.hud-metrics {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.55rem;
    margin: 1rem 0 0;
}

.hud-metrics div {
    border: 1px solid rgba(201, 236, 255, 0.12);
    border-radius: 0.7rem;
    background: rgba(255, 255, 255, 0.055);
    padding: 0.72rem;
}

.hud-metrics dt {
    color: #9cb5ca;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.hud-metrics dd {
    margin: 0.32rem 0 0;
    color: #ffffff;
    font-size: 1.25rem;
    font-weight: 900;
}

.hud-route {
    justify-content: space-between;
    gap: 0.85rem;
    margin-top: 1rem;
    padding: 1rem 0.75rem;
    border: 1px solid rgba(255, 212, 90, 0.18);
    border-radius: 0.8rem;
    background: rgba(255, 212, 90, 0.08);
}

.hud-airport {
    color: #ffffff;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 1.15rem;
    font-weight: 900;
}

.hud-vector {
    position: relative;
    height: 2px;
    flex: 1 1 auto;
    background: linear-gradient(90deg, #ffd45a, #8ed8ff);
}

.hud-vector::after {
    position: absolute;
    right: -1px;
    top: 50%;
    width: 0.55rem;
    height: 0.55rem;
    border-right: 2px solid #8ed8ff;
    border-top: 2px solid #8ed8ff;
    content: "";
    transform: translateY(-50%) rotate(45deg);
}

.hud-status-list {
    position: relative;
    display: grid;
    gap: 0.5rem;
    margin-top: 0.8rem;
}

.hud-status-list span {
    justify-content: space-between;
    gap: 0.7rem;
    border: 1px solid rgba(201, 236, 255, 0.1);
    border-radius: 0.65rem;
    background: rgba(5, 14, 27, 0.42);
    color: #9fb7ca;
    padding: 0.62rem 0.72rem;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.72rem;
    font-weight: 750;
    text-transform: uppercase;
}

.hud-status-list strong {
    color: #ffffff;
}

.landing-systems {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
    padding-bottom: 0.5rem;
}

.landing-systems article {
    min-height: 9.5rem;
    border: 1px solid rgba(201, 236, 255, 0.14);
    border-radius: 0.9rem;
    background:
        linear-gradient(180deg, rgba(8, 22, 39, 0.78), rgba(6, 16, 29, 0.62)),
        rgba(5, 14, 27, 0.62);
    padding: 1rem;
    box-shadow: 0 24px 60px -44px rgba(0, 0, 0, 0.95);
    backdrop-filter: blur(14px);
}

.landing-systems span {
    color: #ffd45a;
    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.16em;
}

.landing-systems h2 {
    margin: 0.55rem 0 0;
    color: #ffffff;
    font-size: 1.08rem;
    font-weight: 900;
}

.landing-systems p {
    margin: 0.55rem 0 0;
    color: #b9c9d9;
    font-size: 0.92rem;
    line-height: 1.48;
}

@media (max-width: 1050px) {
    .landing-command-grid {
        grid-template-columns: 1fr;
        align-items: start;
        padding-top: 4rem;
    }

    .command-hud {
        max-width: 30rem;
    }

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

@media (max-width: 720px) {
    .landing-hero-v2 {
        padding: 1rem 0.85rem;
    }

    .landing-header-v2 {
        align-items: flex-start;
    }

    .landing-command-grid {
        min-height: auto;
        padding-block: 3.5rem 1.35rem;
    }

    .hero-copy-v2 h1 {
        max-width: 10ch;
        font-size: 3.6rem;
    }

    .hero-lede-v2 {
        font-size: 1.02rem;
    }

    .landing-systems {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 520px) {
    .brand-lockup-v2 .brand-tagline {
        display: none;
    }

    .landing-actions {
        gap: 0.35rem;
    }

    .landing-link-v2,
    .landing-button-v2 {
        min-height: 2.35rem;
        padding-inline: 0.68rem;
        font-size: 0.8rem;
    }

    .hero-copy-v2 h1 {
        font-size: 3rem;
    }

    .hero-cta-v2 {
        display: grid;
        align-items: stretch;
    }

    .hud-metrics {
        grid-template-columns: 1fr;
    }
}

/* Flight operations map */
.flight-map-shell {
    position: relative;
    height: clamp(34rem, 70vh, 52rem);
    min-height: 34rem;
    overflow: hidden;
    background: #b8d7e4;
}

.flight-map-canvas {
    width: 100%;
    height: 100%;
}

.flight-map-shell.game-map-home {
    height: 100%;
    min-height: 0;
}

.game-map-dashboard-button {
    position: absolute;
    right: 1rem;
    top: 1rem;
    z-index: 700;
    border: 1px solid rgba(255, 255, 255, 0.72);
    border-radius: 0.6rem;
    background: #0b75b7;
    color: #ffffff;
    font-size: 0.8rem;
    font-weight: 700;
    padding: 0.65rem 1rem;
    box-shadow: 0 14px 34px rgba(18, 54, 82, 0.3);
}

.game-map-dashboard-button:hover {
    background: #075f94;
}

.dashboard-modal-backdrop {
    z-index: 2000;
}

.flight-map-shell .leaflet-container {
    background: #bad8e5;
    color: var(--ad-text);
    font-family: "IBM Plex Sans", system-ui, sans-serif;
}

.flight-map-shell .leaflet-control-zoom {
    border: 0;
    box-shadow: 0 14px 34px rgba(28, 63, 90, 0.18);
}

.flight-map-shell .leaflet-control-zoom a {
    border: 1px solid rgba(115, 144, 166, 0.24);
    color: #143552;
    font-weight: 700;
}

.flight-map-shell .leaflet-control-attribution {
    margin: 0 0.35rem 0.35rem 0;
    border-radius: 0.35rem;
    background: rgba(255, 255, 255, 0.68);
    color: #52677a;
    font-size: 9px;
    line-height: 1.25;
    padding: 0.16rem 0.3rem;
    backdrop-filter: blur(5px);
}

.flight-map-shell .leaflet-control-attribution a {
    color: #315d7c;
    text-decoration: none;
}

.ad-airport-pin {
    display: grid;
    justify-items: center;
    pointer-events: auto;
}

.ad-airport-pin span {
    position: relative;
    width: 1.6rem;
    height: 1.6rem;
    border: 2.4px solid #ffffff;
    border-radius: 999px 999px 999px 0;
    background: linear-gradient(135deg, #0d8bc7, #56c5ed);
    box-shadow: 0 10.4px 19.2px rgba(13, 70, 110, 0.28);
    transform: rotate(-45deg);
}

.ad-airport-pin span::after {
    position: absolute;
    inset: 0.36rem;
    border-radius: 999px;
    background: #ffffff;
    content: "";
}

.ad-airport-pin strong {
    margin-top: -0.08rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.94);
    color: #15334e;
    font: 800 0.624rem "IBM Plex Mono", Consolas, monospace;
    letter-spacing: 0;
    line-height: 1;
    padding: 0.144rem 0.288rem;
    text-shadow: none;
    box-shadow: 0 6.4px 14.4px rgba(28, 63, 90, 0.16);
}

.ad-plane-marker {
    position: relative;
    display: block;
    pointer-events: auto;
}

.ad-plane-shape,
.ad-plane-shadow {
    position: absolute;
    left: 50%;
    top: 50%;
    width: var(--aircraft-size);
    height: var(--aircraft-size);
    background: #1688c7;
    mask: var(--aircraft-icon) center / contain no-repeat;
    -webkit-mask: var(--aircraft-icon) center / contain no-repeat;
    transform: translate(-50%, -50%) rotate(var(--aircraft-rotation));
    transform-origin: center;
}

.ad-plane-shadow {
    width: calc(var(--aircraft-size) + 3.2px);
    height: calc(var(--aircraft-size) + 3.2px);
    background: #17212d;
    filter: drop-shadow(0 3.2px 3.2px rgba(20, 34, 48, 0.42));
    opacity: 0.96;
}

.ad-plane-marker.is-idle .ad-plane-shape {
    background: #ff625d;
}

.ad-plane-marker.is-idle .ad-plane-shadow {
    background: #26303c;
}

.ad-plane-marker:hover .ad-plane-shape {
    background: #67d9f4;
}

.ad-plane-marker:hover .ad-plane-shadow {
    filter: drop-shadow(0 5.6px 5.6px rgba(20, 34, 48, 0.52));
}

.ad-flight-vector-layer {
    overflow: visible;
    pointer-events: none;
}

.ad-flight-route {
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
    pointer-events: none;
}

.ad-flight-route.is-active {
    stroke: #7c3faf;
    stroke-width: 4;
    stroke-opacity: 0.9;
}

.ad-flight-route.is-planned {
    stroke: #8f6ab4;
    stroke-width: 3;
    stroke-dasharray: 10 10;
    stroke-opacity: 0.62;
}

.ad-flight-aircraft {
    cursor: pointer;
    outline: none;
    pointer-events: auto;
}

.ad-flight-aircraft-shadow {
    filter: brightness(0) saturate(100%) drop-shadow(0 3.2px 3.2px rgba(20, 34, 48, 0.42));
    opacity: 0.92;
}

.ad-flight-aircraft-shape {
    filter: brightness(0) saturate(100%) invert(43%) sepia(97%) saturate(1181%) hue-rotate(169deg) brightness(93%) contrast(84%);
}

.ad-flight-aircraft.is-idle .ad-flight-aircraft-shape {
    filter: brightness(0) saturate(100%) invert(48%) sepia(94%) saturate(2087%) hue-rotate(328deg) brightness(102%) contrast(101%);
}

.ad-flight-aircraft:hover .ad-flight-aircraft-shape,
.ad-flight-aircraft:focus .ad-flight-aircraft-shape {
    filter: brightness(0) saturate(100%) invert(81%) sepia(45%) saturate(1688%) hue-rotate(159deg) brightness(101%) contrast(91%);
}

.ad-map-detail-panel {
    position: absolute;
    right: 1rem;
    top: 1rem;
    z-index: 500;
    display: grid;
    width: min(19rem, calc(100% - 2rem));
    gap: 0.45rem;
    border: 1px solid rgba(82, 121, 150, 0.22);
    border-radius: 0.85rem;
    background: rgba(255, 255, 255, 0.93);
    color: #17304a;
    padding: 1rem;
    box-shadow: 0 24px 64px -34px rgba(16, 49, 75, 0.86);
    backdrop-filter: blur(12px);
}

.flight-map-shell.game-map-home .ad-map-detail-panel {
    top: 5rem;
}

.ad-map-detail-panel[hidden] {
    display: none;
}

.ad-map-detail-panel p {
    margin: 0;
    color: #0b75b7;
    font: 800 0.68rem "IBM Plex Mono", Consolas, monospace;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.ad-map-detail-panel strong {
    color: #102033;
    font-size: 1.05rem;
}

.ad-map-detail-panel > span {
    color: #3d5873;
    font-weight: 650;
}

.ad-map-detail-close {
    position: absolute;
    right: 0.65rem;
    top: 0.6rem;
    display: grid;
    width: 1.8rem;
    height: 1.8rem;
    place-items: center;
    border: 1px solid rgba(82, 121, 150, 0.22);
    border-radius: 0.45rem;
    background: rgba(255, 255, 255, 0.7);
    color: #17304a;
    font-weight: 800;
}

.ad-map-detail-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.ad-map-detail-meta small {
    border-radius: 999px;
    background: #e6f3fb;
    color: #345572;
    font-size: 0.76rem;
    font-weight: 700;
    padding: 0.22rem 0.48rem;
}

.ad-map-detail-progress {
    height: 0.48rem;
    overflow: hidden;
    border-radius: 999px;
    background: #d8e8f2;
}

.ad-map-detail-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #0d8bc7, #53c7ef);
}

@media (max-width: 720px) {
    .flight-map-shell {
        height: auto;
    }

    .flight-map-canvas {
        height: 30rem;
    }

    .flight-map-shell.game-map-home {
        height: 100%;
        min-height: 0;
    }

    .game-map-home .flight-map-canvas {
        height: 100%;
    }

    .ad-map-detail-panel {
        position: static;
        width: auto;
        margin: 0.75rem;
    }
}

#blazor-error-ui {
    background: #7f1d1d;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    color: white;
    display: none;
    left: 0;
    padding: 0.75rem 1rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}