.ob-demo{background:var(--paper);width:100%;min-height:100svh;color:var(--ink);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-family:var(--font-lexend), sans-serif;flex-direction:column;display:flex}.ob-demo[data-color-scheme-preview=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}.ob-header,.ob-footer{justify-content:space-between;align-items:center;gap:16px;padding:24px 32px;display:flex}.ob-header{min-height:96px}.ob-wordmark{align-items:center;gap:12px;min-width:0;font-size:14px;font-weight:700;display:flex}.ob-wordmark>span:last-child{overflow-wrap:anywhere;min-width:0}.ob-demo .duo-wordmark{color:var(--brand-ink);font-size:1.35rem}.ob-mark{background:var(--brand);width:36px;height:36px;color:var(--brand-contrast);box-shadow:0 4px 0 var(--action-primary-shadow);border-radius:12px;flex-shrink:0;place-items:center;padding-bottom:2px;font-size:18px;font-weight:700;line-height:1.2;display:inline-grid}.ob-body{flex:1;place-items:center;padding:48px 24px 64px;display:grid}.ob-stage{text-align:center;width:100%;max-width:720px;animation:.24s ease-out both ob-arrive}.ob-stage h1{letter-spacing:normal;overflow-wrap:anywhere;margin:0;font-size:40px;font-weight:700;line-height:1.2}.ob-stage h1:focus{outline:none}.ob-step-0 h1{font-size:48px;animation:.48s ease-out both ob-arrive}.ob-description{color:var(--ink-soft);margin:24px 0 0;font-size:16px;font-weight:500;line-height:1.6}.ob-fields{text-align:left;gap:32px;max-width:440px;margin:40px auto 0;display:grid}.ob-brand-fields{grid-template-columns:minmax(0,1fr) 64px;gap:16px;display:grid}.ob-fields .ink-input{width:100%;min-width:0}.ob-appearance,.ob-demo .ob-continue{margin-top:40px}.ob-brand-signature{overflow-wrap:anywhere;justify-content:center;align-items:center;gap:12px;margin-top:32px;font-weight:700;display:flex}.ob-brand-signature>span:last-child{min-width:0}.ob-footer{min-height:96px}.ob-footer-action,.ob-footer-spacer{flex:1}.ob-progress{align-items:center;gap:8px;display:flex}.ob-progress span{background:var(--ink-line);border-radius:4px;width:8px;height:4px}.ob-progress .is-current{background:var(--brand);width:24px}.ob-progress .is-done{background:var(--ink-soft)}.ob-workspace-preview{max-width:480px;margin:40px auto 0}.ob-demo :is(button,input):focus-visible{outline:3px solid var(--info);outline-offset:4px}@keyframes ob-arrive{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media (max-width:600px){.ob-header,.ob-footer{padding:16px 20px}.ob-header{min-height:80px}.ob-body{padding:32px 20px 40px}.ob-stage h1{font-size:30px}.ob-step-0 h1{font-size:36px}.ob-description{font-size:14px}.ob-fields,.ob-appearance,.ob-demo .ob-continue{margin-top:32px}.ob-footer{min-height:80px}.ob-footer-spacer{display:none}.ob-wordmark{font-size:12px}}@media (prefers-reduced-motion:reduce){.ob-demo *,.ob-demo{transition:none!important;animation:none!important}}
