.rubber-mulch-page .tool-card { overflow: hidden; }
.calculator-page.rubber-mulch-page .tool-card { padding: clamp(16px, 2.5vw, 32px); }
.rubber-mulch-page .rubber-opening { max-width: 62ch; margin: 10px 0 0; color: var(--muted); font-size: .94rem; line-height: 1.5; }
.rubber-mulch-page .rubber-opening strong { color: var(--ink); font-weight: 650; }
.rubber-mulch-page .rubber-playground-note { max-width: 68ch; margin: 6px 0 8px; padding: 4px 8px; border-left: 3px solid #c0932d; background: var(--amber-soft); color: var(--amber-ink); font-size: .78rem; line-height: 1.3; overflow-wrap: anywhere; }
.rubber-mulch-page .rubber-playground-note a { color: var(--ink); font-weight: 750; text-underline-offset: 2px; }
.rubber-mulch-page .rubber-handoff-note { margin: 14px 0 18px; padding: 12px 14px; border-left: 4px solid #af6e2f; background: #f5efdf; color: var(--ink); font-size: .9rem; line-height: 1.5; overflow-wrap: anywhere; }
.rubber-worked-example { margin: 24px 0; padding-left: 18px; border-left: 3px solid var(--line); }
.rubber-mulch-page .skip-link { position: absolute; top: -100vh; left: 12px; z-index: 100; padding: 9px 12px; border: 1px solid var(--line); background: var(--surface); color: var(--green-dark); }
.rubber-mulch-page .skip-link:focus { top: 8px; }
.rubber-workspace { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(320px, .85fr); grid-template-areas: "measure estimate" "purchase estimate"; gap: 24px; align-items: start; }
.rubber-inputs { grid-area: measure; min-width: 0; }
.rubber-purchase { grid-area: purchase; min-width: 0; }
.rubber-settings-grid, .rubber-option-grid, .rubber-buy-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.rubber-settings-grid { margin-top: 24px; }
.rubber-options-bar { margin-top: 24px; }
.rubber-buy-grid { margin-top: 18px; }
.rubber-rows-bar, .rubber-buy-bar { margin-top: 28px; }
.rubber-rows { display: grid; gap: 12px; margin-top: 14px; }
.rubber-row { min-width: 0; padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: #fbfcf8; }
.rubber-row-header { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.rubber-row-title { font-size: .85rem; font-weight: 850; }
.rubber-row-driver { display: none; margin-left: 7px; padding: 3px 7px; border-radius: 999px; color: var(--green-dark); background: var(--green-soft); font-size: .68rem; font-weight: 800; }
.rubber-row.is-driver { border-color: #8cc9a7; box-shadow: 0 0 0 2px rgba(140,201,167,.16); }
.rubber-row.is-driver .rubber-row-driver { display: inline-block; }
.rubber-row-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; align-items: end; }
.rubber-row-grid .field span { font-size: .75rem; }
.rubber-row-subtotal { margin: 11px 0 0; padding-top: 9px; border-top: 1px dashed var(--line); color: var(--muted); font-size: .76rem; line-height: 1.45; overflow-wrap: anywhere; }
.rubber-remove-row { flex: 0 0 auto; }
.rubber-mulch-page .estimate-panel { grid-area: estimate; position: sticky; top: 20px; }
.rubber-mulch-page .estimate-panel .result-card { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .28); }
.rubber-mulch-page .estimate-panel .result-card.emphasis { background: rgba(249, 208, 152, .12); border-color: rgba(249, 208, 152, .58); }
.rubber-mulch-page .estimate-panel .rubber-conversions strong, .rubber-mulch-page .estimate-panel .rubber-cost-summary strong { color: #fff9ea; }
.rubber-results-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rubber-conversion-card, .rubber-cost-card, .rubber-coverage-card { grid-column: 1 / -1; }
.rubber-conversions, .rubber-cost-summary { display: grid; gap: 4px 10px; font-size: .88rem; line-height: 1.45; }
.rubber-conversions span, .rubber-cost-summary span { display: flex; justify-content: space-between; gap: 8px; border-bottom: 1px dashed var(--line); }
.rubber-conversions strong, .rubber-cost-summary strong { color: var(--ink); text-align: right; }
.rubber-coverage-results { display: grid; gap: 4px; font-size: .84rem; line-height: 1.4; }
.rubber-coverage-results span { display: flex; justify-content: space-between; gap: 10px; padding: 4px 0; border-bottom: 1px dashed var(--line); }
.rubber-coverage-results b { color: var(--muted); font-weight: 650; }
.rubber-coverage-results strong { color: var(--green-dark); text-align: right; }
.rubber-coverage-empty { margin: 0; color: var(--muted); font-size: .82rem; line-height: 1.45; }
.rubber-mulch-page .estimate-panel .rubber-coverage-results b { color: rgba(255, 254, 250, .78); }
.rubber-mulch-page .estimate-panel .rubber-coverage-results strong { color: #fff9ea; }
.rubber-mulch-page .estimate-panel .rubber-coverage-empty,
.rubber-mulch-page .estimate-panel .rubber-coverage-card .result-subtext,
.rubber-mulch-page .estimate-panel .rubber-bag-breakdown,
.rubber-mulch-page .estimate-panel .rubber-disclaimer { color: rgba(255, 254, 250, .78); }
.rubber-order-result { font-size: .96rem; font-weight: 800; line-height: 1.35; overflow-wrap: anywhere; }
.rubber-weight-handoff { display:grid; gap:3px; margin:12px 0 0; padding:8px 10px; border-left:3px solid #b58a50; background:#f3f0e7; color:#4d5c51; font-size:11px; line-height:1.5; overflow-wrap:anywhere; }
.rubber-weight-handoff[hidden] { display:none; }
.rubber-weight-handoff a { display:inline-flex; min-height:44px; align-items:center; color:#315b49; font-size:12px; font-weight:700; text-underline-offset:3px; }
.rubber-bag-breakdown { margin-top: 7px; color: var(--muted); font-size: .76rem; line-height: 1.45; overflow-wrap: anywhere; }
.rubber-shape-guide { margin: 24px 0; padding-top: 18px; border-top: 1px solid var(--line); }
.rubber-shape-guide > p { margin-bottom: 10px; color: var(--muted); }
.rubber-shape-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; margin: 0; padding: 0; list-style: none; }
.rubber-shape-item { min-width: 0; padding: 8px 12px; border-left: 1px solid var(--line); }
.rubber-shape-item:first-child { padding-left: 0; border-left: 0; }
.rubber-shape-item figure { margin: 0; }
.rubber-shape-item svg { display: block; width: 100%; max-width: 88px; height: 70px; margin-bottom: 5px; }
.rubber-shape-item figcaption { display: grid; gap: 2px; }
.rubber-shape-item strong { color: var(--ink); font-size: .84rem; }
.rubber-shape-item span { color: var(--muted); font-size: .76rem; line-height: 1.35; overflow-wrap: anywhere; }
.rubber-depth-table-scroll { max-width: 480px; overflow-x: auto; margin: 12px 0 20px; }
.rubber-depth-table { width: 100%; border-collapse: collapse; background: #fff; font-size: .88rem; }
.rubber-workflow-figure { max-width: 30rem; margin: 1.5rem auto; }
.rubber-workflow-figure img { display: block; width: 100%; height: auto; border-radius: 1rem; }
.rubber-workflow-figure figcaption { margin-top: .6rem; color: #53645a; font-size: .9rem; line-height: 1.45; text-align: center; }
.rubber-depth-table th, .rubber-depth-table td { padding: 9px 12px; border: 1px solid var(--line); text-align: left; }
.rubber-depth-table th { color: var(--ink); background: var(--soft); }
.rubber-formula { margin: 18px 0 0; color: var(--muted); font-size: .88rem; line-height: 1.55; }
.rubber-disclaimer { margin: 16px 0 0; color: var(--muted); font-size: .8rem; line-height: 1.55; }
.rubber-copy-fallback { width: 100%; margin-top: 10px; border: 1px solid var(--line); border-radius: 10px; padding: 10px; font: inherit; color: var(--ink); background: #fff; line-height: 1.5; resize: vertical; }
.rubber-sources ul { padding-left: 1.2rem; }
.rubber-sources li { margin: 0 0 10px; color: var(--muted); }
.rubber-sources li a { color: var(--green-dark); font-weight: 700; }

@media (max-width: 900px) {
  .rubber-workspace { grid-template-columns: minmax(0, 1fr); grid-template-areas: "measure" "estimate" "purchase"; }
  .rubber-mulch-page .estimate-panel { position: static; }
}
@media (max-width: 700px) {
  .rubber-row-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rubber-row-grid .field:first-child { grid-column: 1 / -1; }
  .rubber-shape-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rubber-shape-item { padding: 10px 12px; border-left: 0; border-bottom: 1px solid var(--line); }
  .rubber-shape-item:first-child { padding-left: 12px; }
  .rubber-shape-item:nth-child(odd) { border-right: 1px solid var(--line); }
  .rubber-shape-item:nth-child(5) { width: 100%; max-width: 176px; grid-column: 1 / -1; justify-self: center; border-right: 0; }
}
@media (max-width: 430px) {
  .rubber-mulch-page .tool-card { padding: 16px; }
  .rubber-settings-grid, .rubber-option-grid, .rubber-buy-grid { grid-template-columns: minmax(0, 1fr); }
  .rubber-row-grid { grid-template-columns: minmax(0, 1fr); }
  .rubber-row-grid .field:first-child { grid-column: 1; }
  .rubber-mulch-page .rubber-results-grid { grid-template-columns: minmax(0, 1fr); }
  .rubber-conversion-card, .rubber-cost-card { grid-column: auto; }
  .rubber-row-header { align-items: flex-start; }
  .rubber-mulch-page .section-bar > div { min-width: 0; width: 100%; }
  .rubber-mulch-page .section-bar p { max-width: 100%; overflow-wrap: anywhere; }
  .rubber-mulch-page .tool-heading h1 { max-width: 100%; overflow-wrap: anywhere; }
}

@media (max-width: 560px) {
  .rubber-mulch-page .site-header.page-shell { width: 100%; min-width: 0; }
  .rubber-mulch-page .site-nav {
    min-width: 0;
    max-width: 100%;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 0 16px;
  }
  .rubber-mulch-page .site-nav a { flex: 0 0 auto; }
  .rubber-mulch-page .tool-heading > div,
  .rubber-mulch-page .section-bar > div { width: 100%; min-width: 0; }
  .rubber-mulch-page h1 {
    max-width: 100%;
    font-size: clamp(1.65rem, 8vw, 2.1rem);
    letter-spacing: -1px;
    overflow-wrap: anywhere;
  }
  .rubber-mulch-page .rubber-workspace,
  .rubber-mulch-page .rubber-inputs,
  .rubber-mulch-page .rubber-row,
  .rubber-mulch-page .estimate-panel { min-width: 0; max-width: 100%; }
  .rubber-mulch-page .section-bar p,
  .rubber-mulch-page .rubber-row-subtotal { overflow-wrap: anywhere; }
}