:root {
  --background: 222 42% 5%;
  --foreground: 190 35% 93%;
  --primary: 185 100% 55%;
  --primary-foreground: 222 48% 6%;
  --secondary: 263 85% 64%;
  --secondary-foreground: 210 40% 98%;
  --muted: 220 18% 24%;
  --muted-foreground: 204 18% 72%;
  --destructive: 0 84% 60%;
  --destructive-foreground: 210 40% 98%;
  --border: 199 32% 20%;
  --card: 222 34% 9%;
  --shadow-sm: 0 8px 24px rgba(0,0,0,.28);
  --shadow-md: 0 18px 56px rgba(0,0,0,.38);
  --shadow-lg: 0 28px 90px rgba(0,0,0,.55);
  --transition-fast: 150ms ease;
  --transition-smooth: 280ms cubic-bezier(.2,.8,.2,1);
  --radius-sm: .65rem;
  --radius-md: 1rem;
  --radius-lg: 1.45rem;
}
.dark {
  --background: 222 42% 5%;
  --foreground: 190 35% 93%;
  --primary: 185 100% 55%;
  --secondary: 263 85% 64%;
  --muted: 220 18% 24%;
  --destructive: 0 84% 60%;
  --border: 199 32% 20%;
  --card: 222 34% 9%;
}
* { box-sizing: border-box; }
html { min-height: 100%; background: hsl(var(--background)); color: hsl(var(--foreground)); }
body { margin: 0; min-height: 100vh; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: radial-gradient(circle at 12% 0%, rgba(29,242,255,.16), transparent 32%), radial-gradient(circle at 88% 8%, rgba(124,58,237,.18), transparent 36%), linear-gradient(135deg, #05070d, #0b1020 56%, #030407); color: hsl(var(--foreground)); overflow-x: hidden; }
button, a, input, textarea, select { -webkit-tap-highlight-color: transparent; }
input, textarea, select { font-size: max(16px, 1rem); }
button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline: 2px solid hsl(var(--primary)); outline-offset: 3px; }
.metal-card { background: linear-gradient(145deg, hsla(var(--card), .94), rgba(21, 28, 43, .78)); border: 1px solid hsla(var(--border), .9); box-shadow: var(--shadow-sm), inset 0 1px 0 rgba(255,255,255,.05); backdrop-filter: blur(16px); }
.neon-line { position: relative; overflow: hidden; }
.neon-line:before { content: ''; position: absolute; inset: 0; border-radius: inherit; padding: 1px; background: linear-gradient(135deg, rgba(29,242,255,.8), rgba(124,58,237,.12), rgba(29,242,255,.2)); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; }
.calendar-3d { perspective: 1200px; transform-style: preserve-3d; }
.calendar-day { box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 10px 24px rgba(0,0,0,.22); transform: rotateX(3deg); }
.calendar-day:hover { transform: rotateX(0deg) translateY(-2px); border-color: hsl(var(--primary)); }
.calendar-day.has-memory:after { content: '\f08d'; font-family: 'Font Awesome 6 Free'; font-weight: 900; position: absolute; right: .35rem; top: .3rem; color: hsl(var(--primary)); font-size: .72rem; }
.mobile-calendar-grid { grid-template-columns: 32px repeat(7, minmax(0, 1fr)); }
.memory-fullscreen-viewer { width: 100vw; max-width: none; min-height: 100dvh; -webkit-overflow-scrolling: touch; }
.memory-fullscreen-viewer main { max-width: min(100vw, 64rem); }

.memory-overlay { animation: overlayFade .22s ease both; }
.memory-overlay > section { animation: overlaySlide .28s cubic-bezier(.2,.8,.2,1) both; }
.safe-bottom { padding-bottom: calc(5.75rem + env(safe-area-inset-bottom)); }
.bottom-nav { padding-bottom: env(safe-area-inset-bottom); }
.voice-wave { display: flex; align-items: center; justify-content: center; gap: .45rem; min-height: 48px; border-radius: var(--radius-md); background: rgba(0,0,0,.22); border: 1px solid hsla(var(--primary), .25); }
.voice-wave span { width: .45rem; height: 14px; border-radius: 999px; background: hsl(var(--primary)); animation: voicePulse .8s ease-in-out infinite; box-shadow: 0 0 18px hsla(var(--primary), .5); }
.voice-wave span:nth-child(2) { animation-delay: .1s; }
.voice-wave span:nth-child(3) { animation-delay: .2s; }
.voice-wave span:nth-child(4) { animation-delay: .3s; }
.voice-wave span:nth-child(5) { animation-delay: .4s; }
@keyframes voicePulse { 0%,100% { transform: scaleY(.55); opacity: .55; } 50% { transform: scaleY(2.2); opacity: 1; } }
@keyframes overlayFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes overlaySlide { from { opacity: .65; transform: translateY(24px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: rgba(255,255,255,.03); }
::-webkit-scrollbar-thumb { background: rgba(29,242,255,.28); border-radius: 999px; }
@media (max-width: 480px) {
  .mobile-shell { width: 100%; max-width: 480px; margin: 0 auto; }
  .metal-card { border-radius: var(--radius-md); }
  .mobile-calendar-grid { grid-template-columns: 26px repeat(7, minmax(34px, 1fr)); }
  .memory-fullscreen-viewer main { max-width: 100vw; padding-left: .75rem; padding-right: .75rem; }
  .memory-fullscreen-viewer .metal-card { width: 100%; }
}
.fixed[role="dialog"] > .metal-card, .fixed > form.metal-card { max-width: 90%; }