@import "https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&display=swap";:root{color:#0f172a;background:#f1f5f9;font-family:Roboto Condensed,sans-serif}*{box-sizing:border-box}body{margin:0}#app{min-height:100vh;padding:24px}.layout{grid-template-columns:1fr 1fr;gap:20px;max-width:1200px;margin:0 auto;display:grid}.panel{background:#fff;border:1px solid #cbd5e1;border-radius:12px;padding:20px}h1,h2{margin:0 0 12px}.description{color:#334155;margin:0 0 18px}.field{margin-bottom:6px;font-weight:700;display:block}.input{border:1px solid #94a3b8;border-radius:8px;width:100%;margin-bottom:14px;padding:10px;font-size:16px}.input--multiline{resize:vertical;min-height:88px}.template-selector{margin-bottom:14px}.template-grid{flex-wrap:wrap;gap:10px;display:flex}.template-thumb{cursor:pointer;background-color:#e2e8f0;background-position:50%;background-size:cover;border:2px solid #94a3b8;border-radius:10px;width:72px;height:72px;padding:0}.template-thumb--active{border:4px solid #fdc300}.validation{color:#b91c1c;margin:0 0 14px}.actions{flex-wrap:wrap;gap:10px;display:flex}.action{color:#fff;cursor:pointer;white-space:nowrap;border:none;border-radius:8px;align-items:center;padding:12px 16px;font-size:16px;font-weight:700;display:inline-flex}.action--primary{background:#0284c7}.action--secondary{background:#475569}.action:disabled{cursor:not-allowed;background:#94a3b8}.preview-panel{flex-direction:column;display:flex}.preview-header{flex-wrap:nowrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;display:flex}.preview-header h2{white-space:nowrap;margin:0}.preview{background:#e2e8f0;border:1px solid #cbd5e1;border-radius:10px;width:100%;height:auto}@media (width<=960px){#app{padding:16px}.layout{grid-template-columns:1fr}}