/* drone.ayo.pe.kr — 사이트 고유 디자인(2026-09-28). 콘셉트: 항공 차트(모눈·방위 눈금) × 레이더 스코프 × 관제 비행 스트립.
   글꼴: IBM Plex Sans KR(본문·제목) + JetBrains Mono(코드·거리·번호). 모든 규칙은 body.site-drone 아래로 격리한다.
   공역 색은 항공 차트 관례를 따른다 — 금지 자홍 · 관제권 파랑 · 제한 빨강 · 위험 주황 · ATZ 보라 · UA 초록 · 시설 회청. */
body.site-drone {
  --dr-ink: #0f1d2b;
  --dr-sub: #52657a;
  --dr-line: #cfdbe6;
  --dr-paper: #f4f8fb;
  --dr-card: #ffffff;
  --dr-navy: #0b1f33;
  --dr-navy-2: #12304d;
  --dr-scope: #3ddc97;
  --dr-amber: #ffb020;
  --dr-prh: #c2185b;
  --dr-ctr: #1f6fd1;
  --dr-res: #d64545;
  --dr-dng: #e07b16;
  --dr-atz: #7a4fd0;
  --dr-ua: #1f9d63;
  --dr-fac: #5b7086;
  background:
    linear-gradient(rgba(31,111,209,.05) 1px, transparent 1px) 0 0 / 32px 32px,
    linear-gradient(90deg, rgba(31,111,209,.05) 1px, transparent 1px) 0 0 / 32px 32px,
    var(--dr-paper);
  color: var(--dr-ink);
  font-family: "IBM Plex Sans KR", "Apple SD Gothic Neo", sans-serif;
}
body.site-drone .mono, body.site-drone .count, body.site-drone .dist { font-family: "JetBrains Mono", ui-monospace, monospace; }

/* ── 머리: 관제탑 콘솔 ─────────────────────────────── */
body.site-drone .site-head {
  background:
    radial-gradient(circle at 92% 50%, rgba(61,220,151,.18) 0 38px, transparent 39px),
    repeating-radial-gradient(circle at 92% 50%, transparent 0 22px, rgba(61,220,151,.14) 22px 23px),
    var(--dr-navy);
  color: #d8e6f2;
  border-bottom: 3px solid var(--dr-scope);
}
body.site-drone .brand a { color: #fff; font-weight: 700; letter-spacing: -.2px; }
body.site-drone .brand::before {
  content: "";
  display: inline-block; width: 20px; height: 20px; margin-right: 8px; vertical-align: -4px;
  border: 2px solid var(--dr-scope); border-radius: 50%;
  background: radial-gradient(circle, var(--dr-scope) 0 3px, transparent 4px),
              conic-gradient(from 0deg, rgba(61,220,151,.55) 0 60deg, transparent 60deg);
}
body.site-drone .site-head nav a {
  color: #cfe0ee; background: transparent; border: 1px solid rgba(207,224,238,.28); border-radius: 4px;
  font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 13px; letter-spacing: .2px;
}
body.site-drone .site-head nav a.on,
body.site-drone .site-head nav a:hover { color: var(--dr-navy); background: var(--dr-scope); border-color: var(--dr-scope); }
body.site-drone .site-search input[type="search"] { border: 1.5px solid var(--dr-navy-2); border-radius: 4px 0 0 4px; background: #fff; }
body.site-drone .site-search button { background: var(--dr-navy-2); color: #fff; border: 0; border-radius: 0 4px 4px 0; }

/* ── 제목·요약: 비행 계획서 ──────────────────────────── */
body.site-drone h1 { font-weight: 700; font-size: 27px; line-height: 1.3; letter-spacing: -.5px; margin: 18px 0 16px; color: var(--dr-navy); }
body.site-drone h1::after {
  content: ""; display: block; width: 64px; height: 3px; margin-top: 10px;
  background: repeating-linear-gradient(90deg, var(--dr-amber) 0 10px, transparent 10px 16px);
}
body.site-drone .lead { color: var(--dr-sub); line-height: 1.8; }
body.site-drone .crumb a, body.site-drone .data-date { color: var(--dr-sub); }
body.site-drone .summary { background: var(--dr-card); border: 1px solid var(--dr-line); border-top: 4px solid var(--dr-navy); border-radius: 6px; overflow: hidden; margin-bottom: 24px; }
body.site-drone .summary th {
  font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 12px; font-weight: 500; letter-spacing: .4px;
  color: #fff; background: var(--dr-navy-2); padding: 11px 14px; white-space: nowrap;
}
body.site-drone .summary td { font-size: 14.5px; padding: 11px 16px; }
body.site-drone .summary tr + tr td { border-top: 1px dashed var(--dr-line); }
body.site-drone .summary tr + tr th { border-top: 1px solid rgba(255,255,255,.12); }

/* ── 공역 레이더(동네 상세 머리) ─────────────────────── */
body.site-drone .dr-scope {
  display: grid; grid-template-columns: 250px 1fr; gap: 18px; align-items: center;
  margin: 0 0 24px; padding: 16px; border-radius: 10px;
  background: var(--dr-navy); color: #d8e6f2; box-shadow: inset 0 0 0 1px rgba(61,220,151,.25);
}
body.site-drone .dr-radar svg { width: 100%; height: auto; display: block; }
body.site-drone .dr-ring { fill: none; stroke: rgba(61,220,151,.45); stroke-width: 1; }
body.site-drone .dr-core { fill: rgba(255,176,32,.12); stroke: var(--dr-amber); stroke-width: 1.5; stroke-dasharray: 3 3; }
body.site-drone .dr-axis { stroke: rgba(61,220,151,.25); stroke-width: 1; }
body.site-drone .dr-sweep { fill: rgba(61,220,151,.14); }
body.site-drone .dr-rl { fill: rgba(216,230,242,.6); font: 500 9px "JetBrains Mono", ui-monospace, monospace; }
body.site-drone .dr-blip { stroke: var(--dr-navy); stroke-width: 2; }
body.site-drone .dr-blip.dr-in { stroke: #fff; }
body.site-drone .dr-prh.dr-blip { fill: #ff5c9a; } body.site-drone .dr-ctr.dr-blip { fill: #5aa2ff; }
body.site-drone .dr-res.dr-blip { fill: #ff6b6b; } body.site-drone .dr-dng.dr-blip { fill: #ffa94d; }
body.site-drone .dr-atz.dr-blip { fill: #b197fc; } body.site-drone .dr-ua.dr-blip { fill: var(--dr-scope); }
body.site-drone .dr-heli.dr-blip, body.site-drone .dr-fld.dr-blip { fill: #c9d6e2; }
body.site-drone .dr-legend { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
body.site-drone .dr-legend li {
  display: grid; grid-template-columns: 10px 76px 1fr auto; gap: 8px; align-items: baseline;
  padding: 6px 10px; border-radius: 4px; background: rgba(255,255,255,.04); font-size: 13.5px;
}
body.site-drone .dr-legend li.dr-in { background: rgba(255,176,32,.12); }
body.site-drone .dr-legend i { width: 10px; height: 10px; border-radius: 50%; background: #c9d6e2; align-self: center; }
body.site-drone .dr-legend .dr-prh i { background: #ff5c9a; } body.site-drone .dr-legend .dr-ctr i { background: #5aa2ff; }
body.site-drone .dr-legend .dr-res i { background: #ff6b6b; } body.site-drone .dr-legend .dr-dng i { background: #ffa94d; }
body.site-drone .dr-legend .dr-atz i { background: #b197fc; } body.site-drone .dr-legend .dr-ua i { background: var(--dr-scope); }
body.site-drone .dr-legend b { font: 500 12px "JetBrains Mono", ui-monospace, monospace; color: #9fb6ca; }
body.site-drone .dr-legend span { color: #fff; min-width: 0; overflow-wrap: anywhere; }
body.site-drone .dr-legend em { font: 700 12.5px "JetBrains Mono", ui-monospace, monospace; font-style: normal; color: var(--dr-amber); white-space: nowrap; }
body.site-drone .dr-scope figcaption { grid-column: 1 / -1; font-size: 12px; color: #8aa1b6; line-height: 1.6; }

/* ── 질답: 관제 비행 스트립 ───────────────────────────── */
body.site-drone .qa-list { background: transparent; border: 0; box-shadow: none; padding: 0; counter-reset: strip; }
body.site-drone .qa-item {
  counter-increment: strip;
  position: relative;
  background: var(--dr-card);
  border: 1px solid var(--dr-line);
  border-left: 0;
  border-radius: 0 6px 6px 0;
  margin: 0 0 10px;
  padding: 16px 20px 16px 76px;
  box-shadow: 0 1px 0 rgba(15,29,43,.05);
}
body.site-drone .qa-item::before {
  content: "Q" counter(strip, decimal-leading-zero);
  position: absolute; left: 0; top: 0; bottom: 0; width: 56px;
  display: grid; place-items: center;
  background: var(--dr-navy-2); color: var(--dr-scope);
  font: 700 14px "JetBrains Mono", ui-monospace, monospace; letter-spacing: .5px;
  border-right: 4px solid var(--dr-amber);
}
body.site-drone .qa-item:last-child { border-bottom: 1px solid var(--dr-line); }
body.site-drone .qa-item h2 { font-size: 16.5px; font-weight: 700; line-height: 1.5; margin: 0 0 6px; color: var(--dr-navy); }
body.site-drone .qa-item h2::before { content: none; }
body.site-drone .qa-item p { margin: 0; padding-left: 0; font-size: 14.5px; line-height: 1.85; color: #28394a; }

/* ── 관련 목록: 차트 범례 ─────────────────────────────── */
body.site-drone .near-block { background: var(--dr-card); border: 1px solid var(--dr-line); border-radius: 6px; padding: 18px 20px; margin: 0 0 14px; position: relative; }
body.site-drone .near-block::before {
  content: ""; position: absolute; left: 20px; top: -1px; width: 48px; height: 3px; background: var(--dr-ctr);
}
body.site-drone .near-block h2 { font-size: 16.5px; font-weight: 700; margin: 4px 0 8px; color: var(--dr-navy); }
body.site-drone .near-block > p { font-size: 14px; line-height: 1.75; color: var(--dr-sub); margin: 0 0 12px; }
body.site-drone .near-block ul { margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 6px; }
body.site-drone .near-block ul li {
  list-style: none; padding: 9px 12px 9px 28px; font-size: 14px; position: relative;
  border: 1px solid var(--dr-line); border-radius: 4px; background: #fafcfe;
}
body.site-drone .near-block ul li::before {
  content: ""; position: absolute; left: 10px; top: 14px; width: 8px; height: 8px;
  border: 2px solid var(--dr-ctr); border-radius: 50%;
}
body.site-drone .near-block a { color: var(--dr-ctr); font-weight: 600; text-decoration: none; }
body.site-drone .near-block a:hover { text-decoration: underline; }
body.site-drone .near-block .addr, body.site-drone .near-block .dist { display: block; color: var(--dr-sub); font-size: 12.5px; margin-top: 2px; }
body.site-drone .more a { color: var(--dr-ctr); font-weight: 600; }

/* ── 목록·허브: 좌표 목록 ─────────────────────────────── */
body.site-drone .place-list li { background: var(--dr-card); border: 1px solid var(--dr-line); border-left: 4px solid var(--dr-ctr); border-radius: 4px; margin: 8px 0; padding: 12px 16px; }
body.site-drone .place-list li > a { color: var(--dr-navy); font-weight: 700; }
body.site-drone .place-list .addr { color: var(--dr-sub); }
body.site-drone .cat { font: 500 12px "JetBrains Mono", ui-monospace, monospace; background: #e8f1fb; color: var(--dr-ctr); border-radius: 3px; padding: 2px 7px; }
body.site-drone .region-links li { background: var(--dr-card); border: 1px solid var(--dr-line); border-radius: 4px; }
body.site-drone .region-links li:hover { border-color: var(--dr-ctr); background: #eef5fc; }
body.site-drone .count { color: var(--dr-ctr); font-weight: 700; }
body.site-drone .menu-cards li { background: var(--dr-card); border: 1px solid var(--dr-line); border-top: 4px solid var(--dr-scope); border-radius: 6px; }

/* ── 출처·삭제요청·발 ────────────────────────────────── */
body.site-drone .source { border-top: 1px dashed var(--dr-line); padding-top: 16px; margin-top: 26px; }
body.site-drone .source h2 { font-size: 16px; margin: 0 0 8px; }
body.site-drone .source p { font-size: 13.5px; color: var(--dr-sub); }
body.site-drone .source a { color: var(--dr-ctr); }
body.site-drone .btn { background: var(--dr-navy-2); color: #fff; border-radius: 4px; }
body.site-drone .site-foot { background: var(--dr-navy); color: #9fb6ca; }
body.site-drone .site-foot a { color: var(--dr-scope); }

@media (max-width: 640px) {
  body.site-drone h1 { font-size: 22px; }
  body.site-drone .dr-scope { grid-template-columns: 1fr; padding: 12px; }
  body.site-drone .dr-radar { max-width: 240px; margin: 0 auto; }
  body.site-drone .dr-legend li { grid-template-columns: 10px 64px 1fr; }
  body.site-drone .dr-legend em { grid-column: 3; }
  body.site-drone .qa-item { padding: 14px 14px 14px 58px; }
  body.site-drone .qa-item::before { width: 44px; font-size: 12px; }
  body.site-drone .qa-item h2 { font-size: 15.5px; }
  body.site-drone .qa-item p { font-size: 14px; }
  body.site-drone .near-block ul { grid-template-columns: 1fr; }
}