/* Shared workspace: start at the brand banner, not the optional refresh row. */
.prototype-bar{display:none}
:root{--fieldplan-banner:#6b7557}
@media(max-width:850px){
  /* Paint the status-bar area and banner as one opaque muted olive surface.
     The existing 74/69px content region stays centered below the safe inset. */
  :root{background:var(--fieldplan-banner)}
  .app-shell{background:#f5f7f5}
  .topbar{height:calc(74px + var(--safe-area-top));padding-top:var(--safe-area-top);background:var(--fieldplan-banner);color:#fff}
  .top-actions .icon-button,.mobile-brand .official-brand>small{color:#fff}
  .top-avatar{color:#173137}
}
@media(max-width:600px){
  .topbar{height:calc(69px + var(--safe-area-top))}
}
/* Match desktop's brand/navigation panel to the mobile olive banner. */
.sidebar{background:var(--fieldplan-banner);color:#fff}
.sidebar .nav-item:not(.active),.sidebar .workspace-label,.sidebar .official-brand>small,.sidebar .profile-button small{color:#fff}
.sidebar .nav-count{background:#455034;color:#fff}
.sidebar .nav-item.active .nav-count{background:#173c3114;color:#173c31}
/* Slightly larger desktop entries. Keep 18px compact entries within the
   existing 20px multi-day lanes; phone/tablet styling remains unchanged. */
@media(min-width:851px) and (hover:hover) and (pointer:fine){
  .month-jobs small,.event-span{font-size:10px;line-height:12px;padding:3px 6px}
  .job-card{padding:20px 22px 20px 0;min-height:122px}
  .job-main h3{font-size:16px}
  .job-card .job-project{font-size:13px}
  .job-main p{font-size:11px}
  .job-time strong{font-size:16px}
  .job-time span,.job-time small{font-size:11px}
  .job-card .job-type{font-size:9px}
  .job-card .status{font-size:10px}
  .job-crew small{font-size:10px}
}