.forms-lesson .forms-demo{padding:var(--cf-space-250) var(--cf-space-350);border:1px solid var(--cf-color-border-control);border-radius:var(--cf-radius-150);background:var(--cf-color-surface);color:var(--cf-color-text);font-size:var(--cf-font-size-325)}.forms-lesson .forms-demo p{margin:0 0 var(--cf-space-100)}.forms-lesson .forms-demo label{display:inline-flex;flex-wrap:wrap;align-items:center;gap:var(--cf-space-150)}.forms-lesson .forms-demo input{width:10rem;max-width:100%;padding:var(--cf-space-050) var(--cf-space-150);border:1px solid var(--cf-color-border-strong);border-radius:var(--cf-radius-100);background:var(--cf-color-surface-raised);color:var(--cf-color-text);font:inherit}.forms-lesson .forms-demo input[aria-invalid=true]{border-color:var(--cf-color-danger-border)}.forms-lesson .forms-demo button{margin:var(--cf-space-100) var(--cf-space-100) 0 0;padding:var(--cf-space-050) var(--cf-space-250);border:1px solid var(--cf-color-border-strong);border-radius:var(--cf-radius-100);background:var(--cf-color-surface-raised);color:var(--cf-color-text);font:inherit;font-size:var(--cf-font-size-300);cursor:pointer}.forms-lesson .forms-demo button:hover{border-color:var(--cf-color-border-hover)}.forms-lesson .forms-demo form{display:flex;flex-wrap:wrap;align-items:center;gap:var(--cf-space-150)}.forms-lesson .forms-demo form button{margin:0}.forms-lesson .forms-demo form p{flex-basis:100%}.forms-lesson .forms-subheading{margin:var(--cf-space-250) 0 var(--cf-space-100);color:var(--cf-color-text-secondary);font-size:var(--cf-font-size-275)}.forms-lesson .forms-log{display:grid;grid-gap:var(--cf-space-100);gap:var(--cf-space-100);margin:0;padding:0;list-style:none;font-size:var(--cf-font-size-300)}.forms-lesson .forms-log li{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--cf-space-150);padding:var(--cf-space-100) var(--cf-space-200);border:1px solid var(--cf-color-border);border-radius:var(--cf-radius-100);background:var(--cf-color-surface-raised);overflow-wrap:anywhere}.forms-lesson .forms-empty{color:var(--cf-color-text-secondary);font-size:var(--cf-font-size-300)}.forms-lesson .forms-error{margin:var(--cf-space-100) 0 0;color:var(--cf-color-danger);font-size:var(--cf-font-size-300)}.forms-lesson .forms-warning{margin:var(--cf-space-300) 0;padding:var(--cf-space-200) var(--cf-space-300);border-left:3px solid var(--cf-color-warning-border);border-radius:var(--cf-radius-100);background:var(--cf-color-warning-subtle);color:var(--cf-color-text);font-family:var(--cf-font-mono);font-size:var(--cf-font-size-275);overflow-wrap:anywhere}