:root{color:#171717;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;--focus:#0f766e;--ink:#111;--muted:#60646c;--line:#d9dee5;--surface:#fff;--surface-soft:#f8fafc;--accent:#16a34a;--accent-dark:#15803d;background:#eef2f3;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%}html{overflow-x:hidden}body{background:linear-gradient(140deg,#16a34a14,#0ea5e914),#eef2f3;min-width:320px;margin:0;overflow-x:hidden}button,input,select{font:inherit}a{color:inherit}button{cursor:pointer}button:disabled{cursor:wait;opacity:.72}button:focus-visible,input:focus-visible,select:focus-visible,label:focus-visible{outline-offset:3px;outline:3px solid #0f766e59}.app{place-items:start center;width:100%;min-height:100svh;padding:10px;display:grid}.app-card{background:var(--surface);border:1px solid #11111114;border-radius:8px;width:min(100%,640px);padding:16px;box-shadow:0 20px 60px #0f172a1f}.preview-mode .app-card{width:min(100%,620px)}.app-header{align-items:center;gap:11px;margin-bottom:14px;display:flex}.brand-mark{border:2px solid var(--ink);background:#fff;border-radius:8px;flex:none;grid-template-columns:repeat(2,1fr);gap:5px;width:44px;height:44px;padding:7px;display:grid}.brand-mark span{background:var(--ink);border-radius:2px}.brand-mark span:last-child{background:var(--accent);grid-column:2;place-self:end;width:60%;height:60%}h1,h2,p{margin:0}h1{letter-spacing:0;font-size:1.75rem;line-height:1}h2{letter-spacing:0;font-size:1rem;line-height:1.2}.app-header p,.preview-heading p,.status-text{color:var(--muted)}.qr-form{gap:11px;display:grid}.form-section{gap:6px;display:grid}.field-label{color:#24272d;font-weight:750}input[type=url],input[type=text],select{border:1px solid var(--line);width:100%;min-height:44px;color:var(--ink);background:#fff;border-radius:8px;padding:0 14px}select{cursor:pointer}.size-input-wrap{border:1px solid var(--line);background:#fff;border-radius:8px;grid-template-columns:1fr auto;align-items:center;display:grid;overflow:hidden}.size-input-wrap input{border:0}.size-input-wrap span{color:var(--muted);padding:0 14px;font-weight:800}.quick-sizes{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.chip,.secondary-button,.icon-button{border:1px solid var(--line);color:var(--ink);background:#fff}.chip{border-radius:8px;min-height:36px;font-weight:800}.chip.selected{border-color:var(--accent-dark);box-shadow:0 0 0 3px #16a34a29}.upload-row{align-items:center;gap:10px;display:flex}input[type=file]{clip:rect(0, 0, 0, 0);width:1px;height:1px;position:absolute;overflow:hidden}.upload-button,.primary-button,.secondary-button,.icon-button{border-radius:8px;justify-content:center;align-items:center;gap:9px;min-height:44px;font-weight:850;display:inline-flex}.upload-button{background:var(--surface-soft);color:var(--ink);border:1px dashed #aab2bd;flex:1}.icon-button{width:44px}.primary-button{background:var(--accent);color:#fff;border:0;padding:0 18px}.primary-button:hover{background:var(--accent-dark)}.secondary-button{padding:0 16px}.submit-button{width:100%;margin-top:2px}.error-message,.notice-message{border-radius:8px;padding:11px 12px;line-height:1.35}.error-message{color:#9f1239;background:#fff1f2;border:1px solid #fecdd3}.notice-message{color:#14532d;background:#f0fdf4;border:1px solid #bbf7d0}.status-text{font-weight:750}.center{text-align:center;margin:12px 0}.preview-panel{gap:16px;display:grid}.qr-form+.preview-panel{border-top:1px solid var(--line);margin-top:24px;padding-top:20px}.preview-heading{text-align:center;gap:6px;display:grid}.preview-heading h2{font-size:1.3rem}.canvas-shell{place-items:center;width:100%;padding:10px 0;display:grid}.canvas-shell canvas{aspect-ratio:1;background:#fff;border-radius:8px;width:min(100%,440px);height:auto;display:block;box-shadow:0 14px 40px #0f172a1f}.action-buttons{gap:10px;display:grid}.action-buttons .primary-button,.action-buttons .secondary-button{width:100%}.support-footer{border-top:1px solid var(--line);justify-content:center;margin-top:8px;padding-top:8px;display:flex}.cafecito-button{color:#2b2118;background:#ffca48;border-radius:999px;justify-content:center;align-items:center;gap:7px;min-height:32px;padding:5px 12px;font-size:.85rem;font-weight:850;text-decoration:none;display:inline-flex}.cafecito-button:hover{background:#f4b923}.cafecito-button:focus-visible{outline-offset:3px;outline:3px solid #0f766e59}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (width>=560px){.app{padding:34px 20px}.app-card{padding:28px}.action-buttons{grid-template-columns:1.4fr 1fr 1fr}}@media (width<=559px){.app-card{padding:12px 16px}.app-header p{display:none}.support-footer{margin-top:7px}}@media (width>=1024px){.app{align-items:center}.canvas-shell canvas{width:min(100%,500px)}}