:root{--pink:#f28cb5;--pink-d:#d9669a;--lilac:#b48ee8;--ink:#6b3a5b;--cream:#fff8fb;--card:#fff8fbf0;--shadow:0 10px 30px #783c6e40;color:var(--ink);font-family:Fredoka,Trebuchet MS,system-ui,sans-serif}*{box-sizing:border-box}html,body{background:#fde3ef;height:100%;margin:0;overflow:hidden}canvas#game{width:100%;height:100%;display:block;position:fixed;inset:0}[hidden]{display:none!important}a{color:var(--pink-d)}.btn{font:inherit;color:#fff;cursor:pointer;background:linear-gradient(180deg, #f7a1c6, var(--pink-d));border:0;border-radius:999px;padding:10px 20px;font-size:17px;font-weight:600;transition:transform 80ms;box-shadow:0 4px #b84f80,0 6px 14px #b446784d}.btn:hover:not(:disabled){transform:translateY(-1px)}.btn:active:not(:disabled){transform:translateY(2px);box-shadow:0 2px #b84f80}.btn:disabled{cursor:default;background:#d9c8d3;box-shadow:0 4px #bba9b5}.btn.big{padding:14px 34px;font-size:22px}.btn.ghost{color:var(--ink);background:#fff;border:2px solid #f3d6e6;box-shadow:0 3px #e6cfe0}.btn.buy{color:#6b4a10;background:linear-gradient(#ffd86b,#f2b52c);box-shadow:0 4px #c98d12}#start,#pause{background:radial-gradient(circle at 50% 40%,#fff0f859,#c8a0dc59);place-items:center;display:grid;position:fixed;inset:0}.card-start{background:var(--card);text-align:center;width:calc(100% - 32px);max-width:520px;box-shadow:var(--shadow);border:4px solid #fff;border-radius:32px;padding:34px 44px}.crown{font-size:64px;animation:2.4s ease-in-out infinite bob}@keyframes bob{50%{transform:translateY(-8px)rotate(-4deg)}}h1{color:var(--pink-d);letter-spacing:.5px;text-shadow:0 3px #fff;margin:6px 0;font-size:38px}h2{margin:0 0 14px}.sub{margin:0 0 18px;font-size:17px}#bar{background:#f6dce9;border-radius:99px;height:12px;margin:0 20px;overflow:hidden}#bar i{background:linear-gradient(90deg, var(--pink), var(--lilac));width:0;height:100%;transition:width .3s;display:block}#loading{min-height:18px;margin:8px 0 12px;font-size:14px}#login{text-align:left;gap:12px;display:grid}#login label{gap:4px;font-weight:600;display:grid}#login input{font:inherit;color:var(--ink);background:#fff;border:2px solid #f3d6e6;border-radius:14px;padding:10px 14px;font-size:18px}#login input:focus{border-color:var(--pink);outline:none}#login .btn{justify-self:center;margin-top:6px}.note{margin:10px 0 0;font-size:14px}.note.err,.hint.err{color:#d43d5c;font-weight:600}.hello{margin:0 0 14px;font-size:22px}.opts{flex-wrap:wrap;justify-content:center;gap:8px;margin:18px 0 8px;display:flex}.opts .btn{padding:7px 14px;font-size:14px}.help{text-align:left;padding-left:20px;font-size:15px;line-height:1.6}.card-start{position:relative}.help-btn{font:inherit;cursor:pointer;color:#fff;background:linear-gradient(180deg, #c9a8f2, var(--lilac));border:3px solid #fff;border-radius:50%;width:44px;height:44px;font-size:24px;font-weight:700;box-shadow:0 4px 12px #783c6e4d}.help-btn:hover{transform:scale(1.08)}.card-start .help-btn{position:absolute;top:14px;right:14px}#help-hud{z-index:5;position:fixed;top:22px;right:210px}#help{z-index:10;background:#5a285066;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.help-card{background:var(--cream);box-shadow:var(--shadow);border:5px solid #fff;border-radius:28px;width:min(780px,100vw - 32px);max-height:calc(100vh - 32px);padding:26px 34px 22px;font-size:16px;line-height:1.5;position:relative;overflow-y:auto}.help-card h2{color:var(--pink-d);margin:0 0 8px;font-size:30px}.help-card h3{color:var(--pink-d);margin:22px 0 6px;font-size:20px}.help-card p{margin:6px 0}.help-card ul{margin:6px 0;padding-left:22px}.help-card .lead{font-size:17px}.help-card .close{padding:6px 14px;position:absolute;top:16px;right:16px}.help-card .center{text-align:center;margin-top:22px}.keys-grid{grid-template-columns:auto 1fr;align-items:baseline;gap:6px 14px;display:grid}.keys-grid>span:nth-child(odd){white-space:nowrap}.help-card b{color:var(--ink)}.keys-grid b{background:#fff;border:2px solid #f3d6e6;border-bottom-width:4px;border-radius:8px;padding:0 8px;font-size:14px;display:inline-block}#hud{pointer-events:none;position:fixed;inset:0}#purse{background:var(--card);box-shadow:var(--shadow);color:#9a6b12;border:3px solid #ffe7a3;border-radius:999px;align-items:center;gap:8px;padding:6px 18px 6px 10px;font-size:26px;font-weight:700;display:flex}#purse .coin{font-size:30px}#purse.bump{animation:.5s bump}@keyframes bump{30%{transform:scale(1.25)}}#dragon{background:var(--card);width:190px;box-shadow:var(--shadow);border:3px solid #fff;border-radius:18px;gap:4px;padding:8px 12px;font-size:15px;display:grid}#dragon .dn{font-weight:600}#dragon .bag{flex-wrap:wrap;gap:6px;font-size:16px;font-weight:600;display:flex}#dragon small{opacity:.8;font-size:12px}#dragon small b{background:var(--pink);color:#fff;border-radius:6px;padding:0 5px}.tummy{background:#f3e3ec;border-radius:999px;height:12px;overflow:hidden}.tummy i{background:linear-gradient(90deg,#8fdcb8,#5cc49a);border-radius:999px;height:100%;transition:width .6s;display:block}.tummy.ok i{background:linear-gradient(90deg,#ffe57a,#f2c94c)}.tummy.hungry i{background:linear-gradient(90deg,#ffb36b,#f28a4c)}.tummy.sleepy i{width:0!important}.tummy.sleepy{box-shadow:inset 0 0 0 2px #f28a4c}.tummy-row{gap:4px;margin-bottom:10px;font-size:14px;display:grid}.selection .btns{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.selection .dname{font:inherit;text-align:center;width:80%;color:var(--ink);border:3px solid #f3d6e6;border-radius:14px;margin-bottom:10px;padding:8px 12px;font-size:20px}.card .nm small{opacity:.75;font-size:12px}#minimap{width:180px;height:180px;box-shadow:var(--shadow);border:5px solid #fff;border-radius:50%;position:absolute;top:16px;right:16px}#crosshair{background:#ffffffe6;border-radius:50%;width:8px;height:8px;margin:-4px;position:absolute;top:50%;left:50%;box-shadow:0 0 0 2px #f28cb5b3}#prompt{background:var(--card);box-shadow:var(--shadow);white-space:nowrap;border:3px solid #fff;border-radius:999px;padding:10px 22px;font-size:20px;position:absolute;bottom:120px;left:50%;transform:translate(-50%)}#prompt b{background:var(--pink);color:#fff;border-radius:8px;margin-right:4px;padding:0 8px;display:inline-block}#toast{justify-items:center;gap:8px;display:grid;position:absolute;top:76px;left:50%;transform:translate(-50%)}.toast{background:var(--card);text-align:center;box-shadow:var(--shadow);border:3px solid #fff;border-radius:18px;padding:10px 20px;font-size:19px;transition:opacity .5s,transform .5s;animation:.35s pop}.toast small{font-size:14px}.toast.out{opacity:0;transform:translateY(-10px)}@keyframes pop{0%{opacity:0;transform:scale(.6)}}#emotes{gap:6px;display:flex;position:absolute;bottom:44px;left:16px}#emotes span{background:var(--card);border-radius:12px;padding:3px 8px;font-size:20px;box-shadow:0 3px 10px #783c6e33}#emotes b{color:var(--pink-d);vertical-align:top;margin-right:3px;font-size:12px}#keys{color:#fff;text-shadow:0 1px 3px #5a1e46cc;font-size:13px;position:absolute;bottom:14px;left:16px}.emote-pop{font-size:72px;animation:1.8s forwards float;position:absolute;top:32%;left:50%;transform:translate(-50%)}@keyframes float{0%{opacity:0;transform:translate(-50%,20px)scale(.5)}20%{opacity:1;transform:translate(-50%)scale(1)}to{opacity:0;transform:translate(-50%,-60px)}}#bigmap{background:#5a285059;place-content:center;justify-items:center;display:grid;position:absolute;inset:0}#bigmap canvas{width:min(84vh,92vw);height:min(84vh,92vw);box-shadow:var(--shadow);border:6px solid #fff;border-radius:24px}#bigmap p{color:#fff;text-shadow:0 1px 3px #00000080;margin:8px}.panel{background:var(--cream);box-shadow:var(--shadow);border:5px solid #fff;border-radius:28px;grid-template-rows:auto 1fr;display:grid;position:fixed;inset:3vh 3vw;overflow:hidden}.panel header{background:linear-gradient(90deg,#fde2ee,#ece1fb);grid-template-columns:auto 1fr auto auto;align-items:center;gap:16px;padding:14px 22px;display:grid}.panel-title{color:var(--pink-d);margin:0;font-size:28px}.panel-greet{margin:0;font-size:16px}.panel .purse{color:#9a6b12;background:#fff;border:3px solid #ffe7a3;border-radius:999px;padding:4px 16px;font-size:24px;font-weight:700}.panel-body{grid-template-columns:1fr minmax(280px,36%);min-height:0;display:grid}.panel .left{grid-template-rows:auto 1fr;min-height:0;padding:14px 8px 14px 22px;display:grid}.tabs{flex-wrap:wrap;gap:6px;margin-bottom:12px;display:flex}.tabs button{font:inherit;color:var(--ink);cursor:pointer;background:#fff;border:2px solid #f3d6e6;border-radius:999px;padding:6px 14px;font-size:15px;font-weight:600}.tabs button.on{background:var(--pink);border-color:var(--pink);color:#fff}.grid{grid-template-columns:repeat(auto-fill,minmax(132px,1fr));align-content:start;gap:10px;padding:4px 10px 10px 2px;display:grid;overflow-y:auto}.card{font:inherit;color:var(--ink);cursor:pointer;background:#fff;border:3px solid #f6e3ee;border-radius:18px;justify-items:center;gap:4px;padding:10px 6px 8px;transition:transform .1s,border-color .1s;display:grid;position:relative}.card:hover{border-color:#f7bcd5;transform:translateY(-2px)}.card.sel{border-color:var(--pink);box-shadow:0 0 0 3px #fbd3e3}.card.worn{background:#fff5fa}.card .ic{font-size:34px;line-height:1.1}.card .sw{border:2px solid #fff;border-radius:50%;width:18px;height:18px;position:absolute;top:8px;right:8px;box-shadow:0 0 0 1px #e6cfe0}.card .sw.rb{background:conic-gradient(#ff9aa2,#ffc49b,#fff09a,#b5ead7,#a6d4f5,#c7b8f0,#ff9aa2)!important}.card .nm{text-align:center;align-items:center;min-height:34px;font-size:14px;font-weight:500;line-height:1.2;display:grid}.badge{border-radius:999px;padding:2px 10px;font-size:13px;font-weight:700}.badge.price{color:#9a6b12;background:#fff3cc}.badge.own-b{color:#2f8a57;background:#e3f6ea}.badge.worn-b{background:var(--pink);color:#fff}.panel .right{background:radial-gradient(circle at 50% 35%,#fff,#fbe6f0 70%);border-left:3px solid #fbe3ef;grid-template-rows:1fr auto auto;min-height:0;display:grid}#preview{cursor:grab;width:100%;height:100%;min-height:0;display:block}.drag-hint{text-align:center;opacity:.7;margin:0;font-size:13px}.selection{text-align:center;min-height:110px;padding:12px 20px 20px}.selection .nm{margin:0 0 10px;font-size:20px;font-weight:600}.selection .hint{margin:8px 0 0;font-size:15px}.panel.wardrobe header{background:linear-gradient(90deg,#fff3c4,#fde2ee)}#leftcol{flex-direction:column;align-items:flex-start;gap:10px;display:flex;position:absolute;top:16px;left:16px}#needs{background:var(--card);width:190px;box-shadow:var(--shadow);border:3px solid #fff;border-radius:18px;gap:4px;padding:7px 12px;display:grid}.need{grid-template-columns:22px 1fr;align-items:center;gap:6px;font-size:15px;display:grid}#quest{width:190px;box-shadow:var(--shadow);background:#fff7dc;border:3px solid #ffe7a3;border-radius:18px;padding:8px 12px;font-size:14px;line-height:1.35}#weather{background:var(--card);box-shadow:var(--shadow);white-space:nowrap;border:3px solid #fff;border-radius:999px;padding:6px 18px;font-size:17px;font-weight:600;position:absolute;top:18px;left:50%;transform:translate(-50%)}#sleep{z-index:6;text-align:center;color:#fff;text-shadow:0 3px 12px #28145099;place-items:center;font-size:46px;font-weight:700;animation:1s fadein;display:grid;position:fixed;inset:0}#sleep small{margin-top:8px;font-size:26px;display:block}#sleep.night{background:radial-gradient(circle at 50% 40%,#4a4590,#1c1840)}#sleep.morning{color:#9a4a7a;text-shadow:0 2px #fff;background:radial-gradient(circle at 50% 40%,#fff3c4,#f7a8c8);transition:opacity 1.4s}#sleep.gone{opacity:0}@keyframes fadein{0%{opacity:0}}#draw header{grid-template-columns:auto 1fr auto auto}.draw-task{margin:0;font-size:24px}.draw-task b{color:var(--pink-d)}#draw .btn.ghost{padding:7px 14px;font-size:15px}.draw-body{grid-template-columns:170px 1fr 190px;gap:16px;min-height:0;padding:16px;display:grid}.draw-example{text-align:center;background:#fff;border:3px solid #f6e3ee;border-radius:20px;align-self:start;padding:14px;font-size:15px}.ex-ic{font-size:96px;line-height:1.2}.draw-paper{place-items:center;min-width:0;min-height:0;display:grid}.draw-paper canvas{cursor:crosshair;touch-action:none;background:#fff;border-radius:12px;width:min(100%,134.286vh - 214.286px);height:auto;box-shadow:0 4px 18px #783c6e33}.draw-tools{flex-direction:column;align-items:stretch;gap:12px;display:flex}.draw-tools .tools,.draw-tools .sizes{justify-content:center;gap:6px;display:flex}.draw-tools .colors{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.draw-tools button:not(.btn){font:inherit;cursor:pointer;background:#fff;border:3px solid #f3d6e6;border-radius:12px;place-items:center;min-width:40px;min-height:40px;font-size:22px;display:grid}.draw-tools .colors button{aspect-ratio:1;border-radius:50%}.draw-tools .sizes i{background:var(--ink);border-radius:50%;display:block}.draw-tools button.on{border-color:var(--pink-d);box-shadow:0 0 0 3px #fbd3e3}.draw-msg{text-align:center;color:#d43d5c;min-height:22px;margin:0;font-weight:600}#banner{text-align:center;pointer-events:none;white-space:nowrap;color:#fff;text-shadow:0 3px 14px #5a1e46bf,0 0 2px #5a1e46e6;position:absolute;top:24%;left:50%;transform:translate(-50%)}#banner b{letter-spacing:.5px;font-size:44px;display:block}#banner small{opacity:.95;font-size:20px;font-weight:600;display:block}#banner.show{animation:4.2s forwards banner}@keyframes banner{0%{opacity:0;transform:translate(-50%,12px)}12%{opacity:1;transform:translate(-50%)}75%{opacity:1}to{opacity:0}}#travel{z-index:5;background:#5a28504d;place-items:center;display:grid;position:fixed;inset:0}#travel .stops{gap:10px;margin:0 0 12px;display:grid}#travel .stops .btn{font-size:19px}#travel .more{margin:0 0 14px}#sleep.ride{color:#7a3a6e;text-shadow:0 2px #fff;background:radial-gradient(circle at 50% 40%,#fde2ee,#c7a6f0);transition:opacity .9s}.pills{gap:8px;display:flex}#starpill{background:var(--card);color:#9a6b12;box-shadow:var(--shadow);border:3px solid #fff;border-radius:999px;align-items:center;gap:6px;padding:4px 14px 4px 8px;font-size:22px;font-weight:700;display:flex}#starpill .coin{font-size:24px}#tales{width:190px;box-shadow:var(--shadow);background:#f3ecff;border:3px solid #d9c8f5;border-radius:18px;gap:6px;padding:8px 12px;font-size:14px;line-height:1.35;display:grid}#talk{z-index:6;background:var(--card);width:min(720px,100% - 32px);box-shadow:var(--shadow);border:4px solid #fff;border-radius:26px;padding:16px 22px 12px;animation:.3s pop;position:fixed;bottom:40px;left:50%;transform:translate(-50%)}.tk-who{color:var(--pink-d);align-items:center;gap:10px;font-size:20px;display:flex}.tk-who small{color:#7a5aa8;margin-left:auto;font-size:14px}.tk-ic{font-size:38px}.tk-line{min-height:58px;margin:10px 0 12px;font-size:21px;line-height:1.4}.tk-btns{justify-content:flex-end;gap:10px;display:flex}.tk-keys{opacity:.65;text-align:right;margin:6px 0 0;font-size:12px}#reward{z-index:7;background:#5a285059;place-items:center;display:grid;position:fixed;inset:0}#reward .rw-stars{font-size:54px;animation:1.6s ease-in-out infinite bob}#reward .rw-title{color:#7a5aa8;margin:0 0 10px;font-size:22px;font-weight:700}#reward ul{text-align:left;margin:0 0 18px;padding-left:18px;font-size:17px;line-height:1.6}#book,#album{z-index:6;background:#5a285059;place-items:center;display:grid;position:fixed;inset:0}.bk{width:min(760px,100% - 32px);max-height:92vh;box-shadow:var(--shadow);background:#fffaf2;border:6px solid #e8cfa8;border-radius:26px;grid-template-rows:auto 1fr auto;display:grid;overflow:hidden}.bk header{background:linear-gradient(90deg,#fde2ee,#ece1fb);grid-template-columns:1fr auto auto;align-items:center;gap:12px;padding:12px 18px;display:grid}.bk header h2{color:var(--pink-d);margin:0;font-size:24px}.bk-n{color:#7a5aa8;font-weight:600}.bk-page{text-align:center;padding:18px 34px;overflow-y:auto}.bk-art{letter-spacing:8px;font-size:84px}.bk-art.locked,.bk-story.locked{opacity:.6}.bk-page h3{color:#7a3a6e;margin:6px 0 10px;font-size:28px}.bk-story{font-size:20px;font-style:italic;line-height:1.55}.bk-stars{margin:6px 0 0;font-size:30px}.bk footer{justify-content:space-between;padding:10px 18px 16px;display:flex}.al-body{padding:12px 20px 20px;overflow-y:auto}.al-body h3{color:#7a3a6e;margin:8px 0}.al-body h3 small{color:#9a7ab8;margin-left:6px;font-size:15px}.sts{grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:10px;margin-bottom:12px;display:grid}.st{text-align:center;opacity:.7;background:#f3eef3;border:3px dashed #e2d3e2;border-radius:16px;gap:2px;padding:8px 4px;display:grid}.st span{font-size:36px}.st small{font-size:13px;font-weight:600;line-height:1.2}.st em{color:#9a6b12;font-size:13px;font-style:normal;font-weight:700}.st i{opacity:.7;font-size:11px;font-style:normal}.st.on{opacity:1;background:#fff;border:3px solid #f6e3ee}.st.gold{border-color:#f2c94c;box-shadow:0 0 0 3px #fff3c4}
