body {
      font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
      background-color: #f8fafc;
      color: #0f172a;
    }
    code, pre, .font-mono {
      font-family: 'JetBrains Mono', monospace;
    }
    .step-html-content h1, .step-html-content h2, .step-html-content h3 {
      font-weight: 700;
      color: #1e293b;
      margin-top: 0.5rem;
      margin-bottom: 0.65rem;
      font-size: 1.05rem;
    }
    .step-html-content p {
      margin-bottom: 0.65rem;
      line-height: 1.6;
    }
    .step-html-content ul, .step-html-content ol {
      margin-left: 1.25rem;
      margin-bottom: 0.75rem;
      list-style-type: disc;
    }
    .step-html-content table {
      border-collapse: collapse;
      margin: 0.75rem 0;
      max-width: 100%;
      overflow-x: auto;
      display: block;
      font-size: 0.9rem;
    }
    .step-html-content td, .step-html-content th {
      border: 1px solid #cbd5e1;
      padding: 0.35rem 0.6rem;
    }
    .step-html-content img {
      max-width: 100%;
      height: auto;
      border-radius: 0.5rem;
      margin: 0.5rem auto;
      display: block;
    }
    .step-html-content a {
      color: #2563eb;
      text-decoration: underline;
      font-weight: 500;
    }
    .step-html-content pre {
      background: #0f172a;
      color: #f8fafc;
      padding: 0.75rem 1rem;
      border-radius: 0.5rem;
      overflow-x: auto;
      margin: 0.65rem 0;
      font-size: 0.85rem;
    }
    .custom-scrollbar::-webkit-scrollbar {
      width: 6px;
      height: 6px;
    }
    .custom-scrollbar::-webkit-scrollbar-track {
      background: #f1f5f9;
    }
    .custom-scrollbar::-webkit-scrollbar-thumb {
      background: #cbd5e1;
      border-radius: 3px;
    }
    /* Small utility fallbacks for markup added after the committed Tailwind build. */
    .absolute { position: absolute; }
    .inset-y-0 { top: 0; bottom: 0; }
    .left-2\.5 { left: 0.625rem; }
    .min-w-0 { min-width: 0; }
    .shrink-0 { flex-shrink: 0; }
    .pointer-events-none { pointer-events: none; }
    #bankTopicPlaceholder.hidden { display: none; }

    /* Grouped task cards: one card can contain several subpoints (№1, №2, №3) */
    .bank-group-card {
      transition: border-color 0.15s ease, box-shadow 0.15s ease;
    }
    .bank-group-card:hover {
      border-color: #c7d2fe;
    }
    .bank-subpoint {
      background: #f8fafc;
      border: 1px solid #e2e8f0;
      border-radius: 0.85rem;
      padding: 0.9rem 1rem;
    }
    .bank-subpoint + .bank-subpoint {
      margin-top: 0.75rem;
    }
    .bank-subpoint .step-html-content p:last-child {
      margin-bottom: 0;
    }

    /* Python code editor (CodeMirror) */
    .code-editor-host .CodeMirror {
      height: auto;
      min-height: 120px;
      font-family: 'JetBrains Mono', monospace;
      font-size: 12px;
      line-height: 1.55;
      border-radius: 0.5rem;
    }
    .code-editor-host .CodeMirror-scroll {
      min-height: 120px;
    }
    .code-editor-host .CodeMirror.cm-s-default {
      background: #f8fafc;
      color: #0f172a;
    }
    .code-editor-host .CodeMirror-gutters {
      background: #eef2f7;
      border-right: 1px solid #e2e8f0;
    }
    .code-editor-host .CodeMirror-linenumber {
      color: #94a3b8;
    }
    .code-editor-host .CodeMirror-cursor {
      border-left: 2px solid #2563eb;
    }
    .code-editor-host .CodeMirror-selected {
      background: #dbeafe;
    }
    .code-error-trace {
      background: #fff1f2;
      border: 1px solid #fecdd3;
      color: #9f1239;
      white-space: pre-wrap;
      word-break: break-word;
      max-height: 160px;
      overflow: auto;
    }