:root{color:#172033;font-synthesis:none;text-rendering:optimizelegibility;background:#fff8e8;font-family:ui-rounded,SF Pro Rounded,Avenir Next,system-ui,sans-serif}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0;overflow:hidden}button{font:inherit;color:inherit;-webkit-tap-highlight-color:transparent}button:focus-visible{outline-offset:3px;outline:4px solid #0ea5e959}.screen{min-height:100%;padding:max(24px, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left))}.eyebrow{color:#e05d35;letter-spacing:.16em;margin:0 0 6px;font-size:.78rem;font-weight:900}h1{letter-spacing:-.04em;margin:0;font-size:clamp(2rem,4.2vw,4rem);line-height:1.02}.home-screen{background:radial-gradient(circle at 16% 12%,#ffe8a8 0 14%,#0000 35%),radial-gradient(circle at 92% 82%,#ccefe5 0 12%,#0000 34%),#fff8e8;align-content:center;gap:clamp(30px,7vh,74px);display:grid}.home-copy{text-align:center}.home-copy>p:last-child{color:#5f687a;margin:14px 0 0;font-size:1.08rem}.home-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(18px,3vw,34px);width:min(980px,100%);margin:0 auto;display:grid}.home-card{cursor:pointer;border:0;border-radius:36px;flex-direction:column;justify-content:center;align-items:center;gap:10px;min-height:clamp(220px,34vh,330px);padding:28px;transition:transform .15s,box-shadow .15s;display:flex;box-shadow:0 18px 44px #302b1e1f}.home-card:active{transform:scale(.98);box-shadow:0 8px 20px #302b1e1f}.home-card strong{font-size:clamp(1.55rem,3vw,2.5rem)}.home-card small{color:#4f5b6e;font-size:1rem}.free-draw-card{background:#ffcfa3}.coloring-card{background:#bde9dd}.home-card-icon{background:#ffffffa8;border-radius:28px;place-items:center;width:92px;height:92px;font-size:3.6rem;display:grid}.library-screen{background:#fffaf0;overflow:auto}.screen-header{grid-template-columns:60px 1fr 60px;align-items:center;gap:18px;width:min(1200px,100%);margin:0 auto 26px;display:grid}.screen-header h1{font-size:clamp(1.9rem,3.5vw,3.2rem)}.icon-button{background:#fff;border:0;border-radius:18px;width:56px;height:56px;font-size:1.75rem;font-weight:800;box-shadow:0 7px 18px #2a2f3a1c}.icon-button:disabled{opacity:.5}.status-banner{color:#245477;background:#e8f4ff;border-radius:14px;width:min(1200px,100%);margin:0 auto 18px;padding:13px 18px;font-weight:700}.error-banner{color:#9b3d2a;background:#fff0ec}.empty-state{color:#667085;place-items:center;min-height:45vh;font-size:1.1rem;display:grid}.library-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:22px;width:min(1200px,100%);margin:0 auto;padding-bottom:40px;display:grid}.library-card{background:#fff;border-radius:26px;position:relative;overflow:visible;box-shadow:0 10px 28px #2a2f3a1a}.artwork-button{background:#fff;border:0;border-radius:26px 26px 0 0;width:100%;padding:0;display:block;position:relative;overflow:hidden}.artwork-button:disabled{opacity:.56}.artwork-button img{aspect-ratio:4/3;object-fit:contain;background:#fff;width:100%;display:block}.cache-badge{color:#fff;background:#172033d1;border-radius:999px;padding:7px 10px;font-size:.75rem;font-weight:800;position:absolute;bottom:12px;left:12px}.cache-badge.cached{background:#15803de6}.card-caption{justify-content:space-between;align-items:center;gap:10px;min-height:66px;padding:14px 12px 14px 18px;display:flex}.card-caption strong{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.more-button{background:#f2f4f7;border:0;border-radius:13px;width:44px;height:40px;font-weight:900}.delete-local-button{z-index:4;color:#fff;background:#172033;border:0;border-radius:13px;padding:12px 16px;position:absolute;bottom:-40px;right:10px;box-shadow:0 8px 18px #1720333d}.dialog-backdrop{z-index:20;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#17203373;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.confirm-dialog{background:#fff;border-radius:26px;width:min(460px,100%);padding:28px;box-shadow:0 25px 70px #1720334d}.confirm-dialog h2{margin:0 0 10px;font-size:1.55rem}.confirm-dialog p{color:#5f687a;line-height:1.55}.dialog-actions{justify-content:flex-end;gap:10px;margin-top:24px;display:flex}.dialog-actions button{background:#eef1f5;border:0;border-radius:14px;min-height:48px;padding:0 18px;font-weight:800}.dialog-actions .danger-button{color:#fff;background:#dc3f3f}.drawing-screen{background:#e8edf2;flex-direction:column;width:100%;height:100%;display:flex}.drawing-header{height:calc(66px + env(safe-area-inset-top));padding:env(safe-area-inset-top) max(14px, env(safe-area-inset-right)) 0 max(14px, env(safe-area-inset-left));background:#fffaf0;border-bottom:1px solid #dfe4ea;flex:none;grid-template-columns:56px 1fr auto;align-items:center;gap:14px;display:grid}.drawing-header strong{font-size:1.15rem}.saved-indicator{color:#41805e;font-size:.84rem;font-weight:800}.drawing-warning{color:#7a4c00;text-align:center;background:#fff0c9;padding:9px 16px;font-size:.85rem;font-weight:800}.drawing-workspace{flex:1;min-height:0;display:flex}.canvas-stage{touch-action:none;background:#d7dde5;border-radius:20px;flex:1;min-width:0;min-height:0;margin:14px;position:relative;overflow:hidden;box-shadow:0 8px 24px #1720331f}.artwork-transform{transform-origin:0 0;will-change:transform;background:#fff;width:100%;height:100%;position:absolute;inset:0}.canvas-background,.drawing-canvas{width:100%;height:100%;position:absolute;inset:0}.canvas-background{object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none}.drawing-canvas{z-index:2;pointer-events:none}.preview-canvas{z-index:3}.committed-canvas.eraser-preview-hidden{visibility:hidden}.canvas-interaction{z-index:4;touch-action:none;cursor:crosshair;-webkit-user-select:none;user-select:none;position:absolute;inset:0}.drawing-toolbar{width:104px;padding:10px max(10px, env(safe-area-inset-right)) 10px 8px;z-index:8;background:#fffaf0;flex-direction:column;justify-content:center;display:flex;position:relative}.primary-tools{background:#eeece5;border-radius:20px;gap:5px;padding:7px;display:grid;overflow-y:auto}.primary-tools button{background:0 0;border:0;border-radius:14px;grid-template-columns:30px 1fr;align-items:center;gap:3px;min-width:68px;min-height:58px;padding:4px;font-size:1.45rem;display:grid}.primary-tools button.selected{background:#fff;box-shadow:0 4px 12px #17203321}.primary-tools button:disabled{opacity:.3}.primary-tools svg{width:29px;height:29px}.primary-tools small{text-overflow:ellipsis;white-space:nowrap;font-size:.65rem;font-weight:850;overflow:hidden}.current-color>span{border:3px solid #fff;border-radius:50%;width:27px;height:27px;box-shadow:0 0 0 1px #b8bec8}.size-dot{background:#172033;border-radius:50%;place-self:center}.tool-drawer{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#fffaf0fa;border:1px solid #17203314;border-radius:24px;width:min(430px,100vw - 136px);max-height:min(78vh,650px);padding:18px;position:absolute;bottom:10px;right:calc(100% + 10px);overflow:auto;box-shadow:0 20px 60px #17203340}.tool-drawer h2{margin:0 0 14px;font-size:1.1rem}.brush-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;display:grid}.brush-grid button{text-align:left;background:#fff;border:2px solid #0000;border-radius:15px;grid-template-columns:70px 1fr;align-items:center;gap:8px;min-height:76px;padding:9px;display:grid}.brush-grid button.selected{background:#eaf8ff;border-color:#0ea5e9}.brush-grid svg{width:45px;height:45px}.brush-sample{width:62px;height:30px;position:relative;overflow:hidden}.brush-sample:after{content:"";background:#172033;border-radius:99px;height:6px;position:absolute;top:13px;left:3px;right:3px;transform:rotate(-7deg)}.sample-pencil:after{opacity:.6;filter:contrast(160%);background:repeating-linear-gradient(90deg,#172033 0 3px,#0000 3px 4px)}.sample-ink:after{height:3px;box-shadow:28px 1px 0 2px #172033}.sample-fountain:after{border-radius:0;height:9px;transform:rotate(-14deg)skew(-28deg)}.sample-highlighter:after{opacity:.4;background:#facc15;height:13px}.sample-crayon:after{background:repeating-linear-gradient(90deg,#ef4444 0 4px,#fb7185 4px 6px,#0000 6px 7px);height:10px}.sample-watercolor:after{opacity:.38;filter:blur(1px);background:#2563eb;height:15px}.sample-airbrush:after{opacity:.55;filter:blur(5px);height:18px}.sample-neon:after{background:#fff;height:3px;box-shadow:0 0 5px 3px #22d3ee,0 0 12px 6px #2563eb}.swatch-grid{grid-template-columns:repeat(6,1fr);gap:9px;display:grid}.swatch-grid button{border:3px solid #fff;border-radius:50%;min-width:48px;min-height:48px;box-shadow:0 0 0 1px #cbd0d8}.swatch-grid button.selected{box-shadow:0 0 0 4px #172033}.custom-color{background:#fff;border-radius:14px;justify-content:space-between;align-items:center;min-height:52px;margin-top:16px;padding:8px 12px;font-weight:800;display:flex}.custom-color input{background:0 0;border:0;width:64px;height:38px}.settings-drawer label{background:#fff;border-radius:15px;grid-template-columns:1fr auto;gap:10px;margin-top:12px;padding:12px;font-weight:800;display:grid}.settings-drawer output{color:#566173}.settings-drawer input{accent-color:#0ea5e9;grid-column:1/-1;width:100%}.drawing-loading,.drawing-error{text-align:center;place-items:center;display:grid}@media (orientation:portrait),(width<=760px){.home-actions{grid-template-columns:1fr;max-width:560px}.home-card{min-height:190px}.drawing-workspace{flex-direction:column}.canvas-stage{margin:10px}.drawing-toolbar{width:100%;height:92px;padding:8px max(10px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left));display:block}.primary-tools{height:76px;display:flex;overflow:auto hidden}.primary-tools button{flex:0 0 68px;grid-template-rows:32px 15px;grid-template-columns:1fr;justify-items:center;min-width:68px}.tool-drawer{width:auto;max-height:min(54vh,520px);bottom:calc(100% + 8px);left:10px;right:10px}.saved-indicator{display:none}}