/* BASIC LAYOUT ----------------------------------------------- */ .wrapper {min-width: 320px; position: relative; background: url(../images/bg.png); padding-top: 40px;} .wrapper-container {max-width: var(--max-width); margin: 0 auto; position: relative; z-index: 20;} .wrapper-main {min-height: 100vh; background-color: var(--bg); box-shadow: 0 30px 60px rgba(0,0,0,0.9);} .header {position: absolute; z-index: 10; left: 0; top: 0; right: 0; height: 80px; padding-left: 30px; padding-right: 65px;} .footer {background: url(../images/logo.svg) 30px center / 40px no-repeat; gap: 30px; line-height: 1.7; background-color: var(--bg-darkest); color: var(--tt-dark); padding: 30px var(--indent); padding-left: 86px;} .col-main {padding-top: 80px;} .col-side {background: url(../images/bg.jpg) center top no-repeat; position: relative; z-index: 9; background-color: var(--bg-dark); color: #fff; padding: 86px 30px; width: 240px;} .col-side::before {content: ''; background: var(--gradient); position: absolute; left: 0; top: 0; width: 100%; height: 100%;} .col-side > * {position: relative; z-index: 1;} .col-main__cols {display: grid; grid-template-columns: minmax(0,1fr) 280px; min-height: 50vh;} .col-main__right {position: relative; margin-top: -85px; z-index: 5;} .col-main__left {padding: var(--indent); padding-top: 34px;} .slider-box {margin-top: -80px; background-color: var(--bg-dark);} .col-main__right .side-block {background-color: var(--bg-2); padding: 30px; padding-bottom: 20px;} .sect--padding, .page-padding {padding: var(--indent); padding-top: 30px;} .hbg {background: var(--bg-dark);} .footer .soc-channels {display: none;} #scrolltop {position: fixed; width: 60px; height: 60px; line-height: 60px; right: 10px; bottom: 10px; z-index: 990; display: none; background-color: var(--bg); color: var(--tt-2); cursor: pointer; font-size: 24px; border-radius: 50%; text-align: center; box-shadow: 0 5px 10px rgba(0,0,0,0.1);} /* HEADER, NAV ----------------------------------------------- */ .logo {display: inline-flex; flex-direction: column; justify-content: center; height: 60px; width: 200px; margin-right: 70px;} .logo span {color: var(--accent);} .logo__title {text-transform: uppercase;color: #fff;font-size: 22px;letter-spacing: 5px; font-weight: 400;line-height: 1;font-family: 'Fredoka One', sans-serif;} .logo__caption {font-size: 10px; font-weight: 500; color: #fff; opacity: 0.9; text-transform: uppercase; letter-spacing: 3px; margin-top: 5px;} .header__btn, .footer__btn {background: var(--bg-btn-dark); box-shadow: var(--bsh-btn-dark); color: #fff; gap: 10px;} .header__search {position:relative; width: 400px;} .header__search input, .header__search input:focus {padding: 0 60px 0 20px; border-radius: 20px; background: var(--bg-btn-dark); box-shadow: var(--bsh-btn-dark); color: #fff;} .header__search input:not(:focus)::placeholder {color: #fff; opacity: 0.6; font-size: 14px;} .header__search button {position:absolute; right: 0; top: 0px; padding: 0; width: 60px; background: none; color: #fff; font-size: 14px;} .soc-channels {gap: 10px; margin-right: var(--indent);} .soc-channels__item {display: flex; flex-direction: column; justify-content: center; position: relative; background: var(--bg-btn-dark); box-shadow: var(--bsh-btn-dark); border-radius: 50%; background-position: center center; background-repeat: no-repeat; width: 40px; height: 40px;} .tlg {background-image: url(../images/i-tlg.svg); background-size: 16px;} .vk {background-image: url(../images/i-vk.svg); background-size: 20px;} .yt {background-image: url(../images/i-youtube.svg); background-size: 20px;} .bslide {height: 350px; padding: 0; color: #fff;} .bslide:before {height: 100%; opacity: 1; background: var(--gradient-2);} .bslide__desc {position: absolute; z-index: 1; left: 0; right: 0; bottom: 0; padding: 0 var(--indent); padding-bottom: 40px;} .bslide__title {font-size: 24px; font-weight: 700; max-width: 500px; margin-bottom: 5px;} .bslide__text {line-height: 1.3; margin: 15px 0 25px 0; max-width: 600px; -webkit-line-clamp: 4; opacity: 0.8;} .bslide__btn-trailer {background: var(--bg-btn-dark); box-shadow: var(--bsh-btn-dark); margin-left: 10px;} /* TOP ITEM ----------------------------------------------- */ .carou {padding: 30px var(--indent); margin-top: -80px; padding-top: 85px; background-color: var(--bg-dark); position: relative; padding-bottom: 60px;} .carou__content:not(.owl-carousel) {display: flex; overflow: hidden;} .carou__content > .top {width: calc((100% - 75px)/6); flex-shrink: 0; margin-right: 15px;} .top {background-color: var(--bg-darkest);} .top__desc {position: absolute; left: 0; right: 0; bottom: 0; z-index: 10; padding: 15px; color: #fff;} /* SECTION ----------------------------------------------- */ .sect:not(:last-child) {margin-bottom: 60px;} .sect__header {margin-bottom: 23px;} .sect__title {font-size: 24px; font-weight: 700;padding: 0 0 10px 0;} .sect__subtitle {font-size: 21px;} .desc {display: grid; grid-gap: 20px; line-height: 1.7; color: var(--tt-3); background: var(--bg-2); padding: 60px var(--indent);} .desc h1, .desc h2, .desc h3 {font-weight: 700; font-size: 18px; color: var(--tt); line-height: 1.3;} .desc a {text-decoration: underline;} .desc ul li {position: relative; padding-left: 25px; margin-left: 25px;} .desc ul li::before {content:"\f00c"; font-weight: 300; font-family:'Font Awesome 5 Pro'; color: var(--accent-blue); position: absolute; left: 0; top: 0;} .speedbar {font-size: 14px; color: var(--tt-3); background-color: var(--bg-2); margin: 0 var(--indent-negative); margin-bottom: -60px; margin-top: 30px; padding: 30px var(--indent);} .speedbar a:hover {text-decoration: underline;} /* POSTER ITEM ----------------------------------------------- */ .poster__img {box-shadow: var(--bsh-poster); border: 5px solid #fff; } .poster__label {display: flex; align-items: center; gap: 8px; padding: 6px 10px; font-size: 12px; border-radius: 0 0 0 3px; background: var(--accent-green); color: #fff; position: absolute; right: 0; top: 0; z-index: 3;} .poster__label .fal {font-size: 14px;} .blue {background-color: var(--accent-blue);} .red {background-color: var(--accent-red);} .green {background-color: var(--accent-green);} .gray {background-color: var(--accent-gray);} /*.gold {background-color: var(--accent-gold);} */ .poster__series {position: absolute; left: 0; bottom: 0; z-index: 3; padding: 5px 10px 1px 10px; font-size: 12px; background-color: var(--bg); color: var(--tt-3); border-radius: 0 3px 0 0;} .poster__trailer {display: flex; align-items: center; gap: 10px; height: 40px; padding: 0 10px; font-size: 12px; text-transform: uppercase; font-weight:700; border-radius: 0 3px 3px 0; cursor: pointer; position: absolute; left: 0; top: 30px; z-index: 6; background-color: rgba(0,0,0,0.5); color: #fff;} .poster__trailer .fal, .bslide__btn-trailer .fal {width: 20px;height: 20px;border-radius: 50%;background: var(--bg);color: var(--tt-3);font-size: 10px;color: #000;padding-left: 2px} .poster__trailer span {display: none;} .poster__btn-info {position: absolute; right: 0; top: 0; z-index: 6; border-radius: 0 0 0 3px; opacity: 0; width: 30px; height: 30px; padding: 0 0 5px 4px; font-size: 18px; background: var(--bg); color: var(--tt-3);} .has-overlay__icon {position: absolute; z-index: 5; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); opacity: 0;} .has-overlay__icon div {width: 80px; height: 80px; border-radius: 50%; font-size: 24px; border: 2px solid rgba(255,255,255,0.8); color: #fff; padding-left: 4px;} .poster:hover .poster__btn-info, .has-overlay:hover .has-overlay__icon {opacity: 1;} .poster:hover .poster__trailer span {display: block;} .poster:hover .poster__label {opacity: 0;} .poster__desc {position: relative; padding: 12px 0 0 5px} .pmovie__related .poster__desc {padding-right: 5px;} .poster__title {font-size: 16px; font-weight: 700; color: var(--tt); width: 153px;} .poster__subtitle {color: var(--tt-2); font-size: 14px; margin-top: 5px;padding: 0 0 5px 0;} .poster__rating-likes, .pmovie__ratings-score {font-weight: 700; font-size: 12px; width: 30px; height: 30px; border-radius: 50%; position: absolute; right: 5px; top: 15px; border: 1px solid var(--accent-blue); color: var(--accent-blue);} .poster__trailer:hover {background-color: #000;} .poster__btn-info:hover {color: #000; cursor: help} .poster__rating {height: 17px; width: 170px; position: relative; background: url(../dleimages/rating.svg);} .poster__rating-fill {position: absolute; left: 0; top: 0; height: 100%; width: 0; transition: width 1s ease-in-out; z-index: 1; background: url(../dleimages/rating.svg) 0 -34px repeat-x;} .th-active {z-index: 100;} .th-text {display: none; background-color: var(--bg); cursor: auto; padding: 20px; text-align: left; position: absolute; z-index: 1000; left: 100%; top: 0; width: 460px; box-shadow: var(--bsh); border-radius: 4px; min-height: 100px;} .th-text::after {content: ""; border: 10px solid var(--bg); position: absolute; top: 30px; right: 100%; border-left-color: transparent; border-bottom-color: transparent; } .pop-left .th-text::after {border: 10px solid var(--bg); border-right-color: transparent; border-bottom-color: transparent; left: 100%; right: auto;} .pop-left .th-text {left: auto; right: 100%;} /*.th-text-loader {text-align: center; font-size: 18px; color: var(--accent-green); padding-top: 20px;} */ .th-text-loader {text-align: center; font-size: 18px; color: var(--accent-blue); padding-top: 20px;} .th-text-header {display: block; text-decoration: underline; font-weight: 700; font-size: 18px; color: var(--accent-blue);} .th-text .not-shown-ajax, .th-text .page__subcol-header h1, .th-text .pmovie__quality {display: none;} .th-text .poster__label {border-radius: 0 4px 0 4px;} .th-text .pmovie__original-title, .th-text .pmovie__ratings-votes {color: var(--tt-2);} .th-text .page__text {font-size: 14px; line-height: 22px; max-height: 110px; overflow: hidden; margin-top: 6px;} .th-text .pmovie__header-list {background: none; padding: 0; margin: 16px 0; font-size: 13px;} .th-text .pmovie__header-list li + li {margin-top: 5px;} .th-text .pmovie__ext-rating {margin-top: 10px;} /* SIDEBAR ----------------------------------------------- */ .side-block:not(:last-child) {margin-bottom: 50px;} .side-block__title {font-weight: 700; font-size: 18px; margin-bottom: 30px;} .side-block__menu > li > a {padding: 15px 0 15px 60px; margin: 0 -30px; border-bottom: 1px solid var(--bdc-dark); color: #fff; display: block;} .side-block__menu li {position: relative; font-size: 16px;} .side-block__menu li .fal {position: absolute; left: 0px; top: 18px; pointer-events: none; color: var(--tt-dark);} .side-block__menu > li > a:hover {background-color: var(--bg-btn-dark);} .side-block__menu-hidden {position: absolute; left: 100%; top: 0px; z-index: 999; background-color: var(--bg-2); box-shadow: var(--bsh); padding: 30px; width: 400px; column-gap: 30px; column-width: 150px; visibility: hidden; opacity: 0; transform: translateX(30px);} .side-block__menu-hidden li {margin-bottom: 10px;} .side-block__menu > li:hover .side-block__menu-hidden {visibility: visible; opacity: 1; transform: translateX(0);} .popular + .popular {margin-top: 20px;} .popular .poster__subtitlei {color: var(--tt-dark);} .popular__img {width: 60px; height: 60px; margin-right: 10px; box-shadow: var(--bsh-2); border-radius: 3px;} .popular__title {line-height: 1.4; -webkit-line-clamp: 2; color: #fff;} .popular:hover {text-decoration: underline;} .lcomm:not(:last-child) {border-bottom: 1px solid var(--bdc-dark); margin: 0 -30px; padding: 0 30px; padding-bottom: 20px; margin-bottom: 20px;} .lcomm {font-size: 13px;} .lcomm__link {display: block; font-size: 12px; color: var(--tt-2); text-transform: uppercase; padding-left: 1px;} .lcomm__date {font-size: 12px; color: var(--tt-2); margin-left: 10px;} .lcomm__text {margin: 8px 0 10px 0; opacity: 0.66; -webkit-line-clamp: 3;} .lcomm__author {font-weight: 500;} .lcomm__av {width: 24px; height: 24px; border-radius: 50%; margin-right: 10px;} .updli:not(:last-child) {border-bottom: 1px dashed var(--bdc-darker); padding-bottom: 15px; margin-bottom: 15px;} .updli-2 {font-size: 13px; color: var(--tt-3);} .updli-2 div {color: var(--tt); font-weight: 500; font-size: 13px; margin-bottom: 2px;} .updli-3 {text-align: right; margin-left: 15px; font-size: 12px; line-height: 1.1; color: var(--tt-3);} .updli-3 div {color: var(--accent); font-weight: 500; margin-bottom: 5px;} .upd-box-title {background: var(--bg-dark); color: #fff; font-weight: 700; padding: 10px 30px; margin: 0 -30px; margin-bottom: 15px; text-align: left;} .updli:hover {text-decoration: underline;} /* FOOTER, PAGINATION ----------------------------------------------- */ .footer__btn {margin: 0 30px; height: 30px; border-radius: 15px; padding: 0 15px; text-transform: none;} .footer__text {font-size: 13px; line-height: 1.7;} .pagination {text-align: center; padding-top: 10px;} .pagination__pages > a, .pagination__pages > span, .pagination__pages-btn > a, .pagination__pages-btn > span {display: inline-block; margin: 10px 8px 0 0; line-height: 35px; padding: 0 10px; min-width: 35px; font-size: 14px; border: 1px solid var(--bdc); border-radius: 20px;} .pagination__pages1 > span:not(.nav_ext), .pagination__pages a:hover, .pagination__btn-loader a:hover, .pagination__pages-btn > a {background: var(--accent); color: #fff; border-color: var(--accent);} .pagination__pages--full a, .pagination__pages--full span {line-height: 30px; min-width: 30px; font-size: 14px;} .pagination__pages > span:not(.nav_ext), .pagination__pages-btn > span {background: var(--bg-2); color: var(--tt-3);} /* INNER PAGE ----------------------------------------------- */ .page__subcols {padding: 30px var(--indent); margin: 0 var(--indent-negative); margin-top: -120px; padding-top: 124px; background-color: var(--bg-2); position: relative; margin-bottom: 30px; display: grid; gap: 30px 30px; grid-template-areas: "pside pheader pinfo" "pside pmeta pinfo" "pside pctrl pinfo"; grid-template-columns: 200px minmax(0,1fr) 240px; align-items: start; align-content: start;} .page__subcol-side {grid-area: pside;} .page__subcol-header {grid-area: pheader;} .page__subcol-meta {grid-area: pmeta; align-self: start;} .page__subcol-info {grid-area: pinfo; background: var(--bg-2); padding: 20px 30px 0 30px; margin-right: var(--indent-negative);} .page__subcol-ctrl {grid-area: pctrl; align-self: end; top: -4px;} .page__subcols > * {position: relative; z-index: 4;} .page__subcols::before {content: ''; position: absolute; left: 0; top: 0; right: 0; height: 230px; background: var(--bg-dark);} .page__subcols1::after {content: ''; position: absolute; left: 0; right: 0; top: 100px; height: 140px; z-index: 3; background: var(--gradient-4);} .blurred-bg {position: absolute; left: 0; top: 0; z-index: 1; width: 100%; height: 230px; overflow: hidden; background: var(--bg-dark);} .blurred-bg img {width: 100%; height: 100%; object-fit: cover; filter: grayscale(0.8) blur(0px);} .blurred-bg::after {content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 100%; background: var(--gradient-2);} .pmovie__poster {width: 200px; height: 300px; box-shadow: var(--bsh-poster); border: 5px solid #fff; border-radius: 2px;} .page__subcol-header h1 {font-size: 22px; font-weight: 700; color: #fff;} .page__subcol-header h1 a {margin-left: 10px; font-size: 14px; font-weight: 400; color: #fff; opacity: 0.5;} .pmovie__ratings-votes {color: var(--tt-dark); margin-left: 13px; font-size: 12px;} .pmovie__original-title {color: var(--tt-dark); text-transform: uppercase; font-size: 12px; margin-top: 6px; margin-bottom: 3px; font-weight: 500; letter-spacing: 1px;} .pmovie__subcaption {margin-top: 20px; margin-bottom: 10px;} .pmovie__year {margin-bottom: 6px;} .pmovie__quality div {background: var(--bg-accent); display: inline-block; padding: 6px 13px; border-radius: 3px; font-weight: 500; margin: 4px 10px;} .pmovie__genres {color: var(--tt-2); margin-top: 20px;} .pmovie__ext-rating {width: 78px; font-weight: 500; font-size: 16px; margin-top: 20px;} .pmovie__ext-rating-slide {width: 78px; font-weight: 500; font-size: 16px; margin-top: 8px;} .pmovie__ext-rating--imdb {padding-left: 38px; background: url(../images/imdb.svg) 0 center / 30px auto no-repeat;} .pmovie__ext-rating--kp {padding-left: 26px; background: url(../images/kp.svg) 0 center / 20px auto no-repeat;} .page__subcols .bslide__btns .bslide__btn-trailer {background-color: var(--accent-gray); box-shadow: none; gap: 10px; padding-left: 6px;} .pmovie__header-list {line-height: 1.5; color: var(--tt);} .pmovie__header-list li {position: relative;} .pmovie__header-list li + li {margin-top: 11px;} .pmovie__header-list li > span:first-child, .pmovie__header-list li > div:first-child {color: var(--tt-2); margin-right: 5px;} /*.pmovie__header-list li a {border-bottom: 1px dotted var(--accent-green); color: var(--accent-green);} */ .pmovie__header-list li a {border-bottom: 1px dotted var(--accent-blue); color: var(--accent-blue);} .page__text {grid-column: 1 / -1;} .page__subtitle {font-size: 16px; font-weight: 700; grid-column: 1 / -1; padding: 10px 0 0px 0;} .page__subtitle.tac {margin-bottom: 30px; text-align: center; padding: 0;} .pmovie__player {position: relative; margin-bottom: 30px;} .tabs-block__select span {cursor: pointer; display: inline-block;} .tabs-block__select span {height: 40px; line-height: 40px; padding: 0 20px; margin: 0 10px 10px 0; background-color: var(--bg-2); color: var(--tt-3); font-weight: 500;border-radius: 4px;} .tabs-block__select span.is-active, .tabs-block__select span:hover { background: var(--accent); color: #fff; border-radius: 4px;} .pmovie__player-bottom {background-color: var(--bg-accent);padding-left: 15px;} .ya-share2 {height: 24px; margin-left: 10px;} .pmovie__complaint a {display: grid; place-items: center; width: 50px; height: 50px; font-size: 24px; background: var(--bg-darkest); color: #fff;} .pmovie__player-bottom-2 {background-color: var(--bg-dark); color: #fff; padding: 15px;} .pmovie__ratings-score {position: static; width: 40px; height: 40px; font-size: 14px; margin-left: 15px;} .pmovie__player-bottom-222 .pmovie__ratings-score {color: var(--accent-green); border-color: var(--accent-green);} .pmovie__rating-likes > * {display: flex; align-items: center; height: 40px; border-radius: 20px; background-color: var(--accent-blue); color: #fff; box-shadow: var(--bsh-2); padding: 0 20px 0 15px; font-weight: 500; margin-left: 10px;} .pmovie__rating-likes > * .fal {font-size: 16px; margin-right: 10px;} .pmovie__rating-likes > * + * {background-color: var(--accent-red);} .pmovie__rating-likes > a:hover, .pmovie__fav a:hover, .pmovie__complaint a:hover {background-color: var(--accent); color: #fff;} .pmovie__fav a {display: flex; align-items: center; justify-content: center; font-weight: 500; height: 40px; border-radius: 20px; padding: 0 20px; margin-right: 15px; letter-spacing: 1px; font-size: 12px; text-transform: uppercase; background-color: var(--bg-darkest);; color: var(--tt-dark);} .pmovie__franchise .sect__title {font-size: 20px; margin-bottom: 15px;} .fr-list {counter-reset: num; display: flex; flex-direction: column-reverse; margin-bottom: -30px;} .fr::before {content: counter(num); counter-increment: num; width: 40px; text-align: center; margin-top: -1px; color: var(--accent); font-weight: 500; position: absolute; left: 0px; top: 50%; transform: translateY(-50%);} .fr {cursor: pointer; position: relative; padding: 6px 10px; padding-left: 40px; border-radius: 3px;} .fr:nth-child(2n) {background-color: var(--bg-2);} .fr__title {display: inline-block; max-width: 100%; line-height: 20px; height: 20px; font-weight: 500;} .fr:hover {box-shadow: var(--bsh); z-index: 3;} .fr__year {color: var(--tt-2); margin: 0 10px; font-size: 13px;} .fr__rating {background: var(--accent-gray); color: #fff; font-weight: 700; font-size: 12px; width: 30px; height: 30px; border-radius: 15px;} .clrrating-1, .clrrating-2, .clrrating-3, .clrrating-4 {background-color: var(--accent-red);} .clrrating-7, .clrrating-8 {background-color: var(--accent-green);} .clrrating-9, .clrrating-10 {background-color: var(--accent-gold);} .is-active .fr__title {font-weight: 700; color: #000;} .fr.is-active::before {content: ""; display: block; left: 13px; background-size: 13px 15px; background-repeat: no-repeat; width: 13px; height: 15px; background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='13px' height='15px' viewBox='0 0 13 15' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cg id='Page-1' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='sprite' transform='translate(-170.000000, -111.000000)' fill='%23000000' fill-rule='nonzero'%3E%3Cg id='play_black' transform='translate(170.000000, 111.000000)'%3E%3Cpath d='M12.508581,8.36085 L1.50873,14.86076 C1.033253,15.14173 0.420037,14.98404 0.139074,14.50857 C0.048028,14.35449 0,14.1788 0,13.99984 L0,1 C0,0.44772 0.447715,0 1,0 C1.178966,0 1.354653,0.04803 1.50873,0.13908 L12.508581,6.63899 C12.984057,6.91996 13.141741,7.53317 12.860778,8.00865 C12.774963,8.15388 12.653806,8.27503 12.508581,8.36085 Z' id='Triangle'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); } .pmovie__related .poster__desc {padding-right: 5px;} .pmovie__related .d-grid {grid-template-columns: repeat(auto-fill,minmax(130px,1fr)); grid-gap: 30px 15px;} .pmovie__related .poster__title {font-size: 12px;} .pmovie__related .poster__subtitle {font-size: 12px;} /* TEXT BLOCK, TYPOGRAPHY, VIDEO BLOCK ----------------------------------------------- */ .full-text {line-height: 1.7; font-size: 15px; word-wrap: break-word;} .full-text a {text-decoration: underline; color: #5278b1;} .full-text img:not(.emoji), .full-text p, .full-text h1, .full-text h2, .full-text h3, .full-text h4, .full-text h5, .full-text > ul, .full-text > ol, .full-text table, .page__title {margin-bottom: 20px;} .full-text > img[style*="left"], .full-text > .highslide img[style*="left"] {margin:0 10px 10px 0;} .full-text > img[style*="right"], .full-text > .highslide img[style*="right"] {margin:0 0 10px 10px;} .full-text > ul li, .full-text > ol li {padding-left: 60px; position: relative;} .full-text > ul li:before {content: ''; width: 8px; height: 8px; border-radius: 50%; border: 3px solid var(--accent); position: absolute; top: 5px; left: 34px;} .full-text > ol {counter-reset: num;} .full-text > ol li:before {content: counter(num); counter-increment: num; background-color: var(--accent); color: #fff; position: absolute; top: -2px; left: 17px; width: 24px; height: 30px; font-size: 14px; font-weight: 500; display: flex; justify-content: flex-end; align-items: center; padding-right: 6px; box-sizing: border-box;} .full-text > ol li:after {content: ''; border: 10px solid transparent; border-left-color: var(--accent); position: absolute; left: 41px; top: -2px; transform: scale(0.66,1.5); transform-origin: 0 0;} .full-text > ul li + li, .full-text > ol li + li {margin-top: 10px;} .full-text table, .video-inside > * {width:100%;} .full-text table tr td {padding:10px; border:2px solid #fff;} .full-text table tr:nth-child(2n+1) {background-color:#f2f6f9;} .full-text table tr:nth-child(1) {background-color:#cee0ed;} .full-text table img:not(.emoji) {margin:0; max-width:350px} .full-text > *:last-child {margin-bottom: 0;} .video-responsive {padding-top: 60%; position: relative; background-color: #000;} .video-responsive > iframe, .video-responsive > video {position: absolute; left: 0; top: 0; width: 100%; height: 100%;} .full-text h1, .full-text h2, .full-text h3, .full-text h4, .full-text h5 {font-size: 21px;} .full-text iframe {width: 100%; height: 400px; margin-bottom: 20px;} /* COMMENTS ----------------------------------------------- */ .page__comments {margin: 0;} .page__comments-title {font-size: 22px; font-weight: 500; margin-bottom: 20px;} .page__comments-info {font-size: 14px; margin-bottom: 15px; margin-top: -15px; color: var(--tt-3); line-height: 1.5;} .page__comments-info .fal {color: #eb4d4b; margin-right: 6px;} .page__comments-list {padding: 0;} .page__comments-list--not-comments {padding: 0; border: 0;} .add-comments-form.form {padding: 0; margin-bottom: 20px;} .add-comments-form .form__input, .add-comments-form__input, .add-comments-form .form__textarea-inside textarea, .mass_comments_action select {box-shadow: inset 0 0 0 1px #e3e3e3; border-radius: 0;} .add-comments-form__input {margin-left: 20px;} .add-comments-form .d-none, .comments_subscribe + br {display: none;} .mass_comments_action {display: flex; align-items: center; max-width: 800px; white-space: nowrap; margin-bottom: 20px;} .mass_comments_action select {flex: 1 1 0; margin: 0 10px 0 20px;} .mass_comments_action .bbcodes {border-radius: 0; padding: 0 10px;} .comment-item__title {font-weight: 500; font-size: 18px; margin-bottom: 20px;} .comment-item {margin-bottom: 20px; padding-bottom: 15px; border-bottom: 1px solid var(--bdc);} .comment-item__img {width: 40px; height: 40px; border-radius: 50%; margin-right: 10px;} .comment-item__letter {width: 100%; height: 100%; text-transform: uppercase; font-weight: 500; position: absolute; left: 0; top: 0; z-index: 5; color: #fff; font-size: 18px;} .comment-item__author {font-weight: 500; font-size: 14px;} .comment-item__date {color: var(--tt-3); margin-top: 4px; font-size: 12px;} .comment-item__main {margin: 8px 0 6px 0; font-size: 15px;} .comment-item__rating {white-space: nowrap; font-size: 14px;} .comment-item__rating a {margin-left: 6px;} .comment-item__rating a > span:first-child {color: var(--accent-green); margin-right: 2px;} .comment-item__rating a:last-child > span:first-child {color: var(--accent-red);} .comment-item__reply a {font-size: 12px; margin-right: 20px; color: var(--tt-2);} .comment-item__reply a .fal {margin-left: 5px;} .comment-item__reply + .comment-item__reply a .fal {margin-left: 0; margin-right: 5px;} .comment-item__controls {text-align: right; font-size: 12px; margin-right: -15px;} .comment-item__controls li {display: inline-block; vertical-align: middle; margin: 0 0 0 10px; height: 16px; line-height: 16px;} .comment-item__controls a:not(:hover) {color: var(--tt-2);} .comment-item__footer a:hover {text-decoration: underline;} .comment-item__rating a:hover > span:first-child {text-decoration: none;} .comment-item__controls .checkbox {transform: scale(0.8,0.8); margin-left: 5px;} /* LOGIN ----------------------------------------------- */ .login {position: fixed; z-index: 999; left: 50%; top: 50%; transform: translate(-50%,-50%); overflow: hidden; background-color: var(--ui-bg); border-radius: 4px; width: 400px; box-shadow: 0 0 0 10px rgba(255,255,255,0.2), 0 15px 45px rgba(0,0,0,1);} .login__header {padding: 20px 40px; background-color: var(--ui-bg-darker);} .login__title {font-size: 17px; font-weight: 500; padding: 1px 0; text-transform: capitalize;} .login__close {cursor: pointer; font-size: 24px; opacity: 0.6; margin-left: 20px;} .login__title a {border-bottom: 1px dotted var(--tt-3); margin-left: 10px; font-weight: 400; color: var(--tt-3);} .login__content {padding: 20px 40px;} .login__row {margin-bottom: 20px; position: relative; display: block; font-size: 14px; color: var(--tt-3);} .login__caption {font-size: 14px; color: var(--tt); margin-bottom: 10px;} .login__caption a {text-decoration: underline; margin-left: 6px; color: var(--accent);} .login__input input {padding-left: 40px;} .login__row .fal {opacity: 0.5; position: absolute; left: 0; bottom: 0; line-height: 40px; width: 40px; text-align: center;} .login__row button {width: 100%;} .login__social {background-color: var(--ui-bg-darker); padding: 20px 40px; text-align: center;} .login__social-caption {font-size: 11px; text-transform: uppercase; margin-bottom: 10px;} .login__social-btns a {display:inline-block; margin: 0 3px; vertical-align:top;} .login__social-btns img {display:block; width:30px; height: 30px; border-radius: 50%;} .login__avatar {width: 40px; height: 40px; border-radius: 50%; margin-right: 10px;} .login__menu {padding-left: 35px; padding-right: 35px; margin-bottom: -10px;} .login__menu li {flex: 1 1 0; min-width: auto; max-width: 100%; margin: 0 5px 10px 5px;} .login__menu a {display: block; border-radius: 6px; padding: 10px; text-align: center; white-space: nowrap; background-color: var(--ui-bg-darker); box-shadow: inset 0 0 10px rgba(0,0,0,0.1); font-size: 13px;} .login__menu .fal {display: block; height: 30px; font-size: 24px; opacity: 0.3;} /** * Owl Carousel v2.3.4 * Copyright 2013-2018 David Deutsch * Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE */ .owl-carousel {width: 100%; position: relative; z-index: 1;} .owl-carousel .owl-stage {position: relative; display:flex; justify-content:flex-start;} .owl-carousel .owl-stage-outer {position: relative; overflow: hidden; transform: translate3d(0px, 0px, 0px);} .owl-carousel .owl-item {position: relative; min-height: 10px;} .owl-carousel .owl-nav.disabled, .owl-carousel .owl-dots.disabled, .owl-carousel.owl-refresh .owl-item {display: none;} .owl-carousel.owl-loaded, .owl-carousel.owl-loading, .no-js .owl-carousel {display: block; opacity: 1;} .owl-carousel.owl-drag .owl-item {user-select: none;} .owl-carousel.owl-grab {cursor: move; cursor: grab;} .owl-carousel .animated {animation-duration: 1000ms; animation-fill-mode: both;} .owl-carousel .owl-animated-in {z-index: 0;} .owl-carousel .owl-animated-out {z-index: 1;} .owl-carousel .fadeOut {animation-name: fadeOut;} @keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } .owl-height {transition: height 500ms ease-in-out;} .owl-carousel .owl-item .owl-lazy {opacity: 0; transition: opacity 400ms ease;} .owl-carousel .owl-item img.owl-lazy {transform-style: preserve-3d;} .owl-nav {position: absolute; left: 0; right: 0; top: 50%;} .owl-prev, .owl-next {display: flex; cursor: pointer; box-shadow: none; width: 40px; height: 40px; border-radius: 20px; background: none; color: #fff; position: absolute; top: 0; font-size: 28px; margin-top: -20px;} .owl-prev {left: -50px;} .owl-next {right: -50px;} .owl-prev:hover, .owl-next:hover {background: var(--bg-2) !important; color: #000 !important;} .owl-dots {text-align: center; position: absolute; left: 0; right: 0; bottom: -37px;} .owl-dot {display: inline-block; width: 16px; height: 16px; border-radius: 50%; cursor: pointer; background: var(--bg); margin: 0 5px; box-shadow: var(--bsh-2);} .owl-dot.active, .owl-dot:hover {background: var(--accent-blue);} #owl-big .owl-nav {left: auto; top: auto; bottom: 40px; right: calc(var(--indent) + 280px); display: flex; gap: 10px;} #owl-big .owl-prev, #owl-big .owl-next {position: static; height: 40px; font-size: 18px; background-color: #fff; color: var(--tt-3); border-radius: 50%;} #owl-big .owl-dots {bottom: 0px; display: flex; gap: 0 5px; left: var(--indent); right: var(--indent);} #owl-big .owl-dot {flex: 1 1 0; height: 10px; border-radius: 0; margin: 0; opacity: 0.6;} #owl-big .owl-dot.active {opacity: 0.6;} .slider-box:not(.owl-carousel) {overflow: hidden; display: flex;} .slider-box:not(.owl-carousel) > * {flex-shrink: 0; width: 100%;} /* ADAPTIVE, MOBILE MENU ----------------------------------------------- */ .overlay {position: fixed; z-index: 998; left: 0; top: 0; width: 100%; height: 100%; opacity: 0.6; background-color: #000; cursor: pointer; display: none;} .mobile-menu {width: 280px; height: 100%; overflow-x: hidden; overflow-y: auto; padding: 10px 20px; z-index: 999; position: fixed; left: -320px; top: 0; transition: left .4s; background: var(--bg-dark); color: #fff;} .mobile-menu.is-active {left: 0;} .mobile-menu-close {cursor: pointer; display: block; left: 280px; top: -40px; position: fixed; z-index: 999; width: 40px; height: 40px; line-height: 40px; text-align: center; font-size: 18px; opacity: 0; background-color: #e84e36; color: #fff; transition: top .4s, opacity .4s;} .mobile-menu-close.is-active {top: 0px; opacity: 1;} body.mobile-menu-is-opened {overflow: hidden; width: 100%; height: 100%;} .mobile-menu .header__menu, .mobile-menu .side-block__menu-hidden {margin: 0; padding: 10px 20px; display: block; width: calc(100% + 40px); margin: -10px -20px 25px -20px; max-width: none;} .mobile-menu .header__menu > li {width: 100%; margin: 0; padding: 0;} .mobile-menu .header__menu > li > a {color: #fff;} .mobile-menu .side-block__menu-hidden li {font-size: 14px;} .mobile-menu .side-block__menu-hidden {background-color: var(--bg-2); position: static; opacity: 1; visibility: visible; transform: none; border: 0; padding-top: 20px; margin-top: 0; margin-bottom: 0;} @media screen and (max-width: 1220px) { body {background-image: none;} .wrapper {padding: 0; background-image: none; overflow: hidden;} .wrapper-container {max-width:1000px;} .col-side .js-this-in-mobile-menu, .pagination__pages-btn, .poster__btn-info {display: none !important;} .header__btn-menu {cursor: pointer; width: 40px; height: 40px; border-radius: 50%; line-height: 40px; text-align: center; box-shadow: var(--bsh-2); background: var(--accent); color: #fff; display: block; margin-left: 10px; font-size: 18px;} .header {position: relative; padding: 0 var(--indent);} .header__search {flex: 1 1 0; max-width: 100%; min-width: 50px;} .carou {padding-left: var(--indent); padding-right: var(--indent); padding-bottom: 60px;} .col-main {padding-top: 0;} .col-side {width: 100%; padding: 30px var(--indent); order: 10; background-image: none;} #scrolltop {width: 40px; height: 40px; line-height: 40px; font-size: 18px;} .logo {width: auto;} .d-grid-mob {display: grid; grid-template-columns: repeat(auto-fill,minmax(240px,1fr)); grid-gap: 20px 20px;} .d-grid-mob > * {margin: 0 !important;} .lcomm {padding-left: 0 !important; padding-right: 0 !important;} .pmovie__header-list li + li {margin-top: 5px;} .page__subcols {grid-template-areas: "pside pheader" "pside pmeta" "pside pctrl" "pinfo pinfo"; grid-template-columns: 200px minmax(0,1fr);} .page__subcol-info {padding: 0; margin: 0;} } @media screen and (max-width: 950px) { .wrapper-container {max-width:768px;} .carou__content > .top {width: calc((100% - 60px)/5);} .d-grid, #dle-content {grid-gap: 30px 20px;} .col-main__cols {display: block;} .col-main__right {margin-top: 20px;} .col-main__left {padding: var(--indent); padding-top: 34px;} .slider-box {margin-top: -84px; background-color: var(--bg-dark);} .col-main__right .side-block {background-color: var(--bg-2); padding: 30px; padding-bottom: 20px;} .footer {justify-content: center; text-align: center; background-image: none; padding: 20px;} .footer__text {min-width: 100%; margin: 0;} .col-main__right .side-block__content {display: grid; grid-template-columns: repeat(auto-fill,minmax(240px,1fr)); grid-gap: 15px 20px;} .col-main__right .side-block__content > * {margin: 0 !important;} #owl-big .owl-nav {right: var(--indent);} .header .header__btn span:last-child {display: none;} .header .header__btn {width: 40px; padding: 0; font-size: 18px;} .speedbar {margin-bottom: -20px;} .page__subcols {gap: 30px 20px;} .pmovie__player {margin-left: var(--indent-negative); margin-right: var(--indent-negative);} .tabs-block__select span {margin: 0; flex: 1 1 0; min-width: auto; max-width: 100%; white-space: nowrap; text-align: center;} .pmovie__related .d-grid {grid-template-columns: repeat(auto-fill,minmax(170px,1fr)); grid-gap: 30px 20px;} } @media screen and (max-width: 760px) { .wrapper-container {max-width:640px;} .carou__content > .top {width: calc((100% - 30px)/3);} .carou {margin-top: -120px; padding-top: 140px;} .header__search {order: 10; min-width: 100%; margin: 0;} .header {height: 120px;} .slider-box {margin-top: -120px;} .bslide {height: 390px;} .logo {flex: 1 1 0; min-width: 50px; max-width: 100%; margin-right: 20px;} .page__subcols {margin-top: -150px; padding-top: 150px;} .blurred-bg, .page__subcols::before {height: 260px;} .pmovie__player-bottom-2 .pmovie__ratings {order: 10; min-width: 100%; justify-content: center; padding-top: 10px;} .pmovie__ratings-caption {flex-grow: 1; text-align: right;} .page__text .quote {margin-left: var(--indent-negative); margin-right: var(--indent-negative); padding-right: var(--indent);} .full-text h1, .full-text h2, .full-text h3, .full-text h4, .full-text h5 {font-size: 18px;} .add-comments-form__input {min-width: 100%; margin: 0 0 10px 0;} .add-comments-form__btn {width: 100%; order: 10;} .add-comments-form .form__row--protect .form__caption {width: 100%; margin: 0 0 10px 0;} .mass_comments_action, .comment-item__controls, .comment-item__rating-caption {display: none;} } @media screen and (max-width: 590px) { .wrapper-container22 {max-width:480px;} .login {max-width: 90%; max-height: 90%; overflow-x: hidden; overflow-y: auto;} .login__header, .login__content, .login__social, .pages-bg {padding-left: 20px; padding-right: 20px;} .carou__content > .top {width: calc((100% - 30px)/3);} .footer .btn {width: 100%;} .header .soc-channels {display: none;} .footer .soc-channels {display: flex;} .page__subcols {grid-template-areas: "pheader" "pside" "pmeta" "pinfo" "pctrl"; grid-template-columns: minmax(0,1fr);} .page__subcols .bslide__btns .bslide__btn-watch {flex-grow: 1;} .page__subcol-header, .page__subcol-meta {text-align: center;} .page__subcol-side {justify-self: center;} .page__subcol-header .pmovie__ratings {justify-content: center; padding-top: 10px;} .page__subcols {padding-top: 140px;} .blurred-bg, .page__subcols::before {height: 360px;} .pmovie__ext-ratings {justify-content: center; text-align: left;} .pmovie__quality {margin-top: 10px; margin-bottom: -15px; justify-content: center;} .pmovie__ratings-caption, .pmovie__share-caption {display: none;} .pmovie__player-bottom-2 {justify-content: space-between;} .fr {margin: 0 var(--indent-negative); padding-right: 20px;} .pmovie__fav {margin: 0;} } @media screen and (max-width: 470px) { .wrapper-container22 {max-width:360px;} .carou__content > .top {width: calc((100% - 20px)/3); margin-right: 10px;} .top__desc {padding: 10px; font-size: 13px;} .header__logo > * {white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} #owl-big .owl-nav {display: none;} .bslide__btns {flex-wrap: nowrap;} #dle-content, .d-grid {grid-template-columns: repeat(auto-fill,minmax(140px,1fr)) !important;} .poster .poster__title {font-size: 14px; width: 100px;} .poster .poster__subtitle {font-size: 12px;} .poster__rating-likes {top: 15px;} } .filter-block {margin-bottom: 0px; margin-block-start: -5px;} .filter-block__form {display: flex; flex-wrap: wrap;} .filter-block__cell {margin-left: 10px;} .filter-block__cell--full-width {grid-column: 1 / -1;} .filter-block__cell-caption {margin-bottom: 10px;} .filter-block__cell-content > * {width: 100%; display: block;} .filter-block__cell-content--two-columns {display: flex; justify-content: space-between;} .filter-block__cell-content--two-columns > * {width: calc((100% - 10px)/2) !important;} .filter-block__cell-content select, .filter-block__cell-content input[type="text"], .filter-block__cell-content--check-group {height: 40px; line-height: 36px; background-position: right 14px top 54%; background-color: var(--bg); color: var(--tt); border: 2px solid var(--bdc); border-radius: 20px; box-shadow: none; font-size: 14px; padding: 0 15px; background-size: 10px; display: inline-block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: auto; box-sizing: border-box;} .filter-block__cell-content select {padding: 0 30px 0 10px;} .filter-block__cell-content input[type="text"]::placeholder {opacity: 1; color: var(--tt); font-size: 14px;} .filter-block__cell-content input[type="text"]:focus::placeholder {opacity: 0;} .filter-block__cell-content--inp-year input {width: 80px !important;} [data-dlefilter="reset"] {width: 40px; background-color: var(--bg-2); color: var(--tt-2); padding: 0; font-size: 18px; border: 1px solid var(--bdc);} @media screen and (max-width: 1220px) { .filter-block {width: 100%; margin-bottom: -10px; margin-top: 20px;} .filter-block__cell {margin: 0 10px 10px 0;} } @media screen and (max-width: 470px) { .filter-block__form {justify-content: space-between;} .filter-block__cell {margin-right: 0; width: 48%;} .filter-block__cell:first-child {width: calc(100% - 50px); order: 10;} .filter-block__cell-content > * {width: 100% !important;} .filter-block__cell-content--inp-year input {width: 100% !important;} .filter-block__cell--btns {width: 40px; order: 11;} } /* UPDATE ----------------------------------------------- */ .theme-toggle {display: inline-flex; justify-content: space-between; align-items: center; cursor: pointer; background-color: var(--bg-btn-dark); box-shadow: var(--bsh-btn-dark); height: 40px; border-radius: 20px; padding: 5px 0; margin: 0 20px;} .theme-toggle li {cursor: pointer; width: 30px; height: 30px; line-height: 30px; border-radius: 50%; text-align: center; color: #fff; margin: 0 5px;} .theme-toggle:hover li {color: #fff; background-color: rgba(0,0,0,0.3);} .dt-is-active .theme-toggle li:first-child, body:not(.dt-is-active) .theme-toggle li:last-child {background-color:var(--accent); color: #fff;} .col-main__right .side-block--collections {margin-top: -45px; padding-bottom: 30px;} .side-block--collections .d-grid {gap: 10px 10px;} .coll {box-shadow: var(--bsh-poster); border: 5px solid #fff; border-radius: 2px; display: block;} .coll::before {height: 100%; background: #11212e; opacity: 0.6;} .coll__title {position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 5; color: #fff; font-size: 14px; font-weight: 500; padding: 10px;} .page__subcol-header h1 {white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} @media screen and (min-width: 1220px) { .filter-block__cell-content select, .filter-block__cell-content input[type="text"] {max-width: 200px;} .page__subcols .page__subcol-info {min-height: 300px;} } @media screen and (max-width: 1220px) { .header__logo {margin-right: 20px;} .header .soc-channels {flex: 0 0 auto; flex-wrap: nowrap; margin-left: 20px; margin-right: 0;} } @media screen and (max-width: 590px) { .page__subcol-header h1 {white-space: normal;} .col-main__right .side-block--collections {padding-bottom: 0;} .coll__title {font-size: 14px; padding: 15px;} .theme-toggle {margin: 0; margin-left: 10px; order: 11;} .header__search {max-width: calc(100% - 90px); min-width: calc(100% - 90px);} } .dt-is-active #owl-big .owl-prev, .dt-is-active #owl-big .owl-next {background-color: var(--bg); color: var(--tt);} .dt-is-active .owl-prev:hover, .dt-is-active .owl-next:hover {background: var(--accent) !important; color: #fff !important;} .b-post__schedule_block { margin-bottom: 3px; background: #192125; } .b-post__schedule_block_title{ display: flex; align-items: center; justify-content: space-between; overflow: hidden; padding: 10px 18px; cursor: pointer; } .b-post__schedule_block_title .title { color: #efefef; float: left; font-size: 16px; font-weight: 700; line-height: 18px; } .b-post__schedule_table { color: #fff; font-size: 14px; width: 100%; } .b-post__schedule_table td { padding: 10px 0 10px 10px; border-top: 1px solid rgba(255, 255, 255, .1); } .td-1 { width: 20%; } .td-2 { width: 40%; } .td-4 { text-align: right; white-space: nowrap; width: 20%; } .b-post__schedule_table .td-5 { text-align: center; width: 10%; } .b-post__schedule_table .exists-episode { color: #3f9d65; } .movie_title_full { margin: 0 0 0 3px; } .top100-box, .top100-box * {background: transparent;margin:0;padding:0;outline:none;border: 0;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;} .clearfix:after {content: ""; display: table; clear: both;} .top100-box {text-align:center; font-weight:700;} .top100-title {font-size:24px; margin-bottom:20px; font-weight:700;} .top100-items {position:relative;} .top100-items ol {position:relative; padding-top:490px;} .top100-items ol {position:relative; z-index:100; counter-reset:li} .top100-item {padding: 0px 10px 25px 10px; float:left; width: 24.66%; position:relative;} .top100-item::before {content:counter(li); counter-increment:li; font-size: 14px; color: var(--tt); font-weight:700; position:absolute; bottom: 88px; left: 50%;margin-left: -25px;; width: 35px; height: 35px; line-height: 35px; text-align:center; border-radius: 20%; background-color: var(--bg-2); /* background: linear-gradient(to top, #cedce7 0%,#596a72 100%); */ box-shadow: 0 0 0 2px #647687;} .top100-item a {display:block; color:#000;} .top100-img {height: 260px; overflow:hidden; background-color:#000;width: 170px;} .top100-img img {width:100%; min-height:100%;} .top100-name {height: 50px; line-height: 15px; overflow:hidden; margin-top:5px;color: var(--tt);font-size: 12px;text-align: center;} .top100-items::before {content:""; width:100%; height:460px; position:absolute; left:0; top:0; background-color: gray; background-image: repeating-linear-gradient(45deg, transparent, transparent 35px, rgba(255,255,255,.5) 35px, rgba(255,255,255,.5) 70px);} .trophy {float:none; width:200px; position:absolute; padding:10px; background-color:rgba(0,0,0,0.5);} .trophy a {color:#fff;} .trophy .top100-img {height: 270px;} .trophy:nth-child(2) {left:80px; top:60px;} .trophy:nth-child(1) {left:50%; margin-left:-105px; top:20px;} .trophy:nth-child(3) {right:80px; top:80px;} .trophy:before {background-color:#ffd803; background: linear-gradient(to top, #d1df00 0%,#c19f25 100%); box-shadow: 0 0 0 2px #fff5f5; color:#000; bottom: 73px;} .top100-item:hover .top100-name {text-decoration:underline;} @media screen and (max-width: 950px) { .top100-item {width:20%;} .trophy {width:200px;} .trophy:nth-child(2) {left:20px;} .trophy:nth-child(3) {right:20px;} } @media screen and (max-width: 760px) { .top100-item {width:33.33%;} .trophy {width:200px; position:relative; left:0 !important; top:0 !important; margin:0 auto 20px auto !important;} .top100-items::before {display:none;} .top100-items ol {padding-top:0;} } @media screen and (max-width:590px) { .top100-item {width:50%;} .trophy {width:200px;} } .comments-image-gallery { margin: 0; padding: 0; list-style: none; clear: both; } .comments-image-gallery li{ list-style: none; margin: 0; padding: 0; } .comments-image-gallery li img{ float: left; margin-right: 5px; border: 5px solid #fff; width: 100px; height: 100px; transition: box-shadow 0.5s ease; } .comments-image-gallery li img:hover { box-shadow: 0px 0px 7px rgba(0,0,0,0.4); } .mce-toc { border: 1px solid #dbdada; margin: 0 0 .7rem 0; } .mce-toc h2 { margin: 4px; } .mce-toc ul { padding-left: 20px; list-style: none; margin-top: 0; margin-bottom: 0; margin-block-start: 1em; margin-block-end: 1em; } .mce-toc ul ul { padding-left: 20px; margin-block-start: 0; margin-block-end: 0; } .mce-toc li { list-style-type: none; } .image-bordered { border: 1px solid #ddd; } .image-shadows { box-shadow: rgb(9 30 66 / 25%) 0px 4px 8px -2px, rgb(9 30 66 / 8%) 0px 0px 0px 1px; } .image-padded { padding: 0.5rem; } .comments-user-profile { font-weight: bold; cursor: pointer; color: #3394e6; } .title_spoiler svg{ vertical-align: middle; margin-top: -4px; margin-right: 7px; height: 16px; width: 16px; } .mce-accordion summary { cursor: pointer; } .self_delete_link { border: 0 none; display: inline-block; vertical-align: middle; cursor: pointer; padding: 12px 27px; border-radius: 10px; outline: none; background-color: #f44336; color: #fff; text-shadow: 0 1px #333; text-decoration: none !important; box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2); box-sizing: border-box; transition: all ease .1s; transition: all ease .1s; } .DLEPush { z-index: 2001; position: fixed; right: 20px; top: 20px } @keyframes DLEPush-show { 0% { transform: translateY(100%); opacity: 0; } 100% { transform: translateY(0); opacity: 1; } } .DLEPush-notification.wrapper { animation-name: DLEPush-show; animation-duration: 1s; position: relative; display: grid; grid-template-columns: auto 1fr; align-items: center; color: #333; margin-bottom: 10px; width: 100%; max-width: 400px; box-shadow: 0 10px 15px rgb(0 0 0 / 20%); background-color: #fff; border-radius: 10px } .DLEPush-notification .DLEPush-icon { grid-column: 1; grid-row: 1 / span 2; display: flex; align-items: center; justify-content: center; color: #fff; width: 45px; height: 100%; border-top-left-radius: 10px; border-bottom-left-radius: 10px; text-align: center; } .DLEPush-notification .DLEPush-icon svg { scale: .8; } .DLEPush-notification .DLEPush-header { font-weight: 500; grid-column: 2; grid-row: 1; font-size: 1rem; margin-left: 1rem; margin-top: .5rem; } .DLEPush-notification .DLEPush-header:empty { margin-top: 0; } .DLEPush-notification .DLEPush-message { grid-column: 2; grid-row: 2; font-size: .875rem; margin: 1rem; } .DLEPush-notification .DLEPush-message li, .DLEPush-notification .DLEPush-message ul { list-style-type: none; padding-left: 0; } .DLEPush-notification .DLEPush-close { position: absolute; top: 8px; right: 10px; font-weight: 300; background: none; border: 0; font-size: 1.15rem; cursor: pointer; line-height: 1; padding: 0; color: inherit; outline: 0; opacity: 0.75; } @media only screen and (min-width: 601px) { .DLEPush-notification.wrapper { min-width: 400px; } } .DLEPush-notification .DLEPush-close:hover { opacity: 1; } .DLEPush-notification.wrapper.push-success { background-color: #e0f2f1; } .DLEPush-notification.wrapper.push-success .DLEPush-icon { background-color: #00897b; } .DLEPush-notification.wrapper.push-warning { background-color: #FFF3E0; } .DLEPush-notification.wrapper.push-warning .DLEPush-icon { background-color: #FF9800; } .DLEPush-notification.wrapper.push-error { background-color: #FBE9E7; } .DLEPush-notification.wrapper.push-error .DLEPush-icon { background-color: #FF5722; } input[type="text"].comments_author_field { width: 100%; margin-bottom: 10px; } .ui-dialog-buttonset button.ui-button-delete { background-color: #f44336; border-color: #f44336; color: #fff; text-shadow: 1px 1px 2px rgba(51, 51, 51, .5); } .ui-dialog-buttonset button.ui-button-delete:hover { background-color: #db3a2f; border-color: #db3a2f; color: #fff; text-shadow: 1px 1px 2px rgba(51, 51, 51, .5); } .form-check-label { cursor: pointer; } .form-check-input { color: #0c5f7eed; flex-shrink: 0; width: 1.12rem; height: 1.12rem; margin: -0.188rem 0.625rem 0 0; appearance: none; background-color: transparent; background-image: none; background-repeat: no-repeat; background-position: center; background-size: contain; border: 1px solid #0c5f7eed; vertical-align: middle; } .form-check-input:checked[type=checkbox] { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%230c5f7eed' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e"); } .form-check-input:checked[type=radio] { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%230c5f7eed'/%3e%3c/svg%3e"); } .form-check-input[type=checkbox] { border-radius: .25rem; } .form-check-input[type=radio] { border-radius: 50%; } /* ===================================================================== YOZAKURA Anime Refresh — appended to existing css/styles.css. No external libraries, CSS or JavaScript files are created or loaded. ===================================================================== */ body.yozakura-anime {background:#071115;color:var(--tt);font-size:14px} .yozakura-anime .wrapper {padding-top:18px;background:#071115;} .yozakura-anime .wrapper-main {border:1px solid #24343a;border-radius:16px 16px 0 0;overflow:hidden;box-shadow:0 24px 65px rgba(0,0,0,.45)} .yozakura-anime .header {background:#0d171d;height:76px;border-bottom:1px solid #273940;padding:0 24px;gap:16px} .yozakura-anime .logo {width:185px;margin-right:4px;height:auto;flex-shrink:0} .yozakura-anime .logo__title {color:#fff;font-family:Manrope,sans-serif;font-size:23px;font-weight:800;letter-spacing:-1.1px;white-space:nowrap} .yozakura-anime .logo__title span:first-child {color:var(--accent)} .yozakura-anime .logo__title .logo__dot {color:#fff;font-weight:700} .yozakura-anime .logo__caption {color:#9bb8b4;font-size:9px;letter-spacing:2px;text-transform:uppercase} .yozakura-anime .anime-header-nav {display:flex;align-items:center;justify-content:center;gap:12px;min-width:0} .yozakura-anime .anime-header-nav a {color:#c9d9d9;padding:10px 9px;font-size:13px;font-weight:700;border-radius:10px;white-space:nowrap} .yozakura-anime .anime-header-nav a:hover {color:var(--accent);background:#1a2a30} .yozakura-anime .header__search {width:min(300px,30vw);flex-shrink:1;min-width:155px} .yozakura-anime .header__search input, .yozakura-anime .header__search input:focus {height:40px;border-radius:12px;background:#1b292f;border:1px solid #31434a;color:#fff;box-shadow:none;padding-right:46px} .yozakura-anime .header__search button {width:44px;height:40px} .yozakura-anime .header__btn {border:1px solid #39544e;background:#1a2b30;color:#dff6ee;border-radius:12px;text-transform:none;letter-spacing:0;font-size:12px} .yozakura-anime .header__btn:hover {color:#091617;background:var(--accent)} .yozakura-anime .col-main {padding-top:76px;min-width:0} .yozakura-anime .col-side {width:213px;padding:100px 14px 30px;background:#0d171d;border-right:1px solid #22343a;background-image:none} .yozakura-anime .col-side::before {background:none} .yozakura-anime .side-block {margin-bottom:26px} .yozakura-anime .side-block__title {color:#f2f9f7;font-size:14px;font-weight:800} .yozakura-anime .anime-side-heading {font-size:11px!important;text-transform:uppercase;letter-spacing:1.8px;color:#819e9e!important;margin:0 9px 10px} .yozakura-anime .anime-genres-heading {margin-top:22px} .yozakura-anime .anime-nav-menu > li > a,.yozakura-anime .anime-category-list > li > a {border:0;border-radius:10px;display:flex;align-items:center;gap:10px;padding:11px 12px;color:#aebfc0;font-weight:600;font-size:13px;line-height:1.2} .yozakura-anime .anime-nav-menu > li > a:hover,.yozakura-anime .anime-category-list > li > a:hover,.yozakura-anime .anime-category-list .is-current > a {background:#1c3233;color:var(--accent)} .yozakura-anime .anime-nav-menu .fal {color:var(--accent);font-size:15px;min-width:18px;text-align:center} .yozakura-anime .anime-category-children {margin:0 0 6px 20px;padding-left:10px;border-left:1px solid #32524c} .yozakura-anime .anime-category-children a {display:block;padding:8px 10px;font-size:12px;color:#96b2b0;border-radius:7px} .yozakura-anime .anime-category-children a:hover {color:var(--accent);background:#203539} .yozakura-anime .anime-side-popular,.yozakura-anime .anime-side-comments {padding:0 10px} .yozakura-anime .anime-side-popular .side-block__title,.yozakura-anime .anime-side-comments .side-block__title {padding-bottom:12px;border-bottom:1px solid #254047;margin-bottom:12px} .yozakura-anime .popular__title {color:#e3f1ef;white-space:normal;font-size:12px;line-height:1.4} .yozakura-anime .popular__img {width:44px;height:62px;flex-shrink:0;border-radius:6px;overflow:hidden;margin-right:10px} .yozakura-anime .popular__desc .poster__subtitle {font-size:11px;color:#829998} .yozakura-anime .slider-box {margin-top:-76px;background:#071319} .yozakura-anime .bslide {height:386px;overflow:hidden} .yozakura-anime .bslide:before {background:linear-gradient(90deg,rgba(6,16,22,.98),rgba(6,16,22,.77) 41%,rgba(6,16,22,.08) 88%),linear-gradient(0deg,#08171b,transparent 55%);z-index:1} .yozakura-anime .bslide > img {object-position:center 35%} .yozakura-anime .bslide__desc {padding:0 48px 44px;max-width:82%;bottom:0} .yozakura-anime .anime-slide__eyebrow {display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(60,211,165,.3);padding:7px 11px;border-radius:999px;background:rgba(19,112,85,.26);color:#62e5bc;font-size:11px;font-weight:800;margin-bottom:14px} .yozakura-anime .bslide__title {font-size:clamp(25px,3.2vw,40px);font-weight:800;line-height:1.15;max-width:620px;white-space:normal;overflow:visible;text-overflow:clip;letter-spacing:-.7px} .yozakura-anime .anime-slide__meta {display:flex;gap:7px;flex-wrap:wrap;margin:13px 0} .yozakura-anime .anime-slide__meta span {font-weight:700;background:rgba(12,28,32,.68);border:1px solid #3b524e;border-radius:6px;padding:5px 10px;font-size:12px} .yozakura-anime .bslide__text {color:#d2e4e2;line-height:1.65;max-width:480px;margin:15px 0 23px;font-size:13px} .yozakura-anime .bslide__btns {gap:10px;flex-wrap:wrap} .yozakura-anime .bslide__btns .btn {margin:0;height:42px;padding:0 20px;font-size:12px;letter-spacing:.1px;border-radius:9px;text-transform:none;font-weight:800} .yozakura-anime .bslide__btn-watch {background:var(--accent);color:#081814} .yozakura-anime .bslide__btn-watch:hover {background:#52e9bf;color:#091814} .yozakura-anime .anime-slide__more {background:rgba(255,255,255,.1);color:#e8f5f3;border:1px solid #536266} .yozakura-anime .anime-slide__more:hover {background:#304245;color:#fff} .yozakura-anime .bslide__btns .fal {margin:0 7px 0 0} .yozakura-anime #owl-big .owl-dots {bottom:17px} .yozakura-anime .col-main__cols {grid-template-columns:minmax(0,1fr) 255px} .yozakura-anime .col-main__right {margin-top:0;border-left:1px solid #283b42} .yozakura-anime .col-main__right .side-block {background:#122228;padding:22px 18px;border-bottom:1px solid #26393d} .yozakura-anime .col-main__left {padding:28px 24px 36px} .yozakura-anime .sect__header {align-items:center;gap:10px} .yozakura-anime .sect__title {font-size:21px;font-weight:800;letter-spacing:-.5px;color:#eef8f4;padding-bottom:0} .yozakura-anime .sect__title:before {content:'';display:inline-block;vertical-align:-2px;width:4px;height:22px;background:var(--accent);border-radius:4px;margin-right:11px} .yozakura-anime .sect__header {margin-bottom:20px} .yozakura-anime .anime-sort {display:flex;align-items:center;gap:8px;font-size:12px;color:#9eb2b0;margin:0} .yozakura-anime .anime-sort .fal {color:var(--accent)} .yozakura-anime .anime-sort select {width:auto;max-width:190px;background-color:#1d3036;color:#ddebe8;border:1px solid #31504c;box-shadow:none;border-radius:8px;font-size:12px;height:36px} .yozakura-anime .anime-sort__caption {white-space:nowrap} .yozakura-anime #dle-content,.yozakura-anime .d-grid {grid-template-columns:repeat(auto-fill,minmax(145px,1fr));gap:24px 15px} .yozakura-anime .poster {min-width:0} .yozakura-anime .poster__img {border:1px solid #2a4445;border-radius:10px;box-shadow:0 6px 18px rgba(0,0,0,.26);overflow:hidden;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease} .yozakura-anime .poster:hover .poster__img {transform:translateY(-3px);border-color:var(--accent);box-shadow:0 9px 25px rgba(2,28,23,.7)} .yozakura-anime .poster__img img {object-position:center;transition:transform .3s ease} .yozakura-anime .poster:hover .poster__img img {transform:scale(1.05)} .yozakura-anime .poster__label {top:8px;left:8px;right:auto;border-radius:5px;font-size:10px;font-weight:900;letter-spacing:.4px;background:#136b56;padding:6px 8px} .yozakura-anime .poster__series {left:8px;bottom:8px;background:rgba(4,14,20,.87);color:#fff;border-radius:5px;font-weight:800;font-size:11px;padding:6px 9px} .yozakura-anime .anime-poster__status {position:absolute;top:8px;right:8px;background:rgba(6,16,20,.89);color:#90efca;border-radius:5px;padding:6px 9px;font-size:10px;font-weight:800;z-index:3} .yozakura-anime .poster:hover .poster__label {opacity:1} .yozakura-anime .has-overlay__icon {background:rgba(2,20,22,.2)} .yozakura-anime .has-overlay__icon div {height:48px;width:48px;border:1px solid rgba(255,255,255,.7);background:rgba(10,23,28,.55);font-size:18px} .yozakura-anime .poster__desc {padding:10px 2px 0} .yozakura-anime .poster__title {width:100%;height:auto;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;white-space:normal;overflow:hidden;line-height:1.4;font-size:13px;font-weight:800;color:#e8f4f1} .yozakura-anime .poster__subtitle {font-size:11px;margin-top:6px;color:#97adaa} .yozakura-anime .col-main__right .upd-box-title {background:none;color:#879c9d;font-size:11px;font-weight:600;padding:0;margin:4px 0 17px} .yozakura-anime .updli {gap:8px} .yozakura-anime .updli:not(:last-child) {border-bottom:1px solid #274046;margin-bottom:12px;padding-bottom:12px} .yozakura-anime .anime-upd__dot {display:grid;place-items:center;border-radius:8px;width:29px;height:29px;background:#1a423e;color:var(--accent);font-size:11px;flex-shrink:0} .yozakura-anime .updli-2 div {font-size:12px;color:#e1efea;line-height:1.45} .yozakura-anime .updli-2 span {font-size:11px;color:#779490} .yozakura-anime .updli-3 {font-size:11px;white-space:nowrap;color:#66d8b4} .yozakura-anime .coll {border-radius:8px;border:1px solid #2d4446;overflow:hidden} .yozakura-anime .coll__title {color:white;font-size:12px} .yozakura-anime .desc {background:#122027;border-top:1px solid #203c3b;color:#a6bcb8;padding:26px var(--indent)} .yozakura-anime .desc h2 {font-size:18px;margin-bottom:8px;color:#e7f3f0} .yozakura-anime .footer {background:#0b151b;border-top:1px solid #284044;color:#8ba4a1;padding:24px 32px;background-image:none;font-size:12px} .yozakura-anime .footer__btn {border-radius:8px;border:1px solid #2c4e45;background:#152b2a;box-shadow:none;padding:0 15px;margin:0;color:#d5eae3} .yozakura-anime .page-padding {padding:28px var(--indent)} .yozakura-anime .page__subcols {margin:0 -20px 22px;padding:25px 20px;background:#14252b;border:1px solid #2b4244;border-radius:14px;grid-template-areas:'pside pheader' 'pside pmeta' 'pside pinfo' 'pside pctrl' 'psubtitle psubtitle' 'ptext ptext';grid-template-columns:190px minmax(0,1fr);gap:12px 24px;align-items:start} .yozakura-anime .page__subcols:before {display:none} .yozakura-anime .page__subcol-header {grid-area:pheader} .yozakura-anime .page__subcol-meta {grid-area:pmeta} .yozakura-anime .page__subcol-side {grid-area:pside} .yozakura-anime .page__subcol-info {grid-area:pinfo;align-self:start;margin:0;padding:0;background:none} .yozakura-anime .page__subcol-ctrl {grid-area:pctrl;margin:8px 0 0} .yozakura-anime .page__subcols .page__subtitle {grid-area:psubtitle} .yozakura-anime .page__subcols .page__text {grid-area:ptext} .yozakura-anime .pmovie__poster {width:190px;height:285px;border:0;border-radius:10px;overflow:hidden;box-shadow:0 15px 35px rgba(0,0,0,.45)} .yozakura-anime .page__subcol-header h1 {font-size:clamp(21px,2.2vw,30px);font-weight:800;line-height:1.22;color:#f2faf7} .yozakura-anime .anime-fullstory__eyebrow {font-size:11px;letter-spacing:1.5px;color:var(--accent);font-weight:800;margin:3px 0 11px} .yozakura-anime .pmovie__original-title {color:#8ea9a7;font-size:12px;text-transform:none;letter-spacing:.4px;margin:10px 0} .yozakura-anime .pmovie__ratings {margin-top:11px;gap:9px} .yozakura-anime .pmovie__ratings-score {margin:0;border:1px solid #276e5e;background:#1c473e;color:var(--accent);font-size:14px;font-weight:800} .yozakura-anime .pmovie__ratings-votes {margin:0;font-size:12px;color:#9eb6b4} .yozakura-anime .anime-fullstory__chips {display:flex;gap:7px;flex-wrap:wrap;margin:8px 0} .yozakura-anime .anime-fullstory__chips span {border:1px solid #33504d;background:#1e3236;padding:6px 10px;border-radius:6px;font-size:11px;font-weight:750;color:#cfe5df} .yozakura-anime .anime-fullstory__chips .anime-chip--accent {color:#59edb7;border-color:#1a7963;background:#164b3e} .yozakura-anime .anime-fullstory__latest {font-size:12px;font-weight:700;color:#9fddcb;margin-top:10px} .yozakura-anime .pmovie__header-list li {font-size:12px;color:#e0f0ec} .yozakura-anime .pmovie__header-list li + li {margin-top:8px} .yozakura-anime .pmovie__header-list li > span:first-child {color:#8eaeaa} .yozakura-anime .page__subcols .page__subtitle {margin-top:14px;font-size:18px;font-weight:800;color:#e7f7ef} .yozakura-anime .page__text {line-height:1.75;color:#b5c9c7;font-size:13px} .yozakura-anime .page__subtitle.anime-section-title {font-size:20px;color:#eef8f5;text-align:left;margin-bottom:15px;margin-top:20px} .yozakura-anime .anime-player {border-radius:12px;overflow:hidden;border:1px solid #2d4549;background:#0a1319} .yozakura-anime .anime-player__frame {background:#000;aspect-ratio:16/9;position:relative;padding:0;height:auto} .yozakura-anime .anime-player__frame iframe {width:100%;height:100%;position:absolute;inset:0;border:0;display:block;max-width:none} .yozakura-anime .anime-player__placeholder {min-height:290px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:12px;padding:22px;color:#97b8b1} .yozakura-anime .anime-player__placeholder .fal {font-size:46px;color:var(--accent)} .yozakura-anime .anime-player__placeholder strong {font-size:19px;color:#edfaf4} .yozakura-anime .anime-player__placeholder p {max-width:430px;font-size:12px;line-height:1.7} .yozakura-anime .pmovie__player-bottom-2 {background:#11272c;justify-content:space-between;gap:10px;flex-wrap:wrap} .yozakura-anime .pmovie__fav a {background:#1b4038;color:#d9f4eb;border:1px solid #2b6f5b;border-radius:8px;margin:0;letter-spacing:0;text-transform:none} .yozakura-anime .anime-rate-actions {gap:10px;margin-left:auto} .yozakura-anime .anime-rate-actions__caption {font-size:12px;color:#a9c3be} .yozakura-anime .pmovie__rating-likes>* {border-radius:8px;background:#23584c;box-shadow:none;margin-left:6px} .yozakura-anime .pmovie__rating-likes>*+* {background:#593639} .yozakura-anime .pmovie__complaint a {width:40px;height:40px;background:#1d3238;border-radius:8px;font-size:18px} .yozakura-anime .pmovie__related .d-grid {grid-template-columns:repeat(auto-fill,minmax(145px,1fr));gap:20px 14px} .yozakura-anime .pmovie__related .poster__title {font-size:13px} .yozakura-anime .page__comments-title {font-size:20px;font-weight:800;color:#f1faf6} .yozakura-anime .page__comments-info {color:#97b8b0} .yozakura-anime .speedbar {background:#16282e;color:#a5beba;border-radius:9px;padding:15px 20px;margin:22px 0 -20px} .yozakura-anime .carou {background:#0b1920} .yozakura-anime .top {border-radius:8px;overflow:hidden} .yozakura-anime .top__title {font-weight:800} .yozakura-anime .pagination__pages a {border-color:#35514e;color:#c6ded8} .yozakura-anime .pagination__pages a:hover {background:var(--accent);border-color:var(--accent);color:#10251e} @media(max-width:1370px){ .yozakura-anime .header {gap:9px} .yozakura-anime .anime-header-nav {gap:1px} .yozakura-anime .col-side {width:195px} .yozakura-anime .col-main__cols {grid-template-columns:minmax(0,1fr) 230px} .yozakura-anime .col-main__left {padding-left:18px;padding-right:18px} .yozakura-anime #dle-content {grid-template-columns:repeat(auto-fill,minmax(135px,1fr))} } @media(max-width:1220px){ .yozakura-anime .wrapper {padding:0} .yozakura-anime .wrapper-main {border:0;border-radius:0} .yozakura-anime .header {position:relative} .yozakura-anime .col-main {padding-top:0} .yozakura-anime .col-side {width:100%;padding:24px 20px;order:10;border-right:0;border-top:1px solid #2e4a48} .yozakura-anime .col-side .js-this-in-mobile-menu {display:none!important} .yozakura-anime .anime-header-nav {display:flex} .yozakura-anime .slider-box {margin-top:0} .yozakura-anime .col-main__right {border-left:0} } @media(max-width:950px){ .yozakura-anime .col-main__cols {display:block} .yozakura-anime .col-main__right {display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;margin:0 20px 20px} .yozakura-anime .col-main__right .side-block {border:1px solid #2b4045;border-radius:12px} .yozakura-anime .col-main__right .side-block__content {display:block} .yozakura-anime .col-main__left {padding:25px 20px} .yozakura-anime .header__search {width:min(280px,35vw)} .yozakura-anime .anime-header-nav {display:none} .yozakura-anime .page__subcols {margin-top:0;padding-top:25px;grid-template-areas:'pside pheader' 'pside pmeta' 'pside pinfo' 'pside pctrl' 'psubtitle psubtitle' 'ptext ptext';grid-template-columns:190px minmax(0,1fr)} .yozakura-anime .pmovie__player {margin:0 0 28px} } @media(max-width:760px){ .yozakura-anime .header {height:76px;flex-wrap:nowrap;padding:0 16px} .yozakura-anime .header__search {order:0;width:auto;min-width:110px;flex:1} .yozakura-anime .header__search input {font-size:13px;padding-left:12px} .yozakura-anime .header__search input::placeholder {color:#9aacac;font-size:11px} .yozakura-anime .logo {width:auto;min-width:110px;flex:0 0 auto;margin:0} .yozakura-anime .logo__title {font-size:20px} .yozakura-anime .logo__caption {font-size:8px} .yozakura-anime .bslide {height:335px} .yozakura-anime .bslide__desc {padding:0 23px 40px;max-width:90%} .yozakura-anime .bslide__title {font-size:29px} .yozakura-anime .bslide__text {-webkit-line-clamp:2;font-size:12px} .yozakura-anime .slider-box {margin-top:0} .yozakura-anime .sect__header {flex-wrap:wrap} .yozakura-anime #dle-content,.yozakura-anime .d-grid {grid-template-columns:repeat(auto-fill,minmax(145px,1fr))} .yozakura-anime .page__subcols {grid-template-areas:'pside pheader' 'pside pmeta' 'pside pinfo' 'pside pctrl' 'psubtitle psubtitle' 'ptext ptext';grid-template-columns:145px minmax(0,1fr)} .yozakura-anime .pmovie__poster {width:145px;height:218px} .yozakura-anime .page__subcol-header,.yozakura-anime .page__subcol-meta {text-align:left} .yozakura-anime .page__subcol-header .pmovie__ratings,.yozakura-anime .pmovie__ext-ratings {justify-content:flex-start} } @media(max-width:590px){ .yozakura-anime .header__search {min-width:0} .yozakura-anime .header__btn {width:40px;height:40px} .yozakura-anime .header__btn-menu {background:#22463d;color:var(--accent);margin-left:0} .yozakura-anime .bslide {height:320px} .yozakura-anime .bslide__text {display:none} .yozakura-anime .bslide__desc {padding-bottom:48px} .yozakura-anime .page__subcols {grid-template-areas:'pheader' 'pside' 'pmeta' 'pinfo' 'pctrl' 'psubtitle' 'ptext';grid-template-columns:minmax(0,1fr);gap:16px;text-align:left;margin:0 0 20px;padding:20px} .yozakura-anime .page__subcol-side {justify-self:start} .yozakura-anime .page__subcol-header h1 {font-size:23px} .yozakura-anime .page__subcol-header,.yozakura-anime .page__subcol-meta {text-align:left} .yozakura-anime .pmovie__ratings,.yozakura-anime .page__subcol-header .pmovie__ratings {justify-content:flex-start} .yozakura-anime .page__comments-info {font-size:12px} .yozakura-anime .anime-rate-actions {width:100%;margin:4px 0 0;justify-content:space-between} .yozakura-anime .pmovie__player-bottom-2 {padding:12px} .yozakura-anime .pmovie__related .d-grid {grid-template-columns:repeat(2,minmax(0,1fr))} } @media(max-width:470px){ .yozakura-anime .header {padding:0 10px;gap:7px} .yozakura-anime .logo__title {font-size:17px;letter-spacing:-1px} .yozakura-anime .logo__caption {font-size:7px;letter-spacing:1.3px} .yozakura-anime .header__btn {display:none} .yozakura-anime .header__btn-menu {flex-shrink:0} .yozakura-anime .bslide {height:300px} .yozakura-anime .bslide__title {font-size:23px} .yozakura-anime .anime-slide__eyebrow {font-size:10px} .yozakura-anime .anime-slide__meta {display:none} .yozakura-anime #dle-content,.yozakura-anime .d-grid {grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:19px 12px} .yozakura-anime .poster__title {width:100%!important;font-size:12px} .yozakura-anime .poster__subtitle {font-size:11px} .yozakura-anime .col-main__right {margin:0 14px 20px;display:block} .yozakura-anime .col-main__left {padding:22px 14px} .yozakura-anime .sect__title {font-size:18px} .yozakura-anime .anime-sort__caption {display:none} .yozakura-anime .anime-sort select {max-width:150px} .yozakura-anime .page-padding {padding:18px 14px} .yozakura-anime .page__subcols {padding:16px} } /* Native menu spacing reset (original HDRezka uses negative margins). */ .yozakura-anime .anime-nav-menu > li > a, .yozakura-anime .anime-category-list > li > a {margin:0;width:100%;} .yozakura-anime .anime-nav-menu li .fal {position:static;pointer-events:auto;color:var(--accent);} @media(max-width:1220px){ /* Main and mobile sidebar must be separate flex rows. */ .yozakura-anime .content > .col-main {width:100%;flex:0 0 100%;max-width:100%;min-width:0;} .yozakura-anime .content > .col-side {width:100%;flex:0 0 100%;max-width:100%;} } /* Full-story spacing: cancel legacy forced 300px info column and title clipping. */ .yozakura-anime .page__subcols .page__subcol-info {min-height:0;height:auto;} .yozakura-anime .page__subcol-header h1 {white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;} .yozakura-anime .col-main__right .side-block--collections {margin-top:0;} @media(max-width:590px){ .yozakura-anime .header__search {min-width:0;max-width:none;flex:1 1 auto;} .yozakura-anime .header__btn-menu {display:block;flex:0 0 40px;} } /* ===================================================================== YOZAKURA v2: actual DLE xfields, full-width grid, proper image geometry. All changes stay in the EXISTING styles.css. ===================================================================== */ .yozakura-anime .col-main__cols {display:block; min-width:0; width:100%;} .yozakura-anime .col-main__left {width:100%; max-width:none; padding:30px 26px 40px; min-width:0;} .yozakura-anime .col-main__right {display:none!important;} .yozakura-anime #dle-content {grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:26px 16px;align-items:start;} .yozakura-anime #dle-content > .anime-poster {width:100%;max-width:100%;height:auto;min-width:0;} .yozakura-anime .anime-poster .poster__img, .yozakura-anime .pmovie__related .anime-poster .poster__img {width:100%;height:auto;aspect-ratio:2 / 3; padding:0!important;position:relative;display:block;min-height:0;overflow:hidden;} .yozakura-anime .anime-poster .poster__img > img, .yozakura-anime .pmovie__related .anime-poster .poster__img > img {display:block;position:absolute;inset:0;width:100%;height:100%;max-width:none;min-height:0;object-fit:cover;object-position:center top;} .yozakura-anime .anime-poster .poster__img > img {transform:none;} .yozakura-anime .anime-poster:hover .poster__img > img {transform:scale(1.025);} .yozakura-anime .anime-poster .poster__title {display:-webkit-box;width:100%;max-width:100%;min-height:0;line-height:1.4;font-size:13px;overflow:hidden;overflow-wrap:anywhere;-webkit-box-orient:vertical;-webkit-line-clamp:2;white-space:normal;} .yozakura-anime .anime-poster .poster__meta {color:#90aaa5;font-size:11px;line-height:1.45;min-width:0;} .yozakura-anime .pmovie__poster {width:190px;max-width:100%;height:auto!important;aspect-ratio:2 / 3;padding:0;} .yozakura-anime .pmovie__poster > img {width:100%;height:100%;object-fit:cover;object-position:center top;max-width:none;display:block;} /* Hero slider now displays the same uploaded poster without stretching it. */ .yozakura-anime .anime-slide {position:relative;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 80% 35%,#21463d 0%,#102b2c 32%,#0b1a20 74%);} .yozakura-anime .anime-slide:before {z-index:1;background:linear-gradient(90deg,rgba(8,18,24,.94) 0%,rgba(8,18,24,.88) 38%,rgba(8,18,24,.18) 100%);} .yozakura-anime .anime-slide__art {position:absolute;right:9%;top:26px;bottom:26px;height:calc(100% - 52px);aspect-ratio:2/3;max-width:42%;overflow:hidden;border-radius:14px;transform:rotate(3deg);box-shadow:0 20px 60px rgba(0,0,0,.58);border:1px solid #376257;z-index:0;} .yozakura-anime .anime-slide__art img {display:block;width:100%;height:100%;object-fit:cover;object-position:center top;} .yozakura-anime .anime-slide__art:after {content:'';position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);border-radius:14px;pointer-events:none;} .yozakura-anime .anime-slide .bslide__desc {z-index:2;width:66%;max-width:66%;} .yozakura-anime .anime-slide .bslide__title {font-size:clamp(25px,2.7vw,38px);} .yozakura-anime .anime-slide .bslide__text {max-width:600px;} /* Native DLE {sort} emits a simple list of links, not a select. Keep it collapsed. */ .yozakura-anime .anime-sort--dropdown {position:relative;flex:0 0 auto;display:block;margin:0;z-index:25;} .yozakura-anime .anime-sort--dropdown summary {display:flex;align-items:center;gap:9px;list-style:none;cursor:pointer;color:#bfdad4;background:#1b2e32;border:1px solid #37514d;padding:10px 13px;border-radius:9px;font-size:12px;font-weight:700;user-select:none;} .yozakura-anime .anime-sort--dropdown summary::-webkit-details-marker {display:none;} .yozakura-anime .anime-sort--dropdown summary .fal:first-child {color:var(--accent);} .yozakura-anime .anime-sort--dropdown summary .anime-sort__chevron {font-size:10px;opacity:.8;transition:transform .2s;} .yozakura-anime .anime-sort--dropdown[open] summary .anime-sort__chevron {transform:rotate(180deg);} .yozakura-anime .anime-sort--dropdown .anime-sort__options {position:absolute;right:0;top:calc(100% + 6px);width:max-content;min-width:190px;max-width:min(280px,90vw);z-index:25;padding:7px;border:1px solid #34544c;box-shadow:0 16px 32px rgba(0,0,0,.42);border-radius:11px;background:#14272c;color:#d7ebe6;font-size:12px;line-height:1.6;} .yozakura-anime .anime-sort--dropdown .anime-sort__options a, .yozakura-anime .anime-sort--dropdown .anime-sort__options li {display:block;padding:6px 9px;border-radius:6px;white-space:normal;} .yozakura-anime .anime-sort--dropdown .anime-sort__options a:hover {color:#54e9bf;background:#23463e;} .yozakura-anime .sect__header {flex-wrap:wrap;align-items:center;justify-content:space-between;} @media(max-width:1220px) { .yozakura-anime .col-main__left {padding:24px 20px 34px;} .yozakura-anime #dle-content {grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:22px 15px;} } @media(max-width:760px) { .yozakura-anime .col-main__left {padding:22px 16px 30px;} .yozakura-anime .anime-slide__art {right:5%;top:38px;bottom:38px;height:calc(100% - 76px);} .yozakura-anime .anime-slide .bslide__desc {width:66%;max-width:66%;padding:0 12px 32px 18px;} .yozakura-anime .anime-slide .bslide__title {font-size:24px;} .yozakura-anime .anime-slide .bslide__text {display:none;} .yozakura-anime .pmovie__poster {width:145px;height:auto!important;} } @media(max-width:470px) { .yozakura-anime #dle-content {grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:19px 11px;} .yozakura-anime .anime-slide__art {right:4%;top:56px;bottom:56px;height:calc(100% - 112px);transform:rotate(3deg);} .yozakura-anime .anime-slide .bslide__desc {width:72%;max-width:72%;padding:0 4px 38px 14px;} .yozakura-anime .anime-slide .bslide__title {font-size:20px;line-height:1.15;} .yozakura-anime .anime-slide__eyebrow {font-size:9px;} .yozakura-anime .anime-slide .bslide__btns .btn {padding:0 9px;height:36px;font-size:10px;} .yozakura-anime .anime-slide .anime-slide__more {display:none;} .yozakura-anime .col-main__left {padding:22px 14px 28px;} .yozakura-anime .sect__header {gap:8px;} .yozakura-anime .anime-sort--dropdown summary {font-size:11px;padding:8px 10px;} .yozakura-anime .pmovie__poster {width:145px;max-width:100%;} } /* YOZAKURA v4: home is a single full-width column (no empty right slot). */ .yozakura-anime .anime-home-section { display:block; clear:both; width:100%; max-width:none; min-width:0; margin:0; padding:28px 24px 36px; box-sizing:border-box; } .yozakura-anime .anime-home-section .sect__content {width:100%; max-width:none; min-width:0;} .yozakura-anime .anime-home-section #dle-content { display:grid!important; width:100%!important; min-width:0; grid-template-columns:repeat(auto-fit,minmax(155px,1fr))!important; gap:26px 16px; align-items:start; } .yozakura-anime .anime-home-section #dle-content > .anime-poster { min-width:0; max-width:100%; width:100%; grid-column:auto; } /* Click/tap side flyout. Its contents are out of flow: menu height is unchanged. */ .yozakura-anime .col-side,.yozakura-anime .anime-nav-menu, .yozakura-anime .anime-nav-menu > li {overflow:visible!important;} .yozakura-anime .anime-nav-menu > li.anime-genres-item {position:relative;} .yozakura-anime .anime-genres-flyout {position:relative; display:block;} .yozakura-anime .anime-genres-trigger { display:flex;align-items:center;gap:10px;min-height:39px; padding:11px 12px; list-style:none; cursor:pointer; color:#b5cfcb;font-size:13px;font-weight:700;line-height:1.2;border-radius:10px; } .yozakura-anime .anime-genres-trigger::-webkit-details-marker {display:none;} .yozakura-anime .anime-genres-trigger::marker {content:'';} .yozakura-anime .anime-genres-trigger .fal:first-child {color:var(--accent);min-width:18px;text-align:center;} .yozakura-anime .anime-genres-trigger .anime-genres-arrow {margin-left:auto;} .yozakura-anime .anime-genres-flyout[open] > summary, .yozakura-anime .anime-genres-trigger:hover {background:#1c3233;color:#4ce4b3;} .yozakura-anime .anime-genres-flyout:not([open]) > .anime-genres-panel {display:none!important;} .yozakura-anime .anime-genres-flyout[open] > .anime-genres-panel { display:block!important;position:absolute!important;z-index:999!important; left:calc(100% + 10px)!important;top:-8px!important; width:390px;max-width:calc(100vw - 240px);max-height:72vh; padding:16px;background:#102127;color:#d8eae6;border:1px solid #316057; border-radius:14px;box-shadow:0 20px 48px #0009; overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain; } .yozakura-anime .anime-genres-panel__head { font-size:14px;font-weight:800;color:#f0f8f5;padding:0 4px 12px; border-bottom:1px solid #29433e;margin-bottom:8px; } .yozakura-anime .anime-genres-panel .anime-category-list { display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr)); gap:3px 8px;margin:0;padding:0;list-style:none; } .yozakura-anime .anime-genres-panel .anime-category-list > li {min-width:0;} .yozakura-anime .anime-genres-panel .anime-category-list > li > a { display:block;margin:0;padding:10px;border-radius:8px; font-size:12px;line-height:1.3;white-space:normal;overflow-wrap:anywhere; } .yozakura-anime .anime-genres-panel .anime-category-children {margin-left:8px;padding-left:8px;} @media(max-width:1220px) { .yozakura-anime .anime-home-section {padding:24px 20px 34px;} .yozakura-anime .anime-home-section #dle-content { grid-template-columns:repeat(auto-fit,minmax(145px,1fr))!important;gap:22px 15px; } /* Existing libs.js clones the sidebar menu into #mobile-menu. */ .yozakura-anime #mobile-menu .anime-genres-flyout[open] > .anime-genres-panel { position:static!important;left:auto!important;top:auto!important; width:100%;max-width:100%;max-height:55vh;margin-top:5px; padding:10px;box-shadow:none; } .yozakura-anime #mobile-menu .anime-genres-panel .anime-category-list {display:block!important;} } @media(max-width:590px) { .yozakura-anime .anime-home-section {padding:22px 14px 28px;} .yozakura-anime .anime-home-section #dle-content { grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:19px 11px; } } /* YOZAKURA v5: two-line hero titles never push the recommendation label out. */ .yozakura-anime .anime-slide .bslide__desc { position:absolute;top:0;bottom:auto;left:0;right:auto; display:flex;flex-direction:column;align-items:flex-start;justify-content:center; box-sizing:border-box;width:68%;max-width:68%;height:100%; padding:27px 48px 33px;overflow:hidden;min-width:0; } .yozakura-anime .anime-slide .anime-slide__eyebrow { display:inline-flex;max-width:100%;margin:0 0 13px; flex:0 0 auto;white-space:nowrap; } .yozakura-anime .anime-slide .bslide__title { display:-webkit-box;max-width:100%;margin:0; -webkit-box-orient:vertical;-webkit-line-clamp:2; white-space:normal;overflow:hidden;overflow-wrap:anywhere; font-size:clamp(25px,2.65vw,36px);line-height:1.15; flex:0 0 auto; } .yozakura-anime .anime-slide .anime-slide__meta { margin:12px 0 0;flex:0 0 auto; } .yozakura-anime .anime-slide .bslide__text { display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2; overflow:hidden;max-width:570px;margin:12px 0 18px; line-height:1.55;flex:0 1 auto;min-height:0; } .yozakura-anime .anime-slide .bslide__btns {flex:0 0 auto;} @media(max-width:1200px) { .yozakura-anime .anime-slide .bslide__desc {width:70%;max-width:70%;padding:25px 30px 30px;} .yozakura-anime .anime-slide .bslide__title {font-size:clamp(24px,3vw,33px);} } @media(max-width:760px) { .yozakura-anime .anime-slide .bslide__desc {width:73%;max-width:73%;padding:20px 18px 25px;} .yozakura-anime .anime-slide .anime-slide__eyebrow {margin-bottom:10px;font-size:10px;} .yozakura-anime .anime-slide .bslide__title {font-size:clamp(20px,4.6vw,27px);} .yozakura-anime .anime-slide .bslide__text {display:none;} .yozakura-anime .anime-slide .anime-slide__meta {margin:10px 0 13px;} .yozakura-anime .anime-slide .bslide__btns {margin-top:10px;} } @media(max-width:590px) { .yozakura-anime .anime-slide .bslide__desc {width:76%;max-width:76%;padding:14px 14px 23px;} .yozakura-anime .anime-slide .anime-slide__eyebrow {font-size:9px;margin-bottom:9px;} .yozakura-anime .anime-slide .bslide__title {font-size:clamp(18px,5.2vw,24px);} .yozakura-anime .anime-slide .anime-slide__meta {display:none;} .yozakura-anime .anime-slide .bslide__btns {margin-top:15px;} } @media(min-width:1221px) { .yozakura-anime .anime-slide .bslide__desc {top:76px;height:calc(100% - 76px);padding:12px 48px 20px;} } /* YOZAKURA v7: self-contained full-story layout. No new CSS or JS file. New anime-detail classes isolate it from legacy page__subcols grid. */ body.yozakura-anime .anime-fullstory .anime-detail { margin:0 -20px 24px; padding:25px 23px 27px; border:1px solid #2a4546; border-radius:14px; background:#14252b; color:#e9f8f3; min-width:0; } body.yozakura-anime .anime-fullstory .anime-detail__top { display:grid; grid-template-columns:190px minmax(0,1fr); align-items:start; gap:25px; } body.yozakura-anime .anime-fullstory .anime-detail__top--rated { grid-template-columns:190px minmax(0,1fr) 252px; } body.yozakura-anime .anime-fullstory .anime-detail__top > * {min-width:0;} body.yozakura-anime .anime-fullstory .anime-detail__poster.pmovie__poster { width:190px; max-width:100%; height:auto!important; aspect-ratio:2/3; border:0; border-radius:11px; overflow:hidden; background:#20343a; box-shadow:0 12px 28px rgba(0,0,0,.27); margin:0; } body.yozakura-anime .anime-fullstory .anime-detail__poster img { display:block; width:100%; height:100%; object-fit:cover; } body.yozakura-anime .anime-fullstory .anime-detail__summary { min-width:0; display:flex; flex-direction:column; align-items:stretch; gap:13px; } body.yozakura-anime .anime-fullstory .anime-detail__heading h1 { color:#f5fffd; font-size:clamp(22px,2.3vw,31px); font-weight:800; line-height:1.24; white-space:normal; overflow-wrap:anywhere; } body.yozakura-anime .anime-fullstory .anime-detail__heading h1 a { font-size:13px; margin-left:8px; opacity:.65; } body.yozakura-anime .anime-fullstory .anime-detail__meta { min-width:0; } body.yozakura-anime .anime-fullstory .anime-detail__facts { list-style:none; min-width:0; margin:0; padding:0; color:#e3f1ed; line-height:1.65; overflow-wrap:anywhere; } body.yozakura-anime .anime-fullstory .anime-detail__facts li { min-width:0; font-size:12px; overflow-wrap:anywhere; } body.yozakura-anime .anime-fullstory .anime-detail__facts li+li {margin-top:6px;} body.yozakura-anime .anime-fullstory .anime-detail__facts li>span:first-child {color:#9bb9b3;} body.yozakura-anime .anime-fullstory .anime-detail__actions {margin:3px 0 0;} body.yozakura-anime .anime-fullstory .anime-detail__actions .btn { display:inline-flex; justify-content:center; align-items:center; gap:10px; min-height:42px; padding:0 18px; border-radius:9px; background:#22cba2; color:#051b19; font-weight:800; text-decoration:none; } body.yozakura-anime .anime-fullstory .anime-detail__actions .btn:hover {background:#59e8c4;} /* Compact rating panel, to the right of the information on desktop. */ body.yozakura-anime .anime-fullstory .anime-detail__rating { display:flex; flex-direction:column; align-items:stretch; width:100%; min-width:0; padding:19px 18px 17px; border:1px solid #31594d; border-radius:13px; background:linear-gradient(145deg,#1f423d,#132a31 78%); box-shadow:0 8px 24px rgba(0,0,0,.14); color:#f1faf7; } body.yozakura-anime .anime-fullstory .anime-detail__rating-head { display:flex; align-items:center; gap:11px; min-width:0; } body.yozakura-anime .anime-fullstory .anime-detail__rating-icon { display:grid; place-items:center; flex:0 0 40px; width:40px; height:40px; border-radius:10px; background:#3c4c37; border:1px solid #786b42; color:#ffda87; font-size:23px; line-height:1; } body.yozakura-anime .anime-fullstory .anime-detail__rating-head > span:last-child { display:flex; flex-direction:column; gap:3px; min-width:0; } body.yozakura-anime .anime-fullstory .anime-detail__rating-head strong { color:#f7fffb; font-size:13px; font-weight:850; letter-spacing:1px; } body.yozakura-anime .anime-fullstory .anime-detail__rating-head small { color:#9fbbb3; font-size:10px; line-height:1.3; } body.yozakura-anime .anime-fullstory .anime-detail__rating-value { display:flex; align-items:baseline; gap:7px; margin:18px 0 13px; } body.yozakura-anime .anime-fullstory .anime-detail__rating-value strong { font-size:48px; line-height:1; font-weight:850; letter-spacing:-2px; color:#fff; font-variant-numeric:tabular-nums; } body.yozakura-anime .anime-fullstory .anime-detail__rating-value > span { font-size:14px; color:#91bbb0; } body.yozakura-anime .anime-fullstory progress.anime-detail__rating-progress { display:block; width:100%; height:9px; margin:0; padding:0; border:0; border-radius:30px; overflow:hidden; appearance:none; -webkit-appearance:none; background:#2d4946; } body.yozakura-anime .anime-fullstory .anime-detail__rating-progress::-webkit-progress-bar { background:#2d4946; border-radius:30px; } body.yozakura-anime .anime-fullstory .anime-detail__rating-progress::-webkit-progress-value { background:linear-gradient(90deg,#22c9a4,#93f3c4); border-radius:30px; } body.yozakura-anime .anime-fullstory .anime-detail__rating-progress::-moz-progress-bar { background:linear-gradient(90deg,#22c9a4,#93f3c4); border-radius:30px; } body.yozakura-anime .anime-fullstory .anime-detail__rating > p { margin:12px 0 0; color:#9fbfb6; line-height:1.5; font-size:11px; } /* The description starts BELOW the entire top row and spans all columns. */ body.yozakura-anime .anime-fullstory .anime-detail__description { display:block; clear:both; min-width:0; margin:25px 0 0; padding:22px 0 0; border-top:1px solid #2c4847; } body.yozakura-anime .anime-fullstory .anime-detail__description h2 { position:static; float:none; display:block; width:auto; margin:0 0 13px; padding:0; color:#eefbf7; font-size:19px; font-weight:800; line-height:1.4; overflow-wrap:anywhere; } body.yozakura-anime .anime-fullstory .anime-detail__text { display:block; width:100%; max-width:100%; margin:0; padding:0; color:#bed3cd; font-size:13px; line-height:1.8; overflow-wrap:anywhere; } body.yozakura-anime .anime-fullstory .anime-detail__text p {margin:0 0 12px;} body.yozakura-anime .anime-fullstory .anime-detail__text > :last-child {margin-bottom:0;} @media (max-width:1200px) { body.yozakura-anime .anime-fullstory .anime-detail__top--rated { grid-template-columns:170px minmax(0,1fr); } body.yozakura-anime .anime-fullstory .anime-detail__poster.pmovie__poster {width:170px;} body.yozakura-anime .anime-fullstory .anime-detail__rating { grid-column:2; max-width:355px; justify-self:start; } } @media (max-width:760px) { body.yozakura-anime .anime-fullstory .anime-detail {margin:0 0 20px;padding:19px;} body.yozakura-anime .anime-fullstory .anime-detail__top, body.yozakura-anime .anime-fullstory .anime-detail__top--rated { grid-template-columns:140px minmax(0,1fr); gap:18px; } body.yozakura-anime .anime-fullstory .anime-detail__poster.pmovie__poster {width:140px;} body.yozakura-anime .anime-fullstory .anime-detail__rating {grid-column:1/-1;max-width:none;} } @media (max-width:560px) { body.yozakura-anime .anime-fullstory .anime-detail__top, body.yozakura-anime .anime-fullstory .anime-detail__top--rated { grid-template-columns:minmax(0,1fr); gap:18px; } body.yozakura-anime .anime-fullstory .anime-detail__poster.pmovie__poster {width:170px;} body.yozakura-anime .anime-fullstory .anime-detail__rating {grid-column:auto;} body.yozakura-anime .anime-fullstory .anime-detail__heading h1 {font-size:24px;} body.yozakura-anime .anime-fullstory .anime-detail__rating-value strong {font-size:42px;} } /* YOZAKURA v8 | Full story: three natural-height columns, zero reserved gap. Existing styles.css only; no new CSS or JS dependencies. */ body.yozakura-anime .anime-fullstory .anime-detail--v8 { height:auto !important; min-height:0 !important; padding:23px 23px 23px; } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__top, body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__top--rated { display:grid !important; grid-template-columns:190px minmax(0,1fr) 252px; align-items:start; align-content:start; gap:22px; height:auto !important; min-height:0 !important; } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__media { width:190px; max-width:100%; min-width:0; display:flex; flex-direction:column; gap:13px; align-items:stretch; } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__poster.pmovie__poster { width:100%; height:auto !important; aspect-ratio:2/3; flex:none; position:relative; overflow:hidden; margin:0; } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__poster img { width:100%; height:100%; display:block; object-fit:cover; } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__watch-btn { display:flex; align-items:center; justify-content:center; gap:9px; width:100%; min-height:45px; padding:11px 9px; border-radius:9px; background:#22cda9; color:#06241e; font-size:12px; font-weight:850; letter-spacing:.35px; text-transform:uppercase; text-decoration:none; box-shadow:0 5px 15px rgba(13,183,146,.14); transition:background .18s ease,transform .18s ease; } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__watch-btn:hover { background:#59edc8; color:#051d18; transform:translateY(-1px); } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__summary { margin:0; padding:0; min-height:0; gap:12px; } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__heading h1 { margin:0; padding:0; line-height:1.2; } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__ratings { display:flex; flex-direction:column; align-items:stretch; gap:12px; width:100%; min-width:0; } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__ratings:not(:has(.anime-detail__rating)) { display:none; } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__top:not(:has(.anime-detail__rating)) { grid-template-columns:190px minmax(0,1fr); } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__rating { box-sizing:border-box; width:100%; height:auto; padding:16px 17px 15px; border:1px solid #2c7665; border-radius:13px; box-shadow:0 7px 24px rgba(0,0,0,.12); } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__rating--shiki { background:linear-gradient(150deg,#205348 0%,#16312f 70%,#12292e 100%); } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__rating--community { background:linear-gradient(150deg,#17463f 0%,#152f33 74%,#10282c 100%); } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__rating--community .anime-detail__rating-icon { color:#5ff0c5; border-color:#337b6a; background:#1d5148; } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__rating-head strong { font-size:12px; letter-spacing:.5px; } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__rating-value { margin:13px 0 10px; } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__rating-value strong { font-size:41px; font-variant-numeric:tabular-nums; line-height:1; } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__rating > p { font-size:10px; margin:8px 0 0; line-height:1.45; } /* The description immediately follows the MAX height of poster, facts, rating column. */ body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__description { position:static !important; float:none !important; display:block; height:auto !important; min-height:0 !important; width:100%; margin:18px 0 0 !important; padding:18px 0 0 !important; border-top:1px solid #2c4847; } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__description h2 { margin:0 0 11px !important; } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__text { margin:0; padding:0; min-height:0; width:100%; } @media(max-width:1130px) { body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__top { grid-template-columns:170px minmax(0,1fr) 218px; gap:17px; } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__media {width:170px;} body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__top:not(:has(.anime-detail__rating)) { grid-template-columns:170px minmax(0,1fr); } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__rating {padding:13px;} body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__rating-value strong {font-size:36px;} } @media(max-width:980px) { body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__top { grid-template-columns:165px minmax(0,1fr); gap:17px; } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__top:not(:has(.anime-detail__rating)) { grid-template-columns:165px minmax(0,1fr); } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__media {width:165px;} body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__ratings { grid-column:1/-1; display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:12px; } } @media(max-width:560px) { body.yozakura-anime .anime-fullstory .anime-detail--v8 {padding:16px;} body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__top, body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__top:not(:has(.anime-detail__rating)) { grid-template-columns:minmax(0,1fr); gap:18px; } /* Small screens: poster above the watch button; no empty second column. */ body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__media { width:100%; min-width:0; display:flex; flex-direction:column; align-items:center; gap:12px; } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__poster.pmovie__poster { width:min(100%,220px); max-width:220px; height:auto !important; aspect-ratio:2 / 3; margin:0 auto; } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__watch-btn { width:min(100%,220px); max-width:220px; align-self:center; font-size:12px; min-height:47px; margin:0; } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__ratings { grid-column:auto; grid-template-columns:minmax(0,1fr); width:100%; } body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__rating-value strong {font-size:38px;} body.yozakura-anime .anime-fullstory .anime-detail--v8 .anime-detail__description {margin-top:16px !important; padding-top:17px !important;} } /* =============================================================== YOZAKURA v9 — Comments (native DLE editor and comment actions). Existing styles.css only; the upload area is removed in addcomments.tpl. Scoped to a full story so other DLE pages stay unchanged. =============================================================== */ body.yozakura-anime .anime-fullstory .page__comments { margin:32px 0 24px; min-width:0; } body.yozakura-anime .anime-fullstory .page__comments-title { display:flex; align-items:center; gap:12px; margin:0 0 8px; padding:0; color:#f1faf7; font-size:23px; font-weight:850; line-height:1.3; } body.yozakura-anime .anime-fullstory .page__comments-title::before { content:'\f086'; font:normal 20px 'Font Awesome 5 Pro'; width:43px; height:43px; display:grid; place-items:center; color:#2ce0b5; border:1px solid #2c6659; border-radius:12px; background:#14372f; flex:none; } body.yozakura-anime .anime-fullstory .page__comments-info { color:#9bbab6; font-size:13px; line-height:1.6; margin:0 0 22px; padding-left:55px; } body.yozakura-anime .anime-fullstory .page__comments-info .fal {color:#28d5a6;} /* Compact editor panel, retaining the DLE {editor} and its submit event. */ body.yozakura-anime .anime-fullstory .add-comments-form.anime-comment-compose { padding:19px !important; margin:0 0 27px !important; background:linear-gradient(155deg,#172b30,#112128 78%); border:1px solid #2a494a; border-radius:16px; box-shadow:0 13px 30px rgba(0,0,0,.13); min-width:0; box-sizing:border-box; } body.yozakura-anime .anime-fullstory .anime-comment-compose__heading { display:flex; align-items:center; gap:12px; margin-bottom:14px; } body.yozakura-anime .anime-fullstory .anime-comment-compose__icon { width:42px; height:42px; flex:none; display:grid; place-items:center; border-radius:12px; color:#29e1b2; font-size:18px; background:#1a473d; border:1px solid #286d5b; } body.yozakura-anime .anime-fullstory .anime-comment-compose__heading strong { display:block; font-size:15px; font-weight:800; color:#f0fcf8; } body.yozakura-anime .anime-fullstory .anime-comment-compose__heading span:not(.anime-comment-compose__icon) { display:block; font-size:12px; line-height:1.5; color:#91afad; margin-top:3px; } body.yozakura-anime .anime-fullstory .anime-comment-compose__editor-row, body.yozakura-anime .anime-fullstory .anime-comment-compose__editor { width:100%; min-width:0; margin:0; padding:0; } body.yozakura-anime .anime-fullstory .anime-comment-compose__editor { border:1px solid #35515a; border-radius:10px; background:#0d1a20; overflow:hidden; } /* Browser/DLE editor modes: plain textarea, DLE BB editor and WYSIWYG. */ body.yozakura-anime .anime-fullstory .anime-comment-compose__editor textarea, body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .bb-editor textarea { box-sizing:border-box; display:block; min-height:145px; height:155px; width:100%; max-width:100%; margin:0; padding:15px; border:0; border-radius:0; background:#0d1b23 !important; color:#eaf7f3 !important; font-size:14px; line-height:1.65; outline:none; box-shadow:none; } body.yozakura-anime .anime-fullstory .anime-comment-compose__editor textarea:focus { background:#10222a !important; } body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .bb-editor, body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .wseditor { width:100% !important; max-width:100%; box-sizing:border-box; } body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .bb-pane { background:#1c3036; color:#d9eee9; border-color:#35515a; padding:6px; min-height:40px; } body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .bb-btn {color:#b8d7d1;} body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .bb-btn:hover {color:#27d6aa;} body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .fr-toolbar, body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .fr-second-toolbar { background:#1b3036; border-color:#385359; } body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .fr-box.fr-basic .fr-wrapper, body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .fr-element.fr-view { background:#0d1b23; color:#eaf7f3; min-height:145px; } body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .fr-toolbar .fr-command.fr-btn {color:#d5eae5;} body.yozakura-anime .anime-fullstory .anime-comment-compose__editor iframe {max-width:100%;} body.yozakura-anime .anime-fullstory .anime-comment-compose__actions { margin:14px 0 0; padding:0; } body.yozakura-anime .anime-fullstory .anime-comment-compose__action-content { display:flex !important; align-items:center; gap:12px; flex-wrap:wrap; width:100%; min-width:0; } body.yozakura-anime .anime-fullstory .anime-comment-compose__guest { display:flex; gap:10px; flex:1 1 340px; min-width:0; } body.yozakura-anime .anime-fullstory .anime-comment-compose__guest .form__input { flex:1 1 140px; min-width:0; max-width:100%; margin:0; background:#10232a; color:#e8f6f1; box-shadow:none; border:1px solid #335158; border-radius:9px; min-height:44px; } body.yozakura-anime .anime-fullstory .anime-comment-compose__subscribe { display:flex; align-items:center; gap:7px; flex:1 1 200px; min-width:0; color:#a9c8c2; font-size:12px; } body.yozakura-anime .anime-fullstory .anime-comment-compose__subscribe input[type="checkbox"] { accent-color:#25d5a6; width:17px; height:17px; margin:0 6px 0 0; } body.yozakura-anime .anime-fullstory .anime-comment-compose__submit { display:inline-flex; align-items:center; justify-content:center; gap:10px; width:auto; min-height:46px; margin:0 0 0 auto; padding:0 19px; background:#24d1a7; color:#052920; border:0; border-radius:10px; font-size:12px; letter-spacing:.3px; font-weight:850; box-shadow:0 5px 16px rgba(19,187,149,.13); order:initial; cursor:pointer; } body.yozakura-anime .anime-fullstory .anime-comment-compose__submit:hover { background:#60e7c5; color:#06241e; } /* Security fields are displayed by DLE only when required. */ body.yozakura-anime .anime-fullstory .anime-comment-compose .form__row--protect { width:100%; margin:12px 0; } /* List of reviews: standalone cards rather than long unstructured text. */ body.yozakura-anime .anime-fullstory .page__comments-list { display:block; min-width:0; padding:0; } body.yozakura-anime .anime-fullstory .page__comments-list .message-info { padding:23px; border-radius:13px; border:1px dashed #38625a; background:#142a2e; color:#abcac3; font-size:14px; } body.yozakura-anime .anime-fullstory .comment-item.anime-comment-card { box-sizing:border-box; min-width:0; padding:20px 22px 16px; margin:0 0 15px; background:linear-gradient(155deg,#182d32,#112128); border:1px solid #2a484b; border-radius:15px; box-shadow:0 8px 28px rgba(0,0,0,.1); } body.yozakura-anime .anime-fullstory .anime-comment-card .comment-item__header { display:flex; align-items:center; gap:12px; min-width:0; margin-bottom:13px; } body.yozakura-anime .anime-fullstory .anime-comment-card .comment-item__img { flex:none; width:46px; height:46px; margin:0; border-radius:50%; overflow:hidden; border:2px solid #3b7568; background:#244741; box-shadow:0 0 0 3px rgba(42,213,168,.06); } body.yozakura-anime .anime-fullstory .anime-comment-card .comment-item__img img { width:100%; height:100%; object-fit:cover; display:block; } body.yozakura-anime .anime-fullstory .anime-comment-card .comment-item__meta { min-width:0; flex:1 1 auto; } body.yozakura-anime .anime-fullstory .anime-comment-card .comment-item__author { color:#f0faf7; font-weight:800; font-size:14px; white-space:normal; overflow-wrap:anywhere; } body.yozakura-anime .anime-fullstory .anime-comment-card .comment-item__author a {color:#f0faf7;} body.yozakura-anime .anime-fullstory .anime-comment-card .comment-item__header--admin .comment-item__author::after { content:'Администратор'; display:inline-block; vertical-align:middle; margin-left:9px; padding:3px 7px; border-radius:5px; font-size:9px; font-weight:800; letter-spacing:.35px; color:#7ef4ca; background:#195446; } body.yozakura-anime .anime-fullstory .anime-comment-card .comment-item__date { margin-top:4px; color:#85aaa7; font-size:11px; white-space:normal; } body.yozakura-anime .anime-fullstory .anime-comment-card__rating { display:flex; align-items:center; gap:7px; flex:none; font-size:12px; white-space:nowrap; } body.yozakura-anime .anime-fullstory .anime-comment-card__rating a { display:inline-flex; align-items:center; gap:5px; min-height:32px; padding:5px 9px; margin:0; color:#bce7da; background:#183e36; border:1px solid #2c6356; border-radius:8px; text-decoration:none; } body.yozakura-anime .anime-fullstory .anime-comment-card__rating a:last-child { color:#f2b7b8; background:#3c272d; border-color:#694149; } body.yozakura-anime .anime-fullstory .anime-comment-card__rating a:hover { filter:brightness(1.25); } body.yozakura-anime .anime-fullstory .anime-comment-card .comment-item__main { margin:0; padding:0 0 15px; min-width:0; color:#dcece8; font-size:14px; line-height:1.75; overflow-wrap:anywhere; word-break:normal; } body.yozakura-anime .anime-fullstory .anime-comment-card .comment-item__main p {margin:0 0 10px;} body.yozakura-anime .anime-fullstory .anime-comment-card .comment-item__main p:last-child {margin-bottom:0;} body.yozakura-anime .anime-fullstory .anime-comment-card .comment-item__main .quote { padding:12px 14px 12px 38px; border-radius:9px; color:#c5e2da; background:#112f32; border-left:3px solid #27d3a6; } body.yozakura-anime .anime-fullstory .anime-comment-card__attachments { margin:0 0 14px; padding:12px; border-radius:8px; background:#10242c; } body.yozakura-anime .anime-fullstory .anime-comment-card .comment-item__footer { display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding-top:12px; border-top:1px solid #2b4649; } body.yozakura-anime .anime-fullstory .anime-comment-card .comment-item__reply a { display:inline-flex; align-items:center; gap:7px; margin:0; padding:8px 10px; min-height:34px; color:#accbc3; background:#1b3338; border:1px solid #355457; border-radius:8px; font-size:12px; text-decoration:none; } body.yozakura-anime .anime-fullstory .anime-comment-card .comment-item__reply a:hover { background:#20463f; border-color:#3c7666; color:#7df1c8; text-decoration:none; } body.yozakura-anime .anime-fullstory .anime-comment-card .comment-item__reply .fal {margin:0; color:#5cdbb4;} body.yozakura-anime .anime-fullstory .anime-comment-card .comment-item__controls { margin:0 0 0 auto; text-align:right; min-width:0; flex:1 1 180px; font-size:11px; white-space:normal; } body.yozakura-anime .anime-fullstory .anime-comment-card .comment-item__controls li { display:inline-block; vertical-align:middle; height:auto; margin:2px 0 2px 9px; line-height:1.7; } body.yozakura-anime .anime-fullstory .anime-comment-card .comment-item__controls a { color:#9bbaaf; } body.yozakura-anime .anime-fullstory .anime-comment-card .comment-item__controls a:hover {color:#39e1b6;} body.yozakura-anime .anime-fullstory .mass_comments_action { max-width:100%; width:100%; gap:10px; flex-wrap:wrap; color:#9fbbb6; font-size:12px; } body.yozakura-anime .anime-fullstory .mass_comments_action select { max-width:300px; min-width:150px; margin:0; color:#eafaf5; background:#142b31; border:1px solid #3a5b5a; border-radius:9px; min-height:40px; } body.yozakura-anime .anime-fullstory .mass_comments_action .bbcodes { background:#22cda6; color:#062720; border-radius:9px; min-height:40px; } @media(max-width:760px) { body.yozakura-anime .anime-fullstory .page__comments {margin-top:26px;} body.yozakura-anime .anime-fullstory .page__comments-title {font-size:20px;} body.yozakura-anime .anime-fullstory .page__comments-info {padding-left:0; margin-bottom:15px;} body.yozakura-anime .anime-fullstory .add-comments-form.anime-comment-compose {padding:13px !important;} body.yozakura-anime .anime-fullstory .anime-comment-compose__guest {flex-wrap:wrap; flex-basis:100%;} body.yozakura-anime .anime-fullstory .anime-comment-compose__submit {width:100%; margin:0;} body.yozakura-anime .anime-fullstory .comment-item.anime-comment-card {padding:15px 14px;} body.yozakura-anime .anime-fullstory .comment-item.anime-comment-card .comment-item__controls {display:none;} } @media(max-width:440px) { body.yozakura-anime .anime-fullstory .comment-item__header {flex-wrap:wrap;} body.yozakura-anime .anime-fullstory .anime-comment-card__rating { flex:1 1 100%; padding-left:58px; } body.yozakura-anime .anime-fullstory .anime-comment-compose__heading span:not(.anime-comment-compose__icon) {font-size:11px;} } /* YOZAKURA v12 — comment editor canvas: remove split white/dark background. DLE visual editors own their internal editable canvas, often inside an iframe. Match the surrounding surface to their light canvas; do not try to style iframe document content from outside or interfere with editor JS. */ body.yozakura-anime .anime-fullstory .anime-comment-compose__editor { background-color:#fff !important; border-color:#3b5860; } /* Modern DLE visual editor (TinyMCE). */ body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .tox, body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .tox-tinymce, body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .tox-editor-container, body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .tox-sidebar-wrap, body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .tox-edit-area, body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .tox-edit-area__iframe { background-color:#fff !important; } body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .tox-edit-area { flex:1 1 auto; min-height:190px; } body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .tox-edit-area__iframe { display:block; width:100%; height:100% !important; min-height:190px; margin:0; } /* Older editor / plain comment field, if selected in DLE settings. */ body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .mce-tinymce, body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .mce-container-body, body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .mce-edit-area, body.yozakura-anime .anime-fullstory .anime-comment-compose__editor .mce-edit-area iframe { background-color:#fff !important; } body.yozakura-anime .anime-fullstory .anime-comment-compose__editor textarea:not([hidden]), body.yozakura-anime .anime-fullstory .anime-comment-compose__editor [contenteditable="true"] { background-color:#fff !important; color:#18262a !important; min-height:190px; } /* YOZAKURA v13: category carousel navigation stays INSIDE the carousel. Original Owl arrows were offset by -50px and hidden by side/page edges. Scoped to category carousel only; hero slider is untouched. */ body.yozakura-anime .carou #owl-carou .owl-nav { position:absolute; left:0; right:0; top:50%; z-index:7; pointer-events:none; } body.yozakura-anime .carou #owl-carou .owl-nav .owl-prev, body.yozakura-anime .carou #owl-carou .owl-nav .owl-next { position:absolute; top:0; margin-top:-21px; display:flex; justify-content:center; align-items:center; width:42px; height:42px; border:1px solid rgba(89,194,170,.6); border-radius:50%; background:rgba(9,29,35,.92); box-shadow:0 5px 18px rgba(0,0,0,.34); color:#d6fff4; cursor:pointer; pointer-events:auto; z-index:8; font-size:21px; transition:background .2s,color .2s,border-color .2s; } body.yozakura-anime .carou #owl-carou .owl-nav .owl-prev {left:10px;right:auto;} body.yozakura-anime .carou #owl-carou .owl-nav .owl-next {right:10px;left:auto;} body.yozakura-anime .carou #owl-carou .owl-nav .owl-prev:hover, body.yozakura-anime .carou #owl-carou .owl-nav .owl-next:hover, body.yozakura-anime .carou #owl-carou .owl-nav .owl-prev:focus-visible, body.yozakura-anime .carou #owl-carou .owl-nav .owl-next:focus-visible { color:#061b18!important; background:#35dcb0!important; border-color:#35dcb0!important; } body.yozakura-anime .carou #owl-carou .owl-nav .disabled {opacity:.35;cursor:default;} /* =================================================================== YOZAKURA v14 · ТОП-100 аниме. Только существующий styles.css. Данные и порядок: стандартная выборка DLE order=rating. =================================================================== */ .yozakura-anime .yz-top100 {min-width:0;max-width:1500px;margin:0 auto;color:#f2faf9} .yozakura-anime .yz-top100-hero {position:relative;overflow:hidden;isolation:isolate;min-height:248px;padding:35px 39px;border:1px solid #28504c;border-radius:18px;background:linear-gradient(116deg,#102e31 0%,#0d242a 52%,#101a20 100%)} .yozakura-anime .yz-top100-hero__aura {position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 82% 22%,rgba(39,211,168,.2),transparent 48%),radial-gradient(ellipse at 10% 95%,rgba(20,118,125,.16),transparent 52%)} .yozakura-anime .yz-top100-hero__inner {position:relative;z-index:1;max-width:700px} .yozakura-anime .yz-top100-kicker {display:inline-flex;align-items:center;gap:9px;background:#183c3a;border:1px solid #2c6960;border-radius:50px;padding:8px 15px;color:#73e6c6;letter-spacing:.12em;font-weight:800;font-size:11px} .yozakura-anime .yz-top100-hero h1 {margin:15px 0 10px;font-size:clamp(28px,4.5vw,52px);letter-spacing:-.05em;font-weight:900;line-height:1.12;color:#fff} .yozakura-anime .yz-top100-hero h1 span {color:#50e0b4} .yozakura-anime .yz-top100-hero p {font-size:14px;line-height:1.65;color:#a9c5c4;max-width:570px;margin:0} .yozakura-anime .yz-top100-hero__facts {display:flex;flex-wrap:wrap;gap:11px 18px;margin-top:22px;color:#ddf6ed;font-size:12px} .yozakura-anime .yz-top100-hero__facts>span {display:flex;gap:8px;align-items:center} .yozakura-anime .yz-top100-hero__facts .fal {color:#4bd5b2} .yozakura-anime .yz-top100-hero__badge {position:absolute;right:43px;top:35px;width:163px;height:172px;display:flex;align-items:center;justify-content:center;flex-direction:column;transform:rotate(9deg);border:1px solid rgba(249,206,112,.45);border-radius:30px;background:linear-gradient(145deg,rgba(236,176,71,.17),rgba(238,198,104,.025));color:#edc46e;box-shadow:0 18px 60px rgba(0,0,0,.18)} .yozakura-anime .yz-top100-hero__badge .fal {font-size:36px} .yozakura-anime .yz-top100-hero__badge b {font-size:51px;line-height:1.1;letter-spacing:-.07em} .yozakura-anime .yz-top100-hero__badge small {letter-spacing:.35em;font-size:11px} .yozakura-anime .yz-top100-intro {display:flex;align-items:end;justify-content:space-between;gap:18px;margin:32px 0 20px} .yozakura-anime .yz-top100-intro__eyebrow {color:#49d7b1;font-size:10px;letter-spacing:.17em;font-weight:900} .yozakura-anime .yz-top100-intro h2 {color:#fff;font-size:23px;font-weight:800;margin:6px 0 7px} .yozakura-anime .yz-top100-intro p {font-size:12px;line-height:1.6;color:#83a4a9;max-width:710px;margin:0} .yozakura-anime .yz-top100-intro__hint {font-size:12px;color:#83a5a3;white-space:nowrap} .yozakura-anime .yz-top100-intro__hint .fal {color:#48d5b0;margin-right:5px} .yozakura-anime .yz-top100-admin-content:empty {display:none} .yozakura-anime .yz-top100-admin-content:not(:empty) {padding:0 0 15px;color:#b3d4cc} .yozakura-anime .yz-top100-list {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;counter-reset:yz-top-place} .yozakura-anime .yz-top100-card {counter-increment:yz-top-place;min-width:0;position:relative;display:grid;grid-template-columns:50px 66px minmax(0,1fr) 140px 19px;gap:15px;align-items:center;min-height:106px;padding:13px 17px;background:#112229;border:1px solid #2b4044;border-radius:13px;color:#edf7f3;text-decoration:none;transition:background .18s,border-color .18s,transform .18s} .yozakura-anime .yz-top100-card:hover {color:#fff;text-decoration:none;border-color:#35bea0;background:#172f33;transform:translateY(-2px)} .yozakura-anime .yz-top100-card__number {display:flex;align-items:center;justify-content:center;color:#6d9297;gap:0;font-weight:900;line-height:1;font-size:25px;font-variant-numeric:tabular-nums} .yozakura-anime .yz-top100-card__number::after {content:counter(yz-top-place, decimal-leading-zero)} .yozakura-anime .yz-top100-card__number .fal {display:none} .yozakura-anime .yz-top100-card__poster {width:65px;height:90px;border-radius:9px;overflow:hidden;background:linear-gradient(150deg,#243f43,#0d191b);box-shadow:0 6px 17px rgba(0,0,0,.25)} .yozakura-anime .yz-top100-card__poster img {width:100%;height:100%;object-fit:cover;display:block;aspect-ratio:2/3} .yozakura-anime .yz-top100-card__info,.yozakura-anime .yz-top100-card__ratings {min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:7px} .yozakura-anime .yz-top100-card__title {color:#f0f7f6;font-size:15px;font-weight:800;line-height:1.35;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;overflow-wrap:anywhere} .yozakura-anime .yz-top100-card__original {font-size:11px;color:#7f9da4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%} .yozakura-anime .yz-top100-card__meta {display:flex;flex-wrap:wrap;gap:5px 8px;color:#a3c3c4;font-size:11px} .yozakura-anime .yz-top100-card__meta>span {padding-right:9px;border-right:1px solid #476065;line-height:1.2} .yozakura-anime .yz-top100-card__meta>span:last-child {border-right:none;padding-right:0} .yozakura-anime .yz-top100-card__meta .yz-top100-card__status {color:#40d8b0} .yozakura-anime .yz-top100-card__episodes {font-size:11px;font-weight:800;color:#4bd9b6} .yozakura-anime .yz-top100-card__ratings {gap:3px;align-items:flex-end;justify-self:end} .yozakura-anime .yz-top100-card__dle {color:#ffd783;display:flex;align-items:baseline;gap:5px;white-space:nowrap} .yozakura-anime .yz-top100-card__dle .fal {font-size:13px;align-self:center} .yozakura-anime .yz-top100-card__dle strong {font-size:24px;color:#f6fcfa;font-weight:900;letter-spacing:-.06em} .yozakura-anime .yz-top100-card__dle small,.yozakura-anime .yz-top100-card__shiki small {font-size:10px;color:#8babaa} .yozakura-anime .yz-top100-card__votes {font-size:10px;color:#79a19e;text-align:right;white-space:nowrap} .yozakura-anime .yz-top100-card__shiki {font-size:10px;color:#b5cfcc;white-space:nowrap} .yozakura-anime .yz-top100-card__shiki b {font-size:12px;color:#83e0c8;padding-left:3px} .yozakura-anime .yz-top100-card__dot {display:inline-block;width:5px;height:5px;background:#52cfa9;border-radius:50%;vertical-align:middle;margin-right:2px} .yozakura-anime .yz-top100-card__arrow {font-size:13px;color:#60807e;justify-self:end} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) {display:grid;grid-template-columns:91px minmax(0,1fr);grid-template-rows:auto 1fr auto;gap:13px 13px;align-items:start;min-height:260px;padding:18px;background:linear-gradient(145deg,#193234,#112229);border-color:#33635b;border-radius:16px;overflow:hidden} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(1) {background:radial-gradient(ellipse at top right,rgba(247,195,98,.17),transparent 70%),linear-gradient(145deg,#193234,#112229);border-color:#a2824f} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(2) {background:radial-gradient(ellipse at top right,rgba(207,225,235,.12),transparent 70%),linear-gradient(145deg,#193234,#112229);border-color:#647e84} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(3) {background:radial-gradient(ellipse at top right,rgba(196,120,84,.14),transparent 70%),linear-gradient(145deg,#193234,#112229);border-color:#785a47} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) .yz-top100-card__number {grid-column:1/-1;justify-content:flex-start;gap:8px;color:#eeca7c;font-size:26px} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(2) .yz-top100-card__number {color:#c7d8e0} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(3) .yz-top100-card__number {color:#cc9b80} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) .yz-top100-card__number .fal {display:block;font-size:18px} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) .yz-top100-card__poster {grid-column:1;grid-row:2 / span 2;width:91px;height:139px} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) .yz-top100-card__info {grid-column:2;grid-row:2;align-self:start} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) .yz-top100-card__title {font-size:15px} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) .yz-top100-card__ratings {grid-column:2;grid-row:3;align-self:end;justify-self:start;align-items:flex-start} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) .yz-top100-card__votes {text-align:left} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) .yz-top100-card__arrow {position:absolute;right:17px;top:23px} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(n+4) {grid-column:1/-1} .yozakura-anime .yz-top100-bottom {display:flex;align-items:flex-start;gap:9px;color:#739b9b;font-size:12px;line-height:1.5;margin-top:22px;padding:16px 20px;border-radius:12px;border:1px solid #244143;background:#102329} .yozakura-anime .yz-top100-empty {padding:24px;border-radius:12px;border:1px dashed #396963;color:#a6cbc5} @media (max-width:1380px) { .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) {grid-template-columns:75px minmax(0,1fr);padding:15px;gap:10px;min-height:250px} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) .yz-top100-card__poster {width:75px;height:115px} .yozakura-anime .yz-top100-card__meta {gap:4px 6px} } @media (max-width:1080px) { .yozakura-anime .yz-top100-list {grid-template-columns:1fr} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) {grid-column:1;grid-template-columns:98px minmax(0,1fr) 120px;grid-template-rows:auto;min-height:135px;align-items:center;padding:13px 15px} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) .yz-top100-card__number {grid-column:1;grid-row:1;position:absolute;left:21px;top:22px;z-index:1;background:#10262cdd;padding:6px;border-radius:8px} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) .yz-top100-card__poster {grid-column:1;grid-row:1;width:98px;height:123px} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) .yz-top100-card__info {grid-column:2;grid-row:1;align-self:center} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) .yz-top100-card__ratings {grid-column:3;grid-row:1;align-self:center;justify-self:end;align-items:flex-end} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) .yz-top100-card__arrow {display:none} } @media (max-width:720px) { .yozakura-anime .yz-top100-hero {padding:25px 23px;min-height:auto} .yozakura-anime .yz-top100-hero__badge {opacity:.19;right:12px;top:20px;transform:rotate(15deg) scale(.75)} .yozakura-anime .yz-top100-hero__inner {position:relative;z-index:2} .yozakura-anime .yz-top100-intro__hint {display:none} .yozakura-anime .yz-top100-card,.yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) {grid-template-columns:39px 66px minmax(0,1fr);min-height:112px;gap:10px;padding:12px} .yozakura-anime .yz-top100-card__number {font-size:16px} .yozakura-anime .yz-top100-card__poster,.yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) .yz-top100-card__poster {grid-column:2;grid-row:1;width:66px;height:90px} .yozakura-anime .yz-top100-card__info,.yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) .yz-top100-card__info {grid-column:3;grid-row:1;align-self:start} .yozakura-anime .yz-top100-card__number,.yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) .yz-top100-card__number {grid-column:1;grid-row:1;position:static;justify-content:center;align-self:start;background:none;padding:0} .yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) .yz-top100-card__number .fal {display:none} .yozakura-anime .yz-top100-card__ratings,.yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) .yz-top100-card__ratings {grid-column:3;grid-row:1;align-self:end;justify-self:start;align-items:flex-start;gap:2px} .yozakura-anime .yz-top100-card__info {padding-bottom:52px} .yozakura-anime .yz-top100-card__title,.yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) .yz-top100-card__title {font-size:13px} .yozakura-anime .yz-top100-card__original {display:none} .yozakura-anime .yz-top100-card__ratings .yz-top100-card__dle strong {font-size:17px} .yozakura-anime .yz-top100-card__ratings .yz-top100-card__votes {display:none} .yozakura-anime .yz-top100-card__shiki {font-size:9px} .yozakura-anime .yz-top100-card__arrow {display:none} .yozakura-anime .yz-top100-hero__facts {gap:8px} } @media (max-width:390px) { .yozakura-anime .yz-top100-hero h1 {font-size:29px} .yozakura-anime .yz-top100-card,.yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) {grid-template-columns:29px 57px minmax(0,1fr);gap:8px} .yozakura-anime .yz-top100-card__poster,.yozakura-anime .yz-top100-list>.yz-top100-card:nth-child(-n+3) .yz-top100-card__poster {width:57px;height:85px} .yozakura-anime .yz-top100-card__meta {font-size:10px} } /* YOZAKURA v15: mobile sign-in/profile links, using DLE login.tpl and existing menu clone. */ .yozakura-anime .anime-mobile-account {display:none!important;} .yozakura-anime .login {z-index:1100;} .yozakura-anime .overlay {z-index:1080;} .yozakura-anime .mobile-menu, .yozakura-anime .mobile-menu-close {z-index:1090;} .yozakura-anime.modal-is-opened #mobile-menu.is-active {left:-320px;} .yozakura-anime.modal-is-opened .mobile-menu-close.is-active {top:-40px;opacity:0;pointer-events:none;} @media(max-width:1220px) { .yozakura-anime #mobile-menu {display:flex;flex-direction:column;gap:12px;padding:16px;width:280px;} .yozakura-anime #mobile-menu > .side-block {order:1;margin:0;min-width:0;} .yozakura-anime #mobile-menu .anime-mobile-account { display:flex!important;flex-direction:column;order:0;gap:8px; padding:16px 12px;margin:0 0 10px;border:1px solid #35594f; border-radius:14px;background:linear-gradient(150deg,#183630,#102327); color:#eaf8f4;min-width:0; } .yozakura-anime #mobile-menu .anime-mobile-account__caption { font-size:10px;letter-spacing:1.4px;text-transform:uppercase; font-weight:800;color:#8eada7;margin-bottom:4px; } .yozakura-anime #mobile-menu .anime-mobile-account__identity { display:flex;align-items:center;gap:10px;min-width:0;margin-bottom:6px; } .yozakura-anime #mobile-menu .anime-mobile-account__identity > div {min-width:0;} .yozakura-anime #mobile-menu .anime-mobile-account__identity strong { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:15px;color:#fff; } .yozakura-anime #mobile-menu .anime-mobile-account__identity small { display:block;font-size:11px;color:#99b9b2;line-height:1.4; } .yozakura-anime #mobile-menu .anime-mobile-account__icon { font-size:32px;color:#36d6b0;flex:0 0 34px;text-align:center; } .yozakura-anime #mobile-menu .anime-mobile-account__avatar { width:42px;height:42px;flex:0 0 42px;object-fit:cover;border-radius:50%; border:2px solid #2dc8a4; } .yozakura-anime #mobile-menu .anime-mobile-account a { display:flex;align-items:center;justify-content:flex-start;gap:9px; min-height:41px;padding:10px 12px;text-decoration:none; border-radius:10px;font-size:13px;font-weight:700;line-height:1.2; color:#d4eae3;background:#1c3335;border:1px solid #31514b; } .yozakura-anime #mobile-menu .anime-mobile-account a .fal {width:17px;text-align:center;} .yozakura-anime #mobile-menu .anime-mobile-account a.anime-mobile-account__primary { background:#1bcda5;color:#061f1a;border-color:#1bcda5; } .yozakura-anime #mobile-menu .anime-mobile-account a:hover, .yozakura-anime #mobile-menu .anime-mobile-account a:focus-visible {filter:brightness(1.14);} .yozakura-anime #mobile-menu .anime-mobile-account a.anime-mobile-account__logout { color:#f5b2b0;background:#312428;border-color:#69414b; } } /* YOZAKURA v16 — direct profile/login access in the mobile header. Keeps the existing login modal and mobile menu unchanged. */ .yozakura-anime .anime-header-account {display:none;} @media (max-width:760px) { .yozakura-anime .header {gap:8px;} /* Avoid duplicate account icons from the older desktop control. */ .yozakura-anime .header .header__btn {display:none;} .yozakura-anime .anime-header-account { display:inline-flex!important;align-items:center;justify-content:center; width:40px;height:40px;min-width:40px;flex:0 0 40px; padding:0;border:1px solid #376254;border-radius:12px; color:#38e5b9;background:#19332e;text-decoration:none; overflow:hidden;cursor:pointer;line-height:1; } .yozakura-anime .anime-header-account .fal {font-size:21px;} .yozakura-anime .anime-header-account img { display:block;width:100%;height:100%;object-fit:cover;border-radius:11px; } .yozakura-anime .anime-header-account:hover, .yozakura-anime .anime-header-account:focus-visible { outline:2px solid #21cda3;outline-offset:2px;background:#214339; } .yozakura-anime .header__search {min-width:0;flex:1 1 auto;} } @media (max-width:470px) { .yozakura-anime .header {gap:6px;} .yozakura-anime .logo {min-width:0;flex:0 0 auto;} .yozakura-anime .header__search {min-width:0;width:0;flex:1 1 0;max-width:none;} .yozakura-anime .anime-header-account {width:40px;min-width:40px;flex-basis:40px;} } @media (max-width:355px) { .yozakura-anime .logo__caption {letter-spacing:.7px;} .yozakura-anime .header__search input {padding-left:9px;padding-right:32px;} .yozakura-anime .header__search button {width:31px;} } /* YOZAKURA OPINIONS START */ /* Scoped to the existing YOZAKURA theme. */ .yzop-stats{border:1px solid #29464a;background:linear-gradient(135deg,#142a2d,#102025);border-radius:16px;padding:18px;margin:20px 0 24px;color:#e9f5f2} .yzop-stats__head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:16px} .yzop-stats__head strong{font-size:20px;font-weight:800}.yzop-stats__head .fal{color:#20d7b4;margin-right:8px}.yzop-stats__total{font-size:12px;color:#91b7b9;border:1px solid #365657;border-radius:99px;padding:5px 10px} .yzop-stats__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.yzop-stat{padding:13px;border-radius:12px;border:1px solid #365055;background:#102126;min-width:0}.yzop-stat__label{font-weight:700;font-size:13px;line-height:1.35;margin-bottom:9px}.yzop-stat__label .fal{margin-right:6px}.yzop-stat__value{font-size:27px;font-weight:800;line-height:1}.yzop-stat__value small{font-size:12px;color:#9baeb2;font-weight:500} .yzop-stat__rail{height:6px;border-radius:20px;background:#344549;margin-top:11px;overflow:hidden}.yzop-stat__rail span{height:100%;display:block;border-radius:20px;background:#25d6a9}.yzop-stat--yes{border-color:#1b6c56}.yzop-stat--no{border-color:#76343f}.yzop-stat--no .yzop-stat__rail span{background:#f26973}.yzop-stat--neutral .yzop-stat__rail span{background:#a2b2c3}.yzop-stat__label{color:#e7f0ef}.yzop-stat--yes .yzop-stat__label{color:#4ee5ba}.yzop-stat--no .yzop-stat__label{color:#ff8590}.yzop-stats__empty{margin:12px 0 0;color:#99b8b8;font-size:13px} .yzop-choice{border:0;padding:0;margin:14px 0 18px;min-width:0}.yzop-choice legend{padding:0 0 10px;font-size:15px;font-weight:800;color:#e7f5f2}.yzop-choice__options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px} .yzop-choice__option{min-width:0;cursor:pointer;display:block}.yzop-choice__option input{position:absolute;opacity:0;width:1px;height:1px}.yzop-choice__option>span{display:flex;align-items:center;justify-content:center;gap:6px;text-align:center;padding:12px 7px;border-radius:10px;background:#15292d;color:#b6c8ca;border:1px solid #365154;font-size:13px;font-weight:700;min-height:47px;transition:.15s} .yzop-choice__option--yes input:checked+span{color:#70ffd2;background:#14392f;border-color:#24d5a5;box-shadow:0 0 0 1px #24d5a544}.yzop-choice__option--no input:checked+span{color:#ff9fa7;background:#40242b;border-color:#f26973}.yzop-choice__option--neutral input:checked+span{color:#eef4fc;background:#293842;border-color:#9aaab9}.yzop-choice__option input:focus-visible+span{outline:2px solid #fff;outline-offset:2px} .yzop-badge{display:inline-flex;align-items:center;gap:5px;font-weight:700;font-size:11px;line-height:1.1;padding:5px 9px;margin-top:6px;border:1px solid;border-radius:100px}.yzop-badge--yes{color:#71edbc;border-color:#19684c;background:#17362c}.yzop-badge--no{color:#ff9096;border-color:#813e48;background:#38252a}.yzop-badge--neutral{color:#bbcedc;border-color:#576978;background:#233039} @media(max-width:660px){.yzop-stats{padding:13px}.yzop-stats__grid{grid-template-columns:1fr;gap:7px}.yzop-stat{padding:10px 12px}.yzop-stat__value{font-size:22px}.yzop-choice__options{grid-template-columns:1fr}.yzop-choice__option>span{min-height:42px}} /* YOZAKURA OPINIONS END */