/* ═══ THE CASE DOSSIER — workspace part 2: evidence tags, document + pack output ═══ */

.tagrow{display:flex;align-items:center;gap:.6rem;margin-top:.55rem}
.evtag{
  flex:1 1 auto;display:inline-block;font:700 .68rem/1.5 var(--mono);letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink);border-radius:2px;padding:.5rem .7rem;
  background:linear-gradient(178deg,#F3ECDA,#E7DDC6);box-shadow:0 3px 8px rgba(0,0,0,.25)}
.evtag.ok{border-left:4px solid #1F4D33;color:#1F4D33}
.evtag.warn{border-left:4px solid #B98A1F;color:#7E5A14}
.evtag.miss{border-left:4px solid var(--stamp);color:var(--stamp-ink)}
.evx{
  flex:0 0 auto;width:30px;height:30px;border:0;border-radius:3px;cursor:pointer;
  background:transparent;color:var(--graphite);font:700 .85rem/1 var(--mono)}
.evx:hover{color:var(--stamp-ink);background:rgba(179,64,46,.1)}
.evcounts{display:flex;gap:1.2rem;margin-top:.9rem;font:700 .66rem/1 var(--mono);
  letter-spacing:.12em;text-transform:uppercase;color:var(--graphite)}
.evcounts b{color:var(--ink)}

.doc-out,.pack-out{
  width:100%;margin-top:1rem;resize:vertical;white-space:pre-wrap;
  font:400 .88rem/1.85 var(--mono);color:var(--ink);
  background:#FBF6E9;border:1.5px solid rgba(28,26,23,.5);border-radius:2px;padding:1rem 1.1rem}
.doc-out[readonly],.pack-out[readonly]{background:#FBF6E9}
.nextstep{margin-top:1.4rem;display:flex;justify-content:flex-end}
@media (max-width:640px){.tagrow{align-items:flex-start}.evtag{white-space:normal}}

/* ── THE REAL OUTPUT, inside each stage panel ───────────────────────────────────
   The panel is a demo: it shows the SHAPE of the stage. This shows the thing
   itself — one screenshot per stage, from a live run on the product, so the
   desk never has to be believed on its own word. Panels are BONE, so ink for
   words and graphite for the quiet line; the screenshot is a dark object and is
   framed like a print laid on the sheet (four edges, a shadow, no bleed). */
.realshot{
  margin:1.9rem 0 0;padding-top:1.4rem;border-top:1px dashed rgba(28,26,23,.28)}
.realshot figcaption{
  display:flex;flex-wrap:wrap;align-items:baseline;gap:.6rem;margin-bottom:.85rem}
.realshot .rs-tag{
  font:700 .66rem/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;
  color:var(--stamp-ink);border:1px solid var(--stamp-ink);border-radius:2px;padding:.32rem .48rem}
.realshot .rs-case{
  font:700 .68rem/1.5 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--graphite)}
.realshot img{
  display:block;width:100%;height:auto;border-radius:2px;
  box-shadow:0 12px 26px rgba(20,18,16,.4),0 0 0 1px rgba(28,26,23,.35)}
.realshot p{margin-top:.8rem;font-size:.92rem;color:var(--ink-soft);max-width:60ch}