.tn-mts-page { width: 100%; max-width: 1180px; margin-inline: auto; min-width: 0; }
.tn-mts-page .tn-mts-ad { display: flow-root; width: 100%; max-width: 900px; margin-inline: auto; background: transparent; }
.tn-mts-page .tn-mts-ad--top { margin: 54px auto 20px; background: transparent; }
.tn-mts-page .tn-mts-ad--bottom { margin: 24px auto 28px; background: transparent; }
.tn-mts-page .tn-mts-ad--top { min-height: 90px; }
.tn-mts-page .tn-mts-ad--bottom { min-height: 250px; }
.tn-mts-tool {
  --mts-ink: #1a1208; --mts-muted: #5a4a30; --mts-line: #b8a888; --mts-soft: #ddd4be;
  --mts-paper: #faf6ee; --mts-wash: #f5efdf; --mts-button: #ede6d4; --mts-hover: #dfd4bb; --mts-accent: #c44a00;
  --mts-sans: -apple-system, BlinkMacSystemFont, "Pretendard", "Segoe UI", system-ui, sans-serif;
  display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 24px;
  width: 100%; max-width: 1180px; margin: 0 auto; align-items: start;
  color: var(--mts-ink); -webkit-text-fill-color: var(--mts-ink); font: 14px/1.6 var(--mts-sans); color-scheme: light;
}
body:is([data-scheme="dark"], [data-scheme="inverse"], [data-scheme="auto"][data-d="dark"], [data-scheme="auto"][data-l="dark"]) .tn-mts-tool,
html:is([data-scheme="dark"], [data-scheme="inverse"], .theme-dark) body:not([data-scheme="light"]) .tn-mts-tool {
  --mts-ink: #efe6d2; --mts-muted: #c3b492; --mts-line: #6f6047; --mts-soft: #574a37;
  --mts-paper: #241d12; --mts-wash: #322a1a; --mts-button: #322a1a; --mts-hover: #4a3116; --mts-accent: #e8823f; color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
  body[data-scheme="auto"] .tn-mts-tool, html[data-scheme="auto"] body:not([data-scheme="light"]) .tn-mts-tool {
    --mts-ink: #efe6d2; --mts-muted: #c3b492; --mts-line: #6f6047; --mts-soft: #574a37;
    --mts-paper: #241d12; --mts-wash: #322a1a; --mts-button: #322a1a; --mts-hover: #4a3116; --mts-accent: #e8823f; color-scheme: dark;
  }
}
.tn-mts-tool, .tn-mts-tool * { box-sizing: border-box; }
.tn-mts-tool [hidden] { display: none !important; }
.tn-mts-tool :is(h2,h3,p,fieldset,legend,dl,dt,dd,ol,li,label) { margin: 0; padding: 0; }
.tn-mts-tool :is(h2,h3) { font: 700 16px/1.5 var(--mts-sans); color: var(--mts-ink); -webkit-text-fill-color: var(--mts-ink); }
.tn-mts-tool :is(.tn-mts-input,.tn-mts-result) { min-width: 0; border-top: 3px double var(--mts-line); }
.tn-mts-tool .tn-mts-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; min-height: 51px; border-bottom: 1px solid var(--mts-line); padding: 10px 0; }
.tn-mts-heading > span, .tn-mts-tool .tn-mts-caption { font-size: 12px; color: var(--mts-muted); -webkit-text-fill-color: var(--mts-muted); }
.tn-mts-tool .tn-mts-intro { padding: 14px 0 18px; font-size: 13px; color: var(--mts-muted); -webkit-text-fill-color: var(--mts-muted); }
.tn-mts-tool .tn-mts-rows { display: grid; gap: 16px; }
.tn-mts-tool .tn-mts-row { min-width: 0; border: 1px solid var(--mts-line); background: var(--mts-paper); padding: 10px 16px 12px; }
.tn-mts-tool .tn-mts-row legend { float: none; width: auto; padding: 0 7px; font-size: 12px; font-weight: 700; color: var(--mts-muted); -webkit-text-fill-color: var(--mts-muted); }
.tn-mts-tool .tn-mts-times { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.tn-mts-tool .tn-mts-times label { display: grid; gap: 5px; min-width: 0; font-size: 12px; font-weight: 600; }
.tn-mts-tool input[type="time"] { display: block; appearance: auto; width: 100%; min-width: 0; max-width: 100%; height: 44px; margin: 0; padding: 8px 10px; border: 1px solid var(--mts-line); border-radius: 0; background: var(--mts-paper); color: var(--mts-ink); -webkit-text-fill-color: var(--mts-ink); font: 600 18px/1.4 var(--mts-sans); font-variant-numeric: lining-nums tabular-nums; box-shadow: none; }
.tn-mts-tool input::placeholder { font-weight: 400; opacity: .35; }
.tn-mts-tool .tn-mts-row-actions { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 6px; }
.tn-mts-tool .tn-mts-next-label { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; cursor: pointer; font-size: 12px; }
.tn-mts-tool input[type="checkbox"] { appearance: auto; width: 17px; height: 17px; margin: 0; accent-color: var(--mts-accent); }
.tn-mts-tool button { min-height: 40px; min-width: 40px; padding: 8px 13px; margin: 0; border: 1px solid var(--mts-line); border-radius: 0; box-shadow: none; background: var(--mts-button); color: var(--mts-ink); -webkit-text-fill-color: var(--mts-ink); font: 600 13px/1.5 var(--mts-sans); text-transform: none; letter-spacing: normal; cursor: pointer; }
.tn-mts-tool button:hover:not(:disabled) { background: var(--mts-hover); transform: none; box-shadow: none; }
.tn-mts-tool :is(button,input):focus-visible { outline: 2px solid var(--mts-accent); outline-offset: 3px; }
.tn-mts-tool .tn-mts-remove { border-color: transparent; background: transparent; font-size: 12px; }
.tn-mts-tool .tn-mts-row-note { font-size: 12px; color: var(--mts-muted); -webkit-text-fill-color: var(--mts-muted); }
.tn-mts-tool .has-error { border-color: var(--mts-accent); }
.tn-mts-tool .has-error .tn-mts-row-note { color: var(--mts-accent); -webkit-text-fill-color: var(--mts-accent); }
.tn-mts-tool .tn-mts-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.tn-mts-tool .tn-mts-add { flex: 1; }
.tn-mts-tool .tn-mts-total-area { padding: 24px 20px 20px; background: var(--mts-wash); border-bottom: 1px solid var(--mts-line); }
.tn-mts-tool .tn-mts-total { display: block; margin: 8px 0 12px; font: 800 clamp(30px,3.5vw,44px)/1.25 var(--mts-sans); font-variant-numeric: lining-nums tabular-nums; overflow-wrap: anywhere; color: var(--mts-ink); -webkit-text-fill-color: var(--mts-ink); }
.tn-mts-tool .tn-mts-status { font-size: 12px; color: var(--mts-muted); -webkit-text-fill-color: var(--mts-muted); }
.tn-mts-tool .tn-mts-metrics { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; padding: 18px 0; border-bottom: 1px solid var(--mts-soft); }
.tn-mts-tool .tn-mts-metrics dt { font-size: 12px; color: var(--mts-muted); -webkit-text-fill-color: var(--mts-muted); }
.tn-mts-tool .tn-mts-metrics dd { margin-top: 8px; font: 800 20px/1.4 var(--mts-sans); font-variant-numeric: lining-nums tabular-nums; overflow-wrap: anywhere; }
.tn-mts-tool .tn-mts-breakdown { padding: 20px 0; }
.tn-mts-tool .tn-mts-breakdown h3 { font-size: 13px; margin-bottom: 14px; }
.tn-mts-tool .tn-mts-breakdown-list { list-style: none; display: grid; gap: 17px; }
.tn-mts-tool .tn-mts-breakdown-list li { list-style: none; }
.tn-mts-tool .tn-mts-breakdown-list li::before { content: none; }
.tn-mts-tool .tn-mts-breakdown-list li > div:first-child { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; font-size: 12px; }
.tn-mts-tool .tn-mts-breakdown-list strong { font: 800 12px/1.6 var(--mts-sans); font-variant-numeric: lining-nums tabular-nums; }
.tn-mts-tool .tn-mts-bar { height: 6px; margin-top: 8px; background: var(--mts-soft); }
.tn-mts-tool .tn-mts-bar > span { display: block; height: 100%; background: var(--mts-accent); }
.tn-mts-tool :is(.tn-mts-empty,.tn-mts-rule,.tn-mts-copy-status) { font-size: 12px; color: var(--mts-muted); -webkit-text-fill-color: var(--mts-muted); }
.tn-mts-tool .tn-mts-rule { border-top: 1px solid var(--mts-soft); padding-top: 14px; }
.tn-mts-tool .tn-mts-copy { margin-top: 16px; width: 100%; }
.tn-mts-tool button:disabled { opacity: .55; cursor: not-allowed; }
.tn-mts-tool .tn-mts-copy-status:not(:empty) { margin-top: 8px; }
@media (max-width: 720px) {
  .tn-mts-page .tn-mts-ad--top { margin-top: 48px; }
  .tn-mts-tool { grid-template-columns: minmax(0,1fr); gap: 24px; }
  .tn-mts-tool .tn-mts-row { padding-inline: 12px; }
  .tn-mts-tool .tn-mts-times { gap: 12px; }
  .tn-mts-tool input[type="time"] { padding-inline: 6px; font-size: 17px; }
  .tn-mts-tool .tn-mts-total-area { padding: 20px 16px; }
}