@layer misc{.code-collapsible-wrapper{position:relative}.code-collapsible-wrapper .trigger-container{z-index:2;align-items:center;gap:var(--spacing-4);top:calc(var(--spacing-8) + var(--spacing-24));right:var(--spacing-48);display:flex;position:absolute}.code-collapsible-wrapper .trigger-container .trigger-separator{height:var(--spacing-16)}.code-collapsible-wrapper .collapsible-panel[data-closed]{max-height:250px}.code-collapsible-wrapper .bottom-trigger{bottom:calc(var(--spacing-8) * -1);cursor:pointer;border-bottom-left-radius:var(--radius-md);border-bottom-right-radius:var(--radius-md);background:linear-gradient(to bottom, transparent 0%, var(--color-surface-container-lowest) 50%, var(--color-surface-container-lowest) 100%);height:84px;color:var(--color-on-surface-variant);justify-content:center;align-items:center;display:flex;position:absolute;left:0;right:0}.code-collapsible-wrapper[data-open] .bottom-trigger{display:none}}
@layer misc{[data-slot=code-command-tabs] .panel{padding-inline:var(--spacing-16);padding-top:var(--spacing-4);padding-bottom:var(--spacing-12)}[data-slot=code-command-tabs] .header{align-items:center;gap:var(--spacing-8);padding:var(--spacing-4) var(--spacing-16);border-bottom:1px solid var(--color-surface-container-highest);display:flex}[data-slot=code-command-tabs] .header .icon{width:20px;height:20px}[data-slot=code-command-tabs] .header .btn{margin-left:auto}}
@layer misc{[data-ui-docs=component-preview]{margin-top:var(--spacing-24)}[data-ui-docs=component-preview]>[data-ui=tabs-panel],[data-ui-docs=component-preview] .inner-tab-panel{border:1px solid var(--color-surface-container-highest);border-radius:var(--radius-md);width:100%;height:450px;max-height:450px}:is([data-ui-docs=component-preview]>[data-ui=tabs-panel],[data-ui-docs=component-preview] .inner-tab-panel):focus-visible{box-shadow:0 0 0 2px var(--color-primary-container);outline:0}:is([data-ui-docs=component-preview]>[data-ui=tabs-panel],[data-ui-docs=component-preview] .inner-tab-panel) figure{margin:0}:is([data-ui-docs=component-preview]>[data-ui=tabs-panel],[data-ui-docs=component-preview] .inner-tab-panel).preview{padding:var(--spacing-64);justify-content:center;align-items:center;display:flex;position:relative;overflow-y:auto}:is([data-ui-docs=component-preview]>[data-ui=tabs-panel],[data-ui-docs=component-preview] .inner-tab-panel).preview [data-slot=preview]{justify-content:center;gap:var(--spacing-8);width:100%;height:100%;display:flex}:is([data-ui-docs=component-preview]>[data-ui=tabs-panel],[data-ui-docs=component-preview] .inner-tab-panel).preview [data-slot=preview]>:not([data-ui],[data-slot]){width:100%}:is([data-ui-docs=component-preview]>[data-ui=tabs-panel],[data-ui-docs=component-preview] .inner-tab-panel).preview [data-slot=preview][data-align=start]{align-items:flex-start}:is([data-ui-docs=component-preview]>[data-ui=tabs-panel],[data-ui-docs=component-preview] .inner-tab-panel).preview [data-slot=preview][data-align=end]{align-items:flex-end}:is([data-ui-docs=component-preview]>[data-ui=tabs-panel],[data-ui-docs=component-preview] .inner-tab-panel).preview [data-slot=preview][data-align=center]{align-items:center}@media (max-width:640px){:is([data-ui-docs=component-preview]>[data-ui=tabs-panel],[data-ui-docs=component-preview] .inner-tab-panel).preview{padding-left:var(--spacing-24);padding-right:var(--spacing-24)}}:is([data-ui-docs=component-preview]>[data-ui=tabs-panel],[data-ui-docs=component-preview] .inner-tab-panel):has(figure){border-width:0}[data-ui-docs=component-preview] .inner-tabs{border:1px solid var(--color-surface-container-highest);border-radius:var(--radius-md);background-color:var(--color-surface);gap:0}[data-ui-docs=component-preview] .inner-tabs figure{border:0}[data-ui-docs=component-preview] .inner-tabs .inner-tabs-list{padding-bottom:0}[data-ui-docs=component-preview] .inner-tabs .inner-tabs-list .tab{border-radius:0}[data-ui-docs=component-preview] .inner-tabs .inner-tabs-list .tab[data-active]{color:var(--color-primary)}[data-ui-docs=component-preview] .inner-tabs .inner-tabs-list [data-ui=tabs-indicator]{border-bottom:2px solid var(--color-primary);background-color:#0000;border-radius:0}}
@layer misc{[data-ui=docs-sidebar]{--header-height:56px;width:200px;height:80vh;top:calc(var(--header-height) * 2);border-radius:var(--radius-lg);padding:var(--spacing-12);flex-shrink:0;padding-top:0;display:none;position:sticky;overflow-y:auto}@media (min-width:1024px){[data-ui=docs-sidebar]{display:block}}[data-ui=docs-sidebar]{scrollbar-width:none;-ms-overflow-style:none}[data-ui=docs-sidebar]::-webkit-scrollbar{display:none}[data-ui=docs-sidebar] .link{justify-content:space-between;display:flex}[data-ui=docs-sidebar] .link :not([data-active]){color:var(--color-on-surface)}[data-ui=docs-sidebar] .link[data-active]{background-color:var(--color-surface-container-lowest);border:1px solid var(--color-surface-container-highest);box-shadow:0 2px 5px -3px color-mix(in srgb, var(--color-on-surface) 8%, transparent)}[data-ui=docs-sidebar] .link .dot{width:var(--spacing-6);height:var(--spacing-6);border-radius:var(--radius-rounded);background-color:var(--color-primary)}[data-ui=docs-sidebar] h5{font:var(--font-body-sm);color:var(--color-on-surface-variant);padding-bottom:var(--spacing-8);font-weight:600}}
@layer misc{[data-ui=docs-toc]{scrollbar-width:none;-ms-overflow-style:none;flex-shrink:0;align-self:flex-start;width:300px;max-height:calc(100svh - 112px);margin-top:100px;padding-bottom:50px;position:sticky;top:100px;overflow-y:auto}[data-ui=docs-toc]::-webkit-scrollbar{display:none}[data-ui=docs-toc] h3{font:var(--font-label-md);margin-bottom:var(--spacing-6);font-weight:600}[data-ui=docs-toc] .links{padding-left:var(--spacing-12);border-left:1px solid var(--color-surface-container-highest);flex-direction:column;gap:0;display:flex;position:relative}[data-ui=docs-toc] a{padding-bottom:var(--spacing-8);font:var(--font-label-lg);color:var(--color-on-surface-variant);text-decoration:none}[data-ui=docs-toc] a:hover{color:var(--color-primary)}[data-ui=docs-toc] a[data-active=true]{color:var(--color-primary);font-weight:500}[data-ui=docs-toc] a[data-active=true]:after{content:"";background:var(--color-primary);width:2px;height:20px;position:absolute;left:-1.5px}[data-ui=docs-toc] a:where([data-depth="3"],[data-depth="4"]){margin-left:var(--spacing-12)}@media not (min-width:1280px){[data-ui=docs-toc]{display:none}}}
@layer misc{.color-picker-drawer{background:var(--color-surface-container-lowest);border:1px solid var(--color-surface-container-highest);justify-content:space-between;gap:var(--spacing-32);width:300px}.color-picker-drawer>button{width:100%}.color-picker-drawer .setup-color-container{gap:var(--spacing-16);flex-direction:column;display:flex}.color-picker-drawer .colors{gap:var(--spacing-12);display:flex}.color-picker-drawer .colors .color{aspect-ratio:1;flex-direction:column;width:100%;display:flex}.color-picker-drawer .colors .color p{font:var(--font-body-md);color:var(--color-on-surface-variant);text-align:center}.color-picker-drawer .colors .color>div{border-radius:var(--radius-lg);height:100%}.color-picker-drawer .colors .primary{background-color:var(--color-primary)}.color-picker-drawer .colors .secondary{background-color:var(--color-secondary)}.color-picker-drawer .colors .tertiary{background-color:var(--color-tertiary)}.color-picker-drawer .sliders{gap:var(--spacing-16);flex-direction:column;display:flex}.color-picker-drawer .theme-controls{gap:var(--spacing-8);flex-direction:column;display:flex}}
.react-aria-ColorSlider{gap:var(--spacing-2);grid-template-columns:1fr auto;grid-template-areas:"label output""track track";display:grid}.react-aria-ColorSlider .react-aria-Label{text-align:start;grid-area:label}.react-aria-ColorSlider .react-aria-SliderOutput{text-align:end;color:var(--color-on-surface);grid-area:output}.react-aria-ColorSlider .react-aria-SliderTrack{border-radius:var(--radius-xs);grid-area:track}.react-aria-ColorSlider[data-orientation=horizontal]{width:100%;max-width:300px}.react-aria-ColorSlider[data-orientation=horizontal] .react-aria-SliderTrack{height:var(--spacing-16)}.react-aria-ColorSlider[data-orientation=horizontal] .react-aria-ColorThumb{top:50%}.react-aria-ColorSlider[data-orientation=vertical]{height:200px;display:block}.react-aria-ColorSlider[data-orientation=vertical] .react-aria-Label,.react-aria-ColorSlider[data-orientation=vertical] .react-aria-SliderOutput{display:none}.react-aria-ColorSlider[data-orientation=vertical] .react-aria-SliderTrack{width:var(--spacing-6);height:100%}.react-aria-ColorSlider[data-orientation=vertical] .react-aria-ColorThumb{left:50%}.react-aria-ColorSlider[data-disabled] .react-aria-SliderTrack{background:gray!important}
.react-aria-ColorThumb{border:2px solid var(--color-surface);box-shadow:0 0 0 1px var(--color-on-surface), inset 0 0 0 1px var(--color-on-surface);width:var(--spacing-16);height:var(--spacing-16);border-radius:50%}.react-aria-ColorThumb[data-focus-visible]{width:var(--spacing-24);height:var(--spacing-24)}.react-aria-ColorThumb[data-disabled]{opacity:.5;background:gray!important}
@layer misc{[data-ui=examples-tab]{--original-primary-h:var(--primary-h);--original-primary-c:var(--primary-c);--original-secondary-h:var(--secondary-h);--original-secondary-c:var(--secondary-c);--original-tertiary-h:var(--tertiary-h);--original-tertiary-c:var(--tertiary-c);width:90vw;margin-inline:auto;padding-bottom:clamp(80px,10vw,150px)}[data-ui=examples-tab] .panel-container[data-color=primary]{--primary-h:var(--original-primary-h);--primary-c:var(--original-primary-c);--secondary-h:var(--original-secondary-h);--secondary-c:var(--original-secondary-c);--tertiary-h:var(--original-tertiary-h);--tertiary-c:var(--original-tertiary-c)}[data-ui=examples-tab] .panel-container[data-color=secondary]{--primary-h:var(--original-secondary-h);--primary-c:var(--original-secondary-c);--secondary-h:var(--original-primary-h);--secondary-c:var(--original-primary-c);--tertiary-h:var(--original-tertiary-h);--tertiary-c:var(--original-tertiary-c)}[data-ui=examples-tab] .panel-container[data-color=tertiary]{--primary-h:var(--original-tertiary-h);--primary-c:var(--original-tertiary-c);--secondary-h:var(--original-secondary-h);--secondary-c:var(--original-secondary-c);--tertiary-h:var(--original-primary-h);--tertiary-c:var(--original-primary-c)}[data-ui=examples-tab] .tab-list{margin-bottom:var(--spacing-16);justify-content:space-between;gap:var(--spacing-8);flex-wrap:wrap;display:flex}[data-ui=examples-tab] .tab-list .toggle-item .color{aspect-ratio:1;border-radius:var(--radius-xs);background-color:var(--color);width:18px}[data-ui=examples-tab] .tab-list .toggle-item .color.primary{--color:var(--color-primary)}[data-ui=examples-tab] .tab-list .toggle-item .color.secondary{--color:var(--color-secondary)}[data-ui=examples-tab] .tab-list .toggle-item .color.tertiary{--color:var(--color-tertiary)}[data-ui=examples-tab] .examples-panel{gap:var(--spacing-8);grid-template-columns:repeat(auto-fit,minmax(340px,1fr));grid-auto-rows:365px;display:grid}[data-ui=examples-tab] .examples-panel>div{gap:var(--spacing-8);flex-direction:column;display:flex}[data-ui=examples-tab] .mobile-placeholder{display:none;position:relative}@media not (min-width:768px){[data-ui=examples-tab] [data-ui=tabs]{display:none}[data-ui=examples-tab] .mobile-placeholder{display:block}}[data-theme=dark] [data-ui=examples-tab] .mobile-placeholder img{content:url(/images/example-dark.png)}}
@layer misc{.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}[data-ui=authentication]{border-radius:var(--radius-lg);border:1px solid var(--color-surface-container-high);background:var(--color-surface-container-lowest);grid-template-columns:1fr 1fr;width:100%;min-height:100vh;display:grid;overflow:hidden}.auth-brand-panel{padding:var(--spacing-16);flex-direction:column;display:flex}.auth-brand-panel>div{background:var(--color-surface-container);height:100%;padding:var(--spacing-24);border-radius:var(--radius-md)}.auth-brand-logo{align-items:center;gap:var(--spacing-10);font:var(--font-title-md);display:flex}.auth-form-panel{padding:var(--spacing-32);background:var(--color-surface-container-lowest);flex-direction:column;justify-content:center;align-items:center;display:flex;position:relative}.auth-login-link{top:var(--spacing-24);right:var(--spacing-24);position:absolute}.auth-form-container{gap:var(--spacing-24);flex-direction:column;width:100%;max-width:320px;display:flex}.auth-form-container button{width:100%}.auth-form-header{text-align:center;gap:var(--spacing-6);flex-direction:column;display:flex}.auth-form-header h1{font:var(--font-headline-sm)}.auth-form-header p{font:var(--font-body-md);color:var(--color-on-surface-variant)}.auth-form{gap:var(--spacing-16);flex-direction:column;display:flex}.auth-terms{font:var(--font-body-sm);color:var(--color-on-surface-variant);text-align:center}.auth-terms a{color:var(--color-on-surface);text-underline-offset:2px;transition:color var(--transition-standard-fast-effects);text-decoration:underline}.auth-terms a:hover{color:var(--color-on-surface-variant)}@media (max-width:768px){[data-ui=authentication]{grid-template-columns:1fr}.auth-brand-panel{padding:var(--spacing-16)}.auth-form-panel{padding:var(--spacing-24)}}}
@layer misc{[data-ui=loading-card]{justify-content:center;align-items:center;gap:var(--spacing-10);text-align:center;padding:var(--spacing-24);background-color:var(--color-surface-container-lowest);border:1px solid var(--color-surface-container-high);border-radius:var(--radius-lg);text-wrap:balance;flex-direction:column;display:flex}[data-ui=loading-card] .spinner{width:var(--spacing-32);height:var(--spacing-32);background:var(--color-surface-container-highest);border-radius:var(--radius-md);place-content:center;display:grid}[data-ui=loading-card] h3{font:var(--font-title-sm)}[data-ui=loading-card] p{font:var(--font-body-md);color:var(--color-on-surface-variant)}}
@layer misc{.post-composer{padding:var(--spacing-16);background:var(--color-surface-container-lowest);border-radius:var(--radius-lg);border:1px solid var(--color-surface-container-high);flex-direction:column;flex:1;justify-content:space-between;display:flex}.post-composer .post-header{justify-content:space-between;align-items:flex-start;display:flex}.post-composer .post-user{align-items:center;gap:var(--spacing-12);display:flex}.post-composer .post-user .post-user-info{flex-direction:column;display:flex}.post-composer .post-user .post-user-info .post-user-name{font:var(--font-body-md);color:var(--color-on-surface);font-weight:600}.post-composer .post-user .post-user-info .post-user-handle{color:var(--color-on-surface-variant);font-size:14px}.post-composer .post-content textarea{width:100%}.post-composer .post-footer{justify-content:space-between;align-items:center;display:flex}.post-composer .post-footer .post-actions{gap:8px;display:flex}}
@layer misc{[data-ui=price-range]{padding:var(--spacing-16);background:var(--color-surface-container-lowest);border-radius:var(--radius-lg);border:1px solid var(--color-surface-container-high)}[data-ui=price-range] [data-ui=fieldset-legend]{font:var(--font-title-sm)}[data-ui=price-range] [data-ui=fieldset-description]{font:var(--font-body-md);color:var(--color-on-surface-variant)}[data-ui=price-range] .price-display{justify-content:center;align-items:center;gap:var(--spacing-8);display:flex}[data-ui=price-range] .price-value{font:var(--font-title-lg);font-weight:500}[data-ui=price-range] .price-separator{color:var(--color-on-surface-variant)}}
@layer misc{[data-ui=product-card-example]{gap:var(--spacing-12);padding:var(--spacing-12);border:1px solid var(--color-surface-container-high);border-radius:var(--radius-xl);background-color:var(--color-surface-container-lowest);display:flex}[data-ui=product-card-example] .image{aspect-ratio:1;border-radius:var(--radius-md);background-color:var(--color-surface-container-low);flex-shrink:0;width:96px;height:96px;position:relative}[data-ui=product-card-example] .image img{object-fit:cover}[data-ui=product-card-example] .details{flex-direction:column;justify-content:space-evenly;width:100%;display:flex}[data-ui=product-card-example] .details h4{font:var(--font-title-md);margin:0}[data-ui=product-card-example] .details .badges{gap:var(--spacing-4);flex-wrap:wrap;display:flex}[data-ui=product-card-example] .details .count{margin-top:var(--spacing-24);justify-content:space-between;align-items:center;gap:var(--spacing-16);display:flex}[data-ui=product-card-example] .details .count .price{font:var(--font-body-lg);color:var(--color-on-surface-variant)}}
@layer misc{[data-ui=profile-card-example]{gap:var(--spacing-12);padding:var(--spacing-12);border:1px solid var(--color-surface-container-high);border-radius:var(--radius-xl);background-color:var(--color-surface-container-lowest);display:grid}[data-ui=profile-card-example] .header .banner{border-radius:var(--radius-lg-inc);background:radial-gradient(farthest-corner circle at top right in oklab, var(--color-primary-container) 0%, var(--color-tertiary-container) 100%);height:130px}[data-ui=profile-card-example] .header .avatar{margin-top:-42px;margin-left:var(--spacing-12)}[data-ui=profile-card-example] .details{gap:var(--spacing-12);padding-inline:var(--spacing-12);display:grid}[data-ui=profile-card-example] .details .info{gap:var(--spacing-12);justify-content:space-between;align-items:center;display:flex}[data-ui=profile-card-example] .details .info h3{align-items:center;gap:var(--spacing-4);font:var(--font-title-lg);font-weight:600;display:flex}[data-ui=profile-card-example] .details .info h3 span{display:flex}[data-ui=profile-card-example] .details .info h3 span svg{color:var(--color-info);width:var(--spacing-16);height:var(--spacing-16)}[data-ui=profile-card-example] .details .info p{font:var(--font-body-lg);color:var(--color-on-surface-variant)}[data-ui=profile-card-example] .details .info .status-badge{background:0 0;border:none}[data-ui=profile-card-example] .details .stats{gap:var(--spacing-12);background-color:var(--color-surface);border-radius:var(--radius-md);padding:var(--spacing-8);justify-content:space-evenly;align-items:center;display:flex}[data-ui=profile-card-example] .details .stats .separator{height:var(--spacing-32)}[data-ui=profile-card-example] .details .stats>div{text-align:center}[data-ui=profile-card-example] .details .stats>div h4{font:var(--font-title-md);font-weight:600}[data-ui=profile-card-example] .details .stats>div p{font:var(--font-body-md);color:var(--color-on-surface-variant)}[data-ui=profile-card-example] .details>button{width:100%}}
@layer misc{.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}[data-ui=tasks-page-example]{gap:var(--spacing-24);border:1px solid var(--color-surface-container-high);border-radius:var(--radius-lg);background:var(--color-surface-container-lowest);width:100%;height:90vh;padding:var(--spacing-32);flex-direction:column;display:flex}[data-ui=tasks-page-example]>header{justify-content:space-between;gap:var(--spacing-12);align-items:center;display:flex}[data-ui=tasks-page-example]>header .details h3{font:var(--font-title-lg);font-weight:500}[data-ui=tasks-page-example]>header .details p{font:var(--font-body-lg);color:var(--color-on-surface-variant)}[data-ui=tasks-page-example] .task-column{width:50%}[data-ui=tasks-page-example] .filter-menu{justify-content:space-between;align-items:center;display:flex}[data-ui=tasks-page-example] .filter-menu .filters{align-items:center;gap:var(--spacing-12);display:flex}[data-ui=tasks-page-example] .filter-menu .filters .search{width:250px}[data-ui=tasks-page-example] .pagination{justify-content:space-between;align-items:center;display:flex}[data-ui=tasks-page-example] .pagination .selected-count{color:var(--color-on-surface-variant)}}
@layer misc{[data-ui=team-invite]{height:fit-content;padding:var(--spacing-16);background:var(--color-surface-container-lowest);border-radius:var(--radius-xl);border:1px solid var(--color-surface-container-high)}[data-ui=team-invite] [data-ui=fieldset-legend]{font:var(--font-title-sm)}[data-ui=team-invite] [data-ui=fieldset-description]{font:var(--font-body-md);color:var(--color-on-surface-variant)}[data-ui=team-invite] .user-info{flex-direction:column;display:flex}[data-ui=team-invite] .user-name{font:var(--font-body-md);font-weight:500}[data-ui=team-invite] .user-handle{font:var(--font-body-sm);color:var(--color-on-surface-variant)}[data-ui=team-invite] .members-list{flex-direction:column;display:flex}[data-ui=team-invite] .member-item{padding:var(--spacing-8);border-radius:var(--radius-md);cursor:pointer;justify-content:space-between;align-items:center;transition:background .15s;display:flex}[data-ui=team-invite] .member-item:hover{background:var(--color-surface-container-low)}[data-ui=team-invite] .member-info{align-items:center;gap:var(--spacing-12);display:flex}}
@layer misc{[data-ui=toast-group]{justify-content:center;align-items:center;gap:var(--spacing-8);height:100%;padding:var(--spacing-12);background:var(--color-surface-container-lowest);border-radius:var(--radius-lg);border:1px solid var(--color-surface-container-high);display:flex}}
@layer misc{[data-ui=olyx-faq]{align-items:center;gap:var(--spacing-32);max-width:800px;padding:var(--spacing-12) var(--spacing-12) 100px var(--spacing-12);text-align:center;flex-direction:column;margin-inline:auto;display:flex}[data-ui=olyx-faq] .details{justify-items:center;gap:var(--spacing-8);display:grid}[data-ui=olyx-faq] .details h3{font:var(--font-headline-lg);font-weight:500}[data-ui=olyx-faq] .details p{font:var(--font-body-lg);color:var(--color-on-surface-variant)}[data-ui=olyx-faq] .questions-list{width:100%;max-width:500px}}
@layer misc{[data-ui=features-section]{gap:var(--spacing-64);flex-direction:column;align-items:center;width:80vw;margin-inline:auto;padding-bottom:100px;display:flex}[data-ui=features-section] .title{width:60%}[data-ui=features-section] .title h2{font:var(--font-display-sm);text-align:center;text-wrap:balance;color:var(--color-on-surface-variant);font-weight:500}[data-ui=features-section] .title h2 span{color:var(--color-on-surface)}[data-ui=features-section] .features-list{align-items:center;gap:var(--spacing-16);flex-direction:column;width:100%;display:flex}[data-ui=features-section] .features-list .feature-item{gap:var(--spacing-12);display:flex}[data-ui=features-section] .features-list .feature-item.item-reverse{flex-direction:row-reverse}[data-ui=features-section] .features-list .feature-item>*{aspect-ratio:1;flex-shrink:0;width:440px;max-width:440px}[data-ui=features-section] .features-list .feature-item .diagram{padding:var(--spacing-16);border-radius:var(--radius-xl-inc);background-color:var(--color-surface-container-lowest);flex-direction:column;align-items:center;display:flex;position:relative}[data-ui=features-section] .features-list .feature-item .description{text-align:center;text-wrap:balance;justify-content:center;align-items:center;gap:var(--spacing-12);flex-direction:column;display:flex}[data-ui=features-section] .features-list .feature-item .description h4{font:var(--font-title-lg);font-weight:500}[data-ui=features-section] .features-list .feature-item .description p{font:var(--font-body-md);color:var(--color-on-surface-variant)}[data-ui=features-section] .attr-styling .diagram{justify-content:space-between}[data-ui=features-section] .attr-styling .files{align-items:end;height:fit-content;margin-top:70px;display:flex;position:relative}[data-ui=features-section] .attr-styling .files .connector{margin-bottom:-35px;display:flex;position:relative}[data-ui=features-section] .attr-styling .files .connector .file-connector{border:2px solid var(--color-surface-container-highest);width:120px;height:50px}[data-ui=features-section] .attr-styling .files .connector .file-connector:first-child{border-top-right-radius:var(--radius-md);border-bottom:0;border-left:0;border-right:0}[data-ui=features-section] .attr-styling .files .connector .file-connector:nth-child(2){border-top-left-radius:var(--radius-md);border-bottom:0;border-right:0}[data-ui=features-section] .attr-styling .files .attr-name{gap:var(--spacing-8);justify-items:center;display:grid;position:absolute;bottom:50%;left:50%;transform:translate(-50%)}[data-ui=features-section] .attr-styling .files .attr-name .line{background-color:var(--color-surface-variant);width:2px;height:90px}[data-ui=features-section] .attr-styling .files .file{justify-items:center;display:grid}[data-ui=features-section] .attr-styling .files .file svg{width:var(--spacing-64);height:var(--spacing-64);margin-bottom:calc(var(--spacing-24) * -1);color:var(--color-on-primary-container)}[data-ui=features-section] .attr-styling .files .output{position:absolute;bottom:-80%;left:50%;transform:translate(-50%)}[data-ui=features-section] .attr-styling .code-snippet{width:100%;height:40%;padding:var(--spacing-12);border:1px solid var(--color-surface-container-highest);border-radius:var(--radius-lg);background-color:var(--color-surface-container-lowest);display:grid}[data-ui=features-section] .attr-styling .code-snippet>div{gap:var(--spacing-12);display:flex}[data-ui=features-section] .attr-styling .code-snippet>div svg{width:20px;height:20px}[data-ui=features-section] .attr-styling .code-snippet .wrong{color:var(--color-error)}[data-ui=features-section] .attr-styling .code-snippet .accepted{color:var(--color-success)}[data-ui=features-section] .hct .container{width:100%;height:100%;padding-left:var(--spacing-12);flex-direction:column;justify-content:center;align-items:start;display:flex}[data-ui=features-section] .hct .main-color{width:var(--spacing-32);height:var(--spacing-32);background:var(--color-primary);border-radius:var(--radius-sm)}[data-ui=features-section] .hct .color-list-wrapper{display:flex}[data-ui=features-section] .hct .color-list-wrapper .color-list{gap:var(--spacing-6);height:fit-content;margin-left:var(--spacing-16);padding-left:var(--spacing-16);border-left:1px solid var(--color-surface-container-highest);-webkit-user-select:none;user-select:none;flex-direction:column;display:flex}[data-ui=features-section] .hct .color-list-wrapper .color-list>div:not(.line){padding:var(--spacing-4) var(--spacing-12);border-radius:var(--radius-md);background-color:var(--bg-color);font:var(--font-label-md);text-transform:uppercase;border:1px solid;position:relative}[data-ui=features-section] .hct .color-list-wrapper .color-list>div:not(.line):first-child{margin-top:var(--spacing-24)}[data-ui=features-section] .hct .color-list-wrapper .color-list>div:not(.line):before{content:"";width:var(--spacing-16);background-color:var(--color-surface-variant);height:1px;position:absolute;top:50%;right:100.5%;transform:translateY(-50%)}[data-ui=features-section] .hct .color-list-wrapper .color-list>div:not(.line).primary{--bg-color:var(--color-primary-container);border-color:var(--color-primary);color:var(--color-primary)}[data-ui=features-section] .hct .color-list-wrapper .color-list>div:not(.line).secondary{--bg-color:var(--color-secondary-container);border-color:var(--color-secondary);color:var(--color-secondary)}[data-ui=features-section] .hct .color-list-wrapper .color-list>div:not(.line).tertiary{--bg-color:var(--color-tertiary-container);border-color:var(--color-tertiary);color:var(--color-tertiary)}[data-ui=features-section] .hct .color-list-wrapper .color-list>div:not(.line).surface{--bg-color:var(--color-surface-container);border-color:var(--color-surface-container-highest);color:var(--color-on-surface-variant)}[data-ui=features-section] .hct .color-list-wrapper .color-list>div:not(.line).success{--bg-color:var(--color-success-container);border-color:var(--color-success);color:var(--color-success);margin-top:var(--spacing-24)}[data-ui=features-section] .hct .color-list-wrapper .color-list>div:not(.line).info{--bg-color:var(--color-info-container);border-color:var(--color-info);color:var(--color-info)}[data-ui=features-section] .hct .color-list-wrapper .color-list>div:not(.line).error{--bg-color:var(--color-error-container);border-color:var(--color-error);color:var(--color-error)}[data-ui=features-section] .hct .color-list-wrapper .color-list>div:not(.line).warning{--bg-color:var(--color-warning-container);border-color:var(--color-warning);color:var(--color-warning)}[data-ui=features-section] .hct .color-list-wrapper .on-color{margin-top:calc(var(--spacing-24) + var(--spacing-12));padding-left:var(--spacing-8);display:flex}[data-ui=features-section] .hct .color-list-wrapper .on-color .line{border:1px solid var(--color-surface-container-highest);border-top-right-radius:var(--radius-md);border-bottom:0;border-left:0;width:20px;height:100px}[data-ui=features-section] .hct .color-list-wrapper .on-color .color-list{border:0;padding:0}[data-ui=features-section] .hct .color-list-wrapper .on-color .color-list>div.on-primary{--bg-color:var(--color-primary);border-color:var(--color-on-primary-container);color:var(--color-on-primary)}[data-ui=features-section] .hct .color-list-wrapper .on-color .color-list>div.on-primary-container{--bg-color:var(--color-primary-container);border-color:var(--color-primary);color:var(--color-on-primary-container)}[data-ui=features-section] .tokens .diagram{justify-content:space-between;align-items:center}[data-ui=features-section] .tokens .container{gap:var(--spacing-16);flex-direction:column;display:flex}[data-ui=features-section] .tokens .container .tokens-tag{justify-content:center;align-items:center;gap:var(--spacing-6);flex-wrap:wrap;display:flex}[data-ui=features-section] .tokens .container .tokens-tag .token{color:var(--color-error)}[data-ui=features-section] .tokens .stack-container{perspective:800px;height:300px;transform-style:preserve-3d;justify-content:center;align-items:center;display:flex;position:relative}[data-ui=features-section] .tokens .stack-container .btn{position:absolute;top:60px;left:50%;transform:translate(-50%)}[data-ui=features-section] .tokens .stack-container .btn .gap{top:50%;left:30%;transform:translateY(-50%)}[data-ui=features-section] .tokens .stack-container .btn .p-x,[data-ui=features-section] .tokens .stack-container .btn .gap{width:var(--spacing-12);background-color:color-mix(in srgb, var(--color-error) 30%, transparent);height:140%;position:absolute}:is([data-ui=features-section] .tokens .stack-container .btn .p-x,[data-ui=features-section] .tokens .stack-container .btn .gap):first-child{top:50%;left:0;transform:translateY(-50%)}:is([data-ui=features-section] .tokens .stack-container .btn .p-x,[data-ui=features-section] .tokens .stack-container .btn .gap):nth-child(2){top:50%;right:0;transform:translateY(-50%)}[data-ui=features-section] .tokens .layer{width:180px;height:100px;padding-bottom:var(--spacing-8);border:1px solid var(--color-surface-container-highest);border-radius:var(--radius-xl);background:var(--color-surface-container-high);font:var(--font-body-sm);transform-style:preserve-3d;flex-direction:column;justify-content:end;align-items:center;transition:transform .3s;display:flex;position:absolute}[data-ui=features-section] .tokens .layer.layer-1{z-index:5;background:var(--color-primary-container);border-color:var(--color-primary);color:var(--color-on-primary-container);transform:translateZ(0)translateY(-30px)rotateX(50deg)}[data-ui=features-section] .tokens .layer.layer-2{z-index:4;background:var(--color-tertiary-container);border-color:var(--color-tertiary);transform:translateZ(0)translateY(0)rotateX(50deg)}[data-ui=features-section] .tokens .layer.layer-3{z-index:3;background:var(--color-secondary-container);border-color:var(--color-secondary);transform:translateZ(0)translateY(30px)rotateX(50deg)}[data-ui=features-section] .tokens .layer.layer-4{z-index:2;background:var(--color-surface-container);border-color:var(--color-surface-container-highest);transform:translateZ(0)translateY(60px)rotateX(50deg)}[data-ui=features-section] .tokens .layer.layer-5{z-index:1;background:var(--color-surface-container-lowest);border-color:var(--color-surface-container-highest);box-shadow:0 4px 12px color-mix(in srgb, var(--color-on-surface) 6%, transparent);transform:translateZ(0)translateY(90px)rotateX(50deg)}@media (max-width:1024px){[data-ui=features-section]{width:90vw}[data-ui=features-section] .title{width:80%}[data-ui=features-section] .features-list .feature-item>*{width:390px;max-width:390px}[data-ui=features-section] .attr-styling .files .connector .file-connector{width:90px}}@media (max-width:768px){[data-ui=features-section]{gap:var(--spacing-32);width:92vw}[data-ui=features-section] .title{width:100%}[data-ui=features-section] .title h2{font:var(--font-headline-sm);font-weight:500}[data-ui=features-section] .features-list{gap:var(--spacing-32)}[data-ui=features-section] .features-list .feature-item{flex-direction:column-reverse;align-items:center}[data-ui=features-section] .features-list .feature-item.item-reverse{flex-direction:column-reverse}[data-ui=features-section] .features-list .feature-item>*{width:100%;max-width:100%}[data-ui=features-section] .features-list .feature-item .description{aspect-ratio:auto;padding:var(--spacing-16) 0}[data-ui=features-section] .attr-styling .diagram{aspect-ratio:auto;min-height:400px;padding-bottom:var(--spacing-32)}[data-ui=features-section] .attr-styling .files{margin-top:50px}[data-ui=features-section] .attr-styling .files .connector .file-connector{width:80px;height:40px}[data-ui=features-section] .attr-styling .files .attr-name .line{height:60px}[data-ui=features-section] .attr-styling .files .file svg{width:var(--spacing-48);height:var(--spacing-48)}[data-ui=features-section] .attr-styling .code-snippet{height:auto}[data-ui=features-section] .attr-styling .code-snippet pre{font-size:var(--font-body-sm)}[data-ui=features-section] .hct .diagram{aspect-ratio:auto;min-height:380px}[data-ui=features-section] .tokens .diagram{aspect-ratio:auto;min-height:420px}}@media (max-width:480px){[data-ui=features-section]{width:95vw;padding-bottom:60px}[data-ui=features-section] .attr-styling .files{transform-origin:top;margin-top:40px;transform:scale(.8)}[data-ui=features-section] .attr-styling .files .connector .file-connector{width:60px}[data-ui=features-section] .attr-styling .code-snippet pre{font-size:.65rem}}}
@layer misc{[data-ui=olyx-footer]{justify-content:end;align-items:center;gap:var(--spacing-24);max-width:90vw;padding-bottom:var(--spacing-48);flex-direction:column;margin-inline:auto;display:flex}[data-ui=olyx-footer] .footer{background:var(--color-surface-container-lowest);border-radius:var(--radius-xl-inc);width:100%;min-height:400px;padding:var(--spacing-32);flex-direction:column;justify-content:space-between;display:flex}[data-ui=olyx-footer] .footer .details{gap:var(--spacing-32);display:flex}@media (max-width:480px){[data-ui=olyx-footer] .footer .details{flex-direction:column}}[data-ui=olyx-footer] .footer .details .about{flex-basis:40%}[data-ui=olyx-footer] .footer .details .about .logo{align-items:center;gap:var(--spacing-8);display:flex}[data-ui=olyx-footer] .footer .details .about .logo p{font:var(--font-body-lg);color:var(--color-on-surface);font-weight:500}[data-ui=olyx-footer] .footer .details .links-set-container{align-items:start;gap:var(--spacing-64);padding-right:var(--spacing-48);flex-basis:60%;display:flex}@media (max-width:768px){[data-ui=olyx-footer] .footer .details .links-set-container{flex-direction:column}}[data-ui=olyx-footer] .footer .details .links-set-container>div{gap:var(--spacing-12);display:grid}[data-ui=olyx-footer] .footer .details .links-set-container>div h5{color:var(--color-on-surface-variant);font:var(--font-body-sm);font-weight:500}[data-ui=olyx-footer] .footer .details .links-set-container>div .links{gap:var(--spacing-4);display:grid}[data-ui=olyx-footer] .footer .details .links-set-container>div .links a{font:var(--font-body-lg)}[data-ui=olyx-footer] .footer .copyright{justify-content:space-between;align-items:center;display:flex}[data-ui=olyx-footer] .footer .copyright .details{gap:var(--spacing-12);display:flex}[data-ui=olyx-footer] .footer .copyright .details p{font:var(--font-body-sm);color:var(--color-on-surface-variant)}[data-ui=olyx-footer] .footer .copyright .social-links{gap:var(--spacing-12);display:flex}[data-ui=olyx-footer] .footer .copyright .social-links .icon{width:var(--spacing-24);height:var(--spacing-24);color:var(--color-on-surface)}@media not (min-width:768px){[data-ui=olyx-footer] .footer{gap:var(--spacing-32)}}}
@layer misc{[data-ui=hero]{align-items:center;gap:var(--spacing-24);text-align:center;max-width:var(--breakpoint-md);flex-flow:column;margin-inline:auto;padding-block:100px;display:flex}[data-ui=hero] h1{font:var(--font-display-lg)}@media (max-width:768px){[data-ui=hero] h1{font:var(--font-display-sm)}}[data-ui=hero] h1{text-wrap:balance;font-weight:500}[data-ui=hero]>p{width:70%;font:var(--font-body-lg);color:var(--color-on-surface-variant);font-weight:500}[data-ui=hero] .actions{gap:var(--spacing-8);flex-wrap:wrap;justify-content:center;display:flex}}
@layer misc{[data-ui=main-navbar-header]{z-index:40;width:100%;position:sticky;top:0}[data-ui=main-navbar]{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:color-mix(in srgb, var(--color-surface-container-lowest) 50%, transparent);border:1px solid var(--color-surface-container-high);width:100%;height:56px;display:flex}[data-ui=main-navbar] .main-navbar-list{justify-content:space-between;gap:var(--spacing-8);width:100%;padding-inline:var(--spacing-64);display:flex}@media not (min-width:1024px){[data-ui=main-navbar] .main-navbar-list{padding-inline:var(--spacing-10)}}[data-ui=main-navbar] .main-navbar-list .links{gap:var(--spacing-32);align-items:center;display:flex}@media (max-width:768px){[data-ui=main-navbar] .main-navbar-list .links{gap:var(--spacing-12)}}[data-ui=main-navbar] .main-navbar-list .actions-list{gap:var(--spacing-6)}[data-ui=main-navbar] .main-navbar-list .actions-list>[data-ui=separator]{height:var(--spacing-24)}[data-ui=main-navbar] .main-navbar-list .kbd-group{margin-left:var(--spacing-32)}[data-ui=main-navbar] .main-navbar-list .link-item{color:var(--color-on-surface)}[data-ui=main-navbar] .main-navbar-list .link-item a{padding-inline:var(--spacing-6)}@media (max-width:768px){[data-ui=main-navbar] .main-navbar-list .link-item,[data-ui=main-navbar] .main-navbar-list .github-link,[data-ui=main-navbar] .main-navbar-list .search-item,[data-ui=main-navbar] .main-navbar-list [data-ui=separator]:nth-of-type(2),[data-ui=main-navbar] .main-navbar-list [data-ui=separator]:first-of-type{display:none}}[data-ui=main-navbar] .main-navbar-list .current-color{width:var(--spacing-16);height:var(--spacing-16);border-radius:var(--radius-xs);background-color:var(--color-primary);margin-right:var(--spacing-4)}}
@layer misc{.mobile-navbar-drawer{width:90%;padding-bottom:var(--spacing-64);gap:var(--spacing-48);flex-direction:column;display:flex}.mobile-navbar-drawer .links-container{gap:var(--spacing-8);display:grid}.mobile-navbar-drawer .links-container h3{margin-bottom:var(--spacing-12)}.mobile-navbar-drawer .links-container .link{font:var(--font-body-lg);color:var(--color-on-surface);font-weight:500;text-decoration:none}}
@layer misc{[data-ui=not-found]{justify-content:center;align-items:center;gap:var(--spacing-16);padding-top:var(--spacing-64);flex-direction:column;display:flex}[data-ui=not-found] h2{font:var(--font-display-md);font-weight:600}[data-ui=not-found] p{color:var(--color-on-surface);font-size:18px}}
@layer misc{[data-ui=why-olyx-section]{max-width:1280px;padding-bottom:100px;padding-inline:var(--spacing-24);margin-inline:auto}[data-ui=why-olyx-section] .section-header{text-align:center;margin-bottom:var(--spacing-32)}[data-ui=why-olyx-section] .section-header p{color:var(--color-primary);font:var(--font-body-lg);font-weight:500}[data-ui=why-olyx-section] .section-header h2{color:var(--color-on-surface);font:var(--font-headline-lg);font-weight:500}[data-ui=why-olyx-section] .cards-grid{justify-content:center;gap:clamp(var(--spacing-0), 4vw, var(--spacing-24));flex-wrap:wrap;display:flex}[data-ui=why-olyx-section] .why-card{border-radius:var(--radius-xl);width:360px;padding:var(--spacing-24);gap:var(--spacing-32);text-align:center;text-wrap:balance;flex-direction:column;align-items:center;display:flex}[data-ui=why-olyx-section] .card-icon{border-radius:var(--radius-md);background:var(--color-primary-container);width:48px;height:48px;color:var(--color-on-primary-container);justify-content:center;align-items:center;display:flex}[data-ui=why-olyx-section] .card-icon svg{width:24px;height:24px}[data-ui=why-olyx-section] .card-content h3{color:var(--color-on-surface);font:var(--font-body-md);margin-bottom:var(--spacing-8);font-weight:600}[data-ui=why-olyx-section] .card-content p{color:var(--color-on-surface-variant);font-size:var(--font-size-sm)}}