.storage-page { padding: 14px 16px 20px; color: #192b25; font-size: 12px; }
.storage-page .page-toolbar { margin-bottom: 10px; padding: 0; color: #192b25; background: transparent; }
.storage-page .page-toolbar h1 { margin: 0; color: #192b25; font-size: 22px; line-height: 1.15; }
.storage-page .page-toolbar p { margin: 4px 0 0; color: #667970; }
.storage-load-warning { margin: 0 0 10px; padding: 8px 10px; border: 1px solid #efd0d0; border-radius: 7px; background: #fff4f4; color: #a23939; }
.storage-metrics { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin-bottom: 12px; }
.storage-metric { min-height: 82px; display: flex; gap: 10px; align-items: flex-start; padding: 12px; border: 1px solid #dfe8e3; border-radius: 9px; background: #fff; box-shadow: 0 2px 8px rgba(8,49,38,.035); }
.storage-metric-icon { width: 32px; height: 32px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 8px; color: #156c4c; background: #e8f5ec; }
.storage-metric-icon svg { width: 19px; height: 19px; }
.storage-metric.blue .storage-metric-icon { color: #3374bd; background: #eaf2ff; }
.storage-metric.purple .storage-metric-icon { color: #7653bd; background: #f1ebff; }
.storage-metric.teal .storage-metric-icon { color: #23776c; background: #e9f7f4; }
.storage-metric.error .storage-metric-icon { color: #a74545; background: #fff0f0; }
.storage-metric div { min-width: 0; display: grid; gap: 2px; }
.storage-metric small, .storage-metric span { color: #667970; font-size: 10px; }
.storage-metric strong { overflow: hidden; text-overflow: ellipsis; font-size: 17px; white-space: nowrap; }
.storage-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 12px; align-items: start; }
.storage-main { width: 100%; min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.storage-main > * { min-width: 0; max-width: 100%; }
.storage-actions-panel, .storage-browser, .storage-aside section { border: 1px solid #dfe8e3; border-radius: 10px; background: #fff; box-shadow: 0 2px 8px rgba(8,49,38,.035); }
.storage-browser { overflow: hidden; }
.storage-actions-panel { padding: 12px; }
.storage-action-row { display: flex; flex-wrap: wrap; gap: 9px; align-items: end; }
.storage-action-row label { min-width: 200px; display: grid; gap: 4px; color: #42574f; font-size: 10px; font-weight: 700; }
.storage-page input, .storage-page select { min-height: 34px; padding: 6px 9px; border: 1px solid #d5e0da; border-radius: 6px; color: #21352e; background: #fff; font: inherit; }
.storage-action-row .button { min-height: 34px; display: inline-flex; gap: 7px; align-items: center; }
.storage-action-row .button svg { width: 15px; height: 15px; }
.storage-safety-banner { display: flex; gap: 8px; align-items: center; margin: 10px 0 0; padding: 8px 10px; border-radius: 6px; color: #53675f; background: #f2f7f4; }
.storage-safety-banner svg { width: 17px; height: 17px; flex: 0 0 auto; color: #287056; }
.storage-filters { display: grid; grid-template-columns: minmax(170px, 1.25fr) repeat(3, minmax(125px, .75fr)) auto 34px; gap: 8px; align-items: end; padding: 9px; border-bottom: 1px solid #e1e9e4; }
.storage-filters label { display: grid; gap: 4px; color: #53665e; font-size: 10px; font-weight: 700; }
.storage-search { position: relative; }
.storage-search svg { position: absolute; z-index: 1; left: 9px; bottom: 9px; width: 15px; height: 15px; color: #73827c; }
.storage-search input { padding-left: 31px; }
.storage-filters .button { min-height: 34px; }
.storage-filters .icon-only { width: 34px; padding: 0; display: grid; place-items: center; }
.storage-filters .icon-only svg { width: 16px; height: 16px; }
.storage-table-wrap { width: 100%; overflow-x: auto; }
.storage-table-wrap table { width: 100%; min-width: 1050px; border-collapse: collapse; }
.storage-table-wrap th { padding: 8px; border-bottom: 1px solid #dfe8e3; color: #53665e; background: #fbfcfb; font-size: 9px; text-align: left; text-transform: uppercase; letter-spacing: .025em; }
.storage-table-wrap td { height: 46px; padding: 6px 8px; border-bottom: 1px solid #e5ece8; vertical-align: middle; white-space: nowrap; }
.storage-table-wrap tr { cursor: pointer; }
.storage-table-wrap tbody tr:hover, .storage-table-wrap tbody tr.selected { background: #f1f8f4; }
.storage-name-cell { min-width: 225px; max-width: 310px; display: flex; gap: 8px; align-items: center; }
.storage-name-cell > span:last-child { min-width: 0; display: grid; }
.storage-name-cell b, .storage-name-cell small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.storage-name-cell small { margin-top: 2px; color: #74847d; font-size: 9px; }
.storage-artifact-icon { width: 29px; height: 29px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 7px; color: #17684c; background: #e7f5eb; }
.storage-artifact-icon.export { color: #4b73c4; background: #edf3ff; }
.storage-artifact-icon.failed { color: #c24a43; background: #fff0ef; }
.storage-artifact-icon svg { width: 16px; height: 16px; }
.storage-table-wrap code, .storage-detail-card code { color: #405850; font: 10px ui-monospace, SFMono-Regular, Consolas, monospace; }
.storage-row-actions { display: flex; gap: 3px; }
.storage-row-actions button { width: 27px; height: 27px; display: grid; place-items: center; padding: 0; border: 1px solid #d6e1db; border-radius: 5px; color: #244d3f; background: #fff; cursor: pointer; }
.storage-row-actions button:hover { border-color: #80ae99; background: #f0f8f4; }
.storage-row-actions svg { width: 14px; height: 14px; }
.storage-table-empty { min-height: 190px; display: grid; place-content: center; justify-items: center; text-align: center; color: #6b7d75; }
.storage-table-empty > span svg { width: 30px; height: 30px; }
.storage-table-empty h3 { margin: 8px 0 3px; color: #253a32; font-size: 15px; }
.storage-table-empty p { margin: 0; }
.storage-pagination { min-height: 45px; display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 7px 10px; color: #60736b; }
.storage-pagination > div { display: flex; gap: 4px; align-items: center; }
.storage-pagination button { min-width: 28px; height: 28px; border: 1px solid #d8e2dd; border-radius: 5px; background: #fff; cursor: pointer; }
.storage-pagination button.active { color: #fff; background: #176e4b; }
.storage-pagination button:disabled { opacity: .38; cursor: default; }
.storage-pagination label { display: flex; gap: 6px; align-items: center; margin-left: 8px; }
.storage-pagination select { min-width: 66px; min-height: 28px; padding: 4px; }
.storage-aside { min-width: 0; display: grid; gap: 12px; position: sticky; top: 74px; }
.storage-aside section { overflow: hidden; }
.storage-aside header { padding: 10px 12px; border-bottom: 1px solid #e2e9e5; }
.storage-aside h3 { margin: 0; font-size: 13px; }
.storage-activity-list { margin: 0; padding: 5px 12px; list-style: none; }
.storage-activity-list li { display: flex; gap: 8px; padding: 8px 0; border-bottom: 1px solid #edf1ef; }
.storage-activity-list li:last-child { border: 0; }
.storage-activity-list li > span:last-child { min-width: 0; display: grid; gap: 2px; }
.storage-activity-list b, .storage-activity-list small, .storage-activity-list time { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.storage-activity-list b { font-size: 11px; }
.storage-activity-list small, .storage-activity-list time { color: #6c7e76; font-size: 9px; }
.storage-activity-empty, .storage-details-empty { min-height: 145px; display: grid; place-content: center; justify-items: center; padding: 18px; color: #6b7d75; text-align: center; }
.storage-activity-empty p, .storage-details-empty h3 { margin: 0; color: #263a33; }
.storage-activity-empty small, .storage-details-empty p { margin: 5px 0 0; }
.storage-details-empty span svg { width: 31px; height: 31px; }
.storage-detail-card { padding: 11px; }
.storage-detail-title { display: flex; gap: 9px; align-items: center; margin-bottom: 9px; }
.storage-detail-title h3 { margin: 0; font-size: 13px; word-break: break-word; }
.storage-detail-title p { margin: 2px 0 0; color: #6f8079; }
.storage-detail-card dl, .storage-restore-preview dl { margin: 0; }
.storage-detail-card dl div, .storage-restore-preview dl div { display: grid; grid-template-columns: 90px minmax(0,1fr); gap: 7px; padding: 6px 0; border-bottom: 1px solid #edf1ef; }
.storage-detail-card dt, .storage-restore-preview dt { color: #708079; }
.storage-detail-card dd, .storage-restore-preview dd { min-width: 0; margin: 0; color: #23372f; word-break: break-word; }
.storage-detail-error { padding: 7px; border-radius: 5px; color: #a63c3c; background: #fff0f0; }
.storage-detail-actions { display: flex; gap: 5px; margin-top: 10px; }
.storage-detail-actions .storage-row-actions { display: contents; }
.storage-usage { display: grid; grid-template-columns: auto auto auto 42px minmax(120px, 1fr) auto; gap: 9px; align-items: center; margin-top: 12px; padding: 10px 12px; border: 1px solid #dfe8e3; border-radius: 9px; background: #f9fbfa; }
.storage-usage > span:first-child { display: flex; gap: 7px; align-items: center; color: #52665e; }
.storage-usage svg { width: 17px; height: 17px; color: #1a7652; }
.storage-usage strong, .storage-usage em { color: #177149; font-style: normal; }
.storage-usage > div { height: 7px; overflow: hidden; border-radius: 99px; background: #e0e9e4; }
.storage-usage > div i { display: block; height: 100%; border-radius: inherit; background: #208757; }
.storage-restore-preview > p { margin-top: 0; color: #53665e; }
.storage-restore-preview label { display: grid; gap: 5px; margin-top: 12px; font-weight: 700; }
@media (max-width: 1180px) {
  .storage-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .storage-layout { grid-template-columns: 1fr; }
  .storage-aside { position: static; grid-template-columns: 1fr 1fr; }
  .storage-filters { grid-template-columns: minmax(180px, 1fr) repeat(2, minmax(125px, .7fr)) auto auto; }
  .storage-filters label:nth-of-type(4) { grid-column: span 2; }
}
@media (max-width: 760px) {
  .storage-page { padding: 10px; }
  .storage-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .storage-filters { grid-template-columns: 1fr 1fr; }
  .storage-filters > * { min-width: 0; }
  .storage-filters .storage-search, .storage-filters label:nth-of-type(4) { grid-column: 1 / -1; }
  .storage-aside { grid-template-columns: 1fr; }
  .storage-pagination { align-items: stretch; flex-direction: column; }
  .storage-pagination > div { flex-wrap: wrap; }
  .storage-usage { grid-template-columns: auto auto 1fr; }
  .storage-usage > div { grid-column: 1 / -1; }
}
@media (max-width: 430px) {
  .storage-page .page-toolbar h1 { font-size: 19px; }
  .storage-metrics, .storage-filters { grid-template-columns: 1fr; }
  .storage-filters > *, .storage-filters .storage-search, .storage-filters label:nth-of-type(4) { grid-column: auto; }
  .storage-action-row { align-items: stretch; flex-direction: column; }
  .storage-action-row label { min-width: 0; }
  .storage-action-row .button { width: 100%; min-width: 0; }
  .storage-safety-banner { align-items: flex-start; }
  .storage-metric { min-height: 70px; }
  .storage-usage { grid-template-columns: 1fr auto; }
  .storage-usage > span:nth-of-type(2), .storage-usage strong { display: none; }
}