.ref-page-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 14px 16px; border: 1px solid rgba(105, 184, 239, .2); border-radius: 13px; background: rgba(7, 17, 29, .88); }
.ref-page-header h1 { margin: 4px 0 4px; font-size: 24px; }
.ref-page-header p { margin: 0; color: #9fb0c0; font-size: 10px; }
.ref-header-actions { display: flex; gap: 8px; }
.ref-quick-action { min-width: 116px; display: grid; grid-template-columns: 1fr auto; gap: 2px 8px; text-align: left; background: rgba(13, 28, 45, .88); }
.ref-quick-action strong { font-size: 10px; }
.ref-quick-action small { color: #8396a8; font-size: 8px; }
.ref-quick-action .nv-icon { grid-row: 1 / 3; grid-column: 2; align-self: center; }
.ref-metric-strip { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; margin-top: 9px; }
.ref-metric { min-height: 70px; padding: 10px 12px; border: 1px solid rgba(105, 184, 239, .17); border-radius: 11px; background: rgba(10, 22, 37, .84); }
.ref-metric span, .ref-metric strong, .ref-metric small { display: block; }
.ref-metric span { color: #7793aa; font-size: 8px; letter-spacing: .1em; text-transform: uppercase; }
.ref-metric strong { margin-top: 4px; font-size: 17px; }
.ref-metric small { margin-top: 3px; color: #8294a6; font-size: 8px; }
.ref-metric.cyan { border-top-color: var(--cyan); }
.ref-metric.green { border-top-color: var(--green); }
.ref-metric.amber { border-top-color: var(--amber); }
.ref-metric.violet { border-top-color: var(--violet); }
.ref-dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(330px, .82fr); gap: 9px; margin-top: 9px; }
.ref-panel { min-width: 0; padding: 12px; border: 1px solid rgba(105, 184, 239, .18); border-radius: 12px; background: rgba(7, 17, 30, .9); box-shadow: var(--inner-glow); }
.ref-colony-status { grid-row: span 2; min-height: 380px; position: relative; overflow: hidden; background: linear-gradient(180deg, rgba(8,20,35,.94), rgba(4,12,22,.96)); }
.ref-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.ref-panel-head h2 { margin: 3px 0 0; font-size: 16px; }
.ref-colony-summary { display: grid; grid-template-columns: 150px minmax(0,1fr); gap: 14px; margin-top: 14px; align-items: center; }
.ref-colony-thumb { height: 110px; border-radius: 10px; overflow: hidden; border: 1px solid rgba(105,184,239,.18); }
.ref-colony-thumb picture, .ref-colony-thumb img { width: 100%; height: 100%; display:block; object-fit:cover; }
.ref-colony-summary strong { font-size: 18px; }
.ref-colony-summary p { color: #9fb0bf; font-size: 10px; }
.ref-priority-card { position: absolute; left: 12px; right: 12px; bottom: 12px; min-height: 150px; display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding: 18px; border: 1px solid rgba(94,203,255,.18); border-radius: 12px; background: radial-gradient(circle at 66% 25%, rgba(77,224,170,.15), transparent 32%), linear-gradient(135deg, #07111d, #0b1727); }
.ref-priority-card h3 { margin: 6px 0 4px; font-size: 24px; max-width: 360px; }
.ref-priority-card p { margin: 0; color:#9fb0bf; font-size: 11px; max-width: 430px; }
.ref-task-list, .ref-warning-list, .ref-feed-list { display: grid; gap: 7px; margin-top: 10px; }
.ref-task-row, .ref-warning-row, .ref-feed-row { min-height: 54px; display: grid; align-items: center; gap: 9px; padding: 8px; border: 1px solid rgba(105,184,239,.13); border-radius: 9px; background: rgba(12,25,42,.68); }
.ref-task-row { grid-template-columns: 28px minmax(0,1fr) auto; cursor:pointer; }
.ref-task-icon, .ref-feed-row > span { width: 28px; height: 28px; display:grid; place-items:center; color:var(--cyan); border-radius:50%; background:rgba(94,203,255,.08); }
.ref-task-icon .nv-icon, .ref-feed-row .nv-icon { width:14px;height:14px;stroke:currentColor; }
.ref-task-row strong, .ref-task-row small, .ref-warning-row strong, .ref-warning-row small, .ref-feed-row strong, .ref-feed-row small { display:block; }
.ref-task-row strong, .ref-warning-row strong, .ref-feed-row strong { font-size:10px; }
.ref-task-row small, .ref-warning-row small, .ref-feed-row small { margin-top:2px;color:#8295a7;font-size:8px; }
.ref-task-row em, .ref-warning-row em { color:#8ea2b5;font-size:8px;font-style:normal; }
.ref-warning-row { grid-template-columns: 7px minmax(0,1fr) auto; }
.ref-warning-row > i { width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px currentColor; }
.ref-warning-row.warn > i { background:var(--amber); }
.ref-warning-row.danger > i { background:var(--red); }
.ref-feed-row { grid-template-columns: 28px minmax(0,1fr); }
.ref-intel-art { height: 82px; margin-top: 10px; border-radius: 8px; overflow:hidden; }
.ref-intel-art picture, .ref-intel-art img { width:100%;height:100%;display:block;object-fit:cover; }
.ref-progress-row { margin-top: 8px; display:grid;grid-template-columns:1fr auto;gap:5px;font-size:8px; }
.ref-progress-row span { color:#93a5b6; }
.ref-progress-row i { grid-column:1/-1;height:4px;border-radius:999px;background:#16253a;overflow:hidden; }
.ref-progress-row b { display:block;height:100%;background:linear-gradient(90deg,var(--cyan),var(--violet)); }
.ref-intel-panel .ref-secondary-button { width:100%;margin-top:10px; }
.ref-empty-compact { padding:12px;border:1px dashed rgba(105,184,239,.18);border-radius:9px;color:#93a5b6; }
.ref-empty-compact strong, .ref-empty-compact small { display:block; }
.ref-empty-compact strong { color:#dce9f4;font-size:10px; }
.ref-empty-compact small { margin-top:3px;font-size:8px; }
.ref-empty-compact button { margin-top:9px;min-height:30px;padding:5px 9px;font-size:9px; }

@media (max-width: 1500px) {
  .ref-workspace-grid { grid-template-columns: minmax(0, 1fr) 320px; }
  .ref-selection-grid { grid-template-columns: repeat(5, minmax(150px, 1fr)); }
  .ref-selection-card { grid-template-columns: 74px minmax(0,1fr); }
  .ref-selection-card > div { height: 62px; }
  .ref-resource-bar { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: -112px; }
  .ref-env-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: -102px; }
  .ref-metric-strip { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 1030px) {
  .ref-workspace-grid { grid-template-columns: 1fr; }
  .ref-inspector { min-height: auto; }
  .ref-workspace-main { grid-template-rows: auto auto; }
  .ref-hero-stage, .ref-system-stage, .ref-galaxy-stage { min-height: 430px; }
  .ref-dashboard-grid { grid-template-columns: 1fr; }
  .ref-colony-status { grid-row: auto; min-height: 410px; }
  .ref-command-header { align-items:flex-start; }
  .ref-header-actions { flex-wrap:wrap; }
}
@media (max-width: 720px) {
  .view-stage { padding: 8px; }
  .ref-hero-copy { left: 15px; right:15px; top:15px; }
  .ref-resource-bar, .ref-env-strip { grid-template-columns: 1fr 1fr; margin-top:0; padding:8px 0 0; }
  .ref-selection-grid { grid-template-columns: repeat(5, 180px); }
  .ref-page-header { display:block; }
  .ref-header-actions { margin-top:10px; }
  .ref-metric-strip { grid-template-columns: 1fr 1fr; }
  .ref-colony-summary { grid-template-columns:1fr; }
  .ref-priority-card { position:relative;left:auto;right:auto;bottom:auto;margin-top:14px; }
  .ref-colony-status { min-height:auto; }
}