* { box-sizing: border-box; font-family: system-ui, sans-serif; }
body { margin: 0; padding: 0 12px 60px; max-width: 640px; margin-inline: auto; }
nav { display: flex; gap: 4px; position: sticky; top: 0; background: #fff; padding: 8px 0; }
nav button { flex: 1; padding: 10px; border: none; background: #eee; border-radius: 8px; }
nav button.active { background: #2563eb; color: #fff; }
textarea, input, select, button { width: 100%; padding: 10px; margin: 6px 0; border: 1px solid #ccc; border-radius: 8px; }
.event label { display: inline-block; width: 32%; }
.event input, .event select { width: 100%; }
.card { border: 1px solid #ddd; border-radius: 10px; padding: 10px; margin: 8px 0; }
.card.err { border-color: #dc2626; }
.badge { background: #dc2626; color: #fff; border-radius: 10px; padding: 0 6px; margin-left: 4px; font-size: 12px; }
.hidden { display: none !important; }
.overlay { position: fixed; inset: 0; background: #fff; z-index: 10; display: flex;
  flex-direction: column; justify-content: center; padding: 24px; }