:root {
  color-scheme: dark;
  font-family: Inter, system-ui, Arial, sans-serif;
}
body {
  margin: 0;
  background: #080b14;
  color: #e6ecff;
}
.app {
  max-width: 720px;
  margin: 1.5rem auto;
  background: #111827;
  padding: 1.5rem;
  border-radius: 14px;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
  border: 1px solid #27324a;
}
.header h1 { margin-bottom: .5rem; }
.progress-wrap { margin: 1rem 0 1.5rem; }
.progress-info { display:flex; justify-content:space-between; font-size:.9rem; color:#aab6d3; }
.progress-bar { height:10px; background:#27324a; border-radius:999px; overflow:hidden; }
#progress-fill { height:100%; width:0%; background:linear-gradient(90deg,#4f7dff,#7ea6ff); transition: width .25s ease; }
.screen { display:none; }
.screen.active { display:block; }
.screen-illustration {
  width: 58px;
  height: 58px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  font-size: 1.8rem;
  background: linear-gradient(145deg, #1c2740, #141d31);
  border: 1px solid #2d3c5f;
  margin: 0 0 .85rem;
}
.options { display:grid; gap:.6rem; margin-top: .8rem; }
.options button {
  color:#e6ecff;
  border:1px solid #334263; border-radius:10px; background:#192338; padding:.8rem; text-align:left; cursor:pointer;
}
.options button.selected { border-color:#6c92ff; background:#243457; }
.help { color:#aab6d3; margin-top:0; }
select, textarea, input {
  color:#e6ecff;
  background:#0f1728;
  width:100%; padding:.7rem; border-radius:8px; border:1px solid #334263; margin:.4rem 0 1rem;
  font-size:1rem; box-sizing:border-box;
}
label { display:block; font-weight:600; }
.actions { margin-top:1rem; display:flex; justify-content:space-between; gap:.8rem; }
button.primary, button.secondary {
  border:none; border-radius:10px; padding:.8rem 1rem; cursor:pointer; font-size:1rem;
}
button.primary { background:#4f7dff; color:#fff; }
button.secondary { background:#27324a; color:#dce5ff; }
.hidden { display:none !important; }
.error { color:#ff8b8b; min-height:1.3rem; font-size:.95rem; }
.slider-value { display:flex; justify-content:space-between; align-items:center; margin-top:.6rem; }
@media (max-width: 720px){
  .app { margin: 0; min-height: 100vh; border-radius:0; }
}