*{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
html,body{margin:0;background:#f5f5f5;font-family:Montserrat,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial}
.app{max-width:1200px;margin:22px auto;padding:0 16px}
h1{font-size:18px;margin:0 0 12px;font-weight:900}
.panel{display:grid;gap:10px;margin-bottom:12px}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
label{display:block;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#333;margin-bottom:6px}
input{width:100%;height:40px;border:1px solid #ddd;border-radius:10px;padding:0 12px;font-size:15px}
.actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.btn{border:0;background:#111;color:#fff;padding:10px 14px;border-radius:10px;font-weight:800;cursor:pointer}
.btn.secondary{background:#eaeaea;color:#111}
.hint{font-size:12px;color:#666}
.preview-wrap{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.preview-card{background:#fff;border:1px dashed #d2d2d2;border-radius:12px;padding:10px}
.p-title{font-size:12px;font-weight:800;margin:0 0 6px;color:#666}
.preview{width:100%;height:auto;display:block;border-radius:8px}
.toast{display:none;margin-top:8px;font-size:12px;color:#b33;font-weight:700}
.toast.show{display:block}