/* 테스트용 최소 스타일 — 가독성만 확보한다. */
:root { color-scheme: light dark; }
body {
  font: 14px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace;
  margin: 0;
  padding: 24px;
}
main { max-width: 900px; margin: 0 auto; }
h1 { font-size: 20px; margin: 0 0 4px; }
h2 { font-size: 15px; margin: 20px 0 6px; }
.sub { margin: 0 0 20px; opacity: 0.7; }
.controls {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: end;
  margin-bottom: 16px;
}
label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; opacity: 0.8; }
input, select {
  font: inherit;
  padding: 6px 8px;
  border: 1px solid rgba(128, 128, 128, 0.4);
  border-radius: 6px;
  background: transparent;
  color: inherit;
}
button {
  font: inherit;
  padding: 7px 16px;
  border: 1px solid rgba(128, 128, 128, 0.4);
  border-radius: 6px;
  background: rgba(128, 128, 128, 0.12);
  color: inherit;
  cursor: pointer;
}
button:hover { background: rgba(128, 128, 128, 0.22); }
pre {
  margin: 0;
  padding: 12px;
  border: 1px solid rgba(128, 128, 128, 0.3);
  border-radius: 6px;
  overflow-x: auto;
  white-space: pre-wrap;
  word-break: break-all;
  min-height: 20px;
}
#result[data-state='ok'] { border-color: #2e9e5b; }
#result[data-state='fail'] { border-color: #d24; }
#log { max-height: 420px; overflow-y: auto; font-size: 12px; opacity: 0.9; }