.product-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 20px;
}

.product-summary-grid .metric strong { font-size: 22px; }

.product-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 20px;
  margin-bottom: 20px;
}

.product-config-panel { min-width: 0; }
.field-grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.rules-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin: 30px 0 14px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
}

.rules-head h3 { margin: 2px 0 4px; }
.product-rules { display: grid; gap: 12px; }

.product-rule-row {
  display: grid;
  grid-template-columns: minmax(130px, .75fr) minmax(260px, 1.45fr) minmax(130px, .65fr) 105px minmax(145px, .7fr) auto;
  align-items: end;
  gap: 12px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fafafd;
}

.product-rule-row label { margin: 0; }
.product-rule-row .remove-rule { height: 44px; color: #b52d39; }
.rule-runtime { display: grid; grid-template-columns: 10px 1fr; column-gap: 8px; align-items: center; min-height: 48px; padding: 6px 10px; border: 1px solid var(--line); border-radius: 11px; background: #fff; }
.rule-runtime-dot { width: 9px; height: 9px; border-radius: 50%; background: #9995a7; }
.rule-runtime-dot.running { background: var(--green); box-shadow: 0 0 0 5px rgba(22,163,106,.12); }
.rule-runtime-dot.starting,.rule-runtime-dot.pending { background: var(--amber); box-shadow: 0 0 0 5px rgba(220,139,30,.11); }
.rule-runtime-dot.error { background: var(--red); box-shadow: 0 0 0 5px rgba(216,69,80,.11); }
.rule-runtime strong { font-size: 13px; }
.rule-runtime small { grid-column: 2; margin-top: 2px; color: var(--muted); font-size: 11px; line-height: 1.35; white-space: normal; }
.product-save-actions { align-items: center; justify-content: space-between; margin-top: 20px; }
.product-guide { align-self: start; position: sticky; top: 104px; }
.product-state-enabled { color: var(--green) !important; }
.product-state-starting { color: var(--amber) !important; }
.product-state-error { color: var(--red) !important; }
.product-state-disabled { color: #a5414a !important; }
.version-current { font-weight: 800; color: var(--green); }
#totpModal .modal-card label { display: grid; gap: 8px; margin-top: 20px; }

@media (max-width: 1150px) {
  .product-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-layout { grid-template-columns: 1fr; }
  .product-guide { position: static; }
  .product-rule-row { grid-template-columns: 1fr 1.5fr 1fr 100px 145px auto; }
}

@media (max-width: 760px) {
  .product-summary-grid { grid-template-columns: 1fr 1fr; }
  .field-grid.three { grid-template-columns: 1fr; }
  .rules-head { align-items: stretch; flex-direction: column; }
  .product-rule-row { grid-template-columns: 1fr; }
  .product-rule-row .remove-rule { width: 100%; }
  .product-save-actions { align-items: stretch; flex-direction: column; }
  .product-save-actions button { width: 100%; }
}

@media (max-width: 430px) {
  .product-summary-grid { grid-template-columns: 1fr; }
}