/* base.css — color tokens + resets + layout primitives */
:root{
  --bg: #0b1220;
  --card: #111726;
  --muted: #94a3b8;
  --text: #e5e7eb;
  --text-weak:#cbd5e1;
  --primary: #2563eb;
  --primary-600:#1e4fd1;
  --accent: #22d3ee;
  --border: #1f2a44;
  --danger:#ef4444;
  --success:#10b981;
  --focus: #7dd3fc;
  --radius: 14px;
  --shadow: 0 10px 30px rgba(0,0,0,.25);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji";
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}

a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline}

.container{max-width:1100px; margin:0 auto; padding:24px}
.card{
  background:var(--card); border:1px solid var(--border);
  border-radius:var(--radius); box-shadow: var(--shadow);
  padding:22px;
}

.grid{display:grid; gap:16px}
.grid-2{grid-template-columns: 1fr 1fr}
.grid-3{grid-template-columns: repeat(3,1fr)}

.m-0{margin:0} .mt-2{margin-top:8px} .mt-3{margin-top:12px} .mt-4{margin-top:16px} .mt-6{margin-top:24px}
.center{display:grid; place-items:center}

.text-muted{color:var(--muted)}
.small{font-size:12px}