@charset "utf-8";
@import url("./fonts.css");

:root{color-scheme:light;--ink:#3c4236;--muted:#7e8473;--accent:#52754d;--line:#dddcd0;--character-size:170px}
*{box-sizing:border-box}body{margin:0;font-family:var(--font-ui);-webkit-font-smoothing:antialiased}button,input,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit}button:disabled{cursor:default;opacity:.45}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #8aa6cb;outline-offset:5px}button{touch-action:manipulation}svg{display:block}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
[data-character-picker]{display:flex;align-items:flex-start;justify-content:center;gap:12px;max-width:100%;padding:10px 6px 12px;overflow-x:auto;scrollbar-width:thin;scrollbar-color:#d0d4c3 transparent;scroll-padding:12px}
.character-option{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:9px;width:75px;padding:4px 3px;border:0;background:transparent;color:var(--muted);font-size:11px;font-weight:600;letter-spacing:.025em;transition:color .18s,transform .18s}
.character-avatar{position:relative;display:grid;place-items:center;width:61px;height:61px;border-radius:50%;border:1px solid #e2e3da;background:var(--character-color,#f8f5e5);box-shadow:0 0 0 4px transparent;overflow:hidden;transition:box-shadow .2s,border-color .2s,transform .2s;background-clip:padding-box}
.character-avatar>svg{width:88%;height:90%;margin-top:7px;overflow:hidden}.character-avatar>img{width:88%;height:88%;object-fit:contain;object-position:center;display:block}.character-label{white-space:nowrap}.character-option:hover .character-avatar{transform:translateY(-3px)}.character-option[aria-pressed=true]{color:var(--ink)}.character-option[aria-pressed=true] .character-avatar{border-color:var(--accent);box-shadow:0 0 0 3px #fff,0 0 0 5px var(--accent)}.character-option[aria-pressed=true] .character-label{color:var(--accent)}
.character-art{width:var(--character-size);height:calc(var(--character-size)*1.15);display:flex;align-items:flex-end;justify-content:center;transform-origin:50% 96%;isolation:isolate}.character-art>svg{width:100%;height:100%;overflow:hidden;filter:drop-shadow(0 4px 0 #5b664810)}.is-running .character-art,.is-preview .character-art{animation:work-sway 1.5s ease-in-out infinite}.is-paused .character-art{transform:rotate(-3deg) translateY(3px)}.is-complete .character-art{animation:little-jump .6s ease-in-out 3}.character-pop{animation:little-jump .45s ease-out!important}
[data-grass-field]{pointer-events:none;overflow:hidden}.grass-tuft{position:absolute;display:block;width:33px;height:43px;transform-origin:50% 95%;transition:opacity .5s,transform .6s}.grass-tuft svg{width:100%;height:100%}.grass-tuft.is-picked{opacity:0;transform:translateY(-22px) rotate(18deg) scale(.65)}[data-role=progress-fill]{transition:width .4s linear}.language-control{background:transparent;color:inherit;border:0;padding:8px 18px 8px 7px;font-size:12px;cursor:pointer}.sound-button[aria-pressed=true]{opacity:1}.sound-button[aria-pressed=false]{opacity:.65}.sound-button{white-space:nowrap}body.is-preview [data-role=state-label]{opacity:.8}
@keyframes work-sway{0%,100%{transform:translateY(0) rotate(-3deg)}35%{transform:translateY(4px) rotate(5deg)}62%{transform:translateY(-2px) rotate(-5deg)}}@keyframes little-jump{0%,100%{transform:translateY(0) rotate(0)}40%{transform:translateY(-15px) rotate(-4deg)}70%{transform:translateY(-5px) rotate(3deg)}}
@media(max-width:700px){[data-character-picker]{justify-content:flex-start;gap:11px;padding:10px 5px 15px}.character-option{width:64px;font-size:10px}.character-avatar{width:54px;height:54px}.character-art{--character-size:135px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}}

.character-art>img{width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 4px 0 #5b664810)}