:root{color:#26384a;font-synthesis:none;--purple:#7362df;--edge-top:max(10px, env(safe-area-inset-top));--edge-right:max(10px, env(safe-area-inset-right));--edge-bottom:max(10px, env(safe-area-inset-bottom));--edge-left:max(10px, env(safe-area-inset-left));--dock-gap:12px;--slide:transform .24s cubic-bezier(.2, .8, .3, 1), opacity .18s ease;background:#fff7d7;font-family:Trebuchet MS,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0;overflow:hidden}body{overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.app-shell{background:radial-gradient(circle at 15% 5%,#fff 0 4%,#0000 15%),#fff7d7;height:100%;position:relative;overflow:hidden}.drawing-surface{inset:var(--edge-top) var(--edge-right) var(--edge-bottom) var(--edge-left);touch-action:none;cursor:crosshair;background:#fff;border:6px solid #fff;border-radius:30px;position:absolute;overflow:hidden;box-shadow:0 7px #e6dba6,0 14px 30px #81794d33}.drawing-surface canvas{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.drawing-surface.placing-sticker{cursor:copy}.tap-hint{background:var(--purple);color:#fff;border-radius:999px;padding:11px 20px;font-size:20px;font-weight:800;animation:.8s infinite alternate bob;position:absolute;top:18px;left:50%;transform:translate(-50%);box-shadow:0 5px 12px #423b7d44}.overlay{z-index:10;pointer-events:none;position:absolute;inset:0}.topbar{top:calc(var(--edge-top) + 10px);left:calc(var(--edge-left) + 14px);right:calc(var(--edge-right) + 14px);justify-content:space-between;align-items:flex-start;gap:12px;display:flex;position:absolute}.brand{color:#4a4f69;opacity:.7;align-items:center;gap:10px;font-size:clamp(18px,3vw,30px);display:flex}.brand span{font-size:40px}.top-tools{gap:12px;display:flex}.topbar .tool-button{pointer-events:auto}.dock{align-items:center;display:flex;position:absolute}.dock-tools{left:calc(var(--edge-left) + 14px);top:50%;transform:translateY(-50%)}.dock-colours{bottom:calc(var(--edge-bottom) + 14px);flex-direction:column;justify-content:flex-end;left:0;right:0}.dock-handle{z-index:2;cursor:pointer;pointer-events:auto;background:#fff;border:5px solid #fff;border-radius:50%;place-items:center;width:76px;min-width:64px;height:76px;min-height:64px;font-size:36px;line-height:1;transition:transform .12s,box-shadow .12s;display:grid;position:relative;box-shadow:0 6px #d9d3b5,0 10px 20px #7f765229}.dock-handle:active{transform:scale(.94)}.dock-handle:focus-visible{outline-offset:3px;outline:5px solid #2b6fe4}.colour-handle{background:conic-gradient(#ef4b4b,#ff8a34,#ffd43b,#36b66f,#2878e8,#8d5bd7,#ef4b4b)}.colour-handle .handle-face{background:var(--swatch);border-radius:50%;width:46px;height:46px;box-shadow:inset 0 0 0 2px #00000026}.dock-handle .chev{background:var(--purple);border-radius:50%;place-items:center;width:24px;height:24px;transition:transform .24s cubic-bezier(.2,.8,.3,1);display:grid;position:absolute;box-shadow:0 2px 6px #3c357040}.dock-handle .chev:before{content:"";border-top:3px solid #fff;border-right:3px solid #fff;border-radius:1px;width:7px;height:7px}.tool-handle .chev{margin-top:-12px;top:50%;right:-9px}.tool-handle .chev:before{transform:rotate(45deg)translate(-1px,1px)}.dock-tools.open .tool-handle .chev{transform:rotate(180deg)}.colour-handle .chev{margin-left:-12px;top:-9px;left:50%}.colour-handle .chev:before{transform:rotate(-45deg)translate(1px,1px)}.dock-colours.open .colour-handle .chev{transform:rotate(180deg)}.tool-rail,.palette{z-index:1;opacity:0;pointer-events:none;transition:var(--slide);background:#fffaf0;border:5px solid #fff;border-radius:30px;padding:12px;position:absolute;box-shadow:0 10px 26px #6e663f38}.dock.open .tool-rail,.dock.open .palette{opacity:1;pointer-events:auto}.tool-rail{margin-left:var(--dock-gap);scrollbar-width:none;flex-direction:column;gap:12px;width:max-content;max-height:calc(100dvh - 24px);display:flex;top:50%;left:100%;overflow-y:auto;transform:translate(-100%,-50%)}.tool-rail::-webkit-scrollbar{display:none}.dock-tools.open .tool-rail{transform:translateY(-50%)}.palette{margin:0 auto var(--dock-gap);flex-wrap:wrap;justify-content:center;align-items:center;gap:clamp(8px,1.6vw,16px);width:max-content;max-width:min(92vw,760px);display:flex;bottom:100%;left:0;right:0;transform:translateY(100%)}.dock-colours.open .palette{transform:translateY(0)}.tool-button{cursor:pointer;background:#fff;border:4px solid #fff;border-radius:23px;width:72px;min-width:64px;height:72px;min-height:64px;font-size:34px;transition:transform .12s,box-shadow .12s;position:relative;box-shadow:0 5px #d9d3b5,0 8px 16px #7f765229}.tool-button:active,.tool-button.active{transform:translateY(3px)scale(.94);box-shadow:0 2px #bbb38e,0 3px 9px #7f765233}.tool-button.active{background:#f0edff;outline:5px solid #8170ea}.tool-button:focus-visible,.colour:focus-visible,.sheet button:focus-visible{outline-offset:3px;outline:5px solid #2b6fe4}.tool-button:disabled{filter:grayscale();opacity:.38;cursor:default}.grownup{font-size:28px}.grownup i{pointer-events:none;border-radius:23px;position:absolute;inset:-4px}.grownup.holding i{background:conic-gradient(var(--purple) 0, transparent 0);animation:3s linear forwards hold-progress}.colour{background:var(--swatch);cursor:pointer;border:7px solid #fff;border-radius:50%;flex:none;width:72px;height:72px;transition:transform .14s;box-shadow:0 5px #cfc7a1,0 7px 14px #665f3f33}.colour[style*=\#ffffff]{box-shadow:inset 0 0 0 2px #b8c0c8,0 5px #cfc7a1}.colour:active{transform:scale(.88)}.colour.selected{outline-offset:2px;outline:5px solid #4b5270;transform:translateY(-7px)scale(1.12)}.scrim{z-index:20;background:#26384a66;justify-content:center;align-items:flex-end;padding:14px;display:flex;position:fixed;inset:0}.sheet{background:#fffaf0;border:6px solid #fff;border-radius:32px 32px 22px 22px;width:min(900px,100%);max-height:88vh;padding:18px 24px 26px;animation:.22s ease-out sheet-up;overflow:auto;box-shadow:0 -10px 35px #20304044}.sheet-title{justify-content:space-between;align-items:center;display:flex}.sheet h2{margin:0 0 14px;font-size:clamp(25px,4vw,38px)}.close{color:#435063;cursor:pointer;background:#ece7da;border:0;border-radius:50%;width:64px;height:64px;font-size:46px;line-height:1}.choice-grid{grid-template-columns:repeat(4,1fr);gap:14px;display:grid}.choice-grid button{cursor:pointer;background:#eef6ff;border:5px solid #fff;border-radius:25px;min-height:112px;font-size:56px;box-shadow:0 5px #ccd6df}.choice-grid button:active{transform:translateY(4px)}.choice-grid button.chosen{background:#f2efff;outline:6px solid #7464df}.choice-grid span{filter:drop-shadow(0 4px 3px #58606b33);display:block}.parent-grid{grid-template-columns:repeat(2,1fr);gap:14px;display:grid}.parent-grid button{color:#26384a;cursor:pointer;background:#e8f2ff;border:0;border-radius:22px;min-height:96px;font:800 20px inherit;box-shadow:0 5px #cbd9e8}.parent-grid span{margin-bottom:5px;font-size:38px;display:block}.loading{background:#fff7d7;place-items:center;width:100%;height:100%;display:grid}.loading span{font-size:80px;animation:.7s infinite alternate bob}@keyframes hold-progress{to{background:conic-gradient(var(--purple) 360deg, transparent 0)}}@keyframes bob{to{transform:translate(-50%)translateY(-5px)scale(1.04)}}@keyframes sheet-up{0%{opacity:0;transform:translateY(60px)}}@media (width<=720px){:root{--dock-gap:9px}.brand b{display:none}.brand span{font-size:34px}.top-tools{gap:9px}.tool-button{border-radius:20px;width:64px;height:64px;font-size:29px}.dock-handle{width:68px;height:68px;font-size:32px}.colour-handle .handle-face{width:42px;height:42px}.colour{width:64px;height:64px}.tool-rail,.palette{border-radius:26px;padding:9px}.tool-rail{gap:9px}.drawing-surface{border-width:4px;border-radius:22px}.choice-grid{gap:9px}.choice-grid button{min-height:88px;font-size:45px}.sheet{padding:14px 14px 20px}.parent-grid button{font-size:17px}}@media (width<=430px){:root{--edge-top:max(6px, env(safe-area-inset-top));--edge-right:max(6px, env(safe-area-inset-right));--edge-bottom:max(6px, env(safe-area-inset-bottom));--edge-left:max(6px, env(safe-area-inset-left));--dock-gap:7px}.topbar{top:calc(var(--edge-top) + 7px);left:calc(var(--edge-left) + 8px);right:calc(var(--edge-right) + 8px)}.dock-tools{left:calc(var(--edge-left) + 8px)}.dock-colours{bottom:calc(var(--edge-bottom) + 8px)}.top-tools{gap:7px}.tool-button{border-width:3px}.tool-rail,.palette{padding:7px}.palette{gap:8px;max-width:94vw}.choice-grid{grid-template-columns:repeat(2,1fr)}.parent-grid{grid-template-columns:1fr 1fr}}@media (orientation:landscape) and (height<=600px){.tool-rail{grid-template-columns:repeat(2,auto);display:grid}.palette{max-width:min(74vw,620px)}.brand b{display:block}.choice-grid button{min-height:82px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.brush-tool span{place-items:center;display:grid}.brush-grid{grid-template-columns:repeat(3,1fr);gap:14px;display:grid}.brush-grid button{color:#26384a;cursor:pointer;background:#eef6ff;border:5px solid #fff;border-radius:25px;place-items:center;gap:7px;min-height:132px;padding:12px;font:800 19px inherit;display:grid;box-shadow:0 5px #ccd6df}.brush-grid button:active{transform:translateY(4px)}.brush-grid button.chosen{background:#f2efff;outline:6px solid #7464df}.brush-preview{background:#fff;border-radius:16px;width:min(116px,80%);height:62px;display:block;position:relative;overflow:hidden}.brush-preview i{background:#2878e8;border-radius:999px;height:20px;position:absolute;top:50%;left:12%;right:12%;transform:translateY(-50%)rotate(-7deg)}.brush-preview.marker i{opacity:.48;height:30px}.brush-preview.soft i{opacity:.5;filter:blur(8px);height:32px}.brush-preview.fog i{opacity:.42;filter:blur(13px);height:48px}.brush-preview.watercolor i{opacity:.38;filter:saturate(1.15);height:28px;box-shadow:8px -5px #2878e844,-7px 4px #2878e83d}.brush-preview.crayon i{background:repeating-linear-gradient(12deg,#2878e8 0 4px,#2878e8aa 4px 6px,#0000 6px 8px);border-radius:7px;outline:2px dashed #2878e899;height:21px}.app-version{z-index:5;right:calc(var(--edge-right) + 16px);bottom:calc(var(--edge-bottom) + 8px);color:#596878;letter-spacing:.02em;white-space:nowrap;opacity:.72;pointer-events:none;font-size:11px;font-weight:700;line-height:1;position:absolute}.choice-grid img{object-fit:contain;border-radius:15px;width:92px;max-width:100%;height:92px;margin:auto;display:block}.choice-grid.pictures button{background:#fff}.choice-grid.pictures img{filter:contrast(1.3);mix-blend-mode:multiply}@media (width<=540px){.brush-grid{grid-template-columns:repeat(2,1fr);gap:9px}.brush-grid button{min-height:112px}}@media (orientation:landscape) and (height<=600px){.brush-grid button{grid-template-columns:80px 1fr;min-height:92px}.brush-preview{width:76px;height:48px}}.tool-button.active{transform:none}@media (width<=430px){.tool-button,.colour,.dock-handle{width:64px;min-width:64px;height:64px;min-height:64px}}@media (orientation:landscape) and (height<=600px){.top-tools .tool-button,.colour,.dock-handle{width:64px;min-width:64px;height:64px;min-height:64px}}