/* Employee portal: warm paper, quiet typography, and uncropped photography. */
:root {
    --portal-ink:#28372f; --portal-deep:#203c32; --portal-green:#315a46;
    --portal-mint:#e8ecdf; --portal-gold:#d4b789; --portal-cream:#f5f0e7;
    --portal-paper:#fffdf8; --portal-muted:#656a60; --portal-line:#dedbcf;
    --portal-shadow:0 14px 38px #28372f09; --portal-terra:#a45e40;
}
.portal-authenticated { background:var(--portal-cream); }
.portal-header { min-height:86px; background:#f9f5edfa; box-shadow:none; border-color:var(--portal-line); padding-inline:clamp(20px,4vw,64px); }
.portal-brand strong { font-family:var(--portal-serif); font-size:20px; letter-spacing:.03em; font-weight:600; }
.portal-brand small { font-family:var(--portal-sans); font-size:10px; letter-spacing:.09em; text-transform:uppercase; }
.portal-desktop-nav { gap:clamp(12px,2vw,30px); }
.portal-desktop-nav > a { color:#64675d; font-size:12px; }
.portal-desktop-nav > .is-active { color:var(--portal-deep); }
.portal-desktop-nav > .is-active::after { height:2px; bottom:20px; background:var(--portal-terra); }
.portal-account-avatar,.portal-personnel-monogram { border-radius:6px; background:#e4decf; }
.portal-account-avatar img,.portal-personnel-monogram img,.portal-profile-photo img { object-fit:contain; object-position:center; }
.portal-main { max-width:1480px; padding:38px clamp(20px,4vw,64px) 32px; }
.portal-kicker { color:#80633d; font-size:10px; letter-spacing:.16em; line-height:1.6; }
.portal-welcome-editorial { grid-template-columns:minmax(0,.95fr) minmax(0,1.15fr); align-items:center; gap:clamp(28px,5vw,80px); margin:14px 0 52px; }
.portal-welcome-editorial h1 { font-size:clamp(44px,5.6vw,84px); line-height:1.02; letter-spacing:-.055em; }
.portal-welcome-editorial h1 em,.portal-section-heading h2 em { color:var(--portal-terra); font-weight:400; }
.portal-welcome-editorial .portal-welcome-copy > p { font-size:16px; line-height:1.75; }
.portal-welcome-editorial .portal-welcome-copy > .portal-kicker { font-size:10px; margin-bottom:24px; }
.portal-welcome-actions { display:flex; align-items:center; gap:24px; flex-wrap:wrap; margin-top:30px; }
.portal-editorial-button { display:inline-flex; align-items:center; justify-content:space-between; gap:26px; min-height:50px; padding:14px 22px; color:var(--portal-paper); background:var(--portal-deep); text-decoration:none; font-size:12px; font-weight:700; }
.portal-editorial-button:hover { background:var(--portal-green); }
.portal-editorial-button span { color:#e8c5a1; font-size:18px; }
.portal-editorial-text-link { display:inline-flex; gap:14px; padding:10px 0; border-bottom:1px solid #aab0a0; font-size:12px; text-decoration:none; }
.portal-welcome-photo,.portal-story-photo,.portal-service-photo { margin:0; min-width:0; }
/* Natural image proportions: no cover crops, clipped masks, or zoom transforms. */
.portal-welcome-photo img,.portal-story-photo img,.portal-service-photo img,.portal-login-story-image img { display:block; width:100%; height:auto; max-width:100%; object-fit:contain; transform:none; }
.portal-welcome-photo { padding:12px 12px 0; border:1px solid #d9d2c4; background:#e9e2d6; }
.portal-welcome-photo figcaption { display:flex; justify-content:space-between; gap:14px; align-items:center; padding:16px 2px; color:#625f51; font-size:11px; line-height:1.5; }
.portal-welcome-photo figcaption span:first-child { max-width:130px; font-size:8px; font-weight:750; letter-spacing:.1em; }
.portal-destinations { border-top:1px solid var(--portal-line); padding-top:40px; }
.portal-section-heading { margin-bottom:32px; }
.portal-section-heading h2 { font-size:clamp(32px,3.8vw,54px); line-height:1.1; letter-spacing:-.035em; }
.portal-card-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:30px 24px; }
.portal-destination-card.is-enabled { min-height:0; padding:0 0 24px; background:transparent; border:0; border-bottom:1px solid #cccbbb; box-shadow:none; }
.portal-service-photo { background:#e7e2d7; }
.portal-service-photo img { aspect-ratio:3/2; object-fit:contain; }
.portal-service-number { margin:20px 0 10px; color:#817255; font-size:9px; font-weight:750; letter-spacing:.1em; }
.portal-destination-card h3 { margin:0 0 12px; font-size:30px; line-height:1.1; }
.portal-destination-card > p { font-size:13px; line-height:1.65; min-height:44px; margin-bottom:18px; }
.portal-card-footer { margin-top:auto; min-height:44px; padding-top:13px; font-size:11px; border-top:0; align-items:center; }
.portal-card-footer span { display:grid; place-items:center; width:30px; height:30px; border:1px solid #c4c7b9; border-radius:50%; font-size:16px; transition:background .15s; }
.portal-destination-card:focus-within .portal-card-footer span,.portal-destination-card:hover .portal-card-footer span { background:var(--portal-deep); color:white; }
.portal-card-status { background:#edece2; border:0; font-size:12px; }
.portal-identity-card { margin-top:48px; border:1px solid var(--portal-line); box-shadow:none; }
.portal-identity-heading { padding:26px 30px; background:var(--portal-deep); }
.portal-identity-heading h2 { font-size:30px; }
.portal-facts > div { min-height:100px; padding:24px 28px; }
.portal-facts dt { color:#6c7166; }
.portal-facts dd { font-size:13px; }
.portal-home-footer { color:#696f64; padding-block:24px 12px; margin-top:38px; }
.portal-breadcrumb { margin:0 0 24px; color:#716f63; }
.portal-profile-editorial { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.8fr); padding:0; gap:38px; background:transparent; color:var(--portal-ink); box-shadow:none; border-bottom:1px solid var(--portal-line); padding-bottom:32px; text-align:left; }
.portal-profile-heading { display:grid; grid-template-columns:auto 1fr; gap:20px; align-items:center; }
.portal-profile-heading .portal-primary-link { grid-column:1/-1; justify-self:start; margin:0; color:var(--portal-green); border-color:#b6baab; font-size:11px; }
.portal-profile-photo { width:100px; aspect-ratio:4/5; padding:5px; border:1px solid #d5c8ad; border-radius:3px; background:var(--portal-paper); margin:0; }
.portal-profile-intro h1 { font-size:clamp(34px,4vw,56px); line-height:1.04; }
.portal-profile-intro > p:not(.portal-kicker) { color:var(--portal-muted); font-size:13px; line-height:1.65; }
.portal-profile-intro .portal-status { color:#315a46; background:#e4eadc; padding:6px 9px; font-size:10px; letter-spacing:.08em; }
.portal-story-photo figcaption { padding:12px 0 0; color:#77715f; font-size:11px; font-style:italic; line-height:1.5; }
.portal-profile-section,.portal-photo-panel,.portal-edit-form,.portal-readonly-panel { box-shadow:none; }
.portal-profile-section-heading { padding:24px; }
.portal-profile-section-heading h2 { font-size:29px; }
.portal-profile-section-heading > span { line-height:1.5; text-align:right; }
.portal-profile-details > div { padding:22px 24px; }
.portal-profile-details dt { font-size:10px; color:#6a7164; }
.portal-profile-details dd { font-size:14px; }
.portal-photo-panel { background:#eae9dd; border-color:#d8d7c8; }
.portal-photo-panel h2 { line-height:1.1; }
.portal-data-note { color:#5d685c; background:#f0f1e8; line-height:1.6; }
.portal-story-header { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); align-items:center; gap:50px; margin:0 0 28px; padding:0 0 30px; color:var(--portal-ink); background:transparent; box-shadow:none; border-bottom:1px solid var(--portal-line); }
.portal-story-header h1 { margin:12px 0 18px; color:var(--portal-deep); font:400 clamp(42px,5.5vw,72px)/1.02 var(--portal-serif); letter-spacing:-.045em; }
.portal-story-header > div > p:last-child,.portal-story-header > div > p:not(.portal-kicker) { color:var(--portal-muted); font-size:15px; line-height:1.7; margin:0 0 20px; max-width:520px; }
.portal-story-header .portal-finance-link { display:inline-flex; min-height:44px; align-items:center; border-bottom:1px solid #b6baab; font-size:12px; white-space:normal; }
.portal-finance-note { background:#ece8db; border-color:#b27b53; color:#605743; }
.portal-pay-period,.portal-loan-card,.portal-finance-empty { border-color:var(--portal-line); border-radius:3px; box-shadow:none; background:var(--portal-paper); }
.portal-pay-period { border-top:3px solid var(--portal-green); }
.portal-payslip-grid { grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr)); max-width:1100px; }
.portal-pay-period h2 { overflow-wrap:anywhere; }
.portal-pay-period .portal-net-total { padding:18px; margin-top:12px; background:#e8eddf; color:var(--portal-deep); }
.portal-finance-empty { padding:40px; border-style:dashed; }
.portal-finance-empty h2 { font:400 30px/1.2 var(--portal-serif); margin:0 0 12px; }
.portal-finance-empty p { color:var(--portal-muted); line-height:1.7; font-size:14px; }
.portal-finance-button,.portal-face-entry { background:var(--portal-deep); border-color:var(--portal-deep); border-radius:3px; }
.portal-finance-button:hover,.portal-face-entry:hover { background:var(--portal-green); }
button.portal-face-entry { width:100%; text-align:left; font:inherit; font-weight:650; cursor:pointer; gap:16px; }
button.portal-face-entry:disabled { opacity:.65; cursor:wait; }
.portal-finance-link { color:var(--portal-green); }
.portal-today-card,.portal-attendance-workflow,.portal-biometric-card { box-shadow:none; }
.portal-biometric-card { border-color:var(--portal-line); }
.portal-biometric-card h2,.portal-today-copy h2 { line-height:1.08; }
.portal-attendance-primary,.portal-button-primary { background:var(--portal-deep); }
.portal-camera-preview video,.camera-preview-wrap video { object-fit:contain; }
.portal-login-shell { grid-template-columns:minmax(0,1fr) minmax(420px,.9fr); background:var(--portal-deep); }
.portal-login-story { display:flex; flex-direction:column; justify-content:center; gap:34px; padding:42px clamp(28px,4vw,64px); min-height:100vh; overflow:visible; }
.portal-login-brand { position:static; order:0; }
.portal-login-story-shade { display:none; }
.portal-login-story-image { position:static; order:2; background:none; transform:none; margin:0; }
.portal-login-quote { position:static; order:1; }
.portal-login-quote h2 { font-size:clamp(40px,4.5vw,68px); line-height:1.02; margin:0 0 22px; }
.portal-login-quote h2 em { color:#dfa884; }
.portal-login-quote > span { font-size:10px; line-height:1.6; }
.portal-login-panel { padding:50px clamp(30px,5vw,80px); background:var(--portal-paper); }
.portal-back-link { margin-bottom:40px; }
.portal-login-form-wrap h1 { font-size:clamp(40px,4vw,60px); line-height:1.05; }
.portal-login-intro { font-size:14px; margin:20px 0; }
.portal-login-privacy { line-height:1.6; }
.portal-face-login { background:var(--portal-paper); border-color:var(--portal-line); }
.portal-face-login h1 { color:var(--portal-deep); }
.portal-face-voice-controls button,.portal-face-voice-controls select { font-family:inherit; font-size:13px; font-weight:600; }
@media(min-width:769px) and (max-width:1100px) {
    .portal-header { padding-inline:20px; }.portal-desktop-nav { gap:12px; }
    .portal-account-copy { display:none; }.portal-main { padding-inline:32px; }
    .portal-welcome-actions { gap:14px; }.portal-card-grid { gap:22px; }
    .portal-destination-card h3 { font-size:27px; }
    .portal-profile-heading { grid-template-columns:1fr; }.portal-profile-photo { width:80px; }
}
@media(max-width:768px) {
    .portal-header { min-height:72px; padding:12px 20px; }
    .portal-main { padding:26px 20px var(--portal-mobile-content-reserve); }
    .portal-welcome-editorial { grid-template-columns:1fr; gap:28px; margin:4px 0 36px; }
    .portal-welcome-editorial h1 { font-size:clamp(42px,9vw,66px); }
    .portal-welcome-editorial .portal-welcome-copy > .portal-kicker { margin-bottom:16px; }
    .portal-welcome-actions { margin-top:24px; }
    .portal-welcome-photo { padding:8px 8px 0; }.portal-welcome-photo figcaption { padding:12px 2px; }
    .portal-destinations { padding-top:30px; }.portal-section-heading { gap:18px; }
    .portal-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 18px; }
    .portal-destination-card h3 { font-size:26px; }.portal-destination-card > p { min-height:0; }
    .portal-profile-editorial,.portal-story-header { grid-template-columns:1fr; gap:24px; }
    .portal-profile-heading { grid-template-columns:80px minmax(0,1fr); gap:18px; }
    .portal-profile-photo { width:80px; margin:0; }
    .portal-profile-intro h1 { font-size:34px; }
    .portal-profile-heading .portal-primary-link { justify-self:start; }
    .portal-profile-layout { grid-template-columns:1fr; }
    .portal-profile-section-heading > span { text-align:left; }
    .portal-story-header h1 { font-size:46px; }
    .portal-story-header > div > p:not(.portal-kicker) { font-size:14px; }
    .portal-story-header .portal-story-photo { max-width:540px; }
    .portal-mobile-nav { grid-template-columns:repeat(6,minmax(0,1fr)); border-radius:10px; background:#203c32fa; }
    .portal-mobile-nav > a { font-size:9px; color:#d0d7c9; }
    .portal-mobile-nav > .is-active { color:#f1c8a5; background:#ffffff0a; border-radius:5px; }
    .portal-login-shell { grid-template-columns:1fr; }
    .portal-login-story { min-height:0; padding:28px; gap:24px; }
    .portal-login-quote h2 { font-size:42px; }
    .portal-login-story-image { max-width:520px; }
    .portal-login-panel { min-height:0; padding:36px 24px; }
}
@media(max-width:540px) {
    .portal-card-grid { grid-template-columns:1fr; }
    .portal-destination-card:nth-child(n) { min-height:0; }
    .portal-service-number { margin-top:16px; }
    .portal-destination-card h3 { font-size:30px; }
    .portal-destination-card > p { font-size:14px; }
    .portal-card-status dd { font-size:12px; }
    .portal-identity-heading { padding:22px; }
    .portal-identity-heading h2 { font-size:26px; }
    .portal-identity-heading .portal-personnel-monogram { width:52px; height:64px; }
    .portal-facts > div { padding:20px 24px; }
    .portal-profile-intro h1 { font-size:30px; }.portal-profile-intro .portal-kicker { font-size:9px; }
    .portal-profile-editorial { text-align:left; }
    .portal-profile-section-heading,.portal-profile-details > div { padding:22px; }
    .portal-profile-section-heading h2 { font-size:27px; }
    .portal-finance-empty { padding:28px 22px; }
    .portal-pay-period .portal-net-total { padding:14px 10px; font-size:20px; }
    .portal-home-footer { padding-bottom:6px; }
}
@media print {
    .portal-welcome-photo,.portal-service-photo,.portal-story-photo,.portal-welcome-actions { display:none!important; }
    .portal-main { padding:0!important; }
}