.planner-widget {
  background: var(--paper, #fff);
  border: 1px solid #d9ddd5;
  border-radius: 1.35rem;
  box-shadow: 0 16px 45px rgba(31, 46, 45, .07);
  padding: clamp(1.2rem, 3vw, 2rem);
}
.planner-form, .planner-fields, .planner-actions { display: grid; gap: 1rem; }
.planner-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.planner-field { display: grid; gap: .45rem; min-width: 0; font-weight: 650; }
.planner-field-wide { grid-column: 1 / -1; }
.planner-field input, .planner-field select, .planner-field textarea {
  box-sizing: border-box; width: 100%; min-width: 0; border: 1px solid #bbc7c0;
  border-radius: .75rem; padding: .75rem .85rem; background: #fff; color: #152823;
  font: inherit; font-weight: 400;
}
.planner-field textarea { resize: vertical; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; line-height: 1.5; }
.planner-field input:focus-visible, .planner-field select:focus-visible, .planner-field textarea:focus-visible,
.planner-actions button:focus-visible { outline: 3px solid #2d8563; outline-offset: 2px; }
.planner-actions { grid-template-columns: repeat(3, max-content); align-items: center; margin-top: .35rem; }
.planner-error { color: #a33426; font-weight: 650; }
.planner-results, .planner-result { margin: 1.2rem 0; overflow-wrap: anywhere; }
.planner-result-row { display: flex; justify-content: space-between; align-items: baseline; gap: 1.5rem; border-bottom: 1px solid #e0e7e1; padding: .65rem 0; }
.planner-result-row span { color: #4c6057; }
.planner-result-row strong { white-space: pre-wrap; font-weight: 650; text-align: right; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.planner-color-preview { border: 1px solid currentColor; border-radius: .7rem; padding: 1rem; font-weight: 650; }
.planner-diagram { margin: 0; padding: 1.2rem; border: 1px solid #d9e4da; border-radius: 1rem; background: #f3f8f3; }
.planner-diagram figcaption { font-weight: 700; margin-bottom: .8rem; }
.planner-diagram ol { display: grid; gap: .7rem; margin: 0; padding-left: 1.4rem; }
.planner-diagram li { padding-left: .2rem; }
.planner-embed-page { margin: 0; padding: 1rem; background: #f8f8f4; }
.planner-embed-page .planner-widget { box-shadow: none; }
.planner-embed-section { margin-top: 1rem; }
.planner-embed-panel { border: 1px solid #d9e4da; border-radius: 1rem; background: #f3f8f3; padding: 1rem 1.25rem; }
.planner-embed-panel summary { cursor: pointer; font-weight: 700; }
.planner-embed-content { display: grid; gap: .8rem; padding-top: .8rem; }
.planner-embed-content p { margin: 0; }
.planner-embed-content fieldset { display: flex; flex-wrap: wrap; gap: .7rem 1.3rem; border: 0; padding: 0; margin: 0; }
.planner-embed-content fieldset label { display: inline-flex; align-items: center; gap: .35rem; }
.planner-embed-warning { color: #6b4b18; }
.planner-embed-content textarea { box-sizing: border-box; width: 100%; font: .85rem/1.5 ui-monospace, SFMono-Regular, Consolas, monospace; padding: .75rem; border: 1px solid #b9c9be; border-radius: .65rem; }
.planner-embed-actions { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; }
.planner-embed-actions .btn-ghost { text-decoration: none; }
.planner-embed-content [data-embed-error] { color: #a33426; font-weight: 650; }
.planner-embed-page.planner-embed-result-only .planner-fields,
.planner-embed-page.planner-embed-result-only .planner-media-fields,
.planner-embed-page.planner-embed-result-only .planner-actions,
.planner-embed-page.planner-embed-result-only .converter-actions,
.planner-embed-page.planner-embed-result-only .planner-calc-fields,
.planner-embed-page.planner-embed-result-only .converter-privacy { display: none; }
@media (max-width: 680px) {
  .planner-fields { grid-template-columns: 1fr; }
  .planner-actions { grid-template-columns: 1fr; }
  .planner-result-row { display: grid; gap: .3rem; }
  .planner-result-row strong { text-align: left; }
}