/* Help icon + popup */
.help-icon {
  display:inline-block; width:18px; height:18px; line-height:16px;
  text-align:center; border-radius:50%;
  border:1px solid rgba(255,255,255,0.4); color:#a5b4fc; font-weight:600; font-size:12px;
  cursor:pointer; margin-left:6px;
}
.help-popup {
  position:absolute; background:rgba(15,23,42,0.95);
  border:1px solid rgba(148,163,184,0.3); border-radius:8px; color:#e5e7eb;
  font-size:0.9rem; padding:0.6rem 0.8rem; max-width:260px; z-index:9999;
  box-shadow:0 4px 10px rgba(0,0,0,0.4);
}

/* Submit overlay */
.submit-overlay{
  position: fixed; inset: 0; display: none; align-items: center; justify-content: center;
  z-index: 2000; background: linear-gradient(180deg, rgba(2,6,23,.85), rgba(2,6,23,.95));
  backdrop-filter: blur(6px);
}
.submit-overlay.show{ display: flex; }
.submit-panel{
  width: min(720px, 92vw); border: 1px solid rgba(255,255,255,.08); border-radius: 16px;
  padding: 2rem; background: linear-gradient(180deg, rgba(17,24,39,.92), rgba(15,23,42,.92));
  color: #e5e7eb; box-shadow: 0 10px 40px rgba(0,0,0,.35);
}

/* Loading overlay */
.loading-overlay {
  position: fixed; inset: 0; display: none; align-items: center; justify-content: center;
  background: rgba(0, 0, 0, 0.6); z-index: 3000;
}
.loading-overlay.show { display: flex; }

/* Base layout */
html, body {
  height: 100%; max-width: 100%; overflow-x: hidden; margin: 0; padding: 0;
}

/* iOS-safe фон: без background-attachment: fixed */
body { background: none; position: relative; min-height: 100vh; }
body::before {
  content: ''; position: fixed; inset: 0;
  background: url('bg.jpg') no-repeat center center; background-size: cover; z-index: -2;
}
body::after {
  content: ''; position: fixed; inset: 0;
  background: rgba(0,0,0,0.5); pointer-events: none; z-index: -1;
}

.app-shell{ min-height: 100vh; display: flex; flex-direction: column;
  justify-content: center; padding-bottom: env(safe-area-inset-bottom); box-sizing: border-box; }
.navbar{ background: linear-gradient(120deg,#111827,#0b1220); }
.brand-gradient{ background: linear-gradient(90deg,#60a5fa,#a78bfa,#22d3ee);
  -webkit-background-clip: text; background-clip: text; color: transparent; }

.card{
  border: 1px solid rgba(255,255,255,.05);
  background: linear-gradient(180deg, rgba(17,24,39,.85), rgba(15,23,42,.85));
  backdrop-filter: blur(8px); color: #e5e7eb;
}

.form-label{color:#cbd5e1}
.text-soft{color:#94a3b8}
.progress{height:10px; background: rgba(255,255,255,.08)}
.progress-bar{background: linear-gradient(90deg,#60a5fa,#a78bfa,#22d3ee)}
.pill{
  display:inline-flex; align-items:center; gap:.5rem; padding:.25rem .5rem;
  border-radius:999px; font-size:.85rem; background: rgba(148,163,184,.15);
  color:#e5e7eb; border:1px solid rgba(148,163,184,.25);
}
.pill .x{cursor:pointer; opacity:.8}
.footer-actions{
  position: sticky; bottom: 0; left: 0; right: 0;
  padding: .75rem; padding-bottom: env(safe-area-inset-bottom);
  border-top: 1px solid rgba(255,255,255,.08);
  background: linear-gradient(180deg, rgba(11,18,32,.75), rgba(11,18,32,.95));
  backdrop-filter: blur(8px);
}
.step-title{font-weight: 700;}
.list-group-item{background: transparent; color:#e5e7eb; border-color: rgba(255,255,255,.08)}
.invalid-feedback{display:block}
.help-badge{
  font-size:.75rem; border:1px dashed rgba(255,255,255,.25); color:#a5b4fc; padding:.2rem .5rem; border-radius:999px
}
a, a:visited{color:#93c5fd}
.screen-badge{font-size:.75rem; color:#f0abfc}

/* Центровка карточки/контента */
main.container{
  flex-grow: 1; display: flex; align-items: center; justify-content: center;
  flex-direction: column; overflow-y: auto; max-width: 100%; padding: 1rem; box-sizing: border-box;
}

/* Анти-двойной тап / жесты */
html, body { touch-action: manipulation; }