/* src/Layout/Serial/SerialLayout.css */
/* Дополнительный отступ от шапки */
aside.serial-aside-first { padding: var(--desktop-gap) var(--mobile-gap) 0; }

/* Скрытие шапки при скролле */
header.common-header,
div.common-header-background { transition: transform 0.4s; }
body.scroll-down header.common-header,
body.scroll-down div.common-header-background { transform: translate3d(0, -100%, 0); }
body.scroll-up header.common-header,
body.scroll-up div.common-header-background { transform: none; }


/* Страница чтения комикса */
aside.view-aside-first { margin-bottom: var(--desktop-gap); }
main.view-container div.view-article { padding: 0 var(--mobile-gap); container-type: inline-size; box-sizing: border-box; }
main.view-container aside.view-aside-second { margin: var(--desktop-gap) var(--mobile-gap); box-sizing: border-box; }
main.view-container aside.view-aside-second div.inner { top: var(--desktop-gap); }
main.view-container aside.view-aside-second div.inner>div:first-child { display: none; }

div.view-comments-disallowed { text-align: center; color: #a3a3a3; }

@media screen and (min-height: 300px) {
	main.view-container aside.view-aside-second div.inner { top: calc(54px + var(--desktop-gap)); }
	body.scroll-down main.view-container aside.view-aside-second div.inner { top: var(--desktop-gap); }
}

@media screen and (min-width: 700px) {
	aside.view-aside-first { display: none; }
	main.view-container { display: flex; }
	main.view-container div.view-article {
		flex-grow: 1; flex-shrink: 1; padding: 0 var(--mobile-gap) var(--desktop-gap);
	}
	main.view-container aside.view-aside-second {
		margin: 0 var(--mobile-gap) var(--desktop-gap) 0;
		flex: 0 0 300px;
	}
	main.view-container aside.view-aside-second div.inner { position: sticky; }
	main.view-container aside.view-aside-second div.inner>div:first-child { display: block; margin-bottom: var(--desktop-gap); }
}

@media screen and (min-width: 920px) {
	main.view-container div.view-article { padding: 0 var(--desktop-gap) var(--desktop-gap); }
	main.view-container aside.view-aside-second { margin: 0 var(--desktop-gap) var(--desktop-gap) 0; }
}


/* Страница чтения комикса лентой */
aside.list-aside { margin: var(--desktop-gap) var(--mobile-gap) 0; }
main.list-container { container-type: inline-size; box-sizing: border-box; margin-bottom: var(--desktop-gap); }
main.list-container article.reader-issue-description { margin: 0; }
main.list-container nav.reader-navigator { padding-bottom: 0; }
main.list-container p.list-comments-link { display: flex; margin: 5px var(--mobile-gap); align-items:center; justify-content: flex-end; }
main.list-container p.list-comments-link a {
	display: block; padding: 5px 0 5px 22px;
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' preserveAspectRatio='none' x='0px' y='0px' width='16px' height='16px' viewBox='0 0 16 16'><defs><g id='Layer1_0_FILL'><path fill='%234A6CBC' stroke='none' d='M 10.55 12L 13 12Q 16 12 16 9L 16 3Q 16 0 13 0L 3 0Q 0 0 0 3L 0 9Q 0 12 3 12L 5.5 12 8.05 16 10.55 12M 10.75 5.75Q 11.05 5.5 11.5 5.5 11.9 5.5 12.2 5.75 12.5 6.05 12.5 6.5 12.5 6.9 12.2 7.2 11.9 7.5 11.5 7.5 11.05 7.5 10.75 7.2 10.5 6.9 10.5 6.5 10.5 6.05 10.75 5.75M 3.75 5.75Q 4.05 5.5 4.5 5.5 4.9 5.5 5.2 5.75 5.5 6.05 5.5 6.5 5.5 6.9 5.2 7.2 4.9 7.5 4.5 7.5 4.05 7.5 3.75 7.2 3.5 6.9 3.5 6.5 3.5 6.05 3.75 5.75M 8 5.5Q 8.4 5.5 8.7 5.75 9 6.05 9 6.5 9 6.9 8.7 7.2 8.4 7.5 8 7.5 7.55 7.5 7.25 7.2 7 6.9 7 6.5 7 6.05 7.25 5.75 7.55 5.5 8 5.5 Z'/></g></defs><g transform='matrix( 1, 0, 0, 1, 0,0) '><use xlink:href='%23Layer1_0_FILL'/></g></svg>") no-repeat left 70%;
}

@media screen and (min-width: 640px) {
	main.list-container article.reader-issue-description { margin: var(--mobile-gap) var(--mobile-gap) 0; }
}
@media screen and (min-width: 920px) {
	aside.list-aside { margin: var(--desktop-gap) var(--desktop-gap) 0; }
	main.list-container article.reader-issue-description { margin: var(--desktop-gap) var(--desktop-gap) 0; }
	main.list-container p.list-comments-link { margin: 5px var(--desktop-gap); }
}


/* Страница "О комиксе" */
section.serial-about-text { word-break: break-word; }
section.serial-about-text img { max-width: 100%; }
p.serial-about-authors { word-break: break-word; }
p.serial-about-site-url { word-break: break-word; }
section.serial-about-issues { display: grid; gap: var(--mobile-gap); grid-template-columns: 1fr 1fr; overflow-y: hidden; }

@media screen and (min-width: 520px) {
	section.serial-about-issues { grid-template-columns: 1fr 1fr 1fr; }
}
@media screen and (min-width: 840px) {
	section.serial-about-issues { grid-template-columns: 1fr 1fr 1fr 1fr; }
}
@media screen and (min-width: 920px) {
	section.serial-about-issues { gap: var(--desktop-gap); }
}
nav.serial-about-read-menu {
	margin-top: var(--desktop-gap); border: 1px solid var(--brand-grey); padding: 12px;
	display: flex; flex-direction: column; align-items: center; justify-content: center; }
nav.serial-about-read-menu a { display: block; padding: 8px 10px; line-height: 1; white-space: nowrap; }
@media screen and (min-width: 520px) {
	nav.serial-about-read-menu { flex-direction: row; }
}


/* Страница содержания */
section.serial-content-issues {
    display: grid; gap: var(--mobile-gap); grid-template-columns: 1fr 1fr; overflow-y: hidden;
    margin: var(--desktop-gap) 0;
}

@media screen and (min-width: 520px) {
	section.serial-content-issues { grid-template-columns: 1fr 1fr 1fr; }
}
@media screen and (min-width: 840px) {
	section.serial-content-issues { grid-template-columns: 1fr 1fr 1fr 1fr; }
}
@media screen and (min-width: 920px) {
	section.serial-content-issues { gap: var(--desktop-gap); }
}


/* Страница со списком комментариев комикса */
section.serial-comments-list{ container-type: inline-size; box-sizing: border-box; margin-top: var(--desktop-gap); }


/* Страница с возрастным ограничением */
section.serial-age-restriction { max-width: 600px; margin: 0 auto var(--desktop-gap); line-height: 1.4; }
section.serial-age-restriction img.illustration { display: block; width: 100%; height: auto; }
section.serial-age-restriction p { text-align: center; margin: 0 var(--desktop-gap) var(--desktop-gap); }
section.serial-age-restriction form { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--mobile-gap); padding-bottom: var(--desktop-gap); }
section.serial-age-restriction form button {
    padding: 11px 19px; background: var(--brand-blue); color: #fff;
    box-shadow: inset 0 -2px 0 rgba(0,0,0,.1); border: none;
	text-transform: uppercase; font-size: 13px; font-weight: bold; border-radius: 4px;
}


/* Страница с баннерами комикса */
section.serial-banners-list img { width: 100%; height: auto; }


/* Страница со списком подписчиков */
form.serial-subscriptions-form { margin: 1em 0; }
form.serial-subscriptions-form button {
    padding: 11px 19px; background: var(--brand-blue); color: #fff;
    box-shadow: inset 0 -2px 0 rgba(0,0,0,.1); border: none;
	text-transform: uppercase; font-size: 13px; font-weight: bold; border-radius: 4px;
}

/* Предложка */
p.serial-suggest-intro { word-break: break-word; }

form.serial-suggestion-delete-form { position: relative; color: #fff; }
form.serial-suggestion-delete-form img { display: block; width: 100%; height: auto; max-width: 100% !important; }
form.serial-suggestion-delete-form p.hover {
	position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: 0; padding: var(--mobile-gap) 0 0 var(--mobile-gap);
	background-color: rgba(0,0,0,.7); flex-direction: column; align-items: flex-start; overflow: hidden; display: none;
}
form.serial-suggestion-delete-form:hover p.hover  { display: flex; }
form.serial-suggestion-delete-form span.name {
    display: block; font-size: 22px; font-family: 'yanone_kaffeesatzregular', sans-serif; color: var(--brand-orange);
    overflow-x: hidden; text-overflow: ellipsis; width: 100%; white-space: nowrap;
}
form.serial-suggestion-delete-form span.date { display: block; white-space: nowrap; opacity: 0.8; }
form.serial-suggestion-delete-form span.date span.date-time-formatted { display: inline-block; overflow-x: hidden; text-overflow: ellipsis; width: 100%; }
form.serial-suggestion-delete-form button {
    border: 0; background: 0; color: white; text-decoration: underline;
    cursor: pointer; display: block; text-align: left; padding: 0;
}
@media screen and (min-width: 920px) {
	form.serial-suggestion-delete-form p.hover { padding: var(--desktop-gap) 0 0 var(--desktop-gap); }
}

form.serial-suggest-form {
    background: #f3eee7; padding: 20px; border-radius: 20px;
    display: grid; grid-template-columns: min-content 1fr;
    margin-top: 20px;
}
form.serial-suggest-form div.help { grid-column: span 2; color: #777; padding: 5px 0 20px; }
form.serial-suggest-form div.help p { margin: 0; }
form.serial-suggest-form label { display: block; white-space: nowrap; margin: 4px 20px 4px 0; align-self: center; }
form.serial-suggest-form label[for="input-description"] { grid-column: span 2; }
form.serial-suggest-form input[name="name"] { max-width: 300px; min-width: 50px; }
form.serial-suggest-form div.description { grid-column: span 2; }
form.serial-suggest-form div.buttons { grid-column: span 2; }
form.serial-suggest-form button {
    padding: 11px 19px; background: var(--brand-orange); color: #fff;
    box-shadow: inset 0 -2px 0 rgba(0,0,0,.1); border: none;
	text-transform: uppercase; font-size: 13px; font-weight: bold; border-radius: 4px;
}

/* src/Layout/Serial/Component/AboutBadges/AboutBadges.css */
p.serial-about-badges { display: flex; flex-wrap: wrap; gap: var(--mobile-gap); }
p.serial-about-badges a.badge,
p.serial-about-badges a.badge:visited,
p.serial-about-badges span.badge {
	display: block; padding: 8px 10px; background: var(--brand-orange); color: #fff; box-shadow: inset 0 -2px 0 rgba(0,0,0,.1);
	text-decoration: none; text-transform: uppercase; font-size: 12px; font-weight: bold; border-radius: 4px;
}
p.serial-about-badges a.badge.category { padding-left: 28px; }
p.serial-about-badges a.badge.sandbox { background: #bbb; }
p.serial-about-badges a.badge.translation { background: var(--brand-blue); }
p.serial-about-badges a.badge.featured { background: var(--brand-red); }
p.serial-about-badges span.badge.completed { background: #bbb; }

/* Специальные иконки категорий */
p.serial-about-badges a.badge.category-animal { background: var(--brand-orange) var(--icon-category-animal-url) no-repeat 6px center/18px 18px; }
p.serial-about-badges a.badge.category-drama { background: var(--brand-orange) var(--icon-category-drama-url) no-repeat 6px center/18px 18px; }
p.serial-about-badges a.badge.category-fantasy { background: var(--brand-orange) var(--icon-category-fantasy-url) no-repeat 6px center/18px 18px; }
p.serial-about-badges a.badge.category-gaming { background: var(--brand-orange) var(--icon-category-gaming-url) no-repeat 6px center/18px 18px; }
p.serial-about-badges a.badge.category-humor { background: var(--brand-orange) var(--icon-category-humor-url) no-repeat 6px center/18px 18px; }
p.serial-about-badges a.badge.category-journal { background: var(--brand-orange) var(--icon-category-journal-url) no-repeat 6px center/18px 18px; }
p.serial-about-badges a.badge.category-paranormal { background: var(--brand-orange) var(--icon-category-paranormal-url) no-repeat 6px center/18px 18px; }
p.serial-about-badges a.badge.category-postapocalypse { background: var(--brand-orange) var(--icon-category-postapocalypse-url) no-repeat 6px center/18px 18px; }
p.serial-about-badges a.badge.category-romance { background: var(--brand-orange) var(--icon-category-romance-url) no-repeat 6px center/18px 18px; }
p.serial-about-badges a.badge.category-superheroes { background: var(--brand-orange) var(--icon-category-superheroes-url) no-repeat 6px center/18px 18px; }
p.serial-about-badges a.badge.category-scifi { background: var(--brand-orange) var(--icon-category-scifi-url) no-repeat 6px center/18px 18px; }
p.serial-about-badges a.badge.category-life { background: var(--brand-orange) var(--icon-category-life-url) no-repeat 6px center/18px 18px; }
p.serial-about-badges a.badge.category-steampunk { background: var(--brand-orange) var(--icon-category-steampunk-url) no-repeat 6px center/18px 18px; }
p.serial-about-badges a.badge.category-detective { background: var(--brand-orange) var(--icon-category-detective-url) no-repeat 6px center/18px 18px; }
p.serial-about-badges a.badge.category-history { background: var(--brand-orange) var(--icon-category-history-url) no-repeat 6px center/18px 18px; }

/* Увеличиваем отсупы внутри бейджиков */
@media screen and (min-width: 560px) {
	p.serial-about-badges a.badge,
	p.serial-about-badges a.badge:visited,
	p.serial-about-badges span.badge {
		padding: 8px 18px;
	}
	p.serial-about-badges a.badge.category { padding-left: 34px; background-position: 10px center; }
}

/* src/Layout/Serial/Component/Character/Character.css */
section.serial-character {
    line-height: 1.4; word-break: break-word;
    margin: var(--desktop-gap) 0 0; display: grid;
	grid-template-areas:
		"title"
		"image"
		"about";
}
section.serial-character h2 { grid-area: title; margin-top: 0; }
section.serial-character div.image { grid-area: image; box-sizing: border-box; }
section.serial-character div.image a { display: block; border: 1px solid var(--brand-grey); }
section.serial-character div.image img { display: block; margin: 0 auto; }
section.serial-character div.about { grid-area: about; padding: 1em 0; }
section.serial-character div.about > :first-child { margin-top: 0; }
section.serial-character div.about > :last-child { margin-bottom: 0; }
section.serial-character div.about img { max-width: 100%; }

@media screen and (width > 450px) {
    section.serial-character {
        grid-template-areas:
            "image title"
            "image about";
        grid-template-columns: calc(100px + var(--mobile-gap)) 1fr;
    }
    section.serial-character div.image { padding-right: var(--mobile-gap); }
    section.serial-character div.image a { margin: 0; border: 0; }
    section.serial-character h2 { margin-bottom: 0; }
}

@media screen and (min-width: 920px) {
    section.serial-character {
        grid-template-columns: calc(100px + var(--desktop-gap)) 1fr;
    }
    section.serial-character div.image { padding-right: var(--desktop-gap); }
}

/* src/Layout/Serial/Component/ContentTree/ContentTree.css */
section.serial-content-tree { line-height: 1.4; word-break: break-word; }
section.serial-content-tree img { max-width: 100%; }
section.serial-content-tree h2,
section.serial-content-tree h3 { clear: right; }
section.serial-content-tree a { font-weight: bold; }

/* LAYOUT_LIST_WITH_IMAGE */
section.serial-content-tree ul { padding-left: var(--desktop-gap); }
section.serial-content-tree ul li img { display: block; margin-bottom: var(--mobile-gap); }

@media screen and (min-width: 520px) {
	section.serial-content-tree ul li img { float: right; margin-bottom: 0; max-width: 60%; clear: right; }
}

/* LAYOUT_CENTER_OR_IMAGE */
section.serial-content-tree p.serial-chapters-centered { display: flex; flex-direction: column; align-items: center; gap: var(--mobile-gap); }
section.serial-content-tree p.serial-chapters-centered img { display: block; }

/* LAYOUT_INLINE_OR_IMAGE */
section.serial-content-tree p.serial-chapters-inline { display: flex; flex-direction: row; flex-wrap: wrap; }
section.serial-content-tree p.serial-chapters-inline img { display: block; }

/* LEVEL_SUBTITLE_COLLAPSE */
section.serial-content-tree h3.collapsable {
    text-decoration: underline; text-decoration-style: dashed; text-underline-offset: 3px;
    cursor: pointer; user-select: none;
}
section.serial-content-tree h3.collapsable::after { content: '\25BC'; text-decoration: none; display:inline-block; margin-left: 4px; }
section.serial-content-tree h3.collapsable.collapsed::after { content: '\25B2'; }
section.serial-content-tree h3.collapsable.collapsed + section { display: none; }

/* src/Layout/Serial/Component/IssuePreview/IssuePreview.css */
a.issue-preview, a.issue-preview:visited { display: block; position: relative; color: #fff; }
a.issue-preview img { display: block; width: 100%; height: auto; max-width: 100% !important; }
a.issue-preview p.issue-preview-hover {
	position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: 0; padding: var(--mobile-gap) 0 0 var(--mobile-gap);
	background-color: rgba(0,0,0,.7); flex-direction: column; overflow: hidden; display: none;
}
a.issue-preview:hover p.issue-preview-hover { display: flex; }
a.issue-preview span.issue-preview-number { display: block; font-size: 22px; font-family: 'yanone_kaffeesatzregular', sans-serif; color: var(--brand-orange); }
a.issue-preview span.issue-preview-date { display: block; white-space: nowrap; opacity: 0.8; }
a.issue-preview span.issue-preview-date span.date-time-formatted { display: inline-block; overflow-x: hidden; text-overflow: ellipsis; width: 100%; }
a.issue-preview span.issue-preview-name { display: block; word-break: break-word; }

@media screen and (min-width: 920px) {
	a.issue-preview p.issue-preview-hover { padding: var(--desktop-gap) 0 0 var(--desktop-gap); }
}

/* src/Layout/Serial/Component/ManagerMenu/ManagerMenu.css */

/* src/Layout/Serial/Component/Question/Question.css */
section.serial-faq { line-height: 1.4; word-break: break-word; margin: var(--desktop-gap) 0 0; }
section.serial-faq img { max-width: 100%; }

/* src/Layout/Serial/Component/ReaderComment/ReaderComment.css */
article.reader-comment {
	margin: 0 0 var(--desktop-gap); display: grid;
	grid-template-areas:
		"avatar info"
		"text text"
		"edit edit";
	grid-template-columns: calc(40px + var(--mobile-gap)) 1fr;
}

/* Строка со сылками перед комментарием */
nav.reader-comment-links:has(+ article.reader-comment) { line-height: 1.4; word-break: break-word; margin-bottom: var(--mobile-gap); }

/* Аватарка */
article.reader-comment section.comment-avatar { grid-area: avatar; position: relative; }
article.reader-comment section.comment-avatar a { display: block; }
article.reader-comment section.comment-avatar img { display: block; }
article.reader-comment div.comment-tail {
	position: absolute; bottom: calc(-4px * 0.866 - var(--mobile-gap)); left: 0; right: var(--mobile-gap); margin: 0 auto;
	background: var(--brand-grey); box-sizing: border-box;
	width: 8px; height: calc(8px * 0.866); transform: rotate(60deg) skew(30deg); z-index: 2;
}

/* Информация */
article.reader-comment section.comment-info { grid-area: info; align-self: center; line-height: 1.4; word-break: break-word; z-index: 1; }
article.reader-comment span.comment-username { display: inline-block; margin-right: 10px; font-size: 15px; }
article.reader-comment span.comment-role { display: inline-block; margin-right: 10px; color: var(--brand-orange); }
article.reader-comment span.comment-ipaddress { display: inline-block; margin-right: 10px; color: #757575; }
article.reader-comment span.date-time-formatted { display: inline-block; margin-right: 10px; color: #757575; }
article.reader-comment span.comment-id { display: block; float: right; margin-left: 10px; }
article.reader-comment span.comment-id a { color: #a3a3a3; text-decoration: none; }

/* Блок комментария */
article.reader-comment section.comment-text {
	grid-area: text; background-color: var(--brand-grey); line-height: 1.4; word-break: break-word;
	padding: var(--mobile-gap); margin: var(--mobile-gap) 0 0; z-index: 1;
}
article.reader-comment section.comment-text div.edited { color: #757575; margin-top: var(--mobile-gap); }
article.reader-comment section.comment-text button.comment-expand { display: none; }
article.reader-comment section.comment-text button.comment-collapse { display: none; }

/* Кнопка редактирования */
article.reader-comment section.comment-edit { grid-area: edit; text-align: right; margin-top: var(--mobile-gap); }
article.reader-comment section.comment-edit a {
	display: inline-block; padding-left: 18px;
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' preserveAspectRatio='none' x='0px' y='0px' width='16px' height='16px' viewBox='0 0 16 16'><defs><g id='Layer0_0_FILL'><path fill='%23D00026' stroke='none' d='M 14 4.85L 11 2 3.4 9.55 2 14 6.4 12.5 14 4.85M 4.1 10.25L 5.7 11.9 3.45 12.5 4.1 10.25M 4.9 9.4L 9.35 4.9 10.95 6.55 6.55 11.05 4.9 9.4 Z'/></g></defs><g transform='matrix( 1, 0, 0, 1, 0,0) '><use xlink:href='%23Layer0_0_FILL'/></g></svg>") no-repeat left/16px 16px;
}

/* Подсветка автора */
article.reader-comment.authors section.comment-text { border: 1px solid var(--brand-orange); }
article.reader-comment.authors div.comment-tail { border: 1px solid var(--brand-orange); border-width: 1px 0 0 1px; }

/* Разворачивание/сворачивание комментариев */
article.reader-comment.reader-comment-collapsable section.comment-text {
	max-height: 300px; box-sizing: border-box; overflow: hidden; position: relative;
}
article.reader-comment.reader-comment-collapsable section.comment-text button.comment-expand,
article.reader-comment.reader-comment-collapsable section.comment-text button.comment-collapse {
	background: var(--brand-grey); margin: 0; border: 0; color: var(--brand-blue);
	text-decoration: underline; cursor: pointer; text-align: left;
}
article.reader-comment.reader-comment-collapsable section.comment-text button.comment-expand {
	box-shadow: 0px -10px 10px var(--brand-grey); position: absolute; bottom: 0; left: 0; right: 0;
	padding: 0 var(--mobile-gap) var(--mobile-gap); width: 100%; box-sizing: border-box;
}
article.reader-comment.reader-comment-collapsable section.comment-text button.comment-collapse {
	padding: 5px 0 0;
}
article.reader-comment.reader-comment-collapsable section.comment-text button.comment-expand:hover,
article.reader-comment.reader-comment-collapsable section.comment-text button.comment-collapse:hover {
	text-decoration: none;
}
article.reader-comment.reader-comment-collapsable section.comment-text button.comment-expand {
	display: block;
}

article.reader-comment.reader-comment-collapsable.reader-comment-expanded section.comment-text {
	max-height: none; box-sizing: border-box; overflow: initial; position: relative;
}
article.reader-comment.reader-comment-collapsable.reader-comment-expanded section.comment-text button.comment-expand {
	display: none;
}
article.reader-comment.reader-comment-collapsable.reader-comment-expanded section.comment-text button.comment-collapse {
	display: block;
}

@container (width > 450px) {
	article.reader-comment {
		grid-template-areas:
			"avatar info"
			"avatar text"
			"avatar edit";
	}
	article.reader-comment section.comment-info { background-color: var(--brand-grey); padding: var(--mobile-gap) var(--mobile-gap) 0; }
	article.reader-comment section.comment-text { margin: 0; }
	article.reader-comment div.comment-tail {
		left: auto; right: calc(-4px * 0.866); top: 16px; bottom: auto; margin: 0;
		transform: rotate(-30deg) skew(30deg);
	}
	article.reader-comment.authors div.comment-tail { right: calc(-5px * 0.866); }
	article.reader-comment.authors section.comment-text { border-width: 0 1px 1px; }
	article.reader-comment.authors section.comment-info { border: 1px solid var(--brand-orange); border-width: 1px 1px 0; }
}

@media screen and (min-width: 920px) {
	article.reader-comment {
		grid-template-columns: calc(40px + 18px) 1fr;
	}
	article.reader-comment section.comment-text { padding: var(--mobile-gap) 18px 18px; }
	article.reader-comment section.comment-info { padding: 18px 18px 0; }

	article.reader-comment.reader-comment-collapsable section.comment-text button.comment-expand {
		padding: 0 var(--desktop-gap) var(--desktop-gap);
	}
}

/* src/Layout/Serial/Component/ReaderCommentForm/ReaderCommentForm.css */
form.reader-comment-form { margin: 0; }

form.reader-comment-form section.comment-avatar { grid-area: avatar; display: none; position: relative; }
form.reader-comment-form section.comment-avatar img { border-radius: 50%; }
form.reader-comment-form div.comment-tail {
	position: absolute; right: calc(-5px * 0.866); top: 16px;
	background: #fff; box-sizing: border-box; border: 1px solid var(--brand-blue); border-width: 0 1px 1px 0;
	width: 8px; height: calc(8px * 0.866); transform: rotate(150deg) skew(30deg);
}

form.reader-comment-form section.comment-info {
	grid-area: info; border: 1px solid var(--brand-blue); border-bottom: 1px solid #ccc;
	line-height: 1.4; word-break: break-word; padding: var(--mobile-gap) 0 var(--mobile-gap) var(--mobile-gap);
}
form.reader-comment-form span.comment-username,
form.reader-comment-form a.comment-username { font-size: 15px; }
form.reader-comment-form a.comment-login-link { display: inline-block; margin: 0 var(--mobile-gap); white-space: nowrap; }
form.reader-comment-form a.comment-reg-link { display: inline-block; white-space: nowrap; }

form.reader-comment-form textarea.comment-text {
	grid-area: text; display: block; margin: 0; width: 100%; box-sizing: border-box; min-height: 120px;
	border: 1px solid var(--brand-blue); border-width: 0 1px 1px; padding: var(--mobile-gap);
	line-height: 1.4; word-break: break-word; border-radius: 0;
}
form.reader-comment-form section.comment-captcha {
	grid-area: captcha; background-color: var(--brand-grey); padding: var(--mobile-gap); overflow: hidden;
}
form.reader-comment-form section.comment-submit { grid-area: submit; margin-top: var(--mobile-gap); text-align: right; }
form.reader-comment-form section.comment-submit button {
	padding: 11px 19px; background: var(--brand-blue); color: #fff;
    box-shadow: inset 0 -2px 0 rgba(0,0,0,.1); border: none;
	text-transform: uppercase; font-size: 13px; font-weight: bold; border-radius: 4px;
}

@container (width > 450px) {
	form.reader-comment-form {
		display: grid;
		grid-template-areas:
			"avatar info"
			"avatar text"
			"avatar captcha"
			"avatar submit";
		grid-template-columns: calc(40px + var(--mobile-gap)) 1fr;
	}
	form.reader-comment-form section.comment-avatar { display: block; }
}

@media screen and (min-width: 920px) {
	form.reader-comment-form {
		grid-template-columns: calc(40px + var(--desktop-gap)) 1fr;
	}
	form.reader-comment-form section.comment-info { padding-left: var(--desktop-gap); }
	form.reader-comment-form a.comment-login-link { margin: 0 var(--desktop-gap); }
	form.reader-comment-form textarea.comment-text { padding: var(--desktop-gap); }
	form.reader-comment-form section.comment-captcha {padding: var(--mobile-gap) var(--desktop-gap); }
}

/* src/Layout/Serial/Component/ReaderIssue/ReaderIssue.css */
section.reader-issue { position: relative; }
section.reader-issue img.issue { display: block; width: 100%; height: auto; margin: 0 auto; }

/* Поле для перехода на выпуск */
section.reader-issue a.reader-issue-view { display: block; }

/* Поле для перелистывания вперед */
section.reader-issue a.reader-issue-next { display: block; }
section.reader-issue a.reader-issue-next div.arrow {
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' preserveAspectRatio='none' x='0px' y='0px' width='25px' height='50px' viewBox='0 0 25 50'><defs><g id='Layer0_0_FILL'><path fill='%23BCB7B1' stroke='none' d='M 0 0L 10.35 25.05 0 50 13.4 50 25 25.05 13.4 0 0 0 Z'/></g></defs><g transform='matrix( 1, 0, 0, 1, 0,0) '><use xlink:href='%23Layer0_0_FILL'/></g></svg>") no-repeat center;
	width: 25px; position: absolute; right: var(--mobile-gap); top: 0; bottom: 0;
}

/* Поле для перелистывания назад */
section.reader-issue a.reader-issue-previous {
	display: block; position: absolute;
    width: 25%; height: 100%; left: 0; top: 0; bottom: 0;
}
section.reader-issue a.reader-issue-previous div.arrow {
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' preserveAspectRatio='none' x='0px' y='0px' width='25px' height='50px' viewBox='0 0 25 50'><defs><g id='Layer0_0_FILL'><path fill='%23BCB7B1' stroke='none' d='M 14.65 25.05L 25 0 11.6 0 0 25.05 11.6 50 25 50 14.65 25.05 Z'/></g></defs><g transform='matrix( 1, 0, 0, 1, 0,0) '><use xlink:href='%23Layer0_0_FILL'/></g></svg>") no-repeat center;
	width: 25px; position: absolute; left: var(--mobile-gap); top: 0; bottom: 0;
}

/* Эффект наведения */
section.reader-issue a.reader-issue-next div.arrow,
section.reader-issue a.reader-issue-previous div.arrow { opacity: 0; transition: opacity 0.4s ease; }
@media (hover: hover) {
	section.reader-issue a.reader-issue-next:hover div.arrow,
	section.reader-issue a.reader-issue-previous:hover div.arrow { opacity: 0.6; }
}

@media screen and (min-width: 520px) {
	section.reader-issue a.reader-issue-next div.arrow { right: var(--desktop-gap); }
	section.reader-issue a.reader-issue-previous div.arrow { left: var(--desktop-gap); }
}

@media screen and (min-width: 700px) {
	section.reader-issue a.reader-issue-next div.arrow { right: 60px; }
	section.reader-issue a.reader-issue-previous div.arrow { left: 60px; }
}

/* src/Layout/Serial/Component/ReaderIssueDescription/ReaderIssueDescription.css */
article.reader-issue-description {
	border: 1px solid var(--brand-grey); margin: 0 0 var(--desktop-gap);
	display: grid;
	grid-template-areas:
		"avatar title"
		"text text"
		"edit edit"
		"buttons buttons";
	grid-template-columns: calc(40px + var(--mobile-gap) * 2) 1fr;
}

/* Аватар */
article.reader-issue-description a.issue-description-avatar { display: block; grid-area: avatar; margin: var(--desktop-gap) var(--mobile-gap) 0; }
article.reader-issue-description a.issue-description-avatar img { display: block; width: 40px; height: 40px; }

/* Заголовок */
article.reader-issue-description h2.issue-description-title {
	font-size: 1em; font-weight: normal; word-break: break-word;
	margin: 0; grid-area: title; margin: var(--desktop-gap) 0 0; line-height: 1.4;
}
article.reader-issue-description h2.issue-description-title a.username { display: inline-block; margin-right: 10px; font-size: 15px; }
article.reader-issue-description h2.issue-description-title span.title { display: inline-block; margin-right: 10px; font-weight: bold; }
article.reader-issue-description h2.issue-description-title span.date-time-formatted { color: #999; margin-right: 10px; }

/* Описание */
article.reader-issue-description section.issue-description-text.empty { height: var(--desktop-gap); }
article.reader-issue-description section.issue-description-text {
	grid-area: text; margin: 0 var(--mobile-gap); width: auto; box-sizing: border-box;
	word-break: break-word; line-height: 1.4;
}
article.reader-issue-description section.issue-description-text img { max-width: 100%; }

/* Ссылка на редактирование */
article.reader-issue-description section.issue-description-edit { text-align: right; grid-area: edit; padding: 0 var(--mobile-gap) var(--desktop-gap); }
article.reader-issue-description section.issue-description-edit a {
	display: inline-block; padding-left: 18px;
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' preserveAspectRatio='none' x='0px' y='0px' width='16px' height='16px' viewBox='0 0 16 16'><defs><g id='Layer0_0_FILL'><path fill='%23D00026' stroke='none' d='M 14 4.85L 11 2 3.4 9.55 2 14 6.4 12.5 14 4.85M 4.1 10.25L 5.7 11.9 3.45 12.5 4.1 10.25M 4.9 9.4L 9.35 4.9 10.95 6.55 6.55 11.05 4.9 9.4 Z'/></g></defs><g transform='matrix( 1, 0, 0, 1, 0,0) '><use xlink:href='%23Layer0_0_FILL'/></g></svg>") no-repeat left/16px 16px;
}

/* Кнопки */
article.reader-issue-description section.issue-description-buttons {
	padding: var(--desktop-gap) var(--mobile-gap); border-top: 1px solid var(--brand-grey); grid-area: buttons;
	display: flex; flex-wrap: wrap; gap: var(--mobile-gap); align-items: center;
}
article.reader-issue-description a.serial-top-vote {
	display: block; font-family: 'yanone_kaffeesatzregular', sans-serif; text-transform: uppercase;
	font-size: 18px; padding-left: 20px;
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' preserveAspectRatio='none' x='0px' y='0px' width='16px' height='16px' viewBox='0 0 16 16'><defs><g id='K_0_Layer2_0_FILL'><path fill='%2300AA7B' stroke='none' d='M 60.3 19.05L 43.65 21.9 39.25 3.25 17.3 6.5 19.5 25.65 3.05 27.6Q -5.1 42 8.5 49.75L 21.55 48.05 25.25 60.15Q 40.7 71.45 50.35 56.8L 48.7 43.75 62.75 41.1Q 71.6 25.5 60.3 19.05 Z'/></g><g id='K_0_Layer1_0_FILL'><path fill='%23005B17' stroke='none' d='M 58.35 17.95L 42.95 20.4 38.45 1.75 17.65 5.05 20 24.15 3.05 27.6Q -4.95 39.6 8.6 46.75L 23.9 45.7 27.25 60.2Q 40.95 67.6 48.8 56.75L 47 42.1 61.85 38.05Q 72 24.65 58.35 17.95 Z'/></g><g id='K_0_Layer0_0_FILL'><path fill='%23BEDF15' stroke='none' d='M 5.1 26.65Q 1.65 28.85 2.9 34.55 2.45 31.85 10.05 33 17.65 34.1 20.9 22.65L 5.1 26.65M 22.2 7Q 31.05 13.55 38.25 0.25 27.4 -0.9 18.7 3.55L 20 15Q 19.45 8.1 22.2 7M 58.35 17.95L 42.4 18.85Q 46.2 27.3 49.95 26.3 59.9 22.45 58.35 17.95 Z'/><path fill='%2339B54A' stroke='none' d='M 59.9 35Q 66.75 25.55 58.35 17.95 59.9 22.45 49.95 26.3 46.2 27.3 42.4 18.85L 38.25 0.25Q 31.05 13.55 22.2 7 19.45 8.1 20 15L 20.9 22.65Q 17.65 34.1 10.05 33 2.45 31.85 2.9 34.55L 2.9 34.6Q 3.85 40.55 7.65 43.7L 25.75 41.15 28.95 55.3Q 38.2 63.35 45.95 52.3L 43.8 38.6 59.9 35 Z'/></g></defs><g transform='matrix( 0.240264892578125, 0, 0, 0.245361328125, 0,0) '><g transform='matrix( 1, 0, 0, 1, 0,0) '><use xlink:href='%23K_0_Layer2_0_FILL'/></g><g transform='matrix( 1, 0, 0, 1, 0,0) '><use xlink:href='%23K_0_Layer1_0_FILL'/></g><g transform='matrix( 1, 0, 0, 1, 0,0) '><use xlink:href='%23K_0_Layer0_0_FILL'/></g></g></svg>") no-repeat left;
}
article.reader-issue-description a.serial-top-vote:visited { color: var(--brand-blue); }
article.reader-issue-description span.issue-original-link { display: block; flex-grow: 1; text-align: right; }


@container (width > 450px) {
	article.reader-issue-description {
		grid-template-areas:
			"avatar title"
			"avatar text"
			"avatar edit"
			"buttons buttons";
	}
	article.reader-issue-description a.issue-description-avatar { margin: var(--desktop-gap) var(--mobile-gap); }
	article.reader-issue-description section.issue-description-text { margin: 0 var(--mobile-gap) 0 0; }
}

@media screen and (min-width: 920px) {
	article.reader-issue-description {
		grid-template-columns: calc(40px + var(--desktop-gap) * 2) 1fr;
	}
	article.reader-issue-description a.issue-description-avatar { margin: var(--desktop-gap); }
	article.reader-issue-description h2.issue-description-title { margin: var(--desktop-gap) calc(var(--desktop-gap) - 10px) 0 0; }
	article.reader-issue-description section.issue-description-text { margin: 0 var(--desktop-gap) 0 0; }
	article.reader-issue-description section.issue-description-edit { padding: 0 var(--desktop-gap) var(--desktop-gap); }
	article.reader-issue-description section.issue-description-buttons { padding: var(--desktop-gap) var(--desktop-gap); column-gap: var(--desktop-gap); }
}

/* src/Layout/Serial/Component/ReaderIssueTitle/ReaderIssueTitle.css */
.reader-issue-title {
	padding: 8px var(--mobile-gap); margin: 0; font-size: inherit; font-weight: normal;
	display: flex; justify-content: center; align-items: center; min-height: 40px; box-sizing: border-box;
}
.reader-issue-title span.number-with-name,
.reader-issue-title span.number-without-name { word-break: break-word; display: inline-block; }
.reader-issue-title a { text-decoration: none; display: flex; align-items: center; padding: 0 var(--mobile-gap); }
.reader-issue-title span.number-with-name span.number { color: #a3a3a3; display: inline-block; padding-left: 5px; white-space: nowrap; }

@media screen and (min-width: 640px) {
	.reader-issue-title { font-size: 18px; padding: 18px var(--mobile-gap); }
	.reader-issue-title span.number-with-name span.number { padding-left: 10px; }
}

/* src/Layout/Serial/Component/ReaderMenu/ReaderMenu.css */
section.serial-reader-menu {
	height: 40px; background: var(--brand-grey); overflow: hidden;
	display: flex; justify-content: space-between;
	position: relative; z-index: 50;
}

section.serial-reader-menu button.subscribe-button { flex-shrink: 0; }

section.serial-reader-menu nav { position: relative; height: fit-content; background: var(--brand-grey); }

section.serial-reader-menu ul { list-style: none; margin: 0; padding: 0 40px 0 0; display: flex; flex-grow: 1; flex-wrap: wrap; }
section.serial-reader-menu ul li { height: 40px; display: flex; align-items: center; padding: 0 calc(var(--mobile-gap) - 5px); }
section.serial-reader-menu ul li a { display: inline-block; padding: 10px 5px; }
section.serial-reader-menu ul li a:visited { color: var(--brand-blue); }
section.serial-reader-menu ul li.read-menu-item-full { display: none; }

/* Раскрытие меню, если не помещается на экране */
section.serial-reader-menu nav button.serial-reader-menu-toggle {
	border: none; margin: 0; padding: 0; cursor: pointer;
	position: absolute; right: 0; width: 40px; top: 0; bottom: 40px;
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='16' width='10' viewBox='0 0 320 512'><path fill='%23333333' d='M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z'/></svg>") no-repeat center 10px/20px 20px;
}

/* RSS */
section.serial-reader-menu ul li.css-menu-item a {
	padding-left: 30px;
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' height='16' width='14' viewBox='0 0 448 512'><path fill='%23EFA821' d='M64 32C28.7 32 0 60.7 0 96V416c0 35.3 28.7 64 64 64H384c35.3 0 64-28.7 64-64V96c0-35.3-28.7-64-64-64H64zM96 136c0-13.3 10.7-24 24-24c137 0 248 111 248 248c0 13.3-10.7 24-24 24s-24-10.7-24-24c0-110.5-89.5-200-200-200c-13.3 0-24-10.7-24-24zm0 96c0-13.3 10.7-24 24-24c83.9 0 152 68.1 152 152c0 13.3-10.7 24-24 24s-24-10.7-24-24c0-57.4-46.6-104-104-104c-13.3 0-24-10.7-24-24zm0 120a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z'/></svg>") no-repeat left 5px center/20px 20px;
}

/* Активный элемент меню */
section.serial-reader-menu ul li.active { background: #fff; }
section.serial-reader-menu ul li.active a,
section.serial-reader-menu ul li.active a:visited,
section.serial-reader-menu ul li a.active { color: #111; text-decoration: none; }


/* Разворачивание меню на мобильных устройствах */
section.serial-reader-menu.expanded { overflow: visible; }
section.serial-reader-menu.expanded nav button.serial-reader-menu-toggle {
	max-height: 40px; transform: rotate(180deg);
}

/* Делаем пункт чтения комикса полноразмерным */
@media screen and (min-width: 560px) {
	section.serial-reader-menu ul li.read-menu-item-short { display: none; }
	section.serial-reader-menu ul li.read-menu-item-full { display: flex; }
}

/* Делаем нормальные отступы */
@media screen and (min-width: 920px) {
	section.serial-reader-menu ul { padding: 0 40px 0 calc(var(--desktop-gap) - 10px); }
}

/* src/Layout/Serial/Component/ReaderNavigator/ReaderNavigator.css */
nav.reader-navigator { padding: calc(var(--desktop-gap) - 10px) 5px; }
nav.reader-navigator ul { list-style: none; margin: 0; padding: 0; display: flex; justify-content: center; }
nav.reader-navigator ul li { flex-shrink: 1; }
nav.reader-navigator ul li a { display: block; padding: 10px 5px; color: var(--brand-blue); }
nav.reader-navigator ul li a:visited { color: var(--brand-blue); }
nav.reader-navigator ul li a span {
	display: flex; align-items: center; justify-content: center;
	box-sizing: border-box; height: 40px; white-space: nowrap;
	border-radius: 4px; box-shadow: inset 0 -2px 0 rgba(0,0,0,.1); padding: 0 var(--mobile-gap);
}

nav.reader-navigator ul li.button-content,
nav.reader-navigator ul li.button-random { display: none; flex-grow: 1; flex-basis: 100px; }

nav.reader-navigator ul li.button-first,
nav.reader-navigator ul li.button-last { flex-basis: 65px; }
nav.reader-navigator ul li.button-previous,
nav.reader-navigator ul li.button-next { flex-basis: 90px; }

nav.reader-navigator ul li.button-content a span {
	background: var(--brand-grey) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' preserveAspectRatio='none' x='0px' y='0px' width='16px' height='16px' viewBox='0 0 16 16'><defs><g id='Layer0_0_FILL'><path fill='%234A6CBC' stroke='none' d='M 4 12L 4 10 2 10 2 12 4 12M 4 6L 2 6 2 8 4 8 4 6M 4 2L 2 2 2 4 4 4 4 2M 14 12L 14 10 6 10 6 12 14 12M 14 8L 14 6 6 6 6 8 14 8M 14 4L 14 2 6 2 6 4 14 4 Z'/></g></defs><g transform='matrix( 1, 0, 0, 1, 0,0) '><use xlink:href='%23Layer0_0_FILL'/></g></svg>") no-repeat 6px center;
	padding-left: 28px;
}
nav.reader-navigator ul li.button-first a span {
	background: var(--brand-orange) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' preserveAspectRatio='none' x='0px' y='0px' width='16px' height='16px' viewBox='0 0 16 16'><defs><g id='Layer0_0_FILL'><path fill='%23FFFFFF' stroke='none' d='M 5.1 7.95L 8 1 4.25 1 1 7.95 4.25 15 8 15 5.1 7.95M 11.1 7.95L 14 1 10.25 1 6.95 7.95 10.25 15 14 15 11.1 7.95 Z'/></g></defs><g transform='matrix( 1, 0, 0, 1, 0,0) '><use xlink:href='%23Layer0_0_FILL'/></g></svg>") no-repeat center;
}
nav.reader-navigator ul li.button-previous a span {
	background: var(--brand-orange) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' preserveAspectRatio='none' x='0px' y='0px' width='16px' height='16px' viewBox='0 0 16 16'><defs><g id='Layer0_0_FILL'><path fill='%23FFFFFF' stroke='none' d='M 5 7.95L 8.25 15 12 15 9.1 7.95 12 1 8.25 1 5 7.95 Z'/></g></defs><g transform='matrix( 1, 0, 0, 1, 0,0) '><use xlink:href='%23Layer0_0_FILL'/></g></svg>") no-repeat center;
}
nav.reader-navigator ul li.button-next a span {
	background: var(--brand-orange) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' preserveAspectRatio='none' x='0px' y='0px' width='16px' height='16px' viewBox='0 0 16 16'><defs><g id='Layer0_0_FILL'><path fill='%23FFFFFF' stroke='none' d='M 8.75 15L 12 7.95 8.75 1 5 1 7.9 7.95 5 15 8.75 15 Z'/></g></defs><g transform='matrix( 1, 0, 0, 1, 0,0) '><use xlink:href='%23Layer0_0_FILL'/></g></svg>") no-repeat center;
}
nav.reader-navigator ul li.button-last a span {
	background: var(--brand-orange) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' preserveAspectRatio='none' x='0px' y='0px' width='16px' height='16px' viewBox='0 0 16 16'><defs><g id='Layer0_0_FILL'><path fill='%23FFFFFF' stroke='none' d='M 2 1L 4.9 7.95 2 15 5.75 15 9.05 7.95 5.75 1 2 1M 15 7.95L 11.75 1 8 1 10.9 7.95 8 15 11.75 15 15 7.95 Z'/></g></defs><g transform='matrix( 1, 0, 0, 1, 0,0) '><use xlink:href='%23Layer0_0_FILL'/></g></svg>") no-repeat center;
}
nav.reader-navigator ul li.button-random a span {
	background: var(--brand-grey) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' preserveAspectRatio='none' x='0px' y='0px' width='16px' height='16px' viewBox='0 0 16 16'><defs><g id='Layer0_0_FILL'><path fill='%234A6CBC' stroke='none' d='M 0 2L 0 5Q 2.15 5 4.05 7L 5.8 5.15Q 3.3 2 0 2M 13 8.95L 13 11.15Q 10.7 11.35 8.7 9.15L 7.1 11.2Q 9.6 14.05 13 14.15L 13 16 16 12.65 13 8.95M 13 4.9L 13 7.1 16 3.35 13 0 13 1.9Q 8.7 2 5.9 6.55 3.15 11.05 0 11.05L 0 14.05Q 4.05 14.05 6.9 9.35 9.75 4.55 13 4.9 Z'/></g></defs><g transform='matrix( 1, 0, 0, 1, 0,0) '><use xlink:href='%23Layer0_0_FILL'/></g></svg>") no-repeat 6px center;
	padding-left: 28px;
}

nav.reader-navigator ul li.button-list-big-jump a,
nav.reader-navigator ul li.button-list-small-jump a { text-decoration: none; }
nav.reader-navigator ul li.button-list-big-jump a span,
nav.reader-navigator ul li.button-list-small-jump a span {
	background: var(--brand-orange); color: #fff; font-weight: bold;
}

nav.reader-navigator ul li.button-inactive a span { background-color: var(--brand-grey); }

nav.reader-navigator ul li.button-goto a { text-decoration: none; color: #333; }
nav.reader-navigator ul li.button-goto a span { padding: 0 var(--mobile-gap); background-color: var(--brand-grey); }

@media screen and (min-width: 700px) {
	nav.reader-navigator ul li.button-content { display: flex; justify-content: left; }
	nav.reader-navigator ul li.button-random { display: flex; justify-content: right; }
}

@media screen and (min-width: 920px) {
	nav.reader-navigator { padding: calc(var(--desktop-gap) - 10px) 10px; }
	nav.reader-navigator ul li a { display: block; padding: 10px; }
	nav.reader-navigator ul li a span { padding: 0 var(--desktop-gap); }
	nav.reader-navigator ul li.button-first,
	nav.reader-navigator ul li.button-last { flex-basis: 75px; }
	nav.reader-navigator ul li.button-previous,
	nav.reader-navigator ul li.button-next { flex-basis: 100px; }
	nav.reader-navigator ul li.button-content a span,
	nav.reader-navigator ul li.button-random a span { padding-left: 42px; background-position: 18px center; }
}

/* src/Layout/Serial/Component/ReaderSerialDescription/ReaderSerialDescription.css */
section.reader-serial-description { border: 1px solid var(--brand-grey); word-break: break-word; }

section.reader-serial-description div.description-common { padding: var(--desktop-gap) var(--mobile-gap); }
section.reader-serial-description div.description-common h2 { margin: 0; font-size: 1em; }
section.reader-serial-description div.description-common p { line-height: 1.4; }
section.reader-serial-description div.description-common p:last-of-type { margin-bottom: 0; }

section.reader-serial-description div.description-icons {
	padding: var(--desktop-gap) var(--mobile-gap); background-color: var(--brand-grey);
	display: flex; justify-content: space-evenly; align-items: center;
}
section.reader-serial-description div.description-icons p { margin: 0; }

section.reader-serial-description a.description-up-button {
	display: block; padding: var(--mobile-gap); text-align: center; color: #757575; text-decoration: none;
}
section.reader-serial-description a.description-up-button:hover { color: #111; }

@media screen and (min-width: 920px) {
	section.reader-serial-description div.description-common { padding: var(--desktop-gap); }
}

/* src/Layout/Serial/Component/SerialHeader/SerialHeader.css */
/* Шапка комикса */
header.serial-header { position: relative; background:#edebe9; }
header.serial-header a.inner { display: flex; text-decoration: none; align-items: center; justify-content: center; color: #5a002d; }

/* С картинкой */
header.serial-header img.serial-header-image { max-width: 100%; }

/* Без картинки */
header.serial-header span.serial-header-height { display: flex; align-items: center; }
header.serial-header span.serial-header-name {
	font-family: 'yanone_kaffeesatzregular', sans-serif; font-size: 28px; line-height: 28px;
	padding: var(--desktop-gap) var(--mobile-gap); display: inline-block;
	text-overflow: ellipsis; overflow: hidden; white-space: nowrap; text-align: center;
	width: max(280px, calc(100vw - var(--mobile-gap) * 2 - 20px));
}

/* Ссылки для авторов */
header.serial-header nav.serial-manage { background:#edebe9aa; text-align: center; padding: 5px 10px; }
header.serial-header nav.serial-manage:hover { background:#edebe9cc; }
header.serial-header nav.serial-manage ul { list-style: none; padding: 0; margin: 0; display: flex; justify-content: center; }
header.serial-header nav.serial-manage a { color: black; display: inline-block; padding: 5px 10px; }

/* Ставим ссылки для автора в угол. Название комикса - в несколько строк */
@media screen and (min-width: 560px) {
	header.serial-header nav.serial-manage { position: absolute; top: 0; right: 0; }
	header.serial-header span.serial-header-height { min-height: 100px; }
	header.serial-header span.serial-header-name { white-space: initial; width:100%; }
}

/* Увеличиваем название комикса */
@media screen and (min-width: 700px) {
	header.serial-header span.serial-header-name { font-size: 34px; line-height: 34px; padding: var(--desktop-gap); }
}

/* Увеличиваем шапку */
@media screen and (min-width: 920px) {
	header.serial-header span.serial-header-height { min-height: 120px; }
}