/* MVP styling. Polish deferred. */
body { font-family: system-ui, sans-serif; max-width: 900px; margin: 2rem auto; padding: 0 1rem; line-height: 1.5; }
header h1 { font-size: 1.5rem; margin-bottom: 0; }
header .meta { color: #666; margin-top: 0.25rem; }
fieldset { border: 1px solid #ccc; padding: 1rem; margin-bottom: 1rem; }
legend { font-weight: 600; padding: 0 0.5rem; }
fieldset.inline { display: inline-block; padding: 0.25rem 0.5rem; }
label { display: block; margin: 0.5rem 0; }
fieldset.inline label { display: inline; margin: 0 0.5rem 0 0; }
input[type=text], input[type=email], input[type=password], textarea {
  width: 100%; padding: 0.4rem; box-sizing: border-box; font-family: inherit;
}
textarea { resize: vertical; }
.hint { color: #555; font-size: 0.9rem; margin: 0.25rem 0; }
.anchor { color: #777; font-size: 0.85rem; font-style: italic; margin: 0.25rem 0 0.5rem 0; }
button { padding: 0.5rem 1rem; margin-right: 0.5rem; }
button:disabled { opacity: 0.5; }
table { width: 100%; border-collapse: collapse; }
table th, table td { border: 1px solid #ddd; padding: 0.4rem; text-align: left; vertical-align: top; }
table input[type=text] { width: 100%; }
#code_status { margin-left: 0.5rem; font-size: 0.9rem; }
#reference_status { margin-top: 0.5rem; font-size: 0.9rem; }
#preview_pane { background: #fafafa; border: 1px solid #ccc; padding: 1rem; margin-top: 1.5rem; }
.editable { min-height: 6rem; padding: 0.5rem; border: 1px solid #ddd; background: white; }
.inferred { background: #fff3cd; padding: 0 0.2rem; border-radius: 0.2rem; }
.inferred-key { background: #fff3cd; padding: 0 0.3rem; border-radius: 0.2rem; }
#result pre { background: #f6f6f6; padding: 0.5rem; overflow-x: auto; }