/* site-r206: live aircraft layer (public/sky-layer.js) */
.sky-section{border-top:1px solid rgba(255,255,255,.12);margin-top:8px;padding-top:8px}
.sky-head{font:700 11px/1.2 system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;opacity:.75;margin:0 0 6px;display:flex;gap:6px;align-items:center}
.sky-plus{background:#ffb02e;color:#111;border-radius:4px;padding:1px 5px;font-size:10px;letter-spacing:.04em}
.sky-alerts-btn{margin:6px 0 2px;width:100%;padding:8px 10px;border-radius:8px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.06);color:inherit;font:600 13px system-ui,sans-serif;cursor:pointer;text-align:start}
.sky-alerts-btn:hover{background:rgba(255,255,255,.12)}
.sky-note{font:13px/1.4 system-ui,sans-serif;margin:6px 0 0}
.sky-note a{color:#ffb02e}
.sky-form{margin-top:8px;display:grid;gap:6px;font:13px/1.35 system-ui,sans-serif}
.sky-form label{display:flex;gap:8px;align-items:flex-start}
.sky-form select{width:100%;padding:6px;border-radius:6px;background:#1b2130;color:inherit;border:1px solid rgba(255,255,255,.2)}
.sky-form .sky-save{padding:8px 10px;border-radius:8px;border:0;background:#ffb02e;color:#111;font-weight:700;cursor:pointer}
.sky-form small{opacity:.7}
.sky-ac{display:block;width:100%;height:100%;transform-origin:50% 50%;filter:drop-shadow(0 1px 1.5px rgba(0,0,0,.85))}
.sky-ac-wrap{position:relative;width:26px;height:26px}
.sky-ac-wrap.is-emergency::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid #ff3b3b;animation:skyPulse 1.6s ease-out infinite}
@keyframes skyPulse{from{transform:scale(.6);opacity:1}to{transform:scale(1.5);opacity:0}}
@media (prefers-reduced-motion:reduce){.sky-ac-wrap.is-emergency::after{animation:none}}
.sky-tag{position:absolute;left:50%;top:calc(100% + 1px);transform:translateX(-50%);white-space:nowrap;font:700 10px/1 system-ui,sans-serif;color:#fff;background:rgba(10,14,22,.8);padding:2px 4px 2px 2px;border-radius:3px;pointer-events:none;display:flex;gap:3px;align-items:center}
.leaflet-container.sky-hide-tags .sky-tag{display:none}
.sky-pop{font:13px/1.4 system-ui,sans-serif;min-width:200px}
.sky-pop strong{font-size:15px}
.sky-pop .sky-route{margin-top:6px;padding-top:6px;border-top:1px solid rgba(0,0,0,.12)}
.sky-pop .sky-badge{display:inline-block;border-radius:4px;padding:1px 6px;font-weight:700;font-size:11px;margin-left:4px}
.sky-pop small{opacity:.7}
/* site-r208: aircraft by type, airline badges, the selected aircraft, the card, airports, legend */
.sky-al{display:inline-block;min-width:16px;padding:1px 3px;border-radius:3px;font:800 9px/1.2 system-ui,sans-serif;text-align:center;letter-spacing:.02em}
.sky-al-big{font-size:13px;padding:4px 6px;border-radius:6px;min-width:30px}
.sky-ac-wrap.is-selected .sky-ac{filter:drop-shadow(0 0 3px #fff) drop-shadow(0 0 6px rgba(255,255,255,.7))}
.sky-ac-wrap.is-selected .sky-tag{background:#e11d48}
.leaflet-marker-icon.is-selected{z-index:10000!important}
.sky-legend{display:flex;flex-wrap:wrap;gap:4px 10px;margin:2px 0 8px 28px;font:11px/1.3 system-ui,sans-serif;opacity:.85}
.sky-legend span{display:inline-flex;align-items:center;gap:4px}
.sky-legend i{width:9px;height:9px;border-radius:2px;display:inline-block}
.leaflet-popup-content:has(.sky-card){margin:0;width:auto!important;min-width:240px}
.leaflet-popup:has(.sky-card) .leaflet-popup-close-button{color:#fff}
.sky-card{font:13px/1.35 system-ui,sans-serif;color:#e5e7eb;padding:0 12px 10px}
.sky-card-head{display:flex;gap:8px;align-items:center;background:#0f1522;color:#fff;margin:0 -12px 8px;padding:10px 30px 10px 12px;border-radius:12px 12px 0 0}
.sky-card-head strong{font-size:17px;color:#ffcc33;margin-right:4px}
.sky-card-head span{display:block;font-size:12px;opacity:.85}
.sky-card .sky-badge{display:inline-block;border-radius:4px;padding:1px 6px;font-weight:700;font-size:11px;vertical-align:2px}
.sky-card-photo{display:block;margin:0 0 8px;position:relative;text-decoration:none}
.sky-card-photo img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:6px;background:#1f2937}
.sky-card-photo small{position:absolute;left:6px;bottom:5px;color:#fff;font-size:10px;text-shadow:0 1px 2px #000}
.sky-card-route{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;text-align:center;gap:6px;margin:2px 0 6px}
.sky-card-end b{display:block;font-size:24px;line-height:1.1;letter-spacing:.02em}
.sky-card-end b{color:#fff}
.sky-card-end small{font-size:11px;text-transform:uppercase;color:#a7b0bf}
.sky-card-plane{width:30px;height:30px;border-radius:50%;background:#ffcc33;display:grid;place-items:center;font-size:16px;transform:rotate(90deg)}
.sky-card-progress{height:5px;border-radius:3px;background:rgba(255,255,255,.16);overflow:hidden}
.sky-card-progress i{display:block;height:100%;background:#f5b400}
.sky-card-miles{display:flex;justify-content:space-between;font-size:11px;color:#a7b0bf;margin:3px 0 4px}
.sky-card-note{display:block;font-size:11px;color:#a7b0bf;margin:2px 0 6px}
.sky-card-note b{color:#f3f4f6}
.sky-card-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;margin:6px 0 0;border-top:1px solid rgba(255,255,255,.14);padding-top:8px}
.sky-card-grid div{min-width:0}
.sky-card-grid dt{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:#a7b0bf}
.sky-card-grid dd{margin:0;font-weight:600;color:#f9fafb;overflow-wrap:anywhere}
.sky-apt{position:relative;width:22px;height:28px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6))}
.sky-apt span{position:absolute;left:24px;top:3px;font:700 10px/1 system-ui,sans-serif;color:#cfe0ff;text-shadow:0 1px 2px #000;white-space:nowrap}
.leaflet-container.sky-hide-tags .sky-apt span{display:none}
.sky-card-quick{font-weight:600;margin:4px 0 2px;color:#f3f4f6}
.sky-card-more summary{cursor:pointer;font-weight:700;color:#7cb3ff;font-size:12px;margin:6px 0 4px;list-style-position:inside}
.sky-card-more[open] summary{margin-bottom:8px}
/* phones and the app's web view: a small card (owner 2026-11-12) */
@media (max-width:640px){
  .sky-card{font-size:12px}
  .sky-card-head{padding:8px 28px 8px 10px;margin-bottom:6px}
  .sky-card-head strong{font-size:15px}
  .sky-card-end b{font-size:19px}
  .sky-card-plane{width:24px;height:24px;font-size:13px}
  .sky-card-grid{gap:4px 10px}
  .sky-legend{margin-left:0}
}
/* site-r209: airline logos, boat card links */
.sky-logo{width:14px;height:14px;border-radius:3px;background:#fff;object-fit:contain;display:inline-block;flex:none}
.sky-logo-big{width:34px;height:34px;border-radius:7px;padding:2px}
.sky-card-links{display:flex;gap:14px;margin-top:8px;font-size:12px}
.sky-card-links a{color:#7cb3ff;font-weight:600}
/* site-r209 (owner 2026-11-12, phone screenshot: "the layers button gets hidden"): the button stays at the bottom with the
   panel opening above it, and on a phone the panel stops below the search bar and scrolls */
.map-layers{flex-direction:column-reverse}
@media (max-width:640px){
  .map-layers-panel{max-height:max(200px,calc(100dvh - 340px))!important;overscroll-behavior:contain}
  /* the small card on a phone */
  .leaflet-popup-content:has(.sky-card){min-width:200px}
  .sky-card{font-size:11px;padding:0 9px 8px}
  .sky-card-head{gap:6px;padding:6px 26px 6px 8px;margin:0 -9px 5px}
  .sky-card-head strong{font-size:13px}
  .sky-card-head span{font-size:10.5px}
  .sky-logo-big,.sky-al-big{width:24px;height:24px;min-width:24px;font-size:10px;padding:1px}
  .sky-card-route{margin:0 0 3px;gap:4px}
  .sky-card-end b{font-size:15px}
  .sky-card-end small{font-size:9px}
  .sky-card-plane{width:18px;height:18px;font-size:10px}
  .sky-card-miles{font-size:10px;margin:2px 0}
  .sky-card-route ~ .sky-card-note{display:none}
  .sky-card-quick{margin:2px 0 0}
  .sky-card-more summary{font-size:11px;margin:4px 0 2px}
  .sky-card-grid{grid-template-columns:1fr 1fr;gap:3px 8px}
  .sky-card-grid dt{font-size:9px}
}
/* site-r210: labels that would overlap a more important one */
.sky-tag.sky-tag-off{visibility:hidden}
/* site-r211: the owner's 64 x 64 icon set; markers glide between reports */
.sky-ac.sky-upright{transform:none!important}
/* site-r211: squawk 7500 / 7700 - the code above the icon, the icon flashing red once a second (steady with reduced motion) */
.sky-sqk{position:absolute;left:50%;bottom:calc(100% + 2px);transform:translateX(-50%);background:#ff2d55;color:#fff;font:800 10px/1 system-ui,sans-serif;
  padding:2px 4px;border-radius:3px;letter-spacing:.04em;white-space:nowrap;box-shadow:0 0 0 1px #fff;pointer-events:none}
.sky-ac-wrap.is-flashing .sky-ac{animation:skyFlash 1s steps(1,end) infinite}
@keyframes skyFlash{0%{opacity:1;filter:drop-shadow(0 0 4px #ff2d55) drop-shadow(0 0 8px #ff2d55)}50%{opacity:.25;filter:none}}
@media (prefers-reduced-motion:reduce){.sky-ac-wrap.is-flashing .sky-ac{animation:none;filter:drop-shadow(0 0 4px #ff2d55)}}
/* site-r216: one switch per layer, then All / Official only */
.sky-sub{display:flex;flex-direction:column;gap:4px;margin:0 0 6px 28px;font:12px/1.3 system-ui,sans-serif}
.sky-sub[hidden]{display:none}
.sky-sub label{display:flex;gap:6px;align-items:baseline;cursor:pointer}
.sky-sub small{opacity:.7}
/* site-r217: agency units close together - one "3 FDNY units" pill; a click spreads them on spokes */
.leaflet-marker-icon.sky-clustered{display:none}
.sky-cluster-icon{width:0!important;height:0!important;background:none;border:0}
.sky-cluster{position:absolute;left:0;top:0;transform:translate(-50%,-50%);display:flex;align-items:center;gap:5px;white-space:nowrap;cursor:pointer;
  font:700 12px/1 system-ui,sans-serif;color:#fff;background:rgba(11,15,23,.92);border:1.5px solid #fff;border-radius:12px;padding:3px 9px 3px 3px;box-shadow:0 1px 4px rgba(0,0,0,.5)}
.sky-cluster b{min-width:18px;height:18px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;padding:0 4px;font-size:11px;color:#fff}
.sky-cluster:focus-visible{outline:2px solid #fff;outline-offset:2px}
.leaflet-marker-icon.is-spread{z-index:9000!important}