.ivp-page {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 26px;
  min-width: 0;
  min-height: 100%;
  padding: 28px 40px 24px;
  background: #121c19;
  color: #f0f3e9;
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
.ivp-page *, .ivp-page *::before, .ivp-page *::after { box-sizing: border-box; }
.ivp-page :where(h1, h2, h3, h4, p, ul, figure) { margin: 0; }
.ivp-page :where(div, section, figure, li) { min-width: 0; }
.ivp-page ul { list-style: none; padding: 0; }
.ivp-page svg { display: block; flex: 0 0 auto; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.ivp-heading h1 { font-size: 64px; font-weight: 550; line-height: 1.08; letter-spacing: -.055em; }
.ivp-heading h1 span { color: #d0f5a5; }
.ivp-sections { flex: 1; display: grid; grid-template-columns: minmax(0, 2.15fr) minmax(0, 1fr); align-content: center; gap: 52px; }
.ivp-publication { position: relative; }
.ivp-publication::before { content: ''; position: absolute; top: 0; bottom: 0; left: -26px; width: 1px; background: #35483b; }
.ivp-copy { min-height: 70px; }
.ivp-copy h2 { color: #c2b8ff; font-size: 32px; font-weight: 550; line-height: 1.15; letter-spacing: -.04em; }
.ivp-publication .ivp-copy h2 { color: #d0f5a5; font-size: 29px; }
.ivp-copy > p { margin-top: 8px; color: #b9c8b9; font-size: 16px; line-height: 1.4; letter-spacing: -.015em; }
.ivp-example { margin-top: 12px; }
.ivp-group-heading { display: flex; align-items: center; gap: 12px; }
.ivp-avatar { display: block; flex: 0 0 auto; width: 36px; height: 36px; overflow: hidden; border-radius: 50%; }
.ivp-avatar svg { width: 100%; height: 100%; stroke: none; }
.ivp-distribution { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 10px 0; color: #d0f5a5; }
.ivp-distribution-ai { color: #c2b8ff; }
.ivp-feature { display: flex; align-items: center; gap: 7px; font-size: 14px; font-weight: 500; line-height: 22px; }
.ivp-feature > svg { width: 17px; height: 17px; }
.ivp-distribution .ivp-flow-arrow { width: 20px; height: 24px; stroke-width: 1.5; }

/* A short list applies to every selected group. */
.ivp-decoration-summary { display: grid; grid-template-columns: minmax(0, 1fr) 48px minmax(0, 1fr); align-items: center; gap: 28px; margin-top: 54px; padding-right: 28px; }
.ivp-page .ivp-decoration-list { position: relative; display: grid; gap: 28px; padding: 12px 36px 12px 0; }
.ivp-decoration-list::after { content: ''; position: absolute; top: 0; right: 0; bottom: 0; width: 22px; border: 1px solid #817797; border-left: 0; border-radius: 0 14px 14px 0; }
.ivp-decoration-list li { font-size: 54px; font-weight: 550; line-height: 1.15; letter-spacing: -.045em; }
.ivp-decoration-arrow { color: #9c8eb5; font-size: 46px; font-weight: 300; line-height: 1; text-align: center; }
.ivp-decoration-target { font-size: 39px; font-weight: 500; line-height: 1.2; letter-spacing: -.04em; }
.ivp-decoration-target span { color: #c2b8ff; }

.ivp-posts { padding: 4px 18px; border: 1px solid #3d5142; border-radius: 13px; background: #1a2821; }
.ivp-post { display: grid; grid-template-columns: 19px minmax(0, 1fr); gap: 7px 10px; align-items: center; padding: 19px 0; }
.ivp-post + .ivp-post { border-top: 1px solid #3a4d3f; }
.ivp-post-link { color: #91a68c; }
.ivp-post-link svg { width: 19px; height: 19px; }
.ivp-post h3 { font-size: 17px; font-weight: 500; line-height: 1.35; letter-spacing: -.025em; }
.ivp-when { grid-column: 2; justify-self: start; display: flex; align-items: center; gap: 6px; padding: 5px 8px; border-radius: 6px; background: #333344; color: #e0d9ff; font-size: 12px; line-height: 1.4; white-space: nowrap; }
.ivp-when svg { width: 15px; height: 15px; }
.ivp-now { background: #314732; color: #d0f5a5; }
.ivp-publication .ivp-distribution { padding: 17px 0; }
.ivp-destinations { display: grid; gap: 10px; }
.ivp-destination { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 15px 16px; border: 1px solid #3a503c; border-radius: 11px; background: #1b2a20; }
.ivp-group-heading { gap: 10px; }
.ivp-group-heading .ivp-avatar { width: 32px; height: 32px; }
.ivp-group-heading h3 { font-size: 17px; font-weight: 550; line-height: 1.25; letter-spacing: -.025em; }
.ivp-recipient-check { color: #b3da91; }
.ivp-recipient-check svg { width: 18px; height: 18px; }
.ivp-publication figcaption { margin-top: 15px; color: #a8b9a2; font-size: 13px; line-height: 1.5; text-align: center; }

@container reader (max-width: 1300px) {
  .ivp-page { padding: 24px 28px 20px; gap: 22px; }
  .ivp-heading h1 { font-size: clamp(43px, 5.1cqw, 60px); }
  .ivp-sections { grid-template-columns: minmax(0, 2.15fr) minmax(0, 1fr); gap: 32px; }
  .ivp-publication::before { left: -16px; }
  .ivp-copy { min-height: 68px; }
  .ivp-copy h2 { font-size: 27px; }
  .ivp-publication .ivp-copy h2 { font-size: 25px; }
  .ivp-copy > p { font-size: 14px; }
  .ivp-example { margin-top: 10px; }
  .ivp-distribution { padding: 8px 0; }
  .ivp-decoration-summary { grid-template-columns: minmax(0, 1fr) 32px minmax(0, 1fr); gap: 16px; margin-top: 42px; padding-right: 8px; }
  .ivp-page .ivp-decoration-list { gap: 26px; }
  .ivp-decoration-list li { font-size: 40px; }
  .ivp-decoration-arrow { font-size: 34px; }
  .ivp-decoration-target { font-size: 31px; }
  .ivp-posts { padding: 4px 14px; }
  .ivp-post { padding: 17px 0; }
  .ivp-post h3 { font-size: 15px; }
  .ivp-publication .ivp-distribution { gap: 8px; }
  .ivp-feature { font-size: 13px; }
  .ivp-destination { padding: 13px; }
  .ivp-group-heading .ivp-avatar { width: 28px; height: 28px; }
  .ivp-group-heading h3 { font-size: 15px; }
  .ivp-publication figcaption { font-size: 12px; }
}

@container reader (max-width: 900px) {
  .ivp-page { padding: 28px; gap: 32px; }
  .ivp-heading h1 { font-size: clamp(40px, 6.2cqw, 54px); }
  .ivp-sections { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  .ivp-section { width: 100%; max-width: 760px; justify-self: center; }
  .ivp-copy { min-height: 0; }
  .ivp-copy h2, .ivp-publication .ivp-copy h2 { font-size: 30px; }
  .ivp-copy > p { font-size: 16px; }
  .ivp-example { margin-top: 20px; }
  .ivp-decoration-summary { margin-top: 32px; }
  .ivp-publication { padding-top: 30px; border-top: 1px solid #3b4c40; }
  .ivp-publication::before { display: none; }
  .ivp-post h3, .ivp-group-heading h3 { font-size: 17px; }
  .ivp-publication figcaption { font-size: 13px; }
}

@container reader (max-width: 600px) {
  .ivp-page { padding: 26px 20px 30px; gap: 30px; }
  .ivp-heading h1 { font-size: clamp(33px, 9.1cqw, 44px); line-height: 1.1; }
  .ivp-copy h2, .ivp-publication .ivp-copy h2 { font-size: 28px; }
  .ivp-distribution { padding: 11px 0; }
  .ivp-feature { font-size: 14px; }
  .ivp-decoration-summary { grid-template-columns: minmax(0, 1fr); gap: 18px; padding-right: 0; }
  .ivp-page .ivp-decoration-list { gap: 16px; padding: 0; }
  .ivp-decoration-list::after { display: none; }
  .ivp-decoration-list li { font-size: 42px; }
  .ivp-decoration-arrow { justify-self: start; transform: rotate(90deg); }
  .ivp-decoration-target { font-size: 30px; }
  .ivp-decoration-target br { display: none; }
  .ivp-post { padding: 18px 0; }
  .ivp-group-heading .ivp-avatar { width: 32px; height: 32px; }
  .ivp-publication figcaption br { display: none; }
}