/* Check page (check.html): citation check of a pasted text. */
:root {
  --ck-found: #2f7a4a; --ck-found-bg: #e5f1e8;
  --ck-check: #9a5b00; --ck-check-bg: #fbf0dc;
  --ck-miss: #a3262c; --ck-miss-bg: #f6e0df;
  --ck-amb: #2f5f8a; --ck-amb-bg: #e3ecf5;
  --ck-out: #6b6870; --ck-out-bg: #ece9e3;
}
[data-theme="dark"] {
  --ck-found: #7fc79a; --ck-found-bg: #1f3427;
  --ck-check: #e6b34f; --ck-check-bg: #3a2c12;
  --ck-miss: #ef8a8a; --ck-miss-bg: #3d1e1f;
  --ck-amb: #8db7e0; --ck-amb-bg: #1d2b3a;
  --ck-out: #aca59b; --ck-out-bg: #2a2a30;
}
body { background: var(--paper); }
.ck-shell { max-width: 980px; margin: 0 auto; padding: 32px 24px 64px; }
.ck-head h1 { margin: 6px 0 10px; font-family: var(--font-serif); font-size: 2rem; font-weight: 500; color: var(--ink); }
.ck-sub { margin: 0; max-width: 820px; font-family: var(--font-serif); font-size: 1rem; line-height: 1.6; color: var(--ink-2); }
.ck-form { margin-top: 24px; }
.ck-form textarea {
  display: block; width: 100%; margin-top: 6px; padding: 12px 14px; resize: vertical; box-sizing: border-box;
  font-family: var(--font-serif); font-size: 1rem; line-height: 1.55; color: var(--ink);
  background: var(--paper); border: 1px solid var(--ink); border-radius: 0;
}
.ck-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-top: 12px; }
.ck-actions .search-btn { padding: 8px 18px; }
.ck-btn {
  padding: 7px 14px; cursor: pointer; font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--ink-2); background: var(--paper); border: 1px solid var(--rule);
}
.ck-btn:hover { border-color: var(--ink); color: var(--ink); }
.ck-opt { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-serif); font-size: 0.9rem; color: var(--ink-2); }
.ck-status-line { font-family: var(--font-mono); font-size: 0.72rem; color: var(--ink-3); }

.ck-output { margin-top: 30px; border-top: 1px solid var(--ink); padding-top: 18px; }
.ck-output[hidden] { display: none; }
.ck-summary { margin: 0 0 8px; font-family: var(--font-mono); font-size: 0.78rem; letter-spacing: 0.04em; color: var(--ink); }
.ck-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-bottom: 16px; font-family: var(--font-mono); font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.06em; }
.ck-legend .st-found { color: var(--ck-found); } .ck-legend .st-check { color: var(--ck-check); }
.ck-legend .st-not_found { color: var(--ck-miss); } .ck-legend .st-ambiguous { color: var(--ck-amb); }
.ck-legend .st-outside { color: var(--ck-out); }

.ck-text {
  padding: 14px 16px; margin-bottom: 22px; white-space: pre-wrap; font-family: var(--font-serif); font-size: 1rem;
  line-height: 1.7; color: var(--ink-2); background: var(--paper-2); border: 1px solid var(--rule);
}
.ck-hl { color: inherit; text-decoration: none; padding: 1px 2px; border-bottom: 2px solid; }
.ck-hl sup { margin-left: 2px; font-family: var(--font-mono); font-size: 0.62rem; font-weight: 600; }
.ck-hl.st-found { background: var(--ck-found-bg); border-color: var(--ck-found); }
.ck-hl.st-check { background: var(--ck-check-bg); border-color: var(--ck-check); }
.ck-hl.st-not_found { background: var(--ck-miss-bg); border-color: var(--ck-miss); }
.ck-hl.st-ambiguous { background: var(--ck-amb-bg); border-color: var(--ck-amb); }
.ck-hl.st-outside { background: var(--ck-out-bg); border-color: var(--ck-out); }
.ck-q { text-decoration: underline dotted; text-underline-offset: 3px; }

.ck-cards { display: flex; flex-direction: column; gap: 12px; }
.ck-card { padding: 12px 16px; border: 1px solid var(--rule); border-left: 4px solid var(--ck-out); background: var(--paper); scroll-margin-top: 90px; }
.ck-card.st-found { border-left-color: var(--ck-found); }
.ck-card.st-check { border-left-color: var(--ck-check); }
.ck-card.st-not_found { border-left-color: var(--ck-miss); }
.ck-card.st-ambiguous { border-left-color: var(--ck-amb); }
.ck-card header { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.ck-num { font-family: var(--font-mono); font-size: 0.7rem; color: var(--ink-3); }
.ck-status { font-family: var(--font-mono); font-size: 0.7rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; }
.st-found .ck-status { color: var(--ck-found); } .st-check .ck-status { color: var(--ck-check); }
.st-not_found .ck-status { color: var(--ck-miss); } .st-ambiguous .ck-status { color: var(--ck-amb); }
.st-outside .ck-status { color: var(--ck-out); }
.ck-raw { flex-basis: 100%; font-family: var(--font-serif); font-size: 0.98rem; color: var(--ink); }
.ck-match { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 2px 10px; align-items: baseline; font-size: 0.86rem; }
.ck-title { font-family: var(--font-serif); font-weight: 600; color: var(--ink); }
.ck-meta { font-family: var(--font-mono); font-size: 0.68rem; color: var(--ink-3); }
.ck-links a { color: var(--garnet); font-size: 0.8rem; }
.ck-cands .ck-match { margin-top: 4px; }
.ck-note { margin: 6px 0 0; font-family: var(--font-serif); font-size: 0.92rem; line-height: 1.5; color: var(--ink-2); }
.ck-para { margin-top: 6px; font-size: 0.86rem; }
.ck-para summary { cursor: pointer; font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.04em; color: var(--ink-3); }
.ck-para p { margin: 6px 0 0; padding-left: 12px; border-left: 2px solid var(--rule); font-family: var(--font-serif); line-height: 1.55; color: var(--ink-2); white-space: pre-wrap; }
.ck-quote blockquote { margin: 6px 0 0; padding: 6px 12px; border-left: 2px solid var(--rule); font-family: var(--font-serif); font-style: italic; color: var(--ink-2); }
.ck-quote mark { background: var(--ck-check-bg); color: var(--ck-check); font-style: normal; font-weight: 600; }
.ck-foot { margin-top: 22px; display: flex; flex-wrap: wrap; gap: 10px 18px; align-items: flex-start; }
.ck-foot p { flex: 1 1 360px; margin: 0; font-family: var(--font-serif); font-size: 0.82rem; line-height: 1.5; color: var(--ink-3); }
@media (max-width: 600px) { .ck-shell { padding: 22px 16px 48px; } .ck-head h1 { font-size: 1.5rem; } }
