/* Reading surfaces only. Membership is assigned by code-themes.js; editors and
 * sample input/output never receive these classes. Keep native geometry intact. */
html[data-dtoj-code-theme],
[data-dtoj-code-preview="paper"] {
  --dtoj-code-bg: #ffffff;
  --dtoj-code-text: #24292f;
  --dtoj-code-border: #e4e4e7;
  --dtoj-code-header: #ffffff;
  --dtoj-code-muted: #626b76;
  --dtoj-code-gutter: #68727e;
  --dtoj-code-comment: #57606a;
  --dtoj-code-keyword: #cf222e;
  --dtoj-code-string: #0a3069;
  --dtoj-code-number: #0550ae;
  --dtoj-code-function: #8250df;
  --dtoj-code-type: #953800;
  --dtoj-code-attr: #0550ae;
  --dtoj-code-operator: #4b5563;
  --dtoj-code-punctuation: #4b5563;
  --dtoj-code-deleted: #a02c35;
  --dtoj-code-hover: #f0f3f6;
  --dtoj-code-focus: #0969da;
  --dtoj-code-selection-bg: #dbe7f2;
  --dtoj-code-selection-text: #243649;
  --dtoj-code-scrollbar: #a4aeb9;
  --dtoj-code-scrollbar-hover: #7c8997;
  --dtoj-code-highlight: #eaf0f7;
  --dtoj-code-clear: transparent;
  --dtoj-code-scheme: light;
}

html[data-dtoj-code-theme="classic"],
[data-dtoj-code-preview="classic"] {
  --dtoj-code-bg: #ffffff;
  --dtoj-code-text: #141414;
  --dtoj-code-border: #d9dce1;
  --dtoj-code-header: #f5f6f8;
  --dtoj-code-muted: #515965;
  --dtoj-code-gutter: #616975;
  --dtoj-code-comment: #346438;
  --dtoj-code-keyword: #0000a3;
  --dtoj-code-string: #a31515;
  --dtoj-code-number: #874100;
  --dtoj-code-function: #682d89;
  --dtoj-code-type: #2b6580;
  --dtoj-code-attr: #8b2855;
  --dtoj-code-operator: #a31515;
  --dtoj-code-punctuation: #3b3b3b;
  --dtoj-code-deleted: #a31515;
  --dtoj-code-hover: #e8edf5;
  --dtoj-code-focus: #174ea6;
  --dtoj-code-selection-bg: #d6e5fa;
  --dtoj-code-selection-text: #142d50;
  --dtoj-code-scrollbar: #a3aab5;
  --dtoj-code-scrollbar-hover: #788391;
  --dtoj-code-highlight: #eaf0fa;
  --dtoj-code-clear: transparent;
  --dtoj-code-scheme: light;
}

/* QOJ classic SHJS palette from sh_typical.min.css, as shown in the reference. */
html[data-dtoj-code-theme="qoj"],
[data-dtoj-code-preview="qoj"] {
  --dtoj-code-bg: #ffffff;
  --dtoj-code-text: #000000;
  --dtoj-code-border: #dddddd;
  --dtoj-code-header: #ffffff;
  --dtoj-code-muted: #666666;
  --dtoj-code-gutter: #666666;
  --dtoj-code-comment: #666666;
  --dtoj-code-keyword: #0000ff;
  --dtoj-code-string: #ff0000;
  --dtoj-code-number: #a900a9;
  --dtoj-code-function: #000000;
  --dtoj-code-type: #000000;
  --dtoj-code-attr: #000000;
  --dtoj-code-operator: #ff0000;
  --dtoj-code-punctuation: #ff0000;
  --dtoj-code-deleted: #ff0000;
  --dtoj-code-hover: #f3f3f3;
  --dtoj-code-focus: #0000ff;
  --dtoj-code-selection-bg: #cce2ff;
  --dtoj-code-selection-text: #000000;
  --dtoj-code-scrollbar: #b0b0b0;
  --dtoj-code-scrollbar-hover: #888888;
  --dtoj-code-highlight: #f3f3f3;
  --dtoj-code-clear: transparent;
  --dtoj-code-scheme: light;
}

html[data-dtoj-code-theme="warm"],
[data-dtoj-code-preview="warm"] {
  --dtoj-code-bg: #fbf5e8;
  --dtoj-code-text: #3d352b;
  --dtoj-code-border: #d9cebb;
  --dtoj-code-header: #f2e9d8;
  --dtoj-code-muted: #6b5b47;
  --dtoj-code-gutter: #736450;
  --dtoj-code-comment: #736450;
  --dtoj-code-keyword: #8b2942;
  --dtoj-code-string: #3d6227;
  --dtoj-code-number: #175c87;
  --dtoj-code-function: #70438e;
  --dtoj-code-type: #865022;
  --dtoj-code-attr: #175c87;
  --dtoj-code-operator: #5c5144;
  --dtoj-code-punctuation: #5c5144;
  --dtoj-code-deleted: #922d36;
  --dtoj-code-hover: #e9ddc7;
  --dtoj-code-focus: #82501e;
  --dtoj-code-selection-bg: #e4d2af;
  --dtoj-code-selection-text: #3d352b;
  --dtoj-code-scrollbar: #b5a387;
  --dtoj-code-scrollbar-hover: #937c5a;
  --dtoj-code-highlight: #eee2cc;
  --dtoj-code-clear: transparent;
  --dtoj-code-scheme: light;
}

html[data-dtoj-code-theme="ocean"],
[data-dtoj-code-preview="ocean"] {
  --dtoj-code-bg: #142333;
  --dtoj-code-text: #d8e5f0;
  --dtoj-code-border: #3a5167;
  --dtoj-code-header: #1c3043;
  --dtoj-code-muted: #adc3d6;
  --dtoj-code-gutter: #a1b8cc;
  --dtoj-code-comment: #9bb2c8;
  --dtoj-code-keyword: #d6a6ee;
  --dtoj-code-string: #b4d99a;
  --dtoj-code-number: #edc18b;
  --dtoj-code-function: #95c5f0;
  --dtoj-code-type: #e3b995;
  --dtoj-code-attr: #92d8db;
  --dtoj-code-operator: #bfd3e4;
  --dtoj-code-punctuation: #bfd3e4;
  --dtoj-code-deleted: #ffb4b9;
  --dtoj-code-hover: #2b435a;
  --dtoj-code-focus: #a7d1fb;
  --dtoj-code-selection-bg: #375773;
  --dtoj-code-selection-text: #f5faff;
  --dtoj-code-scrollbar: #59748d;
  --dtoj-code-scrollbar-hover: #7c97b0;
  --dtoj-code-highlight: #253e55;
  --dtoj-code-clear: transparent;
  --dtoj-code-scheme: dark;
}

html[data-dtoj-code-theme="graphite"],
[data-dtoj-code-preview="graphite"] {
  --dtoj-code-bg: #202124;
  --dtoj-code-text: #e8eaed;
  --dtoj-code-border: #494d55;
  --dtoj-code-header: #292b2f;
  --dtoj-code-muted: #bdc2ca;
  --dtoj-code-gutter: #adb3be;
  --dtoj-code-comment: #b0b3b8;
  --dtoj-code-keyword: #dda7ee;
  --dtoj-code-string: #aed899;
  --dtoj-code-number: #e7bf8d;
  --dtoj-code-function: #a0c6f3;
  --dtoj-code-type: #e3b08c;
  --dtoj-code-attr: #9fd3db;
  --dtoj-code-operator: #d0d3d8;
  --dtoj-code-punctuation: #d0d3d8;
  --dtoj-code-deleted: #ffb0b7;
  --dtoj-code-hover: #393d44;
  --dtoj-code-focus: #aecbfa;
  --dtoj-code-selection-bg: #4a5363;
  --dtoj-code-selection-text: #ffffff;
  --dtoj-code-scrollbar: #69717e;
  --dtoj-code-scrollbar-hover: #8b95a4;
  --dtoj-code-highlight: #343a45;
  --dtoj-code-clear: transparent;
  --dtoj-code-scheme: dark;
}

/* Set colors on the marked pre, beyond each page's legacy variable scope. The
 * importance is limited to marked reading surfaces and defeats existing skins. */
html[data-dtoj-code-theme] pre.dtoj-reading-code,
html[data-dtoj-code-theme] .dtoj-reading-code-frame {
  --code-bg: var(--dtoj-code-bg);
  --code-border: var(--dtoj-code-border);
  --code-text: var(--dtoj-code-text);
  --tk-comment: var(--dtoj-code-comment);
  --tk-keyword: var(--dtoj-code-keyword);
  --tk-string: var(--dtoj-code-string);
  --tk-number: var(--dtoj-code-number);
  --tk-func: var(--dtoj-code-function);
  --tk-type: var(--dtoj-code-type);
  --tk-attr: var(--dtoj-code-attr);
  --tk-op: var(--dtoj-code-operator);
  --tk-punc: var(--dtoj-code-punctuation);
  background-color: var(--dtoj-code-bg) !important;
  border-color: var(--dtoj-code-border) !important;
  color: var(--dtoj-code-text) !important;
  color-scheme: var(--dtoj-code-scheme) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code {
  background-image: none !important;
  scrollbar-color: var(--dtoj-code-scrollbar) var(--dtoj-code-bg) !important;
  text-shadow: none !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code code {
  background: var(--dtoj-code-clear) !important;
  color: var(--dtoj-code-text) !important;
  text-shadow: none !important;
}

/* Existing Mac window dots are background images; changing the underlying
 * color preserves their artwork and each page's header dimensions. */
html[data-dtoj-code-theme] pre.dtoj-reading-code::before,
html[data-dtoj-code-theme] .dtoj-reading-code-frame :is(.paste-code-head, .pet-ai-code-header) {
  background-color: var(--dtoj-code-header) !important;
  border-color: var(--dtoj-code-border) !important;
  color: var(--dtoj-code-muted) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code::after,
html[data-dtoj-code-theme] .dtoj-reading-code-frame :is(.paste-code-head > span, .pet-ai-code-language) {
  color: var(--dtoj-code-muted) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code :is(.token, [class*="hljs-"], .hljs) {
  background: var(--dtoj-code-clear) !important;
  color: var(--dtoj-code-text) !important;
  text-shadow: none !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code :is(.token.comment, .token.prolog, .token.doctype, .token.cdata, .hljs-comment, .hljs-quote, .c, .c1, .cm, .cp, .cs) {
  color: var(--dtoj-code-comment) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code :is(.token.keyword, .token.atrule, .token.attr-value, .hljs-keyword, .hljs-selector-tag, .hljs-meta, .k, .kc, .kd, .kn, .kp, .kr) {
  color: var(--dtoj-code-keyword) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code :is(.token.string, .token.char, .token.regex, .token.inserted, .hljs-string, .hljs-regexp, .s, .s1, .s2, .sa, .sb, .sc, .sd, .se, .sh, .si, .sr, .ss) {
  color: var(--dtoj-code-string) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code :is(.token.number, .token.boolean, .token.constant, .token.symbol, .hljs-number, .hljs-literal, .m, .mb, .mf, .mh, .mi, .mo, .il) {
  color: var(--dtoj-code-number) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code :is(.token.function, .hljs-title, .hljs-title.function_, .nf, .fm) {
  color: var(--dtoj-code-function) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code :is(.token.class-name, .token.builtin, .hljs-type, .hljs-built_in, .hljs-title.class_, .kt, .nc, .nb, .bp) {
  color: var(--dtoj-code-type) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code :is(.token.property, .token.attr-name, .token.tag, .token.selector, .token.url, .hljs-attr, .hljs-attribute, .hljs-selector-class, .hljs-selector-id, .na, .nt) {
  color: var(--dtoj-code-attr) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code :is(.token.operator, .token.entity, .hljs-operator, .o, .ow) {
  color: var(--dtoj-code-operator) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code :is(.token.punctuation, .hljs-punctuation, .p) {
  color: var(--dtoj-code-punctuation) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code :is(.token.deleted, .hljs-deletion, .gd) {
  color: var(--dtoj-code-deleted) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code :is(.token.important, .hljs-addition, .gi) {
  color: var(--dtoj-code-number) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code .token.directive.tag .tag {
  background: var(--dtoj-code-clear) !important;
  color: var(--dtoj-code-keyword) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code :is(.line-numbers-rows, .pet-ai-code-lines) {
  border-color: var(--dtoj-code-border) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code :is(.line-numbers-rows, .pet-ai-code-lines) > span::before {
  color: var(--dtoj-code-gutter) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code .line-highlight {
  background: var(--dtoj-code-highlight) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code .line-highlight::before,
html[data-dtoj-code-theme] pre.dtoj-reading-code .line-highlight::after {
  background: var(--dtoj-code-header) !important;
  color: var(--dtoj-code-muted) !important;
}

html[data-dtoj-code-theme] .dtoj-reading-code-frame > .toolbar .toolbar-item > :is(a, button, span),
html[data-dtoj-code-theme] #panel .code-toolbar.dtoj-reading-code-frame > .toolbar .toolbar-item > :is(a, button, span),
html[data-dtoj-code-theme] .dtoj-reading-code-frame :is(.paste-code-copy, .pet-ai-code-copy),
html[data-dtoj-code-theme] #problem-page .typo.richmedia div.code-toolbar.dtoj-reading-code-frame > .toolbar .toolbar-item > :is(a, button) {
  background: var(--dtoj-code-header) !important;
  border-color: var(--dtoj-code-border) !important;
  color: var(--dtoj-code-muted) !important;
  text-shadow: none !important;
}

html[data-dtoj-code-theme] .dtoj-reading-code-frame > .toolbar .toolbar-item > :is(a, button):hover,
html[data-dtoj-code-theme] #panel .code-toolbar.dtoj-reading-code-frame > .toolbar .toolbar-item > :is(a, button):hover,
html[data-dtoj-code-theme] .dtoj-reading-code-frame :is(.paste-code-copy, .pet-ai-code-copy):hover,
html[data-dtoj-code-theme] #problem-page .typo.richmedia div.code-toolbar.dtoj-reading-code-frame > .toolbar .toolbar-item > :is(a, button):hover {
  background: var(--dtoj-code-hover) !important;
  border-color: var(--dtoj-code-border) !important;
  color: var(--dtoj-code-text) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code:focus-visible,
html[data-dtoj-code-theme] .dtoj-reading-code-frame :is(a, button):focus-visible {
  outline-color: var(--dtoj-code-focus) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code::selection,
html[data-dtoj-code-theme] pre.dtoj-reading-code *::selection {
  background: var(--dtoj-code-selection-bg) !important;
  color: var(--dtoj-code-selection-text) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code::-webkit-scrollbar,
html[data-dtoj-code-theme] pre.dtoj-reading-code::-webkit-scrollbar-track,
html[data-dtoj-code-theme] pre.dtoj-reading-code::-webkit-scrollbar-corner {
  background: var(--dtoj-code-bg) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code::-webkit-scrollbar-thumb {
  background: var(--dtoj-code-scrollbar) !important;
}

html[data-dtoj-code-theme] pre.dtoj-reading-code::-webkit-scrollbar-thumb:hover {
  background: var(--dtoj-code-scrollbar-hover) !important;
}

/* The settings preview is the only newly sized code surface. Its selection is
 * scoped to the wrapper, so unsaved changes leave other code blocks alone. */
html[data-dtoj-code-theme] .dtoj-code-theme-preview {
  box-sizing: border-box;
  min-width: 0;
  max-width: 100%;
  margin: 12px 0 4px;
  border: 1px solid var(--dtoj-code-border);
  border-radius: 8px;
  overflow: hidden;
  background: var(--dtoj-code-bg);
}

html[data-dtoj-code-theme] .dtoj-code-theme-preview-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  margin: 0;
  padding: 8px 14px;
  border-bottom: 1px solid var(--dtoj-code-border);
  background: var(--dtoj-code-header);
  color: var(--dtoj-code-muted);
  font-size: 12px;
  line-height: 1.6;
}

html[data-dtoj-code-theme] .dtoj-code-theme-preview-label > span {
  min-width: 0;
  overflow-wrap: anywhere;
  text-align: right;
}

html[data-dtoj-code-theme] .dtoj-code-theme-preview pre.dtoj-reading-code {
  box-sizing: border-box;
  max-width: 100%;
  margin: 0 !important;
  padding: 14px 18px !important;
  border: 0 !important;
  border-radius: 0 0 8px 8px !important;
  box-shadow: none !important;
  font-size: 14px !important;
  line-height: 1.65 !important;
  white-space: pre;
  overflow: auto;
}

html[data-dtoj-code-theme] .dtoj-code-theme-preview pre.dtoj-reading-code > code {
  font-size: inherit;
  line-height: inherit;
  white-space: pre;
}

/* The synthetic preview needs no copy toolbar from the native highlighter. */
html[data-dtoj-code-theme] .dtoj-code-theme-preview .code-toolbar > .toolbar {
  display: none !important;
}

/* Typography and preprocessor colors for the screenshot theme only. */
html[data-dtoj-code-theme="qoj"] pre.dtoj-reading-code:not([data-dtoj-code-preview] pre),
html[data-dtoj-code-theme] [data-dtoj-code-preview="qoj"] pre.dtoj-reading-code {
  font-weight: 400 !important;
}

html[data-dtoj-code-theme="qoj"] pre.dtoj-reading-code:not([data-dtoj-code-preview] pre) :is(.token.keyword, .token.atrule, .hljs-keyword, .hljs-selector-tag, .k, .kc, .kd, .kn, .kp, .kr),
html[data-dtoj-code-theme] [data-dtoj-code-preview="qoj"] pre.dtoj-reading-code :is(.token.keyword, .token.atrule, .hljs-keyword, .hljs-selector-tag, .k, .kc, .kd, .kn, .kp, .kr) {
  font-weight: 700 !important;
}

html[data-dtoj-code-theme="qoj"] pre.dtoj-reading-code:not([data-dtoj-code-preview] pre) :is(.token.function, .hljs-title.function_, .hljs-title, .nf, .fm),
html[data-dtoj-code-theme] [data-dtoj-code-preview="qoj"] pre.dtoj-reading-code :is(.token.function, .hljs-title.function_, .hljs-title, .nf, .fm) {
  font-weight: 700 !important;
}

html[data-dtoj-code-theme="qoj"] pre.dtoj-reading-code:not([data-dtoj-code-preview] pre) :is(.token.comment, .hljs-comment, .c, .c1, .cm, .cs),
html[data-dtoj-code-theme] [data-dtoj-code-preview="qoj"] pre.dtoj-reading-code :is(.token.comment, .hljs-comment, .c, .c1, .cm, .cs) {
  font-style: italic !important;
  font-weight: 400 !important;
}

html[data-dtoj-code-theme="qoj"] pre.dtoj-reading-code:not([data-dtoj-code-preview] pre) :is(.token.dtoj-qoj-type, .hljs-keyword.dtoj-qoj-type, .hljs-type, .kt),
html[data-dtoj-code-theme] [data-dtoj-code-preview="qoj"] pre.dtoj-reading-code :is(.token.dtoj-qoj-type, .hljs-keyword.dtoj-qoj-type, .hljs-type, .kt) {
  color: #0000ff !important;
  font-weight: 400 !important;
}

html[data-dtoj-code-theme="qoj"] pre.dtoj-reading-code:not([data-dtoj-code-preview] pre) :is(.token.directive-hash, .token.directive, .hljs-meta, .cp),
html[data-dtoj-code-theme] [data-dtoj-code-preview="qoj"] pre.dtoj-reading-code :is(.token.directive-hash, .token.directive, .hljs-meta, .cp) {
  color: #00b800 !important;
  font-weight: 400 !important;
}

html[data-dtoj-code-theme="qoj"] pre.dtoj-reading-code:not([data-dtoj-code-preview] pre) :is(.token.macro-name:not(.function), .token.expression),
html[data-dtoj-code-theme] [data-dtoj-code-preview="qoj"] pre.dtoj-reading-code :is(.token.macro-name:not(.function), .token.expression) {
  color: #000000 !important;
  font-weight: 400 !important;
}

html[data-dtoj-code-theme="qoj"] pre.dtoj-reading-code:not([data-dtoj-code-preview] pre) :is(.token.macro-name.dtoj-qoj-type),
html[data-dtoj-code-theme] [data-dtoj-code-preview="qoj"] pre.dtoj-reading-code :is(.token.macro-name.dtoj-qoj-type) {
  color: #0000ff !important;
}

html[data-dtoj-code-theme="qoj"] pre.dtoj-reading-code:not([data-dtoj-code-preview] pre) :is(.token.escape, .hljs-char.escape_, .se),
html[data-dtoj-code-theme] [data-dtoj-code-preview="qoj"] pre.dtoj-reading-code :is(.token.escape, .hljs-char.escape_, .se) {
  color: #c42da8 !important;
}


html[data-dtoj-code-theme="qoj"] pre.dtoj-reading-code:not([data-dtoj-code-preview] pre) :is(.token.boolean, .dtoj-qoj-boolean),
html[data-dtoj-code-theme] [data-dtoj-code-preview="qoj"] pre.dtoj-reading-code :is(.token.boolean, .dtoj-qoj-boolean) {
  color: #0000ff !important;
  font-weight: 700 !important;
}

/* Ten additional reading palettes. Source hashes and all readability adaptations
 * are recorded in ../evidence/theme-references.json. No component geometry. */

/* GitHub 浅色 */
html[data-dtoj-code-theme="github-light"],
[data-dtoj-code-preview="github-light"] {
  --dtoj-code-bg: #ffffff;
  --dtoj-code-text: #1f2328;
  --dtoj-code-border: #d0d7de;
  --dtoj-code-header: #f6f8fa;
  --dtoj-code-muted: #656d76;
  --dtoj-code-gutter: #6d7680;
  --dtoj-code-comment: #6d7680;
  --dtoj-code-keyword: #cf222e;
  --dtoj-code-string: #0a3069;
  --dtoj-code-number: #0550ae;
  --dtoj-code-function: #8250df;
  --dtoj-code-type: #953800;
  --dtoj-code-attr: #116329;
  --dtoj-code-operator: #cf222e;
  --dtoj-code-punctuation: #57606a;
  --dtoj-code-deleted: #82071e;
  --dtoj-code-hover: #eaeef2;
  --dtoj-code-focus: #0969da;
  --dtoj-code-selection-bg: #b6d7fb;
  --dtoj-code-selection-text: #1f2328;
  --dtoj-code-scrollbar: #8c959f;
  --dtoj-code-scrollbar-hover: #6e7781;
  --dtoj-code-highlight: #f6f8fa;
  --dtoj-code-clear: transparent;
  --dtoj-code-scheme: light;
}

/* GitHub 深色 */
html[data-dtoj-code-theme="github-dark"],
[data-dtoj-code-preview="github-dark"] {
  --dtoj-code-bg: #0d1117;
  --dtoj-code-text: #e6edf3;
  --dtoj-code-border: #30363d;
  --dtoj-code-header: #161b22;
  --dtoj-code-muted: #8b949e;
  --dtoj-code-gutter: #8b949e;
  --dtoj-code-comment: #8b949e;
  --dtoj-code-keyword: #ff7b72;
  --dtoj-code-string: #a5d6ff;
  --dtoj-code-number: #79c0ff;
  --dtoj-code-function: #d2a8ff;
  --dtoj-code-type: #ffa657;
  --dtoj-code-attr: #7ee787;
  --dtoj-code-operator: #ff7b72;
  --dtoj-code-punctuation: #8b949e;
  --dtoj-code-deleted: #ffdcd7;
  --dtoj-code-hover: #21262d;
  --dtoj-code-focus: #58a6ff;
  --dtoj-code-selection-bg: #264f78;
  --dtoj-code-selection-text: #e6edf3;
  --dtoj-code-scrollbar: #6e7681;
  --dtoj-code-scrollbar-hover: #8b949e;
  --dtoj-code-highlight: #161b22;
  --dtoj-code-clear: transparent;
  --dtoj-code-scheme: dark;
}

/* Dracula */
html[data-dtoj-code-theme="dracula"],
[data-dtoj-code-preview="dracula"] {
  --dtoj-code-bg: #282a36;
  --dtoj-code-text: #f8f8f2;
  --dtoj-code-border: #44475a;
  --dtoj-code-header: #21222c;
  --dtoj-code-muted: #7d8ab2;
  --dtoj-code-gutter: #8692b7;
  --dtoj-code-comment: #8692b7;
  --dtoj-code-keyword: #ff79c6;
  --dtoj-code-string: #f1fa8c;
  --dtoj-code-number: #bd93f9;
  --dtoj-code-function: #50fa7b;
  --dtoj-code-type: #8be9fd;
  --dtoj-code-attr: #50fa7b;
  --dtoj-code-operator: #ff79c6;
  --dtoj-code-punctuation: #f8f8f2;
  --dtoj-code-deleted: #ff5858;
  --dtoj-code-hover: #44475a;
  --dtoj-code-focus: #bd93f9;
  --dtoj-code-selection-bg: #44475a;
  --dtoj-code-selection-text: #f8f8f2;
  --dtoj-code-scrollbar: #6272a4;
  --dtoj-code-scrollbar-hover: #bd93f9;
  --dtoj-code-highlight: #343746;
  --dtoj-code-clear: transparent;
  --dtoj-code-scheme: dark;
}

/* Monokai */
html[data-dtoj-code-theme="monokai"],
[data-dtoj-code-preview="monokai"] {
  --dtoj-code-bg: #272822;
  --dtoj-code-text: #f8f8f2;
  --dtoj-code-border: #414339;
  --dtoj-code-header: #1e1f1c;
  --dtoj-code-muted: #8c8874;
  --dtoj-code-gutter: #90908a;
  --dtoj-code-comment: #93907c;
  --dtoj-code-keyword: #f94f8b;
  --dtoj-code-string: #e6db74;
  --dtoj-code-number: #ae81ff;
  --dtoj-code-function: #a6e22e;
  --dtoj-code-type: #66d9ef;
  --dtoj-code-attr: #a6e22e;
  --dtoj-code-operator: #f94f8b;
  --dtoj-code-punctuation: #f8f8f2;
  --dtoj-code-deleted: #f94f8b;
  --dtoj-code-hover: #414339;
  --dtoj-code-focus: #e6db74;
  --dtoj-code-selection-bg: #414339;
  --dtoj-code-selection-text: #f8f8f2;
  --dtoj-code-scrollbar: #75715e;
  --dtoj-code-scrollbar-hover: #99947c;
  --dtoj-code-highlight: #3e3d32;
  --dtoj-code-clear: transparent;
  --dtoj-code-scheme: dark;
}

/* One Dark */
html[data-dtoj-code-theme="one-dark"],
[data-dtoj-code-preview="one-dark"] {
  --dtoj-code-bg: #282c34;
  --dtoj-code-text: #acb3c0;
  --dtoj-code-border: #3e4451;
  --dtoj-code-header: #21252b;
  --dtoj-code-muted: #868d9a;
  --dtoj-code-gutter: #90959c;
  --dtoj-code-comment: #90959c;
  --dtoj-code-keyword: #c678dd;
  --dtoj-code-string: #98c379;
  --dtoj-code-number: #d19a66;
  --dtoj-code-function: #61afef;
  --dtoj-code-type: #e5c07b;
  --dtoj-code-attr: #e1737b;
  --dtoj-code-operator: #56b6c2;
  --dtoj-code-punctuation: #abb2bf;
  --dtoj-code-deleted: #e1737b;
  --dtoj-code-hover: #3e4451;
  --dtoj-code-focus: #61afef;
  --dtoj-code-selection-bg: #3e4451;
  --dtoj-code-selection-text: #acb3c0;
  --dtoj-code-scrollbar: #5c6370;
  --dtoj-code-scrollbar-hover: #828997;
  --dtoj-code-highlight: #2c313a;
  --dtoj-code-clear: transparent;
  --dtoj-code-scheme: dark;
}

/* Nord */
html[data-dtoj-code-theme="nord"],
[data-dtoj-code-preview="nord"] {
  --dtoj-code-bg: #2e3440;
  --dtoj-code-text: #d8dee9;
  --dtoj-code-border: #4c566a;
  --dtoj-code-header: #3b4252;
  --dtoj-code-muted: #d8dee9;
  --dtoj-code-gutter: #999ea7;
  --dtoj-code-comment: #999ea7;
  --dtoj-code-keyword: #81a1c1;
  --dtoj-code-string: #a3be8c;
  --dtoj-code-number: #b792b0;
  --dtoj-code-function: #88c0d0;
  --dtoj-code-type: #8fbcbb;
  --dtoj-code-attr: #8fbcbb;
  --dtoj-code-operator: #81a1c1;
  --dtoj-code-punctuation: #d8dee9;
  --dtoj-code-deleted: #cf8b8f;
  --dtoj-code-hover: #434c5e;
  --dtoj-code-focus: #88c0d0;
  --dtoj-code-selection-bg: #434c5e;
  --dtoj-code-selection-text: #eceff4;
  --dtoj-code-scrollbar: #4c566a;
  --dtoj-code-scrollbar-hover: #81a1c1;
  --dtoj-code-highlight: #3b4252;
  --dtoj-code-clear: transparent;
  --dtoj-code-scheme: dark;
}

/* Solarized 浅色 */
html[data-dtoj-code-theme="solarized-light"],
[data-dtoj-code-preview="solarized-light"] {
  --dtoj-code-bg: #fdf6e3;
  --dtoj-code-text: #53646a;
  --dtoj-code-border: #93a1a1;
  --dtoj-code-header: #eee8d5;
  --dtoj-code-muted: #556a71;
  --dtoj-code-gutter: #687171;
  --dtoj-code-comment: #687171;
  --dtoj-code-keyword: #687704;
  --dtoj-code-string: #247c76;
  --dtoj-code-number: #c7347b;
  --dtoj-code-function: #2275af;
  --dtoj-code-type: #8c6b04;
  --dtoj-code-attr: #c14816;
  --dtoj-code-operator: #687704;
  --dtoj-code-punctuation: #5f737a;
  --dtoj-code-deleted: #d2302e;
  --dtoj-code-hover: #e6dfca;
  --dtoj-code-focus: #268bd2;
  --dtoj-code-selection-bg: #eee8d5;
  --dtoj-code-selection-text: #556a71;
  --dtoj-code-scrollbar: #93a1a1;
  --dtoj-code-scrollbar-hover: #657b83;
  --dtoj-code-highlight: #eee8d5;
  --dtoj-code-clear: transparent;
  --dtoj-code-scheme: light;
}

/* Solarized 深色 */
html[data-dtoj-code-theme="solarized-dark"],
[data-dtoj-code-preview="solarized-dark"] {
  --dtoj-code-bg: #002b36;
  --dtoj-code-text: #8e9d9e;
  --dtoj-code-border: #586e75;
  --dtoj-code-header: #073642;
  --dtoj-code-muted: #93a1a1;
  --dtoj-code-gutter: #829296;
  --dtoj-code-comment: #829296;
  --dtoj-code-keyword: #859900;
  --dtoj-code-string: #2aa198;
  --dtoj-code-number: #dc669e;
  --dtoj-code-function: #3a95d5;
  --dtoj-code-type: #b58900;
  --dtoj-code-attr: #d6744a;
  --dtoj-code-operator: #859900;
  --dtoj-code-punctuation: #839496;
  --dtoj-code-deleted: #e46865;
  --dtoj-code-hover: #073642;
  --dtoj-code-focus: #268bd2;
  --dtoj-code-selection-bg: #073642;
  --dtoj-code-selection-text: #93a1a1;
  --dtoj-code-scrollbar: #586e75;
  --dtoj-code-scrollbar-hover: #839496;
  --dtoj-code-highlight: #073642;
  --dtoj-code-clear: transparent;
  --dtoj-code-scheme: dark;
}

/* Gruvbox 浅色 */
html[data-dtoj-code-theme="gruvbox-light"],
[data-dtoj-code-preview="gruvbox-light"] {
  --dtoj-code-bg: #fbf1c7;
  --dtoj-code-text: #3c3836;
  --dtoj-code-border: #d5c4a1;
  --dtoj-code-header: #ebdbb2;
  --dtoj-code-muted: #665c54;
  --dtoj-code-gutter: #766a5f;
  --dtoj-code-comment: #766a5f;
  --dtoj-code-keyword: #9d0006;
  --dtoj-code-string: #746f0e;
  --dtoj-code-number: #8f3f71;
  --dtoj-code-function: #746f0e;
  --dtoj-code-type: #946213;
  --dtoj-code-attr: #407756;
  --dtoj-code-operator: #af3a03;
  --dtoj-code-punctuation: #3c3836;
  --dtoj-code-deleted: #9d0006;
  --dtoj-code-hover: #d5c4a1;
  --dtoj-code-focus: #076678;
  --dtoj-code-selection-bg: #d5c4a1;
  --dtoj-code-selection-text: #3c3836;
  --dtoj-code-scrollbar: #928374;
  --dtoj-code-scrollbar-hover: #665c54;
  --dtoj-code-highlight: #f2e5bc;
  --dtoj-code-clear: transparent;
  --dtoj-code-scheme: light;
}

/* Gruvbox 深色 */
html[data-dtoj-code-theme="gruvbox-dark"],
[data-dtoj-code-preview="gruvbox-dark"] {
  --dtoj-code-bg: #282828;
  --dtoj-code-text: #ebdbb2;
  --dtoj-code-border: #504945;
  --dtoj-code-header: #3c3836;
  --dtoj-code-muted: #bdae93;
  --dtoj-code-gutter: #9b8e7f;
  --dtoj-code-comment: #9b8e7f;
  --dtoj-code-keyword: #fb5844;
  --dtoj-code-string: #b8bb26;
  --dtoj-code-number: #d3869b;
  --dtoj-code-function: #b8bb26;
  --dtoj-code-type: #fabd2f;
  --dtoj-code-attr: #8ec07c;
  --dtoj-code-operator: #fe8019;
  --dtoj-code-punctuation: #ebdbb2;
  --dtoj-code-deleted: #fb5844;
  --dtoj-code-hover: #504945;
  --dtoj-code-focus: #83a598;
  --dtoj-code-selection-bg: #504945;
  --dtoj-code-selection-text: #ebdbb2;
  --dtoj-code-scrollbar: #928374;
  --dtoj-code-scrollbar-hover: #bdae93;
  --dtoj-code-highlight: #3c3836;
  --dtoj-code-clear: transparent;
  --dtoj-code-scheme: dark;
}


/* Frame style is assigned to each reading surface so an unsaved preview is local. */
html[data-dtoj-code-theme][data-dtoj-code-frame] pre.dtoj-reading-code[data-dtoj-code-frame="plain"],
html[data-dtoj-code-theme][data-dtoj-code-frame] .dtoj-reading-code-frame[data-dtoj-code-frame="plain"],
html[data-dtoj-code-theme][data-dtoj-code-frame] #panel pre.dtoj-reading-code[data-dtoj-code-frame="plain"],
html[data-dtoj-code-theme][data-dtoj-code-frame] #panel .dtoj-reading-code-frame[data-dtoj-code-frame="plain"] {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
html[data-dtoj-code-theme][data-dtoj-code-frame] pre.dtoj-reading-code[data-dtoj-code-frame="plain"],
html[data-dtoj-code-theme][data-dtoj-code-frame] #panel pre.dtoj-reading-code[data-dtoj-code-frame="plain"] {
  padding-top: 14px !important;
  padding-bottom: 14px !important;
}
html[data-dtoj-code-theme][data-dtoj-code-frame] pre.dtoj-reading-code[data-dtoj-code-frame="plain"]::before,
html[data-dtoj-code-theme][data-dtoj-code-frame] pre.dtoj-reading-code[data-dtoj-code-frame="plain"]::after,
html[data-dtoj-code-theme][data-dtoj-code-frame] #panel pre.dtoj-reading-code[data-dtoj-code-frame="plain"]::before,
html[data-dtoj-code-theme][data-dtoj-code-frame] #panel pre.dtoj-reading-code[data-dtoj-code-frame="plain"]::after {
  display: none !important;
  content: none !important;
}
html[data-dtoj-code-theme][data-dtoj-code-frame] pre.dtoj-reading-code[data-dtoj-code-frame="plain"] .line-highlight,
html[data-dtoj-code-theme][data-dtoj-code-frame] #panel pre.dtoj-reading-code[data-dtoj-code-frame="plain"] .line-highlight {
  margin-top: 14px !important;
}
/* Native Prism copy actions move above the code rather than covering its first line. */
html[data-dtoj-code-theme][data-dtoj-code-frame] .code-toolbar.dtoj-reading-code-frame[data-dtoj-code-frame="plain"],
html[data-dtoj-code-theme][data-dtoj-code-frame] #panel .code-toolbar.dtoj-reading-code-frame[data-dtoj-code-frame="plain"] {
  display: flex !important;
  flex-direction: column;
  min-width: 0;
}
html[data-dtoj-code-theme][data-dtoj-code-frame] .code-toolbar.dtoj-reading-code-frame[data-dtoj-code-frame="plain"] > .toolbar,
html[data-dtoj-code-theme][data-dtoj-code-frame] #panel .code-toolbar.dtoj-reading-code-frame[data-dtoj-code-frame="plain"] > .toolbar {
  position: static !important;
  order: -1;
  display: flex !important;
  align-items: center;
  justify-content: flex-end;
  align-self: stretch;
  inset: auto !important;
  width: auto !important;
  margin: 0 !important;
  padding: 3px 8px !important;
  opacity: 1 !important;
  transform: none !important;
  pointer-events: auto !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
html[data-dtoj-code-theme][data-dtoj-code-frame] .code-toolbar.dtoj-reading-code-frame[data-dtoj-code-frame="plain"] > pre,
html[data-dtoj-code-theme][data-dtoj-code-frame] #panel .code-toolbar.dtoj-reading-code-frame[data-dtoj-code-frame="plain"] > pre {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  margin: 0 !important;
}
/* DTAI and paste keep their real language/copy controls as a simple tool row. */
html[data-dtoj-code-theme][data-dtoj-code-frame] .dtoj-reading-code-frame[data-dtoj-code-frame="plain"] > :is(.pet-ai-code-header, .paste-code-head),
html[data-dtoj-code-theme][data-dtoj-code-frame] #panel .dtoj-reading-code-frame[data-dtoj-code-frame="plain"] > :is(.pet-ai-code-header, .paste-code-head) {
  background-color: var(--dtoj-code-bg) !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding-left: 12px !important;
}
html[data-dtoj-code-theme][data-dtoj-code-frame] .dtoj-reading-code-frame[data-dtoj-code-frame="plain"] .pet-ai-code-dots {
  display: none !important;
}
/* Paste has its own copy button; retain its existing suppression of Prism's duplicate. */
html[data-dtoj-code-theme][data-dtoj-code-frame] #paste-ui .paste-code.dtoj-reading-code-frame[data-dtoj-code-frame="plain"] .code-toolbar > .toolbar {
  display: none !important;
}
/* The preview's caption describes the controls; only its code surface gets chrome. */
html[data-dtoj-code-theme] .dtoj-code-theme-preview {
  border: 0;
  border-radius: 0;
  background: transparent;
  overflow: visible;
}
html[data-dtoj-code-theme] .dtoj-code-theme-preview-label {
  padding: 8px 0;
  border: 0;
  background: transparent;
  color: inherit;
}
html[data-dtoj-code-theme] .dtoj-code-preview-surface {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  background: var(--dtoj-code-bg);
  border: 1px solid var(--dtoj-code-border);
  border-radius: 8px;
}
html[data-dtoj-code-theme] .dtoj-code-preview-chrome {
  display: flex;
  align-items: center;
  gap: 16px;
  height: 30px;
  padding: 0 14px;
  border-bottom: 1px solid var(--dtoj-code-border);
  background: var(--dtoj-code-header);
  color: var(--dtoj-code-muted);
  font-size: 11px;
  line-height: 1;
}
.dtoj-code-preview-dots { display: flex; gap: 7px; }
.dtoj-code-preview-dots i { width: 9px; height: 9px; border-radius: 50%; background: #ff5f57; }
.dtoj-code-preview-dots i:nth-child(2) { background: #febc2e; }
.dtoj-code-preview-dots i:nth-child(3) { background: #28c840; }
html[data-dtoj-code-theme] [data-dtoj-code-frame-preview="plain"] .dtoj-code-preview-surface {
  border: 0;
  border-radius: 0;
}
html[data-dtoj-code-theme] [data-dtoj-code-frame-preview="plain"] .dtoj-code-preview-chrome {
  display: none;
}
/* Native preview wrappers are deliberately invisible; its authored chrome is above. */
html[data-dtoj-code-theme][data-dtoj-code-frame] .dtoj-code-theme-preview .code-toolbar > .toolbar {
  display: none !important;
}
@media print {
  html[data-dtoj-code-theme][data-dtoj-code-frame] .code-toolbar.dtoj-reading-code-frame[data-dtoj-code-frame="plain"] > .toolbar,
  html[data-dtoj-code-theme][data-dtoj-code-frame] #panel .code-toolbar.dtoj-reading-code-frame[data-dtoj-code-frame="plain"] > .toolbar { display: none !important; }
}
