/* v0.10 ランキング。色は avsi.css の変数、カードの部品は avsi-home.css（.avsi-hcard__img など）を使う。 */
.avsi-rank{margin:0 0 36px}
.avsi-rank__time{margin:0 0 10px;font-size:.8em;color:var(--avsi-sub)}
.avsi-rank__tabs{background:#fff;border:1px solid var(--avsi-line);border-radius:14px;padding:6px;margin:0 0 18px;flex-wrap:nowrap}
.avsi-rank__tabs .avsi-tab{flex:1;justify-content:center;padding:0 8px}
.avsi-rank__panel[hidden],.avsi-rank [data-avsi-rank-sub][hidden]{display:none !important}
.avsi-rank__panel{margin:0 0 28px}
.avsi-rank__h2{margin:0 0 6px !important}
.avsi-rank__note{margin:0 0 12px;font-size:.8em;line-height:1.7;color:var(--avsi-sub)}
.avsi-rank__period{display:flex;gap:8px;margin:0 0 12px}
.avsi-rank__period .avsi-chip{cursor:pointer;font-weight:bold}
.avsi-rank__period .avsi-chip.is-current{background:var(--avsi-ink);border-color:var(--avsi-ink);color:#fff !important}
.avsi-rank__list{list-style:none !important;margin:0 !important;padding:0 !important;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,360px),1fr));gap:12px}
.avsi-rank__li{margin:0 !important;padding:0 !important;list-style:none !important}
.avsi-rank__li::before,.avsi-rank__li::marker{display:none;content:none}
.avsi-rank__item{position:relative;display:flex;gap:12px;align-items:flex-start;height:100%;box-sizing:border-box;background:#fff;border:1px solid var(--avsi-line);border-radius:12px;padding:10px;color:inherit !important;text-decoration:none !important;transition:box-shadow .15s,transform .15s}
.avsi-rank__item:hover{box-shadow:0 8px 22px rgba(0,0,0,.12);transform:translateY(-2px)}
.avsi-rank__no{position:absolute;top:-6px;left:-6px;z-index:2;display:flex;align-items:center;justify-content:center;min-width:30px;height:30px;padding:0 4px;box-sizing:border-box;border-radius:999px;background:var(--avsi-ink);color:#fff;font-weight:900;font-size:.9em;box-shadow:0 2px 6px rgba(0,0,0,.2)}
.avsi-rank__item.is-top1 .avsi-rank__no{background:#c9a227;min-width:36px;height:36px;font-size:1.05em}
.avsi-rank__item.is-top2 .avsi-rank__no{background:#9aa0a6;min-width:34px;height:34px}
.avsi-rank__item.is-top3 .avsi-rank__no{background:#b87333;min-width:34px;height:34px}
.avsi-rank__item.is-top1{border-color:#e6cf7a}
.avsi-rank__img{width:150px;flex:none}
.avsi-rank__img .avsi-off{font-size:.72em}
.avsi-rank__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;font-size:.85em}
.avsi-rank__title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.45;font-weight:bold}
.avsi-rank__actor{font-size:.9em;color:var(--avsi-sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.avsi-rank__price del{color:var(--avsi-sub);margin-right:4px;font-size:.9em}
.avsi-rank__price strong{color:var(--avsi-accent);font-size:1.25em}
.avsi-rank__meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;font-size:.85em;color:var(--avsi-sub)}
.avsi-rank__why{flex-basis:100%;font-weight:bold;color:var(--avsi-accent)}
.avsi-rank__why.is-filled{font-weight:normal;color:var(--avsi-sub)}
@media (max-width:834px){
	.avsi-rank__list{grid-template-columns:minmax(0,1fr);gap:10px}
	.avsi-rank__img{width:118px}
	.avsi-rank__tabs .avsi-tab{min-height:44px;font-size:.92em}
}
@media (max-width:360px){
	.avsi-rank__img{width:96px}
}
