/* Above The Lakes Release 1.1H — compact layout and overlap repair */
:root{
  --atl-content-wide:1600px;
  --atl-gutter:clamp(10px,1.25vw,20px);
  --atl-gap:10px;
}
*{box-sizing:border-box}
html,body{max-width:100%;overflow-x:hidden}
img,svg,canvas,video{max-width:100%}

/* Critical reset: application pages must not inherit the planner's two-column main grid. */
body.dashboard-page main.dashboard-main{
  display:block!important;
  grid-template-columns:none!important;
  width:min(var(--atl-content-wide),calc(100% - (var(--atl-gutter) * 2)))!important;
  max-width:none!important;
  min-width:0!important;
  margin:0 auto!important;
  padding:14px 0 28px!important;
}
body.dashboard-page main.dashboard-main>*{min-width:0;max-width:100%}

/* Compact page hero shared by Fuel, Maintenance, records, airports, etc. */
body.dashboard-page .dashboard-hero{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  width:100%!important;
  min-height:0!important;
  gap:14px!important;
  margin:0 0 12px!important;
  padding:14px 16px!important;
  border:1px solid var(--atl-border)!important;
  border-radius:14px!important;
  background:linear-gradient(135deg,rgba(19,48,70,.97),rgba(8,27,42,.97))!important;
  overflow:hidden!important;
}
body.dashboard-page .dashboard-hero>div{min-width:0}
body.dashboard-page .dashboard-hero .eyebrow{font-size:9px!important;margin-bottom:3px!important}
body.dashboard-page .dashboard-hero h1{
  margin:0 0 5px!important;
  font-size:clamp(24px,2.5vw,36px)!important;
  line-height:1.02!important;
  letter-spacing:-.035em!important;
  max-width:none!important;
}
body.dashboard-page .dashboard-hero p{
  margin:0!important;
  max-width:850px!important;
  font-size:12.5px!important;
  line-height:1.38!important;
  color:var(--atl-muted)!important;
}
body.dashboard-page .dashboard-hero-actions,
body.dashboard-page .header-actions{
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:flex-end!important;
  align-items:center!important;
  gap:7px!important;
  min-width:0!important;
}
body.dashboard-page .dashboard-hero-actions>* ,
body.dashboard-page .header-actions>*{width:auto!important;max-width:100%!important;white-space:normal!important}

/* Global compact cards and controls on application pages. */
body.dashboard-page .dashboard-card,
body.dashboard-page .data-card,
body.dashboard-page .module-card{
  min-width:0!important;
  padding:12px!important;
  border-radius:12px!important;
  overflow:hidden!important;
}
body.dashboard-page .dashboard-card h2,
body.dashboard-page .data-card h2{font-size:18px!important;margin:0 0 8px!important}
body.dashboard-page .dashboard-card h3,
body.dashboard-page .data-card h3{font-size:15px!important;margin:0 0 7px!important}
body.dashboard-page label{margin:5px 0!important;font-size:10.5px!important}
body.dashboard-page input,
body.dashboard-page select,
body.dashboard-page textarea{min-width:0!important;padding:7px 8px!important;font-size:12px!important}
body.dashboard-page button,
body.dashboard-page .button-link,
body.dashboard-page .button{min-height:34px!important;padding:7px 10px!important;font-size:11.5px!important}
body.dashboard-page .field-help,
body.dashboard-page .dashboard-label{font-size:10.5px!important;line-height:1.35!important}
body.dashboard-page .form-grid{gap:0 8px!important}
body.dashboard-page .form-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))!important}
body.dashboard-page .form-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))!important}
body.dashboard-page .grid2{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}

/* Dashboard home: pack operational information into a single useful view. */
body.dashboard-home .dashboard-hero{padding:15px 18px!important;margin-bottom:11px!important}
body.dashboard-home .dashboard-hero h1{font-size:clamp(27px,3vw,42px)!important}
body.dashboard-home .dashboard-section{width:100%!important;margin:0 0 13px!important}
body.dashboard-home .dashboard-section-heading{display:flex!important;align-items:end!important;justify-content:space-between!important;gap:10px!important;margin:0 0 6px!important}
body.dashboard-home .dashboard-section-heading h2{font-size:16px!important;margin:1px 0 0!important}
body.dashboard-home .dashboard-section-heading .eyebrow{font-size:8.5px!important}
body.dashboard-home .dashboard-stat-grid{
  display:grid!important;
  grid-template-columns:repeat(6,minmax(125px,1fr))!important;
  gap:8px!important;
  width:100%!important;
}
body.dashboard-home .dashboard-stat-card{
  display:flex!important;
  flex-direction:column!important;
  min-height:88px!important;
  padding:10px 11px!important;
}
body.dashboard-home .dashboard-label{font-size:10px!important}
body.dashboard-home .dashboard-stat{
  margin:3px 0 6px!important;
  font-size:26px!important;
  line-height:1!important;
}
body.dashboard-home .dashboard-route-value{font-size:15px!important;line-height:1.15!important}
body.dashboard-home .dashboard-stat-card>a{margin-top:auto!important;font-size:10.5px!important}
body.dashboard-home .dashboard-module-grid,
body.dashboard-home .module-grid{
  display:grid!important;
  grid-template-columns:repeat(6,minmax(150px,1fr))!important;
  gap:8px!important;
  width:100%!important;
}
body.dashboard-home .module-link{
  display:flex!important;
  flex-direction:column!important;
  min-width:0!important;
  min-height:86px!important;
  padding:10px 11px!important;
  border-radius:11px!important;
}
body.dashboard-home .module-link strong{font-size:13px!important;line-height:1.15!important;margin:0 0 4px!important;padding-right:12px!important}
body.dashboard-home .module-link span{font-size:10.5px!important;line-height:1.3!important}
body.dashboard-home .module-link:after{right:9px!important;top:7px!important;font-size:15px!important}
body.dashboard-home .dashboard-two-column{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:8px!important;
}
body.dashboard-home .dashboard-info-card,
body.dashboard-home .dashboard-list-card{padding:11px 12px!important}
body.dashboard-home .dashboard-info-card h2,
body.dashboard-home .dashboard-list-card h2{font-size:15px!important;margin:0 0 6px!important}
body.dashboard-home .dashboard-row{padding:6px 0!important;gap:8px!important}
body.dashboard-home .empty-state{min-height:46px!important;padding:10px!important;font-size:10.5px!important}

/* Metrics throughout the site: small tiles, not tall panels. */
body.dashboard-page .metrics,
body.dashboard-page .metrics.six{
  display:grid!important;
  grid-template-columns:repeat(6,minmax(105px,1fr))!important;
  gap:7px!important;
  margin:0 0 9px!important;
}
body.dashboard-page .metrics article{min-height:68px!important;padding:9px 10px!important}
body.dashboard-page .metrics strong{font-size:20px!important;line-height:1.05!important}
body.dashboard-page .metrics span,
body.dashboard-page .metrics small{font-size:8.8px!important;line-height:1.25!important}

/* Fuel page: prevent the hero from becoming a narrow left rail and tighten the workspace. */
body.dashboard-page .fuel-layout{
  display:grid!important;
  grid-template-columns:minmax(250px,310px) minmax(0,1fr)!important;
  gap:10px!important;
  align-items:start!important;
}
body.dashboard-page .fuel-workspace{display:grid!important;gap:9px!important;min-width:0!important}
body.dashboard-page #fuelMap{height:clamp(300px,44vh,500px)!important;border-radius:11px!important}
body.dashboard-page #fuelAirportList,
body.dashboard-page #fuelObservations{min-width:0!important;overflow-wrap:anywhere!important}

/* Maintenance: summary row stays above content; no overlap with hero. */
body.dashboard-page .maintenance-summary{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(120px,1fr))!important;
  gap:8px!important;
  width:100%!important;
  margin:0 0 9px!important;
}
body.dashboard-page .maintenance-stat{min-height:72px!important;padding:9px 11px!important;border-radius:11px!important}
body.dashboard-page .maintenance-stat span{font-size:10.5px!important}
body.dashboard-page .maintenance-stat strong{font-size:24px!important;margin-top:2px!important}
body.dashboard-page .maintenance-layout{
  display:grid!important;
  grid-template-columns:minmax(240px,290px) minmax(0,1fr)!important;
  gap:9px!important;
  margin:0 0 9px!important;
  align-items:start!important;
}
body.dashboard-page .maintenance-toolbar{
  display:grid!important;
  grid-template-columns:minmax(180px,1fr) minmax(125px,155px) minmax(150px,190px)!important;
  gap:7px!important;
  margin-bottom:9px!important;
}
body.dashboard-page .maintenance-record{gap:9px!important;padding:10px!important;font-size:11px!important}
body.dashboard-page .maintenance-list{gap:7px!important}
body.dashboard-page .maintenance-main .empty-state{min-height:74px!important;padding:14px!important}

/* Records, lists and directory pages. */
body.dashboard-page .dashboard-grid,
body.dashboard-page .section-grid,
body.dashboard-page .airport-grid,
body.dashboard-page .weather-layer-grid,
body.dashboard-page .emergency-grid{gap:9px!important}
body.dashboard-page .table-wrap{max-width:100%!important;overflow:auto!important}
body.dashboard-page th,body.dashboard-page td{padding:7px 8px!important;font-size:11px!important}
body.dashboard-page th{font-size:9px!important}

/* Planner remains two-column; its own main does not have dashboard-main. */
main:not(.dashboard-main){min-width:0!important}
main:not(.dashboard-main) .workspace,
main:not(.dashboard-main) .panel{min-width:0!important}

@media(max-width:1350px){
  body.dashboard-home .dashboard-stat-grid{grid-template-columns:repeat(3,minmax(140px,1fr))!important}
  body.dashboard-home .dashboard-module-grid,body.dashboard-home .module-grid{grid-template-columns:repeat(3,minmax(180px,1fr))!important}
  body.dashboard-page .metrics,body.dashboard-page .metrics.six{grid-template-columns:repeat(3,minmax(120px,1fr))!important}
}
@media(max-width:980px){
  body.dashboard-page .dashboard-hero{grid-template-columns:1fr!important}
  body.dashboard-page .dashboard-hero-actions,body.dashboard-page .header-actions{justify-content:flex-start!important}
  body.dashboard-page .fuel-layout,body.dashboard-page .maintenance-layout{grid-template-columns:1fr!important}
  body.dashboard-page .maintenance-toolbar{grid-template-columns:1fr 1fr!important}
  body.dashboard-page .maintenance-toolbar>input{grid-column:1/-1!important}
  body.dashboard-home .dashboard-module-grid,body.dashboard-home .module-grid{grid-template-columns:repeat(2,minmax(170px,1fr))!important}
}
@media(max-width:680px){
  body.dashboard-page main.dashboard-main{width:calc(100% - 12px)!important;padding:7px 0 20px!important}
  body.dashboard-page .dashboard-hero{padding:11px 12px!important;gap:8px!important}
  body.dashboard-page .dashboard-hero h1{font-size:25px!important}
  body.dashboard-home .dashboard-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.dashboard-home .dashboard-module-grid,body.dashboard-home .module-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.dashboard-home .dashboard-two-column{grid-template-columns:1fr!important}
  body.dashboard-page .metrics,body.dashboard-page .metrics.six{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.dashboard-page .maintenance-summary{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.dashboard-page .maintenance-toolbar{grid-template-columns:1fr!important}
  body.dashboard-page .maintenance-toolbar>*{grid-column:auto!important}
  body.dashboard-page .form-grid.two,body.dashboard-page .form-grid.three,body.dashboard-page .grid2{grid-template-columns:1fr!important}
}
@media(max-width:420px){
  body.dashboard-home .dashboard-stat-grid,body.dashboard-home .dashboard-module-grid,body.dashboard-home .module-grid{grid-template-columns:1fr!important}
}
/* Release 1.1J: clearly identify route endpoints and waypoint coordinates. */
.route-airport-marker{display:grid;place-items:center;min-width:54px;padding:4px 7px;border:2px solid #fff;border-radius:9px;background:#146ea0;color:#fff;box-shadow:0 3px 12px rgba(0,0,0,.42);font:700 11px/1.05 system-ui,sans-serif;text-align:center;white-space:nowrap}
.route-airport-marker span{font-size:8px;letter-spacing:.1em;opacity:.82}
.route-airport-marker strong{font-size:12px}
.route-airport-marker.departure{background:#177b49}
.route-airport-marker.destination{background:#b73b3b}
.route-airport-marker.waypoint{background:#166f9f}


/* Release 1.1P — map traffic aircraft icons and detail popovers */
.atl-traffic-popup .maplibregl-popup-content{background:#0b2233;color:#eef7fc;border:1px solid rgba(103,196,255,.45);border-radius:12px;box-shadow:0 14px 36px rgba(0,0,0,.42);padding:12px 14px;min-width:235px}
.atl-traffic-popup .maplibregl-popup-tip{border-top-color:#0b2233!important;border-bottom-color:#0b2233!important}
.atl-traffic-popup .maplibregl-popup-close-button{color:#fff;font-size:18px;padding:3px 7px}
.traffic-map-popup{display:grid;gap:7px;font-size:12px;line-height:1.25}
.traffic-map-popup>strong{font-size:16px;color:#fff;padding-right:18px}
.traffic-popup-source{color:#76d0ff;font-weight:700;font-size:10px;text-transform:uppercase;letter-spacing:.06em}
.traffic-map-popup dl{display:grid;grid-template-columns:1fr auto;gap:4px 12px;margin:2px 0}
.traffic-map-popup dt{color:#a9c0cf}.traffic-map-popup dd{margin:0;font-weight:700;text-align:right;color:#fff}
.traffic-map-popup small{color:#ffc95a;border-top:1px solid rgba(255,255,255,.12);padding-top:6px}
.traffic-legend .traffic-normal,.traffic-legend .traffic-alert{font-weight:800}
.traffic-legend .traffic-normal{color:#f6c84a}.traffic-legend .traffic-alert{color:#ff5f55}

/* Release 1.1Q — always-visible planner traffic health and display controls */
.overview-traffic-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 10px;margin:8px 0;border:1px solid rgba(92,183,255,.32);border-radius:10px;background:linear-gradient(135deg,rgba(12,42,61,.94),rgba(8,31,47,.94));box-shadow:0 8px 20px rgba(0,0,0,.18)}
.overview-traffic-main{display:flex;align-items:center;gap:9px;min-width:210px}.overview-traffic-main>div{display:grid;gap:1px}.overview-traffic-main strong{font-size:13px;color:#f7fbff}.overview-traffic-main small{font-size:10px;color:#a9bfce}
.traffic-live-dot{width:11px;height:11px;border-radius:50%;background:#f4b942;box-shadow:0 0 0 4px rgba(244,185,66,.14);flex:0 0 auto}.traffic-live-dot.online{background:#4bd58b;box-shadow:0 0 0 4px rgba(75,213,139,.14)}.traffic-live-dot.danger{background:#ff665f;box-shadow:0 0 0 4px rgba(255,102,95,.14)}.traffic-live-dot.offline{background:#778894;box-shadow:0 0 0 4px rgba(119,136,148,.14)}
.overview-traffic-actions{display:flex;align-items:end;justify-content:flex-end;gap:7px;flex-wrap:wrap}.overview-traffic-actions label{margin:0;font-size:9px;color:#9fb6c5;display:grid;gap:2px}.overview-traffic-actions select{min-width:96px;padding:5px 24px 5px 7px;font-size:11px}.overview-traffic-actions button{padding:6px 9px;font-size:10px;min-height:29px}.traffic-check.compact{display:flex;align-items:center;gap:5px;padding:5px 7px;border:1px solid rgba(255,255,255,.12);border-radius:7px;color:#dbe9f2}.traffic-check.compact input{margin:0}
@media(max-width:900px){.overview-traffic-bar{align-items:flex-start;flex-direction:column}.overview-traffic-actions{justify-content:flex-start;width:100%}}


/* Release 1.1S: DOM-based traffic markers. These sit above all map layers and do not depend on style glyphs or sprite images. */
.atl-traffic-marker{position:relative;width:34px;height:34px;padding:0;border:0;background:transparent;overflow:visible;cursor:pointer;filter:drop-shadow(0 2px 3px rgba(0,0,0,.8));z-index:3}
.atl-traffic-marker:focus-visible{outline:2px solid #fff;outline-offset:3px;border-radius:50%}
.atl-traffic-plane{display:block;width:34px;height:34px;transform-origin:50% 50%;transition:transform .2s linear}
.atl-traffic-plane svg{display:block;width:100%;height:100%;overflow:visible}
.atl-traffic-plane path{fill:#ffd166;stroke:#061724;stroke-width:3;stroke-linejoin:round}
.atl-traffic-marker.near .atl-traffic-plane path{fill:#ff5f56;stroke:#fff0ec}
.atl-traffic-marker.stale .atl-traffic-plane path{fill:#8797a5;stroke:#273844}
.atl-traffic-marker-label{position:absolute;left:50%;top:34px;transform:translateX(-50%);display:block;min-width:max-content;padding:2px 5px;border:1px solid rgba(255,255,255,.35);border-radius:5px;background:rgba(3,18,29,.92);color:#fff;font-size:10px;font-weight:800;line-height:1.15;white-space:nowrap;text-shadow:0 1px 2px #000;pointer-events:none}
.atl-traffic-marker:hover{z-index:20}.atl-traffic-marker:hover .atl-traffic-plane{scale:1.18}

/* Release 1.1V — route-relevant traffic filters */
.overview-traffic-actions select#overviewTrafficCorridor,.overview-traffic-actions select#overviewTrafficAltitude{min-width:92px}
@media(max-width:1100px){.overview-traffic-actions{justify-content:flex-start}.overview-traffic-actions label{min-width:90px}}


/* Release 1.1W — mainland USA traffic view */
.overview-traffic-actions select#overviewTrafficCorridor{min-width:168px}
.overview-traffic-actions select#overviewTrafficAltitude{min-width:112px}
@media(max-width:760px){.overview-traffic-actions select#overviewTrafficCorridor{min-width:150px}}

/* Release 1.2A — Traffic Engine 2.0 */
.atl-t2-marker{position:absolute;width:32px;height:32px;margin:0;border:0;background:transparent;padding:0;overflow:visible;cursor:pointer;filter:drop-shadow(0 2px 3px rgba(0,0,0,.82));z-index:4;transition:opacity .25s ease,filter .2s ease}
.atl-t2-anchor{position:absolute;left:50%;top:50%;width:4px;height:4px;transform:translate(-50%,-50%);border-radius:50%;background:transparent;pointer-events:none}
.atl-t2-icon{position:absolute;inset:0;display:block;transform-origin:50% 50%;transition:transform .32s linear,scale .18s ease}
.atl-t2-icon svg{width:32px;height:32px;display:block;overflow:visible}.atl-t2-icon path{fill:#ffd166;stroke:#061724;stroke-width:3;stroke-linejoin:round}
.atl-t2-marker.near .atl-t2-icon path,.atl-t2-marker.crossing .atl-t2-icon path{fill:#ff6b5f;stroke:#fff}.atl-t2-marker.stale{opacity:.55}.atl-t2-marker.stale .atl-t2-icon path{fill:#8797a5;stroke:#263b49}
.atl-t2-marker:hover,.atl-t2-marker:focus-visible,.atl-t2-marker.selected{z-index:30;filter:drop-shadow(0 0 7px rgba(255,224,100,.95))}.atl-t2-marker:hover .atl-t2-icon,.atl-t2-marker:focus-visible .atl-t2-icon,.atl-t2-marker.selected .atl-t2-icon{scale:1.24}
.atl-t2-marker.selected::after{content:"";position:absolute;inset:-5px;border:2px solid #ffe06a;border-radius:50%;animation:atlTrafficPulse 1.4s infinite;pointer-events:none}
.atl-t2-label{position:absolute;left:50%;top:31px;transform:translateX(-50%);min-width:max-content;padding:2px 5px;border:1px solid rgba(255,255,255,.34);border-radius:5px;background:rgba(3,18,29,.94);color:#fff;font-size:10px;font-weight:800;line-height:1.15;white-space:nowrap;pointer-events:none;text-shadow:0 1px 2px #000}
.atl-t2-marker.debug .atl-t2-anchor{background:#00ff9d;box-shadow:0 0 0 3px rgba(0,255,157,.35)}
.atl-traffic-debug{position:fixed;right:12px;bottom:12px;z-index:99999;max-width:430px;padding:10px 12px;border:1px solid #00d98b;border-radius:10px;background:rgba(2,18,28,.96);color:#eafff6;font:12px/1.4 ui-monospace,monospace;box-shadow:0 12px 35px rgba(0,0,0,.45)}.atl-traffic-debug strong,.atl-traffic-debug span,.atl-traffic-debug small{display:block}.atl-traffic-debug small{color:#8ce4bf;margin-bottom:5px}
@keyframes atlTrafficPulse{0%,100%{opacity:.35;transform:scale(.88)}50%{opacity:1;transform:scale(1.12)}}

/* Release 1.3E: stable traffic details and non-jumping refresh UI */
.overview-traffic-bar{min-height:62px;box-sizing:border-box}
.overview-traffic-main{min-height:38px}
#overviewTrafficTitle,#overviewTrafficMeta{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:min(560px,42vw)}
#map{position:relative}
.atl-traffic-detail-card{position:absolute;z-index:10000;top:14px;left:14px;width:min(330px,calc(100% - 28px));max-height:calc(100% - 28px);overflow:auto;background:#0b2233;color:#eef7fc;border:1px solid rgba(103,196,255,.58);border-radius:12px;box-shadow:0 16px 40px rgba(0,0,0,.48);padding:14px 15px 13px;box-sizing:border-box}
.atl-traffic-detail-card[hidden]{display:none!important}
.atl-traffic-detail-close{position:absolute;top:7px;right:8px;width:28px;height:28px;border:1px solid rgba(255,255,255,.2);border-radius:7px;background:#102f44;color:#fff;font-size:20px;line-height:1;cursor:pointer;padding:0}
.atl-traffic-detail-body{padding-right:24px}
.atl-traffic-detail-card .traffic-popup{min-width:0}
@media(max-width:700px){.overview-traffic-bar{min-height:0}#overviewTrafficTitle,#overviewTrafficMeta{max-width:calc(100vw - 80px)}.atl-traffic-detail-card{top:8px;left:8px;width:calc(100% - 16px);max-height:55%}}


/* Release 1.3G: professional aircraft detail cards */
.atl-traffic-detail-card{width:min(410px,calc(100% - 28px));padding:0;overflow:hidden;background:linear-gradient(180deg,#102b3e 0%,#0a1f2e 100%);border-color:rgba(110,204,255,.65)}
.atl-traffic-detail-body{padding:0}
.atl-traffic-detail-close{z-index:3;top:10px;right:10px;background:rgba(6,25,38,.86);border-color:rgba(255,255,255,.28)}
.traffic-popup.professional{min-width:0;color:#eef8ff;font-size:13px;line-height:1.35}
.traffic-card-header{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:10px;padding:14px 44px 12px 14px;border-bottom:1px solid rgba(126,199,239,.23);background:linear-gradient(135deg,rgba(32,101,139,.35),rgba(7,31,46,.25))}
.traffic-card-title{min-width:0}.traffic-card-title strong{display:block;font-size:18px;line-height:1.1;letter-spacing:.02em;color:#fff}.traffic-card-title span{display:block;margin-top:3px;color:#9fc9df;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.traffic-source-pill{align-self:start;padding:4px 7px;border-radius:999px;background:rgba(70,177,232,.15);border:1px solid rgba(92,194,245,.35);color:#91d9ff;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;white-space:nowrap}
.traffic-carrier-logo{width:40px;height:40px;display:grid;place-items:center;border-radius:10px;border:1px solid rgba(255,255,255,.28);box-shadow:0 5px 16px rgba(0,0,0,.28);font-weight:900;font-size:15px;letter-spacing:-.04em;color:#fff;background:#244b64}
.traffic-carrier-logo.generic{font-size:20px;background:#193b50}
.traffic-carrier-logo.american{background:linear-gradient(135deg,#1671b9 0 50%,#d61f36 50%)}.traffic-carrier-logo.delta{background:#c8102e}.traffic-carrier-logo.united{background:#005daa}.traffic-carrier-logo.southwest{background:linear-gradient(135deg,#304cb2 0 58%,#e41e3a 58% 78%,#f9b612 78%)}.traffic-carrier-logo.alaska{background:#01426a}.traffic-carrier-logo.jetblue{background:#003876}.traffic-carrier-logo.frontier{background:#17864b}.traffic-carrier-logo.spirit{background:#ffe500;color:#111}.traffic-carrier-logo.skywest{background:#356b8c}.traffic-carrier-logo.republic{background:#173d67}.traffic-carrier-logo.envoy{background:#0b4da2}.traffic-carrier-logo.psa{background:#d71920}.traffic-carrier-logo.commteair,.traffic-carrier-logo.commuteair{background:#005a9c}.traffic-carrier-logo.suncountry{background:#ff7f32}.traffic-carrier-logo.ups{background:#351c15;color:#ffb500}.traffic-carrier-logo.fedex{background:linear-gradient(135deg,#4d148c 0 58%,#ff6600 58%)}.traffic-carrier-logo.abx{background:#d71920}.traffic-carrier-logo.ati{background:#004b8d}.traffic-carrier-logo.atlas{background:#172f57}.traffic-carrier-logo.netjets{background:#111}.traffic-carrier-logo.flexjet{background:#642f6c}.traffic-carrier-logo.westjet{background:#006f62}.traffic-carrier-logo.aircanada{background:#d8292f}.traffic-carrier-logo.british{background:#075aaa}.traffic-carrier-logo.lufthansa{background:#05164d;color:#f9ba00}.traffic-carrier-logo.emirates{background:#d71920}.traffic-carrier-logo.cathay{background:#006564}.traffic-carrier-logo.turkish{background:#c70a0c}.traffic-carrier-logo.aeromexico{background:#001e62}.traffic-carrier-logo.volaris{background:#8a1b61}.traffic-carrier-logo.viva{background:#00a651}.traffic-carrier-logo.avianca{background:#e41e2b}
.traffic-card-primary{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(105,178,216,.18);border-bottom:1px solid rgba(126,199,239,.2)}
.traffic-card-primary>div{padding:11px 10px;background:#0b2638}.traffic-card-primary span,.traffic-card-status span,.traffic-card-route span{display:block;color:#8fb6ca;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.055em}.traffic-card-primary strong{display:block;margin-top:3px;font-size:14px;color:#fff}
.traffic-card-status{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:11px 12px 4px}.traffic-status-chip{padding:8px;border:1px solid rgba(255,255,255,.13);border-radius:8px;background:rgba(255,255,255,.035)}.traffic-status-chip strong{display:block;margin-top:3px;font-size:11px;color:#fff}.traffic-status-chip.climb{border-color:rgba(79,218,142,.45);background:rgba(25,128,81,.13)}.traffic-status-chip.descend{border-color:rgba(255,181,71,.5);background:rgba(171,102,0,.13)}.traffic-status-chip.close{border-color:rgba(255,91,91,.6);background:rgba(170,28,28,.18)}.traffic-status-chip.caution{border-color:rgba(255,190,66,.55);background:rgba(157,100,0,.15)}.traffic-status-chip.separated{border-color:rgba(82,198,143,.38)}
.traffic-card-route{display:grid;gap:0;padding:8px 12px 12px}.traffic-card-route>div{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.08)}.traffic-card-route>div:last-child{border-bottom:0}.traffic-card-route span{font-size:9px}.traffic-card-route strong{max-width:58%;text-align:right;font-size:11px;color:#eaf7ff}.traffic-route-assessment.good strong{color:#78e5ac}.traffic-route-assessment.warn strong{color:#ffd166}.traffic-route-assessment.danger strong{color:#ff8585}
.traffic-popup-warning{display:flex;gap:8px;align-items:flex-start;padding:10px 12px;background:rgba(255,190,55,.11);border-top:1px solid rgba(255,190,55,.28);color:#ffd981;font-size:10px;line-height:1.35}
.maplibregl-popup-content .traffic-popup.professional{min-width:310px}.maplibregl-popup-content .traffic-card-header{padding-right:14px}
@media(max-width:520px){.atl-traffic-detail-card{width:calc(100% - 16px)}.traffic-card-header{grid-template-columns:40px minmax(0,1fr);padding-right:44px}.traffic-source-pill{grid-column:2;justify-self:start}.traffic-card-primary,.traffic-card-status{grid-template-columns:1fr 1fr}.traffic-card-primary>div:last-child{grid-column:1/-1}.traffic-card-route>div{align-items:flex-start;flex-direction:column;gap:3px}.traffic-card-route strong{max-width:none;text-align:left}}

/* Release 1.3H: constrain traffic detail cards and keep map overlays behind them */
.atl-traffic-detail-card{
  z-index:2147483000;
  width:min(390px,calc(100% - 28px));
  max-width:calc(100% - 28px);
  min-width:0;
  overflow:hidden;
  isolation:isolate;
  contain:layout paint;
  background:#0a2232;
  opacity:1;
  pointer-events:auto;
}
.atl-traffic-detail-card,
.atl-traffic-detail-card *,
.atl-traffic-detail-card *::before,
.atl-traffic-detail-card *::after{box-sizing:border-box;min-width:0}
.atl-traffic-detail-body,
.traffic-popup.professional{width:100%;max-width:100%;overflow:hidden;background:#0a2232}
.traffic-card-header{width:100%;max-width:100%;grid-template-columns:40px minmax(0,1fr) minmax(0,112px);overflow:hidden}
.traffic-card-title{overflow:hidden}
.traffic-card-title strong,.traffic-card-title span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.traffic-source-pill{display:block;max-width:112px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;justify-self:end}
.traffic-card-primary,.traffic-card-status{width:100%;max-width:100%;grid-template-columns:repeat(3,minmax(0,1fr));overflow:hidden}
.traffic-card-primary>div,.traffic-status-chip{overflow:hidden}
.traffic-card-primary strong,.traffic-status-chip strong{overflow-wrap:anywhere;word-break:normal;white-space:normal;line-height:1.25}
.traffic-card-route{width:100%;max-width:100%;overflow:hidden}
.traffic-card-route>div{width:100%;max-width:100%}
.traffic-card-route span{flex:0 0 42%;max-width:42%}
.traffic-card-route strong{flex:1 1 auto;max-width:58%;overflow-wrap:anywhere;word-break:normal;white-space:normal}
.traffic-popup-warning{width:100%;max-width:100%;overflow:hidden}
.traffic-popup-warning span:last-child{overflow-wrap:anywhere}
.atl-traffic-detail-card{transform:translateZ(0)}
@media(max-width:520px){
  .atl-traffic-detail-card{width:calc(100% - 16px);max-width:calc(100% - 16px)}
  .traffic-card-header{grid-template-columns:40px minmax(0,1fr);padding-right:44px}
  .traffic-source-pill{grid-column:2;justify-self:start;max-width:100%}
  .traffic-card-primary,.traffic-card-status{grid-template-columns:repeat(2,minmax(0,1fr))}
  .traffic-card-primary>div:last-child{grid-column:1/-1}
  .traffic-card-route>div{align-items:flex-start;flex-direction:column;gap:4px}
  .traffic-card-route span,.traffic-card-route strong{max-width:100%;text-align:left}
}


/* Release 1.3I: viewport-aware aircraft detail card and overlay priority */
.atl-traffic-detail-card{
  position:absolute!important;
  width:390px;
  max-width:calc(100% - 20px);
  min-height:0;
  margin:0!important;
  z-index:2147483646!important;
  overflow:auto;
  overscroll-behavior:contain;
  background:#0a2232!important;
  box-shadow:0 20px 52px rgba(0,0,0,.62),0 0 0 1px rgba(123,210,255,.18);
  transform:translateZ(0);
  isolation:isolate;
}
.atl-traffic-detail-card .traffic-popup.professional{min-height:356px;background:#0a2232!important}
.atl-traffic-detail-card[hidden]{display:none!important}
.maplibregl-marker .atl-t2-marker{z-index:1}
.maplibregl-marker:has(.atl-t2-marker){z-index:500!important}
.maplibregl-marker:has(.atl-t2-marker.selected){z-index:700!important}
.atl-traffic-detail-card,.atl-traffic-detail-card *{pointer-events:auto}
@media(max-width:520px){
 .atl-traffic-detail-card{width:calc(100% - 20px)!important;max-width:calc(100% - 20px)!important}
 .atl-traffic-detail-card .traffic-popup.professional{min-height:0}
}

/* Release 1.3J: hard-contained, map-top aircraft information overlay */
.atl-traffic-detail-overlay{
  position:absolute!important;
  inset:0!important;
  z-index:2147483647!important;
  overflow:hidden!important;
  pointer-events:none!important;
  isolation:isolate!important;
  contain:strict!important;
}
.atl-traffic-detail-overlay .atl-traffic-detail-card{
  position:absolute!important;
  margin:0!important;
  max-width:calc(100% - 24px)!important;
  max-height:calc(100% - 24px)!important;
  overflow:auto!important;
  overscroll-behavior:contain!important;
  pointer-events:auto!important;
  z-index:1!important;
  background:#081f2f!important;
  opacity:1!important;
  border:1px solid rgba(115,207,255,.72)!important;
  box-shadow:0 22px 58px rgba(0,0,0,.78),0 0 0 2px rgba(4,22,34,.92)!important;
  contain:layout paint style!important;
}
.atl-traffic-detail-overlay .atl-traffic-detail-card::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:#081f2f;
  opacity:1;
  pointer-events:none;
}
.atl-traffic-detail-overlay .atl-traffic-detail-body,
.atl-traffic-detail-overlay .traffic-popup.professional{
  min-height:100%!important;
  background:#081f2f!important;
  opacity:1!important;
}
.atl-traffic-detail-overlay .traffic-card-header{
  position:sticky;
  top:0;
  z-index:4;
  background:linear-gradient(135deg,#164765 0%,#0b2a3d 100%)!important;
}
.atl-traffic-detail-overlay .atl-traffic-detail-close{
  position:sticky!important;
  float:right;
  top:10px!important;
  right:10px!important;
  z-index:6!important;
  margin:10px 10px -38px 0!important;
}
.maplibregl-marker,
.maplibregl-popup{z-index:auto!important}
@media(max-width:520px){
  .atl-traffic-detail-overlay .atl-traffic-detail-card{
    max-width:calc(100% - 16px)!important;
    max-height:calc(100% - 16px)!important;
  }
}

/* Release 1.3K: true map-contained traffic drawer */
.atl-traffic-detail-overlay{
  clip-path:inset(0)!important;
  contain:layout paint!important;
}
.atl-traffic-detail-overlay .atl-traffic-detail-card{
  min-height:0!important;
  height:auto;
  display:flex;
  flex-direction:column;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  scrollbar-gutter:stable;
  border-radius:12px!important;
}
.atl-traffic-detail-overlay .atl-traffic-detail-body{
  min-height:0!important;
  height:auto!important;
  flex:0 0 auto;
  overflow:visible!important;
}
.atl-traffic-detail-overlay .traffic-popup.professional{
  min-height:0!important;
  height:auto!important;
  overflow:visible!important;
  padding-bottom:8px;
}
.atl-traffic-detail-overlay .atl-traffic-detail-close{
  position:absolute!important;
  float:none!important;
  top:8px!important;
  right:8px!important;
  margin:0!important;
}
.atl-traffic-detail-overlay .traffic-card-header{
  padding-right:50px!important;
}
.maplibregl-marker[data-hidden-by-traffic-card="true"]{
  visibility:hidden!important;
}