:root { color-scheme: light; }
* { box-sizing: border-box; }
body { margin: 0; font: 15px/1.45 system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; color: #0f172a; background: #f8fafc; }

.wrap { max-width: 1100px; margin: 0 auto; padding: 16px; }
header h1 { margin: 8px 0 0; font-size: 22px; }
.tagline { margin: 4px 0 16px; color: #475569; }

.grid { display: grid; gap: 16px; grid-template-columns: 1fr; }
@media (min-width: 880px){ .grid { grid-template-columns: 1fr 1fr; } }

.card { background: #fff; border: 1px solid #e5e7eb; border-radius: 16px; padding: 16px; }
.card h2 { margin: 0 0 12px; font-size: 18px; }

.row { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
.row .full { grid-column: 1 / -1; }
label { display: flex; flex-direction: column; font-weight: 600; color: #334155; font-size: 12px; }
input, select, textarea { margin-top: 4px; padding: 10px 12px; border: 1px solid #cbd5e1; border-radius: 12px; font-size: 14px; background: #fff; }
textarea { width: 100%; }

.phones .phone-row { display: grid; grid-template-columns: 140px 1fr; gap: 8px; margin: 6px 0; }

.actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
button { background:#0f172a; color:#fff; border:none; padding:10px 14px; border-radius: 12px; font-weight:600; cursor:pointer; }
button:hover { background:#1f2937; }
button.secondary { background:#fff; color:#0f172a; border:1px solid #cbd5e1; }

.qr-box { background:#fff; border:1px solid #e5e7eb; border-radius:12px; padding:12px; width:max-content; margin:auto; }

.raw { margin-top: 12px; }
.foot { display:flex; align-items:center; justify-content:space-between; color:#475569; }
.foot a { color:#334155; text-decoration: none; margin-right: 12px; }
.foot a:hover { text-decoration: underline; }