@charset "UTF-8"; /* ==================================================
 * Snapic Just640px Theme Front Main Stylesheet by Lopwon.
 * www.Lopwon.com
 * 2025-03-08
 * CC BY-NC-SA
 * -------------------------------------------------------------------
 *
 * # root
 * # scrollbar
 * # data-theme(pink)
 * # data-theme(bean)
 * # font
 * # reset
 * # base
 * # main
 * # overlay
 * # talk::before
 * # list::before
 * # index(list)
 * # index & single
 * # glightbox
 * # toc
 * # protected
 * # markdown
 * # prism
 * # comments
 * # mood
 * # aside
 * # archive
 * # search
 * # navigator
 * # options
 * # tool
 * # filing
 * # media
 *	## min-width: 1440px
 *	## min-width: 960px
 *	## max-width: 640px
 *	## max-width: 480px
 *
 * -------------------------------------------------------------- root */

:root {

	--font-family: 'Microsoft JhengHei', system-ui, -apple-system, Helvetica, Arial, sans-serif;
	--code-family: 'SF Mono', Menlo, Monaco, Consolas, 'Courier New', -apple-system, system-ui, monospace;
	--body-color: #fcfcfc;
	--body-width: 640px;
	--body-width-base: 640px;
	--max-height: 320px;

	--border-color: rgb(152 152 152 / 10%);
	--overlay-color: rgb(101 101 101 / 25%);

	--wrap-grey: #efefef;
	--wrap-grey-hover: rgb(220 220 220 / 75%);
	--wrap-button: #dcdcdc;
	--wrap-button-hover: #cbcbcb;
	--wrap-light: #ffffff;
	--wrap-dark: #000000;
	--wrap-mark: #ffff00;

	--color-3: #323232;
	--color-6: #656565;
	--color-9: #989898;
	--color-c: #cbcbcb;
	--color-f: #ffffff;
	--color-link: #02cbab;

	--sign-color: #4a86e8;
	--sign-hover-color: #e5432a;

	--highlight-background: #fee8cc;
	--highlight-color: #ec5b32;

}

/* --------------------------------------------------------- scrollbar */

::-webkit-scrollbar {
	width: 5px;
	height: 5px;
}

::-webkit-scrollbar-thumb {
	border-radius: 5px;
	background-color: #cccccc;
}

::-webkit-scrollbar-track {
	background-color: #fcfcfc;
}

* {
	scrollbar-width: thin;
	border-radius: 3px;
	scrollbar-color: #cccccc #fcfcfc;
}

/* -------------------------------------------------- data-theme(pink) */

html[data-theme="pink"] {

	--body-color: #f8f2e2;

	--border-color: rgb(209 163 78 / 10%);
	--overlay-color: rgb(176 107 47 / 25%);

	--wrap-grey: #f3ebd2;
	--wrap-grey-hover: rgb(231 211 161 / 75%);
	--wrap-button: #eddfb8;
	--wrap-button-hover: #e7d4a0;
	--wrap-light: #ffffff;
	--wrap-dark: #b06b2f;

	--color-3: #784028;
	--color-6: #b06b2f;
	--color-9: #d1a34e;
	--color-c: #e7d4a0;
	--color-f: #ffffff;
	--color-link: #02cbab;

}

html[data-theme="pink"] ::-webkit-scrollbar-thumb {
	background-color: #e7d4a0;
}

html[data-theme="pink"] ::-webkit-scrollbar-track {
	background-color: #f8f2e2;
}

html[data-theme="pink"] * {
	scrollbar-color: #e7d4a0 #f8f2e2;
}

/* -------------------------------------------------- data-theme(bean) */

html[data-theme="bean"] {

	--body-color: #dcecdc;

	--border-color: rgb(69 132 80 / 10%);
	--overlay-color: rgb(41 83 51 / 15%);

	--wrap-grey: #bfdbc0;
	--wrap-grey-hover: rgb(148 193 152 / 75%);
	--wrap-button: #afd1b3;
	--wrap-button-hover: #94c199;
	--wrap-light: #f1f8f2;
	--wrap-dark: #295333;

	--color-3: #1d3723;
	--color-6: #295333;
	--color-9: #458450;
	--color-c: #94c199;
	--color-f: #f1f8f2;
	--color-link: #e35e35;

}

html[data-theme="bean"] ::-webkit-scrollbar-thumb {
	background-color: #94c199;
}

html[data-theme="bean"] ::-webkit-scrollbar-track {
	background-color: #dcecdc;
}

html[data-theme="bean"] * {
	scrollbar-color: #94c199 #dcecdc;
}

/* -------------------------------------------------------------- font */

@font-face {
	font-family: 'Caveat'; /* 自定义字体名称，如果有空格，请用引号包裹，如 'Noto Sans SC' */
	src: url('../font/sign/Caveat-Regular.eot'); /* 字体子集文件相对路径，当前路径表示：文件夹 font/sign 的 Caveat-Regular.eot 字体子集文件 */
	src: url('../font/sign/Caveat-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		url('../font/sign/Caveat-Regular.woff2') format('woff2'), /* Super modern browsers */
		url('../font/sign/Caveat-Regular.woff') format('woff'), /* Modern browsers */
		url('../font/sign/Caveat-Regular.ttf') format('truetype'), /* Safari, Android, iOS */
		url('../font/sign/Caveat-Regular.svg#Caveat-Regular') format('svg'); /* Legacy iOS */
	font-weight: normal; /* 字体粗细，可选 */
	font-style: normal; /* 字体样式，可选 */
	font-display: swap; /* 字体显示，必选 */
}



.sign span:first-child a {
	font-family: 'Caveat', Helvetica, Arial, sans-serif; /* 如需更换签名字体，可将默认的 Caveat 替换为 @font-face 中自定义的 font-family 的值 */
	margin-left: -0.1em; /* 左偏移量 */
	margin-top: -0.65em; /* 下偏移量 */
	font-size: 3.8em; /* 签名字号 */
}

/* ------------------------------------------------------------- reset */

*,
*::before,
*::after {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html {
	font-family: var(--font-family);
	font-size: 62.5%;
	font-weight: normal;
	line-height: 1.2;
	text-rendering: optimizeLegibility;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body {
	-webkit-overflow-scrolling: touch;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

body,
main,
archive,
section,
aside,
footer,
div,
img,
textarea,
input,
button {
	display: block;
}

a {
	text-decoration: none;
	outline: none;
}

a:hover,
a:focus,
a:active {
	outline-width: 0;
}

p {
	margin: 1.5em 0;
	line-height: 1.5;
}

p br {
	display: none;
}

ol,
ul {
	list-style: none;
}

img,
video {
	margin: 0 auto;
	width: 100%;
	height: auto;
}

/* -------------------------------------------------------------- base */

[hidden],
.hidden {
	display: none !important;
}

.clamp {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	text-overflow: ellipsis;
	overflow: hidden;
	-webkit-line-clamp: 1;
}

/* -------------------------------------------------------------- main */

body {
	position: relative;
	margin: 5em auto;
	margin-bottom: 15em;
	padding: 0;
	max-width: var(--body-width);
	min-height: calc(100vh - 5em - 15em + 15px * 2);
	background-color: var(--body-color);
}

main {
	margin: 0;
	padding: 1em;
	background-color: var(--body-color);
}

/* ----------------------------------------------------------- overlay */

.overlay {
	position: -webkit-fixed;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background-color: var(--overlay-color);
	visibility: hidden;
	opacity: 0;
	-webkit-transition: visibility 0.3s, opacity 0.3s;
	transition: visibility 0.3s, opacity 0.3s;
	z-index: 6;
}

.overlay.visible {
	visibility: visible;
	opacity: 1;
}

#message {
	position: -webkit-fixed;
	position: fixed;
	bottom: 3.5em;
	left: 50%;
	height: 48px;
	padding: 1em;
	color: var(--color-f);
	font-size: 1.6em;
	border-radius: 1em;
	background-color: var(--wrap-dark);
	visibility: hidden;
	opacity: 0;
	-webkit-transform: translateX(-50%) translateY(20px);
	transform: translateX(-50%) translateY(20px);
	-webkit-transition: opacity 0.3s ease, transform 0.3s ease, visibility 0s 0.3s ease;
	transition: opacity 0.3s ease, transform 0.3s ease, visibility 0s 0.3s ease;
	z-index: 6;
}

#message[style*="visibility: visible"] {
	-webkit-transform: translateX(-50%) translateY(0);
	transform: translateX(-50%) translateY(0);
	-webkit-transition: opacity 0.3s ease, transform 0.3s ease, visibility 0s ease;
	transition: opacity 0.3s ease, transform 0.3s ease, visibility 0s ease;
}

.loading,
.error {
	padding: 1em;
	font-size: 1.4em;
	color: var(--color-c);
	text-align: center;
}

#entry-catalog .loading,
#entry-catalog .error {
	margin-top: 3.75em !important;
}

/* ------------------------------------------------------ talk::before */

.mood::before,
.comment-content::before {
	display: block;
	content: '';
	position: absolute;
	top: -1.75em;
	left: 1.25em;
	border: 1em solid transparent;
	border-bottom-color: var(--wrap-grey);
}

.comment-content::before {
	top: -1.5em;
	left: 0.25em;
}

/* ------------------------------------------------------ list::before */

.article.index.list::before,
.archive .article::before,
#posts .list a::before,
#posts .list a .pin::before {
	display: block;
	content: '-';
	position: absolute;
	top: 50%;
	left: -1.5em;
	font-weight: bold;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

#posts .list a[id^="isPin"]::before,
#posts .list a.isHistory .pin::before {
	content: none;
}

#posts .list a .pin::before,
#posts .list a.isHistory::before {
	content: '';
	width: 24px;
	height: 24px;
	background-size: 18px;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-color: transparent;
	background-image: url('data:image/svg+xml;base64,PCEtLSBHZW5lcmF0ZWQgYnkgSWNvTW9vbi5pbyAtLT4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjcyIiBoZWlnaHQ9IjcyIiB2aWV3Qm94PSIwIDAgNzIgNzIiPgo8dGl0bGU+cGluPC90aXRsZT4KPHBhdGggZD0iTTUwLjE4NyAxMi44MTNjLTEuMTY3LTEuMTczLTMuMDYzLTEuMTc5LTQuMjQyLTAuMDEyLTAuMzEyIDAuMzEyLTAuNTI4IDAuNjgxLTAuNjc1IDEuMDY1LTIuNDk2IDUuMjA4LTUuMjQ0IDguMTQ1LTguNzEyIDkuODc5LTMuODkxIDEuOTItOC4zNTggMy4yNTUtMTUuNTU4IDMuMjU1LTAuMzkgMC0wLjc4IDAuMDc1LTEuMTQ2IDAuMjI4LTAuNzM1IDAuMzA2LTEuMzE3IDAuODkxLTEuNjIzIDEuNjIzLTAuMzAzIDAuNzMyLTAuMzAzIDEuNTYgMCAyLjI5MiAwLjE1MyAwLjM2OSAwLjM3MiAwLjcwMiAwLjY1MSAwLjk3OGw5LjcyOSA5LjcyOS0xMy42MTEgMTguMTUgMTguMTUtMTMuNjExIDkuNzI2IDkuNzI2YzAuMjc2IDAuMjgyIDAuNjA5IDAuNDk4IDAuOTc4IDAuNjUxIDAuMzY2IDAuMTUzIDAuNzU2IDAuMjM0IDEuMTQ2IDAuMjM0czAuNzgtMC4wODEgMS4xNDYtMC4yMzRjMC43MzUtMC4zMDYgMS4zMi0wLjg4NSAxLjYyMy0xLjYyMyAwLjE1My0wLjM2MyAwLjIzMS0wLjc1NiAwLjIzMS0xLjE0MyAwLTcuMiAxLjMzMi0xMS42NjcgMy4yNDktMTUuNDk4IDEuNzMxLTMuNDY4IDQuNjY4LTYuMjE2IDkuODc5LTguNzEyIDAuMzg3LTAuMTQ3IDAuNzUzLTAuMzYzIDEuMDYyLTAuNjc1IDEuMTY3LTEuMTc5IDEuMTYxLTMuMDc1LTAuMDEyLTQuMjQybC0xMS45OTEtMTIuMDYweiI+PC9wYXRoPgo8L3N2Zz4K');
	opacity: 0.15;
}

#posts .list a.isHistory .pin::before,
#posts .list a.isHistory::before {
	background-image: url('data:image/png;base64,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');
	opacity: 0.3;
}

#posts .list a.isHistory::before {
	content: '';
	left: -24px;
}

/* ------------------------------------------------------- index(list) */

main.index {
	display: flex;
	flex-direction: column;
	gap: 0.25em;
	margin: 0 1em;
}

main.index .article.index:not(.list) {
	margin: 0;
}

main.index > h1 {
	margin-left: 0.75em;
	margin-bottom: 1em;
	font-size: 2.8em;
	font-weight: bold;
	color: var(--color-3);
}

main.index .title.index a {
	color: var(--color-3);
}

main.index .title.index a:hover {
	color: var(--color-9);
}

main.index .article.index.list {
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
	margin: 0;
	margin-left: 1em;
	padding: 0.75em 1em;
	min-height: 48px;
}

main.index .article.index.list:hover {
	background-color: var(--wrap-grey);
	-webkit-transition: background-color 0.3s ease;
	transition: background-color 0.3s ease;
}

main.index .title.index.list {
	margin-bottom: 0;
	font-size: 1.6em;
	font-weight: normal;
}

main.index .title.index.list a {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	padding-left: 0.5em;
	padding-right: 125px;
	width: 100%;
	height: 100%;
	color: var(--color-3);
	line-height: 48px;
	font-weight: normal;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

main.index .article.index.list .chat,
main.index .article.index.list .date {
	flex-shrink: 0;
	font-size: 1.2em;
	color: var(--color-c);
	text-align: right;
}


main.index .article.index.list:hover .chat,
main.index .article.index.list:hover .date {
	color: var(--color-9);
}

main.index .article.index.list .chat {
	margin-left: auto;
	margin-right: 1em;
}

/* ---------------------------------------------------- index & single */

.article.index,
.article.single {
	margin: 5em 1em;
}

.title.index,
.title.single {
	margin-bottom: 1.5em;
	font-size: 2.8em;
	font-weight: bold;
	color: var(--color-3);
}

.content {
	font-size: 1.8em;
	color: var(--color-3);
	text-align: justify;
	word-break: break-word;
	overflow-wrap: anywhere;
}

.content p:has(img) {
	margin: 2em auto;
}

.content a {
	color: var(--color-link);
}

.content a:hover {
	color: var(--color-3);
}

img.foto {
	border-radius: 0.5em;
	opacity: 0;
	-webkit-transition: opacity 0.5s ease;
	transition: opacity 0.5s ease;
}

img.foto.loaded {
	opacity: 1;
}

.escaped {
	font-size: 62.5%;
	text-align: justify;
	color: var(--color-9);
}

.escaped span.clamp {
	margin: 1em 0;
}

.content p a.glightbox:hover .escaped {
	color: var(--color-3);
}

[id^="fotos-"] {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.25em;
	margin-left: -0.5em;
	margin-right: -0.5em;
}

[id^="fotos-"] > span {
	position: relative;
	flex: 1 1 calc((100% - 1em) / 3);
	padding-top: calc((100% - 1em) / 3);
	border-radius: 0.25em;
	background-color: transparent;
}

[id^="fotos-"] > span img {
	margin-left: auto !important;
	width: 100% !important;
	height: 100%;
	max-width: none !important;
	border-radius: 0.25em;
	object-fit: cover;
}

[id^="fotos-"] > span .escaped {
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 0.25em;
	width: 100%;
	color: var(--color-3);
	text-align: center;
}

[id^="fotos-"] > span .escaped span {
	position: relative;
	margin-top: auto;
	opacity: 0;
	-webkit-transition: opacity 0.3s ease;
	transition: opacity 0.3s ease;
	z-index: 1;
}

[id^="fotos-"] > span .escaped span.clamp {
	-webkit-line-clamp: 3;
}

[id^="fotos-"] > span .escaped::after {
	display: block;
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 5em;
	border-radius: 0 0 0.25em 0.25em;
	background: -webkit-linear-gradient(to bottom,
		rgb(255 255 255 / 0%) 0%,
		rgb(255 255 255 / 10%) 10%,
		rgb(255 255 255 / 20%) 20%,
		rgb(255 255 255 / 30%) 30%,
		rgb(255 255 255 / 40%) 40%,
		rgb(255 255 255 / 50%) 50%,
		rgb(255 255 255 / 60%) 60%,
		rgb(255 255 255 / 70%) 70%,
		rgb(255 255 255 / 80%) 80%,
		rgb(255 255 255 / 90%) 90%,
		rgb(255 255 255 / 100%) 100%
	);
	background: linear-gradient(to bottom,
		rgb(255 255 255 / 0%) 0%,
		rgb(255 255 255 / 10%) 10%,
		rgb(255 255 255 / 20%) 20%,
		rgb(255 255 255 / 30%) 30%,
		rgb(255 255 255 / 40%) 40%,
		rgb(255 255 255 / 50%) 50%,
		rgb(255 255 255 / 60%) 60%,
		rgb(255 255 255 / 70%) 70%,
		rgb(255 255 255 / 80%) 80%,
		rgb(255 255 255 / 90%) 90%,
		rgb(255 255 255 / 100%) 100%
	);
	opacity: 0;
	-webkit-transition: opacity 0.3s ease;
	transition: opacity 0.3s ease;
	z-index: 0;
}

.content p a.glightbox:hover .escaped span,
.content p a.glightbox:hover .escaped::after {
	opacity: 1;
	-webkit-transition: opacity 0.3s ease;
	transition: opacity 0.3s ease;
}

.profile {
	display: flex;
	align-items: flex-end;
	gap: 2em;
	margin-top: 20em;
	padding-bottom: 3em;
}

.profile .avatar {
	width: 48px;
	height: 48px;
	padding: 0.3em;
	border-radius: 50%;
	background: linear-gradient(225deg, var(--wrap-grey), var(--wrap-grey-hover)) border-box, var(--body-color) content-box;
	background-clip: padding-box, content-box;
	border: 0.15em solid transparent;
}

.profile .avatar img {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	-webkit-transition: transform 0.3s ease;
	transition: transform 0.3s ease;
}

.profile .avatar a:hover img {
	-webkit-transform: scale(1.5) translateY(-0.75em);
	transform: scale(1.5) translateY(-0.75em);
}

.profile .sign {
	display: flex;
	flex-direction: column;
	gap: 0.5em;
}

.profile .sign span:first-child a {
	display: block;
	color: var(--sign-color);
}

.profile .sign span:first-child a:hover {
	color: var(--sign-hover-color);
}

.profile .sign span:last-child {
	font-size: 1.2em;
	color: var(--color-3);
}

/* --------------------------------------------------------- glightbox */

.gscrollbar-fixer {
	margin-right: auto !important;
}

a.glightbox {
	display: block;
	position: relative;
	cursor: pointer;
}

a.glightbox:hover {
	margin-bottom: auto;
	border-bottom: 0;
}

a.glightbox::before {
	display: block;
	content: '';
	position: absolute;
	top: 0;
	left: -0.5em;
	width: calc(100% + 1em);
	height: 100%;
	border-radius: 0.5em;
	background-color: transparent;
	-webkit-transition: background-color 0.3s ease;
	transition: background-color 0.3s ease;
	pointer-events: none;
}

[id^="fotos-"] a.glightbox::before {
	left: 0;
	width: 100%;
}

a.glightbox:hover::before {
	background-color: rgb(255 255 255 / 15%);
}

[id^="fotos-"] a.glightbox {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
}

a.glightbox:not(.hasImgTag) {
	display: inline-block;
}

#glightbox-body .goverlay {
	background: var(--body-color);
}

.glightbox-clean .gslide-media {
	-webkit-box-shadow: none !important;
	box-shadow: none !important;
}

.gslide-image img {
	border-radius: 0.25em;
}

.gclose svg,
.gnext svg,
.gprev svg {
	width: 16px !important;
	height: 16px !important;
	filter: brightness(0);
}

.glightbox-clean .gclose,
.glightbox-clean .gnext,
.glightbox-clean .gprev {
	width: 48px !important;
	height: 48px !important;
	line-height: 1.5;
	border-radius: 35% !important;
	background-color: transparent !important;
}

.glightbox-clean .gclose:hover,
.glightbox-clean .gnext:hover,
.glightbox-clean .gprev:hover {
	background-color: var(--wrap-button) !important;
	-webkit-transition: background-color 0.3s ease !important;
	transition: background-color 0.3s ease !important;
}

/* --------------------------------------------------------------- toc */

#toc {
	display: flex;
	justify-content: flex-end;
	position: -webkit-fixed;
	position: fixed;
	top: 50%;
	left: 0;
	margin: 0;
	margin-left: 1em;
	padding: 0 0.5em;
	width: 100%;
	height: fit-content;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

#toc li {
	margin: 0.25em 0;
	padding: 0.25em 0.5em;
	font-size: 1.4em;
	color: var(--color-3);
	line-height: 1.5;
	text-align: right;
	border-right: 0.15em solid var(--border-color);
	border-radius: 0.25em 0 0 0.25em;
	opacity: 0.15;
	-webkit-transition: opacity 0.3s ease, border-right 0.3s ease;
	transition: opacity 0.3s ease, border-right 0.3s ease;
	pointer-events: none;
	cursor: pointer;
}

#toc:hover li,
#toc li.active {
	pointer-events: auto;
}

#toc:hover li {
	opacity: 0.3;
}

#toc li:hover {
	background-color: var(--wrap-grey);
	opacity: 0.7;
}

#toc li.active {
	font-weight: bold;
	border-right: 0.15em solid;
	opacity: 1;
}

[id^="section-"] {
	scroll-margin-top: 1.5em;
}

/* --------------------------------------------------------- protected */

.protected {
	display: flex;
	flex-direction: column;
	gap: 1em;
	font-size: 62.5%;
}

.protected p {
	margin: 0;
}

.protected .word {
	font-size: 1.2em;
	color: var(--color-c);
}

.protected p:last-child {
	position: relative;
	flex: 1 1 100%;
	width: auto;
	max-width: calc(var(--body-width-base) - 2 * 2em);
}

.protected input[type="password"] {
	margin: 1em 0;
	padding: 1em 0.75em;
	padding-right: calc(48px + 1.5em);
	width: 100%;
	height: calc(48px + 1.25em);
	font-size: 1.6em;
	color: var(--color-3);
	text-align: center;
	border: 0;
	outline: none;
	border-radius: 24px;
	background-color: var(--wrap-grey);
}

.protected .submit {
	position: absolute;
	top: 50%;
	right: 0.75em;
	margin: 0;
	padding: 0;
	width: 48px;
	height: 48px;
	font-size: 1.4em;
	border: none;
	border-radius: 35%;
	background-color: transparent;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	cursor: pointer;
}

.protected .submit:hover {
	background-color: var(--wrap-button);
	-webkit-transition: background-color 0.3s ease;
	transition: background-color 0.3s ease;
}

#protected-err {
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 50%;
	left: 50%;
	padding: 1em;
	width: 100%;
	height: calc(48px + 1.25em);
	font-size: 1.6em;
	color: var(--color-3);
	border-radius: 24px;
	background-color: var(--wrap-grey);
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	cursor: no-drop;
}

/* ---------------------------------------------------------- markdown */

abbr[title] {
	text-decoration: none;
	border-bottom: 0.01em dashed;
}

mark {
	margin: 0 0.15em;
	padding: 0;
	color: var(--color-3);
	padding: 0.15em 0.25em;
	border-radius: 0.15em;
	background-color: var(--wrap-mark);
}

hr {
	margin: 3em 0;
	padding: 0;
	width: 3em;
	border: 0.01em dashed var(--border-color);
	border-width: 0.01em 0 0 0;
}

p small {
	color: var(--color-9);
	line-height: 1.4;
}

center {
	display: block;
	text-align: center;
}

p right {
	display: block;
	text-align: right;
}

code,
kbd,
samp {
	font-family: var(--code-family);
	text-indent: 0;
	word-break: break-word;
	overflow-wrap: anywhere;
}

p code,
ol code,
ul code {
	margin: 0 0.15em;
	padding: 0.15em 0.25em;
	font-size: 87.5%;
	color: var(--color-9);
	border-radius: 0.15em;
	background-color: var(--wrap-grey);
}

pre {
	margin: 1em 0;
	padding: 1em;
	max-height: 20em;
	color: var(--color-9);
	border-width: 0 0.01em;
	border-radius: 0.15em;
	background-color: var(--wrap-grey);
	overflow: auto;
}

pre code {
	font-size: 87.5%;
	color: var(--color-9);
}

blockquote {
	display: inline-block;
	position: relative;
	margin: 1em 0;
	padding: 1em;
	width: auto;
	font-size: 87.5%;
	text-align: justify;
	line-height: 1.4;
	color: var(--color-6);
	border-radius: 0.15em 0.5em 0.5em 1em;
	background-color: var(--wrap-grey);
}

blockquote::before {
	display: block;
	content: '';
	position: absolute;
	top: -0.5em;
	left: -0.5em;
	width: 1.25em;
	height: 1.25em;
	background-size: 1em;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-image: url('data:image/svg+xml;base64,PCEtLSBHZW5lcmF0ZWQgYnkgSWNvTW9vbi5pbyAtLT4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjY3IiBoZWlnaHQ9IjcyIiB2aWV3Qm94PSIwIDAgNjcgNzIiPgo8cGF0aCBkPSJNMzAuODU3IDM4LjU3MXYxNS40MjljMCA0LjI1OS0zLjQ1NSA3LjcxNC03LjcxNCA3LjcxNGgtMTUuNDI5Yy00LjI1OSAwLTcuNzE0LTMuNDU1LTcuNzE0LTcuNzE0di0yOC4yODZjMC0xMS4zMyA5LjI0MS0yMC41NzEgMjAuNTcxLTIwLjU3MWgyLjU3MWMxLjQwNiAwIDIuNTcxIDEuMTY1IDIuNTcxIDIuNTcxdjUuMTQzYzAgMS40MDYtMS4xNjUgMi41NzEtMi41NzEgMi41NzFoLTIuNTcxYy01LjY2NSAwLTEwLjI4NiA0LjYyMS0xMC4yODYgMTAuMjg2djEuMjg2YzAgMi4xMjkgMS43MjggMy44NTcgMy44NTcgMy44NTdoOWM0LjI1OSAwIDcuNzE0IDMuNDU1IDcuNzE0IDcuNzE0ek02Ni44NTcgMzguNTcxdjE1LjQyOWMwIDQuMjU5LTMuNDU1IDcuNzE0LTcuNzE0IDcuNzE0aC0xNS40MjljLTQuMjU5IDAtNy43MTQtMy40NTUtNy43MTQtNy43MTR2LTI4LjI4NmMwLTExLjMzIDkuMjQxLTIwLjU3MSAyMC41NzEtMjAuNTcxaDIuNTcxYzEuNDA2IDAgMi41NzEgMS4xNjUgMi41NzEgMi41NzF2NS4xNDNjMCAxLjQwNi0xLjE2NSAyLjU3MS0yLjU3MSAyLjU3MWgtMi41NzFjLTUuNjY1IDAtMTAuMjg2IDQuNjIxLTEwLjI4NiAxMC4yODZ2MS4yODZjMCAyLjEyOSAxLjcyOCAzLjg1NyAzLjg1NyAzLjg1N2g5YzQuMjU5IDAgNy43MTQgMy40NTUgNy43MTQgNy43MTR6Ij48L3BhdGg+Cjwvc3ZnPgo=');
	opacity: 0.15;
}

blockquote p {
	margin: 0.5em;
}

.content ol,
.content ul {
	margin: 1.5em 0;
	margin-left: 0.5em;
	padding: 0;
	padding-left: 1em;
	font-size: 87.5%;
	color: var(--color-9);
}

.content ol {
	list-style: decimal;
}

.content ul {
	list-style: circle;
}

.content ol li,
.content ul li {
	margin: 0.25em 0;
}

.content h1 {
	color: var(--color-3);
	font-size: 175%;
}

.content h2 {
	color: var(--color-3);
	font-size: 150%;
}

.content h3 {
	color: var(--color-3);
	font-size: 125%;
}

.content h4 {
	color: var(--color-3);
	font-size: 100%;
}

.content h5 {
	color: var(--color-3);
	font-size: 87.5%;
}

table {
	display: flex;
	flex-direction: column;
	margin: 1em 0;
	padding: 0;
	border-radius: 0.15em;
	border: 0.01em solid var(--border-color);
	background-color: var(--wrap-grey);
}

tr {
	display: flex;
	color: var(--color-9);
}

th,
td {
	flex: 1 1 0%;
	padding: 1em;
	text-align: left;
	border: 0.01em solid var(--border-color);
}

table tr:hover {
	background-color: var(--wrap-grey-hover);
}

sup[id*="fnref-"] {
	margin: 0;
	padding: 3em 0.15em 0.15em;
}

sup[id*="fnref-"] a,
.footnotes li[id*="fn-"] a {
	border-bottom: 0 !important;
}

.footnotes li[id*="fn-"]::marker {
	font-style: italic;
}

.footnotes li[id*="fn-"]:first-child {
	margin-top: -5em !important;
}

.footnotes li[id*="fn-"] {
	margin-bottom: -5em;
	padding: 5em 0.5em 1em;
	font-size: 87.5%;
	color: var(--color-9);
}

.footnotes li[id*="fn-"]:last-child {
	margin-bottom: 0 !important;
}

sup[id*="fnref-"]:target a,
.footnotes li[id*="fn-"]:target,
.footnotes li[id*="fn-"]:target a {
	color: var(--color-link);
}

sup[id*="fnref-"]:target a:hover,
.footnotes li[id*="fn-"]:target a:hover {
	color: var(--color-3);
}

/* ------------------------------------------------------------- prism */

:not(pre) > code[class*=language-],
pre[class*=language-] {
	font-size: 87.5% !important;
	background-color: var(--wrap-grey) !important;
}

code[class*=language-],
pre[class*=language-] {
	font-size: 87.5% !important;
	line-height: 1.2 !important;
	text-shadow: none !important;
}

div.code-toolbar > .toolbar {
	top: 0.25em !important;
	right: 0.5em !important;
	z-index: 1 !important;
}

div.code-toolbar > .toolbar > .toolbar-item > a,
div.code-toolbar > .toolbar > .toolbar-item > button,
div.code-toolbar > .toolbar > .toolbar-item > span {
	padding: 0.25em 0.5em !important;
	font-size: 62.5% !important;
	color: var(--color-9) !important;
	border-radius: 0.25em !important;
	box-shadow: none !important;
	background: var(--wrap-button) !important;
	cursor: pointer !important;
}

div.code-toolbar > .toolbar > .toolbar-item > a:hover,
div.code-toolbar > .toolbar > .toolbar-item > button:hover,
div.code-toolbar > .toolbar > .toolbar-item > span:hover {
	color: var(--color-6) !important;
	background: var(--wrap-button-hover) !important;
}

/* ---------------------------------------------------------- comments */

#entry-comments {
	max-width: var(--body-width-base) !important;
}

.comment-head {
	display: flex;
	align-items: center;
	position: -webkit-fixed;
	position: fixed;
	top: 0;
	left: 50%;
	padding: 0 1.75em;
	width: 100%;
	margin: 0 auto !important;
	height: calc(3em + 48px);
	background-color: var(--body-color);
	box-shadow: 0 0.5em 1em 0 transparent;
	opacity: 0;
	-webkit-transform: translate(-50%, -100%);
	transform: translate(-50%, -100%);
	-webkit-transition: opacity 0.7s ease, transform 0.7s ease, box-shadow 0.7s ease;
	transition: opacity 0.7s ease, transform 0.7s ease, box-shadow 0.7s ease;
	z-index: 1;
}

.comment-head.fixed {
	box-shadow: 0 0.5em 1em 0 var(--border-color);
	opacity: 1;
	-webkit-transform: translate(-50%, 0);
	transform: translate(-50%, 0);
}

.comment-head > div,
.comment-head.fixed > div {
	display: flex;
	align-items: center;
	gap: 1em;
	margin: 0 auto;
	padding: 0 1.75em;
	width: 100%;
	height: calc(1em + 48px);
	max-width: var(--body-width-base);
}

.comment-head .title {
	font-size: 1.8em;
	font-weight: bold;
	color: var(--color-3);
	-webkit-line-clamp: 2;
}

ol.comment-list {
	display: flex;
	flex-direction: column;
	gap: 5em;
}

.comment-body {
	display: flex;
	flex-direction: column;
	margin-bottom: 2em;
	padding-top: 1em;
}

.comment-children {
	padding-left: 0.5em;
	border-left: 0.15em solid var(--border-color);
}

.comment-author {
	display: flex;
	align-items: center;
	gap: 1em;
	font-style: normal;
}

.comment-avatar img {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	-webkit-transition: transform 0.3s ease;
	transition: transform 0.3s ease;
}

.comment-avatar:hover img {
	-webkit-transform: scale(1.05);
	transform: scale(1.05);
}

.comment-info {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 0.25em;
	width: calc(100% - 36px - 1em);
	height: 36px;
}

.comment-user {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	gap: 0.25em;
	margin-right: auto;
	font-size: 1.4em;
	color: var(--color-9);
	cursor: default;
}

.comment-user a {
	color: var(--color-9);
	font-weight: bold;
}

.comment-user a:hover {
	color: var(--color-3);
}

.comment-user,
.comment-user a {

}

.comment-admin {
	flex-shrink: 0;
	padding: 0.25em 0.5em;
	font-size: 87.5%;
	color: var(--highlight-color);
	border-radius: 1em;
	background-color: var(--highlight-background);
}

.comment-name,
.comment-role,
.comment-ip {
	flex-shrink: 0;
	font-size: 87.5%;
	color: var(--color-c);
}

.comment-name {
	font-size: 100%;
	color: var(--color-9);
	white-space: nowrap;
}

.comment-role {
	color: var(--highlight-color);
}

.comment-ip {

}

.comment-meta {
	display: flex;
	align-items: center;
	gap: 1em;
}

.comment-date {
	flex-shrink: 0;
	font-size: 1.2em;
	color: var(--color-c);
}

.comment-ip:hover,
.comment-date:hover {
	color: var(--color-9);
}

.comment-content {
	display: inline-block;
	position: relative;
	margin: 1em 0;
	margin-right: auto;
	padding: 1em 1.5em;
	font-size: 1.4em;
	color: var(--color-6);
	word-break: break-word;
	overflow-wrap: anywhere;
	border-radius: 1em;
	background-color: var(--wrap-grey);
}

.comment-content > p {
	margin: 0.5em 0;
}

.comment-content img {
	margin-left: auto !important;
	width: 100%;
	height: auto;
	max-width: 100% !important;
	max-height: var(--max-height);
	border-radius: 0.5em;
}

.comment-content img:not(.foto) {
	width: auto;
}

.comment-pin {
	position: absolute !important;
	bottom: 0;
	right: 0;
	width: 1em;
	height: 1em;
	border-radius: 1em 0;
	background-color: var(--wrap-dark);
}

.comment-reply {
	position: absolute;
	top: -12px;
	right: -6px;
	border-radius: 50%;
	background-color: var(--body-color);
}

.go-form,
.reply-icon {
	background-color: transparent !important;
	opacity: 0.3;
}

.go-form {
	width: 36px !important;
	height: 36px !important;
	background-size: 24px !important;
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABICAYAAABV7bNHAAAAAXNSR0IArs4c6QAABLJJREFUeF7lnFvIVUUUx3+flCIEPoSCCiZEGORDBWViF80iQ1MLtIcwtQi1gi7eCH2wxFvkhdKKKBWNEPGKJiqVmZKoYJeHwgcRERIfwhdF8CX545zcbPbZZ2bvmTnn7L3g8PHxzVqz5rfnrJm91szXQ33lDuBhYBQwEOhnPoOBIeazoqdGfO4DHjJQRhgwd+aM/xNgftUBPQiMByYAjzlMhleBrWpfRUD3GygCM8YBSqOpdH5u/FIlQM8Dc4AXCkBpqEh3f1K/CoD0xAVmSgkwUp0FfJW20c2ARhow00qCkfqHwJIsO90ISEvwYuAND2BkYkfe7Os2QK+Yp32vJzh/A88BF5vZ6xZAAwyY2Z7ANMwosB/Ms9kNgF4CPgIe8AxnHrC6lc1OB7QSWNhqEAX+vgl4zUavUwH1B9YDU20G4djmFDAOuGKj14mAHgE2APrpW64ZOMdtDXcaIM0YzRzNoBAyF1jjYriTACnWKOaEksNmSXey3ymAtJq87+S5e+OngF9c1ToB0EZgpqvjju2Xmd23o1r70x17gEnOXrspnAY0e667qd1q3c4ZdAQYXcRpR53JwF5Hnf+btwtQLDifA28VhdOuGfQZ8HYZpy11zwFPAv9Yts9sFnsGzQC0zY8hSod8XbajmIAUC3aXddhS/wfgWcu2uc1iAVIwVtyJJapifO+jsxiAVHrRzBnqw2ELGyrXqGzjRUIDUrVSCSmXmlSZgd0AlKs+U8ZIUjc0oG9s8y6eBvSx7/xRSEB6c1b5NpZcMLPnks8OQwFSrveAT0ctbL0HrLNo59QkBKB7TNxRCTiWHDObQu/9hQC0E1CiPaYohXooRIe+Ac0HFChjytqQuSSfgB4HfgR6R6Tzl/lq/RuqT1+Aehk4MdIXSRaqtH4XCo7s+gK0HPggpKMZtrcA00P36QOQ3nv2hXY0Zf+yyRKeDd1vWUCKNyfMub/QvibtvwN8GqPDsoAWAKtiOJroYzvwcqw+ywDShlCzR0doY4leJ8YCyhZGkTKAtP94N4qXtzsJvmqlx1MUkNIXmj0xRTFHsSeqFAW0LWYcAE4CzwBXo9IpuA96EdgV2VHB0S49uhSZQUdDvTk3Gf3rgMrTbRFXQG+aszuxnLU6JhfSGRdAd5vArEshoUV19EWAVsq2igugpUVPSDiO8CfTT+xVMtNNW0DDzey5y3GwLs11wOnbxi0bF8WQbW0BfQHknVHW8qsEfdrefxYr5R/AnzF3xy5AbQANA34D+uYY1mWSL1067pa2NoBa5Xp+Nbf3umXMTn62AqQrAJo9g3Ks6s6nIFVSWgFqlYTX10pfr8pKHiDdCv49546EArNSHdHfj2I+jTxA2uLnHUCqbGBOPoA8QDpT/ESTp1XpwGwDSJVRVUibSaUDsw0gHZud2IRO5QNzK0C6Raz3oSypRWBuBWhzTkGuFoE5D5COrOiia5bUJjDnAVL5WK8WWVKbwJwHSMnxRzPo1CowNwP0dJPEeO0CczNAugqZdfGjdoE5C1Afk7DSf19KSi0DcxYglXSV7kxLLQNzFiAVAlUQTEptA3MakO5QnE/BqXVgTgPKOhFf68CcBqT6U/KySe0DcxLQTZGGpc8kjlNOAAAAAElFTkSuQmCC');
}

.reply-icon {
	width: 24px !important;
	height: 24px !important;
	background-size: 12px !important;
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABICAYAAABV7bNHAAAAAXNSR0IArs4c6QAAA/hJREFUeF7t21nIDlEcx/HvW66kKC7IhRvJnlL2skRJSAh3siTiTiIpXMiSS2tCuZIs2XIhJdkuUJa4ILJmKyRLSumneXg8Zp4zZ5Yz8555Tk29Pc+Zec583v9Z5pwzbfiZhgN3gG9pb68t7QVKfP5GYH3a8vkMNA8YCKxLg+QzkFyuAoeAPUmRfAdaABwAxgKXkiD5DiSTG8AHYFILKFxgC7AaWANstUWqQgRNAc4CX4KqdtMGqQpA8ngHdANOAjNaQP8LHAVmBR9PA87ERapKBNV6M7mcBqa3gP4V6Aq8r/sodhRVJYJk8xHoHCDFjqIqAT0EetdF0RjgiqmqVQnoGjCiDmQ7sKoF9FfgFKC2p5YUUf2An82QqhRBeiZTb1af1PUfLzNQf+C+Kcwz+n5bSJXSk/78sgIJZw6wISMA02V2A0sbMj0DepURSDhHAI1wXQGpxxoVgjEIuBeFVEQbVMMZAGha1BXQZ6BTCMRC4GBZgOpxVCZXQIOB2xEImm1cVgagRhyXQMuBHREIGh+FVb3f2V1VsTAcl0CHgbkRQE0bahdAUTiugIYG065RtUgDxQ5FVbFmOK6A9gJLDGOA7sCbsDx5RpAJxwXQaOCyaYAEKMpuuQSKg+MCSFOscSbHRgLXXQHFxckbSOOb/TGiR1lU5gcugGxw8gRaDOyLiaNsPYFXeQPZ4uQFtBbYZIGjrBpha1nov5RVI50EJ2sgrX+tBCZY4nwCuuTZzSfFyQpIs4SqUossYWrZtag4NS+gNDhpgSYHczna5pImqUpuzgMoLY4t0BBgHDAsGLf0SaNSd66q5rmsgbLAqQFdDCmclon7BofmjfV3x4xAGi/TA3idJVBWODndr9VlTwAzm51h24v5hCMXzUdrXjoy2QD5hvMyWPbRTGNqIN9wBLITWGGqkHEiyEecF8FmqsdpgXzEkYmWfzRPZEzNIshXnGPAbKNMkCEKyFecp8H6/N00QL7iaO55IhA2MLXqxXwFGm+LI7WqVLFEOM2A9J0PkaQ1d80PaRtwomQaB7VnpKZLynG1TEDtMZIULbuy2hQRB6i9IOntQj0+COdJ3Agx5YsLVGakt8E2OuFE7vMxQUR9bwNUJiRBXADOB8ePpACm82yBikB6FESGRr+C0XaV56Yby+r7JEBZImkD1deGQ22JDr0EJ5TvWd1skuskBcoKydUOsyQ2v89JA5QFkvdAaZEqAZQGqTJASZEqBZQEqXJAtkiVBLJBqixQXKRKA8VBqjyQCakFFIzxi34VobBHDZsfLvJlFpty/pM37bOY7Q8X9TqUbTn/5HcN1NgmtdqgiH9dLZJcvpKZKIqKiKBaQYXk8qXeREC/AEgHzElMV7nVAAAAAElFTkSuQmCC');
}

.go-form:hover,
.reply-icon:hover {
	opacity: 1;
}

.comment-close {
	margin-top: 5em !important;
	font-size: 1.4em;
	color: var(--color-c);
}

.comment-awaiting-moderation {
	flex-shrink: 0;
	color: var(--color-c);
}

.respond {
	margin-top: 3em;
}

#comment-form {
	display: flex;
	flex-direction: column;
	gap: 1em;
	width: 100%;
	max-width: calc(var(--body-width-base) - 2em);
	font-size: 1.4em;
}

#comment-form * {
	outline: none;
	border: 0;
}

#comment-form textarea,
#comment-form input,
#comment-form button {
	font-family: var(--font-family);
	padding: 1em;
	border-radius: 0.25em;
	background-color: var(--wrap-grey);
}

#comment-form textarea {
	width: 100%;
}

.comment-submit {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0.5em;
	margin-bottom: 3em;
}

.comment-submit > * {
	width: 100%;
}

#comment-form button {
	color: var(--color-3);
	background-color: var(--wrap-grey);
	transition: background-color 0.3s ease, color 0.3s ease;
	cursor: pointer;
}

#comment-form button:hover {
	color: var(--color-f);
	background-color: var(--wrap-dark);
}

.cancelreply {
	margin-top: 1em;
}

.comment-logout {
	display: flex;
	align-items: center;
	gap: 0.5em;
}

.cancelreply a,
.comment-logout a {
	color: var(--color-link);
}

.cancelreply a:hover,
.comment-logout a:hover {
	color: var(--color-3);
}

/* -------------------------------------------------------------- mood */

.mood {
	display: inline-block;
	position: relative;
	margin-top: 0.5em;
	width: auto;
	max-width: calc(var(--body-width-base) - 48px - 2em);
	border-radius: 1.5em;
	background-image: -webkit-linear-gradient(left, var(--wrap-grey), var(--wrap-grey-hover));
	background-image: linear-gradient(to right,var(--wrap-grey),var(--wrap-grey-hover));
}

.mood a {
	display: flex;
	align-items: center;
	gap: 0.5em;
	padding: 1.25em;
	color: var(--color-3);
}

.mood span.diff {
	font-size: 1.2em;
}

.mood span.clamp {
	font-size: 1.4em;
}

.mood .diff {
	flex-shrink: 0;
	padding: 0.5em 0.75em;
	color: var(--color-3);
	font-weight: bold;
	border-radius: 2em;
	background-color: var(--wrap-grey-hover);
}

.moodpage .comment-main {
	margin: 0 1em;
}

.moodpage .comment-content a.glightbox::before {
	left: 0;
	width: 100%;
}

.moodpage .lopwon.icon {
	display: inline-block;
	margin: 0 0.15em;
	margin-bottom: -0.15em;
	width: 1.25em;
	height: 1.25em;
}

.moodpage .lopwon.icon img {
	-webkit-transition: transform 0.3s ease;
	transition: transform 0.3s ease;
}

.moodpage .lopwon.icon:hover img {
	-webkit-transform: scale(1.5);
	transform: scale(1.5);
}

.moodpage #comment-form {
	max-width: none;
}

.moodpage .go-form {
	position: -webkit-fixed;
	position: fixed;
	left: calc(50% + var(--body-width) / 2 + 48px);
	bottom: 5.75em;
	width: 48px !important;
	height: 48px !important;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
}

.moodpage .go-form:hover {
	background-color: var(--wrap-button-hover) !important;
	-webkit-transition: background-color 0.3s ease;
	transition: background-color 0.3s ease;
}

/* ------------------------------------------------------------- aside */

#aside-chat,
#aside-index {
	position: -webkit-fixed;
	position: fixed;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100vh;
	background-color: var(--body-color);
	opacity: 0;
	-webkit-transition: left 0s ease, opacity 0.1s ease;
	transition: left 0s ease, opacity 0.1s ease;
	overflow-x: hidden;
	overflow-y: auto;
	z-index: 8;
}

#entry-comments,
#entry-catalog {
	display: flex;
	flex-direction: column;
	gap: 5em;
	margin: calc(48px + 2em) auto;
	padding: 1em;
	max-width: var(--body-width);
	opacity: 0;
	-webkit-transition: opacity 0.2s ease;
	transition: opacity 0.2s ease;
}

#entry-comments > *,
#entry-catalog > div {
	margin: 0 1em;
}

#entry-catalog .title {
	display: flex;
	align-items: center;
	gap: 1em;
	margin-bottom: 1em;
	font-size: 1.8em;
	font-weight: bold;
	color: var(--color-3);
	cursor: default;
}

#entry-catalog .list a {
	color: var(--color-3);
}

#entry-catalog #aim .aim {
	display: block;
	width: 16px;
	height: 16px;
	background-size: 16px;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAD4AAABICAYAAACuukaYAAAAAXNSR0IArs4c6QAABV9JREFUeF7tmnnolkUQxz8mFZEEkURRgn+VdEImJQYFYYR00UVGpyUoZZdmGBGGkBXdB0F0HyRFB5VZYSUqJUlSqUmZWVQQRVRGBxQUX3l+8PS4++zsPvtu2O8ZeP95n9mZ+e7sMTszIximNGKY4qYHPtw833u8gMfHAscA53t03QUsA34qYEvRPf4CcEoA1E3AvP8T8AOA9QZA3wJ7G/g6s5Ta41ribxutLWJTESXV3u6BBzxfxBlFlPQet23yIs4oogS4CHjQhpvjgdeNvMlsgwSuk/ycCnSsgVuA24HngbWxgy38uYEfCpwGnAocaDHAwLMUeAV4GPjFwG9iyQl8OnAjMNqkOZ7pPeBa4M34oduOyAX8AUDAS5DAL+yqqCvwkcD7gJZ4G60DDjIa+wOwR4BXcb+2UzJ1AT4ReMdg4EPAr5Eh68XVoXhki/xvgH1TkacC3wX4rUXp08DdwKqKJzVW12vuOmC8R5dO/ENSwKcCXwEc5VF4GzCn8S0VuMTsCmgiT/To0zNWz9koSgE+F7jZo+VM4FnHty7Ah8TdAlzt0TsFWBKDPBa4DpTnPAraZCn7stlg2KfA/i18k4E3HN9/Bg4HPjPo2MoSA1x76VVgH4fwIwDds230CHBBgOdK4M4Az6XAPQ4eeVyeN1EMcBl0uUOqDLnPoE1ZGG2Foz282iL6fW+Q5YsbzgWeNIw3e1yn+FeO+/XxluShRX8qj6JDhbLN+EGPGz1ygmT1+DWek9OyxINGJDJcBegGaZKuvjUhmVbgui+bkZeWlJbWf0W7AZ87VuGjwIUhoyzAJwErHYK0ZzeEFAz4u4KkWQ0dfwE7hvTWgeuuddElwOmND/K2QtE6fVCgGKBrUb86uZKYejC5rrYvAP22Hm5nAGcbkv2hSdRbWZOhKyk37VcVGkLXoUWvtsJCAX+mAm8ZZOFRIKEXW06aDdyaUeAcAf87o0CJugGYn1mmlrNvK6aoWtYDT5k2z5je4xkns1/qmSZzeO9xJRWUXMhF44BPcgmr5JxVZWFyiZ2qU/2kKjhoS+xZFP4BKDiYaWGO5BlT5fBCHRUWsS8Cl1lCVoV/iuzqpKrGE43/1PFgeUtbjPPx6H2wZ+OjK2RVrU4PmCZ9B3ysPy2PFGVePnQIUcz8ZRcUGcaqctPsmfkT2Ckk2wJcMpQ/Vx69TupSuiKkYIDfRwGbHCtgAXB9SK8VuJb6Uw5hyoB8FFIyoO++3JseNBtDOq3Ad66ec3s1BCrf3dz/IZ05vmubvQQc3BC2CJhqUWAFLlm+a89VQHDpztngp9zacQ4lyhv40t//Yo8BrmWtEq2roOcrJNSV5Wrw86Wp3wKOtXjbeqrXZc0A7vcIb5vEXA1+ypsvduj/vQL97qCAS+5jwHkeBb6sa44S0jRHumvIDGVc77CCTvH4kGyFpDo9XeQqMHQBroNV97XAuUhFCG21KIrZ43XBSu2qXuUjFRrU5aSqqigVuPppFCv4KrNfAwpnoykVuBRNMNTLXquadhTKxrR0KmGpjqnDWhApRLZ2WWwjpgtwCdsBeNlQrNPWaKuC1g37Edg94MLOWZ6uwIfsy50FbcN9chW8RC/v+oBcwCVTT0aVb5P7UgJItFVUNbH0vQcnJSdwKVMIqXqaihTNikfQGA/D6qp8fC+g+zoL5QZeN0pZE02CuVhfG6wuKV1TitKWZ0HaEDJI4HVVSmaomG+hEzzRmWWsmacU8NR73AwklrEHHjtjkfy9xw0TVmQVFlHSIVY3zFMaSynguRr80lA6RpUCLtW5GvyygC8JPGeDX2fwJYF3NjangB54ztncHmT1Ht8evJTTxn8A4Ffn0VIXwW0AAAAASUVORK5CYII=');
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: transform 0.3s ease;
	transition: transform 0.3s ease;
	opacity: 0.3;
	cursor: pointer;
}

#entry-catalog #aim:hover .aim {
	-webkit-transform: scale(1.5);
	transform: scale(1.5);
	opacity: 1;
}

#entry-catalog .list:not(#posts .list) {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em;
	font-size: 1.2em;
}

#entry-catalog .list:not(#posts .list) a {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
	padding: 0.75em 1em;
	border-radius: 2em;
	background-color: var(--wrap-grey);
}

#entry-catalog .list:not(#posts .list) a:hover {
	background-color: var(--wrap-grey-hover);
	-webkit-transition: background-color 0.3s ease;
	transition: background-color 0.3s ease;
}

#entry-catalog .list:not(#posts .list) .current {
	color: var(--highlight-color);
	font-weight: bold;
	background-color: var(--highlight-background);
}

#entry-catalog .list:not(#posts .list) .current:hover {
	background-color: var(--highlight-background);
}

#related a,
#categories a,
#tags a {
	height: 36px;
}

#pages a,
#links a {
	height: 48px;
}

#pages a img,
#links a img {
	width: 24px;
	height: 24px;
}

#pages a img,
#links a img {
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: transform 0.3s ease;
	transition: transform 0.3s ease;
}

#pages a:hover img,
#links a:hover img {
	-webkit-transform: scale(1.25);
	transform: scale(1.25);
}

#posts .list {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 0.5em;
	max-height: var(--max-height);
	overflow-x: hidden;
	overflow-y: auto;
}

#posts .list a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1em;
	position: relative;
	margin-left: 2em;
	margin-right: 0.5em;
	padding: 0.75em 1em;
	min-height: 32px;
}

#posts .list a:hover {
	background-color: var(--wrap-grey);
	-webkit-transition: background-color 0.3s ease;
	transition: background-color 0.3s ease;
}

#posts i {
	font-style: normal;
}

#posts .list span:first-child {
	flex-grow: 1;
	font-size: 1.6em;
	line-height: 1.6em;
}

#posts .list .chat,
#posts .list .date {
	flex-shrink: 0;
	font-size: 1.2em;
	color: var(--color-c);
	text-align: right;
}

#posts .list .chat {

}


#posts .list a:hover .chat,
#posts .list a:hover .date {
	color: var(--color-9);
}

#posts a.current span:first-child {
	color: var(--highlight-color);
	font-weight: bold;
}

/* ----------------------------------------------------------- archive */

main.archive {
	display: flex;
	flex-direction: column;
	gap: 0.25em;
	margin: 0 1em;
}

main.archive .h1,
.archive .article {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

main.archive .h1 {
	margin-left: 1em;
	margin-bottom: 1em;
	font-size: 1.8em;
	font-weight: bold;
	color: var(--color-3);
}

main.archive .article:hover	{
	background-color: var(--wrap-grey);
	-webkit-transition: background-color 0.3s ease;
	transition: background-color 0.3s ease;
}

main.archive .article {
	position: relative;
	margin-left: 1em;
	padding: 1em;
	min-height: 48px;
}

main.archive .title.archive {
	font-size: 1.6em;
	font-weight: normal;
}

main.archive .title.archive a {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	padding-left: 0.5em;
	padding-right: 125px;
	width: 100%;
	height: 100%;
	color: var(--color-3);
	line-height: 48px;
	font-weight: normal;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

main.archive .article .chat,
main.archive .article .date {
	font-size: 1.2em;
	color: var(--color-c);
}

main.archive .article:hover .chat,
main.archive .article:hover .date {
	color: var(--color-9);
}

main.archive .article .chat {
	margin-left: auto;
	margin-right: 1em;
}

main .article .notice {
	font-size: 1.4em;
	color: var(--color-c);
}

main.archive article.article:not(.archive) {
	display: flex;
	flex-direction: column-reverse;
	align-items: flex-start;
	gap: 1em;
}

main.archive article.article:not(.archive):hover {
	background-color: transparent;
}

main.archive article.article:not(.archive)::before {
	content: none;
}

/* ------------------------------------------------------------ search */

.search {
	position: relative;
	flex: 1 1 100%;
	width: 100%;
	max-width: calc(var(--body-width-base) - 2 * 2em);
}

.search input[type="text"] {
	margin: 1em 0;
	padding: 1em 0.75em;
	padding-right: calc(48px + 1.5em);
	width: 100%;
	height: calc(48px + 1.25em);
	font-size: 1.6em;
	color: var(--color-3);
	text-align: center;
	border: 0;
	outline: none;
	border-radius: 24px;
	background-color: var(--wrap-grey);
}

#entry-catalog .list input[type="text"] {
	margin: 0;
}

.search .submit {
	position: absolute;
	top: 50%;
	right: 0.75em;
	margin: 0;
	padding: 0;
	width: 48px;
	height: 48px;
	line-height: 1.5;
	border: none;
	border-radius: 35%;
	background-color: transparent;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

.search .submit:disabled * {
	cursor: no-drop;
}

.search .search-icon {
	display: block;
	width: 48px;
	height: 48px;
	border-radius: 35%;
	background-size: 24px;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABICAYAAABV7bNHAAAFDElEQVR4Ae3Zb2xVdx3H8dUytSB2zLVZBmgZ2dhiFGT8YcA0c2XBmSmDMSE1K07JQocoavwzp9PpjDGxbjKzBSNtH9itEwvDLOiCbJISbCd/ZqpxTmAKgq6kRGnvIrVcXw/mk5NzL/euPedX9LyTV76Pzyc56c1pRT6fvyircNlA2UDZQNlA2UDZQNlA2UDZQEWqqKi4aBSq5p3MYjpTmMyVXMwRTnCcY/RyiBMklucPOlAt9SxgEbMpp6M8SxfPcfR/ZaBxrONTTGc0+ittPETfhTzQUr7MYpLoMM20kruQBqrlOzSSRvto4tCFMNAC2riaNDvNWn46lgdaSQsTKKdBcgxwjolU4ZbdBjaNxYGWspNSGmY/v2Evh/k7f+EcU6mljsVcxxyqKKX1/GAsDVRHN7Wcrx+zmV9zllKbxyo+wUSKNUw9zxF8oPHs4nqKtYd72ctIupKNrKdYr3AzL4QeaDNrKVYzX2WQ0Wotj1JJoX7PYk6HGmgJz1CoftbzOEl0Iz9iGoV6iI0hBqpkH3Mp1Ao6SbL57GY8cf2bRfSkPdA9PEKhHuB+0uhjbKFQT3Eb+bQGquEAU4hrD0s4S1o9yUoK9WF2pDXQatop1Hx6SLNpHOAS4upgVVoDFfvL1U4DIfo2XyCul5lHX9IDTXK6uYpoQ9xANyGaQi/VxHUTu5MeaJHTRVy9LGCQEFWwleXE9XW+lvRAG5yHiesx1hGyRlqJaye3MpzkQM0Ffnjl+SjthOwKephMtG7eTy7JgTqcO4iW40Z6CN0hZhLtRRbSn+RAe52FROtjLn8mdM8zh2ineDcnkxzopHM50Y4ygyFCt4cbiDbM1RxJcqA+5zKiHWYGw4TuV7yXuK7iT0kO1O3MI9orXMdxQtfDXKK9ygyOJTnQNmcZ0QZ5H/sJ3UFmEe0UMzmR5ECbCnzNy3M7nYTsUvZTR7QjzOdUkgN9yfkWcTXzWUK2jK1UEm0Hy5P+oXiL8zRxdbOQc4SqhTXEdR8PouQGuszZz9uJlmM+vQFfr99xOXHdws40Pne00lj0G3CYPsN3iesY8/hbGgOtoYW4BriW46TZBHqpI64W7kLJDzSVF5hEXI/SRJrdxzfGxidX6UHuJa6z3E0raVRPJxOJaw8fIJfmQJM4yDuI6xwf5Ock2Uy6eMt5BvxliH8c3s1jFOpl7uB5kmgqncyhUF/hmyj9gcbRw3so1Bk+zRZGs+tpp45ibeZznEl/IGk2u6mmWI9zPy8xkqq5hy8ykVLaTgO59AeSVrCV89XPD9nCHymnOpbTxHTKbRur+Vf6A0mf5PuUUj+7+AXPcJy4aqhnKTcxmZG0gwYG0h9IauIRKii1Y/QzxKvkqeJiqpnGaLadOzmT/kDSzbTzNsZq2/gIQ+kPJL2LDq5lrPYzVjOY/kBSDZ9nI5Uk1QPUsI5ye4pG/pHqQJEWs4GVjGZdfI9O3kgHy0byuqU+UKQV3M4sruH19BJdPE0nef7bW2l7nSO1cFewgSLVMps5LORSLsH1qkg5BhngD+zjIAc4QaGqeIIPUW4Nnr89+ECRKnkzb3pNFW/gLEOvOc0wpTaOJ7mNctrl+ZcEGShA1bSW+bqd9PxXBBsoQON5glsppRc9/zVBBwpQJT8p8XVr8/xrwg80dl+3BZ6/O/xAYZrAw3ycaP+kke3h/8yH705WMYscz7KJ35b/SzorGygbKBsoGygbKBvo/2egrP8AACSbjwOTqUwAAAAASUVORK5CYII=');
	cursor: pointer;
}

.search .search-icon:hover {
	background-color: var(--wrap-button-hover);
	-webkit-transition: background-color 0.3s ease;
	transition: background-color 0.3s ease;
}

/* --------------------------------------------------------- navigator */

.page-navigator,
.post-navigator {
	display: none;
	margin: 0 auto;
	padding: 1em 0.75em;
}

.post-navigator li {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 0.25em;
	width: auto;
	height: 48px;
	font-size: 1.6em;
	color: var(--color-c);
	background-color: var(--wrap-grey);
	cursor: no-drop;
}

.post-navigator li:hover {
	color: var(--color-9);
	 background-color: var(--wrap-grey-hover);
}

.page-navigator li a {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0 0.5em;
	padding: 1em;
	width: 32px;
	height: 32px;
	font-size: 1.2em;
	color: var(--color-c);
	border-radius: 35%;
}

.page-navigator li a:hover {
	color: var(--color-9);
	background-color: var(--wrap-grey-hover) !important;
}

.post-navigator li a {
	display: -webkit-box;
	padding: 0 1em;
	width: 100%;
	height: 100%;
	text-align: center;
	line-height: 48px;
	-webkit-box-orient: vertical;
	text-overflow: ellipsis;
	-webkit-line-clamp: 1;
	overflow: hidden;
}

.post-navigator li a {
	color: var(--color-3);
	cursor: pointer;
}

.post-navigator li#theNext {
	border-radius: 1em 0 0 1em;
}

.post-navigator li#thePrev {
	border-radius: 0 1em 1em 0;
}

.page-navigator li.current a {
	color: var(--color-3);
	background-color: var(--wrap-grey);
}

.page-navigator li.prev a,
.page-navigator li.next a {
	width: 48px;
	height: 48px;
	color: var(--color-3);
	background-color: var(--wrap-grey);
}

.post-navigator li a,
.post-navigator li span {
	display: -webkit-box;
	padding: 0 1em;
	height: 100%;
	text-align: center;
	line-height: 48px;
	-webkit-box-orient: vertical;
	text-overflow: ellipsis;
	-webkit-line-clamp: 1;
	overflow: hidden;
}

.page-navigator li.prev .prev,
.page-navigator li.next .next {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	line-height: 1.5;
	border-radius: 35%;
	background-size: 24px;
	background-position: 50% 50%;
	background-repeat: no-repeat;
}

.page-navigator li.prev .prev {
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABICAYAAABV7bNHAAAAAXNSR0IArs4c6QAAAwRJREFUeF7tmsurTlEYxn9nYkYSUpiRAUaYuAxcc0m5TUQZSAoTJqSYYHCUKJdSRhgo14H/g/wRwshIzPTU+nRS9n6+vfZlZb/v+Nn77Od3nrW+9a61ZoiqJDATfKoJBKCahASgAJQ3iUSCIkGRoDwCkaA8fjEHRYIiQXkEIkF5/GIOigT93wlaA5wF9gA/gffAbeBHnm3/6ZKH2BHgMbD4LzsfgL3AN99mc2WpgPYDb4F5/7D2GjjW3Lb/ZImAdiQ4CypsfAWW+TabK0sDtDnBWVpj6TOwvLlt/8mSAG1IcFYan/8OOGzosiWlAFqb4Kw2HH0HtgMfDW22pARAq4A3wHrTzXHghanNlg0NaEWCs8l0cgp4ampbkQ0JaAmgn+ttppMzwBNT25psKEDzE5zdppPzwCNT26psCEBa/L0CDppOLgL3TG3rsiEAvZxiFXw59V6tG3df2DegZ8BJ8+OuATdNbWeyPgFpgj1tOrkBXDe1ncr6AvQA0ETr1CxwxRH2oekD0B3gkmnm7hRa85V5sq4B3QKump/4ELhganuTdQlIZu+bTjQ/aSFYXHUFaFFqJp3OXK2DWogiqytAJ4DnhmM1nWo+i62uAB1K2xd1xkcLaCHwCYghVhGRmKTrxg8wzc+8unV3MWn86XYkXc1Bc79umoWiunZ178VUH4BkVovAc6ZrnZyqiy+i+gIks9M0q+ri1c0PXn0CklmtjbRGckrdvLr6QatvQDKr3cSjpmt19eruB6shAGnLVcc8B0zX2glQlz9IDQFIRrVpL0i7TNej2rSfMNGxjyBtNSGN6thnwkStiCBtNCGN6uBwwkRHz7oLtM6ENKqj5wkTwVGS4vJCRUri+osxhLak4aYJvKpGe8NMUHam4VZ1BW+UN8zmJqbuEqcmdd2C7byGWig6xqquAQvgF+cluZqSAcmbLpJrFb0P+JX6uLhInvtfb/P50hPUptdG7wpANdgCUABqNLL+PBQJigRFgvIIRILy+MUcFAmKBOURiATl8Ys5KBKUl6DfT/pcSXra44EAAAAASUVORK5CYII=');
}

.page-navigator li.next .next {
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABICAYAAABV7bNHAAAAAXNSR0IArs4c6QAAAw1JREFUeF7tmsurT1EUxz/XSEZGyP9A/B8GnmXgGinlUaQYYEKJCRNu6UYpMvEqXclz4DHBCAOPGUpIYmakb21103X22mefs8/mrDX9fc+55/s566y7195rAo9GAhPOp5mAA4pkiANyQHlFxDPIM8gzKI+AZ1AeP69BnkGeQXkEPIPy+HkN8gz6tzJoAbAXWAXMB24Bp4FXeTb6u7rkJ7YIuAms/MPOF2ArcKU/m+3vXBLQJWDdXx71J7AGuNHeSj9XlgT0EVjcYON7gHSvH6vt7loS0AdgaeQxPwVIj9vZ6f6qkoCuAqsNFt4FSM8M2t4lJQGtAO4DCw2u3gRILw3aXiUlAcnIRuCi0dFzYC3w1qjvRVYakExsBs4Z3TwJkN4b9Z3LhgAkE1uAaaObB2F58Nmo71Q2FCCZ2AacMrq5HSD9MOo7kw0JSCZ2ASeMbq4D6wEtKovF0IBkVL3ZMaNjrcY3GLWdyGoAJCMHgMNGR+eBSaM2W1YLIBk5BBw0OjoTCr1R3l5WEyC5OArsM9pRgd9h1LaW1QZIRo4Du42OpN1j1LaS1QhIRk4C242OjgD7jdpkWa2AZEQLSS0oLbEzQLVokzQ1A5IRtSRqTWKhHQA1w19jwtTfawckP2pu1eTGYhNwISZK/f1/AqQt22upAGL62gGlfGLLgW8xw6m/1wzIi3TD29QiUN2+JUb3b17dvbp8S4xuoaiuXt29JaYSFpOW+82pqakGqZtXV2+J0TWr6uLVzVtCax2teYpEDRmk7l1dvCUuh11Fi7YTzdCA1LWr0FpiJpxwjGbLNWXT/k6AM5pN+5Rjn4cBzmiOfVIODp8GOOrWB4nSNSjl6PlFOJ8fzdFz6vCCzuUFadAomUE+/hJ51bEJM12uQqx9nUeDps2sP14yg2ITZhrB02d1txY4eo6SgDTFquyYK3yIE1gSplh9DLjhE/k9SL4MmAe8Bs76IHlNRSXxWUrWoMRHq0PugCLvwQE5oLxP1TPIM8gzKI+AZ1AeP69BnkGeQXkEPIPy+HkN8gzKy6BfAlBuSYZMZ3sAAAAASUVORK5CYII=');
}

.navigator-container {
	display: flex;
	justify-content: center;
	align-items: center;
	position: -webkit-fixed;
	position: fixed;
	bottom: 4.75em;
	left: 50%;
	width: auto;
	border-radius: 24px;
	background-color: var(--wrap-light);
	visibility: hidden;
	opacity: 0;
	-webkit-transition: visibility 0.3s, opacity 0.3s;
	transition: visibility 0.3s, opacity 0.3s;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	z-index: 7;
}

.navigator-container.visible {
	visibility: visible;
	opacity: 1;
}

.page-navigator.navigator-container {
	width: auto;
	max-width: calc(var(--body-width-base) - 2 * 2em);
}

.post-navigator.navigator-container {
	width: calc(var(--body-width) - 2 * 2em);
	max-width: calc(var(--body-width-base) - 2 * 2em);
}

/* ----------------------------------------------------------- options */

.options-pannel {
	display: none;
	margin: 0 auto;
	padding: 1em 0.75em;
}

.options-pannel label {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0 0.25em;
	padding: 1em;
	width: auto;
	height: 48px;
	min-width: 72px;
	font-size: 1.2em;
	color: var(--color-3);
	border-radius: 1.75em;
	background-color: transparent;
	cursor: pointer;
}

.options-pannel label:hover {
	background-color: var(--wrap-button-hover);
	-webkit-transition: background-color 0.3s ease;
	transition: background-color 0.3s ease;
}

.options-pannel label > * {
	flex-shrink: 0;
}

.options-pannel input[type="radio"] {
	margin-right: 0.25em;
	cursor: pointer;
	appearance: none;
	width: 16px;
	height: 16px;
	border: 0.25em solid var(--color-c);
	border-radius: 35%;
}

.options-pannel label:hover input[type="radio"] {
	border-color: var(--color-link);
	-webkit-transition: border-color 0.3s ease;
	transition: border-color 0.3s ease;
}

.options-pannel input[type="radio"]:checked {
	border-color: var(--color-link);
	background-color: var(--color-link);
}

.options-container {
	display: flex;
	align-items: flex-start;
	flex-direction: column;
	gap: 1em;
	position: -webkit-fixed;
	position: fixed;
	bottom: 4.75em;
	left: 50%;
	width: auto;
	border-radius: 24px;
	background-color: var(--wrap-light);
	visibility: hidden;
	opacity: 0;
	-webkit-transition: visibility 0.3s, opacity 0.3s;
	transition: visibility 0.3s, opacity 0.3s;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	z-index: 7;
}

.options-container.visible {
	visibility: visible;
	opacity: 1;
}

.options-container > div {
	display: flex;
	padding: 0.75em 0.5em;
	border-radius: 1.75em;
	background-color: var(--wrap-grey);
}

.options-pannel.options-container {
	width: auto;
	max-width: calc(var(--body-width-base) - 2 * 2em);
}

/* -------------------------------------------------------------- tool */

#tool {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1.25em;
	position: -webkit-fixed;
	position: fixed;
	left: calc(50% + var(--body-width) / 2 + 48px);
	bottom: 11.75em;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	opacity: 0.15;
	-webkit-transition: opacity 0.3s ease;
	transition: opacity 0.3s ease;
	z-index: 5;
}

#tool:hover {
	opacity: 1;
}

.go-form,
.reply-icon,
#close-comments,
#close-catalog,
#go-comments,
#go-catalog,
#go-html,
#poi,
#comments-index,
#comments,
#catalog,
#options,
#page-of {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	line-height: 1.5;
	border-radius: 35%;
	background-color: var(--wrap-button);
	background-size: 24px;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	cursor: pointer;
}

#close-comments,
#close-catalog,
#go-comments,
#go-catalog,
#page-of {
	position: -webkit-fixed;
	position: fixed;
	left: calc(50% + var(--body-width) / 2 + 48px);
	bottom: 5.75em;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
}

#close-comments,
#close-catalog {
	top: -5em;
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABICAYAAABV7bNHAAAAAXNSR0IArs4c6QAABDRJREFUeF7tmlmoVlUUx38SBPqUvaigL4KiCGYUoiDkgIJDzhXkLJQDiuIAKjgGKjigKJoKDpWCNmipBYkTCIkoDiCKQi8G2ov2lCBI8r/t68O997tnnbP3OfcT1n79/mvttf7f/6yzz1q7Hb5aZaCd89M6A05QhkKcICcoroi4glxBrqA4BlxBcfx5DXIFuYLiGHAFxfHnNcgV5AqKY8AVFMdfWTVoNvAh0Bu4DZwCLsWF2sx6MDAeeA+4B1wHDibegzIIOgp83kKg64F1iRKQn7Ut+DoGTEm0R4Ob1ASNAU63EuBcYF9kAnOAr1vx8TFwJnKP1+apCToBfJIR3Djgl4IJjAV+zrD9Hvi0oP9mZqkJ+s8Q2D/A8FAzDPDXENW0c8A7BqNkeSVzFIK2KEjQ+8AQ4IkhWUE6AxeBXgZ8XSvoyxw1RgkPNSQsyIVAqAWuGrXfArRgUitIe+p1+4Flc8Dy1qn1VmxpixvheGHcPhtWBkH9w7mnS/b2DYitwPIa2C3AMqOfx+FcdM2IN8HKIEgbjwwkvW2KAhYDO5tgFwE7jPYvAjm/GfFmWFkEKYCpwLfmSP4/HvwQ8JMBFVvrmgZ8ZwXnwZVJkOLIo4KXwKAQ/BXgLWMiLanPaJoNK5sgRbABWJ0dSgPiUcB1M+K/AtYYsYVgVRCkwPYA8wpFWNtoLzA/sc9m7qoiSBsfT/gJoAPpZ2WTI/9VEtQxFN5hkYmdD997zyL9mMyrJEgB9QD07/czRdccdCuo8GFB+9xmVROkAAcEkqyFuDEpFXB9pV/NnWWEQVsQpHBHB5I6GGP/N5Bz1ohPBmsrgtRY06PW3pjJ80BQskaYcd9Ki3RjTAMDOV2tQQbcX4GkP3LaRcGrVlDP8CbrWzDqO+EN9qCgfW6zKgl6N3xrqVEWs9RH0rfa0xgnVtsqCdKH6CRrYBm4HwNJidzVdlMVQZpkqNuYcqlrqO5hqasKgjYBK4xZ5P1Y3QysNPouBCuboCXANmNkRdsdS4Htxj1yw8okaDpwJEdEqk8/BfxEQHXGumYA31jBeXBlETQKOAlYW64Lgd1NAl8A7DImo5brBOBXI94MK4MgNe01/dQsy7JUo1bVAG7MUWM0Y9PUtu6b9nnGPnoEZ2aweBjQI2RZdT/2yTM41Bh5hCVr4PcwrrbA63pwqBqgkU/WuguocfZ3FjD83glQo6yPAa/Rj2pgkpW6BlkvL2jkfDNnBu+HEfQbfXnhkKGmqNVRtK+jPlJWy0M1a1ZO8mvCUyso6wKVatSByOC/yLicUNcXqJS7DmyadDZdVVzB0yRXB9RkK7WCGgNTkB8B3cNdII18yrjEqdGP7gz9CVwu4zRdFkHJ/sG2duQEZfwDTpATFPeQuoJcQa6gOAZcQXH8eQ1yBbmC4hhwBcXx5zXIFeQKimPAFRTHn9egDP5eAZcekEkPBdJIAAAAAElFTkSuQmCC');
	-webkit-transition: top 0.3s ease;
	transition: top 0.3s ease;
	z-index: 9;
}

#close-comments.tip::before,
#close-comments.tip::after,
#close-catalog.tip::before,
#close-catalog.tip::after {
	content: none !important;
}

#go-comments,
#go-catalog {
	bottom: 11.75em;
	z-index: 9;
}

#go-comments,
#go-catalog,
#go-html {
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABICAYAAABV7bNHAAAAAXNSR0IArs4c6QAAA0FJREFUeF7tmTusjFEQx3+3UUiICCo6okBCREFoJAoSjSgQoUDhEfFIEO93kHgkXgUKxKOhoyJRUBBCQSF0GgmFEAqJRIa5Hnt398x35ny7W8w0t9j/nDPnt/+db853+4hoS6Av+LQnEIASDglAAcjXRMJB4aBwkI9AOMjHL3pQOCgc5CMQDvLxix4UDgoH+QiEg3z8ogeFg8JBPgLhIB+/XupBw4G5wFfgAfDJd7Qy2b0CaB2wBRijx3oHHAPOlDlm/iq9AOgQsL3FEQ4DO/KP58/sNqDjwKbEMU4Am/1HzVuhm4Dk57PWWPa5ClrjkjZZtwBdBFbYSvyjugSsrJjjlncD0FVgaWbl1xy5WVt2EtAgQA64MKvSv0m3gCXAd+c6pvROARqicOabqkqL7gCLgS9pqU/RCUAjFc4cX6kDsu+pkz4UXve/5eoGNBq4DswyHuKm6hYZ9Q8VkgyWtUSdgMYqnGnGyq8Ay1V7GVhmzHuqP7e3Rn0lWV2AJgA3gEnGauSxv6pBe6HCY/2lQpK/RaMOQFMVzjhjpWcBuYs1C/lsjXGdNwrpmVFvkpUGNAOQPtJ/6UwVcdJw1RDNhtRC+rn0Inm6PTLqk7KSgGarc0Yld/0tOApsq6CV274l5KkmkO5bxClNKUDzFM7Q1Ib6+QFgt1HbL5OcncaczwrprlHfUlYC0AKFI5OyJXYBBy3CJhrJ3W/MlUlbnHTbqG8q8wIaD8gsMsJYxFZ9EWaUN5XJGkeMC3wEZgKvjfoBMi8geVez0bi56E4ZtSmZrCV7W+I0sN4ibKbxApK5Q2aeVMh7H3mnUzLk8S9jQCpkgLSOHMUdJFOszD3tQgZAGQTrCHk/JANlu3gFTMzd3OugvcCeNpvL1UGuEHWGXEnkatIqpMZ9uQV4AQ3WJj2loQD5l81qHRpza6uSJ5fb88CwhqTn2qS/VVnsX60XkKwlg6H0F3la/ACe6Df2IreozLzJ6ubpWsdjvaa8z1zvV1oJQJ79ez43ACW+ogAUgHy/4nBQOCgc5CMQDvLxix4UDgoH+QiEg3z8ogeFg8JBPgLhIB+/6EHhoHCQj0A4yMcvelA4KBzkIxAO8vGLHhQO8jnoJ/U9Y0nxRq7iAAAAAElFTkSuQmCC');
	visibility: hidden;
	opacity: 0;
	-webkit-transition: opacity 0.3s ease, visibility 0.3s ease;
	transition: opacity 0.3s ease, visibility 0.3s ease;
}

#poi {
	background-size: 20px;
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABICAYAAABV7bNHAAAAAXNSR0IArs4c6QAACHlJREFUeF7VnFfMNVUVhh8SQhUDiIYmLahgvFApUqRKVUQuLAiKgoJAgCCgSAlVpXcExAKKBdAbihqKNI0NFS4MvUgnKmikJ5CQh8wkh/l3nZlzDqxk8p3k7L32mvfbZa13rX0WYvbyVmB7YB3g7cA7mr9+9lH+PfH8q/n8N+A3wP9nafJCMxrsvcAWDTAfGzjmrxqgbgTuGKgr233aAH0B2BvYIGtJvwZ/As4CLu3XPd9rWgA5Sw4AtsmbMEoLAToZuG0UbRNKxgboQw0wu4xtaIG+54FTGqD8PIqMCdCBwBmjWDVMibPoiGafGqYJGAug7wJ7VVrzW8Dnsc6jmpU6z0cAnxo5Cji+pkOo7RgA3QJsUmjIVcDVgH+fKOzTNlsB+DiwQ/O3pPuVwCdKGsbaDAVIf2W5jAHPAhc1z1ib6AeA3ZvnLZnxH29mYy+chgCkD7J2YtQnG1B+CNzXy7p8pzWBPRqglk80/yewel7dgi36AvTNZiOMjXkrsBtwVx+jevRZC/gxsF6i78UNkFXq+wDkEf7TxCh6uFtWWTFe4xsajz2m8dDGDSgesRagDwO/S2h3r3HKz1Nc0u5PMfkSYJsiqQFoCeD3gBtkSPRk/Q+9EeQk4OsJQwx9/lxiaA1AxwBHR5T+APhyyYAzbPN9wNkSkp8Bu5bYUgqQs8bZ4yzqitG1vskbUfS5YuyBNmt7UkoB+jmwc0CTR7lO4rSO8Zz9ue91A9wzQy7AtcC2OQUlAAmMAIXkBODw3CBz/v7bwGERG74I/ChlXwlAci5G6V3RQ3bpDZk9Om/GWO4HKwKGE4phiB6w7oTx2oMDQHYW6cGHPG436iRXlQPo/QmO5ZyG2uhju3SrwW1pgHsh4CPt2kfOBvaPdPSffHtMaQ6gbwAuo5B8sCdB5XR32vcRl3PMnpQ+Qfh7pIH2nNgXoJhnWrTBBQZNuQqlgB0LqKdWrokwnEnPPzWDlgb+G7Hia8CplRZ+Cri8sk+s+aeBX1TqOqRhHEPdlgH+F/oiBVAq5loVeLjCQPecv1a0L2m6buWetArwUESxh4TO4wKSAsjQwZnSFR3GUoKs7ZtjHC9pSLQ/Nh02bEixzyeQctP+SgmSE230iYwnuyKXHQxNUgAZeOondKV2o3w3cHfiRVLLJbcs3wPcUwFS7ICIUiEpgHTDPxoY3FyX3EupHJzYr0qWSWp5uq+cVmpIw1GFHMNfx0KSFEB/iRBQWzXOW6ldnhKbBxrXLJHYEr0pw/90h9UpvT5giwTf+qEXSgGk97paoJM0aw1T6PJymXVFxtG9p0Tci0Kz1uXlMisVmcc7A42jlGwKIEOJJQPKLD54ptSipthgqUB7wwwNKxH/UaFwQzu0p1S0I1T88FwkFEnmxVQUerHFgRdLLUoA9E7g0UI9KwOPBNrWArQY8EKNntQMii0NA0ppjlKJ6alx9mKnWe0Sk/YI5eOielIAxTbX2j0opsf9x32oRNx/Qj5R7SYd24OielIA6Vl+NmC9TpwUSKlIxX4v0rhkFqV8oT0BqdVSkdpondHJPvJdwYKLFEDGWvowXbHex2O3VNyMH0g0TvlCuRBljUquSM/7goAt+lL6VAtICqAYk9iHg86FGvpEhjBtSslQxpAgxRfV+FHti8c4aldKsAirbzT/NuDp0inU1CPOO1hdFngqYnOvaF5d8j5bB5R+LpNdDdkxhCjr6quNB+1vxP6TgGHXpSrhcoxirChKrliQamWehJnghHJhXwXOjL1IDqAYJ+3yel+PGh/tyEXoKdBLTr1Qf323fwAus64M4qRVZkZAoLrSl/pUz6xJ+9jMlayPpdJfe9/cDLKNdYcuta6YlvGIrq0Um9RjENtWjYXSPm01Wg3n07XT2eMBof6uuLRcYlEpAciaG6mPkAyZRSm7xvwute9JcUh1DALIzjJuEmXTmEVjglEzeyTOQozp63SUzCA7bArc/CacRanZsxlgAWpSSgFSyWWAp0hXpEVk6sZ2BHO25753fzRtHeKLTD99JqfA72sA8lqBybeQ9E0kltjYt00sUag+qzq0OSs1AKnsCmDHiNbjEgVWWUNGbuDhYSF5SKpqp2sB8kqT6eiYmAXxTtc8xbtoZiliYoGpHFWR1AKk0lQJsE6l+1EsZV1k1IBGBp3uOzHn71vAkTX6+wC0aHOihWqGHPt8YN8aI0Zsex6wT0SftUCeXC/VjNcHIPVb96eXG5Pa5GKNzbG20reparGimsSu8r4Aqef0hJv+MvDJZlMf4+VzOryw8ktg4UhDw6WDckpC3w8ByKUmlxIrZDDXtFMkk9nH1lgfDw5vD4VyePaRpZTTqlpa7WBDAFLHu4A/JG78SIsYy6U46SFgWdJi5ZgMZ0j+A2wE3Nt3kKEAOW4s393aZLQfiqT72jzZz8t4Kd21dQQL2DQGQCr1bkTq/kPv60gJFO8HzGrExDsjlvAMkrEA0ogcnWqFqvHRGGIGZOOEotFomDEBKgEpy+Bl0FukKdlNXeQbDRxtGRugEpD8qQmdzNLKjhYzQfFAsLg0JqOCMy2ASkCyTc0GqpPnUZ6S0cGZJkClIJkKNkOaEn/BwZ+fmDk40waoFCQrTE0qvhJAwO+COfOJtlOZOa3+aexB3ffMnW62lyIxW9remfDiyXcKymOmCs4sZlALVglIFqZLRVie4kWZ7ea1rCbHncUMaseL5ca7OMgpJZN5Tdo7dfM6g23517MESKuM3Sy+CqWAS6w2trMIqndsVTLIvGZQO64sgJeAiy7VThjrjPGSbq+ovBaYWW7SMdtK9qW279Q345iRs15iXTsMcs+N3Ka2rT+UtN8YQeebcQa1Nku4yfhZ8TEpBrcWFqR+6aHvexf3m/cMag31J3bMY5myUfSLzLNJeM1VXgVKAYdYY/MF0AAAAABJRU5ErkJggg==');
}

#comments-index,
#comments {
	position: relative;
	background-size: 18px;
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABICAYAAABV7bNHAAAAAXNSR0IArs4c6QAAArtJREFUeF7tm72uTFEUx3+j8AYUCrmdQkShErzDzQ06JBoNEhGiQ+W+gk6UJF4CpUokdAoVD0FWzOSeDPf+19lfZ5+ZNdVkZu/18dv/tc46ZzILDl4vgUvA2cFn2/j2C/ARuGPJL5YEfm8jCUfOCwP0AnjiWLyNS/YN0FfgzDZm78j5mwGK8jqCVAASMgpAAcjRaaLE0iF5S2w1L6V76nOnvEAFoEI9KBTkANlnkeRFFSUm+AWgABQllkcgFJTHr2kPks7ychm92zOayJhLDorS2egU8zYEoAKzmzzUUJCDsqQ4eLh/lDmPnbyiGbc7Ssxx+AqpPNQoMQdlSTFKTAnx4AfG6EGHEPA0PI25vxWyekr2oP7S1xEFoLhZ1SrJ6pslS+xZXqyjdltpqL7oiadpiUlnoxDkL1YAzYOMuaSCpLP8nEdZCECOIVgRlYcaCnJQlhQdDdFVz+o4C38fJeY4fMVciiNKzEFZUowSU0LUQ5lZeLpmZr0HDIe7ww7F0zd0tH9XdDcoegPvaZ2snpI9qKfEvbEEoLib92rl/+tCQaGgUFAegVBQHr9iPeh5YhyeYc1M3wZOJ/rI2bY+3P5jyzsHpQRhUBWgi8BjYDfFQYs9UwE6CTxYwjnWItFUH1MAugU8mst/Y2sCsvIa9q4rwH3gauppTrHPAP0ETlRwvgJ0CrgLPASOV/BT0+QvA/QeuFzBiwH6AdwDzlew38LkBwN0A3hdwds7YK+C3ZYmb64eUF0D3rT0PANf14G3wyd454ALwI4zeDlkOe3YslfA9+X61KeKnp+jPSFZHJ+Az7Y4NRjrLyUAWTB2pTNAXb6mBGRQDM5KOQFoSaB71QxPqrWCZqGaKQDNSjWtAc1ONa0AzVY1LQDNWjU1AW2EamoB2hjVlAa0caopCWgjVVMKkCmn23uoUvctfwBtFLmAJXj3/QAAAABJRU5ErkJggg==');
}

#catalog {
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABICAYAAABV7bNHAAAAAXNSR0IArs4c6QAAAb1JREFUeF7tmjFKBEEQRd9ewEi9gYKew9TEwNBbeAtvYSIYCIaCgYlXUAQTQ8HIC8hEJm53FTW7MjPPuLraefv6N930Cv+aBFbyaRMQUMcQAQmoFiIapEEaVCOgQTV+ZpAGaVCNgAbV+JlBIxt0CJwA+42+z8BDZ95In9pP//foD+AJeI82zxp0D5wGmg8QHxt10T6BqdIld8BZdFQW0CewF2h+AVw36qJ9AlOlS76A3eioDKAD4C3Y+BK4WlOb6ROcLl12DLxERglo5JCOLo1FLrGBdTRcFxvSke150dt8JNdmVZMJ6Vl9ePRjBDTyLhYFP5s6DdKgmswapEEaVCOgQTV+2QyawlHjFbipYfkdnQU0lcPqLXA+BqQsoKlcdwwWHW0bUOYm8L9vFL+BHQGtJ/AvgIZ/xyXW0dKQ7gBymx8j2ObUI7vNz+nbQ98iIM9iIVHWFmmQBmlQjYAG1fiZQRq0XYOmcNRoEfGNYsAX3yh2IPlGMWCRbxQ7kDYCaEo3ii0+G1tiw6RTuVFsAdpoSLvNBwJuUSUeNTxq1ITXIA3SoBoBDarxM4M0SINqBDSoxs8M0iANqhHojP4BURNkSV4FT4QAAAAASUVORK5CYII=');
}

#options {
	background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IS0tIFVwbG9hZGVkIHRvOiBTVkcgUmVwbywgd3d3LnN2Z3JlcG8uY29tLCBHZW5lcmF0b3I6IFNWRyBSZXBvIE1peGVyIFRvb2xzIC0tPgo8c3ZnIHdpZHRoPSI4MDBweCIgaGVpZ2h0PSI4MDBweCIgdmlld0JveD0iMCAwIDI0IDI0IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiPg0KICA8cGF0aCBzdHJva2U9IiMwMDAwMDAiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiIgZD0iTTE1IDEyYTMgMyAwIDEgMS02IDAgMyAzIDAgMCAxIDYgMFoiLz4NCiAgPHBhdGggc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjIiIGQ9Ik0xMC40NyA0LjMyYy42MDItMS4zMDYgMi40NTgtMS4zMDYgMy4wNiAwbC4yMTguNDczYTEuNjg0IDEuNjg0IDAgMCAwIDIuMTEyLjg3NWwuNDktLjE4YzEuMzQ4LS40OTggMi42Ni44MTQgMi4xNjIgMi4xNjNsLS4xOC40ODlhMS42ODQgMS42ODQgMCAwIDAgLjg3NSAyLjExMmwuNDc0LjIxOGMxLjMwNS42MDIgMS4zMDUgMi40NTggMCAzLjA2bC0uNDc0LjIxOGExLjY4NCAxLjY4NCAwIDAgMC0uODc1IDIuMTEybC4xOC40OWMuNDk4IDEuMzQ4LS44MTQgMi42Ni0yLjE2MyAyLjE2MmwtLjQ4OS0uMThhMS42ODQgMS42ODQgMCAwIDAtMi4xMTIuODc1bC0uMjE4LjQ3M2MtLjYwMiAxLjMwNi0yLjQ1OCAxLjMwNi0zLjA2IDBsLS4yMTgtLjQ3M2ExLjY4NCAxLjY4NCAwIDAgMC0yLjExMi0uODc1bC0uNDkuMThjLTEuMzQ4LjQ5OC0yLjY2LS44MTQtMi4xNjMtMi4xNjNsLjE4MS0uNDg5YTEuNjg0IDEuNjg0IDAgMCAwLS44NzUtMi4xMTJsLS40NzQtLjIxOGMtMS4zMDUtLjYwMi0xLjMwNS0yLjQ1OCAwLTMuMDZsLjQ3NC0uMjE4YTEuNjg0IDEuNjg0IDAgMCAwIC44NzUtMi4xMTJsLS4xOC0uNDljLS40OTgtMS4zNDguODE0LTIuNjYgMi4xNjMtMi4xNjNsLjQ4OS4xODFhMS42ODQgMS42ODQgMCAwIDAgMi4xMTItLjg3NWwuMjE4LS40NzRaIi8+DQo8L3N2Zz4=');
}

#comments-index sup,
#comments sup {
	position: absolute;
	top: -0.5em;
	right: -0.5em;
	color: initial;
}

#page-of {
	bottom: 5.75em;
	padding: 0 1em;
	width: auto;
	min-width: 48px;
	color: var(--color-3);
	border-radius: 1.75em;
	background-color: transparent;
}

#page-of span {
	flex-shrink: 0;
	white-space: nowrap;
}

.go-form:hover,
.reply-icon:hover,
#close-comments:hover,
#close-catalog:hover,
#go-comments:hover,
#go-catalog:hover,
#go-html:hover,
#poi:hover,
#comments-index:hover,
#comments:hover,
#catalog:hover,
#options:hover,
#page-of:hover {
	background-color: var(--wrap-button-hover);
	-webkit-transition: background-color 0.3s ease;
	transition: background-color 0.3s ease;
}

#page-of:empty:hover {
	background-color: transparent;
	cursor: default;
}

/* ------------------------------------------------------------ filing */

filing {
	display: flex;
	gap: 2em;
	position: absolute;
	right: 1em;
	bottom: -15em;
	margin: 0 1em;
	padding: 1em;
}

filing > * {
	font-size: 1.2em;
}

filing a {
	color: var(--color-c);
}

filing a:hover {
	color: var(--color-9);
}

/* ------------------------------------------------------------- media */

@media (max-width: 1440px) {

	#close-comments,
	#close-catalog,
	#go-comments,
	#go-catalog,
	#tool,
	#page-of,
	.moodpage .go-form {
		left: auto;
		right: 2em;
		-webkit-transform: none;
		transform: none;
	}

}

@media (max-width: 960px) {

	.article.index,
	.article.single {
		margin-top: 1em;
	}

}

@media (max-width: 768px) {

	.comment-head > div,
	.comment-head.fixed > div {
		padding: 0 1em;
		padding-right: calc(3em + 48px);
	}

}

@media (max-width: 640px) {

	body {
		margin-top: 3em;
	}

	.content ol, .content ul {
		margin-left: auto;
	}

	.page-navigator.navigator-container,
	.post-navigator.navigator-container,
	.options-pannel.options-container {
		max-width: calc(100vw - 2em);
	}

	.post-navigator.navigator-container {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: flex-start;
		gap: 1em;
	}

	.post-navigator li {
		border-radius: 1em !important;
	}

	.comment-head {
		padding: 0 1em;
	}

	.mood {
		max-width: calc(100% - 48px - 2em);
	}

	.mood a {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 1em;
	}

	.mood span {
		-webkit-line-clamp: 3;
	}

	.mood span.diff {
		font-size: 1em;
	}

	#tool {
		opacity: 0.7;
	}

	.options-container > div.width {
		display: none;
	}

	.sign .author::before,
	.sign .author::after,
	#related .title span:first-child::before,
	#related .title span:first-child::after,
	#search .title span:first-child::before,
	#search .title span:first-child::after,
	#pages .title span:first-child::before,
	#pages .title span:first-child::after,
	#links .title span:first-child::before,
	#links .title span:first-child::after,
	#posts .title span:first-child::before,
	#posts .title span:first-child::after,
	#posts #aim::before,
	#posts #aim::after,
	#categories .title span:first-child::before,
	#categories .title span:first-child::after,
	#tags .title span:first-child::before,
	#tags .title span:first-child::after,
	.search .submit::before,
	.search .submit::after,
	.go-form::before,
	.go-form::after,
	.reply-icon::before,
	.reply-icon::after,
	#close-comments::before,
	#close-comments::after,
	#go-comments::before,
	#go-comments::after,
	#close-catalog::before,
	#close-catalog::after,
	#go-catalog::before,
	#go-catalog::after,
	#go-html::before,
	#go-html::after,
	#poi::before,
	#poi::after,
	#comments-index::before,
	#comments-index::after,
	#comments::before,
	#comments::after,
	#catalog::before,
	#catalog::after,
	#options::before,
	#options::after,
	#page-of::before,
	#page-of::after {
		display: none;
	}

}

@media (max-width: 480px) {

	main.index,
	main.archive {
		gap: 1.5em;
	}

	main.index h1,
	main.archive .h1 {
		margin-left: 0;
	}

	.article.index.list::before,
	.archive .article::before {
		display: none;
	}

	main.index .article.index.list,
	main.archive .article {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: flex-start;
		gap: 0;
		margin-left: 0;
		padding: 0;
		min-height: 42px;
	}

	main.index .article.index.list:hover,
	main.archive .article:hover {
		background-color: transparent;
		-webkit-transform: none;
		transform: none;
	}

	main.index .title.index.list a,
	main.archive .title.archive a {
		padding-left: 0;
		padding-right: 0;
		min-height: 1.6em;
		line-height: 1.6em;
	}

	main.index .article.index.list .date,
	main.archive .article .date {
		width: auto;
		text-align: left;
	}

	main.index .article.index.list .chat,
	main.archive .article .chat {
		margin-right: 0;
		padding: 0;
		position: absolute;
		bottom: 0;
		left: 75px;
	}

	main .article .notice {
		margin-left: 0;
	}

	.content,
	.comment-content,
	code,
	kbd,
	samp {
		word-break: break-all;
		overflow-wrap: normal;
	}

	#posts .list {
		gap: 1.5em;
	}

	#posts .list a {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 0;
		margin-left: 0;
		padding: 0;
		min-height: 42px;
	}

	#posts .list a:hover {
		background-color: transparent;
		-webkit-transform: none;
		transform: none;
	}

	#posts .list a .pin::before {
		content: '';
		top: 0;
		left: auto;
		right: 0;
		-webkit-transform: none;
		transform: none;
	}

	#posts .list a::before {
		display: none;
	}

	#posts .list span.pin {
		margin-right: 1.5em;
	}

	#posts .list span:first-child {
		min-height: 1.6em;
		line-height: 1.6em;
	}

	#posts .list .chat {
		position: absolute;
		bottom: 0;
		left: 75px;
	}

	#posts .list .date {
		width: auto;
		text-align: left;
	}

	.comment-head > div,
	.comment-head.fixed > div {
		padding-left: 0;
	}

	#entry-comments > * {
/* 		margin: 0;
		margin-right: 1em; */
	}

	.comment-content {
		padding: 0.75em 1em;
	}

	.comment-submit {
		grid-template-columns: auto;
	}

	.options-pannel label {
		padding: 0.5em;
		min-width: 64px;
	}

	filing {
		flex-direction: column;
		gap: 0.5em;
		left: 0;
		right: auto;
	}

}