/*
 * Learn look (Local only): Learn's own layer on the approved homepage language (owner brief "LEARN EXPERIENCE
 * REVAMP", 23 Oct 2026). Loads after home.css (components), shj-base.css (bands, the section head, nodes),
 * shj-thread.css (the Sneaky Thread), the Sneaky Line base and the Helper pages' sheets, all read-only. Every selector
 * starts with .shh.shj.sll, body.sh-learn or html.sll-*; no --sh-* token is defined here. Motion lives only inside
 * prefers-reduced-motion: no-preference.
 * The thread for the landing: Discover (amber) → Explore (teal) → Featured (sky, on night) → Latest (blue) →
 * Authors (pink) → Use (green), then Support's own band and the footer.
 * Breakpoints as the homepage: 480, 768, 1024, 1280 (plus 560 and 640 where the cards need them).
 */

/* ---------- page container ---------- */
body.sh-learn main#content.site-main.sll-main { width: 100%; max-width: none; margin-inline: 0; padding: 0; }

/* focus: the homepage's ink ring (the site-wide amber ring is 2.1:1 on white) */
body.sh-learn .shh.sll :focus-visible { outline: 2px solid #122c3a !important; outline-offset: 3px !important; box-shadow: 0 0 0 5px #fff !important; }
body.sh-learn .shh.sll .sll-night :focus-visible { outline-color: #e6a817 !important; box-shadow: none !important; }
body.sh-learn .shh.sll .sll-night .sll-card :focus-visible { outline-color: #122c3a !important; box-shadow: 0 0 0 5px #fff !important; }

/* ---------- tones: thread stops, halos, node fills, say colours ---------- */
.shh.shj.sll {
	--shj-learn: #b8740a; --shj-explore: #3fb39d; --shj-featured: #6ec4e8; --shj-latest: #4ea6ec; --shj-authors: #d6336c; --shj-use: #5cb860;
	--sll-ink: var(--shh-ink, #122c3a); --sll-copy: var(--shh-copy, #375568); --sll-muted: #587183;
	--sll-amber: #b8740a; --sll-amber-ink: #8a5a06; --sll-pink: #d6336c; --sll-pink-ink: #b0285a; --sll-rose: #fdf0f5;
	--sll-card: 0 30px 56px -44px rgba(18, 44, 58, .55);
	overflow-x: clip;
}
.shh.shj.sll [data-shj-tone="learn"] { --shj-tone: var(--shj-learn); --shj-halo: rgba(184, 116, 10, .42); --shj-say: #8a5a06; --sll-tone-ink: #8a5a06; }
.shh.shj.sll [data-shj-tone="explore"] { --shj-tone: var(--shj-explore); --shj-halo: rgba(63, 179, 157, .42); --shj-say: #1d6b61; --sll-tone-ink: #1d6b61; }
.shh.shj.sll [data-shj-tone="featured"] { --shj-tone: var(--shj-featured); --shj-halo: rgba(110, 196, 232, .45); --shj-say: #8fd3ef; --sll-tone-ink: #8fd3ef; }
.shh.shj.sll [data-shj-tone="latest"] { --shj-tone: var(--shj-latest); --shj-halo: rgba(78, 166, 236, .42); --shj-say: #1b6fae; --sll-tone-ink: #1b6fae; }
.shh.shj.sll [data-shj-tone="authors"] { --shj-tone: var(--shj-authors); --shj-halo: rgba(214, 51, 108, .4); --shj-say: #b0285a; --sll-tone-ink: #b0285a; }
.shh.shj.sll [data-shj-tone="use"] { --shj-tone: var(--shj-use); --shj-halo: rgba(92, 184, 96, .42); --shj-say: #2f7a34; --sll-tone-ink: #2f7a34; }
@supports (color: color-mix(in srgb, red 50%, blue)) {
	.shh.shj.sll [data-shj-tone] [data-shj-node]::before { background: radial-gradient(closest-side, color-mix(in srgb, var(--shj-tone, #b8740a) 42%, transparent), transparent); }
}
.shh.shj.sll .sll-node--explore { background-color: #24857a; }
.shh.shj.sll .sll-node--featured { background-color: #1d6f97; background-image: radial-gradient(circle at 50% 28%, rgba(255, 255, 255, .42), rgba(255, 255, 255, 0) 60%), linear-gradient(140deg, #1d6f97, #2b8fd6 60%, #6ec4e8); }
.shh.shj.sll .sll-node--latest { background-color: #2b8fd6; }
.shh.shj.sll .sll-node--authors { background-color: #b0285a; }
.shh.shj.sll .sll-node--use { background-color: #3d9442; }
.shh.shj.sll .shj-node .sl-i { width: calc(var(--shj-node) / 2); height: calc(var(--shj-node) / 2); color: #fff; }
.shh.shj.sll .sl-i { flex: none; }
.shh.shj.sll .sll-h .sll-verb { color: var(--sll-tone-ink, var(--sll-amber-ink)); }
.shh.shj.sll .sll-head .shj-lead { max-width: 54ch; }

/* ---------- bands: each chapter owns its ground ---------- */
.shh.shj.sll .sll-sec--explore { background: linear-gradient(180deg, #f6fbfa 0%, #edf6f2 100%); border-top: 1px solid #dcebe6; }
.shh.shj.sll .sll-sec--latest { background: radial-gradient(46% 36% at 92% 8%, rgba(78, 166, 236, .09), rgba(78, 166, 236, 0) 70%), #fff; border-top: 1px solid var(--shh-line-soft); }
.shh.shj.sll .sll-sec--authors { background: linear-gradient(180deg, #ffffff 0%, #fdf2f7 100%); border-top: 1px solid #f4e1ea; }
.shh.shj.sll .sll-sec--use { background: linear-gradient(180deg, #ffffff 0%, #f2f8ef 100%); border-top: 1px solid var(--shh-line-soft); }
/* Featured: the night band (the homepage's My Journey ground), so the chosen guides stand out */
.shh.shj.sll .sll-night { background: #0f2230; color: #b8ccd8; }
.shh.shj.sll .sll-night-bg { position: absolute; inset: 0; pointer-events: none; background:
	radial-gradient(40% 50% at 12% 8%, rgba(29, 111, 151, .42), rgba(29, 111, 151, 0) 70%),
	radial-gradient(44% 50% at 86% 78%, rgba(110, 196, 232, .16), rgba(110, 196, 232, 0) 70%),
	radial-gradient(28% 30% at 94% 12%, rgba(184, 116, 10, .16), rgba(184, 116, 10, 0) 70%),
	linear-gradient(180deg, #0f2230 0%, #11293a 60%, #0d2130 100%); }
.shh.shj.sll .sll-night-bg::after { content: ""; position: absolute; inset: 0; background-image: radial-gradient(rgba(255, 255, 255, .5) .8px, transparent 1.3px); background-size: 46px 46px; opacity: .12;
	-webkit-mask-image: radial-gradient(70% 60% at 50% 40%, #000 30%, transparent 85%); mask-image: radial-gradient(70% 60% at 50% 40%, #000 30%, transparent 85%); }
.shh.shj.sll .sll-night .shj-h { color: #f2f8fb; }
.shh.shj.sll .sll-night .shj-lead { color: #b4c8d4; }
.shh.shj.sll .sll-night .shj-node { box-shadow: 0 0 0 7px #0f2230, 0 14px 26px -12px rgba(0, 0, 0, .6); }

/* ---------- shared bits ---------- */
.shh.shj.sll .shj-vh { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.shh.shj.sll .sll-grid2 { display: grid; grid-template-columns: minmax(0, 1fr); }
.shh.shj.sll .sll-grid2 > * { min-width: 0; }
.shh.shj.sll a { text-decoration: none; }
.shh.shj.sll [hidden] { display: none !important; }
.shh.shj.sll .sll-error { padding-block: 14px; background: #fdf4f8; border-block: 2px solid #b0285a; color: #5e1a39; font: 600 15px/1.5 var(--shh-text); }
@media (min-width: 1024px) {
	.shh.shj.sll .sll-grid2 { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: 56px; align-items: start; }
	/* nothing shares the node's row: the thread crosses that row to its lane */
	.shh.shj.sll .sll-grid2 > :not(.shj-head) { margin-top: var(--shj-node-row); }
	/* the head's column carries the chapter's secondary links, so neither column runs on alone */
	.shh.shj.sll .sll-grid2--explore, .shh.shj.sll .sll-grid2--authors { grid-template-rows: auto 1fr; }
	.shh.shj.sll .sll-grid2--explore { grid-template-areas: "head main" "more main"; }
	.shh.shj.sll .sll-grid2--authors { grid-template-areas: "head main" "more main"; }
	.shh.shj.sll .sll-grid2--explore > .shj-head, .shh.shj.sll .sll-grid2--authors > .shj-head { grid-area: head; }
	.shh.shj.sll .sll-grid2--explore > .sll-topics-wrap, .shh.shj.sll .sll-grid2--authors > .sll-authors { grid-area: main; }
	.shh.shj.sll .sll-grid2--explore > .sll-explore-more, .shh.shj.sll .sll-grid2--authors > .sll-authors-more { grid-area: more; align-self: start; margin-top: 28px; }
}

/* buttons: Hello Elementor's reset paints every button pink on hover and focus; restate each state */
.shh.shj.sll button { font-family: var(--shh-text); text-transform: none; letter-spacing: 0; }
.shh.shj.sll .shh-btn--primary:hover, .shh.shj.sll .shh-btn--primary:focus { background: var(--shh-teal-deep); color: #fff; white-space: nowrap; }
.shh.shj.sll .shh-btn--ghost:hover, .shh.shj.sll .shh-btn--ghost:focus { background: #fff; color: var(--shh-ink); white-space: nowrap; }
.shh.shj.sll .shh-btn .sl-i { width: 19px; height: 19px; }
.shh.shj.sll .shh-btn--ghost .sl-i { color: var(--shh-teal); }

/* ---------- the review strip (flagged copy only; in flow, never fixed) ---------- */
body.sh-learn .sll-review { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 24px; padding: 10px clamp(16px, 4vw, 48px); background: #122c3a; color: #e8f1f5; font: 500 14px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }
body.sh-learn .sll-review p { margin: 0; display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: baseline; }
body.sh-learn .sll-review strong { font-weight: 800; color: #fff; }
body.sh-learn .sll-review span { color: #b4c8d4; }
body.sh-learn .sll-review a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Discover: the hero ---------- */
.shh.shj.sll .sll-hero { position: relative; padding-block: clamp(26px, 3.4vw, 52px) clamp(56px, 6vw, 92px);
	background: radial-gradient(52% 64% at 84% 34%, rgba(243, 220, 180, .7), rgba(243, 220, 180, 0) 70%), linear-gradient(180deg, #fffaf2 0%, #fdf4e4 100%); border-bottom: 1px solid #f1e6cc; }
.shh.shj.sll .sll-hero::after { content: ""; position: absolute; inset: 0; pointer-events: none; background-image: radial-gradient(rgba(184, 116, 10, .1) 1px, transparent 1.4px); background-size: 22px 22px;
	-webkit-mask-image: linear-gradient(90deg, #000 0%, transparent 55%); mask-image: linear-gradient(90deg, #000 0%, transparent 55%); }
.shh.shj.sll .sll-hero-grid { display: grid; grid-template-columns: minmax(0, 1fr); row-gap: 28px; align-items: center; }
.shh.shj.sll .sll-hero-grid > * { min-width: 0; }
.shh.shj.sll .sll-hero-copy { max-width: 720px; }
.shh.shj.sll .sll-kicker { display: inline-flex; align-items: center; gap: 10px; font: 800 13px/1 var(--shh-text); letter-spacing: .14em; text-transform: uppercase; color: var(--sll-amber-ink); }
.shh.shj.sll .sll-kicker-badge { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: var(--sll-amber); color: #fff; box-shadow: 0 0 0 5px #f8e8c9; }
.shh.shj.sll .sll-kicker-badge .shh-i { width: 17px; height: 17px; }
.shh.shj.sll .sll-h1 { margin-top: 18px; font: 800 clamp(2.4rem, 1.3rem + 3.9vw, 4.4rem)/1 var(--shh-display); letter-spacing: -.045em; color: var(--sll-ink); text-wrap: balance; }
.shh.shj.sll .sll-lead { margin-top: 20px; max-width: 54ch; font: 400 clamp(1.05rem, .98rem + .35vw, 1.2rem)/1.6 var(--shh-text); color: var(--sll-copy); }
.shh.shj.sll .sll-search { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; max-width: 640px; margin-top: 26px; }
.shh.shj.sll .sll-search-field { position: relative; display: flex; align-items: center; }
.shh.shj.sll .sll-search-field > .sl-i { position: absolute; left: 20px; width: 22px; height: 22px; color: var(--sll-amber); pointer-events: none; }
.shh.shj.sll .sll-search input[type="search"] { width: 100%; min-height: 60px; margin: 0; padding: 0 22px 0 54px; border: 1.5px solid #ead7b2; border-radius: 999px; background: #fff; color: var(--sll-ink); font: 400 17px/1.4 var(--shh-text); box-shadow: 0 20px 40px -32px rgba(138, 90, 6, .6); -webkit-appearance: none; appearance: none; }
.shh.shj.sll .sll-search input[type="search"]::placeholder { color: #7a8a95; opacity: 1; }
.shh.shj.sll .sll-search input[type="search"]:focus { border-color: var(--sll-amber); outline: none; }
.shh.shj.sll .sll-search-go { min-height: 60px; justify-content: center; }
.shh.shj.sll .sll-can { margin-top: 22px; }
.shh.shj.sll .sll-can li { font-size: 15.5px; }
.shh.shj.sll .sll-can .shh-i { color: var(--sll-amber); }
.shh.shj.sll .sll-fine { margin-top: 16px; }
.shh.shj.sll .sll-stage { display: none; position: relative; }
.shh.shj.sll .sll-stage-disc { position: absolute; inset: 8% 6%; border-radius: 50%; background: radial-gradient(closest-side, rgba(255, 255, 255, .95), rgba(255, 255, 255, .35) 70%, rgba(255, 255, 255, 0)); }
.shh.shj.sll .sll-book { position: relative; }
@media (min-width: 480px) {
	.shh.shj.sll .sll-search { grid-template-columns: minmax(0, 1fr) auto; }
}
@media (min-width: 768px) {
	.shh.shj.sll .sll-hero-grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); column-gap: 32px; }
	.shh.shj.sll .sll-stage { display: block; }
}
@media (min-width: 1024px) {
	.shh.shj.sll .sll-hero-grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); column-gap: 48px; }
	.shh.shj.sll .sll-stage { max-width: 560px; justify-self: end; width: 100%; }
}

/* ---------- Explore topics ---------- */
.shh.shj.sll .sll-topics-wrap { margin-top: 26px; }
.shh.shj.sll .sll-topics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.shh.shj.sll .sll-topics > li { display: grid; min-width: 0; }
.shh.shj.sll .sll-topic { position: relative; display: grid; grid-template-columns: 36px minmax(0, 1fr); align-items: center; gap: 10px; min-height: 64px; padding: 12px; border: 1px solid #dcebe6; border-radius: 18px; background: #fff; color: var(--sll-ink); box-shadow: 0 18px 32px -28px rgba(18, 44, 58, .5); }
.shh.shj.sll .sll-topic:hover { border-color: var(--t, #246b5f); color: var(--sll-ink); }
.shh.shj.sll .sll-tbadge { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--t, #246b5f); color: #fff; box-shadow: 0 0 0 4px var(--t-soft, #e6f3ef); }
.shh.shj.sll .sll-tbadge .sl-i { width: 19px; height: 19px; }
.shh.shj.sll .sll-topic-t { display: grid; gap: 2px; min-width: 0; }
.shh.shj.sll .sll-topic-t b { font: 750 15px/1.2 var(--shh-display); letter-spacing: -.01em; color: var(--sll-ink); overflow-wrap: anywhere; }
.shh.shj.sll .sll-topic-t span { font-size: 13px; line-height: 1.3; color: var(--sll-muted); }
.shh.shj.sll .sll-topic-faces, .shh.shj.sll .sll-topic-go { display: none; }
.shh.shj.sll .sll-topic-faces { align-items: center; }
.shh.shj.sll .sll-topic-faces .sl-face { --sl-fs: 28px; }
.shh.shj.sll .sll-topic-faces .sl-face + .sl-face { margin-left: -9px; }
.shh.shj.sll .sll-topic-faces .sl-face img { box-shadow: 0 0 0 2px #fff; }
.shh.shj.sll .sll-topic-go { color: var(--t, #246b5f); }
.shh.shj.sll .sll-topic-go .shh-i { width: 18px; height: 18px; }
.shh.shj.sll .sll-explore-more { margin-top: 18px; }
.shh.shj.sll .sll-more { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.shh.shj.sll .sll-more-k { font: 800 12px/1 var(--shh-text); letter-spacing: .1em; text-transform: uppercase; color: var(--sll-muted); }
.shh.shj.sll .sll-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.shh.shj.sll .sll-chip { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 7px 14px; border: 1px solid #d5e6e1; border-radius: 999px; background: #fff; color: var(--sll-ink); font: 600 14px/1.2 var(--shh-text); }
.shh.shj.sll .sll-chip:hover { border-color: var(--t, #246b5f); color: var(--sll-ink); }
.shh.shj.sll .sll-chip-dot { width: 9px; height: 9px; flex: none; border-radius: 50%; background: var(--t, #246b5f); box-shadow: 0 0 0 3px var(--t-soft, #e6f3ef); }
.shh.shj.sll .sll-chip-n { font-size: 12.5px; font-weight: 700; color: var(--sll-muted); }
.shh.shj.sll .sll-faith { margin-top: 16px; }
.shh.shj.sll .sll-faith a { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border: 1px dashed #d9c9a8; border-radius: 18px; background: rgba(255, 255, 255, .7); color: var(--sll-copy); font-size: 14.5px; line-height: 1.45; }
.shh.shj.sll .sll-faith a:hover { border-style: solid; border-color: var(--sll-amber); color: var(--sll-copy); }
.shh.shj.sll .sll-faith b { color: var(--sll-ink); }
.shh.shj.sll .sll-faith > a > span { flex: 1 1 auto; }
.shh.shj.sll .sll-faith .shh-i { width: 18px; height: 18px; flex: none; color: var(--sll-amber-ink); }
@media (min-width: 560px) {
	.shh.shj.sll .sll-topic { grid-template-columns: 44px minmax(0, 1fr) auto 18px; gap: 12px; min-height: 72px; padding: 12px 14px; }
	.shh.shj.sll .sll-tbadge { width: 44px; height: 44px; box-shadow: 0 0 0 5px var(--t-soft, #e6f3ef); }
	.shh.shj.sll .sll-tbadge .sl-i { width: 23px; height: 23px; }
	.shh.shj.sll .sll-topic-t b { font-size: 16.5px; }
	.shh.shj.sll .sll-topic-t span { font-size: 13.5px; }
	.shh.shj.sll .sll-topic-faces, .shh.shj.sll .sll-topic-go { display: inline-flex; }
}
@media (min-width: 1024px) {
	.shh.shj.sll .sll-topics-wrap { margin-top: var(--shj-node-row); }
}

/* ---------- the guide card ---------- */
.shh.shj.sll .sll-card { position: relative; display: flex; flex-direction: column; min-width: 0; background: #fff; border: 1px solid var(--shh-line-soft); border-radius: 22px; overflow: clip; box-shadow: var(--sll-card); }
.shh.shj.sll .sll-card-media .sl-cover { border-radius: 0; }
.shh.shj.sll .sll-card-body { display: flex; flex: 1 1 auto; flex-direction: column; gap: 8px; padding: 16px 18px 18px; }
.shh.shj.sll .sll-card-k { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font: 800 11.5px/1.3 var(--shh-text); letter-spacing: .1em; text-transform: uppercase; color: var(--sll-muted); }
.shh.shj.sll .sll-card-topic { display: inline-flex; align-items: center; gap: 7px; color: var(--t, #375568); }
.shh.shj.sll .sll-card-topic::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--t, #375568); box-shadow: 0 0 0 3px var(--t-soft, #eef3f6); }
.shh.shj.sll .sll-card-k time { font-weight: 700; letter-spacing: .06em; }
.shh.shj.sll .sll-card-t { font: 750 1.12rem/1.25 var(--shh-display); letter-spacing: -.012em; text-wrap: balance; }
.shh.shj.sll .sll-card-t a { color: var(--sll-ink); }
/* the title is the card's one link; it covers the card, the Ask button and the heart sit above it */
.shh.shj.sll .sll-card-t a::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
.shh.shj.sll .sll-card-t a:hover { color: var(--sll-ink); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; text-decoration-color: var(--t-acc, #6ec4e8); }
.shh.shj.sll .sll-card-dek { font-size: 14.5px; line-height: 1.5; color: var(--sll-copy); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.shh.shj.sll .sll-card-by { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-top: 2px; }
.shh.shj.sll .sll-card-by .sl-face { --sl-fs: 28px; }
.shh.shj.sll .sll-card-who { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; min-width: 0; }
.shh.shj.sll .sll-card-who b { font: 700 14px/1.3 var(--shh-text); color: var(--sll-ink); }
.shh.shj.sll .sll-card-who .shl-kind { font-size: 12.5px; }
.shh.shj.sll .sll-card-min { font-size: 13px; color: var(--sll-muted); }
.shh.shj.sll .sll-card-acts { position: relative; z-index: 2; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; margin-top: auto; padding-top: 10px; border-top: 1px dashed var(--shh-line-soft); pointer-events: none; }
.shh.shj.sll .sll-card-acts > * { pointer-events: auto; }
.shh.shj.sll .sll-card-read { display: inline-flex; align-items: center; gap: 6px; font: 700 14.5px/1.2 var(--shh-text); color: #246b5f; }
.shh.shj.sll .sll-card-read .shh-i { width: 16px; height: 16px; }
.shh.shj.sll .sll-card-ask { display: inline-flex; align-items: center; gap: 7px; min-height: 40px; padding: 7px 14px; border: 1.5px solid #ecc9d8; border-radius: 999px; background: #fff; color: var(--sll-pink-ink); font: 700 14px/1.2 var(--shh-text); cursor: pointer; white-space: nowrap; }
.shh.shj.sll .sll-card-ask .sl-i { width: 17px; height: 17px; }
.shh.shj.sll .sll-card-ask:hover, .shh.shj.sll .sll-card-ask:focus { border-color: var(--sll-pink); background: var(--sll-rose); color: var(--sll-pink-ink); white-space: nowrap; }
.shh.shj.sll .sll-card .sfav-heart { z-index: 3; }
.shh.shj.sll .sll-card:hover { border-color: var(--t-glow, #c7ddeb); box-shadow: 0 36px 64px -44px rgba(18, 44, 58, .62); }

/* the featured lead: wider cover, display title, two buttons */
.shh.shj.sll .sll-card--lead { border: 0; border-radius: 26px; box-shadow: 0 40px 80px -40px rgba(0, 0, 0, .7); }
.shh.shj.sll .sll-card--lead .sll-card-body { gap: 10px; padding: 20px 22px 24px; }
.shh.shj.sll .sll-card--lead .sll-card-t { font-size: clamp(1.45rem, 1.1rem + 1.1vw, 1.95rem); line-height: 1.12; letter-spacing: -.025em; }
.shh.shj.sll .sll-card--lead .sll-card-t a::after { display: none; } /* the lead carries its own buttons */
.shh.shj.sll .sll-card--lead .sll-card-dek { font-size: 15.5px; -webkit-line-clamp: 3; }
.shh.shj.sll .sll-lead-acts { margin-top: 8px; }
.shh.shj.sll .sll-ask-btn { cursor: pointer; }
.shh.shj.sll .sll-ask-btn .sl-i { color: var(--sll-pink-ink); }
.shh.shj.sll .shh-btn--primary.sll-ask-btn .sl-i { color: #fff; }

/* a pick: the thumbnail beside the text */
.shh.shj.sll .sll-card--pick { display: grid; grid-template-columns: 104px minmax(0, 1fr); align-items: stretch; border: 0; border-radius: 18px; box-shadow: 0 26px 50px -36px rgba(0, 0, 0, .7); }
.shh.shj.sll .sll-card--pick .sll-card-media { position: relative; min-height: 100%; }
.shh.shj.sll .sll-card--pick .sll-card-media .sl-cover { position: absolute; inset: 0; aspect-ratio: auto; height: 100%; }
.shh.shj.sll .sll-card--pick .sll-card-body { justify-content: center; gap: 6px; padding: 14px 44px 14px 16px; }
.shh.shj.sll .sll-card--pick .sll-card-t { font-size: 1.02rem; }
.shh.shj.sll .sll-card--pick .sll-card-who .shl-kind { display: none; }
.shh.shj.sll .sll-card--pick .sll-card-by { flex-wrap: nowrap; align-items: flex-start; }
.shh.shj.sll .sll-card--pick .sll-card-who { flex: 1 1 auto; }
.shh.shj.sll .sll-card--pick .sll-card-who b { font-size: 13.5px; }
.shh.shj.sll .sll-card--pick .sll-card-by .sl-face { --sl-fs: 24px; }
@media (min-width: 640px) {
	.shh.shj.sll .sll-card--pick { grid-template-columns: 150px minmax(0, 1fr); }
}

/* ---------- Featured knowledge ---------- */
.shh.shj.sll .sll-feature { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; margin-top: 32px; }
.shh.shj.sll .sll-picks { display: grid; gap: 14px; align-content: start; }
.shh.shj.sll .sll-picks-k { font: 800 12.5px/1 var(--shh-text); letter-spacing: .14em; text-transform: uppercase; color: #8fd3ef; }
@media (min-width: 640px) and (max-width: 899.98px) {
	/* tablets: the lead's cover beside its words, so it leads without filling the screen */
	.shh.shj.sll .sll-card--lead { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); }
	.shh.shj.sll .sll-card--lead .sll-card-media { position: relative; min-height: 100%; }
	.shh.shj.sll .sll-card--lead .sll-card-media .sl-cover { position: absolute; inset: 0; aspect-ratio: auto; height: 100%; }
	.shh.shj.sll .sll-card--lead .sll-card-t { font-size: 1.4rem; }
	.shh.shj.sll .sll-picks { grid-template-columns: minmax(0, 1fr); }
}
@media (min-width: 900px) {
	.shh.shj.sll .sll-feature { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 28px; align-items: stretch; }
	.shh.shj.sll .sll-feature.is-solo { grid-template-columns: minmax(0, 1fr); max-width: 820px; margin-inline: auto; }
	.shh.shj.sll .sll-picks { grid-template-rows: auto; grid-auto-rows: 1fr; align-content: stretch; }
	.shh.shj.sll .sll-card--lead .sll-card-media .sl-cover { aspect-ratio: 2 / 1; }
}
@media (min-width: 1024px) {
	.shh.shj.sll .sll-feature { margin-top: 40px; }
}

/* ---------- Latest guides: the bar, the compact topic control, the cards, the pages ---------- */
.shh.shj.sll .sll-region { margin-top: 28px; scroll-margin-top: 110px; }
.shh.shj.sll .sll-region[aria-busy="true"] .sll-cards { opacity: .55; transition: opacity .2s ease; }
.shh.shj.sll .sll-bar { position: relative; z-index: 4; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 16px; padding-bottom: 16px; border-bottom: 1px solid var(--shh-line-soft); }
.shh.shj.sll .sll-count { font: 700 15.5px/1.4 var(--shh-text); color: var(--sll-ink); scroll-margin-top: 120px; }
.shh.shj.sll .sll-count:focus { outline: none; }
.shh.shj.sll .sll-bar-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.shh.shj.sll .sll-active { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 14px; border-radius: 999px; background: var(--t-soft, #e7f3fc); color: var(--t, #1b6fae); border: 1.5px solid var(--t, #1b6fae); font: 700 14.5px/1.2 var(--shh-text); }
.shh.shj.sll .sll-active:hover { background: #fff; color: var(--t, #1b6fae); }
.shh.shj.sll .sll-active-x { font-size: 18px; line-height: 1; }
.shh.shj.sll .sll-pick { position: relative; }
.shh.shj.sll .sll-pick > summary { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 16px; border: 1.5px solid var(--shh-line); border-radius: 999px; background: #fff; color: var(--sll-ink); font: 600 14.5px/1.2 var(--shh-text); list-style: none; cursor: pointer; }
.shh.shj.sll .sll-pick > summary::-webkit-details-marker { display: none; }
.shh.shj.sll .sll-pick > summary:hover, .shh.shj.sll .sll-pick[open] > summary { border-color: #2b8fd6; }
.shh.shj.sll .sll-pick-k { font: 800 11.5px/1 var(--shh-text); letter-spacing: .1em; text-transform: uppercase; color: var(--sll-muted); }
.shh.shj.sll .sll-pick > summary .shh-i { width: 16px; height: 16px; color: #1b6fae; transition: transform .2s ease; }
.shh.shj.sll .sll-pick[open] > summary .shh-i { transform: rotate(180deg); }
.shh.shj.sll .sll-pick-list { display: grid; gap: 2px; margin-top: 10px; padding: 8px; border: 1px solid var(--shh-line-soft); border-radius: 18px; background: #fff; box-shadow: 0 30px 60px -30px rgba(18, 44, 58, .45); }
.shh.shj.sll .sll-pick-list a { display: flex; align-items: center; gap: 10px; min-height: 40px; padding: 8px 12px; border-radius: 12px; color: var(--sll-ink); font: 600 14.5px/1.25 var(--shh-text); }
.shh.shj.sll .sll-pick-list a > span:last-child { margin-left: auto; font-size: 12.5px; font-weight: 700; color: var(--sll-muted); }
.shh.shj.sll .sll-pick-list a:hover { background: #f2f7fa; color: var(--sll-ink); }
.shh.shj.sll .sll-pick-list a[aria-current] { background: var(--t-soft, #e7f3fc); font-weight: 800; }
.shh.shj.sll .sll-cards { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; margin-top: 24px; }
.shh.shj.sll .sll-empty { margin-top: 24px; padding: 22px 24px; border: 1.5px dashed var(--shh-line); border-radius: 20px; background: #fff; }
.shh.shj.sll .sll-empty p { font-size: 16px; line-height: 1.5; color: var(--sll-copy); }
.shh.shj.sll .sll-empty .shh-actions { margin-top: 14px; }
.shh.shj.sll .sll-pager { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; margin-top: 32px; }
.shh.shj.sll .sll-pager-k { font: 700 14px/1 var(--shh-text); color: var(--sll-muted); }
.shh.shj.sll .sll-pager ul.page-numbers { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0; padding: 0; list-style: none; }
.shh.shj.sll .sll-pager .page-numbers li { margin: 0; }
.shh.shj.sll .sll-pager a.page-numbers, .shh.shj.sll .sll-pager span.page-numbers { display: inline-grid; place-items: center; min-width: 44px; min-height: 44px; padding: 0 14px; border: 1.5px solid var(--shh-line); border-radius: 999px; background: #fff; color: var(--sll-ink); font: 700 15px/1 var(--shh-text); }
.shh.shj.sll .sll-pager a.page-numbers:hover { border-color: #2b8fd6; color: var(--sll-ink); }
.shh.shj.sll .sll-pager span.page-numbers.current { background: var(--sll-ink); border-color: var(--sll-ink); color: #fff; }
.shh.shj.sll .sll-pager span.page-numbers.dots { border-color: transparent; background: transparent; min-width: 24px; padding: 0; }
@media (max-width: 639.98px) {
	/* phones: each guide is a compact row (its cover beside the words), so twelve guides stay a short scroll */
	.shh.shj.sll .sll-cards { gap: 12px; }
	.shh.shj.sll .sll-cards .sll-card--card { display: grid; grid-template-columns: 108px minmax(0, 1fr); border-radius: 18px; }
	.shh.shj.sll .sll-cards .sll-card--card .sll-card-media { position: relative; min-height: 100%; }
	.shh.shj.sll .sll-cards .sll-card--card .sll-card-media .sl-cover { position: absolute; inset: 0; aspect-ratio: auto; height: 100%; }
	.shh.shj.sll .sll-cards .sll-card--card .sll-card-body { gap: 6px; padding: 12px 44px 12px 14px; }
	.shh.shj.sll .sll-cards .sll-card--card .sll-card-t { font-size: 1rem; }
	.shh.shj.sll .sll-cards .sll-card--card .sll-card-dek, .shh.shj.sll .sll-cards .sll-card--card .sll-card-read, .shh.shj.sll .sll-cards .sll-card--card .sll-card-who .shl-kind { display: none; }
	.shh.shj.sll .sll-cards .sll-card--card .sll-card-by .sl-face { --sl-fs: 24px; }
	.shh.shj.sll .sll-cards .sll-card--card .sll-card-who b { font-size: 13px; }
	.shh.shj.sll .sll-cards .sll-card--card .sll-card-acts { padding-top: 8px; margin-right: -30px; justify-content: flex-start; }
	.shh.shj.sll .sll-cards .sll-card--card .sll-card-ask { min-height: 36px; padding: 6px 12px; font-size: 13.5px; }
	/* phones: the topic list opens in place, under the bar (no floating panel) */
	.shh.shj.sll .sll-bar-tools { width: 100%; }
	.shh.shj.sll .sll-pick { flex: 1 1 100%; }
	.shh.shj.sll .sll-pick > summary { width: 100%; }
	.shh.shj.sll .sll-pick > summary b { margin-right: auto; }
	.shh.shj.sll .sll-pick-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 640px) {
	.shh.shj.sll .sll-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
	.shh.shj.sll .sll-pick-list { position: absolute; right: 0; top: calc(100% + 8px); width: min(340px, 86vw); max-height: min(420px, 62vh); overflow: auto; margin-top: 0; }
}
@media (min-width: 1024px) {
	.shh.shj.sll .sll-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
}

/* ---------- Meet the authors: the cast on the line, one spotlight ---------- */
.shh.shj.sll .sll-authors { margin-top: 26px; }
.shh.shj.sll .sll-cast-wrap { position: relative; }
.shh.shj.sll .sll-cast-line { display: none; }
.shh.shj.sll .sll-cast { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px 4px; }
.shh.shj.sll .sll-castbtn { position: relative; z-index: 1; display: grid; justify-items: center; align-content: start; gap: 6px; min-width: 0; padding: 6px 2px 8px; border: 0; border-radius: 16px; background: transparent; color: var(--sll-copy); cursor: pointer; }
.shh.shj.sll .sll-castbtn:hover, .shh.shj.sll .sll-castbtn:focus { background: rgba(255, 255, 255, .8); color: var(--sll-ink); }
.shh.shj.sll .sll-cast-face .sl-face { --sl-fs: 56px; --sl-ring: #f2c9da; }
.shh.shj.sll .sll-cast-name { font: 700 12.5px/1.25 var(--shh-text); text-align: center; overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.shh.shj.sll .sll-castbtn[aria-selected="true"] { background: #fff; color: var(--sll-pink-ink); box-shadow: 0 16px 30px -24px rgba(123, 36, 75, .6); }
.shh.shj.sll .sll-castbtn[aria-selected="true"] .sl-face { --sl-ring: var(--sll-pink); }
html:not(.sll-js) .shh.shj.sll .sll-cast-wrap { display: none; }
.shh.shj.sll .sll-spots { margin-top: 16px; }
html.sll-js .shh.shj.sll .sll-spot:not(.is-on) { display: none; }
html:not(.sll-js) .shh.shj.sll .sll-spots { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 16px; }
.shh.shj.sll .sll-spot { display: grid; gap: 12px; padding: 22px; border: 1px solid #f1d6e2; border-radius: 24px; background: #fff; box-shadow: 0 34px 64px -46px rgba(123, 36, 75, .55); }
.shh.shj.sll .sll-spot:focus-visible { outline-offset: 4px !important; }
.shh.shj.sll .sll-spot-top { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 16px; }
.shh.shj.sll .sll-spot-top .sl-face { --sl-fs: 72px; }
.shh.shj.sll .sll-spot-who { display: grid; gap: 4px; justify-items: start; }
.shh.shj.sll .sll-spot-name { font: 750 clamp(1.2rem, 1rem + .6vw, 1.45rem)/1.15 var(--shh-display); letter-spacing: -.02em; }
.shh.shj.sll .sll-spot-name a { color: var(--sll-ink); }
.shh.shj.sll .sll-spot-name a:hover { color: var(--sll-pink-ink); text-decoration: underline; text-underline-offset: 4px; }
.shh.shj.sll .sll-spot-role { font-size: 14.5px; line-height: 1.45; color: var(--sll-muted); }
.shh.shj.sll .sll-spot-meta { font: 700 14px/1.4 var(--shh-text); color: var(--sll-pink-ink); }
.shh.shj.sll .sll-spot-k { font: 800 11.5px/1 var(--shh-text); letter-spacing: .1em; text-transform: uppercase; color: var(--sll-muted); }
.shh.shj.sll .sll-spot-reads { display: grid; gap: 6px; }
.shh.shj.sll .sll-spot-reads a { display: grid; grid-template-columns: 9px minmax(0, 1fr); align-items: center; gap: 4px 12px; padding: 10px 14px; border-radius: 14px; background: #fbf6f8; color: var(--sll-ink); }
.shh.shj.sll .sll-spot-reads a:hover { background: var(--sll-rose); color: var(--sll-ink); }
.shh.shj.sll .sll-spot-reads b { font: 700 15px/1.35 var(--shh-text); }
.shh.shj.sll .sll-spot-reads time { grid-column: 2; font-size: 13px; color: var(--sll-muted); }
.shh.shj.sll .sll-spot-acts { margin-top: 4px; }
.shh.shj.sll .sll-authors-more { margin-top: 16px; }
@media (min-width: 560px) {
	/* one row on the line: the wave runs behind the faces, the names sit clear of it underneath */
	.shh.shj.sll .sll-cast { grid-template-columns: repeat(8, minmax(0, 1fr)); }
	.shh.shj.sll .sll-cast-name { -webkit-line-clamp: 3; font-size: 12px; }
	.shh.shj.sll .sll-cast-line { display: block; position: absolute; left: 0; top: 6px; width: 100%; height: 52px; overflow: visible; pointer-events: none; }
	.shh.shj.sll .sll-cast-line path { fill: none; stroke: url(#sl-grad) #d6336c; stroke-width: 4; stroke-linecap: round; vector-effect: non-scaling-stroke; opacity: .75; }
	.shh.shj.sll .sll-cast-face .sl-face { --sl-fs: 52px; }
}
@media (min-width: 768px) {
	.shh.shj.sll .sll-cast-face .sl-face { --sl-fs: 60px; }
	.shh.shj.sll .sll-cast-line { height: 60px; }
	.shh.shj.sll .sll-spot { padding: 24px 26px; }
	.shh.shj.sll .sll-spot-top .sl-face { --sl-fs: 84px; }
}
@media (min-width: 1024px) {
	.shh.shj.sll .sll-grid2--authors > .sll-authors { margin-top: var(--shj-node-row); }
}

/* ---------- Put it to use ---------- */
.shh.shj.sll .sll-tools { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; margin-top: 28px; }
.shh.shj.sll .sll-tools > li { display: grid; }
.shh.shj.sll .sll-tool { --tool: #246b5f; --tool-soft: #e6f3ef; display: grid; grid-template-columns: 44px minmax(0, 1fr) 20px; align-items: center; gap: 14px; min-height: 76px; padding: 14px 16px; border: 1px solid var(--shh-line-soft); border-radius: 20px; background: #fff; color: var(--sll-ink); box-shadow: 0 18px 32px -28px rgba(18, 44, 58, .5); }
.shh.shj.sll .sll-tool--help { --tool: #b0285a; --tool-soft: #fbe7ef; }
.shh.shj.sll .sll-tool--train { --tool: #2b8fd6; --tool-soft: #e7f3fc; }
.shh.shj.sll .sll-tool--eat { --tool: #3d9442; --tool-soft: #eaf6e6; }
.shh.shj.sll .sll-tool--journey { --tool: #1b6fae; --tool-soft: #e6f4fb; }
.shh.shj.sll .sll-tool-ic { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--tool); color: #fff; box-shadow: 0 0 0 5px var(--tool-soft); }
.shh.shj.sll .sll-tool-ic .shh-i { width: 22px; height: 22px; }
.shh.shj.sll .sll-tool--journey .sll-tool-ic { background: linear-gradient(140deg, #246b5f, #2b8fd6 55%, #3d9442); }
.shh.shj.sll .sll-tool-t { display: grid; gap: 3px; }
.shh.shj.sll .sll-tool-t b { font: 750 17px/1.2 var(--shh-display); color: var(--sll-ink); }
.shh.shj.sll .sll-tool-t span { font-size: 14.5px; line-height: 1.4; color: var(--sll-muted); }
.shh.shj.sll .sll-tool-go { color: var(--tool); }
.shh.shj.sll .sll-tool-go .shh-i { width: 18px; height: 18px; }
.shh.shj.sll .sll-tool:hover { border-color: var(--tool); color: var(--sll-ink); }
.shh.shj.sll .sll-end { display: block; height: 1px; }
@media (min-width: 640px) {
	.shh.shj.sll .sll-tools { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
	.shh.shj.sll .sll-tools { grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); margin-top: 36px; }
	.shh.shj.sll .sll-tools--n5 { --n: 5; }
	.shh.shj.sll .sll-tools--n4 { --n: 4; }
	/* side by side, each tile stands up: the glyph, the words, the arrow at the foot */
	.shh.shj.sll .sll-tool { grid-template-columns: minmax(0, 1fr) 20px; grid-template-rows: auto 1fr; align-items: start; gap: 14px; height: 100%; padding: 18px 18px 16px; }
	.shh.shj.sll .sll-tool-ic { grid-column: 1; }
	.shh.shj.sll .sll-tool-t { grid-column: 1 / -1; }
	.shh.shj.sll .sll-tool-go { grid-column: 2; grid-row: 1; justify-self: end; }
}

/* ---------- motion: hover lift, and the hero's held entrance ---------- */
@media (prefers-reduced-motion: no-preference) {
	.shh.shj.sll .sll-card, .shh.shj.sll .sll-topic, .shh.shj.sll .sll-tool, .shh.shj.sll .sll-chip { transition: transform .2s var(--shh-ease), border-color .2s ease, box-shadow .2s ease; }
	.shh.shj.sll .sll-card:hover, .shh.shj.sll .sll-topic:hover, .shh.shj.sll .sll-tool:hover { transform: translateY(-3px); }
	.shh.shj.sll .sll-card-ask, .shh.shj.sll .sll-castbtn, .shh.shj.sll .sll-pick > summary, .shh.shj.sll .sll-spot-reads a { transition: background-color .16s ease, border-color .16s ease, color .16s ease, box-shadow .16s ease; }
	.shh.shj.sll .sll-cast-face .sl-face { transition: transform .2s var(--shh-ease); }
	.shh.shj.sll .sll-castbtn:hover .sl-face { transform: translateY(-4px); }
	.shh.shj.sll .sll-card .sl-cover > :is(img, svg.sl-art) { transition: transform .5s var(--shh-ease); }
	.shh.shj.sll .sll-card:hover .sl-cover > :is(img, svg.sl-art) { transform: scale(1.035); }
	html.sll-js .shh.shj.sll .sll-spot.is-on { animation: sll-fade .35s var(--shh-ease) both; }

	/* the hero: the book's page turns, its ribbon drops, its discs pop and the line draws under "Helpers", once the
	   page is idle (html.sll-go, from sll.js) rather than while it is still loading */
	html.sll-wait:not(.sll-go) .shh.shj.sll .sll-book .shl-lr-turn { opacity: .4; transform: scaleX(.18); transform-box: view-box; transform-origin: 300px 230px; }
	html.sll-wait:not(.sll-go) .shh.shj.sll .sll-book .shl-lr-rib { transform: scaleY(0); transform-box: fill-box; transform-origin: 50% 0; }
	html.sll-wait:not(.sll-go) .shh.shj.sll .sll-book :is(.sl-pop, .sl-twinkle) { opacity: 0; }
	html.sll-wait:not(.sll-go) .shh.shj.sll .sll-h1 .sl-squig path { stroke-dasharray: 1; stroke-dashoffset: 1; }
	html.sll-go .shh.shj.sll .sll-book .shl-lr-turn { transform-box: view-box; transform-origin: 300px 230px; animation: sll-turn 1.1s var(--shh-ease) .1s both; }
	html.sll-go .shh.shj.sll .sll-book .shl-lr-rib { transform-box: fill-box; transform-origin: 50% 0; animation: sll-drop .7s cubic-bezier(.34, 1.56, .64, 1) .95s both; }
	html.sll-go .shh.shj.sll .sll-book .sl-pop { transform-box: fill-box; transform-origin: center; animation: sll-pop .55s cubic-bezier(.34, 1.56, .64, 1) both; animation-delay: calc(var(--sl-d, 0) * 90ms + 350ms); }
	html.sll-go .shh.shj.sll .sll-book .sl-twinkle { transform-box: fill-box; transform-origin: center; animation: sll-glint .9s cubic-bezier(.34, 1.56, .64, 1) both; animation-delay: calc(var(--sl-d, 0) * 90ms + 1000ms); }
	html.sll-go .shh.shj.sll .sll-h1 .sl-squig path { stroke-dasharray: 1; animation: sll-draw 1.1s var(--shh-ease) .25s both; }
}
@keyframes sll-turn { from { transform: scaleX(.18); opacity: .4; } to { transform: none; opacity: 1; } }
@keyframes sll-drop { from { transform: scaleY(0); } to { transform: none; } }
@keyframes sll-pop { from { opacity: 0; transform: scale(.4); } to { opacity: 1; transform: scale(1); } }
@keyframes sll-glint { 0% { opacity: 0; transform: scale(.3) rotate(-40deg); } 60% { opacity: 1; transform: scale(1.2) rotate(8deg); } 100% { opacity: 1; transform: none; } }
@keyframes sll-draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes sll-fade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media print { .shh.shj.sll .sll-stage, .shh.shj.sll .sll-cast-wrap, body.sh-learn .sll-review { display: none !important; } }

/* =====================================================================================================================
   Checkpoint 2: a topic page (.sll--category). Its colours come from the topic itself: --t (ink), --t-acc (accent),
   --t-soft (wash) and --t-glow, set on the root from the Sneaky Line's topic table. Every rule below is scoped to
   .sll--category or a .sllc-* class, so the approved landing is untouched.
   ===================================================================================================================== */
.shh.shj.sll--category { --shj-topic: var(--t-acc, #6ec4e8); }
.shh.shj.sll--category [data-shj-tone="topic"] { --shj-tone: var(--shj-topic); --shj-halo: rgba(110, 196, 232, .45); --shj-say: var(--t, #1d6f97); --sll-tone-ink: var(--t, #1d6f97); }
@supports (color: color-mix(in srgb, red 50%, blue)) {
	.shh.shj.sll--category [data-shj-tone="topic"] { --shj-halo: color-mix(in srgb, var(--t-acc, #6ec4e8) 45%, transparent); }
}
.shh.shj.sll--category .sll-node--start { background-color: var(--t, #1d6f97); }
.shh.shj.sll--category .sll-node--read { background-color: #2b8fd6; }
.shh.shj.sll--category .sll-node--related { background-color: #24857a; }
.shh.shj.sll--category .sll-sec--read { background: radial-gradient(46% 36% at 92% 8%, rgba(78, 166, 236, .09), rgba(78, 166, 236, 0) 70%), #fff; border-top: 1px solid var(--shh-line-soft); }
.shh.shj.sll--category .sll-sec--related { background: linear-gradient(180deg, #f6fbfa 0%, #edf6f2 100%); border-top: 1px solid #dcebe6; }

/* the hero: the topic's own ground and mood */
.shh.shj.sll .sllc-hero { padding-block: clamp(22px, 3vw, 44px) clamp(48px, 5vw, 80px); border-bottom: 1px solid var(--t-glow, #bfe6f6);
	background: radial-gradient(48% 70% at 84% 40%, var(--t-glow, #bfe6f6), rgba(255, 255, 255, 0) 72%), linear-gradient(180deg, var(--t-soft, #eaf6fb) 0%, #ffffff 100%); }
.shh.shj.sll .sllc-hero::after { background-image: radial-gradient(rgba(29, 111, 151, .1) 1px, transparent 1.4px); background-size: 22px 22px; }
/* calm: slow ripples; fresh: a green dot field; energy: movement lines; clear: a quiet grid; warm: soft confetti */
.shh.shj.sll.sllc--calm .sllc-hero::after { background-image: repeating-radial-gradient(circle at 84% 42%, transparent 0 38px, rgba(29, 111, 151, .07) 38px 40px); background-size: auto;
	-webkit-mask-image: linear-gradient(90deg, transparent 30%, #000 75%); mask-image: linear-gradient(90deg, transparent 30%, #000 75%); }
.shh.shj.sll.sllc--fresh .sllc-hero::after { background-image: radial-gradient(rgba(47, 122, 52, .14) 1.4px, transparent 1.8px); background-size: 26px 26px; }
.shh.shj.sll.sllc--energy .sllc-hero::after { background-image: repeating-linear-gradient(-32deg, transparent 0 24px, rgba(27, 111, 174, .06) 24px 26px); background-size: auto;
	-webkit-mask-image: linear-gradient(90deg, transparent 35%, #000 80%); mask-image: linear-gradient(90deg, transparent 35%, #000 80%); }
.shh.shj.sll.sllc--clear .sllc-hero::after { background-image: linear-gradient(rgba(55, 85, 104, .06) 1px, transparent 1px), linear-gradient(90deg, rgba(55, 85, 104, .06) 1px, transparent 1px); background-size: 30px 30px;
	-webkit-mask-image: linear-gradient(90deg, transparent 30%, #000 80%); mask-image: linear-gradient(90deg, transparent 30%, #000 80%); }
.shh.shj.sll.sllc--warm .sllc-hero::after { background-image: radial-gradient(rgba(184, 116, 10, .16) 2px, transparent 2.6px), radial-gradient(rgba(214, 51, 108, .1) 1.6px, transparent 2.2px); background-size: 38px 38px, 26px 26px; background-position: 0 0, 13px 17px; }
.shh.shj.sll .sllc-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin-bottom: 14px; font: 600 14px/1.3 var(--shh-text); color: var(--sll-muted); }
.shh.shj.sll .sllc-crumbs a { color: var(--t, #1d6f97); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.shh.shj.sll .sllc-crumbs a:hover { color: var(--sll-ink); }
.shh.shj.sll .sllc-crumbs [aria-current] { color: var(--sll-ink); }
.shh.shj.sll .sllc-kicker { color: var(--t, #1d6f97); }
.shh.shj.sll .sllc-kicker .sll-tbadge { width: 30px; height: 30px; box-shadow: 0 0 0 5px var(--t-glow, #bfe6f6); }
.shh.shj.sll .sllc-kicker .sll-tbadge .sl-i { width: 17px; height: 17px; }
.shh.shj.sll .sllc-h1 { margin-top: 14px; font-size: clamp(2.3rem, 1.25rem + 3.4vw, 4rem); }
.shh.shj.sll .sllc-say { margin-top: 12px; max-width: 30ch; font: 700 clamp(1.2rem, 1rem + .7vw, 1.55rem)/1.2 var(--shh-display); letter-spacing: -.02em; color: var(--t, #1d6f97); text-wrap: balance; }
.shh.shj.sll .sllc-hero .sll-lead { margin-top: 14px; }
.shh.shj.sll .sllc-hero .sll-search { margin-top: 22px; }
.shh.shj.sll .sllc-hero .sll-search-field > .sl-i { color: var(--t, #1d6f97); }
.shh.shj.sll .sllc-hero .sll-search input[type="search"] { border-color: var(--t-glow, #bfe6f6); box-shadow: 0 20px 40px -32px rgba(18, 44, 58, .55); }
.shh.shj.sll .sllc-hero .sll-search input[type="search"]:focus { border-color: var(--t, #1d6f97); }

/* the topic's orbit: its glyph at the centre, its writers on the ring */
.shh.shj.sll .sllc-stage { display: none; position: relative; }
.shh.shj.sll .sllc-orb { position: relative; width: 100%; max-width: 420px; margin-inline: auto; aspect-ratio: 1; }
.shh.shj.sll .sllc-orb-ring { position: absolute; inset: 8%; border-radius: 50%; border: 2px dashed var(--t-glow, #bfe6f6); }
.shh.shj.sll .sllc-orb-ring--2 { inset: 21%; border-style: solid; border-color: rgba(255, 255, 255, .9); background: rgba(255, 255, 255, .55); }
.shh.shj.sll .sllc-orb-core { position: absolute; inset: 31%; display: grid; place-items: center; border-radius: 50%; color: var(--t, #1d6f97);
	background: radial-gradient(circle at 50% 35%, #ffffff 0%, var(--t-soft, #eaf6fb) 62%, var(--t-glow, #bfe6f6) 100%); box-shadow: 0 30px 60px -30px rgba(18, 44, 58, .45), 0 0 0 10px rgba(255, 255, 255, .7); }
.shh.shj.sll .sllc-orb-core .sl-i { width: 46%; height: 46%; --sl-sw: 1.6; }
.shh.shj.sll .sllc-orb-face { position: absolute; transform: translate(-50%, -50%); }
.shh.shj.sll .sllc-orb-face .sl-face { --sl-fs: 64px; --sl-ring: var(--t-glow, #bfe6f6); }
.shh.shj.sll .sllc-orb-face--0 { left: 80%; top: 17%; }
.shh.shj.sll .sllc-orb-face--1 { left: 91%; top: 62%; }
.shh.shj.sll .sllc-orb-face--2 { left: 22%; top: 84%; }
.shh.shj.sll .sllc-orb-face--3 { left: 9%; top: 36%; }
.shh.shj.sll .sllc-orb-dot { position: absolute; transform: translate(-50%, -50%); width: 46px; height: 46px; display: grid; place-items: center; border-radius: 50%; background: #fff; color: var(--t, #1d6f97); box-shadow: 0 14px 26px -14px rgba(18, 44, 58, .5); }
.shh.shj.sll .sllc-orb-dot .sl-i { width: 24px; height: 24px; }
.shh.shj.sll .sllc-orb-dot--0 { left: 34%; top: 7%; }
.shh.shj.sll .sllc-orb-dot--1 { left: 64%; top: 93%; }
.shh.shj.sll .sllc-orb-spark { position: absolute; left: 92%; top: 30%; }
@media (min-width: 768px) {
	.shh.shj.sll .sllc-stage { display: block; }
	.shh.shj.sll .sllc-orb-face .sl-face { --sl-fs: 52px; }
}
@media (min-width: 1024px) {
	.shh.shj.sll .sllc-stage { justify-self: end; width: 100%; max-width: 460px; }
	.shh.shj.sll .sllc-orb-face .sl-face { --sl-fs: 64px; }
}

/* Start here: the lead and picks on the topic's own light ground */
.shh.shj.sll .sllc-sec--start { background: linear-gradient(180deg, var(--t-soft, #eaf6fb) 0%, #ffffff 100%); border-top: 1px solid var(--t-glow, #bfe6f6); }
.shh.shj.sll .sllc-sec--start .sll-card--lead { border: 1px solid var(--shh-line-soft); box-shadow: 0 36px 64px -44px rgba(18, 44, 58, .55); }
.shh.shj.sll .sllc-sec--start .sll-card--pick { border: 1px solid var(--shh-line-soft); box-shadow: var(--sll-card); }
.shh.shj.sll .sllc-sec--start .sll-picks-k { color: var(--t, #1d6f97); }

/* Keep going: the next steps beside Support's own card */
.shh.shj.sll .sllc-keep { display: grid; gap: 18px; margin-top: 28px; }
.shh.shj.sll .sllc-keep > * { min-width: 0; }
.shh.shj.sll .sllc-keep .sll-tools { margin-top: 0; }
.shh.shj.sll .sllc-support .sh-sc-widget { margin: 0; height: 100%; }
@media (min-width: 1024px) {
	.shh.shj.sll .sllc-keep { grid-template-columns: minmax(0, 1fr) minmax(0, 440px); align-items: stretch; margin-top: 36px; }
	.shh.shj.sll .sllc-keep.is-solo { grid-template-columns: minmax(0, 1fr); }
	/* beside Support's card the next steps stack as rows (glyph, words, arrow), so neither column stretches empty */
	.shh.shj.sll .sllc-keep .sllc-tools { grid-template-columns: minmax(0, 1fr); align-content: start; }
	.shh.shj.sll .sllc-keep .sll-tool { grid-template-columns: 44px minmax(0, 1fr) 20px; grid-template-rows: none; align-items: center; height: auto; padding: 14px 18px; }
	.shh.shj.sll .sllc-keep :is(.sll-tool-ic, .sll-tool-t, .sll-tool-go) { grid-column: auto; grid-row: auto; justify-self: auto; }
	.shh.shj.sll .sllc-keep.is-solo .sllc-tools { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
}

/* the orbit's entrance, held until the page is idle (as the landing's book) */
@media (prefers-reduced-motion: no-preference) {
	html.sll-wait:not(.sll-go) .shh.shj.sll .sllc-orb :is(.sllc-orb-face, .sllc-orb-dot, .sllc-orb-spark) { opacity: 0; }
	html.sll-wait:not(.sll-go) .shh.shj.sll .sllc-orb-core { opacity: 0; transform: scale(.86); }
	html.sll-go .shh.shj.sll .sllc-orb-core { animation: sllc-core .8s var(--shh-ease) both; }
	html.sll-go .shh.shj.sll .sllc-orb-face { animation: sllc-pop .6s cubic-bezier(.34, 1.56, .64, 1) both; }
	html.sll-go .shh.shj.sll .sllc-orb-face--0 { animation-delay: .35s; }
	html.sll-go .shh.shj.sll .sllc-orb-face--1 { animation-delay: .5s; }
	html.sll-go .shh.shj.sll .sllc-orb-face--2 { animation-delay: .65s; }
	html.sll-go .shh.shj.sll .sllc-orb-face--3 { animation-delay: .8s; }
	html.sll-go .shh.shj.sll .sllc-orb-dot { animation: sllc-pop .55s cubic-bezier(.34, 1.56, .64, 1) .95s both; }
	html.sll-go .shh.shj.sll .sllc-orb-spark { animation: sll-glint .9s cubic-bezier(.34, 1.56, .64, 1) 1.2s both; }
}
@keyframes sllc-core { from { opacity: 0; transform: scale(.86); } to { opacity: 1; transform: none; } }
@keyframes sllc-pop { from { opacity: 0; transform: translate(-50%, -50%) scale(.4); } to { opacity: 1; transform: translate(-50%, -50%) scale(1); } }

/* =====================================================================================================================
   Checkpoint 3: a guide (.sll--article). The reading experience inside .slla-read is the theme's own and is left as
   it is (the guard rules at the end keep the homepage base out of it); this layer styles only the introduction and
   the chapters after the guide. Every rule is scoped to .sll--article or a .slla-* class.
   ===================================================================================================================== */
.shh.shj.sll--article { --shj-topic: var(--t-acc, #6ec4e8); }
.shh.shj.sll--article [data-shj-tone="topic"] { --shj-tone: var(--shj-topic); --shj-halo: rgba(110, 196, 232, .45); --shj-say: var(--t, #1d6f97); --sll-tone-ink: var(--t, #1d6f97); }
.shh.shj.sll--article .sll-node--keep { background-color: #2b8fd6; }

/* the introduction: the topic's own ground, the guide's picture beside the words */
body.sh-hl .shh.sll--article .slla-mast:not(.slla-mast--trad) { position: relative; border-bottom: 1px solid var(--t-glow, #bfe6f6);
	background: radial-gradient(44% 80% at 88% 30%, var(--t-glow, #bfe6f6), rgba(255, 255, 255, 0) 70%), linear-gradient(180deg, var(--t-soft, #eaf6fb) 0%, #ffffff 100%); }
body.sh-hl .shh.sll--article .slla-mast:not(.slla-mast--trad)::after { content: ""; position: absolute; inset: 0; pointer-events: none; background-image: radial-gradient(rgba(29, 111, 151, .1) 1px, transparent 1.4px); background-size: 22px 22px;
	-webkit-mask-image: linear-gradient(90deg, #000 0%, transparent 45%); mask-image: linear-gradient(90deg, #000 0%, transparent 45%); }
body.sh-hl .shh.sll--article.sllc--calm .slla-mast:not(.slla-mast--trad)::after { background-image: repeating-radial-gradient(circle at 86% 46%, transparent 0 38px, rgba(29, 111, 151, .06) 38px 40px); background-size: auto;
	-webkit-mask-image: linear-gradient(90deg, transparent 40%, #000 85%); mask-image: linear-gradient(90deg, transparent 40%, #000 85%); }
.shh.shj.sll .slla-mast-grid { position: relative; z-index: 3; display: grid; grid-template-columns: minmax(0, 1fr); gap: 26px; align-items: center; padding-block: clamp(18px, 3vw, 40px) clamp(30px, 4vw, 52px); }
.shh.shj.sll .slla-mast-copy { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; justify-items: start; min-width: 0; max-width: 820px; }
.shh.shj.sll .slla-mast-copy > .sl-crumbs { max-width: 100%; margin: 0 0 -4px; }
.shh.shj.sll .slla-mast:not(.slla-mast--trad) .shl-read-note { margin-top: 2px; border-color: var(--t-glow, #bfe6f6); border-left-color: var(--t, #1d6f97); }
.shh.shj.sll .slla-cover { margin: 0; min-width: 0; }
.shh.shj.sll .slla-cover .sl-cover { border-radius: clamp(20px, 2.4vw, 28px); aspect-ratio: 16 / 10; box-shadow: 0 40px 70px -46px rgba(18, 44, 58, .6); }
.shh.shj.sll .slla-cover .sl-cover > img { object-position: 50% 42%; }
.shh.shj.sll .slla-start { position: absolute; left: -28px; bottom: -26px; width: 2px; height: 2px; pointer-events: none; }
@media (min-width: 1024px) {
	.shh.shj.sll .slla-mast-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 500px); gap: 56px; }
	.shh.shj.sll .slla-cover .sl-cover { aspect-ratio: 4 / 3; }
}
@media (min-width: 1280px) {
	.shh.shj.sll .slla-mast-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 540px); gap: 72px; }
}

/* the guide: white and calm; the thread keeps to the left margin */
.shh.shj.sll .slla-read { position: relative; background: #fff; }
.shh.shj.sll .slla-read > .shl-a-body { position: relative; z-index: 3; }

/* Ask the author */
.shh.shj.sll .slla-ask { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; margin-top: 28px; }
.shh.shj.sll .slla-ask > * { min-width: 0; }
.shh.shj.sll .slla-writer { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; align-content: start; padding: clamp(20px, 2.6vw, 30px); border: 1px solid #f1d6e2; border-radius: 26px; background: radial-gradient(70% 90% at 100% 0%, rgba(214, 51, 108, .08), rgba(214, 51, 108, 0) 60%), #fff; box-shadow: 0 34px 64px -46px rgba(123, 36, 75, .55); }
.shh.shj.sll .slla-writer-top { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 18px; align-items: center; }
.shh.shj.sll .slla-writer-top .sl-face { --sl-fs: 84px; --sl-ring: #f2c9da; }
.shh.shj.sll .slla-writer-who { display: grid; gap: 4px; justify-items: start; }
.shh.shj.sll .slla-writer-name { font: 750 clamp(1.3rem, 1.05rem + .8vw, 1.7rem)/1.12 var(--shh-display); letter-spacing: -.02em; }
.shh.shj.sll .slla-writer-name a { color: var(--sll-ink); }
.shh.shj.sll .slla-writer-name a:hover { color: var(--sll-pink-ink); text-decoration: underline; text-underline-offset: 4px; }
.shh.shj.sll .slla-writer-role { font-size: 15px; line-height: 1.45; color: var(--sll-muted); }
.shh.shj.sll .slla-writer .shl-cost { margin: 0; }
.shh.shj.sll .slla-writer-acts { margin-top: 4px; }
.shh.shj.sll .slla-ask-side { display: grid; gap: 22px; align-content: start; }
.shh.shj.sll .slla-by-list a { grid-template-columns: 9px minmax(0, 1fr); }
.shh.shj.sll .slla-by-meta { grid-column: 2; font-size: 13px; color: var(--sll-muted); }
.shh.shj.sll .slla-peer-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 10px; }
.shh.shj.sll .slla-peer-list a { display: grid; justify-items: center; gap: 6px; padding: 8px 4px; border-radius: 14px; color: var(--sll-copy); font: 700 12.5px/1.25 var(--shh-text); text-align: center; }
.shh.shj.sll .slla-peer-list a:hover { background: #fff; color: var(--sll-ink); }
.shh.shj.sll .slla-peer-list .sl-face { --sl-fs: 52px; --sl-ring: #f2c9da; }
.shh.shj.sll .slla-peers-all { margin-top: 10px; }
.shh.shj.sll .slla-peers-all a { display: inline-flex; align-items: center; gap: 6px; font: 700 14.5px/1.3 var(--shh-text); color: var(--sll-pink-ink); }
.shh.shj.sll .slla-peers-all a:hover { text-decoration: underline; text-underline-offset: 3px; color: var(--sll-pink-ink); }
.shh.shj.sll .slla-peers-all .shh-i { width: 16px; height: 16px; }
.shh.shj.sll .slla-ask-solo { display: grid; gap: 14px; margin-top: 22px; max-width: 640px; }
@media (min-width: 1024px) {
	.shh.shj.sll .slla-ask { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: 40px; margin-top: 36px; }
	.shh.shj.sll .slla-ask.is-solo { grid-template-columns: minmax(0, 720px); }
}

/* Keep reading */
.shh.shj.sll .slla-keep-head { display: grid; gap: 16px; }
.shh.shj.sll .slla-keep-cards { margin-top: 26px; }
@media (min-width: 768px) {
	.shh.shj.sll .slla-keep-head { grid-template-columns: minmax(0, 1fr) auto; align-items: end; }
}

/* Continue your journey: the journey's own block, dressed in the approved buttons (its markup is unchanged) */
.shh.shj.sll .slla-after { margin-top: 26px; }
.shh.shj.sll .slla-after .sh-next { margin: 0; padding: clamp(18px, 2.4vw, 26px); border: 1px solid var(--shh-line-soft); border-radius: 24px; background: #fff; box-shadow: 0 26px 50px -40px rgba(18, 44, 58, .5); }
.shh.shj.sll .slla-after .sh-next-head { margin: 0 0 12px; }
.shh.shj.sll .slla-after .sh-next-kicker { font: 800 12px/1 var(--shh-text); letter-spacing: .12em; text-transform: uppercase; color: #2f7a34; }
.shh.shj.sll .slla-after .sh-next-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; }
.shh.shj.sll .slla-after .sh-next-primary { display: inline-flex; align-items: center; min-height: 52px; padding: 12px 22px; border-radius: 999px; background: var(--shh-teal); color: #fff; font: 700 16px/1.2 var(--shh-text); text-decoration: none; box-shadow: 0 14px 28px -16px rgba(36, 107, 95, .9); }
.shh.shj.sll .slla-after .sh-next-primary:hover, .shh.shj.sll .slla-after .sh-next-primary:focus-visible { background: var(--shh-teal-deep); color: #fff; }
.shh.shj.sll .slla-after .sh-next-secondary { display: flex; flex-wrap: wrap; gap: 10px; }
.shh.shj.sll .slla-after .sh-next-secondary a { display: inline-flex; align-items: center; min-height: 48px; padding: 10px 18px; border: 1.5px solid var(--shh-line); border-radius: 999px; background: #fff; color: var(--sll-ink); font: 700 15px/1.2 var(--shh-text); text-decoration: none; }
.shh.shj.sll .slla-after .sh-next-secondary a:hover, .shh.shj.sll .slla-after .sh-next-secondary a:focus-visible { border-color: var(--shh-teal); color: var(--sll-ink); }
.shh.shj.sll .slla-continue-more { margin-top: 18px; }
@media (max-width: 479.98px) {
	.shh.shj.sll .slla-after .sh-next-primary, .shh.shj.sll .slla-after .sh-next-secondary a { width: 100%; justify-content: center; text-align: center; }
	.shh.shj.sll .slla-after .sh-next-secondary { width: 100%; }
}

/* guards: inside the guide the theme's reading styles rule exactly as on the live page (harness/read-parity.mjs). The homepage
 * base (.shh) would otherwise lend it 17px type, list-style none, balanced headings and capped icons. */
.shh.shj.sll .slla-read { font-size: 16px; line-height: 1.55; color: #375568; }
:where(.shh) .slla-read :where(.shl-prose, .shl-a-toc, .shl-a-toc-m) :where(ul, ol) { list-style: revert; }
:where(.shh) .slla-read :where(h2, h3) { text-wrap: wrap; }
:where(.shh) .slla-read .sh-sc-widget-title { letter-spacing: normal; }
:where(.shh) .slla-read :where(svg) { max-width: none; }

/* the introduction lines up with the reading grid below it (the theme's widths: 780 + 320 + 52, or 190 + 740 + 300 + 88 with
 * the contents line), takes the topic's ink for its label, and sets the title a little smaller beside the picture */
.shh.shj.sll .slla-mast:not(.slla-mast--trad) .sl-eyebrow { color: var(--t, #1d6f97); }
.shh.shj.sll .slla-title { font-size: clamp(2.05rem, 1.2rem + 2.6vw, 3.55rem); line-height: 1.04; }
.shh.shj.sll .slla-title.is-long { font-size: clamp(1.85rem, 1.15rem + 2vw, 3rem); }
@media (min-width: 1024px) {
	.shh.shj.sll .slla-mast-grid { width: min(1152px, 100% - 2 * var(--sl-gutter)); }
}
@media (min-width: 1280px) {
	.shh.shj.sll .slla-mast-grid.has-toc { width: min(1318px, 100% - 2 * var(--sl-gutter)); }
}

/* the writer's Ask button keeps its full words on a phone (it wraps rather than run past the card); the journey's own label in green */
.shh.shj.sll .slla-writer .sll-ask-btn, .shh.shj.sll .slla-writer .sll-ask-btn:hover, .shh.shj.sll .slla-writer .sll-ask-btn:focus { white-space: normal; text-align: left; }
.shh.shj.sll .slla-after .sh-next-kicker { display: inline-block; padding: 5px 11px; border-radius: 999px; background: #eaf6e6; }
@media (max-width: 1023.98px) { .shh.shj.sll .slla-start { left: 0; } } /* phones and tablets: the thread uses its gutter lane, not this anchor's x */

/* =====================================================================================================================
   Religion visual unification, Checkpoint 2: a tradition page (.sll--tradition). The tradition's components keep their
   own identity rules (the theme's [data-tradition] layer); this layer only adds the chapters: each one's ground, its
   node on the shared Sneaky Thread and the thread's colours, from the tradition's own four tokens (--sllr-*, set on the
   root) into the shared Sneaky tones. No native script, nor anything holding one, moves, scales, fades or lifts here.
   ===================================================================================================================== */
.shh.shj.sll--tradition {
	--shj-trad: var(--sllr-accent, #cba656); --shj-deep: var(--sllr-deep, #315f52); --shj-writings: #b8740a; --shj-explore: #3fb39d;
}
.shh.shj.sll--tradition [data-shj-tone="trad"] { --shj-tone: var(--shj-trad); --shj-halo: rgba(203, 166, 86, .45); }
.shh.shj.sll--tradition [data-shj-tone="deep"] { --shj-tone: var(--shj-deep); --shj-halo: rgba(49, 95, 82, .4); }
.shh.shj.sll--tradition [data-shj-tone="writings"] { --shj-tone: var(--shj-writings); --shj-halo: rgba(184, 116, 10, .42); }
.shh.shj.sll--tradition [data-shj-tone="explore"] { --shj-tone: var(--shj-explore); --shj-halo: rgba(63, 179, 157, .42); }
@supports (color: color-mix(in srgb, red 50%, blue)) {
	.shh.shj.sll--tradition [data-shj-tone] [data-shj-node]::before { background: radial-gradient(closest-side, color-mix(in srgb, var(--shj-tone, #cba656) 45%, transparent), transparent); }
}
.shh.shj.sll--tradition .sllr-node--guides { background-color: var(--sllr-ink, #6b5420); }
.shh.shj.sll--tradition .sllr-node--builder { background-color: var(--sllr-deep, #315f52); }
.shh.shj.sll--tradition .sllr-node--writings { background-color: #b8740a; }
.shh.shj.sll--tradition .sllr-node--others { background-color: #24857a; }
.shh.shj.sll--tradition .sllr-nodehead { margin-bottom: 14px; }
@media (min-width: 1024px) { .shh.shj.sll--tradition .sllr-nodehead > .shj-node { margin-bottom: 0; } }

/* the chapters' grounds: the tradition's paper, then white, its tint, a warm reading ground and the shared teal */
.shh.shj.sll--tradition .sllr-band { position: relative; }
.shh.shj.sll--tradition .sllr-band--ways { padding-block: 4px clamp(28px, 3.4vw, 44px); background: var(--sllr-tint, #f7f4ea); border-bottom: 1px solid rgba(203, 166, 86, .28); }
.shh.shj.sll--tradition .sllr-band--guides { padding-block: clamp(44px, 5.4vw, 76px) clamp(40px, 5vw, 68px); background: radial-gradient(42% 50% at 92% 0%, rgba(203, 166, 86, .12), rgba(203, 166, 86, 0) 70%), #fff; }
.shh.shj.sll--tradition .sllr-band--builder { padding-block: clamp(40px, 5vw, 64px) clamp(44px, 5.4vw, 72px); background: linear-gradient(180deg, var(--sllr-tint, #f7f4ea) 0%, #fbfaf4 100%); border-top: 1px solid rgba(203, 166, 86, .24); }
.shh.shj.sll--tradition .sllr-band--writings { padding-block: clamp(44px, 5.4vw, 76px) clamp(40px, 5vw, 68px); background: linear-gradient(180deg, #ffffff 0%, #fffdf8 100%); border-top: 1px solid var(--shh-line-soft); }
.shh.shj.sll--tradition .sllr-band--others { padding-block: clamp(44px, 5.4vw, 72px) clamp(44px, 5.4vw, 72px); background: linear-gradient(180deg, #f6fbfa 0%, #edf6f2 100%); border-top: 1px solid #dcebe6; }
.shh.shj.sll--tradition .sllr-band > .shl-wrap, .shh.shj.sll--tradition .sllr-band--builder .shl-trad-builder-band { position: relative; z-index: 3; }
.shh.shj.sll--tradition .sllr-band--builder .shl-trad-builder-band { background: transparent; padding-block: 0; }
.shh.shj.sll--tradition .sllr-others-more { margin-top: 20px; }
.shh.shj.sll--tradition .sll-end { display: block; height: 1px; }

/* a held-back guide: their initial in the tradition's colours, where a portrait would be (never a face) */
.shh.shj.sll--tradition .sllr-initial { flex: none; display: inline-grid; place-items: center; width: var(--sllr-px, 64px); height: var(--sllr-px, 64px); border-radius: 50%;
	background: radial-gradient(circle at 50% 35%, #fff 0%, var(--sllr-tint, #f7f4ea) 70%); color: var(--sllr-ink, #6b5420); font: 400 calc(var(--sllr-px, 64px) * .46)/1 Georgia, "Times New Roman", serif;
	box-shadow: 0 0 0 3px #fff, 0 0 0 4.5px var(--sllr-accent, #cba656); }
.shh.shj.sll--tradition .sh-helper-tile .sllr-initial { margin: 0; }

/* the orbit's medal, pattern only where the reviewed rule says so (Bahá’í): the tradition's own motif, still */
.shh.shj.sll--tradition .sllr-medal.is-pattern { overflow: hidden; }
.shh.shj.sll--tradition .sllr-medal .sllr-medal-art { position: absolute; inset: 0; border-radius: 50%; overflow: hidden; }
.shh.shj.sll--tradition .sllr-medal, .shh.shj.sll--tradition .sllr-medal * { animation: none !important; transition: none !important; }
/* the pattern-only medal: the tradition's own motif in its gold on its deep colour, as its Reflection Builder card draws it */
.shh.shj.sll--tradition .sllr-medal.is-pattern .shl-trad-motif { --trad-motif-size: 34px 34px; background: var(--sllr-accent, #cba656); opacity: .5; -webkit-mask: var(--trad-motif, none) 0 0 / var(--trad-motif-size) repeat; mask: var(--trad-motif, none) 0 0 / var(--trad-motif-size) repeat; }
.shh.shj.sll--tradition .sllr-medal.is-pattern .shl-trad-scene { display: none; }
.shh.shj.sll--tradition .sllr-medal.is-pattern::after { content: ""; position: absolute; inset: 0; border-radius: 50%; background: radial-gradient(circle at 50% 40%, rgba(255, 255, 255, .16), rgba(255, 255, 255, 0) 62%); pointer-events: none; }

/* guards: the tradition's components keep exactly the type they have on the live page (harness/comp-parity.mjs): the root
 * takes the theme main's own font and colour instead of the homepage base, and headings are not balanced */
.shh.shj.sll--tradition { font: inherit; color: inherit; }
.sll--tradition :where(h2, h3) { text-wrap: wrap; }
.sll--tradition :where(svg) { max-width: none; }
.shh.shj.sll.sll--tradition .sfav-heart { font-family: inherit; } /* the tradition's Favorites hearts keep the type they inherit live */
.sll--tradition .shl-card-dek { margin: 2px 0 0; } /* the theme's own value (shl-base.css), which the homepage base reset would otherwise win */
.shh.shj.sll--tradition .sllr-initial { box-shadow: 0 0 0 max(1.5px, calc(var(--sllr-px, 64px) * .047)) #fff, 0 0 0 max(2.5px, calc(var(--sllr-px, 64px) * .07)) var(--sllr-accent, #cba656); }
.shh.shj.sll--tradition .sllr-nodehead + :is(section, nav) { margin-top: 0; padding-top: 0; } /* the chapter node sits right above the tradition's own heading */

/* =====================================================================================================================
   Religion visual unification, Checkpoint 3: a religious guide's profile (.sll--persona, which also carries
   .sll--tradition, so the tradition's tones, nodes, grounds, initials and identity guards apply). The profile's own
   components keep the theme's identity rules; this layer adds the chapters only.
   ===================================================================================================================== */
.shh.shj.sll--persona { --shj-know: #6c8796; }
.shh.shj.sll--persona [data-shj-tone="know"] { --shj-tone: var(--shj-know); --shj-halo: rgba(108, 135, 150, .4); }
.shh.shj.sll--persona .sllr-node--know { background-color: #4d6572; }
.shh.shj.sll--persona .sllr-band--know { padding-block: clamp(44px, 5.4vw, 76px) clamp(40px, 5vw, 68px); background: linear-gradient(180deg, #f6f9fa 0%, #ffffff 100%); border-top: 1px solid var(--shh-line-soft); }
.shh.shj.sll--persona .sllp-mast-inner { position: relative; }
.shh.shj.sll--persona .sllp-builder { position: relative; z-index: 3; }
.shh.shj.sll--persona .sllr-band--writings .shl-actions { margin-top: 18px; }
/* the held-back guide's initial in the portrait ring (never a face) */
.shh.shj.sll--persona .shl-prof-portrait .sllr-initial.shl-prof-face { font-size: calc(var(--sllr-px, 196px) * .42); }
/* phones: the theme's portrait shrinks to 144px inside its 176px ring (shl-pages.css); the initial's size is inline */
@media (max-width: 767px) {
	.shh.shj.sll--persona .shl-prof-portrait .sllr-initial.shl-prof-face { --sllr-px: 144px !important; }
}
/* Continue exploring: the guides and the way back, with Support's one card beside them */
.shh.shj.sll--persona .sllp-continue-title { margin: 0 0 18px; }
.shh.shj.sll--persona .sllp-continue { display: grid; gap: 18px; }
.shh.shj.sll--persona .sllp-continue > * { min-width: 0; }
.shh.shj.sll--persona .sllp-continue-main { display: grid; gap: 16px; align-content: start; }
.shh.shj.sll--persona .sllp-related { margin: 0; }
.shh.shj.sll--persona .sllp-support .sh-sc-widget { margin: 0; height: 100%; }
@media (min-width: 1024px) {
	.shh.shj.sll--persona .sllp-continue { grid-template-columns: minmax(0, 1fr) minmax(0, 420px); align-items: stretch; }
	.shh.shj.sll--persona .sllp-continue.is-solo { grid-template-columns: minmax(0, 1fr); }
}
.sll--tradition .shl-row-name { font-size: 17px; line-height: 1.2; } /* the theme's own size (shl-base.css), which the homepage heading base would otherwise win outside the rail */

/* =====================================================================================================================
   Final unification pass (owner brief, 24 Oct 2026): single articles, general (.sll--article) and religious
   (.sll--article.sll--relart, which also carries .sll--tradition for the tradition's tones, initials and identity
   guards). The reading inside .slla-read and a religion article's banner stay the theme's own. Around them: the thread
   from the top of the page, one action row, a conversation with the writer, one lead and two compact
   recommendations, onward tiles, and a last chapter that meets the footer, where the thread lands. Every rule is
   scoped to .sll--article or a .slla-* class.
   ===================================================================================================================== */
/* the thread's start: the reading grid's margin lane, at the top of the introduction */
.shh.shj.sll--article .slla-mast { position: relative; }
.shh.shj.sll--article .slla-lane { position: absolute; top: 18px; left: 0; right: 0; height: 0; margin-inline: auto; pointer-events: none; }
.shh.shj.sll--article .slla-lane .slla-start { top: 0; bottom: auto; left: -28px; }
@media (min-width: 1024px) {
	.shh.shj.sll--article .slla-lane { width: min(1152px, 100% - 2 * var(--sl-gutter)); }
}
@media (min-width: 1280px) {
	.shh.shj.sll--article .slla-lane.has-toc { width: min(1318px, 100% - 2 * var(--sl-gutter)); }
}
@media (max-width: 1023.98px) { .shh.shj.sll--article .slla-lane .slla-start { left: 0; } }

/* the introduction's one row: Start reading, Ask the writer, Favorites; then how long it is */
.shh.shj.sll--article .slla-mast-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; margin: 4px 0 0; }
.shh.shj.sll--article .slla-mast-acts .sfav-save { margin: 0; }
.shh.shj.sll--article .slla-mast-acts .slla-go .shh-i { transform: none; }
.shh.shj.sll--article .slla-glance { margin: -4px 0 0; font: 600 13.5px/1.3 var(--shh-text); letter-spacing: .01em; color: var(--sll-muted); font-variant-numeric: tabular-nums; }
.shh.shj.sll--relart .slla-mast-acts, .shh.shj.sll--relart .slla-glance { margin-top: 14px; }
.shh.shj.sll--relart .slla-glance { margin-top: 8px; }

/* chapters: compact, each with its own ground */
.shh.shj.sll--article .slla-sec--ask, .shh.shj.sll--article .slla-sec--keep, .shh.shj.sll--article .slla-sec--continue { padding-block: clamp(52px, 6vw, 84px) clamp(44px, 5.4vw, 72px); }
.shh.shj.sll--article .slla-sec--ask { background: radial-gradient(40% 60% at 96% 12%, rgba(214, 51, 108, .09), rgba(214, 51, 108, 0) 70%), linear-gradient(180deg, #ffffff 0%, #fdf2f7 100%); }
.shh.shj.sll--article .slla-sec--keep { background: radial-gradient(46% 40% at 6% 100%, rgba(78, 166, 236, .1), rgba(78, 166, 236, 0) 70%), linear-gradient(180deg, #f7fbfe 0%, #ffffff 100%); border-top: 1px solid #e2eef7; }
.shh.shj.sll--article .slla-sec--last { padding-bottom: clamp(60px, 6.6vw, 96px); background: radial-gradient(50% 60% at 92% 100%, rgba(92, 184, 96, .14), rgba(92, 184, 96, 0) 70%), linear-gradient(180deg, #ffffff 0%, #ecf6e8 100%); }

/* Ask the writer: a conversation (questions from the article's own headings only prefill the chat) */
.shh.shj.sll--article .slla-chat { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; align-content: start; padding: clamp(20px, 2.6vw, 30px); border: 1px solid #f1d6e2; border-radius: 26px; background: linear-gradient(180deg, #ffffff 0%, #fffafc 100%); box-shadow: 0 34px 60px -46px rgba(176, 40, 90, .55); }
.shh.shj.sll--article .slla-chat-who { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; align-items: center; }
.shh.shj.sll--article .slla-chat-who .sl-face { --sl-fs: 72px; --sl-ring: #f2c9da; }
.shh.shj.sll--article .slla-chat-thread { display: grid; gap: 10px; padding: 4px 0 2px; }
.shh.shj.sll--article .slla-chat-bubble { justify-self: start; max-width: 46ch; margin: 0; padding: 12px 16px; border-radius: 6px 20px 20px 20px; background: #fcecf3; color: var(--sll-ink); font-size: 15.5px; line-height: 1.45; }
.shh.shj.sll--article .slla-chat-qs { display: grid; gap: 8px; justify-items: end; margin: 0; padding: 0 0 0 clamp(12px, 4vw, 48px); list-style: none; }
.shh.shj.sll--article .slla-chat-qs > li { display: grid; max-width: 100%; }
.shh.shj.sll--article .slla-chat-q { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 14px; row-gap: 3px; align-items: center; min-height: 48px; max-width: 100%; margin: 0; padding: 10px 14px 10px 16px; border: 1.5px solid #f0c6d8; border-radius: 20px 20px 6px 20px; background: #fff; color: var(--sll-ink); font: 700 15px/1.3 var(--shh-text); text-align: left; white-space: normal; cursor: pointer; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.shh.shj.sll--article .slla-chat-q-k { grid-column: 1; font: 800 10.5px/1 var(--shh-text); letter-spacing: .13em; text-transform: uppercase; color: var(--sll-pink-ink); }
.shh.shj.sll--article .slla-chat-q-t { grid-column: 1; min-width: 0; }
.shh.shj.sll--article .slla-chat-q .shh-i { grid-column: 2; grid-row: 1 / span 2; width: 18px; height: 18px; color: var(--sll-pink-ink); }
.shh.shj.sll--article .slla-chat-q:hover, .shh.shj.sll--article .slla-chat-q:focus-visible { border-color: var(--sll-pink-ink); box-shadow: 0 16px 30px -22px rgba(176, 40, 90, .6); transform: translateY(-1px); }
.shh.shj.sll--article .slla-chat-fine { margin: 0; }
.shh.shj.sll--article .slla-chat .shl-cost { margin: 0; }
.shh.shj.sll--article .slla-chat .sll-ask-btn { white-space: normal; text-align: left; }
@media (prefers-reduced-motion: reduce) {
	.shh.shj.sll--article .slla-chat-q { transition: none; }
	.shh.shj.sll--article .slla-chat-q:hover, .shh.shj.sll--article .slla-chat-q:focus-visible { transform: none; }
}

/* the writer's peers: a framed panel beside the conversation */
.shh.shj.sll--article .slla-ask-side .slla-peers, .shh.shj.sll--article .slla-ask-side .slla-by { padding: clamp(18px, 2vw, 24px); border: 1px solid #f1d6e2; border-radius: 22px; background: rgba(255, 255, 255, .78); }
.shh.shj.sll--relart .slla-ask-side .slla-peers { border-color: rgba(203, 166, 86, .4); }

/* Keep reading: one lead across the width (picture beside its words), then two compact side by side; then the topics */
.shh.shj.sll--article .slla-keep-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; margin-top: 26px; }
.shh.shj.sll--article .slla-keep-grid > * { min-width: 0; }
.shh.shj.sll--article .slla-keep-rest { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; align-items: stretch; }
@media (min-width: 768px) {
	.shh.shj.sll--article .slla-keep-rest { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 900px) {
	.shh.shj.sll--article .slla-keep-grid > .sll-card--lead { display: grid; grid-template-columns: minmax(0, 11fr) minmax(0, 10fr); align-items: stretch; }
	.shh.shj.sll--article .slla-keep-grid > .sll-card--lead .sll-card-media { position: relative; min-height: 300px; }
	.shh.shj.sll--article .slla-keep-grid > .sll-card--lead .sll-card-media .sl-cover { position: absolute; inset: 0; height: 100%; aspect-ratio: auto; }
	.shh.shj.sll--article .slla-keep-grid > .sll-card--lead .sll-card-body { align-content: center; padding: clamp(22px, 2.6vw, 34px); }
}
.shh.shj.sll--relart .slla-keep-lead .shl-card-title, .shh.shj.sll--relart .slla-keep-lead h3 { font-size: clamp(1.3rem, 1.05rem + .9vw, 1.7rem); line-height: 1.18; }
.shh.shj.sll--article .slla-topics { display: grid; gap: 10px; margin-top: 30px; }
.shh.shj.sll--article .slla-topics .sll-chip.is-here { border-color: var(--t, #1d6f97); background: var(--t-soft, #eaf6fb); }
.shh.shj.sll--article .slla-topics .sll-chip-n { font: 700 12px/1 var(--shh-text); color: var(--sll-muted); font-variant-numeric: tabular-nums; }
.shh.shj.sll--article .slla-keep-more { margin-top: 22px; }

/* Continue: the journey's own block as onward tiles (its markup unchanged) */
.shh.shj.sll--article .slla-after .sh-next { background: rgba(255, 255, 255, .82); }
.shh.shj.sll--article .slla-after .sh-next-actions { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.shh.shj.sll--article .slla-after .sh-next-secondary { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; width: 100%; }
.shh.shj.sll--article .slla-after .sh-next-primary, .shh.shj.sll--article .slla-after .sh-next-secondary a { position: relative; display: flex; align-items: flex-end; width: 100%; min-height: 84px; padding: 16px 52px 16px 20px; border-radius: 20px; text-align: left; justify-content: flex-start; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.shh.shj.sll--article .slla-after .sh-next-primary::after, .shh.shj.sll--article .slla-after .sh-next-secondary a::after { content: "→"; position: absolute; right: 20px; bottom: 16px; font: 700 18px/1 var(--shh-text); }
.shh.shj.sll--article .slla-after .sh-next-primary:hover, .shh.shj.sll--article .slla-after .sh-next-secondary a:hover { transform: translateY(-2px); box-shadow: 0 20px 36px -26px rgba(18, 44, 58, .55); }
@media (min-width: 768px) {
	.shh.shj.sll--article .slla-after .sh-next-actions { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); align-items: stretch; }
	.shh.shj.sll--article .slla-after .sh-next-secondary { grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); }
	.shh.shj.sll--article .slla-after .sh-next-primary, .shh.shj.sll--article .slla-after .sh-next-secondary a { min-height: 104px; }
}
@media (prefers-reduced-motion: reduce) {
	.shh.shj.sll--article .slla-after .sh-next-primary, .shh.shj.sll--article .slla-after .sh-next-secondary a { transition: none; }
	.shh.shj.sll--article .slla-after .sh-next-primary:hover, .shh.shj.sll--article .slla-after .sh-next-secondary a:hover { transform: none; }
}

/* religious articles: the tradition's colours for the conversation, cards and tiles; the chapters' grounds */
.shh.shj.sll--relart .sll-node--authors { background-color: var(--sllr-ink, #6b5420); }
.shh.shj.sll--relart .sll-node--keep { background-color: #b8740a; }
.shh.shj.sll--relart .sll-node--use { background-color: #24857a; }
.shh.shj.sll--relart [data-shj-tone="trad"] { --sll-tone-ink: var(--sllr-ink, #6b5420); --shj-say: var(--sllr-ink, #6b5420); }
.shh.shj.sll--relart [data-shj-tone="writings"] { --sll-tone-ink: #8a5a06; --shj-say: #8a5a06; }
.shh.shj.sll--relart [data-shj-tone="explore"] { --sll-tone-ink: #1d6b61; --shj-say: #1d6b61; }
.shh.shj.sll--relart .slla-sec--ask { background: radial-gradient(40% 60% at 96% 12%, rgba(203, 166, 86, .14), rgba(203, 166, 86, 0) 70%), linear-gradient(180deg, #ffffff 0%, var(--sllr-tint, #f7f4ea) 100%); border-top: 1px solid rgba(203, 166, 86, .28); }
.shh.shj.sll--relart .slla-sec--keep { background: linear-gradient(180deg, #fffdf8 0%, #ffffff 100%); border-top: 1px solid rgba(203, 166, 86, .2); }
.shh.shj.sll--relart .slla-sec--last { background: radial-gradient(50% 60% at 92% 100%, rgba(63, 179, 157, .14), rgba(63, 179, 157, 0) 70%), linear-gradient(180deg, #f6fbfa 0%, #e9f4f0 100%); border-top: 1px solid #dcebe6; }
.shh.shj.sll--relart .slla-chat { border-color: rgba(203, 166, 86, .4); background: linear-gradient(180deg, #ffffff 0%, #fffdf7 100%); box-shadow: 0 34px 60px -46px rgba(107, 84, 32, .5); }
.shh.shj.sll--relart .slla-chat-bubble { background: var(--sllr-tint, #f7f4ea); }
.shh.shj.sll--relart .slla-chat-q { border-color: rgba(203, 166, 86, .55); }
.shh.shj.sll--relart .slla-chat-q-k, .shh.shj.sll--relart .slla-chat-q .shh-i { color: var(--sllr-ink, #6b5420); }
.shh.shj.sll--relart .slla-chat-q:hover, .shh.shj.sll--relart .slla-chat-q:focus-visible { border-color: var(--sllr-ink, #6b5420); box-shadow: 0 16px 30px -22px rgba(107, 84, 32, .55); }
.shh.shj.sll--relart .slla-writer-name a:hover, .shh.shj.sll--relart .slla-peers-all a { color: var(--sllr-ink, #6b5420); }
.shh.shj.sll--relart .slla-peer-list .sl-face { --sl-ring: rgba(203, 166, 86, .55); }
.shh.shj.sll--relart .slla-keep-lead { padding: clamp(20px, 2.4vw, 28px); background: linear-gradient(160deg, var(--sllr-tint, #f7f4ea) 0%, #ffffff 80%); border-color: rgba(203, 166, 86, .45); }
.shh.shj.sll--relart .slla-tiles { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; margin: 26px 0 0; padding: 0; list-style: none; }
.shh.shj.sll--relart .slla-tiles > li { display: grid; min-width: 0; }
@media (min-width: 768px) { .shh.shj.sll--relart .slla-tiles { grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); } }
.shh.shj.sll--relart .slla-tile { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; align-content: end; min-height: 128px; padding: 18px 52px 18px 20px; border: 1px solid #d9e9e3; border-radius: 22px; background: #fff; color: var(--sll-ink); box-shadow: 0 24px 44px -38px rgba(18, 44, 58, .55); transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.shh.shj.sll--relart .slla-tile-i { display: inline-grid; place-items: center; width: 40px; height: 40px; margin-bottom: 6px; border-radius: 50%; background: var(--sllr-tint, #f7f4ea); color: var(--sllr-ink, #6b5420); box-shadow: inset 0 0 0 1.5px rgba(203, 166, 86, .5); }
.shh.shj.sll--relart .slla-tile-i .shh-i { width: 20px; height: 20px; }
.shh.shj.sll--relart .slla-tile-k { font: 800 11px/1.2 var(--shh-text); letter-spacing: .12em; text-transform: uppercase; color: var(--sllr-ink, #6b5420); }
.shh.shj.sll--relart .slla-tile-t { font: 700 17px/1.3 var(--shh-text); }
.shh.shj.sll--relart .slla-tile > .shh-i:last-child { position: absolute; right: 20px; bottom: 20px; width: 18px; height: 18px; color: #1d6b61; }
.shh.shj.sll--relart .slla-tile:hover, .shh.shj.sll--relart .slla-tile:focus-visible { border-color: #3fb39d; transform: translateY(-2px); box-shadow: 0 26px 44px -30px rgba(18, 44, 58, .55); }
.shh.shj.sll--relart .slla-others { display: grid; gap: 12px; margin-top: 30px; }
@media (prefers-reduced-motion: reduce) {
	.shh.shj.sll--relart .slla-tile { transition: none; }
	.shh.shj.sll--relart .slla-tile:hover, .shh.shj.sll--relart .slla-tile:focus-visible { transform: none; }
}
/* phones: the introduction's three actions share one width */
@media (max-width: 599.98px) {
	.shh.shj.sll--article .slla-mast-acts > * { width: 100%; justify-content: center; }
}
/* religious articles: the reading takes the tradition's own text colour, as it inherits it on the theme's page (the
   reading guard's Learn ink is for posts) */
.shh.shj.sll--relart .slla-read { color: inherit; }
/* propagation: a tradition without a library: its guidance chapter, in the tradition's own ink, compact */
.shh.shj.sll--tradition .sllr-band--writings.is-guidance { padding-block: clamp(36px, 4.4vw, 56px); background: linear-gradient(180deg, #ffffff 0%, var(--sllr-tint, #f7f4ea) 100%); }
.shh.shj.sll--tradition .sllr-node--guidance { background-color: var(--sllr-ink, #6b5420); }