/* Eli Bunyi — Bad Piggies. Per-boss art layer (BUILD-PLAN C6).
   A near-black ground (#1C1612) inside a brass hairline frame, an engraved stripe hatch in two corners, and
   the nine pennant tabs for completed seasons across the top (the 2020 tab in parchment, a tenth
   outlined for Year Ten). Stripe Orange carries numerals; Brass carries secondary type. Nothing
   here is a file, a stamp or a bench; the kit's visual notes only. Every rule is scoped to this
   boss's body; layout primitives, font sizes and volt are untouched.
   Motifs: eli-bunyi/hatch.svg, eli-bunyi/pennants.svg (hand-authored, no text, no faces). */

body[data-manager-slug="eli-bunyi"] {
  --team-field: #1C1612;
  --team-band: #FF6B1A;
  --team-accent: #FF6B1A;
  --team-accent-2: #C9A24A;
  --team-light: #F5EFE4;
  --team-ink: #0A0705;
  --boss-ground: radial-gradient(120% 100% at 72% 4%, rgba(28, 22, 18, .95) 0%, rgba(28, 22, 18, .55) 48%, rgba(12, 13, 16, 0) 80%);
  --boss-motif: url("eli-bunyi/hatch.svg");
  --boss-motif-top: url("eli-bunyi/pennants.svg");
  --boss-brass: rgba(201, 162, 74, .4);
  --boss-rule: rgba(201, 162, 74, .34);
}

/* ---------- hero ground: the black field, the brass double hairline, the corner hatch, the pennant tabs ---------- */
body[data-manager-slug="eli-bunyi"] .pt-b-hero {
  position: relative;
  isolation: isolate;
}
body[data-manager-slug="eli-bunyi"] .pt-b-hero::before {
  content: "";
  position: absolute;
  inset: -32px -24px -24px -24px;
  z-index: -1;
  border-radius: 22px;
  background: var(--boss-motif) center / 1600px auto no-repeat, var(--boss-ground);
  box-shadow: inset 0 0 0 1px var(--boss-brass);
  outline: 1px solid rgba(201, 162, 74, .14);
  outline-offset: -12px;
  pointer-events: none;
}
/* The tabs hang from the panel's top rule, above the eyebrow line (QA, 2026-10-24: at hero height they sat on the eyebrow text). */
body[data-manager-slug="eli-bunyi"] .pt-b-hero::after {
  content: "";
  position: absolute;
  top: -52px;
  left: -24px;
  right: -24px;
  height: 72px;
  z-index: -1;
  background: var(--boss-motif-top) right 24px top / 900px auto no-repeat;
  pointer-events: none;
}

/* ---------- portrait rim: brass on black ---------- */
body[data-manager-slug="eli-bunyi"] .pt-b-portrait {
  border-color: rgba(201, 162, 74, .42);
  box-shadow: 0 0 0 1px rgba(255, 107, 26, .14), 0 30px 60px -30px rgba(28, 22, 18, 1);
}

/* ---------- numerals in Stripe Orange; secondary in Brass; the badge is orange with near-black ink type, #0A0705 (never white on orange) ---------- */
body[data-manager-slug="eli-bunyi"] .pt-b-c-n,
body[data-manager-slug="eli-bunyi"] .pt-b-now-card-n,
body[data-manager-slug="eli-bunyi"] .pt-b-fact-n,
body[data-manager-slug="eli-bunyi"] .pt-b-numeral,
body[data-manager-slug="eli-bunyi"] .pt-b-ch-fig-n { color: var(--team-accent); }
body[data-manager-slug="eli-bunyi"] .pt-eb-ac { color: var(--team-accent); }
body[data-manager-slug="eli-bunyi"] .pt-b-badge-ac { background: var(--team-accent); color: var(--team-ink); }
body[data-manager-slug="eli-bunyi"] .pt-b-ch-eyebrow,
body[data-manager-slug="eli-bunyi"] .pt-b-ch-stamp { color: var(--team-accent-2); }

/* ---------- chapter rules: a brass hairline per chapter head; brass ledger rules; orange win marks ---------- */
body[data-manager-slug="eli-bunyi"] .pt-sec-head,
body[data-manager-slug="eli-bunyi"] .pt-b-ch-head { border-top: 1px solid var(--boss-rule); }
body[data-manager-slug="eli-bunyi"] .pt-b-ch[data-layout="ledger"] tbody tr,
body[data-manager-slug="eli-bunyi"] .pt-b-ch[data-layout="versus"] tbody tr { border-color: rgba(201, 162, 74, .22); }
body[data-manager-slug="eli-bunyi"] .pt-b-ch[data-layout="numerals"] .pt-card,
body[data-manager-slug="eli-bunyi"] .pt-b-ch[data-layout="versus"] .pt-card { border-color: rgba(201, 162, 74, .26); }
body[data-manager-slug="eli-bunyi"] .pt-b-ch .pt-win { color: var(--team-accent); }
body[data-manager-slug="eli-bunyi"] .pt-b-res-w { background: var(--team-accent); color: var(--team-ink); }

/* ---------- motion: the pennant tabs settle from above, the frame fades in; nothing moves under reduced motion ---------- */
@media (prefers-reduced-motion: no-preference) {
  body[data-manager-slug="eli-bunyi"] .pt-b-hero::after { animation: eb-pennants 900ms cubic-bezier(.16, 1, .3, 1) 160ms both; }
  body[data-manager-slug="eli-bunyi"] .pt-b-hero::before { animation: eb-frame 1100ms cubic-bezier(.2, .8, .2, 1) both; }
  @keyframes eb-pennants { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }
  @keyframes eb-frame { from { opacity: 0; } to { opacity: 1; } }
}

@media (max-width: 767px) {
  /* The frame rule sits 8 px above the hero, below the breadcrumb glyphs (their box ends at the hero's top edge),
     and the tabs hang from that rule inside the 20 px band above the portrait (review, 2026-10-24: at -20 px the
     rule crossed the crumb baseline and the tabs crowded it). */
  body[data-manager-slug="eli-bunyi"] .pt-b-hero::before { inset: -8px -16px -16px -16px; border-radius: 16px; background-size: 1100px auto, auto; outline-offset: -8px; }
  body[data-manager-slug="eli-bunyi"] .pt-b-hero::after { top: -18px; left: -16px; right: -16px; height: 32px; background-size: 440px auto; background-position: right 6px top; }
}