.pwtoc {
	--pwtoc-accent: #1b63e0;
	--pwtoc-accent-soft: rgba(27, 99, 224, 0.08);
	--pwtoc-card-width: 320px;
	--pwtoc-sticky-offset: 120px;
	--pwtoc-card-bg: #ffffff;
	--pwtoc-card-border: #e5e7eb;
	--pwtoc-title-color: #9ca3af;
	--pwtoc-subtitle-color: #6b7280;
	--pwtoc-link-color: #374151;
	--pwtoc-link-hover-color: var(--pwtoc-accent);
	--pwtoc-heading-font: inherit;
	box-sizing: border-box;
	max-width: var(--pwtoc-card-width);
	width: 100%;
}

.pwtoc *,
.pwtoc *::before,
.pwtoc *::after {
	box-sizing: inherit;
}

.pwtoc[data-skin="navy"] {
	--pwtoc-card-bg: #101b3d;
	--pwtoc-card-border: #24325c;
	--pwtoc-title-color: #8b9ac2;
	--pwtoc-subtitle-color: #b9c3e0;
	--pwtoc-link-color: #dbe2f5;
	--pwtoc-accent-soft: rgba(255, 255, 255, 0.08);
}

.pwtoc[data-skin="cream"] {
	--pwtoc-card-bg: #f7f3ec;
	--pwtoc-card-border: #e6ddc9;
	--pwtoc-title-color: #a89a7c;
	--pwtoc-subtitle-color: #6b6250;
	--pwtoc-link-color: #3a3327;
}

.pwtoc[data-heading-font="serif"] {
	--pwtoc-heading-font: Georgia, "Playfair Display", "Times New Roman", serif;
}

.pwtoc[data-sticky="true"] {
	position: sticky;
	top: var(--pwtoc-sticky-offset);
	align-self: start;
}

.pwtoc__card {
	background: var(--pwtoc-card-bg);
	border: 1px solid var(--pwtoc-card-border);
	border-radius: 16px;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.07), 0 1px 2px rgba(0, 0, 0, 0.05);
	overflow: hidden;
	padding: 1.5rem;
	position: relative;
	width: 100%;
}

.pwtoc__progress {
	background: var(--pwtoc-accent-soft);
	border-radius: 3px;
	display: none;
	height: 3px;
	left: 1.5rem;
	overflow: hidden;
	position: absolute;
	right: 1.5rem;
	top: 0;
}

.pwtoc[data-progress="true"] .pwtoc__progress {
	display: block;
}

.pwtoc__progress-bar {
	background: var(--pwtoc-accent);
	display: block;
	height: 100%;
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.15s ease-out;
	width: 100%;
}

.pwtoc__toggle {
	align-items: center;
	background: transparent;
	border: 0;
	color: inherit;
	cursor: default;
	display: flex;
	font: inherit;
	gap: 1rem;
	justify-content: space-between;
	margin: 0 0 0.9rem;
	padding: 0;
	text-align: left;
	width: 100%;
}

.pwtoc .pwtoc__toggle,
.pwtoc .pwtoc__toggle:hover,
.pwtoc .pwtoc__toggle:active,
.pwtoc .pwtoc__toggle:focus {
	background: transparent;
	color: inherit;
	text-decoration: none;
}

.pwtoc__toggle:focus-visible,
.pwtoc__link:focus-visible {
	outline: 2px solid var(--pwtoc-accent);
	outline-offset: 3px;
}

.pwtoc__heading {
	display: grid;
	gap: 0.25rem;
	min-width: 0;
}

.pwtoc__title {
	color: var(--pwtoc-title-color);
	font-family: var(--pwtoc-heading-font);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 1.5px;
	line-height: 1.25;
	text-transform: uppercase;
}

.pwtoc__subtitle {
	color: var(--pwtoc-subtitle-color);
	font-size: 12px;
	font-weight: 500;
	line-height: 1.35;
}

.pwtoc__chevron {
	display: none;
	flex: 0 0 auto;
	height: 10px;
	position: relative;
	width: 10px;
}

.pwtoc__chevron::before {
	border-bottom: 2px solid var(--pwtoc-subtitle-color);
	border-right: 2px solid var(--pwtoc-subtitle-color);
	content: "";
	height: 7px;
	left: 1px;
	position: absolute;
	top: -1px;
	transform: rotate(45deg);
	transition: transform 0.2s ease;
	width: 7px;
}

.pwtoc__toggle[aria-expanded="true"] .pwtoc__chevron::before {
	transform: rotate(225deg);
}

.pwtoc__list {
	counter-reset: pwtoc-counter;
	display: flex;
	flex-direction: column;
	gap: 2px;
	list-style: none;
	margin: 0;
	max-height: min(68vh, 680px);
	overflow: auto;
	padding: 0;
	scrollbar-width: thin;
}

.pwtoc__item {
	align-items: center;
	display: flex;
	margin: 0;
	padding: 0;
}

.pwtoc .pwtoc__link,
.pwtoc .pwtoc__link:visited {
	border-left: 2px solid transparent;
	border-radius: 7px;
	color: var(--pwtoc-link-color) !important;
	display: block;
	flex: 1 1 auto;
	font-size: 13px;
	font-weight: 500;
	line-height: 1.35;
	min-width: 0;
	padding: 7px 10px;
	text-decoration: none !important;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.pwtoc .pwtoc__link:hover,
.pwtoc .pwtoc__link:active,
.pwtoc .pwtoc__link:focus,
.pwtoc .pwtoc__link[aria-current="true"] {
	background: var(--pwtoc-accent-soft) !important;
	border-left-color: var(--pwtoc-accent) !important;
	color: var(--pwtoc-link-hover-color) !important;
	text-decoration: none !important;
}

.pwtoc .pwtoc__link[aria-current="true"] {
	font-weight: 700;
}

.pwtoc .pwtoc__link--h3 {
	font-size: 12px;
	margin-left: 12px;
	padding-left: 13px;
}

.pwtoc[data-numbering="number"] .pwtoc__link:not(.pwtoc__link--h3)::before {
	color: var(--pwtoc-accent);
	content: counter(pwtoc-counter) ".";
	counter-increment: pwtoc-counter;
	display: inline-block;
	font-weight: 700;
	margin-right: 6px;
	min-width: 1.1em;
}

.pwtoc[data-numbering="bullet"] .pwtoc__link::before {
	background: var(--pwtoc-accent);
	border-radius: 50%;
	content: "";
	display: inline-block;
	height: 5px;
	margin-right: 8px;
	vertical-align: middle;
	width: 5px;
}

.pwtoc__copy {
	align-items: center;
	background: transparent;
	border: 0;
	border-radius: 6px;
	color: var(--pwtoc-subtitle-color);
	cursor: pointer;
	display: none;
	flex: 0 0 auto;
	height: 26px;
	justify-content: center;
	margin-left: 2px;
	opacity: 0;
	padding: 0;
	transition: opacity 0.15s ease, color 0.15s ease, background-color 0.15s ease;
	width: 26px;
}

.pwtoc[data-copy-link="true"] .pwtoc__copy {
	display: inline-flex;
}

.pwtoc__item:hover .pwtoc__copy,
.pwtoc__copy:focus-visible {
	opacity: 1;
}

.pwtoc__copy:hover,
.pwtoc__copy:focus-visible {
	background: var(--pwtoc-accent-soft);
	color: var(--pwtoc-accent);
	outline: none;
}

.pwtoc__copy svg {
	display: block;
	height: 13px;
	width: 13px;
}

.pwtoc__copy[data-copied="true"] {
	color: var(--pwtoc-accent);
	opacity: 1;
}

.pwtoc[data-ready="false"],
.pwtoc:empty {
	display: none;
}

.pwtoc[data-animate="true"] .pwtoc__card {
	animation: pwtoc-fade-up 0.35s ease both;
}

@keyframes pwtoc-fade-up {
	from {
		opacity: 0;
		transform: translateY(10px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@media (max-width: 1024px) {
	.pwtoc {
		max-width: 100%;
	}

	.pwtoc[data-sticky="true"] {
		position: static;
		top: auto;
	}
}

@media (max-width: 767px) {
	.pwtoc__card {
		border-radius: 14px;
		padding: 1rem;
	}

	.pwtoc__progress {
		left: 1rem;
		right: 1rem;
	}

	.pwtoc__toggle {
		cursor: pointer;
		margin-bottom: 0;
		padding: 0.15rem 0;
	}

	.pwtoc__chevron {
		display: block;
	}

	.pwtoc[data-mobile-collapse="true"] .pwtoc__list {
		max-height: 0;
		opacity: 0;
		overflow: hidden;
		padding-top: 0;
		transition: max-height 0.25s ease, opacity 0.2s ease, padding-top 0.25s ease;
	}

	.pwtoc[data-mobile-collapse="true"][data-open="true"] .pwtoc__list {
		max-height: 70vh;
		opacity: 1;
		padding-top: 0.9rem;
	}

	.pwtoc:not([data-mobile-collapse="true"]) .pwtoc__list {
		padding-top: 0.9rem;
	}

	.pwtoc__link {
		font-size: 14px;
		min-height: 42px;
		padding: 11px 10px;
	}

	.pwtoc__copy {
		height: 34px;
		opacity: 1;
		width: 34px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.pwtoc *,
	.pwtoc *::before,
	.pwtoc *::after {
		animation-duration: 0.001ms !important;
		scroll-behavior: auto !important;
		transition-duration: 0.001ms !important;
	}
}