/* Period timetable: compact settings/result row above a full-width schedule. */
.tn-pet-page {
  --pet-paper: #faf6ee;
  --pet-wash: #f5efdf;
  --pet-ink: #1a1208;
  --pet-muted: #5a4a30;
  --pet-line: #b8a888;
  --pet-soft: #ddd4be;
  --pet-accent: #c44a00;
  --pet-button: #ede6d4;
  --pet-hover: #dfd4bb;
  --pet-primary: #1a1208;
  --pet-primary-text: #faf6ee;
  --pet-primary-hover: #463524;
  --pet-sans: -apple-system, BlinkMacSystemFont, "Pretendard", "Segoe UI", system-ui, sans-serif;
  color-scheme: light;
  width: 100%;
  max-width: 1180px;
  margin-inline: auto;
  color: var(--pet-ink);
  -webkit-font-smoothing: antialiased;
}
.tn-pet-page .tn-pet-tool,
.tn-pet-page .tn-pet-tool * { box-sizing: border-box; }
.tn-pet-page .tn-pet-ad--top,
.tn-pet-page .tn-pet-ad--bottom {
  width: 100%; max-width: 900px; min-height: 90px; height: auto; max-height: none;
  margin-inline: auto; padding: 0; border: 0; background: transparent;
  box-shadow: none; overflow: visible;
}
.tn-pet-page .tn-pet-ad--top { margin-top: 54px; margin-bottom: 28px; }
.tn-pet-page .tn-pet-ad--bottom { margin-top: 28px; margin-bottom: 28px; }
.tn-pet-page .tn-pet-tool {
  border: 1px solid var(--pet-line);
  border-top: 3px double var(--pet-line);
  background: var(--pet-paper);
  color: var(--pet-ink);
  font-family: var(--pet-sans);
  font-size: 14px;
  line-height: 1.6;
}
.tn-pet-page .tn-pet-workspace { display: grid; grid-template-columns: minmax(300px, 370px) minmax(0, 1fr); }
.tn-pet-page .tn-pet-input,
.tn-pet-page .tn-pet-output,
.tn-pet-page .tn-pet-schedule { min-width: 0; padding: 24px; }
.tn-pet-page .tn-pet-schedule { grid-column: 1 / -1; border-top: 1px solid var(--pet-line); }
.tn-pet-page .tn-pet-input { background: var(--pet-wash); }
.tn-pet-page .tn-pet-output { display: flex; flex-direction: column; border-left: 1px solid var(--pet-line); }
.tn-pet-page .tn-pet-tool h2,
.tn-pet-page .tn-pet-tool h3 { margin: 0 0 16px; color: var(--pet-ink); font-family: var(--pet-sans); font-size: 16px; font-weight: 800; line-height: 1.5; text-wrap: balance; }
.tn-pet-page .tn-pet-tool p { margin: 0; }
.tn-pet-page .tn-pet-kicker { display: block; margin-bottom: 20px; color: var(--pet-muted); font-size: 11px; font-weight: 700; letter-spacing: .065em; }
.tn-pet-page .tn-pet-tool .tn-pet-intro { margin-bottom: 22px; color: var(--pet-muted); font-size: 13px; line-height: 1.8; text-wrap: pretty; }
.tn-pet-page .tn-pet-fields,
.tn-pet-page .tn-pet-long-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 12px; }
.tn-pet-page .tn-pet-field { display: block; min-width: 0; margin: 0; color: var(--pet-muted); font-size: 13px; font-weight: 600; }
.tn-pet-page .tn-pet-field > label,
.tn-pet-page .tn-pet-field > span:first-child:not(.tn-pet-control) { display: block; margin-bottom: 6px; }
.tn-pet-page .tn-pet-control { display: flex; align-items: stretch; min-width: 0; margin-top: 6px; border: 1px solid var(--pet-line); background: var(--pet-paper); transition: border-color 160ms ease; }
.tn-pet-page .tn-pet-control:focus-within { border-color: var(--pet-accent); }
.tn-pet-page .tn-pet-control:has([aria-invalid="true"]) { border-color: var(--pet-accent); }
.tn-pet-page .tn-pet-field select,
.tn-pet-page .tn-pet-field input {
  display: block; width: 100%; min-width: 0; height: 48px; margin: 0; padding: 9px 10px;
  border: 0; border-radius: 0; background: var(--pet-paper); box-shadow: none;
  color: var(--pet-ink); -webkit-text-fill-color: var(--pet-ink);
  font-family: var(--pet-sans); font-size: 20px; font-weight: 600; line-height: 1.2;
  font-variant-numeric: lining-nums tabular-nums; color-scheme: light;
}
.tn-pet-page .tn-pet-field select { font-size: 15px; padding-right: 24px; cursor: pointer; color-scheme: inherit; }
.tn-pet-page .tn-pet-field input::placeholder { color: var(--pet-muted); -webkit-text-fill-color: var(--pet-muted); font-weight: 400; opacity: .35; }
.tn-pet-page .tn-pet-unit { display: flex; align-items: center; justify-content: center; flex: 0 0 34px; padding: 0 5px; border-left: 1px solid var(--pet-line); background: var(--pet-wash); color: var(--pet-muted); font-size: 12px; font-weight: 500; }
.tn-pet-page .tn-pet-long-toggle { display: flex; align-items: center; gap: 9px; min-height: 44px; margin: 22px 0 0; padding: 10px 0; border-top: 1px solid var(--pet-soft); color: var(--pet-ink); font-size: 13px; font-weight: 700; cursor: pointer; }
.tn-pet-page .tn-pet-long-toggle input { flex: 0 0 18px; width: 18px; height: 18px; margin: 0; accent-color: var(--pet-accent); cursor: pointer; }
.tn-pet-page .tn-pet-long-fields { margin-top: 12px; }
.tn-pet-page .tn-pet-long-fields > .tn-pet-hint { grid-column: 1 / -1; margin-top: 0; }
.tn-pet-page .tn-pet-tool [hidden] { display: none !important; }
.tn-pet-page .tn-pet-tool .tn-pet-hint { margin-top: 14px; color: var(--pet-muted); font-size: 12px; line-height: 1.8; text-wrap: pretty; }
.tn-pet-page .tn-pet-final { padding-bottom: 19px; border-bottom: 3px double var(--pet-line); }
.tn-pet-page .tn-pet-final-label { display: block; color: var(--pet-muted); font-size: 13px; font-weight: 600; }
.tn-pet-page #pet-final { display: block; margin: 5px 0 7px; color: var(--pet-accent); -webkit-text-fill-color: var(--pet-accent); font-family: var(--pet-sans); font-size: clamp(44px, 5vw, 64px); font-weight: 800; line-height: 1.12; letter-spacing: -.035em; font-variant-numeric: lining-nums tabular-nums; overflow-wrap: anywhere; }
.tn-pet-page .tn-pet-final-caption { display: block; color: var(--pet-muted); font-size: 12px; }
/* Segment widths are supplied by the calculation as proportional flex-grow values. */
.tn-pet-page .tn-pet-rhythm { display: flex; flex: 1 0 auto; flex-direction: column; justify-content: center; min-width: 0; padding: 22px 0; }
.tn-pet-page .tn-pet-rhythm-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 16px; margin-bottom: 10px; color: var(--pet-muted); font-size: 12px; line-height: 1.6; }
.tn-pet-page #pet-rhythm-range { font-family: var(--pet-sans); font-size: 12px; font-weight: 600; font-variant-numeric: lining-nums tabular-nums; overflow-wrap: anywhere; }
.tn-pet-page .tn-pet-rhythm-track { display: flex; width: 100%; min-width: 0; height: 14px; background: var(--pet-wash); }
.tn-pet-page .tn-pet-rhythm-track > span { display: block; flex-basis: 0; flex-shrink: 1; min-width: 0; height: 100%; border-right: 1px solid var(--pet-paper); }
.tn-pet-page .tn-pet-rhythm-track > span:last-child { border-right: 0; }
.tn-pet-page .tn-pet-rhythm-track > .tn-pet-rhythm-lesson { background: var(--pet-muted); }
.tn-pet-page .tn-pet-rhythm-track > .tn-pet-rhythm-break { background: var(--pet-accent); }
.tn-pet-page .tn-pet-rhythm-track > .is-long { background: repeating-linear-gradient(135deg, var(--pet-accent) 0 3px, var(--pet-paper) 3px 5px); }
.tn-pet-page .tn-pet-rhythm-legend { display: flex; flex-wrap: wrap; gap: 6px 15px; margin-top: 10px; color: var(--pet-muted); font-size: 11px; line-height: 1.6; }
.tn-pet-page .tn-pet-rhythm-legend > span { display: inline-flex; align-items: center; gap: 6px; }
.tn-pet-page .tn-pet-rhythm-legend i { display: block; flex: 0 0 10px; width: 10px; height: 7px; background: var(--pet-muted); }
.tn-pet-page .tn-pet-rhythm-legend i.tn-pet-rhythm-break { background: var(--pet-accent); }
.tn-pet-page .tn-pet-rhythm-legend i.is-long { background: repeating-linear-gradient(135deg, var(--pet-accent) 0 3px, var(--pet-paper) 3px 5px); }
.tn-pet-page .tn-pet-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: auto 0 0; padding-top: 18px; }
.tn-pet-page .tn-pet-summary > div { min-width: 0; }
.tn-pet-page .tn-pet-summary span { display: block; margin-bottom: 4px; color: var(--pet-muted); font-size: 12px; }
.tn-pet-page .tn-pet-summary strong { display: block; color: var(--pet-ink); font-family: var(--pet-sans); font-size: 21px; font-weight: 800; line-height: 1.4; font-variant-numeric: lining-nums tabular-nums; overflow-wrap: anywhere; }
.tn-pet-page .tn-pet-table-wrap { width: 100%; min-width: 0; }
.tn-pet-page .tn-pet-table { width: 100%; table-layout: fixed; margin: 0; border: 0; border-collapse: collapse; color: var(--pet-ink); font-family: var(--pet-sans); font-size: 14px; line-height: 1.5; font-variant-numeric: lining-nums tabular-nums; }
.tn-pet-page .tn-pet-table caption { padding: 0 0 9px; color: var(--pet-muted); font-family: var(--pet-sans); font-size: 12px; font-weight: 600; text-align: left; caption-side: top; }
.tn-pet-page .tn-pet-table th,
.tn-pet-page .tn-pet-table td { padding: 11px 8px; border: 0; border-bottom: 1px solid var(--pet-soft); background: transparent; color: var(--pet-ink); text-align: center; vertical-align: middle; overflow-wrap: anywhere; }
.tn-pet-page .tn-pet-table thead th { border-top: 1px solid var(--pet-line); border-bottom-color: var(--pet-line); background: var(--pet-wash); color: var(--pet-muted); font-size: 12px; font-weight: 600; }
.tn-pet-page .tn-pet-table th:first-child { width: 17%; }
.tn-pet-page .tn-pet-table th:last-child { width: 31%; }
.tn-pet-page .tn-pet-table tbody th { font-size: 12px; font-weight: 600; }
.tn-pet-page .tn-pet-table tbody td:nth-child(2),
.tn-pet-page .tn-pet-table tbody td:nth-child(3) { font-weight: 800; }
.tn-pet-page .tn-pet-table tbody td:last-child { color: var(--pet-muted); font-size: 12px; }
.tn-pet-page .tn-pet-table tbody tr:last-child { background: var(--pet-wash); }
.tn-pet-page .tn-pet-table tbody tr:last-child td:nth-child(3) { color: var(--pet-accent); }
.tn-pet-page .tn-pet-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.tn-pet-page .tn-pet-tool button {
  display: inline-flex; align-items: center; justify-content: center; min-width: 40px; min-height: 40px; height: 40px;
  margin: 0; padding: 0 14px; border: 1px solid var(--pet-line); border-radius: 0;
  background: var(--pet-button); color: var(--pet-ink); -webkit-text-fill-color: var(--pet-ink); box-shadow: none;
  font-family: var(--tn-mono, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
  font-size: 12px; font-weight: 700; line-height: 1; letter-spacing: 0; text-transform: none; text-align: center;
  cursor: pointer; transition: background-color 160ms ease, border-color 160ms ease, transform 120ms ease;
}
.tn-pet-page .tn-pet-tool #pet-copy { border-color: var(--pet-primary); background: var(--pet-primary); color: var(--pet-primary-text); -webkit-text-fill-color: var(--pet-primary-text); }
@media (hover: hover) {
  .tn-pet-page .tn-pet-tool button:not(:disabled):hover { background: var(--pet-hover); }
  .tn-pet-page .tn-pet-tool #pet-copy:not(:disabled):hover { background: var(--pet-primary-hover); border-color: var(--pet-primary-hover); }
}
.tn-pet-page .tn-pet-tool button:not(:disabled):active { transform: scale(.96); }
.tn-pet-page .tn-pet-tool button:disabled { opacity: .45; cursor: not-allowed; }
.tn-pet-page .tn-pet-tool :is(button, input, select):focus-visible { outline: 2px solid var(--pet-accent); outline-offset: 2px; }
.tn-pet-page #pet-status { min-height: 24px; margin-top: 12px; color: var(--pet-muted); font-size: 12px; line-height: 1.75; overflow-wrap: anywhere; }
.tn-pet-page .tn-pet-output { transition: opacity 140ms ease; }
.tn-pet-page .tn-pet-tool.is-updating .tn-pet-output,
.tn-pet-page .tn-pet-tool[aria-busy="true"] .tn-pet-output { opacity: .6; }
body[data-scheme="dark"] .tn-pet-page,
body[data-scheme="inverse"] .tn-pet-page,
body[data-scheme="auto"][data-l="dark"] .tn-pet-page,
body[data-scheme="auto"][data-d="dark"] .tn-pet-page,
html[data-scheme="dark"] body:not([data-scheme="light"]) .tn-pet-page {
  --pet-paper: #201a13; --pet-wash: #271f16; --pet-ink: #f7ead1; --pet-muted: #cbbd9e;
  --pet-line: #826744; --pet-soft: #594831; --pet-accent: #ffab6b;
  --pet-button: #2f2115; --pet-hover: #3a2a1b; --pet-primary: #6a3b1f;
  --pet-primary-text: #f7ead1; --pet-primary-hover: #824826;
  color-scheme: dark;
}
.tn-pet-page .tn-pet-field input { color-scheme: inherit; }
@media (prefers-color-scheme: dark) {
  body[data-scheme="auto"] .tn-pet-page {
    --pet-paper: #201a13; --pet-wash: #271f16; --pet-ink: #f7ead1; --pet-muted: #cbbd9e;
    --pet-line: #826744; --pet-soft: #594831; --pet-accent: #ffab6b;
    --pet-button: #2f2115; --pet-hover: #3a2a1b; --pet-primary: #6a3b1f;
    --pet-primary-text: #f7ead1; --pet-primary-hover: #824826;
    color-scheme: dark;
  }
}
@media (max-width: 760px) {
  .tn-pet-page .tn-pet-ad--top { margin-top: 48px; margin-bottom: 24px; }
  .tn-pet-page .tn-pet-workspace { grid-template-columns: minmax(0, 1fr); }
  .tn-pet-page .tn-pet-input,
  .tn-pet-page .tn-pet-output,
  .tn-pet-page .tn-pet-schedule { padding: 20px 16px; }
  .tn-pet-page .tn-pet-output { border-left: 0; border-top: 1px solid var(--pet-line); }
  .tn-pet-page .tn-pet-fields { gap: 16px 12px; }
  .tn-pet-page .tn-pet-kicker { margin-bottom: 16px; }
  .tn-pet-page .tn-pet-final { padding-bottom: 16px; }
  .tn-pet-page #pet-final { font-size: 48px; }
  .tn-pet-page .tn-pet-rhythm { flex: 0 0 auto; padding: 18px 0 0; }
  .tn-pet-page .tn-pet-rhythm-head { gap: 4px 12px; }
  .tn-pet-page .tn-pet-rhythm-track { height: 12px; }
  .tn-pet-page .tn-pet-summary { gap: 8px; margin: 16px 0 0; padding-top: 0; }
  .tn-pet-page .tn-pet-summary strong { font-size: 18px; }
  .tn-pet-page .tn-pet-summary span { font-size: 11px; }
  .tn-pet-page .tn-pet-table th,
  .tn-pet-page .tn-pet-table td { padding: 10px 4px; }
  .tn-pet-page .tn-pet-table thead th { font-size: 11px; }
  .tn-pet-page .tn-pet-table tbody td:last-child { font-size: 11px; }
  .tn-pet-page .tn-pet-actions { gap: 7px; }
  .tn-pet-page .tn-pet-tool button { padding-inline: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .tn-pet-page .tn-pet-control,
  .tn-pet-page .tn-pet-output,
  .tn-pet-page .tn-pet-tool button { transition: none; }
  .tn-pet-page .tn-pet-tool button:not(:disabled):active { transform: none; }
}
@media print {
  .tn-pet-page {
    --pet-paper: #fff !important; --pet-wash: #fff !important; --pet-ink: #000 !important; --pet-muted: #333 !important;
    --pet-line: #777 !important; --pet-soft: #bbb !important; --pet-accent: #000 !important;
    color-scheme: light;
  }
  .tn-pet-page .tn-pet-rhythm,
  .tn-pet-page .tn-pet-input,
  .tn-pet-page .tn-pet-actions,
  .tn-pet-page #pet-status,
  .tn-pet-page .tn-pet-ad--top,
  .tn-pet-page .tn-pet-ad--bottom,
  .tn-pet-page .tn-article-panel,
  .tn-pet-page .tn-design-note,
  body:has(.tn-pet-page) .cs-header,
  body:has(.tn-pet-page) .cs-header__outer,
  body:has(.tn-pet-page) .cs-footer,
  body:has(.tn-pet-page) .cs-entry__footer,
  body:has(.tn-pet-page) .cs-sight-testimonials,
  body:has(.tn-pet-page) .cs-contact-form { display: none !important; }
  .tn-pet-page .tn-pet-workspace { display: block; }
  .tn-pet-page .tn-pet-output { border: 0; }
  .tn-pet-page .tn-pet-tool { background: #fff; color: #000; }
  .tn-pet-page .tn-pet-table tr { break-inside: avoid; }
  .tn-pet-page .tn-pet-table thead { display: table-header-group; }
  html body.wp-theme-intro .tn-pet-page[data-tn-fixed-partials="character-counter"][data-tn-fixed-partials="character-counter"] > :is(section.tn-design-note, article.tn-article-panel) { display: none !important; }
}
