:root{--bg:#fdf6ec;--panel:#fff;--text:#2b2118;--muted:#7a6a5c;--accent:#d62828;--accent-dark:#a51d1d;--green:#2a9d8f;--border:#eadfce;--radius:16px;color:var(--text);background:var(--bg);font-family:Nunito,system-ui,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(circle at 10% 10%, #ffe8d6 0, transparent 40%), radial-gradient(circle at 90% 30%, #e0f4f1 0, transparent 35%), var(--bg);min-height:100vh;margin:0}.hero{text-align:center;padding:48px 16px 24px;position:relative}.hero h1{letter-spacing:2px;color:var(--accent);text-shadow:3px 3px #ffd166;margin:0;font-family:Bangers,cursive;font-size:clamp(2.4rem,8vw,4.5rem);transform:rotate(-2deg)}.hero h1 span{color:var(--green);display:inline-block;transform:rotate(4deg)scale(1.1)}.hero h1 small{letter-spacing:0;color:var(--text);text-shadow:none;margin-top:12px;font-family:Nunito,sans-serif;font-size:clamp(1rem,3vw,1.3rem);font-weight:900;display:block;transform:rotate(2deg)}.lang-switch{z-index:1;border:2px solid var(--border);background:var(--panel);color:var(--text);font:inherit;cursor:pointer;border-radius:999px;padding:6px 12px;font-size:.85rem;font-weight:700;position:absolute;top:12px;right:16px}.lang-switch:hover{border-color:var(--accent)}.hero p{color:var(--muted);font-size:1.1rem}main{flex-direction:column;gap:24px;max-width:1100px;margin:0 auto;padding:0 16px 48px;display:flex}.panel{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:24px;box-shadow:0 8px 24px #5032140f}h2,h3{margin-top:0;font-weight:900}.hint{color:var(--muted);font-size:.95rem}.error{color:var(--accent-dark);background:#fde8e8;border-radius:10px;padding:10px 14px}.dropzone{border:3px dashed var(--border);border-radius:var(--radius);text-align:center;cursor:pointer;color:var(--muted);flex-direction:column;align-items:center;gap:8px;padding:48px 16px;transition:border-color .2s,background .2s;display:flex}.dropzone:hover,.dropzone.dragging{border-color:var(--accent);background:#fff5f5}.dropzone strong{color:var(--text);font-size:1.2rem}.dropzone-icon{font-size:3rem}.dropzone.compact{border-width:2px;margin-top:8px;padding:10px}.setup{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:24px;display:grid}.focus-picker{cursor:crosshair;border-radius:12px;line-height:0;position:relative;overflow:hidden}.focus-picker img{object-fit:contain;-webkit-user-select:none;user-select:none;width:100%;max-height:60vh}.focus-marker{width:34px;height:34px;box-shadow:0 0 0 3px var(--accent), 0 2px 8px #0006;pointer-events:none;border:3px solid #fff;border-radius:50%;margin:-17px 0 0 -17px;transition:left .15s,top .15s;position:absolute}.settings label,.editor-controls label,.field{flex-direction:column;gap:6px;margin-bottom:14px;font-weight:700;display:flex}input[type=range]{accent-color:var(--accent)}.effects{flex-wrap:wrap;gap:8px;margin-bottom:20px;display:flex}button{font:inherit;cursor:pointer;border:2px solid var(--border);color:var(--text);background:#fff;border-radius:999px;padding:8px 16px;font-weight:700}button:disabled{opacity:.6;cursor:not-allowed}.chip.active{background:var(--green);border-color:var(--green);color:#fff}.primary{background:var(--accent);border-color:var(--accent);color:#fff}.primary:hover:not(:disabled){background:var(--accent-dark)}.primary.big{letter-spacing:1px;width:100%;padding:16px;font-family:Bangers,cursive;font-size:1.3rem}.grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;display:grid}.result{border-radius:12px;flex-direction:column;padding:0;transition:transform .15s;display:flex;overflow:hidden}.result:hover{transform:rotate(-1.5deg)scale(1.03)}.result.active{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent)}.result img{aspect-ratio:1;object-fit:cover;width:100%}.result span{padding:8px}.editor-layout{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);align-items:start;gap:24px;display:grid}input:not([type]),textarea,select{font:inherit;border:2px solid var(--border);border-radius:10px;padding:10px 12px;font-weight:400}.row{align-items:end;gap:16px;display:flex}.editor-controls label.checkbox{flex-direction:row;align-items:center;font-weight:400}.swatches{gap:8px;display:flex}.swatch{width:32px;height:32px;box-shadow:0 0 0 2px var(--border);border:3px solid #fff;padding:0}.swatch.active{box-shadow:0 0 0 3px var(--text)}.actions{flex-wrap:wrap;gap:12px;display:flex}.editor-preview{justify-content:center;display:flex;position:sticky;top:16px}.editor-preview canvas{border-radius:4px;max-width:100%;max-height:80vh;box-shadow:0 12px 32px #0003}.spinner{border:5px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:48px;height:48px;margin:48px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}footer{text-align:center;color:var(--muted);padding:24px 16px 40px;font-size:.85rem}@media (width<=800px){.setup,.editor-layout{grid-template-columns:1fr}.editor-preview{position:static}}.giant-face{border:2px solid var(--border);border-radius:12px;margin:0 0 14px;padding:8px 14px 0}.giant-face legend{padding:0 6px;font-weight:900}.giant-face .hint{margin-top:0}.editor-preview canvas.clickable{cursor:crosshair}footer p{margin:12px 0 0}.seo{color:var(--muted);line-height:1.5}.seo h2,.seo h3{color:var(--text)}.seo h3{margin:20px 0 8px}.seo details{border-top:1px solid var(--border);padding:10px 0}.seo summary{color:var(--text);cursor:pointer;font-weight:700}.seo details p{margin:8px 0 0}.coffee{color:#000;background:#fd0;border-radius:999px;padding:10px 20px;font-weight:900;text-decoration:none;transition:transform .15s;display:inline-block}.coffee:hover{transform:rotate(-3deg)scale(1.05)}
