/* ============================================================================
   nbconvert "basic" output, skinned to match the instrument theme.
   ========================================================================== */

.nb-head {
  border-bottom: 1px solid var(--border); background: var(--bg-alt);
  padding-block: 2rem 1.75rem; position: relative; overflow: hidden;
  background-image:
    linear-gradient(var(--grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid) 1px, transparent 1px);
  background-size: 34px 34px;
}
.nb-head > * { position: relative; z-index: 1; }
.nb-head .back {
  font-family: var(--ff-mono); font-size: .72rem; letter-spacing: .12em; text-transform: uppercase;
  color: var(--muted); display: inline-block; margin-bottom: 1.1rem;
}
.nb-head .back:hover { color: var(--accent); }
.nb-head h1 { font-size: clamp(1.45rem, 3.2vw, 2.1rem); margin-bottom: .35rem; }
.nb-file {
  font-family: var(--ff-mono); font-size: .74rem; color: var(--accent);
  margin: 0 0 1.2rem; word-break: break-all; letter-spacing: .02em;
}
.nb-stats {
  display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.5rem;
  font-family: var(--ff-mono); font-size: .69rem; color: var(--muted);
  letter-spacing: .13em; text-transform: uppercase;
  padding-top: 1rem; border-top: 1px dashed var(--border-2);
}
.nb-stats .btn { margin-left: auto; letter-spacing: .07em; }
@media (max-width: 660px) { .nb-stats .btn { margin-left: 0; } }

.nb-layout { display: grid; grid-template-columns: 236px minmax(0, 1fr); gap: 2.5rem; padding-block: 2.25rem 4rem; align-items: start; }
@media (max-width: 1040px) { .nb-layout { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; } }

.nb-toc { position: sticky; top: 100px; max-height: calc(100dvh - 130px); overflow-y: auto; font-size: .8rem; }
.nb-toc h4 {
  font-family: var(--ff-mono); font-size: .645rem; letter-spacing: .19em; text-transform: uppercase;
  color: var(--accent); font-weight: 500; margin-bottom: .8rem;
}
.nb-toc ul { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--border); }
.nb-toc li { margin: 0; }
.nb-toc a {
  display: block; padding: .28rem .75rem; color: var(--text-2);
  border-left: 2px solid transparent; margin-left: -1px; line-height: 1.45;
}
.nb-toc a:hover { color: var(--accent); border-left-color: var(--accent); text-decoration: none; }
.nb-toc .lvl1 a { font-weight: 600; color: var(--text); }
.nb-toc .lvl2 a { padding-left: 1.15rem; }
.nb-toc .lvl3 a { padding-left: 1.7rem; font-size: .95em; color: var(--muted); }
@media (max-width: 1040px) {
  .nb-toc { position: static; max-height: 260px; border: 1px solid var(--border); border-radius: var(--radius); padding: 1rem 1.1rem; background: var(--surface); }
}

.nb-body { min-width: 0; }

/* --- cells --- */
.nb-body .cell { margin-bottom: 1.4rem; }
.nb-body .prompt, .nb-body .prompt_container { display: none; }
.nb-body .inner_cell { min-width: 0; }

/* markdown cells */
.nb-body .text_cell_render { color: var(--text-2); max-width: 78ch; }
.nb-body .text_cell_render h1 {
  font-family: var(--ff-mono); font-weight: 500; letter-spacing: -.03em;
  font-size: clamp(1.35rem, 2.8vw, 1.8rem); margin: 2.8rem 0 .8rem;
  padding-bottom: .5rem; border-bottom: 1px solid var(--border);
}
.nb-body .text_cell_render h2 {
  font-family: var(--ff-mono); font-weight: 500; letter-spacing: -.025em;
  font-size: 1.28rem; margin: 2.2rem 0 .6rem;
}
.nb-body .text_cell_render h3 { font-size: 1.04rem; margin: 1.8rem 0 .5rem; font-family: var(--ff-sans); font-weight: 600; }
.nb-body .text_cell_render h4 { font-size: .95rem; margin: 1.4rem 0 .4rem; font-family: var(--ff-sans); font-weight: 600; }
.nb-body .text_cell_render p { margin: 0 0 .9em; }
.nb-body .text_cell_render ul, .nb-body .text_cell_render ol { padding-left: 1.4rem; margin: 0 0 1em; }
.nb-body .text_cell_render li { margin-bottom: .38em; }
.nb-body .text_cell_render li::marker { color: var(--accent); font-family: var(--ff-mono); font-size: .85em; }
.nb-body .text_cell_render code {
  background: var(--surface-2); border: 1px solid var(--border);
  padding: .06em .34em; border-radius: 2px; color: var(--text); font-size: .85em;
}
.nb-body .text_cell_render hr { margin: 2rem 0; border: 0; border-top: 1px dashed var(--border-2); }
.nb-body .anchor-link { opacity: 0; margin-left: .4rem; color: var(--accent); text-decoration: none; font-weight: 400; }
.nb-body h1:hover .anchor-link, .nb-body h2:hover .anchor-link, .nb-body h3:hover .anchor-link { opacity: 1; }

/* code input */
.nb-body .input_area {
  background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius);
  overflow: hidden; position: relative;
}
.nb-body .input_area::before {
  content: "IN"; position: absolute; top: 0; right: 0;
  font-family: var(--ff-mono); font-size: .58rem; letter-spacing: .18em;
  color: var(--accent); background: var(--surface); border-left: 1px solid var(--border);
  border-bottom: 1px solid var(--border); border-radius: 0 var(--radius) 0 2px; padding: .12rem .5rem;
}
.nb-body .input_area pre, .nb-body .highlight pre {
  margin: 0; padding: .95rem 1.1rem; background: transparent; border: 0; border-radius: 0;
  font-family: var(--ff-mono); font-size: .775rem; line-height: 1.65; color: var(--text-2);
  overflow-x: auto; white-space: pre;
}

/* outputs */
.nb-body .output_wrapper { margin-top: .55rem; }
.nb-body .output_area { display: block; }
.nb-body .output_subarea { max-width: none; }
.nb-body .output_area pre {
  margin: 0 0 .5rem; padding: .8rem 1.05rem; background: var(--bg-alt);
  border: 1px solid var(--border); border-left: 2px solid var(--border-2); border-radius: 0 var(--radius) var(--radius) 0;
  font-family: var(--ff-mono); font-size: .74rem; line-height: 1.6; color: var(--text-2);
  overflow-x: auto; white-space: pre; max-height: 460px; overflow-y: auto;
}
.nb-body .output_stderr pre { border-left-color: var(--bad); }
.nb-body .output_png img, .nb-body .output_area img, .nb-body .output_jpeg img {
  background: var(--plate); border: 1px solid var(--border-2); border-radius: var(--radius);
  padding: 8px; margin: .4rem 0; max-width: 100%; height: auto; cursor: zoom-in;
}
.nb-body .output_html { overflow-x: auto; }
.nb-body .output_html table { border-collapse: collapse; font-size: .78rem; margin: .5rem 0; }
.nb-body .output_html th, .nb-body .output_html td { border: 1px solid var(--border); padding: .35rem .65rem; }
.nb-body .dataframe { background: var(--surface); }
.nb-body .jp-RenderedText, .nb-body .jp-OutputArea-output { color: var(--text-2); }

/* stray attachments / broken image refs from Kaggle */
.nb-body img[src^="attachment:"] { display: none; }

/* --- pygments : light (ink on paper) --- */
.nb-body .highlight .c, .nb-body .highlight .c1, .nb-body .highlight .cm, .nb-body .highlight .ch, .nb-body .highlight .cs { color: var(--muted); font-style: italic; }
.nb-body .highlight .k, .nb-body .highlight .kn, .nb-body .highlight .kc, .nb-body .highlight .kd, .nb-body .highlight .kr, .nb-body .highlight .kt { color: #8c3ea8; }
.nb-body .highlight .s, .nb-body .highlight .s1, .nb-body .highlight .s2, .nb-body .highlight .sa, .nb-body .highlight .sd, .nb-body .highlight .se, .nb-body .highlight .si, .nb-body .highlight .sb { color: #2c7538; }
.nb-body .highlight .mi, .nb-body .highlight .mf, .nb-body .highlight .mh, .nb-body .highlight .il, .nb-body .highlight .m { color: #b0600a; }
.nb-body .highlight .nf, .nb-body .highlight .fm { color: #0d6670; }
.nb-body .highlight .nn, .nb-body .highlight .nc { color: #1c5fa8; }
.nb-body .highlight .nb, .nb-body .highlight .bp { color: #92620a; }
.nb-body .highlight .o, .nb-body .highlight .ow, .nb-body .highlight .p { color: var(--muted); }
.nb-body .highlight .n, .nb-body .highlight .nd, .nb-body .highlight .na, .nb-body .highlight .nv { color: var(--text); }

/* --- pygments : dark (phosphor) --- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .nb-body .highlight .k,
  :root:not([data-theme="light"]) .nb-body .highlight .kn,
  :root:not([data-theme="light"]) .nb-body .highlight .kc,
  :root:not([data-theme="light"]) .nb-body .highlight .kd,
  :root:not([data-theme="light"]) .nb-body .highlight .kr,
  :root:not([data-theme="light"]) .nb-body .highlight .kt { color: #d99ae8; }
  :root:not([data-theme="light"]) .nb-body .highlight .s,
  :root:not([data-theme="light"]) .nb-body .highlight .s1,
  :root:not([data-theme="light"]) .nb-body .highlight .s2,
  :root:not([data-theme="light"]) .nb-body .highlight .sa,
  :root:not([data-theme="light"]) .nb-body .highlight .sd,
  :root:not([data-theme="light"]) .nb-body .highlight .se,
  :root:not([data-theme="light"]) .nb-body .highlight .si,
  :root:not([data-theme="light"]) .nb-body .highlight .sb { color: #7fd4a5; }
  :root:not([data-theme="light"]) .nb-body .highlight .mi,
  :root:not([data-theme="light"]) .nb-body .highlight .mf,
  :root:not([data-theme="light"]) .nb-body .highlight .mh,
  :root:not([data-theme="light"]) .nb-body .highlight .il,
  :root:not([data-theme="light"]) .nb-body .highlight .m { color: #f5a524; }
  :root:not([data-theme="light"]) .nb-body .highlight .nf,
  :root:not([data-theme="light"]) .nb-body .highlight .fm { color: #4fd1c5; }
  :root:not([data-theme="light"]) .nb-body .highlight .nn,
  :root:not([data-theme="light"]) .nb-body .highlight .nc { color: #79b8ff; }
  :root:not([data-theme="light"]) .nb-body .highlight .nb,
  :root:not([data-theme="light"]) .nb-body .highlight .bp { color: #dcae6b; }
}
:root[data-theme="dark"] .nb-body .highlight .k,
:root[data-theme="dark"] .nb-body .highlight .kn,
:root[data-theme="dark"] .nb-body .highlight .kc,
:root[data-theme="dark"] .nb-body .highlight .kd,
:root[data-theme="dark"] .nb-body .highlight .kr,
:root[data-theme="dark"] .nb-body .highlight .kt { color: #d99ae8; }
:root[data-theme="dark"] .nb-body .highlight .s,
:root[data-theme="dark"] .nb-body .highlight .s1,
:root[data-theme="dark"] .nb-body .highlight .s2,
:root[data-theme="dark"] .nb-body .highlight .sa,
:root[data-theme="dark"] .nb-body .highlight .sd,
:root[data-theme="dark"] .nb-body .highlight .se,
:root[data-theme="dark"] .nb-body .highlight .si,
:root[data-theme="dark"] .nb-body .highlight .sb { color: #7fd4a5; }
:root[data-theme="dark"] .nb-body .highlight .mi,
:root[data-theme="dark"] .nb-body .highlight .mf,
:root[data-theme="dark"] .nb-body .highlight .mh,
:root[data-theme="dark"] .nb-body .highlight .il,
:root[data-theme="dark"] .nb-body .highlight .m { color: #f5a524; }
:root[data-theme="dark"] .nb-body .highlight .nf,
:root[data-theme="dark"] .nb-body .highlight .fm { color: #4fd1c5; }
:root[data-theme="dark"] .nb-body .highlight .nn,
:root[data-theme="dark"] .nb-body .highlight .nc { color: #79b8ff; }
:root[data-theme="dark"] .nb-body .highlight .nb,
:root[data-theme="dark"] .nb-body .highlight .bp { color: #dcae6b; }

/* ANSI colours used by Keras / TF progress bars */
.nb-body .ansi-green-fg, .nb-body .ansi-green-intense-fg { color: var(--ok); }
.nb-body .ansi-red-fg, .nb-body .ansi-red-intense-fg { color: var(--bad); }
.nb-body .ansi-yellow-fg, .nb-body .ansi-yellow-intense-fg { color: var(--warn); }
.nb-body .ansi-blue-fg, .nb-body .ansi-cyan-fg { color: var(--cyan); }
.nb-body .ansi-bold { font-weight: 600; }
