.whole-worksheet {
  margin: 1.5rem 0 3rem;
  color: var(--ink);
}
.whole-worksheet [hidden] { display: none !important; }
.wh-form, .wh-result {
  min-width: 0;
  padding: clamp(1rem,2.6vw,1.8rem);
  border: 1px solid var(--rule);
  border-radius: var(--panel-radius);
  background: var(--surface);
  scroll-margin-top: 1rem;
}
.wh-heading h2 { margin: 0; line-height: 1.16; letter-spacing: -.026em; font-size: var(--section-title); }
.wh-heading p, .wh-note { color: var(--secondary); font-size: .94rem; margin: .42rem 0 .8rem; line-height: 1.5; }
.wh-entry { display: grid; grid-template-columns: minmax(0,.94fr) minmax(0,2fr); gap: clamp(.8rem,2vw,1.4rem); align-items: start; }
.wh-rows { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .8rem; align-items: stretch; }
.wh-setup, .wh-row { min-width: 0; margin: 0; padding: .7rem .85rem; border: 1px solid var(--rule); border-radius: var(--control-radius); }
.wh-setup { background: var(--canvas); }
.wh-setup legend, .wh-row legend { font-size: .99rem; font-weight: 700; padding: 0 .24rem; color: var(--blue); }
.wh-setup .wh-note { margin-top: .2rem; }
.wh-choices { display: flex; flex-direction: column; gap: .3rem; margin: .55rem 0; }
.wh-choice { display: flex; align-items: center; gap: .4rem; min-height: 2.75rem; padding: .3rem .5rem; border: 1px solid var(--control-border); border-radius: var(--control-radius); color: var(--ink); background: var(--surface); cursor: pointer; font-size: .87rem; }
.wh-choice:has(input:checked) { background: var(--blue-soft); border-color: var(--blue); }
.wh-choice input { accent-color: var(--blue); width: 1rem; height: 1rem; margin: 0; flex: none; }
.wh-form:has(input[name=premium_mode][value=cumulative]:checked) .wh-level,
.wh-form:has(input[name=premium_mode][value=level]:checked) .wh-cumulative { display: none; }
.wh-field { min-width: 0; margin-bottom: .65rem; }
.wh-field label { display: block; font-size: .86rem; font-weight: 650; line-height: 1.4; margin: .22rem 0 .3rem; }
.wh-control { position: relative; }
.wh-control input, .wh-field select { width: 100%; min-width: 0; min-height: var(--control-height); padding: .5rem .6rem; border: 1px solid var(--control-border); border-radius: var(--control-radius); color: var(--ink); background: var(--surface); font: inherit; font-size: 1rem; font-variant-numeric: tabular-nums; }
.wh-control[data-currency]::before { position: absolute; content: "$"; top: 50%; left: .65rem; transform: translateY(-50%); pointer-events: none; color: var(--secondary); }
.wh-control[data-currency] input { padding-left: 1.6rem; }
.wh-control [aria-invalid=true], .wh-field select[aria-invalid=true] { border-color: var(--error); }
.wh-help, .wh-error, .wh-method { display: block; font-size: .875rem; line-height: 1.45; margin: .22rem 0; }
.wh-help, .wh-method { color: var(--secondary); }
.wh-error { color: var(--error); }
.wh-error:empty { display: none; }
.wh-input-link, .wh-edit { display: inline-block; font-size: .85rem; padding: .3rem 0; font-weight: 600; }
.wh-actions { display: flex; gap: .6rem; align-items: center; flex-wrap: wrap; margin-top: .8rem; }
.wh-primary, .wh-secondary { border-radius: var(--control-radius); min-height: var(--control-height); padding: .5rem .9rem; font: inherit; font-size: .91rem; font-weight: 650; }
.wh-primary { color: var(--night-on-action, white); background: var(--blue); border: 1px solid var(--blue); }
.wh-primary:hover { background: var(--blue-hover); }
.wh-secondary { color: var(--blue); background: var(--surface); border: 1px solid var(--control-border); }
.whole-worksheet :is(input,select,a,button):focus-visible, .wh-result:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; }
.wh-result { margin-top: 1.2rem; border-top: .28rem solid var(--blue); }
.wh-heading .wh-context { color: var(--secondary); font-size: .77rem; font-weight: 700; margin: 0 0 .22rem; }
.wh-basis { font-size: .95rem; font-weight: 600; margin: .65rem 0 .25rem; }
.wh-ledger { width: 100%; border-collapse: collapse; margin: .9rem 0; table-layout: fixed; font-variant-numeric: tabular-nums; }
.wh-ledger caption { text-align: left; font-weight: 700; font-size: 1rem; padding: 0 0 .4rem; }
.wh-ledger th, .wh-ledger td { padding: .53rem .6rem; border-bottom: 1px solid var(--rule); overflow-wrap: anywhere; vertical-align: top; }
.wh-ledger thead { background: var(--blue-soft); }
.wh-ledger thead th { text-align: right; font-size: .84rem; }
.wh-ledger th:first-child { width: 40%; text-align: left; }
.wh-ledger tbody th { font-weight: 550; font-size: .88rem; }
.wh-ledger td { text-align: right; font-size: .92rem; font-weight: 650; }
.wh-ledger meter { display: block; width: 100%; height: .32rem; appearance: none; margin: .18rem 0 0; border: 0; border-radius: .18rem; overflow: hidden; background: var(--rule); }
.wh-ledger meter::-webkit-meter-bar { height: .32rem; border: 0; background: var(--rule); }
.wh-ledger meter::-webkit-meter-optimum-value { background: var(--quiet); }
.wh-ledger meter::-moz-meter-bar { background: var(--quiet); }
.wh-ledger .wh-bar-guaranteed::-webkit-meter-optimum-value { background: var(--blue); }
.wh-ledger .wh-bar-guaranteed::-moz-meter-bar { background: var(--blue); }
.wh-ledger .wh-bar-illustrated::-webkit-meter-optimum-value { background: var(--chart-secondary); }
.wh-ledger .wh-bar-illustrated::-moz-meter-bar { background: var(--chart-secondary); }
.wh-observed, .wh-benefit { padding: .7rem .85rem; margin: .8rem 0; }
.wh-observed { background: var(--blue-soft); border-left: 3px solid var(--blue-mid); }
.wh-benefit { border: 1px solid var(--rule); border-radius: var(--control-radius); }
.wh-observed h3, .wh-benefit h3 { margin: 0 0 .3rem; font-size: 1rem; }
.wh-observed p, .wh-benefit p { margin: .3rem 0; font-size: .9rem; line-height: 1.5; }
.wh-benefit dl { display: flex; flex-wrap: wrap; gap: .42rem 1.3rem; margin: .45rem 0 0; }
.wh-benefit dl > div { display: flex; flex-wrap: wrap; gap: .1rem .45rem; align-items: baseline; }
.wh-benefit dt { color: var(--secondary); font-size: .84rem; }
.wh-benefit dd { margin: 0; font-variant-numeric: tabular-nums; font-weight: 650; }
.wh-notice { color: var(--attention); border-left: 3px solid var(--attention-rule); padding: .56rem .75rem; background: var(--attention-soft); font-size: .9rem; }
.wh-method { margin: .75rem 0; }
@media (max-width: 860px) {
  .wh-entry { grid-template-columns: minmax(0,1fr); }
  .wh-choices { flex-direction: row; flex-wrap: wrap; }
}
@media (max-width: 570px) {
  .wh-rows { grid-template-columns: minmax(0,1fr); }
  .wh-ledger th, .wh-ledger td { padding: .38rem .22rem; }
  .wh-ledger tbody th, .wh-ledger td { font-size: .8rem; }
  .wh-ledger th:first-child { width: 43%; }
}
@media print {
  body:has(#whole-worksheet) #main > :not(#whole-worksheet),
  body:has(#whole-worksheet) :is(.site-head,.site-foot,.skip),
  .whole-worksheet :is(.wh-form,.wh-edit,#whole-print) { display: none !important; }
  .whole-worksheet, .wh-result { padding: 0; margin: 0; border: 0; }
  .wh-result::before { content: "Whole life illustration worksheet"; display: block; font-weight: 700; font-size: 1.35rem; }
  .wh-ledger tr, .wh-benefit, .wh-observed { break-inside: avoid; }
}