/*
 * Ketabbin 2.8 — Enchanted Academia
 * A polished Persian fantasy-library skin. The commerce architecture remains intact.
 */

:root {
	--kb-emerald: #0d5b4b;
	--kb-emerald-bright: #1d8069;
	--kb-brass: #bc8427;
	--kb-gold: #e3ad45;
	--kb-parchment: #e8ddc8;
	--kb-midnight: #061722;
	--kb-magic-x: 52vw;
	--kb-magic-y: 32vh;
	--kb-fantasy-line: color-mix(in srgb, var(--kb-brass) 38%, var(--line));
	--kb-fantasy-glow: 0 18px 55px rgba(38, 26, 5, .13), 0 1px 0 rgba(255, 255, 255, .5) inset;
	--paper: #e5e6e2;
	--surface: #f5f3ec;
	--surface-2: #dfe3df;
	--text: #10271f;
	--muted: #65736c;
	--line: rgba(18, 57, 45, .16);
	--line-strong: rgba(121, 83, 22, .42);
	--commerce-card: #f9f7f0;
	--commerce-warm: #eee7d8;
	--commerce-green: var(--kb-emerald);
	--radius: 9px;
}

html[data-theme="dark"] {
	--kb-emerald: #1a725d;
	--kb-emerald-bright: #42a68b;
	--kb-brass: #d19a3b;
	--kb-gold: #f0bd5d;
	--kb-parchment: #e4d5b9;
	--paper: #06151c;
	--surface: #0a2024;
	--surface-2: #102c2b;
	--text: #eee4d0;
	--muted: #a2b3aa;
	--line: rgba(222, 172, 73, .18);
	--line-strong: rgba(222, 172, 73, .45);
	--commerce-card: #0c2426;
	--commerce-warm: #172d28;
	--commerce-green: #60c3a5;
	--kb-fantasy-line: rgba(224, 170, 65, .26);
	--kb-fantasy-glow: 0 20px 65px rgba(0, 0, 0, .3), 0 1px 0 rgba(237, 194, 109, .06) inset;
}

html { background: var(--paper); }

body {
	background:
		radial-gradient(circle at 12% 10%, color-mix(in srgb, var(--kb-emerald) 9%, transparent), transparent 27rem),
		radial-gradient(circle at 88% 44%, color-mix(in srgb, var(--kb-brass) 7%, transparent), transparent 31rem),
		var(--paper);
	background-attachment: fixed;
}

body::before {
	content: "";
	position: fixed;
	z-index: -1;
	inset: 0;
	pointer-events: none;
	background-image:
		radial-gradient(circle, color-mix(in srgb, var(--kb-brass) 42%, transparent) 0 1px, transparent 1.5px),
		linear-gradient(115deg, transparent 0 47%, color-mix(in srgb, var(--kb-brass) 10%, transparent) 49%, transparent 51%);
	background-position: 0 0, center;
	background-size: 72px 72px, 100% 100%;
	opacity: .16;
}

body::after {
	content: "";
	position: fixed;
	z-index: 9998;
	inset: 0;
	pointer-events: none;
	background: radial-gradient(190px circle at var(--kb-magic-x) var(--kb-magic-y), rgba(235, 187, 90, .1), transparent 72%);
	mix-blend-mode: screen;
	opacity: .68;
}

::selection { background: var(--kb-emerald); color: #fff8e8; }

.kb-main { position: relative; isolation: isolate; }

.kb-main::before,
.kb-main::after {
	content: "";
	position: fixed;
	z-index: -1;
	width: 27rem;
	height: 27rem;
	border: 1px solid color-mix(in srgb, var(--kb-brass) 13%, transparent);
	border-radius: 50%;
	pointer-events: none;
	opacity: .34;
	filter: blur(.1px);
}

.kb-main::before { top: 19rem; right: -21rem; box-shadow: 0 0 0 42px color-mix(in srgb, var(--kb-emerald) 3%, transparent), 0 0 0 83px color-mix(in srgb, var(--kb-brass) 2%, transparent); }
.kb-main::after { bottom: 5rem; left: -22rem; box-shadow: 0 0 0 54px color-mix(in srgb, var(--kb-brass) 3%, transparent); }

/* Header: the same fixed RTL commerce layout, dressed as a refined reading hall. */
.kb-commerce-header.kb-header {
	border-bottom: 1px solid var(--kb-fantasy-line);
	background: color-mix(in srgb, var(--surface) 90%, transparent);
	box-shadow: 0 8px 30px rgba(5, 24, 22, .1);
	backdrop-filter: blur(20px) saturate(1.18);
}

.kb-commerce-header.kb-header::after {
	content: "";
	position: absolute;
	right: 0;
	bottom: -1px;
	left: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent 4%, var(--kb-brass) 21%, transparent 42% 58%, var(--kb-brass) 79%, transparent 96%);
	opacity: .6;
}

.kb-commerce-notice {
	position: relative;
	background:
		radial-gradient(circle at 77% 50%, rgba(43, 127, 100, .22), transparent 24%),
		linear-gradient(100deg, #061722, #0a2a2a 56%, #061722);
	color: #f3ead8;
}

.kb-commerce-notice::after {
	content: "✦";
	position: absolute;
	top: 50%;
	right: 50%;
	color: var(--kb-gold);
	font-size: 8px;
	transform: translate(50%, -50%);
	opacity: .7;
}

.kb-commerce-head .kb-default-logo,
.kb-commerce-head .custom-logo-link {
	position: relative;
	filter: drop-shadow(0 4px 9px color-mix(in srgb, var(--kb-brass) 16%, transparent));
}

.kb-commerce-head .kb-default-logo::after,
.kb-commerce-head .custom-logo-link::after {
	content: "";
	position: absolute;
	right: 16%;
	bottom: 3px;
	left: 16%;
	height: 1px;
	background: linear-gradient(90deg, transparent, var(--kb-gold), transparent);
	box-shadow: 0 0 9px var(--kb-gold);
	opacity: .68;
}

.kb-commerce-search {
	border-color: var(--kb-fantasy-line);
	background:
		linear-gradient(var(--surface-2), var(--surface-2)) padding-box,
		linear-gradient(120deg, transparent, color-mix(in srgb, var(--kb-brass) 55%, transparent), transparent) border-box;
	box-shadow: 0 9px 28px rgba(7, 35, 29, .06) inset;
}

.kb-commerce-search::after {
	content: "";
	position: absolute;
	top: 10px;
	right: 9px;
	bottom: 10px;
	width: 1px;
	background: linear-gradient(transparent, var(--kb-brass), transparent);
	opacity: .5;
}

.kb-commerce-search:focus-within {
	border-color: var(--kb-fantasy-line);
	background: var(--surface-2);
	box-shadow: 0 9px 28px rgba(7, 35, 29, .06) inset;
}

.kb-commerce-search > button,
.kb-newsletter button {
	background: linear-gradient(135deg, var(--kb-gold), var(--kb-brass));
	box-shadow: 0 7px 18px rgba(113, 73, 13, .17), 0 1px 0 rgba(255, 247, 217, .55) inset;
}

.kb-commerce-action,
.kb-commerce-actions .kb-theme-switch {
	border-color: var(--kb-fantasy-line);
	background: color-mix(in srgb, var(--surface) 93%, var(--kb-emerald) 7%);
	box-shadow: 0 5px 17px rgba(6, 31, 26, .06), 0 1px 0 rgba(255, 255, 255, .34) inset;
}

.kb-commerce-action:hover {
	border-color: var(--kb-brass);
	background: color-mix(in srgb, var(--kb-emerald) 13%, var(--surface));
	color: var(--kb-brass);
}

.kb-commerce-actions .kb-theme-switch button[aria-pressed="true"],
.kb-commerce-actions .kb-theme-switch button.is-active {
	background: linear-gradient(135deg, var(--kb-gold), var(--kb-brass));
	color: var(--kb-midnight);
}

.kb-commerce-nav-wrap { border-color: var(--kb-fantasy-line); }
.kb-commerce-nav .kb-nav a { position: relative; }
.kb-commerce-nav .kb-nav a::after {
	content: "";
	position: absolute;
	right: 50%;
	bottom: 2px;
	left: 50%;
	height: 1px;
	background: var(--kb-gold);
	box-shadow: 0 0 7px var(--kb-gold);
	transition: right .22s ease, left .22s ease;
}
.kb-commerce-nav .kb-nav a:hover::after { right: 15%; left: 15%; }
.kb-category-toggle { border-color: var(--kb-fantasy-line); }
.kb-category-toggle:hover,
.kb-category-toggle[aria-expanded="true"] { color: var(--kb-brass); }

.kb-category-mega,
.kb-search-results {
	border-color: var(--kb-fantasy-line);
	background:
		linear-gradient(135deg, color-mix(in srgb, var(--kb-emerald) 5%, transparent), transparent 42%),
		var(--surface);
	box-shadow: var(--kb-fantasy-glow);
}

/* Shared enchanted frames. */
.kb-story-rail,
.kb-hero-slider,
.kb-daily-pick,
.kb-quick-links,
.kb-offer-section,
.kb-category-showcase,
.kb-product-section,
.kb-service-strip,
.kb-epub-commerce,
.kb-community-commerce,
.kb-magazine-preview,
.kb-page-heading,
.kb-account,
.kb-member-dashboard,
.kb-auth-shell,
.woocommerce .site-main,
.woocommerce-page .site-main {
	position: relative;
}

.kb-store-section-head {
	position: relative;
	border-color: var(--kb-fantasy-line);
}

.kb-store-section-head::after,
.kb-section-head::after {
	content: "✦";
	position: absolute;
	right: 50%;
	bottom: -8px;
	display: grid;
	width: 16px;
	height: 16px;
	border: 1px solid var(--kb-fantasy-line);
	border-radius: 50%;
	background: var(--paper);
	color: var(--kb-brass);
	font: 8px/1 serif;
	transform: translateX(50%);
	place-items: center;
}

.kb-store-section-head span,
.kb-kicker,
.kb-page-heading > span { color: var(--kb-brass); }

.kb-store-section-head h2,
.kb-page-heading h1,
.kb-hero-slide__copy h1,
.kb-hero-slide__copy h2,
.kb-member-hero h1,
.kb-auth-panel h1 {
	text-wrap: balance;
	text-shadow: 0 1px 0 color-mix(in srgb, var(--surface) 55%, transparent);
}

/* Story portals. */
.kb-story-rail {
	margin-top: 20px;
	padding: 16px 20px;
	border: 1px solid var(--kb-fantasy-line);
	border-radius: 15px;
	background:
		linear-gradient(110deg, color-mix(in srgb, var(--kb-emerald) 8%, transparent), transparent 34%),
		var(--surface);
	box-shadow: var(--kb-fantasy-glow);
}

.kb-story-rail > strong::before { content: "✦"; margin-left: 8px; color: var(--kb-brass); }

.kb-story > span {
	position: relative;
	border-color: var(--kb-brass);
	background: conic-gradient(from 30deg, var(--kb-gold), var(--kb-emerald), var(--kb-gold));
	box-shadow: 0 0 0 3px var(--surface), 0 0 0 4px var(--kb-fantasy-line), 0 8px 22px rgba(8, 39, 31, .13);
}

.kb-story > span::after {
	content: "";
	position: absolute;
	inset: -5px;
	border: 1px solid color-mix(in srgb, var(--kb-gold) 52%, transparent);
	border-radius: 50%;
	animation: kb-orbit 8s linear infinite;
}

.kb-story:hover > span { transform: translateY(-3px) scale(1.03); }

/* Cinematic hero: old-library depth with restrained moving mist. */
.kb-commerce-hero-grid { margin-top: 20px; }

.kb-hero-slider {
	border: 1px solid var(--kb-fantasy-line);
	border-radius: 18px;
	box-shadow: 0 28px 75px rgba(4, 19, 18, .26), 0 0 0 5px color-mix(in srgb, var(--kb-brass) 5%, transparent) inset;
}

.kb-hero-slider::before,
.kb-hero-slider::after {
	content: "";
	position: absolute;
	z-index: 8;
	pointer-events: none;
}

.kb-hero-slider::before {
	inset: 11px;
	border: 1px solid rgba(235, 186, 89, .28);
	border-radius: 11px;
	clip-path: polygon(0 0, 20% 0, 20% 1px, 80% 1px, 80% 0, 100% 0, 100% 100%, 80% 100%, 80% calc(100% - 1px), 20% calc(100% - 1px), 20% 100%, 0 100%);
}

.kb-hero-slider::after {
	top: -35%;
	right: -10%;
	width: 58%;
	height: 170%;
	background: linear-gradient(104deg, transparent 25%, rgba(239, 202, 129, .05) 49%, transparent 72%);
	filter: blur(5px);
	animation: kb-wandering-light 10s ease-in-out infinite alternate;
}

.kb-hero-slide__shade {
	background:
		linear-gradient(90deg, rgba(4, 17, 21, .12), rgba(3, 18, 24, .48) 48%, rgba(3, 20, 21, .93)),
		radial-gradient(circle at 36% 55%, rgba(23, 102, 78, .17), transparent 43%);
}

.kb-hero-slide__copy { z-index: 9; }
.kb-hero-slide__copy h1,
.kb-hero-slide__copy h2 { color: #f4ead6; }
.kb-hero-slide__copy p { color: rgba(244, 234, 214, .78); }

.kb-hero-slide__copy .kb-kicker::after {
	content: "✦";
	margin-right: 7px;
	font-size: 8px;
	animation: kb-twinkle 2.4s ease-in-out infinite;
}

.kb-hero-slider__controls button,
.kb-rail-control {
	border-color: var(--kb-fantasy-line);
	background: color-mix(in srgb, var(--surface) 90%, transparent);
	box-shadow: 0 8px 24px rgba(3, 24, 20, .12);
}

.kb-hero-slider__controls button:hover,
.kb-rail-control:hover {
	border-color: var(--kb-brass);
	background: var(--kb-emerald);
	color: #fff8e9;
}

.kb-hero-slider__dots button { background: rgba(241, 226, 197, .35); }
.kb-hero-slider__dots button.is-active { background: var(--kb-gold); box-shadow: 0 0 10px var(--kb-gold); }

.kb-daily-pick {
	border-color: var(--kb-fantasy-line);
	background:
		linear-gradient(145deg, color-mix(in srgb, var(--kb-emerald) 8%, transparent), transparent 46%),
		var(--surface);
	box-shadow: var(--kb-fantasy-glow);
}

.kb-daily-pick::before {
	content: "✦";
	position: absolute;
	top: 12px;
	left: 13px;
	color: var(--kb-brass);
	font-size: 10px;
}

.kb-daily-pick__image img {
	filter: sepia(.07) saturate(.9);
	box-shadow: -9px 12px 27px rgba(5, 28, 23, .2), -3px 0 0 color-mix(in srgb, var(--kb-brass) 62%, transparent);
}

/* Buttons get a crafted brass surface and a quick magical glint. */
.kb-button,
.kb-card-action,
.kb-store-card__buy,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	border-color: var(--kb-brass);
	background: linear-gradient(135deg, var(--kb-gold), var(--kb-brass));
	box-shadow: 0 8px 20px rgba(91, 60, 13, .15), 0 1px 0 rgba(255, 249, 226, .52) inset;
	color: var(--kb-midnight);
}

.kb-button::after,
.kb-card-action::after,
.kb-store-card__buy::after,
.woocommerce a.button::after,
.woocommerce button.button::after {
	content: "";
	position: absolute;
	z-index: -1;
	top: -70%;
	left: -35%;
	width: 18%;
	height: 240%;
	background: rgba(255, 255, 255, .38);
	transform: rotate(21deg) translateX(0);
	transition: transform .55s ease;
}

.kb-button:hover::after,
.kb-card-action:hover::after,
.kb-store-card__buy:hover::after,
.woocommerce a.button:hover::after,
.woocommerce button.button:hover::after { transform: rotate(21deg) translateX(650%); }

.kb-button:hover,
.kb-card-action:hover,
.kb-store-card__buy:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover {
	border-color: var(--kb-gold);
	background: linear-gradient(135deg, #efc66f, var(--kb-gold));
	color: var(--kb-midnight);
	transform: translateY(-2px);
}

.kb-button--outline {
	border-color: var(--kb-fantasy-line);
	background: color-mix(in srgb, var(--surface) 82%, transparent);
	box-shadow: none;
	color: var(--text);
}

.kb-button--outline:hover { border-color: var(--kb-brass); background: var(--kb-emerald); color: #fff8e9; }

/* Quick access resembles a row of elegant magical seals. */
.kb-quick-links {
	border-color: var(--kb-fantasy-line);
	border-radius: 15px;
	background: var(--surface);
	box-shadow: var(--kb-fantasy-glow);
}

.kb-quick-links > a { position: relative; border-color: var(--kb-fantasy-line); }
.kb-quick-links > a::before {
	content: "";
	position: absolute;
	right: 0;
	top: 22%;
	bottom: 22%;
	width: 1px;
	background: linear-gradient(transparent, var(--kb-brass), transparent);
	opacity: 0;
	transition: opacity .22s;
}
.kb-quick-links > a:hover::before { opacity: .75; }
.kb-quick-links > a > span {
	border: 1px solid var(--kb-fantasy-line);
	background: color-mix(in srgb, var(--kb-emerald) 9%, var(--surface));
	color: var(--kb-brass);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--kb-brass) 4%, transparent);
}
.kb-quick-links > a:hover > span { background: var(--kb-emerald); color: #fff8e9; transform: rotate(-5deg) scale(1.04); }

/* Product cards: bookplate borders, spine shadow and subtle 3D lift. */
.kb-store-card {
	border-color: var(--kb-fantasy-line);
	border-radius: 13px;
	background:
		linear-gradient(145deg, color-mix(in srgb, var(--kb-emerald) 4%, transparent), transparent 42%),
		var(--commerce-card);
	box-shadow: 0 8px 25px rgba(6, 35, 29, .055), 0 1px 0 rgba(255, 255, 255, .38) inset;
	transform-style: preserve-3d;
}

.kb-store-card::before,
.kb-store-card::after {
	content: "";
	position: absolute;
	z-index: 1;
	pointer-events: none;
}

.kb-store-card::before {
	inset: 5px;
	border: 1px solid color-mix(in srgb, var(--kb-brass) 16%, transparent);
	border-radius: 9px;
}

.kb-store-card::after {
	top: 14px;
	right: 14px;
	width: 11px;
	height: 11px;
	border-top: 1px solid var(--kb-brass);
	border-right: 1px solid var(--kb-brass);
	opacity: .58;
}

.kb-store-card:hover {
	border-color: color-mix(in srgb, var(--kb-brass) 70%, var(--line));
	box-shadow: 0 19px 42px rgba(4, 28, 24, .13), 0 0 25px color-mix(in srgb, var(--kb-brass) 7%, transparent);
	transform: translateY(-5px) perspective(900px) rotateX(1.2deg);
}

.kb-store-card__image img {
	border-radius: 5px 8px 8px 5px;
	box-shadow: -9px 12px 22px rgba(4, 25, 22, .18), -3px 0 0 color-mix(in srgb, var(--kb-brass) 48%, transparent);
	filter: saturate(.88) contrast(1.02);
}

.kb-store-card:hover .kb-store-card__image img { transform: translateY(-5px) rotate(-.45deg) scale(1.015); filter: saturate(1); }
.kb-rating { color: var(--kb-brass) !important; }
.kb-discount-badge { background: var(--kb-emerald); color: #fff8e9; box-shadow: 0 4px 12px rgba(5, 54, 43, .22); }

.kb-product-rail {
	scrollbar-color: var(--kb-brass) color-mix(in srgb, var(--kb-emerald) 8%, var(--surface));
}

.kb-offer-section {
	border-color: var(--kb-fantasy-line);
	background:
		radial-gradient(circle at 8% 20%, rgba(231, 176, 72, .14), transparent 17rem),
		linear-gradient(115deg, color-mix(in srgb, var(--kb-emerald) 16%, var(--surface)), var(--surface) 42%);
	box-shadow: var(--kb-fantasy-glow);
}
.kb-offer-spark { background: var(--kb-emerald); color: #fff8e9; box-shadow: 0 0 0 5px color-mix(in srgb, var(--kb-brass) 9%, transparent); }
.kb-countdown span { border-color: var(--kb-fantasy-line); background: color-mix(in srgb, var(--kb-emerald) 7%, var(--surface)); }

/* Categories and feature mosaics. */
.kb-category-grid > a {
	border-color: var(--kb-fantasy-line);
	background: color-mix(in srgb, var(--surface) 96%, var(--kb-emerald) 4%);
}
.kb-category-grid > a > span {
	border: 1px solid var(--kb-fantasy-line);
	box-shadow: 0 9px 23px rgba(5, 38, 31, .12);
}
.kb-category-grid > a:hover { border-color: var(--kb-brass); background: color-mix(in srgb, var(--kb-emerald) 8%, var(--surface)); transform: translateY(-4px); }
.kb-category-grid > a:hover > span { box-shadow: 0 0 0 4px color-mix(in srgb, var(--kb-brass) 10%, transparent), 0 13px 26px rgba(5, 38, 31, .16); }

.kb-promo-card {
	border: 1px solid var(--kb-fantasy-line);
	border-radius: 15px;
	box-shadow: 0 20px 50px rgba(3, 21, 20, .18);
}
.kb-promo-card::after {
	content: "";
	position: absolute;
	inset: 10px;
	border: 1px solid rgba(239, 190, 93, .3);
	border-radius: 9px;
	pointer-events: none;
}
.kb-promo-card img { filter: saturate(.75) contrast(1.05); transition: transform .7s ease, filter .4s; }
.kb-promo-card:hover img { filter: saturate(.96) contrast(1.03); transform: scale(1.035); }
.kb-promo-card span { z-index: 2; }

.kb-service-strip {
	border-color: var(--kb-fantasy-line);
	background: var(--surface);
	box-shadow: var(--kb-fantasy-glow);
}
.kb-service-strip > div { border-color: var(--kb-fantasy-line); }
.kb-service-strip svg { color: var(--kb-brass); filter: drop-shadow(0 0 6px color-mix(in srgb, var(--kb-brass) 16%, transparent)); }

/* EPUB and community become rooms inside the same enchanted world. */
.kb-epub-commerce,
.kb-community-commerce {
	border-color: var(--kb-fantasy-line);
	border-radius: 16px;
	box-shadow: var(--kb-fantasy-glow);
}

.kb-epub-commerce {
	background:
		radial-gradient(circle at 78% 30%, rgba(50, 138, 110, .19), transparent 18rem),
		linear-gradient(125deg, #071d23, #0d3931 62%, #071b25);
	color: #f1e7d4;
}

.kb-epub-commerce::after {
	content: "✦  ·  ✧  ·  ✦";
	position: absolute;
	top: 18px;
	left: 24px;
	color: var(--kb-gold);
	font: 10px serif;
	letter-spacing: 5px;
	opacity: .65;
}

.kb-epub-commerce__books a { transform-origin: bottom center; }
.kb-epub-commerce__books a:hover { transform: translateY(-10px) rotate(-2deg); }
.kb-epub-commerce__books img { box-shadow: -10px 16px 34px rgba(0, 0, 0, .36), -3px 0 0 var(--kb-brass); }
.kb-epub-commerce__books > span { border-color: var(--kb-gold); color: var(--kb-gold); box-shadow: 0 0 18px rgba(230, 174, 69, .14); }

.kb-community-commerce {
	background:
		linear-gradient(145deg, color-mix(in srgb, var(--kb-emerald) 10%, transparent), transparent 46%),
		var(--surface);
}
.kb-community-commerce__events article { border-color: var(--kb-fantasy-line); background: color-mix(in srgb, var(--surface-2) 65%, transparent); }
.kb-community-commerce__events article:hover { border-color: var(--kb-brass); background: color-mix(in srgb, var(--kb-emerald) 8%, var(--surface)); }

/* Editorial cards and inner pages. */
.kb-article-card,
.kb-magazine-card,
.kb-dashboard-card,
.kb-member-card,
.kb-member-profile-card,
.kb-empty-panel {
	border-color: var(--kb-fantasy-line);
	background:
		linear-gradient(150deg, color-mix(in srgb, var(--kb-emerald) 4%, transparent), transparent 45%),
		var(--surface);
	box-shadow: 0 10px 30px rgba(5, 35, 29, .07);
}

.kb-article-card { border-radius: 12px; overflow: hidden; }
.kb-article-card img { filter: sepia(.08) saturate(.75); }
.kb-article-card:hover { box-shadow: 0 17px 40px rgba(5, 35, 29, .13); transform: translateY(-3px); }
.kb-article-card:hover img { filter: sepia(0) saturate(.95); }

.kb-page-heading {
	border-color: var(--kb-fantasy-line);
	background:
		radial-gradient(circle at 78% 16%, color-mix(in srgb, var(--kb-brass) 10%, transparent), transparent 16rem),
		linear-gradient(120deg, color-mix(in srgb, var(--kb-emerald) 8%, transparent), transparent 48%);
}

.kb-page-heading::before {
	content: "✦";
	position: absolute;
	top: 48%;
	left: 3%;
	color: var(--kb-brass);
	font-size: 16px;
	opacity: .64;
}

.kb-account,
.kb-member-dashboard,
.kb-auth-shell,
.kb-chat,
.kb-wishlist-page,
.kb-magazine,
.kb-cafe-hero {
	border-color: var(--kb-fantasy-line);
	box-shadow: var(--kb-fantasy-glow);
}

.kb-account-nav,
.kb-chat__rooms,
.kb-chat__side {
	background:
		linear-gradient(160deg, color-mix(in srgb, var(--kb-emerald) 11%, transparent), transparent 48%),
		var(--surface-2);
}

.kb-account-nav nav a.is-active,
.kb-chat__rooms > button.is-active {
	border-color: var(--kb-brass);
	background: color-mix(in srgb, var(--kb-emerald) 11%, transparent);
	color: var(--text);
}

.kb-member-hero,
.kb-auth-visual {
	background:
		radial-gradient(circle at 28% 19%, rgba(231, 182, 84, .16), transparent 19rem),
		linear-gradient(135deg, #071b25, #0b382f 64%, #061722);
}

.kb-member-hero__avatar img,
.kb-member-profile-card__ring img,
.kb-account-nav__profile img {
	border-color: var(--kb-brass);
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--kb-brass) 9%, transparent), 0 13px 30px rgba(4, 28, 23, .18);
}

.kb-progress i,
.kb-order-track i.is-done { background: linear-gradient(90deg, var(--kb-emerald), var(--kb-gold)); }

.kb-chat__composer textarea,
.kb-field input,
.kb-field select,
.kb-field textarea,
.kb-form-grid input,
.kb-form-grid select,
.kb-form-grid textarea,
.woocommerce input.input-text,
.woocommerce textarea,
.woocommerce select {
	border-color: var(--kb-fantasy-line);
	background: color-mix(in srgb, var(--surface-2) 72%, var(--surface));
}

.kb-chat__composer textarea:focus,
.kb-field input:focus,
.kb-field select:focus,
.kb-field textarea:focus,
.kb-form-grid input:focus,
.woocommerce input.input-text:focus,
.woocommerce textarea:focus,
.woocommerce select:focus {
	border-color: var(--kb-brass);
	outline: 0;
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--kb-brass) 8%, transparent);
}

/* WooCommerce inherits the fantasy material without changing flows. */
.woocommerce ul.products li.product,
.woocommerce div.product,
.woocommerce-cart-form,
.cart_totals,
.woocommerce-checkout-review-order,
.woocommerce form.checkout,
.woocommerce form.login,
.woocommerce form.register,
.woocommerce-MyAccount-navigation,
.woocommerce-MyAccount-content {
	border-color: var(--kb-fantasy-line) !important;
	background: var(--surface);
	box-shadow: var(--kb-fantasy-glow);
}

.woocommerce span.onsale { background: var(--kb-emerald); color: #fff8e9; }
.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce ul.products li.product .price { color: var(--kb-brass); }

/* Footer: a midnight reading hall. */
.kb-commerce-footer,
.kb-footer {
	position: relative;
	border-color: rgba(224, 168, 58, .3);
	background:
		radial-gradient(circle at 19% 13%, rgba(27, 112, 88, .18), transparent 25rem),
		linear-gradient(135deg, #05151e, #092c2b 58%, #05141d);
	box-shadow: 0 -16px 50px rgba(5, 22, 21, .12);
}

.kb-commerce-footer::before,
.kb-footer::before {
	content: "✦  ·  ✦";
	position: absolute;
	top: 15px;
	right: 50%;
	color: var(--kb-gold);
	font: 9px serif;
	letter-spacing: 6px;
	transform: translateX(50%);
	opacity: .65;
}

/* Reveal animation only activates when JavaScript is available. */
.kb-fantasy-ready .kb-fantasy-reveal {
	opacity: 0;
	transform: translateY(13px);
	transition: opacity .62s ease var(--kb-reveal-delay, 0ms), transform .62s cubic-bezier(.2, .75, .25, 1) var(--kb-reveal-delay, 0ms);
}

.kb-fantasy-ready .kb-fantasy-reveal.is-kb-revealed { opacity: 1; transform: translateY(0); }

@keyframes kb-wandering-light {
	0% { transform: translateX(-11%) rotate(2deg); opacity: .55; }
	100% { transform: translateX(33%) rotate(-2deg); opacity: 1; }
}

@keyframes kb-twinkle {
	0%, 100% { opacity: .35; transform: scale(.72) rotate(0); }
	50% { opacity: 1; transform: scale(1.15) rotate(45deg); }
}

@keyframes kb-orbit {
	0% { transform: rotate(0deg) scale(1); opacity: .34; }
	50% { transform: rotate(180deg) scale(1.035); opacity: .75; }
	100% { transform: rotate(360deg) scale(1); opacity: .34; }
}

@media (max-width: 1024px) {
	body::after { display: none; }
	.kb-commerce-notice::after { display: none; }
	.kb-store-card:hover { transform: translateY(-3px); }
	.kb-hero-slider::after { opacity: .45; }
}

@media (max-width: 767px) {
	body { background-attachment: scroll; }
	.kb-story-rail { margin-top: 10px; padding: 13px 12px; border-radius: 12px; }
	.kb-commerce-hero-grid { margin-top: 12px; }
	.kb-hero-slider { border-radius: 13px; }
	.kb-hero-slider::before { inset: 6px; border-radius: 8px; }
	.kb-quick-links { border-radius: 12px; }
	.kb-quick-links > a::before,
	.kb-main::before,
	.kb-main::after { display: none; }
	.kb-promo-card::after { inset: 6px; }
	.kb-epub-commerce::after { display: none; }
	.kb-store-section-head::after,
	.kb-section-head::after { display: none; }
	.kb-fantasy-ready .kb-fantasy-reveal { transform: translateY(7px); }
}

@media (prefers-reduced-motion: reduce) {
	body::after,
	.kb-hero-slider::after,
	.kb-story > span::after,
	.kb-hero-slide__copy .kb-kicker::after { animation: none !important; }
	.kb-fantasy-ready .kb-fantasy-reveal { opacity: 1; transform: none; transition: none; }
	.kb-button::after,
	.kb-card-action::after,
	.kb-store-card__buy::after { display: none; }
}