@layer dialogs {
  .dialog {
    inline-size: min(100% - 2 * var(--gutter), 40rem);
    max-inline-size: none;
    max-block-size: calc(100dvh - 2 * var(--space-5));
    margin: auto;
    padding: 0;
    border: 1px solid var(--rule);
    border-radius: var(--radius-card);
    background: var(--surface);
    color: var(--fg);
    box-shadow: var(--shadow-pop);
    overflow: auto;
    overscroll-behavior: contain;
  }
.dialog::backdrop { background: var(--scrim, rgb(9 19 16 / .8)); }
  .dialog[open] { animation: ettfos-dialog-in var(--dur-3) var(--ease-reveal); }
  .dialog[open]::backdrop { animation: ettfos-fade-in var(--dur-3) var(--ease-reveal); }
.dialog__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-4);
    padding: var(--space-5) var(--space-5) 0;
  }
  .dialog__title {
    margin-block-start: var(--space-2);
    font-family: var(--heading-family);
    font-size: var(--step-4);
    font-weight: var(--heading-weight);
    letter-spacing: var(--heading-track);
    line-height: 1.15;
  }
  .dialog__body { display: grid; gap: var(--space-4); padding: var(--space-5); }
  .dialog__note { color: var(--fg-2); }
  .dialog__fine { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); font-size: var(--step--1); }
  .dialog__fine a { display: inline-flex; align-items: center; min-block-size: var(--target-min); }
  .dialog__close {
    display: grid;
    place-items: center;
    flex: none;
    inline-size: var(--target-touch);
    block-size: var(--target-touch);
    margin-block-start: calc(-1 * var(--space-2));
    margin-inline-end: calc(-1 * var(--space-3));
    border-radius: var(--radius-control);
    color: var(--fg);
  }
  .dialog__close:hover { background: var(--action-2-bg-hover); }
@media (min-width: 768px) {
    .dialog__head { padding: var(--space-6) var(--space-6) 0; }
    .dialog__body { padding: var(--space-6); }
  }
@media (max-width: 639.98px) {
    .dialog {
      inline-size: 100%;
      block-size: 100%;
      max-block-size: none;
      margin: 0;
      border: 0;
      border-radius: 0;
      box-shadow: none;
    }
  }
.dialog--assessment {
    inline-size: min(100% - 32px, 620px);
    max-block-size: calc(100dvh - 48px);
    padding: 2.5rem 2.75rem 2.125rem;
    background: radial-gradient(120% 80% at 0% 0%, var(--glow), transparent 60%), var(--surface-raised);
    box-shadow: var(--pop);
  }
  .dialog--assessment::before {
    content: "";
    position: absolute;
    inset-inline: 0;
    inset-block-start: 0;
    block-size: 2px;
    background: linear-gradient(90deg, var(--label-hi), var(--accent) 55%, transparent);
    transform-origin: 0 50%;
    pointer-events: none;
  }
  [dir="rtl"] .dialog--assessment::before { transform-origin: 100% 50%; background: linear-gradient(270deg, var(--label-hi), var(--accent) 55%, transparent); }
  .dialog--assessment[open] { display: flex; flex-direction: column; }
  .dialog--assessment .dialog__head,
  .dialog--assessment .dialog__body { padding: 0; }
  .dialog--assessment .dialog__head { gap: var(--space-5); }
  :root:not([data-theme="light"]) .dialog--assessment .t-label { color: var(--label-hi); }
  .dialog--assessment .dialog__title { margin-block-start: 14px; font-size: clamp(1.875rem, 1.6rem + 1.2vw, 2.375rem); line-height: 1.1; letter-spacing: -0.012em; }
  .dialog--assessment .dialog__close {
    inline-size: 44px;
    block-size: 44px;
    margin-block-start: -6px;
    margin-inline-end: -12px;
    border: 1px solid var(--rule);
    border-radius: 50%;
  }
  .dialog--assessment .dialog__close:hover { background: none; border-color: var(--label-hi); }
  .dialog--assessment .dialog__close:focus-visible { outline-color: var(--label-hi); outline-offset: 3px; }
  .dialog--assessment .dialog__close .icon { inline-size: 18px; block-size: 18px; }
  .dialog--assessment .dialog__body { display: flex; flex-direction: column; gap: 0; flex: 1; min-block-size: 0; }
  .dialog--assessment .dialog__body > p:first-child { margin-block-start: 18px; max-inline-size: 46ch; font-size: var(--step-0); line-height: 1.7; color: var(--fg-2); }
  .form-frame {
    display: grid;
    margin-block-start: 28px;
    padding: 28px;
    border: 1px solid var(--rule-soft);
    background: var(--surface-sunken);
  }
  .form-frame__start { display: grid; gap: 14px; }
  .form-frame__start .btn { inline-size: 100%; min-block-size: 52px; }
  .form-frame__start .dialog__note { font-size: var(--step-ui); line-height: 1.65; color: var(--fg-2); }
.form-frame { position: relative; overflow: hidden; }
  .form-frame__wait { position: absolute; inset: 24px; display: grid; align-content: start; gap: 10px; pointer-events: none; }
  .form-frame__wait > i { block-size: 42px; border: 1px solid var(--rule-soft); }
  .form-frame__wait > i:nth-child(odd) { inline-size: 32%; block-size: 7px; margin-block-start: 10px; border: 0; background: var(--rule-soft); }
  .form-frame__wait > i:last-child { inline-size: 44%; block-size: 46px; margin-block-start: 16px; background: var(--glow); border: 1px solid var(--rule); }
  .form-frame__wait::after { content: ""; position: absolute; inset: -24px; background: linear-gradient(100deg, transparent 35%, var(--glow) 50%, transparent 65%); transform: translateX(-100%); animation: form-sheen 1.8s var(--ease-scene) .2s 6; }
  @keyframes form-sheen { to { transform: translateX(100%); } }
  .form-frame[data-ready] .form-frame__wait { opacity: 0; transition: opacity var(--dur-4) var(--ease-reveal); }
  .form-frame iframe { position: relative; opacity: 0; transition: opacity var(--dur-4) var(--ease-reveal); }
  .form-frame[data-ready] iframe { opacity: 1; }
  @media (prefers-reduced-motion: reduce) { .form-frame__wait::after { animation: none; opacity: 0; } }
  :root[data-motion="static"] .form-frame__wait::after { animation: none; opacity: 0; }
.dialog__assure { display: grid; gap: 6px; margin-block-start: 16px; font-size: var(--step-ui); line-height: 1.5; color: var(--fg-2); }
  .dialog__promise { color: var(--fg); font-weight: var(--weight-medium); }
  .dialog__call { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px var(--space-4); }
  .dialog-call { display: flex; flex-wrap: wrap; gap: 2px var(--space-4); }
  .dialog-call__line { display: inline-flex; align-items: center; gap: 6px; min-block-size: var(--target-min); color: var(--fg); text-decoration: none; }
  .dialog-call__line:hover .dialog-call__number { color: var(--fg); text-decoration: underline 1px var(--accent); text-underline-offset: .3em; }
  .dialog-call__city { font-weight: var(--weight-semibold); }
  .dialog-call__number { color: var(--fg-2); font-variant-numeric: tabular-nums; }
  .dialog-call__icon { order: -1; inline-size: 14px; block-size: 14px; color: var(--accent); }
  .dialog--assessment .dialog__fine { margin-block-start: 22px; gap: 6px 14px; font-size: 0.78125rem; font-weight: var(--weight-medium); line-height: 1.6; color: var(--fg-3); }
  .dialog--assessment .dialog__fine a { color: inherit; text-decoration: underline 1px var(--rule); text-underline-offset: 0.35em; }
  .dialog--assessment .dialog__fine a:hover { color: var(--fg-2); }
  .dialog__fine > span { color: var(--fg-3); }
.dialog--assessment:has(.form-frame[data-loaded]) { block-size: min(100dvh - 48px, 58rem); }
  .form-frame[data-loaded] { flex: 1; min-block-size: 18rem; padding: 0; background: var(--surface-raised); }
  .form-frame iframe { inline-size: 100%; block-size: 100%; min-block-size: 18rem; border: 0; }
@media (prefers-reduced-motion: no-preference) {
    :root:not([data-motion="static"]) .dialog--assessment[open] { animation: ettfos-booking-in 650ms var(--ease-reveal) both; }
    :root:not([data-motion="static"]) .dialog--assessment[open]::before { animation: ettfos-line-in 800ms var(--ease-reveal) 200ms both; }
    :root:not([data-motion="static"]) .dialog--assessment[open] :is(.dialog__head, .dialog__body > *) { animation: ettfos-dialog-in 500ms var(--ease-reveal) both; }
    :root:not([data-motion="static"]) .dialog--assessment[open] .dialog__head { animation-delay: 100ms; }
    :root:not([data-motion="static"]) .dialog--assessment[open] .dialog__body > :nth-child(1) { animation-delay: 180ms; }
    :root:not([data-motion="static"]) .dialog--assessment[open] .dialog__body > :nth-child(2) { animation-delay: 260ms; }
    :root:not([data-motion="static"]) .dialog--assessment[open] .dialog__body > :nth-child(3) { animation-delay: 340ms; }
    :root:not([data-motion="static"]) .dialog--assessment[open] .dialog__body > :nth-child(4) { animation-delay: 400ms; }
  }
@media (max-height: 760px) and (min-width: 601px) {
    .dialog--assessment { padding: 1.625rem 2.125rem 1.375rem; max-block-size: calc(100dvh - 24px); }
    .dialog--assessment .dialog__title { margin-block-start: 8px; font-size: clamp(1.75rem, 1.55rem + 0.8vw, 2rem); }
    .dialog--assessment .dialog__body > p:first-child { margin-block-start: 10px; font-size: 0.9375rem; line-height: 1.6; }
    .form-frame { margin-block-start: 16px; padding: 18px 20px; }
    .form-frame__start .btn { min-block-size: 46px; }
    .form-frame__start .dialog__note { font-size: 0.84375rem; line-height: 1.55; }
    .dialog--assessment .dialog__fine { margin-block-start: 14px; }
  }
@media (max-width: 639.98px) {
    .dialog--assessment,
    .dialog--assessment:has(.form-frame[data-loaded]) { inline-size: 100%; block-size: 100%; max-block-size: none; padding: 28px 22px 30px; border: 0; box-shadow: none; }
    .dialog--assessment .dialog__close { margin-block-start: -8px; margin-inline-end: -4px; }
    .form-frame { padding: 22px 18px; }
  }
.dialog--agenda { inline-size: min(100% - 2 * var(--gutter), 36rem); }
  @media (max-width: 639.98px) { .dialog--agenda { inline-size: 100%; } }
  .agenda { border-block-start: 1px solid var(--rule); }
  .agenda__item {
    display: grid;
    grid-template-columns: 3ch minmax(0, 1fr);
    align-items: baseline;
    gap: var(--space-4);
    min-block-size: var(--target-touch);
    padding-block: var(--space-3);
    border-block-end: 1px solid var(--rule-soft);
    color: var(--fg);
    text-decoration: none;
  }
  .agenda__item:hover .agenda__name { text-decoration: underline 1px var(--accent); text-underline-offset: 0.3em; }
  .agenda__index { font-family: var(--font-sans); font-size: var(--step--2); font-weight: var(--weight-semibold); letter-spacing: 0.08em; color: var(--label); font-variant-numeric: tabular-nums; }
  .agenda__name { font-size: var(--step-1); line-height: var(--lh-title); }
  .agenda-resources { display: grid; padding-block-start: var(--space-2); }
  .agenda-resources a {
    display: inline-flex;
    align-items: center;
    min-block-size: 40px;
    color: var(--fg-2);
    font-size: var(--step-ui);
    text-decoration: none;
  }
  .agenda-resources a:hover { color: var(--fg); text-decoration: underline 1px var(--accent); text-underline-offset: 0.3em; }
.dialog--viewer {
    inline-size: 100%;
    block-size: 100%;
    max-block-size: none;
    margin: 0;
    border: 0;
    border-radius: 0;
    background: var(--surface-sunken);
    box-shadow: none;
    overflow: hidden;
  }
  .viewer { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; block-size: 100%; }
  .viewer__bar {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    min-block-size: 56px;
    padding-inline: var(--gutter);
  }
  .viewer__caption { flex: 1; min-inline-size: 0; font-size: var(--step-ui); color: var(--fg-2); }
.viewer__caption[data-quiet] { flex: 1; block-size: 1px; overflow: hidden; clip-path: inset(50%); }
  .viewer__bar .dialog__close { margin-block-start: 0; }
  .viewer__count { font-family: var(--font-sans); font-size: var(--step--2); font-weight: var(--weight-semibold); letter-spacing: 0.08em; color: var(--fg-3); font-variant-numeric: tabular-nums; }
  .viewer__stage {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--space-2);
    min-block-size: 0;
    padding-inline: var(--space-2);
  }
  .viewer__frame { display: grid; grid-template: minmax(0, 1fr) / minmax(0, 1fr); place-items: center; block-size: 100%; min-block-size: 0; overflow: hidden; }
  .viewer__frame img { max-inline-size: 100%; max-block-size: 100%; inline-size: auto; block-size: auto; object-fit: contain; }
  .viewer__frame img { animation: ettfos-fade-in var(--dur-3) var(--ease-reveal); }
  .viewer__nav {
    display: grid;
    place-items: center;
    inline-size: var(--target-touch);
    block-size: var(--target-touch);
    border-radius: var(--radius-control);
    color: var(--fg);
  }
  .viewer__nav:hover { background: var(--action-2-bg-hover); }
  .viewer__nav[hidden] { display: grid !important; visibility: hidden; }
  .viewer__foot {
    display: flex;
    justify-content: center;
    padding: var(--space-3) var(--gutter) calc(var(--space-3) + env(safe-area-inset-bottom));
    font-size: var(--step--1);
  }
  .viewer__foot a { display: inline-flex; align-items: center; min-block-size: var(--target-min); }
.player {
    inline-size: 100%;
    block-size: 100%;
    max-inline-size: none;
    max-block-size: none;
    margin: 0;
    padding: 0;
    border: 0;
    background: var(--surface-sunken);
    color: var(--fg);
    overflow: hidden;
    overscroll-behavior: contain;
  }
  .player::backdrop { background: var(--surface-sunken, #0D1C18); }
  .player[open] { animation: ettfos-fade-in var(--dur-3) var(--ease-cut); }
  .player__stage {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    inline-size: 100%;
    block-size: 100%;
    background: var(--surface-sunken);
    color: var(--fg);
  }
  .player__stage::backdrop { background: var(--surface-sunken, #0D1C18); }
  .player__bar,
  .player__fallback { position: relative; z-index: 2; grid-column: 1; }
  .player__bar { grid-row: 1; }
  .player__fallback { grid-row: 3; }
  .player__bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    min-block-size: 56px;
    padding-inline: var(--gutter);
  }
  .player__title {
    min-inline-size: 0;
    overflow: hidden;
    font-size: var(--step-ui);
    color: var(--fg-2);
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .player__close {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    min-block-size: var(--target-touch);
    padding-inline: var(--space-3);
    margin-inline-end: calc(-1 * var(--space-3));
    border-radius: var(--radius-control);
    color: var(--fg);
    font-size: var(--step-ui);
    font-weight: var(--weight-semibold);
  }
  .player__close:hover { background: var(--action-2-bg-hover); }
  .player__close:focus-visible { outline-color: var(--focus); }
  .player__screen { grid-row: 2; grid-column: 1; display: grid; place-items: center; min-block-size: 0; container-type: size; }
  .player__frame {
    inline-size: 100%;
    inline-size: min(100cqw, 100cqh * 16 / 9);
    max-block-size: 100%;
    aspect-ratio: 16 / 9;
    background: var(--screen);
  }
  .player__frame iframe { inline-size: 100%; block-size: 100%; border: 0; }
.player__frame video { display: block; inline-size: 100%; block-size: 100%; }
  .player__fallback {
    padding: var(--space-2) var(--gutter) calc(var(--space-3) + env(safe-area-inset-bottom));
    font-size: var(--step--1);
    text-align: center;
    color: var(--fg-3);
  }
  .player__fallback a { display: inline-flex; align-items: center; min-block-size: var(--target-min); color: var(--fg-2); }
.player__cover {
    position: absolute;
    inset: 0;
    z-index: 1;
    overflow: hidden;
    background: var(--surface-sunken);
    cursor: pointer;
    transition: opacity var(--dur-4) var(--ease-reveal), visibility 0s linear 0s;
  }
  .player__cover picture,
  .player__cover img {
    position: absolute;
    inset: 0;
    inline-size: 100%;
    block-size: 100%;
  }
  .player__cover img {
    max-inline-size: none;
    object-fit: cover;
    transition: opacity var(--dur-4) var(--ease-reveal);
  }
  .player__cover[data-pending] img { opacity: 0; }
.player__cover::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
      linear-gradient(to bottom, var(--shade-1) 0, var(--shade-3) 7rem),
      linear-gradient(to top, var(--shade-1) 0, var(--shade-3) 6rem),
      radial-gradient(130% 100% at 50% 50%, var(--shade-3) 58%, var(--shade-2) 100%);
  }
  .player[data-state="playing"] .player__cover,
  .player[data-state="ready"] .player__cover {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity var(--dur-4) var(--ease-reveal), visibility 0s linear var(--dur-4);
  }
.player__wait {
    grid-row: 2;
    grid-column: 1;
    align-self: end;
    z-index: 2;
    block-size: 1px;
    margin-inline: var(--gutter);
    overflow: hidden;
    pointer-events: none;
    opacity: 0;
    transition: opacity var(--dur-2) var(--ease-reveal);
  }
  .player__wait::before {
    content: "";
    display: block;
    block-size: 100%;
    background: var(--label-hi);
    transform: scaleX(0);
  }
  .player[data-state="loading"] .player__wait { opacity: 1; }
  .player[data-state="loading"] .player__wait::before { animation: player-wait var(--dur-max) var(--ease-reveal) both; }
  @media (prefers-reduced-motion: reduce) {
    .player__wait { display: none; }
  }
  :root[data-motion="static"] .player__wait { display: none; }
}
@keyframes player-wait {
  from { transform: scaleX(0); }
  to { transform: scaleX(1); }
}
@keyframes ettfos-booking-in { from { opacity: 0; transform: translateY(18px) scale(.985); } }
@keyframes ettfos-line-in { from { transform: scaleX(0); } }