/* Isolated Common Operational Picture demonstration. */
#common-operational-picture{padding-top:88px;border-top:1px solid var(--df-line)}
#common-operational-picture .cop-heading{max-width:1120px;margin-bottom:42px}
#common-operational-picture .cop-heading h2{font-size:clamp(32px,4.3vw,62px);line-height:1.12}
#common-operational-picture .cop-heading .df-lead{max-width:850px;font-size:18px;line-height:1.65;margin-top:26px}
#common-operational-picture .cop-screen{background:#111813;border:1px solid #354036;border-radius:6px;overflow:hidden;color:#c0c7b7}
#common-operational-picture .cop-topbar{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:22px 26px;border-bottom:1px solid #30392f;font:12px/1.6 var(--mono)}
#common-operational-picture .cop-link{color:#bdc69f;display:block;letter-spacing:.04em}
#common-operational-picture .cop-subtitle{display:block;color:#899382;font-size:11px;letter-spacing:.07em}
#common-operational-picture .cop-training{color:#a69b7c;text-align:right;font-size:11px}
#common-operational-picture .cop-map-frame{position:relative;aspect-ratio:2/1;overflow:hidden}
#common-operational-picture .cop-map{display:block;width:100%;height:100%;font:14px var(--mono);letter-spacing:.035em}
#common-operational-picture .cop-map text{paint-order:stroke;stroke:#111813;stroke-width:5px;stroke-linejoin:round;fill:#c3b180}
#common-operational-picture .cop-map .cop-micro{font-size:11px;fill:#96a285;letter-spacing:.05em}
#common-operational-picture .cop-target circle,#common-operational-picture .cop-target path{fill:#111813;stroke:#b8a16a;stroke-width:1.3px}
#common-operational-picture .cop-aircraft path{stroke:#c0cba4;stroke-width:1.4px;fill:#182219}
#common-operational-picture .cop-aircraft text{fill:#d0d6c0}
#common-operational-picture .cop-aircraft .cop-micro{fill:#a1ac88}
#common-operational-picture .cop-origin{fill:none;stroke:#9da984;stroke-width:1.2px}
#common-operational-picture .cop-origin text,#common-operational-picture .cop-route-label{fill:#adb78e;font-size:12px}
#common-operational-picture .cop-map-meta{position:absolute;left:26px;top:20px;right:26px;display:flex;gap:28px;flex-wrap:wrap;font:10px/1.5 var(--mono);color:#85907e;pointer-events:none}
#common-operational-picture .cop-console{display:flex;justify-content:space-between;align-items:center;gap:24px;min-height:116px;padding:20px 26px;border-top:1px solid #30392f;font-family:var(--mono)}
#common-operational-picture .cop-state{display:grid;gap:7px}
#common-operational-picture .cop-state-label{font-size:10px;letter-spacing:.1em;color:#85907e}
#common-operational-picture .cop-state strong{font-size:14px;line-height:1.5;font-weight:400;color:#c2cba9;letter-spacing:.04em}
#common-operational-picture [data-cop-detail]{font-size:12px;line-height:1.5;color:#8f9a88}
#common-operational-picture .cop-controls{display:flex;gap:22px;align-items:center;font-size:12px;white-space:nowrap}
#common-operational-picture .cop-controls button{border:1px solid #4b5645;border-radius:3px;background:#192019;color:#d0d6c0;padding:9px 13px;font:12px var(--mono);cursor:pointer;min-height:44px}
#common-operational-picture .cop-controls button:hover{border-color:#9ba585}
#common-operational-picture .cop-controls button:focus-visible{outline:2px solid #b5bf98;outline-offset:4px}
#common-operational-picture .cop-timeline{height:2px;background:#20291f}
#common-operational-picture .cop-timeline i{display:block;height:100%;background:#7f8c68;transform-origin:left}
#common-operational-picture .cop-capabilities{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:25px 0 0;color:#949e8a;font:11px/1.7 var(--mono);letter-spacing:.035em}
#common-operational-picture .cop-capabilities b{font-weight:400;color:#616e59}
@media(max-width:760px){
#common-operational-picture{padding-top:60px}
#common-operational-picture .cop-heading .df-lead{font-size:16px}
#common-operational-picture .cop-topbar{padding:17px 16px;gap:12px;align-items:flex-start}
#common-operational-picture .cop-link{font-size:10px}
#common-operational-picture .cop-subtitle{font-size:9px}
#common-operational-picture .cop-training{max-width:100px;font-size:9px}
#common-operational-picture .cop-map-frame{aspect-ratio:640/700}
#common-operational-picture .cop-map{font-size:18px}
#common-operational-picture .cop-map .cop-micro{font-size:15px}
#common-operational-picture .cop-origin text,#common-operational-picture .cop-route-label{font-size:16px}
#common-operational-picture .cop-map-meta{left:16px;right:16px;top:14px;gap:4px 16px;font-size:9px}
#common-operational-picture .cop-map-meta span:nth-child(n+3){display:none}
#common-operational-picture .cop-console{padding:18px 16px;gap:15px;min-height:152px;align-items:flex-start}
#common-operational-picture .cop-state{min-width:0}
#common-operational-picture .cop-state strong{font-size:12px}
#common-operational-picture [data-cop-detail]{font-size:11px}
#common-operational-picture .cop-controls{flex-direction:column;gap:15px;font-size:11px}
#common-operational-picture .cop-capabilities{display:grid;grid-template-columns:1fr 1fr;gap:12px 20px;font-size:10px}
#common-operational-picture .cop-capabilities b{display:none}
}