@import "https://fonts.googleapis.com/css2?family=Gaegu:wght@400;700&family=Jua&display=swap";html,body,#root{height:100%}body{background:var(--ha-paper);color:var(--ha-ink);font-family:var(--ha-font-body);-webkit-font-smoothing:antialiased;margin:0;overflow-x:hidden}button{font:inherit;color:inherit}img{max-width:100%;display:block}.app{min-height:100dvh;padding-block:env(safe-area-inset-top,0) env(safe-area-inset-bottom,0);--ha-inset-top:env(safe-area-inset-top,0px)}.paint-btn{flex:0 auto;min-width:240px}@container (width<=760px){.paint-btn{width:100%;min-width:0}}.dropzone{border:3px dashed var(--ha-line);text-align:center;cursor:pointer;background:0 0;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:8px;width:100%;padding:12px;transition:background .12s,border-color .12s;display:flex;position:absolute;inset:0}.dropzone:hover,.dropzone.over{border-color:var(--ha-ink);background:#fde7cf99}.dropzone .big{font-family:var(--ha-font-display);font-size:clamp(20px,3vw,28px)}.dropzone .small{color:var(--ha-ink-3);font-size:16px}.dropzone input{display:none}.preview{background:#fffdf7;transition:box-shadow .12s;position:absolute;inset:0}.preview.over{box-shadow:inset 0 0 0 3px var(--ha-ink)}.preview img{object-fit:contain;width:100%;height:100%}.preview__actions{gap:8px;max-width:calc(100% - 24px);display:flex;position:absolute;bottom:12px;left:12px}@container (width<=320px){.preview__actions .ha-btn{min-height:40px;padding:0 10px;font-size:15px}}.preview input{display:none}.reveal{background:var(--ha-paper-2);position:absolute;inset:0}.reveal img{object-fit:contain;background:#fffdf7;width:100%;height:100%}.ad-slot{min-height:100px;margin-top:12px}.ad-slot .adsbygoogle{min-height:100px}@container (width>=761px){.ad-slot,.ad-slot .adsbygoogle{min-height:250px}}.toast{background:var(--ha-ink);color:var(--ha-paper);z-index:5;white-space:pre-line;text-align:center;box-sizing:border-box;border-radius:14px;max-width:calc(100vw - 32px);padding:10px 18px;font-size:17px;line-height:1.45;animation:.2s both toast-in;position:fixed;bottom:24px;left:50%;transform:translate(-50%)}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%)}}:root{--ha-paper:#fbf5e6;--ha-paper-2:#fffaf0;--ha-paper-3:#fde7cf;--ha-ink:#4a3728;--ha-ink-2:#7a5a44;--ha-ink-3:#9a7b64;--ha-line:#b58a63;--ha-wood:#d9a878;--ha-wood-2:#a86f3f;--ha-apricot:#f4a582;--ha-leaf:#a8d48a;--ha-sky:#cfe8f3;--ha-sun:#ffe6a3;--ha-red:#d9534f;--ha-font-display:"Jua", "Gaegu", "Apple SD Gothic Neo", "Malgun Gothic", system-ui, sans-serif;--ha-font-body:"Gaegu", "Apple SD Gothic Neo", "Malgun Gothic", system-ui, sans-serif;--ha-radius:18px;--ha-shadow:3px 4px 0 var(--ha-ink)}.ha-display{font-family:var(--ha-font-display);font-weight:400}.ha-body{font-family:var(--ha-font-body)}.ha-pencil{filter:url(#ha-pencil);text-shadow:.7px .5px #d9925a,-.6px -.3px #7fb069bf}.ha-pencil-soft{text-shadow:.5px .4px #d9925ab3}.ha-sketch__box{vertical-align:top;display:inline-block;position:relative}.ha-sketch__ghost{color:#0000}.ha-sketch__svg{pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.ha-sketch__svg text{font:inherit;letter-spacing:inherit;fill:currentColor;white-space:pre}.ha-heading{font-family:var(--ha-font-display);color:var(--ha-ink);margin:0;font-weight:400;line-height:1.1}.ha-heading--xl{letter-spacing:-1px;font-size:clamp(40px,9cqw,92px);line-height:1}.ha-heading--lg{font-size:34px}.ha-heading--md{font-size:24px}.ha-heading--sm{font-size:20px}.ha-btn{border-radius:var(--ha-radius);border:3px solid var(--ha-ink);background:var(--ha-apricot);min-height:52px;color:var(--ha-ink);font-family:var(--ha-font-display);cursor:pointer;box-shadow:var(--ha-shadow);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;white-space:nowrap;justify-content:center;align-items:center;gap:10px;padding:0 26px;font-size:21px;line-height:1.2;transition:transform .12s,box-shadow .12s,opacity .12s;display:inline-flex}.ha-btn:hover{box-shadow:2px 3px 0 var(--ha-ink);transform:translate(1px,1px)}.ha-btn:active{box-shadow:0 0 0 var(--ha-ink);transform:translate(3px,4px)}.ha-btn--ghost{background:var(--ha-paper-2)}.ha-btn--leaf{background:var(--ha-leaf)}.ha-btn--sm{min-height:42px;box-shadow:2px 3px 0 var(--ha-ink);white-space:nowrap;padding:0 16px;font-size:17px}.ha-btn--lg{min-height:62px;padding:0 36px;font-size:24px}.ha-btn--block{width:100%;display:flex}.ha-btn:disabled{opacity:.45;cursor:not-allowed;box-shadow:var(--ha-shadow);transform:none}.ha-btn svg{flex:none}.ha-chip{text-align:left;border:3px dashed var(--ha-line);background:var(--ha-paper-2);min-height:56px;color:var(--ha-ink);cursor:pointer;font-family:var(--ha-font-body);border-radius:16px;align-items:center;gap:12px;padding:8px 14px;font-size:19px;transition:transform .12s;display:flex}.ha-chip:hover{transform:translateY(-1px)}.ha-chip--on{border-style:solid;border-color:var(--ha-ink);background:var(--ha-paper-3);box-shadow:3px 3px 0 var(--ha-ink)}.ha-chip__swatch{border:3px solid var(--ha-ink);background:var(--ha-paper-3);border-radius:4px;flex:none;width:34px}.ha-chip__body{flex-direction:column;min-width:0;line-height:1.1;display:flex}.ha-chip__name{font-family:var(--ha-font-display);font-size:19px}.ha-chip__tag{color:var(--ha-ink-3);font-size:15px}.ha-bubble{background:var(--ha-paper-2);border:3px solid var(--ha-ink);font-family:var(--ha-font-body);color:var(--ha-ink);white-space:nowrap;border-radius:20px;max-width:100%;padding:8px 16px;font-size:19px;display:inline-block;position:relative}.ha-bubble:after{content:"";background:var(--ha-paper-2);border-right:3px solid var(--ha-ink);border-bottom:3px solid var(--ha-ink);width:14px;height:14px;position:absolute;bottom:-10px;left:30px;transform:rotate(45deg)}.ha-bubble--right:after{left:auto;right:30px}.ha-bubble--highlight,.ha-bubble--highlight:after{background:var(--ha-paper-3)}.ha-bubble--wrap{white-space:normal}.ha-panel{background:var(--ha-paper-2);border:3px solid var(--ha-ink);width:100%;color:var(--ha-ink);font-family:var(--ha-font-body);box-sizing:border-box;border-radius:22px;flex-direction:column;gap:14px;padding:16px 20px 18px;font-size:18px;display:flex;box-shadow:4px 5px #4a372859}.ha-panel__title{font-family:var(--ha-font-display);margin:0;font-size:23px;font-weight:400}.ha-panel__hint{color:var(--ha-ink-2);font-size:16px}.ha-panel__error{color:var(--ha-red);font-size:17px}.ha-panel__row{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.ha-panel__row>.ha-btn{flex:120px}.ha-panel__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.ha-progress{font-family:var(--ha-font-body);color:var(--ha-ink);flex-direction:column;gap:12px;display:flex}.ha-progress__head{justify-content:space-between;align-items:baseline;gap:12px;display:flex}.ha-progress__label{font-family:var(--ha-font-display);font-size:22px}.ha-progress__meta{color:var(--ha-ink-3);font-size:16px}.ha-progress__track{border:3px solid var(--ha-ink);background:#fff;border-radius:14px;height:24px;position:relative}.ha-progress__fill{background:var(--ha-leaf);border-radius:10px;transition:width .4s;position:absolute;top:0;bottom:0;left:0}.ha-progress__brush{margin-left:-20px;transition:left .4s;position:absolute;top:-14px}.ha-character{--ha-art:min(260px, 100%);font-family:var(--ha-font-body);flex-direction:column;align-items:center;gap:10px;display:flex;position:relative}.ha-character__art{width:var(--ha-art);aspect-ratio:1;justify-content:center;align-items:flex-end;display:flex}.ha-character__art img{object-fit:contain;filter:drop-shadow(3px 5px #4a372838);width:100%;height:100%;display:block}.ha-character__art svg{width:100%;height:100%}.ha-character__label{color:var(--ha-ink-3);text-align:center;font-size:15px}.ha-character__action{justify-content:center;height:0;margin-top:-10px;display:flex;overflow:visible}.ha-character__action>*{zoom:.75;flex:none;margin-top:8px}.ha-stage--guest-action .ha-stage__panel{margin-top:56px}.ha-character__scene{justify-content:center;align-items:flex-end;max-width:100%;display:flex}.ha-character--with-easel .ha-character__art{flex:none}.ha-character__easel{width:calc(var(--ha-art) * .6);margin-left:calc(var(--ha-art) * -.1);filter:drop-shadow(3px 5px #4a372838);flex:none;margin-bottom:2px;display:block}.ha-character--idle .ha-character__art{animation:2.6s ease-in-out infinite ha-bob}.ha-character--busy .ha-character__art{transform-origin:50% 90%;animation:.55s ease-in-out infinite ha-paint}.ha-character--tada .ha-character__art{animation:.9s cubic-bezier(.2,.9,.3,1.2) both ha-tada}.ha-character--walking .ha-character__art{animation:.35s ease-in-out 2 ha-hop}.ha-character--flip .ha-character__art img{transform:scaleX(-1)}.ha-character--bubble-side{position:relative}.ha-character--bubble-side .ha-bubble{z-index:1;position:absolute;bottom:88%;right:55%}.ha-easel{flex-direction:column;align-items:center;width:100%;display:flex}.ha-easel__canvas{border:5px solid var(--ha-ink);box-sizing:border-box;isolation:isolate;background:#fffdf7;border-radius:6px;width:100%;position:relative;overflow:hidden;box-shadow:6px 8px #4a372840}.ha-easel__inner{border-radius:8px;position:absolute;inset:14px;overflow:hidden}.ha-easel__legs{width:100%;height:56px;margin-top:-6px;display:block}@property --ha-wipe{syntax:"<percentage>";inherits:false;initial-value:0%}.ha-stages{background:var(--ha-paper);position:absolute;inset:0;overflow:hidden}.ha-stages__frame{object-fit:cover;--ha-wipe:0%;width:100%;height:100%;-webkit-mask-image:linear-gradient(100deg, #000 0, #000 calc(var(--ha-wipe) - 14%), transparent calc(var(--ha-wipe) + 6%));-webkit-mask-image:linear-gradient(100deg, #000 0, #000 calc(var(--ha-wipe) - 14%), transparent calc(var(--ha-wipe) + 6%));mask-image:linear-gradient(100deg, #000 0, #000 calc(var(--ha-wipe) - 14%), transparent calc(var(--ha-wipe) + 6%));animation:1.4s cubic-bezier(.4,.1,.3,1) both ha-stage-wipe,.5s both ha-stage-fade;display:block;position:absolute;inset:0}.ha-stages__frame--instant{--ha-wipe:120%;animation:none;-webkit-mask-image:none;mask-image:none}.ha-stages__frame--rtl{-webkit-mask-image:linear-gradient(-100deg, #000 0, #000 calc(var(--ha-wipe) - 14%), transparent calc(var(--ha-wipe) + 6%));-webkit-mask-image:linear-gradient(-100deg, #000 0, #000 calc(var(--ha-wipe) - 14%), transparent calc(var(--ha-wipe) + 6%));mask-image:linear-gradient(-100deg, #000 0, #000 calc(var(--ha-wipe) - 14%), transparent calc(var(--ha-wipe) + 6%))}.ha-stages__brush{left:62%;top:var(--ha-brush-row,50%);z-index:10;pointer-events:none;transform-origin:30% 90%;filter:drop-shadow(2px 3px #4a372840);margin:-46px 0 0 -14px;animation:1.3s ease-in-out infinite ha-brush-dab;position:absolute}.ha-stages--sweeping .ha-stages__brush{animation:1.4s cubic-bezier(.4,.1,.3,1) both ha-brush-sweep,.22s ease-in-out infinite ha-brush-wiggle}.ha-stages__smear{opacity:0;background:#f4a58273;border-radius:50%;width:56px;height:18px;position:absolute;top:30px;left:-22px;transform:scaleX(.6)}.ha-stages--sweeping .ha-stages__smear{animation:1.4s ease-out both ha-smear}@keyframes ha-stage-wipe{0%{--ha-wipe:0%}to{--ha-wipe:120%}}@keyframes ha-stage-fade{0%{opacity:0}to{opacity:1}}@keyframes ha-brush-sweep{0%{left:-6%;transform:rotate(-14deg)translateY(0)}25%{transform:rotate(6deg)translateY(-10px)}50%{transform:rotate(-10deg)translateY(8px)}75%{transform:rotate(8deg)translateY(-6px)}to{left:104%;transform:rotate(-4deg)translateY(0)}}@keyframes ha-brush-wiggle{0%,to{margin-top:-46px}50%{margin-top:-38px}}@keyframes ha-brush-dab{0%,to{transform:translate(0)rotate(-8deg)}30%{transform:translate(-6px,6px)rotate(4deg)}60%{transform:translate(5px,-4px)rotate(-2deg)}}@keyframes ha-smear{0%{opacity:0;transform:scaleX(.4)}20%{opacity:1}to{opacity:0;transform:scaleX(1.6)translate(-30px)}}.ha-confetti{pointer-events:none;z-index:3;position:absolute;inset:0;overflow:hidden}.ha-confetti i{border-radius:3px;animation:2.6s ease-in both ha-confetti;display:block;position:absolute;top:-20px}.ha-screen{background:var(--ha-paper);min-height:100%;color:var(--ha-ink);font-family:var(--ha-font-body);box-sizing:border-box;flex-direction:column;padding:0 16px;font-size:18px;line-height:1.3;display:flex;position:relative;overflow:hidden;container-type:inline-size}.ha-screen *,.ha-screen :before,.ha-screen :after{box-sizing:border-box}.ha-wall{pointer-events:none;background-image:radial-gradient(#4a372812 1.5px,#0000 1.6px);background-size:28px 28px;position:absolute;inset:0}.ha-floor{background:var(--ha-wood);border-top:4px solid var(--ha-ink);pointer-events:none;height:34%;position:absolute;bottom:0;left:0;right:0}.ha-floor:after{content:"";background:repeating-linear-gradient(90deg,#4a37281a 0 2px,#0000 2px 118px);position:absolute;inset:0}.ha-topbar{z-index:2;justify-content:space-between;align-items:center;gap:12px;padding:18px 0 6px;display:flex;position:relative}.ha-topbar__right{align-items:center;gap:12px;display:flex}.ha-topbar__status{color:var(--ha-ink-2);font-size:17px}.ha-stage{z-index:1;--ha-easel-max:420px;flex:1;grid-template-columns:minmax(0,1fr);grid-template-areas:"easel""panel";align-items:end;row-gap:18px;padding:8px 0 28px;display:grid;position:relative}.ha-stage__easel{width:100%;max-width:var(--ha-easel-max);z-index:1;grid-area:easel;justify-self:center;position:relative}.ha-stage__painter{z-index:3;--ha-art:200px;--ha-spot:0;--ha-spot-inset:calc(var(--ha-art) * -.35);bottom:-8px;left:calc(var(--ha-spot-inset) + var(--ha-spot) * (100% - 2 * var(--ha-spot-inset)));margin-left:calc(var(--ha-art) / -2);transition:left .7s cubic-bezier(.4,0,.2,1);position:absolute}.ha-stage__painter .ha-character__art img{object-position:50% 100%}.ha-stage__painter .ha-bubble{white-space:normal;width:max-content;max-width:calc((100cqw - var(--ha-easel-max)) / 2 + var(--ha-spot-inset) - var(--ha-art) / 20 - 4px);text-align:center}.ha-stage__panel{grid-area:panel;justify-self:center;width:100%;max-width:560px}.ha-screen--atelier .ha-topbar{align-items:center;height:72px;padding:0}.ha-screen--atelier .ha-stage{grid-template-rows:600px auto;align-content:start;padding-top:8px}.ha-screen--atelier .ha-stage__easel{align-self:end}.ha-screen--atelier .ha-stage__panel{align-self:start;margin-top:32px}.ha-screen--atelier .ha-floor{top:calc(664px + var(--ha-inset-top,0px));height:auto}.ha-screen .ha-topbar,.ha-screen .ha-stage__easel,.ha-screen .ha-stage__painter,.ha-screen .ha-stage__panel{animation:.5s both ha-fadeup}.ha-screen .ha-stage__easel{animation-delay:.1s}.ha-screen .ha-stage__painter{animation-delay:.2s}.ha-screen .ha-stage__panel{animation-delay:.3s}.ha-splash{z-index:1;text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:22px;padding:40px 0;display:flex;position:relative}.ha-splash__hero{aspect-ratio:3/2;border:4px solid var(--ha-ink);background:var(--ha-paper-2);border-radius:22px;width:min(560px,88cqw);overflow:hidden;box-shadow:6px 8px #4a372840}.ha-splash__hero img{object-fit:cover;width:100%;height:100%;display:block}.ha-splash__subtitle{color:var(--ha-ink-2);margin:0;font-size:clamp(19px,3.4cqw,28px)}.ha-splash__note{color:var(--ha-ink-3);font-size:15px}@container (width<=760px){.ha-screen{font-size:17px}.ha-topbar{padding:14px 0 4px}.ha-topbar .ha-heading{white-space:nowrap;font-size:22px}.ha-topbar__status{display:none}.ha-stage{align-items:start;row-gap:10px;padding:4px 0 16px}.ha-floor{height:30%}.ha-screen--splash .ha-floor{height:22%}.ha-screen--atelier .ha-topbar{height:64px;padding:0}.ha-screen--atelier .ha-stage{grid-template-rows:auto auto;padding-top:4px}.ha-screen--atelier .ha-stage__easel,.ha-screen--atelier .ha-stage__panel{align-self:start}.ha-screen--atelier .ha-floor{top:calc(68px + min(75cqw, 270px) * 1.25 + 34px + var(--ha-inset-top,0px))}.ha-stage__easel{width:75%;max-width:270px}.ha-stage__painter{--ha-art:min(140px, 38vw);--ha-spot-inset:28px}.ha-stage__painter .ha-bubble{white-space:normal;text-align:center;width:max-content;max-width:72cqw;bottom:100%;left:0;right:auto}.ha-stage__painter .ha-bubble:after{left:calc(var(--ha-art) / 2 - 7px);right:auto}.ha-topbar .ha-btn{min-height:44px}.ha-stage .ha-character__label{display:none}.ha-stage .ha-bubble{padding:6px 12px;font-size:16px}.ha-stage .ha-panel{border-radius:20px;padding:14px 14px 16px}.ha-stage .ha-panel__title{font-size:20px}.ha-stage .ha-panel__grid{grid-template-columns:1fr;gap:8px}.ha-stage .ha-chip{min-height:52px;padding:6px 10px;font-size:17px}.ha-stage .ha-chip__name,.ha-stage .ha-chip__tag{white-space:nowrap}.ha-stage .ha-btn{min-height:50px;font-size:19px}}@container (width>=441px) and (width<=760px){.ha-stage__easel{max-width:360px}.ha-screen--atelier .ha-floor{top:calc(68px + min(75cqw, 360px) * 1.25 + 34px + var(--ha-inset-top,0px))}}@container (width<=320px){.ha-topbar{flex-wrap:wrap;row-gap:4px;height:auto;min-height:64px;padding:6px 0}.ha-topbar .ha-heading{font-size:20px}.ha-btn{white-space:normal;padding:0 14px;font-size:18px}.ha-splash .ha-btn{width:100%}.ha-stage .ha-chip__name,.ha-stage .ha-chip__tag{white-space:normal}.ha-stage .ha-bubble{padding:4px 8px;font-size:14px}}@keyframes ha-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes ha-paint{0%,to{transform:rotate(-3deg)translate(-2px)}50%{transform:rotate(3deg)translate(3px)}}@keyframes ha-tada{0%{opacity:0;transform:scale(.6)rotate(-6deg)}55%{opacity:1;transform:scale(1.1)rotate(2deg)}75%{transform:scale(.97)rotate(-1deg)}to{transform:scale(1)rotate(0)}}@keyframes ha-hop{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes ha-confetti{0%{opacity:0;transform:translateY(0)rotate(0)}10%{opacity:1}to{opacity:0;transform:translateY(110vh)rotate(720deg)}}@keyframes ha-pop{0%{opacity:0;transform:scale(.55)rotate(-6deg)}55%{opacity:1;transform:scale(1.06)rotate(2deg)}75%{transform:scale(.98)rotate(-1deg)}to{transform:scale(1)rotate(0)}}@keyframes ha-fadeup{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.ha-pop{animation:.9s cubic-bezier(.2,.9,.3,1.2) both ha-pop}.ha-fade{animation:.5s both ha-fadeup}@media (prefers-reduced-motion:reduce){.ha-character--idle .ha-character__art,.ha-character--busy .ha-character__art,.ha-character--walking .ha-character__art,.ha-confetti i,.ha-stages__brush,.ha-stages__smear{animation:none}.ha-stage__painter{transition:none}.ha-stages__frame{animation:.4s both ha-stage-fade;-webkit-mask-image:none;mask-image:none}}