@layer page {
  .a-art { --side: max(var(--margin), (100vw - var(--wrap)) / 2); overflow-x: clip; padding-block: var(--sec-gap) var(--sec-pad); }
  .a-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); align-items: start; }
  .a-col { grid-column: 3 / span 8; display: grid; gap: var(--s-7); min-width: 0; }
  .a-art.has-rail .a-col { grid-column: 1 / span 7; }
  .a-lead { max-width: 40ch; font-size: var(--fs-lead); color: var(--ink-strong); }
  .a-toc { display: grid; gap: var(--s-3); padding: var(--s-5) var(--s-6); background: var(--table); }
  .a-toc b { font-size: var(--fs-label); font-weight: var(--fw-bold); letter-spacing: var(--tr-caps); text-transform: uppercase; color: var(--ink-muted); }
  .a-toc ol { margin: 0; padding: 0 0 0 1.2em; display: grid; gap: var(--s-1); }
  .a-toc a { display: inline-block; padding-block: var(--s-2); font-size: var(--fs-body); font-weight: var(--fw-bold); color: var(--ink-strong); }
  .a-ch { display: grid; gap: var(--s-4); scroll-margin-top: calc(var(--bar-h) + var(--s-5)); }
  .a-ch h2 { margin: var(--s-3) 0 0; font-size: var(--fs-h3); font-weight: var(--fw-bold); line-height: var(--lh-snug); letter-spacing: var(--tr-snug);
    color: var(--ink-strong); text-wrap: balance; overflow-wrap: anywhere; scroll-margin-top: calc(var(--bar-h) + var(--s-5)); }
  .a-ch :is(p, ul) { margin: 0; font-size: 1.0625rem; line-height: var(--lh-text); max-width: 60ch; text-wrap: pretty; }
  @media (min-width: 601px) { .a-ch :is(p, ul) { font-size: 1.1875rem; } }
  .a-ch ul { padding-left: 1.2em; }
  .a-ch li + li { margin-top: var(--s-1); }
  .a-ch :is(p, li) a { color: var(--link); text-decoration: underline; text-decoration-thickness: var(--ul-thick); text-underline-offset: var(--ul-off);
    text-decoration-color: color-mix(in oklab, currentColor 35%, transparent); }
  @media (hover: hover) and (pointer: fine) { .a-ch :is(p, li) a:hover { color: var(--link-hover); text-decoration-color: currentColor; } }
  .a-fig { margin: var(--s-3) 0; display: grid; gap: var(--s-3); }
  .a-pull { margin: var(--s-4) 0; padding-block: var(--s-6); border-block: var(--bw-current) solid var(--line); font-size: var(--fs-msg);
    font-weight: var(--fw-light); font-style: italic; line-height: var(--lh-msg); text-indent: var(--hang); color: var(--ink-strong); }
  .a-film .km-film { flex: none; max-width: none; }
  .a-termekek { display: grid; gap: var(--s-4); }
  .a-termekek h3 { margin: 0; font-size: var(--fs-body); font-weight: var(--fw-bold); }
  .a-tray { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  @media (max-width: 760px) { .a-tray { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  .a-byline { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-5); align-items: center; margin: 0; padding-top: var(--s-5);
    border-top: var(--bw-hair) solid var(--line); font-size: var(--fs-small); }
  .a-rail { display: none; }
  @media (min-width: 1081px) {
    .a-rail { display: block; grid-column: 9 / -1; align-self: stretch; position: relative; }
    .a-rail::before { content: ""; position: absolute; inset: calc(-1 * var(--sec-gap)) calc(-1 * var(--side)) calc(-1 * var(--sec-pad)) calc(-1 * var(--gutter));
      background: var(--table); z-index: -1; }
    .a-rail__in { position: sticky; top: calc(var(--bar-h) + var(--s-6)); display: grid; gap: var(--s-3); padding-top: var(--s-2); }
    .a-rail__label { margin: 0; font-size: var(--fs-label); font-weight: var(--fw-bold); letter-spacing: var(--tr-caps); text-transform: uppercase; color: var(--ink-muted); }
    .a-rail__tray { grid-template-columns: minmax(0, 1fr); }
    .a-rail.is-empty .a-rail__tray { visibility: hidden; }
    .a-art.has-rail { isolation: isolate; }
  }
  .a-rz { position: relative; z-index: 2; margin: var(--s-6) 0 var(--s-6) calc(-1 * var(--side)); width: 100vw; padding-block: var(--sec-gap);
    background: var(--band); color: var(--ink-on-dark); }
  .a-rz__fig { margin: 0 auto; width: min(var(--wrap), 100vw - 2 * var(--margin)); container-type: inline-size; }
  .a-rz__fig > * { --rz: min(100cqi, 56rem); width: var(--rz); margin-inline: auto; }
  .a-rz__top { display: grid; grid-template-columns: calc(var(--v) * 100%) minmax(0, 1fr); column-gap: var(--gutter); align-items: end; }
  .a-rz__ph { display: block; color: inherit; }
  .a-rz__ph > * { display: block; width: 100%; max-width: none; background: var(--photo-wait-dark); }
  .a-rz__side { display: grid; gap: var(--s-5); align-content: space-between; height: 100%; }
  .a-rz__name { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--s-1) var(--s-4); font-size: var(--fs-h3); font-weight: var(--fw-bold); line-height: var(--lh-snug); }
  .a-rz__name a { color: var(--ink-on-dark); text-decoration: underline; text-decoration-thickness: var(--ul-thick); text-underline-offset: var(--ul-off);
    text-decoration-color: color-mix(in oklab, currentColor 45%, transparent); }
  .a-rz__w { font-size: var(--fs-small); font-weight: var(--fw-regular); color: var(--ink-on-dark-2); }
  .a-rz__val { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--s-2) var(--s-4); }
  .a-rz__num { color: var(--ink-on-dark); line-height: .86; }
  .a-rz__cap { font-size: var(--fs-label); font-weight: var(--fw-bold); letter-spacing: var(--tr-caps); text-transform: uppercase; color: var(--ink-on-dark-2); }
  .a-rz__axis { position: relative; height: var(--s-6); margin-top: var(--s-4); --ax: color-mix(in oklab, var(--ink-on-dark) 40%, var(--band)); }
  .a-rz__axis::before { content: ""; position: absolute; inset-inline: 0; top: 50%; height: 2px; margin-top: -1px; background: var(--ax); }
  .a-rz__ticks { position: absolute; inset: 0; display: flex; justify-content: space-between; align-items: center; }
  .a-rz__ticks > i { width: 1px; height: var(--s-3); background: var(--ax); }
  .a-rz__fill { position: absolute; left: 0; top: 50%; width: calc(var(--v) * 100%); height: 4px; margin-top: -2px; background: var(--ink-on-dark); transform-origin: 0 50%; }
  .a-rz__run { position: absolute; left: 0; inset-block: 0; width: calc(var(--v) * 100%); }
  .a-rz__mark { position: absolute; right: -11px; top: 50%; width: 22px; height: 22px; margin-top: -11px; border-radius: 50%; background: var(--c-red); box-shadow: 0 0 0 3px var(--band); }
  .a-rz__nums { position: relative; height: calc(var(--fs-label) * 1.5); margin: var(--s-2) auto 0; padding: 0; list-style: none; font-size: var(--fs-label);
    font-weight: var(--fw-bold); color: var(--ink-on-dark-2); font-variant-numeric: tabular-nums; }
  .a-rz__nums > li { position: absolute; left: calc(var(--at) * 100%); translate: -50% 0; white-space: nowrap; }
  .a-rz__nums > li:first-child { translate: 0 0; }
  .a-rz__nums > li:last-child { translate: -100% 0; }
  .a-rz__zones { --zh: var(--s-4); position: relative; margin: var(--s-4) auto 0; height: calc(var(--n) * var(--zh) + 5.5rem); }
  .a-rz__zone { position: absolute; left: calc(var(--from) * 100%); right: 0; top: 0; height: 100%; --zy: calc(var(--i) * var(--zh)); }
  .a-rz__zone::before { content: ""; position: absolute; left: 0; right: 0; top: var(--zy); border-top: 2px solid var(--ink-on-dark); }
  .a-rz__zone::after { content: ""; position: absolute; left: 0; top: var(--zy); width: 2px; height: calc(var(--n) * var(--zh) - var(--zy) + var(--s-2)); background: var(--ink-on-dark); }
  .a-rz__zone--out::before { border-top-style: dashed; border-top-color: var(--ink-on-dark-2); }
  .a-rz__zone--out::after { background: var(--ink-on-dark-2); }
  .a-rz__zone dt { padding: calc(var(--n) * var(--zh) + var(--s-3)) 0 0 var(--s-3); font-size: min(var(--fs-h3), var(--rz) * .04); font-weight: var(--fw-bold); line-height: 1.1; color: var(--ink-on-dark); }
  .a-rz__zone dd { margin: var(--s-1) 0 0 var(--s-3); font-size: var(--fs-small); line-height: 1.5; color: var(--ink-on-dark-2); font-variant-numeric: tabular-nums; }
  .a-rz__zone--out dt { color: var(--ink-on-dark-2); }
  @media (prefers-reduced-motion: no-preference) {
    html.km-motion .a-rz.is-wait .a-rz__fill { scale: 0 1; }
    html.km-motion .a-rz.is-wait .a-rz__run { translate: calc(-100% - 12px) 0; }
    html.km-motion .a-rz.is-wait .a-rz__zone--in { opacity: .45; }
    html.km-motion .a-rz.is-run .a-rz__fill { animation: a-rz-fill 1600ms var(--ease-line) both; }
    html.km-motion .a-rz.is-run .a-rz__run { animation: a-rz-run 1600ms var(--ease-line) both; }
    html.km-motion .a-rz.is-run .a-rz__zone--in { animation: a-rz-zone 1600ms linear both; }
  }
  @keyframes a-rz-fill { from { scale: 0 1; } to { scale: 1 1; } }
  @keyframes a-rz-run { from { translate: calc(-100% - 12px) 0; } to { translate: 0 0; } }
  @keyframes a-rz-zone { 0%, 70% { opacity: .45; } 80%, 100% { opacity: 1; } }
  @media (max-width: 900px) {
    .a-rz__top { grid-template-columns: minmax(0, 1fr); row-gap: var(--s-5); }
    .a-rz__ph { width: min(100%, 24rem); }
    .a-rz__zone dt { font-size: var(--fs-body); }
  }
  @media (max-width: 600px) {
    .a-rz__zone { --lab: calc(var(--i) * 3.25rem); }
    .a-rz__zone::after { height: calc(var(--n) * var(--zh) - var(--zy) + var(--s-2) + var(--lab)); }
    .a-rz__zone dt { padding-top: calc(var(--n) * var(--zh) + var(--s-3) + var(--lab)); }
    .a-rz__zones { height: calc(var(--n) * var(--zh) + 5.5rem + (var(--n) - 1) * 3.25rem); }
  }
  @media (forced-colors: active) {
    .a-rz__axis::before, .a-rz__ticks > i, .a-rz__fill, .a-rz__zone::after, .a-rz__mark { forced-color-adjust: none; background: CanvasText; }
    .a-rz__zone::before { border-top-color: CanvasText; }
  }
  .a-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: var(--s-3) var(--s-6); margin-bottom: var(--s-7); }

  @media (max-width: 1080px) { .a-col, .a-art.has-rail .a-col { grid-column: 1 / -1; } .a-rz { margin-inline-start: calc(-1 * var(--margin)); } }
  @media (min-width: 1081px) { .a-art:not(.has-rail) .a-rz { margin-inline-start: calc(-1 * (var(--side) + 2 * ((min(var(--wrap), 100vw - 2 * var(--margin)) + var(--gutter)) / 12))); } }
  @media print { .a-rz .a-rz__fill, .a-rz .a-rz__run { animation: none !important; scale: none !important; translate: none !important; } }
}
