/* Reading streak inside the Sphinx docs (static/js/docs-streak.js). Uses Shibuya's colour variables. */
.streak-chip {
  display: block; margin: 0 0 .75rem; padding: .65rem .9rem; border-radius: 12px; text-decoration: none !important;
  font-size: .82rem; color: var(--sy-c-text); background: rgba(249, 115, 22, .08); border: 1px solid rgba(249, 115, 22, .35);
}
.streak-chip strong { display: block; font-size: .9rem; color: var(--sy-c-heading); }
.streak-chip span { color: var(--sy-c-light); }
.streak-chip.is-done { background: rgba(16, 185, 129, .08); border-color: rgba(16, 185, 129, .4); }
.streak-chip:hover { border-color: #f97316; }

.streak-toast {
  position: fixed; left: 50%; bottom: 1.5rem; z-index: 80; transform: translateX(-50%);
  display: flex; flex-direction: column; gap: .15rem; min-width: 260px; max-width: calc(100vw - 2rem);
  padding: .85rem 1.2rem; border-radius: 14px; color: #fff; text-align: center;
  background: linear-gradient(135deg, #f97316, #ea580c); box-shadow: 0 14px 40px rgba(234, 88, 12, .35);
  animation: streak-in .35s ease-out; transition: opacity .6s, transform .6s;
}
.streak-toast strong { font-size: 1rem; }
.streak-toast span { font-size: .85rem; opacity: .92; }
.streak-toast.is-hiding { opacity: 0; transform: translate(-50%, 12px); }
@keyframes streak-in { from { opacity: 0; transform: translate(-50%, 16px); } to { opacity: 1; transform: translate(-50%, 0); } }
@media (prefers-reduced-motion: reduce) { .streak-toast { animation: none; transition: none; } }
@media print { .streak-chip, .streak-toast { display: none !important; } }