.form-error {
  padding: 10px 12px;
  margin-block: 10px;
  border: 1px solid #ecc9bb;
  border-radius: 9px;
  background: light-dark(#fff3ec, #492e29);
  color: light-dark(#7c3026, #ffd9ce);
  font-size: 13px;
  font-weight: 650;
}

.demo [aria-invalid="true"] { border-color: #a23d31; }
.demo .action:disabled { opacity: .6; cursor: default; }
.demo .action.danger {
  color: light-dark(#8d392e, #ffc5b8);
  background: light-dark(#fff2ee, #492e29);
  border-color: light-dark(#a95343, #cd8b7f);
}
.demo .action.danger:hover { background: light-dark(#ffe4da, #59382f); }
.demo [data-example-notice], .demo [data-catalog-status], .demo [data-example-catalog] > .inline-note { margin-block: 0 14px; }
.wizard-panel .empty-message { padding: 8px 0; font-size: 13px; }
.editable-recipe li { grid-template-columns: minmax(0, 1fr) auto; gap: 4px 8px; }
.editable-recipe .material-actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 5px; }
.editable-recipe .material-actions button { font-size: 12px; }
.editable-recipe li b { white-space: normal; overflow-wrap: anywhere; text-align: right; }
.demo [data-material-dialog] .recipe-total { padding-block: 6px; }
.demo [data-material-dialog] .form-error { margin-block: 0; }
.recipe-aside .brief-list dd, .cost-panel .brief-list dd { flex: 0 1 auto; overflow-wrap: anywhere; }
.price-hero .amount { white-space: normal; overflow-wrap: anywhere; }
.price-hero .price-amount { font-size: clamp(35px, 6vw, 58px); }
.price-context .form-field { max-width: 330px; }
.scenario-controls > .form-row, .scenario-controls > .form-field { margin-bottom: 12px; }
.scenario-result .compare-table { table-layout: fixed; }
.scenario-result .compare-table th, .scenario-result .compare-table td { overflow-wrap: anywhere; }
.scenario-result .brief-list dd { flex: 0 1 auto; overflow-wrap: anywhere; }
.price-choice {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  margin: 14px 0 6px;
  padding: 8px 10px 2px;
  border: 1px solid var(--line-strong);
  border-radius: 9px;
}
.price-choice legend { padding-inline: 4px; font-weight: 650; font-size: 13px; }
.price-choice label { display: flex; align-items: center; gap: 6px; min-height: 44px; cursor: pointer; }
.price-choice input { accent-color: var(--accent); }
.saved-product { min-width: 0; padding: 15px; }
.saved-product [data-name] { overflow-wrap: anywhere; }
.saved-product .product-values dd { white-space: normal; overflow-wrap: anywhere; }
.saved-product .product-foot { flex-wrap: wrap; justify-content: flex-start; padding-top: 7px; }
.saved-product .product-foot .action { font-size: 12px !important; padding-inline: 8px; }
.saved-product .product-head p { overflow-wrap: anywhere; }
.saved-product .product-head > div { min-width: 0; }
.real-dashboard-note { margin-top: 12px; }
.example-view, [data-sales-status] { margin-bottom: 12px; }
[data-dashboard="real"] h1, [data-dashboard="real"] .b-balance .amount,
.mvp-kpis .amount, [data-sale-list] .record-name strong, [data-sale-list] .record-amount {
  white-space: normal;
  overflow-wrap: anywhere;
}
[data-sale-list] [data-collect] { display: inline-flex; margin-top: 3px; padding-inline: 5px; }

@media (min-width: 700px) {
  .editable-recipe li { grid-template-columns: minmax(0, 1fr) auto auto; }
  .editable-recipe .material-actions { grid-column: auto; }
}
.settings-grid { display: grid; gap: 14px; align-items: start; }
.settings-card { padding: 16px; }
.settings-card h2 { margin-bottom: 10px; }
.settings-card :is(form, .form-actions) { margin-top: 10px; }
.settings-status { grid-column: 1 / -1; }
.pricing-picker { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 10px; margin-block: 12px; }
.recipe-cost-group { border: 0; padding: 0; min-inline-size: 0; margin: 0 0 16px; }
.recipe-cost-group legend { font-weight: 700; margin-bottom: 6px; padding: 0; }
.mobile-cost-summary { display: none; }
@media (max-width: 699px) {
  .mobile-cost-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 10px 12px; margin-bottom: 12px; background: var(--panel); border: 1px solid var(--line); border-radius: 10px; }
  .mobile-cost-summary dt { color: var(--muted); font-size: 12px; }
  .mobile-cost-summary dd { font-weight: 750; overflow-wrap: anywhere; }
}
@media (max-width: 430px) {
  .pricing-picker { grid-template-columns: minmax(0, 1fr); justify-items: start; }
  .pricing-picker label { width: 100%; }
}
.calculator-grid { grid-template-areas: "cost" "context" "hero"; }
.price-hero .price-payoff { flex-wrap: wrap; overflow-wrap: anywhere; }
.price-hero .explain-details :is(summary, p) { color: #fff; }
.price-hero [data-pricing-loss] { color: #ffe4a0; font-weight: 750; }
.price-hero :is(button, a, summary):focus-visible { outline-color: #ffe4a0; }
.demo .price-hero .form-actions .primary { background: #f3e8c8; border-color: #f3e8c8; color: #263a2f; }
.demo .price-hero .form-actions .secondary { background: transparent; color: #fff; border-color: #b9c9b7; }
.demo .price-hero .form-actions .secondary:hover { background: #1b4435; }

@media (min-width: 820px) {
  .settings-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .calculator-grid { grid-template-areas: "cost context" "cost hero"; }
}