/* ClaySeal theme for CodeMirror 5 — matches the site palette (see web/style.css
   :root). Applied via `theme: "clayseal"` (adds the .cm-s-clayseal wrapper class).
   This file is our own work, not part of vendored CodeMirror. */

.CodeMirror.cm-s-clayseal {
  height: auto;
  min-height: 360px;
  width: 100%;
  background: var(--panel-2);
  color: var(--ink);
  font-family: var(--mono);
  font-size: 13px;
  line-height: 1.6;
  border: 1.5px solid var(--line);
  border-radius: 10px;
  padding: 6px 4px;
}
.cm-s-clayseal .CodeMirror-scroll { min-height: 360px; }
.cm-s-clayseal .CodeMirror-lines { padding: 6px 0; }
.cm-s-clayseal.CodeMirror-focused,
.cm-s-clayseal:focus-within { border-color: var(--clay); }

.cm-s-clayseal .CodeMirror-gutters {
  background: var(--panel);
  border-right: 1px solid var(--line);
}
.cm-s-clayseal .CodeMirror-linenumber { color: var(--faint); }
.cm-s-clayseal .CodeMirror-cursor { border-left: 1.5px solid var(--clay); }
.cm-s-clayseal .CodeMirror-selected { background: var(--clay-tint-2); }
.cm-s-clayseal .CodeMirror-focused .CodeMirror-selected { background: var(--clay-tint-2); }
.cm-s-clayseal .CodeMirror-activeline-background { background: var(--clay-tint); }

/* Syntax tokens */
.cm-s-clayseal .cm-keyword   { color: var(--clay); font-weight: 700; }
.cm-s-clayseal .cm-def       { color: var(--ink); font-weight: 700; }
.cm-s-clayseal .cm-builtin   { color: var(--clay-2); }
.cm-s-clayseal .cm-variable  { color: var(--ink); }
.cm-s-clayseal .cm-variable-2{ color: var(--ink-soft); }
.cm-s-clayseal .cm-property  { color: var(--ink-soft); }
.cm-s-clayseal .cm-operator  { color: var(--muted); }
.cm-s-clayseal .cm-string    { color: #2f7d47; }
.cm-s-clayseal .cm-string-2  { color: #2f7d47; }
.cm-s-clayseal .cm-number    { color: var(--danger); }
.cm-s-clayseal .cm-comment   { color: var(--faint); font-style: italic; }
.cm-s-clayseal .cm-meta      { color: var(--muted); }
.cm-s-clayseal .cm-error     { color: var(--danger); }

.cm-s-clayseal .CodeMirror-matchingbracket {
  color: var(--clay) !important;
  font-weight: 700;
  border-bottom: 1px solid var(--clay);
}
.cm-s-clayseal .CodeMirror-nonmatchingbracket { color: var(--danger) !important; }

/* Transient highlight flashed by "jump to handler" (see arena.js) */
.cm-s-clayseal .cm-flash { background: var(--clay-tint-2); transition: background .4s ease; }