/* KernelInk surface and reader refinements. */

html[data-theme="light"] {
  --accent-strong: #1f6d38;
  --syntax-blue: #285ea8;
  --syntax-purple: #70419a;
  --syntax-amber: #855900;
  --syntax-red: #ad3343;
  --syntax-cyan: #087267;

  --bg: #f7faf8;
  --bg-deep: #eef5f0;
  --bg-raised: #fcfdfc;
  --surface: #ffffff;
  --surface-2: #f6faf7;
  --surface-3: #edf5f0;
  --glass: rgba(255, 255, 255, 0.91);
  --glass-strong: rgba(255, 255, 255, 0.97);
  --glass-soft: rgba(31, 109, 56, 0.035);
  --line: rgba(31, 69, 45, 0.12);
  --line-strong: rgba(31, 69, 45, 0.2);
  --line-accent: rgba(var(--accent-rgb), 0.32);

  --text: #18231d;
  --text-soft: #4a5d52;
  --text-dim: #64736b;
  --text-inverse: #09210f;
  --code-comment: #66776d;

  --editor-rail: #edf4ef;
  --editor-bar: #f4f8f5;
  --editor-code: #fbfdfc;
  --editor-active: #ffffff;
  --editor-gutter: #f0f6f2;

  --shadow-panel: 0 16px 40px rgba(29, 58, 40, 0.075), 0 1px 2px rgba(29, 58, 40, 0.045);
  --shadow-float: 0 22px 58px rgba(29, 58, 40, 0.13), 0 2px 6px rgba(29, 58, 40, 0.05);
  --shadow-reader: 0 14px 34px rgba(29, 58, 40, 0.07), 0 1px 2px rgba(29, 58, 40, 0.04);
  --shadow-compact: 0 8px 22px rgba(29, 58, 40, 0.075);
  --shadow-inner: inset 0 1px 0 rgba(255, 255, 255, 0.92);
}

@supports (color: color-mix(in srgb, #000 50%, #fff)) {
  html[data-theme="light"] {
    --accent-strong: color-mix(in srgb, var(--accent) 35%, #123e20);
  }
}

html[data-theme="light"] .nb-bg {
  background:
    radial-gradient(860px 500px at 5% -12%, rgba(var(--accent-rgb), 0.075), transparent 64%),
    radial-gradient(720px 460px at 100% 98%, rgba(40, 94, 168, 0.045), transparent 68%),
    linear-gradient(145deg, var(--bg-deep), var(--bg) 48%, var(--bg-raised));
}

html[data-theme="light"] .nb-grid {
  opacity: 0.24;
  background-image:
    linear-gradient(rgba(31, 109, 56, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(31, 109, 56, 0.04) 1px, transparent 1px);
}

html[data-theme="light"] .nb-noise {
  opacity: 0.008;
}

html[data-theme="light"] :is(
  .nb-header-shell,
  .nb-workbench,
  .nb-posts,
  .nb-sidebar,
  .nb-article-header,
  .nb-document-shell,
  .nb-search-panel,
  .nb-qr-dialog
) {
  background-color: var(--surface);
}

html[data-theme="light"] :is(.nb-search, .nb-qr-backdrop) {
  background: rgba(235, 245, 239, 0.92);
}

html[data-theme="light"] .nb-workbench-main.is-drawer-open::after {
  background: rgba(39, 75, 52, 0.12);
}

html[data-theme="light"] .nb-workbench-drawer {
  box-shadow: 18px 0 34px rgba(29, 58, 40, 0.11);
}

html[data-theme="light"] .nb-card-cover img {
  filter: saturate(0.95) contrast(1.015);
}

html[data-theme="light"] .nb-cover-shade {
  background: linear-gradient(135deg, transparent 42%, rgba(24, 69, 41, 0.085));
}

html[data-theme="light"] :is(.nb-filter, .nb-document-bar, .nb-reader-context, .nb-toc-rail-head) {
  background-color: var(--editor-bar);
}

html[data-theme="light"] :is(.nb-card:hover, .nb-widget-link-card:hover, .neighbor-link:hover) {
  background-color: var(--surface-2);
}

/* Keep post-content modules away from the document shell edges while the
   Markdown editor surface and its status bar remain intentionally flush. */
.nb-article-after {
  min-width: 0;
  padding: 0 clamp(18px, 2.35vw, 34px) clamp(24px, 3vw, 40px);
}

.nb-article-after > * {
  max-width: 100%;
}

.nb-article-after .nb-article-tags {
  margin-top: clamp(18px, 2.2vw, 28px);
}

@media (max-width: 720px) {
  .nb-article-after {
    padding-right: clamp(12px, 4vw, 18px);
    padding-bottom: 24px;
    padding-left: clamp(12px, 4vw, 18px);
  }
}

@media (forced-colors: active) {
  .nb-article-after {
    border-right: 1px solid CanvasText;
    border-bottom: 1px solid CanvasText;
    border-left: 1px solid CanvasText;
  }
}