:root{--ff-char-1: #b7c4ec;--ff-char-2: #d3b6e0;--ff-char-3: #e3b7cd;--ff-char-4: #a9d6cf;--ff-ink: #1c2030;--ff-ground: rgba(28, 32, 48, .1);--ff-zzz: var(--ff-ink);--ff-chip-bg: rgba(255, 255, 255, .92);--ff-chip-border: rgba(18, 24, 38, .18);--ff-chip-text: #14171d}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--ff-ground: rgba(0, 0, 0, .35);--ff-zzz: #cdd4e4;--ff-chip-bg: rgba(18, 24, 38, .82);--ff-chip-border: rgba(255, 255, 255, .14);--ff-chip-text: #eceef5}}:root[data-theme=dark]{--ff-ground: rgba(0, 0, 0, .35);--ff-zzz: #cdd4e4;--ff-chip-bg: rgba(18, 24, 38, .82);--ff-chip-border: rgba(255, 255, 255, .14);--ff-chip-text: #eceef5}.ff-scene{display:block;width:100%;height:auto}[data-ff-paused] .ff-scene,[data-ff-paused] .ff-scene *{animation-play-state:paused!important}.ff-stage{align-self:center;width:min(460px,100%);margin:24px 0}@media(max-width:860px){.ff-stage{width:min(300px,80%);margin:4px 0 0}}.ff-ground{fill:var(--ff-ground)}.ff-tag{opacity:0;transform:translateY(3px);transition:opacity .18s ease,transform .18s ease;pointer-events:none}.ff-char:hover .ff-tag{opacity:1;transform:translateY(0)}.ff-tag rect{fill:var(--ff-chip-bg);stroke:var(--ff-chip-border);stroke-width:1}.ff-tag text{font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:11px;letter-spacing:.08em;fill:var(--ff-chip-text)}.ff-face{transform:translate(calc(var(--ff-lx, 0) * var(--fm, 10) * 1px),calc(var(--ff-ly, 0) * var(--fmy, 7) * 1px));transition:transform .18s ease-out}.ff-char-1 .ff-face{--fm: 13;--fmy: 9}.ff-char-2 .ff-face{--fm: 8;--fmy: 6}.ff-char-3 .ff-face{--fm: 11;--fmy: 8}.ff-char-4 .ff-face{--fm: 6;--fmy: 4}.ff-pupil{transform:translate(calc(var(--ff-lx, 0) * 3.5px),calc(var(--ff-ly, 0) * 2.8px));transition:transform .14s ease-out}.ff-lean{transform:rotate(calc(var(--ff-lx, 0) * var(--bl, 4) * 1deg));transform-box:fill-box;transform-origin:50% 100%;transition:transform .3s ease-out}.ff-char-1 .ff-lean{--bl: 4}.ff-char-2 .ff-lean{--bl: 6}.ff-char-3 .ff-lean{--bl: 1.5}.ff-char-4 .ff-lean{--bl: 7}[data-mood=shy] .ff-lean,[data-mood=peek] .ff-lean,[data-mood=success] .ff-lean{transform:rotate(0)}[data-mood=error] .ff-char-1 .ff-lean{transform:rotate(-7deg) skew(-3deg)}[data-mood=error] .ff-char-2 .ff-lean{transform:rotate(3deg)}[data-mood=error] .ff-char-3 .ff-lean{transform:rotate(0)}[data-mood=error] .ff-char-4 .ff-lean{transform:rotate(4deg)}.ff-lid{transform:translateY(0);transition:transform .16s ease-in-out}.ff-lid--closed{transform:translateY(18px)}.ff-lid--half{transform:translateY(10px)}[data-mood=shy] .ff-char-1 .ff-face,[data-mood=peek] .ff-char-1 .ff-face{transform:translate(-14px,-9px)}[data-mood=shy] .ff-char-1 .ff-pupil,[data-mood=peek] .ff-char-1 .ff-pupil{transform:translate(-3.5px,-2.5px)}[data-mood=shy] .ff-char-2 .ff-face,[data-mood=peek] .ff-char-2 .ff-face{transform:translate(-7px,-12px)}[data-mood=shy] .ff-char-2 .ff-pupil,[data-mood=peek] .ff-char-2 .ff-pupil{transform:translate(-2px,-3.5px)}[data-mood=shy] .ff-char-3 .ff-face,[data-mood=peek] .ff-char-3 .ff-face{transform:translate(-14px,-4px)}[data-mood=shy] .ff-char-3 .ff-pupil,[data-mood=peek] .ff-char-3 .ff-pupil{transform:translate(-3.5px,-1.5px)}[data-mood=shy] .ff-char-4 .ff-face,[data-mood=peek] .ff-char-4 .ff-face{transform:translate(4px,-12px)}[data-mood=shy] .ff-char-4 .ff-pupil,[data-mood=peek] .ff-char-4 .ff-pupil{transform:translate(1px,-4px)}@keyframes ff-sneak-a{0%,84%,to{transform:translate(0)}88%,94%{transform:translate(16px,14px)}}@keyframes ff-sneak-b{0%,76%,to{transform:translate(0)}80%,88%{transform:translate(20px,12px)}}[data-mood=shy] .ff-char-4 .ff-drift,[data-mood=peek] .ff-char-4 .ff-drift{animation:ff-sneak-a 6.4s ease-in-out infinite}[data-mood=shy] .ff-char-1 .ff-drift,[data-mood=peek] .ff-char-1 .ff-drift{animation:ff-sneak-b 11.3s ease-in-out 4s infinite}@keyframes ff-sway{0%,to{transform:translate(0)}50%{transform:translate(var(--sx, 2px),var(--sy, 1.5px))}}[data-mood=shy] .ff-char-2 .ff-drift,[data-mood=peek] .ff-char-2 .ff-drift{--sx: -2px;--sy: 2.5px;animation:ff-sway 5.1s ease-in-out .8s infinite}[data-mood=shy] .ff-char-3 .ff-drift,[data-mood=peek] .ff-char-3 .ff-drift{--sx: 3px;--sy: -1.5px;animation:ff-sway 4.7s ease-in-out 1.6s infinite}@keyframes ff-glance{0%,76%,to{transform:translate(0)}80%,90%{transform:translate(var(--gx, 6px),var(--gy, -3px))}}[data-mood=idle] .ff-char-1 .ff-drift{--gx: -6px;--gy: -4px;animation:ff-glance 15s ease-in-out 2s infinite}[data-mood=idle] .ff-char-2 .ff-drift{--gx: 8px;--gy: -5px;animation:ff-glance 11s ease-in-out infinite}[data-mood=idle] .ff-char-3 .ff-drift{--gx: -7px;--gy: 3px;animation:ff-glance 13s ease-in-out 7s infinite}[data-mood=idle] .ff-char-4 .ff-drift{--gx: 6px;--gy: 5px;animation:ff-glance 17s ease-in-out 9s infinite}@keyframes ff-mouth-twitch{0%,88%,to{transform:scale(1)}92%,96%{transform:scale(1.14,1.06)}}[data-mood=idle] .ff-mouth,[data-mood=look] .ff-mouth{transform-box:fill-box;transform-origin:50% 50%;animation:ff-mouth-twitch 9s ease-in-out infinite}[data-mood=idle] .ff-char-2 .ff-mouth,[data-mood=look] .ff-char-2 .ff-mouth{animation-delay:3s}[data-mood=idle] .ff-char-3 .ff-mouth,[data-mood=look] .ff-char-3 .ff-mouth{animation-delay:5.5s}[data-mood=idle] .ff-char-4 .ff-mouth,[data-mood=look] .ff-char-4 .ff-mouth{animation-delay:1.5s}[data-mood=error] .ff-face{transform:translate(calc(var(--ff-lx, 0) * 6px),11px)}[data-mood=error] .ff-pupil{transform:translate(-2px,3.5px)}[data-mood=error] .ff-char-3 .ff-mouth{transform:translateY(-7px);transition:transform .3s ease}[data-mood=error] .ff-char-4 .ff-mouth{transform:translateY(-4px);transition:transform .3s ease}@keyframes ff-sad-rock{0%,to{transform:translate(0) rotate(0)}50%{transform:translate(-1.5px,2px) rotate(-.8deg)}}[data-mood=error] .ff-drift{transform-box:fill-box;transform-origin:50% 100%;animation:ff-sad-rock 3.6s ease-in-out .5s infinite}[data-mood=error] .ff-char-2 .ff-drift{animation-delay:1.1s}[data-mood=error] .ff-char-3 .ff-drift{animation-delay:1.7s}[data-mood=error] .ff-char-4 .ff-drift{animation-delay:.8s}@keyframes ff-blink{0%,95%,to{transform:translateY(0)}96%,98%{transform:translateY(18px)}}[data-mood=idle] .ff-lid--open,[data-mood=look] .ff-lid--open,[data-mood=shy] .ff-lid--open,[data-mood=peek] .ff-lid--open,[data-mood=error] .ff-lid--open{animation:ff-blink 6.3s ease-in-out infinite}.ff-char-2 .ff-lid--open{animation-duration:8.9s;animation-delay:1.7s}.ff-char-3 .ff-lid--open{animation-duration:7.1s;animation-delay:3.9s}.ff-char-4 .ff-lid--open{animation-duration:10.3s;animation-delay:.9s}.ff-brows{opacity:0;transition:opacity .15s ease}[data-mood=error] .ff-brows{opacity:1}[data-mood=drowsy] .ff-lid,[data-mood=sleep] .ff-lid{transition:transform .9s ease}@keyframes ff-heavy-blink{0%,74%,to{transform:translateY(10px)}80%,92%{transform:translateY(17px)}}[data-mood=drowsy] .ff-stage-tired .ff-lid--half{animation:ff-heavy-blink 5.2s ease-in-out 1.2s infinite}[data-mood=drowsy] .ff-char-2.ff-stage-tired .ff-lid--half{animation-duration:6.4s;animation-delay:1.8s}[data-mood=drowsy] .ff-char-3.ff-stage-tired .ff-lid--half{animation-duration:5.7s;animation-delay:2.4s}[data-mood=drowsy] .ff-char-4.ff-stage-tired .ff-lid--half{animation-duration:7.1s;animation-delay:1.5s}.ff-stage-tired .ff-face{transform:translateY(4px);transition:transform 1.6s ease}.ff-stage-asleep .ff-face{transform:translateY(7px);transition:transform 1.4s ease}.ff-stage-tired .ff-pupil,.ff-stage-asleep .ff-pupil{transform:translateY(3px);transition:transform 1.4s ease}[data-mood=drowsy] .ff-lean,[data-mood=sleep] .ff-lean{transform:rotate(0);transition:transform 1.8s ease}@keyframes ff-appear{0%{opacity:0}to{opacity:1}}.ff-stage-asleep .ff-closedline{animation:ff-appear .3s ease .55s both}@keyframes ff-z-float{0%{opacity:0;transform:translateY(4px)}35%,65%{opacity:.7}to{opacity:0;transform:translateY(-8px)}}.ff-z{animation:ff-z-float 3.6s ease-in-out infinite}.ff-z-2{animation-delay:.6s}.ff-z-3{animation-delay:1.2s}.ff-zzz text{fill:var(--ff-zzz)}@keyframes ff-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.ff-char{animation:ff-bob 4.6s ease-in-out infinite}.ff-char-2{animation-delay:.7s}.ff-char-3{animation-delay:1.4s}.ff-char-4{animation-delay:2.1s}@keyframes ff-shake{0%{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}to{transform:translateY(4px)}}[data-mood=error] .ff-char{transform:translateY(4px);animation:ff-shake .33s ease-in-out 1}[data-mood=error] .ff-char-2{animation-delay:.05s}[data-mood=error] .ff-char-3{animation-delay:.1s}[data-mood=error] .ff-char-4{animation-delay:.15s}[data-mood=error] .ff-lid{transform:translateY(6px)}@keyframes ff-hop{0%,to{transform:translateY(0)}40%{transform:translateY(-10px)}}[data-mood=success] .ff-char{animation:ff-hop .5s ease-in-out 1}[data-mood=success] .ff-char-2{animation-delay:.06s}[data-mood=success] .ff-char-3{animation-delay:.12s}[data-mood=success] .ff-char-4{animation-delay:.18s}@media(prefers-reduced-motion:reduce){.ff-char,[data-mood] .ff-char,.ff-drift,.ff-z{animation:none!important}}:root{--demo-bg: #eef1f5;--demo-panel: #e4e9f1;--demo-text: #14171d;--demo-muted: #5a6276;--demo-border: rgba(18, 24, 38, .1);--demo-chip: rgba(18, 24, 38, .05);--demo-chip-on: #14171d;--demo-chip-on-text: #ffffff;--demo-field: #ffffff}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--demo-bg: #0a0b12;--demo-panel: #12141d;--demo-text: #eceef5;--demo-muted: #969cb0;--demo-border: rgba(255, 255, 255, .07);--demo-chip: rgba(255, 255, 255, .06);--demo-chip-on: #eceef5;--demo-chip-on-text: #0a0b12;--demo-field: #0a0b12}}:root[data-theme=dark]{--demo-bg: #0a0b12;--demo-panel: #12141d;--demo-text: #eceef5;--demo-muted: #969cb0;--demo-border: rgba(255, 255, 255, .07);--demo-chip: rgba(255, 255, 255, .06);--demo-chip-on: #eceef5;--demo-chip-on-text: #0a0b12;--demo-field: #0a0b12}*{box-sizing:border-box}html{color-scheme:light dark}body{margin:0;font:15px/1.5 system-ui,-apple-system,Segoe UI,sans-serif;color:var(--demo-text);background:var(--demo-bg);transition:background .25s ease,color .25s ease}a{color:inherit}button{font:inherit;color:inherit}.demo{min-height:100vh;display:grid;grid-template-rows:auto 1fr auto;max-width:1100px;margin:0 auto;padding:0 4vw}.demo__bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;flex-wrap:wrap}.demo__brand{display:inline-flex;align-items:center;gap:10px;font-weight:650;letter-spacing:-.01em;text-decoration:none}.demo__logo{width:18px;height:18px;background:var(--ff-char-1, #b7c4ec);clip-path:polygon(50% 0,100% 100%,0 100%)}.demo__controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.demo__seg{display:inline-flex;padding:3px;border-radius:999px;background:var(--demo-chip)}.demo__seg button,.demo__moods button{border:0;background:transparent;padding:5px 10px;border-radius:999px;font-size:12.5px;cursor:pointer;text-transform:lowercase;color:var(--demo-muted);transition:background .15s ease,color .15s ease}.demo__seg button:hover,.demo__moods button:hover{color:var(--demo-text)}.demo__seg button[aria-pressed=true],.demo__moods button[aria-pressed=true]{background:var(--demo-chip-on);color:var(--demo-chip-on-text)}.demo__gh{font-size:13px;padding:6px 12px;border:1px solid var(--demo-border);border-radius:999px;text-decoration:none}.demo__gh:hover{border-color:var(--demo-muted)}.demo__body{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:4vw;padding:2vw 0 4vw}@media(max-width:760px){.demo__body{grid-template-columns:1fr}}.demo__panel{display:flex;flex-direction:column;background:var(--demo-panel);border:1px solid var(--demo-border);border-radius:20px;padding:18px 18px 14px;transition:background .25s ease}.demo__panel .ff-stage{transition:filter .2s ease}.demo__moods{display:flex;flex-wrap:wrap;justify-content:center;gap:2px;margin-top:6px}.demo__moods button{padding:4px 7px;font-size:11.5px}.demo__moods .demo__live{margin-right:4px;outline:1px dashed var(--demo-border)}.demo__mood{margin:10px 0 0;font-family:ui-monospace,Menlo,monospace;font-size:12px;color:var(--demo-muted);text-align:center}.demo__form h1{margin:0 0 6px;font-size:28px;letter-spacing:-.02em}.demo__hint{color:var(--demo-muted);font-size:13.5px;margin:0}.demo__form form{display:grid;gap:14px;margin:22px 0 16px}.demo__form label{display:grid;gap:6px;font-size:13px}.demo__form input[type=email],.demo__form input[type=password],.demo__form input[type=text]{padding:11px 12px;font-size:15px;color:var(--demo-text);background:var(--demo-field);border:1px solid var(--demo-border);border-radius:10px;outline:none;transition:border-color .15s ease,box-shadow .15s ease}.demo__form input:focus{border-color:var(--ff-char-1, #b7c4ec);box-shadow:0 0 0 3px color-mix(in srgb,var(--ff-char-1, #b7c4ec) 35%,transparent)}.demo__check{display:flex!important;align-items:center;gap:8px}.demo__form button[type=submit]{padding:12px 16px;font-size:15px;font-weight:600;border:0;border-radius:10px;background:var(--ff-char-1, #b7c4ec);color:var(--ff-ink, #1c2030);cursor:pointer;transition:filter .15s ease,transform .1s ease}.demo__form button[type=submit]:hover{filter:brightness(1.05)}.demo__form button[type=submit]:active{transform:translateY(1px)}.demo__note{margin:0;padding:10px 12px;border:1px solid var(--demo-border);border-radius:10px;font-size:13px}.demo__foot{padding:16px 0 28px;font-size:13px;color:var(--demo-muted);text-align:center}