.tpt-wrap{
  --tpt-accent:#0f7a5c; --tpt-bg:#f3f5f4; --tpt-surface:#fff; --tpt-fg:#17201c; --tpt-muted:#5d6b65; --tpt-line:#dce3df;
  --tpt-neg:#b4422f; --tpt-neg-soft:#f8e7e3;
  --tpt-num:ui-monospace,"SFMono-Regular",Consolas,"Liberation Mono",monospace;
  max-width:760px;margin:0 auto 1.5em;display:grid;gap:14px;color:var(--tpt-fg);line-height:1.55;box-sizing:border-box;position:relative
}
.tpt-wrap *,.tpt-wrap *::before,.tpt-wrap *::after{box-sizing:border-box}
.tpt-wrap .tpt-head{margin-bottom:4px}
.tpt-wrap .tpt-title{font-size:28px;font-weight:700;margin:0;line-height:1.25}
.tpt-wrap .tpt-title span{color:var(--tpt-accent);font-family:var(--tpt-num)}
.tpt-wrap .tpt-sub{margin:4px 0 0;color:var(--tpt-muted);font-size:15px}
.tpt-wrap .tpt-calc{background:var(--tpt-surface);border:1px solid var(--tpt-line);border-radius:12px;padding:18px 20px;display:grid;gap:12px;margin:0}
.tpt-wrap .tpt-calc h3{margin:0;padding:0;font-size:19px;font-weight:700;color:var(--tpt-fg);line-height:1.4;border:0}
.tpt-wrap .tpt-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;font-size:17px}
.tpt-wrap .tpt-row input,.tpt-wrap .tpt-row select{
  font-family:var(--tpt-num);font-size:17px;font-weight:600;color:var(--tpt-fg);background:var(--tpt-bg);
  border:1px solid var(--tpt-line);border-radius:8px;padding:8px 10px;width:7.5em;height:auto;min-height:0;margin:0;
  text-align:right;font-variant-numeric:tabular-nums;box-shadow:none;line-height:1.3
}
.tpt-wrap .tpt-row select{width:auto;text-align:left;font-family:inherit;cursor:pointer}
.tpt-wrap .tpt-row input:focus,.tpt-wrap .tpt-row select:focus{outline:2px solid var(--tpt-accent);outline-offset:1px;border-color:transparent}
.tpt-wrap .tpt-eq{color:var(--tpt-muted);font-family:var(--tpt-num)}
.tpt-wrap .tpt-result{
  font-family:var(--tpt-num);font-size:19px;font-weight:600;line-height:1.3;
  background:color-mix(in srgb,var(--tpt-accent) 12%,#fff);color:var(--tpt-accent);
  padding:7px 12px;border-radius:8px;min-width:5em;text-align:right;font-variant-numeric:tabular-nums;border:0;cursor:pointer;
  text-transform:none;letter-spacing:0;box-shadow:none;margin:0
}
.tpt-wrap .tpt-result:hover{filter:brightness(.97)}
.tpt-wrap .tpt-result.is-neg{background:var(--tpt-neg-soft);color:var(--tpt-neg)}
.tpt-wrap .tpt-result.is-empty{background:transparent;color:var(--tpt-muted);cursor:default}
.tpt-wrap .tpt-result:focus-visible{outline:2px solid var(--tpt-accent);outline-offset:2px}
.tpt-wrap .tpt-sol{font-size:19px;color:var(--tpt-muted);border-top:1px dashed var(--tpt-line);padding-top:10px;display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline}
.tpt-wrap .tpt-sol code{font-family:var(--tpt-num);color:var(--tpt-fg);font-size:19px;font-weight:600;background:none;padding:0;overflow-wrap:anywhere}
.tpt-wrap .tpt-hint{margin-left:auto;font-size:13px}
.tpt-wrap .tpt-toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);background:var(--tpt-fg);color:#fff;
  padding:8px 14px;border-radius:8px;font-size:13px;opacity:0;transition:opacity .2s;pointer-events:none;z-index:99999}
.tpt-wrap .tpt-toast.is-show{opacity:1}
@media (max-width:480px){
  .tpt-wrap .tpt-calc{padding:14px}
  .tpt-wrap .tpt-row{font-size:16px}
  .tpt-wrap .tpt-row input{width:6.2em;font-size:16px}
  .tpt-wrap .tpt-hint{margin-left:0}
  .tpt-wrap .tpt-calc h3{font-size:17px}
  .tpt-wrap .tpt-sol,.tpt-wrap .tpt-sol code{font-size:17px}
}
@media (prefers-reduced-motion:reduce){.tpt-wrap .tpt-toast{transition:none}}
/* Ưu tiên cao để theme không ghi đè cỡ chữ */
.tpt-wrap .tpt-calc h3.tpt-h{font-size:19px!important;line-height:1.4!important;font-weight:700!important;text-transform:none!important;letter-spacing:0!important;color:var(--tpt-fg)!important;margin:0!important;padding:0!important;font-family:inherit}
.tpt-wrap .tpt-sol,.tpt-wrap .tpt-sol span{font-size:19px!important;line-height:1.5!important}
.tpt-wrap .tpt-sol code{font-size:19px!important;font-weight:600!important;color:var(--tpt-fg)!important;background:none!important;padding:0!important;border:0!important}
.tpt-wrap .tpt-sol .tpt-hint{font-size:13px!important}
@media (max-width:480px){
  .tpt-wrap .tpt-calc h3.tpt-h{font-size:17px!important}
  .tpt-wrap .tpt-sol,.tpt-wrap .tpt-sol span,.tpt-wrap .tpt-sol code{font-size:17px!important}
  .tpt-wrap .tpt-sol .tpt-hint{font-size:13px!important}
}