@layer theme,base;@layer components{.mascot{--mascot-ink:var(--ink-share,100%);--mascot-top:color-mix(in oklab, #fffdf9 var(--mascot-ink), #22202a);--mascot-bottom:color-mix(in oklab, #f1e6d6 var(--mascot-ink), #22202a);--mascot-eye:color-mix(in oklab, #0b0e14 var(--mascot-ink), #f6f0e6);--mascot-shine:color-mix(in srgb, #fff var(--mascot-ink), transparent);--mascot-glow:1;flex:none;display:block;overflow:visible}:is([data-theme=dia],.ff-footer) .mascot{--mascot-glow:.55}@media (prefers-color-scheme:light){html[data-surface=account] .mascot{--mascot-glow:.55}}.mascot-top{stop-color:var(--mascot-top)}.mascot-bottom{stop-color:var(--mascot-bottom)}.mascot-eye{fill:var(--mascot-eye);transform-box:fill-box;transform-origin:50%;transition:transform var(--duration-state) var(--ease-sail)}.mascot-eye .mascot-shine{fill:var(--mascot-shine)}.mascot-arcs{fill:none;stroke:var(--mascot-eye);stroke-width:2.6px;stroke-linecap:round;opacity:0}.mascot-open,.mascot-arcs{transition:opacity .14s}.mascot-look{transform:translate(var(--mascot-x,0px), var(--mascot-y,0px));transition:transform .26s var(--ease-sail)}.mascot-glow{opacity:var(--mascot-glow)}.mascot-halo{opacity:.9;transform-box:view-box;transform-origin:50px 88px;transition:opacity var(--duration-state) var(--ease-sail), transform var(--duration-state) var(--ease-sail)}.mascot-body{transform-box:view-box;transform-origin:50px 79px}.mascot[data-state=working] .mascot-body{animation:mascot-bob 1.2s var(--ease-sail) infinite alternate}.mascot[data-state=working] .mascot-halo{animation:2.4s ease-in-out infinite mascot-breathe-glow}.mascot[data-state=needs] .mascot-eye{transform:scale(1.04,1.16)}.mascot[data-state=needs] .mascot-halo{opacity:1;transform:scale(1.12)}.mascot[data-state=needs] .mascot-body{animation:mascot-hop .56s var(--ease-sail) 1 both}.mascot[data-state=happy] .mascot-open,.mascot[data-state=sleeping] .mascot-open{opacity:0}.mascot[data-state=happy] .mascot-happy,.mascot[data-state=sleeping] .mascot-asleep,.mascot[data-state=happy] .mascot-halo{opacity:1}.mascot[data-state=sleeping] .mascot-halo{opacity:.45;animation:4s ease-in-out infinite mascot-sleep-glow}.mascot[data-state=sleeping] .mascot-body{animation:4s ease-in-out infinite mascot-sleep}@media (prefers-reduced-motion:reduce){.mascot,.mascot *{transition:none!important;animation:none!important}}html[data-motion=reduced] :is(.mascot,.mascot *){transition:none!important;animation:none!important}}@layer utilities;@keyframes mascot-bob{0%{transform:translateY(1.5px)}to{transform:translateY(-1.5px)}}@keyframes mascot-breathe-glow{0%,to{opacity:.72;transform:scale(.97)}50%{opacity:1;transform:scale(1.04)}}@keyframes mascot-hop{0%{transform:translateY(0)}35%{transform:translateY(-7px)}62%{transform:translateY(0)}80%{transform:translateY(-1.5px)}to{transform:translateY(0)}}@keyframes mascot-sleep{0%,to{transform:scale(1)}50%{transform:scale(1.012,1.024)}}@keyframes mascot-sleep-glow{0%,to{opacity:.34}50%{opacity:.52}}