/* v556 — Apple layer for the Human+ Desk (Amanda, 24 Sep 2026).
   Grey page, white borderless surfaces, one hairline, capsule controls, a segmented tab bar, quiet notices.
   The MaidProvider.ph wordmark stays the single brand moment. Loaded last, so it governs the whole Desk. */
:root{
  --paper:#F4F6FB;   /* page */
  --card:#FFFFFF;    /* surfaces */
  --ink:#0B1A2B;     /* primary text */
  --muted:#5E6878;   /* secondary text */
  --faint:#5E6878;   /* tertiary text */
  --fill:#F4F6FB;    /* secondary controls, segmented track */
  --hair:rgba(0,0,0,.08);
  --line:#E3E7EF;
  --focus:#6282C2;
}
body{background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;padding:28px 20px 96px}
.wrap{max-width:820px}

/* Masthead: the wordmark, one quiet line under it, nothing else */
#masthead .signin-wordmark{font-size:clamp(26px,5vw,34px);letter-spacing:-.015em}
#deskh1{font-size:15px;font-weight:400;color:var(--muted);margin-top:2px;letter-spacing:-.005em}
#masthead:hover h1{color:var(--muted)}
.rule{display:none}
#steward-live,#steward-live-detail{display:none!important}
.masthead-actions{display:flex;gap:8px;align-items:center}
#signout-btn{background:transparent!important;color:var(--muted)!important;padding-inline:10px}

/* Surfaces */
.card{background:var(--card);border:0;border-radius:22px;padding:24px;margin:14px 0;box-shadow:none}
.card .card,.status-item{background:var(--paper);border:0;border-radius:14px}
.note,.who,.system-note{color:var(--muted)}
h2{font-size:22px;font-weight:500;letter-spacing:-.015em}
h3{font-size:17px;font-weight:500;letter-spacing:-.01em}
details summary{font-weight:500;color:var(--ink)}
.caseline,.compact-line{border-bottom:1px solid var(--hair)}
.caseline:hover{background:#F4F6FB}
.chip{border:0;background:var(--fill);color:var(--ink);letter-spacing:0}
fieldset{border:1px solid var(--hair);border-radius:16px}

/* Controls: capsules */
button{border-radius:980px;min-height:40px;padding:9px 18px;font-weight:500;letter-spacing:-.005em;transition:background-color .15s ease,transform .08s ease}
button:active{transform:scale(.98)}
.primary{background:var(--navy);color:#fff}
.primary:hover{background:#0B1A2B}
.ghost{background:var(--fill);border:0;color:var(--ink)}
.ghost:hover{background:#E3E7EF}
input,textarea,select{background:#E3E7EF;border:1px solid transparent;border-radius:12px;color:var(--ink)}
input:focus,textarea:focus,select:focus{background:#fff;border-color:var(--focus);outline:none;box-shadow:0 0 0 4px rgba(98,130,194,.16)}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}

/* Tabs: a segmented control */
#tabs{background:var(--fill);border-radius:14px;padding:3px;gap:2px;margin-bottom:10px;display:inline-flex;flex-wrap:wrap}
#tabs button{background:transparent!important;border:0;color:var(--muted)!important;min-height:34px;padding:6px 14px;border-radius:11px;font-weight:500}
#tabs button[style*="navy"]{background:#fff!important;color:var(--ink)!important;box-shadow:0 1px 3px rgba(0,0,0,.08),0 1px 1px rgba(0,0,0,.04)}
.desk-toolbar .desk-tab{background:transparent;border:0;color:var(--muted);border-radius:11px}
.desk-toolbar .desk-tab[aria-pressed="true"]{background:var(--fill);color:var(--ink)}

/* Notices: quiet white rows, meaning carried by a small dot and the words, not by tinted banners */
.err,.ok,.warn,.info{background:var(--card);border:1px solid var(--hair);border-left:1px solid var(--hair);border-radius:14px;color:var(--ink);padding:12px 16px;position:relative}
/* v696: the status dot belongs to the label ("Attention needed"), so it stays aligned whatever padding a surface gives the notice */
.err::before,.ok::before,.warn::before,.info::before{padding-left:13px;background:radial-gradient(circle at 3.5px 50%,var(--notice-accent) 3.5px,transparent 4px) no-repeat}
.restricted{background:var(--card);border:1px solid var(--hair);border-radius:22px}

/* Ask Steward: a frosted capsule */
/* v613: Ask Steward is a quiet white capsule (desk-note.js) */

@media(max-width:600px){body{padding:16px 12px 96px}.card{padding:18px;border-radius:18px}#tabs{display:flex}}
@media(prefers-reduced-motion:reduce){button{transition:none}button:active{transform:none}}

/* one Ask Steward: the floating capsule; the header copy hides when it is present */
body:has(#tell-steward) #ask-btn{display:none!important}
