@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,600;1,400&family=Noto+Sans+SC:wght@300;400;500&family=Noto+Serif+SC:wght@400;600;700&display=swap');

/* ------------------------------------------------------------------ */
/* Design tokens — Solarized light + warm sepia dark                  */
/* Override DaisyUI's emerald/forest themes in place.                 */
/* ------------------------------------------------------------------ */

:root[data-theme="emerald"] {
  --color-base-100: #fdf6e3;
  --color-base-200: #eee8d5;
  --color-base-300: #d3c9b1;
  --color-base-content: #073642;
  --color-primary: #268bd2;
  --color-primary-content: #ffffff;
  --color-secondary: #2aa198;
  --color-secondary-content: #ffffff;
  --color-accent: #268bd2;
  --color-accent-content: #ffffff;
  --color-neutral: #586e75;
  --color-neutral-content: #fdf6e3;

  --blog-bg:      #fdf6e3;
  --blog-surface: #eee8d5;
  --blog-border:  #d3c9b1;
  --blog-muted:   #93a1a1;
  --blog-body:    #586e75;
  --blog-strong:  #073642;
  --blog-accent:  #268bd2;
  --blog-tag:     #2aa198;
  --blog-tag-bg:  rgba(42, 161, 152, .10);
  --blog-tag-bd:  rgba(42, 161, 152, .20);
  --blog-nav-bg:  rgba(253, 246, 227, .95);
  --blog-shadow:  0 8px 24px rgba(7, 54, 66, .08);
}

:root[data-theme="forest"] {
  --color-base-100: #1c1710;
  --color-base-200: #252018;
  --color-base-300: #3a3020;
  --color-base-content: #e8dcc8;
  --color-primary: #cb8a50;
  --color-primary-content: #1c1710;
  --color-secondary: #7da87d;
  --color-secondary-content: #1c1710;
  --color-accent: #cb8a50;
  --color-accent-content: #1c1710;
  --color-neutral: #c8b99a;
  --color-neutral-content: #1c1710;

  --blog-bg:      #1c1710;
  --blog-surface: #252018;
  --blog-border:  #3a3020;
  --blog-muted:   #6b5e48;
  --blog-body:    #c8b99a;
  --blog-strong:  #e8dcc8;
  --blog-accent:  #cb8a50;
  --blog-tag:     #7da87d;
  --blog-tag-bg:  rgba(125, 168, 125, .12);
  --blog-tag-bd:  rgba(125, 168, 125, .22);
  --blog-nav-bg:  rgba(28, 23, 16, .95);
  --blog-shadow:  0 14px 30px rgba(0, 0, 0, .40);
}

/* ------------------------------------------------------------------ */
/* Typography                                                         */
/* ------------------------------------------------------------------ */

body {
  font-family: 'Noto Sans SC', system-ui, -apple-system, sans-serif;
  font-weight: 300;
  color: var(--blog-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, .card-title, .dts-serif {
  font-family: 'Noto Serif SC', 'Lora', Georgia, serif;
  font-weight: 600;
  color: var(--blog-strong);
  letter-spacing: -.01em;
}

/* ------------------------------------------------------------------ */
/* Home page                                                          */
/* ------------------------------------------------------------------ */

.dts-hero {
  max-width: 1100px;
  margin: 0 auto;
  padding: 52px 24px 36px;
}

.dts-hero__kicker {
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 13px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--blog-muted);
  margin-bottom: 10px;
}

.dts-hero__title {
  font-family: 'Lora', 'Noto Serif SC', serif;
  font-weight: 600;
  font-size: clamp(30px, 5vw, 38px);
  line-height: 1.2;
  letter-spacing: -.02em;
  color: var(--blog-strong);
}

.dts-hero__title em {
  font-style: italic;
  font-weight: 400;
}

.dts-hero__rule {
  width: 40px;
  height: 2px;
  background: var(--blog-accent);
  margin-top: 20px;
  border-radius: 2px;
}

.dts-home-section {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 24px;
}

.dts-section-label {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 28px;
}

.dts-section-label__text {
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 13px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--blog-muted);
  flex-shrink: 0;
}

.dts-section-label__rule {
  flex: 1;
  height: 1px;
  background: var(--blog-border);
}

.dts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 24px;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 24px 80px;
}

/* ------------------------------------------------------------------ */
/* Post card (summary)                                                */
/* ------------------------------------------------------------------ */

.dts-card {
  display: flex;
  flex-direction: column;
  background: var(--blog-surface);
  border: 1px solid var(--blog-border);
  border-radius: 10px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.dts-card:hover {
  transform: translateY(-2px);
  border-color: var(--blog-muted);
  box-shadow: var(--blog-shadow);
}

.dts-card__media {
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--blog-border);
}

.dts-card__media img,
.dts-card__media picture,
.dts-card__media source {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .4s ease;
}

.dts-card:hover .dts-card__media img {
  transform: scale(1.04);
}

.dts-card__body {
  padding: 18px 20px 20px;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.dts-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.dts-tag {
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 11px;
  letter-spacing: .02em;
  color: var(--blog-tag);
  background: var(--blog-tag-bg);
  padding: 2px 7px;
  border-radius: 10px;
  text-decoration: none;
}

.dts-card__title {
  font-family: 'Noto Serif SC', 'Lora', serif;
  font-weight: 600;
  font-size: 17px;
  line-height: 1.4;
  color: var(--blog-strong);
  margin: 0;
  transition: color .15s ease;
}

.dts-card:hover .dts-card__title {
  color: var(--blog-accent);
}

.dts-card__excerpt {
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 14px;
  line-height: 1.7;
  color: var(--blog-body);
  flex: 1;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0;
}

.dts-card__meta {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 4px;
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 12px;
  color: var(--blog-muted);
}

.dts-card__meta-sep {
  opacity: .6;
}

/* ------------------------------------------------------------------ */
/* Pagination — match design (outline buttons, accent for active)     */
/* ------------------------------------------------------------------ */

.dts-paginator {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin: 56px auto 0;
  max-width: 1100px;
  padding: 0 24px;
}

.dts-paginator a,
.dts-paginator button {
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 13px;
  height: 36px;
  padding: 0 16px;
  border-radius: 6px;
  border: 1px solid var(--blog-border);
  background: transparent;
  color: var(--blog-body);
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: border-color .15s ease, color .15s ease;
}

.dts-paginator a:hover {
  border-color: var(--blog-muted);
  color: var(--blog-strong);
}

.dts-paginator [disabled] {
  opacity: .5;
  cursor: not-allowed;
}

/* ------------------------------------------------------------------ */
/* Post page                                                          */
/* ------------------------------------------------------------------ */

.dts-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 2px;
  width: 0;
  background: var(--blog-accent);
  z-index: 200;
  transition: width .1s linear;
}

.dts-post-hero {
  position: relative;
  width: 100%;
  height: 420px;
  overflow: hidden;
}

.dts-post-hero img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 40%;
  display: block;
}

.dts-post-hero__fade {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, transparent 30%, var(--blog-bg) 100%);
}

.dts-post {
  max-width: 860px;
  margin: 0 auto;
  padding: 0 24px 80px;
  color: var(--blog-body);
}

.dts-post:not(.dts-post--with-hero) {
  padding-top: 60px;
}

.dts-post--with-hero {
  margin-top: -80px;
  position: relative;
  z-index: 2;
}

.dts-post-header {
  margin-bottom: 48px;
}

.dts-post-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}

.dts-post-title {
  font-family: 'Noto Serif SC', 'Lora', serif;
  font-weight: 700;
  font-size: clamp(24px, 4vw, 30px);
  line-height: 1.35;
  letter-spacing: -.01em;
  color: var(--blog-strong);
  margin: 0 0 20px;
}

.dts-post-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--blog-border);
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 13px;
  color: var(--blog-muted);
}

.dts-post-meta__author {
  display: flex;
  align-items: center;
  gap: 12px;
}

.dts-post-meta__author img,
.dts-post-meta__author .avatar img {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 2px solid var(--blog-border);
  object-fit: cover;
}

.dts-post-meta__primary p {
  margin: 0;
  font-size: 12px;
  color: var(--blog-muted);
}

.dts-post-meta__primary p + p {
  margin-top: 2px;
}

.dts-post-meta__share {
  margin-left: auto;
  display: flex;
  gap: 8px;
}

.dts-post-meta__share a,
.dts-post-meta__share button {
  font-size: 11px;
  color: var(--blog-muted);
  background: transparent;
  border: 1px solid var(--blog-border);
  border-radius: 6px;
  padding: 5px 10px;
  cursor: pointer;
  text-decoration: none;
  font-family: 'Noto Sans SC', sans-serif;
  transition: color .15s ease, border-color .15s ease;
}

.dts-post-meta__share a:hover,
.dts-post-meta__share button:hover {
  color: var(--blog-strong);
  border-color: var(--blog-muted);
}

.dts-post-layout {
  display: flex;
  gap: 56px;
  align-items: flex-start;
}

.dts-post-layout > .dts-prose {
  flex: 1;
  min-width: 0;
}

.dts-tag--bordered {
  padding: 4px 12px;
  border-radius: 12px;
  border: 1px solid var(--blog-tag-bd);
  transition: opacity .15s ease;
}

.dts-tag--bordered:hover {
  opacity: .7;
}

.dts-post-tags--bottom {
  gap: 8px;
  margin-top: 32px;
  margin-bottom: 0;
}

/* ------------------------------------------------------------------ */
/* Prose                                                              */
/* ------------------------------------------------------------------ */

.dts-prose {
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 17px;
  line-height: 1.9;
  color: var(--blog-body);
  font-weight: 300;
}

.dts-prose p {
  margin: 0 0 1.4em;
  color: var(--blog-body);
}

.dts-prose h2 {
  font-family: 'Noto Serif SC', 'Lora', serif;
  font-weight: 600;
  font-size: 1.4em;
  line-height: 1.3;
  color: var(--blog-strong);
  margin: 2.2em 0 .8em;
}

.dts-prose h3 {
  font-family: 'Noto Serif SC', 'Lora', serif;
  font-weight: 600;
  font-size: 1.15em;
  color: var(--blog-strong);
  margin: 1.8em 0 .6em;
}

.dts-prose h4 {
  font-family: 'Noto Serif SC', 'Lora', serif;
  font-weight: 600;
  font-size: 1em;
  color: var(--blog-strong);
  margin: 1.6em 0 .5em;
}

.dts-prose blockquote {
  border-left: 3px solid var(--blog-muted);
  padding: 4px 0 4px 20px;
  margin: 1.6em 0;
  color: var(--blog-muted);
  font-style: italic;
}

.dts-prose blockquote p {
  color: var(--blog-muted);
  margin: 0;
}

.dts-prose strong {
  color: var(--blog-strong);
  font-weight: 500;
}

.dts-prose a {
  color: var(--blog-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.dts-prose img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  margin: 1.6em 0;
}

.dts-prose hr,
.dts-prose__rule {
  border: none;
  border-top: 1px solid var(--blog-muted);
  opacity: .3;
  margin: 2.5em 0;
}

.dts-prose ul,
.dts-prose ol {
  margin: 1.2em 0;
  padding-left: 1.4em;
}

.dts-prose li {
  margin: .4em 0;
}

.dts-prose code {
  font-family: ui-monospace, 'SF Mono', Menlo, monospace;
  font-size: .9em;
  background: var(--blog-surface);
  border: 1px solid var(--blog-border);
  border-radius: 4px;
  padding: 1px 6px;
}

.dts-prose pre {
  background: var(--blog-surface);
  border: 1px solid var(--blog-border);
  border-radius: 8px;
  padding: 14px 16px;
  overflow-x: auto;
  margin: 1.4em 0;
}

.dts-prose pre code {
  background: transparent;
  border: none;
  padding: 0;
  font-size: .9em;
}

.dts-prose table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.4em 0;
  font-size: .95em;
}

.dts-prose th,
.dts-prose td {
  border: 1px solid var(--blog-border);
  padding: 8px 12px;
}

.dts-prose th {
  background: var(--blog-surface);
  color: var(--blog-strong);
  font-weight: 500;
}

/* ------------------------------------------------------------------ */
/* TOC sidebar                                                        */
/* ------------------------------------------------------------------ */

.dts-toc {
  position: sticky;
  top: 80px;
  width: 200px;
  flex-shrink: 0;
  font-family: 'Noto Sans SC', sans-serif;
}

.dts-toc__label {
  font-size: 11px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--blog-muted);
  margin: 0 0 8px;
}

.dts-toc nav#TableOfContents {
  display: block;
}

.dts-toc nav#TableOfContents ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.dts-toc nav#TableOfContents ul ul {
  margin-top: 4px;
  padding-left: 12px;
}

.dts-toc nav#TableOfContents li {
  list-style: none;
}

.dts-toc nav#TableOfContents a {
  display: block;
  font-size: 12px;
  line-height: 1.5;
  color: var(--blog-muted);
  text-decoration: none;
  border-left: 2px solid var(--blog-border);
  padding: 2px 0 2px 10px;
  transition: color .2s ease, border-color .2s ease;
}

.dts-toc nav#TableOfContents a:hover {
  color: var(--blog-body);
}

.dts-toc nav#TableOfContents a.menu-active {
  color: var(--blog-accent);
  border-left-color: var(--blog-accent);
  font-weight: 500;
}

@media (max-width: 1023px) {
  .dts-toc { display: none; }
  .dts-post-layout { display: block; }
}

/* ------------------------------------------------------------------ */
/* Prev/Next                                                          */
/* ------------------------------------------------------------------ */

.dts-prevnext {
  display: flex;
  gap: 16px;
  margin-top: 40px;
  padding-top: 32px;
  border-top: 1px solid var(--blog-border);
}

.dts-prevnext__item {
  flex: 1;
  min-width: 0;
  padding: 20px 24px;
  background: var(--blog-surface);
  border: 1px solid var(--blog-border);
  border-radius: 10px;
  text-decoration: none;
  color: inherit;
  transition: border-color .2s ease;
}

.dts-prevnext__item:hover {
  border-color: var(--blog-muted);
}

.dts-prevnext__item--right {
  text-align: right;
}

.dts-prevnext__label {
  display: block;
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 11px;
  color: var(--blog-muted);
  margin-bottom: 6px;
}

.dts-prevnext__title {
  display: block;
  font-family: 'Noto Serif SC', 'Lora', serif;
  font-size: 14px;
  line-height: 1.4;
  color: var(--blog-strong);
}

.dts-prevnext__spacer {
  flex: 1;
}

@media (max-width: 640px) {
  .dts-prevnext { flex-direction: column; }
  .dts-prevnext__item--right { text-align: left; }
  .dts-prevnext__spacer { display: none; }
}

/* Comments section spacing */
.dts-post-comments {
  max-width: 100%;
  margin-top: 40px;
  padding-top: 32px;
  border-top: 1px solid var(--blog-border);
}

/* ------------------------------------------------------------------ */
/* Existing layout fixes — preserved                                  */
/* ------------------------------------------------------------------ */

.flip-container {
  height: auto;
  min-height: 0;
  perspective: none;
}

.flip-container .flipper {
  position: static;
  height: auto;
  transform: none !important;
}

.flip-container .front {
  position: static;
  height: auto;
  transform: none !important;
  backface-visibility: visible;
}

.flip-container .back {
  display: none;
}

@media (min-width: 1024px) {
  .lg\:grid-cols-4 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

#dream-single-post-main {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}

#dream-single-post-content .upload-gallery,
#dream-single-post-content div[style*="flex-wrap: wrap"] {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 12px !important;
  row-gap: 12px !important;
  justify-content: stretch !important;
}

#dream-single-post-content .upload-gallery a,
#dream-single-post-content div[style*="flex-wrap: wrap"] > a {
  width: 100% !important;
  margin: 0 !important;
}

#dream-single-post-content .upload-gallery img,
#dream-single-post-content div[style*="flex-wrap: wrap"] img {
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
}

/* ------------------------------------------------------------------ */
/* Shorts timeline — re-themed to design tokens                       */
/* ------------------------------------------------------------------ */

.shorts-timeline {
  list-style: none;
  margin: 0;
  padding: 0 0 0 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 1.4rem;
  position: relative;
}

.shorts-timeline::before {
  content: '';
  position: absolute;
  top: 0.35rem;
  bottom: 0.35rem;
  left: 0.5rem;
  width: 2px;
  background: linear-gradient(180deg, var(--blog-accent), transparent);
  opacity: .45;
  border-radius: 999px;
}

.shorts-item {
  position: relative;
  border: 1px solid var(--blog-border);
  border-radius: 18px;
  padding: 1.1rem 1.3rem;
  background: var(--blog-surface);
  box-shadow: var(--blog-shadow);
}

.shorts-item::before {
  content: '';
  position: absolute;
  top: 1.2rem;
  left: -1.25rem;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--blog-accent);
  box-shadow: 0 0 0 4px var(--blog-tag-bg);
}

.shorts-meta {
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 0.78rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--blog-muted);
  margin-bottom: 0.5rem;
}

.shorts-body {
  font-size: 1rem;
  line-height: 1.7;
  color: var(--blog-body);
  white-space: normal;
}

.shorts-body p {
  margin: 0;
}

.shorts-body p + p {
  margin-top: 0.6rem;
}

.posts-timeline.timeline-vertical > li > hr {
  width: 2px;
  background: linear-gradient(180deg, var(--blog-accent), transparent);
  opacity: .55;
}

.posts-timeline .timeline-middle {
  position: relative;
  width: 20px;
  height: 20px;
  margin: 0.5rem 2rem;
}

.posts-timeline .timeline-middle::before {
  content: '';
  position: absolute;
  inset: 0;
  margin: auto;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--blog-accent);
  box-shadow: 0 0 0 4px var(--blog-tag-bg);
}

.posts-timeline .timeline-middle ion-icon {
  display: none;
}

/* ------------------------------------------------------------------ */
/* Comments widget                                                    */
/* ------------------------------------------------------------------ */

.comments-widget {
  margin-top: 24px;
}

.comments-form {
  display: grid;
  gap: 12px;
  margin-bottom: 20px;
}

.comments-form form {
  display: grid;
  gap: 12px;
}

.comments-fields {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.comments-form input,
.comments-form textarea {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--blog-border);
  border-radius: 10px;
  background: var(--blog-surface);
  color: var(--blog-strong);
  font-family: 'Noto Sans SC', sans-serif;
}

.comments-form textarea {
  min-height: 120px;
  resize: vertical;
}

.comments-hp {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.comments-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.comments-actions button {
  border: none;
  border-radius: 999px;
  padding: 8px 16px;
  background: var(--blog-accent);
  color: var(--color-primary-content);
  cursor: pointer;
  font-family: 'Noto Sans SC', sans-serif;
}

.comments-actions button[data-comments-cancel] {
  background: transparent;
  color: inherit;
  border: 1px solid var(--blog-border);
}

.comments-status {
  font-size: 0.9em;
  opacity: 0.8;
}

.comments-status[data-state="error"] {
  color: #dc322f;
}

.comments-list {
  display: grid;
  gap: 16px;
}

.comments-item {
  padding-top: 16px;
  border-top: 1px solid var(--blog-border);
}

.comments-meta {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
  font-size: 0.9em;
}

.comments-meta a {
  color: inherit;
  text-decoration: none;
}

.comments-date {
  opacity: 0.7;
}

.comments-reply-button {
  background: transparent;
  border: none;
  padding: 0;
  color: var(--blog-accent);
  cursor: pointer;
  font-size: 0.85em;
}

.comments-body {
  margin-top: 6px;
  line-height: 1.6;
}

.comments-reply {
  font-size: 0.9em;
  color: var(--blog-accent);
  min-height: 1.2em;
}

.comments-empty {
  opacity: 0.7;
}

.comments-depth-1 {
  margin-left: 1.25rem;
}

.comments-depth-2 {
  margin-left: 2.5rem;
}

.comments-depth-3 {
  margin-left: 3.75rem;
}

@media (max-width: 600px) {
  .comments-depth-1,
  .comments-depth-2,
  .comments-depth-3 {
    margin-left: 0.75rem;
  }
}

/* ======================================================================== */
/* Archives page                                                            */
/* ======================================================================== */
.dts-archive {
  max-width: 860px;
  margin: 0 auto;
  padding: 52px 24px 100px;
}

.dts-archive__header {
  margin-bottom: 48px;
}

.dts-archive__kicker {
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--blog-muted);
  margin-bottom: 10px;
}

.dts-archive__title {
  font-family: 'Lora', 'Noto Serif SC', serif;
  font-weight: 600;
  font-size: 34px;
  color: var(--blog-strong);
  letter-spacing: -0.02em;
  line-height: 1.2;
  margin: 0;
}

.dts-archive__count {
  margin-top: 12px;
  font-size: 13px;
  color: var(--blog-muted);
  font-family: 'Noto Sans SC', sans-serif;
}

.dts-archive__rule {
  width: 32px;
  height: 2px;
  background: var(--blog-accent);
  border-radius: 2px;
  margin-top: 18px;
}

.dts-archive__intro {
  margin-top: 18px;
  font-size: 14px;
  color: var(--blog-body);
  line-height: 1.7;
}

.dts-archive__searchbox {
  margin: 24px 0 8px;
}

.dts-archive__suggestions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 28px;
}

.dts-archive__suggestions-label {
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--blog-muted);
  margin-right: 4px;
}

.dts-archive__group {
  margin-bottom: 44px;
}

.dts-archive__group-head {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 4px;
}

.dts-archive__year {
  font-family: 'Lora', 'Noto Serif SC', serif;
  font-weight: 600;
  font-size: 22px;
  color: var(--blog-strong);
  letter-spacing: -0.01em;
  flex-shrink: 0;
  margin: 0;
}

.dts-archive__group-rule {
  flex: 1;
  height: 1px;
  background: var(--blog-border);
}

.dts-archive__group-count {
  font-size: 11px;
  color: var(--blog-muted);
  font-family: 'Noto Sans SC', sans-serif;
  flex-shrink: 0;
}

.dts-archive__list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.dts-archive__row {
  list-style: none;
}

.dts-archive__link {
  display: flex;
  align-items: baseline;
  gap: 20px;
  padding: 13px 0;
  border-bottom: 1px solid var(--blog-border);
  text-decoration: none;
  transition: color 0.15s ease;
}

.dts-archive__row:last-child .dts-archive__link {
  border-bottom: none;
}

.dts-archive__date {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  color: var(--blog-muted);
  flex-shrink: 0;
  width: 40px;
  letter-spacing: -0.01em;
}

.dts-archive__row-title {
  font-family: 'Noto Serif SC', 'Lora', serif;
  font-size: 15px;
  color: var(--blog-strong);
  flex: 1;
  line-height: 1.5;
  transition: color 0.15s ease;
}

.dts-archive__link:hover .dts-archive__row-title {
  color: var(--blog-accent);
}

.dts-archive__tags {
  display: flex;
  gap: 5px;
  flex-shrink: 0;
}

.dts-archive__tag {
  font-size: 10px;
  color: var(--blog-tag);
  background: var(--blog-tag-bg);
  padding: 1px 7px;
  border-radius: 8px;
  font-family: 'Noto Sans SC', sans-serif;
}

.dts-archive__readtime {
  font-size: 11px;
  color: var(--blog-muted);
  font-family: 'Noto Sans SC', sans-serif;
  flex-shrink: 0;
}

@media (max-width: 600px) {
  .dts-archive { padding: 32px 16px 60px; }
  .dts-archive__title { font-size: 28px; }
  .dts-archive__link { flex-wrap: wrap; gap: 10px 12px; }
  .dts-archive__row-title { flex-basis: 100%; order: 2; }
  .dts-archive__date { order: 1; }
  .dts-archive__tags { order: 3; }
  .dts-archive__readtime { order: 4; margin-left: auto; }
}

/* ======================================================================== */
/* About page                                                               */
/* ======================================================================== */
.dts-about {
  max-width: 680px;
  margin: 0 auto;
  padding: 60px 24px 100px;
}

.dts-about__profile {
  display: flex;
  gap: 32px;
  align-items: flex-start;
  margin-bottom: 52px;
}

.dts-about__avatar {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  flex-shrink: 0;
  background: var(--blog-surface);
  border: 3px solid var(--blog-border);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--blog-muted);
  font-family: 'Lora', serif;
  font-size: 36px;
  letter-spacing: -0.02em;
}

.dts-about__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.dts-about__identity {
  padding-top: 8px;
  flex: 1;
  min-width: 0;
}

.dts-about__name {
  font-family: 'Lora', 'Noto Serif SC', serif;
  font-weight: 600;
  font-size: 28px;
  color: var(--blog-strong);
  letter-spacing: -0.02em;
  line-height: 1.2;
  margin: 0 0 8px;
}

.dts-about__role {
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 14px;
  color: var(--blog-muted);
  line-height: 1.6;
  margin: 0;
}

.dts-about__links {
  display: flex;
  gap: 8px;
  margin-top: 16px;
  flex-wrap: wrap;
}

.dts-about__link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 12px;
  color: var(--blog-body);
  text-decoration: none;
  background: var(--blog-surface);
  border: 1px solid var(--blog-border);
  padding: 4px 12px;
  border-radius: 20px;
  transition: color 0.15s ease, border-color 0.15s ease;
}

.dts-about__link:hover {
  color: var(--blog-accent);
  border-color: var(--blog-accent);
}

.dts-about__link-icon {
  font-size: 10px;
}

.dts-about__divider {
  height: 1px;
  background: var(--blog-border);
  margin-bottom: 44px;
}

.dts-about__prose {
  color: var(--blog-body);
  font-size: 16px;
}

.dts-about__section + .dts-about__section { margin-top: 16px; }

.dts-about__prose h2 {
  font-family: 'Noto Serif SC', 'Lora', serif;
  font-weight: 600;
  font-size: 1.2em;
  color: var(--blog-strong);
  margin: 2em 0 0.7em;
  letter-spacing: -0.01em;
}

.dts-about__prose p {
  font-family: 'Noto Sans SC', sans-serif;
  font-weight: 300;
  line-height: 1.9;
  margin-bottom: 1.4em;
}

.dts-about__prose strong {
  color: var(--blog-strong);
  font-weight: 600;
}

.dts-about__prose a {
  color: var(--blog-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}

.dts-about__prose a:hover {
  text-decoration-thickness: 2px;
}

.dts-about__interests {
  margin-top: 44px;
}

.dts-about__interests-label {
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--blog-muted);
  margin: 0 0 14px;
}

.dts-about__interest-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.dts-about__interest {
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 13px;
  color: var(--blog-body);
  background: var(--blog-surface);
  border: 1px solid var(--blog-border);
  border-radius: 6px;
  padding: 5px 14px;
}

.dts-about__stats {
  margin-top: 52px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--blog-border);
  border-radius: 10px;
  overflow: hidden;
}

.dts-about__stat {
  background: var(--blog-surface);
  padding: 20px 24px;
  text-align: center;
}

.dts-about__stat-value {
  font-family: 'Lora', serif;
  font-weight: 600;
  font-size: 28px;
  color: var(--blog-strong);
  letter-spacing: -0.02em;
  margin: 0;
  line-height: 1.1;
}

.dts-about__stat-label {
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 12px;
  color: var(--blog-muted);
  margin: 4px 0 0;
}

@media (max-width: 600px) {
  .dts-about { padding: 40px 16px 60px; }
  .dts-about__profile { flex-direction: column; gap: 20px; align-items: flex-start; }
  .dts-about__avatar { width: 80px; height: 80px; }
  .dts-about__name { font-size: 24px; }
  .dts-about__stats { grid-template-columns: 1fr; }
}

/* ======================================================================== */
/* Shorts page                                                              */
/* ======================================================================== */
.dts-shorts {
  max-width: 680px;
  margin: 0 auto;
  padding: 52px 24px 100px;
}

.dts-shorts__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 24px;
}

.dts-shorts__heading { min-width: 0; }

.dts-shorts__kicker {
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--blog-muted);
  margin: 0 0 10px;
}

.dts-shorts__title {
  font-family: 'Lora', 'Noto Serif SC', serif;
  font-weight: 600;
  font-size: 34px;
  color: var(--blog-strong);
  letter-spacing: -0.02em;
  line-height: 1;
  margin: 0;
}

.dts-shorts__lede {
  margin: 10px 0 0;
  font-size: 13px;
  color: var(--blog-muted);
  font-family: 'Noto Sans SC', sans-serif;
  line-height: 1.6;
}

.dts-shorts__rule {
  width: 32px;
  height: 2px;
  background: var(--blog-accent);
  border-radius: 2px;
  margin-bottom: 4px;
  flex-shrink: 0;
}

.dts-shorts__chips {
  display: flex;
  gap: 8px;
  margin-bottom: 36px;
  flex-wrap: wrap;
}

.dts-shorts__chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 11px;
  color: var(--blog-muted);
  text-decoration: none;
  background: var(--blog-surface);
  border: 1px solid var(--blog-border);
  padding: 4px 12px;
  border-radius: 20px;
  transition: color 0.15s ease, border-color 0.15s ease;
}

.dts-shorts__chip--rss:hover {
  color: var(--blog-accent);
  border-color: var(--blog-accent);
}

.dts-shorts__feed {
  list-style: none;
  margin: 0;
  padding: 0;
}

.dts-shorts__item {
  display: flex;
  gap: 16px;
  padding: 24px 0;
  border-bottom: 1px solid var(--blog-border);
}

.dts-shorts__item:last-child { border-bottom: none; }

.dts-shorts__rail {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 4px;
  flex-shrink: 0;
}

.dts-shorts__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--blog-bg);
  border: 2px solid var(--blog-accent);
  flex-shrink: 0;
}

.dts-shorts__line {
  width: 1px;
  flex: 1;
  background: var(--blog-border);
  margin-top: 6px;
}

.dts-shorts__body {
  flex: 1;
  min-width: 0;
  padding-bottom: 4px;
}

.dts-shorts__meta {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}

.dts-shorts__time {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  color: var(--blog-muted);
  letter-spacing: -0.01em;
}

.dts-shorts__content {
  font-family: 'Noto Sans SC', sans-serif;
  font-weight: 300;
  font-size: 15px;
  color: var(--blog-body);
  line-height: 1.85;
  text-wrap: pretty;
}

.dts-shorts__content p {
  margin: 0;
}

.dts-shorts__content p + p {
  margin-top: 0.6em;
}

.dts-shorts__content a {
  color: var(--blog-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.dts-shorts__empty {
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 13px;
  color: var(--blog-muted);
  text-align: center;
  padding: 60px 0;
}

@media (max-width: 600px) {
  .dts-shorts { padding: 32px 16px 60px; }
  .dts-shorts__header { flex-direction: column; align-items: flex-start; gap: 12px; }
  .dts-shorts__title { font-size: 28px; }
}

/* ======================================================================== */
/* Tags index + per-tag page                                                */
/* ======================================================================== */
[x-cloak] { display: none !important; }

.dts-tags,
.dts-tag-page {
  max-width: 860px;
  margin: 0 auto;
  padding: 52px 24px 100px;
}

.dts-tags__header,
.dts-tag-page__header {
  margin-bottom: 44px;
}

.dts-tags__kicker,
.dts-tag-page__kicker {
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--blog-muted);
  margin: 0 0 10px;
}

.dts-tags__title,
.dts-tag-page__title {
  font-family: 'Lora', 'Noto Serif SC', serif;
  font-weight: 600;
  font-size: 34px;
  color: var(--blog-strong);
  letter-spacing: -0.02em;
  line-height: 1.2;
  margin: 0;
}

.dts-tags__count,
.dts-tag-page__count {
  margin-top: 10px;
  font-size: 13px;
  color: var(--blog-muted);
  font-family: 'Noto Sans SC', sans-serif;
}

.dts-tags__rule,
.dts-tag-page__rule {
  width: 32px;
  height: 2px;
  background: var(--blog-accent);
  border-radius: 2px;
  margin-top: 18px;
}

.dts-tags__toggle {
  display: inline-flex;
  margin-top: 22px;
  border: 1px solid var(--blog-border);
  border-radius: 8px;
  overflow: hidden;
  background: var(--blog-surface);
}

.dts-tags__toggle-btn {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--blog-muted);
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 12px;
  padding: 6px 14px;
  cursor: pointer;
  transition: color 0.15s ease, background 0.15s ease;
}

.dts-tags__toggle-btn + .dts-tags__toggle-btn {
  border-left: 1px solid var(--blog-border);
}

.dts-tags__toggle-btn.is-active {
  color: var(--blog-strong);
  background: var(--blog-bg);
}

.dts-tags__list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 12px;
}

.dts-tags__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 14px 18px;
  background: var(--blog-surface);
  border: 1px solid var(--blog-border);
  border-radius: 8px;
  text-decoration: none;
  color: var(--blog-body);
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 14px;
  transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}

.dts-tags__item:hover {
  color: var(--blog-accent);
  border-color: var(--blog-accent);
}

.dts-tags__item-count {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px;
  color: var(--blog-muted);
  background: var(--blog-border);
  border-radius: 20px;
  padding: 1px 8px;
  flex-shrink: 0;
}

.dts-tags__item:hover .dts-tags__item-count {
  color: var(--blog-strong);
}

.dts-tags__cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.dts-tags__chip {
  --tag-scale: 1;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--blog-surface);
  border: 1px solid var(--blog-border);
  border-radius: 8px;
  padding: calc(6px * var(--tag-scale)) calc(14px * var(--tag-scale));
  font-family: 'Noto Sans SC', sans-serif;
  font-size: calc(12px * var(--tag-scale));
  color: var(--blog-body);
  text-decoration: none;
  line-height: 1.4;
  transition: color 0.15s ease, border-color 0.15s ease;
}

.dts-tags__chip:hover {
  color: var(--blog-accent);
  border-color: var(--blog-accent);
}

.dts-tags__chip-count {
  opacity: 0.6;
  font-size: 0.85em;
}

/* Per-tag page list */
.dts-tag-page__back {
  display: inline-block;
  margin-top: 18px;
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 12px;
  color: var(--blog-muted);
  text-decoration: none;
  transition: color 0.15s ease;
}

.dts-tag-page__back:hover {
  color: var(--blog-accent);
}

.dts-tag-page__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.dts-tag-page__row {
  list-style: none;
}

.dts-tag-page__link {
  display: flex;
  align-items: baseline;
  gap: 20px;
  padding: 13px 0;
  border-bottom: 1px solid var(--blog-border);
  text-decoration: none;
  transition: color 0.15s ease;
}

.dts-tag-page__row:last-child .dts-tag-page__link {
  border-bottom: none;
}

.dts-tag-page__date {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  color: var(--blog-muted);
  flex-shrink: 0;
  letter-spacing: -0.01em;
}

.dts-tag-page__row-title {
  font-family: 'Noto Serif SC', 'Lora', serif;
  font-size: 15px;
  color: var(--blog-strong);
  flex: 1;
  line-height: 1.5;
  transition: color 0.15s ease;
}

.dts-tag-page__link:hover .dts-tag-page__row-title {
  color: var(--blog-accent);
}

.dts-tag-page__readtime {
  font-size: 11px;
  color: var(--blog-muted);
  font-family: 'Noto Sans SC', sans-serif;
  flex-shrink: 0;
}

@media (max-width: 600px) {
  .dts-tags,
  .dts-tag-page { padding: 32px 16px 60px; }
  .dts-tags__title,
  .dts-tag-page__title { font-size: 28px; }
  .dts-tags__list { grid-template-columns: 1fr 1fr; gap: 10px; }
  .dts-tag-page__link { flex-wrap: wrap; gap: 8px 14px; }
  .dts-tag-page__row-title { flex-basis: 100%; order: 2; }
  .dts-tag-page__date { order: 1; }
  .dts-tag-page__readtime { order: 3; margin-left: auto; }
}

/* ======================================================================== */
/* Search page                                                              */
/* ======================================================================== */
.dts-search {
  max-width: 760px;
  margin: 0 auto;
  padding: 60px 24px 100px;
}

.dts-search__header {
  margin-bottom: 36px;
}

.dts-search__kicker {
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--blog-muted);
  margin: 0 0 10px;
}

.dts-search__title {
  font-family: 'Lora', 'Noto Serif SC', serif;
  font-weight: 600;
  font-size: 34px;
  color: var(--blog-strong);
  letter-spacing: -0.02em;
  line-height: 1.2;
  margin: 0;
}

.dts-search__box {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--blog-surface);
  border: 1.5px solid var(--blog-border);
  border-radius: 12px;
  padding: 12px 18px;
  margin-bottom: 28px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  cursor: text;
}

.dts-search__box.is-focused {
  border-color: var(--blog-accent);
  box-shadow: 0 0 0 3px var(--blog-tag-bg);
}

.dts-search__icon {
  color: var(--blog-muted);
  flex-shrink: 0;
  transition: color 0.2s ease;
}

.dts-search__box.is-focused .dts-search__icon {
  color: var(--blog-accent);
}

.dts-search__input {
  flex: 1;
  border: none;
  background: transparent;
  outline: none;
  font-family: 'Noto Sans SC', sans-serif;
  font-weight: 300;
  font-size: 17px;
  color: var(--blog-strong);
}

.dts-search__input::placeholder {
  color: var(--blog-muted);
}

.dts-search__clear {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--blog-muted);
  font-size: 18px;
  line-height: 1;
  padding: 0 2px;
  transition: color 0.15s ease;
}

.dts-search__clear:hover {
  color: var(--blog-strong);
}

.dts-search__section-label {
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 12px;
  color: var(--blog-muted);
  margin: 0 0 12px;
}

.dts-search__suggestions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 48px;
}

.dts-search__suggestion {
  appearance: none;
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 13px;
  color: var(--blog-body);
  background: var(--blog-surface);
  border: 1px solid var(--blog-border);
  border-radius: 8px;
  padding: 6px 14px;
  cursor: pointer;
  transition: color 0.15s ease, border-color 0.15s ease;
}

.dts-search__suggestion:hover {
  color: var(--blog-accent);
  border-color: var(--blog-accent);
}

.dts-search__index {
  list-style: none;
  margin: 0 0 16px;
  padding: 0;
}

.dts-search__index-row {
  list-style: none;
}

.dts-search__index-link {
  display: flex;
  align-items: baseline;
  gap: 16px;
  padding: 11px 0;
  border-bottom: 1px solid var(--blog-border);
  text-decoration: none;
  transition: color 0.15s ease;
}

.dts-search__index-row:last-child .dts-search__index-link {
  border-bottom: none;
}

.dts-search__index-date {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px;
  color: var(--blog-muted);
  flex-shrink: 0;
}

.dts-search__index-title {
  font-family: 'Noto Serif SC', 'Lora', serif;
  font-size: 14px;
  color: var(--blog-strong);
  flex: 1;
  line-height: 1.5;
  transition: color 0.15s ease;
}

.dts-search__index-link:hover .dts-search__index-title {
  color: var(--blog-accent);
}

.dts-search__count {
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 12px;
  color: var(--blog-muted);
  margin: 0 0 20px;
}

.dts-search__hits {
  list-style: none;
  margin: 0;
  padding: 0;
}

.dts-search__hit {
  list-style: none;
}

.dts-search__hit-link {
  display: block;
  padding: 20px 0;
  border-bottom: 1px solid var(--blog-border);
  text-decoration: none;
}

.dts-search__hit:last-child .dts-search__hit-link {
  border-bottom: none;
}

.dts-search__hit-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 7px;
  align-items: center;
}

.dts-search__hit-tag {
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 10px;
  color: var(--blog-tag);
  background: var(--blog-tag-bg);
  padding: 1px 7px;
  border-radius: 8px;
}

.dts-search__hit-date {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px;
  color: var(--blog-muted);
}

.dts-search__hit-title {
  font-family: 'Noto Serif SC', 'Lora', serif;
  font-weight: 600;
  font-size: 16px;
  color: var(--blog-strong);
  margin: 0 0 7px;
  line-height: 1.45;
  transition: color 0.15s ease;
}

.dts-search__hit-link:hover .dts-search__hit-title {
  color: var(--blog-accent);
}

.dts-search__hit-excerpt {
  font-family: 'Noto Sans SC', sans-serif;
  font-weight: 300;
  font-size: 13px;
  color: var(--blog-body);
  line-height: 1.7;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.dts-search mark {
  background: var(--blog-tag-bg);
  color: inherit;
  font-weight: 500;
  border-radius: 2px;
  padding: 0 2px;
}

.dts-search__no-results {
  text-align: center;
  padding: 60px 0;
  color: var(--blog-muted);
  font-family: 'Noto Sans SC', sans-serif;
  font-size: 14px;
}

.dts-search__no-results-icon {
  font-size: 40px;
  margin: 0 0 16px;
}

@media (max-width: 600px) {
  .dts-search { padding: 40px 16px 60px; }
  .dts-search__title { font-size: 28px; }
  .dts-search__input { font-size: 16px; }
}