.typ{max-width:900px!important;font-family:'Segoe UI',Arial,sans-serif;margin:16px auto!important;overflow:visible!important;color:#0F284D}.typ *{box-sizing:border-box}.typ .typ-layout{display:grid;grid-template-columns:minmax(0,360px) minmax(0,1fr);align-items:start;gap:18px}.typ .leftinput,.typ .rightresult{float:none!important;width:100%!important;max-width:none!important;margin:0!important}.typ .leftinput{background:#e1eff0;padding:13px!important;border:1px solid #0F284D}.typ .rightresult{padding:0!important;background:transparent}.typ h2{font-size:18px!important;margin:0 0 11px!important;text-align:center}.typ .rightresult h2{background:#228B22;color:#fff;padding:6px!important}.typ .typ-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 9px}.typ .typ-fields[hidden]{display:none!important}.typ .typ-field,.typ .typ-row{min-width:0}.typ label{display:block!important;font-size:11px!important;line-height:1.25!important;font-weight:600!important;margin:0 0 3px!important;color:#0F284D}.typ input,.typ select{min-width:0;width:100%!important;height:36px!important;min-height:36px!important;border:1px solid #0F284D!important;background:#fff!important;color:#0F284D!important;padding:5px 8px!important;font-size:14px!important;line-height:1.2!important;border-radius:2px!important}.typ .typ-mode{margin-bottom:10px}.typ select{font-size:13px!important}.typ :is(input,select,button):focus-visible{outline:3px solid #228B22!important;outline-offset:2px}.typ input[aria-invalid=true]{border-color:#be2424!important;background:#fff6f6!important}.typ-field-error,.typ-form-error{display:block;color:#a71919;font-size:11px;line-height:1.3}.typ-field-error:empty{display:none}.typ-form-error:empty{display:none}.typ .typ-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.typ .typ-actions button{display:block;width:100%!important;margin:0!important;font-size:14px!important;padding:9px!important;min-height:39px!important}.typ-rating{text-align:center;margin:8px 0 0}.typ-summary{padding:9px 11px;background:#e1eff0;border-left:4px solid #228B22;color:#0F284D;font-weight:700;font-size:14px}.typ-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:9px 0}.typ-metrics>div{border:1px solid #e0e5e9;padding:8px;min-width:0;background:#fff}.typ-metrics span{display:block;font-size:11px;color:#55616d}.typ-metrics strong{display:block;font-size:18px;color:#0F284D;overflow-wrap:anywhere}.typ-graph-head{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;margin:11px 0 3px}.typ-graph-head span{font-size:10px;color:#5d6975}.typ-chart{background:#fff;border:1px solid #e0e5e9;padding:3px;min-width:0}.typ-svg{display:block;width:100%;height:auto;touch-action:pan-y;overflow:visible}.typ-chart-data{font-size:11px;min-height:31px;padding:3px 5px;text-align:center;color:#0F284D}.typ-legend{display:flex;flex-wrap:wrap;gap:14px;margin:7px 0;font-size:12px}.typ-legend span{display:flex;align-items:center;gap:6px}.typ-legend i{display:inline-block;width:18px;height:4px}.typ-details{border:1px solid #dce3e9;padding:7px;margin:9px 0;font-size:12px}.typ-details summary{cursor:pointer;font-weight:700}.typ-table-wrap{overflow-x:auto;max-height:320px;overflow-y:auto;margin-top:8px}.typ-table{width:100%;border-collapse:collapse;font-size:12px}.typ-table :is(td,th){padding:6px;border-bottom:1px solid #e4e9ee;text-align:right}.typ-table th{background:#0F284D;color:#fff;position:sticky;top:0}.typ-method{font-size:11px;line-height:1.45;color:#56616e;margin:10px 0}.typ .typ-download{background:#0F284D;color:white;border:0;border-radius:2px;font-size:12px;padding:8px 13px;cursor:pointer}.typ .typ-download:hover{opacity:.9}@media(max-width:720px){.typ .typ-layout{grid-template-columns:1fr;gap:12px}.typ .leftinput{max-width:430px!important;margin:0 auto!important}.typ .rightresult{max-width:600px!important;margin:auto!important}}@media(max-width:380px){.typ .leftinput{padding:9px!important}.typ .typ-fields{gap:5px}.typ label{font-size:10px!important}.typ input,.typ select{height:33px!important;min-height:33px!important}.typ-metrics strong{font-size:16px}}@media print{.typ .leftinput,.typ .typ-download{display:none!important}.typ .typ-layout{display:block}.typ .rightresult{width:100%!important}.typ-details{display:block}.typ-details>summary{display:none}}
/* V2 screenshot-aligned compact form and present-value results */
.typ .typ-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px 9px}
.typ .typ-section-title{grid-column:1/-1;background:#346a9d;color:#fff;font-size:12px;font-weight:700;padding:5px 7px;margin:6px 0 2px}
.typ .typ-section-title:first-child{margin-top:1px}
.typ .typ-field{min-width:0}
.typ .typ-field input{font-variant-numeric:tabular-nums}
.typ .typ-summary{font-weight:500;background:transparent;border:0;border-left:4px solid #228B22;padding:9px 10px;line-height:1.45;font-size:15px}
.typ .typ-explanation p{margin:8px 0;font-size:13px;line-height:1.5;color:#1c2735}
.typ .typ-graph-panel h3{text-align:center;font-size:14px;color:#0F284D;font-weight:700;margin:9px 0 5px}
.typ .typ-chart{border:0}
.typ .typ-graph-panel[hidden],.typ .typ-details[hidden],.typ .typ-download[hidden]{display:none!important}
.typ .typ-chart-data{font-size:11px}
.typ .typ-results h2{text-align:left!important;padding-left:12px!important}
.typ .typ-method{border-top:1px solid #e3e9ed;padding-top:8px}
@media(max-width:720px){.typ .typ-layout{gap:10px}.typ .leftinput{padding:10px!important}.typ .typ-section-title{margin-top:3px}.typ .typ-fields{gap:4px 7px}.typ label{font-size:10px!important}.typ input,.typ select{height:34px!important;min-height:34px!important;font-size:16px!important;padding:4px 6px!important}.typ .typ-actions{margin-top:7px}.typ .typ-field-error{font-size:10px}}
@media(max-width:340px){.typ .typ-fields{grid-template-columns:1fr 1fr}.typ label{font-size:9px!important}}
/* V2.1: match the calorie calculator's input-left / result-right columns.
   The .typ element itself owns both panels; no .typ-layout wrapper exists. */
.typ.toolyak-wrapper {
  display: grid !important;
  grid-template-columns: minmax(0, 325px) minmax(0, 375px);
  justify-content: center;
  align-items: start;
  column-gap: 24px;
  width: 100%;
  max-width: 760px !important;
  overflow: visible !important;
}
.typ.toolyak-wrapper > .typ-form.leftinput,
.typ.toolyak-wrapper > .typ-results.rightresult {
  float: none !important;
  width: 100% !important;
  min-width: 0;
  max-width: none !important;
  margin: 0 !important;
}
.typ.toolyak-wrapper > .typ-form.leftinput { grid-column: 1; }
.typ.toolyak-wrapper > .typ-results.rightresult { grid-column: 2; }
.typ .typ-form, .typ .typ-results, .typ .typ-graph-panel, .typ .typ-chart { min-width: 0; }
.typ .typ-svg { max-width: 100%; }
@media (max-width: 720px) {
  .typ.toolyak-wrapper {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    max-width: 430px !important;
    padding: 0 8px;
  }
  .typ.toolyak-wrapper > .typ-form.leftinput,
  .typ.toolyak-wrapper > .typ-results.rightresult {
    grid-column: 1;
    max-width: 100% !important;
  }
  .typ .typ-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media print {
  .typ.toolyak-wrapper { display: block !important; max-width: 100% !important; }
  .typ.toolyak-wrapper > .typ-form.leftinput { display: none !important; }
  .typ.toolyak-wrapper > .typ-results.rightresult { width: 100% !important; }
}

/* v2.2: clear numerical decision summary. */
.typ .typ-break-even{font-size:12px;font-weight:600;line-height:1.5;margin:6px 0 10px;color:#0F284D}.typ .typ-metrics[hidden]{display:none!important}.typ .typ-metrics strong{font-size:15px;line-height:1.3}.typ .typ-metrics span{font-size:10px}
