/* Shared geometry stays fixed while native pages render their own content. */
html{overflow-y:scroll;scrollbar-gutter:stable}
.employee-activation-pending body{visibility:hidden!important}
.workspace-header,.employee-bottom-nav{box-sizing:border-box}
.employee-bottom-nav{grid-template-columns:repeat(7,minmax(0,1fr))!important;contain:layout}
.employee-bottom-nav>a{min-width:0;flex:1 1 0}
body[data-employee-tool=training] .km-grid:not([data-layout=list]){display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));align-items:stretch}
.personal-month-active>.rota-header-row,.personal-month-active>.rota-swap-links,.personal-month-active>#rotaToolbar,.personal-month-active>#todayView{display:none!important}
.rota-month-workspace{color:#202631;margin-bottom:16px;min-width:0}
.month-heading,.month-controls,.month-caption,.month-dialog-head,.month-day-shift{display:flex;align-items:center;justify-content:space-between;gap:12px}
.month-heading{margin-bottom:14px}.month-heading h2{font-size:24px;margin:0}.month-view-switch{display:flex;background:#eaedf1;border-radius:9px;padding:3px;gap:2px}
.rota-month-workspace button,.rota-month-workspace input,.rota-month-workspace select,.rota-day-dialog button{font:inherit}
.month-view-switch button,.month-controls button,.month-pagination button{border:0;background:transparent;min-height:var(--rp-control-compact);cursor:pointer;border-radius:7px;padding:5px 12px;color:inherit}
.month-view-switch button[aria-pressed=true]{background:white;box-shadow:0 1px 4px #00000012;font-weight:650}
.month-controls{justify-content:flex-start;flex-wrap:wrap;margin-bottom:12px}.month-controls select,.month-controls input{background:white;border:1px solid #dce1e8;border-radius:8px;min-height:var(--rp-control-compact);padding:5px 9px;max-width:100%;color:inherit}.month-controls>button{margin-left:auto;border:1px solid #dce1e8;background:white}
.month-pagination{display:flex;align-items:center;gap:2px}.month-pagination button{font-size:24px;width:34px;padding:0}.month-caption{font-size:13px;margin:12px 0}.month-legend{display:flex;gap:7px;align-items:center;font-size:11px;color:#566173}.month-legend i{height:7px;width:7px;border-radius:50%;display:inline-block}.month-legend .fixed{background:#198263}.month-legend .preview{background:#d69225}
.personal-month-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px}.month-weekday{text-align:center;font-size:11px;font-weight:600;color:#748091;padding:5px}
.personal-month-grid .month-cell{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0;min-height:125px;background:white;border:1px solid #e0e6e8;border-top:3px solid #26896b;border-radius:9px;padding:9px;text-align:left;cursor:pointer;color:#293343;transition:box-shadow .12s}
.personal-month-grid .month-cell.preview{border-top-color:#d79b3d}.personal-month-grid .month-cell.today{box-shadow:0 0 0 2px #202f48}.personal-month-grid .month-cell.past{background:#f1f3f5;color:#73808c}.month-cell.past .month-shift{filter:grayscale(.85);opacity:.8}.month-cell:hover{box-shadow:0 2px 10px #00000012}.month-date{font-size:12px;font-weight:700;display:flex;align-items:center;gap:4px}.month-date i{width:5px;height:5px;border-radius:50%;background:#202f48}.month-shift{display:inline-block;border-radius:5px;padding:3px 6px;font-size:11px;font-weight:650;color:#293343;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.shift-mor{background:#f3df80}.shift-noon{background:#eccade}.shift-eve{background:#addcea}.shift-half{background:#c4e3ca}.shift-leave,.shift-sick{background:#e8c6dc}.shift-holiday{background:#f0ddb1}.shift-off{background:#e5e7eb}.month-target{font-size:15px;letter-spacing:-.3px}.month-cell small{display:flex;align-items:center;gap:3px;font-size:10px;color:#7a8695;min-height:12px}.month-cell small .icon{height:12px;width:12px}.month-no-shift{min-height:21px;color:#a4adba}.month-context,.month-key{font-size:12px;color:#6b7583;margin:10px 0}.month-quick-links{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:12px}.month-quick-links a{display:flex;align-items:center;gap:6px;font-size:13px;color:#43556f;text-decoration:none;min-height:36px}.month-quick-links .icon{width:16px;height:16px}
.rota-day-dialog{width:min(540px,calc(100% - 24px));max-height:85dvh;overflow:auto;border:1px solid #e1e5eb;border-radius:18px;padding:22px;background:white;color:#293343;box-shadow:0 20px 90px #18253e44;box-sizing:border-box}.rota-day-dialog::backdrop{background:#13213f70}.month-dialog-head h2{font-size:20px;margin:5px 0}.month-dialog-head small{color:#768294}.month-dialog-head button{background:#f1f3f6;border:0;width:36px;height:var(--rp-control-compact);border-radius:50%;display:grid;place-items:center;cursor:pointer}.month-dialog-head .icon{width:20px;height:20px}.month-day-shift{justify-content:flex-start;flex-wrap:wrap;margin:18px 0}.month-status{margin-left:auto;font-size:11px;border-radius:5px;padding:4px 7px}.month-status.fixed{background:#e4f4ed;color:#197255}.month-status.preview{background:#fff2d9;color:#916111}.rota-day-dialog h3{font-size:13px;margin:20px 0 10px}.month-targets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.month-targets>div{background:#f4f6f8;border-radius:9px;padding:12px 8px}.month-targets small{font-size:10px;color:#697689;display:block;margin-bottom:5px}.month-targets strong{font-size:17px}.month-person{display:flex;align-items:center;gap:8px;padding:10px 0;border-bottom:1px solid #edf0f4;font-size:12px}.month-person strong{flex:1}.month-person>span:last-child{font-variant-numeric:tabular-nums;font-size:11px}.month-team{margin:18px 0}.month-team summary{font-size:13px;cursor:pointer}.month-team summary b{float:right}.month-load-error{color:#a22e20;font-size:13px}
form[data-form=after-save] fieldset{border:0;padding:0;margin:0;min-width:0}
@media(max-width:720px){
 body[data-employee-tool=training] .km-grid:not([data-layout=list]){grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
 body[data-employee-tool=training] .km-grid:not([data-layout=list]) .km-card{min-width:0;margin:0;overflow:hidden}
 body[data-employee-tool=training] .km-grid:not([data-layout=list]) .km-card-media{height:112px;min-height:0;aspect-ratio:1.4}
 body[data-employee-tool=training] .km-grid:not([data-layout=list]) .km-card-body{padding:10px}
 body[data-employee-tool=training] .km-grid:not([data-layout=list]) .km-card h3{font-size:13px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
 body[data-employee-tool=training] .km-grid:not([data-layout=list]) .km-card-body>p{display:none}
 .month-heading{gap:7px;margin-bottom:12px}.month-heading h2{font-size:21px}.month-view-switch button{padding:5px 9px;font-size:12px}.month-controls{gap:5px}.month-controls select{max-width:122px}.month-controls select,.month-controls input,.month-controls button{font-size:12px;min-height:var(--rp-control-compact);padding:4px 6px}.month-pagination button{font-size:23px;width:25px}.month-pagination input{width:124px}.month-controls>button{margin-left:auto}.personal-month-grid{gap:4px}.personal-month-grid .month-cell{padding:5px 3px;min-height:94px;border-radius:7px;gap:4px}.month-cell .month-shift{font-size:9px;padding:3px 4px}.month-date{font-size:11px}.month-target{font-size:11px;letter-spacing:-.3px}.month-cell small{font-size:9px}.month-weekday{font-size:10px}.month-caption{font-size:12px}.month-key{font-size:10px}.rota-day-dialog{padding:17px}.month-targets{grid-template-columns:1fr 1fr}.month-targets small{font-size:11px}.month-targets strong{font-size:19px}
}

.route-loading{min-height:360px;max-width:1180px;margin-inline:auto}.route-skeleton{height:180px;border-radius:var(--rp-group-radius,16px);background:var(--line);opacity:.45}.route-loading h1{font-size:var(--rp-title-size,26px)}
.offer-workspace-support .tool-my-learning>a{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.offer-workspace-support .tool-my-learning>a>span{flex:1}.offer-workspace-support .tool-my-learning small{display:block;color:var(--muted)}
/* Shared interaction language (lanes/shared/INTERACTION-SPEC.md). Existing tokens only; new tokens arrive after the Home release. */
/* §3 Next level: in-page drill-down and Back move the content area only; the header and navigation stay still. */
#page.rp-push-forward{animation:rp-push-forward var(--rp-enter-duration) var(--rp-ease)}
#page.rp-push-back{animation:rp-push-back var(--rp-panel-duration) var(--rp-ease)}
@keyframes rp-push-forward{from{opacity:0;translate:var(--rp-space-4) 0}}
@keyframes rp-push-back{from{opacity:0;translate:calc(-1 * var(--rp-space-4)) 0}}
html[data-theme] #page h1[tabindex="-1"]:focus,html[data-theme] #page[tabindex="-1"]:focus{outline:none}
/* §3 Disclosures open and close in place where the browser can animate to auto height. */
@supports (interpolate-size:allow-keywords){
  #page details{interpolate-size:allow-keywords}
  #page details::details-content{block-size:0;opacity:0;overflow:clip;overflow-clip-margin:calc(2 * var(--rp-focus-width));transition:block-size var(--rp-panel-duration) var(--rp-ease),opacity var(--rp-panel-duration) var(--rp-ease),content-visibility var(--rp-panel-duration) allow-discrete}
  #page details[open]::details-content{block-size:auto;opacity:1}
  #page.rp-no-motion details::details-content{transition:none}
}
/* §3 Interruptions and existing dialogs: a short scale-and-fade entrance. */
dialog[open]:not(.rp-sheet){animation:rp-dialog-in var(--rp-state-duration) var(--rp-ease)}
dialog[open]:not(.rp-sheet)::backdrop{animation:rp-fade-in var(--rp-state-duration) var(--rp-ease)}
@keyframes rp-dialog-in{from{opacity:0;scale:.97}}
@keyframes rp-fade-in{from{opacity:0}}
@keyframes rp-fade-out{to{opacity:0}}
.rp-confirm{width:min(400px,calc(100% - 2 * var(--rp-space-4)));padding:var(--rp-space-6);background:var(--paper);color:var(--ink);box-shadow:var(--rp-overlay-shadow)}
.rp-confirm h2{margin:0 0 var(--rp-space-2);font-size:var(--rp-section-size);line-height:1.35}
.rp-confirm p{margin:0;color:var(--muted);font-size:var(--rp-body-size);line-height:1.6}
.rp-confirm-body{display:grid;gap:var(--rp-space-3);color:var(--muted);font-size:var(--rp-body-size);line-height:1.6}
.rp-confirm-actions{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:var(--rp-space-2);margin-top:var(--rp-space-6)}
.rp-confirm-actions .button{min-height:var(--rp-control-size)}
/* §3 Temporary task: bottom sheet on phones, right-hand drawer from 1000px. */
.rp-sheet{margin:auto 0 0;width:100%;max-width:100%;max-height:90dvh;padding:0;border:0;background:var(--paper);color:var(--ink);overflow:hidden;box-shadow:var(--rp-overlay-shadow)}
html[data-theme] dialog.rp-sheet{border-radius:var(--rp-dialog-radius) var(--rp-dialog-radius) 0 0}
.rp-sheet[open]{animation:rp-sheet-in-up var(--rp-enter-duration) var(--rp-ease)}
.rp-sheet[open]::backdrop{animation:rp-fade-in var(--rp-enter-duration) var(--rp-ease)}
.rp-sheet.is-closing{animation:rp-sheet-out-down var(--rp-panel-duration) var(--rp-ease) forwards}
.rp-sheet.is-closing::backdrop{animation:rp-fade-out var(--rp-panel-duration) var(--rp-ease) forwards}
@keyframes rp-sheet-in-up{from{translate:0 100%}}
@keyframes rp-sheet-out-down{to{translate:0 100%}}
@keyframes rp-sheet-in-left{from{translate:100% 0}}
@keyframes rp-sheet-out-right{to{translate:100% 0}}
.rp-sheet-panel{display:flex;flex-direction:column;max-height:inherit}
.rp-sheet-panel::before{content:"";align-self:center;flex:none;width:var(--rp-space-8);height:var(--rp-space-1);margin-top:var(--rp-space-2);border-radius:var(--rp-space-1);background:var(--line)}
.rp-sheet-head{display:flex;align-items:center;gap:var(--rp-space-2);padding:var(--rp-space-2) var(--rp-space-2) var(--rp-space-2) var(--rp-space-4);border-bottom:1px solid var(--line)}
.rp-sheet-head h2{flex:1;min-width:0;margin:0;font-size:var(--rp-section-size);line-height:1.35}
html[data-theme] .rp-sheet-head h2[tabindex="-1"]:focus{outline:none}
.rp-sheet-body{overflow:auto;overscroll-behavior:contain;padding:var(--rp-space-4) var(--rp-space-4) calc(var(--rp-space-4) + env(safe-area-inset-bottom))}
@media(min-width:1000px){
  .rp-sheet{margin:0 0 0 auto;width:min(420px,100%);height:100dvh;max-height:100dvh}
  html[data-theme] dialog.rp-sheet{border-radius:var(--rp-dialog-radius) 0 0 var(--rp-dialog-radius)}
  .rp-sheet[open]{animation-name:rp-sheet-in-left}
  .rp-sheet.is-closing{animation-name:rp-sheet-out-right}
  .rp-sheet-panel{height:100%}
  .rp-sheet-panel::before{display:none}
  .rp-sheet-body{flex:1}
}
/* §3.2 UX-A1-10: a question inside the sheet (confirmInSheet), pinned under the fields it is about; they stay as typed. */
.rp-sheet-confirm{flex:none;padding:var(--rp-space-4) var(--rp-space-4) calc(var(--rp-space-4) + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--paper);box-shadow:0 -6px 18px rgb(0 0 0 / .06)}
.rp-sheet-confirm h3{margin:0 0 var(--rp-space-1);font-size:var(--rp-strong-size);line-height:1.4}
.rp-sheet-confirm p{margin:0;color:var(--muted);font-size:var(--rp-body-size);line-height:1.6}
.rp-sheet-confirm .rp-confirm-actions{margin-top:var(--rp-space-4)}
.rp-sheet-panel:has(>.rp-sheet-confirm)>.rp-sheet-body{opacity:.55}
/* UX-A1-22: a Home block with nothing open is one entry line (44px), with at most one action beside it. */
.rp-entry-row{display:flex;align-items:center;gap:var(--rp-space-2);padding:0 var(--rp-space-2) 0 0;border:1px solid var(--line);border-radius:var(--rp-card-radius,12px);background:var(--paper)}
.rp-entry-link{flex:1;min-width:0;display:flex;align-items:center;gap:var(--rp-space-3);min-height:44px;padding:var(--rp-space-2) var(--rp-space-3) var(--rp-space-2) var(--rp-space-4);color:var(--ink);text-decoration:none}
.rp-entry-link>span{flex:1;min-width:0;display:flex;flex-wrap:wrap;align-items:baseline;column-gap:var(--rp-space-2)}
.rp-entry-link strong{font-size:var(--rp-strong-size);font-weight:var(--rp-weight-semibold)}
.rp-entry-link small{color:var(--muted);font-size:var(--rp-small-size)}
.rp-entry-link>.icon{color:var(--muted)}
.rp-entry-action{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;padding:0 var(--rp-space-2);color:var(--accent);font-weight:var(--rp-weight-semibold);text-decoration:none;white-space:nowrap}
/* §5 Toasts queue; one may carry an Undo action. */
#toast.show{animation:rp-toast-in var(--rp-state-duration) var(--rp-ease)}
@keyframes rp-toast-in{from{opacity:0;translate:0 var(--rp-space-2)}}
#toast .rp-toast-action{margin-left:var(--rp-space-3);min-height:var(--rp-control-size);padding:0 var(--rp-space-1);color:inherit;font-weight:600;text-decoration:underline}
/* §5 Press feedback. */
html[data-theme] .button:active:not(:disabled){scale:.97}
html[data-theme] .icon-button:active:not(:disabled){scale:.94}
html[data-theme] .menu-link:active{scale:.985}
/* §6 One container for loading / empty / missing / error / denied / offline. */
.rp-state{display:flex;flex-direction:column;align-items:center;gap:var(--rp-space-2);padding:var(--rp-space-6) var(--rp-space-4);text-align:center;color:var(--muted);font-size:var(--rp-body-size);line-height:1.6}
.rp-state p{margin:0;max-width:40ch}
.rp-state .button{min-height:var(--rp-control-size);margin-top:var(--rp-space-1)}
.rp-state-icon{display:grid;place-items:center;width:var(--rp-control-size);height:var(--rp-control-size);border-radius:var(--rp-group-radius);background:var(--surface-soft);color:var(--muted)}
.rp-state.is-loading{align-items:stretch}
.rp-state.is-loading p{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.rp-skeleton{display:block;height:var(--rp-space-8);border-radius:var(--rp-control-radius);background:var(--surface-soft)}
.rp-state.is-error .rp-state-icon,.rp-state.is-denied .rp-state-icon{background:var(--danger-soft);color:var(--danger)}
/* §7 Status chips and trend marks: colour always comes with text or a glyph. */
.rp-chip{display:inline-flex;align-items:center;gap:var(--rp-space-1);padding:var(--rp-space-1) var(--rp-space-2);border-radius:var(--rp-chip-radius);background:var(--surface-soft);color:var(--muted);font-size:var(--rp-help-size);font-weight:500;line-height:1.3;white-space:nowrap}
.rp-chip.is-success{background:var(--success-soft);color:var(--success)}
.rp-chip.is-done{background:var(--surface-soft);color:var(--muted)}
/* A negative points balance (RFC-31 §5): the number and "(credit)" in the warning ink, never a hard-coded colour. */
.rp-points.is-credit{color:var(--warning-ink);white-space:nowrap}
.rp-chip .icon{width:var(--rp-help-size);height:var(--rp-help-size)}
/* Completed-type states: grey circled tick plus words (28 Sep decision); attainment and change never use a tick. */
.rp-done{display:inline-flex;align-items:center;gap:var(--rp-space-1);color:var(--muted)}
.rp-done .icon{width:var(--rp-strong-size);height:var(--rp-strong-size)}
.rp-mark{display:inline-block;flex:none;width:var(--rp-strong-size);height:var(--rp-strong-size);background:currentColor;color:var(--muted);-webkit-mask:var(--rp-done-mark) center/contain no-repeat;mask:var(--rp-done-mark) center/contain no-repeat}
.rp-mark.is-todo{-webkit-mask-image:var(--rp-todo-mark);mask-image:var(--rp-todo-mark)}
.tp-segment .icon{width:var(--rp-body-size);height:var(--rp-body-size)}
.rp-chip:is(.is-warning,.is-partial){background:var(--warning-soft);color:var(--warning-ink)}
.rp-chip.is-danger{background:var(--danger-soft);color:var(--danger)}
.rp-chip.is-priority{background:var(--priority-soft);color:var(--priority-ink)}
.rp-chip.is-early{background:var(--shift-early-bg);color:var(--shift-early-ink)}
.rp-chip.is-mid{background:var(--shift-mid-bg);color:var(--shift-mid-ink)}
.rp-chip.is-late{background:var(--shift-late-bg);color:var(--shift-late-ink)}
.rp-chip.is-off{background:var(--shift-off-bg);color:var(--shift-off-ink)}
.rp-trend{font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--muted)}
.rp-trend.is-up{color:var(--trend-up)}
.rp-trend.is-down{color:var(--trend-down)}
/* v1.1 batch 1 (INTERACTION-SPEC sections 13-16): new classes only; no existing selector changes. */
/* Icons: size follows the text it sits with; icons stay square. */
.icon.icon-sm{width:var(--rp-icon-sm);height:var(--rp-icon-sm)}
.icon.icon-md{width:var(--rp-icon-md);height:var(--rp-icon-md)}
.icon.icon-lg{width:var(--rp-icon-lg);height:var(--rp-icon-lg)}
.rp-with-icon{display:inline-flex;align-items:center;gap:var(--rp-space-1)}
/* Type styles: size, line height and weight as one step. */
.rp-text-help{font-size:var(--rp-help-size);line-height:var(--rp-leading-body);font-weight:var(--rp-weight-regular);color:var(--muted)}
.rp-text-small{font-size:var(--rp-small-size);line-height:var(--rp-leading-body);font-weight:var(--rp-weight-regular)}
.rp-text-body{font-size:var(--rp-body-size);line-height:var(--rp-leading-body);font-weight:var(--rp-weight-regular)}
.rp-text-strong{font-size:var(--rp-strong-size);line-height:var(--rp-leading-tight);font-weight:var(--rp-weight-semibold)}
.rp-text-section{font-size:var(--rp-section-size);line-height:var(--rp-leading-tight);font-weight:var(--rp-weight-semibold);letter-spacing:var(--rp-tracking-tight)}
.rp-text-title{font-size:var(--rp-title-size);line-height:var(--rp-leading-tight);font-weight:var(--rp-weight-semibold);letter-spacing:var(--rp-tracking-tight);text-wrap:balance}
.rp-text-display{font-size:var(--rp-display-size);line-height:var(--rp-leading-tight);font-weight:var(--rp-weight-semibold);letter-spacing:var(--rp-tracking-tight);font-variant-numeric:tabular-nums}
.rp-num{font-variant-numeric:tabular-nums}
.rp-prose{max-width:var(--rp-reading-max);font-size:var(--rp-body-size);line-height:var(--rp-leading-loose);text-wrap:pretty}
/* Switching: one selected style site-wide (sliding thumb). Up to 5 options: buttons with aria-pressed, tabs (role=tab + aria-selected) or links
   (aria-current=page), so tab and link semantics stay; the option count and the
   selected position are read from the buttons, so no inline style is needed (the CSP is style-src 'self'). */
.rp-seg{--n:2;--i:0;position:relative;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;padding:var(--rp-space-1);border-radius:var(--rp-control-radius);background:var(--surface-soft);min-height:var(--rp-control-size)}
.rp-seg::before{content:"";position:absolute;inset:var(--rp-space-1) auto var(--rp-space-1) var(--rp-space-1);width:calc((100% - 2 * var(--rp-space-1)) / var(--n));border-radius:calc(var(--rp-control-radius) - var(--rp-space-1));background:var(--paper);box-shadow:var(--rp-card-shadow);translate:calc(var(--i) * 100%) 0;transition:translate var(--rp-enter-duration) var(--rp-spring)}
.rp-seg:has(>:is(button,a):nth-child(3)){--n:3}.rp-seg:has(>:is(button,a):nth-child(4)){--n:4}.rp-seg:has(>:is(button,a):nth-child(5)){--n:5}
.rp-seg:has(>:is(button,a):nth-child(2):is([aria-pressed="true"],[aria-selected="true"],[aria-current="page"])){--i:1}.rp-seg:has(>:is(button,a):nth-child(3):is([aria-pressed="true"],[aria-selected="true"],[aria-current="page"])){--i:2}.rp-seg:has(>:is(button,a):nth-child(4):is([aria-pressed="true"],[aria-selected="true"],[aria-current="page"])){--i:3}.rp-seg:has(>:is(button,a):nth-child(5):is([aria-pressed="true"],[aria-selected="true"],[aria-current="page"])){--i:4}
.rp-seg:not(:has(>:is(button,a):is([aria-pressed="true"],[aria-selected="true"],[aria-current="page"])))::before{visibility:hidden}
.rp-seg>:is(button,a){position:relative;min-width:0;padding:0 var(--rp-space-3);border-radius:calc(var(--rp-control-radius) - var(--rp-space-1));color:var(--muted);font-size:var(--rp-small-size);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color var(--rp-state-duration) var(--rp-ease)}
.rp-seg>a{display:flex;align-items:center;justify-content:center;text-decoration:none}
.rp-seg>:is(button,a):is([aria-pressed="true"],[aria-selected="true"],[aria-current="page"]){color:var(--ink);font-weight:var(--rp-weight-semibold)}
.rp-seg.is-compact{min-height:var(--rp-control-compact)}
/* Filtering: multi-select chips; selection shows in text, shape and a tick mask, not colour alone. */
.rp-filter{display:inline-flex;align-items:center;gap:var(--rp-space-1);min-height:var(--rp-control-compact);padding:0 var(--rp-space-3);border:1px solid var(--line);border-radius:var(--rp-pill-radius);background:var(--paper);color:var(--ink);font-size:var(--rp-small-size)}
.rp-filter[aria-pressed="true"]{border-color:var(--accent);background:var(--accent-soft);color:var(--accent);font-weight:var(--rp-weight-semibold)}
.rp-filter[aria-pressed="true"]::before{content:"";width:var(--rp-icon-sm);height:var(--rp-icon-sm);background:currentColor;-webkit-mask:var(--rp-done-mark) center/contain no-repeat;mask:var(--rp-done-mark) center/contain no-repeat}
/* Compact controls keep a 44px hit area. */
.rp-hit{position:relative}
.rp-hit::after{content:"";position:absolute;inset:calc((var(--rp-control-compact) - var(--rp-control-size)) / 2) 0}
/* Page skeletons: layout only; sections opt in. */
.rp-page{display:grid;gap:var(--rp-space-6);max-width:var(--rp-content-max);margin:0 auto;padding:var(--rp-space-4) var(--rp-space-4) var(--rp-space-8)}
.rp-page.is-wide{max-width:var(--rp-table-max)}
.rp-page.is-reading{max-width:calc(var(--rp-reading-max) + 2 * var(--rp-space-4))}
.rp-page-head{display:flex;align-items:flex-end;gap:var(--rp-space-3);flex-wrap:wrap}
.rp-page-head>:first-child{flex:1 1 auto;min-width:0}
.rp-toolbar{position:sticky;top:var(--rp-header-height);z-index:var(--rp-z-sticky);display:flex;flex-wrap:wrap;align-items:center;gap:var(--rp-space-2);padding:var(--rp-space-2) 0;background:var(--canvas)}
.rp-actions{position:sticky;bottom:0;z-index:var(--rp-z-sticky);display:flex;justify-content:flex-end;gap:var(--rp-space-2);padding:var(--rp-space-3) var(--rp-space-4) calc(var(--rp-space-3) + env(safe-area-inset-bottom));background:var(--paper);border-top:1px solid var(--line)}
/* Phones: the bottom navigation is fixed over the page, so a sticky action bar stops just above it (R-tasks-14). */
@media(max-width:720px){:root:has(.employee-bottom-nav) .rp-actions{bottom:var(--rp-dock-height);padding-bottom:var(--rp-space-3)}}
/* Pop-up menu (spec 3.1, 7; R-tasks-11): a native popover that ui.mjs places next to its trigger. It rises 4px as it fades in;
   Esc and a click elsewhere close it (native light dismiss); arrow keys, Home and End move between items. */
.rp-menu{position:fixed;inset:auto;margin:0;min-width:180px;max-width:min(320px,calc(100vw - 2 * var(--rp-space-2)));padding:var(--rp-space-1);border:1px solid var(--line);border-radius:var(--rp-control-radius);background:var(--paper);color:var(--ink);box-shadow:var(--rp-float-shadow);opacity:1;translate:0 0;transition:opacity var(--rp-state-duration) var(--rp-ease),translate var(--rp-state-duration) var(--rp-ease),display var(--rp-state-duration) allow-discrete,overlay var(--rp-state-duration) allow-discrete}
.rp-menu:not(:popover-open){opacity:0;translate:0 4px}
@starting-style{.rp-menu:popover-open{opacity:0;translate:0 4px}}
.rp-menu-item{display:flex;align-items:center;gap:var(--rp-space-2);width:100%;min-height:var(--rp-control-size);padding:0 var(--rp-space-3);border:0;border-radius:calc(var(--rp-control-radius) - var(--rp-space-1));background:none;color:var(--ink);font:inherit;font-size:var(--rp-small-size);text-align:left;cursor:pointer}
.rp-menu-item:is(:hover,:focus-visible){background:var(--surface-hover)}
.rp-menu-item.is-danger{color:var(--danger)}
.rp-menu-item .icon{flex:none;width:var(--rp-icon-sm);height:var(--rp-icon-sm);color:var(--muted)}
.rp-stack{display:grid;gap:var(--rp-space-3)}
.rp-stack.is-loose{gap:var(--rp-space-6)}
.rp-split{display:grid;gap:var(--rp-space-5)}
@media(min-width:1000px){.rp-split{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}.rp-page{padding:var(--rp-space-6) var(--rp-space-8) var(--rp-space-8)}}
.rp-scroll-x{overflow-x:auto;overscroll-behavior-x:contain;max-width:100%}
.rp-scroll-x>table{min-width:max-content}
.rp-scroll-x :is(th,td):first-child{position:sticky;left:0;background:var(--paper)}
/* v1.1 2c (INTERACTION-SPEC 15): two control heights. Compact buttons (36px) keep a 44px touch target on touch screens. */
@media (pointer:coarse){:is(.segmented button,.month-view-switch button,.month-controls button,.month-pagination button,.month-dialog-head button,.people-row .button,.private-preview-banner .button,.learning-overview.is-read>a.button,.offer-benefits .text-button,.offer-benefit-row .button,.performance-period button,.course-object-tabs a,.course-object-stores a){position:relative}:is(.segmented button,.month-view-switch button,.month-controls button,.month-pagination button,.month-dialog-head button,.people-row .button,.private-preview-banner .button,.learning-overview.is-read>a.button,.offer-benefits .text-button,.offer-benefit-row .button,.performance-period button,.course-object-tabs a,.course-object-stores a)::after{content:"";position:absolute;inset:calc((var(--rp-control-compact) - var(--rp-control-size)) / 2) 0}}
/* Round 3 (shared) group B: new components; nothing existing opts in automatically. */
/* Disclosures (R-rota-08): one chevron, 44px summary. Use <details class="rp-disclosure"><summary>...</summary>...</details>. */
.rp-disclosure>summary{display:flex;align-items:center;gap:var(--rp-space-2);min-height:var(--rp-control-size);font-size:var(--rp-small-size);cursor:pointer;list-style:none}
.rp-disclosure>summary::-webkit-details-marker{display:none}
.rp-disclosure>summary::after{content:"";flex:none;margin-left:auto;width:var(--rp-icon-sm);height:var(--rp-icon-sm);background:var(--muted);-webkit-mask:var(--rp-chevron-mark) center/contain no-repeat;mask:var(--rp-chevron-mark) center/contain no-repeat;transition:rotate var(--rp-state-duration) var(--rp-ease)}
.rp-disclosure[open]>summary::after{rotate:180deg}
/* Count badges (R-rota-08): 11px (--rp-micro-size), white on the theme accent (>= 5.9:1); .is-muted for neutral counts. */
.rp-badge{display:inline-grid;place-items:center;min-width:1.6em;height:1.6em;padding:0 .4em;border-radius:var(--rp-pill-radius);background:var(--accent);color:var(--on-dark);font-size:var(--rp-micro-size);font-weight:var(--rp-weight-semibold);line-height:1;font-variant-numeric:tabular-nums}
.rp-badge.is-muted{background:var(--surface-soft);color:var(--muted)}
/* Compact switch (R-home-V08, R-home-z1-01): each button box is the full 44px hit area, pulled back to the 28px track with
   negative margins, so its own overflow:hidden (kept for the ellipsis) no longer clips the tap area. The focus ring is drawn
   on the visible 28px part instead of the 44px box. */
.rp-seg.is-compact>:is(button,a){--rp-seg-reach:calc((var(--rp-control-size) - var(--rp-control-compact) + 2 * var(--rp-space-1)) / 2);min-height:var(--rp-control-size);margin-block:calc(-1 * var(--rp-seg-reach))}
html[data-theme] .rp-seg.is-compact>:is(button,a):focus-visible{outline:none}
.rp-seg.is-compact>:is(button,a):focus-visible::after{content:"";position:absolute;inset:var(--rp-seg-reach) 0;border-radius:inherit;outline:var(--rp-focus-width) solid var(--accent);outline-offset:calc(-1 * var(--rp-focus-width));pointer-events:none}
/* File picker (R-products-02): filePicker() in ui.mjs; the native input stays for keyboard and screen readers. */
.rp-file{position:relative;display:flex;align-items:center;gap:var(--rp-space-3);min-width:0;cursor:pointer}
.rp-file>input{position:absolute;width:1px;height:1px;opacity:0}
.rp-file:has(>input:focus-visible)>.button{outline:var(--rp-focus-width) solid var(--accent);outline-offset:2px}
.rp-file-name{min-width:0;overflow:hidden;color:var(--muted);font-size:var(--rp-small-size);text-overflow:ellipsis;white-space:nowrap}
/* OTH-C1-23 (RFC-Z2-05): the sign-in's device choice, two 44px radio rows under one legend. */
.login-device{margin:0 0 var(--rp-space-3);padding:0;border:0;min-width:0}
.login-device legend{margin:0 0 var(--rp-space-1);padding:0;color:var(--muted);font-size:var(--rp-small-size);font-weight:500}
.login-device .check-label{min-height:44px}
