/*!
 * Professional Smart TOC — frontend styles v1.0.0
 * Logical properties throughout => automatic RTL. No layout shift by design:
 * the TOC renders expanded server-side; collapse state is applied pre-paint.
 */

/* ------------------------------------------------------------------ tokens */
.pstoc {
	--pstoc-bg: #ffffff;
	--pstoc-tx: #1f2937;
	--pstoc-ln: #374151;
	--pstoc-ac: #2563eb;
	--pstoc-bd: #e5e7eb;
	--pstoc-soft: rgba(0, 0, 0, .045);
	--pstoc-rad: 12px;
	--pstoc-fs: 1rem;
	--pstoc-w: 100%;
	--pstoc-mw: none;
	--pstoc-sh: 0 6px 22px rgba(15, 23, 42, .07);
	--pstoc-pad: 1rem 1.2rem;
	--pstoc-ff: inherit;
}

/* ------------------------------------------------------------------ layout */
.pstoc-wrap { margin-block: 1.4em; }
.pstoc-align-center { display: flex; justify-content: center; }
.pstoc-sticky { position: sticky; top: var(--pstoc-sticky-top, 90px); z-index: 5; }
.pstoc-sticky-start { float: inline-start; margin-inline-end: 1.4em; max-width: 340px; }
.pstoc-sticky-end { float: inline-end; margin-inline-start: 1.4em; max-width: 340px; }

.pstoc {
	box-sizing: border-box;
	width: var(--pstoc-w);
	max-width: var(--pstoc-mw);
	background: var(--pstoc-bg);
	color: var(--pstoc-tx);
	border: 1px solid var(--pstoc-bd);
	border-radius: var(--pstoc-rad);
	box-shadow: var(--pstoc-sh);
	font-size: var(--pstoc-fs);
	font-family: var(--pstoc-ff);
	line-height: 1.6;
	padding: var(--pstoc-pad);
	contain: layout paint;
}
.pstoc *, .pstoc *::before, .pstoc *::after { box-sizing: border-box; }
.pstoc-no-shadow { box-shadow: none; }

/* icons */
.pstoc-i { width: 1.1em; height: 1.1em; flex: none; vertical-align: -0.18em; }

/* ------------------------------------------------------------------ header */
.pstoc-header { display: flex; align-items: center; gap: .6em; }
.pstoc.pstoc .pstoc-title {
	display: flex; align-items: center; gap: .5em;
	margin: 0; font-weight: 700; font-size: 1.05em; color: var(--pstoc-tx);
}
.pstoc.pstoc .pstoc-title .pstoc-i { color: var(--pstoc-ac); }

.pstoc.pstoc .pstoc-iconbtn {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 44px; min-height: 44px; margin-inline-start: auto;
	padding: 0; border: 0; background: transparent; color: var(--pstoc-tx);
	border-radius: 8px; cursor: pointer;
}
.pstoc.pstoc .pstoc-iconbtn + .pstoc-iconbtn { margin-inline-start: 0; }
.pstoc.pstoc .pstoc-iconbtn:hover { background: var(--pstoc-soft); }
.pstoc-chevron {
	width: .55em; height: .55em; border-inline-end: 2px solid currentColor;
	border-block-end: 2px solid currentColor; transform: rotate(45deg) translateY(-15%);
	transition: transform .2s ease;
}
.pstoc-collapsed .pstoc-toggle .pstoc-chevron { transform: rotate(-135deg) translateY(-15%); }

/* --------------------------------------------------------- collapsible body */
.pstoc-body {
	display: grid; grid-template-rows: 1fr;
	transition: grid-template-rows .28s ease;
}
.pstoc-inner { overflow: hidden; min-height: 0; }
.pstoc-collapsed .pstoc-body { grid-template-rows: 0fr; }

/* -------------------------------------------------------------------- meta */
.pstoc.pstoc .pstoc-meta {
	display: flex; align-items: center; flex-wrap: wrap; gap: .45em;
	margin: .5em 0 0; font-size: .82em; opacity: .78;
}
.pstoc-dot { opacity: .6; }

/* ------------------------------------------------------------------ search */
.pstoc-searchwrap {
	position: relative; display: flex; align-items: center;
	margin-block-start: .7em;
}
.pstoc-searchwrap .pstoc-i {
	position: absolute; inset-inline-start: .65em; opacity: .55; pointer-events: none;
}
.pstoc.pstoc .pstoc-search {
	width: 100%; font: inherit; font-size: .92em; color: var(--pstoc-tx);
	background: var(--pstoc-soft); border: 1px solid var(--pstoc-bd);
	border-radius: calc(var(--pstoc-rad) * .6);
	padding: .45em .8em; padding-inline-start: 2.3em;
}
.pstoc.pstoc .pstoc-search:focus { outline: 2px solid var(--pstoc-ac); outline-offset: 1px; }

/* -------------------------------------------------------------------- list */
.pstoc-list, .pstoc-sub { list-style: none; margin: 0; padding: 0; }
.pstoc-list { margin-block-start: .55em; }
.pstoc-sub { padding-inline-start: 1.1em; }
.pstoc-item { position: relative; margin: 0; }
.pstoc-item.pstoc-hide { display: none; }

.pstoc.pstoc .pstoc-link {
	display: inline-flex; align-items: baseline; gap: .35em;
	max-width: 100%; padding: .3em .35em; border-radius: 7px;
	color: var(--pstoc-ln); text-decoration: none; background-image: none;
	border: 0; box-shadow: none;
	transition: color .15s ease, background-color .15s ease;
}
.pstoc.pstoc .pstoc-link:visited { color: var(--pstoc-ln); }
.pstoc.pstoc .pstoc-link:hover { color: var(--pstoc-ac); background: var(--pstoc-soft); }
.pstoc.pstoc .pstoc-link.is-active { color: var(--pstoc-ac); font-weight: 600; }
.pstoc.pstoc .pstoc-link.is-active .pstoc-txt { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 2px; }
.pstoc-txt { overflow-wrap: anywhere; }

/* numbering */
.pstoc-num-decimal .pstoc-list { counter-reset: pstoc; }
.pstoc-num-decimal .pstoc-sub { counter-reset: pstoc; }
.pstoc-num-decimal .pstoc-item { counter-increment: pstoc; }
.pstoc-num-decimal .pstoc-item > .pstoc-link::before {
	content: counters(pstoc, ".") ". ";
	color: var(--pstoc-ac); font-weight: 600; font-variant-numeric: tabular-nums;
}
.pstoc-num-bullets .pstoc-item > .pstoc-link::before {
	content: ""; flex: none; align-self: center;
	width: .38em; height: .38em; border-radius: 50%; background: var(--pstoc-ac);
}
/* pstoc-num-none: nothing */

/* copy heading link button */
.pstoc-copy {
	display: inline-flex; align-items: center; justify-content: center;
	width: 1.7em; height: 1.7em; margin-inline-start: .15em; padding: 0;
	border: 0; border-radius: 6px; background: transparent; color: var(--pstoc-ln);
	cursor: pointer; opacity: 0; transition: opacity .15s ease;
	vertical-align: middle;
}
.pstoc-item:hover > .pstoc-copy,
.pstoc-copy:focus-visible { opacity: .85; }
.pstoc-copy:hover { background: var(--pstoc-soft); color: var(--pstoc-ac); }
.pstoc-copy .pstoc-i, .pstoc-copyall .pstoc-i { width: .95em; height: .95em; }
.pstoc-copy.is-copied, .pstoc-copyall.is-copied { color: #059669; opacity: 1; }
.pstoc-copy.is-copied::after, .pstoc-copyall.is-copied::after {
	content: attr(data-tip);
	position: absolute; transform: translateY(-140%);
	background: #111827; color: #fff; font-size: .7rem; line-height: 1;
	padding: .35em .55em; border-radius: 5px; white-space: nowrap; pointer-events: none;
}
.pstoc-copy, .pstoc-copyall { position: relative; }

/* accordion (tree view) */
.pstoc-acc {
	position: absolute; inset-inline-start: -1.15em; inset-block-start: .28em;
	display: inline-flex; align-items: center; justify-content: center;
	width: 1.1em; height: 1.1em; padding: 0; border: 0; background: transparent;
	color: var(--pstoc-ln); cursor: pointer;
}
.pstoc-acc .pstoc-chevron { transition: transform .2s ease; }
.pstoc-sub-closed > .pstoc-acc .pstoc-chevron { transform: rotate(-45deg); }
.pstoc-sub-closed > .pstoc-sub { display: none; }
.pstoc-has-sub { padding-inline-start: .2em; }

/* --------------------------------------------------------------- utilities */
.pstoc .screen-reader-text {
	position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
	overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.pstoc :focus-visible { outline: 2px solid var(--pstoc-ac); outline-offset: 2px; }
.pstoc-unplaced { visibility: hidden; }
.no-js .pstoc-unplaced, .pstoc-unplaced.pstoc-placed { visibility: visible; }

/* ---------------------------------------------------------- global widgets */
.pstoc-progressbar {
	position: fixed; inset-block-start: 0; inset-inline: 0; height: 3px;
	background: var(--pstoc-ac, #2563eb); transform-origin: 0 50%;
	transform: scaleX(0); z-index: 99999; pointer-events: none;
}
[dir="rtl"] .pstoc-progressbar { transform-origin: 100% 50%; }

.pstoc-top {
	position: fixed; inset-block-end: 22px; inset-inline-end: 22px;
	width: 52px; height: 52px; padding: 0; border: 0; border-radius: 50%;
	background: #111827; color: #fff; cursor: pointer;
	display: inline-flex; align-items: center; justify-content: center;
	box-shadow: 0 8px 22px rgba(0, 0, 0, .25);
	opacity: 0; visibility: hidden; transform: translateY(8px);
	transition: opacity .25s ease, transform .25s ease, visibility .25s;
	z-index: 99998;
}
.pstoc-top.is-show { opacity: 1; visibility: visible; transform: none; }
.pstoc-ring { position: absolute; inset: 3px; transform: rotate(-90deg); }
.pstoc-ring circle { fill: none; stroke-width: 2.5; }
.pstoc-ring-bg { stroke: rgba(255, 255, 255, .22); }
.pstoc-ring-fg { stroke: #60a5fa; stroke-linecap: round; }
.pstoc-top-arrow {
	width: .55em; height: .55em; border-inline-start: 2px solid currentColor;
	border-block-start: 2px solid currentColor; transform: rotate(45deg) translate(15%, 15%);
}

/* --------------------------------------------------------- mobile FAB + UI */
.pstoc-fab {
	position: fixed; inset-block-end: 22px; inset-inline-start: 22px;
	width: 54px; height: 54px; padding: 0; border: 0; border-radius: 50%;
	background: var(--pstoc-fab-bg, #2563eb); color: #fff; cursor: pointer;
	display: inline-flex; align-items: center; justify-content: center;
	box-shadow: 0 10px 26px rgba(37, 99, 235, .4); z-index: 99998;
}
.pstoc-fab-i, .pstoc-fab-i::before, .pstoc-fab-i::after {
	display: block; width: 20px; height: 2px; border-radius: 2px; background: currentColor;
}
.pstoc-fab-i { position: relative; }
.pstoc-fab-i::before, .pstoc-fab-i::after { content: ""; position: absolute; inset-inline-start: 0; }
.pstoc-fab-i::before { inset-block-start: -6px; }
.pstoc-fab-i::after { inset-block-start: 6px; width: 14px; }

.pstoc-overlay { position: fixed; inset: 0; z-index: 99999; visibility: hidden; }
.pstoc-overlay.is-open { visibility: visible; }
.pstoc-backdrop {
	position: absolute; inset: 0; background: rgba(15, 23, 42, .45);
	opacity: 0; transition: opacity .25s ease;
}
.pstoc-overlay.is-open .pstoc-backdrop { opacity: 1; }

.pstoc-panel {
	position: absolute; background: #fff; color: #111827;
	overflow: auto; -webkit-overflow-scrolling: touch;
	transition: transform .3s cubic-bezier(.32, .72, .35, 1);
	padding: 14px 16px calc(16px + env(safe-area-inset-bottom, 0px));
}
.pstoc-mode-sheet .pstoc-panel {
	inset-inline: 0; inset-block-end: 0; max-height: 78vh;
	border-start-start-radius: 18px; border-start-end-radius: 18px;
	transform: translateY(100%);
}
.pstoc-mode-drawer .pstoc-panel {
	inset-block: 0; inset-inline-end: 0; width: min(340px, 88vw);
	transform: translateX(100%);
}
[dir="rtl"] .pstoc-mode-drawer .pstoc-panel { transform: translateX(-100%); }
.pstoc-overlay.is-open .pstoc-panel { transform: none; }

.pstoc-close {
	position: sticky; inset-block-start: 0; margin-inline-start: auto;
	display: flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; border: 0; border-radius: 10px;
	background: rgba(0, 0, 0, .05); color: inherit; font-size: 22px; line-height: 1;
	cursor: pointer;
}
.pstoc-in-panel { margin-block: 8px 0; }
.pstoc-in-panel .pstoc { box-shadow: none; border: 0; padding: .4rem .2rem; }
body.pstoc-lock { overflow: hidden; }

/* ------------------------------------------------------------- dark themes */
.pstoc-theme-dark {
	--pstoc-bg: #0f172a; --pstoc-tx: #e2e8f0; --pstoc-ln: #cbd5e1;
	--pstoc-ac: #60a5fa; --pstoc-bd: #1e293b; --pstoc-soft: rgba(255, 255, 255, .06);
	--pstoc-sh: 0 8px 26px rgba(0, 0, 0, .45);
}
@media (prefers-color-scheme: dark) {
	.pstoc-theme-auto {
		--pstoc-bg: #0f172a; --pstoc-tx: #e2e8f0; --pstoc-ln: #cbd5e1;
		--pstoc-ac: #60a5fa; --pstoc-bd: #1e293b; --pstoc-soft: rgba(255, 255, 255, .06);
		--pstoc-sh: 0 8px 26px rgba(0, 0, 0, .45);
	}
}

/* =========================================================== STYLE PRESETS
   Each preset only overrides tokens (tiny CSS, zero conflicts). 33 presets. */
.pstoc-style-modern   { --pstoc-ac: #2563eb; }
.pstoc-style-minimal  { --pstoc-bg: transparent; --pstoc-bd: transparent; --pstoc-sh: none; --pstoc-pad: .2rem 0; }
.pstoc-style-elegant  { --pstoc-ff: Georgia, "Times New Roman", serif; --pstoc-ac: #9a6b3f; --pstoc-bd: #eadfd2; --pstoc-bg: #fffdf9; }
.pstoc-style-business { --pstoc-rad: 4px; --pstoc-ac: #0f4c81; --pstoc-bd: #d3dce6; --pstoc-sh: none; }
.pstoc-style-classic  { --pstoc-rad: 0; --pstoc-bg: #f9f9f7; --pstoc-bd: #ccc; --pstoc-sh: none; --pstoc-ac: #444; }
.pstoc-style-premium  { --pstoc-bg: linear-gradient(150deg, #101828, #1d2939); --pstoc-tx: #f8fafc; --pstoc-ln: #e2e8f0; --pstoc-ac: #fbbf24; --pstoc-bd: #33415580; --pstoc-soft: rgba(255,255,255,.07); }
.pstoc-style-glass    { --pstoc-bg: rgba(255, 255, 255, .55); --pstoc-bd: rgba(255, 255, 255, .65); backdrop-filter: blur(14px) saturate(1.4); -webkit-backdrop-filter: blur(14px) saturate(1.4); }
.pstoc-style-apple    { --pstoc-rad: 20px; --pstoc-bg: #f5f5f7; --pstoc-bd: #f5f5f7; --pstoc-ac: #0071e3; --pstoc-sh: none; --pstoc-ff: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.pstoc-style-material { --pstoc-rad: 8px; --pstoc-ac: #6750a4; --pstoc-bd: transparent; --pstoc-sh: 0 1px 3px rgba(0,0,0,.14), 0 4px 8px rgba(0,0,0,.12); }
.pstoc-style-gradient { --pstoc-bg: linear-gradient(135deg, #eef2ff, #fdf2f8); --pstoc-ac: #7c3aed; --pstoc-bd: transparent; }
.pstoc-style-soft     { --pstoc-rad: 16px; --pstoc-bg: #f8fafc; --pstoc-bd: transparent; --pstoc-sh: inset 0 0 0 1px #e2e8f0; }
.pstoc-style-card     { --pstoc-rad: 14px; --pstoc-sh: 0 10px 30px rgba(2, 8, 23, .1); --pstoc-bd: transparent; }
.pstoc-style-flat     { --pstoc-sh: none; --pstoc-rad: 6px; }
.pstoc-style-outline  { --pstoc-bg: transparent; --pstoc-sh: none; --pstoc-bd: currentColor; border-width: 2px; }
.pstoc-style-boxed    { --pstoc-rad: 0; --pstoc-sh: none; border-width: 2px; --pstoc-bd: #111827; }
.pstoc-style-brutal   { --pstoc-rad: 0; --pstoc-bd: #111; border-width: 3px; --pstoc-sh: 6px 6px 0 #111; --pstoc-ac: #e11d48; }
.pstoc-style-neon     { --pstoc-bg: #0a0a13; --pstoc-tx: #e6faff; --pstoc-ln: #b8f3ff; --pstoc-ac: #22d3ee; --pstoc-bd: #22d3ee66; --pstoc-sh: 0 0 22px #22d3ee40; --pstoc-soft: rgba(34,211,238,.1); }
.pstoc-style-terminal { --pstoc-bg: #0b1220; --pstoc-tx: #86efac; --pstoc-ln: #86efac; --pstoc-ac: #4ade80; --pstoc-bd: #14532d; --pstoc-rad: 6px; --pstoc-ff: ui-monospace, "SF Mono", Consolas, monospace; --pstoc-soft: rgba(74,222,128,.08); }
.pstoc-style-newspaper{ --pstoc-rad: 0; --pstoc-bg: #fdfcf8; --pstoc-bd: #111; --pstoc-sh: none; --pstoc-ac: #111; --pstoc-ff: Georgia, serif; border-block-width: 3px; border-inline-width: 0; }
.pstoc-style-magazine { --pstoc-rad: 0; --pstoc-bg: #fff; --pstoc-bd: transparent; --pstoc-sh: none; --pstoc-ac: #dc2626; border-inline-start: 5px solid var(--pstoc-ac); }
.pstoc-style-midnight { --pstoc-bg: #0f172a; --pstoc-tx: #e2e8f0; --pstoc-ln: #cbd5e1; --pstoc-ac: #818cf8; --pstoc-bd: #1e293b; --pstoc-soft: rgba(255,255,255,.06); }
.pstoc-style-ocean    { --pstoc-bg: #ecfeff; --pstoc-bd: #a5f3fc; --pstoc-ac: #0891b2; --pstoc-tx: #164e63; --pstoc-ln: #155e75; }
.pstoc-style-forest   { --pstoc-bg: #f0fdf4; --pstoc-bd: #bbf7d0; --pstoc-ac: #16a34a; --pstoc-tx: #14532d; --pstoc-ln: #166534; }
.pstoc-style-sunset   { --pstoc-bg: linear-gradient(135deg, #fff7ed, #fef2f2); --pstoc-bd: #fed7aa; --pstoc-ac: #ea580c; --pstoc-tx: #7c2d12; --pstoc-ln: #9a3412; }
.pstoc-style-royal    { --pstoc-bg: #faf5ff; --pstoc-bd: #e9d5ff; --pstoc-ac: #7e22ce; --pstoc-tx: #3b0764; --pstoc-ln: #581c87; }
.pstoc-style-rose     { --pstoc-bg: #fff1f2; --pstoc-bd: #fecdd3; --pstoc-ac: #e11d48; --pstoc-tx: #881337; --pstoc-ln: #9f1239; }
.pstoc-style-slate    { --pstoc-bg: #f8fafc; --pstoc-bd: #cbd5e1; --pstoc-ac: #334155; --pstoc-tx: #0f172a; --pstoc-ln: #334155; --pstoc-sh: none; }
.pstoc-style-sand     { --pstoc-bg: #fafaf5; --pstoc-bd: #e7e5d8; --pstoc-ac: #a16207; --pstoc-tx: #422006; --pstoc-ln: #713f12; }
.pstoc-style-gold     { --pstoc-bg: #1c1917; --pstoc-tx: #fef3c7; --pstoc-ln: #fde68a; --pstoc-ac: #f59e0b; --pstoc-bd: #f59e0b55; --pstoc-soft: rgba(245,158,11,.1); }
.pstoc-style-contrast { --pstoc-bg: #fff; --pstoc-tx: #000; --pstoc-ln: #000; --pstoc-ac: #0000d0; --pstoc-bd: #000; --pstoc-sh: none; border-width: 2px; }
.pstoc.pstoc-style-pill .pstoc-link { border-radius: 999px; padding-inline: .7em; }
.pstoc-style-pill     { --pstoc-rad: 22px; }
.pstoc-style-underline{ --pstoc-bg: transparent; --pstoc-bd: transparent; --pstoc-sh: none; --pstoc-pad: .2rem 0; }
.pstoc.pstoc-style-underline .pstoc-link { border-radius: 0; }
.pstoc.pstoc-style-underline .pstoc-link:hover { background: transparent; text-decoration: underline; text-underline-offset: 4px; }
.pstoc-style-compact  { --pstoc-fs: .88rem; --pstoc-pad: .6rem .8rem; --pstoc-rad: 8px; }
.pstoc.pstoc-style-compact .pstoc-link { padding-block: .18em; }

/* ------------------------------------------------------------ print / PDF */
@media print {
	.pstoc { box-shadow: none; border: 1px solid #999; break-inside: avoid; }
	.pstoc-iconbtn, .pstoc-copy, .pstoc-searchwrap, .pstoc-fab,
	.pstoc-top, .pstoc-progressbar, .pstoc-overlay { display: none !important; }
	.pstoc-collapsed .pstoc-body { grid-template-rows: 1fr; }
	.pstoc.pstoc .pstoc-link, .pstoc.pstoc .pstoc-title { color: #000; }
}

/* ------------------------------------------------------------ small screen */
@media (max-width: 480px) {
	.pstoc { --pstoc-pad: .85rem .95rem; }
	.pstoc-sub { padding-inline-start: .85em; }
}

/* ---------------------------------------------------------- reduced motion */
@media (prefers-reduced-motion: reduce) {
	.pstoc-body, .pstoc-chevron, .pstoc-link, .pstoc-panel,
	.pstoc-backdrop, .pstoc-top, .pstoc-copy, .pstoc-acc .pstoc-chevron {
		transition: none !important;
	}
}