.coloring-online-app{--bg:var(--bg,#f8fafc);--panel:var(--card-bg,#fff);font-family:'Nunito',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;display:flex;justify-content:center;align-items:flex-start;padding:20px;box-sizing:border-box;width:100%;background-color:var(--bg);background-image:var(--bg-mesh,radial-gradient(at 0% 0%,rgba(124,58,237,.05) 0px,transparent 50%));min-height:calc(100vh - 200px)}@media (min-width:922px){.ast-full-width-layout .site-content .ast-container,.coloring-online-active-page .site-content .ast-container{display:flex !important;justify-content:center !important;max-width:100% !important;width:100% !important}.coloring-online-active-page #primary{width:100% !important}}.coloring-online-app .app-container{display:flex;gap:20px;background:var(--panel);padding:30px;border-radius:15px;box-shadow:0 5px 15px rgba(0,0,0,.05);width:100%;max-width:1400px;margin:0 auto;box-sizing:border-box}.coloring-online-app .palette{display:flex;flex-wrap:wrap;gap:8px;width:75px;justify-content:center;align-content:flex-start}.coloring-online-app .color-swatch{width:32px;height:32px;border-radius:50%;border:3px solid var(--border,#e2e8f0);cursor:pointer;transition:.2s;flex-shrink:0}.coloring-online-app .color-swatch.active{transform:scale(1.15);border-color:var(--text,#0f172a);box-shadow:var(--shadow-sm,0 4px 10px rgba(0,0,0,.2))}.coloring-online-app .color-picker-wrapper{position:relative;width:32px;height:32px}.coloring-online-app .color-picker-wrapper input[type=color]{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer;z-index:2}.coloring-online-app .color-picker-btn{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:50%;background:conic-gradient(red,#ff0,lime,aqua,blue,magenta,red);border:3px solid #eee;z-index:1;pointer-events:none}.coloring-online-app .main-area{display:flex;flex-direction:column;gap:15px;align-items:center;flex:1;min-width:0}.coloring-online-app .toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:center;width:100%}.coloring-online-app button{background:var(--card-bg,#fff) !important;border:1px solid var(--border,#e2e8f0) !important;width:45px;height:45px;border-radius:12px;cursor:pointer;transition:.2s;padding:0;display:flex;justify-content:center;align-items:center;color:var(--text,#333) !important}.coloring-online-app button svg{stroke:currentColor !important;fill:none !important}.coloring-online-app button:hover{background:var(--nav-hover-bg,rgba(124,58,237,.08)) !important;border-color:var(--primary,#7c3aed) !important;color:var(--primary,#7c3aed) !important;transform:scale(1.05)}.coloring-online-app button:active{transform:scale(.95)}.coloring-online-app button.active{background:var(--primary,#7c3aed) !important;border-color:var(--primary,#7c3aed) !important;color:#fff !important}.coloring-online-app button:disabled{opacity:.4;cursor:not-allowed;transform:none;background:var(--card-bg,#fff) !important;color:var(--text-light,#94a3b8) !important;border-color:var(--border,#e2e8f0) !important}.coloring-online-app .separator{width:2px;height:30px;background:var(--border,#e2e8f0)}.coloring-online-app .dot{background:currentColor;border-radius:50%;display:inline-block;pointer-events:none}.coloring-online-app .canvas-wrapper{position:relative;margin:0 auto;background:#fff;border-radius:15px;overflow:hidden;box-shadow:inset 0 0 0 1px var(--border,#e2e8f0);display:inline-block;max-width:100%}.coloring-online-app canvas{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;cursor:crosshair;touch-action:pinch-zoom}.coloring-online-app .canvas-wrapper img{position:relative;display:block;max-width:100%;max-height:75vh;width:auto;height:auto;z-index:2;pointer-events:none;mix-blend-mode:multiply}@media (max-width:768px){div#primary.ast-full-width-layout{flex:0 0 100% !important;max-width:100% !important;padding:0 !important;margin:0 !important}div#primary .site-content{padding:0 !important}.coloring-online-app{padding:0}.coloring-online-app .app-container{flex-direction:column;gap:15px;padding:15px 0;border-radius:0;box-shadow:none}.coloring-online-app .palette{width:100%;flex-direction:row;padding:0 15px;box-sizing:border-box}.coloring-online-app .toolbar{padding:0 15px;box-sizing:border-box}.coloring-online-app .canvas-wrapper{border-radius:0;border-left:none;border-right:none;box-shadow:none;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}}#save-modal-co{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.85);z-index:9999;flex-direction:column;justify-content:center;align-items:center;backdrop-filter:blur(5px)}#save-modal-co #save-img{max-width:90%;max-height:70%;border-radius:10px;box-shadow:var(--shadow-lg,0 5px 25px rgba(0,0,0,.5));pointer-events:auto;-webkit-touch-callout:default}#save-modal-co .modal-text{color:#fff;font-size:18px;margin-bottom:20px;text-align:center;font-weight:700;padding:0 20px}#save-modal-co .close-modal{margin-top:20px;background:var(--primary,#7c3aed);color:#fff;padding:10px 30px;font-size:16px;border-radius:8px;width:auto;transition:background .2s;border:none;cursor:pointer}#save-modal-co .close-modal:hover{background:var(--primary-hover,#6d28d9)}@media (min-width:769px){#primary{flex:0 0 70% !important;max-width:70% !important;margin:auto}}