/* public/css/atlas.css */
:root { --ink:#0e1726; --paper:#fff; --accent:#2f6df6; --muted:#6c7a93; --line:#e6ebf2; }
* { box-sizing: border-box; }
body.atlas { margin:0; font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; color:var(--ink); background:var(--paper); }
.atlas-header { padding:16px 24px; border-bottom:1px solid var(--line); }
.atlas-logo { font-weight:800; text-decoration:none; color:var(--ink); font-size:18px; }
.atlas-logo span { color:var(--accent); }
.atlas-show { max-width:920px; margin:0 auto; padding:32px 24px 48px; }
.atlas-show h1 { font-size:30px; line-height:1.2; margin:0 0 12px; }
.atlas-lead { font-size:18px; color:#33415c; margin:0 0 16px; }
.atlas-chips { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:20px; }
.atlas-chip { background:#f1f5fb; border:1px solid var(--line); border-radius:999px; padding:5px 12px; font-weight:600; font-size:14px; }
.atlas-coverage { padding:10px 14px; border-radius:8px; margin-bottom:20px; font-size:15px; }
.atlas-coverage.is-rich { background:#eef6ff; }
.atlas-coverage.is-sparse { background:#fff6e9; }
.atlas-report-btn { background:none; border:none; color:var(--accent); font:inherit; font-weight:600; cursor:pointer; padding:0; text-decoration:underline; }
.atlas-map { position:relative; width:100%; margin:8px 0 24px; }
.atlas-svg { width:100%; height:auto; background:#f7f9fc; border-radius:10px; }
.atlas-c { fill:#dde5ef; stroke:#fff; stroke-width:0.4; }
.atlas-c.has-brand { fill:var(--accent); }
.atlas-c.has-brand:hover { fill:#1b4fd0; }
.atlas-tooltip { position:absolute; pointer-events:none; background:var(--ink); color:#fff; padding:6px 9px; border-radius:6px; font-size:13px; max-width:240px; }
.atlas-country-list { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:1fr; gap:6px; }
.atlas-country-list li { display:flex; gap:10px; align-items:baseline; padding:8px 0; border-bottom:1px solid var(--line); }
.atlas-flag { font-weight:700; min-width:34px; color:var(--muted); font-size:13px; }
.atlas-country-name { min-width:160px; font-weight:600; }
.atlas-brands { color:#33415c; }
.atlas-brand { margin-right:8px; }
.atlas-verified { color:#1a9e57; }
.atlas-honesty { background:#fff6e9; border-radius:10px; padding:18px; }
.atlas-footer { max-width:920px; margin:0 auto; padding:24px; border-top:1px solid var(--line); color:var(--muted); font-size:13px; }
.atlas-footer a { color:var(--muted); }
@media (min-width:720px){ .atlas-country-list { grid-template-columns:1fr 1fr; } }

/* Hub */
.atlas-hub { max-width:920px; margin:0 auto; padding:32px 24px 48px; }
.atlas-hero { text-align:center; padding:32px 0 24px; }
.atlas-hero h1 { font-size:34px; margin:0 0 8px; }
.atlas-search-wrap { position:relative; max-width:560px; margin:18px auto 0; }
.atlas-search { width:100%; padding:14px 18px; font-size:18px; border:2px solid var(--line); border-radius:12px; }
.atlas-search:focus { outline:none; border-color:var(--accent); }
.atlas-suggest { list-style:none; margin:6px 0 0; padding:6px; position:absolute; left:0; right:0; background:#fff; border:1px solid var(--line); border-radius:10px; box-shadow:0 8px 24px rgba(14,23,38,.1); text-align:left; z-index:5; }
.atlas-suggest li a { display:block; padding:8px 10px; text-decoration:none; color:var(--ink); border-radius:6px; }
.atlas-suggest li a:hover { background:#f1f5fb; }
.atlas-examples { margin-top:14px; display:flex; gap:8px; justify-content:center; flex-wrap:wrap; }
.atlas-example { background:#f1f5fb; border-radius:999px; padding:5px 12px; text-decoration:none; color:#33415c; font-weight:600; font-size:14px; }
.atlas-showcase h2 { font-size:20px; margin:24px 0 12px; }
.atlas-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.atlas-tile { display:flex; flex-direction:column; gap:2px; padding:12px 14px; border:1px solid var(--line); border-radius:10px; text-decoration:none; color:var(--ink); }
.atlas-tile:hover { border-color:var(--accent); }
.atlas-tile-name { font-weight:700; }
.atlas-tile-count { color:var(--muted); font-size:13px; }
@media (min-width:720px){ .atlas-grid { grid-template-columns:repeat(4,1fr); } }