:root {
    --page-bg: #091421;
    --panel-bg: rgba(12, 24, 38, 0.82);
    --panel-border: rgba(128, 173, 214, 0.18);
    --text-main: #e6eff9;
    --text-muted: #93a8bd;
    --accent: #5ac8fa;
    --accent-soft: rgba(90, 200, 250, 0.16);
    --nearest: rgba(90, 200, 250, 0.12);
}

body {
    min-height: 100vh;
    font-family: "Barlow", sans-serif;
    color: var(--text-main);
    background:
            radial-gradient(circle at top left, rgba(90, 200, 250, 0.14), transparent 35%),
            radial-gradient(circle at top right, rgba(255, 209, 102, 0.12), transparent 28%),
            linear-gradient(180deg, #07111c 0%, #0c1623 100%);
}

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

.hero-panel,
.summary-card,
.control-panel,
.results-panel {
    background: var(--panel-bg);
    border: 1px solid var(--panel-border);
    border-radius: 1.25rem;
    backdrop-filter: blur(18px);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.24);
}

.hero-panel {
    padding: 2rem;
    display: flex;
    gap: 1.5rem;
    justify-content: space-between;
    align-items: end;
}

.eyebrow {
    color: var(--accent);
    text-transform: uppercase;
    letter-spacing: 0.16em;
    font-size: 0.82rem;
    margin-bottom: 0.85rem;
}

.hero-panel h1 {
    font-size: clamp(2rem, 4vw, 3.4rem);
    margin-bottom: 0.35rem;
}

.hero-subtitle,
.results-header p,
.privacy-note,
.summary-label {
    color: var(--text-muted);
}

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

.summary-card {
    padding: 1.2rem 1.25rem;
}

.summary-card strong {
    display: block;
    margin-top: 0.5rem;
    font-size: 1.2rem;
}

.control-panel,
.results-panel {
    padding: 1.5rem;
}

/* Keep the critical dashboard layout usable if the CDN-hosted Bootstrap file is unavailable. */
#manual-location-form {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    align-items: end;
    margin: 0;
}

#manual-location-form > * {
    width: auto;
    max-width: none;
    padding: 0;
}

.form-label {
    display: block;
    margin-bottom: 0.5rem;
}

.form-control {
    box-sizing: border-box;
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
}

#manual-location-form .btn {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
}

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

.aircraft-table th,
.aircraft-table td {
    padding: 0.5rem;
}

.aircraft-card-list {
    display: none;
}

.status-pill,
.updating-indicator {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    border-radius: 999px;
    padding: 0.55rem 0.95rem;
    font-weight: 600;
    background: var(--accent-soft);
    color: var(--accent);
}

.btn-accent {
    background: linear-gradient(135deg, #50c5fa, #7be0ff);
    border: 0;
    color: #041019;
    font-weight: 700;
}

.btn-accent:hover {
    color: #041019;
    background: linear-gradient(135deg, #72d3ff, #a2e8ff);
}

.form-control {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.12);
    color: var(--text-main);
}

.form-control::placeholder {
    color: rgba(230, 239, 249, 0.45);
}

.form-control:focus {
    background: rgba(255, 255, 255, 0.06);
    color: var(--text-main);
    border-color: rgba(90, 200, 250, 0.55);
    box-shadow: 0 0 0 0.25rem rgba(90, 200, 250, 0.15);
}

.aircraft-table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--text-main);
    --bs-table-border-color: rgba(255, 255, 255, 0.08);
}

.aircraft-table thead th {
    color: var(--text-muted);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-size: 0.78rem;
}

.aircraft-row,
.aircraft-mobile-card {
    transition: transform 0.2s ease, border-color 0.2s ease, background-color 0.2s ease;
}

.aircraft-row.nearest,
.aircraft-mobile-card.nearest {
    background: var(--nearest);
}

.aircraft-mobile-card {
    border: 1px solid var(--panel-border);
    border-radius: 1rem;
    padding: 1rem;
    margin-bottom: 0.85rem;
    background: rgba(255, 255, 255, 0.03);
}

.aircraft-mobile-card .label {
    color: var(--text-muted);
    font-size: 0.82rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.aircraft-mobile-card .value {
    font-weight: 600;
}

.flight-code {
    font-size: 1.1rem;
    font-weight: 700;
}

.subtext {
    color: var(--text-muted);
}

.empty-row td,
.empty-card {
    color: var(--text-muted);
    text-align: center;
    padding: 2rem 1rem;
}

@media (max-width: 991.98px) {
    .hero-panel {
        flex-direction: column;
        align-items: flex-start;
    }

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

    .table-responsive {
        display: none;
    }

    .aircraft-card-list {
        display: block;
    }
}

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

    .hero-panel,
    .control-panel,
    .results-panel {
        padding: 1.15rem;
    }

    #manual-location-form {
        grid-template-columns: 1fr;
    }
}

.closest-page-link,
.back-link {
    color: var(--accent);
    text-decoration: none;
    font-weight: 600;
}

.closest-page-link {
    display: inline-flex;
    gap: 0.5rem;
    align-items: center;
    margin-bottom: 0.65rem;
}

.closest-shell {
    max-width: 1040px;
}

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

.closest-hero,
.closest-aircraft-card,
.closest-meta-grid article {
    background: var(--panel-bg);
    border: 1px solid var(--panel-border);
    border-radius: 1.25rem;
    backdrop-filter: blur(18px);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.24);
}

.closest-hero {
    padding: clamp(1.5rem, 4vw, 3rem);
    display: flex;
    justify-content: space-between;
    gap: 2rem;
    align-items: end;
}

.closest-hero h1 {
    font-size: clamp(2.6rem, 7vw, 5rem);
    line-height: 0.94;
    margin-bottom: 0.8rem;
}

.closest-hero p,
.closest-location span,
.closest-location small,
.closest-meta-grid span,
.closest-card-topline,
.closest-specs span,
.closest-empty-state p,
.manual-copy p {
    color: var(--text-muted);
}

.closest-location {
    min-width: 220px;
    display: grid;
    gap: 0.25rem;
}

.closest-location span,
.closest-location small,
.closest-meta-grid span,
.closest-specs span {
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.closest-location strong {
    font-size: 1.1rem;
}

.closest-aircraft-card {
    min-height: 360px;
    padding: clamp(1.25rem, 3vw, 2.25rem);
    overflow: hidden;
    position: relative;
}

.closest-aircraft-card::after {
    content: "";
    position: absolute;
    width: 480px;
    height: 480px;
    border: 1px solid rgba(90, 200, 250, 0.12);
    border-radius: 50%;
    right: -230px;
    top: -250px;
    box-shadow: 0 0 0 42px rgba(90, 200, 250, 0.035), 0 0 0 84px rgba(90, 200, 250, 0.02);
    pointer-events: none;
}

.closest-card-topline {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: space-between;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: 0.78rem;
}

.closest-card-topline i {
    color: var(--accent);
    margin-right: 0.35rem;
}

.closest-callout {
    position: relative;
    z-index: 1;
    display: flex;
    gap: clamp(1.5rem, 5vw, 4rem);
    align-items: center;
    padding: 2.6rem 0 2rem;
}

.closest-distance-orbit {
    flex: 0 0 160px;
    width: 160px;
    height: 160px;
    display: grid;
    align-content: center;
    justify-items: center;
    border: 1px solid rgba(90, 200, 250, 0.55);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(90, 200, 250, 0.18), transparent 68%);
}

.closest-distance-orbit strong {
    color: var(--accent);
    font-size: 3.35rem;
    line-height: 1;
}

.closest-distance-orbit span {
    color: var(--text-muted);
    font-size: 0.82rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.closest-flight .flight-code {
    font-size: clamp(2.25rem, 7vw, 4.5rem);
    line-height: 0.95;
}

.closest-operator {
    color: var(--accent);
    font-size: 1.1rem;
    font-weight: 600;
    margin-top: 0.5rem;
}

.closest-route {
    color: var(--text-muted);
    margin-top: 0.7rem;
    font-size: 1.1rem;
}

.closest-specs {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 1.25rem;
    gap: 1rem;
}

.closest-specs div,
.closest-meta-grid article {
    display: grid;
    gap: 0.35rem;
}

.closest-specs strong,
.closest-meta-grid strong {
    font-size: 1.05rem;
}

.closest-meta-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.closest-meta-grid article {
    padding: 1rem 1.2rem;
}

.closest-empty-state {
    min-height: 270px;
    display: grid;
    place-content: center;
    text-align: center;
    position: relative;
    z-index: 1;
}

.closest-empty-state i {
    color: var(--accent);
    font-size: 2.25rem;
    margin-bottom: 1rem;
}

.closest-empty-state h2,
.manual-copy h2 {
    font-size: 1.35rem;
}

.closest-manual-panel {
    display: grid;
    gap: 1.25rem;
}

.manual-copy p {
    margin: 0;
}

@media (max-width: 767.98px) {
    .closest-hero,
    .closest-callout {
        flex-direction: column;
        align-items: flex-start;
    }

    .closest-hero {
        gap: 1.25rem;
    }

    .closest-callout {
        padding-top: 2rem;
        gap: 1.5rem;
    }

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

    .closest-meta-grid {
        grid-template-columns: 1fr;
    }
}

.refresh-control {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.refresh-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: var(--text-muted);
    font-size: 0.9rem;
    cursor: pointer;
}

.refresh-toggle input {
    width: 2.25rem;
    height: 1.2rem;
    margin: 0;
    accent-color: var(--accent);
    cursor: pointer;
}

@media (max-width: 575.98px) {
    .refresh-control {
        justify-content: flex-start;
    }
}

/* Closest aircraft detail dashboard */
.closest-page {
    --ink: #0b1731;
    --soft-ink: #60708d;
    --line: #e3e8f1;
    --blue: #1764ff;
    min-height: 100vh;
    font-family: "DM Sans", sans-serif;
    color: var(--ink);
    background: #f7f9fc;
}

.tracker-nav {
    min-height: 76px;
    display: flex;
    align-items: center;
    gap: 2rem;
    padding: 0 2rem;
    background: #fff;
    border-bottom: 1px solid var(--line);
}

.tracker-brand,
.tracker-actions,
.tracker-links,
.closest-title-actions,
.aircraft-identity,
.panel-heading > div {
    display: flex;
    align-items: center;
}

.tracker-brand {
    gap: 0.8rem;
    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.tracker-brand-mark {
    display: grid;
    place-items: center;
    width: 2.1rem;
    height: 2.1rem;
    border-radius: 0.45rem;
    color: white;
    background: linear-gradient(135deg, #1d74ff, #3a43d9);
}

.tracker-search {
    min-width: 250px;
    max-width: 475px;
    flex: 1;
    display: flex;
    align-items: center;
    gap: 0.8rem;
    height: 44px;
    padding: 0 0.9rem;
    border: 1px solid #dbe2ed;
    border-radius: 0.55rem;
    color: #8491aa;
    font-size: 0.88rem;
}

.tracker-search kbd {
    margin-left: auto;
    padding: 0;
    color: #8e9bb0;
    background: none;
    font: inherit;
}

.tracker-links { gap: 1.8rem; }
.tracker-links a { color: #43516c; font-size: 0.88rem; font-weight: 500; text-decoration: none; }
.tracker-links a:hover, .tracker-links .is-active { color: var(--blue); }
.tracker-actions { gap: 0.75rem; margin-left: auto; color: #405071; }
.tracker-actions .use-location-button { white-space: nowrap; }
.tracker-actions .refresh-toggle { white-space: nowrap; }
.tracker-actions > i { font-size: 1.05rem; }
.tracker-actions .back-link { margin: 0; color: #405071; font-size: 0.82rem; }

.closest-dashboard { max-width: 1420px; margin: 0 auto; padding: 1.85rem; }
.closest-title-row { display: flex; align-items: center; justify-content: space-between; gap: 2rem; margin-bottom: 1.2rem; }
.dashboard-kicker { margin: 0 0 0.55rem; color: var(--blue); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.closest-title-row h1 { margin: 0; font-size: clamp(2rem, 4vw, 3rem); letter-spacing: -0.055em; }
.aircraft-identity { gap: 0.75rem; margin-top: 0.5rem; color: var(--soft-ink); font-size: 0.77rem; }
.aircraft-identity strong { padding-right: 0.75rem; border-right: 1px solid var(--line); color: var(--ink); font-size: 0.84rem; }
.aircraft-identity strong:last-child { border: 0; }
.closest-title-actions { gap: 0.8rem; }
.live-status { display: inline-flex; align-items: center; gap: 0.45rem; color: #138b38; font-size: 0.86rem; font-weight: 600; }
.live-status i { font-size: 0.58rem; }
.light-toggle { color: var(--soft-ink); }
.light-toggle input { accent-color: var(--blue); }
.share-button { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.65rem 0.85rem; border: 1px solid var(--line); border-radius: 0.5rem; color: #405071; font-size: 0.85rem; font-weight: 600; text-decoration: none; }
.closest-message { margin-bottom: 1.2rem; padding: 0.8rem 1rem; border: 1px solid #dce5f5; border-radius: 0.55rem; color: #52627f; background: #f0f5ff; font-size: 0.86rem; }

.aircraft-overview-card,
.flight-stat-grid article,
.route-panel,
.details-panel,
.updates-panel,
.closest-manual-panel { border: 1px solid var(--line); border-radius: 0.7rem; background: #fff; box-shadow: 0 5px 18px rgba(23, 45, 85, 0.045); }
.aircraft-overview-card { min-height: 250px; display: grid; grid-template-columns: minmax(360px, 1.08fr) minmax(360px, 1fr); overflow: hidden; }
.aircraft-art { position: relative; display: grid; place-items: center; overflow: hidden; background: linear-gradient(135deg, #edf5ff, #fff 56%, #dceafd); }
.aircraft-art::before { content: ""; position: absolute; width: 120%; height: 35%; bottom: -17%; border-radius: 50%; background: rgba(125, 178, 255, 0.18); filter: blur(20px); }
.aircraft-art i { position: relative; z-index: 1; transform: rotate(-11deg); color: var(--blue); font-size: clamp(5rem, 13vw, 10rem); text-shadow: 8px 12px 20px rgba(14, 71, 188, 0.2); } .aircraft-airline-art { position: relative; z-index: 1; display: grid; justify-items: center; gap: 0.85rem; max-width: 75%; color: #294365; font-size: 0.85rem; font-weight: 700; text-align: center; }.aircraft-airline-art img { display: block; width: min(260px, 72%); max-height: 120px; object-fit: contain; filter: drop-shadow(0 12px 16px rgba(14, 71, 188, 0.16)); }.aircraft-airline-fallback strong { display: grid; place-items: center; width: 8rem; height: 8rem; border-radius: 50%; color: #fff; background: linear-gradient(135deg, #286eff, #6952d9); box-shadow: 0 12px 24px rgba(14, 71, 188, 0.2); font-size: 2.5rem; }
.art-cloud { position: absolute; width: 6rem; height: 1.5rem; border-radius: 2rem; background: rgba(255,255,255,0.9); filter: blur(2px); }
.cloud-one { top: 26%; left: 17%; }.cloud-two { right: 10%; bottom: 28%; transform: scale(0.7); }
.aircraft-overview-content { padding: 2rem 2.2rem; }.aircraft-overview-content h2 { margin: 0; font-size: clamp(2rem, 4.2vw, 3.4rem); letter-spacing: -0.05em; }.overview-route { margin: 0.55rem 0 1.1rem; color: var(--soft-ink); }.en-route-badge { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.45rem 0.7rem; border-radius: 0.45rem; color: #16853b; background: #e2f8e8; font-size: 0.82rem; font-weight: 700; }
.aircraft-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin: 1.5rem 0 0; }.aircraft-facts dt, .details-panel dt { color: var(--soft-ink); font-size: 0.74rem; font-weight: 500; }.aircraft-facts dd, .details-panel dd { margin: 0.22rem 0 0; color: var(--ink); font-size: 0.9rem; font-weight: 700; }
.operator-with-logo { display: inline-flex; align-items: center; gap: 0.5rem; }.operator-logo, .operator-fallback { width: 1.65rem; height: 1.65rem; flex: 0 0 1.65rem; border-radius: 0.35rem; }.operator-logo { display: block; object-fit: contain; border: 1px solid #edf0f5; background: #fff; }.operator-fallback { display: inline-grid; place-items: center; color: #fff; background: linear-gradient(135deg, #286eff, #6952d9); font-size: 0.65rem; font-weight: 800; letter-spacing: 0.02em; }

.flight-stat-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); margin-top: 1rem; }.flight-stat-grid article { min-height: 132px; padding: 1.1rem 1.25rem; border-radius: 0; box-shadow: none; }.flight-stat-grid article:first-child { border-radius: 0.7rem 0 0 0.7rem; }.flight-stat-grid article:last-child { border-radius: 0 0.7rem 0.7rem 0; }.flight-stat-grid i { display: block; margin-bottom: 0.8rem; color: var(--blue); font-size: 1.28rem; }.flight-stat-grid span { display: block; color: var(--soft-ink); font-size: 0.74rem; }.flight-stat-grid strong { display: block; margin: 0.25rem 0; font-size: 0.98rem; }.flight-stat-grid small { color: #8693aa; font-size: 0.7rem; }

.closest-lower-grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: 1rem; margin-top: 1rem; }.route-panel, .details-panel, .updates-panel { padding: 1rem; }.panel-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.8rem; }.panel-heading > div { gap: 0.7rem; }.panel-heading i { color: var(--blue); }.panel-heading h2 { margin: 0; font-size: 1rem; }.panel-heading > span { color: var(--blue); font-size: 0.76rem; font-weight: 600; }
.aircraft-map { height: 300px; margin: 0 -1rem; overflow: hidden; background: #dfeaf0; }.aircraft-map-marker { display: grid; place-items: center; width: 36px; height: 36px; border: 2px solid #fff; border-radius: 50%; color: #fff; background: #1764ff; box-shadow: 0 3px 12px rgba(14, 71, 188, 0.35); }.aircraft-map-marker i { transform: rotate(45deg); font-size: 1rem; }.aircraft-map .leaflet-control-attribution { font-size: 0.62rem; }.route-labels { display: grid; grid-template-columns: 1fr 1.5fr 1fr; align-items: center; gap: 1rem; padding: 1rem 0.4rem 0; }.route-labels strong, .route-labels span { display: block; }.route-labels strong { font-size: 0.9rem; }.route-labels span { color: var(--soft-ink); font-size: 0.73rem; }.route-labels > div:last-child { text-align: right; }.route-progress { text-align: center; }.route-progress div { height: 4px; margin-top: 0.5rem; border-radius: 2px; background: linear-gradient(90deg, var(--blue) 55%, #d9e0ea 55%); }
.right-detail-stack { display: grid; gap: 1rem; }.details-panel dl { display: grid; grid-template-columns: 1fr 1fr; gap: 0.7rem 1.5rem; margin: 0; }.updates-panel ul { display: grid; gap: 0.75rem; padding: 0; margin: 0; list-style: none; }.updates-panel li { display: flex; gap: 0.7rem; }.updates-panel li > i { color: #1a9c48; font-size: 0.6rem; margin-top: 0.35rem; }.updates-panel strong, .updates-panel small { display: block; }.updates-panel strong { font-size: 0.8rem; }.updates-panel small { color: var(--soft-ink); font-size: 0.73rem; }
.closest-manual-panel { display: grid; grid-template-columns: 1fr 1.4fr; gap: 2rem; align-items: center; margin-top: 1rem; padding: 1.3rem; }.closest-manual-panel h2 { margin: 0 0 0.35rem; font-size: 1.2rem; }.closest-manual-panel p:not(.dashboard-kicker) { margin: 0; color: var(--soft-ink); font-size: 0.85rem; }.closest-manual-panel form { display: grid; grid-template-columns: 1fr 1fr 1.2fr; gap: 0.75rem; align-items: end; }.closest-manual-panel label { color: var(--soft-ink); font-size: 0.76rem; font-weight: 600; }.closest-manual-panel input { display: block; box-sizing: border-box; width: 100%; margin-top: 0.35rem; padding: 0.65rem 0.7rem; border: 1px solid #dbe2ed; border-radius: 0.45rem; color: var(--ink); }.closest-manual-panel button { height: 40px; border: 0; border-radius: 0.45rem; color: white; background: var(--blue); font: inherit; font-size: 0.82rem; font-weight: 700; }

@media (max-width: 1100px) { .tracker-links { display: none; }.flight-stat-grid { grid-template-columns: repeat(3, 1fr); }.flight-stat-grid article, .flight-stat-grid article:first-child, .flight-stat-grid article:last-child { border-radius: 0; }.aircraft-overview-card { grid-template-columns: 1fr 1fr; } }
@media (max-width: 760px) { .tracker-nav { gap: 1rem; padding: 0 1rem; }.tracker-search, .tracker-actions > i, .tracker-actions .back-link { display: none; }.tracker-actions { margin-left: auto; }.closest-dashboard { padding: 1.1rem; }.closest-title-row, .closest-title-actions { align-items: flex-start; flex-direction: column; }.aircraft-overview-card, .closest-lower-grid, .closest-manual-panel { grid-template-columns: 1fr; }.aircraft-art { min-height: 210px; }.flight-stat-grid { grid-template-columns: repeat(2, 1fr); }.closest-manual-panel form { grid-template-columns: 1fr; }.aircraft-identity { flex-wrap: wrap; }.closest-title-actions { gap: 0.5rem; } }

.theme-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.48rem 0.7rem;
    border: 1px solid var(--panel-border, var(--line));
    border-radius: 0.5rem;
    color: inherit;
    background: transparent;
    font: inherit;
    font-size: 0.8rem;
    cursor: pointer;
}

.theme-toggle:hover {
    border-color: var(--accent, var(--blue));
}

body:not(.closest-page)[data-theme="light"] {
    --page-bg: #edf3f9;
    --panel-bg: rgba(255, 255, 255, 0.9);
    --panel-border: rgba(35, 72, 108, 0.18);
    --text-main: #10233a;
    --text-muted: #5b7188;
    --accent: #087db6;
    --accent-soft: rgba(8, 125, 182, 0.12);
    --nearest: rgba(8, 125, 182, 0.09);
    background: radial-gradient(circle at top left, rgba(8, 125, 182, 0.13), transparent 35%), linear-gradient(180deg, #f8fbfe 0%, #e6eef6 100%);
}

.closest-page[data-theme="dark"] {
    --ink: #e7eef9;
    --soft-ink: #a5b5ca;
    --line: #2b3a52;
    --blue: #62a8ff;
    background: #101a2b;
}

.closest-page[data-theme="dark"] .tracker-nav,
.closest-page[data-theme="dark"] .aircraft-overview-card,
.closest-page[data-theme="dark"] .flight-stat-grid article,
.closest-page[data-theme="dark"] .route-panel,
.closest-page[data-theme="dark"] .details-panel,
.closest-page[data-theme="dark"] .updates-panel,
.closest-page[data-theme="dark"] .closest-manual-panel {
    background: #162338;
    box-shadow: 0 5px 18px rgba(0, 0, 0, 0.22);
}

.closest-page[data-theme="dark"] .tracker-search,
.closest-page[data-theme="dark"] .closest-manual-panel input {
    border-color: #32435d;
    color: var(--ink);
    background: #101b2d;
}

.closest-page[data-theme="dark"] .tracker-links a,
.closest-page[data-theme="dark"] .tracker-actions,
.closest-page[data-theme="dark"] .share-button {
    color: #b8c7db;
}

.closest-page[data-theme="dark"] .share-button {
    border-color: var(--line);
}

.closest-page[data-theme="dark"] .closest-message {
    border-color: #30466c;
    color: #b9cbea;
    background: #172947;
}

.closest-page[data-theme="dark"] .aircraft-art {
    background: linear-gradient(135deg, #162c4a, #192638 56%, #1d3657);
}

.closest-page[data-theme="dark"] .aircraft-airline-art { color: #dce9fb; }

.closest-page[data-theme="dark"] .art-cloud {
    background: rgba(206, 226, 255, 0.12);
}

.closest-page[data-theme="dark"] .aircraft-map .leaflet-tile { filter: brightness(0.72) contrast(1.1) saturate(0.8); }

.closest-page[data-theme="dark"] .route-progress div {
    background: linear-gradient(90deg, var(--blue) 55%, #35445a 55%);
}

@media (max-width: 760px) {
    .tracker-actions .theme-toggle span {
        display: none;
    }
}

/* Compact, single-screen aircraft display for 1080p and smaller desktops. */
.display-1080-page { background: radial-gradient(circle at 80% 0, rgba(23, 100, 255, 0.12), transparent 32%), #f4f7fb; }
.display-1080-header { min-height: 62px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0 2vw; border-bottom: 1px solid var(--line); background: rgba(255, 255, 255, 0.92); }
.display-1080-controls { display: flex; align-items: center; gap: 0.8rem; }
.display-1080-controls .back-link { margin: 0; color: var(--soft-ink); font-size: 0.8rem; }
.display-1080-dashboard { width: min(1440px, 100%); box-sizing: border-box; min-height: calc(100vh - 62px); margin: 0 auto; padding: clamp(0.8rem, 1.5vw, 1.5rem) 2vw; }
.display-1080-dashboard .closest-message { margin-bottom: 0.75rem; }
.display-1080-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 0.8rem; }
.display-1080-heading h1 { margin: 0; font-size: clamp(1.8rem, 3.5vw, 2.8rem); letter-spacing: -0.06em; }
.display-1080-identity { display: flex; gap: 1rem; color: var(--soft-ink); font-size: 0.78rem; }
.display-1080-identity span { display: grid; gap: 0.2rem; }.display-1080-identity strong { color: var(--ink); font-size: 0.95rem; }
.display-1080-grid { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 0.85rem; }
.display-1080-grid .aircraft-overview-card { min-height: 280px; }.display-1080-grid .aircraft-art { min-height: 280px; }.display-1080-grid .aircraft-overview-content { padding: 1.5rem; }
.display-1080-grid .aircraft-overview-content h2 { font-size: clamp(2rem, 4vw, 3.2rem); }.display-1080-grid .aircraft-facts { margin-top: 1rem; }
.display-1080-map-panel { padding: 0.85rem; }.display-1080-map-panel .panel-heading { margin-bottom: 0.55rem; }.display-1080-map-panel .aircraft-map { height: 220px; margin: 0 -0.85rem; }
.display-1080-route { display: flex; justify-content: space-between; gap: 1rem; padding: 0.75rem 0.2rem 0; }.display-1080-route span:last-child { text-align: right; }.display-1080-route strong, .display-1080-route small { display: block; }.display-1080-route strong { font-size: 0.85rem; }.display-1080-route small { color: var(--soft-ink); font-size: 0.7rem; }
.display-1080-stats { display: grid; grid-template-columns: repeat(5, 1fr); margin-top: 0.85rem; border: 1px solid var(--line); border-radius: 0.7rem; overflow: hidden; background: #fff; }.display-1080-stats article { min-width: 0; padding: 0.9rem 1rem; border-right: 1px solid var(--line); }.display-1080-stats article:last-child { border: 0; }.display-1080-stats span, .display-1080-stats small { display: block; color: var(--soft-ink); font-size: 0.7rem; }.display-1080-stats strong { display: block; overflow: hidden; margin: 0.2rem 0; font-size: clamp(0.9rem, 1.5vw, 1.1rem); text-overflow: ellipsis; white-space: nowrap; }
.display-1080-footer { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-top: 0.8rem; color: var(--soft-ink); font-size: 0.76rem; }.display-1080-footer i { color: var(--blue); }.display-1080-footer strong { color: var(--ink); }.display-1080-footer form { display: flex; align-items: end; gap: 0.5rem; }.display-1080-footer label { display: grid; gap: 0.2rem; font-size: 0.68rem; }.display-1080-footer input { width: 100px; padding: 0.4rem 0.5rem; border: 1px solid var(--line); border-radius: 0.35rem; color: var(--ink); background: #fff; }.display-1080-footer button { padding: 0.45rem 0.65rem; border: 0; border-radius: 0.35rem; color: #fff; background: var(--blue); font: inherit; font-size: 0.72rem; font-weight: 700; }
.closest-page[data-theme="dark"].display-1080-page { background: radial-gradient(circle at 80% 0, rgba(98, 168, 255, 0.15), transparent 32%), #101a2b; }.closest-page[data-theme="dark"] .display-1080-header, .closest-page[data-theme="dark"] .display-1080-stats { background: #162338; }.closest-page[data-theme="dark"] .display-1080-footer input { border-color: #32435d; color: var(--ink); background: #101b2d; }
@media (max-width: 900px) { .display-1080-grid { grid-template-columns: 1fr; }.display-1080-map-panel .aircraft-map { height: 260px; }.display-1080-stats { grid-template-columns: repeat(3, 1fr); }.display-1080-stats article:nth-child(3) { border-right: 0; }.display-1080-stats article:nth-child(-n+3) { border-bottom: 1px solid var(--line); }.display-1080-footer { align-items: flex-start; flex-wrap: wrap; } }
@media (max-width: 620px) { .display-1080-header { align-items: flex-start; flex-direction: column; padding: 0.8rem 1rem; }.display-1080-controls { width: 100%; justify-content: space-between; }.display-1080-controls .back-link, .display-1080-controls .theme-toggle span { display: none; }.display-1080-dashboard { padding: 1rem; }.display-1080-heading { align-items: flex-start; flex-direction: column; }.display-1080-stats { grid-template-columns: repeat(2, 1fr); }.display-1080-stats article { border-bottom: 1px solid var(--line); }.display-1080-stats article:nth-child(3) { border-right: 1px solid var(--line); }.display-1080-stats article:last-child { border-bottom: 0; }.display-1080-detail { display: none; }.display-1080-footer form { width: 100%; }.display-1080-footer input { width: 100%; } }
.use-location-button { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.52rem 0.7rem; border: 1px solid var(--line); border-radius: 0.5rem; color: var(--blue); background: transparent; font: inherit; font-size: 0.8rem; font-weight: 700; cursor: pointer; }.use-location-button:hover { color: #fff; background: var(--blue); }.closest-page[data-theme="dark"] .use-location-button { border-color: var(--line); color: var(--blue); }
/* Photo artwork uses the app endpoint so the Planespotters API remains server-side. */
.closest-title-row .dashboard-kicker { display: inline-flex; align-items: center; gap: 0.55rem; }
.closest-kicker-logo { display: none; align-items: center; justify-content: center; width: 2.5rem; height: 1.4rem; padding: 0.16rem 0.28rem; border: 1px solid var(--line); border-radius: 0.28rem; background: #fff; }
.closest-kicker-logo.is-visible { display: inline-flex; }
.closest-kicker-logo img { display: block; width: 100%; height: 100%; object-fit: contain; }
.aircraft-photo-frame { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.aircraft-photo { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.aircraft-photo-frame::after { content: ""; position: absolute; inset: 0; background: linear-gradient(120deg, rgba(10, 40, 84, 0.12), transparent 58%); pointer-events: none; }
.aircraft-photo-fallback { display: none; }
.aircraft-photo-frame.is-unavailable .aircraft-photo { display: none; }
.aircraft-photo-frame.is-unavailable .aircraft-photo-fallback { display: block; position: absolute; top: 50%; left: 50%; z-index: 1; transform: translate(-50%, -50%) rotate(-11deg); }
.aircraft-art:has(.aircraft-photo-frame.is-unavailable) { background: linear-gradient(135deg, #edf5ff, #fff 56%, #dceafd); }
.closest-page[data-theme="dark"] .closest-kicker-logo { background: #fff; }
.airline-fact { grid-column: span 2; }
.airline-info { display: flex; align-items: center; gap: 0.75rem; min-height: 2.5rem; }
.airline-info > span { display: grid; gap: 0.15rem; min-width: 0; }
.airline-info strong, .airline-info small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.airline-info small { color: var(--soft-ink); font-size: 0.72rem; font-weight: 500; }
.airline-detail-logo { display: block; width: 4.75rem; height: 2.5rem; padding: 0.28rem; border: 1px solid #edf0f5; border-radius: 0.35rem; background: #fff; object-fit: contain; }
/* Maple Ascent brand theme */
.closest-page {
    --ink: #18181b;
    --soft-ink: #52525b;
    --line: #e4e4e7;
    --blue: #18181b;
    font-family: "Inter", sans-serif;
    color: var(--ink);
    background: radial-gradient(at 0% 0%, #e4e4e7 0, transparent 50%), radial-gradient(at 50% 0%, #f4f4f5 0, transparent 50%), #fafafa;
}
.closest-page .tracker-nav { min-height: 94px; background: #fff; border-color: var(--line); }
.closest-page .tracker-brand { gap: 0; }
.closest-page .maple-ascent-logo { display: block; width: 128px; height: auto; filter: invert(1); }
.closest-page .tracker-navigation { display: grid; gap: 0.45rem; }
.closest-page .tracking-page-title { margin: 0; color: var(--ink); font-size: 1rem; font-weight: 600; letter-spacing: -0.02em; }
.closest-page .tracker-links a, .closest-page .tracker-actions, .closest-page .tracker-actions .back-link { color: var(--soft-ink); }
.closest-page .tracker-links a:hover, .closest-page .tracker-links .is-active { color: var(--ink); }
.closest-page .tracker-actions .use-location-button, .closest-page .share-button, .closest-page .theme-toggle { border-color: var(--line); color: var(--ink); }
.closest-page .tracker-actions .use-location-button:hover, .closest-page .share-button:hover { color: #fff; background: #18181b; }
.closest-page .light-toggle { color: var(--soft-ink); }
.closest-page .light-toggle input { accent-color: #18181b; }
.closest-page .closest-message { border-color: var(--line); color: var(--soft-ink); background: #fff; }
.closest-page .aircraft-overview-card, .closest-page .flight-stat-grid article, .closest-page .route-panel, .closest-page .details-panel, .closest-page .updates-panel, .closest-page .closest-manual-panel { background: #fff; box-shadow: 0 0 0 1px rgba(24, 24, 27, 0.03); }
.closest-page .aircraft-art { background: linear-gradient(135deg, #f4f4f5, #fff 56%, #e4e4e7); }
.closest-page .aircraft-art::before { background: rgba(24, 24, 27, 0.08); }
.closest-page .aircraft-art i { color: #18181b; text-shadow: 8px 12px 20px rgba(24, 24, 27, 0.08); }
.closest-page .art-cloud { background: rgba(255, 255, 255, 0.9); }
.closest-page .aircraft-airline-art { color: var(--ink); }
.closest-page .aircraft-airline-fallback strong, .closest-page .operator-fallback { color: #fff; background: #18181b; }
.closest-page .en-route-badge { color: #065f46; background: #d1fae5; }
.closest-page .closest-manual-panel input { border-color: var(--line); color: var(--ink); background: #fafafa; }
.closest-page .closest-manual-panel button { color: #fff; background: #18181b; }
.closest-page .closest-manual-panel button:hover { background: #27272a; }
.closest-page .panel-heading > span, .closest-page .panel-heading i, .closest-page .dashboard-kicker { color: var(--ink); }
.closest-page .flight-stat-grid small { color: var(--soft-ink); }
.closest-page .aircraft-map-marker { border-color: #fff; color: #fff; background: #18181b; box-shadow: 0 3px 12px rgba(24, 24, 27, 0.18); }
.closest-page[data-theme="dark"] { --ink: #fff; --soft-ink: #a1a1aa; --line: #27272a; --blue: #fff; background: radial-gradient(at 0% 0%, #1a1a1a 0, transparent 50%), radial-gradient(at 50% 0%, #0d0d0d 0, transparent 50%), #000; }
.closest-page[data-theme="dark"] .tracker-nav, .closest-page[data-theme="dark"] .aircraft-overview-card, .closest-page[data-theme="dark"] .flight-stat-grid article, .closest-page[data-theme="dark"] .route-panel, .closest-page[data-theme="dark"] .details-panel, .closest-page[data-theme="dark"] .updates-panel, .closest-page[data-theme="dark"] .closest-manual-panel { background: #0a0a0a; }
.closest-page[data-theme="dark"] .maple-ascent-logo { filter: none; }
.closest-page[data-theme="dark"] .tracking-page-title { color: #fff; }
.closest-page[data-theme="dark"] .tracker-links a, .closest-page[data-theme="dark"] .tracker-actions, .closest-page[data-theme="dark"] .share-button { color: var(--soft-ink); }
.closest-page[data-theme="dark"] .closest-message { border-color: var(--line); color: var(--soft-ink); background: #0a0a0a; }
.closest-page[data-theme="dark"] .aircraft-art { background: linear-gradient(135deg, #18181b, #0a0a0a 56%, #000); }
.closest-page[data-theme="dark"] .aircraft-art i { color: #fff; }
.closest-page[data-theme="dark"] .aircraft-airline-art { color: #fff; }
.closest-page[data-theme="dark"] .aircraft-airline-fallback strong, .closest-page[data-theme="dark"] .operator-fallback { color: #000; background: #fff; }
.closest-page[data-theme="dark"] .closest-manual-panel input { border-color: var(--line); color: #fff; background: #18181b; }
.closest-page[data-theme="dark"] .closest-manual-panel button { color: #000; background: #fff; }
.closest-page[data-theme="dark"] .panel-heading > span, .closest-page[data-theme="dark"] .panel-heading i, .closest-page[data-theme="dark"] .dashboard-kicker { color: #fff; }
.closest-page[data-theme="dark"] .aircraft-map-marker { border-color: #000; color: #000; background: #fff; }
@media (max-width: 1100px) { .closest-page .tracker-navigation { margin-right: auto; } }
@media (max-width: 760px) { .closest-page .tracker-nav { min-height: 76px; }.closest-page .tracking-page-title { font-size: 0.95rem; }.closest-page .maple-ascent-logo { width: 108px; } }
/* Authentication and user administration */
.header-logout { margin: 0; }
.header-logout button, .admin-nav-link { border: 1px solid var(--line); border-radius: 0.5rem; padding: 0.48rem 0.7rem; color: inherit; background: transparent; font: inherit; font-size: 0.8rem; text-decoration: none; cursor: pointer; }
.header-logout button:hover, .admin-nav-link:hover { color: #fff; background: #18181b; }
.login-page { min-height: 100vh; margin: 0; color: #fff; background: radial-gradient(at 0% 0%, #1a1a1a 0, transparent 50%), radial-gradient(at 50% 0%, #0d0d0d 0, transparent 50%), #000; font-family: "Inter", sans-serif; }
.login-shell { display: grid; min-height: 100vh; place-items: center; padding: 1.5rem; box-sizing: border-box; }
.login-card { width: min(100%, 400px); box-sizing: border-box; padding: 2.5rem; border-radius: 1rem; background: #0a0a0a; box-shadow: 0 0 0 1px rgba(255,255,255,0.1); }
.login-logo { display: block; width: 150px; max-width: 100%; height: auto; margin: 0 auto 2rem; }
.login-card h1 { margin: 0 0 0.5rem; font-size: 1.25rem; font-weight: 600; letter-spacing: 0.08em; text-align: center; text-transform: uppercase; }
.login-card > p { margin: 0 0 2rem; color: #a1a1aa; font-size: 0.9rem; text-align: center; }
.login-card form { display: grid; gap: 0.7rem; }
.login-card label { margin-top: 0.5rem; color: #d4d4d8; font-size: 0.8rem; font-weight: 600; }
.login-card input:not([type="hidden"]) { box-sizing: border-box; width: 100%; padding: 0.75rem 1rem; border: 1px solid #27272a; border-radius: 0.5rem; color: #fff; background: #18181b; font: inherit; }
.login-card input:focus { outline: none; border-color: #71717a; background: #1c1c1f; }
.login-card button, .login-return { display: block; box-sizing: border-box; width: 100%; margin-top: 1rem; padding: 0.75rem; border: 0; border-radius: 0.5rem; color: #000; background: #fff; font: inherit; font-size: 0.85rem; font-weight: 700; letter-spacing: 0.05em; text-align: center; text-decoration: none; text-transform: uppercase; cursor: pointer; }
.login-alert, .admin-alert { margin-bottom: 1rem; padding: 0.75rem; border-radius: 0.5rem; font-size: 0.85rem; }
.login-alert-error, .admin-alert-error { color: #fecaca; background: #450a0a; }
.login-alert-success, .admin-alert-success { color: #d1fae5; background: #064e3b; }
.admin-page { min-height: 100vh; margin: 0; color: #18181b; background: #f4f4f5; font-family: "Inter", sans-serif; }
.admin-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 2rem; border-bottom: 1px solid #e4e4e7; background: #fff; }
.admin-header img { display: block; width: 128px; filter: invert(1); }
.admin-header > div, .admin-header form, .user-actions { display: flex; align-items: center; gap: 0.75rem; margin: 0; }
.admin-header a, .admin-header button { color: #52525b; background: transparent; border: 0; font: inherit; font-size: 0.85rem; text-decoration: none; cursor: pointer; }
.admin-header button:hover, .admin-header a:hover { color: #18181b; }
.admin-shell { width: min(1180px, calc(100% - 2rem)); margin: 0 auto; padding: 2rem 0 3rem; }
.admin-title { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }.admin-title p { margin: 0 0 0.3rem; color: #71717a; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }.admin-title h1 { margin: 0; font-size: 2rem; }
.admin-create-card, .admin-table-card { margin-bottom: 1.25rem; padding: 1.5rem; border: 1px solid #e4e4e7; border-radius: 0.75rem; background: #fff; }.admin-create-card h2, .admin-table-card h2 { margin: 0 0 1rem; font-size: 1.1rem; }
.admin-form { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; align-items: end; }.admin-form label { display: grid; gap: 0.4rem; color: #52525b; font-size: 0.8rem; font-weight: 600; }.admin-form input:not([type="checkbox"]), .admin-form select { box-sizing: border-box; width: 100%; padding: 0.65rem 0.7rem; border: 1px solid #d4d4d8; border-radius: 0.45rem; color: #18181b; background: #fff; font: inherit; }.admin-form small { color: #71717a; font-size: 0.72rem; font-weight: 400; }.admin-form .checkbox-label { display: flex; align-items: center; gap: 0.5rem; min-height: 40px; }.admin-form button, .edit-actions a { padding: 0.68rem 0.85rem; border: 0; border-radius: 0.45rem; color: #fff; background: #18181b; font: inherit; font-size: 0.85rem; font-weight: 700; text-align: center; text-decoration: none; cursor: pointer; }.edit-actions { display: flex; gap: 0.75rem; }.edit-actions a { color: #18181b; background: #e4e4e7; }
.admin-table-wrap { overflow-x: auto; }.admin-table-card table { width: 100%; border-collapse: collapse; }.admin-table-card th, .admin-table-card td { padding: 0.85rem 0.7rem; border-bottom: 1px solid #f4f4f5; text-align: left; font-size: 0.85rem; }.admin-table-card th { color: #71717a; font-size: 0.75rem; text-transform: uppercase; }.user-actions a, .user-actions button { color: #18181b; background: transparent; border: 0; font: inherit; font-size: 0.85rem; font-weight: 700; text-decoration: underline; cursor: pointer; }.status-badge { display: inline-block; padding: 0.2rem 0.45rem; border-radius: 99px; font-size: 0.75rem; font-weight: 700; }.status-enabled { color: #065f46; background: #d1fae5; }.status-disabled { color: #991b1b; background: #fee2e2; }
@media (max-width: 850px) { .admin-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }.admin-header { padding: 1rem; }.admin-shell { width: min(100% - 1.5rem, 1180px); } }
@media (max-width: 520px) { .login-card { padding: 2rem 1.5rem; }.admin-form { grid-template-columns: 1fr; }.admin-header > div { gap: 0.5rem; }.admin-header img { width: 108px; } }
/* Refined application header */
.closest-page .tracker-nav {
    position: sticky;
    top: 0;
    z-index: 1000;
    min-height: 78px;
    gap: 1.25rem;
    padding: 0.7rem clamp(1rem, 3vw, 2.75rem);
    border-bottom: 1px solid color-mix(in srgb, var(--line) 78%, transparent);
    background: color-mix(in srgb, #fff 92%, transparent);
    box-shadow: 0 1px 0 rgba(24, 24, 27, 0.03), 0 10px 30px rgba(24, 24, 27, 0.035);
    backdrop-filter: blur(16px);
}

.closest-page .tracker-brand {
    display: flex;
    align-items: center;
    min-width: max-content;
    padding-right: 1.25rem;
    border-right: 1px solid var(--line);
}

.closest-page .tracker-navigation {
    min-width: 0;
    padding-left: 0.1rem;
}

.closest-page .tracking-page-title {
    overflow: hidden;
    color: var(--ink);
    font-size: clamp(1rem, 1.65vw, 1.3rem);
    font-weight: 700;
    letter-spacing: -0.025em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.closest-page .tracker-actions {
    gap: 0.45rem;
    padding: 0.35rem;
    border: 1px solid var(--line);
    border-radius: 0.8rem;
    background: color-mix(in srgb, #fff 75%, #f4f4f5);
    box-shadow: 0 2px 8px rgba(24, 24, 27, 0.04);
}

.closest-page .tracker-actions .theme-toggle,
.closest-page .header-logout button,
.closest-page .admin-nav-link {
    min-height: 34px;
    border-color: transparent;
    border-radius: 0.55rem;
    transition: color 160ms ease, background 160ms ease, transform 160ms ease;
}

.closest-page .header-logout button,
.closest-page .admin-nav-link {
    display: inline-flex;
    align-items: center;
    padding-inline: 0.75rem;
}

.closest-page .header-logout button:hover,
.closest-page .admin-nav-link:hover,
.closest-page .tracker-actions .theme-toggle:hover {
    color: #fff;
    border-color: #18181b;
    background: #18181b;
    transform: translateY(-1px);
}

.closest-page .refresh-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.42rem;
    min-height: 34px;
    padding: 0 0.6rem;
    border-radius: 0.55rem;
    color: var(--soft-ink);
    font-size: 0.78rem;
    font-weight: 600;
}

.closest-page .live-status {
    align-self: stretch;
    max-width: 190px;
    padding: 0 0.75rem;
    border-left: 1px solid var(--line);
    color: #16853b;
    font-size: 0.73rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.closest-page .live-status i {
    flex: 0 0 auto;
    filter: drop-shadow(0 0 4px rgba(22, 133, 59, 0.45));
}

.closest-page[data-theme="dark"] .tracker-nav {
    background: color-mix(in srgb, #0a0a0a 92%, transparent);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06), 0 10px 30px rgba(0, 0, 0, 0.22);
}

.closest-page[data-theme="dark"] .tracker-actions {
    background: color-mix(in srgb, #18181b 80%, #000);
}

.closest-page[data-theme="dark"] .header-logout button:hover,
.closest-page[data-theme="dark"] .admin-nav-link:hover,
.closest-page[data-theme="dark"] .tracker-actions .theme-toggle:hover {
    color: #000;
    border-color: #fff;
    background: #fff;
}

@media (max-width: 920px) {
    .closest-page .tracker-nav { flex-wrap: wrap; gap: 0.65rem 1rem; }
    .closest-page .tracker-brand { padding-right: 1rem; }
    .closest-page .tracker-navigation { flex: 1 1 15rem; }
    .closest-page .tracker-actions { order: 3; width: 100%; justify-content: flex-end; }
}

@media (max-width: 560px) {
    .closest-page .tracker-nav { align-items: center; min-height: 0; padding-block: 0.65rem; }
    .closest-page .tracker-brand { padding-right: 0.75rem; }
    .closest-page .tracker-navigation { flex-basis: 0; }
    .closest-page .tracking-page-title { font-size: 0.9rem; }
    .closest-page .tracker-actions { gap: 0.25rem; padding: 0.25rem; justify-content: space-between; }
    .closest-page .refresh-toggle { padding-inline: 0.4rem; }
    .closest-page .live-status { display: none; }
    .closest-page .header-logout button, .closest-page .admin-nav-link { padding-inline: 0.58rem; font-size: 0.74rem; }
}

/* User-management form alignment */
.admin-form { align-items: start; }
.admin-form > .admin-alert {
    grid-column: 1 / -1;
    margin: 0;
}

.admin-form label {
    grid-template-rows: auto 40px;
}

.admin-form .password-field {
    position: relative;
    padding-bottom: 1.25rem;
}

.admin-form .password-field small {
    position: absolute;
    left: 0;
    bottom: 0;
}

.admin-form > button[type="submit"] {
    grid-column: 4;
    justify-self: end;
    min-width: 128px;
}

@media (max-width: 850px) {
    .admin-form > button[type="submit"] { grid-column: 2; }
}

@media (max-width: 520px) {
    .admin-form > button[type="submit"] { grid-column: 1; justify-self: stretch; }
}