.ui-foundations-preview .reading-width-stops.comparison-stops button{left:calc(var(--reading-stop)*100%)}.ui-foundations-preview .reading-width-stops.comparison-stops button:first-child{color:var(--fnd-danger)}.ui-foundations-preview .reading-width-stops.comparison-stops button:last-child{color:var(--fnd-success)}.ui-foundations-preview .comparison-preview-motion{--comparison-resize:var(--preview-state-transition)}.ui-foundations-preview .comparison-preview-motion[data-values] .value-reveal,.ui-foundations-preview .comparison-preview-motion .radius-reveal{transform:none;animation:none!important}.ui-foundations-preview .comparison-preview-motion .value-reveal,.ui-foundations-preview .comparison-preview-motion .radius-reveal{transition:opacity var(--preview-reveal-transition),color var(--comparison-resize)}.ui-foundations-preview .comparison-preview-motion .radius-reveal.is-open{opacity:1}.ui-foundations-preview .comparison-preview-motion .radius-reveal.is-closed{opacity:0}.ui-foundations-preview .comparison-preview-motion[data-values=true] .value-reveal{opacity:1;visibility:visible}.ui-foundations-preview .comparison-preview-motion[data-values=false] .value-reveal{opacity:0;visibility:hidden}.ui-foundations-preview .comparison-preview-motion[data-values] .hit-lesson-callout[data-measured=false]{visibility:hidden}.ui-foundations-preview .comparison-preview-motion :is(.preview-enter,.book-scene,.input-contrast-content>*,.core-example>:not(.core-guide,.core-feedback)),.ui-foundations-preview .comparison-preview-motion .book-scene :is(.book-card,.book-prose,.book-profile-body,.book-photo-caption,.book-empty,.book-project-list,#book-article)>:not(.book-guide,.book-dot-pattern,.sr-only){animation:none!important}.ui-foundations-preview .comparison-preview-motion :is(.book-card,.book-inset,.ethos-elevation-card,.ethos-base-tile,.core-surface,.core-field-surface){transition:background-color var(--preview-state-transition),border-color var(--preview-state-transition),box-shadow var(--preview-state-transition)}.ui-foundations-preview .comparison-preview-motion .book-content-width-card{transition:width var(--preview-state-transition)}.ui-foundations-preview .comparison-preview-motion .book-image-outline-frame .border-overlay{transition:outline-color var(--preview-state-transition)}.ui-foundations-preview .comparison-preview-motion :is(.task-detail-preview,.task-detail-decoration){transition-duration:var(--preview-state-duration);transition-timing-function:var(--preview-state-easing)}.ui-foundations-preview .comparison-preview-motion:has(.ethos-modal-stage):after{transition:opacity var(--preview-state-transition)}.ui-foundations-preview .comparison-preview-motion :is(.book-scene,.rule-demo-content,.optical-preview,.core-example:not(.core-press-card):not(.core-motion-card)) :is(h1,h2,h3,h4,p,a,span,strong,label,button,input,select,textarea,.book-field,[style*=font-size],[style*=font-weight],[style*=line-height],[style*=letter-spacing],[style*=padding],[style*=margin],[style*=gap],[style*=width],[style*=height],[style*=border-radius]):not(.book-font-card__layer,.interface-detail-state,.interface-marker-layer,.value-reveal,.value-reveal *,.lesson-guide,.lesson-guide *,.book-guide,.book-guide *,.book-callouts,.book-callouts *,.hit-lesson-callout,.hit-lesson-callout *){transition:font-size var(--preview-state-transition),font-weight var(--preview-state-transition),line-height var(--preview-state-transition),letter-spacing var(--preview-state-transition),width var(--preview-state-transition),height var(--preview-state-transition),min-width var(--preview-state-transition),min-height var(--preview-state-transition),max-width var(--preview-state-transition),max-height var(--preview-state-transition),padding var(--preview-state-transition),margin var(--preview-state-transition),gap var(--preview-state-transition),border-radius var(--preview-state-transition),color var(--preview-state-transition),background-color var(--preview-state-transition),border-color var(--preview-state-transition),box-shadow var(--preview-state-transition),transform var(--preview-state-transition),filter var(--preview-state-transition)}@media (prefers-reduced-motion:reduce){.ui-foundations-preview .book-content-width-card{transition:none}.ui-foundations-preview .comparison-preview-motion :is(.book-scene,.rule-demo-content,.optical-preview,.core-example) :is(h1,h2,h3,p,.book-field,[style]){transition:none!important}}.ui-foundations-preview .comparison-preview-motion :is(.value-reveal--guide,.lesson-guide__leader,.hit-lesson-target,.hit-lesson-measure,.hit-lesson-callout,.book-callouts__label,.book-callouts__bands rect){transition:left var(--comparison-resize),top var(--comparison-resize),width var(--comparison-resize),height var(--comparison-resize),border-radius var(--comparison-resize),x var(--comparison-resize),y var(--comparison-resize),color var(--comparison-resize),opacity var(--preview-reveal-transition)}.ui-foundations-preview .comparison-preview-motion :is(.value-leader,.book-callouts__lines){transition:width var(--comparison-resize),color var(--comparison-resize)}.ui-foundations-preview .comparison-preview-motion :is(.value-leader path,.value-leader circle){transition:d var(--comparison-resize),cx var(--comparison-resize),cy var(--comparison-resize)}.ui-foundations-preview .comparison-preview-motion .hit-lesson-callout,.ui-foundations-preview .comparison-preview-motion .hit-lesson-callout .value-leader,.ui-foundations-preview .comparison-preview-motion :is(.book-callouts__label,.book-callouts__lines,.book-callouts__bands rect){transition:color var(--comparison-resize),opacity var(--preview-reveal-transition)}.ui-foundations-preview .comparison-preview-motion .book-callouts__lines :is(path,circle){transition:none}.ui-foundations-preview .comparison-preview-motion :is(.input-contrast-example,.input-contrast-field input,.input-contrast-field label,.contrast-example-copy,.contrast-example-button){transition:color var(--preview-text-fade),background-color var(--preview-surface-fade),border-color var(--preview-surface-fade)}.ui-foundations-preview .comparison-preview-motion[data-values] .optical-padding-guide{transition:left var(--comparison-resize),right var(--comparison-resize),top var(--comparison-resize),width var(--comparison-resize),height var(--comparison-resize),clip-path var(--comparison-resize),color var(--comparison-resize),opacity var(--preview-reveal-transition)}.ui-foundations-preview .comparison-preview-motion .optical-preview [style]:not(.value-reveal){transition:transform var(--comparison-resize),width var(--comparison-resize),height var(--comparison-resize),padding var(--comparison-resize),font-size var(--comparison-resize),filter var(--preview-surface-fade),color var(--preview-text-fade),background-color var(--preview-surface-fade),border-color var(--preview-surface-fade)}@media (prefers-reduced-motion:reduce){.ui-foundations-preview .comparison-preview-motion .radius-reveal,.ui-foundations-preview .comparison-preview-motion[data-values] .value-reveal,.ui-foundations-preview .comparison-preview-motion .hit-lesson-callout .value-leader,.ui-foundations-preview .comparison-preview-motion .optical-preview [style]:not(.value-reveal),.ui-foundations-preview .comparison-preview-motion :is(.value-reveal--guide,.lesson-guide__leader,.hit-lesson-target,.hit-lesson-measure,.hit-lesson-callout,.book-callouts__label,.book-callouts__bands rect,.value-leader,.book-callouts__lines,.value-leader path,.value-leader circle,.input-contrast-example,.input-contrast-field input,.input-contrast-field label,.contrast-example-copy,.contrast-example-button,.optical-padding-guide,.book-card,.book-inset,.ethos-elevation-card,.ethos-base-tile,.core-surface,.core-field-surface,.book-image-outline-edge),.ui-foundations-preview .comparison-preview-motion .book-image-outline-frame .border-overlay{transition:none!important}}
.ui-foundations-preview .optical-preview{container-type:inline-size}.ui-foundations-preview .optical-measured-example{justify-content:center;align-items:center;width:max-content;max-width:100%;display:flex;position:relative}.ui-foundations-preview .optical-measured-example:has(.headline-specimen){width:min(628px,100%)}.ui-foundations-preview .optical-measurements{pointer-events:none;align-items:center;gap:20px;width:max-content;max-width:240px;display:flex;position:absolute;top:50%;left:calc(100% + 12px);translate:0 -50%}.ui-foundations-preview .optical-measurements>.value-leader{flex:none}.ui-foundations-preview .optical-value-notes{display:none}@container (max-width:1150px){.ui-foundations-preview .optical-measurements{display:none}.ui-foundations-preview .optical-value-notes:has(.optical-mobile-values){text-align:center;padding:0 24px 72px;display:block}}
.ui-foundations-preview .input-contrast-preview{flex-direction:column;justify-content:center;align-items:center;gap:32px;width:100%;min-height:720px;padding:88px 176px;display:flex;container-type:inline-size}.ui-foundations-preview .input-contrast-example{--fnd-heading:var(--input-demo-text);--fnd-body:var(--input-demo-text);--fnd-subtle:var(--input-demo-muted);background:var(--input-demo-background);width:480px;max-width:100%;color:var(--input-demo-text);border:1px solid #0000;border-radius:20px;flex-shrink:0;position:relative;box-shadow:0 2px 6px #0000000a}.ui-foundations-preview .input-contrast-example.border-overlay{outline-offset:-1px;outline:1px solid #0000001a}.ui-foundations-preview .input-contrast-example.border-overlay[data-tone=dark]{outline-color:#ffffff1a}.ui-foundations-preview .input-contrast-content{padding:36px}.ui-foundations-preview .input-contrast-content>*{animation:.22s ease-out 40ms backwards radius-spring-open}.ui-foundations-preview .input-contrast-field label{color:var(--input-demo-text);margin-bottom:10px;font-size:14px;font-weight:500;line-height:1.5;display:block}.ui-foundations-preview .input-contrast-field-row{position:relative}.ui-foundations-preview .input-contrast-example input{box-sizing:border-box;border:1px solid var(--input-demo-border);background:var(--input-demo-fill);width:100%;min-width:0;height:48px;color:var(--input-demo-input-text);caret-color:var(--input-demo-input-text);font:inherit;box-shadow:none;border-radius:8px;padding:0 14px;font-size:16px;display:block}.ui-foundations-preview .input-contrast-example input::placeholder{color:var(--input-demo-placeholder);opacity:1}.ui-foundations-preview .input-contrast-example ::selection{background:var(--input-demo-input-text);color:var(--input-demo-fill)}.ui-foundations-preview .input-contrast-example input:focus-visible{outline:2px solid var(--input-demo-focus);outline-offset:3px}.ui-foundations-preview .input-contrast-callout{pointer-events:none;position:absolute;top:50%;left:calc(100% + 12px);transform:translateY(-50%)}.ui-foundations-preview .input-contrast-callout-body{color:#ff5268;transform-origin:0;align-items:center;gap:20px;display:flex}.ui-foundations-preview .input-contrast-notes{text-align:center;width:max-content;max-width:calc(100% + 272px)}.ui-foundations-preview .input-contrast-details>p{text-wrap:balance;margin:0;font-size:14px;font-weight:500;line-height:1.5}.ui-foundations-preview .input-contrast-mobile-value{display:none}@media (max-width:900px){.ui-foundations-preview .input-contrast-preview{padding:88px 24px}.ui-foundations-preview .input-contrast-notes{max-width:100%}.ui-foundations-preview .input-contrast-content{padding:28px}.ui-foundations-preview .input-contrast-callout{display:none}.ui-foundations-preview .input-contrast-details>.input-contrast-mobile-value{color:var(--preview-neutral-52525b,#52525b);margin-top:12px;font-size:12px;display:block}}@media (max-width:400px){.ui-foundations-preview .input-contrast-content{padding:24px}}@media (prefers-reduced-motion:reduce){.ui-foundations-preview .input-contrast-content>*{animation:.14s backwards radius-fade-open}}
.ui-foundations-preview .contrast-example-copy{color:var(--contrast-foreground);margin:0;font-size:16px;line-height:1.6}.ui-foundations-preview .contrast-preview .input-contrast-example{text-align:left;width:max-content}.ui-foundations-preview .contrast-example-button{background:var(--contrast-fill);min-height:48px;color:var(--contrast-foreground);font:inherit;cursor:pointer;border:0;border-radius:8px;justify-content:center;align-items:center;padding:0 20px;font-size:16px;font-weight:500;display:inline-flex}.ui-foundations-preview .contrast-example-button:focus-visible{outline:2px solid var(--contrast-focus);outline-offset:-4px}.ui-foundations-preview .contrast-explanation{text-wrap:balance;margin:0;font-size:14px;font-weight:500;line-height:1.6}.ui-foundations-preview .contrast-feedback{min-height:20px;color:var(--preview-neutral-65656d,#65656d);margin:0;font-size:12px}.ui-foundations-preview .contrast-mobile-value{display:none}.ui-foundations-preview .reading-width-control.image-overlay-control{max-width:calc(100% - 80px)}.ui-foundations-preview .reading-width-stops.image-overlay-stops button{left:calc(var(--reading-stop)*100%/4);width:24px}.ui-foundations-preview .reading-width-stops.image-overlay-stops button>span{pointer-events:none;position:relative;left:50%;translate:-50%}.ui-foundations-preview .reading-width-stops.image-overlay-stops button[data-tone=success]{color:var(--fnd-explanation-success)}.ui-foundations-preview .reading-width-stops.image-overlay-stops button[data-tone=danger]{color:var(--fnd-explanation-danger)}@media (max-width:900px){.ui-foundations-preview .contrast-mobile-value{color:var(--preview-neutral-52525b,#52525b);font:500 12px/1.5 var(--font-mono);margin:0;display:block}}
.ui-foundations-preview .foundation-example-help{flex:0 0 var(--foundation-control-inner-size)}.ui-foundations-preview .foundation-example-help>button{width:var(--foundation-control-inner-size);height:var(--foundation-control-inner-size);border-radius:calc(var(--foundation-control-radius) - 4px);color:#fffc;justify-content:center;align-items:center;padding:0;transition:background-color .15s,color .15s;display:flex}.ui-foundations-preview .foundation-example-help>button:hover{color:#fff;background:#ffffff1a}.ui-foundations-preview .foundation-example-help>button:focus-visible{outline-offset:-2px;outline:2px solid #fff}.ui-foundations-preview .foundation-explanation-tooltip{z-index:80;color:#fff;width:320px;max-width:calc(100vw - 32px);font:var(--foundation-control-font);background:#27272a;border-radius:12px;margin-top:10px;padding:12px 16px;position:absolute;top:100%;left:50%;translate:-50%;box-shadow:0 8px 24px #09090b29}.ui-foundations-preview .foundation-explanation-tooltip:before{content:"";height:10px;position:absolute;top:-10px;left:0;right:0}.ui-foundations-preview .preview-alert{text-align:center;min-width:0}.ui-foundations-preview .preview-alert+.preview-alert{margin-top:8px}.ui-foundations-preview .preview-alert__text{white-space:normal;overflow-wrap:anywhere}
.ui-foundations-preview .measurement-readout{text-align:left;font:500 12px/1.4 var(--font-mono);grid-template-columns:minmax(max-content,1fr) max-content;gap:6px 12px;display:inline-grid}.ui-foundations-preview .measurement-readout__row{grid-column:1/-1;grid-template-columns:subgrid;align-items:baseline;display:grid}.ui-foundations-preview .measurement-readout__row>span{color:var(--preview-neutral-52525b,#52525b);font-family:var(--font-sans);font-weight:500}.ui-foundations-preview .measurement-readout__row>strong{color:var(--preview-neutral-3e3e3e,#3e3e3e);font-family:var(--font-mono);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:12px;font-weight:700;line-height:1.4}
.ui-foundations-preview .book-image-outline-surface{width:520px;max-width:100%}.ui-foundations-preview .book-image-outline-frame{aspect-ratio:16/9;border-radius:12px;width:100%;position:relative;overflow:hidden}.ui-foundations-preview .book-image-outline-frame img{border-radius:inherit}.ui-foundations-preview .book-image-outline-edge{z-index:1;border-radius:inherit;pointer-events:none;position:absolute;inset:0}.ui-foundations-preview .book-image-outline-frame .border-overlay{outline-offset:-1px;outline:1px solid #0000001a}.ui-foundations-preview .book-image-outline-surface.dark .border-overlay{outline-color:#ffffff1a}.ui-foundations-preview .book-demo{width:100%;min-height:720px;color:var(--preview-neutral-3e3e3e,#3e3e3e);flex-direction:column;justify-content:center;align-items:center;gap:20px;padding:88px 28px 76px;display:flex}.ui-foundations-preview .book-scene{justify-content:center;align-items:center;width:100%;min-width:0;min-height:320px;display:flex}.ui-foundations-preview .book-callout-viewport{justify-content:center;width:100%;min-width:0;display:flex;overflow:visible}.ui-foundations-preview .book-annotated{flex-shrink:0;width:100%;min-width:880px;max-width:1280px;margin-inline:auto;padding:48px 216px;position:relative}.ui-foundations-preview .book-annotated__content{justify-content:center;align-items:center;width:100%;min-width:0;display:flex}.ui-foundations-preview .book-callouts{pointer-events:none;margin:0;position:absolute;inset:0}.ui-foundations-preview .book-callouts__lines{width:100%;height:100%;position:absolute;inset:0}.ui-foundations-preview .book-callouts__lines .value-reveal{transform-box:view-box}.ui-foundations-preview .book-callouts__label{width:184px;color:var(--preview-neutral-52525b,#52525b);font-family:var(--font-mono);overflow-wrap:anywhere;flex-direction:column;font-size:12px;line-height:1.5;display:flex;position:absolute;transform:translateY(-50%)}.ui-foundations-preview .book-callouts__label--left,.ui-foundations-preview .book-callouts__label--right{text-align:left}.ui-foundations-preview .book-callouts__label-content{flex-direction:column;align-self:flex-start;width:max-content;max-width:100%;display:flex}.ui-foundations-preview .book-callouts__label-content [data-property=outline-color]{white-space:nowrap}.ui-foundations-preview .book-callouts__inline-value{white-space:nowrap;width:max-content}.ui-foundations-preview .book-demo[data-example=image-outline] .book-callouts__label{width:304px}.ui-foundations-preview .book-demo[data-example=image-outline] .book-annotated{min-width:1000px;padding-inline:216px}.ui-foundations-preview .book-callouts__label-content>strong{font-family:var(--font-sans);color:var(--preview-neutral-52525b,#52525b);margin-bottom:6px;font-size:12px;font-weight:500}.ui-foundations-preview .book-callouts__label-content [data-property]>span{color:var(--preview-neutral-52525b,#52525b);font-family:var(--font-sans);font-weight:500}.ui-foundations-preview .book-callouts__label-content [data-property]{margin-top:3px}.ui-foundations-preview .book-callouts__label b{color:var(--preview-neutral-3e3e3e,#3e3e3e);font-variant-numeric:tabular-nums;font-weight:700}.ui-foundations-preview .book-demo h3,.ui-foundations-preview .book-demo h4{color:inherit;letter-spacing:-.025em;margin:0;font-size:22px;font-weight:600;line-height:1.2}.ui-foundations-preview .book-demo p{margin:0}.ui-foundations-preview .book-demo .book-card{border:1px solid var(--preview-neutral-e4e4e7,#e4e4e7);background:var(--preview-neutral-ffffff,#fff);border-radius:16px;width:420px;min-width:0;max-width:100%;padding:28px;box-shadow:0 8px 24px #09090b0b,0 1px 3px #09090b09}.ui-foundations-preview .book-demo[data-consistent=true]:not([data-example=elevation],[data-example=two-shadows],[data-example=flat-depth]) .book-card{outline-offset:-1px;border-color:#0000;outline:1px solid #0000001a;box-shadow:0 2px 6px #0000000a}.ui-foundations-preview .book-demo[data-consistent=true] .book-card.dark{outline-color:#ffffff1a}.ui-foundations-preview .book-demo[data-consistent=true] .book-guide{color:var(--value-leader-color,#ff5268)}.ui-foundations-preview .book-stack{flex-direction:column;align-items:stretch;gap:16px;min-width:0;display:flex}.ui-foundations-preview .book-stack>.book-button{align-self:flex-start}.ui-foundations-preview .book-stack>p,.ui-foundations-preview .book-prose>p{line-height:1.6}.ui-foundations-preview .book-inline,.ui-foundations-preview .book-actions{align-items:center;gap:12px;min-width:0;display:flex}.ui-foundations-preview .book-actions{flex-wrap:wrap;gap:8px}.ui-foundations-preview .book-icon.lucide{width:16px;height:16px;color:inherit;vertical-align:middle;flex-shrink:0;display:inline-block}.ui-foundations-preview .book-demo .book-button{white-space:nowrap;border:1px solid var(--preview-neutral-d4d4d8,#d4d4d8);min-height:44px;color:var(--preview-neutral-3e3e3e,#3e3e3e);background:var(--preview-neutral-ffffff,white);border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;gap:8px;padding:0 16px;font-size:14px;font-weight:500;line-height:1;transition:background-color .15s ease-out,opacity .15s ease-out,transform .15s ease-out;display:inline-flex;box-shadow:0 1px 2px #0000000a}.ui-foundations-preview .book-demo .book-button--primary{background:var(--preview-neutral-3e3e3e,#3e3e3e);height:40px;min-height:40px;max-height:40px;color:var(--preview-neutral-ffffff,#fff);border-color:#0000}.ui-foundations-preview .book-demo .book-button--plain{box-shadow:none;background:0 0;border-color:#0000}.ui-foundations-preview .book-demo .book-button:hover{background:var(--preview-neutral-f4f4f5,#f4f4f5)}.ui-foundations-preview .book-demo .book-button--primary:hover{background:var(--preview-neutral-505050,#505050)}.ui-foundations-preview .book-demo .book-button:active{transform:translateY(1px)}.ui-foundations-preview .book-demo :is(button,a,input,textarea):focus-visible{outline:2px solid var(--preview-neutral-3e3e3e,#3e3e3e);outline-offset:4px}.ui-foundations-preview .book-demo .book-button--primary:focus-visible{outline-offset:3px}.ui-foundations-preview .book-action-priority-copy{flex-direction:column;gap:8px;display:flex}.ui-foundations-preview .book-action-priority-copy>p{line-height:1.6}.ui-foundations-preview .book-demo[data-example=action-hierarchy][data-corrected=true] .book-action-priority-card .book-button{height:40px;min-height:40px;box-shadow:var(--shadow-fnd-control);border-radius:12px;padding-inline:16px;transition:background-color .15s ease-out,border-color .15s ease-out}.ui-foundations-preview .book-demo[data-example=action-hierarchy][data-corrected=true] .book-action-priority-card .book-button:hover{box-shadow:var(--shadow-fnd-control);transform:none}.ui-foundations-preview .book-demo[data-example=action-hierarchy][data-corrected=true] .book-action-priority-card .book-button--primary:hover{background:var(--preview-neutral-505050,#505050)}.ui-foundations-preview .book-demo[data-example=action-hierarchy][data-corrected=true] .book-action-priority-save:hover{border-color:var(--fnd-line-medium);background:var(--fnd-page)}.ui-foundations-preview .book-demo[data-example=action-hierarchy][data-corrected=true] .book-action-priority-card .book-action-priority-delete{color:#b91c1c;box-shadow:none}.ui-foundations-preview .book-demo[data-example=action-hierarchy][data-corrected=true] .book-action-priority-card .book-action-priority-delete:hover{box-shadow:none;background:#fef2f2}.ui-foundations-preview .book-notes{flex-direction:column;align-items:center;gap:8px;width:100%;max-width:100%;display:flex}.ui-foundations-preview .book-notes .preview-notes__details{text-align:center;min-height:18px;color:var(--preview-neutral-52525b,#52525b);gap:4px;display:grid}.ui-foundations-preview .book-guide{font-family:var(--font-mono);font-size:12px;line-height:1.5;display:block}.ui-foundations-preview .book-demo .book-explanation{max-width:100%;font-family:var(--font-sans);text-align:center;text-wrap:pretty;color:var(--explanation-color);opacity:1;font-size:14px;font-weight:500;line-height:1.5}.ui-foundations-preview .book-demo .book-feedback{text-align:center;max-width:100%;min-height:21px;color:var(--preview-neutral-52525b,#52525b);font-size:14px}.ui-foundations-preview .book-eyebrow{letter-spacing:.08em;color:var(--preview-neutral-71717b,#71717b);font-size:12px;font-weight:600}.ui-foundations-preview .book-muted{color:var(--preview-neutral-71717b,#71717b)}.ui-foundations-preview .book-demo[data-example=white-space]{gap:24px;padding:40px 208px 48px}.ui-foundations-preview .book-demo .book-breathing-card{width:420px;position:relative}.ui-foundations-preview .book-demo .book-breathing-card--avoid{--value-leader-color:#f28c28}.ui-foundations-preview .book-demo .book-breathing-card h3{font-size:22px;line-height:1.3}.ui-foundations-preview .book-breathing-card__media{border-radius:var(--book-media-radius);background:var(--fnd-page);height:120px;position:relative;overflow:hidden}.ui-foundations-preview .book-breathing-card__media img{object-fit:cover}.ui-foundations-preview .book-breathing-card__gap{z-index:1;width:calc(100% + var(--book-card-padding)*2);margin-inline:calc(0px - var(--book-card-padding));color:var(--value-leader-color);background-color:color-mix(in srgb,currentColor 8%,transparent);flex:none;display:block;position:relative;overflow:visible}.ui-foundations-preview .book-breathing-card__gap:before{opacity:.36}.ui-foundations-preview .book-breathing-card__measure{z-index:3;color:var(--value-leader-color);align-items:center;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.ui-foundations-preview .book-breathing-card__measure>b{color:var(--preview-neutral-3e3e3e,#3e3e3e);font:700 12px/1.4 var(--font-mono);font-variant-numeric:tabular-nums;white-space:nowrap}.ui-foundations-preview .book-breathing-card__measure>.value-leader{flex:none}.ui-foundations-preview .book-breathing-card__gap>.book-breathing-card__measure--left{right:calc(100% + var(--book-value-leader-clearance))}.ui-foundations-preview .book-breathing-card__padding-guides{z-index:2;border-radius:inherit;pointer-events:none;position:absolute;inset:0;overflow:hidden}.ui-foundations-preview .book-breathing-card__padding{color:var(--value-leader-color);display:block;position:absolute;overflow:visible}.ui-foundations-preview .book-breathing-card__padding:before{opacity:.24}.ui-foundations-preview .book-breathing-card__padding--top,.ui-foundations-preview .book-breathing-card__padding--bottom{right:var(--book-card-padding);left:var(--book-card-padding);height:var(--book-card-padding)}.ui-foundations-preview .book-breathing-card__padding--top{top:0}.ui-foundations-preview .book-breathing-card__padding--bottom{bottom:0}.ui-foundations-preview .book-breathing-card__padding--left,.ui-foundations-preview .book-breathing-card__padding--right{width:var(--book-card-padding);top:0;bottom:0}.ui-foundations-preview .book-breathing-card__padding--left{left:0}.ui-foundations-preview .book-breathing-card__padding--right{right:0}.ui-foundations-preview .book-breathing-card__inner-padding-value{z-index:4;top:calc(var(--book-card-padding) + 60px);left:calc(100% + var(--book-value-leader-clearance));pointer-events:none}.ui-foundations-preview .book-breathing-card__category{color:#1d4ed8;background:#eff6ff;border:1px solid #bfdbfe;border-radius:999px;align-self:flex-start;align-items:center;gap:5px;padding:4px 10px;font-size:12px;font-weight:500;line-height:16px;display:inline-flex}.ui-foundations-preview .book-breathing-card__category .book-icon{width:10px;height:10px}.ui-foundations-preview .book-breathing-card__meta{color:var(--preview-neutral-65656d,#65656d);flex-wrap:wrap;align-items:center;gap:8px;font-size:14px;line-height:24px;display:flex}.ui-foundations-preview .book-breathing-card__meta strong{color:var(--preview-neutral-3e3e3e,#3e3e3e);font-weight:500}.ui-foundations-preview .book-breathing-card__avatar{border:1px solid var(--preview-neutral-d4d4d8,#d4d4d8);background:var(--preview-neutral-f4f4f5,#f4f4f5);border-radius:50%;flex:none;width:20px;height:20px;display:block;position:relative;overflow:hidden}.ui-foundations-preview .book-breathing-card__avatar img{object-fit:cover}.ui-foundations-preview .book-demo .book-breathing-card__action{border-color:var(--fnd-line);background:var(--preview-neutral-ffffff,white);height:40px;min-height:40px;color:var(--fnd-heading);box-shadow:var(--shadow-fnd-control);border-radius:12px;gap:8px;padding-inline:16px 12px;font-size:14px;font-weight:500;line-height:20px;transition:background-color .15s ease-out,border-color .15s ease-out}.ui-foundations-preview .book-demo .book-breathing-card__action:hover{border-color:var(--fnd-line-medium);background:var(--fnd-page);box-shadow:var(--shadow-fnd-control)}.ui-foundations-preview .book-demo .book-breathing-card__action:active{background:var(--fnd-line-subtle);transform:none}.ui-foundations-preview .book-demo .book-breathing-card__action:focus-visible{outline:2px solid var(--fnd-heading);outline-offset:2px}.ui-foundations-preview .book-breathing-card__copy{color:var(--preview-neutral-52525b,#52525b)}.ui-foundations-preview .book-field{gap:var(--book-label-gap,8px);flex-direction:column;min-width:0;font-size:14px;display:flex}.ui-foundations-preview .book-field>span{font-weight:500}.ui-foundations-preview .book-field input,.ui-foundations-preview .book-field textarea,.ui-foundations-preview .book-inset-action input{border:1px solid var(--preview-neutral-85858f,#85858f);background:var(--preview-neutral-fafafa,#fafafa);width:100%;min-width:0;color:var(--preview-neutral-3e3e3e,#3e3e3e);border-radius:8px;padding:11px 12px;font-size:16px;line-height:22px}.ui-foundations-preview .book-field textarea{resize:vertical;min-height:104px}.ui-foundations-preview .book-field input::placeholder,.ui-foundations-preview .book-field textarea::placeholder,.ui-foundations-preview .book-inset-action input::placeholder{color:var(--preview-neutral-71717b,#71717b);opacity:1}.ui-foundations-preview .book-check-row{cursor:pointer;align-items:center;gap:10px;min-height:32px;font-size:16px;display:flex}.ui-foundations-preview .book-check-row input,.ui-foundations-preview .book-plan-option input{width:16px;height:16px;accent-color:var(--preview-neutral-3e3e3e,#3e3e3e);flex:none}.ui-foundations-preview .book-heading-choices{flex-direction:column;gap:4px;display:flex}.ui-foundations-preview .book-heading-choice{cursor:pointer;align-items:center;gap:8px;min-height:32px;font-size:16px;display:flex}.ui-foundations-preview .book-heading-choice__control{border:1px solid var(--preview-neutral-c4c4cb,#c4c4cb);background:var(--preview-neutral-f4f4f5,#f4f4f5);width:16px;height:16px;color:var(--preview-neutral-ffffff,#fff);border-radius:5px;flex:none;justify-content:center;align-items:center;transition:border-color .12s ease-out,background-color .12s ease-out;display:inline-flex}.ui-foundations-preview .book-heading-choice__control .book-icon{opacity:0;width:9px;height:9px}.ui-foundations-preview .book-heading-choice input:checked+.book-heading-choice__control{border-color:var(--preview-neutral-3e3e3e,#3e3e3e);background:var(--preview-neutral-3e3e3e,#3e3e3e)}.ui-foundations-preview .book-heading-choice input:checked+.book-heading-choice__control .book-icon{opacity:1}.ui-foundations-preview .book-heading-choice input:focus-visible+.book-heading-choice__control{outline:2px solid var(--preview-neutral-3e3e3e,#3e3e3e);outline-offset:2px}.ui-foundations-preview .book-error{color:#991b1b;font-size:14px}.ui-foundations-preview .book-inset{background:var(--preview-neutral-f4f4f5,#f4f4f5);border-radius:8px;padding:16px}.ui-foundations-preview .book-token-options{flex-wrap:wrap;gap:8px;display:flex}.ui-foundations-preview .book-token{border:1px solid var(--preview-neutral-e4e4e7,#e4e4e7);border-radius:6px;flex-direction:column;align-items:center;gap:8px;min-width:36px;min-height:64px;padding:8px;font-size:12px;display:flex}.ui-foundations-preview .book-token>span:first-child{background:var(--preview-neutral-a1a1aa,#a1a1aa);border-radius:2px;width:16px}.ui-foundations-preview .book-token[aria-pressed=true]{outline:2px solid var(--preview-neutral-3e3e3e,#3e3e3e);outline-offset:1px}.ui-foundations-preview .book-demo .book-placement-card{gap:20px;width:400px;padding:28px}.ui-foundations-preview .book-demo .book-placement-card h3{letter-spacing:-.025em;font-size:18px;font-weight:600;line-height:24px}.ui-foundations-preview .book-placement-row{border-top:1px solid var(--fnd-line-subtle);align-items:center;gap:12px;padding-block:8px;font-size:16px;font-weight:500;line-height:24px;display:flex}.ui-foundations-preview .book-placement-row>span{overflow-wrap:anywhere;flex:1;min-width:0}.ui-foundations-preview .book-placement-row[data-consistent=false][data-position="1"]>.book-button{order:-1}.ui-foundations-preview .book-placement-row[data-consistent=false][data-position="2"]{padding-inline-end:56px}.ui-foundations-preview .book-demo .book-placement-row>.book-button{width:32px;height:32px;min-height:32px;max-height:32px;box-shadow:none;color:var(--preview-neutral-6b6b73,#6b6b73);border:0;border-radius:8px;padding:0}.ui-foundations-preview .book-demo .book-placement-row>.book-button:hover{background:var(--fnd-page)}.ui-foundations-preview .book-demo .book-placement-row>.book-button:active{transform:none}.ui-foundations-preview .book-demo .book-placement-row>.book-button .book-icon{width:16px;height:16px}.ui-foundations-preview .book-consistency-target{position:relative}.ui-foundations-preview .book-consistency-highlight{z-index:2;color:var(--value-leader-color);pointer-events:none;border:0;border-radius:8px;position:absolute;inset:-4px}.ui-foundations-preview .book-consistency-highlight:before{opacity:.2}.ui-foundations-preview .book-naming-path{color:var(--preview-neutral-71717b,#71717b);gap:12px;font-size:14px;display:flex}.ui-foundations-preview .book-demo .book-card.book-customer-card{gap:20px;width:480px;padding:28px}.ui-foundations-preview .book-demo[data-example=weight-contrast]{padding-top:64px;padding-bottom:100px}.ui-foundations-preview .book-customer-card__header{align-items:center;display:flex}.ui-foundations-preview .book-customer-card__header h3{font-size:22px;line-height:1.3}.ui-foundations-preview .book-customer-list{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.ui-foundations-preview .book-customer-row{grid-template-columns:40px minmax(0,1fr) auto;align-items:center;column-gap:12px;min-height:72px;padding-block:16px;display:grid;position:relative}.ui-foundations-preview .book-customer-divider{pointer-events:none;border-top-style:solid;height:0;display:block;position:absolute;inset:0 0 auto}.ui-foundations-preview .book-customer-avatar{border:1px solid var(--preview-neutral-e4e4e7,#e4e4e7);background:var(--preview-neutral-f4f4f5,#f4f4f5);border-radius:50%;width:40px;height:40px;display:block;position:relative;overflow:hidden}.ui-foundations-preview .book-customer-avatar img{object-fit:cover}.ui-foundations-preview .book-customer-copy{flex-direction:column;gap:2px;min-width:0;display:flex}.ui-foundations-preview .book-customer-copy strong{color:var(--preview-neutral-18181b,#18181b);text-overflow:ellipsis;white-space:nowrap;font-size:16px;font-weight:600;line-height:20px;overflow:hidden}.ui-foundations-preview .book-customer-copy>span{color:var(--preview-neutral-65656d,#65656d);text-overflow:ellipsis;white-space:nowrap;font-size:14px;line-height:20px;overflow:hidden}.ui-foundations-preview .book-customer-amount{color:var(--preview-neutral-52525b,#52525b);font-variant-numeric:tabular-nums;padding-inline-start:20px;font-size:18px;font-weight:500;line-height:24px}.ui-foundations-preview .book-demo .book-type-article{width:520px;padding:32px}.ui-foundations-preview .book-demo[data-example=type-scale]{padding-top:68px;padding-bottom:60px}.ui-foundations-preview .book-demo[data-consistent=true][data-example=type-scale] .book-annotated{padding-block:16px}.ui-foundations-preview .book-demo[data-example=good-fonts]{padding-top:48px;padding-bottom:96px}.ui-foundations-preview .book-demo[data-consistent=true][data-example=good-fonts] .book-annotated{padding-block:16px}.ui-foundations-preview .book-demo[data-example=text-baseline]{padding-top:24px;padding-bottom:80px}.ui-foundations-preview .book-demo[data-consistent=true][data-example=text-baseline] .book-annotated{padding-block:8px}.ui-foundations-preview .book-type-article__header{flex-direction:column;gap:12px;display:flex}.ui-foundations-preview .book-demo .book-type-article__title{text-wrap:balance;font-weight:600;line-height:1.2}.ui-foundations-preview .book-type-article__helper{color:var(--fnd-body);text-wrap:pretty;line-height:1.5;display:block}.ui-foundations-preview .book-demo .book-type-article__body{color:var(--fnd-body);text-wrap:pretty;margin-top:24px;line-height:1.6}.ui-foundations-preview .book-demo[data-example=type-scale] .book-type-article__header{gap:18px}.ui-foundations-preview .book-demo[data-example=type-scale] .book-type-article__body{color:var(--fnd-body);margin-top:18px}.ui-foundations-preview .book-demo[data-example=type-scale] :is(.book-type-article__title,.book-type-article__helper,.book-type-article__body){transition:font-size var(--preview-state-transition)}@media (prefers-reduced-motion:reduce){.ui-foundations-preview .book-demo[data-example=type-scale] :is(.book-type-article__title,.book-type-article__helper,.book-type-article__body){transition:none}}.ui-foundations-preview .book-type-article__actions{margin-top:24px}.ui-foundations-preview .book-demo .book-type-article__actions .book-button{transition:background-color .15s ease-out,transform .15s ease-out}.ui-foundations-preview .book-demo .book-type-article__actions .book-button:hover{background:var(--preview-neutral-505050,#505050);box-shadow:0 1px 2px #0000000a}.ui-foundations-preview .book-type-article__name{font-weight:600}.ui-foundations-preview .book-type-article__date{white-space:nowrap;font-weight:500}.ui-foundations-preview .book-type-article__date .book-icon{vertical-align:-.125em;width:14px;height:14px;margin-inline-end:8px}.ui-foundations-preview .book-demo .book-font-card .book-type-article__title{font-size:1.375rem}.ui-foundations-preview .book-font-card__heading-row{justify-content:space-between;align-items:center;gap:16px;display:flex}.ui-foundations-preview .book-font-card__heading-row>h3{min-width:0}.ui-foundations-preview .book-font-card__status{white-space:nowrap;border-radius:999px;flex-shrink:0;align-items:center;gap:8px;padding:4px 12px;font-size:.875rem;font-weight:500;line-height:20px;display:inline-flex}.ui-foundations-preview .book-font-card__status .book-icon{width:14px;height:14px}.ui-foundations-preview .book-font-card__date{color:var(--fnd-body);align-items:center;gap:8px;font-size:.875rem;font-weight:500;line-height:20px;display:flex}.ui-foundations-preview .book-font-card__date .book-icon{width:14px;height:14px}.ui-foundations-preview .book-font-card__swap{display:grid}.ui-foundations-preview .book-font-card__layer{opacity:0;visibility:hidden;pointer-events:none;min-width:0;transition:opacity var(--preview-state-transition),visibility 0s linear .26s;grid-area:1/1}.ui-foundations-preview .book-font-card__layer[data-font-active=true]{opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s}@media (prefers-reduced-motion:reduce){.ui-foundations-preview .book-font-card__layer{transition:none}}.ui-foundations-preview .book-font-card__details{gap:12px;margin-top:24px;font-size:1rem;line-height:1.5;display:grid}.ui-foundations-preview .book-font-card__details>div{justify-content:space-between;gap:24px;display:flex}.ui-foundations-preview .book-font-card__details dt{color:var(--fnd-body)}.ui-foundations-preview .book-font-card__details dd{font-weight:500}.ui-foundations-preview .book-demo .book-font-card .book-button{border-color:var(--fnd-line);background:var(--preview-neutral-ffffff,white);width:100%;min-height:48px;color:var(--fnd-heading);box-shadow:var(--shadow-fnd-control);border-radius:12px;transition:background-color .15s ease-out,border-color .15s ease-out}.ui-foundations-preview .book-demo .book-font-card .book-button:hover{background:var(--fnd-page);border-color:var(--fnd-line-medium);box-shadow:var(--shadow-fnd-control)}.ui-foundations-preview .book-demo .book-font-card .book-button:active{background:var(--fnd-line-subtle);transform:none}.ui-foundations-preview .book-demo .book-font-card .book-button:focus-visible{outline:2px solid var(--fnd-heading);outline-offset:2px}.ui-foundations-preview .book-metric>strong{letter-spacing:-.04em;line-height:1}.ui-foundations-preview .book-demo .book-card.book-navigation-card{padding:12px}.ui-foundations-preview .book-navigation{flex-direction:column;gap:6px;display:flex}.ui-foundations-preview .book-navigation button{color:var(--preview-neutral-3e3e3e,#3e3e3e);text-align:start;border-radius:6px;align-items:center;gap:8px;padding:6px 8px;font-size:16px;line-height:20px;transition:color .15s ease-out;display:flex}.ui-foundations-preview .book-navigation button[data-muted=true]{color:var(--preview-neutral-6b6b73,#6b6b73)}.ui-foundations-preview .book-navigation button:hover,.ui-foundations-preview .book-navigation button[aria-current=page]{color:var(--preview-neutral-3e3e3e,#3e3e3e)}.ui-foundations-preview .book-profile-details{flex-direction:column;gap:12px;display:flex}.ui-foundations-preview .book-profile-details p{line-height:1.6}.ui-foundations-preview .book-specs{gap:16px;display:grid}.ui-foundations-preview .book-specs>div{justify-content:space-between;gap:32px;display:flex}.ui-foundations-preview .book-specs dt{font-weight:600}.ui-foundations-preview .book-specs dd{color:var(--preview-neutral-71717b,#71717b)}.ui-foundations-preview .book-spec-values{gap:16px;margin:0;padding:0;list-style:none;display:grid}.ui-foundations-preview .book-canvas{justify-content:center;max-width:100%;display:flex}.ui-foundations-preview .book-content-width-card{transition:width var(--preview-state-transition)}.ui-foundations-preview .book-demo .book-content-width-card h3{font-family:var(--font-sans);font-weight:600}.ui-foundations-preview .book-demo .book-mini-app{min-height:352px;padding:0;display:grid;overflow:hidden}.ui-foundations-preview .book-layout-sidebar{background:var(--preview-neutral-f4f4f5,#f4f4f5);min-width:0;padding:24px 16px}.ui-foundations-preview .book-layout-sidebar__brand{align-items:center;gap:10px;min-width:0;font-size:16px;display:flex}.ui-foundations-preview .book-layout-sidebar__brand img{border-radius:8px;flex:none;width:32px;height:32px}.ui-foundations-preview .book-layout-sidebar__brand strong{letter-spacing:-.025em;font-weight:700}.ui-foundations-preview .book-layout-sidebar nav{flex-direction:column;gap:6px;margin-top:24px;display:flex}.ui-foundations-preview .book-layout-sidebar nav span{min-width:0;color:var(--preview-neutral-62626a,#62626a);text-overflow:ellipsis;white-space:nowrap;border-radius:8px;padding:9px 10px;font-size:14px;font-weight:500;line-height:18px;overflow:hidden}.ui-foundations-preview .book-layout-sidebar nav span[aria-current=page]{color:var(--preview-neutral-3e3e3e,#3e3e3e);background:var(--preview-neutral-ffffff,white);box-shadow:0 1px 2px #09090b0f}.ui-foundations-preview .book-layout-main{min-width:0;padding:28px}.ui-foundations-preview .book-layout-main>header{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.ui-foundations-preview .book-layout-main>header>div{min-width:0}.ui-foundations-preview .book-layout-main>header span{color:var(--preview-neutral-71717b,#71717b);margin-bottom:4px;font-size:12px;font-weight:500;display:block}.ui-foundations-preview .book-layout-main>header h3{font-family:var(--font-sans);text-overflow:ellipsis;white-space:nowrap;font-size:20px;font-weight:600;overflow:hidden}.ui-foundations-preview .book-layout-main>header>strong{color:var(--preview-neutral-52525b,#52525b);background:var(--preview-neutral-f4f4f5,#f4f4f5);white-space:nowrap;border-radius:999px;flex:none;padding:4px 8px;font-size:12px;font-weight:500;line-height:16px}.ui-foundations-preview .book-layout-main ul{gap:10px;margin:24px 0 0;padding:0;list-style:none;display:grid}.ui-foundations-preview .book-layout-project{background:var(--preview-neutral-f7f7f8,#f7f7f8);border-radius:10px;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:10px;min-width:0;padding:12px;display:grid}.ui-foundations-preview .book-layout-project__icon{width:32px;height:32px;color:var(--preview-neutral-52525b,#52525b);background:var(--preview-neutral-ffffff,white);box-shadow:inset 0 0 0 1px var(--preview-neutral-e4e4e7,#e4e4e7);border-radius:8px;place-items:center;display:grid}.ui-foundations-preview .book-layout-project__icon .book-icon{width:14px;height:14px}.ui-foundations-preview .book-layout-project__copy{flex-direction:column;gap:2px;min-width:0;display:flex}.ui-foundations-preview .book-layout-project__copy strong,.ui-foundations-preview .book-layout-project__copy small{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.ui-foundations-preview .book-layout-project__copy strong{font-size:14px;font-weight:600}.ui-foundations-preview .book-layout-project__copy small{color:var(--preview-neutral-71717b,#71717b);font-size:12px;line-height:16px}.ui-foundations-preview .book-layout-project__status{color:var(--preview-neutral-62626a,#62626a);white-space:nowrap;font-size:12px;font-weight:500}.ui-foundations-preview .book-form-groups{flex-direction:column;display:flex}.ui-foundations-preview .book-demo[data-example=proximity][data-proximity-tone=avoid]{--value-leader-color:#f28c28}.ui-foundations-preview .book-demo[data-example=proximity][data-proximity-tone=forbidden]{--value-leader-color:#ff5268}.ui-foundations-preview .book-demo .book-proximity-card--avoid{--value-leader-color:#f28c28}.ui-foundations-preview .book-demo .book-consistent-field-card .book-field{color:var(--input-demo-text);font-size:14px}.ui-foundations-preview .book-demo .book-consistent-field-card .book-field>span{font-size:14px;font-weight:500}.ui-foundations-preview .book-demo .book-consistent-field-card .book-field input{border:1px solid var(--input-demo-border);background:var(--input-demo-fill);height:44px;color:var(--input-demo-text);caret-color:var(--input-demo-text);font:inherit;box-shadow:none;border-radius:8px;padding:0 14px;font-size:14px}.ui-foundations-preview .book-demo .book-consistent-field-card .book-field input::selection{background:var(--input-demo-text);color:var(--input-demo-fill)}.ui-foundations-preview .book-demo .book-consistent-field-card .book-field input::placeholder{color:var(--input-demo-placeholder);opacity:1;font-size:14px;font-weight:400}.ui-foundations-preview .book-demo .book-consistent-field-card .book-field input:focus-visible{outline:2px solid var(--input-demo-focus);outline-offset:3px}.dark .ui-foundations-preview .playground-preview .book-demo .book-consistent-field-card{--lightningcss-light: !important;--lightningcss-dark:initial!important;color-scheme:dark!important;--input-demo-fill:var(--preview-neutral-f4f4f5,#f4f4f5)!important;--input-demo-border:var(--preview-neutral-d4d4d8,#d4d4d8)!important;--input-demo-text:var(--fnd-heading)!important;--input-demo-placeholder:var(--preview-neutral-71717b,#71717b)!important;--input-demo-focus:var(--fnd-heading)!important}.ui-foundations-preview .book-demo .book-local-details:not([hidden]){background:var(--fnd-page);color:var(--fnd-body);border-radius:8px;gap:8px;margin-block:16px;padding:16px;font-size:14px;line-height:1.6;display:grid}.ui-foundations-preview .book-demo .book-local-details strong{color:var(--fnd-heading);font-size:14px;font-weight:600}.ui-foundations-preview .book-prose{flex-direction:column;gap:24px;max-width:100%;font-size:16px;display:flex}.ui-foundations-preview .book-prose>h3{font-size:28px}.ui-foundations-preview .book-demo[data-example=tracking] .book-notes{align-items:flex-start;width:min(560px,100% - 464px);min-width:min(456px,100%)}.ui-foundations-preview .book-demo[data-example=tracking] .book-explanation{text-align:left}.ui-foundations-preview .book-demo[data-example=leading]{padding-block:48px}.ui-foundations-preview .book-demo[data-example=leading] .book-leading-card{width:576px;min-height:400px;padding:48px}.ui-foundations-preview .book-demo[data-consistent=true][data-example=leading] .book-annotated{min-width:1040px;padding-block:16px}.ui-foundations-preview .book-demo .book-leading-title{letter-spacing:-.02em;text-wrap:balance;margin:0 0 20px;font-size:2rem;font-weight:600}.ui-foundations-preview .book-leading-paragraphs{width:100%;color:var(--fnd-body);text-wrap:pretty;flex-direction:column;gap:16px;font-size:1rem;font-weight:400;display:flex}.ui-foundations-preview .book-leading-paragraphs>.book-leading-paragraph{font-size:inherit;line-height:inherit;overflow-wrap:normal;margin:0}.ui-foundations-preview .book-demo .book-pricing-card{width:324px;padding:0}.ui-foundations-preview .book-pricing-card__summary{flex-direction:column;gap:24px;padding:28px;display:flex}.ui-foundations-preview .book-pricing-card__skeleton,.ui-foundations-preview .book-pricing-card__button-skeleton{fill:var(--fnd-skeleton);flex:none;display:block}.ui-foundations-preview .book-pricing-card__action{background:var(--fnd-page);border-radius:8px;justify-content:center;align-items:center;height:40px;display:flex}.ui-foundations-preview .book-pricing-card__features{border-top:1px solid var(--fnd-line,var(--preview-neutral-e4e4e7,#e4e4e7));padding:28px}.ui-foundations-preview .book-baseline{gap:8px;line-height:1;display:flex;position:relative}.ui-foundations-preview .book-baseline>strong,.ui-foundations-preview .book-baseline>span{white-space:nowrap;position:relative}.ui-foundations-preview .book-pricing-card__price{letter-spacing:-.04em;font-weight:700}.ui-foundations-preview .book-pricing-card__period{color:var(--fnd-body);font-size:1rem;font-weight:500}.ui-foundations-preview .book-baseline-anchor{vertical-align:baseline;width:0;height:0;padding:0;display:inline-block;position:relative}.ui-foundations-preview .book-loud-links a,.ui-foundations-preview .book-loud-links a h3{color:#1d4ed8}.ui-foundations-preview .book-quiet-links a{color:var(--preview-neutral-3e3e3e,#3e3e3e)}.ui-foundations-preview .book-quiet-links>.book-inline a{color:var(--preview-neutral-71717b,#71717b)}.ui-foundations-preview .book-demo[data-example=quiet-links]{padding-top:40px;padding-bottom:88px}.ui-foundations-preview .book-demo[data-consistent=true][data-example=quiet-links] .book-annotated{padding-block:16px}.ui-foundations-preview .book-demo .book-link-card h3{text-wrap:balance;margin-bottom:24px}.ui-foundations-preview .book-link-skeleton{width:100%;height:auto;fill:var(--fnd-skeleton);margin-bottom:24px;display:block}.ui-foundations-preview .book-demo .book-link-card h4{color:var(--preview-neutral-62626a,#62626a);margin-bottom:8px;font-size:.875rem;font-weight:600}.ui-foundations-preview .book-link-destinations ul{gap:0;display:grid}.ui-foundations-preview .book-link-destinations li{justify-content:space-between;align-items:center;gap:16px;display:flex}.ui-foundations-preview .book-link-destinations a{flex:1;align-items:center;min-height:36px;font-size:1rem;font-weight:500;display:flex}.ui-foundations-preview .book-demo .book-link-card nav a{color:var(--preview-neutral-3e3e3e,#3e3e3e);background:0 0;border-radius:4px;text-decoration:none}.ui-foundations-preview .book-demo .book-link-card nav a:hover{color:var(--preview-neutral-3e3e3e,#3e3e3e);text-underline-offset:3px;background:0 0;text-decoration:underline}@media (prefers-reduced-motion:reduce){.ui-foundations-preview .book-demo .book-link-card nav a{transition:none}}.ui-foundations-preview .book-demo a:hover{text-underline-offset:3px;text-decoration:underline}.ui-foundations-preview .book-table{border-collapse:collapse;width:100%}.ui-foundations-preview .book-table caption{text-align:start;margin-bottom:20px;font-size:22px;font-weight:650}.ui-foundations-preview .book-table td,.ui-foundations-preview .book-table th{border-bottom:1px solid var(--preview-neutral-e4e4e7,#e4e4e7);text-align:start;padding:12px 0;font-size:16px}.ui-foundations-preview .book-table th{color:var(--preview-neutral-71717b,#71717b);font-weight:500}.ui-foundations-preview .book-swatch-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.ui-foundations-preview .book-swatch-item{flex-direction:column;gap:12px;min-width:0;display:flex}.ui-foundations-preview .book-swatch-item code{overflow-wrap:anywhere;font-size:12px}.ui-foundations-preview .book-swatch{border-radius:10px;height:120px;box-shadow:inset 0 0 0 1px #00000012}.ui-foundations-preview .book-demo .book-palette-card{color:var(--fnd-heading);transition:background-color var(--preview-state-transition);gap:24px}.ui-foundations-preview .book-palette-card__header{gap:8px;display:grid}.ui-foundations-preview .book-palette-card__header>p{color:var(--fnd-body);transition:color var(--preview-state-transition);font-size:.875rem;line-height:1.5}.ui-foundations-preview .book-demo[data-corrected=false] .book-palette-card__header>p{color:var(--fnd-heading)}.ui-foundations-preview .book-palette-card__status{transition:background-color var(--preview-state-transition),color var(--preview-state-transition);border-radius:12px;align-items:center;gap:8px;padding:12px 16px;font-size:.875rem;font-weight:500;line-height:20px;display:flex}.ui-foundations-preview .book-demo .book-palette-card .book-button{background:var(--palette-action);height:40px;min-height:40px;color:var(--preview-neutral-ffffff,#fff);font-family:var(--font-sans);box-shadow:var(--shadow-fnd-control);border-color:#0000;border-radius:12px;padding-inline:16px;font-size:14px;font-weight:500;line-height:20px;transition:background-color .15s ease-out}.ui-foundations-preview .book-demo .book-palette-card .book-button:hover{background:var(--palette-action-hover);box-shadow:var(--shadow-fnd-control);transform:none}.ui-foundations-preview .book-demo .book-palette-card .book-button:active{background:var(--palette-action-hover);transform:none}.ui-foundations-preview .book-demo .book-palette-card .book-button:focus-visible{outline:2px solid var(--fnd-heading);outline-offset:3px}.ui-foundations-preview .book-palette-roles{border-top:1px solid #0000001a;flex-wrap:wrap;gap:8px;padding-top:16px;font-size:.75rem;font-weight:500;line-height:20px;display:flex}.ui-foundations-preview .book-palette-roles>span{border-radius:6px;align-items:center;padding:4px 8px;display:inline-flex}@media (prefers-reduced-motion:reduce){.ui-foundations-preview .book-demo .book-palette-card,.ui-foundations-preview .book-palette-card__header>p,.ui-foundations-preview .book-palette-card__status,.ui-foundations-preview .book-demo .book-palette-card .book-button{transition:none}}.ui-foundations-preview .book-demo .book-tint-card{width:400px;max-width:100%;color:var(--fnd-heading);grid-template-columns:minmax(0,1fr) 32px minmax(0,1fr);align-items:start;gap:24px;display:grid}.ui-foundations-preview .book-tint-sample{text-align:center;gap:16px;font-size:14px;font-weight:500;display:grid}.ui-foundations-preview .book-tint-swatch{border-radius:16px;height:144px;box-shadow:inset 0 0 0 1px #3e3e3e0f}.ui-foundations-preview .book-tint-swatch--content{text-align:center;align-content:center;justify-items:center;gap:12px;height:auto;min-height:144px;padding:16px;display:grid}.ui-foundations-preview .book-tint-swatch--content>strong{color:inherit;font-size:14px;font-weight:600;line-height:20px}.ui-foundations-preview .book-tint-arrow{width:32px;height:24px;color:var(--fnd-body);margin-top:60px}.ui-foundations-preview .book-shade-scale{border-radius:8px;grid-template-columns:repeat(9,minmax(0,1fr));display:grid}.ui-foundations-preview .book-shade-scale>span{min-height:80px;font-family:var(--font-mono);place-items:center;font-size:12px;font-weight:600;display:grid}.ui-foundations-preview .book-shade-scale>span:first-child{border-radius:8px 0 0 8px}.ui-foundations-preview .book-shade-scale>span:last-child{border-radius:0 8px 8px 0}.ui-foundations-preview .book-shade-card{gap:24px}.ui-foundations-preview .book-shade-family{gap:12px;display:grid}.ui-foundations-preview .book-shade-labels{color:var(--fnd-ink-secondary,var(--preview-neutral-525252,#525252));justify-content:space-between;font-size:12px;font-weight:500;display:flex}.ui-foundations-preview .book-shade-sample{gap:8px;padding:24px;display:grid}.ui-foundations-preview .book-demo[data-example=accessible-color] .book-annotated{min-width:1000px;padding-inline:48px}.ui-foundations-preview .book-demo .book-policy-card{width:700px;padding:0;overflow:hidden}.ui-foundations-preview .book-policy-table{table-layout:fixed;border-collapse:collapse;text-align:left;width:100%;font-size:14px}.ui-foundations-preview .book-policy-name-column{width:44%}.ui-foundations-preview .book-policy-plan-column{width:27%}.ui-foundations-preview .book-policy-status-column{width:29%}.ui-foundations-preview .book-policy-table thead{background:var(--preview-neutral-f6f7f8,#f6f7f8);color:var(--preview-neutral-52525b,#52525b)}.ui-foundations-preview .book-policy-table thead th{letter-spacing:.08em;text-transform:uppercase;padding:18px 20px;font-size:11px;font-weight:600}.ui-foundations-preview .book-policy-table tbody th,.ui-foundations-preview .book-policy-table td{border-top:1px solid var(--preview-neutral-e4e4e7,#e4e4e7);vertical-align:middle;padding:24px 20px;font-weight:400}.ui-foundations-preview .book-policy-skeleton{max-width:100%;fill:var(--fnd-skeleton);display:block}.ui-foundations-preview .book-policy-badge{white-space:nowrap;border-radius:999px;align-items:center;padding:4px 12px;font-size:12px;font-weight:600;line-height:20px;display:inline-flex}.ui-foundations-preview .book-callouts__contrast{white-space:nowrap;font-size:13px}.ui-foundations-preview .book-trends{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px;display:grid}.ui-foundations-preview .book-demo .book-card.book-depth-card{border:0;border-radius:16px;outline:none;width:344px;padding:32px}.ui-foundations-preview .book-depth-skeleton{display:block}.ui-foundations-preview .book-depth-stack{flex-direction:column;align-items:center;max-width:100%;display:flex}.ui-foundations-preview .book-demo .book-profile{width:480px;padding:0;overflow:hidden}.ui-foundations-preview .book-profile-cover{height:130px;position:relative}.ui-foundations-preview .book-profile-body{flex-direction:column;gap:12px;padding:24px;display:flex}.ui-foundations-preview .book-avatar{color:#34483b;background:#dce5dd;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:72px;height:72px;font-size:20px;font-weight:600;display:inline-flex;position:relative}.ui-foundations-preview .book-avatar--small{width:40px;height:40px;font-size:12px}.ui-foundations-preview .book-avatar--small:nth-child(2){color:#544639;background:#e8e1d9}.ui-foundations-preview .book-avatar--small:nth-child(3){color:#3d4b5e;background:#dde4ec}.ui-foundations-preview .book-avatar-group{display:flex}.ui-foundations-preview .book-demo .book-photo-card{width:600px;padding:0;overflow:hidden}.ui-foundations-preview .book-photo{height:240px;position:relative;overflow:hidden}.ui-foundations-preview .book-photo-caption{flex-direction:column;gap:8px;padding:24px;display:flex}.ui-foundations-preview .book-image-hero{width:650px;max-width:100%;min-height:340px;color:var(--preview-neutral-ffffff,#fff);border-radius:16px;align-items:center;padding:40px;display:flex;position:relative;overflow:hidden}.ui-foundations-preview .book-scrim{position:absolute;inset:0}.ui-foundations-preview .book-image-hero-copy{flex-direction:column;gap:20px;display:flex;position:relative}.ui-foundations-preview .book-image-hero-copy h3{color:var(--preview-neutral-ffffff,#fff);font-size:40px;line-height:1}.ui-foundations-preview .book-demo .book-asset-demo{text-align:center;align-items:center;width:360px}.ui-foundations-preview .book-asset-icon-slot{flex:none;place-items:center;width:88px;height:88px;display:grid}.ui-foundations-preview .book-icon-frame{background:var(--preview-neutral-f0f0f2,#f0f0f2);border-radius:16px;flex-shrink:0;justify-content:center;align-items:center;width:64px;height:64px;display:inline-flex}.ui-foundations-preview .book-icon-frame--bare{background:0 0;width:88px;height:88px}.ui-foundations-preview .book-screenshot-window{border:1px solid var(--preview-neutral-e4e4e7,#e4e4e7);text-align:start;background:var(--preview-neutral-ffffff,white);border-radius:8px;width:320px;max-width:100%;height:210px;overflow:hidden}.ui-foundations-preview .book-screenshot{transform-origin:0 0;grid-template-columns:150px 1fr;gap:24px;width:800px;padding:24px;font-size:16px;display:grid;transform:scale(.4)}.ui-foundations-preview .book-screenshot section{flex-direction:column;gap:16px;display:flex}.ui-foundations-preview .book-screenshot aside{background:var(--preview-neutral-f4f4f5,#f4f4f5);padding:16px}.ui-foundations-preview .book-screenshot--cropped{width:470px;padding:20px;display:block;transform:none}.ui-foundations-preview .book-screenshot--cropped aside{display:none}.ui-foundations-preview .book-screenshot h4{font-size:20px}.ui-foundations-preview .book-browser-tab{background:var(--preview-neutral-f4f4f5,#f4f4f5);border-radius:10px 10px 0 0;align-items:center;gap:12px;width:220px;padding:16px;font-size:14px;display:flex}.ui-foundations-preview .book-mini-logo{flex-shrink:0;width:16px;height:16px;overflow:hidden}.ui-foundations-preview .book-complex-mark{transform-origin:0 0;flex-direction:column;justify-content:center;align-items:center;width:128px;height:128px;font-size:18px;display:flex;transform:scale(.125)}.ui-foundations-preview .book-complex-mark .book-icon{width:56px;height:56px}.ui-foundations-preview .book-demo[data-example=image-outline]:has([data-outline-tone=warning]){--value-leader-color:#f28c28}.ui-foundations-preview .book-demo .book-image-frames-card{gap:32px}.ui-foundations-preview .book-upload-row{align-items:center;gap:16px;display:flex}.ui-foundations-preview .book-upload-frame{flex:1;min-width:0;position:relative;overflow:hidden}.ui-foundations-preview .book-benefits,.ui-foundations-preview .book-default-list{flex-direction:column;gap:16px;margin:0;padding:0;list-style:none;display:flex}.ui-foundations-preview .book-benefits li{align-items:center;gap:12px;display:flex}.ui-foundations-preview .book-default-list{padding-left:20px;list-style:outside}.ui-foundations-preview .book-decorative-surface{position:relative;overflow:hidden;width:560px!important;padding:40px!important}.ui-foundations-preview .book-decorative-surface>.book-stack{position:relative}.ui-foundations-preview .book-decorative-surface h3{font-size:36px;line-height:1}.ui-foundations-preview .book-dot-pattern{background-image:radial-gradient(var(--preview-neutral-3e3e3e,#3e3e3e)2px,transparent 2px);pointer-events:none;background-size:16px 16px;position:absolute;inset:0}.ui-foundations-preview .book-empty{text-align:center;align-items:center;padding:16px 0}.ui-foundations-preview .book-empty>.book-button{align-self:center}.ui-foundations-preview .book-empty p{max-width:32ch}.ui-foundations-preview .book-project-list{border:1px solid var(--preview-neutral-e4e4e7,#e4e4e7);border-radius:8px;flex-direction:column;gap:16px;min-height:210px;padding:24px;display:flex}.ui-foundations-preview .book-project-list>.book-button{align-self:flex-start}.ui-foundations-preview .book-activity{flex-direction:column;display:flex}.ui-foundations-preview .book-activity p{color:var(--preview-neutral-71717b,#71717b);font-size:14px}.ui-foundations-preview .book-plan-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.ui-foundations-preview .book-plan-option{border:1px solid var(--preview-neutral-d4d4d8,#d4d4d8);cursor:pointer;border-radius:10px;align-items:flex-start;gap:10px;padding:20px 16px;font-size:14px;display:flex}.ui-foundations-preview .book-plan-option[data-selected=true]{outline:2px solid var(--preview-neutral-3e3e3e,#3e3e3e);outline-offset:-2px;background:var(--preview-neutral-fafafa,#fafafa)}.ui-foundations-preview .book-plan-option .book-stack{gap:10px}.ui-foundations-preview .book-plan-option input{margin-top:3px}.ui-foundations-preview .book-plan-option small{font-size:12px;font-weight:400}.ui-foundations-preview .book-inset-action{gap:8px;display:flex}.ui-foundations-preview .book-inset-action input{flex:1}.ui-foundations-preview .book-inset-action--nested{border:1px solid var(--preview-neutral-a1a1aa,#a1a1aa);background:var(--preview-neutral-fafafa,#fafafa);border-radius:12px}.ui-foundations-preview .book-inset-action--nested input{background:0 0;border:none}.ui-foundations-preview .book-practice{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:32px;width:780px;max-width:100%;display:grid}.ui-foundations-preview .book-practice>.book-stack{gap:12px}.ui-foundations-preview .book-setting-select{appearance:none;border:1px solid var(--preview-neutral-d4d4d8,#d4d4d8);background:var(--preview-neutral-ffffff,#fff);max-width:100%;min-height:36px;color:var(--preview-neutral-3e3e3e,#3e3e3e);border-radius:8px;padding:7px 32px 7px 12px;font-size:13px;font-weight:500}.ui-foundations-preview .book-setting-select:focus-visible{outline:2px solid var(--preview-neutral-3e3e3e,#3e3e3e);outline-offset:3px}@media (min-width:900px){.ui-foundations-preview .book-demo .book-explanation{white-space:nowrap}}@media (max-width:640px){.ui-foundations-preview .book-demo{padding:88px 16px 76px}.ui-foundations-preview .book-demo .book-card{padding:20px}.ui-foundations-preview .book-scene{min-height:280px}.ui-foundations-preview .book-demo .book-mini-app{padding:0}.ui-foundations-preview .book-demo .book-mini-app[data-adaptive=true]{grid-template-columns:minmax(0,1fr)!important}.ui-foundations-preview .book-layout-sidebar,.ui-foundations-preview .book-layout-main{padding:16px}.ui-foundations-preview .book-demo .book-profile,.ui-foundations-preview .book-demo .book-photo-card,.ui-foundations-preview .book-demo .book-policy-card{padding:0}.ui-foundations-preview .book-trends{gap:20px}.ui-foundations-preview .book-trends strong{font-size:24px!important}.ui-foundations-preview .book-image-hero{min-height:300px;padding:28px}.ui-foundations-preview .book-image-hero-copy h3{font-size:32px}.ui-foundations-preview .book-photo{height:200px}.ui-foundations-preview .book-upload-row{gap:8px}.ui-foundations-preview .book-plan-options,.ui-foundations-preview .book-practice{grid-template-columns:minmax(0,1fr)}.ui-foundations-preview .book-swatch-row{gap:8px}.ui-foundations-preview .book-swatch{height:90px}.ui-foundations-preview .book-shade-scale>span{min-height:56px;font-size:10px}.ui-foundations-preview .book-decorative-surface{padding:28px!important}}@media (prefers-reduced-motion:reduce){.ui-foundations-preview .book-demo .book-button,.ui-foundations-preview .book-demo .book-type-article__actions .book-button,.ui-foundations-preview .book-demo .book-font-card .book-button{transition:none}.ui-foundations-preview .book-demo .book-button:active{transform:none}}.ui-foundations-preview .book-demo[data-example=leading] :is(.book-leading-title,.book-leading-paragraphs){transition:line-height var(--preview-state-transition)}@media (prefers-reduced-motion:reduce){.ui-foundations-preview .book-demo[data-example=leading] :is(.book-leading-title,.book-leading-paragraphs){transition:none}}
.ui-foundations-preview .comparison-preview-motion,.ui-foundations-preview .book-demo[data-color-motion]{--preview-surface-fade:var(--preview-state-transition);--preview-text-fade:var(--preview-state-transition)}.ui-foundations-preview .book-demo[data-color-motion] :is(.book-card,.book-inset,.book-button,.book-policy-badge,.book-palette-card__status,.book-palette-roles>span,.book-shade-scale>span,.book-tint-swatch,.book-scrim,.book-activity>div){transition:background-color var(--preview-surface-fade),color var(--preview-text-fade),border-color var(--preview-surface-fade)}.ui-foundations-preview .book-demo[data-color-motion] :is(h3,p,strong){transition:color var(--preview-text-fade)}.ui-foundations-preview .book-demo[data-color-motion] .book-dot-pattern{transition:opacity var(--preview-surface-fade)}.ui-foundations-preview .book-demo[data-color-motion] .book-chart-window{transition:filter var(--preview-surface-fade)}.ui-foundations-preview .book-demo[data-color-motion] .book-button:is(:hover,:active){transition-duration:.15s}@media (prefers-reduced-motion:reduce){.ui-foundations-preview .book-demo[data-color-motion] :is(.book-card,.book-inset,.book-button,.book-policy-badge,.book-palette-card__status,.book-palette-roles>span,.book-shade-scale>span,.book-tint-swatch,.book-scrim,.book-activity>div,h3,p,strong,.book-dot-pattern,.book-chart-window),.ui-foundations-preview .book-demo[data-color-motion] .book-button:is(:hover,:active){transition:none}}
.ui-foundations-preview .ethos-scene{width:max-content;max-width:100%;color:var(--preview-neutral-3e3e3e,#3e3e3e);font-family:var(--font-sans);place-items:center;display:grid;position:relative}.ui-foundations-preview .ethos-scene svg{flex-shrink:0;display:block}.ui-foundations-preview .ethos-scene .lucide{width:16px;height:16px;color:var(--preview-neutral-6b6b73,#6b6b73)}.ui-foundations-preview .ethos-lines{width:100%;color:var(--fnd-skeleton);flex:none;display:block}.ui-foundations-preview .ethos-media{background:var(--fnd-page);border-radius:8px;width:100%;height:120px;position:relative;overflow:hidden}.ui-foundations-preview .ethos-media img{object-fit:cover}.ui-foundations-preview .ethos-elevation-card,.ui-foundations-preview .ethos-base-tile{border:1px solid var(--preview-neutral-e4e4e7,#e4e4e7);background:var(--preview-neutral-ffffff,white);border-radius:16px;max-width:100%;padding:24px;position:relative}.ui-foundations-preview .book-demo .ethos-scene h3{letter-spacing:-.025em;margin:0;font-size:22px;font-weight:600;line-height:28px}.ui-foundations-preview .ethos-scene .ethos-button{box-sizing:border-box;border:1px solid var(--fnd-line);background:var(--preview-neutral-ffffff,white);height:48px;min-height:48px;max-height:48px;color:var(--fnd-heading);font:500 14px/20px var(--font-sans);white-space:nowrap;box-shadow:var(--shadow-fnd-control);cursor:pointer;border-radius:12px;flex:none;justify-content:center;align-items:center;gap:8px;margin:0;padding:0 18px;transition:color .15s cubic-bezier(.4,0,.2,1),background-color .15s cubic-bezier(.4,0,.2,1),border-color .15s cubic-bezier(.4,0,.2,1);display:inline-flex;position:relative}.ui-foundations-preview .ethos-scene .ethos-button:has(>svg:first-child:not(:only-child)){padding-inline-start:14px}.ui-foundations-preview .ethos-scene .ethos-button:has(>svg:last-child:not(:only-child)){padding-inline-end:14px}.ui-foundations-preview .ethos-scene .ethos-button svg{color:inherit}.ui-foundations-preview .ethos-scene .ethos-button:hover{border-color:var(--fnd-line-medium);background:var(--fnd-page)}.ui-foundations-preview .ethos-scene .ethos-button:active{background:var(--fnd-line-subtle)}.ui-foundations-preview .book-demo .ethos-scene .ethos-button:focus-visible{outline:2px solid var(--fnd-heading);outline-offset:2px}.ui-foundations-preview .ethos-scene .ethos-icon-button{width:48px;padding:0}.ui-foundations-preview .ethos-base-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:24px;width:536px;max-width:100%;display:grid}.ui-foundations-preview .ethos-base-tile{flex-direction:column;gap:24px;min-width:0;display:flex}.ui-foundations-preview .ethos-base-tile .ethos-folder-icon{width:28px;height:28px}.ui-foundations-preview .book-demo .ethos-base-tile h3{font-size:18px;line-height:24px}.ui-foundations-preview .ethos-base-tile>.ethos-button{align-self:flex-start}.ui-foundations-preview .ethos-folder-files{gap:12px;display:grid}.ui-foundations-preview .ethos-folder-files>span{align-items:center;gap:8px;font-size:14px;display:flex}.ui-foundations-preview .ethos-menu-row:focus-visible{outline:2px solid var(--preview-neutral-3e3e3e,#3e3e3e);outline-offset:-2px}.ui-foundations-preview .ethos-dropdown{width:214px;max-width:100%;min-height:calc(var(--ethos-menu-rows)*36px + 18px);position:relative}.ui-foundations-preview .ethos-dropdown .ethos-menu-anchor{position:absolute;bottom:calc(100% + 12px);left:0}.ui-foundations-preview .ethos-scene .ethos-menu-anchor{justify-content:center;width:max-content;height:40px;min-height:40px;max-height:40px}.ui-foundations-preview .ethos-menu-anchor .ethos-filter-chevron{width:12px;height:12px}.ui-foundations-preview .ethos-menu{border-radius:12px;width:214px;padding:8px}.ui-foundations-preview .ethos-menu-row{width:100%;height:36px;min-height:36px;color:var(--preview-neutral-3e3e3e,#3e3e3e);text-align:left;font:500 14px/20px var(--font-sans);cursor:pointer;background:0 0;border:0;border-radius:6px;align-items:center;gap:12px;padding:8px 12px;display:flex}.ui-foundations-preview .ethos-menu-row>span{flex:1}.ui-foundations-preview .ethos-menu-row:hover,.ui-foundations-preview .ethos-menu-row[aria-checked=true]{background:var(--preview-neutral-f4f4f5,#f4f4f5)}.ui-foundations-preview .ethos-menu-row--danger,.ui-foundations-preview .ethos-menu-row--danger .lucide{color:#dc2626}.ui-foundations-preview .ethos-menu-row--danger:hover{background:#fef2f2}.ui-foundations-preview .ethos-feature-card{gap:24px;width:344px;display:grid}.ui-foundations-preview .ethos-feature-footer{display:flex}.ui-foundations-preview .ethos-feature-footer .ethos-button{height:40px;min-height:40px;max-height:40px}.ui-foundations-preview .ethos-toast,.ui-foundations-preview .ethos-modal{--ethos-surface-radius:16px;--ethos-close-inset:12px;border-radius:var(--ethos-surface-radius)}.ui-foundations-preview .ethos-toast{align-items:flex-start;gap:16px;width:400px;padding:24px;display:flex}.ui-foundations-preview .ethos-toast-avatar{object-fit:cover;filter:grayscale();border-radius:50%;flex:none;width:40px;height:40px}.ui-foundations-preview .ethos-toast-content{flex-direction:column;flex:1;align-items:flex-start;gap:8px;min-width:0;display:flex}.ui-foundations-preview .book-demo .ethos-toast h3{letter-spacing:0;margin:0;padding-inline-end:32px;font-size:1.125rem;font-weight:600;line-height:1.5rem}.ui-foundations-preview .book-demo .ethos-toast-message{color:var(--preview-neutral-52525b,#52525b);text-wrap:pretty;margin:0;font-size:14px;line-height:1.5}.ui-foundations-preview .ethos-toast .ethos-toast-reply{background:var(--preview-neutral-3e3e3e,#3e3e3e);border-color:var(--preview-neutral-3e3e3e,#3e3e3e);height:40px;min-height:40px;max-height:40px;color:var(--preview-neutral-ffffff,white);margin-top:8px}.ui-foundations-preview .ethos-toast .ethos-toast-reply:hover{background:var(--preview-neutral-505050,#505050);border-color:var(--preview-neutral-505050,#505050)}.ui-foundations-preview .ethos-toast .ethos-toast-reply:active{background:var(--preview-neutral-303030,#303030);border-color:var(--preview-neutral-303030,#303030)}.ui-foundations-preview .ethos-toast .ethos-toast-close{top:var(--ethos-close-inset);right:var(--ethos-close-inset);border-radius:calc(var(--ethos-surface-radius) - var(--ethos-close-inset));width:32px;height:32px;min-height:32px;max-height:32px;box-shadow:none;background:0 0;border:0;margin:0;position:absolute}.ui-foundations-preview .ethos-toast .ethos-toast-close:hover{background:var(--fnd-page);box-shadow:none;border:0}.ui-foundations-preview .ethos-toast .ethos-toast-close svg{width:16px;height:16px}.ui-foundations-preview .ethos-toast-compose{gap:8px;width:100%;margin-top:8px;font-size:.875rem;display:grid}.ui-foundations-preview .ethos-toast-compose textarea{border:1px solid var(--preview-neutral-71717a,#71717a);background:var(--preview-neutral-fafafa,#fafafa);width:100%;color:var(--preview-neutral-3e3e3e,#3e3e3e);font:400 1rem/1.5 var(--font-sans);resize:vertical;border-radius:8px;padding:10px 12px}.ui-foundations-preview .ethos-toast-compose .ethos-button{justify-self:start}.ui-foundations-preview .ethos-toast-status{color:var(--preview-neutral-52525b,#52525b);font-size:.875rem}@media (pointer:coarse){.ui-foundations-preview .ethos-toast .ethos-button{height:44px;min-height:44px;max-height:44px}.ui-foundations-preview .ethos-toast .ethos-toast-close{width:44px}}.ui-foundations-preview .ethos-modal-stage{place-items:center;width:400px;max-width:100%;min-height:300px;display:grid;position:relative}.ui-foundations-preview .ethos-modal{z-index:2;width:400px;color:var(--preview-neutral-3e3e3e,#3e3e3e);margin:0;padding:20px;display:block}.ui-foundations-preview .ethos-modal-stage>.ethos-reopen{z-index:2}.ui-foundations-preview .ethos-modal .ethos-storage-icon{color:#9ca3af;width:28px;height:28px;margin-bottom:12px}.ui-foundations-preview .book-demo .ethos-modal h3{letter-spacing:0;font-size:1.125rem;line-height:1.5rem}.ui-foundations-preview .book-demo .ethos-storage-description{color:var(--preview-neutral-52525b,#52525b);margin:8px 0 0;font-size:.875rem;line-height:1.5}.ui-foundations-preview .ethos-storage-usage{margin-top:20px}.ui-foundations-preview .ethos-storage-labels{color:var(--preview-neutral-52525b,#52525b);flex-wrap:wrap;justify-content:space-between;gap:8px;font-size:.875rem;line-height:24px;display:flex}.ui-foundations-preview .ethos-storage-meter{background:var(--preview-neutral-e4e4e7,#e4e4e7);border-radius:999px;height:6px;margin-top:8px;overflow:hidden}.ui-foundations-preview .ethos-storage-meter>span{border-radius:inherit;background:#be2345;width:75.26%;height:100%;display:block}.ui-foundations-preview .ethos-modal-actions{flex-wrap:wrap;justify-content:flex-start;gap:12px;margin-top:20px;display:flex}.ui-foundations-preview .ethos-modal .ethos-button{height:40px;min-height:40px;max-height:40px}.ui-foundations-preview .ethos-modal .ethos-modal-close{top:var(--ethos-close-inset);right:var(--ethos-close-inset);border-radius:calc(var(--ethos-surface-radius) - var(--ethos-close-inset));width:40px;box-shadow:none;background:0 0;border:0;position:absolute}.ui-foundations-preview .ethos-modal .ethos-modal-close:hover{background:var(--fnd-page);box-shadow:none;border:0}.ui-foundations-preview .ethos-modal-close svg{width:18px;height:18px}.ui-foundations-preview .ethos-modal .ethos-modal-cancel{color:#b91c1c;background:var(--preview-neutral-ffffff,#fff);border-color:currentColor}.ui-foundations-preview .ethos-modal .ethos-modal-cancel:hover{color:#991b1b;background:#fef2f2;border-color:currentColor}.ui-foundations-preview .ethos-modal .ethos-modal-cancel:active{background:#fee2e2}.dark .ui-foundations-preview .ethos-menu-row--danger,.dark .ui-foundations-preview .ethos-menu-row--danger .lucide,.dark .ui-foundations-preview .ethos-modal .ethos-modal-cancel{color:#fda4af}.dark .ui-foundations-preview .ethos-menu-row--danger:hover,.dark .ui-foundations-preview .ethos-modal .ethos-modal-cancel:hover{color:#fecdd3;background:#281519}.dark .ui-foundations-preview .ethos-modal .ethos-modal-cancel:active{background:#341b21}.ui-foundations-preview .preview-stage:has(.ethos-modal-stage){isolation:isolate}.ui-foundations-preview .preview-stage:has(.ethos-modal-stage)>.example-preview-ink{z-index:auto}.ui-foundations-preview .book-demo[data-example=ethos-overlay] .book-scene{animation:none}.ui-foundations-preview .book-demo[data-example=ethos-overlay] .book-callouts{z-index:3}.ui-foundations-preview .preview-stage:has(.ethos-modal-stage):after{content:"";z-index:1;opacity:0;pointer-events:none;background:#09090b47;transition:opacity .18s ease-out;position:absolute;inset:0}.ui-foundations-preview .preview-stage:has(.ethos-modal[open][data-corrected=true]):after{opacity:1}@media (prefers-reduced-motion:reduce){.ui-foundations-preview .ethos-scene .ethos-button{transition:none}.ui-foundations-preview .preview-stage:has(.ethos-modal-stage):after{transition:none}}
.ui-foundations-preview .book-demo .font-feature-example{width:420px;max-width:100%;font-family:var(--font-sans);font-optical-sizing:auto;color:var(--fnd-body)}.ui-foundations-preview .book-demo .font-feature-example h4{letter-spacing:normal;font-size:1rem;font-weight:400;line-height:1.4}.ui-foundations-preview .book-demo .font-feature-example .font-feature-specimen{color:var(--fnd-heading);overflow-wrap:anywhere;font-size:clamp(1.5rem,4vw,2rem);font-weight:700;line-height:1.5}
.ui-foundations-preview .book-demo .font-smoothing-example{width:420px;max-width:100%;font-family:var(--font-sans);color:var(--fnd-body)}.ui-foundations-preview .book-demo .font-smoothing-specimen h4{color:var(--fnd-heading);letter-spacing:-.025em;font-size:2rem;font-weight:700;line-height:1.25}.ui-foundations-preview .book-demo .font-smoothing-specimen p{color:var(--fnd-body);font-size:1rem;font-weight:400;line-height:1.625}.ui-foundations-preview .reading-width-stops.font-smoothing-stops button[data-tone=danger]{color:var(--fnd-danger)}.ui-foundations-preview .reading-width-stops.font-smoothing-stops button[data-tone=success]{color:var(--fnd-success)}.ui-foundations-preview .reading-width-stops.font-smoothing-stops button[data-tone=warning]{color:#f28c28}.ui-foundations-preview .book-demo[data-smoothing-tone=danger]{--value-leader-color:var(--fnd-danger)}.ui-foundations-preview .book-demo[data-smoothing-tone=success]{--value-leader-color:var(--fnd-success)}.ui-foundations-preview .book-demo[data-smoothing-tone=warning]{--value-leader-color:#f28c28}
.ui-foundations-preview .book-demo[data-consistent=true] .book-annotated{min-width:920px;padding-inline:232px}.ui-foundations-preview .book-demo[data-consistent=true][data-example=image-outline] .book-annotated{min-width:1040px;padding-inline:232px}.ui-foundations-preview .book-callouts--consistent .book-callouts__label-content>[data-property]{white-space:nowrap}.ui-foundations-preview .book-callouts--consistent .book-callouts__tint{fill-opacity:.05}.ui-foundations-preview .book-callouts--consistent .book-callouts__hatch{fill-opacity:.24}
.ui-foundations-preview .example-preview-ink label:has(input:is([type=checkbox],[type=radio])){-webkit-user-select:none;user-select:none}.ui-foundations-preview .example-preview-ink .form-choice-card[data-choice-example=label-selection][data-corrected=false] :is(label,.form-choice-selectable-label){-webkit-user-select:text;user-select:text}.ui-foundations-preview .form-choice-selectable-label::selection{color:#1e3a8a;background:#bfdbfe}.ui-foundations-preview .book-demo :is(input:not([type]),input[type=text],input[type=email],input[type=password],input[type=search],input[type=date],textarea),.ui-foundations-preview .book-demo .searchable-select-example__trigger{border:1px solid var(--input-demo-border,var(--preview-neutral-e8e8e8,#e8e8e8));background:var(--input-demo-fill,var(--preview-neutral-f0f0f0,#f0f0f0));min-width:0;min-height:44px;color:var(--input-demo-text,var(--preview-neutral-505050,#505050));caret-color:var(--input-demo-text,var(--preview-neutral-505050,#505050));font-family:var(--font-sans);box-shadow:none;border-radius:8px;padding:0 14px;font-size:14px;font-weight:400;line-height:20px}.ui-foundations-preview .book-demo textarea{padding-block:12px}.ui-foundations-preview .book-demo .searchable-select-example__search input{height:40px;min-height:40px;color:var(--preview-neutral-6b6b73,#6b6b73);padding-inline:34px 38px}.ui-foundations-preview .book-demo .searchable-select-example__search svg.lucide{width:14px;height:14px;color:var(--preview-neutral-6b6b73,#6b6b73)}.ui-foundations-preview .book-demo .searchable-select-example__clear svg.lucide{width:12px;height:12px}.ui-foundations-preview .book-demo :is(input,textarea)::placeholder{color:var(--input-demo-placeholder,var(--preview-neutral-6b6b73,#6b6b73));opacity:1;font-size:14px;font-weight:400}.ui-foundations-preview .book-demo :is(input:not([type]),input[type=text],input[type=email],input[type=password],input[type=search],input[type=date],textarea):focus-visible,.ui-foundations-preview .book-demo .searchable-select-example__trigger:focus-visible{outline:2px solid var(--input-demo-focus,var(--preview-neutral-8a8a8a,#8a8a8a));outline-offset:3px}.ui-foundations-preview .example-preview-ink input:is([type=checkbox],[type=radio]):not(.sr-only):not([role=switch]){appearance:none;border:1px solid var(--preview-neutral-c4c4cb,#c4c4cb);background-color:var(--preview-neutral-f4f4f5,#f4f4f5);width:16px;min-width:16px;height:16px;min-height:16px;color:var(--preview-neutral-ffffff,#fff);box-shadow:none;cursor:pointer;vertical-align:middle;background-position:50%;background-repeat:no-repeat;border-radius:5px;flex:0 0 16px;margin:0;padding:0;transition:border-color .12s ease-out,background-color .12s ease-out;display:inline-block}.ui-foundations-preview .example-preview-ink input[type=radio]:not(.sr-only):not([role=switch]){border-radius:50%}.ui-foundations-preview .example-preview-ink input:is([type=checkbox],[type=radio]):not(.sr-only):not([role=switch]):checked{border-color:var(--preview-neutral-3e3e3e,#3e3e3e);background-color:var(--preview-neutral-3e3e3e,#3e3e3e)}.ui-foundations-preview .example-preview-ink input[type=checkbox]:not(.sr-only):not([role=switch]):checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m2 6 2.5 2.5L10 3'/%3E%3C/svg%3E");background-size:9px 9px}.ui-foundations-preview .example-preview-ink input[type=radio]:not(.sr-only):not([role=switch]):checked{border-color:var(--preview-neutral-3e3e3e,#3e3e3e);background-color:var(--preview-neutral-ffffff,#fff);background-image:radial-gradient(circle,var(--preview-neutral-3e3e3e,#3e3e3e)0 4px,transparent 4.5px)}.ui-foundations-preview .example-preview-ink input:is([type=checkbox],[type=radio]):not(.sr-only):not([role=switch]):focus-visible{outline:2px solid var(--preview-neutral-3e3e3e,#3e3e3e);outline-offset:2px}.ui-foundations-preview .example-preview-ink input:is([type=checkbox],[type=radio]):disabled{opacity:.5;cursor:not-allowed}.ui-foundations-preview .book-demo .form-choice-control{flex:0 0 16px;justify-content:center;align-items:center;width:16px;height:16px;line-height:0;display:flex}.ui-foundations-preview .example-preview-ink .form-choice-card[data-corrected=true] .form-choice-multiline-row input{margin-top:calc(.75em - 8px)}@media (prefers-reduced-motion:reduce){.ui-foundations-preview .example-preview-ink input:is([type=checkbox],[type=radio]){transition:none}}@media (forced-colors:active){.ui-foundations-preview .example-preview-ink input:is([type=checkbox],[type=radio]):not(.sr-only):not([role=switch]){appearance:auto;background-image:none}}
.ui-foundations-preview .book-demo .revenue-example{background:var(--preview-neutral-ffffff,#fff);border:1px solid var(--preview-neutral-e5e7eb,#e5e7eb);color:#525d70;border-radius:12px;width:960px;min-width:0;max-width:100%;padding:24px;box-shadow:0 1px 2px #10182805}.ui-foundations-preview .revenue-example__header{border-bottom:1px solid var(--preview-neutral-f1f2f4,#f1f2f4);flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:20px;padding-bottom:20px;display:flex}.ui-foundations-preview .revenue-example__header>div:first-child{gap:16px;display:grid}.ui-foundations-preview .revenue-example__skeleton{background:var(--fnd-skeleton);border-radius:6px;height:12px;display:block}.ui-foundations-preview .revenue-example__axis-skeletons{fill:var(--fnd-skeleton)}.ui-foundations-preview .revenue-example__series-labels{fill:var(--fnd-heading);font-size:18px;font-weight:600}.ui-foundations-preview .revenue-example__skeleton--title{width:96px;height:12px}.ui-foundations-preview .revenue-example__skeleton--subtitle{width:120px}.ui-foundations-preview .revenue-example__plot:focus-visible{outline-offset:3px;outline:2px solid #2948ed}.ui-foundations-preview .revenue-example__plot{padding-top:12px;transition:filter .42s cubic-bezier(.22,1,.36,1);overflow-x:auto}.ui-foundations-preview .revenue-example__plot>svg{width:100%;min-width:660px;display:block}@media (prefers-reduced-motion:reduce){.ui-foundations-preview .revenue-example__plot{transition:none}}
.ui-foundations-preview .book-demo .form-choice-card{color:var(--preview-neutral-3e3e3e,#3e3e3e)}.ui-foundations-preview .form-choice-card .form-choice-heading{gap:8px}.ui-foundations-preview .form-choice-heading p,.ui-foundations-preview .form-choice-selection{color:var(--preview-neutral-62626b,#62626b);font-size:.875rem;line-height:1.5}.ui-foundations-preview .form-choice-fieldset{border:0;min-width:0;margin:0;padding:0}.ui-foundations-preview .form-choice-row{min-width:0;color:var(--preview-neutral-3e3e3e,#3e3e3e);cursor:pointer;align-items:center;gap:12px;font-size:1rem;font-weight:400;line-height:1.5;display:flex;position:relative}.ui-foundations-preview .form-choice-card input:is([type=checkbox],[type=radio]){width:16px;height:16px;font-size:inherit;accent-color:var(--preview-neutral-3e3e3e,#3e3e3e);cursor:pointer;flex:0 0 16px;margin:0;display:block}.ui-foundations-preview .form-choice-card input:focus-visible{outline:2px solid var(--preview-neutral-3e3e3e,#3e3e3e);outline-offset:4px}.ui-foundations-preview .form-choice-row>span:not(.value-reveal,.form-choice-control){overflow-wrap:anywhere;min-width:0}.ui-foundations-preview .form-choice-control{flex:0 0 16px;width:16px;height:16px;display:block;position:relative}.ui-foundations-preview .form-choice-target-list{gap:8px;display:grid}.ui-foundations-preview .form-choice-card[data-choice-example=clickable-labels] .form-choice-target-list{gap:2px}.ui-foundations-preview .form-choice-hit-row{min-height:var(--form-choice-target,44px);border-radius:8px;padding:4px 12px;font-weight:500}.ui-foundations-preview .book-demo .form-choice-account-card{width:460px}.ui-foundations-preview .form-choice-account-card>h3{margin-bottom:16px}.ui-foundations-preview .form-choice-card[data-choice-example=label-selection] .form-choice-selectable-label{isolation:isolate;position:relative}.ui-foundations-preview .form-choice-card[data-choice-example=label-selection] .form-choice-selectable-label:before{content:"";z-index:-1;color:var(--value-leader-color,#ff5268);background-color:color-mix(in srgb,currentColor 5%,transparent);background-image:repeating-linear-gradient(135deg,transparent 0 2px,color-mix(in srgb,currentColor 24%,transparent)2px 3px);pointer-events:none;border:0;border-radius:4px;position:absolute;inset:-4px}.ui-foundations-preview .book-demo[data-values=false] .form-choice-selectable-label:before{visibility:hidden}.ui-foundations-preview .form-choice-account-card .form-choice-terms-row{gap:8px;min-height:40px;padding:4px 0;font-size:14px;font-weight:400}.ui-foundations-preview .form-choice-skeleton-fields{gap:24px;display:grid}.ui-foundations-preview .form-choice-skeleton-field-group{gap:12px;display:grid}.ui-foundations-preview .form-choice-skeleton-label,.ui-foundations-preview .form-choice-skeleton-field{display:block}.ui-foundations-preview .form-choice-terms-text{text-underline-offset:3px;font-weight:500;text-decoration:underline}.ui-foundations-preview .form-choice-terms-text:hover{text-decoration:none}.ui-foundations-preview .book-demo .form-choice-card[data-choice-example=label-selection] .form-choice-terms-row:is(:hover,:active){background:0 0}.ui-foundations-preview .book-demo .form-choice-card[data-choice-example=clickable-labels]{gap:12px}.ui-foundations-preview .form-choice-card[data-corrected=false] .form-choice-hit-row{cursor:default}.ui-foundations-preview .form-choice-card[data-corrected=true] .form-choice-hit-row:hover{background:var(--preview-neutral-f4f4f5,#f4f4f5)}.ui-foundations-preview .form-choice-card[data-corrected=true] .form-choice-hit-row:active{background:var(--preview-neutral-eaeaed,#eaeaed)}.ui-foundations-preview .form-choice-input-target,.ui-foundations-preview .form-choice-row-target{z-index:1;color:var(--value-leader-color,#ff5268);background-color:color-mix(in srgb,currentColor 5%,transparent);background-image:repeating-linear-gradient(135deg,transparent 0 2px,color-mix(in srgb,currentColor 24%,transparent)2px 3px);pointer-events:none;border:0;position:absolute}.ui-foundations-preview .form-choice-input-target{border-radius:5px;inset:0}.ui-foundations-preview .form-choice-control:has(input[type=radio]) .form-choice-input-target{border-radius:50%}.ui-foundations-preview .form-choice-row-target{border-radius:inherit;inset:0}.ui-foundations-preview .form-choice-card[data-corrected=true] .form-choice-input-target,.ui-foundations-preview .form-choice-card[data-corrected=false] .form-choice-row-target{display:none}.ui-foundations-preview .form-choice-divider{background:var(--preview-neutral-e4e4e7,#e4e4e7);height:1px}.ui-foundations-preview .form-choice-multiline-row{align-items:center;min-height:44px;padding-block:4px}.ui-foundations-preview .form-choice-card[data-corrected=true] .form-choice-multiline-row{align-items:flex-start}.ui-foundations-preview .form-choice-card[data-corrected=true] .form-choice-multiline-row input{margin-top:calc(.75em - 8px)}.ui-foundations-preview .book-demo .form-choice-card[data-choice-example=checkbox-column]{gap:24px;width:360px}.ui-foundations-preview .form-choice-card[data-choice-example=checkbox-column] .form-choice-heading{gap:16px}.ui-foundations-preview .form-choice-toppings{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 12px;display:grid;position:relative}.ui-foundations-preview .form-choice-card[data-corrected=true] .form-choice-toppings{grid-template-columns:minmax(0,1fr)}.ui-foundations-preview .form-choice-topping{border-radius:6px;gap:8px;min-height:32px;padding:4px 8px;font-size:14px;font-weight:500}.ui-foundations-preview .form-choice-column-guides{grid-template-columns:inherit;column-gap:inherit;pointer-events:none;display:grid;position:absolute;inset:0}.ui-foundations-preview .form-choice-column-guides>span{width:8px;height:100%;color:var(--value-leader-color);border:0;position:relative;left:-4px}.ui-foundations-preview .book-demo[data-values=false] .form-choice-column-guides{visibility:hidden}.ui-foundations-preview .form-choice-topping:hover{background:var(--preview-neutral-f4f4f5,#f4f4f5)}.ui-foundations-preview .form-choice-topping:active{background:var(--preview-neutral-eaeaed,#eaeaed)}.ui-foundations-preview .book-demo .form-choice-selection{border-top:1px solid var(--preview-neutral-e4e4e7,#e4e4e7);padding-top:8px}
.ui-foundations-preview .searchable-select-example__stage{justify-content:center;width:360px;max-width:100%;display:flex}.ui-foundations-preview .searchable-select-example{width:100%;color:var(--preview-neutral-3e3e3e,#3e3e3e)}.ui-foundations-preview .searchable-select-example__label{font-size:14px;font-weight:500;line-height:1.5}.ui-foundations-preview .searchable-select-example svg.lucide{width:16px;height:16px;color:var(--preview-neutral-3e3e3e,#3e3e3e);flex:none}.ui-foundations-preview .searchable-select-example__popup-space{min-width:0}.ui-foundations-preview .searchable-select-example__popup{border:1px solid var(--preview-neutral-e4e4e7,#e4e4e7);background:var(--preview-neutral-ffffff,#fff);border-radius:12px;padding:8px;box-shadow:0 4px 14px #09090b0b}.ui-foundations-preview .searchable-select-example__search-slot{align-items:center;margin-bottom:8px;display:flex}.ui-foundations-preview .searchable-select-example__search-field{gap:8px;width:100%;display:grid}.ui-foundations-preview .searchable-select-example__search{width:100%;position:relative}.ui-foundations-preview .searchable-select-example__search>svg{inset-inline-start:12px;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%)}.ui-foundations-preview .searchable-select-example__search input{border:1px solid var(--preview-neutral-85858f,#85858f);background:var(--preview-neutral-ffffff,#fff);width:100%;min-width:0;min-height:44px;color:var(--preview-neutral-3e3e3e,#3e3e3e);font:inherit;border-radius:6px;padding:10px 44px 10px 38px;font-size:16px;line-height:1.5}.ui-foundations-preview .searchable-select-example__clear{inset-inline-end:1px;width:38px;height:38px;color:var(--input-demo-placeholder,var(--preview-neutral-6b6b73,#6b6b73));cursor:pointer;background:0 0;border:0;border-radius:6px;place-items:center;display:grid;position:absolute;top:50%;transform:translateY(-50%)}.ui-foundations-preview .searchable-select-example__clear:hover{background:var(--preview-neutral-f4f4f5,#f4f4f5)}.ui-foundations-preview .book-demo .searchable-select-example__clear:focus-visible{outline-offset:-4px}.ui-foundations-preview .book-demo .searchable-select-example__search input::placeholder{color:var(--preview-neutral-6b6b73,#6b6b73);opacity:1}.ui-foundations-preview .book-demo .searchable-select-example__scroll-hint{color:var(--preview-neutral-52525b,#52525b);padding-inline:8px;font-size:14px;line-height:1.5}.ui-foundations-preview .searchable-select-example__options{overscroll-behavior:contain;scrollbar-gutter:stable;border-radius:6px;height:264px;margin:0;padding:0;list-style:none;position:relative;overflow-y:auto}.ui-foundations-preview .searchable-select-example[data-searchable=true] .searchable-select-example__options{height:auto;min-height:0;max-height:264px}.ui-foundations-preview .searchable-select-example__options>li{min-height:40px;color:var(--preview-neutral-3e3e3e,#3e3e3e);cursor:pointer;border-radius:5px;justify-content:space-between;align-items:center;gap:12px;padding:8px 12px;font-size:14px;line-height:1.5;display:flex}.ui-foundations-preview .searchable-select-example__options mark{background:var(--preview-neutral-e4e4e7,#e4e4e7);color:var(--preview-neutral-3e3e3e,#3e3e3e);border-radius:2px;font-weight:600}.ui-foundations-preview .searchable-select-example__options>li:hover,.ui-foundations-preview .searchable-select-example__options>li[data-active=true]{background:var(--preview-neutral-f4f4f5,#f4f4f5)}.ui-foundations-preview .searchable-select-example__options>li[aria-selected=true]{font-weight:600}.ui-foundations-preview .book-demo .searchable-select-example__result{border-top:1px solid var(--preview-neutral-e4e4e7,#e4e4e7);min-height:30px;color:var(--preview-neutral-52525b,#52525b);margin-top:8px;padding:6px 8px 0;font-size:12px;line-height:1.5}.ui-foundations-preview .searchable-select-example__options:focus-visible{outline:2px solid var(--preview-neutral-3e3e3e,#3e3e3e);outline-offset:2px}.ui-foundations-preview .searchable-select-example__list-region{position:relative}.ui-foundations-preview .searchable-select-example__hatch{z-index:1;color:var(--value-leader-color);pointer-events:none;border:0;border-radius:6px;position:absolute;inset:0}.ui-foundations-preview .book-demo[data-values=false] .searchable-select-example__hatch{visibility:hidden}
.ui-foundations-preview .book-demo .action-clarity-card{color:var(--preview-neutral-3e3e3e,#3e3e3e)}.ui-foundations-preview .action-submit-slot{justify-content:center;min-height:40px;display:flex}.ui-foundations-preview .book-demo .action-submit{border-radius:50%;width:40px;height:40px;min-height:40px;padding:0}.ui-foundations-preview .book-demo[data-example=recognizable-buttons] .action-clarity-card input{height:40px;min-height:40px;max-height:40px}.ui-foundations-preview .book-demo .action-submit[data-labeled=true]{border-radius:8px;width:100%;padding-inline:16px}.ui-foundations-preview .comparison-preview-motion .book-demo .action-submit{transition:width var(--preview-state-transition),border-radius var(--preview-state-transition),padding var(--preview-state-transition),background-color .15s ease-out}@media (prefers-reduced-motion:reduce){.ui-foundations-preview .comparison-preview-motion .book-demo .action-submit{transition:none}}.ui-foundations-preview .action-submit-label{display:none}.ui-foundations-preview .action-submit[data-labeled=true] .action-submit-label{display:inline}.ui-foundations-preview .action-submit[data-labeled=true] .action-submit-icon{display:none}.ui-foundations-preview .book-demo .book-icon.action-link-icon{width:32px;height:32px}.ui-foundations-preview .book-demo .action-content-link{color:var(--preview-neutral-3e3e3e,#3e3e3e);font-weight:inherit;text-decoration:none}.ui-foundations-preview .book-demo .action-content-link[data-recognizable=true]{text-underline-offset:4px;font-weight:500;text-decoration:underline;text-decoration-thickness:2px}.ui-foundations-preview .book-demo .action-content-link:hover{text-decoration:underline}.ui-foundations-preview .action-link-destination{scroll-margin-block:80px;display:none}.ui-foundations-preview .action-link-destination:target{border-top:1px solid var(--preview-neutral-e4e4e7,#e4e4e7);gap:12px;padding-top:20px;display:grid}.ui-foundations-preview .action-link-destination p{font-size:14px;line-height:1.6}.ui-foundations-preview .action-link-destination:focus-visible{outline:2px solid var(--preview-neutral-3e3e3e,#3e3e3e);outline-offset:4px}.ui-foundations-preview .book-demo .action-separation-card{color:var(--fnd-heading)}.ui-foundations-preview .book-demo .action-separation-card>h3{color:var(--fnd-heading);letter-spacing:-.025em;font-size:22px;font-weight:600;line-height:1.2}.ui-foundations-preview .book-demo .action-separation-card>p{color:var(--fnd-body);font-size:16px;font-weight:400;line-height:1.6}.ui-foundations-preview .action-safe-row{isolation:isolate;justify-content:center;align-items:center;padding-block:28px 4px;display:flex;position:relative}.ui-foundations-preview .action-safe-target{cursor:pointer;background:0 0;border:0;border-radius:14px;justify-content:center;align-items:center;min-width:0;height:44px;padding:2px;display:inline-flex;position:relative}.ui-foundations-preview .action-safe-target+.action-safe-target{margin-left:var(--action-target-gap)}.ui-foundations-preview .book-demo .action-safe-face{z-index:1;border-color:var(--fnd-line);background:var(--preview-neutral-ffffff,white);width:112px;height:40px;min-height:40px;color:var(--fnd-heading);box-shadow:var(--shadow-fnd-control);pointer-events:none;border-radius:12px;padding-inline:16px;font-size:14px;font-weight:500;line-height:20px;position:relative}.ui-foundations-preview .book-demo .action-safe-face.book-button--primary{background:var(--fnd-heading);color:var(--preview-neutral-ffffff,white);border-color:#0000}.ui-foundations-preview .action-safe-area{border-radius:inherit;color:var(--value-leader-color,#ff5268);background-color:color-mix(in srgb,currentColor 5%,transparent);background-image:repeating-linear-gradient(135deg,transparent 0 2px,color-mix(in srgb,currentColor 24%,transparent)2px 3px);pointer-events:none;border:0;position:absolute;inset:0}.ui-foundations-preview .book-demo .action-safe-target:hover .action-safe-face{background:var(--fnd-page);box-shadow:var(--shadow-fnd-control)}.ui-foundations-preview .book-demo .action-safe-target:hover .action-safe-face.book-button--primary{background:var(--preview-neutral-505050,#505050)}.ui-foundations-preview .action-safe-target:active .action-safe-face{transform:translateY(1px)}.ui-foundations-preview .action-slider-wrap{padding-top:40px}.ui-foundations-preview .action-slider-track{height:44px;position:relative}.ui-foundations-preview .action-slider-track input{cursor:pointer;appearance:none;background:0 0;border-radius:8px;width:100%;height:44px;margin:0;padding:0;display:block}.ui-foundations-preview .action-slider-track input::-webkit-slider-runnable-track{background:linear-gradient(to right,var(--preview-neutral-3e3e3e,#3e3e3e)var(--action-slider-percent),var(--preview-neutral-85858f,#85858f)var(--action-slider-percent));border-radius:3px;height:6px}.ui-foundations-preview .action-slider-track input::-moz-range-track{background:var(--preview-neutral-85858f,#85858f);border-radius:3px;height:6px}.ui-foundations-preview .action-slider-track input::-moz-range-progress{background:var(--preview-neutral-3e3e3e,#3e3e3e);border-radius:3px;height:6px}.ui-foundations-preview .action-slider-track input::-webkit-slider-thumb{appearance:none;border:2px solid var(--preview-neutral-3e3e3e,#3e3e3e);background:var(--preview-neutral-ffffff,#fff);border-radius:50%;width:24px;height:24px;margin-top:-9px;box-shadow:0 2px 6px #09090b1a}.ui-foundations-preview .action-slider-track input::-moz-range-thumb{border:2px solid var(--preview-neutral-3e3e3e,#3e3e3e);background:var(--preview-neutral-ffffff,#fff);border-radius:50%;width:20px;height:20px;box-shadow:0 2px 6px #09090b1a}.ui-foundations-preview .action-slider-output{bottom:calc(100% + 6px);left:calc(12px + (100% - 24px)*var(--action-slider-progress));background:var(--preview-neutral-3e3e3e,#3e3e3e);min-width:32px;height:32px;color:var(--preview-neutral-ffffff,white);font-variant-numeric:tabular-nums;pointer-events:none;visibility:hidden;border-radius:8px;place-items:center;padding-inline:8px;font-size:14px;font-weight:500;line-height:1;display:grid;position:absolute;translate:-50%}.ui-foundations-preview .action-slider-output:after{content:"";border:4px solid #0000;border-top-color:var(--preview-neutral-3e3e3e,#3e3e3e);border-bottom:0;margin-left:-4px;position:absolute;top:100%;left:50%}.ui-foundations-preview .action-slider-wrap[data-show-value=true] .action-slider-output{visibility:visible}.ui-foundations-preview .action-slider-endpoints{color:var(--preview-neutral-52525b,#52525b);font-variant-numeric:tabular-nums;justify-content:space-between;padding-inline:8px;font-size:14px;display:flex}@media (max-width:480px){.ui-foundations-preview .book-demo .action-separation-card{padding-inline:12px}.ui-foundations-preview .book-demo .action-safe-face{width:96px;padding-inline:12px}}@media (prefers-reduced-motion:reduce){.ui-foundations-preview .book-demo .action-safe-face{transition:none}.ui-foundations-preview .action-safe-target:active .action-safe-face{transform:none}}
.ui-foundations-preview .book-demo .book-card.table-alignment-card{width:520px;padding:28px}.ui-foundations-preview .table-alignment-table{table-layout:fixed;border-collapse:collapse;width:100%;font-size:1rem;line-height:1.5}.ui-foundations-preview .table-alignment-table caption{text-align:left;letter-spacing:-.02em;margin-bottom:24px;padding-inline:8px;font-size:1.125rem;font-weight:600}.ui-foundations-preview .table-alignment-table thead{border-block:1px solid var(--preview-neutral-f1f1f2,#f1f1f2)}.ui-foundations-preview .table-alignment-table thead th{color:var(--preview-neutral-71717b,#71717b);padding:8px;font-size:.875rem;font-weight:500}.ui-foundations-preview .table-alignment-table tbody :is(th,td){padding:5px 8px;font-weight:500;position:relative}.ui-foundations-preview .table-alignment-table tbody tr:first-child>:is(th,td){padding-top:20px}.ui-foundations-preview .table-alignment-table tbody tr:first-child .table-alignment-edge{top:15px}.ui-foundations-preview .table-alignment-table tbody th{overflow-wrap:anywhere}.ui-foundations-preview .table-alignment-table td{white-space:nowrap}.ui-foundations-preview .table-alignment-amount{font-weight:600}.ui-foundations-preview .table-alignment-edge{width:8px;color:var(--value-leader-color,#ff5268);background-color:color-mix(in srgb,currentColor 5%,transparent);background-image:repeating-linear-gradient(135deg,transparent 0 2px,color-mix(in srgb,currentColor 24%,transparent)2px 3px);pointer-events:none;position:absolute;top:0;bottom:0}.ui-foundations-preview .table-alignment-edge--name{left:calc(50% - 4px)}.ui-foundations-preview .table-alignment-card[data-aligned=false] .table-alignment-edge--name{height:8px;bottom:auto}.ui-foundations-preview .table-alignment-edge--amount,.ui-foundations-preview .table-alignment-card[data-aligned=true] .table-alignment-edge--name{left:0}.ui-foundations-preview .table-alignment-card[data-aligned=true] .table-alignment-edge--amount{left:auto;right:0}