@import url("https://cdn.jsdelivr.net/npm/flatpickr@4.6.13/dist/flatpickr.min.css");
@import url("/css/app-autocomplete.css");
@import url("/css/app-date-picker.css");
@import url("/css/app-file-upload.css");

:root {
    color-scheme: light;
    --font-family-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --blue: #1769a8;
    --blue-dark: #0f5589;
    --blue-deep: #0d4d7e;
    --blue-soft: #eaf5fc;
    --link: #1269a8;
    --line: #d5dce3;
    --line-soft: #dce8f0;
    --panel: #ffffff;
    --page: #e9eef4;
    --text: #1d2730;
    --muted: #6e7b86;
    --row: #f7fbff;
    --control-height-sm: 34px;
    --control-height-md: 36px;
    --font-sm: 0.84rem;
    --font-md: 0.94rem;
    --font-lg: 1.08rem;
    --map-panel-font-family: var(--font-family-sans);
    --map-panel-font-size: 12px;
    --map-panel-line-height: 1.5;
    --map-panel-toggle-bg: rgba(13, 77, 126, 0.22);
    --map-panel-toggle-hover-bg: rgba(13, 77, 126, 0.3);
    --radius-sm: 5px;
    --radius-md: 7px;
    --header-bg: #edf6fb;
    --hover-bg: #f2fbff;
    --focus-ring: 0 0 0 3px rgba(23, 105, 168, 0.22);
    --shadow-control: 0 2px 5px rgba(18, 83, 132, 0.14);
    --control-border: #b9c8d5;
    --control-border-hover: #82a9c8;
    --control-bg: #f8fbfd;
    --control-bg-hover: #eef7fd;
    --form-control-height: 40px;
    --form-control-radius: var(--radius-sm);
    --form-control-bg: #fff;
    --form-control-invalid-border: #d94a3f;
    --form-control-invalid-bg: #fffafa;
    --form-control-invalid-ring: 0 0 0 1px rgba(217, 74, 63, 0.12);
    --form-grid-gap: 16px;
    --form-field-gap: 6px;
    --form-section-gap: 24px;
    --form-actions-gap: 10px;
    --form-label-text: #354052;
    --form-label-weight: 650;
    --form-hint-text: #6e7b86;
    --form-error-text: #b42318;
    --form-placeholder-text: color-mix(in srgb, var(--muted) 52%, var(--form-control-bg));
    --form-placeholder-weight: 400;
    --row-hover: #f0f8fe;
    --row-selected: #e6f4fd;
    --followed-pilot-row-bg: #fff8e6;
    --followed-pilot-row-hover-bg: #fff1cc;
    --row-selected-accent: #2690d4;
    --accent: #2690d4;
    --accent-hover: #176fa8;
    --topbar-bg: linear-gradient(180deg, #2f8adc, #176fb6);
    --topbar-text: #fff;
    --topbar-text-muted: #eaf4fc;
    --topbar-hover-bg: rgba(255, 255, 255, 0.1);
    --topbar-active-indicator: #d8f0ff;
    --topbar-shadow: 0 2px 10px rgba(9, 46, 86, 0.22);
    --panel-border: #d4dde6;
    --page-heading-bg: #fff;
    --table-header-text: #284d69;
    --sort-hover-bg: #ddebf5;
    --filter-chip-border: #bed5e6;
    --filter-chip-bg: #f5fbff;
    --filter-chip-label: #607080;
    --filter-chip-remove-bg: #7c8b9a;
    --filter-scroll-color: #5b7184;
    --filter-scroll-disabled: #b8c1cb;
    --focus-outline: rgba(23, 105, 168, 0.72);
    --avatar-border: #d4e1eb;
    --avatar-bg: linear-gradient(180deg, #f8fbfd, #e4edf5);
    --avatar-placeholder-bg: #d8e3ec;
    --avatar-placeholder-text: #35506a;
    --pilot-identity-link: var(--link);
    --pilot-identity-link-hover: var(--link);
    --pilot-identity-avatar-focus-offset: 2px;
    --rank-border: #c5d3df;
    --rank-bg: #fff;
    --rank-text: #536677;
    --badge-border: #d8e5ef;
    --badge-bg: #f2f7fb;
    --badge-text: #5f7385;
    --status-badge-bg: #ffffff;
    --status-badge-text: var(--muted);
    --winner-color: #fd7725;
    --content-subtle-bg: #fbfdff;
    --detail-header-bg: #f8fbfd;
    --control-disabled-text: #8a98a6;
    --state-selected-bg: #e3f2f0;
    --state-selected-bg-hover: #d5edea;
    --state-selected-border: #a8d2cd;
    --state-selected-border-hover: #87bdb7;
    --state-selected-text: #0f6762;
    --state-selected-icon: #08736c;
    --social-like-border: var(--control-border);
    --social-like-border-hover: var(--control-border-hover);
    --social-like-bg-hover: var(--control-bg-hover);
    --social-like-active-border: var(--state-selected-border);
    --social-like-active-bg: var(--state-selected-bg);
    --social-like-active-bg-hover: var(--state-selected-bg-hover);
    --social-like-active-text: var(--state-selected-text);
    --social-follow-border: var(--control-border);
    --social-follow-border-hover: var(--control-border-hover);
    --social-follow-bg-hover: var(--control-bg-hover);
    --social-follow-active-border: var(--state-selected-border);
    --social-follow-active-border-hover: var(--state-selected-border-hover);
    --social-follow-active-bg: var(--state-selected-bg);
    --social-follow-active-bg-hover: var(--state-selected-bg-hover);
    --social-follow-active-text: var(--state-selected-text);
    --social-follow-active-icon: var(--state-selected-icon);
    --icon-muted: #5d6675;
    --icon-hover-border: #d6e2eb;
    --icon-hover-text: #1f2937;
    --shadow-panel: 0 2px 10px rgba(15, 54, 92, 0.08);
    --space: 12px;
    --space-sm: 6px;
    --page-shell-margin-block-start: var(--space);
    --page-shell-margin-block-end: 34px;
    --viewport-page-shell-margin-block: var(--space);
    --page-shell-gutter: var(--space);
    --page-shell-bg: var(--panel);
    --page-shell-padding-block: var(--space);
    --page-shell-padding-inline: var(--page-shell-gutter);
    --page-gutter: var(--space);
    --panel-gap: var(--space);
    --panel-gap-compact: var(--space-sm);
    --page-max-width: 1180px;
    --topbar-shell-max-width: calc(var(--page-max-width) + 136px);
    --flight-detail-width: clamp(420px, 35vw, 480px);
    --flight-detail-gap: var(--panel-gap);
    --flight-detail-right: var(--page-shell-gutter);
    --flight-detail-top: calc(52px + var(--space));
    --flight-detail-bottom: var(--space);
    --flight-detail-scrolled-top: 12px;
    --flight-detail-scrolled-bottom: var(--space);
    --z-local-overlay: 10;
    --z-local-popover: 20;
    --z-page-sticky: 100;
    --z-page-overlay: 120;
    --z-topbar: 200;
    --z-flight-detail: 300;
    --z-task-editor-fullscreen: 350;
    --z-modal: 400;
    --z-modal-popover: 410;
}

.app-busy-button {
    --app-busy-spinner-size: 15px;
    --app-busy-spinner-gap: 8px;
    --app-busy-spinner-width: 2px;
    --app-busy-spinner-color: currentColor;
    --app-busy-spinner-delay: 140ms;
}

.app-busy-button__content {
    display: inline-grid;
    align-items: center;
    justify-items: center;
}

.app-busy-button__idle,
.app-busy-button__pending {
    grid-area: 1 / 1;
}

.app-busy-button__idle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--app-busy-spinner-gap);
}

.app-busy-button__pending {
    visibility: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--app-busy-spinner-gap);
    line-height: 1;
    white-space: nowrap;
}

.app-busy-button__pending::before {
    width: var(--app-busy-spinner-size);
    height: var(--app-busy-spinner-size);
    flex: 0 0 var(--app-busy-spinner-size);
    box-sizing: border-box;
    content: "";
    border: var(--app-busy-spinner-width) solid color-mix(in srgb, var(--app-busy-spinner-color) 25%, transparent);
    border-top-color: var(--app-busy-spinner-color);
    border-radius: 50%;
    opacity: 0;
}

.app-busy-button:is(.htmx-request, .is-busy, [aria-busy="true"]) .app-busy-button__pending::before {
    animation: app-busy-indicator-spin 680ms linear var(--app-busy-spinner-delay) infinite,
               app-busy-indicator-reveal 1ms linear var(--app-busy-spinner-delay) forwards;
}

.app-busy-button:is(.htmx-request, .is-busy, [aria-busy="true"]) {
    cursor: progress;
}

.app-busy-button:is(.htmx-request, .is-busy, [aria-busy="true"]) .app-busy-button__idle {
    visibility: hidden;
}

.app-busy-button:is(.htmx-request, .is-busy, [aria-busy="true"]) .app-busy-button__pending {
    visibility: visible;
}

@keyframes app-busy-indicator-spin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes app-busy-indicator-reveal {
    to {
        opacity: 1;
    }
}

@media (prefers-reduced-motion: reduce) {
    .app-busy-button:is(.htmx-request, .is-busy, [aria-busy="true"]) .app-busy-button__pending::before {
        animation: app-busy-indicator-reveal 1ms linear var(--app-busy-spinner-delay) forwards;
    }
}

/* Competition browser and profile */
.comp-browser-panel {
    padding: 0;
    overflow: hidden;
}

.comp-search-toolbar {
    --comp-header-inline: 2rem;
    display: grid;
    align-content: space-between;
    gap: 1.5rem;
    min-height: 180px;
    padding: 1.55rem var(--comp-header-inline) 1.75rem;
    border-bottom: 1px solid var(--line-soft);
    background: url("/img/comp/hero-comp.jpg");
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}

.comp-search-toolbar .comp-browser-heading {
    align-items: start;
    padding: 0;
}
.comp-browser-heading .page-heading-actions { align-self: start; }
.comp-browser-heading__identity {
    width: fit-content;
    min-width:300px;
    max-width: 100%;
    padding: 10px 14px;
    border: 0;
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, .66);
    -webkit-backdrop-filter: blur(7px);
    backdrop-filter: blur(7px);
    box-shadow: 0 4px 14px rgba(22, 48, 68, .10);
}
.comp-browser-heading h1 { font-size: 1.75rem; }
.comp-browser-heading p { color: var(--text); text-shadow: 0 1px 2px rgba(255, 255, 255, .65); }
.comp-browser-heading .page-action {
    border-color: rgba(255, 255, 255, .32);
    box-shadow: 0 5px 18px rgba(15, 23, 42, .10);
    backdrop-filter: blur(7px);
}
.comp-browser-heading .xxxpage-action:hover { background: rgba(255, 255, 255, .92); }
.comp-profile-icon {
    display: grid; place-items: center; flex: 0 0 2.9rem; width: 2.9rem; height: 2.9rem;
    border-radius: .85rem; color: #fff; background: linear-gradient(135deg, #0284c7, #f97316);
    box-shadow: 0 8px 20px rgba(2, 132, 199, .18);
}
.comp-profile-icon .ui-icon { width: 1.5rem; height: 1.5rem; filter: brightness(0) invert(1); }

.comp-search-form {
    width: min(100%, 790px);
    display: grid;
    grid-template-columns: minmax(100px, .55fr) minmax(170px, 1fr) minmax(210px, 1.65fr) auto;
    gap: .65rem;
    align-items: end;
    padding: .85rem;
    border: 0;
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, .56);
    box-shadow: 0 8px 24px rgba(15, 23, 42, .10);
    backdrop-filter: blur(2px);
    transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}
.comp-search-form:focus-within {
    border-color: rgba(255, 255, 255, .90);
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 12px 30px rgba(15, 23, 42, .16);
}
.comp-search-field { display: grid; gap: .32rem; min-width: 0; font-size: .78rem; font-weight: 700; color: var(--muted); }
.comp-search-field .form-control { min-width: 0; height: 2.65rem; }
.comp-search-submit { display: grid; place-items: center; width: 2.65rem; height: 2.65rem; border: 0; border-radius: .65rem; background: var(--accent, #0284c7); color: #fff; cursor: pointer; }
.comp-search-submit .ui-icon { filter: brightness(0) invert(1); }

.comp-workspace { min-height: 24rem; }
.comp-workspace-error { margin: 1rem 1.5rem 0; padding: .8rem 1rem; border-radius: .65rem; color: #991b1b; background: #fef2f2; }
.comp-results-surface { padding: 6px 8px 16px; }
.comp-result-table-wrap { overflow-x: visible; }
.comp-browser-table {
    --comp-result-grid: 42px minmax(190px, 1.65fr) minmax(150px, 1fr) minmax(90px, .55fr) 68px;
    width: 100%;
    display: block;
    border-collapse: separate;
}
.comp-browser-table thead, .comp-browser-table tbody { display: block; }
.comp-browser-table tr {
    display: grid;
    grid-template-columns: var(--comp-result-grid);
    column-gap: 10px;
    align-items: center;
    border-bottom: 1px solid var(--line-soft);
}
.comp-browser-table th {
    min-width: 0;
    padding: 9px 0;
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 700;
    letter-spacing: 0;
    text-align: left;
    text-transform: uppercase;
    white-space: nowrap;
}
.comp-browser-table td { min-width: 0; padding: 9px 0; vertical-align: middle; }
.comp-browser-row { cursor: pointer; transition: background .15s ease; }
.comp-browser-row:hover, .comp-browser-row:focus-visible { background: var(--row-hover); }
.comp-browser-row:focus-visible { outline: 2px solid var(--focus-outline); outline-offset: -2px; }
.comp-browser-icon { position: relative; display: grid; place-items: center; width: 34px; height: 34px; }
.comp-browser-trophy { display: block; width: 32px; height: 32px; object-fit: contain; }
.comp-browser-main { display: grid; gap: 2px; min-width: 0; }
.comp-browser-main strong, .comp-browser-main span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.comp-browser-main strong { color: var(--text); }
.comp-browser-main span, .comp-browser-countries { color: var(--muted); font-size: var(--font-md); }
.comp-browser-main .comp-browser-title { display: flex; align-items: center; gap: 6px; min-width: 0; }
.comp-browser-title strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.comp-browser-country-col, .comp-browser-scoring-col { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); font-size: var(--font-sm); }
.comp-browser-season-col { text-align: center; font-variant-numeric: tabular-nums; }
.comp-browser-mobile-meta { display: none; }
.comp-browser-empty { display: grid; justify-items: center; gap: .55rem; padding: 4rem 1.5rem; text-align: center; color: var(--text-muted, #667085); }
.comp-browser-empty .ui-icon { width: 2rem; height: 2rem; }
.comp-browser-empty h2, .comp-browser-empty p { margin: 0; }
.comp-results-truncated { margin: 0; padding: .9rem 1rem; color: var(--text-muted, #667085); text-align: center; }

.comp-profile-host, .comp-profile-view { min-width: 0; }
.comp-profile-view { display: grid; gap: 0; align-content: start; }
.comp-profile-context {
    min-width: 0;
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 0 18px;
    border-bottom: 1px solid var(--panel-border);
    background: var(--panel);
}
.comp-results-back { display: inline-flex; align-items: center; gap: .35rem; }
.comp-results-back .ui-icon { width: 16px; height: 16px; }
.comp-profile { display: grid; gap: 0; align-content: start; background: var(--panel); container-name: comp-profile; container-type: inline-size; }
.comp-profile-header {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: 20px 24px 17px;
    border: 0;
    border-radius: 0;
    background: var(--panel);
}
.comp-profile-icon {
    width: 54px;
    height: 54px;
    border: 1px solid var(--avatar-border);
    border-radius: 50%;
    background: var(--avatar-bg);
    box-shadow: none;
}
.comp-profile-icon .ui-icon { width: 25px; height: 25px; filter: none; opacity: .78; }
.comp-profile-title { min-width: 0; }
.comp-profile-title p { margin: 0 0 2px; color: var(--muted); font-size: .75rem; font-weight: 700; letter-spacing: .045em; text-transform: uppercase; }
.comp-profile-title h1 { margin: 0; overflow-wrap: anywhere; font-size: clamp(1.55rem, 2vw, 1.85rem); line-height: 1.12; }
.comp-profile-badges { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 7px; }
.comp-profile-badges span { padding: 3px 8px; border: 1px solid var(--badge-border); border-radius: 999px; background: var(--badge-bg); color: var(--badge-text); font-size: var(--font-sm); font-weight: 700; }
.comp-profile-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .45rem; }
.comp-profile-actions form { margin: 0; }
.comp-tabs-bar { margin: 0; border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--panel-border); }
.comp-tabs { padding-inline: 1rem; }
.comp-profile-content { min-height: 22rem; }
.comp-profile-content > .pilot-profile-panel { padding: 0; }
.comp-results-toolbar { display: flex; justify-content: flex-end; margin-bottom: .8rem; }
.comp-info-layout { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.comp-info-description { grid-column: 1 / -1; padding: 1rem 1.1rem; border-radius: .8rem; background: rgba(14, 165, 233, .06); }
.comp-info-description h2, .comp-info-card h2 { margin: 0 0 .7rem; font-size: 1rem; }
.comp-info-description p { margin: 0; white-space: pre-line; line-height: 1.55; }
.comp-info-card { padding: 1rem 1.1rem; border: 1px solid var(--border-color, #e4e7ec); border-radius: .8rem; }
.comp-info-list { display: grid; gap: 0; margin: 0; }
.comp-info-list > div { display: grid; grid-template-columns: minmax(110px, .7fr) minmax(0, 1.5fr); gap: .8rem; padding: .65rem 0; border-top: 1px solid var(--border-color, #eef2f6); }
.comp-info-list > div:first-child { border-top: 0; }
.comp-info-list dt { color: var(--text-muted, #667085); font-size: .8rem; font-weight: 700; }
.comp-info-list dd { margin: 0; }
.comp-info-editor-list { display: flex; flex-wrap: wrap; align-items: center; gap: .2rem .45rem; }
.comp-info-editor-list span { display: inline-flex; align-items: center; gap: .45rem; }
.comp-info-editor-list span:not(:last-child)::after { content: "\00b7"; color: var(--text-muted, #667085); }
.comp-info-admin { grid-column: 1 / -1; }
.pilot-profile-tab-icon--results { mask-image: url("/icons/ui/trophy.svg"); }
.pilot-profile-tab-icon--teams { mask-image: url("/icons/ui/users.svg"); }
.pilot-profile-tab-icon--live { mask-image: url("/icons/ui/map-pin.svg"); }
.pilot-profile-tab-icon--admin { mask-image: url("/icons/ui/shield-check.svg"); }
.comp-live {
    display: grid;
    gap: 1rem;
    padding: 1rem;
}
.comp-live-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}
.comp-live-header h2 { margin: 0; font-size: 1.1rem; }
.comp-live-header p { margin: .35rem 0 0; color: var(--muted); line-height: 1.45; }
.comp-live-title-row { display: flex; align-items: center; flex-wrap: wrap; gap: .55rem; }
.comp-live-provisional,
.comp-live-phase {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 2px 8px;
    border: 1px solid var(--badge-border);
    border-radius: 999px;
    background: var(--badge-bg);
    color: var(--badge-text);
    font-size: var(--font-sm);
    font-weight: 750;
}
.comp-live-provisional { border-color: #f2cf72; background: #fff8dc; color: #755100; }
.comp-live-phase[data-phase="live"] { border-color: #8fd0a7; background: #edfbf1; color: #176534; }
.comp-live-phase[data-phase="frozen"] { border-color: #b8c2cd; background: #f3f5f7; color: #475569; }
.comp-live-updated { flex: 0 0 auto; font-size: var(--font-sm); white-space: nowrap; }
.comp-live-updated span { font-weight: 700; }
.comp-live-table-scroll {
    overflow-x: auto;
    border: 1px solid var(--panel-border);
    border-radius: var(--radius-md);
}
.comp-live-table { width: 100%; border-collapse: collapse; background: #fff; }
.comp-live-table th,
.comp-live-table td {
    padding: .7rem .8rem;
    border-bottom: 1px solid var(--line-soft);
    text-align: left;
    white-space: nowrap;
}
.comp-live-table th {
    background: #f8fbfd;
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 750;
}
.comp-live-table tbody tr:last-child td { border-bottom: 0; }
.comp-live-table tbody tr:hover { background: var(--row-hover); }
.comp-live-table .is-numeric { text-align: right; font-variant-numeric: tabular-nums; }
.comp-live-pilot { display: inline-flex; align-items: center; gap: .55rem; }
.comp-live-pilot-signal {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #c5ccd3;
}
.comp-live-pilot-signal.is-tracked {
    background: #20a357;
    box-shadow: 0 0 0 3px rgba(32, 163, 87, .14);
}
.comp-live-message { color: var(--muted); font-weight: 700; text-align: center !important; }
.comp-live-map-root {
    position: relative;
    height: min(62vh, 620px);
    min-height: 430px;
}
.comp-live-map-root .live-layout { height: 100%; }
.comp-live-map-root.is-live-panel-minimized .live-layout {
    position: relative;
    grid-template-columns: minmax(0, 1fr);
}
.comp-admin-layout { display: grid; gap: .85rem; max-width: 58rem; }
.comp-admin-action-card {
    display: flex; align-items: center; justify-content: space-between; gap: 1.25rem;
    padding: 1rem 1.1rem; border: 1px solid var(--border-color, #e4e7ec); border-radius: .8rem;
    background: var(--surface, #fff);
}
.comp-admin-action-card h2 { margin: 0 0 .28rem; font-size: 1rem; }
.comp-admin-action-card p { margin: 0; color: var(--text-muted, #667085); line-height: 1.45; }
.comp-admin-action-card form { margin: 0; }
.comp-admin-action-card > button, .comp-admin-action-card > form, .comp-admin-action-card > .comp-status-badge { flex: 0 0 auto; }
.comp-admin-actions { display: flex; flex: 0 0 auto; flex-wrap: wrap; justify-content: flex-end; gap: .5rem; }
.comp-admin-action-card--danger { border-color: rgba(185, 28, 28, .25); background: rgba(254, 242, 242, .55); }
.comp-task-pilot-list { display: grid; gap: .8rem; }
.comp-task-pilot-row {
    display: grid; grid-template-columns: minmax(10rem, 1.25fr) repeat(2, minmax(8rem, .8fr)); gap: .7rem;
    margin: 0; padding: .85rem; border: 1px solid var(--border-color, #e4e7ec); border-radius: .7rem;
}
.comp-task-pilot-row legend { padding: 0 .3rem; font-weight: 700; }
.comp-task-pilot-row label { display: grid; align-content: start; gap: .3rem; min-width: 0; }
.comp-task-pilot-row label > span { color: var(--text-muted, #667085); font-size: .78rem; font-weight: 700; }
.comp-task-pilot-reason { grid-column: 1 / -1; }

@media (max-width: 1050px) {
    .comp-search-toolbar { min-height: 235px; }
}

@media (max-width: 720px) {
    .comp-search-toolbar { --comp-header-inline: 1rem; gap: 1.75rem; min-height: 0; padding: 1rem var(--comp-header-inline); background-position: 58% center; }
    .comp-browser-heading { align-items: flex-start; }
    .comp-browser-heading .page-heading-actions { margin-left: auto; }
    .comp-search-form { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; padding: .72rem; }
    .comp-search-field--query { grid-column: 1 / 3; }
    .comp-search-submit { align-self: end; }
    .comp-browser-table thead { display: none; }
    .comp-browser-table .comp-browser-row { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 9px; padding: 0; }
    .comp-browser-table td { width: auto; min-width: 0; padding: 9px 0; border: 0; text-align: left; }
    .comp-browser-table td.comp-browser-country-col,
    .comp-browser-table td.comp-browser-scoring-col,
    .comp-browser-table td.comp-browser-season-col { display: none; }
    .comp-browser-main-col { display: grid; gap: 4px; }
    .comp-browser-mobile-meta {
        display: flex; align-items: center; flex-wrap: wrap; gap: 4px 9px;
        min-width: 0; color: var(--muted); font-size: .76rem; line-height: 1.25;
    }
    .comp-browser-mobile-meta > span:not(.comp-status-badge) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .comp-browser-mobile-meta .comp-status-badge { padding-block: 2px; }
    .comp-profile-header { grid-template-columns: auto 1fr; padding: 1rem; }
    .comp-profile-actions { grid-column: 1 / -1; justify-content: flex-start; }
    .comp-info-layout { grid-template-columns: 1fr; }
    .comp-info-description, .comp-info-admin { grid-column: 1; }
    .comp-admin-action-card { align-items: flex-start; flex-direction: column; }
    .comp-task-pilot-row { grid-template-columns: 1fr; }
    .comp-task-pilot-reason { grid-column: 1; }
    .comp-profile-content > .pilot-profile-panel { padding: 0; }
    .comp-live { padding: .75rem; }
    .comp-live-header { display: grid; }
    .comp-live-updated { margin-top: 0 !important; }
    .comp-live-map-root { height: 68vh; min-height: 380px; }
}

* {
    box-sizing: border-box;
}

html {
    font-family: var(--font-family-sans);
    font-size: 15px;
    line-height: 1.4;
}

body {
    margin: 0;
    background: var(--page);
    color: var(--text);
}

a {
    color: var(--link);
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

.pilot-identity-avatar-link {
    text-decoration: none;
}

.pilot-identity-avatar-link:hover,
.pilot-identity-avatar-link:focus-visible {
    outline: 2px solid var(--focus-outline);
    outline-offset: var(--pilot-identity-avatar-focus-offset);
    text-decoration: none;
}

.pilot-identity-name-link {
    color: var(--pilot-identity-link);
    text-decoration: none;
}

.pilot-identity-name-link:hover,
.pilot-identity-name-link:focus-visible {
    color: var(--pilot-identity-link-hover);
    text-decoration: underline;
}

.app-map-controls-host {
    container-type: inline-size;
}

.leaflet-container {
    isolation: isolate;
}

.app-map-controls.leaflet-control {
    display: grid;
    gap: 0;
    margin: 10px 0 0 10px;
    padding: 0;
    border: 0;
    border-radius: var(--radius-sm);
    background: #3391df;
    box-shadow: 0 8px 22px rgba(15, 54, 92, 0.18);
    backdrop-filter: blur(7px);
    overflow: hidden;
    font-family: var(--map-panel-font-family);
    font-size: var(--map-panel-font-size);
    font-weight: 400;
    line-height: var(--map-panel-line-height);
}

.app-map-controls.leaflet-control.is-collapsed {
    opacity: 0.82;
}

.app-map-controls__actions {
    display: grid;
    gap: 0;
}

.app-map-control-button {
    min-width: 32px;
    min-height: 32px;
    display: grid;
    grid-template-columns: 18px minmax(0, auto);
    align-items: center;
    gap: 6px;
    padding: 0 8px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #fff;
    cursor: pointer;
    font: inherit;
    font-weight: 400;
    white-space: nowrap;
}

.app-map-control-button:hover,
.app-map-control-button:focus-visible {
    background: rgba(255, 255, 255, 0.14);
}

.app-map-control-button.is-active {
    background: rgba(255, 255, 255, 0.22);
}

.app-map-control-button:disabled {
    cursor: wait;
    opacity: 0.76;
}

.app-map-controls__toggle {
    border-bottom: 1px solid rgba(255, 255, 255, 0.16);
    background: var(--map-panel-toggle-bg);
}

.app-map-controls__toggle:hover,
.app-map-controls__toggle:focus-visible {
    background: var(--map-panel-toggle-hover-bg);
}

.app-map-controls.is-collapsed .app-map-controls__toggle {
    grid-template-columns: 18px;
    justify-content: center;
    border-bottom: 0;
    padding-right: 7px;
    padding-left: 7px;
    background: transparent;
}

.app-map-controls.is-collapsed .app-map-controls__toggle:hover,
.app-map-controls.is-collapsed .app-map-controls__toggle:focus-visible {
    background: rgba(255, 255, 255, 0.14);
}

.app-map-controls.is-collapsed .app-map-controls__toggle .app-map-control-label {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    border: 0;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.app-map-controls.is-collapsed .app-map-controls__toggle .app-map-control-icon {
    transform: rotate(0deg);
}

.app-map-control-icon {
    width: 18px;
    height: 18px;
    display: inline-block;
    background: currentColor;
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: 18px 18px;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 18px 18px;
}

.app-map-control-icon--toggle {
    mask-image: url("/icons/ui/chevron-down.svg");
    -webkit-mask-image: url("/icons/ui/chevron-down.svg");
    transform: rotate(180deg);
}

.app-map-control-icon--layers {
    mask-image: url("/icons/ui/layers.svg");
    -webkit-mask-image: url("/icons/ui/layers.svg");
}

.app-map-control-icon--airspace {
    mask-image: url("/icons/ui/plane.svg");
    -webkit-mask-image: url("/icons/ui/plane.svg");
}

.app-map-control-icon--users {
    mask-image: url("/icons/ui/users.svg");
    -webkit-mask-image: url("/icons/ui/users.svg");
}

.app-map-control-icon--plus {
    mask-image: url("/icons/ui/plus.svg");
    -webkit-mask-image: url("/icons/ui/plus.svg");
}

.app-map-control-icon--minus {
    mask-image: url("/icons/ui/minus.svg");
    -webkit-mask-image: url("/icons/ui/minus.svg");
}

.app-map-control-icon--maximize-2 {
    mask-image: url("/icons/ui/maximize-2.svg");
    -webkit-mask-image: url("/icons/ui/maximize-2.svg");
}

.app-map-control-label {
    min-width: 0;
    overflow: hidden;
    color: currentColor;
    font-size: var(--font-sm);
    text-overflow: ellipsis;
}

@container (max-width: 560px) {
    .app-map-control-button {
        grid-template-columns: 18px;
        justify-content: center;
        padding-right: 7px;
        padding-left: 7px;
    }

    .app-map-control-label {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
    }
}

.map-airspace-modal {
    --app-modal-width: 320px;
}

.map-airspace-modal .app-modal__body {
    padding: var(--space-sm);
}

.map-airspace-list {
    display: grid;
    gap: 2px;
}

.map-airspace-list__item {
    min-height: 36px;
    display: block;
    width: 100%;
    padding: 8px 10px;
    border: 0;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--text);
    cursor: pointer;
    font-size: var(--font-md);
    font-weight: 700;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.map-airspace-list__item:hover,
.map-airspace-list__item:focus-visible {
    background: var(--control-bg-hover);
}

.map-airspace-list__message {
    padding: 8px 10px;
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 700;
}

.map-airspace-popup {
    min-width: 190px;
    display: grid;
    gap: 3px;
}

.map-airspace-popup__title {
    padding: 0 2px 4px;
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 750;
}

.map-airspace-popup__item {
    width: 100%;
    display: grid;
    grid-template-columns: 10px minmax(0, 1fr);
    align-items: start;
    gap: 7px;
    padding: 6px;
    border: 0;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--text);
    cursor: pointer;
    text-align: left;
}

.map-airspace-popup__item:hover,
.map-airspace-popup__item:focus-visible {
    background: var(--control-bg-hover);
}

.map-airspace-popup__swatch {
    width: 10px;
    height: 10px;
    margin-top: 3px;
    border-radius: 50%;
}

.map-airspace-popup__text {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.map-airspace-popup__text strong {
    min-width: 0;
    overflow: hidden;
    color: var(--text);
    font-size: var(--font-sm);
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.map-airspace-popup__text span {
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 650;
}

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

:where(input, textarea)::placeholder {
    color: var(--form-placeholder-text);
    font-weight: var(--form-placeholder-weight);
    opacity: 1;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 0;
    box-shadow: var(--focus-ring);
}

:where(
    .form-control,
    .field > input,
    .field > select,
    .field > textarea,
    .autocomplete:not(.autocomplete--overlay-search) input[data-autocomplete-input]
) {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    min-height: var(--form-control-height);
    padding: 0 10px;
    border: 1px solid var(--control-border);
    border-radius: var(--form-control-radius);
    background: var(--form-control-bg);
    color: var(--text);
    font-size: var(--font-md);
    font-weight: 500;
    box-shadow: none;
}

:where(
    .form-control,
    .field > input,
    .field > select,
    .field > textarea,
    .autocomplete:not(.autocomplete--overlay-search) input[data-autocomplete-input]
):hover:not(:disabled):not([aria-invalid="true"]) {
    border-color: var(--control-border-hover);
}

:where(
    .form-control,
    .field > input,
    .field > select,
    .field > textarea,
    .autocomplete:not(.autocomplete--overlay-search) input[data-autocomplete-input]
):focus-visible {
    border-color: var(--control-border-hover);
}

:where(
    .form-control,
    .field > input,
    .field > select,
    .field > textarea,
    .autocomplete:not(.autocomplete--overlay-search) input[data-autocomplete-input]
)[aria-invalid="true"] {
    border-color: var(--form-control-invalid-border);
    background: var(--form-control-invalid-bg);
    box-shadow: var(--form-control-invalid-ring);
}

:where(
    .form-control,
    .field > input,
    .field > select,
    .field > textarea,
    .autocomplete:not(.autocomplete--overlay-search) input[data-autocomplete-input]
):disabled {
    background: var(--content-subtle-bg);
    color: var(--control-disabled-text);
    cursor: not-allowed;
}

:where(
    select.form-control,
    .field > select
) {
    padding-right: 32px;
}

.form-grid {
    display: grid;
    align-items: start;
    gap: var(--form-grid-gap);
}

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

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

.field {
    min-width: 0;
    display: grid;
    align-content: start;
    gap: var(--form-field-gap);
    color: var(--form-label-text);
    font-size: var(--font-sm);
    font-weight: var(--form-label-weight);
}

.field textarea {
    min-height: 96px;
    padding-block: 9px;
    line-height: 1.4;
    resize: vertical;
}

.field--wide {
    grid-column: 1 / -1;
}

.field-hint {
    display: block;
    margin: 0;
    color: var(--form-hint-text);
    font-size: 0.78rem;
    font-weight: 400;
    line-height: 1.35;
}

.field-error {
    margin: 0;
    color: var(--form-error-text);
    font-size: var(--font-sm);
    font-weight: 600;
    line-height: 1.25;
}

.field-check {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 9px;
    color: var(--form-label-text);
    font-size: var(--font-sm);
    font-weight: var(--form-label-weight);
}

.field-check input {
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
    margin: 0;
    accent-color: var(--state-selected-icon);
}

.field-check--panel {
    min-height: 42px;
    padding: 8px 10px;
    border: 1px solid var(--panel-border);
    border-radius: var(--form-control-radius);
    background: var(--control-bg);
    color: var(--text);
}

.field-check--panel:has(input:checked) {
    border-color: var(--state-selected-border);
    background: var(--state-selected-bg);
    color: var(--state-selected-text);
}

.toggle-check {
    position: relative;
    min-width: 0;
    min-height: 36px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 6px 8px;
    border-radius: var(--form-control-radius);
    color: var(--text);
    cursor: pointer;
}

.toggle-check:has(.toggle-check__input:focus-visible) {
    outline: 2px solid var(--focus-outline);
    outline-offset: 1px;
}

.toggle-check:has(.toggle-check__input:disabled) {
    cursor: not-allowed;
    opacity: 0.6;
}

.toggle-check__input {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.toggle-check__icon {
    position: relative;
    width: 32px;
    height: 20px;
    flex: 0 0 32px;
}

.toggle-check__icon::before,
.toggle-check__icon::after {
    position: absolute;
    content: "";
    transition: background-color 140ms ease, border-color 140ms ease, transform 140ms ease;
}

.toggle-check__icon::before {
    top: 1px;
    left: 0;
    width: 32px;
    height: 18px;
    box-sizing: border-box;
    border: 2px solid var(--icon-muted);
    border-radius: 999px;
    background: transparent;
}

.toggle-check__icon::after {
    top: 5px;
    left: 4px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--icon-muted);
}

.toggle-check:hover .toggle-check__icon::before {
    border-color: var(--state-selected-border-hover);
}

.toggle-check:hover .toggle-check__icon::after {
    background: var(--state-selected-icon);
}

.toggle-check__input:checked + .toggle-check__icon::before {
    border-color: var(--state-selected-icon);
    background: var(--state-selected-icon);
}

.toggle-check__input:checked + .toggle-check__icon::after {
    background: #fff;
    transform: translateX(14px);
}

.toggle-check:hover .toggle-check__input:checked + .toggle-check__icon::before {
    border-color: var(--state-selected-text);
    background: var(--state-selected-text);
}

.toggle-check__label {
    min-width: 0;
}

.form-error {
    margin: 0 0 var(--form-grid-gap);
    padding: 10px 12px;
    border: 1px solid #f1c8c3;
    border-radius: var(--form-control-radius);
    background: #fff7f6;
    color: #8f1d16;
    font-size: var(--font-sm);
    font-weight: 650;
    line-height: 1.35;
}

.form-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--form-actions-gap);
    margin-top: var(--form-grid-gap);
}

.form-control-icon-wrap {
    position: relative;
    display: block;
    min-width: 0;
}

.form-control-icon-wrap > .ui-icon {
    position: absolute;
    top: 50%;
    left: 10px;
    z-index: 1;
    width: 16px;
    height: 16px;
    opacity: 0.72;
    pointer-events: none;
    transform: translateY(-50%);
}

.form-control-icon-wrap > .form-control {
    padding-left: 35px;
}

.segmented-field {
    --segmented-field-label-width: 80px;
    --segmented-field-gap: 14px;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.segmented-field > legend {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.segmented-field__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: var(--form-field-gap);
}

.segmented-field--inline .segmented-field__row {
    grid-template-columns: var(--segmented-field-label-width) minmax(0, 1fr);
    align-items: center;
    gap: var(--segmented-field-gap);
}

.segmented-field--contextual .segmented-field__row {
    gap: 0;
}

.segmented-field__label {
    min-width: 0;
    color: var(--form-label-text);
    font-size: var(--font-sm);
    font-weight: var(--form-label-weight);
}

.segmented-control {
    min-width: 0;
    min-height: var(--form-control-height);
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr);
    gap: 2px;
    padding: 2px;
    border: 1px solid var(--control-border);
    border-radius: var(--form-control-radius);
    background: var(--form-control-bg);
}

.segmented-field[aria-invalid="true"] .segmented-control {
    border-color: var(--form-control-invalid-border);
    background: var(--form-control-invalid-bg);
    box-shadow: var(--form-control-invalid-ring);
}

.segmented-control--four {
    grid-auto-flow: initial;
    grid-auto-columns: initial;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.segmented-control__option {
    position: relative;
    min-width: 0;
    cursor: pointer;
}

.segmented-control__option > input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.segmented-control__content {
    min-height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 10px;
    border-radius: calc(var(--form-control-radius) - 2px);
    color: #536273;
    font-size: var(--font-sm);
    font-weight: 700;
    text-align: center;
    transition: background 140ms ease, color 140ms ease;
}

.segmented-control__option:hover .segmented-control__content {
    background: var(--control-bg-hover);
    color: var(--text);
}

.segmented-control__option > input:checked + .segmented-control__content {
    background: var(--state-selected-bg);
    color: var(--state-selected-text);
}

.segmented-control__option > input:checked + .segmented-control__content .segmented-control__icon {
    color: var(--state-selected-icon);
}

.segmented-control__option:hover > input:checked + .segmented-control__content {
    background: var(--state-selected-bg-hover);
}

.segmented-control__option > input:focus-visible + .segmented-control__content {
    box-shadow: var(--focus-ring);
}

.segmented-control__option > input:disabled + .segmented-control__content {
    color: var(--control-disabled-text);
    cursor: not-allowed;
    opacity: 0.68;
}

.segmented-control__icon {
    width: 17px;
    height: 17px;
    flex: 0 0 17px;
    background: currentColor;
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: 17px 17px;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 17px 17px;
}

@media (max-width: 520px) {
    .segmented-field--inline .segmented-field__row {
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
        gap: var(--form-field-gap);
    }
}

@media (max-width: 560px) {
    .form-grid--two,
    .form-grid--three {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 760px) {
    .segmented-control--four {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.topbar {
    position: relative;
    z-index: var(--z-topbar);
    min-height: 52px;
    background: var(--topbar-bg);
    color: var(--topbar-text);
    box-shadow: var(--topbar-shadow);
}

.topbar-inner {
    position: relative;
    max-width: var(--topbar-shell-max-width);
    min-width: 0;
    min-height: 52px;
    display: flex;
    align-items: center;
    gap: var(--panel-gap);
    margin: 0 auto;
    padding: 0 var(--page-shell-gutter);
}

.topbar-content-end-guide {
    position: absolute;
    inset-block-start: 0;
    inset-inline-end: calc(
        max(0px, (100% - var(--page-max-width)) / 2)
        + var(--page-shell-padding-inline)
    );
    width: 0;
    height: 0;
    pointer-events: none;
}

.topbar-primary {
    min-width: 0;
    flex: 1;
    display: flex;
    align-items: center;
    gap: 2px;
}

.topbar-actions {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 2px;
}

.brand {
    flex: 0 0 auto;
    color: var(--topbar-text);
    min-height: 52px;
    display: inline-flex;
    align-items: center;
}

.brand:hover {
    background: var(--topbar-hover-bg);
    color: var(--topbar-text);
    text-decoration: none;
}

.brand:focus-visible {
    border-radius: var(--radius-sm);
    outline: 2px solid var(--topbar-text);
    outline-offset: -4px;
}

.brand-mark {
    width: 48px;
    min-height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.brand-logo {
    display: block;
    width: auto;
    height: 36px;
    max-width: 108px;
    object-fit: contain;
}

.brand-label {
    position: relative;
    min-height: 52px;
    display: none;
    align-items: center;
    margin-left: var(--panel-gap);
    padding: 0 14px;
    color: var(--topbar-text-muted);
    line-height: 1;
}

.brand:hover .brand-label,
.brand.is-active .brand-label {
    color: var(--topbar-text);
}

.brand.is-active .brand-label::after {
    content: "";
    position: absolute;
    right: 12px;
    bottom: 0;
    left: 12px;
    height: 2px;
    background: var(--topbar-active-indicator);
}

.main-nav,
.user-nav {
    display: flex;
    align-items: center;
    gap: 2px;
}

.main-nav {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
}

.main-nav .topbar-nav-item {
    display: none;
}

@media (min-width: 520px) {
    .brand-label {
        display: inline-flex;
    }

    .main-nav .topbar-nav-item--tier-4 {
        display: inline-flex;
    }
}

@media (min-width: 761px) {
    .main-nav .topbar-nav-item--tier-6 {
        display: inline-flex;
    }
}

@media (min-width: 1000px) {
    .main-nav .topbar-nav-item--tier-8 {
        display: inline-flex;
    }
}

.user-nav,
.topbar-more {
    flex: 0 0 auto;
}

.main-nav .topbar-nav-item.is-priority-hidden {
    display: none !important;
}

.main-nav :is(a, button),
.user-nav a,
.topbar-button {
    position: relative;
    color: var(--topbar-text-muted);
    min-height: 52px;
    display: inline-flex;
    align-items: center;
    padding: 0 14px;
    line-height: 1;
}

.main-nav :is(a, button):hover,
.user-nav a:hover,
.topbar-button:hover {
    background: var(--topbar-hover-bg);
    color: var(--topbar-text);
    text-decoration: none;
}

.main-nav .topbar-nav-item.is-active {
    color: var(--topbar-text);
}

.main-nav .topbar-nav-item.is-active::after {
    content: "";
    position: absolute;
    right: 12px;
    bottom: 0;
    left: 12px;
    height: 2px;
    border-radius: 0;
    background: var(--topbar-active-indicator);
}

.topbar-feed-link {
    gap: 6px;
}

.topbar-pilots-link {
    gap: 6px;
}

.topbar-private-message-unread {
    display: contents;
}

.main-nav button.topbar-nav-item {
    border: 0;
    background: transparent;
    cursor: pointer;
    font: inherit;
}

.user-nav .topbar-account {
    min-width: 42px;
    justify-content: center;
    padding: 0 5px;
}

.topbar-account__avatar {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.38);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.14);
    color: var(--topbar-text);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.02em;
}

.topbar-account__avatar img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.topbar-unread-badge {
    min-width: 19px;
    height: 19px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 5px;
    border-radius: 999px;
    background: #ffdf6b;
    color: #163550;
    font-size: 0.72rem;
    font-weight: 850;
    line-height: 1;
}

.topbar-more-menu .topbar-unread-badge {
    margin-left: auto;
}

.topbar-button {
    max-width: min(220px, 24vw);
    overflow: hidden;
    border: 0;
    background: transparent;
    cursor: pointer;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.topbar-more {
    position: relative;
    display: block;
}

.topbar-more > button {
    min-height: 52px;
    min-width: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 12px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--topbar-text-muted);
    cursor: pointer;
    font: inherit;
}

.topbar-more > button:hover,
.topbar-more > button[aria-expanded="true"] {
    background: var(--topbar-hover-bg);
    color: var(--topbar-text);
}

.topbar-more.is-active > button {
    color: var(--topbar-text);
}

.topbar-more.is-active > button::after {
    content: "";
    position: absolute;
    right: 12px;
    bottom: 0;
    left: 12px;
    height: 2px;
    border-radius: 0;
    background: var(--topbar-active-indicator);
}

.topbar-more-trigger__icon,
.topbar-more-trigger__icon::before,
.topbar-more-trigger__icon::after {
    width: 4px;
    height: 4px;
    display: block;
    border-radius: 50%;
    background: currentColor;
}

.topbar-more-trigger__icon {
    position: relative;
    display: none;
}

.topbar-more-trigger__icon::before,
.topbar-more-trigger__icon::after {
    content: "";
    position: absolute;
    top: 0;
}

.topbar-more-trigger__icon::before {
    left: -8px;
}

.topbar-more-trigger__icon::after {
    left: 8px;
}

.topbar-more-trigger__label {
    display: inline;
    line-height: 1;
}

.topbar-more-trigger__label--mobile {
    display: none;
}

.topbar-more-trigger__chevron {
    width: 14px;
    height: 14px;
    display: block;
    flex: 0 0 14px;
    background: currentColor;
    mask-image: url("/icons/ui/chevron-down.svg");
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: 14px 14px;
    -webkit-mask-image: url("/icons/ui/chevron-down.svg");
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 14px 14px;
    transition: transform 140ms ease;
}

.topbar-more > button[aria-expanded="true"] .topbar-more-trigger__chevron {
    transform: rotate(180deg);
}

.topbar-more-menu {
    --topbar-more-grid-gap:0;
    --topbar-more-item-min-height: 50px;
    --topbar-more-item-icon-column: 34px;
    --topbar-more-item-icon-size: 32px;
    --topbar-more-item-gap: 9px;
    padding: var(--space);
    border: 1px solid var(--panel-border);
    border-radius: var(--radius-md);
    background: var(--panel);
    box-shadow: var(--shadow-panel);
}

.topbar-more-account {
    display: flex;
    align-items: center;
    gap: 10px;
}

.topbar-more-profile {
    min-width: 0;
    flex: 1 1 auto;
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) 18px;
    align-items: center;
    gap: 11px;
    padding: 4px;
    border-radius: var(--radius-md);
    color: var(--text);
    text-decoration: none;
}

.topbar-more-profile:hover {
    background: var(--hover-bg);
    color: var(--blue-dark);
    text-decoration: none;
}

.topbar-more-avatar {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--avatar-border);
    border-radius: 50%;
    background: var(--avatar-bg);
    color: var(--avatar-placeholder-text);
    font-size: 0.82rem;
    font-weight: 850;
}

.topbar-more-avatar img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.topbar-more-profile__copy {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.topbar-more-profile__copy strong,
.topbar-more-profile__copy span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.topbar-more-profile__copy strong {
    font-size: 0.92rem;
}

.topbar-more-profile__copy span {
    color: var(--muted);
    font-size: 0.76rem;
}

.topbar-more-chevron {
    width: 16px;
    height: 16px;
    background: currentColor;
    mask: url("/icons/ui/chevron-right.svg") center / 16px 16px no-repeat;
    -webkit-mask: url("/icons/ui/chevron-right.svg") center / 16px 16px no-repeat;
}

.topbar-more-upload {
    width: 100%;
}

.topbar-more-upload__icon {
    width: 17px;
    height: 17px;
    background: currentColor;
    mask: url("/icons/ui/upload.svg") center / 17px 17px no-repeat;
    -webkit-mask: url("/icons/ui/upload.svg") center / 17px 17px no-repeat;
}

.topbar-more-links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--topbar-more-grid-gap);
    margin-top: var(--space);
    padding-top: var(--space);
    border-top: 1px solid var(--line-soft);
}

.topbar-more-links--first {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}

.topbar-more-links :is(a, button) {
    min-width: 0;
    min-height: var(--topbar-more-item-min-height);
    display: grid;
    grid-template-columns: var(--topbar-more-item-icon-column) minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--topbar-more-item-gap);
    padding: 7px 9px;
    border: 1px solid transparent;
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--text);
    cursor: pointer;
    font-family: inherit;
    font-size: 0.84rem;
    font-weight: 700;
    line-height: normal;
    text-align: left;
    text-decoration: none;
}

.topbar-more-links :is(a, button):hover {
    border-color: var(--panel-border);
    background: var(--hover-bg);
    color: var(--blue-dark);
    text-decoration: none;
}

.topbar-more-links :is(a, button).is-active {
    border-color: var(--control-border-hover);
    background: var(--row-selected);
    color: var(--blue-dark);
    box-shadow: inset 3px 0 var(--accent);
    font-weight: 800;
}

.topbar-more-links img {
    width: var(--topbar-more-item-icon-size);
    height: var(--topbar-more-item-icon-size);
    display: block;
    object-fit: contain;
}

@media (min-width: 761px) {
    .topbar-more-menu {
        --topbar-more-grid-gap: 0px;
        --topbar-more-item-min-height: 60px;
        --topbar-more-item-icon-column: 42px;
        --topbar-more-item-icon-size: 40px;
        --topbar-more-item-gap: var(--space);
        padding: calc(var(--space) + var(--space-sm));
    }

    .topbar-more-links :is(a, button) {
        padding: 8px 10px;
        font-size: 0.88rem;
    }

    .topbar-more-profile {
        grid-template-columns: 50px minmax(0, 1fr) 18px;
        gap: var(--space);
        padding: var(--space-sm);
    }

    .topbar-more-avatar {
        width: 50px;
        height: 50px;
    }

    .topbar-more-flat-action {
        min-height: 48px;
    }
}

.topbar-more-links :is(a, button) > span:not(.topbar-unread-badge) {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.topbar-more-links .topbar-unread-badge {
    margin-left: 0;
}

@media (max-width: 520px) {
    .app-modal--topbar-menu .topbar-more-menu {
        --topbar-more-grid-gap: 4px;
        --topbar-more-item-min-height: 64px;
        --topbar-more-item-icon-size: 40px;
        padding: 8px;
        scrollbar-width: thin;
        scrollbar-color: color-mix(in srgb, var(--muted) 35%, transparent) transparent;
    }

    .app-modal--topbar-menu .topbar-more-menu::-webkit-scrollbar {
        width: 6px;
    }

    .app-modal--topbar-menu .topbar-more-menu::-webkit-scrollbar-track {
        background: transparent;
    }

    .app-modal--topbar-menu .topbar-more-menu::-webkit-scrollbar-thumb {
        border: 1px solid transparent;
        border-radius: 999px;
        background: color-mix(in srgb, var(--muted) 35%, transparent);
        background-clip: content-box;
    }

    .topbar-more-links:not(.topbar-more-links--first) {
        margin-top: 8px;
        padding-top: 8px;
    }

    .topbar-more-links :is(a, button) {
        position: relative;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: 40px auto;
        align-content: center;
        justify-items: center;
        gap: 3px;
        padding: 2px 4px;
        font-weight: 650;
        text-align: center;
    }

    .topbar-more-links :is(a, button).is-active {
        border-color: color-mix(in srgb, var(--control-border-hover) 45%, var(--row-selected));
        font-weight: 800;
    }

    .topbar-more-links img {
        grid-column: 1;
        grid-row: 1;
    }

    .topbar-more-links :is(a, button) > span:not(.topbar-unread-badge) {
        grid-column: 1;
        grid-row: 2;
        max-width: 100%;
        overflow: visible;
        overflow-wrap: anywhere;
        text-overflow: clip;
        white-space: normal;
        line-height: 1.15;
    }

    .topbar-more-links .topbar-unread-badge {
        position: absolute;
        top: 5px;
        right: 5px;
    }

    .topbar-more-actions {
        margin-top: 8px;
    }
}

.topbar-more-actions {
    margin-top: var(--space);
    border-top: 1px solid var(--line-soft);
}

.topbar-more-footer {
    display: flex;
    align-items: center;
    gap: 0;
}

.topbar-more-upload + .topbar-more-footer {
    border-top: 1px solid var(--line-soft);
}

.topbar-more-language-picker {
    position: relative;
}

.topbar-more-language-trigger {
    width: 100%;
    min-height: 44px;
    display: grid;
    grid-template-columns: auto 12px minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-items: center;
    column-gap: 4px;
    padding: 6px 10px;
    border: 0;
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--text);
    cursor: pointer;
    font: inherit;
    text-align: left;
}

.topbar-more-language-trigger:hover,
.topbar-more-language-trigger[aria-expanded="true"] {
    background: transparent;
    color: var(--blue-dark);
}

.topbar-more-language-picker__label {
    color: var(--muted);
    font-size: 0.7rem;
    font-weight: 700;
}

.topbar-more-language-picker__value {
    grid-column: 1 / -1;
    color: var(--text);
    font-size: 0.82rem;
    font-weight: 700;
}

.topbar-more-language-picker__chevron {
    grid-column: 2;
    grid-row: 1;
    width: 12px;
    height: 12px;
    background: currentColor;
    mask: url("/icons/ui/chevron-down.svg") center / 12px 12px no-repeat;
    -webkit-mask: url("/icons/ui/chevron-down.svg") center / 12px 12px no-repeat;
    transition: transform 140ms ease;
}

.topbar-more-language-trigger[aria-expanded="true"] .topbar-more-language-picker__chevron {
    transform: rotate(180deg);
}

.topbar-more-language-popup {
    position: absolute;
    bottom: calc(100% + 8px);
    left: 0;
    min-width: 210px;
    display: grid;
    gap: 2px;
    padding: 6px;
    border: 1px solid var(--panel-border);
    border-radius: var(--radius-md);
    background: var(--panel);
    box-shadow: var(--shadow-panel);
}

.topbar-more-language-popup a {
    min-height: 34px;
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    padding: 5px 8px;
    border: 1px solid transparent;
    border-radius: var(--radius-md);
    color: var(--text);
    font-size: 0.78rem;
    font-weight: 650;
    text-decoration: none;
}

.topbar-more-language-popup a span:first-child {
    color: var(--muted);
    font-size: 0.7rem;
    font-weight: 850;
}

.topbar-more-language-popup a:hover,
.topbar-more-language-popup a.is-active {
    border-color: var(--control-border-hover);
    background: var(--row-selected);
    color: var(--blue-dark);
    text-decoration: none;
}

.topbar-more-footer__divider {
    flex: 0 0 1px;
    width: 1px;
    height: 28px;
    background: var(--line-soft);
}

.topbar-more-footer__item {
    min-width: 0;
    flex: 1 1 0;
}

.topbar-more-flat-action {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0 8px;
    border: 0;
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--muted);
    cursor: pointer;
    font-weight: 700;
}

.topbar-more-flat-action:hover {
    background: var(--hover-bg);
    color: var(--blue-dark);
}

.topbar-more-session-action__icon {
    width: 17px;
    height: 17px;
    background: currentColor;
}

.topbar-more-session-action__icon--login {
    mask: url("/icons/ui/log-in.svg") center / 17px 17px no-repeat;
    -webkit-mask: url("/icons/ui/log-in.svg") center / 17px 17px no-repeat;
}

.topbar-more-session-action__icon--logout {
    mask: url("/icons/ui/log-out.svg") center / 17px 17px no-repeat;
    -webkit-mask: url("/icons/ui/log-out.svg") center / 17px 17px no-repeat;
}

.page {
    max-width: var(--page-max-width);
    margin: var(--page-shell-margin-block-start) auto var(--page-shell-margin-block-end);
    padding: 0 var(--page-shell-gutter);
}

.page-shell {
    max-width: var(--page-max-width);
    margin: 0 auto;
    padding: var(--page-shell-padding-block) var(--page-shell-padding-inline);
    background: var(--page-shell-bg);
}

body.site-footer-page {
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
}

body.site-footer-page > main {
    width: 100%;
    box-sizing: border-box;
}

.site-footer {
    width: 100%;
    box-sizing: border-box;
    margin-top: auto;
    padding: 18px var(--page-shell-gutter) 14px;
    color: var(--form-label-text);
    font-size: 0.84rem;
}

.site-footer__inner {
    max-width: var(--page-max-width);
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin: 0 auto;
    padding-top: 10px;
    border-top: 1px solid color-mix(in srgb, var(--line) 76%, transparent);
}

.site-footer__identity,
.site-footer__links {
    min-width: 0;
    display: flex;
    align-items: center;
}

.site-footer__links a:focus-visible {
    outline: 2px solid var(--focus-outline);
    outline-offset: 2px;
}

.site-footer__links {
    justify-content: flex-end;
    gap: 0;
    white-space: nowrap;
}

.site-footer__links a {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    color: var(--link);
    font-weight: 600;
    text-decoration: none;
}

.site-footer__links a:hover {
    text-decoration: underline;
}

.site-footer__links a + a {
    margin-left: 12px;
    padding-left: 12px;
    border-left: 1px solid var(--line);
}

.legal-notice-page {
    max-width: 820px;
}

.legal-notice-panel {
    padding: clamp(20px, 4vw, 42px);
}

.legal-notice-header {
    padding-bottom: 22px;
    border-bottom: 1px solid var(--line-soft);
}

.legal-notice-header h1 {
    margin: 0;
    color: var(--text);
    font-size: clamp(1.55rem, 3vw, 2rem);
    line-height: 1.15;
}

.legal-notice-lead {
    margin-top: 13px;
    color: var(--form-label-text);
    font-size: var(--font-md);
    line-height: 1.6;
}

.legal-notice-sections {
    margin: 0;
    padding: 0;
    list-style: none;
}

.legal-notice-sections li {
    padding: 20px 0;
    border-bottom: 1px solid var(--line-soft);
}

.legal-notice-sections h2 {
    margin: 0;
    color: var(--text);
    font-size: var(--font-md);
    line-height: 1.35;
}

.legal-notice-sections p {
    margin: 5px 0 0;
    color: var(--form-label-text);
    line-height: 1.58;
}

@media (max-width: 620px) {
    .site-footer {
        padding: 18px 12px 16px;
    }

    .site-footer__inner {
        min-height: 0;
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
    }

    .site-footer__identity {
        align-items: flex-start;
    }

    .site-footer__identity > span {
        line-height: 1.35;
    }

    .site-footer__links a {
        min-height: 36px;
    }

    .legal-notice-panel {
        padding: 20px 16px 24px;
    }

}

.flights-layout {
    min-width: 0;
}

.flights-page {
    --flight-list-inset: var(--page-gutter);
}

.flights-page > .flights-layout > .page-panel {
    border-color: color-mix(in srgb, var(--panel-border) 58%, transparent);
    container-name: flights-list-panel;
    container-type: inline-size;
}

.page-panel {
    background: var(--panel);
    border: 1px solid var(--panel-border);
    border-radius: var(--radius-md);
}

.feed-panel {
    overflow: hidden;
}

.feed-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--panel-gap);
    padding: 15px var(--page-gutter) 8px;
    background: var(--page-heading-bg);
}

.feed-header__copy {
    min-width: 0;
}
.feed-header__copy h1 {
    margin: 0;
    font-size: 1.75rem;
    line-height: 1.15;
    font-weight: 700;
}

.feed-tabs {
    display: flex;
    align-items: end;
    gap: 4px;
    min-width: 0;
    overflow-x: auto;
    padding: 0 var(--page-gutter);
    background: var(--page-heading-bg);
    scrollbar-width: none;
    margin:8px 0;
}

.feed-tabs::-webkit-scrollbar {
    display: none;
}

.feed-tab {
    position: relative;
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    gap: 7px;
    padding: 0 16px;
    border: 0;
    border-bottom: 3px solid var(--line-soft);
    border-radius: 0;
    background: transparent;
    color: var(--muted);
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.feed-tab:hover,
.feed-tab:focus-visible {
    color: var(--blue-dark);
    text-decoration: none;
}

.feed-tab.is-active {
    border-bottom-color: var(--accent);
    color: var(--accent);
}

.feed-comment-scopes {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    width: max-content;
    max-width: calc(100% - (2 * var(--page-gutter)));
    margin: 0 var(--page-gutter) 10px;
    padding: 3px;
    overflow-x: auto;
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-sm);
    background: #f7fafc;
    scrollbar-width: none;
}

.feed-comment-scopes::-webkit-scrollbar {
    display: none;
}

.feed-comment-scope {
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    padding: 0 10px;
    border-radius: calc(var(--radius-sm) - 1px);
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 750;
    text-decoration: none;
    white-space: nowrap;
}

.feed-comment-scope:hover,
.feed-comment-scope:focus-visible {
    color: var(--blue-dark);
    text-decoration: none;
}

.feed-comment-scope.is-active {
    background: var(--panel);
    color: var(--blue-dark);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}

.feed-guest-note {
    align-self: center;
    margin: 0;
    color: var(--muted);
    font-weight: 700;
}

.feed-settings {
    display: grid;
    gap: 9px;
}

.feed-settings fieldset {
    display: grid;
    gap: 8px;
    margin: 0;
    padding: 0;
    border: 0;
}

.feed-settings legend {
    margin-bottom: 2px;
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 850;
}

.feed-settings__options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px 10px;
}

.feed-settings--modal .feed-settings__options {
    grid-template-columns: 1fr;
    gap: 10px;
}

.feed-settings-open {
    align-self: start;
    justify-self: end;
}

.feed-settings label {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 7px;
    color: var(--text);
    font-size: var(--font-sm);
    font-weight: 700;
}

.feed-settings label.toggle-check {
    gap: 9px;
}

.feed-settings input {
    flex: 0 0 auto;
}


.feed-list {
    display: grid;
    gap: 8px;
    padding: 10px var(--page-gutter);
    background: var(--content-subtle-bg);
}

.feed-item {
    display: grid;
    grid-template-columns: 60px minmax(0, 1fr) 150px;
    gap: 14px;
    padding: 13px 14px;
    border: 1px solid var(--line-soft);
    border-radius: 6px;
    background: var(--panel);
    cursor: pointer;
}

.feed-item {
    color: inherit;
    text-decoration: none;
}

.feed-item:hover,
.feed-item:focus-visible {
    border-color: var(--control-border-hover);
    background: #fbfeff;
    text-decoration: none;
}

.feed-item:focus-visible {
    outline: 2px solid var(--focus-outline);
    outline-offset: -2px;
}

.feed-item:hover .feed-flight-map,
.feed-item:focus-visible .feed-flight-map {
    border-color: var(--control-border-hover);
}

.feed-item__rail {
    position: relative;
    min-width: 0;
    display: grid;
    justify-items: center;
    align-content: start;
    gap: 8px;
}

.feed-item__avatar {
    width: 60px;
    height: 60px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid var(--avatar-border);
    border-radius: 50%;
    background: var(--avatar-bg);
    color: var(--avatar-placeholder-text);
    font-weight: 850;
    text-decoration: none;
}

.feed-item__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.feed-item__body {
    font-size: var(--font-lg);
    margin-top:4px;
    min-width: 0;
    display: grid;
    align-content: start;
    gap: 8px;
}

.feed-item__headline {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: center;
    gap: 4px;
    color: var(--text);
}

.feed-item__headline-name,
.feed-item__headline-action {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.feed-item__headline-name {
    color: var(--text);
    font-size: 1.3rem;
    font-weight: 800;
    line-height: 1.15;
}

.feed-item__headline-action {
    color: var(--muted);
    font-weight: 500;
}

.feed-item__headline-action-pilot {
    color: var(--text);
    font-weight: 750;
}

.feed-item__index {
    position: absolute;
    top: 44px;
    right: -4px;
    min-width: 20px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 3px;
    border: 1px solid var(--rank-border);
    border-radius: 999px;
    background: var(--rank-bg);
    color: var(--rank-text);
    font-size: 0.66rem;
    font-weight: 650;
    line-height: 1;
    box-shadow: 0 1px 3px rgba(25, 55, 82, 0.14);
}
.feed-item__mask {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 850;
    display:none;
}
.feed-item__comment {
    margin: 0;
    padding: 9px 11px;
    border: 1px solid #dbe8ee;
    border-left: 3px solid #9fb8c5;
    border-radius: var(--radius-sm);
    background: #f1f7fa;
    color: var(--text);
    line-height: 1.4;
}


.feed-flight-map {
    width: 100%;
    max-width: 150px;
    justify-self: end;
    display: block;
    overflow: hidden;
    aspect-ratio: 1 / 1;
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-sm);
    background: var(--content-subtle-bg);
}


.feed-flight-map img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.feed-flight-summary {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: center;
    gap: 4px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.feed-flight-summary__main {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.feed-flight-summary__main strong,
.feed-flight-summary__main span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.feed-flight-summary__main span {
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 650;
}

.feed-flight-summary__site-line {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 8px;
}

.feed-flight-summary__site {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.feed-flight-summary__site-icon {
    width: 14px;
    height: 14px;
    flex: 0 0 14px;
    background: currentColor;
    mask-image: url("/icons/ui/map-pin.svg");
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: 14px 14px;
    -webkit-mask-image: url("/icons/ui/map-pin.svg");
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 14px 14px;
}
.feed-flight-summary__distance {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.feed-flight-summary__distance .score-icon {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    margin-top: 0;
}

.feed-flight-social {
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 700;
}

.feed-flight-social__item {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}

.feed-flight-social__icon {
    width: 15px;
    height: 15px;
    flex: 0 0 15px;
    background: currentColor;
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: 15px 15px;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 15px 15px;
}

.feed-flight-social__icon--likes {
    mask-image: url("/icons/ui/thumbs-up.svg");
    -webkit-mask-image: url("/icons/ui/thumbs-up.svg");
}

.feed-flight-social__icon--comments {
    mask-image: url("/icons/ui/message-circle.svg");
    -webkit-mask-image: url("/icons/ui/message-circle.svg");
}
.feed-more,
.feed-empty {
    padding: 18px var(--page-gutter);
    border-top: 1px solid var(--line-soft);
    text-align: center;
}

.feed-more a {
    min-height: var(--control-height-md);
    display: inline-flex;
    align-items: center;
    padding: 0 14px;
    border: 1px solid var(--control-border);
    border-radius: var(--radius-sm);
    background: var(--control-bg);
    color: var(--blue-dark);
    font-weight: 750;
    text-decoration: none;
}

.feed-more a:hover {
    border-color: var(--control-border-hover);
    background: var(--control-bg-hover);
}

.feed-empty {
    display: grid;
    gap: 7px;
    min-height: 220px;
    align-content: center;
    color: var(--muted);
}

.feed-empty h2 {
    margin: 0;
    color: var(--blue-dark);
    font-size: 1.45rem;
}

.feed-empty p {
    margin: 0;
    font-weight: 650;
}

@media (max-width: 760px) {
    .feed-settings__options {
        grid-template-columns: 1fr;
    }
    .feed-flight-summary {
        grid-template-columns: 1fr;
    }


    .feed-item {
        grid-template-columns: 52px minmax(0, 1fr) 150px;
    }

    .feed-item__avatar {
        width: 52px;
        height: 52px;
    }

    .feed-item__index {
        top: 36px;
    }

    .feed-flight-map {
        max-width: 150px;
    }
}

@media (max-width: 640px) {
    .feed-item {
        grid-template-columns: 52px minmax(0, 1fr);
        column-gap: 12px;
        row-gap: 9px;
    }

    .feed-item__rail {
        grid-column: 1;
        grid-row: 1;
    }

    .feed-item__body {
        display: contents;
    }

    .feed-item__headline {
        grid-column: 2;
        grid-row: 1;
        align-self: start;
        margin-top: 4px;
    }

    .feed-item__comment,
    .feed-flight-summary,
    .feed-flight-social {
        grid-column: 1 / -1;
    }

    .feed-flight-map {
        grid-column: 1 / -1;
        width: 100%;
        max-width: 100%;
        justify-self: stretch;
        display: grid;
        place-items: center;
        padding: 8px;
        aspect-ratio: auto;
        background: #f6fafc;
    }

    .feed-flight-map img {
        width: min(180px, 58vw);
        height: auto;
        aspect-ratio: 1 / 1;
        border: 1px solid var(--line-soft);
        border-radius: calc(var(--radius-sm) - 1px);
    }
}

@media (max-width: 520px) {
    .feed-item {
        grid-template-columns: 42px minmax(0, 1fr);
        column-gap: 9px;
    }

    .feed-item__avatar {
        width: 42px;
        height: 42px;
    }

    .feed-item__index {
        top: 28px;
    }
}

.page-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--panel-gap);
    padding: 15px var(--page-gutter) 8px;
    /* background: var(--page-heading-bg); */
}

.flights-page .page-heading {
    padding-right: var(--flight-list-inset);
    padding-left: var(--flight-list-inset);
}

.page-heading h1 {
    margin: 0;
    font-size: 1.75rem;
    line-height: 1.15;
    font-weight: 700;
}

.page-heading-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}

.page-action {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0 10px;
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--text);
    cursor: pointer;
    font: inherit;
    font-weight: 750;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    transition: background 140ms ease, color 140ms ease;
}

.page-action:hover:not(:disabled) {
    background: var(--control-bg-hover);
    color: var(--blue-dark);
    text-decoration: none;
}

.page-action:disabled {
    background: transparent;
    color: var(--control-disabled-text);
    cursor: default;
    opacity: 0.56;
}

.page-action--primary {
    border-color: transparent;
    background: var(--control-primary, #1873b5);
    color: #fff;
    box-shadow: var(--control-primary-shadow, 0 2px 6px rgba(18, 83, 132, 0.18));
}

.page-action--primary:hover:not(:disabled) {
    border-color: transparent;
    background: var(--control-primary-hover, #0f5f99);
    color: #fff;
}

.page-action--primary .ui-icon {
    filter: brightness(0) invert(1);
}

.page-action--utility {
    min-height: var(--control-height-md);
    padding-inline: 12px;
    border-color: color-mix(in srgb, var(--control-border) 72%, transparent);
    background: color-mix(in srgb, var(--panel) 78%, var(--control-bg));
    color: var(--blue-dark);
    transition: background 140ms ease, border-color 140ms ease, box-shadow 140ms ease, color 140ms ease;
}

.page-action--utility:hover:not(:disabled) {
    border-color: var(--control-border-hover);
    background: var(--control-bg-hover);
    box-shadow: 0 2px 6px rgba(23, 105, 168, 0.1);
}

.page-action--utility.page-action--active {
    border-color: color-mix(in srgb, var(--blue) 38%, var(--control-border));
    background: color-mix(in srgb, var(--blue) 11%, var(--panel));
}

.page-action--active {
    background: color-mix(in srgb, var(--blue) 9%, transparent);
    color: var(--blue-dark);
}

.page-heading p {
    margin: 4px 0 0;
    color: var(--muted);
}

.icon-button {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--control-border);
    border-radius: var(--radius-sm);
    background: var(--control-bg);
    color: var(--blue-dark);
    cursor: pointer;
    font-weight: 700;
}

.icon-button:hover:not(:disabled) {
    border-color: var(--control-border-hover);
    background: var(--control-bg-hover);
    color: var(--blue-dark);
}

.icon-button:disabled {
    color: var(--control-disabled-text);
    cursor: default;
    opacity: 0.56;
}

.ui-icon {
    width: 18px;
    height: 18px;
    display: block;
}

.flight-insights-strip {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
    min-height: 90px;
    padding: 4px var(--flight-list-inset) 6px;
    border-top: 1px solid color-mix(in srgb, var(--blue) 13%, var(--line-soft));
    border-bottom: 1px solid color-mix(in srgb, var(--blue) 18%, var(--line-soft));
    background: linear-gradient(
        105deg,
        color-mix(in srgb, var(--blue) 11%, var(--panel)),
        color-mix(in srgb, var(--blue) 4%, var(--panel))
    );
    box-shadow: inset 3px 0 0 color-mix(in srgb, var(--blue) 62%, var(--accent));
}

.flight-insights-strip__brand {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 6px;
    min-height: 18px;
    padding-inline: 2px;
    color: var(--blue-dark);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}


.flight-insights-strip__brand .ui-icon {
    width: 18px;
    height: 18px;
    padding: 3px;
    border-radius: 99px;
    background: color-mix(in srgb, var(--blue) 10%, var(--panel));
    opacity: .82;
}

.flight-insights-strip__cards {
    min-width: 0;
    display: flex;
    gap: 7px;
    overflow: hidden;
    background: transparent;
}

.flight-insights-strip-card {
    min-width: 0;
    min-height: 54px;
    flex: 1 1 0;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto 14px;
    align-items: center;
    gap: 8px;
    padding: 7px 11px;
    border: 1px solid color-mix(in srgb, var(--blue) 12%, var(--line-soft));
    border-radius: var(--radius-sm);
    background: color-mix(in srgb, var(--panel) 86%, transparent);
    color: var(--text);
    cursor: pointer;
    font: inherit;
    text-align: left;
    transition: background .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.flight-insights-strip-card:hover,
.flight-insights-strip-card:focus-visible {
    border-color: color-mix(in srgb, var(--blue) 38%, var(--control-border));
    background: var(--control-bg-hover);
    box-shadow: 0 3px 10px rgba(23, 105, 168, 0.11);
}

.flight-insights-strip-card--featured {
    flex-grow: 1.35;
}

.flight-insights-strip__cards--1 .flight-insights-strip-card {
    max-width: 620px;
}

.flight-insights-strip-card__icon {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border-radius: 99px;
    background: var(--content-subtle-bg);
    color: var(--blue-dark);
}

.flight-insights-strip-card__icon .ui-icon {
    width: 16px;
    height: 16px;
}

.flight-insights-strip-card__copy,
.flight-insights-strip-card__kicker {
    min-width: 0;
    overflow: hidden;
}

.flight-insights-strip-card__kicker {
    display: flex;
    gap: 6px;
    color: var(--muted);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .035em;
    line-height: 1.2;
    text-transform: uppercase;
    white-space: nowrap;
}

.flight-insights-strip-card__kicker > span:first-child {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.flight-insights-strip-card__meta {
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 650;
    letter-spacing: 0;
    text-transform: none;
}

.flight-insights-strip-card__title {
    display: block;
    margin-top: 3px;
    overflow: hidden;
    color: var(--text);
    font-size: 13px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.flight-insights-strip-card__count {
    display: grid;
    justify-items: end;
    color: var(--muted);
    line-height: 1;
    white-space: nowrap;
}

.flight-insights-strip-card__count strong {
    color: var(--accent);
    font-size: 18px;
}

.flight-insights-strip-card__count small {
    margin-top: 3px;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
}

.flight-insights-strip-card__arrow {
    width: 14px;
    height: 14px;
    opacity: .5;
}

@container flights-list-panel (max-width: 760px) {
    .flight-insights-strip {
        min-height: 0;
        gap: 0;
        padding-block: 7px;
    }

    .flight-insights-strip__brand {
        display: none;
    }

    .flight-insights-strip__cards {
        overflow-x: auto;
        overflow-y: hidden;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
    }

    .flight-insights-strip__cards::-webkit-scrollbar {
        display: none;
    }

    .flight-insights-strip-card,
    .flight-insights-strip-card--featured {
        width: min(82vw, 310px);
        max-width: none;
        min-height: 54px;
        flex: 0 0 min(82vw, 310px);
        scroll-snap-align: start;
    }
}

.flight-insights-modal .app-modal__panel {
    height: min(760px, calc(100dvh - var(--app-modal-vertical-gap)));
}

.flight-insights-modal .app-modal__header {
    padding-bottom: 13px;
    border-bottom: 0;
}

.flight-insights-tabs-bar {
    --filter-scroll-surface: var(--panel);
    flex: 0 0 auto;
    min-width: 0;
    border-bottom: 1px solid var(--line-soft);
    background: var(--panel);
}

.flight-insights-tabs-bar .active-filter-scroll {
    padding: 0 12px;
}

.flight-insights-tabs {
    gap: 4px;
    padding: 3px 0 0;
}

.flight-insights-tab {
    position: relative;
    flex: 0 0 auto;
    min-height: 44px;
    padding: 0 14px;
    border: 0;
    border-bottom: 3px solid transparent;
    background: transparent;
    color: var(--muted);
    cursor: pointer;
    font: inherit;
    font-weight: 700;
    white-space: nowrap;
}

.flight-insights-tab:hover {
    color: var(--blue-dark);
}

.flight-insights-tab.is-active {
    border-bottom-color: var(--accent);
    color: var(--accent);
}

.flight-insights-body {
    display: flex;
    overflow: hidden;
    padding: 0 !important;
}

.flight-insights-panel {
    flex: 1;
    min-width: 0;
    min-height: 0;
    overflow: auto;
}

.flight-insights-panel:not(.is-active) {
    display: none;
}

.flight-insights-loading,
.flight-insights-placeholder {
    min-height: 100%;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 10px;
    margin: 0;
    padding: 28px;
    color: var(--muted);
    font-weight: 650;
    text-align: center;
}

.flight-insights-placeholder .ui-icon {
    width: 28px;
    height: 28px;
    opacity: 0.72;
}

.flight-insights-placeholder p {
    margin: 0;
}

.flight-bulletin-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.flight-bulletin-item {
    padding: 16px 18px;
}

.flight-bulletin-item + .flight-bulletin-item {
    border-top: 1px solid var(--line-soft);
}

.flight-bulletin-item--xcg2 {
    background: color-mix(in srgb, var(--accent) 4%, transparent);
}

.flight-bulletin-item__meta {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--muted);
    font-size: var(--font-xs);
    font-weight: 700;
}

.flight-bulletin-item__category {
    color: var(--accent);
    letter-spacing: 0.025em;
    text-transform: uppercase;
}

.flight-bulletin-item h3 {
    margin: 5px 0 0;
    color: var(--text);
    font-size: var(--font-md);
    line-height: 1.3;
}

.flight-bulletin-item h3 a {
    color: inherit;
    text-decoration: none;
}

.flight-bulletin-item h3 a:hover {
    color: var(--link);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.flight-bulletin-item__body {
    margin: 7px 0 0;
    color: var(--text-soft);
    line-height: 1.5;
}

.flight-bulletin-item__body > span {
    white-space: pre-line;
}

.flight-bulletin-item__body a,
.flight-bulletin-item__sources a {
    color: var(--link);
    text-underline-offset: 2px;
}

.flight-bulletin-item__sources {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 10px;
    margin-top: 9px;
    color: var(--muted);
    font-size: var(--font-xs);
}

.flight-bulletin-item__sources span {
    font-weight: 700;
}

.flight-insights-flight-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.flight-insights-flight-list li + li {
    border-top: 1px solid var(--line-soft);
}

.flight-insights-flight-row {
    min-width: 0;
    min-height: 68px;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 11px 16px;
    color: var(--text);
    cursor: pointer;
    transition: background 140ms ease;
}

.flight-insights-flight-row:hover,
.flight-insights-flight-row:focus-visible {
    background: var(--control-bg-hover);
    outline: 0;
}

.flight-insights-flight-row:focus-visible {
    box-shadow: inset 3px 0 var(--focus-outline);
}

.flight-insights-flight-icon {
    position: relative;
    width: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.flight-insights-flight-avatar {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--avatar-border);
    border-radius: 50%;
    background: var(--avatar-placeholder-bg);
    color: var(--avatar-placeholder-text);
    font-size: var(--font-sm);
    font-weight: 800;
}

.flight-insights-flight-avatar img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.flight-insights-flight-main,
.flight-insights-flight-result {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.flight-insights-flight-pilot,
.flight-insights-flight-meta {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 5px;
}

.flight-insights-flight-pilot strong,
.flight-insights-flight-meta > span:first-child {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.flight-insights-flight-pilot strong {
    font-size: var(--font-lg);
}

.flight-insights-flight-meta {
    color: var(--muted);
    font-size: var(--font-sm);
    white-space: nowrap;
}

.flight-insights-flight-result {
    justify-items: end;
}

.flight-insights-flight-distance {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
    white-space: nowrap;
}

.flight-insights-flight-distance img {
    width: 23px;
    height: 23px;
    padding: 0;
    border: 1px solid #f0d0a0;
    border-radius: 4px;
    background: #fff9df;
    box-sizing: border-box;
    object-fit: contain;
}

.flight-insights-flight-distance strong {
    font-size: var(--font-lg);
    line-height: 1.15;
}

.flight-insights-flight-glider-meta {
    min-width: 0;
    max-width: 190px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.flight-insights-flight-glider-meta > span:last-child {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.flight-insights-highlight-row {
    min-height: 124px;
    grid-template-columns: 36px minmax(0, 1fr) 112px;
    align-items: start;
    gap: 14px;
    padding: 12px 14px;
}

.flight-insights-highlight-row .flight-insights-flight-icon,
.flight-insights-highlight-row .flight-insights-flight-avatar {
    width: 36px;
}

.flight-insights-highlight-row .flight-insights-flight-avatar {
    height: 36px;
}

.flight-insights-highlight-content {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-content: start;
    align-items: start;
    gap: 8px 20px;
}

.flight-insights-highlight-row .flight-insights-flight-main {
    gap: 7px;
}

.flight-insights-highlight-row .flight-insights-flight-pilot strong {
    font-size: var(--font-lg);
}

.flight-insights-highlight-row .flight-insights-flight-result {
    align-content: start;
    gap: 5px;
}

.flight-insights-highlight-distance {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 5px;
    white-space: nowrap;
}

.flight-insights-highlight-distance img {
    width: 23px;
    height: 23px;
    object-fit: contain;
}

.flight-insights-highlight-distance strong {
    font-size: var(--font-lg);
    line-height: 1.15;
}

.flight-insights-highlight-reasons {
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.flight-insights-highlight-reason {
    min-width: 0;
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 6px;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, currentColor 7%, transparent);
    border-radius: var(--radius-sm);
    font-size: var(--font-xs);
    font-weight: 700;
    line-height: 1.35;
    white-space: nowrap;
}

.flight-insights-highlight-reason .ui-icon {
    width: 13px;
    height: 13px;
    flex: 0 0 auto;
}

.flight-insights-highlight-reason > span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.flight-insights-highlight-reason--personal-record,
.flight-insights-highlight-reason--site-record {
    background: #fff5d7;
    color: #875d00;
}

.flight-insights-highlight-reason--flight-streak {
    background: #e9f7ee;
    color: #17683a;
}

.flight-insights-highlight-reason--new-site {
    background: #e7f6f3;
    color: #087061;
}

.flight-insights-highlight-reason--originality {
    background: #f2edfb;
    color: #65439a;
}

.flight-insights-highlight-map {
    width: 112px;
    height: 100px;
    display: block;
    overflow: hidden;
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-sm);
    background: var(--content-subtle-bg);
}

.flight-insights-highlight-map img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.flight-insights-highlight-row:hover .flight-insights-highlight-map,
.flight-insights-highlight-row:focus-visible .flight-insights-highlight-map {
    border-color: var(--control-border-hover);
}

.flight-insights-map-panel {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(280px, 1fr);
}
.flight-insights-map-panel .flight-insights-map {
    border: 1px solid var(--line-soft);
}

.flight-insights-map-content {
    min-height: 0;
}

.flight-insights-map-content .flight-insights-map {
    height: 100%;
}

.flight-insights-notam-content {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 34%);
}

.flight-insights-notam-details {
    min-width: 0;
    overflow: auto;
    border: 1px solid var(--line-soft);
    border-left: 0;
    background: var(--panel);
}

.flight-insights-notam-details__header {
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--line-soft);
}

.flight-insights-notam-details__header h3 {
    margin: 0;
    font-size: var(--font-lg);
}

.flight-insights-notam-navigation {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 700;
    white-space: nowrap;
}

.flight-insights-notam-step {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: var(--radius-sm);
    background: transparent;
    cursor: pointer;
}

.flight-insights-notam-step:hover {
    background: var(--control-bg-hover);
}

.flight-insights-notam-step .ui-icon {
    width: 16px;
    height: 16px;
}

.flight-insights-notam-facts {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 8px 12px;
    margin: 0;
    padding: 14px;
    border-bottom: 1px solid var(--line-soft);
    font-size: var(--font-sm);
}

.flight-insights-notam-facts dt {
    color: var(--muted);
    font-weight: 700;
}

.flight-insights-notam-facts dd {
    min-width: 0;
    margin: 0;
    font-weight: 650;
}

.flight-insights-notam-description {
    margin: 0;
    padding: 14px;
    line-height: 1.48;
    white-space: pre-line;
}

.flight-insights-notam-message {
    min-height: 100%;
    display: grid;
    place-content: center;
    margin: 0;
    padding: 24px;
    color: var(--muted);
    font-weight: 650;
    text-align: center;
}

.flight-insights-toolbar {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px 10px;
}

.flight-insights-date-nav {
    position: relative;
    display: inline-grid;
    grid-template-columns: 30px minmax(88px, auto) 30px;
    align-items: center;
    gap: 1px;
}

.flight-insights-date-step {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--muted);
    cursor: pointer;
}

.flight-insights-date-step:hover {
    background: var(--control-bg-hover);
    color: var(--blue-dark);
}

.flight-insights-date-step:disabled {
    opacity: 0.38;
    cursor: default;
}

.flight-insights-date-step:disabled:hover {
    background: transparent;
    color: var(--muted);
}

.flight-insights-date-step .ui-icon {
    width: 16px;
    height: 16px;
}

.flight-insights-date-link {
    min-width: 0;
    padding: 6px 7px;
    color: var(--text);
    font-size: var(--font-sm);
    font-weight: 750;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
}

.flight-insights-date-link:hover {
    color: var(--link);
    text-decoration: underline;
}

.flight-insights-date-nav .flight-insights-date-input,
.flight-insights-date-nav .date-picker-input {
    display: none;
}

.flight-insights-map {
    position: relative;
    min-width: 0;
    min-height: 280px;
    isolation: isolate;
    background: #e8eef3;
}

.flight-zone-marker-wrap {
    background: transparent;
    border: 0;
}

.flight-zone-marker {
    width: var(--flight-zone-size);
    height: var(--flight-zone-size);
    display: grid;
    place-items: center;
    border: 2px solid rgba(255, 255, 255, 0.92);
    border-radius: 50%;
    background: rgba(253, 119, 37, 0.76);
    box-shadow: 0 2px 9px rgba(125, 55, 12, 0.28);
    color: #fff;
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1;
    cursor: pointer;
    transition: background 140ms ease, box-shadow 140ms ease;
}

.flight-zone-marker:hover,
.leaflet-marker-icon:focus-visible .flight-zone-marker {
    background: rgba(221, 84, 13, 0.9);
    box-shadow: 0 3px 13px rgba(125, 55, 12, 0.38);
}

.leaflet-marker-icon:focus-visible {
    outline: 2px solid var(--focus-outline);
    outline-offset: 2px;
}

.flight-zone-map-status {
    position: absolute;
    z-index: 500;
    top: 12px;
    left: 50%;
    max-width: calc(100% - 32px);
    padding: 7px 10px;
    border: 1px solid rgba(130, 147, 163, 0.48);
    border-radius: var(--radius-sm);
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 3px 12px rgba(24, 40, 54, 0.14);
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 650;
    text-align: center;
    transform: translateX(-50%);
}

.flight-zone-map-status.is-error {
    color: var(--danger, #a52a2a);
}

.flight-zone-flights-modal__body {
    padding: 0;
}

@media (max-width: 760px) {
    .flight-insights-flight-glider-separator,
    .flight-insights-flight-glider-meta {
        display: none;
    }
}

@media (max-width: 620px) {
    .flight-insights-modal .app-modal__panel {
        height: 92dvh;
        max-height: 92dvh;
    }

    .flight-insights-tabs {
        padding-top: 3px;
    }

    .flight-insights-tabs-bar .active-filter-scroll {
        padding-right: 4px;
        padding-left: 4px;
    }

    .flight-insights-tab {
        padding-right: 11px;
        padding-left: 11px;
    }

    .flight-insights-toolbar {
        padding: 5px 8px;
    }

    .app-modal__body.flight-insights-body {
        padding: 0 6px 6px;
    }

    .flight-insights-notam-content {
        overflow: auto;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: minmax(300px, 48dvh) auto;
    }

    .flight-insights-notam-details {
        overflow: visible;
        border-top: 0;
        border-left: 1px solid var(--line-soft);
    }

    .flight-insights-notam-message {
        min-height: 150px;
    }

    .flight-insights-flight-row {
        grid-template-columns: 42px minmax(0, 1fr) auto;
        gap: 8px;
        padding: 9px 10px;
    }

    .flight-insights-flight-icon,
    .flight-insights-flight-avatar {
        width: 42px;
    }

    .flight-insights-flight-avatar {
        height: 42px;
    }
    .flight-insights-highlight-row {
        min-height: 118px;
        grid-template-columns: minmax(0, 1fr) 100px;
        align-items: start;
        gap: 10px;
        padding: 10px;
        grid-template-areas:
            "content map";
    }

    .flight-insights-highlight-row .flight-insights-flight-icon {
        display: none;
    }

    .flight-insights-highlight-content {
        grid-area: content;
        min-width: 0;
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        align-content: start;
        gap: 7px;
    }

    .flight-insights-highlight-row .flight-insights-flight-result {
        justify-items: start;
    }

    .flight-insights-highlight-map {
        grid-area: map;
        width: 100px;
    }
}

.flight-picker-modal [data-flight-picker-content],
.flight-picker-modal [data-flight-picker-content] > form {
    min-height: 0;
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    overflow: hidden;
}

.flight-picker {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
}

.flight-picker__filters {
    flex: 0 0 auto;
    padding: 16px 20px;
    border-bottom: 1px solid var(--line-soft);
    background: var(--panel);
}

.flight-picker__filter-grid {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr) minmax(0, 1fr) auto;
    align-items: end;
    gap: 12px;
}

.flight-picker__filter-grid .field {
    min-width: 0;
}

.flight-picker__submit {
    gap: 7px;
    min-width: 94px;
    white-space: nowrap;
}

.flight-picker__submit .ui-icon {
    width: 16px;
    height: 16px;
    filter: brightness(0) invert(1);
}

.flight-picker__results {
    min-height: 0;
    display: grid;
    flex: 1 1 auto;
    align-content: start;
    gap: 6px;
    margin: 0;
    padding: 14px 20px 20px;
    overflow-y: auto;
}

.flight-picker__result {
    display: grid;
    gap: 3px;
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--panel);
    color: var(--text);
    text-align: left;
    cursor: pointer;
}

.flight-picker__result:hover,
.flight-picker__result:focus-visible {
    border-color: var(--accent);
    background: var(--hover-bg);
}

.flight-picker__result strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.flight-picker__result span,
.flight-picker__empty {
    color: var(--muted);
    font-size: var(--font-sm);
}

.flight-picker__empty {
    margin: 8px 0;
    text-align: center;
}

.flight-picker__error {
    margin: 10px 0 0;
}

@media (max-width: 760px) {
    .flight-picker__filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .flight-picker__submit {
        width: 100%;
    }
}

@media (max-width: 560px) {
    .flight-picker__filters {
        padding: 14px 20px;
    }

    .flight-picker__filter-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .flight-picker__results {
        padding-top: 12px;
    }
}

@media (max-height: 600px) {
    .flight-picker__filters {
        padding-block: 10px;
    }

    .flight-picker__filter-grid {
        gap: 8px 12px;
    }
}

@media (max-width: 340px) {
    .flight-insights-flight-row {
        grid-template-columns: 34px minmax(0, 1fr) auto;
    }

    .flight-insights-flight-icon,
    .flight-insights-flight-avatar {
        width: 34px;
    }

    .flight-insights-flight-avatar {
        height: 34px;
    }
}
.active-filter-bar {
    --filter-scroll-surface: var(--page-heading-bg);
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 4px var(--page-gutter) 8px;
    border-bottom: 0;
    background: var(--page-heading-bg);
}

.flights-page .active-filter-bar {
    padding-right: var(--flight-list-inset);
    padding-left: var(--flight-list-inset);
}

.active-filter-scroll {
    position: relative;
    min-width: 0;
    flex: 1;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
}

.filter-scroll-button {
    border-radius: var(--radius-sm);
    position: relative;
    z-index: 2;
    width: 26px;
    height: var(--control-height-sm);
    border: 0;
    background: var(--filter-scroll-surface, var(--panel));
    color: var(--filter-scroll-color);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.filter-scroll-button::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 12px;
    pointer-events: none;
}

.filter-scroll-button--left::after {
    left: 100%;
    background: linear-gradient(90deg, var(--filter-scroll-surface, var(--panel)), transparent);
}

.filter-scroll-button--right::after {
    right: 100%;
    background: linear-gradient(270deg, var(--filter-scroll-surface, var(--panel)), transparent);
}

.active-filter-scroll.at-start .filter-scroll-button--left::after,
.active-filter-scroll.at-end .filter-scroll-button--right::after {
    display: none;
}

.filter-scroll-button:hover:not(:disabled) {
    color: var(--blue-dark);
}

.filter-scroll-button:disabled {
    color: var(--filter-scroll-disabled);
    cursor: default;
}

.filter-scroll-button[hidden] {
    display: none;
}

.active-filter-strip {
    display: flex;
    align-items: center;
    gap: 8px;
    overflow-x: auto;
    padding: 3px 0;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.active-filter-scroll.has-overflow .active-filter-strip {
    padding-left: 18px;
    padding-right: 18px;
}

.active-filter-strip::-webkit-scrollbar {
    display: none;
}

.filter-empty {
    color: var(--muted);
    font-weight: 650;
    line-height: var(--control-height-sm);
}

.filter-chip,
.filter-open,
.claim-open {
    min-height: var(--control-height-sm);
    border: 1px solid var(--control-border);
    border-radius: var(--radius-sm);
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}

.filter-chip,
.filter-open,
.claim-open {
    max-width: 260px;
    gap: 6px;
    padding: 0 9px 0 12px;
    border-color: var(--filter-chip-border);
    background: var(--filter-chip-bg);
    color: var(--text);
    transition: background 140ms ease, border-color 140ms ease, box-shadow 140ms ease;
}

.filter-chip:hover,
.filter-open:hover,
.claim-open:hover {
    border-color: var(--control-border-hover);
    background: var(--control-bg-hover);
    box-shadow: 0 1px 5px rgba(23, 105, 168, 0.12);
    text-decoration: none;
}

.filter-chip__label {
    flex: 0 0 auto;
    color: var(--filter-chip-label);
    font-size: var(--font-sm);
    font-weight: 650;
}

.filter-chip__value {
    min-width: 0;
    overflow: hidden;
    color: var(--link);
    font-size: var(--font-md);
    font-weight: 700;
    text-overflow: ellipsis;
}

.filter-chip__remove {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--filter-chip-remove-bg);
    mask-image: url("/icons/ui/x.svg");
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: 14px 14px;
    -webkit-mask-image: url("/icons/ui/x.svg");
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 14px 14px;
}

.filter-chip:hover .filter-chip__remove {
    background: var(--blue-dark);
}

.filter-open {
    flex: 0 0 auto;
    cursor: pointer;
}

.filter-open,
.claim-open {
    color: var(--blue-dark);
    font-weight: 750;
}

.flight-list-panel {
    padding: 0;
}

.date-row {
    margin: 0 var(--flight-list-inset);
    border-top: 0;
    border-bottom: 1px solid var(--line);
    background:
        linear-gradient(
            180deg,
            color-mix(in srgb, var(--header-bg) 72%, var(--panel)),
            var(--header-bg)
        );
}

.date-row__content {
    display: grid;
    grid-template-columns: 42px 1fr 42px;
    align-items: center;
    gap: 10px;
    padding: 5px 0;
}

.date-row h2 {
    margin: 0;
    text-align: center;
    font-size: var(--font-lg);
    font-weight: 750;
}

.date-nav {
    width: var(--control-height-sm);
    min-height: var(--control-height-sm);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid color-mix(in srgb, var(--control-border) 54%, transparent);
    border-radius: 99px;
    background: color-mix(in srgb, var(--panel) 68%, transparent);
    color: var(--blue-dark);
    font-weight: 700;
    transition: background 140ms ease, border-color 140ms ease, box-shadow 140ms ease;
}

.date-nav:first-child {
    justify-self: end;
}

.date-nav:last-child {
    justify-self: start;
}

.date-nav:hover {
    border-color: var(--control-border-hover);
    background: var(--control-bg-hover);
    box-shadow: 0 2px 6px rgba(23, 105, 168, 0.12);
    text-decoration: none;
}

.flight-table-wrap {
    overflow-x: auto;
    padding: 10px var(--flight-list-inset) 18px;
}

.flight-table {
    width: 100%;
    min-width: 860px;
    border-collapse: collapse;
}

.flight-table th {
    background: transparent;
    color: var(--table-header-text);
    font-weight: 750;
    text-align: left;
    white-space: nowrap;
}

.sort-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-height: 24px;
    margin: -3px -5px;
    padding: 3px 5px;
    border-radius: var(--radius-sm);
    color: inherit;
}

.sort-link:hover {
    background: color-mix(in srgb, var(--sort-hover-bg) 72%, transparent);
    color: var(--blue-dark);
    text-decoration: none;
}

.sort-link.is-active {
    color: var(--blue-dark);
}

.sort-link__icon {
    width: 14px;
    height: 14px;
    flex: 0 0 auto;
    background: currentColor;
    opacity: 0;
    mask-image: url("/icons/ui/chevron-down.svg");
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: 14px 14px;
    -webkit-mask-image: url("/icons/ui/chevron-down.svg");
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 14px 14px;
}

.sort-link:hover .sort-link__icon {
    opacity: 0.45;
}

.sort-link.is-active .sort-link__icon {
    opacity: 0.85;
}

.sort-link.is-asc .sort-link__icon {
    transform: rotate(180deg);
}

.score-heading-compact {
    display: none;
}

.glider-model-cell {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 100%;
}

.glider-type-icon {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    object-fit: contain;
}

.glider-icon-stack {
    position: relative;
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    display: inline-block;
    line-height: 0;
    vertical-align: middle;
}

.glider-icon-stack--badged {
    width: 22px;
    flex-basis: 22px;
}

.glider-icon-stack .glider-type-icon {
    position: absolute;
    top: 0;
    left: 0;
}

.glider-certificate-group-icon {
    position: absolute;
    z-index: 1;
    top: 1px;
    right: 0;
    width: 6px;
    height: 16px;
    object-fit: contain;
}

.glider-model-name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.flight-table th,
.flight-table td {
    padding: 5px 8px 5px 4px;
    border-bottom: 1px solid var(--line-soft);
    vertical-align: middle;
}

.flight-table tbody tr:hover {
    background: var(--row-hover);
}

.flight-table tbody tr:focus-visible {
    outline: 0;
    box-shadow: inset 3px 0 0 var(--focus-outline);
}

.flight-table tbody tr {
    cursor: pointer;
    transition: background 140ms ease, box-shadow 140ms ease;
}

.flight-table tbody tr.is-selected {
    background: var(--row-selected);
}

.flight-table tbody tr.followed-pilot-row {
    background: var(--followed-pilot-row-bg, #fff8e6);
}

.flight-table tbody tr.followed-pilot-row:hover {
    background: var(--followed-pilot-row-hover-bg, #fff1cc);
}

.flight-table tbody tr.followed-pilot-row.is-selected {
    background: var(--row-selected);
}

.pilots-panel {
    min-height: 620px;
    overflow: hidden;
}

.pilot-profile-shell {
    background: var(--panel);
    container-name: pilot-profile;
    container-type: inline-size;
}

.pilot-hero {
    position: relative;
    display: grid;
    gap: 22px;
    min-height: 315px;
    padding: 22px 32px 26px;
    overflow: visible;
    border-bottom: 1px solid var(--line-soft);
    background: url("/img/hero-pilot-profile-bg.jpg");
    background-position: center top;
    background-size: cover;
    background-repeat: no-repeat;
}

.pilot-hero.has-profile {
    grid-template-columns: minmax(0, 1fr) minmax(220px, 250px);
    align-items: start;
    min-height: 175px;
}

.pilot-hero.is-empty {
    min-height: 430px;
    align-items: center;
}

.pilot-hero::before {
    content: "";
    display: none;
}

.pilot-hero::after {
    content: "";
    display: none;
}

.pilot-hero-art {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.pilot-hero-art::before {
    content: "";
    display: none;
}

.pilot-hero-search,
.pilot-hero-profile,
.pilot-kpi-row,
.pilot-profile-empty--hero {
    position: relative;
    z-index: 1;
}

.pilot-hero-search {
    width: min(100%, 250px);
    z-index: var(--z-local-popover);
}

.pilot-hero.has-profile .pilot-hero-search {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
}

.pilot-hero.has-profile .pilot-search-field > span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.pilot-search-landing {
    position: relative;
    z-index: 1;
    width: min(100%, 560px);
    display: grid;
    gap: var(--panel-gap);
    padding: 34px 0 42px;
}

.pilot-search-landing__copy {
    display: grid;
    gap: 8px;
}

.pilot-search-landing__copy h1 {
    margin: 0;
    color: var(--blue-dark);
    font-size: clamp(34px, 5vw, 56px);
    line-height: 1.02;
    letter-spacing: 0;
}

.pilot-search-landing__copy p {
    max-width: 460px;
    margin: 0;
    color: var(--muted);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.45;
}

.pilot-search-field {
    display: grid;
    gap: 7px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.pilot-search-field .autocomplete {
    width: 100%;
}

.pilot-hero-search--landing {
    width: min(100%, 500px);
    z-index: var(--z-local-popover);
}

.pilot-hero-search--landing .pilot-search-field {
    gap: 8px;
}

.pilot-hero-search--landing .pilot-search-field > span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.pilot-hero-search--landing .autocomplete input[data-autocomplete-input] {
    min-height: 46px;
    background: rgba(255, 255, 255, 0.86);
    font-size: 15px;
    font-weight: 750;
}

.pilot-hero-profile {
    display: flex;
    align-items: center;
    gap: 20px;
    min-width: 0;
    margin-top: 8px;
}

.pilot-hero.has-profile .pilot-hero-profile {
    grid-column: 1;
    grid-row: 1;
    margin-top: 0;
}

.pilot-avatar-large {
    width: 100px;
    height: 100px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 4px solid rgba(255, 255, 255, 0.9);
    border-radius: 50%;
    background: linear-gradient(135deg, var(--blue-dark), var(--accent));
    box-shadow: 0 18px 34px rgba(20, 43, 61, 0.2);
    color: #fff;
    font-size: 30px;
    font-weight: 900;
}

.pilot-avatar-large img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.pilot-hero-copy {
    min-width: 0;
}

.pilot-title-line {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 9px 12px;
}

.pilot-profile-eyebrow {
    flex-basis: 100%;
    margin: 0 0 -2px;
}

.pilot-title-line h1 {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
    color: var(--blue-dark);
    font-size: clamp(30px, 5vw, 56px);
    line-height: 0.98;
    letter-spacing: 0;
}

.pilot-title-actions {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
}

.pilot-title-actions .flight-detail-social-button {
    border-color: var(--social-follow-border, rgba(43, 116, 181, 0.32));
}

.pilot-title-actions .flight-detail-social-button:not(:disabled):hover {
    border-color: var(--social-follow-border-hover, rgba(43, 116, 181, 0.55));
    background: var(--social-follow-bg-hover, #f0f7fd);
}

.pilot-meta-icon,
.pilot-kpi-icon,
.pilot-profile-tab-icon,
.pilot-info-card__icon {
    display: inline-block;
    flex: 0 0 auto;
    background: currentColor;
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: contain;
}

.pilot-hero-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 9px 16px;
    margin-top: 12px;
    color: var(--muted);
    font-size: 14px;
    font-weight: 750;
}

.pilot-hero-meta > span,
.pilot-hero-meta > a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

.pilot-team-link {
    color: inherit;
    text-decoration: none;
}

.pilot-team-link:hover,
.pilot-team-link:focus-visible {
    color: var(--accent);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.pilot-meta-icon {
    width: 15px;
    height: 15px;
}

.pilot-meta-icon--club {
    mask-image: url("/icons/ui/shield-check.svg");
}

.pilot-meta-icon--since {
    mask-image: url("/icons/ui/calendar-days.svg");
}

.pilot-kpi-row {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-top: auto;
}

.pilot-kpi-card {
    min-width: 0;
    min-height: 98px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-content: center;
    gap: 5px 16px;
    padding: 16px;
    border: 1px solid rgba(255, 255, 255, 0.76);
    border-radius: var(--radius-sm);
    background: rgba(255, 255, 255, 0.78);
    box-shadow: 0 15px 34px rgba(31, 57, 71, 0.11);
    backdrop-filter: blur(8px);
}

.pilot-kpi-icon {
    grid-row: 1 / span 2;
    align-self: center;
    width: 30px;
    height: 30px;
    color: var(--accent);
}

.pilot-kpi-icon--flights {
    mask-image: url("/icons/ui/plane.svg");
}

.pilot-kpi-icon--best {
    mask-image: url("/icons/ui/trophy.svg");
}

.pilot-kpi-icon--time {
    mask-image: url("/icons/ui/clock.svg");
}

.pilot-kpi-icon--distance {
    mask-image: url("/icons/ui/ruler-dimension-line.svg");
}

.pilot-kpi-card span:not(.pilot-kpi-icon) {
    min-width: 0;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.pilot-kpi-card strong {
    min-width: 0;
    overflow-wrap: anywhere;
    color: var(--blue-dark);
    font-size: 24px;
    line-height: 1.05;
}

.pilot-kpi-value-with-icon {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.pilot-kpi-value-with-icon .score-icon {
    width: 23px;
    height: 23px;
    flex: 0 0 23px;
    border: 1px solid #f0d0a0;
    border-radius:4px;
 }

.pilot-owner-section {
    display: grid;
    gap: 12px;
    margin: 14px var(--page-gutter) 6px;
    padding: 14px 16px 16px;
    border: 1px solid #d7e4ef;
    border-radius: 14px;
    background: linear-gradient(135deg, #f7fafe 0%, #f2f7fc 100%);
    box-shadow: 0 5px 18px rgba(30, 71, 105, 0.055);
}

.pilot-owner-header {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.pilot-owner-header h2 {
    margin: 0;
    color: var(--blue-dark);
    font-size: 1.25rem;
    line-height: 1.2;
}

.pilot-owner-header > span {
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 600;
    line-height: 1.35;
}

.pilot-owner-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: hidden;
    border: 1px solid #dbe6ef;
    border-radius: 11px;
    background: rgba(255, 255, 255, 0.88);
}

.pilot-owner-action {
    min-width: 0;
    min-height: 66px;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) 18px;
    align-items: center;
    gap: 10px;
    padding: 10px 13px;
    border: 0;
    border-bottom: 1px solid #e2eaf1;
    background: transparent;
}

.pilot-owner-action:nth-child(odd) {
    border-right: 1px solid #e2eaf1;
}

.pilot-owner-action:nth-last-child(-n + 2) {
    border-bottom: 0;
}

.pilot-owner-action:last-child:nth-child(odd) {
    grid-column: 1 / -1;
    border-right: 0;
}

.pilot-owner-actions:has(> .pilot-owner-action:last-child:nth-child(odd))
    > .pilot-owner-action:nth-last-child(2) {
    border-bottom: 1px solid #e2eaf1;
}

.pilot-owner-action::after {
    content: "";
    width: 16px;
    height: 16px;
    color: #7b8fa2;
    background: currentColor;
    mask: url("/icons/ui/chevron-right.svg") center / contain no-repeat;
    -webkit-mask: url("/icons/ui/chevron-right.svg") center / contain no-repeat;
}

.pilot-owner-action--button {
    width: 100%;
    color: inherit;
    cursor: pointer;
    text-align: left;
    transition: background 160ms ease, color 160ms ease;
}

.pilot-owner-action--button:hover,
.pilot-owner-action--button:focus-visible {
    background: #edf5fd;
}

.pilot-owner-action--button:focus-visible {
    outline: 2px solid var(--focus-outline);
    outline-offset: 2px;
}

.pilot-personal-data-avatar-field {
    display: grid;
    gap: 8px;
}

.pilot-personal-data-avatar-control {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.pilot-personal-data-avatar-preview {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--avatar-border);
    border-radius: 50%;
    background: var(--avatar-placeholder-bg);
    color: var(--avatar-placeholder-text);
    font-weight: 800;
}

.pilot-personal-data-avatar-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pilot-personal-data-avatar-control .file-upload {
    min-width: 0;
}

.pilot-personal-data-ogn {
    margin-top: 2px;
    border-top: 1px solid var(--border);
}

.pilot-personal-data-ogn summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 16px;
    align-items: center;
    gap: 10px;
    min-height: 42px;
    padding: 4px 2px;
    list-style: none;
    cursor: pointer;
}

.pilot-personal-data-ogn summary::-webkit-details-marker {
    display: none;
}

.pilot-personal-data-ogn summary::after {
    content: "";
    width: 16px;
    height: 16px;
    color: #7b8fa2;
    background: currentColor;
    mask: url("/icons/ui/chevron-down.svg") center / contain no-repeat;
    -webkit-mask: url("/icons/ui/chevron-down.svg") center / contain no-repeat;
    transition: transform 160ms ease;
}

.pilot-personal-data-ogn[open] summary::after {
    transform: rotate(180deg);
}

.pilot-personal-data-ogn summary:focus-visible {
    border-radius: var(--radius-sm);
    outline: 2px solid var(--focus-outline);
    outline-offset: 2px;
}

.pilot-personal-data-ogn__title {
    color: var(--text);
    font-size: 0.95rem;
    font-weight: 700;
    line-height: 1.25;
}

.pilot-personal-data-ogn__status {
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 600;
    line-height: 1.25;
    white-space: nowrap;
}

.pilot-personal-data-ogn__body {
    max-width: 360px;
    padding: 8px 2px 2px;
}

.pilot-owner-action__icon {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: var(--blue-dark);
    background: #eaf3ff;
}

.pilot-owner-action__icon::before {
    content: "";
    width: 19px;
    height: 19px;
    display: block;
    background: currentColor;
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: contain;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.pilot-owner-action__icon--profile::before {
    mask-image: url("/icons/ui/user-check.svg");
    -webkit-mask-image: url("/icons/ui/user-check.svg");
}

.pilot-owner-action__icon--ogn::before {
    mask-image: url("/icons/ui/map-pin.svg");
    -webkit-mask-image: url("/icons/ui/map-pin.svg");
}

.pilot-owner-action__icon--messages::before {
    mask-image: url("/icons/ui/message-circle.svg");
    -webkit-mask-image: url("/icons/ui/message-circle.svg");
}

.pilot-owner-action__icon--following::before {
    mask-image: url("/icons/ui/user-plus.svg");
    -webkit-mask-image: url("/icons/ui/user-plus.svg");
}

.pilot-owner-action__icon--favorite-sites::before {
    mask-image: url("/icons/ui/heart.svg");
    -webkit-mask-image: url("/icons/ui/heart.svg");
}

.pilot-owner-action__icon--shared-files::before {
    mask-image: url("/icons/ui/file-check.svg");
    -webkit-mask-image: url("/icons/ui/file-check.svg");
}

.pilot-owner-action h3 {
    margin: 0;
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    color: var(--text);
    font-size: 0.95rem;
    line-height: 1.2;
}

.pilot-owner-action__count {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border: 1px solid var(--badge-border);
    border-radius: 999px;
    background: var(--badge-bg);
    color: var(--badge-text);
    font-size: 0.72rem;
    font-weight: 800;
    line-height: 1;
}

.pilot-owner-action p {
    margin: 2px 0 0;
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 650;
    line-height: 1.35;
}

.pilot-owner-messages p {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
}

.pilot-owner-message-unread-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 20px;
    padding: 2px 8px;
    border: 1px solid #d8e2ea;
    border-radius: 999px;
    background: #f4f8fb;
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 850;
    line-height: 1.1;
}

.pilot-owner-message-unread-pill.is-unread {
    border-color: transparent;
    background: #d92d20;
    color: #fff;
}

.pilot-owner-message-unread-pill:not(.is-unread) {
    display: none;
}

.pilot-owner-message-list {
    display: grid;
    gap: 8px;
}

.pilot-owner-message {
    min-width: 0;
    display: grid;
    gap: 6px;
    padding: 9px 10px;
    border: 1px solid #e5edf3;
    border-radius: var(--radius-sm);
    background: #f8fbfd;
}

.pilot-owner-message.is-unread {
    border-color: #bfd8e8;
    background: #f1f7fa;
}

.pilot-owner-message__meta {
    min-width: 0;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 650;
    line-height: 1.25;
}

.pilot-owner-message__meta > span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pilot-owner-message__meta time {
    flex: 0 0 auto;
    color: color-mix(in srgb, var(--muted) 78%, white);
    white-space: nowrap;
}

.pilot-owner-message__pilot {
    color: var(--text);
    font-weight: 800;
}

a.pilot-owner-message__pilot:hover {
    color: var(--link-hover);
}

.pilot-owner-message__badge {
    justify-self: start;
    padding: 2px 7px;
    border-radius: 999px;
    background: #d8ebf5;
    color: var(--blue-dark);
    font-size: 0.72rem;
    font-weight: 850;
    line-height: 1.2;
    text-transform: uppercase;
}

.pilot-owner-message p,
.pilot-owner-message-empty {
    margin: 0;
    font-size: var(--font-sm);
    line-height: 1.4;
}

.pilot-owner-message p {
    color: var(--text);
    white-space: pre-wrap;
}

.pilot-owner-message__body-details {
    color: var(--text);
    font-size: var(--font-sm);
    line-height: 1.4;
}

.pilot-owner-message__body-details summary {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 18px;
    align-items: start;
    gap: 10px;
    margin: -3px -4px;
    padding: 3px 4px;
    border-radius: var(--radius-sm);
    cursor: pointer;
    list-style: none;
    white-space: pre-wrap;
    transition: background 140ms ease;
}

.pilot-owner-message__body-details summary::-webkit-details-marker {
    display: none;
}

.pilot-owner-message__body-details summary::marker {
    content: "";
}

.pilot-owner-message__body-details summary:hover {
    background: rgba(23, 105, 168, 0.055);
}

.pilot-owner-message__body-details summary:focus-visible {
    outline: 2px solid var(--focus-outline);
    outline-offset: 2px;
}

.pilot-owner-message__body-preview,
.pilot-owner-message__body-full {
    min-width: 0;
}

.pilot-owner-message__more-icon {
    width: 18px;
    height: 18px;
    margin-top: 1px;
    background: currentColor;
    color: var(--muted);
    mask: url("/icons/ui/chevron-down.svg") center / 16px 16px no-repeat;
    -webkit-mask: url("/icons/ui/chevron-down.svg") center / 16px 16px no-repeat;
    transition: color 140ms ease, transform 160ms ease;
}

.pilot-owner-message__body-details summary:hover .pilot-owner-message__more-icon {
    color: var(--blue-dark);
}

.pilot-owner-message__body-full {
    display: none;
}

.pilot-owner-message__body-details[open] .pilot-owner-message__body-preview {
    display: none;
}

.pilot-owner-message__body-details[open] .pilot-owner-message__body-full {
    display: inline;
}

.pilot-owner-message__body-details[open] .pilot-owner-message__more-icon {
    transform: rotate(180deg);
}

.pilot-owner-message__body-details[open] summary {
    color: var(--text);
}

.pilot-owner-message__actions {
    display: flex;
    justify-content: flex-end;
}

.pilot-owner-message-more {
    display: flex;
    justify-content: center;
    padding: 4px 0 2px;
}

.pilot-owner-message-empty {
    color: var(--muted);
    font-weight: 650;
}

.pilot-private-message-status p {
    margin: 0 0 8px 0;
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 650;
    line-height: 1.4;
}

.pilot-following-content {
    display: grid;
    gap: 16px;
}

.pilot-following-search {
    position: relative;
    z-index: 1;
}

.pilot-following-list {
    overflow: hidden;
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-sm);
    background: var(--panel);
}

.pilot-following-row {
    min-width: 0;
    min-height: 56px;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) 34px;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    transition: background 140ms ease;
}

.pilot-following-row + .pilot-following-row {
    border-top: 1px solid var(--line-soft);
}

.pilot-following-row:hover {
    background: var(--row-hover);
}

.pilot-following-avatar {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--avatar-border);
    border-radius: 50%;
    background: var(--avatar-placeholder-bg);
    color: var(--avatar-placeholder-text);
    font-size: 0.72rem;
    font-weight: 850;
    text-decoration: none;
}

.pilot-following-avatar img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}
.pilot-favorite-site-icon {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border: 1px solid var(--avatar-border);
    border-radius: 50%;
    background: var(--avatar-placeholder-bg);
    color: var(--blue-dark);
}

.pilot-favorite-site-icon .ui-icon {
    width: 19px;
    height: 19px;
}


.pilot-following-name {
    min-width: 0;
    overflow: hidden;
    color: var(--text);
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pilot-following-name:hover {
    color: var(--link-hover);
}
.pilot-favorite-site-name {
    display: grid;
    gap: 2px;
}

.pilot-favorite-site-name small {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 750;
    letter-spacing: 0.06em;
    line-height: 1;
}


.pilot-following-remove {
    width: 34px;
    height: 34px;
    color: var(--muted);
}

.pilot-following-remove:hover {
    border-color: rgba(185, 28, 28, 0.32);
    background: #fff5f5;
    color: #a52a2a;
}

.pilot-following-remove .ui-icon {
    width: 15px;
    height: 15px;
}

.pilot-following-empty {
    margin: 0;
    padding: 22px 14px;
    border: 1px dashed var(--line-soft);
    border-radius: var(--radius-sm);
    color: var(--muted);
    font-weight: 650;
    text-align: center;
}

.pilot-messages-tabs {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 12px;
}

.pilot-messages-modal {
    --app-modal-vertical-gap: 72px;
}

.pilot-messages-modal .app-modal__panel {
    height: calc(100dvh - var(--app-modal-vertical-gap));
    max-height: calc(100dvh - var(--app-modal-vertical-gap));
}

.pilot-messages-modal .app-modal__body {
    min-height: 0;
    overflow: hidden;
}

.pilot-messages-tab-input {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.pilot-messages-tab-list {
    display: flex;
    min-width: 0;
    overflow-x: auto;
    border-bottom: 1px solid var(--line-soft);
}

.pilot-messages-tab-list .pilot-profile-tab {
    flex: 0 0 auto;
    cursor: pointer;
}

#pilot-messages-received:checked ~ .pilot-messages-tab-list label[for="pilot-messages-received"],
#pilot-messages-sent:checked ~ .pilot-messages-tab-list label[for="pilot-messages-sent"] {
    color: var(--orange);
    border-bottom-color: var(--orange);
}

.pilot-messages-tab-panel {
    display: none;
    min-height: 0;
    overflow-y: auto;
    padding-right: 4px;
}

@media (max-width: 560px) {
    .pilot-messages-modal {
        --app-modal-edge-gap: 0px;
        --app-modal-vertical-gap: 0px;
    }

    .pilot-messages-modal .app-modal__panel {
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;
        border-radius: 0;
    }
}

#pilot-messages-received:checked ~ .pilot-messages-tab-panel--received,
#pilot-messages-sent:checked ~ .pilot-messages-tab-panel--sent {
    display: block;
}

.pilot-tabs-bar {
    --filter-scroll-surface: var(--panel);
    padding-top: 0;
    padding-bottom: 0;
    border-top: 0;
    border-bottom: 0;
    background: var(--panel);
}

.pilot-tabs-bar .active-filter-scroll {
    padding: var(--space-sm) var(--page-gutter);
}

.pilot-profile-tabs {
    gap: 4px;
}

.pilot-profile-tab {
    border: 0;
    border-bottom: 3px solid var(--line-soft);
    border-radius: 0;
    position: relative;
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 0 16px;
    background: transparent;
    color: var(--muted);
    font-weight: 700;
    white-space: nowrap;
}

.pilot-profile-tab::after {
    content: "";
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 0;
    height: 3px;
    border-radius: 999px 999px 0 0;
    background: transparent;
}

.pilot-profile-tab:hover {
    color: var(--blue-dark);
    cursor: pointer;
}

.pilot-profile-tab[aria-busy="true"] {
    cursor: progress;
    opacity: 0.7;
}

.pilot-profile-tab.is-active {
    border-bottom: 3px solid var(--accent);
    color: var(--accent);
}

.pilot-profile-tab.is-active::after {
    background: transparent;
}

.pilot-profile-tab-icon {
    width: 17px;
    height: 17px;
}

.pilot-profile-tab-icon--general {
    mask-image: url("/icons/ui/bar-chart-3.svg");
}

.pilot-profile-tab-icon--achievements {
    mask-image: url("/icons/ui/shield-check.svg");
}

.pilot-profile-tab-icon--stats {
    mask-image: url("/icons/ui/bar-chart-3.svg");
}

.pilot-profile-tab-icon--flight-book {
    mask-image: url("/icons/ui/book-open.svg");
}

.pilot-profile-tab-icon--latest {
    mask-image: url("/icons/ui/clock.svg");
}

.pilot-profile-tab-icon--best {
    mask-image: url("/icons/ui/trophy.svg");
}

.pilot-profile-tab-icon--sites {
    mask-image: url("/icons/ui/map-pin.svg");
}

.pilot-profile-tab-icon--hike-fly {
    mask-image: url("/icons/ui/mountain.svg");
}

.pilot-profile-tab-icon--info {
    mask-image: url("/icons/ui/info.svg");
}

.pilot-profile-tab-icon--nearest {
    mask-image: url("/icons/ui/map-pin.svg");
}

.pilot-profile-content {
    padding: 22px 24px 28px 24px;
}

.pilot-profile-panel:not(.is-active) {
    display: none;
}

.pilot-profile-achievements {
    display: grid;
    gap: 16px;
}

.pilot-achievement-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px 28px;
    padding: 9px 12px;
}

.pilot-achievement-summary__item {
    min-width: 0;
    min-height: 34px;
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
}

.pilot-achievement-summary__icon {
    width: 19px;
    height: 19px;
    display: inline-block;
    background: var(--accent);
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: contain;
}

.pilot-achievement-summary__content {
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 2px 5px;
}

.pilot-achievement-summary__label {
    min-width: 0;
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 650;
    line-height: 1.25;
}

.pilot-achievement-summary strong {
    min-width: 0;
    color: var(--blue-dark);
    font-size: 0.98rem;
    font-weight: 850;
    line-height: 1.2;
    white-space: nowrap;
}

.pilot-achievement-summary__value-with-icon {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.pilot-achievement-summary__value-with-icon .score-icon {
    width: 17px;
    height: 17px;
    flex: 0 0 17px;
    border: 1px solid #f0d0a0;
    border-radius: 4px;
}

.pilot-profile-achievements-grid {
    margin-bottom: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 14px;
}

.pilot-profile-achievement-card {
    min-width: 0;
    min-height: 96px;
    display: grid;
    grid-template-columns: 68px minmax(0, 1fr);
    align-items: center;
    column-gap: 14px;
    padding: 13px 14px;
    border: 1px solid color-mix(in srgb, var(--line-soft) 68%, transparent);
    border-radius: var(--radius-sm);
    background: linear-gradient(145deg, var(--panel), var(--content-subtle-bg));
    color: var(--text);
    cursor: pointer;
    text-align: left;
    box-shadow: 0 8px 20px rgba(15, 55, 95, 0.045);
    transition: background 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.pilot-profile-achievement-card:hover:not(:disabled),
.pilot-profile-achievement-card:focus-visible:not(:disabled) {
    border-color: var(--blue);
    background: linear-gradient(145deg, var(--panel), color-mix(in srgb, var(--blue) 8%, var(--panel)));
    box-shadow: 0 16px 34px rgba(10, 93, 168, 0.14);
    transform: translateY(-1px);
}

.pilot-profile-achievement-card.is-achieved {
    border-color: color-mix(in srgb, var(--accent) 24%, var(--line-soft));
    background: linear-gradient(145deg, var(--panel), color-mix(in srgb, var(--accent) 4%, var(--panel)));
}

.pilot-profile-achievement-card.is-achieved:hover:not(:disabled),
.pilot-profile-achievement-card.is-achieved:focus-visible:not(:disabled) {
    border-color: var(--accent);
    background: linear-gradient(145deg, var(--panel), color-mix(in srgb, var(--accent) 7%, var(--panel)));
    box-shadow: 0 16px 34px color-mix(in srgb, var(--accent) 16%, transparent);
}

.pilot-profile-achievement-card.is-selected {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 16%, transparent),
                0 16px 34px color-mix(in srgb, var(--accent) 18%, transparent);
}

.pilot-profile-achievement-card.is-missing {
    border-color: color-mix(in srgb, var(--line-soft) 54%, transparent);
    cursor: default;
    background: color-mix(in srgb, var(--panel) 76%, var(--content-subtle-bg));
    color: var(--muted);
    box-shadow: none;
}

.pilot-profile-achievement-card__icon {
    width: 64px;
    height: 64px;
    object-fit: contain;
    justify-self: center;
}

.pilot-profile-achievement-card.is-missing .pilot-profile-achievement-card__icon {
    filter: grayscale(1) saturate(0.15);
    opacity: 0.3;
}

.pilot-profile-achievement-card__content {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 10px;
}

.pilot-profile-achievement-card__title {
    min-width: 0;
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 850;
    line-height: 1.2;
    text-transform: uppercase;
}

.pilot-profile-achievement-card.is-achieved .pilot-profile-achievement-card__title {
    color: color-mix(in srgb, var(--accent) 82%, var(--blue-dark));
}

.pilot-profile-achievement-card strong {
    color: var(--blue-dark);
    font-size: 1.42rem;
    line-height: 1;
    white-space: nowrap;
}

.pilot-profile-achievement-card.is-missing strong {
    color: var(--muted);
}

@media (max-width: 760px) {
    .pilot-achievement-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px 20px;
        padding: 8px 10px;
    }

    .pilot-achievement-summary__item {
        min-height: 40px;
    }

    .pilot-profile-achievements-grid {
        grid-template-columns: repeat(auto-fit, minmax(176px, 1fr));
        gap: 10px;
    }

    .pilot-profile-achievement-card {
        min-height: 58px;
        grid-template-columns: 50px minmax(0, 1fr);
        column-gap: 10px;
        padding: 10px;
    }

    .pilot-profile-achievement-card__icon {
        width: 38px;
        height: 38px;
    }

    .pilot-profile-achievement-card__content {
        column-gap: 8px;
    }

    .pilot-profile-achievement-card__title {
        font-size: 0.69rem;
    }

    .pilot-profile-achievement-card strong {
        font-size: 1.18rem;
    }
}

.pilot-profile-achievement-detail {
    min-width: 0;
    scroll-margin-top: 16px;
}

.pilot-achievement-profile-detail {
    display: grid;
    gap: 12px;
}

.pilot-achievement-profile-detail__header h2 {
    margin: 0;
    margin-bottom: 12px;
    color: var(--blue-dark);
    font-size: var(--font-lg);
    line-height: 1.2;
}

.pilot-flight-table-wrap {
    overflow-x: visible;
}

.pilot-flight-table {
    --pilot-flight-score-value-width: 58px;
    --pilot-flight-score-gap: 8px;
    --pilot-flight-score-width: 158px;
    --pilot-flight-grid: minmax(82px, 0.55fr) minmax(130px, 0.85fr) minmax(168px, 196px) minmax(140px, 1.35fr) 34px;
    width: 100%;
    display: block;
    border-collapse: separate;
}

.pilot-flight-table--mobile-model {
    --pilot-flight-grid: minmax(82px, 0.55fr) minmax(130px, 0.85fr) minmax(168px, 196px) minmax(140px, 1.35fr) 40px;
}

.pilot-flight-table--mobile-model .track-cell .row-actions {
    width: 40px;
    justify-content: flex-start;
}

.pilot-flight-table--duration {
    --pilot-flight-grid: minmax(82px, 0.55fr) minmax(130px, 0.85fr) minmax(168px, 196px) minmax(70px, 84px) minmax(140px, 1.35fr) 40px;
}

.pilot-hike-fly-table {
    --pilot-flight-grid: minmax(82px, 0.55fr) minmax(130px, 1fr) minmax(168px, 196px) 34px;
}

.pilot-flight-table thead,
.pilot-flight-table tbody {
    display: block;
}

.pilot-flight-table tr {
    display: grid;
    grid-template-columns: var(--pilot-flight-grid);
    column-gap: 10px;
    align-items: center;
    border-bottom: 1px solid var(--line-soft);
}

.pilot-flight-table th {
    padding: 0 0 9px;
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 700;
    text-align: left;
    text-transform: uppercase;
    letter-spacing: 0;
}

.pilot-flight-table td {
    min-width: 0;
    padding: 9px 0;
}

.pilot-flight-table tbody tr {
    cursor: pointer;
    transition: background 140ms ease, box-shadow 140ms ease;
}

.pilot-flight-table tbody tr:hover {
    background: var(--row-hover);
}

.pilot-flight-table tbody tr:focus-visible {
    outline: 0;
    box-shadow: inset 3px 0 0 var(--focus-outline);
}

.pilot-flight-table tbody tr.is-selected {
    background: var(--row-selected);
}

.pilot-flight-table tbody tr.is-selected > td:first-child {
    box-shadow: inset 3px 0 0 var(--row-selected-accent);
}

.pilot-flight-date-col {
    min-width: 0;
}

.pilot-flight-date {
    color: var(--text);
    font-weight: 500;
    white-space: nowrap;
}

.pilot-flight-table .score-col {
    width: auto;
    min-width: 0;
    text-align: left;
}

.pilot-flight-table .model-col,
.pilot-flight-table .duration-col,
.pilot-flight-table .meta-col {
    width: auto;
    min-width: 0;
}

.pilot-flight-table .duration-col {
    color: var(--text);
    font-weight: 500;
    white-space: nowrap;
}

.pilot-flight-duration-value {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.pilot-flight-duration-value-icon {
    flex: 0 0 auto;
    width: 13px;
    height: 13px;
    color: var(--text-secondary);
    background: currentColor;
    mask: url("/icons/ui/clock.svg") center / contain no-repeat;
    -webkit-mask: url("/icons/ui/clock.svg") center / contain no-repeat;
}

.pilot-flight-duration-heading-compact {
    display: none;
    width: 16px;
    height: 16px;
    margin: 0 auto;
    background: currentColor;
    mask: url("/icons/ui/clock.svg") center / contain no-repeat;
    -webkit-mask: url("/icons/ui/clock.svg") center / contain no-repeat;
}

.pilot-flight-score-heading {
    display: block;
    width: var(--pilot-flight-score-width);
    max-width: 100%;
    padding-right: calc(var(--pilot-flight-score-value-width) + var(--pilot-flight-score-gap));
    text-align: right;
}

.pilot-flight-score-heading-compact {
    display: none;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
    width: 100%;
    text-transform: none;
}

.pilot-flight-score-heading-icon {
    width: 16px;
    height: 16px;
    display: inline-block;
    flex: 0 0 16px;
    background: currentColor;
    mask: url("/icons/ui/ruler-dimension-line.svg") center / contain no-repeat;
    -webkit-mask: url("/icons/ui/ruler-dimension-line.svg") center / contain no-repeat;
}

.pilot-flight-score {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--pilot-flight-score-value-width);
    align-items: center;
    column-gap: var(--pilot-flight-score-gap);
    width: var(--pilot-flight-score-width);
    max-width: 100%;
    justify-self: start;
    color: var(--text);
    font-weight: 500;
    white-space: nowrap;
}

.pilot-flight-score__main {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
}

.pilot-flight-score__distance,
.pilot-flight-score__value {
    min-width: 0;
    font-weight: 500;
}

.pilot-flight-score__value {
    text-align: left;
}

.pilot-flight-score__icon.score-icon {
    flex: 0 0 24px;
    width: 23px;
    height: 23px;
    border: 1px solid #f0d0a0;
    border-radius:4px;
}

.pilot-profile-shell .pilot-flight-score__main {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 24px;
    align-items: center;
    column-gap: 7px;
}

.pilot-profile-shell .pilot-flight-score__distance {
    grid-column: 1;
    grid-row: 1;
    text-align: right;
}

.pilot-profile-shell .pilot-flight-score__icon.score-icon {
    grid-column: 2;
    grid-row: 1;
    align-self: center;
    justify-self: center;
    margin: 0;
}

.pilot-flight-table .site-cell,
.pilot-flight-table .site-pilot-cell,
.pilot-flight-table .glider-model-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sites-layout {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(360px, 0.95fr) minmax(0, 1fr);
    align-items: start;
    gap: var(--panel-gap);
    padding: 0;
}

.sites-map-column {
    position: sticky;
    z-index: 0;
    top: 18px;
    height: calc(100vh - 72px);
    min-height: 0;
}

.sites-map-shell {
    position: relative;
    height: 100%;
    overflow: hidden;
    border: 1px solid var(--panel-border);
    border-radius: var(--radius-md);
    background: var(--panel);
}

.sites-map {
    width: 100%;
    height: 100%;
    min-height: 360px;
}

.sites-panel {
    position: relative;
    z-index: 1;
    min-width: 0;
    overflow: hidden;
    container-name: sites-profile;
    container-type: inline-size;
}

.sites-panel:has(.sites-panel-search .autocomplete.is-open) {
    overflow: visible;
}

.sites-panel-toolbar {
    position: relative;
    z-index: var(--z-local-popover);
    min-width: 0;
    min-height: 50px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    padding: 7px 12px;
    border-bottom: 1px solid var(--line-soft);
    background: var(--content-subtle-bg);
}

.sites-panel-search {
    min-width: 38px;
    flex: 0 0 38px;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    transition: flex-basis 160ms ease;
}

.sites-panel-search.is-expanded {
    min-width: 0;
    flex: 1 1 auto;
}

.sites-panel-search__toggle,
.sites-panel-maximize {
    width: 38px;
    height: 36px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    padding: 0;
    border: 1px solid var(--control-border);
    border-radius: var(--radius-sm);
    background: var(--control-bg);
    color: var(--blue-dark);
    cursor: pointer;
}

.sites-panel-search__toggle:hover,
.sites-panel-search__toggle:focus-visible,
.sites-panel-maximize:hover,
.sites-panel-maximize:focus-visible {
    border-color: var(--control-border-hover);
    background: var(--control-bg-hover);
}

.sites-panel-search__toggle:focus-visible,
.sites-panel-maximize:focus-visible {
    outline: 2px solid var(--focus-outline);
    outline-offset: 2px;
}

.sites-panel-search__toggle-icon {
    width: 17px;
    height: 17px;
    background: currentColor;
    -webkit-mask: url("/icons/ui/search.svg") center / contain no-repeat;
    mask: url("/icons/ui/search.svg") center / contain no-repeat;
}

.sites-panel-search.is-expanded .sites-panel-search__toggle-icon {
    -webkit-mask-image: url("/icons/ui/x.svg");
    mask-image: url("/icons/ui/x.svg");
}

.sites-panel.is-empty .sites-panel-search__toggle {
    display: none;
}

.sites-panel.is-empty .sites-panel-search {
    grid-template-columns: minmax(0, 1fr);
}

.sites-panel-search__field {
    min-width: 0;
    display: none;
}

.sites-panel-search.is-expanded .sites-panel-search__field {
    display: block;
}

.sites-panel-search__field > span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.sites-panel-search__field .autocomplete {
    width: 100%;
}

.sites-panel-search__field .autocomplete > input[data-autocomplete-input] {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    min-height: 36px;
}

.sites-panel-maximize img {
    width: 17px;
    height: 17px;
}

.sites-panel.is-empty .sites-panel-maximize {
    display: none;
}

.sites-panel-content {
    min-width: 0;
    min-height: 0;
}

.sites-panel.is-empty .sites-panel-content,
.sites-panel.is-empty .sites-empty {
    height: 100%;
}

.sites-layout.is-panel-maximized {
    grid-template-columns: minmax(0, 1fr);
}

.sites-layout.is-panel-maximized .sites-map-column {
    display: none;
}

.sites-profile-header {
    padding: var(--space) var(--page-gutter) var(--space-sm);
    border-bottom: 1px solid var(--line-soft);
    background: var(--page-heading-bg);
}

.pilot-profile-eyebrow,
.sites-profile-header p {
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 850;
    line-height: 1.2;
    letter-spacing: 0;
    text-transform: uppercase;
}

.sites-profile-header p {
    margin: 0 0 8px;
}

.sites-profile-header h1 {
    margin: 0;
    font-size: clamp(1.65rem, 2.2vw, 2rem);
    line-height: 1.12;
}

.sites-profile-title-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px 12px;
}

.sites-profile-title-line h1 {
    min-width: 0;
    overflow-wrap: anywhere;
}

.sites-profile-title-line .flight-detail-social-button {
    align-self: center;
    justify-self: end;
}

.sites-profile-content {
    min-width: 0;
}

.sites-info-overview {
    display: grid;
    gap: var(--space);
}

.profile-facts-panel,
.sites-facts-panel {
    min-width: 0;
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-sm);
    background: var(--content-subtle-bg);
}

.profile-facts-list,
.sites-facts-list {
    display: grid;
    margin: 0;
}

.profile-facts-list--grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--profile-facts-min-width, 190px)), 1fr));
}

.sites-info-overview .profile-facts-list--grid {
    --profile-facts-min-width: 280px;
}

.profile-facts-panel--plain,
.sites-facts-panel--summary,
.team-facts-panel {
    border: 0;
    border-radius: 0;
    background: transparent;
}

.profile-fact,
.sites-fact {
    min-width: 0;
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr) minmax(92px, auto);
    align-items: center;
    gap: 0;
    padding: 10px 14px;
    border-bottom: 1px solid var(--line-soft);
}

.profile-fact:last-child,
.sites-fact:last-child {
    border-bottom: 0;
}

.profile-fact-icon,
.sites-fact-icon,
.sites-section-icon {
    width: 18px;
    height: 18px;
    display: inline-block;
    background: var(--accent);
    -webkit-mask: var(--site-icon) center / contain no-repeat;
    mask: var(--site-icon) center / contain no-repeat;
}

.sites-fact-icon--country {
    --site-icon: url("/icons/ui/map-pin.svg");
}

.sites-fact-icon--elevation {
    --site-icon: url("/icons/ui/mountain.svg");
}

.sites-fact-icon--wind {
    --site-icon: url("/icons/ui/wind.svg");
}

.sites-fact-icon--location {
    --site-icon: url("/icons/ui/map-pin.svg");
}

.sites-fact-icon--flights {
    --site-icon: url("/icons/ui/plane.svg");
}

.sites-fact-icon--pilots,
.sites-section-icon--pilots {
    --site-icon: url("/icons/ui/user-check.svg");
}

.sites-fact-icon--timezone,
.sites-fact-icon--offset {
    --site-icon: url("/icons/ui/clock.svg");
}

.profile-fact dt,
.sites-fact dt {
    min-width: 0;
    margin: 0;
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 650;
}

.profile-fact dd,
.sites-fact dd {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
    color: var(--text);
    font-size: var(--font-sm);
    font-weight: 700;
    text-align: right;
}

.sites-wind-value {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
    overflow-wrap: normal;
    white-space: nowrap;
}

.sites-wind-compass {
    position: relative;
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    border-radius: 50%;
    background: conic-gradient(
            from var(--wind-start),
            var(--accent) 0 var(--wind-span),
            #dce6ef var(--wind-span) 360deg);
    box-shadow: inset 0 0 0 1px rgba(33, 70, 99, 0.08);
}

.sites-wind-compass::before {
    content: "";
    position: absolute;
    inset: 4px;
    border-radius: 50%;
    background: var(--content-bg, #fff);
}

.sites-wind-compass::after {
    content: "";
    position: absolute;
    top: -2px;
    left: 11px;
    width: 6px;
    height: 16px;
    background: var(--blue-dark);
    clip-path: polygon(34% 0, 66% 0, 66% 72%, 100% 72%, 50% 100%, 0 72%, 34% 72%);
    transform: rotate(var(--wind-direction));
    transform-origin: 50% 16px;
}

.sites-location-link {
    color: inherit;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.sites-location-link:hover,
.sites-location-link:focus-visible {
    color: var(--link);
}

.sites-correction-card {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px 12px;
    min-height: 38px;
    padding: 6px 10px;
    border: 1px solid color-mix(in srgb, var(--accent) 20%, var(--line-soft));
    border-radius: var(--radius-sm);
    background: color-mix(in srgb, var(--accent) 3%, var(--content-subtle-bg));
}

.site-correction-wind {
    margin: 18px 0 0;
    padding: 0;
    border: 0;
}

.site-correction-location {
    min-width: 0;
    margin: 2px 0 0;
    padding: 13px 14px 14px;
    border: 1px solid color-mix(in srgb, var(--accent) 18%, var(--line-soft));
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--accent) 2.5%, var(--content-subtle-bg));
}

.site-correction-location legend {
    padding: 0 6px;
    color: var(--text);
    font-size: var(--font-sm);
    font-weight: 750;
}

.site-correction-location__controls {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
    align-items: start;
    gap: var(--form-grid-gap);
}

.site-correction-location__picker {
    align-self: start;
    gap: 8px;
    margin-top: calc(1.35em + var(--form-field-gap));
    white-space: nowrap;
}

.site-correction-location__picker-icon {
    width: 17px;
    height: 17px;
    flex: 0 0 17px;
    background: currentColor;
    -webkit-mask: url("/icons/ui/map-pin.svg") center / contain no-repeat;
    mask: url("/icons/ui/map-pin.svg") center / contain no-repeat;
}

.location-picker-modal {
    --app-modal-width: 720px;
}

.app-modal__body.location-picker__body {
    padding: 0;
    overflow: hidden;
}

.location-picker__map-shell {
    position: relative;
    min-height: 280px;
    height: clamp(300px, 48dvh, 460px);
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background: var(--content-subtle-bg);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.34);
}

.location-picker__map {
    width: 100%;
    height: 100%;
}

.location-picker__coordinates {
    position: absolute;
    z-index: 500;
    left: 50%;
    bottom: 18px;
    max-width: calc(100% - 96px);
    padding: 7px 11px;
    border: 1px solid rgba(23, 65, 95, 0.24);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 4px 16px rgba(15, 39, 57, 0.18);
    color: #243746;
    font: 700 0.78rem/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transform: translateX(-50%);
    pointer-events: none;
    backdrop-filter: blur(4px);
}

.location-picker-marker {
    border: 0;
    background: transparent;
}

.location-picker-marker__pin {
    display: block;
    position: relative;
    width: 42px;
    height: 44px;
    color: var(--accent, #1873b5);
    filter: drop-shadow(0 4px 4px rgba(15, 39, 57, 0.42));
}

.location-picker-marker__pin::before {
    content: "";
    position: absolute;
    z-index: 0;
    top: 1px;
    left: 2px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--accent, #1873b5) 24%, transparent);
}

.location-picker-marker__pin svg {
    position: relative;
    z-index: 1;
    display: block;
    width: 42px;
    height: 44px;
    overflow: visible;
}

.location-picker-marker__pin path {
    fill: currentColor;
    stroke: rgba(255, 255, 255, 0.96);
    stroke-width: 1.25;
    stroke-linejoin: round;
}

.location-picker-marker__pin circle {
    fill: #ffffff;
}

.location-picker-marker:focus-visible .location-picker-marker__pin {
    filter: drop-shadow(0 0 2px #ffffff)
            drop-shadow(0 0 6px var(--accent, #1873b5));
}

.location-picker-initial-marker {
    filter: drop-shadow(0 2px 3px rgba(15, 39, 57, 0.5));
}

@media (max-width: 640px) {
    .site-correction-location__controls {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .site-correction-location__picker {
        grid-column: 1 / -1;
        justify-self: stretch;
        margin-top: 0;
    }

    .location-picker__map-shell {
        min-height: 260px;
        height: min(52dvh, 420px);
    }

    .location-picker__coordinates {
        bottom: 12px;
        max-width: calc(100% - 52px);
        font-size: 0.73rem;
    }
}

@media (max-width: 390px) {
    .site-correction-location__controls {
        grid-template-columns: 1fr;
    }

    .site-correction-location__picker {
        grid-column: auto;
    }

    .location-picker__map-shell {
        min-height: 240px;
        height: 46dvh;
    }

    .location-picker__coordinates {
        max-width: calc(100% - 24px);
    }
}

.site-correction-wind legend {
    padding: 0;
    color: var(--text);
    font-weight: 700;
}

.site-correction-wind__hint {
    margin: 4px 0 10px;
    color: var(--muted);
    font-size: var(--font-sm);
    line-height: 1.4;
}

.site-correction-wind__directions {
    display: grid;
    grid-template-columns: repeat(8, minmax(42px, 1fr));
    gap: 6px;
}

.site-correction-wind__option {
    position: relative;
    min-width: 0;
}

.site-correction-wind__option input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.site-correction-wind__option span {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--content-bg, #fff);
    color: var(--text);
    font-size: var(--font-sm);
    font-weight: 800;
    cursor: pointer;
    transition: border-color 140ms ease, background 140ms ease, color 140ms ease;
}

.site-correction-wind__option input:checked + span {
    border-color: var(--accent);
    background: color-mix(in srgb, var(--accent) 12%, var(--panel));
    color: var(--blue-dark);
}

.site-correction-wind__option input:focus-visible + span {
    outline: 2px solid var(--focus-outline);
    outline-offset: 2px;
}

.site-correction-wind__directions[aria-invalid="true"] .site-correction-wind__option span {
    border-color: var(--form-control-invalid-border);
}

@media (max-width: 640px) {
    .site-correction-wind__directions {
        grid-template-columns: repeat(4, minmax(42px, 1fr));
    }
}

.sites-correction-card__content {
    min-width: 0;
    display: grid;
    grid-template-columns: 16px minmax(0, 1fr);
    align-items: center;
    gap: 7px;
}

.sites-correction-card__icon {
    width: 15px;
    height: 15px;
    background: var(--accent);
    -webkit-mask: url("/icons/ui/pencil.svg") center / contain no-repeat;
    mask: url("/icons/ui/pencil.svg") center / contain no-repeat;
}

.sites-correction-card h2 {
    min-width: 0;
    margin: 0;
    overflow: hidden;
    color: var(--text);
    font-size: var(--font-sm);
    font-weight: 700;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sites-correction-card__button {
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 8px;
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--link);
    cursor: pointer;
    font: inherit;
    font-size: var(--font-sm);
    font-weight: 750;
    white-space: nowrap;
}

.sites-correction-card__button:hover,
.sites-correction-card__button:focus-visible {
    border-color: var(--control-border-hover);
    background: var(--control-bg-hover);
    color: var(--blue-dark);
}

.sites-correction-card__button:focus-visible {
    outline: 2px solid var(--focus-outline);
    outline-offset: 2px;
}

.sites-correction-card__button .ui-icon {
    width: 13px;
    height: 13px;
}

.sites-correction-card__chevron {
    width: 13px;
    height: 13px;
    display: inline-block;
    background: currentColor;
    -webkit-mask: url("/icons/ui/chevron-right.svg") center / contain no-repeat;
    mask: url("/icons/ui/chevron-right.svg") center / contain no-repeat;
}

.glider-correction-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

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

.app-action-list__form {
    margin: 0;
}

.app-action-row {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr) 16px;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-sm);
    background: var(--panel);
    color: var(--text);
    cursor: pointer;
    font: inherit;
    text-align: left;
    transition: border-color 140ms ease, background 140ms ease, box-shadow 140ms ease, transform 140ms ease;
}

.app-action-row:hover,
.app-action-row:focus-visible {
    border-color: var(--control-border-hover);
    background: var(--control-bg-hover);
    box-shadow: 0 3px 10px rgba(23, 105, 168, 0.1);
    transform: translateY(-1px);
}

.app-action-row:active {
    box-shadow: none;
    transform: translateY(0);
}

.app-action-row:focus-visible {
    outline: 2px solid var(--focus-outline);
    outline-offset: 2px;
}

.app-action-row--simple {
    min-height: 48px;
    grid-template-columns: 20px minmax(0, 1fr);
}

.app-action-row__content {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.app-action-row__content strong {
    color: var(--blue-dark);
    font-size: var(--font-md);
}

.app-action-row__content > span {
    color: var(--muted);
    font-size: var(--font-sm);
    line-height: 1.4;
}

.app-action-row__icon,
.app-action-row__chevron {
    width: 18px;
    height: 18px;
    background: var(--link);
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: contain;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.app-action-row__icon--edit {
    mask-image: url("/icons/ui/pencil.svg");
    -webkit-mask-image: url("/icons/ui/pencil.svg");
}

.app-action-row__icon--rebuild {
    mask-image: url("/icons/ui/arrow-up-down.svg");
    -webkit-mask-image: url("/icons/ui/arrow-up-down.svg");
}

.glider-source-choice__icon--search {
    mask-image: url("/icons/ui/search.svg");
    -webkit-mask-image: url("/icons/ui/search.svg");
}

.glider-source-choice__icon--add {
    mask-image: url("/icons/ui/plus.svg");
    -webkit-mask-image: url("/icons/ui/plus.svg");
}

.app-action-row__chevron {
    width: 15px;
    height: 15px;
    background: var(--muted);
    mask-image: url("/icons/ui/chevron-right.svg");
    -webkit-mask-image: url("/icons/ui/chevron-right.svg");
}

.glider-source-context {
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 16px;
    margin: 0 0 var(--form-grid-gap);
    padding: 10px 12px;
    border: 1px solid var(--line-soft);
    border-left-color: color-mix(in srgb, var(--accent) 48%, var(--line-soft));
    border-radius: var(--radius-sm);
    background: var(--content-subtle-bg);
}

.glider-source-context div {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.glider-source-context dt,
.glider-source-context dd {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
}

.glider-source-context dt {
    color: var(--muted);
    font-size: var(--font-xs);
    font-weight: 700;
}

.glider-source-context dd {
    color: var(--text);
    font-size: var(--font-sm);
    font-weight: 700;
}

@media (max-width: 520px) {
    .glider-source-context {
        grid-template-columns: minmax(0, 1fr);
    }
}

.sites-info-details {
    display: grid;
    gap: var(--space);
}

.sites-top-pilots-panel {
    min-width: 0;
    padding: 14px;
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-sm);
    background: var(--content-subtle-bg);
}

.sites-top-pilots-panel h2 {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0 0 10px;
    color: var(--text);
    font-size: var(--font-md);
    font-weight: 700;
    text-transform: uppercase;
}

.sites-top-pilots-panel h2 .sites-section-icon {
    flex: 0 0 auto;
}

.sites-top-pilots {
    display: grid;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: sites-top-pilot;
}

.sites-top-pilots li {
    counter-increment: sites-top-pilot;
    min-width: 0;
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px solid var(--line-soft);
}

.sites-top-pilots li:last-child {
    border-bottom: 0;
}

.sites-top-pilot-avatar {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--avatar-border);
    border-radius: 50%;
    background: var(--avatar-bg);
}

.sites-top-pilot-avatar img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.sites-top-pilot-name {
    min-width: 0;
    overflow: hidden;
    color: var(--text);
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sites-top-pilot-count {
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 800;
}

.sites-empty {
    display: grid;
    place-content: center;
    min-height: 360px;
    padding: 42px 24px;
    text-align: center;
}

.sites-empty h1 {
    margin: 0;
    color: var(--blue-dark);
    font-size: clamp(28px, 4vw, 44px);
}

.sites-empty p {
    max-width: 420px;
    margin: 9px auto 0;
    color: var(--muted);
    font-weight: 700;
}

.site-flight-table {
    --pilot-flight-grid: minmax(82px, 0.55fr) minmax(130px, 0.95fr) minmax(168px, 196px) minmax(140px, 1.25fr) 34px;
}

.sites-nearest-table-wrap {
    overflow-x: visible;
}

.sites-nearest-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
}

.sites-nearest-table th {
    padding: 0 0 9px;
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 700;
    text-align: left;
    text-transform: uppercase;
    letter-spacing: 0;
}

.sites-nearest-table td {
    min-width: 0;
    padding: 9px 0;
    border-bottom: 1px solid var(--line-soft);
    color: var(--text);
    font-size: var(--font-sm);
    font-weight: 650;
}

.sites-nearest-table tbody tr {
    cursor: pointer;
    transition: background 140ms ease, box-shadow 140ms ease;
}

.sites-nearest-table tbody tr:hover {
    background: var(--row-hover);
}

.sites-nearest-table tbody tr:focus-visible {
    outline: 0;
    box-shadow: inset 3px 0 0 var(--focus-outline);
}

.sites-nearest-table .nearest-icon-col {
    width: 34px;
    text-align: center;
}

.sites-nearest-table .nearest-country-col {
    width: 74px;
}

.sites-nearest-table .nearest-elevation-col {
    width: 82px;
}

.sites-nearest-table .nearest-flights-col {
    width: 98px;
}

.sites-nearest-table .nearest-distance-col {
    width: 92px;
    text-align: right;
    white-space: nowrap;
}

.sites-nearest-table .nearest-site-col {
    min-width: 0;
}

.sites-nearest-site-link {
    min-width: 0;
    display: block;
    overflow: hidden;
    color: var(--pilot-identity-link);
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sites-nearest-site-link:hover,
.sites-nearest-site-link:focus-visible {
    color: var(--link);
}

.sites-nearest-item__pin {
    width: 18px;
    height: 18px;
    display: inline-block;
    vertical-align: middle;
    background: var(--blue);
    mask: url("/icons/ui/map-pin.svg") center / contain no-repeat;
    -webkit-mask: url("/icons/ui/map-pin.svg") center / contain no-repeat;
}
.sites-map-marker {
    width: 18px;
    height: 18px;
    display: block;
    border: 2px solid #fff;
    border-radius: 50%;
    background: var(--blue);
    box-shadow: 0 2px 9px rgba(15, 54, 92, 0.34);
}

.sites-map-marker--selected {
    width: 24px;
    height: 24px;
    border-width: 3px;
    background: var(--winner-color);
}

.sites-map-popup,
.leaflet-popup-content .sites-map-popup {
    min-width: 150px;
}

.sites-map-popup strong {
    display: block;
    margin-bottom: 7px;
    color: var(--blue-dark);
}

.sites-map-popup .country {
    color: var(--muted);
    font-size: var(--font-sm);
}

.sites-map-popup dl {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 3px 10px;
    margin: 0;
}

.sites-map-popup dt {
    color: var(--muted);
    font-weight: 700;
}

.sites-map-popup dd {
    margin: 0;
    font-weight: 800;
}

@media (min-width: 1100px) {
    .sites-page {
        height: calc(100vh - 52px);
        overflow: hidden;
    }

    .sites-layout {
        height: 100%;
        align-items: stretch;
    }

    .sites-map-column {
        position: relative;
        top: auto;
        height: 100%;
    }

    .sites-panel {
        min-height: 0;
        height: 100%;
        display: grid;
        grid-template-rows: auto minmax(0, 1fr);
    }

    .sites-panel-content {
        min-height: 0;
        display: grid;
        grid-template-rows: auto auto minmax(0, 1fr);
        overflow: hidden;
    }

    .sites-profile-content {
        min-height: 0;
        overflow-x: hidden;
        overflow-y: auto;
    }
}

@media (max-width: 1099px) {
    .sites-layout {
        display: block;
        padding: 0;
    }

    .sites-map-column {
        position: relative;
        top: auto;
        height: 52vh;
        min-height: 320px;
        margin-bottom: var(--panel-gap);
    }
}

@media (max-width: 620px) {
    .sites-layout {
        padding: 0;
    }

    .sites-map-column {
        height: 48vh;
        min-height: 260px;
    }

    .sites-panel-toolbar {
        min-height: 48px;
        padding: 6px 10px;
    }

    .sites-profile-header {
        padding: 15px 16px 12px;
    }

    .sites-profile-content {
        padding: 16px;
    }

    .sites-info-details {
        grid-template-columns: 1fr;
    }

    .glider-correction-actions {
        justify-content: flex-start;
    }

}

@media (max-width: 420px) {
    .profile-fact,
    .sites-fact {
        grid-template-columns: 24px minmax(0, 1fr);
        gap: 4px 10px;
        padding: 9px 12px;
    }

    .profile-fact dd,
    .sites-fact dd {
        grid-column: 2;
        text-align: left;
    }

    .sites-wind-value {
        justify-content: flex-start;
    }
}

.comp-page .page-heading {
    border-bottom: 0;
}

.comp-panel {
    overflow: hidden;
}

.comp-list,
.comp-results,
.comp-form,
.comp-admin,
.comp-summary {
    padding: var(--page-gutter);
}

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

.comp-list-item {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 3px;
    padding: 11px 12px;
    border: 1px solid var(--panel-border);
    border-radius: var(--radius-sm);
    color: var(--text);
    background: var(--control-bg);
}

.comp-list-item__main {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.comp-list-item__main strong,
.comp-list-item__main span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.comp-list-item:hover,
.comp-list-item:focus-visible {
    background: var(--control-bg-hover);
    text-decoration: none;
}

.comp-list-item span,
.comp-summary,
.comp-empty {
    color: var(--muted);
    font-size: var(--font-sm);
}

.comp-form {
    display: grid;
    gap: var(--panel-gap);
}

.comp-form-section {
    display: grid;
    gap: 10px;
    padding: 12px;
    border: 1px solid var(--panel-border);
    border-radius: var(--radius-sm);
    background: var(--content-subtle-bg);
}

.comp-form-section h2,
.comp-admin h2 {
    margin: 0;
    color: var(--table-header-text);
    font-size: 1rem;
}

.comp-form-section label {
    min-width: 0;
    display: grid;
    gap: 5px;
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 700;
}

.comp-form-section input {
    min-width: 0;
    min-height: var(--control-height-md);
    padding: 0 9px;
    border: 1px solid var(--control-border);
    border-radius: var(--radius-sm);
    background: var(--panel);
    color: var(--text);
}

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

.comp-form-grid h2,
.comp-form-grid .comp-radio-row,
.comp-form-grid .comp-check {
    grid-column: 1 / -1;
}

.comp-check input {
    min-height: 0;
}

.comp-radio-row,
.comp-form-actions,
.comp-inline-form,
.comp-admin-row,
.comp-admin-actions,
.comp-summary {
    display: flex;
    align-items: center;
    gap: 10px;
}

.comp-radio-row {
    flex-wrap: wrap;
    gap: 12px;
}

.comp-radio-row label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.comp-form-actions {
    justify-content: flex-end;
}

.comp-admin {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--panel-gap);
    border-top: 1px solid var(--line);
}

.comp-admin section {
    min-width: 0;
    display: grid;
    gap: 10px;
}

.comp-inline-form {
    align-items: start;
}

.comp-inline-form .autocomplete {
    flex: 1;
}

.comp-admin-list {
    display: grid;
    gap: 5px;
}

.comp-admin-row {
    justify-content: space-between;
    padding: 7px 8px;
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-sm);
    background: var(--panel);
}

.comp-admin-row button {
    min-height: 28px;
    border: 1px solid var(--control-border);
    border-radius: var(--radius-sm);
    background: var(--control-bg);
    color: var(--blue-dark);
    cursor: pointer;
}

.comp-table {
    width: 100%;
}

.comp-create-heading {
    background: var(--page-heading-bg);
}

.comp-create-form {
    display: grid;
    grid-template-columns: 210px minmax(0, 1fr);
    gap: var(--form-grid-gap);
    padding: var(--page-gutter);
}

.app-modal .comp-create-form {
    padding: 0;
}

.app-modal.comp-form-modal--create {
    padding: var(--viewport-page-shell-margin-block) var(--page-shell-gutter);
}

.app-modal.comp-form-modal--create .app-modal__panel {
    width: 100%;
    height: 100%;
    max-height: none;
}

.app-modal.comp-form-modal--edit .app-modal__panel {
    height: min(760px, calc(100dvh - var(--app-modal-vertical-gap)));
}

.comp-create-form .comp-form-error,
.comp-create-form .comp-form-actions {
    grid-column: 1 / -1;
}

.comp-form-actions--page {
    padding: 0 var(--page-gutter) var(--page-gutter);
}

.comp-step-tabs {
    display: grid;
    align-content: start;
    gap: 4px;
}

.comp-step-tab {
    min-width: 0;
    min-height: 42px;
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    padding: 0 10px;
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--muted);
    cursor: pointer;
    font-weight: 750;
    text-align: left;
}

.comp-step-tab:hover,
.comp-step-tab:focus-visible {
    background: var(--control-bg-hover);
    color: var(--blue-dark);
}

.comp-step-tab.is-active {
    border-color: rgba(38, 144, 212, 0.28);
    background: var(--row-selected);
    color: var(--blue-dark);
}

.comp-step-tab.has-error {
    box-shadow: inset 3px 0 0 #b42318;
}

.comp-step-panels {
    min-width: 0;
}

.comp-step-panel {
    display: none;
    gap: var(--form-grid-gap);
}

.comp-step-panel.is-active {
    display: grid;
}

.comp-section-header {
    min-height: 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-bottom: 1px solid var(--line-soft);
}

.comp-section-header h2 {
    margin: 0;
    color: var(--text);
    font-size: 1.08rem;
}

.comp-section-header span {
    padding: 3px 8px;
    border: 1px solid var(--badge-border);
    border-radius: 999px;
    background: var(--badge-bg);
    color: var(--badge-text);
    font-size: 0.72rem;
    font-weight: 850;
}

.comp-create-form .field--wide {
    grid-column: 1 / -1;
}

.comp-site-area-manager {
    padding: 10px;
    border: 1px solid var(--panel-border);
    border-radius: var(--radius-sm);
    background: var(--content-subtle-bg);
}

.comp-site-area-list {
    display: grid;
    gap: 8px;
}

.comp-site-area-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 140px auto;
    align-items: end;
    gap: 8px;
    padding: 9px;
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-sm);
    background: var(--panel);
}

.comp-site-area-site,
.comp-site-area-site .autocomplete {
    min-width: 0;
}

.comp-site-area-remove {
    min-height: var(--control-height-md);
}

.comp-site-area-add {
    justify-self: start;
}

.comp-form-grid--three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

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

.comp-segmented-control {
    width: min(100%, 520px);
    margin-bottom: 2px;
}

.comp-segmented-control--four {
    width: 100%;
}

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

.comp-scoring-option {
    overflow: hidden;
    border: 1px solid var(--panel-border);
    border-radius: var(--radius-sm);
    background: var(--control-bg);
}

.comp-scoring-option__toggle {
    min-height: 42px;
    padding: 8px 10px;
    color: var(--text);
    font-weight: 750;
}

.comp-scoring-option__settings {
    padding: 12px;
    border-top: 1px solid var(--line-soft);
    background: var(--content-subtle-bg);
}

.comp-description {
    margin: 0 0 12px;
    color: var(--text-muted);
    line-height: 1.55;
    white-space: pre-wrap;
}

.comp-summary--detail {
    flex-wrap: wrap;
    border-bottom: 1px solid var(--line);
}

.comp-summary--detail span {
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 8px;
    border: 1px solid var(--badge-border);
    border-radius: 999px;
    background: var(--badge-bg);
    color: var(--badge-text);
    font-weight: 750;
}

.comp-season-filter {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.comp-season-filter label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--badge-text);
    font-weight: 750;
    white-space: nowrap;
}

.comp-season-filter .form-control {
    width: auto;
    min-width: 88px;
}

.comp-summary--detail .ui-icon {
    width: 15px;
    height: 15px;
}

.comp-result-list {
    min-width: 0;
    overflow-x: auto;
}

.comp-result-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

.comp-result-table > thead > tr > th {
    min-width: 0;
    padding: 9px 10px;
    border-bottom: 1px solid var(--line-soft);
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 700;
    text-align: left;
    text-transform: uppercase;
    white-space: nowrap;
}

.comp-result-table > tbody > tr > td {
    min-width: 0;
    padding: 9px 10px;
    border-bottom: 1px solid var(--line-soft);
    vertical-align: middle;
}

.comp-results-footer { display: flex; justify-content: center; padding: 14px 10px 4px; }
.comp-results-footer .page-action { border-color: var(--control-border); background: var(--control-bg); }
.comp-results-footer .page-action:hover { border-color: var(--control-border-hover); background: var(--control-bg-hover); }
.comp-results-footer .ui-icon { width: 15px; height: 15px; }

.comp-result-row {
    cursor: pointer;
    transition: background .15s ease;
}

.comp-result-row:hover,
.comp-result-row:focus-visible,
.comp-result-row.is-expanded { background: var(--row-hover); }
.comp-result-row:focus-visible { outline: 2px solid var(--focus-outline); outline-offset: -2px; }
.comp-result-row[aria-busy="true"] { cursor: progress; opacity: .7; }

.comp-result-rank-col { width: 62px; text-align: left; }
.comp-result-rank-compact { display: none; }
.comp-result-score-col { width: 130px; text-align: right; }
.comp-result-flights-col { width: 92px; text-align: center; font-variant-numeric: tabular-nums; }
.comp-result-pilots-col { width: 92px; text-align: center; font-variant-numeric: tabular-nums; }
.comp-result-toggle-col { width: 42px; text-align: center; }
.comp-result-table th.comp-result-score-col { text-align: right; }

.comp-result-pilot {
    color: var(--text);
    overflow-wrap: anywhere;
}
.comp-result-pilot strong { font-size: 1rem; font-weight: 800; }

.comp-result-score-col strong { color: var(--blue-dark); font-size: 1.05rem; }
.comp-result-toggle-col .ui-icon { width: 16px; height: 16px; transition: transform .15s ease; }
.comp-result-row[aria-expanded="true"] .comp-result-toggle-col .ui-icon { transform: rotate(180deg); }

.comp-result-details-row > td { padding: 8px 10px 12px 68px; background: var(--content-subtle-bg); }
.comp-result-details-host { min-width: 0; }

.comp-result-flights {
    display: block;
}
.comp-result-flights-error { margin: 0; color: #991b1b; font-size: .78rem; }

.comp-result-flight-table-wrap {
    overflow-x: visible;
}

.pilot-flight-table.comp-result-flight-table {
    --pilot-flight-grid: minmax(82px, .55fr) minmax(120px, 1fr) minmax(168px, 196px);
}

.comp-team-pilot-group + .comp-team-pilot-group {
    margin-top: 12px;
}

.comp-team-pilot-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 8px 10px;
    border-bottom: 1px solid var(--line-soft);
    background: var(--row-hover);
}

.comp-team-pilot-summary strong {
    color: var(--blue-dark);
    font-variant-numeric: tabular-nums;
}

.comp-team-pilot-summary a {
    color: var(--text);
    font-weight: 700;
    text-decoration: none;
}

.comp-team-pilot-summary a:hover,
.comp-team-pilot-summary a:focus-visible {
    color: var(--blue-dark);
    text-decoration: underline;
}

.pilot-flight-table.comp-result-flight-table--task {
    --pilot-flight-grid: minmax(72px, .7fr) minmax(90px, 1fr) minmax(82px, .85fr) minmax(72px, .65fr);
}

.comp-result-flight-table .comp-result-flight-row {
    cursor: pointer;
}

.comp-result-flight-link {
    color: var(--text);
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
}

.comp-result-flight-link:hover,
.comp-result-flight-link:focus-visible {
    color: var(--blue-dark);
    text-decoration: underline;
}

.comp-result-flight-table .comp-result-penalty-col {
    min-width: 0;
}

.comp-result-warnings {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    padding-top: 8px;
}

.comp-result-warning {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 4px 7px;
    border: 1px solid rgba(217, 139, 38, 0.35);
    border-radius: 999px;
    background: #fff7e8;
    color: #996018;
    font-size: 0.76rem;
    font-weight: 800;
}

.comp-empty--panel {
    min-height: 96px;
    display: grid;
    place-items: center;
    border: 1px dashed var(--panel-border);
    border-radius: var(--radius-sm);
    background: var(--content-subtle-bg);
}

.comp-admin-card {
    min-width: 0;
    display: grid;
    align-content: start;
    gap: 10px;
    padding: 12px;
    border: 1px solid var(--panel-border);
    border-radius: var(--radius-sm);
    background: var(--content-subtle-bg);
}

.comp-admin-card--wide {
    grid-column: 1 / -1;
}

.comp-admin-card__header {
    min-height: 30px;
    display: flex;
    align-items: center;
}

.comp-task-import {
    display: grid;
    gap: var(--form-grid-gap);
}

.comp-task-current {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 10px;
    border: 1px solid var(--badge-border);
    border-radius: var(--radius-sm);
    background: var(--badge-bg);
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 750;
}

.comp-task-current strong {
    color: var(--text);
}

.comp-task-edit {
    margin-left: auto;
}

.comp-task-file {
    min-width: 0;
}

.comp-rules-form {
    display: grid;
    gap: var(--panel-gap);
}

.comp-management-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--form-grid-gap);
}

.comp-management-card {
    min-width: 0;
    display: grid;
    align-content: start;
    gap: 10px;
    padding: 12px;
    border: 1px solid var(--panel-border);
    border-radius: var(--radius-sm);
    background: var(--content-subtle-bg);
}

.comp-management-card__header {
    display: grid;
    gap: 3px;
}

.comp-management-card__header h3,
.comp-management-card__header p {
    margin: 0;
}

.comp-management-card__header h3 {
    font-size: 1rem;
}

.comp-management-card__header p {
    color: var(--muted);
    font-size: var(--font-sm);
}

.comp-person-add {
    display: flex;
    align-items: start;
    gap: 8px;
}

.comp-person-add .autocomplete {
    flex: 1;
}

.comp-person-list {
    display: grid;
    gap: 5px;
}

.comp-person-row {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 7px 8px;
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-sm);
    background: var(--panel);
}

.comp-person-row > strong,
.comp-person-main strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.comp-person-main {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 7px;
}

.comp-person-row button {
    min-height: 28px;
    border: 1px solid var(--control-border);
    border-radius: var(--radius-sm);
    background: var(--control-bg);
    color: var(--blue-dark);
    cursor: pointer;
}

.comp-admin-row__main {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 7px;
}

.comp-admin-row__main strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.comp-status-badge {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 2px 7px;
    border: 1px solid var(--badge-border);
    border-radius: 999px;
    background: var(--badge-bg);
    color: var(--badge-text);
    font-size: 0.72rem;
    font-weight: 850;
}

.comp-status-badge.is-approved {
    border-color: rgba(49, 151, 100, 0.35);
    background: #eef8f2;
    color: #207247;
}

.comp-status-badge.is-pending {
    border-color: rgba(217, 139, 38, 0.36);
    background: #fff7e8;
    color: #996018;
}

.comp-status-badge.is-rejected {
    border-color: rgba(124, 139, 154, 0.35);
    background: #f4f6f8;
    color: var(--muted);
}

.comp-admin-footer {
    grid-column: 1 / -1;
    display: flex;
    justify-content: flex-end;
}

@media (max-width: 760px) {
    .comp-result-list {
        margin-inline: -12px;
        overflow-x: visible;
    }

    .comp-create-form {
        grid-template-columns: minmax(0, 1fr);
    }

    .comp-step-tabs {
        grid-template-columns: repeat(auto-fit, minmax(42px, 1fr));
        overflow-x: auto;
    }

    .comp-step-tab {
        grid-template-columns: 20px;
        justify-items: center;
    }

    .comp-step-tab span {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
    }

    .comp-form-grid,
    .comp-form-grid--two,
    .comp-form-grid--three,
    .comp-toggle-row,
    .comp-management-grid,
    .comp-admin {
        grid-template-columns: minmax(0, 1fr);
    }

    .comp-result-table,
    .comp-result-table tbody { display: block; }
    .comp-result-table thead { display: none; }
    .comp-result-row {
        display: grid;
        grid-template-columns: 42px minmax(0, 1fr) 58px 82px 28px;
        align-items: center;
        border-bottom: 1px solid var(--line-soft);
    }
    .comp-result-table .comp-result-row td { width: auto; border: 0; }
    .comp-team-result-row .comp-result-pilots-col { display: none; }
    .comp-result-table .comp-result-rank-col { padding-left: 0; }
    .comp-result-table .comp-result-toggle-col { padding-inline: 0; text-align: center; }
    .comp-result-details-row:not([hidden]) { display: block; }
    .comp-result-details-row > td { display: block; padding: 8px 8px 12px 47px; border-bottom: 1px solid var(--line-soft); }

    .comp-site-area-row {
        grid-template-columns: minmax(0, 1fr);
        align-items: stretch;
    }

    .comp-site-area-remove {
        justify-self: start;
    }

}

@media (max-width: 460px) {
    .comp-result-row { grid-template-columns: 38px minmax(0, 1fr) 44px 68px 24px; }
    .comp-result-details-row > td { padding-left: 42px; }
}

@media (max-width: 380px) {
    .comp-result-row { grid-template-columns: 38px minmax(0, 1fr) 68px 24px; }
    .comp-result-flights-col { display: none; }
    .comp-result-table .comp-result-rank-col .flight-row-avatar { display: none; }
    .comp-result-rank-compact {
        display: block;
        color: var(--muted);
        font-weight: 800;
        text-align: center;
        font-variant-numeric: tabular-nums;
    }
}

.flight-batch-upload__rules {
    display: grid;
    gap: 12px;
}

.flight-batch-upload__rule {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(150px, 190px) 40px;
    gap: 10px;
    align-items: end;
}

.flight-batch-upload__rule--default {
    grid-template-columns: minmax(0, 1fr);
}

.flight-batch-upload__remove {
    width: 40px;
    height: 40px;
    margin-bottom: 1px;
}

.flight-batch-upload__remove .ui-icon {
    width: 18px;
    height: 18px;
}

.flight-batch-upload__add {
    justify-self: start;
}

@media (max-width: 600px) {
    .flight-batch-upload__rule {
        grid-template-columns: minmax(0, 1fr) 40px;
    }

    .flight-batch-upload__date {
        grid-column: 1;
    }

    .flight-batch-upload__remove {
        grid-column: 2;
        grid-row: 1;
    }
}

@media (max-width: 620px) {
    .app-modal.comp-form-modal--create .app-modal__panel {
        border-radius: 0;
    }
}

.live-page {
    height: calc(100vh - 52px);
    min-height: 420px;
    overflow: hidden;
}

.live-layout {
    height: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: var(--panel-gap);
}

.live-page.is-live-panel-minimized .live-layout {
    position: relative;
    grid-template-columns: minmax(0, 1fr);
}

.live-map-stack {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
}

.live-map-shell {
    min-height: 0;
    overflow: hidden;
    border: 1px solid var(--panel-border);
    border-radius: var(--radius-md);
    background: var(--panel);
}

.live-map {
    width: 100%;
    height: 100%;
    min-height: 280px;
}

.live-stream-panel {
    z-index: var(--z-local-popover);
    min-width: 0;
    height: 100%;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid var(--panel-border);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(8px);
}

.live-stream-panel-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 34px;
    align-items: center;
    gap: 8px;
    padding: 10px;
    border-bottom: 1px solid var(--line-soft);
    background: #f8fbfd;
}

.live-stream-search {
    min-width: 0;
    display: grid;
    gap: 5px;
}

.live-stream-search span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.live-stream-search input {
    width: 100%;
    height: var(--control-height-md);
    padding: 0 11px;
    border: 1px solid var(--control-border);
    border-radius: var(--radius-sm);
    background: var(--control-bg);
    color: var(--text);
    box-shadow: var(--shadow-control);
}

.live-stream-search input:focus {
    border-color: var(--control-border-hover);
    background: #fff;
}

.live-icon-button {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border: 0;
    background: var(--control-bg);
    color: var(--icon-muted);
    cursor: pointer;
}

.live-icon-button:hover,
.live-icon-button:focus-visible {
    border-color: var(--icon-hover-border);
    background: var(--control-bg-hover);
    color: var(--icon-hover-text);
}

.live-stream-panel-body {
    min-height: 0;
    overflow-x: hidden;
    overflow-y: visible;
    padding: 8px;
}

.live-stream-list {
    display: grid;
    gap: 7px;
}

.live-stream-item {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr) minmax(58px, auto);
    align-items: center;
    gap: 7px;
    padding: 7px 9px;
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-sm);
    background: #fff;
    color: var(--text);
    cursor: pointer;
    text-align: left;
}

.live-stream-item:hover,
.live-stream-item:focus-visible {
    border-color: var(--control-border-hover);
    background: var(--row-hover);
}

.live-stream-item.is-active {
    border-color: #8fc6e8;
    background: var(--row-selected);
    box-shadow: inset 3px 0 0 var(--row-selected-accent);
}

.live-stream-item__status-icon {
    width: 22px;
    height: 28px;
    display: grid;
    place-items: center;
}

.live-stream-item__status-icon img {
    max-width: 22px;
    max-height: 28px;
    display: block;
}

.live-stream-item__status-icon.is-stale {
    filter: grayscale(0.75);
    opacity: 0.62;
}

.live-stream-item__content {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.live-stream-item__row {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 6px;
}

.live-stream-item__row strong {
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--text);
    font-size: var(--font-md);
    font-weight: 500;
}

.live-stream-item__age {
    min-width: 0;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 3px;
    overflow: hidden;
    color: #b4b9bf;
    font-size: var(--font-sm);
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.live-stream-item__clock {
    width: 13px;
    height: 13px;
    flex: 0 0 auto;
    background: #b4b9bf;
    -webkit-mask: url("/icons/ui/clock.svg") center / contain no-repeat;
    mask: url("/icons/ui/clock.svg") center / contain no-repeat;
}

.live-stream-item__site {
    min-width: 0;
    overflow: hidden;
    color: #b4b9bf;
    font-size: var(--font-sm);
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.live-stream-item__values {
    min-width: 0;
    display: grid;
    gap: 3px;
    justify-items: end;
    color: #29325d;
    font-size: var(--font-md);
}

.live-stream-item__values > span {
    min-width: 0;
    display: inline-flex;
    align-items: baseline;
    gap: 3px;
    white-space: nowrap;
}

.live-stream-item__values b {
    font-weight: 500;
}

.live-stream-item__values span span {
    color: #b4b9bf;
    font-size: var(--font-sm);
    font-weight: 650;
}

.live-stream-empty,
.live-chart-message {
    margin: 12px;
    color: var(--muted);
    font-weight: 700;
    text-align: center;
}

.live-altitude-panel {
    min-height: 178px;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    border: 1px solid var(--panel-border);
    border-top: 0;
    border-radius: 0 0 var(--radius-md) var(--radius-md);
    background: rgba(255, 255, 255, 0.98);
}

.live-altitude-panel[hidden] {
    display: none;
}

.live-altitude-header {
    position:relative;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 34px;
    align-items: center;
    gap: 10px;
    padding: 8px 10px 0 10px;
    border-bottom: 1px solid var(--line-soft);
}

.live-altitude-header .live-icon-button {
    position:absolute;
    top:0;
    right:0;
}

.live-altitude-header h2 {
    margin: 0;
    overflow: hidden;
    color: var(--text);
    font-size: var(--font-md);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.live-altitude-title-row {
    min-width: 0;
    display: flex;
    align-items: baseline;
    gap: 8px;
}

.live-altitude-title-row > span:first-child,
.live-altitude-title-site {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.live-altitude-title-row > span:first-child {
    flex: 0 1 auto;
}

.live-altitude-title-site {
    flex: 1 1 auto;
    color: #b4b9bf;
    font-size: var(--font-sm);
    font-weight: 650;
}

.live-altitude-header p {
    margin: 2px 0 0;
    overflow: hidden;
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.live-altitude-header p.live-chart-telemetry {
    display: grid;
    grid-template-columns: repeat(4, minmax(58px, 1fr));
    gap: 6px;
    overflow: visible;
    white-space: normal;
    max-width:30em;
    margin-top:8px;
}

.live-chart-telemetry__item {
    min-width: 0;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: left;
    gap: 3px;
    overflow: hidden;
    padding: 0 6px;
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-sm);
    background: #fff;
    color: #29325d;
    font-size: var(--font-sm);
    font-weight: 750;
    white-space: nowrap;
}

.live-chart-telemetry__item b {
    min-width: 0;
    overflow: hidden;
    font-weight: 750;
    text-overflow: ellipsis;
}

.live-chart-telemetry__item span {
    flex: 0 0 auto;
    color: #b4b9bf;
    font-size: 0.78rem;
    font-weight: 700;
}

.live-altitude-chart {
    min-height: 0;
    height: 132px;
    padding: 6px 8px 8px;
}

.live-altitude-chart svg {
    width: 100%;
    height: 100%;
    display: block;
    touch-action: none;
}

.live-altitude-grid {
    stroke: #dce8f0;
    stroke-width: 1;
}

.live-altitude-axis {
    fill: var(--muted);
    font-size: 11px;
    font-weight: 700;
}

.live-altitude-path {
    fill: none;
    stroke: #9dceff;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2.4;
}

.live-altitude-dot {
    fill: var(--winner-color);
    stroke: #fff;
    stroke-width: 2;
}

.live-altitude-cursor {
    stroke: rgba(15, 54, 92, 0.62);
    stroke-width: 1.2;
    pointer-events: none;
}

.live-altitude-cursor-dot {
    fill: #0f5589;
    stroke: #fff;
    stroke-width: 2;
    pointer-events: none;
}

.live-altitude-hit-area {
    fill: transparent;
}

.live-map-marker {
    width: 25px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    filter: drop-shadow(0 4px 8px rgba(15, 54, 92, 0.35));
}

.live-map-marker img {
    max-width: 25px;
    max-height: 34px;
    display: block;
}

.live-map-marker--still img,
.live-map-marker--walking img {
    max-width: 25px;
    max-height: 34px;
}

.live-map-marker.is-selected {
    width: 40px;
    height: 40px;
    background: rgba(255, 255, 255, 0.5);
    outline: 2px solid #ffffff60;
    outline-offset: -2px;
}

.live-map-marker.is-stale {
    filter: grayscale(0.8) drop-shadow(0 3px 6px rgba(15, 54, 92, 0.22));
    opacity: 0.8;
}

.live-stream-panel.is-minimized {
    position: absolute;
    top: 10px;
    right: var(--page-gutter);
    width: 46px;
    height: auto;
    justify-self: end;
    grid-template-rows: auto;
    align-self: start;
}

.live-stream-panel.is-minimized .live-stream-panel-header {
    display: grid;
    grid-template-columns: 34px;
    padding: 6px;
    border-bottom: 0;
}

.live-stream-panel.is-minimized .live-stream-search,
.live-stream-panel.is-minimized .live-stream-panel-body {
    display: none;
}

@media (max-width: 620px) {
    .live-layout {
        display: block;
        position: relative;
    }

    .live-map-stack {
        height: 100%;
    }

    .live-map-shell {
        border-radius: var(--radius-md);
    }

    .live-stream-panel {
        position: absolute;
        top: 5px;
        right: 5px;
        bottom: 5px;
        width: min(320px, calc(100% - 20px));
        height: auto;
        border: 1px solid var(--panel-border);
        border-radius: var(--radius-md);
    }

    .live-stream-panel.is-minimized {
        width: 36px;
        bottom: auto;
        height: auto;
        opacity:0.8;
    }
    .live-stream-panel.is-minimized .live-stream-panel-header {
        padding:0;
    }
}

@media (max-width: 520px) {
    .live-page {
        min-height: 360px;
    }

    .live-stream-panel {
        width: min(300px, calc(100% - 16px));
    }

    .live-altitude-panel {
        min-height: 158px;
    }

    .live-altitude-chart {
        height: 112px;
    }
}

.pilot-flight-book {
    display: grid;
    gap: var(--panel-gap);
}

.pilot-flight-book-export-action {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.pilot-flight-book-export-message {
    margin: 0 0 16px;
    color: var(--muted);
    line-height: 1.5;
}

.pilot-flight-book-export-option {
    width: 100%;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 14px;
    padding: 14px;
    border: 1px solid var(--control-border);
    border-radius: var(--radius-sm);
    background: var(--control-bg);
    color: var(--text);
    text-align: left;
    cursor: pointer;
}

.pilot-flight-book-export-option + .pilot-flight-book-export-option {
    margin-top: 10px;
}

.pilot-flight-book-export-option:hover {
    border-color: var(--control-border-hover);
    background: var(--control-bg-hover);
}

.pilot-flight-book-export-option__format {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 54px;
    min-height: 38px;
    border-radius: var(--radius-sm);
    background: color-mix(in srgb, var(--blue) 10%, var(--panel));
    color: var(--blue-dark);
    font-size: var(--font-sm);
    font-weight: 850;
}

.pilot-flight-book-export-option strong,
.pilot-flight-book-export-option small {
    display: block;
}

.pilot-flight-book-export-option small {
    margin-top: 3px;
    color: var(--muted);
    line-height: 1.35;
}

.pilot-flight-book-export-status {
    display: grid;
    justify-items: center;
    gap: 14px;
    padding-top: 30px;
    padding-bottom: 30px;
    text-align: center;
}

.pilot-flight-book-export-status p {
    margin: 0;
    color: var(--muted);
    line-height: 1.5;
}

.pilot-flight-book-export-spinner {
    width: 34px;
    height: 34px;
    border: 3px solid color-mix(in srgb, var(--blue) 18%, transparent);
    border-top-color: var(--blue);
    border-radius: 50%;
    animation: pilot-flight-book-export-spin 720ms linear infinite;
}

.pilot-flight-book-export-ready-icon {
    width: 38px;
    height: 38px;
    background: var(--accent);
    mask: url("/icons/ui/file-check.svg") center / contain no-repeat;
    -webkit-mask: url("/icons/ui/file-check.svg") center / contain no-repeat;
}

@keyframes pilot-flight-book-export-spin {
    to {
        transform: rotate(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .pilot-flight-book-export-spinner {
        animation-duration: 1.8s;
    }
}

.pilot-stats {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px 16px;
}

.pilot-stats-group-scroll {
    min-width: 0;
    margin: 0;
}

.pilot-stats-groups {
    gap: 4px;
}

.pilot-stats-metric-row {
    display: flex;
    justify-content: flex-end;
}

.pilot-stats-metric-row label {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 800;
    text-transform: uppercase;
}

.pilot-stats-metric-row select {
    min-width: 136px;
    min-height: 30px;
    padding: 0 30px 0 9px;
    border: 1px solid var(--control-border);
    border-radius: var(--radius-sm);
    background: var(--control-bg);
    color: var(--text);
    font-size: var(--font-sm);
    font-weight: 700;
    text-transform: none;
}

.pilot-stats-content {
    min-width: 0;
    grid-column: 1 / -1;
}

.pilot-stats-chart {
    display: grid;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-sm);
    background: var(--content-subtle-bg);
}

.pilot-stats-chart__header {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 6px 14px;
}

.pilot-stats-chart__header {
    color: var(--muted);
    font-size: var(--font-md);
    font-weight: 700;
    text-transform: uppercase;
}

.pilot-stats-bars {
    display: grid;
    gap: 6px;
}

.pilot-stats-bar-row {
    display: grid;
    grid-template-columns: minmax(92px, 0.34fr) minmax(120px, 1fr) minmax(62px, auto);
    gap: 10px;
    align-items: center;
    border-bottom: 0;
}

.pilot-stats-bar-label {
    min-width: 0;
    overflow: hidden;
    color: var(--text);
    font-size: var(--font-sm);
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pilot-stats-bar-track {
    height: 22px;
    overflow: hidden;
    border-radius: var(--radius-sm);
    background: #edf4f8;
}

.pilot-stats-bar-fill {
    height: 100%;
    min-width: 0;
    border-radius: inherit;
    background: linear-gradient(270deg, var(--accent), #e79251)
}

.pilot-stats-bar-row.is-empty .pilot-stats-bar-fill {
    opacity: 0;
}

.pilot-stats-bar-value {
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 800;
    text-align: right;
    white-space: nowrap;
}

.pilot-stats-total {
    display: flex;
    align-items: baseline;
    justify-content: flex-end;
    gap: 8px;
    padding-top: 2px;
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 700;
}

.pilot-stats-total strong {
    color: var(--text);
    font-size: var(--font-md);
    font-weight: 850;
    white-space: nowrap;
}

.pilot-flight-book-year-scroll {
    margin: 0;
}

.pilot-flight-book-years {
    gap: 4px;
}

.pilot-flight-book-year-link {
    min-height: 32px;
    padding: 0 7px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--link);
    font-size: var(--font-sm);
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: background 140ms ease, color 140ms ease;
}

.pilot-flight-book-year-link:hover,
.pilot-flight-book-year-link.is-active {
    color: var(--blue-dark);
}

.pilot-flight-book-year-link:hover {
    background: color-mix(in srgb, var(--blue) 6%, transparent);
}

.pilot-flight-book-year-link:focus-visible {
    outline: 2px solid var(--focus-outline);
    outline-offset: 1px;
}

.pilot-flight-book-year-link.is-active {
    background: color-mix(in srgb, var(--blue) 10%, var(--panel));
    color: var(--blue-dark);
    font-weight: 850;
}

.pilot-flight-book-year-content {
    min-width: 0;
}

.pilot-flight-book-year {
    display: grid;
    gap: 12px;
}

.pilot-flight-book-year h2 {
    margin: 0;
    color: var(--blue-dark);
    font-size: var(--font-lg);
    line-height: 1.2;
}

.pilot-flight-book-summary {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px 16px;
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 750;
}

.pilot-flight-book-summary strong {
    color: var(--text);
    font-weight: 850;
}

.pilot-sites-view {
    display: grid;
    gap: 8px;
}

.pilot-sites-view-toolbar {
    display: flex;
    justify-content: flex-end;
    min-height: 24px;
}

.pilot-sites-view-toggle {
    display: inline-grid;
    grid-template-columns: repeat(2, minmax(42px, auto));
    align-items: end;
    column-gap: 2px;
    padding: 0 1px;
    border-bottom: 1px solid var(--panel-border);
}

.pilot-sites-view-input {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.pilot-sites-view-option {
    position: relative;
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
    border-radius: var(--radius-sm) var(--radius-sm) 0 0;
    color: var(--text);
    font: inherit;
    font-weight: 750;
    line-height: 1;
    cursor: pointer;
    user-select: none;
    transition: background 140ms ease, color 140ms ease;
}

.pilot-sites-view-option::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    border-radius: 999px;
    background: transparent;
}

.pilot-sites-view-option:hover {
    background: var(--control-bg-hover);
    color: var(--blue-dark);
}

.pilot-sites-view-input:focus-visible + .pilot-sites-view-option {
    outline: 2px solid var(--focus-outline);
    outline-offset: 2px;
}

.pilot-sites-view-input:checked + .pilot-sites-view-option {
    color: var(--blue-dark);
}

.pilot-sites-view-input:checked + .pilot-sites-view-option::after {
    background: var(--blue);
}

.pilot-sites-view-panel[hidden] {
    display: none;
}

.pilot-sites-map-frame {
    height: clamp(360px, 58vh, 640px);
    overflow: hidden;
    border: 1px solid var(--panel-border);
    border-radius: 8px;
    background: var(--content-subtle-bg);
}
.pilot-sites-table-wrap {
    overflow: hidden;
    border: 1px solid var(--panel-border);
    border-radius: var(--radius-md);
    background: var(--panel);
}

.pilot-sites-table {
    width: 100%;
    border-collapse: collapse;
    counter-reset: pilot-site-row;
}

.pilot-sites-table th {
    padding: 10px 12px;
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 700;
    text-align: left;
    text-transform: uppercase;
}

.pilot-sites-table td {
    padding: 11px 12px;
    border-top: 1px solid var(--panel-border);
    color: var(--text);
    vertical-align: middle;
}

.pilot-sites-table tbody tr {
    counter-increment: pilot-site-row;
    transition: background 120ms ease;
}

.pilot-sites-table tbody tr:hover {
    background: var(--content-subtle-bg);
}

.pilot-sites-table .index-col {
    width: 54px;
    color: var(--muted);
    text-align: right;
}

.pilot-sites-table tbody .index-col::before {
    content: counter(pilot-site-row);
}

.pilot-sites-table .count-col {
    width: 92px;
    text-align: right;
}

.pilot-site-name {
    margin-right: 8px;
    color: var(--text);
    font-weight: 650;
    text-decoration: none;
}

a.pilot-site-name:hover,
a.pilot-site-name:focus-visible {
    color: var(--blue);
    text-decoration: underline;
    text-underline-offset: 3px;
}

a.pilot-site-name:focus-visible {
    outline: 2px solid var(--focus-ring);
    outline-offset: 2px;
}

.pilot-sites-map {
    width: 100%;
    height: 100%;
    min-height: 0;
    background: var(--content-subtle-bg);
}
.pilot-sites-popup strong {
    display: block;
    margin-bottom: 8px;
    color: var(--text);
}

.pilot-sites-popup dl {
    display: grid;
    grid-template-columns: auto auto;
    gap: 4px 12px;
    margin: 0;
}

.pilot-sites-popup dt {
    color: var(--muted);
}

.pilot-sites-popup dd {
    margin: 0;
    color: var(--text);
    font-weight: 650;
    text-align: right;
}

.pilot-general-layout {
    display: grid;
    grid-template-columns: minmax(280px, 1.12fr) minmax(320px, 1fr);
    gap: var(--panel-gap);
}

.pilot-best-flight-panel {
    position: relative;
    min-height: 240px;
    display: grid;
    align-content: end;
    gap: 9px;
    overflow: hidden;
    padding: 24px;
    border: 1px solid rgba(219, 211, 188, 0.9);
    border-radius: var(--radius-sm);
    background:
            linear-gradient(145deg, rgba(255, 249, 235, 0.97), rgba(235, 247, 250, 0.94)),
            radial-gradient(circle at 86% 18%, rgba(20, 114, 150, 0.17), transparent 32%);
    color: var(--blue-dark);
    text-decoration: none;
}

.pilot-best-flight-panel::before {
    content: "";
    position: absolute;
    right: 24px;
    top: 24px;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.74);
    box-shadow: 0 12px 24px rgba(42, 64, 76, 0.12);
}

.pilot-best-flight-panel::after {
    content: "";
    position: absolute;
    right: 34px;
    top: 34px;
    width: 24px;
    height: 24px;
    background: var(--accent);
    mask: url("/icons/ui/trophy.svg") center / contain no-repeat;
}

a.pilot-best-flight-panel:hover {
    border-color: var(--control-border-hover);
    color: var(--accent-hover);
}

.pilot-best-flight-panel--empty {
    cursor: default;
}

.pilot-best-flight-panel span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 850;
    text-transform: uppercase;
}

.pilot-best-flight-panel strong {
    min-width: 0;
    color: inherit;
    font-size: 34px;
    line-height: 1.05;
}

.pilot-best-flight-panel em,
.pilot-best-flight-panel b {
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    color: var(--blue-dark);
    font-size: 15px;
    font-style: normal;
    font-weight: 800;
}

.pilot-best-flight-panel em {
    color: var(--muted);
}

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

.pilot-info-card {
    min-width: 0;
    min-height: 172px;
    display: grid;
    align-content: start;
    gap: 10px;
    padding: 18px;
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-sm);
    background: var(--panel-soft);
}

.pilot-info-card__icon {
    width: 24px;
    height: 24px;
    color: var(--accent);
}

.pilot-info-card__icon--equipment {
    mask-image: url("/icons/ui/plane.svg");
}

.pilot-info-card__icon--activity {
    mask-image: url("/icons/ui/calendar-days.svg");
}

.pilot-info-card__icon--club {
    mask-image: url("/icons/ui/shield-check.svg");
}

.pilot-info-card h2 {
    margin: 0;
    color: var(--muted);
    font-size: 12px;
    font-weight: 850;
    text-transform: uppercase;
}

.pilot-info-card p {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
    color: var(--blue-dark);
    font-size: 15px;
    font-weight: 800;
    line-height: 1.32;
}

.pilot-info-card small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 750;
}

.pilot-profile-empty {
    display: grid;
    align-content: center;
    min-height: 220px;
    padding: 32px 18px;
    color: var(--muted);
}

.pilot-profile-empty--hero {
    min-height: 220px;
    max-width: 460px;
    padding: 58px 0 18px;
}

.pilot-profile-empty h1,
.pilot-profile-empty h2 {
    margin: 0 0 8px;
    color: var(--blue-dark);
    font-size: 32px;
    line-height: 1.08;
}

.pilot-profile-empty p,
.pilot-profile-placeholder {
    margin: 0;
    color: var(--muted);
    font-weight: 650;
}

@container pilot-profile (max-width: 980px) {
    .pilot-owner-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .pilot-hero.has-profile {
        grid-template-columns: 1fr;
    }

    .pilot-hero.has-profile .pilot-hero-search {
        grid-column: 1;
        grid-row: 1;
        justify-self: end;
    }

    .pilot-hero.has-profile .pilot-hero-profile {
        grid-column: 1;
        grid-row: 2;
    }

    .pilot-title-line h1 {
        font-size: 44px;
    }

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

    .pilot-general-layout {
        grid-template-columns: 1fr;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model {
        --pilot-flight-score-width: 118px;
        --pilot-flight-grid: minmax(82px, 0.55fr) minmax(130px, 1.05fr) minmax(110px, 118px) minmax(140px, 1.35fr) 40px;
    }

    .pilot-profile-shell .pilot-flight-table--duration.pilot-flight-table--mobile-model {
        --pilot-flight-grid: minmax(82px, 0.55fr) minmax(130px, 1.05fr) minmax(110px, 118px) minmax(70px, 84px) minmax(140px, 1.35fr) 40px;
    }


    .pilot-flight-table--mobile-model .pilot-flight-score-heading {
        width: 100%;
        padding-right: 0;
        text-align: right;
    }

    .pilot-flight-table--mobile-model .pilot-flight-score {
        grid-template-columns: minmax(0, 1fr);
        width: 100%;
    }

    .pilot-flight-table--mobile-model .pilot-flight-score__value {
        display: none;
    }
}

@container pilot-profile (max-width: 760px) {
    .pilot-owner-actions {
        grid-template-columns: minmax(0, 1fr);
    }

    .pilot-owner-action,
    .pilot-owner-action:nth-child(odd),
    .pilot-owner-action:nth-last-child(-n + 2) {
        border-right: 0;
        border-bottom: 1px solid #e2eaf1;
    }

    .pilot-owner-action:last-child {
        grid-column: auto;
        border-bottom: 0;
    }

    .pilot-hero {
        grid-template-columns: 1fr;
        min-height: auto;
        padding: 18px;
    }

    .pilot-hero.is-empty {
        min-height: 360px;
    }

    .pilot-search-landing {
        width: 100%;
        padding: 30px 0 34px;
    }

    .pilot-hero-search--landing {
        width: 100%;
    }

    .pilot-hero.has-profile .pilot-hero-search {
        grid-column: 1;
        grid-row: 1;
        justify-self: stretch;
        width: 100%;
    }

    .pilot-hero-profile {
        align-items: flex-start;
        gap: 14px;
    }

    .pilot-hero.has-profile .pilot-hero-profile {
        grid-column: 1;
        grid-row: 2;
    }

    .pilot-avatar-large {
        width: 78px;
        height: 78px;
        font-size: 24px;
    }

    .pilot-title-line h1 {
        font-size: 34px;
    }

    .pilot-info-grid {
        grid-template-columns: 1fr;
    }

    .pilot-flight-table {
        --pilot-flight-grid: minmax(76px, 0.5fr) minmax(0, 1.35fr) minmax(150px, 158px) minmax(92px, 0.75fr) 34px;
    }

    .pilot-hike-fly-table {
        --pilot-flight-grid: minmax(76px, 0.5fr) minmax(0, 1.35fr) minmax(150px, 158px) 34px;
    }

    .pilot-flight-table .score-col {
        min-width: 0;
    }
}

@container pilot-profile (max-width: 520px) {
    .pilot-hero {
        gap: 14px;
        padding: 16px 18px 18px;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model tbody tr {
        align-items: start;
        padding-top: 2px;
        padding-bottom: 2px;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model tbody .pilot-flight-date-col,
    .pilot-profile-shell .pilot-flight-table--mobile-model tbody .site-cell,
    .pilot-profile-shell .pilot-flight-table--mobile-model tbody .score-col,
    .pilot-profile-shell .pilot-flight-table--mobile-model tbody .meta-col,
    .pilot-profile-shell .pilot-flight-table--mobile-model tbody .track-cell {
        align-self: start;
        padding-top: 0;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model .pilot-flight-score__main {
        align-items: start;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model .track-cell .row-actions {
        align-items: flex-start;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model .info-action {
        align-items: flex-start;
        margin-top: 0;
    }
    .pilot-hero-profile {
        display: grid;
        grid-template-columns: clamp(64px, 18.5vw, 72px) minmax(0, 1fr);
        align-items: start;
        gap: clamp(10px, 3vw, 12px);
    }

    .pilot-avatar-large {
        width: clamp(64px, 18.5vw, 72px);
        height: clamp(64px, 18.5vw, 72px);
    }

    .pilot-title-line {
        gap: 7px 8px;
    }

    .pilot-title-line h1 {
        max-width: 100%;
        font-size: clamp(24px, 7.7vw, 34px);
        line-height: 1.02;
    }

    .pilot-title-actions {
        max-width: 100%;
        flex-wrap: wrap;
        margin-top: 1px;
    }

    .pilot-hero-meta {
        gap: 6px 12px;
        margin-top: 9px;
    }

    .pilot-kpi-row {
        grid-template-columns: 1fr;
    }

    .pilot-kpi-card {
        min-height: 84px;
    }

    .pilot-profile-content {
        padding: 8px;
    }

    .pilot-tabs-bar .active-filter-scroll {
        padding: 0 12px;
    }
}

@media (max-width: 980px) {
    .pilot-owner-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .pilot-hero.has-profile {
        grid-template-columns: 1fr;
    }

    .pilot-hero.has-profile .pilot-hero-search {
        grid-column: 1;
        grid-row: 1;
        justify-self: end;
    }

    .pilot-hero.has-profile .pilot-hero-profile {
        grid-column: 1;
        grid-row: 2;
    }

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

    .pilot-general-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .pilot-owner-actions {
        grid-template-columns: minmax(0, 1fr);
    }

    .pilot-owner-action,
    .pilot-owner-action:nth-child(odd),
    .pilot-owner-action:nth-last-child(-n + 2) {
        border-right: 0;
        border-bottom: 1px solid #e2eaf1;
    }

    .pilot-owner-action:last-child {
        grid-column: auto;
        border-bottom: 0;
    }

    .pilot-hero {
        grid-template-columns: 1fr;
        min-height: auto;
        padding: 18px;
    }

    .pilot-hero.is-empty {
        min-height: 360px;
    }

    .pilot-search-landing {
        width: 100%;
        padding: 30px 0 34px;
    }

    .pilot-hero-search--landing {
        width: 100%;
    }

    .pilot-hero.has-profile .pilot-hero-search {
        grid-column: 1;
        grid-row: 1;
        justify-self: stretch;
        width: 100%;
    }

    .pilot-hero-profile {
        align-items: flex-start;
        gap: 14px;
    }

    .pilot-hero.has-profile .pilot-hero-profile {
        grid-column: 1;
        grid-row: 2;
    }

    .pilot-avatar-large {
        width: 78px;
        height: 78px;
        font-size: 24px;
    }

    .pilot-title-line h1 {
        font-size: 34px;
    }

    .pilot-info-grid {
        grid-template-columns: 1fr;
    }

    .pilot-flight-table {
        --pilot-flight-grid: minmax(76px, 0.5fr) minmax(0, 1.35fr) minmax(150px, 158px) minmax(92px, 0.75fr) 34px;
    }

    .pilot-hike-fly-table {
        --pilot-flight-grid: minmax(76px, 0.5fr) minmax(0, 1.35fr) minmax(150px, 158px) 34px;
    }

    .pilot-flight-table .score-col {
        min-width: 0;
    }
}

@media (max-width: 520px) {
    .pilot-hero {
        gap: 14px;
        padding: 16px 18px 18px;
    }

    .pilot-hero-profile {
        display: grid;
        grid-template-columns: clamp(64px, 18.5vw, 72px) minmax(0, 1fr);
        align-items: start;
        gap: clamp(10px, 3vw, 12px);
    }

    .pilot-avatar-large {
        width: clamp(64px, 18.5vw, 72px);
        height: clamp(64px, 18.5vw, 72px);
    }

    .pilot-title-line {
        gap: 7px 8px;
    }

    .pilot-title-line h1 {
        max-width: 100%;
        font-size: clamp(24px, 7.7vw, 34px);
        line-height: 1.02;
    }

    .pilot-title-actions {
        max-width: 100%;
        flex-wrap: wrap;
        margin-top: 1px;
    }

    .pilot-hero-meta {
        gap: 6px 12px;
        margin-top: 9px;
    }

    .pilot-kpi-row {
        grid-template-columns: 1fr;
    }

    .pilot-kpi-card {
        min-height: 84px;
    }

    .pilot-profile-content {
        padding: 8px;
    }

    .pilot-tabs-bar .active-filter-scroll {
        padding: 0 0;
    }

    .pilot-stats {
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }

    .pilot-stats-metric-row {
        justify-content: stretch;
    }

    .pilot-stats-metric-row--control-only {
        justify-content: flex-end;
    }

    .pilot-stats-metric-row label {
        width: 100%;
        justify-content: space-between;
    }

    .pilot-stats-metric-row select {
        min-width: 132px;
    }

    .pilot-stats-chart {
        gap: 10px;
        padding: 10px 12px 12px;
    }

    .pilot-stats-bars {
        gap: 5px;
    }

    .pilot-stats-bar-row {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 3px 8px;
    }

    .pilot-stats-bar-track {
        grid-column: 1 / -1;
        grid-row: 2;
        height: 13px;
    }

    .pilot-stats-bar-label,
    .pilot-stats-bar-value {
        line-height: 1.2;
    }

    .pilot-flight-table-wrap {
        overflow-x: visible;
    }

    .p.live-chart-telemetry   {
        gap:2px;
    } 
    .live-chart-telemetry__item   {
        padding:0 2px;
    }        
}

.flight-table tbody tr.is-selected > td:first-child {
    box-shadow: inset 3px 0 0 var(--row-selected-accent);
}

.rank-col {
    width: 62px;
    text-align: left;
    color: var(--muted);
}

.flight-row-avatar {
    position: relative;
    width: 40px;
    height: 40px;
    display: inline-grid;
    place-items: center;
    color: inherit;
    text-decoration: none;
    vertical-align: middle;
}

.flight-row-avatar:focus-visible {
    outline: 2px solid var(--focus-outline);
    outline-offset: 3px;
    border-radius: 50%;
}

.flight-row-avatar-image {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--avatar-border);
    border-radius: 50%;
    background: var(--avatar-placeholder-bg);
    color: var(--avatar-placeholder-text);
    font-size: var(--font-sm);
    font-weight: 800;
}

.flight-row-avatar-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.flight-row-rank {
    opacity: 0.7;
    position: absolute;
    right: -7px;
    bottom: -3px;
    min-width: 18px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    border: 1px solid var(--rank-border);
    border-radius: 999px;
    background: var(--rank-bg);
    color: var(--rank-text);
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1;
    box-shadow: 0 1px 3px rgba(25, 55, 82, 0.14);
}

.score-col {
    width: 124px;
    min-width: 118px;
    text-align: right;
    white-space: nowrap;
}

.score-col .sort-link {
    justify-content: flex-end;
    width: 100%;
}

.score-value {
    color: var(--muted);
    font-size: var(--font-sm);
}

.score-stack {
    display: grid;
    grid-template-columns: max-content 28px;
    grid-template-rows: auto auto;
    align-items: center;
    justify-content: end;
    column-gap: 10px;
    width: 100%;
}
.score-stack strong {
    font-weight:600;
}
.score-icon {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
    justify-self: center;
    width: 23px;
    height: 23px;
    margin-top: 0;
    padding: 0;
    border: 1px solid #f0d0a0;
    border-radius:4px;
    background: var(--control-bg);
    opacity: 0.92;
    filter: saturate(0.9);
    object-fit: contain;
    transition: filter 140ms ease, opacity 140ms ease;
}

.flight-table tbody tr:hover .score-icon,
.flight-table tbody tr.is-selected .score-icon {
    opacity: 1;
    filter: saturate(1);
}

.score-distance,
.score-value {
    grid-column: 1;
    text-align: right;
}

.meta-col {
    width: 48px;
    text-align: right;
    color: var(--muted);
    white-space: nowrap;
}

.row-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 5px;
}

.info-action {
    position: relative;
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--control-border) 26%, var(--panel));
    border-radius: 99px;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--control-border) 52%, transparent);
    transition: background 140ms ease, box-shadow 140ms ease;
}

:is(.flight-table, .pilot-flight-table) tbody tr:is(:hover, .is-selected) .info-action {
    background: var(--control-bg-hover);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--control-border-hover) 48%, transparent);
}

.info-icon {
    width: 16px;
    height: 16px;
    opacity: 0.72;
    filter: saturate(0.82);
    object-fit: contain;
    transition: filter 140ms ease, opacity 140ms ease;
}

:is(.flight-table, .pilot-flight-table) tbody tr:is(:hover, .is-selected) .info-icon {
    opacity: 1;
    filter: saturate(1);
}

.private-flight-badge {
    position: absolute;
    bottom: -1px;
    left: -4px;
    width: 14px;
    height: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: var(--status-badge-bg);
    color: var(--status-badge-text);
    pointer-events: none;
}

.private-flight-badge::before {
    content: "";
    width: 15px;
    height: 15px;
    background: currentColor;
    mask-image: url("/icons/ui/lock.svg");
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
    -webkit-mask-image: url("/icons/ui/lock.svg");
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;
}

.external-flight-badge {
    position: absolute;
    bottom: -4px;
    left: -4px;
    min-width: 25px;
    height: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    border: 1px solid #9b5b22;
    border-radius: 3px;
    background: #fff3e7;
    color: #7d4517;
    font-size: 7px;
    font-weight: 600;
    letter-spacing: 0;
    pointer-events: none;
}

.comment-flight-badge {
    position: absolute;
    bottom: -3px;
    right: -6px;
    width: 17px;
    height: 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: var(--status-badge-bg);
    color: var(--status-badge-text);
    box-shadow: 0 1px 3px rgba(31, 45, 57, 0.18);
    z-index: 2;
    pointer-events: auto;
    cursor: help;
}

.comment-flight-badge--pilot-note {
    color: var(--status-badge-text);
}

.comment-flight-badge::before {
    content: "";
    width: 15px;
    height: 15px;
    background: currentColor;
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;
}

.comment-flight-badge--comments::before {
    mask-image: url("/icons/ui/message-circle-more.svg");
    -webkit-mask-image: url("/icons/ui/message-circle-more.svg");
}

.comment-flight-badge--pilot-note::before {
    mask-image: url("/icons/ui/message-circle.svg");
    -webkit-mask-image: url("/icons/ui/message-circle.svg");
}

.comment-flight-badge--pilot-note-and-comments::before {
    mask-image: url("/icons/ui/messages-circle.svg");
    -webkit-mask-image: url("/icons/ui/messages-circle.svg");
}

.winner-flight-badge {
    position: absolute;
    z-index: 2;
    width: 14px;
    height: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #fff;
    color: var(--winner-color);
    opacity:0.6;
    pointer-events: auto;
    cursor: help;
}

.comment-flight-badge:focus-visible,
.winner-flight-badge:focus-visible {
    outline: 2px solid color-mix(in srgb, currentColor 45%, transparent);
    outline-offset: 2px;
}

.winner-flight-badge--likes {
    top: -5px;
    right: 10px;
}

.winner-flight-badge--comments {
    right: -4px;
    top: -5px;
}

.winner-flight-badge--score {
    top: -5px;
    right: 24px;
}

.winner-flight-badge::before {
    content: "";
    width: 15px;
    height: 15px;
    background: currentColor;
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;
}

.winner-flight-badge--likes::before {
    mask-image: url("/icons/ui/thumbs-up.svg");
    -webkit-mask-image: url("/icons/ui/thumbs-up.svg");
}

.winner-flight-badge--comments::before {
    mask-image: url("/icons/ui/message-circle.svg");
    -webkit-mask-image: url("/icons/ui/message-circle.svg");
}

.winner-flight-badge--score::before {
    mask-image: url("/icons/ui/trophy.svg");
    -webkit-mask-image: url("/icons/ui/trophy.svg");
}

:is(.comment-flight-badge, .winner-flight-badge)[data-tooltip]::after {
    content: attr(data-tooltip);
    position: absolute;
    top: 50%;
    right: calc(100% + 8px);
    z-index: 10;
    max-width: min(220px, calc(100vw - 48px));
    padding: 5px 8px;
    border-radius: 6px;
    background: rgba(20, 31, 42, 0.94);
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.25;
    white-space: nowrap;
    box-shadow: 0 6px 18px rgba(16, 26, 36, 0.18);
    opacity: 0;
    transform: translateY(-50%) translateX(2px);
    transition: opacity 120ms ease, transform 120ms ease;
    pointer-events: none;
}

:is(.comment-flight-badge, .winner-flight-badge)[data-tooltip]:hover::after,
:is(.comment-flight-badge, .winner-flight-badge)[data-tooltip]:focus-visible::after {
    opacity: 1;
    transform: translateY(-50%);
}

@media (max-width: 680px) {
    :is(.comment-flight-badge, .winner-flight-badge)[data-tooltip]::after {
        top: auto;
        right: -4px;
        bottom: calc(100% + 8px);
        max-width: min(180px, calc(100vw - 32px));
        white-space: normal;
        text-align: center;
        transform: translateY(2px);
    }

    :is(.comment-flight-badge, .winner-flight-badge)[data-tooltip]:hover::after,
    :is(.comment-flight-badge, .winner-flight-badge)[data-tooltip]:focus-visible::after {
        transform: translateY(0);
    }
}

.pilot-cell {
    min-width: 0;
    vertical-align: middle;
}

.pilot-cell-inner {
    width: 100%;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.pilot-mobile-site {
    display: none;
}

.pilot-name-wrap {
    flex: 0 1 auto;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
}

.pilot-link {
    min-width: 0;
}

.pilot-link {
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: bottom;
    font-weight: 600;
    color: var(--text);
}

.pilot-meta-wrap {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    white-space: nowrap;
    vertical-align: bottom;
}

.pilot-achievement-details-empty,
.pilot-achievement-details-limited {
    margin-top: 8px;
    color: var(--muted);
    font-size: var(--font-sm);
}

.pilot-achievement-details-list {
    display: grid;
    gap: 6px;
    margin-top: 8px;
}

.pilot-achievement-details-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: end;
    padding: 8px 10px;
    border-radius: 6px;
    background: color-mix(in srgb, var(--panel-border) 24%, transparent);
    color: inherit;
    text-decoration: none;
}

.pilot-achievement-details-row[href]:hover,
.pilot-achievement-details-row[href]:focus-visible {
    background: color-mix(in srgb, var(--link) 9%, var(--panel));
}

.pilot-achievement-details-row__main {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.pilot-achievement-details-row__primary {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--text);
    font-size: var(--font-md);
    font-weight: 700;
}

.pilot-achievement-details-row__inline-link {
    color: var(--link);
    text-decoration: none;
}

.pilot-achievement-details-row__inline-link:hover,
.pilot-achievement-details-row__inline-link:focus-visible {
    text-decoration: underline;
}

.pilot-achievement-details-row__secondary {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--muted);
    font-size: var(--font-sm);
}

.pilot-achievement-details-row__metric {
    display: grid;
    gap:8px;
    justify-items: end;
    color: var(--muted);
    font-size: var(--font-md);
    text-transform: uppercase;
}

.pilot-achievement-details-row__metric strong {
    color: var(--text);
    text-transform: none;
}

.country {
    min-height: 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 5px;
    padding: 0 3px;
    border-radius: 4px;
    border: 1px solid var(--badge-border);
    background: var(--badge-bg);
    color: var(--badge-text);
    font-size: var(--font-sm);
    font-weight: 600;
    opacity:0.6;
}

.empty-state {
    padding: 34px 12px;
    border: 1px solid var(--line);
    text-align: center;
    color: var(--muted);
}

.admin-panel {
    overflow: hidden;
}

.admin-body {
    padding: 16px 18px 18px;
}

.admin-status {
    display: grid;
    gap: 4px;
    margin-bottom: 14px;
    padding: 10px 12px;
    border: 1px solid rgba(49, 151, 100, 0.34);
    border-radius: var(--radius-sm);
    background: #f1fbf5;
    color: #1f6d45;
}

.admin-status span {
    color: #365f4a;
    font-size: var(--font-md);
}

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

.admin-action-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    padding: 12px;
    border: 1px solid var(--line-soft);
    background: var(--content-subtle-bg);
}

.admin-action-row h2 {
    margin: 0;
    color: var(--text);
    font-size: var(--font-md);
    line-height: 1.2;
}

.admin-action-row p {
    margin: 4px 0 0;
    color: var(--muted);
}

.admin-action-submit {
    min-width: 140px;
    justify-content: center;
}

.admin-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 16px;
}

.admin-metric-group {
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--panel);
    overflow: hidden;
}

.admin-metric-group h2 {
    margin: 0;
    padding: 10px 12px;
    border-bottom: 1px solid var(--line);
    font-size: var(--font-md);
    font-weight: 700;
}

.admin-metric-table {
    display: grid;
}

.admin-metric-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 3px 10px;
    padding: 9px 12px;
    border-bottom: 1px solid var(--line-soft);
}

.admin-metric-row:last-child {
    border-bottom: 0;
}

.admin-metric-row span {
    min-width: 0;
    overflow-wrap: anywhere;
    font-size: var(--font-sm);
}

.admin-metric-row strong {
    font-size: var(--font-sm);
}

.admin-metric-row small {
    grid-column: 1 / -1;
    color: var(--muted);
    font-size: var(--font-sm);
}

.flight-detail-host:empty {
    display: none;
}

.flight-detail-sidebar,
.flight-detail-dialog {
    display: none;
}

.flight-detail-sidebar,
.flight-detail-dialog-panel {
    background: var(--panel);
    border: 1px solid var(--panel-border);
}

.flight-detail-sidebar {
    overflow: hidden;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-panel);
    transition: top 120ms ease-out, bottom 120ms ease-out;
}

.flight-detail-header {
    min-height: 62px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: start;
    padding: 14px 16px;
    border-bottom: 1px solid var(--line-soft);
    background: var(--detail-header-bg);
}

.flight-detail-title {
    min-width: 0;
}

.flight-detail-title h2 {
    margin: 0;
    font-size: 1.1rem;
    line-height: 1.2;
}

.flight-detail-heading {
    display: flex;
    min-width: 0;
    align-items: baseline;
    gap: 8px;
}

.flight-detail-pilot-name {
    flex: 0 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.flight-detail-date {
    flex: 0 0 auto;
    color: var(--muted);
    font-size: inherit;
    font-weight: 400;
}

.flight-detail-title p {
    margin: 4px 0 0;
    overflow: hidden;
    color: var(--muted);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.flight-detail-subtitle {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 6px;
}

.flight-detail-subtitle span {
    min-width: 50px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.flight-detail-score-type-icon {
    width: 15px;
    height: 15px;
    flex: 0 0 15px;
    object-fit: contain;
    border: 1px solid #ffaa11;
    border-radius: var(--radius-sm);
}

.flight-detail-actions {
    display: flex;
    align-items: center;
    gap: 6px;
}

.flight-detail-navigation {
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

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

.flight-detail-navigation-button,
.flight-detail-close,
.flight-detail-edit {
    width: var(--control-height-sm);
    height: var(--control-height-sm);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--icon-muted);
    cursor: pointer;
    transition: background 140ms ease, color 140ms ease, border-color 140ms ease;
}

.flight-detail-mode-toggle {
    width: var(--control-height-sm);
    height: var(--control-height-sm);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--icon-muted);
    cursor: pointer;
    transition: background 140ms ease, color 140ms ease, border-color 140ms ease;
}

.flight-detail-mode-toggle:hover {
    border-color: var(--icon-hover-border);
    background: var(--control-bg-hover);
    color: var(--icon-hover-text);
}

.flight-detail-mode-toggle::before {
    content: "";
    width: 18px;
    height: 14px;
    border: 2px solid currentColor;
    border-left-width: 7px;
    border-radius: 3px;
}

.flight-detail-navigation-button:hover,
.flight-detail-close:hover,
.flight-detail-edit:hover {
    border-color: var(--icon-hover-border);
    background: var(--control-bg-hover);
    color: var(--icon-hover-text);
}

.flight-detail-navigation-button:disabled {
    opacity: 0.35;
    cursor: default;
}

.flight-detail-navigation-button:disabled:hover {
    border-color: transparent;
    background: transparent;
    color: var(--icon-muted);
}

.flight-detail-navigation-button::before,
.flight-detail-edit::before,
.flight-detail-close::before {
    content: "";
    width: 18px;
    height: 18px;
    background: currentColor;
    mask-image: url("/icons/ui/x.svg");
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: 18px 18px;
    -webkit-mask-image: url("/icons/ui/x.svg");
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 18px 18px;
}

.flight-detail-navigation-button--previous::before {
    mask-image: url("/icons/ui/chevron-left.svg");
    -webkit-mask-image: url("/icons/ui/chevron-left.svg");
}

.flight-detail-navigation-button--next::before {
    mask-image: url("/icons/ui/chevron-right.svg");
    -webkit-mask-image: url("/icons/ui/chevron-right.svg");
}

.flight-detail-edit::before {
    mask-image: url("/icons/ui/pencil.svg");
    -webkit-mask-image: url("/icons/ui/pencil.svg");
}

.flight-detail-close::before {
    mask-image: url("/icons/ui/x.svg");
    -webkit-mask-image: url("/icons/ui/x.svg");
}

.flight-detail-body {
    height: calc(100% - 62px);
    overflow: auto;
    display: grid;
    grid-template-rows: 230px 88px 1fr;
}

.flight-detail-placeholder--map {
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(120deg, rgba(41, 142, 98, 0.18), transparent 38%),
        linear-gradient(45deg, #e5eee4, #c6ddec);
}

.flight-detail-placeholder--map::before,
.flight-detail-placeholder--map::after {
    content: "";
    position: absolute;
    inset: auto 20px 45px 24px;
    height: 4px;
    border-radius: 999px;
    background: rgba(214, 181, 35, 0.72);
    transform: rotate(-18deg);
}

.flight-detail-placeholder--map::after {
    inset: 84px 70px auto 90px;
    background: rgba(186, 67, 161, 0.72);
    transform: rotate(24deg);
}

.flight-detail-placeholder--chart {
    border-bottom: 1px solid var(--line-soft);
    background:
        linear-gradient(180deg, transparent 70%, rgba(246, 189, 69, 0.24) 0),
        repeating-linear-gradient(90deg, transparent 0 38px, rgba(30, 70, 100, 0.08) 39px 40px),
        #fff;
}

.flight-detail-placeholder-content {
    padding: 14px 16px 18px;
}

.flight-detail-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 16px;
}

.flight-detail-metrics div {
    padding: 8px;
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-sm);
    background: var(--detail-header-bg);
}

.flight-detail-metrics span {
    display: block;
    overflow: hidden;
    color: var(--muted);
    font-size: var(--font-sm);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.flight-detail-metrics strong {
    display: block;
    margin-top: 4px;
}

.flight-detail-empty-copy {
    min-height: 96px;
    padding: 12px;
    border: 1px solid var(--line-soft);
    color: var(--muted);
    background: var(--content-subtle-bg);
}

.flight-detail-dialog {
    position: fixed;
    inset: 0;
    z-index: var(--z-flight-detail);
    pointer-events: auto;
}

.flight-detail-dialog-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(14, 20, 28, 0.54);
}

.flight-detail-dialog-panel {
    position: absolute;
    inset: var(--viewport-page-shell-margin-block) var(--page-shell-gutter);
    overflow: hidden;
    border-radius: var(--radius-md);
}

.flight-detail-dialog-panel .flight-detail-body {
    max-height: calc(100vh - 62px - (2 * var(--viewport-page-shell-margin-block)));
}

.app-modal.flight-detail-modal {
    --app-modal-edge-gap: 8px;
    --app-modal-vertical-gap: 16px;
    --app-modal-width: 1400px;
}

.app-modal.flight-detail-modal .flight-detail-modal__panel {
    height: calc(100dvh - var(--app-modal-vertical-gap));
    max-height: none;
}

.flight-detail-modal__panel .flight-detail-body {
    min-height: 0;
    flex: 1 1 auto;
    height: auto;
}

@media (max-width: 620px) {
    .app-modal.flight-detail-modal {
        --app-modal-edge-gap: 0px;
        --app-modal-vertical-gap: 0px;
    }

    .app-modal.flight-detail-modal .flight-detail-modal__panel {
        height: 100dvh;
        border: 0;
        border-radius: 0;
    }
}

@media (max-width: 900px) {
    :root {
        --page-shell-margin-block-start: calc(var(--space) / 2);
        --page-shell-margin-block-end: calc(var(--space) / 2);
        --viewport-page-shell-margin-block: calc(var(--space) / 2);
        --page-shell-gutter: calc(var(--space) / 2);
        --page-shell-padding-block: calc(var(--space) / 2);
    }

    .flight-table {
        min-width: 0;
        table-layout: fixed;
    }

    .flight-table .model-col,
    .flight-table .team-col {
        display: none;
    }

    .site-cell {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .pilot-cell {
        min-width: 0;
    }

    .pilot-cell-inner {
        min-width: 0;
        display: flex;
        align-items: center;
    }

    .pilot-name-wrap {
        min-width: 0;
        overflow: hidden;
    }

    .score-col {
        width: 118px;
        min-width: 112px;
    }

    .meta-col {
        width: 42px;
    }
}

@media (min-width: 1024px) {
    .flights-page:has(.flight-detail-host.is-open.flight-detail-mode-split) {
        max-width: var(--page-max-width);
        padding-right: calc(var(--flight-detail-width) + var(--flight-detail-right) + var(--flight-detail-gap));
    }

    .flights-layout:has(.flight-detail-host.is-open.flight-detail-mode-split) {
        min-width: 0;
    }

    .flights-layout:has(.flight-detail-host.is-open.flight-detail-mode-split) .page-panel {
        min-width: 0;
    }

    .flights-layout:has(.flight-detail-host.is-open.flight-detail-mode-split) .flight-table {
        min-width: 0;
        table-layout: fixed;
    }

    .flights-layout:has(.flight-detail-host.is-open.flight-detail-mode-split) .flight-table .model-col,
    .flights-layout:has(.flight-detail-host.is-open.flight-detail-mode-split) .flight-table .team-col {
        display: none;
    }

    .flights-layout:has(.flight-detail-host.is-open.flight-detail-mode-split) .site-cell {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .flights-layout:has(.flight-detail-host.is-open.flight-detail-mode-split) .pilot-cell {
        min-width: 0;
    }

    .flights-layout:has(.flight-detail-host.is-open.flight-detail-mode-split) .pilot-cell-inner {
        min-width: 0;
        display: flex;
        align-items: center;
    }

    .flight-detail-host.is-open.flight-detail-mode-split .flight-detail-sidebar {
        display: block;
        position: fixed;
        z-index: var(--z-page-overlay);
        top: var(--flight-detail-top);
        right: max(var(--flight-detail-right), calc((100% - var(--page-max-width)) / 2 + var(--flight-detail-right)));
        bottom: var(--flight-detail-bottom);
        width: var(--flight-detail-width);
        min-height: 0;
    }

    body.is-page-scrolled .flight-detail-host.is-open.flight-detail-mode-split .flight-detail-sidebar {
        top: var(--flight-detail-scrolled-top);
        bottom: var(--flight-detail-scrolled-bottom);
    }

    .flight-detail-host.is-open.flight-detail-mode-split .flight-detail-dialog {
        display: none;
    }
}

@media (max-width: 1023px) {
    .flight-detail-host.is-open .flight-detail-dialog {
        display: block;
    }

    .flight-detail-mode-toggle {
        display: none;
    }
}

@media (max-width: 420px) {
    .flight-detail-date {
        display: none;
    }
}

.flight-detail-host.is-open.flight-detail-mode-dialog .flight-detail-dialog {
    display: block;
}

@media (max-width: 760px) {
    .flights-page {
        --flight-list-inset: 10px;
    }

    .topbar-inner {
        gap: 8px;
        padding: 0 10px;
    }

    .user-nav--login {
        display: none;
    }

    .topbar-more-menu {
        padding: 12px;
    }

    .main-nav :is(a, button) {
        padding-left: 8px;
        padding-right: 8px;
    }

    .page-heading,
    .active-filter-bar,
    .flight-list-panel {
        padding-left: 10px;
        padding-right: 10px;
    }

    .flight-list-panel {
        padding-left: 0;
        padding-right: 0;
    }

    .active-filter-bar {
        gap: 8px;
    }

    .flights-page .flight-filter-trigger {
        width: auto;
        min-width: 40px;
        min-height: 40px;
        padding-inline: 11px;
    }

    .flights-page .flight-filter-trigger span {
        display: inline;
    }

    .flights-page .flight-filter-trigger.page-action--active {
        width: 40px;
        padding-inline: 0;
    }

    .flights-page .flight-filter-trigger.page-action--active span {
        display: none;
    }

    .active-filter-strip {
        gap: 7px;
        padding-top: 4px;
        padding-bottom: 4px;
    }

    .filter-chip {
        max-width: min(58vw, 220px);
    }

    .filter-open {
        min-width: 42px;
        padding: 0 11px;
    }

    .filter-open span,
    .claim-open span {
        display: none;
    }

    .page-action {
        width: 40px;
        min-width: 40px;
        min-height: 40px;
        padding: 0;
    }

    .page-action span {
        display: none;
    }

    .flight-upload-trigger {
        max-width: min(52vw, 190px);
    }

    .admin-action-submit span {
        display: inline;
    }

    .flight-table {
        min-width: 0;
    }

    .model-col,
    .team-col {
        display: none;
    }

    .flight-table th,
    .flight-table td {
        padding: 6px 5px 6px 3px;
    }

    .score-col {
        width: 118px;
        min-width: 112px;
    }
}

@media (min-width: 380px) and (max-width: 760px) {
    .flight-upload-trigger {
        width: auto;
        padding: 0 12px;
    }

    .flight-upload-trigger span {
        min-width: 0;
        display: inline;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

@media (max-width: 519px) {
    .topbar-more > button {
        gap: 8px;
        padding: 0 10px;
    }

    .topbar-more-trigger__icon,
    .topbar-more-trigger__icon::before,
    .topbar-more-trigger__icon::after {
        width: 16px;
        height: 2px;
        border-radius: 999px;
    }

    .topbar-more-trigger__icon {
        display: block;
    }

    .topbar-more-trigger__icon::before {
        top: -5px;
        left: 0;
    }

    .topbar-more-trigger__icon::after {
        top: 5px;
        left: 0;
    }

    .topbar-more-trigger__label--desktop,
    .topbar-more-trigger__chevron {
        display: none;
    }

    .topbar-more-trigger__label--mobile {
        display: inline;
    }
}

@container sites-profile (max-width: 760px) {
    .site-flight-table {
        --pilot-flight-meta-width: clamp(30px, 7cqw, 42px);
        --pilot-flight-grid: 76px minmax(0, 1fr) minmax(92px, 104px) var(--pilot-flight-meta-width);
    }

    .site-flight-table tr {
        grid-template-columns: var(--pilot-flight-grid);
        column-gap: clamp(5px, 1.6cqw, 8px);
    }

    .site-flight-table tbody tr {
        grid-template-rows: auto auto;
        row-gap: 3px;
    }

    .site-flight-table .track-cell .row-actions {
        width: var(--pilot-flight-meta-width);
    }

    .site-flight-table tbody .pilot-flight-date-col {
        grid-column: 1;
        grid-row: 1 / span 2;
        align-self: center;
    }

    .site-flight-table tbody .site-pilot-cell {
        grid-column: 2;
        grid-row: 1;
        align-self: end;
        padding-top: 0;
        padding-bottom: 0;
        line-height: 1.2;
    }

    .site-flight-table tbody .model-col {
        grid-column: 2;
        grid-row: 2;
        display: block;
        align-self: start;
        overflow: hidden;
        padding-top: 0;
        padding-bottom: 0;
        color: var(--muted);
        font-size: var(--font-sm);
        line-height: 1.15;
    }

    .site-flight-table tbody .score-col {
        grid-column: 3;
        grid-row: 1 / span 2;
        align-self: center;
    }

    .site-flight-table tbody .meta-col,
    .site-flight-table tbody .track-cell {
        grid-column: 4;
        grid-row: 1 / span 2;
        align-self: center;
    }

    .site-flight-table thead .model-col {
        display: none;
    }

    .site-flight-table .pilot-flight-score-heading {
        width: 100%;
        padding-right: 0;
        text-align: right;
    }

    .site-flight-table .pilot-flight-score-heading-full {
        display: none;
    }

    .site-flight-table .pilot-flight-score-heading-compact {
        display: flex;
    }

    .site-flight-table .pilot-flight-score {
        grid-template-columns: minmax(0, 1fr);
        width: 100%;
    }

    .site-flight-table .pilot-flight-score__main {
        justify-content: flex-end;
        gap: 5px;
    }

    .site-flight-table .pilot-flight-score__distance {
        flex: 0 0 auto;
    }

    .site-flight-table .pilot-flight-score__value {
        display: none;
    }

    .site-flight-table .pilot-flight-score__icon.score-icon {
        box-sizing: border-box;
        flex: 0 0 20px;
        width: 20px;
        height: 20px;
        margin-right: 0;
    }

    .site-flight-table .glider-icon-stack {
        display: none;
    }

    .sites-nearest-table .nearest-icon-col {
        width: 28px;
    }

    .sites-nearest-table .nearest-country-col {
        display: none;
    }

    .sites-nearest-table .nearest-elevation-col {
        width: 72px;
    }

    .sites-nearest-table .nearest-flights-col {
        width: 76px;
    }

    .sites-nearest-table .nearest-distance-col {
        width: 78px;
    }
}

@container sites-profile (max-width: 520px) {
    .site-flight-table tbody tr {
        align-items: start;
        padding-top: 2px;
        padding-bottom: 2px;
    }

    .site-flight-table tbody .pilot-flight-date-col,
    .site-flight-table tbody .score-col,
    .site-flight-table tbody .meta-col,
    .site-flight-table tbody .track-cell {
        align-self: start;
        padding-top: 0;
    }

    .site-flight-table tbody .site-pilot-cell {
        align-self: start;
    }

    .site-flight-table .pilot-flight-score__main {
        align-items: start;
    }

    .site-flight-table .track-cell .row-actions {
        align-items: flex-start;
    }

    .site-flight-table .info-action {
        align-items: flex-start;
        margin-top: 0;
    }

    .sites-nearest-table .nearest-elevation-col {
        display: none;
    }

    .sites-nearest-table .nearest-flights-col {
        width: 64px;
    }

    .sites-nearest-table .nearest-distance-col {
        width: 72px;
    }
}

@container sites-profile (max-width: 360px) {
    .sites-correction-card {
        grid-template-columns: 1fr;
        align-items: start;
        gap: 3px;
        padding-block: 7px;
    }

    .sites-correction-card h2 {
        overflow: visible;
        text-overflow: clip;
        white-space: normal;
    }

    .sites-correction-card__button {
        justify-self: end;
        min-height: 26px;
        padding-right: 6px;
    }
}

@container glider-profile (max-width: 520px) {
    .sites-correction-card {
        grid-template-columns: 1fr;
        align-items: start;
        gap: 3px;
        padding-block: 7px;
    }

    .sites-correction-card h2 {
        overflow: visible;
        text-overflow: clip;
        white-space: normal;
    }

    .sites-correction-card__button {
        min-height: 26px;
        padding-right: 6px;
    }

    .glider-correction-actions {
        justify-content: flex-end;
    }
}

@media (max-width: 620px) {
    :root {
        --page-shell-margin-block-start: 0px;
        --page-shell-margin-block-end: 0px;
        --viewport-page-shell-margin-block: 0px;
        --page-shell-gutter: 0px;
        --page-shell-padding-block: 0px;
    }

    .page-panel {
        border-radius: 0;
    }

    .flight-detail-dialog-panel,
    .sites-map-shell,
    .live-map-shell,
    .live-altitude-panel {
        border-radius: 0;
    }

    .page-heading {
        padding: 13px 10px 8px;
    }

    .active-filter-bar {
        gap: 8px;
        padding: 13px 10px 10px;
    }

    .filter-open {
        min-width: 42px;
        padding: 0 11px;
    }

    .filter-open span,
    .claim-open span {
        display: none;
    }

    .admin-body {
        padding: 12px 10px;
    }

    .admin-action-row {
        grid-template-columns: minmax(0, 1fr);
        align-items: stretch;
    }

    .admin-action-submit {
        width: 100%;
    }

    .admin-action-submit span {
        display: inline;
    }

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

    .flight-list-panel {
        padding: 0 10px 12px;
    }

    .date-row {
        margin-right: 0;
        margin-left: 0;
    }

    .date-row__content {
        grid-template-columns: 36px 1fr 36px;
        padding: 5px 0;
    }

    .date-row h2 {
        min-width: 0;
        font-size: var(--font-lg);
        overflow-wrap: anywhere;
    }

    .flight-table-wrap {
        padding: 0;
        overflow-x: visible;
    }

    .flight-table {
        display: block;
        min-width: 0;
        border-collapse: separate;
    }

    .flight-table thead,
    .flight-table tbody {
        display: block;
    }

    .flight-table thead tr {
        display: grid;
        grid-template-columns: 52px minmax(0, 1fr) 92px 40px;
        grid-template-areas: "rank pilot score info";
        column-gap: 8px;
        padding: 0 7px;
        background: transparent;
    }

    .flight-table tbody tr {
        display: grid;
        grid-template-columns: 52px minmax(0, 1fr) 92px 40px;
        grid-template-areas: "rank pilot score info";
        column-gap: 8px;
        row-gap: 0;
        align-items: center;
        padding: 6px 7px;
        border-bottom: 1px solid var(--line-soft);
        background: transparent;
    }

    .flight-table th,
    .flight-table td {
        padding: 0;
        border-bottom: 0;
    }

    .flight-table thead th {
        min-height: 30px;
        display: flex;
        align-items: center;
        background: transparent;
    }

    .flight-table tbody tr:hover {
        background: var(--row-hover);
    }

    .flight-table tbody tr.is-selected {
        background: var(--row-selected);
    }

    .flight-table tbody tr.followed-pilot-row {
        background: var(--followed-pilot-row-bg, #fff8e6);
    }

    .flight-table tbody tr.followed-pilot-row:hover {
        background: var(--followed-pilot-row-hover-bg, #fff1cc);
    }

    .flight-table tbody tr.followed-pilot-row.is-selected {
        background: var(--row-selected);
    }

    .flight-table thead th:nth-child(2) {
        grid-area: pilot;
    }

    .flight-table thead th:nth-child(4) {
        display: none;
    }

    .rank-col {
        grid-area: rank;
        align-self: center;
        width: auto;
    }

    .flight-table thead .rank-col {
        justify-content: center;
    }

    .flight-row-avatar {
        width: 40px;
        height: 40px;
    }

    .flight-row-avatar-image {
        width: 40px;
        height: 40px;
    }

    .flight-row-rank {
        right: -7px;
        bottom: -4px;
        min-width: 17px;
        height: 17px;
        font-size: 0.68rem;
    }

    .pilot-cell {
        grid-area: pilot;
        align-self: center;
        min-width: 0;
        line-height: 1.18;
    }

    .pilot-cell-inner {
        align-items: center;
    }

    .pilot-mobile-site {
        display: block;
        min-width: 0;
        margin-top: 2px;
        overflow: hidden;
        color: #34495d;
        line-height: 1.18;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .score-col {
        grid-area: score;
        align-self: center;
        width: 92px;
        min-width: 0;
    }

    .flight-list-panel .flight-table tbody .site-cell {
        display: none;
    }

    .score-stack {
        row-gap: 0;
    }

    .track-cell {
        grid-area: info;
        align-self: center;
        width: auto;
    }

    .flight-table thead .meta-col {
        grid-area: info;
        width: auto;
    }

    .track-cell .row-actions {
        width: 40px;
        min-height: 0;
        align-items: center;
        justify-content: center;
    }

    .score-icon {
        margin-top: 0;
        margin-right:14px;
    }

    .info-action {
        width: 26px;
        height: 26px;
        margin-trop: 0;
        align-items: center;
    }

    .private-flight-badge {
        top: -4px;
        right: -5px;
        width: 14px;
        height: 14px;
    }

    .private-flight-badge::before {
        width: 12px;
        height: 12px;
    }

    .comment-flight-badge {
        bottom: -4px;
        right: -6px;
        width: 14px;
        height: 14px;
    }

    .comment-flight-badge::before {
        width: 12px;
        height: 12px;
    }

    .model-col,
    .team-col {
        display: none;
    }

    .score-col .sort-link > span:first-child {
        display: none;
    }

    .score-heading-compact {
        display: inline;
    }

    .flight-table .score-unit,
    .glider-flight-table .score-unit {
        display: none;
    }

}

@media (max-width: 520px) {
    .date-row {
        margin-right: -10px;
        margin-left: -10px;
    }

    .date-row__content {
        padding-right: var(--flight-list-inset);
        padding-left: var(--flight-list-inset);
    }

    .flight-list-panel .flight-table-wrap {
        margin-right: -10px;
        margin-left: -10px;
    }

    .flight-table thead tr {
        grid-template-columns: 46px minmax(0, 1fr) 86px 32px;
        column-gap: 5px;
        padding: 0 4px;
    }

    .flight-table tbody tr {
        grid-template-columns: 46px minmax(0, 1fr) 86px 32px;
        column-gap: 5px;
        padding: 6px 4px;
    }

    .flight-table .country {
        min-height: 16px;
        margin-left: 4px;
        padding-right: 4px;
        padding-left: 4px;
        font-size: 0.62rem;
    }

    .flight-row-avatar,
    .flight-row-avatar-image {
        width: 36px;
        height: 36px;
    }

    .flight-row-rank {
        right: -6px;
        bottom: -4px;
    }

    .track-cell .row-actions {
        width: 32px;
    }

    .info-action {
        width: 24px;
        height: 24px;
    }

    .info-icon {
        width: 16px;
        height: 16px;
    }
}

@media (max-width: 760px) {
    .pilot-profile-shell .pilot-flight-table--mobile-model {
        --pilot-flight-grid: 76px minmax(0, 1fr) minmax(150px, 158px) 40px;
    }

    .pilot-profile-shell .pilot-flight-table--duration.pilot-flight-table--mobile-model {
        --pilot-flight-grid: 76px minmax(0, 1fr) minmax(150px, 158px) minmax(70px, 84px) 40px;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model tbody tr {
        grid-template-rows: auto auto;
        row-gap: 3px;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model tbody .pilot-flight-date-col {
        grid-column: 1;
        grid-row: 1 / span 2;
        align-self: center;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model tbody .site-cell {
        grid-column: 2;
        grid-row: 1;
        align-self: end;
        padding-top: 0;
        padding-bottom: 0;
        line-height: 1.2;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model tbody .model-col {
        grid-column: 2;
        grid-row: 2;
        display: block;
        align-self: start;
        overflow: hidden;
        padding-top: 0;
        padding-bottom: 0;
        color: var(--muted);
        font-size: var(--font-sm);
        line-height: 1.15;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model tbody .score-col {
        grid-column: 3;
        grid-row: 1 / span 2;
        align-self: center;
    }

    .pilot-profile-shell .pilot-flight-table--duration.pilot-flight-table--mobile-model tbody .duration-col {
        grid-column: 4;
        grid-row: 1 / span 2;
        align-self: center;
    }

    .pilot-profile-shell .pilot-flight-table--duration.pilot-flight-table--mobile-model tbody .meta-col,
    .pilot-profile-shell .pilot-flight-table--duration.pilot-flight-table--mobile-model tbody .track-cell {
        grid-column: 5;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model tbody .meta-col,
    .pilot-profile-shell .pilot-flight-table--mobile-model tbody .track-cell {
        grid-column: 4;
        grid-row: 1 / span 2;
        align-self: center;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model tbody .glider-icon-stack {
        display: none;
    }
}

@media (max-width: 620px) {
    .pilot-flight-table {
        --pilot-flight-grid: 76px minmax(0, 1fr) minmax(150px, 158px) 34px;
    }

    .pilot-profile-shell .pilot-flight-table {
        --pilot-flight-meta-width: clamp(30px, 7vw, 42px);
        --pilot-flight-grid: 76px minmax(0, 1fr) clamp(82px, 24vw, 92px) var(--pilot-flight-meta-width);
    }

    .pilot-profile-shell .pilot-flight-table tr {
        column-gap: clamp(5px, 1.5vw, 8px);
    }

    .pilot-profile-shell .pilot-flight-table .track-cell .row-actions {
        width: var(--pilot-flight-meta-width);
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model .track-cell .row-actions {
        justify-content: flex-start;
    }

    .pilot-profile-shell .pilot-flight-score-heading {
        width: 100%;
        padding-right: 0;
        text-align: right;
    }

    .pilot-profile-shell .pilot-flight-score {
        grid-template-columns: minmax(0, 1fr);
        width: 100%;
    }

    .pilot-profile-shell .pilot-flight-score__value {
        display: none;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model {
        --pilot-flight-grid: 76px minmax(0, 1fr) minmax(72px, 78px) var(--pilot-flight-meta-width);
    }

    .pilot-profile-shell .pilot-flight-table--duration.pilot-flight-table--mobile-model {
        --pilot-flight-grid: 76px minmax(0, 1fr) minmax(72px, 78px) minmax(54px, 64px) var(--pilot-flight-meta-width);
    }


    .pilot-profile-shell .pilot-flight-table--mobile-model .pilot-flight-score-heading-full {
        display: none;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model .pilot-flight-score-heading-compact {
        display: flex;
    }


    .pilot-profile-shell .pilot-flight-table--duration .duration-col {
        text-align: center;
    }

    .pilot-profile-shell .pilot-flight-table--duration .pilot-flight-duration-heading-full {
        display: none;
    }

    .pilot-profile-shell .pilot-flight-table--duration .pilot-flight-duration-heading-compact {
        display: block;
    }
    .pilot-profile-shell .pilot-flight-table--mobile-model .pilot-flight-score__main {
        justify-content: flex-end;
        gap: 5px;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model .pilot-flight-score__distance {
        flex: 0 0 auto;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model .pilot-flight-score__distance .score-unit {
        display: none;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model .pilot-flight-score__icon.score-icon {
        box-sizing: border-box;
        flex: 0 0 20px;
        width: 20px;
        height: 20px;
        margin-right: 0;
    }

    .pilot-flight-table tr {
        grid-template-columns: var(--pilot-flight-grid);
        grid-template-areas: none;
        align-items: center;
        column-gap: 0;
        min-height: 0;
        padding: 0 0;
    }

    .pilot-flight-table th,
    .pilot-flight-table td {
        display: block;
        min-width: 0;
        padding-right: 0;
        padding-left: 0;
        border-bottom: 0;
    }

    .pilot-flight-table .pilot-flight-date-col {
        grid-column: 1;
        grid-area: auto;
        align-self: center;
        width: auto;
    }

    .pilot-flight-table .site-cell {
        grid-column: 2;
        grid-area: auto;
        align-self: center;
    }

    .pilot-flight-table .score-col {
        grid-column: 3;
        grid-area: auto;
        align-self: center;
        width: auto;
        min-width: 0;
    }

    .pilot-flight-table .meta-col,
    .pilot-flight-table .track-cell {
        grid-column: 4;
        grid-area: auto;
        align-self: center;
        width: auto;
        min-width: 0;
    }

    .pilot-flight-table .model-col {
        display: none;
    }

    .pilot-flight-table .track-cell .row-actions {
        width: 34px;
        min-height: 0;
        align-items: center;
        justify-content: flex-end;
    }

    .pilot-flight-table .info-action {
        align-items: center;
        margin-top: 0;
    }

    .pilot-flight-table .score-icon {
        margin-top: 0;
    }
}

@media (max-width: 520px) {
    .pilot-profile-shell .pilot-flight-table--mobile-model {
        --pilot-flight-meta-width: 40px;
    }

    .pilot-profile-shell .pilot-flight-table--duration.pilot-flight-table--mobile-model {
        --pilot-flight-grid: 76px minmax(0, 1fr) minmax(72px, 78px) var(--pilot-flight-meta-width);
    }

    .pilot-profile-shell .pilot-flight-table--duration .duration-col {
        display: none;
    }

    .pilot-profile-shell .pilot-flight-table--duration.pilot-flight-table--mobile-model tbody .meta-col,
    .pilot-profile-shell .pilot-flight-table--duration.pilot-flight-table--mobile-model tbody .track-cell {
        grid-column: 4;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model .track-cell .row-actions {
        justify-content: flex-start;
        padding-right: 0;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model .private-flight-badge,
    .pilot-profile-shell .pilot-flight-table--mobile-model .comment-flight-badge {
        right: -16px;
    }

    .pilot-flight-table {
        --pilot-flight-grid: 76px minmax(0, 1fr) 92px 34px;
    }

    .pilot-flight-score-heading {
        width: auto;
        padding-right: 0;
        text-align: left;
    }

    .pilot-flight-score {
        grid-template-columns: minmax(0, 1fr);
        width: auto;
    }

    .pilot-flight-score__main {
        justify-content: flex-start;
    }

    .pilot-flight-score__value {
        display: none;
    }
}

.gliders-panel {
    display: grid;
    gap: 0;
    align-content: start;
    min-height: calc(100vh - 86px);
    overflow: hidden;
}

.gliders-search-toolbar {
    display: grid;
    grid-template-columns: minmax(220px, 0.72fr) minmax(0, 1.35fr);
    gap: 34px;
    align-items: center;
    padding: 18px 24px;
    border-bottom: 1px solid var(--panel-border);
    border-radius: 0;
    background: var(--panel);
}

.gliders-search-identity {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 13px;
}

.gliders-search-identity__icon {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    display: grid;
    place-items: center;
    border: 1px solid var(--avatar-border);
    border-radius: 50%;
    background: var(--avatar-bg);
}

.gliders-search-identity__icon .glider-icon-stack {
    width: 25px;
    height: 25px;
    flex-basis: 25px;
}

.gliders-search-identity__icon .glider-type-icon {
    width: 25px;
    height: 25px;
}

.gliders-search-identity__copy {
    min-width: 0;
}

.gliders-search-identity h1 {
    margin: 0 0 2px;
    color: var(--text);
    font-size: 1.55rem;
    line-height: 1.1;
}

.gliders-search-identity p {
    margin: 0;
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 600;
    line-height: 1.35;
}

.gliders-search-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--form-control-height);
    gap: 8px;
    align-items: end;
    width: 100%;
    margin: 0;
}

.gliders-search-field {
    display: grid;
    gap: 5px;
    min-width: 0;
    color: var(--filter-chip-label);
    font-size: var(--font-sm);
    font-weight: 700;
}

.gliders-search-field > span:first-child {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.gliders-search-submit {
    width: var(--form-control-height);
    min-height: var(--form-control-height);
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid var(--control-border);
    border-radius: var(--form-control-radius);
    background: var(--control-bg);
    cursor: pointer;
}

.gliders-search-submit:hover {
    border-color: var(--control-border-hover);
    background: var(--control-bg-hover);
}

.gliders-search-submit .ui-icon {
    width: 18px;
    height: 18px;
    opacity: 0.78;
}

.glider-results {
    min-height: 180px;
    padding: 14px 24px 28px;
}

.glider-results-empty {
    margin: 0;
    padding: 42px 20px;
    border: 1px dashed var(--line);
    border-radius: var(--radius-md);
    background: var(--content-subtle-bg);
    color: var(--muted);
    text-align: center;
}

.glider-results-empty-state {
    min-height: 420px;
    display: grid;
    place-content: center;
    justify-items: center;
    padding: 48px 24px;
    color: var(--muted);
    text-align: center;
}

.glider-results-empty-state__icon {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    margin-bottom: 14px;
    border: 1px solid var(--avatar-border);
    border-radius: 50%;
    background: var(--avatar-bg);
}

.glider-results-empty-state__icon .ui-icon {
    width: 22px;
    height: 22px;
    opacity: 0.72;
}

.glider-results-empty-state h2 {
    margin: 0 0 6px;
    color: var(--text);
    font-size: 1.35rem;
}

.glider-results-empty-state p {
    max-width: 430px;
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.5;
}

.glider-result-table-wrap {
    overflow-x: visible;
}

.glider-result-table {
    --glider-result-grid: 42px minmax(180px, 1.8fr) 64px minmax(86px, 0.7fr) minmax(105px, 0.9fr) minmax(90px, 0.7fr);
    width: 100%;
    display: block;
    border-collapse: separate;
}

.glider-result-table thead,
.glider-result-table tbody {
    display: block;
}

.glider-result-table tr {
    display: grid;
    grid-template-columns: var(--glider-result-grid);
    column-gap: 10px;
    align-items: center;
    border-bottom: 1px solid var(--line-soft);
}

.glider-result-table th {
    min-width: 0;
    padding: 0 0 9px;
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 700;
    letter-spacing: 0;
    text-align: left;
    text-transform: uppercase;
    white-space: nowrap;
}

.glider-result-table td {
    min-width: 0;
    padding: 9px 0;
    vertical-align: middle;
}

.glider-result-item {
    cursor: pointer;
    transition: background 140ms ease;
}

.glider-result-item:hover,
.glider-result-item:focus-visible {
    background: var(--row-hover);
}

.glider-result-item.is-selected {
    background: color-mix(in srgb, var(--blue) 7%, transparent);
}

.glider-result-item[aria-busy="true"] {
    cursor: progress;
    opacity: 0.72;
}

.glider-result-item:focus-visible {
    outline: 2px solid var(--focus-outline);
    outline-offset: -2px;
}

.glider-result-icon {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
}

.glider-result-main {
    display: grid;
    gap: 2px;
    min-width: 0;
    color: var(--text);
    text-decoration: none;
}

.glider-result-main strong,
.glider-result-main span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.glider-result-main span {
    color: var(--muted);
    font-size: var(--font-sm);
}

.glider-result-mobile-meta,
.glider-result-mobile-activity {
    display: none;
}

.glider-result-table .glider-result-icon-col {
    width: auto;
}

.glider-result-table .glider-result-year-col {
    width: auto;
    text-align: center;
}

.glider-result-table .glider-result-certificate-col {
    width: auto;
}

.glider-result-table .glider-result-class-col {
    width: auto;
}

.glider-result-table .glider-result-flights-col {
    width: auto;
    text-align: right;
    white-space: nowrap;
}

.glider-result-certificate-col,
.glider-result-class-col {
    color: var(--muted);
    font-size: var(--font-sm);
}

.glider-result-certificate-col,
.glider-result-class-col {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.glider-result-flights-col strong {
    color: var(--text);
    font-size: var(--font-sm);
}

.glider-result-table .glider-result-year-col,
.glider-result-table .glider-result-flights-col {
    font-variant-numeric: tabular-nums;
}

.glider-result-table .glider-result-certificate-col,
.glider-result-table .glider-result-class-col {
    min-width: 0;
}

.glider-result-table .glider-result-certificate-col:not(th),
.glider-result-table .glider-result-class-col:not(th) {
    min-width: 0;
    line-height: 1.25;
}

.glider-results-footer {
    display: flex;
    justify-content: center;
    padding: 14px 0 2px;
}

.glider-results-more {
    min-height: var(--control-height-md);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 16px;
    border: 1px solid var(--control-border);
    border-radius: var(--radius-md);
    background: var(--control-bg);
    color: var(--text);
    font-weight: 750;
    text-decoration: none;
}

.glider-results-more:hover,
.glider-results-more:focus-visible {
    border-color: var(--control-border-hover);
    background: var(--control-bg-hover);
    text-decoration: none;
}

.glider-results-truncated {
    margin: 12px 0 0;
    padding: 11px 13px;
    border-radius: var(--radius-md);
    background: var(--content-subtle-bg);
    color: var(--muted);
    text-align: center;
}

.gliders-results-surface {
    min-width: 0;
}

.glider-workspace,
.glider-profile-host,
.glider-profile-view {
    min-width: 0;
}

.gliders-search-toolbar[hidden],
.glider-profile-host[hidden],
.gliders-results-surface[hidden],
.glider-result-navigation[hidden],
.glider-workspace-error[hidden] {
    display: none;
}

.glider-profile-view {
    display: grid;
    gap: 0;
    align-content: start;
}

.glider-workspace-error {
    margin: 0 0 var(--panel-gap);
    padding: 11px 13px;
    border: 1px solid #f1c8c3;
    border-radius: var(--radius-md);
    background: #fff7f6;
    color: #8f1d16;
}

.glider-profile-context {
    min-width: 0;
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 0 18px;
    border-bottom: 1px solid var(--panel-border);
    background: var(--panel);
}

.glider-results-back {
    min-width: 0;
    max-width: 100%;
}

.glider-results-back span {
    overflow: hidden;
    text-overflow: ellipsis;
}

.glider-results-back-label-compact {
    display: none;
}

.glider-results-back .ui-icon {
    width: 16px;
    height: 16px;
}

.glider-result-navigation {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
    margin-left: auto;
}

.glider-result-step .ui-icon {
    width: 16px;
    height: 16px;
}

.glider-result-step:disabled {
    opacity: 0.38;
    cursor: default;
    pointer-events: none;
}

.glider-result-position {
    min-width: 58px;
    color: var(--muted);
    font-size: var(--font-sm);
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    text-align: center;
    white-space: nowrap;
}

.glider-workspace[aria-busy="true"] .glider-result-navigation {
    opacity: 0.65;
    pointer-events: none;
}

.glider-profile {
    display: grid;
    gap: 0;
    align-content: start;
    container-name: glider-profile;
    container-type: inline-size;
}

.glider-profile-header {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
    padding: 20px 24px 17px;
    border: 0;
    border-radius: 0;
    background: var(--panel);
}

.glider-profile-icon {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    border: 1px solid var(--avatar-border);
    border-radius: 50%;
    background: var(--avatar-bg);
}

.glider-profile-icon .glider-type-icon {
    width: 28px;
    height: 28px;
}

.glider-profile-icon .glider-icon-stack {
    width: 32px;
    height: 28px;
    flex-basis: 32px;
}

.glider-profile-icon .glider-certificate-group-icon {
    width: 7px;
    height: 19px;
}

.glider-profile-title {
    min-width: 0;
}

.glider-profile-title p {
    margin: 0 0 2px;
    color: var(--muted);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.glider-profile-title h1 {
    margin: 0;
    overflow-wrap: anywhere;
    font-size: clamp(1.55rem, 2vw, 1.85rem);
    line-height: 1.12;
}

.glider-profile-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 7px;
}

.glider-profile-badges span {
    padding: 3px 8px;
    border: 1px solid var(--badge-border);
    border-radius: 999px;
    background: var(--badge-bg);
    color: var(--badge-text);
    font-size: var(--font-sm);
    font-weight: 700;
}

.glider-tabs-bar {
    border-top: 1px solid var(--line-soft);
    border-bottom: 1px solid var(--panel-border);
}

.pilot-profile-tab-icon--pilots {
    mask-image: url("/icons/ui/user-check.svg");
    -webkit-mask-image: url("/icons/ui/user-check.svg");
}

.glider-info-overview,
.glider-stats-grid {
    display: grid;
    gap: var(--panel-gap);
}

.glider-facts-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.glider-fact-icon--manufacturer {
    --site-icon: url("/icons/ui/layers.svg");
}

.glider-fact-icon--model,
.glider-fact-icon--type {
    --site-icon: url("/icons/ui/plane.svg");
}

.glider-fact-icon--year,
.glider-fact-icon--period {
    --site-icon: url("/icons/ui/calendar-days.svg");
}

.glider-fact-icon--certificate,
.glider-fact-icon--class {
    --site-icon: url("/icons/ui/shield-check.svg");
}

.glider-fact-icon--distance {
    --site-icon: url("/icons/ui/ruler-dimension-line.svg");
}

.glider-fact-icon--best {
    --site-icon: url("/icons/ui/trophy.svg");
}

.glider-fact-icon--duration {
    --site-icon: url("/icons/ui/clock.svg");
}

@media (max-width: 520px) {
    .pilot-profile-shell .pilot-flight-table--mobile-model tbody tr {
        align-items: start;
        padding-top: 2px;
        padding-bottom: 2px;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model tbody .pilot-flight-date-col,
    .pilot-profile-shell .pilot-flight-table--mobile-model tbody .site-cell,
    .pilot-profile-shell .pilot-flight-table--mobile-model tbody .score-col,
    .pilot-profile-shell .pilot-flight-table--mobile-model tbody .meta-col,
    .pilot-profile-shell .pilot-flight-table--mobile-model tbody .track-cell {
        align-self: start;
        padding-top: 0;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model .pilot-flight-score__main {
        align-items: start;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model .track-cell .row-actions {
        align-items: flex-start;
    }

    .pilot-profile-shell .pilot-flight-table--mobile-model .info-action {
        align-items: flex-start;
        margin-top: 0;
    }
}
.glider-stats-table-wrap {
    overflow-x: auto;
    border:0;
    background: var(--panel);
}

.glider-stats-table {
    width: 100%;
    min-width: 620px;
    border-collapse: collapse;
}

.glider-stats-table th,
.glider-stats-table td {
    padding: 10px 11px;
    border-bottom: 1px solid var(--line-soft);
    text-align: left;
}

.glider-stats-table th {
    color: var(--table-header-text);
    font-size: var(--font-sm);
    font-weight: 700;
}

.glider-stats-table td:not(:first-child) {
    white-space: nowrap;
}

.glider-stats-table tbody tr:last-child td {
    border-bottom: 0;
}

.glider-flight-table {
    --pilot-flight-grid: minmax(130px, 0.95fr) minmax(168px, 196px) minmax(130px, 1.15fr) minmax(82px, 0.55fr) 40px;
}

.glider-flight-pilot-col,
.glider-flight-pilot-name {
    min-width: 0;
}

.glider-flight-pilot-name {
    display: block;
    overflow: hidden;
    color: var(--text);
    font-weight: 400;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.glider-pilot-usage-table {
    --pilot-flight-grid: minmax(180px, 1fr) 100px minmax(120px, 160px);
}

.glider-pilot-usage-table .glider-pilot-flights-col,
.glider-pilot-usage-table .glider-pilot-max-col {
    text-align: right;
    white-space: nowrap;
}

.glider-pilot-identity {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 10px;
}

.glider-pilot-name {
    min-width: 0;
    overflow: hidden;
    color: var(--text);
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.glider-pilot-heading-compact {
    display: none;
}

@media (min-width: 761px) and (min-height: 640px) {
    .gliders-body--results .topbar {
        position: sticky;
        top: 0;
        z-index: var(--z-topbar);
    }

    .gliders-body--results .gliders-panel {
        --gliders-topbar-height: 52px;
        overflow: clip;
    }

    .gliders-body--results .gliders-search-toolbar {
        position: sticky;
        z-index: var(--z-page-sticky);
        top: calc(var(--gliders-topbar-height) + var(--page-shell-padding-block));
        outline: var(--panel-gap) solid var(--page-shell-bg);
        box-shadow: 0 6px 14px -12px rgba(15, 54, 92, 0.55);
    }

}

@media (max-width: 760px) {
    .gliders-search-toolbar {
        grid-template-columns: minmax(0, 1fr);
        gap: 6px;
        padding: 8px 10px 10px;
    }

    .gliders-search-identity {
        gap: 0;
    }

    .gliders-search-identity__icon {
        display: none;
    }

    .gliders-search-identity h1 {
        margin: 0;
        font-size: 1.08rem;
        white-space: nowrap;
    }

    .gliders-search-form {
        grid-template-columns: minmax(0, 1fr) 40px;
        gap: 6px;
    }

    .gliders-search-submit {
        width: 40px;
        min-height: 40px;
    }

    .glider-profile-context {
        min-height: 44px;
        padding: 0 8px;
    }

    .glider-tabs-bar {
        padding-top: 0;
        padding-bottom: 0;
    }

    .glider-results-back {
        width: auto;
        padding: 0 10px;
    }

    .glider-results-back .glider-results-back-label-full {
        display: none;
    }

    .glider-results-back .glider-results-back-label-compact {
        display: inline;
    }

    .glider-results {
        padding: 6px 8px 16px;
    }

    .glider-results-empty-state {
        min-height: 260px;
        padding: 32px 16px;
    }

    .glider-result-table-wrap {
        overflow: visible;
    }

    .glider-result-table thead {
        display: none;
    }

    .glider-result-table tbody {
        display: block;
    }

    .glider-result-table .glider-result-item {
        display: grid;
        grid-template-columns: 34px minmax(0, 1fr);
        grid-template-areas: "icon main";
        align-items: center;
        gap: 9px;
        min-height: 0;
        padding: 0;
        border-bottom: 1px solid var(--line-soft);
    }

    .glider-result-table td {
        width: auto;
        height: auto;
        min-width: 0;
        padding: 9px 0;
        border: 0;
        text-align: left;
    }

    .glider-result-table .glider-result-icon-col {
        grid-area: icon;
        width: auto;
    }

    .glider-result-table .glider-result-main-col {
        grid-area: main;
        display: grid;
        gap: 4px;
    }

    .glider-result-table td.glider-result-year-col,
    .glider-result-table td.glider-result-certificate-col,
    .glider-result-table td.glider-result-class-col,
    .glider-result-table td.glider-result-flights-col {
        display: none;
    }

    .glider-result-mobile-meta {
        display: flex;
        align-items: center;
        flex-wrap: nowrap;
        min-width: 0;
        overflow: hidden;
        color: var(--muted);
        font-size: 0.76rem;
        line-height: 1.25;
    }

    .glider-result-mobile-activity {
        flex: 0 0 auto;
        display: inline-flex;
        align-items: center;
    }

    .glider-result-mobile-meta > span + span::before {
        content: "\00b7";
        margin: 0 7px;
        color: var(--muted);
    }

    .glider-result-mobile-meta > span,
    .glider-result-mobile-activity strong {
        white-space: nowrap;
    }

    .glider-result-mobile-class {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .glider-result-mobile-activity strong {
        color: var(--text);
        font-size: 0.78rem;
    }

}

@media (max-width: 700px) {
    .glider-flight-table {
        --pilot-flight-grid: minmax(100px, 1fr) minmax(72px, 78px) minmax(100px, 1fr) 74px 34px;
    }

    .glider-flight-table tr {
        grid-template-areas: none;
        grid-template-columns: var(--pilot-flight-grid);
        column-gap: 6px;
    }

    .glider-flight-table .site-pilot-cell {
        grid-column: 1;
    }

    .glider-flight-table .score-col {
        grid-column: 2;
    }

    .glider-flight-table .site-cell {
        grid-column: 3;
    }

    .glider-flight-table .pilot-flight-date-col {
        grid-column: 4;
    }

    .glider-flight-table .meta-col,
    .glider-flight-table .track-cell {
        grid-column: 5;
    }

    .glider-flight-table .pilot-flight-score {
        grid-template-columns: minmax(0, 1fr);
        width: 100%;
    }

    .glider-flight-table .pilot-flight-score__main {
        justify-content: flex-end;
        gap: 5px;
    }

    .glider-flight-table .pilot-flight-score__distance .score-unit {
        display: none;
    }

    .glider-flight-table .pilot-flight-score__icon.score-icon {
        box-sizing: border-box;
        flex: 0 0 20px;
        width: 20px;
        height: 20px;
        margin-right: 0;
    }

    .glider-flight-table .pilot-flight-score__value {
        display: none;
    }

    .glider-flight-table .pilot-flight-score-heading {
        width: 100%;
        padding-right: 0;
        text-align: right;
    }

    .glider-flight-table .pilot-flight-score-heading-full {
        display: none;
    }

    .glider-flight-table .pilot-flight-score-heading-compact {
        display: flex;
    }

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

    .glider-profile-header {
        grid-template-columns: 44px minmax(0, 1fr);
        gap: 10px;
        padding: 8px 10px;
    }

    .glider-profile-icon {
        width: 44px;
        height: 44px;
    }

    .glider-profile-icon .glider-type-icon {
        width: 24px;
        height: 24px;
    }

    .glider-profile-icon .glider-icon-stack {
        width: 28px;
        height: 24px;
        flex-basis: 28px;
    }

    .glider-profile-icon .glider-certificate-group-icon {
        width: 6px;
        height: 17px;
    }

    .glider-profile-badges {
        gap: 4px;
        margin-top: 4px;
    }

    .glider-profile-badges span {
        padding: 2px 7px;
        font-size: 0.72rem;
    }
}

@media (max-width: 620px) {
    .gliders-search-toolbar {
        gap: 6px;
        padding: 8px 10px;
    }

    .glider-pilot-usage-table {
        --pilot-flight-grid: minmax(0, 1fr) 64px minmax(86px, 100px);
    }

    .glider-pilot-usage-table tr {
        column-gap: 8px;
    }
}

@media (max-width: 520px) {
    .glider-result-step > span {
        display: none;
    }

    .glider-flight-table tbody tr {
        align-items: start;
        padding-top: 2px;
        padding-bottom: 2px;
    }

    .glider-flight-table tbody .site-pilot-cell,
    .glider-flight-table tbody .score-col,
    .glider-flight-table tbody .site-cell,
    .glider-flight-table tbody .pilot-flight-date-col,
    .glider-flight-table tbody .meta-col,
    .glider-flight-table tbody .track-cell {
        align-self: start;
        padding-top: 0;
    }

    .glider-flight-table .pilot-flight-score__main {
        align-items: start;
    }

    .glider-flight-table .track-cell .row-actions,
    .glider-flight-table .info-action {
        align-items: flex-start;
    }
}

@media (max-width: 460px) {
    .glider-flight-table {
        --pilot-flight-grid: minmax(0, 1.15fr) minmax(68px, 74px) minmax(0, 1fr) 34px;
    }

    .glider-flight-table thead tr {
        grid-template-rows: auto;
    }

    .glider-flight-table tbody tr {
        grid-template-rows: auto auto;
        row-gap: 3px;
    }

    .glider-flight-table thead .site-pilot-cell,
    .glider-flight-table tbody .site-pilot-cell {
        grid-column: 1;
    }

    .glider-flight-table tbody .site-pilot-cell {
        grid-row: 1 / span 2;
    }

    .glider-flight-table thead .score-col,
    .glider-flight-table tbody .score-col {
        grid-column: 2;
    }

    .glider-flight-table tbody .score-col {
        grid-row: 1 / span 2;
    }

    .glider-flight-table thead .site-cell,
    .glider-flight-table tbody .site-cell {
        grid-column: 3;
    }

    .glider-flight-table tbody .site-cell {
        grid-row: 1;
        align-self: end;
        padding-bottom: 0;
        line-height: 1.2;
    }

    .glider-flight-table thead .pilot-flight-date-col {
        display: none;
    }

    .glider-flight-table tbody .pilot-flight-date-col {
        grid-column: 3;
        grid-row: 2;
        display: block;
        padding-bottom: 0;
        color: var(--muted);
        font-size: var(--font-sm);
        line-height: 1.15;
    }

    .glider-flight-table tbody .pilot-flight-date {
        color: var(--muted);
    }

    .glider-flight-table thead .meta-col,
    .glider-flight-table tbody .meta-col,
    .glider-flight-table tbody .track-cell {
        grid-column: 4;
    }

    .glider-flight-table tbody .meta-col,
    .glider-flight-table tbody .track-cell {
        grid-row: 1 / span 2;
    }

    .glider-pilot-usage-table {
        --pilot-flight-grid: minmax(0, 1fr) 54px minmax(72px, 82px);
    }

    .glider-pilot-usage-table .flight-row-avatar,
    .glider-pilot-usage-table .flight-row-avatar-image {
        width: 36px;
        height: 36px;
    }

    .glider-pilot-identity {
        gap: 8px;
    }

    .glider-pilot-heading-full {
        display: none;
    }

    .glider-pilot-heading-compact {
        display: inline;
    }

    .glider-facts-list {
        grid-template-columns: minmax(0, 1fr);
    }

    .glider-profile-title h1 {
        font-size: 1.38rem;
    }
}

.team-panel {
    min-height: calc(100vh - 86px);
    overflow: hidden;
}

.team-profile {
    container-name: team-profile;
    container-type: inline-size;
}

.team-selector-form {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(150px, 210px) minmax(260px, 1fr);
    align-items: start;
    gap: 10px;
    margin-bottom: 20px;
    text-align: left;
}

.team-selector-field {
    min-width: 0;
    display: grid;
    color: var(--filter-chip-label);
    font-size: var(--font-sm);
    font-weight: 700;
}

.team-selector-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.team-selector-field select {
    font-weight: 700;
}

.team-selector-field .form-control,
.team-selector-field .autocomplete input[data-autocomplete-input] {
    background: rgba(255, 255, 255, .80);
    transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.team-selector-field:focus-within .form-control,
.team-selector-field:focus-within .autocomplete input[data-autocomplete-input] {
    background: #fff;
}

.team-empty {
    display: grid;
    place-content: center;
    min-height: 360px;
    padding: 28px;
    background: var(--content-subtle-bg);
    text-align: center;
}

.team-empty h2 {
    margin: 0 0 8px;
    color: var(--blue-dark);
    font-size: 1.35rem;
}

.team-empty p {
    max-width: 440px;
    margin: 0 auto;
    color: var(--muted);
    font-weight: 700;
}

.team-profile-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) min(300px, 38vw);
    gap: 24px;
    align-items: start;
    padding: 20px 24px;
    border-bottom: 1px solid var(--line-soft);
    background: url("/img/team/hero-team.jpg");
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}

.team-profile-header--empty {
    grid-template-columns: minmax(0, 1fr);
}

.team-profile-header--empty .team-selector-form {
    margin-bottom: 0;
}

.team-profile-avatar {
    position: relative;
    background: rgba(255, 255, 255, .4);
    border-radius: var(--radius-md);
    backdrop-filter: blur(2px);
    width: 100%;
    max-width: 250px;
    aspect-ratio: 1;
    overflow: hidden;
    justify-self: end;
}

.team-profile-avatar img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    object-fit: scale-down;
    object-position: center;
}

.team-profile-title {
    min-width: 0;
}

.team-profile-identity {
    width: 100%;
    max-width: 100%;
    padding: 10px 14px;
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, .4);
    -webkit-backdrop-filter: blur(7px);
    backdrop-filter: blur(7px);
    box-shadow: 0 4px 14px rgba(22, 48, 68, .10);
}

.team-profile-title h1 {
    margin: 0;
    overflow-wrap: anywhere;
    color: var(--blue-dark);
    font-size: clamp(1.55rem, 2vw, 2.1rem);
    line-height: 1.12;
}

.team-profile-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 9px;
}

.team-profile-badges span {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    padding: 3px 8px;
    border: 1px solid var(--badge-border);
    border-radius: 999px;
    background: var(--badge-bg);
    color: var(--badge-text);
    font-size: var(--font-sm);
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.team-profile-website {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    padding: 3px 8px;
    border: 1px solid var(--badge-border);
    border-radius: 999px;
    background: var(--badge-bg);
    color: var(--badge-text);
    font-size: var(--font-sm);
    font-weight: 700;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-overflow: ellipsis;
    text-underline-offset: 3px;
    white-space: nowrap;
}

.team-info-overview,
.team-stats-grid {
    display: grid;
    gap: var(--panel-gap);
}



.team-facts-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.team-fact-icon--members,
.team-fact-icon--active {
    --site-icon: url("/icons/ui/user-check.svg");
}

.team-fact-icon--flights {
    --site-icon: url("/icons/ui/plane.svg");
}

.team-fact-icon--duration {
    --site-icon: url("/icons/ui/clock.svg");
}

.team-fact-icon--period {
    --site-icon: url("/icons/ui/calendar-days.svg");
}

.team-fact-icon--distance {
    --site-icon: url("/icons/ui/ruler-dimension-line.svg");
}

.team-stats-table {
    min-width: 720px;
    font-variant-numeric: tabular-nums;
}

.team-stats-table th:not(:first-child),
.team-stats-table td:not(:first-child) {
    text-align: right;
}

.team-stats-total-row td {
    border-top: 2px solid var(--line);
    border-bottom: 0;
    font-weight: 700;
}

.team-stats-cell-compact {
    display: none;
}

.team-pilots-table {
    --pilot-flight-grid: minmax(180px, 1fr) 112px minmax(120px, 140px);
}

.team-pilots-table .team-pilot-name-col {
    min-width: 0;
}

.team-pilots-table .team-pilot-flights-col,
.team-pilots-table .team-pilot-period-col {
    text-align: right;
    white-space: nowrap;
}

.team-pilots-table th.team-pilot-flights-col .sort-link,
.team-pilots-table th.team-pilot-period-col .sort-link {
    width: 100%;
    justify-content: flex-end;
}

.team-pilots-table th.team-pilot-period-col .sort-link {
    margin-right: 0;
    padding-right: 0;
}

.team-pilots-table button.sort-link {
    border: 0;
    background: transparent;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.team-pilot-identity {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 10px;
}

.team-pilots-table tbody tr.team-pilot-row {
    cursor: pointer;
    transition: background-color 140ms ease;
}

.team-pilots-table tbody tr.team-pilot-row:hover {
    background: var(--row-hover);
}

.team-pilots-table tbody tr.team-pilot-row:focus-visible {
    outline: 2px solid var(--focus-outline);
    outline-offset: -2px;
}

.team-pilot-identity .flight-row-avatar {
    flex: 0 0 auto;
}

.team-pilot-name {
    min-width: 0;
    overflow: hidden;
    color: var(--text);
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.team-pilot-period-compact {
    display: none;
}

.team-flight-table {
    --pilot-flight-grid: minmax(130px, 0.95fr) minmax(168px, 196px) minmax(130px, 1.15fr) minmax(82px, 0.55fr) 40px;
}

.team-flight-table .site-cell a,
.team-flight-table .site-pilot-cell a {
    color: var(--pilot-identity-link);
}

.team-flight-table .track-cell .row-actions {
    width: 34px;
    justify-content: flex-start;
}

.team-flight-table .meta-col {
    text-align: left;
}

@container (max-width: 820px) {
    .team-selector-form {
        grid-template-columns: minmax(0, 1fr);
    }

    .team-stats-table thead .team-stats-cell-full {
        display: none;
    }

    .team-stats-table thead .team-stats-cell-compact {
        display: inline;
    }

    .team-stats-table {
        min-width: 0;
        table-layout: fixed;
    }

    .team-stats-table th,
    .team-stats-table td {
        padding: 8px 5px;
    }

    .team-stats-table th {
        font-size: 0.74rem;
        line-height: 1.15;
        vertical-align: bottom;
    }

    .team-stats-table td {
        font-size: 0.82rem;
    }

    .team-stats-table .team-stats-year-col {
        width: 52px;
    }

    .team-stats-table .team-stats-pilots-col {
        width: 50px;
    }

    .team-stats-table .team-stats-flights-col {
        width: 54px;
    }
}

@media (max-width: 820px) {
    .team-facts-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .team-selector-form {
        margin-bottom: 16px;
    }

    .team-profile-header {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
        padding: 16px 13px;
    }

    .team-profile-avatar {
        aspect-ratio: auto;
        width: 100%;
        height: min(250px, 100vw);
        justify-self: center;
        max-width: 100%;
    }

    .team-profile-title {
        text-align: center;
    }

    .team-profile-badges {
        justify-content: center;
    }

    .team-pilots-table {
        --pilot-flight-grid: minmax(0, 1fr) 64px minmax(86px, 100px);
    }

    .team-pilots-table tr {
        column-gap: 8px;
    }

}

@container team-profile (max-width: 700px) {
    .team-flight-table {
        --pilot-flight-grid: minmax(100px, 1fr) minmax(72px, 78px) minmax(100px, 1fr) 74px 34px;
        min-width: 0;
    }

    .team-flight-table tr {
        grid-template-areas: none;
        grid-template-columns: var(--pilot-flight-grid);
        column-gap: 6px;
    }

    .team-flight-table .site-pilot-cell {
        grid-column: 1;
    }

    .team-flight-table .score-col {
        grid-column: 2;
    }

    .team-flight-table .site-cell {
        grid-column: 3;
    }

    .team-flight-table .pilot-flight-date-col {
        grid-column: 4;
    }

    .team-flight-table .meta-col,
    .team-flight-table .track-cell {
        grid-column: 5;
    }

    .team-flight-table .pilot-flight-score {
        grid-template-columns: minmax(0, 1fr);
        width: 100%;
    }

    .team-flight-table .pilot-flight-score__main {
        justify-content: flex-end;
        gap: 5px;
    }

    .team-flight-table .pilot-flight-score__distance {
        flex: 0 0 auto;
    }

    .team-flight-table .pilot-flight-score__distance .score-unit {
        display: none;
    }

    .team-flight-table .pilot-flight-score__icon.score-icon {
        box-sizing: border-box;
        flex: 0 0 20px;
        width: 20px;
        height: 20px;
        margin-right: 0;
    }

    .team-flight-table .pilot-flight-score__value {
        display: none;
    }

    .team-flight-table .pilot-flight-score-heading {
        width: 100%;
        padding-right: 0;
        text-align: right;
    }

    .team-flight-table .pilot-flight-score-heading-full {
        display: none;
    }

    .team-flight-table .pilot-flight-score-heading-compact {
        display: flex;
    }

}

@container (max-width: 700px) {
    .team-stats-cell-full {
        display: none;
    }

    .team-stats-cell-compact {
        display: inline;
    }
}

@container team-profile (max-width: 460px) {
    .team-flight-table {
        --pilot-flight-grid: minmax(0, 1.15fr) minmax(68px, 74px) minmax(0, 1fr) 34px;
    }

    .team-flight-table thead tr {
        grid-template-rows: auto;
    }

    .team-flight-table tbody tr {
        grid-template-rows: auto auto;
        row-gap: 3px;
    }

    .team-flight-table tbody .site-pilot-cell {
        grid-column: 1;
        grid-row: 1 / span 2;
        align-self: center;
    }

    .team-flight-table tbody .score-col {
        grid-column: 2;
        grid-row: 1 / span 2;
        align-self: center;
    }

    .team-flight-table tbody .site-cell {
        grid-column: 3;
        grid-row: 1;
        align-self: end;
        padding-top: 0;
        padding-bottom: 0;
        line-height: 1.2;
    }

    .team-flight-table thead .pilot-flight-date-col {
        display: none;
    }

    .team-flight-table tbody .pilot-flight-date-col {
        grid-column: 3;
        grid-row: 2;
        display: block;
        align-self: start;
        padding-top: 0;
        padding-bottom: 0;
        color: var(--muted);
        font-size: var(--font-sm);
        line-height: 1.15;
    }

    .team-flight-table tbody .pilot-flight-date {
        color: var(--muted);
    }

    .team-flight-table tbody .meta-col,
    .team-flight-table tbody .track-cell {
        grid-column: 4;
        grid-row: 1 / span 2;
        align-self: center;
    }
}

@container team-profile (max-width: 520px) {
    .team-flight-table tbody tr {
        align-items: start;
        padding-top: 2px;
        padding-bottom: 2px;
    }

    .team-flight-table tbody .site-pilot-cell,
    .team-flight-table tbody .score-col,
    .team-flight-table tbody .site-cell,
    .team-flight-table tbody .pilot-flight-date-col,
    .team-flight-table tbody .meta-col,
    .team-flight-table tbody .track-cell {
        align-self: start;
        padding-top: 0;
    }

    .team-flight-table .pilot-flight-score__main {
        align-items: start;
    }

    .team-flight-table .track-cell .row-actions {
        align-items: flex-start;
    }

    .team-flight-table .info-action {
        align-items: flex-start;
        margin-top: 0;
    }
}
@media (max-width: 460px) {
    .team-stats-table-wrap {
        margin-right: -8px;
        margin-left: -8px;
    }

    .team-stats-table th,
    .team-stats-table td {
        padding-right: 3px;
        padding-left: 3px;
    }

    .team-stats-table th {
        font-size: 0.7rem;
    }

    .team-stats-table td {
        font-size: 0.78rem;
    }

    .team-stats-table .team-stats-year-col {
        width: 43px;
    }

    .team-stats-table .team-stats-pilots-col {
        width: 45px;
    }

    .team-stats-table .team-stats-flights-col {
        width: 48px;
    }

    .team-pilots-table-wrap {
        margin-right: -8px;
        margin-left: -8px;
        border-right: 0;
        border-left: 0;
        border-radius: 0;
    }

    .team-facts-list {
        grid-template-columns: minmax(0, 1fr);
    }

    .team-profile-title h1 {
        font-size: 1.38rem;
    }

    .team-pilots-table th,
    .team-pilots-table td {
        padding-right: 6px;
        padding-left: 6px;
    }

    .team-pilots-table {
        --pilot-flight-grid: minmax(0, 1fr) 54px minmax(72px, 82px);
    }

    .team-pilot-period-full {
        display: none;
    }

    .team-pilot-period-compact {
        display: inline;
    }

    .team-pilot-identity {
        gap: 8px;
    }

    .team-pilots-table .flight-row-avatar,
    .team-pilots-table .flight-row-avatar-image {
        width: 36px;
        height: 36px;
    }
}

.ranking-page {
    --page-max-width: 1180px;
}

.ranking-panel {
    gap: 0;
    overflow: hidden;
}

.ranking-heading {
    --ranking-heading-copy-offset: 73px;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto minmax(0, 1fr);
    align-items: start;
    gap: 12px;
    min-height: 230px;
    padding: 24px 28px;
    border-bottom: 1px solid var(--line-soft);
    background-image: url("/img/hero-rankings.jpg");
    background-position: right 24%;
    background-size: cover;
    background-repeat: no-repeat;
}

.ranking-heading__identity {
    display: flex;
    align-items: center;
    align-self: start;
    gap: 13px;
    width: fit-content;
    max-width: 100%;
    min-width: 270px;
    padding: 10px 14px;
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.3);
    -webkit-backdrop-filter: blur(7px);
    backdrop-filter: blur(7px);
    box-shadow: 0 4px 14px rgba(22, 48, 68, 0.1);
}

.ranking-heading__icon {
    width: 46px;
    height: 46px;
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid #f0cf96;
    border-radius: 50%;
    background: linear-gradient(145deg, #fffaf0, #ffe7bd);
    color: #a85b0c;
    box-shadow: 0 5px 14px rgba(168, 91, 12, 0.13);
}

.ranking-heading__icon .ui-icon {
    width: 23px;
    height: 23px;
}

.ranking-heading h1 {
    letter-spacing: -0.025em;
}

.ranking-heading p {
    margin-top: 4px;
    font-weight: 700;
}

.ranking-scope-bar {
    --filter-scroll-surface: #f7fafc;
    --ranking-scope-fade-width: 24px;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: center;
    align-self: end;
    width: calc(100% + 56px);
    margin: 0 -28px -24px;
    padding: 10px 20px;
    background: transparent;
}

.ranking-scope-bar .active-filter-scroll {
    column-gap: 6px;
}

.ranking-scope-bar .filter-scroll-button::after {
    display: none;
}

.ranking-scope-bar .active-filter-scroll.has-overflow:not(.at-start):not(.at-end) .active-filter-strip {
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 var(--ranking-scope-fade-width), #000 calc(100% - var(--ranking-scope-fade-width)), transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 var(--ranking-scope-fade-width), #000 calc(100% - var(--ranking-scope-fade-width)), transparent 100%);
}

.ranking-scope-bar .active-filter-scroll.has-overflow.at-start:not(.at-end) .active-filter-strip {
    -webkit-mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - var(--ranking-scope-fade-width)), transparent 100%);
    mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - var(--ranking-scope-fade-width)), transparent 100%);
}

.ranking-scope-bar .active-filter-scroll.has-overflow.at-end:not(.at-start) .active-filter-strip {
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 var(--ranking-scope-fade-width), #000 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 var(--ranking-scope-fade-width), #000 100%);
}

.ranking-scope-bar .filter-chip {
    min-height: 34px;
    padding: 0 12px;
    border-color: #d4e0e9;
    background: #fff;
    box-shadow: none;
}

.ranking-scope-bar .filter-chip:hover {
    border-color: var(--control-border-hover);
    background: var(--control-bg-hover);
}

.ranking-scope-bar .filter-chip.is-active {
    border-color: #e3a15a;
    background: var(--accent);
    color: #fff;
    box-shadow: inset 0 0 0 1px rgba(227, 161, 90, 0.16);
}

.ranking-scope-bar .filter-chip.is-active .filter-chip__value {
    color: #fff;
}

.ranking-filter-form {
    position: relative;
    z-index: 1;
    display: grid;
    justify-self: start;
    align-self: start;
    width: min(270px, calc(100% - var(--ranking-heading-copy-offset)));
    gap: 7px;
    min-width: 0;
}

.ranking-filter-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.ranking-filter-label .ui-icon {
    width: 16px;
    height: 16px;
}

.ranking-country-control {
    position: relative;
    display: block;
    width: 100%;
    min-width: 0;
}

.ranking-country-select {
    width: 100%;
    min-width: 0;
    max-width: none;
    min-height: 42px;
    border: 1px solid var(--control-border);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.9);
    color: var(--text);
    padding: 0 34px 0 11px;
    font: inherit;
    font-weight: 750;
    box-shadow: var(--shadow-control);
}

.ranking-country-select:hover {
    border-color: var(--control-border-hover);
    background: var(--control-bg-hover);
}

.ranking-country-select:focus-visible {
    border-color: var(--accent);
    outline: none;
    box-shadow: var(--focus-ring);
}

.ranking-period-scroll {
    min-width: 0;
}

.ranking-history,
.ranking-results {
    min-width: 0;
}

.ranking-results {
    transition: opacity 120ms ease;
}

.ranking-results.htmx-request {
    opacity: 0.58;
    pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
    .ranking-results {
        transition: none;
    }
}

.ranking-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    padding: 18px;
    background: #f4f7fa;
}

.ranking-card {
    --ranking-card-accent: #2e86c1;
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 254px;
    overflow: hidden;
    padding: 0;
    border: 1px solid #e2e8ee;
    border-radius: 12px;
    background: #fff;
    color: var(--text);
    font: inherit;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 2px 9px rgba(15, 54, 92, 0.045);
    transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.ranking-card--flights-100-km-distinct-sites,
.ranking-card--distinct-sites {
    --ranking-card-accent: #319764;
}

.ranking-card--air-time {
    --ranking-card-accent: #7165b7;
}

.ranking-card--distance {
    --ranking-card-accent: #d77b2b;
}

.ranking-card--likes {
    --ranking-card-accent: #cf4f69;
}

.ranking-card--site-records,
.ranking-card--winner-of-the-day {
    --ranking-card-accent: #b88422;
}

.ranking-card:hover,
.ranking-card:focus-visible {
    border-color: color-mix(in srgb, var(--ranking-card-accent) 38%, var(--line));
    outline: none;
    box-shadow: 0 6px 18px rgba(15, 54, 92, 0.1);
    transform: translateY(-1px);
}

.ranking-card:focus-visible {
    box-shadow: var(--focus-ring), 0 6px 18px rgba(15, 54, 92, 0.1);
}

.ranking-card__header {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr) 18px;
    align-items: start;
    gap: 13px;
    min-width: 0;
    padding: 17px 17px 8px;
}

.ranking-card__icon {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: color-mix(in srgb, var(--ranking-card-accent) 11%, #fff);
    color: var(--ranking-card-accent);
}

.ranking-card__icon .ui-icon {
    width: 48px;
    height: 48px;
}

.ranking-card__content {
    min-width: 0;
}

.ranking-card__title,
.ranking-card__description,
.ranking-card__pilot strong,
.ranking-card__pilot small {
    display: block;
}

.ranking-card__title {
    color: #152f48;
    font-size: 1rem;
    font-weight: 850;
    line-height: 1.25;
}

.ranking-card__description {
    margin-top: 4px;
    color: var(--muted);
    font-size: 0.78rem;
    line-height: 1.34;
}

.ranking-card__open {
    width: 18px;
    height: 18px;
    display: grid;
    place-items: center;
    color: #8393a2;
    transition: color 150ms ease, transform 150ms ease;
}

.ranking-card__open .ui-icon {
    width: 14px;
    height: 14px;
}

.ranking-card:hover .ranking-card__open,
.ranking-card:focus-visible .ranking-card__open {
    color: var(--ranking-card-accent);
    transform: translateX(2px);
}

.ranking-card__leader {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 7px;
    min-width: 0;
    flex: 1 1 auto;
    padding: 5px 16px 18px;
}

.ranking-card__scope {
    color: #718392;
    font-size: 0.7rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    line-height: 1;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.ranking-card__avatar-stage {
    position: relative;
    width: 155px;
    height: 107px;
    display: grid;
    align-items: start;
    justify-items: center;
    flex: 0 0 auto;
}

.ranking-card__garland {
    position: absolute;
    top: 46px;
    left: 50%;
    z-index: 2;
    width: 155px;
    height: auto;
    display: block;
    transform: translateX(-50%);
    pointer-events: none;
    user-select: none;
}

.ranking-card__avatar,
.ranking-top-row__avatar {
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--avatar-border);
    border-radius: 50%;
    background: var(--avatar-bg);
    color: var(--avatar-placeholder-text);
    font-weight: 850;
}

.ranking-card__avatar {
    position: relative;
    z-index: 1;
    width: 100px;
    height: 100px;
    border: 2px solid #fff;
    font-size: 1rem;
    box-shadow: 0 0 0 1px var(--avatar-border), 0 4px 12px rgba(20, 51, 75, 0.12);
}

.ranking-card__avatar img,
.ranking-top-row__avatar img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.ranking-card__pilot {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 5px;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    text-align: center;
}

.ranking-card__pilot strong {
    overflow: hidden;
    max-width: calc(100% - 38px);
    color: #102b44;
    font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
    font-size: 1.4rem;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.012em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ranking-card__pilot small {
    display: inline-grid;
    place-items: center;
    min-height: 18px;
    padding: 1px 5px;
    border: 1px solid #dfe6ec;
    border-radius: 4px;
    background: #f8fafc;
    color: #627483;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.06em;
}

.ranking-card__value {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 27px;
    padding: 4px 11px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--ranking-card-accent) 11%, #fff);
    color: color-mix(in srgb, var(--ranking-card-accent) 94%, #102b44);
    font-size: 0.94rem;
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
    white-space: nowrap;
}

.ranking-card__leader--empty {
    justify-content: center;
    color: var(--muted);
}

.ranking-card__leader--empty .ranking-card__avatar {
    opacity: 0.72;
}

.ranking-card__leader--empty .ranking-card__pilot {
    max-width: none;
}

.ranking-modal-title {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.ranking-modal-title > div {
    min-width: 0;
}

.ranking-modal .app-modal__close,
.ranking-relevant-modal .app-modal__close {
    flex: 0 0 auto;
}

.ranking-modal-title__icon {
    width: 72px;
    height: 72px;
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 18px;
    background: var(--blue-soft);
    color: var(--blue-dark);
}

.ranking-modal-title__icon .ui-icon {
    width: 64px;
    height: 64px;
}

.ranking-modal-empty {
    margin: 0;
    padding: 18px;
    border: 1px dashed var(--line);
    border-radius: var(--radius-md);
    background: var(--content-subtle-bg);
    color: var(--muted);
    text-align: center;
}

.ranking-top-list {
    display: grid;
    gap: 3px;
}

.ranking-top-head,
.ranking-top-row {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) minmax(104px, auto);
    gap: 10px;
    align-items: center;
}

.ranking-top-head {
    padding: 0 12px 8px;
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.ranking-top-head span:nth-child(3) {
    text-align: right;
}

.ranking-top-row {
    position: relative;
    min-height: 58px;
    padding: 7px 12px;
    border: 1px solid transparent;
    border-radius: 8px;
    color: var(--text);
    cursor: pointer;
    transition: border-color 140ms ease, background-color 140ms ease;
}

.ranking-top-row:nth-child(even) {
    background: #f8fbfd;
}

.ranking-top-row:hover,
.ranking-top-row:focus-within {
    border-color: #c9dce9;
    background: var(--row-hover);
    color: var(--text);
    outline: none;
}

.ranking-top-row:has(.ranking-top-row__open:focus-visible) {
    box-shadow: var(--focus-ring);
}

.ranking-top-row__open {
    position: absolute;
    inset: 0;
    z-index: 0;
    border: 0;
    border-radius: inherit;
    background: transparent;
    cursor: pointer;
}

.ranking-top-row__open:focus {
    outline: 0;
}

.ranking-top-row__rank,
.ranking-top-row__pilot,
.ranking-top-row__result {
    position: relative;
    z-index: 1;
    pointer-events: none;
}

.ranking-top-row__rank {
    width: 28px;
    height: 23px;
    display: grid;
    place-items: center;
    justify-self: center;
    color: #687b89;
    font-size: 0.78rem;
    font-weight: 850;
    font-variant-numeric: tabular-nums;
}

.ranking-top-row__rank span::after {
    content: ".";
}

.ranking-top-row__pilot {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.ranking-top-row__avatar {
    z-index: 2;
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
    color: var(--avatar-placeholder-text);
    font-size: 0.7rem;
    text-decoration: none;
    pointer-events: auto;
}

.ranking-top-row__avatar:hover,
.ranking-top-row__avatar:focus-visible {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--focus-outline) 34%, transparent);
    color: var(--avatar-placeholder-text);
    outline: 0;
    text-decoration: none;
}

.ranking-top-row__identity {
    min-width: 0;
}

.ranking-top-row__identity strong,
.ranking-top-row__identity small {
    display: block;
}

.ranking-top-row__identity strong {
    overflow: hidden;
    font-size: 0.9rem;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ranking-top-row__identity small {
    margin-top: 2px;
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.07em;
}

.ranking-top-row__value {
    color: #173a55;
    font-size: 0.9rem;
    text-align: right;
    white-space: nowrap;
}

.ranking-top-row__result {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
}

.ranking-top-row__result .ui-icon {
    width: 16px;
    height: 16px;
    color: var(--muted);
}

.ranking-top-row.htmx-request {
    border-color: #b7d2e5;
    background: var(--row-hover);
}

.ranking-top-row.htmx-request,
.ranking-top-row.htmx-request .ranking-top-row__open {
    cursor: progress;
}

.ranking-top-row.htmx-request .ranking-top-row__chevron {
    display: none;
}

.ranking-request-indicator {
    align-items: center;
    justify-content: center;
    gap: 7px;
}

.ranking-request-status {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    border: 0;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.ranking-top-row.htmx-request .ranking-request-indicator {
    display: inline-flex;
}

.ranking-request-spinner {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
    border: 2px solid color-mix(in srgb, var(--accent) 25%, transparent);
    border-top-color: var(--accent);
    border-radius: 50%;
    opacity: 0;
    animation: app-busy-indicator-spin 680ms linear 140ms infinite,
               app-busy-indicator-reveal 1ms linear 140ms forwards;
}

@media (prefers-reduced-motion: reduce) {
    .ranking-request-spinner {
        animation: app-busy-indicator-reveal 1ms linear 140ms forwards;
    }
}

.ranking-relevant-modal__context {
    margin: 3px 0 0;
    color: var(--muted);
    font-size: var(--font-sm);
    font-weight: 650;
}

.ranking-relevant-modal__context strong {
    color: var(--text);
}

.app-modal__body.ranking-relevant-modal__body {
    padding: 0;
}

.ranking-relevant-more {
    display: flex;
    justify-content: center;
    padding: 14px 16px;
}

@media (max-width: 560px) {
    .app-modal.ranking-modal,
    .app-modal.ranking-relevant-modal {
        --app-modal-edge-gap: 8px;
        --app-modal-vertical-gap: 16px;
        align-items: center;
    }

    .app-modal.ranking-modal .app-modal__panel,
    .app-modal.ranking-relevant-modal .app-modal__panel {
        width: 100%;
        height: calc(100dvh - var(--app-modal-vertical-gap));
        max-height: calc(100dvh - var(--app-modal-vertical-gap));
        border-radius: var(--radius-md);
    }

    .ranking-modal .app-modal__header,
    .ranking-relevant-modal .app-modal__header {
        padding-right: 12px;
        padding-left: 12px;
    }

    .ranking-modal .app-modal__body {
        padding: 12px 8px;
    }

}


@media (max-width: 960px) {
    .ranking-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .ranking-heading {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
        min-height: 242px;
    }

    .ranking-heading__identity {
        align-self: start;
    }

    .ranking-scope-bar {
        grid-template-columns: minmax(0, 1fr);
    }

    .ranking-filter-form {
        align-self: end;
        justify-self: stretch;
        width: calc(100% - var(--ranking-heading-copy-offset));
    }

    .ranking-country-select {
        min-height: 44px;
    }
}

@media (max-width: 600px) {
    .ranking-heading {
        --ranking-heading-copy-offset: 67px;
        min-height: 250px;
        padding: 16px;
    }

    .ranking-heading__icon {
        width: 40px;
        height: 40px;
    }

    .ranking-heading__icon .ui-icon {
        width: 20px;
        height: 20px;
    }

    .ranking-scope-bar {
        width: calc(100% + 32px);
        margin: 0 -16px -16px;
        padding: 10px 12px;
    }

    .ranking-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
        padding: 12px;
    }

    .ranking-card {
        min-height: 244px;
    }
}

@media (max-width: 460px) {
    .ranking-modal .app-modal__body {
        padding-right: 0;
        padding-left: 0;
    }

    .ranking-filter-form {
        width: calc(100% - var(--ranking-heading-copy-offset));
    }

    .ranking-country-control,
    .ranking-country-select {
        width: 100%;
    }

    .ranking-card__header {
        grid-template-columns: 50px minmax(0, 1fr) 18px;
        gap: 11px;
        padding: 15px 14px 7px;
    }

    .ranking-card__icon {
        width: 50px;
        height: 50px;
    }

    .ranking-card__leader {
        gap: 6px;
        padding: 7px 14px 16px;
    }

    .ranking-card__avatar-stage {
        width: 134px;
        height: 93px;
    }

    .ranking-card__garland {
        top: 40px;
        width: 134px;
    }

    .ranking-card__avatar {
        width: 86px;
        height: 86px;
    }

    .ranking-card__value {
        font-size: 0.92rem;
    }

    .ranking-top-head {
        display: none;
    }

    .ranking-top-row {
        grid-template-columns: 36px minmax(0, 1fr) minmax(82px, auto);
        gap: 8px;
        min-height: 54px;
        padding: 6px 4px;
    }


    .ranking-top-row__avatar {
        width: 34px;
        height: 34px;
    }

    .ranking-top-row__pilot {
        gap: 8px;
    }

    .ranking-top-row__value {
        font-size: 0.82rem;
    }


}

/* Standalone portal error pages intentionally avoid dynamic navigation dependencies. */
.error-page {
    min-height: 100vh;
}

.error-page__topbar-inner {
    justify-content: flex-start;
}

.error-page__shell {
    min-height: calc(100vh - 52px);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 72px;
    padding-bottom: 72px;
}

.error-page__panel {
    width: min(100%, 640px);
    padding: 38px 34px;
    text-align: center;
}

.error-page__status {
    margin: 0 0 8px;
    color: var(--accent);
    font-size: var(--font-sm);
    font-weight: 850;
    letter-spacing: 0;
}

.error-page__panel h1 {
    margin: 0;
    font-size: 1.75rem;
    line-height: 1.15;
}

.error-page__message {
    max-width: 460px;
    margin: 12px auto 0;
    color: var(--muted);
    line-height: 1.55;
}

.error-page__reference {
    margin: 14px 0 0;
    color: var(--muted);
    font-size: var(--font-sm);
}

.error-page__reference code {
    color: var(--text);
}

.error-page__actions {
    display: flex;
    justify-content: center;
    margin-top: 24px;
}

.error-page__actions .page-action span {
    display: inline;
}

.error-page__actions .page-action {
    width: auto;
    min-width: 0;
    padding-right: 12px;
    padding-left: 12px;
}

@media (max-width: 620px) {
    .error-page__shell {
        padding-top: 32px;
        padding-bottom: 32px;
    }

    .error-page__panel {
        padding: 30px 20px;
    }
}