/* Job workspace navigation and header continuity */
.workspace-tabs button{font-weight:850;}

.workspace-topbar,.sync-detail-topbar{
  display:block;
  margin-bottom:26px;
}

.workspace-context,.sync-detail-context{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:14px;
  padding-bottom:14px;
  border-bottom:1px solid rgba(7,40,42,.09);
}

.workspace-back{
  appearance:none;
  border:0;
  background:transparent;
  padding:7px 0;
  color:var(--fh-ink);
  font:inherit;
  font-weight:850;
  cursor:pointer;
  white-space:nowrap;
}

.workspace-project{
  min-width:0;
  display:flex;
  align-items:baseline;
  gap:8px;
}
.workspace-project span{
  color:var(--fh-gold);
  font-size:9px;
  font-weight:950;
  letter-spacing:.14em;
}
.workspace-project strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--fh-ink);
  font-size:14px;
}

.workspace-state{
  display:flex;
  align-items:center;
  gap:7px;
}
.sync-chip{
  appearance:none;
  border:1px solid #c9e6d5;
  border-radius:999px;
  background:#f3faf5;
  color:var(--fh-green);
  min-height:31px;
  padding:6px 10px;
  font:inherit;
  font-size:10px;
  font-weight:900;
  letter-spacing:.02em;
  cursor:pointer;
}
.sync-chip.has-pending{
  border-color:#ead39f;
  background:#fff9eb;
  color:var(--fh-amber);
}

.workspace-title{
  margin-top:18px;
}
.workspace-title h1{
  margin:0 0 5px;
  font-size:clamp(31px,7vw,42px);
  line-height:1.03;
}
.workspace-title .muted{
  margin:0;
  font-size:14px;
}

.sync-detail-context{
  grid-template-columns:1fr auto;
}

/* My Jobs is the front door, not another workspace tab. */
.app-shell:not(:has(.workspace-tabs)){
  padding-top:max(22px,env(safe-area-inset-top));
}

@media(max-width:560px){
  .workspace-context{
    grid-template-columns:1fr auto;
    gap:8px 12px;
  }
  .workspace-back{grid-column:1/2;grid-row:1;}
  .workspace-project{grid-column:1/2;grid-row:2;display:block;}
  .workspace-project span{display:block;margin-bottom:2px;}
  .workspace-project strong{display:block;}
  .workspace-state{grid-column:2/3;grid-row:1/3;flex-direction:column;align-items:flex-end;}
  .workspace-state .connection,.sync-chip{white-space:nowrap;}
}

@media(max-width:420px){
  .workspace-context,.sync-detail-context{padding-bottom:12px;}
  .workspace-title{margin-top:15px;}
  .workspace-title h1{font-size:31px;}
  .sync-chip{padding:6px 9px;}
}