/* caveat-latin-ext-wght-normal */
@font-face {
  font-family: 'Caveat Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 400 700;
  src: url(fonts/caveat-latin-ext-wght-normal.woff2) format('woff2-variations');
  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;
}

/* caveat-latin-wght-normal */
@font-face {
  font-family: 'Caveat Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 400 700;
  src: url(fonts/caveat-latin-wght-normal.woff2) format('woff2-variations');
  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: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(fonts/inter-latin-ext-wght-normal.woff2) format('woff2-variations');
  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: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(fonts/inter-latin-wght-normal.woff2) format('woff2-variations');
  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;
}
/* Bér Napló • Burgundy design system
   Single source of truth: palette, spacing, type, radii, depth and motion.
   Responsive boundaries: mobile <768px, tablet 768–1199px, desktop ≥1200px. */
html, body, * { scrollbar-width: none; -ms-overflow-style: none; }
*::-webkit-scrollbar { display: none; width: 0; height: 0; }

:root {
  --island-surface: #fffdfc;
  --island-header: #fff5f8;
  --island-border: #e7dce2;
  --island-report-surface: #fdfcff;
  --island-report-header: #f6f2fc;
  --island-report-border: #e1d9ed;
  color-scheme: light;
  --primary: #a32345; --primary-dark: #781b36; --primary-deep: #481329;
  --primary-light: #fcecf2; --primary-border: #eec8d6;
  --accent: #925500; --accent-light: #fff4e3;
  --success: #167448; --success-light: #eaf8ef;
  --warning: #925500; --warning-light: #fff4e3;
  --danger: #b42335; --danger-light: #ffedf0;
  --info: #225fa4; --info-light: #edf6ff;
  --violet: #7436b5; --violet-light: #f4edfc;
  --bg: #f6f8fc; --surface: #fff; --surface2: #f1f4fa;
  --border: #dce3ef; --text: #18233d; --text2: #596780; --text3: #66748c;
  --radius-xs: 6px; --radius-sm: 10px; --radius: 12px; --radius-lg: 22px; --radius-pill: 999px;
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-5: 20px; --space-6: 24px; --space-8: 32px; --space-10: 40px; --space-12: 48px;
  --shadow-sm: 0 2px 6px rgb(30 42 77 / 4%);
  --shadow: 0 3px 8px rgb(30 42 77 / 3%), 0 12px 28px rgb(30 42 77 / 5%);
  --shadow-lg: 0 24px 64px rgb(30 20 48 / 20%);
  --focus-ring: 0 0 0 3px rgb(163 35 69 / 19%);
  --font: "Inter Variable", "Segoe UI", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Arial, sans-serif;
  --font-display: var(--font); --font-xs: 12px; --font-sm: 13px; --font-base: 15px;
  --font-lg: 18px; --font-xl: 24px; --font-hero: clamp(36px, 4.6vw, 74px);
  --transition: 180ms ease; --rail-width: 108px; --content-width: 1640px;
  --header-background: #781b36 url(assets/header-photographic.webp) center center / cover no-repeat;
}

/* Functional component states retained from the original application. */
* { box-sizing: border-box; margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; }
button, input, select, textarea { font: inherit; }
button { touch-action: manipulation; }
.topbar-back:active { background: var(--primary-light); }
.topbar-action:active { background: var(--primary-light); }
.hamburger-btn:active { background: rgba(255,255,255,.28); }
.side-drawer-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.5);
    z-index: 300; opacity: 0; pointer-events: none; transition: opacity .2s ease; }
.side-drawer-overlay.open { opacity: 1; pointer-events: auto; }
.side-drawer.open { transform: translateX(0); }
.side-drawer-close { position: absolute; top: 12px; right: 12px;
    width: 32px; height: 32px;
    display: flex; align-items: center; justify-content: center;
    background: rgba(255,255,255,.18);
    border: 1px solid rgba(255,255,255,.35);
    border-radius: 8px;
    color: #fff; font-size: 16px; cursor: pointer; }
.side-drawer-brand .sdb-logo { font-size: 11px; letter-spacing: 2px; text-transform: uppercase; opacity: .8; }
.side-drawer-brand .sdb-title { font-size: 20px; font-weight: 800; margin-top: 4px; }
.side-drawer-brand .sdb-version { display: inline-flex;
    margin-top: 10px;
    padding: 4px 8px;
    border-radius: 999px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.28);
    color: rgba(255,255,255,.92);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .4px; }
.side-drawer-item:active { background: var(--surface2); }
.mini-calendar-day.has-planned { box-shadow: inset 0 0 0 2px var(--danger); border-radius: 10px; }
.mini-calendar-day.has-planned-off { box-shadow: inset 0 0 0 2px #15803d; border-radius: 10px; }
.mini-calendar-day.has-planned-vac { box-shadow: inset 0 0 0 2px #2563eb; border-radius: 10px; }
#beosztas-table td { border: 1px solid var(--border); text-align: center; }
#beosztas-table th.b-today { background: var(--primary); color: #fff; }
#beosztas-table th.b-empty-day { color: var(--warning); }
#beosztas-table td.b-nev { position: sticky; left: 0; background: var(--surface); z-index: 2; font-weight: 700; font-size: 13px; text-align: left; padding: 8px 10px; min-width: 110px; max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-shadow: 2px 0 4px rgba(0,0,0,.06); }
#beosztas-table td.b-cell:active { background: var(--surface2); }
#beosztas-table tr.b-osszes td { font-size: 11px; color: var(--text3); padding: 4px; background: var(--surface2); cursor: default; }
.menu-item:focus-visible, [role="button"]:focus-visible { outline: 3px solid var(--accent);
    outline-offset: 3px; }
.menu-item.accent { border-color: var(--accent-light); }
.menu-item.accent .menu-icon { background: var(--accent-light); border-radius: 50%; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; }
.menu-item.primary-bg { background: var(--primary); border-color: var(--primary); }
.menu-item.primary-bg .menu-label { color: white; }
.card-badge.inactive { background: var(--surface2); color: var(--text3); }
.card-row { display: flex; justify-content: space-between; align-items: center; padding: 4px 0; }
.card-row-label { font-size: 13px; color: var(--text2); }
.card-row-value { font-size: 13px; font-weight: 500; }
.card-actions { padding: 8px 16px 14px; display: flex; gap: 8px; }
.form-row .form-section { margin-bottom: 20px; min-width: 0; }
.calendar-date-section > .form-label, .calendar-date-section > input[type="date"] { display: none; }
.calendar-date-section .mini-calendar { margin-top: 0 !important; }
.calendar-date-section { display: flex;
    flex-direction: column;
    margin-bottom: 0;
    min-height: 100%; }
.admin-entry-side { display: flex; flex-direction: column; gap: 12px; }
.admin-entry-side .form-section, .admin-entry-side .form-row { margin-bottom: 0; }
.admin-entry-side .calc-box { width: 100%; margin: 0; }
.admin-entry-side > .btn.btn-primary:last-child { margin-top: auto; }
.calendar-bottom-field { margin-top: auto !important; margin-bottom: 0; }
.munkaido-kassza-section .toggle-row { min-height: 44px; margin-bottom: 0; padding: 3px 12px 3px 8px; align-items: center; }
.ber-tortenet-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; }
.ber-tortenet-row .btn { align-self: end; }
.work-group > summary::-webkit-details-marker { display: none; }
.work-group > summary::marker { content: ''; }
.work-group[open] > summary .wg-caret { transform: rotate(180deg); }
.list-filter-row { display: flex; align-items: center; gap: 8px; margin-bottom: 14px; }
.list-filter-row input { flex: 1; min-width: 0; padding: 9px 8px; font-size: 13px; }
.list-filter-row span { color: var(--text3); font-size: 12px; flex-shrink: 0; }
.list-filter-row button { flex-shrink: 0; padding: 9px 10px; font-size: 12px; }
.havi-sticky-header { padding-bottom: 12px; }
.input.has-existing-entry { border-color: var(--danger) !important;
    background: var(--danger-light);
    color: var(--danger);
    font-weight: 700; }
.input.has-existing-entry:focus { border-color: var(--danger) !important;
    box-shadow: 0 0 0 3px rgba(185,28,28,.14); }
.input.has-vacation-entry { border-color: #7dd3fc !important;
    background: #eef8ff;
    color: #0369a1;
    font-weight: 700; }
.input.has-vacation-entry:focus { border-color: #38bdf8 !important;
    box-shadow: 0 0 0 3px rgba(14,165,233,.16); }
.input.has-dayoff-entry { border-color: #86efac !important;
    background: var(--success-light);
    color: var(--success);
    font-weight: 700; }
.input.has-dayoff-entry:focus { border-color: #22c55e !important;
    box-shadow: 0 0 0 3px rgba(34,197,94,.16); }
.worker-btn:active { background: var(--primary-light); }
.screen.needs-worker .work-group input:disabled, .screen.needs-worker .work-group select:disabled, .screen.needs-worker .work-group textarea:disabled, .screen.needs-worker .work-group button:disabled, .screen.needs-worker .havi-sticky-header input:disabled, .screen.needs-worker .havi-sticky-header button:disabled { opacity: .55;
    cursor: not-allowed; }
.worker-required-note { display: none;
    background: var(--warning-light);
    border: 1px solid #f6c090;
    border-radius: var(--radius-sm);
    color: var(--warning);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.4;
    padding: 10px 12px;
    margin: 0 0 12px; }
.screen.needs-worker .worker-required-note { display: block; }
.btn:focus-visible, .topbar-back:focus-visible, .topbar-action:focus-visible, .hamburger-btn:focus-visible, .side-drawer-close:focus-visible, .worker-btn:focus-visible, .type-option:focus-visible { outline: 3px solid rgba(156,38,56,.28);
    outline-offset: 2px; }
.btn:active { opacity: 0.85; transform: scale(0.99); }
.discount-row { display: flex; align-items: center; gap: 12px; margin-top: 8px; }
.discount-slider { flex: 1; -webkit-appearance: none; height: 4px; border-radius: 2px; background: var(--border); outline: none; }
.discount-slider::-webkit-slider-thumb { -webkit-appearance: none; width: 20px; height: 20px; border-radius: 50%; background: var(--primary); cursor: pointer; }
.discount-val { font-weight: 700; font-size: 15px; color: var(--primary); min-width: 40px; text-align: right; }
.calc-box.is-vacation { background: #eef8ff;
    border-color: #8fd3ff; }
.calc-box.is-vacation .calc-box-label, .calc-box.is-vacation .calc-box-value { color: #0369a1; }
.calc-box.is-dayoff { background: var(--success-light);
    border-color: #86efac; }
.calc-box.is-dayoff .calc-box-label, .calc-box.is-dayoff .calc-box-value { color: var(--success); }
.calc-box-label { font-size: 12px; color: var(--primary); font-weight: 600; margin-bottom: 2px; }
.calc-box-note { font-size: 12px; color: var(--text2); margin-top: 4px; }
input.input[type="text"] { text-transform: uppercase; }
.calc-type-row { display: flex; flex-direction: column; }
.calc-type-row-type { margin-bottom: 12px; }
.mini-calendar-day.empty { visibility: hidden;
    pointer-events: none; }
.mini-calendar-day.has-work { background: var(--danger-light);
    border-color: #f5a3a3;
    color: var(--danger); }
.mini-calendar-day.has-vacation { background: #e0f2fe;
    border-color: #7dd3fc;
    color: #0369a1; }
.mini-calendar-day.has-dayoff { background: var(--success-light);
    border-color: #86efac;
    color: var(--success); }
.mini-calendar-day.has-work.has-vacation { background: linear-gradient(135deg, var(--danger-light) 0 50%, #e0f2fe 50% 100%); }
.mini-calendar-day.has-work.has-dayoff, .mini-calendar-day.has-vacation.has-dayoff { background: linear-gradient(135deg, var(--success-light) 0 50%, var(--danger-light) 50% 100%); }
.mini-calendar-day.has-current-page { box-shadow: inset 0 0 0 3px var(--accent), 0 0 0 1px rgba(179,107,0,.16); }
.mini-calendar-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; font-size: 11px; color: var(--text2); margin-top: 24px; }
.mini-calendar-legend span { display: inline-flex; align-items: center; gap: 5px; }
.legend-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; border: 1px solid transparent; }
.legend-dot.is-work { background: var(--danger-light); border-color: #f5a3a3; }
.legend-dot.is-vacation { background: #e0f2fe; border-color: #7dd3fc; }
.legend-dot.is-dayoff { background: var(--success-light); border-color: #86efac; }
.legend-dot.is-selected { background: var(--surface); border: 3px solid rgba(156,38,56,.35); }
.legend-dot.is-current-page { background: var(--accent); border-color: var(--accent); }
.record-detail { font-size: 13px; color: var(--text2); }
.record-detail span { font-weight: 600; color: var(--text); }
.worktime-record-summary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); align-items: start; gap: 12px; margin-bottom: 6px; }
.worktime-record-summary > * { min-width: 0; overflow-wrap: anywhere; }
.worktime-record-amount { text-align: center; }
.worktime-record-amount span { white-space: nowrap; }
.worktime-record-author { text-align: right; }
.worktime-record-audit { text-align: right; font-size: 12px; color: var(--text3); overflow-wrap: anywhere; margin-bottom: 6px; }
.record-footer { padding: 8px 14px; border-top: 1px solid var(--border); background: var(--bg); display: flex; gap: 10px; }
.record-footer .btn { width: auto; flex: 1; }
.summary-header-left { display: flex; flex-direction: column; min-width: 0; }
.summary-name { font-size: 17px; font-weight: 700; }
.summary-month { font-size: 12px; opacity: 0.75; margin-top: 2px; }
.summary-total-label { font-size: 12px; opacity: 0.8; margin-top: 2px; }
.summary-row:last-child { border-bottom: none; }
.summary-row-label { font-size: 13px; color: var(--text2); }
.summary-row-value { font-size: 13px; font-weight: 600; }
.summary-row-value.positive { color: var(--success); }
.summary-row-value.negative { color: var(--danger); }
.summary-section { margin-top: 14px; }
.summary-section-title { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; color: var(--text2); margin-bottom: 8px; }
.summary-detail-row { font-size: 13px; color: var(--text2); padding: 3px 0; }
.summary-payment-box { background: var(--danger-light);
    border: 1px solid #f5c0c0;
    border-radius: var(--radius-sm);
    padding: 12px 14px;
    margin-top: 12px;
    display: flex;
    justify-content: space-between;
    align-items: center; }
.summary-payment-label { font-size: 13px; font-weight: 600; color: var(--danger); }
.summary-payment-value { font-size: 18px; font-weight: 700; color: var(--danger); }
.summary-payment-box.is-paid { background: var(--success-light); border-color: #a3d9c3; }
.summary-payment-box.is-paid .summary-payment-label, .summary-payment-box.is-paid .summary-payment-value { color: var(--success); }
.toggle input:checked + .toggle-slider { background: var(--primary); }
.type-select { display: flex; gap: 8px; }
.type-btn { flex: 1; padding: 10px 8px;
    border: 2px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--surface);
    font-family: var(--font);
    font-size: 13px;
    font-weight: 600;
    color: var(--text2);
    cursor: pointer;
    text-align: center;
    transition: var(--transition); }
.type-btn.selected { border-color: var(--primary); background: var(--primary-light); color: var(--primary); }
.toast { position: fixed;
    bottom: 24px; left: 50%; transform: translateX(-50%) translateY(120px);
    background: var(--text);
    color: white;
    padding: 13px 20px;
    border-radius: var(--radius);
    font-size: 14px;
    font-weight: 600;
    z-index: 9999;
    transition: transform 0.3s ease, opacity 0.3s ease;
    opacity: 0;

    white-space: normal;
    word-break: break-word;
    line-height: 1.45;
    width: max-content;
    max-width: min(88vw, 460px);
    text-align: center;
    box-shadow: 0 6px 20px rgba(0,0,0,.28);
    pointer-events: none; }
.toast.show { transform: translateX(-50%) translateY(0); opacity: 1; }
.toast.success { background: var(--success); }
.toast.error { background: var(--danger); }
/* Status has its own row in the header area; it never floats over the page. */
.theme-sync-bar { flex: 0 0 auto; display: flex; align-items: center; justify-content: flex-end; gap: 12px; min-height: 34px; padding: 4px 20px; background: #68182f; color: #f8dce6; border-bottom: 1px solid #ffffff1a; }
.theme-sync-caption { font-size: 11px; font-weight: 550; white-space: nowrap; }
.shared-active-indicator { position: static; display: none; align-items: center; justify-content: flex-start; gap: 8px; min-width: 0; max-width: min(680px,100%); padding: 3px 10px; border: 1px solid #ffffff22; border-radius: 7px; background: #ffffff0d; color: #fff; box-shadow: none; font-size: 11px; font-weight: 650; line-height: 1.5; text-align: left; white-space: normal; overflow-wrap: anywhere; opacity: 1; }
.shared-active-indicator.editing { color: #d5ffe6; border-color: #8bdeae45; background: #89e6aa12; }
.shared-active-indicator.readonly { color: #ffe0ad; border-color: #ffce8045; background: #ffcd7612; }
.shared-active-indicator.needs-auth { flex-wrap: wrap; max-width: 100%; }
.shared-active-indicator.needs-auth button { flex: 0 0 auto; min-height: 36px; padding: 6px 12px; border: 1px solid #ffffff45; border-radius: 6px; background: #fff; color: var(--primary-dark); font: inherit; font-weight: 750; cursor: pointer; }
body.has-update-notice .toast { bottom: calc(var(--update-notice-height, 150px) + 34px + env(safe-area-inset-bottom)); }
body:has(.modal-overlay.open) .toast, body.modal-open .toast { bottom: auto;
    top: calc(20px + env(safe-area-inset-top));
    transform: translateX(-50%) translateY(-140px); }
body:has(.modal-overlay.open) .toast.show, body.modal-open .toast.show { transform: translateX(-50%) translateY(0); }

.update-notice-versions { font-size: 12.5px;
    line-height: 1.5;
    margin-top: 4px; }
.update-notice { position: fixed;
    left: 50%;
    bottom: calc(18px + env(safe-area-inset-bottom));
    transform: translateX(-50%);
    z-index: 900;
    width: min(92vw, 420px);
    background: var(--surface);
    border: 1.5px solid var(--primary);
    border-radius: var(--radius);
    box-shadow: var(--shadow-lg);
    padding: 14px;
    display: none;
    gap: 12px;
    align-items: center; }
.update-notice.show { display: flex; }
.update-notice-text { flex: 1; min-width: 0; font-size: 13px; color: var(--text); }
.update-notice-title { font-weight: 800; color: var(--primary); margin-bottom: 2px; }
.update-notice-status { margin-top: 4px; color: var(--text2); font-size: 12px; }
.update-notice .btn { width: auto; min-height: 40px; padding: 10px 12px; font-size: 13px; white-space: nowrap; }
.pin-close-btn { position: absolute;
    top: max(14px, env(safe-area-inset-top));
    right: 14px;
    border: 1px solid rgba(255,255,255,.35);
    background: rgba(255,255,255,.15);
    color: #fff;
    border-radius: 10px;
    padding: 10px 14px;
    font-size: 14px;
    font-weight: 800;
    cursor: pointer; }
.pin-close-btn:active { background: rgba(255,255,255,.28); }
.pin-logo { font-family: var(--font-display); font-size: 14px; letter-spacing: 2px; text-transform: uppercase; opacity: 0.75; margin-bottom: 8px; }
.pin-version { display: inline-flex;
    margin-bottom: 14px;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.28);
    background: rgba(255,255,255,.12);
    color: rgba(255,255,255,.9);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .3px; }
.pin-dot { width: 16px; height: 16px;
    border-radius: 50%;
    border: 2px solid rgba(255,255,255,0.5);
    transition: var(--transition); }
.pin-dot.filled { background: white; border-color: white; }
.pin-key:active { background: rgba(255,255,255,0.3); transform: scale(0.95); }
.pin-key.empty { border-color: transparent; background: transparent; pointer-events: none; }
.pin-key.del { font-size: 18px; }
.pin-links { display: flex; gap: 20px; margin-top: 32px; }
.pin-user-card:active { background: var(--surface2); }
.pin-user-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 19px; flex-shrink: 0; color: #fff; }
.pin-user-copy { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.pin-user-name { font-weight: 700; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pin-user-role { font-size: 12px; color: var(--text2); }
.pin-user-arrow { color: var(--text2); font-size: 18px; }
.pin-link { color: rgba(255,255,255,0.7); font-size: 13px; background: none; border: none; cursor: pointer; text-decoration: underline; }
.modal-overlay.open { opacity: 1; pointer-events: all; }
.modal-overlay.open .modal { transform: translateY(0); }
.modal-handle { width: 40px; height: 4px; background: var(--border); border-radius: 2px; margin: 0 auto 20px; }
.divider { height: 1px; background: var(--border); margin: 16px 0; }
.empty-state-text { font-size: 14px; }
.settings-row:first-child { border-radius: var(--radius) var(--radius) 0 0; }
.settings-row:last-child { border-radius: 0 0 var(--radius) var(--radius); border-bottom: none; }
.settings-row-single { border-radius: var(--radius) !important; border-bottom: none !important; }
.discount-stepper { display: inline-grid;
    grid-template-columns: 46px minmax(72px, auto) 46px;
    align-items: center;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    overflow: hidden;
    background: var(--surface);
    min-height: 46px; }
.discount-stepper-btn { height: 46px;
    border: 0;
    background: var(--surface2);
    color: var(--primary);
    font-size: 22px;
    font-weight: 900;
    cursor: pointer; }
.discount-stepper-value { min-width: 72px;
    text-align: center;
    font-size: 18px;
    font-weight: 900;
    color: var(--primary);
    padding: 0 12px; }
.print-header { text-align:center; padding:16px 0 12px; border-bottom:2px solid var(--primary); margin-bottom:16px; }
.print-logo { font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--primary); font-weight:700; }
.print-title { font-size:18px; font-weight:700; margin:4px 0; }
.print-date { font-size:11px; color:#666; }
.print-worker { margin-bottom:20px; page-break-inside:avoid; }
.print-worker-name { font-size:15px; font-weight:700; background:var(--primary); color:white; padding:8px 12px; }
.print-worker-total { font-size:13px; font-weight:600; background:var(--primary-light); color:var(--primary); padding:6px 12px; margin-bottom:8px; }
.print-entry { border:1px solid #eee; border-radius:6px; padding:10px 12px; margin-bottom:8px; }
.print-entry-row { display:flex; justify-content:space-between; align-items:center; }
.print-entry-period { font-size:14px; font-weight:600; }
.print-entry-amount { font-size:15px; font-weight:700; color:var(--primary); }
.print-entry-meta { font-size:11px; color:#888; margin-top:3px; }
.print-entry-det { font-size:11px; color:#555; margin-top:5px; padding-top:5px; border-top:1px solid #eee; }
.print-grand-total { font-size:16px; font-weight:700; text-align:right; padding:12px; background:#f0f4f8; border-top:2px solid var(--primary); margin-top:8px; }
@media print {
@page { margin: 1.2cm 1cm; }

    .toast,
    .update-notice,
    .shared-active-indicator,
    .side-drawer,
    .side-drawer-overlay,
    .modal-overlay,
    .hamburger-btn,
    #pin-overlay {
      display: none !important;
    }
    body, html, #app { overflow: visible !important; background: #fff !important; box-shadow: none !important; }
    html, body { height: auto !important; }
    .topbar { display:none !important; }
    #app > div:not(.screen.active) { display:none !important; }
    .screen { min-height:auto !important; height: auto !important; overflow: visible !important; }
    #print-screen-content, .scroll-content { overflow: visible !important; padding: 0 !important; margin: 0 !important; }
    div[style*="warning-light"] { display:none !important; }
    .no-print { display: none !important; }
    .summary-header {
      background: none !important;
      color: var(--text) !important;
      border-bottom: 2px solid var(--primary);
      -webkit-print-color-adjust: exact; print-color-adjust: exact;
    }
    .summary-name, .summary-total { color: var(--text) !important; }
    .summary-month, .summary-total-label { color: var(--text2) !important; opacity: 1 !important; }
    .summary-card, .print-worker { box-shadow: none !important; border: 1px solid #999 !important; border-radius: 4px !important; }
    .summary-header { page-break-after: avoid; break-after: avoid; }
    .print-header {
      background: #fff;
    }
    .print-entry, .summary-row, .summary-detail-row { page-break-inside: avoid; break-inside: avoid; }
    * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
}
.chip.success { background: var(--success-light); color: var(--success); }
.chip.danger { background: var(--danger-light); color: var(--danger); }
.chip.warning { background: var(--warning-light); color: var(--warning); }
/* Shared component definitions. */
html, body { height: 100%; overflow: hidden; }
body { font-family: var(--font); background: var(--bg); color: var(--text); font-size: var(--font-base); line-height: 1.5; overscroll-behavior: none; -webkit-font-smoothing: antialiased; }
#app { display: flex; flex-direction: column; width: 100%; max-width: none; margin: 0; height: 100vh; height: 100dvh; height: calc(var(--vh, 1vh) * 100); background: var(--bg); }
.screen { display: none; flex: 1; height: auto; min-height: 0; min-width: 0; flex-direction: column; overflow: hidden; }
.screen.active { display: flex; }
.scroll-content, .home-scroll { min-height: 0; min-width: 0; background: var(--bg) url(assets/surface-waves.svg) right bottom / 100% 100% no-repeat; }
.scroll-content { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; padding: var(--space-4); padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
.home-scroll { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; padding-bottom: calc(56px + env(safe-area-inset-bottom)); }
.topbar, .home-header { background: var(--header-background); color: #fff; isolation: isolate; flex-shrink: 0; }
.topbar { display: flex; align-items: center; gap: var(--space-3); min-height: 84px; height: auto; padding: var(--space-4); padding-top: max(var(--space-4), env(safe-area-inset-top)); position: relative; z-index: 100; border-bottom: 1px solid rgb(255 255 255 / 12%); }
.topbar::after, .home-header::after { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(90deg, rgb(71 11 31 / 8%), transparent 55%); }
.topbar-title { font-size: clamp(19px, 2.2vw, 32px); font-weight: 750; letter-spacing: -.5px; flex: 1; min-width: 0; color: #fff; line-height: 1.2; overflow-wrap: anywhere; }
.topbar-back { width: 64px; height: 40px; border-radius: var(--radius-pill); display: flex; align-items: center; justify-content: center; border: 1px solid rgb(255 255 255 / 20%); background: rgb(255 255 255 / 10%); color: #fff; cursor: pointer; font-size: 13px; font-weight: 700; flex-shrink: 0; }
.topbar-action { font-size: var(--font-sm); font-weight: 700; color: #fff; border: 1px solid rgb(255 255 255 / 22%); background: rgb(255 255 255 / 10%); cursor: pointer; padding: 10px 14px; min-height: 44px; border-radius: var(--radius-sm); }
.topbar-worker-name { display: none; position: static; transform: none; padding: 6px 12px; border-radius: var(--radius-pill); max-width: 32%; background: rgb(255 255 255 / 12%); color: #fff; font-size: var(--font-xs); font-weight: 650; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.topbar-worker-name.has-worker { display: inline-block; color: #fff; background: rgb(255 255 255 / 16%); }
.theme-header-meta { display: none; align-items: center; gap: var(--space-6); font-size: var(--font-sm); }
.theme-header-date { display: flex; align-items: flex-start; gap: 16px; white-space: nowrap; color: #fff1f5; }
.theme-header-user { display: inline-flex; align-items: center; gap: 12px; max-width: 250px; min-height: 44px; padding: 8px 20px; background: rgb(255 255 255 / 12%); border: 1px solid rgb(255 255 255 / 8%); border-radius: var(--radius-pill); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; }
.home-header { position: relative; padding: 28px 20px 24px; padding-top: max(28px, env(safe-area-inset-top)); text-align: left; }
.home-eyebrow { font-size: 10px; letter-spacing: 3px; text-transform: uppercase; color: #f8c9d8; margin-bottom: var(--space-1); padding-left: 58px; }
.home-title { font-size: var(--font-hero); font-weight: 750; letter-spacing: -1.5px; line-height: 1.14; padding-left: 58px; }
.home-tagline { font-size: var(--font-sm); color: #f9d9e3; margin-top: var(--space-2); }
.home-subtitle { font-size: var(--font-sm); color: #f9d9e3; opacity: 1; margin-top: var(--space-3); }
.hamburger-btn { position: absolute; top: 28px; left: 20px; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; background: rgb(255 255 255 / 12%); border: 1px solid rgb(255 255 255 / 24%); border-radius: var(--radius-sm); color: #fff; font-size: 22px; padding: 0; cursor: pointer; z-index: 5; }
.menu-groups { display: flex; flex-direction: column; gap: var(--space-6); padding: var(--space-6) var(--space-4); width: 100%; max-width: var(--content-width); margin: auto; }
.menu-group { padding: 0; background: transparent; border: 0; box-shadow: none; border-radius: 0; min-width: 0; }
.menu-group-label { display: flex; align-items: center; gap: 18px; font-size: 20px; line-height: 30px; font-weight: 750; letter-spacing: 1.4px; text-transform: uppercase; color: var(--text); padding: 0; }
.menu-group-label::before { content: ''; width: 6px; height: 34px; border-radius: 4px; background: #b0204c; flex-shrink: 0; }
.menu-group[data-menu-group="report"] .menu-group-label::before { background: var(--primary); }
.menu-group-description { color: #748098; font-size: 16px; padding-left: 24px; margin: -4px 0 18px; line-height: 22px; }
.menu-grid, .menu-group .menu-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); padding: 0; }
.menu-item { --tile-color: var(--primary); --tile-tint: #f9eaf3; --tile-border: #e5c9dc; position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 8px; min-height: 184px; border: 1px solid var(--tile-border); border-radius: var(--radius); padding: 16px 24px; text-align: left; cursor: pointer; background: linear-gradient(140deg, #ffffffa8, transparent 78%), var(--tile-tint); transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition); box-shadow: 0 5px 18px rgb(57 35 74 / 5%), inset 0 1px 0 #ffffffb8; user-select: none; overflow: hidden; }
.menu-item::after { content: '›'; position: absolute; top: 27px; right: 21px; display: grid; place-items: center; width: 42px; height: 42px; font-size: 30px; line-height: 1; font-weight: 400; color: var(--tile-color); background: #ffffff9c; border: 1px solid var(--tile-border); border-radius: 50%; box-shadow: 0 4px 9px color-mix(in srgb, var(--tile-color) 6%, transparent); z-index: 2; }
.menu-icon { position: relative; z-index: 1; display: grid; place-items: center; width: 78px; height: 78px; border-radius: var(--radius-pill); font-size: 32px; line-height: 1; background: linear-gradient(145deg,#ffffffb8,var(--tile-tint)); border: 1px solid #fffffff2; box-shadow: 0 0 0 1px color-mix(in srgb,var(--tile-color) 9%,transparent), 0 8px 18px color-mix(in srgb, var(--tile-color) 9%, transparent); flex-shrink: 0; }
.menu-copy { position: relative; z-index: 1; min-width: 0; }
.menu-label { font-size: 20px; font-weight: 750; color: #162037; line-height: 1.25; }
.menu-description { color: #6c788c; font-size: 14px; line-height: 19px; margin-top: 4px; max-width: 220px; }
.menu-item.full { grid-column: 1 / -1; flex-direction: row; align-items: center; justify-content: flex-start; gap: 26px; min-height: 122px; padding: 16px 20px; padding-right: 65px; }
.menu-item.full::after { top: calc(50% - 21px); }
.mi-blue, .mi-teal { --tile-color: #225fa4; --tile-tint: #eaf5ff; --tile-border: #bfdcf3; }
.mi-burgundy, .mi-rose { --tile-color: var(--primary); --tile-tint: #fbedf3; --tile-border: #edccdc; }
.mi-gold, .mi-amber { --tile-color: #975a15; --tile-tint: #f7f0e6; --tile-border: #ead7bf; }
.mi-green { --tile-color: var(--success); --tile-tint: #eaf7f1; --tile-border: #bfe5d6; }
.mi-purple { --tile-color: var(--violet); --tile-tint: #f0e8fc; --tile-border: #ddcff5; }
.home-footer { display: flex; flex-wrap: wrap; gap: var(--space-3); justify-content: space-between; align-items: center; max-width: var(--content-width); margin: auto; padding: var(--space-6) var(--space-4); color: #7d88a1; font-size: 13px; }
.side-drawer { position: fixed; inset: 0 auto 0 0; width: 280px; max-width: 86vw; background: linear-gradient(160deg,var(--primary-dark),var(--primary-deep)); color: #fff; z-index: 301; transform: translateX(-100%); transition: transform 240ms ease; display: flex; flex-direction: column; box-shadow: var(--shadow-lg); }
.side-drawer-brand { background: transparent; color: #fff; padding: var(--space-6) var(--space-5); text-align: left; position: relative; border-bottom: 1px solid #ffffff1a; }
.side-drawer-items { padding: var(--space-3); flex: 1; overflow-y: auto; }
.side-drawer-item { display: flex; align-items: center; gap: var(--space-3); padding: 12px; min-height: 48px; border-radius: var(--radius-sm); font-size: var(--font-sm); font-weight: 650; color: #f2dae3; cursor: pointer; margin-bottom: 6px; position: relative; }
.side-drawer-item.danger { color: #f2dae3; }
.side-drawer-item[aria-current="page"] { color: #fff; background: rgb(235 82 127 / 19%); }
.side-drawer-item[aria-current="page"]::before { content: ''; position: absolute; left: -2px; top: 10px; bottom: 10px; width: 3px; border-radius: 4px; background: #ee7298; }
.side-drawer-sep { height: 1px; background: #ffffff26; margin: var(--space-3) var(--space-1); }
.side-drawer-item .sdi-icon { font-size: 23px; width: 26px; text-align: center; flex-shrink: 0; }
.card, .summary-card, .work-group, .list-group, .settings-group, .record-item { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; margin-bottom: var(--space-4); }
.work-group > summary { list-style: none; cursor: pointer; padding: 14px 18px 10px; font-size: 16px; font-weight: 750; text-transform: uppercase; letter-spacing: .65px; color: var(--text); display: flex; align-items: center; gap: 14px; user-select: none; }
.work-group > summary::before, .list-group-label::before { content: ''; display: inline-block; width: 5px; height: 24px; border-radius: 3px; background: var(--primary); flex-shrink: 0; }
.work-group > summary .wg-caret { margin-left: auto; transition: transform var(--transition), background var(--transition), border-color var(--transition); color: var(--primary-dark); width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid #d8a6b7; border-radius: 9px; background: linear-gradient(145deg,#fff,#f8e9ef); box-shadow: 0 2px 5px #781b3612,inset 0 1px 0 #fff; flex-shrink: 0; }
.work-group > summary .wg-caret svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.work-group > summary:hover .wg-caret, .work-group > summary:focus-visible .wg-caret { border-color: var(--primary); background: #f6dce6; }
.work-group-body { padding: 0 18px 18px; }
.list-group { padding: var(--space-5); }
.list-group-label { font-size: var(--font-base); font-weight: 750; text-transform: uppercase; letter-spacing: .65px; color: var(--text); margin-bottom: var(--space-4); display: flex; align-items: center; gap: var(--space-3); position: relative; background: var(--surface); padding: 0; }
.form-section { margin-bottom: var(--space-5); }
.form-row { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--space-4); }
.form-label { display: block; font-size: var(--font-xs); font-weight: 700; text-transform: uppercase; letter-spacing: .3px; color: var(--text2); margin-bottom: var(--space-2); }
.input, .bn-employee-dialog input:not([type="checkbox"]), .bn-employee-dialog select { width: 100%; min-width: 0; min-height: 46px; padding: 11px 13px; border: 1px solid var(--border); border-radius: var(--radius-sm); font-family: var(--font); font-size: 16px; color: var(--text); background: var(--surface); transition: border-color var(--transition), box-shadow var(--transition); outline: none; -webkit-appearance: none; }
select.input, .bn-employee-dialog select { appearance: auto; }
.input:focus, .bn-employee-dialog input:focus, .bn-employee-dialog select:focus { border-color: var(--primary); box-shadow: var(--focus-ring); }
.input::placeholder { color: var(--text3); opacity: 1; }
.btn, .bn-employee-dialog button { width: 100%; min-height: 46px; padding: 12px 16px; border-radius: var(--radius-sm); border: 1px solid transparent; font-family: var(--font); font-size: var(--font-base); font-weight: 700; cursor: pointer; transition: background var(--transition), box-shadow var(--transition), transform var(--transition); display: flex; align-items: center; justify-content: center; gap: var(--space-2); user-select: none; }
.btn-primary, .bn-payroll-submit, .bn-discount-save { background: linear-gradient(115deg,var(--primary),#981e3c); color: #fff; box-shadow: 0 4px 12px rgb(163 35 69 / 12%); }
.btn-secondary, .bn-employee-dialog button { background: var(--surface); color: var(--text); border: 1px solid var(--border); }
.bn-employee-dialog .bn-payroll-submit, .bn-employee-dialog .bn-discount-save { background: var(--primary); color: #fff; border-color: var(--primary); }
.btn-danger { background: var(--danger-light); color: var(--danger); border-color: #f3ccd3; }
.btn-success { background: var(--success); color: #fff; }
.btn-sm { width: auto; min-height: 44px; padding: 10px 14px; font-size: var(--font-sm); }
button:disabled, input:disabled, select:disabled, textarea:disabled { opacity: .5; cursor: not-allowed; box-shadow: none; }
button:not(:disabled):active, .menu-item:active { transform: translateY(1px); }
:is(button, [role="button"], summary):focus-visible { outline: 3px solid var(--primary); outline-offset: 3px; }
.topbar :focus-visible, .home-header :focus-visible, .side-drawer :focus-visible, .pin-screen :focus-visible { outline-color: #ffd3e1; }
/* Shared worker strip: natural card widths, one row at every viewport size. */
.worker-select-grid { display: flex; flex-flow: row nowrap; gap: var(--space-3); min-width: 0; max-width: 100%; overflow-x: auto; overflow-y: hidden; padding: 7px; scroll-padding-inline: 7px; touch-action: pan-x pan-y; }
.worker-select-grid .worker-btn { flex: 0 0 auto; width: max-content; min-width: max-content; max-width: none; }
.worker-select-grid .worker-copy { flex: 0 0 auto; }
.worker-select-grid .worker-copy, .worker-select-grid .worker-name, .worker-select-grid .worker-meta { white-space: nowrap; overflow-wrap: normal; }
.worker-select-grid.is-scrollable, .worker-select-grid.is-scrollable .worker-btn { cursor: grab; }
.worker-select-grid.is-dragging, .worker-select-grid.is-dragging * { cursor: grabbing; user-select: none; }
.worker-select-grid:focus-visible { outline: 3px solid var(--primary); outline-offset: 2px; border-radius: var(--radius-sm); }
.worker-btn { --worker-accent: var(--primary); --worker-tint: var(--primary-light); min-height: 70px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 8px; background: linear-gradient(135deg,#fff,#f8faff); font-family: var(--font); font-size: var(--font-sm); font-weight: 700; color: var(--text); cursor: pointer; text-align: left; transition: border-color var(--transition), box-shadow var(--transition); display: flex; align-items: center; gap: 12px; box-shadow: 0 3px 8px #30426608; }
.worker-btn > span { min-width: 0; overflow-wrap: anywhere; }
.worker-btn::after { content: '›'; display: grid; place-items: center; width: 28px; height: 28px; flex-shrink: 0; margin-left: auto; border: 1px solid color-mix(in srgb,var(--worker-accent) 13%,white); border-radius: 50%; color: var(--worker-accent); background: #fff; box-shadow: 0 3px 6px #26374b07; font-size: 22px; }
.worker-btn.selected { border-color: var(--primary); background: linear-gradient(135deg,#fff7fb,#fbe6ef); color: var(--text); font-weight: 750; box-shadow: 0 4px 9px #9d234520,inset 0 1px 0 #fff; }
.worker-btn.selected::after { content: '✓'; color: #fff; background: var(--primary); border-color: var(--primary); font-size: 15px; }
.worker-avatar { width: 44px; height: 44px; border-radius: 50%; background: linear-gradient(140deg,#fff,var(--worker-tint)); border: 1px solid color-mix(in srgb,var(--worker-accent) 15%,white); color: var(--worker-accent); font-weight: 750; font-size: 15px; display: grid; place-items: center; flex-shrink: 0; box-shadow: 0 3px 9px color-mix(in srgb,var(--worker-accent) 10%,transparent),inset 0 0 0 2px #ffffff70; }
.worker-btn:nth-child(5n+2) .worker-avatar { background: var(--accent-light); color: var(--accent); border-color: #efdcba; }
.worker-btn:nth-child(5n+3) .worker-avatar { background: var(--success-light); color: var(--success); border-color: #c4e7d2; }
.worker-btn:nth-child(5n+4) .worker-avatar { background: var(--violet-light); color: var(--violet); border-color: #e0d1f3; }
.worker-btn:nth-child(5n+5) .worker-avatar { background: var(--info-light); color: var(--info); border-color: #c7e0f8; }
.worker-btn.selected .worker-avatar { background: var(--primary-light); color: var(--primary); border-color: var(--primary-border); }
.munkaido-inputs-row { display: block; }
.munkaido-main-row, .admin-entry-layout { display: grid; grid-template-columns: minmax(0,1.27fr) minmax(0,1fr); align-items: start; gap: 18px; }
.munkaido-form-fields { width: 100%; min-width: 0; }
.munkaido-side-fields { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.munkaido-side-fields .form-section { margin-bottom: 0; }
.munkaido-side-fields .toggle-row { background: linear-gradient(135deg,#fcfdff,#f4f7fc); border: 1px solid var(--border); padding: 3px 12px 3px 8px; min-height: 44px; border-radius: 8px; gap: 12px; }
.munkaido-kassza-section { display: grid; gap: 8px; }
.munkaido-kassza-section .form-label { margin-bottom: 0; }
.toggle-row { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-3) 0; }
.toggle-label { font-size: var(--font-sm); font-weight: 550; }
.toggle { position: relative; width: 48px; height: 28px; cursor: pointer; flex-shrink: 0; }
.toggle input { position: absolute; inset: 0; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; z-index: 1; }
.toggle-slider { position: absolute; inset: 0; background: #cbd2df; border-radius: var(--radius-pill); transition: background var(--transition); }
.toggle-slider:before { content: ''; position: absolute; width: 22px; height: 22px; left: 3px; bottom: 3px; background: #fff; border-radius: 50%; transition: transform var(--transition); box-shadow: 0 2px 4px #1e2a4d20; }
.toggle input:checked + .toggle-slider:before { transform: translateX(20px); }
.toggle input:focus-visible + .toggle-slider { outline: 3px solid var(--primary); outline-offset: 3px; }
.toggle input:disabled + .toggle-slider { opacity: .5; }
.calc-box { background: linear-gradient(120deg,#fff1f7,#fbe5f0); border: 1px solid #edc9db; border-radius: 8px; padding: 14px 16px; margin: 0; }
.calc-box-right, .munkaido-compact-calc { width: 100%; max-width: 100%; text-align: left; margin-left: 0; }
.calc-box-value { font-size: 28px; font-weight: 750; color: #111a30; letter-spacing: -.7px; font-variant-numeric: tabular-nums; line-height: 1.15; }
.mini-calendar { margin-top: 14px; border: 1px solid var(--border); border-radius: 8px; background: linear-gradient(140deg,#fcfdff,#f8faff); padding: 14px; box-shadow: 0 4px 9px #30426606; }
.mini-calendar-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 14px; }
.mini-calendar-title { font-size: 18px; font-weight: 750; color: var(--text); text-align: center; }
.mini-calendar-nav { width: 38px; height: 38px; border: 1px solid var(--border); border-radius: 8px; background: linear-gradient(140deg,#f9fbff,#edf1f9); box-shadow: 0 3px 6px #30426608; color: var(--text); font-size: 22px; cursor: pointer; }
.mini-calendar-weekdays, .mini-calendar-grid { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 6px; }
.mini-calendar-weekdays span { font-size: 11px; font-weight: 650; color: var(--text2); text-align: center; padding: var(--space-2) 0; }
.mini-calendar-day { min-height: 42px; min-width: 0; border: 1px solid var(--border); border-radius: 6px; background: linear-gradient(135deg,#fff,#fbfcff); color: var(--text); font-size: 13px; font-weight: 700; cursor: pointer; box-shadow: inset 0 1px 0 #fff; }
.mini-calendar-day.selected { outline: 2px solid #d12254; outline-offset: -1px; border-color: #d12254; background: linear-gradient(135deg,#fff,#fce1ec); color: var(--primary); box-shadow: 0 3px 7px #9b274414; }
.card-header, .record-header { padding: var(--space-4) var(--space-5); display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); }
.record-details { padding: 0 var(--space-5) var(--space-4); }
.card-body, .summary-body { padding: var(--space-4) var(--space-5); }
.card-name, .record-name { font-weight: 700; font-size: var(--font-base); overflow-wrap: anywhere; }
.record-date { font-size: var(--font-xs); color: var(--text3); flex-shrink: 0; }
.card-badge, .chip { display: inline-flex; align-items: center; padding: 4px 10px; border-radius: var(--radius-pill); font-size: var(--font-xs); font-weight: 650; }
.card-badge { background: var(--success-light); color: var(--success); }
.chip { background: var(--primary-light); color: var(--primary); margin: 2px; }
.summary-header { padding: var(--space-5); background: var(--header-background); color: #fff; display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-3); }
.summary-row { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); padding: 10px 0; border-bottom: 1px solid var(--border); }
.summary-total { font-size: clamp(23px,3vw,32px); font-weight: 750; font-variant-numeric: tabular-nums; }
.summary-header-right { display: flex; flex-direction: column; align-items: flex-end; text-align: right; flex-shrink: 1; }
.settings-row { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding: var(--space-4) var(--space-5); background: var(--surface); border-bottom: 1px solid var(--border); }
.settings-label { font-size: var(--font-sm); font-weight: 600; overflow-wrap: anywhere; min-width: 0; }
.settings-value { font-size: var(--font-sm); color: var(--text2); overflow-wrap: anywhere; }
.section-title { font-size: var(--font-sm); font-weight: 750; text-transform: uppercase; letter-spacing: .7px; color: var(--text); margin: var(--space-6) 0 var(--space-3); border-left: 4px solid var(--primary); padding-left: var(--space-3); }
.empty-state { text-align: center; padding: var(--space-8) var(--space-4); color: var(--text2); border: 1px dashed var(--border); border-radius: var(--radius-sm); background: linear-gradient(135deg,#fff,#f8faff); }
.empty-state-icon { font-size: 32px; margin-bottom: var(--space-3); }
#beosztas-table th { background: var(--surface2); font-size: 11px; font-weight: 700; color: var(--text2); padding: 10px 6px; min-width: 44px; }
#beosztas-table td.b-cell { min-width: 44px; height: 48px; font-size: 16px; cursor: pointer; user-select: none; }
#beosztas-table th.b-weekend { background: var(--primary-light); }
#beosztas-table td.b-weekend { background: #fdf5f8; }
.modal-overlay { position: fixed; inset: 0; background: rgb(24 18 39 / 45%); z-index: 1000; display: flex; align-items: flex-end; opacity: 0; pointer-events: none; transition: opacity var(--transition); }
.modal { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg) var(--radius-lg) 0 0; padding: var(--space-6) var(--space-5) calc(var(--space-6) + env(safe-area-inset-bottom)); width: 100%; max-height: calc(100dvh - 24px); overflow-y: auto; box-shadow: var(--shadow-lg); transform: translateY(100%); transition: transform 240ms ease; }
.modal-title { font-size: 22px; font-weight: 750; color: var(--text); margin-bottom: var(--space-2); }
.modal-sub { font-size: var(--font-sm); color: var(--text2); margin-bottom: var(--space-5); }
.bn-employee-dialog { width: min(760px,calc(100vw - 24px)); max-height: calc(100dvh - 24px); overflow: auto; box-sizing: border-box; margin: auto; padding: var(--space-6); border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); color: var(--text); font: var(--font-base) var(--font); box-shadow: var(--shadow-lg); }
.bn-employee-dialog::backdrop { background: rgb(24 18 39 / 45%); }
.bn-employee-dialog h2 { font-size: 24px; margin: 0 0 var(--space-4); }
.bn-employee-dialog p { line-height: 1.6; margin: var(--space-2) 0; }
.bn-employee-dialog label { display: grid; gap: var(--space-2); font-weight: 650; margin: var(--space-4) 0; }
.bn-employee-dialog button { margin-top: var(--space-2); }
.bn-employee-dialog fieldset { border: 1px solid var(--border); border-radius: var(--radius-sm); padding: var(--space-4); margin: var(--space-4) 0; }
.bn-employee-dialog .bn-employee-check { display: flex; align-items: flex-start; gap: var(--space-3); }
.bn-employee-check input { min-height: 24px; width: 24px; height: 24px; flex-shrink: 0; accent-color: var(--primary); }
.bn-employee-ledger article { border: 1px solid var(--border); border-radius: var(--radius-sm); padding: var(--space-4); margin: var(--space-3) 0; }
.bn-payroll-result { font-size: 20px; font-weight: 750; color: var(--primary); background: var(--primary-light); padding: var(--space-4); border-radius: var(--radius-sm); }
.pin-screen { min-height: 100%; width: 100%; height: 100%; overflow-y: auto; background: var(--header-background); display: flex; flex-direction: column; align-items: center; justify-content: safe center; padding: var(--space-6); padding-top: max(var(--space-6),env(safe-area-inset-top)); padding-bottom: max(var(--space-6),env(safe-area-inset-bottom)); color: #fff; position: relative; }
.pin-title { font-size: 40px; font-weight: 750; letter-spacing: -1px; margin-bottom: var(--space-2); }
.pin-sub { font-size: var(--font-sm); color: #f9d9e3; opacity: 1; margin-bottom: var(--space-4); text-align: center; max-width: 420px; }
.pin-back-btn { background: #ffffff14; border: 1px solid #ffffff30; border-radius: var(--radius-sm); color: #fff; font: inherit; font-size: var(--font-sm); padding: 10px 16px; min-height: 44px; margin: var(--space-3) 0; cursor: pointer; }
.pin-key { aspect-ratio: 1; border-radius: var(--radius); border: 1px solid #ffffff40; background: #ffffff14; color: #fff; font-family: var(--font); font-size: 24px; font-weight: 650; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: var(--transition); user-select: none; }
.pin-pad { display: grid; grid-template-columns: repeat(3,1fr); gap: var(--space-3); width: 100%; max-width: 260px; }
.pin-dots { display: flex; gap: var(--space-3); margin-bottom: var(--space-5); }
.pin-user-list { display: flex; flex-direction: column; gap: var(--space-3); width: 100%; max-width: 420px; margin-top: var(--space-3); max-height: 40vh; overflow-y: auto; flex-shrink: 0; }
.pin-user-card { display: flex; align-items: center; gap: var(--space-3); width: 100%; min-height: 74px; padding: 14px 18px; background: var(--surface); border: 1px solid #ffffff80; border-radius: var(--radius); cursor: pointer; text-align: left; font: inherit; box-shadow: var(--shadow); }
.pin-error { color: #ffd6df; font-size: var(--font-sm); margin-top: var(--space-3); text-align: center; }

/* All screen layout boundaries live here. */
@media (max-width: 767px) {
  .munkaido-main-row, .admin-entry-layout { grid-template-columns: minmax(0,1fr); }
  .admin-entry-side { min-width: 0; }
  .ber-tortenet-row { grid-template-columns: minmax(0,1fr); }
  .ber-tortenet-row .btn { width: 100%; }
  .topbar { display: grid; grid-template-columns: 64px minmax(0,1fr); gap: 8px 12px; }
  .topbar-title { grid-column: 2; overflow-wrap: normal; }
  .topbar-title::before { font-size: 8px; letter-spacing: 1px; }
  .topbar-back { grid-column: 1; grid-row: 1; }
  .topbar-action { grid-column: 2; justify-self: start; font-size: 12px; }
  .form-section:has(.worker-select-grid) > .form-label::after { content: " · Lapozz oldalra →"; font-size: 10px; font-weight: 500; text-transform: none; }
  .topbar-worker-name.has-worker { grid-column: 2; max-width: 100%; margin-left: 0; justify-self: start; }
  .settings-row { flex-wrap: wrap; }
  .settings-row select { max-width: 100%; }
  .list-filter-row { flex-wrap: wrap; }
  .list-filter-row input { flex: 1 1 105px; }
  .form-row:not(.munkaido-main-row) { grid-template-columns: repeat(auto-fit,minmax(min(100%,180px),1fr)); }
  .shared-active-indicator { max-width: 85vw; font-size: 10px; }
  .bn-employee-dialog { padding: var(--space-4); }
  .bn-employee-dialog h2 { font-size: 22px; }
  .menu-label { font-size: 15px; }
  .menu-item { padding: 14px; }
  .menu-item::after { right: 10px; top: 14px; width: 28px; height: 28px; font-size: 25px; }
  .menu-icon { width: 58px; height: 58px; }
  .menu-icon img { width: 39px; height: 39px; }
  .menu-description { font-size: 12px; line-height: 17px; }
  .menu-item.full { gap: 16px; padding-right: 46px; }
  .menu-group-label { font-size: 17px; }
  .menu-group-description { font-size: 13px; }
  .record-header { flex-wrap: wrap; }
}
@media (min-width: 768px) {
  .home-header { padding: var(--space-8) var(--space-10); }
  .home-eyebrow { font-size: var(--font-xs); }
  .home-title, .home-eyebrow { padding-left: 64px; }
  .home-tagline { padding-left: 64px; font-size: 16px; }
  .home-subtitle { padding-left: 64px; }
  #home-user { margin-left: 64px; }
  .hamburger-btn { top: 38px; left: 40px; }
  .menu-groups { padding: var(--space-8); gap: var(--space-6); }
  .menu-group[data-menu-group="admin"] .menu-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .menu-group[data-menu-group="report"] .menu-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .menu-group[data-menu-group="report"] .menu-item.full { grid-column: auto; }
  .menu-item { min-height: 185px; padding: 16px 20px; }
  .menu-icon { width: 66px; height: 66px; font-size: 33px; }
  .menu-label { font-size: 18px; }
  .menu-description { font-size: var(--font-sm); max-width: 220px; }
  .home-footer { padding: var(--space-6) var(--space-8); }
  .scroll-content { padding: var(--space-6); padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
  .topbar { min-height: 100px; padding: 20px 24px; }
  .modal-overlay { align-items: center; justify-content: center; padding: var(--space-6); }
  .modal { width: min(620px,100%); border-radius: var(--radius-lg); padding: var(--space-6); }
  .modal-handle { display: none; }
}
@media (min-width: 1200px) {
  body.theme-signed-in #app { padding-left: var(--rail-width); }
  body.theme-signed-in .side-drawer { width: var(--rail-width); max-width: none; transform: none; transition: none; box-shadow: none; z-index: 110; border-right: 1px solid #ffffff0d; }
  body.theme-signed-in .side-drawer.open { width: 280px; box-shadow: var(--shadow-lg); z-index: 301; }
  body.theme-signed-in .side-drawer:not(.open) .side-drawer-brand { padding: 28px 21px 24px; text-align: center; border-bottom: 0; }
  body.theme-signed-in .side-drawer:not(.open) .side-drawer-brand > :not(.rail-menu-toggle) { display: none; }
  body.theme-signed-in .side-drawer:not(.open) .rail-menu-toggle { display: grid; }
  body.theme-signed-in .side-drawer:not(.open) .side-drawer-items { padding: 5px 9px; }
  body.theme-signed-in .side-drawer:not(.open) .side-drawer-item { flex-direction: column; gap: 10px; text-align: center; padding: 13px 3px; font-size: 12px; font-weight: 450; margin-bottom: 28px; border-radius: 12px; }
  body.theme-signed-in .side-drawer:not(.open) .side-drawer-item .sdi-icon { width: 28px; }
  body.theme-signed-in .side-drawer:not(.open) .side-drawer-item .sdi-icon svg { width: 28px; height: 28px; }
  body.theme-signed-in .side-drawer:not(.open) [data-rail-route="naplo"], body.theme-signed-in .side-drawer:not(.open) [data-rail-route="refresh"], body.theme-signed-in .side-drawer:not(.open) [data-rail-route="munkaidő"]:not([aria-current="page"]), body.theme-signed-in .side-drawer:not(.open) .side-drawer-sep { display: none; }
  body.theme-signed-in .side-drawer:not(.open) .rail-footer { padding: 18px 10px 28px; text-align: center; }
  body.theme-signed-in .side-drawer:not(.open) .rail-footer::before { content: ''; display: block; width: 43px; height: 1px; margin: 0 auto 19px; background: #ffffff38; }
  body.theme-signed-in .side-drawer:not(.open) .rail-footer .side-drawer-item { font-size: 12px; margin-bottom: 24px; }
  body.theme-signed-in .side-drawer:not(.open) .sdb-version { font-size: 10px; display: block; color: #d3a5b4; padding: 0; background: transparent; border: 0; overflow-wrap: anywhere; }
  .home-header { min-height: 215px; padding: 40px clamp(64px,6.95vw,116px) 27px; }
  .home-eyebrow, .home-title, .home-tagline { padding-left: 0; max-width: 48%; }
  .home-eyebrow { font-size: 14px; letter-spacing: 4px; margin-bottom: 7px; }
  .home-title { font-size: clamp(54px,4.6vw,76px); font-weight: 750; letter-spacing: -2px; line-height: 1.06; }
  .home-tagline { font-size: clamp(13px,1.07vw,18px); margin-top: 12px; white-space: nowrap; }
  .home-header .hamburger-btn { display: none; }
  .home-header .home-date-widget { position: absolute; left: 41%; top: 64px; font-size: 23px; }
  .home-header #home-date { padding: 0; margin: 0; font-size: inherit; }
  #home-user { position: absolute; left: 41%; top: 134px; margin: 0; min-width: 208px; min-height: 49px; font-size: 17px; }
  .header-motto { display: block; }
  .home-scroll { padding-bottom: 0; }
  .menu-groups { display: grid; grid-template-columns: minmax(0,2.12fr) minmax(290px,1fr); padding: 34px 44px 0; gap: 22px; }
  .menu-group[data-menu-group="report"] .menu-grid { grid-template-columns: minmax(0,1fr); }
  .menu-group[data-menu-group="report"] .menu-item.full { min-height: 168px; padding: 20px 70px 20px 20px; gap: 28px; }
  .menu-group[data-menu-group="report"] .menu-icon { width: 94px; height: 94px; }
  .menu-group[data-menu-group="report"] .menu-icon img { width: 54px; height: 54px; }
  .menu-item { min-height: 184px; padding: 14px 25px; }
  .menu-icon { width: 78px; height: 78px; }
  .menu-label { font-size: clamp(16px,1.2vw,20px); }
  .menu-description { font-size: 14px; max-width: 210px; }
  .menu-item.full { min-height: 122px; padding: 16px 20px; }
  .menu-grid, .menu-group .menu-grid { gap: 18px; }
  .scroll-content { padding: 24px 32px; padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
  .scroll-content > :not(script) { max-width: var(--content-width); margin-left: auto; margin-right: auto; }
  .topbar { min-height: 100px; padding: 20px 32px; }
  .theme-header-meta { display: flex; }
  .topbar-title { font-size: 30px; }
  .topbar-worker-name.has-worker { max-width: 180px; }
  .topbar:has(.topbar-worker-name.has-worker) .theme-header-date { display: none; }
  .home-footer { padding: 38px 44px 22px; min-height: 94px; }
}
@media (hover: hover) and (pointer: fine) {
  .menu-item:hover { transform: translateY(-3px); box-shadow: var(--shadow); border-color: var(--tile-color); }
  .worker-btn:hover { border-color: var(--primary-border); box-shadow: var(--shadow); }
  .btn-primary:not(:disabled):hover { background: var(--primary-dark); }
  .btn-secondary:not(:disabled):hover, .bn-employee-dialog button:not(:disabled):hover { background: var(--surface2); }
  .btn-danger:not(:disabled):hover { background: #fce0e6; }
  .btn-success:not(:disabled):hover { background: #125e3b; }
  .settings-row[onclick]:hover { background: #f8faff; cursor: pointer; }
  .side-drawer-item:hover, .topbar-back:hover, .topbar-action:hover { background: #ffffff1f; }
  .pin-key:not(.empty):hover { background: #ffffff2c; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
@media print {
  body.theme-signed-in #app { padding-left: 0; }
  .theme-header-meta, .home-footer { display: none !important; }
  .scroll-content, .home-scroll { background: white !important; }
}
[hidden] { display: none !important; }
.menu-icon svg { width: 32px; height: 32px; color: var(--tile-color); }
.sdi-icon svg { width: 24px; height: 24px; display: block; }
.pin-user-icon svg { width: 24px; height: 24px; }
@media (min-width: 768px) { .topbar-title::before { content: 'MUNKAIDŐ. JUTTATÁSOK. KIFIZETÉSEK.'; display: block; margin-bottom: 6px; font-size: 9px; font-weight: 500; letter-spacing: 2px; color: #f8c9d8; } }

.menu-icon svg, .sdi-icon svg, .pin-user-icon svg, .theme-date-icon svg { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.havi-sticky-header .form-row > div { min-width: 0; }

/* Artwork and shared decorative elements; all are presentational. */
.menu-icon img { width: 48px; height: 48px; display: block; }
.menu-watermark { position: absolute; width: 104px; height: 104px; right: -10px; bottom: -10px; opacity: .12; filter: grayscale(1); mix-blend-mode: multiply; pointer-events: none; }
.menu-item.full .menu-watermark { width: 120px; height: 120px; right: 35px; }
.theme-date-icon { width: 28px; height: 32px; flex-shrink: 0; opacity: .8; }
.theme-date-icon svg { width: 100%; height: 100%; }
.theme-weekday { font-size: 13px; line-height: 19px; color: #f3c5d4; }
.theme-header-user::before { content: ''; width: 22px; height: 22px; background: url(assets/crown-color.svg) center / contain no-repeat; flex-shrink: 0; }
.theme-header-user[data-role="dolgozo"]::before { display: none; }
#home-user { margin-top: 10px; font-size: 13px; }
.header-motto { display: none; position: absolute; right: 5%; top: 87px; width: 165px; text-align: center; transform: rotate(-11deg); font-family: 'Caveat Variable', cursive; font-size: 30px; font-weight: 400; line-height: .9; color: #efc1d0; text-shadow: 0 1px 6px #461225; }
.footer-time { display: inline-flex; align-items: center; gap: 16px; }
.footer-time svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.rail-menu-toggle { display: none; place-items: center; width: 65px; height: 65px; font: inherit; font-size: 25px; color: #fff; cursor: pointer; background: linear-gradient(135deg,#ffffff24,#ffffff13); border: 1px solid #ffffff25; border-radius: 14px; box-shadow: 0 7px 18px #34071325; }
.rail-footer { flex-shrink: 0; padding: 12px; }
.rail-footer .sdb-version { color: #e5c4cf; font-size: 11px; padding: 6px 12px; }
.field-art { display: inline-block; width: 30px; height: 30px; vertical-align: middle; margin-right: 12px; }
.toggle-row { background: linear-gradient(110deg,#f9fcfa,#eef7f1); border-color: #cde6d6; }
.toggle-row:has(#m-jutalek) { background: linear-gradient(110deg,#fffaf2,#fff4e0); border-color: #ead6b9; }
.toggle-row:has(#m-szabadnap) { background: linear-gradient(110deg,#eff8fc,#eaf3ff); border-color: #cce2ef; }
.calc-box { position: relative; padding-left: 100px; min-height: 94px; box-shadow: 0 5px 14px #9828490a; }
.calc-box::before { content: ''; position: absolute; width: 60px; height: 60px; left: 16px; top: 16px; background: url(assets/wage-color.svg) center / 40px no-repeat, linear-gradient(140deg,#fff,#ffe0ee); border: 1px solid #ffffffcf; border-radius: 50%; box-shadow: 0 5px 10px #b9456410; }
@media (min-width: 1200px) {
  #home-user { margin-top: 0; font-size: 17px; }
  .header-motto { display: block; }
}
@media (max-width: 767px) {
  .menu-icon img { width: 39px; height: 39px; }
  .menu-watermark { width: 84px; height: 84px; }
  .menu-group-description { margin-bottom: 14px; }
  .calc-box { padding-left: 76px; }
  .calc-box::before { width: 46px; height: 46px; left: 13px; top: 20px; background-size: 33px; }
  .theme-date-icon { width: 22px; height: 26px; }
  .home-header { background-position: 40% center; }
}

#menu-naplo { display: none !important; }
.menu-item.full .menu-description { max-width: none; }

.menu-item.full .menu-copy { flex: 1; }

#screen-user-home .menu-grid { padding: 24px 16px; width: 100%; max-width: 1100px; margin: auto; }
#screen-user-home .home-title { font-size: clamp(30px,3.2vw,54px); }
@media (min-width: 768px) {
  #screen-user-home .menu-grid { padding: 32px; }
  #screen-user-home .menu-item.full { grid-column: auto; }
}
@media (min-width: 1200px) {
  #screen-user-home .home-header { min-height: 190px; }
}

.menu-group[data-menu-group="report"] .menu-description { max-width: 220px; }

.button-icon { width: 20px; height: 20px; vertical-align: -4px; margin-right: 8px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
@media (min-width: 1200px) { #screen-user-home .home-subtitle { padding-left: 0; } }

/* Detailed recording components shared through the central design system. */
.section-heading-copy { min-width: 0; display: flex; flex-direction: column; }
.section-heading-title { font-size: 16px; line-height: 22px; }
.section-heading-description { font-size: 12px; font-weight: 450; text-transform: none; letter-spacing: 0; color: #75839e; line-height: 18px; }
.work-group > summary:has(.section-heading-copy)::before { align-self: flex-start; height: 26px; margin-top: 2px; background: linear-gradient(#dc3265,#a21841); }
.work-group > summary:has(.section-heading-copy) .wg-caret { margin-left: 0; }
.entry-help { display: grid; place-items: center; width: 34px; height: 34px; margin-left: auto; flex-shrink: 0; border: 1px solid #f2cadb; border-radius: 50%; background: linear-gradient(135deg,#fff,#ffeaf3); color: #c11d51; font-size: 18px; text-transform: none; box-shadow: 0 4px 8px #a92a4810; cursor: pointer; }
.entry-worker-section { margin-bottom: 12px; }
.entry-panel .form-label { font-size: 12px; line-height: 16px; color: #566788; letter-spacing: 0; margin-bottom: 7px; }
.entry-panel .input { font-size: 15px; line-height: 20px; min-height: 42px; padding: 9px 12px; border-radius: 7px; box-shadow: inset 0 1px 2px #35475e03; }
.entry-panel .form-row > .form-section { margin-bottom: 0; }
.worker-copy { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.worker-name { font-size: 13px; line-height: 17px; font-weight: 750; color: #111a30; }
.worker-meta { font-size: 11px; line-height: 15px; color: #7483a1; font-weight: 450; }
.worker-btn:nth-child(5n+2) { --worker-accent: #c98321; --worker-tint: #fff5df; }
.worker-btn:nth-child(5n+3) { --worker-accent: #2d9950; --worker-tint: #e7fae8; }
.worker-btn:nth-child(5n+4) { --worker-accent: #8241bf; --worker-tint: #f1e7ff; }
.worker-btn:nth-child(5n+5) { --worker-accent: #2869b2; --worker-tint: #e5f2ff; }
.worker-btn.selected::after { box-shadow: 0 3px 7px #ac285334; }
.date-input-row { display: grid; grid-template-columns: minmax(0,1fr) 110px; align-items: center; gap: 12px; }
.weekday-badge { display: grid; place-items: center; min-height: 38px; padding: 8px; border-radius: 8px; color: #a62446; background: linear-gradient(130deg,#fff1f7,#fbe5ef); font-size: 12px; font-weight: 750; text-transform: uppercase; }
.input-with-icon { position: relative; }
.input-with-icon input { padding-right: 42px; }
.input-with-icon svg { position: absolute; right: 12px; top: calc(50% - 9px); width: 18px; height: 18px; color: #4a5787; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }
.entry-art { --art-tint: #f1f5fd; --art-border: #dce7f8; display: grid; place-items: center; width: 42px; height: 38px; background: linear-gradient(140deg,#fff,var(--art-tint)); border: 1px solid var(--art-border); border-radius: 10px; flex-shrink: 0; box-shadow: 0 3px 7px #31426808,inset 0 1px 0 #fff; }
.entry-art img { width: 29px; height: 29px; display: block; }
.tone-green { --art-tint: #e8fbef; --art-border: #d0ecd8; }
.tone-gold, .entry-field-row-gold .entry-art { --art-tint: #fff5df; --art-border: #f4e1bd; }
.entry-field-row { display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 4px 14px 4px 8px; background: linear-gradient(125deg,#fcfdff,#f4f7fc); border: 1px solid var(--border); border-radius: 8px; }
.entry-field-row .form-label { white-space: nowrap; margin: 0; font-size: 11px; }
.entry-field-row .input { flex: 1; min-width: 0; min-height: 36px; font-size: 13px; padding: 7px 12px; }
.entry-revenue-row { display: flex; align-items: flex-start; gap: 12px; padding: 8px; border: 1px solid #cce0f8; border-radius: 8px; background: linear-gradient(130deg,#f5faff,#e7f1ff); }
.entry-revenue-row .entry-art { width: 42px; height: 42px; border-radius: 50%; margin-top: 3px; }
.entry-revenue-copy { min-width: 0; }
.entry-revenue-copy .form-label { font-size: 11px; margin: 0; }
.munkaido-side-fields .toggle-label { display: flex; align-items: center; gap: 12px; min-width: 0; font-size: 12px; line-height: 17px; color: #152340; }
.entry-note-row { display: flex; align-items: center; gap: 12px; }
.entry-note-row .entry-art { --art-tint: #f1e8ff; --art-border: #e2d3f8; width: 50px; height: 50px; }
.entry-note-row > div { flex: 1; min-width: 0; }
.entry-note-row .form-label { font-size: 11px; line-height: 14px; margin-bottom: 4px; }
.entry-panel .entry-note-row .input { min-height: 40px; padding-top: 8px; padding-bottom: 8px; }
.entry-panel .calc-box { padding-top: 12px; padding-bottom: 12px; }
.entry-panel .calc-box-label { font-size: 13px; color: #a01742; margin-bottom: 2px; line-height: 16px; }
.entry-panel .calc-box-value { line-height: 1.05; }
.entry-panel .calc-box-note { font-size: 12px; line-height: 16px; margin-top: 2px; }
.entry-revenue-row #m-forgalom-val { font-size: 18px !important; line-height: 20px; }
.entry-revenue-row #m-forgalom-note { line-height: 14px; margin-top: 2px !important; }
.munkaido-side-fields .toggle-row .entry-art { height: 34px; }
.entry-panel .mini-calendar-day { min-height: 40px; }
.entry-panel .mini-calendar-legend { margin-top: 34px; }
.entry-panel .mini-calendar-head { margin-bottom: 10px; }
.entry-panel .mini-calendar-weekdays { margin-bottom: 8px; }
.entry-panel .mini-calendar-weekdays span { padding: 8px 0; }
.entry-panel .mini-calendar-legend .legend-dot { width: 12px; height: 12px; border: 0; }
.entry-panel .mini-calendar-legend .legend-dot.is-work { background: #ffa4bc; }
.entry-panel .mini-calendar-legend .legend-dot.is-vacation { background: #adcfff; }
.entry-panel .mini-calendar-legend .legend-dot.is-dayoff { background: #8edf9f; }
.entry-panel .mini-calendar-legend .legend-dot.is-selected { background: #bf97e8; }
.entry-save { min-height: 56px; font-size: 16px; border-radius: 8px; background: linear-gradient(130deg,#b0254b,#991c3e); box-shadow: 0 5px 12px #94244213; }
.entry-save svg { width: 24px; height: 24px; margin-right: 15px; vertical-align: -6px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.entry-list-header { display: flex; align-items: center; gap: 24px; margin-bottom: 16px; }
.entry-list-copy { flex: 0 1 335px; min-width: 0; }
.entry-list-copy .list-group-label { margin-bottom: 0; font-size: 16px; gap: 14px; }
.entry-list-copy .section-heading-description { padding-left: 19px; }
.entry-list-header .list-filter-row { flex: 1; min-width: 0; margin: 0; gap: 14px; }
.entry-list-header .list-filter-row input { min-height: 42px; font-size: 14px; padding: 9px 12px; }
.entry-list-header .list-filter-row button { min-height: 42px; width: 42px; padding: 0; font-size: 18px; }
.entry-records { padding: 18px; }
.detail-list-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-bottom: var(--space-3); }
.detail-list-actions > .btn { max-width: 100%; }
.entry-records .empty-state { background: linear-gradient(120deg,#fcfdff,#f6f9ff); border: 1px solid var(--border); padding: 14px 18px; }
.entry-records .empty-state-icon { margin-bottom: 8px; }
.entry-records .empty-state-icon img { width: 44px; height: 44px; display: block; margin: auto; }
.entry-records .empty-state-text { font-size: 12px; color: #3c4877; }
.empty-state-note { margin-top: 3px; color: #8190ae; font-size: 11px; line-height: 17px; }
.theme-help-dialog { width: min(560px,calc(100vw - 24px)); max-height: calc(100dvh - 24px); border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); color: var(--text); padding: 24px; margin: auto; box-shadow: var(--shadow-lg); font-family: var(--font); }
.theme-help-dialog::backdrop { background: #26192d66; }
.theme-help-dialog h2 { font-size: 23px; margin: 0 0 16px; }
.theme-help-dialog p { font-size: 14px; line-height: 1.6; margin-bottom: 14px; }
.back-label { display: inline; font-size: 13px; }
.topbar .topbar-back { border: 0; background: transparent; }
.topbar .header-motto { display: none; }
@media (min-width: 1200px) {
  .theme-recording .topbar { min-height: 102px; padding: 18px 32px; padding-right: 250px; gap: 20px; }
  .theme-recording .topbar-title { flex: 0 1 auto; max-width: 38%; font-size: clamp(25px,2.35vw,34px); letter-spacing: -.5px; }
  .theme-recording .topbar-title::before { font-size: 9px; font-weight: 400; letter-spacing: 2.5px; margin-bottom: 7px; }
  .theme-recording .topbar-back { width: 78px; gap: 10px; justify-content: flex-start; border-radius: 0; border-right: 1px solid #ffffff45; }
  .theme-recording .back-label { display: inline; }
  .theme-recording .topbar-worker-name.has-worker { display: none; }
  .theme-recording .theme-header-meta { position: absolute; left: 48%; top: 34px; gap: 60px; }
  .theme-recording .theme-header-date { display: flex !important; gap: 12px; }
  .theme-recording .theme-date-icon { width: 24px; height: 28px; }
  .theme-recording .theme-date-value { font-size: 16px; line-height: 23px; }
  .theme-recording .theme-weekday { font-size: 11px; line-height: 17px; }
  .theme-recording .theme-header-user { min-width: 158px; min-height: 38px; padding: 7px 14px; font-size: 12px; gap: 10px; }
  .theme-recording .theme-header-user::before { width: 18px; height: 18px; }
  .theme-recording .topbar .header-motto { display: block; right: 3%; top: 23px; width: 150px; font-size: 24px; }
  .theme-recording .scroll-content { padding: 14px 30px 14px 22px; }
  .entry-panel .munkaido-main-row { gap: 8px; grid-template-columns: minmax(0,1.25fr) minmax(0,1fr); }
  .entry-panel .munkaido-side-fields > :not(:first-child) { margin-left: 10px; }
  .entry-panel .munkaido-side-fields > .calc-box { width: calc(100% - 10px); }
  .entry-panel .munkaido-side-fields > :first-child { margin-bottom: 5px; }
}
@media (max-width: 767px) {
  .section-heading-description { font-size: 11px; line-height: 16px; }
  .section-heading-title { font-size: 15px; }
  .entry-panel .form-label { font-size: 11px; }
  .date-input-row { grid-template-columns: minmax(0,1fr) 86px; gap: 8px; }
  .weekday-badge { font-size: 10px; }
  .entry-field-row { flex-wrap: wrap; gap: 8px; }
  .entry-field-row .input { flex-basis: calc(100% - 56px); margin-left: 50px; }
  .entry-field-row .form-label { white-space: normal; flex: 1; }
  .entry-list-header { flex-direction: column; align-items: stretch; gap: 12px; }
  .entry-list-copy { flex-basis: auto; }
  .entry-list-header .list-filter-row { gap: 6px; }
  .entry-list-header .list-filter-row input { font-size: 12px; flex-basis: 105px; }
  .entry-records { padding: 14px; }
  .entry-save { font-size: 14px; min-height: 50px; }
  .entry-save svg { width: 20px; height: 20px; margin-right: 8px; vertical-align: -5px; }
}

/* Shared detailed surfaces: editors, financial entries, lists, settings, reports and dialogs. */
:root {
  --surface-soft: #f9fbff;
  --panel-inset: 20px;
  --detail-art-size: 52px;
  --detail-row-size: 32px;
}
.detail-art { display: grid; place-items: center; width: var(--detail-art-size); height: var(--detail-art-size); flex-shrink: 0; border: 1px solid #e4e8f2; border-radius: 14px; background: linear-gradient(145deg,#fff,#f0f3fb); box-shadow: 0 4px 10px #34476508,inset 0 1px 0 #fff; }
.detail-art img { width: 36px; height: 36px; display: block; }
.detail-page-intro { display: flex; align-items: center; gap: 18px; padding: 20px 24px; margin-bottom: 20px; border: 1px solid #e5d8e2; border-radius: var(--radius); background: linear-gradient(115deg,#fff,#fff5f8 65%,#f4f2fd); box-shadow: var(--shadow-sm); position: relative; overflow: hidden; }
.detail-page-intro::after { content: ''; position: absolute; right: -45px; top: -80px; width: 230px; height: 230px; border: 22px solid #b57fa808; border-radius: 50%; pointer-events: none; }
.detail-intro-art { width: 64px; height: 64px; border-radius: 50%; background: linear-gradient(145deg,#fff,#fcebf3); border-color: #f1d6e2; box-shadow: 0 5px 15px #92204610; }
.detail-intro-art img { width: 44px; height: 44px; }
.detail-intro-copy { min-width: 0; z-index: 1; }
.detail-intro-copy h2 { font-size: 22px; letter-spacing: -.4px; line-height: 1.3; margin: 0 0 4px; }
.detail-intro-copy p { font-size: 13px; line-height: 1.55; color: var(--text2); margin: 0; }
.detail-entry-panel .worker-select-grid { gap: 12px; }
.detail-entry-panel .form-label { font-size: 12px; line-height: 18px; color: #566788; }
.detail-entry-panel .admin-entry-layout { gap: 20px; grid-template-columns: minmax(0,1.25fr) minmax(0,1fr); }
.detail-entry-panel .calendar-date-section { min-height: 0; }
.detail-entry-panel .calendar-date-section > .form-label { display: block; margin-bottom: 6px; }
.detail-entry-panel .calendar-date-section > input[type="date"] { display: block; margin-bottom: 14px; min-height: 42px; font-size: 15px; }
.detail-entry-panel .mini-calendar { padding: 16px; }
.detail-entry-panel .admin-entry-side { gap: 16px; }
.detail-amount-field, .detail-note-field { position: relative; padding: 18px 18px 18px 86px; border: 1px solid #e3dbe6; border-radius: 10px; background: linear-gradient(125deg,#fff,#fbf4f8); }
.detail-amount-field > .detail-art, .detail-note-field > .detail-art { position: absolute; left: 16px; top: 18px; }
.detail-amount-field .input { margin-top: 6px; font-size: 22px; font-weight: 700; min-height: 54px; font-variant-numeric: tabular-nums; }
.detail-amount-field .input::placeholder { font-size: 15px; font-weight: 450; }
.detail-note-field { background: linear-gradient(125deg,#fff,#f6f2fc); border-color: #e1d9ee; }
.detail-note-field .input { margin-top: 6px; }
.detail-note-field > .detail-art { background: linear-gradient(145deg,#fff,#f0e7fd); border-color: #e6d6f7; }
.detail-entry-tip { border: 1px solid var(--border); border-radius: 10px; padding: 16px 18px; background: var(--surface-soft); }
.detail-tip-label { color: var(--text); font-size: 12px; font-weight: 750; }
.detail-entry-tip p { color: var(--text2); font-size: 12px; line-height: 1.6; margin: 5px 0 0; }
.detail-button-icon svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; display: block; }
.detail-editor-grid { display: grid; align-content: start; gap: 20px; }
.detail-editor-grid > .detail-page-intro { margin-bottom: 0; }
.detail-form-card { padding: var(--panel-inset); border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); min-width: 0; }
.detail-panel-heading { display: flex; align-items: center; gap: 16px; margin-bottom: 22px; padding-bottom: 18px; border-bottom: 1px solid #e9edf5; }
.detail-panel-heading .section-heading-title { font-size: 17px; font-weight: 750; }
.detail-form-card > .form-section:last-child { margin-bottom: 0; }
.detail-form-card .form-label { font-size: 12px; letter-spacing: .2px; }
.detail-form-card .form-section > div[style*="font-size:12px"] { color: var(--text2) !important; }
.detail-form-actions { display: flex; gap: 12px; }
.detail-form-actions .btn { flex: 1; min-height: 54px; }
.theme-detailed .card-header { background: linear-gradient(120deg,#fff9fc,#f7f9ff); border-bottom: 1px solid #edf0f6; padding: 18px 20px; }
.detail-avatar { width: 52px; height: 52px; display: grid; place-items: center; flex-shrink: 0; border: 1px solid #f1cfdc; border-radius: 50%; background: linear-gradient(145deg,#fff,#fbe5ef); box-shadow: 0 4px 10px #9b264710; font-size: 18px; font-weight: 750; color: var(--primary); }
.theme-detailed .card-name { flex: 1; font-size: 17px; }
.theme-detailed .card-badge { border: 1px solid #cbe7d4; background: #effaf2; font-weight: 700; padding: 4px 9px; border-radius: 999px; }
.theme-detailed .card-badge.inactive { background: var(--surface2); border-color: var(--border); }
.theme-detailed .card-row { padding: 10px 0; gap: 12px; align-items: center; border-bottom: 1px solid #edf0f6; }
.theme-detailed .card-row:last-child { border-bottom: 0; }
.theme-detailed .card-row-label, .theme-detailed .summary-row-label { display: flex; align-items: center; gap: 10px; min-width: 0; }
.detail-row-art { width: var(--detail-row-size); height: var(--detail-row-size); border-radius: 8px; box-shadow: none; }
.detail-row-art img { width: 24px; height: 24px; }
.theme-detailed .card-row-value { text-align: right; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.theme-detailed .card-actions { border-top: 1px solid #edf0f6; padding: 14px 20px; background: #fcfdff; }
.theme-detailed .record-item { position: relative; }
.theme-detailed .record-header { justify-content: flex-start; padding: 14px 18px; background: linear-gradient(120deg,#fff,#f8faff); }
.detail-record-art { width: 42px; height: 42px; border-radius: 11px; }
.detail-record-art img { width: 30px; height: 30px; }
.theme-detailed .record-name { flex: 1; min-width: 0; }
.theme-detailed .record-date { padding: 5px 9px; border: 1px solid #e8edf5; border-radius: 6px; background: #f7f9fe; font-size: 11px; }
.theme-detailed .record-details { padding: 3px 18px 16px; margin-left: 54px; }
.theme-detailed .record-detail { line-height: 1.65; }
.theme-detailed .record-amount { font-size: 18px; font-weight: 750; font-variant-numeric: tabular-nums; }
.theme-detailed .empty-state { background: linear-gradient(130deg,#fff,#f6f9ff); border: 1px solid var(--border); padding: 28px 20px; box-shadow: var(--shadow-sm); }
.theme-detailed .empty-state-icon img { width: 54px; height: 54px; display: block; margin: 0 auto; }
.theme-detailed .empty-state-text { font-size: 13px; line-height: 1.65; }
.detail-filter-panel { padding: 20px; border: 1px solid var(--border); border-radius: var(--radius); background: linear-gradient(130deg,#fff,#f8faff); box-shadow: var(--shadow); margin-bottom: 20px; }
.theme-detailed .summary-header { position: relative; padding: 24px; min-height: 130px; align-items: center; background: linear-gradient(120deg,#791b38,#a42c51); overflow: hidden; }
.theme-detailed .summary-header::after { content: ''; position: absolute; right: -70px; bottom: -130px; width: 300px; height: 300px; border: 36px solid #ffffff07; border-radius: 50%; pointer-events: none; }
.theme-detailed .summary-header-left { padding-left: 74px; position: relative; min-width: 0; }
.detail-summary-art { position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 56px; height: 56px; border-radius: 50%; background: #ffffffed; border-color: #ffffff65; }
.theme-detailed .summary-name { font-size: 22px; font-weight: 750; line-height: 1.3; }
.theme-detailed .summary-month { color: #f0c4d3; font-size: 12px; margin-top: 7px; }
.theme-detailed .summary-total { font-size: clamp(26px,2.5vw,38px); line-height: 1.25; white-space: nowrap; }
.theme-detailed .summary-total-label { font-size: 11px; color: #f0c4d3; margin-top: 4px; }
.theme-detailed .summary-row { padding: 12px 0; }
.theme-detailed .summary-row-value { flex-shrink: 0; font-weight: 700; font-variant-numeric: tabular-nums; }
.theme-detailed .summary-section { margin-top: 22px; padding: 16px; border: 1px solid #e6eaf2; border-radius: 10px; background: #f9fbff; }
.theme-detailed .summary-section-title { font-size: 12px; color: var(--text); border-bottom: 1px solid var(--border); padding-bottom: 10px; margin-bottom: 6px; }
.theme-detailed .summary-detail-row { font-size: 12px; padding: 8px 0; border-bottom: 1px solid #edf0f6; line-height: 1.7; }
.theme-detailed .summary-detail-row:last-child { border-bottom: 0; }
.detail-settings-grid { display: grid; grid-auto-rows: max-content; align-items: start; align-content: start; gap: 20px; }
.detail-settings-grid > .detail-page-intro { margin: 0; }
.detail-settings-grid.settings-packed { grid-auto-rows: 1px; row-gap: 0; }
.detail-settings-grid.settings-packed > * { height: max-content; align-self: start; }
.detail-settings-section { border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); overflow: hidden; min-width: 0; }
.detail-settings-section > .section-title { margin: 0; padding: 18px 20px; border: 0; font-size: 15px; background: linear-gradient(120deg,#fff7fb,#f6f8fe); border-bottom: 1px solid var(--border); }
.detail-settings-section .settings-group { border: 0; box-shadow: none; border-radius: 0; margin-bottom: 0; }
.detail-settings-section .settings-row { justify-content: flex-start; gap: 14px; padding: 14px 18px; min-height: 76px; }
.detail-settings-art { width: 42px; height: 42px; border-radius: 11px; }
.detail-settings-art img { width: 28px; height: 28px; }
.detail-settings-section .settings-label { flex: 1; line-height: 1.6; font-size: 12px; }
.detail-settings-section .settings-label b { display: block; font-size: 11px; color: var(--text2); }
.detail-settings-section .settings-value { font-size: 12px; }
#veszelyes-zona-group { background: #fff8fa; }
.detail-permission { background: linear-gradient(120deg,#fff,#f8faff) !important; }
.detail-permission > input { margin-left: auto; order: 3; }
.detail-permission > span:not(.detail-art) { flex: 1; min-width: 0; }
.detail-access-note { grid-column: 1 / -1; margin-bottom: 20px; padding: 14px 18px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); color: var(--text2); font-size: 13px; line-height: 1.6; }
.detail-permission-hint { margin: 14px 0 0; color: var(--text2); font-size: 12px; line-height: 1.7; }
.detail-planner-toolbar { padding: 18px 20px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); }
.detail-planner-instructions { padding: 14px 18px; border: 1px solid #d7e4f5; border-radius: 10px; background: #f1f7ff; margin-bottom: 16px !important; }
.detail-planner-table { box-shadow: var(--shadow); }
.detail-planner-legend { padding: 14px 16px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); margin-top: 16px !important; }
.detail-planner-copy { padding: 20px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); }
#beosztas-table th { padding: 10px 7px; }
#beosztas-table .b-cell { min-width: 36px; height: 44px; }
.modal-overlay .modal { overflow-x: hidden; }
.modal-title, .bn-employee-dialog h2 { position: relative; padding-left: 66px; min-height: 52px; display: flex; align-items: center; line-height: 1.3; }
.modal-title::before, .bn-employee-dialog h2::before { content: ''; position: absolute; left: 0; top: 0; width: 50px; height: 50px; border: 1px solid #f0d8e3; border-radius: 14px; background: var(--dialog-art,url(assets/shield-color.svg)) center / 36px no-repeat,linear-gradient(140deg,#fff,#fcecf4); box-shadow: 0 4px 9px #9b264708; }
.modal-sub { line-height: 1.65; font-size: 13px; }
.bn-employee-dialog .bn-employee-ledger article { background: linear-gradient(125deg,#fff,#f8faff); border-radius: 12px; }
.bn-employee-dialog .bn-employee-ledger article > strong { display: block; border-bottom: 1px solid var(--border); padding-bottom: 10px; color: var(--primary); }
.bn-employee-dialog .bn-payroll-result { padding: 18px; border: 1px solid #edc9db; border-radius: 10px; background: #fff2f7; color: var(--primary); font-size: 22px; font-weight: 750; }
.bn-employee-dialog [role="status"] { overflow-wrap: anywhere; }
@media (min-width: 768px) {
 .detail-access-note { margin-bottom: 0; }
 .detail-settings-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .detail-settings-grid > .detail-page-intro, .detail-settings-grid > div:last-child { grid-column: 1 / -1; }
 .detail-editor-grid { grid-template-columns: repeat(2,minmax(0,1fr)); align-items: start; }
 .detail-editor-grid > .detail-page-intro, .detail-editor-grid > .detail-form-actions { grid-column: 1 / -1; }
 #dolgozok-list, #vezetok-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-content: start; gap: 20px; }
 #dolgozok-list > .detail-page-intro, #vezetok-list > .detail-page-intro, #dolgozok-list > .empty-state, #vezetok-list > .empty-state { grid-column: 1 / -1; margin-bottom: 0; }
 #dolgozok-list > .card, #vezetok-list > .card { margin-bottom: 0; }
}
@media (min-width: 1200px) {
 .theme-detailed .topbar { gap: 16px; }
 .theme-detailed .topbar-title { min-width: 0; }
 #dolgozok-list { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 767px) {
 .detail-page-intro { gap: 12px; padding: 16px; }
 .detail-intro-art { width: 50px; height: 50px; }
 .detail-intro-art img { width: 34px; height: 34px; }
 .detail-intro-copy h2 { font-size: 18px; }
 .detail-intro-copy p { font-size: 11px; }
 .detail-form-card { --panel-inset: 16px; }
 .detail-panel-heading { gap: 12px; }
 .detail-panel-heading .detail-art { width: 44px; height: 44px; }
 .detail-panel-heading .section-heading-title { font-size: 16px; }
 .detail-entry-panel .admin-entry-layout { grid-template-columns: minmax(0,1fr); }
 .detail-amount-field, .detail-note-field { padding: 16px 14px 16px 72px; }
 .detail-amount-field > .detail-art, .detail-note-field > .detail-art { width: 42px; height: 42px; left: 14px; top: 16px; }
 .detail-amount-field > .detail-art img, .detail-note-field > .detail-art img { width: 30px; height: 30px; }
 .detail-filter-panel { padding: 16px; }
 .theme-detailed .summary-header { flex-direction: column; align-items: stretch; gap: 18px; padding: 20px; }
 .theme-detailed .summary-header-right { align-items: flex-start; text-align: left; padding-left: 74px; }
 .theme-detailed .summary-name { font-size: 18px; }
 .theme-detailed .summary-total { font-size: 30px; }
 .theme-detailed .summary-row-label { font-size: 12px; gap: 8px; }
 .theme-detailed .summary-row-value { font-size: 13px; }
 .theme-detailed .record-details { margin-left: 0; }
 .theme-detailed .record-date { max-width: 100%; white-space: normal; }
 .detail-settings-section .settings-row { flex-wrap: wrap; gap: 10px; padding: 12px 14px; }
 .detail-settings-section .settings-row .input { flex-basis: 100%; }
 .detail-settings-section .settings-label { flex-basis: calc(100% - 106px); }
 .detail-form-actions { flex-direction: column; }
 .detail-editor-grid, .detail-settings-grid { gap: 16px; }
 .theme-detailed .card-header { flex-wrap: wrap; }
 .theme-detailed .card-row { align-items: flex-start; }
 .theme-detailed .card-row-label { flex: 1; }
 .theme-detailed .card-row-value { max-width: 48%; }
 .modal-title, .bn-employee-dialog h2 { font-size: 21px; }
}
@media (hover: hover) and (pointer: fine) {
 .detail-settings-section .settings-row[onclick]:hover { background: #fff7fb; }
 .theme-detailed .record-item:hover { border-color: #d3cadb; }
}
@media print {
 .detail-page-intro, .detail-art, .detail-avatar, .detail-entry-tip { display: none !important; }
 .theme-detailed .summary-header { background: white !important; color: black !important; padding: 10px !important; min-height: 0 !important; flex-direction: row !important; }
 .theme-detailed .summary-header::after { display: none; }
 .theme-detailed .summary-header-left, .theme-detailed .summary-header-right { padding-left: 0 !important; }
 .theme-detailed .summary-month, .theme-detailed .summary-total-label { color: #333 !important; }
 .theme-detailed .summary-row-label { display: inline; }
 .theme-detailed .summary-section { background: white; box-shadow: none; }
}

.detail-entry-panel > summary .wg-caret { margin-left: auto !important; }
.detail-settings-grid > .detail-settings-section, .detail-editor-grid > .detail-form-card { width: 100%; margin-left: 0; margin-right: 0; }
.detail-entry-panel .calc-box-value { font-size: 22px; line-height: 1.35; }
.detail-global-total { position: relative; padding-left: 90px !important; }
.detail-global-total::before { content: ''; position: absolute; left: 20px; top: calc(50% - 26px); width: 52px; height: 52px; border-radius: 50%; border: 1px solid #f5d3df; background: url(assets/money-color.svg) center / 34px no-repeat,linear-gradient(140deg,#fff,#fff1f5); }
@media (min-width: 1200px) {
 body.theme-all-pages:not(.theme-recording) .topbar { min-height: 102px; padding: 18px 32px; gap: 20px; }
 body.theme-all-pages:not(.theme-recording) .topbar-back { width: 78px; gap: 10px; justify-content: flex-start; border-radius: 0; border-right: 1px solid #ffffff45; }
 body.theme-all-pages:not(.theme-recording) .back-label { display: inline; }
 body.theme-all-pages:not(.theme-recording) .topbar-title { flex: 0 1 auto; max-width: 38%; font-size: clamp(25px,2.35vw,34px); letter-spacing: -.5px; }
 body.theme-all-pages:not(.theme-recording) .topbar-worker-name.has-worker { display: none; }
 body.theme-all-pages:not(.theme-recording) .topbar-action { margin-left: auto; }
 body.theme-all-pages:not(.theme-recording) .theme-header-meta { position: absolute; left: 48%; top: 34px; gap: 60px; }
 body.theme-all-pages:not(.theme-recording) .theme-header-date { display: flex !important; gap: 12px; }
 body.theme-all-pages:not(.theme-recording) .theme-date-icon { width: 24px; height: 28px; }
 body.theme-all-pages:not(.theme-recording) .theme-date-value { font-size: 16px; line-height: 23px; }
 body.theme-all-pages:not(.theme-recording) .theme-weekday { font-size: 11px; line-height: 17px; }
 body.theme-all-pages:not(.theme-recording) .theme-header-user { min-width: 158px; min-height: 38px; padding: 7px 14px; font-size: 12px; gap: 10px; }
 body.theme-all-pages:not(.theme-recording) .theme-header-user::before { width: 18px; height: 18px; }
}
@media (min-width: 1200px) and (max-width: 1350px) { body.theme-all-pages:not(.theme-recording) .theme-header-date { display: none !important; } }
@media print { .detail-global-total::before { display: none; } .detail-global-total { padding-left: 14px !important; } }
.detail-editor-grid { grid-auto-rows: max-content; }
.detail-editor-grid > .detail-page-intro, .detail-editor-grid > .detail-form-actions { width: 100%; margin-left: 0; margin-right: 0; }
.detail-editor-grid > .detail-page-intro { min-height: 106px; }
.detail-confirm-icon { display: grid; place-items: center; margin: 0 auto 18px !important; width: 64px; height: 64px; border-radius: 50%; border: 1px solid #f0d8e3; background: linear-gradient(140deg,#fff,#fcecf4); }
.detail-confirm-icon img { width: 44px; height: 44px; }
.theme-detailed .scroll-content > .detail-page-intro { width: 100%; margin-left: 0; margin-right: 0; }
#dolgozok-list, #vezetok-list { grid-auto-rows: max-content; }
#dolgozok-list > .card, #vezetok-list > .card { width: 100%; margin-left: 0; margin-right: 0; align-self: start; }
.theme-detailed .topbar-action { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }

/* Dashboard islands share one surface component and two restrained variants. */
.dashboard-islands { gap: var(--space-6); }
.dashboard-island {
  --island-accent: var(--primary);
  --island-panel: var(--island-surface);
  --island-heading: var(--island-header);
  --island-outline: var(--island-border);
  align-self: start; background: var(--island-panel); border: 1px solid var(--island-outline);
  border-radius: var(--radius-lg); box-shadow: var(--shadow); min-width: 0;
}
.dashboard-island[data-menu-group="report"] {
  --island-accent: var(--violet); --island-panel: var(--island-report-surface);
  --island-heading: var(--island-report-header); --island-outline: var(--island-report-border);
}
.dashboard-island-header {
  padding: 14px 18px; background: linear-gradient(115deg,var(--island-heading),var(--island-panel));
  border-bottom: 1px solid var(--island-outline); border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}
.dashboard-island-header .menu-group-label { margin: 0; gap: 12px; font-size: 18px; line-height: 26px; letter-spacing: 1px; }
.dashboard-island-header .menu-group-label::before { width: 5px; height: 26px; background: var(--island-accent); }
.dashboard-island[data-menu-group="report"] .menu-group-label::before { background: var(--island-accent); }
.dashboard-island-header .menu-group-description { margin: 2px 0 0; padding-left: 17px; font-size: 13px; line-height: 19px; }
.dashboard-island .dashboard-island-body { padding: 16px; }
@media (max-width: 767px) {
  .dashboard-islands { padding: 20px 16px; }
  .dashboard-island-header { padding: 14px 16px; }
  .dashboard-island-header .menu-group-label { font-size: 16px; }
  .dashboard-island .dashboard-island-body { padding: 12px; }
}
@media (max-width: 479px) {
  .dashboard-island[data-menu-group="admin"] .menu-grid { grid-template-columns: minmax(0,1fr); }
  .dashboard-island .menu-item { flex-direction: row; align-items: center; min-height: 112px; gap: 12px; padding: 14px 46px 14px 14px; }
  .dashboard-island .menu-copy { flex: 1; }
  .dashboard-island .menu-description { max-width: none; }
  .dashboard-island .menu-item::after { top: calc(50% - 14px); }
  .dashboard-island .menu-watermark { width: 76px; height: 76px; right: 18px; }
}
@media (min-width: 1200px) {
  .dashboard-islands { padding: 24px 32px 0; gap: 28px; }
  .dashboard-islands:has(> .dashboard-island[hidden]) { grid-template-columns: minmax(0,1fr); }
  .dashboard-islands:has(> .dashboard-island[hidden]) .dashboard-island[data-menu-group="report"] .menu-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  #screen-home .home-footer { padding: 22px 32px 16px; min-height: 0; }
}
@media (min-width: 1200px) and (max-width: 1499px) {
  .dashboard-island[data-menu-group="report"] .menu-item.full { gap: 16px; padding: 18px 54px 18px 16px; }
  .dashboard-island[data-menu-group="report"] .menu-icon { width: 64px; height: 64px; }
  .dashboard-island[data-menu-group="report"] .menu-icon img { width: 42px; height: 42px; }
}

/* One shared inactive appearance for everything below the worker picker. */
.screen.needs-worker .work-group-body > .worker-required-note ~ *,
.screen.needs-worker .scroll-content > .entry-records,
.screen.needs-worker .havi-sticky-header > .worker-required-note ~ *,
.screen.needs-worker .havi-sticky-header ~ * { opacity: .42; filter: saturate(.5); }
.screen.needs-worker .work-group-body > .worker-required-note ~ * :is(input,select,textarea,button):disabled,
.screen.needs-worker .entry-records :is(input,select,textarea,button):disabled,
.screen.needs-worker .havi-sticky-header > .worker-required-note ~ * :is(input,select,textarea,button):disabled { opacity: 1; }
.screen.needs-worker .work-group-body > .worker-required-note ~ * .toggle input:disabled + .toggle-slider { opacity: 1; }
@media (max-width: 767px) {
  .theme-sync-bar { padding: 5px 12px; gap: 8px; align-items: flex-start; }
  .theme-sync-caption { padding-top: 4px; font-size: 10px; }
  .shared-active-indicator { max-width: 100%; font-size: 10px; }
}
@media print { .theme-sync-bar { display: none !important; } }

/* Home layout follows available CSS space, including browser/Windows zoom.
   Keep text readable; compact decoration instead of scaling the whole app. */
.dashboard-islands { max-width: none; align-items: stretch; }
.dashboard-island { width: 100%; }
.home-header .home-date-widget { align-items: center; }
.home-header #home-date { padding: 0; margin: 0; }
@media screen and (min-width: 768px) {
  #screen-home .home-header {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(190px, auto);
    grid-template-areas: 'eyebrow date' 'title date' 'tagline user';
    align-items: center; gap: 4px 24px; min-height: 0;
    padding: 20px 28px 20px 88px;
  }
  #screen-home .home-eyebrow { grid-area: eyebrow; padding: 0; margin: 0; max-width: none; font-size: 12px; letter-spacing: 3px; }
  #screen-home .home-title { grid-area: title; padding: 0; max-width: none; font-size: clamp(32px, 3.5vw, 54px); line-height: 1.12; letter-spacing: -1px; }
  #screen-home .home-tagline { grid-area: tagline; padding: 0; margin: 4px 0 0; max-width: none; white-space: normal; font-size: 14px; }
  #screen-home .home-date-widget { grid-area: date; position: static; font-size: 18px; gap: 10px; }
  #screen-home #home-user { grid-area: user; position: static; margin: 0; min-width: 0; min-height: 40px; padding: 6px 14px; font-size: 14px; justify-self: start; }
  #screen-home .hamburger-btn { top: 30px; left: 24px; }
  #screen-home .header-motto { display: none; }
  .dashboard-islands { display: grid; grid-template-columns: minmax(0, 1fr); padding: 20px 24px 0; gap: 20px; margin: 0; }
  .dashboard-island .dashboard-island-body { padding: 14px; gap: 14px; }
  .dashboard-island .menu-item { min-height: 150px; padding: 14px 16px; gap: 8px; }
  .dashboard-island .menu-icon { width: 56px; height: 56px; }
  .dashboard-island .menu-icon img { width: 38px; height: 38px; }
  .dashboard-island .menu-label { font-size: 17px; overflow-wrap: anywhere; }
  .dashboard-island .menu-description { font-size: 14px; line-height: 1.4; max-width: none; }
  .dashboard-island .menu-item::after { width: 32px; height: 32px; right: 14px; top: 22px; font-size: 25px; }
  .dashboard-island .menu-item.full { min-height: 104px; padding: 14px 52px 14px 16px; gap: 14px; }
  .dashboard-island .menu-item.full::after { top: calc(50% - 16px); }
  #screen-home .home-footer { padding: 18px 24px; min-height: 0; }
}
@media screen and (min-width: 960px) {
  .dashboard-islands { grid-template-columns: minmax(0, 2fr) minmax(270px, 1fr); }
  .dashboard-island[data-menu-group="admin"] .menu-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-island[data-menu-group="report"] .menu-grid { grid-template-columns: minmax(0, 1fr); }
  .dashboard-island[data-menu-group="report"] .menu-item.full { min-height: 150px; }
  .dashboard-island[data-menu-group="report"] .menu-icon { width: 48px; height: 48px; }
  .dashboard-island[data-menu-group="report"] .menu-icon img { width: 34px; height: 34px; }
  .dashboard-islands:has(> .dashboard-island[hidden]) { grid-template-columns: minmax(0, 1fr); }
}
@media screen and (min-width: 1200px) {
  #screen-home .home-header { padding-left: 32px; padding-right: clamp(28px, 10vw, 180px); }
  .dashboard-island[data-menu-group="admin"] .menu-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media screen and (max-width: 767px) {
  #screen-home .home-header { padding: 18px 16px; }
  #screen-home .home-title { font-size: 32px; }
  #screen-home .hamburger-btn { top: 20px; left: 16px; }
  #screen-home .home-date-widget { margin-top: 12px; gap: 10px; }
  #screen-home #home-user { margin: 8px 0 0; }
}