.light-guide { max-width: 1000px; margin: 0 auto; }
.light-guide .light-heading { display: block; height: auto; min-height: 0; max-width: 760px; }
.light-guide .page-jumps { flex-wrap: wrap; white-space: normal; overflow: visible; }
.light-illustration { margin: 1.75rem 0; }
.light-scenes { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
.light-scenes > div { background: #f4f1e6; border: 1px solid #d8dfd0; border-radius: 20px; padding: 1rem; }
.light-scenes svg { display: block; width: 100%; height: auto; }
.light-scenes p { margin: .4rem 0 0; line-height: 1.5; }
.light-scenes strong,.light-scenes span { display: block; }
.light-scenes span,.light-illustration figcaption,.field-help { color: #596451; font-size: .88rem; }
.light-illustration figcaption { margin-top: .75rem; }
.light-reading { max-width: 760px; }
.light-checks { padding-left: 1.35rem; }
.light-checks li { margin-bottom: 1rem; padding-left: .2rem; }
.dli-workbench { padding: clamp(1rem,3vw,2rem); margin: 2.25rem 0; background: #f3f7ed; border: 1px solid #ccd8bd; border-radius: 22px; }
.dli-workbench h2 { margin-top: .5rem; }
.dli-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 1.1rem; margin: 1.25rem 0; }
.dli-fields > div { min-width: 0; }
.dli-fields label { font-weight: 700; display: block; }
.dli-fields .field-help { min-height: 2.8em; margin: .4rem 0; line-height: 1.4; }
.dli-fields input { width: 100%; min-width: 0; box-sizing: border-box; padding: .85rem; font: inherit; border: 1px solid #829273; border-radius: 10px; background: #fffefa; color: #213c2c; }
.dli-fields input:focus-visible { outline: 3px solid #cfad54; outline-offset: 3px; }
.dli-fields input[aria-invalid="true"] { border-color: #9e3724; }
.dli-fields .field-error { font-size: .88rem; color: #93321f; margin: .4rem 0 0; }
.dli-result { background: #204d36; color: #fffdf6; padding: 1.1rem; border-radius: 12px; font-size: 1.15rem; font-weight: 700; overflow-wrap: anywhere; }
.dli-formula { border-top: 1px solid #ced9c3; padding-top: 1rem; font-size: .95rem; }
.dli-workbench [hidden] { display: none !important; }
.dli-workbench .button { white-space: normal; max-width: 100%; }
@media (max-width: 620px) {
  .light-scenes { grid-template-columns: 1fr; gap: .65rem; }
  .light-scenes > div { display: grid; grid-template-columns: 110px minmax(0,1fr); gap: .7rem; align-items: center; padding: .5rem .75rem; }
  .light-scenes p { margin: 0; }
  .light-scenes strong { font-size: .95rem; }
  .light-scenes span { font-size: .82rem; }
  .dli-fields { grid-template-columns: 1fr; }
  .dli-fields .field-help { min-height: 0; }
}
