@font-face { font-family: 'Roobert Mono'; font-weight: 500; src: url('../../fonts/RoobertMono-Medium.ttf') format('truetype'); }
/* CUIAccordion - mirrors cui_accordion.dart. Accent-subtle card, 16px padding, header (eyebrow + title + chevron) is the button.
   Chevron (chevron-left glyph) turns -90deg -> +90deg and the body reveals (size, top-anchored), both 200ms easeOut. Disabled = 0.64 opacity. */
.cui-accordion { -webkit-font-smoothing: auto; box-sizing: border-box; width: 100%; padding: var(--cui-space-md); background: var(--cui-color-surface-bg-accent-subtle); }
.cui-accordion.is-disabled { opacity: .64; }

.cui-accordion__header { appearance: none; border: 0; background: transparent; margin: 0; padding: 0; width: 100%; text-align: left; cursor: pointer;
  display: flex; align-items: center; min-height: 48px; color: inherit; font: inherit; -webkit-tap-highlight-color: transparent; }
.cui-accordion.is-disabled .cui-accordion__header { cursor: default; }
.cui-accordion__header-row { display: flex; align-items: flex-start; width: 100%; gap: var(--cui-space-sm); }
.cui-accordion__heading { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: var(--cui-space-2xs); }
.cui-accordion__eyebrow { font-family: var(--cui-type-code-sm-family); font-size: var(--cui-type-code-sm-size); font-weight: var(--cui-type-code-sm-weight);
  letter-spacing: var(--cui-type-code-sm-spacing); line-height: round(nearest, var(--cui-type-code-sm-line), 1px); color: var(--cui-color-text-subtle); }
.cui-accordion__title { font-family: var(--cui-type-body-md-semi-family); font-size: var(--cui-type-body-md-semi-size); font-weight: var(--cui-type-body-md-semi-weight);
  letter-spacing: var(--cui-type-body-md-semi-spacing); line-height: round(nearest, var(--cui-type-body-md-semi-line), 1px); color: var(--cui-color-text-default); }
.cui-accordion__chevron { flex: none; width: var(--cui-size-icon-sm); height: var(--cui-size-icon-sm); font-size: var(--cui-size-icon-sm);
  color: var(--cui-color-icon-default); transform: rotate(-90deg); transition: transform calc(200ms / var(--cui-speed, 1)) ease-out; }
.cui-accordion__chevron .cui-icon { width: 100%; height: 100%; font-size: inherit; }
.cui-accordion.is-expanded .cui-accordion__chevron { transform: rotate(90deg); }

/* body reveal: grid row 0fr -> 1fr (size transition, top aligned) */
.cui-accordion__panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows calc(200ms / var(--cui-speed, 1)) ease-out; }
.cui-accordion.is-expanded .cui-accordion__panel { grid-template-rows: 1fr; }
.cui-accordion__panel-inner { overflow: hidden; min-height: 0; }
.cui-accordion__body { padding-top: var(--cui-space-sm); display: flex; flex-direction: column; gap: var(--cui-space-sm); }
.cui-accordion__image { height: var(--cui-img-xl); width: 100%; overflow: hidden; }
.cui-accordion__image > * { width: 100%; height: 100%; }
.cui-accordion__description { margin: 0; font-family: var(--cui-type-body-sm-family); font-size: var(--cui-type-body-sm-size); font-weight: var(--cui-type-body-sm-weight);
  letter-spacing: var(--cui-type-body-sm-spacing); line-height: round(nearest, var(--cui-type-body-sm-line), 1px); color: var(--cui-color-text-subtle); }

/* no body: static heading, no tap target, no chevron */
.cui-accordion.is-static .cui-accordion__header-row { width: 100%; }
