/*
Theme Name: Adilmark Books
Theme URI: https://adilmark.local
Author: Adilmark
Author URI: https://adilmark.local
Description: A dark mobile-first WooCommerce theme for selling English PDF e-books with in-site reading, personal libraries, friend invites, shared libraries, 3D effects, and step checkout.
Version: 1.0.4
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
Text Domain: adilmark
Tags: e-commerce, woocommerce, dark, responsive, books
*/

:root {
	--bg: #020807;
	--bg-soft: #06130f;
	--surface: #0b1a14;
	--surface-2: #10281d;
	--text: #f7fff8;
	--muted: #a7b9ad;
	--line: rgba(255,255,255,.11);
	--line-strong: rgba(255,255,255,.2);
	--accent: #36b5f4;
	--accent-2: #78c900;
	--accent-3: #e9fff4;
	--gold: #a3d600;
	--danger: #ff5a5a;
	--shadow: 0 24px 70px rgba(0,0,0,.38);
	--radius: 8px;
	--header-height: 76px;
	color-scheme: dark;
	font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	letter-spacing: 0;
}

:root[data-theme="light"] {
	--bg: #f8fcff;
	--bg-soft: #eef9ff;
	--surface: #ffffff;
	--surface-2: #e8f7ff;
	--text: #00351e;
	--muted: #4c6658;
	--line: rgba(0,53,30,.12);
	--line-strong: rgba(0,53,30,.22);
	--accent: #32aef2;
	--accent-2: #78c900;
	--accent-3: #00351e;
	--gold: #8fc900;
	--shadow: 0 22px 60px rgba(50,174,242,.16);
	color-scheme: light;
}

* {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

body {
	margin: 0;
	background:
		radial-gradient(circle at 18% 12%, rgba(54,181,244,.18), transparent 28rem),
		radial-gradient(circle at 88% 4%, rgba(120,201,0,.16), transparent 26rem),
		linear-gradient(180deg, var(--bg), var(--bg-soft));
	color: var(--text);
	min-height: 100vh;
	overflow-x: hidden;
}

body.menu-open,
body.cart-open {
	overflow: hidden;
}

img {
	max-width: 100%;
	height: auto;
	display: block;
}

a {
	color: inherit;
	text-decoration: none;
}

button,
input,
textarea,
select {
	font: inherit;
}

button {
	color: inherit;
}

[hidden] {
	display: none !important;
}

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.skip-link:focus {
	z-index: 9999;
	top: 1rem;
	left: 1rem;
	width: auto;
	height: auto;
	padding: .7rem 1rem;
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	clip: auto;
}

.shell {
	width: min(1160px, calc(100% - 32px));
	margin: 0 auto;
}

.site-header {
	position: sticky;
	top: 0;
	z-index: 80;
	height: var(--header-height);
	background: color-mix(in srgb, var(--bg) 82%, transparent);
	backdrop-filter: blur(22px);
	border-bottom: 1px solid var(--line);
}

.site-header.is-scrolled {
	box-shadow: 0 16px 40px rgba(0,0,0,.18);
}

.admin-bar .site-header {
	top: 32px;
}

.header-shell {
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}

.brand {
	display: inline-flex;
	align-items: center;
	gap: .7rem;
	min-width: 0;
}

.brand-mark {
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: conic-gradient(from 140deg, var(--accent), #ffffff, var(--accent-2), var(--accent));
	color: #00351e;
	font-weight: 900;
	box-shadow: 0 14px 36px rgba(54,181,244,.28);
}

.brand-text {
	display: grid;
	gap: .1rem;
}

.brand-text strong {
	font-size: 1rem;
	line-height: 1.1;
}

.brand-text small,
.muted-small {
	color: var(--muted);
	font-size: .77rem;
}

.desktop-nav {
	display: flex;
	align-items: center;
	gap: .35rem;
	padding: .35rem;
	background: color-mix(in srgb, var(--surface) 72%, transparent);
	border: 1px solid var(--line);
	border-radius: var(--radius);
}

.desktop-nav a {
	padding: .68rem .9rem;
	border-radius: 6px;
	color: var(--muted);
	font-size: .94rem;
}

.desktop-nav a:hover,
.desktop-nav a:focus-visible {
	color: var(--text);
	background: var(--surface-2);
	outline: none;
}

.header-actions {
	display: inline-flex;
	align-items: center;
	gap: .55rem;
}

.icon-button {
	position: relative;
	display: inline-grid;
	place-items: center;
	width: 42px;
	height: 42px;
	padding: 0;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--surface);
	color: var(--text);
	cursor: pointer;
	transition: transform .2s ease, border-color .2s ease, background .2s ease;
}

.icon-button:hover,
.icon-button:focus-visible {
	transform: translateY(-1px);
	border-color: var(--line-strong);
	outline: none;
}

.theme-toggle {
	display: inline-flex;
	align-items: center;
	gap: .55rem;
	min-height: 42px;
	padding: 0 .82rem;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--surface);
	color: var(--text);
	font-weight: 900;
	cursor: pointer;
	transition: transform .2s ease, border-color .2s ease, background .2s ease;
}

.theme-toggle:hover,
.theme-toggle:focus-visible {
	transform: translateY(-1px);
	border-color: var(--line-strong);
	background: var(--surface-2);
	outline: none;
}

.theme-toggle-dot {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--accent), var(--accent-2));
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 18%, transparent);
	flex: 0 0 auto;
}

.theme-toggle-label {
	font-size: .88rem;
	line-height: 1;
}

.icon-bag {
	width: 16px;
	height: 18px;
	border: 2px solid currentColor;
	border-radius: 4px;
}

.icon-bag::before {
	content: "";
	position: absolute;
	top: 9px;
	left: 50%;
	width: 10px;
	height: 7px;
	border: 2px solid currentColor;
	border-bottom: 0;
	border-radius: 9px 9px 0 0;
	transform: translateX(-50%);
}

.cart-count {
	position: absolute;
	top: -6px;
	right: -6px;
	display: grid;
	place-items: center;
	min-width: 20px;
	height: 20px;
	padding: 0 5px;
	border-radius: 10px;
	background: var(--accent);
	color: white;
	font-size: .72rem;
	font-weight: 800;
	border: 2px solid var(--bg);
}

.menu-toggle {
	display: none;
	gap: 5px;
}

.menu-toggle span {
	display: block;
	width: 17px;
	height: 2px;
	background: currentColor;
	border-radius: 2px;
}

.mobile-panel,
.cart-drawer {
	position: fixed;
	inset: 0;
	z-index: 120;
	pointer-events: none;
	opacity: 0;
	background: rgba(0,0,0,.46);
	transition: opacity .22s ease;
}

.mobile-panel.is-open,
.cart-drawer.is-open {
	pointer-events: auto;
	opacity: 1;
}

.mobile-panel {
	display: none;
	padding: 1rem;
}

.mobile-panel-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: .8rem;
}

.mobile-panel nav {
	display: grid;
	gap: .65rem;
	padding: 1rem;
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	box-shadow: var(--shadow);
}

.mobile-panel nav a {
	padding: 1rem;
	border-radius: 6px;
	background: var(--surface-2);
	color: var(--text);
}

.cart-drawer {
	display: flex;
	justify-content: flex-end;
}

.cart-drawer-panel {
	width: min(420px, 100%);
	height: 100%;
	padding: 1.1rem;
	background: var(--bg);
	border-left: 1px solid var(--line);
	transform: translateX(100%);
	transition: transform .28s ease;
	overflow-y: auto;
}

.cart-drawer.is-open .cart-drawer-panel {
	transform: translateX(0);
}

.cart-drawer-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1.2rem;
}

.cart-drawer-head h2,
.section-head h2,
.feature-panel h2,
.steps-layout h2,
.page-hero h1,
.reader-title h1,
.account-panel h2,
.friend-panel h2,
.library-toolbar h2 {
	margin: .1rem 0 0;
	line-height: 1.02;
	letter-spacing: 0;
}

.woocommerce-mini-cart {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	gap: .8rem;
}

.woocommerce-mini-cart-item {
	padding: .85rem;
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: var(--radius);
}

.woocommerce-mini-cart__buttons {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: .7rem;
}

.woocommerce ul.products {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
	padding: 0;
	margin: 0;
	list-style: none;
}

.woocommerce ul.products li.product {
	width: auto !important;
	margin: 0 !important;
	padding: .9rem;
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	box-shadow: 0 16px 46px rgba(0,0,0,.16);
}

.woocommerce ul.products li.product img {
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	border-radius: 6px;
	margin: 0 0 .9rem;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
	color: var(--text);
	font-size: 1.1rem;
	line-height: 1.2;
}

.woocommerce ul.products li.product .price {
	color: var(--accent-2);
	font-weight: 900;
}

.button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.login-submit .button-primary {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: .78rem 1rem;
	border: 1px solid transparent;
	border-radius: var(--radius);
	cursor: pointer;
	font-weight: 800;
	line-height: 1;
	text-align: center;
	transition: transform .2s ease, border-color .2s ease, background .2s ease, color .2s ease;
}

.button:hover,
.button:focus-visible,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
	transform: translateY(-1px);
	outline: none;
}

.button-primary,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.login-submit .button-primary {
	background: linear-gradient(135deg, var(--accent), var(--accent-2));
	color: #fff;
	box-shadow: 0 16px 32px rgba(54,181,244,.22);
}

.button-ghost {
	border-color: var(--line);
	background: var(--surface);
	color: var(--text);
}

.hero-section {
	min-height: calc(88svh - var(--header-height));
	display: grid;
	align-items: center;
	padding: clamp(2rem, 6vw, 5rem) 0 3rem;
	position: relative;
	overflow: hidden;
}

.hero-grid {
	display: grid;
	grid-template-columns: minmax(0, .95fr) minmax(320px, 1fr);
	align-items: center;
	gap: clamp(2rem, 6vw, 6rem);
}

.hero-copy h1 {
	margin: .25rem 0 1rem;
	font-size: clamp(4rem, 10vw, 9rem);
	line-height: .82;
	letter-spacing: 0;
}

.hero-copy p,
.page-hero p,
.steps-layout p,
.feature-panel p,
.empty-state p,
.site-footer p {
	color: var(--muted);
	line-height: 1.7;
}

.hero-copy p {
	width: min(620px, 100%);
	font-size: clamp(1.05rem, 2vw, 1.28rem);
}

.eyebrow {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	color: var(--accent-2);
	font-size: .76rem;
	font-weight: 900;
	text-transform: uppercase;
}

.hero-actions {
	display: flex;
	flex-wrap: wrap;
	gap: .8rem;
	margin: 1.6rem 0;
}

.hero-metrics {
	display: flex;
	flex-wrap: wrap;
	gap: .8rem;
}

.hero-metrics span {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	padding: .72rem .8rem;
	background: color-mix(in srgb, var(--surface) 76%, transparent);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	color: var(--muted);
}

.hero-metrics strong {
	color: var(--text);
}

.hero-visual {
	min-height: 520px;
	position: relative;
}

.book-scene {
	--plate-one: none;
	--plate-two: none;
	position: absolute;
	inset: -8% -3% -4%;
	display: grid;
	place-items: center;
	perspective: 1100px;
}

.book-scene canvas {
	width: 100% !important;
	height: 100% !important;
	display: block;
}

.css-book-stack {
	position: absolute;
	width: min(360px, 72vw);
	height: min(420px, 78vw);
	transform-style: preserve-3d;
	animation: floatBook 5.6s ease-in-out infinite;
}

.css-book-stack span {
	position: absolute;
	inset: 0;
	border-radius: var(--radius);
	background:
		linear-gradient(90deg, rgba(255,255,255,.12), transparent 18%),
		linear-gradient(135deg, var(--accent), #0d241a 42%, var(--accent-2));
	background-size: cover;
	background-position: center;
	border: 1px solid rgba(255,255,255,.24);
	box-shadow: 0 40px 90px rgba(0,0,0,.35);
	transform: rotateY(-24deg) rotateX(10deg);
}

.css-book-stack span:first-child {
	background-image:
		linear-gradient(90deg, rgba(255,255,255,.14), transparent 18%),
		var(--plate-one);
	border-color: color-mix(in srgb, var(--accent) 52%, rgba(255,255,255,.25));
}

.css-book-stack span:nth-child(2) {
	transform: translate3d(24px, 24px, -56px) rotateY(-24deg) rotateX(10deg);
	background-image:
		linear-gradient(90deg, rgba(255,255,255,.08), transparent 18%),
		var(--plate-two);
	background-size: cover;
	background-position: center;
	border-color: color-mix(in srgb, var(--accent-2) 52%, rgba(255,255,255,.25));
}

.css-book-stack span:nth-child(3) {
	transform: translate3d(48px, 48px, -112px) rotateY(-24deg) rotateX(10deg);
	background: linear-gradient(135deg, var(--gold), #0a2218 50%, var(--accent));
}

@keyframes floatBook {
	0%, 100% { transform: translateY(0) rotateZ(-3deg); }
	50% { transform: translateY(-18px) rotateZ(3deg); }
}

.catalog-band,
.content-band,
.quality-band,
.steps-band {
	padding: clamp(3rem, 7vw, 6rem) 0;
}

.catalog-band {
	background: color-mix(in srgb, var(--bg-soft) 78%, transparent);
	border-top: 1px solid var(--line);
}

.section-head,
.library-toolbar,
.steps-layout {
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 1.4rem;
	margin-bottom: 1.3rem;
}

.section-head h2,
.steps-layout h2 {
	font-size: clamp(2rem, 4vw, 4rem);
}

.catalog-tools {
	display: grid;
	grid-template-columns: minmax(220px, 1fr) auto;
	align-items: center;
	gap: .8rem;
	margin-bottom: 1.25rem;
}

.search-field input,
.account-panel input,
.friend-panel input,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
	width: 100%;
	min-height: 48px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--surface);
	color: var(--text);
	padding: .9rem 1rem;
	outline: none;
}

.search-field input:focus,
.account-panel input:focus,
.friend-panel input:focus,
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
	border-color: var(--accent-2);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-2) 18%, transparent);
}

.segmented {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	padding: .35rem;
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	overflow-x: auto;
	max-width: 100%;
}

.segmented button {
	min-height: 38px;
	padding: .55rem .75rem;
	border: 0;
	border-radius: 6px;
	background: transparent;
	color: var(--muted);
	white-space: nowrap;
	cursor: pointer;
}

.segmented button.active,
.segmented button:hover {
	background: var(--surface-2);
	color: var(--text);
}

.book-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
}

.book-card {
	display: grid;
	grid-template-columns: 136px minmax(0, 1fr);
	gap: 1rem;
	min-height: 246px;
	padding: .8rem;
	background: color-mix(in srgb, var(--surface) 92%, transparent);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	box-shadow: 0 16px 46px rgba(0,0,0,.18);
	transform: translateZ(0);
	transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.book-card:hover {
	transform: translateY(-4px);
	border-color: color-mix(in srgb, var(--accent-2) 45%, var(--line));
	box-shadow: var(--shadow);
}

.book-cover {
	position: relative;
	min-height: 220px;
	overflow: hidden;
	border-radius: 6px;
	background: linear-gradient(135deg, var(--accent), var(--surface-2));
	box-shadow: inset 10px 0 18px rgba(0,0,0,.22), 0 18px 34px rgba(0,0,0,.26);
}

.book-cover::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(110deg, rgba(255,255,255,.22), transparent 28%, rgba(255,255,255,.08) 58%, transparent);
	mix-blend-mode: screen;
}

.book-cover img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.book-cover-ruby,
.book-cover-classical {
	background: linear-gradient(135deg, #32aef2, #00351e 52%, #78c900);
}

.book-cover-aqua,
.book-cover-encyclopedias {
	background: linear-gradient(135deg, #78c900, #0a462b 50%, #32aef2);
}

.book-cover-lime,
.book-cover-manuals {
	background: linear-gradient(135deg, #eafff4, #78c900 42%, #00351e);
}

:root[data-theme="light"] .book-cover {
	background: linear-gradient(135deg, #32aef2, #78c900);
	box-shadow: 0 18px 36px rgba(50,174,242,.18);
	filter: saturate(1.22) brightness(1.06);
}

:root[data-theme="light"] .book-cover::after {
	background: linear-gradient(110deg, rgba(255,255,255,.34), transparent 24%, rgba(255,255,255,.2) 54%, transparent);
	opacity: .75;
	mix-blend-mode: screen;
}

:root[data-theme="light"] .book-cover img {
	filter: none;
}

:root[data-theme="light"] .book-cover-ruby,
:root[data-theme="light"] .book-cover-classical {
	background: linear-gradient(135deg, #32aef2, #78c900 52%, #00351e);
}

:root[data-theme="light"] .book-cover-aqua,
:root[data-theme="light"] .book-cover-encyclopedias {
	background: linear-gradient(135deg, #78c900, #eafff4 44%, #32aef2);
}

:root[data-theme="light"] .book-cover-lime,
:root[data-theme="light"] .book-cover-manuals {
	background: linear-gradient(135deg, #eafff4, #78c900 48%, #00351e);
}

:root[data-theme="light"] .cover-spine {
	background: rgba(255,255,255,.2);
	border-right: 1px solid rgba(255,255,255,.22);
}

:root[data-theme="light"] .cover-copy span,
:root[data-theme="light"] .cover-copy strong {
	text-shadow: 0 2px 12px rgba(40,12,24,.28);
}

.cover-spine {
	position: absolute;
	inset: 0 auto 0 0;
	width: 18px;
	background: rgba(0,0,0,.25);
}

.cover-copy {
	position: absolute;
	inset: auto 14px 14px 26px;
	z-index: 1;
	display: grid;
	gap: .4rem;
}

.cover-copy span {
	font-size: .68rem;
	font-weight: 900;
	text-transform: uppercase;
	color: rgba(255,255,255,.76);
}

.cover-copy strong {
	color: white;
	line-height: 1.05;
	font-size: 1.1rem;
}

.book-card-body {
	display: grid;
	align-content: space-between;
	gap: .7rem;
	min-width: 0;
}

.book-card-top,
.book-card-meta,
.book-card-actions {
	display: flex;
	align-items: center;
	gap: .55rem;
	flex-wrap: wrap;
}

.book-card-top,
.book-card-meta {
	justify-content: space-between;
}

.pill {
	display: inline-flex;
	align-items: center;
	min-height: 27px;
	padding: .34rem .55rem;
	border-radius: 6px;
	background: color-mix(in srgb, var(--accent) 16%, transparent);
	color: color-mix(in srgb, var(--accent) 76%, var(--text));
	border: 1px solid color-mix(in srgb, var(--accent) 24%, transparent);
	font-size: .72rem;
	font-weight: 900;
}

.book-card h3 {
	margin: 0;
	font-size: 1.18rem;
	line-height: 1.15;
}

.book-card p {
	margin: 0;
	color: var(--muted);
	line-height: 1.5;
	font-size: .92rem;
}

.book-card-meta {
	color: var(--muted);
	font-size: .85rem;
}

.book-card-meta span:first-child {
	color: var(--text);
	font-weight: 900;
}

.book-card-actions .button {
	flex: 1 1 90px;
	min-height: 40px;
	padding: .65rem .75rem;
}

.feature-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
}

.feature-panel,
.friend-panel,
.account-panel,
.checkout-shell,
.empty-state,
.status-notice,
.content-entry {
	background: color-mix(in srgb, var(--surface) 92%, transparent);
	border: 1px solid var(--line);
	border-radius: var(--radius);
}

.feature-panel,
.friend-panel,
.account-panel,
.checkout-shell,
.empty-state,
.content-entry {
	padding: clamp(1rem, 3vw, 1.5rem);
}

.feature-index {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: var(--radius);
	background: var(--surface-2);
	color: var(--accent-3);
	font-weight: 900;
	margin-bottom: 1rem;
}

.steps-band {
	border-top: 1px solid var(--line);
}

.steps-layout {
	display: grid;
	grid-template-columns: .85fr 1fr;
	align-items: center;
}

.payment-steps {
	display: grid;
	gap: .75rem;
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: none;
}

.payment-steps li {
	display: flex;
	align-items: center;
	gap: .9rem;
	padding: .9rem;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--surface);
}

.payment-steps span {
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	border-radius: var(--radius);
	background: var(--accent-2);
	color: #06221e;
	font-weight: 900;
	flex: 0 0 auto;
}

.page-hero {
	padding: clamp(2.5rem, 7vw, 6rem) 0 clamp(2rem, 4vw, 3rem);
	border-bottom: 1px solid var(--line);
}

.compact-hero h1,
.library-hero h1 {
	margin: .25rem 0 .65rem;
	font-size: clamp(2.7rem, 7vw, 5.8rem);
}

.page-hero-grid {
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: center;
	gap: 2rem;
}

.library-orbit {
	position: relative;
	width: 220px;
	aspect-ratio: 1;
	border: 1px solid var(--line);
	border-radius: 50%;
}

.library-orbit span {
	position: absolute;
	width: 56px;
	height: 76px;
	border-radius: 5px;
	background: linear-gradient(135deg, var(--accent), var(--accent-2));
	box-shadow: var(--shadow);
}

.library-orbit span:nth-child(1) { top: 18px; left: 82px; }
.library-orbit span:nth-child(2) { right: 24px; bottom: 36px; background: linear-gradient(135deg, var(--gold), var(--accent)); }
.library-orbit span:nth-child(3) { left: 28px; bottom: 46px; background: linear-gradient(135deg, var(--accent-2), var(--accent-3)); }

.library-grid {
	margin-bottom: 2.5rem;
}

.shared-toolbar {
	margin-top: 1.5rem;
}

.empty-state {
	text-align: center;
	padding: clamp(1.4rem, 5vw, 3rem);
}

.empty-state h1,
.empty-state h2 {
	margin: 0 0 .6rem;
}

.empty-state .button {
	margin-top: .8rem;
}

.status-notice {
	padding: .95rem 1rem;
	color: var(--muted);
}

.adilmark-toast {
	position: fixed;
	left: 50%;
	bottom: 1.2rem;
	z-index: 180;
	max-width: min(420px, calc(100% - 24px));
	padding: .8rem 1rem;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--surface);
	color: var(--text);
	box-shadow: var(--shadow);
	transform: translate(-50%, 18px);
	opacity: 0;
	transition: opacity .2s ease, transform .2s ease;
}

.adilmark-toast.show {
	opacity: 1;
	transform: translate(-50%, 0);
}

.status-error {
	border-color: color-mix(in srgb, var(--danger) 44%, var(--line));
	color: var(--danger);
}

.friends-layout,
.account-layout {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
	align-items: start;
}

.friend-panel.wide,
.empty-state.wide {
	grid-column: 1 / -1;
}

.ajax-form,
.register-form,
.account-panel form {
	display: grid;
	gap: .9rem;
}

.ajax-form label,
.register-form label,
.account-panel label {
	display: grid;
	gap: .45rem;
	color: var(--muted);
	font-size: .92rem;
}

.form-message {
	min-height: 1.4em;
	margin: 0;
	color: var(--accent-2);
}

.friend-list,
.order-list {
	display: grid;
	gap: .7rem;
}

.friend-row,
.order-list a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: .9rem;
	background: var(--surface-2);
	border: 1px solid var(--line);
	border-radius: var(--radius);
}

.friend-row div,
.order-list a {
	min-width: 0;
}

.friend-row strong,
.friend-row small {
	display: block;
	overflow-wrap: anywhere;
}

.friend-row small,
.order-list small {
	color: var(--muted);
}

.share-row {
	cursor: pointer;
}

.share-row input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.switch-ui {
	width: 48px;
	height: 28px;
	padding: 4px;
	border-radius: 8px;
	background: color-mix(in srgb, var(--muted) 26%, transparent);
	border: 1px solid var(--line);
}

.switch-ui::before {
	content: "";
	display: block;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: var(--text);
	transition: transform .2s ease, background .2s ease;
}

.share-row input:checked + .switch-ui {
	background: color-mix(in srgb, var(--accent-2) 48%, transparent);
}

.share-row input:checked + .switch-ui::before {
	transform: translateX(20px);
	background: var(--accent-2);
}

.profile-actions,
.product-actions {
	display: flex;
	flex-wrap: wrap;
	gap: .75rem;
}

.order-list a {
	display: grid;
	grid-template-columns: 1fr auto auto;
}

.reader-page {
	min-height: calc(100svh - var(--header-height));
	padding: 1rem 0 4rem;
}

.reader-shell {
	min-height: calc(100svh - var(--header-height) - 2rem);
	display: grid;
	grid-template-rows: auto 1fr;
	gap: .9rem;
}

.reader-toolbar {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: 1rem;
	padding: .8rem;
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: var(--radius);
}

.reader-title {
	min-width: 0;
	text-align: center;
}

.reader-title h1 {
	font-size: clamp(1rem, 2vw, 1.45rem);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.reader-controls {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
}

.reader-controls span {
	min-width: 76px;
	text-align: center;
	color: var(--muted);
	font-weight: 800;
}

.pdf-reader {
	--pdf-page-width: 1450;
	--pdf-page-height: 2048;
	position: relative;
	min-height: 70svh;
	display: grid;
	place-items: center;
	padding: clamp(.75rem, 2vw, 1.2rem);
	background:
		linear-gradient(135deg, color-mix(in srgb, var(--surface) 92%, transparent), color-mix(in srgb, var(--surface-2) 82%, transparent));
	border: 1px solid var(--line);
	border-radius: var(--radius);
	overflow: hidden;
	box-shadow: var(--shadow);
}

.pdf-reader canvas {
	width: min(100%, 560px);
	height: auto;
	aspect-ratio: var(--pdf-page-width) / var(--pdf-page-height);
	max-width: 100%;
	max-height: 76svh;
	background: #fff;
	box-shadow: 0 20px 55px rgba(0,0,0,.35);
	transform-origin: left center;
	transition: transform .35s ease, opacity .25s ease;
}

.pdf-reader.is-flipping canvas {
	transform: rotateY(-14deg) translateX(10px);
	opacity: .72;
}

.pdf-reader iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	display: none;
	background: white;
}

.pdf-reader.use-fallback iframe {
	display: block;
}

.pdf-reader.use-fallback canvas,
.pdf-reader.use-fallback .reader-loading {
	display: none;
}

.reader-loading {
	position: absolute;
	z-index: 2;
	padding: .7rem .9rem;
	border-radius: var(--radius);
	background: var(--surface);
	border: 1px solid var(--line);
	color: var(--muted);
}

.preview-pdf-page {
	width: min(100%, 480px);
	aspect-ratio: 1450 / 2048;
	border-radius: 6px;
	background:
		linear-gradient(90deg, transparent 0 10%, rgba(12,14,20,.06) 10% 10.3%, transparent 10.3%),
		repeating-linear-gradient(180deg, rgba(16,18,24,.82) 0 10px, transparent 10px 29px),
		linear-gradient(135deg, #fff, #f6f2ea);
	box-shadow: 0 20px 55px rgba(0,0,0,.35);
}

.checkout-progress {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: .65rem;
	margin-bottom: 1rem;
}

.checkout-progress button {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .45rem;
	min-height: 48px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--surface);
	color: var(--muted);
	cursor: pointer;
}

.checkout-progress button.active {
	border-color: var(--accent-2);
	color: var(--text);
	background: color-mix(in srgb, var(--accent-2) 16%, var(--surface));
}

.checkout-progress span {
	display: grid;
	place-items: center;
	width: 26px;
	height: 26px;
	border-radius: 6px;
	background: var(--surface-2);
	font-weight: 900;
}

.checkout-step-actions {
	display: flex;
	justify-content: space-between;
	gap: .75rem;
	margin-top: 1rem;
}

.woocommerce form .form-row {
	display: grid;
	gap: .35rem;
}

.woocommerce-billing-fields__field-wrapper,
.woocommerce-shipping-fields__field-wrapper {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: .8rem;
}

.woocommerce-checkout-review-order,
.woocommerce-checkout-payment,
.woocommerce-billing-fields,
.woocommerce-additional-fields {
	padding: 1rem;
	margin-bottom: 1rem;
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: var(--radius);
}

.checkout-step-hidden {
	display: none !important;
}

.product-detail {
	display: grid;
	grid-template-columns: minmax(280px, 440px) minmax(0, 1fr);
	gap: clamp(1.5rem, 5vw, 4rem);
	align-items: start;
}

.product-copy h1 {
	margin: .35rem 0 .7rem;
	font-size: clamp(2.2rem, 6vw, 5rem);
	line-height: .95;
}

.product-price {
	font-size: 1.5rem;
	font-weight: 900;
	color: var(--accent-2);
	margin-bottom: 1rem;
}

.product-lead {
	margin: 0 0 1rem;
	color: var(--text);
	font-size: 1.05rem;
	line-height: 1.7;
}

.product-gallery-strip {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: .55rem;
	margin-top: .75rem;
}

.product-gallery-strip a {
	aspect-ratio: 1;
	overflow: hidden;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--surface);
}

.product-gallery-strip img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .2s ease;
}

.product-gallery-strip a:hover img {
	transform: scale(1.05);
}

.product-specs {
	margin: 1.2rem 0;
	padding: 1rem;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--surface);
}

.product-specs h2 {
	margin: 0 0 .8rem;
	font-size: 1.1rem;
}

.product-specs dl {
	display: grid;
	gap: .55rem;
	margin: 0;
}

.product-specs dl div {
	display: grid;
	grid-template-columns: minmax(110px, .42fr) minmax(0, 1fr);
	gap: .8rem;
	padding-bottom: .55rem;
	border-bottom: 1px solid var(--line);
}

.product-specs dl div:last-child {
	padding-bottom: 0;
	border-bottom: 0;
}

.product-specs dt,
.product-specs dd {
	margin: 0;
}

.product-specs dt {
	color: var(--muted);
}

.product-specs dd {
	color: var(--text);
	font-weight: 800;
	overflow-wrap: anywhere;
}

.content-narrow {
	width: min(820px, calc(100% - 32px));
}

.entry-content {
	color: var(--muted);
	line-height: 1.8;
}

.entry-content a {
	color: var(--accent-2);
	text-decoration: underline;
}

.site-footer {
	padding: 3rem 0 6rem;
	border-top: 1px solid var(--line);
	background: var(--bg);
}

.footer-grid {
	display: grid;
	grid-template-columns: 1.3fr repeat(2, .7fr);
	gap: 2rem;
}

.footer-grid h2 {
	font-size: .88rem;
	text-transform: uppercase;
	color: var(--muted);
}

.footer-grid a {
	display: block;
	margin: .55rem 0;
	color: var(--muted);
}

.footer-grid a:hover {
	color: var(--text);
}

.footer-brand {
	margin-bottom: 1rem;
}

.footer-bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-top: 2rem;
	padding-top: 1rem;
	border-top: 1px solid var(--line);
	color: var(--muted);
	font-size: .9rem;
}

.app-bottom-nav {
	position: fixed;
	left: 50%;
	bottom: .75rem;
	z-index: 90;
	display: none;
	width: min(430px, calc(100% - 24px));
	transform: translateX(-50%);
	grid-template-columns: repeat(4, 1fr);
	gap: .35rem;
	padding: .45rem;
	background: color-mix(in srgb, var(--surface) 90%, transparent);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	box-shadow: var(--shadow);
	backdrop-filter: blur(20px);
}

.app-bottom-nav a {
	display: grid;
	place-items: center;
	gap: .2rem;
	min-height: 50px;
	color: var(--muted);
	font-size: .72rem;
	font-weight: 800;
}

.app-bottom-nav span {
	width: 18px;
	height: 18px;
	border-radius: 5px;
	background: linear-gradient(135deg, var(--accent), var(--accent-2));
}

.app-bottom-nav a:hover,
.app-bottom-nav a:focus-visible {
	color: var(--text);
	outline: none;
}

@media (max-width: 1040px) {
	.book-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.woocommerce ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.hero-grid {
		grid-template-columns: 1fr;
	}

	.hero-visual {
		min-height: 420px;
	}

	.steps-layout,
	.product-detail {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 820px) {
	:root {
		--header-height: 68px;
	}

	body {
		padding-bottom: 76px;
	}

	.desktop-nav {
		display: none;
	}

	.menu-toggle,
	.mobile-panel,
	.app-bottom-nav {
		display: grid;
	}

	.brand-text small {
		display: none;
	}

	.hero-section {
		min-height: auto;
		padding-top: 2rem;
	}

	.hero-copy h1 {
		font-size: clamp(4rem, 18vw, 6rem);
	}

	.hero-visual {
		min-height: 330px;
	}

	.catalog-tools,
	.feature-grid,
	.friends-layout,
	.account-layout,
	.footer-grid,
	.page-hero-grid {
		grid-template-columns: 1fr;
	}

	.section-head,
	.library-toolbar,
	.footer-bottom {
		align-items: start;
		flex-direction: column;
	}

	.hide-mobile {
		display: none;
	}

	.checkout-progress {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 620px) {
	.shell {
		width: min(100% - 24px, 1160px);
	}

	.header-actions {
		gap: .35rem;
	}

	.icon-button {
		width: 40px;
		height: 40px;
	}

	.book-grid {
		grid-template-columns: 1fr;
	}

	.woocommerce ul.products {
		grid-template-columns: 1fr;
	}

	.book-card {
		grid-template-columns: 116px minmax(0, 1fr);
		min-height: 216px;
		gap: .75rem;
		padding: .65rem;
	}

	.book-cover {
		min-height: 198px;
	}

	.book-card h3 {
		font-size: 1rem;
	}

	.book-card p {
		font-size: .85rem;
	}

	.book-card-actions {
		display: grid;
		grid-template-columns: 1fr 1fr;
	}

	.book-card-actions .button {
		min-width: 0;
		width: 100%;
	}

	.product-gallery-strip {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.product-specs dl div {
		grid-template-columns: 1fr;
		gap: .2rem;
	}

	.segmented {
		width: 100%;
	}

	.reader-toolbar {
		grid-template-columns: 1fr;
		text-align: center;
	}

	.reader-controls {
		justify-content: center;
	}

	.pdf-reader {
		min-height: 66svh;
	}

	.woocommerce-billing-fields__field-wrapper,
	.woocommerce-shipping-fields__field-wrapper,
	.checkout-progress {
		grid-template-columns: 1fr;
	}

	.friend-row,
	.order-list a {
		align-items: start;
	}
}

@media (max-width: 430px) {
	.book-card {
		grid-template-columns: 1fr;
	}

	.book-cover {
		aspect-ratio: 4 / 5;
		min-height: 0;
	}

	.hero-actions,
	.profile-actions,
	.product-actions,
	.checkout-step-actions {
		display: grid;
		grid-template-columns: 1fr;
	}
}