/* Criar: o editor ocupa a tela; a escolha de modelo é uma grade de cartões proporcionais. */
body.app{overflow:auto}
.criar .escolha{padding:48px 0 72px}
.criar h1{font-size:clamp(30px,4.2vw,52px);margin:10px 0 14px}
.modelos{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));margin:28px 0 20px}
.modelo{display:flex;flex-direction:column;gap:10px;background:var(--painel);border:1px solid var(--line);border-radius:16px;padding:12px;color:var(--ink);cursor:pointer;text-align:left;font:inherit;transition:border-color .15s}.modelo:hover,.modelo:focus-visible{border-color:var(--brand)}
.modelo .previa{width:100%;aspect-ratio:var(--prop,1);max-height:220px;border-radius:10px;border:1px solid var(--line);background:#fff;display:flex;align-items:flex-end;padding:10px;overflow:hidden}
.modelo .previa b{font:600 13px/1.2 Sora,sans-serif;color:#000;background:rgba(255,255,255,.85);padding:4px 8px;border-radius:6px}
.modelo h3{font-size:16px;margin:0}.modelo p{margin:0;font-size:13px;color:var(--mut)}
.link{color:var(--brand);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.editor{display:grid;grid-template-columns:300px 1fr;min-height:calc(100vh - 58px)}
.painel-lateral{border-right:1px solid var(--line);padding:18px 16px;display:flex;flex-direction:column;gap:22px;overflow:auto;background:var(--bg2)}
.grupo .k{margin-bottom:10px}
.botoes{display:flex;flex-wrap:wrap;gap:8px}.botoes .bt{height:36px;padding:0 14px;font-size:14px}.bt.perigo{border-color:#ff8a7a;color:#ff8a7a}
.campos{display:grid;gap:8px;margin-bottom:10px}.campos label{display:grid;grid-template-columns:84px 1fr;align-items:center;gap:8px;font-size:13px;color:var(--mut)}
.campos input,.campos select{font:inherit;font-size:14px;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:6px 8px;min-width:0}
.campos input[type=color]{padding:2px;height:34px;width:56px}
.palco{display:flex;align-items:center;justify-content:center;padding:24px;background:#07080A;overflow:auto}
.palco canvas{box-shadow:0 20px 60px rgba(0,0,0,.6)}
.canvas-container{margin:auto}
@media (max-width:860px){.editor{grid-template-columns:1fr}.painel-lateral{border-right:0;border-bottom:1px solid var(--line);max-height:46vh}.palco{padding:12px}}
