/* TaskPoint — code blocks & syntax highlighting
   Palette: highlight.js "atom-one-dark". Scoped to .task-desc and forced with
   !important so it survives the blanket "#app .task-desc *{color..!important}"
   normalisation rule. Display-only: stored HTML is never touched. */

/* ---------- code box ---------- */
:is(#app,#modal-root) .task-desc pre{
  position:relative;
  margin:16px 0;
  padding:0;
  background:#282c34 !important;
  border:1px solid rgba(0,0,0,.40);
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 8px 22px -12px rgba(0,0,0,.55);
}
:is(#app,#modal-root) .task-desc pre code,
:is(#app,#modal-root) .task-desc pre code.hljs{
  display:block;
  overflow-x:auto;
  padding:36px 16px 16px !important;
  margin:0 !important;
  background:transparent !important;
  color:#abb2bf !important;
  font-family:'SF Mono','Cascadia Code',Consolas,'Roboto Mono','Courier New',monospace !important;
  font-size:13.5px !important;
  line-height:1.6 !important;
  letter-spacing:0 !important;
  white-space:pre !important;
  tab-size:2; -moz-tab-size:2;
  border:0 !important;
}
/* normalise token <span> sizing (the .task-desc blanket forces 16.5px/1.75 on every descendant) */
:is(#app,#modal-root) .task-desc pre code *{
  font-size:13.5px !important;
  line-height:1.6 !important;
  font-family:inherit !important;
}
/* top bar + language badge (one pseudo does the bar and the label) */
:is(#app,#modal-root) .task-desc pre[data-lang]::before{
  content:attr(data-lang);
  position:absolute; top:0; left:0; right:0;
  height:28px;
  padding:0 12px;
  font:700 10.5px/28px 'SF Mono',Consolas,monospace !important;
  letter-spacing:1.2px; text-transform:uppercase;
  color:#8b93a1;
  background:rgba(0,0,0,.22);
  border-bottom:1px solid rgba(255,255,255,.05);
  z-index:1;
}
/* copy button (top-right, sits above the bar) */
:is(#app,#modal-root) .task-desc pre .code-copy{
  position:absolute; top:0; right:0; height:28px; z-index:2;
  display:inline-flex; align-items:center; gap:5px;
  padding:0 11px; border:0; background:transparent; cursor:pointer;
  font:700 10.5px/28px 'SF Mono',Consolas,monospace !important;
  letter-spacing:.6px; text-transform:uppercase;
  transition:color .15s;
}
/* !important on colour/size to beat the .task-desc blanket rule */
:is(#app,#modal-root) .task-desc pre .code-copy,
:is(#app,#modal-root) .task-desc pre .code-copy *{ color:#8b93a1 !important; font-size:10.5px !important; }
:is(#app,#modal-root) .task-desc pre .code-copy:hover,
:is(#app,#modal-root) .task-desc pre .code-copy:hover *{ color:#d3d7de !important; }
:is(#app,#modal-root) .task-desc pre .code-copy.ok,
:is(#app,#modal-root) .task-desc pre .code-copy.ok *{ color:#98c379 !important; }
:is(#app,#modal-root) .task-desc pre .code-copy svg{ width:13px !important; height:13px !important; flex-shrink:0; }

/* ---------- inline code ---------- */
:is(#app,#modal-root) .task-desc code:not(.hljs):not(pre code){
  font-family:'SF Mono','Cascadia Code',Consolas,'Roboto Mono','Courier New',monospace !important;
  font-size:.88em !important;
  background:rgba(120,124,140,.16) !important;
  color:#b23b30 !important;
  padding:2px 6px !important;
  border-radius:6px !important;
  line-height:1.45 !important;
  word-break:break-word;
}
#app.aero .task-desc code:not(.hljs):not(pre code){
  background:rgba(255,255,255,.09) !important;
  color:#e7a7a7 !important;
}

/* ---------- highlight.js tokens (atom-one-dark) ---------- */
:is(#app,#modal-root) .task-desc pre .hljs-comment,
:is(#app,#modal-root) .task-desc pre .hljs-quote{ color:#7d8799 !important; font-style:italic; }
:is(#app,#modal-root) .task-desc pre .hljs-doctag,
:is(#app,#modal-root) .task-desc pre .hljs-formula,
:is(#app,#modal-root) .task-desc pre .hljs-keyword,
:is(#app,#modal-root) .task-desc pre .hljs-meta .hljs-keyword{ color:#c678dd !important; }
:is(#app,#modal-root) .task-desc pre .hljs-deletion,
:is(#app,#modal-root) .task-desc pre .hljs-name,
:is(#app,#modal-root) .task-desc pre .hljs-section,
:is(#app,#modal-root) .task-desc pre .hljs-selector-tag,
:is(#app,#modal-root) .task-desc pre .hljs-subst{ color:#e06c75 !important; }
:is(#app,#modal-root) .task-desc pre .hljs-literal{ color:#56b6c2 !important; }
:is(#app,#modal-root) .task-desc pre .hljs-addition,
:is(#app,#modal-root) .task-desc pre .hljs-attribute,
:is(#app,#modal-root) .task-desc pre .hljs-meta .hljs-string,
:is(#app,#modal-root) .task-desc pre .hljs-regexp,
:is(#app,#modal-root) .task-desc pre .hljs-string{ color:#98c379 !important; }
:is(#app,#modal-root) .task-desc pre .hljs-attr,
:is(#app,#modal-root) .task-desc pre .hljs-number,
:is(#app,#modal-root) .task-desc pre .hljs-selector-attr,
:is(#app,#modal-root) .task-desc pre .hljs-selector-class,
:is(#app,#modal-root) .task-desc pre .hljs-selector-pseudo,
:is(#app,#modal-root) .task-desc pre .hljs-template-variable,
:is(#app,#modal-root) .task-desc pre .hljs-type,
:is(#app,#modal-root) .task-desc pre .hljs-variable{ color:#d19a66 !important; }
:is(#app,#modal-root) .task-desc pre .hljs-bullet,
:is(#app,#modal-root) .task-desc pre .hljs-link,
:is(#app,#modal-root) .task-desc pre .hljs-meta,
:is(#app,#modal-root) .task-desc pre .hljs-selector-id,
:is(#app,#modal-root) .task-desc pre .hljs-symbol,
:is(#app,#modal-root) .task-desc pre .hljs-title{ color:#61afef !important; }
:is(#app,#modal-root) .task-desc pre .hljs-built_in,
:is(#app,#modal-root) .task-desc pre .hljs-class .hljs-title,
:is(#app,#modal-root) .task-desc pre .hljs-title.class_{ color:#e6c07b !important; }
:is(#app,#modal-root) .task-desc pre .hljs-emphasis{ font-style:italic !important; }
:is(#app,#modal-root) .task-desc pre .hljs-strong{ font-weight:700 !important; }