:root { --border:#e5e7eb; --text:#111827; --muted:#6b7280; }
body { font-family: system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif; margin:0; color:var(--text); background:#fff; }
.wrap { max-width: 920px; margin: 40px auto; padding: 0 16px; }
h1 { font-size: 44px; margin: 0 0 6px; }
.lead { margin: 0 0 18px; color: var(--muted); font-size: 18px; }
.card { border:1px solid var(--border); border-radius: 14px; padding: 18px; }
h2 { margin: 0 0 12px; font-size: 22px; }
label { display:block; font-size: 14px; margin: 10px 0; }
input, select { width: 100%; padding: 10px; border:1px solid var(--border); border-radius: 10px; font-size: 16px; }
.grid { display:grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
@media (max-width: 820px){ .grid { grid-template-columns: 1fr; } }
button { margin-top: 12px; padding: 10px 14px; border-radius: 10px; border:1px solid var(--border); background:#111827; color:#fff; font-size: 16px; cursor:pointer; }
.result { margin-top: 14px; padding: 12px; border-radius: 10px; background:#f9fafb; border:1px solid var(--border); }
.note { margin-top: 10px; color: var(--muted); font-size: 13px; }
.footer { margin-top: 18px; color: var(--muted); font-size: 14px; }
/* Skryj výsledek, dokud je prázdný */
.result:empty {
  display: none;
}