/* SoraKai — вкладки «Главная / Главы» и сведения о произведении. */
.manga-detail .md-content-main { display: block; }
.manga-detail .md-tab-bar {
    display: flex; gap: 7px; align-items: center; flex-wrap: wrap;
    padding: 5px; margin: 0 0 16px; width: max-content; max-width: 100%;
    background: #0f1525; border: 1px solid #303652; border-radius: 12px;
}
.manga-detail .md-tab {
    display: inline-flex; justify-content: center; align-items: center;
    padding: 10px 23px; min-height: 39px;
    font-family: inherit; font-weight: 800; font-size: 13px; line-height: 1.3;
    border-radius: 8px; text-decoration: none; color: #a6b4d4;
    transition: background .18s ease, color .18s ease, box-shadow .18s ease;
}
.manga-detail .md-tab:hover { color: #f0eaff; background: #1e2440; }
.manga-detail .md-tab.is-active,
.manga-detail .md-tab[aria-selected="true"] {
    background: linear-gradient(115deg,#7844ec,#5833c4);
    color: #fff; box-shadow: 0 4px 14px #6b3bd13d;
}
.manga-detail .md-tab:focus-visible { outline: 2px solid #b38cff; outline-offset: 3px; }
.manga-detail .md-tab-panel { min-width: 0; }
.manga-detail .md-tab-panel[hidden] { display: none !important; }
.manga-detail .md-overview { display: grid; gap: 18px; }
.manga-detail .md-overview .md-panel { margin: 0; }
.manga-detail .md-info-rows { display: grid; grid-template-columns: 1fr; margin: 18px 0 0; }
.manga-detail .md-info-row {
    display: grid; grid-template-columns: minmax(135px, 36%) minmax(0, 1fr);
    gap: 15px; align-items: start; padding: 12px 0;
    border-bottom: 1px solid #2b3349;
}
.manga-detail .md-info-row:last-child { border-bottom: 0; }
.manga-detail .md-info-row dt { font-size: 12px; line-height: 1.5; color: #94a2bf; }
.manga-detail .md-info-row dd {
    margin: 0; font-size: 12px; line-height: 1.5; color: #edf0ff;
    font-weight: 700; overflow-wrap: anywhere;
}
.manga-detail .md-info-row dd .md-muted-value { color: #7786a5; font-weight: 500; }
.manga-detail .md-info-row .md-info-alt { font-weight: 500; line-height: 1.7; }
.manga-detail .md-info-alt details { margin-top: 3px; }
.manga-detail .md-info-alt summary {
    display: inline-block; cursor: pointer; color: #b885ff;
    font-weight: 800; margin: 5px 0 3px;
}
.manga-detail .md-info-alt summary:focus-visible { outline: 2px solid #a67aff; outline-offset: 2px; }
.manga-detail .md-info-alt ul { padding-left: 15px; margin: 5px 0; }
.manga-detail .md-related-works-list {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px; margin-top: 18px;
}
.manga-detail .md-work-card {
    display: grid; grid-template-columns: 67px minmax(0,1fr);
    gap: 12px; padding: 10px; align-items: center;
    border: 1px solid #29334d; background: #171c2a;
    border-radius: 14px; min-width: 0; transition: border-color .18s ease, background .18s ease;
}
.manga-detail .md-work-card:hover { background: #202038; border-color: #7052bd; }
.manga-detail .md-work-cover {
    width: 67px; aspect-ratio: 2/3; border-radius: 9px;
    border: 1px solid #353f59; overflow: hidden; background: #24233e;
}
.manga-detail .md-work-cover img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; display: block; }
.manga-detail .md-work-details { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.manga-detail .md-work-title {
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
    overflow: hidden; overflow-wrap: anywhere; font-size: 12px; line-height: 1.4;
    color: #f0eaff; font-weight: 800;
}
.manga-detail .md-work-meta { font-size: 10px; color: #9babcb; }
.manga-detail .md-work-relation { color: #b88aff; font-size: 11px; font-weight: 750; }
@media (max-width: 1050px) {
    .manga-detail .md-related-works-list { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
    .manga-detail .md-info-row { grid-template-columns: minmax(100px, 40%) minmax(0,1fr); gap: 10px; }
    .manga-detail .md-related-works-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
    .manga-detail .md-tab-bar { width: 100%; }
    .manga-detail .md-tab { flex: 1 1 0; text-align: center; padding: 10px 12px; }
    .manga-detail .md-related-works-list { grid-template-columns: 1fr; }
    .manga-detail .md-panel { padding: 16px; }
}
@media (prefers-reduced-motion: reduce) {
    .manga-detail .md-tab, .manga-detail .md-work-card { transition: none; }
}