/* Bengali shaping stays enabled in prose, labels and code comments. */
@font-face {
  font-family: "Noto Sans Bengali";
  src: url("../fonts/NotoSansBengali.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
:root {
  --md-text-font: "Noto Sans Bengali", "Nirmala UI", system-ui, sans-serif;
  --md-code-font: "Cascadia Code", Consolas, "Noto Sans Bengali", monospace;
  --md-mermaid-font-family: "Noto Sans Bengali", "Nirmala UI", system-ui, sans-serif;
}
[data-md-color-scheme="default"] {
  --md-primary-fg-color: #244b57;
  --md-accent-fg-color: #087f81;
  --md-typeset-a-color: #086f80;
  --md-default-fg-color: #293645;
  --md-default-fg-color--light: #637080;
  --md-code-bg-color: #f5f7fa;
  --lesson-border: #dce3e9;
  --lesson-surface: #f7f9fb;
  --lesson-active: #e0f3f0;
  --lesson-active-ink: #075e5a;
}
[data-md-color-scheme="slate"] {
  --md-primary-fg-color: #244b57;
  --md-accent-fg-color: #73d1cc;
  --md-typeset-a-color: #80d2dc;
  --md-default-fg-color: #dce3ed;
  --md-default-fg-color--light: #a6b2c3;
  --md-code-bg-color: #202633;
  --lesson-border: #394354;
  --lesson-surface: #252c3a;
  --lesson-active: #214540;
  --lesson-active-ink: #a5eee2;
}
.md-grid { max-width: 64rem; }
.md-main__inner { margin-top: 1rem; }
.md-content__inner { margin-top: .35rem; }
.md-header__title { font-size: .78rem; }
.md-nav { font-size: .65rem; line-height: 1.6; }
.md-nav__link { margin-top: .45em; }
.md-nav--secondary > .md-nav__list { border-left: 1px solid var(--lesson-border); }
.md-nav--secondary .md-nav__link { padding-left: .15rem; }
.md-typeset {
  font-size: .75rem;
  line-height: 1.78;
  overflow-wrap: break-word;
  word-break: normal;
  letter-spacing: normal;
}
.md-typeset h1, .md-typeset h2, .md-typeset h3, .md-typeset h4 {
  color: var(--md-default-fg-color);
  line-height: 1.5;
  letter-spacing: normal;
}
.md-typeset h1 { font-size: 1.4rem; font-weight: 650; margin: .4rem 0 1rem; }
.md-typeset h2 { font-size: 1.05rem; font-weight: 650; margin: 1.65rem 0 .6rem; }
.md-typeset h3 { font-size: .86rem; font-weight: 650; margin: 1.15rem 0 .4rem; }
.md-typeset h4 { font-size: .76rem; margin: .9rem 0 .3rem; }
.md-typeset p, .md-typeset ul, .md-typeset ol { margin-top: .65em; margin-bottom: .8em; }
.md-typeset ul li, .md-typeset ol li { margin-bottom: .3em; }
.md-typeset hr { margin: 1.3rem 0; }
.md-typeset blockquote { font-size: .7rem; border-left-width: .13rem; }
.md-typeset :is(.admonition, details) { font-size: .71rem; margin: .9rem 0; box-shadow: none; }
.md-typeset table:not([class]) { font-size: .69rem; line-height: 1.65; border-radius: .3rem; }
.md-typeset table:not([class]) :is(th, td) { padding: .55em .8em; }
.md-typeset table:not([class]) th { background: var(--lesson-surface); }
.md-typeset .md-typeset__table { max-width: 100%; }
/* Code remains selectable and scrolls inside its own panel on small screens. */
.md-typeset .highlight {
  margin: .8rem 0;
  border: 1px solid var(--lesson-border);
  border-radius: .4rem;
  overflow: hidden;
  background: var(--md-code-bg-color);
}
.md-typeset .highlight > .filename {
  margin: 0;
  padding: .38rem .75rem;
  border-bottom: 1px solid var(--lesson-border);
  background: var(--lesson-surface);
  font-family: var(--md-text-font);
  font-size: .61rem;
  font-weight: 650;
  line-height: 1.5;
}
.md-typeset .highlight pre { margin: 0; }
.md-typeset pre, .md-typeset pre code {
  white-space: pre;
  overflow-wrap: normal;
  word-break: normal;
  line-height: 1.65;
  font-variant-ligatures: contextual;
  font-size: .65rem;
}
.md-typeset pre { overflow-x: auto; }
.md-typeset pre > code { padding: .75rem .85rem; }
.md-typeset .md-code__button { color: var(--md-default-fg-color--light); opacity: .75; }
.md-typeset .md-code__button:hover, .md-typeset .md-code__button:focus-visible { color: var(--md-accent-fg-color); opacity: 1; }
.md-typeset :not(pre) > code { font-size: .88em; border-radius: .18rem; padding: .08em .28em; }
.lesson-tools {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .25rem .85rem;
  padding: .3rem 0 .5rem;
  margin: 0 0 .55rem;
  border-bottom: 1px solid var(--lesson-border);
  font-size: .6rem;
  line-height: 1.6;
}
.lesson-tools > span { margin-right: auto; color: var(--md-default-fg-color--light); }
.lesson-tools a { color: var(--md-typeset-a-color); }
.lesson-tools a:hover { text-decoration: underline; }
.md-typeset .problem-source { border: 1px solid var(--lesson-border); border-radius: .4rem; padding: .55rem .75rem; background: var(--lesson-surface); font-size: .65rem; }
.md-typeset .problem-source .source-label { font-size: .65rem; font-weight: 650; margin: 0 0 .35rem; }
.md-typeset .problem-source ul { display: grid; grid-template-columns: 1fr 1fr; gap: .2rem 1rem; padding: 0; margin: 0; list-style: none; }
.md-typeset .problem-source li { margin: 0; min-width: 0; }
.md-typeset .start-links > p { margin: 0; }
.diagram-scroll {
  max-width: 100%;
  overflow-x: auto;
  margin: .9rem 0;
  border: 1px solid var(--lesson-border);
  border-radius: .4rem;
  background: var(--lesson-surface);
}
.md-typeset .mermaid { padding: .7rem .4rem; text-align: center; }
.diagram-scroll:focus-visible, .ds-canvas:focus-visible { outline: 2px solid var(--md-accent-fg-color); outline-offset: 2px; }
/* HTML diagrams: boxes, pointers and grids, also readable without JavaScript. */
.md-typeset .ds-figure {
  display: block;
  width: 100%;
  margin: .85rem 0 1rem;
  max-width: 100%;
  text-align: left;
  border: 1px solid var(--lesson-border);
  border-radius: .4rem;
  overflow: hidden;
}
.md-typeset .ds-figure > figcaption {
  max-width: none;
  margin: 0;
  padding: .5rem .75rem;
  border-bottom: 1px solid var(--lesson-border);
  background: var(--lesson-surface);
  font-size: .69rem;
  font-weight: 650;
  font-style: normal;
}
.md-typeset ol.ds-steps { list-style: none; padding: .7rem; margin: 0; display: grid; gap: .7rem; }
.md-typeset .ds-steps > li.ds-step { min-width: 0; margin: 0; }
.md-typeset .ds-step + .ds-step { padding-top: .65rem; border-top: 1px dashed var(--lesson-border); }
.md-typeset .ds-step-label { font-size: .68rem; font-weight: 600; margin: 0 0 .45rem; }
.ds-canvas { max-width: 100%; overflow-x: auto; padding: .15rem .05rem .3rem; }
.ds-board { display: table; }
.ds-row { display: flex; gap: .3rem; align-items: start; width: max-content; }
.ds-row + .ds-row { margin-top: .3rem; }
.ds-cell { position: relative; min-width: 2rem; text-align: center; flex: 0 0 auto; }
.ds-value {
  display: block;
  min-width: 2rem;
  padding: .3rem .45rem;
  border: 1px solid var(--lesson-border);
  border-radius: .25rem;
  background: var(--lesson-surface);
  font-family: var(--md-code-font);
  font-size: .68rem;
  line-height: 1.55;
}
.ds-index { display: block; color: var(--md-default-fg-color--light); font: .54rem/1.6 var(--md-code-font); }
.ds-pointer { display: block; color: var(--lesson-active-ink); font: 600 .57rem/1.7 var(--md-code-font); margin-top: .1rem; }
.ds-cell.is-active .ds-value { color: var(--lesson-active-ink); background: var(--lesson-active); border: 2px solid var(--md-accent-fg-color); padding: calc(.3rem - 1px) calc(.45rem - 1px); }
.ds-cell.is-muted .ds-value { color: var(--md-default-fg-color--light); border-style: dashed; }
.ds-arrow { align-self: center; font-size: .85rem; color: var(--md-default-fg-color--light); }
.md-typeset .ds-note { font-size: .65rem; line-height: 1.7; margin: .3rem 0 0; color: var(--md-default-fg-color--light); }
.md-typeset .ds-direction { font-size: .55rem; line-height: 1.6; color: var(--md-default-fg-color--light); margin: 0 0 .3rem; }
.ds-empty { font-size: .65rem; padding: .3rem .8rem; border: 1px dashed var(--lesson-border); border-radius: .25rem; }
.ds-status { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.ds-stack .ds-row { flex-direction: column; gap: .15rem; }
.ds-stack .ds-cell, .ds-stack .ds-value { min-width: 5rem; }
.ds-grid .ds-value { width: 2.1rem; height: 2.1rem; display: flex; align-items: center; justify-content: center; padding: .1rem; }
.ds-grid .ds-cell.is-active .ds-value { padding: calc(.1rem - 1px); }
.ds-grid .ds-row { gap: .2rem; }
.ds-grid .ds-row + .ds-row { margin-top: .2rem; }
.md-typeset .start-links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; margin: 1rem 0; }
.md-typeset .start-links a { display: block; padding: .7rem .8rem; border: 1px solid var(--lesson-border); border-radius: .4rem; font-size: .75rem; font-weight: 650; }
.md-typeset .start-links a:hover { border-color: var(--md-accent-fg-color); background: var(--lesson-surface); }
.md-typeset .start-links small { display: block; color: var(--md-default-fg-color--light); font-size: .62rem; font-weight: 400; margin-top: .2rem; }
@media (min-width: 76.25em) {
  .md-sidebar--secondary { width: 10.5rem; }
  .md-sidebar--primary { width: 12rem; }
}
@media (min-width: 50em) {
  .md-typeset .ds-steps { grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); }
  .md-typeset .ds-step + .ds-step { border-top: 0; padding-top: 0; }
}
@media (max-width: 600px) {
  .md-typeset { font-size: .75rem; }
  .md-typeset h1 { font-size: 1.2rem; }
  .md-typeset h2 { font-size: .98rem; margin-top: 1.4rem; }
  .md-typeset pre code { font-size: .63rem; }
  .md-typeset .highlight { margin-left: 0; margin-right: 0; }
  .lesson-tools { gap: .2rem .65rem; font-size: .57rem; }
  .diagram-scroll > .mermaid { min-width: 25rem; }
  .md-typeset .start-links { grid-template-columns: 1fr; gap: .4rem; }
  .md-typeset .start-links a { padding: .55rem .7rem; }
  .md-typeset .problem-source ul { grid-template-columns: 1fr; }
}
@media print {
  .lesson-tools { display: none; }
  .ds-figure, .ds-step { break-inside: avoid; }
  .ds-canvas, .diagram-scroll { overflow: visible; }
}
