/* ============================================
   Isaacacious — shared base (theme-agnostic)
   All visual identity lives in themes/*.css,
   scoped under html[data-theme="..."].
   ============================================ */

* { margin: 0; padding: 0; box-sizing: border-box; }

html { scroll-behavior: smooth; }

body { line-height: 1.6; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }

a { color: inherit; text-decoration: none; }

ul { list-style: none; }

/* rotating definition caret (colors come from the theme) */
.caret {
  display: inline-block;
  width: 0.55em; height: 1.05em;
  margin-left: 0.3em;
  vertical-align: text-bottom;
  animation: blink 1.1s steps(1) infinite;
}
@keyframes blink { 50% { opacity: 0; } }

#rotating-def { transition: opacity 0.4s ease; }
#rotating-def.fading { opacity: 0; }

/* status dot pulse (color from theme) */
.status-dot {
  display: inline-block;
  width: 8px; height: 8px;
  border-radius: 50%;
  animation: pulse 2.4s ease-in-out infinite;
}
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.25; } }

/* theme controls: structure only; themes style colors */
#theme-controls {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-top: 1rem;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 0.7rem;
  letter-spacing: 0.05em;
}
#theme-controls button {
  font: inherit;
  letter-spacing: inherit;
  background: none;
  border: 1px solid currentColor;
  border-radius: 999px;
  padding: 0.2rem 0.7rem;
  cursor: pointer;
  color: inherit;
  opacity: 0.75;
  transition: opacity 0.15s ease;
}
#theme-controls button:hover { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
  .caret, .status-dot { animation: none; }
  #rotating-def { transition: none; }
  html { scroll-behavior: auto; }
}