*, *::before, *::after { box-sizing: border-box; }
    body { margin:0; font-family:system-ui,sans-serif; background:#ffffff; color:#111; }
    .site-header { background:#f5f5f7; border-bottom:1px solid #ddd; }
    header { display:flex; align-items:center; padding:.6rem .8rem; background:#f5f5f7; border-bottom:1px solid #ddd; gap:.4rem; flex-wrap: wrap; }
    header h1 { font-size:1.1rem; margin-right:1rem; margin-top:0; margin-bottom:0; }
    .btn { border:1px solid #ccc; background:#f0f0f2; color:#111; padding:.35rem .7rem; border-radius:.5rem; cursor:pointer; font-size:.85rem; margin-bottom: 2px; }
    .btn:hover { background: #252525; }
    .btn.active { outline:2px solid #22d3ee; }
    a.btn { text-decoration:none; display:inline-block; }
    .btn.ghost { background:transparent; border-color:#ccc; }
    .content { padding:.8rem; }
    .charts { display:grid; grid-template-columns:1fr 1fr 1fr; gap:.8rem; margin-bottom:.8rem; }
    .chart-card { background:#f8f8fa; border:1px solid #ddd; border-radius:.6rem; padding:.8rem; }
    .chart-card h2 { font-size:.9rem; color:#888; margin-top:0; font-weight:normal; }
    .chart-bar-row { display:flex; align-items:center; gap:.5rem; margin:.3rem 0; font-size:.85rem; }
    .chart-label { width:140px; text-align:right; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .chart-bar-wrap { flex:1; height:22px; background:#f0f0f2; border-radius:3px; }
    .chart-bar { height:100%; border-radius:3px; }
    .chart-bar.dns { background:#2563eb; }
    .chart-bar.mx  { background:#2563eb; }
    .chart-bar.cert { background:#059669; }
    .chart-count { width:40px; color:#888; }
    .table-wrap { background:#f8f8fa; border:1px solid #ddd; border-radius:.6rem; overflow:hidden; }
    table { width:100%; border-collapse:collapse; font-size:.85rem; }
    th { background:#f0f0f2; padding:.7rem; text-align:left; border-bottom:1px solid #ccc; position:sticky; top:0; }
    td { padding:.7rem; border-bottom:1px solid #eee; vertical-align:top; }
    .prov-tag { display:inline-block; background:#e8ecf4; border:1px solid #c4cdd9; border-radius:.3rem; padding:.1rem .4rem; margin:2px; font-size:.8rem; }
    .spof-warn { background:#fee2e2; border-color:#991b1b; }
    .mx-tag { background:#ede9fe; border-color:#4c3b8f; }
    .mx-tag.spof-warn { background:#fee2e2; border-color:#991b1b; }
    .prov-tag.as-ok { background:#dcfce7; border-color:#166534; color:#166534; }
    .prov-tag.as-spof { background:#fee2e2; border-color:#991b1b; color:#991b1b; }
    .cert-box { margin-bottom:6px; border-left:3px solid #333; padding-left:6px; font-size: 0.8rem; }
    .cert-na { border-color:#444; color:#777; font-style: italic; }
    .search-wrap { display: flex; gap: 0.5rem; margin-left: auto; align-items: center; }
    .footer { background:#f5f5f7; color:#111; padding:.8rem; border-top:1px solid #ddd; }
    @media (max-width: 1100px) { .charts { grid-template-columns: 1fr; } }
      .map-spinner{position:absolute;top:50%;left:50%;z-index:1000;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:.5rem}.map-spinner .dot{width:40px;height:40px;border:4px solid #ddd;border-top:4px solid #2563eb;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.map-spinner span{font-size:.85rem;color:#888}

    #map { width:100%; height:75vh; min-height:0; overflow:hidden; position:relative; }
    .legend { background:#f5f5f7; color:#111; padding:.6rem .7rem; border-radius:.6rem; font-size:.85rem; box-shadow:0 2px 10px rgba(0,0,0,.1); border:1px solid #ddd; position:relative; }
    .legend-close { position:absolute; top:2px; right:6px; background:none; border:none; color:#888; font-size:1.1rem; cursor:pointer; line-height:1; padding:2px; }
    .legend-close:hover { color:#111; }
    .legend-show { position:fixed; bottom:24px; left:10px; z-index:800; background:#f5f5f7; color:#111; border:1px solid #ddd; border-radius:.5rem; width:32px; height:32px; font-size:1rem; cursor:pointer; display:none; box-shadow:0 2px 10px rgba(0,0,0,.1); }
    .legend .row { margin:.25rem 0; }
    .sw { display:inline-block; width:14px; height:14px; margin-right:.45rem; vertical-align:middle; border:1px solid #0006; }
    .error-banner { position:absolute; left:10px; top:60px; z-index:1000; background:#ffe8e8; color:#5a0000; padding:.45rem .6rem; border:1px solid #f5b1b1; border-radius:.4rem; display:none; }
    .popup b { color:#111 }
    .kv { display:grid; grid-template-columns:auto 1fr; gap:.15rem .6rem; }
    .leaflet-popup-content-wrapper { background:#ffffff; border:1px solid #ddd; color:#111; }
    .leaflet-popup-tip { background:#ffffff; border:1px solid #ddd; }