/* The few rules the working pages need beyond Design's files. css/design/*.css are copies of wrapdesk-design/screens/
   (wrap.css + app.css for the signed-in pages, dash.css for sign-in): never edit them here; copy them again to refresh.
   Tokens only, no hex. */
[hidden] { display: none !important; }
.offscreen { position: fixed; left: -9999px; top: 0; }
[data-offline]:empty, [data-msg]:empty { display: none; }

/* sign-in pages */
.bare-demo { margin: 0; text-align: center; font-size: var(--ms-fs-sm); }
.toast { transition: opacity .2s; }
.toast.is-gone { opacity: 0; pointer-events: none; }
.bare-card > .notice { margin: 0; }

/* the demo chip (Design's states.html), in the rail's foot and the phone's top bar */
.demo-chip { display: inline-block; font: 400 11px/1.4 var(--mono); letter-spacing: .08em; text-transform: uppercase; padding: 3px 8px; border-radius: var(--ms-r-pill); background: var(--ms-info-bg); color: var(--ms-info); white-space: nowrap; }
.rail-foot .demo-chip { align-self: flex-start; margin: 0 0 6px 4px; }
.topbar-only .demo-chip { margin-left: auto; }
.topbar-only .demo-chip .long { display: none; }
.content [data-offline] { margin-bottom: 12px; }

/* mobile review (Nov 12) — fields under 16 px make an iPhone zoom in on tap ("Find a name" on Crew was 13 px) */
@media (pointer: coarse) { input:not([type=checkbox]):not([type=radio]), select, textarea { font-size: 16px !important; } }
/* the whole Today / Jobs row opens the job, not just its one-line title (22 px tall) */
.tt-row a.tt-job::after { content: ""; position: absolute; inset: 0; }
@media (max-width: 639px) {
  /* finger-sized without moving anything, like Design's .btn.is-sm: "Answer", "Other answer…", "← Today", the
     sign-in links, the Menu button (they were 15–36 px tall) */
  button.lnk, a.lnk, .back, .bare a, .menu-btn { position: relative; }
  button.lnk::after, a.lnk::after, .back::after, .bare a::after { content: ""; position: absolute; inset: -13px -6px; }
  .menu-btn::after { content: ""; position: absolute; inset: -4px; }
  /* the job tabs scroll sideways: a fade at the right edge says there is more (History was cut to "Hi") */
  nav.tabs { -webkit-mask-image: linear-gradient(to right, #000 90%, transparent); mask-image: linear-gradient(to right, #000 90%, transparent); }
}
/* Vlad (Nov 12): on a phone the top bar stays put — it is pinned already; pulling past the top or bottom no longer
   bounces the page (and the bar with it) */
html, body { overscroll-behavior: none; }
