/* One code component for the editor and printable documents. */
pre.shared-code-block {
  --code-syntax-keyword: #713c95; --code-syntax-string: #266637;
  --code-syntax-number: #914b14; --code-syntax-comment: #56616d;
  --code-syntax-title: #245d8d; --code-syntax-attr: #75520c;
  --code-syntax-tag: #9b3040; --code-syntax-type: #246473;
  --code-syntax-meta: #994051;
  position: relative; padding-top: 2.7em !important;
}
.preview-body pre.shared-code-block {
  --code-syntax-keyword: #c792ea; --code-syntax-string: #c3e88d;
  --code-syntax-number: #f78c6c; --code-syntax-comment: #9397a3;
  --code-syntax-title: #82aaff; --code-syntax-attr: #ffcb6b;
  --code-syntax-tag: #f07178; --code-syntax-type: #89ddff;
  --code-syntax-meta: #ff8b9e;
}
pre.shared-code-block .code-block-controls {
  position: absolute; top: .45em; right: .7em;
  display: flex; align-items: center; line-height: 1;
  font: 11px/1.3 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  user-select: none;
}
pre.shared-code-block .code-language-select {
  width: auto; max-width: 170px; padding: 3px 6px;
  border: 1px solid #b7c1cb; border-radius: 4px;
  background: #fff; color: #303a44; font: inherit; cursor: pointer;
}
.preview-body pre.shared-code-block .code-language-select { background: #22252c; color: #e0e4eb; border-color: #515766; }
pre.shared-code-block .code-language-print { display: none; }
pre.shared-code-block :is(.hljs-keyword,.hljs-selector-tag,.hljs-literal) { color: var(--code-syntax-keyword); }
pre.shared-code-block :is(.hljs-string,.hljs-addition) { color: var(--code-syntax-string); }
pre.shared-code-block .hljs-number { color: var(--code-syntax-number); }
pre.shared-code-block :is(.hljs-comment,.hljs-quote) { color: var(--code-syntax-comment); font-style: italic; }
pre.shared-code-block :is(.hljs-title,.hljs-function,.hljs-section) { color: var(--code-syntax-title); }
pre.shared-code-block :is(.hljs-attr,.hljs-attribute,.hljs-symbol) { color: var(--code-syntax-attr); }
pre.shared-code-block :is(.hljs-tag,.hljs-name,.hljs-selector-id) { color: var(--code-syntax-tag); }
pre.shared-code-block :is(.hljs-built_in,.hljs-type,.hljs-selector-class) { color: var(--code-syntax-type); }
pre.shared-code-block :is(.hljs-meta,.hljs-meta-string,.hljs-deletion) { color: var(--code-syntax-meta); }
pre.shared-code-block .hljs-emphasis { font-style: italic; }
pre.shared-code-block .hljs-strong { font-weight: 700; }
@media print {
  pre.shared-code-block .code-language-select { display: none !important; }
  pre.shared-code-block .code-language-print { display: inline; color: #4b5663; }
}

/* Light Markdown preview uses the same readable syntax palette as PDF paper. */
:is(.preview-body[data-document-theme="light"], :root[data-ui-theme="light"] .preview-body:not([data-document-theme])) pre.shared-code-block {
  --code-syntax-keyword: #713c95;
  --code-syntax-string: #266637;
  --code-syntax-number: #914b14;
  --code-syntax-comment: #56616d;
  --code-syntax-title: #245d8d;
  --code-syntax-attr: #75520c;
  --code-syntax-tag: #9b3040;
  --code-syntax-type: #246473;
  --code-syntax-meta: #994051;
}
:is(.preview-body[data-document-theme="light"], :root[data-ui-theme="light"] .preview-body:not([data-document-theme])) pre.shared-code-block .code-language-select {
  background: #fff;
  color: #303a44;
  border-color: #b7c1cb;
  color-scheme: light;
}

/* Display metadata and line numbers are outside the selectable code text. */
pre.shared-code-block:is([data-style="code-file"],[data-style="code-lines"],[data-style="code-terminal"],[data-style="code-diff"]) { border-radius:0 !important; border:1px solid var(--border-color,#ccd3dc) !important; padding:3em 1em 1em !important; overflow-wrap:anywhere; }
pre.shared-code-block[data-style="code-file"]::before { content:attr(data-design-filename); position:absolute; top:.6em; left:1em; right:13em; font: .8em/1.5 var(--code-font-family,monospace); white-space:normal; overflow-wrap:anywhere; }
pre.shared-code-block[data-style="code-file"]:not([data-design-filename])::before { content:"코드 예제"; }
pre.shared-code-block[data-style="code-file"] { padding-top:4.2em !important; }
pre.shared-code-block .code-display-line { box-sizing:border-box; white-space:pre-wrap; overflow-wrap:anywhere; }
pre.shared-code-block[data-style="code-lines"] .code-display-line { position:relative; display:inline-block; width:100%; padding-left:3.7em; vertical-align:top; min-height:1em; }
pre.shared-code-block[data-style="code-lines"] .code-display-line::before { content:attr(data-line-number); position:absolute; left:0; top:0; width:3em; padding-right:.6em; border-right:1px solid var(--border-color,#ccd3dc); text-align:right; color:var(--code-syntax-comment); font-variant-numeric:tabular-nums; user-select:none; }
pre.shared-code-block[data-style="code-terminal"] .code-display-line { display:inline-block; width:100%; padding:.25em .5em; }
pre.shared-code-block[data-style="code-terminal"] [data-code-part="command"] { border-left:2px solid var(--code-syntax-title); }
pre.shared-code-block[data-style="code-terminal"] [data-code-part="output"] { border-left:2px dashed var(--code-syntax-comment); color:var(--code-syntax-comment); }
pre.shared-code-block[data-style="code-diff"] .code-display-line { display:inline-block; width:100%; padding:0 .5em; }
pre.shared-code-block[data-style="code-diff"] [data-code-part="added"] { background:color-mix(in srgb,var(--code-syntax-string) 9%,transparent); }
pre.shared-code-block[data-style="code-diff"] [data-code-part="removed"] { background:color-mix(in srgb,var(--code-syntax-meta) 9%,transparent); }
/* File titles grow with long paths so they cannot overlap code or the language picker. */
pre.shared-code-block[data-style="code-file"]::before { position:static; display:block; margin-bottom:.8em; padding-bottom:.6em; border-bottom:1px solid var(--border-color,#ccd3dc); font-size:.85em; }
pre.shared-code-block[data-style="code-file"] { padding-top:3em !important; }
/* Standalone HTML exports have a static language label in place of the picker. */
pre.shared-code-block:not(:has(> .code-block-controls))::after { content:attr(data-code-language); position:absolute; right:1em; top:.6em; font:11px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:var(--code-syntax-comment); }