:root { color-scheme: light dark; }
html, body, #root { height: 100%; margin: 0; }
body {
  font-family: 'IBM Plex Mono', ui-monospace, monospace;
  -webkit-font-smoothing: antialiased;
}
/* Bricolage used on headings via inline style; body text stays clean sans via Tailwind defaults override */
input, textarea, select, button { font-family: inherit; }
h1, h2, h3 { font-family: 'Bricolage Grotesque', sans-serif; }

/* Base body copy: use a clean sans over the mono default for readability of task text */
#root { font-family: ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif; }

::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(120,120,140,.28); border-radius: 9px; }
::-webkit-scrollbar-thumb:hover { background: rgba(120,120,140,.45); }

@keyframes slideIn { from { opacity:0; transform: translateY(6px);} to { opacity:1; transform:none; } }
.task-in { animation: slideIn .26s ease; }

@keyframes panelIn { from { transform: translateX(100%);} to { transform: none; } }
.panel-in { animation: panelIn .24s cubic-bezier(.16,1,.3,1); }

@keyframes drawerIn { from { transform: translateX(-100%);} to { transform: none; } }

@keyframes pop { 0%{transform:scale(.7);opacity:0} 60%{transform:scale(1.06)} 100%{transform:scale(1);opacity:1} }
.pop { animation: pop .3s cubic-bezier(.16,1,.3,1); }

@keyframes floatUp {
  0% { transform: translateY(0) rotate(0); opacity: 1; }
  100% { transform: translateY(-140px) rotate(240deg); opacity: 0; }
}
.spark {
  position: fixed;
  pointer-events: none;
  font-size: 22px;
  animation: floatUp 1.2s ease forwards;
  z-index: 100;
}

kbd { user-select: none; }

/* smooth theme transitions */
* { transition-property: background-color, border-color, color; transition-duration: .18s; }