/* ---------- CTO-style rows (shared) ----------
   Anthony, 29 September: "i want you to just copy the flow of the main
   interface on CTO Agent" (docs/cto-copy-design-2026-09-29.md). Both estimate
   screens become one narrow column of rows built by
   app/js/components/estimate-rows.js: the label above one bordered control, a
   %|$ pair or a fixed prefix joined to its left, a gear inside its right end,
   a caret after the label, and panels that open in place under their row.
   Every button here is a thumb (--tap) tall and wide. Each panel hides with
   its own !important rule, because a class that sets display beats the
   browser's own [hidden] and the panel would never close. Placed before the
   buyer and seller rules, which the screens still use while they move over. */
.estimate-rows{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;max-width:600px;margin:0 auto;align-items:start}
.estimate-rows [hidden]{display:none!important}
.estimate-row{min-width:0}
.estimate-row__head{display:flex;align-items:center;gap:2px;min-height:24px;margin:0 0 8px}
.estimate-row__head label,.estimate-row__label{font-size:15px;font-weight:500;line-height:1.3;color:var(--charcoal)}
.estimate-row__caret{display:inline-grid;place-items:center;min-width:var(--tap);min-height:var(--tap);margin:-10px 0;padding:0;border-radius:6px;color:var(--copper)}
.estimate-row__caret svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2}
.estimate-row__caret[aria-expanded="true"] svg{transform:rotate(180deg)}
.estimate-row__control{display:flex;align-items:stretch;min-width:0;min-height:52px;border:1px solid var(--field-border);
  border-radius:8px;background:var(--white)}
/* One copper edge around the whole control, as .field draws focus: the input
   inside is borderless, so its own ring would sit half hidden by the prefix. */
.estimate-row__control:focus-within{border-color:var(--copper);outline:2px solid var(--copper);outline-offset:0}
.estimate-row__control input{flex:1 1 auto;min-width:0;width:100%;min-height:50px;margin:0;padding:10px 14px;border:0;
  border-radius:8px;background:transparent;color:inherit;font:inherit;font-size:18px;font-variant-numeric:tabular-nums;outline:none}
.estimate-row__prefix{flex:none;display:grid;place-items:center;min-width:48px;padding:0 10px;border-right:1px solid var(--border);
  border-radius:7px 0 0 7px;background:var(--cream);color:var(--copper);font-size:16px;font-weight:500}
.estimate-units{flex:none;display:flex;gap:2px;padding:3px;border-right:1px solid var(--border);border-radius:7px 0 0 7px;background:var(--cream)}
.estimate-unit{display:inline-grid;place-items:center;min-width:var(--tap);min-height:var(--tap);padding:0 10px;border-radius:5px;
  color:var(--mid);font:500 15px var(--sans)}
.estimate-unit[aria-pressed="true"]{background:var(--forest);color:var(--ivory)}
.estimate-row__gear{flex:none;display:grid;place-items:center;min-width:var(--tap);min-height:var(--tap);margin:3px;padding:0;
  border-radius:6px;color:var(--mid)}
.estimate-row__gear svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8}
.estimate-row__gear[aria-expanded="true"]{background:var(--cream);color:var(--copper)}
.estimate-unit:focus-visible,.estimate-row__gear:focus-visible,.estimate-row__caret:focus-visible{outline:2px solid var(--copper);outline-offset:-2px}
/* Loan type: the select is the whole control, borderless like the input so
   the control's one copper edge draws focus. The payer select sits right of a
   fee box inside the same control, 16px so a phone does not zoom to open it. */
.estimate-row__select{flex:1 1 auto;min-width:0;width:100%;min-height:50px;margin:0;padding:10px 14px;border:0;border-radius:8px;
  background:transparent;color:inherit;font:inherit;font-size:18px;outline:none}
.estimate-row__side-select{flex:none;min-width:var(--tap);min-height:var(--tap);max-width:50%;margin:3px;padding:0 8px;border:0;
  border-left:1px solid var(--border);border-radius:0 6px 6px 0;background:var(--cream);color:var(--charcoal);font:inherit;
  font-size:16px;font-weight:500}
.estimate-row__side-select:focus-visible{outline:2px solid var(--copper);outline-offset:-2px}
/* The read-only Misc. box: words, not an input, so they wrap at 320px rather
   than being cut off; cream like the address, because nothing is typed here. */
.estimate-row__control--readout{background:var(--cream)}
.estimate-row__readout{flex:1 1 auto;display:flex;align-items:center;min-width:0;min-height:50px;margin:0;padding:10px 14px;
  color:var(--charcoal);font-size:18px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
/* A %|$ pair set apart from its box, in a caret panel, draws its own edge. */
.estimate-unit-choice{display:grid;gap:8px;justify-items:start;min-width:0}
.estimate-unit-choice .estimate-units{border:1px solid var(--border);border-radius:8px}
.estimate-row__hint{margin:6px 0 0}
.estimate-row.field--problem .estimate-row__control{border-color:var(--warn);box-shadow:0 0 0 3px rgba(165,42,42,.14)}
.estimate-row.field--problem .estimate-row__control input{box-shadow:none}
.estimate-row-panel{display:grid;gap:12px;min-width:0;margin:10px 0 0;padding:14px;border:1px solid var(--border);border-radius:10px;background:var(--cream)}
.estimate-row-panel[hidden]{display:none!important}
.estimate-row-panel .field{margin:0}
.estimate-row-panel .field input,.estimate-row-panel .field select{background:var(--white)}
.estimate-address__value{display:flex;align-items:center;gap:10px;min-width:0;min-height:52px;margin:0;padding:10px 14px;
  border:1px solid var(--border);border-radius:8px;background:var(--cream);color:var(--charcoal);font-size:16px;overflow-wrap:anywhere}
.estimate-address__value svg{flex:none;width:20px;height:20px;stroke:var(--copper);fill:none;stroke-width:1.8}
.estimate-address--missing .estimate-address__value{color:var(--mid)}
/* Greyed while the price is missing by the shared .btn:disabled look, so this
   rule sets no colour of its own; capitals are style, the label stays words. */
.estimate-compute{display:flex;width:100%;justify-content:center;min-height:52px;text-transform:uppercase;letter-spacing:.08em;font-size:15px}
.estimate-compute-hint{margin:8px 0 0;text-align:center}
.estimate-misc{display:grid;gap:12px;min-width:0}
.estimate-misc>.hint{margin:0}
.estimate-misc__list{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.estimate-misc__item{display:grid;gap:10px;min-width:0;padding:12px;border:1px solid var(--border);border-radius:10px;background:var(--white)}
.estimate-misc__field label{display:block;margin:0 0 5px;font-size:13px;font-weight:500;color:var(--mid)}
.estimate-misc__name{width:100%;min-height:var(--field);padding:10px 12px;border:1px solid var(--field-border);border-radius:7px;
  background:var(--white);color:inherit;font:inherit;font-size:16px}
.estimate-misc__name:focus{border-color:var(--copper);outline:2px solid var(--copper);outline-offset:0}
.estimate-misc .estimate-row__control input{min-height:46px;font-size:16px}
.estimate-misc__kind{display:flex;gap:4px;padding:3px;border:1px solid var(--border);border-radius:8px;background:var(--cream)}
.estimate-misc__kind .estimate-unit{flex:1 1 0;padding:0 8px;font-size:14px}
.estimate-misc__remove{justify-self:start;min-height:var(--tap)}
.estimate-misc__add{width:100%;min-height:var(--tap)}
.estimate-donut{display:grid;gap:14px;justify-items:center;min-width:0}
.estimate-donut__ring{display:grid;place-items:center;width:200px;height:200px;border-radius:50%;box-shadow:0 0 0 7px var(--cream)}
.estimate-donut__center{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:160px;height:160px;
  padding:12px;border-radius:50%;background:var(--white);text-align:center;font-size:12px;color:var(--mid)}
.estimate-donut__center strong{font-size:22px;font-weight:600;letter-spacing:-.02em;color:var(--charcoal);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.estimate-donut--large-number .estimate-donut__center strong{font-size:16px}
.estimate-donut__legend{width:100%;margin:0;font-size:13px}
.estimate-donut__legend>div{display:flex;justify-content:space-between;gap:12px;padding:6px 0}
.estimate-donut__legend dt{display:flex;align-items:center;gap:8px;min-width:0}
.estimate-donut__legend dd{margin:0;white-space:nowrap;font-variant-numeric:tabular-nums;font-weight:500}
.estimate-donut__dot,.estimate-donut__nodot{flex:none;width:9px;height:9px;border-radius:50%}
/* Options: the estimate defaults, over the calculator rather than instead of
   it. The rest of the sheet is set aside (and made inert by the script) until
   it closes; the head keeps clear of the sheet's fixed Close button. */
.estimate-options-open>:not(.estimate-options){display:none!important}
.estimate-options{max-width:600px;margin:0 auto;padding:0 0 32px}
.estimate-options [hidden]{display:none!important}
.estimate-options__head{display:grid;gap:8px;padding:0 52px 16px 0;border-bottom:1px solid var(--border)}
.estimate-options__close{justify-self:start;display:inline-flex;align-items:center;gap:6px;min-height:var(--tap);padding:0 12px 0 4px;
  border-radius:6px;color:var(--copper);font-size:14px;font-weight:500}
.estimate-options__close svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2}
.estimate-options__close:focus-visible{outline:2px solid var(--copper);outline-offset:2px}
#sheet .estimate-options__head h2{margin:0;font:600 24px var(--sans)}
.estimate-options__head .hint{margin:0}
.estimate-options__tabs{display:flex;gap:4px;margin:16px 0 20px;border-bottom:1px solid var(--border)}
.estimate-options__tabs [role="tab"]{flex:1 1 0;min-height:var(--tap);margin-bottom:-1px;padding:10px 12px;border-bottom:3px solid transparent;
  color:var(--mid);font-size:15px}
.estimate-options__tabs [aria-selected="true"]{border-bottom-color:var(--forest);color:var(--forest);font-weight:500}
.estimate-options__tabs [role="tab"]:focus-visible{outline:2px solid var(--copper);outline-offset:-2px}
.estimate-options__group{margin:0 0 22px}
#sheet .estimate-options__group h3{margin:0 0 12px;font:500 15px var(--sans)}
.estimate-options__group .field input{background:var(--white)}
.estimate-options__save{width:100%;margin-top:6px}
.estimate-options__confirm{display:grid;gap:10px;margin:18px 0 0;padding:18px;border:1px solid var(--border);border-radius:12px;background:var(--cream)}
#sheet .estimate-options__confirm h3{margin:0;font:600 18px var(--sans)}
.estimate-options__confirm p{margin:0}
.estimate-options__confirm .btn{width:100%}

/* ---------- Buyer estimate ----------
   CTO's buyer rows (docs/cto-copy-design-2026-09-29.md), built from the
   shared rows above in one narrow column. A row's hints sit close under it
   (.buyer-estimate-group) rather than a whole row gap away. After COMPUTE the
   result replaces the rows: two headline cards with their donuts, the
   detailed closing costs and their Edit, then Preview and Save. */
.buyer-estimate-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;max-width:600px;margin:0 auto;align-items:start}
.buyer-estimate-layout [hidden]{display:none!important}
.buyer-estimate-inputs,.buyer-estimate-results{min-width:0}
.buyer-estimate-group{display:grid;gap:8px;min-width:0}
.buyer-estimate-group>.hint,.buyer-estimate-inputs>.hint{margin:0}
.buyer-estimate-price [data-estimate-price-error]{color:var(--warn)}
.buyer-estimate-price [data-estimate-price-error]:empty{display:none}
/* Options: a text button at the right of the title row, below the header
   that keeps clear of the sheet's fixed Close button, and kept there at phone
   width by letting the words beside it wrap instead of the row. */
.seller-calc-title.buyer-estimate-title{flex-wrap:nowrap;align-items:flex-start}
.buyer-estimate-title>div{flex:1 1 auto;min-width:0}
.seller-calc-title .buyer-estimate-options{flex:none;align-self:flex-start;min-width:var(--tap);min-height:var(--tap);padding:0 12px;
  border-radius:6px;color:var(--copper);font-size:15px;font-weight:500;text-decoration:underline;text-underline-offset:3px}
.buyer-estimate-options:focus-visible{outline:2px solid var(--copper);outline-offset:2px}
.buyer-estimate-legacy-fee{display:grid;gap:8px;min-width:0}
.buyer-estimate-broker-balance{display:block;padding:14px 16px;background:var(--cream);border:1px solid var(--border);border-radius:10px;font-weight:600;font-variant-numeric:tabular-nums}
.buyer-estimate-results{display:grid;gap:18px}
.buyer-estimate-results>[data-estimate-edit]{justify-self:start;min-height:48px}
.buyer-estimate-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}
.buyer-estimate-card{display:grid;gap:14px;align-content:start;min-width:0;padding:20px 18px;border:1px solid var(--border);
  border-radius:14px;background:var(--white);box-shadow:var(--shadow)}
#sheet .buyer-estimate-card h3{margin:0;font:600 16px var(--sans)}
.buyer-estimate-card>.meta{color:var(--mid);font-size:13px}
.buyer-estimate-card .buyer-estimate-breakdown{margin:0}
.buyer-estimate-breakdown{margin:16px 0;font-size:14px}
.buyer-estimate-breakdown>div{display:flex;justify-content:space-between;gap:16px;padding:9px 0}
.buyer-estimate-breakdown dd{margin:0;white-space:nowrap;font-variant-numeric:tabular-nums}
.buyer-estimate-key-assumptions{border-top:1px solid var(--border);padding-top:16px;margin-top:18px}
.buyer-estimate-key-assumptions h3{font:600 15px var(--sans);margin:0}
.buyer-estimate-key-assumptions .buyer-estimate-breakdown{font-size:13px}
.buyer-estimate-costs{border-top:1px solid var(--border);padding-top:16px;margin-top:18px}
#sheet .buyer-estimate-costs h3{font:600 15px var(--sans);margin:0}
#sheet .buyer-estimate-costs h4,#sheet [data-estimate-other-fees] h4{font:600 12px var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--mid);margin:14px 0 0}
.buyer-estimate-costs .buyer-estimate-breakdown{margin:4px 0 0}
.buyer-estimate-costs__total{border-top:1px solid var(--border);font-weight:600}
.buyer-estimate-fees-edit{justify-self:start;min-width:var(--tap);min-height:var(--tap)}
[data-estimate-other-fees] .estimate-row-panel{margin:0}
/* Settings' estimate defaults are grouped in these folds too (estimate-settings.js). */
.buyer-estimate-detail{border-block:1px solid var(--border);margin:18px 0}
.buyer-estimate-detail>summary{padding:14px 0;min-height:48px;cursor:pointer;font-weight:600;color:var(--copper)}
.buyer-estimate-save{display:grid;gap:10px;border-top:1px solid var(--border);padding:18px 0 0}
.buyer-estimate-save>.hint{margin:0}
.buyer-estimate-save .btn{width:100%}
.buyer-estimate-layout .btn{min-height:48px}
.buyer-estimate-layout>.formbar:empty{display:none}
.buyer-estimate-layout>.formbar{margin:0}
[data-estimate-error]{color:var(--warn)}
.estimate-default-form{margin-top:20px}
.seller-calc-adjust>summary{padding:14px 0;min-height:48px;cursor:pointer;font-weight:600;color:var(--copper)}
.seller-calc-adjust{margin-bottom:20px;border-bottom:1px solid var(--border)}
@media(max-width:700px){.buyer-estimate-layout{gap:20px}.buyer-estimate-card{padding:18px 14px}.buyer-estimate-breakdown{font-size:13px}}
#sheet.sheet--calculator{inset:0;width:100%;max-height:none;border:0;border-radius:0;
  overflow-y:auto;background:var(--white);transform:translateY(102%)}
#sheet.sheet--calculator.open{transform:translateY(0)}
#sheet.sheet--calculator .grab{display:none}
#sheet.sheet--calculator .inner{max-width:1120px;margin:0 auto;
  padding:18px 36px calc(40px + env(safe-area-inset-bottom));width:100%}
#sheet.sheet--calculator>.close{position:fixed;z-index:3;background:var(--cream)}
.seller-calc-header{display:flex;align-items:center;justify-content:space-between;
  padding:0 36px 16px 0;border-bottom:1px solid var(--border);gap:20px}
.seller-calc-header .brand-lockup{width:max-content;max-width:100%}
.seller-calc-header>span{font-size:13px;color:var(--mid)}
.seller-calc-title{display:flex;align-items:center;justify-content:space-between;
  gap:20px;padding:16px 0}
#sheet .seller-calc-title h2{font-family:var(--sans);font-size:26px;font-weight:600;margin:3px 0 6px}
.seller-calc-title p{margin:0;color:var(--mid);font-size:14px}
.seller-calc-basis{font-size:12px;padding:8px 12px;background:var(--cream);border-radius:20px}
/* Seller: CTO's one narrow column (docs/cto-copy-design-2026-09-29.md). The
   rows and the result take turns in it, switched by [hidden] in the script;
   the Figures / Net sheet switch and the two-column layout are gone. Each row
   is grouped with its note and its panel, so a panel opens right under it. */
.seller-calc-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;max-width:600px;margin:0 auto;align-items:start}
.seller-calc-layout [hidden]{display:none!important}
.seller-calc-layout>.formbar{margin:0}
.seller-calc-inputs,.seller-calc-results,.seller-calc-row{min-width:0}
/* the rows' own auto margins would shrink them to their content in this grid */
.seller-calc-layout>.seller-calc-inputs{width:100%;margin:0}
.seller-calc-title--column{max-width:600px;margin:0 auto}
.seller-calc-options{flex:none;min-width:var(--tap);min-height:var(--tap);padding:0 12px;border-radius:6px;
  color:var(--copper);font:500 15px var(--sans)}
.seller-calc-options:focus-visible{outline:2px solid var(--copper);outline-offset:2px}
.seller-calc-layout output.hint{display:block;margin:6px 0 0}
.seller-calc-layout output.hint:empty{display:none}
.seller-calc-split{margin-top:14px}
.seller-calc-included .hint{margin:0}
.seller-calc-row .counterpick{min-height:var(--tap);align-items:center}
.seller-calc-edit{min-height:48px;margin:0 0 16px}
.seller-calc-costs .estimate-row-panel{margin:4px 0 12px}
.seller-calc-fee-control{display:grid;grid-template-columns:128px minmax(0,1fr);gap:8px}
.seller-calc-compute{display:flex;width:100%;justify-content:center;min-height:48px}
.seller-calc-costs>summary{cursor:pointer;min-height:44px;display:flex;align-items:center;
  justify-content:space-between;gap:12px;font-size:14px;color:var(--copper);font-weight:600;list-style:none}
.seller-calc-costs>summary::after{content:'+';font-size:22px;font-weight:400}
.seller-calc-costs[open]>summary::after{content:'−'}
.seller-calc-costs>summary::-webkit-details-marker{display:none}
.seller-calc-result-card{border:1px solid var(--border);border-radius:14px;padding:24px;background:var(--white);box-shadow:var(--shadow)}
.seller-calc-result-head{display:flex;justify-content:space-between;gap:16px;align-items:center;border-bottom:1px solid var(--border);padding-bottom:16px}
.seller-calc-result-head h3{margin:0;font-size:15px;font-weight:600}
.seller-calc-result-head>span{font-size:11px;background:var(--cream);padding:5px 10px;border-radius:20px}
[data-estimate-summary]{display:grid;grid-template-columns:220px minmax(0,1fr);gap:12px 18px;align-items:center}
.seller-calc-net{text-align:center;display:grid;gap:5px;margin:18px 0 6px;grid-column:1/-1}
.seller-calc-net>span:first-child{font-size:14px;color:var(--mid)}
.seller-calc-net>strong{font-size:clamp(28px,3.2vw,38px);font-weight:600;line-height:1.2;letter-spacing:-.04em;color:var(--good);font-variant-numeric:tabular-nums}
.seller-calc-net>span:last-child{font-size:11px;color:var(--mid)}
.seller-calc-net--shortfall>strong{color:var(--warn)}
/* Each series ends in a 1deg white gap. Good and forest are only 1.84:1 against
   each other, so side by side the net and payoff wedges ran together; every
   series is at least 3:1 against the white gap and the paper ring, and a series
   that is zero wide leaves only a gap. The amounts stay printed beside it. */
.seller-calc-chart{height:220px;width:220px;margin:16px auto;border-radius:50%;display:grid;place-items:center;
  box-shadow:0 0 0 7px var(--cream);
  background:conic-gradient(var(--good) 0deg calc(var(--net-angle) - 1deg),var(--white) 0 var(--net-angle),var(--forest) 0 calc(var(--payoff-angle) - 1deg),var(--white) 0 var(--payoff-angle),var(--field-border) 0 calc(var(--tax-angle) - 1deg),var(--white) 0 var(--tax-angle),var(--copper) 0 359deg,var(--white) 0 360deg)}
.seller-calc-chart>div{height:176px;width:176px;border-radius:50%;background:var(--white);display:flex;
  flex-direction:column;align-items:center;justify-content:center;font-size:11px;color:var(--mid);gap:3px}
.seller-calc-chart strong{font-size:24px;font-weight:600;letter-spacing:-.04em;color:var(--charcoal);font-variant-numeric:tabular-nums}
.seller-calc-chart--large-number strong{font-size:17px}
.seller-calc-totals{margin:0 0 15px;font-size:12.5px}
.seller-calc-net--shortfall + .seller-calc-totals{grid-column:1/-1}
.seller-calc-totals>div{display:flex;justify-content:space-between;gap:12px;padding:7px 0}
.seller-calc-totals dt{display:flex;align-items:center;gap:8px;min-width:0}
.seller-calc-totals dd{margin:0;white-space:nowrap;font-variant-numeric:tabular-nums;font-weight:500}
.seller-calc-dot{flex:none;width:9px;height:9px;border-radius:50%}
.seller-calc-dot--net{background:var(--good)}
.seller-calc-dot--payoff{background:var(--forest)}
.seller-calc-dot--tax{background:var(--field-border)}
.seller-calc-dot--cost{background:var(--copper)}
.seller-calc-totals>.seller-calc-total-net{border-top:1px solid var(--border);font-weight:600;margin-top:5px;padding-top:12px}
.seller-calc-costs>[data-estimate-breakdown]{margin:10px 0}
.seller-calc-costs>.btn{margin:4px 0 12px;font-size:12px;min-height:44px}
.seller-calc-costs{border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:5px 0}
.seller-calc-costs .seller-cost-line{font-size:12px;gap:12px}
.seller-calc-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
.seller-calc-actions .btn{font-size:13px;min-height:48px;padding:10px 12px;white-space:normal}
.seller-calc-result-card>[data-estimate-status]{font-size:11.5px;margin:12px 0 0;color:var(--mid)}
.seller-calc-incomplete{padding:32px 0;display:grid;gap:10px;text-align:center;min-height:230px;align-content:center;grid-column:1/-1}
.seller-calc-incomplete>span{color:var(--mid);font-size:12px}
.seller-calc-incomplete>strong{font-weight:500;font-size:23px}
.seller-calc-incomplete>p{font-size:13px;color:var(--warn);margin:0}
.seller-calc-notes:not(:empty){padding:14px 16px;margin-top:16px;border-left:3px solid var(--amber);background:var(--cream);border-radius:5px}
.seller-calc-notes h4{font-size:12px;margin:0 0 6px}
.seller-calc-notes p{font-size:11.5px;line-height:1.5;color:var(--mid);margin:5px 0}
.seller-calc-private{font-size:11px;color:var(--mid);text-align:center;margin:16px 0}
.seller-calc-return{width:100%;font-size:12px}
@media(max-width:900px){
  #sheet.sheet--calculator .inner{padding:18px 18px calc(28px + env(safe-area-inset-bottom))}
  .seller-calc-header{padding-bottom:16px;padding-right:44px}
  .seller-calc-header>span{display:none}
  .seller-calc-title{padding:22px 0 20px;flex-wrap:wrap;gap:10px}
  #sheet .seller-calc-title h2{font-size:23px}
  .seller-calc-compute{grid-column:1/-1}
  [data-estimate-summary]{display:block}
  .seller-calc-chart{width:220px;height:220px;margin:26px auto}
  .seller-calc-chart>div{width:176px;height:176px}
}
@media(max-width:480px){
  .seller-calc-result-card{padding:18px 14px}
  .seller-calc-actions{grid-template-columns:1fr}
  .seller-calc-totals{font-size:12px}
}
@media(max-width:350px){
  .seller-calc-chart{width:200px;height:200px}
  .seller-calc-chart>div{width:160px;height:160px}
  .seller-calc-chart strong{font-size:22px}
  .seller-calc-chart--large-number strong{font-size:16px}
}