/* Giá Sầu Riêng — frontend shortcode */
.gsr-wrap {
  --gsr-green: #1a4d2e;
  --gsr-cream: #f4faf5;
  --gsr-line: rgba(26, 77, 46, 0.14);
  --gsr-accent: #2a7a4a;
  font-family: inherit;
  max-width: 960px;
  margin: 1.25rem auto;
}
.gsr-card {
  background: var(--gsr-cream);
  border: 1px solid var(--gsr-line);
  border-radius: 16px;
  padding: clamp(18px, 3vw, 26px);
  box-shadow: 0 8px 30px rgba(20, 60, 40, 0.08);
}
.gsr-head {
  margin-bottom: 1rem;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid var(--gsr-line);
}
.gsr-head h2 {
  margin: 0 0 0.35rem;
  font-size: clamp(1.15rem, 2.4vw, 1.35rem);
  font-weight: 800;
  color: var(--gsr-green);
  letter-spacing: -0.02em;
}
.gsr-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.4rem 0.65rem;
  margin: 0;
  font-size: 0.88rem;
  line-height: 1.45;
  color: #4a6354;
}
.gsr-meta__label {
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #6b8f7a;
}
.gsr-meta__time {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.15rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: var(--gsr-green);
  font-size: 0.95rem;
  letter-spacing: -0.02em;
}
.gsr-meta__mid {
  font-weight: 700;
  color: #7a9a88;
  margin: 0 0.05rem;
}
.gsr-meta__clock {
  font-weight: 800;
}
.gsr-meta__empty {
  font-size: 0.84rem;
  font-weight: 600;
  color: #7a8f82;
}

html[data-theme="dark"] .gsr-meta {
  color: #b8d4c4;
}
html[data-theme="dark"] .gsr-meta__label {
  color: #8fbda3;
}
html[data-theme="dark"] .gsr-meta__time {
  color: #d4f5e4;
}
html[data-theme="dark"] .gsr-meta__mid {
  color: #8aa898;
}
html[data-theme="dark"] .gsr-meta__empty {
  color: #9ab5aa;
}
.gsr-note {
  margin: 0 0 1rem;
  font-size: 0.88rem;
  color: #3d5246;
  line-height: 1.55;
}
.gsr-grid {
  overflow-x: auto;
  border-radius: 12px;
  border: 1px solid var(--gsr-line);
}
.gsr-grid table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.86rem;
  min-width: 640px;
}
.gsr-grid th,
.gsr-grid td {
  padding: 10px 12px;
  text-align: left;
  border-bottom: 1px solid var(--gsr-line);
}
.gsr-grid thead th {
  background: var(--gsr-green);
  color: #fff;
  font-weight: 700;
  white-space: nowrap;
}
.gsr-grid tbody tr:last-child td {
  border-bottom: 0;
}
.gsr-grid tbody tr:nth-child(even) {
  background: rgba(255, 255, 255, 0.65);
}
.gsr-num {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}
.gsr-delta-pos {
  color: #0f6b3a;
}
.gsr-delta-neg {
  color: #9b1c1c;
}
.gsr-delta-zero {
  color: #4a5c52;
}
.gsr-seo-block {
  margin: 0 0 1.25rem;
  padding: 1rem 1.1rem 1.05rem;
  border-radius: 12px;
  border: 1px solid var(--gsr-line);
  background: rgba(255, 255, 255, 0.55);
}
.gsr-seo-block__title {
  margin: 0 0 0.65rem;
  font-size: clamp(1.02rem, 2.2vw, 1.18rem);
  font-weight: 800;
  color: var(--gsr-green);
  letter-spacing: -0.02em;
  line-height: 1.3;
}
.gsr-seo-block__sub {
  margin: 1rem 0 0.45rem;
  font-size: 0.92rem;
  font-weight: 800;
  color: var(--gsr-accent);
}
.gsr-seo-block__p {
  margin: 0 0 0.5rem;
  font-size: 0.88rem;
  line-height: 1.65;
  color: #334a3d;
}
.gsr-seo-block__p:last-child {
  margin-bottom: 0;
}

html[data-theme="dark"] .gsr-seo-block {
  background: rgba(28, 44, 36, 0.75);
  border-color: rgba(255, 255, 255, 0.12);
}
html[data-theme="dark"] .gsr-seo-block__title {
  color: #d4f0e0;
}
html[data-theme="dark"] .gsr-seo-block__sub {
  color: #7ee0a8;
}
html[data-theme="dark"] .gsr-seo-block__p {
  color: #c8ddd0;
}

[data-theme="dark"] .gsr-wrap,
html[data-theme="dark"] .gsr-wrap {
  --gsr-green: #9ee0b4;
  --gsr-cream: #141a17;
  --gsr-line: rgba(255, 255, 255, 0.11);
  --gsr-accent: #6cf0a8;
}

[data-theme="dark"] .gsr-card,
html[data-theme="dark"] .gsr-card {
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.35);
}

[data-theme="dark"] .gsr-note,
html[data-theme="dark"] .gsr-note {
  color: #b5d0c0;
}

[data-theme="dark"] .gsr-grid tbody td,
html[data-theme="dark"] .gsr-grid tbody td {
  color: #d8ebe2;
}

[data-theme="dark"] .gsr-grid tbody tr:nth-child(even),
html[data-theme="dark"] .gsr-grid tbody tr:nth-child(even) {
  background: rgba(255, 255, 255, 0.04);
}

[data-theme="dark"] .gsr-delta-zero,
html[data-theme="dark"] .gsr-delta-zero {
  color: #9eb8ad;
}