/* v13s item page, end of the Overview (js/itemplus.js): Other versions, Timeline, Team notes (ipx-*). The cards themselves are .ip-sec (im-item.css). */
.ipx-n { padding:0 8px; border-radius:999px; background:var(--mist); font-size:12px; font-weight:700; line-height:22px; color:var(--ink-600); }
.ipx-sub { margin:-2px 0 10px; font-size:13px; color:var(--ink-500); }
.ipx-line { font-size:13.5px; line-height:1.5; color:var(--ink-500); }
.ipx-fine { margin-top:10px; font-size:12px; line-height:1.5; color:var(--ink-500); }
.ipx-more { margin-top:10px; font-size:13px; }

/* Other versions: small cards, discontinued ones last and dimmed */
.ipx-vs { display:grid; grid-template-columns:repeat(auto-fill, minmax(230px, 1fr)); gap:8px; }
.ipx-v { display:flex; align-items:flex-start; gap:10px; height:100%; padding:8px 10px 8px 8px; border-radius:16px; background:#fff; box-shadow:inset 0 0 0 1px var(--line); transition:box-shadow .15s, background .15s; }
.ipx-v:hover { box-shadow:inset 0 0 0 1px var(--plum-200); background:var(--plum-50); }
.ipx-v:focus-visible { outline:2px solid var(--plum); outline-offset:2px; }
.ipx-v.is-off { opacity:.62; }
.ipx-v.is-off:hover, .ipx-v.is-off:focus-visible { opacity:1; }
.ipx-v-ph { position:relative; flex:none; width:52px; height:52px; border-radius:12px; overflow:hidden; }
.ipx-v-ph img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; padding:4px; }
.ipx-v-m { display:flex; flex-direction:column; gap:2px; min-width:0; flex:1; }
.ipx-v-n { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; font-size:13.5px; font-weight:700; line-height:1.3; color:var(--ink-900); }
.ipx-v-s { display:flex; flex-wrap:wrap; align-items:center; gap:2px 8px; font-size:12px; color:var(--ink-500); }
.ipx-st { font-weight:700; color:var(--ink-600); }
.ipx-up { font-weight:600; }
.ipx-v-d { display:flex; flex-wrap:wrap; gap:4px; margin-top:3px; }
.ipx-chip { padding:1px 8px; border-radius:999px; background:var(--plum-50); box-shadow:inset 0 0 0 1px var(--plum-100); font-size:12px; font-weight:700; line-height:18px; color:var(--plum); }

/* Timeline */
.ipx-first { display:flex; gap:8px; align-items:flex-start; margin-bottom:10px; padding:9px 12px; border-radius:14px; background:var(--plum-50); box-shadow:inset 0 0 0 1px var(--plum-100); font-size:13px; line-height:1.45; color:var(--ink-700); }
.ipx-first svg { margin-top:2px; color:var(--plum); }
.ipx-tl { display:flex; flex-direction:column; }
.ipx-tr { display:flex; gap:10px; padding:8px 0; border-top:1px solid var(--line); }
.ipx-tr:first-child { border-top:0; padding-top:2px; }
.ipx-ti { display:inline-flex; flex:none; align-items:center; justify-content:center; width:26px; height:26px; border-radius:999px; background:var(--mist); color:var(--ink-500); }
.ipx-ti.is-new { color:var(--leaf); }
.ipx-ti.is-off { color:#A1452E; }
.ipx-tm { display:flex; flex-direction:column; gap:2px; min-width:0; }
.ipx-tw { font-size:13.5px; font-weight:600; line-height:1.4; color:var(--ink-800, #2a2530); overflow-wrap:anywhere; }
.ipx-tw .chg-q { font-weight:600; color:var(--ink-900); quotes:'“' '”'; }
.ipx-tw .chg-dim { font-weight:500; color:var(--ink-500); }
.ipx-tw .chg-file { font-weight:600; color:var(--ink-900); word-break:break-all; }
.ipx-ts { display:flex; flex-wrap:wrap; align-items:center; gap:2px 8px; font-size:12px; color:var(--ink-500); }
.ipx-ts time { font-weight:700; color:var(--ink-600); }
.ipx-src { padding:0 7px; border-radius:999px; background:var(--mist); font-size:11px; font-weight:700; line-height:18px; color:var(--ink-600); white-space:nowrap; }
.ipx-by { min-width:0; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600; color:var(--plum); }

/* Team notes: plain text (white-space keeps the writer's line breaks; never HTML) */
.ipx-nf { display:flex; flex-direction:column; gap:6px; margin-bottom:10px; }
.ipx-ta { min-height:76px; resize:vertical; font-size:15px; line-height:1.45; }
.ipx-nf-b { display:flex; align-items:center; justify-content:flex-end; gap:8px; }
.ipx-cnt { margin-right:auto; font-size:12px; color:var(--ink-400, #8b8590); }
.ipx-cnt.is-near { color:#A1452E; font-weight:700; }
.ipx-notes { display:flex; flex-direction:column; gap:8px; }
.ipx-note { padding:10px 12px; border-radius:14px; background:#FFFBEA; box-shadow:inset 0 0 0 1px #F1E6B8; }
.ipx-nb { white-space:pre-wrap; overflow-wrap:anywhere; font-size:14px; line-height:1.5; color:var(--ink-900); }
.ipx-nm { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:4px 10px; margin-top:6px; font-size:12px; color:var(--ink-500); }
.ipx-nm b { font-weight:700; color:var(--ink-700); overflow-wrap:anywhere; }
.ipx-na { display:flex; gap:12px; }
.ipx-na .ip-a { display:inline-flex; align-items:center; gap:4px; font-size:12.5px; }
.ipx-cf { display:flex; align-items:center; gap:4px; font-weight:600; color:var(--ink-700); }
.ipx-del { color:#A1452E; }
@media (max-width:639px) {
  .ipx-vs { grid-template-columns:1fr; }
  .ipx-v-ph { width:44px; height:44px; }
}
/* team notes never print (the item page printed is not a spec sheet, but notes stay internal all the same) */
@media print { #ip-notes, .ipx-more { display:none !important; } }
