Warning: truncated output (original token count: 30755)
Total output lines: 2991

:root {
    --navy-950: #071426;
    --navy-900: #0b1c31;
    --navy-800: #102944;
    --blue-700: #0b6edc;
    --blue-600: #1784f5;
    --blue-100: #e8f3ff;
    --cyan-500: #18b8cf;
    --green-600: #169b62;
    --green-100: #e4f7ee;
    --amber-600: #cc7a00;
    --amber-100: #fff2d9;
    --red-600: #c93c4a;
    --red-100: #fdebed;
    --slate-900: #172337;
    --slate-700: #465469;
    --slate-500: #768398;
    --slate-300: #cdd5df;
    --slate-200: #e1e7ed;
    --slate-100: #eff3f7;
    --slate-50: #f7f9fb;
    --white: #fff;
    --radius: 14px;
    --shadow: 0 8px 28px rgba(11, 28, 49, .07);

    /* UI-1 — centralne tokeny komponentów. */
    --ui-radius-control: 8px;
    --ui-radius-alert: 9px;
    --ui-radius-modal: 16px;
    --ui-control-height: 42px;
    --ui-control-padding-y: 9px;
    --ui-control-padding-x: 11px;
    --ui-button-height: 40px;
    --ui-button-padding-y: 8px;
    --ui-button-padding-x: 16px;
    --ui-button-shadow: 0 5px 14px rgba(23,132,245,.18);
    --ui-focus-ring: 0 0 0 3px rgba(23,132,245,.12);
    --ui-transition-fast: .14s;
}

* { box-sizing: border-box; }

html { min-height: 100%; }

body {
    min-height: 100vh;
    margin: 0;
    color: var(--slate-900);
    background: var(--slate-50);
    font: 14px/1.5 Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

a { color: var(--blue-700); text-decoration: none; }
a:hover { color: var(--blue-600); }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }

.app-shell { display: flex; min-height: 100vh; }

.sidebar {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 20;
    display: grid;
    width: 252px;
    height: 100vh;
    height: 100dvh;
    min-height: 0;
    grid-template-rows: 86px minmax(0, 1fr) 78px;
    overflow: hidden;
    background: linear-gradient(180deg, var(--navy-950), var(--navy-900));
    color: var(--white);
    box-shadow: 8px 0 30px rgba(0, 0, 0, .08);
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    color: inherit;
}

.brand:hover { color: inherit; }

.brand > span:last-child { display: flex; flex-direction: column; line-height: 1.12; }
.brand strong { font-size: 18px; letter-spacing: -.3px; }
.brand small { margin-top: 4px; color: #8ea4be; font-size: 10px; font-weight: 700; letter-spacing: 1.7px; text-transform: uppercase; }
.sidebar-brand { position: relative; height: 86px; min-height: 86px; padding: 20px 24px; border-bottom: 1px solid rgba(255,255,255,.08); }

.brand-icon {
    position: relative;
    display: inline-block;
    width: 38px;
    height: 29px;
    border: 2px solid var(--blue-600);
    border-radius: 5px;
    box-shadow: inset 0 0 0 3px rgba(23,132,245,.12);
}

.brand-icon::before {
    position: absolute;
    inset: 5px;
    border-radius: 2px;
    background: linear-gradient(135deg, var(--cyan-500), var(--blue-600));
    content: "";
    opacity: .9;
}

.brand-icon::after {
    position: absolute;
    bottom: -7px;
    left: 9px;
    width: 17px;
    height: 2px;
    border-radius: 2px;
    background: var(--blue-600);
    box-shadow: 7px 4px 0 -1px var(--blue-600), -3px 4px 0 -1px var(--blue-600);
    content: "";
}

.brand-icon span {
    position: absolute;
    z-index: 1;
    right: -4px;
    bottom: -3px;
    width: 12px;
    height: 16px;
    border: 2px solid #b9dcff;
    border-radius: 2px;
    background: var(--navy-900);
}

.main-nav {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 0;
    padding: 24px 14px;
    overflow-x: hidden;
    overflow-y: scroll;
    overscroll-behavior-y: contain;
    scrollbar-color: rgba(143, 177, 214, .65) rgba(255,255,255,.05);
    scrollbar-width: thin;
    touch-action: pan-y;
    -webkit-overflow-scrolling: touch;
}
.main-nav::-webkit-scrollbar { width: 8px; }
.main-nav::-webkit-scrollbar-track { background: rgba(255,255,255,.04); }
.main-nav::-webkit-scrollbar-thumb { border: 2px solid transparent; border-radius: 8px; background: rgba(143, 177, 214, .65); background-clip: padding-box; }
.main-nav::-webkit-scrollbar-thumb:hover { background: rgba(185, 216, 255, .8); background-clip: padding-box; }

.main-nav a {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 46px;
    margin-bottom: 5px;
    padding: 0 14px;
    border-radius: 9px;
    color: #afc0d4;
    font-weight: 600;
    transition: background .16s, color .16s;
}

.main-nav a:hover { background: rgba(255,255,255,.06); color: var(--white); }
.main-nav a.is-active { background: linear-gradient(90deg, rgba(23,132,245,.22), rgba(23,132,245,.1)); color: var(--white); box-shadow: inset 3px 0 var(--blue-600); }
.nav-icon { display: grid; width: 24px; color: #6da8ea; font-size: 17px; place-items: center; }
.nav-label { margin: 26px 14px 9px; color: #617894; font-size: 10px; font-weight: 800; letter-spacing: 1.6px; text-transform: uppercase; }

.sidebar-user {
    position: relative;
    z-index: 2;
    width: 100%;
    display: flex;
    height: 78px;
    min-height: 78px;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 14px 16px;
    border-top: 1px solid rgba(255,255,255,.12);
    background: #0c2037;
    box-shadow: 0 -8px 20px rgba(0,0,0,.12);
}

.avatar {
    display: grid;
    width: 39px;
    height: 39px;
    flex: 0 0 39px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--blue-600), var(--cyan-500));
    color: var(--white);
    font-weight: 800;
    place-items: center;
}

.avatar-small { width: 34px; height: 34px; flex-basis: 34px; font-size: 12px; }
.user-copy { display: flex; min-width: 0; flex: 1; flex-direction: column; }
.user-copy strong { overflow: hidden; color: var(--white); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.user-copy small { color: #8197b1; font-size: 11px; }
.icon-button { padding: 6px; border: 0; background: transparent; color: #8197b1; cursor: pointer; font-size: 19px; }
.icon-button:hover { color: var(--white); }

.main-column { width: calc(100% - 252px); min-height: 100vh; margin-left: 252px; }
.topbar {
    display: flex;
    min-height: 86px;
    align-items: center;
    padding: 16px clamp(22px, 3vw, 44px);
    border-bottom: 1px solid var(--slate-200);
    background: rgba(255,255,255,.94);
}
.topbar h1 { margin: 0; color: var(--slate-900); font-size: 20px; letter-spacing: -.35px; }
.topbar p { margin: 2px 0 0; color: var(--slate-500); font-size: 12px; }
.menu-toggle { display: none; margin-right: 14px; border: 0; background: transparent; font-size: 23px; cursor: pointer; }
.content { width: min(1500px, 100%); min-height: calc(100vh - 135px); margin: 0 auto; padding: 34px clamp(22px, 3vw, 44px) 50px; }
.app-footer { padding: 12px 40px 24px; color: var(--slate-500); font-size: 11px; text-align: right; }

.page-actions { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.page-actions h2 { margin: 2px 0 0; font-size: 25px; letter-spacing: -.6px; }
.eyebrow { color: var(--blue-700); font-size: 10px; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase; }
.back-link { display: inline-block; margin-bottom: 7px; color: var(--slate-500); font-size: 12px; font-weight: 600; }
.title-with-badge { display: flex; align-items: center; gap: 12px; }

/* UI-1 — globalne warianty geometrii i gęstości komponentów. */
body.view-radius-compact { --radius: 9px; --ui-radius-control: 6px; --ui-radius-alert: 7px; --ui-radius-modal: 12px; }
body.view-radius-normal { --radius: 14px; --ui-radius-control: 8px; --ui-radius-alert: 9px; --ui-radius-modal: 16px; }
body.view-radius-rounded { --radius: 20px; --ui-radius-control: 12px; --ui-radius-alert: 13px; --ui-radius-modal: 22px; }

body.view-controls-compact { --ui-control-height: 36px; --ui-control-padding-y: 6px; --ui-control-padding-x: 9px; --ui-button-height: 36px; --ui-button-padding-y: 6px; --ui-button-padding-x: 13px; }
body.view-controls-normal { --ui-control-height: 42px; --ui-control-padding-y: 9px; --ui-control-padding-x: 11px; --ui-button-height: 40px; --ui-button-padding-y: 8px; --ui-button-padding-x: 16px; }
body.view-controls-comfortable { --ui-control-height: 48px; --ui-control-padding-y: 11px; --ui-control-padding-x: 13px; --ui-button-height: 46px; --ui-button-padding-y: 10px; --ui-button-padding-x: 18px; }

body.view-shadow-none { --shadow: none; --ui-button-shadow: none; }
body.view-shadow-normal { --shadow: 0 8px 28px rgba(11, 28, 49, .07); --ui-button-shadow: 0 5px 14px rgba(23,132,245,.18); }
body.view-shadow-strong { --shadow: 0 14px 36px rgba(11, 28, 49, .14); --ui-button-shadow: 0 7px 18px rgba(23,132,245,.26); }

.button {
    display: inline-flex;
    height: var(--ui-button-height);
    min-height: var(--ui-button-height);
    max-width: 100%;
    align-items: center;
    justify-content: center;
    padding: var(--ui-button-padding-y) var(--ui-button-padding-x);
    border: 1px solid transparent;
    border-radius: var(--ui-radius-control);
    cursor: pointer;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    white-space: nowrap;
    transition: transform var(--ui-transition-fast), background var(--ui-transition-fast), border var(--ui-transition-fast);
}
.button:hover { transform: translateY(-1px); }
.button-primary { border-color: var(--blue-700); background: linear-gradient(135deg, var(--blue-700), var(--blue-600)); color: var(--white); box-shadow: var(--ui-button-shadow); }
.button-primary:hover { color: var(--white); }
.button-secondary { border-color: var(--slate-300); background: var(--white); color: var(--slate-700); }
.button-secondary:hover { border-color: var(--blue-600); color: var(--blue-700); }
.button-ghost { border-color: transparent; background: transparent; color: var(--slate-500); }
.button-danger { border-color: var(--red-100); background: var(--red-100); color: var(--red-600); }
.button-warning { border-color: #f2c46d; background: #fff5df; color: #9a5b00; }
.button-warning:hover { border-color: #d99a2b; color: #744300; }
.button-success { border-color: var(--green-600); background: var(--green-600); color: var(--white); }
.button-success:hover { color: var(--white); }
.button-small { height: 32px; min-height: 32px; padding: 5px 10px; font-size: 12px; }
.button-wide { width: 100%; }
.button-group, .actions-cell { display: flex; align-items: center; gap: 7px; }
.actions-cell { justify-content: flex-end; white-space: nowrap; }
.actions-cell { width: 1%; min-width: max-content; }
.actions-cell form, .button-group form { display: inline-flex; }
.actions-cell .button {
    height: 32px;
    min-height: 32px;
    padding: 5px 10px;
    font-size: 12px;
}
.form-actions .button:not(.button-small),
.page-actions .button:not(.button-small),
.filter-bar .button:not(.button-small) {
    height: var(--ui-button-height);
    min-height: var(--ui-button-height);
}

.card { border: 1px solid var(--slate-200); border-radius: var(--radius); background: var(--white); box-shadow: var(--shadow); }
.appearance-user-preview-card { margin-bottom: 20px; }
.appearance-user-preview-form { display: grid; grid-template-columns: minmax(260px, 1fr) auto; align-items: end; gap: 14px; padding: 18px 22px 22px; }
.appearance-user-preview-form label { margin: 0; }
.user-preview-banner { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 18px; padding: 13px 16px; border: 1px solid #f2c46d; border-radius: var(--radius-small); background: #fff8e8; color: #6f4600; box-shadow: var(--shadow); }
.user-preview-banner > div { display: flex; flex-direction: column; gap: 2px; }
.user-preview-banner span { font-size: 12px; color: #8a641f; }
.user-preview-banner form { display: inline-flex; flex: 0 0 auto; }
.card-header { display: flex; min-height: 76px; align-items: center; justify-content: space-between; gap: 15px; padding: 17px 22px; border-bottom: 1px solid var(--slate-200); }
.card-header h3 { margin: 0; font-size: 15px; }
.card-header p { margin: 2px 0 0; color: var(--slate-500); font-size: 12px; }
.card-header > a { font-size: 12px; font-weight: 700; }
.spaced-card { margin-top: 22px; }

.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 22px; }
.stat-card {
    display: flex;
    min-height: 112px;
    align-items: center;
    gap: 16px;
    padding: 19px;
    border: 1px solid var(--slate-200);
    border-radius: var(--radius);
    background: var(--white);
    color: var(--slate-900);
    box-shadow: var(--shadow);
}
.stat-card:hover { color: var(--slate-900); border-color: #b8d7f7; transform: translateY(-2px); }
.stat-icon { display: grid; width: 50px; height: 50px; flex: 0 0 50px; border-radius: 12px; font-size: 19px; font-weight: 700; place-items: center; }
.stat-card div { display: flex; flex-direction: column; }
.stat-card strong { font-size: 27px; line-height: 1.1; }
.stat-card div span { margin-top: 4px; color: var(--slate-500); font-size: 12px; font-weight: 600; }
.stats-grid button.stat-card { width: 100%; font: inherit; text-align: left; cursor: pointer; }
.stat-all .stat-icon { background: var(--blue-100); color: var(--blue-700); }
.stat-new .stat-icon { background: #e6f5ff; color: #0a7eaa; }
.stat-progress .stat-icon { background: var(--amber-100); color: var(--amber-600); }
.stat-done .stat-icon { background: var(--green-100); color: var(--green-600); }

.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 20px; }
.dashboard-side { display: grid; align-content: start; gap: 14px; }
.mini-card { display: grid; grid-template-columns: 44px 1fr auto; align-items: center; gap: 12px; padding: 18px; }
.mini-icon { display: grid; width: 42px; height: 42px; border-radius: 11px; background: var(--blue-100); color: var(--blue-700); place-items: center; }
.mini-card div { display: flex; flex-direction: column; }
.mini-card strong { font-size: 21px; }
.mini-card div span { color: var(--slate-500); font-size: 11px; }
.mini-card a { font-size: 11px; font-weight: 700; }
.quick-actions { padding: 18px; }
.quick-actions h3 { margin: 0 0 12px; font-size: 14px; }
.quick-actions a { display: block; margin-top: 7px; padding: 9px 11px; border-radius: 7px; background: var(--slate-50); color: var(--slate-700); font-size: 12px; font-weight: 700; }
.quick-actions a:hover { background: var(--blue-100); color: var(--blue-700); }

.table-card { overflow: hidden; }
.table-wrap { width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 14px 18px; border-bottom: 1px solid var(--slate-200); text-align: left; vertical-align: middle; }
th { background: #fbfcfd; color: var(--slate-500); font-size: 10px; font-weight: 800; letter-spacing: .7px; text-transform: uppercase; white-space: nowrap; }
td { color: var(--slate-700); font-size: 12px; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover { background: #fbfdff; }
td small, .table-title + small { display: block; margin-top: 3px; color: var(--slate-500); font-size: 10px; }
.table-title { display: inline-block; max-width: 340px; color: var(--slate-900); font-weight: 700; }
.person { display: inline-flex; align-items: center; gap: 10px; }
.person > span:last-child { display: flex; flex-direction: column; }
.person strong { color: var(--slate-900); }

.badge { display: inline-flex; align-items: center; padding: 4px 9px; border-radius: 99px; font-size: 10px; font-weight: 800; white-space: nowrap; }
.badge-new { background: var(--blue-100); color: var(--blue-700); }
.badge-in_progress { background: var(--amber-100); color: var(--amber-600); }
.badge-done { background: var(--green-100); color: var(--green-600); }
.badge-role { background: #eeeafd; color: #6748ad; }
.badge-muted { background: var(--slate-100); color: var(--slate-500); }
.priority { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 700; }
.priority::before { width: 7px; height: 7px; border-radius: 50%; background: var(--slate-300); content: ""; }
.priority-low::before { background: #65aada; }
.priority-normal::before { background: var(--green-600); }
.priority-high::before { background: var(--amber-600); }
.priority-critical::before { background: var(--red-600); }
.status-dot { display: inline-block; width: 7px; height: 7px; margin-right: 7px; border-radius: 50%; }
.status-dot.online { background: var(--green-600); }
.status-dot.offline { background: var(--slate-300); }

.filter-card { margin-bottom: 16px; padding: 14px 16px; box-shadow: none; }
.filter-bar, .filter-grid { display: flex; align-items: center; gap: 9px; }
/* Zlecenia: elastyczny pasek filtrowania bez nachodzenia kontrolek. */
.filter-grid { flex-wrap: wrap; }
.filter-grid > * { min-width: 0; }
.filter-grid > .search-field { flex: 2 1 280px; min-width: 220px; }
.filter-grid > select { flex: 1 1 150px; width: auto; min-width: 135px; max-width: 100%; }
.filter-grid > .button { flex: 0 0 auto; width: auto; white-space: nowrap; }
.filter-switch { margin-left: auto; font-size: 12px; font-weight: 700; }
.search-field { position: relative; display: flex; min-width: 240px; flex: 1; }
.search-field > span { position: absolute; top: 8px; left: 12px; color: var(--slate-500); font-size: 18px; pointer-events: none; }
.search-field input { width: 100%; min-width: 0; padding-left: 36px; }

label { display: flex; flex-direction: column; gap: 6px; color: var(--slate-700); font-size: 12px; font-weight: 700; }
input, select, textarea {
    width: 100%;
    min-height: var(--ui-control-height);
    padding: var(--ui-control-padding-y) var(--ui-control-padding-x);
    border: 1px solid var(--slate-300);
    border-radius: var(--ui-radius-control);
    outline: none;
    background: var(--white);
    color: var(--slate-900);
    transition: border var(--ui-transition-fast), box-shadow var(--ui-transition-fast);
}
textarea { resize: vertical; }
input:focus, select:focus, textarea:focus { border-color: var(--blue-600); box-shadow: var(--ui-focus-ring); }
label small { color: var(--slate-500); font-size: 10px; font-weight: 500; }

.form-card { overflow: hidden; }
.form-card > form { display: block; }
.form-section { display: grid; grid-template-columns: 240px minmax(0, 680px); gap: 48px; padding: 28px; }
.form-section-title h3 { margin: 0 0 4px; font-size: 15px; }
.form-section-title p { margin: 0; color: var(--slate-500); font-size: 12px; }
.form-fields, .form-stack { display: grid; gap: 17px; }
.form-grid { display: grid; gap: 15px; }
.form-grid.two { grid-template-columns: repeat(2, 1fr); }
.form-actions { display: flex; justify-content: flex-end; gap: 9px; padding: 18px 28px; border-top: 1px solid var(--slate-200); background: #fbfcfd; }
.checkbox-row { flex-direction: row; align-items: flex-start; gap: 10px; padding: 12px; border: 1px solid var(--slate-200); border-radius: var(--ui-radius-control); background: var(--slate-50); cursor: pointer; }
.checkbox-row input { width: 17px; min-height: 17px; margin-top: 2px; }
.checkbox-row > span { display: flex; flex-direction: column; }
.checkbox-row strong { font-size: 12px; }

.alert { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 16px; padding: 12px 14px; border: 1px solid; border-radius: var(--ui-radius-alert); font-size: 12px; font-weight: 600; }
.alert[hidden] { display: none !important; }
.alert button { margin-left: auto; border: 0; background: transparent; color: inherit; cursor: pointer; font-size: 18px; line-height: 1; }
.alert ul { margin: 0; padding-left: 18px; }
.alert-success { border-color: #b8e7d2; background: var(--green-100); color: #12734b; }
.alert-error { border-color: #f6c7cd; background: var(--red-100); color: #9f2d3a; }
.alert-warning { border-color: #f3d69d; background: var(--amber-100); color: #8c5705; }
.empty-inline { padding: 36px 20px; color: var(--slate-500); text-align: center; }

.detail-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(260px, .6fr); align-items: start; gap: 20px; }
.detail-card { overflow: hidden; }
.detail-list { display: grid; grid-template-columns: repeat(2, 1fr); margin: 0; padding: 8px 22px 22px; }
.detail-list > div { padding: 15px 0; border-bottom: 1px solid var(--slate-200); }
.detail-list > div:nth-last-child(-n+2) { border-bottom: 0; }
.detail-list .full { grid-column: 1 / -1; }
.detail-list.single { grid-template-columns: 1fr; }
.detail-list.single > div { border-bottom: 1px solid var(--slate-200); }
.detail-list.single > div:last-child { border-bottom: 0; }
.detail-list dt { margin-bottom: 4px; color: var(--slate-500); font-size: 10px; font-weight: 800; letter-spacing: .6px; text-transform: uppercase; }
.detail-list dd { margin: 0; color: var(--slate-900); font-size: 12px; font-weight: 600; }
.ticket-description { min-height: 180px; padding: 22px; color: var(--slate-700); white-space: normal; }

.empty-state { max-width: 540px; margin: 65px auto; padding: 50px 30px; text-align: center; }
.empty-code { display: block; color: var(--blue-600); font-size: 55px; font-weight: 900; letter-spacing: -3px; }
.empty-state h2 { margin: 4px 0; }
.empty-state p { margin: 0 0 22px; color: var(--slate-500); }

.auth-body {
    display: grid;
    min-height: 100vh;
    padding: 30px;
    background:
        radial-gradient(circle at 15% 20%, rgba(23,132,245,.18), transparent 31%),
        radial-gradient(circle at 85% 80%, rgba(24,184,207,.12), transparent 29%),
        linear-gradient(135deg, var(--navy-950), #102b4a);
    place-items: center;
}
.auth-shell { width: min(100%, 480px); }
.brand-centered { display: flex; justify-content: center; margin-bottom: 27px; color: var(--white); }
.auth-card { padding: 32px; border: 1px solid rgba(255,255,255,.15); border-radius: 18px; background: var(--white); box-shadow: 0 24px 80px rgba(0,0,0,.28); }
.install-card { width: min(720px, calc(100vw - 40px)); margin-left: 50%; transform: translateX(-50%); }
.auth-heading { margin-bottom: 24px; text-align: center; }
.auth-heading h1 { margin: 4px 0 3px; font-size: 25px; }
.auth-heading p { margin: 0; color: var(--slate-500); font-size: 12px; }
.auth-footer { margin: 20px 0 0; color: #8099b6; font-size: 10px; font-weight: 700; letter-spacing: .5px; text-align: center; text-transform: uppercase; }

@media (max-width: 1150px) {
    .stats-grid { grid-template-columns: repeat(2, 1fr); }
    .filter-grid > .search-field { flex-basis: 100%; min-width: 0; }
    .search-field { min-width: 0; }
}

@media (max-width: 850px) {
    .sidebar { transform: translateX(-100%); transition: transform .2s; }
    .sidebar.is-open { transform: translateX(0); }
    .main-column { width: 100%; margin-left: 0; }
    .menu-toggle { display: block; }
    .dashboard-grid, .detail-grid { grid-template-columns: 1fr; }
    .form-section { grid-template-columns: 1fr; gap: 18px; }
}

@media (max-width: 600px) {
    .content { padding: 24px 14px 40px; }
    .topbar { min-height: 72px; padding: 12px 14px; }
    .page-actions { align-items: stretch; flex-direction: column; }
    .page-actions > .button, .button-group { width: 100%; }
    .button-group .button { flex: 1; }
    .stats-grid { grid-template-columns: 1fr; }
    .stat-card { min-height: 90px; }
    .filter-bar { display: grid; grid-template-columns: 1fr; }
    .filter-grid { display: flex; flex-direction: column; align-items: stretch; }
    .filter-grid > .search-field, .filter-grid > select, .filter-grid > .button { width: 100%; min-width: 0; flex: 0 0 auto; }
    .filter-switch { margin: 6px 0; }
    .form-grid.two { grid-template-columns: 1fr; }
    .form-section { padding: 20px; }
    .form-actions { padding: 15px 20px; }
    .auth-body { padding: 20px; }
    .auth-card { padding: 24px 20px; }
    .install-card { width: calc(100vw - 28px); }
    th, td { padding: 12px 14px; }
    .detail-list { grid-template-columns: 1fr; }
    .detail-list .full { grid-column: auto; }
}

/* === Widok systemu 2.9.12 === */
html { --accent-rgb: 23, 132, 245; }
html[data-accent="blue"] { --blue-700: #0b6edc; --blue-600: #1784f5; --blue-100: #e8f3ff; --accent-rgb: 23, 132, 245; }
html[data-accent="green"] { --blue-700: #087f5b; --blue-600: #12a36d; --blue-100: #e5f7ef; --accent-rgb: 18, 163, 109; }
html[data-accent="purple"] { --blue-700: #6941c6; --blue-600: #7f56d9; --blue-100: #f0eafe; --accent-rgb: 127, 86, 217; }
html[data-accent="teal"] { --blue-700: #087f8c; --blue-600: #0e9faf; --blue-100: #e5f8fa; --accent-rgb: 14, 159, 175; }
html[data-accent="orange"] { --blue-700: #b85c00; --blue-600: #e67a16; --blue-100: #fff0df; --accent-rgb: 230, 122, 22; }

body.view-sidebar-compact .sidebar-brand { padding-right: 16px; padding-left: 16px; }
body.view-sidebar-compact .main-nav { padding-right: 9px; padding-left: 9px; }
body.view-sidebar-compact .main-nav a,
body.view-sidebar-compact .main-nav details.nav-group > summary { gap: 9px; padding-right: 10px; padding-left: 10px; }
body.view-sidebar-compact .brand strong { font-size: 16px; }
body.view-sidebar-compact .brand small { letter-spacing: 1.25px; }
body.view-sidebar-compact .sidebar-user { padding-right: 10px; padding-left: 10px; }

body.view-text-small { font-size: 13px; }
body.view-text-small td,
body.view-text-small label,
body.view-text-small .button,
body.view-text-small .main-nav a { font-size: 11px; }
body.view-text-small .page-actions h2 { font-size: 23px; }
body.view-text-large { font-size: 16px; }
body.view-text-large td,
body.view-text-large label,
body.view-text-large .button { font-size: 13px; }
body.view-text-large th { font-size: 11px; }
body.view-text-large .main-nav a { font-size: 15px; }
body.view-text-large .page-actions h2 { font-size: 28px; }
body.view-text-large .card-header p,
body.view-text-large .form-section-title p { font-size: 13px; }

body.view-table-compact th,
body.view-table-compact td { padding: 9px 12px; }
body.view-table-compact .table-card .avatar-small { width: 30px; height: 30px; flex-basis: 30px; }

.pagination {
    display: flex;
    min-height: 58px;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 14px;
    padding: 10px 14px;
    border: 1px solid var(--slate-200);
    border-radius: 11px;
    background: var(--white);
    box-shadow: var(--shadow);
}
.pagination-summary { color: var(--slate-500); font-size: 11px; font-weight: 700; }
.pagination-pages { display: flex; align-items: center; gap: 5px; }
.pagination-page {
    display: inline-grid;
    min-width: 32px;
    height: 32px;
    padding: 0 8px;
    border: 1px solid var(--slate-200);
    border-radius: 7px;
    background: var(--white);
    color: var(--slate-700);
    font-size: 11px;
    font-weight: 800;
    place-items: center;
}
.pagination-page:hover { border-color: var(--blue-600); color: var(--blue-700); }
.pagination-page.is-active { border-color: var(--blue-600); background: var(--blue-600); color: #fff; }
.pagination-gap { padding: 0 3px; color: var(--slate-500); }

.view-preview-stage .view-preview-card {
    overflow: hidden;
    border: 1px solid var(--slate-200);
    border-radius: 12px;
    background: var(--white);
}
.view-preview-heading { display: flex; align-items: center; gap: 9px; padding: 16px; border-bottom: 1px solid var(--slate-200); }
.view-preview-heading .badge { margin-left: auto; }
.view-preview-dot { width: 12px; height: 12px; border-radius: 50%; background: var(--blue-600); box-shadow: 0 0 0 5px var(--blue-100); }
.view-preview-card > p { margin: 0; padding: 14px 16px; color: var(--slate-500); font-size: 12px; }
.view-settings-actions { justify-content: flex-end; }
.view-reset-form { display: flex; justify-content: flex-end; margin-top: 10px; }

/* Ciemny motyw. data-resolved-theme ustawia JS również dla trybu automatycznego. */
html[data-resolved-theme="dark"] {
    color-scheme: dark;
    --slate-900: #eef4fb;
    --slate-700: #c4cfdd;
    --slate-500: #8fa0b5;
    --slate-300: #435167;
    --slate-200: #2a3749;
    --slate-100: #202c3c;
    --slate-50: #0e1724;
    --shadow: 0 8px 28px rgba(0, 0, 0, .22);
}
html[data-resolved-theme="dark"] body { background: #0e1724; color: var(--slate-900); }
html[data-resolved-theme="dark"] .topbar { border-color: var(--slate-200); background: rgba(16, 26, 40, .96); }
html[data-resolved-theme="dark"] .card,
html[data-resolved-theme="dark"] .stat-card,
html[data-resolved-theme="dark"] .pagination,
html[data-resolved-theme="dark"] .pagination-page,
html[data-resolved-theme="dark"] .view-preview-card { background: #121e2d; }
html[data-resolved-theme="dark"] .button-secondary,
html[data-resolved-theme="dark"] input,
html[data-resolved-theme="dark"] select,
html[data-resolved-theme="dark"] textarea { border-color: var(--slate-300); background: #152235; color: var(--slate-900); }
html[data-resolved-theme="dark"] th { background: #162335; }
html[data-resolved-theme="dark"] tbody tr:hover { background: #172638; }
html[data-resolved-theme="dark"] .form-actions { border-color: var(--slate-200); background: #101b29; }
html[data-resolved-theme="dark"] .button-warning { border-color: #936518; background: #3c2c12; color: #ffd78f; }
html[data-resolved-theme="dark"] .user-preview-banner { border-color: #76551b; background: #2e2413; color: #ffe2a9; }
html[data-resolved-theme="dark"] .user-preview-banner span { color: #d7b675; }

@media (max-width: 720px) {
    .appearance-user-preview-form { grid-template-columns: 1fr; }
    .appearance-user-preview-form .button { width: 100%; }
    .user-preview-banner { align-items: stretch; flex-direction: column; }
    .user-preview-banner .button { width: 100%; }
    .actions-cell { width: auto; min-width: 132px; flex-wrap: wrap; }
}
html[data-resolved-theme="dark"] .checkbox-row { border-color: var(--slate-200); background: #111e2d; }
html[data-resolved-theme="dark"] .quick-actions a { background: #182638; }
html[data-resolved-theme="dark"] .quick-actions a:hover { background: rgba(var(--accent-rgb), .14); }
html[data-resolved-theme="dark"] .badge-role { background: #30284b; color: #c7b8ff; }
html[data-resolved-theme="dark"] .badge-muted { background: #202d3d; }
html[data-resolved-theme="dark"] .stat-card:hover { border-color: rgba(var(--accent-rgb), .55); }
html[data-resolved-theme="dark"] .menu-toggle { color: var(--slate-900); }
html[data-resolved-theme="dark"] .filter-card { background: #121e2d; }
html[data-resolved-theme="dark"] .alert-success { background: #123327; }
html[data-resolved-theme="dark"] .alert-error { background: #3a1d23; }
html[data-resolved-theme="dark"] .alert-warning { background: #382b14; }

@media (max-width: 650px) {
    .pagination { align-items: stretch; flex-direction: column; }
    .pagination-pages { flex-wrap: wrap; }
}

/* === Poprawka zlecen 2.9.13 === */

/* === Konfiguracja kart i wiadomości 2.9.14 === */
.settings-tabs {
    display: flex;
    gap: 8px;
    margin: 0 0 18px;
    padding: 6px;
    border: 1px solid var(--slate-200);
    border-radius: 12px;
    background: var(--white);
    box-shadow: 0 4px 18px rgba(11,28,49,.04);
}
.settings-tabs a {
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    justify-content: center;
    padding: 0 16px;
    border-radius: 8px;
    color: var(--slate-700);
    font-size: 12px;
    font-weight: 800;
}
.settings-tabs a:hover { background: var(--slate-50); color: var(--slate-900); }
.settings-tabs a.is-active { background: var(--blue-100); color: var(--blue-700); }

.appearance-list { padding: 18px 22px 24px; }
.appearance-group {
    margin-bottom: 14px;
    border: 1px solid var(--slate-200);
    border-radius: 12px;
    background: var(--white);
    overflow: hidden;
}
.appearance-group > summary {
    padding: 14px 16px;
    background: var(--slate-50);
    cursor: pointer;
    font-size: 13px;
    font-weight: 800;
    list-style: none;
}
.appearance-group > summary::-webkit-details-marker { display: none; }
.appearance-group > summary::after { float: right; content: '⌄'; color: var(--slate-500); }
.appearance-group[open] > summary::after { transform: rotate(180deg); }
.appearance-group-body { padding: 0 16px; }
.appearance-item {
    display: grid;
    gap: 12px;
    padding: 16px 0;
    border-bottom: 1px solid var(--slate-200);
}
.appearance-item:last-child { border-bottom: 0; }
.appearance-item-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.appearance-item-title strong { font-size: 13px; }
.appearance-item-title code {
    padding: 3px 7px;
    border-radius: 6px;
    background: var(--slate-100);
    color: var(--slate-500);
    font-size: 10px;
}
.appearance-controls { display: grid; gap: 10px; }
.appearance-controls-three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.appearance-controls-four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.appearance-controls label { gap: 5px; font-size: 11px; font-weight: 700; }
.appearance-controls select { min-width: 0; }
.appearance-message-preview { margin: 0; }
.appearance-card-preview {
    display: flex;
    min-height: 72px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    border: 1px solid var(--slate-200);
    border-radius: var(--radius);
    background: var(--white);
    box-shadow: var(--shadow);
}
.appearance-card-preview span { color: var(--slate-500); font-size: 11px; }

/* Karty: każda karta ma nazwę/ID w data-ui-card i może być stylowana niezależnie. */
[data-ui-card] { position: relative; }
[data-ui-card][data-ui-color="blue"] { --ui-card-accent: #1784f5; --ui-card-tint: #eef6ff; }
[data-ui-card][data-ui-color="green"] { --ui-card-accent: #169b62; --ui-card-tint: #edf9f4; }
[data-ui-card][data-ui-color="purple"] { --ui-card-accent: #7657d6; --ui-card-tint: #f3f0ff; }
[data-ui-card][data-ui-color="teal"] { --ui-card-accent: #0f9f9a; --ui-card-tint: #ecfbfa; }
[data-ui-card][data-ui-color="orange"] { --ui-card-accent: #d97706; --ui-card-tint: #fff7ed; }
[data-ui-card][data-ui-color="red"] { --ui-card-accent: #c93c4a; --ui-card-tint: #fff1f2; }
[data-ui-card][data-ui-color="slate"] { --ui-card-accent: #64748b; --ui-card-tint: #f3f6f9; }
[data-ui-card]:not([data-ui-color="default"]) { border-top: 3px solid var(--ui-card-accent); }
[data-ui-card]:not([data-ui-color="default"]) .card-header h3,
[data-ui-card]:not([data-ui-color="default"]) > strong { color: var(--ui-card-accent); }
[data-ui-card][data-ui-surface="tinted"] { background: linear-gradient(180deg, var(--ui-card-tint, var(--slate-50)), var(--white) 150px); }
[data-ui-card][data-ui-radius="compact"] { border-radius: 8px; }
[data-ui-card][data-ui-radius="rounded"] { border-radius: 22px; }
[data-ui-card][data-ui-shadow="none"] { box-shadow: none; }
[data-ui-card][data-ui-shadow="strong"] { box-shadow: 0 16px 38px rgba(11, 28, 49, .16); }

/* Wiadomości systemowe. */
.alert-danger { border-color: #f6c7cd; background: var(--red-100); color: #9f2d3a; }
[data-ui-message][data-ui-message-size="compact"] { padding: 8px 11px; font-size: 11px; }
[data-ui-message][data-ui-message-color="blue"] { --ui-msg-accent: #1784f5; --ui-msg-soft: #e8f3ff; --ui-msg-text: #0b5cae; }
[data-ui-message][data-ui-message-color="green"] { --ui-msg-accent: #169b62; --ui-msg-soft: #e4f7ee; --ui-msg-text: #12734b; }
[data-ui-message][data-ui-message-color="purple"] { --ui-msg-accent: #7657d6; --ui-msg-soft: #eeeafd; --ui-msg-text: #5d42aa; }
[data-ui-message][data-ui-message-color="teal"] { --ui-msg-accent: #0f9f9a; --ui-msg-soft: #e5f8f7; --ui-msg-text: #08736f; }
[data-ui-message][data-ui-message-color="orange"] { --ui-msg-accent: #d97706; --ui-msg-soft: #fff2d9; --ui-msg-text: #8c5705; }
[data-ui-message][data-ui-message-color="red"] { --ui-msg-accent: #c93c4a; --ui-msg-soft: #fdebed; --ui-msg-text: #9f2d3a; }
[data-ui-message][data-ui-message-color="slate"] { --ui-msg-accent: #64748b; --ui-msg-soft: #eff3f7; --ui-msg-text: #465469; }
[data-ui-message]:not([data-ui-message-color="inherit"])[data-ui-message-variant="soft"] {
    border-color: color-mix(in srgb, var(--ui-msg-accent) 35%, transparent);
    background: var(--ui-msg-soft);
    color: var(--ui-msg-text);
}
[data-ui-message]:not([data-ui-message-color="inherit"])[data-ui-message-variant="outline"] {
    border-color: var(--ui-msg-accent);
    background: transparent;
    color: var(--ui-msg-accent);
}
[data-ui-message]:not([data-ui-message-color="inherit"])[data-ui-message-variant="strong"] {
    border-color: var(--ui-msg-accent);
    background: var(--ui-msg-accent);
    color: #fff;
}
[data-ui-message][data-ui-message-color="inherit"][data-ui-message-variant="outline"] { background: transparent; }
[data-ui-message][data-ui-message-color="inherit"][data-ui-message-variant="strong"].alert-success { background: #169b62; border-color: #169b62; color: #fff; }
[data-ui-message][data-ui-message-color="inherit"][data-ui-message-variant="strong"].alert-warning { background: #cc7a00; border-color: #cc7a00; color: #fff; }
[data-ui-message][data-ui-message-color="inherit"][data-ui-message-variant="strong"].alert-error,
[data-ui-message][data-ui-message-color="inherit"][data-ui-message-variant="strong"].alert-danger { background: #c93c4a; border-color: #c93c4a; color: #fff; }

html[data-resolved-theme="dark"] .settings-tabs,
html[data-resolved-theme="dark"] .appearance-group,
html[data-resolved-theme="dark"] .appearance-card-preview { background: #121e2d; }
html[data-resolved-theme="dark"] .appearance-group > summary { background: #162335; }
html[data-resolved-theme="dark"] [data-ui-card][data-ui-color="blue"] { --ui-card-tint: #102b47; }
html[data-resolved-theme="dark"] [data-ui-card][data-ui-color="green"] { --ui-card-tint: #102d24; }
html[data-resolved-theme="dark"] [data-ui-card][data-ui-color="purple"] { --ui-card-tint: #261f42; }
html[data-resolved-theme="dark"] [data-ui-card][data-ui-color="teal"] { --ui-card-tint: #103231; }
html[data-resolved-theme="dark"] [data-ui-card][data-ui-color="orange"] { --ui-card-tint: #382714; }
html[data-resolved-theme="dark"] [data-ui-card][data-ui-color="red"] { --ui-card-tint: #371c22; }
html[data-resolved-theme="dark"] [data-ui-card][data-ui-color="slate"] { --ui-card-tint: #1b2838; }
html[data-resolved-theme="dark"] [data-ui-card][data-ui-surface="tinted"] { background: linear-gradient(180deg, var(--ui-card-tint), #121e2d 150px); }
html[data-resolved-theme="dark"] [data-ui-card][data-ui-shadow="strong"] { box-shadow: 0 16px 38px rgba(0,0,0,.42); }
html[data-resolved-theme="dark"] [data-ui-message]:not([data-ui-message-color="inherit"])[data-ui-message-variant="soft"] {
    background: color-mix(in srgb, var(--ui-msg-accent) 18%, #121e2d);
    color: color-mix(in srgb, var(--ui-msg-accent) 55%, #fff);
}

@media (max-width: 900px) {
    .appearance-controls-four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 650px) {
    .settings-tabs { overflow-x: auto; }
    .settings-tabs a { white-space: nowrap; }
    .appearance-list { padding: 12px; }
    .appearance-controls-three,
    .appearance-controls-four { grid-template-columns: 1fr; }
    .appearance-item-title { align-items: flex-start; flex-direction: column; }
    .appearance-card-preview { align-items: flex-start; flex-direction: column; }
}

/* 2.9.15 — Dashboard: odstępy i zwijane karty. */
.dashboard-messages { margin-bottom: 22px; }
.card-header-actions { display: inline-flex; align-items: center; justify-content: flex-end; gap: 12px; }
.card-header-actions > a { font-size: 12px; font-weight: 700; }
.card-collapse-button {
    display: inline-grid;
    width: 34px;
    height: 34px;
    min-height: 34px;
    padding: 0;
    border: 1px solid var(--slate-300);
    border-radius: 8px;
    background: transparent;
    color: var(--slate-500);
    cursor: pointer;
    font-size: 17px;
    line-height: 1;
    place-items: center;
}
.card-collapse-button:hover { border-color: var(--blue-600); color: var(--blue-700); }
.collapsible-card.is-collapsed > .card-header { border-bottom-color: transparent; }
.collapsible-card-body[hidden] { display: none !important; }
.sr…10755 tokens truncated…
    border-radius: calc(var(--radius) * .65);
    background: var(--slate-50);
    color: var(--slate-700);
    font-size: 10px;
    line-height: 1.2;
}
.calendar-event:hover { border-color: var(--blue-600); color: var(--blue-700); }
.calendar-event strong { font-size: 10px; }
.calendar-event span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.calendar-event-done { opacity: .72; }
.calendar-event-cancelled { opacity: .52; text-decoration: line-through; }
.calendar-week-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(190px, 1fr));
    gap: 12px;
    overflow-x: auto;
    padding-bottom: 4px;
}
.calendar-week-day { min-width: 190px; }
.calendar-week-day.is-today { box-shadow: inset 0 0 0 2px rgba(var(--accent-rgb), .32), var(--shadow); }
.calendar-week-day .card-header { min-height: 64px; padding: 12px 14px; }
.calendar-agenda { display: grid; gap: 8px; padding: 12px; }
.calendar-agenda-item {
    display: grid;
    gap: 4px;
    padding: 10px;
    border: 1px solid var(--slate-200);
    border-radius: var(--radius);
    background: var(--slate-50);
    color: var(--slate-700);
}
.calendar-agenda-item:hover { border-color: var(--blue-600); color: var(--slate-900); }
.calendar-agenda-item > span:not(.badge),
.calendar-agenda-item small { color: var(--slate-500); }
.calendar-agenda-item small {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}
.calendar-day-agenda { display: grid; }
.calendar-day-row {
    display: grid;
    grid-template-columns: 78px minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: 14px 18px;
    border-bottom: 1px solid var(--slate-200);
    color: var(--slate-700);
}
.calendar-day-row:last-child { border-bottom: 0; }
.calendar-day-row:hover { background: var(--slate-50); color: var(--slate-900); }
.calendar-day-time { display: grid; gap: 2px; }
.calendar-day-time strong { color: var(--slate-900); font-size: 18px; }
.calendar-day-time span { color: var(--slate-400); font-size: 11px; }
.calendar-day-copy { display: grid; gap: 3px; min-width: 0; }
.calendar-day-copy > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.calendar-day-copy small { color: var(--slate-500); }
.calendar-ticket-action {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 22px;
}
.calendar-ticket-action > div { display: grid; gap: 4px; }
.calendar-ticket-action span { color: var(--slate-500); font-size: 12px; }

html[data-resolved-theme="dark"] .calendar-toolbar,
html[data-resolved-theme="dark"] .calendar-weekdays,
html[data-resolved-theme="dark"] .calendar-day.is-outside,
html[data-resolved-theme="dark"] .calendar-event,
html[data-resolved-theme="dark"] .calendar-agenda-item {
    background: #121e2d;
}
html[data-resolved-theme="dark"] .calendar-day { background: #0f1926; }
html[data-resolved-theme="dark"] .calendar-day,
html[data-resolved-theme="dark"] .calendar-weekdays,
html[data-resolved-theme="dark"] .calendar-day-row,
html[data-resolved-theme="dark"] .calendar-event,
html[data-resolved-theme="dark"] .calendar-agenda-item { border-color: #2a3a4f; }

@media (max-width: 980px) {
    .calendar-toolbar { align-items: stretch; flex-direction: column; }
    .calendar-period-nav { justify-content: space-between; }
    .calendar-period-nav strong { order: -1; width: 100%; }
    .calendar-month-grid,
    .calendar-weekdays { min-width: 760px; }
    .calendar-card { overflow-x: auto; }
    .calendar-day-row { grid-template-columns: 64px minmax(0, 1fr); }
    .calendar-day-row > .badge { grid-column: 2; justify-self: start; }
}

@media (max-width: 640px) {
    .calendar-view-tabs .button { flex: 1; }
    .calendar-view-tabs { width: 100%; }
    .calendar-ticket-action { align-items: stretch; flex-direction: column; }
    .calendar-ticket-action .button { width: 100%; }
}

/* === 3.1.96 — zwarte i czytelne rozwijane boksy modułów === */
.module-card {
    border-color: color-mix(in srgb, var(--slate-200) 82%, var(--accent) 18%);
    box-shadow: 0 4px 14px rgba(15, 23, 42, .045);
}
.module-card-summary {
    min-height: 76px;
    padding: 17px 22px;
    transition: background var(--ui-transition-fast), border-color var(--ui-transition-fast);
}
.module-card-summary:focus-visible {
    outline: 3px solid rgba(var(--accent-rgb), .24);
    outline-offset: -3px;
}
.module-card[open] {
    border-color: rgba(var(--accent-rgb), .32);
    box-shadow: 0 12px 30px rgba(15, 23, 42, .08);
}
.module-card[open] > .module-card-summary {
    background: rgba(var(--accent-rgb), .055);
    border-bottom-color: rgba(var(--accent-rgb), .2);
}
.module-card-state .module-disclosure-icon {
    display: inline-grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border: 1px solid var(--slate-200);
    border-radius: 9px;
    background: var(--surface, #fff);
}
.module-card-body {
    display: grid;
    gap: 18px;
    padding: 22px;
    background: color-mix(in srgb, var(--slate-50) 55%, transparent);
}
.module-description {
    max-width: 980px;
    margin: 0;
    padding: 0;
    color: var(--slate-700);
    line-height: 1.55;
}
.module-card-body .module-facts {
    grid-template-columns: repeat(5, minmax(120px, 1fr));
    gap: 10px;
    padding: 0;
}
.module-card-body .module-facts > div {
    min-width: 0;
    padding: 13px 14px;
    border: 1px solid var(--slate-200);
    border-radius: 10px;
    background: var(--surface, #fff);
}
.module-card-body .module-facts > div:nth-last-child(-n+2) { border-bottom: 1px solid var(--slate-200); }
.module-card-body .module-facts dd { overflow-wrap: anywhere; }
.module-backup-section {
    grid-template-columns: minmax(180px, 240px) minmax(260px, 520px) auto;
    align-items: end;
    gap: 20px;
    padding: 18px;
    border: 1px solid var(--slate-200);
    border-radius: 12px;
    background: var(--surface, #fff);
}
.module-backup-section .form-fields { max-width: none; }
.module-backup-section .form-actions {
    align-self: end;
    padding: 0;
    border: 0;
    background: transparent;
}
.module-backup-section .button { white-space: nowrap; }
.module-health-details[open] .table-wrap { max-height: 620px; overflow: auto; }
.module-health-details table { margin: 0; }
.module-health-details td:nth-child(3) { min-width: 430px; line-height: 1.5; }
html[data-resolved-theme="dark"] .module-card-body,
html[data-resolved-theme="dark"] .module-card[open] > .module-card-summary { background: #162335; }
html[data-resolved-theme="dark"] .module-card-body .module-facts > div,
html[data-resolved-theme="dark"] .module-backup-section,
html[data-resolved-theme="dark"] .module-card-state .module-disclosure-icon { background: #101b2a; }

@media (max-width: 1100px) {
    .module-card-body .module-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .module-backup-section { grid-template-columns: 1fr 1.4fr; }
    .module-backup-section .form-actions { grid-column: 1 / -1; justify-content: flex-start; }
}

@media (max-width: 640px) {
    .module-card-body { padding: 16px; }
    .module-card-body .module-facts,
    .module-backup-section { grid-template-columns: 1fr; }
    .module-backup-section .form-actions { grid-column: auto; }
    .module-backup-section .button { width: 100%; white-space: normal; }
    .module-health-details td:nth-child(3) { min-width: 300px; }
}

/* Ostatnie zlecenia — po rozwinięciu karta pozostaje zwarta. */
[data-collapsible-card="dashboard-recent-tickets"] {
    overflow: hidden;
    transition: border-color var(--ui-transition-fast), box-shadow var(--ui-transition-fast);
}
[data-collapsible-card="dashboard-recent-tickets"]:not(.is-collapsed) {
    border-color: rgba(var(--accent-rgb), .24);
    box-shadow: 0 10px 26px rgba(15, 23, 42, .065);
}
[data-collapsible-card="dashboard-recent-tickets"]:not(.is-collapsed) > .card-header {
    background: rgba(var(--accent-rgb), .04);
}
[data-collapsible-card="dashboard-recent-tickets"] .collapsible-card-body {
    max-height: 460px;
    overflow: auto;
}
[data-collapsible-card="dashboard-recent-tickets"] th,
[data-collapsible-card="dashboard-recent-tickets"] td { padding-top: 11px; padding-bottom: 11px; }
[data-collapsible-card="dashboard-recent-tickets"] .table-title {
    display: block;
    max-width: 390px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
html[data-resolved-theme="dark"] [data-collapsible-card="dashboard-recent-tickets"]:not(.is-collapsed) > .card-header {
    background: #162335;
}

/* === 3.1.73 — wspólne usprawnienia obsługi i czytelności === */
.skip-link {
    position: fixed;
    z-index: 1000;
    top: 10px;
    left: 12px;
    padding: 10px 14px;
    border-radius: var(--ui-radius-control);
    background: var(--navy-950);
    color: var(--white);
    box-shadow: var(--shadow);
    transform: translateY(-150%);
    transition: transform var(--ui-transition-fast);
}
.skip-link:focus { color: var(--white); transform: translateY(0); }

.topbar {
    position: sticky;
    z-index: 15;
    top: 0;
    backdrop-filter: blur(12px);
    box-shadow: 0 1px 0 rgba(11, 28, 49, .04);
}

.content:focus { outline: 0; }
.content > .alert:first-child { margin-top: -10px; }

:where(a, button, input, select, textarea, summary):focus-visible {
    outline: 3px solid rgba(var(--accent-rgb), .34);
    outline-offset: 2px;
}

.button,
button:not(.icon-button):not(.menu-toggle):not(.sidebar-backdrop) {
    transition: transform var(--ui-transition-fast), box-shadow var(--ui-transition-fast), background var(--ui-transition-fast), border-color var(--ui-transition-fast);
}
.button:hover,
button:not(.icon-button):not(.menu-toggle):not(.sidebar-backdrop):hover { transform: translateY(-1px); }
.button:active,
button:not(.icon-button):not(.menu-toggle):not(.sidebar-backdrop):active { transform: translateY(0); }
.button[disabled], button[disabled] { cursor: not-allowed; opacity: .58; transform: none !important; }

table { border-collapse: separate; border-spacing: 0; }
table thead th {
    position: sticky;
    z-index: 2;
    top: 0;
    background: var(--slate-50);
    box-shadow: inset 0 -1px var(--slate-200);
}
tbody tr { transition: background-color var(--ui-transition-fast); }
tbody tr:hover { background: rgba(var(--accent-rgb), .045); }
tr.row-clickable[data-row-href]:focus-visible { background: rgba(var(--accent-rgb), .08); }

.form-group label,
.field label { font-weight: 700; }
input::placeholder,
textarea::placeholder { color: var(--slate-500); opacity: .8; }
textarea { min-height: 110px; resize: vertical; }

.sidebar-backdrop {
    position: fixed;
    z-index: 19;
    inset: 0;
    display: none;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: rgba(7, 20, 38, .58);
    backdrop-filter: blur(2px);
}

html[data-resolved-theme="dark"] table thead th { background: #162335; }
html[data-resolved-theme="dark"] tbody tr:hover { background: rgba(var(--accent-rgb), .08); }

@media (max-width: 850px) {
    body.menu-open { overflow: hidden; }
    body.menu-open .sidebar-backdrop { display: block; }
    .sidebar { box-shadow: 18px 0 42px rgba(0, 0, 0, .28) !important; }
    .topbar { min-height: 68px; padding-top: 10px; padding-bottom: 10px; }
    .topbar h1 { font-size: 18px; }
    .menu-toggle {
        display: grid;
        width: 42px;
        height: 42px;
        flex: 0 0 42px;
        padding: 0;
        border: 1px solid var(--slate-200);
        border-radius: var(--ui-radius-control);
        background: var(--white);
        color: var(--slate-900);
        place-items: center;
    }
    .content { padding-top: 22px; }
}

@media (max-width: 640px) {
    .content { padding-right: 14px; padding-left: 14px; }
    .app-footer { padding-right: 16px; padding-left: 16px; text-align: center; }
    .button, button, input, select { min-height: 42px; }
    .card-header, .panel-header { gap: 12px; align-items: flex-start; flex-wrap: wrap; }
    .card-header .button, .panel-header .button { max-width: 100%; white-space: normal; }
    table { font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* === 3.1.74 — kompaktowy popup potwierdzeń ESS === */
.ess-confirm-dialog {
    width: min(480px, calc(100vw - 28px));
    max-width: 480px;
    padding: 24px;
    border: 1px solid var(--slate-200);
    border-radius: var(--ui-radius-modal);
    background: var(--white);
    color: var(--slate-900);
    box-shadow: 0 24px 80px rgba(7, 20, 38, .28);
}
.ess-confirm-dialog::backdrop {
    background: rgba(7, 20, 38, .62);
    backdrop-filter: blur(3px);
}
.ess-confirm-icon {
    display: grid;
    width: 46px;
    height: 46px;
    margin-bottom: 16px;
    border-radius: 50%;
    background: var(--red-100);
    color: var(--red-600);
    font-size: 22px;
    font-weight: 900;
    place-items: center;
}
.ess-confirm-copy h2 { margin: 4px 0 8px; font-size: 20px; line-height: 1.25; }
.ess-confirm-copy p { margin: 0; color: var(--slate-700); line-height: 1.6; overflow-wrap: anywhere; }
.ess-confirm-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 24px;
    padding-top: 18px;
    border-top: 1px solid var(--slate-200);
}
html[data-resolved-theme="dark"] .ess-confirm-dialog { background: #111d2b; color: #f4f7fb; border-color: #2a3a4f; }
html[data-resolved-theme="dark"] .ess-confirm-copy p { color: #aebdce; }
html[data-resolved-theme="dark"] .ess-confirm-actions { border-color: #2a3a4f; }

@media (max-width: 520px) {
    .ess-confirm-dialog { padding: 20px; }
    .ess-confirm-actions { align-items: stretch; flex-direction: column-reverse; }
    .ess-confirm-actions .button { width: 100%; }
}

/* === 3.1.77 — uporządkowany panel modułów === */
.module-health-details { border-top: 1px solid var(--slate-200); }
.module-health-details > summary,
.module-card-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 18px 22px;
    cursor: pointer;
    list-style: none;
}
.module-health-details > summary::-webkit-details-marker,
.module-card-summary::-webkit-details-marker { display: none; }
.module-health-details > summary { color: var(--blue-700); font-weight: 800; }
.module-health-details > summary:hover,
.module-card-summary:hover { background: rgba(var(--accent-rgb), .045); }
.module-health-details[open] > summary { border-bottom: 1px solid var(--slate-200); }
.module-card { overflow: hidden; }
.module-card-summary h3 { margin: 2px 0 0; font-size: 16px; }
.module-card-summary p { margin: 3px 0 0; color: var(--slate-500); font-size: 12px; }
.module-card-state { display: inline-flex; align-items: center; gap: 14px; }
.module-disclosure-icon { color: var(--slate-500); font-size: 18px; transition: transform var(--ui-transition-fast); }
.module-card[open] > .module-card-summary,
.module-health-details[open] > summary { background: var(--slate-50); }
.module-card[open] > .module-card-summary { border-bottom: 1px solid var(--slate-200); }
.module-card[open] .module-disclosure-icon,
.module-health-details[open] .module-disclosure-icon { transform: rotate(180deg); }
.module-card-body { padding-bottom: 4px; }
.module-description { margin: 0; padding: 18px 28px 4px; color: var(--slate-700); line-height: 1.6; }
html[data-resolved-theme="dark"] .module-card[open] > .module-card-summary,
html[data-resolved-theme="dark"] .module-health-details[open] > summary { background: #162335; }
html[data-resolved-theme="dark"] .module-health-details,
html[data-resolved-theme="dark"] .module-health-details[open] > summary,
html[data-resolved-theme="dark"] .module-card[open] > .module-card-summary { border-color: var(--slate-200); }

@media (max-width: 640px) {
    .module-card-summary { align-items: flex-start; padding: 16px; }
    .module-card-state { gap: 8px; }
    .module-description { padding: 16px 20px 2px; }
    .module-health-details > summary { padding: 16px; }
}

/* === 3.1.98 — finalne reguły rozwijanych kart i filtrów === */
.module-toolbar {
    display: grid;
    grid-template-columns: minmax(230px, 1fr) minmax(170px, 220px) auto auto;
    align-items: end;
    gap: 14px;
    margin-bottom: 18px;
    padding: 18px;
}
.module-toolbar label { display: grid; gap: 7px; margin: 0; }
.module-toolbar label > span {
    color: var(--slate-600);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .45px;
    text-transform: uppercase;
}
.module-toolbar-actions { display: flex; gap: 8px; }
.module-filter-count { align-self: center; color: var(--slate-600); font-size: 12px; font-weight: 800; white-space: nowrap; }
.module-filter-empty { margin: 0 0 18px; border: 1px dashed var(--slate-300); border-radius: 12px; }
.module-card[hidden], .module-filter-empty[hidden] { display: none !important; }
.module-card-body { padding: 22px; }
.module-card-body .module-description { margin: 0; padding: 0; }
.module-card-body .module-facts { padding: 0; }
.collapsible-card:not(.is-collapsed) { box-shadow: 0 8px 24px rgba(15, 23, 42, .055); }
.collapsible-card:not(.is-collapsed) > .card-header { background: rgba(var(--accent-rgb), .035); }
.collapsible-card .card-collapse-button span[aria-hidden="true"] { transition: transform var(--ui-transition-fast); }
.collapsible-card.is-collapsed .card-collapse-button span[aria-hidden="true"] { transform: rotate(180deg); }

@media (max-width: 980px) {
    .module-toolbar { grid-template-columns: 1fr 220px; }
    .module-toolbar-actions { justify-content: flex-start; }
    .module-filter-count { justify-self: end; }
}

@media (max-width: 640px) {
    .module-toolbar { grid-template-columns: 1fr; padding: 15px; }
    .module-toolbar-actions { display: grid; grid-template-columns: 1fr 1fr; }
    .module-toolbar-actions .button { width: 100%; white-space: normal; }
    .module-filter-count { justify-self: start; }
    .dashboard-grid { gap: 14px; }
    .dashboard-grid .card-header { align-items: flex-start; gap: 10px; padding: 15px; }
    .dashboard-grid .card-header-actions { align-items: center; }
    [data-collapsible-card="dashboard-recent-tickets"] .collapsible-card-body { max-height: 390px; }
    [data-collapsible-card="dashboard-recent-tickets"] .table-wrap { overflow-x: auto; }
    [data-collapsible-card="dashboard-recent-tickets"] table { min-width: 650px; }
    [data-collapsible-card="dashboard-recent-tickets"] th,
    [data-collapsible-card="dashboard-recent-tickets"] td { padding: 10px 12px; }
}

/* === 3.1.99 — mobilne formularze, listy wyboru i tabela zleceń === */
@media (max-width: 850px) {
    .form-section,
    .module-backup-section {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 18px;
    }
    .form-section > *,
    .form-fields,
    .form-grid,
    .form-stack,
    .form-fields > label,
    .form-grid > label { min-width: 0; max-width: 100%; }
    main select,
    .form-fields select,
    .form-grid select,
    .filter-grid select {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }
    .module-backup-section .form-actions { grid-column: auto; }
}

@media (max-width: 600px) {
    .page-actions .button-group {
        min-width: 0;
        max-width: 100%;
        flex-wrap: wrap;
        justify-content: flex-start;
    }
    .page-actions .button-group .button {
        max-width: 100%;
        white-space: normal;
    }
    .tickets-list-card {
        width: 100%;
        max-width: calc(100vw - 28px);
        min-width: 0;
    }
    .tickets-list-card .tickets-table-scroll {
        display: block;
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        overscroll-behavior-inline: contain;
    }
    .tickets-list-card .tickets-list-table { min-width: 760px; }
    .form-section { padding: 18px; }
    .form-actions { flex-wrap: wrap; }
    .form-actions .button { max-width: 100%; white-space: normal; }
}

/* === 3.1.112 — UI-3 / pełne odświeżenie wizualne systemu === */
:root {
    --navy-950: #07101f;
    --navy-900: #0b1830;
    --navy-800: #122540;
    --blue-700: #1d4ed8;
    --blue-600: #2563eb;
    --blue-100: #edf4ff;
    --cyan-500: #0ea5c6;
    --green-600: #0f9f69;
    --green-100: #e9f8f1;
    --amber-600: #b86b00;
    --amber-100: #fff4dd;
    --red-600: #c43d4f;
    --red-100: #fff0f2;
    --slate-900: #172033;
    --slate-700: #4a5870;
    --slate-500: #7a879b;
    --slate-300: #cfd7e3;
    --slate-200: #e4eaf2;
    --slate-100: #eef2f7;
    --slate-50: #f5f7fb;
    --white: #ffffff;
    --radius: 16px;
    --shadow: 0 8px 26px rgba(21, 34, 58, .055), 0 1px 2px rgba(21, 34, 58, .04);
    --ui-radius-control: 10px;
    --ui-radius-alert: 12px;
    --ui-radius-modal: 18px;
    --ui-control-height: 44px;
    --ui-control-padding-y: 9px;
    --ui-control-padding-x: 13px;
    --ui-button-height: 42px;
    --ui-button-padding-y: 9px;
    --ui-button-padding-x: 16px;
    --ui-button-shadow: 0 7px 18px rgba(37, 99, 235, .18);
    --ui-focus-ring: 0 0 0 4px rgba(37, 99, 235, .11);
    --ui-border: #e4eaf2;
    --ui-border-strong: #d6deea;
    --ui-surface: #ffffff;
    --ui-surface-soft: #f8fafd;
    --ui-page: #f4f7fb;
    --ui-title: #142037;
    --ui-muted: #77849a;
}

body {
    color: var(--ui-title);
    background:
        radial-gradient(circle at 100% 0, rgba(37, 99, 235, .045), transparent 34rem),
        var(--ui-page);
    font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 14px;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

::selection { background: rgba(37, 99, 235, .18); color: var(--ui-title); }
a { transition: color .15s ease, opacity .15s ease; }

.main-column { background: transparent; }
.topbar {
    position: sticky;
    top: 0;
    z-index: 15;
    min-height: 78px;
    padding: 14px clamp(22px, 3vw, 42px);
    border-bottom: 1px solid rgba(214, 222, 234, .8);
    background: rgba(255, 255, 255, .84);
    box-shadow: 0 1px 0 rgba(255,255,255,.75), 0 8px 28px rgba(16, 31, 55, .035);
    backdrop-filter: blur(16px) saturate(1.25);
    -webkit-backdrop-filter: blur(16px) saturate(1.25);
}
.topbar > div { display: flex; min-width: 0; align-items: center; gap: 14px; }
.topbar h1 {
    margin: 0;
    color: var(--ui-title);
    font-size: 21px;
    font-weight: 750;
    letter-spacing: -.45px;
    line-height: 1.2;
}
.topbar p {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    margin: 0;
    padding: 0 10px;
    border: 1px solid var(--ui-border);
    border-radius: 999px;
    background: rgba(248, 250, 253, .9);
    color: var(--ui-muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .15px;
}

.content {
    width: min(1540px, 100%);
    min-height: calc(100vh - 124px);
    padding: 30px clamp(22px, 3vw, 42px) 52px;
}
.app-footer { padding: 4px 42px 22px; color: #8c98aa; font-size: 10px; letter-spacing: .25px; }

.page-actions {
    align-items: center;
    gap: 24px;
    margin-bottom: 22px;
}
.page-actions h2 {
    margin: 2px 0 0;
    color: var(--ui-title);
    font-size: clamp(24px, 2.1vw, 30px);
    font-weight: 780;
    letter-spacing: -.75px;
    line-height: 1.15;
}
.eyebrow {
    color: var(--blue-600);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 1.35px;
    text-transform: uppercase;
}
.back-link { color: var(--ui-muted); font-weight: 700; }
.back-link:hover { color: var(--blue-600); }

.card,
.panel,
.stat-card,
.mini-card {
    border: 1px solid var(--ui-border);
    background: var(--ui-surface);
    box-shadow: var(--shadow);
}
.card,
.panel { border-radius: var(--radius); }
.card { overflow: clip; }
.card-header,
.panel-header {
    padding: 19px 21px;
    border-bottom: 1px solid var(--ui-border);
    background: linear-gradient(180deg, #fff, #fbfcfe);
}
.card-header h3,
.panel-header h3 { margin: 0; color: var(--ui-title); font-size: 15px; font-weight: 780; letter-spacing: -.2px; }
.card-header p,
.panel-header p { margin: 4px 0 0; color: var(--ui-muted); font-size: 11px; }
.card-header > a,
.card-header-actions > a { color: var(--blue-600); font-size: 11px; font-weight: 800; }
.card-header > a:hover,
.card-header-actions > a:hover { color: var(--blue-700); }

.button {
    gap: 7px;
    border-radius: var(--ui-radius-control);
    font-size: 12px;
    font-weight: 750;
    letter-spacing: .01em;
    transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease, background-color .14s ease, color .14s ease;
}
.button:hover { transform: translateY(-1px); }
.button:active { transform: translateY(0); }
.button-primary {
    border-color: #2456d6;
    background: linear-gradient(135deg, #2258da 0%, #2f72f0 100%);
    box-shadow: 0 7px 18px rgba(37, 99, 235, .2), inset 0 1px rgba(255,255,255,.18);
}
.button-primary:hover { border-color: #1f4fc7; background: linear-gradient(135deg, #1f52cf 0%, #286be7 100%); box-shadow: 0 9px 22px rgba(37, 99, 235, .25); }
.button-secondary {
    border-color: var(--ui-border-strong);
    background: linear-gradient(180deg, #fff, #fafbfd);
    color: #445169;
    box-shadow: 0 1px 2px rgba(17, 30, 52, .035);
}
.button-secondary:hover { border-color: #aebed3; background: #fff; color: var(--blue-700); }
.button-ghost:hover { background: #eef3fa; color: #334158; }
.button-danger { border-color: #ffd9df; background: #fff3f5; color: #b92f45; }
.button-success { box-shadow: 0 6px 16px rgba(15,159,105,.14); }

input,
select,
textarea {
    border-color: var(--ui-border-strong);
    border-radius: var(--ui-radius-control);
    background: #fbfcfe;
    color: var(--ui-title);
    box-shadow: inset 0 1px 1px rgba(18, 34, 57, .025);
    transition: border-color .14s ease, box-shadow .14s ease, background-color .14s ease;
}
input:hover,
select:hover,
textarea:hover { border-color: #b8c4d5; background: #fff; }
input:focus,
select:focus,
textarea:focus {
    border-color: #6da0f8;
    background: #fff;
    box-shadow: var(--ui-focus-ring);
    outline: 0;
}
.form-group label,
.field label,
.form-stack > label > span,
.form-grid label > span,
.form-fields label > span { color: #445169; font-size: 11px; font-weight: 800; letter-spacing: .12px; }
.form-hint { color: var(--ui-muted); }
.checkbox-row { border-color: var(--ui-border); border-radius: 12px; background: #f9fbfd; }

.settings-tabs {
    gap: 4px;
    margin-bottom: 18px;
    padding: 5px;
    border: 1px solid var(--ui-border);
    border-radius: 13px;
    background: rgba(255,255,255,.74);
    box-shadow: 0 2px 8px rgba(17, 30, 52, .025);
}
.settings-tabs a {
    min-height: 36px;
    padding: 0 13px;
    border: 0;
    border-radius: 9px;
    color: #66748a;
    font-size: 11px;
    font-weight: 750;
}
.settings-tabs a:hover { background: #f2f5fa; color: #334158; }
.settings-tabs a.is-active {
    background: #fff;
    color: var(--blue-700);
    box-shadow: 0 2px 8px rgba(17, 30, 52, .08), inset 0 0 0 1px #e2e8f1;
}

.filter-card {
    margin-bottom: 17px;
    padding: 15px;
    border-color: #e3e9f1;
    background: linear-gradient(180deg, #fff, #fbfcfe);
}
.filter-bar,
.filter-grid { gap: 10px; }
.search-field {
    border-color: var(--ui-border-strong);
    border-radius: 11px;
    background: #f9fbfd;
}
.search-field:focus-within { border-color: #6da0f8; background: #fff; box-shadow: var(--ui-focus-ring); }
.search-field span { color: #8b98aa; }
.search-field input { background: transparent; box-shadow: none; }

.table-card { overflow: hidden; }
.table-wrap { scrollbar-color: #c4cfdd transparent; scrollbar-width: thin; }
table {
    border-collapse: separate;
    border-spacing: 0;
    background: transparent;
}
thead th,
table thead th {
    padding: 11px 16px;
    border-bottom: 1px solid var(--ui-border);
    background: #f7f9fc;
    color: #7b8799;
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .65px;
    text-transform: uppercase;
}
tbody td {
    padding: 14px 16px;
    border-bottom: 1px solid #edf1f5;
    color: #3d4a60;
    vertical-align: middle;
}
tbody tr:last-child td { border-bottom: 0; }
tbody tr { background: #fff; transition: background-color .12s ease, box-shadow .12s ease; }
tbody tr:hover { background: #f8faff; }
tr.row-clickable { cursor: pointer; }
tr.row-clickable:hover { box-shadow: inset 3px 0 #7da8f5; }
.table-title { color: #23314a; font-weight: 780; letter-spacing: -.1px; }
.table-title:hover { color: var(--blue-700); }
td small { display: block; margin-top: 3px; color: #8a96a8; font-size: 10px; }
.actions-cell { gap: 7px; }
.actions-cell > .work-entry-editor { margin-top: 0; }

.badge,
.priority {
    min-height: 24px;
    padding: 4px 9px;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .18px;
}
.badge-new { border-color: #d9e8ff; background: #edf5ff; color: #1e5fc1; }
.badge-in_progress { border-color: #ffe5b6; background: #fff5df; color: #9b5b00; }
.badge-done { border-color: #cceede; background: #ebf8f2; color: #08784e; }
.badge-muted { border-color: #e1e6ee; background: #f4f6f9; color: #68758a; }
.badge-role { border-color: #e4dcff; background: #f3efff; color: #6845ba; }
.priority-low { color: #637083; }
.priority-normal { color: #315a91; }
.priority-high { color: #a96100; }
.priority-critical { color: #b93045; }

.stats-grid { gap: 13px; margin-bottom: 20px; }
.stat-card {
    position: relative;
    min-height: 104px;
    padding: 18px;
    border-radius: 16px;
    overflow: hidden;
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.stat-card::after {
    position: absolute;
    top: -34px;
    right: -34px;
    width: 92px;
    height: 92px;
    border-radius: 50%;
    background: currentColor;
    content: "";
    opacity: .035;
}
.stat-card:hover { transform: translateY(-2px); border-color: #d6e0ee; box-shadow: 0 13px 30px rgba(20, 35, 59, .09); }
.stat-card .stat-icon {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    font-size: 17px;
    font-weight: 850;
}
.stat-card strong { color: #18243a; font-size: 28px; font-weight: 780; letter-spacing: -.9px; }
.stat-card div span { color: #7d899b; font-size: 10px; font-weight: 750; }
.stat-all .stat-icon { background: #edf4ff; color: #245fca; }
.stat-new .stat-icon { background: #eaf7ff; color: #0d83b4; }
.stat-progress .stat-icon { background: #fff4df; color: #b66a00; }
.stat-done .stat-icon { background: #e9f8f1; color: #0b8b5b; }

.dashboard-grid { gap: 16px; grid-template-columns: minmax(0, 1fr) 286px; }
.dashboard-side { gap: 12px; }
.dashboard-messages { margin-bottom: 18px; }
.mini-card {
    border-radius: 15px;
    padding: 16px;
    transition: border-color .14s ease, transform .14s ease;
}
.mini-card:hover { border-color: #d3deed; transform: translateY(-1px); }
.mini-card .mini-icon { border-radius: 10px; background: #eef4fb; color: #3264a8; }
.mini-card strong { color: #1b2940; font-weight: 780; }
.quick-actions { padding: 17px; }
.quick-actions h3 { color: #25334a; font-size: 12px; }
.quick-actions a {
    border-radius: 9px;
    color: #526079;
    font-size: 11px;
    font-weight: 750;
}
.quick-actions a:hover { background: #f3f6fb; color: var(--blue-700); }

.empty-inline {
    padding: 32px 22px;
    color: #8995a6;
    font-size: 12px;
    text-align: center;
}
.alert,
.password-expiry-warning { border-radius: 12px; box-shadow: 0 5px 16px rgba(17,30,52,.04); }

.card-collapse-button {
    border-color: var(--ui-border);
    border-radius: 9px;
    background: #f8fafd;
    color: #6f7c90;
}
.card-collapse-button:hover { border-color: #c6d4e7; background: #fff; color: var(--blue-700); }

/* Modale / potwierdzenia */
.ess-confirm-dialog,
.card-preview-dialog,
dialog {
    border-color: var(--ui-border);
    box-shadow: 0 28px 90px rgba(8, 18, 35, .24), 0 4px 12px rgba(8, 18, 35, .08);
}
.ess-confirm-dialog::backdrop,
.card-preview-modal { backdrop-filter: blur(5px); }
.ess-confirm-icon { border-radius: 14px; }

/* Ekran logowania — nowy, spokojniejszy i bardziej premium */
.auth-body {
    position: relative;
    isolation: isolate;
    min-height: 100vh;
    padding: 36px 20px;
    background:
        radial-gradient(circle at 18% 18%, rgba(76, 131, 235, .34), transparent 31rem),
        radial-gradient(circle at 82% 82%, rgba(15, 165, 198, .18), transparent 28rem),
        linear-gradient(145deg, #07111f 0%, #0a1b33 54%, #0d2440 100%);
}
.auth-body::before {
    position: fixed;
    z-index: -1;
    inset: 0;
    background-image:
        linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
    background-size: 44px 44px;
    content: "";
    mask-image: linear-gradient(to bottom, rgba(0,0,0,.65), transparent 88%);
}
.auth-shell { width: min(100%, 430px); }
.auth-shell > .brand { margin-bottom: 22px; }
.auth-system-logo { max-width: 330px; max-height: 82px; filter: drop-shadow(0 8px 18px rgba(0,0,0,.16)); }
.auth-card {
    padding: 29px;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 20px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 32px 100px rgba(0,0,0,.33), inset 0 1px rgba(255,255,255,.8);
}
.auth-heading { margin-bottom: 22px; }
.auth-heading h1 { margin: 5px 0 4px; color: #17243b; font-size: 27px; font-weight: 790; letter-spacing: -.65px; }
.auth-heading p { color: #7d899b; font-size: 11px; }
.auth-card .form-stack { gap: 15px; }
.auth-card input { min-height: 46px; background: #f7f9fc; }
.auth-card .button-wide { min-height: 46px; margin-top: 3px; font-size: 12px; }
.auth-footer { margin-top: 18px; color: #9db0c6; opacity: .9; }

/* Ustawienia i narzędzia administracyjne */
.module-toolbar,
.card-configurator-picker,
.card-configurator-body { border-color: var(--ui-border); background: var(--ui-surface); }
.module-card-summary:hover,
.module-health-details > summary:hover { background: #f7f9fc; }
.module-card[open] > .module-card-summary,
.module-health-details[open] > summary { background: #f8fafd; }
.content-settings-card { border-color: var(--ui-border); box-shadow: var(--shadow); }

/* Dark mode — zachowuje kontrast nowego UI-3 */
html[data-resolved-theme="dark"] {
    --slate-900: #eef3fa;
    --slate-700: #bdc7d5;
    --slate-500: #8f9db0;
    --slate-300: #3a475a;
    --slate-200: #273448;
    --slate-100: #1a2739;
    --slate-50: #111b2a;
    --white: #121d2c;
    --ui-border: #273448;
    --ui-border-strong: #37465b;
    --ui-surface: #121d2c;
    --ui-surface-soft: #162234;
    --ui-page: #0d1725;
    --ui-title: #eef3fa;
    --ui-muted: #91a0b5;
    --shadow: 0 10px 30px rgba(0,0,0,.2), 0 1px 1px rgba(0,0,0,.18);
}
html[data-resolved-theme="dark"] body {
    background: radial-gradient(circle at 100% 0, rgba(37,99,235,.08), transparent 34rem), var(--ui-page);
    color: var(--ui-title);
}
html[data-resolved-theme="dark"] .topbar { border-color: rgba(39,52,72,.88); background: rgba(13,23,37,.84); box-shadow: 0 8px 28px rgba(0,0,0,.08); }
html[data-resolved-theme="dark"] .topbar h1 { color: #f1f5fb; }
html[data-resolved-theme="dark"] .topbar p { border-color: #2e3c50; background: #142134; color: #96a5b8; }
html[data-resolved-theme="dark"] .card,
html[data-resolved-theme="dark"] .panel,
html[data-resolved-theme="dark"] .stat-card,
html[data-resolved-theme="dark"] .mini-card { border-color: #273448; background: #121d2c; }
html[data-resolved-theme="dark"] .card-header,
html[data-resolved-theme="dark"] .panel-header { border-color: #273448; background: linear-gradient(180deg, #142031, #121d2c); }
html[data-resolved-theme="dark"] .card-header h3,
html[data-resolved-theme="dark"] .panel-header h3,
html[data-resolved-theme="dark"] .page-actions h2,
html[data-resolved-theme="dark"] .stat-card strong,
html[data-resolved-theme="dark"] .table-title { color: #edf3fb; }
html[data-resolved-theme="dark"] input,
html[data-resolved-theme="dark"] select,
html[data-resolved-theme="dark"] textarea,
html[data-resolved-theme="dark"] .search-field { border-color: #34445a; background: #101b2a; color: #eef3fa; }
html[data-resolved-theme="dark"] input:hover,
html[data-resolved-theme="dark"] select:hover,
html[data-resolved-theme="dark"] textarea:hover { background: #142033; }
html[data-resolved-theme="dark"] .settings-tabs { border-color: #273448; background: #111c2b; }
html[data-resolved-theme="dark"] .settings-tabs a:hover { background: #182538; color: #dbe4ef; }
html[data-resolved-theme="dark"] .settings-tabs a.is-active { background: #1b2a3f; color: #8db7ff; box-shadow: inset 0 0 0 1px #30425a; }
html[data-resolved-theme="dark"] .filter-card { border-color: #273448; background: linear-gradient(180deg, #142031, #121d2c); }
html[data-resolved-theme="dark"] table thead th { border-color: #273448; background: #162335; color: #8998ad; }
html[data-resolved-theme="dark"] tbody tr { background: #121d2c; }
html[data-resolved-theme="dark"] tbody td { border-color: #223044; color: #c6d0dd; }
html[data-resolved-theme="dark"] tbody tr:hover { background: #172438; }
html[data-resolved-theme="dark"] .button-secondary { border-color: #35465c; background: #162235; color: #c9d3df; }
html[data-resolved-theme="dark"] .button-secondary:hover { border-color: #50647f; background: #1a293e; color: #a8c8ff; }
html[data-resolved-theme="dark"] .button-ghost:hover { background: #18263a; color: #dce5f0; }
html[data-resolved-theme="dark"] .quick-actions a:hover { background: #18263a; }
html[data-resolved-theme="dark"] .empty-inline { color: #8291a6; }

@media (max-width: 980px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .dashboard-side { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 850px) {
    .topbar { min-height: 68px; padding: 10px 16px; }
    .topbar > div { gap: 9px; }
    .topbar p { min-height: 25px; padding: 0 8px; font-size: 9px; }
    .content { padding-top: 22px; }
    .menu-toggle { border-color: var(--ui-border); border-radius: 10px; background: var(--ui-surface); box-shadow: 0 2px 8px rgba(17,30,52,.05); }
}

@media (max-width: 640px) {
    .content { padding-right: 13px; padding-left: 13px; }
    .page-actions { align-items: stretch; margin-bottom: 18px; }
    .page-actions h2 { font-size: 24px; }
    .card-header, .panel-header { padding: 16px; }
    .filter-card { padding: 12px; }
    .settings-tabs { margin-right: -2px; margin-left: -2px; }
    .dashboard-side { grid-template-columns: 1fr; }
    .stat-card { min-height: 94px; }
    .auth-body { padding: 24px 15px; }
    .auth-card { padding: 24px 20px; border-radius: 18px; }
}

/* === 3.1.113 — UI-3 / dopracowanie Dashboardu i ikon === */
.stats-grid.stats-grid-five {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}
.stat-icon svg,
.mini-icon svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.dashboard-grid {
    grid-template-columns: minmax(0, 1fr) 300px;
}
.dashboard-grid.dashboard-grid-single {
    grid-template-columns: minmax(0, 1fr);
}
.dashboard-main {
    display: grid;
    min-width: 0;
    align-content: start;
    gap: 16px;
}
.dashboard-main > .card { min-width: 0; }
.dashboard-main [data-collapsible-card="dashboard-recent-tickets"] .collapsible-card-body {
    max-height: none;
    overflow: visible;
}
.dashboard-main [data-collapsible-card="dashboard-recent-tickets"] .table-wrap {
    overflow-x: auto;
}

@media (max-width: 1150px) {
    .stats-grid.stats-grid-five { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 980px) {
    .dashboard-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 600px) {
    .stats-grid.stats-grid-five { grid-template-columns: minmax(0, 1fr); }
}


/* 3.1.155 — czytelna historia oraz edycja etapów pracy */
#ticket-work-history > .work-history,
#ticket-entries > .work-history,
.card.detail-card > .work-history {
    padding: 18px 20px 22px;
}
.work-entry {
    padding: 14px;
    border: 1px solid var(--slate-200);
    border-radius: var(--ui-radius-control);
    background: var(--slate-50);
}
.work-entry-number {
    border-radius: 50%;
    background: rgba(var(--accent-rgb), .12);
    color: var(--blue-700);
    font-weight: 800;
}
.work-entry-editor {
    margin-top: 12px;
}
.work-entry-editor > summary {
    width: max-content;
    list-style: none;
    cursor: pointer;
}
.work-entry-editor > summary::-webkit-details-marker { display: none; }
.work-entry-editor form {
    display: grid;
    gap: 12px;
    margin-top: 12px;
    padding: 16px;
    border: 1px solid var(--slate-200);
    border-radius: var(--ui-radius-control);
    background: var(--white);
}
.work-entry-delete {
    display: inline-flex;
    margin-top: 10px;
}
html[data-resolved-theme="dark"] .work-entry { background: #121e2d; }
html[data-resolved-theme="dark"] .work-entry-editor form { background: #0e1724; }
@media (max-width: 600px) {
    #ticket-work-history > .work-history,
    #ticket-entries > .work-history,
    .card.detail-card > .work-history { padding: 14px; }
    .work-entry { padding: 12px; }
}


/* ESS 3.1.157 — dostępność i spójność Pulpitu. */
.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}
.dashboard-website-messages {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 22px;
    padding: 18px 20px;
}
.dashboard-website-messages-copy { display: flex; align-items: center; gap: 14px; min-width: 0; }
.dashboard-website-messages-copy h3 { margin: 0 0 3px; }
.dashboard-website-messages-copy p { margin: 0; color: var(--slate-500); }
.dashboard-website-messages-actions { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; }
@media (max-width: 700px) {
    .dashboard-website-messages { align-items: stretch; flex-direction: column; }
    .dashboard-website-messages-actions { justify-content: space-between; }
}


/* ESS 3.1.158 — tygodniowy kalendarz mieści siedem dni na pulpicie. */
.calendar-week-grid {
    grid-template-columns: repeat(7, minmax(0, 1fr));
}
.calendar-week-day { min-width: 0; }
@media (max-width: 900px) {
    .calendar-week-grid { grid-template-columns: repeat(7, minmax(180px, 1fr)); }
    .calendar-week-day { min-width: 180px; }
}


/* ESS 3.1.159 — kompletna siatka miesięcznego kalendarza. */
.calendar-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 14px 16px;
}
.calendar-view-tabs,
.calendar-period-nav {
    display: flex;
    align-items: center;
    gap: 6px;
}
.calendar-period-nav { flex-wrap: wrap; justify-content: flex-end; }
.calendar-period-nav strong {
    min-width: 150px;
    text-align: center;
}
.calendar-card { overflow: hidden; }
.calendar-weekdays,
.calendar-month-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
}
.calendar-weekdays {
    border-bottom: 1px solid var(--slate-200);
    background: var(--slate-50);
}
.calendar-weekdays > span {
    padding: 10px 8px;
    color: var(--slate-500);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .04em;
    text-align: center;
    text-transform: uppercase;
}
.calendar-day {
    min-width: 0;
    min-height: 118px;
    padding: 9px;
    border-right: 1px solid var(--slate-200);
    border-bottom: 1px solid var(--slate-200);
    background: var(--white);
}
.calendar-day:nth-child(7n) { border-right: 0; }
.calendar-day:nth-last-child(-n + 7) { border-bottom: 0; }
.calendar-day.is-outside { background: var(--slate-50); color: var(--slate-500); }
.calendar-day.is-today { box-shadow: inset 0 0 0 2px rgba(var(--accent-rgb), .48); }
.calendar-day-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    margin-bottom: 7px;
}
.calendar-day-head > a {
    display: inline-grid;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    font-weight: 800;
    place-items: center;
}
.calendar-day.is-today .calendar-day-head > a {
    background: var(--blue-700);
    color: var(--white);
}
.calendar-day-head > span {
    color: var(--slate-500);
    font-size: 10px;
    font-weight: 800;
}
.calendar-day-events { display: grid; gap: 5px; min-width: 0; }
@media (max-width: 980px) {
    .calendar-weekdays,
    .calendar-month-grid { grid-template-columns: repeat(7, minmax(108px, 1fr)); }
    .calendar-day { min-height: 104px; }
}


/* ESS 3.1.160 — wspólna nawigacja i aktywne dni miesiąca. */
.topbar-back {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 6px 10px;
    border: 1px solid var(--slate-200);
    border-radius: var(--ui-radius-control);
    background: var(--white);
    color: var(--slate-700);
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}
.topbar-back:hover { border-color: var(--blue-600); color: var(--blue-700); }
.calendar-day[data-calendar-create-url] { cursor: pointer; }
.calendar-day[data-calendar-create-url]:hover { background: rgba(var(--accent-rgb), .045); }
.calendar-day[data-calendar-create-url]:focus-visible {
    position: relative;
    z-index: 1;
    outline: 3px solid rgba(var(--accent-rgb), .34);
    outline-offset: -3px;
}
html[data-resolved-theme="dark"] .topbar-back { background: #121e2d; border-color: #2a3a4f; }
@media (max-width: 640px) {
    .topbar-back { padding-inline: 8px; }
    .topbar-title p { display: none; }
}


/* === 3.1.163 — dostępny modal etapu przy tworzeniu zlecenia === */
#ticket-work-stage-dialog {
    width: min(760px, calc(100vw - 32px));
    max-width: 760px;
    max-height: calc(100dvh - 32px);
    padding-bottom: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
}
#ticket-work-stage-dialog .sticky-form-actions {
    position: sticky;
    z-index: 4;
    bottom: 0;
    margin: 18px -24px 0;
    padding: 16px 24px;
    border-top: 1px solid var(--ui-border);
    background: var(--white);
    box-shadow: 0 -10px 24px rgba(8, 18, 35, .08);
}
html[data-resolved-theme="dark"] #ticket-work-stage-dialog .sticky-form-actions {
    background: #111d2b;
}
@media (max-width: 600px) {
    #ticket-work-stage-dialog {
        width: calc(100vw - 12px);
        max-height: calc(100dvh - 12px);
        padding-inline: 14px;
    }
    #ticket-work-stage-dialog .sticky-form-actions {
        align-items: stretch;
        flex-direction: column-reverse;
        margin-inline: -14px;
        padding-inline: 14px;
    }
    #ticket-work-stage-dialog .sticky-form-actions .button {
        width: 100%;
    }
}


/* === 3.1.165 — bezpośrednie Zlecenia i spójny przycisk Wstecz === */
.main-nav .nav-direct-submenu {
    margin: -2px 0 7px 18px;
    padding: 2px 0 2px 12px;
    border-left: 1px solid rgba(150,177,213,.16);
}
.main-nav .nav-direct-submenu a {
    display: flex;
    min-height: 32px;
    align-items: center;
    gap: 8px;
    margin: 1px 0;
    padding: 0 10px;
    border-radius: 8px;
    color: #91a2bb;
    font-size: 11px;
    font-weight: 650;
}
.main-nav .nav-direct-submenu a:hover { background: rgba(255,255,255,.045); color: #eaf1fa; }
.main-nav .nav-direct-submenu a.is-active { background: rgba(59,120,238,.13); color: #dce9ff; }

.back-link {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin: 0 0 10px;
    padding: 6px 12px;
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-control);
    background: var(--ui-surface);
    color: var(--blue-700);
    box-shadow: 0 3px 10px rgba(8,18,35,.06);
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
    vertical-align: middle;
}
.back-link:hover {
    border-color: rgba(var(--accent-rgb), .45);
    background: rgba(var(--accent-rgb), .07);
    color: var(--blue-700);
    transform: translateY(-1px);
}
.page-actions .back-link { align-self: flex-start; }


/* ESS 3.1.169 — uporządkowany widok rozliczeń */
.page-title-row .back-link { margin-right: 14px; }
.settlements-filter-grid { display: grid; grid-template-columns: minmax(260px, 2fr) 140px 140px auto auto; align-items: end; gap: 12px; }
.settlements-filter-grid > select { width: 100%; max-width: none; }
.settlements-filter-grid > label { margin: 0; }
.settlements-summary-grid { margin-bottom: 22px; }
.settlements-summary-grid + .table-card,
.table-card + .table-card,
.table-card + .settlements-pdf-card,
.settlements-pdf-card + .table-card { margin-top: 22px; }
.settlements-pdf-card { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 20px 22px; }
.settlements-pdf-card h3 { margin: 0 0 4px; }
.settlements-pdf-card p { margin: 0; color: var(--muted); }
.settlements-pdf-dialog { width: min(760px, calc(100vw - 32px)); max-height: calc(100vh - 40px); overflow: auto; }
.settlements-pdf-dialog::backdrop { background: rgba(3, 10, 22, .72); backdrop-filter: blur(3px); }

.calendar-window-grid { display: grid; grid-template-columns: repeat(2, minmax(420px, 1fr)); gap: 16px; align-items: start; }
.calendar-window { min-width: 0; overflow: hidden; }
.calendar-window.is-wide { grid-column: 1 / -1; }
.calendar-window iframe { display: block; width: 100%; height: 620px; border: 0; background: var(--slate-50); }
.calendar-window-body { margin: 0; padding: 12px; background: var(--slate-50); color: var(--slate-900); }
.calendar-window-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.calendar-window-heading-row { display:flex; align-items:center; gap:22px; min-width:0; }
.calendar-window-title { color:var(--slate-900); font-size:14px; white-space:nowrap; }
.calendar-window-period { display:flex; align-items:center; justify-content:flex-end; gap:6px; flex-wrap:wrap; }
.calendar-window-period strong { min-width:145px; text-align:center; }
.calendar-window-month { min-width:760px; }
.calendar-window-month .calendar-day { min-height:116px; }
.calendar-day-actions { display:flex; align-items:center; gap:5px; }
.calendar-day-actions small { color:var(--slate-500); font-size:10px; font-weight:800; }
.calendar-window-add { display:inline-grid; width:26px; height:26px; place-items:center; border:1px solid var(--slate-200); border-radius:8px; color:var(--blue-700); font-size:18px; font-weight:800; line-height:1; }
.calendar-window-add:hover { border-color:var(--blue-600); background:var(--blue-100); }
.calendar-window-day-head { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:46px; padding:9px 11px; border-bottom:1px solid var(--slate-200); }
.calendar-window-week { grid-template-columns:repeat(7,minmax(130px,1fr)); min-width:910px; overflow:visible; }
.calendar-window-week .calendar-week-day { min-width:0; overflow:hidden; }
.calendar-window-week .calendar-agenda { padding:8px; }
.calendar-window-week .calendar-agenda-item { padding:8px; }
.calendar-window-day-view { overflow:hidden; }
.calendar-window-days { display: grid; gap: 10px; }
.calendar-window-day { padding: 10px; border: 1px solid var(--slate-200); border-radius: var(--ui-radius-control); background: var(--slate-0); }
.calendar-window-day .calendar-agenda-item { margin-top: 8px; }
html[data-resolved-theme="dark"] .calendar-window-body,
html[data-resolved-theme="dark"] .calendar-window iframe { background: #0b1725; color: #f4f7fb; }
html[data-resolved-theme="dark"] .calendar-window-day { background: #111e2d; border-color: #2a3a4f; }
html[data-resolved-theme="dark"] .calendar-window-title,
html[data-resolved-theme="dark"] .calendar-window-period strong { color:#f4f7fb; }
html[data-resolved-theme="dark"] .calendar-window-body .calendar-event { color:#75b7ff; background:#13243a; }
html[data-resolved-theme="dark"] .calendar-window-body .calendar-event strong { color:#a9d2ff; }
html[data-resolved-theme="dark"] .calendar-window-body .calendar-window-add { color:#8fc5ff; border-color:#3b526f; background:#142235; }
html[data-resolved-theme="dark"] .calendar-window-body .calendar-day.is-outside { color:#778aa3; background:#0d1825; }
@media (max-width: 980px) { .calendar-window-grid { grid-template-columns: 1fr; } .calendar-window-toolbar { align-items: flex-start; flex-direction: column; } .calendar-window-period { width:100%; justify-content:flex-start; } .calendar-window-heading-row{width:100%;flex-wrap:wrap}.calendar-window-title{white-space:normal} }
.calendar-launch-tile { width: min(430px,100%); display:flex; align-items:center; gap:16px; padding:22px; text-align:left; cursor:pointer; color:inherit; }
.calendar-launch-tile strong,.calendar-launch-tile small { display:block; }
.calendar-launch-tile strong { font-size:18px; margin-bottom:5px; }
.calendar-floating-layer { position:fixed; inset:0; z-index:80; pointer-events:none; }
.calendar-floating-window { position:absolute; width:min(760px,calc(100vw - 40px)); height:min(690px,calc(100vh - 80px)); min-width:420px; min-height:360px; overflow:hidden; resize:both; pointer-events:auto; border:1px solid var(--slate-200); border-radius:16px; background:var(--slate-0); box-shadow:0 24px 70px rgba(3,10,22,.35); }
.calendar-floating-window>header { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:62px; padding:10px 14px; cursor:move; user-select:none; border-bottom:1px solid var(--slate-200); background:var(--slate-50); }
.calendar-floating-window>header strong,.calendar-floating-window>header small { display:block; }
.calendar-floating-window>header small { margin-top:2px; color:var(--slate-500); }
.calendar-floating-window iframe { width:100%; height:calc(100% - 62px); border:0; display:block; background:var(--slate-50); }
.calendar-floating-window.is-maximized { position:fixed; inset:18px!important; width:auto!important; height:auto!important; resize:none; }
html[data-resolved-theme="dark"] .calendar-floating-window,html[data-resolved-theme="dark"] .calendar-floating-window>header { background:#111e2d; border-color:#2a3a4f; }
@media(max-width:700px){.calendar-floating-window{left:8px!important;top:70px!important;width:calc(100vw - 16px);height:calc(100vh - 90px);min-width:0;resize:none}.calendar-floating-window.is-maximized{inset:8px!important}}
.dashboard-calendar-launch { width:100%; display:flex; align-items:center; gap:16px; padding:18px 20px; margin-bottom:16px; color:inherit; text-align:left; cursor:pointer; }
.dashboard-calendar-launch>span:nth-child(2) { flex:1; }
.dashboard-calendar-launch strong,.dashboard-calendar-launch small { display:block; }
.dashboard-calendar-launch strong { font-size:16px; margin-bottom:4px; }
.dashboard-calendar-launch-status { display:flex; align-items:center; gap:10px; }
@media(max-width:700px){.dashboard-calendar-launch{align-items:flex-start;flex-wrap:wrap}.dashboard-calendar-launch-status{width:100%;justify-content:flex-end}}
.settlements-pdf-options { margin-top: 18px; }
@media (max-width: 900px) {
    .settlements-filter-grid { grid-template-columns: 1fr 1fr; }
    .settlements-filter-grid > select { grid-column: 1 / -1; }
}
@media (max-width: 620px) {
    .settlements-filter-grid { grid-template-columns: 1fr; }
    .settlements-filter-grid > select { grid-column: auto; }
    .settlements-pdf-card { align-items: stretch; flex-direction: column; }
    .settlements-pdf-card .button { width: 100%; }
}

/* ESS 3.1.170 — odstęp przycisku Wstecz od tytułu w górnym pasku. */
.topbar > .topbar-back { margin-right: 14px; flex: 0 0 auto; }

/* ESS 3.1.171 — klikalna kwota wszystkich nierozliczonych. */
.settlements-outstanding-card { color: inherit; text-decoration: none; cursor: pointer; }
.settlements-outstanding-card:hover { border-color: var(--blue-600); transform: translateY(-1px); }
.settlements-outstanding-card small { display: block; margin-top: 3px; color: var(--slate-500); font-size: 10px; }

/* ESS 3.1.172 — raport PDF jako kafelek podsumowania. */
.settlements-pdf-tile { width: auto; min-height: 102px; padding: 18px; border: 1px solid var(--slate-200); background: var(--white); color: inherit; text-align: left; cursor: pointer; }
.settlements-pdf-tile:hover { border-color: var(--blue-600); transform: translateY(-1px); }
.settlements-pdf-tile .stat-icon { font-size: 10px; letter-spacing: -.2px; }
.settlements-pdf-tile small { display: block; margin-top: 3px; color: var(--slate-500); font-size: 10px; }
html[data-resolved-theme="dark"] .settlements-pdf-tile { background: #121e2d; border-color: #2a3a4f; }


/* ESS 3.1.187 — zwarty wybór i czytelne okno kalendarza. */
.calendar-picker-row {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(260px, 1fr) auto;
    align-items: end;
    gap: 12px;
    padding: 18px 22px 22px;
}
.calendar-picker-row > label { margin: 0; }
.calendar-picker-actions { display: flex; align-items: center; gap: 9px; padding-bottom: 1px; }
.calendar-picker-actions .button { min-width: 82px; }
.calendar-window-body { padding: 12px 14px 16px !important; box-sizing: border-box; overflow: auto; }
.calendar-window-toolbar { width: 100%; box-sizing: border-box; }
.calendar-window-body .calendar-event { display: flex; align-items: center; gap: 5px; padding: 5px 7px; }
.calendar-window-body .calendar-event strong { flex: 0 0 auto; }
.calendar-window-body .calendar-event span { min-width: 0; }
html[data-resolved-theme="dark"] .calendar-window-body .calendar-event-done { opacity: .9; }
@media (max-width: 760px) {
    .calendar-picker-row { grid-template-columns: 1fr; }
    .calendar-picker-actions { justify-content: flex-end; }
}


/* ESS 3.1.188 — wyśrodkowany pasek wyboru kalendarza. */
.calendar-picker-row {
    grid-template-columns: minmax(260px, 330px) minmax(260px, 330px) auto;
    justify-content: center;
    align-items: end;
    column-gap: 12px;
    padding-right: 28px;
    padding-left: 28px;
}
.calendar-picker-row > label {
    align-self: end;
}
.calendar-picker-row select,
.calendar-picker-actions .button {
    height: 44px;
    min-height: 44px;
    box-sizing: border-box;
}
.calendar-picker-actions {
    height: 44px;
    align-self: end;
    padding-bottom: 0;
}
@media (max-width: 760px) {
    .calendar-picker-row {
        grid-template-columns: minmax(0, 1fr);
        justify-content: stretch;
    }
    .calendar-picker-actions {
        width: 100%;
        justify-content: center;
    }
}


/* Kompaktowe preferencje powiadomień w tabeli użytkowników klienta. */
.client-notification-form {
    display: grid;
    min-width: 190px;
    gap: 9px;
}
.client-notification-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px 12px;
}
.client-notification-option {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    min-width: 0;
    color: var(--slate-700);
    font-size: 11px;
    font-weight: 650;
    line-height: 1.25;
    white-space: nowrap;
    cursor: pointer;
}
.client-notification-option input[type="checkbox"] {
    flex: 0 0 16px;
    width: 16px;
    height: 16px;
    min-height: 0;
    margin: 0;
    padding: 0;
    accent-color: var(--blue-600);
}
.client-notification-option span {
    min-width: 0;
}
.client-notification-save {
    justify-self: start;
}
@media (max-width: 720px) {
    .client-notification-options {
        grid-template-columns: 1fr;
    }
}


/* 3.1.204 — pulpit firmy i okna zarządzania. */
.company-workspace { overflow: hidden; }
.company-workspace-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 12px;
    padding: 18px 22px 22px;
}
.company-location-add > summary { width: max-content; list-style: none; cursor: pointer; }
.company-location-add > summary::-webkit-details-marker { display: none; }
.company-location-add > form { margin-top: 16px; }
.company-workspace-item {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    min-width: 0;
    min-height: 76px;
    padding: 14px;
    border: 1px solid var(--slate-200);
    border-radius: var(--ui-radius-control);
    background: var(--slate-50);
    color: var(--slate-900);
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: border-color var(--ui-transition-fast), transform var(--ui-transition-fast), background var(--ui-transition-fast);
}
.company-workspace-item:hover { border-color: #b8d7f7; background: var(--blue-100); color: var(--slate-900); transform: translateY(-1px); }
.company-workspace-icon { display: grid; width: 38px; height: 38px; flex: 0 0 38px; border-radius: 10px; background: var(--blue-100); color: var(--blue-700); font-size: 16px; font-weight: 900; place-items: center; }
.company-workspace-item > span:last-child { display: grid; min-width: 0; gap: 2px; }
.company-workspace-item strong { font-size: 13px; }
.company-workspace-item small { color: var(--slate-500); font-size: 10px; line-height: 1.35; }

.company-dialog {
    width: min(720px, calc(100vw - 28px));
    max-height: calc(100vh - 40px);
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--slate-200);
    border-radius: var(--ui-radius-modal);
    background: var(--white);
    color: var(--slate-900);
    box-shadow: 0 24px 80px rgba(7, 20, 38, .32);
}
.company-dialog-wide { width: min(980px, calc(100vw - 28px)); }
.company-dialog-users { width: min(1380px, calc(100vw - 28px)); }
.company-dialog::backdrop { background: rgba(7, 20, 38, .68); backdrop-filter: blur(3px); }
.company-dialog-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 18px 22px; border-bottom: 1px solid var(--slate-200); }
.company-dialog-header h3 { margin: 0; font-size: 17px; }
.company-dialog-header p { margin: 3px 0 0; color: var(--slate-500); font-size: 11px; }
.company-dialog-close { display: grid; width: 38px; height: 38px; min-height: 38px; padding: 0; border: 1px solid var(--slate-200); border-radius: var(--ui-radius-control); background: transparent; color: var(--slate-700); font-size: 22px; cursor: pointer; place-items: center; }
.company-dialog-body { max-height: calc(100vh - 120px); padding: 22px; overflow: auto; }
.company-dialog-body > .card { box-shadow: none; }
.company-dialog-actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--slate-200); }
html[data-resolved-theme="dark"] .company-workspace-item { background: #111d2b; }
html[data-resolved-theme="dark"] .company-workspace-item:hover { background: #162b43; }
html[data-resolved-theme="dark"] .company-dialog { background: #111d2b; color: #f4f7fb; }
html[data-resolved-theme="dark"] .company-dialog-header,
html[data-resolved-theme="dark"] .company-dialog-actions { border-color: var(--slate-200); }

@media (max-width: 980px) {
    .company-workspace-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
    .company-workspace-grid { grid-template-columns: 1fr; padding: 14px; }
    .company-dialog-body { padding: 16px; }
    .company-dialog-actions { align-items: stretch; flex-direction: column-reverse; }
    .company-dialog-actions .button { width: 100%; }
}

/* ESS 3.1.220 — porządki wizualne i ergonomia. */
.rustdesk-copy-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:stretch;gap:10px}.rustdesk-copy-row>.button{min-width:92px;align-self:stretch}.rustdesk-copy-row-textarea{align-items:end}.rustdesk-copy-row-textarea>.button{min-height:42px;align-self:end}.dashboard-messages-empty .empty-inline{padding:18px 20px}.company-workspace-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.settlements-page-actions{justify-content:flex-end;flex-wrap:wrap}.ticket-action-menu{position:relative;align-items:flex-start}.ticket-more-actions{position:relative;z-index:9}.ticket-more-actions>summary{display:inline-flex;list-style:none;cursor:pointer;user-select:none}.ticket-more-actions>summary::-webkit-details-marker{display:none}.ticket-more-actions[open]>summary{border-color:var(--blue-600);color:var(--blue-700)}.ticket-more-actions-menu{position:absolute;top:calc(100% + 7px);right:0;display:grid;width:min(260px,calc(100vw - 32px));gap:7px;padding:10px;border:1px solid var(--slate-200);border-radius:var(--ui-radius-control);background:var(--white);box-shadow:0 18px 45px rgba(7,20,38,.2)}.ticket-more-actions-menu .button,.ticket-more-actions-menu form{width:100%}.ticket-more-actions-menu .button{justify-content:flex-start;text-align:left}html[data-resolved-theme="dark"] .ticket-more-actions-menu{border-color:#2a3a4f;background:#121e2d}@media(max-width:1150px){.company-workspace-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.rustdesk-copy-row{grid-template-columns:1fr}.rustdesk-copy-row>.button{width:100%}.company-workspace-grid{grid-template-columns:1fr}.settlements-page-actions{width:100%}.settlements-page-actions .button{width:100%}.ticket-more-actions,.ticket-more-actions>summary{width:100%}.ticket-more-actions-menu{position:static;width:100%;margin-top:7px;box-shadow:none}}