@property --mode{syntax:"<color>";inherits:true;initial-value:#6366f1}.landing{--mode:#6366f1;transition:--mode .6s}.landing[data-mode=learn]{--mode:var(--learn)}.hc-waves{--waves-dim:0;--waves-drop:.65;opacity:calc(.9 - var(--waves-dim) * var(--waves-drop))}:root.light .hc-waves{--waves-drop:0}.mode-pane{transition:opacity .5s,transform .5s,filter .5s}.landing[data-mode=pro] .mode-pane-learn,.landing[data-mode=learn] .mode-pane-pro{opacity:0;filter:blur(6px);pointer-events:none;transform:translateY(8px)}@keyframes rec-bar{0%,to{transform:scaleY(.25)}50%{transform:scaleY(1)}}.rec-bar{transform-origin:50%;animation:1.1s ease-in-out infinite rec-bar}@keyframes rec-blink{50%{opacity:.25}}.rec-dot{animation:1.2s step-end infinite rec-blink}@keyframes rec-ring{0%{opacity:.7;transform:scale(.8)}to{opacity:0;transform:scale(2.4)}}.rec-ring{animation:2.4s ease-out infinite rec-ring}@keyframes speaking{0%,to{box-shadow:0 0 0 2px var(--mode), 0 0 0 0 color-mix(in oklab, var(--mode) 50%, transparent)}50%{box-shadow:0 0 0 2px var(--mode), 0 0 0 8px transparent}}.speaking{animation:1.6s ease-out infinite speaking}@media (prefers-reduced-motion:reduce){.rec-bar,.rec-dot,.rec-ring,.speaking{animation:none}.landing,.mode-pane{transition:none}}@keyframes blob-morph{0%,to{border-radius:38% 62% 55% 45%/48% 38% 62% 52%}33%{border-radius:55% 45% 40% 60%/60% 52% 48% 40%}66%{border-radius:45% 55% 62% 38%/42% 60% 40% 58%}}.blob-shape{border-radius:38% 62% 55% 45%/48% 38% 62% 52%;animation:14s ease-in-out infinite blob-morph}@media (prefers-reduced-motion:reduce){.blob-shape{animation:none}}@keyframes wave-breathe{0%,to{transform:scaleY(.8)}50%{transform:scaleY(1.1)}}.wave-breathe{transform-origin:50%;animation:2.6s ease-in-out infinite wave-breathe}@keyframes wave-breathe-x{0%,to{transform:scaleX(.8)}50%{transform:scaleX(1.1)}}.wave-breathe-x{transform-origin:50%;animation:2.6s ease-in-out infinite wave-breathe-x}@media (prefers-reduced-motion:reduce){.wave-breathe-x,.wave-breathe{animation:none}}.sound-band{container-type:size}.sound-note{opacity:0;animation:3s linear infinite note-h;left:0}@keyframes note-h{0%{opacity:0;transform:translate(0)scale(.4)rotate(-15deg)}15%{opacity:1}25%{transform:translate(25cqw, calc(var(--amp) * -1)) scale(.8) rotate(8deg)}50%{transform:translate(50cqw)scale(1)rotate(-8deg)}75%{transform:translate(75cqw, var(--amp)) scale(.9) rotate(8deg);opacity:1}to{opacity:0;transform:translate(100cqw)scale(.5)rotate(0)}}@media (max-width:1023px){.sound-note{animation-name:note-v;top:0;left:auto}}@keyframes note-v{0%{opacity:0;transform:translate(0)scale(.4)rotate(-15deg)}15%{opacity:1}25%{transform:translate(calc(var(--amp) * -1), 25cqh) scale(.8) rotate(8deg)}50%{transform:translateY(50cqh)scale(1)rotate(-8deg)}75%{transform:translate(var(--amp), 75cqh) scale(.9) rotate(8deg);opacity:1}to{opacity:0;transform:translateY(100cqh)scale(.5)rotate(0)}}@media (prefers-reduced-motion:reduce){.sound-note{animation:none;display:none}}.md-glow{padding:2px;animation:2.4s ease-in-out infinite md-pulse;position:relative;overflow:hidden}.md-glow:before{content:"";background:conic-gradient(from 0deg, transparent 0 55%, #fff 70%, var(--mode) 85%, transparent 100%);animation:2.4s linear infinite md-spin;position:absolute;inset:-150%}.md-glow>*{position:relative}@keyframes md-spin{to{transform:rotate(360deg)}}@keyframes md-pulse{0%,to{box-shadow:0 0 #0000}50%{box-shadow:0 0 18px 2px var(--mode)}}@keyframes logo-float{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.logo-float{animation:3.2s ease-in-out infinite logo-float}@media (prefers-reduced-motion:reduce){.md-glow,.md-glow:before,.logo-float{animation:none}}