@font-face{font-family:Fredoka;font-style:normal;font-display:swap;font-weight:300 700;src:url(/assets/fredoka-latin-wght-normal-DM6njrJ3.woff2)format("woff2-variations")}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--ink:#23304f;--ink-soft:#5a6685;--cream:#fff8ea;--cream-2:#fbeccd;--line:#e8d6ae;--teal:#17a398;--teal-deep:#0e7a72;--sun:#ffc93c;--sun-deep:#d8972a;--coral:#f4795b;--font:"Fredoka", "Trebuchet MS", Verdana, sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{overscroll-behavior:none;height:100%;font-family:var(--font);color:var(--ink);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;background:#23304f;margin:0;overflow:hidden}#game{touch-action:none;display:block;position:fixed;inset:0}#ui{pointer-events:none;position:fixed;inset:0}#ui button,#ui .toast,#ui .tray-panel,#ui .card-overlay{pointer-events:auto}#boot{color:#fff;justify-content:center;align-items:center;font-size:2rem;font-weight:600;display:flex;position:fixed;inset:0}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;background:0 0;border:0;padding:0}:focus-visible{outline:4px solid var(--sun-deep);outline-offset:2px}.sound-button{top:calc(10px + env(safe-area-inset-top));right:calc(10px + env(safe-area-inset-right));background:var(--cream);width:54px;height:54px;color:var(--ink);box-shadow:0 4px 0 var(--line), 0 6px 14px #1e284640;z-index:30;border-radius:18px;justify-content:center;align-items:center;display:flex;position:fixed}.sound-button:active{box-shadow:0 1px 0 var(--line);transform:translateY(3px)}.bench-ui,.valley-ui{position:absolute;inset:0}.bench-ui[hidden],.valley-ui[hidden]{display:none}.name-tag{top:calc(10px + env(safe-area-inset-top));left:calc(10px + env(safe-area-inset-left));background:var(--cream);max-width:46vw;min-height:54px;box-shadow:0 4px 0 var(--line), 0 6px 14px #1e284640;white-space:nowrap;text-overflow:ellipsis;border-radius:18px;padding:0 20px;font-size:1.4rem;font-weight:600;position:absolute;overflow:hidden}.name-tag:active{box-shadow:0 1px 0 var(--line);transform:translateY(3px)}.go-button{background:var(--sun);color:#4b2f05;min-width:136px;min-height:72px;box-shadow:0 7px 0 var(--sun-deep), 0 10px 22px #1e28464d;z-index:5;border-radius:26px;padding:0 32px;font-size:2rem;font-weight:700;position:absolute}.go-button:active{box-shadow:0 2px 0 var(--sun-deep);transform:translateY(5px)}.go-button.is-inviting{animation:.95s ease-in-out infinite invite}.wrench.is-inviting{animation:.95s ease-in-out 4 invite}@keyframes invite{50%{transform:translateY(-6px)scale(1.05)}}.tray-panel{background:var(--cream);z-index:4;flex-direction:column;gap:10px;padding:12px;display:flex;position:absolute;box-shadow:0 -6px 26px #1e284640}.tray-panel.is-inviting{animation:.7s ease-in-out 3 tray-hop}@keyframes tray-hop{50%{transform:translateY(-10px)}}.tabs{gap:6px;display:flex}.tab{background:var(--cream-2);border-radius:14px;flex:1;min-height:50px;font-size:1.05rem;font-weight:600}.tab.is-on{background:var(--teal);color:#fff}.tray{flex:1;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));align-content:start;gap:8px;padding-top:8px;display:grid;overflow-y:auto}.tray[data-tab=paint],.tray[data-tab=body]{grid-template-columns:repeat(auto-fill,minmax(62px,1fr))}.part{min-height:96px;box-shadow:0 3px 0 var(--line), inset 0 0 0 2px var(--cream-2);touch-action:none;background:#fff;border-radius:16px;flex-direction:column;align-items:center;gap:0;padding:4px 2px 6px;display:flex;position:relative}.part:active{box-shadow:0 1px 0 var(--line), inset 0 0 0 2px var(--cream-2);transform:translateY(2px)}.part canvas{pointer-events:none;width:64px;height:64px}.part small{text-align:center;pointer-events:none;font-size:.8rem;font-weight:500;line-height:1.05}.part.is-worn{box-shadow:0 3px 0 var(--teal-deep), inset 0 0 0 3px var(--teal);background:#e3f7f3}.part.is-worn:after{content:"";background:var(--teal);width:16px;height:16px;box-shadow:inset 0 0 0 4px var(--teal), inset 0 0 0 16px #fff;border-radius:50%;position:absolute;top:7px;right:7px}.part.is-new,.swatch.is-new{box-shadow:0 3px 0 var(--sun-deep), inset 0 0 0 3px var(--sun);animation:.95s ease-in-out 4 invite}.part.is-new:before,.swatch.is-new:before,.wrench.has-new:after{content:"NEW";background:var(--coral);color:#fff;pointer-events:none;z-index:1;border-radius:9px;padding:1px 7px;font-size:.72rem;font-weight:700;line-height:1.3;position:absolute;top:-7px;left:50%;transform:translate(-50%)}.swatch{position:relative}.wrench.has-new:after{inset:auto -6px -7px auto;transform:none}.tab{position:relative}.tab.has-new:after{content:"";background:var(--coral);border-radius:50%;width:11px;height:11px;position:absolute;top:5px;right:5px;box-shadow:0 0 0 2px #fff}.part.is-locked{background:var(--cream-2);box-shadow:inset 0 0 0 2px var(--line);cursor:default;color:var(--ink-soft)}.part-mystery{color:#b79a66;justify-content:center;align-items:center;height:64px;font-size:2.2rem;font-weight:700;display:flex}.swatch{aspect-ratio:1;border-radius:50%;width:100%;box-shadow:0 3px #1e284638,inset 0 0 0 3px #ffffff8c}.swatch.is-on{outline:4px solid var(--ink);outline-offset:2px}.swatch.is-sparkle{background:conic-gradient(#ffe27a,#ff9edb,#8ce4ff,#ffe27a)}.size,.soft-button{min-height:54px;box-shadow:0 3px 0 var(--line), inset 0 0 0 2px var(--cream-2);background:#fff;border-radius:16px;padding:0 14px;font-weight:600}.size.is-on{background:var(--teal);color:#fff;box-shadow:0 3px 0 var(--teal-deep)}.wash{grid-column:1/-1}.swatch.is-eraser{background:#fff;padding:18%}.swatch.is-eraser svg{width:100%;height:100%;display:block}.paint-actions{grid-column:1/-1;grid-template-columns:1fr 1fr;gap:8px;display:grid}.soft-button:disabled{opacity:.45;cursor:default}.soft-button.small{flex-shrink:0;min-height:50px;padding:0 14px}.tray-help{color:var(--ink-soft);grid-column:1/-1;margin:0;font-size:1rem}.big-button{background:var(--teal);color:#fff;min-height:60px;box-shadow:0 5px 0 var(--teal-deep);border-radius:20px;padding:0 26px;font-size:1.25rem;font-weight:600}.big-button:active{box-shadow:0 1px 0 var(--teal-deep);transform:translateY(4px)}.big-button.small{flex-shrink:0;min-height:50px;padding:0 16px;font-size:1.05rem}.name-dialog{background:var(--cream);width:min(92vw,400px);color:var(--ink);font-family:var(--font);-webkit-user-select:text;user-select:text;border:0;border-radius:26px;padding:22px;box-shadow:0 18px 50px #00000059}.name-dialog::backdrop{background:#141e3c80}.name-dialog h2{margin:0 0 12px;font-size:1.5rem;font-weight:600}.name-dialog input{border:3px solid var(--line);width:100%;min-height:60px;font:inherit;color:var(--ink);background:#fff;border-radius:16px;padding:0 16px;font-size:1.5rem}.name-actions{justify-content:space-between;gap:10px;margin-top:14px;display:flex}@media (width<=620px){.wrench span,.card-button span{display:none}.wrench,.card-button{padding:0 12px}}@media (orientation:landscape){.tray-panel{width:clamp(280px,30vw,390px);padding-top:calc(74px + env(safe-area-inset-top));padding-right:calc(12px + env(safe-area-inset-right));padding-bottom:calc(12px + env(safe-area-inset-bottom));top:0;bottom:0;right:0}.go-button{right:calc(clamp(280px,30vw,390px) + 18px);bottom:calc(18px + env(safe-area-inset-bottom))}}@media (orientation:portrait){.tray-panel{height:38dvh;padding-bottom:calc(12px + env(safe-area-inset-bottom));border-radius:26px 26px 0 0;bottom:0;left:0;right:0}.go-button{bottom:calc(38dvh + 16px);right:14px}}@media (height<=480px){.go-button{min-width:110px;min-height:58px;font-size:1.6rem}.tabs{gap:4px}.tab{min-height:44px;font-size:.92rem}.part{min-height:84px}.part canvas{width:52px;height:52px}.tray{grid-template-columns:repeat(auto-fill,minmax(72px,1fr))}}.hud-left{top:calc(10px + env(safe-area-inset-top));left:calc(10px + env(safe-area-inset-left));gap:8px;display:flex;position:absolute}.card-button{background:var(--cream);min-height:54px;color:var(--teal-deep);box-shadow:0 4px 0 var(--line), 0 6px 14px #1e284640;border-radius:18px;align-items:center;gap:6px;padding:0 14px 0 10px;font-size:1.15rem;font-weight:600;display:flex}.card-button[hidden]{display:none}.card-button:active{box-shadow:0 1px 0 var(--line);transform:translateY(3px)}.wrench{background:var(--sun);color:#4b2f05;min-height:54px;box-shadow:0 4px 0 var(--sun-deep), 0 6px 14px #1e284640;border-radius:18px;align-items:center;gap:8px;padding:0 16px 0 12px;font-size:1.15rem;font-weight:600;display:flex;position:relative}.wrench:active{box-shadow:0 1px 0 var(--sun-deep);transform:translateY(3px)}.friends{top:calc(14px + env(safe-area-inset-top));background:#fff8eae0;border-radius:22px;gap:8px;padding:8px 12px;display:flex;position:absolute;left:50%;transform:translate(-50%)}.friend{background:#e3d6b6;border-radius:50%;width:28px;height:28px;position:relative;box-shadow:inset 0 0 0 2px #cdbb91}.friend.is-found{box-shadow:inset 0 -4px #1e1e3c2e}.friend.is-found:before,.friend.is-found:after{content:"";background:#fff;border-radius:50%;width:7px;height:7px;position:absolute;top:8px;box-shadow:inset 2px 1px #1b2530}.friend.is-found:before{left:5px}.friend.is-found:after{right:5px}.touch-hint{left:50%;bottom:calc(26px + env(safe-area-inset-bottom));color:#fff;text-align:center;background:#23304fdb;border-radius:22px;max-width:88vw;padding:10px 20px;font-size:1.2rem;font-weight:500;animation:1.6s ease-in-out infinite hint-bob;position:absolute;transform:translate(-50%)}.touch-hint[hidden]{display:none}@keyframes hint-bob{50%{transform:translate(-50%,-6px)}}.toast{left:50%;top:calc(76px + env(safe-area-inset-top));background:var(--cream);width:max-content;max-width:min(92vw,520px);box-shadow:0 5px 0 var(--line), 0 12px 28px #1e28464d;border-radius:22px;align-items:center;gap:10px;padding:10px 14px;animation:.4s cubic-bezier(.2,1.5,.4,1) toast-in;display:flex;position:absolute;transform:translate(-50%)}.toast[hidden]{display:none}.toast canvas{flex-shrink:0;width:62px;height:62px}.toast-text{flex-direction:column;line-height:1.15;display:flex}.toast-text strong{font-size:1.2rem;font-weight:600}.toast-text span{color:var(--ink-soft);font-size:1rem}.toast-actions{flex-shrink:0;gap:6px;display:flex}@media (width<=620px){.toast{flex-wrap:wrap;justify-content:center;width:calc(100vw - 24px)}.toast-text{flex:60%}.toast-actions{width:100%}.toast-actions button{flex:1}}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,-24px)scale(.86)}}.card-overlay{z-index:40;background:#141e3c73;justify-content:center;align-items:center;padding:12px;animation:.35s fade;display:flex;position:absolute;inset:0;overflow-y:auto}@keyframes fade{0%{opacity:0}}.creature-card{background:var(--cream);width:min(100%,410px);box-shadow:0 0 0 6px var(--sun), 0 20px 50px #0006;text-align:center;border-radius:28px;flex-direction:column;gap:8px;margin:auto;padding:14px;animation:.55s cubic-bezier(.2,1.5,.4,1) card-pop;display:flex;position:relative}.creature-card.is-complete{box-shadow:0 0 0 7px var(--sun), 0 0 0 12px var(--coral), 0 20px 50px #0006}.card-ribbon{background:var(--coral);color:#fff;white-space:nowrap;border-radius:14px;padding:5px 20px;font-size:1.35rem;font-weight:700;position:absolute;top:-14px;left:50%;transform:translate(-50%)rotate(-3deg);box-shadow:0 4px #c9553b}.goal-card{background:var(--cream);text-align:center;width:min(100%,420px);box-shadow:0 0 0 6px var(--teal), 0 20px 50px #0006;border-radius:28px;flex-direction:column;align-items:center;gap:8px;margin:auto;padding:18px;animation:.5s cubic-bezier(.2,1.5,.4,1) card-pop;display:flex}.goal-card canvas{object-fit:contain;width:240px;height:100px;max-height:22dvh}.goal-card h2{margin:0;font-size:1.8rem;font-weight:700;line-height:1.1}.goal-card p{margin:0 0 6px;font-size:1.15rem;line-height:1.3}@keyframes card-pop{0%{opacity:0;transform:scale(.6)rotate(-6deg)}}.card-portrait{object-fit:cover;border-radius:18px;width:100%;height:auto;max-height:34dvh}.creature-card h2{margin:0;font-size:1.9rem;font-weight:700;line-height:1.05}.card-blurb{margin:0;font-size:1.05rem;line-height:1.25}.card-stats{text-align:left;grid-template-columns:repeat(2,auto 1fr);align-items:center;gap:4px 8px;margin:0;display:grid}.card-stats dt{font-size:.9rem;font-weight:600}.card-stats dd{gap:3px;margin:0;display:flex}.card-stats span{background:var(--cream-2);width:12px;height:12px;box-shadow:inset 0 0 0 1.5px var(--line);border-radius:50%}.card-stats span.on{background:var(--coral);box-shadow:none}.card-found{color:var(--ink-soft);margin:0;font-size:.98rem;line-height:1.2}.card-actions{flex-wrap:wrap;justify-content:center;gap:8px;margin-top:4px;display:flex}@media (prefers-reduced-motion:reduce){*,:before,:after{animation-duration:.01ms!important;animation-iteration-count:1!important}}
