:root{
  --bg:#0b1020;
  --card:#0f172a;
  --text:#e5e7eb;
  --muted:#94a3b8;
  --border:#1f2a44;
  --primary:#2563eb;
  --primary2:#1d4ed8;
  --danger:#ef4444;
  --ok:#22c55e;
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  background: radial-gradient(1200px 700px at 20% 0%, #111b36 0%, var(--bg) 55%);
  color:var(--text);
}
.topbar{
  position:sticky;
  top:0;
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:14px 18px;
  border-bottom:1px solid var(--border);
  background:rgba(11,16,32,.85);
  backdrop-filter: blur(10px);
}
.brand{font-weight:650; letter-spacing:.2px}
.topbar-actions{display:flex; gap:14px}
.container{max-width:1100px; margin:0 auto; padding:24px}
.container-narrow{max-width:520px}
.grid{display:grid; gap:18px}
.card{
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
  border:1px solid var(--border);
  border-radius:14px;
  padding:18px;
}
.h1{margin:0 0 10px 0; font-size:22px}
.muted{color:var(--muted)}
.form{display:grid; gap:12px; margin-top:12px}
.label{font-size:13px; color:var(--muted)}
.input{
  width:100%;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid var(--border);
  background:#0b1226;
  color:var(--text);
}
.btn{
  appearance:none;
  border:1px solid var(--border);
  background:#0b1226;
  color:var(--text);
  padding:10px 12px;
  border-radius:10px;
  cursor:pointer;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}
.btn:hover{border-color:#2b3b63}
.btn-primary{
  border-color:rgba(37,99,235,.6);
  background:linear-gradient(180deg, rgba(37,99,235,.9), rgba(29,78,216,.9));
}
.btn-primary:hover{filter:brightness(1.05)}
.btn-secondary{
  border-color:rgba(148,163,184,.35);
  background:rgba(148,163,184,.06);
}
.link{color:#c7d2fe; text-decoration:none}
.link:hover{text-decoration:underline}
.alert{
  padding:10px 12px;
  border-radius:10px;
  border:1px solid var(--border);
  background:rgba(148,163,184,.06);
}
.alert-error{border-color:rgba(239,68,68,.5); background:rgba(239,68,68,.08)}
.alert-ok{border-color:rgba(34,197,94,.5); background:rgba(34,197,94,.08)}
.segmented{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.segmented-item{
  display:flex;
  gap:10px;
  align-items:center;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--border);
  background:rgba(148,163,184,.04);
  cursor:pointer;
}
.segmented-item input{margin:0}
.hint{margin-top:10px; color:var(--muted); font-size:13px}
.row{display:flex; align-items:center}
.row-between{justify-content:space-between}
.row-gap{gap:10px}
.row-wrap{flex-wrap:wrap; gap:12px}
.report-frame{padding:0; overflow:hidden}
.report-frame iframe{width:100%; height:75vh; border:0; border-radius:14px}
code{background:rgba(148,163,184,.10); padding:2px 6px; border-radius:8px; border:1px solid var(--border)}

