@layer components{
.konz-fejlec{margin-bottom:var(--space-64)}
.konz-cim{max-width:44ch;margin-bottom:var(--space-24)}
.konz-fejlec .section-lead{max-width:56ch}
.konz-eyebrow::after{content:"";position:absolute;left:0;bottom:0;
width:var(--space-48);height:2px;background:var(--text-primary)}
.konz-pont + .konz-pont{border-left:1px solid var(--border);padding-left:var(--space-24)}
.konz-pont-cim{color:var(--text-primary)}
.konz-pont-szoveg{color:var(--text-secondary)}
.konz-akcio{margin:var(--space-48) 0 var(--space-24)}
.konz-foto{margin:0;border-radius:var(--card-radius);overflow:hidden;background:var(--surface-muted)}
.konz-foto img{width:100%;height:auto;display:block}
.konz-nev{color:var(--text-primary)}
.konz-titulus{color:var(--text-tertiary)}
.konz-bio{color:var(--text-secondary)}
.konz-bio:first-of-type{padding-top:var(--space-16);margin-top:var(--space-8);
border-top:1px solid var(--border)}
}
@layer responsive{
@media (max-width:1024px){
.konz-fo{grid-template-columns:minmax(0,1fr)}
.konz-bemutat{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}
}
}
@layer responsive{
@media (max-width:640px){
.konz-pontok{grid-template-columns:minmax(0,1fr)}
.konz-pont{align-items:flex-start;text-align:left;padding-right:0}
.konz-pont + .konz-pont{border-left:0;border-top:1px solid var(--border);
padding-left:0;padding-top:var(--space-24)}
.konz-bemutat{grid-template-columns:minmax(0,1fr)}
}
}
@layer components{
.konzv-belepo{border:1px dashed var(--border-strong);border-radius:var(--r-lg);
padding:var(--space-16);background:var(--surface-muted);}
.konzv-belepo-cim{cursor:pointer;display:flex;flex-wrap:wrap;align-items:baseline;
gap:var(--space-8);color:var(--text-primary);}
.konzv-belepo-cim::marker{color:var(--primary)}
.konzv-belepo-cim:focus-visible{outline:2px solid var(--border-focus);outline-offset:3px;}
.konzv-belepo-sug{color:var(--text-tertiary)}
.konzv-belepo-test{margin-block-start:var(--space-16)}
.konzv-chip:hover{border-color:var(--border-strong)}
.konzv-chip:has(input:checked){border-color:var(--primary);
background:var(--valasztott-bg);
color:var(--valasztott-text);}
.konzv-chip-gomb{font:inherit;text-align:start;
appearance:none;-webkit-appearance:none;}
.konzv-chip-gomb[aria-pressed="true"]{border-color:var(--primary);background:var(--valasztott-bg);
color:var(--valasztott-text);}
.konzv-chip-gomb:focus-visible{outline:2px solid var(--border-focus);outline-offset:2px;}
.konzv-nemtudom{border-style:dashed}
:root[data-theme="dark"] .konzv-csuszka{--csuszka-hangsuly:var(--primary)}
.konzv-csuszka[data-allapot="ures"] .konzv-csuszka-ertek{font-family:var(--font-body);font-size:var(--type-ui-caption-size);
font-weight:400;color:var(--text-tertiary);}
.konzv-csuszka-sav:focus{outline:none}
.konzv-csuszka-sav::-webkit-slider-runnable-track{block-size:6px;border-radius:999px;
background:linear-gradient(to right,
var(--primary) 0 var(--kitoltes), var(--border) var(--kitoltes) 100%);}
.konzv-csuszka-sav::-moz-range-track{block-size:6px;border-radius:999px;background:var(--border);}
.konzv-csuszka-sav::-moz-range-progress{block-size:6px;border-radius:999px;background:var(--primary);}
.konzv-csuszka[data-allapot="ures"] .konzv-csuszka-sav::-moz-range-progress{background:transparent;}
.konzv-csuszka-sav::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;
inline-size:var(--csuszka-fogo);block-size:var(--csuszka-fogo);
margin-block-start:calc((6px - var(--csuszka-fogo)) / 2);
border:2px solid var(--csuszka-hangsuly);border-radius:50%;
background:var(--surface);
box-shadow:0 1px 3px rgb(0 0 0 / .2);}
.konzv-csuszka-sav::-moz-range-thumb{box-sizing:border-box;
inline-size:var(--csuszka-fogo);block-size:var(--csuszka-fogo);
border:2px solid var(--csuszka-hangsuly);border-radius:50%;
background:var(--surface);
box-shadow:0 1px 3px rgb(0 0 0 / .2);}
.konzv-csuszka[data-allapot="kesz"] .konzv-csuszka-sav::-webkit-slider-thumb{background:radial-gradient(circle,var(--csuszka-hangsuly) 0 4px,var(--surface) 4.5px);}
.konzv-csuszka[data-allapot="kesz"] .konzv-csuszka-sav::-moz-range-thumb{background:radial-gradient(circle,var(--csuszka-hangsuly) 0 4px,var(--surface) 4.5px);}
.konzv-csuszka[data-allapot="ures"] .konzv-csuszka-sav::-webkit-slider-thumb{border-style:dashed;border-color:var(--border-strong);box-shadow:none;}
.konzv-csuszka[data-allapot="ures"] .konzv-csuszka-sav::-moz-range-thumb{border-style:dashed;border-color:var(--border-strong);box-shadow:none;}
.konzv-csuszka-sav:hover::-webkit-slider-thumb{box-shadow:0 0 0 6px var(--primary-soft),0 1px 3px rgb(0 0 0 / .2);}
.konzv-csuszka-sav:hover::-moz-range-thumb{box-shadow:0 0 0 6px var(--primary-soft),0 1px 3px rgb(0 0 0 / .2);}
.konzv-csuszka-sav:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 2px var(--surface),0 0 0 5px var(--border-focus);}
.konzv-csuszka-sav:focus-visible::-moz-range-thumb{box-shadow:0 0 0 2px var(--surface),0 0 0 5px var(--border-focus);}
.konzv-csuszka-jel::before{content:"";position:absolute;inset-block-start:0;inset-inline-start:calc(50% - 1px);
inline-size:2px;block-size:5px;border-radius:1px;background:var(--border-strong);}
.konzv-csuszka-jel:first-child{justify-content:flex-start;
padding-inline-start:calc(1.75em - var(--csuszka-fogo) / 2);}
.konzv-csuszka-jel:last-child{justify-content:flex-end;
padding-inline-end:calc(1.75em - var(--csuszka-fogo) / 2);}
.konzv-csuszka-jel:hover{color:var(--text-primary)}
.konzv-csuszka-jel.is-aktiv{color:var(--text-primary);font-weight:600}
.konzv-csuszka-jel.is-aktiv::before{background:var(--csuszka-hangsuly)}
}
@layer components{
@media (max-width:479px){
.konzv-csuszka-jel:nth-child(even):not(.is-aktiv){color:transparent}
}
}
@layer components{
.konzv-csuszka + .konzv-chipek{margin-block-start:var(--space-8)}
}
@layer components{
@media (max-width:640px){
.konzv-chipek-racs{grid-template-columns:minmax(0,1fr)}
}
}
@layer components{
.konzv-halad[hidden]{display:none}
.konzv-halad-sav{flex:1;height:4px;border-radius:var(--r-md);
background:var(--surface-muted);overflow:hidden;position:relative;}
.konzv-halad-sav::after{content:"";position:absolute;inset-block:0;inset-inline-start:0;
inline-size:var(--konzv-halad,8%);
background:var(--primary);border-radius:inherit;
transition:inline-size .3s ease;}
}
@layer components{
@media (prefers-reduced-motion:reduce){
.konzv-halad-sav::after{transition:none}
}
}
@layer components{
.konzv-halad-szoveg{color:var(--text-secondary);white-space:nowrap}
.konzv-blokk{padding-block:var(--space-24);
border-top:1px solid var(--border);}
.konzv-blokk:first-of-type{border-top:0;padding-block-start:var(--space-8)}
.konzv-blokk[hidden]{display:none}
.konzv-blokk-cim{margin:0 0 var(--space-4);color:var(--text-primary)}
.konzv-blokk-lead{margin:0 0 var(--space-16);
color:var(--text-secondary);
max-width:56ch;}
.konzv-blokk.is-kesz .konzv-blokk-lead{display:none}
.konzv-blokk.is-kesz .konzv-blokk-cim{color:var(--text-secondary)}
.konzv-elony-cim{color:var(--text-primary)}
.konzv-elony-szoveg{color:var(--text-secondary)}
.konzv-folytatas-szoveg{margin:0;color:var(--text-primary)}
.konzv-folytatas.is-kesz{border-left:4px solid var(--primary);
padding-left:calc(var(--space-16) - 4px);}
.konzv-atvezeto{margin-bottom:var(--space-24)}
.konzv-gyors-cim{display:block;float:none;inline-size:100%;padding:0;margin:0;color:var(--text-primary)}
.konzv-gyors-lead{margin:calc(-1 * var(--space-16)) 0 0;color:var(--text-secondary);max-inline-size:56ch}
.konzv-reszletek{margin-block:var(--space-32) 0}
.konzv-reszletek > summary::-webkit-details-marker{display:none}
.konzv-reszletek > summary:hover{border-color:var(--secondary)}
.konzv-reszletek-cim{grid-column:1}
.konzv-reszletek-sug{grid-column:1;color:var(--text-secondary)}
.konzv-reszletek-jel{grid-column:2;grid-row:1 / span 2;inline-size:var(--space-24);block-size:var(--space-24);
color:var(--secondary);transition:rotate .2s ease;}
.konzv-reszletek[open] > summary{border-style:solid;background:var(--surface)}
.konzv-reszletek[open] .konzv-reszletek-jel{rotate:180deg}
.konzv-reszletek-test{padding-block-start:var(--space-32)}
}
@layer components{
@media (prefers-reduced-motion:reduce){
.konzv-reszletek > summary,.konzv-reszletek-jel{transition:none}
}
}
@layer components{
.konzv-lepcso-elem::before{content:"";position:absolute;top:calc(var(--space-16) + 2.5px);
left:calc(-50% + var(--space-16) + 4px);width:calc(100% - var(--space-32) - 8px);
height:3px;border-radius:999px;background:var(--border);}
.konzv-lepcso-elem:first-child::before{content:none}
.konzv-lepcso-nev{color:inherit}
.konzv-lepcso-elem.is-aktiv{color:var(--text-primary)}
.konzv-lepcso-elem.is-aktiv .konzv-lepcso-nev{font-weight:600}
.konzv-lepcso-elem.is-aktiv .konzv-lepcso-szam{background:var(--secondary);border-color:var(--secondary);color:var(--surface);
box-shadow:0 0 0 5px color-mix(in srgb, var(--secondary) 18%, transparent);
animation:konzv-dobban 420ms var(--ease-out);}
.konzv-lepcso-elem.is-kesz{color:var(--text-secondary)}
.konzv-lepcso-elem.is-kesz .konzv-lepcso-szam{background:var(--surface-muted);border-color:var(--secondary);color:var(--secondary);}
.konzv-lap{border:0;margin:0;padding:0;min-width:0}
.konzv-lap + .konzv-lap{margin-top:var(--space-48)}
.konzv.is-lapozo .konzv-lap + .konzv-lap{margin-top:0}
.konzv-lap-lead{color:var(--text-secondary);margin:0 0 var(--space-24);max-width:56ch}
.konzv-rejtett{position:absolute;width:1px;height:1px;padding:0;margin:-1px;
overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0;}
.konzv-opcionalis{color:var(--text-tertiary)}
.konzv-valasztok-tomor{grid-template-columns:repeat(2,minmax(0,1fr))}
.konzv-valasztok-harmas{grid-template-columns:repeat(3,minmax(0,1fr))}
.konzv-valaszto:hover .konzv-valaszto-test{border-color:var(--secondary)}
.konzv-valaszto input:focus-visible + .konzv-valaszto-test{outline:3px solid var(--border-focus);outline-offset:2px;}
.konzv-valaszto input:checked + .konzv-valaszto-test{border-color:var(--secondary);background:var(--surface-muted);}
.konzv-valaszto:hover .konzv-valaszto-ikon{transform:translateY(-2px)}
.konzv-valaszto input:checked + .konzv-valaszto-test .konzv-valaszto-ikon{background:var(--secondary);color:var(--surface);}
.konzv-valaszto-cim{color:var(--text-primary)}
.konzv-valaszto-szoveg{color:var(--text-secondary)}
.konzv-jelolo:hover{border-color:var(--secondary)}
.konzv-jelolo:has(input:checked){border-color:var(--secondary);background:var(--surface-muted);color:var(--text-primary);}
.konzv-jelolo:has(input:focus-visible){outline:3px solid var(--border-focus);outline-offset:2px}
.konzv-felteteles{margin-top:var(--space-16);padding-left:var(--space-16);
border-left:2px solid var(--border);}
.konzv-ai{margin-top:var(--space-24);padding:var(--space-16);
background:var(--surface-muted);border-radius:var(--r-md);}
.konzv-ai-cim{margin:0;color:var(--text-primary);font-weight:600}
.konzv-ai-szoveg{margin:0 0 var(--space-16);color:var(--text-secondary)}
.konzv-ai-allapot.is-kesz{color:var(--secondary)}
.konzv-ai-allapot.is-hiba{color:var(--warning-text)}
.konzv-hivas-test{min-width:0}
.konzv-hivas-cim{margin:0;color:var(--text-primary)}
.konzv-hivas-szoveg{margin:var(--space-4) 0 0;color:var(--text-secondary)}
.konzv-hivas-dij{margin:var(--space-8) 0 0;padding:var(--space-4) var(--space-8) var(--space-4) var(--space-16);
border-radius:var(--r-md);border-inline-start:var(--space-4) solid var(--konzv-dij-szel);
background:var(--konzv-dij-bg);color:var(--konzv-dij-szoveg);text-wrap:pretty;
font-weight:var(--type-ui-body-strong-weight);}
.konzv-naptar{margin:var(--space-24) 0}
.konzv-naptar-fej{margin-bottom:var(--space-16)}
.konzv-naptar-cim{margin:0;color:var(--text-primary)}
.konzv-naptar-sug{margin:var(--space-4) 0 0;color:var(--text-tertiary)}
.konzv-nap-nev{color:var(--text-primary);text-transform:uppercase;
font-family:var(--font-mono);font-size:var(--type-ui-caption-size);
letter-spacing:.06em;}
.konzv-nap-datum{color:var(--text-tertiary);
font-family:var(--font-mono);font-size:calc(var(--type-ui-caption-size) * .92);}
.konzv-sav:hover:not(:disabled){border-color:var(--secondary)}
.konzv-sav:focus-visible{outline:3px solid var(--border-focus);outline-offset:2px}
.konzv-sav[aria-pressed="true"]{border-color:var(--secondary);background:var(--secondary);color:var(--surface);}
.konzv-sav:disabled{opacity:.45;cursor:not-allowed}
.konzv-osszegzes{margin-top:var(--space-32);padding:var(--space-24);
background:var(--surface-muted);border-radius:var(--r-md);}
.konzv-osszegzes-cim{margin:0 0 var(--space-16);color:var(--text-primary)}
.konzv-osszegzes-lista dt{color:var(--text-tertiary);font-size:var(--type-ui-caption-size)}
.konzv-osszegzes-lista dd{margin:0;color:var(--text-primary);font-size:var(--type-ui-caption-size)}
.konzv-vezerlo .konzv-vissza{margin-right:auto}
.konzv-vezerlo .btn[hidden]{display:none}
.konzv-jogi-lab{margin:var(--space-16) 0 0;color:var(--text-tertiary);max-width:60ch}
}
@layer responsive{
@media (max-width:1024px){
.konzv-elonyok{grid-template-columns:repeat(2,minmax(0,1fr))}
.konzv{padding:var(--space-24)}
.konzv-naptar-racs{grid-template-columns:repeat(3,minmax(0,1fr))}
.konzv-lepcso-nev{display:none}
}
}
@layer responsive{
@media (max-width:640px){
.konzv-elonyok{grid-template-columns:minmax(0,1fr);gap:var(--space-24)}
.konzv-valasztok,
.konzv-valasztok-tomor,
.konzv-valasztok-harmas{grid-template-columns:minmax(0,1fr)}
.konzv{padding:var(--space-16)}
.konzv-naptar-racs{grid-template-columns:repeat(2,minmax(0,1fr))}
.konzv-osszegzes-lista{grid-template-columns:minmax(0,1fr);gap:var(--space-4)}
.konzv-osszegzes-lista dd{margin-bottom:var(--space-8)}
.konzv-vezerlo{flex-direction:column;align-items:stretch}
.konzv-vezerlo .btn{width:100%}
.konzv-vezerlo .konzv-vissza{margin-right:0;order:2}
}
}
@layer components{
.konzv-lap-cim:focus{outline:none}
.konzv-lap-cim:focus-visible{outline:none}
.konzv-jogi-lab{margin-top:var(--space-24)}
.konzv-lap{animation:konzv-be 260ms var(--ease-out) both}
.konzv.is-vissza .konzv-lap{animation-name:konzv-be-vissza}
.konzv-lepcso-elem.is-kesz .konzv-lepcso-szam{animation:konzv-pipa 320ms var(--ease-out)}
.konzv-lepcso-elem.is-kesz .konzv-lepcso-szam{color:transparent}
.konzv-lepcso-elem.is-kesz .konzv-lepcso-szam::after{content:"";position:absolute;left:12px;top:13px;width:13px;height:7px;
border-left:2.5px solid var(--secondary);border-bottom:2.5px solid var(--secondary);
transform:rotate(-45deg);transform-origin:center;
animation:konzv-pipa-huz 260ms var(--ease-out) both;}
.konzv-lepcso-elem::before{background-color:var(--border);
background-image:linear-gradient(90deg,var(--secondary),var(--secondary));
background-repeat:no-repeat;background-size:0% 100%;
transition:background-size 520ms var(--ease-out);}
.konzv-lepcso-elem.is-kesz::before,
.konzv-lepcso-elem.is-aktiv::before{background-size:100% 100%}
.mezo-sugo:hover .mezo-sugo-gomb,.mezo-sugo-gomb:focus-visible{color:var(--secondary);transform:scale(1.1)}
.mezo-sugo-gomb:focus-visible{outline:2px solid var(--border-focus);outline-offset:2px}
.mezo-sugo-buborek{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%,4px);
width:max-content;max-width:min(19rem,72vw);
padding:var(--space-8) var(--space-16);text-align:left;
background:var(--text-primary);color:var(--surface);
border-radius:var(--r-md);box-shadow:var(--shadow-2);
font-weight:400;text-transform:none;letter-spacing:normal;white-space:normal;
opacity:0;visibility:hidden;pointer-events:none;z-index:30;
transition:opacity var(--dur-fast) var(--ease-out),
transform var(--dur-fast) var(--ease-out),
visibility var(--dur-fast);}
.mezo-sugo-buborek::after{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);
border:6px solid transparent;border-top-color:var(--text-primary);}
.mezo-sugo:hover .mezo-sugo-buborek,
.mezo-sugo:focus-within .mezo-sugo-buborek{opacity:1;visibility:visible;transform:translate(-50%,0)}
.mezo-hiba::before{content:"!";flex:none;display:grid;place-items:center;
width:16px;height:16px;margin-top:1px;border-radius:50%;
background:var(--danger-border);color:#FBFBF7;
font-family:var(--font-body);font-size:11px;font-weight:600;line-height:1;}
.is-hibas .konzv-valaszto-test{border-color:var(--danger-border)}
}
@layer motion{
@media (prefers-reduced-motion:reduce){
.konzv-lap,.konzv-lepcso-elem.is-kesz .konzv-lepcso-szam{animation:none}
.konzv-lepcso-elem.is-aktiv .konzv-lepcso-szam{animation:none}
.konzv-lepcso-elem::before{transition:none}
.konzv-lepcso-elem.is-kesz .konzv-lepcso-szam::after{animation:none}
.mezo-hiba{animation:none}
.mezo-sugo-buborek{transition:none}
}
}
@layer responsive{
@media (max-width:640px){
.mezo-sugo{position:static}
.mezo-sugo-buborek{position:static;display:none;width:100%;max-width:none;
margin-top:var(--space-4);transform:none;}
.mezo-sugo-buborek::after{content:none}
.mezo-sugo:hover .mezo-sugo-buborek,
.mezo-sugo:focus-within .mezo-sugo-buborek{display:block;transform:none}
}
}
@layer components{
.konzv-bevezeto-cim{margin:0 0 var(--space-16);max-width:16ch;text-wrap:balance}
.konzv-bevezeto-lead{margin:0;color:var(--text-secondary);max-width:46ch}
.konzv-bevezeto .konzv-elonyok{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-24)}
}
@layer responsive{
@media (max-width:1024px){
.konzv-bevezeto{grid-template-columns:minmax(0,1fr);gap:var(--space-32)}
.konzv-bevezeto-cim{max-width:28ch}
}
}
@layer responsive{
@media (max-width:640px){
.konzv-bevezeto .konzv-elonyok{grid-template-columns:minmax(0,1fr);gap:var(--space-24)}
}
}
@layer responsive{
@media (max-width:760px){
body.konzv-oldal .konzv-szekcio{padding-block-start:var(--space-16)}
body.konzv-oldal .konzv-szekcio .section-eyebrow{display:none}
}
}
@layer responsive{
body.konzv-oldal .konzv-szekcio{padding-block-start:var(--space-16)}
body.konzv-oldal .konzv-szekcio .section-eyebrow{display:none}
}
@layer components{
.vizsgal-igen,.vizsgal-nem{display:inline-flex;align-items:center;justify-content:center;
width:1.6em;height:1.6em;border-radius:50%;
font-weight:600;line-height:1;}
.vizsgal-igen{background:var(--primary-soft);color:var(--primary)}
.vizsgal-nem{background:var(--surface-muted);color:var(--text-tertiary)}
.valtozas-racs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
gap:var(--space-24);margin:0;padding:0;list-style:none;}
.valtozas{display:flex;flex-direction:column;gap:var(--space-16);
background:var(--card-bg);border:1px solid var(--card-border);
border-radius:var(--card-radius);padding:var(--space-24);
box-shadow:var(--card-shadow);}
.valtozas-jel{align-self:start;margin:0;
padding:var(--space-4) var(--space-8);border-radius:var(--r-md);
background:var(--badge-bg);color:var(--badge-text);}
.valtozas-jel-uj{background:var(--primary);color:var(--on-primary)}
.valtozas-cim{margin:0;color:var(--text-primary)}
.valtozas-sor{margin:0;display:grid;grid-template-columns:auto 1fr;gap:var(--space-16)}
.valtozas-sor dt{color:var(--text-tertiary);white-space:nowrap;
font-family:var(--font-mono);font-size:var(--type-ui-caption-size);
letter-spacing:.06em;text-transform:uppercase;padding-top:var(--space-4);}
.valtozas-sor dd{margin:0;color:var(--text-secondary)}
.valtozas-sor .valtozas-ma{color:var(--text-primary)}
.valtozas-kovetkezmeny{margin:0;padding-top:var(--space-16);
border-top:1px solid var(--border);color:var(--text-secondary);}
.ttd-keplet{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:stretch;
gap:var(--space-16);margin-block:var(--space-24);}
.ttd-keplet-tag{display:grid;gap:var(--space-4);align-content:start;
padding:var(--space-16) var(--space-24);
background:var(--surface);border:1px solid var(--card-border);border-radius:var(--r-lg);}
.ttd-keplet-betu{color:var(--secondary)}
.ttd-keplet-ertek{color:var(--text-primary);margin:0}
.ttd-keplet-tag .type-ui-caption{color:var(--text-secondary)}
.ttd-keplet-jel{align-self:center;font-family:var(--font-heading);font-size:var(--space-32);
color:var(--secondary);line-height:1;}
.ttd-chipek{display:flex;flex-wrap:wrap;gap:var(--space-8);list-style:none;margin:var(--space-16) 0;padding:0}
.ttd-chip{display:inline-flex;align-items:baseline;gap:var(--space-8);
padding:var(--space-8) var(--space-16);border-radius:var(--r-lg);
background:var(--primary-soft);color:var(--text-primary);}
.ttd-chip .type-data-value{color:var(--secondary)}
.ttd-kalk{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-32);
margin-block:var(--space-24);padding:var(--space-32);
border:1px solid var(--card-border);border-radius:var(--r-xl);background:var(--surface);}
.ttd-kalk-mezok{display:grid;gap:var(--space-16);align-content:start}
.ttd-egyseg,.ttd-sugo{color:var(--text-tertiary)}
.ttd-kalk-eredmeny{display:grid;gap:var(--space-16);align-content:start;
padding:var(--space-24);border-radius:var(--r-lg);background:var(--panel-bg);}
.ttd-kalk-sor{display:grid;gap:var(--space-4)}
.ttd-kalk-sor .type-ui-caption{color:var(--text-secondary)}
.ttd-kalk-sor strong{color:var(--text-primary);margin:0;font-variant-numeric:tabular-nums}
.ttd-kalk-fo{color:var(--secondary)}
.ttd-kalk-megjegyzes{color:var(--text-secondary)}
.ttd-kalk-megjegyzes:empty{display:none}
.ttd-kalk-lab{grid-column:1 / -1;margin:0;color:var(--text-tertiary);max-width:72ch}
.ttd-sav{display:block;width:100%;height:var(--space-16);border-radius:var(--r-md);overflow:hidden}
.ttd-sav rect{transition:width var(--dur-ui) var(--ease-out),x var(--dur-ui) var(--ease-out)}
.ttd-sav-alap{fill:var(--ttd-alap);background:var(--ttd-alap)}
.ttd-sav-elszallitott{fill:var(--ttd-elszallitott);background:var(--ttd-elszallitott)}
.ttd-sav-locsolas{fill:var(--ttd-locsolas);background:var(--ttd-locsolas)}
.ttd-jelmagyarazat{display:flex;flex-wrap:wrap;gap:var(--space-8) var(--space-16);color:var(--text-secondary)}
.ttd-jelmagyarazat > span{display:inline-flex;align-items:center;gap:var(--space-4)}
.ttd-jel{display:inline-block;width:var(--space-16);height:var(--space-16);border-radius:var(--space-4)}
.ttd-gorgo:focus-visible{outline:3px solid var(--border-focus);outline-offset:2px;border-radius:var(--r-lg)}
.ttd-abra .ttd-racs{stroke:var(--border);stroke-width:1}
.ttd-abra .ttd-tengely{stroke:var(--abra-keret);stroke-width:1.5}
.ttd-oszlop-1{fill:var(--ttd-oszlop-halvany)}
.ttd-oszlop-2{fill:var(--ttd-oszlop-kozep)}
.ttd-oszlop-3{fill:var(--ttd-alap)}
.ttd-gorbe{fill:none;stroke-width:3;stroke-linecap:round}
.ttd-gorbe-1{stroke:var(--ttd-alap)}
.ttd-gorbe-2{stroke:var(--primary)}
.ttd-abra .ttd-gorbe-cimke-1{fill:var(--ttd-alap)}
.ttd-pont{stroke:var(--surface);stroke-width:2}
.ttd-pont-1{fill:var(--ttd-alap)}
.ttd-pont-2{fill:var(--primary)}
.ttd-jelolo{stroke:var(--abra-keret);stroke-width:1;stroke-dasharray:4 4}
.ttd-talaj{fill:var(--ttd-talaj)}
.ttd-talajviz{fill:var(--abra-viz)}
.ttd-terep{stroke:var(--primary);stroke-width:3}
.ttd-haz{fill:var(--surface);stroke:var(--abra-keret);stroke-width:2;stroke-linejoin:round}
.ttd-ablak{fill:var(--abra-viz);stroke:var(--abra-keret);stroke-width:1.5}
.ttd-cso{fill:none;stroke:var(--abra-keret);stroke-width:6;stroke-linecap:round}
.ttd-folyas{fill:none;stroke:var(--ttd-viz-vonal);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:6 8}
.ttd-tartaly{fill:var(--abra-badge);stroke:var(--secondary);stroke-width:2.5}
.ttd-szikkaszto{fill:var(--abra-iszap);stroke:var(--abra-keret);stroke-width:1.5;stroke-dasharray:5 4}
.ttd-szivargas{fill:none;stroke:var(--ttd-viz-vonal);stroke-width:2;stroke-dasharray:3 7;stroke-linecap:round}
.ttd-kut{fill:var(--surface);stroke:var(--text-primary);stroke-width:2}
.ttd-kut-szuro{stroke:var(--text-primary);stroke-width:1.5}
.ttd-cimkedoboz{fill:var(--surface);stroke:var(--secondary);stroke-width:1.5}
}
@layer responsive{
@media (max-width:760px){
.ttd-keplet{grid-template-columns:minmax(0,1fr)}
.ttd-keplet-jel{justify-self:center}
.ttd-kalk{grid-template-columns:minmax(0,1fr);padding:var(--space-16);gap:var(--space-24)}
.ttd-gorgo{overflow-x:auto;overscroll-behavior-x:contain}
.ttd-gorgo .abra-svg{min-width:34rem}
}
}
@layer motion{
@media (prefers-reduced-motion:no-preference){
@supports (animation-timeline: view()){
.ttd-oszlop{transform-box:fill-box;transform-origin:50% 100%;
animation:ttd-no linear both;animation-timeline:view();
animation-range:entry 10% cover 40%;}
.ttd-gorbe{stroke-dasharray:100;
animation:ttd-rajzol linear both;animation-timeline:view();
animation-range:entry 10% cover 45%;}
}
}
}
@layer motion{
@media (prefers-reduced-motion:no-preference){
.ttd-folyas{animation:ttd-folyik 1.6s linear infinite}
.ttd-szivargas{animation:ttd-folyik 2.4s linear infinite}
}
}
@layer motion{
@media (prefers-reduced-motion:reduce){
.ttd-sav rect{transition:none}
}
}
@layer components{
.dontes{display:grid;gap:var(--space-24);margin-block:var(--space-24);
padding:var(--space-24);border:1px solid var(--card-border);border-radius:var(--r-xl);
background:var(--surface);}
.dontes[hidden]{display:none}
.dontes-cim{color:var(--secondary);margin:0}
.dontes-kerdes{border:0;margin:0;padding:0;min-inline-size:0}
.dontes-kerdes[hidden]{display:none}
.dontes-kerdes legend{padding:0;color:var(--text-primary)}
.dontes-szam{color:var(--secondary);margin-inline-end:var(--space-4)}
.dontes-valasz{padding:var(--space-16) var(--space-24);border-radius:var(--r-lg);
background:var(--panel-bg);border-left:4px solid var(--primary);}
.dontes-valasz[hidden]{display:none}
.dontes-valasz p{margin:0}
.dontes-valasz p + p{margin-top:var(--space-8);color:var(--text-secondary)}
.dontes-ujra{margin:0}
.dontes-ujra[hidden]{display:none}
.levelminta{margin-block:var(--space-24);padding:var(--space-24);
border:1px solid var(--card-border);border-radius:var(--r-xl);background:var(--surface);
display:grid;gap:var(--space-16);}
.levelminta-fej{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-16)}
.levelminta-gomb[hidden]{display:none}
.levelminta-targy{margin:0;color:var(--text-secondary)}
.levelminta-szoveg{margin:0;padding:var(--space-16);border-radius:var(--r-lg);background:var(--panel-bg);
color:var(--text-primary);white-space:pre-wrap;overflow-wrap:anywhere;
font-family:var(--font-body);}
.levelminta-szoveg:focus-visible{outline:3px solid var(--border-focus);outline-offset:2px}
.levelminta-allapot{margin:0;color:var(--secondary)}
.levelminta-allapot:empty{display:none}
.levelminta-megj{margin:0;color:var(--text-tertiary)}
.ellenorzo{border:0;margin:var(--space-24) 0;padding:0;min-inline-size:0}
.ellenorzo legend{padding:0;margin-bottom:var(--space-16);color:var(--text-primary)}
.ellenorzo-lista{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-8)}
.ellenorzo-tetel label{display:flex;gap:var(--space-16);align-items:flex-start;cursor:pointer;
min-block-size:44px;padding:var(--space-8) var(--space-16);
border:1px solid var(--card-border);border-radius:var(--r-lg);background:var(--surface);
color:var(--text-secondary);}
.ellenorzo-tetel input{margin-top:.3em;inline-size:1.1rem;block-size:1.1rem;accent-color:var(--primary);flex:none}
.ellenorzo-tetel strong{color:var(--text-primary)}
.ellenorzo-tetel label:has(input:checked){background:var(--panel-bg);border-color:var(--primary)}
.ellenorzo-tetel label:has(input:focus-visible){outline:2px solid var(--border-focus);outline-offset:2px}
}
@layer responsive{
@media (max-width:760px){
.dontes,.levelminta{padding:var(--space-16)}
}
}
@layer components{
.eng-doboz{fill:var(--surface);stroke:var(--abra-keret);stroke-width:1.5}
.eng-cel{fill:var(--eng-cel-bg);stroke:var(--primary);stroke-width:2}
.eng-ce{fill:var(--surface);stroke:var(--secondary);stroke-width:1.5;stroke-dasharray:6 4}
.eng-ut{fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.eng-ut-igen{stroke:var(--primary)}
.eng-ut-nem{stroke:var(--abra-keret);stroke-dasharray:6 5}
.eng-zona{fill:none;stroke-width:2;stroke-dasharray:8 6}
.eng-zona-1{stroke:var(--eng-zona-berendezes)}
.eng-zona-2{stroke:var(--eng-zona-viz)}
.eng-zona-3{stroke:var(--eng-zona-hely)}
.eng-jel{fill:var(--secondary)}
.abra-svg .eng-jel-szam{font-family:var(--font-heading);font-size:13px;font-weight:600;fill:var(--on-secondary);}
.eng-sav{fill:var(--panel-bg);stroke:var(--card-border);stroke-width:1}
.eng-sav-tolt{fill:var(--primary)}
.eng-osztas{stroke:var(--abra-keret);stroke-width:1.5}
.eng-idovonal{stroke:var(--border-strong);stroke-width:2}
.eng-pont-mult{fill:var(--primary);stroke:var(--surface);stroke-width:2}
.eng-pont-jovo{fill:var(--surface);stroke:var(--primary);stroke-width:2.5}
.eng-agg{stroke:var(--card-border);stroke-width:1}
.eng-agg-1{fill:var(--eng-agg-1)}
.eng-agg-2{fill:var(--eng-agg-2)}
.eng-agg-3{fill:var(--eng-agg-3)}
.eng-agg-4{fill:var(--eng-agg-4)}
.abra-svg .eng-agg-cimke{font-family:var(--font-heading);font-size:13.5px;font-weight:600;fill:var(--text-primary);}
}
@layer motion{
@media (prefers-reduced-motion:no-preference){
@supports (animation-timeline: view()){
.eng-ut-igen{stroke-dasharray:100;
animation:eng-rajzol linear both;animation-timeline:view();
animation-range:entry 10% cover 40%;}
.eng-sav-tolt{transform-box:fill-box;transform-origin:0 50%;
animation:eng-telik linear both;animation-timeline:view();
animation-range:entry 15% cover 45%;}
.eng-agg{transform-box:fill-box;transform-origin:0 50%;
animation:eng-telik linear both;animation-timeline:view();
animation-range:entry 10% cover 40%;}
}
}
}
@layer components{
.lepes-jelzo{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-8) var(--space-16);
margin:0 0 var(--space-16);color:var(--text-secondary);}
.lepes-jelzo-sav{display:inline-flex;gap:var(--space-4)}
.lepes-jelzo-darab{inline-size:var(--space-24);block-size:var(--space-8);border-radius:var(--space-4);
background:var(--border);}
.lepes-jelzo-darab.is-kesz{background:var(--primary)}
.lepes-jelzo-felt{color:var(--text-tertiary)}
.lepes-tovabb{margin:var(--space-32) 0 0}
.lepes-tovabb-link{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;
gap:var(--space-4) var(--space-16);min-block-size:44px;
padding:var(--space-16) var(--space-24);
border:1px solid var(--card-border);border-left:4px solid var(--primary);
border-radius:var(--r-lg);background:var(--surface);
color:var(--text-primary);text-decoration:none;
transition:border-color var(--dur-ui) var(--ease-out),background var(--dur-ui) var(--ease-out);}
.lepes-tovabb-cimke{grid-column:1;color:var(--secondary);margin:0}
.lepes-tovabb-cim{grid-column:1;color:var(--text-primary)}
.lepes-tovabb-nyil{grid-column:2;grid-row:1 / span 2;
inline-size:var(--space-48);block-size:var(--space-48);border-radius:50%;
display:grid;place-items:center;background:var(--primary-soft);color:var(--text-primary);
font-size:var(--type-ui-body-size);
transition:transform var(--dur-ui) var(--ease-out);}
.lepes-tovabb-link:hover{border-color:var(--primary);background:var(--panel-bg)}
.lepes-tovabb-link:hover .lepes-tovabb-nyil{transform:translateY(3px)}
.lepes-tovabb-link:focus-visible{outline:3px solid var(--border-focus);outline-offset:3px}
.eng-ut-palya{fill:none;stroke:var(--border);stroke-width:10;stroke-linecap:round}
.eng-ut-vastag{stroke-width:4}
.eng-csomo-kor{fill:var(--primary);stroke:var(--surface);stroke-width:4}
.eng-csomo-felt .eng-csomo-kor{fill:var(--surface);stroke:var(--primary);stroke-width:3;stroke-dasharray:5 4}
.abra-svg .eng-csomo-szam{font-family:var(--font-heading);font-size:17px;font-weight:600;fill:var(--on-primary);}
.abra-svg .eng-csomo-szam-kicsi{font-size:14px}
.abra-svg .eng-csomo-felt .eng-csomo-szam{fill:var(--text-primary)}
.eng-ki{fill:var(--panel-bg);stroke:var(--card-border);stroke-width:1}
.abra-svg .eng-ki-szoveg{fill:var(--text-secondary)}
.eng-szunet{fill:var(--eng-szunet-bg);stroke:var(--warning-border);stroke-width:1.5;stroke-dasharray:4 3}
.eng-hiba{fill:var(--eng-hiba-bg);stroke:var(--danger-border);stroke-width:1.5}
.eng-folyamatos{fill:var(--panel-bg);stroke:var(--card-border);stroke-width:1}
.eng-oszlop-felt{fill:none;stroke:var(--border-strong);stroke-width:1;stroke-dasharray:5 4}
.eng-sav-vonal{stroke:var(--border);stroke-width:1}
.eng-szerep{stroke-width:1.5}
.eng-szerep-1{fill:var(--eng-szerep-1-bg);stroke:var(--primary)}
.eng-szerep-2{fill:var(--eng-szerep-2-bg);stroke:var(--secondary)}
.eng-szerep-3{fill:var(--eng-szerep-3-bg);stroke:var(--eng-szerep-3-keret)}
.eng-szerep-4{fill:var(--eng-szerep-4-bg);stroke:var(--border-strong);stroke-dasharray:4 3}
.abra-svg .eng-szerep-szoveg{fill:var(--text-primary);font-weight:500;font-size:11px}
}
@layer responsive{
@media (max-width:640px){
.lepes-tovabb-link{padding:var(--space-16)}
.lepes-tovabb-nyil{inline-size:var(--space-32);block-size:var(--space-32)}
}
}
@layer motion{
@media (prefers-reduced-motion:no-preference){
@supports (animation-timeline: view()){
.eng-csomo,.eng-feladat{transform-box:fill-box;transform-origin:50% 50%;
animation:eng-gyul linear both;animation-timeline:view();}
.eng-csomo-1,.eng-feladat-1{animation-range:entry 15% cover 28%}
.eng-csomo-2,.eng-feladat-2{animation-range:entry 20% cover 32%}
.eng-csomo-3,.eng-feladat-3{animation-range:entry 25% cover 36%}
.eng-csomo-4,.eng-feladat-4{animation-range:entry 30% cover 40%}
.eng-csomo-5,.eng-feladat-5{animation-range:entry 35% cover 44%}
.eng-csomo-6,.eng-feladat-6{animation-range:entry 40% cover 48%}
}
}
}
@layer motion{
@media (prefers-reduced-motion:reduce){
.lepes-tovabb-link,.lepes-tovabb-nyil{transition:none}
}
}
@layer components{
.szereplo{margin:var(--space-32) 0;display:grid;gap:var(--space-16)}
.szereplo-gorgo,
.eng-abra .ttd-gorgo{overflow-x:auto;overscroll-behavior-x:contain;
background:
linear-gradient(to right,var(--surface) 30%,transparent) left center / var(--space-48) 100% no-repeat local,
linear-gradient(to left,var(--surface) 30%,transparent) right center / var(--space-48) 100% no-repeat local,
radial-gradient(farthest-side at 0 50%,var(--szr-arnyek),transparent) left center / var(--space-16) 100% no-repeat scroll,
radial-gradient(farthest-side at 100% 50%,var(--szr-arnyek),transparent) right center / var(--space-16) 100% no-repeat scroll;
border-radius:var(--r-xl);}
.szereplo-gorgo{border:1px solid var(--card-border);background-color:var(--surface)}
.eng-abra .ttd-gorgo{border:1px solid var(--card-border);background-color:var(--surface)}
.eng-abra .abra-svg{background:transparent;border:0}
.szereplo-gorgo:focus-visible{outline:3px solid var(--border-focus);outline-offset:2px}
.szereplo-tabla{width:100%;min-width:46rem;border-collapse:separate;border-spacing:0}
.szereplo-tabla th,.szereplo-tabla td{padding:var(--space-16) var(--space-8);vertical-align:middle}
.szereplo-tabla thead th{text-align:center;vertical-align:top;border-bottom:1px solid var(--border);
padding-top:var(--space-24);}
.szereplo-tabla .szr-sarok{text-align:left;padding-left:var(--space-24);color:var(--text-tertiary)}
.szr-szam{display:grid;place-items:center;margin:0 auto var(--space-8);
inline-size:var(--space-32);block-size:var(--space-32);border-radius:50%;
background:var(--primary);color:var(--on-primary);font-weight:600;}
.szr-lepes-nev{display:block;font-family:var(--font-heading);font-weight:600;
font-size:var(--type-ui-body-size);color:var(--text-primary);}
.szr-hakell{display:block;color:var(--text-tertiary)}
.szr-felt{background:var(--szr-felt-bg)}
.szereplo-tabla thead .szr-felt{border-radius:var(--r-lg) var(--r-lg) 0 0}
.szereplo-tabla tbody tr:last-child .szr-felt{border-radius:0 0 var(--r-lg) var(--r-lg)}
.szereplo-tabla tbody th{position:sticky;left:0;z-index:1;text-align:left;
padding-left:var(--space-24);min-width:11.5rem;
background:var(--surface);}
.szereplo-tabla tbody tr + tr > *{border-top:1px solid var(--border)}
.szr-szereplo{display:flex;align-items:center;gap:var(--space-16)}
.szr-ikon{flex:none;display:grid;place-items:center;
inline-size:var(--space-48);block-size:var(--space-48);border-radius:50%;
background:var(--szr-bg);color:var(--text-primary);}
.szr-ikon .icon{width:var(--space-24);height:var(--space-24)}
.szr-nev-blokk{display:grid}
.szr-nev{font-family:var(--font-heading);font-weight:600;color:var(--text-primary)}
.szr-al{color:var(--text-secondary)}
.szereplo-tabla td{text-align:center}
.szr-feladat{display:inline-flex;align-items:center;justify-content:center;
min-block-size:var(--space-32);padding:var(--space-4) var(--space-16);
border-radius:var(--r-md);border:1.5px solid var(--szr-szin);background:var(--szr-bg);
color:var(--text-primary);font-size:var(--type-ui-caption-size);font-weight:600;
white-space:nowrap;}
.szr-sor-1{--szr-szin:var(--primary);--szr-bg:var(--eng-szerep-1-bg)}
.szr-sor-2{--szr-szin:var(--secondary);--szr-bg:var(--eng-szerep-2-bg)}
.szr-sor-3{--szr-szin:var(--eng-szerep-3-keret);--szr-bg:var(--eng-szerep-3-bg)}
.szr-sor-4{--szr-szin:var(--border-strong);--szr-bg:var(--eng-szerep-4-bg)}
.szr-sor-4 .szr-feladat{border-style:dashed}
.eng-abra .abra-svg .abra-cimke-eros{font-size:14.5px}
.eng-abra .abra-svg .abra-cimke{font-size:13px;fill:var(--text-secondary)}
.eng-abra .abra-svg .abra-jegyzet{font-size:12.5px;fill:var(--text-secondary)}
.eng-abra .abra-felirat{max-width:72ch}
.szereplo .abra-felirat{max-width:72ch}
.gorgo-sugo{display:none;margin:0;color:var(--text-tertiary)}
}
@layer responsive{
@media (max-width:760px){
.eng-abra .ttd-gorgo .abra-svg{min-width:42rem}
.gorgo-sugo{display:block}
.szereplo-tabla tbody th{min-width:8.5rem;padding-left:var(--space-16)}
.szr-szereplo{flex-direction:column;align-items:flex-start;gap:var(--space-4)}
.szr-nev{white-space:nowrap}
.szr-ikon{inline-size:var(--space-32);block-size:var(--space-32)}
.szr-ikon .icon{width:var(--space-16);height:var(--space-16)}
}
}
@layer motion{
@media (prefers-reduced-motion:no-preference){
@supports (animation-timeline: view()){
.szr-feladat{animation:eng-gyul linear both;animation-timeline:view();animation-range:entry 10% cover 30%}
.szereplo-tabla td:nth-child(3) .szr-feladat{animation-range:entry 14% cover 33%}
.szereplo-tabla td:nth-child(4) .szr-feladat{animation-range:entry 18% cover 36%}
.szereplo-tabla td:nth-child(5) .szr-feladat{animation-range:entry 22% cover 39%}
.szereplo-tabla td:nth-child(6) .szr-feladat{animation-range:entry 26% cover 42%}
.szereplo-tabla td:nth-child(7) .szr-feladat{animation-range:entry 30% cover 45%}
}
}
}
@layer components{
.eng-folyo-meder{fill:none;stroke:var(--eng-viz-meder);stroke-width:20;stroke-linecap:round}
.eng-ut.eng-folyo{stroke:var(--eng-viz);stroke-width:9}
.eng-folyo-fodor{fill:none;stroke:var(--eng-viz-fodor);stroke-width:1.6;stroke-linecap:round;
stroke-dasharray:7 9 2 14 11 13;}
.eng-folyo-fodor-2{stroke-width:1.2;stroke-dasharray:3 17 14 22;opacity:.65}
.eng-csomo-halo{fill:var(--eng-csomo-halo)}
.eng-csomo-kor{stroke-width:3}
.eng-csomo-feny{fill:none;stroke:var(--eng-csomo-feny);stroke-width:1.5}
.eng-csomo-felt .eng-csomo-halo{fill:none}
.eng-csomo-felt .eng-csomo-feny{display:none}
.abra-svg .eng-csomo-szam{font-family:var(--font-body);font-size:18px;font-weight:600;
font-variant-numeric:lining-nums tabular-nums;}
.eng-abra .abra-svg text{font-variant-numeric:lining-nums}
}
@layer motion{
@media (prefers-reduced-motion:no-preference){
.eng-folyo-fodor{animation:eng-sodor 3.4s linear infinite}
.eng-folyo-fodor-2{animation-duration:5.8s}
}
}
@layer motion{
@media (prefers-reduced-motion:reduce){
.eng-folyo-fodor{display:none}
}
}