:root{color:#27314d;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--ink:#27314d;--muted:#5f6b88;--paper:#fffdf7;--paper-border:#ffffffb8;--dock:#ffffffbd;--dock-border:#27314d1a;--dock-icon:26px;--dock-unified-min-h:100px;--tool-border:#27314d57;background:radial-gradient(circle at 10% 10%,#ffdd5752,#0000 22%),radial-gradient(circle at 88% 12%,#4ea8ff38,#0000 24%),linear-gradient(#fef7da 0%,#fff8ef 46%,#f5fbff 100%);font:18px/1.4 Avenir Next Rounded,Trebuchet MS,Comic Sans MS,sans-serif}*{box-sizing:border-box;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}html,body{overscroll-behavior:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent;height:100%;margin:0;overflow:hidden}body{height:100dvh;max-height:100dvh}button,canvas{touch-action:manipulation}button{font:inherit}p{margin:0}#app{touch-action:manipulation;height:100dvh;min-height:0;max-height:100dvh;padding:max(10px, env(safe-area-inset-top)) max(10px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left));box-sizing:border-box;overflow:hidden}.app-shell{grid-template-rows:minmax(0,1fr) auto;gap:10px;height:100%;min-height:0;max-height:100%;display:grid}.mdi{flex-shrink:0}.mdi-dock-icon{width:var(--dock-icon);height:var(--dock-icon);vertical-align:middle;flex-shrink:0;margin:0;display:block;overflow:visible}.stage{flex-direction:column;min-height:0;display:flex}.canvas-frame{border:1px solid var(--paper-border);background:linear-gradient(#ffffffd9,#fffaf3f2),linear-gradient(135deg,#ffc37129,#4ea8ff1f);border-radius:28px;flex:1;height:100%;min-height:0;padding:10px;position:relative;overflow:hidden}.canvas-frame:after{content:"";pointer-events:none;background-image:linear-gradient(#7d8ead0d 1px,#0000 1px),linear-gradient(90deg,#7d8ead0d 1px,#0000 1px);background-size:32px 32px;border-radius:28px;position:absolute;inset:18px}#drawingCanvas{touch-action:none;cursor:crosshair;background:radial-gradient(circle at 20% 18%,#ffdd572e,#0000 20%),linear-gradient(#fffdf7 0%,#fffaf0 100%);border-radius:26px;width:100%;height:100%;display:block;position:relative}.toolbar{flex-shrink:0;grid-template-columns:minmax(0,1fr) max-content;align-items:stretch;gap:10px;min-height:0;display:grid}.dock-section{background:var(--dock);border:1px solid var(--dock-border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);min-width:0;min-height:var(--dock-unified-min-h);box-sizing:border-box;border-radius:22px;align-items:center;height:100%;padding:11px 12px;display:flex}.dock-section-palette{width:100%;min-width:0;overflow:visible}.palette-scroll{overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;touch-action:manipulation;flex-wrap:nowrap;flex:1;align-content:center;align-items:center;gap:8px;width:100%;min-width:0;min-height:0;padding:10px 10px 10px 8px;display:flex;overflow:auto hidden}.tools-row{flex-wrap:wrap;flex:0 auto;place-content:center flex-start;align-items:center;gap:8px;width:max-content;min-width:0;max-width:100%;min-height:0;display:flex}.clear-actions{flex-shrink:0;align-items:center;gap:8px;display:flex}.brush-list{flex-wrap:wrap;flex:none;align-items:center;gap:8px;min-width:0;display:flex}.tool-button,.palette-action-btn{border:1px solid var(--tool-border);background:#fff;box-shadow:inset 0 0 0 1px #ffffff8c}.swatch-button{background:radial-gradient(circle at 32% 26%, #ffffff61, transparent 45%), var(--swatch);border:1px solid #00000038;overflow:visible;box-shadow:inset 0 0 0 1px #ffffff47}.palette-action-btn{border-radius:16px;flex-shrink:0;justify-content:center;align-items:center;width:48px;height:48px;padding:0;display:inline-flex}.palette-action-print .mdi-dock-icon{color:#0d6e5c}.palette-action-trash .mdi-dock-icon{color:#6849c7}.swatch-button{border-radius:16px;flex-shrink:0;justify-content:center;align-items:center;width:48px;height:48px;padding:3px;display:inline-flex}.swatch-icon{width:var(--dock-icon);height:var(--dock-icon);min-width:var(--dock-icon);min-height:var(--dock-icon);pointer-events:none;justify-content:center;align-items:center;line-height:0;display:inline-flex;overflow:visible}.swatch-button.is-selected{outline-offset:2px;z-index:1;border-color:#1e3a8a;outline:3px solid #1d4ed8;position:relative;box-shadow:inset 0 0 0 1px #ffffff59,0 0 0 1px #ffffffd9}.brush-section{justify-self:start;width:fit-content;min-width:0;max-width:100%}.tool-button{width:48px;min-width:48px;height:48px;min-height:48px;color:var(--ink);border-radius:16px;justify-content:center;align-items:center;padding:0;line-height:0;display:inline-flex}.stamp-tool{background:linear-gradient(#fff5e6 0%,#ffe0c2 100%);border-color:#27314d4d}.stamp-tool .mdi-dock-icon{color:#e87850}.tool-button.is-selected{color:#fffffff5;outline-offset:2px;z-index:1;background:linear-gradient(#4ea8ff 0%,#2d6cdf 100%);border-color:#1e40af;outline:3px solid #172554;position:relative}.stamp-tool.is-selected{outline-offset:2px;z-index:1;background:linear-gradient(#ff9f7a 0%,#ff7b54 100%);border-color:#c2410c;outline:3px solid #7c2d12;position:relative}.stamp-tool.is-selected .mdi-dock-icon{color:#fffffff5}.palette-action-btn:focus-visible,.swatch-button:focus-visible,.tool-button:focus-visible{outline-offset:3px;outline:4px solid #27314d2e}@media print{@page{margin:12mm;size:auto}html,body{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;background:#fff!important;height:100%!important;max-height:none!important;overflow:visible!important}#app{box-sizing:border-box!important;flex-direction:column!important;justify-content:center!important;align-items:center!important;height:100%!important;min-height:100vh!important;max-height:none!important;padding:0!important;display:flex!important;overflow:visible!important}.app-shell{page-break-inside:avoid!important;flex-direction:column!important;flex:auto!important;justify-content:center!important;align-items:center!important;gap:0!important;width:100%!important;height:auto!important;min-height:0!important;max-height:100vh!important;display:flex!important}.toolbar{display:none!important}.stage{page-break-inside:avoid!important;flex-direction:column!important;flex:auto!important;justify-content:center!important;align-items:center!important;width:100%!important;height:auto!important;min-height:0!important;max-height:100%!important;display:flex!important}.canvas-frame{page-break-inside:avoid!important;background:#fff!important;border:none!important;border-radius:0!important;flex:0 auto!important;justify-content:center!important;align-items:center!important;width:100%!important;max-width:100%!important;height:auto!important;min-height:0!important;max-height:100%!important;margin:0!important;padding:0!important;display:flex!important;position:static!important;overflow:visible!important}.canvas-frame:after,#catCanvas{display:none!important}#drawingCanvas{object-fit:contain!important;width:auto!important;max-width:100%!important;height:auto!important;max-height:calc(100vh - 26mm)!important;box-shadow:none!important;page-break-inside:avoid!important;-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;background:#fff!important;border-radius:0!important;flex-shrink:1!important;margin:0 auto!important;display:block!important}}@media (width<=900px){.toolbar{grid-template-columns:1fr}.brush-list{justify-content:flex-start}.clear-actions{justify-content:flex-end;width:100%;margin-left:0;padding-top:6px}}@media (width<=640px){:root{--dock-icon:22px;--dock-unified-min-h:88px;font-size:16px}.app-shell{gap:8px}.canvas-frame{border-radius:22px;padding:8px}.canvas-frame:after{border-radius:18px;inset:10px}#drawingCanvas{border-radius:16px}.swatch-button{border-radius:14px;width:42px;height:42px}.dock-section{padding:10px}.palette-scroll{padding:8px 8px 8px 6px}.palette-action-btn{border-radius:14px;width:42px;height:42px}.tool-button{border-radius:14px;width:42px;min-width:42px;height:42px;min-height:42px}}