:root {
  --bg: #ffffff;
  --fg: #1a1a1a;
  --muted: #5c5c5c;
  --line: #e2e2e2;
  --panel: #f6f6f6;
  --accent: #1f5fbf;
  --ok: #1b7f3b;
  --ok-bg: #eaf6ee;
  --no: #b3261e;
  --no-bg: #fbeceb;
  --maybe: #8a6d00;
  --maybe-bg: #fff6d6;
  --radius: 6px;
  --max: 1100px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #121315; --fg: #ececec; --muted: #a3a3a3; --line: #2c2e31; --panel: #1b1d20;
    --accent: #7fb0ff; --ok: #6fd08f; --ok-bg: #16281c; --no: #ff8a80; --no-bg: #301b1a;
    --maybe: #ffd866; --maybe-bg: #2e2810;
  }
}
:root[data-theme="dark"] {
  --bg: #121315; --fg: #ececec; --muted: #a3a3a3; --line: #2c2e31; --panel: #1b1d20;
  --accent: #7fb0ff; --ok: #6fd08f; --ok-bg: #16281c; --no: #ff8a80; --no-bg: #301b1a;
  --maybe: #ffd866; --maybe-bg: #2e2810;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--fg);
  font: 16px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
a { color: var(--accent); }
h1, h2, h3 { line-height: 1.2; margin: 0 0 .5rem; }
h1 { font-size: 1.5rem; }
h2 { font-size: 1.15rem; }
h3 { font-size: 1rem; }
p { margin: 0 0 .75rem; }
small, .muted { color: var(--muted); }
code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .9em; }

.wrap { max-width: var(--max); margin: 0 auto; padding: 0 16px; }
header.site { border-bottom: 1px solid var(--line); }
header.site .wrap { display: flex; align-items: baseline; gap: 1.25rem; padding: .75rem 16px; flex-wrap: wrap; }
.wordmark { font-weight: 650; text-decoration: none; color: var(--fg); letter-spacing: -.01em; }
header nav a { margin-right: 1rem; color: var(--muted); text-decoration: none; font-size: .95rem; }
header nav a:hover { color: var(--fg); }
main { padding: 1.25rem 0 3rem; }
footer.site { border-top: 1px solid var(--line); padding: 1rem 0 2rem; font-size: .85rem; color: var(--muted); }

.notice { background: var(--maybe-bg); color: var(--fg); border-left: 3px solid var(--maybe); padding: .6rem .8rem; border-radius: var(--radius); margin-bottom: 1rem; font-size: .92rem; }

/* Tool layout */
.tool { display: grid; grid-template-columns: minmax(260px, 340px) minmax(0, 1fr); gap: 2rem; align-items: start; }
.tool > * { min-width: 0; }
@media (max-width: 760px) { .tool { grid-template-columns: minmax(0, 1fr); gap: 1.25rem; } }
.form { position: sticky; top: 1rem; }
@media (max-width: 760px) { .form { position: static; } }
.field { margin-bottom: 1rem; }
.field label.title { display: block; font-weight: 600; font-size: .92rem; margin-bottom: .25rem; }
.field .help { font-size: .82rem; color: var(--muted); margin-top: .2rem; }
select, input[type="number"], input[type="text"], input[type="email"], textarea {
  width: 100%; padding: .45rem .55rem; border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--bg); color: var(--fg); font: inherit;
}
textarea { min-height: 8rem; resize: vertical; }
select { max-width: 100%; }
.seg { display: flex; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.seg label { flex: 1; text-align: center; padding: .4rem .5rem; cursor: pointer; font-size: .92rem; border-right: 1px solid var(--line); }
.seg label:last-child { border-right: 0; }
.seg input { position: absolute; opacity: 0; pointer-events: none; }
.seg input:checked + span { font-weight: 600; }
.seg label:has(input:checked) { background: var(--panel); box-shadow: inset 0 -2px 0 var(--accent); }
.slider { display: flex; align-items: center; gap: .75rem; }
.slider input[type="range"] { flex: 1; accent-color: var(--accent); }
.slider output { min-width: 2ch; font-variant-numeric: tabular-nums; font-weight: 600; }
.actions { display: flex; gap: .75rem; align-items: center; margin-top: .5rem; font-size: .85rem; }
button, .btn { font: inherit; padding: .45rem .8rem; border-radius: var(--radius); border: 1px solid var(--line); background: var(--panel); color: var(--fg); cursor: pointer; }
button.primary { background: var(--accent); color: #fff; border-color: var(--accent); }

/* Results */
.group { margin-bottom: 1.75rem; }
.group h2 { display: flex; align-items: center; gap: .5rem; padding-bottom: .35rem; border-bottom: 1px solid var(--line); margin-bottom: .75rem; }
.group h2 .count { font-weight: 500; color: var(--muted); font-size: .9rem; }
.card { border: 1px solid var(--line); border-radius: var(--radius); padding: .7rem .9rem; margin-bottom: .6rem; }
.card .head { display: flex; flex-wrap: wrap; align-items: baseline; gap: .4rem .6rem; }
.card details { margin-top: .4rem; }
.card summary { cursor: pointer; font-size: .85rem; color: var(--accent); width: max-content; }
.card .name { font-weight: 600; }
.card .brand { color: var(--muted); font-size: .9rem; }
.badge { font-size: .74rem; padding: .1rem .45rem; border-radius: 999px; border: 1px solid var(--line); color: var(--muted); white-space: nowrap; }
.badge.ok { color: var(--ok); background: var(--ok-bg); border-color: transparent; }
.badge.no { color: var(--no); background: var(--no-bg); border-color: transparent; }
.badge.maybe { color: var(--maybe); background: var(--maybe-bg); border-color: transparent; }
.badge.draft { color: var(--maybe); border-color: var(--maybe); }
.reasons { margin: .4rem 0 0; padding-left: 1.1rem; font-size: .92rem; }
.reasons li { margin-bottom: .15rem; }
.reasons.no li::marker { color: var(--no); }
.card .body { margin-top: .5rem; padding-top: .5rem; border-top: 1px dashed var(--line); font-size: .9rem; }
.card .body h4 { margin: .4rem 0 .2rem; font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.card .body ul { margin: 0 0 .4rem; padding-left: 1.1rem; }
.empty { color: var(--muted); font-size: .92rem; }

/* Criteria table */
.table-wrap { overflow-x: auto; }
table.criteria { border-collapse: collapse; width: 100%; font-size: .88rem; }
table.criteria th, table.criteria td { border: 1px solid var(--line); padding: .45rem .55rem; vertical-align: top; text-align: left; }
table.criteria th { background: var(--panel); position: sticky; top: 0; }
table.criteria td ul { margin: 0; padding-left: 1rem; }
table.criteria .drug { white-space: nowrap; font-weight: 600; }

/* Home */
.disease-list a { display: block; padding: .8rem 1rem; border: 1px solid var(--line); border-radius: var(--radius); text-decoration: none; color: var(--fg); margin-bottom: .6rem; }
.disease-list a:hover { background: var(--panel); }
.disease-list .meta { color: var(--muted); font-size: .85rem; }

/* Contact */
form.contact { max-width: 560px; }
form.contact .field { margin-bottom: .9rem; }
.hp { position: absolute; left: -9999px; }

@media print {
  header.site nav, .actions, footer.site, .form .help { display: none; }
  .tool { grid-template-columns: 1fr; }
  .card { break-inside: avoid; }
  .card details { display: block; } .card details > .body { display: block; } .card summary { display: none; }
}