/* GENERATED from the approved staff walk CSS (ChatGPT, 10/11) by scope.py: every rule scoped under .sa */
/* engine.css shares some class names (.card .hero .chip .primary .tabs .notice ...): put them back to plain before the walk rules apply */
:where(.sa) :is(.card,.hero,.chip,.chips,.dot,.notice,.primary,.smallbtn,.swatch,.tabs,.quick,.muted,.mono,.lime,.open,.on,.chip.on,.swatch.on){all:revert}
:where(.sa) :is(.card,.hero)>*{all:revert}
/* blue1011: all:revert hands color back to the browser, and iOS draws a reverted <button> in system blue. Give the reverted controls back ink, font and a flat look (same weight as the revert, so the walk rules below still win) */
:where(.sa) :is(.card,.hero,.chip,.chips,.dot,.notice,.primary,.smallbtn,.swatch,.tabs,.quick,.muted,.mono,.lime,.open,.on,.chip.on,.swatch.on){color:inherit}
:where(.sa) :is(button,a):is(.card,.hero,.chip,.chips,.dot,.notice,.primary,.smallbtn,.swatch,.tabs,.quick,.muted,.mono,.lime,.open,.on,.chip.on,.swatch.on){color:var(--ink);font-family:Archivo,system-ui,sans-serif;-webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent;text-decoration:none}
:where(.sa) :is(.card,.hero)>:is(button,a){color:var(--ink);-webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent}
.sa button,.sa a{color:var(--ink);-webkit-tap-highlight-color:transparent}
.sa button{-webkit-appearance:none;appearance:none;font-family:Archivo,system-ui,sans-serif}
.sa h1,.sa h2,.sa h3{font-family:Archivo,system-ui,sans-serif;font-variation-settings:"wdth" 100;text-wrap:balance}
.sa h1.h1{font-size:28px!important;font-weight:700!important;letter-spacing:-.035em!important;line-height:1.02!important}
.sa h2{font-weight:800!important}
.sa .card h2{font-size:20px!important;line-height:1.08!important}
.sa h2.h2{font-size:22px!important}
.sa .postcard h2{font-size:21px!important;line-height:1.05!important}
.sa .sheet h1.h1{font-size:36px!important}
.sa .sheet.tall h1.h1{font-size:30px!important}
@media (min-width:768px){.sa h1.h1{font-size:42px!important}.sa .sheet h1.h1{font-size:40px!important}}
.sa input{font-family:inherit;color:#121314}
.sa select{font-family:inherit;color:#121314}
.sa textarea{font-family:inherit;color:#121314}
.sa{--ground:#FBFBFA;
  --page:#ECEBE7;
  --ink:#121314;
  --mute:#565A5E;
  --rule:#DADCD8;
  --soft:#ECEDE8;
  --white:#FFFFFF;
  --lime:#D6E59A;
  --active:#D4F53C;
  --pale:#F3F8C9;
  --cream:#F0E1C8;
  --tan:#F4EFE5;
  --tanline:#D4B184;
  --lilac:#DED7F0;
  --peach:#FFF4ED;}
.sa .kicker{font:600 12px/1.25 IBM Plex Mono,monospace;text-transform:uppercase;letter-spacing:.08em;color:var(--mute)}
.sa .h1{font-size:28px;line-height:1.02;font-weight:700;letter-spacing:-.035em;margin:7px 0 14px}
.sa .h2{font-size:22px;line-height:1.05;font-weight:700;letter-spacing:-.02em;margin:0 0 8px}
.sa .h3{font-size:18px;line-height:1.1;font-weight:800;letter-spacing:-.01em;margin:0}
.sa p{font-size:16px;line-height:1.34;margin:0;color:var(--mute)}
.sa .mono{font-family:IBM Plex Mono,monospace}
.sa .muted{color:var(--mute)}
.sa .strong{font-weight:800;color:var(--ink)}
.sa .mt8{margin-top:8px}
.sa .mt10{margin-top:10px}
.sa .mt12{margin-top:12px}
.sa .mt16{margin-top:16px}
.sa .mb0{margin-bottom:0}
.sa .rule{height:1px;background:var(--rule);margin:14px 0}
.sa .sep{border-top:1px solid var(--rule);margin-top:12px;padding-top:12px}
.sa .backcrumb{min-height:44px;display:inline-flex;align-items:center;font-weight:800;color:var(--ink);text-decoration:none;font-size:16px;margin-bottom:2px}
.sa .backcrumb span{font-size:22px;margin-right:4px;line-height:0}
.sa .topline{display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--rule);padding-bottom:12px;margin-bottom:14px}
.sa .loc{display:flex;gap:10px;align-items:center;min-width:0}
.sa .mark{width:58px;height:38px;border:1px solid var(--rule);background:#fff;display:grid;place-items:center;font:800 12px/1 Archivo,sans-serif;text-transform:uppercase}
.sa .locname{font-weight:800;font-size:17px;line-height:1.05;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sa .tagline{font:600 11px/1.2 IBM Plex Mono,monospace;text-transform:uppercase;letter-spacing:.08em;color:var(--mute);margin-top:3px}
.sa .switch{min-height:44px;border:2px solid var(--ink);background:var(--lime);font:800 15px/1 Archivo,sans-serif;padding:0 12px;box-shadow:3px 3px 0 var(--ink)}
.sa .smallbtn{min-height:44px;border:2px solid var(--ink);background:var(--lime);font:800 15px/1 Archivo,sans-serif;padding:0 12px;box-shadow:3px 3px 0 var(--ink)}
.sa .outlinebtn{min-height:44px;border:2px solid var(--ink);background:var(--lime);font:800 15px/1 Archivo,sans-serif;padding:0 12px;box-shadow:3px 3px 0 var(--ink)}
.sa .outlinebtn{background:#fff;box-shadow:none}
.sa .smallbtn.soft{background:var(--pale)}
.sa .primary{width:100%;min-height:58px;border:2px solid var(--ink);background:var(--lime);font:800 20px/1 Archivo,sans-serif;padding:15px;box-shadow:5px 5px 0 var(--ink)}
.sa .secondary{width:100%;min-height:52px;border:2px solid var(--ink);background:#fff;font:800 18px/1 Archivo,sans-serif;padding:13px}
.sa .hero{border:2px solid var(--ink);background:#fff;padding:15px;margin-bottom:13px;box-shadow:7px 7px 0 var(--cream)}
.sa .clocktop{display:grid;grid-template-columns:52px 1fr;gap:12px;align-items:center}
.sa .avatar{width:52px;height:52px;border-radius:50%;background:var(--lilac);border:1px solid var(--rule);display:grid;place-items:center;font:800 20px/1 Archivo,sans-serif;position:relative}
.sa .avatar:after{content:"";position:absolute;right:1px;bottom:1px;width:12px;height:12px;border-radius:50%;background:#fff;border:1px solid var(--rule)}
.sa .state{display:flex;align-items:center;gap:7px;margin-top:10px;font-weight:800;color:var(--mute)}
.sa .dot{width:9px;height:9px;border-radius:50%;background:#6B6F72;display:inline-block}
.sa .dot.on{background:var(--lime);border:1px solid var(--ink)}
.sa .card{background:#fff;border:1.5px solid var(--rule);padding:13px;margin-bottom:12px}
.sa .card.ink{border:2px solid var(--ink)}
.sa .card.pale{background:var(--pale)}
.sa .card.lilac{background:rgba(222,215,240,.45)}
.sa .card.peach{background:var(--peach)}
.sa .card.next{border-left:8px solid var(--lime)}
.sa .card h2{font-size:20px;line-height:1.08;font-weight:800;letter-spacing:-.015em;margin:4px 0}
.sa .card h3{font-size:18px;line-height:1.08;font-weight:800;letter-spacing:-.01em;margin:0}
.sa .card p{margin-top:4px}
.sa .stats{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--rule);background:#fff;margin-bottom:12px}
.sa .stat{padding:12px;border-right:1px solid var(--rule)}
.sa .stat:last-child{border-right:0}
.sa .num{font:600 28px/1 IBM Plex Mono,monospace;color:var(--ink);letter-spacing:-.03em}
.sa .stat p{font-size:13px;margin-top:2px}
.sa .list{border-top:1px solid var(--rule)}
.sa .row{display:grid;grid-template-columns:34px 1fr auto;gap:10px;align-items:center;padding:12px 0;border-bottom:1px solid var(--rule);min-height:58px}
.sa .row:last-child{border-bottom:0}
.sa .row h3{font-size:17px;font-weight:800;margin:0;letter-spacing:-.01em}
.sa .row p{font-size:14px;margin:3px 0 0}
.sa .arrow{font-size:24px;font-weight:800;line-height:1}
.sa .badge{display:inline-grid;place-items:center;min-width:22px;height:22px;border-radius:50%;background:var(--lilac);border:1px solid var(--ink);font:800 12px/1 Archivo,sans-serif;color:var(--ink)}
.sa .badge.square{border-radius:2px;padding:0 6px}
.sa .preview{background:var(--pale);border:1.5px solid var(--ink);padding:12px;margin-top:10px}
.sa .preview+.preview{margin-top:8px;background:#fff}
.sa .chips{display:flex;gap:8px;overflow:auto;padding:1px 0 10px}
.sa .chip{flex:0 0 auto;min-height:38px;display:inline-flex;align-items:center;justify-content:center;background:#fff;border:1.5px solid var(--ink);padding:8px 12px;font-weight:800;color:var(--ink);text-decoration:none}
.sa .chip.on{background:var(--lime);border:2px solid var(--ink)}
.sa .chip.soft{background:var(--pale)}
.sa .quickgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}
.sa .quick{min-height:48px;border:1.5px solid var(--rule);background:#fff;padding:9px 5px;text-align:center;font:800 12px/1.1 Archivo,sans-serif;color:var(--ink);text-decoration:none;position:relative;display:grid;place-items:center}
.sa .progress{height:12px;border:1.5px solid var(--ink);background:#fff;margin-top:8px}
.sa .progress span{display:block;height:100%;background:var(--lime);border-right:1.5px solid var(--ink)}
.sa .tabs{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:10px 0 12px}
.sa .seg{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:10px 0 12px}
.sa .tabs.three{grid-template-columns:repeat(3,1fr)}
.sa .tabs button{min-height:44px;background:#fff;border:1.5px solid var(--rule);font:800 14px Archivo;color:var(--ink)}
.sa .seg button{min-height:44px;background:#fff;border:1.5px solid var(--rule);font:800 14px Archivo;color:var(--ink)}
.sa .tabs .on{background:var(--lime);border:2px solid var(--ink)}
.sa .seg .on{background:var(--lime);border:2px solid var(--ink)}
.sa .daynav{display:grid;grid-template-columns:48px 1fr 48px;margin:8px 0 12px}
.sa .daynav button{min-height:48px;border:2px solid var(--ink);background:#fff;font:800 18px Archivo;display:grid;place-items:center}
.sa .daynav .datebtn{min-height:48px;border:2px solid var(--ink);background:#fff;font:800 18px Archivo;display:grid;place-items:center}
.sa .daynav .datebtn{border-left:0;border-right:0;font-size:22px}
.sa .daystrip{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin-bottom:12px}
.sa .daymini{border:1.5px solid var(--rule);background:#fff;min-height:50px;padding:6px;text-align:center}
.sa .daymini.on{background:var(--lime);border:2px solid var(--ink)}
.sa .daymini b{display:block;font:800 12px Archivo}
.sa .daymini span{display:block;font:600 12px IBM Plex Mono;color:var(--mute);margin-top:3px}
/* lora1102: real date number in the Who's on strip, count is a small 'N on' line */
.sa .daymini i.dnum{display:block;font:800 18px/1.15 Archivo;font-style:normal;color:var(--ink);margin-top:2px}
.sa .daymini i.dnum+span{font-size:10px;margin-top:1px;white-space:nowrap}
.sa .note-banner{background:var(--pale);border:1.5px solid var(--ink);border-left:8px solid var(--lime);padding:12px;margin-bottom:12px}
.sa .shift{border:1.5px solid var(--ink);background:#fff;padding:13px;margin-bottom:10px;display:grid;grid-template-columns:1fr auto;gap:12px;align-items:start}
.sa .shift.lilac{background:var(--lilac)}
.sa .shift.lime{background:var(--lime)}
.sa .shift.tan{background:#D7D1C3}
.sa .shift.open{background:repeating-linear-gradient(135deg,#fff 0,#fff 12px,var(--soft) 12px,var(--soft) 24px);border-style:dashed}
.sa .shift.striped{background:repeating-linear-gradient(135deg,var(--lilac) 0,var(--lilac) 12px,#EFEAF8 12px,#EFEAF8 24px)}
.sa .shift.mix{background:repeating-linear-gradient(135deg,var(--lime) 0,var(--lime) 12px,var(--lilac) 12px,var(--lilac) 24px)}
.sa .shift h3{font-size:21px;line-height:1.05;margin:0;font-weight:800;letter-spacing:-.015em}
.sa .shift .roleline{font:600 13px/1.25 IBM Plex Mono,monospace;margin-top:5px;color:var(--ink)}
.sa .timeblock{text-align:right;font:600 17px/1.35 IBM Plex Mono,monospace;white-space:nowrap}
.sa .tag{display:inline-flex;align-items:center;min-height:24px;border:1.5px solid var(--ink);background:#fff;padding:3px 7px;font:800 12px/1 Archivo,sans-serif;text-transform:uppercase;letter-spacing:.04em;vertical-align:2px}
.sa .tag.lilac{background:var(--lilac)}
.sa .tag.lime{background:var(--lime)}
.sa .note-card{grid-column:1/-1;border:1.5px solid var(--ink);background:#fff;padding:10px;margin-top:4px}
.sa .note-card .kicker{margin-bottom:5px}
.sa .manager-label{display:inline-flex;margin-left:6px;background:var(--pale);border:1px solid var(--ink);padding:3px 6px;font:700 11px/1 IBM Plex Mono;text-transform:uppercase;letter-spacing:.06em;color:var(--ink)}
.sa .rolekey{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.sa .keyitem{display:flex;align-items:center;gap:6px;font:700 12px Archivo;color:var(--mute)}
.sa .swatch{width:18px;height:18px;border:1px solid var(--ink);background:#fff}
.sa .swatch.lilac{background:var(--lilac)}
.sa .swatch.lime{background:var(--lime)}
.sa .swatch.tan{background:#D7D1C3}
.sa .swatch.open{background:#fff;border-style:dashed}
.sa .sheetwrap{position:absolute;left:0;right:0;top:76px;bottom:0;background:rgba(236,235,231,.88);z-index:5}
.sa .sheet{position:absolute;left:0;right:0;bottom:0;background:var(--ground);border-top:2px solid var(--ink);padding:18px 16px 24px}
.sa .sheet .h1{font-size:42px;margin-bottom:10px}
.sa .sheet p{font-size:18px;line-height:1.35}
.sa .sheet-actions{display:grid;gap:14px;margin-top:18px}
.sa .sheet-note{border:1.5px solid var(--rule);background:#fff;padding:11px;margin-top:12px}
.sa .formrow{display:grid;gap:6px;margin-bottom:12px}
.sa .label{font:600 12px/1.2 IBM Plex Mono,monospace;text-transform:uppercase;letter-spacing:.08em;color:var(--mute)}
.sa .input{min-height:48px;border:1.5px solid var(--ink);background:#fff;padding:12px;font:600 16px Archivo;color:var(--ink)}
.sa textarea.input{min-height:94px;resize:none}
.sa .ipadmain{overflow:auto;padding:22px 24px 36px}
.sa .weekbar{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin:10px 0 12px}
.sa .weekbar button{min-height:44px;border:1.5px solid var(--rule);background:#fff;font:800 14px Archivo}
.sa .weekbar .on{background:var(--lime);border:2px solid var(--ink)}
.sa .weeksum{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end;margin-bottom:12px}
.sa .myday{display:grid;grid-template-columns:62px 1fr;gap:10px;border-top:1px solid var(--rule);padding:12px 0}
.sa .daylabel{font:800 18px/1 Archivo;color:var(--ink)}
.sa .daylabel span{display:block;font:600 12px/1.2 IBM Plex Mono;color:var(--mute);margin-top:4px;text-transform:uppercase;letter-spacing:.08em}
.sa .myblock{border:1.5px solid var(--ink);background:#fff;padding:12px}
.sa .myblock.lilac{background:var(--lilac)}
.sa .myblock.striped{background:repeating-linear-gradient(135deg,var(--lilac) 0,var(--lilac) 12px,#EFEAF8 12px,#EFEAF8 24px)}
.sa .myblock.lime{background:var(--lime)}
.sa .myblock h3{font-size:19px;margin:0 0 5px;font-weight:800}
.sa .myblock .time{font:600 15px/1.3 IBM Plex Mono;color:var(--ink)}
.sa .actions2{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.sa .pillrow{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.sa .notice{border:1.5px solid var(--ink);background:var(--pale);padding:12px;margin-bottom:12px}
.sa .tilegrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.sa .tile{border:2px solid var(--ink);background:#fff;padding:14px;min-height:92px;box-shadow:5px 5px 0 var(--ink)}
.sa .tile.lime{background:var(--lime)}
.sa .tile.lilac{background:var(--lilac)}
.sa .tile h3{font-size:21px;margin:0 0 5px;font-weight:800}
.sa .daysrow{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin:12px 0}
.sa .dayhours{border:1.5px solid var(--ink);background:#fff;min-height:58px;text-align:center;padding:7px 3px}
.sa .dayhours.on{background:var(--lime)}
.sa .dayhours.fix{background:var(--lilac)}
.sa .dayhours b{display:block;font:800 12px Archivo}
.sa .dayhours span{display:block;font:600 18px IBM Plex Mono;margin-top:5px}
.sa .paystub{border:1.5px solid var(--ink);background:#fff;padding:14px;margin-bottom:10px}
.sa .paystub h3{font-size:18px;margin:0 0 5px;font-weight:800}
.sa .twocolform{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sa .punchrow{display:grid;grid-template-columns:52px 1fr auto;gap:10px;align-items:center;border:1.5px solid var(--ink);background:#fff;padding:10px;margin-bottom:10px}
.sa .punchbadge{border:1.5px solid var(--ink);background:#fff;font:700 12px IBM Plex Mono;text-align:center;padding:6px}
.sa .reqcard{border:2px solid var(--ink);background:var(--lilac);padding:14px;margin-bottom:12px;box-shadow:5px 5px 0 var(--ink)}
.sa .statustag{display:inline-flex;align-items:center;border:1.5px solid var(--ink);background:#fff;padding:5px 8px;font:700 12px IBM Plex Mono;text-transform:uppercase;letter-spacing:.06em}
.sa .month{border:1.5px solid var(--ink);background:#fff;padding:12px;margin-bottom:12px}
.sa .monthgrid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;margin-top:10px}
.sa .datecell{min-height:38px;border:1px solid var(--rule);display:grid;place-items:center;font:700 13px Archivo;background:#fff}
.sa .datecell.on{background:var(--lime);border:2px solid var(--ink)}
.sa .availrow{display:grid;grid-template-columns:44px 1fr;gap:10px;align-items:center;border-bottom:1px solid var(--rule);padding:10px 0}
.sa .availopts{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px}
.sa .availopts button{min-height:38px;border:1px solid var(--rule);background:#fff;font:800 12px Archivo}
.sa .availopts .on{background:var(--lime);border:1.5px solid var(--ink)}
.sa .boardtabs{display:grid;grid-template-columns:1fr 1fr;gap:0;margin:10px 0 12px}
.sa .boardtabs button{min-height:46px;border:2px solid var(--ink);background:#fff;font:800 14px Archivo}
.sa .boardtabs .on{background:var(--ink);color:#fff}
.sa .searchbar{display:grid;grid-template-columns:1fr auto;gap:8px;margin-bottom:12px}
.sa .searchbar input{min-height:48px;border:1.5px solid var(--rule);background:#fff;padding:12px;font:700 15px Archivo}
.sa .searchbar button{border:1.5px solid var(--ink);background:var(--pale);font:800 14px Archivo;padding:0 12px}
.sa .postcard{border:1.5px solid var(--ink);background:#fff;padding:13px;margin-bottom:12px}
.sa .postcard.unread{background:var(--pale)}
.sa .postcard.feature{border:2px solid var(--ink);box-shadow:6px 6px 0 var(--cream)}
.sa .postmeta{font:600 12px IBM Plex Mono;text-transform:uppercase;letter-spacing:.06em;color:var(--mute);margin-bottom:5px}
.sa .postcard h2{font-size:21px;line-height:1.05;margin:0 0 6px;font-weight:800}
.sa .comment{border:1.5px solid var(--rule);background:#fff;padding:12px;margin-bottom:10px}
.sa .commentbox{border:1.5px solid var(--ink);background:#fff;padding:12px;margin-top:12px}
.sa .replycode{border:2px solid var(--ink);background:var(--pale);padding:12px;font:600 24px IBM Plex Mono;text-align:center;margin-top:10px}
.sa .recipecat{border-top:2px solid var(--ink);padding-top:10px;margin:16px 0 8px;display:flex;justify-content:space-between}
.sa .recipeitem{border:1.5px solid var(--ink);background:#fff;padding:13px;margin-bottom:10px}
.sa .recipeitem h3{font-size:19px;margin:0 0 5px;font-weight:800}
.sa .detailgrid{display:grid;grid-template-columns:1fr;gap:12px}
.sa .specrow{display:grid;grid-template-columns:1fr auto;border-bottom:1px solid var(--rule);padding:9px 0}
.sa .step{display:grid;grid-template-columns:30px 1fr;gap:10px;margin-bottom:10px}
.sa .step b{display:grid;place-items:center;width:28px;height:28px;background:var(--lime);border:1.5px solid var(--ink);font:800 13px Archivo}
.sa .profilehead{border:2px solid var(--ink);background:#fff;padding:14px;margin-bottom:12px;box-shadow:7px 7px 0 var(--cream)}
.sa .greyed{opacity:.58;background:var(--soft)}
.sa .fixline{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1.5px solid var(--ink);background:var(--peach);padding:10px 12px;margin-top:10px}
.sa .fixline p{font-size:14px;margin:0;color:var(--ink);font-weight:800}
.sa .fixline .mini{min-height:34px;border:1.5px solid var(--ink);background:#fff;font:800 13px Archivo;padding:0 10px}
.sa .summary3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin:12px 0}
.sa .summary3 .tile{min-height:86px;padding:11px;box-shadow:3px 3px 0 var(--ink)}
.sa .summary3 .tile h3{font-size:22px;margin:3px 0 1px}
.sa .summary3 .tile p{font-size:13px;line-height:1.2}
.sa .sheethandle{width:46px;height:4px;background:var(--ink);margin:0 auto 14px}
.sa .sheettop{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.sa .sheetclose{min-height:44px;border:1.5px solid var(--ink);background:#fff;font:800 14px Archivo;padding:0 12px}
.sa .compactform .input{min-height:44px;padding:10px}
.sa .compactform .formrow{margin-bottom:9px}
.sa .compactform .twocolform{gap:8px}
.sa .compactform .punchrow{padding:8px;margin-bottom:8px}
@media (min-width:768px){
.sa .ipadgrid{display:grid;grid-template-columns:1.2fr .85fr;gap:18px;align-items:start}
.sa .ipadgrid.three{grid-template-columns:1fr 1fr .85fr}
.sa .h1{font-size:42px;margin-bottom:16px}
.sa .hero{padding:18px}
.sa .card{padding:16px}
.sa .stats{margin-bottom:0}
.sa .quickgrid{grid-template-columns:repeat(4,1fr)}
.sa .shift{padding:16px;grid-template-columns:1fr 140px}
.sa .shift h3{font-size:24px}
.sa .timeblock{font-size:18px}
.sa .schedule-layout{display:grid;grid-template-columns:310px 1fr;gap:18px;align-items:start}
.sa .schedule-side{position:sticky;top:0}
.sa .shiftgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.sa .shiftgrid .shift{margin-bottom:0}
.sa .sheet{left:auto;top:0;bottom:0;width:430px;border-top:0;border-left:2px solid var(--ink);padding:28px 24px}
.sa .sheet .h1{font-size:44px}
.sa .phoneonly{display:none!important}
.sa .week-layout{display:grid;grid-template-columns:330px 1fr;gap:18px}
.sa .week-days{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.sa .myday{grid-template-columns:70px 1fr;border:1.5px solid var(--rule);padding:12px;background:#fff}
.sa .time-layout{display:grid;grid-template-columns:360px 1fr;gap:18px}
.sa .board-layout{display:grid;grid-template-columns:330px 1fr;gap:18px}
.sa .postgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.sa .recipe-layout{display:grid;grid-template-columns:320px 1fr;gap:18px}
.sa .detailgrid{grid-template-columns:1fr 1fr}
.sa .profile-layout{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.sa .sheet.tall{overflow:auto}
.sa .sheet.tall .h1{font-size:38px}
.sa .requests-fill{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.sa .requests-fill .card{margin-bottom:0}
}
@media (max-width:767px){
.sa .ipadonly{display:none!important}
.sa .sheet.tall{top:74px;bottom:0;overflow:auto;padding:14px 16px 28px}
.sa .sheet.tall .h1{font-size:32px;line-height:1;margin:5px 0 12px}
.sa .sheet.tall p{font-size:16px}
}

/* ---- engineering fits for the live app (staff1011): buttons as rows, fixed sheets, safe areas ---- */
.sa{background:var(--ground);color:var(--ink);font-family:Archivo,system-ui,sans-serif;padding:0 3px 40px;max-width:1180px;margin:0 auto;box-sizing:border-box;-webkit-text-size-adjust:100%}
.sa *{box-sizing:border-box}
.sa button{font-family:inherit;color:var(--ink);cursor:pointer;-webkit-tap-highlight-color:transparent}
.sa button:disabled{opacity:.5;cursor:default}
.sa a{color:var(--ink)}
.sa .backcrumb{background:none;border:0;padding:0;cursor:pointer}
.sa button.row,.sa a.row{width:100%;background:none;border:0;border-bottom:1px solid var(--rule);text-align:left;text-decoration:none;color:var(--ink)}
.sa .row.card{border:1.5px solid var(--rule);padding:12px;margin-bottom:12px}
.sa .row.card.pale{background:var(--pale)}
.sa .preview,.sa .postcard,.sa .recipeitem,.sa .tile{display:block;width:100%;text-align:left;font:inherit}
.sa .quick{cursor:pointer;width:100%}
.sa .quick .badge{position:absolute;top:4px;right:4px}
.sa .mark{overflow:hidden}
.sa .mark img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.sa .mark span{font:800 11px/1 Archivo,sans-serif;text-align:center;padding:2px}
.sa .hero.lilacbg{background:var(--lilac)}
.sa .avatar.live:after{background:#D4F53C;border-color:var(--ink)}
.sa .tabs.inner{margin-top:0}
.sa .daymini{cursor:pointer;font:inherit}
.sa .datecell{cursor:pointer;font:inherit}
.sa .datecell.has{background:var(--lilac)}
.sa .datecell:disabled{opacity:.35}
.sa .swatch{display:inline-block}
.sa .shift.me{outline:3px solid var(--ink);outline-offset:-1px}
.sa .checkrow{display:grid;grid-template-columns:32px 1fr;gap:10px;align-items:center;width:100%;min-height:48px;border:0;border-top:1px solid var(--rule);background:none;padding:10px 0;text-align:left;font:600 15px/1.3 Archivo,sans-serif}
.sa .checkrow .box{width:28px;height:28px;border:1.5px solid var(--ink);display:grid;place-items:center;background:#fff;font-weight:800}
.sa .checkrow.on .box{background:var(--lime)}
.sa .checkrow small{display:block;font:600 12px IBM Plex Mono,monospace;color:var(--mute);margin-top:2px}
.sa .myday>div:last-child{display:grid;gap:8px}
.sa .sheetwrap{position:fixed;inset:0;z-index:60;background:rgba(236,235,231,.88)}
.sa .sheet{position:absolute;left:0;right:0;bottom:0;max-height:92vh;overflow:auto;padding-bottom:calc(24px + env(safe-area-inset-bottom));-webkit-overflow-scrolling:touch}
.sa .sheet.tall{top:max(44px,env(safe-area-inset-top));max-height:none}
@media (min-width:768px){
  .sa{padding:4px 0 60px}
  .sa .sheetwrap{background:rgba(236,235,231,.86)}
  .sa .sheet,.sa .sheet.tall{left:auto;top:0;bottom:0;width:440px;max-height:none;border-top:0;border-left:2px solid var(--ink);padding:28px 24px}
  .sa .ipadgrid>div,.sa .schedule-layout>div,.sa .week-layout>div,.sa .time-layout>div,.sa .board-layout>div,.sa .recipe-layout>div,.sa .profile-layout>div{min-width:0}
}
.sa .icon{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;display:block}
.sa .quick{padding-right:18px;padding-left:18px}

/* ---- ChatGPT polish round 1 (10/11), applied as written; .sa.phone/.sa.ipad mapped to the walk media queries ---- */
.sa{--sa-safe-bottom: 88px;}
.sa .primary, .sa .secondary, .sa .outlinebtn, .sa .smallbtn, .sa .tabs > *, .sa .seg > *, .sa .daynav > *, .sa .availopts > *, .sa button, .sa input, .sa textarea, .sa select{min-height: 44px;
  box-sizing: border-box;}
.sa textarea{resize: vertical;}
.sa .primary, .sa .secondary, .sa .outlinebtn, .sa .smallbtn{display: inline-flex;
  align-items: center;
  justify-content: center;}
.sa .primary:disabled, .sa .secondary:disabled, .sa .outlinebtn:disabled{opacity: .62;}
.sa .card, .sa .shift, .sa .timeblock, .sa .note-card, .sa .postcard, .sa .reqcard, .sa .recipeitem, .sa .punchrow, .sa .checkrow{box-sizing: border-box;}
.sa .commentbox{display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  align-items: start;}
.sa .commentbox textarea, .sa .commentbox input{width: 100%;
  min-height: 96px;
  margin: 0;}
.sa .commentbox .primary{width: 100%;}
.sa .checkrow{display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-height: 56px;
  padding: 10px 0;}
.sa .checkrow + .checkrow{border-top: 1px solid rgba(0, 0, 0, .14);}
.sa .checkrow .box{width: 28px;
  height: 28px;
  align-self: center;
  justify-self: center;}
.sa .sheetwrap{overflow: auto;}
.sa .sheet{box-sizing: border-box;}
.sa .replycode{word-break: break-word;}
@media (max-width:767px){.sa{padding-bottom: var(--sa-safe-bottom);}}
@media (max-width:767px){.sa .sheet{width: 100%;
  max-height: calc(100dvh - 44px);
  overflow: auto;
  padding-bottom: calc(20px + env(safe-area-inset-bottom));}}
@media (max-width:767px){.sa .sheet.tall{max-height: calc(100dvh - 44px);}}
@media (max-width:767px){.sa .schedule-layout{display: flex;
  flex-direction: column;}}
@media (max-width:767px){.sa .schedule-layout .weekbar{order: 1;}}
@media (max-width:767px){.sa .schedule-layout .note-banner{order: 2;}}
@media (max-width:767px){.sa .schedule-layout .week-days{order: 3;}}
@media (max-width:767px){.sa .schedule-layout .tilegrid, .sa .schedule-layout .reqcard, .sa .schedule-layout .card.pale{order: 4;}}
@media (max-width:767px){.sa .week-days{display: grid;
  grid-template-columns: 1fr;
  gap: 0;}}
@media (max-width:767px){.sa .week-days .myday{min-height: 76px;}}
@media (max-width:767px){.sa .shift, .sa .timeblock{width: 100%;}}
@media (max-width:767px){.sa .postcard{position: relative;}}
@media (max-width:767px){.sa .postcard .badge, .sa .postcard .smallbtn{margin-top: 8px;}}
@media (max-width:767px){.sa .monthgrid .datecell, .sa .daystrip .daymini{min-height: 44px;}}
@media (max-width:767px){.sa .availrow{gap: 8px;}}
@media (max-width:767px){.sa .availopts{grid-template-columns: repeat(3, minmax(0, 1fr));}}
@media (min-width:768px){.sa{padding-bottom: var(--sa-safe-bottom);}}
@media (min-width:768px){.sa .sheet{width: min(390px, 44vw);
    max-height: 100dvh;
    overflow: auto;}}
@media (min-width:768px){.sa .board-layout{display: grid;
    grid-template-columns: 340px minmax(0, 1fr);
    gap: 16px;
    align-items: start;}}
@media (min-width:768px){.sa .board-layout .postgrid{display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    align-items: start;}}
@media (min-width:768px){.sa .board-layout .postgrid .postcard:first-child{grid-column: 1 / -1;}}
@media (min-width:768px){.sa .postgrid{display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, .82fr);
    gap: 18px;
    align-items: start;}}
@media (min-width:768px){.sa .recipe-layout, .sa .profile-layout, .sa .time-layout, .sa .ipadgrid{gap: 16px;
    align-items: start;}}
@media (min-width:768px){.sa .schedule-layout{display: grid;
    grid-template-columns: 340px minmax(0, 1fr);
    gap: 16px;
    align-items: start;}}
@media (min-width:768px){.sa .schedule-layout .week-days{display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    align-items: start;}}
@media (min-width:768px){.sa .week-layout{display: grid;
    grid-template-columns: 330px minmax(0, 1fr);
    gap: 16px;
    align-items: start;}}
@media (min-width:768px){.sa .week-layout .week-days{display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    align-items: start;}}
@media (min-width:768px){.sa .monthgrid .datecell{min-height: 44px;}}
@media (min-width:768px){.sa .checkrow{min-height: 52px;}}
/* engineering fit for round 1 markup: My shifts keeps the week first on phone; iPad puts controls + extras left, the week right */
@media (min-width:768px){
  .sa .week-layout{display:grid;grid-template-columns:330px minmax(0,1fr);grid-template-areas:"ctl days" "ex days";gap:16px;align-items:start}
  .sa .week-layout .wk-controls{grid-area:ctl}.sa .week-layout .wk-extras{grid-area:ex}.sa .week-layout .week-days{grid-area:days}
}
.sa .swaprow{grid-template-columns:52px 1fr auto}
.sa .swaprow .avatar{width:44px;height:44px;font-size:16px}
.sa .postcard .arrow{margin-left:auto}
.sa .postcard .pillrow{align-items:center}

/* ---- ChatGPT polish round 2 (10/11), applied as written; .sa.phone mapped to max-width 767px ---- */
.sa .fixline{display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-height: 44px;
  padding: 10px 12px;
  box-sizing: border-box;}
.sa .fixline .smallbtn, .sa .fixline .outlinebtn{white-space: nowrap;}
@media (max-width:767px){.sa .schedule-layout, .sa .week-layout, .sa .time-layout, .sa .profile-layout, .sa .board-layout, .sa .postgrid, .sa .recipe-layout, .sa .recipe-layout, .sa .ipadgrid{padding-bottom: 104px;}}
@media (max-width:767px){.sa .card:last-child, .sa .reqcard:last-child, .sa .postcard:last-child, .sa .recipeitem:last-child, .sa .myday:last-child, .sa .timeblock:last-child{margin-bottom: 24px;}}
@media (max-width:767px){.sa .time-layout .primary, .sa .time-layout .secondary{width: 100%;}}
@media (max-width:767px){.sa .availrow{min-height: 56px;}}
@media (min-width:768px){.sa:has(.rolekey) .shift{min-width: 260px;
    min-height: 88px;
    padding: 14px 16px;}}
@media (min-width:768px){.sa:has(.rolekey) .shift .h2, .sa:has(.rolekey) .shift .h3, .sa:has(.rolekey) .shift strong{white-space: nowrap;}}
@media (min-width:768px){.sa:has(.rolekey) .week-days{gap: 14px;}}
@media (min-width:768px){.sa:has(.rolekey) .rolekey{margin-bottom: 12px;}}
/* engineering fit after round 2: Who's on cards keep names on one line on a portrait iPad */
.sa .shift h3{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (min-width:768px) and (max-width:1100px){.sa .shiftgrid{grid-template-columns:1fr}}
/* nav1011: the bottom tabs stay visible and tappable on every staff screen, sheets included: the sheet stops above the tab bar */
body:has(.appbar) .sa .sheetwrap{bottom:calc(61px + env(safe-area-inset-bottom,0px))}
body:has(.appbar) .sa .sheet{padding-bottom:24px}
@media (min-width:768px){body:has(.appbar) .sa .sheetwrap{bottom:var(--ipad-appbar-h,calc(72px + env(safe-area-inset-bottom,0px)))}}

/* simple1011: thin tabs inside the staff screens (Schedule, Board), same frame as the rest of the app */
.sa .seg.thin{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:0;margin:10px 0 14px;border:1.5px solid var(--ink);background:#fff;border-radius:2px;overflow:hidden}
.sa .seg.thin button{min-height:36px;border:0;border-left:1px solid var(--ink);border-radius:0;background:#fff;font:700 13px/1.1 Archivo,system-ui,sans-serif;color:var(--ink);padding:0 6px;white-space:nowrap}
.sa .seg.thin button:first-child{border-left:0}
.sa .seg.thin .on{background:#D6E59A;border:0;border-left:1px solid var(--ink);font-weight:800}
.sa .seg.thin .on:first-child{border-left:0}
/* Home: the next-shift card opens the Schedule */
.sa .tapcard{display:block;width:100%;text-align:left;cursor:pointer;-webkit-appearance:none;appearance:none;font:inherit;color:inherit}
.sa .tapmore{display:inline-block;margin-top:8px;font-weight:700;font-size:14px}
.sa-embed .card{margin-top:0}

/* clcoll1020 (Lora 10/20): checklists collapse from their header */
.sa .saclhd{display:flex;align-items:center;gap:10px;width:100%;border:0;background:none;padding:0;margin:0;text-align:left;font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
.sa .saclhd>span:first-child{flex:1;min-width:0}
.sa .saclchev{flex:none;display:grid;place-items:center;width:32px;height:32px;border:1.5px solid var(--ink);font-size:16px;line-height:1;transition:transform .15s ease}
.sa .sacl.coll .saclchev{transform:rotate(-90deg)}
.sa .sacl.coll .checkrow{display:none}
@media (prefers-reduced-motion:reduce){.sa .saclchev{transition:none}}

/* avail1026: one-week rows carry the day and the date */
.sa .availrow.wk{grid-template-columns:56px minmax(0,1fr)}.sa .availrow.wk small{font:500 11px 'IBM Plex Mono',monospace}
/* cols1026 (Josh 10/26): day columns stay equal width whatever is in them (1fr let long text widen a column) */
.sa .daystrip>*,.sa .daysrow>*{min-width:0;overflow-wrap:anywhere}