/* ===================================================================
   shared/item-panel.css — the look of shared/item-panel.js
   ===================================================================
   Sits inside the campaign editor's opened card (.info-scroll), so it
   inherits that panel's type and only paints what is its own. Every
   colour is a theme token: this reads the same on parchment as it does
   in the dark themes.
   =================================================================== */

/* The prose the record was written with, and the rule that separates it
   from the numbers. Same weight of line as .d-lead so an item card and a
   race card open with the same gesture. */
.ip-lead{font-size:15px;line-height:1.65;color:var(--ink);font-style:italic;
  padding-bottom:14px;border-bottom:2px solid var(--crimson);}
.ip-lead p{margin:0 0 9px;}
.ip-lead p:last-child{margin-bottom:0;}

/* ── The statline ──────────────────────────────────────────────────
   One strip of joined cells rather than free-floating tiles: damage and
   its two-handed die are one reading, not two facts that happen to be
   near each other. auto-fit means a record with one cell fills the width
   and a record with four splits it, without either being told how many
   it has. */
.ip-vitals{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));
  background:var(--bark-light);border:1px solid var(--border);border-radius:10px;
  overflow:hidden;margin-top:16px;}
.ip-v{padding:11px 14px;border-right:1px solid var(--border);}
.ip-v:last-child{border-right:none;}
.ip-v-k{font-family:"Cinzel",serif;font-size:9px;font-weight:700;letter-spacing:1.2px;
  text-transform:uppercase;color:var(--gold-dim);}
.ip-v-v{font-family:"Cinzel",serif;font-size:20px;font-weight:700;color:var(--crimson);
  line-height:1.2;margin-top:3px;}
.ip-v-n{font-size:12.5px;color:var(--ink-mid);font-style:italic;}

/* ── Sections ──────────────────────────────────────────────────────
   Deliberately the same rule-and-tab heading the generic detail card
   uses (.d-sec-h), because a card that opens two ways shouldn't look
   like two different apps. */
.ip-sec{margin-top:20px;}
.ip-h{display:flex;align-items:center;gap:10px;font-family:"Cinzel",serif;font-size:11px;
  font-weight:900;letter-spacing:1.8px;text-transform:uppercase;color:var(--crimson);
  margin-bottom:10px;}
.ip-h::before{content:"";width:4px;height:13px;background:var(--crimson);border-radius:2px;flex:none;}
.ip-h::after{content:"";flex:1;height:1px;background:linear-gradient(to right,var(--border),transparent);}

/* A named rule and what it does. The name is held to a column so a run of
   them lines up and can be scanned without reading the explanations. */
.ip-rule{display:flex;gap:12px;align-items:baseline;margin-bottom:8px;}
.ip-rule:last-child{margin-bottom:0;}
.ip-rule-n{font-family:"Cinzel",serif;font-size:10px;font-weight:700;letter-spacing:.7px;
  text-transform:uppercase;color:var(--gold);flex:none;width:96px;text-align:right;padding-top:2px;}
.ip-rule-t{font-size:14px;line-height:1.55;color:var(--ink-mid);flex:1;}
/* A bullet with no "Name — explanation" split is just a line of rules text,
   so it runs the full width instead of leaving an empty name column. */
.ip-line{font-size:14px;line-height:1.6;color:var(--ink-mid);position:relative;
  padding-left:17px;margin-bottom:6px;}
.ip-line:last-child{margin-bottom:0;}
.ip-line::before{content:"";position:absolute;left:2px;top:8px;width:5px;height:5px;
  background:var(--gold-dim);transform:rotate(45deg);border-radius:1px;}

/* A pack's contents. Two columns because fourteen short lines in one is a
   scroll, and break-inside stops a name splitting across the gutter. */
.ip-cols{columns:2;column-gap:26px;}
.ip-cols .ip-line{break-inside:avoid;margin-bottom:4px;}
@media (max-width:700px){.ip-cols{columns:1;}}

/* ── Provenance ────────────────────────────────────────────────────
   Which shelf it came off, and whether what you're reading is still the
   SRD's version of it. Quiet, because it's a footnote. */
.ip-foot{margin-top:18px;padding-top:9px;border-top:1px solid var(--border);
  font-size:12px;color:var(--gold-dim);font-style:italic;}
.ip-foot em{font-style:normal;color:var(--crimson);}

/* ── A table inside the rules text ────────────────────────────────
   Some SRD magic items carry one — which rarity gives which die, what
   each card of a deck does, what each stone is. It is data, so it is
   set upright rather than in the lead's italic, and it scrolls inside
   its own box so a wide one never makes the card scroll sideways. */
.ip-tw{overflow-x:auto;margin:10px 0;border:1px solid var(--border);border-radius:4px;}
.ip-table{border-collapse:collapse;width:100%;font-style:normal;font-size:13px;}
.ip-table th,.ip-table td{text-align:left;padding:5px 10px;
  border-bottom:1px solid var(--border);color:var(--ink-mid);
  font-variant-numeric:tabular-nums;}
.ip-table th{font-family:'Cinzel',serif;font-size:11px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--gold);background:var(--bg-wash);white-space:nowrap;}
.ip-table tbody tr:last-child td{border-bottom:none;}

/* ── Weight ───────────────────────────────────────────────────────
   Beside the name, not in a box: a small weight glyph and the number,
   in the ink every theme keeps for weights. The same badge sits on the
   campaign card, in the creature creator's picker and on the printed
   item sheet, so a weight looks like a weight wherever it is read. */
.ip-weight{display:inline-flex;align-items:center;gap:4px;color:var(--weight-ink);
  font-family:"Cinzel",serif;font-size:12px;font-weight:700;letter-spacing:.4px;
  white-space:nowrap;vertical-align:middle;line-height:1;}
.ip-weight-i{flex:none;display:block;}
.ip-weight-n{font-variant-numeric:tabular-nums;}
/* Next to a big name the badge sits on the name's baseline and steps
   back a little, so it reads as a note on the name and not a second one. */
.info-head .ip-weight,.ipick-detail-name .ip-weight{margin-left:10px;font-size:12.5px;}
.ipick-detail-name .ip-weight{position:relative;top:-2px;}
/* On paper the weight is written in the sheet's brown ink. */
.statblock .ip-weight{color:var(--sheet-ink-mid);font-size:11.5px;}

/* A contents row: the thing on the left, what that many weigh on the
   right, so a column of them can be added up by eye. */
.ip-line{display:flex;align-items:baseline;gap:10px;}
.ip-line-n{flex:1 1 auto;min-width:0;}
.ip-line-q{color:var(--weight-ink);font-weight:700;font-variant-numeric:tabular-nums;}
.ip-line-w{flex:none;color:var(--weight-ink);font-family:"Cinzel",serif;font-size:11px;
  font-weight:700;letter-spacing:.3px;font-variant-numeric:tabular-nums;white-space:nowrap;}
.statblock .ip-line-q,.statblock .ip-line-w{color:var(--sheet-ink-mid);}
