:root {
  --navy: #1f2a44;
  --ink: #1d2433;
  --muted: #6b7385;
  --line: #e3e6ee;
  --bg: #ffffff;
  --bg2: #f5f6fa;
  --primary: #ff5a5f;
  --primary-d: #e2474c;
  --seen: #e8485f;
  --trip: #2f6fed;
  --place: #e8900c;
  --ok: #1f9d55;
  --radius: 14px;
  --shadow: 0 6px 24px rgba(20, 30, 60, .18);
  --safe-b: env(safe-area-inset-bottom, 0px);
  --nav-h: 64px;
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; overflow: hidden; background: var(--bg); color: var(--ink);
  font: 15px/1.45 system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }
button { font: inherit; cursor: pointer; color: inherit; }
input, select, textarea { font: inherit; color: inherit; }
[hidden] { display: none !important; }
a { color: var(--trip); }
.muted { color: var(--muted); }
.small { font-size: 13px; }
.error { color: #c0262d; background: #fdecec; padding: 8px 12px; border-radius: 10px; }

#map { position: fixed; inset: 0 0 calc(var(--nav-h) + var(--safe-b)) 0; z-index: 1; background: #e9eef3; }

/* ---------- Felső sáv ---------- */
#topbar { position: fixed; top: 10px; left: 10px; right: 10px; z-index: 500; display: flex; gap: 8px; align-items: center; }
.brand { display: flex; align-items: center; gap: 8px; background: var(--navy); color: #fff; padding: 6px 12px 6px 6px;
  border-radius: 999px; box-shadow: var(--shadow); font-weight: 700; letter-spacing: .2px; flex: none; }
.brand img { width: 30px; height: 30px; border-radius: 50%; }
.search { position: relative; flex: 1; min-width: 0; }
.search input { width: 100%; height: 42px; border: 0; border-radius: 999px; padding: 0 16px; background: #fff; box-shadow: var(--shadow); outline: none; }
.search input:focus { box-shadow: var(--shadow), 0 0 0 2px var(--trip); }
.search-results { position: absolute; top: 48px; left: 0; right: 0; background: #fff; border-radius: 12px; box-shadow: var(--shadow); overflow: hidden; max-height: 50vh; overflow-y: auto; }
.search-results button { display: block; width: 100%; text-align: left; padding: 10px 14px; border: 0; background: none; border-bottom: 1px solid var(--line); }
.search-results button:hover { background: var(--bg2); }
.search-results small { color: var(--muted); display: block; }
.chip-btn { display: flex; align-items: center; gap: 6px; height: 42px; padding: 0 14px; border: 0; border-radius: 999px; background: #fff; box-shadow: var(--shadow); white-space: nowrap; flex: none; }
.chip-btn .ic { font-size: 16px; }
@media (max-width: 560px) { .brand span { display: none; } .brand { padding: 6px; } #filterLabel { max-width: 90px; overflow: hidden; text-overflow: ellipsis; } }

#mapTools { position: fixed; right: 12px; bottom: calc(var(--nav-h) + var(--safe-b) + 16px); z-index: 450; display: flex; flex-direction: column; gap: 10px; }
.round-btn { width: 46px; height: 46px; border-radius: 50%; border: 0; background: #fff; box-shadow: var(--shadow); font-size: 20px; }
.round-btn.on { background: var(--navy); color: #fff; }
.toast-hint { pointer-events: none; position: fixed; left: 50%; transform: translateX(-50%); top: 64px; z-index: 450; background: rgba(31,42,68,.9); color: #fff; padding: 6px 14px; border-radius: 999px; font-size: 13px; }

/* ---------- Alsó navigáció ---------- */
#bottomnav { position: fixed; left: 0; right: 0; bottom: 0; height: calc(var(--nav-h) + var(--safe-b)); padding-bottom: var(--safe-b);
  z-index: 800; background: #fff; border-top: 1px solid var(--line); display: flex; align-items: center; justify-content: space-around; }
#bottomnav button { position: relative; flex: 1; height: 100%; border: 0; background: none; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; font-size: 13px; font-weight: 600; color: #3a4256; letter-spacing: .1px; }
#bottomnav button .ic { font-size: 22px; filter: grayscale(1); opacity: .8; }
#bottomnav button.active { color: var(--primary-d); font-weight: 800; }
#bottomnav button.active .ic { filter: none; opacity: 1; }
#bottomnav .fab { flex: none; width: 58px; height: 58px; margin-top: -26px; border-radius: 50%; background: var(--primary); color: #fff; font-size: 30px; box-shadow: 0 6px 18px rgba(255,90,95,.5); }
#bottomnav .fab:active { transform: scale(.96); }
#unreadBadge { position: absolute; top: 6px; left: 55%; background: var(--primary); color: #fff; font-size: 11px; min-width: 18px; height: 18px; border-radius: 9px; padding: 0 5px; line-height: 18px; }

/* ---------- Panel ---------- */
#sheet { position: fixed; z-index: 700; background: #fff; box-shadow: var(--shadow); display: flex; flex-direction: column;
  left: 0; right: 0; bottom: calc(var(--nav-h) + var(--safe-b)); max-height: 78vh; border-radius: 18px 18px 0 0; animation: up .18s ease-out; }
#sheet.tall { height: 78vh; }
@keyframes up { from { transform: translateY(30px); opacity: .4; } to { transform: none; opacity: 1; } }
@media (min-width: 900px) {
  #sheet { left: 12px; right: auto; top: 64px; bottom: calc(var(--nav-h) + 12px); width: 420px; max-height: none; border-radius: var(--radius); }
  #sheet.tall { height: auto; }
}
.sheet-head { display: flex; align-items: center; gap: 6px; padding: 10px 10px 6px; border-bottom: 1px solid var(--line); flex: none; }
.sheet-head h2 { flex: 1; margin: 0; font-size: 17px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.icon-btn { width: 36px; height: 36px; border: 0; border-radius: 50%; background: var(--bg2); font-size: 16px; flex: none; }
#sheetBody { overflow-y: auto; padding: 14px 16px 20px; flex: 1; -webkit-overflow-scrolling: touch; }

/* ---------- Űrlapok, gombok ---------- */
.form { display: flex; flex-direction: column; gap: 12px; }
.form label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--muted); font-weight: 500; }
.form input:not([type=checkbox]):not([type=radio]), .form select, .form textarea {
  border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; background: #fff; color: var(--ink); font-size: 15px; outline: none; width: 100%; }
.form input:focus, .form select:focus, .form textarea:focus { border-color: var(--trip); box-shadow: 0 0 0 3px rgba(47,111,237,.15); }
.form textarea { min-height: 90px; resize: vertical; }
.form .check { flex-direction: row; align-items: flex-start; gap: 8px; color: var(--ink); font-weight: 400; }
.form .check input { margin-top: 3px; }
.row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.row3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; }
.row3 > label { min-width: 0; }
.time3 { grid-template-columns: 1fr 1fr; }
.time3 > label:first-child { grid-column: 1 / -1; }
body.picking .bubble { opacity: .35; pointer-events: none; }
fieldset { border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px 12px; margin: 0; display: flex; flex-direction: column; gap: 10px; }
legend { font-weight: 600; font-size: 13px; padding: 0 6px; }
.btn { border: 0; border-radius: 10px; padding: 10px 16px; font-weight: 600; background: var(--bg2); display: inline-flex; align-items: center; justify-content: center; gap: 6px; text-decoration: none; color: var(--ink); }
.btn.primary { background: var(--primary); color: #fff; }
.btn.primary:hover { background: var(--primary-d); }
.btn.dark { background: var(--navy); color: #fff; }
.btn.ghost { background: transparent; border: 1px solid var(--line); }
.btn.danger { background: #fdecec; color: #c0262d; }
.btn.small { padding: 7px 12px; font-size: 13px; }
.btn.block { width: 100%; }
.btn:disabled { opacity: .5; cursor: default; }
.btn-row { display: flex; gap: 8px; flex-wrap: wrap; }
.btn-row .btn { flex: 1; }

.chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chips button, .chips label { border: 1px solid var(--line); background: #fff; border-radius: 999px; padding: 6px 12px; font-size: 14px; display: inline-flex; align-items: center; gap: 6px; color: var(--ink); cursor: pointer; }
.chips button.on, .chips label.on { background: var(--navy); color: #fff; border-color: var(--navy); }
.chips input { display: none; }

.kind-cards { display: grid; gap: 10px; }
.kind-card { display: flex; gap: 12px; align-items: center; text-align: left; border: 1px solid var(--line); background: #fff; border-radius: 14px; padding: 14px; }
.kind-card:hover { border-color: var(--navy); }
.kind-card .big { font-size: 30px; width: 48px; height: 48px; border-radius: 12px; display: grid; place-items: center; flex: none; }
.kind-card b { display: block; font-size: 16px; }
.kind-card span { color: var(--muted); font-size: 13px; }

/* ---------- Kártyák, listák ---------- */
.card { border: 1px solid var(--line); border-radius: 14px; padding: 12px; background: #fff; }
.list { display: flex; flex-direction: column; gap: 10px; }
.list .card { cursor: pointer; }
.list .card:hover { border-color: #c7ccd8; }
.person { display: flex; align-items: center; gap: 10px; }
.avatar { width: 44px; height: 44px; border-radius: 50%; background: #dfe4ee center/cover no-repeat; display: grid; place-items: center; font-weight: 700; color: #fff; flex: none; font-size: 18px; }
.avatar.lg { width: 84px; height: 84px; font-size: 34px; }
.person .who { flex: 1; min-width: 0; }
.person .who b { display: block; }
.badge { display: inline-block; font-size: 12px; font-weight: 600; border-radius: 999px; padding: 2px 9px; color: #fff; }
.badge.seen { background: var(--seen); } .badge.trip { background: var(--trip); } .badge.place { background: var(--place); }
.meta { display: grid; grid-template-columns: 26px 1fr; gap: 6px 4px; margin: 12px 0; }
.meta .i { text-align: center; }
.seatbox { display: flex; gap: 8px; margin: 8px 0; flex-wrap: wrap; }
.seatbox div { flex: 1; min-width: 80px; background: var(--bg2); border-radius: 12px; padding: 8px 10px; text-align: center; }
.seatbox small { display: block; color: var(--muted); font-size: 12px; }
.seatbox b { font-size: 20px; }
.say { position: relative; background: #fff4f4; border: 1px solid #ffd5d7; border-radius: 16px; padding: 12px 14px; margin: 12px 0; white-space: pre-wrap; word-wrap: break-word; }
.say.trip { background: #eef3ff; border-color: #cfdcfd; } .say.place { background: #fff6e6; border-color: #fbe0ad; }
.score { font-weight: 800; color: var(--ok); }
.why { font-size: 12px; color: var(--muted); }
.empty { text-align: center; color: var(--muted); padding: 30px 10px; }
.empty .big { font-size: 40px; display: block; margin-bottom: 6px; }
.section-title { font-size: 13px; text-transform: uppercase; letter-spacing: .6px; color: var(--muted); margin: 18px 0 8px; font-weight: 700; }
.kv { display: flex; justify-content: space-between; border-bottom: 1px solid var(--line); padding: 8px 0; }

/* ---------- Csevegés ---------- */
.chat { display: flex; flex-direction: column; gap: 6px; padding-bottom: 8px; }
.msg { max-width: 80%; padding: 8px 12px; border-radius: 16px; background: var(--bg2); white-space: pre-wrap; word-wrap: break-word; align-self: flex-start; }
.msg.me { background: var(--navy); color: #fff; align-self: flex-end; border-bottom-right-radius: 4px; }
.msg:not(.me) { border-bottom-left-radius: 4px; }
.msg time { display: block; font-size: 11px; opacity: .6; margin-top: 2px; }
.chat-input { display: flex; gap: 8px; position: sticky; bottom: -20px; background: #fff; padding: 10px 0 4px; }
.chat-input textarea { flex: 1; min-height: 44px; max-height: 120px; border: 1px solid var(--line); border-radius: 12px; padding: 10px; resize: none; outline: none; }
.post-ref { font-size: 13px; background: var(--bg2); border-radius: 10px; padding: 8px 10px; margin-bottom: 10px; cursor: pointer; }

/* ---------- Kijelölő sáv ---------- */
#pickBar { position: fixed; left: 10px; right: 10px; top: 62px; z-index: 650; background: var(--navy); color: #fff; border-radius: 14px; padding: 12px 14px; box-shadow: var(--shadow); }
#pickText { font-size: 14px; margin-bottom: 8px; }
#pickText b { color: #ffd0d2; }
.pick-actions { display: flex; gap: 8px; justify-content: flex-end; }
.pick-actions .btn.ghost { color: #fff; border-color: rgba(255,255,255,.35); }
@media (min-width: 900px) { #pickBar { left: 50%; right: auto; transform: translateX(-50%); width: 520px; } }

/* ---------- Térkép-buborékok ---------- */
.bubble-icon { background: none; border: 0; }
.bubble { position: absolute; left: 0; bottom: 10px; transform: translateX(-50%); background: #fff; border-radius: 14px; padding: 6px 10px;
  box-shadow: 0 3px 12px rgba(0,0,0,.25); min-width: 120px; max-width: 210px; border-top: 4px solid var(--trip); cursor: pointer; font-size: 12.5px; line-height: 1.3; color: var(--ink); }
.bubble::after { content: ""; position: absolute; left: 50%; bottom: -9px; margin-left: -9px; border: 9px solid transparent; border-bottom: 0; border-top-color: #fff; }
.bubble.seen { border-top-color: var(--seen); } .bubble.place { border-top-color: var(--place); }
.bubble.mine { outline: 2px dashed rgba(31,42,68,.35); }
.bubble .bh { display: flex; gap: 5px; align-items: center; font-weight: 700; white-space: nowrap; overflow: hidden; }
.bubble .bh .t { font-weight: 500; color: var(--muted); margin-left: auto; }
.bubble .bt { margin-top: 3px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.bubble .bs { margin-top: 3px; font-size: 11.5px; color: var(--navy); font-weight: 600; }
.bubble.compact { min-width: 0; padding: 4px 7px; border-radius: 12px; font-size: 16px; }
.bubble.compact .bt, .bubble.compact .bs, .bubble.compact .bh .t, .bubble.compact .bh .l { display: none; }
.bubble:hover { z-index: 5; box-shadow: 0 5px 18px rgba(0,0,0,.35); }
.pin-dot { width: 16px; height: 16px; border-radius: 50%; border: 3px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,.4); }
.pick-label { background: var(--navy); color: #fff; border-radius: 8px; padding: 2px 8px; font-weight: 700; font-size: 12px; white-space: nowrap; box-shadow: 0 1px 4px rgba(0,0,0,.3); }
.leaflet-tooltip.stop-tip { font-size: 12px; padding: 2px 6px; }
.leaflet-popup-content { margin: 10px 12px; font-size: 14px; }
.stop-pop b { display: block; margin-bottom: 6px; }
.stop-pop .btn { margin: 2px 0; width: 100%; }
.leaflet-top.leaflet-right { top: 60px; }

/* ---------- Belépés ---------- */
#auth { position: fixed; inset: 0; z-index: 2000; background: linear-gradient(160deg, #1f2a44 0%, #3a2d5c 55%, #ff5a5f 140%); overflow-y: auto; display: flex; justify-content: center; align-items: flex-start; padding: 30px 16px; }
.auth-card { width: 100%; max-width: 420px; background: #fff; border-radius: 20px; padding: 24px 22px; box-shadow: 0 20px 60px rgba(0,0,0,.35); margin: auto 0; }
.auth-logo { width: 64px; height: 64px; border-radius: 16px; display: block; margin: 0 auto 6px; }
.auth-card h1 { text-align: center; margin: 0 0 6px; }
.auth-card > p { text-align: center; }
.tabs { display: flex; background: var(--bg2); border-radius: 12px; padding: 4px; margin: 16px 0; }
.tabs button { flex: 1; border: 0; background: none; padding: 8px; border-radius: 9px; font-weight: 600; color: var(--muted); }
.tabs button.active { background: #fff; color: var(--ink); box-shadow: 0 1px 4px rgba(0,0,0,.1); }

#toast { position: fixed; left: 50%; bottom: calc(var(--nav-h) + var(--safe-b) + 20px); transform: translateX(-50%); z-index: 3000; background: var(--navy); color: #fff; padding: 10px 18px; border-radius: 999px; box-shadow: var(--shadow); max-width: 90vw; text-align: center; }
#toast.err { background: #c0262d; }

/* ---------- Kijelölés: célkereszt kurzor + járat-menü ---------- */
body.picking .leaflet-container,
body.picking .leaflet-container.leaflet-grab,
body.picking .leaflet-container .leaflet-interactive { cursor: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cg%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%2216%22%20r%3D%229%22%20stroke%3D%22%23fff%22%20stroke-width%3D%225%22/%3E%3Cpath%20d%3D%22M16%201v8M16%2023v8M1%2016h8M23%2016h8%22%20stroke%3D%22%23fff%22%20stroke-width%3D%225%22/%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%2216%22%20r%3D%229%22%20stroke%3D%22%23e8485f%22%20stroke-width%3D%222.5%22/%3E%3Cpath%20d%3D%22M16%202v7M16%2023v7M2%2016h7M23%2016h7%22%20stroke%3D%22%231f2a44%22%20stroke-width%3D%222.5%22/%3E%3C/g%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%2216%22%20r%3D%222.6%22%20fill%3D%22%23e8485f%22%20stroke%3D%22%23fff%22%20stroke-width%3D%221.2%22/%3E%3C/svg%3E") 16 16, crosshair !important; }
body.picking .leaflet-container.leaflet-dragging,
body.picking .leaflet-dragging .leaflet-grab { cursor: move !important; }
body.picking .leaflet-popup, body.picking .leaflet-popup * { cursor: auto; }
body.picking .leaflet-popup button { cursor: pointer !important; }
.pick-pop .leaflet-popup-content { margin: 10px 12px; }
.pick-menu .pm-title { display: block; font-size: 15px; }
.pick-menu .pm-sec { margin: 8px 0 4px; font-size: 12.5px; font-weight: 600; color: var(--navy); }
.pick-menu .pm-sec span { font-weight: 400; color: var(--muted); }
.pick-menu .pm-lines { display: flex; flex-direction: column; gap: 4px; max-height: 180px; overflow-y: auto; padding-right: 2px; }
.pick-menu .pm-line { text-align: left; border: 1px solid var(--line); border-left: 5px solid var(--navy); background: #fff; border-radius: 8px; padding: 5px 8px; display: flex; flex-direction: column; color: var(--ink); }
.pick-menu .pm-line small { color: var(--muted); font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pick-menu .pm-line:hover { background: var(--bg2); }
.pick-menu .pm-line.on { background: #e9f0ff; border-color: var(--trip); box-shadow: inset 0 0 0 1px var(--trip); }
.pick-menu .pm-acts { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.pick-menu .pm-acts .btn { width: 100%; }

/* ---------- Láthatósági tájékoztató ---------- */
.vis-hint { position: fixed; left: 50%; transform: translateX(-50%); bottom: 96px; z-index: 640; width: min(520px, calc(100% - 24px));
  background: #fff; color: var(--ink); border-radius: 12px; padding: 10px 12px; font-size: 13px; line-height: 1.4; box-shadow: var(--shadow); border-left: 4px solid var(--navy); }
.vis-hint button { margin-left: 6px; border: 0; background: var(--primary); color: #fff; border-radius: 8px; padding: 3px 10px; font-weight: 600; }
body.picking .vis-hint { display: none; }

/* ---------- Közeli megállók + hely-üzenet ablak ---------- */
.pick-menu .pm-stops { margin: 4px 0 2px; line-height: 1.35; }
.pick-menu .pm-stops span { color: var(--muted); }
.place-form { display: flex; flex-direction: column; gap: 7px; }
.place-form label { display: flex; flex-direction: column; gap: 3px; font-size: 12.5px; font-weight: 600; color: var(--navy); }
.place-form label.check { flex-direction: row; align-items: center; gap: 6px; font-weight: 500; color: var(--ink); }
.place-form input:not([type=checkbox]), .place-form textarea { font: inherit; font-size: 14px; font-weight: 400; border: 1px solid var(--line); border-radius: 8px; padding: 6px 8px; color: var(--ink); width: 100%; box-sizing: border-box; }
.place-form textarea { resize: vertical; min-height: 64px; }
.place-form .pf-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.place-form .pf-row > label:only-child { grid-column: 1 / -1; }
.place-form input:disabled { opacity: .45; }

/* ---------- Irányválasztás ---------- */
.pick-menu .pm-dirs { display: flex; flex-direction: column; gap: 4px; margin-top: 6px; }
.pick-menu .pm-dir { text-align: left; border: 1px solid var(--line); background: #fff; border-radius: 8px; padding: 6px 8px; font-size: 13px; color: var(--ink); }
.pick-menu .pm-dir:hover { background: var(--bg2); }
.pick-menu .pm-dir.on { background: #e9f0ff; border-color: var(--trip); box-shadow: inset 0 0 0 1px var(--trip); font-weight: 600; }
.pick-menu .pm-status:empty { display: none; }

/* ---------- Hely-üzenet buborék: név + fotó, dátum, idő, üzenet ---------- */
.avatar.xs { width: 26px; height: 26px; font-size: 12px; }
.bubble.place2 { min-width: 150px; max-width: 230px; padding: 7px 10px 8px; }
.bubble.place2 .pb-who { display: flex; align-items: center; gap: 7px; font-size: 13px; white-space: nowrap; overflow: hidden; }
.bubble.place2 .pb-who b { overflow: hidden; text-overflow: ellipsis; }
.bubble.place2 .pb-place { margin-top: 4px; font-weight: 600; font-size: 12px; color: var(--navy); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bubble.place2 .pb-date, .bubble.place2 .pb-time { font-size: 11.5px; color: var(--muted); line-height: 1.35; }
.bubble.place2 .bt { margin-top: 4px; -webkit-line-clamp: 3; }
/* Megállónevek nagy nagyításnál */
.leaflet-tooltip.stop-tip { font-weight: 600; }

/* ---------- Útvonal-szalag kijelölés közben ---------- */
#routeStrip { position: fixed; left: 8px; right: 8px; bottom: calc(var(--nav-h) + var(--safe-b) + 8px); z-index: 640; }
#routeStrip .rs-in { display: flex; align-items: center; gap: 4px; overflow-x: auto; white-space: nowrap; background: #fff; border-radius: 14px; padding: 8px 10px; box-shadow: var(--shadow); scrollbar-width: thin; }
.rs-chip { display: inline-flex; align-items: center; gap: 5px; border-radius: 999px; padding: 4px 10px; font-size: 13px; background: var(--bg2); color: var(--ink); flex: none; }
.rs-chip.rs-line { background: #fff; border: 1px solid var(--line); }
.rs-chip.rs-line i { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.rs-chip.rs-line small { color: var(--muted); }
.rs-chip.rs-tr { background: #fff6d6; }
.rs-chip.rs-open { background: transparent; color: var(--muted); }
.rs-arrow { color: var(--muted); flex: none; }
@media (min-width: 900px) { #routeStrip { left: 50%; right: auto; transform: translateX(-50%); max-width: 900px; } }

/* ---------- Rétegválasztó: eltűnő (összecsukható), élénk jármű-ikonokkal ---------- */
.leaflet-control-layers-toggle { width: 44px; height: 44px; background-size: 24px; }
.leaflet-touch .leaflet-control-layers-toggle { width: 44px; height: 44px; }
.leaflet-control-layers-expanded { padding: 8px 10px; font-size: 13px; line-height: 1.6; max-height: 60vh; overflow-y: auto; border-radius: 12px; }
.leaflet-control-layers-expanded label > span, .leaflet-control-layers-expanded label > div { display: flex; align-items: center; gap: 6px; }
.leaflet-control-layers-selector { margin: 0 2px 0 0; }
.vb-rail { display: inline-block; width: 20px; height: 20px; border-radius: 6px; vertical-align: middle;
  background: repeating-linear-gradient(90deg, #fff 0 3px, #d0312d 3px 6px) center / 16px 4px no-repeat, #fde7e6; box-shadow: inset 0 0 0 1.5px #d0312d; }
/* jármű-jelvény */
.vb { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; border-radius: 6px; flex: none; vertical-align: middle;
  box-shadow: 0 1px 2px rgba(0,0,0,.25), inset 0 -1px 0 rgba(0,0,0,.12); }
.vb svg { width: 16px; height: 16px; display: block; }
.vb.sm { width: 17px; height: 17px; border-radius: 5px; } .vb.sm svg { width: 14px; height: 14px; }

/* ---------- Útvonalaim ---------- */
.route-card { cursor: default; display: grid; grid-template-columns: auto 1fr; gap: 6px 10px; align-items: start; }
.route-card .rt-left { grid-row: 1 / span 2; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.route-card .rt-show { font-size: 12px; flex-direction: column; align-items: center; gap: 2px; }
.route-card .rt-qr { display: flex; flex-direction: column; align-items: center; gap: 3px; border: 1px solid var(--line); background: #fff; border-radius: 10px; padding: 5px 5px 4px; cursor: pointer; max-width: 128px; }
.route-card .rt-qr:hover { border-color: var(--primary); }
.route-card .rt-qr-img { display: flex; align-items: center; justify-content: center; min-width: 92px; min-height: 92px; }
.route-card .rt-qr-img canvas { display: block; }
.route-card .rt-qr-code { font: 700 9.5px/1.2 "Courier New", Courier, monospace; color: var(--navy); word-break: break-all; text-align: center; }
.route-card .rt-qr-hint { font-size: 11px; font-weight: 700; color: var(--primary); }
.route-card .rt-actions { grid-column: 2; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.route-card .rt-actions select { font: inherit; font-size: 13px; padding: 4px 6px; border-radius: 8px; border: 1px solid var(--line); }

/* ---------- Gyors válasz a bejegyzésnél ---------- */
.quick-reply { margin-top: 10px; gap: 6px; }
.quick-reply textarea { min-height: 54px; }

/* ---------- Járat + irány egy lépésben ---------- */
.pick-menu .pm-hint { margin: 6px 0 4px; }
.pick-menu .pm-lines { display: flex; flex-direction: column; gap: 6px; max-height: 260px; overflow-y: auto; padding-right: 2px; }
.pick-menu .pm-line { display: block; text-align: left; border: 1px solid var(--line); border-left: 5px solid var(--navy); background: #fff; border-radius: 10px; padding: 6px 8px; }
.pick-menu .pm-line:hover { background: #fff; }
.pick-menu .pm-line.on { background: #f4f8ff; border-color: var(--trip); }
.pick-menu .pm-lh { display: flex; align-items: center; gap: 7px; font-size: 15px; margin-bottom: 4px; }
.pick-menu .pm-ldirs { display: flex; flex-direction: column; gap: 4px; }
.pick-menu .pm-dir { text-align: left; border: 1px solid var(--line); background: var(--bg2); border-radius: 8px; padding: 7px 9px; font-size: 13.5px; color: var(--ink); line-height: 1.3; }
.pick-menu .pm-dir .pm-cont { color: var(--muted); font-size: 12.5px; }
.pick-menu .pm-dir.on { background: #e9f0ff; border-color: var(--trip); box-shadow: inset 0 0 0 1px var(--trip); font-weight: 600; }
.pick-menu .pm-dir.on .pm-cont { color: var(--trip); }
.pick-menu .pm-status { margin-top: 6px; }

/* ---------- Mobil: a kijelölő ablak alulról jön fel, a gombok mindig látszanak ---------- */
#pickSheet { position: fixed; left: 0; right: 0; bottom: calc(var(--nav-h) + var(--safe-b)); z-index: 760; background: #fff;
  border-radius: 18px 18px 0 0; box-shadow: 0 -6px 24px rgba(20,30,60,.22); padding: 14px 14px 0; max-height: 62vh; max-height: 62dvh;
  display: flex; flex-direction: column; animation: up .18s ease-out; }
#pickSheet[hidden] { display: none; }
#pickSheet .ps-x { position: absolute; top: 8px; right: 10px; width: 32px; height: 32px; border: 0; border-radius: 50%; background: var(--bg2); font-size: 15px; z-index: 2; }
#pickSheet > div { display: flex; flex-direction: column; min-height: 0; flex: 1; }
#pickSheet .pick-menu { display: flex; flex-direction: column; min-height: 0; flex: 1; }
#pickSheet .pm-title { padding-right: 40px; }
#pickSheet .pm-lines { max-height: none; flex: 1 1 auto; min-height: 110px; }
#pickSheet .place-form { overflow-y: auto; padding-bottom: 0; }
#pickSheet .pm-acts { position: sticky; bottom: 0; background: #fff; margin: 8px -14px 0; padding: 10px 14px calc(10px + 0px); border-top: 1px solid var(--line); flex: none; }
#pickSheet .pm-acts .btn { padding: 12px 16px; font-size: 15px; }
body.pm-open #routeStrip { display: none; }
body.pm-open #mapTools { display: none; }

/* ---------- Láttalak buborék ---------- */
.bubble.seen.place2 { border-top-color: var(--seen); }
.bubble.place2 .pb-kind { margin-left: auto; font-size: 11px; font-weight: 700; color: var(--seen); flex: none; }
.seen-form .pf-note { margin: 0; line-height: 1.35; }
.seen-form .pm-title { color: var(--seen); }
/* mobilon nyitott panelnél a felső kijelölő sáv csak a gombokat mutatja, hogy több térkép látsszon */
@media (max-width: 759px) { body.pm-open #pickText { display: none; } body.pm-open #pickBar { padding: 8px 10px; } }

/* ---------- Indulási idők a járatválasztóban ---------- */
.pick-menu .pm-deps { margin-top: 6px; }
.pick-menu .pm-deplist { display: flex; flex-wrap: wrap; gap: 5px; margin: 4px 0; }
.pick-menu .pm-dep { border: 1px solid var(--line); background: #fff; border-radius: 999px; padding: 5px 11px; font-weight: 700; font-size: 13.5px; color: var(--navy); }
.pick-menu .pm-dep.on { background: var(--navy); color: #fff; border-color: var(--navy); }
#pickSheet .pm-deps { flex: none; }

/* ---------- Útvonalaim: időpont módosítása ---------- */
.route-card .rt-time { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 6px 10px; background: var(--bg2); border-radius: 10px; padding: 8px 10px; }
.route-card .rt-time[hidden] { display: none; }
.route-card .rt-time label { display: flex; flex-direction: column; gap: 3px; font-size: 12px; font-weight: 600; color: var(--navy); }
.route-card .rt-time input { font: inherit; font-size: 14px; border: 1px solid var(--line); border-radius: 8px; padding: 6px 8px; }
.route-card .rt-tbtn { grid-column: 1 / -1; display: flex; gap: 6px; }

/* ---------- Járatválasztó fejléc + keresés ---------- */
.pick-menu .pm-head { margin: -2px 0 8px; padding: 7px 10px; border-radius: 10px; font-weight: 800; font-size: 14.5px; color: #fff; letter-spacing: .2px; }
.pick-menu .pm-head.pm-from { background: linear-gradient(90deg, #1f9d55, #2fb36a); }
.pick-menu .pm-head.pm-next { background: linear-gradient(90deg, #2f6fed, #4b86f5); }
#pickSheet .pm-head { margin-right: 40px; }
.pick-menu .pm-search { width: 100%; box-sizing: border-box; font: inherit; font-size: 14px; border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; margin: 2px 0 6px; background: var(--bg2); outline: none; }
.pick-menu .pm-search:focus { border-color: var(--trip); background: #fff; }
.pick-menu .pm-search[hidden], .pick-menu .pm-line[hidden], .pick-menu .pm-none[hidden] { display: none; }
.pick-menu .pm-none { padding: 6px 2px; }

/* ---------- „Ekkor leszek itt” ---------- */
.when-pop .wp-t { font-weight: 700; color: var(--navy); }
.when-pop .wp-time { font-size: 20px; margin: 2px 0 4px; }
.when-pop .wp-time b { font-size: 24px; color: var(--trip); }
.when-pop .wp-place:empty { display: none; }
.when-pop .wp-acts { margin-top: 8px; }
.when-pop .wp-acts .btn { width: 100%; }
/* nagyobb, jobban olvasható alsó menü */
:root { --nav-h: 68px; }
.leaflet-container .leaflet-interactive:focus, .leaflet-container path:focus { outline: none; }
.pick-menu .pm-arr { background: #fff6d6; border-radius: 8px; padding: 6px 8px; margin: 4px 0; font-size: 13px; }

/* ---------- Teljes napi menetrend ---------- */
.pick-menu .pm-allbtn { margin-top: 4px; padding: 6px 10px; }
.pick-menu .pm-all { margin-top: 6px; border: 1px solid var(--line); border-radius: 10px; padding: 6px 8px; max-height: 210px; overflow-y: auto; background: #fff; }
.pick-menu .pm-all[hidden] { display: none; }
.pick-menu .pm-allday { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; position: sticky; top: -6px; background: #fff; padding: 2px 0; }
.pick-menu .pm-allday input { font: inherit; font-size: 13.5px; border: 1px solid var(--line); border-radius: 8px; padding: 4px 6px; }
.pick-menu .pm-ttr { display: grid; grid-template-columns: 30px 1fr; align-items: start; gap: 4px; padding: 3px 0; border-top: 1px solid var(--bg2); }
.pick-menu .pm-ttr b { color: var(--navy); font-size: 14px; padding-top: 3px; }
.pick-menu .pm-ttr span { display: flex; flex-wrap: wrap; gap: 3px; }
.pick-menu .pm-ttm { border: 1px solid var(--line); background: var(--bg2); border-radius: 6px; padding: 3px 7px; font-size: 13px; font-weight: 600; color: var(--ink); min-width: 32px; }
.pick-menu .pm-ttm.on { background: var(--navy); color: #fff; border-color: var(--navy); }
.pick-menu .pm-trains { margin: 4px 0; padding: 5px 8px; background: #f2f5fb; border-radius: 8px; line-height: 1.35; }
#pickSheet .pm-trains, #pickSheet .pm-all { flex: none; }
/* mobil panel: a teljes tartalom görgethető, a gombsor mindig alul marad */
#pickSheet .pick-menu { display: block; overflow-y: auto; overscroll-behavior: contain; flex: 1; min-height: 0; }
#pickSheet .pm-lines { max-height: 40vh; max-height: 40dvh; min-height: 0; }
#pickSheet .pm-all { max-height: none; }

/* ---------- Vasúti adatforrás választó ---------- */
.rail-src { display: flex; flex-direction: column; gap: 6px; border-top: 1px solid var(--line); padding-top: 8px; }
.rail-src .rs-opt { display: flex; gap: 8px; align-items: flex-start; font-size: 13px; line-height: 1.35; cursor: pointer; }
.rail-src .rs-opt input { margin-top: 3px; accent-color: var(--primary); }
.rail-src .rs-url { margin-left: 24px; padding: 6px 8px; border: 1px solid var(--line); border-radius: 8px; font: inherit; font-size: 13px; }
.rail-src .rs-url[hidden] { display: none; }

/* ---------- Nagy, piros bezáró gomb ---------- */
.leaflet-container a.leaflet-popup-close-button { width: 30px; height: 30px; top: 6px; right: 6px; border-radius: 50%; background: #e2363d; color: #fff;
  font: 700 22px/28px Arial, sans-serif; text-align: center; box-shadow: 0 1px 4px rgba(0,0,0,.25); }
.leaflet-container a.leaflet-popup-close-button:hover, .leaflet-container a.leaflet-popup-close-button:focus { background: #c4242b; color: #fff; }
.leaflet-container a.leaflet-popup-close-button span { line-height: 28px; }
.pick-pop .leaflet-popup-content { margin-top: 12px; padding-right: 26px; }
.when-popup .leaflet-popup-content { padding-right: 26px; }
#pickSheet .ps-x { width: 38px; height: 38px; top: 8px; right: 10px; background: #e2363d; color: #fff; font-size: 20px; font-weight: 800; box-shadow: 0 1px 4px rgba(0,0,0,.25); }
#pickSheet .pm-head { margin-right: 46px; }

/* ---------- 16. frissítés ---------- */
/* járatkereső kiemelve */
.pick-menu .pm-search { border: 2px solid var(--trip); background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%232f6fed' stroke-width='2.6' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") no-repeat 10px center;
  padding: 10px 12px 10px 36px; font-size: 15px; font-weight: 600; border-radius: 12px; box-shadow: 0 2px 8px rgba(47,111,237,.18); }
.pick-menu .pm-search::placeholder { color: #5b6b90; font-weight: 500; }
/* piros X a helyén: a fejléc nem csúszik alá */
.leaflet-container a.leaflet-popup-close-button { top: 8px; right: 8px; }
.pick-pop .leaflet-popup-content { margin: 10px 12px 10px; padding-right: 0; }
.pick-pop .pm-head, .pick-pop .pm-title:first-child, .pick-pop .place-form > .pm-title { margin-right: 38px; }
.when-popup .leaflet-popup-content { margin-top: 12px; padding-right: 30px; }
/* felső kijelölő sáv: nagyobb gombok */
#pickBar .pick-actions .btn { padding: 11px 18px; font-size: 15px; border-radius: 12px; min-height: 44px; }
@media (max-width: 600px) { #pickBar .pick-actions .btn { flex: 1; padding: 11px 8px; } }
/* megállók időpontja a térképen */
.leaflet-tooltip.stop-time { padding: 1px 6px; font-size: 11.5px; border-radius: 6px; background: #fff; color: var(--ink); border: 1px solid #c9d2e6; box-shadow: 0 1px 3px rgba(0,0,0,.2); white-space: nowrap; }
.leaflet-tooltip.stop-time b { color: var(--navy); }
.leaflet-tooltip.stop-time.est b::before { content: '≈'; }
.leaflet-tooltip.stop-time::before { display: none; }
/* kézi időpont */
.pick-menu .pm-manual { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 6px; font-size: 13px; }
.pick-menu .pm-manual input { font: inherit; font-size: 14px; border: 1px solid var(--line); border-radius: 8px; padding: 5px 7px; }
/* bejegyzés: megállók és időpontok */
.stop-timeline .st-leg { border: 1px solid var(--line); border-radius: 12px; padding: 8px 10px; margin-bottom: 8px; }
.stop-timeline .st-h { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; }
.stop-timeline .st-row { display: grid; grid-template-columns: 52px 1fr; gap: 8px; padding: 3px 0; border-top: 1px solid var(--bg2); font-size: 14px; }
.stop-timeline .st-row b { color: var(--navy); }
/* útvonal szerkesztése a térképen */
.when-pop .wp-edit { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line); }
.when-pop .wp-edit label { display: flex; flex-direction: column; gap: 2px; font-size: 12px; font-weight: 600; color: var(--navy); }
.when-pop .wp-edit input, .when-pop .wp-edit select { font: inherit; font-size: 14px; border: 1px solid var(--line); border-radius: 8px; padding: 5px 7px; }
.when-pop .wp-row { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.rt-name input { font-size: 16px !important; font-weight: 600; }

/* kereső: kattintáskor / gépeléskor eltűnik a nagyító */
.pick-menu .pm-search:focus, .pick-menu .pm-search:not(:placeholder-shown) { background-image: none; padding-left: 12px; }
/* mentett útvonal megállói */
.leaflet-tooltip.stop-time.my-st { font-size: 12px; font-weight: 500; }

/* ---------- mentett útvonal: jól látható megállók, végpontok, mozgó nyilak ---------- */
.stop-pin { width: 18px; height: 18px; box-sizing: border-box; border-radius: 50%; background: #fff; border: 4.5px solid var(--c, #1f2a44); box-shadow: 0 0 0 2px #fff, 0 1px 4px rgba(0,0,0,.45); }
.leaflet-tooltip.stop-time.my-st { font-size: 13px; padding: 2px 8px; border-left: 4px solid var(--navy); border-radius: 6px; box-shadow: 0 1px 5px rgba(0,0,0,.3); }
.leaflet-tooltip.stop-time.my-st b { font-size: 13.5px; }
.end-pin { width: 26px; height: 26px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 13px; color: #fff; background: var(--c, #1f2a44);
  border: 3px solid #fff; box-shadow: 0 1px 5px rgba(0,0,0,.45); box-sizing: border-box; cursor: pointer; }
.end-pin.end { background: #fff; border-color: var(--c, #1f2a44); font-size: 12px; }
.flow-arr { width: 16px; height: 16px; line-height: 16px; text-align: center; font-size: 15px; color: #fff; text-shadow: 0 0 2px rgba(0,0,0,.8), 0 0 4px rgba(0,0,0,.5); transition: transform .2s linear; pointer-events: none; }
@media (prefers-reduced-motion: reduce) { .flow-arr { display: none; } }
.when-pop .wp-acts { display: flex; flex-direction: column; gap: 6px; }

/* ---------- üzenetbuborék: vastagabb keret, ceruza ---------- */
.bubble { border: 3px solid var(--trip); border-top-width: 5px; }
.bubble.seen { border-color: var(--seen); } .bubble.place { border-color: var(--place); }
.bubble::after { bottom: -12px; border-top-color: inherit; }
.bubble.mine { outline: 2px dashed rgba(31,42,68,.45); outline-offset: 2px; }
.bubble .pb-edit { position: absolute; top: -12px; right: -12px; width: 28px; height: 28px; border-radius: 50%; border: 2px solid #fff; background: var(--navy);
  color: #fff; font-size: 13px; line-height: 1; padding: 0; box-shadow: 0 2px 6px rgba(0,0,0,.35); cursor: pointer; display: flex; align-items: center; justify-content: center; }
.bubble .pb-edit:hover { background: var(--primary); }
.bubble.place2 { padding-right: 14px; }
/* megálló-felirat: időpont · járat · megálló */
.leaflet-tooltip.stop-time .st-line { display: inline-flex; align-items: center; gap: 3px; font-weight: 700; margin: 0 2px; }
.leaflet-tooltip.stop-time .st-line .vb { width: 15px; height: 15px; border-radius: 4px; } .leaflet-tooltip.stop-time .st-line .vb svg { width: 12px; height: 12px; }

/* ---------- Megosztás: QR-kód + megosztási lehetőségek ---------- */
.share-box { display: flex; flex-direction: column; align-items: stretch; gap: 10px; }
.share-qr { width: min(330px, 100%); align-self: center; border-radius: 16px; box-shadow: 0 4px 18px rgba(31,42,68,.18); border: 1px solid var(--line); background: #fff; }
.share-id { text-align: center; font-size: 15px; }
.share-id b { font-family: "Courier New", monospace; font-size: 18px; letter-spacing: .5px; }
.share-link { display: flex; gap: 6px; }
.share-link input { flex: 1; min-width: 0; padding: 9px 10px; border: 1px solid var(--line); border-radius: 10px; font-size: 13px; background: var(--bg2, #f3f5f9); color: var(--ink, #1d2433); }
.share-main { font-size: 17px; padding: 13px; }
.share-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px 4px; }
.sh-t { border: 0; background: transparent; display: flex; flex-direction: column; align-items: center; gap: 5px; font-size: 11.5px; color: var(--ink, #1d2433); padding: 4px 0; cursor: pointer; line-height: 1.15; text-align: center; }
.sh-ic { width: 48px; height: 48px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; font: 800 21px Arial, sans-serif; box-shadow: 0 2px 6px rgba(0,0,0,.18); }
.sh-t:active .sh-ic { transform: scale(.92); }
.share-warn { background: #fff6e0; border: 1px solid #f3d27a; border-radius: 10px; padding: 8px 10px; margin: 0; }
@media (max-width: 380px) { .share-grid { grid-template-columns: repeat(4, 1fr); } }
.wp-share { min-width: 40px; }
.rt-share { background: #ff5a5f; color: #fff; }

/* Megosztott útvonal – kártya belépés nélkül (a QR-kód beolvasása után) */
#shareLanding { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1900; display: flex; justify-content: center; padding: 0 10px calc(10px + var(--safe-b, 0px)); pointer-events: none; }
.sl-card { pointer-events: auto; width: min(460px, 100%); max-height: 64vh; overflow-y: auto; background: #fff; border-radius: 20px; box-shadow: 0 10px 40px rgba(0,0,0,.35); padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 8px; border-top: 5px solid #ff5a5f; }
.sl-brand { display: flex; align-items: center; gap: 8px; font-weight: 800; font-size: 18px; color: #1f2a44; }
.sl-brand img { width: 30px; height: 30px; border-radius: 8px; }
.sl-brand span { flex: 1; }
.sl-x { width: 34px; height: 34px; border: 0; border-radius: 50%; background: #e4201b; color: #fff; font-size: 16px; font-weight: 800; cursor: pointer; }
.sl-who { display: flex; align-items: center; gap: 10px; }
.sl-who > div:nth-child(2) { flex: 1; }
.sl-code { font-family: "Courier New", monospace; font-weight: 800; background: #1f2a44; color: #fff; border-radius: 8px; padding: 4px 8px; font-size: 13px; white-space: nowrap; }
.sl-app { background: #f3f6ff; border: 1px solid #d6def5; border-radius: 14px; padding: 10px 12px; display: flex; flex-direction: column; gap: 8px; }
.sl-app .btn { text-align: center; text-decoration: none; }
.sl-app-h { font-weight: 800; color: #1f2a44; }
.sl-app p { margin: 0; }
.sl-app.compact { margin: 8px 0; }
@media (min-width: 900px) { #shareLanding { justify-content: flex-start; padding: 0 0 20px 20px; } }
.end-pin.sh { --c: #ff5a5f; }
.sl-card .meta { margin: 0; }
.sl-card .say { margin: 0; padding: 8px 12px; }
.sl-help summary { cursor: pointer; }
#shareLanding .avatar { width: 40px; height: 40px; flex: 0 0 40px; }

/* MÁV élő menetrend: késés és vonatnév az indulásokon */
.pm-dep .pm-dl, .pm-ttm .pm-dl { font-style: normal; color: #d1121b; font-weight: 800; font-size: 11px; margin-left: 3px; }
.pm-dep .pm-dinfo { display: block; font-size: 10.5px; color: #55607a; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 150px; }
.pm-deplist.wide .pm-dep { text-align: left; }
.pm-src { font-size: 10.5px; font-weight: 700; background: #1d3f9e; color: #fff; border-radius: 6px; padding: 1px 6px; margin-left: 4px; vertical-align: 1px; }

/* Kis Android-kijelzők (360 px széles és keskenyebb): az alsó menü ne lógjon ki */
#bottomnav button { min-width: 0; }
#bottomnav button > span:last-child { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 380px) {
  #bottomnav button { font-size: 11.5px; letter-spacing: 0; }
  #bottomnav button .ic { font-size: 20px; }
  #bottomnav .fab { width: 52px; height: 52px; font-size: 27px; }
}
@media (max-width: 340px) { #bottomnav button { font-size: 10.5px; } }
#bottomnav b.lf, #bottomnav b.ls { font-weight: inherit; }
#bottomnav b.ls { display: none; }
@media (max-width: 380px) { #bottomnav b.lf { display: none; } #bottomnav b.ls { display: inline; } }
.pm-diag { color: #8a93a6; word-break: break-word; }

/* Jelszó: megjelenítés gomb, elfelejtett jelszó, visszaállító kód */
.pw-wrap { position: relative; display: block; }
.pw-wrap input { width: 100%; padding-right: 48px !important; box-sizing: border-box; }
.pw-eye { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); width: 40px; height: 36px; border: 0; background: transparent; font-size: 19px; cursor: pointer; opacity: .55; filter: grayscale(1); }
.pw-eye.on { opacity: 1; filter: none; }
.auth-forgot { text-align: center; margin: 6px 0 0; }
.auth-forgot a { color: var(--primary-d, #d6333a); font-weight: 700; text-decoration: none; font-size: 15px; padding: 8px; display: inline-block; }
#forgotForm details { margin-top: 4px; line-height: 1.45; }
.rec-code { font: 800 22px "Courier New", monospace; letter-spacing: 1px; background: #1f2a44; color: #fff; border-radius: 10px; padding: 10px; text-align: center; margin: 6px 0; word-break: break-all; }
.rec-code.sm { font-size: 15px; padding: 3px 8px; display: inline-block; }

/* ---------- 27: vasúti források, menetválasztás, naptár ---------- */
.rail-src .rs-st { font-style: normal; color: #1f9d55; font-size: 12px; }
.rail-src .rs-none { margin: 4px 0 0; }
.wp-runs { margin: 6px 0 2px; border-top: 1px dashed var(--line); padding-top: 6px; }
.wp-runs .wp-sec { font-size: 12px; font-weight: 600; margin-bottom: 4px; }
.wp-runs .pm-deplist { display: flex; flex-wrap: wrap; gap: 4px; }
.pm-dep.run { position: relative; }
.pm-dep.run.cur { order: -1; background: #e8f6ee; border-color: #1f9d55; color: #14532d; font-weight: 700; }
.pm-dep.run .run-ck { font-style: normal; color: #1f9d55; margin-right: 3px; }
.pm-dep.run .run-lbl { display: block; font-size: 9.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; color: #1f9d55; line-height: 1; margin-top: 1px; }
.pm-dep.run.busy, .pm-ttm.run.busy { opacity: .5; }
.run-first { margin-bottom: 4px; }
.wp-curtt { font-size: 12px; margin: 4px 0; }
.wp-legs { margin: 2px 0 4px; }
.wp-scope { display: flex; flex-direction: column; gap: 2px; background: #f4f6fb; border-radius: 8px; padding: 6px 8px; margin: 4px 0; }
.wp-scope label { display: flex; gap: 6px; align-items: center; font-weight: 400; }
.wp-edit .btn.block { width: 100%; margin: 4px 0; }
.rt-ser { display: inline-block; background: #eef3ff; color: #2f6fed; border-radius: 10px; padding: 0 7px; font-weight: 600; }
.cal-wrap { position: relative; }
.cal-head { margin-bottom: 8px; }
.cal-vars { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 8px; }
.cal-var { display: inline-flex; align-items: center; gap: 4px; border: 2px solid var(--c); border-radius: 18px; padding: 3px 4px 3px 10px; font-size: 13px; cursor: pointer; background: #fff; }
.cal-var b { background: var(--c); color: #fff; border-radius: 50%; width: 20px; height: 20px; display: inline-grid; place-items: center; font-size: 12px; }
.cal-var.on { background: color-mix(in srgb, var(--c) 14%, #fff); box-shadow: 0 0 0 2px color-mix(in srgb, var(--c) 30%, transparent); }
.cal-var button { border: 0; background: transparent; cursor: pointer; font-size: 12px; padding: 2px 4px; border-radius: 10px; }
.cal-var button:hover { background: #0001; }
.cal-ved { border: 2px solid var(--line); border-radius: 12px; padding: 8px 10px; margin-bottom: 10px; background: #fafbfe; }
.cal-ved .ved-t { display: flex; justify-content: space-between; align-items: center; border-left: 5px solid var(--c); padding-left: 8px; margin-bottom: 6px; }
.cal-ved label { display: flex; flex-direction: column; font-size: 12px; gap: 2px; margin-bottom: 6px; }
.cal-ved select, .cal-ved input { font: inherit; font-size: 13px; padding: 5px 6px; border: 1px solid var(--line); border-radius: 8px; }
.cal-ved .ved-res { margin-top: 6px; }
.cal-help { margin-bottom: 6px; }
.cal-nav { display: flex; align-items: center; justify-content: space-between; margin: 4px 0; }
.cal-nav b { font-size: 16px; }
table.cal { width: 100%; border-collapse: separate; border-spacing: 3px; table-layout: fixed; user-select: none; -webkit-user-select: none; }
table.cal th { font-size: 11px; color: var(--muted, #667); font-weight: 600; }
table.cal .cal-wkh { width: 34px; }
table.cal .cal-wk { cursor: pointer; background: #f1f3f8; border-radius: 8px; font-size: 11px; }
table.cal .cal-wk:hover { background: #e3e8f5; }
.cal-d { height: 50px; vertical-align: top; border: 1px solid var(--line); border-radius: 9px; padding: 2px 3px; cursor: pointer; position: relative; background: #fff; -webkit-touch-callout: none; }
.cal-d .n { font-size: 11px; color: #555; }
.cal-d.out { opacity: .45; }
.cal-d.past .n { color: #aaa; }
.cal-d.today { box-shadow: inset 0 0 0 2px #222; }
.cal-d.dis { cursor: not-allowed; background: #f5f5f5; }
.cal-d.on { background: color-mix(in srgb, var(--c) 16%, #fff); border-color: var(--c); }
.cal-d .l { position: absolute; right: 3px; top: 2px; background: var(--c); color: #fff; font-size: 10px; border-radius: 50%; width: 16px; height: 16px; display: grid; place-items: center; }
.cal-d .t { display: block; font-style: normal; font-size: 11px; font-weight: 700; color: var(--c); margin-top: 6px; text-align: center; }
@media (max-width: 420px) { .cal-d { height: 44px; } .cal-d .t { font-size: 10px; margin-top: 4px; letter-spacing: -.02em; } }
.cal-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--c); margin: 0 2px 0 4px; vertical-align: -1px; }
.cal-menu { position: absolute; z-index: 50; width: 240px; background: #fff; border-radius: 12px; box-shadow: 0 8px 28px #0003; padding: 4px; display: flex; flex-direction: column; }
.cal-menu button { text-align: left; border: 0; background: transparent; padding: 8px 10px; border-radius: 8px; font: inherit; font-size: 13px; cursor: pointer; }
.cal-menu button:hover:not(:disabled) { background: #f0f3fa; }
.cal-menu button:disabled { color: #333; cursor: default; font-size: 12px; background: #f7f8fb; }
.cal-fill { margin: 10px 0; border: 1px solid var(--line); border-radius: 10px; padding: 6px 10px; }
.cal-fill summary { cursor: pointer; font-weight: 600; font-size: 13px; }
.cal-fill-b { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.cal-fill-b label { display: flex; flex-direction: column; font-size: 12px; gap: 2px; }
.cal-fill-b input, .cal-fill-b select { font: inherit; font-size: 13px; padding: 5px 6px; border: 1px solid var(--line); border-radius: 8px; }
.cal-fill .cf-days { display: flex; flex-wrap: wrap; gap: 8px; }
.cal-fill .cf-days label { flex-direction: row; align-items: center; gap: 3px; font-size: 13px; }
.cal-fill [hidden] { display: none !important; }
.cal-sum { margin: 8px 0; }
.cal-btns { position: sticky; bottom: 0; background: #fff; padding: 8px 0 4px; z-index: 5; }
.cal-menu { z-index: 60; scroll-margin-bottom: 80px; }
.cal-wrap .wp-row { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.when-pop .wp-edit .wp-scope label, .when-pop .wp-edit label.wp-curtt { flex-direction: row; align-items: center; gap: 6px; font-weight: 400; color: inherit; }
.when-popup .leaflet-popup-content { max-height: 72vh; overflow-y: auto; }
.wp-runs .pm-tt, .cal-ved .pm-tt { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 10px; max-height: 260px; overflow-y: auto; }
.wp-runs .pm-ttr, .cal-ved .pm-ttr { display: flex; gap: 6px; align-items: center; }
.wp-runs .pm-ttr b, .cal-ved .pm-ttr b { width: 22px; flex: none; text-align: right; }
.wp-runs .pm-ttr span, .cal-ved .pm-ttr span { display: flex; flex-wrap: wrap; gap: 3px; }
.pm-ttm.run.on { background: #e8f6ee; border-color: #1f9d55; color: #14532d; font-weight: 700; }
.wp-runs .pm-ttm, .cal-ved .pm-ttm { border: 1px solid var(--line); background: var(--bg2); border-radius: 6px; padding: 3px 7px; font-size: 13px; font-weight: 600; color: var(--ink); min-width: 32px; cursor: pointer; }
.wp-runs .pm-ttm.on, .cal-ved .pm-ttm.on { background: #e8f6ee; border-color: #1f9d55; color: #14532d; }
/* ---------- 28: járatszám-jelvények, színes menüikonok, keskeny profil, csak menetrend szerinti idő ---------- */
.lnb { display: inline-flex; align-items: center; justify-content: center; min-width: 34px; height: 22px; padding: 0 7px; border-radius: 6px; font-weight: 800; font-size: 13px; line-height: 1; letter-spacing: .1px; vertical-align: middle; white-space: nowrap; box-shadow: inset 0 0 0 1px rgba(0,0,0,.06); font-family: inherit; }
.lnb.sm { min-width: 28px; height: 19px; font-size: 11.5px; padding: 0 5px; border-radius: 5px; }
.lnbs { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 3px; vertical-align: middle; }
.lnb-ar { font-style: normal; color: var(--muted, #778); font-weight: 700; margin: 0 1px; }
.pick-menu .pm-lh { display: flex; align-items: center; gap: 6px; }
.pick-menu .pm-lh .lnb { font-size: 14px; height: 24px; min-width: 38px; }
#bottomnav button .ic { filter: none; opacity: .9; }
#bottomnav button.active .ic { opacity: 1; transform: scale(1.08); }
#bottomnav .ic-svg { display: inline-flex; width: 26px; height: 26px; }
#bottomnav .ic-svg svg { width: 100%; height: 100%; }
@media (max-width: 420px) { #bottomnav .ic-svg { width: 23px; height: 23px; } }
@media (min-width: 900px) { #sheet.narrow { width: 340px; } }
@media (min-width: 560px) and (max-width: 899px) { #sheet.narrow { left: 0; right: 0; margin: 0 auto; width: 380px; } }
input.ro, .when-pop .wp-edit input.ro { background: #f2f4f8; color: #2b3a55; pointer-events: none; border-style: dashed; }
.wp-ttnote, .tt-note { margin: 2px 0 4px; }
/* ---------- 29: útvonalterv idővonal ---------- */
.itin { border: 1px solid var(--line); border-radius: 14px; padding: 10px 12px 8px; background: #fff; }
.itin-h { font-weight: 800; margin-bottom: 8px; display: flex; flex-wrap: wrap; gap: 6px; align-items: baseline; }
.it-list { display: flex; flex-direction: column; }
.it-stop, .it-leg { display: grid; grid-template-columns: 48px 18px 1fr; align-items: center; column-gap: 8px; }
.it-stop { min-height: 30px; }
.it-time { text-align: right; font-size: 13px; }
.it-t { font-weight: 700; color: var(--ink, #1d2433); }
.it-t.ex { color: #1f8a3b; }
.it-ic { font-size: 18px; align-self: start; padding-top: 8px; }
.it-dot { width: 14px; height: 14px; border-radius: 50%; border: 2.5px solid #1d2433; background: #fff; justify-self: center; position: relative; z-index: 1; }
.it-dot.end { background: #1d2433; box-shadow: inset 0 0 0 2.5px #fff; }
.it-name { font-weight: 700; font-size: 14px; }
.it-name small { font-weight: 500; margin-left: 4px; }
.it-leg { align-items: stretch; }
.it-bar { width: 6px; justify-self: center; background: var(--lc, #2f6fed); border-radius: 3px; margin: -4px 0; min-height: 52px; }
.it-body { padding: 8px 0 10px; border-top: 1px solid var(--bg2, #eef0f5); border-bottom: 1px solid var(--bg2, #eef0f5); }
.it-line { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.it-line .lnb { border-radius: 3px; }
.it-dir { font-weight: 600; font-size: 14px; flex: 1; min-width: 0; }
.it-ed { border: 0; background: #f1f4fa; border-radius: 8px; padding: 4px 7px; cursor: pointer; font-size: 14px; }
.it-ed:hover { background: #e2e8f5; }
.it-runs { margin-top: 6px; }
.it-runs .wp-sec { font-size: 12px; font-weight: 600; margin-bottom: 4px; }
.it-runs .pm-deplist { display: flex; flex-wrap: wrap; gap: 4px; }
/* ---------- 30: élesebb, arányos jelvények; vonatkép ikonok ---------- */
.vb, .lnb { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }
.vb { width: 24px; height: 24px; border-radius: 6px; vertical-align: -6px; box-sizing: border-box; }
.vb svg { width: 18px; height: 18px; shape-rendering: geometricPrecision; overflow: visible; }
.vb.sm { width: 20px; height: 20px; border-radius: 5px; vertical-align: -5px; } .vb.sm svg { width: 15px; height: 15px; }
.lnb { display: inline-block; box-sizing: border-box; height: 24px; line-height: 24px; min-width: 38px; padding: 0 8px; border-radius: 6px; text-align: center;
  font-family: "Helvetica Neue", Arial, "Segoe UI", Roboto, sans-serif; font-size: 14.5px; font-weight: 700; letter-spacing: 0; vertical-align: -6px; font-variant-numeric: tabular-nums; }
.lnb.sm { height: 20px; line-height: 20px; min-width: 32px; padding: 0 6px; font-size: 12.5px; border-radius: 5px; vertical-align: -5px; }
.pick-menu .pm-lh .lnb { height: 26px; line-height: 26px; font-size: 15px; min-width: 42px; vertical-align: middle; }
.pick-menu .pm-lh .vb { width: 26px; height: 26px; }
.pick-menu .pm-lh .vb svg { width: 19px; height: 19px; }
.lnbs { gap: 4px; }
/* vonat: a MÁV-START motorvonat képe */
.vb.vb-img { background: #eef3fb !important; border: 1px solid #c9d6ea; padding: 1px; overflow: hidden; }
.vb.vb-img img { width: 100%; height: 100%; object-fit: contain; display: block; image-rendering: auto; }
img.vic { width: 1.35em; height: 1.35em; object-fit: contain; vertical-align: -0.32em; display: inline-block; }
img.vic.bub { width: 18px; height: 18px; vertical-align: -4px; }
img.vic.it { width: 26px; height: 26px; vertical-align: middle; }
.chips img.vic, #vehChips img.vic { width: 20px; height: 20px; vertical-align: -5px; }
img.train-side { display: block; width: 100%; max-width: 260px; height: auto; margin: 2px 0 6px; }
img.train-side.wide { max-width: 320px; }
.pm-trains { display: flex; flex-direction: column; gap: 2px; }
/* ---------- 32: elkülönülő szerkesztő-szakaszok, kiemelt „Összes indulás”, mozgatható ablak ---------- */
#edForm { gap: 16px; }
#edForm fieldset.sec { --sc: #2f6fed; background: #f7f9fd; border: 1.5px solid #dde4f0; border-left: 6px solid var(--sc); border-radius: 14px; padding: 14px 14px 14px; gap: 12px; box-shadow: 0 1px 0 rgba(20,30,60,.04); }
#edForm fieldset.sec > legend { background: var(--sc); color: #fff; border-radius: 999px; padding: 4px 12px; font-size: 13px; font-weight: 700; margin-left: -4px; box-shadow: 0 2px 6px rgba(20,30,60,.15); }
#edForm fieldset.sec-route { --sc: #2f6fed; }
#edForm fieldset.sec-time { --sc: #e8900c; }
#edForm fieldset.sec-train { --sc: #0f8a8a; }
#edForm fieldset.sec-msg { --sc: #d6336c; }
#edForm fieldset.sec label { font-weight: 600; color: #2b3a55; }
#edForm fieldset.sec input, #edForm fieldset.sec select, #edForm fieldset.sec textarea { background: #fff; }
#edForm > .rt-name, #edForm > .itin, #edForm > .card { margin: 0; }
.pick-menu .pm-allbtn, .pm-allbtn { display: block; width: 100%; margin: 10px 0 4px; padding: 11px 12px; border-radius: 12px; border: 0;
  background: linear-gradient(135deg, #2f6fed, #1d4fc4); color: #fff; font-weight: 800; font-size: 14.5px; box-shadow: 0 4px 12px rgba(47,111,237,.35); cursor: pointer; }
.pick-menu .pm-allbtn:hover, .pm-allbtn:hover { filter: brightness(1.07); }
.pick-menu .pm-all { border: 2px solid #2f6fed; border-radius: 12px; padding: 8px; background: #f4f8ff; margin-top: 6px; }
/* számítógépen a térképi ablak megfogható */
.leaflet-popup.drag-pop .leaflet-popup-content-wrapper { cursor: grab; }
.leaflet-popup.drag-pop.dragging .leaflet-popup-content-wrapper { cursor: grabbing; box-shadow: 0 14px 36px rgba(20,30,60,.35); }
.leaflet-popup.drag-pop .leaflet-popup-content input, .leaflet-popup.drag-pop .leaflet-popup-content button, .leaflet-popup.drag-pop .leaflet-popup-content select { cursor: auto; }
.leaflet-popup.drag-pop .leaflet-popup-content button { cursor: pointer; }
.leaflet-popup.drag-pop.dragged .leaflet-popup-tip-container { display: none; }
.leaflet-popup.drag-pop .leaflet-popup-content-wrapper::before { content: '⠿ húzd'; position: absolute; left: 50%; top: 2px; transform: translateX(-50%); font-size: 10px; color: #8a94a8; letter-spacing: .5px; pointer-events: none; }

/* ---------- 35: éles feliratok, egyforma gombok ---------- */
.leaflet-popup-content .vb, .leaflet-popup-content .lnb, #pickSheet .vb, #pickSheet .lnb { will-change: auto; transform: none; }
.pick-menu .pm-lh .lnb { font-size: 14px; font-weight: 700; }
.pick-menu .pm-acts { display: flex; flex-direction: column; gap: 6px; }
.pick-menu .pm-acts .btn, .pick-menu .pm-allbtn, .pm-allbtn { display: flex; width: 100%; min-height: 38px; padding: 8px 12px; font-size: 14px; font-weight: 700; line-height: 1.2; border-radius: 10px; margin: 0; }
.pick-menu .pm-allbtn, .pm-allbtn { margin: 8px 0 2px; background: #2f6fed; color: #fff; border: 0; box-shadow: none; filter: none; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
.pick-menu .pm-allbtn:hover, .pm-allbtn:hover { background: #2559c9; filter: none; }
.leaflet-interactive.pick-hit { cursor: pointer; }
#pickSheet .pm-acts .btn, #pickSheet .pm-allbtn { min-height: 44px; padding: 10px 16px; font-size: 15px; font-weight: 700; }

/* ---------- 36: éles jelvényszöveg – egész pixeles betűméret, egész pixeles igazítás ---------- */
.lnb { font-size: 14px; font-weight: 700; -webkit-font-smoothing: subpixel-antialiased; text-rendering: auto; font-family: Arial, "Helvetica Neue", "Segoe UI", Roboto, sans-serif; }
.lnb.sm { font-size: 12px; }
.pick-menu .pm-lh .lnb { font-size: 14px; }

/* ---------- 37: hibanapló ---------- */
.err-log { margin: 6px 0; max-height: 220px; overflow: auto; white-space: pre-wrap; word-break: break-word; font: 12px/1.45 Consolas, "Courier New", monospace; background: #f6f8fb; border: 1px solid var(--line); border-radius: 8px; padding: 8px; color: #1d2433; }

/* ---------- Jármű adatok (v40) ---------- */
@media (min-width: 900px) { #sheet.wide { width: 560px; } }
@media (min-width: 560px) and (max-width: 899px) { #sheet.wide { left: 0; right: 0; margin: 0 auto; width: 560px; } }
#edForm fieldset.sec-veh { --sc: #16a34a; min-width: 0; max-width: 100%; }
.vlegs { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.vleg { background: #fff; border: 1px solid #d5ecdc; border-radius: 12px; padding: 10px 10px 12px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.vleg-h, .vdrow-h { display: flex; align-items: center; gap: 7px; font-size: 14px; font-weight: 700; color: #2b3a55; flex-wrap: wrap; }
.vleg-h .muted { font-weight: 500; font-size: 13px; }
.vtype { display: inline-flex; align-items: center; gap: 5px; background: #eaf7ee; color: #166534; border-radius: 14px; padding: 3px 10px; font-size: 13px; font-weight: 700; }
.vtype img.vic { width: 20px; height: 20px; }
.vchips button.on { background: #16a34a; border-color: #16a34a; color: #fff; }
.vchips img.vic { width: 20px; height: 20px; vertical-align: -5px; }
#edForm label.vchk { display: flex; flex-direction: row; align-items: center; gap: 7px; font-weight: 500; }
.vchk input { accent-color: #16a34a; width: 18px; height: 18px; margin: 0; }
.vsub { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; font-size: 14px; color: #2b3a55; }
.cstep { display: inline-flex; align-items: center; gap: 6px; border: 1px solid #cfe7d6; border-radius: 10px; padding: 2px; background: #fff; font-size: 14px; }
.cstep button { width: 30px; height: 28px; border: 0; border-radius: 8px; background: #eaf7ee; color: #166534; font: 700 18px Arial; cursor: pointer; }
.cstep small { font-size: 12px; color: #7a8396; margin-right: 4px; }
.cscroll { max-width: 100%; min-width: 0; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; border-radius: 10px; background: linear-gradient(#f3f8ff, #fbfdff); border: 1px solid #e3ebf5; }
.cscroll::-webkit-scrollbar { height: 8px; } .cscroll::-webkit-scrollbar-thumb { background: #b9c7d8; border-radius: 4px; }
.consist { display: block; max-width: none; }
.consist .hit { cursor: pointer; }
.cscroll.ro .consist { pointer-events: none; }
.cpills { display: flex; gap: 5px; flex-wrap: wrap; }
.cp { min-width: 42px; height: 32px; border: 1.5px solid #9fb0c6; border-radius: 7px; background: #fff; font: 700 14px Arial; color: #2b3a55; display: inline-flex; align-items: center; justify-content: center; gap: 3px; padding: 0 6px; cursor: pointer; }
.cp.head { border-radius: 7px 15px 7px 7px; }
.cp.on { background: #16a34a; border-color: #16a34a; color: #fff; }
.cp small { font: 600 11px Arial; }
.cdir { font-size: 12px; color: #7a8396; display: flex; justify-content: space-between; }
.cwhere { font-size: 14px; color: #166534; font-weight: 700; }
#edForm label.vfield { display: flex; flex-direction: column; gap: 4px; }
.vfield .small { font-weight: 500; }
.vfield input[data-f="cno"] { font: 600 16px Arial; letter-spacing: .5px; }
/* 49b: valósághű magyar rendszámtábla – fehér alap, vékony fekete keret, EU-sáv (12 csillag + H), új típusnál címer */
.plate { display: flex; align-items: stretch; border: 2.5px solid #111; border-radius: 7px; background: linear-gradient(#ffffff, #f3f4f6); overflow: hidden; width: 250px; max-width: 100%; height: 50px;
  box-shadow: inset 0 0 0 1.5px #fff, inset 0 0 0 2.5px #2b2b2b, 0 1px 3px rgba(0,0,0,.25); padding: 3px; gap: 0; }
.plate .pl-eu { flex: none; width: 23px; height: 100%; border-radius: 3px 0 0 3px; display: block; }
.plate .pl-txt { position: relative; flex: 1; min-width: 0; display: flex; align-items: center; }
#edForm .plate input { border: 0; border-radius: 0; background: transparent; width: 100%; min-width: 0; height: 100%; padding: 0 8px 0 10px; color: #111;
  font: 700 30px/1 "Arial Narrow", "Roboto Condensed", "Helvetica Neue Condensed", "DIN Condensed", Arial, sans-serif; font-stretch: condensed; letter-spacing: 1.5px; word-spacing: 12px; text-transform: uppercase; box-shadow: none; }
#edForm .plate input:focus { outline: none; }
.plate:focus-within { border-color: #2f6fed; }
.plate .pl-cimer { position: absolute; top: 50%; width: 11px; height: 17px; transform: translate(-50%, -50%); pointer-events: none; display: block; }
.plate .pl-cimer[hidden] { display: none; }
.plate .pl-cimer svg { display: block; width: 100%; height: 100%; }
.pl-kind { display: block; margin-top: 3px; }
#edForm .plate input::placeholder { color: #c5cad3; font-weight: 700; }
.vfield input::placeholder { text-transform: none; font-weight: 400; letter-spacing: 0; }
.vdview { border: 1px solid #d5ecdc; border-left: 5px solid #16a34a; border-radius: 12px; padding: 10px; display: flex; flex-direction: column; gap: 10px; background: #f8fcf9; min-width: 0; }
.vdview-h { font-weight: 700; color: #166534; font-size: 14px; }
.vdrow { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.vlab { display: block; }
.vlab .small { font-weight: 500; }

/* ---------- Net nélküli mód (v41) ---------- */
#netBadge { position: fixed; z-index: 650; top: 62px; left: 0; right: 0; margin: 0 auto; width: max-content; max-width: calc(100% - 24px);
  border: 0; border-radius: 999px; padding: 7px 14px; font: 700 14px/18px Arial, sans-serif; color: #fff; box-shadow: 0 3px 10px rgba(20,30,60,.25); cursor: pointer; }
#netBadge[hidden] { display: none; }
#netBadge.net-offline { background: #b42318; }
#netBadge.net-lan { background: #b45309; }
#netBadge.net-online { background: #1d4ed8; }
.net-pill { display: flex; flex-direction: column; gap: 3px; border-radius: 12px; padding: 10px 12px; margin: 10px 0 4px; text-align: left; font-size: 13px; line-height: 18px; border: 1.5px solid; }
.net-pill b { font-size: 14px; }
.net-pill.net-online { background: #ecfdf3; border-color: #a6e9c0; color: #14532d; }
.net-pill.net-lan { background: #fff7e6; border-color: #f5c77e; color: #7a3e00; }
.net-pill.net-offline { background: #fdecea; border-color: #f3a39b; color: #7f1d1d; }
#netGate { position: fixed; inset: 0; z-index: 3000; background: rgba(15,23,42,.55); display: flex; align-items: center; justify-content: center; padding: 16px; }
.ng-card { background: #fff; border-radius: 18px; padding: 22px 20px 18px; max-width: 420px; width: 100%; box-shadow: 0 12px 40px rgba(0,0,0,.3); border-top: 8px solid #b42318; color: #1d2433; }
.ng-card.net-lan { border-top-color: #b45309; }
.ng-card .ng-ic { font-size: 40px; line-height: 44px; }
.ng-card h2 { margin: 6px 0 8px; font-size: 20px; line-height: 26px; }
.ng-card p { margin: 0 0 10px; font-size: 15px; line-height: 21px; color: #334155; }
.ng-card .ng-warn { color: #7f1d1d; font-weight: 700; }
.ng-btns { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; margin-top: 6px; }
.ob-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; margin-bottom: 6px; }
.pending-note { background: #fff7e6; border: 1px solid #f5c77e; color: #7a3e00; border-radius: 10px; padding: 8px 10px; font-size: 14px; font-weight: 600; margin: 0; }

/* 44: Online / Offline kapcsoló az alsó sávban */
#bottomnav #netToggle .nt-ic svg { width: 24px; height: 24px; display: block; }
#bottomnav #netToggle .nt-x { display: none; }
#bottomnav #netToggle { color: #1f7a45; }
#bottomnav #netToggle.is-lan circle:first-child { fill: #e8900c; }
#bottomnav #netToggle.is-lan { color: #b86e00; }
#bottomnav #netToggle.is-off { color: #8a93a6; }
#bottomnav #netToggle.is-off .nt-x { display: inline; }
#bottomnav #netToggle.is-off svg > :not(.nt-x) { opacity: .5; }
#bottomnav #netToggle.is-off circle:first-child { fill: #9aa3b5; }
#bottomnav button .ic.ic-svg.nt-ic { filter: none; opacity: 1; }
@media (max-width: 480px) { #bottomnav b.lf { display: none; } #bottomnav b.ls { display: inline; } #bottomnav button { font-size: 11.5px; letter-spacing: 0; } }
/* 44: saját bejegyzésnél a Szerkesztés / Megosztás / Törlés közvetlenül a név alatt */
.post-own-acts { margin: 4px 0 10px; flex-wrap: nowrap; gap: 6px; }
.post-own-acts .btn { flex: 1 1 0; min-width: 0; white-space: nowrap; padding: 9px 6px; font-size: 14px; }
/* 44: útvonal-ablak gombjai */
.when-pop .wp-acts .wp-rev { background: #eef4ff; color: #1d3f9e; border: 1px solid #c9d8ff; }
/* 44: ceruzás (toll) kézírás / rajzolás tiltása a szövegmezőkben – a toll koppintásra a billentyűzet jön fel */
input, textarea, select, [contenteditable] { touch-action: pan-x pan-y pinch-zoom; }
/* 45b: irányjelző nyilak a kijelölt (szerkesztett) útvonalon */
.flow-arr.pick-arr { transition: none; color: #fff; }
@media (prefers-reduced-motion: reduce) { .flow-arr.pick-arr { display: block; } }
/* 46b: GPS-követés – saját hely iránynyíllal, és az ugyanazon a járaton utazók */
.live-me { position: relative; width: 40px; height: 40px; }
.live-me .lm-dot { position: absolute; left: 11px; top: 11px; width: 18px; height: 18px; border-radius: 50%; background: #2f6fed; border: 3px solid #fff; box-shadow: 0 0 0 6px rgba(47,111,237,.25), 0 2px 6px rgba(0,0,0,.35); }
.live-me .lm-arr { position: absolute; inset: 0; display: flex; align-items: center; justify-content: flex-end; font-size: 15px; color: #2f6fed; text-shadow: 0 0 3px #fff, 0 0 3px #fff; }
.live-other { width: 34px; height: 34px; border-radius: 50%; background: #ff5a5f; border: 3px solid #fff; box-shadow: 0 0 0 4px rgba(255,90,95,.3), 0 2px 6px rgba(0,0,0,.35); display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 800; font-size: 15px; overflow: hidden; }
.live-other i { width: 100%; height: 100%; background-size: cover; background-position: center; }
.live-tip { font-size: 12.5px; line-height: 1.35; }
/* 48: e-mail megerősítés */
#verifyBar { position: fixed; left: 8px; right: 8px; top: 64px; z-index: 460; display: flex; align-items: center; gap: 8px; background: #fff7e6; border: 1px solid #ffd591; color: #6b4200; border-radius: 12px; padding: 8px 10px; font-size: 13px; box-shadow: 0 4px 14px rgba(0,0,0,.12); }
#verifyBar span { flex: 1; min-width: 0; }
#verifyBar .btn { flex: none; background: #fff; border: 1px solid #ffd591; }
#verifyBar .vb-x { flex: none; border: 0; background: none; font-size: 15px; color: #6b4200; padding: 4px; }
@media (min-width: 900px) { #verifyBar { left: auto; right: 12px; max-width: 520px; } }
.forgot-mail { background: #f5f6fa; border-radius: 12px; padding: 10px 12px; }
/* oldalba illő megerősítő ablak (askConfirm) – a képernyő közepén */
.ask-ov { position: fixed; inset: 0; z-index: 3500; background: rgba(15,23,42,.55); display: flex; align-items: center; justify-content: center; padding: 16px; }
.ask-card { background: #fff; border-radius: 18px; padding: 20px 20px 16px; max-width: 380px; width: 100%; box-shadow: 0 12px 40px rgba(0,0,0,.3); border-top: 6px solid var(--primary); color: var(--ink); text-align: center; }
.ask-card .ask-ic { font-size: 34px; line-height: 40px; }
.ask-card h2 { margin: 6px 0 6px; font-size: 18px; line-height: 24px; color: var(--navy); }
.ask-card p { margin: 0 0 12px; font-size: 14px; line-height: 20px; color: #334155; }
.ask-card .ng-btns { justify-content: center; }
.ask-card .ng-btns .btn { min-width: 110px; }
.btn.danger-solid { background: #c0262d; color: #fff; }
.btn.danger-solid:hover { background: #a31f25; }
/* 50: Online – saját GPS-hely a profilképpel */
.me-online { position: relative; width: 44px; height: 44px; }
.me-online .mo-face { position: absolute; left: 4px; top: 4px; width: 36px; height: 36px; border-radius: 50%; border: 3px solid #fff; box-sizing: border-box; background-size: cover; background-position: center;
  box-shadow: 0 0 0 3px #1f9d55, 0 3px 8px rgba(0,0,0,.35); display: flex; align-items: center; justify-content: center; color: #fff; font: 800 16px/1 system-ui, sans-serif; font-style: normal; }
.me-online .mo-dot { position: absolute; right: 1px; bottom: 2px; width: 12px; height: 12px; border-radius: 50%; background: #1f9d55; border: 2px solid #fff; animation: moPulse 2s ease-out infinite; }
@keyframes moPulse { 0% { box-shadow: 0 0 0 0 rgba(31,157,85,.55); } 100% { box-shadow: 0 0 0 10px rgba(31,157,85,0); } }
.live-me .lm-dot.lm-face { left: 6px; top: 6px; width: 28px; height: 28px; overflow: hidden; padding: 0; background: #2f6fed; }
.live-me .lm-face .lm-img { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; background-size: cover; background-position: center; color: #fff; font: 800 12px/1 system-ui, sans-serif; font-style: normal; }
/* 50: zöld „Útvonal mentése” gomb és a leszúrt gombostű */
.btn.save-green { background: var(--ok); color: #fff; }
.btn.save-green:hover { background: #17834a; }
.pin-drop { position: relative; width: 40px; height: 48px; }
.pin-drop span { position: absolute; left: 0; top: 0; font-size: 32px; line-height: 1; animation: pinDrop .55s cubic-bezier(.3,1.6,.6,1) both; filter: drop-shadow(0 2px 2px rgba(0,0,0,.35)); }
.pin-drop i { position: absolute; left: 7px; bottom: 0; width: 12px; height: 5px; border-radius: 50%; background: rgba(0,0,0,.3); animation: pinShadow .55s ease-out both; }
@keyframes pinDrop { 0% { transform: translateY(-70px) rotate(-25deg); opacity: 0; } 60% { opacity: 1; } 100% { transform: none; } }
@keyframes pinShadow { 0% { transform: scale(.2); opacity: 0; } 100% { transform: none; opacity: 1; } }
.pin-fade { transition: opacity .8s; opacity: 0; }
.when-pop .wp-kb { font-size: .8em; font-weight: 600; color: var(--muted); }
/* 53: gombostű-mód – a kurzor gombostű; az útvonalak, jelek ilyenkor nem kattinthatók (a kattintás a térképre megy) */
body.pinning .leaflet-container, body.pinning .leaflet-container .leaflet-interactive, body.pinning .leaflet-grab { cursor: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20d%3D%22M3%2029l9-9%22%20stroke%3D%22%23555%22%20stroke-width%3D%222.4%22%20stroke-linecap%3D%22round%22/%3E%3Cpath%20d%3D%22M19.5%202.5l10%2010-3%201.2-5.6%205.6.6%205.2-2.6%202.6-13-13%202.6-2.6%205.2.6%205.6-5.6z%22%20fill%3D%22%23e5262f%22%20stroke%3D%22%23fff%22%20stroke-width%3D%221.4%22%20stroke-linejoin%3D%22round%22/%3E%3Cpath%20d%3D%22M21%205.5l5.5%205.5%22%20stroke%3D%22%23ff8a8f%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22/%3E%3C/svg%3E") 3 29, crosshair !important; }
body.pinning .leaflet-container .leaflet-interactive { pointer-events: none !important; }
#pinBar { position: fixed; left: 10px; right: 10px; top: 62px; z-index: 690; display: flex; align-items: center; gap: 10px; background: var(--ok); color: #fff; border-radius: 14px; padding: 10px 12px; box-shadow: var(--shadow); }
#pinBar .pb-ic { font-size: 26px; line-height: 1; }
#pinBar .pb-t { flex: 1; display: flex; flex-direction: column; gap: 2px; font-size: 15px; }
#pinBar .pb-t small { font-size: 12.5px; opacity: .92; }
#pinBar .btn { background: #fff; color: var(--ink); border: 0; }
@media (min-width: 900px) { #pinBar { left: 50%; right: auto; transform: translateX(-50%); width: 560px; } }
.route-pin { font-size: 26px; line-height: 1; filter: drop-shadow(0 2px 2px rgba(0,0,0,.35)); cursor: pointer; }

/* 54: „Láttalak” – saját, nagyobb ikon és nagyobb felirat */
.seen-ic { width: 1.45em; height: 1.45em; vertical-align: -.36em; flex: none; display: inline-block; }
.bubble.place2 .pb-kind { display: inline-flex; align-items: center; gap: 3px; font-size: 14.5px; font-weight: 800; letter-spacing: .2px; }
.bubble.place2 .pb-kind .seen-ic { width: 22px; height: 22px; vertical-align: middle; }
.seen-form .pm-title.seen-title, .pm-title.seen-title { display: inline-flex; align-items: center; gap: 6px; font-size: 20px; font-weight: 800; }
.pm-title.seen-title .seen-ic { width: 30px; height: 30px; }
.badge .seen-ic { width: 1.35em; height: 1.35em; vertical-align: -.32em; }
.badge.seen .seen-ic path[fill="#e8485f"] { fill: #e8485f; }
.badge.seen .seen-ic { background: #fff; border-radius: 50%; padding: 1px; }
.btn .seen-ic { width: 1.5em; height: 1.5em; }
/* 54: képregényes szövegbuborék – feljebb, ferde „farokkal” a megjelölt ponthoz, ott egy kis pöttyel */
.bubble { --bc: var(--trip); }
.bubble.seen { --bc: var(--seen); } .bubble.place { --bc: var(--place); }
.bubble:not(.compact) { bottom: 54px; transform: translateX(-28%); }
.bubble:not(.compact)::before, .bubble:not(.compact)::after { content: ""; position: absolute; top: 100%; bottom: auto; margin: 0; width: 0; height: 0; border-style: solid; transform-origin: top left; transform: skewX(-28deg); }
.bubble:not(.compact)::before { left: calc(28% + 17.5px); margin-top: 0; border-width: 50px 9px 0 9px; border-color: var(--bc) transparent transparent transparent; }
.bubble:not(.compact)::after { left: calc(28% + 16px); margin-left: 3px; margin-top: -4px; border-width: 47px 6px 0 6px; border-color: #fff transparent transparent transparent; }
.bubble .bub-dot { position: absolute; left: 28%; top: calc(100% + 54px); width: 12px; height: 12px; margin-left: -6px; margin-top: -6px; border-radius: 50%; background: var(--bc); border: 2.5px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,.35); pointer-events: none; }
/* 55: kimenő / bejövő jelölés az üzenetlistában (mint a híváslistában) */
.conv-last { display: flex; align-items: center; gap: 6px; min-width: 0; }
.conv-last > span:last-child { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.cdir { display: inline-flex; align-items: center; gap: 3px; flex: none; font-size: 11.5px; font-weight: 700; border-radius: 999px; padding: 1px 7px 1px 4px; }
.cdir svg { width: 15px; height: 15px; display: block; }
.cdir.out { color: #1f9d55; background: #e7f6ee; }
.cdir.in { color: #2f6fed; background: #e9f0fe; }
.cdir.in.new { color: #e5262f; background: #fdecec; }
/* 55: válasz a térképen */
.bubble .pb-reply { display: block; margin-top: 6px; width: 100%; border: 0; border-radius: 8px; padding: 5px 8px; font-size: 12.5px; font-weight: 700; color: #fff; background: var(--bc, var(--primary)); cursor: pointer; }
.bubble .pb-reply:hover { filter: brightness(.92); }
.map-reply { min-width: 240px; }
.map-reply .mr-h { display: flex; align-items: center; gap: 7px; font-size: 14px; }
.map-reply .mr-q { margin: 6px 0; font-size: 12.5px; color: var(--muted); font-style: italic; }
.map-reply textarea { width: 100%; box-sizing: border-box; border: 1px solid var(--line); border-radius: 10px; padding: 8px; font: inherit; font-size: 14px; resize: vertical; }
.map-reply .mr-b { display: flex; justify-content: flex-end; margin-top: 6px; }
.map-reply .mr-ok { font-weight: 700; color: var(--ok); margin-bottom: 8px; font-size: 15px; }
/* 56: Villám Láttalak gomb (csak bekapcsolt GPS-nél látszik) */
.round-btn.flash-btn { background: var(--seen); display: flex; align-items: center; justify-content: center; box-shadow: 0 0 0 3px #fff, var(--shadow); }
.round-btn.flash-btn svg { width: 26px; height: 26px; display: block; }
.round-btn.flash-btn.busy { opacity: .6; animation: flashPulse .8s ease-in-out infinite; }
@keyframes flashPulse { 50% { transform: scale(.9); } }
.flash-burst { position: absolute; left: -40px; top: -40px; width: 80px; height: 80px; border-radius: 50%; border: 4px solid var(--seen); animation: flashBurst 1.2s ease-out forwards; }
@keyframes flashBurst { from { transform: scale(.2); opacity: 1; } to { transform: scale(1.6); opacity: 0; } }

/* 57: a + gomb tartalma tárcsa formában – kupola egy szélesebb sávon, a + fölött (a + gomb alakja változatlan) */
#newDial { position: fixed; inset: 0; z-index: 720; pointer-events: none; }
#newDial .nd-back { position: absolute; inset: 0 0 calc(var(--nav-h) + var(--safe-b)) 0; background: rgba(15,23,42,.28); opacity: 0; transition: opacity .18s; pointer-events: auto; }
#newDial.on .nd-back { opacity: 1; }
#newDial .nd-dome { position: fixed; pointer-events: none; aspect-ratio: auto; transform-origin: 50% 100%; transform: scale(.3) translateY(40px); opacity: 0; transition: transform .2s cubic-bezier(.3,1.4,.6,1), opacity .15s; }
#newDial.on .nd-dome { transform: none; opacity: 1; }
#newDial .nd-arc { position: absolute; left: 0; right: 0; bottom: 22px; aspect-ratio: 2 / 1; border-radius: 999px 999px 0 0; background: #fff; box-shadow: 0 -6px 24px rgba(20,30,60,.22); border: 2px solid #f1f3f8; border-bottom: 0; pointer-events: auto; }
#newDial .nd-bar { position: absolute; left: -18px; right: -18px; bottom: 0; height: 26px; border-radius: 13px; background: #fff; box-shadow: 0 6px 18px rgba(20,30,60,.22); pointer-events: auto; }
#newDial .nd-hint { position: absolute; left: 0; right: 0; bottom: 5px; text-align: center; font-size: 12.5px; font-weight: 700; color: var(--muted); pointer-events: none; }
#newDial .nd-item { position: absolute; transform: translate(-50%, 50%); width: 82px; display: flex; flex-direction: column; align-items: center; gap: 4px; border: 0; background: none; padding: 0; pointer-events: auto; cursor: pointer; }
#newDial .nd-item .nd-ic { width: 58px; height: 58px; border-radius: 50%; background: var(--kb); border: 3px solid var(--kc); display: flex; align-items: center; justify-content: center; font-size: 27px; box-shadow: 0 3px 10px rgba(0,0,0,.18); transition: transform .12s; }
#newDial .nd-item .nd-ic .seen-ic { width: 36px; height: 36px; }
#newDial .nd-item:hover .nd-ic, #newDial .nd-item:focus-visible .nd-ic { transform: scale(1.08); }
#newDial .nd-item b { font-size: 13px; color: var(--navy); white-space: nowrap; }
#bottomnav .fab span { display: inline-block; transition: transform .2s; }
body.dial-open #bottomnav .fab span { transform: rotate(45deg); }
body.dial-open #bottomnav .fab { position: relative; z-index: 730; }
/* 59: Profil – QR-kódjaim (profil + programletöltés) */
.prof-qrs { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pq-card { display: flex; flex-direction: column; align-items: center; gap: 4px; border: 1px solid var(--line); background: #fff; border-radius: 14px; padding: 12px 8px 10px; cursor: pointer; text-align: center; }
.pq-card:hover { border-color: var(--primary); }
.pq-card .pq-img { display: flex; align-items: center; justify-content: center; min-width: 120px; min-height: 120px; }
.pq-card .pq-img canvas { display: block; }
.pq-card b { font-size: 14.5px; color: var(--navy); }
.pq-card small { font-size: 12px; color: var(--muted); line-height: 1.3; }
.ask-card.qr-big { max-width: 360px; }
.qr-big .qb-img { display: flex; justify-content: center; margin: 6px 0 8px; }
.qr-big .qb-url { word-break: break-all; margin-bottom: 10px; }
.qr-big .ng-btns { flex-wrap: wrap; }
/* 60: Útvonaltervem – a nap közvetlenül átírható */
.itin-h .it-date { position: relative; display: inline-flex; align-items: center; gap: 3px; margin-left: 4px; white-space: nowrap; vertical-align: middle; flex-direction: row; flex: none; font-size: 13px; cursor: pointer; border: 1px dashed #b8c2d6; border-radius: 8px; padding: 1px 6px; background: #f7f9fd; }
.itin-h .it-date:hover { border-color: var(--trip); background: #eef3ff; }
.itin-h .it-date .it-din { position: absolute; inset: 0; opacity: 0; width: 100%; height: 100%; cursor: pointer; border: 0; padding: 0; }
.itin-h .it-date .it-dn { font-weight: 700; color: var(--navy); }
.itin-h .it-date .it-dico { font-size: 12px; }
/* 60: Láttalak – profilkép és név a fejléc alatt */
.seen-form .seen-who { display: flex; align-items: center; gap: 7px; margin: -2px 0 4px; font-size: 14px; }
/* 60: elhúzható szövegbuborék */
.bubble:not(.compact) { transform: translate(calc(-28% + var(--ox, 0px)), var(--oy, 0px)); touch-action: none; cursor: grab; }
.bubble.dragging { cursor: grabbing; box-shadow: 0 10px 26px rgba(0,0,0,.35); z-index: 6; }
.bubble.moved::before, .bubble.moved::after, .bubble.moved .bub-dot { display: none; }
.bubble-icon .bub-tail { position: absolute; left: 0; top: 0; width: 1px; height: 1px; overflow: visible; pointer-events: none; }

/* ---------- 61: Útvonaltervem – menetválasztó (időrend, csatlakozás, teljes menetrend) ---------- */
.it-runs { border: 1px solid #cfd6e4; border-radius: 10px; padding: 8px 10px 10px; background: #fbfcfe; }
.it-runs .rp-top { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 6px; }
.it-runs .rp-tabs { display: flex; background: var(--bg2); border-radius: 8px; padding: 2px; }
.it-runs .rp-tab { border: 0; background: transparent; font-size: 12.5px; font-weight: 700; padding: 4px 10px; border-radius: 6px; color: var(--muted); }
.it-runs .rp-tab.on { background: #fff; color: var(--navy); box-shadow: 0 1px 3px rgba(0,0,0,.15); }
.it-runs .rp-stp { font-size: 12px; color: var(--muted); margin-left: auto; }
.it-runs .rp-info { font-size: 12px; background: #eef6ff; border: 1px solid #cfe2fb; color: #1c3d6e; border-radius: 7px; padding: 5px 8px; margin-bottom: 7px; line-height: 1.4; }
.it-runs .rp-info b { color: #0b2f74; }
.it-runs .rp-nav { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; }
.it-runs .rp-nb { font-size: 12px; font-weight: 700; border: 1px solid #cfd6e4; background: #fff; border-radius: 6px; padding: 3px 8px; color: var(--navy); }
.it-runs .rp-nb:disabled { opacity: .4; cursor: default; }
.it-runs .rp-rng { flex: 1; text-align: center; font-size: 11.5px; color: var(--muted); }
.it-runs .rp-chips { display: flex; flex-wrap: wrap; gap: 5px; }
.rp-ch { border: 1px solid #cfd6e4; background: #fff; border-radius: 8px; padding: 5px 4px; min-width: 66px; text-align: center; font-weight: 700; font-size: 14px; color: var(--navy); line-height: 1.1; }
.rp-ch small { display: block; font-size: 9.5px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; margin-top: 2px; color: var(--muted); }
.rp-ch.cur { background: #e8f6ee; border: 2px solid #1f9d55; color: #14532d; cursor: default; }
.rp-ch.cur small { color: #1f9d55; }
.rp-ch.early { color: #8a93a6; background: #f6f7f9; }
.rp-ch.early small { color: #9aa3b5; }
.rp-ch.miss { color: #b9bfcc; background: #f6f7f9; border-style: dashed; }
.rp-ch.miss small { color: #d1121b; }
.rp-ch.gone { color: #b9bfcc; background: #f3f4f6; border-style: dashed; }
.rp-ch.gone small { color: #9aa3b5; }
.rp-ch.first { border: 2px solid #2f6fed; color: #2f6fed; }
.rp-ch.first small { color: #2f6fed; }
.rp-ch.sel { outline: 2px solid var(--navy); }
.rp-ch.busy, .rp-m.busy { opacity: .5; }
.it-runs .rp-now { width: 100%; display: flex; align-items: center; gap: 6px; font-size: 11px; color: #1f9d55; font-weight: 700; }
.it-runs .rp-now::before, .it-runs .rp-now::after { content: ""; flex: 1; border-top: 1px dashed #9fd3b4; }
.it-runs .rp-tt { position: relative; display: grid; grid-template-columns: 1fr; gap: 3px; max-height: 300px; overflow-y: auto; }
.it-runs .rp-ttr { display: flex; gap: 6px; align-items: center; padding: 2px 4px; border-radius: 6px; }
.it-runs .rp-ttr.now { background: #fff6e5; outline: 1px solid #f3c77a; }
.it-runs .rp-ttr b { width: 26px; flex: none; text-align: right; color: var(--navy); font-size: 14px; }
.it-runs .rp-ttr span { display: flex; flex-wrap: wrap; gap: 3px; }
.rp-m { border: 1px solid #cfd6e4; background: var(--bg2); border-radius: 6px; padding: 3px 0; min-width: 34px; text-align: center; font-size: 13px; font-weight: 600; color: var(--ink); }
.rp-m.cur { background: #e8f6ee; border: 2px solid #1f9d55; color: #14532d; font-weight: 800; cursor: default; }
.rp-m.miss, .rp-m.gone { color: #b9bfcc; background: #f6f7f9; border-style: dashed; }
.rp-m.miss { text-decoration: line-through; }
.rp-m.first { border: 2px solid #2f6fed; color: #2f6fed; }
.rp-m.sel { outline: 2px solid var(--navy); }
.it-runs .rp-leg { display: flex; gap: 12px; flex-wrap: wrap; font-size: 11.5px; color: var(--muted); margin-top: 8px; }
.it-runs .rp-leg i { display: inline-block; width: 12px; height: 12px; border-radius: 3px; vertical-align: -2px; margin-right: 4px; border: 1px solid #cfd6e4; }
.it-runs .rp-leg .lg-cur { background: #e8f6ee; border-color: #1f9d55; }
.it-runs .rp-leg .lg-miss, .it-runs .rp-leg .lg-gone { background: #f6f7f9; border-style: dashed; }
.it-runs .rp-leg .lg-early { background: #f6f7f9; }
/* ---------- 62: járatválasztó – egysoros fejléc, szimmetrikus X, sorrend-jelölés ---------- */
.pick-menu .pm-head { display: flex; align-items: center; box-sizing: border-box; min-height: 36px; height: 36px; padding: 0 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pick-pop .pm-head { margin-right: 38px; }
.leaflet-container .pick-pop a.leaflet-popup-close-button { top: 12px; right: 12px; }
#pickSheet .ps-x { top: 11px; right: 11px; display: flex; align-items: center; justify-content: center; padding: 0; line-height: 1; }
#pickSheet .pm-head { margin-right: 46px; }
.pick-menu .pm-line.pm-prev { background: #f6f7f9; opacity: .8; }
.pick-menu .pm-prevtag { margin-left: auto; font-size: 10.5px; font-weight: 700; color: #6b7385; background: #eef0f4; border-radius: 5px; padding: 1px 6px; white-space: nowrap; }
/* 62: GPS jel az Online gombon (háttér nélkül) – zöld: aktív, piros: offline, szürke: nincs engedély / ki */
#bottomnav #netToggle .nt-gps { position: absolute; top: 6px; left: calc(50% + 5px); width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; cursor: pointer; }
#bottomnav #netToggle .nt-gps svg { width: 17px; height: 17px; display: block; overflow: visible; shape-rendering: geometricPrecision; }
#bottomnav #netToggle .nt-gps.gps-on { color: #1f9d55; }
#bottomnav #netToggle .nt-gps.gps-off { color: #e2262f; }
#bottomnav #netToggle .nt-gps.gps-no { color: #9aa3b5; }
#bottomnav #netToggle .nt-gps::before { content: ""; position: absolute; inset: -8px; }   /* nagyobb érintési felület */
/* 62: „Mutassam a helyzetedet?” kártya */
#geoCard { position: fixed; inset: 0; z-index: 2000; background: rgba(20,30,60,.35); display: flex; align-items: center; justify-content: center; padding: 16px; }
#geoCard .gc-box { width: 100%; max-width: 400px; background: #fff; border-radius: 14px; box-shadow: var(--shadow); padding: 14px 16px; }
#geoCard h3 { margin: 0 0 6px; font-size: 16px; }
#geoCard p { margin: 0 0 12px; font-size: 14px; line-height: 1.45; color: #333; }
#geoCard .gc-row { display: flex; gap: 8px; }
#geoCard .gc-b { flex: 1; border: 0; border-radius: 10px; padding: 10px; font-weight: 800; font-size: 14px; background: #f0f2f6; color: var(--navy); }
#geoCard .gc-b.p { background: #1f9d55; color: #fff; }
#bottomnav #netToggle.is-off .nt-gps svg > * { opacity: 1; }   /* offline: a piros GPS jel teljes erővel látszik */
/* ---------- 63: valódi járműképek (CAF, KISS) – zónagombok ---------- */
.consist-img image { image-rendering: auto; }
.vleg .zch { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 2px; }
.vleg .zch button { border: 1px solid #cfd6e4; background: #fff; border-radius: 999px; padding: 5px 11px; font-weight: 700; font-size: 13px; color: #1f2a44; cursor: pointer; }
.vleg .zch button.on { background: #16a34a; border-color: #16a34a; color: #fff; }
.bubble-icon .bub-tail { z-index: 6; }   /* 63: a farok a buborék keretén felül – egybefolyik */
/* ---------- 66: Program frissítése (UPDATE mappából) ---------- */
.btn.upd-btn { background: #1f9d55; color: #fff; }
.upd-btn .upd-badge { background: #fff; color: #1f9d55; border-radius: 6px; padding: 0 6px; margin-left: 4px; font-weight: 800; }
.upd { max-width: 520px; }
.upd h3 { margin: 0 0 8px; font-size: 17px; }
.upd-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 8px 0; border-top: 1px solid #eef0f4; font-size: 14px; }
.upd-row b { font-size: 15px; }
.upd-new { color: #1f9d55; }
.upd-tag { font-size: 11.5px; border-radius: 6px; padding: 2px 7px; background: #e8f6ee; color: #14532d; }
.upd-list { margin: 6px 0 0 18px; padding: 0; line-height: 1.5; color: #444; }
.upd .btn { display: block; width: 100%; margin-top: 10px; }
.upd .upd-go { background: #1f9d55; color: #fff; }
.upd .btn:disabled { opacity: .5; cursor: default; }
.upd-ok { margin-top: 12px; background: #e8f6ee; border: 1px solid #9fd3b4; border-radius: 10px; padding: 10px; font-size: 13.5px; color: #14532d; }
.upd-warn { margin-top: 10px; background: #fff6e5; border: 1px solid #f3c77a; border-radius: 10px; padding: 9px 10px; font-size: 13px; color: #7a4b00; }
.upd-warn ul { margin: 4px 0 4px 18px; padding: 0; }
.upd-bar { height: 10px; background: #eef0f4; border-radius: 6px; overflow: hidden; margin: 8px 0; position: relative; }
.upd-bar i { position: absolute; top: 0; bottom: 0; width: 40%; background: #1f9d55; border-radius: 6px; animation: updbar 1.1s ease-in-out infinite; }
@keyframes updbar { from { left: -40%; } to { left: 100%; } }
/* 67: korábbi verzió kiválasztása */
.upd-old { margin-top: 14px; padding-top: 10px; border-top: 1px solid #eef0f4; }
.upd-old .upd-sel { display: block; width: 100%; margin-top: 6px; padding: 8px 10px; border: 1px solid #cfd6e4; border-radius: 10px; font-size: 14px; background: #fff; }
.upd-old .small { margin-top: 6px; }
/* ---------- 68: fejléc-gombok, járatválasztó szövegek, villogó GPS jel ---------- */
#sheetClose { background: #e2363d; color: #fff; font-weight: 800; font-size: 17px; box-shadow: 0 1px 4px rgba(0,0,0,.25); }
#sheetClose:hover { background: #c4242b; }
#sheetBack { background: #ffd400; color: #1d2433; font-weight: 900; font-size: 19px; box-shadow: 0 0 0 2px #e0b800 inset, 0 1px 4px rgba(0,0,0,.2); }
#sheetBack:hover { background: #ffe14a; }
.pick-menu .pm-hint { color: #000; font-weight: 600; }
.pick-menu .pm-dir, .pick-menu .pm-dir .pm-cont { color: #000; }
.pick-menu .pm-dir .pm-cont { font-size: inherit; }
.pick-menu .pm-dir.on .pm-cont { color: #000; }
@keyframes gpsblink { 0%, 100% { opacity: 1; } 50% { opacity: .25; } }
#bottomnav #netToggle .nt-gps.gps-on svg { animation: gpsblink 1.2s ease-in-out infinite; }
/* 68: irány – ahonnan jön halvány, ahova tart fekete kiemelve (azonos betűméret) */
.pick-menu .pm-dir .pm-via, .pick-menu .pm-dir .pm-cont { color: #7a8396; font-weight: 500; font-size: inherit; }
.pick-menu .pm-dir .pm-to { color: #000; font-weight: 700; }
.pick-menu .pm-dir.on .pm-via, .pick-menu .pm-dir.on .pm-cont { color: #5b6578; }
/* ---------- 69: két soros irány (körjárat), irányváltás a menetválasztóban ---------- */
.pick-menu .pm-dir .pm-to2, .rp-dir .pm-to2 { display: block; padding-left: 1.15em; }
.it-runs .rp-dirs { display: flex; flex-direction: column; gap: 5px; margin: 6px 0 8px; font-size: 13px; }
.it-runs .rp-dir { text-align: left; border: 1px solid #cfd6e4; background: #fff; border-radius: 8px; padding: 6px 9px; font-size: 13.5px; color: #000; line-height: 1.3; cursor: pointer; }
.it-runs .rp-dir small { display: block; color: #6b7385; font-size: 11.5px; margin-top: 2px; padding-left: 1.15em; }
.it-runs .rp-dir.on { border: 2px solid #1f9d55; background: #e8f6ee; }
.it-runs .rp-dir .pm-via { color: #7a8396; }
.it-runs .rp-dir .pm-to { color: #000; font-weight: 700; }
.it-runs .rp-dir.busy { opacity: .5; }
/* ---------- 70: útvonalterv – mozgó nyilak a vonalakon, irány a fejlécben ---------- */
.it-bar { width: 10px; border-radius: 5px; background-color: var(--lc, #2f6fed);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='22' viewBox='0 0 10 22'%3E%3Cpath d='M2 6l3 3.2L8 6' fill='none' stroke='%23000' stroke-opacity='.55' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M2 6l3 3.2L8 6' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: repeat-y; background-size: 10px 22px; animation: itflow 1.6s linear infinite; }
@keyframes itflow { from { background-position: 0 0; } to { background-position: 0 22px; } }
@media (prefers-reduced-motion: reduce) { .it-bar { animation: none; } }
.it-runs .rp-head { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.it-runs .rp-dsel { flex: 1; min-width: 0; max-width: 100%; border: 2px solid #2f6fed; border-radius: 8px; padding: 5px 8px; font-size: 13.5px; font-weight: 700; color: #000; background: #fff; cursor: pointer; }
.it-runs .rp-dsel:disabled { opacity: .5; }
.it-runs .rp-dfix { font-weight: 700; color: #000; }

/* 72: Járat frissítés + Frissítés a profilkép alatt, alacsonyabb gombok */
.prof-adm { display: flex; gap: 8px; margin: 10px 0 2px; }
.prof-adm .btn { flex: 1; min-height: 0; height: 34px; padding: 0 10px; font-size: 14px; }

/* 73: Hely-üzenet = térképre ragasztott cetli, kicsit gyűrött, kis szakadással; 4 választható kinézet (a, d, e, f) */
.bubble.note:not(.compact) { --bc: var(--nk); --bf: var(--n1); bottom: 20px; border: 0; border-radius: 2px 2px 3px 16px / 2px 2px 3px 6px; color: #2b2b2b; padding: 16px 12px 20px;
  background-color: var(--n1); background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22260%22%20height%3D%22260%22%3E%3Cfilter%20id%3D%22f%22%20x%3D%220%22%20y%3D%220%22%20width%3D%22100%25%22%20height%3D%22100%25%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%22.009%22%20numOctaves%3D%224%22%20seed%3D%2211%22/%3E%3CfeDiffuseLighting%20lighting-color%3D%22%23fff%22%20surfaceScale%3D%223.4%22%3E%3CfeDistantLight%20azimuth%3D%22225%22%20elevation%3D%2255%22/%3E%3C/feDiffuseLighting%3E%3CfeComponentTransfer%3E%3CfeFuncR%20type%3D%22linear%22%20slope%3D%22.62%22%20intercept%3D%22.46%22/%3E%3CfeFuncG%20type%3D%22linear%22%20slope%3D%22.62%22%20intercept%3D%22.46%22/%3E%3CfeFuncB%20type%3D%22linear%22%20slope%3D%22.62%22%20intercept%3D%22.46%22/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect%20width%3D%22260%22%20height%3D%22260%22%20filter%3D%22url%28%23f%29%22/%3E%3C/svg%3E"), linear-gradient(118deg, transparent 37%, rgba(0,0,0,.06) 38.5%, rgba(255,255,255,.5) 39.5%, transparent 41.5%, transparent 62%, rgba(0,0,0,.07) 63.5%, rgba(255,255,255,.35) 64.5%, transparent 66%), linear-gradient(32deg, transparent 54%, rgba(0,0,0,.05) 55%, rgba(255,255,255,.4) 56%, transparent 57.5%), linear-gradient(170deg, var(--n1), var(--n2));
  background-size: 260px 260px, 100% 100%, 100% 100%, 100% 100%; background-blend-mode: multiply, normal, normal, normal;
  box-shadow: 0 1px 1px rgba(0,0,0,.12), 3px 6px 10px -3px rgba(0,0,0,.35);
  transform: translate(calc(-28% + var(--ox, 0px)), var(--oy, 0px)); }   /* a szöveg éles marad: nincs elforgatás, a gyűrődés csak háttér */
.bubble.note:not(.compact)::after { display: none; }
.bubble.note:not(.compact)::before, .bubble.note .pi-t2 { content: ""; position: absolute; top: -9px; width: 62px; height: 20px; margin: 0; border: 0; background: rgba(255,255,255,.55); box-shadow: 0 1px 2px rgba(0,0,0,.15);
  border-left: 1px dashed rgba(0,0,0,.08); border-right: 1px dashed rgba(0,0,0,.08); pointer-events: none; }
.bubble.note.moved:not(.compact)::before { display: block; }
.bubble.note:not(.compact)::before { left: 50%; margin-left: -31px; transform: rotate(3deg); }
.bubble.note .pi-t2 { display: none; }
.bubble.note .pi-tear { position: absolute; right: 26%; bottom: 0; width: 20px; height: 17px; background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2220%22%20height%3D%2217%22%20viewBox%3D%220%200%2020%2017%22%3E%3Cpath%20d%3D%22M5%2017%20L7.5%2012.5%20L5.5%209%20L8.5%205%20L7.5%201.5%20L9.5%200%20L11%203.5%20L10%206.5%20L12.5%2010%20L11%2013.5%20L14.5%2017%20Z%22%20fill%3D%22rgba%2840%2C30%2C0%2C.30%29%22/%3E%3Cpath%20d%3D%22M5%2017%20L7.5%2012.5%20L5.5%209%20L8.5%205%20L7.5%201.5%20L9.5%200%22%20fill%3D%22none%22%20stroke%3D%22rgba%2860%2C45%2C5%2C.6%29%22%20stroke-width%3D%22.9%22/%3E%3Cpath%20d%3D%22M14.5%2017%20L11%2013.5%20L12.5%2010%20L10%206.5%20L11%203.5%20L9.5%200%22%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-width%3D%221.4%22/%3E%3C/svg%3E") no-repeat; pointer-events: none; }
.bubble.note:not(.compact) .bub-dot { top: calc(100% + 20px); background: var(--nk); }
.bubble.note:not(.compact) .pb-place { color: var(--nt); }
.bubble.note:not(.compact) .pb-date, .bubble.note:not(.compact) .pb-time { color: #5f5a4a; }
.bubble.note:not(.compact) .bt { font-size: 14px; font-weight: 600; }
.bubble.note:not(.compact) .pb-reply { background: var(--nk); }
.bubble.note.mine:not(.compact) { outline: 0; }
.bubble.note:not(.compact):hover { box-shadow: 0 1px 1px rgba(0,0,0,.12), 5px 10px 16px -4px rgba(0,0,0,.4); }
.bubble.note.compact { background: var(--n1); border-color: var(--nk); border-radius: 3px; }
.bubble.note.compact::after { border-top-color: var(--nk); }
/* A) sárga, szalag felül */
.bubble.note-a { --n1: #fff6a6; --n2: #ffe95e; --nk: #d4ab00; --nt: #5a4700; }
/* D) vonalas jegyzetlap, két sarokszalag */
.bubble.note-d { --n1: #fffdf3; --n2: #f7f2e2; --nk: #3d6fb6; --nt: #1f3f6e; }
.bubble.note-d:not(.compact) { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22260%22%20height%3D%22260%22%3E%3Cfilter%20id%3D%22f%22%20x%3D%220%22%20y%3D%220%22%20width%3D%22100%25%22%20height%3D%22100%25%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%22.009%22%20numOctaves%3D%224%22%20seed%3D%2211%22/%3E%3CfeDiffuseLighting%20lighting-color%3D%22%23fff%22%20surfaceScale%3D%223.4%22%3E%3CfeDistantLight%20azimuth%3D%22225%22%20elevation%3D%2255%22/%3E%3C/feDiffuseLighting%3E%3CfeComponentTransfer%3E%3CfeFuncR%20type%3D%22linear%22%20slope%3D%22.62%22%20intercept%3D%22.46%22/%3E%3CfeFuncG%20type%3D%22linear%22%20slope%3D%22.62%22%20intercept%3D%22.46%22/%3E%3CfeFuncB%20type%3D%22linear%22%20slope%3D%22.62%22%20intercept%3D%22.46%22/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect%20width%3D%22260%22%20height%3D%22260%22%20filter%3D%22url%28%23f%29%22/%3E%3C/svg%3E"), repeating-linear-gradient(transparent 0 21px, #cfe0f4 21px 22px), linear-gradient(90deg, transparent 9px, #e57373 9px 10.5px, transparent 10.5px), linear-gradient(170deg, var(--n1), var(--n2));
  background-size: 260px 260px, 100% 100%, 100% 100%, 100% 100%; background-blend-mode: multiply, normal, normal, normal; border-radius: 2px; }
.bubble.note-d:not(.compact)::before { left: -12px; top: -6px; margin: 0; width: 46px; transform: rotate(-35deg); }
.bubble.note-d .pi-t2 { display: block; right: -12px; top: -6px; width: 46px; transform: rotate(35deg); }
/* E) pasztell rózsaszín, két szalag */
.bubble.note-e { --n1: #ffdbe9; --n2: #ffbfd6; --nk: #d9467d; --nt: #7a1f45; }
.bubble.note-e:not(.compact)::before { left: 12px; margin: 0; width: 44px; transform: rotate(-8deg); }
.bubble.note-e .pi-t2 { display: block; right: 12px; width: 44px; transform: rotate(8deg); }
/* F) világoskék, sarokszalag */
.bubble.note-f { --n1: #dcf2ff; --n2: #b9e3fb; --nk: #2a8ac8; --nt: #14496e; }
.bubble.note-f:not(.compact)::before { left: auto; right: -14px; top: -4px; margin: 0; width: 52px; transform: rotate(40deg); }
/* cetli-választó a Hely-üzenet írásakor */
.note-pick { display: flex; gap: 8px; flex-wrap: wrap; margin: 2px 0 4px; }
.note-pick label { display: flex; flex-direction: column; align-items: center; gap: 3px; font-size: 12px; cursor: pointer; margin: 0; }
.note-pick input { position: absolute; opacity: 0; pointer-events: none; }
.note-pick .sw { width: 46px; height: 38px; border-radius: 2px 2px 2px 8px; box-shadow: 0 1px 3px rgba(0,0,0,.3); border: 2px solid transparent; position: relative; }
.note-pick .sw::before { content: ""; position: absolute; left: 50%; top: -5px; width: 22px; height: 9px; margin-left: -11px; background: rgba(255,255,255,.7); box-shadow: 0 1px 1px rgba(0,0,0,.15); }
.note-pick input:checked + .sw { border-color: #1f2a44; box-shadow: 0 0 0 2px #fff, 0 0 0 4px #1f2a44; }
.note-pick .sw.a { background: linear-gradient(170deg, #fff6a6, #ffe95e); }
.note-pick .sw.d { background: repeating-linear-gradient(transparent 0 7px, #cfe0f4 7px 8px), linear-gradient(90deg, transparent 5px, #e57373 5px 6px, transparent 6px), #fffdf3; }
.note-pick .sw.e { background: linear-gradient(170deg, #ffdbe9, #ffbfd6); }
.note-pick .sw.f { background: linear-gradient(170deg, #dcf2ff, #b9e3fb); }

/* 73: vonattípus választó (Stadler KISS / Stadler FLIRT) */
.vtt { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 6px 0 4px; }
.vtt button { border: 1.5px solid var(--line, #cfd6e2); background: #fff; color: var(--ink, #1d2433); border-radius: 999px; padding: 6px 12px; font: inherit; font-weight: 700; cursor: pointer; }
.vtt button small { font-weight: 500; color: var(--muted, #6b7385); }
.vtt button.on { background: #1f2a44; border-color: #1f2a44; color: #fff; }
.vtt button.on small { color: #d5dbe7; }

/* 74: kiemelt útvonalnév + törlés gomb a szerkesztőben */
#edForm > .rt-namebox { margin: 0; background: #eef4ff; border: 2px solid #2f6fed; border-radius: 14px; padding: 12px 12px 10px; display: flex; flex-direction: column; gap: 10px; }
.rt-namebox .rt-name { margin: 0; font-size: 15px; font-weight: 800; color: #1f2a44; }
.rt-namebox .rt-name input { font-size: 19px !important; font-weight: 700; color: #1f2a44; border: 2px solid #2f6fed !important; background: #fff; margin-top: 6px; }
.rt-namebox .rt-name input::placeholder { font-weight: 500; color: #8a93a6; }
.rt-namebox .rt-delbtn { align-self: flex-start; background: #fff; color: #d0312d; border: 1.5px solid #d0312d; font-weight: 700; }
.rt-namebox .rt-delbtn:hover { background: #d0312d; color: #fff; }

/* 74: rendszám – új / régi változat választó */
.pl-pick { display: flex; gap: 8px; flex-wrap: wrap; margin: 2px 0 8px; }
.pl-pick button { display: inline-flex; align-items: center; gap: 7px; border: 1.5px solid #cfd6e2; background: #fff; border-radius: 10px; padding: 5px 9px; font: inherit; font-size: 13px; color: #1f2a44; cursor: pointer; }
.pl-pick button.on { border-color: #1f2a44; box-shadow: 0 0 0 1.5px #1f2a44 inset; }
.pl-pick .mini-pl { border: 1.5px solid #111; border-left: 7px solid #003399; border-radius: 3px; padding: 0 5px; font-weight: 800; letter-spacing: .5px; background: #fff; font-size: 12px; line-height: 18px; }
.plate.regi { border-color: #222; }
/* 74: a vonat jelvénye ikonként (a régi kép helyett) */
.vb.vb-ic { vertical-align: -4px; }
/* 74: járművek (szakaszok) jobban különállóak */
.vlegs { gap: 18px; }
.vleg { border: 2px solid #b8dcc4; border-radius: 14px; box-shadow: 0 2px 8px rgba(31,42,68,.10); padding: 0 12px 12px; overflow: hidden; }
.vleg > .vleg-h { margin: 0 -12px 4px; padding: 9px 12px; background: #eaf6ee; border-bottom: 2px solid #b8dcc4; }
.vleg > .vleg-h > .vleg-no { display: inline-flex; align-items: center; justify-content: center; min-width: 26px; height: 26px; border-radius: 50%; background: #16a34a; color: #fff; font-weight: 800; }

/* 74: üzemeltetői ikonok (MÁV kék, Volánbusz sárga, GYSEV zöld) */
.vb.vb-op { background: none !important; padding: 0; border-radius: 22%; overflow: hidden; }
.vb.vb-op svg { width: 100% !important; height: 100% !important; display: block; }
.it-ic .vb.vb-op { width: 24px; height: 24px; }
/* 74: rendszám – a kapott minta szerinti kinézet és betűtípus */
@font-face { font-family: 'UtitarsRendszam'; src: url('fonts/rendszam.woff2?v=74') format('woff2'); font-display: swap; }
.plate { width: 272px; height: 62px; border: 2px solid #b9bdc4; border-radius: 9px; background: #fff; padding: 3px;
  box-shadow: inset 0 0 0 1.5px #fff, inset 0 0 0 3px #1b1b1b, 0 1px 3px rgba(0,0,0,.18); }
.plate .pl-eu { width: 27px; border-radius: 5px 0 0 5px; }
#edForm .plate input { font: 400 50px/1 'UtitarsRendszam', "Arial Narrow", Arial, sans-serif; letter-spacing: 0; word-spacing: 0; padding: 4px 6px 0 9px; font-stretch: normal; }
#edForm .plate input::placeholder { color: #c3c8d1; }
.plate .pl-cimer { width: 15px; height: 27px; }
.plate .pl-cimer img { display: block; width: 100%; height: 100%; object-fit: contain; }
.pl-pick .mini-pl { font-family: 'UtitarsRendszam', Arial, sans-serif; font-weight: 400; font-size: 15px; letter-spacing: 0; }
.pm-fq { margin-left: 6px; font-size: 12.5px; font-weight: 700; color: #16a34a; white-space: nowrap; }   /* 74 */

/* 75: BKK megállótábla a térképen (busz / troli / villamos) és metró-jel */
.stop-sign-ic, .metro-ic { background: none; border: 0; }
.stop-sign { height: 100%; display: flex; flex-direction: column; align-items: center; cursor: pointer; filter: drop-shadow(0 1px 1.5px rgba(0,0,0,.45)); }
.stop-sign .ss-board { display: flex; gap: 2px; padding: 2px; background: #fff; border: 1px solid #1f2a44; border-radius: 3px; }
.stop-sign .ss-board i { display: block; border-radius: 2px; }
.stop-sign .ss-board svg { display: block; width: 100%; height: 100%; }
.stop-sign .ss-pole { width: 2.5px; flex: 1; min-height: 6px; background: linear-gradient(90deg, #6b7280, #9ca3af); border-radius: 0 0 1px 1px; }
.metro-ic svg { display: block; filter: drop-shadow(0 1px 1.5px rgba(0,0,0,.4)); cursor: pointer; }

/* 78: menetrend fájlok tallózással (admin) */
.gt-box { margin-top: 10px; border-top: 1px solid var(--line, #e3e7ef); padding-top: 10px; display: flex; flex-direction: column; gap: 8px; }
.gt-src { border: 1.5px dashed #b7c3d6; border-radius: 12px; padding: 10px; background: #f7f9fc; }
.gt-src.gt-volan { border-color: #f7b919; background: #fffaf0; }
.gt-h { display: flex; align-items: center; gap: 10px; }
.gt-logo { height: 26px; width: auto; display: block; }
.gt-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 8px; }
.gt-fn { flex: 1; min-width: 0; font-size: 12.5px; color: #334; background: #fff; border: 1px solid #dde3ec; border-radius: 8px; padding: 6px 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gt-pick { cursor: pointer; }
.gt-st { margin-top: 6px; color: #6b7385; } .gt-st.ok { color: #16a34a; }
/* 78: üzenetek – kimenő narancs, bejövő zöld, elutasított piros; ceruzás menü */
.cdir.out { color: #e8730c; background: #fff1e0; }
.cdir.in { color: #16a34a; background: #e6f6ec; }
.cdir.in.new { color: #fff; background: #16a34a; }
.cdir.rej { color: #d0312d; background: #fde8e8; }
.list > .card[data-id] { position: relative; }
.conv-pen { position: absolute; right: 10px; top: 10px; width: 30px; height: 30px; border-radius: 50%; border: 0; background: #1f2a44; color: #fff; font-size: 14px; cursor: pointer; }
.conv-menu { display: flex; flex-direction: column; align-self: flex-end; margin: -4px 0 4px auto; background: #fff; border: 1px solid #dde3ec; border-radius: 12px; box-shadow: 0 6px 20px rgba(0,0,0,.18); padding: 6px; min-width: 190px; }
.conv-menu button { border: 0; background: none; text-align: left; padding: 9px 10px; border-radius: 8px; font: inherit; font-weight: 600; cursor: pointer; color: #1f2a44; }
.conv-menu button:hover { background: #f3f5f9; } .conv-menu button.red { color: #d0312d; }
.chat .msg.me { cursor: pointer; }
/* 78: saját bejegyzés üzenete narancs keretben, helyben szerkeszthető */
.say.mine-say { position: relative; border: 2.5px solid #f08a1c; background: #fff6ec; cursor: pointer; padding-right: 34px; }
.say.mine-say .ms-pen { position: absolute; right: 9px; top: 8px; font-size: 14px; }
.say.mine-say small { display: block; margin-top: 4px; color: #b8640f; font-size: 12px; }
.say.mine-say.editing { background: #fff; cursor: default; padding-right: 12px; }
.say.mine-say textarea { width: 100%; box-sizing: border-box; border: 1px solid #f08a1c; border-radius: 8px; font: inherit; padding: 6px 8px; }
.say.mine-say .ms-save { background: #f08a1c; color: #fff; border-color: #f08a1c; }
/* 78: egér a térképen – mozgatásnál normál nyíl, nyomva tartott húzásnál kéz */
.leaflet-grab { cursor: default; }
.leaflet-dragging .leaflet-grab, .leaflet-dragging .leaflet-grab .leaflet-interactive, .leaflet-dragging .leaflet-marker-draggable { cursor: grab; }
/* 78: a saját pont megfogója (a buborék farka alatt) – mozgatás jel, húzható */
.bubble-icon .pt-drag { position: absolute; left: -11px; top: -11px; width: 22px; height: 22px; border-radius: 50%; cursor: move; z-index: 7; touch-action: none; }
.bubble-icon .pt-drag:hover { box-shadow: 0 0 0 3px rgba(232,72,95,.35); }
body.pt-moving, body.pt-moving * { cursor: move !important; }

/* 79: oldalba illő beviteli / megerősítő ablak – a képernyő közepén */
.ask-card p { white-space: pre-line; }
.ask-card .ask-in { width: 100%; box-sizing: border-box; margin: 0 0 12px; border: 1.5px solid #cfd6e2; border-radius: 10px; padding: 9px 11px; font: inherit; font-size: 15px; color: var(--ink); background: #fff; text-align: left; }
.ask-card .ask-in:focus { outline: none; border-color: var(--primary); }
.ask-card textarea.ask-in { resize: vertical; min-height: 70px; }

/* 81: Vasúti késések – egyetlen kapcsoló + élő késés az időknél */
.rail-src .rs-dl { font-size: 14px; }
.rail-src .rs-dl input { width: 20px; height: 20px; margin-top: 1px; accent-color: #1f9d55; }
.rail-src .rs-dl .muted { font-size: 12.5px; }
.dl-okt { color: #16a34a; }
.dl-old { text-decoration: line-through; color: #8a93a6; font-weight: 500; margin-right: 4px; }
.dl-new { color: #d0312d; font-weight: 800; }
.dl-ok { color: #16a34a; font-weight: 800; }
.dl-tag { font-style: normal; font-size: 11px; font-weight: 800; border-radius: 6px; padding: 1px 5px; margin-left: 4px; white-space: nowrap; }
.dl-tag.l { background: #fde8e8; color: #d0312d; }
.dl-tag.o { background: #e6f6ec; color: #16a34a; }
.dl-nd { font-style: normal; font-size: 10.5px; color: #8a93a6; font-weight: 500; margin-left: 4px; white-space: nowrap; }
.pm-dep .dl-t { white-space: nowrap; }
.it-dl:empty { display: none; }
.it-dlx[hidden], .it-endx[hidden] { display: none; }
.bub-dl:empty { display: none; }
.bubble .bh .bub-dl .dl-tag { margin-left: 2px; }
.pm-dep.on .dl-old { color: #c9d2e3; }
.it-line:has(.it-dl:not(:empty)) .it-dir { flex: 0 1 auto; }
.it-line .it-dl:not(:empty) { margin-right: auto; }
.it-line .it-dl .dl-tag { margin-left: 0; }

/* 83: Útvonaltervem – saját naptár: egy nap / több nap (másolás), páros / páratlan hét */
.itin-h button.it-date { font: inherit; font-size: 13px; color: inherit; line-height: 1.4; }
.it-days { display: flex; flex-wrap: wrap; gap: 4px; margin: 6px 0 2px; }
.it-days span { background: #e6f6ec; color: #147a40; border-radius: 8px; padding: 2px 7px; font-size: 12px; font-weight: 700; }
.ask-card.dc-card { max-width: 400px; width: calc(100vw - 24px); padding: 12px; text-align: left; }
.dc-tabs { display: flex; background: #f1f3f8; border-radius: 10px; padding: 3px; margin-bottom: 6px; }
.dc-tabs button { flex: 1; border: 0; background: transparent; padding: 7px 4px; border-radius: 8px; font: inherit; font-weight: 700; font-size: 13.5px; color: #55607a; cursor: pointer; }
.dc-tabs button.on { background: #fff; color: var(--navy); box-shadow: 0 1px 3px rgba(0,0,0,.12); }
.dc-nav { display: flex; justify-content: space-between; align-items: center; margin: 4px 0; font-size: 15.5px; }
.dc-nav button { border: 0; background: #f1f3f8; border-radius: 8px; width: 34px; height: 30px; font-size: 18px; cursor: pointer; color: var(--navy); }
table.dc-grid { width: 100%; border-collapse: separate; border-spacing: 3px; text-align: center; }
.dc-grid th { font-size: 11.5px; color: #7a8396; font-weight: 700; }
.dc-grid td { padding: 0; }
.dc-grid td.dc-wk { font-size: 11px; line-height: 1.05; width: 42px; color: #55607a; background: #f4f6fa; border-radius: 9px; }
.dc-grid td.dc-wk small { display: block; font-size: 9.5px; }
.dc-grid td.dc-wk.ev { background: #e8f0ff; color: #2f5fd0; }
.dc-grid button { width: 100%; height: 34px; border: 0; border-radius: 9px; background: transparent; font: inherit; font-weight: 600; font-size: 14px; color: var(--navy); cursor: pointer; }
.dc-grid button:hover:not(:disabled) { background: #eef3ff; }
.dc-grid button.we { color: #c0392b; }
.dc-grid button.out { color: #b5bccb; }
.dc-grid button.past { color: #c8cdd8; cursor: default; }
.dc-grid button.today { box-shadow: inset 0 0 0 2px #2f6fed; }
.dc-grid button.sel, .dc-grid button.plan { background: #1f9d55; color: #fff; }
.dc-grid button.plan { box-shadow: inset 0 0 0 3px #0d5f31; }
.dc-leg { font-size: 11.5px; color: #55607a; margin: 2px 0 4px; }
.dc-leg b { color: #2f5fd0; }
.dc-multi[hidden] { display: none; }
.dc-chips { display: flex; flex-wrap: wrap; gap: 5px; margin: 6px 0; }
.dc-chips button { border: 1.5px solid #cfd6e2; background: #fff; border-radius: 16px; padding: 3px 9px; font: inherit; font-size: 12.5px; font-weight: 700; cursor: pointer; color: var(--navy); }
.dc-chips button.on { background: #e6f6ec; border-color: #1f9d55; color: #147a40; }
.dc-until { display: flex; align-items: center; gap: 8px; font-size: 13px; margin: 4px 0; }
.dc-until input { border: 1px solid #cfd6e2; border-radius: 8px; padding: 4px 6px; font: inherit; font-size: 13px; }
.dc-sum { font-size: 13px; background: #f6f8fb; border-radius: 10px; padding: 7px 9px; margin: 6px 0; }
.dc-btns { display: flex; gap: 6px; margin-top: 8px; flex-wrap: wrap; }
.dc-btns .btn { flex: 1; }
.dc-btns .btn.primary { flex: 2 1 100%; order: -1; }
.dc-btns [hidden] { display: none; }
.ask-card.dc-card { max-height: calc(100vh - 24px); overflow: auto; }
.dc-btns .btn.primary { background: #1f9d55; border-color: #1f9d55; color: #fff; }
.dc-sum { min-height: 3.9em; box-sizing: border-box; }   /* 84: az összegzés hossza se változtassa az ablak méretét */

/* 84: járatkövetés */
.it-trkb { border: 1.5px solid #cfd6e2; background: #fff; border-radius: 9px; padding: 3px 8px; font: inherit; font-size: 12.5px; font-weight: 700; cursor: pointer; color: var(--navy); white-space: nowrap; }
.it-trkb.on { background: #e8f0ff; border-color: #2f5fd0; color: #2f5fd0; }
.it-body > .it-trkb { margin-top: 5px; }
.it-trk[hidden] { display: none; }
.it-trk { margin-top: 6px; border: 1px solid #e3e7ef; border-radius: 12px; padding: 8px 10px; background: #fbfcff; }
.trk-h { font-weight: 800; font-size: 14px; margin-bottom: 4px; }
.trk-list { position: relative; }
.trk-list:before { content: ''; position: absolute; left: 53px; top: 9px; bottom: 9px; width: 4px; background: #c9d0e6; border-radius: 2px; }
.trk-st, .trk-veh { display: grid; grid-template-columns: 44px 22px 1fr; align-items: center; min-height: 26px; font-size: 13px; }
.trk-st .t { font-weight: 700; color: #55607a; }
.trk-st i { justify-self: center; width: 11px; height: 11px; border-radius: 50%; border: 2.5px solid #3e4a9e; background: #fff; position: relative; z-index: 1; }
.trk-st.past { color: #9aa3b5; } .trk-st.past i { background: #3e4a9e; }
.trk-st.me { font-weight: 800; color: #147a40; } .trk-st.me i { border-color: #1f9d55; background: #1f9d55; box-shadow: 0 0 0 4px #1f9d5533; }
.trk-veh { color: #2f5fd0; font-weight: 800; font-size: 12.5px; }
.trk-veh i { justify-self: center; font-style: normal; font-size: 17px; position: relative; z-index: 2; background: #fbfcff; border-radius: 50%; line-height: 1; }
.trk-src { font-weight: 800; border-radius: 6px; padding: 1px 6px; }
.trk-src.s { background: #e8f0ff; color: #2f5fd0; } .trk-src.g { background: #e6f6ec; color: #16a34a; }
.trk-f { margin-top: 4px; }
.trk-ic span { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--c, #2f5fd0); border: 3px solid #fff; box-shadow: 0 3px 10px rgba(0,0,0,.3); font-size: 17px; box-sizing: border-box; }
.trk-tip { font-weight: 800; font-size: 12px; border-radius: 10px; border: 2px solid #2f5fd0; }

/* 85: követés a térképi felugró ablakban */
.wp-trk[hidden] { display: none; }
.wp-trk { margin: 6px 0 4px; padding: 7px 9px; border: 1px solid #d6e0f5; border-radius: 10px; background: #f6f9ff; font-size: 13px; }
.wp-trk1 + .wp-trk1 { margin-top: 6px; border-top: 1px dashed #d6e0f5; padding-top: 6px; }
.wp-trk1 .trk-src { display: inline-block; margin: 3px 0; font-size: 11.5px; }
.wp-trk .wp-trkb { margin-top: 4px; }
.wp-trk .wp-trkb.on { border-color: #2f5fd0; color: #2f5fd0; background: #e8f0ff; }
/* 87 */
.wp-trkl { margin-bottom: 2px; }
.wp-trkbs { display: flex; gap: 6px; flex-wrap: wrap; }
/* 88: lekésett menet */
.it-miss { margin: 6px 0 4px; padding: 7px 10px; border-radius: 10px; background: #fff4e5; border: 1px solid #f5c27a; font-size: 13px; color: #6b4300; }
.it-miss .it-miss-undo { display: inline-block; margin-top: 4px; border: 1.5px solid #e0a64a; background: #fff; border-radius: 8px; padding: 2px 8px; font: inherit; font-size: 12.5px; font-weight: 700; cursor: pointer; color: #6b4300; }
/* 88: megállóra koppintva – az érkező járatok */
.stop-arr { margin: 6px 0 8px; font-size: 13px; max-width: 280px; }
.stop-arr .sa-h { font-weight: 800; margin-bottom: 3px; }
.stop-arr .sa-r { display: flex; gap: 6px; align-items: center; padding: 3px 0; border-top: 1px solid #eef1f5; cursor: pointer; }
.stop-arr .sa-r:hover { background: #f4f7fd; }
.stop-arr .sa-t { margin-left: auto; font-weight: 800; white-space: nowrap; }
.stop-arr .sa-w { color: #55607a; font-size: 12px; }

/* 89: Kedvenc járatok */
.prof-fav { margin: 8px 0 2px; }
.prof-fav .fav-btn { width: 100%; height: 36px; min-height: 0; font-size: 14px; background: #fff8e1; border: 1.5px solid #f4c430; color: #6b4e00; font-weight: 800; }
.fav-btn .fav-n { background: #f4b20e; color: #fff; border-radius: 10px; padding: 0 7px; margin-left: 4px; font-size: 12px; }
.fav-wrap .fav-q { width: 100%; box-sizing: border-box; padding: 9px 12px; border: 1.5px solid #cfd6e2; border-radius: 12px; font: inherit; font-size: 15px; margin: 4px 0 8px; }
.fav-row { display: flex; align-items: center; gap: 8px; padding: 7px 4px; border-bottom: 1px solid #eef1f5; font-size: 14px; }
.fav-row .fav-to { flex: 1; min-width: 0; color: var(--navy); font-weight: 600; }
.fav-star { border: 0; background: transparent; font-size: 24px; line-height: 1; cursor: pointer; color: #b8c0cf; padding: 0 4px; }
.fav-star.on { color: #f4b20e; }
.fav-on { display: inline-flex; align-items: center; gap: 2px; font-size: 13px; cursor: pointer; }
.fav-ic span { position: relative; }
.fav-ic span b { position: absolute; left: 50%; top: 100%; transform: translate(-50%, 1px); background: var(--c, #2f5fd0); color: #fff; font-size: 10px; font-weight: 800; border-radius: 6px; padding: 0 4px; white-space: nowrap; border: 1.5px solid #fff; line-height: 14px; }

/* 92: busz / troli / villamos kerek ikonok */
.vb.vb-pic { background: none !important; padding: 0; border-radius: 50%; overflow: visible; }
.veh-pic { display: inline-block; width: 1.35em; height: 1.35em; vertical-align: -0.32em; object-fit: contain; border-radius: 50%; }   /* 94: szövegben sorközi méret */
.vb.vb-pic img, .trk-ic span.pic > img { display: block; width: 100%; height: 100%; object-fit: contain; border-radius: 50%; vertical-align: 0; }
.trk-veh i .veh-pic { width: 20px; height: 20px; }
.trk-ic span.pic { background: #fff; padding: 0; }
.trk-ic span.pic > img { width: 100%; height: 100%; }
.stop-sign .ss-board i.ss-pic { border-radius: 50%; }
.rail-src.bkk-top { border-top: 0; margin: 8px 0 10px; padding: 10px; border: 1px solid #c9d6ea; border-radius: 12px; background: #f5f9ff; }
.vb.vb-pic, .vb.vb-pic.vb-ic { vertical-align: middle; position: relative; top: -1px; }

/* 94: menetirány-háromszög a jármű ikonján */
.trk-ic span { position: relative; }
.trk-ic .trk-dir { position: absolute; left: -14px; top: -14px; right: -14px; bottom: -14px; pointer-events: none; z-index: -1; font-style: normal; }
.trk-ic .trk-dir::before { content: ''; position: absolute; left: 50%; top: -1px; transform: translateX(-50%); border-left: 9px solid transparent; border-right: 9px solid transparent; border-bottom: 16px solid var(--c, #2f5fd0); filter: drop-shadow(0 0 1.2px #fff) drop-shadow(0 0 1.2px #fff) drop-shadow(0 1px 2px rgba(0,0,0,.35)); }

/* 98: járműinformáció-kártya */
.vc-pop .leaflet-popup-content-wrapper { border-radius: 16px; box-shadow: 0 8px 28px rgba(15,23,42,.2); }
.vc-pop .leaflet-popup-content { margin: 12px 14px 8px; min-width: 250px; }
.vc { font-size: 14px; color: #1d2433; }
.vc-h { display: flex; align-items: center; gap: 7px; font-size: 15.5px; }
.vc-h .veh-pic { width: 26px; height: 26px; vertical-align: 0; flex: none; }
.vc-h .vc-l { font-size: 14px; padding: 0 7px; line-height: 22px; border-radius: 6px; font-weight: 800; flex: none; }
.vc-h b { font-weight: 800; line-height: 1.2; }
.vc-to { margin: 3px 0 6px 2px; font-weight: 700; color: #475569; font-size: 13px; }
.vc-r { display: flex; align-items: center; gap: 9px; padding: 4px 0; border-top: 1px solid #eef2f7; }
.vc-r i { font-style: normal; width: 20px; text-align: center; flex: none; }
.vc-r small { color: #64748b; }
.vc-late { color: #c2410c; font-weight: 800; } .vc-ok { color: #15803d; font-weight: 800; }
.vc-f { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 5px; font-size: 12px; color: #64748b; }
.vc-src { background: #e8f6ee; color: #15803d; border-radius: 999px; padding: 2px 8px; font-weight: 700; }
.vc-src.g { background: #f1f5f9; color: #64748b; }
.vc-h .vb.vc-op { width: 26px; height: 26px; flex: none; }
/* 100: másik vonat ajánlása a szakaszra */
.rp-alt { color: var(--navy); line-height: 1.45; }
.rp-altl { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.rp-altb { border: 1px solid #cfd6e4; background: #fff; border-radius: 8px; padding: 5px 8px; font-weight: 700; font-size: 13px; color: var(--navy); }
.it-runs .rp-here { margin: 2px 0 6px; }