:root {
  --bg: #0f1724;
  --card: #0b1220;
  --muted: #9aa4b2;
  --accent: #2dd4bf;
  --glass: rgba(255,255,255,0.03);
}
*{box-sizing:border-box}
body {
  font-family: Inter, sans-serif;
  margin: 0;
  min-height: 100vh;
  background: linear-gradient(180deg, #071025 0%, #071a2b 60%);
  color: #e6eef6;
  padding: 18px;
}
.topbar{display:flex;justify-content:space-between;align-items:center;padding:10px 18px;margin-bottom:12px;color:var(--muted)}
.card{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(0,0,0,0.04));padding:18px;border-radius:12px;box-shadow:0 6px 24px rgba(2,6,23,0.6)}
.grid{display:grid;grid-template-columns:1fr 420px;gap:18px}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.btn{padding:8px 12px;border-radius:10px;background:var(--accent);color:#012026;border:none;cursor:pointer}
.result{background:rgba(255,255,255,0.015);padding:12px;border-radius:10px;border:1px solid rgba(255,255,255,0.02)}
body.light{background:linear-gradient(180deg,#f7fafc,#eef2f7);color:#0b1220}