/* MARKETING OS -- VIZUÁLIS JAVÍTÁS (üzenet- és szerkesztő-képernyők): minden képernyő és belső nézet olvasható és elérhető desktopon,
   laptopon, tableten és telefonon. Ez a fájl a live-f1.css UTÁN töltődik (név szerinti sorrend), ezért a prototípus (#s-N azonosítós) szabályait is
   felülírja. Desktopon (>= 1280 px) a külalak változatlan marad: minden szabály szűk nézetre (@media) vagy csak hibás állapotra vonatkozik. */

/* ── S-1: a prototípus .view { min-width: 960px } szabálya a szűk nézeten vízszintes görgetést ad; a saját képernyőinken nincs rá szükség ── */
@media (max-width: 1100px) {
  .view[data-route="kimeno"], .view[data-route="hirlevel"], .view[data-route="flow"], .view[data-route="flowk"], .view[data-route="szoveg"], .view[data-route="oldal"],
  .view[data-route="urlap"], .view[data-route="felmeres"], .view[data-route="felmeresek"], .view[data-route="beszelgetesek"], .view[data-route="blog"],
  .view[data-route="landing"], .view[data-route="whatsapp"] { min-width: 0; }
  .view[data-route="kimeno"] > .content, .view[data-route="hirlevel"] > .content, .view[data-route="flowk"] > .content, .view[data-route="blog"] > .content,
  .view[data-route="landing"] > .content, .view[data-route="whatsapp"] > .content, .view[data-route="felmeresek"] > .content, .view[data-route="beszelgetesek"] > .content { min-width: 0; max-width: 100%; box-sizing: border-box; }
}

/* ── Telefonos „Szerkesztés asztali gépen” üzenet: a leállító gomb felirata ne tűnjön el (a prototípus telefonon elrejti a .p-kl feliratot), az üzenet maradjon a képernyőn ── */
@media (max-width: 860px) {
  .mos-desk-msg .mos-desk-kill .p-kl { display: inline; }
  .mos-desk-msg { box-sizing: border-box; max-width: calc(100vw - 32px); }
  .mos-desk-msg .btn, .mos-desk-msg .kill { vertical-align: middle; }
}

/* ══ KIMENŐ ══════════════════════════════════════════════════════════════════════════════════════════════════════ */
/* A címzett-szám és a „címzett” szó egy sorban („42 címzett”), nem két külön sorban: a .mb-to span { display: block } a számot is blokkká tette. */
.mos-kim .mb-to b .num { display: inline; font-size: inherit; color: inherit; }
/* A naptár állapot-jelvénye ne lógjon ki a napi kártyából (a prototípus nowrap), a nap-oszlop szűkülhessen. */
#s-5 .kc-i { min-width: 0; overflow-wrap: anywhere; }
#s-5 .kc-i .pill, #s-5 .kc-i .mx-st { max-width: 100%; white-space: normal; align-self: flex-start; }

/* Tableten és telefonon (<= 1100 px) a lista kártyasor: a hat oszlopos tábla (a prototípus min-width-jeivel) szélesebb a kártyánál, és a Művelet oszlop elérhetetlen volt.
   A live-f1.css ugyanezt csak <= 767 px-en adja; itt a tablet sávra is kiterjesztjük, és a prototípus #s-5 azonosítós szabályait azonos súllyal semlegesítjük. */
@media (max-width: 1100px) {
  #s-5 .mb-q td.mb-to, #s-5 .mb-q td.mb-mat { min-width: 0; }
  #s-5 .mb-q td.mb-to b { white-space: normal; }
  .mos-kim table.mb-q, .mos-kim table.mb-q tbody { display: block; }
  .mos-kim table.mb-q thead { display: none; }
  .mos-kim table.mb-q tr { display: grid; grid-template-columns: 78px minmax(0, 1fr); gap: 2px 10px; padding: 10px 14px; border-top: 1px solid var(--border); }
  .mos-kim table.mb-q tr.mb-day { display: block; padding: 0; border-top: 0; }
  .mos-kim table.mb-q td { display: block; min-width: 0; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; overflow-wrap: anywhere; }
  .mos-kim table.mb-q tr.mb-day td { background: var(--surface-2) !important; padding: 6px 14px !important; }
  .mos-kim table.mb-q td.mb-t { grid-row: 1 / span 2; }
  .mos-kim table.mb-q td:nth-child(2), .mos-kim table.mb-q td:nth-child(3), .mos-kim table.mb-q td:nth-child(4), .mos-kim table.mb-q td:nth-child(5), .mos-kim table.mb-q td.r { grid-column: 2; }
  .mos-kim table.mb-q td.r { text-align: left; margin-top: 6px; }
  /* egyetlen háttér a soron (nem cellánként), a bal sáv a soron: a sárga „vár” sor egy darab */
  #s-5 .mb-q tr.mb-need { background: color-mix(in srgb, var(--warn-bg) 50%, var(--surface)); box-shadow: inset 3px 0 0 var(--warn); }
  #s-5 .mb-q tr.mb-need.sel, #s-5 .mb-q tr.mb-focus { background: color-mix(in srgb, var(--warn-bg) 90%, var(--surface)); }
  #s-5 .mb-q tr.mb-stop { box-shadow: inset 3px 0 0 var(--border-strong); }
  #s-5 .mb-q tr.mb-gone { opacity: .62; }
  #s-5 .mb-q tr.mb-gone td { opacity: 1; }
  .mos-kim table.mb-q .mb-ch { white-space: normal; }
  /* a művelet-ikonok szöveges címkével (title) és ujjnyi célponttal: ne kelljen találgatni, mi a visszahúzás és a leállítás */
  .mos-kim .mb-ibs { display: flex; flex-wrap: wrap; gap: 6px; }
  .mos-kim .mb-ib { width: auto; min-height: 36px; padding: 0 12px 0 10px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--border); border-radius: 10px; font-size: 13px; color: var(--text-2); }
  .mos-kim .mb-ib::after { content: attr(aria-label); }
  .mos-kim table.mb-q .pill { white-space: normal; }
}

/* Naptár: a prototípus 7 oszlopos, vízszintesen görgetett sávja (#s-5 .kc-grid, 1,1,0) felülírta a live-f1 egyoszlopos szabályát. */
@media (max-width: 767px) {
  #s-5 .kc-grid { grid-template-columns: minmax(0, 1fr); overflow-x: visible; gap: 10px; padding: 10px 12px 14px; }
  #s-5 .kc-d:not(:has(.kc-i)) { flex-direction: row; align-items: baseline; gap: 10px; }
  #s-5 .kc-d:not(:has(.kc-i)) .kc-h { border-bottom: 0; padding-bottom: 0; }
}
@media (min-width: 768px) and (max-width: 1100px) {
  #s-5 .kc-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); overflow-x: visible; }
}
/* Szűrő-sáv: a chipek törjenek, és legyen ujjnyi célpontjuk */
@media (max-width: 1100px) {
  .mos-kim .card-h { flex-wrap: wrap; gap: 6px 12px; }
  .mos-kim .card-h .mb-hint { flex: 1 1 100%; }
  .mos-kim .chip, .mos-kim .seg > span { min-height: 36px; display: inline-flex; align-items: center; }
}

/* ══ KÖZÖS: oldalfej, kártyafej, sorok (hirlevel, flowk, flow, blog, landing, whatsapp, felmeresek, beszelgetesek) ═══════════════════════ */
@media (max-width: 1100px) {
  /* az oldalfej (cím + leírás | gombok) törjön, a cím ne szoruljon egy keskeny oszlopba */
  .view[data-route="hirlevel"] .page-h, .view[data-route="flowk"] .page-h, .view[data-route="blog"] .page-h, .view[data-route="landing"] .page-h, .view[data-route="whatsapp"] .page-h,
  .view[data-route="felmeresek"] .page-h, .view[data-route="beszelgetesek"] .page-h, .view[data-route="felmeres"] .page-h, .view[data-route="flow"] .page-h { flex-wrap: wrap !important; gap: 8px 16px; }
  .view[data-route="hirlevel"] .page-h > div:first-child, .view[data-route="flowk"] .page-h > div:first-child, .view[data-route="blog"] .page-h > div:first-child, .view[data-route="landing"] .page-h > div:first-child,
  .view[data-route="whatsapp"] .page-h > div:first-child, .view[data-route="felmeresek"] .page-h > div:first-child, .view[data-route="beszelgetesek"] .page-h > div:first-child,
  .view[data-route="felmeres"] .page-h > div:first-child, .view[data-route="flow"] .page-h > div:first-child { flex: 1 1 320px; min-width: 0; }
  .view[data-route="hirlevel"] .page-h .act, .view[data-route="flowk"] .page-h .act, .view[data-route="blog"] .page-h .act, .view[data-route="landing"] .page-h .act, .view[data-route="whatsapp"] .page-h .act,
  .view[data-route="felmeresek"] .page-h .act, .view[data-route="beszelgetesek"] .page-h .act, .view[data-route="felmeres"] .page-h .act { flex-wrap: wrap; }
}
/* Kártyafej: a cím egy sorban marad, a magyarázó szürke szöveg külön sorba törik, ha nem fér mellé (nem szorul 80 px-es oszlopba), a művelet jobbra áll */
.view[data-route="hirlevel"] .card-h, .view[data-route="flowk"] .card-h, .view[data-route="blog"] .card-h, .view[data-route="landing"] .card-h, .view[data-route="whatsapp"] .card-h,
.view[data-route="felmeresek"] .card-h, .view[data-route="felmeres"] .card-h, .view[data-route="beszelgetesek"] .card-h { flex-wrap: wrap; row-gap: 4px; }
.view[data-route="hirlevel"] .card-h > h4, .view[data-route="flowk"] .card-h > h4, .view[data-route="blog"] .card-h > h4, .view[data-route="landing"] .card-h > h4, .view[data-route="whatsapp"] .card-h > h4,
.view[data-route="felmeresek"] .card-h > h4, .view[data-route="felmeres"] .card-h > h4, .view[data-route="beszelgetesek"] .card-h > h4 { flex: 0 0 auto; max-width: 100%; }
.view[data-route="hirlevel"] .card-h > .muted, .view[data-route="flowk"] .card-h > .muted, .view[data-route="blog"] .card-h > .muted, .view[data-route="landing"] .card-h > .muted, .view[data-route="whatsapp"] .card-h > .muted,
.view[data-route="felmeresek"] .card-h > .muted, .view[data-route="felmeres"] .card-h > .muted, .view[data-route="beszelgetesek"] .card-h > .muted { flex: 1 1 16ch; min-width: 0; }
.view[data-route="hirlevel"] .card-h .r, .view[data-route="flowk"] .card-h .r, .view[data-route="blog"] .card-h .r, .view[data-route="landing"] .card-h .r, .view[data-route="whatsapp"] .card-h .r,
.view[data-route="felmeresek"] .card-h .r, .view[data-route="felmeres"] .card-h .r, .view[data-route="beszelgetesek"] .card-h .r { flex-wrap: wrap; justify-content: flex-end; }

/* Üres állapot és magyarázó bekezdés a kártyákban: a törzsszöveggel azonos méret (a .muted bekezdés 17 px-es volt) */
.view[data-route="landing"] .card-b > p.muted, .view[data-route="whatsapp"] .card-b > p.muted, .view[data-route="hirlevel"] .card-b > p.muted, .view[data-route="blog"] .card-b > p.muted { font-size: 15px; line-height: 1.5; }

/* Hírlevél- / üzenetsor (72 px dátum-csempe | cím | állapot): a csempe a dátum szövegét középen tartja (nem üres doboz), a cím oszlop szűkülhet és törhet */
.mx-nl-r { grid-template-columns: 72px minmax(0, 1fr) auto; }
.mx-nl-r > div:nth-child(2) { min-width: 0; overflow-wrap: anywhere; }
.mx-nl-r > .mx-nlp { height: auto; min-height: 44px; align-self: start; justify-content: center; align-items: center; }
.mx-nl-r .pill { white-space: nowrap; }
.mx-stp { grid-template-columns: 70px minmax(0, 1fr) auto; }
.mx-stp > div:nth-child(2) { min-width: 0; overflow-wrap: anywhere; }
.mx-pg { grid-template-columns: 96px minmax(0, 1fr); }
.mx-pgb b { overflow-wrap: anywhere; }
.mx-war { grid-template-columns: 96px minmax(0, 220px) minmax(0, 1fr); }
@media (max-width: 900px) {
  .mx-nl-r .pill { white-space: normal; justify-self: end; text-align: center; }
  .fl-hd { display: none; }
  .fl-row { grid-template-columns: minmax(0, 1fr) auto; }
  .mx-war { grid-template-columns: 90px minmax(0, 1fr); }
  .mx-war > div:last-child { grid-column: 1 / -1; }
}
@media (max-width: 700px) {
  .mx-nl-r { grid-template-columns: 56px minmax(0, 1fr); }
  .mx-nl-r > .mx-nlp { width: 56px; }
  .mx-nl-r .pill { grid-column: 2; justify-self: start; text-align: left; }
  .mx-stp { grid-template-columns: minmax(0, 1fr); }
  .mx-stp .mx-acts { margin-top: 4px; }
  .mx-pages, .mx-flows, .mx-wad { grid-template-columns: minmax(0, 1fr); }
  .mx-pg { grid-template-columns: minmax(0, 1fr); }
  .mx-pgv { height: 72px; }
  .fl-row .btn { justify-self: start; }
  .bl-row { grid-template-columns: minmax(0, 1fr) auto !important; row-gap: 6px; }
  .bl-row > :first-child { grid-column: 1 / -1; }
}

/* Kétoszlopos elrendezések szűk nézeten: a prototípus 1fr sávja a tartalom természetes szélességére nyúlt (landing: 560 px egy 390 px-es kijelzőn); minmax(0, 1fr) + min-width: 0 */
@media (max-width: 1100px) {
  .view[data-route="hirlevel"] .mx-two, .view[data-route="landing"] .mx-two, .view[data-route="whatsapp"] .mx-two, .view[data-route="flowk"] .mx-two, .view[data-route="blog"] .mx-two,
  .view[data-route="felmeresek"] .mg-top, .view[data-route="beszelgetesek"] .f2-chat { grid-template-columns: minmax(0, 1fr); }
  .view[data-route="hirlevel"] .mx-two > *, .view[data-route="landing"] .mx-two > *, .view[data-route="whatsapp"] .mx-two > *, .view[data-route="flowk"] .mx-two > *, .view[data-route="blog"] .mx-two > *,
  .view[data-route="felmeresek"] .mg-top > *, .view[data-route="beszelgetesek"] .f2-chat > * { min-width: 0; }
}

/* Széles táblák szűk nézeten: vízszintesen görgethetők, a jobb szélükön belső árnyék jelzi, hogy van még tartalom */
@media (max-width: 700px) {
  .view[data-route="landing"] .mos-live-root table.tbl, .view[data-route="flowk"] .mos-live-root table.tbl, .view[data-route="whatsapp"] .mos-live-root table.tbl { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}
@media (max-width: 1100px) {
  .view[data-route="felmeresek"] .mos-live-root table.tbl { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}
@media (max-width: 1100px) {
  .view[data-route="felmeresek"] .mos-live-root table.tbl, .view[data-route="landing"] .mos-live-root table.tbl, .view[data-route="flowk"] .mos-live-root table.tbl, .view[data-route="whatsapp"] .mos-live-root table.tbl { box-shadow: inset -12px 0 10px -10px rgba(0, 0, 0, .22); }
}

/* ══ SZERKESZTŐK (szoveg, flow, oldal, urlap): lista / üres állapot oldalkitöltése; felső sáv törése ═════════════════════════════════ */
/* A prototípus a szerkesztő képernyőkön elrejti az oldalsávot és a felső sávot (teljes képernyős szerkesztő: V10:L437, WP57), és ez az üres állapotban (nincs megnyitott anyag) is így marad.
   Az út vissza ott sem hiányzik: a kreatív, a flow, a landing- és az űrlapszerkesztő üres állapotának saját „← Kilépés / Vissza” gombja van, a szövegszerkesztőének pedig az app.js
   paintEditorExit() adja (data-testid="editor-empty-exit"). Telefonon a „Szerkesztés asztali gépen” üzenet mellett viszont maradjon felső sáv és menü (menü, keresés, értesítések). */
@media (max-width: 767px) {
  body:has(:is(#s-20, #s-9, #s-10, #s-10f).mos-desk-only:not([hidden])) .proto .side, body:has(:is(#s-20, #s-9, #s-10, #s-10f).mos-desk-only:not([hidden])) .proto .top { display: flex !important; }
}
.mos-ed-exit { display: flex; }
:is(#s-20, #s-9, #s-10, #s-10f) > .mos-live-root:has(> .page-h) { box-sizing: border-box; width: auto; max-width: 1320px; min-height: 0; padding: 20px; gap: 16px; display: flex; flex-direction: column; }
:is(#s-20, #s-9, #s-10, #s-10f) > .mos-live-root:has(> .page-h) > .page-h { position: static; margin: 0; padding: 0; background: none; border: 0; }
.f3a-flow > .btn { align-self: flex-start; }
@media (max-width: 767px) { :is(#s-20, #s-9, #s-10, #s-10f) > .mos-live-root:has(> .page-h) { padding: 16px; } }

/* A szövegszerkesztő / flow felső sávja szűk nézeten törik (56 px-es fix magasság helyett legalább 56 px): a „Kimenőbe” és a „Teszt magamnak” mindig látszik, a cím nem szorul 100 px-re */
@media (max-width: 1100px) {
  #s-20 .le-top, #s-9 .le-top { height: auto; min-height: 56px; flex-wrap: wrap; row-gap: 8px; padding: 8px 14px; }
  #s-20 .le-top .le-name, #s-9 .le-top .le-name { flex: 1 1 220px; min-width: 0; }
  #s-20 .le-top .le-mid, #s-9 .le-top .le-mid { flex-wrap: wrap; margin: 0; }
  #s-20 .le-top .le-act, #s-9 .le-top .le-act { flex-wrap: wrap; margin-left: auto; justify-content: flex-end; }
  #s-20 .le-name b { max-width: 100%; }
  .f3a-flow .content, #s-9 > .content { min-width: 0; max-width: 100%; }
}

/* ══ FELMÉRÉS (szerkesztő + előnézet) ═══════════════════════════════════════════════════════════════════════════════════════ */
/* A kétoszlopos szerkesztő | előnézet nem törtt: az előnézet 355-390 px-es lett, a levágott hosszú URL-lel */
@media (max-width: 1280px) { .mg-ed { grid-template-columns: minmax(0, 1fr); } }
.mg-mail a, .mg-mail p, .mg-mail div, .mg-xs, .mg-prev, .view[data-route="felmeres"] .alert a, .view[data-route="felmeres"] .banner a { overflow-wrap: anywhere; word-break: break-word; }
.view[data-route="felmeres"] .mos-live-root a { color: var(--primary); text-decoration: underline; }
@media (max-width: 1100px) {
  .view[data-route="felmeres"] .mos-live-root, .view[data-route="felmeres"] .mos-live-root .card, .view[data-route="felmeres"] .mos-live-root .stack { min-width: 0; }
}

/* ══ KIKAPCSOLT / TILTOTT ÁLLAPOT: az űrlap-előnézet szürkéi (a prototípus #8a837c-je 3,7:1 volt) ═════════════════════════════════════════════ */
.fe-form .fe-in, .fe-form .fe-consent em { color: var(--muted); }

/* ══ BESZÉLGETÉSEK ════════════════════════════════════════════════════════════════════════════════════════════════════════ */
@media (max-width: 1100px) {
  .f2-chat { grid-template-columns: minmax(0, 260px) minmax(0, 1fr); }
  .f2-chat > .f2-side { grid-column: 1 / -1; }
}
@media (max-width: 900px) { .f2-chat { grid-template-columns: minmax(0, 1fr); } }
.f2-chat .f2-pane, .f2-chat .f2-pane-b { min-width: 0; overflow-wrap: anywhere; }

/* ══ ÉRINTÉSI CÉLPONTOK: a közös szabály után megmaradt kezelők (eszköztár, lépés- és nyelvfülek) ════════════════════════════════════════════ */
@media (max-width: 1100px), (pointer: coarse) {
  .tx-tb span, .tx-tb-nl, .fo-sh, .f3b-steps > span, .f2-x, .tx-lang span, .f3b-tabs span { min-height: 36px; display: inline-flex; align-items: center; box-sizing: border-box; }
}

/* ══ ALSÓ KITÖLTÉS TELEFONON: a body padding-bottom-ját a keret magassága elnyeli, ezért az utolsó sor az alsó fülsáv alá került ═══════════════════════════════ */
@media (max-width: 767px) {
  /* Általános: a body padding-bottom-ja nem számít (a body fix magasságú, a tartalom túlfolyik rajta), ezért minden élő képernyő saját alja a fülsáv (56 px) fölé ér; a lentebbi, útvonalas szabályok erősebbek */
  .view > .mos-live-root { padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }
  .view[data-route="hirlevel"] > .mos-live-root, .view[data-route="flowk"] > .mos-live-root, .view[data-route="blog"] > .mos-live-root, .view[data-route="landing"] > .mos-live-root,
  .view[data-route="beszelgetesek"] > .mos-live-root, .view[data-route="felmeresek"] > .mos-live-root, .view[data-route="whatsapp"] > .mos-live-root, .view[data-route="kimeno"] > .mos-live-root { padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px)); }
  .view[data-route="flowk"] > .content:not(.mos-live-root), .view[data-route="blog"] > .content:not(.mos-live-root) { padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px)); }
  /* iOS: 16 px alatti beviteli mezőre fókuszkor a böngésző ráközelít */
  .f2-in, .f2-search, select.f2-in, textarea.f2-in, .f2-chat input, .f2-chat select, .f2-chat textarea { font-size: 16px; }
  .mos-desk-msg .mos-desk-kill { min-height: 36px; display: inline-flex; align-items: center; padding: 0 12px; }
}

/* ══ ÉRINTÉSI CÉLPONTOK 2.: a maradék kezelők a saját képernyőinken (a nyomógomb / chip / szegmens közös szabálya a közös rétegé) ═════════════════════════════════════ */
@media (max-width: 1100px), (pointer: coarse) {
  :is(.view[data-route="kimeno"], .view[data-route="hirlevel"], .view[data-route="flow"], .view[data-route="flowk"], .view[data-route="szoveg"], .view[data-route="oldal"], .view[data-route="urlap"], .view[data-route="felmeres"], .view[data-route="felmeresek"], .view[data-route="beszelgetesek"], .view[data-route="blog"], .view[data-route="landing"], .view[data-route="whatsapp"]) :is(.ptr, .mos-link, .rb-del, .f3b-x, .tx-xtab, .f2-x) { min-height: 36px; display: inline-flex; align-items: center; box-sizing: border-box; }
  /* a flow szerkesztő „← Flow-k” és a telefonos „Vissza a Mai napomra” gombja */
  .view[data-route="flow"] :is(.btn, .mos-desk-msg .btn) { min-height: 36px; display: inline-flex; align-items: center; box-sizing: border-box; }
  :is(.view[data-route="kimeno"], .view[data-route="hirlevel"], .view[data-route="flow"], .view[data-route="flowk"], .view[data-route="szoveg"], .view[data-route="oldal"], .view[data-route="urlap"], .view[data-route="felmeres"], .view[data-route="felmeresek"], .view[data-route="beszelgetesek"], .view[data-route="blog"], .view[data-route="landing"], .view[data-route="whatsapp"]) :is(.rb-del, .f3b-x, .f2-x) { min-width: 36px; justify-content: center; }
  .mos-modal .mos-x, .mos-dlg .mos-x { min-width: 36px; min-height: 36px; display: inline-flex; align-items: center; justify-content: center; }
}

/* Beszélgetések: a résztvevő sorában az eltávolító × a név mellett, jobbra marad (a hosszú ügynök-leírás ne tegye új sorba); a gombok rendes másodlagos gombok */
.f2-part { flex-wrap: nowrap; align-items: flex-start; }
.f2-part .n { flex: 1 1 0; min-width: 0; overflow-wrap: anywhere; }
.f2-part .f2-x { flex: none; margin-left: auto; }
.f2-pane-b .btn.btn-s, .f2-pane-b .btn.btn-sm { padding: 6px 14px; min-height: 32px; display: inline-flex; align-items: center; justify-content: center; }

/* Felmérések: a hiány-javaslat címe balra a szövegével, a sorszám-karika olvasható (sötét szám a halvány karikán); a hosszú ablaktörzs ne görgesse a mögötte álló oldalt */
.mg-gh { justify-content: flex-start; text-align: left; }
.mg-pin { color: var(--text); font-weight: 700; }
.mos-modal-b { overscroll-behavior: contain; }

/* ══ VIZUÁLIS JAVÍTÁS 2. KÖR (tablet + telefon) ═══════════════════════════════════════════════════════════════════════════════════════ */
/* FLOW tableten (<= 1200 px): a prototípus elrejti a palettát, de a `72px minmax(0,1fr)` kétoszlopos rácsot megtartja, így a vászon kártyája a 72 px-es oszlopba esett (a lépések
   olvashatatlanok). Egyoszlopos rács; a paletta (a lépések hozzáadásának egyetlen útja) vízszintes sávként a vászon fölött marad. */
@media (max-width: 1200px) {
  #s-9 .mc-split.fl-ed { grid-template-columns: minmax(0, 1fr) !important; }
  #s-9 .fl-ed > .fl-pal { display: flex !important; flex-direction: row; flex-wrap: wrap; position: static; padding: 8px; gap: 8px; }
  #s-9 .fl-ed > .fl-pal .fl-pi { flex: 1 1 72px; min-width: 72px; max-width: 120px; min-height: 44px; box-sizing: border-box; }
  #s-9 .fl-ed > .card { min-width: 0; min-height: 0; }
  #s-9 .fl-ed .mc-canvas { min-width: 0; min-height: 0; }
  #s-9 .fl-ed .mc-node { max-width: 100%; }
}

/* A telefonos „Szerkesztés asztali gépen” üzenet és az Azonnali döntés ■ gombja: a prototípus `.proto .kill span.p-kl { display: none }` (0,3,1) erősebb volt a z1 első szabályánál, ezért üres téglalap maradt */
@media (max-width: 860px) {
  .mos-desk-kill span.p-kl, .imm-kill span.p-kl { display: inline !important; }
}

/* Értesítések ablak telefonon: a prototípus a harang jobb széléhez igazítja (right = ablakszélesség - harang), így a 358 px széles doboz balra kilógott. Itt a két szélhez igazodik. */
@media (max-width: 767px) {
  .p-pop { left: 8px !important; right: 8px !important; width: auto; max-width: calc(100vw - 16px); box-sizing: border-box; }
}

/* Súgó-panel telefonon: a panel alja a fix alsó fülsáv fölött ér véget (a fülsáv alá görgetett tartalom takart volt), a „Vissza / Tovább” sáv is látszik */
@media (max-width: 767px) {
  .p-guide { height: auto; bottom: var(--tabbar-h); } /* a fülsáv fix magassága (live-f1.css): nem becsült 56 px, hanem a valódi */
}

/* Szövegszerkesztő tableten / telefonon (<= 1100 px): a bal oszlop (Felépítés, Verziók) és az AI-segéd sáv szélről szélig fehér volt, a szerkesztő szürke háttéren 28 px-es kitöltéssel;
   egyező kártyakeret és 16 px-es oldalkitöltés mindháromnak. */
@media (max-width: 1100px) {
  .f3a-tx .tx-left, .f3a-tx .tx-right { margin: 12px 16px; border: 1px solid var(--border); border-radius: var(--r-lg); box-sizing: border-box; }
  .f3a-tx .tx-main-col { padding-left: 16px; padding-right: 16px; }
  .f3a-tx .tx-main-col > .tx-tb, .f3a-tx .tx-main-col > .tx-meta, .f3a-tx .tx-main-col > .tx-doc { max-width: none; }
}