/* Voya app — neutrals local; --accent/--accent-soft/--gradient from /brand.css, --font-sans from /campmoney-ui.css. */
		:root { --bg:#fdf8f4; --card:#ffffff; --line:#f1e8e0; --txt:#1c1714;
			--muted:#6b6157;
			--ok:#16a34a; --err:#dc2626; --sidebar-w:224px;
			/* Egységes fejléc-tónus + áttetsző narancs „üveg" (mobil: cégváltó / avatar-menü / alsó sáv). */
			--head-tint:#fdf1ea;
			--glass:linear-gradient(135deg,rgba(240,97,46,.14),rgba(245,166,35,.10));
			--glass-strong:linear-gradient(135deg,rgba(240,97,46,.22),rgba(245,166,35,.14));
			--glass-bd:rgba(240,97,46,.24); }
		* { box-sizing:border-box; }
		body { margin:0; font-family:var(--font-sans,"Inter","Helvetica Neue",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif);
			background:var(--bg); color:var(--txt);
			min-height:100vh; display:flex; flex-direction:column; }

		/* ---- app shell: top band + (sidebar + content) + mobile bottom nav ---- */
		#appWrap { display:flex; flex-direction:column; min-height:100vh; }
		/* ===== Fix, sötét felső sáv — fiók-/globális hatókör (a családi .cm-sidebar/.cm-drawer
		   mechanikát NEM érinti). A bal menü így tiszta navigáció. ===== */
		.q-topband { display:flex; align-items:center; gap:14px; height:54px; padding:0 16px;
			background:#221a15; color:#f6ede6; position:sticky; top:0; z-index:40; }
		.q-topband .cm-hamburger { color:#f6ede6; border-color:#463829; background:transparent; }
		.q-brand { display:flex; align-items:center; gap:9px; }
		.q-brand .q-logo { width:28px; height:28px; border-radius:8px; background:var(--accent);
			display:grid; place-items:center; flex:none; }
		.q-brand .q-logo svg { width:18px; height:18px; fill:none; stroke:#fff; stroke-width:3;
			stroke-linecap:round; stroke-linejoin:round; display:block; }
		.q-brand .q-wordmark { font-weight:700; font-size:16px; letter-spacing:-.01em; color:#fff; }
		.q-search { flex:1 1 auto; min-width:0; }   /* Fázis 2 tölti fel; addig térkitöltő a sávban */
		.q-band-right { margin-left:auto; display:flex; align-items:center; gap:10px; min-width:0; }
		/* #who a sávban: világos szöveg. A fehér legördülő (.acct-menu) érintetlen marad. */
		.q-topband #who { color:#cbb8a8; margin-left:0; }
		.q-topband #who .company { color:#fff; }
		.q-topband #who .company .ico { stroke:#fff; }
		/* Az app-váltó lenyíló a jobb klaszter (avatar) széléhez simuljon (Google-szerű),
		   ne a kis pontrács-gombhoz → #who a pozicionáló, a .cm-appsw statikus. */
		.q-topband #who { position:relative; }
		.q-topband #who .cm-appsw { position:static; }
		/* Törzs: sidebar + tartalom a sáv alatt egymás mellett */
		.q-body { display:flex; flex:1; min-height:0; }
		/* Desktopon a sidebar a SÁV ALÁ tapad. Min-width blokk, hogy a <=880px drawer-mechanikát ne írja felül. */
		@media (min-width:881px) { .q-body .cm-sidebar { top:54px; height:calc(100vh - 54px); } }
		/* A nav kitölti a sidebart → a Fiók-csoport margin-top:auto-val alulra kerül. */
		#sidebar > nav { flex:1 1 auto; }
		.q-navfoot { margin-top:auto; }
		.q-navsec { font-size:10px; letter-spacing:.13em; text-transform:uppercase; color:var(--muted);
			font-weight:700; padding:14px 10px 5px; }
		/* Mobil alsó navigációs sáv — desktopon rejtve (a @media <=640px kapcsolja be). */
		.q-bottomnav { display:none; }
		.cm-sheet-grab { display:none; }   /* csak a mobil Menü-lap tetején (grab-fogantyú) */
		/* Mozgó kijelölés-„pill": a .bn.active háttere helyett külön csúszó elem (animált + húzható).
		   Pozíció CSS-változókból (--bn-i = aktív index, --bn-n = látható elemek száma). */
		.q-bottomnav .bn-pill { position:absolute; top:5px; bottom:5px; border-radius:14px;
			left:calc(6px + var(--bn-i,0) * (100% - 12px) / var(--bn-n,4));
			width:calc((100% - 12px) / var(--bn-n,4));
			background:var(--accent); z-index:0; opacity:0; pointer-events:none;
			transition:left .28s cubic-bezier(.4,0,.2,1), width .28s cubic-bezier(.4,0,.2,1), opacity .2s ease, top .2s ease, bottom .2s ease; }
		.q-bottomnav.compact .bn-pill { top:3px; bottom:3px; }
		.q-bottomnav .bn { position:relative; z-index:1; flex:1; display:flex; flex-direction:column; align-items:center; gap:3px;
			background:none; border:0; cursor:pointer; padding:6px 0 5px; border-radius:14px;
			color:var(--accent-dark); opacity:.62; font:600 9.5px/1.1 var(--font-sans,"Inter",sans-serif);
			transition:padding .24s ease, color .18s ease; touch-action:none; }
		.q-bottomnav .bn svg { width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; transition:width .24s ease, height .24s ease; }
		.q-bottomnav .bn.active { opacity:1; color:#fff; }
		.q-bottomnav .bn:active { transform:scale(.94); }
		/* Görgetéskor összecsukódó (Revolut-szerű) sáv: lefelé görgetve csak ikon + keskenyebb. */
		.q-bottomnav .bn span { max-height:14px; overflow:hidden; opacity:1; transition:max-height .24s ease, opacity .18s ease; }
		.q-bottomnav.compact { padding:3px 6px; }
		.q-bottomnav.compact .bn { padding:6px 0; }
		.q-bottomnav.compact .bn span { max-height:0; opacity:0; }
		.q-bottomnav.compact .bn svg { width:18px; height:18px; }
		/* Sidebar visuals come from the shared .cm-sidebar (campmoney-ui.css). */
		/* Outline line-icons in the landing "Mit tud a Voya?" style (orange stroke, rounded). */
		.ico { width:1.1em; height:1.1em; fill:none; stroke:currentColor; stroke-width:1.8;
			stroke-linecap:round; stroke-linejoin:round; vertical-align:-0.16em; flex-shrink:0; }
		.kpi .ico { stroke:var(--accent); }
		.main-col { flex:1; min-width:0; display:flex; flex-direction:column; }
		header { padding:12px 22px; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:30;
			background:var(--card); display:flex; align-items:center; gap:12px; }
		#who { font-size:13px; color:var(--muted); display:flex; align-items:center; gap:10px;
			flex-wrap:wrap; margin-left:auto; }
		#who .company { font-weight:600; color:var(--txt); font-size:14px; }
		main { padding:22px; max-width:1080px; width:100%; margin:0 auto; }

		.card { background:var(--card); border:1px solid var(--line); border-radius:14px;
			padding:18px; margin-bottom:18px; overflow-x:auto; box-shadow:0 1px 2px rgba(16,24,40,.04); }
		h2 { font-size:13px; margin:0 0 14px; color:var(--muted); text-transform:uppercase; letter-spacing:.5px; }
		label { display:block; font-size:12px; color:var(--muted); margin:8px 0 4px; }
		input, select, textarea { width:100%; padding:8px 10px; border-radius:9px; border:1px solid var(--line);
			background:#fff; color:var(--txt); font-size:14px; }
		/* Checkbox/radio SOHA ne feszüljön 100%-ra (a fenti szabály különben szélesre húzná, és a mellette
		   lévő szöveget jobbra lökné — pl. a Quilly-vevők behúzása listában). */
		input[type=checkbox], input[type=radio] { width:auto; padding:0; }
		input:focus, select:focus, textarea:focus { outline:none; border-color:var(--accent);
			box-shadow:0 0 0 3px var(--accent-soft); }
		.row { display:flex; gap:10px; flex-wrap:wrap; }
		.row > div { flex:1; min-width:130px; }
		/* .act / .mini / .modal / .mfoot — family components in /campmoney-ui.css */
		.toast { position:fixed; bottom:22px; left:50%; transform:translateX(-50%); background:#1e2233;
			color:#fff; padding:11px 18px; border-radius:10px; font-size:14px; z-index:60;
			box-shadow:0 8px 28px rgba(16,24,40,.28); max-width:90%; }
		.toast.err { background:#dc2626; }
		.kpis { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:14px; margin-bottom:18px; }
		.kpi { background:var(--card); border:1px solid var(--line); border-radius:14px; padding:16px 18px;
			cursor:pointer; box-shadow:0 1px 2px rgba(16,24,40,.04); }
		.kpi:hover { border-color:var(--accent); }
		.kpi .num { font-size:30px; font-weight:700; line-height:1.1; }
		.kpi .lbl { font-size:13px; color:var(--muted); margin-top:4px; }
		.kpi.alert .num { color:#dc2626; } .kpi.warn .num { color:#b45309; }
		.qa { display:flex; flex-wrap:wrap; gap:10px; }
		/* Bezárható dashboard info-kártya (pl. AI Asszisztens) + visszaállító fogaskerék */
		.card-x { position:absolute; top:8px; right:10px; background:none; border:none; color:var(--muted);
			font-size:15px; cursor:pointer; padding:2px 7px; border-radius:6px; line-height:1; z-index:1; }
		.card-x:hover { background:var(--line); color:var(--txt); }
		#dashGear { display:flex; justify-content:flex-end; margin:0 0 6px; }
		.dash-gear { background:none; border:1px solid var(--line); color:var(--muted); font-size:12.5px;
			cursor:pointer; padding:4px 10px; border-radius:999px; display:inline-flex; align-items:center; gap:5px; }
		.dash-gear:hover { background:var(--line); color:var(--txt); }
		.qa button { display:inline-flex; align-items:center; gap:7px; white-space:nowrap; }
		table { width:100%; border-collapse:collapse; font-size:13.5px; }
		th, td { text-align:left; padding:9px; border-bottom:1px solid var(--line); vertical-align:top; }
		th { color:var(--muted); font-weight:600; font-size:11px; text-transform:uppercase; }
		th.right, td.right { text-align:right; }
		.right { text-align:right; }
		tbody tr:hover { background:#fafbff; }
		.msg { font-size:13px; margin-top:8px; min-height:16px; }
		.msg.ok { color:var(--ok); } .msg.err { color:var(--err); }
		.hidden { display:none !important; }
		.badge { display:inline-block; padding:2px 9px; border-radius:999px; font-size:11px; font-weight:600;
			border:1px solid var(--line); background:#f3f4f6; }
		.b-PLANNED{color:#1d4ed8} .b-ASSIGNED{color:#4338ca} .b-IN_TRANSIT{color:#b45309}
		.b-DELIVERED{color:#047857} .b-INVOICED{color:#0e7490} .b-CLOSED{color:#6b7280}
		.b-CANCELLED{color:#dc2626} .b-PROBLEM{color:#e11d48} .b-DRAFT{color:#475569} .b-NEW{color:#1d4ed8}
		.b-ISSUED{color:#0e7490} .b-PAID{color:#047857}
		.pill { display:inline-block; padding:2px 9px; border-radius:999px; font-size:12px;
			background:#f3f4f6; border:1px solid var(--line); }
		.stops { background:#fafbff; border:1px solid var(--line); border-radius:8px; padding:10px; margin-top:8px; }
		.navbanner { border-radius:8px; padding:10px 12px; font-size:13px; margin:6px 0 4px; border:1px solid; }
		.navbanner.ok { background:#ecfdf5; border-color:#a7f3d0; color:#065f46; }
		.navbanner.warn { background:#fffbeb; border-color:#fde68a; color:#92400e; }
		.navfacts { margin:6px 0; }
		.navfacts > div { display:flex; gap:10px; padding:6px 0; border-bottom:1px solid var(--line); }
		.navfacts dt { width:180px; color:#6b7280; margin:0; }
		.navfacts dd { margin:0; font-weight:600; }
		/* Címke nélküli, teljes szélességű tétel (pl. Quilly-vevők behúzása lista) — nincs 180px üres bal oszlop. */
		.navfacts .vf-full { display:block; font-weight:400; }
		.relchip { display:inline-flex; align-items:center; gap:6px; background:#f1f5f9; border:1px solid #e2e8f0; border-radius:8px; padding:5px 10px; font-size:13px; }
		/* Egységes modál-lábléc: akció-gombok jobbra (akár 2 sorban), bezárás/mégse mindig alattuk, jobbra lent */
		.mfoot { display:flex; flex-direction:column; gap:8px; margin-top:16px; }
		.mfoot-acts { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-start; }
		.mfoot-close { display:flex; justify-content:flex-end; }
		.ac-wrap { position:relative; }
		.ac-list { position:absolute; left:0; right:0; top:100%; z-index:40; background:#fff; border:1px solid var(--line); border-radius:8px; box-shadow:0 8px 22px rgba(0,0,0,.10); max-height:240px; overflow-y:auto; margin-top:3px; }
		.ac-item { padding:8px 10px; cursor:pointer; font-size:14px; }
		.ac-item:hover { background:var(--accent-soft); }
		.ac-item .sub { color:#6b7280; font-size:12px; }
		.ac-item.ac-new { border-top:1px solid var(--line); color:var(--accent); font-weight:600; }
		.ac-empty { padding:8px 10px; color:#6b7280; font-size:13px; }
		tbody tr.inactive-row td { color:#9ca3af; }
		tbody tr.inactive-row td:first-child { text-decoration:line-through; }
		.badge.b-VOID { background:#fde68a; color:#92400e; }
		.naverr { color:#b91c1c; font-size:11px; margin-top:3px; max-width:280px; white-space:normal; line-height:1.3; }
		tbody tr.rowlink { cursor:pointer; }
		tbody tr.rowlink:hover { background:var(--accent-soft); }
		div.rowlink { cursor:pointer; }
		div.rowlink:hover { background:var(--accent-soft); border-radius:6px; }
		.block-title { color:var(--accent); font-weight:700; font-size:12.5px; letter-spacing:.03em; text-transform:uppercase; margin:2px 0 8px; }
		.block-sep { border-top:1px solid var(--line); margin:14px 0 12px; }
		/* Egységes nézet-fejléc: színátmenetes sáv a kártya tetején (mint a modal-fejléc + a
		   Visszajelzés-modál). A -18px negatív margó a .card 18px paddingjéig ér ki → teljes szélesség. */
		.cardhead { display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap;
			margin:-18px -18px 18px; padding:10px 18px; background:var(--gradient,var(--accent));
			border-radius:14px 14px 0 0; color:#fff; }
		.cardhead h2 { margin:0; font-size:16px; font-weight:700; text-transform:none; letter-spacing:-.01em; color:#fff; }
		/* Kompakt fejléc-gombok; másodlagosak (ghost/mini) „üveges" fehérek a színátmeneten. */
		.cardhead button:not(.card-x) { padding:7px 13px; font-size:13px;
			background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.5); color:#fff; }
		.cardhead button:not(.card-x):hover { background:rgba(255,255,255,.28); border-color:#fff; }
		/* Fő művelet (.act, nem ghost): tömör fehér lapka, accent szöveg — a leghangsúlyosabb hívás a sávon. */
		.cardhead .act:not(.ghost) { background:#fff; border-color:#fff; color:var(--accent-dark);
			box-shadow:0 2px 8px rgba(120,50,20,.22); }
		.cardhead .act:not(.ghost):hover { background:#fff5f0; border-color:#fff5f0; box-shadow:0 4px 14px rgba(120,50,20,.3); }
		.cardhead select { width:auto; background:#fff; color:var(--txt); border-color:rgba(255,255,255,.6); }
		.pager { display:flex; justify-content:space-between; align-items:center; margin-top:12px; flex-wrap:wrap; gap:8px; }
		thead tr.filterrow th { padding:4px 6px; font-weight:400; text-transform:none; }
		thead tr.filterrow input, thead tr.filterrow select { padding:5px 7px; font-size:13px; }
		.pager select { width:auto; }
		/* sub-tabs within a section */
		.subtabs { display:flex; gap:4px; margin-bottom:16px; border-bottom:1px solid var(--line); flex-wrap:wrap; }
		.subtabs button { background:transparent; border:0; border-bottom:2px solid transparent;
			color:var(--muted); padding:9px 13px; cursor:pointer; font-size:14px; margin-bottom:-1px; }
		.subtabs button:hover { color:var(--txt); }
		.subtabs button.active { color:var(--accent); border-bottom-color:var(--accent); font-weight:600; }
		/* Modal: app-local (the .modal class collides with the landings' full-screen
		   overlay, so it is not in the shared /campmoney-ui.css). Matches the family look. */
		.modal-bg { position:fixed; inset:0; background:rgba(16,24,40,.45); display:flex; align-items:flex-start;
			justify-content:center; padding-top:6vh; z-index:50; }
		.modal { background:var(--card); border:1px solid var(--line); border-radius:14px; padding:22px;
			max-width:580px; width:94%; max-height:84vh; overflow:auto; box-shadow:0 12px 40px rgba(16,24,40,.18); }
		.modal h2 { margin-top:0; }
		/* Egységes modal-fejléc: színátmenetes sáv a modal tetején (mint a Visszajelzés-modál + a
		   nézet-fejlécek). A -22px negatív margó a .modal 22px paddingjéig ér ki → teljes szélességű sáv. */
		.modal > h2 { margin:-22px -22px 18px; padding:14px 22px; background:var(--gradient,var(--accent));
			border-radius:14px 14px 0 0; font-size:16px; font-weight:700; text-transform:none; letter-spacing:0; color:#fff; text-align:left; }
		small { color:var(--muted); }
		/* login screen */
		.login-shell { max-width:420px; margin:7vh auto; padding:0 16px; }
		.login-shell .brand-lg { display:flex; align-items:center; justify-content:center; gap:11px;
			color:var(--txt); font-size:26px; font-weight:700; margin:0 0 6px; }
		.login-shell .tagline { text-align:center; color:var(--muted); font-size:13px; margin:0 0 18px; }
		.login-shell small { display:block; margin-top:22px; text-align:center; color:var(--muted); font-size:.85rem; }
		.brand-logo-svg { display:block; box-sizing:border-box; padding:9px; background:var(--accent-soft);
			border-radius:11px; fill:none; stroke:var(--accent); stroke-width:1.8; stroke-linecap:round;
			stroke-linejoin:round; flex-shrink:0; }
		.brand-logo-svg.sm { padding:6px; border-radius:8px; }
		/* mobile: sidebar becomes an off-canvas drawer */
		/* Sidebar drawer + scrim + hamburger collapse at <=880px come from the shared
		   .cm-drawer / .cm-scrim / .cm-hamburger (campmoney-ui.css). */
		@media (max-width:640px) {
			header { padding:10px 12px; } main { padding:12px; } .card { padding:14px; }
			.cardhead { margin:-14px -14px 14px; }
			/* Clip the company name so the header row can't overflow; the user-menu
			 * popover is anchored full-width by the shared campmoney-ui.css rule. */
			#who { gap:8px; }
			#who .company { max-width:55vw; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
			th, td { padding:7px 6px; font-size:13px; }
		}
		.g-or { display:flex; align-items:center; gap:10px; margin:14px 0 10px; color:var(--muted); font-size:12px; }
		.g-or::before, .g-or::after { content:""; flex:1; height:1px; background:var(--border, #e2e8f0); }
		.pw-toggle { display:block; text-align:center; margin-top:14px; font-size:.9rem; color:var(--accent); text-decoration:none; }
		.pw-toggle:hover { text-decoration:underline; }
		/* AI Asszisztens — chat */
		.chat-thread { display:flex; flex-direction:column; gap:12px; max-height:52vh; overflow-y:auto;
			padding:4px 2px 2px; margin:4px 0 12px; }
		.chat-empty { color:var(--muted); font-size:13px; text-align:center; padding:18px 8px; }
		.chat-msg { display:flex; }
		.chat-msg.me { justify-content:flex-end; }
		.chat-bub { max-width:82%; padding:10px 13px; border-radius:14px; font-size:14px; line-height:1.55;
			border:1px solid var(--line); }
		.chat-msg.me .chat-bub { background:var(--accent-soft); border-color:transparent;
			border-bottom-right-radius:5px; color:var(--txt); }
		.chat-msg.ai .chat-bub { background:var(--card); border-bottom-left-radius:5px; }
		.chat-msg.ai .chat-bub.pending { color:var(--muted); }
		.ai-md > :first-child { margin-top:0; } .ai-md > :last-child { margin-bottom:0; }
		.ai-md p { margin:0 0 8px; } .ai-md ul, .ai-md ol { margin:6px 0 8px; padding-left:20px; }
		.ai-md li { margin:2px 0; } .ai-md h4 { margin:10px 0 4px; font-size:14px; color:var(--accent); }
		.ai-md strong { font-weight:700; }
		.ai-md code { background:var(--accent-soft); padding:1px 5px; border-radius:5px; font-size:12.5px; }
		.chat-avatar { flex:0 0 auto; width:26px; height:26px; border-radius:50%; background:var(--accent-soft);
			display:flex; align-items:center; justify-content:center; font-size:14px; margin-right:8px; align-self:flex-start; }
		/* Saját körvonalas AI-ikon — a termék brand-színét (--accent) örökli. */
		.ai-ico { stroke:var(--accent); fill:none; vertical-align:-3px; }

		/* ===== Mobil (<=640px): SEAMLESS felső rész (nincs sötét sáv) + narancs „üveg" cégváltón/menün/alsó sávon.
		   A hamburger→„Menü" alsó gomb nyitja a drawert. Desktop érintetlen. ===== */
		@media (max-width:640px){
			/* Felső rész: nincs sötét csík; az oldal alap-színe LEFELÉ FADELVE (a görgő tartalom lágyan tűnik el). */
			.q-topband { position:sticky; top:0; z-index:40; height:auto; gap:8px; box-shadow:none; color:var(--txt);
				padding:calc(12px + env(safe-area-inset-top)) 14px 14px;
				background:linear-gradient(to bottom, var(--bg) 0%, var(--bg) 62%, rgba(253,248,244,0) 100%); }
			.q-topband .cm-hamburger, .q-topband .q-brand { display:none; }
			.q-topband .q-search { flex:0 0 0; min-width:0; }   /* üres — csak a kereső-overlay hordozója (Fázis 2) */
			.q-topband .q-band-right { flex:1 1 auto; margin-left:0; width:100%; }
			.q-topband #who { width:100%; flex-wrap:nowrap; gap:8px; align-items:center; color:var(--txt); }
			/* Cég balra; az app-váltó + avatar EGYÜTT a jobb szélre (nem space-between → nem lóg középre a váltó). */
			.q-topband #who #appSwitch { margin-left:auto; }
			/* #userMenu STATIC marad (nem relative!): így az avatar-lenyíló (.cm-usermenu-pop)
			   igazítási kerete a teljes szélességű #who, nem a keskeny avatar-chip. A közös
			   campmoney-ui.css a popot mobilon left:10px/right:10px-re pinneli — ha #userMenu
			   relative lenne, a pop a ~40px-es avatarhoz igazodna és egy csíkká lógna ki jobbra. */
			.q-topband #who #userMenu { flex:0 0 auto; position:static; }
			/* Cég-pill = narancs üveg. */
			.q-topband #who .company { display:inline-flex; align-items:center; gap:6px; min-width:0; max-width:72vw;
				padding:7px 13px; background:var(--glass); border:1px solid var(--glass-bd);
				backdrop-filter:blur(14px) saturate(1.6); -webkit-backdrop-filter:blur(14px) saturate(1.6);
				color:var(--accent-dark); border-radius:999px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
			.q-topband #who .company .ico { stroke:var(--accent-dark); }
			/* Avatar-menü (közös .acct-menu): frosted narancs üveg, de OLVASHATÓ (sűrű, halvány háttér + blur). */
			.acct-menu { background:linear-gradient(135deg,rgba(255,244,237,.96),rgba(255,250,246,.96));
				backdrop-filter:blur(22px) saturate(1.4); -webkit-backdrop-filter:blur(22px) saturate(1.4);
				border:1px solid var(--glass-bd); box-shadow:0 18px 46px rgba(120,60,30,.26); }
			/* Lebegő, lekerekített, frosted alsó sáv — a tartalom átüt rajta. */
			.q-bottomnav { display:flex; position:fixed; left:50%; transform:translateX(-50%); touch-action:none;
				width:calc(100% - 28px); max-width:520px; bottom:12px; z-index:38; border-radius:19px; overflow:hidden;
				background:var(--glass); backdrop-filter:blur(20px) saturate(1.7); -webkit-backdrop-filter:blur(20px) saturate(1.7);
				border:1px solid var(--glass-bd); box-shadow:0 12px 34px rgba(120,60,30,.16); padding:5px 6px;
				transition:padding .24s ease, width .26s cubic-bezier(.4,0,.2,1); }
			.q-bottomnav.compact { width:min(62%, 270px); }
			.main-col { padding-bottom:calc(80px + env(safe-area-inset-bottom)); }
			/* „Menü" drawer = ALULRÓL nyíló lap (a bal becsúszás helyett). A base .cm-drawer translateX-ét felülírjuk. */
			#sidebar.cm-drawer { left:0; right:0; top:auto; bottom:0; width:auto; height:auto; max-height:82vh;
				transform:translateY(100%); border-radius:24px 24px 0 0; box-shadow:0 -14px 44px rgba(20,10,35,.22);
				background:linear-gradient(180deg, rgba(255,255,255,.78), rgba(255,255,255,.66));
				backdrop-filter:blur(22px) saturate(1.5); -webkit-backdrop-filter:blur(22px) saturate(1.5);
				border-top:1px solid rgba(255,255,255,.6); overflow:hidden; padding-top:24px;
				transition:transform .24s ease, opacity .24s ease; }
			#sidebar.cm-drawer.open { transform:translateY(0); }
			/* A menü mögötti fátyol = finom narancs (nem sötét). */
			.cm-scrim { background:linear-gradient(160deg, rgba(240,97,46,.16), rgba(245,166,35,.10));
				backdrop-filter:blur(7px) saturate(1.3); -webkit-backdrop-filter:blur(7px) saturate(1.3);
				transition:opacity .24s ease; }
			/* Kattintható grab-fogantyú (fentről bezárás). */
			#sidebar .cm-sheet-grab { display:block; position:absolute; top:0; left:0; right:0; height:22px; margin:0; padding:0;
				background:none; border:0; cursor:pointer; }
			#sidebar .cm-sheet-grab::before { content:''; position:absolute; top:8px; left:50%; transform:translateX(-50%);
				width:40px; height:5px; border-radius:99px; background:#e6d3c6; }
			#sidebar.cm-drawer nav { overflow-y:auto; max-height:calc(82vh - 30px); padding:6px 10px calc(16px + env(safe-area-inset-bottom)); }
		}
		/* Háttér-görgés zárolása, amíg a Menü-lap nyitva van (a JS lockBg is védi iOS-en). */
		body:has(#sidebar.cm-drawer.open) { overflow:hidden; }

		/* ===== Univerzális kereső (fejléc közepén) — funkció-paletta + adat-keresés (Fázis 2) ===== */
		/* Valódi középre: a két szélső zóna egyenlő flexet kap, a kereső fix. */
		.q-topband .q-brand { flex:1 1 0; min-width:0; }
		.q-topband .q-band-right { flex:1 1 0; justify-content:flex-end; margin-left:0; }
		.q-search { flex:0 0 auto; display:flex; justify-content:center; min-width:0; position:relative; }
		.q-search-icon { display:none; align-items:center; justify-content:center; width:38px; height:38px; border-radius:10px;
			border:0; background:rgba(255,255,255,.09); color:#f6ede6; cursor:pointer; flex:0 0 auto; }
		.q-search-icon svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; }
		.q-search-field { display:flex; align-items:center; gap:9px; width:min(460px,100%); height:38px;
			padding:0 10px 0 12px; background:rgba(255,255,255,.09); border:1px solid transparent; border-radius:10px;
			cursor:text; transition:background .15s, box-shadow .15s; }
		.q-search-field .q-search-lens { width:17px; height:17px; stroke:#cbb8a8; fill:none; flex:0 0 auto; transition:stroke .15s; }
		.q-search-field input { flex:1; min-width:0; border:0; background:transparent; outline:none; font:inherit;
			font-size:14px; color:#fff; caret-color:var(--accent); }
		.q-search-field input::placeholder { color:#cbb8a8; }
		.q-search-kbd { font:600 10.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace; color:#cbb8a8;
			border:1px solid #463829; border-radius:5px; padding:3px 6px; flex:0 0 auto; }
		body.q-searching .q-search-field { background:#fff; box-shadow:0 10px 28px -10px rgba(0,0,0,.5); }
		body.q-searching .q-search-field .q-search-lens { stroke:var(--accent); }
		body.q-searching .q-search-field input { color:var(--txt); }
		body.q-searching .q-search-field input::placeholder { color:var(--muted); }
		body.q-searching .q-search-kbd { display:none; }
		.q-search-x { display:none; }
		.q-search-scrim { position:fixed; inset:0; background:rgba(30,15,5,.22); z-index:39; opacity:0;
			pointer-events:none; transition:opacity .15s; }
		body.q-searching .q-search-scrim { opacity:1; pointer-events:auto; }
		.q-search-panel { position:fixed; top:60px; left:50%; transform:translateX(-50%) translateY(-8px);
			width:min(560px,calc(100vw - 24px)); max-height:min(72vh,440px); overflow:auto; background:var(--card);
			border:1px solid var(--line); border-radius:14px; box-shadow:0 26px 60px -18px rgba(60,30,10,.4);
			z-index:45; opacity:0; pointer-events:none; transition:opacity .16s, transform .16s; }
		body.q-searching .q-search-panel { opacity:1; pointer-events:auto; transform:translateX(-50%) translateY(0); }
		.q-search-grp { padding:2px 6px 6px; }
		.q-search-grplab { font-size:10.5px; letter-spacing:.11em; text-transform:uppercase; color:var(--muted);
			font-weight:700; padding:10px 12px 5px; }
		.q-search-res { display:flex; align-items:center; gap:12px; padding:9px 12px; border-radius:9px; cursor:pointer; }
		.q-search-res .ic { width:30px; height:30px; border-radius:8px; background:var(--accent-soft); color:var(--accent-dark);
			display:grid; place-items:center; flex:0 0 auto; }
		.q-search-res .ic .cm-ic { width:16px; height:16px; }
		.q-search-res .tx { min-width:0; flex:1; }
		.q-search-res .tx .t { font-size:13.5px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
		.q-search-res .tx .t mark { background:transparent; color:var(--accent-dark); font-weight:800; }
		.q-search-res .tx .s { font-size:12px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
		.q-search-res .meta { font-size:12px; color:var(--muted); flex:0 0 auto; font-variant-numeric:tabular-nums; }
		.q-search-res .go { opacity:0; font-size:11px; color:var(--accent); font-weight:700; flex:0 0 auto; }
		.q-search-res.sel { background:var(--accent-soft); }
		.q-search-res.sel .go { opacity:1; }
		.q-search-res:hover { background:var(--head-tint); }
		.q-search-res .ext { font-size:11px; color:var(--accent); font-weight:700; flex:0 0 auto; }
		.q-search-empty { padding:26px 16px; text-align:center; color:var(--muted); font-size:13px; }
		.q-search-foot { display:flex; align-items:center; gap:14px; padding:8px 14px; border-top:1px solid var(--line);
			font-size:11px; color:var(--muted); position:sticky; bottom:0; background:var(--card); }
		.q-search-foot .sp { margin-left:auto; }
		.q-search-foot kbd { font:600 10.5px/1 ui-monospace,Menlo,monospace; background:var(--accent-soft);
			border:1px solid var(--accent-soft); border-radius:5px; padding:2px 5px; color:var(--accent-dark); }
		/* Mobil: a magnifier a sávban nyitja; keresés közben a mező FELÜL fixen, a találatok alatta. */
		@media (max-width:640px){
			.q-topband .q-search { flex:0 0 auto; }
			.q-topband .q-search-icon { display:inline-flex; background:var(--glass); border:1px solid var(--glass-bd);
				color:var(--accent-dark); backdrop-filter:blur(14px) saturate(1.6); -webkit-backdrop-filter:blur(14px) saturate(1.6); }
			.q-search-field { display:none; }
			body.q-searching .q-search { position:static; }
			body.q-searching .q-search-field { display:flex; position:fixed; left:10px; right:10px;
				top:calc(10px + env(safe-area-inset-top)); bottom:auto; width:auto; height:52px; z-index:47;
				border-radius:16px; box-shadow:0 12px 34px rgba(30,15,5,.28); }
			body.q-searching .q-search-field input { font-size:16px; }   /* iOS: 16px → nincs auto-zoom */
			body.q-searching .q-topband #who { display:none; }
			body.q-searching .q-topband .q-search-icon { display:none; }
			.q-search-panel { top:calc(70px + env(safe-area-inset-top)); left:10px; right:10px; bottom:auto; transform:none; z-index:46;
				max-height:calc(100vh - 92px - env(safe-area-inset-top)); border-radius:18px; }
			body.q-searching .q-search-scrim { background:linear-gradient(160deg, rgba(240,97,46,.18), rgba(245,166,35,.11));
				backdrop-filter:blur(7px) saturate(1.3); -webkit-backdrop-filter:blur(7px) saturate(1.3); }
			body.q-searching .q-search-panel { transform:none; }
			.q-search-foot { display:none; }
			body.q-searching .q-search-x { display:inline-flex; align-items:center; justify-content:center;
				width:30px; height:30px; flex:0 0 auto; border:0; border-radius:8px; cursor:pointer;
				background:var(--glass); color:var(--accent-dark); font-size:15px; }
		}
		body.q-searching { overflow:hidden; }

		/* ===== Dashboard gyorsműveletek (Fázis 4): desktopon egy sor (JS), mobilon első 2 + „Több ▾". ===== */
		#quickActions .qa-more { display:none; align-items:center; gap:4px; cursor:pointer;
			background:var(--accent-soft); border:1px solid var(--line); color:var(--accent-dark);
			border-radius:999px; padding:8px 13px; font:700 12.5px/1 var(--font-sans,"Inter",sans-serif); white-space:nowrap; }
		#quickActions .qa-more:hover { border-color:var(--accent); }
		@media (max-width:640px){
			#quickActions .qa-more { display:inline-flex; margin-left:auto; }
			#quickActions:not(.qa-open) .act.ghost:nth-child(n+3) { display:none !important; }
		}

		/* ==========================================================================
		   ÁTTEKINTŐ (dashboard) — tömörített, Quilly-paritás (lila→Voya-narancs).
		   MINDEN szabály #tab-dashboard-ra szűkítve → a többi fül változatlan.
		   ========================================================================== */
		/* A dashboard szélesebb (kihasználja a bento-rácsot); csak amíg ez a fül aktív. */
		main:has(> #tab-dashboard:not(.hidden)) { max-width:1280px; }

		/* Gyorsműveletek: vékony felső pill-sor (kártya/fejléc nélkül). */
		.qa-bar { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:16px; }
		.qa-bar .qa-lead { font-size:11px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; color:var(--muted); }
		#tab-dashboard .qa { gap:8px; }
		#tab-dashboard .qa .act.ghost { background:#fff; border:1px solid var(--line); border-radius:999px;
			color:var(--txt); padding:8px 15px; font-weight:600; margin:0; box-shadow:none; }
		#tab-dashboard .qa .act.ghost:hover { border-color:var(--accent); color:var(--accent-dark); }
		/* A leggyakoribb gyorsművelet (első) tömör accent-pill — a hangsúlyos hívás. */
		#tab-dashboard .qa .act.ghost:first-child { background:var(--accent); border-color:var(--accent);
			color:#fff; box-shadow:0 4px 14px rgba(240,97,46,.28); }
		#tab-dashboard .qa .act.ghost:first-child:hover { background:var(--accent-dark); color:#fff; }
		#tab-dashboard .qa .act.ghost .ico { width:16px; height:16px; }

		/* KPI ultra-kompakt pill-sor (rímel a gyorsművelet-sorra). */
		#tab-dashboard .kstrip { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; }
		#tab-dashboard .kpill { display:inline-flex; align-items:center; gap:9px; background:#fff;
			border:1px solid var(--line); border-radius:999px; padding:8px 15px 8px 10px; cursor:pointer; transition:.12s; }
		#tab-dashboard .kpill:hover { border-color:var(--accent); }
		#tab-dashboard .kpill .kc { width:26px; height:26px; border-radius:7px; display:grid; place-items:center;
			flex:0 0 auto; background:var(--accent-soft); color:var(--accent-dark); }
		#tab-dashboard .kpill .kc svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.9; }
		#tab-dashboard .kpill .kn { font-size:18px; font-weight:750; letter-spacing:-.02em; }
		#tab-dashboard .kpill .kl { font-size:12.5px; color:var(--muted); font-weight:600; }
		#tab-dashboard .kpill.alert .kc { background:#fbe3e3; color:#dc2626; }
		#tab-dashboard .kpill.alert .kn { color:#dc2626; }
		#tab-dashboard .kpill.warn .kc { background:#fef0cf; color:#b45309; }
		#tab-dashboard .kpill.warn .kn { color:#b45309; }

		/* Könnyű kártya-fejléc (a .card > h2 / .cardhead színátmenetes sáv HELYETT, csak itt). */
		#tab-dashboard .dh { display:flex; align-items:center; justify-content:space-between; gap:10px;
			margin:0 0 14px; padding:0 24px 12px 0; border-bottom:1px solid var(--line); }
		#tab-dashboard .dh h2 { margin:0; font-size:15px; font-weight:700; color:var(--txt); text-transform:none;
			letter-spacing:-.01em; display:flex; align-items:center; gap:9px; min-width:0; }
		#tab-dashboard .dh h2 > svg:first-child { width:26px; height:26px; padding:5px; border-radius:8px;
			background:var(--accent-soft); color:var(--accent-dark); box-sizing:border-box; flex:0 0 auto; }
		#tab-dashboard .dh .dh-actions { display:flex; align-items:center; gap:10px; flex:0 0 auto; }
		#tab-dashboard .card-x { top:14px; right:14px; color:var(--muted); }
		#tab-dashboard .card-x:hover { background:var(--accent-soft); color:var(--accent-dark); }

		/* „Bento" rács: a látszó kártyákból számol (layoutDashGrid JS). Voyán kevés a tartalmi kártya
		   (AI + Költség-előrejelzés) → max 2 oszlop; a magasságot 8px-es sor-egységre snap-eljük. */
		#tab-dashboard .dgrid { display:grid; grid-template-columns:repeat(var(--dcols,2),1fr);
			grid-auto-rows:8px; column-gap:14px; row-gap:0; grid-auto-flow:row dense; align-items:start; }
		#tab-dashboard .dcell { min-width:0; }
		#tab-dashboard .dcell.span2 { grid-column:span 2; }
		#tab-dashboard .dcell:empty { display:none; }
		#tab-dashboard .dcell > .card { margin-bottom:14px; display:flex; flex-direction:column; }

		/* AI teaser: kattintható példa-kérdés chipek + inline kérdés-mező. */
		#tab-dashboard .ai-teaser { flex:1; display:flex; flex-direction:column; gap:12px; }
		#tab-dashboard .ai-qchips { display:flex; flex-wrap:wrap; gap:7px; }
		#tab-dashboard .ai-qc { font-size:12px; background:#fffaf7; border:1px solid var(--line); border-radius:999px;
			padding:6px 11px; color:var(--txt); cursor:pointer; text-align:left; font:inherit; }
		#tab-dashboard .ai-qc:hover { border-color:var(--accent); color:var(--accent-dark); }
		#tab-dashboard .ai-ask { display:flex; gap:8px; margin-top:auto; }
		#tab-dashboard .ai-ask input { flex:1; min-width:0; margin:0; }
		#tab-dashboard .ai-ask .act { margin:0; white-space:nowrap; }

		/* Értesítések (#dashAlerts): egy doboz, kis kártyák reszponzív rácsban, súlyozva. */
		#tab-dashboard #dashAlerts:empty { display:none; }
		#tab-dashboard .nbox { background:var(--card); border:1px solid var(--line); border-radius:14px; padding:13px; margin-bottom:14px; }
		#tab-dashboard .nhead { display:flex; align-items:center; gap:9px; margin-bottom:10px; flex-wrap:wrap; }
		#tab-dashboard .nhead h3 { margin:0; font-size:14px; font-weight:700; color:var(--txt); display:flex; align-items:center; gap:8px; }
		#tab-dashboard .nhead h3 svg { width:24px; height:24px; padding:5px; border-radius:8px; background:var(--accent-soft); color:var(--accent-dark); box-sizing:border-box; }
		#tab-dashboard .nbadge { font-size:11px; font-weight:800; border-radius:999px; padding:2px 8px; }
		#tab-dashboard .nbadge.d { background:#fdecec; color:#dc2626; }
		#tab-dashboard .nbadge.w { background:#fef3c7; color:#b45309; }
		#tab-dashboard .ngrid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:8px; grid-auto-flow:row dense; }
		#tab-dashboard .ntile { position:relative; display:flex; flex-direction:column; gap:4px; background:#fff;
			border:1px solid var(--line); border-left-width:3px; border-radius:10px; padding:9px 11px; }
		#tab-dashboard .ntile.clickable { cursor:pointer; }
		#tab-dashboard .ntile.clickable:hover { border-color:var(--accent); }
		#tab-dashboard .ntile.d { border-left-color:#dc2626; background:#fdf7f7; border-color:#f3dede; }
		#tab-dashboard .ntile.w { border-left-color:#f59e0b; background:#fffdf6; border-color:#f6e6c8; }
		#tab-dashboard .ntile.sys { border-left-color:var(--accent); background:#fff7f3; border-color:#f7ddce; }
		#tab-dashboard .ntile.i { border-left-color:#cbd5e1; }
		#tab-dashboard .ntile.open { grid-column:1 / -1; border-color:var(--accent); box-shadow:0 0 0 1px var(--accent); }
		#tab-dashboard .ntile.open .ndesc { -webkit-line-clamp:unset; display:block; }
		#tab-dashboard .ngo { align-self:flex-start; margin-top:6px; background:var(--accent); color:#fff; border:none;
			border-radius:8px; padding:7px 14px; font-weight:600; font-size:12.5px; cursor:pointer; }
		#tab-dashboard .ngo:hover { background:var(--accent-dark); }
		#tab-dashboard .ntop { display:flex; align-items:center; gap:8px; }
		#tab-dashboard .nic { width:22px; height:22px; border-radius:6px; display:inline-grid; place-items:center; flex:0 0 auto; }
		#tab-dashboard .nic svg { width:13px; height:13px; }
		#tab-dashboard .nic.d { background:#fbe3e3; color:#dc2626; }
		#tab-dashboard .nic.w { background:#fef0cf; color:#b45309; }
		#tab-dashboard .nic.sys { background:var(--accent-soft); color:var(--accent-dark); }
		#tab-dashboard .nic.i { background:#eef2f7; color:#475569; }
		#tab-dashboard .nic .ico { stroke:currentColor; }
		#tab-dashboard .nttl { font-size:13px; font-weight:700; flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
		#tab-dashboard .nchev-go { color:var(--accent-dark); font-weight:700; font-size:16px; line-height:1; flex:0 0 auto; opacity:.7; }
		#tab-dashboard .nx { background:none; border:none; color:#cabfb6; font-size:12px; cursor:pointer; flex:0 0 auto; padding:0 2px; }
		#tab-dashboard .nx:hover { color:var(--muted); }
		#tab-dashboard .ndesc { font-size:12px; color:var(--muted); line-height:1.4; display:-webkit-box;
			-webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
		#tab-dashboard .nmeter { height:4px; border-radius:99px; background:#00000010; overflow:hidden; margin-top:2px; }
		#tab-dashboard .nmeter > i { display:block; height:100%; background:linear-gradient(90deg,#f59e0b,#dc2626); }
		#tab-dashboard .nmore { margin-top:9px; font-size:12.5px; color:var(--accent-dark); font-weight:600; cursor:pointer; }

		/* Kördiagram (donut) + jelmagyarázat a dashboard-kártyákon (pl. Költség-előrejelzés). */
		#tab-dashboard .dash-donut { position:relative; display:inline-grid; place-items:center; flex:none; }
		#tab-dashboard .dash-donut > svg { display:block; }
		#tab-dashboard .dash-donut-c { position:absolute; inset:0; display:flex; flex-direction:column;
			align-items:center; justify-content:center; pointer-events:none; }
		#tab-dashboard .dash-donut-c .dc-top { font-size:17px; font-weight:750; line-height:1.05; color:var(--txt); white-space:nowrap; }
		#tab-dashboard .dash-donut-c .dc-bot { font-size:10px; color:var(--muted); margin-top:2px; }
		#tab-dashboard .cf-split { display:flex; gap:18px; align-items:center; flex-wrap:wrap; }
		#tab-dashboard .cf-leg { display:flex; flex-direction:column; gap:2px; min-width:170px; flex:1; }
		#tab-dashboard .dl-row { display:flex; align-items:center; gap:8px; font-size:13px; padding:3px 0; }
		#tab-dashboard .dl-sw { width:10px; height:10px; border-radius:3px; flex:none; }
		#tab-dashboard .dl-nm { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
		#tab-dashboard .dl-amt { font-weight:600; white-space:nowrap; }
		#tab-dashboard .dl-pct { color:var(--muted); font-size:11px; width:38px; text-align:right; }

		@media (max-width:640px){
			#tab-dashboard .dh { flex-wrap:wrap; row-gap:8px; }
			#tab-dashboard .ngrid { grid-template-columns:1fr; }
			#tab-dashboard .cf-split { justify-content:center; }
		}