/* ---- team / pyramid ---- */
.hermes-scope{font:500 10px var(--mono);letter-spacing:.14em;color:var(--faint);margin-left:8px;text-transform:none}
.hermes-stats{display:flex;flex-wrap:wrap;gap:8px;margin-top:9px;font:500 11.5px var(--mono);letter-spacing:.03em;color:var(--faint);align-items:baseline}
.hermes-stats b{color:var(--gold);font-weight:600}
.hermes-note{font-style:italic;color:var(--muted);max-width:280px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hermes{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  padding:15px 19px;margin-bottom:5px;display:flex;align-items:center;gap:15px;text-align:left}
.hermes.lit{border-color:var(--gold)}
.hermes .n{font:500 12px var(--mono);letter-spacing:.2em;color:var(--gold)}
.hermes .d{font-size:13px;color:var(--muted);margin-top:7px}
.stem{width:1px;height:20px;background:var(--line-2);margin:0 auto}
.crew{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:10px}
.mate{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:13px 15px;opacity:.62;
  display:flex;gap:12px;align-items:flex-start}
.mate .mate-tx{min-width:0}
.mate .au{margin-top:2px}
.mate.on{opacity:1;border-color:var(--accent-dim)}
.mate b{font-size:13px;font-weight:500;display:block;margin-bottom:5px}
.mate .d{font-size:11.5px;color:var(--faint);line-height:1.5}
.mate{cursor:pointer;transition:border-color .15s}
.mate:hover{border-color:var(--accent-dim)}
/* Dim, don't blur. iOS presents a sheet by dimming what's behind it — a
   backdrop-filter reads as a web overlay, costs a compositor pass on every
   scroll behind it, and goes muddy on an older phone. A slightly deeper plain
   dim gets the same separation and feels native. */
.sheet{position:fixed;inset:0;z-index:20;display:none;background:rgb(18 16 13 / .46)}
.sheet.on{display:block}
.sheet-in{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(520px,92vw);
  max-height:86vh;overflow-y:auto;background:var(--surface);border:1px solid var(--line-2);
  border-radius:16px;padding:24px 26px}
.sheet h3{font:600 20px var(--sans);letter-spacing:-.022em;margin:0 0 3px}
.sheet .role{font:400 12px var(--mono);color:var(--faint);margin-bottom:16px}
.sheet .x{position:absolute;top:14px;right:16px;cursor:pointer;background:none;border:0;color:var(--faint);font-size:20px}
.sheet .blk{margin-bottom:16px}
.sheet .blk h4{font:500 11px var(--sans);color:var(--muted);margin:0 0 6px}
.sheet .blk p{margin:0;font-size:13.5px;color:var(--text);line-height:1.65}
.sheet .blk .sub{color:var(--faint);font-size:12.5px}
.try{display:flex;flex-direction:column;gap:7px}
.try button{text-align:left;cursor:pointer;background:var(--bg);border:1px solid var(--line);
  border-radius:10px;padding:11px 14px;font-size:13.5px;color:var(--text)}
.try button:hover{border-color:var(--accent);color:var(--accent)}
.needs{display:flex;align-items:center;gap:8px;font-size:12.5px;padding:9px 12px;border-radius:9px;
  background:var(--bg);border:1px solid var(--line);color:var(--muted)}
.needs.missing{border-color:var(--warn);color:var(--warn)}

/* A refusal, as something you can read and act on. Deliberately NOT styled as
   an error: nothing broke, and a red panel over "your texts are switched off"
   reads as a fault the client caused. Warm border, plain sentence, one button
   that goes where the fix is. */
.why-card{background:var(--surface);border:1px solid var(--line);border-left:2px solid var(--warn);
  border-radius:var(--r);padding:15px 17px;margin-bottom:11px}
.why-card h4{font:550 14.5px var(--sans);margin:0 0 5px;color:var(--text)}
.why-card p{margin:0 0 9px;font:400 13px/1.6 var(--sans);color:var(--muted)}
.why-card .fix{font:400 13px/1.6 var(--sans);color:var(--text)}
.why-card .go{background:transparent;border:1px solid var(--line-2);color:var(--text);border-radius:9px;
  cursor:pointer;padding:7px 13px;font:500 12.5px var(--sans);margin-top:9px}
.why-card .go:hover{border-color:var(--accent-dim)}

/* The dials. A row per limit: what it is, the number, where the number came
   from. "From a default" is shown out loud — it is the difference between a
   setting somebody chose and one nobody has. */
/* The dials moved to styles/settings.css with the rest of Settings — two
   `.dial` blocks in two files, last one loaded wins, is how a rule ends up
   being edited in the half that is not in effect. */



/* ---- teams: who works with whom ------------------------------------------
   Sits between Hermes and the crew, which is where it is true — Hermes routes
   to a team, the team routes to its agents. Deliberately quieter than a crew
   card: this is the shape of the work, not a control. */
.teams{margin:0 0 18px}
.teams-h{font:600 11px var(--mono);letter-spacing:.16em;color:var(--faint);
  text-transform:uppercase;margin-bottom:9px}
.tm{background:var(--surface);border:1px solid var(--line);border-radius:12px;
  padding:12px 15px;margin-bottom:8px}
.tm-n{font:550 14.5px var(--sans);text-transform:capitalize}
.tm-shape{font:400 12.5px var(--sans);color:var(--faint);margin:2px 0 9px}
.tm-crew{display:flex;flex-wrap:wrap;gap:6px}
.tm-a{font:400 12.5px var(--sans);color:var(--text);background:var(--surface-2);
  border:1px solid var(--line);border-radius:99px;padding:5px 11px;cursor:pointer;
  text-transform:capitalize;transition:border-color .15s}
.tm-a:hover{border-color:var(--accent-dim)}
/* The lead starts a chain and hands on. Marked, not colour-coded alone. */
.tm-a.lead{border-color:var(--line-3)}
.tm-a.lead::before{content:"↦ ";opacity:.6}
.tm-none{font:400 12.5px var(--sans);color:var(--faint)}

/* What an agent will never do — the manifest's own `does_not`, on the sheet. */
.wont{margin:6px 0 0;padding-left:18px}
.wont li{font:400 13.5px var(--sans);color:var(--faint);line-height:1.55;margin-bottom:3px}