.qc-section {
  --qc-accent:#ffbc2b;
  --qc-ink:#333;
  --qc-muted:#656565;
  --qc-line:#d8d8d8;
  padding:52px 0;
  color:var(--qc-ink);
  background:#f4f4f4;
  font-family:Montserrat,Arial,sans-serif;
}
.qc-section *, .qc-section *::before, .qc-section *::after { box-sizing:border-box; }
.qc-section [hidden] { display:none !important; }
.qc-wrap { width:min(1120px,calc(100% - 40px)); margin:0 auto; }
.qc-section h2 { margin:0 0 25px; color:var(--qc-ink); font:700 clamp(25px,2.7vw,34px)/1.3 Montserrat,Arial,sans-serif; text-align:center; }
.qc-modes { display:flex; width:max-content; max-width:100%; margin:0 auto 27px; border:1px solid var(--qc-line); background:#fff; }
.qc-modes a { flex:1; display:flex; align-items:center; justify-content:center; min-height:45px; padding:11px 24px; color:var(--qc-ink); text-align:center; text-decoration:none; font-size:13px; line-height:1.4; font-weight:600; }
.qc-modes a[aria-current] { background:var(--qc-ink); color:#fff; }
.qc-modes a:not([aria-current]):hover { background:#fff3d6; }
.qc-layout { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(265px,1fr); gap:30px; padding:28px; border:1px solid #dedede; background:#fff; }
.qc-form { min-width:0; margin:0; }
.qc-form:focus { outline:none; }
.qc-fields { min-width:0; margin:0; padding:0; border:0; }
.qc-legend { margin:0 0 10px; padding:0; color:var(--qc-ink); font-size:14px; line-height:1.45; font-weight:700; }
.qc-types { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-bottom:25px; }
.qc-type { display:flex; align-items:center; gap:8px; min-height:47px; margin:0; padding:9px 10px; border:1px solid var(--qc-line); border-radius:3px; cursor:pointer; color:var(--qc-ink); background:#fff; font-size:11px; line-height:1.4; font-weight:600; }
.qc-type:has(input:checked) { border-color:#ce941d; background:#fff6e1; box-shadow:inset 0 0 0 1px #e6af35; }
.qc-type:has(input:focus-visible) { outline:3px solid var(--qc-ink); outline-offset:2px; }
.qc-type input { flex:0 0 15px; appearance:auto; width:15px; height:15px; margin:0; padding:0; accent-color:#8a600e; }
.qc-type:has(input:disabled) { cursor:default; }
.qc-control ~ .qc-control { padding-top:20px; margin-top:18px; border-top:1px solid #ebebeb; }
.qc-control-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
.qc-control-heading > label { margin:0; color:var(--qc-ink); font-size:14px; font-weight:600; line-height:1.4; }
.qc-number { display:flex; flex:0 0 auto; align-items:center; height:46px; border:1px solid #b8b8b8; border-radius:3px; background:#fff; }
.qc-number button { display:grid; flex:0 0 44px; place-items:center; width:44px; min-height:44px; padding:0; margin:0; border:0; border-radius:0; background:#f3f3f3; color:var(--qc-ink); cursor:pointer; }
.qc-number button:hover:not(:disabled) { background:#ffe8b0; }
.qc-number button:disabled { color:#aaa; cursor:default; }
.qc-number input { appearance:textfield; width:59px; min-width:0; height:42px; margin:0; padding:0 3px 0 6px; border:0; border-radius:0; background:#fff; color:var(--qc-ink); text-align:right; font:600 16px/1.4 Montserrat,Arial,sans-serif; box-shadow:none; }
.qc-number input::-webkit-inner-spin-button, .qc-number input::-webkit-outer-spin-button { appearance:none; margin:0; }
.qc-unit { padding:0 8px 0 3px; color:var(--qc-muted); font-size:12px; white-space:nowrap; }
.qc-range { appearance:auto; display:block; width:100%; height:24px; margin:0; padding:0; border:0; border-radius:0; background:transparent; accent-color:#b77c00; cursor:pointer; box-shadow:none; }
.qc-range:disabled { cursor:default; }
.qc-range-ends { display:flex; justify-content:space-between; margin:1px 0 8px; color:#777; font-size:10px; line-height:1.4; }
.qc-help, .qc-error { margin:0; font-size:12px; line-height:1.55; }
.qc-help { color:var(--qc-muted); }
.qc-error { margin-top:4px; color:#a11c1c; font-weight:500; }
.qc-error:empty { display:none; }
.qc-number input[aria-invalid="true"] { color:#a11c1c; background:#fff2f2; }
.qc-result { min-width:0; border-left:1px solid #ddd; padding-left:28px; }
.qc-layout[hidden],.pe-panel[hidden]{display:none!important}
.qc-result-label { margin:0 0 8px; color:var(--qc-ink); font-size:13px; font-weight:600; line-height:1.4; }
.qc-amount { display:block; margin:0 0 7px; color:var(--qc-ink); font-size:clamp(25px,2.4vw,31px); font-weight:700; line-height:1.25; letter-spacing:-.03em; overflow-wrap:anywhere; }
.qc-formula { margin:0 0 12px; color:#555; font-size:11px; line-height:1.65; font-variant-numeric:tabular-nums; }
.qc-example { margin:0 0 12px; color:#777; font-size:10px; line-height:1.5; }
.qc-assumption, .qc-scope { margin:0 0 10px; color:var(--qc-muted); font-size:12px; line-height:1.6; }
.qc-reference, .qc-rounding { margin:0 0 5px; color:#777; font-size:10px; line-height:1.5; }
.qc-submit { display:flex; align-items:center; justify-content:center; width:100%; min-height:46px; margin:17px 0 10px; padding:11px 18px; border:1px solid #e4a511; border-radius:3px; background:var(--qc-accent); color:#2b2b2b; font:700 13px/1.5 Montserrat,Arial,sans-serif; text-align:center; text-decoration:none; }
.qc-submit:hover { background:#ffca4f; text-decoration:none; }
.qc-submit[aria-disabled="true"] { background:#eee; border-color:#d5d5d5; color:#777; cursor:default; }
.qc-disclaimer, .qc-noscript { margin:0; color:var(--qc-muted); font-size:12px; line-height:1.5; }
.qc-noscript { margin-top:16px; padding:12px 15px; background:#fff; }
.qc-section a:focus-visible, .qc-section button:focus-visible, .qc-number input:focus-visible, .qc-range:focus-visible { outline:3px solid #333; outline-offset:3px; }
@media (max-width:850px) {
  .qc-layout { grid-template-columns:minmax(0,1fr); gap:24px; padding:23px; }
  .qc-result { padding:21px 0 0; border-left:0; border-top:1px solid #ddd; }
  .qc-types { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .qc-submit { max-width:320px; }
}
@media (max-width:480px) {
  .qc-section { padding:36px 0; }
  .qc-wrap { width:calc(100% - 30px); }
  .qc-section h2 { margin-bottom:20px; font-size:25px; }
  .qc-modes { width:100%; margin-bottom:19px; }
  .qc-modes a { padding:10px 12px; font-size:11px; }
  .qc-layout { padding:17px; gap:20px; }
  .qc-types { grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; margin-bottom:21px; }
  .qc-type { padding:8px; font-size:11px; }
  .qc-control-heading { align-items:flex-start; flex-wrap:wrap; gap:9px; }
  .qc-control-heading > label { flex:1 0 100%; font-size:13px; }
  .qc-number { width:100%; }
  .qc-number input { flex:1; width:auto; padding-right:4px; text-align:left; padding-left:12px; }
  .qc-number button { flex-basis:44px; }
  .qc-unit { padding-right:12px; }
  .qc-result { padding-top:19px; }
  .qc-submit { max-width:none; }
}

.qc-dimensions { margin-top:8px; }

.qc-reset { margin-top:20px; min-height:44px; padding:10px 16px; border:1px solid #c9c9c9; border-radius:3px; background:#fff; color:#444; font:500 12px/1.5 Montserrat,Arial,sans-serif; cursor:pointer; }
.qc-reset:hover:not(:disabled) { background:#f4f4f4; }
.qc-reset:disabled { color:#777; cursor:default; }
