@layer reset {
  *, *::before, *::after { box-sizing: border-box; }
  html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
  body, h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd, ol, ul, address { margin: 0; }
  ol[role="list"], ul[role="list"] { list-style: none; padding: 0; }
  img, picture, video, canvas, svg, iframe { display: block; max-inline-size: 100%; }
  img, video { block-size: auto; }
  input, button, textarea, select { font: inherit; color: inherit; letter-spacing: inherit; }
  button { margin: 0; padding: 0; border: 0; background: none; cursor: pointer; text-align: inherit; }
  address { font-style: normal; }
  table { border-collapse: collapse; border-spacing: 0; }
  summary { cursor: pointer; }
  [hidden] { display: none !important; }
}
@layer base {
  html {
    background: var(--surface);
font-synthesis: none;
    scroll-padding-block-start: calc(var(--header-h) + var(--space-4));
    scroll-padding-block-end: calc(var(--action-bar-h) + var(--space-4));
  }
html.has-modal,
  html.has-menu { overflow: hidden; padding-inline-end: var(--scrollbar-gap, 0px); }
body {
    min-block-size: 100svh;
overflow-x: clip;
    background: var(--surface);
    color: var(--fg);
    font-family: var(--font-sans);
    font-size: var(--step-0);
    line-height: var(--lh-body);
    font-kerning: normal;
    font-optical-sizing: auto;
    -webkit-tap-highlight-color: transparent;
    overflow-wrap: break-word;
  }
[data-ground] { background-color: var(--surface); color: var(--fg); }
[data-theme] { color: var(--fg); }
::selection { background: var(--selection-bg); color: var(--selection-fg); }
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-sans);
    font-weight: var(--weight-semibold);
    letter-spacing: -0.01em;
    line-height: var(--lh-title);
    text-wrap: balance;
  }
:is(h1, h2, h3, h4, h5, h6) em { font-style: var(--em-style); color: var(--label-hi); }
  p, li, dd, blockquote, figcaption { text-wrap: pretty; }
  strong, b { font-weight: var(--weight-semibold); }
  small { font-size: var(--step--1); }
a {
    color: var(--link);
    text-decoration-line: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 0.24em;
    text-decoration-color: var(--link-rule);
  }
  a:hover { text-decoration-color: currentColor; }
:focus-visible {
    outline: 2px solid var(--focus);
    outline-offset: 2px;
  }
  [tabindex="-1"]:focus { outline: none; }
hr { block-size: 0; margin: 0; border: 0; border-block-start: 1px solid var(--rule); }
[dir="rtl"] .icon--dir { transform: scaleX(-1); }
}
@layer base {
  .t-display {
    font-family: var(--font-display);
    font-size: var(--step-7);
    font-weight: var(--weight-regular);
    line-height: var(--lh-display);
    letter-spacing: var(--track-display);
    text-wrap: balance;
  }
  .t-h1, .t-h2, .t-h3 {
    font-family: var(--heading-family);
    font-weight: var(--heading-weight);
    font-stretch: var(--heading-stretch);
    letter-spacing: var(--heading-track);
    text-wrap: balance;
  }
  .t-h1 { font-size: var(--step-title); line-height: var(--lh-heading); }
  .t-h2 { font-size: var(--step-5); line-height: 1.1; }
  .t-h3 { font-size: var(--step-4); line-height: 1.15; }
  .t-display em, .t-h1 em, .t-h2 em, .t-h3 em { font-style: var(--em-style); color: var(--label-hi); }
.t-line { display: block; text-wrap: balance; }
.t-lead { font-size: 1.03125rem; line-height: var(--lh-reading); color: var(--fg-2); max-inline-size: 52ch; }
  .t-reading { font-size: var(--step-reading); line-height: var(--lh-reading); }
  .t-fine { font-size: var(--step--1); line-height: var(--lh-fine); color: var(--fg-3); }
.t-label {
    font-family: var(--font-sans);
    font-size: var(--step--2);
    font-weight: var(--weight-semibold);
    line-height: var(--lh-label);
    letter-spacing: var(--track-label);
    text-transform: uppercase;
    color: var(--label);
    font-variant-numeric: tabular-nums;
  }
  .t-label--lg { font-size: var(--step--1); }
  .t-label--quiet { color: var(--fg-2); }
.t-figure { font-variant-numeric: tabular-nums lining-nums; }
.prose { max-inline-size: var(--measure); font-size: var(--step-reading); line-height: var(--lh-reading); }
  .prose > * + * { margin-block-start: var(--space-4); }
.prose > :is(h2, h3) { margin-block-start: var(--space-7); }
  .prose > h2 {
    font-family: var(--heading-family);
    font-size: var(--step-4);
    font-weight: var(--heading-weight);
    letter-spacing: var(--heading-track);
    line-height: 1.15;
  }
  .prose > h3 { font-size: var(--step-2); line-height: var(--lh-title); }
  .prose > :is(ul, ol) { padding-inline-start: 1.25em; }
  .prose > :is(ul, ol) > li + li { margin-block-start: var(--space-2); }
  .prose li::marker { color: var(--accent); }
}
@layer layout {
  .wrap {
    inline-size: min(100% - 2 * var(--gutter), var(--content-max));
    margin-inline: auto;
  }
  .section { padding-block: var(--section-space); }
  .grid {
    display: grid;
    grid-template-columns: repeat(var(--grid-cols), minmax(0, 1fr));
    column-gap: var(--grid-gap);
    row-gap: var(--space-6);
  }
  .stack > * + * { margin-block-start: var(--stack, var(--space-4)); }
  .cluster { display: flex; flex-wrap: wrap; align-items: center; gap: var(--cluster, var(--space-3)); }
.nowrap { white-space: nowrap; }
.visually-hidden:not(:focus):not(:active) {
    position: absolute !important;
    inline-size: 1px; block-size: 1px;
    margin: -1px; padding: 0; border: 0;
    overflow: hidden; clip-path: inset(50%); white-space: nowrap;
  }
}
@keyframes ettfos-fade-in { from { opacity: 0; } }
@keyframes ettfos-panel-in { from { opacity: 0; transform: translateY(-4px); } }
@keyframes ettfos-dialog-in { from { opacity: 0; transform: translateY(8px); } }