:root {
    --bg: #f5f7fb;
    --card: #ffffff;
    --text: #172033;
    --muted: #667085;
    --border: #d9e1ec;
    --primary: #174ea6;
    --primary-dark: #123d82;
    --danger: #b42318;
    --success: #027a48;
    --warning: #b54708;
}

/* Keep section login links easy to scan and tap on narrow screens. */
.login-box > .login-public-links {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: 8px;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--border);
}
.login-public-links > .btn {
    display: flex !important;
    width: 100% !important;
    min-width: 0;
    min-height: 42px;
    padding: 8px 10px;
    justify-content: center;
    text-align: center;
    white-space: normal;
    line-height: 1.25;
    overflow-wrap: anywhere;
}
.login-public-links > .central-portal-login-link {
    grid-column: 1 / -1;
}
.login-public-links > .central-portal-login-link span {
    flex: 0 1 auto;
}
@media (max-width: 340px) {
    .login-box > .login-public-links { grid-template-columns: minmax(0, 1fr); }
    .login-public-links > .central-portal-login-link { grid-column: auto; }
}

/* Daily PA marking: deliberately compact for phone use. */
.page-daily-pa-marking .daily-pa-page { width: min(100%, 760px); margin: 0 auto; padding: 16px; }
.page-daily-pa-marking .daily-pa-header { display: grid; gap: 14px; margin-bottom: 14px; }
.page-daily-pa-marking .daily-pa-header h1 { margin: 0; font-size: clamp(24px, 7vw, 34px); }
.page-daily-pa-marking .daily-pa-date-form { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; gap: 8px; }
.page-daily-pa-marking .daily-pa-date-form input { min-width: 0; min-height: 46px; font-size: 16px; }
.page-daily-pa-marking .daily-pa-date-form .date-picker-wrap { min-width: 0; }
.page-daily-pa-marking .daily-pa-date-arrow { min-width: 44px; padding: 0; font-size: 29px; line-height: 1; }
.page-daily-pa-marking .daily-pa-list { display: grid; gap: 8px; }
.page-daily-pa-marking .daily-pa-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--card); scroll-margin-top: 18px; }
.page-daily-pa-marking .daily-pa-row.is-day-shift { background: #fff9dc; }
.page-daily-pa-marking .daily-pa-row.is-night-shift { background: #eaf5ff; }
.page-daily-pa-marking .daily-pa-row.is-pa { border-color: #e99067; background: #fff0e7; }
.page-daily-pa-marking .daily-pa-person { display: grid; min-width: 0; gap: 2px; }
.page-daily-pa-marking .daily-pa-person strong { color: var(--primary-dark); font-variant-numeric: tabular-nums; }
.page-daily-pa-marking .daily-pa-person span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; }
.page-daily-pa-marking .daily-pa-person small { color: var(--muted); font-size: 14px; font-weight: 700; }
.page-daily-pa-marking .daily-pa-person em { color: #a45021; font-size: 12px; font-style: normal; font-weight: 800; }
.page-daily-pa-marking .daily-pa-notice { margin-top: 4px; color: #25734a; font-size: 13px; font-weight: 800; }
.page-daily-pa-marking .daily-pa-row form { display: flex; align-items: center; gap: 8px; }
.page-daily-pa-marking .daily-pa-leave-type { min-width: 132px; min-height: 42px; padding: 6px 8px; font: inherit; font-size: 13px; }
.page-daily-pa-marking .daily-pa-action { min-width: 100px; min-height: 42px; white-space: nowrap; }
@media (max-width: 760px) {
    .job-card-filter-summary { width: 100%; white-space: normal; }
    .job-column-filter-menu { max-height: calc(100dvh - 16px); overflow: auto; }
}

@media (max-width: 460px) {
    .page-daily-pa-marking .daily-pa-page { padding: 12px; }
    .page-daily-pa-marking .daily-pa-date-form { grid-template-columns: 42px minmax(0, 1fr) 42px; }
    .page-daily-pa-marking .daily-pa-date-form button[type="submit"] { grid-column: 1 / -1; }
    .page-daily-pa-marking .daily-pa-row { align-items: stretch; flex-direction: column; }
    .page-daily-pa-marking .daily-pa-row form { width: 100%; }
    .page-daily-pa-marking .daily-pa-leave-type { flex: 1 1 auto; min-width: 0; }
    .page-daily-pa-marking .daily-pa-action { width: 100%; }
}


* { box-sizing: border-box; }

body {
    margin: 0;
    background: var(--bg);
    color: var(--text);
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.45;
}

a { color: var(--primary); text-decoration: none; }
a:hover { text-decoration: underline; }

.topbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    background: var(--primary);
    color: #fff;
    position: sticky;
    top: 0;
    z-index: 10;
}

.brand { font-weight: 800; font-size: 17px; }
.subbrand { font-size: 12px; opacity: .85; }

.navtabs {
    display: flex;
    gap: 8px;
    padding: 10px 12px;
    overflow-x: auto;
    background: #fff;
    border-bottom: 1px solid var(--border);
}

.navtabs a {
    white-space: nowrap;
    padding: 9px 12px;
    border-radius: 999px;
    background: #eef4ff;
    color: var(--primary);
    font-weight: 700;
    font-size: 14px;
}

.container {
    width: min(1120px, 100%);
    margin: 0 auto;
    padding: 16px;
}

.footer {
    text-align: center;
    padding: 22px 16px;
    color: var(--muted);
}

.card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 16px;
    margin-bottom: 16px;
    box-shadow: 0 10px 30px rgba(16,24,40,.05);
}

.card h1, .card h2, .card h3 { margin-top: 0; }

.grid {
    display: grid;
    gap: 14px;
}

.grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }

.stat {
    padding: 16px;
    border-radius: 18px;
    background: #fff;
    border: 1px solid var(--border);
}

.stat .number { font-size: 30px; font-weight: 900; }
.stat .label { color: var(--muted); font-size: 13px; }

.form-row {
    display: grid;
    gap: 12px;
    grid-template-columns: 1fr;
}

label {
    display: block;
    font-weight: 750;
    margin-bottom: 6px;
}

input, select, textarea {
    width: 100%;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 12px 13px;
    font: inherit;
    background: #fff;
}

input:focus, select:focus, textarea:focus {
    outline: 3px solid #dbeafe;
    border-color: var(--primary);
}

.help {
    display: block;
    color: var(--muted);
    font-size: 12px;
    margin-top: 5px;
}

.actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}

.btn, button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 14px;
    border-radius: 12px;
    border: 1px solid transparent;
    background: var(--primary);
    color: #fff;
    font-weight: 800;
    cursor: pointer;
    text-decoration: none;
}

.btn:hover, button:hover { background: var(--primary-dark); text-decoration: none; }
.btn-light { background: #fff; color: var(--primary); border-color: #fff; }
.btn-secondary { background: #eef4ff; color: var(--primary); border-color: #b8cdf8; }
.btn-danger { background: var(--danger); color: #fff; }
.btn-small { min-height: 34px; padding: 7px 10px; border-radius: 10px; font-size: 13px; }

.alert {
    border-radius: 14px;
    padding: 12px 14px;
    margin-bottom: 14px;
    border: 1px solid var(--border);
    background: #fff;
    font-weight: 700;
}
.alert-success { border-color: #a6f4c5; color: var(--success); background: #ecfdf3; }
.alert-error { border-color: #fecdca; color: var(--danger); background: #fef3f2; }
.alert-warning { border-color: #fedf89; color: var(--warning); background: #fffaeb; }

.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; min-width: 760px; }
th, td { padding: 11px 10px; border-bottom: 1px solid var(--border); text-align: left; vertical-align: top; }
th { background: #f8fafc; font-size: 13px; color: #344054; }

.badge {
    display: inline-flex;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
    background: #eef4ff;
    color: var(--primary);
}
.badge-inactive { background: #fef3f2; color: var(--danger); }

.profile-img {
    width: 96px;
    height: 120px;
    object-fit: cover;
    object-position: center top;
    border-radius: 14px;
    border: 1px solid var(--border);
    background: #eef2f7;
}

.kv {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
}
.kv div {
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: #fbfdff;
}
.kv strong { display: block; color: var(--muted); font-size: 12px; margin-bottom: 4px; }

.login-box {
    max-width: 430px;
    margin: 28px auto;
}

@media (min-width: 720px) {
    .container { padding: 24px; }
    .grid-2 { grid-template-columns: repeat(2, 1fr); }
    .grid-3 { grid-template-columns: repeat(3, 1fr); }
    .grid-4 { grid-template-columns: repeat(4, 1fr); }
    .form-row { grid-template-columns: repeat(2, 1fr); }
    .kv { grid-template-columns: repeat(2, 1fr); }
}

/* Phase 2 additions */
.text-success { color: var(--success); }
.text-danger { color: var(--danger); }
.text-muted { color: var(--muted); }
.inline-form { display: inline; }
.input-small { min-width: 92px; }
.entry-table textarea { min-width: 190px; }
.entry-table input.input-small { max-width: 96px; }
.entry-table select.input-small { max-width: 110px; }
.nowrap { white-space: nowrap; }

@media print {
    .topbar, .navtabs, .footer, .print-hide, .actions { display: none !important; }
    body { background: #fff; }
    .card { box-shadow: none; border: 1px solid #ccc; }
    table { min-width: 0; font-size: 12px; }
}

/* V36: compact shared header and drawer navigation for public and logged-in pages. */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.topbar.app-header {
    background: var(--primary-dark) !important;
    box-shadow: 0 5px 18px rgba(9, 35, 67, .22);
}
.app-header-inner {
    display: grid !important;
    grid-template-columns: 58px minmax(0, 1fr) auto;
    width: 100%;
    max-width: none;
    min-height: 82px;
    padding: 12px clamp(15px, 2.5vw, 42px);
    align-items: center;
    gap: 10px;
}
.header-home,
.nav-toggle {
    display: grid !important;
    width: 50px;
    height: 50px;
    min-height: 50px;
    padding: 0;
    place-items: center;
    border: 0;
    border-radius: 10px;
    color: #d8ffe5;
    background: transparent;
    box-shadow: none;
}
.header-home { justify-self: start; }
.header-home:hover,
.header-home:focus-visible,
.nav-toggle:hover,
.nav-toggle:focus-visible {
    color: #e6ffef;
    background: rgba(255, 255, 255, .1);
    box-shadow: none;
    transform: none;
}
.header-home svg { width: 41px; height: 41px; fill: currentColor; }
.header-section-name {
    min-width: 0;
    color: #fff;
    font-size: clamp(18px, 2.45vw, 42px);
    font-weight: 900;
    letter-spacing: .045em;
    line-height: 1.2;
    text-align: center;
    text-transform: uppercase;
    white-space: normal;
    overflow-wrap: anywhere;
}
.header-section-name:hover { color: #fff; text-decoration: underline; text-underline-offset: 5px; }
.header-section-name:focus-visible { outline: 2px solid #fff; outline-offset: 5px; border-radius: 4px; }
.nav-toggle {
    justify-self: end;
    gap: 6px;
    border: 0;
    border-radius: 10px;
}
.central-portal-header-link {
    display: inline-flex;
    min-width: 44px;
    min-height: 44px;
    padding: 6px 8px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 10px;
    color: #fff;
    background: rgba(255, 255, 255, .1);
    font-size: 12px;
    font-weight: 750;
    text-decoration: none;
    white-space: nowrap;
}
.central-portal-header-link:hover,
.central-portal-header-link:focus-visible {
    color: #fff;
    background: rgba(255, 255, 255, .2);
    text-decoration: none;
}
.central-portal-header-link img {
    display: block;
    width: 26px;
    height: 26px;
    object-fit: contain;
}
.central-portal-nav-link img {
    display: block;
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    object-fit: contain;
}
.central-portal-nav-link span { flex: 1 1 auto; }
.central-portal-login-link { display: inline-flex !important; align-items: center; gap: 8px; }
.central-portal-login-link img { width: 20px; height: 20px; object-fit: contain; }
.central-portal-login-link span { white-space: normal; }
.nav-toggle span { width: 39px; height: 6px; background: #d8ffe5; }
body.nav-open .nav-toggle span:nth-child(1) { transform: translateY(12px) rotate(45deg); }
body.nav-open .nav-toggle span:nth-child(2) { opacity: 0; }
body.nav-open .nav-toggle span:nth-child(3) { transform: translateY(-12px) rotate(-45deg); }

body.nav-open { overflow: hidden; }
.navtabs {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 100;
    display: flex;
    width: min(88vw, 380px);
    height: 100dvh;
    padding: 0 12px calc(18px + env(safe-area-inset-bottom)) !important;
    align-items: stretch;
    justify-content: flex-start;
    flex-direction: column;
    flex-wrap: nowrap !important;
    gap: 5px;
    overflow-x: hidden;
    overflow-y: auto;
    border: 0;
    background: #f8faff;
    box-shadow: -20px 0 60px rgba(15, 23, 42, .22);
    transform: translateX(110%);
    transition: transform .24s ease;
}
.navtabs.is-open { transform: translateX(0); }
.mobile-nav-head {
    position: sticky;
    top: 0;
    z-index: 2;
    display: flex;
    min-height: 72px;
    margin: 0 -12px 8px;
    padding: 13px 12px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-bottom: 1px solid #dce5f0;
    background: rgba(248, 250, 255, .97);
    backdrop-filter: blur(12px);
}
.mobile-nav-head > div { display: grid; min-width: 0; }
.mobile-nav-head strong { color: #17243a; font-size: 18px; }
.mobile-nav-head small { overflow: hidden; margin-top: 2px; color: #6a7890; text-overflow: ellipsis; white-space: nowrap; }
.nav-close {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    min-height: 42px;
    padding: 0;
    place-items: center;
    border: 1px solid #d5e0ee;
    border-radius: 12px;
    color: #30415c;
    background: #fff;
    box-shadow: none;
    font-size: 28px;
    font-weight: 400;
    line-height: 1;
}
.navtabs a {
    display: flex;
    width: 100%;
    min-height: 47px;
    padding: 10px 12px !important;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-start;
    border: 1px solid #e0e7f0;
    border-radius: 12px !important;
    color: #33445f;
    background: #fff;
    font-size: 14px;
}
.navtabs a.is-active,
.navtabs a[aria-current="page"] { color: #fff; border-color: transparent; }
.navtabs a.central-portal-nav-link { gap: 10px; }
.navtabs button.mobile-nav-logout {
    display: flex;
    width: 100%;
    min-height: 47px;
    padding: 10px 12px;
    align-items: center;
    justify-content: flex-start;
    margin: 0 0 5px;
    flex: 0 0 auto;
    border: 1px solid #f0c8c5;
    border-radius: 12px;
    color: #a62a21;
    border-color: #f0c8c5;
    background: #fff4f3;
    box-shadow: 0 6px 16px rgba(166, 42, 33, .08);
    font: inherit;
    cursor: pointer;
}
.nav-backdrop {
    position: fixed;
    inset: 0;
    z-index: 90;
    display: block;
    width: 100%;
    height: 100%;
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: rgba(15, 23, 42, .55);
    box-shadow: none;
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease;
}
.nav-backdrop:hover { transform: none; background: rgba(15, 23, 42, .55); box-shadow: none; }
body.nav-open .nav-backdrop { opacity: 1; pointer-events: auto; }

@media (max-width: 767px) {
    .app-header-inner { grid-template-columns: 46px minmax(0, 1fr) auto; min-height: 64px; padding: 8px 10px; }
    .header-home,
    .nav-toggle { width: 44px; height: 44px; min-height: 44px; border-radius: 9px; }
    .header-home svg { width: 34px; height: 34px; }
    .header-section-name { font-size: clamp(15px, 5vw, 22px); letter-spacing: .025em; }
    .nav-toggle { gap: 5px; }
    .central-portal-header-link { width: 40px; min-width: 40px; height: 40px; min-height: 40px; padding: 5px; }
    .central-portal-header-link img { width: 25px; height: 25px; }
    .central-portal-header-link span { display: none; }
    .nav-toggle span { width: 31px; height: 4px; }
    body.nav-open .nav-toggle span:nth-child(1) { transform: translateY(9px) rotate(45deg); }
    body.nav-open .nav-toggle span:nth-child(3) { transform: translateY(-9px) rotate(-45deg); }
}

.public-night-shift-history-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}
.public-night-shift-history-heading h2 { margin: 0; }
.public-night-shift-history-heading p { margin: 3px 0 0; }
.public-night-shift-history {
    max-height: min(58vh, 620px);
    margin-top: 12px;
    padding-right: 4px;
    overflow-y: auto;
}
.public-night-shift-week {
    margin: 0 0 9px;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 13px;
    background: #fbfdff;
}
.public-night-shift-week header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    color: #203650;
}
.public-night-shift-week header span { color: var(--muted); font-size: 12px; font-weight: 700; white-space: nowrap; }
.public-night-shift-week ol { margin: 9px 0 0; padding: 0; list-style: none; }
.public-night-shift-week li { padding: 4px 0; color: #34455f; }
.public-night-shift-week li > span { display: inline-block; width: 24px; color: var(--muted); font-variant-numeric: tabular-nums; }
.public-night-shift-pagination { margin-top: 12px; }
@media (max-width: 767px) {
    .public-night-shift-week { padding: 10px; }
    .public-night-shift-week header { align-items: flex-start; flex-direction: column; gap: 3px; }
}

/* Phase 2.1 daily bulk entry */
.copy-box {
    display: flex;
    gap: 6px;
    align-items: center;
    min-width: 135px;
}
.copy-box .input-small { max-width: 64px; }
.daily-bulk-table input { min-width: 120px; }
.daily-bulk-table td:nth-child(5) input { min-width: 220px; }
details summary {
    cursor: pointer;
    padding: 10px 0;
}
@media (max-width: 719px) {
    .daily-bulk-table { min-width: 980px; }
}

/* Phase 2.2 - Android-style mobile UI, date calendar picker, input masks */
body {
    background: linear-gradient(180deg, #eef4ff 0%, #f8fafc 260px, #f5f7fb 100%);
}

.topbar {
    box-shadow: 0 6px 22px rgba(23, 78, 166, .18);
}

.navtabs {
    position: sticky;
    top: 65px;
    z-index: 9;
    gap: 10px;
    scrollbar-width: none;
}
.navtabs::-webkit-scrollbar { display: none; }
.navtabs a {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    box-shadow: 0 2px 10px rgba(23, 78, 166, .08);
}

.card {
    border-radius: 22px;
    box-shadow: 0 12px 34px rgba(16, 24, 40, .07);
}

input, select, textarea {
    min-height: 48px;
    border-radius: 16px;
    font-size: 16px;
}

textarea { min-height: 72px; }

.btn, button {
    border-radius: 16px;
    min-height: 48px;
}

.page-daily-pa-marking .daily-pa-date-value { display:flex;align-items:center;gap:6px;min-width:0; }
.page-daily-pa-marking .daily-pa-weekday { flex:0 0 auto;font-size:13px;font-weight:750;color:var(--primary-dark); }
.page-daily-pa-marking .daily-pa-date-value .date-picker-wrap { flex:1;min-width:0; }
.date-picker-wrap .calendar-control { display:grid;place-items:center;position:relative;box-sizing:border-box;height:48px;min-height:44px;border:1px solid #9ab7c9;border-radius:10px;overflow:hidden;color:var(--primary); }
.date-picker-wrap .calendar-control::before { content:none!important;display:none!important; }
.date-picker-wrap .calendar-control svg { width:23px;height:23px;color:var(--primary);fill:none;stroke:currentColor;stroke-width:2;pointer-events:none; }
.date-picker-wrap .calendar-control input.calendar-native-input { position:absolute!important;inset:0!important;width:100%!important;min-width:0!important;height:100%!important;min-height:0!important;max-height:none!important;padding:0!important;margin:0!important;border:0!important;opacity:0!important;cursor:pointer;box-sizing:border-box; }
.date-picker-wrap .calendar-control input.calendar-native-input::-webkit-calendar-picker-indicator { position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;cursor:pointer; }
.date-picker-wrap .calendar-control:focus-within { outline:2px solid var(--primary);outline-offset:2px; }
.date-picker-wrap > input:not(.calendar-native-input) { min-width:0;width:100%;box-sizing:border-box; }

.date-picker-wrap {
    display: grid;
    grid-template-columns: 1fr 56px;
    gap: 8px;
    align-items: center;
}

.date-picker-wrap .native-date-picker {
    width: 56px;
    min-width: 56px;
    padding: 0;
    text-align: center;
    color: transparent;
    cursor: pointer;
    background: #eef4ff;
    border-color: #b8cdf8;
    position: relative;
}

.date-picker-wrap .native-date-picker::-webkit-calendar-picker-indicator {
    cursor: pointer;
    opacity: 1;
    width: 28px;
    height: 28px;
    margin: 0 auto;
}

.date-picker-wrap .native-date-picker::before {
    content: "📅";
    color: var(--primary);
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    font-size: 20px;
}

@media (max-width: 719px) {
    .container {
        padding: 12px;
    }

    .topbar {
        padding: 12px 14px;
        border-bottom-left-radius: 18px;
        border-bottom-right-radius: 18px;
    }

    .brand { font-size: 15px; }
    .subbrand { font-size: 11px; }

    .navtabs {
        top: 62px;
        padding: 10px 12px 12px;
        background: rgba(255,255,255,.96);
        backdrop-filter: blur(10px);
    }

    .card {
        padding: 14px;
        margin-bottom: 12px;
        border-radius: 22px;
    }

    .card h1 { font-size: 22px; }
    .card h2 { font-size: 18px; }

    .actions {
        display: grid;
        grid-template-columns: 1fr;
    }
    .actions .btn, .actions button { width: 100%; }

    .stat {
        border-radius: 20px;
        padding: 14px;
    }
    .stat .number {
        font-size: 24px;
        word-break: break-word;
    }

    .table-wrap {
        overflow-x: visible;
    }

    table.mobile-card-table,
    table.entry-table,
    table.daily-bulk-table {
        min-width: 0 !important;
        width: 100%;
        border-collapse: separate;
        border-spacing: 0 12px;
    }

    table.mobile-card-table thead,
    table.entry-table thead,
    table.daily-bulk-table thead {
        display: none;
    }

    table.mobile-card-table tbody,
    table.entry-table tbody,
    table.daily-bulk-table tbody,
    table.mobile-card-table tr,
    table.entry-table tr,
    table.daily-bulk-table tr,
    table.mobile-card-table td,
    table.entry-table td,
    table.daily-bulk-table td {
        display: block;
        width: 100%;
    }

    table.mobile-card-table tr,
    table.entry-table tr,
    table.daily-bulk-table tr {
        background: #fff;
        border: 1px solid var(--border);
        border-radius: 20px;
        padding: 10px;
        box-shadow: 0 8px 22px rgba(16, 24, 40, .06);
    }

    table.mobile-card-table td,
    table.entry-table td,
    table.daily-bulk-table td {
        border-bottom: 1px dashed #e5e7eb;
        padding: 10px 4px;
    }

    table.mobile-card-table td:last-child,
    table.entry-table td:last-child,
    table.daily-bulk-table td:last-child {
        border-bottom: 0;
    }

    table.mobile-card-table td::before,
    table.entry-table td::before,
    table.daily-bulk-table td::before {
        content: attr(data-label);
        display: block;
        color: var(--muted);
        font-size: 12px;
        font-weight: 800;
        margin-bottom: 5px;
        text-transform: uppercase;
        letter-spacing: .02em;
    }

    table.mobile-card-table td[data-label="Token No."],
    table.entry-table td[data-label="Token No."],
    table.daily-bulk-table td[data-label="Token No."] {
        font-size: 20px;
        color: var(--primary);
    }

    .daily-bulk-table input,
    .daily-bulk-table td:nth-child(5) input,
    .entry-table textarea,
    .entry-table input.input-small,
    .entry-table select.input-small {
        min-width: 0;
        max-width: none;
        width: 100%;
    }

    .copy-box {
        min-width: 0;
        display: grid;
        grid-template-columns: 1fr auto;
    }
    .copy-box .input-small { max-width: none; }
}

/* Phase 2.4 - Employee incentive compact day cards */
.day-card-list {
    display: grid;
    gap: 12px;
}

.day-card {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 22px;
    padding: 14px;
    box-shadow: 0 10px 28px rgba(16, 24, 40, .07);
}

.day-card-top {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 8px;
    align-items: center;
}

.day-card-date {
    font-size: 18px;
    font-weight: 900;
    color: var(--text);
}

.day-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    padding: 6px 10px;
    border-radius: 999px;
    background: #eef4ff;
    color: var(--primary);
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}

.day-pill-muted {
    background: #f1f5f9;
    color: #475569;
}

.day-pill-warning {
    background: #fff7ed;
    color: #c2410c;
}

.day-card-work {
    margin-top: 12px;
    padding: 12px;
    border-radius: 18px;
    background: #f8fafc;
    border: 1px dashed #dbe4f0;
}

.day-card-label {
    display: block;
    color: var(--muted);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .05em;
    margin-bottom: 5px;
}

.day-card-work-value {
    font-size: 16px;
    line-height: 1.35;
    color: var(--text);
    word-break: break-word;
}

.day-card-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin-top: 12px;
}

.day-mini-stat {
    border-radius: 18px;
    background: #f8fafc;
    border: 1px solid #e5eaf3;
    padding: 10px 8px;
    min-width: 0;
}

.day-mini-stat .mini-label {
    display: block;
    color: var(--muted);
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .04em;
    margin-bottom: 5px;
}

.day-mini-stat .mini-value {
    display: block;
    color: var(--text);
    font-size: 15px;
    font-weight: 900;
    white-space: nowrap;
}

.day-mini-stat .mini-value.text-danger,
.day-card .text-danger { color: #b42318; }
.day-mini-stat .mini-value.text-success,
.day-card .text-success { color: #027a48; }

@media (max-width: 380px) {
    .day-card { padding: 12px; }
    .day-card-top {
        grid-template-columns: 1fr 1fr;
    }
    .day-card-date {
        grid-column: 1 / -1;
    }
    .day-card-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .day-mini-stat .mini-value { font-size: 16px; }
}

@media (min-width: 720px) {
    .day-card-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* V55 - Total Earned, GA and primary Coach share one compact mobile row */
.page-daily-bulk-work .work-field-group {
    min-width: 0;
}
.page-daily-bulk-work .work-field-group > input,
.page-daily-bulk-work .work-field-group > select {
    width: 100%;
    min-width: 0;
}
.page-daily-bulk-work .work-field-label {
    display: none;
}

@media (max-width: 760px) {
    .page-daily-bulk-work .daily-entry-card {
        display: grid;
        grid-template-columns: repeat(12, minmax(0, 1fr));
        column-gap: 3px;
        row-gap: 5px;
    }
    .page-daily-bulk-work .daily-entry-head {
        grid-column: 1 / -1;
        grid-row: 1;
        margin-bottom: 0;
    }
    .page-daily-bulk-work .daily-entry-controls {
        display: contents;
    }
    .page-daily-bulk-work .daily-entry-controls > div:nth-child(1) {
        grid-column: 1 / 7;
        grid-row: 2;
    }
    .page-daily-bulk-work .daily-entry-controls > div:nth-child(2) {
        grid-column: 7 / 13;
        grid-row: 2;
    }
    .page-daily-bulk-work .daily-entry-controls > .daily-entry-metric:nth-child(3) {
        grid-column: 1 / 4;
        grid-row: 3;
    }
    .page-daily-bulk-work .daily-entry-controls > .daily-entry-metric:nth-child(4) {
        grid-column: 4 / 6;
        grid-row: 3;
    }
    .page-daily-bulk-work .daily-entry-metric {
        display: block;
        min-width: 0;
    }
    .page-daily-bulk-work .daily-entry-metric > label,
    .page-daily-bulk-work .work-line[data-line-index="0"] .work-field-label {
        display: block;
        min-height: 13px;
        margin: 0 0 2px;
        overflow: hidden;
        font-size: 10px;
        line-height: 1.15;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .page-daily-bulk-work .daily-entry-metric > .readonly-pill {
        min-height: 34px;
        padding: 4px 6px;
        font-size: 13px;
    }
    .page-daily-bulk-work .work-lines-wrap,
    .page-daily-bulk-work .work-lines,
    .page-daily-bulk-work .work-line[data-line-index="0"] {
        display: contents;
    }
    .page-daily-bulk-work .work-line[data-line-index="0"] .work-coach-group {
        grid-column: 6 / 13;
        grid-row: 3;
    }
    .page-daily-bulk-work .work-line[data-line-index="0"] .work-description-group {
        grid-column: 1 / 10;
        grid-row: 4;
    }
    .page-daily-bulk-work .work-line[data-line-index="0"] .work-hours-group {
        grid-column: 10 / 13;
        grid-row: 4;
    }
    .page-daily-bulk-work .work-line[data-line-index="0"] .remove-work-line {
        display: none !important;
    }
    .page-daily-bulk-work .work-line:not([data-line-index="0"]) {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: minmax(0, 1fr) 76px;
        grid-template-areas:
            "coach remove"
            "work earned";
        gap: 5px;
    }
    .page-daily-bulk-work .work-line:not([data-line-index="0"]) .work-coach-group { grid-area: coach; }
    .page-daily-bulk-work .work-line:not([data-line-index="0"]) .work-description-group { grid-area: work; }
    .page-daily-bulk-work .work-line:not([data-line-index="0"]) .work-hours-group { grid-area: earned; }
    .page-daily-bulk-work .work-line:not([data-line-index="0"]) .remove-work-line {
        grid-area: remove;
        width: 76px;
        min-width: 0;
    }
    .page-daily-bulk-work .work-hours-group input[data-line-field="earned"] {
        width: 100%;
        min-width: 0;
        padding-inline: 4px;
        text-align: center;
        font-variant-numeric: tabular-nums;
    }
    .page-daily-bulk-work .work-description-group input[data-line-field="work"] {
        font-size: 16px !important;
    }
    .page-daily-bulk-work .add-work-line,
    .page-daily-bulk-work .daily-entry-card-footer {
        grid-column: 1 / -1;
    }
    .page-daily-bulk-work .add-work-line {
        justify-self: start;
    }
}

/* V48: related navigation links grouped consistently for every role. */
body.portal-shell .nav-group {
    display: grid;
    width: 100%;
    margin: 2px 0 0;
    padding: 10px 0 0;
    flex: 0 0 auto;
    gap: 5px;
    border-top: 1px solid #dfe7f1;
}

body.portal-shell .nav-group:first-of-type {
    margin-top: 0;
    padding-top: 2px;
    border-top: 0;
}

body.portal-shell .nav-group-title {
    margin: 0 4px 1px;
    color: #6b7890;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .085em;
    line-height: 1.25;
    text-transform: uppercase;
}

body.portal-shell .nav-group-links {
    display: grid;
    width: 100%;
    gap: 5px;
}

body.portal-shell .navtabs a.is-danger:not(.is-active) {
    color: #a62a21;
    border-color: #efc8c5;
    background: #fff4f3;
}

body.portal-shell .navtabs a.is-danger:not(.is-active):hover,
body.portal-shell .navtabs a.is-danger:not(.is-active):focus-visible {
    color: #861b14;
    border-color: #e4a6a1;
    background: #ffe9e7;
}

@media print {
    body.portal-shell .nav-group {
        display: none !important;
    }
}

/* Phase 2.5 - status colours for incentive day cards and entry fields */
.day-card.day-card-holiday {
    background: #fff5f5;
    border-color: #fecaca;
}

.day-card.day-card-pa {
    background: #fff7ed;
    border-color: #fed7aa;
}

.day-card.day-card-idle {
    background: #fefce8;
    border-color: #fde68a;
}

.saved-work-autocomplete {
    position: absolute;
    z-index: 1400;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 5px;
    border: 2px solid var(--primary);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .22);
}

.saved-work-autocomplete[hidden] {
    display: none !important;
}

.saved-work-autocomplete-option {
    display: block;
    width: 100%;
    min-height: 40px;
    padding: 8px 10px;
    border: 0;
    border-radius: 8px;
    background: #fff;
    color: var(--text);
    font-size: 15px;
    font-weight: 800;
    line-height: 1.3;
    text-align: left;
    white-space: normal;
}

.saved-work-autocomplete-option:hover,
.saved-work-autocomplete-option:focus,
.saved-work-autocomplete-option.is-active {
    background: var(--primary);
    color: #fff;
    outline: none;
}

.saved-work-autocomplete-option + .saved-work-autocomplete-option {
    margin-top: 3px;
}

@media (max-width: 1024px) {
    body.portal-shell {
        -webkit-text-size-adjust: 100%;
        text-size-adjust: 100%;
    }
    .work-line input[data-line-field="work"] {
        font-size: 16px !important;
        touch-action: manipulation;
    }
}

.day-card-date-alert,
.day-pill-alert {
    color: #b42318 !important;
}

.day-pill-alert {
    background: #fee2e2;
}

.day-pill-shift {
    border: 1px solid transparent;
}

.shift-pill-day {
    background: #fef9c3;
    color: #854d0e;
    border-color: #fde68a;
}

.shift-pill-night {
    background: #dbeafe;
    color: #1d4ed8;
    border-color: #bfdbfe;
}

.day-pill-idle {
    background: #fef9c3;
    color: #854d0e;
}

input[readonly][data-zero-earned="1"] {
    background: #f1f5f9;
    color: #64748b;
    cursor: not-allowed;
}

.badge-warning {
    display: inline-block;
    padding: 4px 8px;
    border-radius: 999px;
    background: #fef9c3;
    color: #854d0e;
    font-size: 12px;
    font-weight: 900;
}

/* Phase 2.7 multiple coach/work-line entry */
.daily-entry-card-list {
    display: grid;
    gap: 14px;
}
.daily-entry-card {
    border: 3px solid #b8c8df;
    border-radius: 20px;
    background: #ffffff;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06);
    padding: 13px;
}
.daily-entry-head {
    display: grid;
    gap: 4px;
    margin-bottom: 10px;
}
.daily-entry-topline {
    display: flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
}
.daily-entry-identity {
    display: flex;
    align-items: center;
    flex: 0 1 auto;
    flex-wrap: nowrap;
    gap: 5px;
    min-width: 0;
}
.daily-entry-sequence {
    color: #52627a;
    font-size: 12px;
    font-weight: 850;
}
.daily-entry-token {
    display: inline-flex;
    min-height: 28px;
    padding: 3px 9px;
    align-items: center;
    border: 2px solid #f2b84b;
    border-radius: 9px;
    color: #6f3900;
    background: #fff0b8;
    box-shadow: 0 3px 8px rgba(181, 71, 8, .12);
    font-size: 15px;
    font-weight: 950;
    letter-spacing: .02em;
    white-space: nowrap;
}
.daily-entry-head .copy-box {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    min-width: 0;
    margin-left: auto;
    gap: 5px;
}
.daily-entry-head .copy-from-input {
    width: 48px;
    min-width: 48px;
    min-height: 32px;
    padding: 4px 5px;
    text-align: center;
}
.daily-entry-head .copy-card-btn {
    min-height: 32px;
    padding: 4px 8px;
    font-size: 12px;
    white-space: nowrap;
}
.daily-entry-name { line-height: 1.2; }
.save-entry-btn { white-space: nowrap; }
.save-return-focus {
    border-color: var(--primary) !important;
    outline: 4px solid rgba(var(--primary-rgb), .14);
    box-shadow: 0 14px 34px rgba(var(--primary-rgb), .18) !important;
}
.opening-balance-table .opening-balance-input {
    min-width: 130px;
    max-width: 170px;
}
.opening-balance-table tr { scroll-margin-top: 150px; }
.daily-entry-controls {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 10px;
}
.daily-entry-controls label {
    margin-bottom: 4px;
    font-size: 12px;
    line-height: 1.2;
}
.daily-entry-card input,
.daily-entry-card select {
    min-height: 40px;
    padding: 7px 10px;
    border-radius: 11px;
    font-size: 14px;
}
.daily-entry-card .btn-small {
    min-height: 38px;
    padding: 7px 10px;
}
.readonly-pill {
    min-height: 40px;
    display: flex;
    align-items: center;
    padding: 7px 10px;
    border-radius: 11px;
    background: #f4f7fb;
    font-weight: 800;
    color: #1e293b;
}
.work-lines-wrap {
    border-top: 1px dashed #dbe3ef;
    padding-top: 9px;
}
.dummy-hours-wrap {
    display: flex;
    align-items: end;
    gap: 12px;
    margin-top: 8px;
    padding: 10px;
    border: 1px dashed #8bb9c0;
    border-radius: 13px;
    background: #f0fafb;
}
.dummy-hours-wrap[hidden] { display: none !important; }
.dummy-hours-wrap .work-hours-group { flex: 0 0 130px; }
.dummy-hours-wrap small {
    color: var(--muted);
    line-height: 1.35;
}
.work-lines {
    display: grid;
    gap: 7px;
    margin-bottom: 7px;
}
.work-line {
    display: grid;
    grid-template-columns: minmax(130px, 180px) 1fr minmax(92px, 110px) auto;
    gap: 7px;
    align-items: center;
    padding: 7px;
    border-radius: 13px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}
.daily-entry-card-footer {
    display: flex;
    justify-content: flex-end;
    margin-top: 9px;
    padding-top: 9px;
    border-top: 1px solid #e2e8f0;
}
.daily-entry-card-footer .save-entry-btn { min-width: 220px; }
.sticky-save-bar {
    position: sticky;
    bottom: 8px;
    background: rgba(255,255,255,0.92);
    backdrop-filter: blur(8px);
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 10px;
    z-index: 10;
}
.daily-bulk-common-save {
    display: grid;
    flex: 1 1 320px;
    gap: 3px;
}
.daily-bulk-common-save button { width: 100%; }
.daily-bulk-common-save small {
    color: var(--muted);
    font-size: 11px;
    line-height: 1.3;
    text-align: center;
}
.employee-work-lines {
    display: grid;
    gap: 8px;
}
.employee-work-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 10px;
    border-radius: 14px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}
.employee-work-line strong {
    white-space: nowrap;
    color: #1d4ed8;
}
@media (max-width: 760px) {
    .daily-entry-card {
        border-radius: 18px;
        padding: 11px;
    }
    .daily-entry-topline { gap: 5px; }
    .daily-entry-sequence { font-size: 11px; }
    .daily-entry-token { min-height: 27px; padding: 3px 7px; font-size: 14px; }
    .daily-entry-head .copy-from-input { width: 43px; min-width: 43px; padding: 3px 4px; }
    .daily-entry-head .copy-card-btn { padding: 4px 7px; font-size: 11px; }
    .daily-entry-card-footer .save-entry-btn { width: 100%; min-width: 0; }
    .opening-balance-table .opening-balance-input { max-width: none; }
    .daily-entry-controls {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .work-line {
        grid-template-columns: 1fr;
    }
    .work-line .btn {
        width: 100%;
    }
}

/* Phase 2.8 - daily consolidated allotted work view */
.daily-work-view-list {
    display: grid;
    gap: 12px;
}
.daily-work-view-card {
    border: 1px solid #dbe3ef;
    border-radius: 22px;
    background: #ffffff;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06);
    padding: 16px;
}
.daily-work-view-top,
.daily-work-view-bottom {
    display: grid;
    grid-template-columns: minmax(0, 150px) minmax(0, 1fr);
    gap: 12px;
    align-items: start;
}
.daily-work-view-work {
    margin: 12px 0;
    padding: 12px;
    border-radius: 16px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}
.token-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 4px;
}
.token-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 4px 9px;
    border-radius: 999px;
    background: #eef2ff;
    color: #3730a3;
    font-size: 13px;
    font-weight: 900;
}
.earned-total-box {
    justify-self: end;
    min-width: 90px;
    text-align: right;
    padding: 8px 10px;
    border-radius: 14px;
    background: #ecfdf3;
    color: #027a48;
}
.earned-total-box strong { font-size: 18px; }
@media (max-width: 640px) {
    .daily-work-view-card { padding: 14px; border-radius: 20px; }
    .daily-work-view-top,
    .daily-work-view-bottom {
        grid-template-columns: 1fr;
    }
    .earned-total-box {
        justify-self: stretch;
        text-align: left;
    }
}

/* Phase 2.9 - one-day consolidated daily work card */
.daily-work-day-card {
    border: 1px solid #dbe3ef;
    border-radius: 24px;
    background: #ffffff;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
    padding: 18px;
    margin-bottom: 18px;
}
.daily-work-day-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-radius: 18px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    font-size: 18px;
}
.daily-work-day-head span {
    font-weight: 900;
    color: #475569;
}
.daily-work-status-lines,
.daily-work-consolidated-lines {
    display: grid;
    gap: 10px;
    margin-top: 12px;
}
.daily-work-status-row,
.daily-work-line-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
    padding: 12px 14px;
    border-radius: 18px;
    border: 1px solid #e2e8f0;
    background: #ffffff;
}
.daily-work-status-row.status-pa {
    background: #fff7ed;
    border-color: #fed7aa;
}
.daily-work-status-row.status-idle,
.daily-work-line-row.special-work-line {
    background: #fefce8;
    border-color: #fde68a;
}
.daily-work-line-row {
    background: #f8fafc;
}
.compact-token-chip-list {
    margin-top: 0;
}
@media (min-width: 720px) {
    .daily-work-status-row,
    .daily-work-line-row {
        grid-template-columns: 250px minmax(0, 1fr);
        align-items: center;
    }
}

/* Phase 2.10 - Android app style shell + month pagination */
body {
    background: linear-gradient(180deg, #eef4ff 0%, #f8fafc 28%, #ffffff 100%);
}
.app-header {
    position: sticky;
    top: 0;
    z-index: 30;
    backdrop-filter: blur(14px);
    background: rgba(255, 255, 255, 0.90) !important;
    border-bottom: 1px solid rgba(226, 232, 240, 0.95);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
}
.brand-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}
.brand-icon {
    width: 42px;
    height: 42px;
    border-radius: 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #1d4ed8;
    color: #ffffff;
    font-weight: 1000;
    box-shadow: 0 8px 18px rgba(29, 78, 216, 0.24);
    flex: 0 0 auto;
}
.topbar-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.navtabs {
    position: sticky;
    top: 68px;
    z-index: 25;
    background: rgba(248, 250, 252, 0.96);
    backdrop-filter: blur(12px);
    overflow-x: auto;
    flex-wrap: nowrap !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    border-bottom: 1px solid #e2e8f0;
}
.navtabs::-webkit-scrollbar { display: none; }
.navtabs a {
    white-space: nowrap;
    border-radius: 999px !important;
    padding: 10px 14px !important;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04);
}
.container {
    max-width: 980px;
}
.card,
.daily-work-day-card,
.day-card,
.daily-entry-card,
.stat {
    border-radius: 24px !important;
}
.card {
    border: 1px solid rgba(226, 232, 240, 0.95) !important;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.07) !important;
}
.app-title-card {
    background: linear-gradient(135deg, #ffffff 0%, #eff6ff 100%) !important;
}
.compact-filter-card {
    padding: 14px !important;
}
.month-title-pill {
    margin: 12px 0 16px;
    padding: 14px 16px;
    border-radius: 22px;
    background: #111827;
    color: #ffffff;
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    box-shadow: 0 14px 30px rgba(17, 24, 39, 0.16);
}
.month-title-pill span {
    color: #dbeafe;
    font-weight: 800;
}
.daily-month-list {
    display: grid;
    gap: 14px;
}
.daily-work-day-card {
    margin-bottom: 0;
}
.daily-work-day-head {
    position: relative;
}
.daily-work-sunday-card {
    background: #fff5f5 !important;
    border-color: #fecaca !important;
}
.daily-work-sunday-card .daily-work-day-head {
    background: #fee2e2 !important;
    border-color: #fecaca !important;
    color: #b42318;
}
.daily-work-empty-card {
    opacity: 0.82;
}
.empty-day-note {
    padding: 12px 14px;
    margin-top: 12px;
    background: #f8fafc;
    border: 1px dashed #cbd5e1;
    border-radius: 16px;
}
.month-pagination {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 10px;
    align-items: center;
    margin: 18px 0 8px;
    padding: 12px;
    border-radius: 22px;
    background: rgba(255,255,255,0.92);
    border: 1px solid #e2e8f0;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.06);
}
.month-pagination a:first-child,
.month-pagination .btn-disabled:first-child { justify-self: start; }
.month-pagination a:last-child,
.month-pagination .btn-disabled:last-child { justify-self: end; }
.month-pagination-current {
    font-weight: 1000;
    color: #0f172a;
    text-align: center;
    white-space: nowrap;
}
.btn-disabled {
    opacity: 0.45;
    pointer-events: none;
    background: #f1f5f9 !important;
    color: #64748b !important;
    border: 1px solid #e2e8f0 !important;
}
.btn-small {
    padding: 6px 10px !important;
    font-size: 12px !important;
    min-height: 34px !important;
}
@media (max-width: 720px) {
    .app-header {
        align-items: flex-start !important;
        gap: 10px;
        padding: 10px 12px !important;
    }
    .brand-icon { width: 38px; height: 38px; border-radius: 14px; }
    .brand { font-size: 15px !important; line-height: 1.2; }
    .subbrand { font-size: 11px !important; }
    .topbar-actions { width: 100%; justify-content: space-between; }
    .topbar-actions .btn { flex: 1; text-align: center; padding: 9px 10px !important; }
    .navtabs { top: 96px; padding: 8px 10px !important; }
    .container { padding: 12px !important; }
    .card { padding: 14px !important; margin-bottom: 12px !important; }
    .card h1 { font-size: 21px !important; }
    .card h2 { font-size: 17px !important; }
    .month-title-pill {
        flex-direction: column;
        align-items: flex-start;
        border-radius: 20px;
        padding: 13px 14px;
    }
    .daily-work-day-card { padding: 12px !important; border-radius: 22px !important; }
    .daily-work-day-head {
        display: grid;
        grid-template-columns: 1fr auto;
        gap: 8px;
        font-size: 16px;
    }
    .daily-work-day-head .btn-small {
        grid-column: 1 / -1;
        width: 100%;
    }
    .daily-work-status-row,
    .daily-work-line-row {
        padding: 11px 12px;
        border-radius: 16px;
    }
    .month-pagination {
        grid-template-columns: 1fr 1fr;
    }
    .month-pagination-current {
        grid-column: 1 / -1;
        grid-row: 1;
        margin-bottom: 4px;
    }
    .month-pagination a,
    .month-pagination .btn-disabled {
        width: 100%;
        text-align: center;
        justify-self: stretch !important;
    }
}

/* Phase 2.11 - compact daily allotted works search view */
.daily-work-search-form {
    display: grid;
    grid-template-columns: minmax(0, 220px) minmax(0, 1fr) auto;
    gap: 12px;
    align-items: end;
}
.daily-work-search-actions {
    margin-top: 0;
    align-items: end;
}
.compact-daily-month-list {
    gap: 10px;
}
.compact-day-card {
    padding: 12px !important;
    border-radius: 20px !important;
}
.compact-date-head {
    padding: 10px 12px !important;
    border-radius: 16px !important;
    font-size: 16px !important;
}
.compact-date-head > div {
    min-width: 0;
}
.daily-work-lines-plain {
    display: grid;
    gap: 0;
    margin-top: 8px;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    overflow: hidden;
    background: #ffffff;
}
.daily-work-plain-line {
    padding: 10px 12px;
    border-bottom: 1px solid #eef2f7;
    font-size: 15px;
    line-height: 1.35;
    word-break: break-word;
}
.daily-work-plain-line:last-child {
    border-bottom: 0;
}
.daily-work-plain-line strong {
    color: #0f172a;
}
.daily-work-plain-line span {
    color: #334155;
    font-weight: 700;
}
.daily-work-plain-line.status-pa {
    background: #fff7ed;
}
.daily-work-plain-line.status-idle,
.daily-work-plain-line.special-work-line {
    background: #fefce8;
}
@media (max-width: 720px) {
    .daily-work-search-form {
        grid-template-columns: 1fr;
    }
    .daily-work-search-actions {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
    }
    .compact-date-head {
        grid-template-columns: 1fr auto !important;
    }
    .daily-work-plain-line {
        font-size: 14px;
        padding: 9px 10px;
    }
}

/* Master Admin / limited-admin permission manager */
.permission-manager,
.permission-groups,
.admin-permission-editor,
.admin-permission-groups {
    display: grid;
    gap: 12px;
}
.permission-manager-toolbar,
.admin-permission-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px 12px;
    padding: 10px;
    border: 1px solid #cbdced;
    border-radius: 14px;
    background: #f4f8fc;
}
.permission-manager-summary {
    display: flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
    color: #42536a;
    font-size: 13px;
    font-weight: 750;
}
.admin-permission-toolbar > div:first-child {
    min-width: min(100%, 260px);
}
.admin-permission-toolbar h3 {
    margin: 0 0 2px;
    font-size: 16px;
}
.admin-permission-toolbar p {
    margin: 0;
    font-size: 12px;
    line-height: 1.35;
}
.permission-count-pill,
[data-permission-selected-count],
#permissionSelectedCount {
    display: inline-grid;
    min-width: 28px;
    min-height: 28px;
    place-items: center;
    padding: 3px 8px;
    border-radius: 999px;
    color: #fff;
    background: var(--primary);
    font-size: 13px;
    font-weight: 900;
    line-height: 1;
}
.permission-toolbar-actions,
.permission-group-actions,
.admin-permission-toolbar-actions,
.admin-permission-group-head .actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.permission-manager-toolbar [data-permission-action],
.permission-group-actions [data-permission-action],
.admin-permission-toolbar [data-permission-action],
.admin-permission-group-head [data-permission-group-action] {
    width: auto;
    min-height: 34px;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    line-height: 1.1;
    box-shadow: none;
}
.permission-manager-toolbar [data-permission-action][aria-pressed="true"],
.permission-group-actions [data-permission-action][aria-pressed="true"],
.admin-permission-toolbar [data-permission-action][aria-pressed="true"],
.admin-permission-group-head [data-permission-group-action][aria-pressed="true"] {
    border-color: rgba(var(--primary-rgb), .34);
    background: rgba(var(--primary-rgb), .1);
    color: var(--primary-dark);
}
.permission-group,
.admin-permission-group {
    overflow: hidden;
    border: 2px solid #d7e2ef;
    border-radius: 16px;
    background: #fff;
    transition: border-color .16s ease, box-shadow .16s ease;
}
.permission-group.has-selection,
.admin-permission-group.has-selection {
    border-color: rgba(var(--primary-rgb), .42);
}
.permission-group.is-fully-selected,
.admin-permission-group.is-fully-selected {
    box-shadow: 0 0 0 3px rgba(var(--primary-rgb), .07);
}
.permission-group-head,
.admin-permission-group-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 11px;
    border-bottom: 1px solid #dce7f2;
    background: #f5f8fc;
}
.permission-group-heading,
.admin-permission-group-head > div:first-child {
    min-width: 0;
}
.permission-group-title,
.admin-permission-group-head h3 {
    display: block;
    margin: 0;
    color: #17243a;
    font-size: 15px;
    font-weight: 900;
    line-height: 1.2;
}
.permission-group-description {
    display: block;
    margin-top: 2px;
    color: #617189;
    font-size: 12px;
    line-height: 1.3;
}
[data-permission-group-count] {
    color: var(--primary-dark);
    font-size: 11px;
    font-weight: 900;
    white-space: nowrap;
}
.permission-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 7px;
    padding: 9px;
}
.check-card {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    align-items: center;
    gap: 9px;
    min-height: 46px;
    padding: 8px 10px;
    border: 2px solid #dbe5f1;
    border-radius: 12px;
    background: #fbfdff;
    margin: 0;
    cursor: pointer;
    transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease;
}
.check-card:hover {
    border-color: rgba(var(--primary-rgb), .45);
    background: #f6faff;
}
.check-card:focus-within {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(var(--primary-rgb), .13);
}
.check-card.is-selected,
.check-card:has(input:checked) {
    border-color: rgba(var(--primary-rgb), .58);
    background: rgba(var(--primary-rgb), .075);
}
.check-card input {
    width: 19px;
    height: 19px;
    min-height: 0;
    margin: 0;
    accent-color: var(--primary);
    flex: 0 0 auto;
}
.check-card > span,
.check-card .permission-card-copy {
    min-width: 0;
}
.check-card > span,
.permission-card-title {
    color: #17243a;
    font-size: 13px;
    font-weight: 850;
    line-height: 1.25;
}
.check-card > span strong {
    display: block;
    font: inherit;
}
.check-card > span .help {
    display: block;
    margin-top: 2px;
    color: #68778d;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.3;
}
.permission-card-description {
    display: block;
    margin-top: 2px;
    color: #68778d;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.3;
}
.permission-locked-panel {
    padding: 11px;
    border: 1px solid #efd39b;
    border-radius: 14px;
    background: #fffaf0;
}
.permission-locked-panel h3 {
    margin: 0 0 3px;
    color: #684817;
    font-size: 15px;
}
.permission-locked-panel > p {
    margin: 0 0 8px;
    color: #765c32;
    font-size: 12px;
}
.permission-locked-list {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
    padding: 0;
    margin: 0;
    list-style: none;
}
.permission-locked-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-height: 36px;
    padding: 7px 9px;
    border: 1px solid #eadbbd;
    border-radius: 10px;
    color: #5c4930;
    background: rgba(255, 255, 255, .72);
    font-size: 12px;
    font-weight: 800;
}
.permission-locked-badge {
    flex: 0 0 auto;
    padding: 3px 7px;
    border-radius: 999px;
    color: #79551b;
    background: #fae9be;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.admin-permission-fixed-scopes {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 9px;
}
.admin-permission-fixed {
    padding: 10px 11px;
    border: 1px solid #ceddeb;
    border-radius: 13px;
    background: #f6f9fc;
}
.admin-permission-fixed.is-always {
    border-color: #b9dfd2;
    background: #f0fbf7;
}
.admin-permission-fixed.is-locked {
    border-color: #efd39b;
    background: #fffaf0;
}
.admin-permission-fixed h3 {
    margin: 0 0 3px;
    font-size: 14px;
}
.admin-permission-fixed p {
    margin: 0 0 7px;
    font-size: 11px;
}
.admin-permission-fixed ul {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    padding: 0;
    margin: 0;
    list-style: none;
}
.admin-permission-fixed li {
    padding: 4px 7px;
    border: 1px solid rgba(87, 111, 140, .18);
    border-radius: 999px;
    background: rgba(255, 255, 255, .78);
    font-size: 10px;
    font-weight: 800;
    line-height: 1.2;
}
.admin-permission-fixed.is-locked li {
    color: #6e4d1c;
    border-color: #ead6ae;
}
.admin-user-list {
    display: grid;
    gap: 12px;
}
.admin-user-card {
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 14px;
    background: #fff;
}
.admin-user-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}
.permission-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 6px;
}
@media (min-width: 720px) {
    .permission-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .permission-locked-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .admin-permission-fixed-scopes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
    .permission-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Weekly night-shift list module */
.night-shift-top-grid {
    align-items: start;
}
.night-shift-template-thumb {
    display: block;
    width: min(100%, 340px);
    max-height: 480px;
    object-fit: contain;
    margin: 12px 0 16px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #f8fafc;
}
.night-shift-empty-template {
    display: grid;
    place-items: center;
    min-height: 180px;
    margin: 12px 0 16px;
    padding: 18px;
    border: 1px dashed #b91c1c;
    border-radius: 12px;
    color: #475569;
    background: #fff;
    text-align: center;
}
.night-shift-help-card ol {
    margin: 0;
    padding-left: 22px;
    line-height: 1.65;
}
.night-shift-week-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
    max-width: 760px;
    margin-bottom: 20px;
}
.night-shift-week-grid input[readonly] {
    color: #334155;
    background: #eef2f7;
    cursor: default;
}
.night-shift-picker {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: 16px;
    margin-top: 22px;
}
.night-shift-available,
.night-shift-selected {
    min-width: 0;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: #f8fafc;
    overflow: hidden;
}
.night-shift-picker-heading {
    display: grid;
    gap: 10px;
    padding: 14px;
    border-bottom: 1px solid var(--border);
    background: #fff;
}
.night-shift-picker-heading h3,
.night-shift-picker-heading p {
    margin: 0;
}
.night-shift-employee-list,
.night-shift-selected-list {
    display: grid;
    gap: 8px;
    max-height: none;
    padding: 12px;
    overflow: visible;
}
.night-shift-employee-option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    padding: 11px 12px;
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    color: #0f172a;
    background: #fff;
    text-align: left;
    cursor: pointer;
}
.night-shift-employee-option:hover:not(:disabled) {
    border-color: var(--primary);
    background: #eff6ff;
}
.night-shift-employee-option.is-selected {
    opacity: .62;
    cursor: default;
}
.night-shift-employee-option strong,
.night-shift-employee-option small,
.night-shift-selected-label strong,
.night-shift-selected-label small {
    display: block;
}
.night-shift-employee-option small,
.night-shift-selected-label small {
    margin-top: 3px;
    color: #64748b;
}
.night-shift-add-label {
    flex: 0 0 auto;
    font-weight: 800;
    color: var(--primary);
}
.night-shift-selected-row {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    padding: 11px;
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    background: #fff;
}
.night-shift-sequence {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    color: #fff;
    background: var(--primary);
    font-weight: 900;
}
.night-shift-selected-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    grid-column: 2;
}
.night-shift-empty-selection,
.night-shift-no-result {
    padding: 24px 12px;
    text-align: center;
    color: #64748b;
}
.night-shift-card-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}
.night-shift-card-head h2,
.night-shift-card-head p {
    margin-top: 0;
}
.night-shift-output-preview {
    display: block;
    width: min(100%, 720px);
    margin: 20px auto 0;
    border: 1px solid var(--border);
    box-shadow: 0 12px 36px rgba(15, 23, 42, .12);
    background: #fff;
}
.night-shift-history-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 12px;
}
.night-shift-history-card {
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: #fff;
}
.night-shift-history-title {
    margin-bottom: 6px;
    font-weight: 900;
}

@media (min-width: 880px) {
    .night-shift-week-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .night-shift-picker {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }
    .night-shift-picker-heading {
        min-height: 98px;
    }
}

@media (max-width: 560px) {
    .night-shift-selected-row {
        grid-template-columns: 38px minmax(0, 1fr);
    }
    .night-shift-selected-actions {
        grid-column: 1 / -1;
    }
    .night-shift-selected-actions .btn {
        flex: 1 1 auto;
    }
}

/* Night shift scheduler: phone-first workflow */
body.night-shift-page {
    background: #eef3f9;
}
body.night-shift-page .container {
    width: min(100%, 1040px);
    padding: 10px;
}
body.night-shift-page .card {
    border-radius: 18px !important;
    padding: 14px !important;
    margin-bottom: 12px !important;
}
.night-shift-page-header {
    overflow: hidden;
    background: linear-gradient(140deg, #ffffff 0%, #edf5ff 100%) !important;
}
.night-shift-page-header h1 {
    margin: 3px 0 5px;
    font-size: clamp(21px, 5vw, 30px);
    line-height: 1.15;
}
.night-shift-page-header p {
    max-width: 720px;
    margin: 0;
    color: #526174;
}
.night-shift-eyebrow {
    display: block;
    color: var(--primary);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.night-shift-help-card {
    padding: 0 !important;
}
.night-shift-help-card summary {
    padding: 14px;
    color: #22324a;
    font-weight: 850;
    cursor: pointer;
}
.night-shift-help-card[open] summary {
    border-bottom: 1px solid var(--border);
}
.night-shift-help-card ol {
    margin: 0;
    padding: 13px 20px 16px 38px;
}
.night-shift-editor-card {
    padding: 12px !important;
}
.night-shift-editor-title {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}
.night-shift-editor-title h2 {
    margin: 3px 0 0;
    font-size: 20px;
    line-height: 1.2;
}
.night-shift-week-pill {
    flex: 0 0 auto;
    padding: 6px 9px;
    border-radius: 999px;
    color: #174ea6;
    background: #e8f1ff;
    border: 1px solid #c8dcff;
    font-size: 11px;
    font-weight: 900;
}
.night-shift-step-card {
    padding: 12px;
    border: 1px solid #cfe0f7;
    border-radius: 16px;
    background: linear-gradient(150deg, #f8fbff 0%, #eef6ff 100%);
}
.night-shift-step-heading {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}
.night-shift-step-heading h3,
.night-shift-step-heading p {
    margin: 0;
}
.night-shift-step-heading h3 {
    font-size: 16px;
    line-height: 1.25;
}
.night-shift-step-heading p {
    margin-top: 2px;
    color: #64748b;
    font-size: 12px;
}
.night-shift-step-number {
    display: grid;
    flex: 0 0 30px;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 10px;
    color: #fff;
    background: var(--primary);
    box-shadow: 0 6px 14px rgba(23, 78, 166, .2);
    font-weight: 900;
}
.night-shift-week-grid {
    gap: 11px;
    max-width: none;
    margin: 14px 0 0;
}
.night-shift-week-grid label {
    margin-bottom: 5px;
    color: #24344c;
    font-size: 13px;
}
.night-shift-week-input {
    min-height: 52px;
    padding: 12px;
    border-color: #bfd1e8;
    color: #0f172a;
    background: #fff;
    font-size: 16px;
    font-weight: 800;
}
.night-shift-week-input::-webkit-datetime-edit {
    padding: 0;
}
.night-shift-week-grid .night-shift-week-end {
    color: #334155;
    background: #e9f0f8;
    opacity: 1;
}
.night-shift-week-end::-webkit-calendar-picker-indicator {
    display: none;
}
.night-shift-week-summary {
    display: grid;
    gap: 2px;
    margin-top: 11px;
    padding: 10px 12px;
    border-radius: 12px;
    background: #0f2749;
    color: #fff;
}
.night-shift-week-summary span {
    color: #b8d3fa;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .07em;
    text-transform: uppercase;
}
.night-shift-week-summary strong {
    font-size: 13px;
}
.night-shift-employee-step-heading {
    margin: 18px 2px 10px;
}
.night-shift-picker {
    gap: 12px;
    margin-top: 0;
}
.night-shift-available {
    order: 2;
}
.night-shift-selected {
    order: 1;
}
.night-shift-available,
.night-shift-selected {
    border-radius: 15px;
}
.night-shift-picker-heading {
    min-height: 0;
    gap: 8px;
    padding: 12px;
}
.night-shift-picker-heading h3 {
    font-size: 16px;
}
.night-shift-employee-list,
.night-shift-selected-list {
    max-height: none;
    gap: 8px;
    padding: 10px;
}
.night-shift-employee-option {
    min-height: 62px;
    padding: 10px;
    border-radius: 13px;
}
.night-shift-employee-option strong,
.night-shift-selected-label strong {
    font-size: 13px;
    line-height: 1.25;
}
.night-shift-employee-option small,
.night-shift-selected-label small {
    font-size: 11px;
    line-height: 1.3;
}
.night-shift-add-label {
    padding: 7px 10px;
    border-radius: 999px;
    background: #e8f1ff;
    font-size: 12px;
}
.night-shift-empty-selection,
.night-shift-no-result {
    padding: 18px 10px;
}
.night-shift-save-bar {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    bottom: max(6px, env(safe-area-inset-bottom));
    margin-top: 12px;
    padding: 9px;
    border-radius: 16px;
    background: rgba(255, 255, 255, .96);
}
.night-shift-save-count {
    display: flex;
    grid-column: 1 / -1;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 0 3px;
}
.night-shift-save-count strong {
    color: #172033;
    font-size: 12px;
}
.night-shift-save-count span {
    color: #64748b;
    font-size: 10px;
}
.night-shift-save-bar button,
.night-shift-save-bar .btn {
    width: 100%;
    min-height: 50px;
}
.night-shift-preview-dialog {
    width: min(94vw, 880px);
    max-width: 880px;
    max-height: 94vh;
    padding: 0;
    overflow: auto;
    border: 0;
    border-radius: 18px;
    background: #eef3f9;
    box-shadow: 0 24px 80px rgba(15, 23, 42, .3);
}
.night-shift-preview-dialog::backdrop {
    background: rgba(15, 23, 42, .72);
    backdrop-filter: blur(3px);
}
.night-shift-preview-head {
    position: sticky;
    top: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--border);
    background: rgba(255, 255, 255, .97);
}
.night-shift-preview-head h3 {
    margin: 2px 0 0;
}
.night-shift-preview-status {
    margin: 14px;
    padding: 18px;
    border: 1px solid #cfe0f7;
    border-radius: 14px;
    color: #24406d;
    background: #fff;
    text-align: center;
    font-weight: 800;
}
#nightShiftPreviewImage {
    display: block;
    width: calc(100% - 20px);
    height: auto;
    margin: 10px auto;
    border: 1px solid var(--border);
    background: #fff;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .12);
}
#nightShiftPreviewImage[hidden] {
    display: none;
}
.night-shift-preview-downloads {
    position: sticky;
    bottom: 0;
    z-index: 2;
    margin: 0;
    padding: 10px;
    border-top: 1px solid var(--border);
    background: rgba(255, 255, 255, .97);
}
#nightShiftPreviewJpeg,
#nightShiftShareJpeg,
#night-shift-preview-card .actions > a,
.night-shift-history-details .actions > a {
    gap: 6px;
}
#nightShiftPreviewJpeg svg,
#nightShiftShareJpeg svg,
#night-shift-preview-card .actions > a svg,
.night-shift-history-details .actions > a svg {
    flex: 0 0 auto;
}
.night-shift-history-grid {
    grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 640px) {
    body.night-shift-page .container {
        padding: 18px;
    }
    body.night-shift-page .card {
        padding: 18px !important;
    }
    .night-shift-editor-card {
        padding: 18px !important;
    }
    .night-shift-week-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .night-shift-save-bar {
        grid-template-columns: minmax(190px, 1fr) repeat(3, auto);
        align-items: center;
    }
    .night-shift-save-count {
        grid-column: auto;
    }
    .night-shift-save-bar button,
    .night-shift-save-bar .btn {
        width: auto;
    }
    .night-shift-history-grid {
        grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    }
}

@media (min-width: 880px) {
    .night-shift-available {
        order: 1;
    }
    .night-shift-selected {
        order: 2;
    }
    .night-shift-employee-list,
    .night-shift-selected-list {
        max-height: none;
        overflow: visible;
    }
}

@media (max-width: 390px) {
    body.night-shift-page .container {
        padding: 7px !important;
    }
    body.night-shift-page .card,
    .night-shift-editor-card {
        border-radius: 15px !important;
        padding: 11px !important;
    }
    .night-shift-editor-title {
        display: block;
    }
    .night-shift-week-pill {
        display: inline-flex;
        margin-top: 8px;
    }
    .night-shift-step-card {
        padding: 10px;
    }
    .night-shift-save-count span {
        display: none;
    }
}

/* Mobile-first full portal refresh - V5 */
:root {
    --bg: #f3f6fb;
    --card: #ffffff;
    --text: #142033;
    --muted: #607089;
    --border: #dce5f0;
    --primary: #2457b8;
    --primary-dark: #173f91;
    --primary-soft: #eaf1ff;
    --accent: #5b5ce2;
    --danger: #b42318;
    --success: #067647;
    --warning: #b54708;
    --shadow-sm: 0 4px 14px rgba(20, 32, 51, .055);
    --shadow-md: 0 14px 38px rgba(20, 32, 51, .085);
}

html {
    min-width: 0;
    overflow-x: hidden;
    scroll-behavior: smooth;
}

body.portal-shell {
    min-width: 0;
    min-height: 100vh;
    overflow-x: hidden;
    background:
        radial-gradient(circle at 5% 0%, rgba(var(--primary-rgb), .12), transparent 28rem),
        linear-gradient(180deg, var(--primary-soft) 0, var(--bg) 26rem, var(--bg) 100%);
    color: var(--text);
    font-size: 15px;
}

.skip-link {
    position: fixed;
    top: 8px;
    left: 8px;
    z-index: 200;
    padding: 10px 14px;
    border-radius: 10px;
    color: #fff;
    background: #0f172a;
    transform: translateY(-150%);
}
.skip-link:focus { transform: translateY(0); }

.topbar.app-header {
    position: sticky;
    top: 0;
    z-index: 60;
    display: block;
    padding: 0;
    color: #fff;
    background: linear-gradient(115deg, var(--primary-dark) 0%, var(--primary) 58%, var(--accent) 100%) !important;
    border: 0;
    border-radius: 0;
    box-shadow: 0 10px 30px rgba(var(--primary-rgb), .2);
    backdrop-filter: none;
}

.app-header-inner {
    display: flex;
    width: min(100%, 1280px);
    min-height: 70px;
    margin: 0 auto;
    padding: 11px 20px;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.brand-wrap {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 11px;
    color: #fff;
    text-decoration: none;
}
.brand-wrap:hover { color: #fff; text-decoration: none; }
.brand-icon {
    display: grid;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 14px;
    color: #fff;
    background: rgba(255, 255, 255, .15);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18), 0 7px 18px rgba(6, 24, 62, .18);
    font-size: 16px;
    font-weight: 950;
    letter-spacing: -.03em;
}
.brand-icon-logo {
    padding: 4px;
    overflow: hidden;
    background: rgba(255, 255, 255, .94);
}
.brand-icon-logo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 9px;
}
.brand-copy { display: grid; min-width: 0; }
.brand {
    overflow: hidden;
    color: #fff;
    font-size: 16px;
    font-weight: 850;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.subbrand {
    overflow: hidden;
    margin-top: 3px;
    color: rgba(255, 255, 255, .78);
    font-size: 11px;
    font-weight: 650;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.topbar-actions {
    display: flex;
    width: auto;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;
}
.user-chip {
    display: grid;
    max-width: 230px;
    padding: 7px 11px;
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 13px;
    background: rgba(9, 30, 75, .16);
    line-height: 1.15;
}
.user-chip-name {
    overflow: hidden;
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.user-chip-role { margin-top: 3px; color: #dbe8ff; font-size: 10px; font-weight: 700; }
.nav-toggle {
    display: none;
    width: 44px;
    height: 44px;
    min-height: 44px;
    padding: 10px;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    gap: 5px;
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: 13px;
    background: rgba(255, 255, 255, .14);
    box-shadow: none;
}
.nav-toggle:hover { background: rgba(255, 255, 255, .22); }
.nav-toggle span {
    display: block;
    height: 2px;
    border-radius: 999px;
    background: #fff;
    transition: transform .2s ease, opacity .2s ease;
}
body.nav-open .nav-toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
body.nav-open .nav-toggle span:nth-child(2) { opacity: 0; }
body.nav-open .nav-toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.navtabs {
    position: sticky;
    top: 70px;
    z-index: 45;
    display: flex;
    min-width: 0;
    padding: 9px max(14px, calc((100vw - 1240px) / 2));
    align-items: center;
    justify-content: center;
    flex-wrap: wrap !important;
    gap: 6px;
    overflow: visible;
    border-bottom: 1px solid rgba(207, 219, 234, .9);
    background: rgba(250, 252, 255, .94);
    box-shadow: var(--shadow-sm);
    backdrop-filter: blur(14px);
}
.navtabs a {
    display: inline-flex;
    min-height: 38px;
    padding: 8px 11px !important;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 11px !important;
    color: #46566f;
    background: transparent;
    box-shadow: none;
    font-size: 12px;
    font-weight: 780;
    line-height: 1.1;
}
.navtabs a:hover {
    color: var(--primary-dark);
    background: #edf3ff;
    border-color: #d5e2fb;
    text-decoration: none;
}
.navtabs a.is-active,
.navtabs a[aria-current="page"] {
    color: #fff;
    background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
    border-color: transparent;
    box-shadow: 0 7px 16px rgba(var(--primary-rgb), .2);
}
.mobile-nav-head,
.mobile-nav-logout,
.nav-backdrop { display: none; }
.mobile-nav-logout-form { width: 100%; margin: 0; }
.navtabs button.mobile-nav-logout { display: none; }

.container {
    width: min(100%, 1240px);
    max-width: none;
    margin: 0 auto;
    padding: 24px 20px 34px;
}

.footer {
    padding: 22px 16px calc(22px + env(safe-area-inset-bottom));
    color: #718198;
    font-weight: 650;
}

.card,
.stat,
.day-card,
.daily-entry-card,
.daily-work-day-card,
.admin-user-card {
    border-color: rgba(211, 222, 236, .95);
}
.card {
    padding: 20px;
    border-radius: 20px !important;
    box-shadow: var(--shadow-md) !important;
}
main > .card:first-child,
.app-title-card {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, #ffffff 0%, #eef4ff 100%) !important;
}
main > .card:first-child::after,
.app-title-card::after {
    position: absolute;
    top: -55px;
    right: -55px;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    background: rgba(74, 92, 210, .08);
    content: "";
    pointer-events: none;
}
main > .card:first-child > *,
.app-title-card > * { position: relative; z-index: 1; }
.card h1,
.card h2,
.card h3 { color: #17243a; letter-spacing: -.025em; }
.card h1 { margin-bottom: 7px; font-size: clamp(23px, 3vw, 31px); line-height: 1.15; }
.card h2 { margin-bottom: 10px; font-size: clamp(18px, 2vw, 22px); line-height: 1.2; }
.card > p:last-child { margin-bottom: 0; }

.stat {
    min-width: 0;
    padding: 17px;
    border-radius: 18px !important;
    background: linear-gradient(145deg, #fff 0%, #f8faff 100%);
    box-shadow: var(--shadow-sm);
}
.stat .number {
    overflow-wrap: anywhere;
    color: #172a4a;
    font-size: clamp(22px, 3vw, 29px);
    line-height: 1.15;
}
.stat .label { margin-top: 5px; color: #6a7890; font-weight: 700; }

.incentive-date-order-head {
    display: flex;
    margin-bottom: 14px;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}
.incentive-date-order-head h2 { margin-bottom: 4px; }
.incentive-date-order-head .help { margin: 0; }
.incentive-date-order-pill {
    display: inline-flex;
    min-height: 38px;
    padding: 8px 12px;
    flex: 0 0 auto;
    align-items: center;
    border: 1px solid #cbdaf7;
    border-radius: 999px;
    color: var(--primary-dark);
    background: var(--primary-soft);
    font-size: 13px;
    font-weight: 800;
    white-space: nowrap;
}

input,
select,
textarea {
    min-width: 0;
    min-height: 48px;
    border-color: #cfdbea;
    border-radius: 13px;
    color: #152238;
    background: #fff;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, .025);
}
input:hover,
select:hover,
textarea:hover { border-color: #b7c8df; }
input:focus,
select:focus,
textarea:focus {
    outline: 3px solid rgba(var(--primary-rgb), .13);
    border-color: var(--primary);
    box-shadow: 0 0 0 1px var(--primary);
}
input:disabled,
input[readonly],
select:disabled,
textarea:disabled { color: #526174; background: #eef2f7; opacity: 1; }
input[data-line-field="work"] {
    text-transform: uppercase;
    letter-spacing: .01em;
}
label { color: #263650; font-size: 13px; }
.help,
.text-muted,
.muted { color: var(--muted); }

.btn,
button {
    min-height: 46px;
    border-radius: 13px;
    background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
    box-shadow: 0 6px 14px rgba(var(--primary-rgb), .14);
    font-size: 14px;
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn:hover,
button:hover { transform: translateY(-1px); box-shadow: 0 9px 18px rgba(var(--primary-rgb), .18); }
.btn:active,
button:active { transform: translateY(0); }
.btn-secondary {
    color: var(--primary-dark);
    background: var(--primary-soft);
    border-color: var(--border);
    box-shadow: none;
}
.btn-secondary:hover { color: var(--primary-dark); background: var(--primary-soft); }
.btn-light { color: var(--primary-dark); background: #fff; box-shadow: none; }
.btn-danger { background: linear-gradient(135deg, #b42318 0%, #d13b2d 100%); }
.btn-light:hover,
.btn-light:focus-visible {
    background: #e7f0ff;
    border-color: #b7cbed;
    color: var(--primary-dark);
}
.btn-danger:hover,
.btn-danger:focus-visible {
    background: linear-gradient(135deg, #8f1e15 0%, #b92f24 100%);
    color: #fff;
}
.btn-small { min-height: 38px !important; padding: 7px 11px !important; }
.actions { align-items: center; }
.actions > form { margin: 0; }
.inline-actions { margin-top: 0; }

.alert { border-radius: 14px; box-shadow: var(--shadow-sm); }
.badge { line-height: 1.25; }
.badge-active { color: var(--success); background: #ecfdf3; }

.table-wrap {
    width: 100%;
    border: 1px solid #dce5f0;
    border-radius: 15px;
    overflow-x: auto;
    background: #fff;
}
table { color: #263650; }
th {
    padding: 12px 11px;
    color: #4d5d75;
    background: #f3f6fb;
    font-size: 12px;
    letter-spacing: .015em;
    text-transform: uppercase;
}
td { padding: 12px 11px; overflow-wrap: anywhere; }
tbody tr:last-child td { border-bottom: 0; }

.profile-img {
    width: 112px;
    height: 140px;
    border-radius: 18px;
    box-shadow: var(--shadow-sm);
}
.kv div { border-color: #dce5f0; background: linear-gradient(145deg, #fff, #f8faff); }

.login-box {
    width: min(100%, 450px);
    margin: clamp(22px, 7vh, 70px) auto;
}
.page-login .container,
.page-change-password .container { width: min(100%, 720px); }
.page-login .login-box form > div + div,
.page-change-password .login-box form > div + div { margin-top: 14px !important; }

.sticky-save-bar {
    bottom: max(8px, env(safe-area-inset-bottom));
    border-color: rgba(197, 212, 232, .95);
    box-shadow: 0 12px 34px rgba(15, 23, 42, .15);
}

@media (min-width: 768px) {
    .grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .form-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }

    .page-employees .form-row {
        grid-template-columns: minmax(260px, 1.5fr) minmax(170px, .7fr) auto;
        align-items: end;
    }
    .page-employees .form-row .actions,
    .page-coaches .form-row .actions { margin-top: 0; }
    .page-coaches .form-row {
        grid-template-columns: repeat(3, minmax(170px, 1fr)) auto;
        align-items: end;
    }
    .page-reports .form-row {
        grid-template-columns: repeat(3, minmax(180px, 1fr));
    }
    .page-reports .form-row .actions { grid-column: 1 / -1; }

    .card,
    .stat,
    .daily-entry-card,
    .day-card,
    .admin-user-card { transition: border-color .2s ease, box-shadow .2s ease; }
    .card:hover,
    .stat:hover { border-color: #c6d5e8; }
}

@media (max-width: 767px) {
    body.portal-shell { font-size: 14px; }
    body.nav-open { overflow: hidden; }

    .app-header-inner {
        min-height: 64px;
        padding: 9px 11px;
        gap: 8px;
    }
    .brand-wrap { gap: 8px; }
    .brand-icon {
        flex-basis: 38px;
        width: 38px;
        height: 38px;
        border-radius: 12px;
        font-size: 14px;
    }
    .brand { max-width: 49vw; font-size: 14px !important; }
    .subbrand { max-width: 49vw; font-size: 10px !important; }
    .topbar-actions { width: auto; gap: 7px; }
    .user-chip { display: none; }
    .nav-toggle { display: inline-flex; flex: 0 0 44px; }

    .navtabs {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        z-index: 100;
        display: flex;
        width: min(88vw, 360px);
        height: 100dvh;
        padding: 0 12px calc(18px + env(safe-area-inset-bottom)) !important;
        align-items: stretch;
        justify-content: flex-start;
        flex-direction: column;
        flex-wrap: nowrap !important;
        gap: 5px;
        overflow-x: hidden;
        overflow-y: auto;
        border: 0;
        background: #f8faff;
        box-shadow: -20px 0 60px rgba(15, 23, 42, .22);
        transform: translateX(110%);
        transition: transform .24s ease;
    }
    .navtabs.is-open { transform: translateX(0); }
    .mobile-nav-head {
        position: sticky;
        top: 0;
        z-index: 2;
        display: flex;
        min-height: 72px;
        margin: 0 -12px 8px;
        padding: 13px 12px;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        border-bottom: 1px solid #dce5f0;
        background: rgba(248, 250, 255, .97);
        backdrop-filter: blur(12px);
    }
    .mobile-nav-head > div { display: grid; min-width: 0; }
    .mobile-nav-head strong { color: #17243a; font-size: 18px; }
    .mobile-nav-head small {
        overflow: hidden;
        margin-top: 2px;
        color: #6a7890;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .nav-close {
        display: grid;
        flex: 0 0 42px;
        width: 42px;
        height: 42px;
        min-height: 42px;
        padding: 0;
        place-items: center;
        border: 1px solid #d5e0ee;
        border-radius: 12px;
        color: #30415c;
        background: #fff;
        box-shadow: none;
        font-size: 28px;
        font-weight: 400;
        line-height: 1;
    }
    .navtabs a {
        display: flex;
        width: 100%;
        min-height: 47px;
        padding: 10px 12px !important;
        flex: 0 0 auto;
        align-items: center;
        justify-content: flex-start;
        border: 1px solid #e0e7f0;
        border-radius: 12px !important;
        color: #33445f;
        background: #fff;
        font-size: 14px;
    }
    .navtabs a.is-active,
    .navtabs a[aria-current="page"] { color: #fff; border-color: transparent; }
    .navtabs button.mobile-nav-logout {
        display: flex;
        margin: 0 0 5px;
        flex: 0 0 auto;
        color: #a62a21;
        border-color: #f0c8c5;
        background: #fff4f3;
        box-shadow: 0 6px 16px rgba(166, 42, 33, .08);
    }
    .nav-backdrop {
        position: fixed;
        inset: 0;
        z-index: 90;
        display: block;
        width: 100%;
        height: 100%;
        min-height: 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: rgba(15, 23, 42, .55);
        box-shadow: none;
        opacity: 0;
        pointer-events: none;
        transition: opacity .2s ease;
    }
    .nav-backdrop:hover { transform: none; background: rgba(15, 23, 42, .55); box-shadow: none; }
    body.nav-open .nav-backdrop { opacity: 1; pointer-events: auto; }

    .container { padding: 12px 10px 26px !important; }
    .footer { padding-top: 15px; font-size: 11px; }
    .card {
        padding: 15px !important;
        margin-bottom: 11px !important;
        border-radius: 17px !important;
        box-shadow: 0 8px 24px rgba(20, 32, 51, .07) !important;
    }
    .card h1 { font-size: 22px !important; }
    .card h2 { font-size: 18px !important; }

    .grid { gap: 9px; }
    .grid-2 { grid-template-columns: 1fr; }
    .grid-3,
    .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .stat { padding: 13px; border-radius: 15px !important; }
    .stat .number { font-size: 20px; }
    .stat .label { font-size: 11px; }

    .form-row { gap: 10px; }
    label { margin-bottom: 5px; }
    input,
    select,
    textarea { min-height: 50px; font-size: 16px; }
    .date-picker-wrap { grid-template-columns: minmax(0, 1fr) 54px; }
    .date-picker-wrap .native-date-picker { width: 54px; min-width: 54px; }

    .actions {
        display: grid;
        width: 100%;
        grid-template-columns: minmax(0, 1fr);
        gap: 8px;
    }
    .actions > .btn,
    .actions > button,
    .actions > form,
    .actions > form > button,
    .actions > form > .btn { width: 100%; }
    .actions > form { display: grid; gap: 8px; }
    .actions.inline-actions {
        display: flex;
        flex-wrap: wrap;
    }
    .actions.inline-actions > .btn,
    .actions.inline-actions > button,
    .actions.inline-actions > form { width: auto; flex: 1 1 110px; }
    .actions.inline-actions > form > button { width: 100%; }

    .table-wrap {
        border: 0;
        border-radius: 0;
        overflow: visible;
        background: transparent;
    }
    table.mobile-card-table {
        width: 100%;
        min-width: 0 !important;
        border-collapse: separate;
        border-spacing: 0 10px;
    }
    table.mobile-card-table thead { display: none; }
    table.mobile-card-table tbody,
    table.mobile-card-table tr,
    table.mobile-card-table td { display: block; width: 100%; }
    table.mobile-card-table tr {
        margin: 0;
        padding: 7px 11px;
        overflow: hidden;
        border: 1px solid #d9e3ef;
        border-radius: 15px;
        background: #fff;
        box-shadow: var(--shadow-sm);
    }
    table.mobile-card-table td {
        display: grid;
        padding: 9px 0;
        grid-template-columns: minmax(92px, 38%) minmax(0, 1fr);
        align-items: start;
        gap: 10px;
        border-bottom: 1px dashed #e2e8f0;
        text-align: left;
    }
    table.mobile-card-table td::before {
        display: block;
        margin: 0;
        color: #68778e;
        content: attr(data-label);
        font-size: 10px;
        font-weight: 850;
        letter-spacing: .035em;
        line-height: 1.4;
        text-transform: uppercase;
    }
    table.mobile-card-table td:last-child { border-bottom: 0; }
    table.mobile-card-table td[colspan] {
        display: block;
        padding: 14px 2px;
        color: #607089;
        text-align: center;
    }
    table.mobile-card-table td[colspan]::before { display: none; }
    table.mobile-card-table td[data-label="Action"] .btn,
    table.mobile-card-table td[data-label="Actions"] .btn,
    table.mobile-card-table td[data-label="Action"] button,
    table.mobile-card-table td[data-label="Actions"] button { width: 100%; }
    table.mobile-card-table td[data-label="Action"],
    table.mobile-card-table td[data-label="Actions"] {
        grid-template-columns: minmax(0, 1fr);
    }
    table.mobile-card-table td input,
    table.mobile-card-table td select,
    table.mobile-card-table td textarea { width: 100%; max-width: none; }

    .daily-entry-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
    .daily-entry-card { padding: 12px; border-radius: 17px; }
    .daily-entry-head { gap: 9px; }
    .work-line { grid-template-columns: minmax(0, 1fr); }
    .work-line .btn { width: 100%; }
    .sticky-save-bar { padding: 9px; border-radius: 15px; }

    .month-title-pill { margin: 10px 0; border-radius: 17px; }
    .month-pagination { padding: 9px; border-radius: 16px; }
    .day-card-metrics { gap: 6px; }
    .day-mini-stat { padding: 9px 7px; border-radius: 14px; }

    .profile-img { width: 96px; height: 120px; }
    .permission-grid { gap: 8px; }
    .check-card { min-height: 50px; }
    .admin-user-head { align-items: center; }

    .login-box { margin-top: 18px; }
    .page-login .topbar.app-header .app-header-inner,
    .page-change-password:not([class*="role-"]) .topbar.app-header .app-header-inner { justify-content: center; }
}

@media (max-width: 420px) {
    .brand { max-width: 57vw; }
    .subbrand { max-width: 57vw; }
    .navtabs { width: 92vw; }
    .card { padding: 13px !important; }
    .stat { padding: 11px; }
    .stat .number { font-size: 18px; }
    .daily-entry-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .day-card-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .incentive-date-order-head { display: grid; gap: 9px; }
    .incentive-date-order-pill { width: fit-content; max-width: 100%; white-space: normal; }
    .month-pagination { grid-template-columns: 1fr 1fr; }
}

/* Master Admin site settings */
.settings-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}
.settings-hero > div:first-child { min-width: 0; }
.settings-hero p { max-width: 780px; margin-bottom: 0; color: var(--muted); }
.settings-install-badge,
.install-detected-card {
    display: grid;
    min-width: 260px;
    gap: 3px;
    padding: 13px 15px;
    border: 1px solid var(--border);
    border-radius: 15px;
    color: var(--primary-dark);
    background: var(--primary-soft);
}
.settings-install-badge span,
.install-detected-card span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.settings-install-badge strong,
.install-detected-card strong { overflow-wrap: anywhere; }
.settings-section { scroll-margin-top: 92px; }
.settings-section-head {
    display: flex;
    margin-bottom: 18px;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}
.settings-section-head > div { display: flex; align-items: center; gap: 10px; }
.settings-section-head h2 { margin: 0; }
.settings-section-head p { max-width: 520px; margin: 2px 0 0; color: var(--muted); text-align: right; }
.settings-step {
    display: inline-grid;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    place-items: center;
    border-radius: 11px;
    color: #fff;
    background: linear-gradient(135deg, var(--primary), var(--accent));
    font-size: 11px;
    font-weight: 900;
}
.settings-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.settings-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.settings-branding-grid,
.settings-theme-layout {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}
.branding-upload-card {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    align-items: center;
    gap: 14px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 17px;
    background: var(--bg);
}
.branding-upload-card .check-row { grid-column: 1 / -1; }
.branding-preview {
    display: grid;
    width: 96px;
    height: 96px;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 20px;
    color: #fff;
    background: linear-gradient(135deg, var(--primary), var(--accent));
    box-shadow: var(--shadow-sm);
    font-size: 22px;
    font-weight: 900;
}
.branding-favicon-preview { width: 72px; height: 72px; border-radius: 17px; }
.branding-preview img { display: block; width: 100%; height: 100%; padding: 7px; object-fit: contain; background: #fff; }
.settings-signature-card {
    grid-template-columns: 180px minmax(0, 1fr);
    margin-top: 14px;
}
.branding-signature-preview {
    width: 164px;
    height: 96px;
    border-radius: 14px;
    background: #fff;
}
.branding-signature-preview span { color: var(--muted); font-size: 13px; }
.settings-colour-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 13px;
}
.colour-field {
    display: flex;
    min-height: 58px;
    padding: 8px 10px;
    align-items: center;
    justify-content: space-between;
    gap: 9px;
    border: 1px solid var(--border);
    border-radius: 13px;
    background: var(--bg);
}
.colour-field input[type="color"] { width: 54px; min-height: 38px; padding: 3px; border-radius: 10px; cursor: pointer; }
.settings-theme-preview {
    --preview-primary: #2457b8;
    --preview-primary-dark: #173f91;
    --preview-accent: #5b5ce2;
    --preview-bg: #f3f6fb;
    --preview-card: #ffffff;
    --preview-text: #142033;
    align-self: stretch;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 19px;
    color: var(--preview-text);
    background: var(--preview-bg);
    box-shadow: var(--shadow-md);
}
.theme-preview-header {
    display: flex;
    padding: 14px;
    align-items: center;
    gap: 10px;
    color: #fff;
    background: linear-gradient(125deg, var(--preview-primary-dark), var(--preview-primary) 58%, var(--preview-accent));
}
.theme-preview-header > span { display: grid; width: 40px; height: 40px; place-items: center; border: 1px solid rgba(255,255,255,.3); border-radius: 12px; font-weight: 900; }
.theme-preview-header div { display: grid; min-width: 0; }
.theme-preview-header small { color: rgba(255,255,255,.78); }
.theme-preview-body { margin: 14px; padding: 16px; border-radius: 15px; background: var(--preview-card); }
.theme-preview-body h3 { margin: 12px 0 5px; color: var(--preview-text); }
.theme-preview-body p { margin-top: 0; color: var(--preview-text); opacity: .7; }
.theme-preview-body button { min-height: 40px; pointer-events: none; background: linear-gradient(135deg, var(--preview-primary), var(--preview-accent)); }
.theme-preview-chip { display: inline-flex; padding: 5px 9px; border-radius: 999px; color: var(--preview-primary-dark); background: color-mix(in srgb, var(--preview-primary) 12%, white); font-size: 11px; font-weight: 850; }
.install-detected-card { width: 100%; min-width: 0; margin-bottom: 14px; }
.installation-fields.is-auto #site_origin,
.installation-fields.is-auto #site_base_path { background: var(--bg); }
.settings-url-warning { margin-top: 15px; }
.settings-save-bar {
    position: sticky;
    bottom: 12px;
    z-index: 25;
    display: flex;
    margin: 18px 0 4px;
    padding: 13px 15px;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border: 1px solid var(--border);
    border-radius: 18px;
    color: var(--text);
    background: color-mix(in srgb, var(--card) 92%, transparent);
    box-shadow: 0 15px 42px rgba(15, 23, 42, .16);
    backdrop-filter: blur(14px);
}
.settings-save-bar > div { display: grid; }
.settings-save-bar span { color: var(--muted); font-size: 12px; }

@media (max-width: 820px) {
    .settings-hero,
    .settings-section-head { display: grid; }
    .settings-section-head p { max-width: none; text-align: left; }
    .settings-install-badge { min-width: 0; }
    .settings-grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .settings-branding-grid,
    .settings-theme-layout { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 560px) {
    .settings-grid-2,
    .settings-grid-3 { grid-template-columns: minmax(0, 1fr); }
    .branding-upload-card { grid-template-columns: 78px minmax(0, 1fr); padding: 11px; }
    .branding-preview { width: 68px; height: 68px; border-radius: 15px; }
    .settings-signature-card { grid-template-columns: 102px minmax(0, 1fr); }
    .branding-signature-preview { width: 92px; height: 68px; border-radius: 12px; }
    .branding-favicon-preview { width: 58px; height: 58px; }
    .settings-colour-grid { grid-template-columns: minmax(0, 1fr); }
    .settings-save-bar { bottom: 6px; display: grid; padding: 10px; }
    .settings-save-bar button { width: 100%; }
}

@media print {
    .nav-toggle,
    .nav-backdrop,
    .mobile-nav-head,
    .mobile-nav-logout { display: none !important; }
    body.portal-shell { background: #fff; }
    .container { width: 100%; max-width: none; padding: 0; }
}

/* V11 Monthly Job Cards spreadsheet */
body.job-card-page .container {
    width: min(100%, 1240px);
    max-width: none;
    padding: 24px 20px 34px;
}
.job-card-hero {
    padding: 16px 18px;
}
.job-card-open-actions { display: flex; align-items: center; gap: 8px; }
.job-card-open-actions .btn { margin: 0; white-space: nowrap; }
.job-card-planner-link { flex: 0 0 auto; white-space: nowrap; }
.job-card-hero h1 { margin: 2px 0 0; }
.job-card-factor {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    min-width: 0;
    gap: 8px;
}
.job-card-factor label {
    display: grid;
    gap: 3px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: .045em;
    text-transform: uppercase;
}
.job-card-factor-fields {
    display: grid;
    grid-template-columns: minmax(155px, 1fr) minmax(120px, .7fr);
    gap: 8px;
}
.job-card-factor-form { gap: 8px; }
.job-card-factor-input {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 7px;
}
.job-card-factor-input input {
    width: 100%;
    min-height: 38px;
    padding: 6px 8px;
    border-radius: 9px;
    font-size: 13px;
    font-weight: 800;
}
.job-card-factor select { min-height: 38px; padding: 6px 8px; font-size: 13px; }
.job-card-factor-form button { width: auto; min-height: 38px; padding: 6px 13px; }

.job-card-month-controls {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    padding: 12px;
}
.job-card-month-controls-compact { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); }
.job-card-create-form,
.job-card-open-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 10px;
}
.job-card-create-form button,
.job-card-open-form button { margin-bottom: 0; white-space: nowrap; }

.job-card-sheet-head {
    display: grid;
    grid-template-columns: minmax(260px, .8fr) minmax(620px, 1.7fr);
    margin-bottom: 14px;
    gap: 12px;
}
.job-card-month-title,
.job-card-mini-stats {
    border: 1px solid var(--border);
    border-radius: 18px;
    background: var(--card);
    box-shadow: var(--shadow-sm);
}
.job-card-month-title {
    display: flex;
    min-width: 0;
    padding: 15px 17px;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}
.job-card-month-title h2 { margin: 2px 0 3px; }
.job-card-month-title p { margin: 0; color: var(--muted); font-size: 13px; }
.job-card-mini-stats {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    overflow: hidden;
}
.job-card-mini-stats > div {
    display: grid;
    min-width: 0;
    padding: 13px 14px;
    align-content: center;
    border-left: 1px solid var(--border);
}
.job-card-mini-stats > div:first-child { border-left: 0; }
.job-card-mini-stats span {
    color: var(--muted);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .035em;
    text-transform: uppercase;
}
.job-card-mini-stats strong {
    overflow: hidden;
    margin-top: 3px;
    color: #1c2d49;
    font-size: 18px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.job-card-ga-panel {
    margin-bottom: 14px;
    padding: 16px 18px;
    border: 1px solid #cbd9e8;
    border-radius: 18px;
    background: linear-gradient(135deg, #ffffff 0%, #f4f9ff 100%);
    box-shadow: var(--shadow-sm);
}
.job-card-ga-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}
.job-card-ga-heading h2 { margin: 2px 0 4px; font-size: 20px; }
.job-card-ga-heading p { margin: 0; color: var(--muted); font-size: 12px; }
.job-card-ga-legend { display: flex; padding-top: 6px; flex-wrap: wrap; gap: 12px; color: #52627a; font-size: 11px; font-weight: 750; }
.job-card-ga-legend span { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.job-card-ga-legend i { width: 13px; height: 13px; border: 1px solid transparent; border-radius: 4px; }
.job-card-ga-legend .ga-legend-covered { border-color: #75bf91; background: #dff5e7; }
.job-card-ga-legend .ga-legend-crossing { border-color: #e3a928; background: #fff0be; }
.job-card-ga-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-top: 14px;
    overflow: hidden;
    border: 1px solid #d6e1ed;
    border-radius: 13px;
    background: rgba(255, 255, 255, .86);
}
.job-card-ga-stats > div { display: grid; min-width: 0; padding: 11px 13px; border-left: 1px solid #dfe7f0; }
.job-card-ga-stats > div:first-child { border-left: 0; }
.job-card-ga-stats span { color: var(--muted); font-size: 9px; font-weight: 900; letter-spacing: .045em; text-transform: uppercase; }
.job-card-ga-stats strong { margin-top: 2px; color: #193152; font-size: 18px; font-variant-numeric: tabular-nums; }
.job-card-ga-stats strong.is-surplus { color: #137a3d; }
.job-card-ga-stats strong.is-short { color: #b54708; }
.job-card-ga-stats strong.is-exact { color: #087443; }
.job-card-ga-stats strong.is-neutral { color: #667085; font-size: 14px; }
.job-card-ga-stats small { overflow: hidden; color: #718096; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.job-card-ga-progress { height: 9px; margin-top: 12px; overflow: hidden; border-radius: 999px; background: #e5edf6; }
.job-card-ga-progress > span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #1d7f4e, #36b66c); transition: width .2s ease; }
.job-card-ga-status { margin: 8px 0 0; color: #52627a; font-size: 11px; font-weight: 700; }

.job-card-workspace {
    position: relative;
    padding: 10px !important;
    overflow: hidden;
    border-radius: 16px !important;
}
.job-card-toolbar {
    display: flex;
    padding: 2px 2px 10px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.job-card-toolbar-group {
    display: flex;
    min-width: 0;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}
.job-card-toolbar .btn,
.job-card-toolbar button { min-height: 38px; padding: 7px 11px; font-size: 12px; }
.job-card-carry-form { margin: 0; flex: 0 0 auto; }
.job-card-paste-note { color: var(--muted); font-size: 11px; font-weight: 650; }
.job-card-paste-note kbd {
    display: inline-flex;
    min-width: 22px;
    padding: 2px 5px;
    justify-content: center;
    border: 1px solid #cbd6e5;
    border-bottom-width: 2px;
    border-radius: 5px;
    color: #32435d;
    background: #f8fafc;
    font: 700 10px/1.2 system-ui, sans-serif;
}

.job-card-grid-wrap {
    width: 100%;
    height: auto;
    max-height: none;
    overflow-x: auto;
    overflow-y: visible;
    border: 1px solid #cbd7e6;
    border-radius: 11px;
    background: #fff;
    overscroll-behavior-x: contain;
    overscroll-behavior-y: auto;
    scrollbar-color: #9eb0c9 #edf2f8;
    scrollbar-width: thin;
}
.job-card-grid-wrap:focus { outline: 3px solid rgba(var(--primary-rgb), .13); }
.job-card-grid {
    width: 100%;
    max-width: none;
    min-width: 0;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
    color: #21314b;
    font-size: 11px;
}
.job-card-grid col.col-row { width: 30px; }
.job-card-grid col.col-type { width: 80px !important; }
.job-card-grid col.col-coach { width: 130px; }
.job-card-grid col.col-bo { width: 100px !important; }
.job-card-grid col.col-op { width: 44px !important; }
.job-card-grid col.col-qty { width: 30px !important; }
.job-card-grid col.col-description { width: auto; }
.job-card-grid col.col-time { width: 70px !important; }
.job-card-grid col.col-total { width: 55px; }
.job-card-grid col.col-hours { width: 50px; }
.job-card-grid col.col-used { width: 30px; }
.job-card-grid col.col-balance { width: 55px; }
.job-card-grid col.col-balance-hours { width: 55px; }
.job-card-grid col.col-date { width: 55px; }
.job-card-grid col.col-remarks { width: 160px; }
.job-card-grid col.col-action { width: 80px; }

@media (min-width: 901px) {
    .job-card-grid-wrap { overflow-x: hidden; }
}
.job-card-grid th,
.job-card-grid td {
    height: 38px;
    padding: 0;
    overflow: visible;
    border-right: 1px solid #dce4ef;
    border-bottom: 1px solid #dce4ef;
    vertical-align: middle;
}
.job-card-grid thead th {
    position: sticky;
    top: 0;
    z-index: 5;
    height: 42px;
    padding: 6px 4px;
    color: #fff;
    background: linear-gradient(180deg, var(--primary) 0%, var(--primary-dark) 100%);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .03em;
    text-align: center;
    white-space: nowrap;
}
.job-card-grid tbody tr:hover td,
.job-card-grid tbody tr:hover .job-row-number { background-color: #f2f7ff; }
.job-card-grid input,
.job-card-grid select {
    width: 100%;
    height: 37px;
    min-height: 37px;
    padding: 5px 4px;
    border: 0;
    border-radius: 0;
    color: #17243a;
    background: transparent;
    box-shadow: none;
    font: inherit;
}
.job-card-grid input:hover,
.job-card-grid select:hover { border: 0; background: #f8fbff; }
.job-card-grid input:focus,
.job-card-grid select:focus {
    position: relative;
    z-index: 2;
    outline: 2px solid var(--primary);
    outline-offset: -2px;
    border: 0;
    background: #fff;
    box-shadow: inset 0 0 0 1px var(--primary);
}
.job-card-grid input:invalid { background: #fff1f0; box-shadow: inset 0 0 0 1px #d92d20; }
.job-card-grid input[readonly],
.job-card-grid select:disabled { color: #5c6b7f; background: #f3f6fa; }
.job-card-grid output {
    display: flex;
    min-height: 37px;
    padding: 5px 7px;
    align-items: center;
    justify-content: flex-end;
    color: #263650;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.job-card-grid .job-calculated { background: #eef3f9; }
.job-card-grid td[data-col] { cursor: cell; }
.job-card-grid.is-selecting-cells td[data-col] { user-select: none; }
.job-card-mobile-select-toggle { display: none; }
.job-card-mobile-select-toggle[aria-pressed="true"] { border-color: #0d746d; background: #168d85; color: #fff; }
.job-card-grid.is-mobile-cell-selecting td[data-col] > * { pointer-events: none; }
.job-card-grid tr.is-ga-coverage-row > td,
.job-card-grid tr.is-ga-coverage-row > .job-row-number,
.job-card-grid tr.is-ga-coverage-row > .job-row-action { background: #e5f7eb; }
.job-card-grid tr.is-ga-coverage-row > .job-calculated { background: #d9f1e2; }
.job-card-grid tr.is-ga-coverage-row > .job-row-number { color: #187443; font-weight: 900; box-shadow: inset 4px 0 0 #36a864; }
.job-card-grid tr.is-ga-crossing-row > td,
.job-card-grid tr.is-ga-crossing-row > .job-row-number,
.job-card-grid tr.is-ga-crossing-row > .job-row-action { background: #fff2c9; border-top: 1px solid #e1ab2f; border-bottom-color: #e1ab2f; }
.job-card-grid tr.is-ga-crossing-row > .job-calculated { background: #ffe9a3; }
.job-card-grid tr.is-ga-crossing-row > .job-row-number { color: #8b5b00; box-shadow: inset 4px 0 0 #e1a525; }
.job-card-grid tr.is-duplicate-job-card > td,
.job-card-grid tr.is-duplicate-job-card > .job-row-number,
.job-card-grid tr.is-duplicate-job-card > .job-row-action {
    background: #fff0f0 !important;
    border-top-color: #e54848;
    border-bottom-color: #e54848;
}
.job-card-grid tr.is-duplicate-job-card > .job-row-number {
    color: #a71919;
    font-weight: 900;
    box-shadow: inset 4px 0 0 #df3030;
}
.job-card-grid td.is-duplicate-job-card-key {
    background: #ffd9d9 !important;
    box-shadow: inset 0 0 0 2px #df3030;
}
.job-card-grid td.is-duplicate-job-card-key input {
    color: #9d1111;
    background: transparent !important;
    font-weight: 900;
}
.job-card-grid tbody td.is-cell-selected {
    position: relative;
    background: #dcecff !important;
    box-shadow: inset 0 0 0 1px #6b9ee8;
}
.job-card-grid td.is-cell-selected input,
.job-card-grid td.is-cell-selected select,
.job-card-grid td.is-cell-selected output { background: transparent !important; }
.job-card-grid td.is-selection-anchor {
    z-index: 2;
    box-shadow: inset 0 0 0 2px var(--primary);
}
.job-card-grid .job-row-number {
    position: sticky;
    left: 0;
    z-index: 3;
    padding: 0 5px;
    color: #5c6b7f;
    background: #f5f7fa;
    text-align: center;
    font-variant-numeric: tabular-nums;
}
.job-card-grid thead .job-row-number { z-index: 7; color: #fff; background: var(--primary-dark); }
.job-card-grid .job-row-action {
    position: sticky;
    right: 0;
    z-index: 3;
    border-right: 0;
    background: #f6f8fb;
    text-align: center;
    white-space: nowrap;
}
.job-card-grid thead .job-row-action { z-index: 7; background: var(--primary-dark); }
.job-card-grid tr.is-runner-blocked > td,
.job-card-grid tr.is-runner-blocked > th { background: #fff4e2; }
.job-card-grid tr.is-runner-blocked > .job-row-action { background: #fff4e2; }
.job-card-grid tr.is-duplicate-card > td,
.job-card-grid tr.is-duplicate-card > th,
.job-card-grid tr.is-duplicate-card input,
.job-card-grid tr.is-duplicate-card select,
.job-card-grid tr.is-duplicate-card output { font-weight: 700; }
.job-card-grid tr.is-card-available > td,
.job-card-grid tr.is-card-available > .job-row-number,
.job-card-grid tr.is-card-available > .job-row-action { background: #e9f8ee; }
.job-card-grid tr.is-card-partially-available > td,
.job-card-grid tr.is-card-partially-available > .job-row-number,
.job-card-grid tr.is-card-partially-available > .job-row-action { background: #fff5d9; }
.job-card-grid tr.is-card-unavailable > td,
.job-card-grid tr.is-card-unavailable > .job-row-number,
.job-card-grid tr.is-card-unavailable > .job-row-action { background: #fff0ef; }
.job-card-grid tr.is-card-unavailable { color: #9d2b22; }
/* Keep action controls in one fixed row, regardless of toggle glyph/state. */
.job-row-controls { display: flex; align-items: center; justify-content: center; flex-wrap: nowrap; gap: 3px; width: 76px; height: 28px; margin: 0 auto; }
.job-card-grid .job-row-controls .job-runner-block { flex: 0 0 20px; width: 20px; min-width: 20px; height: 23px; margin: 0 !important; padding: 0; justify-content: center; line-height: 1; }
.job-card-grid .job-row-controls .job-runner-block input { width: 1px !important; height: 1px !important; min-width: 0 !important; min-height: 0 !important; padding: 0 !important; margin: 0 !important; clip-path: inset(50%); }
.job-card-grid .job-row-controls .job-runner-block span { flex: 0 0 20px; width: 20px; height: 20px; }
.job-card-grid .job-row-controls .job-drag-handle,
.job-card-grid .job-row-controls .job-remove-row { flex: 0 0 23px; width: 23px; height: 23px; margin: 0; padding: 0; transform: none; }
.job-runner-block {
    display: inline-flex;
    align-items: center;
    gap: 0;
    margin-right: 2px;
    color: #9a4d00;
    font-size: 11px;
    font-weight: 700;
}
.job-runner-block input { position: absolute; inline-size: 1px; block-size: 1px; opacity: 0; }
.job-runner-block span { display: inline-grid; width: 19px; height: 19px; place-items: center; cursor: pointer; }
.job-runner-block span { border: 1px solid #f2c9a5; border-radius: 5px; color: #ad4f13; background: #fff6ed; }
.job-runner-block span::before { content: "⊘"; font-size: 17px; font-weight: 800; line-height: 1; }
.job-runner-block input:checked + span { color: #197443; background: #ebf8ef; border-color: #b5e0c4; }
.job-runner-block input:checked + span::before { content: "↺"; }
.job-runner-block input:focus-visible + span { outline: 2px solid var(--primary); border-radius: 4px; }
.job-card-date-field { display: grid; grid-template-columns: minmax(0, 1fr) 18px; align-items: center; }
.job-card-date-field .job-card-date-picker { width: 18px; min-width: 18px; height: 24px; min-height: 24px; padding: 0; color: transparent; background: transparent; border: 0; cursor: pointer; }
.job-card-date-field .job-card-date-picker::-webkit-calendar-picker-indicator { width: 15px; height: 15px; margin: 0; opacity: 1; cursor: pointer; }
.job-drag-handle,
.job-remove-row {
    display: inline-grid;
    width: 28px;
    height: 28px;
    min-height: 28px;
    padding: 0;
    place-items: center;
    border: 1px solid #f1c4c0;
    border-radius: 7px;
    color: #b42318;
    background: #fff4f3;
    box-shadow: none;
    font-size: 20px;
    font-weight: 500;
    line-height: 1;
}
.job-drag-handle {
    margin-right: 3px;
    border-color: #b9cdec;
    color: #24549a;
    background: #edf4ff;
    cursor: grab;
    font-size: 17px;
    font-weight: 800;
}
.job-drag-handle:active { cursor: grabbing; }
.job-drag-handle:hover { color: #fff; background: var(--primary); box-shadow: none; transform: none; }
.job-drag-handle,
.job-remove-row { width: 23px; height: 23px; min-height: 23px; font-size: 17px; }
.job-drag-handle { margin-right: 1px; }

/* Compact page identity shown to normal admins without explanatory cards. */
.module-title-only {
    margin: 0 0 1rem;
    padding: .2rem 0;
}
.module-title-only h1 {
    margin: 0;
    font-size: clamp(1.55rem, 3vw, 2rem);
    line-height: 1.15;
}

/* V17 employee dashboard and incentive pages */
.employee-page-heading {
    margin: 0 0 10px;
    padding: 2px 1px;
}
.employee-page-heading h1 {
    margin: 0;
    color: #17243a;
    font-size: clamp(21px, 3vw, 28px);
    line-height: 1.15;
    letter-spacing: -.025em;
}
.employee-page-heading p {
    margin: 4px 0 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.35;
}

.employee-dashboard-profile {
    display: grid;
    grid-template-columns: 126px minmax(0, 1fr);
    gap: 14px;
    padding: 14px !important;
    overflow: hidden;
    background: linear-gradient(145deg, #fff 0%, #f1f6ff 100%) !important;
}
.page-dashboard.role-employee main > .employee-dashboard-profile:first-child::after { display: none; }
.employee-dashboard-photo {
    display: flex;
    width: 126px;
    height: 146px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 3px solid #fff;
    border-radius: 20px;
    color: #fff;
    background: linear-gradient(145deg, var(--primary), var(--accent));
    box-shadow: 0 10px 24px rgba(var(--primary-rgb), .22);
    font-size: 42px;
    font-weight: 950;
}
.employee-dashboard-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
}
.employee-dashboard-profile-body {
    display: grid;
    min-width: 0;
    gap: 8px;
}
.employee-dashboard-welcome {
    display: flex;
    min-width: 0;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}
.employee-dashboard-welcome > span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}
.employee-dashboard-welcome h1 {
    max-width: 100%;
    margin: 0;
    padding: 4px 9px;
    overflow-wrap: anywhere;
    border-radius: 10px;
    color: var(--primary-dark);
    background: var(--primary-soft);
    font-size: clamp(18px, 3vw, 24px);
    line-height: 1.15;
}
.employee-profile-id-row,
.employee-profile-job-row,
.employee-profile-date-row {
    display: grid;
    gap: 6px;
}
.employee-profile-id-row,
.employee-profile-date-row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.employee-profile-job-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.employee-profile-id-row > div,
.employee-profile-job-row > div,
.employee-profile-date-row > div,
.employee-profile-mobile-row {
    min-width: 0;
    padding: 7px 8px;
    border: 1px solid #d9e4f1;
    border-radius: 11px;
    background: rgba(255,255,255,.8);
}
.employee-dashboard-profile span,
.employee-latest-incentive span,
.employee-incentive-identity span,
.employee-summary-metrics span {
    display: block;
    color: var(--muted);
    font-size: 9px;
    font-weight: 850;
    line-height: 1.2;
    letter-spacing: .025em;
    text-transform: uppercase;
}
.employee-dashboard-profile strong,
.employee-latest-incentive strong,
.employee-incentive-identity strong,
.employee-summary-metrics strong {
    display: block;
    margin-top: 2px;
    overflow-wrap: anywhere;
    color: #17243a;
    font-size: 13px;
    line-height: 1.22;
}
.employee-profile-date-row strong { font-size: 12px; white-space: nowrap; }
.employee-profile-mobile-row {
    display: flex;
    min-height: 44px;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.employee-profile-mobile-row > div { min-width: 0; }
.employee-profile-mobile-row .btn { flex: 0 0 auto; }

.employee-latest-incentive { padding: 13px !important; }
.employee-section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.employee-section-heading h2 { margin: 0 !important; font-size: 18px !important; }
.employee-section-heading p { margin: 3px 0 0; color: var(--muted); font-size: 11px; }
.employee-section-heading .btn { flex: 0 0 auto; }
.employee-latest-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
    margin-top: 10px;
}
.employee-latest-metrics > div {
    min-width: 0;
    padding: 8px;
    border: 1px solid #dbe5f1;
    border-radius: 11px;
    background: #f8faff;
}
.employee-latest-metrics strong { font-size: 16px; }
.employee-dashboard-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 10px;
}
.employee-dashboard-actions .btn { min-height: 40px; padding: 7px 10px; }

/* Employee incentive page: four-line, mobile-first overview. */
.employee-incentive-overview {
    display: grid;
    gap: 10px;
    margin-bottom: 10px;
    padding: 14px 12px !important;
    overflow: hidden;
    background: linear-gradient(145deg, #fff 0%, #f2f7fc 100%) !important;
    text-align: center;
}
.employee-incentive-overview h1 {
    margin: 0;
    color: #17243a;
    font-size: clamp(17px, 5vw, 24px);
    font-weight: 950;
    line-height: 1.15;
    letter-spacing: .035em;
    text-align: center;
    text-transform: uppercase;
    white-space: nowrap;
}
.employee-incentive-person-line {
    display: flex;
    width: 100%;
    max-width: 520px;
    min-width: 0;
    min-height: 32px;
    margin: 0 auto;
    padding: 6px 8px;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 4px 8px;
    border-block: 1px solid #dbe5f1;
    color: var(--primary-dark);
    font-size: 13px;
    font-weight: 900;
    line-height: 1.25;
    letter-spacing: .035em;
    text-align: center;
    text-transform: uppercase;
}
.employee-incentive-person-line span { min-width: 0; overflow-wrap: anywhere; }
.employee-incentive-person-divider { color: #91a4b9; }
.employee-month-picker-line {
    width: 100%;
    max-width: 520px;
    margin: 0 auto;
}
.employee-month-picker-line select {
    width: 100%;
    min-height: 46px;
    margin: 0;
    padding: 8px 34px 8px 11px;
    border-color: #c8d8ea;
    border-radius: 13px;
    background-color: #fff;
    color: #17243a;
    font-size: 13px;
    font-weight: 800;
    text-align: center;
    text-align-last: center;
}
.employee-month-picker-line option { font-size: 15px; }
.employee-incentive-balance-line {
    display: grid;
    width: 100%;
    max-width: 520px;
    margin: 0 auto;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: hidden;
    border: 1px solid #d3dfed;
    border-radius: 13px;
    background: rgba(255,255,255,.9);
}
.employee-incentive-balance-line > div {
    min-width: 0;
    padding: 9px 7px;
}
.employee-incentive-balance-line > div + div { border-left: 1px solid #d3dfed; }
.employee-incentive-balance-line span {
    display: block;
    color: var(--muted);
    font-size: 9px;
    font-weight: 900;
    line-height: 1.15;
    letter-spacing: .035em;
    text-transform: uppercase;
}
.employee-incentive-balance-line strong {
    display: block;
    margin-top: 3px;
    overflow-wrap: anywhere;
    font-size: 19px;
    line-height: 1.1;
}

.employee-period-picker { padding: 10px 12px !important; }
.employee-period-form {
    display: grid;
    grid-template-columns: 105px minmax(0, 1fr);
    gap: 8px;
    align-items: center;
}
.employee-period-form label { margin: 0; font-size: 12px; }
.employee-period-form select { min-height: 40px; padding: 7px 10px; font-size: 14px; }
.employee-incentive-identity { padding: 11px 12px !important; }
.employee-incentive-period-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 8px;
}
.employee-incentive-period-title h2 { margin: 0 !important; font-size: 17px !important; }
.employee-incentive-period-title > strong {
    margin: 0;
    color: var(--primary-dark);
    font-size: 12px;
    white-space: nowrap;
}
.employee-incentive-person-row {
    display: grid;
    grid-template-columns: minmax(92px, .55fr) minmax(0, 1.45fr);
    gap: 6px;
}
.employee-incentive-person-row > div {
    min-width: 0;
    padding: 7px 8px;
    border: 1px solid #dbe5f1;
    border-radius: 10px;
    background: #f8faff;
}

.employee-monthly-summary { padding: 0 !important; overflow: hidden; }
.employee-monthly-summary > summary {
    display: flex;
    min-height: 52px;
    padding: 9px 36px 9px 12px;
    position: relative;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    cursor: pointer;
    list-style: none;
}
.employee-monthly-summary > summary::-webkit-details-marker { display: none; }
.employee-monthly-summary > summary::after {
    position: absolute;
    right: 13px;
    color: var(--primary);
    content: "▾";
    font-size: 18px;
    font-weight: 900;
    transition: transform .2s ease;
}
.employee-monthly-summary[open] > summary::after { transform: rotate(180deg); }
.employee-monthly-summary[open] > summary { border-bottom: 1px solid #dfe7f1; }
.employee-monthly-summary > summary > span:first-child > strong {
    color: #17243a;
    font-size: 17px;
}
.employee-monthly-summary > summary small {
    display: block;
    color: var(--muted);
    font-size: 9px;
    font-weight: 800;
    line-height: 1.25;
    text-transform: uppercase;
}
.employee-summary-closing { text-align: right; }
.employee-summary-closing strong { margin-top: 1px; font-size: 15px; }
.employee-summary-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    padding: 10px 12px 12px;
}
.employee-summary-metrics > div {
    min-width: 0;
    padding: 7px 8px;
    border: 1px solid #dbe5f1;
    border-radius: 10px;
    background: #f8faff;
}
.employee-summary-metrics strong { font-size: 15px; }

.employee-daily-incentive-section { padding: 11px !important; }
.employee-daily-incentive-section .incentive-date-order-head {
    margin-bottom: 8px;
    align-items: center;
}
.employee-daily-incentive-section .incentive-date-order-head h2 { margin: 0; font-size: 17px !important; }
.employee-daily-incentive-section .incentive-date-order-pill {
    min-height: 28px;
    padding: 5px 8px;
    font-size: 10px;
}
.employee-incentive-detail-view .day-card-list { gap: 8px; }
.employee-incentive-detail-view .day-card {
    padding: 9px !important;
    border: 3px solid #248b57 !important;
    border-radius: 15px !important;
    box-shadow: 0 6px 16px rgba(15, 23, 42, .055);
}
.employee-incentive-detail-view .day-card-top { gap: 5px; }
.employee-incentive-detail-view .day-card-date {
    display: inline-flex;
    min-height: 26px;
    padding: 4px 7px;
    align-items: center;
    border-radius: 8px;
    background: #e8f8ef;
    color: #176b42;
    font-size: 14px;
}
.employee-incentive-detail-view .day-card-holiday {
    border-color: #dc3545 !important;
    background: #fff7f7;
}
.employee-incentive-detail-view .day-card-holiday .day-card-date {
    background: #ffe5e8;
    color: #b4232d !important;
}
.employee-incentive-detail-view .day-card-pa {
    border-color: #e88725 !important;
    background: #fffaf2;
}
.employee-incentive-detail-view .day-card-pa .day-card-date {
    background: #fff0da;
    color: #ad5b09;
}
.employee-incentive-detail-view .day-card-non-working {
    display: flex;
    min-height: 34px;
    margin-top: 7px;
    padding: 7px 9px;
    align-items: center;
    border: 1px dashed #f1a4ab;
    border-radius: 11px;
    background: #fffafb;
    color: #b4232d;
    font-size: 11px;
    font-weight: 900;
}
.employee-incentive-detail-view .day-card-status {
    display: flex;
    min-height: 36px;
    margin-top: 7px;
    padding: 7px 10px;
    align-items: center;
    border-radius: 11px;
    font-size: 15px;
    font-weight: 900;
    letter-spacing: .02em;
}
.employee-incentive-detail-view .day-card-status-pa {
    border: 1px solid #f2bd7c;
    background: #fff0da;
    color: #ad5b09;
}
.employee-incentive-detail-view .day-card-status-idle {
    border: 1px solid #89caa6;
    background: #e8f8ef;
    color: #176b42;
}
.employee-incentive-detail-view .day-pill {
    min-height: 24px;
    padding: 4px 7px;
    font-size: 9px;
}
.employee-incentive-detail-view .day-card-work {
    margin-top: 7px;
    padding: 7px;
    border-radius: 11px;
}
.employee-incentive-detail-view .day-card-label { margin-bottom: 3px; font-size: 8px; }
.employee-incentive-detail-view .day-card-work-value { font-size: 14px; line-height: 1.35; }
.employee-incentive-detail-view .employee-work-lines { gap: 4px; }
.employee-incentive-detail-view .employee-work-line {
    gap: 6px;
    padding: 5px 6px;
    border-radius: 9px;
    font-size: 13px;
}
.employee-incentive-detail-view .day-card-metrics {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 4px;
    margin-top: 7px;
}
.employee-incentive-detail-view .day-mini-stat {
    padding: 5px 4px;
    border-radius: 9px;
    text-align: center;
}
.job-card-grid thead th:not(.job-row-number):not(.job-row-action) { overflow: visible; }
.job-column-resizer {
    position: absolute;
    top: 0;
    right: -5px;
    z-index: 12;
    width: 10px;
    height: 100%;
    cursor: col-resize;
    touch-action: none;
}
.job-column-resizer::after {
    position: absolute;
    top: 6px;
    right: 4px;
    bottom: 6px;
    width: 2px;
    border-radius: 2px;
    background: transparent;
    content: "";
}
.job-column-resizer:hover::after,
.job-column-resizer:focus-visible::after,
body.is-resizing-job-columns .job-column-resizer::after { background: rgba(255, 255, 255, .82); }
.job-column-resizer:focus-visible { outline: 2px solid #fff; outline-offset: -2px; }
body.is-resizing-job-columns,
body.is-resizing-job-columns * { cursor: col-resize !important; user-select: none !important; }
.employee-incentive-detail-view .day-mini-stat .mini-label {
    margin-bottom: 2px;
    font-size: 8px;
    letter-spacing: 0;
}
.employee-incentive-detail-view .day-mini-stat .mini-value {
    overflow-wrap: anywhere;
    font-size: 13px;
    white-space: normal;
}

.employee-incentive-detail-view .day-card {
    scroll-margin-block: 100px;
}

.employee-incentive-detail-view .day-card.is-today-attention {
    animation: incentive-today-card-blink 650ms ease-in-out 2;
}

@keyframes incentive-today-card-blink {
    0%,
    100% {
        box-shadow: 0 6px 16px rgba(15, 23, 42, .055);
        outline: 0 solid rgba(255, 183, 0, 0);
    }
    50% {
        box-shadow: 0 0 0 9px rgba(255, 183, 0, .3), 0 12px 30px rgba(15, 23, 42, .16);
        outline: 4px solid #ffb700;
        outline-offset: 2px;
    }
}

/* Master Admin Backup Center */
.backup-page-head {
    display: flex;
    margin-bottom: 10px;
    padding: 12px 14px;
    border: 1px solid var(--border);
    border-radius: 18px;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    background: var(--card);
    box-shadow: var(--shadow);
}
.backup-page-head h1 {
    margin: 2px 0 3px;
    font-size: clamp(24px, 7vw, 36px);
    line-height: 1.05;
}
.backup-page-head p {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.35;
}
.backup-private-badge {
    flex: 0 0 auto;
    padding: 6px 8px;
    border: 1px solid #efc07c;
    border-radius: 999px;
    color: #8a4b00;
    background: #fff2d7;
    font-size: 10px;
    font-weight: 950;
    text-transform: uppercase;
    white-space: nowrap;
}
.backup-security-note {
    margin-bottom: 10px;
    font-size: 12px;
    line-height: 1.45;
}
.backup-security-note code {
    font-size: 11px;
    font-weight: 850;
}
.backup-choice-grid {
    display: grid;
    margin-bottom: 10px;
    gap: 8px;
}
.backup-choice {
    position: relative;
    display: flex;
    min-width: 0;
    margin: 0 !important;
    padding: 13px !important;
    border: 2px solid var(--border) !important;
    flex-direction: column;
    gap: 10px;
    overflow: hidden;
}
.backup-choice-recommended {
    border-color: var(--primary) !important;
    background:
        linear-gradient(145deg, rgba(var(--primary-rgb), .08), transparent 62%),
        var(--card);
}
.backup-choice-tag {
    position: absolute;
    top: 0;
    right: 0;
    padding: 5px 9px;
    border-radius: 0 0 0 10px;
    color: #fff;
    background: var(--primary);
    font-size: 9px;
    font-weight: 950;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.backup-choice-title {
    display: flex;
    padding-right: 60px;
    align-items: flex-start;
    gap: 9px;
}
.backup-choice:not(.backup-choice-recommended) .backup-choice-title {
    padding-right: 0;
}
.backup-choice-icon {
    display: grid;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    flex: 0 0 36px;
    place-items: center;
    color: #fff;
    background: linear-gradient(135deg, var(--primary-dark), var(--primary));
    font-size: 16px;
    font-weight: 950;
}
.backup-choice h2 {
    margin: 0 0 2px;
    font-size: 18px;
    line-height: 1.15;
}
.backup-choice p {
    margin: 0;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.35;
}
.backup-choice ul {
    display: grid;
    margin: 0;
    padding: 0;
    gap: 4px;
    list-style: none;
}
.backup-choice li {
    position: relative;
    padding-left: 17px;
    color: #33465c;
    font-size: 11px;
    line-height: 1.3;
}
.backup-choice li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: #16804c;
    font-weight: 950;
}
.backup-download-form {
    display: grid;
    margin-top: auto;
    gap: 7px;
}
.backup-confirm {
    display: flex;
    min-height: 28px;
    margin: 0;
    align-items: center;
    gap: 7px;
    color: #35465c;
    font-size: 10px;
    font-weight: 800;
}
.backup-confirm input {
    width: 18px;
    height: 18px;
    min-height: 18px;
    flex: 0 0 18px;
}
.backup-download-form button {
    width: 100%;
    min-height: 40px;
    padding: 8px 10px;
    border-radius: 11px;
    font-size: 12px;
}
.backup-download-form button:disabled {
    cursor: not-allowed;
    opacity: .5;
}
.backup-server-status {
    margin: 0 !important;
    padding: 12px !important;
}
.backup-server-status h2 {
    margin: 0 0 8px;
    font-size: 18px;
}
.backup-status-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
}
.backup-status-grid > div {
    display: grid;
    min-width: 0;
    padding: 8px;
    border: 1px solid var(--border);
    border-radius: 10px;
    gap: 2px;
    background: #f7faff;
}
.backup-status-grid span {
    color: var(--muted);
    font-size: 9px;
    font-weight: 850;
    text-transform: uppercase;
}
.backup-status-grid strong {
    overflow-wrap: anywhere;
    color: var(--text);
    font-size: 12px;
}
.backup-status-grid .is-ready {
    color: #087844;
}
.backup-status-grid .is-blocked {
    color: #b42318;
}
.backup-server-status > p {
    margin: 8px 0 0;
    font-size: 10px;
    line-height: 1.35;
}

@media (min-width: 760px) {
    .backup-page-head {
        padding: 16px 18px;
        align-items: center;
    }
    .backup-choice-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 10px;
    }
    .backup-choice {
        padding: 16px !important;
    }
    .backup-status-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (prefers-reduced-motion: reduce) {
    .employee-incentive-detail-view .day-card.is-today-attention {
        animation-duration: 1ms;
        animation-iteration-count: 1;
        outline: 4px solid #ffb700;
        outline-offset: 2px;
    }
}

@media (max-width: 767px) {
    .employee-dashboard-profile {
        grid-template-columns: 1fr;
        gap: 10px;
        padding: 12px !important;
    }
    .employee-dashboard-photo {
        width: 104px;
        height: 118px;
        margin: 0 auto;
        border-radius: 17px;
        font-size: 34px;
    }
    .employee-latest-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .employee-section-heading { align-items: flex-start; }
}

@media (max-width: 420px) {
    .page-dashboard.role-employee .container,
    .employee-incentive-detail-view .container { padding: 9px !important; }
    .employee-profile-id-row,
    .employee-profile-job-row,
    .employee-profile-date-row { gap: 5px; }
    .employee-profile-id-row > div,
    .employee-profile-job-row > div,
    .employee-profile-date-row > div { padding: 6px 5px; }
    .employee-profile-date-row strong { font-size: 10.5px; }
    .employee-profile-job-row strong { font-size: 11px; }
    .employee-profile-mobile-row { padding: 6px 7px; }
    .employee-profile-mobile-row .btn { min-height: 34px; padding: 5px 7px; font-size: 10px; }
    .employee-latest-incentive { padding: 11px !important; }
    .employee-section-heading h2 { font-size: 16px !important; }
    .employee-section-heading .btn { min-height: 34px; padding: 5px 8px; font-size: 10px; }
    .employee-latest-metrics { margin-top: 8px; }
    .employee-latest-metrics strong { font-size: 14px; }
    .employee-page-heading { margin-bottom: 8px; }
    .employee-page-heading h1 { font-size: 20px; }
    .employee-period-picker { padding: 8px 9px !important; }
    .employee-period-form { grid-template-columns: 88px minmax(0, 1fr); gap: 6px; }
    .employee-period-form label { font-size: 10px; }
    .employee-period-form select { min-height: 38px; padding: 6px 8px; font-size: 12px; }
    .employee-incentive-identity { padding: 9px !important; }
    .employee-incentive-period-title { margin-bottom: 6px; }
    .employee-incentive-period-title h2 { font-size: 15px !important; }
    .employee-incentive-period-title > strong { font-size: 10px; }
    .employee-incentive-person-row > div { padding: 6px 7px; }
    .employee-monthly-summary > summary { min-height: 48px; padding-block: 7px; }
    .employee-summary-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 8px 9px 10px; }
    .employee-daily-incentive-section { padding: 9px !important; }
    .employee-daily-incentive-section .incentive-date-order-head {
        display: flex;
        gap: 6px;
    }
    .employee-daily-incentive-section .incentive-date-order-head h2 { font-size: 15px !important; }
    .employee-daily-incentive-section .incentive-date-order-pill { font-size: 8.5px; white-space: nowrap; }
    .employee-incentive-detail-view .day-card-top { grid-template-columns: 1fr auto auto; }
    .employee-incentive-detail-view .day-card-date { grid-column: auto; }
    .employee-incentive-detail-view .day-mini-stat .mini-value { font-size: 12px; }
    .employee-incentive-detail-view .month-pagination { margin-top: 10px; }
}

/* V17 read-only employee directory, holidays, and plus/minus report */
.employee-directory-search { padding: 10px 12px !important; }
.employee-directory-search label { margin-bottom: 5px; font-size: 11px; }
.employee-directory-search form > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 6px;
}
.employee-directory-search input,
.employee-directory-search .btn,
.employee-directory-search button { min-height: 38px; padding: 6px 9px; font-size: 12px; }
.employee-directory-grid,
.employee-holiday-list,
.employee-plus-minus-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-bottom: 12px;
}
.employee-directory-card,
.employee-holiday-card,
.employee-plus-minus-card {
    min-width: 0;
    border: 1px solid #d8e3f0;
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 7px 18px rgba(15, 23, 42, .055);
}
.employee-directory-card {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 9px;
    padding: 9px;
}
.employee-directory-photo {
    display: flex;
    width: 58px;
    height: 68px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 12px;
    color: #fff;
    background: linear-gradient(145deg, var(--primary), var(--accent));
    font-size: 22px;
    font-weight: 950;
}
.employee-directory-photo img { width: 100%; height: 100%; object-fit: cover; }
.employee-directory-body { min-width: 0; }
.employee-directory-body h2 {
    margin: 0 0 5px;
    overflow-wrap: anywhere;
    color: #17243a;
    font-size: 14px;
    line-height: 1.2;
}
.employee-directory-ids {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 4px;
}
.employee-directory-ids span {
    min-width: 0;
    padding: 4px;
    border-radius: 7px;
    color: var(--muted);
    background: #f4f7fb;
    font-size: 7px;
    font-weight: 800;
    text-transform: uppercase;
}
.employee-directory-ids strong {
    display: block;
    margin-top: 1px;
    overflow-wrap: anywhere;
    color: #17243a;
    font-size: 9px;
}
.employee-directory-body p { margin: 5px 0 0; color: #475569; font-size: 10px; line-height: 1.25; }
.employee-directory-mobile { padding-top: 4px; border-top: 1px solid #edf1f6; }

.employee-holiday-card {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    gap: 10px;
    padding: 9px;
    align-items: center;
}
.employee-holiday-card time {
    display: grid;
    min-height: 54px;
    place-content: center;
    border-radius: 12px;
    color: #fff;
    background: linear-gradient(145deg, var(--primary), var(--accent));
    text-align: center;
}
.employee-holiday-card time strong { font-size: 19px; line-height: 1; }
.employee-holiday-card time span { margin-top: 3px; font-size: 9px; font-weight: 850; text-transform: uppercase; }
.employee-holiday-card h2 { margin: 0; color: #17243a; font-size: 14px; line-height: 1.2; }
.employee-holiday-card p { margin: 3px 0 0; color: var(--muted); font-size: 10px; }

.employee-report-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    margin-bottom: 10px;
}
.employee-report-summary > div {
    min-width: 0;
    padding: 8px 6px;
    border: 1px solid #d8e3f0;
    border-radius: 11px;
    background: #fff;
    text-align: center;
}
.employee-report-summary span,
.employee-plus-minus-metrics span {
    display: block;
    color: var(--muted);
    font-size: 8px;
    font-weight: 850;
    text-transform: uppercase;
}
.employee-report-summary strong { display: block; margin-top: 2px; font-size: 15px; }
.employee-report-summary .employee-report-total {
    grid-column: 1 / -1;
    padding: 11px 12px;
    border-width: 2px;
    text-align: center;
}
.employee-report-total.is-plus { border-color: #34a87c; background: #f0fbf6; }
.employee-report-total.is-minus { border-color: #e15252; background: #fff5f5; }
.employee-report-total.is-balanced { border-color: #9aa9bd; background: #f6f8fb; }
.employee-report-summary .employee-report-total span { font-size: 10px; }
.employee-report-summary .employee-report-total strong {
    margin-top: 4px;
    font-size: 26px;
    line-height: 1;
}
.employee-plus-minus-card { padding: 9px; border-left-width: 4px; }
.employee-plus-minus-card.is-minus { border-left-color: #dc2626; }
.employee-plus-minus-card.is-plus { border-left-color: #059669; }
.employee-plus-minus-card.is-balanced { border-left-color: #64748b; }
.employee-plus-minus-card > header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 7px;
    align-items: center;
}
.employee-plus-minus-card > header > span {
    padding: 4px 6px;
    border-radius: 8px;
    color: var(--primary-dark);
    background: var(--primary-soft);
    font-size: 10px;
    font-weight: 900;
}
.employee-plus-minus-card h2 { margin: 0; color: #17243a; font-size: 13px; line-height: 1.2; }
.employee-plus-minus-card header p { margin: 2px 0 0; color: var(--muted); font-size: 9px; }
.employee-plus-minus-card header > strong {
    display: grid;
    justify-items: end;
    gap: 1px;
    font-size: 15px;
}
.employee-plus-minus-card header > strong > span {
    color: var(--muted);
    font-size: 7px;
    font-weight: 850;
    letter-spacing: .035em;
    text-transform: uppercase;
}
.employee-plus-minus-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 4px;
    margin-top: 7px;
}
.employee-plus-minus-metrics > div {
    min-width: 0;
    padding: 5px 4px;
    border-radius: 8px;
    background: #f5f8fc;
    text-align: center;
}
.employee-plus-minus-metrics strong {
    display: block;
    margin-top: 2px;
    overflow-wrap: anywhere;
    color: #17243a;
    font-size: 10px;
}
.employee-plus-minus-metrics .employee-plus-minus-period {
    border: 1px solid #d7e1ec;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .8);
}
.employee-plus-minus-metrics .employee-plus-minus-period.is-plus { background: #eaf9f1; border-color: #98d9b8; }
.employee-plus-minus-metrics .employee-plus-minus-period.is-minus { background: #fff0f0; border-color: #f1aaaa; }
.employee-plus-minus-metrics .employee-plus-minus-period.is-balanced { background: #eef2f7; border-color: #cbd5e1; }
.employee-plus-minus-metrics .employee-plus-minus-period span { font-size: 7px; }
.employee-plus-minus-metrics .employee-plus-minus-period strong {
    font-size: 11px;
    font-weight: 900;
}

@media (max-width: 680px) {
    .employee-directory-grid,
    .employee-holiday-list,
    .employee-plus-minus-list { grid-template-columns: 1fr; }
}

@media (max-width: 420px) {
    .page-directory.role-employee .container,
    .page-holidays.role-employee .container,
    .page-plus-minus-report.role-employee .container { padding: 9px !important; }
    .employee-directory-search { padding: 8px !important; }
    .employee-directory-search form > div { grid-template-columns: minmax(0, 1fr) auto; }
    .employee-directory-search form > div .btn { grid-column: 1 / -1; }
    .employee-directory-card,
    .employee-holiday-card,
    .employee-plus-minus-card { border-radius: 13px; }
    .employee-report-summary > div { padding: 7px 3px; }
    .employee-report-summary strong { font-size: 13px; }
}
.job-remove-row:hover { color: #fff; background: #b42318; box-shadow: none; transform: none; }
.job-card-grid tr.is-row-dragging > * { opacity: .42; }
.job-card-grid tr.is-row-drop-before > * { border-top: 3px solid var(--primary) !important; }
.job-card-grid tr.is-row-drop-after > * { border-bottom: 3px solid var(--primary) !important; }

.job-card-savebar {
    position: sticky;
    bottom: 6px;
    z-index: 20;
    display: flex;
    margin-top: 9px;
    padding: 9px 11px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border: 1px solid #cbd7e6;
    border-radius: 13px;
    background: rgba(255, 255, 255, .95);
    box-shadow: 0 12px 32px rgba(15, 23, 42, .14);
    backdrop-filter: blur(12px);
}
.job-card-savebar > div { display: grid; }
.job-card-savebar span { color: var(--muted); font-size: 11px; }
.job-card-savebar strong span { color: inherit; font-size: inherit; }
.job-card-savebar button { min-height: 40px; padding: 8px 16px; }
.job-card-balance-sum {
    position: fixed;
    right: 22px;
    bottom: var(--job-card-balance-clearance, 86px);
    z-index: 18;
    display: flex;
    min-width: 310px;
    padding: 11px 12px;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border: 1px solid #93b4dc;
    border-radius: 13px;
    color: #18304f;
    background: rgba(242, 248, 255, .97);
    box-shadow: 0 15px 38px rgba(15, 23, 42, .22);
    backdrop-filter: blur(12px);
}
.job-card-balance-sum[hidden] { display: none !important; }
.job-card-balance-sum > div { display: grid; }
.job-card-balance-sum span { color: #607089; font-size: 10px; font-weight: 750; }
.job-card-balance-sum strong { font-size: 14px; }
.job-card-balance-sum b { color: var(--primary); font-size: 18px; font-variant-numeric: tabular-nums; }
.job-card-run-estimate { display: grid; gap: 2px; margin-top: 7px; padding-top: 7px; border-top: 1px solid #d8e2ef; }
.job-card-run-estimate[hidden] { display: none !important; }
.job-card-run-estimate strong { color: #193152; font-size: 12px; }
.job-card-run-estimate b { color: #137a3d; font-size: 15px; font-variant-numeric: tabular-nums; }
.job-card-run-estimate small { color: #607089; font-size: 9px; line-height: 1.35; }
.job-card-balance-sum button { min-height: 34px; padding: 5px 9px; font-size: 11px; }
.job-card-empty { text-align: center; }

@media (max-width: 1100px) {
    .job-card-month-controls,
    .job-card-sheet-head { grid-template-columns: minmax(0, 1fr); }
    .job-card-toolbar { align-items: stretch; flex-direction: column; }
    .job-card-carry-form button { width: 100%; }
}

@media (max-width: 767px) {
    body.job-card-page .container { padding: 8px 6px 24px !important; }
    .job-card-planner-link { width: 100%; text-align: center; }
    .job-card-factor { width: 100%; min-width: 0; padding: 10px 13px; text-align: left; }
    .job-card-factor strong { font-size: 20px; }
    .job-card-month-controls { gap: 12px; }
    .job-card-create-form,
    .job-card-open-form { grid-template-columns: minmax(0, 1fr); }
    .job-card-create-form button,
    .job-card-open-form button { width: 100%; margin-bottom: 0; }
    .job-card-open-actions { width: 100%; }
    .job-card-open-actions .btn { flex: 1 1 0; width: auto; }
    .job-card-month-title { padding: 12px; }
    .job-card-mini-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .job-card-mini-stats > div { padding: 10px; border-bottom: 1px solid var(--border); }
    .job-card-mini-stats > div:nth-child(4) { border-left: 0; }
    .job-card-mini-stats > div:nth-last-child(-n+2) { border-bottom: 0; }
    .job-card-mini-stats strong { font-size: 15px; }
    .job-card-ga-panel { padding: 13px 12px; }
    .job-card-ga-heading { display: grid; gap: 8px; }
    .job-card-ga-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .job-card-ga-stats > div:nth-child(3) { border-left: 0; border-top: 1px solid #dfe7f0; }
    .job-card-ga-stats > div:nth-child(4) { border-top: 1px solid #dfe7f0; }
    .job-card-ga-stats strong { font-size: 16px; }
    .job-card-workspace { padding: 6px !important; }
    .job-card-toolbar { padding-bottom: 7px; }
    .job-card-toolbar-group { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .job-card-toolbar-group .btn { width: 100%; }
    .job-card-mobile-select-toggle { display: inline-flex; }
    .job-card-paste-note { grid-column: 1 / -1; padding: 4px 2px; }
    .job-card-grid-wrap { max-height: none; border-radius: 8px; }
    .job-card-grid input,
    .job-card-grid select { font-size: 16px; }
    .job-card-savebar { bottom: max(5px, env(safe-area-inset-bottom)); display: grid; }
    .job-card-savebar button { width: 100%; }
    .job-card-balance-sum { right: 10px; bottom: var(--job-card-balance-clearance, 128px); left: 10px; min-width: 0; }
}

@media print {
    body.job-card-page .container { width: 100%; padding: 0; }
    .job-card-workspace { padding: 0 !important; border: 0; box-shadow: none !important; }
    .job-card-grid-wrap { max-height: none; overflow: visible; border: 0; }
    .job-card-grid { min-width: 0; font-size: 7px; }
    .job-card-grid thead th,
    .job-card-grid .job-row-number,
    .job-card-grid .job-row-action { position: static; }
    .job-card-grid input,
    .job-card-grid select { font-size: 7px; }
    .job-card-grid .job-row-action { display: none; }
    .job-column-resizer { display: none; }
}

/* V18 final overrides - keep Daily Works dense after all legacy rules */
.employee-profile-job-row.is-designation-only { grid-template-columns: minmax(0, 1fr); }
.daily-works-compact-heading { margin: 0 0 7px; padding: 0 2px; }
.daily-works-compact-heading h1 {
    margin: 0;
    color: #12213a;
    font-size: clamp(19px, 2.2vw, 25px);
    line-height: 1.15;
}
.page-daily-allotted-works .compact-filter-card {
    margin-bottom: 8px;
    padding: 9px 10px !important;
    border-radius: 14px;
}
.page-daily-allotted-works .daily-work-search-form {
    grid-template-columns: minmax(190px, 260px) minmax(240px, 1fr) auto;
    gap: 8px;
}
.page-daily-allotted-works .daily-work-search-form label { margin-bottom: 3px; font-size: 10px; }
.page-daily-allotted-works .daily-work-search-form input,
.page-daily-allotted-works .daily-work-search-form select,
.page-daily-allotted-works .daily-work-search-actions .btn,
.page-daily-allotted-works .daily-work-search-actions button {
    min-height: 38px;
    padding: 6px 9px;
    font-size: 12px;
}
.page-daily-allotted-works .daily-work-search-actions {
    display: flex;
    width: auto;
    flex-wrap: nowrap;
    gap: 5px;
}
.page-daily-allotted-works .month-title-pill {
    display: flex;
    min-height: 40px;
    margin: 0 0 8px;
    padding: 7px 11px;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border-radius: 13px;
}
.page-daily-allotted-works .month-title-pill strong,
.page-daily-allotted-works .month-title-pill span { font-size: 12px; }
.page-daily-allotted-works .compact-daily-month-list { gap: 7px; }
.page-daily-allotted-works .compact-day-card { padding: 6px !important; border-radius: 14px !important; }
.page-daily-allotted-works .compact-date-head {
    min-height: 34px;
    padding: 5px 8px !important;
    border-radius: 10px !important;
    font-size: 14px !important;
}
.page-daily-allotted-works .compact-date-head .btn-small {
    min-height: 28px;
    padding: 3px 7px;
    font-size: 10px;
}
.page-daily-allotted-works .daily-work-lines-plain { margin-top: 4px; border-radius: 10px; }
.page-daily-allotted-works .daily-work-plain-line { padding: 5px 8px; font-size: 13px; line-height: 1.22; }
.page-daily-allotted-works .night-shift-token-highlight {
    display: inline-block;
    padding: 1px 4px;
    border-radius: 5px;
    background: #dceeff;
    color: #164b70;
}
.page-daily-allotted-works .month-pagination { margin-top: 8px; gap: 6px; }
.page-daily-allotted-works .month-pagination .btn,
.page-daily-allotted-works .month-pagination .btn-disabled {
    min-height: 36px;
    padding: 6px 9px;
    font-size: 11px;
}

@media (max-width: 720px) {
    .page-daily-allotted-works .container { padding: 8px !important; }
    .page-daily-allotted-works .daily-work-search-form {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 6px;
    }
    .page-daily-allotted-works .daily-work-period-field { grid-column: 1 / -1; }
    .page-daily-allotted-works .daily-work-keyword-field { grid-column: 1; }
    .page-daily-allotted-works .daily-work-search-actions {
        grid-column: 2;
        display: flex;
        width: auto;
        align-self: end;
    }
    .page-daily-allotted-works .daily-work-search-actions .btn,
    .page-daily-allotted-works .daily-work-search-actions button {
        width: auto;
        min-width: 52px;
        padding-inline: 7px;
    }
    .page-daily-allotted-works .month-title-pill { flex-direction: row; }
    .page-daily-allotted-works .daily-work-plain-line { font-size: 12.5px; }
}

@media (max-width: 390px) {
    .page-daily-allotted-works .daily-work-search-actions .btn,
    .page-daily-allotted-works .daily-work-search-actions button {
        min-width: 46px;
        padding-inline: 5px;
        font-size: 10px;
    }
    .page-daily-allotted-works .month-title-pill span { font-size: 10px; }
}

/* V19 Attendance Span and Absence Report */
.page-incentive-attendance-report .container { width: min(1540px, 100%); }
.attendance-report-heading {
    display: flex;
    margin-bottom: 10px;
    padding: 16px 18px;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border: 1px solid var(--border);
    border-radius: 18px;
    background: linear-gradient(135deg, #fff 0%, #f1f7ff 100%);
    box-shadow: 0 9px 28px rgba(16, 24, 40, .06);
}
.attendance-report-heading .eyebrow {
    display: block;
    margin-bottom: 3px;
    color: var(--primary);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .09em;
}
.attendance-report-heading h1 { margin: 0; font-size: clamp(21px, 2.3vw, 30px); line-height: 1.12; }
.attendance-report-heading p { margin: 4px 0 0; color: var(--muted); font-size: 12px; }
.attendance-report-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 10px;
}
.attendance-report-summary .stat { min-height: 64px; padding: 9px 12px; border-radius: 14px; }
.attendance-report-summary .number { font-size: 17px; }
.attendance-report-summary .label { font-size: 10px; }
.attendance-absence-card,
.attendance-sheet-card { margin-bottom: 10px; padding: 12px; border-radius: 16px; }
.attendance-absence-card > summary {
    display: flex;
    min-height: 34px;
    padding: 3px 2px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    cursor: pointer;
    list-style-position: inside;
}
.attendance-absence-card > summary strong { font-size: 15px; }
.attendance-absence-card > summary span { color: var(--muted); font-size: 11px; font-weight: 700; }
.attendance-absence-list { display: grid; gap: 5px; padding-top: 8px; }
.attendance-absence-row {
    display: grid;
    grid-template-columns: minmax(220px, .7fr) minmax(0, 2fr);
    gap: 9px;
    padding: 6px 8px;
    border: 1px solid #dbe5f1;
    border-radius: 10px;
    background: #f8fbff;
}
.attendance-absence-row > div:first-child { display: flex; align-items: center; gap: 7px; }
.attendance-absence-row strong { color: #a33121; font-size: 12px; font-variant-numeric: tabular-nums; }
.attendance-absence-row > div:first-child span { overflow: hidden; font-size: 12px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.attendance-absence-dates { display: flex; flex-wrap: wrap; gap: 4px; }
.attendance-absence-dates span {
    padding: 4px 8px;
    border-radius: 999px;
    background: #fff1ee;
    color: #912018;
    font-size: clamp(12px, .9vw, 14px);
    font-weight: 850;
    line-height: 1.25;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.attendance-empty { margin-top: 7px; padding: 9px; border: 1px dashed var(--border); border-radius: 10px; color: var(--muted); font-size: 12px; }
.attendance-sheet-topbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.attendance-sheet-topbar h2 { margin: 0; font-size: 18px; }
.attendance-sheet-topbar p { margin: 3px 0 0; max-width: 760px; }
.attendance-sheet-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 5px; }
.attendance-sheet-actions .btn { min-height: 31px; padding: 4px 8px; font-size: 10px; }
.attendance-token-sort-form { margin: 0; }
.attendance-rule-strip {
    display: flex;
    margin: 8px 0;
    padding: 6px 8px;
    flex-wrap: wrap;
    gap: 5px 14px;
    border: 1px solid #d8e4f2;
    border-radius: 10px;
    background: #f5f9ff;
    color: #40516a;
    font-size: 10px;
}
.attendance-grid-scroll {
    max-height: none;
    overflow-x: auto;
    overflow-y: hidden;
    border: 1px solid #cbd8e8;
    border-radius: 11px;
    background: #fff;
}
.attendance-grid { width: 100%; min-width: 1020px; border-collapse: separate; border-spacing: 0; table-layout: fixed; font-size: 11px; }
.attendance-grid col.attendance-col-number { width: 62px; }
.attendance-grid col.attendance-col-token { width: 116px; }
.attendance-grid col.attendance-col-name { width: 226px; }
.attendance-grid col.attendance-col-date { width: 112px; }
.attendance-grid col.attendance-col-time { width: 88px; }
.attendance-grid col.attendance-col-ga { width: 118px; }
.attendance-grid col.attendance-col-actions { width: 132px; }
.attendance-grid th,
.attendance-grid td { height: 36px; padding: 2px; border-right: 1px solid #dce5ef; border-bottom: 1px solid #dce5ef; }
.attendance-grid thead th {
    position: sticky;
    top: 0;
    z-index: 4;
    height: 34px;
    padding: 5px 4px;
    background: #17233b;
    color: #fff;
    font-size: 10px;
    letter-spacing: .025em;
    text-align: center;
    white-space: nowrap;
}
.attendance-grid th:nth-child(1) { width: 62px; }
.attendance-grid th:nth-child(2) { width: 116px; }
.attendance-grid th:nth-child(3) { width: 226px; }
.attendance-grid th:nth-child(4),
.attendance-grid th:nth-child(6) { width: 112px; }
.attendance-grid th:nth-child(5),
.attendance-grid th:nth-child(7) { width: 88px; }
.attendance-grid th:nth-child(8) { width: 118px; }
.attendance-grid th:nth-child(9) { width: 132px; }
.attendance-grid input {
    width: 100%;
    min-height: 30px;
    margin: 0;
    padding: 4px 7px;
    border: 1px solid transparent;
    border-radius: 5px;
    background: transparent;
    color: #152238;
    font-size: 12px;
    font-variant-numeric: tabular-nums;
}
.attendance-grid input[type="checkbox"] { width: 16px; min-width: 16px; height: 16px; min-height: 16px; margin: 0; padding: 0; vertical-align: middle; }
.attendance-grid input:focus { position: relative; z-index: 2; border-color: #2d6ad8; outline: 2px solid rgba(45, 106, 216, .2); background: #fff; }
.attendance-grid input[readonly] { color: #273854; font-weight: 800; cursor: default; }
.attendance-grid .is-generated td { background: #fbfdff; }
.attendance-grid .is-custom td { background: #fffdf5; }
.attendance-grid .is-active-row td { box-shadow: inset 0 1px rgba(39, 100, 205, .18), inset 0 -1px rgba(39, 100, 205, .18); }
.attendance-grid td.attendance-shift-date-cell.is-shift-day { background: #fff8c9; }
.attendance-grid td.attendance-shift-date-cell.is-shift-night { background: #e1f2ff; }
.attendance-grid td.attendance-shift-date-cell.is-shift-day input,
.attendance-grid td.attendance-shift-date-cell.is-shift-night input { background: transparent; }
.attendance-grid .has-shift-error td { background: #fff4f4 !important; }
.attendance-grid .has-shift-error input:invalid { border-color: #c9332b; box-shadow: inset 0 0 0 1px rgba(201, 51, 43, .18); }
.attendance-grid td.is-cell-selected { background: #dceaff !important; box-shadow: inset 0 0 0 1px #4d7fd7; }
.attendance-mobile-select-toggle { display: none; }
.attendance-mobile-select-toggle[aria-pressed="true"] {
    border-color: #0d746d;
    background: #168d85;
    color: #fff;
}
.attendance-sheet-card.is-mobile-cell-selecting .attendance-grid td[data-col] {
    cursor: cell;
    touch-action: manipulation;
}
.attendance-sheet-card.is-mobile-cell-selecting .attendance-grid td[data-col] > * {
    pointer-events: none;
}
.attendance-ga-cell { padding: 2px 9px !important; overflow: hidden; text-align: right; vertical-align: middle; }
.attendance-ga-cell output { display: inline-block; min-width: 52px; overflow: visible; color: #0d665f; font-size: 12px; font-weight: 900; font-variant-numeric: tabular-nums; text-align: right; }
.attendance-row-order { display: flex; align-items: center; justify-content: center; gap: 3px; cursor: grab; user-select: none; text-align: center; white-space: nowrap; }
.attendance-row-order:active { cursor: grabbing; }
.attendance-row-grip { display: inline-block; margin: 0; color: #557399; font-size: 11px; line-height: 1; }
.attendance-row-order:hover { background: #e7f0ff !important; }
.attendance-row-number { color: var(--muted); font-weight: 900; text-align: center; }
.attendance-name-cell { position: relative; }
.attendance-name-cell.has-pt-badge .attendance-name-inline { display: flex; align-items: center; gap: 4px; }
.attendance-name-cell.has-pt-badge .attendance-name-inline > input { flex: 1 1 0; min-width: 0; width: auto; }
.pt-hours-badge { display: inline-block; flex: 0 0 auto; margin: 0; padding: 2px 6px; border: 1px solid #efbd70; border-radius: 999px; background: #ffe0ad; color: #804600; font-size: 10px; font-weight: 800; line-height: 1.2; vertical-align: middle; white-space: nowrap; }
.attendance-grid .attendance-data-row.is-dragging td { opacity: .46; }
.attendance-grid .attendance-data-row.is-drag-target-above td { box-shadow: inset 0 3px 0 #2478b8; }
.attendance-grid .attendance-data-row.is-drag-target-below td { box-shadow: inset 0 -3px 0 #2478b8; }
.attendance-row-actions { display: grid; grid-template-columns: 72px 52px; align-items: center; justify-content: center; gap: 3px; white-space: nowrap; }
.attendance-row-actions .btn { width: 100%; min-width: 0; min-height: 27px; padding: 3px 2px; overflow: hidden; font-size: 9px; text-overflow: clip; }

/* At desktop widths the table fills its card. The 1180px working width is
   retained below this breakpoint so phones and smaller laptops can scroll
   horizontally without squeezing or hiding any cell values. */
@media (min-width: 1320px) {
    .attendance-grid { min-width: 0; }
}
.attendance-savebar {
    position: sticky;
    bottom: 7px;
    z-index: 5;
    display: flex;
    margin-top: 7px;
    padding: 7px 8px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border: 1px solid #c9d8e7;
    border-radius: 11px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 8px 24px rgba(16, 24, 40, .12);
}
.attendance-savebar span { color: var(--muted); font-size: 10px; }
.attendance-savebar button { min-height: 34px; padding: 5px 14px; }
.attendance-selection-total {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 80;
    min-width: 190px;
    padding: 10px 14px;
    border: 2px solid #127a73;
    border-radius: 14px;
    color: #073f3b;
    background: #effcf8;
    box-shadow: 0 12px 28px rgba(15, 118, 110, .24);
    font-size: 13px;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
    text-align: center;
}
.attendance-bulk-paste { margin-top: 8px; padding: 7px 9px; border: 1px solid var(--border); border-radius: 10px; background: #fbfcfe; }
.attendance-bulk-paste summary { cursor: pointer; font-size: 11px; font-weight: 800; }
.attendance-bulk-paste textarea { margin-top: 6px; min-height: 90px; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 11px; }
.attendance-refresh-row { display: flex; margin-top: 8px; justify-content: flex-end; }
.attendance-refresh-row button { min-height: 32px; padding: 4px 9px; font-size: 10px; }
.attendance-period-pagination {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 12px 0 4px;
}
.attendance-period-pagination .btn {
    display: flex;
    min-height: 48px;
    padding: 8px 12px;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
    gap: 1px;
    text-align: left;
}
.attendance-period-pagination .btn:last-child { align-items: flex-end; text-align: right; }
.attendance-period-pagination span { font-size: 10px; font-weight: 800; }
.attendance-period-pagination strong { font-size: 12px; }

@media (max-width: 767px) {
    body.page-incentive-attendance-report .container { padding: 8px 6px 24px !important; }
    .attendance-report-heading { padding: 12px; align-items: stretch; flex-direction: column; }
    .attendance-report-heading .btn { width: 100%; }
    .attendance-report-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .attendance-report-summary .stat { min-height: 56px; padding: 7px 9px; }
    .attendance-report-summary .number { font-size: 15px; }
    .attendance-absence-card,
    .attendance-sheet-card { padding: 8px; }
    .attendance-absence-row { grid-template-columns: minmax(0, 1fr); gap: 4px; }
    .attendance-sheet-topbar { flex-direction: column; }
    .attendance-sheet-actions { display: grid; width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .attendance-sheet-actions .btn { width: 100%; }
    .attendance-mobile-select-toggle { display: inline-flex; }
    .attendance-token-sort-form { display: contents; }
    .attendance-rule-strip { display: grid; }
    .attendance-grid-scroll { max-height: none; overflow-x: auto; overflow-y: hidden; }
    .attendance-grid input { font-size: 16px; }
    .attendance-savebar { bottom: max(5px, env(safe-area-inset-bottom)); display: grid; }
    .attendance-savebar button { width: 100%; }
    .attendance-selection-total { right: 10px; bottom: max(78px, calc(env(safe-area-inset-bottom) + 70px)); min-width: 0; padding: 8px 11px; font-size: 12px; }
    .attendance-refresh-row button { width: 100%; }
    .attendance-period-pagination { gap: 7px; margin-top: 8px; }
    .attendance-period-pagination .btn { min-height: 43px; padding: 6px 8px; }
}

@media print {
    .attendance-report-heading .btn,
    .attendance-sheet-actions,
    .attendance-savebar,
    .attendance-selection-total,
    .attendance-bulk-paste,
    .attendance-refresh-row,
    .attendance-period-pagination,
    .attendance-row-actions { display: none !important; }
    .attendance-grid-scroll { max-height: none; overflow: visible; }
    .attendance-grid { min-width: 0; font-size: 8px; }
    .attendance-grid input { min-height: 20px; padding: 1px 2px; font-size: 8px; }
}

/* V36.2: one authoritative off-canvas menu at every viewport width.
   This block intentionally comes last so older desktop navigation rules
   cannot put the drawer back into document flow or below its backdrop. */
body.portal-shell .nav-toggle {
    display: grid !important;
    flex: 0 0 auto;
}

body.portal-shell .navtabs {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: auto !important;
    z-index: 2147483640 !important;
    display: flex !important;
    width: min(90vw, 390px) !important;
    max-width: 390px !important;
    height: 100vh !important;
    height: 100dvh !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 12px calc(18px + env(safe-area-inset-bottom)) !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    gap: 6px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    border: 0 !important;
    background: #f8faff !important;
    box-shadow: -20px 0 60px rgba(15, 23, 42, .24) !important;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate3d(105%, 0, 0) !important;
    transition: transform .24s ease, opacity .18s ease, visibility 0s linear .24s !important;
}

body.portal-shell .navtabs.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translate3d(0, 0, 0) !important;
    transition-delay: 0s !important;
}

body.portal-shell .mobile-nav-head {
    position: sticky !important;
    top: 0;
    z-index: 2;
    display: flex !important;
    min-height: 72px;
    margin: 0 -12px 8px;
    padding: 13px 12px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-bottom: 1px solid #dce5f0;
    background: rgba(248, 250, 255, .97);
}

body.portal-shell .nav-close {
    display: grid !important;
}

body.portal-shell .navtabs a {
    display: flex !important;
    width: 100% !important;
    min-height: 46px;
    padding: 10px 12px !important;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-start;
    border: 1px solid #e0e7f0;
    border-radius: 12px !important;
    color: #33445f;
    background: #fff;
    font-size: 14px;
}

body.portal-shell .navtabs a:hover,
body.portal-shell .navtabs a:focus-visible {
    color: var(--primary-dark);
    border-color: #bfd0e6;
    background: #edf4ff;
}

body.portal-shell .navtabs a.is-active,
body.portal-shell .navtabs a[aria-current="page"] {
    color: #fff;
    border-color: transparent;
    background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
}

body.portal-shell .navtabs button.mobile-nav-logout {
    display: flex !important;
    margin-bottom: 4px;
    color: #a62a21;
    border-color: #f0c8c5;
    background: #fff4f3;
}

body.portal-shell .nav-backdrop {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483639 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: rgba(15, 23, 42, .58) !important;
    box-shadow: none !important;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: none !important;
    transition: opacity .2s ease, visibility 0s linear .2s !important;
}

body.portal-shell.nav-open .nav-backdrop {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition-delay: 0s !important;
}

@media (max-width: 767px) {
    body.portal-shell .navtabs {
        width: min(92vw, 360px) !important;
        max-width: 360px !important;
    }
}

@media print {
    body.portal-shell .nav-toggle,
    body.portal-shell .navtabs,
    body.portal-shell .nav-backdrop {
        display: none !important;
    }
}

/* V36.3: public directory, coach list, and Night Shift readability. */
body.portal-shell .header-home,
body.portal-shell .nav-toggle {
    border: 0 !important;
    border-radius: 9px !important;
    background: transparent !important;
    box-shadow: none !important;
}
body.portal-shell .header-home:hover,
body.portal-shell .header-home:focus-visible,
body.portal-shell .nav-toggle:hover,
body.portal-shell .nav-toggle:focus-visible {
    background: rgba(255, 255, 255, .1) !important;
}
body.portal-shell .header-home img,
body.portal-shell .nav-toggle img {
    display: block;
    width: 42px;
    height: 42px;
    object-fit: contain;
}

main > .card:first-child::after,
.app-title-card::after {
    display: none !important;
    content: none !important;
}

.employee-directory-search {
    padding: 13px 15px !important;
}
.employee-directory-search label {
    margin-bottom: 6px;
    font-size: 13px;
}
.employee-directory-search input,
.employee-directory-search select,
.employee-directory-search .btn,
.employee-directory-search button {
    min-height: 44px;
    padding: 8px 11px;
    font-size: 14px;
}
.employee-directory-grid {
    gap: 12px;
}
.employee-directory-card {
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 12px;
    padding: 12px;
    border-width: 2px;
}
.employee-directory-photo {
    width: 72px;
    height: 82px;
    font-size: 27px;
}
.employee-directory-body h2 {
    margin-bottom: 8px;
    font-size: 17px;
    line-height: 1.25;
}
.employee-directory-ids {
    gap: 6px;
}
.employee-directory-ids span {
    padding: 6px 7px;
    font-size: 10px;
    line-height: 1.2;
}
.employee-directory-ids strong {
    margin-top: 3px;
    font-size: 13px;
    line-height: 1.25;
}
.employee-directory-body p {
    margin-top: 7px;
    font-size: 13px;
    line-height: 1.35;
}
.employee-directory-role {
    color: #344054 !important;
}
.employee-directory-role strong {
    color: #17243a;
    font-size: 13px;
}
.employee-directory-contact {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid #dde5ee;
}
.employee-directory-contact p {
    display: grid;
    min-width: 0;
    margin: 0;
}
.employee-directory-contact p > span {
    color: var(--muted);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .02em;
    text-transform: uppercase;
}
.employee-directory-contact p > strong {
    margin-top: 2px;
    overflow-wrap: anywhere;
    color: #17243a;
    font-size: 13px;
}
.employee-directory-mobile {
    padding-top: 0;
    border-top: 0;
}

.employee-directory-search .public-coach-filter-grid {
    display: grid;
    grid-template-columns: minmax(180px, .55fr) minmax(240px, 1fr) auto;
    gap: 10px;
    align-items: end;
}
.public-coach-filter-field {
    display: grid;
}
.public-coach-filter-actions {
    display: flex;
    align-items: center;
    gap: 7px;
}
.public-coach-filter-actions .btn,
.public-coach-filter-actions button {
    white-space: nowrap;
}
.public-coach-card {
    display: block;
    min-height: 58px;
    padding: 11px 14px;
    border-width: 2px;
}
.public-coach-card-body {
    display: flex;
    min-width: 0;
    min-height: 32px;
    align-items: center;
    gap: 9px;
}
.public-coach-card .public-coach-identity {
    min-width: 0;
    margin: 0;
    overflow: hidden;
    color: #10233f;
    font-size: 18px;
    font-weight: 950;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.public-coach-separator {
    color: #9aaabd;
    font-size: 17px;
    font-weight: 800;
}
.public-coach-card .public-coach-date {
    display: inline-flex;
    min-height: 28px;
    padding: 4px 7px;
    align-items: center;
    gap: 4px;
    border: 1px solid #bcd7e1;
    border-radius: 8px;
    color: #0e5f6b;
    background: #eaf8fa;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
}
.public-coach-card .public-coach-date span {
    color: #587081;
    font-size: 8px;
    font-weight: 850;
    letter-spacing: .01em;
    text-transform: uppercase;
}

.public-night-shift-title {
    display: flex;
    margin-bottom: 12px;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}
.public-night-shift-title h1 {
    margin: 0;
}
.public-night-shift-date-range {
    display: flex;
    align-items: center;
    gap: 8px;
}
.public-night-shift-date-range > span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}
.public-night-shift-date-range time {
    display: grid;
    min-width: 142px;
    padding: 8px 12px;
    border: 2px solid #6fb6c2;
    border-radius: 12px;
    background: #effbfc;
    text-align: center;
}
.public-night-shift-date-range time span {
    color: #39717a;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.public-night-shift-date-range time strong {
    margin-top: 2px;
    color: #123f4b;
    font-size: 16px;
    font-variant-numeric: tabular-nums;
}
.public-night-shift-current-card {
    padding-top: 18px !important;
}
.public-night-shift-history-range {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
}
.public-night-shift-history-range time {
    padding: 4px 7px;
    border: 1px solid #bed8df;
    border-radius: 7px;
    color: #145b66;
    background: #edf9fb;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
}
.public-night-shift-history-range > span {
    color: var(--muted);
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
}

@media (max-width: 767px) {
    body.portal-shell .header-home img,
    body.portal-shell .nav-toggle img {
        width: 34px;
        height: 34px;
    }
    .employee-directory-card {
        grid-template-columns: 64px minmax(0, 1fr);
        gap: 10px;
        padding: 10px;
    }
    .employee-directory-photo {
        width: 64px;
        height: 76px;
        font-size: 24px;
    }
    .employee-directory-body h2 {
        font-size: 16px;
    }
    .employee-directory-ids span {
        padding: 5px;
        font-size: 9px;
    }
    .employee-directory-ids strong {
        font-size: 13px;
    }
    .employee-directory-body p,
    .employee-directory-role strong,
    .employee-directory-contact p > strong {
        font-size: 13px;
    }
    .employee-directory-search .public-coach-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .public-coach-filter-actions {
        grid-column: 1 / -1;
    }
    .public-coach-filter-actions .btn,
    .public-coach-filter-actions button {
        flex: 1 1 0;
    }
    .public-night-shift-title {
        align-items: stretch;
        flex-direction: column;
    }
    .public-night-shift-date-range {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    }
    .public-night-shift-date-range time {
        min-width: 0;
        padding: 7px 8px;
    }
    .public-night-shift-date-range time strong {
        font-size: 14px;
    }
}

@media (max-width: 420px) {
    .employee-directory-search {
        padding: 10px !important;
    }
    .employee-directory-search .public-coach-filter-grid {
        grid-template-columns: minmax(0, 1fr);
    }
    .public-coach-filter-actions {
        grid-column: auto;
    }
    .public-coach-card {
        padding: 10px 11px;
    }
    .public-coach-card-body {
        gap: 5px;
    }
    .public-coach-card .public-coach-identity {
        font-size: 16px;
    }
    .public-coach-card .public-coach-date {
        min-height: 26px;
        padding-inline: 5px;
        gap: 2px;
        font-size: 9.5px;
    }
    .public-coach-card .public-coach-date span {
        font-size: 0;
    }
    .public-coach-card .public-coach-date span::after {
        font-size: 7px;
        font-weight: 900;
    }
    .public-coach-card .public-coach-allocated-date span::after {
        content: "A";
    }
    .public-coach-card .public-coach-updated-date span::after {
        content: "U";
    }
}

/* V36.4 - compact Daily Entry date toolbar and first-line action rules */
.daily-entry-toolbar-card {
    padding: 14px 18px;
}
.daily-entry-toolbar {
    display: grid;
    grid-template-columns: minmax(250px, 1fr) auto auto;
    gap: 8px;
    align-items: center;
}
.daily-entry-date-form,
.daily-entry-fix-form {
    min-width: 0;
    margin: 0;
}
.daily-entry-date-form .date-picker-wrap {
    grid-template-columns: minmax(0, 1fr) 46px;
    gap: 6px;
}
.daily-entry-date-form input,
.daily-entry-date-form .native-date-picker,
.daily-entry-toolbar .btn,
.daily-entry-toolbar button {
    min-height: 42px;
    border-radius: 12px;
}
.daily-entry-date-form .native-date-picker {
    width: 46px;
    min-width: 46px;
}
.daily-entry-toolbar .btn,
.daily-entry-toolbar button {
    padding: 8px 14px;
    white-space: nowrap;
}
.daily-entry-fix-compact {
    display: none;
}
.daily-entry-date-context {
    display: flex;
    margin-top: 8px;
    padding-top: 8px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-top: 1px solid #dbe5ed;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.3;
}
.daily-entry-date-context strong {
    color: var(--text);
    font-size: 14px;
    white-space: nowrap;
}
.daily-entry-closed-alert {
    margin-bottom: 14px;
}
.daily-token-sequence-card {
    padding-top: 14px;
    padding-bottom: 14px;
}
.remove-work-line[hidden] {
    display: none !important;
}

@media (max-width: 640px) {
    .daily-entry-toolbar-card {
        padding: 10px;
    }
    .daily-entry-toolbar {
        grid-template-columns: minmax(0, 1fr) auto auto;
        gap: 5px;
    }
    .daily-entry-date-form .date-picker-wrap {
        grid-template-columns: minmax(0, 1fr) 40px;
        gap: 4px;
    }
    .daily-entry-date-form input {
        min-width: 0;
        padding: 7px 8px;
        font-size: 14px;
    }
    .daily-entry-date-form .native-date-picker {
        width: 40px;
        min-width: 40px;
    }
    .daily-entry-toolbar .btn,
    .daily-entry-toolbar button {
        min-height: 40px;
        padding: 6px 9px;
        border-radius: 10px;
        font-size: 12px;
    }
    .daily-entry-fix-full {
        display: none;
    }
    .daily-entry-fix-compact {
        display: inline;
    }
    .daily-entry-date-context {
        display: grid;
        gap: 2px;
        margin-top: 7px;
        padding-top: 7px;
        font-size: 10px;
    }
    .daily-entry-date-context strong {
        font-size: 12px;
    }
    .daily-token-sequence-card {
        padding: 11px;
    }
}

/* V36.5 - unboxed Daily Entry list and shared long-page Go to top control */
.daily-entry-work-section {
    margin-bottom: 16px;
}
.go-to-top {
    position: fixed;
    right: 20px;
    bottom: 22px;
    z-index: 1200;
    display: inline-flex;
    width: 54px;
    min-width: 54px;
    min-height: 54px;
    padding: 6px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 1px;
    border: 2px solid rgba(255,255,255,.78);
    border-radius: 17px;
    color: #fff;
    background: linear-gradient(135deg, var(--primary), var(--accent));
    box-shadow: 0 12px 28px rgba(var(--primary-rgb), .28);
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
}
.go-to-top[hidden] {
    display: none !important;
}
.go-to-top svg {
    width: 23px;
    height: 23px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.4;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.go-to-top:hover,
.go-to-top:focus-visible {
    color: #fff;
    background: linear-gradient(135deg, var(--primary-dark), var(--primary));
    transform: translateY(-2px);
    box-shadow: 0 16px 32px rgba(var(--primary-rgb), .34);
}
.go-to-top.go-to-top-above-sticky {
    bottom: 82px;
}

@media (max-width: 640px) {
    .go-to-top {
        right: 12px;
        bottom: 14px;
        width: 48px;
        min-width: 48px;
        min-height: 48px;
        border-radius: 15px;
    }
    .go-to-top.go-to-top-above-sticky {
        bottom: 76px;
    }
    .go-to-top svg {
        width: 20px;
        height: 20px;
    }
}

/* V36.6 - collapsed Daily Works search and compact month span */
.page-daily-allotted-works .daily-work-filter-details {
    padding: 0 !important;
    overflow: hidden;
}
.page-daily-allotted-works .daily-work-filter-details > summary {
    display: flex;
    min-height: 44px;
    padding: 9px 12px;
    align-items: center;
    gap: 8px;
    list-style: none;
    color: var(--text);
    font-size: 13px;
    font-weight: 900;
}
.page-daily-allotted-works .daily-work-filter-details > summary::-webkit-details-marker {
    display: none;
}
.page-daily-allotted-works .daily-work-filter-details > summary::after {
    content: "+";
    display: inline-flex;
    width: 25px;
    height: 25px;
    margin-left: auto;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    color: var(--primary);
    background: #eaf1fb;
    font-size: 18px;
    line-height: 1;
}
.page-daily-allotted-works .daily-work-filter-details[open] > summary::after {
    content: "−";
}
.page-daily-allotted-works .daily-work-filter-details > summary small {
    padding: 3px 6px;
    border-radius: 999px;
    color: #8a4b00;
    background: #fff3d6;
    font-size: 9px;
    font-weight: 900;
    text-transform: uppercase;
}
.page-daily-allotted-works .daily-work-filter-body {
    padding: 9px 10px 10px;
    border-top: 1px solid #dbe5ed;
}
.page-daily-allotted-works .daily-work-filter-body .daily-work-search-form {
    margin: 0;
}
.page-daily-allotted-works .month-title-pill {
    justify-content: flex-start;
}
.page-daily-allotted-works .month-title-pill strong {
    font-size: 15px;
}

@media (max-width: 640px) {
    .page-daily-allotted-works .daily-work-filter-details > summary {
        min-height: 40px;
        padding: 7px 10px;
        font-size: 12px;
    }
    .page-daily-allotted-works .daily-work-filter-body {
        padding: 7px 8px 8px;
    }
    .page-daily-allotted-works .month-title-pill strong {
        font-size: 14px;
    }
}

/* V36.19 - one Coach Work card with grouped Daily Entry work lines */
.coach-work-page-heading {
    margin-bottom: 10px;
}
.coach-work-public-filter {
    padding: 10px 12px !important;
}
.coach-work-public-filter form {
    max-width: 920px;
}
.coach-work-filter-grid {
    display: grid;
    grid-template-columns: minmax(190px, 1fr) minmax(190px, 1fr) auto;
    gap: 8px;
    align-items: end;
}
.coach-work-filter-grid .field {
    min-width: 0;
}
.coach-work-filter-grid .field label {
    display: block;
    margin-bottom: 4px;
}
.coach-work-public-filter select {
    width: 100%;
    min-width: 0;
}
.coach-work-public-filter select:disabled {
    cursor: not-allowed;
    color: #708096;
    background: #edf2f7;
}
.coach-work-filter-actions {
    display: flex;
    align-items: end;
}
.coach-work-public-filter .btn {
    min-height: 42px;
    white-space: nowrap;
}
.coach-work-update-list {
    display: grid;
    gap: 10px;
}
.coach-work-coach-card {
    min-width: 0;
    border: 1px solid #d3e0ec;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
    box-shadow: none;
}
.coach-work-coach-card h2 {
    margin: 0;
    padding: 7px 10px;
    color: #fff;
    background: #17345f;
    font-size: 14px;
    font-weight: 950;
    line-height: 1.2;
}
.coach-work-column-heads,
.coach-work-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(150px, .34fr) minmax(105px, .24fr);
    gap: 10px;
    align-items: center;
}
.coach-work-coach-card.is-active { border-color: #b9ddc6; }
.coach-work-coach-card.is-active h2 { background: #e3f5e9; color: #176239; }
.coach-work-coach-card.is-inactive { border-color: #edc5c5; }
.coach-work-coach-card.is-inactive h2 { background: #fce7e7; color: #962e2e; }
.coach-work-column-heads {
    padding: 6px 12px;
    color: #53647a;
    background: #edf3fa;
    font-size: 9px;
    font-weight: 950;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.coach-work-column-heads span:last-child {
    text-align: right;
}
.coach-work-line {
    min-width: 0;
    padding: 7px 10px;
    border-top: 1px solid #dce6f0;
}
.coach-work-line:first-child {
    border-top: 0;
}
.coach-work-line:nth-child(even) {
    background: #f8fbfe;
}
.coach-work-line > div {
    min-width: 0;
}
.coach-work-line > div > span {
    display: none;
}
.coach-work-line-work strong {
    overflow-wrap: anywhere;
    color: #17243a;
    font-size: 14px;
    font-weight: 850;
    line-height: 1.3;
}
.coach-work-line-tokens strong {
    color: #0d6370;
    font-size: 12px;
    font-weight: 950;
    line-height: 1.35;
}
.coach-work-line-date {
    text-align: right;
}
.coach-work-line-date time {
    color: #163b66;
    font-size: 12px;
    font-weight: 950;
    white-space: nowrap;
}
.coach-work-empty {
    padding: 18px !important;
    text-align: center;
}
.coach-work-empty p {
    margin: 0;
    color: var(--muted);
    font-weight: 750;
}
.coach-work-pagination {
    margin-top: 10px;
}
@media (min-width: 760px) {
    .coach-work-update-list {
        gap: 7px;
    }
}

@media (max-width: 759px) {
    .coach-work-page-heading p {
        font-size: 11px;
    }
    .coach-work-public-filter {
        padding: 9px !important;
    }
    .coach-work-filter-grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 7px;
    }
    .coach-work-filter-actions {
        grid-column: 1 / -1;
    }
    .coach-work-filter-actions .btn {
        width: 100%;
    }
    .coach-work-coach-card {
        border-radius: 10px;
    }
    .coach-work-coach-card h2 {
        padding: 7px 10px;
        font-size: 14px;
    }
    .coach-work-column-heads {
        display: none;
    }
    .coach-work-line {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "work work"
            "tokens date";
        gap: 3px 10px;
        padding: 7px 10px;
    }
    .coach-work-line-work {
        grid-area: work;
        padding: 0;
        border-radius: 0;
        background: transparent;
    }
    .coach-work-line-tokens {
        grid-area: tokens;
    }
    .coach-work-line-date {
        grid-area: date;
    }
    .coach-work-line > div > span {
        display: block;
        margin-bottom: 2px;
        color: #66768b;
        font-size: 8px;
        font-weight: 950;
        letter-spacing: .04em;
        text-transform: uppercase;
    }
    .coach-work-line-work strong {
        display: block;
        font-size: 13px;
        line-height: 1.3;
    }
    .coach-work-line-tokens strong,
    .coach-work-line-date time { font-size: 11px; line-height: 1.3; }
}

/* V37 - coach-wise Screw Store and Material Store collection */
.store-material-admin-page,
.store-material-template-page,
.store-material-public-page {
    min-width: 0 !important;
    overflow-x: hidden;
}
.store-material-page-head {
    display: flex;
    margin-bottom: 10px;
    padding: 4px 2px;
    align-items: flex-end;
    justify-content: space-between;
    gap: 10px;
}
.store-material-page-head h1 {
    margin: 1px 0 2px;
    font-size: clamp(24px, 7vw, 34px);
    line-height: 1.08;
}
.store-material-page-head p {
    max-width: 700px;
    margin: 0;
    color: var(--muted);
    font-size: 12px;
}
.store-material-page-head .btn {
    flex: 0 0 auto;
}
.store-material-install {
    text-align: center;
}
.store-material-picker {
    padding: 10px !important;
}
.store-material-picker form {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
}
.store-material-picker label,
.store-template-editor label,
.store-template-copy label,
.store-public-filter label {
    display: grid;
    gap: 4px;
    min-width: 0;
}
.store-material-picker label,
.store-template-editor label > span,
.store-template-copy label > span,
.store-public-filter label > span {
    color: var(--text);
    font-size: 11px;
    font-weight: 900;
}
.store-material-picker select,
.store-material-picker button,
.store-template-editor input,
.store-template-editor select,
.store-template-copy input,
.store-template-copy select,
.store-public-filter input,
.store-public-filter select {
    min-height: 44px;
    font-size: 16px;
}
.store-material-coach-banner {
    display: flex;
    margin: 10px 0;
    padding: 10px 12px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-radius: 13px;
    color: #fff;
    background: linear-gradient(120deg, #17345f, var(--primary));
    box-shadow: 0 8px 20px rgba(23, 52, 95, .16);
}
.store-material-coach-banner div {
    display: grid;
    gap: 1px;
    min-width: 0;
}
.store-material-coach-banner small {
    color: rgba(255, 255, 255, .76);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}
.store-material-coach-banner strong {
    overflow-wrap: anywhere;
    font-size: 20px;
    line-height: 1.15;
}
.store-material-coach-banner > a {
    padding: 7px 9px;
    border: 1px solid rgba(255,255,255,.45);
    border-radius: 9px;
    color: #fff;
    font-size: 11px;
    font-weight: 900;
    white-space: nowrap;
}
.store-checklist-section {
    margin-bottom: 10px;
    border: 2px solid #d4e1ed;
    border-radius: 15px;
    overflow: clip;
    background: #fff;
    box-shadow: 0 7px 18px rgba(15, 23, 42, .05);
}
.store-checklist-section > summary {
    display: flex;
    min-height: 48px;
    padding: 7px 9px;
    align-items: center;
    gap: 9px;
    list-style: none;
    cursor: pointer;
}
.store-checklist-section > summary::-webkit-details-marker,
.store-material-history > summary::-webkit-details-marker,
.store-public-filter > summary::-webkit-details-marker {
    display: none;
}
.store-checklist-screw > summary {
    background: #fff8e9;
}
.store-checklist-material > summary {
    background: #edf8f7;
}
.store-checklist-icon {
    display: inline-flex;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    color: #fff;
    background: #a9630c;
    font-size: 16px;
    font-weight: 950;
}
.store-checklist-material .store-checklist-icon {
    background: #087a73;
}
.store-checklist-section > summary > span:nth-child(2) {
    display: grid;
    min-width: 0;
}
.store-checklist-section > summary strong {
    color: var(--text);
    font-size: 16px;
    line-height: 1.2;
}
.store-checklist-section > summary small {
    color: var(--muted);
    font-size: 10px;
    font-weight: 750;
}
.store-progress-pill {
    margin-left: auto;
    padding: 5px 7px;
    border: 1px solid #c9d9e8;
    border-radius: 999px;
    color: #174d5d;
    background: #fff;
    font-size: 11px;
    font-weight: 950;
}
.store-checklist-body {
    padding: 6px;
    border-top: 1px solid #dce5ee;
}
.store-checklist-toolbar {
    display: flex;
    margin-bottom: 6px;
    justify-content: flex-end;
}
.store-material-item-list {
    display: grid;
    gap: 4px;
}
.store-material-item {
    padding: 5px;
    border: 2px solid #cfdbea;
    border-radius: 11px;
    background: #fff;
    transition: border-color .15s ease, background-color .15s ease;
}
.store-material-item.status-partial {
    border-color: #e89422;
    background: #fffaf0;
}
.store-material-item.status-collected {
    border-color: #2b955c;
    background: #f1fbf5;
}
.store-material-item.status-not_required {
    border-color: #7c8da3;
    background: #f5f7fa;
}
.store-material-item > header {
    display: flex;
    margin-bottom: 4px;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.store-material-item > header > div {
    min-width: 0;
}
.store-material-item > header small {
    display: block;
    color: var(--muted);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.store-material-item h3 {
    display: inline-block;
    max-width: 100%;
    margin: 1px 0 0;
    padding: 2px 6px 2px 8px;
    overflow-wrap: anywhere;
    border-radius: 5px;
    color: var(--text);
    background: #ffed9c;
    box-shadow: inset 3px 0 0 #d89000;
    font-size: 15px;
    font-weight: 950;
    line-height: 1.18;
}
.store-item-actions {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-end;
    gap: 5px;
}
.store-item-status {
    flex: 0 0 auto;
    padding: 4px 6px;
    border-radius: 999px;
    color: #46566b;
    background: #eaf0f6;
    font-size: 9px;
    font-weight: 950;
    white-space: nowrap;
}
.store-item-collected-button {
    min-height: 30px;
    padding: 4px 7px;
    border-radius: 8px;
    font-size: 10px;
    white-space: nowrap;
}
.status-partial .store-item-status {
    color: #8a4b00;
    background: #ffedc8;
}
.status-collected .store-item-status {
    color: #08643b;
    background: #d9f4e4;
}
.status-not_required .store-item-status {
    color: #4e5d71;
    background: #dfe5ed;
}
.store-legacy-note {
    display: inline-block;
    margin-top: 3px;
    color: #8a4b00;
    font-size: 9px;
    font-weight: 800;
}
.store-material-quantity-row {
    display: grid;
    grid-template-columns:
        minmax(48px, .65fr)
        minmax(48px, .65fr)
        minmax(112px, 1.5fr)
        34px;
    gap: 4px;
    align-items: end;
}
.store-material-quantity-row label,
.store-material-remarks {
    display: grid;
    gap: 3px;
    min-width: 0;
}
.store-material-quantity-row label span,
.store-material-remarks > span {
    color: #526277;
    font-size: 9px;
    font-weight: 900;
    text-transform: uppercase;
}
.store-material-quantity-row input,
.store-material-remarks input {
    width: 100%;
    min-width: 0;
    min-height: 34px;
    padding: 4px 5px;
    border-radius: 9px;
    font-size: 14px;
}
.store-material-quantity-row .date-picker-wrap {
    grid-template-columns: minmax(0, 1fr) 34px;
    gap: 3px;
}
.store-material-quantity-row .date-picker-wrap .native-date-picker {
    width: 34px;
    min-width: 34px;
    min-height: 34px;
    border-radius: 9px;
}
.store-material-quantity-row .date-picker-wrap .native-date-picker::-webkit-calendar-picker-indicator {
    width: 22px;
    height: 22px;
}
.store-material-quantity-row .date-picker-wrap .native-date-picker::before {
    font-size: 16px;
}
.store-not-required {
    display: grid !important;
    margin: 0;
    align-content: end;
    justify-items: center;
    gap: 3px !important;
    color: #35465c;
    font-size: 9px;
    font-weight: 800;
}
.store-material-quantity-row .store-not-required > span {
    text-align: center;
}
.store-not-required input {
    width: 20px;
    height: 20px;
    min-height: 20px;
    padding: 0;
    border-radius: 5px;
}
.store-material-remarks {
    margin-top: 2px;
    border-top: 1px dashed #d6e1eb;
}
.store-material-remarks > summary {
    padding: 3px 1px 1px;
    list-style: none;
    cursor: pointer;
    color: #526277;
    font-size: 9px;
    font-weight: 900;
    text-transform: uppercase;
}
.store-material-remarks > summary::-webkit-details-marker {
    display: none;
}
.store-material-remarks > summary::after {
    content: " +";
    color: var(--primary);
}
.store-material-remarks[open] > summary::after {
    content: " −";
}
.store-material-remarks input {
    margin-top: 3px;
}
.store-material-save-bar {
    gap: 8px;
}
.store-material-save-bar span {
    color: var(--muted);
    font-size: 10px;
    font-weight: 700;
}
.store-material-history {
    padding: 0 !important;
    overflow: clip;
}
.store-material-history > summary,
.store-public-filter > summary {
    display: flex;
    min-height: 46px;
    padding: 10px 12px;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    cursor: pointer;
    color: var(--text);
    font-size: 13px;
    font-weight: 950;
}
.store-material-history > summary span {
    padding: 3px 7px;
    border-radius: 999px;
    color: var(--primary);
    background: var(--primary-soft);
    font-size: 10px;
}
.store-history-list {
    border-top: 1px solid #dbe5ee;
}
.store-history-list > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2px 8px;
    padding: 8px 11px;
    border-top: 1px solid #e5ebf2;
}
.store-history-list > div:first-child {
    border-top: 0;
}
.store-history-list strong {
    overflow-wrap: anywhere;
    font-size: 11px;
}
.store-history-list span {
    color: #53647a;
    font-size: 9px;
    font-weight: 750;
}
.store-history-list small {
    grid-column: 1 / -1;
    color: var(--muted);
    font-size: 9px;
}
.store-progress-section,
.store-template-list-section {
    margin-top: 12px;
}
.store-section-title {
    display: flex;
    margin-bottom: 7px;
    padding: 0 2px;
    align-items: flex-end;
    justify-content: space-between;
    gap: 8px;
}
.store-section-title h2 {
    margin: 0;
    font-size: 18px;
}
.store-section-title p {
    margin: 1px 0 0;
    color: var(--muted);
    font-size: 10px;
}
.store-section-title > span {
    color: var(--muted);
    font-size: 10px;
    font-weight: 850;
}
.store-progress-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
}
.store-progress-card {
    display: grid;
    gap: 7px;
    min-width: 0;
    padding: 10px;
    border: 2px solid #d5e1ec;
    border-radius: 13px;
    color: inherit;
    background: #fff;
    box-shadow: 0 5px 14px rgba(15, 23, 42, .04);
}
.store-progress-card:hover,
.store-progress-card:focus-visible,
.store-progress-card.is-selected {
    border-color: var(--primary);
    background: #f5fbfc;
}
.store-progress-card > header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}
.store-progress-card > header strong {
    color: var(--text);
    font-size: 15px;
}
.store-progress-card > header small {
    color: var(--muted);
    font-size: 9px;
    font-weight: 700;
    white-space: nowrap;
}
.store-progress-row {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) 40px;
    gap: 7px;
    align-items: center;
}
.store-progress-row > span,
.store-progress-row > strong {
    font-size: 9px;
    font-weight: 900;
}
.store-progress-row > strong {
    text-align: right;
}
.store-progress-row > div,
.public-store-progress {
    height: 7px;
    border-radius: 999px;
    overflow: hidden;
    background: #e3ebf2;
}
.store-progress-row i,
.public-store-progress i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #168c83, #49ad72);
}
.store-material-empty {
    padding: 13px;
    color: var(--muted);
    text-align: center;
    font-size: 11px;
    font-weight: 750;
}

.store-template-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
}
.store-template-editor h2,
.store-template-copy h2 {
    margin-bottom: 8px;
}
.store-template-copy p {
    margin: -4px 0 9px;
    color: var(--muted);
    font-size: 10px;
}
.store-template-form-grid,
.store-template-copy form {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
}
.store-template-editor .actions {
    margin-top: 9px;
}
.store-template-bulk-form {
    display: grid;
    gap: 8px;
}
.store-template-bulk-settings {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
}
.store-template-bulk-help,
.store-template-bulk-error {
    margin: 0;
    font-size: 10px;
    font-weight: 750;
}
.store-template-bulk-help {
    color: var(--muted);
}
.store-template-bulk-error {
    padding: 7px 8px;
    border: 1px solid #efaaa5;
    border-radius: 8px;
    color: #a61f18;
    background: #fff1f0;
}
.store-template-bulk-head {
    display: none;
}
.store-template-bulk-rows {
    display: grid;
    gap: 7px;
}
.store-template-bulk-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    padding: 7px;
    border: 2px solid #d5e1ec;
    border-radius: 10px;
    background: #f9fbfd;
}
.store-template-bulk-row.is-duplicate {
    border-color: #c7352c;
    background: #fff3f2;
}
.store-template-bulk-row label {
    display: grid;
    gap: 3px;
    min-width: 0;
}
.store-template-bulk-row label > span {
    color: #526277;
    font-size: 9px;
    font-weight: 900;
    text-transform: uppercase;
}
.store-template-bulk-row input,
.store-template-bulk-row select {
    width: 100%;
    min-width: 0;
    min-height: 38px;
    padding: 6px 7px;
    font-size: 16px;
}
.store-template-bulk-name {
    grid-column: 1 / -1;
}
.store-template-row-remove {
    grid-column: 1 / -1;
    min-height: 34px;
}
.store-template-bulk-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.store-template-bulk-actions > * {
    flex: 1 1 0;
}
.store-template-list {
    display: grid;
    gap: 7px;
}
.store-template-card {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    grid-template-areas:
        "mark main status"
        "actions actions actions";
    gap: 7px 9px;
    min-width: 0;
    padding: 9px;
    border: 2px solid #d5e1ec;
    border-radius: 12px;
    background: #fff;
}
.store-template-card.is-inactive {
    opacity: .72;
    background: #f5f7fa;
}
.store-template-store-mark {
    grid-area: mark;
    display: inline-flex;
    width: 38px;
    height: 38px;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    color: #fff;
    background: #a9630c;
    font-size: 17px;
    font-weight: 950;
}
.store-template-store-material {
    background: #087a73;
}
.store-template-main {
    grid-area: main;
    display: grid;
    min-width: 0;
}
.store-template-main small {
    color: var(--muted);
    font-size: 8px;
    font-weight: 850;
    text-transform: uppercase;
}
.store-template-main strong {
    overflow-wrap: anywhere;
    font-size: 13px;
}
.store-template-main span {
    color: #526277;
    font-size: 9px;
    font-weight: 750;
}
.store-template-card > .badge {
    grid-area: status;
    align-self: start;
}
.store-template-actions {
    grid-area: actions;
    display: flex;
    justify-content: flex-end;
    gap: 6px;
}
.store-template-actions form {
    margin: 0;
}
.store-template-saved-section {
    margin-top: 12px;
}
.store-template-saved-section[hidden],
.store-template-saved-wrap[hidden],
.store-template-saved-row[hidden],
.store-template-saved-section [hidden] {
    display: none !important;
}
.store-template-inline-form {
    display: none;
}
.store-template-saved-wrap {
    border: 1px solid #d6e2ee;
    border-radius: 12px;
    overflow-x: auto;
}
.store-template-saved-table {
    min-width: 800px;
    table-layout: fixed;
}
.store-template-saved-table th {
    padding: 8px 7px;
    color: #fff;
    background: #18304f;
    font-size: 9px;
    letter-spacing: .035em;
    text-transform: uppercase;
}
.store-template-saved-table td {
    padding: 6px;
    vertical-align: middle;
}
.store-template-saved-table th:first-child {
    width: 34%;
}
.store-template-saved-table th:nth-child(2),
.store-template-saved-table th:nth-child(3),
.store-template-saved-table th:nth-child(4) {
    width: 10%;
}
.store-template-saved-table th:nth-child(5) {
    width: 12%;
}
.store-template-saved-table th:nth-child(6) {
    width: 7%;
}
.store-template-saved-table th:last-child {
    width: 17%;
}
.store-template-saved-table input,
.store-template-saved-table select {
    width: 100%;
    min-width: 0;
    min-height: 36px;
    padding: 5px 7px;
    font-size: 13px;
}
.store-template-saved-name input {
    border-color: #e2ad43;
    color: #172a46;
    background: #fff8dd;
    font-weight: 900;
}
.store-template-saved-row.is-inactive {
    background: #f5f7fa;
    opacity: .74;
}
.store-template-saved-row.is-dirty {
    background: #fff8e7;
    box-shadow: inset 4px 0 0 #d58918;
}
.store-template-used-count {
    text-align: center;
}
.store-template-used-count strong {
    display: inline-flex;
    min-width: 30px;
    min-height: 30px;
    padding: 4px 7px;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    color: #185e6b;
    background: #e7f4f5;
    font-size: 12px;
}
.store-template-saved-actions {
    display: flex;
    justify-content: flex-end;
    gap: 5px;
}
.store-template-saved-actions .btn {
    min-height: 34px;
    padding: 6px 8px;
    font-size: 10px;
}

.store-material-public-head {
    align-items: flex-start;
}
.store-public-filter {
    padding: 0 !important;
    overflow: clip;
}
.store-public-filter > summary::after {
    content: "+";
    color: var(--primary);
    font-size: 18px;
}
.store-public-filter[open] > summary::after {
    content: "−";
}
.store-public-filter form {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
    padding: 9px;
    border-top: 1px solid #dbe5ee;
}
.public-store-checklists {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 9px;
    margin-bottom: 12px;
}
.public-store-card {
    min-width: 0;
    border: 2px solid #d4e1ed;
    border-radius: 14px;
    overflow: hidden;
    background: #fff;
}
.public-store-card > header {
    display: flex;
    padding: 9px 10px;
    align-items: center;
    justify-content: space-between;
    gap: 9px;
    background: #fff8e9;
}
.public-store-card-material > header {
    background: #edf8f7;
}
.public-store-card > header > div {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 8px;
}
.public-store-card > header > div > span {
    display: inline-flex;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    color: #fff;
    background: #a9630c;
    font-size: 17px;
    font-weight: 950;
}
.public-store-card-material > header > div > span {
    background: #087a73;
}
.public-store-card h2 {
    margin: 0;
    font-size: 16px;
}
.public-store-card header small {
    display: block;
    color: var(--muted);
    font-size: 9px;
    font-weight: 750;
}
.public-store-card header > strong {
    font-size: 15px;
}
.public-store-progress {
    height: 8px;
    margin: 0 10px;
    transform: translateY(-4px);
}
.public-store-item-list {
    padding: 2px 8px 8px;
}
.public-store-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    padding: 8px 4px;
    align-items: center;
    border-top: 1px solid #e1e8ef;
}
.public-store-item:first-child {
    border-top: 0;
}
.public-store-item > div {
    display: grid;
    min-width: 0;
}
.public-store-item > div:last-child {
    justify-items: end;
}
.public-store-item strong {
    overflow-wrap: anywhere;
    color: var(--text);
    font-size: 12px;
}
.public-store-item small,
.public-store-item time {
    color: var(--muted);
    font-size: 9px;
    font-weight: 750;
}
.public-store-item > div:last-child > span {
    padding: 4px 6px;
    border-radius: 999px;
    color: #46566b;
    background: #eaf0f6;
    font-size: 8px;
    font-weight: 950;
}
.public-store-item.status-partial > div:last-child > span {
    color: #8a4b00;
    background: #ffedc8;
}
.public-store-item.status-collected > div:last-child > span {
    color: #08643b;
    background: #d9f4e4;
}

@media (min-width: 680px) {
    .store-material-picker form,
    .store-public-filter form {
        grid-template-columns: minmax(180px, .75fr) minmax(220px, 1fr) auto;
        align-items: end;
    }
    .store-material-picker button,
    .store-public-filter button {
        min-height: 44px;
    }
    .store-material-quantity-row {
        grid-template-columns: minmax(0, .7fr) minmax(0, .7fr) minmax(190px, 1fr);
    }
    .store-material-quantity-row label:last-child {
        grid-column: auto;
    }
    .store-progress-grid,
    .public-store-checklists {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .store-template-form-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .store-template-bulk-settings {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .store-template-bulk-row {
        grid-template-columns: minmax(220px, 2fr) repeat(4, minmax(90px, .7fr)) auto;
        align-items: end;
    }
    .store-template-bulk-name,
    .store-template-row-remove {
        grid-column: auto;
    }
    .store-template-row-remove {
        min-height: 38px;
    }
    .store-template-item-name {
        grid-column: 1 / -1;
    }
    .store-template-copy form {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .store-template-copy button {
        grid-column: 1 / -1;
    }
    .store-template-card {
        grid-template-columns: 42px minmax(0, 1fr) auto auto;
        grid-template-areas: "mark main status actions";
        align-items: center;
    }
}

@media (min-width: 1000px) {
    .store-template-layout {
        grid-template-columns: minmax(0, 1.55fr) minmax(300px, .75fr);
        align-items: start;
    }
    .store-template-copy form {
        grid-template-columns: minmax(0, 1fr);
    }
    .store-template-copy button {
        grid-column: auto;
    }
    .store-template-bulk-head {
        display: grid;
        grid-template-columns: minmax(220px, 2fr) repeat(4, minmax(90px, .7fr)) auto;
        gap: 6px;
        padding: 0 7px;
        color: #526277;
        font-size: 9px;
        font-weight: 900;
        text-transform: uppercase;
    }
    .store-template-bulk-head span:last-child {
        width: 70px;
    }
    .store-template-bulk-row label > span {
        display: none;
    }
    .store-material-item-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .store-progress-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 420px) {
    .store-material-page-head {
        align-items: flex-start;
    }
    .store-material-page-head .btn {
        padding: 8px 9px;
        font-size: 10px;
    }
    .store-material-save-bar {
        align-items: stretch;
    }
    .store-material-save-bar span {
        display: none;
    }
    .store-material-save-bar button {
        width: 100%;
    }
    .store-progress-card > header {
        align-items: flex-start;
    }
    .store-progress-card > header small {
        white-space: normal;
        text-align: right;
    }
}

@media (max-width: 719px) {
    .store-template-saved-section {
        padding: 10px;
    }
    .store-template-saved-wrap {
        border: 0;
        border-radius: 0;
        overflow: visible;
    }
    .store-template-saved-table {
        min-width: 0;
    }
    .store-template-saved-table input,
    .store-template-saved-table select {
        min-height: 42px;
        font-size: 16px;
    }
    .store-template-saved-table td {
        padding: 6px 0;
    }
    .store-template-saved-table td.store-template-saved-name {
        display: block;
    }
    .store-template-saved-table td.store-template-saved-name::before {
        margin-bottom: 4px;
    }
    .store-template-saved-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .store-template-saved-actions .btn {
        min-height: 40px;
    }
    .store-template-used-count {
        text-align: left;
    }
}

/* V44 - compact Coach Manager cards with status background and collapsed actions */
.admin-coach-list-section {
    padding: 12px;
}
.admin-coach-list-toolbar {
    display: flex;
    margin-bottom: 10px;
    align-items: flex-end;
    justify-content: space-between;
    gap: 14px;
}
.admin-coach-list-toolbar h2,
.admin-coach-list-toolbar p {
    margin-bottom: 0;
}
.admin-coach-status-filter {
    display: flex;
    min-width: 230px;
    margin: 0;
    align-items: center;
    gap: 8px;
}
.admin-coach-status-filter label {
    margin: 0;
    white-space: nowrap;
}
.admin-coach-status-filter select {
    min-height: 40px;
}
.admin-coach-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 9px;
}
.admin-coach-card {
    min-width: 0;
    overflow: hidden;
    border: 2px solid;
    border-radius: 14px;
    box-shadow: 0 6px 16px rgba(15, 23, 42, .05);
}
.admin-coach-card.is-active {
    border-color: #82d6a0;
    background: #effcf3;
}
.admin-coach-card.is-inactive {
    border-color: #f1a0aa;
    background: #fff0f2;
}
.coach-selector optgroup[label="Active Coaches"],
.coach-selector option[data-coach-status="active"] {
    background: #effcf3;
    color: #123f28;
}
.coach-selector optgroup[label="Deactivated - existing work only"],
.coach-selector option[data-coach-status="inactive"] {
    background: #fff0f2;
    color: #8a1f2a;
}
.coach-selector.is-active-selected {
    background-color: #effcf3;
    border-color: #82d6a0;
}
.coach-selector.is-inactive-existing {
    background-color: #fff0f2;
    border-color: #df6675;
    color: #8a1f2a;
}
.admin-coach-card-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.admin-coach-card h3 {
    margin: 0;
    padding: 11px 12px;
    overflow-wrap: anywhere;
    color: #132742;
    font-size: 16px;
    font-weight: 950;
    line-height: 1.25;
}
.admin-coach-status-badge {
    flex: 0 0 auto;
    margin-right: 10px;
    padding: 4px 7px;
    border-radius: 999px;
    color: #17623a;
    background: #d8f6e3;
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
}
.admin-coach-card.is-inactive .admin-coach-status-badge {
    color: #9f1d2c;
    background: #ffdce1;
}
.admin-coach-card h3 span {
    margin-right: 4px;
    color: #52657c;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
}
.admin-coach-status-action {
    display: flex;
    margin: 0;
    padding: 0 10px 9px;
    justify-content: flex-end;
}
.admin-coach-status-action .btn,
.admin-coach-status-action button {
    min-height: 38px;
}
.admin-coach-status-action .admin-coach-status-icon {
    width: 42px;
    min-width: 42px;
    padding: 6px;
    font-size: 20px;
    line-height: 1;
}
.admin-coach-actions {
    border-top: 1px solid rgba(100, 116, 139, .2);
}
.admin-coach-actions summary {
    display: flex;
    min-height: 38px;
    padding: 8px 12px;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    cursor: pointer;
    color: #145b68;
    background: rgba(255, 255, 255, .5);
    font-size: 12px;
    font-weight: 900;
    list-style: none;
    user-select: none;
}
.admin-coach-actions summary::-webkit-details-marker {
    display: none;
}
.admin-coach-actions summary::after {
    content: "+";
    font-size: 18px;
    line-height: 1;
}
.admin-coach-actions[open] summary::after {
    content: "−";
}
.admin-coach-actions summary:hover {
    color: #fff;
    background: #267f8b;
}
.admin-coach-actions summary:focus-visible {
    color: #fff;
    background: #267f8b;
    outline: 3px solid #93c5fd;
    outline-offset: -3px;
}
.admin-coach-action-buttons {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    padding: 9px 10px 10px;
    border-top: 1px solid rgba(100, 116, 139, .16);
    background: rgba(255, 255, 255, .68);
}
.admin-coach-action-buttons form {
    margin: 0;
}
.admin-coach-action-buttons .btn,
.admin-coach-action-buttons button {
    width: 100%;
    min-height: 38px;
}

@media (max-width: 480px) {
    .admin-coach-list-section {
        padding: 9px;
    }
    .admin-coach-list {
        grid-template-columns: minmax(0, 1fr);
        gap: 7px;
    }
    .admin-coach-list-toolbar {
        align-items: stretch;
        flex-direction: column;
        gap: 9px;
    }
    .admin-coach-status-filter {
        width: 100%;
        min-width: 0;
    }
    .admin-coach-status-filter select {
        flex: 1 1 auto;
        min-height: 44px;
    }
    .admin-coach-card h3 {
        padding: 10px 11px;
        font-size: 15px;
    }
    .admin-coach-status-action {
        padding: 0 9px 8px;
    }
    .admin-coach-status-action .btn,
    .admin-coach-status-action button {
        min-height: 44px;
    }
    .admin-coach-status-action .admin-coach-status-icon {
        width: 44px;
        min-width: 44px;
    }
    .admin-coach-actions summary {
        min-height: 44px;
        padding: 7px 11px;
    }
    .admin-coach-action-buttons .btn,
    .admin-coach-action-buttons button {
        min-height: 44px;
    }
}

/* V45 - live Night Shift consecutive-week limit feedback */
.night-shift-live-limit-error {
    margin: 0 2px 12px;
    scroll-margin-top: 88px;
}
.night-shift-live-limit-error[hidden] {
    display: none !important;
}

/* V46 - unified Night Shift picker, eligibility controls, compact week card */
.night-shift-picker.night-shift-picker-unified {
    grid-template-columns: minmax(0, 1fr) !important;
}
.night-shift-unified {
    width: 100%;
    order: 1 !important;
}
.night-shift-unified .night-shift-selected-row {
    border-color: #78c99b;
    background: #ecfdf3;
}
.night-shift-unified .night-shift-selected-row.is-day-only {
    border-color: #ef9a9a;
    background: #fff1f2;
}
.night-shift-unified .night-shift-selected-row.is-day-only small {
    color: #b42318;
    font-weight: 800;
}
.night-shift-eligibility-card summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.night-shift-eligibility-card summary small {
    padding: 4px 9px;
    border-radius: 999px;
    color: #9a3412;
    background: #ffedd5;
    font-size: 11px;
    font-weight: 850;
}
.night-shift-eligibility-card[open] summary {
    margin-bottom: 10px;
}
.night-shift-eligibility-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 7px;
    margin: 12px 0;
}
.night-shift-eligibility-row {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    min-height: 48px;
    margin: 0;
    padding: 7px 9px;
    border: 1px solid #d6e2ef;
    border-radius: 11px;
    background: #f8fbff;
    cursor: pointer;
}
.night-shift-eligibility-row:has(input:checked) {
    border-color: #f3b2aa;
    background: #fff4f2;
}
.night-shift-eligibility-row input {
    width: 20px;
    height: 20px;
    margin: 0;
}
.night-shift-eligibility-row strong,
.night-shift-eligibility-row small {
    display: block;
}
.night-shift-eligibility-row small {
    margin-top: 2px;
    color: #64748b;
    font-size: 11px;
}
.night-shift-eligibility-row b {
    color: #9a3412;
    font-size: 11px;
    white-space: nowrap;
}
.night-shift-editor-title {
    align-items: center;
    margin-bottom: 8px;
}
.night-shift-step-card {
    padding: 9px;
}
.night-shift-step-card .night-shift-step-heading {
    align-items: center;
    margin-bottom: 7px;
}
.night-shift-step-card .night-shift-step-heading p {
    margin-top: 0;
}
.night-shift-week-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px;
    max-width: none;
    margin-bottom: 0;
}
.night-shift-week-grid > div {
    min-width: 0;
}
.night-shift-week-grid label {
    margin-bottom: 4px;
    font-size: 11px;
}
.night-shift-week-input {
    width: 100%;
    min-width: 0;
    min-height: 44px;
    padding: 8px;
    font-size: 14px;
}

@media (min-width: 720px) {
    .night-shift-unified .night-shift-employee-list,
    .night-shift-eligibility-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .night-shift-unified .night-shift-selected-row {
        grid-template-columns: 38px minmax(0, 1fr) auto;
    }
    .night-shift-unified .night-shift-selected-actions {
        grid-column: auto;
        flex-wrap: nowrap;
    }
}

@media (max-width: 560px) {
    .night-shift-editor-title {
        display: flex;
        gap: 8px;
    }
    .night-shift-editor-title h2 {
        font-size: 18px;
    }
    .night-shift-week-pill {
        margin-top: 0;
        padding: 5px 8px;
        font-size: 10px;
    }
    .night-shift-step-card .night-shift-step-heading p {
        display: none;
    }
    .night-shift-step-number {
        width: 28px;
        height: 28px;
    }
    .night-shift-week-input {
        min-height: 42px;
        padding: 7px;
        font-size: 13px;
    }
    .night-shift-eligibility-row {
        grid-template-columns: 22px minmax(0, 1fr);
    }
    .night-shift-eligibility-row b {
        grid-column: 2;
    }
}

/* V47: guarded fresh-section reset console */
.portal-reset-admin-page main {
    max-width: 1240px;
}
.reset-page-head,
.reset-backup-gate,
.reset-section-title > div,
.reset-backup-gate > div {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}
.reset-page-head {
    justify-content: space-between;
    margin-bottom: 12px;
    padding: 2px 2px 0;
}
.reset-page-head h1,
.reset-page-head p,
.reset-section-title h2,
.reset-section-title p,
.reset-backup-gate h2,
.reset-backup-gate p {
    margin: 0;
}
.reset-page-head h1 {
    font-size: clamp(25px, 4.8vw, 38px);
    line-height: 1.1;
}
.reset-page-head p {
    max-width: 760px;
    margin-top: 5px;
    color: #5d6b7c;
}
.reset-danger-badge {
    flex: 0 0 auto;
    padding: 7px 10px;
    border: 1px solid #f3b7b2;
    border-radius: 999px;
    color: #a9271c;
    background: #fff2f0;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.reset-step {
    display: inline-grid;
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    place-items: center;
    border-radius: 9px;
    color: #fff;
    background: var(--primary);
    font-weight: 900;
}
.reset-backup-gate {
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    border-width: 2px;
}
.reset-backup-gate.is-ready {
    border-color: #86d0aa;
    background: #f1fbf6;
}
.reset-backup-gate.is-blocked {
    border-color: #f2c16f;
    background: #fff9ec;
}
.reset-backup-gate h2,
.reset-section-title h2,
.reset-clear-card h2,
.reset-keep-card h2,
.reset-confirm-card h2 {
    font-size: 18px;
    line-height: 1.2;
}
.reset-backup-gate p,
.reset-section-title p {
    margin-top: 3px;
    color: #617083;
    font-size: 12px;
}
.reset-preview-card,
.reset-confirm-card,
.reset-clear-card,
.reset-keep-card {
    margin-bottom: 12px;
}
.reset-section-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.reset-section-title > strong {
    flex: 0 0 auto;
    padding: 7px 10px;
    border-radius: 10px;
    color: var(--primary-dark);
    background: var(--primary-soft);
    font-size: 13px;
}
.reset-count-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    margin-top: 12px;
}
.reset-count-tile {
    min-width: 0;
    padding: 9px;
    border: 1px solid #d8e3ee;
    border-radius: 11px;
    background: #f8fbfe;
}
.reset-count-tile strong,
.reset-count-tile span {
    display: block;
}
.reset-count-tile strong {
    color: #14213a;
    font-size: 18px;
    line-height: 1;
}
.reset-count-tile span {
    margin-top: 4px;
    color: #607084;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.reset-details {
    margin-top: 10px;
    border: 1px solid #d9e4ee;
    border-radius: 11px;
    background: #fff;
}
.reset-details summary {
    padding: 10px;
    color: #27445a;
    font-size: 12px;
    font-weight: 900;
    cursor: pointer;
}
.reset-table-list {
    display: grid;
    padding: 0 10px 10px;
}
.reset-table-list > div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 6px 2px;
    border-top: 1px dashed #d8e2ec;
    font-size: 12px;
}
.reset-compare-grid {
    display: grid;
    gap: 12px;
}
.reset-clear-card {
    border-color: #f0b8b3;
    background: #fff8f7;
}
.reset-keep-card {
    border-color: #a9ddc0;
    background: #f5fcf8;
}
.reset-clear-card ul,
.reset-keep-card ul {
    margin: 9px 0 0;
    padding-left: 18px;
}
.reset-clear-card li,
.reset-keep-card li {
    margin: 5px 0;
    color: #3d4b5c;
    font-size: 12px;
}
.reset-keep-card .help {
    display: block;
    margin-top: 10px;
}
.reset-confirm-form {
    margin-top: 12px;
}
.reset-check-row {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    min-height: 42px;
    margin: 7px 0;
    padding: 8px 10px;
    border: 1px solid #d7e2ed;
    border-radius: 10px;
    background: #f8fbfe;
    cursor: pointer;
}
.reset-check-row input {
    width: 20px;
    height: 20px;
    margin: 0;
}
.reset-check-row span {
    font-size: 12px;
    font-weight: 800;
}
.reset-confirm-grid {
    display: grid;
    gap: 10px;
    margin-top: 10px;
}
.reset-confirm-grid label,
.reset-confirm-grid .help,
.reset-confirm-grid input {
    display: block;
    width: 100%;
}
.reset-confirm-grid .help {
    min-height: 20px;
    margin: 3px 0;
}
.reset-phrase {
    display: inline-block;
    margin: 5px 0;
    padding: 5px 8px;
    border: 1px solid #efb0aa;
    border-radius: 7px;
    color: #9f2219;
    background: #fff0ee;
    font-size: 13px;
    font-weight: 900;
    user-select: all;
}
.reset-submit {
    width: 100%;
    margin-top: 12px;
    border-color: #a9251c;
    background: linear-gradient(135deg, #a9251c, #d13b2d);
    color: #fff;
}
.reset-submit:not(:disabled):hover,
.reset-submit:not(:disabled):focus-visible {
    color: #fff;
    background: linear-gradient(135deg, #861b14, #b82c21);
}
.reset-submit:disabled {
    border-color: #c9d2db;
    color: #748091;
    background: #e5eaf0;
    box-shadow: none;
    cursor: not-allowed;
}
.reset-disabled-help {
    margin: 7px 0 0;
    color: #a35b10;
    text-align: center;
    font-size: 11px;
    font-weight: 800;
}

@media (max-width: 620px) {
    .reset-page-head p {
        font-size: 12px;
    }
    .reset-backup-gate {
        align-items: stretch;
        flex-direction: column;
    }
    .reset-backup-gate > .btn {
        width: 100%;
    }
}

@media (min-width: 720px) {
    .reset-count-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .reset-compare-grid,
    .reset-confirm-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .reset-submit {
        width: auto;
        min-width: 330px;
        margin-left: auto;
    }
}

/* V52 - compact Daily Entry cards and one-step employee row copy */
.page-daily-bulk-work .daily-entry-card-list {
    gap: 9px;
}
.page-daily-bulk-work .daily-entry-card {
    padding: 10px;
}
.page-daily-bulk-work .daily-entry-head {
    gap: 0;
    margin-bottom: 6px;
}
.page-daily-bulk-work .daily-entry-topline {
    gap: 6px;
}
.page-daily-bulk-work .daily-entry-head .copy-box {
    width: min(210px, 58%);
    min-width: 0;
}
.page-daily-bulk-work .daily-entry-head .copy-from-select {
    width: 100%;
    min-width: 0;
    min-height: 34px;
    padding: 4px 26px 4px 8px;
    border-radius: 9px;
    font-size: 12px;
    font-weight: 800;
}
.page-daily-bulk-work .daily-entry-controls {
    gap: 6px;
    margin-bottom: 6px;
}
.page-daily-bulk-work .daily-entry-controls label {
    margin-bottom: 2px;
    font-size: 11px;
}
.page-daily-bulk-work .daily-entry-card input,
.page-daily-bulk-work .daily-entry-card select,
.page-daily-bulk-work .readonly-pill {
    min-height: 36px;
    padding: 5px 8px;
    border-radius: 9px;
    line-height: 1.25;
}
.page-daily-bulk-work .work-lines-wrap {
    padding-top: 6px;
}
.page-daily-bulk-work .work-lines {
    gap: 5px;
    margin-bottom: 5px;
}
.page-daily-bulk-work .work-line {
    gap: 5px;
    padding: 5px;
    border-radius: 10px;
}
.page-daily-bulk-work .daily-entry-card .btn-small {
    min-height: 34px !important;
    padding: 5px 8px !important;
}
.page-daily-bulk-work .daily-entry-card-footer {
    margin-top: 6px;
    padding-top: 6px;
}

@media (max-width: 760px) {
    .page-daily-bulk-work .daily-entry-card {
        padding: 8px;
        border-radius: 15px;
    }
    .page-daily-bulk-work .daily-entry-token {
        min-height: 26px;
        padding: 2px 6px;
    }
    .page-daily-bulk-work .daily-entry-head .copy-box {
        width: min(190px, 59%);
    }
    .page-daily-bulk-work .daily-entry-head .copy-from-select {
        min-height: 32px;
        padding-block: 3px;
        font-size: 11px;
    }
    .page-daily-bulk-work .daily-entry-controls {
        gap: 5px;
    }
    .page-daily-bulk-work .daily-entry-metric {
        display: grid;
        grid-template-columns: max-content minmax(0, 1fr);
        align-items: center;
        gap: 6px;
    }
    .page-daily-bulk-work .daily-entry-metric > label {
        margin: 0;
        white-space: nowrap;
    }
    .page-daily-bulk-work .daily-entry-metric > .readonly-pill {
        min-width: 0;
        min-height: 32px;
        justify-content: flex-start;
    }
    .page-daily-bulk-work .daily-entry-card input,
    .page-daily-bulk-work .daily-entry-card select,
    .page-daily-bulk-work .readonly-pill {
        min-height: 34px;
        padding: 4px 7px;
        font-size: 13px;
    }
    .page-daily-bulk-work .work-line input[data-line-field="work"] {
        font-size: 16px !important;
    }
    .page-daily-bulk-work .work-line {
        grid-template-columns: minmax(0, 1fr) 76px;
        grid-template-areas:
            "coach coach"
            "work earned";
        align-items: stretch;
    }
    .page-daily-bulk-work .work-line:not([data-line-index="0"]) {
        grid-template-areas:
            "coach remove"
            "work earned";
    }
    .page-daily-bulk-work .work-line [data-line-field="coach"] { grid-area: coach; }
    .page-daily-bulk-work .work-line [data-line-field="work"] { grid-area: work; }
    .page-daily-bulk-work .work-line [data-line-field="earned"] {
        grid-area: earned;
        width: 100%;
        min-width: 0;
        padding-inline: 4px;
        text-align: center;
        font-variant-numeric: tabular-nums;
    }
    .page-daily-bulk-work .work-line .remove-work-line {
        grid-area: remove;
        width: 76px;
        min-width: 0;
    }
}

@media (max-width: 380px) {
    .page-daily-bulk-work .daily-entry-head .copy-box {
        width: min(165px, 56%);
    }
    .page-daily-bulk-work .daily-entry-metric {
        gap: 4px;
    }
    .page-daily-bulk-work .daily-entry-metric > label {
        font-size: 10px;
    }
}

/* V56 final mobile layout: Work, then Earned | GA | Coach | Hours. */
@media (max-width: 760px) {
    .page-daily-bulk-work .daily-entry-card {
        display: grid;
        grid-template-columns: repeat(12, minmax(0, 1fr));
        column-gap: 3px;
        row-gap: 5px;
    }
    .page-daily-bulk-work .daily-entry-head {
        grid-column: 1 / -1;
        grid-row: 1;
        margin-bottom: 0;
    }
    .page-daily-bulk-work .daily-entry-controls {
        display: contents;
    }
    .page-daily-bulk-work .daily-entry-controls > div:nth-child(1) {
        grid-column: 1 / 7;
        grid-row: 2;
    }
    .page-daily-bulk-work .daily-entry-controls > div:nth-child(2) {
        grid-column: 7 / 13;
        grid-row: 2;
    }
    .page-daily-bulk-work .daily-entry-controls > .daily-entry-metric:nth-child(3) {
        grid-column: 1 / 4;
        grid-row: 4;
    }
    .page-daily-bulk-work .daily-entry-controls > .daily-entry-metric:nth-child(4) {
        grid-column: 4 / 6;
        grid-row: 4;
    }
    .page-daily-bulk-work .daily-entry-metric {
        display: block;
        min-width: 0;
    }
    .page-daily-bulk-work .daily-entry-metric > label,
    .page-daily-bulk-work .work-line[data-line-index="0"] .work-field-label {
        display: block;
        min-height: 13px;
        margin: 0 0 2px;
        overflow: hidden;
        font-size: 10px;
        line-height: 1.15;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .page-daily-bulk-work .daily-entry-metric > .readonly-pill {
        min-width: 0;
        min-height: 34px;
        padding: 4px 6px;
        font-size: 13px;
        justify-content: flex-start;
    }
    .page-daily-bulk-work .work-lines-wrap,
    .page-daily-bulk-work .work-lines,
    .page-daily-bulk-work .work-line[data-line-index="0"] {
        display: contents;
    }
    .page-daily-bulk-work .work-line[data-line-index="0"] .work-coach-group {
        grid-column: 6 / 11;
        grid-row: 4;
    }
    .page-daily-bulk-work .work-line[data-line-index="0"] .work-description-group {
        grid-column: 1 / 13;
        grid-row: 3;
    }
    .page-daily-bulk-work .work-line[data-line-index="0"] .work-hours-group {
        grid-column: 11 / 13;
        grid-row: 4;
    }
    .page-daily-bulk-work .work-line[data-line-index="0"] .remove-work-line {
        display: none !important;
    }
    .page-daily-bulk-work .work-line:not([data-line-index="0"]) {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: minmax(0, 1fr) 76px;
        grid-template-areas:
            "coach remove"
            "work earned";
        gap: 5px;
    }
    .page-daily-bulk-work .work-line:not([data-line-index="0"]) .work-coach-group { grid-area: coach; }
    .page-daily-bulk-work .work-line:not([data-line-index="0"]) .work-description-group { grid-area: work; }
    .page-daily-bulk-work .work-line:not([data-line-index="0"]) .work-hours-group { grid-area: earned; }
    .page-daily-bulk-work .work-line:not([data-line-index="0"]) .remove-work-line {
        grid-area: remove;
        width: 76px;
        min-width: 0;
    }
    .page-daily-bulk-work .work-hours-group input[data-line-field="earned"] {
        width: 100%;
        min-width: 0;
        padding-inline: 4px;
        text-align: center;
        font-variant-numeric: tabular-nums;
    }
    .page-daily-bulk-work .work-description-group input[data-line-field="work"] {
        width: 100%;
        min-width: 0;
        font-size: 16px !important;
    }
    .page-daily-bulk-work .add-work-line,
    .page-daily-bulk-work .daily-entry-card-footer {
        grid-column: 1 / -1;
    }
    .page-daily-bulk-work .add-work-line {
        justify-self: start;
    }
}

/* V57 - iOS-aligned summary controls and one-line card actions. */
.page-daily-bulk-work .add-work-line[hidden] {
    display: none !important;
}

@media (max-width: 760px) {
    .page-daily-bulk-work .daily-entry-metric,
    .page-daily-bulk-work .work-line[data-line-index="0"] .work-coach-group,
    .page-daily-bulk-work .work-line[data-line-index="0"] .work-hours-group {
        display: grid;
        grid-template-rows: 13px 36px;
        align-self: stretch;
        gap: 2px;
        min-width: 0;
    }
    .page-daily-bulk-work .daily-entry-metric > label,
    .page-daily-bulk-work .work-line[data-line-index="0"] .work-coach-group > label,
    .page-daily-bulk-work .work-line[data-line-index="0"] .work-hours-group > label {
        display: block;
        height: 13px;
        min-height: 13px;
        margin: 0;
        line-height: 13px;
    }
    .page-daily-bulk-work .daily-entry-metric > .readonly-pill,
    .page-daily-bulk-work .work-line[data-line-index="0"] .work-coach-group > select,
    .page-daily-bulk-work .work-line[data-line-index="0"] .work-hours-group > input {
        box-sizing: border-box;
        width: 100%;
        height: 36px !important;
        min-height: 36px !important;
        max-height: 36px;
        margin: 0;
        padding-block: 0;
        line-height: 1.2;
        align-self: end;
    }
    .page-daily-bulk-work .daily-entry-metric > .readonly-pill {
        display: flex;
        align-items: center;
    }
    .page-daily-bulk-work .work-line[data-line-index="0"] .work-coach-group > select,
    .page-daily-bulk-work .work-line[data-line-index="0"] .work-hours-group > input {
        font-size: 16px !important;
    }
    .page-daily-bulk-work .daily-entry-card-footer {
        grid-column: 1 / -1;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 6px;
        width: 100%;
        min-width: 0;
        margin: 0;
        padding: 0;
        border-top: 0;
    }
    .page-daily-bulk-work .daily-entry-card-footer .add-work-line,
    .page-daily-bulk-work .daily-entry-card-footer .save-entry-btn {
        width: auto;
        min-width: 0;
        min-height: 34px !important;
        height: 34px;
        margin: 0;
    }
    .page-daily-bulk-work .daily-entry-card-footer .add-work-line {
        flex: 0 1 auto;
    }
    .page-daily-bulk-work .daily-entry-card-footer .save-entry-btn {
        flex: 0 0 auto;
        margin-left: auto;
    }
}

/* V58 - repair nested-field tracks and non-Work card flow on phones. */
@media (max-width: 760px) {
    .page-daily-bulk-work .daily-entry-metric,
    .page-daily-bulk-work .work-line[data-line-index="0"] .work-coach-group,
    .page-daily-bulk-work .work-line[data-line-index="0"] .work-hours-group {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: 13px 36px;
        align-items: stretch;
        gap: 2px;
        min-width: 0;
    }
    .page-daily-bulk-work .daily-entry-metric > label,
    .page-daily-bulk-work .work-line[data-line-index="0"] .work-coach-group > label,
    .page-daily-bulk-work .work-line[data-line-index="0"] .work-hours-group > label {
        grid-area: 1 / 1 / 2 / 2;
        width: 100%;
        height: 13px;
        min-height: 13px;
        margin: 0;
        line-height: 13px;
    }
    .page-daily-bulk-work .daily-entry-metric > .readonly-pill,
    .page-daily-bulk-work .work-line[data-line-index="0"] .work-coach-group > select,
    .page-daily-bulk-work .work-line[data-line-index="0"] .work-hours-group > input {
        grid-area: 2 / 1 / 3 / 2 !important;
        box-sizing: border-box;
        width: 100%;
        height: 36px !important;
        min-height: 36px !important;
        max-height: 36px;
        margin: 0;
        align-self: stretch;
    }
    .page-daily-bulk-work .daily-entry-card.is-nonwork .daily-entry-controls > .daily-entry-metric:nth-child(3),
    .page-daily-bulk-work .daily-entry-card.is-nonwork .daily-entry-controls > .daily-entry-metric:nth-child(4) {
        grid-row: 3;
    }
}

/* V59 - keep Attendance Report row actions inside the compact table row. */
body.page-incentive-attendance-report .attendance-row-actions {
    grid-template-columns: minmax(0, 70px) minmax(0, 48px);
    height: 36px;
    min-height: 36px;
    padding: 2px !important;
    align-items: center;
    align-content: center;
    justify-content: center;
    gap: 4px;
    vertical-align: middle;
    box-sizing: border-box;
}
body.page-incentive-attendance-report .attendance-row-actions .btn.btn-small {
    display: inline-flex;
    width: 100%;
    height: 28px !important;
    min-height: 28px !important;
    max-height: 28px;
    padding: 2px 4px !important;
    align-items: center;
    justify-content: center;
    border-radius: 7px !important;
    font-size: 10px !important;
    line-height: 1;
    box-sizing: border-box;
    box-shadow: none;
    transform: none;
}
body.page-incentive-attendance-report .attendance-row-actions .btn.btn-small:hover,
body.page-incentive-attendance-report .attendance-row-actions .btn.btn-small:focus-visible,
body.page-incentive-attendance-report .attendance-row-actions .btn.btn-small:active {
    box-shadow: none;
    transform: none;
}

/* V79 - spreadsheet-like sorting and filtering for all Job Card data columns. */
.job-card-filter-summary {
    color: var(--muted);
    font-size: 11px;
    font-weight: 750;
    white-space: nowrap;
}
.job-card-grid thead th:nth-child(n+2):nth-child(-n+15) { padding: 4px 4px 20px; }
.job-card-grid thead th.is-column-filtered,
.job-card-grid thead th.is-column-sorted { background: #195c6b; }
.job-card-grid thead th.is-column-sorted::after {
    position: absolute;
    bottom: 4px;
    left: calc(50% - 19px);
    margin: 0;
    color: #d9fff6;
    font-size: 9px;
    content: '▲';
}
.job-card-grid thead th.is-column-sorted[data-sort-direction="descending"]::after { content: '▼'; }
.job-column-filter-trigger {
    position: absolute;
    z-index: 2;
    top: auto;
    bottom: 1px;
    right: 50%;
    width: 20px;
    min-width: 20px !important;
    height: 16px;
    min-height: 16px !important;
    margin: 0;
    padding: 0 !important;
    transform: translateX(50%);
    border: 0;
    border-radius: 4px;
    color: #eafff9;
    background: transparent;
    box-shadow: none;
    font: 900 15px/1 sans-serif;
    cursor: pointer;
}
.job-column-filter-trigger:hover,
.job-column-filter-trigger:focus-visible,
.job-column-filter-trigger[aria-expanded="true"] {
    color: #fff;
    background: rgba(255, 255, 255, .2);
    outline: 0;
}
.job-column-filter-menu {
    position: fixed;
    z-index: 120;
    width: min(270px, calc(100vw - 16px));
    padding: 10px;
    border: 1px solid #9fc1d1;
    border-radius: 10px;
    color: #17314b;
    background: #fff;
    box-shadow: 0 12px 30px rgba(25, 49, 75, .22);
}
.job-column-filter-menu > strong {
    display: block;
    margin-bottom: 8px;
    font-size: 13px;
}
.job-column-filter-sort,
.job-column-filter-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.job-column-filter-sort { margin-bottom: 9px; }
.job-column-filter-sort button,
.job-column-filter-actions .btn {
    min-height: 32px !important;
    margin: 0;
    padding: 5px 7px !important;
    font-size: 11px !important;
    line-height: 1.15;
    white-space: normal;
}
.job-column-filter-sort button {
    border: 1px solid #bdd2df;
    border-radius: 7px;
    color: #135d6c;
    background: #edf8fb;
    font-weight: 800;
}
.job-column-filter-sort button:hover,
.job-column-filter-sort button:focus-visible { border-color: var(--primary); background: #d9f1f4; }
.job-column-filter-menu label {
    display: grid;
    gap: 4px;
    margin: 0 0 9px;
    color: #4e637a;
    font-size: 11px;
    font-weight: 800;
}
.job-column-filter-menu input {
    width: 100%;
    min-height: 34px;
    padding: 6px 8px;
    border: 1px solid #b9d0dd;
    border-radius: 7px;
    color: #17243a;
    background: #fff;
    font-size: 14px;
}
.job-card-grid tr.is-job-card-filter-hidden { display: none; }
@media (max-width: 760px) {
    .job-card-filter-summary { width: 100%; white-space: normal; }
    .job-column-filter-menu { max-height: calc(100dvh - 16px); overflow: auto; }
}

/* Published CC dates are expiry signals for Job Cards. */
.job-card-grid tr.is-cc-upcoming > td,
.job-card-grid tr.is-cc-upcoming > .job-row-number,
.job-card-grid tr.is-cc-upcoming > .job-row-action { background: #fff2dc; }
.job-card-grid tr.is-cc-upcoming > .job-row-number { box-shadow: inset 4px 0 0 #d77a28; }
.job-card-grid tr.is-cc-upcoming .job-cc-date-cell { background: #ffdca8; }
.job-card-grid tr.is-cc-upcoming .job-cc-date-cell input { border-color: #d77a28; color: #74340d; font-weight: 800; }
.job-card-grid tr.is-cc-expired > td,
.job-card-grid tr.is-cc-expired > .job-row-number,
.job-card-grid tr.is-cc-expired > .job-row-action { background: #fff0ef; }
.job-card-grid tr.is-cc-expired > .job-row-number { box-shadow: inset 4px 0 0 #c94a3a; }
.job-card-grid tr.is-cc-expired .job-cc-date-cell { background: #ffd2cc; }
.job-card-grid tr.is-cc-expired .job-cc-date-cell input { border-color: #c94a3a; color: #8b251b; font-weight: 800; }

/* V149: Night Shift history stays compact until a saved list is opened. */
.night-shift-history-panel { padding: 16px !important; }
.night-shift-history-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.night-shift-history-panel-head h2 { margin: 0; }
.night-shift-history-panel-head > span { color: #6a4c3f; font-size: 12px; font-weight: 800; }
.night-shift-history-tabs { display: grid; gap: 8px; }
.night-shift-history-tab { overflow: hidden; border: 1px solid #ead8d0; border-radius: 11px; background: #fffdfc; }
.night-shift-history-tab > summary { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 12px 38px 12px 13px; cursor: pointer; list-style: none; position: relative; }
.night-shift-history-tab > summary::-webkit-details-marker { display: none; }
.night-shift-history-tab > summary::after { content: '+'; position: absolute; right: 14px; color: #a84b29; font-size: 20px; font-weight: 800; line-height: 1; }
.night-shift-history-tab[open] > summary { border-bottom: 1px solid #f0ddd5; background: #fff5f1; }
.night-shift-history-tab[open] > summary::after { content: '−'; }
.night-shift-history-title { color: #112c51; font-weight: 850; }
.night-shift-history-summary-meta, .night-shift-history-meta { color: #6d5b53; font-size: 12px; font-weight: 700; }
.night-shift-history-details { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding: 11px 13px; }
.night-shift-history-details .actions { margin: 0; }
.settings-inline-form { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 8px; }
.settings-inline-form input[type="file"] { max-width: 100%; }
.night-shift-template-settings-preview { min-height: 110px; }
.night-shift-template-settings-preview img { max-width: 100%; max-height: 160px; object-fit: contain; }
@media (max-width: 640px) {
    .night-shift-history-tab > summary { grid-template-columns: 1fr; padding-right: 40px; }
    .night-shift-history-details { align-items: stretch; flex-direction: column; }
    .night-shift-history-details .actions { width: 100%; }
    .night-shift-history-details .actions .btn { flex: 1 1 80px; text-align: center; }
}

/* V156: match the responsive admin dashboard width and heading to Night Shift Lists. */
body.admin-dashboard-page { background: #f5f7fb; }
body.admin-dashboard-page .container { width: min(100%, 720px); padding: 12px; }
.admin-dashboard-hero { margin: 2px 2px 12px; padding: 2px 0; border: 0; border-radius: 0; background: transparent; }
.admin-dashboard-hero h1 { margin: 0; color: #132d51; font-size: 24px; line-height: 1.2; }
.admin-dashboard-hero p { margin: 4px 0 0; color: var(--muted); font-size: 12px; font-weight: 700; }
.admin-dashboard-modules { padding: 16px; border: 1px solid #dbe4ef; border-radius: 16px; background: #fff; }
.admin-dashboard-section-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.admin-dashboard-section-head h2 { margin: 0; color: #132d51; font-size: 19px; }
.admin-dashboard-section-head span { min-width: 26px; padding: 4px 8px; border-radius: 999px; color: #893819; background: #f9e8e1; font-size: 12px; font-weight: 850; text-align: center; }
.admin-dashboard-module-grid { display: grid; gap: 8px; }
.admin-dashboard-module { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px; border: 1px solid #dce4ef; border-radius: 13px; background: #fbfdff; }
.admin-dashboard-module.is-primary { border-color: #edc8b9; background: #fff6f1; }
.admin-dashboard-module h3 { margin: 0; color: #132d51; font-size: 15px; }
.admin-dashboard-module p { margin: 3px 0 0; color: #687486; font-size: 11px; font-weight: 650; }
.admin-dashboard-module .btn { flex: 0 0 auto; min-width: 58px; min-height: 36px; padding: 7px 10px; font-size: 12px; text-align: center; }
.admin-dashboard-empty { padding: 16px; border: 1px dashed #d9c7bc; border-radius: 12px; color: #695c55; font-size: 13px; font-weight: 700; }
@media (min-width: 640px) {
    body.admin-dashboard-page .container { padding: 20px; }
    .admin-dashboard-module-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .admin-dashboard-module { min-height: 88px; }
}
@media (min-width: 900px) {
    body.admin-dashboard-page .container { width: min(100%, 1240px) !important; padding: 20px !important; }
    .admin-dashboard-hero { margin: 4px 2px 16px; }
    .admin-dashboard-hero h1 { font-size: 28px; }
}

/* V144: preferred 3032 attendance report presentation. */
body.page-incentive-attendance-report .container { width: min(100%, 1240px); }
body.page-incentive-attendance-report .attendance-report-heading { margin-bottom: 8px; padding: 14px 16px; border-radius: 14px; box-shadow: 0 4px 14px rgba(16, 24, 40, .05); }
body.page-incentive-attendance-report .attendance-report-heading h1 { font-size: clamp(21px, 2.2vw, 27px); }
body.page-incentive-attendance-report .attendance-report-heading p { margin-top: 3px; font-size: 11px; font-weight: 700; }
body.page-incentive-attendance-report .attendance-report-summary { gap: 7px; margin-bottom: 8px; }
body.page-incentive-attendance-report .attendance-report-summary .stat { min-height: 58px; padding: 8px 10px; border-radius: 12px; }
body.page-incentive-attendance-report .attendance-absence-card,
body.page-incentive-attendance-report .attendance-sheet-card { margin-bottom: 8px; border-radius: 14px; }
body.page-incentive-attendance-report .attendance-sheet-topbar { align-items: center; }
body.page-incentive-attendance-report .attendance-sheet-topbar h2 { font-size: 17px; }
body.page-incentive-attendance-report .attendance-sheet-actions { gap: 6px; }
body.page-incentive-attendance-report .attendance-sheet-actions .btn,
body.page-incentive-attendance-report .attendance-report-heading .btn.btn-light {
    min-height: 34px; padding: 6px 10px; border: 1px solid #8f3a22; border-radius: 9px;
    color: #fff; background: linear-gradient(135deg, #c15a32 0%, #963a22 100%);
    box-shadow: 0 3px 9px rgba(131, 53, 28, .2); font-size: 11px; font-weight: 850; white-space: nowrap;
}
body.page-incentive-attendance-report .attendance-sheet-actions .btn:hover:not(:disabled),
body.page-incentive-attendance-report .attendance-report-heading .btn.btn-light:hover { border-color: #712915; color: #fff; background: linear-gradient(135deg, #d36c3e 0%, #a43d20 100%); box-shadow: 0 6px 14px rgba(131, 53, 28, .28); transform: translateY(-1px); }
body.page-incentive-attendance-report .attendance-sheet-actions .btn:disabled { border-color: #d8c9c3; color: #917e76; background: #eee6e2; box-shadow: none; opacity: 1; }
body.page-incentive-attendance-report .attendance-row-actions { grid-template-columns: 70px 50px; gap: 5px; }
body.page-incentive-attendance-report .attendance-row-actions .btn { min-height: 29px; padding: 4px 5px; border-radius: 8px; box-shadow: 0 2px 4px rgba(15, 23, 42, .07); font-size: 10px; font-weight: 850; }
body.page-incentive-attendance-report .attendance-row-actions .btn.btn-light { border-color: #e9bdad; color: #92391f; background: #fff0ea; }
body.page-incentive-attendance-report .attendance-savebar { justify-content: flex-end; margin-top: 8px; padding: 8px; border-radius: 12px; }
body.page-incentive-attendance-report .attendance-savebar button { min-height: 38px; border-radius: 10px; box-shadow: 0 4px 10px rgba(131, 71, 20, .16); font-weight: 850; }
body.page-incentive-attendance-report .attendance-bulk-paste { margin-top: 8px; border-radius: 12px; }
body.page-incentive-attendance-report .attendance-bulk-paste summary { padding: 3px 1px; }

/* V144: minimal, phone-first Night Shift List editor, as used by 3032. */
body.night-shift-page { background: #f5f7fb; }
body.night-shift-page .container { width: min(100%, 720px); padding: 12px; }
body.night-shift-page .card { padding: 12px !important; border-radius: 14px !important; box-shadow: 0 2px 10px rgba(15, 23, 42, .04); }
.night-shift-page-header { margin: 2px 2px 12px; padding: 2px 0; background: transparent !important; }
.night-shift-page-header h1 { margin: 0; font-size: 24px; line-height: 1.2; }
.night-shift-help-card, .night-shift-template-card .help { display: none !important; }
.night-shift-editor-card { padding: 12px !important; }
.night-shift-editor-title { margin-bottom: 12px; }
.night-shift-editor-title .night-shift-eyebrow, .night-shift-preview-head .night-shift-eyebrow { display: none; }
.night-shift-editor-title h2 { margin: 0; font-size: 19px; }
.night-shift-week-pill { padding: 5px 8px; font-size: 10px; }
.night-shift-week-card { padding: 10px; border-radius: 12px; background: #f8fbff; }
.night-shift-section-heading { display: flex; align-items: center; min-height: 28px; }
.night-shift-section-heading h3 { margin: 0; font-size: 15px; }
.night-shift-week-grid { margin-top: 8px; }
.night-shift-week-grid label { font-size: 11px; }
.night-shift-week-input { min-height: 44px; padding: 8px; font-size: 14px; }
.night-shift-employee-step-heading { margin: 16px 2px 8px; }
.night-shift-picker-heading { display: grid; gap: 8px; padding: 10px; }
.night-shift-picker-heading h3 { margin: 0; font-size: 14px; }
.night-shift-employee-list { padding: 8px; gap: 7px; }
.night-shift-employee-option, .night-shift-unified .night-shift-selected-row { min-height: 58px; padding: 9px; border-radius: 11px; }
.night-shift-save-bar { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; margin-top: 10px; padding: 8px; border-radius: 12px; }
.night-shift-save-count { grid-column: 1 / -1; justify-content: flex-start; }
.night-shift-save-bar button, .night-shift-save-bar .btn { min-height: 44px; }
.night-shift-list-meta, .night-shift-history-meta { margin-top: 4px; color: var(--muted); font-size: 12px; font-weight: 700; }
.night-shift-eligibility-card summary { min-height: 30px; }
.night-shift-eligibility-card[open] summary { margin-bottom: 8px; }
body.night-shift-page .night-shift-history-card .actions, body.night-shift-page .night-shift-card-head .actions, body.night-shift-page .night-shift-template-card .actions { gap: 7px; }
body.night-shift-page .night-shift-history-card .actions .btn, body.night-shift-page .night-shift-card-head .actions .btn, body.night-shift-page .night-shift-template-card .actions .btn, body.night-shift-page .night-shift-template-card .actions button { min-height: 36px; padding: 7px 11px; border: 1px solid #d7e2ee; border-radius: 10px; box-shadow: 0 2px 5px rgba(15, 23, 42, .06); font-size: 12px; font-weight: 850; }
body.night-shift-page .night-shift-history-card .actions .btn-secondary, body.night-shift-page .night-shift-card-head .actions .btn-secondary, body.night-shift-page .night-shift-template-card .actions .btn-secondary { color: #24405f; background: #fff; }
/* Keep the saved-list share action as the single emphasized control. */
body.night-shift-page #nightShiftShareJpeg { color: #fff; border-color: var(--primary); background: linear-gradient(135deg, var(--primary), var(--accent)); }
body.night-shift-page .night-shift-card-head .actions > a.btn-secondary { color: #24405f; background: #fff; }
/* Native iPhone date inputs need a shrinkable grid track and a single column. */
body.night-shift-page .night-shift-week-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; min-width: 0; }
body.night-shift-page .night-shift-week-grid > div { min-width: 0; max-width: 100%; }
body.night-shift-page .night-shift-week-input { display: block; width: 100%; min-width: 0; max-width: 100%; box-sizing: border-box; }
@media (max-width: 560px) {
    body.night-shift-page .night-shift-week-grid { grid-template-columns: minmax(0, 1fr) !important; }
    body.night-shift-page .night-shift-week-input { min-height: 46px; padding-inline: 10px; font-size: 16px; }
}
@media (min-width: 561px) {
    body.night-shift-page .night-shift-week-input { font-size: 15px; }
}
body.night-shift-page .night-shift-picker-heading { grid-template-columns: minmax(0, 1fr); }
.night-shift-html-template-panel { grid-column: 1 / -1; }
.night-shift-html-template-form { display: grid; gap: 10px; }
.night-shift-html-template-form > label { color: var(--text); font-size: 13px; font-weight: 800; }
.night-shift-html-template-form textarea { width: 100%; min-width: 0; box-sizing: border-box; padding: 12px; border: 1px solid var(--border); border-radius: 12px; background: #f8fbff; color: #15283e; font: 12px/1.5 ui-monospace, SFMono-Regular, Consolas, monospace; tab-size: 2; }
.night-shift-template-fields { padding: 9px 11px; border: 1px solid var(--border); border-radius: 10px; background: #f8fbff; color: var(--muted); font-size: 11px; }
.night-shift-template-fields summary { color: var(--text); font-weight: 800; cursor: pointer; }
.night-shift-template-fields p { margin: 8px 0 0; overflow-wrap: anywhere; }
.night-shift-template-fields code { color: var(--primary); }
.night-shift-template-actions { justify-content: flex-start; gap: 8px; }
@media (max-width: 560px) {
    .night-shift-html-template-form textarea { min-height: 320px; font-size: 11px; }
    .night-shift-template-actions { display: grid; grid-template-columns: minmax(0, 1fr); }
}
@media (min-width: 640px) { body.night-shift-page .container { padding: 20px; } body.night-shift-page .card, .night-shift-editor-card { padding: 16px !important; } .night-shift-save-bar { grid-template-columns: minmax(150px, 1fr) auto auto auto; align-items: center; } .night-shift-save-count { grid-column: auto; } }
/* V147: desktop Night Shift Lists use the dashboard width and a compact three-column picker. */
@media (min-width: 900px) {
    body.night-shift-page .container { width: min(100%, 1240px) !important; padding: 20px !important; }
    body.night-shift-page .card,
    body.night-shift-page .night-shift-editor-card { padding: 18px !important; }
    .night-shift-page-header { margin: 4px 2px 16px; }
    .night-shift-page-header h1 { font-size: 28px; }
    .night-shift-week-card { padding: 14px; }
    .night-shift-picker-heading { grid-template-columns: max-content minmax(260px, 1fr) auto; align-items: center; column-gap: 14px; }
    .night-shift-unified .night-shift-employee-list { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
    .night-shift-unified .night-shift-selected-row { grid-template-columns: 38px minmax(0, 1fr) auto; }
    .night-shift-employee-option,
    .night-shift-unified .night-shift-selected-row { min-height: 68px; }
    .night-shift-save-bar { grid-template-columns: minmax(200px, 1fr) auto auto auto; }
}

@media (max-width: 767px) { body.page-incentive-attendance-report .attendance-sheet-actions .btn { min-height: 40px; padding: 7px 8px; font-size: 11px; } body.page-incentive-attendance-report .attendance-row-actions .btn { min-height: 32px; } }

/* V155: Daily Entry is an accordion-first, touch-friendly PA and work screen. */
body.daily-entry-mobile-page { background: #f6f3f1; }
body.daily-entry-mobile-page .container { width: min(100%, 820px); padding: 12px; }
body.daily-entry-mobile-page .daily-entry-page-title { margin: 2px 2px 10px; padding: 0; background: transparent; }
body.daily-entry-mobile-page .daily-entry-page-title h1 { margin: 0; color: #132d51; font-size: clamp(23px, 7vw, 31px); line-height: 1.14; }
body.daily-entry-mobile-page .daily-entry-toolbar-card { margin-bottom: 10px; padding: 10px !important; border-radius: 15px; }
body.daily-entry-mobile-page .daily-entry-toolbar { gap: 7px; }
body.daily-entry-mobile-page .daily-entry-date-form { display: grid; grid-template-columns: 34px minmax(0, 1fr) 34px; align-items: center; gap: 5px; min-width: 0; }
body.daily-entry-mobile-page .daily-entry-date-form .date-picker-wrap { grid-template-columns: minmax(0, 1fr) 42px; min-width: 0; gap: 4px; }
body.daily-entry-mobile-page .daily-entry-date-arrow { display: inline-grid; width: 34px; min-width: 34px; min-height: 42px !important; padding: 0 !important; place-items: center; font-size: 23px !important; line-height: 1; }
body.daily-entry-mobile-page .daily-entry-date-form input { min-height: 44px; font-size: 15px; }
body.daily-entry-mobile-page .daily-entry-today-btn,
body.daily-entry-mobile-page .daily-entry-fix-form button { min-height: 44px; padding: 8px 11px; border-radius: 11px; font-weight: 850; }
body.daily-entry-mobile-page .daily-entry-date-context { margin-top: 7px; padding-top: 7px; }
body.daily-entry-mobile-page .daily-token-sequence-card { display: none; }
body.daily-entry-mobile-page .daily-entry-card-list { display: grid; gap: 9px; }
body.daily-entry-mobile-page .daily-entry-card { display: block !important; overflow: hidden; padding: 0 !important; border: 1px solid #d8e2ee; border-radius: 16px; background: #fff; box-shadow: 0 3px 12px rgba(21, 40, 70, .06); }
body.daily-entry-mobile-page .daily-entry-card.is-night-shift { border-color: #bcdcf8; background: #edf7ff; }
body.daily-entry-mobile-page .daily-entry-card.is-day-shift { border-color: #eedc92; background: #fff9df; }
body.daily-entry-mobile-page .daily-entry-summary { display: grid; grid-template-columns: minmax(0, 1fr) auto 16px; align-items: center; gap: 8px; min-height: 72px; padding: 11px 12px; cursor: pointer; list-style: none; }
body.daily-entry-mobile-page .daily-entry-summary::-webkit-details-marker { display: none; }
body.daily-entry-mobile-page .daily-entry-summary::after { content: '⌄'; color: #55657a; font-size: 20px; font-weight: 900; line-height: 1; text-align: center; }
body.daily-entry-mobile-page .daily-entry-card[open] .daily-entry-summary::after { content: '⌃'; }
body.daily-entry-mobile-page .daily-entry-identity { display: flex; align-items: center; min-width: 0; gap: 6px; }
body.daily-entry-mobile-page .daily-entry-sequence { flex: 0 0 auto; color: #7d4a35; font-size: 11px; font-weight: 900; }
body.daily-entry-mobile-page .daily-entry-token { flex: 0 0 auto; padding: 5px 7px; border: 1px solid #efaa31; border-radius: 8px; color: #76350f; background: #fff2c5; font-size: 14px; line-height: 1; }
body.daily-entry-mobile-page .daily-entry-name { overflow: hidden; color: #132d51; font-size: 14px; font-weight: 850; line-height: 1.18; text-overflow: ellipsis; white-space: nowrap; }
body.daily-entry-mobile-page .daily-entry-summary-meta { display: grid; justify-items: end; gap: 3px; color: #53667b; font-size: 11px; font-weight: 800; line-height: 1.15; text-align: right; }
body.daily-entry-mobile-page .daily-entry-summary-meta strong { padding: 3px 6px; border-radius: 999px; color: #81391d; background: rgba(255,255,255,.72); font-size: 10px; }
body.daily-entry-mobile-page .daily-entry-card-body { padding: 0 12px 12px; border-top: 1px solid rgba(88, 111, 140, .16); }
body.daily-entry-mobile-page .daily-entry-copy-box { width: 100%; margin: 10px 0; }
body.daily-entry-mobile-page .daily-entry-copy-box .copy-from-select { width: 100%; min-height: 42px; }
body.daily-entry-mobile-page .daily-entry-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
body.daily-entry-mobile-page .daily-entry-controls label,
body.daily-entry-mobile-page .work-field-label { display: block; margin: 0 0 4px; color: #31425a; font-size: 11px; font-weight: 850; }
body.daily-entry-mobile-page .daily-entry-controls select { min-height: 43px; }
body.daily-entry-mobile-page .daily-status-control,
body.daily-entry-mobile-page .daily-pa-type-control { grid-column: 1 / -1; }
body.daily-entry-mobile-page .status-native-select { position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; border: 0 !important; opacity: 0 !important; pointer-events: none !important; }
body.daily-entry-mobile-page .daily-status-segment { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
body.daily-entry-mobile-page .daily-status-segment button { min-height: 43px; padding: 7px 5px; border: 1px solid #c9d7e7; border-radius: 10px; color: #40546e; background: rgba(255,255,255,.78); box-shadow: none; font-size: 13px; font-weight: 850; }
body.daily-entry-mobile-page .daily-status-segment button.is-active { border-color: #1d6eb2; color: #fff; background: #216eae; box-shadow: 0 3px 7px rgba(24, 86, 141, .22); }
body.daily-entry-mobile-page .daily-status-segment button.is-active[data-status-value="PA"] { border-color: #ad4b2a; background: #c25a33; }
body.daily-entry-mobile-page .daily-status-segment button.is-active[data-status-value="IDLE"] { border-color: #647b53; background: #71895d; }
body.daily-entry-mobile-page .daily-pa-type-control select { width: 100%; min-height: 43px; }
body.daily-entry-mobile-page .daily-legacy-status { display: block; margin-top: 5px; color: #8a4526; font-size: 11px; font-weight: 750; }
body.daily-entry-mobile-page .daily-entry-metric .readonly-pill { display: flex; align-items: center; min-height: 43px; padding: 8px 10px; border-radius: 10px; color: #132d51; background: rgba(239,244,251,.9); font-size: 15px; font-weight: 900; }
body.daily-entry-mobile-page .work-lines-wrap { margin-top: 10px; }
body.daily-entry-mobile-page .work-lines { display: grid; gap: 8px; }
body.daily-entry-mobile-page .work-line { display: grid; grid-template-columns: minmax(0, 1fr) 82px; gap: 7px; padding: 9px; border: 1px solid #d3e0ef; border-radius: 11px; background: rgba(255,255,255,.58); }
body.daily-entry-mobile-page .work-description-group { grid-column: 1 / -1; }
body.daily-entry-mobile-page .work-coach-group { grid-column: 1; }
body.daily-entry-mobile-page .work-hours-group { grid-column: 2; }
body.daily-entry-mobile-page .remove-work-line { grid-column: 1 / -1; min-height: 36px; }
body.daily-entry-mobile-page .daily-entry-card-footer { display: grid; grid-template-columns: minmax(0, 1fr); gap: 7px; margin-top: 10px; }
body.daily-entry-mobile-page .daily-entry-card-footer .btn { width: 100%; min-width: 0; min-height: 43px; border-radius: 10px; font-size: 13px; font-weight: 850; }
body.daily-entry-mobile-page .daily-entry-card-footer .save-entry-btn { background: linear-gradient(135deg, #c45b32, #de8a36); box-shadow: 0 4px 10px rgba(151, 68, 27, .2); }
body.daily-entry-mobile-page .sticky-save-bar { display: none; }
@media (min-width: 641px) {
    body.daily-entry-mobile-page .container { padding: 20px; }
    body.daily-entry-mobile-page .daily-entry-card-list { gap: 12px; }
    body.daily-entry-mobile-page .daily-entry-summary { min-height: 64px; }
    body.daily-entry-mobile-page .daily-entry-controls { grid-template-columns: minmax(160px, .9fr) minmax(240px, 1.4fr) minmax(160px, .9fr) minmax(120px, .7fr); align-items: end; }
    body.daily-entry-mobile-page .daily-status-control { grid-column: auto; }
    body.daily-entry-mobile-page .daily-pa-type-control { grid-column: auto; }
    body.daily-entry-mobile-page .daily-entry-metric { grid-column: auto; }
    body.daily-entry-mobile-page .work-line { grid-template-columns: minmax(170px, .85fr) minmax(0, 1.6fr) 90px auto; align-items: end; }
    body.daily-entry-mobile-page .work-description-group,
    body.daily-entry-mobile-page .work-coach-group,
    body.daily-entry-mobile-page .work-hours-group,
    body.daily-entry-mobile-page .remove-work-line { grid-column: auto; }
    body.daily-entry-mobile-page .daily-entry-card-footer { grid-template-columns: auto minmax(180px, 260px); justify-content: end; }
}

/* Section settings: shared, compact appearance controls for JC Lite and JC Full. */
.section-settings-page { display: grid; gap: 18px; max-width: 1180px; margin: 0 auto; }
.section-settings-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 8px 2px 2px; }
.section-settings-heading > div { display: flex; align-items: center; gap: 13px; }
.section-settings-heading-mark { display: grid; width: 48px; height: 48px; place-items: center; border: 1px solid color-mix(in srgb, var(--primary) 18%, transparent); border-radius: 16px; color: var(--primary); background: color-mix(in srgb, var(--primary) 9%, var(--card)); font-size: 24px; }
.section-settings-eyebrow { display: block; margin-bottom: 2px; color: var(--muted); font-size: 10px; font-weight: 850; letter-spacing: .13em; line-height: 1.3; }
.section-settings-heading h1 { margin: 0; font-size: clamp(24px, 3vw, 32px); letter-spacing: -.035em; }
.section-settings-identity { padding: 8px 12px; border: 1px solid var(--border); border-radius: 999px; color: var(--primary); background: var(--card); font-size: 11px; font-weight: 850; letter-spacing: .08em; }
.section-settings-grid { display: grid; grid-template-columns: minmax(0, 1.24fr) minmax(300px, .76fr); align-items: stretch; gap: 16px; }
.section-settings-panel.card { min-width: 0; margin: 0; padding: clamp(17px, 2.3vw, 25px); border-color: color-mix(in srgb, var(--border) 78%, var(--primary)); border-radius: 22px; box-shadow: 0 15px 38px rgba(16, 24, 40, .065); }
.section-settings-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 19px; }
.section-settings-panel-head > div { display: flex; min-width: 0; align-items: center; gap: 11px; }
.section-settings-panel-head h2 { margin: 0; font-size: 20px; letter-spacing: -.025em; }
.section-settings-panel-icon { display: grid; width: 39px; height: 39px; flex: 0 0 39px; place-items: center; border-radius: 13px; color: #fff; background: linear-gradient(140deg, var(--primary), var(--accent)); font-size: 18px; font-weight: 800; }
.section-settings-chip { flex: 0 0 auto; padding: 6px 9px; border: 1px solid var(--border); border-radius: 999px; color: var(--muted); background: var(--bg); font-size: 9px; font-weight: 850; letter-spacing: .09em; }
.section-settings-theme-form { display: grid; gap: 16px; }
.section-theme-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; min-width: 0; margin: 0; padding: 0; border: 0; }
.section-theme-options legend { width: 100%; margin-bottom: 9px; color: var(--muted); font-size: 12px; font-weight: 700; }
.section-theme-option { position: relative; display: flex; min-width: 0; min-height: 65px; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 10px; border: 1px solid var(--border); border-radius: 15px; background: var(--card); cursor: pointer; transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease; }
.section-theme-option:hover { transform: translateY(-1px); border-color: color-mix(in srgb, var(--option-primary) 48%, var(--border)); }
.section-theme-option:has(input:checked) { border-color: var(--option-primary); box-shadow: 0 0 0 2px color-mix(in srgb, var(--option-primary) 15%, transparent); background: color-mix(in srgb, var(--option-primary) 4%, var(--card)); }
.section-theme-option > input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.section-theme-option:has(input:focus-visible) { outline: 3px solid color-mix(in srgb, var(--option-primary) 30%, transparent); outline-offset: 2px; }
.section-theme-option-body { display: grid; min-width: 0; gap: 7px; }
.section-theme-option-body strong { overflow: hidden; color: var(--text); font-size: 11px; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.section-theme-swatches { display: flex; width: 62px; height: 15px; overflow: hidden; border: 1px solid color-mix(in srgb, var(--text) 12%, transparent); border-radius: 999px; }
.section-theme-swatches i { flex: 1; background: var(--option-primary); }
.section-theme-swatches i:nth-child(2) { background: var(--option-accent); }
.section-theme-swatches i:nth-child(3) { background: var(--option-background); }
.section-theme-radio-mark { display: grid; width: 17px; height: 17px; flex: 0 0 17px; place-items: center; border: 1.5px solid var(--border); border-radius: 50%; }
.section-theme-option:has(input:checked) .section-theme-radio-mark { border-color: var(--option-primary); }
.section-theme-option:has(input:checked) .section-theme-radio-mark::after { width: 8px; height: 8px; border-radius: 50%; background: var(--option-primary); content: ""; }
.section-theme-custom { padding: 12px; border: 1px solid var(--border); border-radius: 15px; background: var(--bg); }
.section-theme-custom[hidden] { display: none !important; }
.section-theme-colours { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 9px; }
.section-theme-colour { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 6px; color: var(--text); font-size: 11px; font-weight: 700; }
.section-theme-colour input[type="color"] { width: 40px; height: 34px; padding: 3px; border: 1px solid var(--border); border-radius: 9px; background: var(--card); cursor: pointer; }
.section-theme-preview { overflow: hidden; border: 1px solid var(--border); border-radius: 16px; color: var(--preview-text); background: var(--preview-background); }
.section-theme-preview-bar { display: flex; min-height: 38px; align-items: center; justify-content: space-between; gap: 8px; padding: 7px 11px; color: #fff; background: linear-gradient(110deg, var(--preview-primary), var(--preview-accent)); font-size: 10px; letter-spacing: .04em; }
.section-theme-preview-home { font-size: 17px; line-height: 1; }
.section-theme-preview-menu { font-size: 14px; font-weight: 900; }
.section-theme-preview-content { display: grid; gap: 8px; padding: 12px; background: var(--preview-background); }
.section-theme-preview-content > span { color: var(--preview-primary); font-size: 8px; font-weight: 850; letter-spacing: .12em; }
.section-theme-preview-content > strong { font-size: 12px; }
.section-theme-preview-content > i { display: block; width: 100%; height: 7px; border: 1px solid color-mix(in srgb, var(--preview-primary) 13%, transparent); border-radius: 99px; background: var(--preview-card); }
.section-theme-preview-content > i:last-child { width: 64%; }
.section-settings-form-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.section-settings-form-footer > span { color: var(--muted); font-size: 11px; }
.section-settings-form-footer button,
.section-signature-form button { min-height: 42px; padding: 9px 16px; border: 0; border-radius: 12px; color: #fff; background: linear-gradient(115deg, var(--primary), var(--accent)); box-shadow: 0 7px 18px color-mix(in srgb, var(--primary) 18%, transparent); font: inherit; font-size: 13px; font-weight: 800; cursor: pointer; }
.section-settings-form-footer button:hover,
.section-signature-form button:hover { filter: brightness(1.04); }
.section-signature-panel { display: flex; flex-direction: column; }
.section-signature-preview { display: grid; min-height: 215px; flex: 1 1 auto; align-content: center; justify-items: center; gap: 8px; overflow: hidden; padding: 16px; border: 1px dashed color-mix(in srgb, var(--primary) 30%, var(--border)); border-radius: 17px; color: var(--muted); background: linear-gradient(145deg, color-mix(in srgb, var(--primary) 5%, var(--card)), var(--bg)); font-size: 11px; font-weight: 700; }
.section-signature-preview.has-signature { border-style: solid; background: #fff; }
.section-signature-preview img { display: block; max-width: 100%; max-height: 190px; object-fit: contain; }
.section-signature-empty-icon { display: grid; width: 48px; height: 48px; place-items: center; border-radius: 15px; color: var(--primary); background: color-mix(in srgb, var(--primary) 10%, var(--card)); font-size: 24px; }
.section-signature-form { display: grid; gap: 8px; margin-top: 15px; }
.section-signature-form label { color: var(--text); font-size: 12px; font-weight: 750; }
.section-signature-form input[type="file"] { width: 100%; min-width: 0; padding: 8px; border: 1px solid var(--border); border-radius: 11px; background: var(--bg); font: inherit; font-size: 11px; }
.section-signature-form button { justify-self: start; margin-top: 2px; }
.section-signature-remove { margin-top: 8px; }
.section-signature-remove .btn { min-height: 38px; border-radius: 11px; }
@media (max-width: 760px) {
    .section-settings-grid { grid-template-columns: minmax(0, 1fr); }
    .section-signature-preview { min-height: 175px; }
}
@media (max-width: 460px) {
    .section-settings-page { gap: 12px; }
    .section-settings-heading-mark { width: 42px; height: 42px; border-radius: 14px; }
    .section-settings-identity { padding: 7px 9px; font-size: 9px; }
    .section-settings-panel.card { padding: 15px; border-radius: 18px; }
    .section-settings-panel-head { margin-bottom: 15px; }
    .section-settings-panel-head h2 { font-size: 18px; }
    .section-theme-options { gap: 7px; }
    .section-theme-option { min-height: 62px; padding: 8px; }
    .section-theme-option-body strong { font-size: 10px; }
    .section-theme-colours { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .section-settings-form-footer { align-items: stretch; flex-direction: column; }
    .section-settings-form-footer button { width: 100%; }
    .section-signature-form button { width: 100%; }
}

/* V156: match the approved Daily Entry mobile card layout. */
@media (max-width: 640px) {
    body.daily-entry-mobile-page { background: #fff; }
    body.daily-entry-mobile-page .container { width: min(100%, 620px); padding: 18px 24px 56px; }
    body.daily-entry-mobile-page .daily-entry-toolbar-card { margin: 0; padding: 0 !important; border: 0; background: transparent; box-shadow: none; }
    body.daily-entry-mobile-page .daily-entry-toolbar { display: block; }
    body.daily-entry-mobile-page .daily-entry-date-form { grid-template-columns: 74px minmax(0, 1fr) 74px; gap: 7px; padding: 10px; border: 2px solid #d8e0ea; border-radius: 14px; background: #fff; }
    body.daily-entry-mobile-page .daily-entry-date-form .date-picker-wrap { grid-template-columns: minmax(0, 1fr) 44px; }
    body.daily-entry-mobile-page .daily-entry-date-form input { min-height: 58px; padding: 8px 2px; border: 0; background: transparent; color: #10275b; font-size: clamp(22px, 6.6vw, 31px); font-weight: 900; text-align: center; }
    body.daily-entry-mobile-page .daily-entry-date-arrow { width: 74px; min-width: 74px; min-height: 58px !important; border: 0; border-radius: 12px; color: #10275b; background: #f1f5f9; font-size: 48px !important; font-weight: 400; }
    body.daily-entry-mobile-page .daily-entry-page-title { margin: 28px 0 28px; padding: 0; text-align: center; }
    body.daily-entry-mobile-page .daily-entry-page-title h1 { color: #10275b; font-size: clamp(28px, 8vw, 40px); font-weight: 900; line-height: 1.1; }
    body.daily-entry-mobile-page .daily-entry-card-list { gap: 24px; }
    body.daily-entry-mobile-page .daily-entry-card { border: 0; border-radius: 18px; box-shadow: none; }
    body.daily-entry-mobile-page .daily-entry-card.is-night-shift { background: linear-gradient(135deg, #e8f5ff, #dff3ff); }
    body.daily-entry-mobile-page .daily-entry-card.is-day-shift { background: linear-gradient(135deg, #fff9d6, #fff7cb); }
    body.daily-entry-mobile-page .daily-entry-summary { grid-template-columns: auto minmax(0, 1fr) auto 28px; gap: 14px; min-height: 142px; padding: 25px 24px; }
    body.daily-entry-mobile-page .daily-entry-identity { display: block; }
    body.daily-entry-mobile-page .daily-entry-sequence { display: none; }
    body.daily-entry-mobile-page .daily-entry-token { display: inline-flex; align-items: center; min-height: 72px; padding: 12px 20px; border: 0; border-radius: 15px; color: #10275b; background: #a9d2ff; font-size: clamp(20px, 5.5vw, 29px); font-weight: 900; }
    body.daily-entry-card.is-day-shift .daily-entry-token { background: #ffe77b; }
    body.daily-entry-mobile-page .daily-entry-person { display: grid; min-width: 0; gap: 6px; }
    body.daily-entry-mobile-page .daily-entry-name { overflow: hidden; color: #10275b; font-size: clamp(21px, 5.8vw, 30px); font-weight: 900; line-height: 1.08; text-overflow: ellipsis; white-space: nowrap; }
    body.daily-entry-mobile-page .daily-entry-person [data-summary-shift] { overflow: hidden; color: #5f6f88; font-size: clamp(16px, 4.8vw, 23px); font-weight: 600; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
    body.daily-entry-mobile-page .daily-entry-summary-status { align-self: center; padding: 8px 12px; border-radius: 999px; color: #b54d1d; background: #ffe1d4; font-size: 12px; font-weight: 900; white-space: nowrap; }
    body.daily-entry-mobile-page .daily-entry-summary::after { align-self: center; color: #10275b; font-size: 42px; font-weight: 700; }
    body.daily-entry-mobile-page .daily-entry-card-body { margin: 0 14px 14px; padding: 24px 20px 20px; border: 0; border-radius: 16px; background: rgba(255,255,255,.88); }
    body.daily-entry-mobile-page .daily-entry-shift-readonly,
    body.daily-entry-mobile-page .daily-entry-metric { display: none !important; }
    body.daily-entry-mobile-page .daily-entry-controls { display: grid; grid-template-columns: minmax(0, 1fr) !important; gap: 15px; margin: 0; }
    body.daily-entry-mobile-page .daily-entry-controls > div { grid-column: 1 / -1 !important; grid-row: auto !important; }
    body.daily-entry-mobile-page .daily-status-control > label { display: none; }
    body.daily-entry-mobile-page .daily-status-segment { gap: 0; overflow: hidden; border: 2px solid #bdd7f1; border-radius: 13px; }
    body.daily-entry-mobile-page .daily-status-segment button { min-height: 72px; border: 0; border-right: 1px solid #bdd7f1; border-radius: 0; color: #10275b; background: #f3f8ff; font-size: clamp(18px, 5vw, 27px); }
    body.daily-entry-mobile-page .daily-status-segment button:last-child { border-right: 0; }
    body.daily-entry-mobile-page .daily-status-segment button.is-active { color: #fff; background: linear-gradient(135deg, #176fc5, #266bc0); box-shadow: none; }
    body.daily-entry-mobile-page .daily-status-segment button.is-active[data-status-value="PA"] { background: linear-gradient(135deg, #cb6138, #df7b47); }
    body.daily-entry-mobile-page .daily-status-segment button.is-active[data-status-value="IDLE"] { background: linear-gradient(135deg, #6e8560, #829c6f); }
    body.daily-entry-mobile-page .daily-pa-type-control label { color: #536986; font-size: 15px; }
    body.daily-entry-mobile-page .daily-pa-type-control select { min-height: 54px; font-size: 17px; }
    body.daily-entry-mobile-page .work-lines-wrap { margin-top: 24px; }
    body.daily-entry-mobile-page .work-line { grid-template-columns: minmax(0, 1.1fr) minmax(104px, .9fr); gap: 12px 16px; padding: 0; border: 0; background: transparent; }
    body.daily-entry-mobile-page .work-description-group { grid-column: 1 / -1 !important; }
    body.daily-entry-mobile-page .work-field-label { margin-bottom: 8px; color: #506383; font-size: 15px; font-weight: 800; }
    body.daily-entry-mobile-page .work-line input,
    body.daily-entry-mobile-page .work-line select { min-height: 56px; border-color: #cbd7e7; border-radius: 12px; color: #10275b; font-size: 18px; }
    body.daily-entry-mobile-page .remove-work-line { grid-column: 1 / -1 !important; }
    body.daily-entry-mobile-page .daily-entry-card-footer { grid-template-columns: minmax(0, 1fr); gap: 16px; margin-top: 24px; padding: 0; border: 0; }
    body.daily-entry-mobile-page .daily-entry-card-footer .btn { min-height: 72px; border-radius: 14px; font-size: clamp(18px, 5.4vw, 27px); }
    body.daily-entry-mobile-page .daily-entry-card-footer .add-work-line { order: 1; border: 2px solid #bddaf6; color: #1c68bb; background: #f6fbff; }
    body.daily-entry-mobile-page .daily-entry-card-footer .save-entry-btn { order: 2; color: #fff; background: linear-gradient(135deg, #ff7621, #f47a20); box-shadow: none; }
}

/* V157: correct narrow-phone sizing and override legacy grid placement. */
@media (min-width: 641px) {
    body.daily-entry-mobile-page .container { width: min(100%, 1240px) !important; max-width: none; }
}
@media (max-width: 640px) {
    body.daily-entry-mobile-page .container { width: 100% !important; max-width: 620px; padding: 12px 10px 48px !important; }
    body.daily-entry-mobile-page .daily-entry-date-form { grid-template-columns: 52px minmax(0, 1fr) 52px !important; padding: 8px !important; }
    body.daily-entry-mobile-page .daily-entry-date-form .date-picker-wrap { grid-template-columns: minmax(0, 1fr) 35px !important; }
    body.daily-entry-mobile-page .daily-entry-date-form input { min-height: 52px !important; font-size: clamp(20px, 5.8vw, 25px) !important; }
    body.daily-entry-mobile-page .daily-entry-date-arrow { width: 52px !important; min-width: 52px !important; min-height: 52px !important; font-size: 38px !important; }
    body.daily-entry-mobile-page .daily-entry-page-title { margin: 24px 0 24px !important; }
    body.daily-entry-mobile-page .daily-entry-page-title h1 { font-size: clamp(25px, 6.5vw, 31px) !important; white-space: nowrap; }
    body.daily-entry-mobile-page .daily-entry-summary { grid-template-columns: auto minmax(0, 1fr) auto 20px !important; gap: 8px !important; min-height: 106px !important; padding: 18px 14px !important; }
    body.daily-entry-mobile-page .daily-entry-token { min-height: 54px !important; padding: 8px 12px !important; border-radius: 13px !important; font-size: clamp(18px, 5.2vw, 23px) !important; }
    body.daily-entry-mobile-page .daily-entry-person { gap: 4px !important; }
    body.daily-entry-mobile-page .daily-entry-name { font-size: clamp(18px, 5.3vw, 24px) !important; }
    body.daily-entry-mobile-page .daily-entry-person [data-summary-shift] { font-size: clamp(14px, 4.3vw, 18px) !important; }
    body.daily-entry-mobile-page .daily-entry-summary-status { padding: 6px 8px !important; font-size: 10px !important; }
    body.daily-entry-mobile-page .daily-entry-summary::after { font-size: 30px !important; }
    body.daily-entry-mobile-page .daily-entry-card-body { margin: 0 14px 14px !important; padding: 20px !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line { display: grid !important; grid-template-columns: minmax(0, 1.15fr) minmax(98px, .85fr) !important; grid-template-areas: none !important; min-width: 0 !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index] .work-description-group,
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line:not([data-line-index]) .work-description-group { display: block !important; grid-column: 1 / -1 !important; grid-row: auto !important; grid-area: auto !important; width: 100% !important; min-width: 0 !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index] .work-coach-group,
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line:not([data-line-index]) .work-coach-group { display: block !important; grid-column: 1 !important; grid-row: auto !important; grid-area: auto !important; min-width: 0 !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index] .work-hours-group,
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line:not([data-line-index]) .work-hours-group { display: block !important; grid-column: 2 !important; grid-row: auto !important; grid-area: auto !important; min-width: 0 !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-description-group input[data-line-field="work"],
    body.daily-entry-mobile-page.page-daily-bulk-work .work-description-group input { display: block; width: 100% !important; min-width: 0 !important; }
}

/* V158: compact mobile field order: status, coach/hours/GA, work, actions. */
@media (max-width: 640px) {
    body.daily-entry-mobile-page .daily-entry-summary { grid-template-columns: auto minmax(0, 1fr) 20px !important; }
    body.daily-entry-mobile-page .daily-entry-summary-status { display: none !important; }
    body.daily-entry-mobile-page .daily-entry-person [data-summary-shift] { white-space: normal; }
    body.daily-entry-mobile-page .daily-entry-card-body { padding: 18px 16px !important; }
    body.daily-entry-mobile-page .daily-entry-controls { gap: 12px !important; }
    body.daily-entry-mobile-page .work-lines-wrap { margin-top: 18px !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line { grid-template-columns: minmax(0, 1fr) 84px 72px !important; gap: 10px !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index] .work-coach-group,
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line:not([data-line-index]) .work-coach-group { grid-column: 1 !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index] .work-hours-group,
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line:not([data-line-index]) .work-hours-group { grid-column: 2 !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index] .work-ga-group { display: block !important; grid-column: 3 !important; grid-row: auto !important; grid-area: auto !important; min-width: 0 !important; }
    body.daily-entry-mobile-page .work-ga-group .readonly-pill { display: flex; align-items: center; justify-content: center; min-height: 56px; padding: 7px 4px; border: 1px solid #cbd7e7; border-radius: 12px; color: #10275b; background: #f1f6fc; font-size: 17px; font-weight: 900; }
    body.daily-entry-mobile-page .work-line[data-line-index] .work-description-group { grid-column: 1 / -1 !important; }
    body.daily-entry-mobile-page .daily-entry-card-footer { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; gap: 10px !important; margin-top: 18px !important; }
    body.daily-entry-mobile-page .daily-entry-card-footer .btn { min-height: 54px; padding: 8px 6px; font-size: 14px; }
    body.daily-entry-mobile-page .daily-entry-card-footer .add-work-line { grid-column: 1; }
    body.daily-entry-mobile-page .daily-entry-card-footer .save-entry-btn { grid-column: 2; }
}

/* V159: balanced phone typography and aligned entry fields. */
@media (max-width: 640px) {
    body.daily-entry-mobile-page .daily-entry-summary { min-height: 90px !important; padding: 14px 12px !important; }
    body.daily-entry-mobile-page .daily-entry-token { min-height: 48px !important; padding: 7px 10px !important; font-size: clamp(17px, 4.7vw, 20px) !important; }
    body.daily-entry-mobile-page .daily-entry-name { font-size: clamp(17px, 4.8vw, 20px) !important; }
    body.daily-entry-mobile-page .daily-entry-person [data-summary-shift] { font-size: clamp(13px, 4vw, 16px) !important; }
    body.daily-entry-mobile-page .daily-status-segment button { min-height: 54px !important; font-size: clamp(16px, 4.6vw, 20px) !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line { align-items: start; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index] .work-coach-group,
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index] .work-hours-group,
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index] .work-ga-group { display: grid !important; grid-template-rows: 16px 48px !important; gap: 5px !important; align-items: stretch !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index] .work-coach-group > label,
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index] .work-hours-group > label,
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index] .work-ga-group > label { height: auto !important; min-height: 0 !important; margin: 0 !important; line-height: 16px !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index] .work-coach-group > select,
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index] .work-hours-group > input,
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index] .work-ga-group > .readonly-pill { grid-area: auto !important; width: 100% !important; height: 48px !important; min-height: 48px !important; margin: 0 !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index] .work-description-group { display: block !important; grid-column: 1 / -1 !important; grid-row: auto !important; grid-area: auto !important; width: 100% !important; max-width: none !important; min-width: 0 !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index] .work-description-group > input { display: block !important; width: 100% !important; max-width: none !important; min-width: 0 !important; box-sizing: border-box !important; }
    body.daily-entry-mobile-page .daily-nonwork-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 14px; }
    body.daily-entry-mobile-page .daily-nonwork-metrics[hidden] { display: none !important; }
    body.daily-entry-mobile-page .daily-nonwork-metrics > div { padding: 9px 10px; border: 1px solid #cbd7e7; border-radius: 11px; background: #f4f8fd; }
    body.daily-entry-mobile-page .daily-nonwork-metrics span { display: block; color: #536983; font-size: 11px; font-weight: 850; }
    body.daily-entry-mobile-page .daily-nonwork-metrics output { display: block; margin-top: 3px; color: #10275b; font-size: 20px; font-weight: 900; }
    body.daily-entry-mobile-page .daily-entry-card-footer .btn { min-height: 50px !important; font-size: 13px !important; }
}

/* V160: reset legacy first/additional work-line placement on mobile. */
@media (max-width: 640px) {
    body.daily-entry-mobile-page.page-daily-bulk-work .work-lines-wrap,
    body.daily-entry-mobile-page.page-daily-bulk-work .work-lines { display: grid !important; width: 100% !important; min-width: 0 !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index="0"] { display: grid !important; grid-template-columns: minmax(0, 1fr) 84px 72px !important; grid-template-areas: none !important; width: 100% !important; min-width: 0 !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index="0"] .work-coach-group { grid-column: 1 !important; grid-row: auto !important; grid-area: auto !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index="0"] .work-hours-group { grid-column: 2 !important; grid-row: auto !important; grid-area: auto !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index="0"] .work-ga-group { grid-column: 3 !important; grid-row: auto !important; grid-area: auto !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index="0"] .work-description-group { grid-column: 1 / 4 !important; grid-row: auto !important; grid-area: auto !important; display: block !important; width: 100% !important; max-width: none !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index="0"] .work-description-group input { width: 100% !important; max-width: none !important; min-width: 0 !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line:not([data-line-index="0"]) { display: grid !important; grid-template-columns: minmax(0, 1fr) 96px !important; grid-template-areas: none !important; width: 100% !important; min-width: 0 !important; padding: 12px !important; border: 1px solid #d8e5f2 !important; border-radius: 12px !important; background: #f8fbff !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line:not([data-line-index="0"]) .work-coach-group { grid-column: 1 !important; grid-row: auto !important; grid-area: auto !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line:not([data-line-index="0"]) .work-hours-group { grid-column: 2 !important; grid-row: auto !important; grid-area: auto !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line:not([data-line-index="0"]) .work-description-group { grid-column: 1 / 3 !important; grid-row: auto !important; grid-area: auto !important; display: block !important; width: 100% !important; max-width: none !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line:not([data-line-index="0"]) .work-description-group input { width: 100% !important; max-width: none !important; min-width: 0 !important; }
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line:not([data-line-index="0"]) .remove-work-line { grid-column: 1 / 3 !important; grid-row: auto !important; grid-area: auto !important; width: 100% !important; min-width: 0 !important; }
}

/* V161: compact, consistent mobile controls and strictly relevant PA/Idle fields. */
@media (max-width: 640px) {
    body.daily-entry-mobile-page .work-lines-wrap[hidden],
    body.daily-entry-mobile-page .daily-entry-card-footer .add-work-line[hidden],
    body.daily-entry-mobile-page .daily-pa-type-control[hidden] { display: none !important; }

    body.daily-entry-mobile-page .daily-status-segment button,
    body.daily-entry-mobile-page .daily-entry-card-footer .btn,
    body.daily-entry-mobile-page .remove-work-line {
        min-height: 48px !important;
        height: 48px !important;
        padding: 7px 10px !important;
        font-size: 15px !important;
        line-height: 1.1 !important;
    }

    body.daily-entry-mobile-page .work-field-label,
    body.daily-entry-mobile-page .daily-pa-type-control label,
    body.daily-entry-mobile-page .daily-nonwork-metrics span {
        margin-bottom: 4px !important;
        color: #506383 !important;
        font-size: 12px !important;
        font-weight: 800 !important;
        line-height: 1.2 !important;
    }

    body.daily-entry-mobile-page.page-daily-bulk-work .work-lines-wrap,
    body.daily-entry-mobile-page.page-daily-bulk-work .work-lines,
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line,
    body.daily-entry-mobile-page.page-daily-bulk-work .work-description-group,
    body.daily-entry-mobile-page.page-daily-bulk-work .work-description-group input {
        min-width: 0 !important;
        max-width: none !important;
    }

    body.daily-entry-mobile-page.page-daily-bulk-work .work-description-group {
        grid-column: 1 / -1 !important;
        width: 100% !important;
    }

    body.daily-entry-mobile-page.page-daily-bulk-work .work-description-group input {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box !important;
        font-size: 16px !important;
    }

    body.daily-entry-mobile-page.page-daily-bulk-work .work-line input,
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line select,
    body.daily-entry-mobile-page .daily-pa-type-control select {
        min-height: 48px !important;
        height: 48px !important;
        font-size: 16px !important;
    }

    body.daily-entry-mobile-page.page-daily-bulk-work .work-ga-group .readonly-pill {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-height: 48px !important;
        height: 48px !important;
        padding: 7px 4px !important;
        box-sizing: border-box !important;
        font-size: 16px !important;
        line-height: 1.1 !important;
    }

    body.daily-entry-mobile-page .daily-nonwork-metrics > div {
        min-height: 72px !important;
        padding: 10px 12px !important;
    }

    body.daily-entry-mobile-page .daily-nonwork-metrics output {
        font-size: 18px !important;
        line-height: 1.15 !important;
    }
}

/* V162: Work sits outside the field row, preventing legacy grid rules from constraining it. */
@media (max-width: 640px) {
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    body.daily-entry-mobile-page.page-daily-bulk-work .work-line-meta {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 84px 72px !important;
        gap: 10px !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    body.daily-entry-mobile-page.page-daily-bulk-work .work-line:not([data-line-index="0"]) .work-line-meta {
        grid-template-columns: minmax(0, 1fr) 96px !important;
    }

    body.daily-entry-mobile-page.page-daily-bulk-work .work-line-meta .work-coach-group,
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line-meta .work-hours-group,
    body.daily-entry-mobile-page.page-daily-bulk-work .work-line-meta .work-ga-group {
        display: grid !important;
        grid-column: auto !important;
        grid-row: auto !important;
        grid-area: auto !important;
        grid-template-rows: 16px 48px !important;
        gap: 4px !important;
        min-width: 0 !important;
    }

    body.daily-entry-mobile-page.page-daily-bulk-work .work-line-meta [data-line-field] {
        grid-area: auto !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    body.daily-entry-mobile-page.page-daily-bulk-work .work-description-group {
        display: block !important;
        grid-column: auto !important;
        grid-row: auto !important;
        grid-area: auto !important;
        width: 100% !important;
        margin-top: 10px !important;
    }

    body.daily-entry-mobile-page.page-daily-bulk-work .work-description-group input {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        box-sizing: border-box !important;
    }

    body.daily-entry-mobile-page.page-daily-bulk-work .work-line .remove-work-line {
        display: grid !important;
        width: 48px !important;
        min-width: 48px !important;
        height: 48px !important;
        min-height: 48px !important;
        margin: 10px 0 0 auto !important;
        padding: 0 !important;
        place-items: center !important;
        border-radius: 12px !important;
        font-size: 28px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
    }

    body.daily-entry-mobile-page.page-daily-bulk-work .work-line[data-line-index="0"] .remove-work-line[hidden] {
        display: none !important;
    }
}

/* V163: use the guaranteed mobile page class; this supersedes every legacy daily-entry grid. */
@media (max-width: 640px) {
    body.daily-entry-mobile-page .work-lines-wrap,
    body.daily-entry-mobile-page .work-lines {
        display: grid !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    body.daily-entry-mobile-page .work-line {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    body.daily-entry-mobile-page .work-line-meta {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 84px 72px !important;
        gap: 10px !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    body.daily-entry-mobile-page .work-line:not([data-line-index="0"]) .work-line-meta {
        grid-template-columns: minmax(0, 1fr) 96px !important;
    }

    body.daily-entry-mobile-page .work-line-meta .work-field-group {
        display: grid !important;
        grid-column: auto !important;
        grid-row: auto !important;
        grid-area: auto !important;
        grid-template-rows: 16px 48px !important;
        gap: 4px !important;
        min-width: 0 !important;
    }

    body.daily-entry-mobile-page .work-line-meta [data-line-field] {
        grid-area: auto !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    body.daily-entry-mobile-page .work-description-group {
        display: block !important;
        grid-column: auto !important;
        grid-row: auto !important;
        grid-area: auto !important;
        width: 100% !important;
        margin-top: 10px !important;
    }

    body.daily-entry-mobile-page .work-description-group input {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        box-sizing: border-box !important;
    }

    body.daily-entry-mobile-page .work-line .remove-work-line {
        display: grid !important;
        width: 48px !important;
        min-width: 48px !important;
        height: 48px !important;
        min-height: 48px !important;
        margin: 10px 0 0 auto !important;
        padding: 0 !important;
        place-items: center !important;
        border-radius: 12px !important;
        font-size: 28px !important;
        line-height: 1 !important;
    }

    body.daily-entry-mobile-page .work-line[data-line-index="0"] .remove-work-line[hidden] {
        display: none !important;
    }
}

/* V168: Factory Working Hours with live, read-only GA duration. */
.factory-hours-editor { overflow: hidden; border: 1px solid #cfe0f1; border-radius: 14px; background: #fbfdff; }
.factory-hours-editor-head,
.factory-hours-editor-row { display: grid; grid-template-columns: minmax(170px, 1.2fr) minmax(150px, 1fr) minmax(150px, 1fr) minmax(130px, .75fr); gap: 12px; align-items: center; }
.factory-hours-editor-head { padding: 10px 14px; color: #4d6581; background: #edf5fc; font-size: 11px; font-weight: 850; letter-spacing: .02em; text-transform: uppercase; }
.factory-hours-editor-row { padding: 12px 14px; border-top: 1px solid #dfebf5; }
.factory-hours-editor-row > strong { color: #132d51; font-size: 14px; font-weight: 850; }
.factory-hours-editor-row > div { min-width: 0; }
.factory-hours-editor-row label { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.factory-hours-editor-row input { width: 100%; min-height: 42px; }
.factory-hours-ga { display: flex; align-items: center; justify-content: center; min-height: 42px; padding: 7px 10px; border: 1px solid #c6d9ee; border-radius: 10px; color: #123a69; background: #eff6ff; font-size: 15px; font-weight: 900; font-variant-numeric: tabular-nums; }
.factory-hours-ga-label { display: none; }
@media (max-width: 767px) {
    .factory-hours-editor-head { display: none; }
    .factory-hours-editor-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 13px; }
    .factory-hours-editor-row > strong { grid-column: 1 / -1; }
    .factory-hours-editor-row label { position: static; display: block; width: auto; height: auto; margin: 0 0 4px; overflow: visible; clip: auto; color: #4d6581; font-size: 11px; font-weight: 800; white-space: normal; }
    .factory-hours-ga { grid-column: 1 / -1; align-items: flex-start; justify-content: center; flex-direction: column; gap: 2px; }
    .factory-hours-ga-label { display: block; color: #4d6581; font-size: 11px; font-weight: 800; }
}

/* V171: compact enable/disable controls for reusable master-data rows. */
.master-data-status-form { display: inline-flex; margin: 0; }
.master-data-status-toggle {
    display: inline-grid;
    width: 38px;
    min-width: 38px;
    min-height: 38px;
    height: 38px;
    place-items: center;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 10px;
    box-shadow: none;
    cursor: pointer;
    font-size: 19px;
    line-height: 1;
}
.master-data-status-toggle.is-deactivate { color: #b42318; background: #fff0ed; border-color: #f7c8c1; }
.master-data-status-toggle.is-activate { color: #087f5b; background: #eafaf3; border-color: #a9e5c9; }
.master-data-status-toggle:hover { filter: brightness(.96); transform: translateY(-1px); }
.master-data-status-toggle:focus-visible { outline: 3px solid rgba(36, 87, 184, .28); outline-offset: 2px; }
.actions.inline-actions > form.master-data-status-form { width: 38px; flex: 0 0 38px; }
.actions.inline-actions > form.master-data-status-form > .master-data-status-toggle { width: 38px; }
@media (max-width: 767px) {
    .master-data-status-toggle { width: 42px; min-width: 42px; min-height: 42px; height: 42px; }
    .actions.inline-actions > form.master-data-status-form { width: 42px; flex-basis: 42px; }
    .actions.inline-actions > form.master-data-status-form > .master-data-status-toggle { width: 42px; }
}

/* V172: keep master data sections compact until an administrator opens one. */
.master-data-panel.card { overflow: hidden; padding: 0 !important; }
.master-data-panel > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 20px;
    cursor: pointer;
    list-style: none;
    user-select: none;
}
.master-data-panel > summary::-webkit-details-marker { display: none; }
.master-data-panel > summary:focus-visible { outline: 3px solid rgba(36, 87, 184, .3); outline-offset: -3px; }
.master-data-panel[open] > summary { border-bottom: 1px solid #dce6f1; background: #f8fbff; }
.master-data-panel-title { display: grid; min-width: 0; gap: 3px; }
.master-data-panel-title strong { color: #17243a; font-size: 19px; letter-spacing: -.02em; }
.master-data-panel-title small { color: #64748b; font-size: 12px; font-weight: 700; }
.master-data-panel-indicator {
    width: 12px;
    height: 12px;
    flex: 0 0 12px;
    border-right: 2px solid #385476;
    border-bottom: 2px solid #385476;
    transform: rotate(45deg) translateY(-3px);
    transition: transform .16s ease;
}
.master-data-panel[open] .master-data-panel-indicator { transform: rotate(225deg) translateY(-3px); }
.master-data-panel-body { padding: 18px 20px 20px; }

/* Saved Works can be selected together for a single status change or deletion. */
.saved-work-bulk-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    margin: 16px 0 4px;
    padding: 11px 12px;
    border: 1px solid #d8e3ef;
    border-radius: 12px;
    background: #f8fbff;
}
.saved-work-selection-count { color: #3b4f6d; font-size: 13px; font-weight: 850; }
.saved-work-bulk-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.saved-work-bulk-actions .btn { min-height: 38px; }
.saved-work-select-column,
.saved-work-select-cell { width: 48px; text-align: center !important; }
.saved-work-select-column input,
.saved-work-select-cell input {
    width: 20px !important;
    min-width: 20px !important;
    min-height: 20px !important;
    height: 20px !important;
    margin: 0;
    accent-color: #2777c7;
}
@media (max-width: 767px) {
    .master-data-panel > summary { padding: 15px 16px; }
    .master-data-panel-title strong { font-size: 17px; }
    .master-data-panel-body { padding: 15px; }
    .saved-work-bulk-bar { align-items: stretch; padding: 11px; }
    .saved-work-bulk-actions { display: grid; width: 100%; grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .saved-work-bulk-actions .btn { width: 100%; min-height: 42px; padding: 7px 5px; font-size: 12px; }
    table.mobile-card-table td.saved-work-select-cell { display: flex; align-items: center; justify-content: space-between; width: 100%; }
    table.mobile-card-table td.saved-work-select-cell::before { content: attr(data-label); }
}

/* V164: dedicated desktop composition for Daily Allotted Work Entry. */
@media (min-width: 641px) {
    body.daily-entry-mobile-page .container {
        width: min(100%, 1280px) !important;
        max-width: none !important;
        padding: 24px 28px 56px !important;
    }

    body.daily-entry-mobile-page .daily-entry-page-title {
        margin: 0 0 14px !important;
    }

    body.daily-entry-mobile-page .daily-entry-page-title h1 {
        font-size: 30px !important;
    }

    body.daily-entry-mobile-page .daily-entry-card-list {
        gap: 16px !important;
    }

    body.daily-entry-mobile-page .daily-entry-card {
        overflow: hidden;
        border: 1px solid #bcdcf8;
        border-radius: 18px;
        background: #edf8ff;
        box-shadow: 0 8px 22px rgba(25, 78, 125, .08);
    }

    body.daily-entry-mobile-page .daily-entry-card.is-day-shift {
        border-color: #ead68a;
        background: #fff9df;
    }

    body.daily-entry-mobile-page .daily-entry-summary {
        display: grid !important;
        grid-template-columns: auto minmax(0, 1fr) 24px !important;
        align-items: center;
        gap: 14px;
        min-height: 66px;
        padding: 12px 16px;
        border-bottom: 1px solid rgba(77, 116, 151, .18);
    }

    body.daily-entry-mobile-page .daily-entry-identity {
        display: flex;
        align-items: center;
        gap: 8px;
    }

    body.daily-entry-mobile-page .daily-entry-sequence {
        color: #6d4635;
        font-size: 12px;
        font-weight: 800;
    }

    body.daily-entry-mobile-page .daily-entry-token {
        min-height: 34px;
        padding: 6px 10px;
        border-radius: 9px;
        color: #71360e;
        background: #fff0bd;
        font-size: 15px;
        font-weight: 900;
    }

    body.daily-entry-mobile-page .daily-entry-person {
        display: flex;
        align-items: baseline;
        justify-content: flex-end;
        gap: 7px;
        min-width: 0;
        text-align: right;
    }

    body.daily-entry-mobile-page .daily-entry-name {
        overflow: hidden;
        color: #10275b;
        font-size: 16px;
        font-weight: 850;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.daily-entry-mobile-page .daily-entry-person [data-summary-shift] {
        display: none;
    }

    body.daily-entry-mobile-page .daily-entry-summary::after {
        color: #173d70;
        font-size: 20px;
    }

    body.daily-entry-mobile-page .daily-entry-card-body {
        margin: 0;
        padding: 16px;
        border: 0;
        background: rgba(255, 255, 255, .66);
    }

    body.daily-entry-mobile-page .daily-entry-shift-readonly {
        display: block !important;
        flex: 0 0 180px;
    }

    body.daily-entry-mobile-page .daily-entry-shift-readonly label {
        display: block;
        margin-bottom: 5px;
        color: #31425a;
        font-size: 12px;
        font-weight: 800;
    }

    body.daily-entry-mobile-page .daily-entry-shift-readonly .readonly-pill {
        display: flex;
        align-items: center;
        min-height: 44px;
        padding: 8px 11px;
        border-radius: 10px;
        color: #10275b;
        background: #f0f6fd;
        font-size: 15px;
        font-weight: 850;
    }

    body.daily-entry-mobile-page .daily-entry-controls {
        display: flex !important;
        align-items: end;
        gap: 16px;
        padding-bottom: 14px;
        border-bottom: 1px dashed #c8d9e9;
    }

    body.daily-entry-mobile-page .daily-status-control {
        flex: 0 1 520px;
        min-width: 360px;
    }

    body.daily-entry-mobile-page .daily-status-control > label,
    body.daily-entry-mobile-page .daily-pa-type-control > label {
        display: block;
        margin-bottom: 5px;
        color: #31425a;
        font-size: 12px;
        font-weight: 800;
    }

    body.daily-entry-mobile-page .daily-status-segment {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 6px;
    }

    body.daily-entry-mobile-page .daily-status-segment button,
    body.daily-entry-mobile-page .daily-pa-type-control select {
        min-height: 44px;
        border-radius: 10px;
        font-size: 15px;
        font-weight: 800;
    }

    body.daily-entry-mobile-page .daily-pa-type-control {
        flex: 0 0 210px;
    }

    body.daily-entry-mobile-page .daily-pa-type-control select {
        width: 100%;
    }

    body.daily-entry-mobile-page .daily-nonwork-metrics {
        display: flex;
        gap: 12px;
        margin-top: 14px;
    }

    body.daily-entry-mobile-page .daily-nonwork-metrics > div {
        min-width: 150px;
        padding: 9px 12px;
        border: 1px solid #c9d9e8;
        border-radius: 10px;
        background: #f3f7fc;
    }

    body.daily-entry-mobile-page .daily-nonwork-metrics span {
        display: block;
        color: #536983;
        font-size: 12px;
        font-weight: 800;
    }

    body.daily-entry-mobile-page .daily-nonwork-metrics output {
        display: block;
        margin-top: 2px;
        color: #10275b;
        font-size: 20px;
        font-weight: 900;
    }

    body.daily-entry-mobile-page .work-lines-wrap {
        margin-top: 14px;
    }

    body.daily-entry-mobile-page .work-lines {
        display: grid;
        gap: 10px;
    }

    body.daily-entry-mobile-page .work-line {
        display: grid !important;
        grid-template-columns: minmax(360px, .9fr) minmax(280px, 1.6fr) 44px;
        align-items: end;
        gap: 12px;
        padding: 12px;
        border: 1px solid #cddfed;
        border-radius: 12px;
        background: #f8fcff;
    }

    body.daily-entry-mobile-page .work-line-meta {
        display: grid;
        grid-template-columns: minmax(180px, 1fr) 90px 82px;
        gap: 10px;
        min-width: 0;
    }

    body.daily-entry-mobile-page .work-line:not([data-line-index="0"]) .work-line-meta {
        grid-template-columns: minmax(220px, 1fr) 90px;
    }

    body.daily-entry-mobile-page .work-field-label {
        display: block;
        margin: 0 0 5px;
        color: #31425a;
        font-size: 12px;
        font-weight: 800;
    }

    body.daily-entry-mobile-page .work-line input,
    body.daily-entry-mobile-page .work-line select,
    body.daily-entry-mobile-page .work-ga-group .readonly-pill {
        width: 100%;
        min-height: 44px;
        height: 44px;
        border-radius: 9px;
        font-size: 14px;
    }

    body.daily-entry-mobile-page .work-ga-group .readonly-pill {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 7px;
        color: #10275b;
        background: #eef4fb;
        font-weight: 900;
    }

    body.daily-entry-mobile-page .work-description-group {
        min-width: 0;
    }

    body.daily-entry-mobile-page .remove-work-line {
        width: 44px !important;
        min-width: 44px !important;
        min-height: 44px !important;
        height: 44px !important;
        padding: 0 !important;
        border-radius: 10px !important;
        font-size: 24px !important;
        line-height: 1 !important;
    }

    body.daily-entry-mobile-page .daily-entry-card-footer {
        display: flex;
        justify-content: flex-end;
        gap: 10px;
        margin-top: 14px;
        padding-top: 14px;
        border-top: 1px solid #d3e1ef;
    }

    body.daily-entry-mobile-page .daily-entry-card-footer .btn {
        min-height: 42px;
        padding: 8px 16px;
        border-radius: 10px;
        font-size: 14px;
        font-weight: 850;
    }

    body.daily-entry-mobile-page .daily-entry-card-footer .save-entry-btn {
        min-width: 220px;
    }
}

/* V166: refined desktop alignment and work-state visibility. */
@media (min-width: 641px) {
    body.daily-entry-mobile-page .daily-entry-summary {
        grid-template-columns: auto minmax(0, 1fr) 24px !important;
        gap: 12px;
    }

    body.daily-entry-mobile-page .daily-entry-person {
        justify-content: flex-start;
        text-align: left;
    }

    body.daily-entry-mobile-page .daily-entry-controls {
        display: grid !important;
        grid-template-columns: 180px minmax(420px, 620px) minmax(200px, 250px);
        align-items: end;
        gap: 14px;
    }

    body.daily-entry-mobile-page .daily-status-control,
    body.daily-entry-mobile-page .daily-pa-type-control {
        min-width: 0;
        width: 100%;
    }

    body.daily-entry-mobile-page .daily-status-control {
        flex: none;
    }

    body.daily-entry-mobile-page .daily-nonwork-metrics[hidden],
    body.daily-entry-mobile-page .daily-pa-type-control[hidden] {
        display: none !important;
    }

    body.daily-entry-mobile-page .daily-nonwork-metrics:not([hidden]) {
        display: flex;
        align-items: stretch;
        margin-top: 14px;
    }

    body.daily-entry-mobile-page .work-line {
        grid-template-columns: minmax(400px, .85fr) minmax(360px, 1.65fr) 44px;
        gap: 14px;
        padding: 13px;
    }

    body.daily-entry-mobile-page .work-line-meta {
        grid-template-columns: minmax(200px, 1fr) 92px 82px;
        gap: 9px;
    }

    body.daily-entry-mobile-page .work-line:not([data-line-index="0"]) .work-line-meta {
        grid-template-columns: minmax(250px, 1fr) 92px;
    }

    body.daily-entry-mobile-page .daily-entry-card-footer {
        display: grid;
        grid-template-columns: 230px 260px;
        justify-content: end;
        gap: 10px;
    }

body.daily-entry-mobile-page .daily-entry-card-footer .save-entry-btn {
        min-width: 0;
    }
}

/* JC Full Daily Entry: explicit card controls, stable employee header, and compact work rows. */
.full-daily-entry-form .daily-entry-card {
    overflow: visible;
}

.full-daily-entry-form .daily-entry-summary {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto 44px !important;
    grid-template-rows: auto auto;
    align-items: center;
    gap: 8px 12px;
}

.full-daily-entry-form .daily-entry-heading {
    grid-column: 1 / 3;
    min-width: 0;
}

.full-daily-entry-form .entry-summary-meta {
    grid-column: 3;
    grid-row: 1;
    min-width: 0;
}

.full-daily-entry-form .mobile-entry-facts {
    grid-column: 1 / 4;
    grid-row: 2;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    min-width: 0;
    margin: 2px 0 0;
}

.full-daily-entry-form .mobile-entry-facts > span {
    display: grid;
    align-content: center;
    gap: 3px;
    min-width: 0;
    min-height: 48px;
    padding: 7px 9px;
    border: 1px solid rgba(77, 116, 151, .2);
    border-radius: 10px;
    background: rgba(255, 255, 255, .72);
    overflow-wrap: anywhere;
}

.full-daily-entry-form .mobile-entry-facts small {
    color: #52677e;
    font-size: 11px;
    line-height: 1.2;
}

.full-daily-entry-form .mobile-entry-facts b {
    min-width: 0;
    color: #10275b;
    font-size: 14px;
    line-height: 1.25;
    white-space: normal;
}

.full-daily-entry-form .daily-entry-card[open] > .daily-entry-summary {
    position: sticky;
    top: 68px;
    z-index: 8;
    background: #f7fbff;
    box-shadow: 0 5px 12px rgba(20, 50, 80, .12);
}

.full-daily-entry-form .daily-entry-summary::after {
    display: none !important;
    content: none !important;
}

.full-daily-entry-form .entry-card-toggle,
.full-daily-entry-form .work-line-add-icon {
    display: inline-grid;
    place-items: center;
    width: 42px;
    min-width: 42px;
    height: 42px;
    min-height: 42px;
    padding: 0;
    border: 1px solid #b8d7ee;
    border-radius: 12px;
    color: #145889;
    background: #e9f5fc;
    font-size: 25px;
    font-weight: 800;
    line-height: 1;
    cursor: pointer;
}

.full-daily-entry-form .entry-card-toggle {
    grid-column: 4;
    grid-row: 1 / 3;
    justify-self: end;
}

.full-daily-entry-form .entry-card-toggle:hover,
.full-daily-entry-form .work-line-add-icon:hover {
    color: #fff;
    border-color: #247db7;
    background: #247db7;
}

.full-daily-entry-form .work-line {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 44px;
    align-items: end;
    gap: 8px 12px;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.full-daily-entry-form .work-line-meta {
    display: grid !important;
    grid-column: 1 / -1;
    grid-template-columns: minmax(0, 1fr) 86px 74px 42px;
    align-items: end;
    gap: 8px;
    min-width: 0;
}

.full-daily-entry-form .work-line:not([data-line-index="0"]) .work-line-meta {
    grid-template-columns: minmax(0, 1fr) 86px 42px;
}

.full-daily-entry-form .work-line-meta .work-field-group {
    min-width: 0;
}

.full-daily-entry-form .work-line-meta [data-line-field],
.full-daily-entry-form .work-ga-group .readonly-pill {
    width: 100%;
    min-width: 0;
    margin: 0;
}

.full-daily-entry-form .work-line-add-icon {
    width: 42px !important;
    min-width: 42px !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 0 0 1px;
}

.full-daily-entry-form .work-description-group {
    grid-column: 1;
    min-width: 0;
}

.full-daily-entry-form .work-description-group input {
    width: 100%;
    min-width: 0;
    min-height: 46px;
    font-size: 16px;
}

.full-daily-entry-form .remove-work-line {
    grid-column: 2;
    align-self: end;
    margin: 0;
}

.full-daily-entry-form .daily-entry-card-footer {
    display: none !important;
}

.full-daily-entry-form .daily-entry-validation-message:not([hidden]) {
    width: 100%;
    margin: 8px 0 0;
    padding: 10px 12px;
    border: 1px solid #efb9bf;
    border-radius: 10px;
    color: #8c2630;
    background: #fff2f3;
    font-size: 14px;
    line-height: 1.4;
}

#savedWorkAutocomplete.full-daily-entry-autocomplete .saved-work-autocomplete-option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

#savedWorkAutocomplete.full-daily-entry-autocomplete .saved-work-option-label {
    min-width: 0;
    overflow-wrap: anywhere;
}

#savedWorkAutocomplete.full-daily-entry-autocomplete .saved-work-option-add {
    display: inline-grid;
    place-items: center;
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    border-radius: 9px;
    color: #145889;
    background: #e9f5fc;
    font-size: 21px;
    font-weight: 850;
}

@media (max-width: 640px) {
    .full-daily-entry-form .daily-entry-summary {
        grid-template-columns: minmax(0, 1fr) 42px !important;
        gap: 8px;
        padding: 12px !important;
    }

    .full-daily-entry-form .daily-entry-heading {
        grid-column: 1;
        grid-row: 1;
        display: flex;
        flex-wrap: wrap;
        gap: 6px 10px;
    }

    .full-daily-entry-form .daily-entry-person {
        min-width: 0;
        max-width: 100%;
    }

    .full-daily-entry-form .entry-summary-meta {
        display: none !important;
    }

    .full-daily-entry-form .mobile-entry-facts {
        grid-column: 1 / -1;
        grid-row: 2;
        gap: 6px;
    }

    .full-daily-entry-form .mobile-entry-facts > span {
        min-height: 46px;
        padding: 6px 7px;
    }

    .full-daily-entry-form .mobile-entry-facts small {
        font-size: 10px;
    }

    .full-daily-entry-form .mobile-entry-facts b {
        font-size: 13px;
    }

    .full-daily-entry-form .entry-card-toggle {
        grid-column: 2;
        grid-row: 1 / 3;
        width: 40px;
        min-width: 40px;
        height: 40px;
        min-height: 40px;
    }

    .full-daily-entry-form .work-line-meta {
        grid-template-columns: minmax(0, 1fr) 72px 66px 40px;
        gap: 6px;
    }

    .full-daily-entry-form .work-line:not([data-line-index="0"]) .work-line-meta {
        grid-template-columns: minmax(0, 1fr) 72px 40px;
    }

    .full-daily-entry-form .work-line-add-icon {
        width: 40px !important;
        min-width: 40px !important;
    }

    .full-daily-entry-form .daily-entry-card[open] > .daily-entry-summary {
        top: 64px;
    }
}

/* Lite employee attendance and job-card read-only views: mobile-first cards. */
.lite-personal-attendance-list { display: grid; gap: 8px; }
.lite-personal-attendance-record {
    display: grid;
    gap: 9px;
    min-width: 0;
    padding: 10px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: linear-gradient(145deg, #fff, #f6f9ff);
}
.lite-personal-attendance-person { display: flex; min-width: 0; align-items: center; gap: 8px; }
.lite-personal-attendance-person span {
    flex: 0 0 auto;
    padding: 4px 7px;
    border-radius: 7px;
    background: var(--primary-soft);
    color: var(--primary-dark);
    font-size: 11px;
    font-weight: 850;
}
.lite-personal-attendance-person strong { overflow-wrap: anywhere; font-size: 14px; }
.lite-personal-attendance-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.lite-personal-attendance-facts > div {
    display: grid;
    gap: 3px;
    min-width: 0;
    padding: 8px;
    border: 1px solid #dce6f2;
    border-radius: 10px;
    background: rgba(255, 255, 255, .86);
}
.lite-personal-attendance-facts span { color: var(--muted); font-size: 10px; font-weight: 700; }
.lite-personal-attendance-facts strong { overflow-wrap: anywhere; font-size: 12px; font-variant-numeric: tabular-nums; }
.lite-personal-attendance-facts .lite-personal-attendance-ga { grid-column: 1 / -1; background: #eff8f4; }
.lite-personal-attendance-ga strong { color: #146b45; font-size: 16px; }

body.lite-section-job-card-page .container {
    width: min(100%, 1240px);
    max-width: 100%;
    padding: 10px !important;
}
body.lite-section-job-card-page .readonly-view-controls,
body.lite-section-job-card-page .readonly-job-card-workspace { min-width: 0; padding: 10px; }
body.lite-section-job-card-page .readonly-view-controls form { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; margin: 0; }
body.lite-section-job-card-page .readonly-view-controls label { display: grid; min-width: 0; gap: 5px; margin: 0; }
body.lite-section-job-card-page .readonly-view-controls select { width: 100%; min-width: 0; min-height: 46px; font-size: 16px; }
body.lite-section-job-card-page .job-card-sheet-head { grid-template-columns: minmax(0, 1fr); min-width: 0; gap: 8px; }
body.lite-section-job-card-page .job-card-month-title,
body.lite-section-job-card-page .job-card-mini-stats { min-width: 0; }
body.lite-section-job-card-page .job-card-month-title { padding: 12px; }
body.lite-section-job-card-page .job-card-mini-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
body.lite-section-job-card-page .job-card-mini-stats > div { min-width: 0; padding: 9px; }
body.lite-section-job-card-page .job-card-mini-stats strong { font-size: 15px; }
body.lite-section-job-card-page .readonly-job-card-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; min-width: 0; }
body.lite-section-job-card-page .readonly-job-card-item {
    display: grid;
    gap: 8px;
    min-width: 0;
    padding: 9px;
    border: 2px solid;
    border-radius: 14px;
    box-shadow: 0 3px 12px rgba(23, 39, 64, .05);
}
body.lite-section-job-card-page .readonly-job-card-item.is-run { border-color: #c94343; background: #fff4f3; }
body.lite-section-job-card-page .readonly-job-card-item.is-pending { border-color: #328b52; background: #f1faf3; }
body.lite-section-job-card-page .readonly-job-card-item-head { display: flex; min-width: 0; align-items: flex-start; justify-content: space-between; gap: 8px; }
body.lite-section-job-card-page .readonly-job-card-identifiers { display: flex; min-width: 0; flex-wrap: wrap; gap: 6px; }
body.lite-section-job-card-page .readonly-job-card-identifiers > span { display: grid; min-width: 0; gap: 2px; }
body.lite-section-job-card-page .readonly-job-card-identifiers small,
body.lite-section-job-card-page .readonly-job-card-facts small { color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .035em; }
body.lite-section-job-card-page .readonly-job-card-identifiers strong { overflow-wrap: anywhere; color: var(--text); font-size: 12px; font-variant-numeric: tabular-nums; }
body.lite-section-job-card-page .readonly-job-card-status { flex: 0 0 auto; padding: 4px 7px; border-radius: 999px; font-size: 10px; font-weight: 850; white-space: nowrap; }
body.lite-section-job-card-page .readonly-job-card-item.is-run .readonly-job-card-status { color: #9a2828; background: #ffe0dd; }
body.lite-section-job-card-page .readonly-job-card-item.is-pending .readonly-job-card-status { color: #17663a; background: #dff4e5; }
body.lite-section-job-card-page .readonly-job-card-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; min-width: 0; }
body.lite-section-job-card-page .readonly-job-card-facts > div { display: grid; align-content: start; gap: 3px; min-width: 0; padding: 7px; border-radius: 9px; background: rgba(255, 255, 255, .78); }
body.lite-section-job-card-page .readonly-job-card-facts strong,
body.lite-section-job-card-page .readonly-job-card-facts span { min-width: 0; overflow-wrap: anywhere; color: var(--text); font-size: 12px; font-weight: 750; }
body.lite-section-job-card-page .readonly-job-card-facts .field-description { grid-column: 1 / -1; }
body.lite-section-job-card-page .readonly-job-card-facts .field-description span { font-weight: 500; line-height: 1.4; }
body.lite-section-job-card-page .readonly-job-card-facts .field-hours strong { font-size: 14px; font-variant-numeric: tabular-nums; }

@media (min-width: 720px) {
    body.lite-section-job-card-page .container { padding: 16px 20px !important; }
    body.lite-section-job-card-page .readonly-view-controls,
    body.lite-section-job-card-page .readonly-job-card-workspace { padding: 14px; }
    body.lite-section-job-card-page .readonly-job-card-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    body.lite-section-job-card-page .readonly-job-card-item { padding: 11px; }
    .lite-personal-attendance-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .lite-personal-attendance-facts .lite-personal-attendance-ga { grid-column: auto; }
}

/* Monthly Incentive Period Manager: refreshed responsive page layout. */
body.page-incentive-periods main.container {
    display: grid;
    width: min(100% - 36px, 1360px);
    max-width: 1360px;
    gap: 14px;
    align-content: start;
}
body.page-incentive-periods main.container > .period-page-hero,
body.page-incentive-periods main.container > .period-setup-grid,
body.page-incentive-periods main.container > .period-overview-card,
body.page-incentive-periods main.container > .period-opening-card,
body.page-incentive-periods main.container > .period-history-card {
    min-width: 0;
    margin: 0 !important;
}
body.page-incentive-periods .period-page-hero {
    display: block;
    min-height: 132px;
    padding: clamp(20px, 3vw, 30px);
    border: 1px solid var(--border);
    border-radius: 22px !important;
    background: linear-gradient(120deg, var(--primary-soft) 0%, var(--card) 76%) !important;
    box-shadow: 0 10px 28px rgba(var(--primary-rgb), .08) !important;
}
body.page-incentive-periods .period-page-hero::after { content: none !important; }
body.page-incentive-periods .period-kicker {
    display: block;
    margin-bottom: 6px;
    color: var(--primary);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .13em;
    line-height: 1.2;
    text-transform: uppercase;
}
body.page-incentive-periods .period-page-hero h1 {
    margin: 0;
    color: var(--text);
    font-size: clamp(24px, 3vw, 32px);
    letter-spacing: -.035em;
}
body.page-incentive-periods .period-page-hero > p {
    max-width: 650px;
    margin: 8px 0 0;
    color: var(--muted);
    font-size: 14px;
}
body.page-incentive-periods .period-page-hero .alert { margin: 12px 0 0; }
body.page-incentive-periods .period-setup-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}
body.page-incentive-periods .period-setup-card {
    display: flex;
    min-width: 0;
    flex-direction: column;
    padding: clamp(18px, 2.2vw, 24px);
    border: 1px solid var(--border);
    border-radius: 20px !important;
    background: var(--card);
    box-shadow: 0 8px 24px rgba(23, 40, 64, .055) !important;
}
body.page-incentive-periods .period-setup-card h2,
body.page-incentive-periods .period-opening-card h2,
body.page-incentive-periods .period-history-card h2 {
    margin: 0 0 14px;
    color: var(--text);
    font-size: 18px;
    letter-spacing: -.02em;
}
body.page-incentive-periods .period-setup-card form { display: grid; gap: 10px; }
body.page-incentive-periods .period-setup-card .form-row { gap: 12px; margin: 0; }
body.page-incentive-periods .period-setup-card label {
    display: block;
    margin: 0 0 6px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .035em;
    text-transform: uppercase;
}
body.page-incentive-periods .period-setup-card input,
body.page-incentive-periods .period-setup-card select {
    min-height: 46px;
    border-radius: 12px;
    border-color: var(--border);
    background-color: #fff;
}
body.page-incentive-periods .period-setup-card .help {
    display: block;
    margin-top: 5px;
    color: var(--muted);
    font-size: 11px;
}
body.page-incentive-periods .period-setup-card .actions { margin: 4px 0 0; }
body.page-incentive-periods .period-setup-card button { min-height: 44px; border-radius: 12px; }
body.page-incentive-periods .period-select-card > p { margin: auto 0; color: var(--muted); }
body.page-incentive-periods .period-overview-card,
body.page-incentive-periods .period-opening-card,
body.page-incentive-periods .period-history-card {
    padding: clamp(18px, 2.3vw, 26px);
    border: 1px solid var(--border);
    border-radius: 20px !important;
    background: var(--card);
    box-shadow: 0 8px 24px rgba(23, 40, 64, .055) !important;
}
body.page-incentive-periods .period-overview-heading,
body.page-incentive-periods .period-history-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}
body.page-incentive-periods .period-overview-heading .period-kicker,
body.page-incentive-periods .period-history-heading .period-kicker { margin-bottom: 4px; }
body.page-incentive-periods .period-overview-heading h2,
body.page-incentive-periods .period-history-heading h2 {
    margin: 0;
    color: var(--text);
    font-size: clamp(20px, 2vw, 24px);
    letter-spacing: -.025em;
}
body.page-incentive-periods .period-overview-card > .help {
    margin: -6px 0 14px;
    color: var(--muted);
    font-size: 11px;
}
body.page-incentive-periods .period-metric-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
}
body.page-incentive-periods .period-metric-grid .stat {
    display: flex;
    min-height: 84px;
    min-width: 0;
    flex-direction: column;
    justify-content: center;
    padding: 13px 15px;
    border: 1px solid var(--border);
    border-radius: 15px !important;
    background: linear-gradient(145deg, #fff 0%, var(--primary-soft) 140%);
    box-shadow: 0 3px 12px rgba(24, 42, 66, .045);
}
body.page-incentive-periods .period-metric-grid .number {
    color: var(--primary-dark);
    font-size: clamp(19px, 2vw, 25px);
    font-variant-numeric: tabular-nums;
    font-weight: 850;
    line-height: 1.15;
}
body.page-incentive-periods .period-metric-grid .label {
    margin-top: 5px;
    color: var(--muted);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .04em;
    line-height: 1.3;
    text-transform: uppercase;
}
body.page-incentive-periods .period-balance-metrics {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--border);
}
body.page-incentive-periods .period-date-metrics .stat:nth-child(4) { background: var(--primary-soft); }
body.page-incentive-periods .period-date-metrics .stat:nth-child(4) .number { text-transform: capitalize; }
body.page-incentive-periods .period-overview-card > .actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 15px 0 0;
    padding-top: 13px;
    border-top: 1px solid var(--border);
}
body.page-incentive-periods .period-overview-card > .actions > form {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 0;
}
body.page-incentive-periods .period-overview-card > .actions button,
body.page-incentive-periods .period-overview-card > .actions .btn {
    width: auto;
    min-height: 42px;
    border-radius: 11px;
    padding: 9px 13px;
    font-size: 12px;
}
body.page-incentive-periods .period-overview-card > .actions select {
    width: 145px;
    min-width: 110px;
    min-height: 42px;
    margin: 0;
    border-radius: 11px;
}
body.page-incentive-periods .period-opening-card > p.help {
    max-width: 900px;
    margin: -4px 0 14px;
    color: var(--muted);
    font-size: 12px;
}
body.page-incentive-periods .period-table-wrap {
    overflow: auto;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--card);
}
body.page-incentive-periods .opening-balance-table,
body.page-incentive-periods .period-history-table { margin: 0; }
body.page-incentive-periods .opening-balance-table th,
body.page-incentive-periods .period-history-table th {
    padding: 11px 12px;
    border-bottom: 1px solid var(--border);
    background: var(--primary-soft);
    color: var(--primary-dark);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .05em;
    text-transform: uppercase;
}
body.page-incentive-periods .opening-balance-table td,
body.page-incentive-periods .period-history-table td {
    padding: 11px 12px;
    border-bottom: 1px solid var(--border);
    vertical-align: middle;
}
body.page-incentive-periods .opening-balance-table tbody tr:last-child td,
body.page-incentive-periods .period-history-table tbody tr:last-child td { border-bottom: 0; }
body.page-incentive-periods .opening-balance-table td:first-child strong,
body.page-incentive-periods .period-history-table td:first-child { color: var(--text); font-weight: 800; }
body.page-incentive-periods .opening-balance-table .opening-balance-input { min-height: 42px; border-radius: 11px; }
body.page-incentive-periods .opening-balance-table .btn { min-height: 38px; border-radius: 10px; }
body.page-incentive-periods .period-history-table { min-width: 680px; }
body.page-incentive-periods .period-history-table .badge { text-transform: capitalize; }
@media (max-width: 900px) {
    body.page-incentive-periods .period-metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 719px) {
    body.page-incentive-periods main.container { width: 100%; gap: 10px; padding: 11px; }
    body.page-incentive-periods .period-page-hero {
        min-height: 0;
        align-items: flex-start;
        padding: 18px 16px;
        border-radius: 16px !important;
    }
    body.page-incentive-periods .period-page-hero h1 { font-size: 23px; }
    body.page-incentive-periods .period-page-hero > p { margin-top: 6px; font-size: 12px; }
    body.page-incentive-periods .period-setup-grid { grid-template-columns: minmax(0, 1fr); gap: 10px; }
    body.page-incentive-periods .period-setup-card,
    body.page-incentive-periods .period-overview-card,
    body.page-incentive-periods .period-opening-card,
    body.page-incentive-periods .period-history-card { padding: 15px; border-radius: 16px !important; }
    body.page-incentive-periods .period-setup-card h2,
    body.page-incentive-periods .period-opening-card h2,
    body.page-incentive-periods .period-history-card h2 { margin-bottom: 10px; font-size: 17px; }
    body.page-incentive-periods .period-setup-card .form-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
    body.page-incentive-periods .period-metric-grid { gap: 8px; }
    body.page-incentive-periods .period-metric-grid .stat { min-height: 72px; padding: 10px; border-radius: 12px !important; }
    body.page-incentive-periods .period-metric-grid .number { font-size: clamp(17px, 5vw, 21px); }
    body.page-incentive-periods .period-metric-grid .label { font-size: 9px; }
    body.page-incentive-periods .period-overview-card > .actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 7px;
        margin-top: 12px;
        padding-top: 11px;
    }
    body.page-incentive-periods .period-overview-card > .actions > form { min-width: 0; }
    body.page-incentive-periods .period-overview-card > .actions > form:nth-of-type(1),
    body.page-incentive-periods .period-overview-card > .actions > form:nth-of-type(3) { grid-column: 1 / -1; }
    body.page-incentive-periods .period-overview-card > .actions > form:nth-of-type(3) { justify-content: flex-start; }
    body.page-incentive-periods .period-overview-card > .actions button,
    body.page-incentive-periods .period-overview-card > .actions .btn { width: 100%; min-width: 0; padding: 9px 8px; font-size: 11px; }
    body.page-incentive-periods .period-overview-card > .actions select { width: auto; min-width: 0; flex: 1 1 100px; font-size: 14px; }
    body.page-incentive-periods .period-table-wrap { overflow: visible; border: 0; background: transparent; }
    body.page-incentive-periods .period-history-table { min-width: 0 !important; }
    body.page-incentive-periods .period-history-table td:nth-child(1)::before { content: "Period"; }
    body.page-incentive-periods .period-history-table td:nth-child(2)::before { content: "Start"; }
    body.page-incentive-periods .period-history-table td:nth-child(3)::before { content: "End"; }
    body.page-incentive-periods .period-history-table td:nth-child(4)::before { content: "Status"; }
    body.page-incentive-periods .period-history-table td:nth-child(5)::before { content: "Generated"; }
    body.page-incentive-periods .period-history-table td:nth-child(6)::before { content: "Action"; }
    body.page-incentive-periods .period-history-table td:last-child .btn { width: 100%; margin: 2px 0; }
}
@media (max-width: 380px) {
    body.page-incentive-periods .period-overview-card > .actions { grid-template-columns: minmax(0, 1fr); }
    body.page-incentive-periods .period-overview-card > .actions > form,
    body.page-incentive-periods .period-overview-card > .actions > form:nth-of-type(1),
    body.page-incentive-periods .period-overview-card > .actions > form:nth-of-type(3) { grid-column: 1; }
}

/* Monthly Job Cards controls: keep the spreadsheet placement and typography separate. */
body.job-card-page .job-card-month-controls { align-items: stretch; gap: 11px; }
body.job-card-page .job-card-factor,
body.job-card-page .job-card-create-form,
body.job-card-page .job-card-open-form {
    min-width: 0;
    padding: 12px;
    border: 1px solid #d8e4f1;
    border-radius: 14px;
    background: linear-gradient(145deg, #ffffff 0%, #f7faff 100%);
    box-shadow: 0 5px 16px rgba(25, 57, 91, .06);
}
body.job-card-page .job-card-factor { gap: 10px; }
body.job-card-page .job-card-factor-fields { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 9px; }
body.job-card-page .job-card-factor label,
body.job-card-page .job-card-create-form label,
body.job-card-page .job-card-open-form label {
    min-width: 0;
    color: #40556e;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: none;
}
body.job-card-page .job-card-factor select,
body.job-card-page .job-card-factor-input input,
body.job-card-page .job-card-create-form input,
body.job-card-page .job-card-open-form select {
    width: 100%;
    min-width: 0;
    min-height: 43px;
    border-radius: 10px;
}
body.job-card-page .job-card-factor select,
body.job-card-page .job-card-factor-input input { font-size: 13px; }
body.job-card-page .job-card-factor-input { gap: 6px; }
body.job-card-page .job-card-factor-input strong {
    display: grid;
    width: 27px;
    height: 43px;
    place-items: center;
    border-radius: 9px;
    color: #267481;
    background: #e8f4f7;
    font-size: 20px;
}
body.job-card-page .job-card-factor-form button,
body.job-card-page .job-card-create-form button,
body.job-card-page .job-card-open-actions .btn {
    min-height: 43px;
    margin: 0;
    border-radius: 10px;
}
body.job-card-page .job-card-create-form,
body.job-card-page .job-card-open-form { align-content: start; gap: 9px; }
body.job-card-page .job-card-create-form > div,
body.job-card-page .job-card-open-form > div { min-width: 0; }
body.job-card-page .job-card-create-form button { width: 100%; }
body.job-card-page .job-card-open-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
body.job-card-page .job-card-open-actions .btn {
    display: flex;
    width: 100%;
    padding: 7px 9px;
    align-items: center;
    justify-content: center;
    white-space: normal;
    text-align: center;
}

@media (max-width: 767px) {
    body.job-card-page .job-card-month-controls { gap: 9px; padding: 10px; }
    body.job-card-page .job-card-factor { grid-template-columns: minmax(0, 1fr); gap: 9px; }
    body.job-card-page .job-card-factor-fields { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); }
    body.job-card-page .job-card-factor-form button { width: 100%; }
    body.job-card-page .job-card-create-form,
    body.job-card-page .job-card-open-form { gap: 8px; padding: 11px; }
}

@media (max-width: 380px) {
    body.job-card-page .job-card-factor-fields { grid-template-columns: minmax(0, 1fr); }
}

/* Monthly Job Cards: keep every data-cell value the same size across inputs and calculated outputs. */
body.job-card-page { --job-card-cell-font-size: 11px; }
body.job-card-page .job-card-grid tbody td:not(.job-row-action),
body.job-card-page .job-card-grid tbody td:not(.job-row-action) input,
body.job-card-page .job-card-grid tbody td:not(.job-row-action) select,
body.job-card-page .job-card-grid tbody td:not(.job-row-action) output {
    font-size: var(--job-card-cell-font-size);
}
@media (max-width: 767px) {
    body.job-card-page { --job-card-cell-font-size: 11px; }
}
@media print {
    body.job-card-page { --job-card-cell-font-size: 7px; }
}

/* Full portal: improve plus/minus report card readability for both roles. */
body.page-plus-minus-report .employee-report-summary {
    gap: 10px;
    margin-bottom: 14px;
}
body.page-plus-minus-report .employee-report-summary > div {
    padding: 12px 10px;
    border-radius: 14px;
    box-shadow: 0 5px 14px rgba(15, 23, 42, .045);
}
body.page-plus-minus-report .employee-report-summary span,
body.page-plus-minus-report .employee-plus-minus-metrics span { font-size: 9px; }
body.page-plus-minus-report .employee-report-summary strong { font-size: 18px; }
body.page-plus-minus-report .employee-report-summary .employee-report-total { padding: 14px; }
body.page-plus-minus-report .employee-report-summary .employee-report-total strong { font-size: 28px; }
body.page-plus-minus-report .employee-plus-minus-list { gap: 12px; }
body.page-plus-minus-report .employee-plus-minus-card {
    padding: 12px;
    border-radius: 16px;
}
body.page-plus-minus-report .employee-plus-minus-card > header { gap: 9px; }
body.page-plus-minus-report .employee-plus-minus-card > header > span { font-size: 11px; }
body.page-plus-minus-report .employee-plus-minus-card > header > div { min-width: 0; }
body.page-plus-minus-report .employee-plus-minus-card h2 { font-size: 15px; overflow-wrap: anywhere; }
body.page-plus-minus-report .employee-plus-minus-card header p { font-size: 10px; }
body.page-plus-minus-report .employee-plus-minus-card header > strong { font-size: 17px; }
body.page-plus-minus-report .employee-plus-minus-card header > strong > span { font-size: 9px; }
body.page-plus-minus-report .employee-plus-minus-metrics { gap: 6px; margin-top: 9px; }
body.page-plus-minus-report .employee-plus-minus-metrics > div { padding: 7px 5px; }
body.page-plus-minus-report .employee-plus-minus-metrics strong { font-size: 12px; }
body.page-plus-minus-report .employee-plus-minus-metrics .employee-plus-minus-period span { font-size: 9px; }
body.page-plus-minus-report .employee-plus-minus-metrics .employee-plus-minus-period strong { font-size: 13px; }
@media (max-width: 680px) {
    body.page-plus-minus-report .employee-plus-minus-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 420px) {
    body.page-plus-minus-report .container { padding: 9px !important; }
}

/* Full employee dashboard: phone-first quick links sourced from the visible menu. */
body.employee-dashboard-full .employee-dashboard-quick-links {
    margin: 14px 0;
    padding: 14px;
    border: 1px solid #d7e3f1;
    border-radius: 18px;
    background: linear-gradient(145deg, #ffffff 0%, #f7faff 100%);
    box-shadow: 0 9px 24px rgba(15, 23, 42, .055);
}
body.employee-dashboard-full .employee-dashboard-quick-links-heading {
    display: flex;
    margin-bottom: 10px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
body.employee-dashboard-full .employee-dashboard-quick-links-heading h2 {
    margin: 2px 0 0;
    color: #17243a;
    font-size: 20px;
    line-height: 1.2;
}
body.employee-dashboard-full .employee-dashboard-quick-links-count {
    display: grid;
    min-width: 30px;
    height: 30px;
    padding: 0 8px;
    place-items: center;
    border-radius: 999px;
    color: var(--primary-dark);
    background: var(--primary-soft);
    font-size: 12px;
    font-weight: 900;
}
body.employee-dashboard-full .employee-dashboard-quick-link-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
}
body.employee-dashboard-full .employee-dashboard-quick-link {
    display: flex;
    min-width: 0;
    min-height: 72px;
    padding: 12px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border: 1px solid #dbe6f2;
    border-radius: 13px;
    color: inherit;
    background: #fff;
    box-shadow: 0 3px 10px rgba(15, 23, 42, .035);
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
body.employee-dashboard-full .employee-dashboard-quick-link:hover,
body.employee-dashboard-full .employee-dashboard-quick-link:focus-visible {
    border-color: var(--primary);
    box-shadow: 0 7px 16px rgba(15, 23, 42, .09);
    text-decoration: none;
    transform: translateY(-1px);
}
body.employee-dashboard-full .employee-dashboard-quick-link-copy {
    display: grid;
    min-width: 0;
    gap: 2px;
}
body.employee-dashboard-full .employee-dashboard-quick-link-copy small {
    color: var(--muted);
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .055em;
    text-transform: uppercase;
}
body.employee-dashboard-full .employee-dashboard-quick-link-copy strong {
    overflow-wrap: anywhere;
    color: #17243a;
    font-size: 14px;
    line-height: 1.25;
}
body.employee-dashboard-full .employee-dashboard-quick-link-copy > span {
    color: #607089;
    font-size: 11px;
    line-height: 1.35;
}
body.employee-dashboard-full .employee-dashboard-quick-link-arrow {
    display: grid;
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    place-items: center;
    border-radius: 10px;
    color: var(--primary-dark);
    background: var(--primary-soft);
    font-size: 19px;
    font-weight: 800;
}
@media (min-width: 640px) {
    body.employee-dashboard-full .employee-dashboard-quick-links { padding: 17px; }
    body.employee-dashboard-full .employee-dashboard-quick-link-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
}
@media (min-width: 1100px) {
    body.employee-dashboard-full .employee-dashboard-quick-links { padding: 20px; }
    body.employee-dashboard-full .employee-dashboard-quick-link-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
}

/* Monthly Job Cards desktop cards: give each control a full-width, aligned workspace. */
@media (min-width: 1101px) {
    body.job-card-page .job-card-month-controls:not(.job-card-month-controls-compact) {
        grid-template-columns: minmax(330px, 1.3fr) minmax(260px, 1fr) minmax(270px, 1fr);
        align-items: stretch;
        gap: 12px;
    }
    body.job-card-page .job-card-month-controls:not(.job-card-month-controls-compact) .job-card-factor {
        grid-template-columns: minmax(0, 1fr);
        align-content: start;
        gap: 9px;
    }
    body.job-card-page .job-card-month-controls:not(.job-card-month-controls-compact) .job-card-factor-fields {
        grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    }
    body.job-card-page .job-card-month-controls:not(.job-card-month-controls-compact) .job-card-factor-form > button,
    body.job-card-page .job-card-month-controls:not(.job-card-month-controls-compact) .job-card-create-form > button {
        width: 100%;
    }
    body.job-card-page .job-card-month-controls:not(.job-card-month-controls-compact) .job-card-create-form,
    body.job-card-page .job-card-month-controls:not(.job-card-month-controls-compact) .job-card-open-form {
        grid-template-columns: minmax(0, 1fr);
        align-content: start;
        gap: 9px;
    }
    body.job-card-page .job-card-month-controls:not(.job-card-month-controls-compact) .job-card-open-actions {
        align-self: end;
    }
}
body.job-card-page .job-card-create-form > div {
    width: 100%;
    min-width: 0;
}
body.job-card-page .job-card-create-form input[type="month"] {
    display: block;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}
@media (max-width: 767px) {
    body.job-card-page .job-card-grid tbody td:not(.job-row-action) output {
        width: 100%;
        min-width: 0;
        max-width: 100%;
        padding-right: 1px;
        padding-left: 1px;
        overflow: hidden;
        box-sizing: border-box;
    }
}

/* Job Cards in Hand: simple, mobile-first cards with only employee-facing fields. */
body.readonly-job-card-page .readonly-job-card-workspace { min-width: 0; padding: 8px; }
body.readonly-job-card-page .readonly-job-card-list {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 7px;
    min-width: 0;
}
body.readonly-job-card-page .readonly-job-card-item,
body.lite-section-job-card-page .readonly-job-card-item {
    display: grid;
    gap: 0;
    min-width: 0;
    padding: 8px;
    border: 1px solid #b8cde1;
    border-radius: 12px;
    background: linear-gradient(145deg, #fff 0%, #f8fbff 100%);
    box-shadow: 0 3px 10px rgba(23, 39, 64, .06);
}
body.readonly-job-card-page .readonly-job-card-identifiers {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr);
    gap: 8px;
    min-width: 0;
    padding-bottom: 4px;
}
body.readonly-job-card-page .readonly-job-card-identifiers > div,
body.readonly-job-card-page .readonly-job-card-description,
body.readonly-job-card-page .readonly-job-card-coaches {
    display: grid;
    align-content: start;
    gap: 2px;
    min-width: 0;
}
body.readonly-job-card-page .readonly-job-card-description,
body.readonly-job-card-page .readonly-job-card-metrics,
body.readonly-job-card-page .readonly-job-card-coaches {
    border-top: 1px solid #e0eaf3;
    padding-top: 5px;
    margin-top: 5px;
}
body.readonly-job-card-page .readonly-job-card-description,
body.readonly-job-card-page .readonly-job-card-coaches {
    padding-bottom: 0;
}
body.readonly-job-card-page .readonly-job-card-item small {
    color: #71849a;
    font-size: 8px;
    font-weight: 850;
    letter-spacing: .045em;
    line-height: 1.1;
}
body.readonly-job-card-page .readonly-job-card-identifiers strong,
body.readonly-job-card-page .readonly-job-card-metrics strong,
body.readonly-job-card-page .readonly-job-card-coaches strong {
    min-width: 0;
    overflow-wrap: anywhere;
    color: #173652;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.15;
    font-variant-numeric: tabular-nums;
}
body.readonly-job-card-page .readonly-job-card-description p {
    margin: 0;
    overflow-wrap: anywhere;
    color: #243b53;
    font-size: 12px;
    line-height: 1.25;
}
body.readonly-job-card-page .readonly-job-card-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    min-width: 0;
}
body.readonly-job-card-page .readonly-job-card-metrics > div {
    display: grid;
    align-content: start;
    gap: 2px;
    min-width: 0;
    padding: 0 6px;
}
body.readonly-job-card-page .readonly-job-card-metrics > div:first-child { padding-left: 0; }
body.readonly-job-card-page .readonly-job-card-metrics > div + div { border-left: 1px solid #e0eaf3; }
body.readonly-job-card-page .readonly-job-card-metrics > div:last-child { padding-right: 0; }
body.readonly-job-card-page .readonly-job-card-coaches strong { line-height: 1.2; }
body.readonly-job-card-page .readonly-job-card-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    min-width: 0;
    margin: 0 0 10px;
    padding: 12px;
    border: 1px solid #b8cde1;
}
body.readonly-job-card-page .readonly-job-card-summary > div {
    display: grid;
    gap: 4px;
    min-width: 0;
    padding: 0 10px;
}
body.readonly-job-card-page .readonly-job-card-summary > div:first-child { padding-left: 0; }
body.readonly-job-card-page .readonly-job-card-summary > div + div { border-left: 1px solid #dce7f1; }
body.readonly-job-card-page .readonly-job-card-summary > div:last-child { padding-right: 0; }
body.readonly-job-card-page .readonly-job-card-summary small {
    color: #71849a;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .04em;
    text-transform: uppercase;
}
body.readonly-job-card-page .readonly-job-card-summary strong {
    overflow-wrap: anywhere;
    color: #173652;
    font-size: 18px;
    font-weight: 850;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}
@media (min-width: 860px) {
    body.readonly-job-card-page .readonly-job-card-workspace { padding: 14px; }
    body.readonly-job-card-page .readonly-job-card-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    body.readonly-job-card-page .readonly-job-card-item { padding: 9px; }
}

/* Guidance for the per-card employee visibility switches. */
body.job-card-page .job-card-employee-visibility-help {
    display: flex;
    align-items: center;
    padding: 12px 15px;
    border-color: #d7e6f2;
    background: linear-gradient(135deg, #fff 0%, #f3f8fc 100%);
}
body.job-card-page .job-card-employee-visibility-help > div { display: grid; gap: 4px; min-width: 0; }
body.job-card-page .job-card-employee-visibility-help strong { color: var(--text); font-size: 14px; }
body.job-card-page .job-card-employee-visibility-help p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }

body.page-dashboard.role-employee:not(.employee-dashboard-full) .lite-employee-dashboard-link {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 13px 15px;
    border-color: #d5e4f0;
    background: linear-gradient(135deg, #fff 0%, #f2f8fc 100%);
}
body.page-dashboard.role-employee:not(.employee-dashboard-full) .lite-employee-dashboard-link h2 { margin: 3px 0; font-size: 16px; }
body.page-dashboard.role-employee:not(.employee-dashboard-full) .lite-employee-dashboard-link p { margin: 0; color: var(--muted); font-size: 12px; }
body.page-dashboard.role-employee:not(.employee-dashboard-full) .lite-employee-dashboard-link .btn { flex: 0 0 auto; }
@media (max-width: 420px) {
    body.page-dashboard.role-employee:not(.employee-dashboard-full) .lite-employee-dashboard-link { padding: 11px; }
    body.page-dashboard.role-employee:not(.employee-dashboard-full) .lite-employee-dashboard-link .btn { min-height: 36px; padding: 7px 10px; }
}

/* Full employee dashboard profile card: compact identity header and aligned details. */
body.employee-dashboard-full .employee-dashboard-profile {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    padding: 16px !important;
    overflow: hidden;
    border: 1px solid #dbe7f4;
    border-radius: 18px;
    background: linear-gradient(145deg, #fff 0%, #f8fbff 100%) !important;
}
body.employee-dashboard-full .employee-dashboard-identity {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 13px;
    padding: 12px 14px;
    border: 1px solid #dce8f3;
    border-radius: 16px;
    background: linear-gradient(120deg, #edf7fa 0%, #f2f5ff 100%);
}
body.employee-dashboard-full .employee-dashboard-photo {
    flex: 0 0 78px;
    width: 78px;
    height: 82px;
    margin: 0;
    border: 3px solid #fff;
    border-radius: 17px;
    font-size: 28px;
}
body.employee-dashboard-full .employee-dashboard-photo img { border-radius: inherit; }
body.employee-dashboard-full .employee-dashboard-welcome {
    display: grid;
    min-width: 0;
    align-content: center;
    gap: 5px;
}
body.employee-dashboard-full .employee-dashboard-welcome > span {
    color: #60758b;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .1em;
}
body.employee-dashboard-full .employee-dashboard-welcome h1 {
    max-width: 100%;
    margin: 0;
    padding: 0;
    overflow-wrap: anywhere;
    border-radius: 0;
    color: #183755;
    background: transparent;
    font-size: clamp(21px, 3vw, 28px);
    line-height: 1.12;
}
body.employee-dashboard-full .employee-dashboard-profile-body {
    display: grid;
    min-width: 0;
    gap: 8px;
}
body.employee-dashboard-full .employee-profile-id-row,
body.employee-dashboard-full .employee-profile-job-row,
body.employee-dashboard-full .employee-profile-date-row {
    gap: 8px;
}
body.employee-dashboard-full .employee-profile-id-row > div,
body.employee-dashboard-full .employee-profile-job-row > div,
body.employee-dashboard-full .employee-profile-date-row > div,
body.employee-dashboard-full .employee-profile-mobile-row {
    padding: 9px 10px;
    border-color: #dce7f2;
    border-radius: 12px;
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 2px 7px rgba(28, 58, 91, .035);
}
body.employee-dashboard-full .employee-profile-date-row strong {
    font-size: 12px;
    white-space: nowrap;
}
body.employee-dashboard-full .employee-profile-mobile-row { min-height: 48px; }
body.employee-dashboard-full .employee-profile-mobile-row > div { flex: 1 1 130px; }
body.employee-dashboard-full .employee-profile-mobile-row .btn {
    min-height: 38px;
    padding: 8px 12px;
    border-radius: 11px;
}

@media (max-width: 767px) {
    body.employee-dashboard-full .employee-dashboard-profile { gap: 10px; padding: 12px !important; }
    body.employee-dashboard-full .employee-dashboard-identity { gap: 11px; padding: 10px 11px; border-radius: 14px; }
    body.employee-dashboard-full .employee-dashboard-photo { flex-basis: 68px; width: 68px; height: 72px; border-radius: 15px; font-size: 25px; }
    body.employee-dashboard-full .employee-dashboard-profile-body { gap: 7px; }
    body.employee-dashboard-full .employee-profile-id-row,
    body.employee-dashboard-full .employee-profile-job-row,
    body.employee-dashboard-full .employee-profile-date-row { gap: 6px; }
    body.employee-dashboard-full .employee-profile-id-row > div,
    body.employee-dashboard-full .employee-profile-job-row > div,
    body.employee-dashboard-full .employee-profile-date-row > div,
    body.employee-dashboard-full .employee-profile-mobile-row { padding: 8px 9px; }
    body.employee-dashboard-full .employee-profile-date-row strong { font-size: 11px; }
    body.employee-dashboard-full .employee-profile-mobile-row { min-height: 44px; }
}

@media (max-width: 360px) {
    body.employee-dashboard-full .employee-dashboard-profile { padding: 10px !important; }
    body.employee-dashboard-full .employee-profile-id-row,
    body.employee-dashboard-full .employee-profile-date-row { gap: 4px; }
    body.employee-dashboard-full .employee-profile-id-row > div,
    body.employee-dashboard-full .employee-profile-date-row > div { padding-right: 5px; padding-left: 5px; }
    body.employee-dashboard-full .employee-profile-date-row strong { font-size: 10px; }
}

/* Per-card visibility controls for Job Cards in Hand. */
.job-card-grid .job-row-number {
    width: 48px;
    min-width: 48px;
    padding: 2px 3px;
    vertical-align: middle;
}
.job-card-grid .job-card-row-number-control {
    display: flex;
    min-height: 18px;
    align-items: center;
    justify-content: center;
    gap: 4px;
}
.job-card-grid .job-card-row-number-control > [data-row-number] {
    font-size: 10px;
    line-height: 1.15;
}
.job-card-grid .job-card-employee-checkbox {
    width: 14px !important;
    min-width: 14px;
    height: 14px !important;
    min-height: 14px;
    margin: 0;
    padding: 0;
    accent-color: #23824d;
    cursor: pointer;
}

/* Compact employee-wise Daily Works, with clear separation between dates. */
.daily-work-day-card.daily-work-employee-day {
    border: 3px solid var(--primary, #2b7f89);
    background: #edf5f7;
    padding: 8px;
    margin-bottom: 16px;
}
.daily-work-employee-day .daily-work-lines-plain.employee-work-compact-row {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    margin-top: 4px;
    border-radius: 7px;
    font-size: 12px;
    line-height: 1.25;
}
.employee-work-compact-row .employee-work-token {
    padding: 6px;
    background: #f3f7ff;
    border-right: 1px solid #d6e2ed;
    overflow-wrap: anywhere;
}
.daily-work-employee-day .employee-work-compact-row.is-night-shift .employee-work-token {
    background: #dceeff;
    color: #164b70;
    box-shadow: inset 3px 0 0 #4c91c9;
}
.daily-work-employee-day .employee-work-compact-row.is-night-shift .employee-work-token strong {
    color: inherit;
}
.employee-work-compact-row .employee-work-details {
    min-width: 0;
}
.daily-work-employee-day .employee-work-compact-row .daily-work-plain-line {
    padding: 6px 8px;
    font-size: 12px;
    line-height: 1.25;
    overflow-wrap: anywhere;
}
@media (max-width: 720px) {
    .daily-work-day-card.daily-work-employee-day {
        padding: 6px;
    }
    .daily-work-employee-day .daily-work-lines-plain.employee-work-compact-row {
        grid-template-columns: 58px minmax(0, 1fr);
        font-size: 11.5px;
    }
    .daily-work-employee-day .employee-work-compact-row .daily-work-plain-line {
        padding: 5px 6px;
        font-size: 11.5px;
    }
}

/* Centre the section login form and keep every control inside the card. */
body.page-login .login-box {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    box-sizing: border-box;
}
body.page-login .login-box > h1,
body.page-login .login-box label,
body.page-login .login-box .alert {
    text-align: center;
}
body.page-login .login-box form,
body.page-login .login-box form > div,
body.page-login .login-box .login-public-links {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
}
body.page-login .login-box input:not([type="hidden"]):not([type="checkbox"]) {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
body.page-login .login-box form .actions {
    justify-content: center;
}
body.page-login .login-box form button,
body.page-login .login-box .login-public-links > .btn {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    justify-content: center;
    align-items: center;
    text-align: center;
}
@media (max-width: 767px) {
    body.page-login main > .card.login-box:first-child { padding-left: 15px !important; padding-right: 15px !important; }
}


/* Form grid gaps already provide space above action rows on phones. */
@media (max-width: 767px) {
    body.portal-shell .form-row > .actions {
        margin-top: 0;
        min-width: 0;
    }
    body.portal-shell .form-row > div {
        min-width: 0;
    }
}


/* Match View 2 typography and date-card presentation in View 1. */
.daily-work-day-card.daily-work-coach-day {
    border: 3px solid var(--primary, #2b7f89); background: #edf5f7;
    padding: 8px; margin-bottom: 16px;
}
.daily-work-coach-day .daily-work-lines-plain {
    margin-top: 4px; border-radius: 7px;
}
.daily-work-coach-day .daily-work-plain-line {
    padding: 6px 8px; font-size: 12px; line-height: 1.25; overflow-wrap: anywhere;
}
@media (max-width: 720px) {
    .daily-work-day-card.daily-work-coach-day { padding: 6px; }
    .daily-work-coach-day .daily-work-plain-line { padding: 5px 6px; font-size: 11.5px; }
}

/* PA days: matching light red cards in Full and Lite. */
.day-card.day-card-pa { background: #fff0f0; border-color: #efb3b3; }
.employee-incentive-detail-view .day-card-status-pa { background: #ffe0e0; border-color: #efb3b3; color: #b42318; }

/* Match Daily Works View 1 and View 2 compact typography. */
.coach-work-line { padding:6px 8px; font-family:inherit; font-size:12px; line-height:1.25; }
.coach-work-line-work strong,.coach-work-line-tokens strong,.coach-work-line-date time {
    font-family:inherit; font-size:12px; font-weight:700; line-height:1.25; overflow-wrap:anywhere;
}
.coach-work-line-work strong { color:#0f172a; }
.coach-work-coach-card h2 { font-family:inherit; font-weight:700; }
@media(max-width:720px){
    .coach-work-line { padding:5px 6px; font-size:11.5px; }
    .coach-work-line-work strong,.coach-work-line-tokens strong,.coach-work-line-date time { font-size:11.5px; line-height:1.25; }
}

.employee-directory-photo img { object-position: center top; }

/* Consistent 2:3 portrait frames; preserve the top of each photograph. */
.profile-img { width:112px; height:168px; object-position:center top; }
.employee-dashboard-photo { width:126px; height:189px; flex-shrink:0; align-self:start; }
body.employee-dashboard-full .employee-dashboard-photo { flex-basis:78px; width:78px; height:117px; }
.employee-directory-photo { width:72px; height:108px; flex-shrink:0; align-self:start; }
@media(max-width:720px){
 .profile-img { width:96px; height:144px; }
 .employee-dashboard-photo { width:104px; height:156px; }
 body.employee-dashboard-full .employee-dashboard-photo { flex-basis:68px; width:68px; height:102px; }
 .employee-directory-photo { width:64px; height:96px; }
}