html { scroll-behavior: smooth; -webkit-tap-highlight-color: transparent; }
body { font-family: 'Inter', system-ui, sans-serif; background: #f6f8fb; color: #0b1b3a; }
[x-cloak] { display: none !important; }
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
.glass { background: rgba(255,255,255,.72); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.grad-text { background: linear-gradient(90deg,#10b981,#0f766e 60%,#0284c7); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero-bg {
  background:
    radial-gradient(900px 400px at 85% -10%, rgba(16,185,129,.18), transparent 60%),
    radial-gradient(700px 360px at -10% 10%, rgba(2,132,199,.12), transparent 60%),
    #f6f8fb;
}
.dark-bg {
  background:
    radial-gradient(600px 300px at 90% 0%, rgba(16,185,129,.25), transparent 60%),
    radial-gradient(500px 300px at 0% 100%, rgba(251,191,36,.12), transparent 60%),
    #0b1b3a;
}
.dots { background-image: radial-gradient(rgba(11,27,58,.12) 1px, transparent 1px); background-size: 18px 18px; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; font-weight:600; border-radius:.9rem; padding:.7rem 1.2rem; transition:.2s; white-space:nowrap; }
.btn-primary { background:linear-gradient(135deg,#10b981,#0f766e); color:#fff; box-shadow:0 8px 20px -8px rgba(5,150,105,.6); }
.btn-primary:hover { transform:translateY(-1px); box-shadow:0 12px 24px -8px rgba(5,150,105,.7); }
.btn-ghost { background:#fff; color:#0b1b3a; border:1px solid #d3dbe8; }
.btn-ghost:hover { border-color:#10b981; color:#059669; }
.input { width:100%; border:1px solid #d3dbe8; background:#fff; border-radius:.85rem; padding:.72rem .95rem; outline:none; transition:.15s; font-size:.95rem; }
.input:focus { border-color:#10b981; box-shadow:0 0 0 4px rgba(16,185,129,.15); }
.label { display:block; font-size:.8rem; font-weight:600; color:#4a5f85; margin-bottom:.35rem; }
.card { background:#fff; border:1px solid #eaeef5; border-radius:1.1rem; box-shadow:0 1px 2px rgba(11,27,58,.05), 0 8px 24px -10px rgba(11,27,58,.1); }
.chip { display:inline-flex; align-items:center; gap:.35rem; font-size:.72rem; font-weight:600; padding:.2rem .6rem; border-radius:999px; }
.pb { padding-bottom: calc(5.5rem + env(safe-area-inset-bottom, 0px)); }
input[type=range] { accent-color: #10b981; width:100%; }
.reveal { opacity:0; transform:translateY(18px); transition:.6s ease; }
.reveal.in { opacity:1; transform:none; }