:root {
    --app-header-height: 70px;
    color-scheme: light;
    --bg: #f3f6fa;
    --surface: #ffffff;
    --surface-soft: #f8fafc;
    --surface-strong: #eef2f7;
    --text: #142033;
    --muted: #6c788c;
    --faint: #94a0b2;
    --border: #e2e7ef;
    --navy: #0b1d3a;
    --navy-soft: #132a4d;
    --primary: #2f6feb;
    --primary-soft: #e9f0ff;
    --shadow: 0 12px 35px rgba(23, 42, 75, .07);
    --maui-status-bar-safe-area-background: #0b1d3a;
}

:root[data-theme="dark"] {
    color-scheme: dark;
    --bg: #0c1422;
    --surface: #121d2e;
    --surface-soft: #172438;
    --surface-strong: #1c2b41;
    --text: #ecf2fb;
    --muted: #9ba9bd;
    --faint: #728198;
    --border: #27364c;
    --navy: #07101f;
    --navy-soft: #0f213c;
    --primary: #6e9cff;
    --primary-soft: #1c3158;
    --shadow: 0 14px 38px rgba(0, 0, 0, .22);
    --maui-status-bar-safe-area-background: #07101f;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scrollbar-width: thin; scrollbar-color: rgba(125,158,211,.42) rgba(4,18,38,.18); }
html::-webkit-scrollbar { width: 10px; }
html::-webkit-scrollbar-track { background: rgba(4,18,38,.18); }
html::-webkit-scrollbar-thumb { border: 3px solid transparent; border-radius: 99px; background: rgba(125,158,211,.42); background-clip: padding-box; }
html::-webkit-scrollbar-thumb:hover { background: rgba(142,176,232,.7); background-clip: padding-box; }
html, body { margin: 0; min-height: 100%; font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: var(--bg); color: var(--text); }
body { transition: background-color .2s ease, color .2s ease; }
button, a { font: inherit; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
.app-icon { width: 1em; height: 1em; display: block; flex: 0 0 auto; overflow: visible; }
.icon-text { display: inline-flex; align-items: center; gap: 5px; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 246px minmax(0, 1fr); background: var(--bg); }
.app-sidebar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; background: linear-gradient(180deg, var(--navy), #0c2345 100%); color: #fff; z-index: 20; }
.app-stage { min-width: 0; }
.app-topbar { height: var(--app-header-height); min-height: var(--app-header-height); padding: 0 38px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--border); background: color-mix(in srgb, var(--surface) 92%, transparent); backdrop-filter: blur(14px); position: sticky; top: 0; z-index: 15; }
.eyebrow, .page-kicker { display: block; color: var(--faint); font-size: .68rem; line-height: 1; font-weight: 800; letter-spacing: .12em; }
.topbar-greeting { margin-top: 7px; font-weight: 750; font-size: 1rem; }
.topbar-actions { display: flex; align-items: center; gap: 12px; }
.theme-toggle, .notification-button { height: 42px; border-radius: 12px; border: 1px solid var(--border); background: var(--surface-soft); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: .18s ease; }
.theme-toggle { padding: 0 14px; gap: 8px; font-size: .8rem; font-weight: 750; }
.theme-icon { display: grid; place-items: center; font-size: 1.05rem; }
.theme-toggle:hover, .notification-button:hover { border-color: var(--primary); transform: translateY(-1px); }
.notification-button { width: 42px; position: relative; color: var(--text); font-size: 1.25rem; text-decoration: none; }.notification-button > span:first-child { display: grid; place-items: center; }
.notification-dot { position: absolute; width: 7px; height: 7px; right: 10px; top: 9px; border-radius: 99px; background: #f24e63; border: 2px solid var(--surface-soft); }
.notification-count { position: absolute; min-width: 17px; height: 17px; padding: 0 4px; right: -5px; top: -5px; display: grid; place-items: center; border: 2px solid var(--surface); border-radius: 99px; color: #fff; background: #f24e63; font-size: .5rem; font-weight: 850; line-height: 1; }
.profile-menu-shell { position: relative; z-index: 42; }
.profile-chip { display: flex; align-items: center; gap: 10px; }
.profile-trigger { min-height: 42px; padding: 3px 7px 3px 7px; border: 1px solid transparent; border-radius: 13px; color: var(--text); background: transparent; cursor: pointer; transition: background .18s ease, border-color .18s ease; }
.profile-trigger:hover, .profile-trigger.open { border-color: var(--border); background: var(--surface-soft); }
.avatar { width: 38px; height: 38px; display: grid; place-items: center; background: var(--primary-soft); color: var(--primary); border-radius: 12px; font-size: .76rem; font-weight: 850; }
.profile-copy { display: flex; flex-direction: column; align-items: flex-start; text-align: left; line-height: 1.2; }
.profile-copy strong { font-size: .82rem; }
.profile-copy small { margin-top: 3px; color: var(--muted); font-size: .72rem; }
.profile-chevron { margin: 0 2px 0 4px; display: grid; place-items: center; color: var(--faint); font-size: .8rem; transition: transform .18s ease; }.profile-trigger.open .profile-chevron { transform: rotate(180deg); }
.profile-menu { position: absolute; top: calc(100% + 19px); right: 0; z-index: 41; width: 225px; padding: 8px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); box-shadow: 0 22px 55px rgba(4, 13, 28, .22); }
.profile-menu-identity { display: flex; align-items: center; gap: 11px; padding: 9px 9px 13px; border-bottom: 1px solid var(--border); }.profile-menu-identity > div { min-width: 0; display: flex; flex-direction: column; }.profile-menu-identity strong { overflow: hidden; color: var(--text); font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }.profile-menu-identity small { margin-top: 4px; color: var(--muted); font-size: .62rem; }
.profile-menu dl { margin: 5px 0; }.profile-menu dl > div { min-height: 34px; padding: 0 9px; display: flex; align-items: center; justify-content: space-between; gap: 15px; }.profile-menu dt { color: var(--faint); font-size: .59rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }.profile-menu dd { margin: 0; color: var(--text); font-size: .66rem; font-weight: 750; }
.profile-menu-link, .profile-support-link, .profile-logout-form button, .profile-mobile-logout { width: 100%; min-height: 40px; padding: 0 10px; display: flex; align-items: center; gap: 9px; border: 0; color: var(--muted); background: transparent; font-size: .68rem; font-weight: 750; cursor: pointer; text-align: left; }.profile-menu-link { border-bottom: 1px solid var(--border); border-radius: 10px 10px 0 0; }.profile-support-link { border-bottom: 1px solid var(--border); }.profile-menu-link:hover, .profile-menu-link.active, .profile-support-link:hover, .profile-support-link.active, .profile-logout-form button:hover, .profile-mobile-logout:hover { color: var(--text); background: var(--surface-soft); }.profile-menu-link > span, .profile-support-link > span, .profile-logout-form button > span, .profile-mobile-logout > span { width: 18px; display: grid; place-items: center; color: var(--primary); text-align: center; font-size: .9rem; }.profile-menu-link b, .profile-support-link b { width: 14px; margin-left: auto; display: grid; place-items: center; font-size: .85rem; }.profile-menu-logout-form { margin: 0; }.profile-mobile-logout { margin-top: 0; border-radius: 0 0 10px 10px; }
.logout-confirmation-backdrop { z-index: 120; }.logout-confirmation { width: min(100%, 430px); padding: 29px; border: 1px solid var(--border); border-radius: 20px; color: var(--text); background: var(--surface); box-shadow: 0 28px 80px rgba(0,0,0,.3); }.logout-confirmation-symbol { width: 45px; height: 45px; margin-bottom: 20px; display: grid; place-items: center; border-radius: 13px; color: var(--primary); background: var(--primary-soft); font-size: 1.25rem; font-weight: 850; }.logout-confirmation-symbol.danger { color: #d55362; background: rgba(213,83,98,.14); }.logout-confirmation h2 { margin: 9px 0 8px; font-size: 1.35rem; letter-spacing: -.035em; }.logout-confirmation > p { margin: 0; color: var(--muted); font-size: .72rem; line-height: 1.55; }.logout-confirmation > p strong { color: var(--text); }.logout-confirmation .dialog-actions { align-items: center; }.logout-confirmation-form { margin: 0; }.logout-confirm-button { min-height: 40px; padding: 0 16px; border: 0; border-radius: 10px; color: #fff; background: #d4515f; font-size: .7rem; font-weight: 800; cursor: pointer; }.logout-confirm-button:disabled { opacity: .62; cursor: wait; }
.app-content { padding: 34px 38px 48px; }

.brand-block { height: var(--app-header-height); min-height: var(--app-header-height); flex: 0 0 var(--app-header-height); display: flex; align-items: center; padding: 0 24px; border-bottom: 1px solid rgba(255,255,255,.08); }
.brand { display: flex; align-items: center; gap: 12px; }
.brand > span:last-child { display: flex; flex-direction: column; }
.brand strong { font-size: 1.2rem; letter-spacing: -.03em; }
.brand small { color: #8fa2bd; margin-top: 2px; font-size: .69rem; }
.brand-mark { width: 35px; height: 35px; position: relative; border: 2px solid #74a0ff; border-radius: 50%; display: grid; place-items: center; }
.brand-mark::before { content: ""; width: 2px; height: 15px; background: #74a0ff; transform-origin: top; transform: translateY(7px) rotate(24deg); border-radius: 2px; }
.brand-mark span { width: 6px; height: 6px; background: #fff; border-radius: 50%; position: absolute; top: 6px; }
.primary-nav { min-height: 0; padding: 25px 13px; flex: 1; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(125,158,211,.42) rgba(4,18,38,.18); }
.primary-nav::-webkit-scrollbar { width: 7px; }
.primary-nav::-webkit-scrollbar-track { background: rgba(4,18,38,.18); }
.primary-nav::-webkit-scrollbar-thumb { border: 2px solid transparent; border-radius: 99px; background: rgba(125,158,211,.42); background-clip: padding-box; }
.primary-nav::-webkit-scrollbar-thumb:hover { background: rgba(142,176,232,.7); background-clip: padding-box; }
.nav-section-label { padding: 0 13px 10px; color: #6f829e; font-size: .62rem; font-weight: 800; letter-spacing: .15em; }
.admin-label { margin-top: 25px; }
.nav-entry { min-height: 44px; padding: 0 13px; margin: 3px 0; display: flex; align-items: center; gap: 12px; color: #aebbd0; border-radius: 11px; font-size: .82rem; font-weight: 650; transition: .16s ease; }
.nav-entry:hover { color: #fff; background: rgba(255,255,255,.07); }
.nav-entry.active { color: #fff; background: linear-gradient(90deg, rgba(66,119,231,.35), rgba(66,119,231,.13)); box-shadow: inset 3px 0 #5f91f8; }
.nav-symbol { width: 20px; display: grid; place-items: center; text-align: center; font-size: 1.05rem; }
.nav-badge { margin-left: auto; min-width: 20px; height: 20px; padding: 0 6px; display: grid; place-items: center; border-radius: 99px; color: #fff; background: #426fe0; font-size: .66rem; }
.admin-attention-badge { background: #e54858; box-shadow: 0 0 0 3px color-mix(in srgb, #e54858 18%, transparent); }
.request-attention-badge { background: #e54858; box-shadow: 0 0 0 3px color-mix(in srgb, #e54858 18%, transparent); }
.sidebar-footer { padding: 12px 17px max(20px, env(safe-area-inset-bottom)); }
.published-state { display: flex; align-items: center; gap: 10px; padding: 12px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.07); border-radius: 12px; }
.published-state > span { width: 8px; height: 8px; border-radius: 50%; background: #3ddc97; box-shadow: 0 0 0 4px rgba(61,220,151,.12); }
.published-state div { display: flex; flex-direction: column; }
.published-state strong { font-size: .71rem; }
.published-state small { color: #8296b3; margin-top: 3px; font-size: .62rem; }
.sidebar-footer button { width: 100%; border: 0; background: transparent; color: #879ab6; display: flex; justify-content: space-between; padding: 15px 4px 0; font-size: .69rem; cursor: pointer; }
.logout-form { margin: 0; }
.logout-form button:hover { color: #fff; }
.sidebar-role { margin-top: 10px; display: flex; align-items: center; justify-content: space-between; color: #8fa2bd; font-size: .58rem; letter-spacing: .08em; }
.sidebar-role span { font-weight: 850; }
.sidebar-role small { color: #6f829e; font-size: .58rem; letter-spacing: 0; }
.sidebar-support-link { min-height: 44px; padding: 0 12px; display: flex; align-items: center; gap: 11px; border: 1px solid rgba(255,255,255,.08); border-radius: 11px; color: #9fb0c9; background: rgba(255,255,255,.035); font-size: .7rem; transition: .16s ease; }
.sidebar-support-link > span { width: 22px; height: 22px; display: grid; place-items: center; border: 1px solid rgba(116,160,255,.55); border-radius: 50%; color: #8db0ff; font-size: .66rem; font-weight: 850; }
.sidebar-support-link strong { font-weight: 720; }.sidebar-support-link b { width: 15px; margin-left: auto; display: grid; place-items: center; color: #6f829e; font-size: .9rem; }.sidebar-support-link:hover, .sidebar-support-link.active { color: #fff; border-color: rgba(116,160,255,.32); background: rgba(66,119,231,.14); }

.dashboard { max-width: 1420px; margin: 0 auto; }
.welcome-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 25px; }
.welcome-row h1 { margin: 8px 0 5px; font-size: clamp(1.7rem, 3vw, 2.35rem); letter-spacing: -.045em; line-height: 1.08; }
.welcome-row h1:focus { outline: none; }
.welcome-row p { margin: 0; color: var(--muted); font-size: .82rem; }
.primary-action { height: 44px; border: 0; padding: 0 17px; display: inline-flex; align-items: center; justify-content: center; border-radius: 12px; color: #fff; background: linear-gradient(135deg, #326fe9, #2458c7); box-shadow: 0 9px 20px rgba(47,111,235,.22); font-size: .8rem; font-weight: 750; text-decoration: none; cursor: pointer; }
.primary-action span { margin-right: 7px; font-size: 1rem; }
.summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 17px; }
.summary-card { min-width: 0; min-height: 112px; display: flex; align-items: center; gap: 14px; padding: 19px; border: 1px solid var(--border); border-radius: 16px; background: var(--surface); box-shadow: var(--shadow); }
.summary-icon { flex: 0 0 42px; width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; font-size: 1.15rem; font-weight: 800; }
.summary-card > div:last-child { min-width: 0; display: flex; flex-direction: column; }
.summary-card span { color: var(--faint); font-size: .6rem; font-weight: 850; letter-spacing: .1em; }
.summary-card strong { margin-top: 5px; font-size: 1.25rem; letter-spacing: -.025em; }
.summary-card small { color: var(--muted); margin-top: 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .67rem; }
.accent-blue .summary-icon { color: #2f6feb; background: #eaf1ff; }
.accent-green .summary-icon { color: #179667; background: #e7f8f1; }
.accent-amber .summary-icon { color: #d68122; background: #fff3df; }
.accent-violet .summary-icon { color: #7b5ce1; background: #f0ecff; }
:root[data-theme="dark"] .accent-blue .summary-icon { background: #18315e; }
:root[data-theme="dark"] .accent-green .summary-icon { background: #123e35; }
:root[data-theme="dark"] .accent-amber .summary-icon { background: #4a3418; }
:root[data-theme="dark"] .accent-violet .summary-icon { background: #302755; }
.content-grid { display: grid; grid-template-columns: minmax(0, 1.85fr) minmax(285px, .8fr); gap: 17px; }
.home-next-shift { margin: 0 0 17px; }
.home-overview-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(270px, .32fr); gap: 17px; align-items: stretch; }
.home-stats-column { display: grid; grid-template-rows: repeat(3, minmax(0, 1fr)); gap: 14px; }
.home-stats-column .summary-card { min-height: 0; height: 100%; }
.home-activity-panel { margin-top: 17px; }
.home-activity-panel .activity-list { max-height: 300px; overflow-y: auto; display: grid; grid-template-columns: minmax(0, 1fr); }
.panel { border: 1px solid var(--border); border-radius: 17px; background: var(--surface); box-shadow: var(--shadow); overflow: hidden; }
.panel-heading { min-height: 83px; padding: 20px 22px; display: flex; align-items: center; justify-content: space-between; gap: 15px; border-bottom: 1px solid var(--border); }
.panel-heading h2 { margin: 7px 0 0; font-size: 1rem; letter-spacing: -.015em; }
.panel-heading-actions { display: flex; align-items: center; gap: 14px; }
.sync-note { color: var(--muted); font-size: .66rem; }
.sync-note i { display: inline-block; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: #2ac58a; }
.panel-heading button { height: 34px; padding: 0 11px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface-soft); font-size: .7rem; font-weight: 750; cursor: pointer; }
.panel-heading button b { margin-left: 7px; }
.panel-link { height: 34px; padding: 0 11px; display: inline-flex; align-items: center; border: 1px solid var(--border); border-radius: 9px; color: var(--text); background: var(--surface-soft); font-size: .7rem; font-weight: 750; text-decoration: none; }.panel-link b { margin-left: 7px; }
.week-strip { display: grid; grid-template-columns: repeat(7, minmax(72px, 1fr)); padding: 17px; gap: 7px; overflow-x: auto; }
.day-cell { min-height: 147px; display: flex; flex-direction: column; align-items: center; padding: 13px 8px 10px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-soft); }
.day-cell > span { color: var(--faint); font-size: .6rem; font-weight: 800; }
.day-cell > b { margin-top: 4px; font-size: 1rem; }
.day-cell > small { color: var(--muted); margin-top: 8px; font-size: .61rem; line-height: 1.3; text-align: center; white-space: normal; overflow-wrap: anywhere; }
.day-cell.today { border-color: #8eaff5; background: var(--primary-soft); box-shadow: inset 0 0 0 1px rgba(47,111,235,.2); }
.shift { width: 42px; height: 42px; margin-top: 12px; display: grid; place-items: center; border-radius: 12px; font-style: normal; font-size: .73rem; font-weight: 850; }
.training { color: #6350c4; background: #eeeaff; }
.free { color: #667085; background: #e9edf3; }
.morning { color: #fff; background: #3472ec; box-shadow: 0 7px 15px rgba(52,114,236,.23); }
.shift.afternoon { color: #8b5215; background: #fff0df; }.shift.night, .shift.training { color: #6746c3; background: #eee9ff; }.shift.free, .shift.rest, .shift.empty { color: #667085; background: #e9edf3; }.shift.vacation, .shift.holiday, .shift.compensation { color: #137953; background: #e5f8ef; }.shift.airground, .shift.middle, .shift.office, .shift.oncall { color: #176f85; background: #e3f6f9; }.shift.leave { color: #a63b46; background: #fff0f1; }
:root[data-theme="dark"] .training { background: #332a59; color: #c0b4ff; }
:root[data-theme="dark"] .free { background: #2a3749; color: #c1cad8; }
:root[data-theme="dark"] .shift.afternoon { color: #f1b579; background: #49311d; }:root[data-theme="dark"] .shift.night, :root[data-theme="dark"] .shift.training { color: #c4afff; background: #302654; }:root[data-theme="dark"] .shift.free, :root[data-theme="dark"] .shift.rest, :root[data-theme="dark"] .shift.empty { color: #b5c0d0; background: #293547; }:root[data-theme="dark"] .shift.vacation, :root[data-theme="dark"] .shift.holiday, :root[data-theme="dark"] .shift.compensation { color: #8ae1bb; background: #153c33; }:root[data-theme="dark"] .shift.airground, :root[data-theme="dark"] .shift.middle, :root[data-theme="dark"] .shift.office, :root[data-theme="dark"] .shift.oncall { color: #8ed5e7; background: #173b45; }:root[data-theme="dark"] .shift.leave { color: #ff9ba5; background: #472229; }
.legend { min-height: 48px; padding: 12px 22px; display: flex; flex-wrap: wrap; align-items: center; gap: 17px; border-top: 1px solid var(--border); color: var(--muted); font-size: .62rem; }
.legend span { display: flex; align-items: center; gap: 5px; }
.legend i { width: 7px; height: 7px; border-radius: 50%; }
.legend b { color: var(--text); }
.legend-info-button { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 11px; color: var(--primary); background: var(--surface); font-size: 1.12rem; cursor: pointer; transition: border-color .18s ease, background .18s ease, transform .18s ease; }
.legend-info-button:hover { border-color: var(--primary); background: var(--primary-soft); transform: translateY(-1px); }
.shift-legend-dialog { width: min(100%, 520px); }
.shift-legend-grid { margin-top: 20px; padding: 16px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 14px; border: 1px solid var(--border); border-radius: 13px; background: var(--surface-soft); }
.shift-legend-grid span { min-height: 30px; display: flex; align-items: center; gap: 9px; color: var(--muted); font-size: .69rem; font-weight: 700; }
.shift-legend-grid i { flex: 0 0 11px; width: 11px; height: 11px; border-radius: 50%; }
.morning-dot { background: #3472ec; }.training-dot { background: #8c70ed; }.free-dot { background: #a1aab8; }.holiday-dot { background: #ee9a3c; }.oncall-dot { background: #2b91a7; }

.schedule-legend i.oncall { background: #2b91a7; }
.dots { border: 0 !important; background: transparent !important; color: var(--faint); letter-spacing: 2px; }
.activity-list { padding: 5px 21px 12px; }
.activity-item { display: grid; grid-template-columns: 35px 1fr; gap: 12px; padding: 16px 0; border-bottom: 1px solid var(--border); }
.activity-item:last-child { border-bottom: 0; }
.activity-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; font-weight: 800; }
.approved { color: #168f65; background: #e6f8f0; }.published { color: #326ee5; background: #e9f0ff; }.compensation { color: #d68122; background: #fff2dd; }
:root[data-theme="dark"] .approved { background: #133d34; }:root[data-theme="dark"] .published { background: #19305b; }:root[data-theme="dark"] .compensation { background: #493317; }
.activity-item strong { display: block; font-size: .72rem; }
.activity-item p { margin: 5px 0; color: var(--muted); font-size: .67rem; line-height: 1.4; }
.activity-item small { color: var(--faint); font-size: .55rem; font-weight: 750; letter-spacing: .05em; }
.next-shift-card { min-height: 91px; margin-top: 17px; padding: 15px 20px; display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 18px; border: 1px solid var(--border); border-radius: 17px; background: linear-gradient(115deg, var(--surface), var(--surface-soft)); box-shadow: var(--shadow); }
.date-tile { width: 54px; height: 58px; display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 11px; color: #fff; background: #173661; }
.date-tile span { font-size: .55rem; font-weight: 800; }.date-tile b { margin-top: 2px; font-size: 1.35rem; }
.next-shift-copy > span { color: var(--faint); font-size: .58rem; font-weight: 800; letter-spacing: .1em; }
.next-shift-mainline { margin-top: 5px; display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 18px; }
.next-shift-copy h3 { margin: 0; font-size: .89rem; }.next-shift-copy p { margin: 0; color: var(--muted); font-size: .67rem; }
.next-shift-meta { display: flex; align-items: baseline; gap: 8px; text-align: right; white-space: nowrap; }.next-shift-meta span { color: var(--muted); font-size: .64rem; }.next-shift-meta strong { font-size: .82rem; }
.next-shift-card > button { height: 36px; padding: 0 12px; border: 1px solid var(--border); background: var(--surface); border-radius: 9px; font-size: .7rem; font-weight: 700; cursor: pointer; }.next-shift-card button span { margin-left: 8px; }
.next-shift-link { height: 36px; padding: 0 12px; display: inline-flex; align-items: center; border: 1px solid var(--border); border-radius: 9px; color: var(--text); background: var(--surface); font-size: .7rem; font-weight: 700; text-decoration: none; }.next-shift-link span { margin-left: 8px; }
.mobile-nav { display: none; }

.auth-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(340px, .9fr) minmax(520px, 1.35fr); background: var(--bg); }
.auth-brand-panel { position: relative; min-height: 100vh; padding: 42px 54px; display: flex; flex-direction: column; overflow: hidden; color: #fff; background: radial-gradient(circle at 18% 18%, rgba(83,139,255,.34), transparent 34%), linear-gradient(145deg, #07162d 0%, #0e2a52 62%, #14376a 100%); }
.auth-brand-panel::after { content: ""; position: absolute; width: 430px; height: 430px; right: -210px; bottom: -170px; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; box-shadow: 0 0 0 70px rgba(255,255,255,.025), 0 0 0 140px rgba(255,255,255,.018); }
.auth-brand { position: relative; z-index: 1; display: flex; align-items: center; gap: 13px; width: fit-content; }
.auth-brand > span:last-child { display: flex; flex-direction: column; }
.auth-brand strong { font-size: 1.3rem; letter-spacing: -.035em; }
.auth-brand small { margin-top: 2px; color: #9fb2d0; font-size: .7rem; }
.auth-message { position: relative; z-index: 1; margin: auto 0; max-width: 490px; }
.auth-message .page-kicker { color: #7fa6f9; }
.auth-message h1 { margin: 18px 0; font-size: clamp(2.8rem, 5vw, 5.1rem); line-height: .98; letter-spacing: -.065em; }
.auth-message p { max-width: 420px; margin: 0; color: #b2c1d7; font-size: .94rem; line-height: 1.7; }
.auth-version-note { position: relative; z-index: 1; color: #93a8c5; font-size: .66rem; font-weight: 650; letter-spacing: .025em; }
.auth-content { position: relative; min-height: 100vh; padding: 76px 8vw; display: grid; place-items: center; }
.auth-theme { position: absolute; top: 24px; right: 28px; }
.auth-card { width: min(100%, 430px); }
.auth-heading { margin-bottom: 27px; }
.auth-heading h1 { margin: 9px 0 8px; font-size: clamp(2rem, 4vw, 2.65rem); line-height: 1.08; letter-spacing: -.055em; }
.auth-heading p { margin: 0; color: var(--muted); font-size: .82rem; line-height: 1.55; }
.auth-form { display: flex; flex-direction: column; }
.auth-form .form-field { margin-bottom: 17px; }
.auth-form .form-field input { height: 50px; padding: 0 15px; border-radius: 12px; background: var(--surface); }
.auth-submit { height: 50px; margin-top: 4px; padding: 0 17px; display: flex; align-items: center; justify-content: space-between; border: 0; border-radius: 12px; color: #fff; background: linear-gradient(135deg, #3475f0, #245bc8); box-shadow: 0 12px 26px rgba(47,111,235,.24); font-size: .8rem; font-weight: 800; cursor: pointer; }
.auth-submit:hover { filter: brightness(1.06); transform: translateY(-1px); }
.auth-alert { margin: -8px 0 20px; padding: 12px 14px; border: 1px solid color-mix(in srgb, #dc5361 25%, transparent); border-radius: 10px; color: #a83a46; background: #fff0f2; font-size: .72rem; line-height: 1.45; }
:root[data-theme="dark"] .auth-alert { color: #ffabb3; background: #472229; }
.auth-alert.success { border-color: color-mix(in srgb, #18a875 25%, transparent); color: #117653; background: #eafaf4; }
:root[data-theme="dark"] .auth-alert.success { color: #8be6c3; background: #143d33; }
.auth-inline-link { align-self: flex-end; margin: -7px 0 13px; color: var(--primary); font-size: .68rem; font-weight: 750; }
.auth-divider { margin: 24px 0 17px; display: flex; align-items: center; gap: 12px; color: var(--faint); font-size: .62rem; text-transform: uppercase; letter-spacing: .1em; }
.auth-divider::before, .auth-divider::after { content: ""; height: 1px; flex: 1; background: var(--border); }
.auth-secondary { height: 47px; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); font-size: .76rem; font-weight: 750; }
.auth-secondary:hover { border-color: var(--primary); color: var(--primary); }
.auth-help { margin: 19px 0 0; color: var(--faint); text-align: center; font-size: .66rem; line-height: 1.5; }
.initial-setup-link { display: block; margin-top: 16px; color: var(--primary); text-align: center; font-size: .7rem; font-weight: 750; }
.password-hint { margin: -4px 0 17px; color: var(--muted); font-size: .66rem; }
.setup-card { width: min(100%, 570px); }.setup-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }.auth-form .form-field select { width: 100%; height: 50px; padding: 0 15px; border: 1px solid var(--border); border-radius: 12px; outline: 0; color: var(--text); background: var(--surface); }
.auth-back { display: inline-block; margin-top: 23px; color: var(--muted); font-size: .72rem; font-weight: 700; }
.auth-back:hover { color: var(--primary); }
.route-loading { min-height: 100vh; display: grid; place-items: center; color: var(--muted); background: var(--bg); font-size: .8rem; }
.mobile-auth-loading { min-height: 100vh; display: grid; place-items: center; color: #70819a; background: #f4f7fb; font-size: .8rem; }
.mobile-login-shell { min-height: 100vh; padding: max(46px, env(safe-area-inset-top)) 24px max(34px, env(safe-area-inset-bottom)); display: flex; flex-direction: column; color: #111d33; background: radial-gradient(circle at 85% 5%, rgba(76,133,244,.18), transparent 29%), linear-gradient(160deg, #07182f 0 31%, #f4f7fb 31%); }
.mobile-login-brand { display: flex; align-items: center; gap: 12px; color: #fff; }.mobile-login-brand > div { display: flex; flex-direction: column; }.mobile-login-brand strong { font-size: 1.35rem; }.mobile-login-brand small { margin-top: 2px; color: #9fb2d0; font-size: .68rem; }
.mobile-login-card { width: min(100%, 430px); margin: clamp(95px, 19vh, 180px) auto 0; padding: 30px 24px; border: 1px solid #dbe3ef; border-radius: 22px; background: #fff; box-shadow: 0 22px 55px rgba(11,31,61,.13); }.mobile-login-card h1 { margin: 8px 0 7px; font-size: 2rem; letter-spacing: -.045em; }.mobile-login-card > p { margin: 0 0 25px; color: #66758b; font-size: .75rem; line-height: 1.55; }
.mobile-login-card form label { margin-bottom: 15px; display: flex; flex-direction: column; gap: 7px; }.mobile-login-card form label > span { color: #79879c; font-size: .62rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }.mobile-login-card input { height: 49px; padding: 0 14px; border: 1px solid #d8e0ec; border-radius: 11px; outline: 0; color: #111d33; background: #f7f9fc; font-size: 16px; touch-action: manipulation; -webkit-user-select: text; user-select: text; }.mobile-login-card input:focus { border-color: #2f6feb; box-shadow: 0 0 0 3px rgba(47,111,235,.12); }.mobile-login-card form > button { width: 100%; height: 49px; margin-top: 7px; border: 0; border-radius: 11px; color: #fff; background: linear-gradient(135deg, #326fe9, #2458c7); font-size: .76rem; font-weight: 850; }.mobile-login-card form > button:disabled { opacity: .65; }.mobile-server-note { display: block; margin-top: 18px; color: #8a97a9; text-align: center; font-size: .59rem; line-height: 1.45; }
.mobile-recovery-toggle { width: 100%; margin-top: 14px; padding: 9px; border: 0; color: #2f6feb; background: transparent; font-size: .7rem; font-weight: 800; }
.mobile-recovery-panel { margin-top: 5px; padding: 14px; border: 1px solid #dbe3ef; border-radius: 12px; background: #f7f9fc; }
.mobile-recovery-panel p { margin: 0 0 11px; color: #66758b; font-size: .67rem; line-height: 1.45; }
.mobile-recovery-panel > button { width: 100%; min-height: 42px; border: 1px solid #c9d7ec; border-radius: 10px; color: #245bc8; background: #fff; font-size: .68rem; font-weight: 800; }
.mobile-recovery-panel .form-message { margin-top: 11px; font-size: .65rem; line-height: 1.4; }
.mobile-recovery-panel .form-message.success { color: #117653; }

.account-page, .section-page { max-width: 1120px; margin: 0 auto; }
.account-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.account-heading h1, .section-page h1 { margin: 8px 0 5px; font-size: clamp(1.8rem, 3vw, 2.35rem); letter-spacing: -.045em; }
.account-heading h1:focus, .section-page h1:focus { outline: none; }
.account-heading p, .section-page > p { margin: 0; color: var(--muted); font-size: .82rem; }
.role-pill { padding: 8px 12px; border: 1px solid color-mix(in srgb, var(--primary) 35%, var(--border)); border-radius: 99px; color: var(--primary); background: var(--primary-soft); font-size: .7rem; font-weight: 800; }
.account-grid { display: grid; grid-template-columns: minmax(250px, .72fr) minmax(0, 1.28fr); gap: 17px; align-items: start; }
.account-stack { display: grid; gap: 17px; }
.account-card { padding: 24px; }
.account-card h2 { margin: 8px 0 6px; font-size: 1.05rem; }
.account-card > p { margin: 0 0 20px; color: var(--muted); font-size: .75rem; line-height: 1.5; }
.identity-card { grid-row: span 2; }
.account-profile { display: flex; align-items: center; gap: 14px; padding-bottom: 22px; border-bottom: 1px solid var(--border); }
.account-profile h2 { margin: 0; }.account-profile p { margin: 5px 0 0; color: var(--muted); font-size: .73rem; }
.account-avatar { width: 54px; height: 54px; display: grid; place-items: center; border-radius: 16px; color: var(--primary); background: var(--primary-soft); font-weight: 850; }
.account-stack .identity-card { padding: 0; overflow: hidden; }
.account-profile-hero { padding: 23px 24px; display: flex; align-items: center; gap: 16px; border-bottom: 1px solid var(--border); background: linear-gradient(120deg, var(--surface), var(--surface-soft)); }
.account-profile-hero .account-avatar { flex: 0 0 62px; width: 62px; height: 62px; border-radius: 18px; font-size: 1.08rem; }
.account-profile-copy { min-width: 0; flex: 1; }.account-profile-copy h2 { margin: 6px 0 0; font-size: 1.2rem; }
.account-details-grid { padding: 18px 24px; display: grid; grid-template-columns: .55fr 1.25fr .8fr 1.25fr; gap: 12px; }
.account-detail { min-width: 0; min-height: 75px; padding: 14px 15px; display: flex; flex-direction: column; justify-content: center; border: 1px solid var(--border); border-radius: 11px; background: var(--surface-soft); }.account-detail span { color: var(--faint); font-size: .58rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }.account-detail strong { margin-top: 8px; overflow: hidden; font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }.account-detail .account-id { color: var(--primary); font-size: .88rem; letter-spacing: .08em; }
.account-profile-note { padding: 13px 24px 17px; color: var(--faint); border-top: 1px solid var(--border); font-size: .61rem; }
.readonly-field { display: flex; flex-direction: column; margin-top: 22px; padding: 16px; border-radius: 12px; background: var(--surface-soft); }
.readonly-field span, .form-field span { color: var(--faint); font-size: .62rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.readonly-field strong { margin-top: 7px; font-size: 1.15rem; letter-spacing: .08em; }
.readonly-field small { margin-top: 8px; color: var(--muted); font-size: .66rem; line-height: 1.45; }
.form-field { display: flex; flex-direction: column; gap: 8px; margin-bottom: 15px; }
.form-field input { width: 100%; height: 44px; padding: 0 13px; border: 1px solid var(--border); border-radius: 10px; outline: none; color: var(--text); background: var(--surface-soft); transition: border-color .16s, box-shadow .16s; }
.form-field input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 14%, transparent); }
.password-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.password-fields .form-field:first-child { grid-column: 1 / -1; }
.account-action { min-height: 40px; padding: 0 14px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 0; border-radius: 10px; color: #fff; background: var(--primary); font-size: .72rem; font-weight: 800; cursor: pointer; }
.personalization-card { grid-column: 1 / -1; padding: 0; overflow: hidden; }
.personalization-heading { padding: 23px 24px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--border); }
.personalization-heading h2 { margin: 8px 0 5px; }.personalization-heading p { margin: 0; color: var(--muted); font-size: .72rem; }
.personalization-icon { flex: 0 0 44px; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 13px; color: var(--primary); background: var(--primary-soft); font-size: 1.2rem; font-weight: 850; }
.personalization-options { padding: 18px 24px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.preference-row { min-height: 82px; padding: 15px 16px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-soft); }
.preference-row > div:first-child { min-width: 0; display: flex; flex-direction: column; }.preference-row strong { font-size: .72rem; }.preference-row small { margin-top: 5px; color: var(--muted); font-size: .61rem; line-height: 1.4; }
.preference-switch { flex: 0 0 auto; padding: 3px; display: grid; grid-template-columns: repeat(2, minmax(62px, 1fr)); gap: 3px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); }
.preference-switch.three { grid-template-columns: repeat(3, minmax(66px, 1fr)); }.preference-switch button { min-height: 31px; padding: 0 10px; border: 0; border-radius: 7px; color: var(--muted); background: transparent; font-size: .63rem; font-weight: 800; cursor: pointer; }.preference-switch button.active { color: #fff; background: var(--primary); box-shadow: 0 4px 10px color-mix(in srgb, var(--primary) 24%, transparent); }
.personalization-footer { padding: 17px 24px 21px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-top: 1px solid var(--border); }.personalization-footer small { color: var(--faint); font-size: .62rem; }.personalization-footer .account-action:disabled { opacity: .65; cursor: wait; }
.personalization-card > .form-message { margin: 0 24px 20px; }.preferences-loading { padding: 28px 24px; color: var(--muted); font-size: .72rem; }
.account-stack .password-card { padding: 0; overflow: hidden; }.security-card-heading { padding: 23px 24px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--border); }.security-card-heading h2 { margin: 8px 0 5px; }.security-card-heading p { margin: 0; color: var(--muted); font-size: .72rem; }.security-card-icon { flex: 0 0 44px; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 13px; color: var(--primary); background: var(--primary-soft); font-size: 1.2rem; font-weight: 850; }.security-card-body { padding: 20px 24px 23px; }.security-card-body .form-message { margin-bottom: 0; }
.form-message { margin-top: 13px; padding: 10px 12px; border-radius: 9px; color: #276547; background: #e7f8ef; font-size: .68rem; }
.form-message.error { color: #a63b46; background: #fff0f1; }.form-message.success { color: #276547; background: #e7f8ef; }
:root[data-theme="dark"] .form-message, :root[data-theme="dark"] .form-message.success { color: #8be0bb; background: #123b30; }
:root[data-theme="dark"] .form-message.error { color: #ff9ba5; background: #472229; }
.section-card { margin-top: 24px; padding: 30px; }
.section-card h2 { margin: 0 0 8px; font-size: 1.05rem; }.section-card p { margin: 0; color: var(--muted); font-size: .76rem; line-height: 1.55; }

.support-page { max-width: 1120px; margin: 0 auto; }
.support-heading { margin-bottom: 24px; display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }.support-heading h1 { margin: 8px 0 5px; font-size: clamp(1.8rem, 3vw, 2.35rem); letter-spacing: -.045em; }.support-heading p { margin: 0; color: var(--muted); font-size: .82rem; }.support-status { padding: 8px 12px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid color-mix(in srgb, #24b47e 28%, var(--border)); border-radius: 99px; color: #19835e; background: color-mix(in srgb, #24b47e 9%, var(--surface)); font-size: .67rem; font-weight: 800; }.support-status i { width: 7px; height: 7px; border-radius: 50%; background: #2ac58c; box-shadow: 0 0 0 4px color-mix(in srgb, #2ac58c 14%, transparent); }
.support-layout { display: grid; grid-template-columns: minmax(230px, .62fr) minmax(0, 1.38fr); gap: 17px; align-items: start; }.support-info { display: grid; gap: 12px; }.support-intro-card { padding: 24px; }.support-card-icon { width: 46px; height: 46px; margin-bottom: 20px; display: grid; place-items: center; border-radius: 13px; color: var(--primary); background: var(--primary-soft); font-size: 1.1rem; font-weight: 900; }.support-intro-card h2 { margin: 9px 0 8px; font-size: 1.05rem; }.support-intro-card p { margin: 0; color: var(--muted); font-size: .72rem; line-height: 1.55; }.support-tip { padding: 16px; display: flex; align-items: flex-start; gap: 12px; }.support-tip > span { flex: 0 0 29px; width: 29px; height: 29px; display: grid; place-items: center; border-radius: 9px; color: var(--primary); background: var(--primary-soft); font-size: .7rem; font-weight: 850; }.support-tip > div { display: flex; flex-direction: column; }.support-tip strong { font-size: .7rem; }.support-tip small { margin-top: 5px; color: var(--muted); font-size: .62rem; line-height: 1.5; }
.support-form-card { overflow: hidden; }.support-form-card > header { padding: 22px 24px; display: flex; align-items: center; justify-content: space-between; gap: 15px; border-bottom: 1px solid var(--border); }.support-form-card h2 { margin: 7px 0 0; font-size: 1.08rem; }.support-user { padding: 7px 10px; border-radius: 8px; color: var(--muted); background: var(--surface-soft); font-size: .63rem; font-weight: 750; }.support-form-grid { padding: 22px 24px 3px; display: grid; grid-template-columns: .75fr 1.25fr; gap: 0 14px; }.support-form-grid select, .support-form-grid textarea { width: 100%; border: 1px solid var(--border); border-radius: 10px; outline: none; color: var(--text); background: var(--surface-soft); font: inherit; font-size: .72rem; }.support-form-grid select { height: 44px; padding: 0 35px 0 12px; }.support-form-grid textarea { min-height: 150px; padding: 12px; resize: vertical; line-height: 1.5; }.support-form-grid select:focus, .support-form-grid textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 14%, transparent); }.support-message-field { grid-column: 1 / -1; margin-top: 2px; }.support-message-field small { align-self: flex-end; color: var(--faint); font-size: .57rem; }.support-form-card > .form-message { margin: 0 24px 18px; }.support-form-card > footer { padding: 18px 24px 22px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-top: 1px solid var(--border); }.support-form-card > footer > small { max-width: 390px; color: var(--faint); font-size: .61rem; line-height: 1.45; }.support-form-card button:disabled { opacity: .55; cursor: not-allowed; }

.import-page { max-width: 920px; }
.import-card { margin-top: 24px; padding: 27px; }
.import-card-copy { display: flex; align-items: center; gap: 15px; }
.import-symbol { flex: 0 0 46px; width: 46px; height: 46px; display: grid; place-items: center; border-radius: 13px; color: var(--primary); background: var(--primary-soft); font-size: 1.3rem; font-weight: 850; }
.import-card-copy h2 { margin: 0 0 6px; font-size: 1.05rem; }
.import-card-copy p { margin: 0; color: var(--muted); font-size: .74rem; line-height: 1.55; }
.file-picker { position: relative; min-height: 145px; margin-top: 24px; padding: 24px; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1.5px dashed color-mix(in srgb, var(--primary) 40%, var(--border)); border-radius: 15px; background: color-mix(in srgb, var(--primary-soft) 32%, var(--surface)); cursor: pointer; transition: .18s ease; }
.file-picker:hover, .file-picker.has-file { border-color: var(--primary); background: color-mix(in srgb, var(--primary-soft) 58%, var(--surface)); }
.file-picker input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.file-picker-icon { margin-bottom: 10px; color: var(--primary); font-size: 1.6rem; }
.file-picker strong { font-size: .8rem; }.file-picker small { margin-top: 6px; color: var(--muted); font-size: .65rem; }
.import-notes { margin-top: 22px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.import-notes > div { min-width: 0; padding: 14px; display: flex; align-items: flex-start; gap: 10px; border-radius: 11px; background: var(--surface-soft); }
.import-notes > div > span { flex: 0 0 24px; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; color: var(--primary); background: var(--primary-soft); font-size: .62rem; font-weight: 850; }
.import-notes p { margin: 0; display: flex; flex-direction: column; }.import-notes strong { font-size: .68rem; }.import-notes small { margin-top: 5px; color: var(--muted); font-size: .6rem; line-height: 1.45; }
.import-actions { margin-top: 24px; display: flex; justify-content: flex-end; gap: 10px; }.import-cancel { display: grid; place-items: center; }
.import-result { margin-top: 17px; padding: 24px; }.import-result.success { border-color: color-mix(in srgb, #27a575 35%, var(--border)); }.import-result.failed { border-color: color-mix(in srgb, #dc5361 35%, var(--border)); }
.result-heading { display: flex; align-items: center; gap: 13px; }.result-heading > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; color: #168f65; background: #e6f8f0; font-weight: 900; }.failed .result-heading > span { color: #a63b46; background: #fff0f1; }
.result-heading h2 { margin: 0 0 4px; font-size: 1rem; }.result-heading p { margin: 0; color: var(--muted); font-size: .7rem; }
.result-grid { margin-top: 20px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }.result-grid div { padding: 14px; display: flex; flex-direction: column; border-radius: 11px; background: var(--surface-soft); }.result-grid strong { font-size: 1.25rem; }.result-grid span { margin-top: 5px; color: var(--muted); font-size: .6rem; }
.import-warnings { margin: 17px 0 0; padding-left: 18px; color: #a9581a; font-size: .68rem; }.result-link { width: 210px; margin-top: 20px; }
:root[data-theme="dark"] .result-heading > span { color: #8ae1bb; background: #153c33; }:root[data-theme="dark"] .failed .result-heading > span { color: #ff9ba5; background: #472229; }

.schedule-page { max-width: 1040px; }
.schedule-summary-grid { margin-top: 20px; display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; }
.schedule-summary-grid div { padding: 14px; display: flex; flex-direction: column; border-radius: 11px; background: var(--surface-soft); }
.schedule-summary-grid strong { font-size: 1.2rem; }.schedule-summary-grid span { margin-top: 5px; color: var(--muted); font-size: .6rem; }
.schedule-summary-grid .added strong { color: #168f65; }.schedule-summary-grid .modified strong { color: #a66a13; }.schedule-summary-grid .removed strong { color: #b84654; }
.schedule-publish-box { margin-top: 20px; padding: 17px; border: 1px solid var(--border); border-radius: 13px; background: var(--surface-soft); }
.schedule-publish-box > label { display: block; margin-bottom: 8px; color: var(--faint); font-size: .62rem; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.schedule-publish-box textarea { width: 100%; min-height: 76px; padding: 12px; resize: vertical; border: 1px solid var(--border); border-radius: 10px; outline: 0; color: var(--text); background: var(--surface); font: inherit; font-size: .72rem; }
.schedule-publish-box textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 14%, transparent); }
.schedule-publish-box > div { margin-top: 12px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.schedule-publish-box small { color: var(--muted); font-size: .63rem; line-height: 1.45; }
.version-panel { margin-top: 18px; overflow: hidden; }
.version-heading { min-height: 80px; padding: 18px 22px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--border); }
.version-heading h2 { margin: 6px 0 0; font-size: 1.02rem; }.published-badge { padding: 7px 10px; border-radius: 99px; color: #168f65; background: #e6f8f0; font-size: .62rem; font-weight: 800; }
.version-heading-actions { display: flex; align-items: center; justify-content: flex-end; gap: 11px; }
.schedule-year-picker { display: flex; align-items: center; gap: 8px; }.schedule-year-picker span { color: var(--faint); font-size: .58rem; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }.schedule-year-picker select { min-width: 92px; height: 35px; padding: 0 30px 0 11px; border: 1px solid var(--border); border-radius: 9px; outline: 0; color: var(--text); background: var(--surface); font-size: .67rem; font-weight: 800; cursor: pointer; }.schedule-year-picker select:focus { border-color: var(--primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 14%, transparent); }.schedule-year-picker select:disabled { opacity: .6; cursor: wait; }
:root[data-theme="dark"] .published-badge { color: #8ae1bb; background: #153c33; }
.version-row { min-height: 108px; padding: 17px 22px; display: grid; grid-template-columns: 60px minmax(0, 1fr) auto; align-items: center; gap: 16px; border-top: 1px solid var(--border); }
.version-row:first-of-type { border-top: 0; }.version-row.draft { background: color-mix(in srgb, var(--primary-soft) 35%, var(--surface)); }
.version-number { width: 54px; height: 54px; display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 13px; color: var(--primary); background: var(--primary-soft); }
.version-number strong { font-size: .84rem; }.version-number span { margin-top: 3px; font-size: .56rem; }
.version-copy { min-width: 0; display: flex; flex-direction: column; gap: 5px; }.version-copy > div { display: flex; align-items: center; gap: 9px; }.version-copy > div strong { font-size: .75rem; }.version-copy > div span { overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; font-size: .66rem; }
.version-copy small { color: var(--faint); font-size: .59rem; }.version-copy p { margin: 3px 0 0; color: var(--muted); font-size: .65rem; }
.version-actions { display: flex; flex-direction: column; align-items: flex-end; gap: 7px; }.version-actions button, .version-actions a { min-height: 34px; padding: 0 11px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; border: 1px solid var(--border); border-radius: 9px; color: var(--primary); background: var(--surface); font-size: .62rem; font-weight: 800; text-decoration: none; cursor: pointer; }.version-actions button:hover:not(:disabled), .version-actions a:hover { border-color: var(--primary); background: var(--primary-soft); }.version-actions button:disabled { opacity: .55; cursor: not-allowed; }.version-actions small { color: var(--faint); font-size: .56rem; }
.version-empty { padding: 45px 22px; color: var(--muted); text-align: center; font-size: .72rem; }
.change-summary-dialog { position: relative; width: min(100%, 780px); max-height: min(82vh, 760px); padding: 28px; overflow: hidden; display: flex; flex-direction: column; border: 1px solid var(--border); border-radius: 20px; background: var(--surface); box-shadow: 0 28px 80px rgba(0,0,0,.28); }
.change-summary-dialog h2 { margin: 7px 0 7px; font-size: 1.4rem; letter-spacing: -.035em; }.change-summary-dialog > p { margin: 0 0 18px; color: var(--muted); font-size: .72rem; }
.change-summary-state { margin-top: 18px; padding: 34px 18px; border-radius: 12px; color: var(--muted); background: var(--surface-soft); text-align: center; font-size: .72rem; }
.change-summary-table { min-height: 0; overflow: auto; border: 1px solid var(--border); border-radius: 12px; }
.change-summary-header, .change-summary-row { display: grid; grid-template-columns: minmax(180px, 1.5fr) 110px minmax(190px, 1fr); align-items: center; gap: 14px; padding: 12px 15px; }
.change-summary-header { position: sticky; top: 0; z-index: 1; color: var(--faint); background: var(--surface-soft); font-size: .57rem; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.change-summary-row { min-height: 58px; border-top: 1px solid var(--border); color: var(--muted); font-size: .67rem; }.change-summary-row:first-of-type { border-top: 0; }
.change-person { min-width: 0; display: flex; flex-direction: column; }.change-person strong { overflow: hidden; color: var(--text); text-overflow: ellipsis; white-space: nowrap; font-size: .7rem; }.change-person small { margin-top: 4px; color: var(--faint); font-size: .57rem; }
.change-codes { display: flex; align-items: center; gap: 9px; }.change-codes b { min-width: 46px; padding: 6px 8px; border-radius: 8px; color: var(--primary); background: var(--primary-soft); text-align: center; font-size: .67rem; }.change-codes i { color: var(--faint); font-style: normal; }
.personal-changes-page { max-width: 1120px; margin: 0 auto; }.personal-change-summary-panel { overflow: hidden; }.personal-change-summary-panel > header { padding: 22px 25px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--border); }.personal-change-summary-panel > header h2 { margin: 5px 0 0; font-size: 1.15rem; }.personal-change-summary-panel > header time { color: var(--faint); font-size: .62rem; font-weight: 750; }.personal-change-table { margin: 22px 25px 25px; }.personal-change-table .change-summary-header, .personal-change-table .change-summary-row { grid-template-columns: minmax(120px, .55fr) minmax(220px, 1.45fr); }.personal-change-table .change-summary-row { font-size: .72rem; }

.my-schedule-page { max-width: 1420px; margin: 0 auto; }
.schedule-page-heading { margin-bottom: 20px; display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.schedule-page-heading h1 { margin: 8px 0 5px; font-size: clamp(1.8rem, 3vw, 2.35rem); letter-spacing: -.045em; }
.schedule-page-heading p { margin: 0; color: var(--muted); font-size: .74rem; }
.schedule-view-switch { padding: 4px; display: flex; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); }
.schedule-view-switch button { min-width: 76px; height: 35px; padding: 0 12px; border: 0; border-radius: 8px; color: var(--muted); background: transparent; font-size: .66rem; font-weight: 800; cursor: pointer; }
.schedule-view-switch button.active { color: #fff; background: var(--primary); box-shadow: 0 5px 12px color-mix(in srgb, var(--primary) 24%, transparent); }
.schedule-loading { padding: 70px 24px; color: var(--muted); text-align: center; font-size: .76rem; }.schedule-loading.error { color: #b84654; }
.personal-schedule-empty { padding: 70px 24px; text-align: center; }.personal-schedule-empty > span { width: 54px; height: 54px; margin: 0 auto 16px; display: grid; place-items: center; border-radius: 15px; color: var(--primary); background: var(--primary-soft); font-size: 1.45rem; }.personal-schedule-empty h2 { margin: 0 0 8px; font-size: 1.05rem; }.personal-schedule-empty p { margin: 0; color: var(--muted); font-size: .72rem; }
.personal-calendar-panel { overflow: hidden; }
.calendar-toolbar { min-height: 78px; padding: 16px 20px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--border); }
.calendar-toolbar > div { display: flex; align-items: center; gap: 12px; }.calendar-toolbar h2 { min-width: 250px; margin: 0; text-align: center; font-size: 1.02rem; text-transform: capitalize; }.calendar-toolbar button { width: 34px; height: 34px; border: 1px solid var(--border); border-radius: 9px; color: var(--text); background: var(--surface); font-size: 1.15rem; cursor: pointer; }.calendar-toolbar button:hover { color: var(--primary); border-color: var(--primary); }.calendar-toolbar select { height: 37px; padding: 0 30px 0 11px; border: 1px solid var(--border); border-radius: 9px; color: var(--text); background: var(--surface-soft); font-size: .68rem; font-weight: 800; }
.calendar-weekdays { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border-bottom: 1px solid var(--border); background: var(--surface-soft); }.calendar-weekdays span { padding: 10px; color: var(--faint); text-align: center; font-size: .56rem; font-weight: 850; letter-spacing: .08em; }
.personal-calendar { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.calendar-day { min-width: 0; min-height: 130px; padding: 11px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); background: var(--surface); }.calendar-day:nth-child(7n) { border-right: 0; }.month-view .calendar-day:nth-last-child(-n+7), .week-view .calendar-day { border-bottom: 0; }.calendar-day.outside-month { background: color-mix(in srgb, var(--surface-soft) 68%, var(--surface)); opacity: .52; }.calendar-day.today { box-shadow: inset 0 0 0 2px var(--primary); }.calendar-day > header { display: flex; align-items: center; justify-content: space-between; }.calendar-day > header span { display: none; color: var(--faint); font-size: .54rem; font-weight: 800; }.calendar-day > header strong { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 8px; font-size: .68rem; }.calendar-day.today > header strong { color: #fff; background: var(--primary); }
.calendar-assignment { margin-top: 9px; padding: 9px; display: flex; flex-direction: column; border-radius: 10px; color: #315fbd; background: #e9f0ff; }.calendar-assignment b { font-size: .75rem; }.calendar-assignment span { margin-top: 4px; overflow: hidden; font-size: .57rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }.calendar-assignment small { margin-top: 4px; font-size: .54rem; opacity: .78; }
.calendar-assignment.afternoon { color: #8b5215; background: #fff0df; }.calendar-assignment.night { color: #6143a2; background: #eee9ff; }.calendar-assignment.free, .calendar-assignment.rest { color: #667387; background: #edf0f4; }.calendar-assignment.vacation { color: #137953; background: #e5f8ef; }.calendar-assignment.training { color: #6746c3; background: #eee9ff; }.calendar-assignment.holiday, .calendar-assignment.compensation { color: #a65e17; background: #fff1dc; }.calendar-assignment.leave { color: #a63b46; background: #fff0f1; }.calendar-assignment.airground, .calendar-assignment.middle, .calendar-assignment.office, .calendar-assignment.oncall { color: #176f85; background: #e3f6f9; }
:root[data-theme="dark"] .calendar-assignment { color: #9abaff; background: #1b3159; }:root[data-theme="dark"] .calendar-assignment.afternoon, :root[data-theme="dark"] .calendar-assignment.holiday, :root[data-theme="dark"] .calendar-assignment.compensation { color: #f1b579; background: #49311d; }:root[data-theme="dark"] .calendar-assignment.night, :root[data-theme="dark"] .calendar-assignment.training { color: #c4afff; background: #302654; }:root[data-theme="dark"] .calendar-assignment.free, :root[data-theme="dark"] .calendar-assignment.rest { color: #b5c0d0; background: #293547; }:root[data-theme="dark"] .calendar-assignment.vacation { color: #8ae1bb; background: #153c33; }:root[data-theme="dark"] .calendar-assignment.leave { color: #ff9ba5; background: #472229; }:root[data-theme="dark"] .calendar-assignment.airground, :root[data-theme="dark"] .calendar-assignment.middle, :root[data-theme="dark"] .calendar-assignment.office, :root[data-theme="dark"] .calendar-assignment.oncall { color: #8ed5e7; background: #173b45; }
.no-assignment { display: block; margin-top: 16px; color: var(--faint); font-size: .55rem; }
.week-view .calendar-day { min-height: 230px; }.week-view .calendar-day > header { align-items: flex-start; flex-direction: column; gap: 6px; }.week-view .calendar-day > header span { display: block; }.week-view .calendar-assignment { margin-top: 25px; padding: 13px 10px; }.week-view .calendar-assignment b { font-size: 1rem; }.week-view .calendar-assignment span { white-space: normal; line-height: 1.4; }
.annual-schedule-grid { padding: 18px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }.annual-month { min-height: 140px; padding: 17px; display: flex; align-items: flex-start; flex-direction: column; border: 1px solid var(--border); border-radius: 13px; color: var(--text); background: var(--surface-soft); text-align: left; cursor: pointer; }.annual-month:hover { border-color: var(--primary); background: var(--primary-soft); }.annual-month > span { color: var(--faint); font-size: .63rem; font-weight: 850; text-transform: uppercase; letter-spacing: .08em; }.annual-month strong { margin-top: 12px; font-size: 1.55rem; }.annual-month small { margin-top: 3px; color: var(--muted); font-size: .61rem; }.annual-month i { margin-top: auto; color: var(--primary); font-size: .58rem; font-style: normal; font-weight: 750; }
.schedule-legend { margin-top: 14px; padding: 14px 18px; display: flex; flex-wrap: wrap; gap: 16px; }.schedule-legend span { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: .61rem; }.schedule-legend i { width: 8px; height: 8px; border-radius: 50%; background: #4e7fe9; }.schedule-legend i.afternoon { background: #dc9139; }.schedule-legend i.night { background: #8b69dc; }.schedule-legend i.free { background: #9ca6b5; }.schedule-legend i.vacation { background: #31af7c; }.schedule-legend i.training { background: #8062d6; }

.personnel-page { max-width: 1420px; margin: 0 auto; }
.personnel-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.personnel-heading h1 { margin: 8px 0 5px; font-size: clamp(1.8rem, 3vw, 2.35rem); letter-spacing: -.045em; }
.personnel-heading p { margin: 0; color: var(--muted); font-size: .82rem; }
.personnel-import { display: inline-flex; align-items: center; justify-content: center; }
.personnel-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 17px; }
.personnel-summary article { min-height: 105px; padding: 19px; display: flex; flex-direction: column; border: 1px solid var(--border); border-radius: 15px; background: var(--surface); box-shadow: var(--shadow); }
.personnel-summary span { color: var(--faint); font-size: .59rem; font-weight: 850; letter-spacing: .11em; }
.personnel-summary strong { margin-top: 7px; font-size: 1.65rem; letter-spacing: -.04em; }
.personnel-summary small { margin-top: auto; color: var(--muted); font-size: .65rem; }
.personnel-panel { min-height: 370px; }
.personnel-toolbar { min-height: 82px; padding: 18px 22px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--border); }
.personnel-toolbar h2 { margin: 7px 0 0; font-size: 1rem; }
.personnel-search { width: min(340px, 42%); height: 42px; padding: 0 13px; display: flex; align-items: center; gap: 9px; border: 1px solid var(--border); border-radius: 11px; background: var(--surface-soft); }
.personnel-search span { color: var(--faint); font-size: 1.05rem; }
.personnel-search input { width: 100%; border: 0; outline: 0; color: var(--text); background: transparent; font-size: .72rem; }
.personnel-table-wrap { overflow-x: auto; }
.personnel-table { width: 100%; border-collapse: collapse; }
.personnel-table th { padding: 13px 16px; color: var(--faint); background: var(--surface-soft); text-align: left; font-size: .56rem; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; white-space: nowrap; }
.personnel-table td { padding: 14px 16px; border-top: 1px solid var(--border); vertical-align: middle; font-size: .7rem; }
.person-cell { min-width: 205px; display: flex; align-items: center; gap: 11px; }
.person-avatar { flex: 0 0 38px; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; color: var(--primary); background: var(--primary-soft); font-size: .68rem; font-weight: 850; }
.person-cell div { display: flex; flex-direction: column; }.person-cell strong { font-size: .75rem; }.person-cell small { margin-top: 4px; color: var(--muted); font-size: .6rem; }
.function-code { display: block; white-space: nowrap; font-size: .72rem; }.cell-note { display: block; margin-top: 5px; color: var(--muted); white-space: nowrap; font-size: .59rem; }
.status-pill { display: inline-flex; align-items: center; min-height: 25px; padding: 0 9px; border-radius: 99px; color: var(--muted); background: var(--surface-strong); font-size: .59rem; font-weight: 750; white-space: nowrap; }
.status-active { color: #137953; background: #e5f8ef; }.status-pending { color: #7b5b12; background: #fff4d8; }.status-ready { color: #315fbd; background: #e9f0ff; }.status-warning { color: #a9581a; background: #fff0df; }.status-disabled { color: #7b8492; background: #e9edf2; }
:root[data-theme="dark"] .status-active { color: #8ae1bb; background: #153c33; }:root[data-theme="dark"] .status-pending { color: #f0ca72; background: #443619; }:root[data-theme="dark"] .status-ready { color: #9abaff; background: #1b3159; }:root[data-theme="dark"] .status-warning { color: #f1b579; background: #49311d; }:root[data-theme="dark"] .status-disabled { color: #abb5c4; background: #293547; }
.email-cell { display: block; max-width: 220px; overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }
.person-actions { text-align: right; }.person-actions button { min-height: 33px; padding: 0 11px; border: 1px solid var(--border); border-radius: 9px; color: var(--primary); background: var(--surface); font-size: .62rem; font-weight: 800; white-space: nowrap; cursor: pointer; }.person-actions button:hover:not(:disabled) { border-color: var(--primary); background: var(--primary-soft); }.person-actions button:disabled { color: var(--faint); cursor: not-allowed; opacity: .65; }
.active-check { width: 29px; height: 29px; margin-left: auto; display: grid; place-items: center; border-radius: 50%; color: #168f65; background: #e6f8f0; font-weight: 900; }
.personnel-state { padding: 70px 24px; color: var(--muted); text-align: center; font-size: .76rem; }
.personnel-empty { max-width: 470px; margin: 0 auto; padding: 58px 24px 64px; text-align: center; }.personnel-empty .empty-symbol { width: 54px; height: 54px; margin: 0 auto 16px; display: grid; place-items: center; border-radius: 16px; color: var(--primary); background: var(--primary-soft); font-size: 1.5rem; }.personnel-empty h2 { margin: 0 0 9px; font-size: 1.08rem; }.personnel-empty p { margin: 0 0 22px; color: var(--muted); font-size: .74rem; line-height: 1.6; }.personnel-empty .auth-secondary { width: 210px; margin: 0 auto; }
.dialog-backdrop { position: fixed; inset: 0; z-index: 100; padding: 24px; display: grid; place-items: center; background: rgba(3, 11, 23, .62); backdrop-filter: blur(5px); }
.themed-select { width: 100%; }.themed-select-trigger { width: 100%; min-height: 44px; padding: 0 14px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border: 1px solid var(--border); border-radius: 11px; color: var(--text); background: var(--surface-soft); font: inherit; font-size: .72rem; font-weight: 700; text-align: left; cursor: pointer; }.themed-select-trigger i { display: grid; color: var(--muted); font-style: normal; }.themed-select-trigger:disabled { opacity: .6; cursor: default; }.themed-select-backdrop { z-index: 145; }.themed-select-dialog { width: min(100%, 430px); max-height: min(70vh, 520px); overflow-y: auto; padding: 8px; border: 1px solid var(--border); border-radius: 18px; color: var(--text); background: var(--surface); box-shadow: 0 28px 80px rgba(0,0,0,.38); }.themed-select-dialog button { width: 100%; min-height: 52px; padding: 0 15px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border: 0; border-radius: 11px; color: var(--text); background: transparent; font: inherit; font-size: .78rem; text-align: left; cursor: pointer; }.themed-select-dialog button + button { border-top: 1px solid var(--border); border-top-left-radius: 0; border-top-right-radius: 0; }.themed-select-dialog button.selected { color: var(--primary); background: var(--primary-soft); font-weight: 800; }.themed-select-dialog button i { display: grid; font-style: normal; }.lc-shift-picker .exchange-shift-option { width: 100%; color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.themed-select-dialog button { border-radius: 0; }.themed-select-dialog button:first-child { border-radius: 11px 11px 0 0; }.themed-select-dialog button:last-child { border-radius: 0 0 11px 11px; }.themed-select-dialog button:only-child { border-radius: 11px; }
.invite-dialog { position: relative; width: min(100%, 475px); padding: 30px; border: 1px solid var(--border); border-radius: 20px; background: var(--surface); box-shadow: 0 28px 80px rgba(0,0,0,.28); }
.dialog-close { position: absolute; top: 14px; right: 14px; width: 34px; height: 34px; display: grid; place-items: center; border: 0; border-radius: 9px; color: var(--muted); background: var(--surface-soft); font-size: 1.05rem; cursor: pointer; }
.dialog-symbol { width: 45px; height: 45px; margin-bottom: 19px; display: grid; place-items: center; border-radius: 13px; color: var(--primary); background: var(--primary-soft); font-size: 1.25rem; }.dialog-symbol.success { color: #168f65; background: #e6f8f0; }
.dialog-symbol.warning { color: #a96116; background: #fff0dc; font-weight: 900; }
.leadership-conflict-dialog { width: min(100%, 560px); }
.leadership-conflict-list { max-height: 310px; margin-top: 20px; overflow: auto; display: flex; flex-direction: column; gap: 9px; }
.leadership-conflict-list article { padding: 13px 14px; display: flex; flex-direction: column; border: 1px solid color-mix(in srgb, #d88a2c 38%, var(--border)); border-radius: 11px; background: color-mix(in srgb, #d88a2c 8%, var(--surface-soft)); }
.leadership-conflict-list time { color: #b36a17; font-size: .6rem; font-weight: 850; }
.leadership-conflict-list strong { margin-top: 5px; font-size: .75rem; }
.leadership-conflict-list small { margin-top: 5px; color: var(--muted); font-size: .61rem; }
.invite-dialog h2 { margin: 8px 0 9px; font-size: 1.45rem; letter-spacing: -.035em; }.invite-dialog > p { margin: 0; color: var(--muted); font-size: .74rem; line-height: 1.6; }
.invite-recipient { margin-top: 20px; padding: 14px; display: flex; flex-direction: column; border-radius: 11px; background: var(--surface-soft); }.invite-recipient span { color: var(--faint); font-size: .59rem; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }.invite-recipient strong { margin-top: 6px; font-size: .77rem; }
.dialog-actions { margin-top: 24px; display: flex; justify-content: flex-end; gap: 10px; }.secondary-button { min-height: 40px; padding: 0 14px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); font-size: .72rem; font-weight: 750; cursor: pointer; }
.activation-code { margin-top: 22px; padding: 12px 12px 12px 17px; display: flex; align-items: center; justify-content: space-between; border: 1px dashed color-mix(in srgb, var(--primary) 45%, var(--border)); border-radius: 12px; background: var(--primary-soft); }.activation-code span { color: var(--primary); font-size: 1.5rem; font-weight: 900; letter-spacing: .16em; }.activation-code button { height: 33px; padding: 0 11px; border: 0; border-radius: 8px; color: #fff; background: var(--primary); font-size: .63rem; font-weight: 800; cursor: pointer; }.dialog-expiry { display: block; margin-top: 11px; color: var(--faint); font-size: .62rem; }

.requests-page, .admin-requests-page { max-width: 1260px; margin: 0 auto; }
.requests-heading { margin-bottom: 23px; display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.requests-heading h1 { margin: 8px 0 5px; font-size: clamp(1.8rem, 3vw, 2.45rem); letter-spacing: -.05em; }
.requests-heading p { margin: 0; color: var(--muted); font-size: .82rem; }
.new-request-action { min-height: 52px; padding: 7px 20px 7px 8px; gap: 11px; border-radius: 15px; background: linear-gradient(135deg, #3d7af2 0%, #2860d6 100%); box-shadow: 0 12px 28px color-mix(in srgb, #2860d6 28%, transparent); transition: transform .18s ease, box-shadow .18s ease, filter .18s ease; }
.new-request-action:hover { transform: translateY(-2px); filter: brightness(1.05); box-shadow: 0 16px 34px color-mix(in srgb, #2860d6 34%, transparent); }
.new-request-action:active { transform: translateY(0); }
.new-request-action .new-request-icon { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: rgb(255 255 255 / 16%); color: #fff; font-size: 1.45rem; font-weight: 500; line-height: 1; }
.new-request-action > span:last-child { white-space: nowrap; font-size: .79rem; font-weight: 800; letter-spacing: -.01em; }
.new-request-action.open { background: var(--surface); color: var(--text); border: 1px solid var(--border); box-shadow: 0 8px 20px var(--shadow); }
.new-request-action.open .new-request-icon { background: color-mix(in srgb, var(--text) 8%, transparent); color: var(--text); }
.request-form-card { margin-bottom: 17px; padding: 24px; }
.request-form-heading { margin-bottom: 22px; display: flex; align-items: center; gap: 13px; }
.request-form-heading h2 { margin: 0 0 4px; font-size: 1.03rem; }.request-form-heading p { margin: 0; color: var(--muted); font-size: .7rem; }
.request-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.request-type-field, .request-wide { grid-column: 1 / -1; }
.request-form-grid .form-field { min-width: 0; display: flex; flex-direction: column; gap: 7px; }
.request-form-grid select, .request-form-grid input, .request-form-grid textarea, .admin-request-decision textarea, .management-response textarea { width: 100%; border: 1px solid var(--border); border-radius: 10px; outline: 0; color: var(--text); background: var(--surface-soft); font: inherit; font-size: .72rem; }
.request-form-grid select, .request-form-grid input { height: 43px; padding: 0 12px; }.request-form-grid textarea { min-height: 83px; padding: 12px; resize: vertical; }
.request-date-field { position: relative; }
.request-date-field input { position: relative; width: 100%; min-width: 0; max-width: 100%; padding-right: 43px; box-sizing: border-box; }
.request-date-field input::-webkit-calendar-picker-indicator { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0; opacity: 0; cursor: pointer; }
.request-date-icon { position: absolute; right: 13px; bottom: 12px; width: 19px; height: 19px; display: grid; place-items: center; color: var(--muted); font-size: 1rem; pointer-events: none; }
.request-form-grid select:focus, .request-form-grid input:focus, .request-form-grid textarea:focus, .admin-request-decision textarea:focus, .management-response textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 13%, transparent); }
.management-response textarea::placeholder { color: var(--faint); opacity: 1; }
.exchange-shift-picker { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 9px; max-height: 270px; overflow: auto; padding: 3px; }
.exchange-shift-option { display: flex; align-items: center; gap: 11px; min-width: 0; padding: 11px 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-soft); cursor: pointer; transition: border-color .15s, background .15s; }
.exchange-shift-option.selected { border-color: var(--primary); background: color-mix(in srgb, var(--primary) 12%, var(--surface)); }
.request-form-grid .exchange-shift-option input { width: 17px; height: 17px; margin: 0; accent-color: var(--primary); flex: 0 0 auto; }
.exchange-shift-option > span { display: flex; flex-direction: column; min-width: 0; gap: 3px; }.exchange-shift-option strong { color: var(--text); font-size: .72rem; text-transform: capitalize; }.exchange-shift-option small { color: var(--muted); font-size: .62rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.exchange-picker-empty { padding: 13px; color: var(--muted); font-size: .68rem; }
.exchange-package-preview { display: flex; flex-direction: column; gap: 8px; padding: 14px; border: 1px solid color-mix(in srgb, var(--primary) 42%, var(--border)); border-radius: 13px; background: color-mix(in srgb, var(--primary) 8%, var(--surface)); }.exchange-package-preview > strong { color: var(--text); font-size: .74rem; }.exchange-package-preview > span { display: grid; grid-template-columns: 92px 45px 20px 45px minmax(0, 1fr); align-items: center; gap: 7px; color: var(--muted); font-size: .66rem; }.exchange-package-preview time { font-weight: 700; }.exchange-package-preview b { color: var(--primary); }.exchange-package-preview i { font-style: normal; }.exchange-package-preview > small { color: var(--muted); font-size: .61rem; }
.request-form-actions { margin-top: 20px; display: flex; justify-content: flex-end; gap: 10px; }
.form-message { margin: 0 0 17px; padding: 12px 14px; border-radius: 10px; font-size: .7rem; line-height: 1.45; }.form-message.success { color: #137953; background: #e5f8ef; }.form-message.error { color: #a63b46; background: #fff0f1; }:root[data-theme="dark"] .form-message.success { color: #8ae1bb; background: #153c33; }:root[data-theme="dark"] .form-message.error { color: #ff9ba5; background: #472229; }
.request-summary-grid { margin-bottom: 17px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.requests-page .request-summary-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.request-summary-grid article { min-height: 104px; padding: 19px; display: flex; flex-direction: column; border: 1px solid var(--border); border-radius: 15px; background: var(--surface); box-shadow: var(--shadow); }
.request-summary-grid span { color: var(--faint); font-size: .58rem; font-weight: 850; letter-spacing: .1em; }.request-summary-grid strong { margin-top: 7px; font-size: 1.6rem; }.request-summary-grid small { margin-top: auto; color: var(--muted); font-size: .62rem; }
.requests-list-panel > header { min-height: 79px; padding: 18px 22px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--border); }.requests-list-panel > header h2 { margin: 7px 0 0; font-size: 1rem; }
.request-list { display: flex; flex-direction: column; }.request-row { padding: 18px 22px; display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: 15px; border-bottom: 1px solid var(--border); }.request-row:last-child { border-bottom: 0; }
.request-kind { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; color: #315fbd; background: #e9f0ff; font-size: 1.15rem; font-weight: 850; }.request-kind.vacation { color: #137953; background: #e5f8ef; }.request-kind.compensation { color: #a65e17; background: #fff1dc; }.request-kind.exchange { color: #6746c3; background: #eee9ff; }:root[data-theme="dark"] .request-kind.vacation { color: #8ae1bb; background: #153c33; }:root[data-theme="dark"] .request-kind.compensation { color: #f1b579; background: #49311d; }:root[data-theme="dark"] .request-kind.exchange { color: #c4afff; background: #302654; }
.request-copy { min-width: 0; }.request-copy > div { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; }.request-copy h3 { margin: 0; font-size: .82rem; }.request-copy p { margin: 7px 0 5px; color: var(--text); font-size: .7rem; }.request-copy small { margin-top: 4px; display: block; color: var(--muted); font-size: .6rem; line-height: 1.4; }.request-person { margin-top: 6px; display: block; font-size: .67rem; }
.request-copy .request-shift-change { display: inline-flex; align-items: center; gap: 8px; margin: 2px 0 5px; padding: 7px 9px; border: 1px solid var(--border); border-radius: 10px; background: color-mix(in srgb, var(--primary) 8%, transparent); color: var(--muted); font-size: .62rem; }.request-shift-change span { display: inline-flex; align-items: center; gap: 5px; }.request-shift-change strong { color: var(--primary); font-size: .72rem; }.request-shift-change > b { color: var(--muted); font-size: .75rem; }.request-copy .admin-shift-change { background: color-mix(in srgb, var(--purple) 8%, transparent); }
.request-copy > .request-exchange-days { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; margin: 2px 0 5px; }.request-shift-change time { min-width: 34px; font-weight: 800; color: var(--text); }
.request-copy .management-shift-change { background: color-mix(in srgb, var(--warning) 10%, transparent); }.management-response { width: min(370px, 100%); }.management-response textarea { width: 100%; min-height: 62px; padding: 9px 10px; resize: vertical; }.management-response > div { display: flex; justify-content: flex-end; gap: 8px; margin-top: 8px; }
.management-view-button { min-width: 126px; color: #fff !important; border-color: var(--primary) !important; background: var(--primary) !important; box-shadow: 0 7px 18px color-mix(in srgb, var(--primary) 22%, transparent); }
.management-read-receipt { display: flex !important; align-items: center; gap: 5px; width: fit-content; padding: 5px 8px; border-radius: 99px; font-weight: 800 !important; }
.management-read-receipt.read { color: #16805a !important; background: color-mix(in srgb, #34c992 14%, transparent); }
.management-read-receipt.unread { color: var(--faint) !important; background: var(--surface-soft); }
.management-changes-page { display: grid; gap: 22px; }.management-change-form > header { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 20px 24px; border-bottom: 1px solid var(--border); }.management-change-form h2 { margin: 4px 0 0; }.management-form-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; padding: 22px 24px; }.management-form-grid label { display: grid; gap: 7px; color: var(--faint); font-size: .62rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }.management-form-grid select, .management-form-grid textarea { width: 100%; border: 1px solid var(--border); border-radius: 10px; outline: 0; color: var(--text); background: var(--surface-soft); font: inherit; font-size: .72rem; text-transform: none; letter-spacing: normal; }.management-form-grid select { height: 43px; padding: 0 36px 0 12px; }.management-form-grid textarea { min-height: 86px; padding: 12px; resize: vertical; }.management-form-grid select:focus, .management-form-grid textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 13%, transparent); }.management-form-grid select:disabled { opacity: .6; cursor: wait; }.management-message-field { grid-column: 1 / -1; }.management-message-field small { font-size: inherit; font-weight: 700; text-transform: none; }.management-change-form > .dialog-actions { padding: 0 24px 22px; }.management-preview { display: flex; align-items: center; gap: 10px; margin: 0 24px 18px; padding: 12px 14px; border-radius: 12px; background: color-mix(in srgb, var(--primary) 8%, transparent); color: var(--muted); }.management-preview strong { color: var(--primary); font-size: .9rem; }.management-preview small { margin-left: auto; }.management-history-row { grid-template-columns: 42px minmax(0, 1fr); }
.request-status { padding: 5px 8px; border-radius: 99px; font-size: .54rem; font-weight: 800; }.request-status.pending, .request-status.colleague { color: #7b5b12; background: #fff4d8; }.request-status.approved { color: #137953; background: #e5f8ef; }.request-status.closed { color: #7b8492; background: #e9edf2; }:root[data-theme="dark"] .request-status.pending, :root[data-theme="dark"] .request-status.colleague { color: #f0ca72; background: #443619; }:root[data-theme="dark"] .request-status.approved { color: #8ae1bb; background: #153c33; }:root[data-theme="dark"] .request-status.closed { color: #abb5c4; background: #293547; }
.request-actions, .admin-request-decision > div { display: flex; gap: 8px; }.request-actions button, .admin-request-decision button { min-height: 35px; padding: 0 12px; border: 1px solid var(--border); border-radius: 9px; color: var(--muted); background: var(--surface); font-size: .62rem; font-weight: 800; cursor: pointer; }.request-actions button.approve, .admin-request-decision button.approve { color: #fff; border-color: #168f65; background: #168f65; }.request-actions button:disabled, .admin-request-decision button:disabled { opacity: .55; cursor: wait; }
.request-empty { padding: 58px 22px; text-align: center; }.request-empty > span { width: 49px; height: 49px; margin: 0 auto 14px; display: grid; place-items: center; border-radius: 14px; color: var(--primary); background: var(--primary-soft); font-size: 1.25rem; }.request-empty h2 { margin: 0 0 7px; font-size: 1rem; }.request-empty p { margin: 0; color: var(--muted); font-size: .7rem; }
.admin-inbox-note { max-width: 350px; color: var(--muted); text-align: right; font-size: .62rem; line-height: 1.45; }.admin-request-row { grid-template-columns: 42px minmax(280px, 1fr) minmax(230px, .58fr); }.admin-request-decision textarea { min-height: 68px; padding: 10px; resize: vertical; }.admin-request-decision > div { margin-top: 8px; justify-content: flex-end; }
.admin-heading-actions { display: flex; align-items: center; gap: 10px; }
.admin-new-change-mobile { display: none; }
.admin-new-change-action .admin-new-change-desktop { margin: 0; font-size: inherit; }

.notifications-page { max-width: 1000px; margin: 0 auto; }.notifications-heading { margin-bottom: 23px; display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }.notifications-heading h1 { margin: 8px 0 5px; font-size: clamp(1.8rem, 3vw, 2.45rem); letter-spacing: -.05em; }.notifications-heading p { margin: 0; color: var(--muted); font-size: .82rem; }
.notifications-panel { overflow: hidden; }.notification-list { display: flex; flex-direction: column; }.notification-row { width: 100%; padding: 18px 21px; display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: 15px; border: 0; border-bottom: 1px solid var(--border); color: var(--text); background: var(--surface); text-align: left; cursor: pointer; }.notification-row:last-child { border-bottom: 0; }.notification-row:hover { background: var(--surface-soft); }.notification-row.unread { background: color-mix(in srgb, var(--primary-soft) 42%, var(--surface)); }.notification-row.unread:hover { background: color-mix(in srgb, var(--primary-soft) 68%, var(--surface)); }
.notification-kind { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; color: var(--primary); background: var(--primary-soft); font-size: 1.05rem; font-weight: 850; }.notification-kind.exchange { color: #6746c3; background: #eee9ff; }.notification-kind.decision { color: #168f65; background: #e6f8f0; }.notification-kind.schedule { color: #315fbd; background: #e9f0ff; }.notification-kind.comp-credit { color: #a65e17; background: #fff1dc; }:root[data-theme="dark"] .notification-kind.exchange { color: #c4afff; background: #302654; }:root[data-theme="dark"] .notification-kind.decision { color: #8ae1bb; background: #153c33; }:root[data-theme="dark"] .notification-kind.schedule { color: #9abaff; background: #1b3159; }:root[data-theme="dark"] .notification-kind.comp-credit { color: #f1b579; background: #49311d; }
.notification-kind.flight { color: #a35b12; background: #fff0dc; }:root[data-theme="dark"] .notification-kind.flight { color: #f1b579; background: #49311d; }
.notification-copy { min-width: 0; display: flex; flex-direction: column; }.notification-copy > span { display: flex; align-items: center; gap: 8px; }.notification-copy strong { font-size: .78rem; }.notification-copy i { padding: 4px 7px; border-radius: 99px; color: var(--primary); background: var(--primary-soft); font-size: .5rem; font-style: normal; font-weight: 850; }.notification-copy small { margin-top: 6px; color: var(--muted); font-size: .66rem; line-height: 1.45; }.notification-copy time { margin-top: 7px; color: var(--faint); font-size: .56rem; font-weight: 750; }.notification-arrow { display: grid; place-items: center; color: var(--faint); font-size: 1rem; }.notification-empty { padding: 60px 20px; color: var(--muted); text-align: center; font-size: .72rem; }

.balances-page { max-width: 1260px; margin: 0 auto; }
.balances-heading { margin-bottom: 23px; display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.balances-heading h1 { margin: 8px 0 5px; font-size: clamp(1.8rem, 3vw, 2.45rem); letter-spacing: -.05em; }
.balances-heading p { margin: 0; color: var(--muted); font-size: .82rem; }
.balance-year { display: flex; align-items: center; gap: 9px; color: var(--muted); font-size: .67rem; font-weight: 750; }
.balance-year select { min-width: 95px; height: 40px; padding: 0 12px; border: 1px solid var(--border); border-radius: 10px; color: var(--text); background: var(--surface); font: inherit; font-size: .74rem; font-weight: 750; }
.balance-summary-grid { margin-bottom: 17px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.balance-summary { min-height: 116px; padding: 19px; display: flex; flex-direction: column; border: 1px solid var(--border); border-radius: 16px; background: var(--surface); box-shadow: var(--shadow); overflow: hidden; position: relative; }
.balance-summary::after { content: ""; position: absolute; width: 74px; height: 74px; right: -24px; top: -26px; border-radius: 50%; background: var(--balance-accent-soft); }
.balance-summary > span { color: var(--faint); font-size: .58rem; font-weight: 850; letter-spacing: .1em; }
.balance-summary > strong { margin-top: 8px; font-size: 1.55rem; letter-spacing: -.035em; }
.balance-summary > small { margin-top: auto; color: var(--muted); font-size: .62rem; line-height: 1.35; }
.balance-summary.hours { --balance-accent-soft: #e9f0ff; }.balance-summary.vacation { --balance-accent-soft: #e5f8ef; }.balance-summary.compensation { --balance-accent-soft: #fff1dc; }.balance-summary.worked { --balance-accent-soft: #eee9ff; }
:root[data-theme="dark"] .balance-summary.hours { --balance-accent-soft: #1b3159; }:root[data-theme="dark"] .balance-summary.vacation { --balance-accent-soft: #153c33; }:root[data-theme="dark"] .balance-summary.compensation { --balance-accent-soft: #49311d; }:root[data-theme="dark"] .balance-summary.worked { --balance-accent-soft: #302654; }
.annual-progress-panel { margin-bottom: 17px; padding: 22px; }
.annual-progress-panel header { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.annual-progress-panel h2 { margin: 7px 0 0; font-size: 1.04rem; }.annual-progress-panel header > strong { color: var(--primary); font-size: 1.2rem; }
.annual-progress { height: 10px; margin-top: 18px; border-radius: 99px; background: var(--surface-strong); overflow: hidden; }
.annual-progress i { display: block; height: 100%; min-width: 2px; border-radius: inherit; background: linear-gradient(90deg, #316fea, #6a98ff); }
.annual-progress-panel > p { margin: 11px 0 0; color: var(--muted); font-size: .64rem; line-height: 1.45; }
.balance-detail-grid { margin-bottom: 17px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px; }
.balance-detail-card { padding: 22px; }.balance-detail-card header h2, .monthly-balance-panel > header h2 { margin: 7px 0 0; font-size: 1rem; }
.balance-detail-card dl { margin: 18px 0 0; }.balance-detail-card dl div { min-height: 40px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--border); }.balance-detail-card dl div:last-child { border-bottom: 0; }
.balance-detail-card dt { color: var(--muted); font-size: .7rem; }.balance-detail-card dd { margin: 0; font-size: .76rem; font-weight: 850; }
.lc-card { display: flex; flex-direction: column; align-items: flex-start; }.lc-card header { width: 100%; }.balance-pending-symbol { width: 43px; height: 43px; margin-top: 21px; display: grid; place-items: center; border-radius: 12px; color: #bd711c; background: #fff1dc; font-size: 1.25rem; }.lc-card > strong { margin-top: 14px; font-size: .83rem; }.lc-card > p { margin: 7px 0 0; color: var(--muted); font-size: .68rem; line-height: 1.55; }:root[data-theme="dark"] .balance-pending-symbol { color: #f1b579; background: #49311d; }
.compensation-totals { width: 100%; margin-top: 18px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }.compensation-totals span { padding: 10px; display: flex; flex-direction: column; border-radius: 9px; color: var(--muted); background: var(--surface-soft); font-size: .57rem; }.compensation-totals strong { margin-bottom: 3px; color: var(--text); font-size: .88rem; }.lc-card .next-expiry { width: 100%; margin: 12px 0 0; padding: 10px 12px; border-radius: 9px; color: #8c5a17; background: #fff5e5; font-size: .64rem; }:root[data-theme="dark"] .lc-card .next-expiry { color: #efc47e; background: #3d2e18; }
.compensation-credit-list { width: 100%; max-height: 190px; margin-top: 12px; overflow-y: auto; }.compensation-credit-list article { min-height: 50px; padding: 9px 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid var(--border); }.compensation-credit-list article > div { min-width: 0; display: flex; flex-direction: column; }.compensation-credit-list article strong { font-size: .67rem; }.compensation-credit-list article small { margin-top: 4px; color: var(--muted); font-size: .57rem; }.credit-status { flex: 0 0 auto; padding: 5px 8px; border-radius: 99px; color: #137953; background: #e5f8ef; font-size: .53rem; font-weight: 850; }.credit-status.requested, .credit-status.reserved { color: #8c5a17; background: #fff1dc; }.credit-status.used { color: #315fbd; background: #e9f0ff; }.credit-status.expired, .credit-status.paid { color: #6f7887; background: #e9edf2; }:root[data-theme="dark"] .credit-status { color: #8ae1bb; background: #153c33; }:root[data-theme="dark"] .credit-status.requested, :root[data-theme="dark"] .credit-status.reserved { color: #efc47e; background: #49311d; }:root[data-theme="dark"] .credit-status.used { color: #9abaff; background: #1b3159; }:root[data-theme="dark"] .credit-status.expired, :root[data-theme="dark"] .credit-status.paid { color: #b5c0d0; background: #293547; }
.vacation-periods-panel { margin-bottom: 17px; }
.vacation-periods-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.vacation-periods-header > strong { color: var(--accent); font-size: .76rem; white-space: nowrap; }
.vacation-period-dates { color: var(--text); font-size: .72rem; white-space: nowrap; }
.personnel-vacations-page { max-width: 1260px; margin: 0 auto; }
.vacation-admin-actions { display: flex; align-items: center; gap: 12px; }
.vacation-score-link, .vacation-back-link { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; text-decoration: none; white-space: nowrap; }
.vacation-admin-summary { margin-bottom: 17px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; }
.vacation-admin-summary article { padding: 18px 20px; }
.vacation-admin-summary span { display: block; color: var(--faint); font-size: .58rem; font-weight: 850; letter-spacing: .1em; }
.vacation-admin-summary strong { display: block; margin-top: 8px; font-size: 1.45rem; }
.vacation-admin-summary small { color: var(--muted); font-size: .66rem; }
.vacation-department-panel, .vacation-score-panel { margin-bottom: 17px; overflow: hidden; }
.personnel-vacations-scroll { overflow-x: auto; }
.personnel-vacations-table, .vacation-score-table { width: 100%; border-collapse: collapse; }
.personnel-vacations-table th, .personnel-vacations-table td, .vacation-score-table th, .vacation-score-table td { padding: 15px 18px; border-top: 1px solid var(--border); text-align: left; vertical-align: middle; }
.personnel-vacations-table thead th, .vacation-score-table thead th { border-top: 0; color: var(--faint); background: var(--surface-soft); font-size: .58rem; letter-spacing: .08em; text-transform: uppercase; }
.personnel-vacations-table tbody th { min-width: 230px; }.personnel-vacations-table tbody th strong, .vacation-score-table tbody th strong { display: block; color: var(--text); font-size: .75rem; }.personnel-vacations-table tbody th span, .vacation-score-table tbody th span { display: block; margin-top: 3px; color: var(--muted); font-size: .62rem; font-weight: 500; }
.vacation-period-pills { display: flex; flex-wrap: wrap; gap: 8px; }.vacation-period-pills > span { min-width: 150px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 9px; color: var(--text); background: var(--surface-soft); font-size: .64rem; }.vacation-period-pills b { margin-right: 7px; color: var(--primary); }.vacation-period-pills small { display: block; margin: 3px 0 0 25px; color: var(--muted); font-size: .57rem; }
.vacation-none { color: var(--faint); font-size: .66rem; }.vacation-score-table td { color: var(--muted); font-size: .7rem; }.vacation-rank { width: 28px; height: 28px; display: inline-grid; place-items: center; border-radius: 8px; color: var(--primary); background: var(--primary-soft); font-weight: 900; }.vacation-points { color: var(--primary); font-size: 1rem; }
.monthly-balance-panel { margin-bottom: 17px; }.monthly-balance-panel > header { padding: 20px 22px; border-bottom: 1px solid var(--border); }.monthly-balance-scroll { overflow-x: auto; }.monthly-balance-panel table { width: 100%; border-collapse: collapse; white-space: nowrap; }.monthly-balance-panel th { padding: 12px 15px; color: var(--faint); background: var(--surface-soft); text-align: left; font-size: .55rem; letter-spacing: .07em; }.monthly-balance-panel td { padding: 13px 15px; border-top: 1px solid var(--border); color: var(--muted); font-size: .66rem; }.monthly-balance-panel tbody tr:first-child td { border-top: 0; }.monthly-balance-panel td strong { color: var(--text); }.monthly-balance-panel tr.empty-month { opacity: .52; }
.balance-policy-note { padding: 14px 16px; display: flex; align-items: flex-start; gap: 11px; border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--border)); border-radius: 12px; color: var(--muted); background: color-mix(in srgb, var(--primary-soft) 35%, var(--surface)); }.balance-policy-note > span { flex: 0 0 22px; width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--primary); font-size: .65rem; font-weight: 850; }.balance-policy-note p { margin: 1px 0 0; font-size: .65rem; line-height: 1.5; }.balance-policy-note strong { color: var(--text); }
.balance-state, .balance-empty { padding: 64px 24px; color: var(--muted); text-align: center; font-size: .74rem; }.balance-state.error { color: #a63b46; }.balance-empty > span { width: 52px; height: 52px; margin: 0 auto 15px; display: grid; place-items: center; border-radius: 15px; color: var(--primary); background: var(--primary-soft); font-size: 1.35rem; }.balance-empty h2 { margin: 0 0 8px; color: var(--text); font-size: 1.05rem; }.balance-empty p { margin: 0; }

.variables-page { max-width: 1120px; margin: 0 auto; }.variables-heading { margin-bottom: 22px; display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }.variables-heading h1 { margin: 8px 0 5px; font-size: clamp(1.8rem, 3vw, 2.35rem); letter-spacing: -.045em; }.variables-heading p { margin: 0; color: var(--muted); font-size: .82rem; }.variables-period { display: flex; align-items: center; gap: 10px; color: var(--faint); font-size: .61rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }.variables-period select { min-width: 165px; height: 40px; padding: 0 34px 0 12px; border: 1px solid var(--border); border-radius: 10px; outline: 0; color: var(--text); background: var(--surface); font: inherit; font-size: .68rem; letter-spacing: normal; text-transform: none; }.variables-period select:focus { border-color: var(--primary); }
.variables-state, .variables-empty { padding: 70px 24px; color: var(--muted); text-align: center; font-size: .75rem; }.variables-state.error { color: #a63b46; }.variables-empty > span { width: 54px; height: 54px; margin: 0 auto 16px; display: grid; place-items: center; border-radius: 16px; color: var(--primary); background: var(--primary-soft); font-size: 1.35rem; font-weight: 800; }.variables-empty h2 { margin: 0 0 8px; color: var(--text); font-size: 1.08rem; }.variables-empty p { margin: 0; }
.variables-period-banner { margin-bottom: 17px; padding: 20px 22px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }.variables-period-banner h2 { margin: 7px 0 4px; font-size: 1.12rem; }.variables-period-banner p { margin: 0; color: var(--muted); font-size: .65rem; }.variables-closed-badge { padding: 7px 11px; display: inline-flex; align-items: center; gap: 7px; border-radius: 99px; color: #157955; background: #e6f8ef; font-size: .62rem; font-weight: 800; }.variables-closed-badge i { width: 7px; height: 7px; border-radius: 50%; background: #28bd84; }:root[data-theme="dark"] .variables-closed-badge { color: #85ddb7; background: #143b31; }
.variables-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }.variable-card { min-height: 116px; padding: 18px; display: flex; align-items: center; gap: 14px; border: 1px solid var(--border); border-radius: 15px; background: var(--surface); box-shadow: var(--shadow); }.variable-icon { flex: 0 0 40px; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 11px; color: var(--primary); background: var(--primary-soft); font-size: .72rem; font-weight: 850; }.variable-card > div { min-width: 0; display: flex; flex-direction: column; }.variable-card small { color: var(--faint); font-size: .58rem; font-weight: 850; line-height: 1.2; letter-spacing: .07em; }.variable-card strong { margin-top: 7px; font-size: 1.4rem; line-height: 1.05; letter-spacing: -.035em; }.variable-card p { margin: 5px 0 0; color: var(--muted); font-size: .62rem; line-height: 1.3; }.variable-card.afternoon .variable-icon { color: #7554cf; background: #f0ebff; }.variable-card.night-one .variable-icon, .variable-card.night-two .variable-icon { color: #7853ca; background: #eee8ff; }.variable-card.sunday .variable-icon, .variable-card.holiday-worked .variable-icon { color: #b96d18; background: #fff1dc; }.variable-card.manager .variable-icon { color: #157b7e; background: #e2f6f5; }.variable-card.holiday-unused .variable-icon { color: #bf5360; background: #ffeaed; }.variable-card.guards .variable-icon { color: #1485a0; background: #e1f5f9; }:root[data-theme="dark"] .variable-card.afternoon .variable-icon, :root[data-theme="dark"] .variable-card.night-one .variable-icon, :root[data-theme="dark"] .variable-card.night-two .variable-icon { color: #bca6ff; background: #33264f; }:root[data-theme="dark"] .variable-card.sunday .variable-icon, :root[data-theme="dark"] .variable-card.holiday-worked .variable-icon { color: #efbf7b; background: #44301b; }:root[data-theme="dark"] .variable-card.manager .variable-icon { color: #83d7d8; background: #183b3d; }:root[data-theme="dark"] .variable-card.holiday-unused .variable-icon { color: #ff9da7; background: #47242b; }:root[data-theme="dark"] .variable-card.guards .variable-icon { color: #83d3e4; background: #173b45; }
.variables-policy-note { margin-top: 17px; padding: 14px 16px; display: flex; align-items: flex-start; gap: 11px; border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--border)); border-radius: 12px; color: var(--muted); background: color-mix(in srgb, var(--primary-soft) 35%, var(--surface)); }.variables-policy-note > span { flex: 0 0 22px; width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--primary); font-size: .65rem; font-weight: 850; }.variables-policy-note p { margin: 1px 0 0; font-size: .65rem; line-height: 1.5; }
.variable-card.vacations .variable-icon { color: #1d8b67; background: #e4f7ef; }.variable-card.paid-leave .variable-icon { color: #2974bd; background: #e8f2ff; }.variable-card.unpaid-leave .variable-icon, .variable-card.temporary-leave .variable-icon { color: #7c667e; background: #f1ebf2; }.variable-card.training-delivered .variable-icon, .variable-card.training-received .variable-icon { color: #7654c6; background: #f0ebff; }:root[data-theme="dark"] .variable-card.vacations .variable-icon { color: #82dfba; background: #153d32; }:root[data-theme="dark"] .variable-card.paid-leave .variable-icon { color: #92c3f4; background: #193653; }:root[data-theme="dark"] .variable-card.unpaid-leave .variable-icon, :root[data-theme="dark"] .variable-card.temporary-leave .variable-icon { color: #cbb8cc; background: #382d3a; }:root[data-theme="dark"] .variable-card.training-delivered .variable-icon, :root[data-theme="dark"] .variable-card.training-received .variable-icon { color: #bca7f5; background: #342850; }

#blazor-error-ui { color-scheme: light only; display: none; position: fixed; left: 0; right: 0; bottom: 0; z-index: 1000; padding: .8rem 1rem; background: #fff4cf; color: #332810; box-shadow: 0 -2px 8px rgba(0,0,0,.18); }
#blazor-error-ui .dismiss { position: absolute; right: 1rem; cursor: pointer; }

@media (max-width: 1120px) {
    .summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .content-grid { grid-template-columns: 1fr; }
    .home-overview-grid { grid-template-columns: 1fr; }
    .home-stats-column { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: none; }
    .activity-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
    .activity-item { border-bottom: 0; }
    .personnel-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .request-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .balance-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    .auth-shell { display: block; }
    .auth-brand-panel { min-height: auto; padding: max(22px, env(safe-area-inset-top)) 22px 22px; }
    .auth-message, .auth-version-note { display: none; }
    .auth-content { min-height: calc(100vh - 87px); padding: 66px 22px 42px; align-items: start; }
    .auth-theme { top: 14px; right: 16px; }
    .auth-card { margin-top: 18px; }
    .setup-grid { grid-template-columns: 1fr; }
    .home-stats-column { display: flex; overflow-x: auto; margin-left: -16px; margin-right: -16px; padding: 0 16px 5px; }
    .home-stats-column .summary-card { min-width: 220px; }
    .home-activity-panel .activity-list { grid-template-columns: 1fr; }
    .app-shell { display: block; }
    .app-sidebar { display: none; }
    .app-topbar { position: sticky; top: 0; z-index: 40; height: 58px; min-height: 58px; padding: 0 max(16px, env(safe-area-inset-right)) 0 max(16px, env(safe-area-inset-left)); align-items: center; background: var(--surface); }
    .eyebrow, .profile-copy, .theme-label { display: none; }
    .topbar-greeting { margin: 0; font-size: .93rem; line-height: 1.15; }
    .topbar-actions { gap: 8px; }
    .theme-toggle, .notification-button { width: 38px; height: 38px; min-width: 38px; padding: 0; border-radius: 11px; }
    .profile-trigger { width: 38px; height: 38px; min-height: 38px; padding: 0; border-radius: 11px; }.profile-chevron { display: none; }.avatar { width: 38px; height: 38px; border-radius: 11px; }.profile-menu { position: fixed; top: 64px; right: max(12px, env(safe-area-inset-right)); width: min(225px, calc(100vw - 24px)); }.logout-confirmation { padding: 25px 21px; }
    .app-content { padding: 24px 16px calc(76px + env(safe-area-inset-bottom)); }
    .welcome-row { align-items: flex-start; }.welcome-row h1 { font-size: 1.75rem; }.welcome-row p { max-width: 230px; line-height: 1.45; }
    .primary-action { width: 43px; padding: 0; font-size: 0; }.primary-action span { margin: 0; font-size: 1.2rem; }
    .summary-grid { display: flex; overflow-x: auto; margin-left: -16px; margin-right: -16px; padding: 0 16px 5px; scroll-snap-type: x mandatory; }
    .summary-card { min-width: 235px; scroll-snap-align: start; }
    .panel-heading { padding: 17px; }.panel-heading-actions .sync-note { display: none; }
    .legend-info-button { width: 36px; height: 36px; border-radius: 10px; font-size: 1.05rem; }
    .shift-legend-dialog { padding: 24px 20px; }.shift-legend-grid { margin-top: 17px; padding: 13px; gap: 8px 10px; }.shift-legend-grid span { font-size: .65rem; }
    .week-strip { grid-template-columns: repeat(7, 82px); padding: 14px; }
    .day-cell { min-height: 140px; }
    .legend { padding: 12px 16px; gap: 12px; }
    .activity-list { display: block; }.activity-item { border-bottom: 1px solid var(--border); }
    .next-shift-card { grid-template-columns: auto 1fr; gap: 13px; }.next-shift-meta, .next-shift-card > button, .next-shift-link { display: none; }
    .mobile-nav { position: fixed; display: grid; grid-template-columns: repeat(5, minmax(0, 70px)); justify-content: center; column-gap: 2px; left: 0; right: 0; bottom: 0; z-index: 30; padding: calc(5px + min(10px, env(safe-area-inset-bottom))) max(4px, env(safe-area-inset-right)) calc(4px + max(0px, env(safe-area-inset-bottom) - 10px)) max(4px, env(safe-area-inset-left)); border-top: 1px solid var(--border); background: color-mix(in srgb, var(--surface) 94%, transparent); backdrop-filter: blur(16px); }
    .mobile-nav.admin, .mobile-nav.six { grid-template-columns: repeat(6, minmax(0, 60px)); }
    .mobile-nav.seven { grid-template-columns: repeat(7, minmax(0, 52px)); }
    .mobile-nav.eight { grid-template-columns: repeat(8, 1fr); }
    .mobile-nav a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-height: 38px; color: var(--faint); }.mobile-nav a.active { color: var(--primary); }.mobile-nav span { display: grid; place-items: center; font-size: 1.6rem; line-height: 1; }.mobile-nav small { font-size: .58rem; font-weight: 750; line-height: 1; }
    .mobile-admin-nav { position: relative; }
    .mobile-admin-badge { position: absolute; top: -4px; left: calc(50% + 7px); min-width: 17px; height: 17px; padding: 0 4px; display: grid; place-items: center; border: 2px solid var(--surface); border-radius: 99px; color: #fff; background: #e54858; font-size: .5rem; font-weight: 850; line-height: 1; }
    .mobile-request-nav { position: relative; }
    .mobile-request-badge { position: absolute; top: -4px; left: calc(50% + 7px); min-width: 17px; height: 17px; padding: 0 4px; display: grid; place-items: center; border: 2px solid var(--surface); border-radius: 99px; color: #fff; background: #e54858; font-size: .5rem; font-weight: 850; line-height: 1; }
    .account-heading { align-items: flex-start; }.account-grid { grid-template-columns: 1fr; }.identity-card { grid-row: auto; }.account-details-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.account-profile-hero { flex-wrap: wrap; }
    .personalization-options { grid-template-columns: 1fr; }.preference-row { align-items: stretch; flex-direction: column; }.preference-switch { width: 100%; }.personalization-footer { align-items: stretch; flex-direction: column; }.personalization-footer .account-action { width: 100%; }
    .support-heading { align-items: flex-start; flex-direction: column; }.support-layout { grid-template-columns: 1fr; }.support-info { grid-template-columns: 1fr 1fr; }.support-intro-card { grid-column: 1 / -1; }.support-form-grid { grid-template-columns: 1fr; }.support-message-field { grid-column: auto; }.support-form-card > footer { align-items: stretch; flex-direction: column; }.support-form-card > footer .account-action { width: 100%; }.support-status { display: none; }
    .password-fields { grid-template-columns: 1fr; }.password-fields .form-field:first-child { grid-column: auto; }
    .personnel-heading { align-items: flex-start; }.personnel-import { width: 44px; padding: 0; font-size: 0; }.personnel-import span { margin: 0; font-size: 1.1rem; }
    .personnel-summary { display: flex; overflow-x: auto; margin-left: -16px; margin-right: -16px; padding: 0 16px 5px; }.personnel-summary article { min-width: 190px; }
    .personnel-toolbar { align-items: flex-start; flex-direction: column; }.personnel-search { width: 100%; }
    .personnel-table th:nth-child(2), .personnel-table td:nth-child(2), .personnel-table th:nth-child(3), .personnel-table td:nth-child(3), .personnel-table th:nth-child(5), .personnel-table td:nth-child(5) { display: none; }
    .invite-dialog { padding: 25px 21px; }.activation-code span { font-size: 1.28rem; }
    .requests-heading { align-items: flex-start; }.requests-heading .new-request-action { flex: 0 0 46px; width: 46px; height: 46px; min-height: 46px; margin-top: 14px; padding: 0; gap: 0; border-radius: 13px; }.requests-heading .new-request-action .new-request-icon { width: 100%; height: 100%; border-radius: inherit; background: transparent; font-size: 1.55rem; }.requests-heading .new-request-action > span:last-child { display: none; }.request-form-card { padding: 19px; }.request-form-grid { grid-template-columns: 1fr; }.request-type-field, .request-wide { grid-column: auto; }.request-date-field input { flex: 0 0 auto; width: 100%; max-width: 100%; inline-size: 100%; -webkit-appearance: none; appearance: none; }.request-date-field .request-date-icon { right: 13px; }
    .admin-requests-page .requests-heading { align-items: flex-start; }
    .admin-requests-page .requests-heading > div:first-child { min-width: 0; }
    .admin-requests-page .requests-heading h1 { font-size: 1.55rem; white-space: nowrap; }
    .admin-requests-page .requests-heading p { max-width: 225px; font-size: .7rem; line-height: 1.4; }
    .admin-heading-actions { flex: 0 0 auto; margin: 21px 0 0 auto; }
    .admin-heading-actions .secondary-button, .admin-heading-actions .admin-vacations-link, .admin-heading-actions .admin-variables-link { display: none; }
    .admin-heading-actions .admin-new-change-action { width: auto; min-width: 112px; height: 42px; padding: 0 12px; gap: 7px; border-radius: 12px; font-size: .64rem; white-space: nowrap; }
    .admin-heading-actions .admin-new-change-action .admin-new-change-icon { margin: 0; font-size: 1rem; }
    .admin-new-change-desktop { display: none; }
    .admin-heading-actions .admin-new-change-action .admin-new-change-mobile { display: inline; margin: 0; font-size: inherit; }
    .request-summary-grid, .requests-page .request-summary-grid { display: flex; overflow-x: auto; margin-left: -16px; margin-right: -16px; padding: 0 16px 5px; }.request-summary-grid article { min-width: 190px; }
    .requests-list-panel > header { align-items: flex-start; flex-direction: column; }.admin-inbox-note { text-align: left; }.request-row, .admin-request-row { grid-template-columns: 39px minmax(0, 1fr); padding: 16px; align-items: start; }.request-kind { width: 39px; height: 39px; }.request-actions, .admin-request-decision { grid-column: 2; }.request-actions { flex-wrap: wrap; }.admin-request-decision > div { justify-content: flex-start; }
    .management-change-form > header { align-items: flex-start; flex-direction: column; padding: 18px; }.management-form-grid { grid-template-columns: 1fr; padding: 18px; }.management-message-field { grid-column: auto; }.management-preview { align-items: flex-start; flex-wrap: wrap; margin: 0 18px 16px; }.management-preview small { width: 100%; margin-left: 0; }.management-change-form > .dialog-actions { padding: 0 18px 18px; }.management-change-form > .dialog-actions .primary-action { width: 100%; padding: 0 18px; font-size: .7rem; }.management-change-form > .dialog-actions .primary-action span { font-size: inherit; }
    .notifications-heading { align-items: flex-start; flex-direction: column; }.notifications-heading .secondary-button { width: 100%; }.notification-row { grid-template-columns: 39px minmax(0, 1fr) auto; padding: 16px; }.notification-kind { width: 39px; height: 39px; }
    .balances-heading { align-items: stretch; flex-direction: column; }.balance-year { width: 100%; align-items: stretch; flex-direction: column; justify-content: flex-start; gap: 7px; }.balance-year > span { color: var(--faint); font-size: .6rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }.balance-year select { width: 100%; height: 44px; flex: none; }.balance-summary-grid { display: flex; overflow-x: auto; margin-left: -16px; margin-right: -16px; padding: 0 16px 5px; }.balance-summary { min-width: 220px; }.balance-detail-grid { grid-template-columns: 1fr; }.annual-progress-panel { padding: 18px; }.monthly-balance-panel > header { padding: 18px; }
    .compensation-totals { grid-template-columns: repeat(2, 1fr); }
    .variables-heading { align-items: stretch; flex-direction: column; }.variables-period { width: 100%; align-items: stretch; flex-direction: column; justify-content: flex-start; gap: 7px; }.variables-period select { width: 100%; height: 44px; flex: none; }.variables-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.variable-card { min-height: 120px; padding: 17px; }.variables-period-banner { align-items: flex-start; }.variables-closed-badge { display: none; }
    .import-card { padding: 20px; }.import-notes { grid-template-columns: 1fr; }.result-grid { grid-template-columns: repeat(2, 1fr); }.import-actions { flex-direction: column-reverse; }.import-actions > * { width: 100%; min-height: 44px; }
    .schedule-summary-grid { grid-template-columns: repeat(2, 1fr); }.schedule-summary-grid div:first-child { grid-column: 1 / -1; }
    .schedule-publish-box > div { align-items: stretch; flex-direction: column; }.schedule-publish-box .account-action { width: 100%; }
    .version-heading { align-items: flex-start; flex-direction: column; }.version-heading-actions { width: 100%; justify-content: space-between; flex-wrap: wrap; }.version-row { grid-template-columns: 50px minmax(0, 1fr); padding: 16px; }.version-number { width: 46px; height: 46px; }.version-actions { grid-column: 2; align-items: flex-start; }.version-copy > div { align-items: flex-start; flex-direction: column; gap: 3px; }
    .change-summary-dialog { padding: 24px 18px; }.change-summary-header { display: none; }.change-summary-row { grid-template-columns: 1fr auto; gap: 8px 14px; }.change-codes { grid-column: 1 / -1; }
    .schedule-page-heading { align-items: stretch; flex-direction: column; }.schedule-view-switch button { flex: 1; min-width: 0; }.calendar-toolbar { align-items: stretch; flex-direction: column; }.calendar-toolbar > div { justify-content: space-between; }.calendar-toolbar h2 { min-width: 0; font-size: .86rem; }.calendar-toolbar select { width: 100%; }.calendar-weekdays { display: none; }.personal-calendar { grid-template-columns: 1fr; }.calendar-day, .week-view .calendar-day { min-height: 100px; padding: 13px; display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 10px; border-right: 0; }.month-view .calendar-day:nth-last-child(-n+7), .week-view .calendar-day { border-bottom: 1px solid var(--border); }.calendar-day.outside-month { display: none; }.calendar-day > header, .week-view .calendar-day > header { align-items: flex-start; flex-direction: column; justify-content: flex-start; gap: 5px; }.calendar-day > header span, .week-view .calendar-day > header span { display: block; }.calendar-assignment, .week-view .calendar-assignment { min-height: 76px; margin-top: 0; padding: 11px; justify-content: center; }.calendar-leadership-activity { grid-column: 2; width: 100%; min-height: 76px; margin-top: 0; padding: 11px; justify-content: center; border-radius: 10px; }.calendar-leadership-activity b { font-size: .75rem; }.calendar-leadership-activity span { margin-top: 4px; font-size: .57rem; }.calendar-leadership-activity small { margin-top: 4px; font-size: .54rem; }.no-assignment { margin-top: 12px; }.annual-schedule-grid { grid-template-columns: repeat(2, 1fr); padding: 13px; }.annual-month { min-height: 125px; }.schedule-legend { gap: 11px; }
}

@media (max-width: 410px) {
    .welcome-row h1 { font-size: 1.55rem; }
    .panel-heading h2 { font-size: .9rem; }
    .variables-grid { grid-template-columns: 1fr; }
    .account-details-grid { grid-template-columns: 1fr; }
}

.leadership-page { display: flex; flex-direction: column; gap: 20px; }
.leadership-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.leadership-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.leadership-summary-grid article { min-height: 120px; padding: 22px; display: flex; flex-direction: column; justify-content: center; }
.leadership-summary-grid span { color: var(--faint); font-size: .61rem; font-weight: 850; letter-spacing: .13em; }
.leadership-summary-grid strong { margin: 7px 0 3px; font-size: 1.85rem; }
.leadership-summary-grid small { color: var(--muted); font-size: .65rem; }
.leadership-form-panel > header, .leadership-agenda > header, .leadership-history > header { padding: 22px 26px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--border); }
.leadership-form-panel h2, .leadership-agenda h2, .leadership-history h2 { margin: 4px 0 0; font-size: 1.08rem; }
.icon-close { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 9px; color: var(--muted); background: var(--surface); font-size: 1rem; cursor: pointer; }
.leadership-form-grid { padding: 24px 26px 8px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; }
.leadership-form-grid label { display: flex; flex-direction: column; gap: 8px; color: var(--muted); font-size: .66rem; font-weight: 780; }
.leadership-form-grid select, .leadership-form-grid input, .leadership-form-grid textarea { width: 100%; min-height: 42px; padding: 9px 11px; border: 1px solid var(--border); border-radius: 9px; color: var(--text); background: var(--surface-soft); font: inherit; font-size: .71rem; }
.leadership-date-field { position: relative; min-width: 0; }.leadership-date-field input { min-width: 0; max-width: 100%; padding-right: 42px; box-sizing: border-box; }.leadership-date-field input::-webkit-calendar-picker-indicator { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0; opacity: 0; cursor: pointer; }.leadership-date-icon { position: absolute; right: 12px; bottom: 12px; width: 18px; height: 18px; display: grid; place-items: center; color: var(--muted); pointer-events: none; }
.leadership-time-field { position: relative; min-width: 0; }.leadership-time-field input { min-width: 0; max-width: 100%; padding-right: 42px; box-sizing: border-box; }.leadership-time-field input::-webkit-calendar-picker-indicator { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0; opacity: 0; cursor: pointer; }.leadership-time-icon { position: absolute; right: 12px; bottom: 12px; width: 18px; height: 18px; display: grid; place-items: center; color: var(--muted); pointer-events: none; }
.leadership-form-grid textarea { min-height: 92px; resize: vertical; }.leadership-notes { grid-column: 1 / -1; }
.leadership-form-panel .form-message { margin: 14px 26px 0; }.leadership-form-panel .dialog-actions { padding: 18px 26px 24px; }.leadership-error { padding: 26px; color: #d55362; }
.leadership-list { display: flex; flex-direction: column; }.leadership-row { padding: 18px 24px; display: grid; grid-template-columns: 62px minmax(0, 1fr) auto; align-items: center; gap: 18px; border-bottom: 1px solid var(--border); }.leadership-row:last-child { border-bottom: 0; }
.leadership-date { width: 58px; height: 62px; display: flex; align-items: center; justify-content: center; flex-direction: column; border-radius: 12px; color: #9abaff; background: #1b3159; }:root:not([data-theme="dark"]) .leadership-date { color: #245bc5; background: #e8f0ff; }.leadership-date span { font-size: .53rem; font-weight: 850; }.leadership-date strong { font-size: 1.2rem; }
.leadership-copy { min-width: 0; }.leadership-copy > div { display: flex; align-items: center; gap: 8px; }.leadership-copy h3 { margin: 7px 0 3px; font-size: .82rem; }.leadership-copy h3 small { color: var(--muted); font-size: .62rem; }.leadership-copy p { margin: 0; color: var(--muted); font-size: .65rem; }.leadership-copy > small { display: block; margin-top: 6px; color: var(--faint); font-size: .57rem; }
.leadership-type { padding: 5px 8px; border-radius: 99px; color: #315fbd; background: #e9f0ff; font-size: .53rem; font-weight: 850; }.leadership-type.supervision { color: #6746c3; background: #eee9ff; }.leadership-type.training { color: #137953; background: #e5f8ef; }.leadership-type.familiarizationflight { color: #a35b12; background: #fff0dc; }:root[data-theme="dark"] .leadership-type { color: #9abaff; background: #1b3159; }:root[data-theme="dark"] .leadership-type.supervision { color: #c4afff; background: #302654; }:root[data-theme="dark"] .leadership-type.training { color: #8ae1bb; background: #153c33; }:root[data-theme="dark"] .leadership-type.familiarizationflight { color: #f1b579; background: #49311d; }
.flight-receipt { padding: 5px 8px; display: inline-flex; align-items: center; gap: 4px; border-radius: 99px; font-size: .53rem; font-weight: 850; }.flight-receipt.pending { color: #8c6512; background: #fff4d8; }.flight-receipt.received { color: #137953; background: #e5f8ef; }:root[data-theme="dark"] .flight-receipt.pending { color: #f0ca72; background: #443619; }:root[data-theme="dark"] .flight-receipt.received { color: #8ae1bb; background: #153c33; }
.familiarization-page { max-width: 820px; margin: 0 auto; }.familiarization-card { overflow: hidden; }.familiarization-card > header { padding: 25px 27px; border-bottom: 1px solid var(--border); }.familiarization-card h1 { margin: 8px 0 6px; font-size: clamp(1.65rem, 4vw, 2.3rem); letter-spacing: -.045em; }.familiarization-card header p { margin: 0; color: var(--muted); font-size: .75rem; }.familiarization-details { padding: 25px 27px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }.familiarization-details div { min-height: 82px; padding: 15px; display: flex; flex-direction: column; border-radius: 12px; background: var(--surface-soft); }.familiarization-details span { color: var(--faint); font-size: .56rem; font-weight: 850; letter-spacing: .08em; }.familiarization-details strong { margin-top: 8px; font-size: .78rem; }.familiarization-note { margin: 0 27px; padding: 19px; border: 1px solid color-mix(in srgb, #d88a2c 32%, var(--border)); border-radius: 13px; background: color-mix(in srgb, #d88a2c 7%, var(--surface)); }.familiarization-note span { color: #a35b12; font-size: .58rem; font-weight: 850; letter-spacing: .08em; }.familiarization-note p { margin: 9px 0 0; color: var(--text); font-size: .76rem; line-height: 1.6; white-space: pre-wrap; }.familiarization-receipt { margin: 24px 27px 27px; padding-top: 22px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-top: 1px solid var(--border); }.familiarization-receipt p { margin: 0; color: var(--muted); font-size: .7rem; line-height: 1.5; }.familiarization-receipt strong { color: #168f65; }.familiarization-state { padding: 70px 24px; color: var(--muted); text-align: center; }
.leadership-actions { display: flex; align-items: center; gap: 8px; }.leadership-actions button { min-height: 34px; padding: 0 11px; border: 1px solid var(--border); border-radius: 8px; color: var(--text); background: var(--surface); font-size: .58rem; font-weight: 800; cursor: pointer; }.leadership-actions button.complete { color: #137953; border-color: #42b88a; }.leadership-actions button.danger { color: #d55362; border-color: #8d3f49; }
.leadership-actions.compact-actions { flex-wrap: nowrap; }.leadership-actions .leadership-row-icon { width: 36px; height: 36px; min-height: 36px; padding: 0; display: grid; place-items: center; border-radius: 10px; color: var(--primary); font-size: 1rem; }.leadership-actions .leadership-row-icon:hover { border-color: var(--primary); background: var(--primary-soft); }
.leadership-supervisors-compact { min-height: 68px; padding: 14px 18px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }.leadership-supervisors-compact > div { display: flex; flex-direction: column; gap: 5px; }.leadership-supervisors-compact small { color: var(--muted); font-size: .61rem; }.leadership-supervisors-compact strong { color: var(--primary); font-size: 1.4rem; }
.leadership-info-dialog, .leadership-actions-dialog { width: min(100%, 500px); }.leadership-info-summary { margin-top: 18px; padding: 14px; display: flex; flex-direction: column; gap: 5px; border-radius: 11px; background: var(--surface-soft); }.leadership-info-summary strong { font-size: .78rem; }.leadership-info-summary span, .leadership-info-summary small { color: var(--muted); font-size: .64rem; }.leadership-info-detail { margin-top: 11px; padding: 13px 14px; display: flex; flex-direction: column; gap: 6px; border: 1px solid var(--border); border-radius: 11px; }.leadership-info-detail > span { color: var(--faint); font-size: .56rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }.leadership-info-detail strong, .leadership-info-detail p { margin: 0; font-size: .69rem; line-height: 1.5; }.receipt-ok { color: #168f65; }.receipt-pending { color: #b67b18; }.leadership-action-options { margin-top: 20px; display: flex; flex-direction: column; gap: 9px; }.leadership-action-options button { min-height: 42px; padding: 0 14px; border: 1px solid var(--border); border-radius: 10px; color: var(--text); background: var(--surface-soft); font: inherit; font-size: .68rem; font-weight: 800; cursor: pointer; }.leadership-action-options button.complete { color: #168f65; border-color: #389a76; }.leadership-action-options button.danger { color: #d55362; border-color: #8d3f49; }
.request-status.completed { color: #137953; background: #e5f8ef; }.request-status.cancelled { color: #a63b46; background: #fff0f1; }:root[data-theme="dark"] .request-status.completed { color: #8ae1bb; background: #153c33; }:root[data-theme="dark"] .request-status.cancelled { color: #ff9ba5; background: #472229; }
.calendar-leadership-activity { margin-top: 7px; padding: 7px 8px; display: flex; flex-direction: column; border: 1px solid #89aaf1; border-radius: 9px; color: #315fbd; background: #eef3ff; }.calendar-leadership-activity b { font-size: .59rem; }.calendar-leadership-activity span, .calendar-leadership-activity small { margin-top: 2px; overflow: hidden; font-size: .52rem; text-overflow: ellipsis; white-space: nowrap; }.calendar-leadership-activity.supervision { color: #6746c3; border-color: #a895e6; background: #f2efff; }.calendar-leadership-activity.training { color: #137953; border-color: #76c9a6; background: #ebfaf3; }:root[data-theme="dark"] .calendar-leadership-activity { color: #9abaff; border-color: #315995; background: #162b50; }:root[data-theme="dark"] .calendar-leadership-activity.supervision { color: #c4afff; border-color: #5a4a8b; background: #2b234b; }:root[data-theme="dark"] .calendar-leadership-activity.training { color: #8ae1bb; border-color: #356f60; background: #14372f; }
.leadership-home-event { width: 100%; margin-top: 6px; overflow: hidden; display: flex; align-items: center; justify-content: center; gap: 3px; color: #5683df !important; font-size: .49rem !important; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }.leadership-home-event .app-icon { width: .85em; height: .85em; }

@media (max-width: 1050px) { .leadership-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.leadership-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.leadership-row { grid-template-columns: 62px minmax(0, 1fr); }.leadership-actions { grid-column: 2; flex-wrap: wrap; } }
@media (max-width: 680px) { .leadership-summary-grid { display: flex; overflow-x: auto; margin-left: 0; margin-right: 0; padding: 0 0 5px; scroll-snap-type: x mandatory; }.leadership-summary-grid article { flex: 0 0 210px; min-height: 108px; padding: 18px; scroll-snap-align: start; }.leadership-summary-grid strong { font-size: 1.55rem; }.leadership-form-grid { grid-template-columns: 1fr; }.leadership-toolbar { align-items: center; flex-direction: row; gap: 10px; }.leadership-tabs { min-width: 0; flex: 1; }.leadership-tabs a { flex: 1; justify-content: center; padding: 0 8px; white-space: nowrap; }.leadership-toolbar .new-request-action { flex: 0 0 44px; width: 44px; height: 44px; min-height: 44px; padding: 0; gap: 0; border-radius: 12px; }.leadership-toolbar .new-request-action .new-request-icon { width: 100%; height: 100%; border-radius: inherit; background: transparent; font-size: 1.5rem; }.leadership-toolbar .new-request-action > span:last-child { display: none; }.leadership-notes { grid-column: auto; }.leadership-row { padding: 15px; grid-template-columns: 52px minmax(0, 1fr) 36px; align-items: start; gap: 11px; }.leadership-history .leadership-row { grid-template-columns: 52px minmax(0, 1fr); }.leadership-date { width: 50px; height: 55px; }.leadership-actions { grid-column: 3; grid-row: 1; flex-direction: column; gap: 7px; }.leadership-actions .leadership-row-icon { flex: 0 0 34px; width: 34px; height: 34px; min-height: 34px; }.leadership-form-panel > header, .leadership-agenda > header, .leadership-history > header { padding: 18px; }.leadership-form-grid { padding: 18px 18px 4px; }.leadership-form-grid label { min-width: 0; }.leadership-date-field input, .leadership-time-field input { width: 100%; max-width: 100%; inline-size: 100%; -webkit-appearance: none; appearance: none; }.leadership-form-panel .dialog-actions { padding: 16px 18px 20px; }.leadership-form-panel .dialog-actions .primary-action { width: auto; min-width: 145px; padding: 0 15px; font-size: .68rem; }.leadership-supervisors-compact { min-height: 60px; padding: 12px 15px; }.leadership-supervisors-compact small { font-size: .57rem; }.leadership-info-dialog, .leadership-actions-dialog { padding: 24px 20px; } }
@media (max-width: 680px) { .familiarization-details { padding: 19px; grid-template-columns: 1fr; }.familiarization-note { margin: 0 19px; }.familiarization-receipt { margin: 21px 19px 23px; align-items: stretch; flex-direction: column; }.familiarization-receipt .primary-action { width: 100%; }.leadership-copy > div { align-items: flex-start; flex-wrap: wrap; } }

.leadership-tabs { width: fit-content; padding: 4px; display: flex; gap: 4px; border: 1px solid var(--border); border-radius: 11px; background: var(--surface); }.leadership-tabs a { min-height: 34px; padding: 0 15px; display: flex; align-items: center; border-radius: 8px; color: var(--muted); font-size: .63rem; font-weight: 800; text-decoration: none; }.leadership-tabs a.active { color: #fff; background: var(--primary); }
.leadership-roster-page { display: flex; flex-direction: column; gap: 20px; }.roster-panel { overflow: hidden; }.roster-toolbar { padding: 18px 22px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--border); }.roster-toolbar > div { display: flex; align-items: center; gap: 13px; }.roster-toolbar h2 { min-width: 330px; margin: 3px 0 0; font-size: .94rem; text-transform: capitalize; }.roster-toolbar button:not(.secondary-button) { width: 35px; height: 35px; border: 1px solid var(--border); border-radius: 9px; color: var(--text); background: var(--surface-soft); font-size: 1.15rem; cursor: pointer; }.roster-toolbar-actions input { height: 37px; padding: 0 10px; border: 1px solid var(--border); border-radius: 9px; color: var(--text); background: var(--surface-soft); font-size: .64rem; font-weight: 750; }.roster-error { padding: 26px; color: #d55362; }
.roster-scroll { overflow: auto; }.leadership-roster-table { width: 100%; min-width: 1050px; border-collapse: separate; border-spacing: 0; table-layout: fixed; }.leadership-roster-table th, .leadership-roster-table td { border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); }.leadership-roster-table thead th { height: 64px; padding: 8px; color: var(--muted); background: var(--surface-soft); text-align: center; }.leadership-roster-table thead th span, .leadership-roster-table thead th small { display: block; font-size: .5rem; font-weight: 850; }.leadership-roster-table thead th strong { display: block; margin: 2px 0; color: var(--text); font-size: .86rem; }.leadership-roster-table th.today, .leadership-roster-table td.today { background: color-mix(in srgb, var(--primary-soft) 62%, var(--surface)); }.leadership-roster-table tbody td { height: 83px; padding: 8px; background: var(--surface); text-align: center; vertical-align: middle; }.leadership-roster-table tbody tr:last-child th, .leadership-roster-table tbody tr:last-child td { border-bottom: 0; }.leadership-roster-table tr > *:last-child { border-right: 0; }
.leadership-roster-table .roster-person-column { position: sticky; left: 0; z-index: 2; width: 225px; padding: 12px 16px; background: var(--surface); text-align: left; box-shadow: 8px 0 14px -14px rgba(15,35,65,.75); }.leadership-roster-table thead .roster-person-column { z-index: 3; background: var(--surface-soft); }.roster-person-column strong, .roster-person-column span { display: block; }.roster-person-column strong { overflow: hidden; font-size: .68rem; text-overflow: ellipsis; white-space: nowrap; }.roster-person-column span { margin-top: 5px; color: var(--muted); font-size: .53rem; font-weight: 650; }
.roster-shift { min-height: 58px; padding: 7px 5px; display: flex; align-items: center; justify-content: center; flex-direction: column; border-radius: 9px; color: #315fbd; background: #e9f0ff; }.roster-shift strong { font-size: .72rem; }.roster-shift span, .roster-shift small { width: 100%; margin-top: 3px; overflow: hidden; font-size: .47rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }.roster-shift.afternoon { color: #8b5215; background: #fff0df; }.roster-shift.night, .roster-shift.training { color: #6746c3; background: #eee9ff; }.roster-shift.free, .roster-shift.rest, .roster-shift.empty { color: #667085; background: #e9edf3; }.roster-shift.vacation, .roster-shift.holiday, .roster-shift.compensation { color: #137953; background: #e5f8ef; }.roster-shift.airground, .roster-shift.middle, .roster-shift.office, .roster-shift.oncall { color: #176f85; background: #e3f6f9; }.roster-shift.leave { color: #a63b46; background: #fff0f1; }
:root[data-theme="dark"] .roster-shift { color: #9abaff; background: #1b3159; }:root[data-theme="dark"] .roster-shift.afternoon { color: #f1b579; background: #49311d; }:root[data-theme="dark"] .roster-shift.night, :root[data-theme="dark"] .roster-shift.training { color: #c4afff; background: #302654; }:root[data-theme="dark"] .roster-shift.free, :root[data-theme="dark"] .roster-shift.rest, :root[data-theme="dark"] .roster-shift.empty { color: #b5c0d0; background: #293547; }:root[data-theme="dark"] .roster-shift.vacation, :root[data-theme="dark"] .roster-shift.holiday, :root[data-theme="dark"] .roster-shift.compensation { color: #8ae1bb; background: #153c33; }:root[data-theme="dark"] .roster-shift.airground, :root[data-theme="dark"] .roster-shift.middle, :root[data-theme="dark"] .roster-shift.office, :root[data-theme="dark"] .roster-shift.oncall { color: #8ed5e7; background: #173b45; }:root[data-theme="dark"] .roster-shift.leave { color: #ff9ba5; background: #472229; }
.roster-empty { color: var(--faint); font-size: .8rem; }.roster-footer { min-height: 46px; padding: 0 20px; display: flex; align-items: center; justify-content: space-between; gap: 16px; color: var(--muted); background: var(--surface-soft); font-size: .56rem; }
.roster-staffing-footer { min-height: 54px; padding: 7px 14px; justify-content: flex-start; gap: 12px; overflow: hidden; }
.roster-staffing-footer time { flex: 0 0 auto; color: var(--text); font-size: .62rem; font-weight: 800; text-transform: capitalize; }
.roster-staffing-counts { min-width: 0; display: flex; align-items: center; gap: 7px; overflow-x: auto; scrollbar-width: none; }
.roster-staffing-counts::-webkit-scrollbar { display: none; }
.roster-staffing-counts span { flex: 0 0 auto; padding: 6px 9px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface); color: var(--muted); white-space: nowrap; }
.roster-staffing-counts strong { margin-right: 3px; color: var(--accent); font-size: .7rem; }
@media (max-width: 800px) { .roster-toolbar { align-items: stretch; flex-direction: column; }.roster-toolbar > div { justify-content: space-between; }.roster-toolbar h2 { min-width: 0; font-size: .78rem; }.roster-toolbar-actions .secondary-button { flex: 1; }.leadership-roster-table { min-width: 930px; }.leadership-roster-table .roster-person-column { width: 185px; }.roster-footer:not(.roster-staffing-footer) { align-items: flex-start; flex-direction: column; justify-content: center; }.roster-staffing-footer { min-height: 52px; padding: 6px 10px; gap: 9px; }.roster-staffing-footer time { font-size: .58rem; }.roster-staffing-counts span { padding: 5px 7px; font-size: .52rem; } }

.personnel-variables-page { display: flex; flex-direction: column; gap: 20px; }
.personnel-variables-actions { display: flex; align-items: flex-end; gap: 12px; }
.personnel-variables-download { min-width: 158px; }
.personnel-variables-download:disabled { cursor: wait; opacity: .62; }
.personnel-variables-panel { overflow: hidden; }
.personnel-variables-header { min-height: 94px; padding: 20px 24px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--border); }
.personnel-variables-header h2 { margin: 4px 0 3px; font-size: 1.05rem; text-transform: capitalize; }
.personnel-variables-header p { margin: 0; color: var(--muted); font-size: .62rem; }
.personnel-variables-count { padding: 7px 11px; border-radius: 99px; color: #75a0ff; background: var(--primary-soft); font-size: .58rem; font-weight: 850; }
.personnel-variables-scroll { overflow: auto; }
.personnel-variables-table { width: 100%; min-width: 1570px; border-collapse: separate; border-spacing: 0; table-layout: fixed; }
.personnel-variables-table th, .personnel-variables-table td { height: 56px; padding: 8px 9px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); text-align: center; }
.personnel-variables-table thead th { height: 51px; color: var(--muted); background: var(--surface-soft); font-size: .54rem; font-weight: 850; line-height: 1.25; letter-spacing: .025em; }
.personnel-variables-table thead .variable-groups th:not(.variables-person-column) { height: 34px; color: var(--faint); font-size: .5rem; letter-spacing: .12em; text-transform: uppercase; }
.personnel-variables-table tbody td { color: var(--muted); background: var(--surface); font-size: .66rem; font-weight: 750; }
.personnel-variables-table tbody td strong { color: var(--text); font-size: .72rem; }
.personnel-variables-table tbody td.hours strong { color: #75a0ff; }
.personnel-variables-table tbody td small { font-size: .5rem; }
.personnel-variables-table tbody tr:hover td, .personnel-variables-table tbody tr:hover .variables-person-column { background: color-mix(in srgb, var(--primary-soft) 35%, var(--surface)); }
.personnel-variables-table tr > *:last-child { border-right: 0; }
.personnel-variables-table tbody tr:last-child > * { border-bottom: 0; }
.personnel-variables-table .variables-person-column { position: sticky; left: 0; z-index: 2; width: 235px; padding: 11px 16px; background: var(--surface); text-align: left; box-shadow: 8px 0 14px -14px rgba(15,35,65,.8); }
.personnel-variables-table thead .variables-person-column { z-index: 4; color: var(--muted); background: var(--surface-soft); }
.personnel-variables-table .variables-person-column strong, .personnel-variables-table .variables-person-column span { display: block; }
.personnel-variables-table .variables-person-column strong { overflow: hidden; color: var(--text); font-size: .67rem; text-overflow: ellipsis; white-space: nowrap; }
.personnel-variables-table .variables-person-column span { margin-top: 4px; overflow: hidden; color: var(--muted); font-size: .52rem; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.personnel-variables-footer { min-height: 46px; padding: 0 20px; display: flex; align-items: center; justify-content: space-between; gap: 16px; color: var(--muted); background: var(--surface-soft); font-size: .55rem; }
.personnel-variables-footer span:last-child { color: #55cf9f; font-weight: 850; }
.personnel-compensations-page { display: flex; flex-direction: column; gap: 20px; }
.compensation-heading { margin-bottom: 0; }
.compensation-as-of { padding: 8px 12px; border: 1px solid var(--border); border-radius: 10px; color: var(--muted); background: var(--surface); font-size: .6rem; font-weight: 750; }
.compensation-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.compensation-summary article { min-height: 112px; padding: 20px 22px; display: flex; flex-direction: column; justify-content: center; }
.compensation-summary span { color: var(--faint); font-size: .55rem; font-weight: 850; letter-spacing: .11em; }
.compensation-summary strong { margin: 7px 0 2px; color: var(--text); font-size: 1.65rem; line-height: 1; }
.compensation-summary small { color: var(--muted); font-size: .58rem; }
.personnel-compensations-panel { overflow: hidden; }
.personnel-compensations-scroll { overflow-x: auto; }
.personnel-compensations-table { width: 100%; min-width: 680px; border-collapse: collapse; table-layout: fixed; }
.personnel-compensations-table th, .personnel-compensations-table td { height: 64px; padding: 10px 20px; border-bottom: 1px solid var(--border); }
.personnel-compensations-table thead th { height: 45px; color: var(--faint); background: var(--surface-soft); font-size: .54rem; font-weight: 850; letter-spacing: .08em; text-align: left; text-transform: uppercase; }
.personnel-compensations-table thead th:nth-child(1) { width: 54%; }
.personnel-compensations-table thead th:nth-child(2) { width: 18%; text-align: center; }
.personnel-compensations-table thead th:nth-child(3) { width: 28%; }
.personnel-compensations-table tbody th { background: var(--surface); text-align: left; }
.personnel-compensations-table tbody th strong, .personnel-compensations-table tbody th span { display: block; }
.personnel-compensations-table tbody th strong { color: var(--text); font-size: .68rem; }
.personnel-compensations-table tbody th span { margin-top: 4px; color: var(--muted); font-size: .53rem; font-weight: 650; }
.personnel-compensations-table tbody td { color: var(--muted); background: var(--surface); font-size: .65rem; }
.personnel-compensations-table tbody td:nth-child(2) { text-align: center; }
.personnel-compensations-table tbody tr:hover > * { background: color-mix(in srgb, var(--primary-soft) 35%, var(--surface)); }
.personnel-compensations-table tbody tr:last-child > * { border-bottom: 0; }
.personnel-compensations-table tbody tr.without-credit { opacity: .68; }
.compensation-count { min-width: 31px; height: 31px; padding: 0 9px; display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 99px; color: var(--muted); background: var(--surface-soft); font: inherit; font-weight: 850; }
.compensation-count.available { color: #55cf9f; background: color-mix(in srgb, #29bd83 18%, transparent); cursor: pointer; transition: transform .16s ease, background .16s ease; }
.compensation-count.available:hover { transform: translateY(-1px); background: color-mix(in srgb, #29bd83 27%, transparent); }
.compensation-count.available:focus-visible { outline: 2px solid #55cf9f; outline-offset: 2px; }
.compensation-expiry { display: flex; flex-direction: column; gap: 3px; }
.compensation-expiry strong { color: var(--text); font-size: .67rem; }
.compensation-expiry small { color: var(--muted); font-size: .53rem; }
.compensation-expiry.soon strong, .compensation-expiry.soon small { color: #f3b84b; }
.compensation-no-expiry { color: var(--faint); }
.compensation-detail-dialog { width: min(100%, 560px); }
.compensation-detail-dialog .dialog-symbol { width: 48px; font-size: .72rem; letter-spacing: -.03em; }
.compensation-detail-dialog h2 { margin-bottom: 5px; }
.compensation-credit-list { max-height: min(52vh, 430px); margin-top: 21px; overflow-y: auto; display: grid; gap: 9px; }
.compensation-credit-list article { padding: 14px 16px; display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 13px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-soft); }
.compensation-credit-list article > div { display: flex; flex-direction: column; gap: 3px; }
.compensation-credit-list article > div:last-child { text-align: right; }
.compensation-credit-list span:not(.compensation-detail-arrow) { color: var(--faint); font-size: .49rem; font-weight: 850; letter-spacing: .1em; }
.compensation-credit-list strong { color: var(--text); font-size: .68rem; }
.compensation-credit-list small { color: var(--muted); font-size: .54rem; }
.compensation-detail-arrow { color: var(--primary); font-size: 1rem; }
@media (max-width: 800px) {
    .vacation-admin-actions { align-items: stretch; flex-direction: column; }
    .vacation-score-link, .vacation-back-link { width: 100%; }
    .vacation-admin-summary { display: flex; overflow-x: auto; margin-left: -16px; margin-right: -16px; padding: 0 16px 5px; }
    .vacation-admin-summary article { min-width: 180px; }
    .personnel-vacations-table { min-width: 760px; }
    .vacation-score-table { min-width: 650px; }
    .personnel-variables-page .variables-heading { align-items: stretch; }
    .personnel-variables-actions { align-items: stretch; flex-direction: column; }
    .personnel-variables-download { width: 100%; }
    .personnel-variables-header { align-items: flex-start; padding: 18px; }
    .personnel-variables-count { white-space: nowrap; }
    .personnel-variables-table { min-width: 1450px; }
    .personnel-variables-table .variables-person-column { width: 190px; }
    .personnel-variables-footer { align-items: flex-start; flex-direction: column; justify-content: center; padding: 12px 18px; }
    .compensation-summary { grid-template-columns: 1fr; }
    .compensation-heading { align-items: flex-start; }
    .admin-heading-actions .admin-variables-link, .admin-heading-actions .admin-vacations-link { display: none; }
}

/* Paleta operativa común: Inicio y Mi cuadrante */
.shift.morning, :root[data-theme="dark"] .shift.morning,
.calendar-assignment.morning, :root[data-theme="dark"] .calendar-assignment.morning { color: #242414; background: #feff93; }
.shift.afternoon, :root[data-theme="dark"] .shift.afternoon,
.calendar-assignment.afternoon, :root[data-theme="dark"] .calendar-assignment.afternoon { color: #10243a; background: #6897bb; }
.shift.night, :root[data-theme="dark"] .shift.night,
.calendar-assignment.night, :root[data-theme="dark"] .calendar-assignment.night { color: #fff; background: #794044; }
.shift.vacation, :root[data-theme="dark"] .shift.vacation,
.calendar-assignment.vacation, :root[data-theme="dark"] .calendar-assignment.vacation { color: #2d2100; background: #ffa500; }
.shift.compensation, :root[data-theme="dark"] .shift.compensation,
.calendar-assignment.compensation, :root[data-theme="dark"] .calendar-assignment.compensation { color: #2d2600; background: #ffd700; }
.shift.training, :root[data-theme="dark"] .shift.training,
.calendar-assignment.training, :root[data-theme="dark"] .calendar-assignment.training { color: #fff; background: #ec3b9d; }
.shift.holiday, :root[data-theme="dark"] .shift.holiday,
.calendar-assignment.holiday, :root[data-theme="dark"] .calendar-assignment.holiday { color: #fff; background: #41980a; }
.shift.temporary-leave, :root[data-theme="dark"] .shift.temporary-leave,
.calendar-assignment.temporary-leave, :root[data-theme="dark"] .calendar-assignment.temporary-leave { color: #fff; background: #136d15; }
.shift.leave, :root[data-theme="dark"] .shift.leave,
.calendar-assignment.leave, :root[data-theme="dark"] .calendar-assignment.leave { color: #343740; background: #d2d4dc; }
.shift.oncall, :root[data-theme="dark"] .shift.oncall,
.calendar-assignment.oncall, :root[data-theme="dark"] .calendar-assignment.oncall { color: #fff; background: #9e00c9; }
.shift.middle, :root[data-theme="dark"] .shift.middle,
.calendar-assignment.middle, :root[data-theme="dark"] .calendar-assignment.middle { color: #4a3424; background: #ffe4c4; }
.shift.office, .shift.airground,
:root[data-theme="dark"] .shift.office, :root[data-theme="dark"] .shift.airground,
.calendar-assignment.office, .calendar-assignment.airground,
:root[data-theme="dark"] .calendar-assignment.office, :root[data-theme="dark"] .calendar-assignment.airground { color: #19343d; background: #9bc1cd; }

.morning-dot, .schedule-legend i.morning { background: #feff93; }
.afternoon-dot, .schedule-legend i.afternoon-dot { background: #6897bb; }
.night-dot, .schedule-legend i.night-dot { background: #794044; }
.vacation-dot, .schedule-legend i.vacation-dot { background: #ffa500; }
.compensation-dot, .schedule-legend i.compensation-dot { background: #ffd700; }
.training-dot, .schedule-legend i.training-dot { background: #ec3b9d; }
.holiday-dot, .schedule-legend i.holiday-dot { background: #41980a; }
.temporary-leave-dot, .schedule-legend i.temporary-leave-dot { background: #136d15; }
.leave-dot, .schedule-legend i.leave-dot { background: #d2d4dc; }
.oncall-dot, .schedule-legend i.oncall-dot { background: #9e00c9; }
.middle-dot, .schedule-legend i.middle-dot { background: #ffe4c4; }
.office-dot, .schedule-legend i.office-dot { background: #9bc1cd; }
.free-dot, .schedule-legend i.free-dot { border: 1px solid #8d97a6; background: transparent; }
.shift-color-legend { row-gap: 9px; }
.schedule-legend i { flex: 0 0 auto; }

/* LL es un estado neutro: se muestra sin bloque de color. */
.shift.free, :root[data-theme="dark"] .shift.free { color: var(--muted); background: transparent; box-shadow: none; }
.calendar-assignment.free, :root[data-theme="dark"] .calendar-assignment.free { color: var(--muted); background: transparent; }
.admin-support-page { display: grid; gap: 1.5rem; }
.support-page-heading { display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.support-page-heading > div { min-width: 0; }
.support-page-heading .support-filters { flex: 0 0 auto; }
.support-filters { width: max-content; max-width: 100%; padding: 5px; display: flex; gap: 4px; border: 1px solid var(--border); border-radius: 15px; background: var(--surface); }
.support-filters button { min-width: 132px; padding: .72rem .9rem; display: inline-flex; align-items: center; justify-content: center; gap: .65rem; border: 0; border-radius: 11px; color: var(--muted); background: transparent; font: inherit; font-size: .83rem; font-weight: 800; cursor: pointer; }
.support-filters button:hover { color: var(--text); background: var(--surface-soft); }
.support-filters button.active { color: #fff; background: var(--primary); box-shadow: 0 8px 20px color-mix(in srgb, var(--primary) 22%, transparent); }
.support-filters b { min-width: 22px; height: 22px; padding: 0 6px; display: inline-flex; align-items: center; justify-content: center; border-radius: 99px; color: inherit; background: color-mix(in srgb, currentColor 12%, transparent); font-size: .7rem; }
.support-workspace { display: grid; grid-template-columns: minmax(260px, .75fr) minmax(0, 1.5fr); gap: 1.25rem; align-items: start; }
.support-inbox { padding: 0; overflow: hidden; }
.support-inbox > header { padding: 1.4rem 1.5rem 1rem; border-bottom: 1px solid var(--border); }
.support-inbox h2 { margin: .25rem 0 0; }
.support-ticket-button { width: 100%; border: 0; border-bottom: 1px solid var(--border); background: transparent; color: inherit; padding: 1rem 1.25rem; display: grid; grid-template-columns: 10px 1fr; gap: .8rem; text-align: left; cursor: pointer; }
.support-ticket-button:last-child { border-bottom: 0; }
.support-ticket-button:hover, .support-ticket-button.selected { background: var(--surface-soft); }
.support-ticket-button.selected { box-shadow: inset 3px 0 0 var(--primary); }
.support-ticket-button strong, .support-ticket-button small { display: block; }
.support-ticket-button small { margin-top: .35rem; color: var(--muted); }
.support-ticket-state { width: 9px; height: 9px; margin-top: .35rem; border-radius: 50%; background: #f0b84b; }
.support-ticket-state.answered { background: #35c98b; }
.support-ticket-state.replypending { background: #ef6b73; }
.support-ticket-state.inprogress { background: #5d93ff; }
.support-ticket-state.closed { background: #7e899a; }
.support-filter-empty { min-height: 150px; padding: 2rem 1.25rem; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .8rem; color: var(--muted); text-align: center; }
.support-filter-empty svg { width: 28px; height: 28px; color: var(--primary); }
.support-detail { padding: 0; overflow: hidden; }
.support-detail > header { padding: 1.5rem; display: flex; justify-content: space-between; gap: 1rem; border-bottom: 1px solid var(--border); }
.support-detail h2 { margin: .3rem 0 0; }
.support-ticket-controls { display: flex; align-items: center; align-self: flex-start; gap: .65rem; flex-wrap: wrap; justify-content: flex-end; }
.support-status-badge { min-height: 30px; padding: 6px 10px; display: inline-flex; align-items: center; justify-content: center; border-radius: 99px; font-size: .68rem; line-height: 1; font-weight: 850; white-space: nowrap; }
.support-status-badge.open { color: #d89624; background: color-mix(in srgb, #d89624 14%, var(--surface)); border: 1px solid color-mix(in srgb, #d89624 30%, var(--border)); }
.support-status-badge.inprogress { color: #77a3ff; background: color-mix(in srgb, #4f86f7 14%, var(--surface)); border: 1px solid color-mix(in srgb, #4f86f7 30%, var(--border)); }
.support-status-badge.closed { color: var(--muted); background: var(--surface-soft); border: 1px solid var(--border); }
.support-state-action { min-height: 34px; padding: 7px 11px; border: 1px solid var(--border); border-radius: 10px; color: var(--text); background: var(--surface-soft); font: inherit; font-size: .72rem; font-weight: 800; cursor: pointer; }
.support-state-action:hover { border-color: var(--primary); color: var(--primary); }
.support-state-action.close:hover { border-color: #e55763; color: #e55763; }
.support-state-action:disabled { opacity: .55; cursor: wait; }
.support-meta { padding: 1rem 1.5rem; display: flex; flex-wrap: wrap; gap: .55rem 1.25rem; color: var(--muted); border-bottom: 1px solid var(--border); }
.support-message { margin: 1.5rem; padding: 1.25rem; border-radius: 14px; background: var(--surface-soft); }
.support-message.reply { border-left: 3px solid #35c98b; }
.support-message > span, .support-reply > span { display: block; color: var(--muted); font-weight: 800; font-size: .75rem; letter-spacing: .12em; }
.support-message p { margin: .7rem 0 0; white-space: pre-wrap; }
.support-reply { display: block; margin: 1.5rem; }
.support-reply textarea { width: 100%; min-height: 145px; margin-top: .65rem; padding: 1rem; box-sizing: border-box; resize: vertical; border: 1px solid var(--border); border-radius: 14px; outline: none; color: var(--text); background: var(--surface-soft); font: inherit; line-height: 1.5; }
.support-reply textarea::placeholder { color: var(--muted); }
.support-reply textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 16%, transparent); }
.support-detail > .form-message { width: auto; max-width: none; margin: 0 1.5rem 1rem; box-sizing: border-box; overflow-wrap: anywhere; }
.support-closed-note { margin: 1.5rem; padding: 1rem 1.15rem; display: flex; align-items: center; gap: .85rem; border: 1px solid var(--border); border-radius: 14px; color: var(--muted); background: var(--surface-soft); }
.support-closed-note svg { width: 22px; height: 22px; color: #35c98b; }
.support-closed-note span, .support-closed-note strong, .support-closed-note small { display: block; }
.support-closed-note strong { color: var(--text); }
.support-closed-note small { margin-top: 3px; }
.support-detail .dialog-actions { padding: 0 1.5rem 1.5rem; }
.support-close-confirmation { max-width: 500px; }
.support-empty { padding: 3rem; text-align: center; }
.support-empty svg { width: 34px; height: 34px; color: var(--primary); }
@media (max-width: 800px) {
    .support-page-heading { align-items: stretch; flex-direction: column; gap: 1.25rem; }
    .support-filters { width: 100%; }
    .support-filters button { min-width: 0; flex: 1; }
    .support-workspace { grid-template-columns: 1fr; }
    .support-detail > header { align-items: flex-start; flex-direction: column; }
    .support-ticket-controls { width: 100%; justify-content: flex-start; }
}