.demo-form{position:relative;display:flex;flex-direction:column;gap:1.25rem;padding:2rem;border-radius:3px;background:#111827b3;border:1px solid rgba(27,35,51,.8);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.demo-form__grid{display:grid;grid-template-columns:1fr;gap:1.25rem}@media(min-width:640px){.demo-form__grid--cols-2{grid-template-columns:1fr 1fr}}.demo-form__field{display:flex;flex-direction:column;gap:.5rem;min-width:0}.demo-form__field--full{grid-column:1 / -1}.demo-form__label{font-family:var(--font-body);font-size:.75rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--color-muted-400)}.demo-form__label span[aria-hidden=true]{color:var(--color-brand-400);margin-left:.25rem}.demo-form__input,.demo-form__select,.demo-form__textarea{width:100%;border-radius:3px;border:1px solid rgba(42,50,68,.8);background:#0a0f1acc;padding:.75rem 1rem;font-family:var(--font-body);font-size:.875rem;color:var(--color-ink-50);transition:border-color .16s ease,box-shadow .16s ease}.demo-form__input::placeholder,.demo-form__textarea::placeholder{color:var(--color-muted-400)}.demo-form__input:focus,.demo-form__select:focus,.demo-form__textarea:focus{outline:none;border-color:var(--color-brand-500);box-shadow:0 0 0 3px #2f80ff4d}.demo-form__input[aria-invalid=true],.demo-form__select[aria-invalid=true],.demo-form__textarea[aria-invalid=true]{border-color:#f87171}.demo-form__textarea{resize:vertical;min-height:7.5rem;font-family:var(--font-body);line-height:1.55}.demo-form__select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%239CA3AF' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;padding-right:2.5rem}.demo-form__error{font-family:var(--font-body);font-size:.75rem;color:#f87171;margin-top:.125rem}.demo-form__warning{display:inline-flex;align-items:center;gap:.375rem;font-family:var(--font-body);font-size:.75rem;color:#fde68a;background:#eab30814;border:1px solid rgba(234,179,8,.3);padding:.375rem .625rem;border-radius:3px;margin-top:.125rem}.demo-form__warning-dot{width:.375rem;height:.375rem;border-radius:9999px;background:#facc15;flex-shrink:0}.demo-form__checkbox-row{display:flex;align-items:flex-start;gap:.625rem;padding:.75rem 0}.demo-form__checkbox{flex-shrink:0;margin-top:.125rem;width:1rem;height:1rem;accent-color:var(--color-brand-500);cursor:pointer}.demo-form__checkbox-label{font-family:var(--font-body);font-size:.875rem;color:var(--color-muted-300);line-height:1.5;cursor:pointer}.demo-form__submit-row{display:flex;flex-direction:column;gap:.625rem;margin-top:.5rem}.demo-form__submit{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:3px;background:var(--color-brand-500);padding:.875rem 1.75rem;font-family:var(--font-body);font-size:1rem;font-weight:600;color:var(--color-ink-50);box-shadow:var(--shadow-cta-glow);border:none;cursor:pointer;transition:background .16s ease,transform .16s ease}.demo-form__submit:hover:not(:disabled){background:var(--color-brand-400);transform:translateY(-1px)}.demo-form__submit:disabled{opacity:.6;cursor:not-allowed}.demo-form__footnote{font-family:var(--font-body);font-size:.75rem;color:var(--color-muted-400);line-height:1.5}.demo-form__error-banner{font-family:var(--font-body);font-size:.8125rem;color:#fecaca;background:#dc26261f;border:1px solid rgba(220,38,38,.35);padding:.75rem 1rem;border-radius:3px;line-height:1.5}.demo-form__success{display:flex;flex-direction:column;align-items:flex-start;gap:1rem;padding:2.5rem 2rem;border-radius:3px;background:#111827b3;border:1px solid rgba(45,212,191,.35);box-shadow:0 20px 60px -20px #2dd4bf40;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.demo-form__success-icon{width:3rem;height:3rem;border-radius:9999px;background:#2dd4bf26;border:1px solid rgba(45,212,191,.45);display:flex;align-items:center;justify-content:center;color:var(--color-accent-400)}.demo-form__success h3{font-family:var(--font-display);font-size:1.5rem;font-weight:600;color:var(--color-ink-50);line-height:1.25}.demo-form__success p{font-family:var(--font-body);font-size:.9375rem;color:var(--color-muted-300);line-height:1.55}.demo-form__success-footnote{font-size:.8125rem!important;color:var(--color-muted-400)!important}.demo-form__success-footnote a{color:var(--color-brand-400);text-decoration:none;font-weight:500}.demo-form__success-footnote a:hover{color:var(--color-brand-500);text-decoration:underline}