:root {
  font-family: "Pretendard", "Noto Sans KR", Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #f3f6fb;
  color: #10213c;
  --navy: #10213c;
  --blue: #2563eb;
  --blue-2: #4f8df7;
  --blue-soft: #eaf2ff;
  --line: #dfe6f0;
  --muted: #677389;
  --red: #e34b59;
  --red-soft: #fff3f4;
  --green: #2f9e5b;
  --card: #ffffff;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: linear-gradient(180deg, #f7f9fc 0, #f2f5fa 100%); color: var(--navy); }
a { color: inherit; }
button, select { font: inherit; }

.container { width: min(1180px, calc(100% - 40px)); margin: 0 auto; }

.topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  background: rgba(255,255,255,.93);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(223,230,240,.9);
}
.topbar-inner {
  width: min(1180px, calc(100% - 40px));
  margin: 0 auto;
  min-height: 72px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}
.brand { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; }
.brand strong { display: block; font-size: 16px; letter-spacing: -.3px; }
.brand-wordmark {
  font-size: 21px !important;
  line-height: 1;
  letter-spacing: -.8px !important;
  font-weight: 900;
  color: #12233e;
}
.brand-wordmark span { color: #12233e; }
.brand-wordmark em {
  color: var(--blue);
  font-style: normal;
  position: relative;
}
.brand-wordmark em::after {
  content: "";
  position: absolute;
  width: 5px;
  height: 5px;
  right: -7px;
  top: 1px;
  border-radius: 50%;
  background: #60a5fa;
  box-shadow: 0 0 0 4px rgba(96,165,250,.13);
}
.brand small { display: block; margin-top: 4px; color: #7c899d; font-size: 10px; font-weight: 700; letter-spacing: -.15px; }
.brand-mark {
  position: relative;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 12px;
  background: linear-gradient(145deg,#1d4ed8 0%,#3b82f6 58%,#78b4ff 100%);
  box-shadow: 0 7px 16px rgba(37,99,235,.22), inset 0 1px 0 rgba(255,255,255,.28);
}
.mark-bars {
  position: absolute;
  left: 9px;
  bottom: 8px;
  height: 22px;
  display: flex;
  align-items: flex-end;
  gap: 3px;
}
.brand-mark i {
  display: block;
  width: 4px;
  border-radius: 3px 3px 1px 1px;
  background: rgba(255,255,255,.96);
  box-shadow: 0 1px 2px rgba(18,35,62,.08);
}
.brand-mark i:nth-child(1){height:9px}
.brand-mark i:nth-child(2){height:15px}
.brand-mark i:nth-child(3){height:21px}
.brand-mark b {
  position: absolute;
  right: 6px;
  top: 6px;
  width: 11px;
  height: 11px;
  border: 1.7px solid rgba(255,255,255,.93);
  border-radius: 50%;
}
.brand-mark b::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 2px;
  width: 1.5px;
  height: 4px;
  border-radius: 2px;
  background: #fff;
  transform-origin: 50% 100%;
  transform: rotate(28deg);
}

.menu-toggle { display: none; border: 0; background: transparent; color: #17304f; font-size: 28px; line-height: 1; cursor: pointer; padding: 8px; border-radius: 10px; }
.site-nav { display: flex; align-items: center; gap: 28px; }
.site-nav a { position: relative; padding: 26px 0 22px; text-decoration: none; font-size: 14px; font-weight: 700; color: #3d4b63; }
.site-nav a:hover, .site-nav a.active { color: var(--blue); }
.site-nav a.active::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 15px;
  height: 3px; border-radius: 999px;
  background: var(--blue);
}

.hero-shell {
  overflow: hidden;
  background:
    radial-gradient(circle at 78% 35%, rgba(81,145,255,.16), transparent 24%),
    radial-gradient(circle at 92% 0%, rgba(125,211,252,.2), transparent 32%),
    linear-gradient(120deg, #fbfdff 0%, #f1f7ff 55%, #e8f2ff 100%);
  border-bottom: 1px solid #e0e8f3;
}
.hero {
  min-height: 290px;
  padding: 44px 0 40px;
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(280px,.5fr);
  gap: 46px;
  align-items: center;
  position: relative;
}
.hero::after {
  content: "";
  position: absolute;
  width: 520px; height: 180px;
  right: -80px; bottom: -34px;
  opacity: .55;
  background:
    linear-gradient(90deg, transparent 0 3%, rgba(40,91,156,.12) 3% 5%, transparent 5% 8%, rgba(40,91,156,.16) 8% 12%, transparent 12% 15%, rgba(40,91,156,.1) 15% 18%, transparent 18% 22%, rgba(40,91,156,.18) 22% 26%, transparent 26% 30%, rgba(40,91,156,.11) 30% 33%, transparent 33% 38%, rgba(40,91,156,.15) 38% 43%, transparent 43%);
  clip-path: polygon(0 100%, 0 68%, 7% 68%, 7% 55%, 12% 55%, 12% 70%, 18% 70%, 18% 40%, 23% 40%, 23% 62%, 31% 62%, 31% 34%, 36% 34%, 36% 58%, 45% 58%, 45% 25%, 51% 25%, 51% 63%, 58% 63%, 58% 42%, 63% 42%, 63% 70%, 71% 70%, 71% 30%, 76% 30%, 76% 50%, 83% 50%, 83% 18%, 88% 18%, 88% 56%, 94% 56%, 94% 36%, 100% 36%, 100% 100%);
}
.hero-copy, .hero-message { position: relative; z-index: 2; }
.trust-kicker {
  display: inline-flex; align-items: center; gap: 8px; margin: 0 0 14px; padding: 7px 11px;
  background: #e8f1ff; color: #245da8; border: 1px solid #d6e7ff;
  border-radius: 999px; font-size: 12px; font-weight: 800;
}
.trust-kicker strong {
  color: #174f9f;
  font-weight: 900;
  letter-spacing: -.2px;
}
.trust-kicker strong::after {
  content: "";
  display: inline-block;
  width: 1px;
  height: 11px;
  margin-left: 8px;
  vertical-align: -1px;
  background: #b9d3f5;
}
.hero h1 {
  margin: 0;
  max-width: 820px;
  font-size: clamp(36px,4.15vw,54px);
  line-height: 1.08;
  letter-spacing: -1.8px;
  color: #0b1b35;
}
.hero h1 span { color: #1f5fb8; }
.hero h2 { margin: 15px 0 7px; font-size: 23px; letter-spacing: -.6px; }
.subtitle { margin: 0; max-width: 760px; color: #5b687d; font-size: 15px; line-height: 1.75; }
.hero-message {
  display: grid; grid-template-columns: 3px 1fr; gap: 16px;
  padding: 4px 0;
  align-self: center;
}
.hero-line { width: 3px; background: linear-gradient(var(--blue), transparent); border-radius: 99px; }
.hero-message p { margin: 0; font-size: 18px; line-height: 1.55; color: #2f5f9f; }
.hero-message small { grid-column: 2; color: #758299; line-height: 1.55; font-size: 12px; }

.dashboard { padding: 24px 0 64px; }

.card {
  background: rgba(255,255,255,.97);
  border: 1px solid var(--line);
  border-radius: 20px;
  box-shadow: 0 10px 28px rgba(27,48,82,.055);
}

.explorer { padding: 22px; margin-top: -2px; }
.explorer-intro { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.explorer-intro h2 { margin: 1px 0 4px; font-size: 24px; }
.explorer-intro p { margin: 0; color: var(--muted); font-size: 13px; }
.mini-label { color: #4f6481 !important; font-weight: 700; }
.explorer-icon {
  width: 46px; height: 46px; border-radius: 15px;
  display: grid; place-items: center;
  background: var(--blue-soft); color: var(--blue);
  font-size: 26px; font-weight: 800;
}

.crime-chips {
  display: grid;
  grid-template-columns: repeat(6, minmax(0,1fr));
  gap: 14px;
}
.crime-chip {
  min-height: 96px; padding: 16px 18px;
  display: flex; align-items: center; gap: 10px; text-align: left;
  background: #fbfcfe; border: 1px solid #dbe4f0; border-radius: 14px;
  color: #24334b; cursor: pointer; transition: .18s ease;
}
.crime-chip:hover { transform: translateY(-1px); border-color: #a9c6ef; box-shadow: 0 6px 16px rgba(37,99,235,.08); }
.crime-chip.active {
  background: linear-gradient(135deg,#2463e8,#3276f5);
  color: #fff; border-color: transparent;
  box-shadow: 0 8px 20px rgba(37,99,235,.20);
}
.chip-icon {
  flex: 0 0 46px; width: 46px; height: 46px; border-radius: 14px;
  display: grid; place-items: center;
  background: #edf4ff; color: var(--blue); font-weight: 900; font-size: 20px;
}
.crime-chip.active .chip-icon { background: rgba(255,255,255,.18); color: #fff; }
.crime-chip strong, .crime-chip small { display: block; }
.crime-chip strong { font-size: 20px; line-height: 1.15; }
.crime-chip small { margin-top: 5px; color: #8490a1; font-size: 14px; }
.crime-chip.active small { color: rgba(255,255,255,.8); }

.filter-row {
  margin-top: 16px; padding-top: 16px; border-top: 1px solid #edf1f6;
  display: grid; grid-template-columns: minmax(0,1.4fr) minmax(180px,.6fr); gap: 16px;
}
.field label { display: block; margin-bottom: 7px; color: #30425e; font-size: 13px; font-weight: 800; }
select {
  width: 100%; padding: 12px 42px 12px 14px;
  border: 1px solid #ced9e8; border-radius: 11px; background: #fff;
  color: #172943; font-size: 15px; outline: none;
}
select:focus { border-color: #7eabed; box-shadow: 0 0 0 3px rgba(37,99,235,.08); }

.freshness-bar {
  margin-top: 15px; padding: 12px 14px;
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px;
  border-radius: 13px; background: #f8fafd; border: 1px solid #edf1f6;
  color: #6b778c; font-size: 12px;
}
.freshness-bar > span:not(:first-child) { padding-left: 14px; border-left: 1px solid #dde5ef; }
.freshness-bar strong { color: #43526a; }
.status-pill { display: inline-flex; align-items: center; gap: 7px; font-weight: 800; color: #536177; }
.status-pill i { width: 8px; height: 8px; border-radius: 50%; background: #9aa5b5; }
.status-pill.success { color: #27814a; }
.status-pill.success i { background: #2fa75d; box-shadow: 0 0 0 4px rgba(47,167,93,.1); }
.status-pill.error { color: #b23f49; }
.status-pill.error i { background: #db5560; }

.summary-grid {
  display: grid; grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 14px; margin-top: 16px;
}
.metric { padding: 20px; min-height: 152px; }
.metric-top { display: flex; align-items: center; gap: 9px; color: #44526a; font-size: 13px; font-weight: 800; }
.metric-icon {
  width: 34px; height: 34px; display: grid; place-items: center;
  border-radius: 50%; background: #edf4ff; color: var(--blue); font-size: 16px;
}
.metric strong { display: block; margin: 16px 0 7px; font-size: clamp(28px,3.2vw,38px); letter-spacing: -1.2px; color: #12233e; }
.metric small { color: #8390a2; }
.metric.warning { background: linear-gradient(180deg,#fffafa,#fff); border-color: #f3d5d8; }
.metric.warning .metric-icon { background: #ffe8ea; color: var(--red); }
.metric.warning .metric-top, .metric.warning strong { color: var(--red); }

.visual-grid {
  display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  gap: 16px; margin-top: 16px;
}
.visual-grid > .card, .table-card { padding: 22px; }
.section-heading { display: flex; justify-content: space-between; gap: 16px; align-items: end; }
.section-heading h2 { margin: 2px 0 6px; font-size: 21px; letter-spacing: -.4px; }
.section-heading p { margin: 0; color: var(--muted); font-size: 13px; }
.section-kicker { color: #4b82cc !important; font-size: 10px !important; font-weight: 900; letter-spacing: 1.2px; }

.bars { display: grid; gap: 13px; margin-top: 22px; }
.bar-row { display: grid; grid-template-columns: 156px 1fr 64px; gap: 11px; align-items: center; }
.bar-label { font-size: 13px; font-weight: 750; white-space: nowrap; }
.bar-track, .trend-track { height: 14px; background: #edf1f6; border-radius: 999px; overflow: hidden; }
.bar-fill { height: 100%; background: linear-gradient(90deg,#4d8df7,#78adff); border-radius: inherit; }
.bar-row:last-child .bar-fill { background: linear-gradient(90deg,#ef6a75,#e34b59); }
.bar-value { text-align: right; color: #53627a; font-size: 12px; font-variant-numeric: tabular-nums; }

.trend-chart { margin-top: 20px; display: grid; gap: 18px; }
.trend-legend { display: flex; flex-wrap: wrap; gap: 16px; font-size: 12px; color: #68758a; }
.trend-legend span { display: inline-flex; align-items: center; gap: 7px; }
.legend-dot { width: 8px; height: 8px; border-radius: 999px; display: inline-block; }
.legend-dot.within3, .trend-fill.within3 { background: #6ea6f8; }
.legend-dot.within6, .trend-fill.within6 { background: #235f9e; }
.legend-dot.over6, .trend-fill.over6 { background: #e86670; }
.trend-year { display: grid; grid-template-columns: 58px 1fr; gap: 12px; align-items: start; }
.trend-year-label { font-size: 16px; font-weight: 900; color: #2d405e; }
.trend-series { display: grid; gap: 9px; }
.trend-line { display: grid; grid-template-columns: 74px 1fr 56px; gap: 9px; align-items: center; }
.trend-line span, .trend-line strong { font-size: 12px; }
.trend-line span { color: #68758a; }
.trend-line strong { text-align: right; font-variant-numeric: tabular-nums; }
.trend-fill { height: 100%; border-radius: inherit; min-width: 2px; }

.detail-grid {
  display: grid; grid-template-columns: minmax(0,1.55fr) minmax(320px,.85fr);
  gap: 16px; margin-top: 16px;
}
.detail-grid > *,
.visual-grid > *,
.table-card,
.notice-stack,
.notice {
  min-width: 0;
}
.table-card { margin-top: 0; }
.table-wrap {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
table { width: 100%; border-collapse: collapse; margin-top: 14px; }
th, td { padding: 12px 10px; border-bottom: 1px solid #edf1f5; text-align: right; }
th:first-child, td:first-child { text-align: left; }
th { background: #f8fafc; color: #68758a; font-size: 12px; white-space: nowrap; }
td { color: #263852; font-size: 13px; font-variant-numeric: tabular-nums; white-space: nowrap; }

.notice-stack { display: grid; gap: 14px; }
.notice { padding: 20px; display: grid; grid-template-columns: 40px 1fr; gap: 14px; line-height: 1.65; }
.notice h2 { margin: 0 0 8px; font-size: 17px; }
.notice p {
  margin: 0 0 7px;
  color: #556379;
  font-size: 13px;
  overflow-wrap: anywhere;
  word-break: keep-all;
}
.notice p:last-child { margin-bottom: 0; }
.notice-icon {
  width: 36px; height: 36px; display: grid; place-items: center;
  border-radius: 50%; font-weight: 900; font-size: 17px;
}
.info-notice { background: #f5f9ff; border-color: #d8e7fb; }
.info-notice .notice-icon { background: #deecff; color: #2164bf; }
.verify-notice { background: #fffaf1; border-color: #f1dfbf; }
.verify-notice .notice-icon { background: #ffefcf; color: #7c5b23; }

.comparison-card { margin-top: 16px; }

footer {
  padding: 30px 4px 6px;
  display: grid; grid-template-columns: 1fr auto; gap: 28px;
  color: #7a879a; font-size: 12px; line-height: 1.6;
}
footer strong { color: #3d4d64; }
.footer-brand {
  display: inline-block;
  font-size: 18px;
  font-weight: 900;
  color: #173f79;
  letter-spacing: -.4px;
}
.footer-tagline {
  margin: 3px 0 0;
  color: #65748a;
  font-weight: 700;
}
.independent-notice { margin: 6px 0 0; max-width: 680px; }
.footer-meta { text-align: right; }
.footer-meta p { margin: 0; }
.footer-links { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 13px; margin-top: 8px; }
.footer-links a { color: #52617a; font-weight: 700; text-decoration: none; }

.legal-page { max-width: 820px; padding-top: 28px; }
.legal-hero {
  min-height: 0;
  display: block;
  padding: 22px 0 10px;
}
.legal-hero::after { display: none; }
.legal-brand {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  margin-bottom: 30px;
  text-decoration: none;
}
.legal-brand small {
  display: block;
  margin-top: 4px;
  color: #7c899d;
  font-size: 10px;
  font-weight: 700;
}
.legal-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 22px;
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid #e4eaf2;
}
.legal-nav a {
  color: #40516b;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}
.legal-nav a:hover { color: var(--blue); }
.legal-card { margin-top: 20px; padding: 24px; line-height: 1.85; }
.legal-card h2 { margin-top: 24px; }
.legal-card h2:first-child { margin-top: 0; }
.legal-card p, .legal-card li { color: #4f596a; }
.legal-card ul { padding-left: 22px; }

@media (max-width: 980px) {
  .site-nav { gap: 16px; }
  .hero { grid-template-columns: 1fr; gap: 28px; }
  .hero-message { max-width: 560px; }
  .crime-chips { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .summary-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .visual-grid, .detail-grid { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .container, .topbar-inner { width: min(100% - 20px,1180px); }
  .topbar-inner { min-height: 64px; position: relative; }
  .brand { gap: 9px; }
  .brand strong { font-size: 14px; }
  .brand-wordmark { font-size: 19px !important; }
  .brand small { display: block; font-size: 9px; }
  .brand-mark { flex-basis: 34px; width: 34px; height: 34px; border-radius: 11px; }
  .mark-bars { left: 8px; bottom: 7px; transform: scale(.88); transform-origin: left bottom; }
  .brand-mark b { right: 5px; top: 5px; transform: scale(.9); }
  .menu-toggle { display: inline-grid; place-items: center; }
  .site-nav {
    display: none;
    position: absolute;
    top: calc(100% + 1px);
    left: 0;
    right: 0;
    padding: 10px;
    background: rgba(255,255,255,.98);
    border: 1px solid #e0e7f0;
    border-radius: 0 0 16px 16px;
    box-shadow: 0 14px 28px rgba(25,48,79,.12);
  }
  .site-nav.open { display: grid; gap: 0; }
  .site-nav a {
    padding: 14px 12px;
    font-size: 14px;
    border-bottom: 1px solid #edf1f5;
  }
  .site-nav a:last-child { border-bottom: 0; }
  .site-nav a.active::after { display: none; }

  .hero { min-height: 0; padding: 30px 0 28px; grid-template-columns: 1fr; gap: 0; }
  .hero h1 { font-size: clamp(34px,10vw,46px); line-height: 1.08; letter-spacing: -1.4px; }
  .hero h2 { margin-top: 18px; font-size: 22px; }
  .subtitle { font-size: 14px; line-height: 1.7; }
  .hero-message { display: none; }
  .hero::after { right: -250px; opacity: .32; }

  .dashboard { padding-top: 14px; }
  .explorer { padding: 18px; border-radius: 18px; }
  .explorer-intro { align-items: flex-start; margin-bottom: 16px; }
  .explorer-icon { width: 48px; height: 48px; flex: 0 0 48px; }
  .explorer-intro h2 { font-size: 26px; }
  .explorer-intro p { font-size: 13px; line-height: 1.55; }

  .crime-chips { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .crime-chip { min-height: 82px; padding: 13px; }
  .crime-chip strong { font-size: 16px; }
  .crime-chip small { font-size: 12px; }
  .chip-icon { flex-basis: 40px; width: 40px; height: 40px; font-size: 17px; }

  .filter-row { grid-template-columns: minmax(0,1.35fr) minmax(110px,.65fr); gap: 10px; }
  .field label { font-size: 13px; }
  select { min-height: 46px; font-size: 14px; padding-left: 12px; }

  .freshness-bar {
    overflow-x: auto;
    flex-wrap: nowrap;
    gap: 0;
    padding: 11px 12px;
    scrollbar-width: thin;
  }
  .freshness-bar > span {
    flex: 0 0 auto;
    white-space: nowrap;
    padding: 0 12px;
  }
  .freshness-bar > span:first-child { padding-left: 0; }
  .freshness-bar > span:not(:first-child) { border-left: 1px solid #dde5ef; }
  .freshness-bar strong { display: none; }

  .summary-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .metric { min-height: 128px; padding: 16px; }
  .metric-top { font-size: 12px; gap: 7px; }
  .metric-icon { width: 30px; height: 30px; font-size: 14px; }
  .metric strong { margin: 14px 0 5px; font-size: clamp(27px,8vw,34px); }
  .metric small { font-size: 11px; }

  .visual-grid, .detail-grid { grid-template-columns: 1fr; }
  .visual-grid > .card, .table-card { padding: 18px; }
  .section-heading h2 { font-size: 20px; }
  .section-heading p { font-size: 12px; }

  .bars { gap: 12px; }
  .bar-row { grid-template-columns: 126px 1fr 48px; gap: 7px; }
  .bar-label { font-size: 11px; }
  .bar-value { font-size: 11px; }
  .bar-track, .trend-track { height: 12px; }

  .trend-year { grid-template-columns: 48px 1fr; gap: 8px; }
  .trend-year-label { font-size: 14px; }
  .trend-line { grid-template-columns: 68px 1fr 48px; gap: 7px; }

  .table-wrap {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    padding-bottom: 6px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .table-card { overflow: hidden; }
  table { min-width: 560px; }
  .notice-stack { width: 100%; max-width: 100%; }
  .notice { width: 100%; max-width: 100%; overflow: hidden; }
  .notice > div:last-child { min-width: 0; }
  th, td { padding: 11px 9px; font-size: 12px; }

  .notice { grid-template-columns: 34px 1fr; padding: 16px; }
  .notice h2 { font-size: 16px; }
  .notice p { font-size: 12px; }

  .legal-page { padding-top: 16px; }
  .legal-hero { padding-top: 14px; }
  .legal-brand { margin-bottom: 22px; }
  .legal-nav { gap: 8px 14px; }
  .legal-nav a { font-size: 12px; }
  footer { grid-template-columns: 1fr; gap: 14px; }
  .footer-meta { text-align: left; }
  .footer-links { justify-content: flex-start; }
}

@media (max-width: 520px) {
  .container, .topbar-inner { width: min(100% - 16px,1180px); }
  .brand strong { font-size: 13px; }
  .hero { padding: 26px 0 24px; }
  .trust-kicker { margin-bottom: 12px; font-size: 11px; }
  .hero h1 { font-size: clamp(31px,9.6vw,40px); }
  .hero h2 { font-size: 20px; }
  .subtitle { font-size: 13px; }

  .explorer { padding: 15px; }
  .explorer-intro { gap: 10px; }
  .explorer-icon { width: 42px; height: 42px; flex-basis: 42px; font-size: 23px; }
  .explorer-intro h2 { font-size: 23px; }
  .mini-label { font-size: 12px !important; }

  .crime-chips { gap: 8px; }
  .crime-chip { min-height: 76px; padding: 10px; gap: 8px; }
  .chip-icon { flex-basis: 36px; width: 36px; height: 36px; font-size: 16px; }
  .crime-chip strong { font-size: 15px; }
  .crime-chip small { font-size: 11px; }

  .filter-row { grid-template-columns: minmax(0,1.25fr) minmax(105px,.75fr); gap: 8px; }
  .freshness-bar { font-size: 11px; }

  .summary-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
  .metric { min-height: 118px; padding: 14px; border-radius: 16px; }
  .metric strong { font-size: clamp(25px,8.3vw,31px); }

  .visual-grid > .card, .table-card { padding: 15px; }
  .bar-row { grid-template-columns: 118px 1fr 44px; gap: 6px; }
  .bar-label { font-size: 10px; }
  .bar-value { font-size: 10px; }

  .trend-year { grid-template-columns: 1fr; gap: 6px; }
  .trend-line { grid-template-columns: 64px 1fr 44px; }

  .notice { grid-template-columns: 30px 1fr; padding: 14px; }
}
.content-guide {
  margin-top: 16px;
  padding: 24px;
}
.text-link {
  color: var(--blue);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
}
.text-link:hover { text-decoration: underline; }
.guide-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 14px;
  margin-top: 20px;
}
.guide-grid article {
  padding: 18px;
  border: 1px solid #e5ebf3;
  border-radius: 15px;
  background: #fbfcfe;
}
.guide-grid article > span {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  margin-bottom: 12px;
  border-radius: 9px;
  background: #eaf2ff;
  color: #2563eb;
  font-size: 11px;
  font-weight: 900;
}
.guide-grid h3 {
  margin: 0 0 8px;
  color: #213652;
  font-size: 16px;
}
.guide-grid p,
.interpret-card p {
  margin: 0;
  color: #5d6b80;
  font-size: 13px;
  line-height: 1.75;
  word-break: keep-all;
}
.interpret-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 16px;
  margin-top: 16px;
}
.interpret-card { padding: 22px; }
.interpret-card h2 {
  margin: 3px 0 10px;
  font-size: 19px;
}
.method-list {
  display: grid;
  gap: 14px;
  margin-top: 18px;
}
.method-box {
  padding: 18px;
  border: 1px solid #e4eaf2;
  border-radius: 14px;
  background: #fbfcfe;
}
.method-box h3 { margin: 0 0 7px; font-size: 16px; }
.method-box p { margin: 0; }
@media (max-width: 720px) {
  .content-guide { padding: 18px; }
  .content-guide .section-heading { align-items: flex-start; flex-direction: column; }
  .guide-grid, .interpret-grid { grid-template-columns: 1fr; }
  .guide-grid { gap: 10px; }
  .guide-grid article { padding: 15px; }
}

/* Investigator recommendation */
.recommend-page { min-height: 100vh; background: linear-gradient(180deg,#f8fbff,#f3f6fb); }
.recommend-hero { border-bottom:1px solid #dfe8f4; background:linear-gradient(120deg,#fbfdff,#edf5ff); }
.recommend-hero-inner { display:grid; grid-template-columns:1.5fr .8fr; gap:32px; align-items:center; padding:34px 0 30px; }
.recommend-hero h1 { margin:0 0 10px; font-size:clamp(32px,4vw,48px); letter-spacing:-1.6px; }
.recommend-hero p { margin:0; color:#627188; line-height:1.7; }
.recommend-principle { padding:20px 22px; border:1px solid #d7e7fb; border-radius:16px; background:#eef6ff; }
.recommend-principle strong { display:block; margin-bottom:5px; color:#173f79; }
.recommend-principle p { font-size:13px; }
.recommend-dashboard { padding:22px 0 60px; }
.recommend-grid { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:16px; }
.recommend-form-card,.ranking-card { padding:22px; min-width:0; }
.recommend-heading { display:flex; align-items:flex-start; gap:12px; }
.recommend-heading-icon { width:38px; height:38px; flex:0 0 38px; display:grid; place-items:center; border-radius:12px; background:#eaf2ff; color:#2563eb; font-size:20px; font-weight:900; }
.recommend-heading-icon.trophy { background:#fff5d8; color:#d79a00; }
.recommend-heading h2 { margin:0 0 4px; font-size:22px; }
.recommend-heading p { margin:0; color:#718096; font-size:13px; }
.recommend-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:22px; }
.recommend-fields label,.reason-fieldset legend { color:#263b58; font-size:13px; font-weight:800; }
.recommend-fields input,.ranking-filters input { width:100%; min-height:46px; margin-top:7px; padding:11px 13px; border:1px solid #ced9e8; border-radius:10px; background:#fff; color:#172943; font:inherit; outline:none; }
.recommend-fields input:focus,.ranking-filters input:focus { border-color:#7eabed; box-shadow:0 0 0 3px rgba(37,99,235,.08); }
.recommend-fields small { display:block; margin-top:6px; color:#8792a2; font-size:10px; font-weight:500; line-height:1.45; }
.reason-fieldset { margin:22px 0 0; padding:0; border:0; }
.reason-fieldset legend span { color:#8792a2; font-weight:600; }
.reason-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin-top:10px; }
.reason-options input { position:absolute; opacity:0; pointer-events:none; }
.reason-options span { display:block; padding:12px 13px; border:1px solid #dce6f2; border-radius:10px; background:#f8fbff; color:#40526c; font-size:12px; font-weight:750; cursor:pointer; transition:.15s ease; }
.reason-options input:checked+span { border-color:#75a8f3; background:#eaf2ff; color:#1556ad; box-shadow:0 0 0 2px rgba(37,99,235,.06); }
.recommend-submit { width:100%; min-height:50px; margin-top:10px; border:0; border-radius:11px; background:linear-gradient(135deg,#1f66e5,#2f80ed); color:#fff; font-weight:900; font-size:15px; cursor:pointer; }
.recommend-message { min-height:20px; margin:12px 0 0; color:#b45b20; font-size:12px; }
.recommend-beta { margin:9px 0 0; color:#8994a5; font-size:10px; line-height:1.5; text-align:center; }
.ranking-header { display:flex; justify-content:space-between; gap:14px; align-items:flex-start; }
.ranking-rule { padding:8px 10px; border-radius:9px; background:#edf5ff; color:#2764b6; font-size:11px; font-weight:800; white-space:nowrap; }
.ranking-filters { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)) minmax(160px,1.2fr); gap:8px; margin:22px 0 0; }
.ranking-filters select,.ranking-filters input { min-height:42px; margin:0; font-size:12px; }
.ranking-empty { min-height:330px; display:grid; place-items:center; align-content:center; text-align:center; color:#8190a3; border-top:1px solid #edf1f5; margin-top:16px; padding:35px; }
.ranking-empty span { font-size:38px; color:#90b9ef; }
.ranking-empty strong { margin-top:8px; color:#41546e; }
.ranking-empty p { max-width:480px; margin:8px 0 0; font-size:12px; line-height:1.65; }
.recommend-info-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:16px; }
.recommend-info-grid article { padding:18px; }
.recommend-info-grid article>span { display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:#eaf2ff; color:#2563eb; font-weight:900; }
.recommend-info-grid h3 { margin:10px 0 7px; font-size:15px; }
.recommend-info-grid p { margin:0; color:#68778c; font-size:12px; line-height:1.7; }
.recommend-info-grid a { display:inline-block; margin-top:8px; color:#2563eb; font-size:12px; font-weight:800; text-decoration:none; }

@media (max-width:980px){
  .recommend-hero-inner,.recommend-grid { grid-template-columns:1fr; }
  .ranking-empty { min-height:220px; }
}
@media (max-width:720px){
  .recommend-hero-inner { padding:26px 0 22px; }
  .recommend-hero h1 { font-size:32px; }
  .recommend-principle { padding:16px; }
  .recommend-dashboard { padding-top:14px; }
  .recommend-form-card,.ranking-card { padding:16px; }
  .recommend-fields,.reason-options,.recommend-info-grid { grid-template-columns:1fr; }
  .ranking-header { flex-direction:column; }
  .ranking-filters { grid-template-columns:1fr 1fr; }
}
@media (max-width:520px){
  .ranking-filters { grid-template-columns:1fr; }
  .recommend-heading h2 { font-size:20px; }
}

/* Highlight the participatory investigator recommendation nav item */
.site-nav a[href="/recommend.html"] {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 14px;
  border: 1px solid #f2c5d0;
  border-radius: 999px;
  background: linear-gradient(135deg,#fff2f5 0%,#ffe6ec 100%);
  color: #bd4265;
  font-weight: 850;
  box-shadow: 0 5px 14px rgba(190,66,101,.09);
  transition: transform .16s ease, background .16s ease, border-color .16s ease, color .16s ease, box-shadow .16s ease;
}
.site-nav a[href="/recommend.html"]::before {
  content: "♥";
  color: #e45c79;
  font-size: 12px;
  line-height: 1;
}
.site-nav a[href="/recommend.html"]:hover {
  transform: translateY(-1px);
  background: linear-gradient(135deg,#ffeaf0 0%,#ffdae4 100%);
  border-color: #eeb3c1;
  color: #aa3157;
  box-shadow: 0 7px 17px rgba(190,66,101,.13);
}
.site-nav a[href="/recommend.html"].active {
  background: linear-gradient(135deg,#ffe7ed 0%,#ffd6e0 100%);
  border-color: #eaa9ba;
  color: #a52f53;
  box-shadow: 0 6px 16px rgba(190,66,101,.14);
}
.site-nav a[href="/recommend.html"].active::after {
  display: none;
}

@media (max-width: 720px) {
  .site-nav a[href="/recommend.html"] {
    justify-content: center;
    margin: 6px 4px;
    padding: 12px 14px;
    border-bottom: 1px solid #f2c5d0;
  }
}

.ranking-results { margin-top:16px; border-top:1px solid #edf1f5; }
.rank-row { display:grid; grid-template-columns:38px minmax(180px,1fr) 70px minmax(180px,1.1fr); gap:12px; align-items:center; padding:15px 4px; border-bottom:1px solid #edf1f5; }
.rank-no { width:30px; height:30px; display:grid; place-items:center; border-radius:50%; background:#eef4ff; color:#2f69bd; font-size:12px; }
.rank-person b { display:block; color:#20344f; font-size:14px; }
.rank-person small { display:block; margin-top:4px; color:#8390a2; font-size:11px; line-height:1.45; }
.rank-count { color:#2563eb; text-align:right; font-size:14px; }
.rank-tags { display:flex; flex-wrap:wrap; gap:6px; }
.rank-tag { padding:6px 8px; border-radius:8px; background:#f0f6ff; color:#3567a8; font-size:10px; font-weight:800; }
.recommend-submit:disabled { opacity:.65; cursor:wait; }
@media (max-width:720px){
  .rank-row { grid-template-columns:32px 1fr auto; }
  .rank-tags { grid-column:2 / -1; }
}

.admin-review-page { max-width:980px; padding:28px 0 60px; }
.admin-review-header { display:grid; gap:18px; margin-bottom:18px; }
.admin-review-header h1 { margin:0 0 6px; font-size:34px; letter-spacing:-1px; }
.admin-login-card,.admin-review-card { padding:22px; }
.admin-login-card label { display:block; margin-bottom:8px; font-size:13px; font-weight:800; }
.admin-login-row { display:grid; grid-template-columns:1fr auto; gap:10px; }
.admin-login-row input { min-height:46px; padding:11px 13px; border:1px solid #ced9e8; border-radius:10px; font:inherit; }
.admin-login-row button,.admin-review-toolbar button { border:0; border-radius:10px; background:#2563eb; color:#fff; font-weight:800; padding:0 16px; cursor:pointer; }
.admin-review-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding-bottom:14px; border-bottom:1px solid #edf1f5; }
.admin-review-toolbar h2 { margin:0; font-size:20px; }
.admin-review-toolbar p { margin:4px 0 0; color:#7b8799; font-size:12px; }
.admin-review-list { display:grid; gap:12px; margin-top:16px; }
.admin-review-item { padding:16px; border:1px solid #e2e9f2; border-radius:14px; background:#fbfcfe; }
.admin-review-main { display:flex; justify-content:space-between; gap:16px; }
.admin-review-main strong { font-size:16px; }
.admin-review-main p { margin:4px 0 0; color:#68778c; font-size:12px; }
.admin-review-main time { color:#8a96a6; font-size:11px; white-space:nowrap; }
.admin-reasons { display:flex; flex-wrap:wrap; gap:7px; margin-top:12px; }
.admin-reasons span { padding:6px 9px; border-radius:8px; background:#eef5ff; color:#3567a8; font-size:11px; font-weight:800; }
.admin-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:14px; }
.admin-actions button { min-height:38px; padding:0 12px; border-radius:9px; font-weight:800; cursor:pointer; }
.verify-btn { border:1px solid #b8ddc6; background:#eefaf2; color:#287a45; }
.reject-btn { border:1px solid #efc8cf; background:#fff3f5; color:#b43d52; }
.admin-empty { padding:38px 16px; text-align:center; color:#7f8c9f; }
@media (max-width:720px){
  .admin-review-page { padding-top:16px; }
  .admin-login-row { grid-template-columns:1fr; }
  .admin-login-row button { min-height:44px; }
  .admin-review-main { flex-direction:column; gap:6px; }
  .admin-review-main time { white-space:normal; }
  .admin-actions { justify-content:stretch; }
  .admin-actions button { flex:1; }
}

/* Complaint / petition writer */
.complaint-page { min-height:100vh; background:linear-gradient(180deg,#f8fbff,#f3f6fb); }
.complaint-hero { border-bottom:1px solid #dde7f3; background:linear-gradient(120deg,#fbfdff,#edf5ff); }
.complaint-hero-inner { display:grid; grid-template-columns:1.35fr .65fr; gap:30px; align-items:center; padding:38px 0 34px; }
.complaint-hero h1 { margin:0 0 12px; font-size:clamp(34px,4.5vw,54px); line-height:1.08; letter-spacing:-1.9px; }
.complaint-hero p { margin:0; max-width:720px; color:#627188; line-height:1.75; }
.complaint-privacy-note { padding:20px 22px; border:1px solid #cfe1f8; border-radius:16px; background:#eef6ff; }
.complaint-privacy-note strong { display:block; color:#173f79; margin-bottom:6px; }
.complaint-privacy-note p { font-size:12px; }
.complaint-shell { padding:22px 0 60px; }
.doc-choice-card,.complaint-form-card,.mailing-card,.complaint-actions { padding:24px; margin-bottom:16px; }
.choice-questions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:20px; }
.choice-questions label>span,.complaint-fields label,.fact-blocks label>span { display:block; margin-bottom:7px; color:#263b58; font-size:13px; font-weight:800; line-height:1.45; }
.choice-questions select,.complaint-fields input,.fact-blocks input,.fact-blocks textarea { width:100%; min-height:46px; padding:11px 13px; border:1px solid #ced9e8; border-radius:10px; background:#fff; color:#172943; font:inherit; outline:none; }
.fact-blocks textarea { resize:vertical; line-height:1.65; }
.choice-questions select:focus,.complaint-fields input:focus,.fact-blocks input:focus,.fact-blocks textarea:focus { border-color:#7eabed; box-shadow:0 0 0 3px rgba(37,99,235,.08); }
.doc-advice { margin-top:14px; padding:15px 16px; border:1px solid #dfe6ef; border-radius:12px; background:#f8fafc; color:#65748a; font-size:13px; line-height:1.7; }
.doc-advice strong { display:block; margin-bottom:3px; color:#233953; }
.doc-advice.recommend { border-color:#bcd8ff; background:#edf5ff; }
.doc-advice.petition { border-color:#cce6d7; background:#f0faf4; }
.doc-advice.caution { border-color:#f1ddb1; background:#fff8e8; }
.doc-type-picker { display:flex; flex-wrap:wrap; align-items:center; gap:14px; margin-top:16px; padding:14px 16px; border-radius:12px; background:#f7f9fc; }
.doc-type-picker>span { margin-right:4px; font-weight:900; }
.doc-type-picker label { font-size:13px; font-weight:800; }
.doc-difference-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:16px; }
.doc-difference-grid article { padding:15px; border:1px solid #e3eaf2; border-radius:12px; background:#fff; }
.doc-difference-grid strong { color:#223b5d; font-size:14px; }
.doc-difference-grid p { margin:6px 0 0; color:#6b788b; font-size:12px; line-height:1.65; }
.writing-rule { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:18px 0; }
.writing-rule>div { padding:14px 16px; border-radius:12px; }
.writing-rule>div:first-child { background:#fff4f4; border:1px solid #f2d2d5; }
.writing-rule>div:last-child { background:#f0f8ff; border:1px solid #cee3f8; }
.writing-rule span { font-size:11px; font-weight:900; }
.writing-rule p { margin:6px 0 0; font-size:12px; line-height:1.65; color:#5c687a; }
.complaint-fields { display:grid; gap:14px; margin-top:18px; }
.complaint-fields.two { grid-template-columns:repeat(2,minmax(0,1fr)); }
.complaint-fields .full { grid-column:1 / -1; }
.fact-blocks { display:grid; gap:15px; margin-top:18px; }
.fact-blocks small { color:#8a96a6; font-weight:600; }
.punishment-check { display:flex; align-items:flex-start; gap:9px; margin-top:18px; padding:14px; border-radius:12px; background:#f7f9fc; font-size:13px; font-weight:800; color:#263b58; }
.mail-guide { margin-top:16px; padding:14px 16px; border-radius:12px; background:#fff8e8; border:1px solid #f1ddb1; }
.mail-guide strong { color:#7b5b10; }
.mail-guide p { margin:5px 0 0; color:#73684f; font-size:12px; line-height:1.7; }
.complaint-actions { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.complaint-actions strong { display:block; margin-bottom:5px; }
.complaint-actions p { margin:0; color:#778396; font-size:12px; line-height:1.6; }
.complaint-actions button { min-width:180px; min-height:52px; border:0; border-radius:11px; background:linear-gradient(135deg,#1f66e5,#2f80ed); color:#fff; font-weight:900; cursor:pointer; }
.complaint-actions button:disabled { opacity:.65; cursor:wait; }
.complaint-message { margin:0 0 16px; }
.complaint-sources { padding:10px 4px 0; color:#708096; font-size:11px; line-height:1.7; }
.complaint-sources p { margin:0; }
.complaint-sources>div { display:flex; flex-wrap:wrap; gap:12px; margin-top:7px; }
.complaint-sources a { color:#2563eb; font-weight:800; text-decoration:none; }
.site-nav a[href="/complaint.html"] { color:#1d5eb9; font-weight:900; }
.pdf-stage { position:fixed; left:-10000px; top:0; width:794px; pointer-events:none; }
.pdf-sheet { width:794px; min-height:1123px; padding:72px 66px; background:#fff; color:#111; font-family:"Noto Sans KR","Malgun Gothic",Arial,sans-serif; font-size:15px; line-height:1.75; }
.pdf-title { margin-bottom:34px; text-align:center; font-size:32px; font-weight:900; letter-spacing:12px; }
.pdf-info { width:100%; border-collapse:collapse; margin-bottom:26px; }
.pdf-info th,.pdf-info td { border:1px solid #777; padding:9px 10px; font-size:13px; text-align:left; }
.pdf-info th { width:92px; background:#f5f5f5; }
.pdf-section { margin:20px 0; }
.pdf-section h3 { margin:0 0 8px; padding-bottom:6px; border-bottom:1px solid #bbb; font-size:17px; }
.pdf-section>div { white-space:normal; word-break:break-word; }
.pdf-closing { margin-top:34px; text-align:right; }
.pdf-closing h2 { margin-top:30px; text-align:center; font-size:22px; }
.pdf-footnote { margin-top:34px; padding-top:12px; border-top:1px solid #ccc; color:#666; font-size:10px; }
.envelope-sheet { position:relative; }
.envelope-title { text-align:center; font-size:27px; font-weight:900; margin-bottom:50px; }
.envelope-box { border:2px solid #222; padding:22px; }
.envelope-box span { display:block; color:#666; font-size:12px; margin-bottom:10px; }
.envelope-box strong { display:block; font-size:24px; margin-bottom:10px; }
.envelope-box p { margin:4px 0; font-size:16px; }
.envelope-box small { display:inline-block; margin-top:16px; padding:5px 9px; border:1px solid #777; }
.envelope-box.receiver { margin:40px 0 100px 180px; }
.envelope-box.sender { width:58%; }
.envelope-note { margin-top:50px; padding:14px; border-top:1px solid #ccc; color:#666; font-size:12px; }
@media (max-width:900px){
  .complaint-hero-inner { grid-template-columns:1fr; }
  .choice-questions,.doc-difference-grid,.complaint-fields.two,.writing-rule { grid-template-columns:1fr; }
  .complaint-fields .full { grid-column:auto; }
}
@media (max-width:720px){
  .complaint-hero-inner { padding:28px 0 24px; }
  .complaint-hero h1 { font-size:34px; }
  .complaint-shell { padding-top:14px; }
  .doc-choice-card,.complaint-form-card,.mailing-card,.complaint-actions { padding:16px; }
  .complaint-actions { flex-direction:column; align-items:stretch; }
  .complaint-actions button { width:100%; }
}

.false-report-warning { display:grid; grid-template-columns:40px 1fr; gap:12px; margin-top:18px; padding:16px 18px; border:1px solid #f0c9cf; border-radius:13px; background:#fff5f6; }
.false-report-icon { width:36px; height:36px; display:grid; place-items:center; border-radius:50%; background:#ffe2e6; color:#c43f56; font-weight:900; font-size:18px; }
.false-report-warning strong { display:block; margin-bottom:6px; color:#9f2f43; font-size:14px; }
.false-report-warning p { margin:4px 0 0; color:#6d5960; font-size:12px; line-height:1.7; }
@media (max-width:520px){
  .false-report-warning { grid-template-columns:32px 1fr; padding:14px; }
  .false-report-icon { width:30px; height:30px; font-size:15px; }
}