.portfolio-kpis-five { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.portfolio-period-controls { margin-bottom: 14px; padding: 15px; border: 1px solid #e4e7ec; border-radius: 12px; background: #f9fafb; }
.portfolio-period-main { display: grid; grid-template-columns: minmax(230px, 1.5fr) repeat(2, minmax(150px, 1fr)) auto; gap: 10px; align-items: end; }
.portfolio-period-main label { display:flex; flex-direction:column; gap:6px; font-size:13px; font-weight:600; color:#475467; }
.portfolio-period-main select,.portfolio-period-main input { width:100%; min-height:42px; padding:9px 10px; border:1px solid #d0d5dd; border-radius:8px; background:#fff; font:inherit; color:#172033; }
.portfolio-period-hint { margin:10px 0 0; font-size:12px; }
.compact-period-banner { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:12px 0; padding:11px 14px; border:1px solid #e4e7ec; border-radius:10px; background:#fff; }
.period-price-ok { font-size:12px; font-weight:700; color:#027a48; }
.portfolio-history-details { margin-top:16px; }
@media (max-width:1000px) { .portfolio-kpis-five { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:900px) { .portfolio-period-main { grid-template-columns:1fr 1fr; } .portfolio-period-main label:first-child { grid-column:1/-1; } }
@media (max-width:600px) { .portfolio-kpis-five { grid-template-columns:1fr 1fr; } .portfolio-period-main { grid-template-columns:1fr; } .portfolio-period-main label:first-child { grid-column:auto; } }