/* app.css ── メディル 第1版の見た目（A18 §6） */
:root{
  --sumi:#10151B;        /* 墨：文字・罫線・グラフの既定 */
  --ao:#0E7C86;          /* 青緑：主役1つだけ */
  --ao-dark:#3FB3BF;     /* 暗い背景での主役 */
  --bg:#FFFFFF;
  --bg2:#F6F7F8;
  --line:#D8DCE0;
  --muted:#5B6570;
  --w:min(1040px, 100% - 32px);   /* スマホ幅で横スクロールを出さない */
  --mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, "Noto Sans Mono", monospace;
}
*{box-sizing:border-box}
html{ -webkit-text-size-adjust:100% }
body{
  margin:0; background:var(--bg); color:var(--sumi);
  font:16px/1.75 "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", system-ui, sans-serif;
  font-feature-settings:"palt" 1;
}
a{color:var(--ao)}
a:hover{text-decoration:none}
.skip{position:absolute;left:-9999px}
.skip:focus{left:8px;top:8px;background:var(--bg);padding:8px;z-index:10}

/* 見出し ─ 結論を書かない（A18 §5-3） */
h1{font-size:1.6rem;line-height:1.45;margin:24px 0 4px}
h2{font-size:1.15rem;margin:0 0 12px;padding-bottom:6px;border-bottom:2px solid var(--sumi)}
.sub{margin:0 0 16px;color:var(--muted);display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.lead{margin:8px 0 24px;max-width:62ch}

/* 枠 */
.site{display:flex;justify-content:space-between;align-items:center;gap:16px;
      width:var(--w);margin:0 auto;padding:14px 0}
.brand img{display:block}
.site-nav{display:flex;gap:16px;font-size:.95rem}
main{width:var(--w);margin:0 auto;padding-bottom:64px}
.sec{margin:32px 0}

/* このページのデータ（A18 §4-1） */
.jiten{width:var(--w);margin:0 auto 8px;padding:8px 12px;background:var(--bg2);
       border-left:3px solid var(--ao);font-size:.85rem;line-height:1.6;color:var(--muted)}
.jiten-label{font-weight:700;color:var(--sumi)}

/* 値 ─ 数字は等幅で桁をそろえる（A18 §6-2） */
.v{font-variant-numeric:tabular-nums;font-family:var(--mono)}
.v-miss{color:var(--muted);font-family:inherit}
.unit{font-family:inherit;font-size:.8em;margin-left:.25em;color:var(--muted)}
.note{display:inline-block;margin-left:.5em;padding:1px 6px;border:1px solid var(--line);
      border-radius:10px;font-size:.72rem;font-family:inherit;color:var(--muted);white-space:nowrap}
.src{display:block;font-size:.72rem;font-family:inherit;color:var(--muted);margin-top:2px}

/* 見出し：値 */
.kv{display:grid;grid-template-columns:max-content 1fr;gap:6px 20px;margin:0}
.kv dt{color:var(--muted);font-size:.9rem}
.kv dd{margin:0}

/* 表 */
.scroll{overflow-x:auto}              /* 表だけ横スクロールを許す（A18 §6-3） */
.tbl{border-collapse:collapse;width:100%;font-size:.92rem}
.tbl th,.tbl td{border-bottom:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top}
.tbl thead th{border-bottom:2px solid var(--sumi);font-size:.85rem;white-space:nowrap}
.tbl td.n,.tbl th.n{text-align:right}
.tbl .strong{font-weight:700}
.tbl-src{font-size:.78rem;color:var(--muted);margin:6px 0 0}
.count{font-weight:700;margin:16px 0 8px}

/* 折りたたみ（A18 §6-3） */
.fold .hid{display:none}
.fold.open .hid{display:table-row}
.more{margin-top:10px;padding:8px 14px;border:1px solid var(--line);border-radius:6px;
      background:var(--bg);color:var(--ao);font:inherit;font-size:.9rem;cursor:pointer}
.more:hover{background:var(--bg2)}

/* 注記 ─ 欠測や収載状況（A18 §3） */
.caution{background:var(--bg2);border-left:3px solid var(--muted);padding:10px 14px;margin:12px 0;font-size:.92rem}
.state{background:var(--bg2);border-left:3px solid var(--ao);padding:10px 14px;margin:12px 0;font-size:.92rem}
.todo{color:var(--muted);font-size:.85rem;border:1px dashed var(--line);padding:8px 12px;border-radius:6px}

/* 入口のカード */
.cards{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin:24px 0}
.card{display:block;padding:16px;border:1px solid var(--line);border-radius:8px;text-decoration:none;color:inherit}
.card:hover{border-color:var(--ao);background:var(--bg2)}
.card strong{display:block;color:var(--ao);margin-bottom:4px}
.card span{font-size:.9rem;color:var(--muted)}

/* 絞り込み */
.filters{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0}
.in{font:inherit;font-size:.95rem;padding:8px 10px;border:1px solid var(--line);border-radius:6px;min-width:0;flex:1 1 180px}
.in:focus{outline:2px solid var(--ao);outline-offset:1px}

.chip{display:inline-block;padding:2px 10px;border:1px solid var(--line);border-radius:12px;
      font-size:.8rem;text-decoration:none;color:var(--ao)}
.chip-miss{color:var(--muted)}
.loading{color:var(--muted)}

/* 足元 */
.site-foot{border-top:1px solid var(--line);margin-top:48px}
.site-foot nav{width:var(--w);margin:0 auto;padding:20px 0 4px;display:flex;flex-wrap:wrap;gap:20px;font-size:.9rem}
.site-foot p{width:var(--w);margin:0 auto;padding-bottom:28px;font-size:.8rem;color:var(--muted)}

@media (max-width:520px){
  h1{font-size:1.35rem}
  .kv{grid-template-columns:1fr;gap:2px 0}
  .kv dd{margin-bottom:10px}
}

/* 地図（B2） */
.map-wrap{max-width:660px;margin:0 auto}
.map{height:min(78vh,660px);min-height:400px;border:1px solid var(--line);border-radius:8px;margin:6px 0 12px;background:var(--bg2)}
.views{display:flex;gap:8px}
.vb{padding:5px 14px;border:1px solid var(--line);border-radius:6px;background:var(--bg);
    color:var(--ao);font:inherit;font-size:.85rem;cursor:pointer}
.vb:hover{background:var(--bg2);border-color:var(--ao)}
.leaflet-container{font:inherit;font-size:.9rem;background:var(--bg2)}
.leaflet-container a{color:var(--ao)}
.leaflet-control-attribution{font-size:.7rem;background:rgba(255,255,255,.85)}
.leaflet-tooltip{font-size:.85rem;line-height:1.5}

/* 凡例 ─ 色だけで意味を伝えない（A18 §6-1） */
.lg{margin:0 0 6px}
.lg-bar{display:flex;height:14px;border:1px solid var(--line);border-radius:3px;overflow:hidden}
.lg-bar i{flex:1 1 0}
.lg-ticks{display:flex;justify-content:space-between;font-size:.78rem;color:var(--muted);
          font-variant-numeric:tabular-nums;margin-top:4px}
.lg-note,.lg-src{font-size:.78rem;color:var(--muted);margin:4px 0 0}
.lg-tada{display:block}
