:root {
    --portal-primary: #5b2a86;
    --portal-primary-deep: #431f64;
    --portal-secondary: #2b6cb0;
    --portal-secondary-deep: #1f5490;
    --portal-teal: #1e88b5;
    --portal-emerald: #0fa36b;
    --portal-accent-green: #7ed957;
    --portal-charcoal: #0f0f10;
    --portal-dark-grey: #3a3a3c;
    --portal-mid-grey: #7a7a7a;
    --portal-light-grey: #d9d9d9;
    --portal-off-white: #f5f5f5;
    --portal-bg: #eef3f9;
    --portal-surface: #ffffff;
    --portal-surface-alt: #f8fafc;
    --portal-surface-strong: #ffffff;
    --portal-success: #0b8f66;
    --portal-warning: #b36b11;
    --portal-danger: #b63f50;
    --portal-border: rgba(94, 108, 132, 0.18);
    --portal-border-strong: rgba(94, 108, 132, 0.28);
    --portal-shadow: 0 24px 64px rgba(16, 24, 40, 0.10);
    --portal-shadow-soft: 0 12px 30px rgba(16, 24, 40, 0.08);
    --portal-shadow-tight: 0 8px 20px rgba(16, 24, 40, 0.08);
    --portal-radius-xl: 28px;
    --portal-radius-lg: 22px;
    --portal-radius-md: 18px;
    --portal-radius-sm: 14px;
    --portal-font: "Bahnschrift", "Segoe UI Variable", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

/* Monthly Attendance Register: the calendar authority is dense by nature;
   keep it in one accessible horizontal matrix instead of collapsing facts. */
body.portal-shell-page.attendance-shell .monthly-register-page {
    max-width: none;
}

body.portal-shell-page.attendance-shell .monthly-register-panel {
    display: grid;
    gap: 1rem;
    padding: clamp(1rem, 2vw, 1.5rem);
}

body.portal-shell-page.attendance-shell .monthly-register-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

body.portal-shell-page.attendance-shell .monthly-register-header h2 {
    margin: 0;
    color: #1d2940;
    font-size: clamp(1.1rem, 2vw, 1.35rem);
}

body.portal-shell-page.attendance-shell .monthly-register-nav {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
}

body.portal-shell-page.attendance-shell .monthly-register-nav .portal-button {
    min-width: 2.25rem;
    min-height: 2.25rem;
    padding: .25rem .7rem;
    font-size: 1.35rem;
    line-height: 1;
}

body.portal-shell-page.attendance-shell .monthly-register-nav strong {
    min-width: 7.5rem;
    color: #293956;
    font-size: .92rem;
    text-align: center;
}

body.portal-shell-page.attendance-shell .monthly-register-holidays {
    display: grid;
    gap: .55rem;
    padding: .75rem;
    border: 1px solid #dce5f2;
    border-radius: .9rem;
    background: #f8fafc;
}

body.portal-shell-page.attendance-shell .monthly-register-holidays__form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
}

body.portal-shell-page.attendance-shell .monthly-register-holidays__form input {
    min-height: 2.35rem;
    padding: .42rem .65rem;
    border: 1px solid #ced9e8;
    border-radius: .6rem;
    background: #fff;
    color: #273650;
    font: inherit;
}

body.portal-shell-page.attendance-shell .monthly-register-holidays__form input[name="holiday_name"] { min-width: 12rem; }
body.portal-shell-page.attendance-shell .monthly-register-holidays__form input[name="holiday_type"] { min-width: 7rem; }
body.portal-shell-page.attendance-shell .monthly-register-holidays__form .portal-button { min-height: 2.35rem; padding: .42rem .85rem; }

body.portal-shell-page.attendance-shell .monthly-register-holidays__list {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
}

body.portal-shell-page.attendance-shell .monthly-register-holiday {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
    padding: .22rem .42rem .22rem .55rem;
    border: 1px solid #d5dfec;
    border-radius: 999px;
    color: #40516d;
    background: #fff;
    font-size: .78rem;
    font-weight: 700;
}

body.portal-shell-page.attendance-shell .monthly-register-holiday.is-inactive { opacity: .55; }
body.portal-shell-page.attendance-shell .monthly-register-holiday form { display: inline; }
body.portal-shell-page.attendance-shell .monthly-register-holiday button {
    width: 1.25rem;
    height: 1.25rem;
    border: 0;
    border-radius: 999px;
    color: #6a307d;
    background: transparent;
    cursor: pointer;
    font: inherit;
    font-size: 1rem;
    line-height: 1;
}

body.portal-shell-page.attendance-shell .monthly-register-matrix {
    overflow-x: auto;
    border: 1px solid #dbe4f1;
    border-radius: .9rem;
    background: #fff;
    -webkit-overflow-scrolling: touch;
}

body.portal-shell-page.attendance-shell .monthly-register-table {
    width: max-content;
    min-width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    color: #2b3c59;
    font-size: .75rem;
}

body.portal-shell-page.attendance-shell .monthly-register-table th,
body.portal-shell-page.attendance-shell .monthly-register-table td {
    min-width: 2.5rem;
    height: 2.85rem;
    padding: .25rem;
    border-bottom: 1px solid #e2e8f2;
    border-right: 1px solid #edf1f6;
    text-align: center;
    vertical-align: middle;
}

body.portal-shell-page.attendance-shell .monthly-register-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    color: #61708a;
    background: #f7f9fc;
    font-size: .67rem;
    font-weight: 900;
    letter-spacing: .08em;
}

body.portal-shell-page.attendance-shell .monthly-register-table__employee {
    position: sticky;
    left: 0;
    z-index: 1;
    min-width: 11rem !important;
    max-width: 13rem;
    text-align: left !important;
    background: #fff;
}

body.portal-shell-page.attendance-shell .monthly-register-table thead .monthly-register-table__employee {
    z-index: 3;
    background: #f7f9fc;
}

body.portal-shell-page.attendance-shell .monthly-register-table__employee strong,
body.portal-shell-page.attendance-shell .monthly-register-table__employee small { display: block; }
body.portal-shell-page.attendance-shell .monthly-register-table__employee strong { color: #263852; font-weight: 800; }
body.portal-shell-page.attendance-shell .monthly-register-table__employee small { margin-top: .14rem; color: #78859a; font-size: .66rem; font-weight: 700; }
body.portal-shell-page.attendance-shell .monthly-register-table__day.is-non-working { color: #8a6a39; background: #fff8e7; }
body.portal-shell-page.attendance-shell .monthly-register-cell { min-width: 2.5rem; font-weight: 800; }
body.portal-shell-page.attendance-shell .monthly-register-cell--friday,
body.portal-shell-page.attendance-shell .monthly-register-cell--holiday { min-width: 4.25rem; color: #8b6c38; background: #fff8e9; font-size: .66rem; line-height: 1.1; }
body.portal-shell-page.attendance-shell .monthly-register-cell--leave_full { color: #9b3344; background: #fff2f4; }
body.portal-shell-page.attendance-shell .monthly-register-cell--leave_half { color: #7b5b19; background: #fff9e8; }
body.portal-shell-page.attendance-shell .monthly-register-cell--awi { color: #fff; background: #b42318; }
body.portal-shell-page.attendance-shell .monthly-register-cell--blank { color: #b9c3d0; background: #fbfcfe; }
body.portal-shell-page.attendance-shell .monthly-register-cell.is-actionable { padding: 0; }
body.portal-shell-page.attendance-shell .monthly-register-cell.is-actionable form { height: 100%; }
body.portal-shell-page.attendance-shell .monthly-register-cell__action {
    width: 100%;
    min-height: 2.85rem;
    padding: .25rem;
    border: 0;
    color: inherit;
    background: transparent;
    cursor: pointer;
    font: inherit;
    font-weight: inherit;
}
body.portal-shell-page.attendance-shell .monthly-register-cell--present.is-actionable:hover .monthly-register-cell__action,
body.portal-shell-page.attendance-shell .monthly-register-cell--present.is-actionable:focus-within .monthly-register-cell__action { color: #8c2634; background: #fff0f2; }
body.portal-shell-page.attendance-shell .monthly-register-cell--awi.is-actionable:hover .monthly-register-cell__action,
body.portal-shell-page.attendance-shell .monthly-register-cell--awi.is-actionable:focus-within .monthly-register-cell__action { background: #8f1d15; }
body.portal-shell-page.attendance-shell .monthly-register-summary { color: #344867; background: #f8fafc; font-weight: 800; }
body.portal-shell-page.attendance-shell .monthly-register-empty { padding: 1.2rem; color: #70809a; text-align: center; }

@media (max-width: 640px) {
    body.portal-shell-page.attendance-shell .monthly-register-panel { padding: .8rem; }
    body.portal-shell-page.attendance-shell .monthly-register-header { align-items: flex-start; flex-direction: column; }
    body.portal-shell-page.attendance-shell .monthly-register-holidays__form { display: grid; grid-template-columns: 1fr 1fr; }
    body.portal-shell-page.attendance-shell .monthly-register-holidays__form input[name="holiday_name"],
    body.portal-shell-page.attendance-shell .monthly-register-holidays__form input[name="holiday_type"] { min-width: 0; }
    body.portal-shell-page.attendance-shell .monthly-register-holidays__form input[name="holiday_name"] { grid-column: span 2; }
    body.portal-shell-page.attendance-shell .monthly-register-holidays__form .portal-button { grid-column: span 2; }
    body.portal-shell-page.attendance-shell .monthly-register-table__employee { min-width: 9.5rem !important; }
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .holiday-controls{padding:18px 20px;border:1px solid #d7dfef;border-radius:20px;background:#fff;grid-template-columns:180px minmax(260px,1fr) auto auto}body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .holiday-controls label>span,.holiday-stat__label{font-size:.78rem;font-weight:750;color:#52627b;text-transform:uppercase;letter-spacing:.04em}.holiday-stat__value{line-height:1.1}.holiday-stat__support{margin-top:4px}.holiday-row{grid-template-columns:minmax(0,1fr) auto auto;padding:22px 24px}.holiday-row__main{display:grid;gap:7px}.holiday-row__name{font-size:1rem;color:#172033}.holiday-row__date{font-size:.88rem;color:#60708c}.holiday-row__badges{display:flex;gap:8px;align-items:center}.holiday-type{display:inline-flex;align-items:center;padding:6px 11px;border-radius:999px;background:#f3ebfb;border:1px solid #dcc9f2;font-size:.8rem}.holiday-list{margin-top:22px;background:#fff}.holiday-actions{justify-content:flex-end}@media(max-width:800px){body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .holiday-controls{grid-template-columns:1fr;padding:16px}.holiday-row{grid-template-columns:1fr;gap:14px}.holiday-row__badges,.holiday-actions{grid-column:auto}.holiday-actions{justify-content:flex-start}.holiday-stat{min-height:132px}}

/* Holiday Calendar workspace */
.holiday-controls{display:grid;grid-template-columns:180px minmax(220px,1fr) auto auto;gap:14px;align-items:end;margin:24px 0}.holiday-controls label,.holiday-dialog label{display:grid;gap:7px;font-weight:700;color:#455b79}.holiday-controls input,.holiday-controls select,.holiday-dialog input,.holiday-dialog select{min-height:48px;border:1px solid #d7dfef;border-radius:14px;padding:0 14px;background:#fff;font:inherit}.holiday-check{display:flex!important;align-items:center;gap:8px;padding-bottom:14px}.holiday-check input{min-height:auto}.holiday-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:22px 0}.holiday-stats article{padding:20px}.holiday-stats span,.holiday-stats small,.holiday-row small{display:block;color:#60708c}.holiday-stats strong{display:block;font-size:28px;color:#592a91;margin:10px 0}.holiday-list{border:1px solid #d7dfef;border-radius:20px;overflow:hidden}.holiday-row{display:grid;grid-template-columns:1.1fr 1.7fr .9fr .8fr auto;gap:18px;align-items:center;padding:20px 24px;border-bottom:1px solid #e2e8f2}.holiday-row:last-child{border-bottom:0}.holiday-row strong{display:block}.holiday-type{color:#5b2996;font-weight:700}.holiday-actions{display:flex;gap:8px}.holiday-dialog{border:0;border-radius:22px;padding:0;width:min(520px,calc(100vw - 32px));box-shadow:0 24px 70px #17244a55}.holiday-dialog::backdrop{background:#17244a77}.holiday-dialog form{display:grid;gap:16px;padding:26px}.holiday-dialog header,.holiday-dialog footer{display:flex;justify-content:space-between;align-items:center}.holiday-dialog h3{margin:0}.holiday-dialog header button{border:0;background:none;font-size:28px}.holiday-error{margin:0;color:#b42318;min-height:20px}.holiday-dialog footer{justify-content:flex-end;gap:10px}@media(max-width:800px){.holiday-controls{grid-template-columns:1fr}.holiday-stats{grid-template-columns:repeat(2,1fr)}.holiday-row{grid-template-columns:1fr 1fr;padding:18px}.holiday-actions{grid-column:1/-1}.leave-balance-section-tabs{overflow:auto;white-space:nowrap}.holiday-dialog{width:calc(100vw - 20px);margin:auto}}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html,
body {
    min-height: 100%;
}

body.portal-shell-page,
body.portal-auth-page {
    margin: 0;
    font-family: var(--portal-font);
    color-scheme: light;
    color: var(--portal-charcoal);
    background:
        radial-gradient(circle at 10% 0%, rgba(91, 42, 134, 0.08), transparent 30%),
        radial-gradient(circle at 90% 4%, rgba(43, 108, 176, 0.07), transparent 26%),
        linear-gradient(180deg, #fbfcfe 0%, var(--portal-off-white) 100%);
    overflow-x: hidden;
}

body.portal-shell-page::before,
body.portal-auth-page::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    opacity: 0.35;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.18) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.18) 1px, transparent 1px);
    background-size: 42px 42px;
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.42), rgba(0, 0, 0, 0.06));
}

body.portal-shell-page a,
body.portal-auth-page a {
    color: inherit;
    text-decoration: none;
}

body.portal-shell-page a:focus-visible,
body.portal-auth-page a:focus-visible,
body.portal-shell-page button:focus-visible,
body.portal-auth-page button:focus-visible,
body.portal-shell-page summary:focus-visible,
body.portal-auth-page summary:focus-visible,
body.portal-shell-page input:focus-visible,
body.portal-auth-page input:focus-visible,
body.portal-shell-page textarea:focus-visible,
body.portal-auth-page textarea:focus-visible,
body.portal-shell-page select:focus-visible,
body.portal-auth-page select:focus-visible {
    outline: 3px solid rgba(91, 42, 134, 0.24);
    outline-offset: 2px;
}

body.portal-shell-page button,
body.portal-auth-page button,
body.portal-shell-page .portal-button,
body.portal-auth-page .portal-button {
    appearance: none;
    border: 0;
    border-radius: 999px;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
    transition:
        transform 0.16s ease,
        box-shadow 0.16s ease,
        background-color 0.16s ease,
        color 0.16s ease,
        border-color 0.16s ease,
        opacity 0.16s ease;
}

body.portal-shell-page button:hover,
body.portal-auth-page button:hover,
body.portal-shell-page .portal-button:hover,
body.portal-auth-page .portal-button:hover {
    transform: translateY(-1px);
}

body.portal-shell-page button:active,
body.portal-auth-page button:active,
body.portal-shell-page .portal-button:active,
body.portal-auth-page .portal-button:active {
    transform: translateY(0);
}

body.portal-shell-page input,
body.portal-auth-page input,
body.portal-shell-page textarea,
body.portal-auth-page textarea,
body.portal-shell-page select,
body.portal-auth-page select {
    width: 100%;
    border: 1px solid var(--portal-border);
    border-radius: 16px;
    background: #fff;
    color: var(--portal-charcoal);
    padding: 0.92rem 1rem;
    font: inherit;
    box-shadow: inset 0 1px 1px rgba(16, 24, 40, 0.02);
}

body.portal-shell-page h1,
body.portal-shell-page h2,
body.portal-shell-page h3,
body.portal-shell-page h4,
body.portal-auth-page h1,
body.portal-auth-page h2,
body.portal-auth-page h3,
body.portal-auth-page h4,
body.portal-shell-page p,
body.portal-auth-page p,
body.portal-shell-page dl,
body.portal-auth-page dl,
body.portal-shell-page ul,
body.portal-auth-page ul {
    margin: 0;
}

body.portal-shell-page h1,
body.portal-shell-page h2,
body.portal-shell-page h3,
body.portal-shell-page h4,
body.portal-auth-page h1,
body.portal-auth-page h2,
body.portal-auth-page h3,
body.portal-auth-page h4 {
    line-height: 1.12;
    letter-spacing: -0.025em;
}

body.portal-shell-page .portal-app,
body.portal-auth-page .portal-app {
    min-height: 100vh;
    position: relative;
    z-index: 1;
}

body.portal-shell-page .portal-shell-backdrop,
body.portal-auth-page .portal-shell-backdrop {
    position: fixed;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 15% 20%, rgba(91, 42, 134, 0.18), transparent 20%),
        radial-gradient(circle at 85% 0%, rgba(43, 108, 176, 0.16), transparent 18%);
    opacity: 0.8;
}

body.portal-shell-page .portal-topbar,
body.portal-auth-page .portal-topbar {
    position: sticky;
    top: 0;
    z-index: 40;
    backdrop-filter: blur(20px);
    background: rgba(248, 250, 252, 0.84);
    border-bottom: 1px solid rgba(214, 222, 232, 0.92);
}

body.portal-shell-page .portal-topbar__inner,
body.portal-auth-page .portal-topbar__inner {
    max-width: 1540px;
    margin: 0 auto;
    padding: 0.8rem 1.1rem;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
}

body.portal-shell-page .portal-brand,
body.portal-auth-page .portal-brand {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    min-width: 0;
}

body.portal-shell-page .portal-brand__logo-wrap,
body.portal-auth-page .portal-brand__logo-wrap {
    width: 52px;
    height: 52px;
    padding: 0.38rem;
    border-radius: 18px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, rgba(91, 42, 134, 0.12), rgba(43, 108, 176, 0.08));
    border: 1px solid rgba(91, 42, 134, 0.12);
    box-shadow: 0 12px 28px rgba(16, 24, 40, 0.08);
    flex-shrink: 0;
}

body.portal-shell-page .portal-brand__logo,
body.portal-auth-page .portal-brand__logo {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

body.portal-shell-page .portal-brand__copy,
body.portal-auth-page .portal-brand__copy {
    min-width: 0;
    display: grid;
    gap: 0.1rem;
}

body.portal-shell-page .portal-brand__eyebrow,
body.portal-auth-page .portal-brand__eyebrow {
    font-size: 0.68rem;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    font-weight: 800;
    color: var(--portal-mid-grey);
}

body.portal-shell-page .portal-brand__title,
body.portal-auth-page .portal-brand__title {
    font-size: 1.08rem;
    font-weight: 900;
    color: var(--portal-charcoal);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.portal-auth-page .portal-brand__eyebrow,
body.portal-auth-page .portal-brand__title,
body.portal-auth-page .portal-brand__subline {
    color: rgba(255, 255, 255, 0.88);
}

body.portal-auth-page .portal-brand__title {
    white-space: normal;
}

body.portal-shell-page .portal-brand__subline,
body.portal-auth-page .portal-brand__subline {
    font-size: 0.88rem;
    color: var(--portal-mid-grey);
}

body.portal-shell-page .portal-topbar__context,
body.portal-auth-page .portal-topbar__context {
    display: flex;
    align-items: center;
    gap: 1rem;
    justify-content: flex-end;
    flex-wrap: wrap;
}

body.portal-shell-page .portal-page-head {
    display: grid;
    gap: 0.1rem;
    text-align: right;
}

body.portal-shell-page .portal-page-head__eyebrow {
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--portal-mid-grey);
}

body.portal-shell-page .portal-page-head__title {
    font-size: 1rem;
    font-weight: 800;
    color: var(--portal-charcoal);
}

body.portal-shell-page .portal-userbar,
body.portal-auth-page .portal-userbar {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}

body.portal-shell-page .portal-userbar__identity,
body.portal-auth-page .portal-userbar__identity {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    padding: 0.42rem 0.68rem 0.42rem 0.52rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(214, 222, 232, 0.95);
    box-shadow: var(--portal-shadow-soft);
}

body.portal-shell-page .portal-userbar__avatar,
body.portal-auth-page .portal-userbar__avatar {
    width: 34px;
    height: 34px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, var(--portal-primary), var(--portal-secondary));
    color: #fff;
    font-size: 0.82rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    box-shadow: 0 10px 22px rgba(91, 42, 134, 0.18);
}

body.portal-shell-page .portal-userbar__meta,
body.portal-auth-page .portal-userbar__meta {
    display: flex;
    flex-direction: column;
    gap: 0.12rem;
}

body.portal-shell-page .portal-userbar__name,
body.portal-auth-page .portal-userbar__name {
    font-size: 0.96rem;
    font-weight: 800;
    color: var(--portal-charcoal);
}

body.portal-shell-page .portal-userbar__role,
body.portal-auth-page .portal-userbar__role {
    font-size: 0.8rem;
    color: var(--portal-mid-grey);
}

body.portal-shell-page .portal-userbar__logout,
body.portal-auth-page .portal-userbar__logout {
    display: flex;
}

body.portal-shell-page .portal-account {
    display: contents;
}

body.portal-shell-page .portal-account__trigger {
    display: none;
}

body.portal-shell-page .portal-menu-toggle {
    display: none;
    min-height: 48px;
    padding: 0.78rem 1rem;
    white-space: nowrap;
}

body.portal-shell-page .portal-button,
body.portal-auth-page .portal-button,
body.portal-shell-page button[type="submit"],
body.portal-auth-page button[type="submit"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    padding: 0.9rem 1.15rem;
    color: #fff;
    background: linear-gradient(135deg, var(--portal-primary), var(--portal-primary-deep));
    box-shadow: 0 14px 30px rgba(91, 42, 134, 0.18);
}

body.portal-shell-page .portal-button--ghost,
body.portal-auth-page .portal-button--ghost,
body.portal-shell-page a.portal-button--ghost,
body.portal-auth-page a.portal-button--ghost {
    background: rgba(255, 255, 255, 0.95);
    color: var(--portal-charcoal);
    border: 1px solid rgba(214, 222, 232, 0.95);
    box-shadow: var(--portal-shadow-soft);
}

body.portal-shell-page .portal-button--full,
body.portal-auth-page .portal-button--full {
    width: 100%;
}

body.portal-shell-page .portal-button__icon,
body.portal-auth-page .portal-button__icon {
    width: 1rem;
    height: 1rem;
}

body.portal-shell-page .portal-shell-grid {
    max-width: 1540px;
    margin: 0 auto;
    padding: 1rem 1.1rem 1.2rem;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
    padding-bottom: 1.2rem;
}

body.portal-shell-page .portal-sidebar,
body.portal-auth-page .portal-auth-panel,
body.portal-shell-page .portal-panel,
body.portal-auth-page .portal-panel,
body.portal-shell-page .portal-card,
body.portal-auth-page .portal-card {
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(214, 222, 232, 0.98);
    border-radius: var(--portal-radius-xl);
    box-shadow: var(--portal-shadow-soft);
}

body.portal-shell-page .portal-sidebar {
    position: fixed;
    top: 88px;
    left: 1rem;
    bottom: 1rem;
    width: min(320px, calc(100vw - 2rem));
    z-index: 60;
    padding: 0.9rem;
    display: grid;
    gap: 0.85rem;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(248, 250, 252, 0.94));
    transform: translateX(calc(-100% - 1.35rem));
    opacity: 0;
    pointer-events: none;
    transition:
        transform 0.22s ease,
        opacity 0.18s ease;
    overflow: auto;
    overscroll-behavior: contain;
}

body.portal-shell-page .portal-drawer {
    position: fixed;
    inset: 88px 0 0 0;
    z-index: 58;
    pointer-events: none;
}

body.portal-shell-page .portal-drawer.is-open {
    pointer-events: auto;
}

body.portal-shell-page .portal-drawer__scrim {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: rgba(15, 15, 16, 0.28);
    opacity: 0;
    transition: opacity 0.18s ease;
}

body.portal-shell-page .portal-drawer.is-open .portal-drawer__scrim {
    opacity: 1;
}

body.portal-shell-page .portal-drawer__panel {
    position: absolute;
    inset: 0 auto 0 0;
    transform: translateX(calc(-100% - 1.35rem));
    opacity: 0;
    pointer-events: none;
}

body.portal-shell-page .portal-drawer.is-open .portal-drawer__panel {
    transform: translateX(0);
    opacity: 1;
    pointer-events: auto;
    box-shadow: 0 28px 60px rgba(16, 24, 40, 0.16);
}

body.portal-shell-page .portal-nav-panel,
body.portal-shell-page .portal-sidebar__brand {
    padding: 0.9rem;
}

body.portal-shell-page .portal-panel__eyebrow,
body.portal-auth-page .portal-panel__eyebrow {
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--portal-mid-grey);
}

body.portal-shell-page .portal-chip,
body.portal-auth-page .portal-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 0.35rem 0.85rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.02em;
}

body.portal-shell-page .portal-chip--soft,
body.portal-auth-page .portal-chip--soft {
    background: rgba(43, 108, 176, 0.10);
    color: var(--portal-secondary);
}

body.portal-shell-page .portal-chip--accent,
body.portal-auth-page .portal-chip--accent {
    background: rgba(91, 42, 134, 0.10);
    color: var(--portal-primary);
}

body.portal-shell-page .portal-nav {
    display: grid;
    gap: 0.45rem;
}

body.portal-shell-page .portal-nav__item,
body.portal-shell-page .portal-mobile-dock__item,
body.portal-shell-page .portal-mobile-sheet__item {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0.7rem;
    padding: 0.82rem 0.92rem;
    border-radius: 16px;
    border: 1px solid transparent;
    color: var(--portal-dark-grey);
    background: rgba(255, 255, 255, 0.62);
    transition:
        transform 0.16s ease,
        box-shadow 0.16s ease,
        border-color 0.16s ease,
        background-color 0.16s ease;
}

body.portal-shell-page .portal-nav__item:hover,
body.portal-shell-page .portal-mobile-dock__item:hover,
body.portal-shell-page .portal-mobile-sheet__item:hover {
    transform: translateY(-1px);
    border-color: rgba(91, 42, 134, 0.18);
    box-shadow: var(--portal-shadow-soft);
}

body.portal-shell-page .portal-nav__item.is-active,
body.portal-shell-page .portal-mobile-dock__item.is-active,
body.portal-shell-page .portal-mobile-sheet__item.is-active {
    background: linear-gradient(135deg, rgba(91, 42, 134, 0.10), rgba(43, 108, 176, 0.08));
    border-color: rgba(91, 42, 134, 0.24);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

body.portal-shell-page .portal-nav__icon,
body.portal-shell-page .portal-mobile-dock__icon,
body.portal-shell-page .portal-mobile-sheet__icon,
body.portal-shell-page .portal-module-card__icon {
    width: 30px;
    height: 30px;
    border-radius: 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    padding: 0.22rem;
    color: #fff;
    box-shadow: 0 12px 24px rgba(16, 24, 40, 0.08);
}

body.portal-shell-page .portal-icon svg {
    width: 100%;
    height: 100%;
}

body.portal-shell-page .portal-nav__label,
body.portal-shell-page .portal-mobile-sheet__label {
    font-size: 0.95rem;
    font-weight: 800;
}

body.portal-shell-page .portal-content {
    min-width: 0;
    display: grid;
    gap: 0.9rem;
}

body.portal-shell-page .portal-alert {
    display: flex;
    align-items: flex-start;
    gap: 0.7rem;
    padding: 0.95rem 1rem;
    border-radius: 18px;
    background: rgba(255, 251, 235, 0.96);
    border: 1px solid rgba(255, 199, 92, 0.45);
    color: #7a4b09;
    box-shadow: var(--portal-shadow-soft);
}

body.portal-shell-page .portal-alert__dot {
    width: 0.8rem;
    height: 0.8rem;
    margin-top: 0.25rem;
    border-radius: 999px;
    background: var(--portal-warning);
    box-shadow: 0 0 0 5px rgba(179, 107, 17, 0.12);
    flex-shrink: 0;
}

body.portal-shell-page .portal-dashboard {
    display: grid;
    gap: 0.9rem;
}

body.portal-shell-page .portal-module-grid,
body.portal-auth-page .portal-module-grid {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page .portal-module-grid--featured {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

body.portal-shell-page .portal-module-card,
body.portal-auth-page .portal-module-card {
    display: grid;
    gap: 0.6rem;
    padding: 0.9rem;
    min-height: 148px;
    color: var(--portal-charcoal);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.96));
    border: 1px solid rgba(214, 222, 232, 0.98);
    box-shadow: var(--portal-shadow);
}

body.portal-shell-page .portal-module-card:hover,
body.portal-auth-page .portal-module-card:hover {
    transform: translateY(-2px);
}

body.portal-shell-page .portal-module-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

body.portal-shell-page .portal-module-card__badge {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 0 0.55rem;
    border-radius: 999px;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

body.portal-shell-page .portal-module-card__badge.is-ready {
    background: rgba(15, 163, 107, 0.10);
    color: var(--portal-success);
}

body.portal-shell-page .portal-module-card__badge.is-next {
    background: rgba(179, 107, 17, 0.10);
    color: var(--portal-warning);
}

body.portal-shell-page .portal-module-card__body {
    display: grid;
    gap: 0.35rem;
}

body.portal-shell-page .portal-module-card__title {
    font-size: 0.98rem;
    font-weight: 900;
    color: var(--portal-charcoal);
}

body.portal-shell-page .portal-module-card__desc {
    line-height: 1.55;
    font-size: 0.89rem;
    color: var(--portal-dark-grey);
}

body.portal-shell-page .portal-module-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-top: auto;
}

body.portal-shell-page .portal-module-card__arrow {
    font-size: 1rem;
    color: var(--portal-mid-grey);
    font-weight: 900;
}

body.portal-auth-page .portal-auth-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1.08fr) minmax(350px, 0.92fr);
}

body.portal-shell-page .portal-dashboard__intro {
    padding: 0.95rem 1rem;
}

body.portal-shell-page .portal-dashboard__title {
    margin-top: 0.45rem;
    font-size: 1.15rem;
    font-weight: 900;
    color: var(--portal-charcoal);
}

body.portal-shell-page .portal-dashboard__lede {
    margin-top: 0.35rem;
    color: var(--portal-dark-grey);
    line-height: 1.55;
    font-size: 0.92rem;
}

body.portal-shell-page .portal-module-page {
    display: grid;
    gap: 1rem;
}

body.portal-shell-page .portal-module-page__hero {
    display: grid;
    gap: 1rem;
    padding: 1rem;
}

body.portal-shell-page .portal-module-page__hero-copy {
    display: grid;
    gap: 0.55rem;
}

body.portal-shell-page .portal-module-page__title-row {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

body.portal-shell-page .portal-module-page__icon {
    width: 34px;
    height: 34px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    color: #fff;
    background: linear-gradient(135deg, var(--portal-primary), var(--portal-secondary));
    box-shadow: 0 14px 28px rgba(91, 42, 134, 0.18);
}

body.portal-shell-page .portal-module-page__title {
    font-size: clamp(1.25rem, 1.8vw, 1.75rem);
    font-weight: 900;
    color: var(--portal-charcoal);
}

body.portal-shell-page .portal-module-page__subtitle {
    margin-top: 0.3rem;
    color: var(--portal-dark-grey);
    line-height: 1.65;
    font-size: 0.93rem;
}

body.portal-shell-page .portal-module-page__summary {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

body.portal-shell-page .portal-module-page__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

body.portal-shell-page .attendance-page {
    display: grid;
    gap: 0.95rem;
}

body.portal-shell-page .attendance-page--light {
    max-width: 760px;
    width: 100%;
    margin: 0 auto;
    color-scheme: light;
}

body.portal-shell-page .attendance-home-card,
body.portal-shell-page .attendance-task-card {
    display: grid;
    gap: 1rem;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid rgba(221, 227, 234, 0.98);
    box-shadow: var(--portal-shadow-soft);
}

body.portal-shell-page .attendance-home-card {
    gap: 0.95rem;
}

body.portal-shell-page .attendance-home-card__copy {
    display: grid;
    gap: 0.3rem;
}

body.portal-shell-page .attendance-home-card__title {
    font-size: clamp(1.4rem, 2vw, 1.95rem);
    line-height: 1.08;
    font-weight: 900;
    color: var(--portal-charcoal);
}

body.portal-shell-page .attendance-home-actions {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page .attendance-home-button {
    min-height: 58px;
    border-radius: 16px;
    font-size: 1rem;
    font-weight: 700;
    color: #fff;
    box-shadow: none;
}

body.portal-shell-page .attendance-home-button:hover {
    transform: translateY(-1px);
}

body.portal-shell-page .attendance-home-button--entry {
    background: #119b6b;
}

body.portal-shell-page .attendance-home-button--entry:hover {
    background: #0b7f58;
}

body.portal-shell-page .attendance-home-button--exit {
    background: #5b2a86;
}

body.portal-shell-page .attendance-home-button--exit:hover {
    background: #45206a;
}

body.portal-shell-page .attendance-home-note {
    font-size: 0.94rem;
    line-height: 1.5;
    color: var(--portal-dark-grey);
}

body.portal-shell-page .attendance-home-secondary-actions {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page .attendance-home-secondary-button {
    min-height: 48px;
    border-radius: 16px;
}

body.portal-shell-page .attendance-home-secondary-button--admin {
    background: rgba(91, 42, 134, 0.08);
    border-color: rgba(91, 42, 134, 0.22);
    color: var(--portal-primary);
}

body.portal-shell-page .attendance-task-card {
    max-width: 760px;
    margin: 0 auto;
    padding: 1.75rem;
}

body.portal-shell-page .attendance-task-card__header {
    display: grid;
    gap: 0.35rem;
}

body.portal-shell-page .attendance-task-card__back {
    display: inline-flex;
    width: fit-content;
    font-size: 0.88rem;
    font-weight: 800;
    color: var(--portal-primary);
}

body.portal-shell-page .attendance-task-card__title {
    font-size: clamp(1.45rem, 2vw, 1.95rem);
    font-weight: 900;
    color: var(--portal-charcoal);
}

body.portal-shell-page .attendance-task-form {
    display: grid;
    gap: 1rem;
}

body.portal-shell-page .attendance-task-field {
    display: grid;
    gap: 0.5rem;
}

body.portal-shell-page .attendance-task-field--status {
    display: grid;
    gap: 0.45rem;
    padding: 0.9rem 1rem;
    border-radius: 18px;
    border: 1px solid rgba(221, 227, 234, 0.95);
    background: rgba(248, 250, 252, 0.96);
}

body.portal-shell-page .attendance-task-status {
    display: grid;
    gap: 0.18rem;
}

body.portal-shell-page .attendance-task-status__label {
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--portal-mid-grey);
}

body.portal-shell-page .attendance-task-status__note {
    line-height: 1.5;
    color: var(--portal-dark-grey);
}

body.portal-shell-page .attendance-task-confirmation {
    padding: 0.9rem 1rem;
    border-radius: 18px;
    border: 1px solid rgba(43, 108, 176, 0.18);
    background: rgba(43, 108, 176, 0.08);
    color: var(--portal-charcoal);
    line-height: 1.5;
}

body.portal-shell-page .attendance-task-actions {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.portal-shell-page .attendance-task-button {
    min-height: 58px;
    border-radius: 16px;
    font-size: 1rem;
    font-weight: 700;
    box-shadow: none;
}

body.portal-shell-page .attendance-task-button--primary {
    color: #fff;
}

body.portal-shell-page .attendance-task-button--entry {
    background: #119b6b;
}

body.portal-shell-page .attendance-task-button--entry:hover {
    background: #0b7f58;
}

body.portal-shell-page .attendance-task-button--exit {
    background: #5b2a86;
}

body.portal-shell-page .attendance-task-button--exit:hover {
    background: #45206a;
}

body.portal-shell-page .attendance-task-button--secondary {
    background: rgba(91, 42, 134, 0.08);
    color: var(--portal-primary);
}

body.portal-shell-page .attendance-task-footer {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page .attendance-task-footer__link {
    min-height: 48px;
    border-radius: 16px;
}

body.portal-shell-page .attendance-task-footer__link--admin {
    background: rgba(91, 42, 134, 0.08);
    border-color: rgba(91, 42, 134, 0.22);
    color: var(--portal-primary);
}

body.portal-shell-page .attendance-hero {
    display: grid;
    gap: 0.55rem;
    padding: 1rem;
    align-items: start;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.95));
}

body.portal-shell-page .attendance-hero__copy {
    display: grid;
    gap: 0.35rem;
}

body.portal-shell-page .attendance-hero__title {
    font-size: clamp(1.42rem, 1.9vw, 1.95rem);
    line-height: 1.1;
    letter-spacing: -0.03em;
    font-weight: 900;
    color: var(--portal-charcoal);
}

body.portal-shell-page .attendance-hero__focus {
    font-size: 0.98rem;
    font-weight: 800;
    color: var(--portal-primary);
}

body.portal-shell-page .attendance-hero__lede {
    max-width: 54rem;
    line-height: 1.6;
    color: var(--portal-dark-grey);
    font-size: 0.96rem;
}

body.portal-shell-page .attendance-status-grid,
body.portal-shell-page .attendance-work-grid,
body.portal-shell-page .attendance-review-grid {
    display: grid;
    gap: 0.9rem;
}

body.portal-shell-page .attendance-status-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page .attendance-status-card {
    display: grid;
    gap: 0.75rem;
    padding: 0.95rem 1rem;
    min-height: 136px;
}

body.portal-shell-page .attendance-status-card--entry {
    background: linear-gradient(180deg, rgba(15, 163, 107, 0.08), rgba(255, 255, 255, 0.98));
}

body.portal-shell-page .attendance-status-card--exit {
    background: linear-gradient(180deg, rgba(91, 42, 134, 0.08), rgba(255, 255, 255, 0.98));
}

body.portal-shell-page .attendance-status-card.is-focused {
    border-color: rgba(15, 163, 107, 0.26);
    box-shadow: 0 14px 32px rgba(15, 163, 107, 0.12);
}

body.portal-shell-page .attendance-status-card--exit.is-focused {
    border-color: rgba(91, 42, 134, 0.26);
    box-shadow: 0 14px 32px rgba(91, 42, 134, 0.12);
}

body.portal-shell-page .attendance-status-card.is-recorded {
    border-color: rgba(15, 163, 107, 0.20);
}

body.portal-shell-page .attendance-status-card--exit.is-recorded {
    border-color: rgba(91, 42, 134, 0.20);
}

body.portal-shell-page .attendance-status-card__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
}

body.portal-shell-page .attendance-status-card__eyebrow {
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.18em;
    color: var(--portal-mid-grey);
}

body.portal-shell-page .attendance-status-card__icon {
    width: 34px;
    height: 34px;
    border-radius: 12px;
    padding: 0.3rem;
    color: #fff;
    background: linear-gradient(135deg, var(--portal-primary), var(--portal-secondary));
}

body.portal-shell-page .attendance-status-card--exit .attendance-status-card__icon {
    background: linear-gradient(135deg, var(--portal-primary), var(--portal-secondary));
}

body.portal-shell-page .attendance-status-card__body {
    display: grid;
    gap: 0.35rem;
}

body.portal-shell-page .attendance-status-card__time {
    font-size: 1.5rem;
    line-height: 1.06;
    font-weight: 900;
    color: var(--portal-charcoal);
}

body.portal-shell-page .attendance-status-card__text {
    color: var(--portal-dark-grey);
    line-height: 1.5;
    font-size: 0.93rem;
}

body.portal-shell-page .attendance-work-grid {
    grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.98fr);
}

body.portal-shell-page .attendance-quick-panel,
body.portal-shell-page .attendance-recent-panel,
body.portal-shell-page .attendance-submission-panel,
body.portal-shell-page .attendance-history-panel,
body.portal-shell-page .attendance-review-queue,
body.portal-shell-page .attendance-review-detail {
    display: grid;
    gap: 0.85rem;
    padding: 1rem;
}

body.portal-shell-page .attendance-section-head {
    display: grid;
    gap: 0.2rem;
}

body.portal-shell-page .attendance-section-head__title {
    font-size: 1rem;
    font-weight: 900;
    color: var(--portal-charcoal);
}

body.portal-shell-page .attendance-section-head__lede {
    font-size: 0.92rem;
    line-height: 1.5;
    color: var(--portal-dark-grey);
}

body.portal-shell-page .attendance-quick-actions {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page .attendance-action-button {
    min-height: 58px;
    border-radius: 18px;
    justify-content: center;
}

body.portal-shell-page .attendance-action-button--entry {
    background: linear-gradient(135deg, var(--portal-emerald), #0c8a5b);
}

body.portal-shell-page .attendance-action-button--exit {
    background: linear-gradient(135deg, var(--portal-primary), var(--portal-primary-deep));
}

body.portal-shell-page .attendance-status-note {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    padding: 0.8rem 0.9rem;
    border-radius: 16px;
    background: rgba(43, 108, 176, 0.08);
    color: var(--portal-dark-grey);
    line-height: 1.5;
    font-size: 0.9rem;
}

body.portal-shell-page .attendance-status-note__dot {
    width: 0.72rem;
    height: 0.72rem;
    margin-top: 0.24rem;
    border-radius: 999px;
    background: var(--portal-secondary);
    box-shadow: 0 0 0 4px rgba(43, 108, 176, 0.12);
    flex-shrink: 0;
}

body.portal-shell-page .attendance-disclosure {
    display: grid;
    gap: 0.75rem;
}

body.portal-shell-page .attendance-disclosure__summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    cursor: pointer;
    list-style: none;
}

body.portal-shell-page .attendance-disclosure__summary strong {
    display: block;
    font-size: 1rem;
    font-weight: 900;
    color: var(--portal-charcoal);
}

body.portal-shell-page .attendance-disclosure__summary small {
    display: block;
    margin-top: 0.15rem;
    font-size: 0.86rem;
    color: var(--portal-dark-grey);
}

body.portal-shell-page .attendance-disclosure__chevron {
    font-size: 1.25rem;
    color: var(--portal-primary);
    transition: transform 0.18s ease;
}

body.portal-shell-page .attendance-disclosure[open] .attendance-disclosure__chevron {
    transform: rotate(180deg);
}

body.portal-shell-page .attendance-recent-list {
    display: grid;
    gap: 0.55rem;
}

body.portal-shell-page .attendance-recent-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.85rem 0.9rem;
    border-radius: 16px;
    border: 1px solid rgba(214, 222, 232, 0.92);
    background: rgba(255, 255, 255, 0.88);
}

body.portal-shell-page .attendance-recent-item strong {
    display: block;
    font-weight: 900;
    color: var(--portal-charcoal);
}

body.portal-shell-page .attendance-recent-item p,
body.portal-shell-page .attendance-recent-item small {
    display: block;
    color: var(--portal-dark-grey);
    font-size: 0.86rem;
    line-height: 1.45;
}

body.portal-shell-page .attendance-disclosure__footer {
    display: flex;
    justify-content: flex-start;
}

body.portal-shell-page .attendance-submission-panel__head {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 0.9rem;
}

body.portal-shell-page .attendance-submission-panel__title {
    font-size: 1.1rem;
    font-weight: 900;
    color: var(--portal-charcoal);
}

body.portal-shell-page .attendance-submission-panel__lede {
    margin-top: 0.25rem;
    color: var(--portal-dark-grey);
    line-height: 1.55;
    font-size: 0.93rem;
}

body.portal-shell-page .attendance-submission-panel__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    justify-content: flex-end;
}

body.portal-shell-page .attendance-submission-form {
    display: grid;
    gap: 0.9rem;
}

body.portal-shell-page .attendance-submission-form__grid {
    display: grid;
    gap: 0.9rem;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
}

body.portal-shell-page .attendance-submission-form__panel {
    display: grid;
    gap: 0.65rem;
}

body.portal-shell-page .attendance-submission-form__panel--meta {
    align-content: start;
}

body.portal-shell-page .attendance-submission-form__label {
    margin-top: 0.15rem;
}

body.portal-shell-page .attendance-textarea {
    width: 100%;
    min-height: 118px;
    padding: 0.85rem 0.95rem;
    border-radius: 16px;
    border: 1px solid rgba(214, 222, 232, 0.98);
    background: rgba(255, 255, 255, 0.96);
    color: var(--portal-charcoal);
    font-family: inherit;
    font-size: 0.96rem;
    line-height: 1.5;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
}

body.portal-shell-page .attendance-location-summary {
    display: grid;
    gap: 0.16rem;
    padding: 0.8rem 0.9rem;
    border-radius: 16px;
    border: 1px solid rgba(214, 222, 232, 0.92);
    background: rgba(255, 255, 255, 0.88);
}

body.portal-shell-page .attendance-location-summary__label {
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--portal-mid-grey);
}

body.portal-shell-page .attendance-location-summary strong {
    font-size: 0.98rem;
    font-weight: 900;
    color: var(--portal-charcoal);
}

body.portal-shell-page .attendance-submission-form__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

body.portal-shell-page .attendance-history-toolbar {
    display: grid;
    gap: 0.8rem;
    justify-items: end;
}

body.portal-shell-page .attendance-history-toolbar__field {
    display: grid;
    gap: 0.35rem;
    min-width: 220px;
}

body.portal-shell-page .attendance-history-toolbar__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

body.portal-shell-page .attendance-history-panel {
    display: grid;
    gap: 0.9rem;
}

body.portal-shell-page .attendance-history-panel__header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

body.portal-shell-page .attendance-history-table-wrap {
    overflow: auto;
}

body.portal-shell-page .attendance-history-table {
    width: 100%;
    border-collapse: collapse;
}

body.portal-shell-page .attendance-history-table th,
body.portal-shell-page .attendance-history-table td {
    padding: 0.85rem 0.8rem;
    border-bottom: 1px solid rgba(214, 222, 232, 0.88);
    vertical-align: top;
    text-align: left;
}

body.portal-shell-page .attendance-history-table th {
    font-size: 0.7rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--portal-mid-grey);
}

body.portal-shell-page .attendance-history-table td strong,
body.portal-shell-page .attendance-history-card strong {
    display: block;
    font-weight: 900;
    color: var(--portal-charcoal);
}

body.portal-shell-page .attendance-history-table td p,
body.portal-shell-page .attendance-history-card p {
    margin-top: 0.2rem;
    color: var(--portal-dark-grey);
    font-size: 0.88rem;
    line-height: 1.45;
}

body.portal-shell-page .attendance-history-card-list {
    display: none;
    gap: 0.75rem;
}

body.portal-shell-page .attendance-history-card {
    display: grid;
    gap: 0.7rem;
    padding: 0.95rem;
    border-radius: 18px;
    border: 1px solid rgba(214, 222, 232, 0.95);
    background: rgba(255, 255, 255, 0.96);
}

body.portal-shell-page .attendance-history-card__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

body.portal-shell-page .attendance-history-card__head h3 {
    font-size: 1rem;
    font-weight: 900;
}

body.portal-shell-page .attendance-history-card__head p {
    margin-top: 0.14rem;
}

body.portal-shell-page .attendance-history-card__grid {
    display: grid;
    gap: 0.65rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page .attendance-history-card__full {
    grid-column: 1 / -1;
}

body.portal-shell-page .attendance-history-card__label {
    display: block;
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--portal-mid-grey);
}

body.portal-shell-page .attendance-status-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    padding: 0.25rem 0.7rem;
    border-radius: 999px;
    background: rgba(91, 42, 134, 0.1);
    color: var(--portal-primary);
    font-size: 0.76rem;
    font-weight: 900;
}

body.portal-shell-page .attendance-empty-state {
    display: grid;
    gap: 0.35rem;
    padding: 0.85rem 0;
}

body.portal-shell-page .attendance-empty-state h3 {
    font-size: 1.05rem;
    font-weight: 900;
    color: var(--portal-charcoal);
}

body.portal-shell-page .attendance-empty-state p {
    color: var(--portal-dark-grey);
    line-height: 1.55;
}

body.portal-shell-page .attendance-review-grid {
    grid-template-columns: minmax(300px, 0.85fr) minmax(0, 1.15fr);
}

body.portal-shell-page .attendance-review-queue {
    min-height: 100%;
}

body.portal-shell-page .attendance-review-queue__list {
    display: grid;
    gap: 0.65rem;
}

body.portal-shell-page .attendance-review-item {
    display: grid;
    gap: 0.42rem;
    padding: 0.88rem 0.92rem;
    border-radius: 18px;
    border: 1px solid rgba(214, 222, 232, 0.95);
    background: rgba(255, 255, 255, 0.9);
    color: var(--portal-charcoal);
}

body.portal-shell-page .attendance-review-item.is-active {
    border-color: rgba(91, 42, 134, 0.28);
    background: linear-gradient(180deg, rgba(91, 42, 134, 0.08), rgba(255, 255, 255, 0.98));
}

body.portal-shell-page .attendance-review-item__top,
body.portal-shell-page .attendance-review-item__body,
body.portal-shell-page .attendance-review-item__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
}

body.portal-shell-page .attendance-review-item__meta:last-child {
    margin-top: 0.1rem;
}

body.portal-shell-page .attendance-review-item__top strong {
    font-size: 0.94rem;
    font-weight: 900;
}

body.portal-shell-page .attendance-review-item__pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 26px;
    padding: 0 0.55rem;
    border-radius: 999px;
    background: rgba(43, 108, 176, 0.1);
    color: var(--portal-secondary);
    font-size: 0.68rem;
    font-weight: 900;
}

body.portal-shell-page .attendance-review-item__body span,
body.portal-shell-page .attendance-review-item__body small,
body.portal-shell-page .attendance-review-item__meta span {
    font-size: 0.86rem;
    color: var(--portal-dark-grey);
}

body.portal-shell-page .attendance-review-detail__header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 0.9rem;
}

body.portal-shell-page .admin-pill-stack {
    display: grid;
    gap: 0.35rem;
    justify-items: end;
}

body.portal-shell-page .admin-pill--soft {
    background: rgba(43, 108, 176, 0.10);
    color: var(--portal-secondary);
}

body.portal-shell-page .attendance-review-detail__header h3 {
    font-size: 1.1rem;
    font-weight: 900;
    color: var(--portal-charcoal);
}

body.portal-shell-page .attendance-review-detail__header p {
    margin-top: 0.25rem;
    color: var(--portal-dark-grey);
    line-height: 1.5;
}

body.portal-shell-page .attendance-review-detail__grid {
    display: grid;
    gap: 0.8rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page .attendance-review-card {
    display: grid;
    gap: 0.65rem;
    padding: 0.9rem;
    border-radius: 18px;
    border: 1px solid rgba(214, 222, 232, 0.95);
    background: rgba(255, 255, 255, 0.92);
}

body.portal-shell-page .attendance-review-card h4 {
    font-size: 0.98rem;
    font-weight: 900;
}

body.portal-shell-page .attendance-review-card dl {
    display: grid;
    gap: 0.45rem;
}

body.portal-shell-page .attendance-review-card dl div {
    display: grid;
    gap: 0.12rem;
}

body.portal-shell-page .attendance-review-card dt {
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--portal-mid-grey);
}

body.portal-shell-page .attendance-review-card dd {
    font-size: 0.92rem;
    font-weight: 800;
    color: var(--portal-charcoal);
    word-break: break-word;
}

body.portal-shell-page .attendance-review-form {
    display: grid;
    gap: 0.85rem;
}

body.portal-shell-page .attendance-review-form__grid {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page .attendance-review-form__field--full {
    grid-column: 1 / -1;
}

body.portal-shell-page .attendance-review-form__actions {
    display: flex;
    gap: 0.65rem;
}

body.portal-shell-page .portal-form-label {
    display: block;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--portal-mid-grey);
}

body.portal-shell-page .portal-form-control {
    min-height: 48px;
}

body.portal-shell-page .portal-nav__item.tone--purple,
body.portal-shell-page .portal-mobile-dock__item.tone--purple,
body.portal-shell-page .portal-mobile-sheet__item.tone--purple,
body.portal-shell-page .portal-module-card.tone--purple .portal-module-card__icon,
body.portal-shell-page .portal-module-card.tone--purple .portal-module-card__badge {
    background-color: rgba(91, 42, 134, 0.12);
    color: var(--portal-primary);
}

body.portal-shell-page .portal-nav__item.tone--purple .portal-nav__icon,
body.portal-shell-page .portal-mobile-dock__item.tone--purple .portal-mobile-dock__icon,
body.portal-shell-page .portal-mobile-sheet__item.tone--purple .portal-mobile-sheet__icon,
body.portal-shell-page .portal-module-card.tone--purple .portal-module-card__icon {
    background: linear-gradient(135deg, var(--portal-primary), var(--portal-primary-deep));
}

body.portal-shell-page .portal-nav__item.tone--blue .portal-nav__icon,
body.portal-shell-page .portal-mobile-dock__item.tone--blue .portal-mobile-dock__icon,
body.portal-shell-page .portal-mobile-sheet__item.tone--blue .portal-mobile-sheet__icon,
body.portal-shell-page .portal-module-card.tone--blue .portal-module-card__icon {
    background: linear-gradient(135deg, var(--portal-secondary), var(--portal-secondary-deep));
}

body.portal-shell-page .portal-nav__item.tone--teal .portal-nav__icon,
body.portal-shell-page .portal-mobile-dock__item.tone--teal .portal-mobile-dock__icon,
body.portal-shell-page .portal-mobile-sheet__item.tone--teal .portal-mobile-sheet__icon,
body.portal-shell-page .portal-module-card.tone--teal .portal-module-card__icon {
    background: linear-gradient(135deg, var(--portal-teal), #0e6f91);
}

body.portal-shell-page .portal-nav__item.tone--green .portal-nav__icon,
body.portal-shell-page .portal-mobile-dock__item.tone--green .portal-mobile-dock__icon,
body.portal-shell-page .portal-mobile-sheet__item.tone--green .portal-mobile-sheet__icon,
body.portal-shell-page .portal-module-card.tone--green .portal-module-card__icon {
    background: linear-gradient(135deg, var(--portal-emerald), #098c5a);
}

body.portal-shell-page .portal-nav__item.tone--amber .portal-nav__icon,
body.portal-shell-page .portal-mobile-dock__item.tone--amber .portal-mobile-dock__icon,
body.portal-shell-page .portal-mobile-sheet__item.tone--amber .portal-mobile-sheet__icon,
body.portal-shell-page .portal-module-card.tone--amber .portal-module-card__icon {
    background: linear-gradient(135deg, var(--portal-warning), #8e5511);
}

body.portal-shell-page .portal-nav__item.tone--slate .portal-nav__icon,
body.portal-shell-page .portal-mobile-dock__item.tone--slate .portal-mobile-dock__icon,
body.portal-shell-page .portal-mobile-sheet__item.tone--slate .portal-mobile-sheet__icon,
body.portal-shell-page .portal-module-card.tone--slate .portal-module-card__icon {
    background: linear-gradient(135deg, #526273, #303b48);
}

body.portal-shell-page .portal-admin-shell {
    display: grid;
    gap: 0.95rem;
    max-width: 1368px;
    width: 100%;
    margin: 0 auto;
}

body.portal-shell-page .portal-admin-shell--subpage {
    gap: 0.8rem;
}

body.portal-shell-page .portal-admin-shell__frame {
    display: grid;
    gap: 0.8rem;
    width: 100%;
}

body.portal-shell-page .admin-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    color: var(--portal-mid-grey);
}

body.portal-shell-page .admin-breadcrumb__item {
    color: inherit;
}

body.portal-shell-page .admin-breadcrumb__item.is-current {
    color: var(--portal-charcoal);
}

body.portal-shell-page .admin-breadcrumb__separator {
    color: rgba(122, 122, 122, 0.72);
}

body.portal-shell-page .admin-page-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 1rem;
    padding: 1rem 1.05rem;
}

body.portal-shell-page .admin-page-head__copy {
    display: grid;
    gap: 0.25rem;
}

body.portal-shell-page .admin-page-head__title {
    margin: 0;
    font-size: clamp(1.8rem, 2.15vw, 2.15rem);
    line-height: 1.08;
    letter-spacing: -0.03em;
    font-weight: 900;
    color: var(--portal-charcoal);
}

body.portal-shell-page .admin-page-head__lede {
    max-width: 52rem;
    color: var(--portal-dark-grey);
    line-height: 1.5;
    font-size: 0.98rem;
}

body.portal-shell-page .admin-page-head__actions {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
}

body.portal-shell-page .admin-sibling-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

body.portal-shell-page .admin-sibling-tabs__item {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0.54rem 0.9rem;
    border-radius: 999px;
    border: 1px solid rgba(214, 222, 232, 0.98);
    background: rgba(255, 255, 255, 0.92);
    color: var(--portal-dark-grey);
    font-size: 0.86rem;
    font-weight: 800;
    box-shadow: var(--portal-shadow-soft);
}

body.portal-shell-page .admin-sibling-tabs__item.is-active {
    background: linear-gradient(135deg, rgba(91, 42, 134, 0.12), rgba(43, 108, 176, 0.08));
    border-color: rgba(91, 42, 134, 0.24);
    color: var(--portal-charcoal);
}

body.portal-shell-page .admin-toolbar {
    display: grid;
    gap: 0.8rem;
}

body.portal-shell-page .admin-toolbar .admin-filter-panel {
    padding: 1rem;
}

body.portal-shell-page .portal-admin-drawer {
    width: min(336px, calc(100vw - 2rem));
}

body.portal-shell-page .portal-admin-drawer .portal-nav__icon {
    width: 26px;
    height: 26px;
    border-radius: 10px;
    padding: 0.18rem;
}

body.portal-shell-page .admin-drawer {
    display: grid;
    gap: 0.85rem;
}

body.portal-shell-page .admin-drawer__group {
    display: grid;
    gap: 0.55rem;
}

body.portal-shell-page .admin-drawer__heading {
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--portal-mid-grey);
}

body.portal-shell-page .admin-drawer__links {
    display: grid;
    gap: 0.45rem;
}

body.portal-shell-page .portal-admin-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 1rem;
    padding: 1.1rem 1.1rem 1rem;
}

body.portal-shell-page .portal-admin-hero__title {
    margin-top: 0.3rem;
    font-size: clamp(1.85rem, 2.35vw, 2.15rem);
    font-weight: 900;
    letter-spacing: -0.03em;
    color: var(--portal-charcoal);
}

body.portal-shell-page .portal-admin-hero__lede {
    margin-top: 0.35rem;
    color: var(--portal-dark-grey);
    line-height: 1.55;
    font-size: 1rem;
    max-width: 48rem;
}

body.portal-shell-page .portal-admin-hero__actions {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
}

body.portal-shell-page .portal-admin-hero__inline-actions {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    margin-top: 0.9rem;
}

body.portal-shell-page .portal-admin-hero__inline-actions .portal-button {
    min-width: 0;
}

body.portal-shell-page .admin-action-center,
body.portal-shell-page .admin-launch-section {
    display: grid;
    gap: 0.85rem;
    padding: 1rem;
}

body.portal-shell-page .admin-section-head {
    display: grid;
    gap: 0.15rem;
}

body.portal-shell-page .admin-section-head__title {
    font-size: 1.04rem;
    font-weight: 900;
    color: var(--portal-charcoal);
}

body.portal-shell-page .admin-section-head__lede {
    font-size: 0.93rem;
    line-height: 1.45;
    color: var(--portal-dark-grey);
}

body.portal-shell-page .admin-section-head--compact {
    gap: 0;
}

body.portal-shell-page .admin-action-list {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page .admin-action-item {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) auto;
    gap: 0.9rem;
    align-items: center;
    min-height: 84px;
    padding: 0.95rem 1rem;
    border-radius: 18px;
    border: 1px solid rgba(214, 222, 232, 0.95);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(250, 251, 253, 0.96));
    box-shadow: var(--portal-shadow-soft);
}

body.portal-shell-page .admin-action-item__icon {
    width: 46px;
    height: 46px;
    border-radius: 13px;
    display: grid;
    place-items: center;
    color: var(--portal-primary);
    background: rgba(91, 42, 134, 0.11);
    box-shadow: none;
}

body.portal-shell-page .admin-action-item.tone--blue .admin-action-item__icon {
    color: var(--portal-secondary);
    background: rgba(43, 108, 176, 0.11);
}

body.portal-shell-page .admin-action-item.tone--teal .admin-action-item__icon {
    color: var(--portal-teal);
    background: rgba(30, 136, 181, 0.11);
}

body.portal-shell-page .admin-action-item.tone--green .admin-action-item__icon {
    color: var(--portal-emerald);
    background: rgba(15, 163, 107, 0.11);
}

body.portal-shell-page .admin-action-item.tone--amber .admin-action-item__icon {
    color: var(--portal-warning);
    background: rgba(179, 107, 17, 0.11);
}

body.portal-shell-page .admin-action-item.tone--slate .admin-action-item__icon {
    color: #526273;
    background: rgba(82, 98, 115, 0.11);
}

body.portal-shell-page .admin-action-item__copy {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
}

body.portal-shell-page .admin-action-item__title {
    font-size: 1rem;
    font-weight: 900;
    color: var(--portal-charcoal);
}

body.portal-shell-page .admin-action-item__desc {
    font-size: 0.92rem;
    line-height: 1.45;
    color: var(--portal-dark-grey);
}

body.portal-shell-page .admin-action-item__side {
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;
    justify-self: end;
}

body.portal-shell-page .admin-action-item__arrow {
    font-size: 1.7rem;
    line-height: 1;
    color: var(--portal-primary);
}

body.portal-shell-page .admin-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.8rem;
    height: 1.8rem;
    padding: 0 0.45rem;
    border-radius: 999px;
    background: #e11919;
    color: #fff;
    font-size: 0.76rem;
    font-weight: 900;
    box-shadow: 0 8px 14px rgba(225, 25, 25, 0.18);
}

body.portal-shell-page .admin-launch-grid {
    display: grid;
    gap: 0.9rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.portal-shell-page .admin-local-nav {
    display: grid;
    gap: 0.9rem;
}

body.portal-shell-page .admin-local-nav__group {
    display: grid;
    gap: 0.55rem;
}

body.portal-shell-page .admin-local-nav__heading {
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--portal-mid-grey);
}

body.portal-shell-page .admin-local-nav__links {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

body.portal-shell-page .admin-local-nav__item {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.72rem 0.92rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(214, 222, 232, 0.98);
    color: var(--portal-dark-grey);
    font-weight: 800;
    font-size: 0.88rem;
    box-shadow: var(--portal-shadow-soft);
}

body.portal-shell-page .admin-local-nav__item.is-active {
    background: linear-gradient(135deg, rgba(91, 42, 134, 0.12), rgba(43, 108, 176, 0.08));
    border-color: rgba(91, 42, 134, 0.22);
    color: var(--portal-charcoal);
}

body.portal-shell-page .admin-local-nav__icon {
    width: 22px;
    height: 22px;
    color: var(--portal-primary);
}

body.portal-shell-page .portal-admin-shell__content {
    display: grid;
    gap: 0.95rem;
}

body.portal-shell-page .admin-action-grid,
body.portal-shell-page .admin-card-grid,
body.portal-shell-page .admin-detail-grid,
body.portal-shell-page .admin-log-grid {
    display: grid;
    gap: 0.9rem;
}

body.portal-shell-page .admin-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.9rem;
}

body.portal-shell-page .admin-summary-grid--three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.portal-shell-page .admin-summary-card {
    display: grid;
    align-content: start;
    gap: 0.3rem;
    min-height: 118px;
    padding: 1rem;
    border-radius: 18px;
    border: 1px solid rgba(214, 222, 232, 0.95);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(250, 251, 253, 0.96));
    box-shadow: var(--portal-shadow-soft);
}

body.portal-shell-page .admin-summary-card__label {
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--portal-mid-grey);
}

body.portal-shell-page .admin-summary-card__value {
    font-size: 1.5rem;
    line-height: 1.08;
    font-weight: 900;
    color: var(--portal-charcoal);
}

body.portal-shell-page .admin-summary-card__detail {
    font-size: 0.84rem;
    line-height: 1.35;
    color: var(--portal-dark-grey);
}

body.portal-shell-page .admin-summary-card.tone--purple {
    background: linear-gradient(180deg, rgba(91, 42, 134, 0.1), rgba(255, 255, 255, 0.98));
}

body.portal-shell-page .admin-summary-card.tone--blue {
    background: linear-gradient(180deg, rgba(43, 108, 176, 0.1), rgba(255, 255, 255, 0.98));
}

body.portal-shell-page .admin-summary-card.tone--teal {
    background: linear-gradient(180deg, rgba(30, 136, 181, 0.1), rgba(255, 255, 255, 0.98));
}

body.portal-shell-page .admin-summary-card.tone--green {
    background: linear-gradient(180deg, rgba(15, 163, 107, 0.1), rgba(255, 255, 255, 0.98));
}

body.portal-shell-page .admin-filter-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.85rem;
}

body.portal-shell-page .admin-action-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page .admin-card-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.portal-shell-page .admin-detail-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page .admin-log-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page .admin-filter-panel,
body.portal-shell-page .admin-record-card,
body.portal-shell-page .admin-detail-card,
body.portal-shell-page .admin-log-section,
body.portal-shell-page .admin-empty-state {
    padding: 1rem;
}

body.portal-shell-page .admin-filter-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.85rem;
    align-items: end;
}

body.portal-shell-page .admin-filter-form__field {
    display: grid;
    gap: 0.35rem;
}

body.portal-shell-page .admin-filter-form__actions {
    display: flex;
    gap: 0.65rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}

body.portal-shell-page .admin-edit-form {
    display: grid;
    gap: 0.9rem;
}

body.portal-shell-page .admin-edit-form__notes {
    display: grid;
    gap: 0.35rem;
}

body.portal-shell-page .admin-permission-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
}

body.portal-shell-page .admin-permission-choice {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.65rem;
    align-items: start;
    padding: 0.75rem 0.8rem;
    border-radius: 16px;
    border: 1px solid rgba(214, 222, 232, 0.92);
    background: rgba(255, 255, 255, 0.86);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6);
}

body.portal-shell-page .admin-permission-choice input {
    width: 1rem;
    height: 1rem;
    margin-top: 0.2rem;
    accent-color: var(--portal-primary);
}

body.portal-shell-page .admin-permission-choice strong {
    display: block;
    font-size: 0.9rem;
    font-weight: 800;
    color: var(--portal-charcoal);
}

body.portal-shell-page .admin-permission-choice small {
    display: block;
    margin-top: 0.18rem;
    font-size: 0.78rem;
    line-height: 1.45;
    color: var(--portal-mid-grey);
}

body.portal-shell-page .admin-check-note {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    padding: 0.8rem 0.9rem;
    border-radius: 16px;
    border: 1px solid rgba(91, 42, 134, 0.16);
    background: rgba(91, 42, 134, 0.06);
    color: var(--portal-dark-grey);
    font-size: 0.88rem;
    line-height: 1.5;
}

body.portal-shell-page .admin-check-note input {
    width: 1rem;
    height: 1rem;
    margin-top: 0.15rem;
    accent-color: var(--portal-primary);
}

body.portal-shell-page .admin-launch-card {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) auto;
    gap: 0.95rem;
    align-items: center;
    min-height: 168px;
    padding: 1.05rem 1rem;
    position: relative;
    text-align: left;
    border-radius: 18px;
    border: 1px solid rgba(214, 222, 232, 0.95);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(250, 251, 253, 0.96));
    box-shadow: var(--portal-shadow-soft);
    overflow: hidden;
}

body.portal-shell-page .admin-section-card {
    min-height: 0;
}

body.portal-shell-page .admin-launch-card__icon {
    position: relative;
    width: 46px;
    height: 46px;
    border-radius: 13px;
    display: grid;
    place-items: center;
    color: var(--portal-primary);
    background: rgba(91, 42, 134, 0.11);
    overflow: hidden;
    box-shadow: none;
}

body.portal-shell-page .admin-launch-card__icon-bg {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: inherit;
}

body.portal-shell-page .admin-launch-card__icon-graphic {
    position: relative;
    z-index: 1;
    display: grid;
    place-items: center;
}

body.portal-shell-page .admin-launch-card.tone--blue .admin-launch-card__icon {
    color: var(--portal-secondary);
    background: rgba(43, 108, 176, 0.11);
}

body.portal-shell-page .admin-launch-card.tone--teal .admin-launch-card__icon {
    color: var(--portal-teal);
    background: rgba(30, 136, 181, 0.11);
}

body.portal-shell-page .admin-launch-card.tone--green .admin-launch-card__icon {
    color: var(--portal-emerald);
    background: rgba(15, 163, 107, 0.11);
}

body.portal-shell-page .admin-launch-card.tone--amber .admin-launch-card__icon {
    color: var(--portal-warning);
    background: rgba(179, 107, 17, 0.11);
}

body.portal-shell-page .admin-launch-card.tone--slate .admin-launch-card__icon {
    color: #526273;
    background: rgba(82, 98, 115, 0.11);
}

body.portal-shell-page .admin-launch-card__body {
    display: grid;
    gap: 0.22rem;
}

body.portal-shell-page .admin-launch-card__body h3 {
    font-size: 1.08rem;
    font-weight: 900;
}

body.portal-shell-page .admin-launch-card__body p {
    font-size: 0.93rem;
    line-height: 1.5;
    color: var(--portal-dark-grey);
}

body.portal-shell-page .admin-launch-card__side {
    display: inline-flex;
    align-self: stretch;
    align-items: flex-start;
    justify-content: flex-end;
    gap: 0.7rem;
    padding-top: 0.05rem;
}

body.portal-shell-page .admin-launch-card__chevron {
    margin-top: 0.3rem;
    font-size: 1.6rem;
    line-height: 1;
    color: var(--portal-charcoal);
}

body.portal-shell-page .admin-record,
body.portal-shell-page .admin-record-card {
    display: grid;
    gap: 0.8rem;
}

body.portal-shell-page .admin-record__header,
body.portal-shell-page .admin-record-card__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

body.portal-shell-page .admin-record__header h3,
body.portal-shell-page .admin-record__header h4,
body.portal-shell-page .admin-record-card__header h3,
body.portal-shell-page .admin-record-card__header h4 {
    font-size: 1rem;
    font-weight: 900;
}

body.portal-shell-page .admin-record__header p,
body.portal-shell-page .admin-record-card__header p {
    margin-top: 0.22rem;
    font-size: 0.86rem;
    line-height: 1.45;
    color: var(--portal-mid-grey);
}

body.portal-shell-page .admin-record__details,
body.portal-shell-page .admin-kv-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem 0.85rem;
}

body.portal-shell-page .admin-kv,
body.portal-shell-page .admin-field {
    display: grid;
    gap: 0.18rem;
}

body.portal-shell-page .admin-kv__label,
body.portal-shell-page .admin-field__label {
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--portal-mid-grey);
}

body.portal-shell-page .admin-kv__value,
body.portal-shell-page .admin-field__value {
    font-size: 0.93rem;
    font-weight: 800;
    color: var(--portal-charcoal);
    word-break: break-word;
}

body.portal-shell-page .admin-help-text {
    margin-top: 0.45rem;
    font-size: 0.8rem;
    line-height: 1.45;
    color: var(--portal-mid-grey);
}

body.portal-shell-page .admin-field--full {
    grid-column: 1 / -1;
}

body.portal-shell-page .admin-record-card__meta,
body.portal-shell-page .admin-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

body.portal-shell-page .admin-record-card__actions {
    display: flex;
    justify-content: flex-start;
}

body.portal-shell-page .admin-empty-state {
    display: grid;
    gap: 0.35rem;
    text-align: left;
}

body.portal-shell-page .admin-empty-state h3 {
    font-size: 1rem;
    font-weight: 900;
}

body.portal-shell-page .admin-empty-state p {
    font-size: 0.9rem;
    color: var(--portal-dark-grey);
    line-height: 1.5;
}

body.portal-shell-page .admin-empty-state--compact {
    padding: 0.25rem 0;
}

body.portal-shell-page .admin-stack--tight {
    gap: 0.55rem;
}

body.portal-shell-page .admin-record--compact {
    gap: 0.45rem;
    padding: 0.7rem 0.85rem;
    border-radius: 16px;
    border: 1px solid rgba(214, 222, 232, 0.88);
    background: rgba(255, 255, 255, 0.82);
}

body.portal-shell-page .salary-detail-record-stack {
    display: grid;
    gap: 0.75rem;
}

body.portal-shell-page .admin-copy {
    font-size: 0.93rem;
    line-height: 1.55;
    color: var(--portal-dark-grey);
}

body.portal-shell-page .admin-pagination {
    display: flex;
    justify-content: flex-end;
}

body.portal-shell-page .portal-mobile-dock {
    display: none;
}

body.portal-shell-page .portal-mobile-dock__more {
    position: relative;
}

body.portal-shell-page .portal-mobile-dock__more > summary {
    list-style: none;
    cursor: pointer;
}

body.portal-shell-page .portal-mobile-dock__more > summary::-webkit-details-marker {
    display: none;
}

body.portal-shell-page .portal-mobile-sheet {
    position: absolute;
    left: 0;
    right: 0;
    bottom: calc(100% + 0.65rem);
    display: grid;
    gap: 0.55rem;
    padding: 0.85rem;
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid rgba(214, 222, 232, 0.98);
    box-shadow: var(--portal-shadow);
    max-height: min(56vh, 420px);
    overflow: auto;
}

body.portal-shell-page .portal-mobile-sheet__logout {
    margin-top: 0.4rem;
}

body.portal-shell-page .portal-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: var(--portal-icon-size, 22px);
    height: var(--portal-icon-size, 22px);
}

body.portal-shell-page .portal-icon svg {
    display: block;
    width: 100%;
    height: 100%;
}

body.portal-shell-page .portal-sidebar__brand {
    padding: 0.95rem;
}

body.portal-shell-page .portal-sidebar__brand .portal-brand__logo-wrap {
    width: 46px;
    height: 46px;
}

body.portal-shell-page .portal-sidebar__brand .portal-brand__title {
    font-size: 1rem;
}

body.portal-shell-page .portal-sidebar__brand .portal-brand__subline {
    font-size: 0.76rem;
}

body.portal-shell-page .portal-userbar__identity {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0.7rem;
    padding: 0.55rem 0.75rem;
    border-radius: 18px;
}

body.portal-shell-page .portal-userbar__avatar {
    width: 36px;
    height: 36px;
    border-radius: 14px;
    padding: 0.18rem;
    background: linear-gradient(135deg, var(--portal-primary), var(--portal-secondary));
}

body.portal-shell-page .portal-userbar__avatar-icon {
    display: block;
    width: 100%;
    height: 100%;
    color: #fff;
}

body.portal-shell-page .portal-userbar__avatar svg {
    width: 100%;
    height: 100%;
}

body.portal-shell-page .portal-userbar__stack {
    display: grid;
    gap: 0.08rem;
    min-width: 0;
}

body.portal-shell-page .portal-userbar__name {
    font-size: 0.92rem;
}

body.portal-shell-page .portal-userbar__business {
    font-size: 0.78rem;
    color: var(--portal-charcoal);
    font-weight: 800;
}

body.portal-shell-page .portal-userbar__role {
    font-size: 0.76rem;
}

body.portal-shell-page .portal-nav__label {
    font-size: 0.93rem;
}

body.portal-shell-page .portal-nav__description,
body.portal-shell-page .portal-mobile-sheet__description,
body.portal-shell-page .portal-nav__badge {
    display: none;
}

body.portal-shell-page .portal-mobile-dock__item {
    min-height: 62px;
    padding: 0.58rem 0.45rem;
}

body.portal-shell-page .portal-mobile-dock__label {
    font-size: 0.68rem;
}

body.portal-drawer-open {
    overflow: hidden;
}

body.portal-shell-page .portal-module-card__footer {
    justify-content: flex-end;
}

body.portal-shell-page .portal-module-card.is-next,
body.portal-shell-page .portal-module-card.is-ready {
    position: relative;
}

body.portal-shell-page .portal-module-card.is-next::after,
body.portal-shell-page .portal-module-card.is-ready::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

body.portal-auth-page .portal-auth-shell {
    max-width: 1540px;
    margin: 0 auto;
    padding: clamp(0.95rem, 2vw, 1.4rem);
    display: grid;
    gap: 0.9rem;
}

body.portal-auth-page .portal-auth-grid {
    align-items: start;
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.92fr);
}

body.portal-auth-page .portal-feedback {
    border-radius: 18px;
    padding: 0.9rem 0.95rem;
    border: 1px solid var(--portal-border);
    background: #fff;
    color: var(--portal-charcoal);
    box-shadow: var(--portal-shadow-soft);
}

body.portal-auth-page .portal-feedback--success {
    border-color: rgba(11, 143, 102, 0.22);
    background: rgba(236, 253, 245, 0.98);
    color: #0f6b50;
}

body.portal-auth-page .portal-feedback--warning {
    border-color: rgba(179, 107, 17, 0.24);
    background: rgba(255, 251, 235, 0.98);
    color: #8a5b12;
}

body.portal-auth-page .portal-feedback--info {
    border-color: rgba(43, 108, 176, 0.22);
    background: rgba(239, 246, 255, 0.98);
    color: #214e82;
}

body.portal-auth-page .portal-auth-divider {
    border-top: 1px solid rgba(214, 222, 232, 0.9);
    margin: 1rem 0;
}

body.portal-auth-page .portal-auth-brand,
body.portal-auth-page .portal-auth-panel {
    padding: 1rem;
}

body.portal-auth-page .portal-auth-brand {
    display: grid;
    gap: 1rem;
    color: #fff;
    background:
        linear-gradient(135deg, rgba(91, 42, 134, 0.98), rgba(43, 108, 176, 0.94));
    overflow: hidden;
    border: 0;
    box-shadow: var(--portal-shadow);
}

body.portal-auth-page .portal-auth-brand__mark {
    align-items: center;
}

body.portal-auth-page .portal-auth-brand__hero {
    display: grid;
    gap: 0.45rem;
}

body.portal-auth-page .portal-auth-brand__title {
    font-size: clamp(1.45rem, 2vw, 2rem);
    line-height: 1.05;
    font-weight: 900;
}

body.portal-auth-page .portal-auth-brand__lede {
    color: rgba(255, 255, 255, 0.84);
    font-size: 0.98rem;
    line-height: 1.65;
    max-width: 28rem;
}

body.portal-auth-page .portal-auth-brand .portal-brand__logo-wrap {
    background: rgba(255, 255, 255, 0.16);
    border-color: rgba(255, 255, 255, 0.18);
}

body.portal-auth-page .portal-auth-brand .portal-brand__title,
body.portal-auth-page .portal-auth-brand .portal-brand__subline,
body.portal-auth-page .portal-auth-brand .portal-brand__eyebrow {
    color: rgba(255, 255, 255, 0.92);
}

body.portal-auth-page .portal-auth-stack {
    display: grid;
    gap: 0.9rem;
}

body.portal-auth-page .portal-auth-panel {
    display: grid;
    gap: 0.8rem;
}

body.portal-auth-page .portal-auth-panel__title {
    font-size: 1.15rem;
    font-weight: 900;
    color: var(--portal-charcoal);
}

body.portal-auth-page .portal-auth-panel__lede {
    color: var(--portal-dark-grey);
    line-height: 1.6;
    font-size: 0.94rem;
}

body.portal-auth-page .portal-auth-button-card {
    padding: 0.95rem;
    border-radius: 18px;
    background: rgba(248, 250, 252, 0.96);
    border: 1px solid rgba(214, 222, 232, 0.9);
}

body.portal-auth-page .portal-auth-button-slot {
    min-height: 52px;
}

body.portal-auth-page .portal-request-toggle {
    display: grid;
    gap: 0.8rem;
}

body.portal-auth-page .portal-request-toggle > summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.9rem;
}

body.portal-auth-page .portal-request-toggle > summary::-webkit-details-marker {
    display: none;
}

body.portal-auth-page .portal-request-toggle__action {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0 0.85rem;
    border-radius: 999px;
    color: var(--portal-primary);
    background: rgba(91, 42, 134, 0.12);
    font-size: 0.78rem;
    font-weight: 800;
}

body.portal-auth-page .portal-request-panel {
    display: grid;
    gap: 0.8rem;
    padding-top: 0.2rem;
}

body.portal-auth-page .portal-request-form {
    display: grid;
    gap: 0.9rem;
}

body.portal-auth-page .portal-form-label {
    display: block;
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--portal-dark-grey);
    margin-bottom: 0.45rem;
}

body.portal-auth-page .portal-form-control {
    min-height: 120px;
    resize: vertical;
}

body.portal-auth-page .portal-auth-success__name {
    font-size: 1.25rem;
    font-weight: 900;
    color: var(--portal-charcoal);
}

body.portal-auth-page .portal-auth-success__id {
    font-size: 1rem;
    font-weight: 800;
    color: var(--portal-primary);
}

body.portal-auth-page .portal-auth-success__role {
    font-size: 0.92rem;
    color: var(--portal-mid-grey);
}

body.portal-auth-page .portal-auth-success__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

body.portal-auth-page #google-signin-button {
    min-height: 52px;
}

body.portal-auth-page #auth-feedback {
    display: none;
}

body.portal-auth-page .is-visible {
    display: block !important;
}

body.portal-auth-page .hidden,
body.portal-shell-page .hidden {
    display: none !important;
}

body.portal-auth-page .portal-status-card h2,
body.portal-auth-page .portal-auth-panel h1,
body.portal-auth-page .portal-auth-panel h2,
body.portal-auth-page .portal-auth-panel h3 {
    color: var(--portal-charcoal);
}

body.portal-auth-page .portal-auth-panel p,
body.portal-auth-page .portal-status-card p,
body.portal-auth-page .portal-auth-panel li,
body.portal-auth-page .portal-status-card li {
    color: var(--portal-dark-grey);
    line-height: 1.7;
}

body.portal-auth-page .portal-auth-panel .portal-chip {
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
}

body.portal-auth-page .portal-auth-panel .portal-chip--accent {
    background: rgba(255, 255, 255, 0.18);
}

@media (max-width: 1240px) {
    body.portal-shell-page .portal-mobile-dock {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 50;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 0.35rem;
        padding: 0.8rem 0.8rem calc(0.8rem + env(safe-area-inset-bottom));
        background: rgba(248, 250, 252, 0.94);
        border-top: 1px solid rgba(214, 222, 232, 0.92);
        backdrop-filter: blur(18px);
        box-shadow: 0 -18px 48px rgba(16, 24, 40, 0.08);
    }

    body.portal-shell-page .portal-mobile-dock__item {
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 0.3rem;
        min-height: 66px;
        padding: 0.6rem 0.45rem;
        text-align: center;
    }

    body.portal-shell-page .portal-mobile-dock__label {
        font-size: 0.72rem;
        line-height: 1.1;
    }

    body.portal-shell-page .portal-shell-grid {
        padding-bottom: 9rem;
    }

    body.portal-shell-page .portal-module-grid,
    body.portal-auth-page .portal-auth-grid {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page .portal-module-grid--featured {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.portal-shell-page .admin-launch-grid,
    body.portal-shell-page .admin-action-grid,
    body.portal-shell-page .admin-card-grid,
    body.portal-shell-page .admin-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.portal-shell-page .admin-detail-grid,
    body.portal-shell-page .admin-log-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 820px) {
    body.portal-shell-page .portal-topbar__inner {
        grid-template-columns: minmax(0, 1fr) auto auto;
        grid-template-areas:
            "brand menu account"
            "page page page";
        gap: 0.55rem 0.7rem;
        padding: 0.65rem 1rem;
        align-items: center;
    }

    body.portal-shell-page .portal-topbar__context {
        display: contents;
    }

    body.portal-shell-page .portal-brand {
        grid-area: brand;
        gap: 0.55rem;
    }

    body.portal-shell-page .portal-brand__logo-wrap {
        width: 40px;
        height: 40px;
        padding: 0.24rem;
        border-radius: 13px;
        box-shadow: none;
    }

    body.portal-shell-page .portal-brand__eyebrow,
    body.portal-shell-page .portal-brand__subline {
        display: none;
    }

    body.portal-shell-page .portal-brand__title {
        font-size: 0.84rem;
        line-height: 1.15;
    }

    body.portal-shell-page .portal-menu-toggle {
        display: inline-flex;
        grid-area: menu;
        min-height: 40px;
        padding: 0.55rem 0.72rem;
        font-size: 0.78rem;
        box-shadow: none;
        justify-self: end;
    }

    body.portal-shell-page .portal-account {
        position: relative;
        display: block;
        grid-area: account;
        justify-self: end;
    }

    body.portal-shell-page .portal-account__trigger {
        width: 40px;
        height: 40px;
        padding: 0.3rem;
        border: 1px solid rgba(214, 222, 232, 0.95);
        border-radius: 13px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: #fff;
        background: linear-gradient(135deg, var(--portal-primary), var(--portal-secondary));
        box-shadow: 0 10px 22px rgba(91, 42, 134, 0.18);
    }

    body.portal-shell-page .portal-account__trigger-icon {
        width: 22px;
        height: 22px;
    }

    body.portal-shell-page .portal-page-head {
        grid-area: page;
        min-width: 0;
        text-align: left;
    }

    body.portal-shell-page .portal-page-head__title {
        overflow: hidden;
        font-size: 0.8rem;
        line-height: 1.2;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.portal-shell-page .portal-userbar {
        position: absolute;
        top: calc(100% + 0.6rem);
        right: 0;
        width: min(calc(100vw - 2rem), 320px);
        padding: 0.85rem;
        display: grid;
        gap: 0.75rem;
        border: 1px solid rgba(214, 222, 232, 0.98);
        border-radius: 18px;
        background: rgba(255, 255, 255, 0.98);
        box-shadow: var(--portal-shadow);
        z-index: 45;
    }

    body.portal-shell-page .portal-userbar[hidden] {
        display: none;
    }

    body.portal-shell-page .portal-userbar__identity,
    body.portal-shell-page .portal-userbar__notifications,
    body.portal-shell-page .portal-userbar__logout {
        width: 100%;
    }

    body.portal-shell-page .portal-userbar__notifications {
        display: grid;
        gap: 0.55rem;
    }

    body.portal-shell-page .portal-userbar__logout .portal-button {
        width: 100%;
    }

    body.portal-shell-page .portal-shell-grid,
    body.portal-auth-page .portal-auth-shell {
        padding: 0.95rem;
    }

    body.portal-shell-page .portal-shell-grid {
        padding-bottom: 20rem;
    }

    body.portal-auth-page .portal-auth-hero {
        gap: 0.9rem;
    }

    body.portal-shell-page .portal-module-page__hero {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page .portal-module-grid {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page .portal-module-grid--featured {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.portal-shell-page .portal-admin-hero {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page .portal-admin-hero__actions {
        justify-content: flex-start;
    }

    body.portal-shell-page .portal-admin-hero__inline-actions {
        margin-top: 0.75rem;
    }

    body.portal-shell-page .admin-launch-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.portal-shell-page .admin-action-list {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page .admin-action-grid,
    body.portal-shell-page .admin-card-grid,
    body.portal-shell-page .admin-detail-grid,
    body.portal-shell-page .admin-log-grid {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page .admin-filter-form {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page .admin-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.portal-shell-page .admin-filter-form__actions {
        justify-content: flex-start;
    }

    body.portal-shell-page .attendance-hero,
    body.portal-shell-page .attendance-work-grid,
    body.portal-shell-page .attendance-review-grid,
    body.portal-shell-page .attendance-status-grid,
    body.portal-shell-page .attendance-submission-form__grid,
    body.portal-shell-page .attendance-review-form__grid,
    body.portal-shell-page .attendance-history-toolbar {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page .attendance-review-detail__grid,
    body.portal-shell-page .attendance-history-card__grid {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page .attendance-home-actions,
    body.portal-shell-page .attendance-home-secondary-actions,
    body.portal-shell-page .attendance-task-actions,
    body.portal-shell-page .attendance-task-footer {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page .attendance-submission-panel__head,
    body.portal-shell-page .attendance-review-detail__header,
    body.portal-shell-page .attendance-history-panel__header {
        flex-direction: column;
        align-items: flex-start;
    }

    body.portal-shell-page .attendance-history-table-wrap {
        display: none;
    }

    body.portal-shell-page .attendance-history-card-list {
        display: grid;
    }

    body.portal-shell-page .attendance-quick-actions {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page .attendance-home-button,
    body.portal-shell-page .attendance-home-secondary-button,
    body.portal-shell-page .attendance-task-button,
    body.portal-shell-page .attendance-task-footer__link {
        width: 100%;
    }

    body.portal-shell-page .portal-module-card,
    body.portal-auth-page .portal-module-card {
        min-height: 118px;
        padding: 0.75rem;
    }

    body.portal-shell-page .portal-module-grid--featured .portal-module-card:nth-child(5) {
        display: none;
    }

    body.portal-shell-page .portal-mobile-dock {
        grid-template-columns: repeat(4, minmax(0, 1fr)) 1.1fr;
    }

    body.portal-shell-page .portal-mobile-dock__more {
        min-width: 0;
    }

    body.portal-shell-page .portal-mobile-dock__more .portal-mobile-sheet {
        left: auto;
        right: 0;
        width: min(92vw, 420px);
    }
}

@media (min-width: 821px) {
    body.portal-shell-page .portal-menu-toggle {
        display: inline-flex;
    }
}

@media (max-width: 560px) {
    body.portal-shell-page .portal-brand__logo-wrap,
    body.portal-auth-page .portal-brand__logo-wrap {
        width: 52px;
        height: 52px;
        border-radius: 18px;
    }

    body.portal-shell-page .portal-brand__title,
    body.portal-auth-page .portal-brand__title {
        font-size: 0.98rem;
    }

    body.portal-shell-page .portal-brand__subline,
    body.portal-auth-page .portal-brand__subline {
        display: none;
    }

    body.portal-shell-page .portal-hero,
    body.portal-auth-page .portal-hero,
    body.portal-shell-page .portal-panel,
    body.portal-auth-page .portal-panel,
    body.portal-shell-page .portal-card,
    body.portal-auth-page .portal-card {
        border-radius: 22px;
    }

    body.portal-shell-page .portal-module-card,
    body.portal-auth-page .portal-module-card {
        min-height: 0;
    }

    body.portal-shell-page .admin-launch-grid,
    body.portal-shell-page .admin-action-grid {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page .admin-summary-grid {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page .admin-action-list {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page .attendance-submission-form__actions,
    body.portal-shell-page .attendance-review-form__actions,
    body.portal-shell-page .attendance-history-toolbar__actions {
        flex-direction: column;
    }

    body.portal-shell-page .attendance-home-actions,
    body.portal-shell-page .attendance-home-secondary-actions,
    body.portal-shell-page .attendance-task-actions,
    body.portal-shell-page .attendance-task-footer {
        gap: 0.65rem;
    }

    body.portal-shell-page .attendance-review-item__top,
    body.portal-shell-page .attendance-review-item__body,
    body.portal-shell-page .attendance-review-item__meta {
        align-items: flex-start;
        flex-direction: column;
    }

    body.portal-shell-page .attendance-submission-form__actions .portal-button,
    body.portal-shell-page .attendance-review-form__actions .portal-button,
    body.portal-shell-page .attendance-history-toolbar__actions .portal-button {
        width: 100%;
    }

    body.portal-shell-page .admin-record__details,
    body.portal-shell-page .admin-kv-grid {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page .admin-filter-grid {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page .admin-permission-grid {
        grid-template-columns: 1fr;
    }

    body.portal-auth-page .portal-summary__row {
        padding: 0.82rem 0.92rem;
    }

    body.portal-shell-page .attendance-home-card,
    body.portal-shell-page .attendance-task-card {
        padding: 1rem;
        border-radius: 18px;
    }

    body.portal-shell-page .attendance-home-button,
    body.portal-shell-page .attendance-home-secondary-button,
    body.portal-shell-page .attendance-task-button,
    body.portal-shell-page .attendance-task-footer__link {
        min-height: 56px;
    }

    body.portal-shell-page .portal-mobile-dock {
        grid-template-columns: repeat(4, minmax(0, 1fr)) 1fr;
    }

    body.portal-shell-page .portal-mobile-dock__label {
        font-size: 0.68rem;
    }

    body.portal-shell-page .portal-mobile-sheet {
        max-height: 62vh;
    }

    body.portal-shell-page .portal-module-page__actions,
    body.portal-auth-page .portal-auth-grid .portal-button {
        width: 100%;
    }

    body.portal-shell-page .portal-module-card,
    body.portal-auth-page .portal-auth-panel,
    body.portal-auth-page .portal-auth-brand {
        min-height: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.portal-shell-page *,
    body.portal-auth-page * {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

body.portal-shell-page.attendance-shell {
    color-scheme: dark;
    --portal-bg: #111111;
    --portal-surface: #1c1c1c;
    --portal-panel-bg: rgba(30, 30, 30, 0.96);
    --portal-panel-border: rgba(255, 255, 255, 0.12);
    --portal-charcoal: #f5f5f5;
    --portal-dark-grey: #d0d3d8;
    --portal-mid-grey: #a3a7ae;
    --portal-light-grey: #7d8188;
    --portal-primary: #552582;
    --portal-primary-deep: #42206a;
    --portal-secondary: #7a5cff;
    --portal-secondary-deep: #5f45d6;
    --portal-emerald: #119b6b;
    --portal-emerald-deep: #0b7f58;
    --portal-warning: #d97a1d;
    --portal-shadow-soft: 0 10px 24px rgba(0, 0, 0, 0.28);
    --portal-shadow-strong: 0 18px 40px rgba(0, 0, 0, 0.36);
}

body.portal-shell-page.attendance-shell,
body.portal-shell-page.attendance-shell::before {
    background:
        radial-gradient(circle at top left, rgba(85, 37, 130, 0.16), transparent 34%),
        radial-gradient(circle at top right, rgba(17, 155, 107, 0.10), transparent 28%),
        linear-gradient(180deg, #121212 0%, #151515 100%);
}

body.portal-shell-page.attendance-shell .portal-app {
    background: transparent;
}

body.portal-shell-page.attendance-shell .portal-topbar {
    background: rgba(20, 20, 20, 0.95);
    border-bottom-color: rgba(255, 255, 255, 0.1);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.04), 0 14px 24px rgba(0, 0, 0, 0.24);
}

body.portal-shell-page.attendance-shell .portal-topbar__inner {
    min-height: 92px;
    gap: 0.85rem;
}

body.portal-shell-page.attendance-shell .portal-brand__title,
body.portal-shell-page.attendance-shell .portal-page-head__title,
body.portal-shell-page.attendance-shell .portal-userbar__name,
body.portal-shell-page.attendance-shell .portal-userbar__business,
body.portal-shell-page.attendance-shell .portal-userbar__role,
body.portal-shell-page.attendance-shell .portal-brand__subline,
body.portal-shell-page.attendance-shell .portal-brand__eyebrow {
    color: #f7f7f7;
}

body.portal-shell-page.attendance-shell .portal-brand__logo-wrap,
body.portal-shell-page.attendance-shell .portal-button,
body.portal-shell-page.attendance-shell .portal-button--ghost,
body.portal-shell-page.attendance-shell .portal-menu-toggle,
body.portal-shell-page.attendance-shell .portal-userbar__logout .portal-button,
body.portal-shell-page.attendance-shell .portal-mobile-dock__item,
body.portal-shell-page.attendance-shell .portal-mobile-sheet__item,
body.portal-shell-page.attendance-shell .portal-form-control,
body.portal-shell-page.attendance-shell textarea,
body.portal-shell-page.attendance-shell select,
body.portal-shell-page.attendance-shell input {
    background-color: rgba(26, 26, 26, 0.96);
    border-color: rgba(255, 255, 255, 0.14);
    color: #f4f4f4;
}

body.portal-shell-page.attendance-shell .portal-content {
    padding-top: 0.85rem;
}

body.portal-shell-page.attendance-shell .portal-panel,
body.portal-shell-page.attendance-shell .portal-card {
    background: rgba(28, 28, 28, 0.96);
    border-color: rgba(255, 255, 255, 0.10);
    box-shadow: var(--portal-shadow-strong);
}

body.portal-shell-page.attendance-shell .portal-alert {
    background: rgba(17, 155, 107, 0.14);
    border-color: rgba(17, 155, 107, 0.22);
    color: #f1f1f1;
}

body.portal-shell-page.attendance-shell .attendance-page {
    gap: 1rem;
}

body.portal-shell-page.attendance-shell .attendance-home-shell,
body.portal-shell-page.attendance-shell .attendance-task-card,
body.portal-shell-page.attendance-shell .attendance-history-panel,
body.portal-shell-page.attendance-shell .attendance-history-hero,
body.portal-shell-page.attendance-shell .attendance-review-queue,
body.portal-shell-page.attendance-shell .attendance-review-detail,
body.portal-shell-page.attendance-shell .admin-detail-card {
    background: rgba(28, 28, 28, 0.96);
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: var(--portal-shadow-strong);
}

body.portal-shell-page.attendance-shell .attendance-home-shell {
    display: grid;
    gap: 1rem;
    max-width: 1040px;
    margin: 0 auto;
    padding: 1rem;
}

body.portal-shell-page.attendance-shell .attendance-home-hero {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    padding-bottom: 0.35rem;
}

body.portal-shell-page.attendance-shell .attendance-home-eyebrow,
body.portal-shell-page.attendance-shell .attendance-history-hero__eyebrow,
body.portal-shell-page.attendance-shell .attendance-task-card__eyebrow,
body.portal-shell-page.attendance-shell .attendance-home-card__eyebrow,
body.portal-shell-page.attendance-shell .portal-panel__eyebrow {
    margin: 0;
    font-size: 0.74rem;
    font-weight: 900;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #c1c4ca;
}

body.portal-shell-page.attendance-shell .attendance-home-date,
body.portal-shell-page.attendance-shell .attendance-history-hero__title,
body.portal-shell-page.attendance-shell .attendance-task-card__title {
    color: #f7f7f7;
    font-weight: 900;
    letter-spacing: -0.03em;
}

body.portal-shell-page.attendance-shell .attendance-home-meta,
body.portal-shell-page.attendance-shell .attendance-history-hero__meta,
body.portal-shell-page.attendance-shell .attendance-task-card__meta {
    color: #c8cbd0;
    line-height: 1.5;
}

body.portal-shell-page.attendance-shell .attendance-home-clock {
    display: grid;
    gap: 0.12rem;
    padding: 0.7rem 0.9rem;
    min-width: 120px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 16px;
    background: rgba(18, 18, 18, 0.92);
    text-align: right;
}

body.portal-shell-page.attendance-shell .attendance-home-clock strong {
    font-size: 1rem;
    font-weight: 900;
    color: #fff;
}

body.portal-shell-page.attendance-shell .attendance-home-clock span {
    font-size: 0.82rem;
    color: #c4c7cd;
}

body.portal-shell-page.attendance-shell .attendance-home-grid {
    display: grid;
    gap: 0.9rem;
    grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.88fr);
}

body.portal-shell-page.attendance-shell .attendance-home-card {
    display: grid;
    gap: 0.95rem;
    padding: 1rem;
    border-radius: 22px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(32, 32, 32, 0.96);
    box-shadow: var(--portal-shadow-strong);
}

body.portal-shell-page.attendance-shell .attendance-home-card__head,
body.portal-shell-page.attendance-shell .attendance-task-status-card__head,
body.portal-shell-page.attendance-shell .attendance-review-detail__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

body.portal-shell-page.attendance-shell .attendance-state-chip,
body.portal-shell-page.attendance-shell .attendance-review-item__pill,
body.portal-shell-page.attendance-shell .attendance-status-pill,
body.portal-shell-page.attendance-shell .admin-pill,
body.portal-shell-page.attendance-shell .admin-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 0.25rem 0.7rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    color: #f3f4f6;
    font-size: 0.76rem;
    font-weight: 900;
}

body.portal-shell-page.attendance-shell .attendance-state-chip--neutral {
    background: rgba(211, 171, 112, 0.14);
    color: #ffddb0;
}

body.portal-shell-page.attendance-shell .attendance-state-chip--blue {
    background: rgba(43, 108, 176, 0.16);
    color: #d4e4fb;
}

body.portal-shell-page.attendance-shell .attendance-state-chip--green {
    background: rgba(17, 155, 107, 0.18);
    color: #d8f4e8;
}

body.portal-shell-page.attendance-shell .attendance-state-chip--slate {
    background: rgba(255, 255, 255, 0.08);
    color: #e8eaee;
}

body.portal-shell-page.attendance-shell .attendance-task-status-card[data-gps-visual-state="success"] {
    background: rgba(15, 163, 107, 0.12);
    border-color: rgba(15, 163, 107, 0.38);
}

body.portal-shell-page.attendance-shell .attendance-task-status-card[data-gps-visual-state="success"] .attendance-state-chip {
    background: rgba(15, 163, 107, 0.22);
    color: #d9f6e8;
}

body.portal-shell-page.attendance-shell .attendance-task-status-card[data-gps-visual-state="failure"] {
    background: rgba(117, 38, 52, 0.2);
    border-color: rgba(177, 72, 88, 0.48);
}

body.portal-shell-page.attendance-shell .attendance-task-status-card[data-gps-visual-state="failure"] .attendance-state-chip {
    background: rgba(147, 48, 63, 0.3);
    color: #ffd9df;
}

body.portal-shell-page.attendance-shell .attendance-success-modal {
    width: min(440px, calc(100vw - 32px));
    margin: auto;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 20px;
    color: #f7f7f7;
    background: #232323;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.42);
}

body.portal-shell-page.attendance-shell .attendance-success-modal::backdrop {
    background: rgba(15, 18, 25, 0.68);
}

body.portal-shell-page.attendance-shell .attendance-success-modal__frame {
    display: grid;
    gap: 1rem;
    padding: 1.3rem;
}

body.portal-shell-page.attendance-shell .attendance-success-modal__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

body.portal-shell-page.attendance-shell .attendance-success-modal__head h2 {
    margin: 0.22rem 0 0;
    font-size: 1.28rem;
    color: #fff;
}

body.portal-shell-page.attendance-shell .attendance-success-modal__frame > p {
    margin: 0;
    color: #d2d5d9;
}

body.portal-shell-page.attendance-shell .attendance-success-modal__close {
    width: 36px;
    height: 36px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 50%;
    color: #f5f5f5;
    background: rgba(255, 255, 255, 0.06);
    font-size: 1.45rem;
    line-height: 1;
}

body.portal-shell-page.attendance-shell .attendance-success-modal__actions {
    display: flex;
    justify-content: flex-end;
}

body.portal-shell-page.attendance-shell .attendance-home-status-title,
body.portal-shell-page.attendance-shell .attendance-history-card strong,
body.portal-shell-page.attendance-shell .attendance-history-table td strong,
body.portal-shell-page.attendance-shell .attendance-review-card dd,
body.portal-shell-page.attendance-shell .attendance-review-detail__header h3,
body.portal-shell-page.attendance-shell .attendance-task-status-card strong {
    color: #fff;
}

body.portal-shell-page.attendance-shell .attendance-home-status-note,
body.portal-shell-page.attendance-shell .attendance-home-note,
body.portal-shell-page.attendance-shell .attendance-task-status-card__note,
body.portal-shell-page.attendance-shell .attendance-empty-state,
body.portal-shell-page.attendance-shell .attendance-history-hero__meta,
body.portal-shell-page.attendance-shell .attendance-home-recent__meta small,
body.portal-shell-page.attendance-shell .attendance-home-recent__main span,
body.portal-shell-page.attendance-shell .attendance-history-table td p,
body.portal-shell-page.attendance-shell .attendance-history-card p,
body.portal-shell-page.attendance-shell .attendance-review-card dt,
body.portal-shell-page.attendance-shell .attendance-review-card h4,
body.portal-shell-page.attendance-shell .attendance-review-item__body span,
body.portal-shell-page.attendance-shell .attendance-review-item__body small,
body.portal-shell-page.attendance-shell .attendance-review-item__meta span,
body.portal-shell-page.attendance-shell .attendance-home-meta,
body.portal-shell-page.attendance-shell .attendance-task-card__meta,
body.portal-shell-page.attendance-shell .admin-kv__label,
body.portal-shell-page.attendance-shell .admin-field__label,
body.portal-shell-page.attendance-shell .admin-field__value,
body.portal-shell-page.attendance-shell .admin-record__header p,
body.portal-shell-page.attendance-shell .admin-record-card__header p {
    color: #c7cbd1;
}

body.portal-shell-page.attendance-shell .attendance-home-status-meta,
body.portal-shell-page.attendance-shell .attendance-home-activity-grid {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.portal-shell-page.attendance-shell .attendance-home-status-meta span,
body.portal-shell-page.attendance-shell .attendance-home-activity-grid > div {
    display: grid;
    gap: 0.22rem;
    padding: 0.8rem 0.85rem;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

body.portal-shell-page.attendance-shell .attendance-home-status-meta strong,
body.portal-shell-page.attendance-shell .attendance-home-activity-label,
body.portal-shell-page.attendance-shell .attendance-home-recent__main strong {
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #c4c8cf;
}

body.portal-shell-page.attendance-shell .attendance-home-status-meta small,
body.portal-shell-page.attendance-shell .attendance-home-activity-grid strong,
body.portal-shell-page.attendance-shell .attendance-home-recent__meta span {
    font-size: 1rem;
    font-weight: 900;
    color: #fff;
}

body.portal-shell-page.attendance-shell .attendance-home-actions {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page.attendance-shell .attendance-home-actions--single {
    grid-template-columns: 1fr;
}

body.portal-shell-page.attendance-shell .attendance-home-button {
    min-height: 58px;
    border-radius: 16px;
    font-size: 1rem;
    font-weight: 900;
    color: #fff;
    box-shadow: none;
}

body.portal-shell-page.attendance-shell .attendance-home-button--entry,
body.portal-shell-page.attendance-shell .attendance-task-button--entry {
    background: #119b6b;
    border-color: #119b6b;
}

body.portal-shell-page.attendance-shell .attendance-home-button--entry:hover,
body.portal-shell-page.attendance-shell .attendance-task-button--entry:hover {
    background: #0b7f58;
    border-color: #0b7f58;
}

body.portal-shell-page.attendance-shell .attendance-home-button--exit,
body.portal-shell-page.attendance-shell .attendance-task-button--exit {
    background: #5b2a86;
    border-color: #5b2a86;
}

body.portal-shell-page.attendance-shell .attendance-home-button--exit:hover,
body.portal-shell-page.attendance-shell .attendance-task-button--exit:hover {
    background: #45206a;
    border-color: #45206a;
}

body.portal-shell-page.attendance-shell .attendance-home-button--secondary,
body.portal-shell-page.attendance-shell .attendance-task-button--secondary,
body.portal-shell-page.attendance-shell .attendance-task-button--cancel,
body.portal-shell-page.attendance-shell .attendance-home-secondary-button,
body.portal-shell-page.attendance-shell .attendance-task-button--compact {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.18);
    color: #f5f5f5;
}

body.portal-shell-page.attendance-shell .attendance-home-button--history {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.12);
    color: #fff;
}

body.portal-shell-page.attendance-shell .attendance-home-note {
    font-size: 0.92rem;
}

body.portal-shell-page.attendance-shell .attendance-home-recent {
    display: grid;
    gap: 0.85rem;
    padding: 1rem;
    border-radius: 22px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(28, 28, 28, 0.96);
}

body.portal-shell-page.attendance-shell .attendance-home-recent__summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    cursor: pointer;
    list-style: none;
}

body.portal-shell-page.attendance-shell .attendance-home-recent__summary::-webkit-details-marker {
    display: none;
}

body.portal-shell-page.attendance-shell .attendance-home-recent__summary strong {
    display: block;
    font-size: 1rem;
    font-weight: 900;
    color: #fff;
}

body.portal-shell-page.attendance-shell .attendance-home-recent__summary small {
    display: block;
    margin-top: 0.15rem;
    font-size: 0.85rem;
    color: #c7cbd1;
}

body.portal-shell-page.attendance-shell .attendance-home-recent__chevron {
    color: #d9dbe0;
    font-size: 1.1rem;
}

body.portal-shell-page.attendance-shell .attendance-home-recent[open] .attendance-home-recent__chevron {
    transform: rotate(180deg);
}

body.portal-shell-page.attendance-shell .attendance-home-recent__list {
    display: grid;
    gap: 0.7rem;
}

body.portal-shell-page.attendance-shell .attendance-home-recent__item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    padding: 0.85rem 0.9rem;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

body.portal-shell-page.attendance-shell .attendance-home-recent__main,
body.portal-shell-page.attendance-shell .attendance-home-recent__meta {
    display: grid;
    gap: 0.16rem;
}

body.portal-shell-page.attendance-shell .attendance-home-secondary-actions {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page.attendance-shell .attendance-home-secondary-button--admin {
    background: rgba(91, 42, 134, 0.16);
    border-color: rgba(91, 42, 134, 0.28);
    color: #f1e8ff;
}

body.portal-shell-page.attendance-shell .attendance-task-page,
body.portal-shell-page.attendance-shell .attendance-history-page {
    max-width: 1040px;
    margin: 0 auto;
}

body.portal-shell-page.attendance-shell .attendance-task-card {
    max-width: 760px;
    margin: 0 auto;
    padding: 1.3rem;
}

body.portal-shell-page.attendance-shell .attendance-task-card__back {
    display: inline-flex;
    width: fit-content;
    color: #d9dbe0;
    font-size: 0.9rem;
    font-weight: 800;
}

body.portal-shell-page.attendance-shell .attendance-task-card__header {
    display: grid;
    gap: 0.32rem;
}

body.portal-shell-page.attendance-shell .attendance-task-form {
    display: grid;
    gap: 1rem;
}

body.portal-shell-page.attendance-shell .attendance-task-field {
    display: grid;
    gap: 0.45rem;
}

body.portal-shell-page.attendance-shell .attendance-task-status-card {
    display: grid;
    gap: 0.6rem;
    padding: 0.95rem 1rem;
    border-radius: 18px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.04);
}

body.portal-shell-page.attendance-shell .attendance-task-status-card__label,
body.portal-shell-page.attendance-shell .attendance-history-card__label {
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #c4c8cf;
}

body.portal-shell-page.attendance-shell .attendance-task-textarea,
body.portal-shell-page.attendance-shell .portal-form-control {
    min-height: 50px;
    border-radius: 14px;
    background: rgba(12, 12, 12, 0.96);
}

body.portal-shell-page.attendance-shell .attendance-task-textarea {
    width: 100%;
    min-height: 118px;
    padding: 0.85rem 0.95rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    color: #f5f5f5;
    resize: vertical;
}

body.portal-shell-page.attendance-shell .attendance-task-confirmation {
    padding: 0.9rem 1rem;
    border-radius: 18px;
    background: rgba(17, 155, 107, 0.12);
    border: 1px solid rgba(17, 155, 107, 0.22);
    color: #e7fff5;
}

body.portal-shell-page.attendance-shell .attendance-task-actions {
    display: grid;
    gap: 0.7rem;
    grid-template-columns: minmax(0, 1fr) minmax(0, auto) minmax(0, auto);
    align-items: center;
}

body.portal-shell-page.attendance-shell .attendance-task-button {
    min-height: 56px;
    border-radius: 16px;
    font-size: 1rem;
    font-weight: 900;
    justify-content: center;
}

body.portal-shell-page.attendance-shell .attendance-task-button--primary {
    min-width: 180px;
    color: #fff;
}

body.portal-shell-page.attendance-shell .attendance-task-button--compact {
    min-height: 44px;
    padding-inline: 0.85rem;
    justify-self: start;
}

body.portal-shell-page.attendance-shell .attendance-history-hero {
    display: grid;
    gap: 0.85rem;
    padding: 1rem;
}

body.portal-shell-page.attendance-shell .attendance-history-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    justify-content: flex-end;
    gap: 0.75rem;
}

body.portal-shell-page.attendance-shell .attendance-history-toolbar__field {
    display: grid;
    gap: 0.35rem;
    min-width: 215px;
}

body.portal-shell-page.attendance-shell .attendance-history-summary {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.portal-shell-page.attendance-shell .attendance-history-summary__card {
    display: grid;
    gap: 0.2rem;
    padding: 0.95rem 1rem;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

body.portal-shell-page.attendance-shell .attendance-history-summary__card span {
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #c4c8cf;
}

body.portal-shell-page.attendance-shell .attendance-history-summary__card strong {
    color: #fff;
    font-size: 1.4rem;
    font-weight: 900;
}

body.portal-shell-page.attendance-shell .attendance-history-table-wrap {
    overflow: auto;
}

body.portal-shell-page.attendance-shell .attendance-history-table {
    width: 100%;
    border-collapse: collapse;
}

body.portal-shell-page.attendance-shell .attendance-history-table th,
body.portal-shell-page.attendance-shell .attendance-history-table td {
    padding: 0.85rem 0.8rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    text-align: left;
    vertical-align: top;
}

body.portal-shell-page.attendance-shell .attendance-history-table th {
    font-size: 0.72rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #aeb2b9;
}

body.portal-shell-page.attendance-shell .attendance-history-card-list {
    display: none;
    gap: 0.75rem;
}

body.portal-shell-page.attendance-shell .attendance-history-card {
    display: grid;
    gap: 0.75rem;
    padding: 0.95rem;
    border-radius: 18px;
    border: 1px solid rgba(255, 255, 255, 0.10);
    background: rgba(255, 255, 255, 0.04);
}

body.portal-shell-page.attendance-shell .attendance-history-card__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

body.portal-shell-page.attendance-shell .attendance-history-card__grid {
    display: grid;
    gap: 0.65rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page.attendance-shell .attendance-history-card__full {
    grid-column: 1 / -1;
}

body.portal-shell-page.attendance-shell .attendance-review-grid {
    display: grid;
    gap: 0.9rem;
    grid-template-columns: minmax(300px, 0.85fr) minmax(0, 1.15fr);
}

body.portal-shell-page.attendance-shell .attendance-review-queue,
body.portal-shell-page.attendance-shell .attendance-review-detail {
    display: grid;
    gap: 0.85rem;
    padding: 1rem;
}

body.portal-shell-page.attendance-shell .attendance-review-item {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.10);
    color: #f5f5f5;
}

body.portal-shell-page.attendance-shell .attendance-review-item.is-active {
    background: linear-gradient(180deg, rgba(91, 42, 134, 0.16), rgba(255, 255, 255, 0.04));
    border-color: rgba(91, 42, 134, 0.3);
}

body.portal-shell-page.attendance-shell .attendance-review-detail__grid {
    display: grid;
    gap: 0.8rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page.attendance-shell .attendance-review-card,
body.portal-shell-page.attendance-shell .attendance-review-item {
    border-radius: 18px;
    box-shadow: none;
}

body.portal-shell-page.attendance-shell .attendance-review-card {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.10);
    padding: 0.9rem;
}

body.portal-shell-page.attendance-shell .attendance-review-form {
    display: grid;
    gap: 0.85rem;
}

body.portal-shell-page.attendance-shell .attendance-review-form__grid {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page.attendance-shell .attendance-review-form__field--full {
    grid-column: 1 / -1;
}

body.portal-shell-page.attendance-shell .attendance-review-form__actions {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

body.portal-shell-page.attendance-shell .admin-summary-grid--attendance,
body.portal-shell-page.attendance-shell .admin-summary-grid--security {
    gap: 0.9rem;
}

body.portal-shell-page.attendance-shell .admin-summary-card {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.10);
}

body.portal-shell-page.attendance-shell .admin-kv-grid,
body.portal-shell-page.attendance-shell .admin-record__details {
    gap: 0.8rem;
    color: #f5f5f5;
}

body.portal-shell-page.attendance-shell .admin-detail-card,
body.portal-shell-page.attendance-shell .admin-filter-panel,
body.portal-shell-page.attendance-shell .admin-record-card,
body.portal-shell-page.attendance-shell .admin-summary-card {
    background: rgba(28, 28, 28, 0.96);
    border-color: rgba(255, 255, 255, 0.10);
}

body.portal-shell-page.attendance-shell .portal-mobile-dock {
    background: rgba(16, 16, 16, 0.96);
    border-top-color: rgba(255, 255, 255, 0.10);
}

body.portal-shell-page.attendance-shell .portal-mobile-dock__item,
body.portal-shell-page.attendance-shell .portal-mobile-sheet {
    background: rgba(20, 20, 20, 0.98);
    border-color: rgba(255, 255, 255, 0.12);
}

@media (max-width: 1080px) {
    body.portal-shell-page.attendance-shell .attendance-home-grid,
    body.portal-shell-page.attendance-shell .attendance-review-grid {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page.attendance-shell .attendance-home-status-meta,
    body.portal-shell-page.attendance-shell .attendance-home-activity-grid,
    body.portal-shell-page.attendance-shell .attendance-history-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    body.portal-shell-page.attendance-shell .portal-topbar__inner {
        min-height: 82px;
        gap: 0.65rem;
    }

    body.portal-shell-page.attendance-shell .attendance-home-shell,
    body.portal-shell-page.attendance-shell .attendance-task-card,
    body.portal-shell-page.attendance-shell .attendance-history-hero,
    body.portal-shell-page.attendance-shell .attendance-history-panel,
    body.portal-shell-page.attendance-shell .attendance-review-queue,
    body.portal-shell-page.attendance-shell .attendance-review-detail,
    body.portal-shell-page.attendance-shell .admin-detail-card {
        padding: 0.9rem;
        border-radius: 18px;
    }

    body.portal-shell-page.attendance-shell .attendance-home-hero,
    body.portal-shell-page.attendance-shell .attendance-task-card__header,
    body.portal-shell-page.attendance-shell .attendance-history-hero {
        align-items: flex-start;
        flex-direction: column;
    }

    body.portal-shell-page.attendance-shell .attendance-home-clock {
        width: 100%;
        text-align: left;
    }

    body.portal-shell-page.attendance-shell .attendance-home-grid,
    body.portal-shell-page.attendance-shell .attendance-home-status-meta,
    body.portal-shell-page.attendance-shell .attendance-home-activity-grid,
    body.portal-shell-page.attendance-shell .attendance-home-actions,
    body.portal-shell-page.attendance-shell .attendance-home-secondary-actions,
    body.portal-shell-page.attendance-shell .attendance-history-summary,
    body.portal-shell-page.attendance-shell .attendance-review-detail__grid,
    body.portal-shell-page.attendance-shell .attendance-review-form__grid,
    body.portal-shell-page.attendance-shell .attendance-task-actions {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page.attendance-shell .attendance-task-actions {
        align-items: stretch;
    }

    body.portal-shell-page.attendance-shell .attendance-task-button--primary {
        min-width: 0;
    }

    body.portal-shell-page.attendance-shell .attendance-history-card-list {
        display: grid;
    }

    body.portal-shell-page.attendance-shell .attendance-history-table-wrap {
        display: none;
    }

    body.portal-shell-page.attendance-shell .attendance-task-button--compact {
        width: fit-content;
    }
}

/* Attendance UX correction: clear GPS feedback and readable, evidence-led history. */
body.portal-shell-page.attendance-shell .attendance-task-status-card[data-gps-visual-state="success"] {
    background: #e4f7ee;
    border-color: rgba(15, 163, 107, 0.42);
}

body.portal-shell-page.attendance-shell .attendance-task-status-card[data-gps-visual-state="success"] strong,
body.portal-shell-page.attendance-shell .attendance-task-status-card[data-gps-visual-state="success"] .attendance-task-status-card__note {
    color: #075d3d;
}

body.portal-shell-page.attendance-shell .attendance-task-status-card[data-gps-visual-state="success"] .attendance-state-chip {
    background: #0fa36b;
    color: #fff;
}

body.portal-shell-page.attendance-shell .attendance-task-status-card[data-gps-visual-state="failure"] {
    background: #f9ebed;
    border-color: rgba(132, 43, 58, 0.42);
}

body.portal-shell-page.attendance-shell .attendance-task-status-card[data-gps-visual-state="failure"] strong,
body.portal-shell-page.attendance-shell .attendance-task-status-card[data-gps-visual-state="failure"] .attendance-task-status-card__note {
    color: #752634;
}

body.portal-shell-page.attendance-shell .attendance-task-status-card[data-gps-visual-state="failure"] .attendance-state-chip {
    background: #8a303f;
    color: #fff;
}

body.portal-shell-page.attendance-shell .attendance-success-modal {
    border-color: #d7dfef;
    color: #263852;
    background: #fff;
    box-shadow: 0 24px 70px rgba(23, 36, 74, 0.25);
}

body.portal-shell-page.attendance-shell .attendance-success-modal__head h2 {
    color: #263852;
}

body.portal-shell-page.attendance-shell .attendance-success-modal__frame > p {
    color: #52627b;
}

body.portal-shell-page.attendance-shell .attendance-success-modal__close {
    border-color: #d7dfef;
    color: #455b79;
    background: #f0f4fa;
}

body.portal-shell-page.attendance-shell .attendance-history-table th {
    color: #f4f6f9;
}

body.portal-shell-page.attendance-shell .attendance-history-table td {
    color: #f8fafc;
}

body.portal-shell-page.attendance-shell .attendance-history-table td strong,
body.portal-shell-page.attendance-shell .attendance-history-card strong {
    color: #fff;
}

body.portal-shell-page.attendance-shell .attendance-history-table td p,
body.portal-shell-page.attendance-shell .attendance-history-card p {
    color: #d7dce4;
}

body.portal-shell-page.attendance-shell .attendance-history-table td:first-child strong,
body.portal-shell-page.attendance-shell .attendance-history-card__head h3 {
    font-size: 1.08rem;
    letter-spacing: -0.015em;
}

body.portal-shell-page.attendance-shell .attendance-history-table td:first-child p,
body.portal-shell-page.attendance-shell .attendance-history-card__head p {
    margin-top: 0.2rem;
    color: #c9d0da;
    font-size: 0.8rem;
}

body.portal-shell-page.attendance-shell .attendance-history-card {
    background: rgba(255, 255, 255, 0.065);
    border-color: rgba(255, 255, 255, 0.16);
}

body.portal-shell-page.attendance-shell .portal-brand__logo-wrap {
    background: #ffffff !important;
    border-color: rgba(91, 42, 134, 0.14) !important;
    color: #111827 !important;
}

body.portal-shell-page.attendance-shell .attendance-history-toolbar__button--load {
    background: #5b2a86 !important;
    background-image: none !important;
    border-color: #5b2a86 !important;
    color: #ffffff !important;
    box-shadow: 0 14px 30px rgba(91, 42, 134, 0.18) !important;
}

body.portal-shell-page.attendance-shell .attendance-history-toolbar__button--load:hover {
    background: #45206a !important;
    background-image: none !important;
    border-color: #45206a !important;
    color: #ffffff !important;
}

body.portal-shell-page.attendance-shell {
    color-scheme: light;
    --portal-bg: #f4f7fb;
    --portal-surface: #ffffff;
    --portal-panel-bg: #ffffff;
    --portal-panel-border: #d9e1eb;
    --portal-charcoal: #131722;
    --portal-dark-grey: #3b4252;
    --portal-mid-grey: #667085;
    --portal-light-grey: #8a93a3;
    --portal-primary: #5b2a86;
    --portal-primary-deep: #45206a;
    --portal-secondary: #119b6b;
    --portal-secondary-deep: #0b7f58;
    --portal-emerald: #119b6b;
    --portal-emerald-deep: #0b7f58;
    --portal-warning: #d97a1d;
    --portal-shadow-soft: 0 10px 24px rgba(18, 24, 38, 0.08);
    --portal-shadow-strong: 0 18px 36px rgba(18, 24, 38, 0.10);
}

body.portal-shell-page.attendance-shell,
body.portal-shell-page.attendance-shell::before {
    background:
        radial-gradient(circle at top left, rgba(91, 42, 134, 0.08), transparent 36%),
        radial-gradient(circle at top right, rgba(17, 155, 107, 0.08), transparent 28%),
        linear-gradient(180deg, #f7f9fc 0%, #eef3f9 100%);
}

body.portal-shell-page.attendance-shell .portal-app {
    background: transparent;
}

body.portal-shell-page.attendance-shell .portal-topbar {
    background: rgba(255, 255, 255, 0.96);
    border-bottom-color: rgba(16, 24, 40, 0.08);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.9), 0 14px 24px rgba(18, 24, 38, 0.06);
}

body.portal-shell-page.attendance-shell .portal-brand__title,
body.portal-shell-page.attendance-shell .portal-page-head__title,
body.portal-shell-page.attendance-shell .portal-userbar__name,
body.portal-shell-page.attendance-shell .portal-userbar__business,
body.portal-shell-page.attendance-shell .portal-userbar__role,
body.portal-shell-page.attendance-shell .portal-brand__subline,
body.portal-shell-page.attendance-shell .portal-brand__eyebrow {
    color: #111827;
}

body.portal-shell-page.attendance-shell .portal-button,
body.portal-shell-page.attendance-shell .portal-button--ghost,
body.portal-shell-page.attendance-shell .portal-menu-toggle,
body.portal-shell-page.attendance-shell .portal-userbar__logout .portal-button,
body.portal-shell-page.attendance-shell .portal-mobile-dock__item,
body.portal-shell-page.attendance-shell .portal-mobile-sheet__item,
body.portal-shell-page.attendance-shell .portal-form-control,
body.portal-shell-page.attendance-shell textarea,
body.portal-shell-page.attendance-shell select,
body.portal-shell-page.attendance-shell input {
    background-color: #ffffff;
    border-color: #d8dfeb;
    color: #111827;
}

body.portal-shell-page.attendance-shell .portal-content {
    padding-top: 0.85rem;
}

body.portal-shell-page.attendance-shell .portal-panel,
body.portal-shell-page.attendance-shell .portal-card,
body.portal-shell-page.attendance-shell .attendance-home-shell,
body.portal-shell-page.attendance-shell .attendance-task-card,
body.portal-shell-page.attendance-shell .attendance-history-panel,
body.portal-shell-page.attendance-shell .attendance-history-hero,
body.portal-shell-page.attendance-shell .attendance-review-queue,
body.portal-shell-page.attendance-shell .attendance-review-detail,
body.portal-shell-page.attendance-shell .admin-detail-card,
body.portal-shell-page.attendance-shell .admin-summary-card,
body.portal-shell-page.attendance-shell .admin-filter-panel,
body.portal-shell-page.attendance-shell .admin-record-card {
    background: #ffffff;
    border-color: #dce4ee;
    box-shadow: var(--portal-shadow-strong);
}

body.portal-shell-page.attendance-shell .attendance-page {
    gap: 1rem;
}

body.portal-shell-page.attendance-shell .attendance-home-shell {
    display: grid;
    gap: 1rem;
    max-width: 980px;
    margin: 0 auto;
    padding: 1rem;
}

body.portal-shell-page.attendance-shell .attendance-home-hero {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    padding-bottom: 0.25rem;
}

body.portal-shell-page.attendance-shell .attendance-home-eyebrow,
body.portal-shell-page.attendance-shell .attendance-history-hero__eyebrow,
body.portal-shell-page.attendance-shell .attendance-task-card__eyebrow,
body.portal-shell-page.attendance-shell .attendance-home-card__eyebrow,
body.portal-shell-page.attendance-shell .portal-panel__eyebrow {
    margin: 0;
    font-size: 0.74rem;
    font-weight: 900;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #7c8494;
}

body.portal-shell-page.attendance-shell .attendance-home-date,
body.portal-shell-page.attendance-shell .attendance-history-hero__title,
body.portal-shell-page.attendance-shell .attendance-task-card__title {
    color: #111827;
    font-weight: 900;
    letter-spacing: -0.03em;
}

body.portal-shell-page.attendance-shell .attendance-home-meta,
body.portal-shell-page.attendance-shell .attendance-history-hero__meta,
body.portal-shell-page.attendance-shell .attendance-task-card__meta,
body.portal-shell-page.attendance-shell .attendance-home-note,
body.portal-shell-page.attendance-shell .attendance-task-status-card__note,
body.portal-shell-page.attendance-shell .attendance-empty-state,
body.portal-shell-page.attendance-shell .attendance-review-card dt,
body.portal-shell-page.attendance-shell .attendance-review-item__body small,
body.portal-shell-page.attendance-shell .attendance-review-item__meta span,
body.portal-shell-page.attendance-shell .admin-kv__label,
body.portal-shell-page.attendance-shell .admin-field__label,
body.portal-shell-page.attendance-shell .admin-record__header p,
body.portal-shell-page.attendance-shell .admin-record-card__header p {
    color: #5f697a;
}

body.portal-shell-page.attendance-shell .attendance-home-clock {
    display: grid;
    gap: 0.12rem;
    padding: 0.7rem 0.9rem;
    min-width: 120px;
    border: 1px solid #d8dfeb;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.92);
    text-align: right;
}

body.portal-shell-page.attendance-shell .attendance-home-clock strong {
    font-size: 1rem;
    font-weight: 900;
    color: #111827;
}

body.portal-shell-page.attendance-shell .attendance-home-clock span {
    font-size: 0.82rem;
    color: #667085;
}

body.portal-shell-page.attendance-shell .attendance-home-intro {
    display: grid;
    gap: 0.85rem;
    padding: 1rem;
    border-radius: 22px;
    border: 1px solid #dde5ef;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
}

body.portal-shell-page.attendance-shell .attendance-home-intro__actions {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page.attendance-shell .attendance-home-button,
body.portal-shell-page.attendance-shell .attendance-task-button {
    min-height: 58px;
    border-radius: 16px;
    font-size: 1rem;
    font-weight: 900;
    color: #fff;
    box-shadow: none;
    justify-content: center;
}

body.portal-shell-page.attendance-shell .attendance-home-button--entry,
body.portal-shell-page.attendance-shell .attendance-task-button--entry {
    background: #119b6b;
    border-color: #119b6b;
}

body.portal-shell-page.attendance-shell .attendance-home-button--entry:hover,
body.portal-shell-page.attendance-shell .attendance-task-button--entry:hover {
    background: #0b7f58;
    border-color: #0b7f58;
}

body.portal-shell-page.attendance-shell .attendance-home-button--exit,
body.portal-shell-page.attendance-shell .attendance-task-button--exit {
    background: #5b2a86;
    border-color: #5b2a86;
}

body.portal-shell-page.attendance-shell .attendance-home-button--exit:hover,
body.portal-shell-page.attendance-shell .attendance-task-button--exit:hover {
    background: #45206a;
    border-color: #45206a;
}

body.portal-shell-page.attendance-shell .attendance-home-button--secondary,
body.portal-shell-page.attendance-shell .attendance-task-button--secondary,
body.portal-shell-page.attendance-shell .attendance-task-button--cancel,
body.portal-shell-page.attendance-shell .attendance-home-secondary-button,
body.portal-shell-page.attendance-shell .attendance-task-button--compact,
body.portal-shell-page.attendance-shell .attendance-home-button--history {
    background: #ffffff;
    border-color: #d6deea;
    color: #344054;
}

body.portal-shell-page.attendance-shell .attendance-home-note {
    margin: 0;
    font-size: 0.94rem;
    color: #5f697a;
}

body.portal-shell-page.attendance-shell .attendance-home-recent {
    display: grid;
    gap: 0.85rem;
    padding: 1rem;
    border-radius: 22px;
    border: 1px solid #dde5ef;
    background: #ffffff;
}

body.portal-shell-page.attendance-shell .attendance-home-recent__summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    cursor: pointer;
    list-style: none;
}

body.portal-shell-page.attendance-shell .attendance-home-recent__summary::-webkit-details-marker {
    display: none;
}

body.portal-shell-page.attendance-shell .attendance-home-recent__summary strong {
    display: block;
    font-size: 1rem;
    font-weight: 900;
    color: #111827;
}

body.portal-shell-page.attendance-shell .attendance-home-recent__summary small {
    display: block;
    margin-top: 0.15rem;
    font-size: 0.85rem;
    color: #667085;
}

body.portal-shell-page.attendance-shell .attendance-home-recent__chevron {
    color: #7c8494;
    font-size: 1.1rem;
}

body.portal-shell-page.attendance-shell .attendance-home-recent[open] .attendance-home-recent__chevron {
    transform: rotate(180deg);
}

body.portal-shell-page.attendance-shell .attendance-home-recent__list {
    display: grid;
    gap: 0.7rem;
}

body.portal-shell-page.attendance-shell .attendance-home-recent__item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    padding: 0.85rem 0.9rem;
    border-radius: 18px;
    background: #f8fbff;
    border: 1px solid #e4ebf5;
}

body.portal-shell-page.attendance-shell .attendance-home-recent__main,
body.portal-shell-page.attendance-shell .attendance-home-recent__meta {
    display: grid;
    gap: 0.16rem;
}

body.portal-shell-page.attendance-shell .attendance-home-recent__main strong,
body.portal-shell-page.attendance-shell .attendance-home-recent__meta span {
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #667085;
}

body.portal-shell-page.attendance-shell .attendance-home-recent__meta small {
    color: #111827;
}

body.portal-shell-page.attendance-shell .attendance-home-secondary-actions {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page.attendance-shell .attendance-home-secondary-button--admin {
    background: rgba(91, 42, 134, 0.08);
    border-color: rgba(91, 42, 134, 0.18);
    color: #5b2a86;
}

body.portal-shell-page.attendance-shell .attendance-task-page,
body.portal-shell-page.attendance-shell .attendance-history-page {
    max-width: 1040px;
    margin: 0 auto;
}

body.portal-shell-page.attendance-shell .attendance-task-card {
    max-width: 760px;
    margin: 0 auto;
    padding: 1.3rem;
}

body.portal-shell-page.attendance-shell .attendance-task-card__back {
    display: inline-flex;
    width: fit-content;
    color: #5f697a;
    font-size: 0.9rem;
    font-weight: 800;
}

body.portal-shell-page.attendance-shell .attendance-task-card__header {
    display: grid;
    gap: 0.32rem;
}

body.portal-shell-page.attendance-shell .attendance-task-form {
    display: grid;
    gap: 1rem;
}

body.portal-shell-page.attendance-shell .attendance-task-field {
    display: grid;
    gap: 0.45rem;
}

body.portal-shell-page.attendance-shell .attendance-task-status-card {
    display: grid;
    gap: 0.6rem;
    padding: 0.95rem 1rem;
    border-radius: 18px;
    border: 1px solid #dde5ef;
    background: #f8fbff;
}

body.portal-shell-page.attendance-shell .attendance-task-status-card__label,
body.portal-shell-page.attendance-shell .attendance-history-card__label {
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #7c8494;
}

body.portal-shell-page.attendance-shell .attendance-task-textarea,
body.portal-shell-page.attendance-shell .portal-form-control {
    min-height: 50px;
    border-radius: 14px;
    background: #ffffff;
}

body.portal-shell-page.attendance-shell .attendance-task-textarea {
    width: 100%;
    min-height: 118px;
    padding: 0.85rem 0.95rem;
    border: 1px solid #d8dfeb;
    color: #111827;
    resize: vertical;
}

body.portal-shell-page.attendance-shell .attendance-task-confirmation {
    padding: 0.9rem 1rem;
    border-radius: 18px;
    background: rgba(17, 155, 107, 0.08);
    border: 1px solid rgba(17, 155, 107, 0.18);
    color: #0b7f58;
}

body.portal-shell-page.attendance-shell .attendance-task-actions {
    display: grid;
    gap: 0.7rem;
    grid-template-columns: minmax(0, 1fr) minmax(0, auto) minmax(0, auto);
    align-items: center;
}

body.portal-shell-page.attendance-shell .attendance-task-button {
    min-height: 56px;
    border-radius: 16px;
    font-size: 1rem;
    font-weight: 900;
    justify-content: center;
}

body.portal-shell-page.attendance-shell .attendance-task-button--primary {
    min-width: 180px;
    color: #fff;
}

body.portal-shell-page.attendance-shell .attendance-task-button--compact {
    min-height: 44px;
    padding-inline: 0.85rem;
    justify-self: start;
}

body.portal-shell-page.attendance-shell .attendance-history-hero {
    display: grid;
    gap: 0.85rem;
    padding: 1rem;
}

body.portal-shell-page.attendance-shell .attendance-history-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    justify-content: flex-end;
    gap: 0.75rem;
}

body.portal-shell-page.attendance-shell .attendance-history-toolbar__field {
    display: grid;
    gap: 0.35rem;
    min-width: 215px;
}

body.portal-shell-page.attendance-shell .attendance-history-summary {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.portal-shell-page.attendance-shell .attendance-history-summary__card {
    display: grid;
    gap: 0.2rem;
    padding: 0.95rem 1rem;
    border-radius: 18px;
    background: #f8fbff;
    border: 1px solid #e4ebf5;
}

body.portal-shell-page.attendance-shell .attendance-history-summary__card span {
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #7c8494;
}

body.portal-shell-page.attendance-shell .attendance-history-summary__card strong {
    color: #111827;
    font-size: 1.4rem;
    font-weight: 900;
}

body.portal-shell-page.attendance-shell .attendance-history-table-wrap {
    overflow: auto;
}

body.portal-shell-page.attendance-shell .attendance-history-table {
    width: 100%;
    border-collapse: collapse;
}

body.portal-shell-page.attendance-shell .attendance-history-table th,
body.portal-shell-page.attendance-shell .attendance-history-table td {
    padding: 0.85rem 0.8rem;
    border-bottom: 1px solid #e5ebf3;
    text-align: left;
    vertical-align: top;
}

body.portal-shell-page.attendance-shell .attendance-history-table th {
    font-size: 0.72rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #7c8494;
}

body.portal-shell-page.attendance-shell .attendance-history-card-list {
    display: none;
    gap: 0.75rem;
}

body.portal-shell-page.attendance-shell .attendance-history-card {
    display: grid;
    gap: 0.75rem;
    padding: 0.95rem;
    border-radius: 18px;
    border: 1px solid #e4ebf5;
    background: #f8fbff;
}

body.portal-shell-page.attendance-shell .attendance-history-card__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

body.portal-shell-page.attendance-shell .attendance-history-card__grid {
    display: grid;
    gap: 0.65rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page.attendance-shell .attendance-history-card__full {
    grid-column: 1 / -1;
}

body.portal-shell-page.attendance-shell .attendance-review-grid {
    display: grid;
    gap: 0.9rem;
    grid-template-columns: minmax(300px, 0.85fr) minmax(0, 1.15fr);
}

body.portal-shell-page.attendance-shell .attendance-review-queue,
body.portal-shell-page.attendance-shell .attendance-review-detail {
    display: grid;
    gap: 0.85rem;
    padding: 1rem;
}

body.portal-shell-page.attendance-shell .attendance-review-item {
    background: #f8fbff;
    border: 1px solid #e4ebf5;
    color: #111827;
}

body.portal-shell-page.attendance-shell .attendance-review-item.is-active {
    background: linear-gradient(180deg, rgba(91, 42, 134, 0.08), rgba(248, 251, 255, 0.98));
    border-color: rgba(91, 42, 134, 0.22);
}

body.portal-shell-page.attendance-shell .attendance-review-detail__grid {
    display: grid;
    gap: 0.8rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page.attendance-shell .attendance-review-card,
body.portal-shell-page.attendance-shell .attendance-review-item {
    border-radius: 18px;
    box-shadow: none;
}

body.portal-shell-page.attendance-shell .attendance-review-card {
    background: #f8fbff;
    border: 1px solid #e4ebf5;
    padding: 0.9rem;
}

body.portal-shell-page.attendance-shell .attendance-review-form {
    display: grid;
    gap: 0.85rem;
}

body.portal-shell-page.attendance-shell .attendance-review-form__grid {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page.attendance-shell .attendance-review-form__field--full {
    grid-column: 1 / -1;
}

body.portal-shell-page.attendance-shell .attendance-review-form__actions {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

body.portal-shell-page.attendance-shell .admin-summary-grid--attendance,
body.portal-shell-page.attendance-shell .admin-summary-grid--security {
    gap: 0.9rem;
}

body.portal-shell-page.attendance-shell .admin-kv-grid,
body.portal-shell-page.attendance-shell .admin-record__details {
    gap: 0.8rem;
    color: #111827;
}

body.portal-shell-page.attendance-shell .portal-mobile-dock {
    background: rgba(255, 255, 255, 0.96);
    border-top-color: rgba(16, 24, 40, 0.08);
}

body.portal-shell-page.attendance-shell .portal-mobile-dock__item,
body.portal-shell-page.attendance-shell .portal-mobile-sheet {
    background: rgba(255, 255, 255, 0.98);
    border-color: rgba(16, 24, 40, 0.08);
}

body.portal-shell-page.leave-shell .portal-content {
    justify-items: center;
    padding-top: 0.75rem;
    padding-bottom: 1.5rem;
}

body.portal-shell-page.leave-shell .leave-page {
    width: 100%;
    display: grid;
    justify-items: center;
}

body.portal-shell-page.leave-shell .leave-home-shell,
body.portal-shell-page.leave-shell .leave-placeholder-shell {
    width: min(100%, 492px);
    display: grid;
    gap: 0.85rem;
    padding: 0;
    border: 0;
    box-shadow: none;
    background: transparent;
}

body.portal-shell-page.leave-shell .leave-home-hero,
body.portal-shell-page.leave-shell .leave-actions-card,
body.portal-shell-page.leave-shell .leave-admin-card,
body.portal-shell-page.leave-shell .leave-position-card {
    border-radius: 16px;
    background: #ffffff;
    border: 1px solid #dde3ea;
    color: #171a1f;
    box-shadow: var(--portal-shadow-soft);
}

body.portal-shell-page.leave-shell .leave-home-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.85rem;
    padding: 1rem 1rem 0.95rem;
    background: #ffffff;
}

body.portal-shell-page.leave-shell .leave-home-eyebrow,
body.portal-shell-page.leave-shell .leave-actions-card__eyebrow,
body.portal-shell-page.leave-shell .leave-admin-card__eyebrow,
body.portal-shell-page.leave-shell .leave-position-card__eyebrow,
body.portal-shell-page.leave-shell .leave-placeholder-shell__eyebrow {
    margin: 0;
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: #7a828d;
}

body.portal-shell-page.leave-shell .leave-home-title,
body.portal-shell-page.leave-shell .leave-placeholder-shell__title {
    margin: 0.15rem 0 0;
    font-size: 1.08rem;
    font-weight: 900;
    color: #171a1f;
}

body.portal-shell-page.leave-shell .leave-home-subtitle,
body.portal-shell-page.leave-shell .leave-actions-card__subtitle,
body.portal-shell-page.leave-shell .leave-admin-card__subtitle,
body.portal-shell-page.leave-shell .leave-position-card__note,
body.portal-shell-page.leave-shell .leave-placeholder-shell__subtitle {
    margin-top: 0.2rem;
    color: #59616c;
    font-size: 0.86rem;
    line-height: 1.45;
}

body.portal-shell-page.leave-shell .leave-home-badge {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 0 0.65rem;
    border-radius: 999px;
    background: #f1ebf7;
    border: 1px solid #d9cbe8;
    color: #45206a;
    font-size: 0.62rem;
    font-weight: 900;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    white-space: nowrap;
    flex-shrink: 0;
}

body.portal-shell-page.leave-shell .leave-summary-grid {
    display: grid;
    gap: 0.7rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page.leave-shell .leave-summary-card {
    display: grid;
    gap: 0.18rem;
    min-height: 88px;
    padding: 0.82rem 0.85rem;
    border-radius: 14px;
    background: #ffffff;
    border: 1px solid #dde3ea;
    color: #171a1f;
    box-shadow: var(--portal-shadow-soft);
}

body.portal-shell-page.leave-shell .leave-summary-card:nth-child(5) {
    grid-column: 1 / -1;
}

body.portal-shell-page.leave-shell .leave-summary-card__label {
    font-size: 0.7rem;
    font-weight: 900;
    color: #7a828d;
}

body.portal-shell-page.leave-shell .leave-summary-card__value {
    font-size: 1.45rem;
    line-height: 1;
    font-weight: 900;
    color: #171a1f;
}

body.portal-shell-page.leave-shell .leave-summary-card__suffix {
    font-size: 0.72rem;
    line-height: 1.35;
    color: #59616c;
}

body.portal-shell-page.leave-shell .leave-actions-card,
body.portal-shell-page.leave-shell .leave-admin-card {
    display: grid;
    gap: 0.8rem;
    padding: 0.85rem;
}

body.portal-shell-page.leave-shell .leave-actions-card__head,
body.portal-shell-page.leave-shell .leave-admin-card__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

body.portal-shell-page.leave-shell .leave-admin-card__badge {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 0 0.55rem;
    border-radius: 999px;
    background: #f1ebf7;
    border: 1px solid #d9cbe8;
    color: #45206a;
    font-size: 0.58rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
    flex-shrink: 0;
}

body.portal-shell-page.leave-shell .leave-actions-card__buttons {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
}

body.portal-shell-page.leave-shell .leave-action-button,
body.portal-shell-page.leave-shell .leave-admin-card__button {
    min-height: 54px;
    border-radius: 12px;
    justify-content: center;
    font-size: 0.95rem;
    font-weight: 900;
    box-shadow: none;
}

body.portal-shell-page.leave-shell .leave-action-button--primary {
    background: #5b2a86;
    color: #ffffff;
}

body.portal-shell-page.leave-shell .leave-action-button--primary:hover {
    background: #45206a;
}

body.portal-shell-page.leave-shell .leave-action-button--secondary {
    background: #ffffff;
    color: #171a1f;
    border: 1px solid #dde3ea;
}

body.portal-shell-page.leave-shell .leave-action-button--secondary:hover {
    background: #f9fafb;
}

body.portal-shell-page.leave-shell .leave-admin-card__button {
    background: #f1ebf7;
    color: #5b2a86;
    border: 1px solid rgba(91, 42, 134, 0.16);
}

body.portal-shell-page.leave-shell .leave-admin-card__button:hover {
    background: #ebe2f4;
}

body.portal-shell-page.leave-shell .leave-position-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    padding: 0.85rem;
    background: #ffffff;
}

body.portal-shell-page.leave-shell .leave-position-card__copy {
    min-width: 0;
    display: grid;
    gap: 0.2rem;
}

body.portal-shell-page.leave-shell .leave-position-card__note {
    color: #171a1f;
    font-size: 0.78rem;
    font-weight: 700;
}

body.portal-shell-page.leave-shell .leave-position-card__status {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: #59616c;
    font-size: 0.72rem;
    white-space: nowrap;
    flex-shrink: 0;
}

body.portal-shell-page.leave-shell .leave-position-card__dot {
    width: 0.48rem;
    height: 0.48rem;
    border-radius: 999px;
    background: #119b6b;
    box-shadow: 0 0 0 5px rgba(17, 155, 107, 0.12);
    flex-shrink: 0;
}

body.portal-shell-page.leave-shell .leave-placeholder-shell {
    gap: 0.6rem;
    padding: 1rem;
    background: #ffffff;
    color: #171a1f;
    border: 1px solid #dde3ea;
    box-shadow: var(--portal-shadow-soft);
}

body.portal-shell-page.leave-shell .leave-placeholder-shell__header,
body.portal-shell-page.leave-shell .leave-placeholder-shell__body {
    display: grid;
    gap: 0.35rem;
}

body.portal-shell-page.leave-shell .leave-placeholder-shell__back {
    font-size: 0.85rem;
    font-weight: 800;
    color: #45206a;
}

body.portal-shell-page.leave-shell {
    color-scheme: light;
    --portal-bg: #f5f7fa;
    --portal-surface: #ffffff;
    --portal-panel-bg: #ffffff;
    --portal-panel-border: #dde3ea;
    --portal-charcoal: #171a1f;
    --portal-dark-grey: #59616c;
    --portal-mid-grey: #7a828d;
    --portal-light-grey: #a2aab4;
    --portal-primary: #5b2a86;
    --portal-primary-deep: #45206a;
    --portal-secondary: #119b6b;
    --portal-secondary-deep: #0b7f58;
    --portal-emerald: #119b6b;
    --portal-emerald-deep: #0b7f58;
    --portal-warning: #d97a1d;
    --portal-shadow-soft: 0 10px 24px rgba(18, 24, 38, 0.08);
    --portal-shadow-strong: 0 18px 36px rgba(18, 24, 38, 0.10);
}

body.portal-shell-page.leave-shell,
body.portal-shell-page.leave-shell::before {
    background:
        radial-gradient(circle at top left, rgba(91, 42, 134, 0.06), transparent 36%),
        radial-gradient(circle at top right, rgba(17, 155, 107, 0.06), transparent 28%),
        linear-gradient(180deg, #f9fafc 0%, #f5f7fa 100%);
}

body.portal-shell-page.leave-shell .portal-app {
    background: transparent;
}

body.portal-shell-page.leave-shell .portal-topbar {
    background: rgba(255, 255, 255, 0.96);
    border-bottom-color: rgba(16, 24, 40, 0.08);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.9), 0 14px 24px rgba(18, 24, 38, 0.06);
}

body.portal-shell-page.leave-shell .portal-brand__title,
body.portal-shell-page.leave-shell .portal-page-head__title,
body.portal-shell-page.leave-shell .portal-userbar__name,
body.portal-shell-page.leave-shell .portal-userbar__business,
body.portal-shell-page.leave-shell .portal-userbar__role,
body.portal-shell-page.leave-shell .portal-brand__subline,
body.portal-shell-page.leave-shell .portal-brand__eyebrow {
    color: #171a1f;
}

body.portal-shell-page.leave-shell .portal-button,
body.portal-shell-page.leave-shell .portal-button--ghost,
body.portal-shell-page.leave-shell .portal-menu-toggle,
body.portal-shell-page.leave-shell .portal-userbar__logout .portal-button,
body.portal-shell-page.leave-shell .portal-mobile-dock__item,
body.portal-shell-page.leave-shell .portal-mobile-sheet__item,
body.portal-shell-page.leave-shell .portal-form-control,
body.portal-shell-page.leave-shell textarea,
body.portal-shell-page.leave-shell select,
body.portal-shell-page.leave-shell input {
    background-color: #ffffff;
    border-color: #d8dfeb;
    color: #171a1f;
}

body.portal-shell-page.leave-shell .portal-panel,
body.portal-shell-page.leave-shell .portal-card,
body.portal-shell-page.leave-shell .leave-home-shell,
body.portal-shell-page.leave-shell .leave-task-card,
body.portal-shell-page.leave-shell .leave-history-panel,
body.portal-shell-page.leave-shell .leave-review-queue,
body.portal-shell-page.leave-shell .leave-review-detail,
body.portal-shell-page.leave-shell .admin-detail-card,
body.portal-shell-page.leave-shell .admin-summary-card,
body.portal-shell-page.leave-shell .admin-filter-panel,
body.portal-shell-page.leave-shell .admin-record-card {
    background: #ffffff;
    border-color: #dde3ea;
    box-shadow: var(--portal-shadow-soft);
}

body.portal-shell-page.leave-shell .portal-brand__logo-wrap {
    background: #ffffff !important;
    border-color: rgba(91, 42, 134, 0.14) !important;
    color: #171a1f !important;
}

body.portal-shell-page.leave-shell .leave-action-button--primary {
    background: #5b2a86;
    border-color: #5b2a86;
    color: #ffffff;
}

body.portal-shell-page.leave-shell .leave-action-button--primary:hover {
    background: #45206a;
    border-color: #45206a;
}

body.portal-shell-page.leave-shell .leave-admin-card__button {
    background: #f1ebf7;
    color: #45206a;
    border: 1px solid #d9cbe8;
}

body.portal-shell-page.leave-shell .leave-admin-card__button:hover {
    background: #ebe2f4;
}

body.portal-shell-page.leave-shell .leave-action-button--secondary,
body.portal-shell-page.leave-shell .leave-placeholder-shell__back {
    background: #ffffff;
    color: #171a1f;
    border: 1px solid #dde3ea;
}

body.portal-shell-page.leave-shell .leave-action-button--secondary:hover,
body.portal-shell-page.leave-shell .leave-placeholder-shell__back:hover {
    background: #f9fafb;
}

body.portal-shell-page.leave-shell .leave-home-badge {
    background: #f1ebf7;
    border-color: #d9cbe8;
    color: #45206a;
}

body.portal-shell-page.leave-shell .leave-admin-card__badge {
    background: #f1ebf7;
    border-color: #d9cbe8;
    color: #45206a;
}

body.portal-shell-page.leave-shell .leave-position-card__dot {
    background: #119b6b;
    box-shadow: 0 0 0 5px rgba(17, 155, 107, 0.12);
}

body.portal-shell-page.leave-shell .leave-position-card__status {
    color: #59616c;
}

body.portal-shell-page.leave-shell .leave-position-card__note {
    color: #171a1f;
}

body.portal-shell-page.leave-shell .leave-home-subtitle,
body.portal-shell-page.leave-shell .leave-actions-card__subtitle,
body.portal-shell-page.leave-shell .leave-admin-card__subtitle,
body.portal-shell-page.leave-shell .leave-placeholder-shell__subtitle {
    color: #59616c;
}

body.portal-shell-page.leave-shell .leave-summary-card__label,
body.portal-shell-page.leave-shell .leave-summary-card__suffix {
    color: #59616c;
}

body.portal-shell-page.leave-shell .leave-summary-card__value {
    color: #171a1f;
}

body.portal-shell-page.leave-shell .leave-summary-card {
    background: #ffffff;
    border-color: #dde3ea;
}

body.portal-shell-page.leave-shell.leave-apply-shell .portal-content {
    justify-items: center;
    padding-top: 0.75rem;
    padding-bottom: 1.5rem;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-page {
    width: 100%;
    display: grid;
    justify-items: center;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-shell {
    width: min(100%, 1048px);
    display: grid;
    gap: 1rem;
    padding: 0;
    border: 0;
    box-shadow: none;
    background: transparent;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-back {
    color: #45206a;
    font-size: 0.92rem;
    font-weight: 800;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-hero,
body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-form-card,
body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-summary-card-panel,
body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-warning-card,
body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-actions-card {
    border: 1px solid #dde3ea;
    border-radius: 18px;
    background: #ffffff;
    color: #171a1f;
    box-shadow: var(--portal-shadow-soft);
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.25rem 1.25rem 1.1rem;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-hero__copy {
    display: grid;
    gap: 0.15rem;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-hero__eyebrow,
body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-section-head h3,
body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-warning-card__eyebrow,
body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-summary-card__label,
body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-summary-card-panel__title,
body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-calculation-card__title,
body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-actions-card__title {
    margin: 0;
    color: #45206a;
    font-size: 0.76rem;
    font-weight: 900;
    letter-spacing: 0.22em;
    text-transform: uppercase;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-hero__title {
    margin: 0.1rem 0 0;
    color: #171a1f;
    font-size: 1.6rem;
    font-weight: 900;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-hero__subtitle {
    margin: 0;
    color: #4d5662;
    font-size: 0.88rem;
    line-height: 1.45;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-hero__badge {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 0.8rem;
    border-radius: 999px;
    background: #f1ebf7;
    border: 1px solid #d9cbe8;
    color: #45206a;
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-summary-grid {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-summary-card {
    display: grid;
    gap: 0.2rem;
    min-height: 96px;
    padding: 1rem;
    border-radius: 16px;
    background: #ffffff;
    border: 1px solid #dde3ea;
    box-shadow: var(--portal-shadow-soft);
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-summary-card.is-warning .leave-apply-summary-card__value {
    color: #a9680d;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-summary-card.is-success .leave-apply-summary-card__value {
    color: #119b6b;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-summary-card__value {
    margin: 0;
    color: #171a1f;
    font-size: 1.6rem;
    line-height: 1;
    font-weight: 900;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-summary-card__suffix {
    color: #6f7884;
    font-size: 0.76rem;
    line-height: 1.35;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(304px, 0.95fr);
    gap: 1rem;
    align-items: start;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-form-card,
body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-summary-card-panel,
body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-warning-card,
body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-actions-card {
    padding: 1.1rem;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-form-card {
    display: grid;
    gap: 0.9rem;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-section-head h3 {
    color: #45206a;
    font-size: 1rem;
    letter-spacing: 0;
    text-transform: none;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-error-banner {
    padding: 0.75rem 0.85rem;
    border-radius: 12px;
    border: 1px solid #e7bc72;
    background: #fff7e8;
    color: #68450e;
    font-size: 0.92rem;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-form {
    margin: 0;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-form__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-field {
    display: grid;
    gap: 0.42rem;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-field--panel {
    align-self: stretch;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-field--full {
    grid-column: 1 / -1;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-control {
    min-height: 48px;
    border-radius: 12px;
    border-color: #cdd5df;
    background: #ffffff;
    color: #171a1f;
    font-size: 0.98rem;
}

body.portal-shell-page.leave-shell.leave-apply-shell .portal-form-label {
    color: #4d5662;
    font-size: 0.84rem;
    font-weight: 800;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-textarea {
    min-height: 106px;
    resize: vertical;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-field__meta {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    color: #6f7884;
    font-size: 0.76rem;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-field__error {
    margin: 0;
    color: #a9680d;
    font-size: 0.78rem;
    font-weight: 700;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-calculation-card {
    height: 100%;
    display: grid;
    gap: 0.8rem;
    padding: 1rem;
    border-radius: 16px;
    background: #fafbfc;
    border: 1px solid #dde3ea;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-calculation-list,
body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-summary-list {
    display: grid;
    gap: 0.65rem;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-calculation-list__row,
body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-summary-list__row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-calculation-list dt,
body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-summary-list dt {
    color: #4d5662;
    font-size: 0.84rem;
    font-weight: 600;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-calculation-list dd,
body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-summary-list dd {
    margin: 0;
    color: #171a1f;
    font-size: 0.88rem;
    font-weight: 900;
    text-align: right;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-calculation-list dd.is-accent {
    color: #5b2a86;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-summary-list__row.is-warning dd {
    color: #a9680d;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-summary-list__row.is-success dd {
    color: #119b6b;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-calculation-card__note {
    margin: 0;
    color: #6f7884;
    font-size: 0.76rem;
    line-height: 1.45;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-sidebar {
    display: grid;
    gap: 0.85rem;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-warning-card {
    background: #fff7e8;
    border-color: #e7bc72;
    color: #68450e;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-warning-card__eyebrow {
    color: #68450e;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-warning-card__body {
    margin: 0.25rem 0 0;
    color: #68450e;
    font-size: 0.92rem;
    line-height: 1.5;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-summary-card-panel {
    display: grid;
    gap: 0.8rem;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-actions-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-actions-card__copy {
    display: grid;
    gap: 0.2rem;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-actions-card__subtitle {
    margin: 0;
    color: #4d5662;
    font-size: 0.84rem;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-actions-card__buttons {
    display: flex;
    align-items: center;
    gap: 0.7rem;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-button {
    min-height: 54px;
    border-radius: 14px;
    justify-content: center;
    padding-inline: 1.1rem;
    font-size: 0.95rem;
    font-weight: 900;
    box-shadow: none;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-button--primary {
    background: #5b2a86;
    border-color: #5b2a86;
    color: #ffffff;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-button--primary:hover {
    background: #45206a;
    border-color: #45206a;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-button--secondary {
    background: #ffffff;
    border-color: #dde3ea;
    color: #171a1f;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-button--secondary:hover {
    background: #f9fafb;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-button--secondary {
    order: 0;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-button--primary {
    order: 1;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-success-banner {
    display: grid;
    gap: 0.18rem;
    padding: 0.85rem 1rem;
    border-radius: 14px;
    border: 1px solid #b6e0d0;
    background: #e9f7f1;
    color: #0b7f58;
    box-shadow: var(--portal-shadow-soft);
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-success-banner strong {
    font-size: 0.94rem;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-success-banner span {
    font-size: 0.82rem;
}

body.portal-shell-page.leave-shell.leave-my-shell .portal-content {
    justify-items: center;
    padding-top: 0.75rem;
    padding-bottom: 1.5rem;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-page {
    width: 100%;
    display: grid;
    justify-items: center;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-shell {
    width: min(100%, 1048px);
    display: grid;
    gap: 1rem;
    padding: 0;
    border: 0;
    box-shadow: none;
    background: transparent;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-back {
    color: #45206a;
    font-size: 0.92rem;
    font-weight: 800;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-hero,
body.portal-shell-page.leave-shell.leave-my-shell .leave-my-filters-card,
body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card,
body.portal-shell-page.leave-shell.leave-my-shell .leave-my-empty-state,
body.portal-shell-page.leave-shell.leave-my-shell .leave-my-pagination {
    border: 1px solid #dde3ea;
    border-radius: 18px;
    background: #ffffff;
    color: #171a1f;
    box-shadow: var(--portal-shadow-soft);
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.25rem 1.25rem 1.1rem;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-hero__copy {
    display: grid;
    gap: 0.15rem;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-hero__eyebrow,
body.portal-shell-page.leave-shell.leave-my-shell .leave-my-filters-card .portal-form-label,
body.portal-shell-page.leave-shell.leave-my-shell .leave-my-detail-card__label {
    margin: 0;
    color: #45206a;
    font-size: 0.76rem;
    font-weight: 900;
    letter-spacing: 0.22em;
    text-transform: uppercase;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-hero__title {
    margin: 0.1rem 0 0;
    color: #171a1f;
    font-size: 1.6rem;
    font-weight: 900;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-hero__subtitle {
    margin: 0;
    color: #4d5662;
    font-size: 0.88rem;
    line-height: 1.45;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-hero__badge {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 0.8rem;
    border-radius: 999px;
    background: #e9f7f1;
    border: 1px solid #bde7d5;
    color: #087a52;
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-filters-card {
    padding: 1rem 1.05rem;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-filters {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
    align-items: end;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-filter-field {
    display: grid;
    gap: 0.35rem;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-filter-control {
    min-height: 48px;
    border-radius: 12px;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-filter-actions {
    display: flex;
    justify-content: flex-end;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-reset-button {
    min-height: 48px;
    padding: 0 1rem;
    border-radius: 12px;
    border: 1px solid #dde3ea;
    background: #ffffff;
    color: #171a1f;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-list {
    display: grid;
    gap: 0.7rem;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card {
    display: grid;
    gap: 0;
    overflow: hidden;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card > summary {
    list-style: none;
    cursor: pointer;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card > summary::-webkit-details-marker {
    display: none;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.9rem;
    padding: 1rem 1rem 0.95rem;
    outline: none;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary-grid {
    flex: 1 1 auto;
    min-width: 0;
    display: grid;
    gap: 0.75rem;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1.1fr) minmax(0, 0.8fr) auto;
    align-items: start;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary-block {
    display: grid;
    gap: 0.12rem;
    min-width: 0;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary-block--request .leave-my-card__summary-value,
body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary-block--request .leave-my-card__summary-label {
    color: #45206a;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary-value {
    font-size: 0.98rem;
    line-height: 1.3;
    font-weight: 900;
    color: #171a1f;
    word-break: break-word;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary-label {
    font-size: 0.72rem;
    font-weight: 700;
    color: #4d5662;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 0.25rem 0.7rem;
    border-radius: 999px;
    border: 1px solid transparent;
    font-size: 0.72rem;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-status-badge.tone--warning {
    background: #fff7e8;
    border-color: #e7bc72;
    color: #80500c;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-status-badge.tone--success {
    background: #e9f7f1;
    border-color: #bde7d5;
    color: #087a52;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-status-badge.tone--danger {
    background: #fff0f0;
    border-color: #f0c7c7;
    color: #9b3737;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-status-badge.tone--neutral {
    background: #f1ebf7;
    border-color: #d9cbe8;
    color: #45206a;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__chevron {
    flex-shrink: 0;
    color: #45206a;
    font-size: 1.15rem;
    line-height: 1;
    transition: transform 0.18s ease;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card[open] .leave-my-card__chevron {
    transform: rotate(180deg);
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__body {
    display: grid;
    gap: 0.75rem;
    padding: 0 1rem 1rem;
    border-top: 1px solid #dde3ea;
    background: #fafbfc;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-detail-grid {
    display: grid;
    gap: 0.7rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-detail-card {
    display: grid;
    gap: 0.2rem;
    padding: 0.82rem 0.88rem;
    border-radius: 14px;
    border: 1px solid #dde3ea;
    background: #ffffff;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-detail-card--full {
    grid-column: 1 / -1;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-detail-card strong {
    font-size: 0.92rem;
    line-height: 1.5;
    font-weight: 700;
    color: #171a1f;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-detail-card__status.tone--warning {
    color: #80500c;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-detail-card__status.tone--success {
    color: #087a52;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-detail-card__status.tone--danger {
    color: #9b3737;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-detail-card__status.tone--neutral {
    color: #45206a;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-detail-card__meta {
    font-size: 0.78rem;
    line-height: 1.45;
    color: #6f7884;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-empty-state {
    display: grid;
    gap: 0.35rem;
    padding: 1rem;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-empty-state h3 {
    font-size: 1.05rem;
    font-weight: 900;
    color: #171a1f;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-empty-state p {
    color: #4d5662;
    line-height: 1.55;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-pagination {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 0.85rem 1rem;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-pagination__meta {
    color: #4d5662;
    font-size: 0.9rem;
    font-weight: 700;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-pagination__button {
    min-height: 42px;
    padding: 0 1rem;
    border-radius: 12px;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-pagination__button--ghost {
    background: #ffffff;
    color: #171a1f;
    border: 1px solid #dde3ea;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-pagination__button--primary {
    background: #5b2a86;
    color: #ffffff;
    border: 1px solid #5b2a86;
}

@media (max-width: 1080px) {
    body.portal-shell-page.attendance-shell .attendance-review-grid {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page.attendance-shell .attendance-home-intro__actions,
    body.portal-shell-page.attendance-shell .attendance-home-secondary-actions,
    body.portal-shell-page.attendance-shell .attendance-history-summary,
    body.portal-shell-page.attendance-shell .attendance-review-detail__grid,
    body.portal-shell-page.attendance-shell .attendance-review-form__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.portal-shell-page.leave-shell .leave-home-shell,
    body.portal-shell-page.leave-shell .leave-placeholder-shell {
        width: min(100%, 492px);
    }

    body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-shell {
        width: min(100%, 1048px);
    }
}

@media (max-width: 760px) {
    body.portal-shell-page.attendance-shell .portal-topbar__inner {
        min-height: 82px;
        gap: 0.65rem;
    }

    body.portal-shell-page.attendance-shell .attendance-home-shell,
    body.portal-shell-page.attendance-shell .attendance-task-card,
    body.portal-shell-page.attendance-shell .attendance-history-hero,
    body.portal-shell-page.attendance-shell .attendance-history-panel,
    body.portal-shell-page.attendance-shell .attendance-review-queue,
    body.portal-shell-page.attendance-shell .attendance-review-detail,
    body.portal-shell-page.attendance-shell .admin-detail-card {
        padding: 0.9rem;
        border-radius: 18px;
    }

    body.portal-shell-page.attendance-shell .attendance-home-hero,
    body.portal-shell-page.attendance-shell .attendance-task-card__header,
    body.portal-shell-page.attendance-shell .attendance-history-hero {
        align-items: flex-start;
        flex-direction: column;
    }

    body.portal-shell-page.attendance-shell .attendance-home-clock {
        width: 100%;
        text-align: left;
    }

    body.portal-shell-page.attendance-shell .attendance-home-intro__actions,
    body.portal-shell-page.attendance-shell .attendance-home-secondary-actions,
    body.portal-shell-page.attendance-shell .attendance-history-summary,
    body.portal-shell-page.attendance-shell .attendance-review-detail__grid,
    body.portal-shell-page.attendance-shell .attendance-review-form__grid,
    body.portal-shell-page.attendance-shell .attendance-task-actions {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page.attendance-shell .attendance-task-actions {
        align-items: stretch;
    }

    body.portal-shell-page.attendance-shell .attendance-task-button--primary {
        min-width: 0;
    }

    body.portal-shell-page.attendance-shell .attendance-history-card-list {
        display: grid;
    }

    body.portal-shell-page.attendance-shell .attendance-history-table-wrap {
        display: none;
    }

    body.portal-shell-page.attendance-shell .attendance-task-button--compact {
        width: fit-content;
    }

    body.portal-shell-page.leave-shell .portal-content {
        padding-bottom: 0.9rem;
    }

    body.portal-shell-page.leave-shell .leave-home-shell,
    body.portal-shell-page.leave-shell .leave-placeholder-shell {
        width: 100%;
    }

    body.portal-shell-page.leave-shell .leave-home-hero {
        flex-direction: column;
        align-items: flex-start;
    }

    body.portal-shell-page.leave-shell .leave-summary-grid,
    body.portal-shell-page.leave-shell .leave-actions-card__buttons {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page.leave-shell .leave-summary-card:nth-child(5) {
        grid-column: auto;
    }

    body.portal-shell-page.leave-shell .leave-actions-card__head,
    body.portal-shell-page.leave-shell .leave-admin-card__head,
    body.portal-shell-page.leave-shell .leave-position-card {
        flex-direction: column;
        align-items: flex-start;
    }

    body.portal-shell-page.leave-shell .leave-action-button,
    body.portal-shell-page.leave-shell .leave-admin-card__button {
        min-width: 0;
        width: 100%;
    }

    body.portal-shell-page.leave-shell .leave-position-card__status {
        white-space: normal;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-shell {
        width: 100%;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-hero {
        flex-direction: column;
        align-items: flex-start;
        padding: 1rem;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-filters {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-filter-actions {
        justify-content: flex-start;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary {
        align-items: flex-start;
        padding: 0.88rem 0.88rem 0.82rem;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary-grid {
        width: 100%;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 0.55rem 0.75rem;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary-block--request {
        grid-column: 1 / 2;
        grid-row: 1;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-status-badge {
        grid-column: 2 / 3;
        grid-row: 1;
        align-self: start;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary-block:nth-of-type(2),
    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary-block:nth-of-type(3) {
        grid-column: 1 / -1;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__chevron {
        margin-top: 0.2rem;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-detail-grid {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-detail-card--full {
        grid-column: auto;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-pagination {
        justify-content: space-between;
        flex-wrap: wrap;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-pagination__meta {
        order: 2;
        width: 100%;
        text-align: center;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-pagination__button {
        flex: 1 1 0;
        min-width: 0;
    }

    body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-hero {
        flex-direction: column;
        align-items: flex-start;
        padding: 1rem;
    }

    body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-summary-card:nth-child(3) {
        grid-column: 1 / -1;
    }

    body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-layout,
    body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-form__grid,
    body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-actions-card {
        grid-template-columns: 1fr;
        flex-direction: column;
        align-items: stretch;
    }

    body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-actions-card__buttons {
        width: 100%;
        flex-direction: column;
    }

    body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-button {
        width: 100%;
    }

    body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-button--primary {
        order: 0;
    }

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-button--secondary {
        order: 1;
    }
}

body.portal-shell-page.leave-shell.leave-admin-shell,
body.portal-shell-page.leave-shell.leave-admin-shell::before {
    background: #f5f7fa;
}

body.portal-shell-page.leave-shell.leave-admin-shell {
    color-scheme: light;
    --portal-panel-bg: #ffffff;
    --portal-panel-border: #dde3ea;
    --portal-page-bg: #f5f7fa;
}

body.portal-shell-page.leave-shell.leave-admin-shell .portal-content {
    padding-top: 0;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-page {
    width: 100%;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-shell {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 24px 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-back {
    color: #5b2a86;
    font-size: 0.94rem;
    font-weight: 700;
    text-decoration: none;
    width: fit-content;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-back:hover {
    text-decoration: underline;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-hero,
body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-toolbar-card,
body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-placeholder,
body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-empty-state,
body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card {
    background: #ffffff;
    border: 1px solid #dde3ea;
    box-shadow: none;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 21px 22px;
    border-radius: 20px;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-hero__copy {
    min-width: 0;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-hero__eyebrow,
body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-toolbar-card__eyebrow,
body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-placeholder__eyebrow {
    margin: 0 0 0.25rem;
    color: #5b2a86;
    font-size: 0.74rem;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: 0.24em;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-hero__title {
    margin: 0;
    color: #171a1f;
    font-size: 1.6rem;
    line-height: 1.15;
    font-weight: 750;
    letter-spacing: -0.02em;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-hero__subtitle {
    margin: 0.4rem 0 0;
    color: #4d5662;
    font-size: 0.88rem;
    line-height: 1.5;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-hero__title--mobile,
body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-hero__subtitle--mobile,
body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-placeholder__title--mobile,
body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-placeholder__subtitle--mobile {
    display: none;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-hero__badge {
    flex: 0 0 auto;
    padding: 0.55rem 0.9rem;
    border-radius: 999px;
    border: 1px solid #d9cbe8;
    background: #f1ebf7;
    color: #45206a;
    font-size: 0.78rem;
    font-weight: 800;
    white-space: nowrap;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    padding: 0.28rem;
    border-radius: 15px;
    background: #eef1f5;
    border: 1px solid #dde3ea;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-tab {
    min-height: 3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.62rem 1rem;
    border-radius: 12px;
    color: #4d5662;
    font-size: 0.88rem;
    font-weight: 700;
    text-decoration: none;
    transition: background-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-tab.is-active {
    background: #ffffff;
    color: #45206a;
    box-shadow: 0 1px 0 rgba(69, 32, 106, 0.08), 0 10px 20px rgba(69, 32, 106, 0.04);
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-tab__label--mobile {
    display: none;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-placeholder {
    padding: 1.1rem 1.15rem 1.2rem;
    border-radius: 18px;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-placeholder__title {
    margin: 0.35rem 0 0;
    color: #171a1f;
    font-size: 1.1rem;
    line-height: 1.25;
    font-weight: 700;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-placeholder__subtitle {
    margin: 0.35rem 0 0;
    color: #4d5662;
    font-size: 0.9rem;
    line-height: 1.5;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-placeholder__title--mobile {
    display: none;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-placeholder__panel {
    margin-top: 1rem;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-placeholder__inner {
    margin-top: 1rem;
    padding: 1rem;
    border-radius: 16px;
    border: 1px dashed #d9cbe8;
    background: #fafbfc;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-summary-card {
    padding: 1rem 1.05rem 0.95rem;
    border-radius: 17px;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-summary-card__label {
    color: #4d5662;
    font-size: 0.82rem;
    line-height: 1.2;
    font-weight: 700;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-summary-card__value {
    color: #171a1f;
    font-size: 1.7rem;
    line-height: 1;
    font-weight: 800;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-summary-card.tone--amber .leave-admin-summary-card__value {
    color: #a9680d;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-summary-card.tone--purple .leave-admin-summary-card__value {
    color: #45206a;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-toolbar-card {
    padding: 1rem 1.1rem;
    border-radius: 18px;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-toolbar-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-toolbar-card__subtitle {
    margin: 0.35rem 0 0;
    color: #4d5662;
    font-size: 0.9rem;
    line-height: 1.45;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-filters {
    position: relative;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-filters > summary {
    list-style: none;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-filters > summary::-webkit-details-marker {
    display: none;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-filters__summary {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding-inline: 0.95rem;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-filters__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.5rem;
    height: 1.5rem;
    padding: 0 0.35rem;
    border-radius: 999px;
    background: #5b2a86;
    color: #ffffff;
    font-size: 0.76rem;
    font-weight: 800;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-filters__panel {
    margin-top: 0.85rem;
    padding: 1rem;
    border-radius: 16px;
    border: 1px solid #dde3ea;
    background: #fafbfc;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-filter-form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-filter-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-filter-field {
    min-width: 0;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-filter-field .portal-form-label {
    margin-bottom: 0.34rem;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-filter-field .portal-form-control {
    min-height: 44px;
    border-radius: 13px;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-filter-actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-filter-button {
    min-height: 44px;
    padding-inline: 1rem;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-filter-button--primary {
    background: #5b2a86;
    color: #ffffff;
    border-color: #5b2a86;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-queue {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card {
    display: block;
    padding: 0;
    border-radius: 18px;
    text-decoration: none;
    color: inherit;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card:hover {
    border-color: #c9d5e3;
    background: #ffffff;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr) minmax(0, 1fr) minmax(0, 0.64fr) minmax(0, 0.78fr) minmax(0, 0.78fr) minmax(0, 0.82fr) minmax(0, auto) auto;
    gap: 12px;
    align-items: center;
    padding: 1rem 1rem 0.95rem;
    min-width: 0;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__employee {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__employee strong {
    color: #171a1f;
    font-size: 0.9rem;
    line-height: 1.3;
    font-weight: 750;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__employee span {
    color: #6f7884;
    font-size: 0.78rem;
    line-height: 1.25;
    font-weight: 700;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__block,
body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__balance {
    display: flex;
    flex-direction: column;
    gap: 0.18rem;
    min-width: 0;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__label {
    color: #6f7884;
    font-size: 0.73rem;
    line-height: 1.2;
    font-weight: 700;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__block strong,
body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__balance strong {
    color: #171a1f;
    font-size: 0.92rem;
    line-height: 1.3;
    font-weight: 800;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__balance strong.is-warning {
    color: #a9680d;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__badges,
body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__indicator {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    align-items: center;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-status-badge,
body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-limit-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.8rem;
    padding: 0.3rem 0.65rem;
    border-radius: 999px;
    border: 1px solid transparent;
    font-size: 0.74rem;
    line-height: 1;
    font-weight: 800;
    white-space: nowrap;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-status-badge.tone--warning {
    background: #fff7e8;
    border-color: #e7bc72;
    color: #80500c;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-status-badge.tone--success {
    background: #e9f7f1;
    border-color: #bde7d5;
    color: #087a52;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-status-badge.tone--danger {
    background: #fff0f0;
    border-color: #f0c7c7;
    color: #9b3737;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-status-badge.tone--neutral {
    background: #f4f6f8;
    border-color: #dde3ea;
    color: #4d5662;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-limit-badge.tone--warning {
    background: #f1ebf7;
    border-color: #d9cbe8;
    color: #45206a;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-limit-badge.tone--neutral {
    background: #f4f6f8;
    border-color: #dde3ea;
    color: #4d5662;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__chevron {
    justify-self: end;
    color: #5b2a86;
    font-size: 1.5rem;
    line-height: 1;
    font-weight: 700;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-empty-state {
    padding: 1.25rem 1.15rem 1.2rem;
    border-radius: 18px;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-empty-state h3 {
    margin: 0;
    color: #171a1f;
    font-size: 1rem;
    line-height: 1.25;
    font-weight: 750;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-empty-state p {
    margin: 0.35rem 0 0;
    color: #4d5662;
    font-size: 0.9rem;
    line-height: 1.5;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.8rem;
    flex-wrap: wrap;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-pagination__meta {
    color: #4d5662;
    font-size: 0.86rem;
    font-weight: 700;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-pagination__button {
    min-width: 9rem;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-pagination__button--primary {
    background: #5b2a86;
    color: #ffffff;
    border-color: #5b2a86;
}

@media (max-width: 767px) {
    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-shell {
        padding: 0 16px 20px;
        gap: 14px;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-hero {
        padding: 16px;
        border-radius: 18px;
        flex-direction: column;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-hero__title--desktop,
    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-hero__subtitle--desktop,
    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-placeholder__title--desktop,
    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-placeholder__subtitle--desktop {
        display: none;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-hero__title--mobile,
    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-hero__subtitle--mobile,
    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-placeholder__title--mobile,
    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-placeholder__subtitle--mobile {
        display: block;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-hero__title {
        font-size: 1.35rem;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-tabs {
        padding: 0.24rem;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-tab {
        min-height: 2.75rem;
        padding-inline: 0.75rem;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-tab__label--desktop {
        display: none;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-tab__label--mobile {
        display: inline;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-summary-card--desktop-only {
        display: none;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-toolbar-card {
        padding: 0.95rem;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-toolbar-card__head {
        align-items: flex-start;
        flex-direction: column;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-filters__summary,
    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-filter-button {
        width: 100%;
        justify-content: center;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-filters__panel {
        padding: 0.88rem;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-filter-grid {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-filter-actions {
        flex-direction: column;
        align-items: stretch;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__grid {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 0.65rem 0.75rem;
        padding: 0.88rem 0.88rem 0.82rem;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__employee {
        grid-column: 1 / -1;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__block {
        grid-column: 1 / -1;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__badges {
        grid-column: 1 / -1;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__balance {
        grid-column: span 1;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__indicator {
        grid-column: 1 / -1;
    }

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__chevron {
    grid-column: 2 / 3;
    grid-row: 1;
    align-self: start;
}

/* Phase 8 final mobile shell correction: keep shared Leave context compact without changing shell behavior. */
@media (max-width: 760px) {
    body.portal-shell-page.leave-shell .portal-topbar__inner {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "brand menu"
            "page user";
        gap: 0.55rem 0.7rem;
        padding: 0.65rem 1rem;
        align-items: center;
    }

    body.portal-shell-page.leave-shell .portal-brand {
        grid-area: brand;
        gap: 0.55rem;
    }

    body.portal-shell-page.leave-shell .portal-brand__logo-wrap {
        width: 40px;
        height: 40px;
        padding: 0.24rem;
        border-radius: 13px;
        box-shadow: none;
    }

    body.portal-shell-page.leave-shell .portal-brand__eyebrow {
        font-size: 0.54rem;
        letter-spacing: 0.16em;
    }

    body.portal-shell-page.leave-shell .portal-brand__title {
        font-size: 0.76rem;
        line-height: 1.15;
    }

    body.portal-shell-page.leave-shell .portal-topbar__context {
        display: contents;
    }

    body.portal-shell-page.leave-shell .portal-menu-toggle {
        display: inline-flex;
        grid-area: menu;
        width: auto;
        min-height: 40px;
        padding: 0.55rem 0.72rem;
        font-size: 0.78rem;
        box-shadow: none;
        justify-self: end;
    }

    body.portal-shell-page.leave-shell .portal-page-head {
        grid-area: page;
        min-width: 0;
        text-align: left;
    }

    body.portal-shell-page.leave-shell .portal-page-head__title {
        overflow: hidden;
        font-size: 0.78rem;
        font-weight: 800;
        line-height: 1.2;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.portal-shell-page.leave-shell .portal-userbar {
        grid-area: user;
        min-width: 0;
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: flex-end;
        gap: 0.45rem;
    }

    body.portal-shell-page.leave-shell .portal-userbar__identity {
        min-width: 0;
        max-width: min(9.8rem, calc(100vw - 13.5rem));
        gap: 0.45rem;
        padding: 0.32rem 0.45rem;
        border-radius: 13px;
        box-shadow: none;
    }

    body.portal-shell-page.leave-shell .portal-userbar__avatar {
        width: 28px;
        height: 28px;
        padding: 0.12rem;
        border-radius: 10px;
        box-shadow: none;
    }

    body.portal-shell-page.leave-shell .portal-userbar__stack {
        gap: 0;
        overflow: hidden;
    }

    body.portal-shell-page.leave-shell .portal-userbar__name,
    body.portal-shell-page.leave-shell .portal-userbar__business,
    body.portal-shell-page.leave-shell .portal-userbar__role {
        overflow: hidden;
        font-size: 0.64rem;
        line-height: 1.16;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.portal-shell-page.leave-shell .portal-userbar__logout .portal-button {
        min-height: 38px;
        padding: 0.48rem 0.6rem;
        font-size: 0.72rem;
        box-shadow: none;
    }

    /* The shared Account panel supersedes Leave's former inline mobile user bar. */
    body.portal-shell-page.leave-shell .portal-topbar__inner {
        grid-template-columns: minmax(0, 1fr) auto auto;
        grid-template-areas:
            "brand menu account"
            "page page page";
    }

    body.portal-shell-page.leave-shell .portal-account {
        position: relative;
        display: block;
        grid-area: account;
        justify-self: end;
    }

    body.portal-shell-page.leave-shell .portal-userbar {
        position: absolute;
        top: calc(100% + 0.6rem);
        right: 0;
        width: min(calc(100vw - 2rem), 320px);
        padding: 0.85rem;
        display: grid;
        gap: 0.75rem;
        border: 1px solid rgba(214, 222, 232, 0.98);
        border-radius: 18px;
        background: rgba(255, 255, 255, 0.98);
        box-shadow: var(--portal-shadow);
        z-index: 45;
    }

    body.portal-shell-page.leave-shell .portal-userbar[hidden] {
        display: none;
    }

    body.portal-shell-page.leave-shell .portal-userbar__identity,
    body.portal-shell-page.leave-shell .portal-userbar__notifications,
    body.portal-shell-page.leave-shell .portal-userbar__logout,
    body.portal-shell-page.leave-shell .portal-userbar__logout .portal-button {
        width: 100%;
        max-width: none;
    }
}

/* Phase 8: shared Leave visual foundation. Presentation only. */
body.portal-shell-page.leave-shell {
    --leave-space-1: 8px;
    --leave-space-2: 12px;
    --leave-space-3: 16px;
    --leave-space-4: 20px;
    --leave-space-5: 24px;
    --leave-surface: #ffffff;
    --leave-border: #dde3ea;
    --leave-text: #171a1f;
    --leave-muted: #4d5662;
    --leave-meta: #6f7884;
}

body.portal-shell-page.leave-shell .leave-page,
body.portal-shell-page.leave-shell .leave-page > *,
body.portal-shell-page.leave-shell .portal-panel,
body.portal-shell-page.leave-shell [class$="-grid"],
body.portal-shell-page.leave-shell [class$="-card"] {
    min-width: 0;
}

body.portal-shell-page.leave-shell .leave-page {
    gap: var(--leave-space-4);
}

body.portal-shell-page.leave-shell .portal-panel,
body.portal-shell-page.leave-shell .leave-apply-form-card,
body.portal-shell-page.leave-shell .leave-apply-actions-card,
body.portal-shell-page.leave-shell .leave-apply-summary-card-panel,
body.portal-shell-page.leave-shell .leave-apply-warning-card,
body.portal-shell-page.leave-shell .leave-my-filters-card,
body.portal-shell-page.leave-shell .leave-my-card,
body.portal-shell-page.leave-shell .leave-admin-toolbar-card,
body.portal-shell-page.leave-shell .leave-balance-card,
body.portal-shell-page.leave-shell .holiday-list {
    border-color: var(--leave-border);
    border-radius: 18px;
}

body.portal-shell-page.leave-shell .leave-home-hero,
body.portal-shell-page.leave-shell .leave-apply-hero,
body.portal-shell-page.leave-shell .leave-my-hero,
body.portal-shell-page.leave-shell .leave-admin-hero,
body.portal-shell-page.leave-shell .leave-decision-hero {
    gap: var(--leave-space-3);
}

body.portal-shell-page.leave-shell .leave-home-title,
body.portal-shell-page.leave-shell .leave-apply-hero__title,
body.portal-shell-page.leave-shell .leave-my-hero__title,
body.portal-shell-page.leave-shell .leave-admin-hero__title,
body.portal-shell-page.leave-shell .leave-decision-hero__title {
    color: var(--leave-text);
    font-size: 1.6rem;
    line-height: 1.16;
    font-weight: 780;
    letter-spacing: -0.02em;
}

body.portal-shell-page.leave-shell .leave-apply-section-head h3,
body.portal-shell-page.leave-shell .leave-decision-actions-card__title,
body.portal-shell-page.leave-shell .leave-balance-list__title,
body.portal-shell-page.leave-shell .holiday-row__name {
    color: var(--leave-text);
    font-size: 1.02rem;
    line-height: 1.3;
    font-weight: 750;
    letter-spacing: 0;
}

body.portal-shell-page.leave-shell .leave-home-hero__subtitle,
body.portal-shell-page.leave-shell .leave-apply-hero__subtitle,
body.portal-shell-page.leave-shell .leave-my-hero__subtitle,
body.portal-shell-page.leave-shell .leave-admin-hero__subtitle,
body.portal-shell-page.leave-shell .leave-decision-hero__subtitle,
body.portal-shell-page.leave-shell .leave-balance-section-subtitle,
body.portal-shell-page.leave-shell .leave-decision-section-subtitle,
body.portal-shell-page.leave-shell .leave-actions-card__subtitle {
    color: var(--leave-muted);
    font-size: 0.92rem;
    line-height: 1.5;
}

body.portal-shell-page.leave-shell .leave-home-hero__eyebrow,
body.portal-shell-page.leave-shell .leave-apply-hero__eyebrow,
body.portal-shell-page.leave-shell .leave-my-hero__eyebrow,
body.portal-shell-page.leave-shell .leave-admin-hero__eyebrow,
body.portal-shell-page.leave-shell .leave-decision-hero__eyebrow,
body.portal-shell-page.leave-shell .leave-balance-section-eyebrow,
body.portal-shell-page.leave-shell .leave-decision-section-eyebrow,
body.portal-shell-page.leave-shell .leave-admin-toolbar-card__eyebrow {
    margin-bottom: 6px;
    font-size: 0.76rem;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: 0.12em;
}

body.portal-shell-page.leave-shell .leave-summary-card,
body.portal-shell-page.leave-shell .leave-apply-summary-card,
body.portal-shell-page.leave-shell .leave-admin-summary-card,
body.portal-shell-page.leave-shell .leave-decision-summary-card,
body.portal-shell-page.leave-shell .leave-balance-summary-card,
body.portal-shell-page.leave-shell .holiday-stat {
    display: flex;
    min-height: 124px;
    padding: var(--leave-space-3);
    flex-direction: column;
    justify-content: space-between;
    gap: var(--leave-space-1);
    border: 1px solid var(--leave-border);
    border-radius: 18px;
    background: var(--leave-surface);
}

body.portal-shell-page.leave-shell .leave-summary-card__label,
body.portal-shell-page.leave-shell .leave-apply-summary-card__label,
body.portal-shell-page.leave-shell .leave-admin-summary-card__label,
body.portal-shell-page.leave-shell .leave-decision-summary-card__label,
body.portal-shell-page.leave-shell .leave-balance-summary-card__label,
body.portal-shell-page.leave-shell .holiday-stat__label {
    color: var(--leave-muted);
    font-size: 0.78rem;
    font-weight: 750;
    letter-spacing: 0.02em;
}

body.portal-shell-page.leave-shell .leave-summary-card__value,
body.portal-shell-page.leave-shell .leave-apply-summary-card__value,
body.portal-shell-page.leave-shell .leave-admin-summary-card__value,
body.portal-shell-page.leave-shell .leave-decision-summary-card__value,
body.portal-shell-page.leave-shell .leave-balance-summary-card__value,
body.portal-shell-page.leave-shell .holiday-stat__value {
    color: var(--leave-text);
    font-size: 1.7rem;
    line-height: 1.05;
    font-weight: 800;
    letter-spacing: -0.03em;
}

body.portal-shell-page.leave-shell .leave-summary-card__suffix,
body.portal-shell-page.leave-shell .leave-apply-summary-card__suffix,
body.portal-shell-page.leave-shell .leave-decision-summary-card__suffix,
body.portal-shell-page.leave-shell .leave-balance-summary-card__suffix,
body.portal-shell-page.leave-shell .holiday-stat__support,
body.portal-shell-page.leave-shell .leave-my-detail-card__meta,
body.portal-shell-page.leave-shell .leave-balance-list__meta {
    color: var(--leave-meta);
    font-size: 0.8rem;
    line-height: 1.4;
}

body.portal-shell-page.leave-shell .portal-form-label,
body.portal-shell-page.leave-shell .leave-balance-detail__label,
body.portal-shell-page.leave-shell .leave-my-detail-card__label,
body.portal-shell-page.leave-shell .leave-admin-card__label,
body.portal-shell-page.leave-shell .leave-decision-info-card__label {
    color: var(--leave-muted);
    font-size: 0.82rem;
    line-height: 1.3;
    font-weight: 750;
    letter-spacing: 0.01em;
}

body.portal-shell-page.leave-shell .portal-form-control,
body.portal-shell-page.leave-shell .holiday-controls input,
body.portal-shell-page.leave-shell .holiday-controls select,
body.portal-shell-page.leave-shell .holiday-dialog input,
body.portal-shell-page.leave-shell .holiday-dialog select {
    min-height: 46px;
    border-color: #cdd5df;
    border-radius: 14px;
    color: var(--leave-text);
    background: #ffffff;
    box-shadow: none;
}

body.portal-shell-page.leave-shell .portal-form-control:focus,
body.portal-shell-page.leave-shell .holiday-controls input:focus,
body.portal-shell-page.leave-shell .holiday-controls select:focus,
body.portal-shell-page.leave-shell .holiday-dialog input:focus,
body.portal-shell-page.leave-shell .holiday-dialog select:focus {
    border-color: #5b2a86;
    outline: 3px solid rgba(91, 42, 134, 0.16);
    outline-offset: 1px;
}

body.portal-shell-page.leave-shell .portal-button {
    min-height: 46px;
    padding-inline: 18px;
    border-radius: 14px;
    font-weight: 750;
}

body.portal-shell-page.leave-shell .portal-button--ghost {
    border-color: #d3dbe6;
    color: var(--leave-text);
    background: #ffffff;
}

body.portal-shell-page.leave-shell .leave-decision-button--approve,
body.portal-shell-page.leave-shell .portal-button--success {
    border-color: #119b6b;
    background: #119b6b;
    color: #ffffff;
}

body.portal-shell-page.leave-shell .leave-decision-button--reject {
    border-color: #e6b8bd;
    background: #ffffff;
    color: #b63f50;
}

body.portal-shell-page.leave-shell .leave-balance-status,
body.portal-shell-page.leave-shell .leave-my-status-badge,
body.portal-shell-page.leave-shell .leave-admin-status-badge,
body.portal-shell-page.leave-shell .leave-admin-limit-badge,
body.portal-shell-page.leave-shell .leave-decision-status-badge,
body.portal-shell-page.leave-shell .holiday-type {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: 0.78rem;
    line-height: 1.1;
    font-weight: 750;
}

body.portal-shell-page.leave-shell .leave-success-banner,
body.portal-shell-page.leave-shell .leave-apply-error-banner,
body.portal-shell-page.leave-shell .leave-decision-error-banner,
body.portal-shell-page.leave-shell .leave-balance-field__error,
body.portal-shell-page.leave-shell .leave-apply-warning-card,
body.portal-shell-page.leave-shell .leave-decision-warning-card,
body.portal-shell-page.leave-shell .leave-my-empty-state,
body.portal-shell-page.leave-shell .leave-admin-empty-state,
body.portal-shell-page.leave-shell .leave-balance-empty {
    border-radius: 14px;
    line-height: 1.5;
}

body.portal-shell-page.leave-shell .leave-actions-card__buttons,
body.portal-shell-page.leave-shell .leave-apply-actions-card__buttons,
body.portal-shell-page.leave-shell .leave-balance-actions,
body.portal-shell-page.leave-shell .leave-decision-actions-card__buttons,
body.portal-shell-page.leave-shell .holiday-actions {
    gap: 10px;
}

@media (max-width: 1024px) {
    body.portal-shell-page.leave-shell .leave-summary-card,
    body.portal-shell-page.leave-shell .leave-apply-summary-card,
    body.portal-shell-page.leave-shell .leave-admin-summary-card,
    body.portal-shell-page.leave-shell .leave-decision-summary-card,
    body.portal-shell-page.leave-shell .leave-balance-summary-card,
    body.portal-shell-page.leave-shell .holiday-stat {
        min-height: 116px;
    }
}

@media (max-width: 767px) {
    body.portal-shell-page.leave-shell .leave-home-title,
    body.portal-shell-page.leave-shell .leave-apply-hero__title,
    body.portal-shell-page.leave-shell .leave-my-hero__title,
    body.portal-shell-page.leave-shell .leave-admin-hero__title,
    body.portal-shell-page.leave-shell .leave-decision-hero__title {
        font-size: 1.38rem;
    }

    body.portal-shell-page.leave-shell .leave-summary-card,
    body.portal-shell-page.leave-shell .leave-apply-summary-card,
    body.portal-shell-page.leave-shell .leave-admin-summary-card,
    body.portal-shell-page.leave-shell .leave-decision-summary-card,
    body.portal-shell-page.leave-shell .leave-balance-summary-card,
    body.portal-shell-page.leave-shell .holiday-stat {
        min-height: 108px;
        padding: 16px;
    }

    body.portal-shell-page.leave-shell .leave-actions-card__buttons,
    body.portal-shell-page.leave-shell .leave-apply-actions-card__buttons,
    body.portal-shell-page.leave-shell .leave-balance-actions,
    body.portal-shell-page.leave-shell .leave-decision-actions-card__buttons {
        align-items: stretch;
        flex-direction: column;
    }

    body.portal-shell-page.leave-shell .leave-actions-card__buttons .portal-button,
    body.portal-shell-page.leave-shell .leave-apply-actions-card__buttons .portal-button,
    body.portal-shell-page.leave-shell .leave-balance-actions .portal-button,
    body.portal-shell-page.leave-shell .leave-decision-actions-card__buttons .portal-button {
        width: 100%;
    }
}
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell::before {
    background: #f5f7fa;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell {
    color-scheme: light;
    --portal-panel-bg: #ffffff;
    --portal-panel-border: #dde3ea;
    --portal-page-bg: #f5f7fa;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .portal-content {
    padding-top: 0;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-page {
    width: 100%;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-shell {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 24px 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-back {
    width: fit-content;
    color: #5b2a86;
    font-size: 0.94rem;
    font-weight: 700;
    text-decoration: none;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-back:hover {
    text-decoration: underline;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-hero,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-employee-card,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-card {
    background: #ffffff;
    border: 1px solid #dde3ea;
    box-shadow: none;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 21px 22px;
    border-radius: 20px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-hero__eyebrow,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-section-eyebrow {
    margin: 0 0 0.25rem;
    color: #5b2a86;
    font-size: 0.74rem;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: 0.24em;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-hero__title {
    margin: 0;
    color: #171a1f;
    font-size: 1.6rem;
    line-height: 1.15;
    font-weight: 750;
    letter-spacing: -0.02em;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-hero__subtitle,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-section-subtitle {
    margin: 0.4rem 0 0;
    color: #4d5662;
    font-size: 0.88rem;
    line-height: 1.5;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-hero__badge {
    flex: 0 0 auto;
    padding: 0.55rem 0.9rem;
    border-radius: 999px;
    border: 1px solid #d9cbe8;
    background: #f1ebf7;
    color: #45206a;
    font-size: 0.78rem;
    font-weight: 800;
    white-space: nowrap;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-employee-card {
    padding: 16px;
    border-radius: 18px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-employee-form {
    display: flex;
    align-items: end;
    gap: 12px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-employee-field {
    flex: 1 1 auto;
    min-width: 0;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-employee-field .portal-form-label {
    margin-bottom: 0.34rem;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-employee-field .portal-form-control {
    min-height: 44px;
    border-radius: 13px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-load-button {
    min-height: 44px;
    padding-inline: 1rem;
    background: #5b2a86;
    color: #ffffff;
    border-color: #5b2a86;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-summary-card {
    padding: 16px;
    border-radius: 18px;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-summary-card__label {
    color: #4d5662;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-summary-card__value {
    color: #171a1f;
    font-size: 1.65rem;
    line-height: 1.05;
    font-weight: 800;
    letter-spacing: -0.03em;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-summary-card.tone--warning .leave-balance-summary-card__value {
    color: #a9680d;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-summary-card.tone--success .leave-balance-summary-card__value {
    color: #119b6b;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-summary-card__suffix {
    color: #6f7884;
    font-size: 0.76rem;
    font-weight: 700;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-tabs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 4px;
    padding: 4px;
    border-radius: 15px;
    background: #eef1f5;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-tab {
    min-height: 44px;
    padding: 0.8rem 0.75rem;
    border-radius: 13px;
    text-align: center;
    text-decoration: none;
    color: #4d5662;
    font-size: 0.86rem;
    font-weight: 750;
    transition: background-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-tab.is-active {
    background: #ffffff;
    color: #45206a;
    box-shadow: 0 1px 3px rgba(69, 32, 106, 0.08);
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-section-grid,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-corrections {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-card {
    padding: 20px 22px;
    border-radius: 20px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 14px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-detail,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-workflow-card,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-boundary-card {
    border: 1px solid #dde3ea;
    border-radius: 14px;
    background: #fafbfc;
    padding: 12px 13px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-detail__label,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-list__label,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-workflow-card__label,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-boundary-card__title,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-propagation-card__title {
    color: #6f7884;
    font-size: 0.74rem;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-detail__value {
    display: block;
    margin-top: 0.2rem;
    color: #171a1f;
    font-size: 0.96rem;
    line-height: 1.35;
    font-weight: 800;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-comparison {
    margin-top: 14px;
    border: 1px solid #dde3ea;
    border-radius: 16px;
    padding: 14px;
    background: #fafbfc;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-comparison.is-warning {
    background: #fff7e8;
    border-color: #e7bc72;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-comparison__row {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 0.35rem 0;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-comparison__row span,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-comparison__meta,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-comparison__note,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-list__meta,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-request-text p,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-audit-row p,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-propagation-card__body,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-boundary-card__body {
    color: #4d5662;
    font-size: 0.88rem;
    line-height: 1.45;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-comparison__row strong,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-list__title,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-request-text strong,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-workflow-card__row strong,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-detail strong {
    color: #171a1f;
    font-size: 0.94rem;
    line-height: 1.35;
    font-weight: 800;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-boundary-grid,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-propagation-grid,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-correction-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-correction-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-correction-card {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    text-decoration: none;
    color: inherit;
    transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-correction-card.is-active {
    border-color: #d9cbe8;
    box-shadow: 0 0 0 1px rgba(91, 42, 134, 0.08);
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-correction-card__eyebrow {
    color: #5b2a86;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.24em;
    text-transform: uppercase;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-correction-card__title {
    color: #171a1f;
    font-size: 0.98rem;
    line-height: 1.25;
    font-weight: 800;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-correction-card__button {
    align-self: flex-start;
    padding-inline: 0.85rem;
    min-height: 40px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-workflow-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 14px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-workflow-card--full {
    grid-column: 1 / -1;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-workflow-card__row {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 0.38rem 0;
    border-top: 1px solid transparent;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-workflow-card__row:first-of-type {
    margin-top: 0.45rem;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-workflow-card__row.is-warning strong {
    color: #a9680d;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-error-banner {
    margin-top: 14px;
    padding: 0.85rem 1rem;
    border-radius: 14px;
    border: 1px solid #e7bc72;
    background: #fff7e8;
    color: #68450e;
    font-size: 0.9rem;
    font-weight: 700;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-form {
    margin-top: 14px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-field--full {
    grid-column: 1 / -1;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-field .portal-form-label {
    margin-bottom: 0.34rem;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-field .portal-form-control {
    min-height: 44px;
    border-radius: 13px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-textarea {
    min-height: 110px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-field__error {
    margin: 0.3rem 0 0;
    color: #9b3737;
    font-size: 0.8rem;
    font-weight: 700;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-top: 14px;
    flex-wrap: wrap;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-apply-button {
    background: #119b6b;
    color: #ffffff;
    border-color: #119b6b;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-empty {
    padding: 1rem 0;
    color: #4d5662;
    font-size: 0.94rem;
    font-weight: 700;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-list,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-audit-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 14px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-list__row,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-audit-row {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.7fr) minmax(0, 0.65fr) minmax(0, 0.75fr) minmax(0, 1.25fr);
    gap: 12px;
    align-items: start;
    padding: 0.9rem 0.95rem;
    border-radius: 16px;
    border: 1px solid #dde3ea;
    background: #ffffff;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-list__row strong,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-audit-row strong {
    color: #171a1f;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.8rem;
    padding: 0.3rem 0.65rem;
    border-radius: 999px;
    border: 1px solid transparent;
    font-size: 0.74rem;
    line-height: 1;
    font-weight: 800;
    white-space: nowrap;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-status.tone--warning {
    background: #fff7e8;
    border-color: #e7bc72;
    color: #80500c;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-status.tone--success {
    background: #e9f7f1;
    border-color: #bde7d5;
    color: #087a52;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-status.tone--slate {
    background: #f4f6f8;
    border-color: #dde3ea;
    color: #4d5662;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-request-text p {
    margin: 0.15rem 0 0;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-workflow-pill {
    padding: 0.45rem 0.75rem;
    border-radius: 999px;
    background: #f1ebf7;
    border: 1px solid #d9cbe8;
    color: #45206a;
    font-size: 0.74rem;
    font-weight: 800;
    white-space: nowrap;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-correction-selector {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-correction-selector__pill {
    min-height: 36px;
    padding: 0.48rem 0.8rem;
    border-radius: 999px;
    border: 1px solid #d9cbe8;
    background: #f1ebf7;
    color: #45206a;
    text-decoration: none;
    font-size: 0.76rem;
    font-weight: 800;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-correction-selector__pill.is-active {
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(69, 32, 106, 0.08);
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-opening-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 14px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-detail--input {
    display: grid;
    gap: 0.35rem;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-inline-control {
    min-height: 44px;
    border-radius: 13px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-detail__hint {
    color: #6f7884;
    font-size: 0.78rem;
    line-height: 1.4;
    font-weight: 700;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-impact-preview {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: 12px;
    align-items: stretch;
    margin-top: 14px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-impact-card {
    border: 1px solid #dde3ea;
    border-radius: 16px;
    background: #ffffff;
    padding: 14px;
    display: grid;
    gap: 0.35rem;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-impact-card.is-success {
    background: #f7fff9;
    border-color: #bde7d5;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-impact-card.is-warning {
    background: #fff7e8;
    border-color: #e7bc72;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-impact-card__label {
    color: #6f7884;
    font-size: 0.74rem;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-impact-card__value {
    color: #171a1f;
    font-size: 1.65rem;
    line-height: 1.05;
    font-weight: 800;
    letter-spacing: -0.03em;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-impact-card.is-success .leave-balance-impact-card__value {
    color: #119b6b;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-impact-card.is-warning .leave-balance-impact-card__value {
    color: #a9680d;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-impact-card__delta {
    color: #6f7884;
    font-size: 0.82rem;
    font-weight: 700;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-impact-preview__arrow {
    align-self: center;
    color: #45206a;
    font-size: 1.6rem;
    font-weight: 900;
    line-height: 1;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-note-card {
    margin-top: 14px;
    display: grid;
    gap: 0.45rem;
    padding: 14px;
    border: 1px solid #dde3ea;
    border-radius: 16px;
    background: #ffffff;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-note-card .portal-form-control {
    min-height: 110px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-action-button {
    min-height: 52px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-propagation-card {
    padding: 14px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-propagation-card__body {
    margin: 0.35rem 0 0;
}

@media (max-width: 1023px) {
    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-summary-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-boundary-grid,
    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-propagation-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-correction-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-workflow-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-opening-grid {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-impact-preview {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-impact-preview__arrow {
        justify-self: flex-start;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-list__row,
    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-audit-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-page,
    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-admin-shell {
        min-width: 0;
        max-width: 100%;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-shell {
        padding: 0 16px 20px;
        gap: 14px;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-hero {
        padding: 16px;
        border-radius: 18px;
        flex-direction: column;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-hero__title {
        font-size: 1.35rem;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-employee-form {
        align-items: stretch;
        flex-direction: column;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-load-button {
        width: 100%;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-correction-selector {
        justify-content: flex-start;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-tabs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-detail-grid,
    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-boundary-grid,
    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-propagation-grid,
    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-correction-grid,
    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-workflow-grid,
    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-form-grid {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-section-head,
    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-actions {
        align-items: stretch;
        flex-direction: column;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-actions .portal-button {
        width: 100%;
        justify-content: center;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-list__row,
    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-audit-row {
        grid-template-columns: 1fr;
    }
}

body.portal-shell-page.leave-shell.leave-decision-shell,
body.portal-shell-page.leave-shell.leave-decision-shell::before {
    background: #f5f7fa;
}

body.portal-shell-page.leave-shell.leave-decision-shell {
    color-scheme: light;
    --portal-panel-bg: #ffffff;
    --portal-panel-border: #dde3ea;
    --portal-page-bg: #f5f7fa;
}

body.portal-shell-page.leave-shell.leave-decision-shell .portal-content {
    padding-top: 0;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-page {
    width: 100%;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-shell {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 24px 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-back {
    width: fit-content;
    color: #5b2a86;
    font-size: 0.94rem;
    font-weight: 700;
    text-decoration: none;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-back:hover {
    text-decoration: underline;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-hero,
body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-card,
body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-warning-card,
body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-actions-card {
    background: #ffffff;
    border: 1px solid #dde3ea;
    box-shadow: none;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 21px 22px;
    border-radius: 20px;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-hero__copy {
    min-width: 0;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-hero__eyebrow,
body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-section-eyebrow {
    margin: 0 0 0.25rem;
    color: #5b2a86;
    font-size: 0.74rem;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: 0.24em;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-hero__title {
    margin: 0;
    color: #171a1f;
    font-size: 1.6rem;
    line-height: 1.15;
    font-weight: 750;
    letter-spacing: -0.02em;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-hero__subtitle,
body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-section-subtitle,
body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-actions-card__subtitle {
    margin: 0.4rem 0 0;
    color: #4d5662;
    font-size: 0.88rem;
    line-height: 1.5;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-hero__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.9rem;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.42rem 0.75rem;
    border-radius: 999px;
    border: 1px solid #dde3ea;
    background: #f8fafc;
    color: #4d5662;
    font-size: 0.74rem;
    font-weight: 800;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-status-badge.tone--warning {
    background: #fff7e8;
    border-color: #e7bc72;
    color: #80500c;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-status-badge.tone--success {
    background: #e9f7f1;
    border-color: #bde7d5;
    color: #087a52;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-status-badge.tone--danger {
    background: #fff0f0;
    border-color: #f0c7c7;
    color: #9b3737;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-status-badge.tone--purple {
    background: #f1ebf7;
    border-color: #d9cbe8;
    color: #45206a;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-hero__badge {
    flex: 0 0 auto;
    padding: 0.55rem 0.9rem;
    border-radius: 999px;
    border: 1px solid #d9cbe8;
    background: #f1ebf7;
    color: #45206a;
    font-size: 0.78rem;
    font-weight: 800;
    white-space: nowrap;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-summary-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-summary-card {
    padding: 16px;
    border-radius: 18px;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-summary-card__label,
body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-info-card__label {
    color: #4d5662;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-summary-card__value {
    color: #171a1f;
    font-size: 1.65rem;
    line-height: 1.05;
    font-weight: 800;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-summary-card__suffix {
    color: #6f7884;
    font-size: 0.76rem;
    font-weight: 600;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-summary-card.tone--warning .leave-decision-summary-card__value {
    color: #a9680d;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-summary-card.tone--success .leave-decision-summary-card__value {
    color: #119b6b;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-card,
body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-warning-card,
body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-actions-card {
    padding: 20px 22px;
    border-radius: 20px;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-card {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-request-grid,
body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-employee-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-info-card {
    min-width: 0;
    padding: 12px 13px;
    border-radius: 14px;
    border: 1px solid #dde3ea;
    background: #fafbfc;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-info-card--full {
    grid-column: 1 / -1;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-info-card__value {
    color: #171a1f;
    font-size: 0.92rem;
    line-height: 1.45;
    font-weight: 700;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-section-head .leave-decision-section-eyebrow {
    margin-bottom: 0.15rem;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-recalculate {
    flex: 0 0 auto;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-error-banner,
body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-warning-card {
    border-radius: 18px;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-error-banner {
    padding: 0.8rem 0.95rem;
    border: 1px solid #f0c7c7;
    background: #fff0f0;
    color: #9b3737;
    font-size: 0.88rem;
    font-weight: 600;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-warning-card {
    padding: 1rem 1.1rem;
    border-color: #e7bc72;
    background: #fff7e8;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-warning-card__eyebrow {
    margin: 0;
    color: #a9680d;
    font-size: 0.88rem;
    font-weight: 800;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-warning-card__body {
    margin: 0.25rem 0 0;
    color: #68450e;
    font-size: 0.92rem;
    line-height: 1.45;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-edit-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-field {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-control {
    min-height: 48px;
    border-radius: 14px;
    border-color: #cdd5df;
    color: #171a1f;
    background: #ffffff;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-control--readonly {
    background: #fafbfc;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-field__error,
body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-field__meta {
    margin: 0;
    font-size: 0.78rem;
    line-height: 1.35;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-field__error {
    color: #9b3737;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-field__meta {
    color: #6f7884;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-summary-list {
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-summary-list__row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: 0.55rem;
    border-bottom: 1px solid #dde3ea;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-summary-list__row:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-summary-list__row dt,
body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-summary-list__row dd {
    margin: 0;
    font-size: 0.88rem;
    line-height: 1.45;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-summary-list__row dt {
    color: #4d5662;
    font-weight: 700;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-summary-list__row dd {
    color: #171a1f;
    font-weight: 700;
    text-align: right;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-summary-list__row.is-warning dd {
    color: #a9680d;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-summary-list__row.is-success dd {
    color: #119b6b;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-admin-note {
    min-height: 108px;
    resize: vertical;
    border-radius: 14px;
    border-color: #cdd5df;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-admin-note__label {
    margin-bottom: 0.15rem;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-actions-card {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-actions-card__title {
    margin: 0;
    color: #171a1f;
    font-size: 1.02rem;
    line-height: 1.3;
    font-weight: 750;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-actions-card__buttons {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-actions-card__buttons .portal-button {
    min-height: 52px;
    border-radius: 14px;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-button--approve {
    background: #119b6b;
    border-color: #119b6b;
    color: #ffffff;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-button--reject {
    background: #ffffff;
    border-color: #f0c7c7;
    color: #9b3737;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-actions__back {
    color: #171a1f;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-actions-card__note {
    margin: 0;
    color: #6f7884;
    font-size: 0.84rem;
    line-height: 1.4;
}

@media (max-width: 767px) {
    body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-shell {
        padding: 0 16px 16px;
    }

    body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-hero {
        flex-direction: column;
        align-items: flex-start;
        padding: 16px;
    }

    body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-hero__title {
        font-size: 1.35rem;
    }

    body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-summary-card--mobile-hidden {
        display: none;
    }

    body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-card,
    body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-warning-card,
    body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-actions-card {
        padding: 16px;
        border-radius: 18px;
    }

    body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-request-grid,
    body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-employee-grid,
    body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-edit-grid {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-section-head,
    body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-actions-card__buttons {
        flex-direction: column;
        align-items: stretch;
    }

    body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-actions-card__buttons .portal-button,
    body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-recalculate {
        width: 100%;
    }
}

/* Phase 8 final cascade layer: shared Leave presentation only. */
body.portal-shell-page.leave-shell {
    --leave-space-1: 8px;
    --leave-space-2: 12px;
    --leave-space-3: 16px;
    --leave-space-4: 20px;
    --leave-space-5: 24px;
    --leave-surface: #ffffff;
    --leave-border: #dde3ea;
    --leave-text: #171a1f;
    --leave-muted: #4d5662;
    --leave-meta: #6f7884;
}

body.portal-shell-page.leave-shell .leave-page,
body.portal-shell-page.leave-shell .leave-page > *,
body.portal-shell-page.leave-shell .portal-panel,
body.portal-shell-page.leave-shell [class$="-grid"],
body.portal-shell-page.leave-shell [class$="-card"] { min-width: 0; }

body.portal-shell-page.leave-shell .leave-page { gap: var(--leave-space-4); }

body.portal-shell-page.leave-shell .portal-panel,
body.portal-shell-page.leave-shell .leave-apply-form-card,
body.portal-shell-page.leave-shell .leave-apply-actions-card,
body.portal-shell-page.leave-shell .leave-apply-summary-card-panel,
body.portal-shell-page.leave-shell .leave-apply-warning-card,
body.portal-shell-page.leave-shell .leave-my-filters-card,
body.portal-shell-page.leave-shell .leave-my-card,
body.portal-shell-page.leave-shell .leave-admin-toolbar-card,
body.portal-shell-page.leave-shell .leave-balance-card,
body.portal-shell-page.leave-shell .holiday-list {
    border-color: var(--leave-border);
    border-radius: 18px;
}

body.portal-shell-page.leave-shell .leave-home-hero,
body.portal-shell-page.leave-shell .leave-apply-hero,
body.portal-shell-page.leave-shell .leave-my-hero,
body.portal-shell-page.leave-shell .leave-admin-hero,
body.portal-shell-page.leave-shell .leave-decision-hero { gap: var(--leave-space-3); }

body.portal-shell-page.leave-shell .leave-home-title,
body.portal-shell-page.leave-shell .leave-apply-hero__title,
body.portal-shell-page.leave-shell .leave-my-hero__title,
body.portal-shell-page.leave-shell .leave-admin-hero__title,
body.portal-shell-page.leave-shell .leave-decision-hero__title {
    color: var(--leave-text);
    font-size: 1.6rem;
    line-height: 1.16;
    font-weight: 780;
    letter-spacing: -0.02em;
}

body.portal-shell-page.leave-shell .leave-apply-section-head h3,
body.portal-shell-page.leave-shell .leave-decision-actions-card__title,
body.portal-shell-page.leave-shell .leave-balance-list__title,
body.portal-shell-page.leave-shell .holiday-row__name {
    color: var(--leave-text);
    font-size: 1.02rem;
    line-height: 1.3;
    font-weight: 750;
    letter-spacing: 0;
}

body.portal-shell-page.leave-shell .leave-home-hero__subtitle,
body.portal-shell-page.leave-shell .leave-apply-hero__subtitle,
body.portal-shell-page.leave-shell .leave-my-hero__subtitle,
body.portal-shell-page.leave-shell .leave-admin-hero__subtitle,
body.portal-shell-page.leave-shell .leave-decision-hero__subtitle,
body.portal-shell-page.leave-shell .leave-balance-section-subtitle,
body.portal-shell-page.leave-shell .leave-decision-section-subtitle,
body.portal-shell-page.leave-shell .leave-actions-card__subtitle {
    color: var(--leave-muted);
    font-size: 0.92rem;
    line-height: 1.5;
}

body.portal-shell-page.leave-shell .leave-home-hero__eyebrow,
body.portal-shell-page.leave-shell .leave-apply-hero__eyebrow,
body.portal-shell-page.leave-shell .leave-my-hero__eyebrow,
body.portal-shell-page.leave-shell .leave-admin-hero__eyebrow,
body.portal-shell-page.leave-shell .leave-decision-hero__eyebrow,
body.portal-shell-page.leave-shell .leave-balance-section-eyebrow,
body.portal-shell-page.leave-shell .leave-decision-section-eyebrow,
body.portal-shell-page.leave-shell .leave-admin-toolbar-card__eyebrow {
    margin-bottom: 6px;
    font-size: 0.76rem;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: 0.12em;
}

body.portal-shell-page.leave-shell .leave-summary-card,
body.portal-shell-page.leave-shell .leave-apply-summary-card,
body.portal-shell-page.leave-shell .leave-admin-summary-card,
body.portal-shell-page.leave-shell .leave-decision-summary-card,
body.portal-shell-page.leave-shell .leave-balance-summary-card,
body.portal-shell-page.leave-shell .holiday-stat {
    display: flex;
    min-height: 124px;
    padding: var(--leave-space-3);
    flex-direction: column;
    justify-content: space-between;
    gap: var(--leave-space-1);
    border: 1px solid var(--leave-border);
    border-radius: 18px;
    background: var(--leave-surface);
}

body.portal-shell-page.leave-shell .leave-summary-card__label,
body.portal-shell-page.leave-shell .leave-apply-summary-card__label,
body.portal-shell-page.leave-shell .leave-admin-summary-card__label,
body.portal-shell-page.leave-shell .leave-decision-summary-card__label,
body.portal-shell-page.leave-shell .leave-balance-summary-card__label,
body.portal-shell-page.leave-shell .holiday-stat__label {
    color: var(--leave-muted);
    font-size: 0.78rem;
    font-weight: 750;
    letter-spacing: 0.02em;
}

body.portal-shell-page.leave-shell .leave-summary-card__value,
body.portal-shell-page.leave-shell .leave-apply-summary-card__value,
body.portal-shell-page.leave-shell .leave-admin-summary-card__value,
body.portal-shell-page.leave-shell .leave-decision-summary-card__value,
body.portal-shell-page.leave-shell .leave-balance-summary-card__value,
body.portal-shell-page.leave-shell .holiday-stat__value {
    color: var(--leave-text);
    font-size: 1.7rem;
    line-height: 1.05;
    font-weight: 800;
    letter-spacing: -0.03em;
}

body.portal-shell-page.leave-shell .leave-summary-card__suffix,
body.portal-shell-page.leave-shell .leave-apply-summary-card__suffix,
body.portal-shell-page.leave-shell .leave-decision-summary-card__suffix,
body.portal-shell-page.leave-shell .leave-balance-summary-card__suffix,
body.portal-shell-page.leave-shell .holiday-stat__support,
body.portal-shell-page.leave-shell .leave-my-detail-card__meta,
body.portal-shell-page.leave-shell .leave-balance-list__meta {
    color: var(--leave-meta);
    font-size: 0.8rem;
    line-height: 1.4;
}

body.portal-shell-page.leave-shell .portal-form-label,
body.portal-shell-page.leave-shell .leave-balance-detail__label,
body.portal-shell-page.leave-shell .leave-my-detail-card__label,
body.portal-shell-page.leave-shell .leave-admin-card__label,
body.portal-shell-page.leave-shell .leave-decision-info-card__label {
    color: var(--leave-muted);
    font-size: 0.82rem;
    line-height: 1.3;
    font-weight: 750;
    letter-spacing: 0.01em;
}

body.portal-shell-page.leave-shell .portal-form-control,
body.portal-shell-page.leave-shell .holiday-controls input,
body.portal-shell-page.leave-shell .holiday-controls select,
body.portal-shell-page.leave-shell .holiday-dialog input,
body.portal-shell-page.leave-shell .holiday-dialog select {
    min-height: 46px;
    border-color: #cdd5df;
    border-radius: 14px;
    color: var(--leave-text);
    background: #ffffff;
    box-shadow: none;
}

body.portal-shell-page.leave-shell .portal-form-control:focus,
body.portal-shell-page.leave-shell .holiday-controls input:focus,
body.portal-shell-page.leave-shell .holiday-controls select:focus,
body.portal-shell-page.leave-shell .holiday-dialog input:focus,
body.portal-shell-page.leave-shell .holiday-dialog select:focus {
    border-color: #5b2a86;
    outline: 3px solid rgba(91, 42, 134, 0.16);
    outline-offset: 1px;
}

body.portal-shell-page.leave-shell .portal-button {
    min-height: 46px;
    padding-inline: 18px;
    border-radius: 14px;
    font-weight: 750;
}

body.portal-shell-page.leave-shell .portal-button--ghost {
    border-color: #d3dbe6;
    color: var(--leave-text);
    background: #ffffff;
}

body.portal-shell-page.leave-shell .leave-decision-button--approve,
body.portal-shell-page.leave-shell .portal-button--success {
    border-color: #119b6b;
    background: #119b6b;
    color: #ffffff;
}

body.portal-shell-page.leave-shell .leave-decision-button--reject {
    border-color: #e6b8bd;
    background: #ffffff;
    color: #b63f50;
}

body.portal-shell-page.leave-shell .leave-balance-status,
body.portal-shell-page.leave-shell .leave-my-status-badge,
body.portal-shell-page.leave-shell .leave-admin-status-badge,
body.portal-shell-page.leave-shell .leave-admin-limit-badge,
body.portal-shell-page.leave-shell .leave-decision-status-badge,
body.portal-shell-page.leave-shell .holiday-type {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: 0.78rem;
    line-height: 1.1;
    font-weight: 750;
}

body.portal-shell-page.leave-shell .leave-success-banner,
body.portal-shell-page.leave-shell .leave-apply-error-banner,
body.portal-shell-page.leave-shell .leave-decision-error-banner,
body.portal-shell-page.leave-shell .leave-balance-field__error,
body.portal-shell-page.leave-shell .leave-apply-warning-card,
body.portal-shell-page.leave-shell .leave-decision-warning-card,
body.portal-shell-page.leave-shell .leave-my-empty-state,
body.portal-shell-page.leave-shell .leave-admin-empty-state,
body.portal-shell-page.leave-shell .leave-balance-empty {
    border-radius: 14px;
    line-height: 1.5;
}

body.portal-shell-page.leave-shell .leave-actions-card__buttons,
body.portal-shell-page.leave-shell .leave-apply-actions-card__buttons,
body.portal-shell-page.leave-shell .leave-balance-actions,
body.portal-shell-page.leave-shell .leave-decision-actions-card__buttons,
body.portal-shell-page.leave-shell .holiday-actions { gap: 10px; }

@media (max-width: 1024px) {
    body.portal-shell-page.leave-shell .leave-summary-card,
    body.portal-shell-page.leave-shell .leave-apply-summary-card,
    body.portal-shell-page.leave-shell .leave-admin-summary-card,
    body.portal-shell-page.leave-shell .leave-decision-summary-card,
    body.portal-shell-page.leave-shell .leave-balance-summary-card,
    body.portal-shell-page.leave-shell .holiday-stat { min-height: 116px; }
}

@media (max-width: 767px) {
    body.portal-shell-page.leave-shell .leave-home-title,
    body.portal-shell-page.leave-shell .leave-apply-hero__title,
    body.portal-shell-page.leave-shell .leave-my-hero__title,
    body.portal-shell-page.leave-shell .leave-admin-hero__title,
    body.portal-shell-page.leave-shell .leave-decision-hero__title { font-size: 1.38rem; }

    body.portal-shell-page.leave-shell .leave-summary-card,
    body.portal-shell-page.leave-shell .leave-apply-summary-card,
    body.portal-shell-page.leave-shell .leave-admin-summary-card,
    body.portal-shell-page.leave-shell .leave-decision-summary-card,
    body.portal-shell-page.leave-shell .leave-balance-summary-card,
    body.portal-shell-page.leave-shell .holiday-stat {
        min-height: 108px;
        padding: 16px;
    }

    body.portal-shell-page.leave-shell .leave-actions-card__buttons,
    body.portal-shell-page.leave-shell .leave-apply-actions-card__buttons,
    body.portal-shell-page.leave-shell .leave-balance-actions,
    body.portal-shell-page.leave-shell .leave-decision-actions-card__buttons {
        align-items: stretch;
        flex-direction: column;
    }

    body.portal-shell-page.leave-shell .leave-actions-card__buttons .portal-button,
    body.portal-shell-page.leave-shell .leave-apply-actions-card__buttons .portal-button,
    body.portal-shell-page.leave-shell .leave-balance-actions .portal-button,
    body.portal-shell-page.leave-shell .leave-decision-actions-card__buttons .portal-button { width: 100%; }
}

/* Phase 8 Batch 2: employee Leave information hierarchy. */
body.portal-shell-page.leave-shell .leave-summary-card:nth-child(3),
body.portal-shell-page.leave-shell .leave-summary-card:nth-child(5) {
    border-color: #d4c5e5;
    background: #fcfaff;
}

body.portal-shell-page.leave-shell .leave-summary-card:nth-child(3) .leave-summary-card__value,
body.portal-shell-page.leave-shell .leave-summary-card:nth-child(5) .leave-summary-card__value {
    color: #45206a;
    font-size: 1.9rem;
}

body.portal-shell-page.leave-shell .leave-summary-card:nth-child(5) {
    background: #fffaf2;
    border-color: #edd2ad;
}

body.portal-shell-page.leave-shell .leave-summary-card:nth-child(5) .leave-summary-card__value {
    color: #a9680d;
}

body.portal-shell-page.leave-shell .leave-actions-card,
body.portal-shell-page.leave-shell .leave-admin-card,
body.portal-shell-page.leave-shell .leave-position-card {
    padding: var(--leave-space-4);
    border-radius: 18px;
}

body.portal-shell-page.leave-shell .leave-actions-card__buttons {
    justify-content: flex-start;
}

body.portal-shell-page.leave-shell .leave-action-button--primary {
    min-width: 180px;
}

body.portal-shell-page.leave-shell .leave-action-button--secondary {
    border-color: #d3dbe6;
    background: #ffffff;
    color: #171a1f;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-form__grid {
    gap: var(--leave-space-3);
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-calculation-card {
    padding: var(--leave-space-3);
    border-radius: 16px;
    border-color: #d9cbe8;
    background: #fcfaff;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-calculation-list__row,
body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-summary-list__row {
    padding-block: 10px;
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-summary-card-panel,
body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-warning-card {
    padding: var(--leave-space-4);
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-actions-card {
    align-items: center;
    padding: var(--leave-space-4);
}

body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-actions-card__buttons {
    flex-direction: row-reverse;
    justify-content: flex-start;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-list {
    gap: var(--leave-space-3);
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-filters-card {
    padding: var(--leave-space-4);
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary {
    padding: 18px 20px;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary-grid {
    grid-template-columns: minmax(0, 1.45fr) auto minmax(90px, 0.55fr) minmax(118px, 0.78fr);
    gap: 12px 16px;
    align-items: center;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary-block--dates .leave-my-card__summary-value {
    font-size: 1.04rem;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary-block--request .leave-my-card__summary-value,
body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary-block--request .leave-my-card__summary-label {
    color: #6f7884;
    font-size: 0.76rem;
    font-weight: 700;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary-block--quantity {
    padding-left: 16px;
    border-left: 1px solid #e5e9ee;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary-block--request {
    justify-self: end;
    text-align: right;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__body {
    gap: var(--leave-space-3);
    padding: 18px 20px 20px;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-detail-group {
    display: grid;
    gap: 10px;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-detail-group__title {
    margin: 0;
    color: #4d5662;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-detail-group--split {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-detail-group--metadata {
    padding-top: 2px;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-detail-group__meta {
    margin: 0;
    color: #6f7884;
    font-size: 0.8rem;
    line-height: 1.4;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-detail-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-detail-card {
    padding: 14px 16px;
    border-radius: 14px;
}

body.portal-shell-page.leave-shell.leave-my-shell .leave-my-detail-card--full {
    grid-column: auto;
}

@media (max-width: 767px) {
    body.portal-shell-page.leave-shell .leave-summary-card:nth-child(3) .leave-summary-card__value,
    body.portal-shell-page.leave-shell .leave-summary-card:nth-child(5) .leave-summary-card__value {
        font-size: 1.65rem;
    }

    body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-actions-card {
        align-items: stretch;
    }

    body.portal-shell-page.leave-shell.leave-apply-shell .leave-apply-actions-card__buttons {
        flex-direction: column;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas: "content chevron";
        align-items: center;
        padding: 16px;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary-grid {
        grid-area: content;
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "dates status"
            "quantity quantity"
            "request request";
        gap: 10px 12px;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary-block--dates {
        grid-area: dates;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-status-badge {
        grid-area: status;
        justify-self: end;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary-block--quantity {
        grid-area: quantity;
        padding-left: 0;
        border-left: 0;
        justify-self: start;
        text-align: left;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__summary-block--request {
        grid-area: request;
        grid-row: auto;
        min-width: 0;
        justify-self: start;
        text-align: left;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__chevron {
        grid-area: chevron;
        margin-top: 0;
        align-self: center;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-card__body {
        padding: 16px;
    }

    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-detail-grid,
    body.portal-shell-page.leave-shell.leave-my-shell .leave-my-detail-group--split {
        grid-template-columns: 1fr;
    }
}

/* Phase 8 Batch 3: Admin review and decision hierarchy. */
body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__grid {
    grid-template-columns: minmax(150px, 1.15fr) minmax(130px, 1fr) minmax(82px, 0.55fr) minmax(145px, 0.85fr) minmax(112px, 0.7fr) minmax(112px, 0.7fr) auto;
    grid-template-areas: "employee dates quantity badges impact request chevron";
    gap: 14px;
    padding: 18px 20px;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__employee { grid-area: employee; }
body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__block--dates { grid-area: dates; }
body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__block--quantity { grid-area: quantity; }
body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__badges { grid-area: badges; }
body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__impact {
    grid-area: impact;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    min-width: 0;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__block--request {
    grid-area: request;
    min-width: 0;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__block--request strong {
    color: #6f7884;
    font-size: 0.8rem;
    font-weight: 700;
    overflow-wrap: anywhere;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__chevron { grid-area: chevron; }

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__badges {
    align-content: center;
}

body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__impact {
    padding-left: 14px;
    border-left: 1px solid #e5e9ee;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-form {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(280px, 0.92fr);
    gap: 16px;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-card--edit,
body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-warning-card,
body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-card--note,
body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-actions-card { grid-column: 1 / -1; }

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-card--employee { grid-column: 1; }
body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-card--impact { grid-column: 2; }

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-card--impact {
    border-color: #d9cbe8;
    background: #fcfaff;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-card--note {
    padding: 20px;
    background: #fafbfc;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-actions-card {
    padding: 20px;
    border-color: #d9cbe8;
}

body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-summary-list__row {
    gap: 14px;
}

@media (max-width: 1024px) {
    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__grid {
        grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) auto;
        grid-template-areas:
            "employee dates chevron"
            "quantity badges impact"
            "request request request";
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__impact {
        padding-left: 0;
        border-left: 0;
    }
}

@media (max-width: 767px) {
    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__grid {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "employee chevron"
            "dates dates"
            "badges badges"
            "quantity impact"
            "request request";
        gap: 12px;
        padding: 16px;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__employee,
    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__block,
    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__badges,
    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__impact,
    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__chevron {
        grid-column: auto;
        grid-row: auto;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell .leave-admin-card__impact {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-form {
        grid-template-columns: 1fr;
    }

    body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-card--employee,
    body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-card--impact,
    body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-card--edit,
    body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-warning-card,
    body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-card--note,
    body.portal-shell-page.leave-shell.leave-decision-shell .leave-decision-actions-card { grid-column: 1; }
}

/* Phase 8 Batch 4: current balance and history-specific hierarchy. */
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-employee-card {
    padding: 18px 20px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-card--truth-current {
    border-color: #d9cbe8;
    background: #fcfaff;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-card--truth-current .leave-balance-detail:nth-child(3),
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-card--truth-current .leave-balance-detail:nth-child(4),
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-card--truth-current .leave-balance-detail:nth-child(6) {
    border-color: #d9cbe8;
    background: #ffffff;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-card--truth-current .leave-balance-detail:nth-child(6) .leave-balance-detail__value {
    color: #45206a;
    font-size: 1.25rem;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-card--ledger,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-card--requests {
    padding: 20px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-list__row--ledger {
    grid-template-columns: minmax(150px, 1.1fr) minmax(90px, 0.55fr) minmax(110px, 0.7fr) minmax(105px, 0.65fr) minmax(130px, 0.85fr);
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-list__row--ledger .leave-balance-list__title {
    color: #171a1f;
    font-size: 0.96rem;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-list__row--request {
    grid-template-columns: minmax(155px, 1.1fr) minmax(85px, 0.5fr) minmax(100px, 0.62fr) minmax(130px, 0.9fr) minmax(180px, 1.25fr);
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-list__row--request .leave-balance-list__title {
    color: #171a1f;
    font-size: 0.96rem;
}

/* Keep lengthy audit evidence in its own readable column rather than allowing it to cross adjacent cells. */
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-audit-row {
    grid-template-columns: minmax(150px, 1fr) minmax(180px, 1.35fr) auto minmax(150px, 1fr) minmax(180px, 1.35fr);
    grid-template-areas: "event summary status reference reason";
    gap: 14px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-audit-row > * {
    min-width: 0;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-audit-row__event { grid-area: event; }
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-audit-row__summary { grid-area: summary; }
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-audit-row__status { grid-area: status; align-self: center; }
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-audit-row__reference { grid-area: reference; }
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-audit-row__reason { grid-area: reason; }

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-audit-row__summary strong,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-audit-row__reference p,
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-audit-row__reason p {
    display: block;
    overflow-wrap: anywhere;
    word-break: break-word;
}

@media (max-width: 1024px) {
    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-audit-row {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr) auto;
        grid-template-areas:
            "event summary status"
            "reference reason reason";
    }
}

@media (max-width: 767px) {
    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-card--audit { padding: 16px; }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-audit-row {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas:
            "event"
            "summary"
            "status"
            "reason"
            "reference";
        gap: 10px;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-audit-row__status { justify-self: start; }
}

/* Phase 8: retain the established correction workflow while making its controlled sequence easier to scan. */
body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-corrections--workspace {
    gap: 20px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-section-head--mode {
    padding: 16px 18px;
    border: 1px solid #dde3ea;
    border-radius: 18px;
    background: #ffffff;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-section-head--mode .leave-balance-section-subtitle {
    max-width: 42rem;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-correction-selector {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    width: min(100%, 38rem);
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-correction-selector__pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    min-height: 42px;
    padding-inline: 0.7rem;
    text-align: center;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-correction-selector__pill.is-active {
    border-color: #5b2a86;
    background: #5b2a86;
    color: #ffffff;
    box-shadow: none;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-card--correction-workspace {
    padding: 22px;
    border-color: #d9cbe8;
    box-shadow: 0 1px 3px rgba(69, 32, 106, 0.05);
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-card--correction-workspace .leave-balance-section-head {
    padding-bottom: 16px;
    border-bottom: 1px solid #e5e9ee;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-opening-grid > .leave-balance-detail--input {
    background: #ffffff;
    border-color: #d9cbe8;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-opening-grid > .leave-balance-detail:not(.leave-balance-detail--input) {
    background: #f5f7fa;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-workflow-grid {
    gap: 14px;
    margin-top: 18px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-workflow-card--current {
    border-top: 3px solid #6f7884;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-workflow-card--proposed {
    border-top: 3px solid #5b2a86;
    background: #faf7fd;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-workflow-card--impact {
    border-top: 3px solid #119b6b;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-workflow-card__row {
    align-items: baseline;
    border-top-color: #e5e9ee;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-workflow-card__row strong {
    min-width: 0;
    overflow-wrap: anywhere;
    text-align: right;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-impact-preview {
    margin-top: 18px;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-impact-card--current {
    background: #f5f7fa;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-note-card {
    margin-top: 18px;
    padding: 16px;
    border-color: #d9cbe8;
    background: #faf7fd;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-preview-button {
    border-color: #5b2a86;
    color: #45206a;
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-apply-button {
    background: #5b2a86;
    border-color: #5b2a86;
}

@media (max-width: 1024px) {
    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-section-head--mode {
        align-items: stretch;
        flex-direction: column;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-correction-selector {
        width: 100%;
    }
}

@media (max-width: 767px) {
    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-section-head--mode,
    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-card--correction-workspace {
        padding: 16px;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-correction-selector {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-workflow-card__row {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.2rem;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-workflow-card__row strong {
        text-align: left;
    }
}

body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-list__row--request .leave-balance-request-text {
    padding-left: 14px;
    border-left: 1px solid #e5e9ee;
}

@media (max-width: 767px) {
    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-employee-card,
    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-card--ledger,
    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-card--requests { padding: 16px; }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-list__row--ledger,
    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-list__row--request {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    body.portal-shell-page.leave-shell.leave-admin-shell.leave-balance-shell .leave-balance-list__row--request .leave-balance-request-text {
        padding-left: 0;
        border-left: 0;
        padding-top: 12px;
        border-top: 1px solid #e5e9ee;
    }
}
/* Salary UI shared foundation: presentation-only; P2/P3/P5-P8 remain authoritative. */
body.portal-shell-page .salary-ui__summary,
body.portal-shell-page .salary-ui__comparison,
body.portal-shell-page .salary-ui__surface-state {
    border: 1px solid #d7dfef;
    border-radius: 18px;
    background: #fff;
}

body.portal-shell-page .salary-ui-preview { display: grid; gap: 20px; }
body.portal-shell-page .salary-ui-preview__notice { padding: 13px 16px; border: 1px solid #b9cdf1; border-radius: 14px; color: #244d87; background: #f1f7ff; font-size: .9rem; line-height: 1.5; }
body.portal-shell-page .salary-ui-preview__summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
body.portal-shell-page .salary-ui-preview__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
body.portal-shell-page .salary-ui-preview__grid--states { grid-template-columns: repeat(2, minmax(0, 1fr)); }
body.portal-shell-page .salary-ui-preview__card,
body.portal-shell-page .salary-ui-preview__form-card { display: grid; gap: 14px; padding: 20px; }
body.portal-shell-page .salary-ui-preview__card h3,
body.portal-shell-page .salary-ui-preview__form-card h3 { margin: 0; color: #172033; font-size: 1.05rem; }
body.portal-shell-page .salary-ui-preview__support { margin: 0; color: #52627b; font-size: .9rem; line-height: 1.55; }
body.portal-shell-page .salary-ui-preview__form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px; align-items: end; }
body.portal-shell-page .salary-ui-preview__actions { display: flex; flex-wrap: wrap; gap: 10px; }

@media (max-width: 960px) {
    body.portal-shell-page .salary-ui-preview__summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
    body.portal-shell-page .salary-ui-preview__summary-grid,
    body.portal-shell-page .salary-ui-preview__grid,
    body.portal-shell-page .salary-ui-preview__grid--states,
    body.portal-shell-page .salary-ui-preview__form { grid-template-columns: 1fr; }
    body.portal-shell-page .salary-ui-preview__form { align-items: stretch; }
    body.portal-shell-page .salary-ui-preview__actions > * { flex: 1 1 150px; }
}

body.portal-shell-page .salary-ui__visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

body.portal-shell-page .salary-ui__request-reference {
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: bottom;
    white-space: nowrap;
}

body.portal-shell-page .salary-ui__summary {
    display: grid;
    gap: 10px;
    min-width: 0;
    padding: 20px;
}

body.portal-shell-page .salary-ui__summary-head,
body.portal-shell-page .salary-ui__state-pair,
body.portal-shell-page .salary-ui__dialog-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    justify-content: space-between;
}

body.portal-shell-page .salary-ui__eyebrow {
    color: #52627b;
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .045em;
    text-transform: uppercase;
}

body.portal-shell-page .salary-ui__summary-value {
    color: #172033;
    font-size: clamp(1.5rem, 3vw, 2.1rem);
    line-height: 1.05;
}

body.portal-shell-page .salary-ui__summary-support,
body.portal-shell-page .salary-ui__section-head p,
body.portal-shell-page .salary-ui__surface-state p,
body.portal-shell-page .salary-ui__field-help,
body.portal-shell-page .salary-ui__dialog-summary {
    color: #52627b;
    font-size: .9rem;
    line-height: 1.55;
}

body.portal-shell-page .salary-ui__summary-support { margin: 0; }

body.portal-shell-page .salary-ui__status {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    max-width: 100%;
    border: 1px solid currentColor;
    border-radius: 999px;
    padding: 5px 9px;
    color: #455b79;
    background: #f7f9fc;
    font-size: .76rem;
    font-weight: 750;
    line-height: 1.15;
}

body.portal-shell-page .salary-ui__status-label { font-size: .68rem; opacity: .8; text-transform: uppercase; }
body.portal-shell-page .salary-ui__status--lifecycle { color: #5b2a86; background: #f4ecfa; }
body.portal-shell-page .salary-ui__status--financial { color: #006c63; background: #e7f7f3; }
body.portal-shell-page .salary-ui__status--coverage,
body.portal-shell-page .salary-ui__status--warning { color: #8a5400; background: #fff7e8; }
body.portal-shell-page .salary-ui__status--success { color: #067647; background: #e9f9ee; }
body.portal-shell-page .salary-ui__status--danger,
body.portal-shell-page .salary-ui__status--locked,
body.portal-shell-page .salary-ui__status--permission { color: #b42318; background: #fff1f0; }

body.portal-shell-page .salary-ui__comparison { overflow: hidden; }
body.portal-shell-page .salary-ui__section-head { padding: 20px 20px 0; }
body.portal-shell-page .salary-ui__section-head h3,
body.portal-shell-page .salary-ui__surface-state h3 { margin: 0; color: #172033; font-size: 1rem; }
body.portal-shell-page .salary-ui__section-head p { margin: 6px 0 0; }
body.portal-shell-page .salary-ui__comparison-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr);
    gap: 0;
    margin: 16px 20px;
}
body.portal-shell-page .salary-ui__comparison-side { min-width: 0; padding: 16px; }
body.portal-shell-page .salary-ui__comparison-side--requested { background: #eff6ff; border-radius: 14px 0 0 14px; }
body.portal-shell-page .salary-ui__comparison-side--approved { background: #edf9f5; border-radius: 0 14px 14px 0; }
body.portal-shell-page .salary-ui__comparison-divider { background: #d7dfef; }
body.portal-shell-page .salary-ui__comparison-side dt { color: #52627b; font-size: .78rem; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; }
body.portal-shell-page .salary-ui__comparison-side dd { margin: 8px 0 0; color: #172033; font-size: 1.1rem; font-weight: 800; overflow-wrap: anywhere; }
body.portal-shell-page .salary-ui__comparison-note { margin: 0 20px 20px; color: #52627b; font-size: .88rem; }

body.portal-shell-page .salary-ui__surface-state {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 14px;
    padding: 20px;
}
body.portal-shell-page .salary-ui__surface-state-icon {
    display: grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border-radius: 50%;
    color: #455b79;
    background: #eff3f9;
    font-weight: 900;
}
body.portal-shell-page .salary-ui__surface-state p { margin: 6px 0 0; }
body.portal-shell-page .salary-ui__surface-state-action { margin-top: 14px; }
body.portal-shell-page .salary-ui__surface-state--error,
body.portal-shell-page .salary-ui__surface-state--permission,
body.portal-shell-page .salary-ui__surface-state--locked { border-color: #f1b7b3; background: #fff8f7; }
body.portal-shell-page .salary-ui__surface-state--error .salary-ui__surface-state-icon,
body.portal-shell-page .salary-ui__surface-state--permission .salary-ui__surface-state-icon,
body.portal-shell-page .salary-ui__surface-state--locked .salary-ui__surface-state-icon { color: #b42318; background: #ffebe9; }
body.portal-shell-page .salary-ui__surface-state--stale { border-color: #f0c36f; background: #fffaf0; }
body.portal-shell-page .salary-ui__surface-state--stale .salary-ui__surface-state-icon { color: #8a5400; background: #fff0cd; }
body.portal-shell-page .salary-ui__surface-state--success { border-color: #a8ddbc; background: #f2fcf5; }
body.portal-shell-page .salary-ui__surface-state--success .salary-ui__surface-state-icon { color: #067647; background: #dff7e7; }

body.portal-shell-page .salary-ui__field { display: grid; gap: 7px; }
body.portal-shell-page .salary-ui__field > label { color: #172033; font-size: .9rem; font-weight: 750; }
body.portal-shell-page .salary-ui__field-help,
body.portal-shell-page .salary-ui__field-error { margin: 0; }
body.portal-shell-page .salary-ui__field-error { color: #b42318; font-size: .86rem; }
body.portal-shell-page .salary-ui__field.has-error input,
body.portal-shell-page .salary-ui__field.has-error select,
body.portal-shell-page .salary-ui__field.has-error textarea { border-color: #c4322b; }

body.portal-shell-page .salary-ui__dialog {
    width: min(620px, calc(100vw - 32px));
    max-height: calc(100dvh - 32px);
    border: 0;
    border-radius: 20px;
    padding: 0;
    color: #172033;
    box-shadow: 0 24px 70px rgb(23 32 51 / .38);
}
body.portal-shell-page .salary-ui__dialog::backdrop { background: rgb(23 32 51 / .62); }
body.portal-shell-page .salary-ui__dialog-frame { display: grid; gap: 18px; padding: 24px; }
body.portal-shell-page .salary-ui__dialog-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
body.portal-shell-page .salary-ui__dialog-head h2 { margin: 5px 0 0; font-size: 1.3rem; }
body.portal-shell-page .salary-ui__dialog-close { width: 36px; height: 36px; border: 0; border-radius: 50%; color: #455b79; background: #f0f4fa; font-size: 1.5rem; line-height: 1; }
body.portal-shell-page .salary-ui__dialog-summary { margin: -6px 0 0; }
body.portal-shell-page .salary-ui__dialog-body { padding: 16px; border: 1px solid #d7dfef; border-radius: 14px; background: #f8faff; }
body.portal-shell-page .salary-ui__dialog-actions { justify-content: flex-end; }
body.portal-shell-page .salary-ui__button--danger { background: #b42318; }

/* Employee Salary Advance surfaces reuse the shared Salary UI primitives. */
body.portal-shell-page .salary-employee-page { display: grid; gap: 22px; max-width: 1440px; margin: 0 auto; padding: 8px 0 34px; }
body.portal-shell-page .salary-employee-hero { padding: 30px; border: 1px solid #d7dfef; border-radius: 22px; background: linear-gradient(135deg, #fff 0%, #f8f4ff 100%); }
body.portal-shell-page .salary-employee-hero h2 { margin: 5px 0 8px; color: #172033; font-size: clamp(1.75rem, 3vw, 2.6rem); }
body.portal-shell-page .salary-employee-hero > p:not(.salary-ui__eyebrow) { margin: 0; color: #52627b; max-width: 760px; }
body.portal-shell-page .salary-employee-steps { display: flex; flex-wrap: wrap; gap: 12px 26px; margin: 26px 0 0; padding: 0; list-style: none; color: #52627b; font-weight: 750; }
body.portal-shell-page .salary-employee-steps li { display: flex; align-items: center; gap: 8px; }
body.portal-shell-page .salary-employee-steps li::first-letter { display: inline-grid; place-items: center; }
body.portal-shell-page .salary-employee-steps .is-current { color: #5b2a86; }
body.portal-shell-page .salary-employee-steps .is-complete { color: #067647; }
body.portal-shell-page .salary-employee-card { display: grid; gap: 16px; padding: 26px; border: 1px solid #d7dfef; border-radius: 20px; background: #fff; }
body.portal-shell-page .salary-employee-card h2, body.portal-shell-page .salary-employee-card h3 { margin: 4px 0 0; color: #172033; }
body.portal-shell-page .salary-employee-intro { margin: -6px 0 2px; color: #52627b; }
body.portal-shell-page .salary-employee-grid { display: grid; gap: 16px; }
body.portal-shell-page .salary-employee-grid--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
body.portal-shell-page .salary-employee-read, body.portal-shell-page .salary-employee-facts > div, body.portal-shell-page .salary-employee-balance { display: grid; gap: 6px; padding: 16px; border-radius: 14px; background: #f5f8fd; }
body.portal-shell-page .salary-employee-read span, body.portal-shell-page .salary-employee-facts span, body.portal-shell-page .salary-employee-request-amount span, body.portal-shell-page .salary-employee-plan span, body.portal-shell-page .salary-employee-details dt, body.portal-shell-page .salary-employee-balance span { color: #52627b; font-size: .75rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
body.portal-shell-page .salary-employee-read strong, body.portal-shell-page .salary-employee-facts strong { color: #172033; font-size: 1.05rem; }
body.portal-shell-page .salary-employee-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 12px; }
body.portal-shell-page .salary-employee-actions--start { justify-content: flex-start; margin-top: 20px; }
body.portal-shell-page .salary-employee-section-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
body.portal-shell-page .salary-employee-plan { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px; }
body.portal-shell-page .salary-employee-plan > div { display: flex; justify-content: space-between; gap: 10px; padding: 12px; border-radius: 12px; background: #f9f7fc; }
body.portal-shell-page .salary-employee-plan strong { color: #172033; }
body.portal-shell-page .salary-employee-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
body.portal-shell-page .salary-employee-summary-grid--requests { grid-template-columns: minmax(220px, .8fr) minmax(0, 1.2fr); }
body.portal-shell-page .salary-employee-request-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: center; align-content: center; gap: 16px; height: 100%; box-sizing: border-box; }
body.portal-shell-page .salary-employee-request-summary > div { display: grid; gap: 4px; min-width: 0; }
body.portal-shell-page .salary-employee-request-summary span { color: #52627b; font-size: .75rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
body.portal-shell-page .salary-employee-request-summary strong { color: #172033; font-size: 1.2rem; }
body.portal-shell-page .salary-employee-request-management { display: grid; gap: 12px; }
body.portal-shell-page .salary-employee-quick-filters { display: flex; flex-wrap: wrap; gap: 8px; }
body.portal-shell-page .salary-employee-quick-filters a { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 6px 10px; border: 1px solid #d7dfef; border-radius: 999px; color: #43516a; background: #fff; font-size: .875rem; font-weight: 700; text-decoration: none; }
body.portal-shell-page .salary-employee-quick-filters a:hover, body.portal-shell-page .salary-employee-quick-filters a:focus-visible, body.portal-shell-page .salary-employee-quick-filters a.is-active { color: #4d218a; border-color: #9f7aea; background: #f5efff; outline: none; }
body.portal-shell-page .salary-employee-quick-filters strong { font-size: .78rem; }
body.portal-shell-page .salary-employee-filters form { display: grid; grid-template-columns: minmax(220px, 2fr) minmax(180px, 1fr) auto; align-items: end; gap: 14px; }
body.portal-shell-page .salary-employee-filter-actions { display: flex; gap: 10px; }
body.portal-shell-page .salary-employee-request-list { display: grid; gap: 10px; }
body.portal-shell-page .salary-employee-request-card { display: grid; grid-template-columns: minmax(180px, 1.5fr) minmax(165px, 1fr) minmax(110px, auto) auto; align-items: center; gap: 16px; min-width: 0; padding: 14px 16px; border: 1px solid #d7dfef; border-radius: 16px; background: #fff; }
body.portal-shell-page .salary-employee-request-card__identity { min-width: 0; }
body.portal-shell-page .salary-employee-request-card p { margin: 0; color: #52627b; }
body.portal-shell-page .salary-employee-reference, body.portal-shell-page .salary-employee-request-card__meta { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.portal-shell-page .salary-employee-reference { color: #172033 !important; font-size: 1rem; font-weight: 850; }
body.portal-shell-page .salary-employee-request-card__meta { margin-top: 4px !important; font-size: .86rem; }
body.portal-shell-page .salary-employee-request-card__states { flex-wrap: nowrap; min-width: 0; overflow: hidden; }
body.portal-shell-page .salary-employee-request-card__states .salary-ui__status { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.portal-shell-page .salary-employee-request-amount { display: flex; align-items: center; justify-content: flex-end; gap: 10px; min-width: 0; }
body.portal-shell-page .salary-employee-request-amount strong { color: #172033; font-size: 1rem; white-space: nowrap; }
body.portal-shell-page .salary-employee-back { width: fit-content; color: #314563; font-weight: 750; text-decoration: none; }
body.portal-shell-page .salary-employee-detail-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(300px, .8fr); gap: 20px; align-items: start; }
body.portal-shell-page .salary-employee-detail-grid > div, body.portal-shell-page .salary-employee-detail-grid > aside { display: grid; gap: 20px; }
body.portal-shell-page .salary-employee-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 0; }
body.portal-shell-page .salary-employee-details > div { padding: 12px; border-radius: 12px; background: #f8faff; }
body.portal-shell-page .salary-employee-details dd { margin: 7px 0 0; color: #172033; font-weight: 700; overflow-wrap: anywhere; }
body.portal-shell-page .salary-employee-balance { margin-top: 14px; }
body.portal-shell-page .salary-employee-balance strong { color: #172033; font-size: 1.55rem; }
body.portal-shell-page .salary-employee-request-context { grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 18px 22px; }
body.portal-shell-page .salary-employee-request-context > div:last-child { display: grid; justify-items: end; gap: 8px; }
body.portal-shell-page .salary-employee-request-context strong { color: #172033; font-size: 1rem; }
body.portal-shell-page .salary-employee-request-context p { margin: 4px 0 0; color: #52627b; }
body.portal-shell-page .salary-employee-request-context .salary-employee-actions--start { margin-top: 0; }
body.portal-shell-page .salary-employee-operational-grid { display: grid; grid-template-columns: minmax(220px, .7fr) minmax(0, 1.3fr); gap: 20px; align-items: stretch; }
body.portal-shell-page .salary-employee-card--outstanding { align-content: center; gap: 8px; }
body.portal-shell-page .salary-employee-outstanding { color: #172033; font-size: clamp(1.8rem, 3vw, 2.4rem); line-height: 1.05; }
body.portal-shell-page .salary-employee-card--plan { gap: 10px; }
body.portal-shell-page .salary-employee-plan-table { width: 100%; border-collapse: separate; border-spacing: 0 4px; table-layout: fixed; }
body.portal-shell-page .salary-employee-plan-table th { padding: 0 12px 4px; color: #52627b; font-size: .75rem; font-weight: 800; letter-spacing: .04em; text-align: left; text-transform: uppercase; }
body.portal-shell-page .salary-employee-plan-table th:last-child { text-align: right; }
body.portal-shell-page .salary-employee-plan-table td { padding: 10px 12px; color: #172033; font-weight: 700; }
body.portal-shell-page .salary-employee-plan-table tbody tr:nth-child(odd) td { background: #f9f7fc; }
body.portal-shell-page .salary-employee-plan-table tbody tr:nth-child(even) td { background: #f4f7fc; }
body.portal-shell-page .salary-employee-plan-table td:first-child { border-radius: 10px 0 0 10px; }
body.portal-shell-page .salary-employee-plan-table td:last-child { border-radius: 0 10px 10px 0; text-align: right; white-space: nowrap; }
body.portal-shell-page .salary-employee-request-comparison { max-width: 760px; }

@media (max-width: 1120px) {
    body.portal-shell-page .salary-employee-operational-grid { grid-template-columns: 1fr; }
    body.portal-shell-page .salary-employee-card--outstanding { min-height: 0; padding-block: 18px; }
}

/* Employee dashboard, timeline, and settlement compose existing Salary facts. */
body.portal-shell-page .salary-dashboard__hero,
body.portal-shell-page .salary-timeline__head { display: flex; align-items: end; justify-content: space-between; gap: 22px; }
body.portal-shell-page .salary-dashboard__primary-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) minmax(230px, .72fr); gap: 16px; }
body.portal-shell-page .salary-dashboard__metric-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
body.portal-shell-page .salary-dashboard__content-grid,
body.portal-shell-page .salary-settlement__grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 16px; }
body.portal-shell-page .salary-dashboard__year-card { display: grid; align-content: start; gap: 14px; }
body.portal-shell-page .salary-dashboard__year-card p,
body.portal-shell-page .salary-dashboard__section-heading p,
body.portal-shell-page .salary-settlement__action > p { margin: 0; color: #52627b; line-height: 1.55; }
body.portal-shell-page .salary-dashboard__section-heading { display: flex; align-items: start; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
body.portal-shell-page .salary-dashboard__section-heading h3,
body.portal-shell-page .salary-dashboard__activity + h3 { margin: 4px 0 6px; color: #172033; }
body.portal-shell-page .salary-dashboard__section-heading > strong { color: #172033; font-size: 1.45rem; white-space: nowrap; }
body.portal-shell-page .salary-dashboard__activity { display: grid; margin-top: 14px; }
body.portal-shell-page .salary-dashboard__activity > a { display: flex; justify-content: space-between; gap: 16px; align-items: center; padding: 15px 0; color: inherit; text-decoration: none; border-top: 1px solid #e5e9ee; }
body.portal-shell-page .salary-dashboard__activity > a:first-child { border-top: 0; }
body.portal-shell-page .salary-dashboard__activity span { display: grid; gap: 4px; }
body.portal-shell-page .salary-dashboard__activity small { color: #52627b; }
body.portal-shell-page .salary-timeline__head form { width: min(150px, 100%); }
body.portal-shell-page .salary-timeline__legend { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; color: #52627b; font-size: .9rem; }
body.portal-shell-page .salary-timeline__scroll { overflow-x: auto; padding: 0; }
body.portal-shell-page .salary-timeline__scroll table { width: 100%; min-width: 980px; border-collapse: collapse; }
body.portal-shell-page .salary-timeline__scroll th,
body.portal-shell-page .salary-timeline__scroll td { padding: 14px 12px; text-align: right; border-bottom: 1px solid #e5e9ee; white-space: nowrap; }
body.portal-shell-page .salary-timeline__scroll th:first-child { min-width: 190px; text-align: left; }
body.portal-shell-page .salary-timeline__scroll th a { color: #172033; text-decoration: none; }
body.portal-shell-page .salary-timeline__scroll th .salary-ui__status { margin-top: 7px; }
body.portal-shell-page .salary-timeline__scroll thead th { color: #52627b; font-size: .78rem; letter-spacing: .03em; text-transform: uppercase; background: #f5f7fb; }
body.portal-shell-page .salary-timeline__scroll td.salary-timeline__planned { color: #006c63; background: #eefaf6; font-weight: 750; }
body.portal-shell-page .salary-timeline__scroll tfoot { background: #f8f4ff; color: #172033; font-weight: 800; }
body.portal-shell-page .salary-settlement__action { display: grid; gap: 14px; }
body.portal-shell-page .salary-settlement__action h3 { margin: 0; color: #172033; }
body.portal-shell-page .salary-settlement__action form { display: grid; gap: 14px; }
body.portal-shell-page .salary-settlement__action #settlement-help { margin: 0; padding: 13px; border: 1px solid #f0c36f; border-radius: 12px; color: #704700; background: #fffaf0; font-size: .9rem; line-height: 1.5; }
body.portal-shell-page .salary-settlement__review { display: grid; gap: 18px; max-width: 800px; }
body.portal-shell-page .salary-settlement__ack { display: flex; gap: 10px; align-items: flex-start; padding: 14px; border: 1px solid #d7dfef; border-radius: 14px; color: #26344c; line-height: 1.5; }
body.portal-shell-page .salary-settlement__ack input { margin-top: 4px; }
body.portal-shell-page .salary-settlement__completed { display: grid; gap: 18px; }

/* Salary Admin Center and yearly matrix reuse shared Salary presentation. */
body.portal-shell-page .salary-admin-page { display: grid; gap: 20px; }
body.portal-shell-page .salary-admin-hero, body.portal-shell-page .salary-admin-scope, body.portal-shell-page .salary-admin-matrix-link { display: flex; align-items: end; justify-content: space-between; gap: 20px; padding: 26px; border: 1px solid #d7dfef; border-radius: 20px; background: #fff; }
body.portal-shell-page .salary-admin-page .salary-admin-hero { align-items:center; padding:18px 22px; }
body.portal-shell-page .salary-admin-hero h2, body.portal-shell-page .salary-admin-scope h3, body.portal-shell-page .salary-admin-card h3 { margin: 5px 0; color: #172033; }
body.portal-shell-page .salary-admin-hero p:not(.salary-ui__eyebrow), body.portal-shell-page .salary-admin-scope p:not(.salary-ui__eyebrow), body.portal-shell-page .salary-admin-section-head p:not(.salary-ui__eyebrow), body.portal-shell-page .salary-admin-matrix-link p:not(.salary-ui__eyebrow) { margin: 0; color: #52627b; }
body.portal-shell-page .salary-admin-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
body.portal-shell-page .salary-admin-actions > .portal-button { min-height: 48px; }
body.portal-shell-page .salary-workspace-header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 16px; border:1px solid #d7dfef; border-radius:18px; background:#fff; }
body.portal-shell-page .salary-workspace-header h1 { margin:0; color:#172033; font-size:1.2rem; line-height:1.2; }
body.portal-shell-page .salary-workspace-header__controls { display:flex; min-width:0; align-items:center; justify-content:flex-end; gap:8px; }
body.portal-shell-page .salary-workspace-header__period .portal-input { min-height:42px; min-width:132px; padding:.55rem .75rem; border-radius:999px; }
body.portal-shell-page .salary-workspace-header__nav { display:flex; min-width:0; gap:6px; flex-wrap:nowrap; justify-content:flex-end; }
body.portal-shell-page .salary-workspace-header__nav .portal-button { min-height:40px; padding:.5rem .68rem; font-size:.9rem; white-space:nowrap; }
body.portal-shell-page .salary-workspace-header__nav .portal-button.is-active { border-color:#56308c; color:#fff; background:#56308c; }
body.portal-shell-page .salary-workspace-header__mobile-menu { display:none; }
body.portal-shell-page .salary-admin-reporting-period { align-self: flex-end; min-width: 142px; }
body.portal-shell-page .salary-admin-reporting-period .portal-input { min-height: 48px; padding: .78rem .95rem; border-radius: 999px; }
body.portal-shell-page .salary-admin-notifications-action { position: relative; }
body.portal-shell-page .salary-admin-notifications-count { display: inline-grid; min-width: 1.25rem; height: 1.25rem; padding: 0 .3rem; place-items: center; border-radius: 999px; color: #fff; background: #5b2a86; font-size: .72rem; line-height: 1; }

body.portal-shell-page .salary-admin-scope form { width: 200px; }
body.portal-shell-page .salary-admin-scope--compact { justify-content:flex-start; padding:14px 18px; }
body.portal-shell-page .salary-admin-scope > div { flex: 1; padding: 16px; border-radius: 14px; background: #f5f7fb; }
body.portal-shell-page .salary-admin-metric-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 16px; }
body.portal-shell-page .salary-admin-count-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
body.portal-shell-page .salary-admin-card { display: grid; gap: 18px; padding: 24px; border: 1px solid #d7dfef; border-radius: 20px; background: #fff; }
body.portal-shell-page .salary-admin-section-head { display: flex; align-items: start; justify-content: space-between; gap: 18px; }
body.portal-shell-page .salary-admin-quick-filters { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
body.portal-shell-page .salary-admin-quick-filters > span { color:#52627b; font-size:.8rem; font-weight:750; text-transform:uppercase; letter-spacing:.05em; margin-right:2px; }
body.portal-shell-page .salary-admin-quick-filters a { display:inline-flex; align-items:center; gap:7px; min-height:34px; padding:6px 10px; border:1px solid #d7dfef; border-radius:999px; color:#43516a; background:#fff; font-size:.875rem; text-decoration:none; }
body.portal-shell-page .salary-admin-quick-filters a:hover, body.portal-shell-page .salary-admin-quick-filters a:focus-visible, body.portal-shell-page .salary-admin-quick-filters a.is-active { color:#4d218a; border-color:#9f7aea; background:#f5efff; outline:none; }
body.portal-shell-page .salary-admin-quick-filters strong { font-size:.78rem; }
body.portal-shell-page .salary-admin-filters { display:grid; grid-template-columns:minmax(220px,1fr) auto auto; gap:12px; align-items:end; }
body.portal-shell-page .salary-admin-table-wrap, body.portal-shell-page .salary-admin-matrix-wrap { overflow-x: auto; border: 1px solid #d7dfef; border-radius: 14px; }
body.portal-shell-page .salary-admin-table { width: 100%; min-width: 1100px; border-collapse: collapse; }
body.portal-shell-page .salary-admin-matrix-wrap table { width: 100%; min-width: 1020px; border-collapse: collapse; font-size: .875rem; }
body.portal-shell-page .salary-admin-table th, body.portal-shell-page .salary-admin-table td, body.portal-shell-page .salary-admin-matrix-wrap th, body.portal-shell-page .salary-admin-matrix-wrap td { padding: 14px; border-bottom: 1px solid #e5e9ee; text-align: left; vertical-align: middle; white-space: nowrap; }
body.portal-shell-page .salary-admin-table thead th, body.portal-shell-page .salary-admin-matrix-wrap thead th { color:#52627b; background:#f5f7fb; font-size:.76rem; letter-spacing:.04em; text-transform:uppercase; }
body.portal-shell-page .salary-admin-table th:first-child { min-width: 210px; }
body.portal-shell-page .salary-admin-table th strong, body.portal-shell-page .salary-admin-table th small { display:block; }
body.portal-shell-page .salary-admin-table th small { margin-top:5px; color:#52627b; font-weight:500; }
body.portal-shell-page .salary-admin-matrix__legend { display:flex; flex-wrap:wrap; gap:10px; color:#52627b; }
body.portal-shell-page .salary-matrix-key, body.portal-shell-page .salary-matrix-cell__historical, body.portal-shell-page .salary-matrix-cell__planned, body.portal-shell-page .salary-matrix-total span { display:inline-flex; flex-direction:column; gap:2px; border-radius:7px; font-weight:750; }
body.portal-shell-page .salary-matrix-key { padding:6px 9px; font-size:.78rem; }
body.portal-shell-page .salary-matrix-key--historical, body.portal-shell-page .salary-matrix-cell__historical { color:#73580b; background:#fff8dc; }
body.portal-shell-page .salary-matrix-key--planned, body.portal-shell-page .salary-matrix-cell__planned { color:#006c63; background:#eefaf6; }
body.portal-shell-page .salary-matrix-cell { min-width:94px; }
body.portal-shell-page .salary-matrix-cell__historical, body.portal-shell-page .salary-matrix-cell__planned { margin:2px 0; padding:5px 6px; }
body.portal-shell-page .salary-matrix-cell small, body.portal-shell-page .salary-matrix-total span { font-size:.68rem; font-weight:650; }
body.portal-shell-page .salary-matrix-total { min-width:125px; white-space:normal !important; }
body.portal-shell-page .salary-matrix-total span { display:block; padding:3px 0; color:#52627b; }
body.portal-shell-page .salary-admin-matrix-wrap { padding:0; }
body.portal-shell-page .salary-admin-matrix-wrap th:first-child { min-width:165px; max-width:165px; white-space:normal; }
body.portal-shell-page .salary-admin-matrix-wrap th:nth-child(2) { min-width:150px; max-width:150px; white-space:normal; border-right:1px solid #d7dfef; }
body.portal-shell-page .salary-admin-matrix-wrap th:nth-child(2) > a { display:block; line-height:1.3; }
body.portal-shell-page .salary-admin-matrix-wrap th:nth-child(2) .salary-ui__request-reference { max-width: 142px; }
body.portal-shell-page .salary-admin-matrix-wrap th:nth-child(2) .salary-ui__status { margin-top:6px; }
body.portal-shell-page .salary-admin-matrix-wrap thead th { position:sticky; top:0; z-index:3; background:#f5f7fb; text-align:right; }
body.portal-shell-page .salary-admin-matrix-wrap thead th:first-child, body.portal-shell-page .salary-admin-matrix-wrap thead th:nth-child(2) { z-index:4; text-align:left; background:#f5f7fb; }
body.portal-shell-page .salary-admin-matrix-wrap td { text-align:right; }
body.portal-shell-page .salary-admin-matrix-wrap th:nth-child(n+3), body.portal-shell-page .salary-admin-matrix-wrap td { padding: 11px 8px; }
body.portal-shell-page .salary-admin-matrix-wrap td.is-planned { color:#006c63; background:#eefaf6; font-weight:750; }
body.portal-shell-page .salary-admin-matrix-wrap tfoot { font-weight:800; background:#f8f4ff; }

/* Wide desktop retains useful matrix context; compact and phone layouts use the full local scroll width. */
@media (min-width: 1025px) {
    body.portal-shell-page .salary-admin-matrix-wrap th:first-child,
    body.portal-shell-page .salary-admin-matrix-wrap th:nth-child(2) { position:sticky; z-index:2; background:#fff; }
    body.portal-shell-page .salary-admin-matrix-wrap th:first-child { left:0; }
    body.portal-shell-page .salary-admin-matrix-wrap th:nth-child(2) { left:165px; }
    body.portal-shell-page .salary-admin-matrix-wrap thead th:first-child,
    body.portal-shell-page .salary-admin-matrix-wrap thead th:nth-child(2) { z-index:4; }
}

/* Admin decision surfaces reuse the shared Salary cards, state pairs, and dialog. */
body.portal-shell-page .salary-decision-page { display:grid; gap:20px; }
body.portal-shell-page .salary-decision-list { display:grid; gap:12px; }
body.portal-shell-page .salary-decision-row { display:grid; grid-template-columns:minmax(240px,1.5fr) minmax(140px,.7fr) minmax(170px,.9fr) minmax(210px,1fr) auto; align-items:center; gap:16px; padding:18px; border:1px solid #d7dfef; border-radius:16px; background:#fff; }
body.portal-shell-page .salary-decision-row strong, body.portal-shell-page .salary-decision-row small, body.portal-shell-page .salary-decision-row span { display:block; }
body.portal-shell-page .salary-decision-row small, body.portal-shell-page .salary-decision-row p { margin:6px 0 0; color:#52627b; font-size:.9rem; }
body.portal-shell-page .salary-decision-row > div > span { color:#52627b; font-size:.75rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
body.portal-shell-page .salary-decision-row form { display:grid; gap:8px; }
body.portal-shell-page .salary-decision-grid { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(330px,.8fr); gap:20px; align-items:start; }
body.portal-shell-page .salary-decision-grid > div { display:grid; gap:20px; }
body.portal-shell-page .salary-decision-form { display:grid; gap:14px; }
body.portal-shell-page .salary-decision-form .portal-input:not(:disabled):not([readonly]) { background:#f1faf3; border-color:#c8e3d0; }
body.portal-shell-page .salary-decision-preview-error { margin:0; color:#9c2020; font-size:.9rem; font-weight:700; }
body.portal-shell-page .salary-decision-preview { display:grid; gap:14px; }
body.portal-shell-page .salary-decision-preview__terms { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
body.portal-shell-page .salary-decision-preview__terms > div { display:grid; gap:3px; padding:11px 12px; border:1px solid #d7dfef; border-radius:12px; background:#fff; }
body.portal-shell-page .salary-decision-preview__terms span { color:#52627b; font-size:.75rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
body.portal-shell-page .salary-decision-preview h3 { margin:2px 0 0; font-size:1rem; }
body.portal-shell-page .salary-decision-preview__schedule { border:1px solid #d7dfef; border-radius:12px; overflow:hidden; }
body.portal-shell-page .salary-decision-preview__schedule > div { display:grid; grid-template-columns:1fr 1fr .8fr; gap:12px; align-items:center; padding:10px 12px; border-bottom:1px solid #e6ebf4; }
body.portal-shell-page .salary-decision-preview__schedule > div:last-child { border-bottom:0; }
body.portal-shell-page .salary-decision-preview__schedule-head { background:#edf2f8; color:#52627b; font-size:.75rem; font-weight:850; letter-spacing:.04em; text-transform:uppercase; }
body.portal-shell-page .salary-adjustment-page { display:grid; gap:20px; }
body.portal-shell-page .salary-adjustment-list { display:grid; gap:12px; }
body.portal-shell-page .salary-adjustment-row { display:grid; grid-template-columns:minmax(220px,1.3fr) minmax(180px,.9fr) minmax(150px,.65fr) auto; gap:16px; align-items:center; padding:18px; border:1px solid #d7dfef; border-radius:16px; background:#fff; }
body.portal-shell-page .salary-adjustment-row small, body.portal-shell-page .salary-adjustment-row span { display:block; color:#52627b; font-size:.88rem; }
body.portal-shell-page .salary-adjustment-row > div:last-of-type strong { display:block; margin-top:4px; font-size:1.05rem; }
body.portal-shell-page .salary-adjustment-actions { display:flex; flex-wrap:wrap; gap:8px; margin:16px 0 20px; }
body.portal-shell-page .salary-adjustment-actions a { padding:9px 12px; border:1px solid #d7dfef; border-radius:999px; color:#344764; font-size:.88rem; font-weight:750; text-decoration:none; }
body.portal-shell-page .salary-adjustment-actions a.is-active { background:#56308c; border-color:#56308c; color:#fff; }
body.portal-shell-page .salary-adjustment-schedule { border:1px solid #d7dfef; border-radius:14px; overflow:auto; }
body.portal-shell-page .salary-adjustment-schedule > div { display:grid; grid-template-columns:1fr 1fr 1.35fr .7fr; gap:12px; align-items:center; min-width:620px; padding:13px 16px; border-bottom:1px solid #e6ebf4; }
body.portal-shell-page .salary-adjustment-schedule > div:last-child { border-bottom:0; }
body.portal-shell-page .salary-adjustment-schedule__head { background:#edf2f8; color:#52627b; font-size:.75rem; font-weight:850; letter-spacing:.04em; text-transform:uppercase; }
body.portal-shell-page .salary-adjustment-form { display:grid; gap:14px; max-width:760px; }
body.portal-shell-page .salary-adjustment-check { display:grid; grid-template-columns:auto minmax(96px,1fr) auto minmax(0,.7fr); align-items:center; column-gap:12px; padding:11px 0; border-bottom:1px solid #e6ebf4; color:#263852; cursor:pointer; }
body.portal-shell-page .salary-adjustment-check input { width:18px; height:18px; margin:0; accent-color:#56308c; }
body.portal-shell-page .salary-adjustment-check__period { white-space:nowrap; font-weight:750; }
body.portal-shell-page .salary-adjustment-check strong { white-space:nowrap; text-align:right; }
body.portal-shell-page .salary-adjustment-check small { min-width:0; color:#8b5a11; font-size:.8rem; font-weight:750; text-align:right; }
body.portal-shell-page .salary-adjustment-check:last-child { border-bottom:0; }
body.portal-shell-page .salary-adjustment-custom-row { display:grid; grid-template-columns:1fr 1fr auto; gap:10px; align-items:center; margin:10px 0; }
body.portal-shell-page .salary-adjustment-custom-row__remove { min-width:auto; white-space:nowrap; }
body.portal-shell-page .salary-adjustment-custom-row.has-error { padding:8px; margin-inline:-8px; border-radius:10px; background:#fff4f4; box-shadow:inset 0 0 0 1px #e2a1a1; }
body.portal-shell-page .salary-custom-schedule-feedback { margin:10px 0 0; color:#9c2020; font-size:.9rem; font-weight:700; line-height:1.45; }
body.portal-shell-page .salary-partial-payment-modal { width:min(680px,calc(100vw - 32px)); max-height:min(760px,calc(100vh - 32px)); padding:0; border:0; border-radius:20px; box-shadow:0 24px 70px rgb(26 30 54 / .28); }
body.portal-shell-page .salary-partial-payment-modal::backdrop { background:rgb(20 25 43 / .52); }
body.portal-shell-page .salary-partial-payment-modal .salary-ui__dialog-frame { display:grid; gap:18px; max-width:none; padding:26px; overflow:auto; }
body.portal-shell-page .salary-adjustment-strategy-grid { display:grid; gap:10px; }
body.portal-shell-page .salary-adjustment-strategy-card { display:grid; grid-template-columns:auto 1fr; column-gap:12px; padding:14px; border:1px solid #d7dfef; border-radius:14px; cursor:pointer; color:#263852; }
body.portal-shell-page .salary-adjustment-strategy-card input { grid-row:span 2; margin-top:4px; accent-color:#56308c; }
body.portal-shell-page .salary-adjustment-strategy-card strong { font-size:.95rem; }
body.portal-shell-page .salary-adjustment-strategy-card span { margin-top:3px; color:#52627b; font-size:.88rem; line-height:1.45; }
body.portal-shell-page .salary-adjustment-strategy-card:has(input:checked) { border-color:#56308c; background:#f5f0fb; box-shadow:0 0 0 2px rgb(86 48 140 / .12); }
body.portal-shell-page .salary-adjustment-schedule--review > div { grid-template-columns:1fr 1fr; min-width:0; }
body.portal-shell-page .salary-adjustment-result { display:flex; align-items:baseline; justify-content:space-between; gap:16px; padding:14px; border-radius:14px; background:#eef8f5; color:#12685e; }
body.portal-shell-page .salary-adjustment-result span { font-size:1.2rem; font-weight:850; }
body.portal-shell-page .salary-adjustment-action { display:flex; justify-content:center; margin-top:4px; }
body.portal-shell-page .salary-adjustment-action .portal-button { width:auto; min-width:178px; }
body.portal-shell-page .salary-ui__dialog-actions .salary-adjustment-action { margin:0 0 0 auto; }
body.portal-shell-page .salary-partial-modal-error { margin:0; padding:12px 14px; border-radius:12px; background:#fff0f0; color:#9c2020; font-weight:700; }
body.portal-shell-page .salary-distribution-period, body.portal-shell-page .salary-distribution-confirm { display:flex; align-items:end; justify-content:space-between; gap:24px; }
body.portal-shell-page .salary-distribution-period form { display:flex; align-items:end; gap:12px; }
body.portal-shell-page .salary-distribution-period .salary-ui__field { min-width:220px; margin:0; }
body.portal-shell-page .salary-distribution-exclusions { display:grid; gap:8px; margin:0; padding-left:20px; color:#52627b; }

/* Historical Salary Advance surfaces reuse the Admin cards and Salary UI states. */
body.portal-shell-page .salary-historical-page { display:grid; gap:20px; }
body.portal-shell-page .salary-historical-grid { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(290px,.65fr); gap:20px; align-items:start; }
body.portal-shell-page .salary-historical-form { display:grid; gap:20px; }
body.portal-shell-page .salary-historical-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
body.portal-shell-page .salary-historical-evidence { display:grid; gap:14px; padding:18px; border:1px solid #d7dfef; border-radius:16px; background:#f8fbff; }
body.portal-shell-page .salary-historical-repayments { display:grid; gap:10px; }
body.portal-shell-page .salary-historical-repayment { display:grid; grid-template-columns:1fr 1fr; gap:12px; align-items:end; }
body.portal-shell-page .salary-historical-submit { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-top:4px; }
body.portal-shell-page .salary-historical-submit p { margin:4px 0 0; color:#52627b; }
body.portal-shell-page .salary-historical-records { display:grid; gap:10px; }
body.portal-shell-page .salary-historical-record { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:15px; border:1px solid #d7dfef; border-radius:14px; color:#172033; text-decoration:none; }
body.portal-shell-page .salary-historical-record:hover { border-color:#6d39a5; box-shadow:0 6px 18px rgba(79,42,125,.10); }
body.portal-shell-page .salary-historical-record strong, body.portal-shell-page .salary-historical-record small { display:block; }
body.portal-shell-page .salary-historical-record small { margin-top:5px; color:#52627b; }
body.portal-shell-page .salary-historical-record > div:last-child { text-align:right; }
body.portal-shell-page .salary-historical-details { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:0; }
body.portal-shell-page .salary-historical-details > div { padding:14px; border:1px solid #d7dfef; border-radius:12px; background:#fbfcff; }
body.portal-shell-page .salary-historical-details dt { color:#52627b; font-size:.76rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
body.portal-shell-page .salary-historical-details dd { margin:7px 0 0; color:#172033; font-weight:700; }
body.portal-shell-page .salary-historical-details__wide { grid-column:1 / -1; }

/* Historical, audit and attention: retain source context without a compressed desktop layout. */
body.portal-shell-page .salary-summary-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
body.portal-shell-page .salary-historical-table { min-width:0; }
body.portal-shell-page .salary-historical-record strong,
body.portal-shell-page .salary-historical-record small,
body.portal-shell-page .salary-historical-details dd,
body.portal-shell-page .salary-audit-row > div,
body.portal-shell-page .salary-notification-row > div { min-width:0; overflow-wrap:anywhere; }

/* Shared Salary responsive tiers: desktop, compact/tablet, then phone-specific refinements below. */
@media (max-width: 1024px) {
    body.portal-shell-page .salary-employee-page,
    body.portal-shell-page .salary-admin-page,
    body.portal-shell-page .salary-decision-page,
    body.portal-shell-page .salary-adjustment-page,
    body.portal-shell-page .salary-distribution-page,
    body.portal-shell-page .salary-historical-page { gap:18px; }
    body.portal-shell-page .salary-employee-hero,
    body.portal-shell-page .salary-employee-card,
    body.portal-shell-page .salary-admin-card { padding:22px; }
    body.portal-shell-page .salary-workspace-header { align-items:stretch; flex-direction:column; }
    body.portal-shell-page .salary-workspace-header__controls { justify-content:flex-start; flex-wrap:wrap; }
    body.portal-shell-page .salary-workspace-header__nav { flex-wrap:wrap; justify-content:flex-start; }
    body.portal-shell-page .salary-employee-summary-grid,
    body.portal-shell-page .salary-dashboard__primary-grid,
    body.portal-shell-page .salary-dashboard__metric-grid,
    body.portal-shell-page .salary-admin-metric-grid,
    body.portal-shell-page .salary-admin-count-grid,
    body.portal-shell-page .salary-summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    body.portal-shell-page .salary-employee-summary-grid--requests { grid-template-columns:minmax(220px,.8fr) minmax(0,1.2fr); }
    body.portal-shell-page .salary-historical-grid { grid-template-columns:1fr; }
}

@media (max-width: 760px) {
    body.portal-shell-page .salary-employee-grid--two,
    body.portal-shell-page .salary-employee-details,
    body.portal-shell-page .salary-dashboard__primary-grid,
    body.portal-shell-page .salary-dashboard__metric-grid,
    body.portal-shell-page .salary-dashboard__content-grid,
    body.portal-shell-page .salary-settlement__grid,
    body.portal-shell-page .salary-summary-grid,
    body.portal-shell-page .salary-historical-fields,
    body.portal-shell-page .salary-historical-repayment,
    body.portal-shell-page .salary-adjustment-custom-row { grid-template-columns:1fr; }
    body.portal-shell-page .salary-employee-actions,
    body.portal-shell-page .salary-admin-actions,
    body.portal-shell-page .salary-ui__dialog-actions { justify-content:flex-start; }
    body.portal-shell-page .salary-employee-actions > .portal-button,
    body.portal-shell-page .salary-admin-actions > .portal-button,
    body.portal-shell-page .salary-ui__dialog-actions > .portal-button { min-height:44px; }
}

@media (max-width: 520px) {
    body.portal-shell-page .salary-adjustment-check { grid-template-columns:auto minmax(0,1fr) auto; }
    body.portal-shell-page .salary-adjustment-check small { grid-column:2 / -1; text-align:left; }
    body.portal-shell-page .salary-adjustment-custom-row { grid-template-columns:1fr auto; }
    body.portal-shell-page .salary-adjustment-custom-row > input:first-child { grid-column:1 / -1; }
}

/* Tables retain deliberate local scrolling; no table may force whole-page horizontal overflow. */
body.portal-shell-page .salary-timeline__scroll,
body.portal-shell-page .salary-admin-table-wrap,
body.portal-shell-page .salary-admin-matrix-wrap,
body.portal-shell-page .salary-adjustment-schedule { max-width:100%; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch; }

/* Employee Salary composition: retain scan order and useful context as space narrows. */
@media (max-width: 1024px) {
    body.portal-shell-page .salary-employee-detail-grid { grid-template-columns:minmax(0,1fr) minmax(280px,.8fr); gap:18px; }
}

@media (min-width: 641px) and (max-width: 760px) {
    body.portal-shell-page .salary-employee-summary-grid--requests { grid-template-columns:1fr; }
    body.portal-shell-page .salary-employee-request-card { grid-template-columns:minmax(0,1fr) auto; gap:12px; }
    body.portal-shell-page .salary-employee-request-card__states { justify-content:flex-end; flex-wrap:wrap; overflow:visible; }
    body.portal-shell-page .salary-employee-request-amount { justify-content:flex-start; }
}

@media (max-width: 760px) {
    body.portal-shell-page .salary-employee-hero { padding:22px; }
    body.portal-shell-page .salary-employee-steps { gap:10px 16px; margin-top:18px; }
    body.portal-shell-page .salary-dashboard__section-heading,
    body.portal-shell-page .salary-dashboard__activity > a { align-items:flex-start; flex-direction:column; }
    body.portal-shell-page .salary-dashboard__activity > a { gap:10px; }
    body.portal-shell-page .salary-timeline__head { align-items:stretch; flex-direction:column; gap:12px; }
    body.portal-shell-page .salary-timeline__head form { width:100%; }
}

/* Admin operational composition: keep context visible and controls usable before phone width. */
@media (max-width: 1024px) {
    body.portal-shell-page .salary-admin-filters { grid-template-columns:minmax(0,1fr) auto auto; }
    body.portal-shell-page .salary-decision-grid { grid-template-columns:1fr; }
    body.portal-shell-page .salary-decision-row { grid-template-columns:repeat(2,minmax(0,1fr)); }
    body.portal-shell-page .salary-adjustment-row { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
}

@media (max-width: 760px) {
    body.portal-shell-page .salary-admin-quick-filters a,
    body.portal-shell-page .salary-adjustment-actions a { min-height:40px; box-sizing:border-box; }
    body.portal-shell-page .salary-admin-filters { grid-template-columns:1fr; align-items:stretch; }
    body.portal-shell-page .salary-admin-filters .portal-button { justify-content:center; min-height:44px; }
    body.portal-shell-page .salary-decision-row,
    body.portal-shell-page .salary-adjustment-row { gap:14px; padding:16px; }
    body.portal-shell-page .salary-decision-row > .portal-button,
    body.portal-shell-page .salary-adjustment-row > .portal-button { justify-self:start; min-height:44px; }
    body.portal-shell-page .salary-adjustment-form { max-width:none; }
    body.portal-shell-page .salary-distribution-period,
    body.portal-shell-page .salary-distribution-confirm,
    body.portal-shell-page .salary-distribution-period form { align-items:stretch; flex-direction:column; }
    body.portal-shell-page .salary-distribution-period .salary-ui__field { min-width:0; }
    body.portal-shell-page .salary-distribution-period .portal-button,
    body.portal-shell-page .salary-distribution-confirm .portal-button { width:100%; min-height:46px; justify-content:center; }
}

@media (max-width: 640px) {
    body.portal-shell-page .salary-ui__summary { padding: 16px; }
    body.portal-shell-page .salary-ui__comparison-grid { grid-template-columns: 1fr; margin: 14px; gap: 10px; }
    body.portal-shell-page .salary-ui__comparison-divider { display: none; }
    body.portal-shell-page .salary-ui__comparison-side { border-radius: 12px; }
    body.portal-shell-page .salary-ui__comparison-note { margin: 0 14px 16px; }
    body.portal-shell-page .salary-ui__dialog { width: min(100% - 16px, 620px); }
    body.portal-shell-page .salary-ui__dialog-frame { padding: 20px; }
    body.portal-shell-page .salary-ui__dialog-actions > * { flex: 1 1 150px; }
    body.portal-shell-page .salary-employee-page { gap: 16px; padding-bottom: 82px; }
    body.portal-shell-page .salary-employee-hero, body.portal-shell-page .salary-employee-card { padding: 20px; border-radius: 16px; }
    body.portal-shell-page .salary-employee-grid--two, body.portal-shell-page .salary-employee-summary-grid, body.portal-shell-page .salary-employee-detail-grid, body.portal-shell-page .salary-employee-operational-grid, body.portal-shell-page .salary-employee-details { grid-template-columns: 1fr; }
    body.portal-shell-page .salary-employee-request-context { grid-template-columns: 1fr; padding: 18px; }
    body.portal-shell-page .salary-employee-request-context > div:last-child { justify-items: start; }
    body.portal-shell-page .salary-dashboard__hero,
    body.portal-shell-page .salary-timeline__head,
    body.portal-shell-page .salary-dashboard__primary-grid,
    body.portal-shell-page .salary-dashboard__metric-grid,
    body.portal-shell-page .salary-dashboard__content-grid,
    body.portal-shell-page .salary-settlement__grid { grid-template-columns: 1fr; }
    body.portal-shell-page .salary-dashboard__hero,
    body.portal-shell-page .salary-timeline__head { align-items: stretch; }
    body.portal-shell-page .salary-dashboard__section-heading { align-items: stretch; flex-direction: column; }
    body.portal-shell-page .salary-dashboard__activity > a { align-items: flex-start; flex-direction: column; gap: 10px; }
    body.portal-shell-page .salary-timeline__head form { width: 100%; }
    body.portal-shell-page .salary-employee-summary-grid { gap: 12px; }
    body.portal-shell-page .salary-employee-request-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
    body.portal-shell-page .salary-employee-filters form, body.portal-shell-page .salary-employee-request-card { grid-template-columns: 1fr; }
    body.portal-shell-page .salary-employee-filter-actions { display: grid; grid-template-columns: 1fr 1fr; }
    body.portal-shell-page .salary-employee-filter-actions .portal-button { justify-content: center; }
    body.portal-shell-page .salary-employee-request-card { gap: 14px; }
    body.portal-shell-page .salary-employee-request-card__states { flex-wrap: wrap; overflow: visible; }
    body.portal-shell-page .salary-employee-request-amount { justify-content: flex-start; }
    body.portal-shell-page .salary-employee-section-head { display: grid; }
    body.portal-shell-page .salary-employee-actions > .portal-button { flex:1 1 150px; justify-content:center; min-height:46px; }
    body.portal-shell-page .salary-employee-plan { grid-template-columns:1fr; }
    body.portal-shell-page .salary-timeline__scroll th:first-child { min-width:170px; }
    body.portal-shell-page .salary-timeline__scroll th,
    body.portal-shell-page .salary-timeline__scroll td { padding:12px 10px; }
    body.portal-shell-page .salary-admin-hero, body.portal-shell-page .salary-admin-scope, body.portal-shell-page .salary-admin-matrix-link, body.portal-shell-page .salary-admin-section-head { align-items:stretch; flex-direction:column; }
    body.portal-shell-page .salary-admin-actions { align-items:stretch; }
    body.portal-shell-page .salary-workspace-header { align-items:stretch; flex-direction:column; }
    body.portal-shell-page .salary-workspace-header__controls { align-items:stretch; flex-direction:column; }
    body.portal-shell-page .salary-workspace-header__nav { display:none; }
    body.portal-shell-page .salary-workspace-header__mobile-menu { display:block; min-width:0; }
    body.portal-shell-page .salary-workspace-header__mobile-menu > summary { display:flex; align-items:center; justify-content:flex-start; width:100%; min-height:42px; box-sizing:border-box; gap:8px; cursor:pointer; list-style:none; }
    body.portal-shell-page .salary-workspace-header__mobile-menu > summary::-webkit-details-marker { display:none; }
    body.portal-shell-page .salary-workspace-header__mobile-menu > summary::after { content:'⌄'; margin-left:auto; color:#52627b; font-weight:850; transition:transform .16s ease; }
    body.portal-shell-page .salary-workspace-header__mobile-menu[open] > summary::after { transform:rotate(180deg); }
    body.portal-shell-page .salary-workspace-header__mobile-menu-current { min-width:0; overflow:hidden; color:#52627b; font-size:.88rem; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }
    body.portal-shell-page .salary-workspace-header__mobile-menu-panel { display:grid; gap:6px; margin-top:10px; padding:8px; border:1px solid #d7dfef; border-radius:14px; background:#f8faff; }
    body.portal-shell-page .salary-workspace-header__mobile-menu-panel a { display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:44px; padding:0 12px; border-radius:10px; color:#263852; font-weight:750; text-decoration:none; }
    body.portal-shell-page .salary-workspace-header__mobile-menu-panel a:hover, body.portal-shell-page .salary-workspace-header__mobile-menu-panel a:focus-visible { color:#45206a; background:#eee5f8; outline:none; }
    body.portal-shell-page .salary-workspace-header__mobile-menu-panel a.is-active { color:#fff; background:#56308c; }
    body.portal-shell-page .salary-workspace-header__period .portal-input { width:100%; }
    body.portal-shell-page .salary-admin-reporting-period { align-self:auto; width:100%; }
    body.portal-shell-page .salary-admin-scope form { width:100%; }
    body.portal-shell-page .salary-admin-metric-grid, body.portal-shell-page .salary-admin-count-grid, body.portal-shell-page .salary-admin-filters { grid-template-columns:1fr; }
    body.portal-shell-page .salary-admin-card { padding:20px; }
    body.portal-shell-page .salary-decision-grid, body.portal-shell-page .salary-decision-row, body.portal-shell-page .salary-adjustment-row { grid-template-columns:1fr; }
    body.portal-shell-page .salary-decision-preview__terms { grid-template-columns:1fr; }
    body.portal-shell-page .salary-adjustment-schedule > div { grid-template-columns:140px 130px 1fr 110px; }
    body.portal-shell-page .salary-distribution-period, body.portal-shell-page .salary-distribution-confirm, body.portal-shell-page .salary-distribution-period form { align-items:stretch; flex-direction:column; }
    body.portal-shell-page .salary-distribution-period .salary-ui__field { min-width:0; }
    body.portal-shell-page .salary-distribution-confirm .portal-button { width:100%; }
    body.portal-shell-page .salary-historical-grid, body.portal-shell-page .salary-historical-fields, body.portal-shell-page .salary-historical-repayment, body.portal-shell-page .salary-historical-details { grid-template-columns:1fr; }
    body.portal-shell-page .salary-historical-submit, body.portal-shell-page .salary-historical-record { align-items:stretch; flex-direction:column; }
    body.portal-shell-page .salary-historical-record > div:last-child { text-align:left; }
    body.portal-shell-page .salary-historical-details__wide { grid-column:auto; }
    body.portal-shell-page .salary-historical-submit .portal-button { width:100%; }
}
/* UI-9: shared Salary audit and attention presentation. */
.salary-notification-row__title{display:flex;gap:.55rem;align-items:center;flex-wrap:wrap}.salary-notification-row.is-unread{background:#f5fbff}.salary-notification-row.is-read{opacity:.82}
.salary-ui__control-center-action,.salary-ui__context-action{border-color:#6d39a5!important;background:#f4edfb!important;color:#45206a!important;box-shadow:none}.salary-ui__control-center-action:hover,.salary-ui__context-action:hover{border-color:#56308c!important;background:#e9ddf6!important;color:#3d1c5f!important}.salary-ui__control-center-action:focus-visible,.salary-ui__context-action:focus-visible{outline:3px solid rgba(86,48,140,.35);outline-offset:2px}.salary-ui__context-action{white-space:nowrap}
.salary-audit-page,.salary-attention-page{display:grid;gap:1rem;max-width:1240px;margin-inline:auto}.salary-ui__filters{display:flex;align-items:end;gap:.75rem;flex-wrap:wrap;padding:1rem;border:1px solid var(--portal-line,#dce2e9);border-radius:1rem;background:var(--portal-surface,#fff)}.salary-ui__filters .salary-ui__field{min-width:min(100%,28rem)}.salary-audit-list,.salary-notification-list,.salary-attention-panel{display:grid;gap:.75rem}.salary-audit-row,.salary-notification-row{display:flex;gap:1rem;align-items:center;justify-content:space-between;padding:1rem 1.125rem;border:1px solid var(--portal-line,#dce2e9);border-radius:1rem;background:var(--portal-surface,#fff)}.salary-audit-row p,.salary-notification-row p{margin:.3rem 0 0;color:var(--portal-muted,#627085)}.salary-notification-row small{display:block;margin-top:.55rem;color:var(--portal-muted,#627085)}.salary-notification-row__actions{display:flex;align-items:center;flex-wrap:wrap;gap:.75rem}.salary-notification-row__actions form{margin:0}.salary-notification-row.is-unread{border-left:4px solid var(--portal-primary,#176b87);padding-left:.9rem}.salary-attention-panel{padding-top:.5rem}@media (max-width:640px){.salary-ui__filters{align-items:stretch}.salary-ui__filters .salary-ui__field{min-width:100%}.salary-audit-row,.salary-notification-row{align-items:flex-start;flex-direction:column}.salary-audit-row .salary-ui__status,.salary-notification-row form,.salary-notification-row .portal-button{width:100%}.salary-notification-row .portal-button{justify-content:center}}

/* Package 5: Historical, audit and attention retain readable action and evidence context at compact widths. */
@media (max-width: 1024px) {
    body.portal-shell-page .salary-audit-row,
    body.portal-shell-page .salary-notification-row { align-items:flex-start; }
}

@media (max-width: 760px) {
    body.portal-shell-page .salary-historical-evidence { padding:16px; }
    body.portal-shell-page .salary-historical-submit,
    body.portal-shell-page .salary-historical-record,
    body.portal-shell-page .salary-audit-row,
    body.portal-shell-page .salary-notification-row { align-items:stretch; flex-direction:column; }
    body.portal-shell-page .salary-historical-submit > .portal-button,
    body.portal-shell-page .salary-notification-row form,
    body.portal-shell-page .salary-notification-row form .portal-button,
    body.portal-shell-page .salary-notification-row > .portal-button,
    body.portal-shell-page .salary-audit-row > .salary-ui__status { width:100%; }
    body.portal-shell-page .salary-notification-row__actions { align-items:stretch; flex-direction:column; width:100%; }
    body.portal-shell-page .salary-historical-submit > .portal-button,
    body.portal-shell-page .salary-notification-row .portal-button { justify-content:center; min-height:44px; }
    body.portal-shell-page .salary-ui__filters { align-items:stretch; flex-direction:column; }
    body.portal-shell-page .salary-ui__filters .salary-ui__field,
    body.portal-shell-page .salary-ui__filters .portal-button { width:100%; min-width:0; }
    body.portal-shell-page .salary-ui__filters .portal-button { justify-content:center; min-height:44px; }
    body.portal-shell-page .salary-ui__context-action { white-space:normal; text-align:center; }
}

/* Attendance UAT correction: kept last to override legacy duplicated Attendance declarations. */
body.portal-shell-page.attendance-shell .attendance-task-status-card[data-gps-visual-state="success"] {
    background: #e4f7ee;
    border-color: rgba(15, 163, 107, 0.42);
}
body.portal-shell-page.attendance-shell .attendance-task-status-card[data-gps-visual-state="success"] strong,
body.portal-shell-page.attendance-shell .attendance-task-status-card[data-gps-visual-state="success"] .attendance-task-status-card__note { color: #075d3d; }
body.portal-shell-page.attendance-shell .attendance-task-status-card[data-gps-visual-state="success"] .attendance-state-chip { background: #0fa36b; color: #fff; }
body.portal-shell-page.attendance-shell .attendance-task-status-card[data-gps-visual-state="failure"] { background: #f9ebed; border-color: rgba(132, 43, 58, 0.42); }
body.portal-shell-page.attendance-shell .attendance-task-status-card[data-gps-visual-state="failure"] strong,
body.portal-shell-page.attendance-shell .attendance-task-status-card[data-gps-visual-state="failure"] .attendance-task-status-card__note { color: #752634; }
body.portal-shell-page.attendance-shell .attendance-task-status-card[data-gps-visual-state="failure"] .attendance-state-chip { background: #8a303f; color: #fff; }

body.portal-shell-page.attendance-shell .attendance-success-modal { border-color: #d7dfef; color: #263852; background: #fff; box-shadow: 0 24px 70px rgba(23, 36, 74, 0.25); }
body.portal-shell-page.attendance-shell .attendance-success-modal .attendance-task-card__eyebrow { color: #6b7280; }
body.portal-shell-page.attendance-shell .attendance-success-modal__head h2 { color: #263852; }
body.portal-shell-page.attendance-shell .attendance-success-modal__frame > p { color: #52627b; }
body.portal-shell-page.attendance-shell .attendance-success-modal__close { border-color: #d7dfef; color: #455b79; background: #f0f4fa; }
body.portal-shell-page.attendance-shell .attendance-success-modal__actions .portal-button { color: #fff; }

body.portal-shell-page.attendance-shell .attendance-history-table th { color: #52627b; }
body.portal-shell-page.attendance-shell .attendance-history-table td { color: #263852; }
body.portal-shell-page.attendance-shell .attendance-history-table td strong,
body.portal-shell-page.attendance-shell .attendance-history-card strong { color: #172033; }
body.portal-shell-page.attendance-shell .attendance-history-table td p,
body.portal-shell-page.attendance-shell .attendance-history-card p { color: #52627b; }
body.portal-shell-page.attendance-shell .attendance-history-table td:first-child strong,
body.portal-shell-page.attendance-shell .attendance-history-card__head h3 { font-size: 1.08rem; letter-spacing: -0.015em; }
body.portal-shell-page.attendance-shell .attendance-history-table td:first-child p,
body.portal-shell-page.attendance-shell .attendance-history-card__head p { margin-top: 0.2rem; color: #667085; font-size: 0.8rem; }
body.portal-shell-page.attendance-shell .attendance-history-card { background: #f8fbff; border-color: #dce4ee; }

/* Attendance report: compact scope/filter surface and preview-only pagination. */
body.portal-shell-page.attendance-shell .attendance-report-hero { gap: .65rem; }
body.portal-shell-page.attendance-shell .attendance-report-hero__copy { display:flex; align-items:center; gap:.55rem; color:#52627b; font-size:.82rem; font-weight:750; letter-spacing:.025em; }
body.portal-shell-page.attendance-shell .attendance-report-hero__copy > span:first-child { color:#56308c; font-size:.76rem; font-weight:900; letter-spacing:.14em; }
body.portal-shell-page.attendance-shell .attendance-report-hero__copy strong { color:#263852; font-size:.9rem; }
body.portal-shell-page.attendance-shell .attendance-report-hero__copy i { color:#b0bac9; font-style:normal; }
body.portal-shell-page.attendance-shell .attendance-report-toolbar { display:grid; grid-template-columns:minmax(150px, 1fr) minmax(150px, 1fr) auto; align-items:end; justify-content:stretch; gap:.7rem; width:100%; }
body.portal-shell-page.attendance-shell .attendance-report-toolbar__actions { display:flex; align-items:center; gap:.55rem; }
body.portal-shell-page.attendance-shell .attendance-report-toolbar__actions .portal-button { min-height:42px; white-space:nowrap; }
body.portal-shell-page.attendance-shell .attendance-report-table-wrap { display:block; }
body.portal-shell-page.attendance-shell .attendance-report-pagination { display:flex; align-items:center; justify-content:flex-end; gap:.7rem; margin-top:.9rem; }
body.portal-shell-page.attendance-shell .attendance-report-pagination__meta { margin-right:auto; color:#667085; font-size:.82rem; font-weight:700; }
body.portal-shell-page.attendance-shell .attendance-report-pagination .portal-button { min-height:38px; padding-inline:.85rem; }
body.portal-shell-page.attendance-shell .attendance-report-pagination .is-disabled { opacity:.5; pointer-events:none; }
@media (max-width:760px) {
    body.portal-shell-page.attendance-shell .attendance-report-hero__copy { align-items:flex-start; flex-wrap:wrap; line-height:1.35; }
    body.portal-shell-page.attendance-shell .attendance-report-toolbar { grid-template-columns:1fr; align-items:stretch; }
    body.portal-shell-page.attendance-shell .attendance-report-toolbar__field { min-width:0; }
    body.portal-shell-page.attendance-shell .attendance-report-toolbar__actions { display:grid; grid-template-columns:1fr 1fr; }
    body.portal-shell-page.attendance-shell .attendance-report-toolbar__actions .portal-button { justify-content:center; }
    body.portal-shell-page.attendance-shell .attendance-report-table-wrap { display:block; overflow-x:auto; }
    body.portal-shell-page.attendance-shell .attendance-report-pagination { align-items:stretch; flex-wrap:wrap; justify-content:space-between; }
    body.portal-shell-page.attendance-shell .attendance-report-pagination__meta { flex:1 0 100%; margin-right:0; }
}

/* Attendance report: keep scope, filters and preview in one compact report surface. */
body.portal-shell-page.attendance-shell .attendance-report-hero {
    gap: .9rem;
    padding: 1.15rem 1.2rem 1rem;
}

body.portal-shell-page.attendance-shell .attendance-report-hero__copy {
    min-height: 0;
}

body.portal-shell-page.attendance-shell .attendance-report-page {
    width: 100%;
    max-width: none;
    margin: 0;
}

body.portal-shell-page.attendance-shell .attendance-report-hero__copy {
    gap: .75rem;
    color: #263852;
    font-size: .98rem;
    letter-spacing: 0;
}

body.portal-shell-page.attendance-shell .attendance-report-hero__copy > span:first-child {
    color: #111827;
    font-size: 1.05rem;
    letter-spacing: .01em;
}

body.portal-shell-page.attendance-shell .attendance-report-hero__copy strong {
    color: #172033;
    font-size: .98rem;
}

/* Attendance filled primary actions must not inherit the light-surface text colour. */
body.portal-shell-page.attendance-shell .portal-button:not(.portal-button--ghost) {
    color: #fff;
    background: linear-gradient(135deg, var(--portal-primary), var(--portal-primary-deep));
    border-color: transparent;
}

body.portal-shell-page.attendance-shell .portal-button:not(.portal-button--ghost) .portal-button__icon {
    color: #fff;
}

body.portal-shell-page.attendance-shell .portal-button:not(.portal-button--ghost):hover {
    color: #fff;
    background: linear-gradient(135deg, var(--portal-primary-deep), var(--portal-primary));
}

/* Filled report and account actions keep the Portal primary-button contrast. */
body.portal-shell-page.attendance-shell .attendance-report-toolbar__actions .portal-button,
body.portal-shell-page.attendance-shell .portal-userbar__logout .portal-button {
    color: #fff;
    background: linear-gradient(135deg, var(--portal-primary), var(--portal-primary-deep));
    border-color: transparent;
}

body.portal-shell-page.attendance-shell .attendance-report-toolbar__actions .portal-button .portal-button__icon,
body.portal-shell-page.attendance-shell .portal-userbar__logout .portal-button .portal-button__icon {
    color: #fff;
}

body.portal-shell-page.attendance-shell .attendance-report-toolbar__actions .portal-button:hover,
body.portal-shell-page.attendance-shell .portal-userbar__logout .portal-button:hover {
    color: #fff;
    background: linear-gradient(135deg, var(--portal-primary-deep), var(--portal-primary));
}

/* Mobile report rows are complete cards, not a clipped horizontal table. */
@media (max-width:760px) {
    body.portal-shell-page.attendance-shell .attendance-report-results .attendance-report-table-wrap {
        overflow: visible;
        border: 0;
        border-radius: 0;
    }

    body.portal-shell-page.attendance-shell .attendance-report-results .attendance-history-table,
    body.portal-shell-page.attendance-shell .attendance-report-results .attendance-history-table tbody {
        display: grid;
        min-width: 0;
    }

    body.portal-shell-page.attendance-shell .attendance-report-results .attendance-history-table thead {
        display: none;
    }

    body.portal-shell-page.attendance-shell .attendance-report-results .attendance-history-table tbody {
        gap: .65rem;
    }

    body.portal-shell-page.attendance-shell .attendance-report-results .attendance-history-table tr {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .65rem .9rem;
        padding: .85rem;
        border: 1px solid #dde5f0;
        border-radius: .75rem;
        background: #fff;
    }

    body.portal-shell-page.attendance-shell .attendance-report-results .attendance-history-table td {
        display: grid;
        gap: .18rem;
        min-width: 0;
        padding: 0;
        border: 0;
        color: #263852;
        overflow-wrap: anywhere;
    }

    body.portal-shell-page.attendance-shell .attendance-report-results .attendance-history-table td::before {
        content: attr(data-label);
        color: #667085;
        font-size: .67rem;
        font-weight: 850;
        letter-spacing: .08em;
        text-transform: uppercase;
    }

    body.portal-shell-page.attendance-shell .attendance-report-results .attendance-history-table td:first-child,
    body.portal-shell-page.attendance-shell .attendance-report-results .attendance-history-table td:nth-child(2) {
        grid-column: 1 / -1;
    }
}

body.portal-shell-page.attendance-shell .attendance-report-toolbar {
    grid-template-columns: minmax(190px, 304px) minmax(190px, 304px) auto;
    gap: .75rem;
}

body.portal-shell-page.attendance-shell .attendance-report-toolbar__field {
    min-width: 0;
}

body.portal-shell-page.attendance-shell .attendance-report-toolbar__actions {
    align-self: end;
}

body.portal-shell-page.attendance-shell .attendance-report-results {
    border-top: 1px solid #e3e9f2;
    padding-top: .9rem;
}

body.portal-shell-page.attendance-shell .attendance-report-results.attendance-empty-state {
    padding-bottom: .2rem;
}

body.portal-shell-page.attendance-shell .attendance-report-results .attendance-report-table-wrap {
    margin: 0;
    border: 1px solid #dde5f0;
    border-radius: .75rem;
}

body.portal-shell-page.attendance-shell .attendance-report-results .attendance-history-table {
    min-width: 760px;
}

@media (max-width:760px) {
    body.portal-shell-page.attendance-shell .attendance-report-hero {
        padding: 1rem;
    }

    /* Keep this last: it deliberately overrides the desktop report grid. */
    body.portal-shell-page.attendance-shell .attendance-report-toolbar {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: .75rem;
        width: 100%;
        min-width: 0;
    }

    body.portal-shell-page.attendance-shell .attendance-report-toolbar__field,
    body.portal-shell-page.attendance-shell .attendance-report-toolbar__actions {
        width: 100%;
        min-width: 0;
    }

    body.portal-shell-page.attendance-shell .attendance-report-toolbar__actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .65rem;
        align-self: auto;
    }

    body.portal-shell-page.attendance-shell .attendance-report-toolbar__actions .portal-button {
        width: 100%;
        min-width: 0;
        padding-inline: .65rem;
        white-space: normal;
    }

    body.portal-shell-page.attendance-shell .attendance-report-pagination {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .65rem;
        align-items: stretch;
    }

    body.portal-shell-page.attendance-shell .attendance-report-pagination__meta {
        grid-column: 1 / -1;
        grid-row: 1;
        margin: 0;
        text-align: center;
    }

    body.portal-shell-page.attendance-shell .attendance-report-pagination .portal-button {
        width: 100%;
        min-width: 0;
        justify-content: center;
    }

    body.portal-shell-page.attendance-shell .attendance-report-pagination .portal-button--ghost {
        grid-column: 1;
        grid-row: 2;
    }

    body.portal-shell-page.attendance-shell .attendance-report-pagination .portal-button:not(.portal-button--ghost) {
        grid-column: 2;
        grid-row: 2;
    }

    body.portal-shell-page.attendance-shell .attendance-report-results .attendance-history-table tbody {
        gap: .5rem;
    }

    /* Reset the late desktop table minimum that otherwise widens the whole card. */
body.portal-shell-page.attendance-shell .attendance-report-hero,
    body.portal-shell-page.attendance-shell .attendance-report-results,
    body.portal-shell-page.attendance-shell .attendance-report-results .attendance-history-table {
        min-width: 0;
        max-width: 100%;
    }

    body.portal-shell-page.attendance-shell .attendance-report-results .attendance-history-table tr {
        gap: .5rem .75rem;
        padding: .75rem;
    }
}