:root { --accent: #2c6e49; --bg: #f6f8f7; --card: #ffffff; --text: #1f2a24; --err: #b00020; }
  * { box-sizing: border-box; }
  body { margin: 0; font-family: "Yu Gothic UI", "Meiryo", sans-serif; background: var(--bg); color: var(--text); line-height: 1.6; }
  main { max-width: 760px; margin: 0 auto; padding: 24px 16px 48px; }
  h1 { font-size: 1.5rem; margin: 0 0 8px; }
  .card { background: var(--card); border-radius: 10px; padding: 20px; box-shadow: 0 1px 3px rgba(0,0,0,.08); margin-bottom: 16px; }
  .field { margin-bottom: 14px; }
  label.title { display: block; font-weight: bold; margin-bottom: 4px; }
  input[type="number"], select { padding: 6px 8px; font-size: 1rem; border: 1px solid #aab7b0; border-radius: 6px; }
  .check { display: flex; align-items: center; gap: 8px; }
  button { background: var(--accent); color: #fff; border: 0; border-radius: 6px; padding: 10px 22px; font-size: 1rem; cursor: pointer; }
  button:disabled { background: #9aa8a0; cursor: not-allowed; }
  button:focus-visible, input:focus-visible, select:focus-visible, a:focus-visible { outline: 3px solid #f0b429; outline-offset: 2px; }
  #status { min-height: 1.6em; margin: 12px 0; font-weight: bold; }
  #status.error { color: var(--err); }
  #results { padding-left: 1.2em; }
  #results li { margin: 4px 0; }
  a { color: var(--accent); }
  ul.notes { padding-left: 1.2em; font-size: 0.95rem; }
  .muted { color: #55635b; font-size: 0.9rem; }

h2 {font-size:1.1rem;margin:0 0 12px;}