/* V1452.156 — mobile roster only; desktop and the rest of EarthRoster unchanged. */
@media(max-width:1023px){
  html body.ww-roster-active #app #page .roster-mobile{display:flex!important;flex-direction:column!important;gap:9px!important;align-items:stretch!important;padding:3px 0 14px!important;min-width:0!important;}
  html body.ww-roster-active #app #page .roster-mobile>.er156-card{
    box-sizing:border-box!important;display:block!important;position:relative!important;isolation:isolate!important;
    width:100%!important;max-width:100%!important;height:auto!important;min-height:0!important;
    padding:10px 12px 9px 13px!important;margin:0!important;overflow:hidden!important;
    color:#143222!important;-webkit-text-fill-color:initial!important;
    border:1px solid var(--er156-solid,#4d845b)!important;border-left:6px solid var(--er156-solid,#4d845b)!important;border-right:4px solid var(--er156-solid,#4d845b)!important;
    border-radius:18px!important;background:linear-gradient(118deg,var(--er156-surface,#f3f8f1),var(--er156-soft,#deeddb))!important;
    box-shadow:0 3px 9px rgba(21,46,30,.12),inset 0 0 0 1px rgba(255,255,255,.5)!important;
    transform:none!important;transition:none!important;animation:none!important;
    contain:none!important;touch-action:pan-y!important;
  }
  html body.ww-roster-active #app #page .roster-mobile>.er156-card:focus-within{outline:2px solid #426f46;outline-offset:1px;}
  .roster-mobile .er156-card,.roster-mobile .er156-card *{box-sizing:border-box!important;}
  .roster-mobile .er156-main{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;column-gap:7px!important;align-items:start!important;min-width:0!important;}
  .roster-mobile .er156-info{min-width:0!important;display:grid!important;gap:4px!important;}
  .roster-mobile .er156-title{display:block!important;color:#123323!important;margin:0 0 2px!important;font:780 clamp(16px,4.3vw,19px)/1.12 system-ui,-apple-system,'Segoe UI',sans-serif!important;letter-spacing:-.35px!important;overflow-wrap:anywhere!important;}
  .roster-mobile .er156-detail{min-width:0!important;display:flex!important;align-items:center!important;gap:5px!important;font:500 12px/1.22 system-ui,-apple-system,'Segoe UI',sans-serif!important;color:#244132!important;white-space:normal!important;}
  .roster-mobile .er156-detail svg{flex:0 0 15px!important;width:15px!important;height:15px!important;color:var(--er156-deep,#315a3e)!important;}
  .roster-mobile .er156-time strong{font:750 14px/1.25 system-ui,-apple-system,'Segoe UI',sans-serif!important;color:#183729!important;white-space:nowrap!important;}
  .roster-mobile .er156-location span{min-width:0!important;overflow-wrap:anywhere!important;}
  .roster-mobile .er156-tags{display:flex!important;flex-direction:column!important;align-items:flex-end!important;gap:5px!important;max-width:134px!important;}
  .roster-mobile .er156-chip{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;min-height:26px!important;padding:3px 8px!important;border:1px solid rgba(56,105,65,.38)!important;border-radius:999px!important;background:rgba(255,255,255,.69)!important;color:#193b29!important;font:720 11px/1.12 system-ui,-apple-system,'Segoe UI',sans-serif!important;text-align:center!important;white-space:nowrap!important;}
  .roster-mobile .er156-chip svg{width:14px!important;height:14px!important;flex:0 0 14px!important;}
  .roster-mobile .er156-total{background:#f0f8eb!important;color:#235a39!important;}
  .roster-mobile .er156-status-draft .er156-status{background:#f4f4f3!important;color:#66706a!important;border-color:#afb6ad!important;}
  .roster-mobile .er156-status-declined .er156-status{background:#fff0ec!important;color:#a1443b!important;border-color:#d6a49d!important;}
  .roster-mobile .er156-status-progress .er156-status{background:#e5f8ea!important;color:#176238!important;}
  .roster-mobile .er156-team{border-top:1px solid rgba(34,74,45,.25)!important;margin-top:8px!important;padding-top:7px!important;}
  .roster-mobile .er156-team-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px 10px!important;min-width:0!important;}
  .roster-mobile .er156-person{min-width:0!important;display:flex!important;align-items:center!important;gap:5px!important;color:#142f22!important;}
  .roster-mobile .er156-avatar{flex:0 0 25px!important;width:25px!important;height:25px!important;display:flex!important;align-items:center!important;justify-content:center!important;border-radius:50%!important;background:var(--person-colour,#487d53)!important;color:#fff!important;-webkit-text-fill-color:#fff!important;font:800 10px/1 system-ui,-apple-system,sans-serif!important;}
  .roster-mobile .er156-person-name{min-width:0!important;flex:1 1 auto!important;display:flex!important;align-items:center!important;gap:2px!important;font:730 11.3px/1.17 system-ui,-apple-system,sans-serif!important;letter-spacing:-.15px!important;overflow-wrap:anywhere!important;}
  .roster-mobile .er156-person-hours{margin-left:auto!important;flex:0 0 auto!important;font:800 11.5px/1.1 system-ui,-apple-system,sans-serif!important;white-space:nowrap!important;}
  .roster-mobile .er156-person-tick,.roster-mobile .er156-person-declined{display:inline-flex!important;flex:0 0 12px!important;align-items:center!important;}
  .roster-mobile .er156-person-tick{color:#236d32!important;}.roster-mobile .er156-person-declined{color:#af4c42!important;}
  .roster-mobile .er156-person-tick svg,.roster-mobile .er156-person-declined svg{width:12px!important;height:12px!important;}
  .roster-mobile .er156-person-active{width:7px!important;height:7px!important;border-radius:50%!important;background:#2a953f!important;flex:0 0 7px!important;}
  .roster-mobile .er156-your-hours{display:block!important;margin:7px 0 0 1px!important;color:#396044!important;font:650 10px/1.2 system-ui,-apple-system,sans-serif!important;}
  .roster-mobile .er156-no-staff{font:600 11px/1.3 system-ui,-apple-system,sans-serif!important;color:#526658!important;}
  .roster-mobile .er156-actions{display:flex!important;justify-content:flex-end!important;align-items:center!important;flex-wrap:wrap!important;gap:6px!important;margin-top:8px!important;}
  .roster-mobile .er156-actions .er156-action{all:unset;box-sizing:border-box!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;min-height:30px!important;padding:5px 10px!important;border:1px solid rgba(35,87,48,.38)!important;border-radius:9px!important;background:rgba(255,255,255,.68)!important;color:#234c31!important;-webkit-text-fill-color:#234c31!important;font:750 11px/1.1 system-ui,-apple-system,'Segoe UI',sans-serif!important;cursor:pointer!important;white-space:nowrap!important;}
  .roster-mobile .er156-action svg{width:13px!important;height:13px!important;flex:0 0 13px!important;}
  .roster-mobile .er156-actions .er156-primary{background:#285634!important;color:#fff!important;-webkit-text-fill-color:#fff!important;border-color:#285634!important;}
  .roster-mobile .er156-actions .er156-decline{background:#fff8f5!important;color:#8b483b!important;-webkit-text-fill-color:#8b483b!important;border-color:#d8b7aa!important;}
  .roster-mobile .er156-actions .er156-action:focus-visible{outline:2px solid #184f2b!important;outline-offset:2px!important;}
  .roster-mobile .er156-actions .er156-action:active{filter:brightness(.94)!important;}
}
@media(max-width:370px){
  .roster-mobile .er156-main{grid-template-columns:minmax(0,1fr) 108px!important;}
  .roster-mobile .er156-tags{max-width:108px!important;}
  .roster-mobile .er156-chip{font-size:9.2px!important;padding:3px 5px!important;}
  .roster-mobile .er156-title{font-size:15px!important;}
  .roster-mobile .er156-time strong{font-size:11.8px!important;}
  .roster-mobile .er156-person-name{font-size:9.7px!important;}
  .roster-mobile .er156-avatar{width:22px!important;height:22px!important;flex-basis:22px!important;font-size:9px!important;}
  .roster-mobile .er156-team-grid{column-gap:6px!important;}
}

/* V1452.157: roster cards open job details on tap; no redundant card buttons.
   The employee's only inline controls are Accept and Reject on pending shifts. */
@media(max-width:1023px){
  html body.ww-roster-active #app #page .roster-mobile > .er156-card{cursor:pointer!important;}
  .roster-mobile .er156-card:focus-visible{outline:3px solid #285c3f!important;outline-offset:2px!important;}
  .roster-mobile .er157-response-actions{margin-top:8px!important;padding-top:2px!important;gap:8px!important;}
  .roster-mobile .er157-response-actions .er156-action{min-width:82px!important;min-height:33px!important;padding:6px 13px!important;font-size:11.5px!important;}
  .roster-mobile .er157-response-actions .er156-decline{background:#fbecea!important;color:#963b35!important;-webkit-text-fill-color:#963b35!important;border-color:#d6a19c!important;}
}

/* V1452.158 — requested real-size actions on the mobile roster cards only.
   Employee: full-width Start shift, equal-size Decline / Accept.
   Admin: Publish only on an authorised private draft. All cards remain tappable. */
@media(max-width:1023px){
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions.er158-start-actions,
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions.er158-response-actions{
    display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:9px!important;
    width:100%!important;margin-top:10px!important;padding:0!important;
  }
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions.er158-response-actions{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions .er156-action.er158-start,
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions .er156-action.er158-accept,
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions .er156-action.er158-decline{
    display:flex!important;width:100%!important;min-width:0!important;height:46px!important;
    min-height:46px!important;padding:8px 12px!important;align-items:center!important;
    justify-content:center!important;border-radius:11px!important;white-space:nowrap!important;
    font:760 15px/1.15 system-ui,-apple-system,'Segoe UI',sans-serif!important;
    box-shadow:none!important;
  }
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions .er156-action.er158-start{
    background:linear-gradient(180deg,#31995d,#26834d)!important;
    border:1px solid #247848!important;color:#fff!important;-webkit-text-fill-color:#fff!important;
    gap:10px!important;
  }
  .roster-mobile .er156-actions .er158-start svg{
    background:#fff!important;color:#23844c!important;stroke:#23844c!important;
    width:25px!important;height:25px!important;padding:6px!important;border-radius:50%!important;
    fill:#23844c!important;stroke-width:0!important;
  }
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions .er156-action.er158-accept{
    background:#2d684f!important;border:1px solid #23563f!important;
    color:#fff!important;-webkit-text-fill-color:#fff!important;
  }
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions .er156-action.er158-decline{
    background:rgba(255,252,250,.88)!important;border:1.5px solid #cc9b90!important;
    color:#965347!important;-webkit-text-fill-color:#965347!important;
  }
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions.er158-publish-actions{
    display:flex!important;justify-content:flex-end!important;margin-top:8px!important;gap:0!important;
  }
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions .er156-action.er158-publish{
    min-width:116px!important;height:42px!important;min-height:42px!important;
    padding:7px 16px!important;border-radius:10px!important;
    font:750 13px/1.15 system-ui,-apple-system,'Segoe UI',sans-serif!important;
    background:#2b684d!important;color:#fff!important;-webkit-text-fill-color:#fff!important;
    border:1px solid #235940!important;
  }
  .roster-mobile .er156-actions .er158-publish svg{width:16px!important;height:16px!important;stroke:#fff!important;}
  .roster-mobile .er156-actions .er156-action:disabled{opacity:.6!important;cursor:wait!important;}
}

@media(max-width:1023px){
 .roster-mobile .er156-actions .er158-play-glyph{
   flex:0 0 25px!important;display:grid!important;place-items:center!important;
   width:25px!important;height:25px!important;border-radius:50%!important;
   background:#fff!important;color:#25884f!important;-webkit-text-fill-color:#25884f!important;
   padding-left:2px!important;font:800 10px/1 system-ui,sans-serif!important;
 }
}

/* V1452.159 — compact mobile roster and unambiguous rejection states.
   Draft = light grey. One-person rejection = pale red + crossed-out client.
   Shared-job rejection = original client colour, X only on declined people. */
@media(max-width:1023px){
  html body.ww-roster-active #app #page .roster-mobile{gap:7px!important;}
  html body.ww-roster-active #app #page .roster-mobile>.er156-card{
    padding:8px 10px 8px 11px!important;
    border-left-width:5px!important;border-right-width:3px!important;
    border-radius:14px!important;
    box-shadow:0 2px 5px rgba(22,47,30,.095)!important;
  }
  .roster-mobile .er156-info{gap:2px!important;}
  .roster-mobile .er156-title{font-size:clamp(15px,4vw,17px)!important;line-height:1.1!important;margin:0 0 1px!important;}
  .roster-mobile .er156-detail{font-size:11.5px!important;line-height:1.16!important;gap:4px!important;}
  .roster-mobile .er156-detail svg{width:13px!important;height:13px!important;flex-basis:13px!important;}
  .roster-mobile .er156-time strong{font-size:13px!important;line-height:1.17!important;}
  .roster-mobile .er156-tags{gap:4px!important;max-width:129px!important;}
  .roster-mobile .er156-chip{min-height:23px!important;padding:2px 7px!important;font-size:10.3px!important;gap:4px!important;}
  .roster-mobile .er156-chip svg{width:14px!important;height:14px!important;flex-basis:14px!important;}
  .roster-mobile .er156-team{margin-top:6px!important;padding-top:5px!important;}
  .roster-mobile .er156-team-grid{row-gap:4px!important;column-gap:8px!important;}
  .roster-mobile .er156-person{gap:4px!important;}
  .roster-mobile .er156-avatar{width:22px!important;height:22px!important;flex-basis:22px!important;font-size:9px!important;}
  .roster-mobile .er156-person-name{font-size:11px!important;}
  .roster-mobile .er156-person-hours{font-size:11px!important;}
  .roster-mobile .er156-your-hours{margin-top:4px!important;font-size:9.8px!important;}
  .roster-mobile .er156-actions{margin-top:6px!important;}
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions.er158-start-actions,
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions.er158-response-actions{gap:7px!important;margin-top:7px!important;}
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions .er156-action.er158-start,
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions .er156-action.er158-accept,
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions .er156-action.er158-decline{
    height:42px!important;min-height:42px!important;border-radius:9px!important;
    padding:6px 10px!important;font-size:13.5px!important;
  }
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions.er158-publish-actions{margin-top:6px!important;}
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions .er156-action.er158-publish{
    min-width:102px!important;height:38px!important;min-height:38px!important;padding:6px 12px!important;
    font-size:12.5px!important;border-radius:8px!important;
  }
  /* The original client colour must never show through a private draft card. */
  html body.ww-roster-active #app #page .roster-mobile>.er156-card.er156-status-draft{
    background:linear-gradient(115deg,#f2f3f4,#e9ecee)!important;
    border-color:#a5acb3!important;border-left-color:#8b949b!important;border-right-color:#8b949b!important;
  }
  .roster-mobile .er156-status-draft .er156-title{color:#3f484e!important;}
  .roster-mobile .er156-status-draft .er156-total{background:#f5f6f7!important;color:#56616a!important;border-color:#bac1c7!important;}
  /* Single-employee rejected job: muted red surface and struck-through client. */
  html body.ww-roster-active #app #page .roster-mobile>.er156-card.er159-solo-rejected{
    background:linear-gradient(116deg,#fff1f0,#fde5e4)!important;
    border-color:#d7a7a6!important;border-left-color:#c75755!important;border-right-color:#c75755!important;
  }
  .roster-mobile .er159-solo-rejected .er156-title{
    text-decoration:line-through!important;text-decoration-color:#a93a3a!important;text-decoration-thickness:2px!important;
    color:#843b3a!important;
  }
  .roster-mobile .er159-solo-rejected .er156-status{
    background:#b63738!important;border-color:#a62d30!important;color:white!important;
    -webkit-text-fill-color:white!important;
  }
  .roster-mobile .er159-solo-rejected .er156-status svg{stroke:#fff!important;stroke-width:3.2!important;}
  /* Multiple employees: keep all original card colours, show X on each declined employee only. */
  .roster-mobile .er159-shared-rejection .er156-status{
    background:rgba(255,255,255,.8)!important;color:#604c26!important;
    -webkit-text-fill-color:#604c26!important;border-color:#b0a078!important;
  }
  /* Distinct, high-contrast icons in employee names. Use small filled badges. */
  .roster-mobile .er156-person-tick,.roster-mobile .er156-person-declined{
    display:inline-grid!important;place-items:center!important;flex:0 0 18px!important;
    width:18px!important;height:18px!important;min-width:18px!important;
    border-radius:50%!important;box-shadow:0 0 0 1px rgba(255,255,255,.8)!important;
  }
  .roster-mobile .er156-person-tick{background:#197541!important;color:#fff!important;}
  .roster-mobile .er156-person-declined{background:#c22c35!important;color:#fff!important;}
  .roster-mobile .er156-person-tick svg,.roster-mobile .er156-person-declined svg{
    display:block!important;width:13px!important;height:13px!important;
    stroke:white!important;stroke-width:3.4!important;
  }
  /* Confirmation and rejection badges are real state labels, not action buttons. */
  .roster-mobile .er156-status-confirmed .er156-status,
  .roster-mobile .er156-status-completed .er156-status{
    background:#e3f4e8!important;color:#17663a!important;
    -webkit-text-fill-color:#17663a!important;border:1.5px solid #56a579!important;
    font-weight:830!important;
  }
  .roster-mobile .er156-status-confirmed .er156-status svg,
  .roster-mobile .er156-status-completed .er156-status svg{stroke-width:3!important;}
  .roster-mobile .er156-status-declined .er156-status{
    background:#ffe5e4!important;color:#a92730!important;
    -webkit-text-fill-color:#a92730!important;border:1.5px solid #cd7071!important;
    font-weight:820!important;
  }
}
@media(max-width:370px){
  .roster-mobile .er156-tags{max-width:109px!important;}
  .roster-mobile .er156-chip{font-size:9.4px!important;padding:2px 4px!important;}
  .roster-mobile .er156-title{font-size:14.4px!important;}
  .roster-mobile .er156-time strong{font-size:11.6px!important;}
  .roster-mobile .er156-person-name{font-size:9.6px!important;}
  .roster-mobile .er156-person-tick,.roster-mobile .er156-person-declined{width:16px!important;height:16px!important;min-width:16px!important;flex-basis:16px!important;}
  .roster-mobile .er156-person-tick svg,.roster-mobile .er156-person-declined svg{width:12px!important;height:12px!important;}
}

/* V1452.160 — midpoint between the bulky V158 and crowded V159 sizing.
   Restore readability without expanding the calendar or other app sections.
   The redundant "My hours" summary is removed at source, not merely hidden. */
@media(max-width:1023px){
  html body.ww-roster-active #app #page .roster-mobile{gap:9px!important;}
  html body.ww-roster-active #app #page .roster-mobile>.er156-card{
    padding:10px 11px 10px 12px!important;
    border-left-width:6px!important;border-right-width:4px!important;
    border-radius:16px!important;
    box-shadow:0 2px 7px rgba(22,47,30,.11)!important;
  }
  .roster-mobile .er156-info{gap:3px!important;}
  .roster-mobile .er156-title{font-size:clamp(16px,4.25vw,18px)!important;line-height:1.16!important;margin-bottom:2px!important;}
  .roster-mobile .er156-detail{font-size:12px!important;line-height:1.25!important;gap:5px!important;}
  .roster-mobile .er156-detail svg{width:14px!important;height:14px!important;flex-basis:14px!important;}
  .roster-mobile .er156-time strong{font-size:13.5px!important;line-height:1.23!important;}
  .roster-mobile .er156-tags{gap:5px!important;max-width:137px!important;}
  .roster-mobile .er156-chip{min-height:25px!important;padding:3px 7px!important;font-size:10.7px!important;gap:4px!important;}
  .roster-mobile .er156-team{margin-top:8px!important;padding-top:7px!important;}
  .roster-mobile .er156-team-grid{row-gap:6px!important;column-gap:9px!important;}
  .roster-mobile .er156-person{gap:5px!important;}
  .roster-mobile .er156-avatar{width:24px!important;height:24px!important;flex-basis:24px!important;font-size:9.5px!important;}
  .roster-mobile .er156-person-name{font-size:11.35px!important;line-height:1.2!important;gap:3px!important;}
  .roster-mobile .er156-person-hours{font-size:11.5px!important;}
  .roster-mobile .er156-actions{margin-top:8px!important;}
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions.er158-start-actions,
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions.er158-response-actions{gap:8px!important;margin-top:9px!important;}
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions .er156-action.er158-start,
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions .er156-action.er158-accept,
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions .er156-action.er158-decline{
    height:44px!important;min-height:44px!important;border-radius:10px!important;
    padding:7px 11px!important;font-size:14px!important;
  }
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions.er158-publish-actions{margin-top:9px!important;}
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions .er156-action.er158-publish{
    min-width:112px!important;height:40px!important;min-height:40px!important;padding:7px 14px!important;
    font-size:13px!important;border-radius:9px!important;
  }
  .roster-mobile .er159-shared-rejection .er156-status{
    color:#1e4930!important;-webkit-text-fill-color:#1e4930!important;
    border-color:rgba(56,105,65,.38)!important;
  }
}
@media(max-width:370px){
  .roster-mobile .er156-main{grid-template-columns:minmax(0,1fr) 115px!important;column-gap:5px!important;}
  .roster-mobile .er156-tags{max-width:115px!important;}
  .roster-mobile .er156-chip{font-size:9.75px!important;padding:3px 5px!important;}
  .roster-mobile .er156-title{font-size:15.25px!important;}
  .roster-mobile .er156-detail{font-size:11.4px!important;}
  .roster-mobile .er156-time strong{font-size:12px!important;}
  .roster-mobile .er156-team-grid{column-gap:7px!important;}
  .roster-mobile .er156-person-name{font-size:10.25px!important;}
  .roster-mobile .er156-person-hours{font-size:10.6px!important;}
  .roster-mobile .er156-avatar{width:23px!important;height:23px!important;flex-basis:23px!important;}
}

/* V1452.161 — readability and truthful Needs staff badge on mobile only.
   Client titles no longer compete with badges for horizontal space; staff names
   are legible at ordinary viewing distance, including narrow 320px screens. */
@media (max-width:1023px){
  html body.ww-roster-active #app #page .roster-mobile > .er156-card{
    padding:11px 12px 11px 13px!important;
  }
  html body.ww-roster-active #app #page .roster-mobile .er156-card > .er156-title{
    display:block!important;
    width:100%!important;
    margin:0 0 7px!important;
    font-size:20px!important;
    line-height:1.18!important;
    font-weight:800!important;
    letter-spacing:-.3px!important;
    overflow-wrap:break-word!important;
    word-break:normal!important;
  }
  .roster-mobile .er156-main{
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:7px!important;
  }
  .roster-mobile .er156-time strong{font-size:13.5px!important;}
  .roster-mobile .er156-team{margin-top:9px!important;padding-top:8px!important;}
  .roster-mobile .er156-team-grid{gap:8px 10px!important;}
  .roster-mobile .er156-person{gap:6px!important;align-items:center!important;}
  .roster-mobile .er156-avatar{width:25px!important;height:25px!important;flex-basis:25px!important;font-size:10px!important;}
  .roster-mobile .er156-person-name{
    font-size:13.4px!important;
    line-height:1.24!important;
    letter-spacing:0!important;
    font-weight:750!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
  .roster-mobile .er156-person-hours{font-size:12.8px!important;line-height:1.2!important;}
  .roster-mobile .er156-person-tick,.roster-mobile .er156-person-declined{
    flex:0 0 18px!important;width:18px!important;height:18px!important;
  }
  .roster-mobile .er156-status-needs-staff .er156-status,
  .roster-mobile .er159-shared-rejection.er156-status-needs-staff .er156-status{
    background:#fff1da!important;
    border-color:#c28f4b!important;
    color:#775020!important;
    -webkit-text-fill-color:#775020!important;
    font-weight:830!important;
  }
}
@media (max-width:370px){
  html body.ww-roster-active #app #page .roster-mobile .er156-card > .er156-title{
    font-size:19px!important;line-height:1.2!important;
  }
  .roster-mobile .er156-team-grid{
    grid-template-columns:minmax(0,1fr)!important;
    gap:7px!important;
  }
  .roster-mobile .er156-person-name{font-size:13.5px!important;line-height:1.25!important;}
  .roster-mobile .er156-person-hours{font-size:12.8px!important;}
  .roster-mobile .er156-avatar{width:25px!important;height:25px!important;flex-basis:25px!important;}
}


/* V1452.162 — legible, restrained mobile roster typography only.
   Use native system sans-serif, consistent hierarchy, high-contrast copy,
   and responsive status layouts rather than shrinking text to fit. */
@media (max-width:1023px){
  html body.ww-roster-active #app #page .roster-mobile > .er156-card{
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif!important;
    color:#183629!important;
    padding:11px 12px 11px 13px!important;
  }
  html body.ww-roster-active #app #page .roster-mobile .er156-card > .er156-title{
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif!important;
    font-size:21px!important;
    line-height:1.22!important;
    font-weight:750!important;
    letter-spacing:-.25px!important;
    margin-bottom:8px!important;
    color:#153326!important;
    overflow-wrap:break-word!important;
    word-break:normal!important;
  }
  .roster-mobile .er156-info{gap:5px!important;}
  .roster-mobile .er156-detail{
    font-family:inherit!important;
    font-size:13.25px!important;
    line-height:1.38!important;
    font-weight:520!important;
    color:#2c5140!important;
    gap:6px!important;
  }
  .roster-mobile .er156-location span{
    overflow-wrap:break-word!important;
    word-break:normal!important;
  }
  .roster-mobile .er156-detail svg{width:15px!important;height:15px!important;flex-basis:15px!important;}
  .roster-mobile .er156-time strong{
    font-size:15px!important;
    line-height:1.3!important;
    font-weight:730!important;
    letter-spacing:0!important;
    color:#17392a!important;
  }
  .roster-mobile .er156-tags{max-width:140px!important;gap:6px!important;}
  .roster-mobile .er156-chip{
    min-height:27px!important;
    padding:4px 8px!important;
    font-family:inherit!important;
    font-size:11.6px!important;
    line-height:1.2!important;
    font-weight:720!important;
    letter-spacing:0!important;
  }
  .roster-mobile .er156-chip svg{width:15px!important;height:15px!important;flex-basis:15px!important;}
  .roster-mobile .er156-team{margin-top:10px!important;padding-top:9px!important;}
  .roster-mobile .er156-team-grid{gap:8px 10px!important;}
  .roster-mobile .er156-person{gap:6px!important;align-items:center!important;}
  .roster-mobile .er156-avatar{
    flex:0 0 26px!important;width:26px!important;height:26px!important;
    font-size:10px!important;
  }
  .roster-mobile .er156-person-name{
    font-family:inherit!important;
    font-size:14.25px!important;
    line-height:1.3!important;
    font-weight:690!important;
    letter-spacing:0!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
    gap:4px!important;
  }
  .roster-mobile .er156-person-hours{
    font-family:inherit!important;
    font-size:13.5px!important;
    line-height:1.24!important;
    font-weight:750!important;
    letter-spacing:0!important;
    color:#1c3c2b!important;
  }
  .roster-mobile .er156-person-tick,.roster-mobile .er156-person-declined{
    flex:0 0 18px!important;width:18px!important;height:18px!important;
  }
  .roster-mobile .er156-actions .er156-action{
    font-family:inherit!important;font-weight:740!important;letter-spacing:0!important;
  }
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions .er156-action.er158-start,
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions .er156-action.er158-decline,
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions .er156-action.er158-accept{
    font-size:14.5px!important;
  }
  html body.ww-roster-active #app #page .roster-mobile .er156-card .er156-actions .er156-action.er158-publish{
    font-size:13.5px!important;
  }
  /* Keep the original grey draft and pale-red rejection palettes. */
  .roster-mobile .er156-status-draft .er156-title{color:#39454b!important;}
  .roster-mobile .er159-solo-rejected .er156-title{color:#843b3a!important;}
}
@media (max-width:370px){
  html body.ww-roster-active #app #page .roster-mobile .er156-card > .er156-title{font-size:20px!important;}
  /* On 320px screens, let times and addresses use the full card width;
     the two status chips move into a tidy horizontal row below. */
  html body.ww-roster-active #app #page .roster-mobile .er156-main{
    display:flex!important;flex-direction:column!important;align-items:stretch!important;
    gap:7px!important;
  }
  .roster-mobile .er156-tags{
    display:flex!important;flex-direction:row!important;align-items:center!important;
    justify-content:flex-start!important;flex-wrap:wrap!important;
    max-width:100%!important;gap:6px!important;
  }
  .roster-mobile .er156-chip{font-size:11.5px!important;padding:4px 8px!important;min-height:27px!important;}
  .roster-mobile .er156-detail{font-size:13px!important;line-height:1.35!important;}
  .roster-mobile .er156-time strong{font-size:14.5px!important;}
  .roster-mobile .er156-team-grid{grid-template-columns:minmax(0,1fr)!important;gap:7px!important;}
  .roster-mobile .er156-person-name{font-size:14.5px!important;line-height:1.28!important;}
  .roster-mobile .er156-person-hours{font-size:13.5px!important;}
}