:root{--bg:#0b1220;--surface:#101a2b;--panel:#0e1726;--border:#203052;--text:#e9eef7;--muted:#a9b4c7;--accent:#7aa2ff;--accent-2:#12c48b}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;line-height:1.45}
a{color:var(--accent);text-decoration:none}
.wrap{max-width:1100px;margin:0 auto;padding:24px}
.header{display:flex;align-items:center;gap:12px;padding:18px 0}
.brand{font-weight:800;font-size:1.05rem}
.card{background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:22px;box-shadow:0 10px 30px rgba(0,0,0,.35)}
h1{margin:0 0 8px}
.sub{color:var(--muted);margin:0 0 18px}
label{display:block;color:var(--muted);font-size:.9rem;margin:10px 0 6px}
input,textarea,select{width:100%;background:#0c1528;color:var(--text);border:1px solid #2a3555;border-radius:12px;padding:12px 14px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:900px){.row{grid-template-columns:1fr}}
.actions{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.btn{appearance:none;border:none;cursor:pointer;background:var(--accent);color:#081024;font-weight:700;border-radius:12px;padding:12px 16px}
.btn.secondary{background:#1f2a46;color:var(--text)}
.stepper{display:flex;gap:8px;margin:8px 0 16px;flex-wrap:wrap}
.chip{padding:6px 10px;border:1px solid #243154;border-radius:999px;color:var(--muted);font-size:.8rem}
.chip.active{background:#1b2744;color:var(--text);border-color:#385092}
.hidden{display:none!important}
.table{width:100%;border-collapse:collapse}
.table th,.table td{border-bottom:1px solid var(--border);padding:8px 6px;text-align:left}
.muted{color:var(--muted)}
.logo-watermark{position:fixed;right:2%;bottom:2%;width:18vw;max-width:160px;opacity:.06;pointer-events:none;z-index:0}
footer{color:var(--muted);padding:24px;text-align:center}

/* ===== Mobile polish / overlap fixes ===== */
.header{position:relative;flex-wrap:wrap;gap:12px}
.header nav{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}
.card{position:relative}
h1{font-size:clamp(1.3rem, 5.2vw, 2.2rem);line-height:1.2}
.wrap{padding:18px}
.row{gap:10px}
.btn{padding:11px 14px}
/* prevent hero blocks from colliding on narrow screens */
@media (max-width:720px){
  .wrap{padding:14px}
  .card{padding:16px;border-radius:16px}
  .stepper{gap:6px}
  .chip{font-size:.75rem;padding:5px 8px}
}
/* Keep watermark from overlapping touch targets on small screens */
.logo-watermark{right:3%;bottom:3%;width:32vw;max-width:120px;opacity:.05}