/* m-desk-menu.css — employee drop-down ("whose desk?"), shared avatar + header chip, desk-switch entrance, and the header Back arrow.
   Replaces m-lobby.css (the full-screen "Who's working today?" page was removed). Colours come from tokens only. */
.av{position:relative;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;flex:none;font:700 var(--fs-num) 'Source Sans 3','Cairo',sans-serif;letter-spacing:.02em;color:var(--c-white);background:linear-gradient(135deg,var(--c1,var(--c-sand)),var(--c2,var(--c-n700)));box-shadow:inset 0 0 0 1px rgba(var(--c-white-rgb),.25),0 8px 20px rgba(var(--c-black-rgb),.25)}
.av svg{width:50%;height:50%;stroke:var(--c-white)}.av.all{background:linear-gradient(135deg,var(--c-sand),var(--c-x-8c6a3f))}
.av.xs{width:32px;height:32px;font-size:var(--fs-xs);box-shadow:none}
.empchip{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:4px 12px 4px 4px;border-radius:var(--rd-pill);border:1px solid rgba(var(--c-white-rgb),.2);background:rgba(var(--c-white-rgb),.08);color:var(--c-white);cursor:pointer;font-weight:700;max-width:230px;transition:background .15s,transform .15s}
[dir=rtl] .empchip{padding:4px 4px 4px 12px}.empchip:hover{background:rgba(var(--c-white-rgb),.16)}.empchip:active{transform:scale(.97)}
.empchip .en{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.empchip .sw{color:var(--sand);font-size:var(--fs-lg)}

/* switching desk: header drops in, content rises in */
.ws-in header.top{animation:dkHdr .5s var(--ease) backwards}@keyframes dkHdr{from{transform:translateY(-100%)}}
.ws-in .kpi,.ws-in .tdh,.ws-in .bar,.ws-in .lead,.ws-in .panel,.ws-in .col{animation:dkIn .55s var(--ease) backwards}
@keyframes dkIn{from{opacity:0;transform:translateY(28px)}}
.ws-in .kpi:nth-child(2){animation-delay:.05s}.ws-in .kpi:nth-child(3){animation-delay:.1s}.ws-in .kpi:nth-child(4){animation-delay:.15s}
.ws-in .tdh,.ws-in .bar{animation-delay:.12s}.ws-in .lead:nth-child(1),.ws-in .col:nth-child(1){animation-delay:.2s}.ws-in .lead:nth-child(2),.ws-in .col:nth-child(2){animation-delay:.26s}.ws-in .lead:nth-child(3),.ws-in .col:nth-child(3){animation-delay:.32s}.ws-in .lead:nth-child(n+4),.ws-in .col:nth-child(n+4){animation-delay:.38s}

/* employee drop-down */
.dk{position:fixed;z-index:300;display:flex;flex-direction:column;padding:6px;background:var(--bg-surface,var(--c-white));color:var(--tx-strong,var(--c-n900));border:1px solid rgba(var(--c-sand-rgb),.55);border-radius:var(--rd-lg);box-shadow:var(--sh-3);transform-origin:top center;animation:dkOpen .18s var(--ease) both}
.dk.up{transform-origin:bottom center}
@keyframes dkOpen{from{opacity:0;transform:translateY(-6px) scale(.98)}}
.dk.up{animation-name:dkOpenUp}@keyframes dkOpenUp{from{opacity:0;transform:translateY(6px) scale(.98)}}
.dk-q{flex:none;width:100%;min-height:42px;margin:0 0 6px;padding:0 14px;border:1px solid rgba(var(--ink-rgb),.14);border-radius:var(--rd-pill);background:var(--bg-tint);color:inherit;font:600 var(--fs-md) var(--font-body)}
.dk-q:focus{outline:0;border-color:var(--c-sand);box-shadow:0 0 0 3px rgba(var(--c-sand-rgb),.25)}
.dk-l{list-style:none;margin:0;padding:0;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.dk-o{display:flex;align-items:center;gap:10px;min-height:52px;padding:6px 10px;border-radius:var(--rd-md);cursor:pointer;outline:0;transition:background .12s}
.dk-o:hover,.dk-o:focus-visible{background:var(--bg-tint)}.dk-o:active{background:rgba(var(--c-sand-rgb),.2)}
.dk-o[hidden]{display:none}
.dk-o .av{width:34px;height:34px}
.dk-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.dk-t b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:700 var(--fs-md) var(--font-body)}
.dk-t small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--tx-muted);font:500 var(--fs-xs) var(--font-body)}
.dk-due{flex:none;min-width:22px;padding:2px 7px;border-radius:var(--rd-pill);background:rgba(var(--c-sand-rgb),.22);border:1px solid rgba(var(--c-sand-rgb),.6);font:700 var(--fs-xs) var(--font-body);font-style:normal;text-align:center;font-variant-numeric:tabular-nums}
.dk-ck{flex:none;width:18px;height:18px;border-radius:50%;opacity:0}
.dk-o.on{background:rgba(var(--c-sand-rgb),.14)}
.dk-o.on .dk-ck{opacity:1;background:var(--c-sand-dark,var(--c-sand));-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat}
.dk-none{margin:0;padding:14px;text-align:center;color:var(--tx-muted);font:600 var(--fs-sm) var(--font-body)}
.empchip[aria-expanded=true] .sw{transform:rotate(180deg)}.empchip .sw{transition:transform .2s var(--ease)}

/* header Back arrow: sits in the icon cluster (no new row). Lit + guiding nudge when there is a place to go back to */
html body header.top .bk{order:1;flex:none;display:inline-grid;place-items:center;position:relative;width:34px;min-width:34px;height:34px;padding:0;border-radius:50%;border:1px solid rgba(var(--c-sand-rgb),.7);background:var(--bg-tint);color:var(--tx-strong);cursor:pointer;-webkit-tap-highlight-color:transparent;transition:opacity .2s,transform .15s,background .15s}
html body header.top .bk:active{transform:scale(.92)}
html body header.top .bk:focus-visible{outline:2px solid var(--c-sand-dark,var(--c-sand));outline-offset:2px}
.bk svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.bk .bk-a{animation:bkGuide 2.8s var(--ease) infinite}
.bk .bk-g{opacity:0;animation:bkGhost 2.8s var(--ease) infinite}
@keyframes bkGuide{0%,52%,100%{transform:translateX(0)}66%{transform:translateX(-3.5px)}80%{transform:translateX(.8px)}}
@keyframes bkGhost{0%,52%{opacity:0;transform:translateX(5px)}66%{opacity:.55;transform:translateX(-1px)}100%{opacity:0;transform:translateX(-6px)}}
.bk.idle{opacity:.42}.bk.idle .bk-a,.bk.idle .bk-g{animation:none}
.bk.shake{animation:bkShake .4s var(--ease)}@keyframes bkShake{20%{transform:translateX(-4px)}45%{transform:translateX(3px)}70%{transform:translateX(-2px)}}
[dir=rtl] .bk svg{transform:scaleX(-1)}
/* phones: the page name is already the lit pill in the menu strip right below, so the Back arrow takes that slot and the bar gains no width */
@media(max-width:430px){html body header.top .hd{display:none}}
@media(min-width:900px){html body header.top .bk{order:5;width:36px;min-width:36px;height:36px}}
/* iOS home-screen app edge swipe */
.bk-edge{position:fixed;z-index:400;inset-inline-start:0;top:clamp(56px,var(--y,50%),calc(100% - 56px));width:44px;height:44px;margin-top:-22px;border-radius:50%;display:grid;place-items:center;background:var(--c-starlight,var(--c-n900));color:var(--c-white);box-shadow:var(--sh-3);pointer-events:none;opacity:0;transform:translateX(calc(-44px + 62px * var(--p,0))) scale(calc(.6 + .4 * var(--p,0)));transition:opacity .12s,background .12s}
.bk-edge.on{opacity:calc(.35 + .65 * var(--p,0))}.bk-edge.go{background:var(--c-sand-dark,var(--c-sand))}
.bk-edge svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
[dir=rtl] .bk-edge{transform:translateX(calc(44px - 62px * var(--p,0))) scale(calc(.6 + .4 * var(--p,0)))}[dir=rtl] .bk-edge svg{transform:scaleX(-1)}
@media(max-width:560px){.empchip .en{max-width:110px}}
@media(max-width:360px){.dk{padding:4px}.dk-o{gap:8px;min-height:48px;padding:4px 8px}.dk-o .av{width:30px;height:30px}html body header.top .bk{width:32px;min-width:32px;height:32px}}
@media(prefers-reduced-motion:reduce){.ws-in *,.ws-in header.top,.dk,.bk .bk-a,.bk .bk-g,.bk.shake{animation:none!important}.bk-edge{transition:none}}