/* 文言：用量之页与平台运维之页共此式：用量客器所成之筛、卡、表皆在焉。汉语：用量与计费页（/cloud/用量/）和平台运维页共用的样式：用量应用生成的筛选器、卡片与明细表。 */
/* 文言：费账有门有日，项目诸耗各列其名。汉语：用量分析使用可换行筛选器、项目与类别卡片，以及可横向滚动的明细表。 */
.用量说明{max-width:850px;color:var(--豫次);line-height:1.7}.用量筛选{display:flex;flex-wrap:wrap;align-items:end;gap:12px;margin:20px 0 16px;padding:18px;border:1px solid var(--豫线);background:#fffefa}.用量筛选 label{display:flex;flex-direction:column;gap:5px;min-width:135px;font-size:12px;color:var(--豫次)}.用量筛选 input,.用量筛选 select{min-height:36px;padding:6px 9px;border:1px solid var(--豫线);border-radius:3px;background:#fffefa;color:var(--豫墨);font:inherit}.用量筛选 button{min-height:36px}.用量内容{display:grid;gap:18px;margin-top:18px}.用量汇总卡,.用量分类卡{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}.用量汇总卡 article,.用量分类卡 article,.用量块{background:#fffefa;border:1px solid var(--豫线);padding:16px}.用量汇总卡 article,.用量分类卡 article{display:flex;flex-direction:column;gap:8px}.用量汇总卡 small,.用量分类卡 small{color:var(--豫次)}.用量汇总卡 strong,.用量分类卡 strong{font-size:20px;font-weight:600}.用量块 h3{margin:0 0 16px}.用量表滚动{overflow:auto}.用量块 table{width:100%;min-width:650px;border-collapse:collapse;text-align:left}.用量块 th,.用量块 td{padding:9px 11px;border-bottom:1px solid var(--豫线);font-size:12px;white-space:nowrap}.用量块 th{color:var(--豫次);font-weight:600}.用量日行{display:grid;grid-template-columns:96px minmax(100px,1fr) 130px;align-items:center;gap:12px;margin:7px 0;font-size:12px}.用量日轨{height:12px;background:var(--豫浅);display:flex;overflow:hidden;border-radius:2px}.用量段{display:block;min-width:1px;background:#a94439}.用量段[data-category=storage]{background:#557a68}.用量段[data-category=gateway]{background:#b48943}.用量段[data-category=platform]{background:#8271a0}.用量段[data-category=other]{background:#84929c}.用量分类卡 article[data-category=compute]{border-top:3px solid #a94439}.用量分类卡 article[data-category=storage]{border-top:3px solid #557a68}.用量分类卡 article[data-category=gateway]{border-top:3px solid #b48943}.用量分类卡 article[data-category=platform]{border-top:3px solid #8271a0}.用量分类卡 article[data-category=other]{border-top:3px solid #84929c}
@media(max-width:700px){.用量筛选 label{flex:1 1 130px}.用量日行{grid-template-columns:74px minmax(80px,1fr) 96px;gap:6px;font-size:10px}.用量汇总卡,.用量分类卡{grid-template-columns:repeat(2,minmax(0,1fr))}}