@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('/static/fonts/inter.woff2') format('woff2');
}
@font-face {
  font-family: Inter;
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url('/static/fonts/inter-italic.woff2') format('woff2');
}

:root {
	--bs-font-sans-serif: "Inter", sans-serif;
	--bs-nav-link-color: var(--bs-primary);
	--bs-link-color-rgb: var(--bs-primary-rgb);
	--bs-border-radius: .25rem;
}

[data-bs-theme=light] {
	--bs-primary: #d96600;
	--bs-primary-rgb: 217, 102, 0;
	--bs-primary-bg-subtle: color-mix(in srgb, var(--bs-primary) 20%, var(--bs-body-bg));
	--bs-link-hover-color: color-mix(in srgb, var(--bs-primary) 80%, white);
	--bs-danger: #dc3545;
	--bs-danger-bg-subtle: #f8e6e8;
	--bs-link-color: var(--bs-primary);
	--bs-link-hover-color: color-mix(in srgb, var(--bs-primary) 80%, black);
	--bs-basic-btn-base: color-mix(in srgb, var(--bs-primary-bg-subtle) 70%, var(--bs-body-bg));
	--bs-basic-btn-hover-bg: color-mix(in srgb, var(--bs-basic-btn-base) 98%, black);
	--bs-basic-btn-hover-bg-strong: color-mix(in srgb, var(--bs-basic-btn-base) 92%, black);
	--bs-basic-btn-active-bg: color-mix(in srgb, var(--bs-basic-btn-base) 90%, black);
	--bs-basic-btn-active-bg-strong: color-mix(in srgb, var(--bs-basic-btn-base) 87%, black);
	--bs-border-color: var(--bs-basic-btn-active-bg-strong);
	--bs-primary-text-emphasis: color-mix(in srgb, var(--bs-primary), black);
	--bs-secondary-bg: color-mix(in srgb, var(--bs-primary-bg-subtle) 95%, black);
}

[data-bs-theme=dark] {
	--bs-body-bg: #111;
	--bs-body-bg-rgb: 17, 17, 17;
	--bs-primary: #ff7800;
	--bs-primary-rgb: 234, 118, 16;
	--bs-primary-bg-subtle: color-mix(in srgb, var(--bs-primary) 20%, var(--bs-body-bg));
	--bs-danger: #e06672;
	--bs-danger-rgb: 224, 102, 114;
	--bs-danger-bg-subtle: #2c0b0e;
	--bs-link-color: var(--bs-primary);
	--bs-link-color-rgb: var(--bs-primary-rgb);
	--bs-link-hover-color: color-mix(in srgb, rgb(var(--bs-primary-rgb)) 80%, white);
	--bs-basic-btn-base: color-mix(in srgb, var(--bs-primary-bg-subtle) 80%, var(--bs-body-bg));
	--bs-basic-btn-hover-bg: color-mix(in srgb, var(--bs-basic-btn-base) 90%, var(--bs-body-bg));
	--bs-basic-btn-hover-bg-strong: color-mix(in srgb, var(--bs-basic-btn-base) 97%, white);
	--bs-basic-btn-active-bg: color-mix(in srgb, var(--bs-basic-btn-base) 97%, white);
	--bs-basic-btn-active-bg-strong: color-mix(in srgb, var(--bs-basic-btn-base) 93%, white);
	--bs-border-color: var(--bs-basic-btn-active-bg-strong);
	--bs-primary-text-emphasis: color-mix(in srgb, var(--bs-primary), white);
	--bs-secondary-bg: var(--bs-primary-bg-subtle);
}

[data-bs-theme=light] .light-invert,
[data-bs-theme=dark] .dark-invert {
	filter: invert();
}

.btn {
	--bs-btn-disabled-opacity: .4;
}

.btn-check:checked + .btn-secondary, .btn-check:checked + .btn-outline-secondary {
	--bs-btn-active-bg: var(--bs-basic-btn-active-bg-strong) !important;
	--bs-btn-active-color: var(--bs-body-color);
	background-color: var(--bs-btn-active-bg) !important;
}
.btn-outline-secondary {
	--bs-btn-color: var(--bs-body-color);
	--bs-btn-border-color: var(--bs-basic-btn-active-bg-strong);
}

[data-bs-theme=dark] .btn-secondary {
	--bs-btn-color: var(--bs-body-color);
	--bs-btn-border-color: var(--bs-basic-btn-hover-bg);
}

[data-bs-theme=light] .btn-secondary {
	--bs-btn-color: var(--bs-body-color);
	--bs-btn-border-color: var(--bs-basic-btn-hover-bg);
}

[data-bs-theme=light] .bg-secondary {
	background-color: color-mix(in srgb, var(--bs-secondary-bg) 30%, var(--bs-body-bg)) !important;
}

[data-bs-theme=dark] .bg-secondary {
	background-color: color-mix(in srgb, var(--bs-secondary-bg) 60%, var(--bs-body-bg)) !important;
}

.btn-outline-danger {
	--bs-btn-color: var(--bs-danger);
	--bs-btn-border-color: var(--bs-danger);
}
[data-bs-theme=dark] .btn-danger {
	--bs-btn-border-color: var(--bs-danger-border-subtle);
	--bs-btn-bg: var(--bs-danger-border-subtle);
	--bs-btn-hover-bg: color-mix(in srgb, var(--bs-danger-border-subtle) 80%, var(--bs-body-bg));
	--bs-btn-hover-border-color: color-mix(in srgb, var(--bs-danger-border-subtle) 80%, var(--bs-body-bg));
	--bs-btn-active-bg: color-mix(in srgb, var(--bs-danger-border-subtle) 70%, var(--bs-body-bg));
	--bs-btn-active-border-color: color-mix(in srgb, var(--bs-danger-border-subtle) 70%, var(--bs-body-bg));
}

.navbar-toggler-icon {
	--bs-navbar-toggler-icon-bg: none !important;
}

[aria-expanded="true"] .navbar-toggler-icon::before {
	content: "\E4F6";
}

.navbar-toggler-icon::before {
  display: inline-block;
  /*height: 1.1em;*/
  /*vertical-align: middle;*/
  content: "\E2F0";
  font-family: Phosphor;
  font-size: 24px;
}

.btn {
	--bs-btn-border-radius: .25rem;
}
.btn.disabled, .btn:disabled, fieldset:disabled .btn {
	background-color: var(--bs-btn-disabled-bg);
}

.btn .ph {
	font-size: 20px;
	margin: -.1rem;
	vertical-align: -.15rem;
}

.btn:has(.ph) {
	/*line-height: 1.2;*/
}

[data-bs-theme=light] .btn-primary {
	--bs-btn-bg: color-mix(in srgb, var(--bs-primary) 90%, black);
	--bs-btn-border-color: var(--bs-btn-bg);
	--bs-btn-hover-bg: color-mix(in srgb, var(--bs-btn-bg) 90%, black);
	--bs-btn-hover-border-color: var(--bs-btn-hover-bg);
	--bs-btn-active-bg: color-mix(in srgb, var(--bs-btn-bg) 80%, black);
	--bs-btn-active-border-color: var(--bs-btn-active-bg);
	--bs-btn-disabled-bg: color-mix(in srgb, var(--bs-primary) 70%, white);
}

[data-bs-theme=dark] .btn-primary {
	--bs-btn-bg: color-mix(in srgb, var(--bs-primary) 65%, black);
	--bs-btn-border-color: var(--bs-btn-bg);
	--bs-btn-hover-bg: color-mix(in srgb, var(--bs-btn-bg) 90%, black);
	--bs-btn-hover-border-color: var(--bs-btn-hover-bg);
	--bs-btn-active-bg: color-mix(in srgb, var(--bs-btn-bg) 80%, black);
	--bs-btn-active-border-color: var(--bs-btn-active-bg);
	--bs-btn-disabled-bg: color-mix(in srgb, var(--bs-primary) 70%, black);
}

.btn.btn-primary {
	font-weight: 600;
	border: none;
	background-image: var(--bs-gradient);
	padding: 7px 13px;
	box-shadow: rgba(255, 255, 255, .4) 0 1px 0 inset;
	transition: all .2s, box-shadow .1s;
}

[data-bs-theme=dark] .btn.btn-primary:active {
	box-shadow: var(--bs-primary-bg-subtle) 0 3px 7px inset;
}

[data-bs-theme=light] .btn.btn-primary:active {
	box-shadow: var(--bs-primary-text-emphasis) 0 3px 7px inset;
}

.btn-outline-secondary {
	--bs-btn-hover-border-color: var(--bs-basic-btn-hover-bg);
	--bs-btn-hover-bg: var(--bs-basic-btn-hover-bg);
	--bs-btn-active-bg: var(--bs-basic-btn-active-bg);
	--bs-btn-hover-color: var(--bs-body-color);
	--bs-btn-active-color: var(--bs-body-color);
}

[data-bs-theme=dark] .btn-secondary {
	--bs-btn-bg: var(--bs-basic-btn-hover-bg);
	--bs-btn-hover-border-color: var(--bs-basic-btn-hover-bg-strong);
	--bs-btn-hover-bg: var(--bs-basic-btn-hover-bg-strong);
	--bs-btn-active-bg: var(--bs-basic-btn-active-bg-strong);
	--bs-btn-hover-color: var(--bs-body-color);
	--bs-btn-active-color: var(--bs-body-color);
}

[data-bs-theme=light] .btn-secondary {
	--bs-btn-bg: var(--bs-basic-btn-hover-bg);
	--bs-btn-hover-border-color: var(--bs-basic-btn-hover-bg-strong);
	--bs-btn-hover-bg: var(--bs-basic-btn-hover-bg-strong);
	--bs-btn-active-bg: var(--bs-basic-btn-active-bg-strong);
	--bs-btn-hover-color: var(--bs-body-color);
	--bs-btn-active-color: var(--bs-body-color);
}

.btn.btn-basic {
  font-weight: 500;
  --bs-btn-active-bg: var(--bs-basic-btn-hover-bg);
}

.btn.btn-basic:not(.bg-secondary .btn-basic, .bg-primary-subtle .btn-basic) {
	color: color-mix(in srgb, rgba(var(--bs-primary-rgb), 1) 70%, var(--bs-body-color)) !important;
}

.btn-basic:hover, .btn-basic:focus {
	background-color: var(--bs-basic-btn-hover-bg);
}
.btn-basic:active {
	background-color: var(--bs-basic-btn-active-bg) !important;
}
.bg-secondary .btn-basic:hover, .bg-secondary .btn-basic:focus {
	background-color: var(--bs-basic-btn-hover-bg-strong) !important;
	color: var(--bs-body-color) !important;
}
.bg-secondary .btn-basic:active {
	background-color: var(--bs-basic-btn-active-bg-strong) !important;
}
.btn-check:checked + .btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check) + .btn:active {
	border-color: transparent;
}

/*.nav-underline .nav-link:not(.active):hover {
	color: var(--bs-nav-link-color);
}*/

/* [data-bs-theme=dark] .nav-link, [data-bs-theme=dark] a { */
	/* color: var(--bs-link-color); */
/* } */

a:hover {
	color: var(--bs-link-hover-color);
	--bs-link-color-rgb: unset;
}

[data-bs-theme=light] .dropdown-item:hover, [data-bs-theme=light] .dropdown-item:focus {
	--bs-dropdown-link-hover-bg: color-mix(in srgb, var(--bs-primary) 10%, transparent);
	--bs-dropdown-link-hover-color: color-mix(in srgb, var(--bs-primary) 80%, black);
}

[data-bs-theme=dark] .dropdown-item:hover, [data-bs-theme=dark] .dropdown-item:focus {
	--bs-dropdown-link-hover-bg: color-mix(in srgb, var(--bs-primary) 10%, transparent);
	--bs-dropdown-link-hover-color: color-mix(in srgb, var(--bs-primary) 60%, white);
}

[data-bs-theme=dark] .dropdown-item.active, [data-bs-theme=dark] .dropdown-item:active {
	background-color: color-mix(in srgb, var(--bs-primary) 70%, var(--bs-body-bg));
}

.dropdown-item.active, .dropdown-item:active {
	background-color: var(--bs-primary);
}

.dropdown-menu {
	padding: .5em;
	--bs-dropdown-header-padding-x: .6rem;
	--bs-dropdown-item-padding-x: .6rem;
}
.dropdown-toggle::after {
	content: '\E136';
	font-family: Phosphor;
	font-size: .75rem;
	color: var(--bs-body-color);
	font-weight: bold;
	vertical-align: unset;
	border-top: 0;
	border-right: 0;
	border-left: 0;
}
.dropdown-menu, .dropdown-item {
	border-radius: var(--bs-border-radius);
}
.dropdown-item {
	padding-left: .6em;
	padding-right: .6em;
	transition: .1s;
}

.dropdown-menu-active-check .dropdown-item.active::after {
	content: "\e182";
	font-family: Phosphor;
	margin-left: auto;
	padding-left: .25rem;
}

.bg-hover-danger.dropdown-item:hover {
	--bs-dropdown-link-hover-bg: var(--bs-danger-bg-subtle);
	--bs-dropdown-link-hover-color: var(--bs-danger);
}

.bg-hover-danger.dropdown-item.active, .bg-hover-danger.dropdown-item:active {
	--bs-dropdown-link-active-bg: var(--bs-danger);
	background-color: red !important;
	color: white !important;
	--bs-dropdown-link-active-color: white;
}

.form-control:focus, .form-check-input:focus, .form-range:focus::-moz-range-thumb,
.accordion-button:focus, .btn:focus-visible, .form-select:focus {
	box-shadow: 0 0 0 .25rem color-mix(in srgb, var(--bs-primary) 25%, transparent);
	border-color: color-mix(in srgb, var(--bs-primary) 80%, transparent);
	outline: 0;
}

.form-control.credential.is-invalid, .was-validated .form-control.credential:invalid,
.form-control.credential.is-valid, .was-validated .form-control.credential:valid {
	background-position: right calc(2.7em + .1875rem) center;
}

.form-control.is-valid:focus, .was-validated .form-control:valid:focus {
	box-shadow: 0 0 0 .25rem rgba(var(--bs-success-rgb),.35);
}

.list-group-item.active {
	--bs-list-group-active-bg: var(--bs-primary);
	--bs-list-group-active-border-color: var(--bs-primary);
}

.dropdown-menu {
	box-shadow: var(--bs-box-shadow);
}

.no-arrow.dropdown-toggle::after {
	border: none;
	display: none;
}

.markdown-content p {
	margin: 0;
}
.markdown-content ol {
	margin-bottom: 0;
}

.htmx-indicator {
	display: none;
}
.htmx-request .htmx-indicator,
.htmx-request.htmx-indicator {
	display: inline-block;
}

.form-check-input:checked {
	background-color: var(--bs-primary);
	border-color: var(--bs-primary);
}

.nav-underline .nav-link.active, .nav-underline .show > .nav-link {
	font-weight: 500;
}

.spinner-border-sm {
	--bs-spinner-border-width: .15em;
}
/* #dee2e6 */
[data-bs-theme="dark"] .accordion-button::after {
	--bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23dee2e6'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
	--bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23d7d8ea'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

#rules li:not(:first-child, :last-child) {
	margin: .5em 0;
}

#rules li::marker {
	font-weight: bold;
	font-size: 1.5em;
}

.collapse {
	transition: 0 !important;
}

.icon-link > .ph {
	height: revert;
}

th[aria-sort] {
  background-color: var(--bs-secondary-bg);
  border-radius: var(--bs-border-radius) var(--bs-border-radius) 0 0;
}

.clr-field button {
	background-image: none !important;
	border-radius: 0 var(--bs-border-radius) var(--bs-border-radius) 0;
}

.nav-pills {
	--bs-nav-link-padding-x: .6rem;
	--bs-nav-link-padding-y: .25rem;
	--bs-nav-pills-link-active-bg: var(--bs-basic-btn-active-bg-strong);
	--bs-nav-pills-link-active-color: var(--bs-dropdown-link-hover-color);
}

.nav-pills .nav-link:not(.active):hover {
	background-color: color-mix(in srgb, var(--bs-primary-bg-subtle) 80%, var(--bs-body-bg));
	/*color: var(--bs-link-color);*/
}

.text-bg-primary {
	background-color: var(--bs-primary) !important;
}

.emoji {
	transition: .2s;
}

.emoji:hover {
	scale: 1.3;
}

.alert {
display: flex;
  align-items: center;
  gap: .5rem;
  --bs-alert-padding-y: .3rem;
}

.alert .btn-close {
	height: .75em;
}

.alert::before {
	font-family: Phosphor;
	font-size: 1.8rem;
}

.alert-danger::before {
	content: '\E4E2';
}

.alert-warning::before {
	content: '\E4E0';
}

.alert-info::before {
	content: '\E2CE';
}

/*.alert-success::before {
	content: '\E2CE';
}*/

.fw-buttons button {
	width: 100%;
	margin-top: .25rem;
	margin-bottom: .25rem;
}

.markdown-content p:not(:first-child) {
	margin-top: .5rem;
}

[data-bs-theme=light] .light-none {
	display: none;
}

[data-bs-theme=dark] .dark-none {
	display: none;
}

.navbar-toggler {
	padding: .5em;
	border: 0;
}

.navbar-toggler-icon {
	width: 24px;
	height: 24px;
}

.navbar-toggler:focus {
	box-shadow: none;
}

.navbar-toggler:focus-visible {
	outline: 0;
	box-shadow: 0 0 0 var(--bs-navbar-toggler-focus-width);
}

.scale img {
	transition: transform 0.2s ease-in-out;
}

.scale:hover img {
	transform: rotate(-5deg) scale(1.2);
}

.fs-10 {
	font-size: 10rem;
}

.post a {
	text-underline-offset: 0.25em !important;
	--bs-link-underline-opacity: 0.25;
	text-decoration-color: rgba(var(--bs-link-color-rgb),var(--bs-link-underline-opacity,1)) !important;
}

.post a:hover {
	--bs-link-underline-opacity: 1;
}

.form-group-icon input {
	padding-inline-start: 2.15em;
}

.search-result {
	box-shadow: none !important;
	transition: none !important;
}

.search-result:focus-visible {
	background: var(--bs-primary) !important;
}

.search-result:focus-visible,
.search-result:focus-visible * {
	color: #fff !important;
}

.search-result:not(:focus-visible) .enter-arrow {
	display: none;
}

.search-input {
	box-shadow: none !important;
}

.navbar-toggler-icon {
	vertical-align: bottom;
}

.min-20 {
	min-width: 250px !important;
}

a:has(.text-decoration-none) {
	--bs-link-underline-opacity: 0 !important;
}

.brightness-hover {
	transition: filter .3s;
}

.brightness-hover:hover {
	filter: brightness(120%) !important;
}

.highlighter-rouge pre.highlight {
	border-radius: var(--bs-border-radius);
	padding: 1rem;
}

.highlighter-rouge code {
	tab-size: 4;
}

.highlighter-rouge .rouge-code pre,
.highlighter-rouge pre.lineno {
	margin-bottom: 0;
}

.highlighter-rouge pre.lineno {
	margin-right: .75em;
	user-select: none;
}

.mw-fit {
	max-width: fit-content !important;
}

.search-input-btn {
	width: 25%;
}
.no-image {
	width: 250px;
	height: 140px;
}

.post .btn.btn-primary {
	--bs-btn-line-height: 20px;
}

:target {
  scroll-margin-top: 5em;
}

/*.highlight pre code {
	color: #fff;
}*/

h1 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-primary-rgb),var(--bs-text-opacity)) !important;
	font-weight: 700;
}

h1, h2, h3, h4, h5, h6 {
	scroll-margin-top: 2.5em !important;
}

/*.navbar {
	backdrop-filter: blur(7px);
}*/

.post-content img {
	border-radius: var(--bs-border-radius);
}

.post-content :has(img) {
	text-align: center;
}

/*[data-bs-theme=dark] .navbar {
	--bs-bg-opacity: .3;
}
[data-bs-theme=light] .navbar {
	--bs-bg-opacity: .7;
}*/

[data-bs-theme=dark] .highlight pre:not(.rouge-table pre) {
	background-color: var(--bs-basic-btn-base);
}

[data-bs-theme=light] .highlight pre:not(.rouge-table pre) {
	color: #fff;
}

.lh-0 {
	line-height: 0 !important;
}

.tab {
	display: inline-flex;
	min-width: 130px;
	align-items: center;
	gap: .25em;
}

@media screen and (max-width: 991px) {
	.search-input-btn, .post .img-fluid {
		width: 100%;
	}
}