/* docara-shell-source: runtime/utility/text-color/default/css/default.min.css */
@layer sf.reset, sf.tokens, sf.base, sf.utilities, sf.components, sf.overrides, sf.states;
@layer sf.utilities{.color-transparent{color:var(--sf-transparent)}.color-current{color:var(--sf-current)}.color-inherit{color:var(--sf-inherit)}.color-on-surface{color:var(--sf-on-surface)}.color-on-surface-fixed{color:var(--sf-on-surface-fixed)}.color-on-surface-variant{color:var(--sf-on-surface-variant)}.color-on-surface-inverse{color:var(--sf-on-surface-inverse)}.color-on-surface-inverse-fixed{color:var(--sf-on-surface-inverse-fixed)}.color-disable{color:var(--sf-disable)}.color-on-disable{color:var(--sf-on-disable)}.color-primary{color:var(--sf-primary)}.color-on-primary{color:var(--sf-on-primary)}.color-on-primary-container{color:var(--sf-on-primary-container)}.color-on-primary-container-graphic{color:var(--sf-on-primary-container-graphic)}.color-secondary{color:var(--sf-secondary)}.color-on-secondary{color:var(--sf-on-secondary)}.color-on-secondary-container{color:var(--sf-on-secondary-container)}.color-on-secondary-container-graphic{color:var(--sf-on-secondary-container-graphic)}.color-tertiary{color:var(--sf-tertiary)}.color-on-tertiary{color:var(--sf-on-tertiary)}.color-on-tertiary-container{color:var(--sf-on-tertiary-container)}.color-on-tertiary-container-graphic{color:var(--sf-on-tertiary-container-graphic)}.color-error{color:var(--sf-error)}.color-on-error{color:var(--sf-on-error)}.color-on-error-container{color:var(--sf-on-error-container)}.color-on-error-container-graphic{color:var(--sf-on-error-container-graphic)}.color-warning{color:var(--sf-warning)}.color-on-warning{color:var(--sf-on-warning)}.color-on-warning-container{color:var(--sf-on-warning-container)}.color-on-warning-container-graphic{color:var(--sf-on-warning-container-graphic)}.color-success{color:var(--sf-success)}.color-on-success{color:var(--sf-on-success)}.color-on-success-container{color:var(--sf-on-success-container)}.color-on-success-container-graphic{color:var(--sf-on-success-container-graphic)}.color-info{color:var(--sf-info)}.color-on-info{color:var(--sf-on-info)}.color-on-info-container{color:var(--sf-on-info-container)}.color-on-info-container-graphic{color:var(--sf-on-info-container-graphic)}.color-white{color:var(--sf-white)}.color-black{color:var(--sf-black)}.color-gray{color:var(--sf-gray-50)}.color-gray-0{color:var(--sf-gray-98)}.color-gray-1{color:var(--sf-gray-98)}.color-gray-2{color:var(--sf-gray-90)}.color-gray-3{color:var(--sf-gray-85)}.color-gray-4{color:var(--sf-gray-60)}.color-gray-5{color:var(--sf-gray-50)}.color-gray-6{color:var(--sf-gray-40)}.color-gray-7{color:var(--sf-gray-30)}.color-gray-8{color:var(--sf-gray-20)}.color-gray-9{color:var(--sf-gray-15)}.color-red{color:var(--sf-red-50)}.color-red-0{color:var(--sf-red-95)}.color-red-1{color:var(--sf-red-90)}.color-red-2{color:var(--sf-red-80)}.color-red-3{color:var(--sf-red-70)}.color-red-4{color:var(--sf-red-60)}.color-red-5{color:var(--sf-red-50)}.color-red-6{color:var(--sf-red-40)}.color-red-7{color:var(--sf-red-40)}.color-red-8{color:var(--sf-red-35)}.color-red-9{color:var(--sf-red-30)}.color-orange{color:var(--sf-orange-60)}.color-orange-0{color:var(--sf-orange-98)}.color-orange-1{color:var(--sf-orange-95)}.color-orange-2{color:var(--sf-orange-85)}.color-orange-3{color:var(--sf-orange-80)}.color-orange-4{color:var(--sf-orange-70)}.color-orange-5{color:var(--sf-orange-60)}.color-orange-6{color:var(--sf-orange-60)}.color-orange-7{color:var(--sf-orange-50)}.color-orange-8{color:var(--sf-orange-50)}.color-orange-9{color:var(--sf-orange-40)}.color-yellow{color:var(--sf-yellow-85)}.color-yellow-0{color:var(--sf-yellow-98)}.color-yellow-1{color:var(--sf-yellow-98)}.color-yellow-2{color:var(--sf-yellow-95)}.color-yellow-3{color:var(--sf-yellow-90)}.color-yellow-4{color:var(--sf-yellow-90)}.color-yellow-5{color:var(--sf-yellow-85)}.color-yellow-6{color:var(--sf-yellow-80)}.color-yellow-7{color:var(--sf-yellow-70)}.color-yellow-8{color:var(--sf-yellow-60)}.color-yellow-9{color:var(--sf-yellow-40)}.color-green{color:var(--sf-green-60)}.color-green-0{color:var(--sf-green-98)}.color-green-1{color:var(--sf-green-98)}.color-green-2{color:var(--sf-green-90)}.color-green-3{color:var(--sf-green-85)}.color-green-4{color:var(--sf-green-70)}.color-green-5{color:var(--sf-green-60)}.color-green-6{color:var(--sf-green-50)}.color-green-7{color:var(--sf-green-40)}.color-green-8{color:var(--sf-green-35)}.color-green-9{color:var(--sf-green-25)}.color-blue{color:var(--sf-blue-40)}.color-blue-0{color:var(--sf-blue-98)}.color-blue-1{color:var(--sf-blue-95)}.color-blue-2{color:var(--sf-blue-90)}.color-blue-3{color:var(--sf-blue-70)}.color-blue-4{color:var(--sf-blue-60)}.color-blue-5{color:var(--sf-blue-40)}.color-blue-6{color:var(--sf-blue-40)}.color-blue-7{color:var(--sf-blue-30)}.color-blue-8{color:var(--sf-blue-20)}.color-blue-9{color:var(--sf-blue-15)}.color-purple{color:var(--sf-purple-40)}.color-purple-0{color:var(--sf-purple-95)}.color-purple-1{color:var(--sf-purple-90)}.color-purple-2{color:var(--sf-purple-80)}.color-purple-3{color:var(--sf-purple-70)}.color-purple-4{color:var(--sf-purple-50)}.color-purple-5{color:var(--sf-purple-40)}.color-purple-6{color:var(--sf-purple-30)}.color-purple-7{color:var(--sf-purple-25)}.color-purple-8{color:var(--sf-purple-20)}.color-purple-9{color:var(--sf-purple-15)}.color-pink{color:var(--sf-pink-60)}.color-pink-0{color:var(--sf-pink-95)}.color-pink-1{color:var(--sf-pink-90)}.color-pink-2{color:var(--sf-pink-80)}.color-pink-3{color:var(--sf-pink-70)}.color-pink-4{color:var(--sf-pink-60)}.color-pink-5{color:var(--sf-pink-60)}.color-pink-6{color:var(--sf-pink-50)}.color-pink-7{color:var(--sf-pink-50)}.color-pink-8{color:var(--sf-pink-40)}.color-pink-9{color:var(--sf-pink-25)}}

/* docara-shell-source: runtime/utility/text-decoration/default/css/default.min.css */
@layer sf.reset, sf.tokens, sf.base, sf.utilities, sf.components, sf.overrides, sf.states;
@layer sf.utilities{.underline{-webkit-text-decoration-line:underline;text-decoration-line:underline}.overline{-webkit-text-decoration-line:overline;text-decoration-line:overline}.line-through{-webkit-text-decoration-line:line-through;text-decoration-line:line-through}.decoration-none{-webkit-text-decoration-line:none;text-decoration-line:none}}

/* docara-shell-source: runtime/utility/transition-property/default/css/default.min.css */
@layer sf.reset, sf.tokens, sf.base, sf.utilities, sf.components, sf.overrides, sf.states;
@layer sf.utilities{.transition-none{transition-property:none}.transition-all{transition-property:all;transition-timing-function:var(--sf-ease-move);transition-duration:var(--sf-duration-normal)}.transition{transition-property:color, background-color, border-color, fill, stroke, opacity, box-shadow, -webkit-text-decoration-color, -webkit-transform, -webkit-filter, -webkit-backdrop-filter;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-transform, -webkit-filter, -webkit-backdrop-filter;transition-timing-function:var(--sf-ease-move);transition-duration:var(--sf-duration-normal)}.transition-colors{transition-property:color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;transition-timing-function:var(--sf-ease-move);transition-duration:var(--sf-duration-normal)}.transition-opacity{transition-property:opacity;transition-timing-function:var(--sf-ease-move);transition-duration:var(--sf-duration-normal)}.transition-shadow{transition-property:box-shadow;transition-timing-function:var(--sf-ease-move);transition-duration:var(--sf-duration-normal)}.transition-transform{transition-property:-webkit-transform;transition-property:transform;transition-property:transform, -webkit-transform;transition-timing-function:var(--sf-ease-move);transition-duration:var(--sf-duration-normal)}.transition-width{transition-property:width;transition-timing-function:var(--sf-ease-move);transition-duration:var(--sf-duration-normal)}.transition-height{transition-property:height;transition-timing-function:var(--sf-ease-move);transition-duration:var(--sf-duration-normal)}.transition-size{transition-property:width, height;transition-timing-function:var(--sf-ease-move);transition-duration:var(--sf-duration-normal)}.transition-max-width{transition-property:max-width;transition-timing-function:var(--sf-ease-move);transition-duration:var(--sf-duration-normal)}.transition-max-height{transition-property:max-height;transition-timing-function:var(--sf-ease-move);transition-duration:var(--sf-duration-normal)}.transition-max-size{transition-property:max-width, max-height;transition-timing-function:var(--sf-ease-move);transition-duration:var(--sf-duration-normal)}.transition-flex{transition-property:flex, flex-basis;transition-timing-function:var(--sf-ease-move);transition-duration:var(--sf-duration-normal)}.transition-flex-basis{transition-property:flex-basis;transition-timing-function:var(--sf-ease-move);transition-duration:var(--sf-duration-normal)}.transition-layout{transition-property:flex-grow, flex-shrink, flex-basis, width, min-width, max-width;transition-timing-function:var(--sf-ease-move);transition-duration:var(--sf-duration-normal)}}

/* docara-shell-source: runtime/utility/width/default/css/default.min.css */
@layer sf.reset, sf.tokens, sf.base, sf.utilities, sf.components, sf.overrides, sf.states;
@layer sf.utilities{.w-auto{width:auto}.w-1\/1{width:100%}.w-1\/2{width:50%}.w-1\/3{width:33.333333%}.w-2\/3{width:66.666667%}.w-1\/4{width:25%}.w-2\/4{width:50%}.w-3\/4{width:75%}.w-1\/5{width:20%}.w-2\/5{width:40%}.w-3\/5{width:60%}.w-4\/5{width:80%}.w-1\/6{width:16.666667%}.w-2\/6{width:33.333333%}.w-3\/6{width:50%}.w-4\/6{width:66.666667%}.w-5\/6{width:83.333333%}.w-1\/12{width:8.333333%}.w-2\/12{width:16.666667%}.w-3\/12{width:25%}.w-4\/12{width:33.333333%}.w-5\/12{width:41.666667%}.w-6\/12{width:50%}.w-7\/12{width:58.333333%}.w-8\/12{width:66.666667%}.w-9\/12{width:75%}.w-10\/12{width:83.333333%}.w-11\/12{width:91.666667%}.w-full{width:100%}.w-screen{width:100vw}.w-screen-small{width:var(--sf-viewport-width-small)}.w-screen-large{width:var(--sf-viewport-width-large)}.w-screen-dynamic{width:var(--sf-viewport-width-dynamic)}.w-min{width:-webkit-min-content;width:-moz-min-content;width:min-content}.w-max{width:-webkit-max-content;width:-moz-max-content;width:max-content}.w-fit{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.w-px{width:1px}.w-0{width:0}}

/* docara-shell-source: portable/declarative-shell.css */
html{color-scheme:light dark}
.theme-light{color-scheme:light}
.theme-dark{color-scheme:dark}
body{min-height:100vh;background:var(--sf-surface-0);color:var(--sf-on-surface)}
.docara-skip-link{position:fixed;inset-block-start:var(--sf-space-1);inset-inline-start:var(--sf-space-1);z-index:100;transform:translateY(-200%);color:var(--sf-on-surface);text-decoration:none}
.docara-skip-link:focus{transform:translateY(0)}
body[data-docara-shell]{opacity:1!important}
.docara-outline-mobile{display:none}
/* The header is the Framework sf-header-site (PortableSiteHeader): the navigation fills the bar between the brand and the tools. */
.docara-header-content{flex:1 1 auto}
/* Until sf-language has drawn its trigger (it then sets data-look), it holds the place of one size-1 icon button, so the tools do not shift while its script loads. */
.docara-header-tools>sf-language[data-docara-language]:not([data-look]){display:inline-block;inline-size:2.5rem;block-size:2.5rem}
/* The language menu is positioned for its popup, so it would paint over the open panel and its scrim that come before it; they are lifted over the bar's own controls. */
.docara-header .sf-site-header--open .sf-site-header-scrim,.docara-header .sf-site-header--open .sf-site-header-panel{z-index:1}
/* The search field follows the Framework size-1 control height, which is smaller on phones, like the icon buttons beside it. */
.docara-header{--docara-header-control-size:calc(var(--sf-text-height-1) + 2 * var(--sf-ui-1--space-y-tightness-default))}
.docara-header .docara-brand--logo{--docara-brand-mark-size:var(--sf-c6)}
.docara-search-trigger{--sf-button--border-color:var(--sf-outline-variant)}
/* The header row, docs layout, landing content and footer are all Framework containers: they take its side padding steps, so the logo, sidebar, content and footer start on one line at every width. */
.docara-docs-layout{display:grid;grid-template-columns:minmax(var(--sf-f4),var(--sf-f8)) minmax(0,1fr)}
.docara-docs-layout[data-outline="true"]{grid-template-columns:minmax(var(--sf-f4),var(--sf-f8)) minmax(0,1fr) var(--sf-f2)}
.docara-docs-layout[data-sidebar="false"]{grid-template-columns:minmax(0,1fr)}
.docara-docs-layout[data-sidebar="false"][data-outline="true"]{grid-template-columns:minmax(0,1fr) var(--sf-f2)}
.docara-sidebar{align-self:stretch;border-inline-end:1px solid var(--sf-outline-variant)}
.docara-sidebar-panel{position:sticky;inset-block-start:var(--docara-header-block-size);block-size:calc(100vh - var(--docara-header-block-size));display:flex;flex-direction:column}
.docara-sidebar-scroll{flex:1 1 auto;min-block-size:0}
.docara-sidebar-credit{flex:0 0 auto;margin:0;padding-block:var(--sf-space-1);padding-inline:var(--sf-space-1);border-block-start:1px solid var(--sf-outline-variant)}
/* The container's gutter grows with the window and a wide page centres the container, so the line above the credit is drawn on through any gutter to the window edge instead of moving the credit. */
.docara-sidebar-panel>.docara-sidebar-credit{position:relative}
.docara-sidebar-panel>.docara-sidebar-credit::before{content:"";position:absolute;inset-block-start:-1px;inset-inline-end:100%;inline-size:100vw;border-block-start:1px solid var(--sf-outline-variant);pointer-events:none}
/* The logo is sized from the text: its lowercase letters (250 of the 600-unit height) match the text's x-height (about 0.55em), and its baseline (175 units above the bottom) sits on the text's baseline. */
.docara-sidebar-credit-link{--docara-credit-logo-size:1.25rem;--docara-credit-wordmark:color-mix(in srgb,var(--sf-on-surface-variant) 65%,transparent);--docara-credit-mark:#505050;--docara-credit-ring:#F7F7F7;color:var(--sf-on-surface-variant);text-decoration:none}
/* One logo, two colour variables: the letters and the accented "o". Hover and focus only swap their values, from the two grays to the theme text colour and the Docara red. */
.docara-sidebar-credit-link:hover,.docara-sidebar-credit-link:focus-visible{color:var(--sf-on-surface);--docara-credit-wordmark:var(--sf-on-surface);--docara-credit-mark:#E81123}
.docara-sidebar-credit-link:focus-visible{outline:var(--sf-focus--width) var(--sf-focus--style) var(--sf-focus--color,Highlight);outline-offset:var(--sf-focus--offset)}
.docara-sidebar-credit-logo{display:inline-block;block-size:var(--docara-credit-logo-size);inline-size:auto;vertical-align:calc(var(--docara-credit-logo-size) * -0.2917);fill:var(--docara-credit-wordmark)}
.docara-sidebar-credit-mark{fill:var(--docara-credit-mark)}.docara-sidebar-credit-ring{fill:var(--docara-credit-ring)}
.docara-sidebar-credit-text--before{margin-inline-end:var(--sf-a4)}.docara-sidebar-credit-text--after{margin-inline-start:var(--sf-a4)}
.docara-sidebar-scroll>.sf-scrollbar__viewport>[data-docara-section]{padding-block:var(--sf-space-1);padding-inline-end:var(--sf-space-1);padding-inline-start:0}
/* A part an author adds under the menu starts where the menu's words start, so it reads as part of the column and not as text pinned to its edge. */
.docara-sidebar-scroll>.sf-scrollbar__viewport>[data-docara-section="docara.shell"]{padding-inline-start:var(--sf-space-1);padding-block-end:var(--sf-space-2)}
.docara-outline-rail{position:relative;align-self:stretch;box-shadow:inset var(--sf-px) var(--sf-0) var(--sf-0) var(--sf-outline-variant)}
.docara-outline-rail{--docara-outline-indent:calc(var(--sf-space-2) + var(--sf-a2))}
html[dir="rtl"] .docara-outline-rail{box-shadow:inset calc(var(--sf-px) * -1) var(--sf-0) var(--sf-0) var(--sf-outline-variant)}
.docara-outline-scroll{position:sticky;inset-block-start:var(--docara-header-block-size);block-size:calc(100vh - var(--docara-header-block-size));direction:ltr}
/* The column's edge is the contents line: the section starts on it, the edge is the one line drawn, and the current section's bar lies on it. The heading and the links keep their indent from it. */
.docara-outline-scroll>.sf-scrollbar__viewport>[data-docara-section]{padding:var(--sf-space-2);padding-inline-start:0}
html[dir="rtl"] .docara-outline-scroll>.sf-scrollbar__viewport>[data-docara-section]{padding-inline-start:var(--sf-space-2);padding-inline-end:0}
/* A part an author adds under the contents keeps the contents' indent, so its box never lies on the line the column is drawn along. */
.docara-outline-scroll>.sf-scrollbar__viewport>[data-docara-section="docara.shell"]{padding-inline-start:calc(var(--docara-outline-indent) + var(--sf-space-1\/2));padding-inline-end:0}
html[dir="rtl"] .docara-outline-scroll>.sf-scrollbar__viewport>[data-docara-section="docara.shell"]{padding-inline-start:0;padding-inline-end:calc(var(--docara-outline-indent) + var(--sf-space-1\/2))}
.docara-outline-rail .sf-contents{--sf-contents-line-color:transparent}
/* The footer is set off from the page by a line and room of its own, and its words start where the menu's words start. */
body[data-docara-shell]>[data-docara-region="footer"]{border-block-start:1px solid var(--sf-outline-variant);padding-block:var(--sf-space-2)}
body[data-docara-shell]>[data-docara-region="footer"]>[data-docara-section="docara.shell"]{padding-inline:var(--sf-space-1)}
.docara-outline-rail .sf-contents--layout-column .sf-contents-label,.docara-outline-rail .sf-contents--layout-column .sf-contents-link{padding-inline-start:calc(var(--docara-outline-indent) + var(--sf-space-1\/2))}
html[dir="ltr"] .docara-outline-scroll>.sf-scrollbar__viewport>[data-docara-section]>*{direction:ltr}
html[dir="rtl"] .docara-outline-scroll>.sf-scrollbar__viewport>[data-docara-section]>*{direction:rtl}
/* The sticky header is a row of size-1 controls (--sf-d0) inside p-1 padding over a border-bottom-1, so its height follows the same tokens at every breakpoint. A jump target stops one spacing step below it; reading mode hides the header. */
:root{--docara-header-block-size:calc(var(--sf-d0) + var(--sf-space-1) * 2 + var(--sf-a1));--docara-anchor-offset:calc(var(--docara-header-block-size) + var(--sf-space-2))}
/* The Framework sf-contents reads the covered top of the page from scroll-padding: under the sticky header, like the heading anchors. Its compact button sticks below the header. */
html{scroll-padding-block-start:var(--docara-anchor-offset)}
.docara-outline-mobile{--sf-contents-inset-block-start:var(--docara-header-block-size);--sf-contents-background:var(--sf-surface)}
.docara-prose>.docara-outline-mobile{margin-block-end:var(--sf-space-1)}
html[data-docara-focus-mode] body:has(>.docara-docs-layout){--docara-header-block-size:0px;--docara-anchor-offset:var(--sf-space-2)}
.docara-content{color:var(--sf-on-surface);scroll-margin-block-start:var(--docara-anchor-offset)}
/* Reader font size: one step of the root size. Framework type, spacing, controls and container steps are rem-based, so the header, navigation, outline, breadcrumbs and content all follow, like a browser text-size change: 16px body text becomes 14px or 18px (--sf-b4 / --sf-b8 over --sf-b6). Percentages keep the reader's own browser default as the base. */
html[data-docara-font-size="small"]{font-size:87.5%}
html[data-docara-font-size="large"]{font-size:112.5%}
/* Reading toolbar: breadcrumbs with the outline and reading-mode toggles at the inline end. */
.docara-reading-actions{margin-inline-start:auto}
/* Reading mode swaps the toolbar toggle for a round Framework icon button pinned to the window corner. */
.docara-focus-exit,html[data-docara-focus-mode] .docara-focus-toggle{display:none}
html[data-docara-focus-mode] .docara-docs-layout .docara-focus-exit{display:inline-flex;position:fixed;z-index:3;inset-block-start:var(--sf-space-1);inset-inline-end:var(--sf-space-1)}
@media(min-width:72rem){
  html[data-docara-outline-hidden] .docara-docs-layout[data-outline="true"]{grid-template-columns:minmax(var(--sf-f4),var(--sf-f8)) minmax(0,1fr)}
  html[data-docara-outline-hidden] .docara-docs-layout[data-sidebar="false"][data-outline="true"]{grid-template-columns:minmax(0,1fr)}
  html[data-docara-outline-hidden] .docara-docs-layout>.docara-outline-rail{display:none}
}
/* Reading mode keeps only the content column. The header element sets display: contents on itself, so hiding it needs !important. */
html[data-docara-focus-mode] body:has(>.docara-docs-layout)>.docara-header{display:none!important}
html[data-docara-focus-mode] body:has(>.docara-docs-layout)>[data-docara-region="footer"],html[data-docara-focus-mode] .docara-docs-layout>.docara-sidebar,html[data-docara-focus-mode] .docara-docs-layout>.docara-outline-rail,html[data-docara-focus-mode] .docara-docs-layout .docara-outline-mobile,html[data-docara-focus-mode] .docara-outline-toggle{display:none}
html[data-docara-focus-mode] .docara-docs-layout.docara-docs-layout{grid-template-columns:minmax(0,1fr)}
/* Reading mode sets the whole column, toolbar, code, tables and examples alike, on the prose measure and centres it, so nothing runs wider than the text; the reader wide format keeps the full width. */
html[data-docara-focus-mode]:not([data-docara-content-width="wide"]) .docara-docs-layout .docara-reading-column>*{inline-size:100%;max-inline-size:var(--sf-text--measure-wide);margin-inline:auto}
@media not all and (min-width:72rem){.docara-outline-toggle{display:none}}
/* Reader wide format: the shell takes the Framework's widest container step (layout.container.max 8) instead of the authored one, and prose lines lose their measure limit. The container tokens exist from the Framework lg breakpoint (60rem), like max-container-N. */
@media(min-width:60rem){html[data-docara-content-width="wide"] body[data-docara-shell] .docara-header .sf-site-header-row,html[data-docara-content-width="wide"] body[data-docara-shell] .docara-docs-layout,html[data-docara-content-width="wide"] body[data-docara-shell]>[data-docara-region="footer"]{max-inline-size:var(--sf-container-8--size-max)}}
html[data-docara-content-width="wide"] .docara-docs-layout .docara-prose p:not(:where(.docara-example-inline *)),html[data-docara-content-width="wide"] .docara-docs-layout .docara-prose li:not(:where(.docara-example-inline *)){max-width:none}
/* The Framework pager (sf-pager) draws the previous and next pages; the shell only sets it apart from the article. */
[data-docara-previous-next]>.sf-pager{margin-block-start:var(--sf-space-4)}
.docara-prose h1[id]:not(:where(.docara-example-inline *)),.docara-prose h2[id]:not(:where(.docara-example-inline *)),.docara-prose h3[id]:not(:where(.docara-example-inline *)),.docara-prose h4[id]:not(:where(.docara-example-inline *)),.docara-prose h5[id]:not(:where(.docara-example-inline *)),.docara-prose h6[id]:not(:where(.docara-example-inline *)){scroll-margin-block-start:var(--docara-anchor-offset)}
.docara-prose p:not(:where(.docara-example-inline *)),.docara-prose li:not(:where(.docara-example-inline *)){max-width:var(--sf-text--measure-wide)}
.docara-prose img{max-inline-size:100%}
.aspect-21x9{aspect-ratio:21/9}
.docara-prose>p>img:only-child,.docara-prose>p>a:only-child>img:only-child{display:block;block-size:auto}
.docara-prose figure>img,.docara-prose picture>img{display:block}
.docara-prose figure,.docara-prose picture{max-inline-size:100%}
/* A checklist item keeps the Framework list inset but trades its bullet for the box, which sits where the bullet was. The box is disabled: the list records a state, it does not collect an answer. */
.docara-prose li:has(>input[type="checkbox"]){list-style:none}
.docara-prose li>input[type="checkbox"]{inline-size:var(--sf-text--size-1);block-size:var(--sf-text--size-1);margin-inline-start:calc(var(--sf-text--size-2) * -1);margin-inline-end:var(--sf-space-1\/3);accent-color:var(--sf-primary)}
/* A term and its definition: the Framework reset leaves dl, dd without margins, so the spacing comes from the space steps and the term carries the weight. */
.docara-prose dt{font-weight:var(--sf-weight--medium)}
/* Inline code never breaks inside a token such as icon-start or on-surface-variant; the line wraps before it instead, and a table with such cells scrolls in its frame. */
.docara-prose :not(pre)>code:not(:where(.docara-example-inline *)){white-space:nowrap;hyphens:none}
/* A long piece the build marks with data-docara-code-wrap (a path, a URN or a class name longer than 32 characters, 16 in a heading) would make the page wider than a phone on one line: it wraps where a line allows and, where a part is still too long, inside the token. A table cell keeps it on one line and the table scrolls in its frame. */
.docara-prose :not(pre)>code[data-docara-code-wrap]:not(:where(.docara-example-inline *,table *)){white-space:normal;overflow-wrap:anywhere}
/* A bullet between spaces in prose separates parts of a meta line: smaller, in the caption colour, centred on the line. The spaces around it stay, so the margin only tops them up to the gap the prototype drew. */
.docara-sep{display:inline-block;margin-inline:.15em;font-size:.8em;position:relative;top:-.05em;color:var(--sf-on-surface-variant)}
.docara-prose dd{margin-inline-start:var(--sf-space-2)}
.docara-prose dl>dt:not(:first-child){margin-block-start:var(--sf-space-1)}
.docara-code-block.bg-surface-container{background:var(--sf-surface-0)}
.docara-code-block>.sf--highlight-head{margin:0;border-bottom:1px solid var(--sf-outline-variant)}
.docara-code-header,.docara-code-block>.sf--highlight-head,.docara-example-preview__header,.docara-example-log__head{position:relative;box-sizing:border-box;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;align-content:center;gap:var(--sf-space-1);min-block-size:calc(var(--sf-ui-1--control-height) + 2 * var(--sf-space-1\/3));padding:var(--sf-space-1\/3) var(--sf-space-1);background:var(--sf-surface-0)}
.docara-code-header>span,.docara-code-block>.sf--highlight-head>span{display:inline-flex;align-self:center;inline-size:max-content;max-inline-size:100%;min-block-size:var(--sf-ui-1--control-height);align-items:center;padding-inline:var(--sf-space-1);color:var(--sf-on-surface);font-size:var(--sf-text-size-1);line-height:var(--sf-text-height-1)}
.docara-code-header>[data-docara-code-actions],.docara-code-block>.sf--highlight-head>[data-docara-code-actions],.docara-example-preview__actions,.docara-example-log__actions{display:flex;align-self:center;align-items:center;justify-self:end;gap:var(--sf-space-1\/3)}
.docara-code-header>[data-docara-code-actions],.docara-code-block>.sf--highlight-head>[data-docara-code-actions]{margin:0}
.docara-code-header>[data-docara-code-actions]>button,.docara-code-block>.sf--highlight-head>[data-docara-code-actions]>button{margin:0;color:var(--sf-on-surface-variant)}
.docara-code-header>[data-docara-code-actions]>button .sf-button-text-container,.docara-code-block>.sf--highlight-head>[data-docara-code-actions]>button .sf-button-text-container{display:none}
.docara-code-header>[data-docara-code-actions]>button:hover,.docara-code-header>[data-docara-code-actions]>button:focus-visible,.docara-code-block>.sf--highlight-head>[data-docara-code-actions]>button:hover,.docara-code-block>.sf--highlight-head>[data-docara-code-actions]>button:focus-visible{color:var(--sf-on-surface)}
.docara-code-header>[data-docara-code-actions]>button:focus:not(:focus-visible),.docara-code-block>.sf--highlight-head>[data-docara-code-actions]>button:focus:not(:focus-visible){--sf-icon-button--box-shadow:none;outline:0;box-shadow:none}
.docara-code-fallback-action{display:block;inline-size:var(--sf-ui-1--control-height);block-size:var(--sf-ui-1--control-height);margin:0}
.docara-code-block>[data-docara-code-fallback]{border-bottom:1px solid var(--sf-outline-variant)}
.docara-code-block:not([data-sf-highlight-chrome="static"]):has(>.sf--highlight-head)>[data-docara-code-fallback]{display:none}
.docara-code-block+*{margin-block-start:var(--sf-space-4)}
.docara-code-scroll{max-width:100%;background:var(--sf-surface-0);border:0;border-radius:0;box-shadow:none;overscroll-behavior-inline:contain}
.docara-code-scroll code{display:block;min-inline-size:max-content;white-space:pre;background:transparent}
.docara-code-scroll .hljs-ln{inline-size:max-content;margin:0;border:0;border-spacing:0;border-collapse:collapse;background:transparent}
.docara-code-scroll .hljs-ln td{margin:0;padding:0;border:0;background:transparent}
.docara-code-scroll .hljs-ln-numbers{display:none}
.docara-code-scroll .hljs-ln-code{padding-inline:0}
[data-docara-code-wrap-active="true"] .docara-code-scroll{overflow-x:hidden}
[data-docara-code-wrap-active="true"] .docara-code-scroll code{min-inline-size:0;white-space:pre-wrap;overflow-wrap:anywhere}
[data-docara-code-wrap-active="true"] .docara-code-scroll .hljs-ln{inline-size:100%;table-layout:fixed}
[data-docara-code-wrap-active="true"] .docara-code-scroll .hljs-ln-code{white-space:pre-wrap;overflow-wrap:anywhere}
/* Code reads left to right on a right-to-left page too. */
.docara-code-scroll,.docara-code-scroll code{direction:ltr;unicode-bidi:isolate;text-align:left}
/* Build-time code lines (CodeLinePresenter): numbers, diff signs and prompts are generated content, so they are neither copied with a selection nor read aloud; a changed line's word is read from its hidden status text. */
.docara-code-scroll--lines{padding-block:var(--sf-space-2)}
.docara-code-scroll--lines code{color:var(--sf-on-surface)}
.docara-code-line{display:flex;padding-inline:var(--sf-space-2)}
.docara-code-line__content{flex:1 1 auto;min-inline-size:0;white-space:pre}
.docara-code-line__content:empty::before{content:"\200b"}
.docara-code-line__number,.docara-code-line__sign,.docara-code-line__prompt{flex:none;-webkit-user-select:none;user-select:none}
.docara-code-line__number{min-inline-size:2ch;padding-inline-end:var(--sf-space-1);color:var(--sf-on-surface-variant);text-align:right}
.docara-code-line__number::before{content:attr(data-line-number)}
[data-docara-code-digits="3"] .docara-code-line__number{min-inline-size:3ch}
[data-docara-code-digits="4"] .docara-code-line__number{min-inline-size:4ch}
[data-docara-code-digits="5"] .docara-code-line__number{min-inline-size:5ch}
[data-docara-code-digits="6"] .docara-code-line__number{min-inline-size:6ch}
.docara-code-line__sign{inline-size:2ch}
.docara-code-line[data-line-diff="add"] .docara-code-line__sign::before{content:"+";color:var(--sf-success)}
.docara-code-line[data-line-diff="remove"] .docara-code-line__sign::before{content:"\2212";color:var(--sf-error)}
.docara-code-line__status{-webkit-user-select:none;user-select:none}
.docara-code-line[data-line-highlight]{background:color-mix(in srgb,var(--sf-primary) 12%,transparent);box-shadow:inset 3px 0 0 var(--sf-primary)}
.docara-code-line[data-line-diff="add"]{background:color-mix(in srgb,var(--sf-success) 16%,transparent)}
.docara-code-line[data-line-diff="remove"]{background:color-mix(in srgb,var(--sf-error) 16%,transparent)}
[data-docara-code-focus] .docara-code-line:not([data-line-focus]){opacity:.45;filter:blur(.05em);transition:opacity .2s ease,filter .2s ease}
[data-docara-code-focus]:hover .docara-code-line:not([data-line-focus]),[data-docara-code-focus]:focus-within .docara-code-line:not([data-line-focus]){opacity:1;filter:none}
@media (prefers-reduced-motion:reduce){[data-docara-code-focus] .docara-code-line:not([data-line-focus]){transition:none}}
.docara-code-line__prompt::before{content:"$";padding-inline-end:1ch;color:var(--sf-primary);font-weight:600}
.docara-code-block--terminal .docara-code-line[data-line-output]{color:var(--sf-on-surface-variant)}
.docara-code-block--terminal .docara-code-header>span::before{content:"";flex:none;inline-size:2.9em;block-size:.75em;margin-inline-end:var(--sf-space-1);background:radial-gradient(circle at .375em 50%,var(--sf-error) .36em,transparent .4em),radial-gradient(circle at 1.45em 50%,var(--sf-warning) .36em,transparent .4em),radial-gradient(circle at 2.525em 50%,var(--sf-success) .36em,transparent .4em)}
[data-docara-code-wrap-active="true"] .docara-code-line__content{white-space:pre-wrap;overflow-wrap:anywhere}
body[data-docara-shell] sf-button:not(:where(.docara-example-inline *)){display:block}
.docara-prose sf-alert:not(:where(.docara-example-inline *)),.docara-prose sf-button:not(:where(.docara-example-inline *)){margin-block:var(--sf-space-2)}
.docara-prose>.docara-smart-block{margin-block:var(--sf-space-2)}
/* No element around the article is a size container: a browser that gives a size container layout containment also makes it the containing block of position:fixed descendants, so a Framework popup in an inline example (a date picker calendar, a dropdown) would be placed against the main region instead of the window and open far from its field. A landing's full-width block measures the window instead (below), and the landing clips the half scrollbar a classic scrollbar adds to it. */
.docara-landing{display:block;min-height:auto;overflow-x:clip}
.docara-landing [data-docara-block="hero"]:not([data-docara-surface]):not([data-sf-effect]){background:radial-gradient(circle at 12% 18%,color-mix(in srgb,var(--sf-primary-container) 72%,transparent),transparent 46%),radial-gradient(circle at 88% 12%,color-mix(in srgb,var(--sf-tertiary-container) 58%,transparent),transparent 38%),color-mix(in srgb,var(--sf-surface-container) 76%,transparent)}
/* A hero with a background effect: the Framework gives the area the theme the effect draws (sf-effect-area with theme-dark or theme-light). The area takes that theme's surface and ink, so the text never keeps the page's colour over a scene of the other theme while the effect loads, draws translucently or is hidden. */
/* Before the effect loads (or when it is refused) the hero already has the plain surface the effect draws on, in the effect's theme, so the background does not jump when the scene appears. */
[data-docara-block="hero"][data-sf-effect]{position:relative;background:var(--sf-surface-0);color:var(--sf-on-surface)}
[data-docara-block="hero"][data-sf-effect-theme="dark"]{color-scheme:dark}
[data-docara-block="hero"][data-sf-effect-theme="light"]{color-scheme:light}
/* Hero padding=2xl: a tall first screen whose vertical padding grows with the viewport from --sf-d2 (3rem) on a phone to --sf-e4 (7rem) on a wide screen, with no breakpoint. The Framework has no fluid spacing utility; the limits are its spacing tokens. The value is a property so the pause button below can be placed inside it. */
:root{--docara-padding-2xl:clamp(var(--sf-d2),var(--sf-c2) + 6vw,var(--sf-e4))}
.docara-padding-2xl{padding-block:var(--docara-padding-2xl)}
/* The pause button sits in the hero's bottom padding at the inline end, below the content and media, so it never covers them and does not add a row to the hero. A 2xl padding (3rem and more) holds the button as it is: the button keeps --sf-space-1 from the bottom, or sits in the middle of the padding where the padding is barely taller than it, and the hero keeps its height. An lg or xl padding (1rem to 2rem) is lower than the button, so while a hero has the button its bottom padding becomes the button plus --sf-space-1/3 above and below it. The padding is kept while the button waits for the effect to start, so the page does not shift when it appears; with reduced motion the button never shows and the padding stays the hero's own. */
[data-docara-block="hero"]>.docara-effect-toggle{position:absolute;z-index:1;inset-block-end:var(--sf-space-1\/3);inset-inline-end:var(--sf-space-1);margin:0;--sf-icon-button-background-color:var(--sf-surface-0);--sf-icon-button-border-color:var(--sf-outline-variant)}
[data-docara-block="hero"]>.docara-effect-toggle[hidden]{display:none}
[data-docara-block="hero"]:has(>.docara-padding-2xl)>.docara-effect-toggle{inset-block-end:min(var(--sf-space-1),(var(--docara-padding-2xl) - var(--sf-ui-1--control-height))/2)}
@media (prefers-reduced-motion:no-preference){[data-docara-block="hero"]:has(>.docara-effect-toggle)>[data-docara-container]:not(.docara-padding-2xl){padding-block-end:calc(var(--sf-ui-1--control-height) + 2*var(--sf-space-1\/3))}}
.docara-landing .docara-content{width:100%}
.docara-landing .docara-content>[data-docara-section][data-docara-region-owner="main"]{box-sizing:border-box;width:100%;max-width:none;margin:0;padding:0}
/* A full-width block reaches the edges of the main region. On a landing the main region spans the window, so the block takes the window width centred on the article; in the documentation layout the article already fills the main region, so the block keeps the column width. */
.docara-landing .docara-content>[data-docara-width="full"],.docara-landing .docara-content>[data-docara-section][data-docara-region-owner="main"]>[data-docara-width="full"]{box-sizing:border-box;width:100vw;margin-inline:calc(50% - 50vw)}
.docara-docs-layout [data-docara-region="main"]>.docara-prose>[data-docara-width="full"],.docara-docs-layout [data-docara-region="main"]>.docara-prose>[data-docara-section][data-docara-region-owner="main"]>[data-docara-width="full"]{box-sizing:border-box;width:100%;margin-inline:0}
.docara-landing [data-docara-container]{box-sizing:border-box;width:100%}
.docara-surface>[data-docara-surface-background],.docara-surface>[data-docara-surface-overlay]{position:absolute;inset:0;inline-size:100%;block-size:100%;pointer-events:none}
.docara-surface>[data-docara-container]{box-sizing:border-box}
.docara-surface>[data-docara-container]:not(.docara-landing *){max-inline-size:100%}
.docara-surface>[data-docara-surface-background]{z-index:-2}
.docara-surface>[data-docara-surface-background][data-fit="cover"]{object-fit:cover}
.docara-surface>[data-docara-surface-background][data-fit="contain"]{object-fit:contain}
.docara-surface>[data-docara-surface-background][data-fit="auto"]{object-fit:none}
.docara-surface>[data-docara-surface-background][data-x="left"]{object-position:left center}
.docara-surface>[data-docara-surface-background][data-x="center"]{object-position:center center}
.docara-surface>[data-docara-surface-background][data-x="right"]{object-position:right center}
.docara-surface>[data-docara-surface-background][data-y="top"]{object-position:var(--docara-surface-x,center) top}
.docara-surface>[data-docara-surface-background][data-y="center"]{object-position:var(--docara-surface-x,center) center}
.docara-surface>[data-docara-surface-background][data-y="bottom"]{object-position:var(--docara-surface-x,center) bottom}
.docara-surface>[data-docara-surface-background][data-x="left"]{--docara-surface-x:left}
.docara-surface>[data-docara-surface-background][data-x="center"]{--docara-surface-x:center}
.docara-surface>[data-docara-surface-background][data-x="right"]{--docara-surface-x:right}
.docara-surface>[data-docara-surface-overlay]{z-index:-1;background:transparent}
.docara-surface>[data-docara-surface-overlay][data-overlay="light"][data-strength="soft"]{background:color-mix(in srgb,var(--sf-surface-0) 30%,transparent)}
.docara-surface>[data-docara-surface-overlay][data-overlay="light"][data-strength="medium"]{background:color-mix(in srgb,var(--sf-surface-0) 55%,transparent)}
.docara-surface>[data-docara-surface-overlay][data-overlay="light"][data-strength="strong"]{background:color-mix(in srgb,var(--sf-surface-0) 78%,transparent)}
.docara-surface>[data-docara-surface-overlay][data-overlay="dark"][data-strength="soft"]{background:color-mix(in srgb,var(--sf-on-surface) 30%,transparent)}
.docara-surface>[data-docara-surface-overlay][data-overlay="dark"][data-strength="medium"]{background:color-mix(in srgb,var(--sf-on-surface) 55%,transparent)}
.docara-surface>[data-docara-surface-overlay][data-overlay="dark"][data-strength="strong"]{background:color-mix(in srgb,var(--sf-on-surface) 78%,transparent)}
.docara-landing .docara-content>[data-docara-section][data-docara-region-owner="main"]>h1:first-child,.docara-landing .docara-content>[data-docara-section][data-docara-region-owner="main"]>p:first-of-type{max-width:var(--sf-text--measure)}
[data-docara-media]{display:block;inline-size:100%;block-size:auto}
[data-docara-media="hero"],[data-docara-media="promo"]{aspect-ratio:16/9;object-fit:contain}
[data-docara-media="showcase"]{aspect-ratio:16/9;object-fit:contain}
[data-docara-media="feature-icon"]{inline-size:var(--sf-e0);block-size:var(--sf-e0);object-fit:contain}
[data-docara-block="features"]>li>.docara-icon{align-self:flex-start}
/* A closed panel waits for find-in-page with hidden="until-found", which keeps its box; drop the padding so only the trigger shows. */
[data-docara-block="details"]>.sf-accordion-content[hidden]{padding:0}
.docara-landing [data-docara-block="columns"]>div>h3:first-child{font-size:var(--sf-heading-4--size);line-height:var(--sf-heading-4--height)}
[data-docara-media="card"]{aspect-ratio:4/3;object-fit:cover;border-radius:var(--sf-radius--surface)}
[data-docara-media="logo"]{max-inline-size:var(--sf-f0);max-block-size:var(--sf-d2);object-fit:contain}
.docara-example-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,var(--sf-f8)),1fr))}
.docara-example-grid .sf-button{margin-block-start:auto;align-self:flex-start}
.docara-example-preview{overflow:hidden;margin-block-end:var(--sf-space-1);border:1px solid var(--sf-outline-variant);border-radius:var(--sf-radius--surface);background:var(--sf-surface-0)}
/* layout=wide: the example spans the page edge to edge like a full-width surface, so its frame loses the side borders and the rounded corners that would sit on the window edge. */
.docara-example-preview--wide{border-inline:0;border-radius:0}
.docara-example-preview__header{border-block-end:1px solid var(--sf-outline-variant)}
.docara-example-inline{display:flow-root;min-inline-size:0}
.docara-example-preview__tabs{display:inline-flex;inline-size:max-content;max-inline-size:100%;align-items:center;gap:0;overflow-x:auto}
.docara-example-preview__tab{display:inline-flex;align-items:center;justify-content:center;min-block-size:var(--sf-ui-1--control-height);margin:0;padding-inline:var(--sf-space-1);border:0;border-radius:0;background:transparent;color:var(--sf-on-surface-variant);font-size:var(--sf-text-size-1);line-height:var(--sf-text-height-1);cursor:pointer;white-space:nowrap;flex-shrink:0}
.docara-example-preview__tab[aria-selected="true"]{color:var(--sf-on-surface)}
.docara-example-preview__tab:focus-visible{outline:var(--sf-focus--width) var(--sf-focus--style) var(--sf-focus--color);outline-offset:calc(var(--sf-focus--width) * -1)}
.docara-example-preview__indicator,.docara-example-log__indicator{position:absolute;inset-block-end:-1px;inset-inline-start:0;z-index:1;inline-size:0;block-size:var(--sf-a2);background:var(--sf-outline);pointer-events:none;transition:inset-inline-start 180ms ease,inline-size 180ms ease}
.docara-example-preview__actions{justify-content:flex-end}
.docara-example-preview__action,.docara-example-preview__copy{margin:0;color:var(--sf-on-surface-variant)}
.docara-example-preview__action .sf-icon,.docara-example-preview__copy .sf-icon{--sf-icon--color:var(--sf-on-surface-variant)}
.docara-example-preview__action:hover,.docara-example-preview__action:focus-visible,.docara-example-preview__copy:hover,.docara-example-preview__copy:focus-visible{color:var(--sf-on-surface)}
.docara-example-preview__action:hover .sf-icon,.docara-example-preview__action:focus-visible .sf-icon,.docara-example-preview__copy:hover .sf-icon,.docara-example-preview__copy:focus-visible .sf-icon{--sf-icon--color:var(--sf-on-surface)}
.docara-example-preview .docara-example-preview__action:focus:not(:focus-visible),.docara-example-preview .docara-example-preview__copy:focus:not(:focus-visible){--sf-icon-button--box-shadow:none;outline:0;box-shadow:none}
.docara-example-preview__copy[data-copy-state="copied"],.docara-example-preview__copy[data-copy-state="copied"] .sf-icon{color:var(--sf-on-surface);--sf-icon--color:var(--sf-on-surface)}
.docara-example-preview__panels{background:var(--sf-surface-0)}
.docara-example-preview[data-docara-example-overlay]{overflow:visible}
.docara-example-preview__panel{display:none;min-inline-size:0;padding:var(--sf-space-2)}
.docara-example-preview__panel>:last-child{margin-block-end:0}
.docara-example-preview__panel--source{padding:0}
.docara-example-preview__panel.is-active{display:block}
.docara-example-preview iframe{display:block;inline-size:100%;border:0;overflow:hidden;background:var(--sf-surface-0)}
.docara-example-preview iframe[data-docara-example-frame]{block-size:var(--sf-f2)}
/* A page example's frame shows a whole page of the site at a fixed height; the page scrolls inside it. */
.docara-example-preview iframe[data-docara-example-page]{block-size:var(--sf-h1)}
.docara-example-preview iframe:not([data-docara-example-frame]){block-size:var(--sf-g6)}
.docara-example-preview[data-preview-size="compact"] iframe:not([data-docara-example-frame]){block-size:var(--sf-g1)}
.docara-example-preview[data-preview-size="tall"] iframe:not([data-docara-example-frame]){block-size:var(--sf-h1)}
[data-docara-example-panel]:not([data-docara-example-panel="example"]) [data-docara-code-block]{block-size:auto;margin:0;border:0;border-radius:0;background:var(--sf-surface-0)}
[data-docara-example-panel]:not([data-docara-example-panel="example"]) [data-docara-code-block]>.sf--highlight-head{display:none}
[data-docara-example-panel]:not([data-docara-example-panel="example"]) [data-docara-code-block]>[data-docara-code-fallback]{display:none}
[data-docara-example-panel] .docara-code-scroll{box-sizing:border-box;block-size:auto;margin:0;background:var(--sf-surface-0)}
[data-docara-example-panel] .docara-code-scroll code{background:transparent}
[data-docara-example-panel] .docara-code-scroll .hljs-ln{inline-size:max-content;margin:0;border:0;border-spacing:0;border-collapse:collapse;background:transparent}
[data-docara-example-panel] .docara-code-scroll .hljs-ln td{margin:0;padding:0;border:0;background:transparent}
[data-docara-example-panel] .docara-code-scroll .hljs-ln-numbers{display:none}
[data-docara-example-panel] .docara-code-scroll .hljs-ln-code{padding-inline:0}
[data-docara-example-wrap-active="true"] [data-docara-example-panel] .docara-code-scroll{overflow-x:hidden}
[data-docara-example-wrap-active="true"] [data-docara-example-panel] .docara-code-scroll code{min-inline-size:0;white-space:pre-wrap;overflow-wrap:anywhere}
[data-docara-example-wrap-active="true"] [data-docara-example-panel] .docara-code-scroll .hljs-ln{inline-size:100%;table-layout:fixed}
[data-docara-example-wrap-active="true"] [data-docara-example-panel] .docara-code-scroll .hljs-ln-code{white-space:pre-wrap;overflow-wrap:anywhere}
[data-docara-example-copy][hidden],[data-docara-example-viewer][hidden],[data-docara-example-viewports][hidden],[data-docara-example-wrap][hidden]{display:none}
/* The example log: a bottom section of the example's frame. Its head repeats the top tab bar (same header box, tab and indicator rules); the line under the head goes when the log is collapsed. */
.docara-example-log{border-block-start:1px solid var(--sf-outline-variant);background:var(--sf-surface-0)}
.docara-example-log__head{border-block-end:1px solid var(--sf-outline-variant)}
.docara-example-log[data-docara-example-log-state="collapsed"] .docara-example-log__head{border-block-end:0}
.docara-example-log__tab{gap:var(--sf-space-1\/3)}
.docara-example-log__count{box-sizing:border-box;display:inline-block;min-inline-size:calc(var(--sf-text-height-1\/3) + var(--sf-space-1\/3));padding-inline:var(--sf-space-1\/4);border-radius:var(--sf-text-height-1\/3);background:var(--sf-surface-container);color:var(--sf-on-surface-variant);font-size:var(--sf-text-size-1\/3);line-height:var(--sf-text-height-1\/3);text-align:center;font-variant-numeric:tabular-nums}
.docara-example-log__panels[hidden],.docara-example-log__panel[hidden],.docara-example-log__empty[hidden]{display:none}
.docara-example-log__panel{box-sizing:border-box;max-block-size:calc(var(--sf-text-height-1\/2) * 8);overflow:auto;padding:var(--sf-space-1\/3) var(--sf-space-1) var(--sf-space-1\/2);overscroll-behavior:contain}
.docara-example-log__panel:focus-visible{outline:var(--sf-focus--width) var(--sf-focus--style) var(--sf-focus--color);outline-offset:calc(var(--sf-focus--width) * -1)}
.docara-example-log__rows{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:var(--sf-text-size-1\/2);line-height:var(--sf-text-height-1\/2)}
.docara-example-log__row{display:grid;grid-template-columns:auto auto minmax(0,1fr);gap:var(--sf-space-1);padding-block:var(--sf-space-1\/4);border-block-end:1px dashed var(--sf-outline-variant)}
.docara-example-log__row:last-child{border-block-end:0}
.docara-example-log__time,.docara-example-log__detail{color:var(--sf-on-surface-variant)}
.docara-example-log__name{color:var(--sf-on-surface);font-weight:600}
.docara-example-log__detail{overflow-wrap:anywhere}
.docara-example-log__row[data-level="warn"] .docara-example-log__name{color:var(--sf-warning)}
.docara-example-log__row[data-level="error"] .docara-example-log__name{color:var(--sf-error)}
.docara-example-log__empty{margin:0;padding-block:var(--sf-space-1\/4);color:var(--sf-on-surface-variant);font-size:var(--sf-text-size-1\/2);line-height:var(--sf-text-height-1\/2)}
/* In the full-screen viewer the log keeps its own height under the example. */
.docara-example-preview[data-docara-example-viewer-active="true"] .docara-example-log{flex:0 0 auto}
/* The width switcher is three Framework link icon buttons; the pressed one carries the Framework .active state (surface-container-active), visible in both themes. */
.docara-example-preview__viewports{display:inline-flex;align-items:center;gap:var(--sf-space-1\/3)}
.docara-example-viewer-dialog{box-sizing:border-box;inline-size:100vw;max-inline-size:none;block-size:100dvh;max-block-size:none;margin:0;padding:0;border:0;background:var(--sf-surface-0);color:var(--sf-on-surface)}
/* A window's scrim darkens the page in both themes, like the Framework modal's: a fixed black, not a theme colour that turns light in the dark theme. */
:root{--docara-scrim:color-mix(in srgb,var(--sf-black) 60%,transparent)}
.docara-example-viewer-dialog::backdrop{background:var(--docara-scrim)}
/* sf-search carries its host's --sf-search-* values into the window it draws at the end of the body. */
[data-docara-search-dialog]{--sf-search-scrim-color:var(--docara-scrim)}
.docara-example-preview[data-docara-example-viewer-active="true"]{display:flex;flex-direction:column;inline-size:100%;block-size:100%;margin:0;border:0;border-radius:0;background:var(--sf-surface-0)}
.docara-example-preview[data-docara-example-viewer-active="true"] .docara-example-preview__panels{display:flex;flex:1;min-block-size:0;overflow:hidden}
.docara-example-preview[data-docara-example-viewer-active="true"] [data-docara-example-panel="example"].is-active{box-sizing:border-box;display:flex;flex:1;min-inline-size:0;min-block-size:0;align-items:flex-start;justify-content:safe center;overflow:auto;background:var(--sf-surface-0)}
/* At tablet and phone widths the device column stays on surface-0 and the area around it is surface-1, so the contrast marks the simulated width. */
.docara-example-preview[data-docara-example-viewer-active="true"]:is([data-docara-example-viewport="tablet"],[data-docara-example-viewport="mobile"]) [data-docara-example-panel="example"].is-active{background:var(--sf-surface-1)}
.docara-example-preview[data-docara-example-viewer-active="true"] iframe[data-docara-example-frame]{flex:0 0 auto;min-block-size:100%;max-inline-size:none;background:var(--sf-surface-0)}
.docara-step{position:relative;grid-template-columns:var(--sf-d0) minmax(0,1fr);column-gap:var(--sf-space-1);min-block-size:var(--sf-d0);padding-block-end:var(--sf-space-2)}
.docara-step:last-child{padding-block-end:0}
.docara-step:not(:last-child)::after{content:"";position:absolute;inset-block-start:var(--sf-d0);inset-block-end:0;inset-inline-start:calc(var(--sf-c0) - var(--sf-px) / 2);inline-size:1px;background:var(--sf-outline-variant)}
.docara-step-marker{position:relative;z-index:1;box-sizing:border-box;inline-size:var(--sf-d0);block-size:var(--sf-d0);align-self:start;border:1px solid var(--sf-outline);border-radius:50%;background:var(--sf-surface-0);color:var(--sf-on-surface);font-weight:700}
.docara-step[data-step-state="complete"] .docara-step-marker{border-color:var(--sf-primary);background:var(--sf-primary);color:var(--sf-on-primary)}
.docara-step[data-step-state="current"] .docara-step-marker{border:var(--sf-a2) solid var(--sf-primary);background:var(--sf-primary-container);color:var(--sf-on-primary-container)}
.docara-step-content{min-inline-size:0;padding-block-start:var(--sf-space-1\/3)}
.docara-step-content>p{margin:0;color:var(--sf-on-surface-variant)}
.docara-step-content strong{color:var(--sf-on-surface);font-weight:700}
.docara-skip-link:focus-visible,[data-docara-component-details-summary]:focus-visible{outline:var(--sf-focus--width) var(--sf-focus--style) var(--sf-focus--color,Highlight);outline-offset:var(--sf-focus--offset)}
/* The shell changes layout only at SIMAI Framework breakpoints (32, 44, 60, 72, 80rem = sm..xxl), written as the complement of the Framework's own min-width so a width belongs to one side only. Below xl (72rem) the header navigation and the outline rail move into sheets; below lg (60rem) the sidebar does too, because up to that step the grid is capped at the md container and a sidebar would leave the text 352px wide; below md (44rem) the example viewer, which previews desktop and tablet widths, has no room at all. */
@media not all and (min-width:72rem){
  .docara-header-navigation{display:none}
  /* In the open panel the sheet lists the header links as a column, so the horizontal menu with its dropdowns stays out of it. */
  .docara-header .sf-site-header-nav:not(:has(.docara-header-content>:not(.docara-header-navigation))){display:none}
  .docara-docs-layout[data-outline="true"]{grid-template-columns:minmax(var(--sf-f4),var(--sf-f8)) minmax(0,1fr)}
  .docara-docs-layout[data-sidebar="false"],.docara-docs-layout[data-sidebar="false"][data-outline="true"]{grid-template-columns:minmax(0,1fr)}
  .docara-outline-rail{display:none}
  .docara-outline-mobile{display:block}
}
@media not all and (min-width:60rem){
  /* The search button, which opens the Framework sf-search window, keeps only its icon on a narrow header. */
  .docara-search-trigger .sf-button-text-container,.docara-search-trigger .sf-button-shortcut{display:none}
  .docara-docs-layout,.docara-docs-layout[data-outline="true"]{grid-template-columns:minmax(0,1fr)}
  .docara-sidebar{display:none}
  .docara-reading-column{padding:var(--sf-space-2)}
  /* Landing sections and stepped hero padding (lg, xl) tighten to one spacing step on a narrow screen; a hero with padding=2xl keeps its fluid clamp at every width. */
  .docara-landing [data-docara-container]:not(.docara-padding-2xl){padding-block:var(--sf-space-2)}
}
@media not all and (min-width:44rem){
  [data-docara-example-viewer]{display:none!important}
  /* On a phone a log row keeps the time and name on one line and gives the data the full width under them. */
  .docara-example-log__row{grid-template-columns:auto minmax(0,1fr);row-gap:0}
  .docara-example-log__detail{grid-column:1/-1}
}
/* Reduced motion: 0s, not .01ms. A nonzero duration starts a transition on every element, all properties being transitionable by default, and a background effect reading a theme colour through a probe element would get the colour the probe inherits instead. */
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:0s!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.docara-example-preview__indicator,.docara-example-log__indicator{transition:none!important}}

/* Key chips follow the hint text size instead of the browser's smaller monospace default. */
/* Product-owned composition around the Framework icon primitive. */
.docara-icon {
  --docara-icon-color: var(--sf-on-surface);
  --docara-icon-main: var(--sf-on-surface);
  --docara-icon-on-main: var(--sf-surface-0);
  --docara-icon-container: var(--sf-surface-container);
  --docara-icon-on-container: var(--sf-on-surface);
  place-items: center;
  flex: 0 0 auto;
  color: var(--docara-icon-color);
  vertical-align: middle;
}

.docara-icon > .sf-icon { --sf-icon--color: currentColor; }
.docara-icon[data-docara-icon-scheme="primary"] { --docara-icon-color: var(--sf-primary); --docara-icon-main: var(--sf-primary); --docara-icon-on-main: var(--sf-on-primary); --docara-icon-container: var(--sf-primary-container); --docara-icon-on-container: var(--sf-on-primary-container); }
.docara-icon[data-docara-icon-scheme="secondary"] { --docara-icon-color: var(--sf-secondary); --docara-icon-main: var(--sf-secondary); --docara-icon-on-main: var(--sf-on-secondary); --docara-icon-container: var(--sf-secondary-container); --docara-icon-on-container: var(--sf-on-secondary-container); }
.docara-icon[data-docara-icon-scheme="tertiary"] { --docara-icon-color: var(--sf-tertiary); --docara-icon-main: var(--sf-tertiary); --docara-icon-on-main: var(--sf-on-tertiary); --docara-icon-container: var(--sf-tertiary-container); --docara-icon-on-container: var(--sf-on-tertiary-container); }
.docara-icon[data-docara-icon-scheme="info"] { --docara-icon-color: var(--sf-info); --docara-icon-main: var(--sf-info); --docara-icon-on-main: var(--sf-on-info); --docara-icon-container: var(--sf-info-container); --docara-icon-on-container: var(--sf-on-info-container); }
.docara-icon[data-docara-icon-scheme="success"] { --docara-icon-color: var(--sf-success); --docara-icon-main: var(--sf-success); --docara-icon-on-main: var(--sf-on-success); --docara-icon-container: var(--sf-success-container); --docara-icon-on-container: var(--sf-on-success-container); }
.docara-icon[data-docara-icon-scheme="warning"] { --docara-icon-color: var(--sf-warning); --docara-icon-main: var(--sf-warning); --docara-icon-on-main: var(--sf-on-warning); --docara-icon-container: var(--sf-warning-container); --docara-icon-on-container: var(--sf-on-warning-container); }
.docara-icon[data-docara-icon-scheme="danger"] { --docara-icon-color: var(--sf-error); --docara-icon-main: var(--sf-error); --docara-icon-on-main: var(--sf-on-error); --docara-icon-container: var(--sf-error-container); --docara-icon-on-container: var(--sf-on-error-container); }
.docara-icon[data-docara-icon-variant="tonal"] { background: var(--docara-icon-container); color: var(--docara-icon-on-container); }
.docara-icon[data-docara-icon-variant="main"] { background: var(--docara-icon-main); color: var(--docara-icon-on-main); }
.docara-icon[data-docara-icon-variant="outline"] { border: 1px solid var(--docara-icon-color); color: var(--docara-icon-color); }
.docara-icon[data-docara-icon-container="square"],
.docara-icon[data-docara-icon-container="circle"] { padding: var(--sf-space-1\/2); }
.docara-icon[data-docara-icon-container="square"] { border-radius: var(--sf-radius--surface); }
.docara-icon[data-docara-icon-container="circle"] { border-radius: 50%; }
.docara-icon[data-docara-icon-size="1/3"]:not([data-docara-icon-container="none"]) { padding: var(--sf-space-1\/4); }
.docara-icon[data-docara-icon-size="1/2"]:not([data-docara-icon-container="none"]) { padding: var(--sf-space-1\/3); }
.docara-icon[data-docara-icon-size="2"]:not([data-docara-icon-container="none"]),
.docara-icon[data-docara-icon-size="3"]:not([data-docara-icon-container="none"]) { padding: var(--sf-space-1); }

/* Breadcrumbs describe location; use the secondary text tone in the docs shell. */
[data-docara-breadcrumbs] .sf-breadcrumbs-item--link .sf-breadcrumbs-item-container {
    --sf-breadcrumbs-item-container--color: var(--sf-on-surface-variant);
}
[data-docara-breadcrumbs] .sf-breadcrumbs-item--link:hover .sf-breadcrumbs-item-container,
[data-docara-breadcrumbs] .sf-breadcrumbs-item--link:focus-visible .sf-breadcrumbs-item-container {
    --sf-breadcrumbs-item-container--color: var(--sf-on-surface);
    text-decoration: underline;
    text-underline-offset: .2em;
}
/* An inline Markdown example keeps a hidden frame of its own for the responsive check: the viewer shows it instead of the inline preview, and the shell loads it only then. */
iframe[data-docara-example-responsive-frame]{display:none}
/* Until the frame has the page's styles, the inline preview covers it. The frame itself stays visible: a browser holds back painting a hidden frame and shows it blank for a moment when it appears. */
[data-docara-example-viewer-active="true"] [data-docara-example-panel]:has(>iframe[data-docara-example-responsive-frame]){position:relative}
[data-docara-example-viewer-active="true"] iframe[data-docara-example-responsive-frame]{display:block}
[data-docara-example-viewer-active="true"] [data-docara-example-panel]:has(>iframe[data-docara-example-responsive-frame]:not([data-docara-example-styled]))>[data-docara-example-inline-preview]{position:absolute;inset:0;z-index:1;overflow:auto;background:var(--sf-surface-0)}
[data-docara-example-viewer-active="true"] [data-docara-example-panel]:has(>iframe[data-docara-example-styled])>[data-docara-example-inline-preview]{display:none}
/* Material icons leave about a sixth of their box as optical margin; the GitHub mark fills its box, so it is drawn at five sixths of the icon size to look as large as the icons beside it. */
.docara-repository-mark{inline-size:calc(var(--sf-text-height-1) * 5 / 6);block-size:calc(var(--sf-text-height-1) * 5 / 6)}
/* The panorama ratio offered by figure, media and embed; the Framework aspect-ratio utility stops at 16/9. */
.docara-aspect-21x9{aspect-ratio:21/9}

/* docara-shell-source: smart/smart/pager/css/pager.min.css */
@layer sf.reset, sf.tokens, sf.base, sf.utilities, sf.components, sf.overrides, sf.states;
@layer sf.components{.sf-pager{--sf-pager--line: var(--sf-text-height-1);--sf-pager--text: var(--sf-text-size-1);--sf-pager--note-line: var(--sf-text-height-1\/2);--sf-pager--note-text: var(--sf-text-size-1\/2);--sf-pager--space-x: var(--sf-ui-1--space-x);--sf-pager--text-space: var(--sf-ui-1--text-space-x);--sf-pager--inset-y: var(--sf-ui-1--space-y);--sf-pager--gap: var(--sf-pager-gap, var(--sf-pager--text-space));--sf-pager--card-background: var(--sf-pager-card-background-color, var(--sf-pager-card-background, var(--sf-surface-card)));--sf-pager--card-border-color: var(--sf-pager-card-border-color, var(--sf-outline-variant));--sf-pager--card-radius: var(--sf-pager-card-radius, var(--sf-radius--ui));--sf-pager--link-color: var(--sf-pager-link-color, var(--sf-primary));--sf-pager--meta-color: var(--sf-pager-meta-color, var(--sf-on-surface-variant));--sf-pager--track-color: var(--sf-pager-track-color, var(--sf-surface-container));--sf-pager--fill-color: var(--sf-pager-fill-color, var(--sf-primary));display:block;box-sizing:border-box;min-width:0;min-inline-size:0;color:var(--sf-on-surface);font-size:var(--sf-pager--text);line-height:var(--sf-pager--line)}.sf-pager--size-half{--sf-pager--line: var(--sf-text-height-1\/2);--sf-pager--text: var(--sf-text-size-1\/2);--sf-pager--note-line: var(--sf-text-height-1\/3);--sf-pager--note-text: var(--sf-text-size-1\/3);--sf-pager--space-x: var(--sf-ui-1\/2--space-x);--sf-pager--text-space: var(--sf-ui-1\/2--text-space-x);--sf-pager--inset-y: var(--sf-ui-1\/2--space-y)}.sf-pager *,.sf-pager *::before,.sf-pager *::after{box-sizing:border-box}.sf-pager .sf-pager-icon{--sf-pager--icon-size: var(--sf-pager--line);--sf-icon--font-size: var(--sf-pager--icon-size);--sf-icon--width: var(--sf-pager--icon-size);--sf-icon--height: var(--sf-pager--icon-size);flex:none}.sf-pager:dir(rtl) .sf-pager-icon:not(.sf-pager-lesson-mark),.sf-pager:dir(rtl) .sf-pager-back .sf-icon,.sf-pager:dir(rtl) .sf-pager-forward .sf-icon,.sf-pager:dir(rtl) .sf-pager-lesson-action .sf-icon{-webkit-transform:scaleX(-1);transform:scaleX(-1)}.sf-pager-title{display:block;min-width:0;min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sf-pager-meta,.sf-pager-place{color:var(--sf-pager--meta-color);font-size:var(--sf-pager--note-text);line-height:var(--sf-pager--note-line)}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-pager-side{text-align:left}@supports not (text-align: start){html:not([dir="rtl"]) .sf-pager-side{text-align:left}}.sf-pager-side:where(:dir(ltr)){text-align:left}_:-ms-input-placeholder, [dir="rtl"] .sf-pager-side{text-align:right}@supports not (text-align: start){[dir="rtl"] .sf-pager-side{text-align:right}}.sf-pager-side:where(:dir(rtl)){text-align:right}.sf-pager-side{margin:0;border:0;background:none;color:var(--sf-pager--link-color);font:inherit;text-align:start;text-decoration:none;cursor:pointer}.sf-pager-side.focus-visible{outline:var(--sf-focus--width) var(--sf-focus--style) var(--sf-focus--color);outline-offset:var(--sf-focus--offset)}.sf-pager-side:focus-visible{outline:var(--sf-focus--width) var(--sf-focus--style) var(--sf-focus--color);outline-offset:var(--sf-focus--offset)}.sf-pager--cards{display:grid;grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);grid-gap:var(--sf-pager--gap);gap:var(--sf-pager--gap)}.sf-pager--cards .sf-pager-side{display:flex;flex-direction:column;align-items:flex-start;min-width:0;min-inline-size:0;padding-top:var(--sf-pager--inset-y);padding-bottom:var(--sf-pager--inset-y);padding-block:var(--sf-pager--inset-y);padding-left:var(--sf-pager--space-x);padding-right:var(--sf-pager--space-x);padding-inline:var(--sf-pager--space-x);border:var(--sf-px) solid var(--sf-pager--card-border-color);border-radius:var(--sf-pager--card-radius);background:var(--sf-pager--card-background)}.sf-pager--cards .sf-pager-side:hover{border-color:var(--sf-outline-primary)}.sf-pager--cards .sf-pager-side--prev{grid-column:1}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-pager--cards .sf-pager-side--next{text-align:right}@supports not (text-align: end){html:not([dir="rtl"]) .sf-pager--cards .sf-pager-side--next{text-align:right}}.sf-pager--cards .sf-pager-side--next:where(:dir(ltr)){text-align:right}_:-ms-input-placeholder, [dir="rtl"] .sf-pager--cards .sf-pager-side--next{text-align:left}@supports not (text-align: end){[dir="rtl"] .sf-pager--cards .sf-pager-side--next{text-align:left}}.sf-pager--cards .sf-pager-side--next:where(:dir(rtl)){text-align:left}.sf-pager--cards .sf-pager-side--next{grid-column:2;align-items:flex-end;text-align:end}.sf-pager--cards .sf-pager-direction{display:flex;align-items:center;gap:var(--sf-pager--text-space);color:var(--sf-pager--meta-color);font-size:var(--sf-pager--note-text);line-height:var(--sf-pager--note-line)}.sf-pager--cards .sf-pager-direction .sf-pager-icon{--sf-pager--icon-size: var(--sf-pager--note-line);--sf-icon--color: var(--sf-on-surface-variant)}.sf-pager--cards .sf-pager-title{max-width:100%;max-inline-size:100%;font-weight:var(--sf-font-weight-medium)}.sf-pager--row{display:flex;align-items:center;gap:var(--sf-pager--gap);min-height:var(--sf-pager--line);min-block-size:var(--sf-pager--line)}.sf-pager--row .sf-pager-side{display:inline-flex;align-items:center;gap:var(--sf-pager--text-space);max-width:calc(50% - var(--sf-pager--gap)/2);max-inline-size:calc(50% - var(--sf-pager--gap)/2);min-width:0;min-inline-size:0;padding:0}.sf-pager--row .sf-pager-side:hover .sf-pager-title{text-decoration:underline}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-pager--row .sf-pager-side--next{margin-left:auto}@supports not (margin-inline-start: initial){html:not([dir="rtl"]) .sf-pager--row .sf-pager-side--next{margin-left:auto}}.sf-pager--row .sf-pager-side--next:where(:dir(ltr)){margin-left:auto}_:-ms-input-placeholder, [dir="rtl"] .sf-pager--row .sf-pager-side--next{margin-right:auto}@supports not (margin-inline-start: initial){[dir="rtl"] .sf-pager--row .sf-pager-side--next{margin-right:auto}}.sf-pager--row .sf-pager-side--next:where(:dir(rtl)){margin-right:auto}.sf-pager--row .sf-pager-side--next{-webkit-margin-start:auto;margin-inline-start:auto}.sf-pager--row .sf-pager-icon{--sf-icon--color: var(--sf-on-surface-variant)}.sf-pager--steps{display:flex;align-items:center;gap:var(--sf-pager--gap)}.sf-pager-middle{display:flex;flex:1 1 0;flex-direction:column;align-items:center;gap:var(--sf-a4);min-width:0;min-inline-size:0}.sf-pager--steps .sf-pager-place{max-width:100%;max-inline-size:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sf-pager-track{display:flex;gap:var(--sf-a4);width:100%;inline-size:100%}.sf-pager-segment{flex:1 1 0;height:var(--sf-a4);block-size:var(--sf-a4);border-radius:var(--sf-a2);background:var(--sf-pager--track-color)}.sf-pager-segment--done{background:var(--sf-pager--fill-color)}.sf-pager--course{display:flex;flex-direction:column;gap:var(--sf-pager--gap)}.sf-pager-progress{display:flex;align-items:center;gap:var(--sf-pager--text-space);min-height:var(--sf-pager--note-line);min-block-size:var(--sf-pager--note-line)}.sf-pager-dots{display:flex;flex:none;align-items:center;gap:var(--sf-a4)}.sf-pager-dot{width:var(--sf-a8);inline-size:var(--sf-a8);height:var(--sf-a8);block-size:var(--sf-a8);border-radius:50%;background:var(--sf-pager--track-color)}.sf-pager-dot--done{background:var(--sf-pager--fill-color)}.sf-pager-dot--current{border:var(--sf-a2) solid var(--sf-pager--fill-color);background:var(--sf-surface-place)}.sf-pager-lesson{display:flex;align-items:center;gap:var(--sf-pager--text-space);padding-top:var(--sf-pager--inset-y);padding-bottom:var(--sf-pager--inset-y);padding-block:var(--sf-pager--inset-y);padding-left:var(--sf-pager--space-x);padding-right:var(--sf-pager--space-x);padding-inline:var(--sf-pager--space-x);border:var(--sf-px) solid var(--sf-pager--card-border-color);border-radius:var(--sf-pager--card-radius);background:var(--sf-pager--card-background)}.sf-pager-lesson-number{display:inline-flex;flex:none;align-items:center;justify-content:center;width:var(--sf-pager--line);inline-size:var(--sf-pager--line);height:var(--sf-pager--line);block-size:var(--sf-pager--line);border-radius:50%;background:var(--sf-primary-container);color:var(--sf-on-primary-container);font-size:var(--sf-pager--note-text);font-weight:var(--sf-font-weight-medium);line-height:1}.sf-pager-lesson-text{display:flex;flex:1 1 0;flex-direction:column;min-width:0;min-inline-size:0}.sf-pager-lesson .sf-pager-meta{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sf-pager-lesson .sf-pager-title{font-weight:var(--sf-font-weight-medium)}.sf-pager-lesson-action{flex:none}.sf-pager--counter{display:inline-flex;align-items:center;gap:var(--sf-pager--gap)}.sf-pager--counter .sf-icon{contain:layout}.sf-pager--counter .sf-pager-place{min-width:7ch;min-inline-size:7ch;color:var(--sf-on-surface);font-size:var(--sf-pager--text);line-height:var(--sf-pager--line);-webkit-font-feature-settings:"tnum";font-feature-settings:"tnum";font-variant-numeric:tabular-nums;text-align:center;white-space:nowrap}@media(prefers-reduced-motion: no-preference){.sf-pager--cards .sf-pager-side{transition:border-color var(--sf-duration-fast) var(--sf-animation)}.sf-pager-segment,.sf-pager-dot{transition:background-color var(--sf-duration-fast) var(--sf-animation)}}@media(forced-colors: active){.sf-pager-side.focus-visible{outline:var(--sf-focus-outline-width) solid currentColor}.sf-pager-side:focus-visible{outline:var(--sf-focus-outline-width) solid currentColor}.sf-pager-segment--done,.sf-pager-dot--done{background:Highlight}.sf-pager-segment,.sf-pager-dot{border:var(--sf-px) solid CanvasText}}}

/* docara-shell-source: smart/smart/search/css/search.min.css */
@layer sf.reset, sf.tokens, sf.base, sf.utilities, sf.components, sf.overrides, sf.states;
@layer sf.components{.sf-search-portal{--sf-search--inset-block: var(--sf-search-inset-block-start, var(--sf-d6));--sf-search--surface: var(--sf-search-background-color, var(--sf-search-background, var(--sf-surface-popup)));--sf-surface-place: var(--sf-search--surface);--sf-on-surface: light-dark(var(--sf-neutral-10), var(--sf-neutral-90));--sf-on-surface-variant: var(--sf-on-surface-popup-variant);--sf-on-surface-container-variant: light-dark(var(--sf-neutral-35), var(--sf-neutral-85));--sf-surface-state-hover: light-dark(var(--sf-neutral-50--alfa-4), var(--sf-neutral-90--alfa-4));--sf-surface-state-select: light-dark(var(--sf-neutral-50--alfa-8), var(--sf-neutral-90--alfa-8));--sf-surface-state-active: light-dark(var(--sf-neutral-50--alfa-12), var(--sf-neutral-90--alfa-12));--sf-surface-container: light-dark(var(--sf-neutral-50--alfa-16), var(--sf-neutral-90--alfa-16));--sf-surface-container-hover: light-dark(var(--sf-neutral-50--alfa-20), var(--sf-neutral-90--alfa-20));--sf-surface-container-active: light-dark(var(--sf-neutral-50--alfa-24), var(--sf-neutral-90--alfa-24));--sf-outline: light-dark(var(--sf-neutral-50--alfa-80), var(--sf-neutral-90--alfa-48));--sf-outline-variant: light-dark(var(--sf-neutral-50--alfa-24), var(--sf-neutral-90--alfa-24));--sf-surface-disabled: light-dark(var(--sf-neutral-50--alfa-12), var(--sf-neutral-90--alfa-12));--sf-on-surface-disabled: light-dark(var(--sf-neutral-50--alfa-80), var(--sf-neutral-90--alfa-48));--sf-disable: var(--sf-surface-disabled);--sf-on-disable: var(--sf-on-surface-disabled);--sf-on-surface-container--variant: var(--sf-on-surface-container-variant);--sf-surface-transparent-active: var(--sf-surface-state-active);--sf-surface-transparent-hover: var(--sf-surface-state-hover);--sf-surface-transparent-select: var(--sf-surface-state-select);--sf-search--radius: var(--sf-search-radius, var(--sf-radius-2));--sf-search--pad: var(--sf-space-1\/4);--sf-search--row-pad: var(--sf-space-1\/2);--sf-search--row-gap: var(--sf-space-1\/2);--sf-search--square: var(--sf-ui-1\/2--control-height);--sf-search--field-glyph: var(--sf-icon-size-3);--sf-search--row-glyph: var(--sf-icon-size-2);--sf-search--axis: calc(var(--sf-search--pad) + var(--sf-search--row-pad));--sf-search--text-start: calc(var(--sf-search--axis) + var(--sf-search--square) + var(--sf-search--row-gap));position:fixed;top:0;right:0;bottom:0;left:0;inset:0;display:block;color:var(--sf-on-surface)}.sf-search-portal--contained{position:absolute}.sf-search-scrim{position:absolute;top:0;right:0;bottom:0;left:0;inset:0;background:var(--sf-black--alfa-64);background:var(--sf-search-scrim-color, var(--sf-scrim-color, var(--sf-black--alfa-64)))}.sf-search-window{position:absolute;top:var(--sf-search--inset-block);inset-block-start:var(--sf-search--inset-block);left:0;right:0;inset-inline:0;display:flex;flex-direction:column;gap:var(--sf-space-1\/3);box-sizing:border-box;width:min(var(--sf-g8),100% - 2*var(--sf-space-2));inline-size:min(var(--sf-g8),100% - 2*var(--sf-space-2));width:min(var(--sf-g8),100% - 2*var(--sf-space-2));width:min(var(--sf-search-inline-size, var(--sf-g8)),100% - 2*var(--sf-space-2));inline-size:min(var(--sf-search-inline-size, var(--sf-g8)),100% - 2*var(--sf-space-2));max-height:calc(100% - 2*var(--sf-search--inset-block));max-block-size:calc(100% - 2*var(--sf-search--inset-block));margin-left:auto;margin-right:auto;margin-inline:auto}@media(prefers-reduced-motion: no-preference){.sf-search-window{-webkit-animation:sf-search-enter var(--sf-duration-fast) var(--sf-ease-enter);animation:sf-search-enter var(--sf-duration-fast) var(--sf-ease-enter)}.sf-search-scrim{-webkit-animation:sf-search-fade var(--sf-duration-fast) var(--sf-ease-enter);animation:sf-search-fade var(--sf-duration-fast) var(--sf-ease-enter)}}@-webkit-keyframes sf-search-enter{from{opacity:0;translate:0 calc(-1*var(--sf-space-1\/3))}}@keyframes sf-search-enter{from{opacity:0;translate:0 calc(-1*var(--sf-space-1\/3))}}@-webkit-keyframes sf-search-fade{from{opacity:0}}@keyframes sf-search-fade{from{opacity:0}}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-search-field{padding-left:calc(var(--sf-search--axis) + (var(--sf-search--square) - var(--sf-search--field-glyph))/2)}@supports not (padding-inline-start: initial){html:not([dir="rtl"]) .sf-search-field{padding-left:calc(var(--sf-search--axis) + (var(--sf-search--square) - var(--sf-search--field-glyph))/2)}}.sf-search-field:where(:dir(ltr)){padding-left:calc(var(--sf-search--axis) + (var(--sf-search--square) - var(--sf-search--field-glyph))/2)}_:-ms-input-placeholder, [dir="rtl"] .sf-search-field{padding-right:calc(var(--sf-search--axis) + (var(--sf-search--square) - var(--sf-search--field-glyph))/2)}@supports not (padding-inline-start: initial){[dir="rtl"] .sf-search-field{padding-right:calc(var(--sf-search--axis) + (var(--sf-search--square) - var(--sf-search--field-glyph))/2)}}.sf-search-field:where(:dir(rtl)){padding-right:calc(var(--sf-search--axis) + (var(--sf-search--square) - var(--sf-search--field-glyph))/2)}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-search-field{padding-right:calc(var(--sf-search--axis) + var(--sf-search--row-glyph)/2 - var(--sf-ui-1\/2--control-height)/2)}@supports not (padding-inline-end: initial){html:not([dir="rtl"]) .sf-search-field{padding-right:calc(var(--sf-search--axis) + var(--sf-search--row-glyph)/2 - var(--sf-ui-1\/2--control-height)/2)}}.sf-search-field:where(:dir(ltr)){padding-right:calc(var(--sf-search--axis) + var(--sf-search--row-glyph)/2 - var(--sf-ui-1\/2--control-height)/2)}_:-ms-input-placeholder, [dir="rtl"] .sf-search-field{padding-left:calc(var(--sf-search--axis) + var(--sf-search--row-glyph)/2 - var(--sf-ui-1\/2--control-height)/2)}@supports not (padding-inline-end: initial){[dir="rtl"] .sf-search-field{padding-left:calc(var(--sf-search--axis) + var(--sf-search--row-glyph)/2 - var(--sf-ui-1\/2--control-height)/2)}}.sf-search-field:where(:dir(rtl)){padding-left:calc(var(--sf-search--axis) + var(--sf-search--row-glyph)/2 - var(--sf-ui-1\/2--control-height)/2)}.sf-search-field{display:flex;flex:none;align-items:center;box-sizing:border-box;height:var(--sf-ui-2--control-height);block-size:var(--sf-ui-2--control-height);-webkit-padding-start:calc(var(--sf-search--axis) + (var(--sf-search--square) - var(--sf-search--field-glyph))/2);padding-inline-start:calc(var(--sf-search--axis) + (var(--sf-search--square) - var(--sf-search--field-glyph))/2);-webkit-padding-end:calc(var(--sf-search--axis) + var(--sf-search--row-glyph)/2 - var(--sf-ui-1\/2--control-height)/2);padding-inline-end:calc(var(--sf-search--axis) + var(--sf-search--row-glyph)/2 - var(--sf-ui-1\/2--control-height)/2);border-radius:var(--sf-radius-rounded);background:var(--sf-search--surface);box-shadow:var(--sf-shadow-overlay);--sf-on-surface-variant: var(--sf-on-surface-popup-variant)}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-search-glyph{margin-right:calc(var(--sf-search--text-start) - var(--sf-search--axis) - (var(--sf-search--square) + var(--sf-search--field-glyph))/2)}@supports not (margin-inline-end: initial){html:not([dir="rtl"]) .sf-search-glyph{margin-right:calc(var(--sf-search--text-start) - var(--sf-search--axis) - (var(--sf-search--square) + var(--sf-search--field-glyph))/2)}}.sf-search-glyph:where(:dir(ltr)){margin-right:calc(var(--sf-search--text-start) - var(--sf-search--axis) - (var(--sf-search--square) + var(--sf-search--field-glyph))/2)}_:-ms-input-placeholder, [dir="rtl"] .sf-search-glyph{margin-left:calc(var(--sf-search--text-start) - var(--sf-search--axis) - (var(--sf-search--square) + var(--sf-search--field-glyph))/2)}@supports not (margin-inline-end: initial){[dir="rtl"] .sf-search-glyph{margin-left:calc(var(--sf-search--text-start) - var(--sf-search--axis) - (var(--sf-search--square) + var(--sf-search--field-glyph))/2)}}.sf-search-glyph:where(:dir(rtl)){margin-left:calc(var(--sf-search--text-start) - var(--sf-search--axis) - (var(--sf-search--square) + var(--sf-search--field-glyph))/2)}.sf-search-glyph{display:inline-flex;--sf-icon--font-size: var(--sf-search--field-glyph);--sf-icon--width: var(--sf-search--field-glyph);--sf-icon--height: var(--sf-search--field-glyph);--sf-icon--color: var(--sf-on-surface-variant);flex:none;-webkit-margin-end:calc(var(--sf-search--text-start) - var(--sf-search--axis) - (var(--sf-search--square) + var(--sf-search--field-glyph))/2);margin-inline-end:calc(var(--sf-search--text-start) - var(--sf-search--axis) - (var(--sf-search--square) + var(--sf-search--field-glyph))/2)}.sf-search-back>button{display:none}.sf-search-input{flex:1 1 auto;min-width:0;min-inline-size:0;height:100%;block-size:100%;margin:0;padding:0;border:0;background:rgba(0,0,0,0);color:var(--sf-on-surface);font:inherit;font-size:var(--sf-text-size-2);line-height:var(--sf-text-height-2);outline:none}.sf-search-input::-webkit-input-placeholder{color:var(--sf-on-surface-variant);opacity:1}.sf-search-input::-moz-placeholder{color:var(--sf-on-surface-variant);opacity:1}.sf-search-input:-ms-input-placeholder{color:var(--sf-on-surface-variant);opacity:1}.sf-search-input::-ms-input-placeholder{color:var(--sf-on-surface-variant);opacity:1}.sf-search-input::placeholder{color:var(--sf-on-surface-variant);opacity:1}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-search-clear>button{margin-left:var(--sf-space-1\/3)}@supports not (margin-inline-start: initial){html:not([dir="rtl"]) .sf-search-clear>button{margin-left:var(--sf-space-1\/3)}}.sf-search-clear>button:where(:dir(ltr)){margin-left:var(--sf-space-1\/3)}_:-ms-input-placeholder, [dir="rtl"] .sf-search-clear>button{margin-right:var(--sf-space-1\/3)}@supports not (margin-inline-start: initial){[dir="rtl"] .sf-search-clear>button{margin-right:var(--sf-space-1\/3)}}.sf-search-clear>button:where(:dir(rtl)){margin-right:var(--sf-space-1\/3)}.sf-search-clear>button{flex:none;-webkit-margin-start:var(--sf-space-1\/3);margin-inline-start:var(--sf-space-1\/3)}.sf-search-window--pane{width:min(calc(var(--sf-g8) * 1.5),100% - 2*var(--sf-space-2));inline-size:min(calc(var(--sf-g8) * 1.5),100% - 2*var(--sf-space-2));width:min(calc(var(--sf-g8) * 1.5),100% - 2*var(--sf-space-2));width:min(var(--sf-search-inline-size, calc(var(--sf-g8) * 1.5)),100% - 2*var(--sf-space-2));inline-size:min(var(--sf-search-inline-size, calc(var(--sf-g8) * 1.5)),100% - 2*var(--sf-space-2))}.sf-search-card{display:flex;flex:0 1 auto;flex-direction:column;box-sizing:border-box;min-height:0;min-block-size:0;max-height:none;max-block-size:none;max-height:none;max-height:var(--sf-search-list-max-block-size, none);max-block-size:var(--sf-search-list-max-block-size, none);padding:var(--sf-search--pad);overflow:auto;-ms-scroll-chaining:none;overscroll-behavior:contain;border-radius:var(--sf-search--radius);background:var(--sf-search--surface);box-shadow:var(--sf-shadow-overlay);--sf-on-surface-variant: var(--sf-on-surface-popup-variant)}.sf-search-body{display:flex;flex-direction:column}.sf-search-caption{display:flex;align-items:center;justify-content:space-between;gap:var(--sf-space-1\/2);padding-top:var(--sf-space-1\/3);padding-bottom:var(--sf-space-1\/4);padding-block:var(--sf-space-1\/3) var(--sf-space-1\/4);padding-left:var(--sf-search--row-pad);padding-right:var(--sf-search--row-pad);padding-inline:var(--sf-search--row-pad);color:var(--sf-on-surface-variant);font-size:var(--sf-text-size-1\/3);line-height:var(--sf-text-height-1\/3)}.sf-search-caption-action{margin:0;padding:0;border:0;background:rgba(0,0,0,0);color:var(--sf-primary);font:inherit;cursor:pointer}.sf-search-caption-action:hover{text-decoration:underline}.sf-search-row{display:flex;align-items:center;gap:var(--sf-search--row-gap);box-sizing:border-box;min-height:var(--sf-ui-2--control-height);min-block-size:var(--sf-ui-2--control-height);padding-top:calc((var(--sf-ui-2--control-height) - var(--sf-text-height-1) - var(--sf-text-height-1\/3))/2);padding-bottom:calc((var(--sf-ui-2--control-height) - var(--sf-text-height-1) - var(--sf-text-height-1\/3))/2);padding-block:calc((var(--sf-ui-2--control-height) - var(--sf-text-height-1) - var(--sf-text-height-1\/3))/2);padding-left:var(--sf-search--row-pad);padding-right:var(--sf-search--row-pad);padding-inline:var(--sf-search--row-pad);border-radius:calc(var(--sf-search--radius) - var(--sf-search--pad));color:var(--sf-on-surface);cursor:pointer}.sf-search-row--single{min-height:var(--sf-ui-1--control-height);min-block-size:var(--sf-ui-1--control-height);padding-top:calc((var(--sf-ui-1--control-height) - var(--sf-search--square))/2);padding-bottom:calc((var(--sf-ui-1--control-height) - var(--sf-search--square))/2);padding-block:calc((var(--sf-ui-1--control-height) - var(--sf-search--square))/2)}.sf-search-row--selected{background:var(--sf-primary-container);color:var(--sf-on-primary-container)}.sf-search-row-icon{display:inline-flex;flex:none;align-items:center;justify-content:center;width:var(--sf-search--square);inline-size:var(--sf-search--square);height:var(--sf-search--square);block-size:var(--sf-search--square);border-radius:var(--sf-radius-1);background:var(--sf-surface-container);--sf-on-surface-variant: var(--sf-on-surface-container--variant);--sf-icon--color: var(--sf-on-surface-variant);--sf-icon--font-size: var(--sf-search--row-glyph);--sf-icon--width: var(--sf-search--row-glyph);--sf-icon--height: var(--sf-search--row-glyph)}.sf-search-row--selected .sf-search-row-icon{background:var(--sf-primary-container);--sf-icon--color: var(--sf-on-primary-container)}.sf-search-row--recent .sf-search-row-icon,.sf-search-row--recent.sf-search-row--selected .sf-search-row-icon{background:rgba(0,0,0,0);--sf-icon--color: var(--sf-on-surface-variant)}.sf-search-row-text{display:flex;flex:1 1 auto;flex-direction:column;min-width:0;min-inline-size:0}.sf-search-row-title,.sf-search-row-path{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sf-search-row-title{font-size:var(--sf-text-size-1);line-height:var(--sf-text-height-1)}.sf-search-row-path{color:var(--sf-on-surface-variant);font-size:var(--sf-text-size-1\/3);line-height:var(--sf-text-height-1\/3)}.sf-search-mark{border-radius:var(--sf-a2);background:var(--sf-primary-container);background:var(--sf-search-mark-color, var(--sf-primary-container));color:inherit}.sf-search-go{--sf-icon--color: var(--sf-on-surface-variant);--sf-icon--font-size: var(--sf-search--row-glyph);--sf-icon--width: var(--sf-search--row-glyph);--sf-icon--height: var(--sf-search--row-glyph);flex:none;visibility:hidden}.sf-search-row--selected .sf-search-go{visibility:visible}.sf-search-remove{display:inline-flex;flex:none;align-items:center;justify-content:center;width:var(--sf-ui-1\/3--control-height);inline-size:var(--sf-ui-1\/3--control-height);height:var(--sf-ui-1\/3--control-height);block-size:var(--sf-ui-1\/3--control-height);margin:0;padding:0;border:0;border-radius:var(--sf-radius--ui);background:rgba(0,0,0,0);cursor:pointer;opacity:0;--sf-icon--color: var(--sf-on-surface-variant);--sf-icon--font-size: var(--sf-icon-size-1);--sf-icon--width: var(--sf-icon-size-1);--sf-icon--height: var(--sf-icon-size-1)}.sf-search-row:hover .sf-search-remove,.sf-search-row--selected .sf-search-remove{opacity:1}.sf-search-remove:hover{background:var(--sf-surface-transparent-active)}.sf-search-scopes,.sf-search-pills{display:flex;flex-wrap:wrap;gap:var(--sf-space-1\/4);padding:var(--sf-space-1\/4) calc(var(--sf-search--row-pad) - var(--sf-space-1\/3))}.sf-search-scopes{flex:none;padding-bottom:var(--sf-space-1\/3);-webkit-padding-after:var(--sf-space-1\/3);padding-block-end:var(--sf-space-1\/3)}.sf-search-pill{display:inline-flex;align-items:center;box-sizing:border-box;min-height:var(--sf-ui-1\/3--control-height);min-block-size:var(--sf-ui-1\/3--control-height);margin:0;padding-top:0;padding-bottom:0;padding-block:0;padding-left:var(--sf-space-1\/3);padding-right:var(--sf-space-1\/3);padding-inline:var(--sf-space-1\/3);border:0;border-radius:var(--sf-radius-rounded);background:var(--sf-surface-container);--sf-on-surface-variant: var(--sf-on-surface-container--variant);color:var(--sf-on-surface-variant);font:inherit;font-size:var(--sf-text-size-1\/2);line-height:var(--sf-text-height-1\/2);cursor:pointer}.sf-search-pill:hover{background:var(--sf-surface-container-hover)}.sf-search-scope{background:rgba(0,0,0,0)}.sf-search-scope:hover{background:var(--sf-surface-transparent-hover)}.sf-search-scope[aria-pressed=true]{background:var(--sf-primary-container);--sf-on-surface-variant: var(--sf-on-primary-container);color:var(--sf-on-primary-container);font-weight:var(--sf-font-weight-medium)}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-search-count{margin-left:var(--sf-space-1\/4)}@supports not (margin-inline-start: initial){html:not([dir="rtl"]) .sf-search-count{margin-left:var(--sf-space-1\/4)}}.sf-search-count:where(:dir(ltr)){margin-left:var(--sf-space-1\/4)}_:-ms-input-placeholder, [dir="rtl"] .sf-search-count{margin-right:var(--sf-space-1\/4)}@supports not (margin-inline-start: initial){[dir="rtl"] .sf-search-count{margin-right:var(--sf-space-1\/4)}}.sf-search-count:where(:dir(rtl)){margin-right:var(--sf-space-1\/4)}.sf-search-count{-webkit-margin-start:var(--sf-space-1\/4);margin-inline-start:var(--sf-space-1\/4);font-size:var(--sf-text-size-1\/3);font-weight:var(--sf-font-weight-regular)}.sf-search-scope[aria-pressed=true] .sf-search-count{color:var(--sf-on-surface-variant)}.sf-search-notice{padding:var(--sf-space-1\/3) var(--sf-search--row-pad);color:var(--sf-on-surface-variant);font-size:var(--sf-text-size-1);line-height:var(--sf-text-height-1)}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-search-correction{text-align:left}@supports not (text-align: start){html:not([dir="rtl"]) .sf-search-correction{text-align:left}}.sf-search-correction:where(:dir(ltr)){text-align:left}_:-ms-input-placeholder, [dir="rtl"] .sf-search-correction{text-align:right}@supports not (text-align: start){[dir="rtl"] .sf-search-correction{text-align:right}}.sf-search-correction:where(:dir(rtl)){text-align:right}.sf-search-correction{display:flex;align-items:center;gap:var(--sf-space-1\/3);box-sizing:border-box;width:100%;inline-size:100%;padding:var(--sf-space-1\/3) var(--sf-search--row-pad);border:0;border-radius:var(--sf-radius--ui);background:none;color:var(--sf-primary);font:inherit;font-size:var(--sf-text-size-1);line-height:var(--sf-text-height-1);text-align:start;cursor:pointer}.sf-search-correction:hover{background:var(--sf-surface-container-hover)}.sf-search-split{display:grid;grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);grid-gap:var(--sf-search--pad);gap:var(--sf-search--pad);align-items:start}.sf-search-preview{position:sticky;top:0;inset-block-start:0;display:flex;flex-direction:column;gap:var(--sf-space-1\/4);min-width:0;min-inline-size:0;padding:var(--sf-space-1\/2) var(--sf-search--row-pad);word-wrap:anywhere}.sf-search-preview-path{color:var(--sf-on-surface-variant);font-size:var(--sf-text-size-1);line-height:var(--sf-text-height-1)}.sf-search-preview-title{font-weight:var(--sf-font-weight-medium)}.sf-search-preview-text{margin:0;color:var(--sf-on-surface-variant)}.sf-search-message{padding:var(--sf-space-2) var(--sf-search--row-pad);color:var(--sf-on-surface-variant);font-size:var(--sf-text-size-1);line-height:var(--sf-text-height-1);text-align:center}.sf-search-message+.sf-search-pills{justify-content:center;padding-bottom:var(--sf-space-1\/2);-webkit-padding-after:var(--sf-space-1\/2);padding-block-end:var(--sf-space-1\/2)}.sf-search-keys{display:flex;flex:none;flex-wrap:wrap;gap:var(--sf-space-1\/4) var(--sf-space-1);margin-top:var(--sf-search--pad);-webkit-margin-before:var(--sf-search--pad);margin-block-start:var(--sf-search--pad);padding:var(--sf-space-1\/3) var(--sf-search--row-pad) var(--sf-space-1\/4);border-top:var(--sf-px) solid var(--sf-outline-variant);-webkit-border-before:var(--sf-px) solid var(--sf-outline-variant);border-block-start:var(--sf-px) solid var(--sf-outline-variant);color:var(--sf-on-surface-variant);font-size:var(--sf-text-size-1\/3);line-height:var(--sf-text-height-1\/3)}.sf-search-key{display:inline-flex;align-items:center;gap:var(--sf-space-1\/4)}.sf-search-pill.focus-visible,.sf-search-caption-action.focus-visible,.sf-search-remove.focus-visible{outline:var(--sf-focus--width) var(--sf-focus--style) var(--sf-focus--color);outline-offset:var(--sf-focus--offset)}.sf-search-pill:focus-visible,.sf-search-caption-action:focus-visible,.sf-search-remove:focus-visible{outline:var(--sf-focus--width) var(--sf-focus--style) var(--sf-focus--color);outline-offset:var(--sf-focus--offset)}@media not all and (min-width: 32rem){.sf-search-window{top:0;right:0;bottom:0;left:0;inset:0;width:auto;inline-size:auto;max-height:none;max-block-size:none;gap:0;background:var(--sf-search--surface);--sf-on-surface-variant: var(--sf-on-surface-popup-variant)}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-search-field{padding-left:calc(var(--sf-search--axis) + var(--sf-search--square)/2 - var(--sf-ui-1\/2--control-height)/2)}@supports not (padding-inline-start: initial){html:not([dir="rtl"]) .sf-search-field{padding-left:calc(var(--sf-search--axis) + var(--sf-search--square)/2 - var(--sf-ui-1\/2--control-height)/2)}}.sf-search-field:where(:dir(ltr)){padding-left:calc(var(--sf-search--axis) + var(--sf-search--square)/2 - var(--sf-ui-1\/2--control-height)/2)}_:-ms-input-placeholder, [dir="rtl"] .sf-search-field{padding-right:calc(var(--sf-search--axis) + var(--sf-search--square)/2 - var(--sf-ui-1\/2--control-height)/2)}@supports not (padding-inline-start: initial){[dir="rtl"] .sf-search-field{padding-right:calc(var(--sf-search--axis) + var(--sf-search--square)/2 - var(--sf-ui-1\/2--control-height)/2)}}.sf-search-field:where(:dir(rtl)){padding-right:calc(var(--sf-search--axis) + var(--sf-search--square)/2 - var(--sf-ui-1\/2--control-height)/2)}.sf-search-field{-webkit-padding-start:calc(var(--sf-search--axis) + var(--sf-search--square)/2 - var(--sf-ui-1\/2--control-height)/2);padding-inline-start:calc(var(--sf-search--axis) + var(--sf-search--square)/2 - var(--sf-ui-1\/2--control-height)/2);border-radius:0;box-shadow:none;border-bottom:var(--sf-px) solid var(--sf-outline-variant);-webkit-border-after:var(--sf-px) solid var(--sf-outline-variant);border-block-end:var(--sf-px) solid var(--sf-outline-variant)}_:-ms-input-placeholder, html:not([dir="rtl"]) .sf-search-back>button{margin-right:calc(var(--sf-search--text-start) - var(--sf-search--axis) - (var(--sf-search--square) + var(--sf-ui-1\/2--control-height))/2)}@supports not (margin-inline-end: initial){html:not([dir="rtl"]) .sf-search-back>button{margin-right:calc(var(--sf-search--text-start) - var(--sf-search--axis) - (var(--sf-search--square) + var(--sf-ui-1\/2--control-height))/2)}}.sf-search-back>button:where(:dir(ltr)){margin-right:calc(var(--sf-search--text-start) - var(--sf-search--axis) - (var(--sf-search--square) + var(--sf-ui-1\/2--control-height))/2)}_:-ms-input-placeholder, [dir="rtl"] .sf-search-back>button{margin-left:calc(var(--sf-search--text-start) - var(--sf-search--axis) - (var(--sf-search--square) + var(--sf-ui-1\/2--control-height))/2)}@supports not (margin-inline-end: initial){[dir="rtl"] .sf-search-back>button{margin-left:calc(var(--sf-search--text-start) - var(--sf-search--axis) - (var(--sf-search--square) + var(--sf-ui-1\/2--control-height))/2)}}.sf-search-back>button:where(:dir(rtl)){margin-left:calc(var(--sf-search--text-start) - var(--sf-search--axis) - (var(--sf-search--square) + var(--sf-ui-1\/2--control-height))/2)}.sf-search-back>button{display:inline-flex;-webkit-margin-end:calc(var(--sf-search--text-start) - var(--sf-search--axis) - (var(--sf-search--square) + var(--sf-ui-1\/2--control-height))/2);margin-inline-end:calc(var(--sf-search--text-start) - var(--sf-search--axis) - (var(--sf-search--square) + var(--sf-ui-1\/2--control-height))/2)}.sf-search-glyph{display:none}.sf-search-field:not(.sf-search-field--filled) .sf-search-clear>button{visibility:hidden}.sf-search-card{flex:1 1 auto;max-height:none;max-block-size:none;border-radius:0;box-shadow:none}}}