@orioncactuscorp/ui 1.9.2 → 1.11.0

package/README.md

@@ -6,9 +6,12 @@ orioncactus 디자인 시스템의 React 19+ UI package입니다.
 
 - React 19+, React DOM 19+
 - Node 22+
+- 브라우저: `color-mix()`를 지원하는 evergreen 브라우저 — Chrome/Edge 111+, Safari 16.2+, Firefox 113+
 - CSS Modules와 CSS `@layer`를 처리하는 bundler
 - package manager: npm-compatible package manager
 
+공개 계약의 범위와 breaking change 기준은 [Stability Policy](./docs/stability.md)를 참조하세요.
+
 ## 설치
 
 ##### bun
@@ -39,9 +42,10 @@ pnpm add @orioncactuscorp/ui @orioncactuscorp/icons
 
 ## 사용
 
+앱 root에서 `foundations.css`(토큰 + reset)를 한 번 import합니다. 컴포넌트 스타일은 컴포넌트를 import하면 사용한 컴포넌트만 자동으로 함께 로드됩니다.
+
 ```tsx
 import '@orioncactuscorp/ui/foundations.css';
-import '@orioncactuscorp/ui/styles.css';
 import { IconDefault } from '@orioncactuscorp/icons';
 import { Button, IconButton } from '@orioncactuscorp/ui';
 
@@ -57,6 +61,24 @@ export default function Example() {
 }
 ```
 
+- `foundations.css`는 항상 필요합니다. 컴포넌트 CSS에는 토큰 정의가 없어, 이 import를 빠뜨리면 모든 컴포넌트의 색·여백·타이포가 깨집니다.
+- 컴포넌트 CSS 자동 로드는 CSS Modules를 처리하는 번들러(Next.js, Vite 등)를 전제로 합니다. 번들러가 없거나 CSS Modules를 처리하지 못하는 환경에서는 아래 **CSS-only 환경** 절의 `styles.css`를 사용합니다.
+
+## Documentation
+
+이 패키지는 상세 가이드를 `docs/`로 함께 배포합니다. 설치 후 `node_modules/@orioncactuscorp/ui/docs/`에서 설치 버전과 일치하는 문서를 바로 읽을 수 있고, 웹에서는 `https://unpkg.com/@orioncactuscorp/ui/docs/<파일명>`으로 볼 수 있습니다.
+
+| 문서                                                                     | 내용                                                                     |
+| ------------------------------------------------------------------------ | ------------------------------------------------------------------------ |
+| [Selector Contract](./docs/selector-contract.md)                         | `data-oc-*` 기반 커스터마이즈 계약 — 컴포넌트별 selector/slot/state 표   |
+| [SCSS Helpers](./docs/scss-helpers.md)                                   | `oc-border`, `oc-radius`, `oc-alpha`, `typo`, `respond-to`, `fluidClamp` |
+| [Semantic Motion](./docs/motion.md)                                      | intent/phase/pace 기반 motion 계약과 reduced-motion 정책                 |
+| [Spring Motion](./docs/spring.md)                                        | iOS perceptual duration 기반 spring transition                           |
+| [Responsive Foundation Profile](./docs/responsive-foundation-profile.md) | typo/space responsive 출력 mode 컴파일 설정                              |
+| [Token Reference](./docs/tokens.md)                                      | `--oc-*` foundation 토큰 전체 목록                                       |
+| [Stability Policy](./docs/stability.md)                                  | 공개 계약 범위, SemVer 기준, deprecation 절차                            |
+| [Editor Setup](./docs/editor-setup.md)                                   | VS Code CSS 변수 자동완성 설정                                           |
+
 ## Components
 
 - `SectionHeader`
@@ -67,29 +89,54 @@ export default function Example() {
 - `Field`, `FieldLabel`, `FieldControl`, `FieldMessage`, `FieldErrorMessage` (`vertical`/`horizontal` orientation)
 - `Fieldset`, `FieldLegend`, `FieldsetContent`, `FieldGroup`
 - `Checkbox`, `Radio`, `Switch`
+  - 단순 상태 관리에는 `onCheckedChange(checked)`, form 통합에는 native `onChange`를 사용하세요 (발화 순서: `onChange` → `onCheckedChange`). `CheckMark` 동일.
 - `TextInput`, `TextInputContent`
 - `TextArea`, `TextAreaContent`
 - `Select`, `SelectContent`
 - `MenuRoot`, `MenuTrigger`, `MenuContent`, `MenuItem`, `MenuSeparator`
 - `Alert`, `AlertRoot`, `AlertContent`, `AlertHeading`, `AlertDescription`, `AlertActionArea`, `AlertAction`
 - `Accordion`, `AccordionItem`, `AccordionSummary`, `AccordionDetails`, `AccordionDescription`, `AccordionContent`
+- `TabsRoot`, `TabsList`, `TabsTab`, `TabsPanel`
 - `Modal`, `ModalRoot`, `ModalTrigger`, `ModalContent`, `ModalHeader`, `ModalNavigationSection`, `ModalBody`, `ModalFooter`, `ModalClose`
 - `TooltipProvider`, `TooltipRoot`, `TooltipTrigger`, `TooltipContent`
 - `ScrollArea`, `ScrollAreaContainer`
 - `SvgIcon`, `Interaction`
 
+## Customization
+
+컴포넌트 커스터마이즈는 CSS Module 해시가 아니라 안정 data attribute와 component contract 변수를 사용합니다.
+
+- `[data-oc-component='<name>']` — 컴포넌트 루트
+- `[data-oc-part='<slot>']` — 안정 내부 slot
+- `[data-oc-variant]`, `[data-oc-size]`, `[data-oc-state]` 등 — 시각/상태 selector
+- `--oc-{component}-*` — component contract 변수 override
+
+```css
+[data-oc-component='cell-item'][data-oc-interactive='true']
+  [data-oc-part='label'] {
+  font-weight: 600;
+}
+```
+
+이 selector들은 버전 관리되는 계약입니다. 컴포넌트별 전체 표는 [Selector Contract](./docs/selector-contract.md)를 참조하세요.
+
 ## Exports
 
-- `@orioncactuscorp/ui`
-- `@orioncactuscorp/ui/foundations.css`
-- `@orioncactuscorp/ui/reset.css`
-- `@orioncactuscorp/ui/styles.css`
-- `@orioncactuscorp/ui/scss/*`
-- `@orioncactuscorp/ui/scss/foundations/responsive.config`
-- `@orioncactuscorp/ui/utils/spring`
-- `@orioncactuscorp/ui/utils/motion`
-- `@orioncactuscorp/ui/react/spring`
-- `@orioncactuscorp/ui/react/motion`
+| Subpath                                                  | 내용                                                                                              |
+| -------------------------------------------------------- | ------------------------------------------------------------------------------------------------- |
+| `@orioncactuscorp/ui`                                    | 컴포넌트 root barrel                                                                              |
+| `@orioncactuscorp/ui/foundations.css`                    | foundation 토큰 + reset 번들                                                                      |
+| `@orioncactuscorp/ui/foundations/*.css`                  | foundation별 부분 CSS. `@layer` 래핑과 reset이 없으므로 일반 사용은 `foundations.css` 권장        |
+| `@orioncactuscorp/ui/reset.css`                          | reset 단독 (SCSS source compile 시 사용)                                                          |
+| `@orioncactuscorp/ui/styles.css`                         | 전 컴포넌트 스타일 단일 파일 (파운데이션 내장). CSS Modules 번들러가 없는 환경용 대안             |
+| `@orioncactuscorp/ui/scss/*`                             | SCSS source (foundations, mixins)                                                                 |
+| `@orioncactuscorp/ui/scss/index.scss`                    | SCSS source compile용 통합 entry (foundation CSS를 방출하므로 `foundations.css`와 함께 쓰지 않음) |
+| `@orioncactuscorp/ui/scss/foundations/responsive.config` | responsive 출력 mode 설정                                                                         |
+| `@orioncactuscorp/ui/utils/breakpoints`                  | `getBreakpoint`/`getBreakpoints` — runtime breakpoint 값 조회                                     |
+| `@orioncactuscorp/ui/utils/spring`                       | `ocSpring`, `createSpringAnimator`                                                                |
+| `@orioncactuscorp/ui/utils/motion`                       | motion intent/phase/pace vocabulary와 resolve 유틸                                                |
+| `@orioncactuscorp/ui/react/spring`                       | `useSpringTarget`, `useSpringValue`                                                               |
+| `@orioncactuscorp/ui/react/motion`                       | `MotionExpand`                                                                                    |
 
 ## React Server Components
 
@@ -99,13 +146,25 @@ Client Component에 전달하는 prop은 React Server Components의 serializable
 
 ## Foundation
 
-일반적인 사용은 prebuilt CSS를 앱 root에서 한 번 import합니다.
+일반적인 사용은 prebuilt `foundations.css`(토큰 + reset)를 앱 root에서 한 번 import합니다. 컴포넌트 스타일은 컴포넌트를 import할 때 자동으로 로드되므로 별도 import가 필요 없습니다.
 
 ```tsx
 import '@orioncactuscorp/ui/foundations.css';
+```
+
+### CSS-only 환경 (styles.css)
+
+CSS Modules를 처리하는 번들러가 없는 환경(플레인 `<script type="module">`, CSS만 다루는 파이프라인 등)에서는 전 컴포넌트 스타일을 담은 단일 파일 `styles.css`를 사용합니다.
+
+```tsx
 import '@orioncactuscorp/ui/styles.css';
 ```
 
+- `styles.css`는 파운데이션(토큰 + reset)을 이미 내장합니다. 이 파일을 쓸 때는 `foundations.css`를 함께 import하지 않습니다 — 함께 쓰면 파운데이션이 이중 로드됩니다.
+- 모든 컴포넌트 CSS를 포함하므로 사용하지 않는 컴포넌트 스타일도 로드됩니다(tree-shaking 없음). 번들러 환경에서는 위 컴포넌트 자동 로드 방식을 권장합니다.
+
+### Token Override
+
 브랜드 색처럼 CSS token 값만 바꾸는 경우에는 import 이후 로드되는 CSS에서 필요한 theme selector의 `--oc-*` 값을 override합니다.
 
 ```scss
@@ -116,6 +175,28 @@ import '@orioncactuscorp/ui/styles.css';
 }
 ```
 
+### Theming
+
+prebuilt `foundations.css`의 theme 동작은 다음과 같습니다.
+
+- 기본은 light theme이고, OS가 dark를 선호하면 `prefers-color-scheme: dark`로 자동 전환됩니다.
+- `data-theme='light'` 또는 `data-theme='dark'` attribute를 지정하면 system preference와 무관하게 해당 theme으로 고정됩니다. `<html>`에 지정하면 전체, 하위 요소에 지정하면 해당 서브트리만 적용됩니다.
+- 위 brand override 예시가 `:root`와 두 `[data-theme]` selector를 모두 덮는 이유는 이 세 가지 적용 경로를 전부 커버하기 위해서입니다. theme별로 다른 값이 필요하면 selector를 나눠 지정하세요.
+
+theme 출력 자체를 바꾸려면(예: light 전용 출력, system preference 자동 전환 제거) SCSS foundation source를 compile하면서 `color.config`를 설정합니다.
+
+```scss
+@use '@orioncactuscorp/ui/scss/foundations/color.config' with (
+  $oc-color-themes: (
+    light,
+  ),
+  $oc-color-system-preference: false
+);
+```
+
+- `$oc-color-themes`: 출력할 theme 목록 (`light`, `dark`). 하나만 두면 그 theme이 `:root` 기본값이 됩니다.
+- `$oc-color-system-preference`: `prefers-color-scheme` 자동 전환 media 출력 여부입니다.
+
 Foundation별 커스텀 방식은 아래 기준으로 나눕니다.
 
 | 대상   | 기본 방식                                                 | SCSS source compile 필요 여부                    |
@@ -125,21 +206,29 @@ Foundation별 커스텀 방식은 아래 기준으로 나눕니다.
 | space  | `$oc-space-overrides`                                     | 필요                                             |
 | atomic | radius, width, blur, shadow 같은 `--oc-atomic-*` override | 보통 불필요                                      |
 
-`--oc-typo-size-factor`은 특정 요소나 section 안의 typography를 함께 키우거나 줄일 때 쓰는 runtime multiplier입니다. 예를 들어 article 영역의 읽기 크기를 전반적으로 키워야 할 때 해당 scope에 `--oc-typo-size-factor: 1.1`처럼 지정할 수 있습니다.
+`--oc-typo-size-factor`은 특정 요소나 section 안의 typography를 함께 키우거나 줄일 때 쓰는 runtime multiplier입니다. 예를 들어 article 영역의 읽기 크기를 전반적으로 키워야 할 때 해당 scope에 `--oc-typo-size-factor: 1.1`처럼 지정할 수 있습니다. `html { font-size }` 조정과는 영향 범위가 다릅니다 — root font-size는 rem 기반 typography·spacing·radius 전체를 움직이고, `--oc-typo-size-factor`는 typo mixin이 출력한 font-size/line-height에만 적용됩니다.
 
 `--oc-atomic-radius-factor`는 atomic radius와 radius helper를 거친 component-local radius를 함께 키우거나 줄이는 runtime multiplier입니다. `0`으로 지정하면 `--oc-atomic-radius-max`를 포함한 radius token이 모두 각진 형태가 되며, 기존 `--oc-atomic-radius-*` token 이름은 그대로 유지됩니다.
 
-Typography나 spacing token의 responsive 출력 방식까지 바꿔야 하는 경우에는 `foundations.css` 대신 SCSS foundation source를 직접 compile할 수 있습니다. 이때 `foundations.css`를 대체하므로 reset은 별도로 import합니다.
+### Focus Ring
+
+키보드 포커스(`:focus-visible`) ring은 reset 레이어의 전역 기본값으로 제공됩니다. `button`, `a[href]`, `summary`, `[tabindex]` 요소에 자동 적용되며, ring은 요소의 border-radius를 그대로 따라갑니다. text-entry 컨트롤(input/textarea/select)은 제외되고 Field 계열의 `:focus-within` stroke가 포커스를 표현합니다.
+
+- `--oc-focus-ring-width`, `--oc-focus-ring-offset` — 두께/offset 토큰
+- `--oc-color-theme-focus-ring` — ring 색 (기본: `--oc-color-theme-primary-normal` alias, theme별 override 가능)
+- 컴포넌트/커스텀 요소에 직접 적용할 때는 `@include oc-focus-ring` 믹스인을 사용합니다.
+- opt-out: 전역 규칙은 `:where()`라 specificity 0입니다. 해당 요소에 `outline: none`을 선언하면 덮어집니다 (프로그램 포커스 표면 등).
+
+Typography나 spacing token의 responsive 출력 방식까지 바꿔야 하는 경우에는 `foundations.css` 대신 SCSS foundation source를 직접 compile할 수 있습니다. 이때 `foundations.css`를 대체하므로 reset은 별도로 import합니다. 컴포넌트 스타일은 이 경우에도 컴포넌트를 import할 때 자동으로 로드됩니다.
 
 ```tsx
 import '@orioncactuscorp/ui/reset.css';
 import './styles/foundations.scss';
-import '@orioncactuscorp/ui/styles.css';
 ```
 
 ### SCSS Profile
 
-`responsive.config`는 `typo`와 `space`의 responsive 출력 mode를 정합니다. `$oc-responsive-mode`는 공통으로 적용하고, active stop range는 foundation별로 따로 지정할 수 있습니다. `space`는 stepped mode에서 base/media point별 target stop도 지정할 수 있습니다.
+전체 설정 옵션과 동작은 [Responsive Foundation Profile](./docs/responsive-foundation-profile.md)을 참조하세요. `responsive.config`는 `typo`와 `space`의 responsive 출력 mode를 정합니다. `$oc-responsive-mode`는 공통으로 적용하고, active stop range는 foundation별로 따로 지정할 수 있습니다. `space`는 stepped mode에서 base/media point별 target stop도 지정할 수 있습니다.
 
 `$oc-responsive-mode`는 아래 값을 사용합니다.
 
@@ -206,6 +295,17 @@ SCSS foundation profile은 compile-time 설정입니다. Prebuilt `foundations.c
 
 ## SCSS Helpers
 
+SCSS mixin/function 전체 시그니처와 예시는 [SCSS Helpers 가이드](./docs/scss-helpers.md)를 참조하세요. 아래는 대표 helper 요약입니다.
+
+| Helper                             | 모듈                     | 용도                                                                    |
+| ---------------------------------- | ------------------------ | ----------------------------------------------------------------------- |
+| `oc-border(...)`                   | `scss/mixins/element`    | layout에 영향 없는 box-shadow surface stroke (side/placement 지정 가능) |
+| `oc-radius($radius)`               | `scss/mixins/radius`     | 컴포넌트 로컬 radius를 전역 radius factor에 연결                        |
+| `oc-alpha($color, $opacity)`       | `scss/mixins/color`      | CSS 변수 색상에도 동작하는 `color-mix` 기반 알파                        |
+| `@include typo($variant, $weight)` | `scss/mixins/typo`       | typo 토큰 조합 출력 (`--oc-typo-size-factor` 반영)                      |
+| `@include respond-to(...)`         | `scss/mixins/breakpoint` | breakpoint media query (named/직접 값/구간)                             |
+| `fluidClamp(...)`, `toRem($px)`    | `scss/mixins/utils`      | 커스텀 fluid 값 생성                                                    |
+
 `@orioncactuscorp/ui/scss/mixins/element`는 요소 표면을 구성할 때 쓰는 SCSS helper를 제공합니다.
 
 `oc-border`는 실제 CSS `border` 대신 inset `box-shadow`로 안쪽 border를 그립니다. 요소의 content, padding, layout 크기를 바꾸지 않는 surface stroke가 필요할 때 사용합니다.
@@ -257,7 +357,7 @@ import { IconClose, IconDefault } from '@orioncactuscorp/icons';
 
 ## Motion
 
-Motion은 duration/easing 숫자를 직접 고르는 대신 `feedback`, `fade`, `disclosure`, `surface`, `sheet`, `expand` 같은 intent 기준으로 작성합니다. `oc-motion`은 intent, phase, pace를 기반으로 duration token, spring profile, reduced-motion 정책을 함께 적용합니다.
+intent별 정책과 reduced-motion 동작 전체는 [Semantic Motion 가이드](./docs/motion.md)를 참조하세요. Motion은 duration/easing 숫자를 직접 고르는 대신 `feedback`, `fade`, `disclosure`, `surface`, `sheet`, `expand` 같은 intent 기준으로 작성합니다. `oc-motion`은 intent, phase, pace를 기반으로 duration token, spring profile, reduced-motion 정책을 함께 적용합니다.
 
 ```scss
 @include oc-motion(
@@ -335,7 +435,7 @@ export function Panel({ open, children }) {
 
 ## Spring
 
-SCSS에서는 iOS spring의 perceptual duration 기준으로 low-level transition을 작성할 수 있습니다. helper는 실제 CSS duration을 감쇠 settling duration으로 출력합니다.
+preset·physical spring·고급 옵션 전체는 [Spring Motion 가이드](./docs/spring.md)를 참조하세요. SCSS에서는 iOS spring의 perceptual duration 기준으로 low-level transition을 작성할 수 있습니다. helper는 실제 CSS duration을 감쇠 settling duration으로 출력합니다.
 
 ```scss
 transition: oc-spring($property, $duration, $preset: smooth, $extra-bounce: 0);
@@ -424,42 +524,7 @@ export function Follower() {
 
 ## VS Code CSS Variable Autocomplete
 
-package는 VS Code CSS variable autocomplete 확장이 읽을 수 있는 foundation token index를 함께 배포합니다.
-
-```text
-node_modules/@orioncactuscorp/ui/dist/vscode/oc-ui-vars.css
-```
-
-consumer repository에서 `phoenisx.cssvar` 확장을 사용할 경우 `.vscode/settings.json`에 아래 설정을 추가합니다.
-
-```json
-{
-  "editor.quickSuggestions": {
-    "other": "on",
-    "comments": "off",
-    "strings": "off"
-  },
-  "editor.suggestOnTriggerCharacters": true,
-  "editor.inlineSuggest.suppressSuggestions": false,
-  "cssvar.files": [
-    "./node_modules/@orioncactuscorp/ui/dist/vscode/oc-ui-vars.css"
-  ],
-  "cssvar.ignore": [],
-  "cssvar.extensions": ["css", "scss", "sass", "js", "jsx", "ts", "tsx"]
-}
-```
-
-기존 `cssvar.files`가 있다면 덮어쓰지 말고 위 경로를 추가합니다. 단, oc-ui token 자동완성용으로 `@orioncactuscorp/ui/scss/foundations/*` source file을 fallback처럼 함께 추가하지 않습니다. `color.theme.light.scss`와 `color.theme.dark.scss`는 같은 `--oc-color-theme-*` semantic token 이름을 theme별 값으로 다시 선언하므로, raw source file을 같이 읽으면 completion 후보가 중복됩니다.
-
-oc-ui source repository에서도 `.vscode/settings.json`은 `packages/ui/dist/vscode/oc-ui-vars.css`를 읽습니다. 이 index는 `foundations.css`에서 token 이름만 dedupe해 생성한 자동완성 전용 파일입니다. source checkout에서는 extension의 default CSS scan이나 이전 cache가 compiled CSS를 다시 읽지 않도록 `packages/ui/dist/styles.css`, `packages/ui/dist/foundations.css`, `packages/ui/dist/foundations/**`, `packages/ui/src/scss/foundations/**`를 `cssvar.ignore`에 둡니다. source checkout에서 index 파일이 없다면 `bun run --cwd packages/ui build:css`를 먼저 실행합니다.
-
-`phoenisx.cssvar`의 기본 `cssvar.ignore`는 `**/node_modules/**`를 제외하므로, node_modules 안의 oc-ui index를 읽으려면 `cssvar.ignore`에서 해당 제외를 제거해야 합니다. 위 예시는 oc-ui index만 명시적으로 읽는 설정이므로 빈 배열을 사용합니다.
-
-`phoenisx.cssvar`는 빈 CSS value 위치에서 전체 token 목록을 먼저 띄우지 않습니다. `padding: --`처럼 CSS variable 이름을 직접 입력하거나 `padding: var(--`처럼 `var()` 안에서 `--`를 입력하면 oc-ui token completion이 표시됩니다.
-
-VS Code Insiders 또는 Copilot inline suggestion이 켜진 환경에서 token이 회색 inline suggestion으로만 보이고 completion popup이 열리지 않으면, 위 예시처럼 `editor.quickSuggestions`, `editor.suggestOnTriggerCharacters`, `editor.inlineSuggest.suppressSuggestions`를 함께 설정합니다.
-
-이 파일은 `foundations.css`에서 생성되므로 설치된 `@orioncactuscorp/ui` package 버전의 `--oc-*` foundation token과 자동완성 목록이 함께 움직입니다. 자동완성 전용 index이므로 runtime stylesheet로 import하지 않습니다.
+package는 VS Code CSS variable autocomplete 확장(`phoenisx.cssvar`)이 읽을 수 있는 foundation token index(`dist/vscode/oc-ui-vars.css`)를 함께 배포합니다. 설정 방법과 트러블슈팅은 [Editor Setup](./docs/editor-setup.md)을 참조하세요.
 
 ## 참고
 

package/dist/components/Accordion/Accordion.css

@@ -1 +1 @@
-.oc-Accordion-module__accordion__wD27Q{font-size:calc(var(--oc-typo-size-body1) * var(--oc-typo-size-factor, 1));line-height:calc(var(--oc-typo-height-body1) * var(--oc-typo-size-factor, 1));letter-spacing:var(--oc-typo-spacing-body1);display:flex;flex-direction:column;margin-block:calc(-1 * var(--oc-cell-padding));color:var(--oc-color-theme-label-normal);--oc-cell-padding: var(--oc-space-item-padding-small);--oc-cell-padding-inline: var(--oc-space-item-padding-medium);--oc-cell-gap: .5em;--oc-cell-icon-size: 1.375rem;--oc-cell-disabled-opacity: .28;--oc-cell-interaction-margin-inline: var(--oc-space-item-padding-xsmall);--oc-cell-interaction-radius: var(--oc-atomic-radius-small);--oc-cell-divider-color: var(--oc-color-theme-line-normal-normal);--oc-accordion-current-divider-color: var(--oc-cell-divider-color)}.oc-Accordion-module__item__YNNr-[data-oc-divider=normal]{--oc-accordion-current-divider-color: var(--oc-color-theme-line-normal-normal)}.oc-Accordion-module__item__YNNr-[data-oc-divider=neutral]{--oc-accordion-current-divider-color: var(--oc-color-theme-line-normal-neutral)}.oc-Accordion-module__item__YNNr-[data-oc-divider=alternative]{--oc-accordion-current-divider-color: var(--oc-color-theme-line-normal-alternative)}.oc-Accordion-module__item__YNNr-[data-oc-divider=none]{--oc-accordion-current-divider-color: transparent}.oc-Accordion-module__item__YNNr-+.oc-Accordion-module__item__YNNr-{border-block-start:1px solid var(--oc-accordion-current-divider-color, var(--oc-cell-divider-color));transition:border-color calc(var(--oc-motion-duration-feedback) * var(--oc-motion-duration-factor) * var(--oc-motion-pace-normal) * .5) var(--oc-motion-timing-feedback),transform calc(var(--oc-motion-duration-feedback) * var(--oc-motion-duration-factor) * var(--oc-motion-pace-normal) * 1) var(--oc-motion-timing-feedback)}@media(prefers-reduced-motion:reduce){.oc-Accordion-module__item__YNNr-+.oc-Accordion-module__item__YNNr-{transform:none;transition-property:border-color;transition-duration:calc(var(--oc-motion-duration-feedback) * var(--oc-motion-duration-factor-reduced) * var(--oc-motion-pace-normal) * .5);transition-timing-function:var(--oc-motion-timing-feedback)}}@media(hover:hover){.oc-Accordion-module__item__YNNr-:has(>.oc-Accordion-module__header__AYOT5>.oc-Accordion-module__summary__ORyIA:hover:not(:disabled)){--oc-accordion-current-divider-color: transparent}.oc-Accordion-module__item__YNNr-:has(>.oc-Accordion-module__header__AYOT5>.oc-Accordion-module__summary__ORyIA:hover:not(:disabled)):not([data-oc-state=open])+.oc-Accordion-module__item__YNNr-{--oc-accordion-current-divider-color: transparent}}@media(hover:none){.oc-Accordion-module__item__YNNr-:has(>.oc-Accordion-module__header__AYOT5>.oc-Accordion-module__summary__ORyIA:active:not(:disabled)){--oc-accordion-current-divider-color: transparent}.oc-Accordion-module__item__YNNr-:has(>.oc-Accordion-module__header__AYOT5>.oc-Accordion-module__summary__ORyIA:active:not(:disabled)):not([data-oc-state=open])+.oc-Accordion-module__item__YNNr-{--oc-accordion-current-divider-color: transparent}}.oc-Accordion-module__item__YNNr-[data-oc-disabled=true] .oc-Accordion-module__summary__ORyIA>:where([data-oc-part=leading],[data-oc-part=content],[data-oc-part=trailing]),.oc-Accordion-module__item__YNNr-[data-oc-disabled=true] [data-oc-part=panel-inner]{opacity:var(--oc-cell-disabled-opacity)}.oc-Accordion-module__header__AYOT5{margin:0;font:inherit}.oc-Accordion-module__summary__ORyIA{position:relative;display:flex;align-items:flex-start;gap:var(--oc-cell-gap);padding-block:var(--oc-cell-padding);min-inline-size:0;color:inherit;transform:scale(var(--oc-accordion-summary-press-scale, 1));transition:transform calc(var(--oc-motion-duration-feedback) * var(--oc-motion-duration-factor) * var(--oc-motion-pace-normal) * 1) var(--oc-motion-timing-feedback)}@media(prefers-reduced-motion:reduce){.oc-Accordion-module__summary__ORyIA{transition:none;transform:none}}.oc-Accordion-module__summary__ORyIA{--oc-cell-content-min-block-size: var(--oc-typo-height-body1)}.oc-Accordion-module__summary__ORyIA[data-oc-vertical-align=center]{align-items:center}.oc-Accordion-module__summary__ORyIA[data-oc-fill-width=true]{padding-inline:var(--oc-cell-padding-inline)}.oc-Accordion-module__summary__ORyIA[data-oc-fill-width=true]>[data-oc-component=interaction]{--oc-interaction-inset-x: 0;--oc-interaction-radius: 0}.oc-Accordion-module__summary__ORyIA[data-oc-fill-width=false]>[data-oc-component=interaction]{--oc-interaction-inset-x: calc(-1 * var(--oc-cell-interaction-margin-inline));--oc-interaction-radius: var(--oc-cell-interaction-radius)}.oc-Accordion-module__summary__ORyIA{cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}.oc-Accordion-module__summary__ORyIA:focus-visible{outline:none}.oc-Accordion-module__summary__ORyIA:focus-visible>[data-oc-component=interaction]{opacity:var(--oc-interaction-opacity-focus);transform:scale(1)}@media(hover:hover){.oc-Accordion-module__summary__ORyIA:hover:not(:disabled)>[data-oc-component=interaction]{opacity:var(--oc-interaction-opacity-hover);transform:scale(1)}}.oc-Accordion-module__summary__ORyIA:active:not(:disabled){--oc-accordion-summary-press-scale: max(0, 1 + (.9875 - 1) * var(--oc-motion-scale-factor-feedback))}.oc-Accordion-module__summary__ORyIA:active:not(:disabled)>[data-oc-component=interaction]{opacity:var(--oc-interaction-opacity-active);transform:scale(1)}.oc-Accordion-module__summary__ORyIA[data-oc-disabled=true]{cursor:not-allowed}.oc-Accordion-module__summary__ORyIA[data-oc-disabled=true]>:where([data-oc-part=leading],[data-oc-part=content],[data-oc-part=trailing]){opacity:var(--oc-cell-disabled-opacity)}.oc-Accordion-module__summary__ORyIA[data-oc-disabled=true]>[data-oc-component=interaction]{pointer-events:none}.oc-Accordion-module__summary__ORyIA>[data-oc-component=interaction]{border-radius:var(--oc-interaction-radius)}.oc-Accordion-module__summary__ORyIA>[data-oc-part=leading],.oc-Accordion-module__summary__ORyIA>[data-oc-part=trailing]{position:relative;z-index:2;display:inline-flex;flex:none;align-items:center;min-block-size:var(--oc-cell-content-min-block-size);color:var(--oc-color-theme-label-alternative)}.oc-Accordion-module__summary__ORyIA>[data-oc-part=leading]>[data-oc-component=svg-icon],.oc-Accordion-module__summary__ORyIA>[data-oc-part=trailing]>[data-oc-component=svg-icon]{block-size:var(--oc-cell-icon-size)}.oc-Accordion-module__summary__ORyIA>[data-oc-part=content]{position:relative;z-index:2;display:flex;align-items:center;flex:1;min-block-size:var(--oc-cell-content-min-block-size);min-inline-size:0}.oc-Accordion-module__summary__ORyIA [data-oc-part=text]{display:flex;flex-direction:column;gap:var(--oc-space-item-gap-atom);min-inline-size:0}.oc-Accordion-module__summary__ORyIA [data-oc-part=label],.oc-Accordion-module__summary__ORyIA [data-oc-part=description]{min-inline-size:0}.oc-Accordion-module__summary__ORyIA [data-oc-part=description]{font-size:calc(var(--oc-typo-size-label1) * var(--oc-typo-size-factor, 1));line-height:calc(var(--oc-typo-height-label1) * var(--oc-typo-size-factor, 1));letter-spacing:var(--oc-typo-spacing-label1);color:var(--oc-color-theme-label-alternative)}.oc-Accordion-module__summary__ORyIA>[data-oc-part=trailing]{justify-content:flex-end}.oc-Accordion-module__summary__ORyIA{inline-size:100%;padding-inline:0;border:0;font:inherit;text-align:start;background:transparent}.oc-Accordion-module__summary__ORyIA:disabled{cursor:not-allowed}.oc-Accordion-module__trailing__Gnf84{justify-content:flex-end}.oc-Accordion-module__trailing__Gnf84[data-oc-rotate=true]{transform:rotate(var(--oc-accordion-chevron-rotation, 0deg));transition:transform calc(.561s * var(--oc-motion-duration-factor) * var(--oc-motion-pace-quick) * 1) linear(0 0%,.0045 .83%,.0168 1.67%,.0356 2.5%,.0593 3.33%,.0871 4.17%,.1178 5%,.1507 5.83%,.1852 6.67%,.2207 7.5%,.2566 8.33%,.2926 9.17%,.3283 10%,.3635 10.83%,.398 11.67%,.4316 12.5%,.4642 13.33%,.4957 14.17%,.5259 15%,.5549 15.83%,.5826 16.67%,.609 17.5%,.6341 18.33%,.6579 19.17%,.6805 20%,.7018 20.83%,.722 21.67%,.7409 22.5%,.7588 23.33%,.7756 24.17%,.7913 25%,.8061 25.83%,.8199 26.67%,.8328 27.5%,.8449 28.33%,.8562 29.17%,.8667 30%,.8765 30.83%,.8857 31.67%,.8942 32.5%,.9021 33.33%,.9095 34.17%,.9163 35%,.9227 35.83%,.9286 36.67%,.934 37.5%,.9391 38.33%,.9438 39.17%,.9481 40%,.9522 40.83%,.9559 41.67%,.9594 42.5%,.9625 43.33%,.9655 44.17%,.9682 45%,.9707 45.83%,.9731 46.67%,.9752 47.5%,.9772 48.33%,.979 49.17%,.9807 50%,.9822 50.83%,.9837 51.67%,.985 52.5%,.9862 53.33%,.9873 54.17%,.9883 55%,.9893 55.83%,.9902 56.67%,.991 57.5%,.9917 58.33%,.9924 59.17%,.993 60%,.9936 60.83%,.9941 61.67%,.9946 62.5%,.995 63.33%,.9955 64.17%,.9958 65%,.9962 65.83%,.9965 66.67%,.9968 67.5%,.9971 68.33%,.9973 69.17%,.9975 70%,.9977 70.83%,.9979 71.67%,.9981 72.5%,.9983 73.33%,.9984 74.17%,.9985 75%,.9987 75.83%,.9988 76.67%,.9989 77.5%,.999 78.33%,.9991 79.17%,.9991 80%,.9992 80.83%,.9993 81.67%,.9993 82.5%,.9994 83.33%,.9994 84.17%,.9995 85%,.9995 85.83%,.9996 86.67%,.9996 87.5%,.9996 88.33%,.9997 89.17%,.9997 90%,.9997 90.83%,.9998 91.67%,.9998 92.5%,.9998 93.33%,.9998 94.17%,.9998 95%,.9998 95.83%,.9999 96.67%,.9999 97.5%,.9999 98.33%,.9999 99.17%,1 100%)}@media(prefers-reduced-motion:reduce){.oc-Accordion-module__trailing__Gnf84[data-oc-rotate=true]{transition:none;transform:none}}.oc-Accordion-module__trailing__Gnf84[data-oc-rotate=true]>[data-oc-part=indicator-frame]{display:inline-flex;flex:none;align-items:center;justify-content:center;block-size:var(--oc-cell-content-min-block-size)}@supports (block-size: 1lh){.oc-Accordion-module__trailing__Gnf84[data-oc-rotate=true]>[data-oc-part=indicator-frame]{block-size:1lh}}.oc-Accordion-module__trailing__Gnf84[data-oc-rotate=true] [data-oc-component=svg-icon]{inline-size:auto;block-size:var(--oc-accordion-disclosure-indicator-size, calc(1.5em - var(--oc-accordion-disclosure-indicator-padding-block, .125em) * 2))}@supports (block-size: 1lh){.oc-Accordion-module__trailing__Gnf84[data-oc-rotate=true] [data-oc-component=svg-icon]{block-size:var(--oc-accordion-disclosure-indicator-size, calc(1lh - var(--oc-accordion-disclosure-indicator-padding-block, .125em) * 2))}}@media(prefers-reduced-motion:reduce){.oc-Accordion-module__trailing__Gnf84[data-oc-rotate=true]{transform:rotate(var(--oc-accordion-chevron-rotation, 0deg))}}.oc-Accordion-module__details__x7mjA{min-block-size:0}.oc-Accordion-module__details__x7mjA>[data-oc-part=panel-inner]{opacity:0;transition:opacity calc(.449s * var(--oc-motion-duration-factor) * var(--oc-motion-pace-normal) * 1) linear(0 0%,.0045 .83%,.0169 1.67%,.0356 2.5%,.0594 3.33%,.0871 4.17%,.1179 5%,.1508 5.83%,.1853 6.67%,.2208 7.5%,.2567 8.33%,.2927 9.17%,.3285 10%,.3637 10.83%,.3983 11.67%,.4319 12.5%,.4644 13.33%,.4959 14.17%,.5261 15%,.5551 15.83%,.5828 16.67%,.6092 17.5%,.6343 18.33%,.6582 19.17%,.6807 20%,.7021 20.83%,.7222 21.67%,.7412 22.5%,.759 23.33%,.7758 24.17%,.7915 25%,.8063 25.83%,.8201 26.67%,.833 27.5%,.8451 28.33%,.8564 29.17%,.8669 30%,.8767 30.83%,.8858 31.67%,.8943 32.5%,.9022 33.33%,.9096 34.17%,.9164 35%,.9228 35.83%,.9287 36.67%,.9341 37.5%,.9392 38.33%,.9439 39.17%,.9482 40%,.9523 40.83%,.956 41.67%,.9594 42.5%,.9626 43.33%,.9656 44.17%,.9683 45%,.9708 45.83%,.9731 46.67%,.9753 47.5%,.9772 48.33%,.979 49.17%,.9807 50%,.9823 50.83%,.9837 51.67%,.985 52.5%,.9862 53.33%,.9874 54.17%,.9884 55%,.9893 55.83%,.9902 56.67%,.991 57.5%,.9917 58.33%,.9924 59.17%,.993 60%,.9936 60.83%,.9941 61.67%,.9946 62.5%,.9951 63.33%,.9955 64.17%,.9958 65%,.9962 65.83%,.9965 66.67%,.9968 67.5%,.9971 68.33%,.9973 69.17%,.9975 70%,.9977 70.83%,.9979 71.67%,.9981 72.5%,.9983 73.33%,.9984 74.17%,.9985 75%,.9987 75.83%,.9988 76.67%,.9989 77.5%,.999 78.33%,.9991 79.17%,.9991 80%,.9992 80.83%,.9993 81.67%,.9993 82.5%,.9994 83.33%,.9994 84.17%,.9995 85%,.9995 85.83%,.9996 86.67%,.9996 87.5%,.9996 88.33%,.9997 89.17%,.9997 90%,.9997 90.83%,.9998 91.67%,.9998 92.5%,.9998 93.33%,.9998 94.17%,.9998 95%,.9998 95.83%,.9999 96.67%,.9999 97.5%,.9999 98.33%,.9999 99.17%,1 100%)}@media(prefers-reduced-motion:reduce){.oc-Accordion-module__details__x7mjA>[data-oc-part=panel-inner]{transition-property:opacity;transition-duration:calc(var(--oc-motion-duration-expand-exit) * var(--oc-motion-duration-factor-reduced) * var(--oc-motion-pace-normal) * 1);transition-timing-function:var(--oc-motion-timing-expand-exit)}}.oc-Accordion-module__details__x7mjA[data-oc-motion-state=opening]>[data-oc-part=panel-inner],.oc-Accordion-module__details__x7mjA[data-oc-motion-state=open]>[data-oc-part=panel-inner]{opacity:1;transition:opacity calc(.561s * var(--oc-motion-duration-factor) * var(--oc-motion-pace-normal) * 1) linear(0 0%,.0045 .83%,.0168 1.67%,.0356 2.5%,.0593 3.33%,.0871 4.17%,.1178 5%,.1507 5.83%,.1852 6.67%,.2207 7.5%,.2566 8.33%,.2926 9.17%,.3283 10%,.3635 10.83%,.398 11.67%,.4316 12.5%,.4642 13.33%,.4957 14.17%,.5259 15%,.5549 15.83%,.5826 16.67%,.609 17.5%,.6341 18.33%,.6579 19.17%,.6805 20%,.7018 20.83%,.722 21.67%,.7409 22.5%,.7588 23.33%,.7756 24.17%,.7913 25%,.8061 25.83%,.8199 26.67%,.8328 27.5%,.8449 28.33%,.8562 29.17%,.8667 30%,.8765 30.83%,.8857 31.67%,.8942 32.5%,.9021 33.33%,.9095 34.17%,.9163 35%,.9227 35.83%,.9286 36.67%,.934 37.5%,.9391 38.33%,.9438 39.17%,.9481 40%,.9522 40.83%,.9559 41.67%,.9594 42.5%,.9625 43.33%,.9655 44.17%,.9682 45%,.9707 45.83%,.9731 46.67%,.9752 47.5%,.9772 48.33%,.979 49.17%,.9807 50%,.9822 50.83%,.9837 51.67%,.985 52.5%,.9862 53.33%,.9873 54.17%,.9883 55%,.9893 55.83%,.9902 56.67%,.991 57.5%,.9917 58.33%,.9924 59.17%,.993 60%,.9936 60.83%,.9941 61.67%,.9946 62.5%,.995 63.33%,.9955 64.17%,.9958 65%,.9962 65.83%,.9965 66.67%,.9968 67.5%,.9971 68.33%,.9973 69.17%,.9975 70%,.9977 70.83%,.9979 71.67%,.9981 72.5%,.9983 73.33%,.9984 74.17%,.9985 75%,.9987 75.83%,.9988 76.67%,.9989 77.5%,.999 78.33%,.9991 79.17%,.9991 80%,.9992 80.83%,.9993 81.67%,.9993 82.5%,.9994 83.33%,.9994 84.17%,.9995 85%,.9995 85.83%,.9996 86.67%,.9996 87.5%,.9996 88.33%,.9997 89.17%,.9997 90%,.9997 90.83%,.9998 91.67%,.9998 92.5%,.9998 93.33%,.9998 94.17%,.9998 95%,.9998 95.83%,.9999 96.67%,.9999 97.5%,.9999 98.33%,.9999 99.17%,1 100%)}@media(prefers-reduced-motion:reduce){.oc-Accordion-module__details__x7mjA[data-oc-motion-state=opening]>[data-oc-part=panel-inner],.oc-Accordion-module__details__x7mjA[data-oc-motion-state=open]>[data-oc-part=panel-inner]{transition-property:opacity;transition-duration:calc(var(--oc-motion-duration-expand) * var(--oc-motion-duration-factor-reduced) * var(--oc-motion-pace-normal) * 1);transition-timing-function:var(--oc-motion-timing-expand)}}.oc-Accordion-module__accordion__wD27Q[data-oc-animation=disabled] .oc-Accordion-module__summary__ORyIA,.oc-Accordion-module__accordion__wD27Q[data-oc-animation=disabled] .oc-Accordion-module__trailing__Gnf84,.oc-Accordion-module__accordion__wD27Q[data-oc-animation=disabled] .oc-Accordion-module__details__x7mjA>[data-oc-part=panel-inner]{transition:none}.oc-Accordion-module__panelInner__YQXzI{display:flex;flex-direction:column;gap:var(--oc-space-item-gap-small);min-block-size:0;padding-block:0 var(--oc-cell-padding);padding-inline:0}.oc-Accordion-module__item__YNNr-:has([data-oc-component=accordion-summary][data-oc-fill-width=true]) [data-oc-part=panel-inner]{padding-inline:var(--oc-cell-padding-inline)}.oc-Accordion-module__description__bKdPX{font-size:calc(var(--oc-typo-size-label1) * var(--oc-typo-size-factor, 1));line-height:calc(var(--oc-typo-height-label1) * var(--oc-typo-size-factor, 1));letter-spacing:var(--oc-typo-spacing-label1);margin:0;color:var(--oc-color-theme-label-alternative)}.oc-Accordion-module__content__RyBzl{display:flex;flex-direction:column;gap:var(--oc-space-item-gap-small);min-inline-size:0}.oc-Accordion-module__normal__Fz83W{--oc-cell-divider-color: var(--oc-color-theme-line-normal-normal)}.oc-Accordion-module__neutral__eEyvY{--oc-cell-divider-color: var(--oc-color-theme-line-normal-neutral)}.oc-Accordion-module__alternative__HdOit{--oc-cell-divider-color: var(--oc-color-theme-line-normal-alternative)}.oc-Accordion-module__none__EiLem{--oc-cell-divider-color: transparent}
+.oc-Accordion-module__accordion__wD27Q{font-size:calc(var(--oc-typo-size-body1) * var(--oc-typo-size-factor, 1));line-height:calc(var(--oc-typo-height-body1) * var(--oc-typo-size-factor, 1));letter-spacing:var(--oc-typo-spacing-body1);display:flex;flex-direction:column;margin-block:calc(-1 * var(--oc-cell-padding));color:var(--oc-color-theme-label-normal);--oc-cell-padding: var(--oc-space-item-padding-small);--oc-cell-padding-inline: var(--oc-space-item-padding-medium);--oc-cell-gap: .5em;--oc-cell-icon-size: 1.375rem;--oc-cell-disabled-opacity: .28;--oc-cell-interaction-margin-inline: var(--oc-space-item-padding-xsmall);--oc-cell-interaction-radius: var(--oc-atomic-radius-small);--oc-cell-divider-color: var(--oc-color-theme-line-normal-normal);--oc-accordion-current-divider-color: var(--oc-cell-divider-color)}.oc-Accordion-module__item__YNNr-[data-oc-divider=normal]{--oc-accordion-current-divider-color: var(--oc-color-theme-line-normal-normal)}.oc-Accordion-module__item__YNNr-[data-oc-divider=neutral]{--oc-accordion-current-divider-color: var(--oc-color-theme-line-normal-neutral)}.oc-Accordion-module__item__YNNr-[data-oc-divider=alternative]{--oc-accordion-current-divider-color: var(--oc-color-theme-line-normal-alternative)}.oc-Accordion-module__item__YNNr-[data-oc-divider=none]{--oc-accordion-current-divider-color: transparent}.oc-Accordion-module__item__YNNr-+.oc-Accordion-module__item__YNNr-{border-block-start:1px solid var(--oc-accordion-current-divider-color, var(--oc-cell-divider-color));transition:border-color calc(var(--oc-motion-duration-feedback) * var(--oc-motion-duration-factor) * var(--oc-motion-pace-normal) * .5) var(--oc-motion-timing-feedback),transform calc(var(--oc-motion-duration-feedback) * var(--oc-motion-duration-factor) * var(--oc-motion-pace-normal) * 1) var(--oc-motion-timing-feedback)}@media(prefers-reduced-motion:reduce){.oc-Accordion-module__item__YNNr-+.oc-Accordion-module__item__YNNr-{transform:none;transition-property:border-color;transition-duration:calc(var(--oc-motion-duration-feedback) * var(--oc-motion-duration-factor-reduced) * var(--oc-motion-pace-normal) * .5);transition-timing-function:var(--oc-motion-timing-feedback)}}@media(hover:hover){.oc-Accordion-module__item__YNNr-:has(>.oc-Accordion-module__header__AYOT5>.oc-Accordion-module__summary__ORyIA:hover:not(:disabled)){--oc-accordion-current-divider-color: transparent}.oc-Accordion-module__item__YNNr-:has(>.oc-Accordion-module__header__AYOT5>.oc-Accordion-module__summary__ORyIA:hover:not(:disabled)):not([data-oc-state=open])+.oc-Accordion-module__item__YNNr-{--oc-accordion-current-divider-color: transparent}}@media(hover:none){.oc-Accordion-module__item__YNNr-:has(>.oc-Accordion-module__header__AYOT5>.oc-Accordion-module__summary__ORyIA:active:not(:disabled)){--oc-accordion-current-divider-color: transparent}.oc-Accordion-module__item__YNNr-:has(>.oc-Accordion-module__header__AYOT5>.oc-Accordion-module__summary__ORyIA:active:not(:disabled)):not([data-oc-state=open])+.oc-Accordion-module__item__YNNr-{--oc-accordion-current-divider-color: transparent}}.oc-Accordion-module__item__YNNr-[data-oc-disabled=true] .oc-Accordion-module__summary__ORyIA>:where([data-oc-part=leading],[data-oc-part=content],[data-oc-part=trailing]),.oc-Accordion-module__item__YNNr-[data-oc-disabled=true] [data-oc-part=panel-inner]{opacity:var(--oc-cell-disabled-opacity)}.oc-Accordion-module__header__AYOT5{margin:0;font:inherit}.oc-Accordion-module__summary__ORyIA{position:relative;display:flex;align-items:flex-start;gap:var(--oc-cell-gap);padding-block:var(--oc-cell-padding);min-inline-size:0;color:inherit;transform:scale(var(--oc-accordion-summary-press-scale, 1));transition:transform calc(var(--oc-motion-duration-feedback) * var(--oc-motion-duration-factor) * var(--oc-motion-pace-normal) * 1) var(--oc-motion-timing-feedback)}@media(prefers-reduced-motion:reduce){.oc-Accordion-module__summary__ORyIA{transition:none;transform:none}}.oc-Accordion-module__summary__ORyIA{--oc-cell-content-min-block-size: var(--oc-typo-height-body1)}.oc-Accordion-module__summary__ORyIA[data-oc-vertical-align=center]{align-items:center}.oc-Accordion-module__summary__ORyIA[data-oc-fill-width=true]{padding-inline:var(--oc-cell-padding-inline)}.oc-Accordion-module__summary__ORyIA[data-oc-fill-width=true]>[data-oc-component=interaction]{--oc-interaction-inset-x: 0;--oc-interaction-radius: 0}.oc-Accordion-module__summary__ORyIA[data-oc-fill-width=false]>[data-oc-component=interaction]{--oc-interaction-inset-x: calc(-1 * var(--oc-cell-interaction-margin-inline));--oc-interaction-radius: var(--oc-cell-interaction-radius)}.oc-Accordion-module__summary__ORyIA{cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}.oc-Accordion-module__summary__ORyIA:focus-visible>[data-oc-component=interaction]{opacity:var(--oc-interaction-opacity-focus);transform:scale(1)}@media(hover:hover){.oc-Accordion-module__summary__ORyIA:hover:not(:disabled)>[data-oc-component=interaction]{opacity:var(--oc-interaction-opacity-hover);transform:scale(1)}}.oc-Accordion-module__summary__ORyIA:active:not(:disabled){--oc-accordion-summary-press-scale: max(0, 1 + (.9875 - 1) * var(--oc-motion-scale-factor-feedback))}.oc-Accordion-module__summary__ORyIA:active:not(:disabled)>[data-oc-component=interaction]{opacity:var(--oc-interaction-opacity-active);transform:scale(1)}.oc-Accordion-module__summary__ORyIA[data-oc-disabled=true]{cursor:not-allowed}.oc-Accordion-module__summary__ORyIA[data-oc-disabled=true]>:where([data-oc-part=leading],[data-oc-part=content],[data-oc-part=trailing]){opacity:var(--oc-cell-disabled-opacity)}.oc-Accordion-module__summary__ORyIA[data-oc-disabled=true]>[data-oc-component=interaction]{pointer-events:none}.oc-Accordion-module__summary__ORyIA>[data-oc-component=interaction]{border-radius:var(--oc-interaction-radius)}.oc-Accordion-module__summary__ORyIA>[data-oc-part=leading],.oc-Accordion-module__summary__ORyIA>[data-oc-part=trailing]{position:relative;z-index:2;display:inline-flex;flex:none;align-items:center;min-block-size:var(--oc-cell-content-min-block-size);color:var(--oc-color-theme-label-alternative)}.oc-Accordion-module__summary__ORyIA>[data-oc-part=leading]>[data-oc-component=svg-icon],.oc-Accordion-module__summary__ORyIA>[data-oc-part=trailing]>[data-oc-component=svg-icon]{block-size:var(--oc-cell-icon-size)}.oc-Accordion-module__summary__ORyIA>[data-oc-part=content]{position:relative;z-index:2;display:flex;align-items:center;flex:1;min-block-size:var(--oc-cell-content-min-block-size);min-inline-size:0}.oc-Accordion-module__summary__ORyIA [data-oc-part=text]{display:flex;flex-direction:column;gap:var(--oc-space-item-gap-atom);min-inline-size:0}.oc-Accordion-module__summary__ORyIA [data-oc-part=label],.oc-Accordion-module__summary__ORyIA [data-oc-part=description]{min-inline-size:0}.oc-Accordion-module__summary__ORyIA [data-oc-part=description]{font-size:calc(var(--oc-typo-size-label1) * var(--oc-typo-size-factor, 1));line-height:calc(var(--oc-typo-height-label1) * var(--oc-typo-size-factor, 1));letter-spacing:var(--oc-typo-spacing-label1);color:var(--oc-color-theme-label-alternative)}.oc-Accordion-module__summary__ORyIA>[data-oc-part=trailing]{justify-content:flex-end}.oc-Accordion-module__summary__ORyIA{inline-size:100%;padding-inline:0;border:0;font:inherit;text-align:start;background:transparent}.oc-Accordion-module__summary__ORyIA:disabled{cursor:not-allowed}.oc-Accordion-module__trailing__Gnf84{justify-content:flex-end}.oc-Accordion-module__trailing__Gnf84[data-oc-rotate=true]{transform:rotate(var(--oc-accordion-chevron-rotation, 0deg));transition:transform calc(.561s * var(--oc-motion-duration-factor) * var(--oc-motion-pace-quick) * 1) linear(0 0%,.0045 .83%,.0168 1.67%,.0356 2.5%,.0593 3.33%,.0871 4.17%,.1178 5%,.1507 5.83%,.1852 6.67%,.2207 7.5%,.2566 8.33%,.2926 9.17%,.3283 10%,.3635 10.83%,.398 11.67%,.4316 12.5%,.4642 13.33%,.4957 14.17%,.5259 15%,.5549 15.83%,.5826 16.67%,.609 17.5%,.6341 18.33%,.6579 19.17%,.6805 20%,.7018 20.83%,.722 21.67%,.7409 22.5%,.7588 23.33%,.7756 24.17%,.7913 25%,.8061 25.83%,.8199 26.67%,.8328 27.5%,.8449 28.33%,.8562 29.17%,.8667 30%,.8765 30.83%,.8857 31.67%,.8942 32.5%,.9021 33.33%,.9095 34.17%,.9163 35%,.9227 35.83%,.9286 36.67%,.934 37.5%,.9391 38.33%,.9438 39.17%,.9481 40%,.9522 40.83%,.9559 41.67%,.9594 42.5%,.9625 43.33%,.9655 44.17%,.9682 45%,.9707 45.83%,.9731 46.67%,.9752 47.5%,.9772 48.33%,.979 49.17%,.9807 50%,.9822 50.83%,.9837 51.67%,.985 52.5%,.9862 53.33%,.9873 54.17%,.9883 55%,.9893 55.83%,.9902 56.67%,.991 57.5%,.9917 58.33%,.9924 59.17%,.993 60%,.9936 60.83%,.9941 61.67%,.9946 62.5%,.995 63.33%,.9955 64.17%,.9958 65%,.9962 65.83%,.9965 66.67%,.9968 67.5%,.9971 68.33%,.9973 69.17%,.9975 70%,.9977 70.83%,.9979 71.67%,.9981 72.5%,.9983 73.33%,.9984 74.17%,.9985 75%,.9987 75.83%,.9988 76.67%,.9989 77.5%,.999 78.33%,.9991 79.17%,.9991 80%,.9992 80.83%,.9993 81.67%,.9993 82.5%,.9994 83.33%,.9994 84.17%,.9995 85%,.9995 85.83%,.9996 86.67%,.9996 87.5%,.9996 88.33%,.9997 89.17%,.9997 90%,.9997 90.83%,.9998 91.67%,.9998 92.5%,.9998 93.33%,.9998 94.17%,.9998 95%,.9998 95.83%,.9999 96.67%,.9999 97.5%,.9999 98.33%,.9999 99.17%,1 100%)}@media(prefers-reduced-motion:reduce){.oc-Accordion-module__trailing__Gnf84[data-oc-rotate=true]{transition:none;transform:none}}.oc-Accordion-module__trailing__Gnf84[data-oc-rotate=true]>[data-oc-part=indicator-frame]{display:inline-flex;flex:none;align-items:center;justify-content:center;block-size:var(--oc-cell-content-min-block-size)}@supports (block-size: 1lh){.oc-Accordion-module__trailing__Gnf84[data-oc-rotate=true]>[data-oc-part=indicator-frame]{block-size:1lh}}.oc-Accordion-module__trailing__Gnf84[data-oc-rotate=true] [data-oc-component=svg-icon]{inline-size:auto;block-size:var(--oc-accordion-disclosure-indicator-size, calc(1.5em - var(--oc-accordion-disclosure-indicator-padding-block, .125em) * 2))}@supports (block-size: 1lh){.oc-Accordion-module__trailing__Gnf84[data-oc-rotate=true] [data-oc-component=svg-icon]{block-size:var(--oc-accordion-disclosure-indicator-size, calc(1lh - var(--oc-accordion-disclosure-indicator-padding-block, .125em) * 2))}}@media(prefers-reduced-motion:reduce){.oc-Accordion-module__trailing__Gnf84[data-oc-rotate=true]{transform:rotate(var(--oc-accordion-chevron-rotation, 0deg))}}.oc-Accordion-module__details__x7mjA{min-block-size:0}.oc-Accordion-module__details__x7mjA>[data-oc-part=panel-inner]{opacity:0;transition:opacity calc(.449s * var(--oc-motion-duration-factor) * var(--oc-motion-pace-normal) * 1) linear(0 0%,.0045 .83%,.0169 1.67%,.0356 2.5%,.0594 3.33%,.0871 4.17%,.1179 5%,.1508 5.83%,.1853 6.67%,.2208 7.5%,.2567 8.33%,.2927 9.17%,.3285 10%,.3637 10.83%,.3983 11.67%,.4319 12.5%,.4644 13.33%,.4959 14.17%,.5261 15%,.5551 15.83%,.5828 16.67%,.6092 17.5%,.6343 18.33%,.6582 19.17%,.6807 20%,.7021 20.83%,.7222 21.67%,.7412 22.5%,.759 23.33%,.7758 24.17%,.7915 25%,.8063 25.83%,.8201 26.67%,.833 27.5%,.8451 28.33%,.8564 29.17%,.8669 30%,.8767 30.83%,.8858 31.67%,.8943 32.5%,.9022 33.33%,.9096 34.17%,.9164 35%,.9228 35.83%,.9287 36.67%,.9341 37.5%,.9392 38.33%,.9439 39.17%,.9482 40%,.9523 40.83%,.956 41.67%,.9594 42.5%,.9626 43.33%,.9656 44.17%,.9683 45%,.9708 45.83%,.9731 46.67%,.9753 47.5%,.9772 48.33%,.979 49.17%,.9807 50%,.9823 50.83%,.9837 51.67%,.985 52.5%,.9862 53.33%,.9874 54.17%,.9884 55%,.9893 55.83%,.9902 56.67%,.991 57.5%,.9917 58.33%,.9924 59.17%,.993 60%,.9936 60.83%,.9941 61.67%,.9946 62.5%,.9951 63.33%,.9955 64.17%,.9958 65%,.9962 65.83%,.9965 66.67%,.9968 67.5%,.9971 68.33%,.9973 69.17%,.9975 70%,.9977 70.83%,.9979 71.67%,.9981 72.5%,.9983 73.33%,.9984 74.17%,.9985 75%,.9987 75.83%,.9988 76.67%,.9989 77.5%,.999 78.33%,.9991 79.17%,.9991 80%,.9992 80.83%,.9993 81.67%,.9993 82.5%,.9994 83.33%,.9994 84.17%,.9995 85%,.9995 85.83%,.9996 86.67%,.9996 87.5%,.9996 88.33%,.9997 89.17%,.9997 90%,.9997 90.83%,.9998 91.67%,.9998 92.5%,.9998 93.33%,.9998 94.17%,.9998 95%,.9998 95.83%,.9999 96.67%,.9999 97.5%,.9999 98.33%,.9999 99.17%,1 100%)}@media(prefers-reduced-motion:reduce){.oc-Accordion-module__details__x7mjA>[data-oc-part=panel-inner]{transition-property:opacity;transition-duration:calc(var(--oc-motion-duration-expand-exit) * var(--oc-motion-duration-factor-reduced) * var(--oc-motion-pace-normal) * 1);transition-timing-function:var(--oc-motion-timing-expand-exit)}}.oc-Accordion-module__details__x7mjA[data-oc-motion-state=opening]>[data-oc-part=panel-inner],.oc-Accordion-module__details__x7mjA[data-oc-motion-state=open]>[data-oc-part=panel-inner]{opacity:1;transition:opacity calc(.561s * var(--oc-motion-duration-factor) * var(--oc-motion-pace-normal) * 1) linear(0 0%,.0045 .83%,.0168 1.67%,.0356 2.5%,.0593 3.33%,.0871 4.17%,.1178 5%,.1507 5.83%,.1852 6.67%,.2207 7.5%,.2566 8.33%,.2926 9.17%,.3283 10%,.3635 10.83%,.398 11.67%,.4316 12.5%,.4642 13.33%,.4957 14.17%,.5259 15%,.5549 15.83%,.5826 16.67%,.609 17.5%,.6341 18.33%,.6579 19.17%,.6805 20%,.7018 20.83%,.722 21.67%,.7409 22.5%,.7588 23.33%,.7756 24.17%,.7913 25%,.8061 25.83%,.8199 26.67%,.8328 27.5%,.8449 28.33%,.8562 29.17%,.8667 30%,.8765 30.83%,.8857 31.67%,.8942 32.5%,.9021 33.33%,.9095 34.17%,.9163 35%,.9227 35.83%,.9286 36.67%,.934 37.5%,.9391 38.33%,.9438 39.17%,.9481 40%,.9522 40.83%,.9559 41.67%,.9594 42.5%,.9625 43.33%,.9655 44.17%,.9682 45%,.9707 45.83%,.9731 46.67%,.9752 47.5%,.9772 48.33%,.979 49.17%,.9807 50%,.9822 50.83%,.9837 51.67%,.985 52.5%,.9862 53.33%,.9873 54.17%,.9883 55%,.9893 55.83%,.9902 56.67%,.991 57.5%,.9917 58.33%,.9924 59.17%,.993 60%,.9936 60.83%,.9941 61.67%,.9946 62.5%,.995 63.33%,.9955 64.17%,.9958 65%,.9962 65.83%,.9965 66.67%,.9968 67.5%,.9971 68.33%,.9973 69.17%,.9975 70%,.9977 70.83%,.9979 71.67%,.9981 72.5%,.9983 73.33%,.9984 74.17%,.9985 75%,.9987 75.83%,.9988 76.67%,.9989 77.5%,.999 78.33%,.9991 79.17%,.9991 80%,.9992 80.83%,.9993 81.67%,.9993 82.5%,.9994 83.33%,.9994 84.17%,.9995 85%,.9995 85.83%,.9996 86.67%,.9996 87.5%,.9996 88.33%,.9997 89.17%,.9997 90%,.9997 90.83%,.9998 91.67%,.9998 92.5%,.9998 93.33%,.9998 94.17%,.9998 95%,.9998 95.83%,.9999 96.67%,.9999 97.5%,.9999 98.33%,.9999 99.17%,1 100%)}@media(prefers-reduced-motion:reduce){.oc-Accordion-module__details__x7mjA[data-oc-motion-state=opening]>[data-oc-part=panel-inner],.oc-Accordion-module__details__x7mjA[data-oc-motion-state=open]>[data-oc-part=panel-inner]{transition-property:opacity;transition-duration:calc(var(--oc-motion-duration-expand) * var(--oc-motion-duration-factor-reduced) * var(--oc-motion-pace-normal) * 1);transition-timing-function:var(--oc-motion-timing-expand)}}.oc-Accordion-module__accordion__wD27Q[data-oc-animation=disabled] .oc-Accordion-module__summary__ORyIA,.oc-Accordion-module__accordion__wD27Q[data-oc-animation=disabled] .oc-Accordion-module__trailing__Gnf84,.oc-Accordion-module__accordion__wD27Q[data-oc-animation=disabled] .oc-Accordion-module__details__x7mjA>[data-oc-part=panel-inner]{transition:none}.oc-Accordion-module__panelInner__YQXzI{display:flex;flex-direction:column;gap:var(--oc-space-item-gap-small);min-block-size:0;padding-block:0 var(--oc-cell-padding);padding-inline:0}.oc-Accordion-module__item__YNNr-:has([data-oc-component=accordion-summary][data-oc-fill-width=true]) [data-oc-part=panel-inner]{padding-inline:var(--oc-cell-padding-inline)}.oc-Accordion-module__description__bKdPX{font-size:calc(var(--oc-typo-size-label1) * var(--oc-typo-size-factor, 1));line-height:calc(var(--oc-typo-height-label1) * var(--oc-typo-size-factor, 1));letter-spacing:var(--oc-typo-spacing-label1);margin:0;color:var(--oc-color-theme-label-alternative)}.oc-Accordion-module__content__RyBzl{display:flex;flex-direction:column;gap:var(--oc-space-item-gap-small);min-inline-size:0}.oc-Accordion-module__normal__Fz83W{--oc-cell-divider-color: var(--oc-color-theme-line-normal-normal)}.oc-Accordion-module__neutral__eEyvY{--oc-cell-divider-color: var(--oc-color-theme-line-normal-neutral)}.oc-Accordion-module__alternative__HdOit{--oc-cell-divider-color: var(--oc-color-theme-line-normal-alternative)}.oc-Accordion-module__none__EiLem{--oc-cell-divider-color: transparent}