/* Mobile: reserve separate rows for dates, descriptions and large totals. */
@media(max-width:760px){
 .app-layout .timeline-item{grid-template-columns:20px minmax(0,1fr);grid-template-rows:auto auto;gap:6px 12px;padding-bottom:24px;min-height:96px;align-items:start}
 .app-layout .timeline-item .timeline-dot{grid-column:1;grid-row:1/3}
 .app-layout .timeline-item time{grid-column:2;grid-row:1;position:static;line-height:1.5}
 .app-layout .timeline-item>div:not(.timeline-dot){grid-column:2;grid-row:2;min-width:0}
 .app-layout .totals-grid .metric{flex-direction:row;text-align:left}
 .app-layout .totals-grid .metric+.metric{border-left:0}
 .app-layout .totals-grid .metric .value{min-width:0;max-width:60%;line-height:1.4}
 .app-layout .folder{grid-template-columns:38px minmax(0,1fr) 16px;gap:12px;padding:20px 16px}
 .app-layout .folder .folder-status{grid-column:2;grid-row:2;border-left:0;border-top:1px solid var(--edge);padding:12px 0 0;display:flex;flex-wrap:wrap;gap:10px 16px}
 .app-layout .folder .folder-status>span+span{margin-top:0}
 .app-layout .folder>.icon{grid-column:3;grid-row:1}
 .modal .form-grid>*{min-width:0;max-width:100%}
 .modal input:not([type=checkbox]),.modal select,.modal textarea{font-size:16px;min-width:0;max-width:100%}
 .modal .button{max-width:100%;white-space:normal;line-height:1.4}
 .admin-topbar-actions{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .admin-topbar-actions .button{min-width:0;width:100%;white-space:normal;overflow-wrap:anywhere;min-height:48px;line-height:1.4;text-align:center}
}
@media(max-width:380px){
 .app-layout .investment-card{grid-template-columns:80px minmax(0,1fr);gap:16px 12px;padding-left:14px;padding-right:14px}
 .app-layout .investment-card .ring{width:80px;height:80px;min-width:80px;padding:10px}
 .app-layout .investment-card .investment-heading h3{font-size:16px!important}
}
@media(max-width:600px){
 .client-card-heading{display:grid;grid-template-columns:52px minmax(0,1fr);align-items:start;gap:10px 14px}
 .client-card-heading .client-avatar{width:52px;height:52px;min-width:52px}
 .client-card-heading>.chip{grid-column:2;justify-self:start}
}