/* Vobix simple flows: one visual language for security, referrals and public invite. */
:root{
  --vobix-flow-bg:#061d36;
  --vobix-flow-panel:#0b2b49;
  --vobix-flow-panel-soft:#0a3658;
  --vobix-flow-line:#285b7a;
  --vobix-flow-accent:#0095ff;
  --vobix-flow-accent-2:#00c8ff;
  --vobix-flow-text:#f5fbff;
  --vobix-flow-muted:#b6cbdf;
  --vobix-flow-ok:#7df4a4;
  --vobix-flow-warn:#ffd37a;
}
body.vobixSimpleFlow{
  margin:0;
  background:radial-gradient(circle at 75% 0,#0d3860,var(--vobix-flow-bg) 70%);
  color:var(--vobix-flow-text);
  font-family:system-ui,-apple-system,Segoe UI,Arial,sans-serif;
}
body.vobixSimpleFlow>header{
  background:rgba(6,29,54,.97);
  border-bottom:1px solid var(--vobix-flow-line);
  color:var(--vobix-flow-text);
}
body.vobixSimpleFlow>header :is(a,b,span){color:var(--vobix-flow-text)}
body.vobixSimpleFlow>main{max-width:680px;text-align:left}
body.vobixSimpleFlow .flowHero{text-align:center;margin:4px auto 16px;max-width:620px}
body.vobixSimpleFlow .flowHero h1{margin:6px 0 8px}
body.vobixSimpleFlow .flowEyebrow{
  margin:0 0 6px;
  color:var(--vobix-flow-accent-2);
  font-size:12px;
  font-weight:850;
  letter-spacing:.08em;
}
body.vobixSimpleFlow .flowMuted{color:var(--vobix-flow-muted);line-height:1.45}
body.vobixSimpleFlow .flowCard,
body.vobixSimpleFlow .check,
body.vobixSimpleFlow .card{
  box-sizing:border-box;
  width:100%;
  margin:0 0 12px;
  padding:14px;
  border:1px solid var(--vobix-flow-line);
  border-radius:16px;
  background:var(--vobix-flow-panel);
  color:var(--vobix-flow-text);
  box-shadow:0 12px 30px rgba(0,0,0,.16);
}
body.vobixSimpleFlow .flowCard>h2,
body.vobixSimpleFlow .check>h2{text-align:center}
body.vobixSimpleFlow .flowActions{display:grid;gap:8px;margin-top:12px}
body.vobixSimpleFlow :is(button,.flowButton,.primary,.secondary){
  box-sizing:border-box;
  width:100%;
  min-height:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:12px;
  padding:10px 14px;
  font:inherit;
  font-weight:800;
  text-decoration:none;
  text-align:center;
  cursor:pointer;
}
body.vobixSimpleFlow :is(button,.flowButton,.primary){background:linear-gradient(100deg,#086ceb,var(--vobix-flow-accent));color:#fff}
body.vobixSimpleFlow .secondary{background:#143a59;color:#fff;border:1px solid var(--vobix-flow-line)}
body.vobixSimpleFlow input:not([type=checkbox]):not([type=radio]){
  width:100%;
  min-height:46px;
  box-sizing:border-box;
  padding:10px 12px;
  border:1px solid var(--vobix-flow-line);
  border-radius:10px;
  background:#061d36;
  color:#fff;
  font:inherit;
}
body.vobixSimpleFlow .flowGrid{display:grid;gap:10px}
body.vobixSimpleFlow .flowGrid .card{text-align:center;text-decoration:none}
body.vobixSimpleFlow .flowGrid .card b{display:block;font-size:18px}
body.vobixSimpleFlow .flowGrid .card small{display:block;margin-top:5px;color:var(--vobix-flow-muted);line-height:1.4}
body.vobixSimpleFlow .progress{height:10px;border-radius:999px;background:#143a59;overflow:hidden}
body.vobixSimpleFlow .progress>span{display:block;height:100%;background:var(--vobix-flow-accent-2);width:0}
body.vobixSimpleFlow .flowMetric{text-align:center;font-size:32px;font-weight:900}
body.vobixSimpleFlow .code{text-align:center;font-size:22px;font-weight:900;letter-spacing:.08em;color:#7ddcff}
body.vobixSimpleFlow .result{text-align:center;line-height:1.45}
body.vobixSimpleFlow .ok,.vobixSimpleFlow .success{color:var(--vobix-flow-ok)}
body.vobixSimpleFlow .warn{color:var(--vobix-flow-warn)}
@media(min-width:640px){body.vobixSimpleFlow .flowActions.compact{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:360px){body.vobixSimpleFlow .code{font-size:18px;letter-spacing:.05em}}
