/* Doramagid — популярные дорамы [dorama_populyarnye]. Цвета и формы как у расписания. */
.dgdp{--p-ink:#22142e;--p-text:#3d3148;--p-accent:#4f1a7e;--p-accent2:#6c2aa6;--p-muted:#6b5f75;--p-line:#e7dfea;--p-tint:#f4eef6;--p-hot:#ff3d6a;
	font-family:Montserrat,system-ui,sans-serif;color:var(--p-text);font-size:14px;line-height:1.4;margin:0 0 28px;container-type:inline-size;container-name:dgdp}
.dgdp *,.dgdp *::before,.dgdp *::after{box-sizing:border-box}
.dgdp p::before,.dgdp span::before,.dgdp li::before{display:none}
.dgdp button{font-family:inherit;cursor:pointer}

.dgdp-tabs{display:inline-flex;gap:4px;padding:5px;margin:0 0 14px;background:#fff;border:1px solid var(--p-line);border-radius:14px}
.dgdp .dgdp-tabs button{height:36px;margin:0;padding:0 16px;border:0;border-radius:10px;background:transparent;color:var(--p-muted);font-size:14px;font-weight:700}
.dgdp .dgdp-tabs button:hover{background:var(--p-tint);color:var(--p-ink)}
.dgdp .dgdp-tabs button.is-active{background:var(--p-accent);color:#fff}
.dgdp-panel[hidden]{display:none}

.dgdp .dgdp-list{margin:0;padding:0;list-style:none}
.dgdp .dgdp-item{margin:0;padding:0;list-style:none}
.dgdp .dgdp-item__link{display:flex;text-decoration:none;color:var(--p-ink)}
.dgdp-item__poster{position:relative;display:block;overflow:hidden;background:linear-gradient(160deg,var(--c1,#4f1a7e),var(--c2,#ff3d6a))}
.dgdp-item__poster img{display:block;width:100%!important;height:100%!important;margin:0!important;object-fit:cover;border-radius:0!important;transition:transform .35s}
.dgdp .dgdp-item__link:hover .dgdp-item__poster img{transform:scale(1.04)}
.dgdp-item__ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:10px;color:#fff;font-weight:800;text-align:center}
.dgdp-item__body{display:flex;flex-direction:column;gap:3px;min-width:0}
.dgdp-item__title{font-size:14px;font-weight:700;line-height:1.3;color:var(--p-ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.dgdp .dgdp-item__link:hover .dgdp-item__title{color:var(--p-accent2)}
.dgdp-item__meta{font-size:12px;color:var(--p-muted)}
.dgdp-item__metric{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:700;color:var(--p-hot)}
.dgdp-item__metric::before{content:"";display:inline-block!important;width:14px;height:14px;background:currentColor;-webkit-mask:var(--ico) center/contain no-repeat;mask:var(--ico) center/contain no-repeat}
.dgdp-item__metric--views{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 5C6.5 5 2.7 9.4 1.5 12c1.2 2.6 5 7 10.5 7s9.3-4.4 10.5-7C21.3 9.4 17.5 5 12 5zm0 11a4 4 0 1 1 0-8 4 4 0 0 1 0 8z'/%3E%3C/svg%3E")}
.dgdp-item__metric--comments{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 4h16a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H9l-5 4v-4a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2z'/%3E%3C/svg%3E")}

/* Постеры сеткой */
.dgdp .dgdp-list--grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:18px 14px}
.dgdp-list--grid .dgdp-item__link{flex-direction:column;gap:8px}
.dgdp-list--grid .dgdp-item__poster{aspect-ratio:2/3;border-radius:14px}
.dgdp-list--grid .dgdp-item__rank{position:absolute;left:8px;top:8px;display:flex;align-items:center;justify-content:center;min-width:30px;height:30px;padding:0 8px;border-radius:10px;background:rgba(34,20,46,.82);color:#fff;font-size:15px;font-weight:800;backdrop-filter:blur(4px)}
.dgdp-list--grid .dgdp-item:nth-child(-n+3) .dgdp-item__rank{background:linear-gradient(160deg,var(--p-accent2),var(--p-hot))}
.dgdp-item__status{position:absolute;right:8px;bottom:8px;padding:3px 8px;border-radius:999px;background:#fff;color:var(--p-accent);font-size:11px;font-weight:800}
.dgdp-item__status--ongoing{background:var(--p-hot);color:#fff}

/* Нумерованный список */
.dgdp .dgdp-list--list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:8px 16px}
.dgdp-list--list .dgdp-item__link{align-items:center;gap:12px;padding:8px 10px;border:1px solid var(--p-line);border-radius:14px;background:#fff;transition:border-color .2s,box-shadow .2s}
.dgdp-list--list .dgdp-item__link:hover{border-color:#d9c9e2;box-shadow:0 6px 18px rgba(79,26,126,.08)}
.dgdp-list--list .dgdp-item__poster{flex:0 0 48px;width:48px;height:66px;border-radius:9px;overflow:visible}
.dgdp-list--list .dgdp-item__poster img{border-radius:9px!important}
.dgdp-list--list .dgdp-item__rank{position:absolute;left:-6px;top:-6px;display:flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 5px;border-radius:7px;background:var(--p-accent);color:#fff;font-size:12px;font-weight:800;box-shadow:0 0 0 2px #fff}
.dgdp-list--list .dgdp-item:nth-child(-n+3) .dgdp-item__rank{background:var(--p-hot)}
.dgdp-list--list .dgdp-item__ph{font-size:0}

.dgdp-empty{margin:0;padding:18px;border:1px dashed var(--p-line);border-radius:16px;background:#fff;text-align:center;color:var(--p-muted)}
.dgdp-more{display:flex;justify-content:center;margin:16px 0 0}
.dgdp .dgdp-more a{display:inline-flex;padding:9px 20px;border:1px solid var(--p-accent);border-radius:999px;color:var(--p-accent);font-size:14px;font-weight:700;text-decoration:none}
.dgdp .dgdp-more a:hover{background:var(--p-accent);color:#fff}

@container dgdp (max-width:520px){
	.dgdp .dgdp-list--grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 10px}
	.dgdp .dgdp-list--list{grid-template-columns:1fr}
}
