/* Guides v2 · newsletter band (RP Guides v2 · Newsletter). Calm card in the homepage style: hairline, large radius,
   soft blue → teal glow in one corner, text left, one-line form right. One soft reveal; no loops. */
.rp-root .g2n { box-sizing: border-box; width: 100%; max-width: calc(var(--pr-w, 1240px) + 2 * var(--pr-side, 32px)); margin-inline: auto;
  padding: var(--pr-top, 24px) var(--pr-side, 32px) var(--pr-bottom, 96px); font-family: var(--ds-font-body, var(--rp-font-body)); }
.rp-root .g2n-card { position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); align-items: center; gap: 48px;
  padding: 52px 56px; border-radius: 32px; background: var(--g2n-bg, linear-gradient(135deg, #ffffff 0%, #f5f8ff 55%, #eefbf9 100%));
  box-shadow: 0 0 0 1px rgba(16, 20, 46, .06), 0 2px 4px rgba(16, 20, 46, .03), 0 40px 90px -60px rgba(16, 30, 80, .45);
  opacity: 0; transform: translateY(14px); transition: opacity .8s cubic-bezier(.22, 1, .36, 1), transform .8s cubic-bezier(.22, 1, .36, 1); }
.rp-root .g2n.is-in .g2n-card { opacity: 1; transform: none; }
.rp-root .g2n-glow { position: absolute; z-index: -1; right: -120px; top: -160px; width: 460px; height: 460px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(closest-side, rgba(6, 101, 246, .16), rgba(25, 198, 192, .1) 55%, transparent 100%); }
.rp-root .g2n-text { display: grid; gap: 14px; justify-items: start; min-width: 0; }
.rp-root .g2n-pill { height: 30px; padding: 0 13px; font: 500 13px/1 var(--rp-font-body); color: var(--rp-ink, #10142e); }
.rp-root .g2n-title { margin: 0; font: 500 var(--g2n-h, clamp(28px, 3vw, 40px))/1.08 var(--rp-font-display); letter-spacing: -.03em; color: var(--g2n-ink, var(--rp-ink, #10142e)); text-wrap: balance; }
.rp-root .g2n-title .hv-blue { background: linear-gradient(100deg, #0665f6 0%, #2b6dff 35%, #19c6c0 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.rp-root .g2n-body { margin: 0; max-width: 44ch; font: 400 17px/1.55 var(--rp-font-body); color: var(--g2n-soft, var(--rp-ink-soft, #4b516b)); }
.rp-root .g2n-form { min-width: 0; display: grid; gap: 12px; }
.rp-root .g2n-fields { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr) auto; gap: 10px; padding: 8px; border-radius: 22px;
  background: rgba(255, 255, 255, .86); box-shadow: 0 0 0 1px rgba(16, 20, 46, .07), 0 14px 30px -22px rgba(16, 30, 80, .4); }
.rp-root .g2n-input { box-sizing: border-box; width: 100%; min-width: 0; height: 52px; margin: 0; padding: 0 16px; border: 1px solid transparent; border-radius: 15px; background: #f5f7fb;
  font: 400 15.5px/1.2 var(--rp-font-body); color: var(--rp-ink, #10142e); outline: none; transition: background .25s, border-color .25s, box-shadow .25s; }
.rp-root .g2n-input::placeholder { color: #9298ad; }
.rp-root .g2n-input:hover { background: #eff2f8; }
.rp-root .g2n-input:focus { background: #fff; border-color: rgba(6, 101, 246, .5); box-shadow: 0 0 0 4px rgba(6, 101, 246, .12); }
.rp-root .g2n-btn { all: unset; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 52px; padding: 0 24px; border-radius: 15px;
  background: var(--g2n-btn, #10142e); color: #fff; font: 600 15.5px/1 var(--rp-font-body); white-space: nowrap; cursor: pointer;
  transition: transform .45s cubic-bezier(.22, 1, .36, 1), box-shadow .45s ease, opacity .3s; }
.rp-root .g2n-btn svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .4s cubic-bezier(.22, 1, .36, 1); }
.rp-root .g2n-btn:hover { transform: translateY(-1px); box-shadow: 0 14px 28px -14px rgba(16, 20, 46, .55); }
.rp-root .g2n-btn:hover svg { transform: translateX(3px); }
.rp-root .g2n-btn:focus-visible { outline: 2px solid #0665f6; outline-offset: 3px; }
.rp-root .g2n-btn:disabled { opacity: .7; cursor: default; transform: none; box-shadow: none; }
.rp-root .g2n-note, .rp-root .g2n-fail { margin: 0 6px; font: 400 13.5px/1.4 var(--rp-font-body); color: #6b7189; }
.rp-root .g2n-fail { color: #c2334d; }
.rp-root .g2n-ok { margin: 0; display: flex; align-items: center; gap: 12px; padding: 18px 20px; border-radius: 20px; background: rgba(255, 255, 255, .9);
  box-shadow: 0 0 0 1px rgba(16, 20, 46, .07); font: 500 16px/1.4 var(--rp-font-body); color: var(--rp-ink, #10142e); }
.rp-root .g2n-tick { flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: linear-gradient(135deg, #0665f6, #19c6c0); }
.rp-root .g2n-tick svg { width: 16px; height: 16px; fill: none; stroke: #fff; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }

@media (max-width: 991px) {
  .rp-root .g2n-card { grid-template-columns: 1fr; gap: 28px; padding: 40px 36px; }
}
@media (max-width: 640px) {
  .rp-root .g2n-card { padding: 32px 22px; border-radius: 26px; }
  .rp-root .g2n-fields { grid-template-columns: 1fr; }
  .rp-root .g2n-btn { width: 100%; }
  .rp-root .g2n-body { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .rp-root .g2n-card { opacity: 1; transform: none; transition: none; }
  .rp-root .g2n-btn, .rp-root .g2n-btn svg { transition: none; }
}

/* =========================================================================
   Guides v2 — hero, guide covers, cards, library (sidebar + rows), related, guide-page cover frame.
   Its own look (not the blog's): report-sheet covers on tinted paper, numbered "Start here" books, a Topics sidebar,
   wide row cards with a coloured topic dot. Same tokens as every v2 page (--ds-*). One soft reveal; no loops.
   ========================================================================= */
.rp-root:has(.g2h, .g2l, .g2-cardwrap, .g2n) { background: transparent; }
.rp-root .g2-pill { height: 30px; padding: 0 13px; font: 500 13px/1 var(--ds-font-body); color: var(--ds-ink); }
.rp-root .g2-note { margin: 12px auto; max-width: 1180px; padding: 14px 18px; border-radius: 14px; background: #f3f6fc; box-shadow: inset 0 0 0 1px #dfe6f3; font: 400 13.5px/1.5 var(--ds-font-body); color: #4b516b; }
.rp-root .g2-note b { color: var(--ds-ink); }
/* topic colours (dot / icon tile) */
.rp-root [data-tone="sales"] { --g2-tone: #0665f6; --g2-tone-soft: #e6efff; }
.rp-root [data-tone="inventory"] { --g2-tone: #0d9c88; --g2-tone-soft: #e2f5f0; }
.rp-root [data-tone="product"] { --g2-tone: #6a4cf5; --g2-tone-soft: #eeeaff; }
.rp-root [data-tone="customer"] { --g2-tone: #e7801a; --g2-tone-soft: #fff0df; }
.rp-root [data-tone="tax"] { --g2-tone: #4f9312; --g2-tone-soft: #edf6df; }

/* ---------------------------------------------------------------- hero */
.rp-root .g2h { position: relative; isolation: isolate; overflow: clip; padding: var(--pr-top, 168px) var(--pr-side, 32px) var(--pr-bottom, 72px); font-family: var(--ds-font-body); }
.rp-root .g2h-bg { position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(42% 60% at 76% 30%, color-mix(in srgb, var(--ds-primary) 9%, transparent), transparent 70%),
    radial-gradient(30% 40% at 96% 70%, color-mix(in srgb, var(--ds-accent) 9%, transparent), transparent 70%); }
.rp-root .g2h-in { width: min(var(--pr-w, 1180px), 100%); margin-inline: auto; display: grid; gap: 56px; align-items: center; }
.rp-root .g2h--split .g2h-in { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); }
.rp-root .g2h-text { display: grid; justify-items: start; gap: 22px; }
.rp-root .g2h:not(.g2h--split) .g2h-text { justify-items: center; text-align: center; max-width: 860px; margin-inline: auto; }
.rp-root .g2h-title { margin: 0; font: var(--ds-h-weight) var(--g2h-h1, calc(var(--ds-h1) * .86))/1.02 var(--ds-font-display); letter-spacing: -.04em; color: var(--ds-ink); text-wrap: balance; max-width: 15ch; }
.rp-root .g2h-title .hv-w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .08em; margin-bottom: -.08em; }
.rp-root .g2h.is-in .hv-wi, .rp-root .g2h.is-still .hv-wi { transform: none; }
.rp-root .g2h.is-in .hv-wi.hv-blue { animation: hv-sheen 2.8s var(--rp-ease) .7s both; }
.rp-root .g2h-body { margin: 0; max-width: 50ch; font: 400 var(--ds-lead)/1.6 var(--ds-font-body); color: var(--ds-text); text-wrap: pretty; }
.rp-root .g2h-search { display: flex; align-items: center; gap: 10px; width: min(100%, 520px); height: 60px; padding: 0 7px 0 20px; box-sizing: border-box; border-radius: 18px; background: #fff;
  box-shadow: 0 0 0 1px rgba(16, 20, 46, .08), 0 22px 44px -30px rgba(16, 30, 80, .45); transition: box-shadow .25s; }
.rp-root .g2h-search:focus-within { box-shadow: 0 0 0 1px color-mix(in srgb, var(--ds-primary) 45%, transparent), 0 0 0 5px color-mix(in srgb, var(--ds-primary) 12%, transparent), 0 22px 44px -30px rgba(16, 30, 80, .45); }
.rp-root .g2h-search svg { flex: none; width: 19px; height: 19px; fill: none; stroke: var(--ds-muted); stroke-width: 1.9; stroke-linecap: round; }
.rp-root .g2h-search input { flex: 1; min-width: 0; height: 100%; border: 0; outline: 0; background: transparent; font: 400 16px/1 var(--ds-font-body); color: var(--ds-ink); }
.rp-root .g2h-search input::placeholder { color: #9aa0b4; }
.rp-root .g2h-search button { all: unset; flex: none; height: 46px; padding: 0 20px; border-radius: 13px; background: var(--ds-ink); color: #fff; font: 600 15px/46px var(--ds-font-body); cursor: pointer; transition: transform .35s var(--rp-ease), box-shadow .35s; }
.rp-root .g2h-search button:hover { transform: translateY(-1px); box-shadow: 0 12px 24px -14px rgba(16, 20, 46, .6); }
.rp-root .g2h-search button:focus-visible { outline: 2px solid var(--ds-primary); outline-offset: 3px; }
.rp-root .g2h-stats { display: inline-flex; align-items: center; gap: 9px; margin: 0; font: 500 14px/1.2 var(--ds-font-body); color: var(--ds-text); }
.rp-root .g2h-stats i { width: 8px; height: 8px; border-radius: 50%; background: var(--ds-accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--ds-accent) 18%, transparent); }
.rp-root .g2h-text > * { opacity: 0; transform: translate3d(0, 14px, 0); transition: opacity .8s ease, transform 1s var(--rp-ease); }
.rp-root .g2h-text > .g2h-title { opacity: 1; transform: none; }
.rp-root .g2h.is-in .g2h-text > * { opacity: 1; transform: none; }
.rp-root .g2h.is-in .g2h-body { transition-delay: .25s; } .rp-root .g2h.is-in .g2h-search { transition-delay: .35s; } .rp-root .g2h.is-in .g2h-stats { transition-delay: .45s; }
/* the fanned stack */
.rp-root .g2h-art { position: relative; aspect-ratio: 1 / .86; width: 100%; max-width: 560px; justify-self: end; --tx: 0; --ty: 0; }
.rp-root .g2h-sheet { position: absolute; left: 12%; top: 16%; width: 76%; aspect-ratio: 400 / 260; border-radius: 24px; overflow: hidden; display: block; background: #fff;
  box-shadow: 0 0 0 1px rgba(16, 20, 46, .06), 0 40px 70px -40px rgba(16, 30, 80, .5); opacity: 0;
  transition: transform 1.1s var(--rp-ease), opacity .9s ease, box-shadow .4s; }
.rp-root .g2h-sheet--0 { z-index: 3; --r: -2deg; --x: 0%; --y: 18%; --dx: 10; }
.rp-root .g2h-sheet--1 { z-index: 2; --r: 7deg; --x: 14%; --y: -6%; --dx: 16; }
.rp-root .g2h-sheet--2 { z-index: 1; --r: -9deg; --x: -14%; --y: -10%; --dx: 22; }
.rp-root .g2h.is-in .g2h-sheet { opacity: 1; transform: translate(calc(var(--x) + var(--tx) * var(--dx) * 1px), calc(var(--y) + var(--ty) * var(--dx) * 1px)) rotate(var(--r)); }
.rp-root .g2h.is-in .g2h-sheet--1 { transition-delay: .12s; } .rp-root .g2h.is-in .g2h-sheet--2 { transition-delay: .22s; }
.rp-root .g2h-sheet { transform: translate(0, 30%) rotate(0deg); }
.rp-root .g2h-art:hover .g2h-sheet--1 { --x: 20%; --r: 9deg; } .rp-root .g2h-art:hover .g2h-sheet--2 { --x: -20%; --r: -11deg; }
.rp-root .g2h-cover, .rp-root .g2h-cover svg, .rp-root .g2h-cover img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ---------------------------------------------------------------- covers + cards */
.rp-root .g2c-cover { position: relative; display: block; overflow: hidden; aspect-ratio: 400 / 260; border-radius: 18px; background: #eef3ff; }
.rp-root .g2c-cover svg, .rp-root .g2c-cover img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--rp-ease); }
.rp-root .g2c { position: relative; display: grid; text-decoration: none; color: inherit; background: #fff; border-radius: 26px; box-shadow: var(--ds-shadow-card);
  transition: transform .45s var(--rp-ease), box-shadow .45s ease; font-family: var(--ds-font-body); }
.rp-root .g2c:hover { transform: translateY(-3px); box-shadow: var(--ds-shadow-card-h); }
.rp-root .g2c:hover .g2c-cover svg, .rp-root .g2c:hover .g2c-cover img { transform: scale(1.035); }
.rp-root .g2c:focus-visible { outline: 2px solid var(--ds-primary); outline-offset: 3px; }
.rp-root .g2c-body { display: grid; align-content: start; gap: 10px; min-width: 0; }
.rp-root .g2c-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; font: 500 12.5px/1.25 var(--ds-font-body); color: var(--ds-muted); }
.rp-root .g2c-topic { display: inline-flex; align-items: center; gap: 7px; min-width: 0; font-weight: 600; color: var(--ds-ink); }
.rp-root .g2c-topic i { flex: none; width: 8px; height: 8px; border-radius: 3px; background: var(--g2-tone, var(--ds-primary)); }
.rp-root .g2c-kicker { display: inline-flex; align-items: center; gap: 6px; font: 700 11px/1 var(--ds-font-body); letter-spacing: .12em; text-transform: uppercase; color: var(--g2-tone, var(--ds-primary)); }
.rp-root .g2c-kicker b { font-weight: 700; }
.rp-root .g2c-title { font: 500 var(--g2c-title, 21px)/1.22 var(--ds-font-display); letter-spacing: -.02em; color: var(--ds-ink); text-wrap: balance; }
.rp-root .g2c-sum { font: 400 15px/1.55 var(--ds-font-body); color: var(--ds-text); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: var(--g2c-lines, 2); overflow: hidden; }
.rp-root .g2c-go { display: inline-flex; align-items: center; gap: 8px; margin-top: 4px; font: 600 14.5px/1 var(--ds-font-body); color: var(--ds-ink); }
.rp-root .g2c-go svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .4s var(--rp-ease); }
.rp-root .g2c:hover .g2c-go { color: var(--g2-tone, var(--ds-primary)); } .rp-root .g2c:hover .g2c-go svg { transform: translateX(4px); }
/* row: cover left, text right */
.rp-root .g2c--row { grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 28px; align-items: center; padding: 12px 28px 12px 12px; }
.rp-root .g2c--row .g2c-cover { border-radius: 18px; }
/* book: cover on top */
.rp-root .g2c--book { grid-template-rows: auto 1fr; padding: 10px 10px 22px; height: 100%; box-sizing: border-box; }
.rp-root .g2c--book .g2c-body { padding: 18px 14px 0; }
.rp-root .g2c--book .g2c-title { --g2c-title: 20px; }
.rp-root .g2-cardwrap { height: 100%; }
.rp-root .g2-cardwrap .g2c--row { grid-template-columns: minmax(0, 220px) minmax(0, 1fr); }

/* ---------------------------------------------------------------- library */
.rp-root .g2l { box-sizing: border-box; width: 100%; max-width: calc(var(--pr-w, 1180px) + 2 * var(--pr-side, 32px)); margin-inline: auto; padding: var(--pr-top, 24px) var(--pr-side, 32px) var(--pr-bottom, 72px); font-family: var(--ds-font-body); }
.rp-root .g2l-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.rp-root .g2l-head > div { display: grid; justify-items: start; gap: 14px; }
.rp-root .g2l-title { margin: 0; font: var(--ds-h-weight) var(--g2l-h2, calc(var(--ds-h2) * .78))/1.05 var(--ds-font-display); letter-spacing: -.034em; color: var(--ds-ink); text-wrap: balance; }
.rp-root .g2l-title .hv-blue { background: var(--ds-grad-text); -webkit-background-clip: text; background-clip: text; color: transparent; }
.rp-root .g2l-sub { margin: 0; max-width: 60ch; font: 400 17px/1.55 var(--ds-font-body); color: var(--ds-text); }
.rp-root .g2l-link { display: inline-flex; align-items: center; gap: 8px; flex: none; font: 600 15px/1 var(--ds-font-body); color: var(--ds-ink); text-decoration: none; }
.rp-root .g2l-link svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .4s var(--rp-ease); }
.rp-root .g2l-link:hover { color: var(--ds-primary); } .rp-root .g2l-link:hover svg { transform: translateX(4px); }
.rp-root .g2l-feat { margin-bottom: 88px; }
.rp-root .g2l-books { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.rp-root .g2l-grid { display: grid; grid-template-columns: 252px minmax(0, 1fr); gap: 40px; align-items: start; }
.rp-root .g2l-side { position: sticky; top: var(--g2-sticky, 108px); display: grid; gap: 12px; padding: 18px 12px 12px; border-radius: 24px; background: rgba(255, 255, 255, .8); box-shadow: var(--ds-shadow-card); }
.rp-root .g2l-side-t { margin: 0 10px; font: 700 11.5px/1 var(--ds-font-body); letter-spacing: .14em; text-transform: uppercase; color: var(--ds-muted); }
.rp-root .g2l-topics { margin: 0; padding: 0; list-style: none; display: grid; gap: 2px; }
.rp-root .g2l-topic { all: unset; box-sizing: border-box; display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; align-items: center; gap: 11px; width: 100%; padding: 8px 10px 8px 8px; border-radius: 14px; cursor: pointer;
  font: 500 14px/1.3 var(--ds-font-body); color: var(--ds-text); transition: background .2s, color .2s; }
.rp-root .g2l-topic:hover { background: #f4f6fb; color: var(--ds-ink); }
.rp-root .g2l-topic:focus-visible { outline: 2px solid var(--ds-primary); outline-offset: 1px; }
.rp-root .g2l-topic.is-on { background: var(--g2-tone-soft, #eef3ff); color: var(--ds-ink); font-weight: 600; }
.rp-root .g2l-ic { display: grid; place-items: center; width: 32px; height: 32px; padding: 7px; box-sizing: border-box; border-radius: 10px; background: var(--g2-tone, var(--ds-ink)); color: #fff; }
.rp-root .g2l-ic svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.rp-root .g2l-ic--all { background: var(--ds-ink); }
.rp-root .g2l-tn { min-width: 0; }
.rp-root .g2l-tc { min-width: 26px; height: 22px; padding: 0 7px; box-sizing: border-box; border-radius: 999px; background: #eef1f6; font: 600 12px/22px var(--ds-font-body); text-align: center; color: var(--ds-text); font-variant-numeric: tabular-nums; }
.rp-root .g2l-topic.is-on .g2l-tc { background: #fff; color: var(--ds-ink); }
.rp-root .g2l-bar { display: flex; gap: 10px; }
.rp-root .g2l-search { flex: 1; display: flex; align-items: center; gap: 10px; height: 52px; padding: 0 12px 0 18px; border-radius: 16px; background: #fff; box-shadow: 0 0 0 1px rgba(16, 20, 46, .08); transition: box-shadow .25s; }
.rp-root .g2l-search:focus-within { box-shadow: 0 0 0 1px color-mix(in srgb, var(--ds-primary) 45%, transparent), 0 0 0 4px color-mix(in srgb, var(--ds-primary) 12%, transparent); }
.rp-root .g2l-search svg { flex: none; width: 18px; height: 18px; fill: none; stroke: var(--ds-muted); stroke-width: 1.9; stroke-linecap: round; }
.rp-root .g2l-search input { flex: 1; min-width: 0; height: 100%; border: 0; outline: 0; background: transparent; font: 400 15.5px/1 var(--ds-font-body); color: var(--ds-ink); -webkit-appearance: none; }
.rp-root .g2l-search input::-webkit-search-cancel-button { display: none; }
.rp-root .g2l-x { all: unset; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; cursor: pointer; }
.rp-root .g2l-x:hover { background: #f1f3f8; }
.rp-root .g2l-sort { flex: none; height: 52px; padding: 0 40px 0 16px; border: 0; border-radius: 16px; background: #fff url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%2362677b%27 stroke-width=%272%27 stroke-linecap=%27round%27%3E%3Cpath d=%27m7 10 5 5 5-5%27/%3E%3C/svg%3E") no-repeat right 14px center / 16px;
  box-shadow: 0 0 0 1px rgba(16, 20, 46, .08); font: 500 14.5px/1 var(--ds-font-body); color: var(--ds-ink); -webkit-appearance: none; appearance: none; cursor: pointer; }
.rp-root .g2l-count { margin: 16px 4px 14px; font: 500 13px/1 var(--ds-font-body); color: var(--ds-muted); }
.rp-root .g2l-rows { display: grid; gap: 16px; }
.rp-root .g2l-more { all: unset; box-sizing: border-box; display: inline-flex; align-items: center; gap: 10px; margin: 28px auto 0; height: 50px; padding: 0 10px 0 24px; border-radius: 999px; background: var(--ds-ink); color: #fff; font: 600 15px/1 var(--ds-font-body); cursor: pointer; transition: transform .35s var(--rp-ease), box-shadow .35s; }
.rp-root .g2l-main { display: grid; }
.rp-root .g2l-main > .g2l-more { justify-self: center; }
.rp-root .g2l-more span { display: inline-grid; place-items: center; min-width: 32px; height: 32px; padding: 0 8px; box-sizing: border-box; border-radius: 999px; background: rgba(255, 255, 255, .16); font-size: 13px; }
.rp-root .g2l-more:hover { transform: translateY(-2px); box-shadow: 0 14px 28px -14px rgba(16, 20, 46, .6); }
.rp-root .g2l-more:focus-visible { outline: 2px solid var(--ds-primary); outline-offset: 3px; }
.rp-root .g2l-more--ghost { height: 44px; padding: 0 18px; margin: 0; background: #fff; color: var(--ds-ink); box-shadow: inset 0 0 0 1px rgba(16, 20, 46, .12); }
.rp-root .g2l-empty { display: grid; justify-items: center; gap: 14px; padding: 48px 20px; border-radius: 24px; background: #fff; box-shadow: var(--ds-shadow-card); text-align: center; }
.rp-root .g2l-empty p { margin: 0; font: 500 16px/1.4 var(--ds-font-body); color: var(--ds-ink); }
/* reveal */
.rp-root .g2l :is(.g2l-head, .g2l-books > *, .g2l-side, .g2l-bar, .g2l-rows > *) { opacity: 0; transform: translate3d(0, 14px, 0); transition: opacity .7s ease, transform .9s var(--rp-ease); }
.rp-root .g2l.is-in :is(.g2l-head, .g2l-books > *, .g2l-side, .g2l-bar, .g2l-rows > *) { opacity: 1; transform: none; }
.rp-root .g2l.is-in .g2l-books > :nth-child(2) { transition-delay: .08s; } .rp-root .g2l.is-in .g2l-books > :nth-child(3) { transition-delay: .16s; }
.rp-root .g2l .g2l-side { transform: none; }

/* ---------------------------------------------------------------- guide page: cover frame in the hero */
.rp-root .g2-frame { position: relative; width: 100%; max-width: 560px; justify-self: end; --tx: 0; --ty: 0; }
.rp-root .g2-frame-sheet { display: block; border-radius: 26px; overflow: hidden; background: #fff; box-shadow: 0 0 0 1px rgba(16, 20, 46, .06), 0 50px 90px -50px rgba(16, 30, 80, .55);
  transform: perspective(1200px) rotateY(calc(var(--tx) * 5deg)) rotateX(calc(var(--ty) * -4deg)); transition: transform .6s var(--rp-ease); }
.rp-root .g2-frame-sheet svg, .rp-root .g2-frame-sheet img { display: block; width: 100%; aspect-ratio: 400 / 260; object-fit: cover; }
.rp-root .g2-frame-back { position: absolute; inset: 6% -4% -6% 6%; z-index: -1; border-radius: 26px; background: var(--g2-tone-soft, #eef3ff); transform: rotate(4deg); }

/* ---------------------------------------------------------------- responsive */
@media (max-width: 991px) {
  .rp-root .g2h--split .g2h-in { grid-template-columns: 1fr; gap: 44px; }
  .rp-root .g2h-text { justify-items: center; text-align: center; } .rp-root .g2h-title { max-width: 18ch; }
  .rp-root .g2h-art { justify-self: center; max-width: 520px; }
  .rp-root .g2l-grid { grid-template-columns: 1fr; gap: 18px; }
  .rp-root .g2l-side { position: static; padding: 0; background: none; box-shadow: none; }
  .rp-root .g2l-side-t { display: none; }
  .rp-root .g2l-topics { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; padding: 2px 2px 6px; }
  .rp-root .g2l-topics::-webkit-scrollbar { display: none; }
  .rp-root .g2l-topic { width: auto; flex: none; grid-template-columns: 26px auto auto; gap: 8px; padding: 6px 12px 6px 6px; border-radius: 999px; background: #fff; box-shadow: 0 0 0 1px rgba(16, 20, 46, .08); white-space: nowrap; }
  .rp-root .g2l-ic { width: 26px; height: 26px; padding: 5px; border-radius: 50%; }
  .rp-root .g2l-books { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rp-root .g2l-books > :nth-child(3) { display: none; }
  .rp-root .g2c--row { grid-template-columns: minmax(0, 240px) minmax(0, 1fr); gap: 22px; padding-right: 22px; }
  .rp-root .g2-frame { justify-self: center; }
}
@media (max-width: 640px) {
  .rp-root .g2h-search { height: 56px; } .rp-root .g2h-search button { padding: 0 16px; }
  .rp-root .g2h-art { aspect-ratio: 1 / .78; }
  .rp-root .g2l-head { flex-direction: column; align-items: flex-start; }
  .rp-root .g2l-books { grid-template-columns: 1fr; } .rp-root .g2l-books > :nth-child(3) { display: grid; }
  .rp-root .g2c--row, .rp-root .g2-cardwrap .g2c--row { grid-template-columns: 1fr; gap: 0; padding: 10px 10px 20px; }
  .rp-root .g2c--row .g2c-body { padding: 18px 12px 0; }
  .rp-root .g2l-bar { flex-direction: column; } .rp-root .g2l-sort { width: 100%; }
  .rp-root .g2c-title { --g2c-title: 19px; }
  .rp-root .g2l-feat { margin-bottom: 64px; }
}
@media (prefers-reduced-motion: reduce) {
  .rp-root .g2h-text > *, .rp-root .g2h-sheet, .rp-root .g2l :is(.g2l-head, .g2l-books > *, .g2l-side, .g2l-bar, .g2l-rows > *) { transition: none !important; }
  .rp-root .g2h .hv-wi { transform: none; }
  .rp-root .g2c, .rp-root .g2c-cover svg, .rp-root .g2c-cover img, .rp-root .g2-frame-sheet { transition: none; }
}
/* v73.1 phone fixes: topic chips as inline pills (no grid squeeze), search keeps its height in the stacked bar, cover stack stays on screen */
@media (max-width: 991px) {
  .rp-root .g2l-topic { display: inline-flex; align-items: center; gap: 8px; }
  .rp-root .g2l-topic .g2l-tn { min-width: auto; white-space: nowrap; }
}
@media (max-width: 640px) {
  .rp-root .g2l-search { flex: none; width: 100%; box-sizing: border-box; }
  .rp-root .g2h-sheet--1 { --x: 8%; } .rp-root .g2h-sheet--2 { --x: -8%; }
  .rp-root .g2h-art:hover .g2h-sheet--1 { --x: 10%; } .rp-root .g2h-art:hover .g2h-sheet--2 { --x: -10%; }
  .rp-root .g2h-search input { font-size: 15px; }
}