:root { color-scheme: dark; }
html, body { font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; }

.grid-bg{
  background-image:
    linear-gradient(to right, rgba(255,255,255,0.05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,0.05) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(ellipse at top, black 40%, transparent 75%);
}

.stat { padding: .25rem 0; }

.card{
  position:relative; padding: 1.25rem; border-radius: 14px;
  background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01));
  border: 1px solid rgba(255,255,255,0.07);
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}
.card:hover{ transform: translateY(-2px); border-color: rgba(124,240,194,0.35); background: linear-gradient(180deg, rgba(34,211,164,0.06), rgba(255,255,255,0.02)); }
.icon-wrap{
  height: 40px; width: 40px; border-radius: 10px; display:flex; align-items:center; justify-content:center;
  background: rgba(34,211,164,0.12); color:#7cf0c2; border:1px solid rgba(34,211,164,0.25);
  margin-bottom: .75rem;
}

.big-card{
  padding: 1.75rem; border-radius: 18px;
  background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01));
  border: 1px solid rgba(255,255,255,0.08);
}
.chip{ display:inline-flex; align-items:center; gap:.35rem; padding:.25rem .6rem; font-size:.7rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:#7cf0c2; background: rgba(34,211,164,0.1); border:1px solid rgba(34,211,164,0.25); border-radius:999px; }
.chip-muted{ display:inline-flex; padding:.25rem .6rem; font-size:.7rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:#94a3b8; background: rgba(148,163,184,0.08); border:1px solid rgba(148,163,184,0.2); border-radius:999px; }
.dot{ width:.5rem; height:.5rem; border-radius:999px; background:#22d3a4; display:inline-block; margin-top:.45rem; flex:none; }

.prose-dark p { color:#cbd5e1; }
.prose-dark h2 { color:#fff; }
.prose-dark h3 { color:#fff; }
.prose-dark a { color:#7cf0c2; }

/* form */
input, textarea, select{
  width:100%; background: rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.1);
  border-radius: 10px; padding:.75rem .9rem; color:#e2e8f0; font-size: .95rem;
}
input:focus, textarea:focus, select:focus{
  outline:none; border-color:#22d3a4; box-shadow: 0 0 0 3px rgba(34,211,164,0.25);
}
label{ font-size:.85rem; color:#94a3b8; font-weight:500; display:block; margin-bottom:.4rem; }
