/* Combined stylesheet for the Puck docs site.
   Ported from /home/miko/tmp/puck/build.py's CSS pipeline:
   - hand-authored site styles (STYLE_CSS)
   - Pygments default theme for code blocks (.highlight)
   - Pygments Monokai theme for vibecode dark blocks (.vibecode-code)
*/

/* === Site styles === */

* {box-sizing: border-box}
body {
	margin: 0;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
	color: #222;
	line-height: 1.55;
}
pre, code, textarea {tab-size: 4}
.layout {
	display: flex;
	min-height: 100vh;
}
.sidebar {
	width: 280px;
	flex-shrink: 0;
	background: #f6f7f9;
	border-right: 1px solid #e1e4e8;
	padding: 16px;
	overflow-y: auto;
	height: 100vh;
	position: sticky;
	top: 0;
	font-size: 13px;
}
.sidebar h1 {
	font-size: 14px;
	margin: 0 0 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: #57606a;
}
.sidebar h1 a {
	color: inherit;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
.sidebar h1 .logo {
	width: 16px;
	height: 16px;
}
.content h1 .hero-logo {
	height: 1.1em;
	width: auto;
	vertical-align: middle;
	margin-right: 0.4em;
}
body.home .content h1 .hero-logo {
	height: 2em;
	margin-right: 0.5em;
}
.sidebar ul {
	list-style: none;
	padding-left: 14px;
	margin: 0;
}
.sidebar > ul {padding-left: 0}
.sidebar li {padding: 2px 0}
.sidebar li.file a {
	color: #0969da;
	text-decoration: none;
}
.sidebar li.file a:hover {text-decoration: underline}
.sidebar li.file.current span {
	font-weight: 700;
	color: #222;
	background: yellow;
}
.sidebar li.file.asset a {
	color: #57606a;
	font-style: italic;
}
.sidebar details summary {
	cursor: pointer;
	color: #57606a;
	font-weight: 500;
	padding: 2px 0;
	user-select: none;
}
.sidebar details summary:hover {color: #222}
.sidebar details summary a {
	color: #0969da;
	text-decoration: none;
}
.sidebar details summary a:hover {text-decoration: underline}
.sidebar li.dir.current > details > summary > span {
	font-weight: 700;
	color: #222;
	background: yellow;
}
/* Spacer for entries that have no disclosure arrow (anything not
 * inside a <summary>). Covers files (link or current-page span),
 * empty-children dir nodes, and the bare-span form used when the
 * current page is a directory's own index. The phantom inline block
 * matches the disclosure-arrow width on <details> entries, so every
 * sidebar entry's name aligns at the same x regardless of shape. */
.sidebar li.file > a::before,
.sidebar li.file.current > span::before,
.sidebar li.dir:not(:has(details)) > a::before,
.sidebar li.dir:not(:has(details)) > span::before {
	content: "";
	display: inline-block;
	width: 1em;
}
.sidebar-search {margin: 0 0 12px}
.sidebar-search input {
	width: 100%;
	padding: 4px 8px;
	font-size: 13px;
	border: 1px solid #d0d7de;
	border-radius: 4px;
	background: #fff;
}
.sidebar-search input:focus {
	outline: none;
	border-color: #0969da;
	box-shadow: 0 0 0 2px rgba(9, 105, 218, 0.2);
}
.sidebar-random,
.sidebar-issues {
	display: block;
	margin: 0 0 12px;
	font-size: 12px;
	color: #57606a;
	text-decoration: none;
}
.sidebar-random:hover,
.sidebar-issues:hover {color: #0969da}
.search-form {
	margin: 0 0 16px;
	display: flex;
	gap: 8px;
}
.search-form input[type="search"] {
	flex: 1;
	padding: 6px 10px;
	font-size: 14px;
	border: 1px solid #d0d7de;
	border-radius: 4px;
}
.search-form button {
	padding: 6px 14px;
	font-size: 14px;
	border: 1px solid #d0d7de;
	border-radius: 4px;
	background: #f6f8fa;
	cursor: pointer;
}
.search-form button:hover {background: #eaeef2}
.search-summary, .search-empty, .search-hint {color: #57606a}
.search-results {
	list-style: decimal;
	padding-left: 24px;
}
.search-result {margin-bottom: 18px}
.search-path {font-weight: 600}
.search-count {
	color: #57606a;
	font-size: 0.85em;
	margin-left: 6px;
}
.search-preamble {
	color: #57606a;
	font-size: 0.9em;
	margin: 4px 0 0;
	padding-left: 10px;
	border-left: 2px solid #eaecef;
	line-height: 1.4;
}
.search-preamble mark {
	background: #fff3b8;
	color: #222;
	padding: 0 2px;
	border-radius: 2px;
}
.content {
	flex: 1;
	padding: 20px 48px 48px;
	max-width: 900px;
	overflow-x: auto;
}
.content h1, .content h2, .content h3, .content h4 {
	line-height: 1.25;
	margin-top: 1.6em;
	margin-bottom: 0.5em;
}
.content > :first-child {margin-top: 0}
.content h1 {
	border-bottom: 1px solid #d8dee4;
	padding-bottom: 0.3em;
}
.content h2 {
	border-bottom: 1px solid #eaecef;
	padding-bottom: 0.3em;
}
.content code {
	background: #f6f8fa;
	padding: 0.15em 0.3em;
	border-radius: 3px;
	font-size: 0.9em;
}
.content pre {
	background: #f6f8fa;
	padding: 14px 16px;
	border-radius: 6px;
	overflow-x: auto;
}
.content pre code {
	background: none;
	padding: 0;
	font-size: 0.85em;
}
.content table {
	border-collapse: collapse;
	margin: 1em 0;
}
.content th, .content td {
	border: 1px solid #d0d7de;
	padding: 6px 12px;
}
.content th {background: #f6f8fa}
.content blockquote {
	border-left: 3px solid #d0d7de;
	margin: 0;
	padding: 0 16px;
	color: #57606a;
}
.content a {color: #0969da}
.content hr {
	border: 0;
	border-top: 1px solid #d8dee4;
	margin: 2em 0;
}
.highlight {background: #f6f8fa !important}
.highlight.skeletor-state {border: 2px solid #5319e7}

/* Page preview — a bordered, browser-chrome-styled container for
   showing what a web page looks like when rendered. Used in docs that
   document HTML output (Puck class definitions, etc.) so readers can
   distinguish the preview from the surrounding doc content. */
.page-preview {
	border: 4px solid #57606a;
	border-radius: 8px;
	margin: 1.5em 0;
	overflow: hidden;
	background: #fff;
}
.page-preview-chrome {
	background: #f6f8fa;
	border-bottom: 2px solid #57606a;
	padding: 8px 16px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-size: 0.85em;
	color: #57606a;
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}
.page-preview-body {padding: 16px 24px}
.page-preview-body > h1:first-child {margin-top: 0.2em}
.page-preview-body h1 {font-size: 1.6em}
.page-preview-body h2 {font-size: 1.2em; margin-top: 1.5em}
.page-preview-body table {margin: 1em 0; border-collapse: collapse}
.page-preview-body th, .page-preview-body td {border: 1px solid #d0d7de; padding: 6px 12px}
.page-preview-body th {background: #f6f8fa}

/* Language-labeled code blocks. The wrapper sits around any fenced
   code block that carried a language hint (e.g. ```python, ```lua);
   the blue bar at the top displays the language name. */
.code-block {margin: 1em 0}
.code-block .code-lang {
	background: #0969da;
	color: #fff;
	padding: 4px 12px;
	font-size: 0.75em;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-weight: 500;
	text-transform: lowercase;
	border-radius: 6px 6px 0 0;
}
.code-block pre {
	margin-top: 0 !important;
	border-top-left-radius: 0 !important;
	border-top-right-radius: 0 !important;
}
.content .section-issue {
	font-size: 11px;
	font-weight: normal;
	color: #57606a;
	text-decoration: none;
	margin-left: 10px;
	vertical-align: middle;
	padding: 2px 6px;
	border: 1px solid #d0d7de;
	border-radius: 3px;
	background: #f6f8fa;
	white-space: nowrap;
	cursor: pointer;
}
.content .section-issue:hover {
	background: #eaeef2;
	color: #0969da;
}
.quick-add-toggle {display: none}
.quick-add-toggle:not(:checked) + .quick-add-form {display: none}
.quick-add-form {
	margin: 12px 0 20px;
	padding: 12px 14px;
	border: 1px solid #d0d7de;
	border-radius: 6px;
	background: #f6f8fa;
}
.quick-add-form form {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 0;
}
.quick-add-form input[type="text"] {
	font-size: 14px;
	padding: 6px 8px;
	border: 1px solid #d0d7de;
	border-radius: 4px;
	font-family: inherit;
}
.quick-add-form textarea {
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 13px;
	padding: 8px 10px;
	border: 1px solid #d0d7de;
	border-radius: 4px;
	resize: vertical;
	min-height: 120px;
	box-sizing: border-box;
	width: 100%;
}
.quick-add-actions {
	display: flex;
	gap: 10px;
	align-items: center;
}
.quick-add-form button {
	font-size: 13px;
	padding: 6px 14px;
	border: 1px solid #1f883d;
	border-radius: 4px;
	background: #1f883d;
	color: #fff;
	cursor: pointer;
	font-family: inherit;
}
.quick-add-form button:hover {background: #1a7f37}
.quick-add-cancel {
	font-size: 12px;
	color: #57606a;
	cursor: pointer;
	padding: 4px 8px;
}
.quick-add-cancel:hover {color: #cf222e}
.quick-add-status {
	margin-top: 8px;
	padding: 8px 10px;
	border-radius: 4px;
	font-size: 13px;
}
.quick-add-status.pending {
	background: #fff8c5;
	border: 1px solid #d4a72c;
	color: #4d2d00;
}
.quick-add-status.success {
	background: #dafbe1;
	border: 1px solid #1f883d;
	color: #0a3622;
}
.quick-add-status.success a {color: #0969da}
.quick-add-status.failure {
	background: #ffebe9;
	border: 1px solid #cf222e;
	color: #5a1a1f;
}
.edit-toggle {display: none}
.edit-toggle:not(:checked) + .edit-form {display: none}
.edit-form {
	margin: 12px 0 20px;
	padding: 12px 14px;
	border: 1px solid #d0d7de;
	border-radius: 6px;
	background: #f6f8fa;
}
.edit-form form {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 0;
}
.edit-form textarea {
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 13px;
	padding: 8px 10px;
	border: 1px solid #d0d7de;
	border-radius: 4px;
	resize: vertical;
	min-height: 240px;
	box-sizing: border-box;
	width: 100%;
	line-height: 1.45;
}
.edit-actions {
	display: flex;
	gap: 10px;
	align-items: center;
}
.edit-form button {
	font-size: 13px;
	padding: 6px 14px;
	border: 1px solid #5319e7;
	border-radius: 4px;
	background: #5319e7;
	color: #fff;
	cursor: pointer;
	font-family: inherit;
}
.edit-form button:hover {background: #3f0fb8}
.edit-cancel {
	font-size: 12px;
	color: #57606a;
	cursor: pointer;
	padding: 4px 8px;
}
.edit-cancel:hover {color: #cf222e}
.edit-status {
	margin-top: 8px;
	padding: 8px 10px;
	border-radius: 4px;
	font-size: 13px;
}
.edit-status.pending {
	background: #fff8c5;
	border: 1px solid #d4a72c;
	color: #4d2d00;
}
.edit-status.success {
	background: #dafbe1;
	border: 1px solid #1f883d;
	color: #0a3622;
}
.edit-status.success a {color: #0969da}
.edit-status.failure {
	background: #ffebe9;
	border: 1px solid #cf222e;
	color: #5a1a1f;
}
.breadcrumb {
	font-size: 13px;
	color: #57606a;
	margin-bottom: 8px;
	padding-bottom: 6px;
	border-bottom: 1px dashed #e1e4e8;
}
.breadcrumb a {
	color: #0969da;
	text-decoration: none;
}
.breadcrumb a:hover {text-decoration: underline}
.breadcrumb .sep {
	margin: 0 6px;
	color: #8c959f;
}
.breadcrumb .current {
	color: #222;
	font-weight: 500;
}
.content .breadcrumb + h1 {margin-top: 0}
ul.toc, ul.toc ul {
	list-style: none;
	padding-left: 0;
}
ul.toc ul {padding-left: 1.4em}
ul.toc li {padding: 1px 0}
ul.toc label.toc {
	display: inline-block;
	width: 1em;
	text-align: center;
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	color: #57606a;
	user-select: none;
	text-decoration: none;
}
ul.toc label.toc[for] {
	color: #0969da;
	cursor: pointer;
}
ul.toc label.toc[for]:hover {color: #0550ae}
ul.toc .show-nested {display: none}
ul.toc .show-nested:not(:checked) ~ ul {display: none}
ul.toc .show-nested + label.toc::before {content: "\2295"}
ul.toc .show-nested:checked + label.toc::before {content: "\2296"}
.vibecode {
	background: #1f2328;
	color: #fff;
	border-radius: 6px;
	margin: 1em 0;
	overflow: hidden;
}
.vibecode > summary {
	cursor: pointer;
	padding: 8px 14px;
	font-size: 12px;
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	color: #fff;
	user-select: none;
	list-style: none;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}
.vibecode > summary::-webkit-details-marker {display: none}
.vibecode > summary::before {
	content: "▸ ";
	display: inline-block;
	transition: transform 0.1s;
}
.vibecode[open] > summary::before {content: "▾ "}
.vibecode > summary:hover {background: #2a2f37}
.vibecode[open] > summary {border-bottom: 1px solid #444c56}
.vibecode pre {
	margin: 0;
	padding: 12px 16px;
	background: transparent !important;
	color: #fff;
	overflow-x: auto;
	font-size: 0.9rem;
	line-height: 1.5;
}
.vibecode pre code {
	background: transparent !important;
	color: inherit;
	padding: 0;
	font-size: inherit;
}
.vibecode .vibecode-code {background: transparent !important}
.vibecode .vibecode-code pre {background: transparent !important}

/* === Open-issues panel === */
.issues-panel {
	margin: 16px 0;
	border: 1px solid #d0d7de;
	border-radius: 6px;
	background: #f6f8fa;
}
.issues-panel > summary {
	padding: 8px 14px;
	cursor: pointer;
	user-select: none;
	font-weight: 600;
	color: #57606a;
	font-size: 0.9em;
	list-style: none;
}
.issues-panel > summary::-webkit-details-marker {display: none}
.issues-panel > summary::before {
	content: "▸ ";
	display: inline-block;
	width: 1em;
}
.issues-panel[open] > summary::before {content: "▾ "}
.issues-panel > summary:hover {background: #eaeef2}
.issues-panel[open] > summary {border-bottom: 1px solid #d0d7de}
.issues-list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.issue-item {
	padding: 12px 14px;
	border-bottom: 1px solid #eaeef2;
}
.issue-item:last-child {border-bottom: 0}
.issue-head {
	margin-bottom: 6px;
	font-size: 0.9em;
}
.issue-number {
	color: #0969da;
	text-decoration: none;
	font-weight: 600;
}
.issue-number:hover {text-decoration: underline}
.issue-section {color: #57606a}
.issue-close {
	margin-left: 6px;
	padding: 1px 8px;
	font-size: 0.85em;
	border: 1px solid #d0d7de;
	background: #fff;
	color: #57606a;
	border-radius: 4px;
	cursor: pointer;
}
.issue-close:hover {
	background: #fff5f5;
	color: #cf222e;
	border-color: #cf222e;
}
.issue-close:disabled {
	opacity: 0.6;
	cursor: wait;
}
.issue-body {
	font-size: 0.92em;
	color: #333;
}
.issue-body > :first-child {margin-top: 0}
.issue-body > :last-child {margin-bottom: 0}
.issue-body p {margin: 0.4em 0}
.issue-body pre {background: #fff}
.issue-body code {background: #fff}
.issue-comments {
	list-style: none;
	margin: 10px 0 0 0;
	padding: 0 0 0 16px;
	border-left: 2px solid #d0d7de;
}
.issue-comment {padding: 8px 0 8px 10px}
.issue-comment + .issue-comment {border-top: 1px solid #eaeef2}
.comment-head {
	font-size: 0.82em;
	color: #57606a;
	margin-bottom: 4px;
}
.comment-author {
	font-weight: 600;
	color: #24292f;
}
.comment-date {color: #8b949e}
.comment-body {
	font-size: 0.9em;
	color: #333;
}
.comment-body > :first-child {margin-top: 0}
.comment-body > :last-child {margin-bottom: 0}
.comment-body p {margin: 0.35em 0}
.comment-body pre {background: #fff}
.comment-body code {background: #fff}

/* === Pygments (default light, code blocks) === */
pre { line-height: 125%; }
td.linenos .normal { color: inherit; background-color: transparent; padding-left: 5px; padding-right: 5px; }
span.linenos { color: inherit; background-color: transparent; padding-left: 5px; padding-right: 5px; }
td.linenos .special { color: #000000; background-color: #ffffc0; padding-left: 5px; padding-right: 5px; }
span.linenos.special { color: #000000; background-color: #ffffc0; padding-left: 5px; padding-right: 5px; }
.highlight .hll { background-color: #ffffcc }
.highlight { background: #f8f8f8; }
.highlight .c { color: #3D7B7B; font-style: italic } /* Comment */
.highlight .err { border: 1px solid #FF0000 } /* Error */
.highlight .k { color: #008000; font-weight: bold } /* Keyword */
.highlight .o { color: #666666 } /* Operator */
.highlight .ch { color: #3D7B7B; font-style: italic } /* Comment.Hashbang */
.highlight .cm { color: #3D7B7B; font-style: italic } /* Comment.Multiline */
.highlight .cp { color: #9C6500 } /* Comment.Preproc */
.highlight .cpf { color: #3D7B7B; font-style: italic } /* Comment.PreprocFile */
.highlight .c1 { color: #3D7B7B; font-style: italic } /* Comment.Single */
.highlight .cs { color: #3D7B7B; font-style: italic } /* Comment.Special */
.highlight .gd { color: #A00000 } /* Generic.Deleted */
.highlight .ge { font-style: italic } /* Generic.Emph */
.highlight .ges { font-weight: bold; font-style: italic } /* Generic.EmphStrong */
.highlight .gr { color: #E40000 } /* Generic.Error */
.highlight .gh { color: #000080; font-weight: bold } /* Generic.Heading */
.highlight .gi { color: #008400 } /* Generic.Inserted */
.highlight .go { color: #717171 } /* Generic.Output */
.highlight .gp { color: #000080; font-weight: bold } /* Generic.Prompt */
.highlight .gs { font-weight: bold } /* Generic.Strong */
.highlight .gu { color: #800080; font-weight: bold } /* Generic.Subheading */
.highlight .gt { color: #0044DD } /* Generic.Traceback */
.highlight .kc { color: #008000; font-weight: bold } /* Keyword.Constant */
.highlight .kd { color: #008000; font-weight: bold } /* Keyword.Declaration */
.highlight .kn { color: #008000; font-weight: bold } /* Keyword.Namespace */
.highlight .kp { color: #008000 } /* Keyword.Pseudo */
.highlight .kr { color: #008000; font-weight: bold } /* Keyword.Reserved */
.highlight .kt { color: #B00040 } /* Keyword.Type */
.highlight .m { color: #666666 } /* Literal.Number */
.highlight .s { color: #BA2121 } /* Literal.String */
.highlight .na { color: #687822 } /* Name.Attribute */
.highlight .nb { color: #008000 } /* Name.Builtin */
.highlight .nc { color: #0000FF; font-weight: bold } /* Name.Class */
.highlight .no { color: #880000 } /* Name.Constant */
.highlight .nd { color: #AA22FF } /* Name.Decorator */
.highlight .ni { color: #717171; font-weight: bold } /* Name.Entity */
.highlight .ne { color: #CB3F38; font-weight: bold } /* Name.Exception */
.highlight .nf { color: #0000FF } /* Name.Function */
.highlight .nl { color: #767600 } /* Name.Label */
.highlight .nn { color: #0000FF; font-weight: bold } /* Name.Namespace */
.highlight .nt { color: #008000; font-weight: bold } /* Name.Tag */
.highlight .nv { color: #19177C } /* Name.Variable */
.highlight .ow { color: #AA22FF; font-weight: bold } /* Operator.Word */
.highlight .w { color: #bbbbbb } /* Text.Whitespace */
.highlight .mb { color: #666666 } /* Literal.Number.Bin */
.highlight .mf { color: #666666 } /* Literal.Number.Float */
.highlight .mh { color: #666666 } /* Literal.Number.Hex */
.highlight .mi { color: #666666 } /* Literal.Number.Integer */
.highlight .mo { color: #666666 } /* Literal.Number.Oct */
.highlight .sa { color: #BA2121 } /* Literal.String.Affix */
.highlight .sb { color: #BA2121 } /* Literal.String.Backtick */
.highlight .sc { color: #BA2121 } /* Literal.String.Char */
.highlight .dl { color: #BA2121 } /* Literal.String.Delimiter */
.highlight .sd { color: #BA2121; font-style: italic } /* Literal.String.Doc */
.highlight .s2 { color: #BA2121 } /* Literal.String.Double */
.highlight .se { color: #AA5D1F; font-weight: bold } /* Literal.String.Escape */
.highlight .sh { color: #BA2121 } /* Literal.String.Heredoc */
.highlight .si { color: #A45A77; font-weight: bold } /* Literal.String.Interpol */
.highlight .sx { color: #008000 } /* Literal.String.Other */
.highlight .sr { color: #A45A77 } /* Literal.String.Regex */
.highlight .s1 { color: #BA2121 } /* Literal.String.Single */
.highlight .ss { color: #19177C } /* Literal.String.Symbol */
.highlight .bp { color: #008000 } /* Name.Builtin.Pseudo */
.highlight .fm { color: #0000FF } /* Name.Function.Magic */
.highlight .vc { color: #19177C } /* Name.Variable.Class */
.highlight .vg { color: #19177C } /* Name.Variable.Global */
.highlight .vi { color: #19177C } /* Name.Variable.Instance */
.highlight .vm { color: #19177C } /* Name.Variable.Magic */
.highlight .il { color: #666666 } /* Literal.Number.Integer.Long */

/* === Pygments (monokai dark, vibecode blocks) === */
pre { line-height: 125%; }
td.linenos .normal { color: inherit; background-color: transparent; padding-left: 5px; padding-right: 5px; }
span.linenos { color: inherit; background-color: transparent; padding-left: 5px; padding-right: 5px; }
td.linenos .special { color: #000000; background-color: #ffffc0; padding-left: 5px; padding-right: 5px; }
span.linenos.special { color: #000000; background-color: #ffffc0; padding-left: 5px; padding-right: 5px; }
.vibecode-code .hll { background-color: #49483e }
.vibecode-code { background: #272822; color: #f8f8f2 }
.vibecode-code .c { color: #959077 } /* Comment */
.vibecode-code .err { color: #ed007e; background-color: #1e0010 } /* Error */
.vibecode-code .esc { color: #f8f8f2 } /* Escape */
.vibecode-code .g { color: #f8f8f2 } /* Generic */
.vibecode-code .k { color: #66d9ef } /* Keyword */
.vibecode-code .l { color: #ae81ff } /* Literal */
.vibecode-code .n { color: #f8f8f2 } /* Name */
.vibecode-code .o { color: #ff4689 } /* Operator */
.vibecode-code .x { color: #f8f8f2 } /* Other */
.vibecode-code .p { color: #f8f8f2 } /* Punctuation */
.vibecode-code .ch { color: #959077 } /* Comment.Hashbang */
.vibecode-code .cm { color: #959077 } /* Comment.Multiline */
.vibecode-code .cp { color: #959077 } /* Comment.Preproc */
.vibecode-code .cpf { color: #959077 } /* Comment.PreprocFile */
.vibecode-code .c1 { color: #959077 } /* Comment.Single */
.vibecode-code .cs { color: #959077 } /* Comment.Special */
.vibecode-code .gd { color: #ff4689 } /* Generic.Deleted */
.vibecode-code .ge { color: #f8f8f2; font-style: italic } /* Generic.Emph */
.vibecode-code .ges { color: #f8f8f2; font-weight: bold; font-style: italic } /* Generic.EmphStrong */
.vibecode-code .gr { color: #f8f8f2 } /* Generic.Error */
.vibecode-code .gh { color: #f8f8f2 } /* Generic.Heading */
.vibecode-code .gi { color: #a6e22e } /* Generic.Inserted */
.vibecode-code .go { color: #66d9ef } /* Generic.Output */
.vibecode-code .gp { color: #ff4689; font-weight: bold } /* Generic.Prompt */
.vibecode-code .gs { color: #f8f8f2; font-weight: bold } /* Generic.Strong */
.vibecode-code .gu { color: #959077 } /* Generic.Subheading */
.vibecode-code .gt { color: #f8f8f2 } /* Generic.Traceback */
.vibecode-code .kc { color: #66d9ef } /* Keyword.Constant */
.vibecode-code .kd { color: #66d9ef } /* Keyword.Declaration */
.vibecode-code .kn { color: #ff4689 } /* Keyword.Namespace */
.vibecode-code .kp { color: #66d9ef } /* Keyword.Pseudo */
.vibecode-code .kr { color: #66d9ef } /* Keyword.Reserved */
.vibecode-code .kt { color: #66d9ef } /* Keyword.Type */
.vibecode-code .ld { color: #e6db74 } /* Literal.Date */
.vibecode-code .m { color: #ae81ff } /* Literal.Number */
.vibecode-code .s { color: #e6db74 } /* Literal.String */
.vibecode-code .na { color: #a6e22e } /* Name.Attribute */
.vibecode-code .nb { color: #f8f8f2 } /* Name.Builtin */
.vibecode-code .nc { color: #a6e22e } /* Name.Class */
.vibecode-code .no { color: #66d9ef } /* Name.Constant */
.vibecode-code .nd { color: #a6e22e } /* Name.Decorator */
.vibecode-code .ni { color: #f8f8f2 } /* Name.Entity */
.vibecode-code .ne { color: #a6e22e } /* Name.Exception */
.vibecode-code .nf { color: #a6e22e } /* Name.Function */
.vibecode-code .nl { color: #f8f8f2 } /* Name.Label */
.vibecode-code .nn { color: #f8f8f2 } /* Name.Namespace */
.vibecode-code .nx { color: #a6e22e } /* Name.Other */
.vibecode-code .py { color: #f8f8f2 } /* Name.Property */
.vibecode-code .nt { color: #ff4689 } /* Name.Tag */
.vibecode-code .nv { color: #f8f8f2 } /* Name.Variable */
.vibecode-code .ow { color: #ff4689 } /* Operator.Word */
.vibecode-code .pm { color: #f8f8f2 } /* Punctuation.Marker */
.vibecode-code .w { color: #f8f8f2 } /* Text.Whitespace */
.vibecode-code .mb { color: #ae81ff } /* Literal.Number.Bin */
.vibecode-code .mf { color: #ae81ff } /* Literal.Number.Float */
.vibecode-code .mh { color: #ae81ff } /* Literal.Number.Hex */
.vibecode-code .mi { color: #ae81ff } /* Literal.Number.Integer */
.vibecode-code .mo { color: #ae81ff } /* Literal.Number.Oct */
.vibecode-code .sa { color: #e6db74 } /* Literal.String.Affix */
.vibecode-code .sb { color: #e6db74 } /* Literal.String.Backtick */
.vibecode-code .sc { color: #e6db74 } /* Literal.String.Char */
.vibecode-code .dl { color: #e6db74 } /* Literal.String.Delimiter */
.vibecode-code .sd { color: #e6db74 } /* Literal.String.Doc */
.vibecode-code .s2 { color: #e6db74 } /* Literal.String.Double */
.vibecode-code .se { color: #ae81ff } /* Literal.String.Escape */
.vibecode-code .sh { color: #e6db74 } /* Literal.String.Heredoc */
.vibecode-code .si { color: #e6db74 } /* Literal.String.Interpol */
.vibecode-code .sx { color: #e6db74 } /* Literal.String.Other */
.vibecode-code .sr { color: #e6db74 } /* Literal.String.Regex */
.vibecode-code .s1 { color: #e6db74 } /* Literal.String.Single */
.vibecode-code .ss { color: #e6db74 } /* Literal.String.Symbol */
.vibecode-code .bp { color: #f8f8f2 } /* Name.Builtin.Pseudo */
.vibecode-code .fm { color: #a6e22e } /* Name.Function.Magic */
.vibecode-code .vc { color: #f8f8f2 } /* Name.Variable.Class */
.vibecode-code .vg { color: #f8f8f2 } /* Name.Variable.Global */
.vibecode-code .vi { color: #f8f8f2 } /* Name.Variable.Instance */
.vibecode-code .vm { color: #f8f8f2 } /* Name.Variable.Magic */
.vibecode-code .il { color: #ae81ff } /* Literal.Number.Integer.Long */

/* ─── Copy-code button ─────────────────────────────────────────────── */
/* Set up by copy-code.js: wraps a <pre> in a positioning container and
   places an <a.copy> button in the upper-right corner. */

.code-with-copy {
    position: relative;
}

.code-with-copy a.copy {
    position: absolute;
    top: 6px;
    right: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    color: #6b7280;
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid #d1d5db;
    border-radius: 4px;
    cursor: pointer;
    text-decoration: none;
    opacity: 0.55;
    transition: opacity 0.15s, color 0.15s, border-color 0.15s, background 0.15s;
}

.code-with-copy:hover a.copy {
    opacity: 1;
}

.code-with-copy a.copy:hover,
.code-with-copy a.copy:focus {
    color: #111827;
    border-color: #9ca3af;
    outline: none;
}

.code-with-copy a.copy.copied {
    color: #047857;
    border-color: #6ee7b7;
    background: #ecfdf5;
}

/* ===== /issues page (orlando.issues_page) ===== */

.issues-page {max-width: 920px; margin: 0 auto; padding: 0 8px}
.issues-summary {color: #57606a; font-size: 14px; margin: 8px 0 20px}

/* Each issue is a card. */
.issue-panel {
    background: #ffffff;
    border: 1px solid #d8dee4;
    border-radius: 6px;
    padding: 14px 18px;
    margin: 0 0 14px;
    box-shadow: 0 1px 2px rgba(27, 31, 36, 0.04);
}
.issue-panel:hover {
    border-color: #0969da;
    box-shadow: 0 1px 4px rgba(9, 105, 218, 0.12);
}

/* Header row: number badge + title. */
.issue-panel-head {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 6px;
}
.issue-num-badge {
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    font-size: 13px;
    font-weight: 600;
    color: #0969da;
    background: #ddf4ff;
    padding: 2px 8px;
    border: none;
    border-radius: 4px;
    text-decoration: none;
    flex-shrink: 0;
    cursor: pointer;
    line-height: inherit;
}
.issue-num-badge:hover {
    background: #0969da;
    color: #ffffff;
}
.issue-num-badge.copied {
    background: #1f883d;
    color: #ffffff;
}
.issue-num-badge.copy-failed {
    background: #cf222e;
    color: #ffffff;
}
.issue-panel-title {
    font-size: 15px;
    font-weight: 500;
    color: #1f2328;
    margin: 0;
    line-height: 1.4;
    word-wrap: break-word;
    overflow-wrap: break-word;
    min-width: 0;
}

/* Doc-path chip (only when the issue title starts with "File: <path>"). */
.issue-panel-doc {font-size: 12px; margin: 4px 0 8px; color: #57606a}
/* Section chip on the top-of-page panel (issue's heading) */
.issue-panel-section {font-size: 12px; margin: 4px 0 8px; color: #57606a; font-style: italic}
.issue-doc-chip {
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    font-size: 11.5px;
    color: #57606a;
    background: #f6f8fa;
    padding: 2px 6px;
    border-radius: 3px;
    text-decoration: none;
    border: 1px solid #eaeef2;
}
.issue-doc-chip:hover {color: #0969da; border-color: #0969da}

/* Body preview. */
.issue-panel-body {
    font-size: 13.5px;
    color: #393f46;
    line-height: 1.5;
    margin: 8px 0;
}

/* Footer row: comment count (left) + GitHub link (right). */
.issue-panel-foot {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 10px;
    font-size: 12px;
    color: #8b949e;
}
.issue-panel-github {color: #57606a; text-decoration: none; margin-left: auto}
.issue-panel-github:hover {color: #0969da}

/* Close button on /issues panels (IP-gated; only rendered for allowed IPs).
   Sits to the left of the GitHub link in the footer. Subdued by default,
   red on hover to signal "destructive action." */
.issue-panel-close {
    font-size: 12px;
    padding: 2px 10px;
    border: 1px solid #d8dee4;
    border-radius: 4px;
    background: #ffffff;
    color: #57606a;
    cursor: pointer;
    margin-left: auto;
}
.issue-panel-close:hover {
    background: #cf222e;
    color: #ffffff;
    border-color: #cf222e;
}
.issue-panel-close:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}
/* When the close button is present, GitHub link gets a small left margin
   instead of margin-left: auto (the close button already takes that). */
.issue-panel-close + .issue-panel-github {margin-left: 10px}

/* Comment-add form on /issues (allowed IPs only). */
.issue-comment-add {
    margin-top: 12px;
    border-top: 1px dashed #eaeef2;
    padding-top: 10px;
}
.issue-comment-add summary {
    font-size: 12px;
    color: #57606a;
    cursor: pointer;
    list-style: none;
    user-select: none;
}
.issue-comment-add summary::-webkit-details-marker {display: none}
.issue-comment-add summary:hover {color: #0969da}
.issue-comment-add[open] summary {color: #1f2328; font-weight: 500}
.issue-comment-form {margin-top: 8px}
.issue-comment-form textarea {
    width: 100%;
    box-sizing: border-box;
    font-family: inherit;
    font-size: 13px;
    padding: 8px 10px;
    border: 1px solid #d8dee4;
    border-radius: 4px;
    resize: vertical;
    min-height: 60px;
}
.issue-comment-form textarea:focus {
    outline: none;
    border-color: #0969da;
    box-shadow: 0 0 0 2px rgba(9, 105, 218, 0.2);
}
.issue-comment-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 6px;
}
.issue-comment-form button[type=submit] {
    font-size: 12px;
    padding: 4px 12px;
    border: 1px solid #d8dee4;
    border-radius: 4px;
    background: #f6f8fa;
    color: #1f2328;
    cursor: pointer;
}
.issue-comment-form button[type=submit]:hover {
    background: #0969da;
    color: #ffffff;
    border-color: #0969da;
}
.issue-comment-form button[type=submit]:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}
.issue-comment-status {
    font-size: 12px;
    color: #57606a;
}
.issue-comment-status.ok {color: #1f883d}
.issue-comment-status.err {color: #cf222e}