/* IP Lookup - shared design system (single source of truth) */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#0a0e1a;--bg-card:#121829;--bg-subtle:#1a2236;
  --text:#e6ebf5;--text-secondary:#8a93a6;--text-muted:#5c6478;
  --accent:#6366f1;--accent-hover:#4f46e5;--accent-soft:rgba(99,102,241,.14);--accent-2:#22d3ee;
  --success:#34d399;--error:#f87171;
  --border:#1e2740;--border-strong:#2a3550;
  --radius:12px;--radius-sm:8px;
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
@media(prefers-color-scheme:light){
  :root{--bg:#f7f8fa;--bg-card:#ffffff;--bg-subtle:#eef1f6;--text:#0f172a;--text-secondary:#56607a;--text-muted:#8b94a8;--accent:#6366f1;--accent-hover:#4f46e5;--accent-soft:rgba(99,102,241,.10);--border:#e6e9f0;--border-strong:#d3d8e2}
}
body{background:var(--bg);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5;min-height:100vh}
h1{font-size:30px;font-weight:700;letter-spacing:-.5px;line-height:1.2}
h2{font-size:20px;font-weight:600;line-height:1.3}
h3{font-size:17px;font-weight:600;line-height:1.4}
p{line-height:1.7}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
a:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:2px}
code{background:var(--bg-card);padding:2px 6px;border-radius:var(--radius-sm);font-size:14px;font-family:var(--mono);color:var(--text)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* card */
.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:24px}
.card.tested{border-color:rgba(99,102,241,.4)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 20px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg);color:var(--text);font-size:14px;font-weight:500;cursor:pointer;transition:background .2s,border-color .2s,transform .1s;font-family:var(--font)}
.btn:hover{background:var(--bg-subtle);border-color:var(--accent)}
.btn:active{transform:scale(.97)}
.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}
.btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.btn-primary{background:var(--accent);color:#fff;border-color:var(--accent)}
.btn-primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}
.btn .spinner{display:inline-block;width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .6s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* topbar (sub-pages) */
.topbar{display:flex;align-items:center;max-width:720px;margin:0 auto;padding:24px 24px 0}
.topbar-brand{display:inline-flex;align-items:center;gap:8px;color:var(--text);text-decoration:none;font-weight:600;font-size:16px}
.topbar-brand:hover{text-decoration:none}
.topbar-brand svg{width:28px;height:28px}


