/* Travel, Unit, Water The New conversion · 20260708a */

body.tn-tuw-page-body {
  --tn-tuw-ink: #1a1208;
  --tn-tuw-muted: #5b4a30;
  --tn-tuw-line: #b8a888;
  --tn-tuw-soft-line: #ddd4be;
  --tn-tuw-paper: #faf6ee;
  --tn-tuw-wash: #f5efdf;
  --tn-tuw-card: rgba(255, 253, 247, .78);
  --tn-tuw-button: #ede6d4;
  --tn-tuw-button-hover: #dfd4bb;
  --tn-tuw-accent: #c44a00;
  --tn-tuw-danger: #9b3f2f;
  --tn-tuw-safe: #3f5f32;
  --tn-tuw-serifs: "Noto Serif KR", AppleMyungjo, Batang, Georgia, serif;
  --tn-tuw-mono: "Courier New", ui-monospace, SFMono-Regular, Menlo, monospace;
}

body.tn-tuw-page-body:is([data-scheme="dark"], [data-scheme="inverse"]),
body.tn-tuw-page-body[data-scheme="auto"][data-l="dark"],
body.tn-tuw-page-body[data-scheme="auto"][data-d="dark"],
html[data-resolved-scheme="dark"] body.tn-tuw-page-body:not([data-scheme="light"]) {
  --tn-tuw-ink: #f7ead1;
  --tn-tuw-muted: #dcc6a3;
  --tn-tuw-line: #8f775e;
  --tn-tuw-soft-line: #604d3a;
  --tn-tuw-paper: #201811;
  --tn-tuw-wash: #2b2119;
  --tn-tuw-card: rgba(37, 28, 20, .82);
  --tn-tuw-button: #3a2d22;
  --tn-tuw-button-hover: #4a392c;
  --tn-tuw-accent: #ff9a48;
  --tn-tuw-danger: #ef8d77;
  --tn-tuw-safe: #b8d69d;
}

body.tn-tuw-page-body .cs-entry__header,
body.tn-tuw-page-body .cs-custom-content-post-before {
  display: none !important;
}

body.tn-tuw-page-body .entry-content {
  margin: 0 !important;
  max-width: none !important;
  overflow-x: clip;
}

body.tn-tuw-page-body .entry-content > p:empty {
  display: none !important;
}

body.tn-tuw-page-body .entry-content :is(.tn-tuw-tool, .tn-design-note, .tn-article-panel) :is(ul, ol) {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.tn-tuw-page-body .entry-content :is(.tn-tuw-tool, .tn-design-note, .tn-article-panel) li {
  margin: 0 !important;
  padding: 0 !important;
}

.tn-tuw-page,
.tn-tuw-page * {
  box-sizing: border-box;
}

.tn-tuw-page {
  position: relative;
  width: min(1180px, calc(100vw - 10px));
  margin: 10px auto 0;
  color: var(--tn-tuw-ink);
  font-family: var(--tn-tuw-serifs);
  background: transparent;
}

.tn-tuw-page a {
  color: inherit;
}

.tn-hero {
  margin: 0 0 54px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--tn-tuw-ink);
}

.tn-hero__eyebrow {
  display: block;
  margin: 0 0 20px;
  color: var(--tn-tuw-accent);
  font: 700 12px/1.2 var(--tn-tuw-mono);
  letter-spacing: .04em;
}

html body.wp-theme-intro .tn-hero.tn-hero h1 {
  margin: 0 0 22px !important;
  color: var(--tn-tuw-ink) !important;
  font-family: var(--tn-tuw-serifs) !important;
  font-size: clamp(19px, calc(5.2vw - 15px), 47px) !important;
  font-weight: 950 !important;
  letter-spacing: -.045em !important;
  line-height: .98 !important;
}

.tn-hero p {
  max-width: 760px;
  margin: 0;
  color: var(--tn-tuw-muted);
  font-size: 15px;
  line-height: 1.7;
  word-break: keep-all;
}

.tn-ad {
  width: 100%;
  margin: 0 auto;
  padding: 0;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--tn-tuw-muted);
  line-height: 0;
  overflow: hidden;
}

.tn-ad--top {
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(900px, 100%);
  min-height: 90px;
  height: 90px;
  margin-bottom: 26px;
}

.tn-ad .roberin-aicp-ad-guard,
.tn-side-rails .roberin-aicp-ad-guard {
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 100%;
}

.tn-ad--top .roberin-aicp-ad-guard {
  width: min(900px, 100%);
  height: 90px;
}

.tn-ad--below {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 336px));
  justify-content: center;
  gap: 18px;
  margin: 18px auto 28px;
  line-height: normal;
}

.tn-ad__box {
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(336px, 100%);
  min-height: 280px;
  margin: 0 auto;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: hidden;
}

.tn-ad__box .roberin-aicp-ad-guard {
  width: min(336px, 100%);
  min-height: 280px;
}

.tn-ad ins,
.tn-ad iframe,
.tn-side-rails ins,
.tn-side-rails iframe {
  max-width: 100% !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.tn-ad--top ins,
.tn-ad--top iframe,
.tn-ad--top .roberin-qa-ad-placeholder {
  width: min(900px, 100%) !important;
  min-height: 90px !important;
  height: 90px !important;
  max-height: 90px !important;
  line-height: 1.2 !important;
}

.tn-tuw-page .roberin-qa-ad-placeholder {
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  font-size: 0 !important;
  line-height: 0 !important;
  overflow: hidden !important;
  text-shadow: none !important;
  visibility: hidden !important;
}

.tn-ad__box .roberin-qa-ad-placeholder {
  display: block !important;
  width: min(336px, 100%) !important;
  min-height: 280px !important;
}

.tn-side-rails {
  display: none;
}

.tn-tuw-tool {
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 16px !important;
  color: var(--tn-tuw-ink) !important;
  font-family: var(--tn-tuw-serifs) !important;
  background:
    radial-gradient(circle at 1px 1px, rgba(196, 74, 0, .12) 1px, transparent 1.45px) 0 0 / 14px 14px,
    linear-gradient(180deg, rgba(250, 246, 238, .96), rgba(245, 239, 223, .92)) !important;
  border: 1px solid var(--tn-tuw-line) !important;
  border-top: 3px double var(--tn-tuw-line) !important;
  border-bottom: 3px double var(--tn-tuw-line) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.tn-tuw-page-body:is([data-scheme="dark"], [data-scheme="inverse"]) .tn-tuw-tool,
body.tn-tuw-page-body[data-scheme="auto"][data-l="dark"] .tn-tuw-tool,
body.tn-tuw-page-body[data-scheme="auto"][data-d="dark"] .tn-tuw-tool,
html[data-resolved-scheme="dark"] body.tn-tuw-page-body:not([data-scheme="light"]) .tn-tuw-tool {
  background:
    radial-gradient(circle at 1px 1px, rgba(247, 234, 209, .12) 1px, transparent 1.45px) 0 0 / 14px 14px,
    linear-gradient(180deg, rgba(32, 24, 17, .96), rgba(43, 33, 25, .92)) !important;
}

.tn-tuw-workspace,
.tn-unit-workspace {
  display: grid !important;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr) !important;
  gap: 14px !important;
  align-items: stretch !important;
  margin: 0 !important;
}

.tn-tuw-workspace + .tn-tuw-workspace,
.tn-tuw-water-lower,
.tn-tuw-tool .formula-section,
.tn-tuw-tool .examples-section {
  margin-top: 14px !important;
}

.tn-tuw-pane,
.tn-unit-window,
.tn-tuw-tool :is(.section, .input-section, .output-section, .full-width-section, .formula-section, .examples-section) {
  min-width: 0 !important;
  margin: 0 !important;
  padding: 14px !important;
  color: var(--tn-tuw-ink) !important;
  background: var(--tn-tuw-card) !important;
  border: 1px solid var(--tn-tuw-soft-line) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.tn-tuw-pane-label {
  display: block !important;
  margin: 0 0 11px !important;
  color: var(--tn-tuw-accent) !important;
  font: 700 12px/1.2 var(--tn-tuw-mono) !important;
  letter-spacing: .04em !important;
  text-transform: none !important;
}

html body.wp-theme-intro .tn-tuw-tool h2,
html body.wp-theme-intro .tn-tuw-tool h3,
.tn-tuw-tool .section-title,
.tn-tuw-tool .chart-title,
.tn-tuw-tool .examples-title {
  margin: 0 0 10px !important;
  color: var(--tn-tuw-ink) !important;
  font-family: var(--tn-tuw-serifs) !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  letter-spacing: -.02em !important;
  line-height: 1.25 !important;
}

.tn-tuw-field,
.tn-unit-stack,
.tn-tuw-tool .input-group,
.tn-tuw-tool .info-row,
.tn-tuw-tool .control-row,
.tn-tuw-tool .calc-row {
  display: grid !important;
  gap: 7px !important;
  min-width: 0 !important;
  margin: 0 !important;
  color: var(--tn-tuw-ink) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
}

.tn-tuw-tool label,
.tn-tuw-tool .summary-label,
.tn-tuw-tool .result-label,
.tn-tuw-tool .unit-info,
.tn-tuw-tool .empty-text,
.tn-tuw-mini-copy,
.tn-tuw-disclaimer {
  color: var(--tn-tuw-muted) !important;
  font-family: var(--tn-tuw-serifs) !important;
  line-height: 1.55 !important;
}

.tn-tuw-tool input,
.tn-tuw-tool select,
.tn-tuw-tool textarea,
.tn-tuw-tool .unit-input,
.tn-tuw-tool .unit-select,
.tn-tuw-tool .select-input {
  width: 100% !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 9px 10px !important;
  color: var(--tn-tuw-ink) !important;
  -webkit-text-fill-color: var(--tn-tuw-ink) !important;
  background: rgba(255, 253, 247, .7) !important;
  border: 1px solid var(--tn-tuw-soft-line) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font: 800 15px/1.3 var(--tn-tuw-mono) !important;
  outline: none !important;
}

body.tn-tuw-page-body:is([data-scheme="dark"], [data-scheme="inverse"]) .tn-tuw-tool input,
body.tn-tuw-page-body:is([data-scheme="dark"], [data-scheme="inverse"]) .tn-tuw-tool select,
body.tn-tuw-page-body[data-scheme="auto"][data-l="dark"] .tn-tuw-tool input,
body.tn-tuw-page-body[data-scheme="auto"][data-l="dark"] .tn-tuw-tool select,
body.tn-tuw-page-body[data-scheme="auto"][data-d="dark"] .tn-tuw-tool input,
body.tn-tuw-page-body[data-scheme="auto"][data-d="dark"] .tn-tuw-tool select,
html[data-resolved-scheme="dark"] body.tn-tuw-page-body:not([data-scheme="light"]) .tn-tuw-tool input,
html[data-resolved-scheme="dark"] body.tn-tuw-page-body:not([data-scheme="light"]) .tn-tuw-tool select {
  background: rgba(32, 24, 17, .9) !important;
}

.tn-tuw-tool input:focus,
.tn-tuw-tool select:focus,
.tn-tuw-tool textarea:focus {
  border-color: var(--tn-tuw-accent) !important;
  box-shadow: 0 0 0 2px rgba(196, 74, 0, .14) !important;
}

.tn-tuw-tool button,
.tn-tuw-tool .btn-template,
.tn-tuw-tool .btn-reset,
.tn-tuw-tool .btn-calculate,
.tn-tuw-tool .btn-add-category,
.tn-tuw-tool .btn-analyze,
.tn-tuw-tool .btn-save,
.tn-tuw-tool .btn-load,
.tn-tuw-tool .btn-export,
.tn-tuw-tool .btn-calc,
.tn-tuw-tool .action-button,
.tn-tuw-tool .category-tab,
.tn-tuw-tool .tab-btn,
.tn-tuw-tool .swap-button,
.tn-tuw-tool .favorites-toggle,
.tn-tuw-tool .formula-toggle,
.tn-tuw-tool .favorite-button {
  min-height: 40px !important;
  padding: 9px 12px !important;
  color: var(--tn-tuw-ink) !important;
  -webkit-text-fill-color: var(--tn-tuw-ink) !important;
  background: var(--tn-tuw-button) !important;
  border: 1px solid var(--tn-tuw-line) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font: 800 13px/1.2 var(--tn-tuw-serifs) !important;
  text-align: center !important;
  cursor: pointer !important;
}

.tn-tuw-tool button:hover,
.tn-tuw-tool button:focus-visible {
  background: var(--tn-tuw-button-hover) !important;
}

.tn-tuw-tool .btn-calculate,
.tn-tuw-tool .copy-button,
.tn-tuw-tool .category-tab.active,
.tn-tuw-tool .tab-btn.active {
  color: var(--tn-tuw-paper) !important;
  -webkit-text-fill-color: var(--tn-tuw-paper) !important;
  background: var(--tn-tuw-accent) !important;
  border-color: var(--tn-tuw-accent) !important;
}

.tn-tuw-command-row,
.tn-tuw-tool .template-functions,
.tn-tuw-tool .button-row,
.tn-tuw-tool .category-management,
.tn-tuw-tool .btn-group,
.tn-tuw-tool .data-functions,
.tn-tuw-tool .action-buttons,
.tn-tuw-tool .comparison-tabs,
.tn-tuw-tool .budget-controls {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  align-items: center !important;
  margin: 12px 0 0 !important;
}

.tn-tuw-tool .info-grid,
.tn-tuw-tool .input-grid,
.tn-tuw-tool .summary-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin: 0 !important;
}

.tn-tuw-tool .input-container,
.tn-tuw-tool .unit-input-wrapper {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 0 !important;
  margin: 0 !important;
}

.tn-tuw-tool .input-addon,
.tn-tuw-tool .unit,
.tn-tuw-tool em.unit {
  min-width: 42px !important;
  min-height: 42px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 8px !important;
  color: var(--tn-tuw-muted) !important;
  background: rgba(196, 74, 0, .08) !important;
  border: 1px solid var(--tn-tuw-soft-line) !important;
  border-left: 0 !important;
  font: 800 12px/1 var(--tn-tuw-mono) !important;
  font-style: normal !important;
}

.tn-tuw-notice-strip,
.tn-tuw-disclaimer,
.tn-tuw-mini-copy {
  margin: 12px 0 0 !important;
  padding: 10px 12px !important;
  background: rgba(196, 74, 0, .08) !important;
  border: 1px solid var(--tn-tuw-soft-line) !important;
  color: var(--tn-tuw-muted) !important;
  font-size: 13px !important;
}

/* Travel */
.tn-tuw-tool--travel .tn-tuw-workspace--input-left {
  grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr) !important;
}

.tn-tuw-tool--travel .expense-categories {
  display: grid !important;
  gap: 10px !important;
}

.tn-tuw-tool--travel .category-item,
.tn-tuw-tool--travel .breakdown-row,
.tn-tuw-tool--travel .breakdown-header,
.tn-tuw-tool--travel .ratio-item,
.tn-tuw-tool--travel .category-analysis-item,
.tn-tuw-tool--travel .daily-item,
.tn-tuw-tool--travel .budget-item {
  background: rgba(255, 253, 247, .62) !important;
  border: 1px solid var(--tn-tuw-soft-line) !important;
  border-radius: 0 !important;
  color: var(--tn-tuw-ink) !important;
  box-shadow: none !important;
}

.tn-tuw-tool--travel .category-item {
  padding: 10px !important;
}

.tn-tuw-tool--travel .category-header,
.tn-tuw-tool--travel .expense-item,
.tn-tuw-tool--travel .breakdown-header,
.tn-tuw-tool--travel .breakdown-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) auto auto !important;
  gap: 8px !important;
  align-items: center !important;
}

.tn-tuw-tool--travel .category-header {
  grid-template-columns: minmax(0, 1fr) auto !important;
  margin-bottom: 8px !important;
}

.tn-tuw-tool--travel .expense-items {
  display: grid !important;
  gap: 7px !important;
}

.tn-tuw-tool--travel .summary-item {
  min-height: 96px !important;
  padding: 13px !important;
  display: grid !important;
  align-content: space-between !important;
  background: rgba(255, 253, 247, .58) !important;
  border: 1px solid var(--tn-tuw-soft-line) !important;
}

.tn-tuw-tool--travel .summary-value {
  color: var(--tn-tuw-accent) !important;
  font: 950 25px/1.05 var(--tn-tuw-mono) !important;
  letter-spacing: -.04em !important;
}

.tn-tuw-tool--travel .ratio-bar {
  height: 8px !important;
  background: rgba(196, 74, 0, .12) !important;
  border: 1px solid var(--tn-tuw-soft-line) !important;
}

.tn-tuw-tool--travel .ratio-fill {
  height: 100% !important;
  background: var(--tn-tuw-accent) !important;
}

.tn-tuw-tool--travel .budget-warning,
.tn-tuw-tool--travel .budget-success,
.tn-tuw-tool--travel .message {
  margin-top: 10px !important;
  padding: 9px 10px !important;
  border: 1px solid var(--tn-tuw-soft-line) !important;
  border-radius: 0 !important;
  background: rgba(196, 74, 0, .08) !important;
  color: var(--tn-tuw-ink) !important;
  font-family: var(--tn-tuw-serifs) !important;
}

/* Unit */
.tn-tuw-category-rail {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

.tn-unit-workspace {
  grid-template-columns: minmax(0, 1fr) 78px minmax(0, 1fr) !important;
}

.tn-unit-window {
  display: grid !important;
  gap: 11px !important;
  align-content: start !important;
}

.tn-unit-switch {
  display: grid !important;
  place-items: center !important;
  gap: 8px !important;
}

.tn-unit-switch .swap-button {
  width: 54px !important;
  height: 54px !important;
  min-height: 54px !important;
  padding: 0 !important;
  border-radius: 999px !important;
  font: 900 24px/1 var(--tn-tuw-mono) !important;
}

.tn-unit-switch .equals-sign {
  color: var(--tn-tuw-muted) !important;
  font: 900 24px/1 var(--tn-tuw-mono) !important;
}

.tn-tuw-tool--unit .unit-info,
.tn-tuw-tool--unit #formulaDisplay,
.tn-tuw-tool--unit .favorite-item,
.tn-tuw-tool--unit .example-item,
.tn-tuw-tool--unit .empty-favorites-message {
  padding: 10px !important;
  color: var(--tn-tuw-muted) !important;
  background: rgba(255, 253, 247, .58) !important;
  border: 1px solid var(--tn-tuw-soft-line) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.tn-tuw-tool--unit .favorites-toggle,
.tn-tuw-tool--unit .formula-toggle {
  width: 100% !important;
  display: flex !important;
  justify-content: space-between !important;
}

.tn-tuw-tool--unit .favorites-content,
.tn-tuw-tool--unit .formula-content {
  max-height: none !important;
  overflow: visible !important;
  margin-top: 8px !important;
}

.tn-tuw-tool--unit .examples-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 9px !important;
}

.tn-tuw-tool--unit .example-title,
.tn-tuw-tool--unit .formula-math {
  color: var(--tn-tuw-ink) !important;
  font-weight: 900 !important;
}

.tn-tuw-tool--unit .favorite-button {
  width: auto !important;
  min-height: 28px !important;
  padding: 4px 8px !important;
  margin-left: 8px !important;
}

.tn-tuw-tool--unit .notification {
  opacity: 0;
  pointer-events: none;
  margin-top: 8px !important;
  padding: 8px 10px !important;
  background: rgba(196, 74, 0, .08) !important;
  border: 1px solid var(--tn-tuw-soft-line) !important;
  color: var(--tn-tuw-ink) !important;
}

.tn-tuw-tool--unit .notification.show {
  opacity: 1;
}

/* Water */
.tn-tuw-tool--water .gender-toggle {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin: 0 0 12px !important;
}

.tn-tuw-tool--water .gender-toggle label {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  min-height: 42px !important;
  padding: 8px !important;
  background: rgba(255, 253, 247, .58) !important;
  border: 1px solid var(--tn-tuw-soft-line) !important;
  color: var(--tn-tuw-ink) !important;
}

.tn-tuw-tool--water .result-summary,
.tn-tuw-tool--water .important-result,
.tn-tuw-tool--water .chart-container,
.tn-tuw-tool--water .benefit-card,
.tn-tuw-tool--water .time-point,
.tn-tuw-tool--water .food-card {
  background: rgba(255, 253, 247, .58) !important;
  border: 1px solid var(--tn-tuw-soft-line) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--tn-tuw-ink) !important;
}

.tn-tuw-tool--water .result-summary,
.tn-tuw-tool--water .important-result {
  padding: 12px !important;
  margin: 0 0 12px !important;
}

.tn-tuw-tool--water .result-row {
  display: flex !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 7px 0 !important;
  border-bottom: 1px solid var(--tn-tuw-soft-line) !important;
}

.tn-tuw-tool--water .result-row:last-child {
  border-bottom: 0 !important;
}

.tn-tuw-tool--water .result-highlight,
.tn-tuw-tool--water .result-value,
.tn-tuw-tool--water .recommended-water,
.tn-tuw-tool--water .current-water {
  color: var(--tn-tuw-accent) !important;
  font: 950 18px/1.2 var(--tn-tuw-mono) !important;
}

.tn-tuw-tool--water .chart-container {
  height: 250px !important;
  padding: 10px !important;
}

.tn-tuw-water-lower {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 14px !important;
}

.tn-tuw-tool--water .benefits-container,
.tn-tuw-tool--water .schedule-container .timeline,
.tn-tuw-tool--water .food-container {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

.tn-tuw-tool--water .benefit-card,
.tn-tuw-tool--water .time-point,
.tn-tuw-tool--water .food-card {
  padding: 12px !important;
}

.tn-tuw-tool--water .benefit-icon,
.tn-tuw-tool--water .food-icon {
  font-size: 0 !important;
  line-height: 0 !important;
}

.tn-tuw-tool--water .benefit-title,
.tn-tuw-tool--water .food-name,
.tn-tuw-tool--water .time-description {
  color: var(--tn-tuw-ink) !important;
  font-weight: 900 !important;
}

.tn-tuw-tool--water .water-amount,
.tn-tuw-tool--water .food-water-content {
  color: var(--tn-tuw-accent) !important;
  font: 900 14px/1.2 var(--tn-tuw-mono) !important;
}

/* Lower common */
.tn-tool-meta-row {
  margin: 12px 0 16px !important;
  color: var(--tn-tuw-muted) !important;
  font: 700 12px/1.4 var(--tn-tuw-mono) !important;
  letter-spacing: .02em !important;
}

.tn-design-note {
  display: grid;
  grid-template-columns: minmax(220px, .72fr) minmax(0, 1fr);
  gap: 20px;
  align-items: stretch;
  margin: 0 0 28px;
  padding: 16px;
  color: var(--tn-tuw-ink);
  background: linear-gradient(180deg, rgba(250, 246, 238, .88), rgba(245, 239, 223, .78));
  border: 1px solid var(--tn-tuw-line);
  border-top: 3px double var(--tn-tuw-line);
  border-bottom: 3px double var(--tn-tuw-line);
}

body.tn-tuw-page-body:is([data-scheme="dark"], [data-scheme="inverse"]) .tn-design-note,
body.tn-tuw-page-body[data-scheme="auto"][data-l="dark"] .tn-design-note,
body.tn-tuw-page-body[data-scheme="auto"][data-d="dark"] .tn-design-note,
html[data-resolved-scheme="dark"] body.tn-tuw-page-body:not([data-scheme="light"]) .tn-design-note {
  background: linear-gradient(180deg, rgba(32, 24, 17, .92), rgba(43, 33, 25, .82));
}

.tn-design-note strong {
  display: grid;
  align-content: center;
  gap: 10px;
  margin: 0;
  color: var(--tn-tuw-ink);
  font-size: clamp(24px, 3vw, 36px);
  line-height: .98;
  letter-spacing: -.05em;
}

.tn-design-note strong span {
  color: var(--tn-tuw-accent);
  font: 700 12px/1 var(--tn-tuw-mono);
  letter-spacing: .04em;
}

.tn-design-note ul {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.tn-design-note li {
  padding: 12px !important;
  background: var(--tn-tuw-card);
  border: 1px solid var(--tn-tuw-soft-line);
  color: var(--tn-tuw-muted);
  font-size: 13px;
  line-height: 1.55;
}

.tn-design-note b {
  display: block;
  margin-bottom: 6px;
  color: var(--tn-tuw-ink);
}

.tn-article-panel {
  margin: 0 0 34px;
  padding: 18px;
  color: var(--tn-tuw-ink);
  background: var(--tn-tuw-paper);
  border: 1px solid var(--tn-tuw-line);
  border-top: 3px double var(--tn-tuw-line);
  border-bottom: 3px double var(--tn-tuw-line);
}

body.tn-tuw-page-body:is([data-scheme="dark"], [data-scheme="inverse"]) .tn-article-panel,
body.tn-tuw-page-body[data-scheme="auto"][data-l="dark"] .tn-article-panel,
body.tn-tuw-page-body[data-scheme="auto"][data-d="dark"] .tn-article-panel,
html[data-resolved-scheme="dark"] body.tn-tuw-page-body:not([data-scheme="light"]) .tn-article-panel {
  background: var(--tn-tuw-paper);
}

.tn-article-title {
  margin-bottom: 18px;
}

.tn-mini-mark {
  display: inline-block;
  margin-bottom: 10px;
  color: var(--tn-tuw-accent);
  font: 700 12px/1 var(--tn-tuw-mono);
  letter-spacing: .08em;
}

html body.wp-theme-intro .tn-article-panel h2 {
  margin: 0 !important;
  color: var(--tn-tuw-ink) !important;
  font-family: var(--tn-tuw-serifs) !important;
  font-size: clamp(24px, 3.2vw, 38px) !important;
  font-weight: 950 !important;
  letter-spacing: -.045em !important;
  line-height: 1.08 !important;
}

.tn-intro-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-bottom: 18px;
}

.tn-article-panel p,
.tn-article-panel li {
  color: var(--tn-tuw-muted) !important;
  font-size: 15px;
  line-height: 1.75;
  word-break: keep-all;
}

.tn-content-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.tn-info-card {
  padding: 15px;
  background: var(--tn-tuw-card);
  border: 1px solid var(--tn-tuw-soft-line);
}

.tn-info-card--wide {
  grid-column: 1 / -1;
}

html body.wp-theme-intro .tn-info-card h3,
.tn-faq-item h3 {
  margin: 0 0 9px !important;
  color: var(--tn-tuw-ink) !important;
  font-family: var(--tn-tuw-serifs) !important;
  font-size: 17px !important;
  font-weight: 900 !important;
  line-height: 1.3 !important;
}

.tn-faq-list {
  display: grid;
  gap: 10px;
}

.tn-faq-item {
  padding: 12px;
  background: rgba(255, 253, 247, .54);
  border: 1px solid var(--tn-tuw-soft-line);
}

.tn-source-note {
  margin-top: 14px !important;
}

.tn-source-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 10px;
}

.tn-source-links span,
.tn-source-link {
  padding: 7px 9px;
  color: var(--tn-tuw-muted) !important;
  background: rgba(196, 74, 0, .08);
  border: 1px solid var(--tn-tuw-soft-line);
  font: 700 12px/1.2 var(--tn-tuw-mono);
  text-decoration: none !important;
}

body.tn-tuw-page-body :is(.tn-tuw-pane, .tn-unit-window, .tn-info-card, .tn-faq-item, .tn-design-note li, .summary-item, .category-item, .benefit-card, .time-point, .food-card) {
  box-shadow: none !important;
}

body.tn-tuw-page-body:is([data-scheme="dark"], [data-scheme="inverse"]) .tn-tuw-page :is(.tn-tuw-pane, .tn-unit-window, .tn-info-card, .tn-faq-item, .tn-design-note li, .summary-item, .category-item, .benefit-card, .time-point, .food-card, .chart-container),
body.tn-tuw-page-body[data-scheme="auto"][data-l="dark"] .tn-tuw-page :is(.tn-tuw-pane, .tn-unit-window, .tn-info-card, .tn-faq-item, .tn-design-note li, .summary-item, .category-item, .benefit-card, .time-point, .food-card, .chart-container),
body.tn-tuw-page-body[data-scheme="auto"][data-d="dark"] .tn-tuw-page :is(.tn-tuw-pane, .tn-unit-window, .tn-info-card, .tn-faq-item, .tn-design-note li, .summary-item, .category-item, .benefit-card, .time-point, .food-card, .chart-container),
html[data-resolved-scheme="dark"] body.tn-tuw-page-body:not([data-scheme="light"]) .tn-tuw-page :is(.tn-tuw-pane, .tn-unit-window, .tn-info-card, .tn-faq-item, .tn-design-note li, .summary-item, .category-item, .benefit-card, .time-point, .food-card, .chart-container) {
  background: var(--tn-tuw-card) !important;
}

@media (min-width: 1280px) {
  .tn-side-rails {
    position: fixed;
    inset: 160px 0 auto 0;
    display: block;
    pointer-events: none;
    z-index: 0;
  }

  .tn-side-ad {
    position: fixed;
    top: 160px;
    width: 300px;
    min-height: 600px;
    pointer-events: auto;
  }

  .tn-side-ad--left {
    left: max(12px, calc((100vw - 1180px) / 2 - 328px));
  }

  .tn-side-ad--right {
    right: max(12px, calc((100vw - 1180px) / 2 - 328px));
  }
}

@media (max-width: 860px) {
  .tn-tuw-page {
    width: min(100%, calc(100vw - 8px));
    margin-top: 8px;
  }

  .tn-hero {
    margin-bottom: 32px;
  }

  .tn-tuw-tool {
    padding: 10px !important;
  }

  .tn-tuw-workspace,
  .tn-unit-workspace,
  .tn-tuw-tool--travel .tn-tuw-workspace--input-left,
  .tn-tuw-tool .info-grid,
  .tn-tuw-tool .input-grid,
  .tn-tuw-tool .summary-grid,
  .tn-tuw-tool--unit .examples-grid,
  .tn-tuw-tool--water .benefits-container,
  .tn-tuw-tool--water .schedule-container .timeline,
  .tn-tuw-tool--water .food-container,
  .tn-design-note,
  .tn-design-note ul,
  .tn-intro-columns,
  .tn-content-grid {
    grid-template-columns: 1fr !important;
  }

  .tn-unit-switch {
    grid-template-columns: 1fr auto 1fr !important;
    min-height: 56px;
  }

  .tn-unit-switch .swap-button {
    transform: rotate(90deg);
  }

  .tn-ad--below {
    grid-template-columns: minmax(0, 336px);
  }

  .tn-tuw-tool--travel .category-header,
  .tn-tuw-tool--travel .expense-item,
  .tn-tuw-tool--travel .breakdown-header,
  .tn-tuw-tool--travel .breakdown-row {
    grid-template-columns: 1fr !important;
  }
}
