:root {
      --blue: #048FBF;
      --dark: #111827;
      --muted: #6b7280;
      --line: #e5e7eb;
      --bg: #f4f7fb;
      --card: #ffffff;
      --success: #0f766e;
    }
    * { box-sizing: border-box; }
    body {
      margin: 0;
      min-height: 100vh;
      font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
      background:
        radial-gradient(circle at top left, rgba(4,143,191,.14), transparent 36%),
        linear-gradient(135deg, #f8fbff 0%, #eef4f9 100%);
      color: var(--dark);
      display: flex;
      align-items: center;
      justify-content: center;
      padding: clamp(20px, 4vw, 56px);
    }
    .app {
      width: min(100%, 920px);
      min-height: min(82vh, 900px);
      background: rgba(255,255,255,.9);
      border: 1px solid rgba(255,255,255,.7);
      border-radius: 36px;
      box-shadow: 0 28px 80px rgba(15, 23, 42, .12);
      overflow: hidden;
      display: flex;
      flex-direction: column;
    }
    .topbar {
      padding: 30px clamp(28px, 5vw, 56px) 20px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
      border-bottom: 1px solid rgba(229,231,235,.8);
    }
    .logo svg { width: min(354px, 52vw); height: auto; display: block; }
    .language {
      display: flex;
      align-items: center;
      gap: 10px;
      background: #f3f6fa;
      padding: 8px;
      border-radius: 999px;
      border: 1px solid #e7ecf2;
    }
    .lang-btn {
      border: 0;
      background: transparent;
      padding: 12px 18px;
      border-radius: 999px;
      font-size: 16px;
      font-weight: 700;
      color: #526070;
      cursor: pointer;
      min-width: 88px;
    }
    .lang-btn.active { background: #111827; color: white; }
    .content {
      flex: 1;
      padding: clamp(32px, 6vw, 72px);
      display: flex;
      flex-direction: column;
      justify-content: center;
    }
    .screen { display: none; animation: fade .18s ease-out; }
    .screen.active { display: block; }
    @keyframes fade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
    .eyebrow { color: var(--blue); font-weight: 800; font-size: 18px; margin-bottom: 12px; }
    h1 { font-size: clamp(42px, 7vw, 78px); line-height: .98; letter-spacing: -0.05em; margin: 0; }
    .subtitle { font-size: clamp(22px, 3vw, 30px); color: var(--muted); margin: 24px 0 44px; line-height: 1.35; }
    .choice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
    .choice {
      appearance: none;
      border: 2px solid transparent;
      background: #111827;
      color: white;
      min-height: 220px;
      border-radius: 34px;
      padding: 34px;
      text-align: left;
      cursor: pointer;
      box-shadow: 0 18px 45px rgba(17,24,39,.18);
      transition: transform .15s ease, box-shadow .15s ease;
    }
    .choice:nth-child(2) { background: var(--blue); box-shadow: 0 18px 45px rgba(4,143,191,.2); }
    .choice:active { transform: scale(.985); }
    .choice-icon { font-size: 58px; margin-bottom: 28px; }
    .choice-title { font-size: clamp(34px, 5vw, 52px); font-weight: 900; letter-spacing: -.04em; display:block; }
    .choice-sub { display:block; margin-top: 12px; font-size: 19px; opacity:.86; line-height:1.35; }
    .form-card { max-width: 680px; margin: 0 auto; }
    .form-title { display:flex; align-items:center; gap:16px; margin-bottom: 34px; }
    .form-title h2 { margin:0; font-size: clamp(36px, 5vw, 56px); letter-spacing:-.04em; }
    .back { border:0; background:#eef2f6; border-radius:999px; width:56px; height:56px; font-size:28px; cursor:pointer; }
    label { display:block; font-size: 18px; font-weight: 800; margin: 22px 0 9px; }
    input, select {
      width: 100%;
      min-height: 64px;
      border: 1px solid #d9e1ea;
      border-radius: 18px;
      padding: 0 18px;
      font-size: 22px;
      background: white;
    }
    .optional { display:none; }
    .optional.visible { display:block; }
    .submit {
      margin-top: 34px;
      width:100%;
      min-height: 74px;
      border:0;
      border-radius: 22px;
      font-size: 24px;
      font-weight: 900;
      background: #111827;
      color:white;
      cursor:pointer;
    }
    .submit[disabled] { opacity:.55; cursor:not-allowed; }
    .success-card {
      max-width: 680px;
      margin: 0 auto;
      text-align: center;
      padding: 50px 20px;
    }
    .success-icon { font-size: 82px; margin-bottom: 20px; }
    .success-card h2 { font-size: clamp(40px, 6vw, 64px); margin:0; letter-spacing:-.04em; }
    .success-card p { font-size: 24px; color: var(--muted); line-height:1.4; }
    .note {
      margin-top: 24px;
      padding: 16px 18px;
      border-radius: 16px;
      background: #f3f7fb;
      color: #506070;
      font-size: 15px;
      line-height:1.45;
    }
    @media (max-width: 740px), (orientation: portrait) and (max-width: 900px) {
      body { padding: 16px; align-items: stretch; }
      .app { min-height: calc(100vh - 32px); border-radius: 28px; }
      .topbar { flex-direction: column; align-items: stretch; padding: 26px 24px 18px; }
      .logo { display:flex; justify-content:center; }
      .logo svg { width: min(354px, 76vw); }
      .language { justify-content:center; width:100%; }
      .lang-btn { flex:1; font-size: 18px; min-height: 52px; }
      .content { padding: 32px 24px; }
      h1 { font-size: clamp(46px, 11vw, 74px); }
      .subtitle { font-size: 24px; margin-bottom: 30px; }
      .choice-grid { grid-template-columns: 1fr; gap: 20px; }
      .choice { min-height: 180px; border-radius: 28px; }
      .choice-icon { font-size: 48px; margin-bottom: 18px; }
      .choice-title { font-size: 44px; }
    }

.field-note {
  margin-top: 8px;
  color: #506070;
  font-size: 15px;
  line-height: 1.4;
}

#errorScreen .submit {
  max-width: 360px;
  margin-left: auto;
  margin-right: auto;
}

@media (orientation: landscape) and (min-width: 900px) {
  .app {
    min-height: min(82vh, 860px);
  }
}