:root{
  --bg:#0b1020;
  --panel:#121a35;
  --accent:#7c5cff;
  --accent-2:#22d3ee;
  --text:#e8ecff;
  --muted:#9aa5c3;
  --ok:#22c55e;
  --warn:#f59e0b;
  --error:#ef4444;
  --border:#223055;
  --shadow: 0 10px 30px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif;
  background:linear-gradient(180deg, #0b1020 0%, #0e1430 100%);
  color:var(--text);
}
.container{max-width:980px;margin:40px auto;padding:0 20px}
header{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:22px}
.title{font-size:clamp(22px,4vw,34px);font-weight:700;letter-spacing:.3px}
.subtitle{color:var(--muted);font-size:14px}

.card{
  background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.00));
  border:1px solid var(--border);
  border-radius:16px; box-shadow:var(--shadow);
  padding:22px; margin:16px 0;
}
form{display:grid; gap:18px}
fieldset{border:1px dashed var(--border); border-radius:14px; padding:18px}
legend{padding:0 8px; color:var(--accent-2); font-weight:600}
label{display:block; font-weight:600; margin:10px 0 6px}

input[type="text"], input[type="email"], input[type="tel"], input[type="url"], input[type="number"], textarea, select{
  width:100%; padding:12px 14px; border-radius:10px; border:1px solid var(--border);
  background:#0f1630; color:var(--text); outline:none; transition:border .2s, box-shadow .2s;
}
textarea{min-height:120px; resize:vertical}
input:focus, textarea:focus, select:focus{
  border-color:var(--accent); box-shadow:0 0 0 4px rgba(124,92,255,.15)
}

.row{display:grid; grid-template-columns:1fr; gap:12px}
@media(min-width:720px){.row{grid-template-columns:1fr 1fr}}
.help{color:var(--muted); font-size:12px; margin-top:4px}

.options{display:flex; flex-wrap:wrap; gap:10px; margin-top:6px}
.chip{display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border:1px solid var(--border); border-radius:999px; background:#0f1630}

.actions{display:flex; gap:12px; flex-wrap:wrap; align-items:center}
button{
  appearance:none; border:0; padding:12px 16px; border-radius:12px; cursor:pointer; font-weight:700;
}
.btn-primary{background:linear-gradient(135deg, var(--accent), #5b8cff); color:white}
.btn-secondary{background:#0f1630; color:var(--text); border:1px solid var(--border)}

.status{display:none; padding:12px 14px; border-radius:12px; font-weight:600}
.status.ok{display:block; background:rgba(34,197,94,.1); color:var(--ok); border:1px solid rgba(34,197,94,.35)}
.status.error{display:block; background:rgba(239,68,68,.08); color:var(--error); border:1px solid rgba(239,68,68,.35)}

.req{color:var(--warn); font-weight:700}
.footer{color:var(--muted); font-size:12px; margin-top:8px}
.hidden{display:none !important}