:root { --b:#111; --g:#666; --bg:#fff; --bd:#e6e6e6; }
* { box-sizing:border-box; }
body { font-family: system-ui, -apple-system, Segoe UI, Arial; background:var(--bg); margin:0; color:var(--b); }
.wrap { max-width: 1100px; margin: 28px auto; padding: 0 16px; }
.grid { display:grid; grid-template-columns: 1fr 1fr; gap:16px; align-items:start; }
.card { border:1px solid var(--bd); border-radius:14px; padding:16px; background:#fff; }
.card.inner { margin-top:12px; background:#fafafa; }
.muted { color:var(--g); font-size:14px; }
.templates { display:grid; grid-template-columns: 1fr; gap:10px; margin-top:10px; }
.template { text-align:left; border:1px solid var(--bd); border-radius:12px; padding:12px; background:#fafafa; cursor:pointer; }
.template.selected { border-color:#111; background:#f0f0f0; }
label { display:block; margin-top:10px; font-size:14px; }
input, textarea, select { width:100%; padding:10px; border:1px solid var(--bd); border-radius:10px; font:inherit; }
.row { display:flex; gap:10px; margin-top:10px; }
.col { flex:1; }
.btn { margin-top:14px; padding:12px 14px; border-radius:10px; border:0; background:#111; color:#fff; font-weight:700; cursor:pointer; }
.btn-secondary { background:#f1f1f1; color:#111; }
.big { font-size: 26px; font-weight: 800; margin: 8px 0; }
hr { border:0; border-top:1px solid var(--bd); }
@media (max-width: 900px){ .grid { grid-template-columns: 1fr; } .row { flex-direction: column; } }
