/* IvoryPen: ivory paper, black ink, one emerald accent. Literata (reading) + Familjen Grotesk (interface). Prefix ip- */
:root {
  --bg: #faf7ef;
  --paper: #fffdf8;
  --sunk: #f3eee2;
  --sunk-2: #ece5d5;
  --ink: #16150f;
  --ink-2: #45423a;
  --ink-3: #66625a;
  --line: #e6dfcf;
  --line-2: #d6ccb6;
  --em: #0b7a53;
  --em-ink: #075c3e;
  --em-tint: #e3f0e7;
  --em-hl: #c9ead6;
  --warn: #8a4b0c;
  --warn-tint: #fbefd9;
  --serif: 'Literata', Georgia, 'Times New Roman', serif;
  --sans: 'Familjen Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --r: 14px;
  --r-lg: 22px;
  --pill: 999px;
  --wrap: 1200px;
  --col: 700px;
  --shadow: 0 1px 2px rgba(22, 21, 15, .05), 0 8px 24px -12px rgba(22, 21, 15, .14);
  --shadow-lg: 0 2px 4px rgba(22, 21, 15, .04), 0 30px 60px -28px rgba(22, 21, 15, .32);
  --ease: cubic-bezier(.2, .7, .2, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 84px; }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font: 400 16px/1.55 var(--sans); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 3px; }
h1, h2, h3, h4 { margin: 0; font-weight: 600; }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; }
:focus-visible { outline: 2.5px solid var(--em); outline-offset: 3px; border-radius: 6px; }
.ip-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.ip-ic { width: 1.15em; height: 1.15em; flex: none; }
.ip-wrap { width: 100%; max-width: var(--wrap); margin: 0 auto; padding: 0 32px; }
.ip-col { width: 100%; max-width: calc(var(--col) + 48px); margin: 0 auto; padding: 0 24px; }

.ip-skip { position: absolute; left: 16px; top: -60px; z-index: 50; background: var(--ink); color: var(--paper); padding: 10px 16px; border-radius: var(--pill); font-weight: 600; text-decoration: none; }
.ip-skip:focus { top: 12px; }
.ip-main { display: block; outline: none; min-height: 60vh; }

/* ── Buttons, pills ── */
.ip-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 9px 18px;
  border-radius: var(--pill); border: 1.5px solid transparent; font: 600 15px/1.1 var(--sans); letter-spacing: .005em;
  text-decoration: none; cursor: pointer; white-space: nowrap; transition: background .18s var(--ease), color .18s, border-color .18s, transform .18s var(--ease);
}
.ip-btn:active { transform: translateY(1px); }
.ip-btn--primary { background: var(--em); color: #fff; }
.ip-btn--primary:hover { background: var(--em-ink); }
.ip-btn--ink { background: var(--ink); color: var(--paper); }
.ip-btn--ink:hover { background: #2d2b22; }
.ip-btn--ghost { background: transparent; color: var(--ink); border-color: var(--line-2); }
.ip-btn--ghost:hover { border-color: var(--ink); background: var(--paper); }
.ip-btn--soft { background: var(--em-tint); color: var(--em-ink); }
.ip-btn--soft:hover { background: var(--em-hl); }
.ip-btn--line { color: var(--paper); border-color: rgba(250, 247, 239, .45); }
.ip-btn--line:hover { border-color: var(--paper); background: rgba(250, 247, 239, .08); }
.ip-btn--lg { min-height: 50px; padding: 12px 24px; font-size: 16px; }
.ip-btn--block { width: 100%; }
.ip-pill {
  display: inline-flex; align-items: center; padding: 4px 11px; border-radius: var(--pill); background: var(--em-tint); color: var(--em-ink);
  font: 600 12.5px/1.3 var(--sans); letter-spacing: .02em; text-decoration: none; white-space: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis;
}
.ip-pill:hover { background: var(--em-hl); }
.ip-kicker { display: inline-flex; align-items: center; gap: 8px; font: 600 13px/1.2 var(--sans); letter-spacing: .09em; text-transform: uppercase; color: var(--em-ink); }
.ip-kicker span { font-variant-numeric: tabular-nums; color: var(--ink-3); }
.ip-kicker--light { color: #9fdcbd; }
.ip-name { font-weight: 600; color: var(--ink); text-decoration: none; }
a.ip-name:hover { text-decoration: underline; }
.ip-handle { color: var(--ink-3); font-size: .94em; }
.ip-handle--lg { font-size: 16px; margin-top: 2px; }
.ip-dotsep { color: var(--line-2); margin: 0 7px; }
.ip-count { display: inline-flex; align-items: center; justify-content: center; min-width: 26px; height: 22px; padding: 0 7px; border-radius: var(--pill); background: var(--sunk); color: var(--ink-2); font: 600 12.5px/1 var(--sans); font-variant-numeric: tabular-nums; }
.ip-av { border-radius: 50%; object-fit: cover; background: var(--sunk); flex: none; }

/* ── App bar ── */
.ip-bar { position: sticky; top: 0; z-index: 20; background: rgba(250, 247, 239, .9); backdrop-filter: saturate(1.4) blur(12px); -webkit-backdrop-filter: saturate(1.4) blur(12px); border-bottom: 1px solid var(--line); }
.ip-bar__in { max-width: var(--wrap); margin: 0 auto; padding: 0 32px; height: 66px; display: flex; align-items: center; gap: 20px; }
.ip-brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ink); }
.ip-mark { flex: none; }
.ip-brand__word { font: 600 23px/1 var(--serif); letter-spacing: -.02em; }
.ip-brand__word em { font-style: italic; color: var(--em); font-weight: 600; }
.ip-nav { margin-left: auto; display: flex; align-items: center; gap: 4px; }
.ip-nav__a { display: inline-flex; align-items: center; gap: 7px; padding: 9px 14px; border-radius: var(--pill); color: var(--ink-2); font-weight: 500; font-size: 15px; text-decoration: none; transition: background .15s, color .15s; }
.ip-nav__a:hover { background: var(--sunk); color: var(--ink); }
.ip-nav__a[aria-current="page"] { color: var(--ink); background: var(--paper); box-shadow: inset 0 0 0 1px var(--line); }
.ip-nav__a[aria-current="page"] .ip-ic { color: var(--em); }
.ip-nav__signin { margin-left: 10px; min-height: 40px; }
.ip-menu { display: none; margin-left: auto; align-items: center; gap: 6px; min-height: 40px; padding: 8px 14px; border-radius: var(--pill); border: 1.5px solid var(--line-2); background: var(--paper); color: var(--ink); font: 600 14px/1 var(--sans); cursor: pointer; }

/* ── Footer ── */
.ip-foot { margin-top: 96px; background: var(--ink); color: #d9d4c6; }
.ip-foot__in { max-width: var(--wrap); margin: 0 auto; padding: 64px 32px 40px; display: grid; grid-template-columns: 1.2fr 1.5fr; gap: 48px; }
.ip-brand--foot { color: var(--paper); }
.ip-brand--foot .ip-brand__word em { color: #6fd0a2; }
.ip-foot__brand > p { margin-top: 16px; max-width: 360px; color: #bdb7a8; font-size: 15px; }
.ip-foot__rss { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.ip-foot__rss a { display: inline-flex; align-items: center; gap: 7px; color: #f2eee4; font-weight: 600; text-decoration: none; }
.ip-foot__rss a:hover { color: #6fd0a2; }
.ip-foot__rss .ip-ic { color: #6fd0a2; }
.ip-foot__nav { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.ip-foot__h { font: 600 12.5px/1 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: #8f897b; margin-bottom: 16px; }
.ip-foot__col ul { list-style: none; display: grid; gap: 10px; }
.ip-foot__col a { color: #f2eee4; text-decoration: none; font-size: 15px; }
.ip-foot__col a:hover { color: #6fd0a2; text-decoration: underline; }
.ip-foot__base { max-width: var(--wrap); margin: 0 auto; padding: 20px 32px 28px; border-top: 1px solid #333128; display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; color: #a19b8c; font-size: 14px; }
.ip-main--home + .ip-foot { margin-top: 0; }

/* ── Hero (landing) ── */
.ip-hero { position: relative; padding: 72px 0 88px; overflow: hidden; }
.ip-hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(60% 60% at 85% 20%, rgba(11, 122, 83, .09), transparent 70%), repeating-linear-gradient(0deg, transparent 0 35px, rgba(22, 21, 15, .035) 35px 36px); pointer-events: none; }
.ip-hero__grid { position: relative; display: grid; grid-template-columns: 1.05fr .95fr; gap: 64px; align-items: center; }
.ip-eyebrow { display: inline-flex; align-items: center; gap: 10px; padding: 7px 14px 7px 10px; border-radius: var(--pill); background: var(--paper); box-shadow: inset 0 0 0 1px var(--line); font: 600 14px/1 var(--sans); color: var(--ink-2); }
.ip-eyebrow__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--em); box-shadow: 0 0 0 4px var(--em-tint); }
.ip-hero__title { margin-top: 24px; font: 600 clamp(42px, 5.6vw, 74px)/1.02 var(--serif); letter-spacing: -.035em; text-wrap: balance; }
.ip-hl { font-style: italic; background: linear-gradient(transparent 62%, var(--em-hl) 62% 92%, transparent 92%); padding: 0 .06em; }
.ip-hero__lede { margin-top: 24px; max-width: 540px; font: 400 19px/1.6 var(--sans); color: var(--ink-2); }
.ip-hero__ctas { margin-top: 32px; display: flex; flex-wrap: wrap; gap: 12px; }
.ip-hero__facts { margin-top: 36px; list-style: none; display: flex; flex-wrap: wrap; gap: 10px 24px; color: var(--ink-2); font-size: 15px; font-weight: 500; }
.ip-hero__facts li { display: inline-flex; align-items: center; gap: 8px; }
.ip-hero__facts .ip-ic { color: var(--em); }
.ip-hero__visual { position: relative; padding: 0 0 56px 56px; }
.ip-hero__photo { margin: 0; border-radius: var(--r-lg); overflow: hidden; aspect-ratio: 4 / 4.4; box-shadow: var(--shadow-lg); background: var(--sunk); }
.ip-hero__photo img { width: 100%; height: 100%; object-fit: cover; }
.ip-signin {
  position: absolute; left: 0; bottom: 0; width: min(360px, 82%); padding: 24px; border-radius: var(--r-lg); background: var(--paper);
  box-shadow: var(--shadow-lg), inset 0 0 0 1px var(--line); display: grid; gap: 14px;
}
.ip-signin__top { display: flex; align-items: center; gap: 12px; margin-bottom: 2px; }
.ip-signin__top h2 { font: 600 19px/1.2 var(--serif); letter-spacing: -.01em; }
.ip-signin__top p { color: var(--ink-3); font-size: 14px; }
.ip-signin__note { display: flex; align-items: flex-start; gap: 8px; font-size: 14px; color: var(--ink-2); }
.ip-signin__note .ip-ic { color: var(--em); margin-top: 1px; }
.ip-signin__note a { color: var(--em-ink); font-weight: 600; }

/* ── Fields ── */
.ip-field { display: grid; gap: 6px; }
.ip-field label { font: 600 14px/1.2 var(--sans); color: var(--ink); }
.ip-input {
  width: 100%; min-height: 46px; padding: 11px 14px; border-radius: 12px; border: 1.5px solid var(--line-2); background: #fff; color: var(--ink);
  font: 400 16px/1.4 var(--sans); transition: border-color .15s, box-shadow .15s;
}
.ip-input::placeholder { color: #8a857a; }
.ip-input:hover { border-color: #b9ae96; }
.ip-input:focus { outline: none; border-color: var(--em); box-shadow: 0 0 0 4px rgba(11, 122, 83, .16); }
.ip-input--area { min-height: 120px; resize: vertical; line-height: 1.55; }
.ip-select { position: relative; }
.ip-select select { appearance: none; -webkit-appearance: none; padding-right: 42px; cursor: pointer; }
.ip-select::after { content: ""; position: absolute; right: 17px; top: 50%; width: 8px; height: 8px; border-right: 2px solid var(--ink-2); border-bottom: 2px solid var(--ink-2); transform: translateY(-70%) rotate(45deg); pointer-events: none; }
.ip-hint { font-size: 14px; color: var(--ink-3); }
.ip-hp { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }

/* ── Landing sections ── */
.ip-sect { padding: 96px 0; }
.ip-sect__head { max-width: 720px; margin-bottom: 56px; }
.ip-sect__head h2 { margin-top: 14px; font: 600 clamp(32px, 3.6vw, 46px)/1.1 var(--serif); letter-spacing: -.03em; text-wrap: balance; }
.ip-sect__head > p:last-child:not(.ip-kicker) { margin-top: 16px; font-size: 18px; color: var(--ink-2); }
.ip-sect__head--row { max-width: none; display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.ip-sect--rows { background: var(--paper); border-block: 1px solid var(--line); }
.ip-row { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: center; padding: 40px 0; }
.ip-row + .ip-row { border-top: 1px dashed var(--line-2); }
.ip-row--flip .ip-row__text { order: 2; }
.ip-row__text h3 { margin-top: 14px; font: 600 30px/1.18 var(--serif); letter-spacing: -.02em; }
.ip-row__text > p { margin-top: 14px; font-size: 17px; color: var(--ink-2); max-width: 480px; }
.ip-ticks { list-style: none; margin-top: 22px; display: grid; gap: 10px; }
.ip-ticks li { display: flex; align-items: center; gap: 10px; font-weight: 500; }
.ip-ticks .ip-ic { color: var(--em); background: var(--em-tint); border-radius: 50%; padding: 3px; width: 24px; height: 24px; }
.ip-row__mock { display: flex; justify-content: center; }

/* Mock UI (decorative skeletons, no data) */
.ip-mock { width: 100%; max-width: 440px; background: var(--bg); border-radius: var(--r-lg); padding: 22px; box-shadow: var(--shadow-lg), inset 0 0 0 1px var(--line); display: grid; gap: 12px; }
.ip-sk { display: block; height: 11px; border-radius: 6px; background: var(--sunk-2); }
.ip-sk--h { height: 16px; width: 62%; background: #d9cfba; }
.ip-sk--s { width: 38%; }
.ip-sk--m { width: 78%; }
.ip-mock--profile { padding: 0 0 22px; overflow: hidden; }
.ip-mock--profile > :not(.ip-mock__cover) { margin-inline: 22px; }
.ip-mock__cover { height: 92px; background: linear-gradient(120deg, #16150f 0%, #23392e 55%, #0b7a53 100%); }
.ip-mock__row { display: flex; align-items: flex-end; justify-content: space-between; margin-top: -34px; }
.ip-mock__av { width: 72px; height: 72px; border-radius: 50%; background: #e6d9bd; box-shadow: 0 0 0 4px var(--bg); }
.ip-mock__pill { display: inline-flex; align-items: center; gap: 6px; padding: 7px 13px; border-radius: var(--pill); background: var(--em); color: #fff; font: 600 13px/1 var(--sans); }
.ip-mock__tabs { display: flex; gap: 18px; border-bottom: 1px solid var(--line); font: 600 13.5px/1 var(--sans); color: var(--ink-3); }
.ip-mock__tabs span { padding: 10px 0; }
.ip-mock__tabs .is-on { color: var(--ink); box-shadow: inset 0 -2px 0 var(--em); }
.ip-mock__post { display: grid; grid-template-columns: 1fr 72px; grid-template-rows: auto auto; gap: 10px 16px; align-items: center; }
.ip-mock__thumb { grid-column: 2; grid-row: 1 / 3; height: 56px; border-radius: 10px; background: linear-gradient(135deg, #e7dcc4, #cdbf9f); }
.ip-mock__story { padding: 16px; border-radius: var(--r); background: var(--paper); box-shadow: inset 0 0 0 1px var(--line); display: grid; gap: 10px; }
.ip-mock__label { display: flex; align-items: center; gap: 8px; font: 600 14px/1 var(--sans); margin-top: 4px; }
.ip-mock__label .ip-ic { color: var(--em); }
.ip-mock__resp { position: relative; display: grid; grid-template-columns: 34px 1fr; gap: 12px; }
.ip-mock__resp > div { display: grid; gap: 8px; align-content: center; padding: 12px 14px; border-radius: 4px 14px 14px 14px; background: var(--paper); box-shadow: inset 0 0 0 1px var(--line); }
.ip-mock__resp--author > div { background: var(--em-tint); box-shadow: none; }
.ip-mock__ini { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--sunk-2); font: 600 14px/1 var(--sans); color: var(--ink-2); }
.ip-mock__ini.is-em { background: var(--em); color: #fff; }
.ip-mock__badge { justify-self: start; padding: 3px 9px; border-radius: var(--pill); background: var(--em); color: #fff; font: 600 11.5px/1.1 var(--sans); }
.ip-mock__quote { margin: 6px 0; font: italic 500 23px/1.4 var(--serif); letter-spacing: -.01em; }
.ip-mock__quote mark, .ip-quote__q mark { background: linear-gradient(transparent 8%, var(--em-hl) 8% 92%, transparent 92%); color: inherit; padding: 0 .1em; -webkit-box-decoration-break: clone; box-decoration-break: clone; }

.ip-feats { list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.ip-feat { padding: 26px; border-radius: var(--r-lg); background: var(--paper); box-shadow: inset 0 0 0 1px var(--line); transition: box-shadow .2s, transform .2s var(--ease); }
.ip-feat:hover { box-shadow: var(--shadow), inset 0 0 0 1px var(--line-2); transform: translateY(-2px); }
.ip-feat__ic { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: var(--em-tint); color: var(--em-ink); }
.ip-feat h3 { margin-top: 18px; font: 600 19px/1.25 var(--serif); }
.ip-feat p { margin-top: 8px; color: var(--ink-2); font-size: 15.5px; }

.ip-band { padding-top: 24px; }
.ip-band__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: center; }
.ip-band__photo { margin: 0; border-radius: var(--r-lg); overflow: hidden; aspect-ratio: 5 / 4; background: var(--sunk); box-shadow: var(--shadow-lg); }
.ip-band__photo img { width: 100%; height: 100%; object-fit: cover; }
.ip-band__text h2 { margin-top: 14px; font: 600 clamp(30px, 3.2vw, 42px)/1.12 var(--serif); letter-spacing: -.03em; }
.ip-steps { list-style: none; margin-top: 32px; display: grid; gap: 22px; }
.ip-steps li { display: grid; grid-template-columns: 44px 1fr; gap: 16px; }
.ip-steps li > span { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--ink); color: var(--paper); font: 600 17px/1 var(--serif); }
.ip-steps h3 { font: 600 19px/1.3 var(--serif); margin-top: 2px; }
.ip-steps p { margin-top: 4px; color: var(--ink-2); }

.ip-quote { padding: 40px 0 96px; text-align: center; }
.ip-quote__q { margin: 0 auto; max-width: 880px; }
.ip-quote__q p { font: 400 clamp(26px, 3.2vw, 40px)/1.35 var(--serif); letter-spacing: -.02em; text-wrap: balance; }
.ip-quote__q mark { font-style: italic; font-weight: 600; }
.ip-quote__by { margin-top: 22px; font: 600 14px/1 var(--sans); letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); }
.ip-quote__by::before { content: ""; display: inline-block; width: 28px; height: 2px; background: var(--em); vertical-align: middle; margin-right: 12px; }

.ip-cta { padding: 0 0 96px; }
.ip-cta__card { display: grid; grid-template-columns: 1.15fr .85fr; border-radius: 28px; overflow: hidden; background: var(--ink); color: var(--paper); box-shadow: var(--shadow-lg); }
.ip-cta__text { padding: 64px; }
.ip-cta__text h2 { margin-top: 14px; font: 600 clamp(32px, 3.6vw, 46px)/1.08 var(--serif); letter-spacing: -.03em; }
.ip-cta__text > p { margin-top: 16px; color: #cfc9ba; font-size: 18px; max-width: 460px; }
.ip-cta__btns { margin-top: 32px; display: flex; flex-wrap: wrap; gap: 12px; }
.ip-cta__photo { margin: 0; min-height: 100%; background: #2a2820; }
.ip-cta__photo img { width: 100%; height: 100%; object-fit: cover; }

/* ── Social post cards ── */
.ip-card { padding: 22px 24px 16px; border-radius: var(--r-lg); background: var(--paper); box-shadow: inset 0 0 0 1px var(--line); transition: box-shadow .2s; }
.ip-card + .ip-card { margin-top: 16px; }
.ip-card:hover { box-shadow: var(--shadow), inset 0 0 0 1px var(--line-2); }
.ip-card__who { display: flex; align-items: center; gap: 10px; min-width: 0; }
.ip-card__av { flex: none; line-height: 0; }
.ip-card__av img { width: 36px; height: 36px; }
.ip-card__by { min-width: 0; flex: 1; font-size: 14.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--ink-3); }
.ip-card__by .ip-handle { margin-left: 6px; }
.ip-date { color: var(--ink-3); }
.ip-card__body { margin-top: 14px; display: grid; grid-template-columns: 1fr 168px; gap: 24px; align-items: start; }
.ip-card--text .ip-card__body { grid-template-columns: 1fr; }
.ip-card__title { font: 700 22px/1.28 var(--serif); letter-spacing: -.018em; text-wrap: pretty; overflow-wrap: anywhere; }
.ip-card__title a { text-decoration: none; }
.ip-card__title a:hover { text-decoration: underline; text-decoration-color: var(--em); text-decoration-thickness: 2px; }
.ip-card__ex { margin-top: 8px; color: var(--ink-2); font: 400 16px/1.55 var(--serif); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.ip-card__thumb { display: block; aspect-ratio: 3 / 2; border-radius: 12px; overflow: hidden; background: var(--sunk); }
.ip-card__thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s var(--ease); }
.ip-card:hover .ip-card__thumb img { transform: scale(1.03); }
.ip-card__acts { margin-top: 14px; padding-top: 10px; border-top: 1px solid var(--line); display: flex; align-items: center; flex-wrap: wrap; gap: 4px 6px; }
.ip-act { display: inline-flex; align-items: center; gap: 7px; min-height: 36px; padding: 6px 12px; margin-left: -4px; border-radius: var(--pill); color: var(--ink-2); font: 500 14.5px/1 var(--sans); text-decoration: none; }
a.ip-act:hover { background: var(--em-tint); color: var(--em-ink); }
.ip-act--read { color: var(--ink); font-weight: 600; }
.ip-act--meta { color: var(--ink-3); }
.ip-card__tags { margin-left: auto; display: inline-flex; gap: 4px; flex-wrap: wrap; }
.ip-tag { padding: 5px 9px; border-radius: var(--pill); color: var(--em-ink); font: 500 14px/1 var(--sans); text-decoration: none; }
.ip-tag:hover { background: var(--em-tint); }
.ip-empty { display: flex; align-items: center; gap: 12px; padding: 28px; border-radius: var(--r-lg); border: 1.5px dashed var(--line-2); color: var(--ink-2); }
.ip-empty .ip-ic { color: var(--em); width: 24px; height: 24px; }

/* ── Profile ── */
.ip-cover { height: 260px; background: var(--sunk); overflow: hidden; position: relative; }
.ip-cover img { width: 100%; height: 100%; object-fit: cover; }
.ip-cover--plain { background: radial-gradient(70% 120% at 85% 10%, rgba(111, 208, 162, .35), transparent 60%), linear-gradient(115deg, #16150f 0%, #1f2f27 50%, #0b7a53 130%); }
.ip-cover--plain[data-h="1"] { background: radial-gradient(60% 120% at 15% 0%, rgba(111, 208, 162, .3), transparent 60%), linear-gradient(200deg, #16150f 10%, #213a2f 70%, #0b7a53 140%); }
.ip-cover--plain[data-h="2"] { background: repeating-linear-gradient(0deg, transparent 0 27px, rgba(250, 247, 239, .06) 27px 28px), linear-gradient(115deg, #0a5c3e, #16150f); }
.ip-cover--plain[data-h="3"] { background: radial-gradient(50% 90% at 50% 120%, rgba(111, 208, 162, .4), transparent 70%), linear-gradient(180deg, #16150f, #1c2c24); }
.ip-cover__mark { position: absolute; right: 6%; bottom: -26px; font: italic 600 180px/1 var(--serif); color: rgba(250, 247, 239, .07); letter-spacing: -.04em; }
.ip-prof { background: var(--paper); border-bottom: 1px solid var(--line); }
.ip-prof__in { position: relative; }
.ip-prof__top { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-top: -66px; }
.ip-prof__av { width: 132px; height: 132px; border-radius: 50%; object-fit: cover; background: var(--sunk); box-shadow: 0 0 0 5px var(--paper), var(--shadow); position: relative; }
.ip-prof__cta { display: flex; gap: 10px; flex-wrap: wrap; padding-bottom: 6px; }
.ip-prof__id { margin-top: 18px; max-width: 760px; }
.ip-prof__name { font: 700 clamp(30px, 3.6vw, 42px)/1.1 var(--serif); letter-spacing: -.03em; }
.ip-prof__name a { text-decoration: none; }
.ip-prof__name a:hover { text-decoration: underline; }
.ip-prof__bio { margin-top: 14px; font: 400 18px/1.55 var(--serif); color: var(--ink); max-width: 640px; }
.ip-facts { list-style: none; margin-top: 14px; display: flex; flex-wrap: wrap; gap: 8px 20px; color: var(--ink-2); font-size: 15px; }
.ip-facts li { display: inline-flex; align-items: center; gap: 7px; min-width: 0; }
.ip-facts .ip-ic { color: var(--ink-3); }
.ip-facts a { color: var(--em-ink); font-weight: 600; text-decoration: none; overflow-wrap: anywhere; }
.ip-facts a:hover { text-decoration: underline; }
.ip-stats { margin: 22px 0 0; display: flex; flex-wrap: wrap; gap: 10px 36px; }
.ip-stats div { display: flex; flex-direction: column-reverse; gap: 2px; }
.ip-stats dt { font-size: 14px; color: var(--ink-3); }
.ip-stats dd { margin: 0; font: 700 22px/1.2 var(--serif); font-variant-numeric: tabular-nums; }
.ip-tabs { margin-top: 26px; display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
.ip-tabs::-webkit-scrollbar { display: none; }
.ip-tabs a { flex: none; padding: 14px 6px 13px; margin-right: 18px; color: var(--ink-3); font: 600 15.5px/1 var(--sans); text-decoration: none; border-bottom: 2.5px solid transparent; }
.ip-tabs a:hover { color: var(--ink); }
.ip-tabs a[aria-current="page"] { color: var(--ink); border-bottom-color: var(--em); }

.ip-cols { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 48px; align-items: start; padding-top: 40px; }
.ip-feed { min-width: 0; }
.ip-feed__h { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 18px; font: 600 15px/1 var(--sans); letter-spacing: .09em; text-transform: uppercase; color: var(--ink-2); }
.ip-feed__sub { font-size: 13.5px; letter-spacing: 0; text-transform: none; color: var(--ink-3); font-weight: 500; }
.ip-feed__intro { margin-bottom: 24px; }
.ip-feed__title { margin-top: 10px; font: 700 clamp(30px, 3.4vw, 40px)/1.12 var(--serif); letter-spacing: -.03em; }
.ip-feed__meta { margin-top: 8px; color: var(--ink-2); }
.ip-feed__meta a { color: var(--em-ink); font-weight: 600; }
.ip-pin { margin-bottom: 16px; padding: 22px 24px; border-radius: var(--r-lg); background: var(--em-tint); box-shadow: inset 0 0 0 1px #c3e2cf; }
.ip-pin__lab { display: flex; align-items: center; gap: 8px; color: var(--em-ink); font: 600 14px/1 var(--sans); margin-bottom: 12px; }
.ip-side { display: grid; gap: 16px; position: sticky; top: 88px; }
.ip-box { padding: 22px; border-radius: var(--r-lg); background: var(--paper); box-shadow: inset 0 0 0 1px var(--line); }
.ip-box__h { font: 600 13.5px/1 var(--sans); letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 14px; }
.ip-box__who { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.ip-box__who img { width: 44px; height: 44px; }
.ip-box__bio { color: var(--ink-2); font-size: 15.5px; }
.ip-box .ip-facts { flex-direction: column; gap: 8px; margin: 14px 0 18px; }
.ip-box > .ip-btn { margin-top: 16px; }
.ip-box .ip-facts + .ip-btn { margin-top: 0; }
.ip-catlist { list-style: none; display: grid; gap: 2px; margin: 0 -10px; }
.ip-catlist a { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 10px; border-radius: 10px; text-decoration: none; font-weight: 500; }
.ip-catlist a:hover { background: var(--sunk); }
.ip-catlist a[aria-current="page"] { background: var(--em-tint); color: var(--em-ink); }

.ip-pager { margin-top: 28px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ip-pager__n { color: var(--ink-3); font-size: 14.5px; font-variant-numeric: tabular-nums; }
.ip-pager__gap { min-width: 100px; }

/* ── Topic header ── */
.ip-topic { padding: 56px 0 44px; background: var(--paper); border-bottom: 1px solid var(--line); }
.ip-topic__title { margin-top: 12px; font: 700 clamp(36px, 4.6vw, 60px)/1.05 var(--serif); letter-spacing: -.035em; overflow-wrap: anywhere; }
.ip-topic__title span { color: var(--em); font-weight: 500; margin-right: 2px; }
.ip-topic__meta { margin-top: 12px; color: var(--ink-2); font-size: 17px; }

/* ── Story ── */
.ip-main--story { padding-top: 48px; }
.ip-art__head { display: grid; justify-items: start; gap: 0; }
.ip-art__title { margin-top: 16px; font: 700 clamp(32px, 4.4vw, 46px)/1.14 var(--serif); letter-spacing: -.03em; text-wrap: balance; overflow-wrap: anywhere; }
.ip-art__dek { margin-top: 14px; font: 400 21px/1.5 var(--serif); color: var(--ink-3); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.ip-art__by { margin-top: 28px; display: flex; align-items: center; gap: 14px; }
.ip-art__by img { width: 48px; height: 48px; }
.ip-art__who { font-size: 16px; display: flex; flex-wrap: wrap; align-items: baseline; }
.ip-art__who .ip-handle { margin-left: 6px; }
.ip-follow { color: var(--em-ink); font-weight: 600; text-decoration: none; }
.ip-follow:hover { text-decoration: underline; }
.ip-meta { margin-top: 3px; color: var(--ink-3); font-size: 14.5px; }
.ip-art__bar { width: 100%; margin-top: 24px; padding: 6px 0; border-block: 1px solid var(--line); display: flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; }
.ip-art__bar .ip-act { margin-left: 0; }
.ip-art__bar .ip-act--meta { margin-left: auto; }
.ip-art__bar--bottom { margin-top: 32px; }
.ip-art__cover { margin: 36px auto 0; max-width: 1040px; padding: 0 24px; }
.ip-art__cover img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--r-lg); background: var(--sunk); }
.ip-toc { padding: 18px 20px; border-radius: var(--r); background: var(--paper); box-shadow: inset 0 0 0 1px var(--line); }
.ip-toc--story { margin-top: 36px; }
.ip-toc__h { display: flex; align-items: center; gap: 8px; font: 600 13.5px/1 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 10px; }
.ip-toc ol, .ip-toc ul { list-style: none; display: grid; gap: 2px; }
.ip-toc ol { counter-reset: t; }
.ip-toc a { display: flex; gap: 10px; padding: 6px 8px; margin: 0 -8px; border-radius: 8px; color: var(--ink-2); text-decoration: none; font-size: 15px; line-height: 1.35; }
.ip-toc ol a::before { counter-increment: t; content: counter(t, decimal-leading-zero); font-variant-numeric: tabular-nums; color: var(--em); font-weight: 600; font-size: 13px; padding-top: 1px; }
.ip-toc a:hover { background: var(--sunk); color: var(--ink); }
.ip-toc a[aria-current="page"] { background: var(--em-tint); color: var(--em-ink); font-weight: 600; }
.ip-toc__plain li { padding: 5px 0; color: var(--ink-2); font-size: 15px; border-bottom: 1px dashed var(--line); }
.ip-toc__plain li:last-child { border-bottom: 0; }

/* Prose */
.ip-prose { font: 400 20px/1.75 var(--serif); color: var(--ink); overflow-wrap: break-word; }
.ip-prose--story { margin-top: 36px; }
.ip-prose > * + * { margin-top: 1.1em; }
.ip-prose h2 { margin-top: 1.9em; font: 700 28px/1.25 var(--serif); letter-spacing: -.02em; }
.ip-prose h3 { margin-top: 1.6em; font: 700 22px/1.3 var(--serif); letter-spacing: -.01em; }
.ip-prose h4, .ip-prose h5, .ip-prose h6 { margin-top: 1.4em; font: 700 18px/1.35 var(--sans); }
.ip-prose h2 + *, .ip-prose h3 + * { margin-top: .55em; }
.ip-prose a { color: var(--em-ink); text-decoration-color: rgba(11, 122, 83, .45); text-decoration-thickness: 1.5px; }
.ip-prose a:hover { text-decoration-color: var(--em); }
.ip-prose ul, .ip-prose ol { padding-left: 1.4em; }
.ip-prose li + li { margin-top: .4em; }
.ip-prose li::marker { color: var(--em); }
.ip-prose blockquote { margin: 1.8em 0; padding: 0 0 0 26px; border-left: 3px solid var(--ink); font: italic 400 24px/1.5 var(--serif); letter-spacing: -.01em; }
.ip-prose blockquote p { display: inline; background: linear-gradient(transparent 10%, var(--em-hl) 10% 90%, transparent 90%); -webkit-box-decoration-break: clone; box-decoration-break: clone; padding: 0 .12em; }
.ip-prose blockquote p + p::before { content: "\A\A"; white-space: pre; }
.ip-prose img { border-radius: 12px; margin-inline: auto; height: auto; }
.ip-prose figure { margin: 2em 0; }
.ip-prose figcaption { margin-top: 10px; text-align: center; font: 400 14.5px/1.4 var(--sans); color: var(--ink-3); }
.ip-prose hr { border: 0; text-align: center; margin: 2.4em 0; }
.ip-prose hr::before { content: "· · ·"; letter-spacing: .6em; color: var(--ink-3); font-size: 22px; }
.ip-prose code { font: 500 .84em/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; background: var(--sunk); padding: .12em .38em; border-radius: 6px; }
.ip-prose pre { background: var(--ink); color: #eae5d8; padding: 18px 20px; border-radius: var(--r); overflow-x: auto; font-size: 15px; line-height: 1.6; }
.ip-prose pre code { background: none; padding: 0; color: inherit; }
.ip-prose table { width: 100%; border-collapse: collapse; font: 400 16px/1.5 var(--sans); display: block; overflow-x: auto; }
.ip-prose th, .ip-prose td { padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.ip-prose th { font-weight: 600; background: var(--sunk); }
.ip-prose mark { background: var(--em-hl); color: inherit; padding: 0 .1em; }
.ip-prose--pin { font-size: 17px; line-height: 1.65; }
.ip-prose--pin h2, .ip-prose--pin h3 { font-size: 19px; margin-top: 1.2em; }
.ip-prose--pin > :first-child { margin-top: 0; }
.ip-tags { list-style: none; margin-top: 36px; display: flex; flex-wrap: wrap; gap: 8px; }
.ip-tagpill { display: inline-block; padding: 8px 15px; border-radius: var(--pill); background: var(--sunk); color: var(--ink); font: 500 14.5px/1 var(--sans); text-decoration: none; }
.ip-tagpill:hover { background: var(--em-tint); color: var(--em-ink); }

/* Writer card */
.ip-writer { margin-top: 56px; }
.ip-writer__card { display: grid; grid-template-columns: 72px 1fr; gap: 20px; padding: 28px; border-radius: var(--r-lg); background: var(--paper); box-shadow: inset 0 0 0 1px var(--line); }
.ip-writer__av { width: 72px; height: 72px; }
.ip-writer__lab { font: 600 13px/1 var(--sans); letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); }
.ip-writer__name { margin-top: 8px; font: 700 26px/1.2 var(--serif); letter-spacing: -.02em; }
.ip-writer__name a { text-decoration: none; }
.ip-writer__name a:hover { text-decoration: underline; }
.ip-writer__meta { margin-top: 4px; color: var(--ink-3); font-size: 14.5px; }
.ip-writer__bio { margin-top: 12px; color: var(--ink-2); font: 400 17px/1.6 var(--serif); }
.ip-writer__cta { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 10px; }

/* Responses thread */
.ip-thread { margin-top: 56px; }
.ip-thread__h { display: flex; align-items: center; gap: 10px; font: 700 26px/1.2 var(--serif); letter-spacing: -.02em; }
.ip-thread__h .ip-count { font-size: 14px; height: 26px; min-width: 30px; }
.ip-reply { margin-top: 20px; padding: 22px; border-radius: var(--r-lg); background: var(--paper); box-shadow: var(--shadow), inset 0 0 0 1px var(--line); display: grid; gap: 14px; }
.ip-reply__top { display: flex; align-items: center; gap: 12px; }
.ip-reply__h { font: 600 18px/1.2 var(--sans); }
.ip-reply__foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.ip-note { display: flex; align-items: flex-start; gap: 8px; color: var(--ink-3); font-size: 14.5px; max-width: 420px; }
.ip-note .ip-ic { color: var(--em); margin-top: 1px; }
.ip-status { font-size: 15px; font-weight: 500; color: var(--em-ink); }
.ip-status:empty { margin-top: -14px; }
.ip-status:not(:empty) { padding: 12px 14px; border-radius: 12px; background: var(--em-tint); }
.ip-status[data-state="invalid"]:not(:empty), .ip-status[data-state="error"]:not(:empty) { background: var(--warn-tint); color: var(--warn); }
.ip-ini { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; flex: none; background: var(--sunk-2); color: var(--ink); font: 600 14.5px/1 var(--sans); letter-spacing: .02em; position: relative; z-index: 1; }
.ip-ini[data-h="1"] { background: #e2d6bd; }
.ip-ini[data-h="2"] { background: #d3e6da; color: var(--em-ink); }
.ip-ini[data-h="3"] { background: var(--ink); color: var(--paper); }
.ip-resp--author .ip-ini { background: var(--em); color: #fff; }
.ip-ini--you { background: var(--em-tint); color: var(--em-ink); }
.ip-thread__list { list-style: none; margin-top: 28px; position: relative; }
.ip-thread__list::before { content: ""; position: absolute; left: 19px; top: 20px; bottom: 30px; width: 2px; background: var(--line); }
.ip-resp { display: grid; grid-template-columns: 40px 1fr; gap: 14px; }
.ip-resp + .ip-resp { margin-top: 20px; }
.ip-resp__main { min-width: 0; padding: 14px 18px 16px; border-radius: 4px 18px 18px 18px; background: var(--paper); box-shadow: inset 0 0 0 1px var(--line); }
.ip-resp--author .ip-resp__main { background: var(--em-tint); box-shadow: inset 0 0 0 1px #c3e2cf; }
.ip-resp__who { display: flex; flex-wrap: wrap; align-items: center; gap: 0 2px; font-size: 15px; }
.ip-badge { margin-left: 8px; padding: 3px 9px; border-radius: var(--pill); background: var(--em); color: #fff; font: 600 12px/1.1 var(--sans); letter-spacing: .02em; }
.ip-resp__body { margin-top: 6px; font: 400 17px/1.6 var(--serif); overflow-wrap: anywhere; }
.ip-resp__body p + p { margin-top: .6em; }
.ip-thread__empty { margin-top: 24px; display: flex; align-items: center; gap: 10px; color: var(--ink-3); }

/* More from (reading list) */
.ip-more { margin-top: 80px; padding: 64px 0 8px; border-top: 1px solid var(--line); background: linear-gradient(var(--paper), var(--bg)); }
.ip-more__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 28px; }
.ip-more__head h2 { font: 700 30px/1.15 var(--serif); letter-spacing: -.025em; }
.ip-rlgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.ip-rl { display: grid; gap: 14px; align-content: start; }
.ip-rl__media { display: block; aspect-ratio: 16 / 10; border-radius: var(--r); overflow: hidden; background: var(--sunk); }
.ip-rl__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s var(--ease); }
.ip-rl:hover .ip-rl__media img { transform: scale(1.04); }
.ip-rl__type { width: 100%; height: 100%; display: grid; place-items: center; background: var(--ink); }
.ip-rl__type[data-h="1"] { background: var(--em-ink); }
.ip-rl__type[data-h="2"] { background: #e7dcc4; }
.ip-rl__type[data-h="3"] { background: var(--em-tint); }
.ip-rl__type span { font: italic 600 64px/1 var(--serif); color: var(--paper); }
.ip-rl__type[data-h="2"] span { color: var(--ink); }
.ip-rl__type[data-h="3"] span { color: var(--em-ink); }
.ip-rl__body { display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; }
.ip-rl__n { grid-row: 1 / 3; font: 600 22px/1.1 var(--serif); color: var(--line-2); font-variant-numeric: tabular-nums; }
.ip-rl__t { font: 700 18px/1.32 var(--serif); letter-spacing: -.01em; overflow-wrap: anywhere; }
.ip-rl__t a { text-decoration: none; }
.ip-rl__t a:hover { text-decoration: underline; text-decoration-color: var(--em); }
.ip-rl__m { color: var(--ink-3); font-size: 14px; }
.ip-rl__m a { color: var(--em-ink); text-decoration: none; }
.ip-rl__m a:hover { text-decoration: underline; }

/* ── Docs / static pages ── */
.ip-doc__head { padding: 64px 0 44px; background: var(--paper); border-bottom: 1px solid var(--line); background-image: repeating-linear-gradient(0deg, transparent 0 35px, rgba(22, 21, 15, .03) 35px 36px); }
.ip-doc__title { margin-top: 14px; font: 700 clamp(36px, 4.6vw, 58px)/1.06 var(--serif); letter-spacing: -.035em; max-width: 860px; text-wrap: balance; }
.ip-doc__date { margin-top: 16px; display: inline-flex; align-items: center; gap: 8px; padding: 7px 13px; border-radius: var(--pill); background: var(--bg); box-shadow: inset 0 0 0 1px var(--line); color: var(--ink-2); font-size: 14.5px; }
.ip-doc__date .ip-ic { color: var(--em); }
.ip-doc { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 64px; padding-top: 48px; align-items: start; }
.ip-doc__side { position: sticky; top: 88px; display: grid; gap: 16px; }
.ip-doc__main { min-width: 0; max-width: 740px; }
.ip-prose--doc { font-size: 18px; line-height: 1.72; }
.ip-prose--doc h2 { font-size: 26px; scroll-margin-top: 90px; }
.ip-prose--doc > h2:first-child, .ip-prose--doc > .ip-lead + h2 { margin-top: 1.4em; }
.ip-lead { font: 400 21px/1.6 var(--serif); color: var(--ink-2); }
.ip-prose--doc ul { list-style: none; padding-left: 0; }
.ip-prose--doc ul > li { position: relative; padding-left: 26px; }
.ip-prose--doc ul > li::before { content: ""; position: absolute; left: 4px; top: .7em; width: 8px; height: 8px; border-radius: 50%; background: var(--em); }
.ip-qa { border-bottom: 1px solid var(--line); }
.ip-prose .ip-qa + .ip-qa, .ip-prose h2 + .ip-qa { margin-top: 0; }
.ip-prose h2 + .ip-qa { margin-top: .6em; border-top: 1px solid var(--line); }
.ip-qa summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 16px 2px; font: 600 18px/1.4 var(--sans); }
.ip-qa summary::-webkit-details-marker { display: none; }
.ip-qa summary::after { content: "+"; flex: none; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--sunk); color: var(--em-ink); font: 500 20px/1 var(--sans); transition: transform .2s var(--ease); }
.ip-qa[open] summary::after { transform: rotate(45deg); background: var(--em-tint); }
.ip-qa summary:hover { color: var(--em-ink); }
.ip-qa__a { padding: 0 2px 18px; color: var(--ink-2); font-size: 17.5px; }

/* Features page */
.ip-fpage { padding-top: 48px; }
.ip-prose--wide { max-width: none; }
.ip-prose--wide > p, .ip-prose--wide > h2, .ip-prose--wide > ul { max-width: 760px; }
.ip-fgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin: 40px 0 16px !important; }
.ip-fcard { padding: 28px; border-radius: var(--r-lg); background: var(--paper); box-shadow: inset 0 0 0 1px var(--line); font-size: 16.5px; line-height: 1.6; }
.ip-fcard__ic { display: inline-grid; place-items: center; width: 46px; height: 46px; border-radius: 13px; background: var(--ink); color: #9fdcbd; }
.ip-prose .ip-fcard h2 { margin-top: 18px; font-size: 22px; line-height: 1.25; }
.ip-fcard p { margin-top: 10px; color: var(--ink-2); font-family: var(--sans); }
.ip-fcard ul { margin-top: 14px !important; display: grid; gap: 6px; font-family: var(--sans); }
.ip-prose .ip-fcard li + li { margin-top: 0; }
.ip-fpage__cta { margin-top: 40px; display: flex; gap: 12px; flex-wrap: wrap; }

/* Contact */
.ip-contact { margin-top: 40px; padding: 30px; border-radius: var(--r-lg); background: var(--paper); box-shadow: var(--shadow), inset 0 0 0 1px var(--line); scroll-margin-top: 90px; }
.ip-contact__h { font: 700 24px/1.2 var(--serif); letter-spacing: -.02em; margin-bottom: 18px; }
.ip-cform { display: grid; gap: 18px; }
.ip-cform__2 { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.ip-cform__foot { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.ip-flash { display: flex; align-items: flex-start; gap: 10px; padding: 14px 16px; border-radius: 12px; margin-bottom: 18px; font-weight: 500; }
.ip-flash--ok { background: var(--em-tint); color: var(--em-ink); box-shadow: inset 0 0 0 1px #c3e2cf; }
.ip-flash--warn { background: var(--warn-tint); color: var(--warn); box-shadow: inset 0 0 0 1px #f0d6a8; }
.ip-flash .ip-ic { margin-top: 2px; }

/* 404 */
.ip-nf { padding: 96px 0 40px; }
.ip-nf__in { display: grid; grid-template-columns: 300px 1fr; gap: 64px; align-items: center; }
.ip-nf__sheet { position: relative; aspect-ratio: 3 / 4; border-radius: 10px; background: var(--paper); box-shadow: var(--shadow-lg), inset 0 0 0 1px var(--line); padding: 48px 32px; display: grid; align-content: start; gap: 18px; transform: rotate(-3deg); }
.ip-nf__sheet span { height: 2px; background: var(--line); }
.ip-nf__sheet .is-short { width: 55%; }
.ip-nf__sheet .ip-mark { position: absolute; right: 24px; bottom: 24px; width: 44px; height: 44px; }
.ip-nf__title { margin-top: 12px; font: 700 clamp(36px, 4.6vw, 56px)/1.06 var(--serif); letter-spacing: -.035em; }
.ip-nf__text { margin-top: 16px; font-size: 18px; color: var(--ink-2); }
.ip-nf__btns { margin-top: 28px; display: flex; gap: 10px; flex-wrap: wrap; }

/* ── Responsive ── */
@media (max-width: 1100px) {
  .ip-feats { grid-template-columns: repeat(2, 1fr); }
  .ip-rlgrid { grid-template-columns: repeat(2, 1fr); }
  .ip-fgrid { grid-template-columns: repeat(2, 1fr); }
  .ip-cols { grid-template-columns: minmax(0, 1fr) 280px; gap: 32px; }
}
@media (max-width: 900px) {
  .ip-wrap { padding: 0 24px; }
  .ip-bar__in { padding: 0 20px; }
  .ip-menu { display: inline-flex; }
  .ip-nav {
    position: absolute; left: 0; right: 0; top: 66px; display: none; flex-direction: column; align-items: stretch; gap: 2px;
    padding: 10px 16px 18px; background: var(--paper); border-bottom: 1px solid var(--line); box-shadow: 0 20px 30px -20px rgba(22, 21, 15, .3);
  }
  .ip-nav.is-open { display: flex; }
  .ip-nav__a { padding: 13px 14px; font-size: 16px; }
  .ip-nav__signin { margin: 8px 0 0; }
  .ip-hero { padding: 48px 0 64px; }
  .ip-hero__grid, .ip-row, .ip-band__grid, .ip-cta__card { grid-template-columns: 1fr; }
  .ip-hero__grid { gap: 48px; }
  .ip-hero__visual { padding: 0 0 0 0; display: grid; gap: 0; }
  .ip-hero__photo { aspect-ratio: 16 / 10; }
  .ip-signin { position: relative; width: auto; margin: -64px 16px 0; }
  .ip-row { gap: 32px; }
  .ip-row--flip .ip-row__text { order: 0; }
  .ip-band__grid { gap: 40px; }
  .ip-cta__text { padding: 40px 28px; }
  .ip-cta__photo { aspect-ratio: 16 / 9; min-height: 0; }
  .ip-cols { grid-template-columns: 1fr; }
  .ip-side { position: static; }
  .ip-doc { grid-template-columns: 1fr; gap: 0; padding-top: 40px; }
  .ip-doc__side { position: static; order: 2; margin-top: 48px; }
  .ip-foot__in { grid-template-columns: 1fr; gap: 36px; }
  .ip-nf__in { grid-template-columns: 1fr; gap: 40px; }
  .ip-nf__sheet { width: 200px; }
}
@media (max-width: 600px) {
  body { font-size: 15.5px; }
  .ip-wrap { padding: 0 16px; }
  .ip-col { padding: 0 16px; }
  .ip-bar__in { padding: 0 16px; height: 62px; }
  .ip-nav { top: 62px; }
  .ip-brand__word { font-size: 21px; }
  .ip-mark { width: 30px; height: 30px; }
  .ip-sect { padding: 64px 0; }
  .ip-sect__head { margin-bottom: 36px; }
  .ip-hero__lede { font-size: 17px; }
  .ip-hero__ctas .ip-btn { flex: 1 1 auto; }
  .ip-signin { margin: -48px 8px 0; padding: 20px; }
  .ip-row { padding: 28px 0; }
  .ip-row__text h3 { font-size: 25px; }
  .ip-mock { padding: 16px; }
  .ip-mock--profile { padding: 0 0 16px; }
  .ip-mock--profile > :not(.ip-mock__cover) { margin-inline: 16px; }
  .ip-feats { grid-template-columns: 1fr; }
  .ip-quote { padding: 16px 0 64px; }
  .ip-cta { padding-bottom: 64px; }
  .ip-cta__card { border-radius: var(--r-lg); }
  .ip-card { padding: 18px 16px 12px; border-radius: 18px; }
  .ip-card__body { grid-template-columns: 1fr 96px; gap: 14px; }
  .ip-card__title { font-size: 19px; }
  .ip-card__ex { font-size: 15px; -webkit-line-clamp: 2; }
  .ip-card__thumb { aspect-ratio: 1; }
  .ip-card__tags { display: none; }
  .ip-card__by .ip-handle { display: none; }
  .ip-act { padding: 6px 9px; font-size: 14px; }
  .ip-cover { height: 150px; }
  .ip-cover__mark { font-size: 110px; }
  .ip-prof__top { margin-top: -48px; }
  .ip-prof__av { width: 96px; height: 96px; box-shadow: 0 0 0 4px var(--paper); }
  .ip-hide-sm { display: none; }
  .ip-prof__bio { font-size: 17px; }
  .ip-stats { gap: 10px 26px; }
  .ip-tabs a { margin-right: 10px; }
  .ip-cols { padding-top: 28px; }
  .ip-main--story { padding-top: 28px; }
  .ip-art__dek { font-size: 18px; }
  .ip-art__cover { padding: 0; margin-top: 28px; }
  .ip-art__cover img { border-radius: 0; }
  .ip-art__bar .ip-act--meta { margin-left: 0; }
  .ip-prose { font-size: 18.5px; line-height: 1.72; }
  .ip-prose h2 { font-size: 24px; }
  .ip-prose blockquote { font-size: 20px; padding-left: 18px; }
  .ip-writer__card { grid-template-columns: 1fr; padding: 22px; gap: 14px; }
  .ip-reply { padding: 18px 16px; }
  .ip-thread__list::before { left: 17px; }
  .ip-resp { grid-template-columns: 36px 1fr; gap: 10px; }
  .ip-ini { width: 36px; height: 36px; font-size: 13.5px; }
  .ip-resp__main { padding: 12px 14px; }
  .ip-more { margin-top: 56px; padding-top: 48px; }
  .ip-rlgrid { grid-template-columns: 1fr; gap: 20px; }
  .ip-rl { grid-template-columns: 112px 1fr; gap: 14px; align-items: center; }
  .ip-rl__media { aspect-ratio: 1; }
  .ip-rl__type span { font-size: 40px; }
  .ip-rl__n { display: none; }
  .ip-rl__body { grid-template-columns: 1fr; }
  .ip-topic { padding: 40px 0 32px; }
  .ip-doc__head { padding: 44px 0 32px; }
  .ip-prose--doc { font-size: 17px; }
  .ip-lead { font-size: 19px; }
  .ip-fgrid { grid-template-columns: 1fr; }
  .ip-fcard { padding: 22px; }
  .ip-contact { padding: 20px 16px; margin-inline: -4px; }
  .ip-cform__2 { grid-template-columns: 1fr; }
  .ip-foot { margin-top: 72px; }
  .ip-foot__in { padding: 48px 16px 32px; }
  .ip-foot__nav { grid-template-columns: 1fr 1fr; }
  .ip-foot__base { padding: 18px 16px 24px; }
  .ip-pager__gap { min-width: 0; }
  .ip-nf { padding: 56px 0 24px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
.ip-brand--foot .ip-mark rect { fill: #2e2c23; }
.ip-rl__media { text-decoration: none; }