.demo{margin:clamp(18px,4vw,30px) 0}.demo__core{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;padding:clamp(18px,4vw,26px);min-width:0}.demo__questions{display:grid;gap:10px;min-width:0}.demo__choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));gap:8px}.demo__choice{justify-content:flex-start;gap:10px;min-height:48px;padding-block:10px;text-align:left;line-height:1.35;white-space:normal}.demo__choice[aria-pressed=true]{border-color:var(--ink-0);color:var(--text);background:var(--void-1)}.demo__number{flex:none;font-family:var(--font-mono);font-size:12px;color:var(--muted)}.demo__choice[aria-pressed=true] .demo__number{color:var(--text)}.demo__panel{display:grid;gap:14px;min-width:0}.demo__question{margin:0;font-family:var(--font-serif);font-size:var(--text-xl);font-weight:500;letter-spacing:-.01em}.demo h3{margin:10px 0 0;font-family:var(--font-serif);font-size:var(--text-lg);font-weight:500;letter-spacing:-.01em}.demo__form{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:12px 14px;align-items:end;min-width:0;padding:16px;border:1px solid var(--hair-2);border-radius:var(--r-md)}.demo__field{display:flex;flex-direction:column;gap:8px;min-width:0}.demo__field--place{grid-column:1 / -1}.demo__label{margin:0;color:var(--muted);font-family:var(--font-sans);font-size:14px;font-weight:550}.demo__input{box-sizing:border-box;width:100%;min-width:0;min-height:46px;padding:0 14px;border:1px solid var(--hair-2);border-radius:var(--r-md);color:var(--text);background:var(--void-1);color-scheme:dark;font-size:16px;transition:border-color var(--dur-1) var(--ease)}.demo__input:hover{border-color:var(--hair-3)}.demo__input:focus-visible{outline:2px solid color-mix(in oklab,var(--accent) 75%,white);outline-offset:2px}.demo__actions{display:flex;flex-wrap:wrap;gap:8px;grid-column:1 / -1}.demo__form .demo__note,.demo__form .demo__error{grid-column:1 / -1}.demo__answer{display:grid;gap:12px;min-width:0}.demo__lead{margin:0;color:var(--text);font-size:var(--text-base);line-height:1.65;max-width:68ch}.demo__note{margin:0;color:var(--muted);font-size:var(--text-sm);line-height:1.65;max-width:68ch}.demo__note code,.demo__checked code{font-family:var(--font-mono);font-size:.9em;overflow-wrap:anywhere}.demo__error{margin:0;color:var(--sign-aries);font-size:var(--text-sm)}.demo__link{padding:0;border:0;background:none;color:var(--text);font:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}.demo__link:focus-visible{outline:2px solid var(--text-2);outline-offset:2px}.demo__table-wrap{overflow-x:auto}.demo__table-wrap:focus-visible,.demo__pre:focus-visible{outline:2px solid var(--text-2);outline-offset:2px}.demo__table{width:100%;max-width:520px;border-collapse:collapse;font-size:var(--text-sm);line-height:1.5}.demo__table th,.demo__table td{padding:7px 10px 7px 0;border-top:1px solid var(--hair-2);text-align:left;vertical-align:top;font-weight:400}.demo__table thead th{color:var(--muted);font-size:13px}.demo__table tbody th{color:var(--text-2)}.demo__people,.demo__contacts{display:grid;gap:8px;margin:0;padding-left:1.1em;color:var(--text-2);font-size:var(--text-sm);line-height:1.6;max-width:68ch}.demo__json summary{width:fit-content;padding-block:12px;color:var(--text-2);font-size:var(--text-sm);line-height:20px;cursor:pointer}.demo__json summary:focus-visible{outline:2px solid var(--text-2);outline-offset:2px}.demo__json[open] summary{color:var(--text)}.demo__pre{margin:0;padding:14px;max-height:26rem;overflow:auto;border:1px solid var(--hair-2);border-radius:var(--r-sm);font-family:var(--font-mono);font-size:12.5px;line-height:1.6;white-space:pre}.demo__checked{display:grid;gap:8px;margin-top:8px;padding:16px 18px;border:1px solid var(--hair-2);border-radius:var(--r-md)}.demo__checked h3{margin:0}.demo__checked ul{display:grid;gap:8px;margin:0;padding-left:1.1em;color:var(--text-2);font-size:var(--text-sm);line-height:1.65;max-width:68ch}.demo__digest{overflow-wrap:anywhere}.demo .field__input{box-sizing:border-box;width:100%;min-width:0;height:46px;padding:0 14px;border:1px solid var(--hair-2);border-radius:var(--r-md);color:var(--text);background:var(--void-1);color-scheme:dark;font-size:16px}.demo .field__input:hover{border-color:var(--hair-3)}.demo .field__input:focus-visible{outline:2px solid color-mix(in oklab,var(--accent) 75%,white);outline-offset:2px}.demo .field__input[aria-invalid=true]{border-color:var(--sign-aries)}.demo .place{position:relative}.demo .place__list{position:absolute;z-index:30;top:calc(100% + 6px);inset-inline:0;margin:0;padding:6px;list-style:none;border-radius:var(--r-md);border:1px solid var(--hair-2);background:var(--void-3);box-shadow:0 20px 48px -20px #000c;max-height:300px;overflow-y:auto}.demo .place__option{display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;padding:9px 10px;border:0;border-radius:var(--r-sm);background:none;color:inherit;font:inherit;text-align:start;cursor:pointer}.demo .place__option.is-active{background:#c6ccda17}.demo .place__name{font-size:14.5px;font-weight:550;color:var(--text)}.demo .place__meta{font-size:12px;color:var(--faint)}.demo .place__empty{padding:9px 10px;font-size:13px;color:var(--muted)}.demo .place__chip{display:inline-flex;align-items:center;gap:10px;max-width:100%;min-height:46px;padding-block:6px;padding-inline:14px 8px;border-radius:var(--r-md);border:1px solid color-mix(in oklab,var(--accent) 45%,transparent);background:color-mix(in oklab,var(--accent) 8%,var(--void-1))}.demo .place__chip-value{flex:1;min-width:0;padding:0;border:0;background:none;color:var(--text);font:inherit;font-size:var(--text-sm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.demo .place__chip-value:focus-visible{outline:2px solid color-mix(in oklab,var(--accent) 75%,white);outline-offset:3px}.demo .place__clear{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;border:1px solid var(--hair-2);background:none;color:var(--muted);font-size:15px;line-height:1;cursor:pointer}.demo .place__clear:hover{color:var(--text);border-color:var(--hair-3)}.demo .place__error{margin:8px 0 0;font-size:12.5px;color:var(--sign-aries)}.demo .place__hint{margin:8px 0 0;font-size:12.5px;color:var(--faint)}.demo-page[data-astro-cid-x2js37gy] h1[data-astro-cid-x2js37gy]{margin:var(--s-1) 0 var(--s-4)}.demo-page[data-astro-cid-x2js37gy]>h2[data-astro-cid-x2js37gy]{margin:var(--s-12) 0 var(--s-4);font-size:var(--text-lg);scroll-margin-top:96px}.demo-page[data-astro-cid-x2js37gy] .prose[data-astro-cid-x2js37gy]{max-width:68ch}.demo-page[data-astro-cid-x2js37gy] .prose[data-astro-cid-x2js37gy] code[data-astro-cid-x2js37gy]{font-family:var(--font-mono);font-size:.9em;overflow-wrap:anywhere}
