

    /* ── Modal (global) ── */
    .modal-overlay {
      display: none;
      position: fixed;
      inset: 0;
      z-index: 200;
      background: rgba(18,21,31,.45);
      backdrop-filter: blur(4px);
      align-items: flex-end;
      justify-content: center;
    }
    .modal-overlay.open { display: flex; }
    @media (min-width: 640px) { .modal-overlay { align-items: center; } }
    .modal {
      background: var(--white);
      border-radius: 16px 16px 0 0;
      padding: 8px 20px 36px;
      width: 100%;
      max-width: 460px;
      box-shadow: var(--shadow-md);
      animation: slideUp .18s ease;
    }
    @media (min-width: 640px) { .modal { border-radius: 16px; padding: 28px 24px; } }
    @keyframes slideUp {
      from { transform: translateY(28px); opacity: 0; }
      to { transform: translateY(0); opacity: 1; }
    }
    .modal-handle {
      width: 36px;
      height: 4px;
      background: var(--border);
      border-radius: 2px;
      margin: 12px auto 20px;
    }
    @media (min-width: 640px) { .modal-handle { display: none; } }
    .modal-title {
      font-family: 'Geologica', sans-serif;
      font-size: 18px;
      font-weight: 600;
      letter-spacing: -0.02em;
      margin-bottom: 4px;
    }
    .modal-subtitle {
      font-size: 13.5px;
      color: var(--text-2);
      margin-bottom: 20px;
      line-height: 1.5;
    }
    .modal-form-group { margin-bottom: 14px; }
    .modal-form-label {
      font-size: 13px;
      font-weight: 600;
      color: var(--text);
      display: block;
      margin-bottom: 6px;
    }
    .modal-form-control {
      width: 100%;
      font-family: 'Onest', sans-serif;
      font-size: 14px;
      color: var(--text);
      background: var(--bg);
      border: 1px solid var(--border);
      border-radius: var(--radius);
      padding: 10px 14px;
      outline: none;
      transition: border-color .15s;
      appearance: none;
    }
    .modal-form-control:focus { border-color: var(--accent); }
    textarea.modal-form-control { min-height: 100px; resize: vertical; line-height: 1.55; }
    .modal-form-hint { font-size: 12px; color: var(--text-3); margin-top: 4px; }
    .modal-actions { display: flex; gap: 8px; margin-top: 20px; }
    .modal-actions .btn { flex: 1; }
    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      font-family: 'Onest', sans-serif;
      font-size: 14px;
      font-weight: 600;
      border-radius: var(--radius-pill);
      border: none;
      cursor: pointer;
      transition: background .15s;
      padding: 10px 20px;
    }
    .btn-primary { background: var(--accent); color: var(--white); }
    .btn-primary:hover { background: var(--accent-hover); }
    .btn-ghost { background: var(--white); color: var(--text); border: 1px solid var(--border); }
    .btn-ghost:hover { background: var(--bg); }


     .modal-form-error { font-size: 12px; color: #e53935; font-weight: 500; margin-top: 5px; }                            
     .modal-form-control.error { border-color: #e53935; box-shadow: 0 0 0 3px rgba(229,57,53,.08); }                                     
     