/*
 * FREQUENZA — an airport control tower inside a living radar instrument.
 * Local artwork, no SVG IDs, no measured progress. Clone-safe by design.
 * The host owns request timing; this stylesheet only owns presentation.
 */
.flight-loader {
    --flight-loader-ink: var(--fd-ink, #193b4b);
    --flight-loader-muted: var(--fd-muted, #526e79);
    --flight-loader-night: var(--arrival-night, #092b40);
    --flight-loader-copper: var(--arrival-copper, #e1ba7b);
    --flight-loader-paper: var(--arrival-paper, #f4f6ef);
    box-sizing: border-box;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
    width: min(100%, 340px);
    min-width: 0;
    margin: 0 auto;
    padding: 8px;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
    color: var(--flight-loader-ink);
    font-family: var(--fd-font, "Avenir Next", "Trebuchet MS", "Segoe UI", sans-serif);
    text-align: center;
    line-height: 1.45;
    color-scheme: light;
}
.flight-loader-overlay {
    box-sizing: border-box;
    position: fixed;
    z-index: 1200;
    inset: 0;
    display: grid;
    place-items: center;
    padding: max(12px, env(safe-area-inset-top, 0px)) max(12px, env(safe-area-inset-right, 0px)) max(12px, env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px));
    border: 0;
    background: none;
    pointer-events: none;
}
.flight-loader-overlay,
.flight-loader-overlay * {
    pointer-events: none;
}
.flight-loader[hidden],
.flight-loader-overlay[hidden],
.flight-loader [hidden],
.flight-loader-overlay [hidden] {
    display: none !important;
}
.flight-loader__airspace {
    position: relative;
    isolation: isolate;
    flex: 0 0 auto;
    width: 224px;
    max-width: 100%;
    aspect-ratio: 1;
    border-radius: 50%;
}
/* Only the circular instrument has a surface. No card or page backdrop. */
.flight-loader__airspace::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 16%;
    border: 1px solid #7396a44d;
    border-radius: 50%;
    background: radial-gradient(circle at 36% 25%, #31586a, var(--flight-loader-night) 75%);
    box-shadow: inset 0 1px 1px #eaf6f036, 0 12px 28px -12px #092b4059;
}
.flight-loader__airspace::after {
    content: "";
    position: absolute;
    z-index: -2;
    inset: -9%;
    border-radius: 50%;
    background: radial-gradient(circle, #f4f6efdc 35%, #f4f6ef66 56%, #f4f6ef00 72%);
}
.flight-loader__chart {
    display: block;
    width: 100%;
    height: 100%;
    overflow: visible;
}
.flight-loader__calibration {
    fill: none;
    stroke: var(--flight-loader-ink);
    stroke-width: .8;
    opacity: .28;
}
.flight-loader__horizon {
    fill: none;
    stroke: #b4d5dc;
    stroke-width: .65;
    opacity: .2;
}
.flight-loader__orbit {
    fill: none;
    stroke: var(--flight-loader-copper);
    stroke-width: 1.6;
    stroke-linecap: round;
    transform-origin: 112px 112px;
}
.flight-loader__orbit--inner {
    stroke: #6597a5;
    stroke-width: .9;
    opacity: .7;
}
.flight-loader__orbit-dot {
    fill: var(--flight-loader-copper);
    stroke: var(--flight-loader-paper);
    stroke-width: 2;
}
.flight-loader__radar {
    fill: none;
    stroke: #b0d6dd;
    stroke-width: 1.2;
    stroke-linecap: round;
    opacity: .55;
    transform-origin: 112px 69px;
}
.flight-loader__radar--second { opacity: .25; }
.flight-loader__tower {
    filter: drop-shadow(-3px 5px 3px #031f3350);
}
.flight-loader__tower-structure {
    fill: #edf3ef;
    stroke: #b5cece;
    stroke-width: .7;
    stroke-linejoin: round;
}
.flight-loader__tower-shade { fill: #9fb9be; }
.flight-loader__tower-frame {
    fill: none;
    stroke: #d8e8e6;
    stroke-width: 1.2;
    stroke-linecap: round;
}
.flight-loader__tower-glass {
    fill: #407c90;
    stroke: #b5cece;
    stroke-width: .8;
    stroke-linejoin: round;
}
.flight-loader__tower-reflection { fill: #a3d1d7; opacity: .48; }
.flight-loader__tower-accent { fill: var(--flight-loader-copper); }
.flight-loader__beacon {
    fill: var(--flight-loader-copper);
    transform-origin: 112px 59px;
}
.flight-loader__scan {
    fill: #a3d1d7;
    opacity: .12;
    transform-origin: 112px 112px;
}
.flight-loader__copy {
    position: relative;
    isolation: isolate;
    box-sizing: border-box;
    flex: 0 1 auto;
    width: 100%;
    min-height: 0;
    padding: 0 8px;
}
/* A soft, edgeless paper halo keeps status copy readable over page content. */
.flight-loader-overlay .flight-loader__copy::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: -22px -20px;
    border-radius: 50%;
    background: radial-gradient(ellipse, #f4f6eff5 25%, #f4f6efdb 48%, #f4f6ef00 73%);
    pointer-events: none;
}
.flight-loader .flight-loader__label {
    display: block;
    margin: 0;
    color: var(--flight-loader-ink);
    font: 600 1rem/1.4 var(--fd-font, "Avenir Next", "Trebuchet MS", "Segoe UI", sans-serif);
    letter-spacing: -.015em;
    overflow-wrap: anywhere;
}
.flight-loader .flight-loader__detail {
    margin: 5px 0 0;
    color: var(--flight-loader-muted);
    font-size: .78rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
}
.flight-loader__detail:empty { display: none; }
.flight-loader-slot {
    display: grid;
    place-items: center;
    min-width: 0;
    width: 100%;
}
.flight-loader.flight-loader--inline {
    width: min(100%, 340px);
    max-height: 180px;
    gap: 5px;
    padding: 4px 8px 8px;
}
.flight-loader--inline .flight-loader__airspace { width: 96px; }
.flight-loader--inline .flight-loader__copy {
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
}
.flight-loader--inline .flight-loader__label { font-size: .86rem; }
.flight-loader--inline .flight-loader__detail {
    margin-top: 3px;
    font-size: .73rem;
}
@keyframes flight-loader-orbit {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
@keyframes flight-loader-signal {
    0% { transform: scale(.72); opacity: 0; }
    24% { opacity: .65; }
    100% { transform: scale(1.32); opacity: 0; }
}
@keyframes flight-loader-beacon {
    0%, 100% { opacity: .55; }
    50% { opacity: 1; }
}
@media (prefers-reduced-motion: no-preference) {
    .flight-loader__orbit { animation: flight-loader-orbit 7.5s linear infinite; }
    .flight-loader__orbit--inner {
        animation-duration: 12s;
        animation-direction: reverse;
    }
    .flight-loader__scan { animation: flight-loader-orbit 7.5s linear infinite; }
    .flight-loader__radar { animation: flight-loader-signal 3.6s ease-out infinite; }
    .flight-loader__radar--second { animation-delay: -1.8s; }
    .flight-loader__beacon { animation: flight-loader-beacon 3.6s ease-in-out infinite; }
}
@media (max-width: 360px) {
    .flight-loader:not(.flight-loader--inline) .flight-loader__airspace { width: 196px; }
    .flight-loader .flight-loader__label { font-size: .92rem; }
    .flight-loader--inline .flight-loader__label { font-size: .84rem; }
}
@media (max-height: 450px) {
    .flight-loader-overlay .flight-loader { gap: 7px; }
    .flight-loader-overlay .flight-loader__airspace { width: 128px; }
    .flight-loader-overlay .flight-loader__detail { font-size: .73rem; }
}
@media (max-height: 280px) {
    .flight-loader-overlay .flight-loader__airspace { width: 88px; }
    .flight-loader-overlay .flight-loader { gap: 4px; }
}
@media (prefers-reduced-motion: reduce) {
    .flight-loader *,
    .flight-loader *::before,
    .flight-loader *::after {
        animation: none !important;
        transition: none !important;
    }
}
@media (forced-colors: active) {
    .flight-loader__airspace::before { background: Canvas; border-color: CanvasText; }
    .flight-loader__calibration,
    .flight-loader__orbit,
    .flight-loader__tower-frame,
    .flight-loader__radar { stroke: CanvasText; }
    .flight-loader__tower-structure { fill: CanvasText; stroke: Canvas; }
    .flight-loader__tower-shade,
    .flight-loader__tower-glass { fill: Canvas; }
    .flight-loader__tower-accent,
    .flight-loader__beacon,
    .flight-loader__orbit-dot { fill: Highlight; }
    .flight-loader .flight-loader__label,
    .flight-loader .flight-loader__detail { color: CanvasText; }
    .flight-loader-overlay .flight-loader__copy::before { background: Canvas; }
}
