:root{--navy:#081f4a;--blue:#0864e8;--border:#dfE7f2;--muted:#677995;--bg:#f3f6fb;--white:white}*{box-sizing:border-box}html,body{margin:0}body{font-family:Inter,system-ui,-apple-system,'Segoe UI',Arial,sans-serif;color:#14284c;background:var(--bg)}button,input,textarea,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #65baff;outline-offset:2px}.topbar{height:70px;padding:0 max(23px,calc((100vw - 1470px)/2));display:flex;align-items:center;gap:26px;background:linear-gradient(115deg,#061b4b,#0751b5);color:#fff}.identity{display:flex;align-items:center;gap:10px;margin-right:auto}.identity b{font-size:16px;letter-spacing:.07em}.identity small{display:block;font-size:9px;letter-spacing:.17em;color:#c5dafa;margin-top:2px;font-weight:700}.lettermark{width:39px;height:39px;border:2px solid #f1f7ff;border-radius:11px;display:grid;place-items:center;font-weight:900;font-size:25px;letter-spacing:-4px;padding-right:4px}.lettermark span{color:#42caff;font-size:13px;transform:translateY(8px)}.back{color:#fff!important;text-decoration:none!important;font-size:12px;border:1px solid #638ac7;padding:9px 12px;border-radius:10px;font-weight:750}.model{font-size:10px;color:#cde3ff;letter-spacing:.08em}.app{max-width:1460px;margin:0 auto;padding:28px 24px 45px}.eyebrow{color:#0968dc;font-size:10px;letter-spacing:.15em;font-weight:900}.welcome{padding:1px 3px 23px}.welcome h1{font-size:clamp(28px,3vw,40px);margin:7px 0 8px;font-weight:900;letter-spacing:-.045em;line-height:1.18}.welcome h1 em{font-style:normal;color:#0b67d7}.welcome p{margin:0;color:var(--muted);font-size:14px;max-width:790px}.layout{display:grid;grid-template-columns:minmax(325px,390px) minmax(0,1fr);gap:20px;align-items:start}.sidebar,.stage{background:white;border:1px solid var(--border);border-radius:17px;box-shadow:0 10px 30px #14326409;min-width:0}.sidebar{position:sticky;top:14px;max-height:90vh;overflow:auto}.tablist{display:flex;padding:14px 15px 0;gap:5px;border-bottom:1px solid var(--border)}.tab{background:none;border:0;border-radius:8px 8px 0 0;padding:10px 13px;color:#6b7a96;font-weight:800;font-size:12px;flex:1}.tab.is-active{background:#e8f1ff;color:#0759cf}.sidebody{padding:20px}.tabpane{display:none}.tabpane.active{display:block}.sidebody h2{font-size:15px;margin:0 0 7px;letter-spacing:-.02em}.help{font-size:11px;color:var(--muted);line-height:1.55;margin:4px 0 12px}.layerlist{display:flex;flex-direction:column;gap:5px}.layerbtn{border:1px solid #e5ebf6;background:#f9fbfe;border-radius:9px;padding:10px;display:flex;align-items:center;gap:8px;text-align:left;width:100%;font-size:12px;color:#254064}.layerbtn span:first-child{width:23px;display:grid;place-items:center;color:#2772e3;font-weight:bold}.layerbtn .layername{flex:1;min-width:0;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.layerbtn.selected{border-color:#3381eb;background:#e9f3ff}.layerbtn .pos{font-size:10px;color:#92a2bd}.addblue{width:100%;border:1px dashed #98bbef;border-radius:10px;background:#edf5ff;padding:12px;color:#0864df;font-weight:800;font-size:12px;margin-top:13px}.tool-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.tool-grid button{min-height:70px;border:1px solid #dce6f3;border-radius:11px;background:#f9fbfe;color:#2160be;font-size:24px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}.tool-grid span{font-size:11px;color:#455b78}.upload{border:1.5px dashed #8db7ed;border-radius:11px;padding:14px;display:flex;flex-direction:column;align-items:center;gap:5px;margin:14px 0;cursor:pointer;background:#f3f8ff}.upload span{font-size:22px;color:#1375dc}.upload strong{font-size:12px}.upload small{font-size:10px;color:#72849d}.propertybox,.brandcard{margin-top:18px;border-top:1px solid #e4eaf3;padding-top:19px}.prop-top{display:flex;align-items:baseline;justify-content:space-between;gap:10px}.prop-top span{font-size:10px;color:#0a6ed5}.empty{font-size:12px;color:#75839a;padding:13px;background:#f9fbff;border:1px dashed #d3dfed;border-radius:9px}.fieldlabel{display:flex;flex-direction:column;gap:5px;font-weight:750;font-size:11px;color:#3b506e;margin-bottom:12px}input[type=number],input[type=text],textarea,select{width:100%;border:1px solid #d8e2f0;border-radius:8px;padding:9px;color:#19345f;background:white;min-width:0;font-size:12px}textarea{resize:vertical;min-height:68px;line-height:1.45}input[type=color]{width:100%;height:39px;border:1px solid #d8e2f0;border-radius:8px;background:#fff;padding:4px;cursor:pointer}.two-cols{display:grid;grid-template-columns:1fr 1fr;gap:10px}.check{display:flex;align-items:flex-start;gap:8px;font-size:12px;color:#516888;margin:12px 0}.check input{accent-color:#0b64e3;margin-top:2px}.actions{display:grid;grid-template-columns:1fr 1fr;gap:7px}.actions button{border:1px solid #d7e3f2;border-radius:8px;background:#f7faff;padding:8px 5px;font-size:11px;font-weight:800;color:#285d98}.actions .danger{color:#a72739;border-color:#fad3d9;background:#fff6f7}.colorrow{display:grid;grid-template-columns:53px 1fr 39px;gap:7px}.colorrow #resetColor{font-size:23px;border:1px solid #d8e2f0;background:#fff;border-radius:8px;color:#53729a}.swatches{display:flex;gap:12px;margin:14px 0}.swatches button{height:27px;width:27px;border-radius:50%;border:2px solid white;outline:1px solid #d4dfeb;background:var(--c)}.stage{padding:20px 23px}.stage-head{display:flex;justify-content:space-between;align-items:center;gap:14px}.stage-head h2{margin:4px 0 0;font-size:19px}.stage-tools{display:flex;gap:7px;flex-wrap:wrap}.stage-tools button,.actionbar button,#saveJSON,#loadJSON{border:1px solid #d6e1f1;border-radius:8px;background:white;color:#326099;padding:8px 12px;font-size:11px;font-weight:800}.stage-tools button:disabled{opacity:.4;cursor:default}.actionbar{margin:17px 0;padding:10px 12px;background:#f5f8fd;border:1px solid #e6edf8;border-radius:10px;display:flex;gap:7px;align-items:center;flex-wrap:wrap}.actionbar button{border-color:#bfdaff;color:#0b61cc;background:#ebf4ff}.actionbar span{color:#72839c;font-size:11px;margin-left:auto}.viewport{display:flex;justify-content:center;padding:10px;background:repeating-linear-gradient(45deg,#f6f8fc 0 12px,#f0f4fa 12px 24px);border-radius:12px}.paper{width:min(100%,490px);border-radius:4px;overflow:hidden;box-shadow:0 12px 36px #09204330;background:white}.paper canvas{display:block;width:100%;height:auto;touch-action:none;cursor:default}.stage-bottom{display:flex;justify-content:space-between;gap:10px;margin:14px 1px;font-size:11px;color:#6984a3}.download-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:9px}.download-grid button{border-radius:10px;min-height:44px}.download-grid #savePNG{border:1px solid #0b59ce;background:linear-gradient(120deg,#096aee,#064ba5);color:white;font-weight:800;font-size:12px}.warning{font-size:11px;line-height:1.55;border:1px solid #e5eaf3;padding:13px;border-radius:10px;color:#62748f;background:#fbfcfe;margin-top:17px}footer{max-width:1460px;margin:0 auto;padding:21px 24px;color:#7186a4;font-size:11px;border-top:1px solid #e5eaf3}@media(max-width:980px){.layout{grid-template-columns:1fr}.sidebar{position:static;max-height:none}.stage{order:2}.paper{width:min(100%,530px)}}@media(max-width:650px){.app{padding:20px 12px}.topbar{padding:0 13px;gap:10px}.model{display:none}.stage{padding:15px 11px}.stage-head{align-items:flex-start;flex-wrap:wrap}.download-grid{grid-template-columns:1fr}.actionbar span{width:100%;margin-left:0}.sidebar{border-radius:12px}.topbar .back{font-size:10px}}

/* v2.1 — painel de plano de fundo */
.tablist{gap:3px;padding-left:11px;padding-right:11px}
.tab{padding:10px 7px;font-size:11px}
.bg-choices{display:grid;grid-template-columns:1fr 1fr;gap:8px;border:0;padding:0;margin:15px 0 20px}
.bg-choice{border:1px solid #dae5f3;background:#f8fbff;border-radius:10px;display:flex;align-items:center;gap:8px;padding:12px 9px;cursor:pointer;color:#203b63;font-size:12px}
.bg-choice:has(input:checked){background:#eaf3ff;border-color:#2775e5;box-shadow:0 0 0 1px #2775e5 inset}
.bg-choice input{accent-color:#1765db;width:14px;height:14px;margin:0}
.bg-choice span{font-size:21px;color:#2372cf;font-weight:900;line-height:1}
.bg-choice strong{font-size:11px}
#bgImageFields .upload{margin-top:2px}
.asset-note{font-size:11px;color:#4c719c;overflow-wrap:anywhere;margin-bottom:11px}
#tab-fundo input[type=range]{width:100%;accent-color:#0876F9;cursor:pointer;padding:0}
#tab-fundo output{font-weight:600;color:#0e6bdd}
.editor-alert,.bg-hint{padding:11px;border-radius:9px;font-size:11px;line-height:1.55;margin:11px 0}
.editor-alert{color:#80541a;border:1px solid #f3d99e;background:#fffaf0}
.bg-hint{color:#4e6684;border:1px solid #e2eaf5;background:#f7f9fd}
.tiny-btn{border:1px solid #dce4ee;border-radius:8px;background:white;font-size:11px;padding:8px 10px;color:#335675;font-weight:700;margin-bottom:4px}
.sr-only{position:absolute;clip:rect(0 0 0 0);clip-path:inset(50%);width:1px;height:1px;overflow:hidden;white-space:nowrap}