/* Figtree (SIL Open Font License 1.1) – helyből, külső betűtípus-szolgáltató nélkül */
@font-face { font-family: "Figtree"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/figtree-400-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Figtree"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/figtree-400-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Figtree"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/figtree-600-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Figtree"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/figtree-600-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Figtree"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/figtree-700-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Figtree"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/figtree-700-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* Hibaportál – DSZC színvilág (a logó kék, lila, narancs, sárga színeiből) az Industry alap fölött. */

:root {
  --navy: #1f3a6e; --navy-2: #142a54; --navy-3: #2c4f8f;
  --purple: #8e3a8c; --purple-600: #7a2f78; --purple-700: #662764; --purple-50: #f8eff7; --purple-100: #f1dff0;
  --orange: #e08a2c; --orange-600: #c97420; --orange-50: #fdf1e3;
  --yellow: #f2c230; --blue: #2f6fd6; --teal: #13a38a; --green: #1f9d63; --red: #c2414f;
  --ink: #1c2433; --ink-2: #4a5468; --ink-3: #6f798c;
  --line: #e3e7ef; --line-2: #d3d9e5;
  --page: #f3f5fa; --card: #ffffff;
  --radius: 14px; --radius-sm: 9px;
  --shadow-1: 0 1px 2px rgba(20, 33, 66, .06), 0 2px 8px rgba(20, 33, 66, .05);
  --shadow-2: 0 6px 24px rgba(20, 33, 66, .10);
  --shadow-3: 0 18px 48px rgba(20, 33, 66, .22);

  --color-bg: var(--page); --color-surface: var(--card); --color-text: var(--ink);
  --color-accent: var(--purple); --color-accent-100: var(--purple-50); --color-accent-200: var(--purple-100);
  --color-accent-400: #c68ac4; --color-accent-600: var(--purple-600); --color-accent-700: var(--purple-700);
  --color-accent-800: #4d1d4b; --color-accent-900: var(--navy);
  --color-divider: var(--line);
  --color-neutral-100: #f4f6fa; --color-neutral-200: #e9edf3; --color-neutral-300: #d3d9e5; --color-neutral-400: #b3bccb;
  --color-neutral-500: #8a94a6; --color-neutral-600: #6b7486; --color-neutral-700: #4a5468; --color-neutral-800: #343c4c; --color-neutral-900: #1c2433;
  --font-body: "Figtree", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-heading: "Figtree", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-heading-weight: 700;
}

/* Állapotszínek: --stc (jel), --stbg (címke háttér), --stfg (címke szöveg) */
.st-new { --stc: #2f6fd6; --stbg: #e8f0fd; --stfg: #1d4fa3; }
.st-accepted { --stc: #0e9bb5; --stbg: #e0f5f9; --stfg: #0b6a7c; }
.st-in_progress { --stc: #8e3a8c; --stbg: #f5e8f4; --stfg: #6c2a6a; }
.st-waiting_parts { --stc: #d9a21b; --stbg: #fdf3d6; --stfg: #7a5600; }
.st-solved { --stc: #1f9d63; --stbg: #e2f5eb; --stfg: #136b42; }
.st-rejected { --stc: #9aa3b2; --stbg: #eef0f4; --stfg: #4a5468; }

/* ─── Alap ─── */
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--page); color: var(--ink); font-family: var(--font-body); font-size: 15px; -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, h5 { font-family: var(--font-heading); font-weight: 700; letter-spacing: -.01em; color: var(--ink); }
h6 { font-family: var(--font-body); font-weight: 600; font-size: 12px; letter-spacing: .07em; color: var(--ink-3); }
a { color: var(--purple); }
a:hover { color: var(--purple-700); }
button { font: inherit; }
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ico { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; vertical-align: -3px; }
:focus-visible { outline: 2px solid var(--purple); outline-offset: 2px; }
::selection { background: rgba(142, 58, 140, .22); }

.app { min-height: 100vh; display: flex; flex-direction: column; }
.page { max-width: 1180px; width: 100%; margin: 0 auto; padding: 26px 20px 44px; }
.page-narrow { max-width: 820px; }
.stack { display: flex; flex-direction: column; }
.row { display: flex; align-items: center; flex-wrap: wrap; }
.ml-auto { margin-left: auto; }
.gap-6 { gap: 6px; } .gap-7 { gap: 7px; } .gap-8 { gap: 8px; } .gap-10 { gap: 10px; } .gap-12 { gap: 12px; } .gap-14 { gap: 14px; }
.gap-18 { gap: 18px; } .gap-20 { gap: 20px; } .gap-22 { gap: 22px; } .gap-24 { gap: 24px; } .gap-28 { gap: 28px; }
.fs-11 { font-size: 11px; } .fs-12 { font-size: 12px; } .fs-13 { font-size: 13px; } .fs-14 { font-size: 14px; }
.m0 { margin: 0; }
.text-muted { color: var(--ink-3); }
.head-font { font-family: var(--font-heading); font-weight: 600; }
.caps-label { font-size: 11px; letter-spacing: .07em; text-transform: uppercase; font-weight: 600; }
.back-link { font-size: 14px; display: inline-flex; align-items: center; gap: 4px; text-decoration: none; font-weight: 500; }
h6.section { margin: 0 0 12px; }
.page-title { margin: 12px 0 20px; font-size: 30px; }
code { background: #eef1f6; border-radius: 5px; padding: 1px 5px; font-size: .92em; }

/* ─── Gombok, mezők, címkék ─── */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 38px; padding: 8px 14px; border-radius: var(--radius-sm);
  font-family: var(--font-heading); font-weight: 600; font-size: 15px; letter-spacing: .01em; line-height: 1.15;
  border: 1px solid var(--line-2); background: #fff; color: var(--ink); text-decoration: none; cursor: pointer;
  transition: background .15s, border-color .15s, box-shadow .15s, transform .05s; }
.btn:hover { background: #f5f7fb; border-color: #c2cad8; color: var(--ink); }
.btn:active { transform: translateY(1px); }
.btn:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.btn .ico { width: 17px; height: 17px; }
.btn-primary { background: var(--purple); border-color: var(--purple); color: #fff; box-shadow: 0 2px 6px rgba(142, 58, 140, .25); }
.btn-primary:hover { background: var(--purple-600); border-color: var(--purple-600); color: #fff; }
.btn-primary:active { background: var(--purple-700); }
.btn-secondary { background: #fff; border-color: var(--line-2); }
.btn-ghost { background: transparent; border-color: transparent; color: var(--purple); padding-inline: 10px; }
.btn-ghost:hover { background: var(--purple-50); border-color: transparent; color: var(--purple-700); }
.btn-cta { background: var(--orange); border-color: var(--orange); color: #fff; box-shadow: 0 3px 10px rgba(224, 138, 44, .35); }
.btn-cta:hover { background: var(--orange-600); border-color: var(--orange-600); color: #fff; }
.btn-lg { min-height: 48px; padding: 11px 22px; font-size: 18px; border-radius: 12px; }
.btn-sm { min-height: 30px; padding: 4px 10px; font-size: 13px; border-radius: 7px; }
.btn-icon { width: 38px; padding: 0; }
.btn-block { width: 100%; margin-top: 8px; }
.btn-white { background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .35); color: #fff; }
.btn-white:hover { background: rgba(255, 255, 255, .24); border-color: rgba(255, 255, 255, .5); color: #fff; }
.btn-danger { color: #a3303d; border-color: #efc3c9; background: #fff; }
.btn-danger:hover { background: #fdf0f2; border-color: #e3a5ae; color: #8a2a36; }
.btn-danger-text { color: #a3303d; }
.btn-danger-text:hover { background: #fdf0f2; color: #8a2a36; }
.link-btn { background: none; border: 0; padding: 0; color: var(--purple); cursor: pointer; font-size: 14px; text-align: left; }
.link-btn:hover { color: var(--purple-700); text-decoration: underline; }

.field > label, .legend { display: block; font-size: 13px; font-weight: 600; color: var(--ink-2); margin-bottom: 6px; padding: 0; }
.fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.input { width: 100%; min-height: 40px; padding: 8px 11px; font: inherit; font-size: 15px; color: var(--ink); background: #fff;
  border: 1px solid var(--line-2); border-radius: var(--radius-sm); transition: border-color .15s, box-shadow .15s; }
.input:hover { border-color: #b9c2d3; }
.input:focus, .input:focus-visible { outline: none; border-color: var(--purple); box-shadow: 0 0 0 3px rgba(142, 58, 140, .15); }
textarea.input { min-height: 100px; resize: vertical; line-height: 1.5; }
select.input { appearance: auto; }
.sel { width: auto; min-width: 150px; }
input[type=checkbox] { accent-color: var(--purple); width: 17px; height: 17px; margin: 0; flex: none; }
input[type=color] { width: 42px; height: 36px; padding: 2px; border: 1px solid var(--line-2); border-radius: 8px; background: #fff; cursor: pointer; }
.check-row { display: flex; gap: 10px; align-items: flex-start; font-size: 14.5px; cursor: pointer; line-height: 1.4; }
.check-row input { margin-top: 2px; }

.tag { display: inline-flex; align-items: center; gap: 5px; border-radius: 999px; padding: 3px 10px; font-size: 12px; font-weight: 600;
  letter-spacing: 0; line-height: 1.35; white-space: nowrap; border: 0; background: #eef1f6; color: var(--ink-2); }
.tag .ico { width: 13px; height: 13px; stroke-width: 2.2; }
.tag[class*=" st-"] { background: var(--stbg); color: var(--stfg); }
.tag[class*=" st-"]::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--stc); }
.tag-accent { background: var(--purple-50); color: var(--purple-700); }
.tag-accent-2 { background: #e8f0fd; color: #1d4fa3; }
.tag-neutral { background: #eef1f6; color: var(--ink-2); }
.tag-outline { background: #fff; border: 1px solid var(--line-2); color: var(--ink-2); }
.tag-urgent { background: var(--orange-50); color: #9a500d; }
.tag-ok { background: #e2f5eb; color: #136b42; }
.tag-warn { background: #fdecee; color: #a3303d; }

.chips { display: flex; gap: 8px; flex-wrap: wrap; }
.chip { position: relative; }
.chip input { position: absolute; opacity: 0; width: 0; height: 0; }
.chip span { display: inline-flex; align-items: center; cursor: pointer; font-size: 14.5px; font-weight: 500; line-height: 1.2; padding: 8px 15px;
  border: 1px solid var(--line-2); border-radius: 999px; color: var(--ink); background: #fff; transition: background .12s, border-color .12s; }
.chip span:hover { border-color: var(--purple); background: var(--purple-50); }
.chip input:checked + span { background: var(--purple); border-color: var(--purple); color: #fff; box-shadow: 0 2px 6px rgba(142, 58, 140, .25); }
.chip input:focus-visible + span { outline: 2px solid var(--purple); outline-offset: 2px; }
.chip input:disabled + span { opacity: .5; }
.chips-mine .chip span { border-color: #d7b3d6; background: var(--purple-50); }
.room-group[hidden] { display: none !important; }

/* ─── Kártyák ─── */
.blueprint > .corner { display: none; }
.blueprint, .card, .panel { position: relative; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-1); }
.card { display: flex; flex-direction: column; gap: 6px; padding: 14px 16px; }
.card.stripe, .card[class*=" st-"] { border-left: 4px solid var(--stc); }
.card-kicker { font-size: 11.5px; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-3); font-weight: 600; }
.card-title { font-family: var(--font-heading); font-size: 18px; font-weight: 600; line-height: 1.2; }
.card-meta { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 12.5px; color: var(--ink-3); }
a.card, a.blueprint { color: inherit; text-decoration: none; transition: box-shadow .15s, border-color .15s, transform .1s; }
a.card:hover, a.blueprint:hover { border-color: #cdd4e1; box-shadow: var(--shadow-2); }
.panel { padding: 18px 20px; }
.panel-head { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.panel-head h2 { font-size: 20px; margin: 0; }
.panel-head p { margin: 0; font-size: 13px; color: var(--ink-3); flex-basis: 100%; }
.panel-head .ph-mini { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; color: #fff; flex: none; }
.panel-head .ph-mini .ico { width: 17px; height: 17px; }
.empty { padding: 18px; font-size: 14px; color: var(--ink-3); text-align: center; background: #fafbfd; border: 1px dashed var(--line-2); border-radius: 12px; }
.grid-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 22px; align-items: start; }
.grid-auto { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }

.tone-purple { background: linear-gradient(135deg, #8e3a8c, #b24a9e); }
.tone-blue { background: linear-gradient(135deg, #2f6fd6, #4f8ae6); }
.tone-orange { background: linear-gradient(135deg, #e08a2c, #f0a54a); }
.tone-green { background: linear-gradient(135deg, #13a38a, #2cbf9d); }
.tone-yellow { background: linear-gradient(135deg, #d9a21b, #f2c230); }
.tone-navy { background: linear-gradient(135deg, #1f3a6e, #2c4f8f); }
.tone-pink { background: linear-gradient(135deg, #c0417a, #dc5f95); }

/* ─── Oldalfejléc ─── */
.page-head { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 22px; }
.ph-icon { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; flex: none; color: #fff; box-shadow: var(--shadow-1); }
.ph-icon .ico { width: 25px; height: 25px; }
.ph-text h1 { font-size: 31px; margin: 0; line-height: 1.1; display: flex; align-items: center; gap: 8px; }
.ph-text p { margin: 3px 0 0; color: var(--ink-3); font-size: 14px; }
.ph-actions { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.help-dot { width: 21px; height: 21px; border-radius: 50%; background: #e6eaf2; color: var(--ink-2); font: 700 12px/1 var(--font-body);
  display: inline-grid; place-items: center; text-decoration: none; }
.help-dot:hover { background: var(--purple); color: #fff; }

/* ─── Üzenetek ─── */
.flashes { display: flex; flex-direction: column; gap: 8px; margin-bottom: 18px; }
.flash { border-radius: 12px; padding: 11px 14px; display: flex; gap: 10px; align-items: flex-start; font-size: 14.5px; box-shadow: var(--shadow-1); }
.flash .ico { margin-top: 1px; }
.flash-ok { background: #e9f8f0; border: 1px solid #bfe6d0; color: #135c3b; }
.flash-error { background: #fdf0f2; border: 1px solid #f1c6cd; color: #8a2a36; }
.flash code { font-size: 12px; word-break: break-all; }

/* ─── Tanári fejléc ─── */
.topbar { background: linear-gradient(100deg, #142a54 0%, #1f3a6e 55%, #4b3a7e 100%); color: #fff; position: sticky; top: 0; z-index: 30; box-shadow: 0 2px 12px rgba(20, 33, 66, .18); }
.topbar-inner { max-width: 1180px; margin: 0 auto; padding: 10px 20px; display: flex; align-items: center; gap: 16px; }
.brand { display: flex; align-items: center; gap: 11px; color: #fff; text-decoration: none; min-width: 0; }
.brand:hover { color: #fff; }
.topbar .brand { margin-right: auto; }
.brand-logo { width: 42px; height: 42px; border-radius: 12px; background: #fff; display: grid; place-items: center; flex: none; box-shadow: 0 2px 6px rgba(0, 0, 0, .15); }
.brand-logo img { width: 30px; height: auto; }
.brand-text { display: flex; flex-direction: column; min-width: 0; }
.brand-title { font-family: var(--font-heading); font-weight: 700; font-size: 20px; line-height: 1; }
.brand-sub { font-size: 12px; opacity: .78; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 280px; margin-top: 3px; }
.topnav { display: flex; gap: 3px; }
.topnav a { display: inline-flex; align-items: center; gap: 7px; padding: 9px 12px; border-radius: 10px; color: rgba(255, 255, 255, .82); text-decoration: none; font-weight: 500; font-size: 14.5px; white-space: nowrap; }
.topnav a:hover { background: rgba(255, 255, 255, .1); color: #fff; }
.topnav a[aria-current=page] { background: rgba(255, 255, 255, .17); color: #fff; }
.nav-badge { min-width: 19px; height: 19px; border-radius: 10px; background: var(--orange); color: #fff; font: 700 11px/1 var(--font-body); display: inline-grid; place-items: center; padding: 0 5px; }
.brand-stripe { height: 4px; background: linear-gradient(90deg, #e08a2c, #f2c230 25%, #2f6fd6 50%, #8e3a8c 75%, #c0417a); }
.avatar { width: 40px; height: 40px; border-radius: 50%; background: linear-gradient(135deg, #8e3a8c, #e08a2c); color: #fff; border: 2px solid rgba(255, 255, 255, .7);
  font: 700 14px/1 var(--font-body); display: grid; place-items: center; cursor: pointer; flex: none; }
.avatar.sm { width: 34px; height: 34px; font-size: 12px; cursor: default; }
.user-menu { position: relative; }
.user-menu summary { list-style: none; }
.user-menu summary::-webkit-details-marker { display: none; }
.user-pop { display: none; position: absolute; right: 0; top: 50px; z-index: 40; min-width: 240px; flex-direction: column; gap: 4px; padding: 14px;
  background: #fff; color: var(--ink); border-radius: 14px; box-shadow: var(--shadow-3); border: 1px solid var(--line); }
.user-menu[open] .user-pop { display: flex; }
.user-pop > div { padding: 0 6px 8px; border-bottom: 1px solid var(--line); margin-bottom: 4px; }
.menu-link { display: flex; align-items: center; gap: 9px; padding: 8px; border-radius: 8px; color: var(--ink); text-decoration: none; font-size: 14.5px; background: none; border: 0; width: 100%; cursor: pointer; text-align: left; }
.menu-link:hover { background: var(--purple-50); color: var(--purple-700); }
.main { flex: 1; }
.footer { text-align: center; color: var(--ink-3); font-size: 12.5px; padding: 18px 20px 26px; }

/* ─── Rendszergazdai elrendezés ─── */
.admin-shell { flex: 1; display: grid; grid-template-columns: 244px minmax(0, 1fr); min-height: 100vh; }
.sidebar { background: linear-gradient(180deg, #142a54, #1f3a6e 58%, #3d3a7c); color: #fff; padding: 18px 14px; display: flex; flex-direction: column; gap: 18px;
  position: sticky; top: 0; height: 100vh; overflow-y: auto; }
.sidebar .brand { padding: 0 4px; }
.side-nav { display: flex; flex-direction: column; gap: 3px; }
.side-nav a { display: flex; align-items: center; gap: 11px; padding: 10px 12px; border-radius: 10px; color: rgba(255, 255, 255, .8); text-decoration: none; font-weight: 500; font-size: 15px; }
.side-nav a:hover { background: rgba(255, 255, 255, .09); color: #fff; }
.side-nav a[aria-current=page] { background: rgba(255, 255, 255, .16); color: #fff; box-shadow: inset 3px 0 0 var(--orange); }
.side-nav .ico { width: 19px; height: 19px; }
.side-nav .nav-badge { margin-left: auto; }
.side-now { display: flex; flex-direction: column; gap: 5px; margin-top: auto; padding: 12px; border-radius: 12px; background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .12); color: #fff; text-decoration: none; font-size: 13px; }
.side-now:hover { background: rgba(255, 255, 255, .13); color: #fff; }
.side-now .k { display: flex; align-items: center; gap: 7px; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; opacity: .75; }
.side-account { display: flex; align-items: center; gap: 10px; padding-top: 12px; border-top: 1px solid rgba(255, 255, 255, .12); font-size: 13px; }
.side-account a, .side-account .link-btn { color: rgba(255, 255, 255, .78); }
.side-account a:hover, .side-account .link-btn:hover { color: #fff; }
.side-name { font-weight: 600; color: #fff !important; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.admin-main { padding: 26px 32px 48px; min-width: 0; width: 100%; max-width: 1320px; }

/* ─── Kezdőlap (tanár) ─── */
.hero { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(290px, 1fr); gap: 24px; align-items: center; position: relative; overflow: hidden;
  background: linear-gradient(120deg, #1f3a6e 0%, #3a3f86 55%, #8e3a8c 100%); border-radius: 22px; padding: 30px; color: #fff; box-shadow: var(--shadow-2); }
.hero::before { content: ""; position: absolute; right: -80px; top: -90px; width: 280px; height: 280px; border-radius: 50%; background: radial-gradient(circle, rgba(242, 194, 48, .38), transparent 68%); }
.hero::after { content: ""; position: absolute; left: 34%; bottom: -120px; width: 260px; height: 260px; border-radius: 50%; background: radial-gradient(circle, rgba(224, 138, 44, .28), transparent 70%); }
.hero > * { position: relative; z-index: 1; }
.hero h1 { color: #fff; font-size: 40px; margin: 4px 0 8px; line-height: 1.05; }
.hero-hello { opacity: .82; font-size: 15px; margin: 0; }
.hero-lead { opacity: .9; max-width: 46ch; margin: 0 0 20px; font-size: 16px; }
.kpi-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; }

.presence { background: #fff; color: var(--ink); border-radius: 16px; padding: 16px 18px; box-shadow: var(--shadow-2); display: flex; flex-direction: column; gap: 11px; }
.presence-top { display: flex; align-items: center; gap: 9px; font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-3); font-weight: 700; }
.presence-dot { width: 12px; height: 12px; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 4px color-mix(in srgb, var(--c) 22%, transparent); flex: none; display: inline-block; }
.presence-dot.sm { width: 9px; height: 9px; box-shadow: 0 0 0 3px color-mix(in srgb, var(--c) 30%, transparent); }
.presence-site .presence-dot { animation: pulse 2.2s infinite; }
.presence-now { font-family: var(--font-heading); font-size: 25px; font-weight: 700; line-height: 1.15; }
.presence-until { font-size: 16px; font-weight: 600; color: var(--ink-3); }
.presence-link { display: inline-flex; align-items: center; gap: 5px; font-weight: 600; text-decoration: none; }
.rng-list { display: flex; flex-wrap: wrap; gap: 6px; }
.rng { display: inline-flex; gap: 5px; align-items: center; font-size: 12.5px; padding: 3px 9px 3px 7px; border-radius: 7px; line-height: 1.3;
  background: color-mix(in srgb, var(--c) 13%, #fff); border-left: 3px solid var(--c); color: var(--ink); }
.rng b { font-weight: 700; font-variant-numeric: tabular-nums; }
.rng-busy { --c: #7b8598; background: repeating-linear-gradient(135deg, #eef0f4 0 6px, #e2e5ec 6px 12px); }
.rng.mine { box-shadow: inset 0 0 0 1.5px var(--c); }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--c) 50%, transparent); } 70% { box-shadow: 0 0 0 9px transparent; } 100% { box-shadow: 0 0 0 0 transparent; } }
@media (prefers-reduced-motion: reduce) { .presence-dot { animation: none !important; } html { scroll-behavior: auto; } }

.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; }
.stat-tile { display: flex; flex-direction: column; gap: 2px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 16px 18px;
  box-shadow: var(--shadow-1); color: inherit; text-decoration: none; transition: box-shadow .15s, transform .1s; }
a.stat-tile:hover { box-shadow: var(--shadow-2); transform: translateY(-1px); color: inherit; }
.stat-ico { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; color: #fff; margin-bottom: 10px; }
.stat-ico .ico { width: 21px; height: 21px; }
.stat-v { font-family: var(--font-heading); font-size: 34px; font-weight: 700; line-height: 1.05; }
.stat-k { font-weight: 600; font-size: 14px; }
.stat-hint { font-size: 12px; color: var(--ink-3); }

.tpl-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 9px; }
.tpl-btn { justify-content: flex-start; text-align: left; padding: 11px 13px; line-height: 1.25; height: 100%; font-size: 15px; }
.tpl-btn .ico { color: var(--purple); }
.tpl-btn:hover { border-color: var(--purple); background: var(--purple-50); }

.feedback-panel { background: linear-gradient(135deg, #e6f7ee, #f5fbf8); border: 1px solid #bfe6d0; border-radius: var(--radius); padding: 16px 18px; }
.feedback-panel h2 { font-size: 20px; margin: 0 0 4px; }

/* ─── Hibajegy-lista ─── */
.ticket-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 14px 16px 14px 20px; position: relative; overflow: hidden;
  background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-1); color: inherit; text-decoration: none; transition: box-shadow .15s, border-color .15s; }
.ticket-row::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: var(--stc, #c5ccd8); }
.ticket-row:hover { box-shadow: var(--shadow-2); border-color: #cdd4e1; color: inherit; }
.ticket-row .t-title { font-family: var(--font-heading); font-size: 18px; font-weight: 600; line-height: 1.2; }
.ticket-row .t-meta { font-size: 12.5px; margin-top: 4px; color: var(--ink-3); display: flex; align-items: center; gap: 4px; }
.ticket-row .t-meta .ico { width: 13px; height: 13px; }
.ticket-row.compact { padding: 11px 14px 11px 18px; }
.ticket-row.compact .t-title { font-size: 17px; }
.ticket-row .badges { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.filter-bar { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 16px; }
.seg { display: inline-flex; background: #fff; border: 1px solid var(--line-2); border-radius: 11px; padding: 3px; gap: 2px; }
.seg a { padding: 6px 13px; border-radius: 8px; font-size: 14px; font-weight: 500; color: var(--ink-2); text-decoration: none; white-space: nowrap; }
.seg a:hover { background: #f3f5fa; color: var(--ink); }
.seg a[aria-current] { background: var(--purple); color: #fff; }

/* ─── Részletek ─── */
.detail-grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 24px; margin-top: 20px; align-items: start; }
.detail-grid.admin { grid-template-columns: minmax(0, 1fr) 310px; }
.detail-head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 12px 0 4px; }
.detail-head h2, .detail-title { margin: 0; font-size: 32px; line-height: 1.1; }
.detail-meta { display: flex; gap: 14px; flex-wrap: wrap; color: var(--ink-3); font-size: 13.5px; margin-top: 6px; }
.detail-meta span { display: inline-flex; align-items: center; gap: 5px; }
.detail-meta .ico { width: 15px; height: 15px; }
.side-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-1); padding: 16px 18px; }
.side-card h6 { margin: 0 0 12px; }
.conv { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-1); padding: 18px; }
.msg { padding: 11px 14px; border-radius: 14px; border: 1px solid var(--line); background: #fbfcfe; box-shadow: none; max-width: 88%; }
.msg.from-admin { margin-left: auto; background: var(--purple-50); border-color: #ead0e9; }
.msg.from-note { background: #fff8e1; border: 1px dashed #e2bf52; }
.msg .card-kicker { text-transform: none; letter-spacing: 0; font-size: 12.5px; color: var(--ink-3); }
.msg .card-kicker > span:first-child { font-weight: 600; }
.msg-body { font-size: 15px; margin-top: 4px; white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.5; }
.msg-system { display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 12.5px; color: var(--ink-3); }
.msg-system > span { background: #eef1f6; border-radius: 999px; padding: 3px 12px; }
.msg-head { display: flex; align-items: center; gap: 8px; }
.msg-del { background: none; border: 0; cursor: pointer; color: var(--ink-3); font-size: 16px; line-height: 1; padding: 0 3px; border-radius: 4px; }
.msg-del:hover { color: #a3303d; background: #fdf0f2; }
.thumbs { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.thumbs a { display: block; border-radius: 8px; overflow: hidden; border: 1px solid var(--line); }
.thumbs img { width: 104px; height: 78px; object-fit: cover; }
.composer { margin-top: 16px; padding: 14px; border-radius: 14px; background: #f8f9fc; border: 1px solid var(--line); box-shadow: none; }
.composer-actions { display: flex; align-items: center; gap: 10px; margin-top: 10px; flex-wrap: wrap; }
.steps { display: flex; flex-direction: column; gap: 10px; }
.step { position: relative; display: flex; align-items: center; gap: 10px; font-size: 14px; }
.step-dot { width: 16px; height: 16px; border-radius: 50%; border: 2px solid var(--line-2); background: #fff; flex: none; position: relative; z-index: 1; }
.step + .step::before { content: ""; position: absolute; left: 7px; bottom: 50%; height: 26px; width: 2px; background: var(--line-2); }
.step.done .step-dot { background: var(--stc, var(--purple)); border-color: var(--stc, var(--purple)); }
.step.done + .step.done::before { background: var(--stc, var(--purple)); }
.step.current { font-weight: 700; }
.step.current .step-dot { box-shadow: 0 0 0 4px color-mix(in srgb, var(--stc, var(--purple)) 22%, transparent); }
.step.todo { color: var(--ink-3); }
.step-help { font-size: 12.5px; color: var(--ink-3); margin-top: 10px; padding: 9px 11px; background: #f6f7fb; border-radius: 9px; }
.queue-box { margin-top: 12px; padding: 10px 12px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; border-radius: 10px; background: var(--purple-50); border: 1px solid #ead0e9; box-shadow: none; }
.fact .k { font-size: 11.5px; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-3); font-weight: 600; }
.fact .v { font-size: 14.5px; }
.status-btn { display: flex; align-items: center; gap: 8px; text-align: left; cursor: pointer; padding: 8px 11px; font-size: 14px; background: #fff; color: var(--ink);
  border: 1px solid var(--line-2); border-radius: 9px; width: 100%; text-decoration: none; }
.status-btn::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--stc, #b3bccb); flex: none; }
.status-btn:hover { background: #f6f7fb; border-color: #c2cad8; color: var(--ink); }
.status-btn.on { background: var(--stbg, var(--purple-50)); border-color: var(--stc, var(--purple)); color: var(--stfg, var(--purple-700)); font-weight: 700; cursor: default; }
.join-panel { margin-top: 16px; padding: 16px 18px; background: linear-gradient(135deg, #eef4fe, #f7f9ff); border: 1px solid #c9daf8; border-radius: var(--radius); }
.similar-panel { background: linear-gradient(135deg, #fff6ea, #fffbf5); border: 1px solid #f3d6ae; }
.sim-item { padding: 12px 14px; background: #fff; }
.file-btn { position: relative; overflow: hidden; }
.file-btn input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; font-size: 0; }
.file-btn:focus-within { outline: 2px solid var(--purple); outline-offset: 2px; }
.file-names { font-size: 12.5px; color: var(--ink-3); }

/* ─── Új bejelentés ─── */
.form-step { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-1); padding: 18px 20px; }
.step-head { display: flex; align-items: center; gap: 11px; margin-bottom: 14px; }
.step-num { width: 30px; height: 30px; border-radius: 50%; background: var(--purple); color: #fff; font: 700 14px/1 var(--font-body); display: grid; place-items: center; flex: none; }
.step-head h2 { font-size: 21px; margin: 0; }
.step-head p { margin: 1px 0 0; font-size: 13px; color: var(--ink-3); }
.kb-panel { background: linear-gradient(135deg, #fff8ec, #fdf1e3); border: 1px solid #f1d3a8; border-radius: 12px; padding: 13px 15px; margin-top: 14px; }
.kb-head { display: flex; align-items: center; gap: 8px; color: #8a4b0c; font-weight: 600; flex-wrap: wrap; }
.kb-head .ico { color: var(--orange); }
.kb-item { background: #fff; border: 1px solid #f0dcc0; border-radius: 10px; margin-top: 8px; }
.kb-item summary { cursor: pointer; padding: 10px 12px; font-weight: 600; list-style: none; display: flex; gap: 8px; align-items: center; }
.kb-item summary::-webkit-details-marker { display: none; }
.kb-item summary::before { content: "›"; transition: transform .15s; font-size: 20px; line-height: 1; color: var(--orange-600); width: 10px; }
.kb-item[open] summary::before { transform: rotate(90deg); }
.kb-body { padding: 0 14px 12px 30px; font-size: 14.5px; white-space: pre-line; color: var(--ink-2); line-height: 1.55; }

/* ─── Naptár ─── */
.cal-toolbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.cal-title { font-family: var(--font-heading); font-size: 21px; font-weight: 700; min-width: 170px; text-align: center; }
.sched-wrap { overflow-x: auto; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-1); padding: 10px; }
.sched { display: grid; grid-template-columns: 58px repeat(5, minmax(108px, 1fr)); gap: 3px; min-width: 620px; }
.sh { font-size: 13px; font-weight: 600; color: var(--ink-2); padding: 7px 4px; text-align: center; background: none; border: 0; border-radius: 8px; font-family: inherit; }
.sh.day.today { background: var(--purple-50); color: var(--purple-700); }
.sh.hour { text-align: right; padding-right: 8px; color: var(--ink-3); font-weight: 500; font-variant-numeric: tabular-nums; }
button.sh { cursor: pointer; }
button.sh:hover { background: #eef1f6; color: var(--ink); }
.sc { min-height: 36px; border-radius: 7px; background: #f5f7fa; border: 1px dashed #dce1ea; position: relative; display: flex; align-items: center; padding: 0 8px; font-size: 12.5px; overflow: hidden; color: var(--t, #fff); }
.sc.site { background: var(--c); border: 1px solid var(--c); }
.sc.busy { background: repeating-linear-gradient(135deg, #8a94a6 0 7px, #7b8598 7px 14px); border: 1px solid #7b8598; color: #fff; }
.sc.cont { border-top-left-radius: 2px; border-top-right-radius: 2px; }
.sc .lbl { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sc.now { box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--ink); z-index: 1; }
.sched.edit .sc { cursor: crosshair; user-select: none; -webkit-user-select: none; touch-action: none; transition: filter .1s; }
.sched.edit .sc:hover { filter: brightness(1.07); }
.sched.edit .sc.off:hover { border-color: var(--purple); background: var(--purple-50); }
.sc select { display: none; }
html:not(.js) .sc select { display: block; width: 100%; font-size: 12px; border: 0; background: rgba(255, 255, 255, .85); color: var(--ink); border-radius: 4px; }
html:not(.js) .sc .lbl, html:not(.js) .brushes { display: none; }
.brushes { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 12px; padding: 12px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-1); }
.brush-title { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: 14px; margin-right: 4px; }
.brush { position: relative; display: inline-flex; align-items: center; gap: 8px; padding: 7px 13px 7px 8px; border: 1px solid var(--line-2); border-radius: 999px; background: #fff; cursor: pointer; font-size: 14px; font-weight: 500; }
.brush input { position: absolute; opacity: 0; width: 0; height: 0; }
.brush:hover { border-color: var(--ink-3); }
.brush:has(input:checked) { border-color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--ink); font-weight: 700; }
.brush:has(input:focus-visible) { outline: 2px solid var(--purple); outline-offset: 2px; }
.brush-sw { width: 20px; height: 20px; border-radius: 6px; background: var(--c); flex: none; }
.brush-sw.busy { background: repeating-linear-gradient(135deg, #8a94a6 0 4px, #7b8598 4px 8px); }
.brush-sw.off { background: #f5f7fa; border: 1px dashed #aab3c3; }
/* Bent van a telephelyen, de elfoglalt: a telephely színével csíkozva */
.sc.busy.sitebusy { background: repeating-linear-gradient(135deg, var(--c) 0 7px, color-mix(in srgb, var(--c) 62%, #fff) 7px 14px); border: 1px solid var(--c); color: var(--t, #fff); }
.brush-sw.sitebusy { background: repeating-linear-gradient(135deg, var(--c) 0 4px, color-mix(in srgb, var(--c) 55%, #fff) 4px 8px); }
.legend-row .sw.sitebusy { background: repeating-linear-gradient(135deg, var(--c) 0 3px, color-mix(in srgb, var(--c) 55%, #fff) 3px 6px); }
.rng-busy.rng-sitebusy { background: repeating-linear-gradient(135deg, color-mix(in srgb, var(--c) 16%, #fff) 0 6px, color-mix(in srgb, var(--c) 28%, #fff) 6px 12px); }
/* Súgó szerkesztő: gombsor, előnézet */
.md-toolbar { display: flex; flex-wrap: wrap; gap: 4px; padding: 5px; border: 1px solid var(--line-2); border-bottom: 0; border-radius: 10px 10px 0 0; background: #f6f7fb; }
.md-toolbar + textarea { border-top-left-radius: 0; border-top-right-radius: 0; }
.md-btn { min-height: 32px; padding: 4px 9px; border: 1px solid transparent; border-radius: 7px; background: transparent; color: var(--ink-2); font: 600 13px/1 var(--font-body, inherit); cursor: pointer; }
.md-btn:hover { background: #fff; border-color: var(--line-2); color: var(--ink); }
.md-toggle { margin-left: auto; color: var(--purple); }
.md-toggle[aria-pressed="true"] { background: var(--purple); color: #fff; }
.md-preview { border: 1px dashed var(--line-2); border-radius: 10px; padding: 12px 14px; background: #fff; font-size: 15px; }
.md-block-note { display: flex; gap: 8px; align-items: flex-start; padding: 8px 10px; border-radius: 9px; background: #fffaf0; color: #6b4a14; }
.md-block-note .ico { width: 16px; height: 16px; flex: none; margin-top: 2px; }
.md-block-note a { margin-right: 6px; }
.status-edit { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 8px; align-items: center; }
.status-edit > label:first-child { grid-column: 1 / -1; }
@media (max-width: 700px) { .status-edit { grid-template-columns: 1fr; } }
@media (pointer: coarse) { .md-btn { min-height: 42px; padding: 6px 12px; } }
.save-bar { position: sticky; bottom: 10px; display: flex; align-items: center; gap: 12px; padding: 11px 14px; margin-top: 12px; flex-wrap: wrap;
  background: rgba(255, 255, 255, .95); backdrop-filter: blur(6px); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-2); z-index: 5; }
.save-state { font-size: 13px; color: var(--ink-3); margin-right: auto; flex: 1 1 260px; }
.save-state.dirty { color: #9a500d; font-weight: 700; }
.legend-row { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; font-size: 12.5px; color: var(--ink-2); margin-top: 10px; }
.legend-row .sw { width: 14px; height: 14px; border-radius: 4px; display: inline-block; vertical-align: -2px; margin-right: 6px; background: var(--c); }
.legend-row .sw.busy { background: repeating-linear-gradient(135deg, #8a94a6 0 3px, #7b8598 3px 6px); }
.legend-row .sw.off { background: #f5f7fa; border: 1px dashed #aab3c3; }
.month-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 5px; }
.month-grid .mh { font-size: 12.5px; font-weight: 600; color: var(--ink-3); padding: 2px 6px; }
.month-cell { background: #fff; border: 1px solid var(--line); border-radius: 11px; min-height: 100px; padding: 7px 8px; display: flex; flex-direction: column; gap: 5px; color: inherit; text-decoration: none; }
.month-cell.out { opacity: .42; }
.month-cell.past { background: #fafbfd; }
.month-cell.is-today { border-color: var(--purple); box-shadow: 0 0 0 2px var(--purple-100); }
.month-cell .num { font-size: 13px; font-weight: 700; color: var(--ink-2); }
.month-cell .wd { display: none; }
.month-cell .entries { display: flex; flex-direction: column; gap: 3px; }
.month-cell .rng { font-size: 11.5px; padding: 2px 6px 2px 5px; white-space: normal; }
a.month-cell:hover { border-color: var(--purple); box-shadow: var(--shadow-1); color: inherit; }
.today-badge { background: var(--purple); color: #fff; border-radius: 999px; font-size: 10px; padding: 1px 7px; margin-left: 6px; text-transform: uppercase; letter-spacing: .04em; vertical-align: 1px; }
.week-summary { display: flex; flex-direction: column; gap: 8px; }
.week-summary .ws-day { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 10px; align-items: start; font-size: 13.5px; }
.week-summary .ws-day.today .ws-name { color: var(--purple-700); font-weight: 700; }

/* ─── Admin listák, táblák ─── */
.kanban { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; margin-top: 18px; align-items: start; }
.kanban-col { background: #eceff5; border-radius: 14px; padding: 10px; }
.kanban-head { display: flex; justify-content: space-between; align-items: center; padding: 2px 4px 10px; }
.kanban-head .tag { font-size: 13px; }
.table-wrap { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-1); overflow-x: auto; margin-top: 16px; }
.table { width: 100%; border-collapse: collapse; font-size: 14px; }
.table th { background: #f7f8fb; color: var(--ink-3); font-weight: 600; font-size: 11.5px; letter-spacing: .06em; text-transform: uppercase; padding: 11px 12px; border-bottom: 1px solid var(--line); text-align: left; white-space: nowrap; }
.table td { padding: 11px 12px; border-bottom: 1px solid #eef1f5; vertical-align: middle; }
.table tbody tr:last-child td { border-bottom: 0; }
.table tbody tr:hover { background: #fafbfd; }
.table tr.link-row { cursor: pointer; }
.table .t-title { font-family: var(--font-heading); font-size: 16.5px; font-weight: 600; }
.table a.row-link { color: inherit; text-decoration: none; }
.table a.row-link:hover { color: var(--purple); }
.status-cell { display: flex; align-items: center; gap: 8px; }
.status-cell::before { content: ""; width: 4px; align-self: stretch; border-radius: 2px; background: var(--stc); }
.search-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 4px; align-items: center; }
.search-box { position: relative; flex: 1 1 260px; max-width: 360px; }
.search-box .ico { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: var(--ink-3); }
.search-box .input { padding-left: 36px; }
.badge-unread { width: 9px; height: 9px; border-radius: 50%; background: var(--orange); display: inline-block; }
.bulk-bar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 14px; padding: 9px 12px; background: #fff; border: 1px dashed var(--line-2); border-radius: 12px; }
.list-row { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid #eef1f5; font-size: 14px; }
.inline-form { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; align-items: center; }
.inline-form .input { flex: 1 1 150px; width: auto; }
.dialog-backdrop { position: fixed; inset: 0; display: grid; place-items: center; padding: 16px; z-index: 50; background: rgba(20, 33, 66, .55); backdrop-filter: blur(2px); }
.dialog { width: min(460px, 100%); display: flex; flex-direction: column; gap: 12px; padding: 22px; border-radius: 18px; background: #fff; border: 0; box-shadow: var(--shadow-3); }
.dialog form { display: flex; flex-direction: column; gap: 12px; }
.dialog-title { font-family: var(--font-heading); font-size: 23px; font-weight: 700; }
.dialog-body { font-size: 14.5px; color: var(--ink-2); }
.dialog-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 6px; flex-wrap: wrap; }
.dialog-wide { width: min(640px, 100%); max-height: calc(100vh - 32px); overflow-y: auto; }

/* Beállítások */
.tabs { display: flex; gap: 4px; flex-wrap: wrap; margin: 0 0 20px; background: #fff; padding: 5px; border-radius: 12px; border: 1px solid var(--line); box-shadow: var(--shadow-1); }
.tabs a { padding: 8px 13px; border-radius: 9px; color: var(--ink-2); text-decoration: none; font-weight: 500; font-size: 14px; }
.tabs a:hover { background: #f3f5fa; color: var(--ink); }
.tabs a[aria-current=page] { background: var(--purple); color: #fff; }
.settings-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(440px, 1fr)); gap: 20px; align-items: start; }
.edit-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; padding: 9px 0; border-bottom: 1px solid #eef1f5; }
.edit-row:last-of-type { border-bottom: 0; }
.edit-row form { margin: 0; }
.edit-row .edit-main { display: flex; gap: 8px; align-items: center; flex: 1 1 300px; flex-wrap: wrap; }
.edit-row .edit-main .input { flex: 1 1 130px; width: auto; min-height: 34px; padding: 5px 9px; font-size: 14.5px; }
.edit-row .edit-main .sel { flex: 0 1 180px; }
.edit-row.is-inactive .edit-main .input:first-of-type { color: var(--ink-3); text-decoration: line-through; }
.kb-edit { padding: 14px 16px; margin-bottom: 12px; }
.kb-edit .kb-fields { display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 10px; }
.form-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 22px; align-items: start; max-width: 1100px; }
.code-block { display: block; font-family: ui-monospace, Consolas, monospace; font-size: 12.5px; background: #f4f6fa; border: 1px solid var(--line); border-radius: 9px; padding: 9px 11px; white-space: pre-wrap; overflow-wrap: anywhere; margin: 0; }
.mono { font-family: ui-monospace, Consolas, monospace; font-size: 13px; }
.help-list { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 4px; }
.pw { font-family: ui-monospace, Consolas, monospace; font-size: 14px; letter-spacing: .03em; background: var(--purple-50); color: var(--purple-700); padding: 3px 8px; border-radius: 6px; }
.danger-zone { border-color: #efc3c9; background: #fffafb; }

/* Statisztika */
.chart { width: 100%; }
.chart svg { width: 100%; height: auto; display: block; overflow: visible; }
.chart .grid { stroke: #e6e9f0; stroke-width: 1; }
.chart .base { stroke: #c3cad7; stroke-width: 1; }
.chart .axis { fill: #6f798c; font-size: 11px; font-family: var(--font-body); }
.chart .hit { fill: transparent; }
.chart .hit:hover, .chart .hit:focus { fill: rgba(28, 36, 51, .045); outline: none; }
.legend-inline { display: flex; gap: 16px; flex-wrap: wrap; font-size: 13px; color: var(--ink-2); }
.legend-inline i { width: 12px; height: 12px; border-radius: 3px; display: inline-block; margin-right: 6px; vertical-align: -1px; background: var(--c); }
.hbars { display: flex; flex-direction: column; gap: 10px; }
.hbar { display: grid; grid-template-columns: minmax(90px, 40%) minmax(0, 1fr) auto; gap: 10px; align-items: center; font-size: 13.5px; }
.hb-label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--ink-2); }
.hb-track { height: 12px; background: #eff1f6; border-radius: 0 4px 4px 0; }
.hb-fill { display: block; height: 100%; background: var(--c, var(--purple)); border-radius: 0 4px 4px 0; min-width: 3px; }
.hb-val { font-weight: 600; font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.viz-tip { position: fixed; z-index: 100; pointer-events: none; background: #1c2433; color: #fff; font-size: 12.5px; padding: 7px 10px; border-radius: 8px; box-shadow: var(--shadow-3); max-width: 280px; white-space: pre-line; }
details.table-view summary { cursor: pointer; font-size: 13px; color: var(--purple); margin-top: 10px; }

/* Súgó */
.help-grid { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 24px; align-items: start; }
.toc { position: sticky; top: 90px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 10px; box-shadow: var(--shadow-1); }
.app-admin .toc { top: 20px; }
.toc a { display: block; padding: 6px 10px; border-radius: 8px; color: var(--ink-2); text-decoration: none; font-size: 14px; }
.toc a:hover { background: #f3f5fa; color: var(--purple); }
.toc .toc-h { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-3); padding: 10px 10px 4px; font-weight: 700; }
.help-sec { scroll-margin-top: 90px; margin-bottom: 16px; }
.help-sec h2 { font-size: 24px; display: flex; gap: 10px; align-items: center; margin: 0 0 10px; }
.help-sec h3 { font-size: 18px; margin: 14px 0 6px; }
.help-sec p, .help-sec li { line-height: 1.6; font-size: 15px; color: var(--ink-2); }
.help-sec ol, .help-sec ul { padding-left: 22px; margin: 0 0 10px; }
.tip { background: var(--purple-50); border-left: 4px solid var(--purple); border-radius: 8px; padding: 10px 13px; font-size: 14px; color: var(--ink-2); margin: 10px 0; }
.status-legend { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px 14px; align-items: center; font-size: 14px; }

/* Belépés */
.auth-split { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(380px, .9fr); }
.auth-side { position: relative; overflow: hidden; background: linear-gradient(140deg, #142a54, #1f3a6e 45%, #6b3a88 85%, #8e3a8c); color: #fff; padding: 56px; display: flex; flex-direction: column; justify-content: center; gap: 20px; }
.auth-side::before { content: ""; position: absolute; width: 420px; height: 420px; right: -140px; top: -140px; border-radius: 50%; background: radial-gradient(circle, rgba(242, 194, 48, .35), transparent 65%); }
.auth-side::after { content: ""; position: absolute; width: 360px; height: 360px; left: -120px; bottom: -160px; border-radius: 50%; background: radial-gradient(circle, rgba(224, 138, 44, .3), transparent 65%); }
.auth-side > * { position: relative; z-index: 1; }
.auth-logo { width: 96px; height: 96px; background: #fff; border-radius: 24px; padding: 12px; box-shadow: var(--shadow-2); }
.auth-title { font-size: 52px; color: #fff; line-height: 1.02; max-width: 13ch; margin: 0; }
.auth-lead { color: rgba(255, 255, 255, .86); font-size: 17px; max-width: 44ch; margin: 0; line-height: 1.55; }
.auth-points { list-style: none; padding: 0; margin: 4px 0 0; display: flex; flex-direction: column; gap: 9px; font-size: 15px; }
.auth-points li { display: flex; gap: 10px; align-items: center; }
.auth-points .ico { width: 26px; height: 26px; padding: 5px; border-radius: 8px; background: rgba(255, 255, 255, .14); stroke-width: 2; }
.auth-now { background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .22); border-radius: 13px; padding: 12px 15px; display: flex; gap: 11px; align-items: center; max-width: 480px; }
.auth-form-side { display: grid; place-items: center; padding: 32px 22px; }
.auth-box { width: 100%; max-width: 410px; padding: 32px; border-radius: 20px; background: #fff; box-shadow: var(--shadow-2); border: 1px solid var(--line); }
.auth-box h2 { font-size: 30px; margin: 0 0 4px; }
.login-wrap { flex: 1; min-height: 100vh; display: grid; place-items: center; padding: 40px 20px; }
.login-box { padding: 28px; background: #fff; border-radius: 18px; }
.login-box h6 { margin: 0 0 16px; }

/* ─── Mobil ─── */
@media (max-width: 980px) {
  .topbar-inner { flex-wrap: wrap; gap: 10px; padding: 8px 14px; }
  .topnav { order: 3; width: 100%; overflow-x: auto; padding-bottom: 2px; }
  .brand-sub { max-width: 160px; }
  .admin-shell { grid-template-columns: minmax(0, 1fr); }
  .sidebar { position: static; height: auto; flex-direction: row; flex-wrap: wrap; align-items: center; padding: 10px 12px; gap: 10px; }
  .side-nav { flex-direction: row; overflow-x: auto; width: 100%; order: 3; }
  .side-nav a { white-space: nowrap; padding: 8px 10px; }
  .side-nav a[aria-current=page] { box-shadow: inset 0 -3px 0 var(--orange); }
  .side-now { display: none; }
  .side-account { border: 0; padding: 0; margin-left: auto; }
  .admin-main { padding: 18px 14px 40px; }
  .detail-grid, .detail-grid.admin, .form-layout, .help-grid { grid-template-columns: minmax(0, 1fr); }
  .toc { position: static; }
  .settings-grid { grid-template-columns: minmax(0, 1fr); }
  .auth-split { grid-template-columns: 1fr; }
  .auth-side { padding: 30px 22px; }
  .auth-title { font-size: 36px; }
}
@media (max-width: 700px) {
  .page { padding: 16px 12px 36px; }
  .btn-cta span { display: none; }
  .btn-cta { width: 42px; padding: 0; }
  .hero { grid-template-columns: 1fr; padding: 20px; border-radius: 18px; }
  .hero h1 { font-size: 30px; }
  .ph-text h1 { font-size: 25px; }
  .ph-actions { margin-left: 0; width: 100%; }
  .msg, .msg.from-admin { max-width: 100%; }
  .ticket-row { grid-template-columns: minmax(0, 1fr); }
  .ticket-row .badges { justify-content: flex-start; }
  .month-grid { grid-template-columns: minmax(0, 1fr); }
  .month-grid .mh, .month-cell.out, .month-cell.empty { display: none; }
  .month-cell { min-height: 0; flex-direction: row; align-items: flex-start; gap: 12px; }
  .month-cell .num { flex: 0 0 122px; }
  .month-cell .wd { display: inline; }
  .kb-edit .kb-fields { grid-template-columns: 1fr; }
  .hbar { grid-template-columns: minmax(0, 1fr) auto; }
  .hbar .hb-track { grid-column: 1 / -1; grid-row: 2; }
}
/* ═══ v4: betűtípus-finomhangolás, eszközök, PWA, mobil ═══ */
h1, h2, h3, h4, h5 { letter-spacing: -.02em; }
.ph-text h1, .detail-title, .hero h1 { letter-spacing: -.025em; }
.btn { font-weight: 600; letter-spacing: 0; font-size: 14.5px; }
.stat-v, .presence-now, .cal-title { letter-spacing: -.02em; }
.tag { letter-spacing: 0; }

.dev-ok { background: #e2f5eb; color: #136b42; }
.dev-faulty { background: #fdecee; color: #a3303d; }
.dev-repair { background: #f5e8f4; color: #6c2a6a; }
.dev-spare { background: #e8f0fd; color: #1d4fa3; }
.dev-retired { background: #eef0f4; color: #6b7486; }
.device-chips { margin-bottom: 8px; }
.device-chip { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line-2); background: #fff; border-radius: 999px; padding: 8px 14px; font-size: 14px; font-weight: 500; cursor: pointer; color: var(--ink); }
.device-chip:hover { border-color: var(--purple); background: var(--purple-50); }
.device-chip[aria-pressed=true] { background: var(--purple); border-color: var(--purple); color: #fff; }
.device-card { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 11px; background: #fafbfd; color: inherit; text-decoration: none; }
.device-card:hover { border-color: var(--purple); color: inherit; }
.device-card > span:first-of-type { display: flex; flex-direction: column; min-width: 0; }
.hist-item { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; padding: 9px 0; border-bottom: 1px solid #eef1f5; color: inherit; text-decoration: none; font-size: 14px; }
.hist-item:last-of-type { border-bottom: 0; }
.hist-item:hover .hist-title { color: var(--purple); }
.hist-title { font-weight: 600; flex: 1 1 140px; }

.install-card { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 14px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-1); }
.side-install { display: flex; align-items: center; gap: 9px; padding: 9px 12px; border-radius: 10px; background: rgba(255, 255, 255, .1); border: 1px dashed rgba(255, 255, 255, .35); color: #fff; font-size: 14px; font-weight: 600; cursor: pointer; }
.side-install:hover { background: rgba(255, 255, 255, .18); }

.bottom-nav, .admin-mtop, .day-tabs { display: none; }
.bottom-nav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 2px;
  background: rgba(255, 255, 255, .97); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-top: 1px solid var(--line);
  box-shadow: 0 -4px 18px rgba(20, 33, 66, .08); padding: 5px 6px calc(5px + env(safe-area-inset-bottom)); }
.bottom-nav > a, .bottom-nav summary { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-height: 54px; padding: 4px 2px;
  border-radius: 12px; color: var(--ink-3); text-decoration: none; font-size: 11px; font-weight: 600; position: relative; cursor: pointer; list-style: none; -webkit-tap-highlight-color: transparent; }
.bottom-nav summary::-webkit-details-marker { display: none; }
.bottom-nav .ico { width: 24px; height: 24px; }
.bottom-nav > a[aria-current=page], .bottom-nav summary.is-current, .bottom-nav details[open] summary { color: var(--purple); }
.bottom-nav > a[aria-current=page] .ico, .bottom-nav summary.is-current .ico { stroke-width: 2.3; }
.bottom-nav > a[aria-current=page]::after, .bottom-nav summary.is-current::after { content: ""; position: absolute; top: 0; width: 22px; height: 3px; border-radius: 0 0 3px 3px; background: var(--purple); }
.bottom-nav .nav-badge { position: absolute; top: 3px; left: calc(50% + 5px); }
.bottom-nav .bn-cta { color: var(--ink-2); }
.bottom-nav .bn-cta::after { display: none; }
.bn-plus { width: 48px; height: 48px; border-radius: 16px; background: linear-gradient(135deg, #e08a2c, #f0a54a); color: #fff; display: grid; place-items: center;
  margin-top: -24px; box-shadow: 0 6px 16px rgba(224, 138, 44, .45); border: 3px solid #fff; }
.bn-plus .ico { width: 26px; height: 26px; stroke-width: 2.4; }
.bn-more { position: static; display: flex; flex-direction: column; }
.bn-sheet { position: fixed; left: 10px; right: 10px; bottom: calc(76px + env(safe-area-inset-bottom)); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px;
  padding: 10px; background: #fff; border-radius: 20px; border: 1px solid var(--line); box-shadow: var(--shadow-3); }
.bn-sheet a { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 14px 4px; border-radius: 14px; font-size: 13px; font-weight: 600; color: var(--ink-2); text-decoration: none; text-align: center; }
.bn-sheet a .ico { width: 24px; height: 24px; color: var(--purple); }
.bn-sheet a:hover, .bn-sheet a[aria-current=page] { background: var(--purple-50); color: var(--purple-700); }
.day-tab { flex: 1 0 auto; border: 1px solid var(--line-2); background: #fff; border-radius: 999px; padding: 9px 14px; font-weight: 700; font-size: 14px; cursor: pointer; color: var(--ink-2); font-family: inherit; }
.day-tab[aria-selected=true] { background: var(--purple); border-color: var(--purple); color: #fff; }

/* Kártyás táblázatok mobilon */
@media (max-width: 760px) {
  .table-wrap:has(.table-cards) { background: transparent; border: 0; box-shadow: none; overflow: visible; }
  .table-cards thead { display: none; }
  .table-cards, .table-cards tbody, .table-cards tr, .table-cards td { display: block; width: 100%; }
  .table-cards tr { position: relative; background: #fff; border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-1); padding: 12px 14px; margin-bottom: 10px; }
  .table-cards tbody tr:hover { background: #fff; }
  .table-cards td { border: 0; padding: 3px 0; }
  .table-cards td[data-label] { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 8px; align-items: baseline; font-size: 14px; }
  .table-cards td[data-label]::before { content: attr(data-label); font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-3); font-weight: 700; }
  .table-cards td.td-main { padding-bottom: 8px; margin-bottom: 4px; border-bottom: 1px solid #eef1f5; padding-right: 30px; }
  .table-cards td.td-check { position: absolute; top: 14px; right: 14px; width: auto; padding: 0; }
  .table-cards td.td-check input { width: 22px; height: 22px; }
  .table-cards .status-cell::before { display: none; }
  .table-cards tr.link-row[class*=" st-"] { border-left: 5px solid var(--stc); }
}

/* Tanári mobil */
@media (max-width: 760px) {
  .app-teacher { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
  .app-teacher .bottom-nav { display: grid; }
  .app-teacher .topnav, .app-teacher .topbar .btn-cta, .app-teacher .footer { display: none; }
  .app-teacher .topbar-inner { flex-wrap: nowrap; padding: 8px 12px calc(8px); padding-top: calc(8px + env(safe-area-inset-top)); }
  .app-teacher .save-bar { bottom: calc(84px + env(safe-area-inset-bottom)); }
  .brand-logo { width: 36px; height: 36px; border-radius: 10px; }
  .brand-logo img { width: 26px; }
  .brand-sub { display: none; }
  .avatar { width: 38px; height: 38px; }
  .user-pop { position: fixed; left: 10px; right: 10px; top: auto; bottom: calc(84px + env(safe-area-inset-bottom)); min-width: 0; }
}

/* Rendszergazdai mobil */
@media (max-width: 900px) {
  .app-admin { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
  .app-admin .sidebar { display: none; }
  .app-admin .admin-shell { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .app-admin .bottom-nav { display: grid; }
  .app-admin .save-bar { bottom: calc(84px + env(safe-area-inset-bottom)); }
  .admin-mtop { display: flex; align-items: center; gap: 10px; position: sticky; top: 0; z-index: 30; padding: 8px 12px; padding-top: calc(8px + env(safe-area-inset-top));
    background: linear-gradient(100deg, #142a54, #1f3a6e 60%, #3d3a7c); color: #fff; box-shadow: 0 2px 12px rgba(20, 33, 66, .18); }
  .admin-mtop .brand { flex: none; }
  .mtop-now { margin-left: auto; display: inline-flex; align-items: center; gap: 7px; font-size: 12px; color: rgba(255, 255, 255, .85); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
  .admin-main { padding: 16px 12px 32px; }
}

/* Általános mobil finomítás */
@media (max-width: 700px) {
  .input, textarea.input, select.input { font-size: 16px; }
  .btn { min-height: 42px; }
  .btn-sm { min-height: 34px; }
  .page { padding: 14px 12px 28px; }
  .page-head { gap: 10px; margin-bottom: 16px; }
  .ph-icon { width: 40px; height: 40px; border-radius: 12px; }
  .ph-icon .ico { width: 21px; height: 21px; }
  .ph-text h1 { font-size: 24px; }
  .ph-text p { font-size: 13px; }
  .ph-actions { width: 100%; margin-left: 0; flex-wrap: nowrap; overflow-x: auto; padding-bottom: 3px; scrollbar-width: none; }
  .ph-actions > * { flex: none; }
  .filter-bar { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; }
  .filter-bar > * { flex: none; }
  .filter-bar .search-box { flex: 0 0 230px; }
  .seg a { padding: 7px 12px; }
  .tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .tabs a { white-space: nowrap; }
  .hero { padding: 18px; gap: 16px; }
  .hero h1 { font-size: 27px; }
  .hero-lead { font-size: 14.5px; margin-bottom: 14px; }
  .hero .row .btn { flex: 1 1 auto; }
  .presence-now { font-size: 21px; }
  .kpi-row { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .kpi-row .stat-tile { padding: 10px; }
  .kpi-row .stat-ico { width: 30px; height: 30px; border-radius: 9px; margin-bottom: 6px; }
  .kpi-row .stat-ico .ico { width: 17px; height: 17px; }
  .kpi-row .stat-v { font-size: 24px; }
  .kpi-row .stat-k { font-size: 12px; line-height: 1.25; }
  .kpi-row .stat-hint { display: none; }
  .stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .stat-tile { padding: 12px; }
  .stat-v { font-size: 26px; }
  .panel { padding: 14px; }
  .panel-head h2 { font-size: 18px; }
  .grid-2 { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .tpl-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .form-step { padding: 14px; }
  .step-head h2 { font-size: 19px; }
  .detail-title, .detail-head h2 { font-size: 24px; }
  .detail-head .row.ml-auto { margin-left: 0; width: 100%; }
  .detail-head .row.ml-auto > * { flex: 1 1 auto; }
  .detail-head .row.ml-auto .btn { width: 100%; }
  .conv { padding: 12px; }
  .msg { padding: 10px 12px; }
  .kanban { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 84%; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 6px; }
  .kanban-col { scroll-snap-align: start; }
  .cal-toolbar .row.ml-auto { margin-left: 0; width: 100%; overflow-x: auto; flex-wrap: nowrap; }
  .cal-toolbar .row.ml-auto > * { flex: none; }
  .day-tabs { display: flex; gap: 6px; overflow-x: auto; margin-bottom: 10px; padding-bottom: 2px; }
  .sched-wrap { overflow-x: visible; padding: 8px; }
  .sched.one-day { grid-template-columns: 54px minmax(0, 1fr); min-width: 0; }
  .sched.one-day [data-col]:not(.col-on) { display: none; }
  .sched.one-day .sc { min-height: 44px; font-size: 14px; }
  .brushes { flex-wrap: nowrap; overflow-x: auto; }
  .brush { flex: none; }
  .brush-title { flex: none; }
  .save-bar { gap: 8px; }
  .save-state { flex-basis: 100%; font-size: 12.5px; }
  .save-bar .btn { flex: 1 1 auto; }
  .bulk-bar { flex-wrap: nowrap; overflow-x: auto; }
  .bulk-bar > * { flex: none; }
  .edit-row .edit-main { flex-basis: 100%; }
  .dialog { padding: 18px; border-radius: 18px 18px 0 0; align-self: end; width: 100%; }
  .dialog-backdrop { padding: 0; place-items: end center; }
  .auth-box { padding: 22px; }
  .help-sec h2 { font-size: 20px; }
}

/* Kétoszlopos elrendezések (mobilon egy oszlop) */
.split-layout { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(300px, 1fr); gap: 22px; align-items: start; }
.split-wide { grid-template-columns: minmax(0, 2.2fr) minmax(260px, 1fr); }
.ph-text { flex: 1 1 220px; min-width: 0; }
.cal-toolbar .cal-title { flex: 0 1 auto; min-width: 0; }
@media (max-width: 900px) {
  .split-layout, .split-wide { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .split-wide > .presence { order: -1; }
}
@media (max-width: 700px) {
  .hero .row .btn { white-space: nowrap; }
  .cal-toolbar .cal-title { flex: 1 1 auto; font-size: 17px; }
  .ph-icon { align-self: flex-start; }
}

/* ═══ v5: közlemény, előnézet, szerkeszthető súgó ═══ */
.notice-wrap { max-width: 1180px; margin: 0 auto; padding: 16px 20px 0; }
.notice-wrap.inline, .app-admin .notice-wrap { max-width: none; padding: 0; margin: 0 0 16px; }
.notice { display: flex; gap: 12px; align-items: flex-start; padding: 13px 14px; border-radius: 14px; border: 1px solid; box-shadow: var(--shadow-1); }
.notice-info { background: linear-gradient(135deg, #eef4fe, #f7faff); border-color: #c9daf8; color: #1d3f7a; }
.notice-warning { background: linear-gradient(135deg, #fff3e2, #fffaf3); border-color: #f3d2a6; color: #7a4308; }
.notice-success { background: linear-gradient(135deg, #e6f7ee, #f5fbf8); border-color: #bfe6d0; color: #135c3b; }
.notice-ico { width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; flex: none; background: rgba(255, 255, 255, .75); }
.notice-text { flex: 1; min-width: 0; font-size: 14.5px; line-height: 1.5; }
.notice-text strong { display: block; font-size: 15.5px; }
.notice-text .md p, .notice-text .md ul { margin: 2px 0 0; }
.notice-x { background: none; border: 0; cursor: pointer; color: inherit; opacity: .6; padding: 5px; border-radius: 8px; }
.notice-x:hover { opacity: 1; background: rgba(255, 255, 255, .7); }
.preview-bar { display: flex; align-items: center; justify-content: center; gap: 10px; flex-wrap: wrap; padding: 8px 14px; text-align: center; font-size: 14px; color: #fff;
  background: repeating-linear-gradient(135deg, #d97f22 0 16px, #e08a2c 16px 32px); }
.preview-bar .btn { min-height: 32px; }
.preview-card { border-color: #f1d3a8; background: linear-gradient(135deg, #fff8ec, #fff); }
.help-sec h2 { flex-wrap: wrap; }
.help-edit { margin-left: auto; display: inline-flex; align-items: center; gap: 5px; font: 600 13px/1 var(--font-body); letter-spacing: 0; text-decoration: none; padding: 6px 9px; border-radius: 8px; }
.help-edit:hover { background: var(--purple-50); }
.help-edit .ico { width: 15px; height: 15px; }
.help-ico { width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; flex: none; color: #fff; background: linear-gradient(135deg, #2f6fd6, #4f8ae6); }
.help-ico .ico { width: 19px; height: 19px; }
.md > :last-child { margin-bottom: 0; }
.md p { margin: 0 0 10px; }
.md h3 { font-size: 18px; margin: 14px 0 6px; }
.md ul, .md ol { padding-left: 22px; margin: 0 0 10px; }
.md li { margin: 4px 0; }
.md .code-block, .md .status-legend, .md .legend-row { margin-bottom: 10px; }
.kb-body.md { white-space: normal; }
.help-edit-head { display: flex; align-items: center; gap: 10px; }
.help-edit-head .input { font-weight: 700; font-size: 17px; }
@media (max-width: 700px) {
  .notice-wrap { padding: 12px 12px 0; }
  .help-edit { margin-left: 0; }
}

/* ═══ v6: terem nélküli hiba, kiadott eszköz, push értesítés, válaszsablon ═══ */
.chip-none span { display: inline-flex; align-items: center; gap: 7px; }
.chip-none .ico { width: 16px; height: 16px; flex: none; }
.tag-stale { background: #fdf0dc; color: #8a4a06; }
.tag-stale .ico { width: 13px; height: 13px; }
.holder { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; font-weight: 600; color: var(--purple); }
.holder .ico { width: 14px; height: 14px; }
.push-controls { display: grid; gap: 10px; }
.push-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.push-note { display: flex; gap: 10px; align-items: flex-start; padding: 11px 13px; border-radius: 12px; border: 1px solid #f3d9b4;
  background: #fff6e8; color: #6b3f0a; font-size: 14px; line-height: 1.5; }
.push-note.is-ok { background: #e9f7ef; border-color: #c3e6d1; color: #155c3a; }
.push-note .ico { width: 18px; height: 18px; flex: none; margin-top: 2px; }
.push-msg { color: #155c3a; font-weight: 600; }
.push-msg.is-error { color: #a3361b; }
.push-prefs { padding-top: 14px; border-top: 1px solid var(--line); }
.push-prompt { border-color: #f3d2a6; background: linear-gradient(135deg, #fff6ea, #fff); }
.reply-tpl { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.reply-tpl .sel { width: auto; min-width: 230px; max-width: 100%; }
@media (max-width: 700px) {
  .reply-tpl .sel { flex: 1 1 100%; }
}

/* ═══ v7: lapozás, eszközkereső, érintőképernyő ═══ */
.list-count { font-size: 13px; color: var(--ink-3); margin: 0 0 8px; }
.pager { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; justify-content: center; margin: 16px 0 4px; }
.pager a, .pager span { display: inline-flex; align-items: center; justify-content: center; min-width: 38px; min-height: 38px; padding: 0 10px;
  border-radius: 9px; border: 1px solid var(--line-2); background: #fff; color: var(--ink-2); text-decoration: none; font-weight: 600; font-size: 14px; }
.pager a:hover { border-color: var(--purple); color: var(--purple); }
.pager .on { background: var(--purple); border-color: var(--purple); color: #fff; }
.pager .gap { border: 0; background: none; min-width: 18px; padding: 0; }
.pager .ico { width: 16px; height: 16px; }
.side-search { margin: 2px 0 10px; }
.side-search form { position: relative; }
.side-search .ico { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; color: rgba(255, 255, 255, .6); pointer-events: none; }
.side-search .input { min-height: 38px; padding: 7px 10px 7px 32px; border-radius: 10px; border: 1px solid rgba(255, 255, 255, .18); background: rgba(255, 255, 255, .08); color: #fff; font-size: 14px; }
.side-search .input::placeholder { color: rgba(255, 255, 255, .55); }
.side-search .input:focus { border-color: rgba(255, 255, 255, .55); background: rgba(255, 255, 255, .14); box-shadow: none; }
.mtop-search > summary { list-style: none; cursor: pointer; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 10px; color: #fff; }
.mtop-search > summary::-webkit-details-marker { display: none; }
.mtop-search > summary .ico { width: 21px; height: 21px; }
.mtop-search[open] > summary { background: rgba(255, 255, 255, .14); }
.mtop-search form { position: absolute; left: 0; right: 0; top: 100%; display: flex; gap: 8px; align-items: center; padding: 10px 12px; background: #1f3a6e; box-shadow: 0 10px 20px rgba(15, 30, 60, .25); }
.mtop-search form > .ico { display: none; }
.mtop-search form .input { flex: 1; min-width: 0; }
@media (max-width: 700px) {
  .filter-bar .sel { flex: 1 1 calc(50% - 4px); min-width: 0; }
  .filter-bar .search-box { flex-basis: 100%; max-width: none; }
}
/* ═══ v8: kereső javaslatok, PDF csatolmány, leltárellenőrzés, elavult eszközök ═══ */
.suggest { position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 80; margin: 0; padding: 6px; list-style: none; background: #fff; color: var(--ink);
  border: 1px solid var(--line-2); border-radius: 12px; box-shadow: 0 14px 30px rgba(15, 30, 60, .2); max-height: 62vh; overflow: auto; }
.side-search .suggest { right: auto; width: 360px; max-width: calc(100vw - 32px); }
.mtop-search .suggest { left: 12px; right: 12px; }
.suggest-item a { display: flex; gap: 10px; align-items: center; padding: 8px 9px; border-radius: 9px; color: var(--ink); text-decoration: none; }
.suggest-item.on a, .suggest-item a:hover { background: var(--purple-50); }
.suggest-kind { flex: none; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--purple); background: var(--purple-50); border-radius: 6px; padding: 2px 6px; }
.suggest-text { display: flex; flex-direction: column; min-width: 0; }
.suggest-text strong, .suggest-sub { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.suggest-text strong { font-size: 14px; }
.suggest-sub { font-size: 12px; color: var(--ink-3); }
.suggest-empty { padding: 10px; font-size: 13px; color: var(--ink-3); }
.file-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.file-chip { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; padding: 8px 12px; border: 1px solid var(--line-2); border-radius: 10px; background: #fff; color: var(--ink); text-decoration: none; font-size: 14px; }
.file-chip:hover { border-color: var(--purple); }
.file-chip .ico { width: 16px; height: 16px; color: var(--purple); flex: none; }
.fc-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 240px; font-weight: 600; }
.paste-hint { flex-basis: 100%; }
.check-toolbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.check-dev { display: flex; gap: 12px; align-items: center; padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; background: #fff; cursor: pointer; }
.check-dev input { width: 22px; height: 22px; flex: none; accent-color: #13a38a; }
.check-dev:has(input:checked) { border-color: #9fd6bc; background: #f1faf5; }
.cd-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.age-bar { display: inline-block; width: 70px; height: 8px; border-radius: 99px; background: #eef0f4; vertical-align: middle; overflow: hidden; }
.age-bar span { display: block; width: var(--p); height: 100%; background: #e08a2c; border-radius: 99px; }
html:not(.js) .js-only { display: none !important; }
/* Fiókigénylés */
.hp-field { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.req-card { border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; background: #fff; }
.req-note { margin: 0 0 12px; padding: 8px 12px; background: #f6f7fb; border-radius: 8px; }
.req-form { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.4fr) minmax(0, 1fr) auto; gap: 8px; align-items: center; }
@media (max-width: 900px) { .req-form { grid-template-columns: 1fr; } }
/* Érintőképernyő: legalább ~44 px-es érintési felületek, 16 px-es mezők (iOS nem nagyít rá) */
@media (pointer: coarse) {
  .btn { min-height: 44px; }
  .btn-sm { min-height: 40px; padding: 6px 12px; }
  .chip span { min-height: 44px; padding: 10px 16px; }
  .status-btn { min-height: 44px; }
  .input { min-height: 46px; font-size: 16px; }
  .sc { min-height: 44px; }
  .day-tab { min-height: 44px; }
  .tabs a { padding: 11px 14px; }
  .check-row { padding: 5px 0; }
  .check-row input { width: 20px; height: 20px; flex: none; margin-top: 0; }
  .link-btn { padding: 8px 0; }
  .notice-x { padding: 11px; }
  .pager a, .pager span { min-width: 44px; min-height: 44px; }
  .bn-sheet a { min-height: 64px; }
  .edit-row .btn-sm { min-width: 42px; }
  .table-cards a { padding-block: 2px; }
}

/* ─── v11: naptári napok, súgó kereső, „ez újra előfordult” ─── */
.off-chip { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 700; line-height: 1.3; padding: 3px 8px; border-radius: 999px;
  background: color-mix(in srgb, var(--c) 16%, #fff); color: color-mix(in srgb, var(--c) 78%, #000); border: 1px solid color-mix(in srgb, var(--c) 34%, #fff); }
.month-cell.is-off { background: repeating-linear-gradient(135deg, #fbfcfe 0 7px, #f4f6fa 7px 14px); }
.off-flag { display: block; font-size: 10.5px; font-weight: 700; line-height: 1.2; margin-top: 2px; padding: 1px 5px; border-radius: 5px; overflow: hidden; text-overflow: ellipsis;
  background: color-mix(in srgb, var(--c) 18%, #fff); color: color-mix(in srgb, var(--c) 80%, #000); }
.sh.day.is-off { background: #f4f6fa; }
.off-note { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }

.offday-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; align-items: end; background: var(--page); border: 1px solid var(--line); border-radius: 12px; padding: 14px; }
.offday-form .field { margin: 0; }
.offday-form .field-wide { grid-column: span 2; }
.offday-form .field-btn { display: flex; align-items: flex-end; }
@media (max-width: 700px) { .offday-form { grid-template-columns: 1fr; } .offday-form .field-wide { grid-column: span 1; } }
.offday-list { display: flex; flex-direction: column; gap: 8px; }
.offday { display: flex; gap: 10px; align-items: center; border: 1px solid var(--line); border-left: 4px solid var(--c); border-radius: 10px; padding: 9px 12px; background: #fff; }
.offday-main { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; flex: 1 1 auto; min-width: 0; }
.offday.past { opacity: .65; }
.offday form { display: flex; }

.help-search { position: relative; display: flex; align-items: center; gap: 8px; margin: 0 0 16px; max-width: 520px; }
.help-search .input { padding-left: 38px; }
.help-search-ico { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--ink-3, #8a94a6); display: flex; pointer-events: none; }
.help-search-ico svg { width: 18px; height: 18px; }
.help-search-info { margin: -8px 0 14px; }

.again-panel { display: flex; gap: 12px; align-items: flex-start; background: #fff7ef; border: 1px solid #f2d7b8; border-radius: 12px; padding: 13px 15px; margin-bottom: 18px; }
.again-box { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; margin-top: 14px; padding: 13px 15px; background: var(--page); border: 1px solid var(--line); border-radius: 12px; }

@media print {
  .topbar, .sidebar, .composer, .btn, .footer { display: none !important; }
}