:root {
  --hc-primary: #6c63ff;
  --hc-secondary: #22c55e;
  --hc-warning: #f97316;
  --hc-danger: #fb4b63;
  --hc-info: #0ea5e9;
  --hc-bg: #f7f9ff;
  --hc-surface: #ffffff;
  --hc-text: #25324b;
  --hc-muted: #667085;
  --hc-font: inherit;
  --hc-gap: 18px;
  --hc-item-radius: 18px;
}

.hc-front {
  direction: rtl;
  text-align: right;
  color: var(--hc-text);
  font-family: var(--hc-font);
}

.hc-front * { box-sizing: border-box; font-family: inherit !important; }

.hc-front-header {
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:16px;
  margin-bottom:24px;
  padding:24px;
  background: linear-gradient(135deg, #ffffff 0%, #fff7fd 45%, #f4fbff 100%);
  border:1px solid rgba(108,99,255,.14);
  border-radius:24px;
  box-shadow: 0 16px 38px rgba(108,99,255,.12);
}

.hc-front-kicker {
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 12px;
  border-radius:999px;
  background: rgba(108,99,255,.1);
  color: var(--hc-primary);
  font-size:12px;
  font-weight:700;
}

.hc-front h2 { margin:12px 0 8px; font-size:clamp(28px, 4vw, 42px); line-height:1.08; }
.hc-front-header p { margin:0; color:var(--hc-muted); font-size:15px; max-width:56ch; line-height:1.8; }

.hc-front-pill {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 16px;
  border-radius:999px;
  background:#f5f7ff;
  border:1px solid rgba(108,99,255,.16);
  color:var(--hc-primary);
  font-weight:700;
  white-space:nowrap;
}

.hc-front-list { display:grid; gap: var(--hc-gap); }
.hc-front-release {
  background: var(--hc-surface);
  border:1px solid rgba(108,99,255,.14);
  border-radius:24px;
  padding:24px;
  box-shadow: 0 16px 38px rgba(108,99,255,.12);
}
.hc-front-release.is-latest { border-color: rgba(34,197,94,.26); box-shadow: 0 18px 42px rgba(34,197,94,.12); }

.hc-front-release-top { display:flex; justify-content:space-between; gap:16px; align-items:flex-start; }
.hc-front-version { color:var(--hc-primary); font-size:13px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.hc-front-release h3 { margin:6px 0 8px; font-size:20px; }
.hc-front-meta { display:flex; flex-wrap:wrap; gap:12px; color:var(--hc-muted); font-size:13px; }
.hc-front-summary { margin:16px 0 0; color:var(--hc-muted); font-size:15px; line-height:1.75; }
.hc-front-items { display:grid; gap:12px; margin-top:18px; }
.hc-front-item { display:grid; grid-template-columns:auto 1fr; gap:12px; align-items:flex-start; padding:16px; border-radius: var(--hc-item-radius); background: linear-gradient(180deg, #ffffff 0%, #fdfcff 100%); border:1px solid rgba(15,23,42,.06); }
.hc-front-type { display:inline-flex; align-items:center; justify-content:center; min-width:84px; padding:7px 12px; border-radius:999px; color:#ffffff !important; font-size:12px; font-weight:800; text-shadow: 0 1px 0 rgba(0,0,0,.08); }
.hc-front-item-body strong { display:block; margin-bottom:5px; font-size:15px; }
.hc-front-item-body p { margin:0; color:var(--hc-muted); line-height:1.7; }
.hc-front-empty { padding:34px 28px; text-align:center; background:#fff; border:1px dashed rgba(108,99,255,.24); border-radius:24px; color:var(--hc-muted); }
.hc-front-empty strong { display:block; margin-bottom:8px; color:var(--hc-text); }

.hc-front-divider { height: 1px; background: linear-gradient(90deg, rgba(108,99,255,.0), rgba(108,99,255,.18), rgba(34,197,94,.18), rgba(108,99,255,.0)); margin: 4px 0; border-radius: 999px; }

.hc-front .hc-type-added { background: linear-gradient(135deg, #22c55e, #4ade80); }
.hc-front .hc-type-fixed { background: linear-gradient(135deg, #ef4444, #fb7185); }
.hc-front .hc-type-updated { background: linear-gradient(135deg, #f97316, #fb923c); }
.hc-front .hc-type-improved { background: linear-gradient(135deg, #3b82f6, #60a5fa); }
.hc-front .hc-type-removed { background: linear-gradient(135deg, #64748b, #94a3b8); }
.hc-front .hc-type-security { background: linear-gradient(135deg, #8b5cf6, #a78bfa); }
.hc-front .hc-type-optimized { background: linear-gradient(135deg, #06b6d4, #22d3ee); }
.hc-front .hc-type-ui { background: linear-gradient(135deg, #ec4899, #f472b6); }

@media (max-width: 782px) {
  .hc-front-header,
  .hc-front-release-top { flex-direction:column; align-items:stretch; }
  .hc-front-release { padding:18px; }
  .hc-front-item { grid-template-columns:1fr; }
}


.hc-front {
  --hc-radius: 24px;
  font-family: inherit;
}

.hc-front-header {
  border-radius: var(--hc-radius);
}

.hc-front-release {
  border-radius: var(--hc-radius);
}

.hc-front-template-timeline .hc-front-release {
  border-inline-start: 5px solid var(--hc-primary);
  padding-inline-start: 18px;
}

.hc-front-template-cards .hc-front-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.hc-front-template-cards .hc-front-release {
  height: 100%;
}

.hc-front-template-compact .hc-front-release {
  padding: 18px;
}

.hc-front-template-compact .hc-front-release h3 {
  font-size: 18px;
}

.hc-front-template-compact .hc-front-summary {
  margin-top: 12px;
}

.hc-front-density-compact .hc-front-items {
  gap: 10px;
}

.hc-front-density-compact .hc-front-item {
  padding: 12px;
}

.hc-front-density-compact .hc-front-meta {
  gap: 10px;
}

.hc-front-pill-success {
  color: #16a34a;
  background: #ecfdf3;
  border-color: rgba(22,163,74,.16);
}

.hc-front-release.is-latest {
  position: relative;
}

.hc-front-release.is-latest::before {
  content: '';
  position: absolute;
  inset-inline-start: 0;
  top: 18px;
  bottom: 18px;
  width: 4px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--hc-secondary), var(--hc-primary));
  opacity: .75;
}

@media (max-width: 782px) {
  .hc-front-template-cards .hc-front-list {
    grid-template-columns: 1fr;
  }

  .hc-front-template-timeline .hc-front-release,
  .hc-front-release.is-latest::before {
    border-inline-start: 0;
  }
}

.hc-front-template-sunny .hc-front-header {
  background: linear-gradient(135deg, #fffef3 0%, #f6fff8 48%, #f8f5ff 100%);
  border-color: rgba(251, 191, 36, .22);
}

.hc-front-template-sunny .hc-front-release {
  border-color: rgba(251, 191, 36, .18);
  box-shadow: 0 18px 42px rgba(251, 191, 36, .10);
}

.hc-front-template-sunny .hc-front-version {
  color: #d97706;
}

.hc-front-template-sunny .hc-front-pill {
  background: #fff9e6;
  border-color: rgba(251, 191, 36, .22);
  color: #b45309;
}

.hc-front-template-sunny .hc-front-header { box-shadow: 0 18px 44px rgba(251, 191, 36, .12), 0 8px 20px rgba(108, 99, 255, .06); }
.hc-front-template-sunny .hc-front-release { background: linear-gradient(180deg, #ffffff 0%, #fffef8 100%); }

.hc-front-mini-note { margin-top: 12px; font-size: 13px; color: var(--hc-muted); background: rgba(255,255,255,.7); display: inline-flex; padding: 8px 12px; border-radius: 999px; border: 1px solid rgba(108,99,255,.12); }

.hc-front-template-sunny .hc-front-item {
  background: linear-gradient(180deg, #ffffff 0%, #fffcf3 100%);
}

.hc-front-template-sunny .hc-front-type {
  box-shadow: 0 8px 18px rgba(251, 191, 36, .14);
}