.tn-so-page {
  --so-ink:#1a1208; --so-muted:#5a4a30; --so-line:#b8a888; --so-soft:#ddd4be;
  --so-paper:#faf6ee; --so-wash:#f5efdf; --so-surface:rgba(255,252,244,.74);
  --so-button:#ede6d4; --so-hover:#dfd4bb; --so-accent:#c44a00;
  --so-sans:-apple-system,BlinkMacSystemFont,"Pretendard","Segoe UI",system-ui,sans-serif;
  width:100%; max-width:1180px; min-width:0; margin-inline:auto;
}
body:is([data-scheme="dark"],[data-scheme="inverse"],[data-scheme="auto"][data-d="dark"],[data-scheme="auto"][data-l="dark"]) .tn-so-page,
html:is([data-scheme="dark"],[data-scheme="inverse"],.theme-dark) body:not([data-scheme="light"]) .tn-so-page {
  --so-ink:#efe6d2; --so-muted:#c3b492; --so-line:#6f6047; --so-soft:#574a37;
  --so-paper:#241d12; --so-wash:#322a1a; --so-surface:#2c2517;
  --so-button:#2f2115; --so-hover:#3a2a1b; --so-accent:#e8823f;
}
@media (prefers-color-scheme:dark) {
  body[data-scheme="auto"] .tn-so-page,
  html[data-scheme="auto"] body:not([data-scheme="light"]) .tn-so-page {
    --so-ink:#efe6d2; --so-muted:#c3b492; --so-line:#6f6047; --so-soft:#574a37;
    --so-paper:#241d12; --so-wash:#322a1a; --so-surface:#2c2517;
    --so-button:#2f2115; --so-hover:#3a2a1b; --so-accent:#e8823f;
  }
}
.tn-so-page .tn-so-ad { display:flow-root; width:100%; max-width:900px; margin-inline:auto; background:transparent; }
.tn-so-page .tn-so-ad--top { min-height:90px; margin-top:54px; margin-bottom:20px; }
.tn-so-page .tn-so-ad--bottom { min-height:250px; margin-top:24px; margin-bottom:28px; }
.tn-so-tool, .tn-so-tool * { box-sizing:border-box; }
.tn-so-tool {
  min-width:0; border-top:3px double var(--so-line); color:var(--so-ink);
  -webkit-text-fill-color:var(--so-ink); font:14px/1.55 var(--so-sans);
  -webkit-font-smoothing:antialiased;
}
.tn-so-tool :is(h2,h3,p,dl,dt,dd,ol,li,fieldset,legend,label) { margin:0; }
.tn-so-tool :is(ol,li,dl,dt,dd) { padding:0; list-style:none; }
.tn-so-tool li::before { content:none; }
.tn-so-workspace { display:grid; grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr); gap:20px; align-items:start; padding:20px 0 0; }
.tn-so-input, .tn-so-results { min-width:0; display:grid; align-content:start; gap:17px; padding:20px 22px; border:1px solid var(--so-line); background:var(--so-surface); }
.tn-so-results { background:var(--so-wash); }
.tn-so-panel-head { display:grid; gap:4px; padding-bottom:14px; border-bottom:1px solid var(--so-soft); }
.tn-so-panel-head > span, .tn-so-section-head > div > span { color:var(--so-accent); -webkit-text-fill-color:var(--so-accent); font:700 11px/1.4 var(--so-sans); letter-spacing:.06em; }
.tn-so-panel-head h2, .tn-so-section-head h2 { color:var(--so-ink); -webkit-text-fill-color:var(--so-ink); font:700 18px/1.35 var(--so-sans); text-wrap:balance; }
.tn-so-panel-head p, .tn-so-section-head p { color:var(--so-muted); -webkit-text-fill-color:var(--so-muted); font:400 12px/1.5 var(--so-sans); text-wrap:pretty; }
.tn-so-window { display:grid; min-width:0; padding:12px 14px; border:1px solid var(--so-soft); background:var(--so-paper); }
.tn-so-window legend { padding:0 5px; color:var(--so-ink); -webkit-text-fill-color:var(--so-ink); font:700 13px/1.4 var(--so-sans); }
.tn-so-window-options { display:flex; flex-wrap:wrap; gap:6px 16px; }
.tn-so-window-options label, .tn-so-full { display:inline-flex; align-items:center; gap:7px; min-height:40px; cursor:pointer; color:var(--so-ink); -webkit-text-fill-color:var(--so-ink); font:600 12px/1.4 var(--so-sans); }
.tn-so-window-options small { color:var(--so-muted); -webkit-text-fill-color:var(--so-muted); font:500 11px/1.4 var(--so-sans); }
.tn-so-window-options input, .tn-so-full input { width:17px; height:17px; margin:0; accent-color:var(--so-accent); }
.tn-so-window-options input:focus-visible, .tn-so-full input:focus-visible { outline:2px solid var(--so-accent); outline-offset:3px; }
.tn-so-window-fields, .tn-so-row-times { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.tn-so-window-fields { padding-top:6px; }
.tn-so-window-fields[hidden] { display:none!important; }
.tn-so-field { display:grid; gap:5px; min-width:0; border:0; background:transparent; }
.tn-so-field > span { padding:0; color:var(--so-muted); -webkit-text-fill-color:var(--so-muted); font:600 12px/1.45 var(--so-sans); }
.tn-so-field input {
  display:block; width:100%; min-width:0; height:42px; margin:0; padding:8px 10px;
  border:1px solid var(--so-line); border-radius:0; background:var(--so-paper); box-shadow:none;
  color:var(--so-ink); -webkit-text-fill-color:var(--so-ink);
  font:600 15px/1.4 var(--so-sans); font-variant-numeric:lining-nums tabular-nums;
}
.tn-so-field input::placeholder { font-weight:400; opacity:.35; }
.tn-so-field input[aria-invalid="true"] { border-color:var(--so-accent); }
.tn-so-field input:focus-visible, .tn-so-tool button:focus-visible { outline:2px solid var(--so-accent); outline-offset:2px; }
.tn-so-hint { padding-top:7px; color:var(--so-muted); -webkit-text-fill-color:var(--so-muted); font:400 11px/1.5 var(--so-sans); }
.tn-so-list-head { display:flex; justify-content:space-between; align-items:baseline; padding-bottom:5px; border-bottom:1px solid var(--so-soft); }
.tn-so-list-head h3 { color:var(--so-ink); -webkit-text-fill-color:var(--so-ink); font:700 14px/1.4 var(--so-sans); }
.tn-so-list-head span { color:var(--so-muted); -webkit-text-fill-color:var(--so-muted); font:500 11px/1.4 var(--so-sans); }
.tn-so-tool .tn-so-rows { display:grid; gap:0; margin-top:-12px; padding:0; }
.tn-so-tool .tn-so-row { display:grid; gap:8px; min-width:0; padding:12px 0; border-bottom:1px solid var(--so-soft); }
.tn-so-row-head { display:grid; grid-template-columns:24px minmax(0,1fr) auto; align-items:end; gap:8px; }
.tn-so-row-number { display:grid; place-items:center; align-self:center; width:23px; height:23px; border:1px solid var(--so-line); color:var(--so-muted); -webkit-text-fill-color:var(--so-muted); font:700 11px/1 var(--so-sans); font-variant-numeric:tabular-nums; }
.tn-so-row-remove { align-self:end; }
.tn-so-row-foot { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:0 9px; min-height:25px; }
.tn-so-overnight { color:var(--so-accent); -webkit-text-fill-color:var(--so-accent); font:600 11px/1.4 var(--so-sans); }
.tn-so-actions { display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.tn-so-tool button {
  display:inline-grid; place-items:center; min-height:40px; padding:9px 12px; margin:0;
  border:1px solid var(--so-line); border-radius:0; background:var(--so-button); box-shadow:none;
  color:var(--so-ink); -webkit-text-fill-color:var(--so-ink);
  font:700 12px/1 var(--so-sans); letter-spacing:0; text-transform:none; cursor:pointer;
  transition:background-color .16s,border-color .16s;
}
.tn-so-tool button:hover:not(:disabled) { background:var(--so-hover); border-color:var(--so-ink); box-shadow:none; transform:none; }
.tn-so-tool button:disabled { opacity:.5; cursor:not-allowed; }
.tn-so-row-remove { min-width:40px; padding-inline:8px; }
.tn-so-results { gap:18px; }
.tn-so-metrics { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.tn-so-metric { display:grid; align-content:space-between; gap:11px; min-width:0; min-height:100px; padding:14px 15px; border:1px solid var(--so-line); background:var(--so-paper); }
.tn-so-metric--overlap { border-color:var(--so-accent); }
.tn-so-metric--covered { grid-column:1/-1; min-height:77px; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:12px; background:var(--so-surface); }
.tn-so-metric dt { color:var(--so-ink); -webkit-text-fill-color:var(--so-ink); font:700 13px/1.45 var(--so-sans); }
.tn-so-metric dt small { display:block; color:var(--so-muted); -webkit-text-fill-color:var(--so-muted); font:500 11px/1.45 var(--so-sans); }
.tn-so-metric dd { color:var(--so-ink); -webkit-text-fill-color:var(--so-ink); font:800 28px/1.1 var(--so-sans); font-variant-numeric:lining-nums tabular-nums; letter-spacing:normal; overflow-wrap:anywhere; }
.tn-so-metric--overlap dd { color:var(--so-accent); -webkit-text-fill-color:var(--so-accent); }
.tn-so-metric--covered dd { font-size:20px; }
.tn-so-status { min-height:37px; padding:9px 0; border-block:1px solid var(--so-soft); color:var(--so-ink); -webkit-text-fill-color:var(--so-ink); font:600 12px/1.5 var(--so-sans); }
.tn-so-result-note { color:var(--so-muted); -webkit-text-fill-color:var(--so-muted); font:400 12px/1.6 var(--so-sans); text-wrap:pretty; }
.tn-so-results #so-copy { justify-self:start; background:var(--so-ink); border-color:var(--so-ink); color:var(--so-paper); -webkit-text-fill-color:var(--so-paper); }
.tn-so-results #so-copy:hover:not(:disabled) { background:var(--so-accent); border-color:var(--so-accent); color:#faf6ee; -webkit-text-fill-color:#faf6ee; }
.tn-so-timeline-section { min-width:0; padding-top:14px; border-top:1px solid var(--so-soft); }
.tn-so-segments-section { min-width:0; margin-top:20px; padding:19px 22px 22px; border:1px solid var(--so-line); background:var(--so-surface); }
.tn-so-section-head { display:flex; justify-content:space-between; align-items:end; gap:8px 20px; padding-bottom:14px; border-bottom:1px solid var(--so-soft); }
.tn-so-section-head > div { display:grid; gap:3px; }
.tn-so-section-head p { max-width:38ch; text-align:right; }
.tn-so-legend { display:flex; flex-wrap:wrap; gap:8px 17px; margin:13px 0; }
.tn-so-key { display:inline-flex; align-items:center; gap:6px; color:var(--so-muted); -webkit-text-fill-color:var(--so-muted); font:600 11px/1.4 var(--so-sans); }
.tn-so-key::before { content:""; width:11px; height:11px; border:1px solid var(--so-line); background:var(--so-accent); }
.tn-so-key--shift::before { background:var(--so-line); }
.tn-so-key--overlap::before { background:repeating-linear-gradient(135deg,var(--so-accent) 0 3px,var(--so-paper) 3px 6px); }
.tn-so-key--gap::before { background:var(--so-paper); }
.tn-so-timeline { display:grid; gap:9px; min-width:0; }
.tn-so-track-row, .tn-so-axis { display:grid; grid-template-columns:90px minmax(0,1fr); gap:8px; min-width:0; align-items:center; }
.tn-so-axis-label, .tn-so-track-label { min-width:0; overflow-wrap:anywhere; color:var(--so-muted); -webkit-text-fill-color:var(--so-muted); font:600 12px/1.4 var(--so-sans); }
.tn-so-axis-label { white-space:nowrap; font-size:11px; }
.tn-so-axis-ticks { display:flex; justify-content:space-between; min-width:0; }
.tn-so-track-label { color:var(--so-ink); -webkit-text-fill-color:var(--so-ink); }
.tn-so-track { position:relative; min-width:0; height:25px; border:1px solid var(--so-line); background:var(--so-paper); overflow:hidden; }
.tn-so-bar { position:absolute; top:0; bottom:0; background:var(--so-accent); }
.tn-so-bar-covered { background:var(--so-line); }
.tn-so-bar-overlap { background:repeating-linear-gradient(135deg,var(--so-accent) 0 3px,var(--so-paper) 3px 6px); }
.tn-so-bar-gap { background:var(--so-paper); }
.tn-so-segments { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 18px; padding:0; }
.tn-so-tool .tn-so-segment { display:grid; grid-template-columns:minmax(95px,auto) minmax(0,1fr); align-items:start; gap:4px 12px; min-width:0; padding:12px 0; border-bottom:1px solid var(--so-soft); }
.tn-so-segment-time { color:var(--so-ink); -webkit-text-fill-color:var(--so-ink); font:800 13px/1.4 var(--so-sans); font-variant-numeric:lining-nums tabular-nums; overflow-wrap:anywhere; }
.tn-so-segment-state { color:var(--so-accent); -webkit-text-fill-color:var(--so-accent); font:700 12px/1.4 var(--so-sans); }
.tn-so-segment-detail { grid-column:1/-1; color:var(--so-muted); -webkit-text-fill-color:var(--so-muted); font:400 12px/1.5 var(--so-sans); overflow-wrap:anywhere; }
.tn-so-empty { padding:18px 0; color:var(--so-muted); -webkit-text-fill-color:var(--so-muted); font:400 12px/1.5 var(--so-sans); }
.tn-so-noscript { margin-top:14px; color:var(--so-muted); -webkit-text-fill-color:var(--so-muted); }
body:is([data-scheme="dark"],[data-scheme="inverse"],[data-scheme="auto"][data-d="dark"],[data-scheme="auto"][data-l="dark"]) .tn-so-results #so-copy,
html:is([data-scheme="dark"],[data-scheme="inverse"],.theme-dark) body:not([data-scheme="light"]) .tn-so-results #so-copy { background:#6a3b1f; border-color:#e8823f; color:#f7ead1; -webkit-text-fill-color:#f7ead1; }
body:is([data-scheme="dark"],[data-scheme="inverse"],[data-scheme="auto"][data-d="dark"],[data-scheme="auto"][data-l="dark"]) .tn-so-results #so-copy:hover:not(:disabled),
html:is([data-scheme="dark"],[data-scheme="inverse"],.theme-dark) body:not([data-scheme="light"]) .tn-so-results #so-copy:hover:not(:disabled) { background:#824826; border-color:#e8823f; color:#f7ead1; -webkit-text-fill-color:#f7ead1; }
@media (prefers-color-scheme:dark) {
  body[data-scheme="auto"] .tn-so-results #so-copy,
  html[data-scheme="auto"] body:not([data-scheme="light"]) .tn-so-results #so-copy { background:#6a3b1f; border-color:#e8823f; color:#f7ead1; -webkit-text-fill-color:#f7ead1; }
  body[data-scheme="auto"] .tn-so-results #so-copy:hover:not(:disabled),
  html[data-scheme="auto"] body:not([data-scheme="light"]) .tn-so-results #so-copy:hover:not(:disabled) { background:#824826; border-color:#e8823f; color:#f7ead1; -webkit-text-fill-color:#f7ead1; }
}
@media (max-width:850px) {
  .tn-so-workspace { grid-template-columns:minmax(0,1fr); gap:16px; }
  .tn-so-results { grid-row:2; }
}
@media (max-width:720px) {
  .tn-so-page .tn-so-ad--top { margin-top:48px; }
  .tn-so-workspace { padding-top:16px; }
  .tn-so-input, .tn-so-results, .tn-so-segments-section { padding:16px 15px; }
  .tn-so-section-head { align-items:start; flex-direction:column; }
  .tn-so-section-head p { text-align:left; }
  .tn-so-track-row, .tn-so-axis { grid-template-columns:76px minmax(0,1fr); gap:8px; }
  .tn-so-segments { grid-template-columns:minmax(0,1fr); }
}
@media (max-width:380px) {
  .tn-so-input, .tn-so-results, .tn-so-segments-section { padding-inline:12px; }
  .tn-so-field input { padding-inline:7px; }
  .tn-so-metric { padding:12px; }
  .tn-so-metric dd { font-size:24px; }
  .tn-so-metric--covered dd { font-size:18px; }
  .tn-so-track-row, .tn-so-axis { grid-template-columns:68px minmax(0,1fr); gap:6px; }
}
@media (prefers-reduced-motion:reduce) {
  .tn-so-tool button { transition:none; }
}