/* World section: /skills/, /events/, /traders/ (wiki/world.py) - three single-page-with-anchors
   sections sharing one stylesheet. Scoped under the three body classes those pages actually carry
   (body.section-skills / body.section-events / body.section-traders - see world.py's module docstring
   for why one shared file can't be named after any single one of those section keys). Reuses the wiki
   tokens from ../wiki.css - contract: apps/hub/wiki/DESIGN.md. Prefix: wo- */

body.section-skills .wo-meta-note,
body.section-events .wk-hero > p,
body.section-traders .wk-hero > p { color: var(--ink-faint); }

/* ---- skills ---- */

body.section-skills .wo-skill-body { display: flex; gap: 12px; align-items: flex-start; }
body.section-skills .wo-skill-body .wk-tile,
body.section-skills .wo-skill-body .wk-tile-fallback {
  flex: 0 0 auto; border: 1px solid var(--rim); border-radius: var(--radius-sm);
}
body.section-skills .wo-skill-text { min-width: 0; flex: 1; }
body.section-skills .wo-skill-desc { color: var(--ink-dim); margin-bottom: 6px; }
body.section-skills .wo-skill-step { color: var(--ink-faint); font-size: .87rem; margin-bottom: 0; }
body.section-skills .wo-meta-note { max-width: 68ch; }

/* ---- events ---- */

body.section-events .wo-event-biomes { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
body.section-events .wo-event-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
body.section-events .wo-event-req { margin: 0 0 6px; font-size: .88rem; color: var(--ink-dim); }
body.section-events .wo-event-req b { color: var(--ink); }

body.section-events .wo-event-quote {
  margin: 4px 0 14px; padding: 10px 14px; border-left: 3px solid var(--ember);
  background: var(--surface-1); border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  color: var(--ink-dim); font-style: italic; font-size: .9rem;
}
body.section-events .wo-event-quote span { display: block; }
body.section-events .wo-event-quote .wo-msg-start { margin-bottom: 4px; }
body.section-events .wo-event-quote .wo-msg-end { color: var(--ink-faint); }

body.section-events .wo-spawn-table { max-width: 640px; }
body.section-events .wo-no-spawns { color: var(--ink-faint); font-size: .88rem; }

/* ---- traders ---- */

body.section-traders .wo-trader-table img { vertical-align: middle; margin-right: 4px; }
body.section-traders .wo-trader-table td:nth-child(2) { white-space: nowrap; }