/* =========================================================
   THE VAULT — funnel skin for ZachWheat.com
   @version 1.5.1
   Navy base, amber headings, light-grey text, white links,
   dark-ink inputs with 1px borders. White + light-grey
   sections break up the navy.

   Everything is scoped to body.zw-vault so it can't leak
   into the rest of the theme.
   ========================================================= */

body.zw-vault {
	--zv-navy:        #0d1b2e;
	--zv-navy-deep:   #0a1524;
	--zv-ink:         #0d1320;   /* input backgrounds, card insets */
	--zv-card:        #111827;
	--zv-amber:       #f59e0b;
	--zv-amber-soft:  #f5c26b;
	--zv-text:        #d1d5db;   /* light grey body text on navy */
	--zv-muted:       #9ca3af;
	--zv-line:        #f5c26b33; /* thin amber hairline */
	--zv-white:       #ffffff;
	--zv-grey:        #f3f4f6;   /* light grey section */
	--zv-dark-text:   #1f2937;   /* body text on white/grey */
	--zv-dark-muted:  #4b5563;
	--zv-dark-line:   #d1d5db;

	--zv-head: "Syne", Arial, sans-serif;
	--zv-mono: "DM Mono", ui-monospace, monospace;
	--zv-body: Arial, Helvetica, sans-serif;

	--zv-wrap: 1100px;
	--zv-radius: 6px;

	background: var(--zv-navy);
	color: var(--zv-text);
}

.zw-vault .zv-main { font-family: var(--zv-body); font-size: 17px; line-height: 1.65; }
.zw-vault .zv-main *,
.zw-vault .zv-main *::before,
.zw-vault .zv-main *::after { box-sizing: border-box; }

/* ---------- Layout ---------- */
.zv-wrap   { max-width: var(--zv-wrap); margin: 0 auto; padding: 0 20px; }
.zv-narrow { max-width: 720px; }
.zv-section { padding: 80px 0; }
@media (max-width: 700px) { .zv-section { padding: 56px 0; } }

.zv-navy  { background: var(--zv-navy);  color: var(--zv-text); }
.zv-deep  { background: var(--zv-navy-deep); color: var(--zv-text); border-top: 1px solid var(--zv-line); border-bottom: 1px solid var(--zv-line); }
.zv-white { background: var(--zv-white); color: var(--zv-dark-text); }
.zv-grey  { background: var(--zv-grey);  color: var(--zv-dark-text); }

.zv-center { text-align: center; }
.zv-center .zv-lede { margin-left: auto; margin-right: auto; }

/* ---------- Type ---------- */
.zv-main h1, .zv-main h2, .zv-main h3 {
	font-family: var(--zv-head);
	line-height: 1.15;
	margin: 0 0 .5em;
	letter-spacing: -.01em;
}
.zv-main h1 { font-size: clamp(2.2rem, 5vw, 3.6rem); font-weight: 800; }
.zv-main h2 { font-size: clamp(1.7rem, 3.4vw, 2.5rem); font-weight: 700; }
.zv-main h3 { font-size: 1.25rem; font-weight: 700; }

.zv-navy h1, .zv-navy h2, .zv-navy h3,
.zv-deep h1, .zv-deep h2, .zv-deep h3 { color: var(--zv-amber); }
.zv-white h1, .zv-white h2, .zv-white h3,
.zv-grey  h1, .zv-grey  h2, .zv-grey  h3 { color: var(--zv-navy); }

.zv-main p { margin: 0 0 1.1em; }
.zv-lede { font-size: 1.2rem; max-width: 640px; }
.zv-navy .zv-lede { color: var(--zv-text); }

.zv-navy a:not(.zv-btn), .zv-deep a:not(.zv-btn) {
	color: var(--zv-white);
	text-decoration: none;
	border-bottom: 1px dotted var(--zv-amber-soft);
}
.zv-navy a:not(.zv-btn):hover, .zv-deep a:not(.zv-btn):hover { color: var(--zv-amber-soft); }
.zv-white a:not(.zv-btn), .zv-grey a:not(.zv-btn) { color: var(--zv-navy); font-weight: 600; }

/* Eyebrow + the signature glowing amber dot */
.zv-eyebrow {
	font-family: var(--zv-mono);
	font-size: .8rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--zv-amber-soft);
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 18px;
}
.zv-white .zv-eyebrow, .zv-grey .zv-eyebrow { color: #b45309; }

.zv-dot {
	width: 9px; height: 9px; border-radius: 50%;
	background: var(--zv-amber);
	box-shadow: 0 0 6px 2px rgba(245, 158, 11, .65);
	animation: zv-pulse 2.4s ease-in-out infinite;
	flex: none;
}
@keyframes zv-pulse {
	50% { box-shadow: 0 0 12px 4px rgba(245, 158, 11, .35); }
}
@media (prefers-reduced-motion: reduce) { .zv-dot { animation: none; } }

.zv-mono { font-family: var(--zv-mono); }
.zv-small { font-size: .88rem; color: var(--zv-muted); }
.zv-white .zv-small, .zv-grey .zv-small { color: var(--zv-dark-muted); }

/* ---------- Buttons ----------
   Placeholder classes. Swap in your own button kit by giving
   your buttons these class names, or replacing these rules. */
.zv-btn {
	display: inline-block;
	font-family: var(--zv-mono);
	font-weight: 500;
	font-size: 1rem;
	letter-spacing: .06em;
	text-transform: uppercase;
	text-decoration: none;
	padding: 16px 30px;
	border-radius: var(--zv-radius);
	border: 1px solid var(--zv-amber);
	cursor: pointer;
	transition: background .2s, color .2s, transform .1s;
	line-height: 1.2;
}
.zv-btn:active { transform: translateY(1px); }
.zv-btn-amber { background: var(--zv-amber); color: var(--zv-navy); }
.zv-btn-amber:hover { background: var(--zv-amber-soft); color: var(--zv-navy); }
.zv-btn-ghost { background: transparent; color: var(--zv-amber-soft); }
.zv-btn-ghost:hover { background: rgba(245, 158, 11, .1); }
.zv-btn-block { display: block; width: 100%; text-align: center; }
.zv-btn:focus-visible { outline: 2px solid var(--zv-white); outline-offset: 3px; }

/* ---------- Forms (dark ink, 1px border) ---------- */
.zv-form { display: grid; gap: 16px; text-align: left; }
.zv-field label {
	display: block;
	font-family: var(--zv-mono);
	font-size: .78rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--zv-muted);
	margin-bottom: 6px;
}
.zv-field input[type="text"],
.zv-field input[type="email"],
.zv-gate input[type="password"] {
	width: 100%;
	background: var(--zv-ink);
	color: var(--zv-white);
	border: 1px solid var(--zv-line);
	border-radius: var(--zv-radius);
	padding: 14px 16px;
	font-size: 1rem;
	font-family: var(--zv-body);
	transition: border-color .2s, box-shadow .2s;
}
.zv-field input:focus,
.zv-gate input[type="password"]:focus {
	outline: none;
	border-color: var(--zv-amber-soft);
	box-shadow: 0 0 0 3px rgba(245, 158, 11, .18);
}
.zv-check {
	display: grid;
	grid-template-columns: 20px 1fr;
	gap: 10px;
	align-items: start;
	font-size: .92rem;
	color: var(--zv-text);
	cursor: pointer;
}
.zv-check input { accent-color: var(--zv-amber); width: 18px; height: 18px; margin: 3px 0 0; }

/* Honeypot — off-screen, not display:none (some bots skip hidden fields) */
.zv-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

.zv-notice {
	border: 1px solid var(--zv-amber);
	background: rgba(245, 158, 11, .08);
	color: var(--zv-amber-soft);
	padding: 12px 16px;
	border-radius: var(--zv-radius);
	font-size: .95rem;
}

/* ---------- Signup page ---------- */
.zv-hero { padding: 96px 0 72px; }
.zv-hero-grid {
	display: grid;
	grid-template-columns: 1.15fr .85fr;
	gap: 56px;
	align-items: center;
}
@media (max-width: 860px) { .zv-hero-grid { grid-template-columns: 1fr; gap: 40px; } }

.zv-panel {
	background: var(--zv-card);
	border: 1px solid var(--zv-line);
	border-radius: 10px;
	padding: 32px;
}
.zv-panel h2 { font-size: 1.5rem; }

.zv-three {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 28px;
}
@media (max-width: 800px) { .zv-three { grid-template-columns: 1fr; } }
.zv-three h3 { margin-bottom: .35em; }
.zv-num {
	font-family: var(--zv-mono);
	color: #b45309;
	font-size: .85rem;
	letter-spacing: .1em;
	display: block;
	margin-bottom: 8px;
}

/* ---------- Report grid (offer page) ---------- */
.zv-reports {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
	margin-top: 40px;
}
@media (max-width: 760px) { .zv-reports { grid-template-columns: 1fr; } }

/* Navy cards sitting on a white section */
.zv-report {
	display: grid;
	grid-template-columns: 112px 1fr;
	gap: 22px;
	align-items: center;
	background: var(--zv-navy);
	border: 1px solid var(--zv-line);
	border-radius: 8px;
	padding: 20px;
	box-shadow: 0 6px 18px rgba(13, 27, 46, .12);
	transition: transform .2s, box-shadow .2s;
}
.zv-report:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(13, 27, 46, .2); }
.zv-report img,
.zv-report .zv-cover {
	width: 112px; height: 150px;
	object-fit: cover;
	border-radius: 3px;
	background: var(--zv-card);
	border: 1px solid #f5c26b55;
	display: grid;
	place-items: center;
	font-family: var(--zv-mono);
	color: var(--zv-amber);
	font-size: 1.4rem;
}
.zv-main .zv-report h3 { font-size: 1.08rem; margin-bottom: .35em; color: var(--zv-amber); }
.zv-report p { margin: 0; font-size: .92rem; color: var(--zv-text); line-height: 1.5; }

.zv-report-sealed {
	grid-column: 1 / -1;
	background: #000;
	border: 2px solid var(--zv-amber);
	grid-template-columns: 140px 1fr;
	padding: 28px;
}
.zv-report-sealed img,
.zv-report-sealed .zv-cover { width: 140px; height: 187px; border: 2px solid var(--zv-amber-soft); font-size: 2.6rem; background: #111; }
.zv-main .zv-report-sealed h3 { color: var(--zv-amber-soft); font-size: 1.45rem; }
.zv-report-sealed p { font-size: 1rem; }

/* Zach's note under the report grid */
.zv-reports-note { max-width: 720px; margin: 48px 0 0; }
.zv-reports-note p { color: var(--zv-dark-text); }

@media (max-width: 480px) {
	.zv-report { grid-template-columns: 84px 1fr; gap: 16px; padding: 16px; }
	.zv-report img, .zv-report .zv-cover { width: 84px; height: 112px; }
	.zv-report-sealed { grid-template-columns: 96px 1fr; }
	.zv-report-sealed img, .zv-report-sealed .zv-cover { width: 96px; height: 128px; }
}

/* ---------- "What's in the box" list ---------- */
.zv-list { list-style: none; padding: 0; margin: 0 0 1.5em; }
.zv-list li {
	position: relative;
	padding: 10px 0 10px 30px;
	border-bottom: 1px dotted var(--zv-dark-line);
}
.zv-navy .zv-list li, .zv-deep .zv-list li { border-bottom-color: var(--zv-line); }
.zv-list li::before {
	content: "";
	position: absolute; left: 4px; top: 19px;
	width: 8px; height: 8px; border-radius: 50%;
	background: var(--zv-amber);
	box-shadow: 0 0 6px rgba(245, 158, 11, .6);
}

/* ---------- Pricing card ----------
   Placeholder — swap for your pricing-table kit. */
.zv-price-card {
	max-width: 460px;
	margin: 40px auto 0;
	background: var(--zv-card);
	border: 1px solid var(--zv-amber);
	border-radius: 12px;
	padding: 36px 32px;
	text-align: center;
	box-shadow: 0 20px 60px rgba(0, 0, 0, .35);
}
.zv-price-card h3 { color: var(--zv-amber); font-size: 1.35rem; }
.zv-price {
	font-family: var(--zv-head);
	font-weight: 800;
	font-size: 4rem;
	color: var(--zv-white);
	line-height: 1;
	margin: 12px 0 6px;
}
.zv-price sup { font-size: 1.6rem; vertical-align: top; position: relative; top: .5em; margin-right: 2px; }
.zv-price-note { font-family: var(--zv-mono); font-size: .8rem; letter-spacing: .1em; text-transform: uppercase; color: var(--zv-muted); margin-bottom: 24px; }
.zv-price-card .zv-list { text-align: left; }
.zv-price-card .zv-list li { border-bottom-color: var(--zv-line); color: var(--zv-text); }
.zv-price-card .zv-small { margin: 14px 0 0; }

/* ---------- FAQ ---------- */
.zv-faq details {
	border-bottom: 1px solid var(--zv-dark-line);
	padding: 18px 0;
}
.zv-faq summary {
	font-family: var(--zv-head);
	font-weight: 700;
	font-size: 1.1rem;
	color: var(--zv-navy);
	cursor: pointer;
	list-style: none;
	display: flex; justify-content: space-between; gap: 16px;
}
.zv-faq summary::-webkit-details-marker { display: none; }
.zv-faq summary::after { content: "+"; font-family: var(--zv-mono); color: #b45309; }
.zv-faq details[open] summary::after { content: "–"; }
.zv-faq details p { margin: 12px 0 0; color: var(--zv-dark-muted); }

/* ---------- Signature note ---------- */
.zv-note {
	border-left: 2px solid var(--zv-amber);
	padding: 4px 0 4px 22px;
	font-size: 1.05rem;
}
.zv-sig { font-family: var(--zv-mono); color: var(--zv-amber-soft); margin-top: 1em; }
.zv-white .zv-sig, .zv-grey .zv-sig { color: #b45309; }
/* Signature: amber on navy (inherits above), ballpoint blue on white & grey */
.zv-white .zv-sig .zw-signature, .zv-grey .zv-sig .zw-signature { color: #1e3a8a; }

/* ---------- Delivery page ---------- */
.zv-downloads { display: grid; gap: 12px; margin: 28px 0; }
.zv-download {
	display: flex; justify-content: space-between; align-items: center; gap: 16px;
	background: var(--zv-white);
	border: 1px solid var(--zv-dark-line);
	border-radius: var(--zv-radius);
	padding: 16px 18px;
}
.zv-download strong { color: var(--zv-navy); }

.zv-gate { text-align: center; }
.zv-gate form { max-width: 380px; margin: 28px auto 0; display: grid; gap: 12px; }
.zv-gate form p { margin: 0; }
.zv-gate label { font-family: var(--zv-mono); font-size: .8rem; color: var(--zv-muted); }
.zv-gate input[type="submit"] {
	background: var(--zv-amber); color: var(--zv-navy);
	border: 1px solid var(--zv-amber); border-radius: var(--zv-radius);
	padding: 14px; font-family: var(--zv-mono); text-transform: uppercase; letter-spacing: .06em;
	cursor: pointer; width: 100%;
}

/* =========================================================
   DOCS / HELP LAYOUT
   Full width. Sidebar is flush left, tucked right under the
   site header, full viewport height, and stays put on scroll.
   Reusable for any future help pages: .zv-docs > .zv-docs-nav + .zv-docs-main
   ========================================================= */

/* Height of the sticky site header (64px + 1px border), so the sidebar
   stops right underneath it instead of sliding behind it. */
body.zw-vault { --zv-docs-top: 65px; }

.zv-docs {
	display: grid;
	grid-template-columns: 300px minmax(0, 1fr);
	/* The dark sidebar column is painted as a background, so it always runs
	   the full height of the page, even when the links stop scrolling. */
	background: linear-gradient(to right, var(--zv-ink) 0 299px, var(--zv-line) 299px 300px, var(--zv-navy) 300px);
	min-height: 80vh;
}

.zv-docs-nav {
	position: sticky;
	top: var(--zv-docs-top);
	align-self: start;
	max-height: calc(100vh - var(--zv-docs-top));
	overflow-y: auto;
	padding: 32px 22px 40px;
}
/* WordPress admin bar (logged in) is 32px tall and pinned to the top */
.admin-bar .zv-docs-nav {
	top: calc(var(--zv-docs-top) + 32px);
	max-height: calc(100vh - var(--zv-docs-top) - 32px);
}
@media screen and (max-width: 782px) {
	.admin-bar .zv-docs-nav {
		top: calc(var(--zv-docs-top) + 46px);
		max-height: calc(100vh - var(--zv-docs-top) - 46px);
	}
}

.zv-docs-nav h2 {
	font-family: var(--zv-head);
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--zv-amber);
	margin: 0 0 18px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--zv-line);
}

.zv-docs-nav a {
	display: grid;
	grid-template-columns: 28px 1fr;
	align-items: center;
	padding: 11px 0;
	font-size: .95rem;
	line-height: 1.35;
	color: var(--zv-text) !important;
	border-bottom: 1px dotted var(--zv-line) !important;
	transition: color .15s;
}
.zv-docs-icon { font-size: 1.1rem; }
.zv-docs-label { text-align: right; padding-right: 6px; }
.zv-docs-nav a:hover { color: var(--zv-amber-soft) !important; }
.zv-docs-nav a.is-active { color: var(--zv-amber) !important; }
.zv-docs-nav a { position: relative; }
.zv-docs-nav a.is-active::after {
	content: "";
	position: absolute;
	right: -14px; top: 50%;
	margin-top: -3px;
	width: 6px; height: 6px; border-radius: 50%;
	background: var(--zv-amber);
	box-shadow: 0 0 6px 2px rgba(245, 158, 11, .55);
}

.zv-docs-main {
	padding: 36px 56px 96px;
	max-width: 980px;
}

.zv-docs-crumb {
	font-family: var(--zv-mono);
	font-size: .8rem;
	color: var(--zv-muted);
	margin-bottom: 10px !important;
}
.zv-docs-crumb a { color: var(--zv-amber-soft) !important; border-bottom: 0 !important; }

.zv-main .zv-docs-main h1 {
	font-size: clamp(1.6rem, 2.4vw, 2.05rem);
	letter-spacing: .02em;
	text-transform: uppercase;
	margin-bottom: .35em;
}
.zv-docs-intro { color: var(--zv-muted); margin-bottom: 28px !important; }

@media (max-width: 900px) {
	.zv-docs { grid-template-columns: minmax(0, 1fr); background: var(--zv-navy); }
	.zv-docs-nav,
	.admin-bar .zv-docs-nav {
		position: static;
		max-height: none;
		background: var(--zv-ink);
		border-right: 0;
		border-bottom: 1px solid var(--zv-line);
		padding: 24px 20px;
	}
	.zv-docs-label { text-align: left; }
	.zv-docs-main { padding: 28px 20px 64px; }
}

/* ---------- Reference library content ---------- */
.zv-lib-tools { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 32px; }
.zv-lib-tools .zv-field { flex: 1 1 260px; }
.zv-lib-tools .zv-field input { width: 100%; }

.zv-lib-section { margin-bottom: 48px; scroll-margin-top: calc(var(--zv-docs-top) + 24px); }
.admin-bar .zv-lib-section { scroll-margin-top: calc(var(--zv-docs-top) + 56px); }
.zv-lib-section h2 {
	font-size: 1.3rem;
	border-bottom: 1px solid var(--zv-line);
	padding-bottom: 10px;
	margin-bottom: 16px;
}
.zv-lib-section ul { list-style: none; padding: 0; margin: 0; }
.zv-lib-section li { padding: 10px 0; border-bottom: 1px dotted var(--zv-line); }
.zv-lib-section li a[target="_blank"]::after { content: " ↗"; font-size: .8em; color: var(--zv-amber-soft); }
.zv-lib-section .zv-note-line { display: block; color: var(--zv-muted); font-size: .9rem; margin-top: 2px; }
.zv-lib-empty { display: none; }

@media print {
	.zv-docs-nav, .zv-lib-tools, .site-header, .site-footer, #wpadminbar { display: none !important; }
	body.zw-vault, .zv-navy, .zv-docs { background: #fff !important; color: #000 !important; }
	.zv-docs { grid-template-columns: 1fr; }
	.zv-docs-main { padding: 0; max-width: none; }
	.zv-lib-section h2 { color: #000 !important; }
	.zv-lib-section a { color: #000 !important; }
	.zv-lib-section a[href^="http"]::after { content: " (" attr(href) ")"; font-size: .8em; }
}


/* =========================================================
   LIVING FIELDS — ZachWheat.com
   Pure-CSS take on the old "Living Forms" effects:
   - Active field: soft amber glow around the border
   - Incomplete required field: red glow that pulses until
     you click into it (no images, no jQuery)
   Works on any input inside .zv-field, .zv-gate, or .zw-living
   ========================================================= */

:root {
	--zl-amber: 245, 158, 11;
	--zl-red: 239, 68, 68;
}

/* Active: amber glow */
.zv-field input:focus,
.zv-gate input[type="password"]:focus,
.zw-living :is(input, textarea, select):focus {
	outline: none;
	border-color: rgb(var(--zl-amber));
	box-shadow:
		0 0 0 1px rgba(var(--zl-amber), .55),
		0 0 14px 2px rgba(var(--zl-amber), .28),
		inset 0 0 10px rgba(var(--zl-amber), .06);
	transition: border-color .2s ease, box-shadow .25s ease;
}

/* Incomplete: red pulse.
   :user-invalid only kicks in after the visitor has interacted with the
   field or tried to submit, so nothing glows red on page load. */
/* Stays red even while you're typing in it, until the value is valid.
   Then the amber "active" glow takes over. */
.zv-field input:user-invalid,
.zw-living :is(input, textarea, select):user-invalid,
.zv-field input.is-incomplete:invalid,
.zw-living .is-incomplete:invalid {
	border-color: rgb(var(--zl-red));
	animation: zl-pulse-red 1.6s ease-in-out infinite;
}

@keyframes zl-pulse-red {
	0%, 100% {
		box-shadow: 0 0 0 1px rgba(var(--zl-red), .35), 0 0 4px 0 rgba(var(--zl-red), .15);
	}
	50% {
		box-shadow: 0 0 0 1px rgba(var(--zl-red), .9), 0 0 18px 3px rgba(var(--zl-red), .45);
	}
}

/* Required checkboxes left unticked: the label text pulses red too */
.zv-check:has(input:user-invalid),
.zv-check.is-incomplete:has(input:not(:checked)) {
	color: rgb(var(--zl-red));
	animation: zl-pulse-text 1.6s ease-in-out infinite;
}
.zv-check:has(input:user-invalid) input,
.zv-check.is-incomplete:has(input:not(:checked)) input { outline: 1px solid rgb(var(--zl-red)); outline-offset: 2px; }

@keyframes zl-pulse-text {
	0%, 100% { text-shadow: none; }
	50%      { text-shadow: 0 0 10px rgba(var(--zl-red), .55); }
}

/* Respect visitors who turn off motion: keep the colors, drop the pulse */
@media (prefers-reduced-motion: reduce) {
	.zv-field input,
	.zw-living :is(input, textarea, select),
	.zv-check { animation: none !important; transition: none !important; }
}


/* =========================================================
   DOCS PAGE CONTENT (page-docs.php)
   Editor content on the navy docs layout.
   ========================================================= */
.zv-docs-num {
	font-family: var(--zv-mono);
	font-size: .72rem !important;
	color: var(--zv-amber-soft);
	letter-spacing: .06em;
}
.zv-docs-content { color: var(--zv-text); }
.zv-docs-content > * + * { margin-top: 1em; }
.zv-docs-content h2 {
	font-size: 1.3rem;
	color: var(--zv-amber);
	border-bottom: 1px solid var(--zv-line);
	padding-bottom: 10px;
	margin: 2.4em 0 .8em;
	scroll-margin-top: calc(var(--zv-docs-top) + 24px);
}
.admin-bar .zv-docs-content h2 { scroll-margin-top: calc(var(--zv-docs-top) + 56px); }
.zv-docs-content h2:first-child { margin-top: .4em; }
.zv-docs-content h3 { font-size: 1.05rem; color: #fff; margin: 1.6em 0 .5em; }
.zv-docs-content ul, .zv-docs-content ol { padding-left: 1.3em; }
/* The theme reset removes list markers; bring them back for docs content */
.zv-docs-content ul { list-style: disc; }
.zv-docs-content ol { list-style: decimal; }
.zv-docs-content ul ul { list-style: circle; }
.zv-docs-content li { margin-bottom: .4em; }
.zv-docs-content li::marker { color: var(--zv-amber); }
.zv-docs-content strong { color: #fff; }
.zv-docs-content img { max-width: 100%; height: auto; border-radius: 6px; border: 1px solid var(--zv-line); }
.zv-docs-content blockquote {
	border-left: 2px solid var(--zv-amber);
	padding: 4px 0 4px 18px;
	margin-left: 0;
	color: var(--zv-text);
}
.zv-docs-content table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.zv-docs-content th { text-align: left; color: var(--zv-amber-soft); font-family: var(--zv-mono); font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; border-bottom: 1px solid var(--zv-line); padding: 8px; }
.zv-docs-content td { border-bottom: 1px dotted var(--zv-line); padding: 8px; }
.zv-docs-updated { margin-top: 3em !important; padding-top: 14px; border-top: 1px dotted var(--zv-line); }

/* Back to top */
.zv-top {
	position: fixed;
	right: 22px; bottom: 22px;
	z-index: 90;
	font-family: var(--zv-mono);
	font-size: .75rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--zv-amber-soft);
	background: var(--zv-ink);
	border: 1px solid rgba(245, 158, 11, .6);
	border-radius: 6px;
	padding: 9px 14px;
	cursor: pointer;
	opacity: 0;
	transform: translateY(10px);
	pointer-events: none;
	transition: opacity .25s, transform .25s, box-shadow .2s;
}
.zv-top.is-visible { opacity: 1; transform: none; pointer-events: auto; }
.zv-top:hover { box-shadow: 0 0 0 1px rgba(245, 158, 11, .4), 0 0 14px 2px rgba(245, 158, 11, .25); }
@media print { .zv-top { display: none !important; } }

/* =========================================================
   AFFILIATE TOOLKIT (1.5.0) — page-affiliate-toolkit.php
   ========================================================= */
.zt-progress {
	display: flex; align-items: center; gap: 12px;
	font-size: .8rem; letter-spacing: .08em; text-transform: uppercase;
	color: var(--zv-amber-soft);
	margin: 0 0 32px !important;
}
.zt-progress-bar {
	flex: 0 0 140px; height: 6px; border-radius: 3px;
	background: rgba(255,255,255,.08); overflow: hidden;
}
.zt-progress-bar { display: flex; }
.zt-progress-sub { color: var(--zv-muted); }
.zt-progress-bar .is-reviewing { background: rgba(245,194,107,.35); box-shadow: none; }
.zt-progress-bar span { display: block; height: 100%; background: var(--zv-amber); box-shadow: 0 0 8px rgba(245,158,11,.6); }

.zt-small { font-size: .9rem; color: var(--zv-muted); }
.zt-tools { margin-top: 40px; }
.zt-section-intro { color: var(--zv-muted); margin: -4px 0 18px; }

.zt-list {
	display: grid; gap: 16px;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr));
}
.zv-lib-section li.zt-card {
	display: flex; flex-direction: column; gap: 8px;
	padding: 18px 18px 16px;
	background: var(--zv-card);
	border: 1px solid rgba(255,255,255,.08);
	border-radius: var(--zv-radius);
	transition: border-color .2s;
}
.zv-lib-section li.zt-card[hidden] { display: none; }   /* keep search working */
.zt-card:hover { border-color: var(--zv-line); }
.zt-card.is-tested { border-color: rgba(245,158,11,.45); }

/* Middle stage: terms read, still reviewing */
.zt-card.is-reviewing { border-color: rgba(245,194,107,.25); }
.zt-badge.is-reviewing {
	display: inline-flex; align-items: center; gap: 6px;
	color: var(--zv-amber-soft);
	border: 1px solid rgba(245,194,107,.45);
	background: rgba(245,194,107,.08);
}
.zt-badge-dot {
	width: 6px; height: 6px; border-radius: 50%;
	background: var(--zv-amber-soft);
	animation: zt-pulse 1.8s ease-in-out infinite;
}
@keyframes zt-pulse { 50% { opacity: .3; } }
@media (prefers-reduced-motion: reduce) { .zt-badge-dot { animation: none; } }
.zt-notes.is-reviewing { border-left-style: dashed; background: rgba(245,194,107,.04); }

.zt-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.zt-card h3 { margin: 0 !important; font-size: 1.05rem; color: #fff; line-height: 1.3; }

/* The badge */
.zt-badge {
	flex: none;
	font-family: var(--zv-mono);
	font-size: .66rem; letter-spacing: .1em; text-transform: uppercase;
	line-height: 1; white-space: nowrap;
	padding: 5px 8px; border-radius: 999px;
	color: var(--zv-muted);
	border: 1px dashed rgba(156,163,175,.5);
}
.zt-badge.is-tested {
	color: var(--zv-navy);
	background: var(--zv-amber);
	border: 1px solid var(--zv-amber);
	box-shadow: 0 0 10px rgba(245,158,11,.35);
}

.zv-main .zt-card p { margin: 0; }
.zt-what { font-size: .95rem; }
.zt-for { font-size: .88rem; color: var(--zv-muted); }
.zt-for .zv-mono { font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; color: var(--zv-amber-soft); margin-right: 6px; }

.zt-notes {
	margin-top: 4px; padding: 10px 12px;
	border-left: 2px solid var(--zv-amber);
	background: rgba(245,158,11,.06);
	border-radius: 0 4px 4px 0;
	font-size: .92rem;
}
.zt-notes p { margin: 0 0 .5em; }
.zt-notes p:last-child { margin: 0; }
.zt-notes-label { display: block; font-size: .66rem; letter-spacing: .12em; text-transform: uppercase; color: var(--zv-amber-soft); margin-bottom: 4px; }

.zt-visit {
	margin-top: auto; padding-top: 6px;
	font-family: var(--zv-mono); font-size: .8rem; letter-spacing: .06em;
	color: var(--zv-amber-soft) !important; text-decoration: none !important;
	border-bottom: 0 !important;
}
.zt-visit:hover { color: var(--zv-amber) !important; }

@media print {
	.zt-progress, .zt-tools { display: none !important; }
	.zv-lib-section li.zt-card { background: none; border: 1px solid #999; break-inside: avoid; }
	.zt-card h3, .zt-what { color: #000 !important; }
}