/* ===== БЛОК КОДА ===== */
.tilda-code-graphite {
  background: #f4f5f7;
  color: #2d2f33;
  font-family: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace;
  font-size: 14px;
  padding: 24px 28px;
  border-radius: 8px;
  border: 1px solid #d0d4d9;
  border-left: 5px solid #1a8cff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  overflow-x: auto;
  white-space: pre-wrap;
  word-break: break-word;
  line-height: 1.8;
  tab-size: 2;
  transition: border-color 0.2s ease;
}

.tilda-code-graphite:hover {
  border-color: #b0b6be;
  border-left-color: #1a8cff;
}

/* ===== ПОДСВЕТКА СИНТАКСИСА ===== */
.tilda-code-graphite .keyword {
  color: #1a6fb5;
  font-weight: 600;
}
.tilda-code-graphite .string {
  color: #2d7a4b;
}
.tilda-code-graphite .comment {
  color: #8b929a;
  font-style: italic;
}
.tilda-code-graphite .function {
  color: #1a8cff;
  font-weight: 600;
}
.tilda-code-graphite .number {
  color: #b8660e;
}
.tilda-code-graphite .variable {
  color: #2d2f33;
}
.tilda-code-graphite .operator {
  color: #1a8cff;
  font-weight: 600;
}
.tilda-code-graphite .class-name {
  color: #1a6fb5;
  font-weight: 600;
}
.tilda-code-graphite .property {
  color: #b8660e;
}
.tilda-code-graphite .tag {
  color: #1a6fb5;
}
.tilda-code-graphite .attribute {
  color: #b8660e;
}

/* ===== INLINE-КОД ===== */
.tilda-inline-graphite {
  background: #eaedf0;
  color: #1a6fb5;
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.9em;
  padding: 2px 10px;
  border-radius: 4px;
  border: 1px solid #d0d4d9;
  font-weight: 500;
}

/* ===== НОМЕРА СТРОК (опционально) ===== */
.tilda-code-graphite .line-numbers {
  display: inline-block;
  color: #b0b6be;
  padding-right: 20px;
  text-align: right;
  user-select: none;
  border-right: 1px solid #d0d4d9;
  margin-right: 20px;
}