.metric-cards { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; } .project-metric-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); } .mini-panel { padding: 14px; min-height: 116px; } .mini-panel[data-action] { cursor: pointer; } .mini-panel[data-action]:hover { border-color: rgba(91, 214, 255, 0.52); filter: brightness(1.08); } .mini-label { position: relative; color: #a8cbe1; font-size: 13px; margin-bottom: 8px; } .mini-value { position: relative; font-family: var(--num); font-size: 30px; line-height: 1; color: white; font-weight: 900; } .mini-desc { position: relative; margin-top: 10px; color: #94bad1; font-size: 12px; } .project-layout { display: grid; grid-template-columns: minmax(320px, 0.72fr) minmax(0, 1.28fr); gap: 12px; align-items: start; } .field-list { position: relative; z-index: 1; display: grid; gap: 9px; } .field-row { display: grid; grid-template-columns: 112px 1fr; gap: 12px; padding: 11px 12px; border-radius: 13px; background: rgba(0, 18, 37, 0.36); border: 1px solid rgba(91, 180, 255, 0.14); } .field-name { color: #91bdd5; font-size: 13px; } .field-value { color: white; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .empty-state { position: relative; z-index: 1; min-height: 220px; display: grid; place-items: center; color: #9ec2da; border: 1px dashed rgba(115, 198, 255, 0.25); border-radius: 14px; background: rgba(0, 16, 31, 0.24); } .explain { position: relative; z-index: 1; margin-top: 10px; color: #9fc2d9; font-size: 12px; line-height: 1.5; }